@font-face {
  font-family: 'Guide Display';
  src: url('../home/archivo-variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Guide Text';
  src: url('../home/inter-variable.woff2') format('woff2');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Guide Notes';
  src: url('../home/notes-mono.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  --page: #FFFDF5;
  --bg: #FFDC8B;
  --pink: #FE90E8;
  --blue: #C0F7FE;
  --lime: #99E885;
  --yellow: #F7CB46;
  --ink: #111111;
  --line: #000000;
  --frame: 3px solid var(--line);
  --shadow: 4px 4px 0 var(--line);
  --gap: 1.2rem;
}
* { box-sizing: border-box; }
html { color: var(--ink); background: var(--page); scroll-padding-top: 24px; }
body { margin: 0; font: 400 1rem/1.6 'Guide Text', Arial, sans-serif; }
body, button, select { font-size: 16px; }
a { color: inherit; text-underline-offset: .22em; text-decoration-thickness: 2px; }
a, button, select, summary { -webkit-tap-highlight-color: var(--blue); }
a:focus-visible, button:focus-visible, select:focus-visible, summary:focus-visible, section:focus-visible {
  outline: 3px solid var(--line); outline-offset: 4px;
  box-shadow: 0 0 0 7px var(--blue);
}
[hidden] { display: none !important; }
p { margin: 0 0 1rem; max-width: 72ch; overflow-wrap: break-word; }
p:last-child { margin-bottom: 0; }
h1, h2, h3 { font-family: 'Guide Display', 'Guide Text', sans-serif; font-weight: 700; color: var(--ink); }
h1 { font-size: 2.25rem; line-height: 1.1; letter-spacing: -.045em; margin: 0 0 24px; max-width: 20ch; text-wrap: balance; }
h2 { font-size: 1.5rem; line-height: 1.2; letter-spacing: -.025em; margin: 0 0 24px; max-width: 40ch; }
h3 { font-size: 1.2rem; line-height: 1.25; letter-spacing: -.02em; margin: 0 0 16px; }
figure { margin: 0; }
button, select, summary, input { border-radius: 0; }
button { background: var(--pink); color: var(--ink); border: var(--frame); padding: 10px 16px; font: 600 1rem/1.25 'Guide Text', sans-serif; cursor: pointer; min-height: 48px; box-shadow: var(--shadow); transition: background-color 160ms ease, transform 160ms ease; }
button:hover { background: color-mix(in srgb, var(--pink) 92%, black); }
button:active { transform: translate(-1px, -1px); }
[data-role='masthead'], [data-role='editorial-layout'], [data-role='site-footer'] { max-width: 1280px; width: calc(100% - 3rem); margin-left: auto; margin-right: auto; }
[data-role='masthead'] { padding: 24px 0; border-bottom: var(--frame); display: flex; justify-content: space-between; align-items: center; gap: 24px; }
[data-role='wordmark'] { display: flex; gap: 16px; align-items: center; text-decoration: none; font-family: 'Guide Display', sans-serif; font-size: 1.5rem; font-weight: 700; line-height: 1.05; min-height: 48px; }
[data-role='brand-sub'] { display: block; margin-top: 8px; font: 500 1rem/1.2 'Guide Text', sans-serif; letter-spacing: -.025em; }
[data-role='mark'] { display: block; width: 40px; height: 40px; border: var(--frame); box-shadow: var(--shadow); background: var(--pink); flex: 0 0 auto; }
[data-role='index-link'] { display: inline-flex; align-items: center; gap: 16px; border: var(--frame); background: var(--blue); padding: 8px 16px; min-height: 48px; font-weight: 600; text-decoration: none; box-shadow: var(--shadow); }
[data-role='index-link']:hover { background: color-mix(in srgb, var(--blue) 92%, black); }
[data-role='skip-link'] { position: absolute; left: 24px; top: -200px; z-index: 10; padding: 16px; min-height: 48px; border: var(--frame); background: var(--blue); }
[data-role='skip-link']:focus { top: 16px; }
[data-role='editorial-layout'] { display: grid; grid-template-columns: 232px minmax(0, 1fr); grid-template-areas: 'rail main'; gap: 40px; align-items: start; padding-top: 40px; }
[data-role='chapter-main'] { grid-area: main; min-width: 0; }
[data-role='chapter-rail'] { grid-area: rail; position: sticky; top: 24px; max-height: calc(100vh - 48px); overflow-y: auto; border: var(--frame); padding: 20px 16px; background: var(--page); box-shadow: var(--shadow); scrollbar-width: thin; }
[data-role='chapter-rail'] h2 { font-size: 1.5rem; margin-bottom: 24px; }
[data-role='chapter-group'] { margin-bottom: 20px; }
[data-role='chapter-label'] { font: 400 1rem/1.3 'Guide Notes', monospace; margin: 0 0 8px; }
[data-role='chapter-group'] ul { padding: 0; margin: 0; list-style: none; }
[data-role='chapter-group'] a { min-height: 44px; padding: 9px 6px; display: flex; align-items: center; justify-content: space-between; gap: 8px; text-decoration: none; font-size: 16px; line-height: 1.3; border-top: 1px solid var(--line); transition: background-color 160ms ease; }
[data-role='chapter-group'] a[aria-current='page'] { background: var(--blue); font-weight: 600; border-top: 2px solid var(--line); }
[data-role='chapter-group'] a:hover { background: var(--blue); }
[data-role='chapter-group'] a span { flex-shrink: 0; }
[data-role='back-link'] { display: flex; align-items: center; min-height: 48px; border-top: 2px solid var(--line); padding-top: 8px; font-size: 16px; }
[data-role='hero'] { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(240px, .85fr); gap: 32px; align-items: stretch; animation: rise 180ms ease-out; }
[data-role='hero'][data-home='true'] h1 { font-size: clamp(2.5rem, 5vw, 4rem); }
[data-role='hero-copy'] { padding-top: 8px; }
[data-role='eyebrow'] { display: inline-block; margin-bottom: 24px; padding: 6px 12px; border: 2px solid var(--line); background: var(--bg); font: 500 1rem/1.4 'Guide Text', sans-serif; }
[data-role='lead'] { font-size: 1.125rem; line-height: 1.6; max-width: 52ch; }
[data-role='hero-art'] { display: flex; flex-direction: column; border: var(--frame); background: var(--bg); box-shadow: var(--shadow); min-height: 320px; }
[data-role='hero-art'] figcaption { padding: 16px 20px; border-top: var(--frame); font: 400 1rem/1.4 'Guide Notes', monospace; }
[data-role='geometry'] { position: relative; flex: 1; min-height: 240px; overflow: hidden; }
[data-piece] { display: block; position: absolute; border: var(--frame); background: var(--pink); box-shadow: var(--shadow); }
[data-piece='large'] { width: 60%; height: 60%; left: 12%; top: 14%; }
[data-piece='small'] { width: 28%; aspect-ratio: 1; right: 9%; top: 8%; background: var(--page); }
[data-piece='bar'] { width: 60%; height: 17%; bottom: 8%; right: 8%; background: var(--page); }
[data-piece='cut'] { width: 29%; height: 34%; left: -3%; bottom: 12%; background: var(--line); box-shadow: none; clip-path: polygon(0 0, 100% 100%, 0 100%); }
[data-piece='square'] { width: 12%; aspect-ratio: 1; left: 24%; top: 30%; background: var(--line); box-shadow: none; }
[data-shape='diamond'] [data-piece='large'] { transform: rotate(45deg); width: 53%; height: 58%; left: 21%; top: 18%; background: var(--blue); }
[data-shape='diamond'] [data-piece='small'] { top: 13%; right: 7%; }
[data-shape='diamond'] [data-piece='square'] { left: 35%; top: 41%; width: 23%; background: var(--page); }
[data-shape='window'] [data-piece='large'] { width: 65%; left: 17%; top: 10%; background: var(--lime); }
[data-shape='window'] [data-piece='small'] { top: 27%; right: 31%; }
[data-shape='window'] [data-piece='square'] { left: 70%; top: 68%; }
[data-role='jump-panel'] { margin-top: 40px; border-top: 2px solid var(--line); border-bottom: 2px solid var(--line); padding: 16px 0; }
[data-role='section-links'] { display: flex; flex-wrap: wrap; gap: 8px 24px; }
[data-role='section-links'] a { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; }
[data-role='section-jump'] { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 16px; align-items: center; }
[data-role='section-jump'] label { font-weight: 500; font-size: 16px; }
[data-role='section-jump'] select { font: 400 1rem/1.3 'Guide Text', sans-serif; padding: 10px 32px 10px 12px; min-height: 48px; width: 100%; border: 2px solid var(--line); background: var(--page); color: var(--ink); }
[data-role='check-section'] { margin-top: clamp(4rem, 8vw, 8rem); }
[data-role='check-section'] > p { max-width: 72ch; }
[data-role='comparison'] { border: var(--frame); box-shadow: var(--shadow); margin-bottom: 32px; }
[data-color='blue'] { background: var(--blue); }
[data-color='lime'] { background: var(--lime); }
[data-color='pink'] { background: var(--pink); }
[data-color='yellow'] { background: var(--yellow); }
[data-role='comparison-pair'] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
[data-role='comparison-half'] { padding: 28px; min-width: 0; }
[data-role='comparison-half'] + [data-role='comparison-half'] { border-left: var(--frame); }
[data-role='comparison-half'] p, [data-role='comparison-half'] li { font-size: 16px; }
[data-role='comparison'] figcaption { border-top: var(--frame); padding: 16px 24px; background: var(--page); font-size: 16px; line-height: 1.5; }
table { width: 100%; border-collapse: collapse; table-layout: fixed; text-align: left; font-size: 16px; }
th, td { border-bottom: 2px solid var(--line); padding: 20px 24px; vertical-align: top; overflow-wrap: break-word; }
thead th { font-weight: 600; }
tr:last-child th, tr:last-child td { border-bottom: 0; }
th:first-child { width: 32%; }
th + th, th + td { border-left: 2px solid var(--line); }
tbody th { font-family: 'Guide Display', sans-serif; font-weight: 700; font-size: 1.125rem; line-height: 1.3; }
[data-role='check-list'] { list-style: none; padding: 0; margin: 0 0 24px; max-width: 72ch; }
[data-role='check-list'] li { position: relative; padding: 12px 0 12px 28px; border-bottom: 1px solid var(--line); font-size: 16px; line-height: 1.6; }
[data-role='check-list'] li::before { content: ''; position: absolute; width: 12px; height: 12px; border: 2px solid var(--line); left: 0; top: 19px; }
[data-role='takeaway'] { padding: 28px; border: var(--frame); box-shadow: var(--shadow); margin: 24px 0; max-width: 72ch; }
[data-role='feature-row'] { display: grid; grid-template-columns: 156px minmax(0, 1fr); gap: 24px; margin: 32px 0; align-items: stretch; }
[data-role='feature-row'] [data-role='takeaway'] { margin: 0; max-width: none; }
[data-role='feature-marker'] { position: relative; border: var(--frame); background: var(--bg); box-shadow: var(--shadow); min-height: 160px; overflow: hidden; }
[data-role='feature-marker'] span { display: block; position: absolute; width: 70%; aspect-ratio: 1; left: 30%; top: 24px; border: var(--frame); background: var(--page); transform: rotate(45deg); }
[data-role='check-section']:nth-of-type(even) [data-role='feature-row'] { grid-template-columns: minmax(0, 1fr) 156px; }
[data-role='check-section']:nth-of-type(even) [data-role='feature-marker'] { grid-column: 2; grid-row: 1; }
[data-role='check-section']:nth-of-type(even) [data-role='feature-row'] [data-role='takeaway'] { grid-column: 1; grid-row: 1; }
[data-role='takeaway'] h3 { font-size: 1.25rem; }
[data-role='takeaway'] [data-role='check-list'] { margin-bottom: 0; }
[data-role='action-link'] { display: inline-flex; justify-content: space-between; align-items: center; gap: 24px; min-height: 48px; padding: 12px 16px; border: 2px solid var(--line); background: var(--pink); box-shadow: var(--shadow); text-decoration: none; font-size: 16px; line-height: 1.4; font-weight: 600; margin: 8px 12px 16px 0; max-width: calc(100% - 4px); transition: background-color 160ms ease, transform 160ms ease; }
[data-role='action-link']:hover { background: color-mix(in srgb, var(--pink) 92%, black); }
[data-role='action-link']:active { transform: translate(-1px, -1px); }
[data-role='action-link'] span { flex: 0 0 auto; }
[data-role='chapter-cards'] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--gap); }
[data-role='chapter-cards'] [data-role='action-link'] { margin: 0; max-width: 100%; }
[data-role='chapter-cards'] [data-role='action-link']:last-child { grid-column: 1 / -1; }
[data-role='source-drawer'] { margin-top: 24px; border: 2px solid var(--line); box-shadow: var(--shadow); background: var(--bg); max-width: 72ch; }
[data-role='source-drawer'] summary { cursor: pointer; font-size: 16px; font-weight: 500; min-height: 56px; padding: 14px 20px; transition: background-color 160ms ease; }
[data-role='source-drawer'] summary:hover, [data-role='source-drawer'][open] summary { background: var(--blue); }
[data-role='source-drawer'] summary::marker { color: var(--line); }
[data-role='source-drawer'] ul { padding: 8px 20px 16px; list-style: none; margin: 0; border-top: 2px solid var(--line); }
[data-role='source-drawer'] a { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding: 10px 0; font-size: 16px; line-height: 1.4; }
[data-role='source-drawer'] a:hover { background: var(--blue); }
[data-role='chapter-turn'] { display: flex; justify-content: space-between; gap: 16px; border-top: var(--frame); margin-top: 64px; padding-top: 24px; }
[data-role='chapter-turn'] [data-role='action-link'] { background: var(--blue); margin-right: 0; }
[data-role='site-footer'] { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 1fr); gap: 40px; border-top: var(--frame); padding: 32px 0 40px; margin-top: 64px; }
[data-role='site-footer'] p { font-size: 16px; max-width: 64ch; }
[data-role='site-footer'] nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 20px; }
[data-role='site-footer'] a { display: inline-flex; align-items: center; min-height: 44px; font-size: 16px; }
@keyframes rise { from { opacity: .85; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 1100px) {
  [data-role='editorial-layout'] { grid-template-columns: 220px minmax(0,1fr); gap: 24px; }
  [data-role='hero'] { grid-template-columns: minmax(0,1fr); }
  [data-role='hero-art'] { min-height: 200px; }
  [data-role='geometry'] { min-height: 180px; }
  [data-piece='large'] { width: 45%; left: 25%; }
  [data-piece='small'] { width: 15%; right: 22%; }
  [data-piece='square'] { width: 7%; left: 35%; }
  [data-shape='diamond'] [data-piece='large'] { width: 25%; left: 37%; }
  [data-shape='window'] [data-piece='large'] { width: 48%; left: 27%; }
  [data-role='section-jump'] { grid-template-columns: minmax(0,1fr) auto; }
  [data-role='section-jump'] label { grid-column: 1 / -1; }
  [data-role='comparison-half'] { padding: 24px; }
  th, td { padding: 20px; }
}
@media (max-width: 850px) {
  [data-role='editorial-layout'] { grid-template-columns: minmax(0,1fr); grid-template-areas: 'main' 'rail'; gap: 64px; }
  [data-role='chapter-rail'] { position: static; max-height: none; overflow: visible; padding: 24px; }
  [data-role='chapter-rail'] nav { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 24px; }
  [data-role='chapter-rail'] h2 { grid-column: 1 / -1; margin: 0; }
  [data-role='chapter-group'] { margin: 0; }
  [data-role='back-link'] { margin-top: 24px; }
  [data-role='hero'] { grid-template-columns: minmax(0,1.5fr) minmax(220px,1fr); gap: 24px; }
  [data-role='hero-art'] { min-height: 280px; }
  [data-role='geometry'] { min-height: 200px; }
  [data-piece='large'] { width: 60%; left: 12%; }
  [data-piece='small'] { width: 28%; right: 9%; }
  [data-piece='square'] { width: 12%; left: 24%; }
  [data-shape='diamond'] [data-piece='large'] { width: 53%; left: 21%; }
  [data-shape='window'] [data-piece='large'] { width: 65%; left: 17%; }
  [data-role='site-footer'] { grid-template-columns: minmax(0,1fr); gap: 24px; }
  [data-role='site-footer'] nav { justify-content: flex-start; }
}
@media (max-width: 620px) {
  [data-role='masthead'] { gap: 16px; padding: 20px 0; }
  [data-role='wordmark'] { gap: 12px; font-size: 1.375rem; }
  [data-role='mark'] { width: 24px; height: 32px; box-shadow: 3px 3px 0 var(--line); }
  [data-role='brand-sub'] { max-width: 12ch; line-height: 1.25; }
  [data-role='index-link'] { gap: 8px; padding: 10px 12px; max-width: 148px; line-height: 1.3; }
  [data-role='editorial-layout'] { padding-top: 32px; }
  [data-role='hero'] { grid-template-columns: minmax(0,1fr); gap: 24px; }
  [data-role='hero-copy'] { padding-top: 0; }
  h1 { font-size: 2.25rem; }
  [data-role='hero'][data-home='true'] h1 { font-size: clamp(2.5rem, 9vw, 4rem); }
  [data-role='hero-art'] { min-height: 228px; }
  [data-role='geometry'] { min-height: 176px; }
  [data-role='hero-art'] figcaption { padding: 12px 16px; }
  [data-piece='large'] { width: 58%; left: 14%; }
  [data-piece='small'] { width: 23%; right: 13%; }
  [data-piece='bar'] { width: 57%; right: 9%; }
  [data-piece='square'] { width: 9%; }
  [data-shape='diamond'] [data-piece='large'] { width: 37%; left: 32%; }
  [data-shape='diamond'] [data-piece='square'] { width: 16%; left: 42%; }
  [data-role='jump-panel'] { margin-top: 32px; }
  [data-role='check-section'] { margin-top: 64px; }
  [data-role='comparison-pair'] { grid-template-columns: minmax(0,1fr); }
  [data-role='comparison-half'] { padding: 24px; }
  [data-role='comparison-half'] + [data-role='comparison-half'] { border-left: 0; border-top: var(--frame); }
  [data-role='comparison'] figcaption { padding: 16px 20px; }
  th, td { padding: 16px 12px; }
  th:first-child { width: 35%; }
  tbody th { font-size: 16px; }
  [data-role='takeaway'] { padding: 24px; }
  [data-role='feature-row'], [data-role='check-section']:nth-of-type(even) [data-role='feature-row'] { display: block; }
  [data-role='feature-marker'] { display: none; }
  [data-role='chapter-cards'] { grid-template-columns: minmax(0,1fr); }
  [data-role='source-drawer'] summary { padding: 14px 16px; }
  [data-role='source-drawer'] ul { padding-left: 16px; padding-right: 16px; }
  [data-role='chapter-turn'] { flex-direction: column; }
  [data-role='chapter-turn'] [data-role='action-link'] { width: calc(100% - 4px); margin: 0 0 8px; }
  [data-role='chapter-rail'] nav { grid-template-columns: minmax(0,1fr); }
  [data-role='chapter-rail'] h2 { grid-column: auto; }
  [data-role='action-link'] { margin-right: 0; }
  [data-role='site-footer'] { gap: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
@media print {
  body { background: white; }
  [data-role='masthead'], [data-role='chapter-rail'], [data-role='jump-panel'], [data-role='chapter-turn'], [data-role='site-footer'], [data-role='hero-art'], [data-role='skip-link'] { display: none; }
  [data-role='editorial-layout'] { display: block; width: 100%; padding: 0; }
  [data-role='hero'] { display: block; }
  [data-role='feature-row'] { display: block; }
  [data-role='feature-marker'] { display: none; }
  [data-role='check-section'] { margin-top: 32px; break-inside: avoid; }
  [data-role='comparison'], [data-role='takeaway'], [data-role='action-link'], [data-role='source-drawer'] { box-shadow: none; }
  [data-role='action-link'], [data-role='source-drawer'] { display: none; }
}
