/* DESIGN.md → Slot learning and SEO refinement (2026-10-25).
   DO2/3/4/6/7: shared palette, Carbon1, card20/40, pill1600, Aeonik700,
   .030/.032 tracking, Sky/Paper/Concrete bands. DON'T3/4/5/7: black actions,
   no shadows/gradients/green success. Layout fractions are component geometry. */
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--color-carbon);background:var(--color-paper-white);font:var(--font-weight-medium) var(--text-body-lg)/var(--leading-caption) var(--font-aeonik-pro)}
h1,h2,h3,p{margin:0}a{color:inherit;text-underline-offset:var(--spacing-4)}a:hover{text-decoration-thickness:var(--border-width)}svg{display:block}h1,h2,h3{word-break:keep-all;overflow-wrap:anywhere}
/* Named type and spacing tokens from DESIGN; 1440 outer page, readable inner columns. */
.article-header,.article-hero,.article-layout,.article-related,.article-footer{max-width:var(--page-max-width);margin-inline:auto;padding:var(--spacing-40)}
.article-header{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-24);padding-block:var(--spacing-24)}
.article-header nav{display:flex;gap:var(--spacing-8)}
.article-brand{display:flex;flex-direction:column;font-weight:var(--font-weight-bold);font-size:var(--text-subheading);line-height:var(--leading-subheading);letter-spacing:var(--tracking-label);text-decoration:none}
.article-brand span{font-size:var(--text-caption)}
.article-pill{display:inline-flex;justify-content:center;align-items:center;padding:var(--spacing-12) var(--spacing-24);border:var(--border-standard);border-radius:var(--radius-buttons);background:var(--color-paper-white);font-size:var(--text-caption);font-weight:var(--font-weight-bold);letter-spacing:var(--tracking-button);text-decoration:none;white-space:nowrap}
.article-pill:hover{background:var(--color-carbon);color:var(--color-paper-white)}
.article-hero{background:var(--color-sky-wash);border-radius:var(--radius-cards-elevated);padding-block:var(--spacing-40) var(--spacing-60)}
.article-breadcrumb{display:flex;align-items:baseline;gap:var(--spacing-12);font-size:var(--text-caption);margin-bottom:var(--spacing-48)}
.article-breadcrumb a{flex-shrink:0}.article-breadcrumb span:last-child{overflow-wrap:anywhere}
.article-hero-grid{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,1fr);gap:var(--spacing-48);align-items:center}
.article-kicker{font:var(--font-weight-bold) var(--text-caption)/var(--leading-caption) var(--font-aeonik-pro);letter-spacing:var(--tracking-label);margin-bottom:var(--spacing-16)}
h1{font-size:var(--text-heading);font-weight:var(--font-weight-bold);line-height:var(--leading-subheading);letter-spacing:var(--tracking-heading)}
.article-lead{font-size:var(--text-subheading);line-height:var(--leading-caption);margin-top:var(--spacing-24);word-break:keep-all}
.article-byline{font-size:var(--text-caption);margin-top:var(--spacing-24)}.article-art{width:100%;height:auto;transform:rotate(-8deg)}
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr);align-items:start;gap:var(--spacing-80);padding-block:var(--spacing-80)}
.article-toc{position:sticky;top:var(--spacing-32);border:var(--border-standard);border-radius:var(--radius-cards);padding:var(--spacing-24);background:var(--color-paper-white)}
.article-toc ol{padding-left:var(--spacing-20);margin:0}.article-toc li+li{margin-top:var(--spacing-16)}
.article-body{min-width:0;max-width:calc(3 * var(--spacing-224) + var(--spacing-80))} /* 752px text column composed from spacing224/80; outer page stays1440. */.article-section{scroll-margin-top:var(--spacing-32)}.article-section+.article-section{margin-top:var(--spacing-60)}
h2{font-size:var(--text-heading-sm);line-height:var(--leading-subheading);font-weight:var(--font-weight-bold)}
.article-section p{margin-top:var(--spacing-20)}.article-section ul{padding-left:var(--spacing-24)}.article-section li+li{margin-top:var(--spacing-12)}
/* Table radius20 and source Sky/Lavender, all values from shared tokens. */
.table-scroll{overflow:auto;margin-top:var(--spacing-24);border:var(--border-standard);border-radius:var(--radius-cards)}
table{border-collapse:collapse;width:100%;font-size:var(--text-body-lg)}caption{text-align:left;padding:var(--spacing-16);background:var(--color-sky-wash);font-weight:var(--font-weight-bold)}
th,td{text-align:left;padding:var(--spacing-16);vertical-align:top;min-width:var(--spacing-128);border-top:var(--border-standard)}thead th{background:var(--color-lavender)}
details{margin-top:var(--spacing-16);padding:var(--spacing-24);border:var(--border-standard);border-radius:var(--radius-cards);background:var(--color-paper-white)}summary{cursor:pointer;font-weight:var(--font-weight-bold)}
.article-sources{padding:var(--spacing-32);border:var(--border-standard);border-radius:var(--radius-cards);background:var(--color-sky-wash)}.article-sources a{overflow-wrap:anywhere}
.article-related{padding-block:var(--spacing-60);background:var(--color-concrete-gray);border-radius:var(--radius-cards-elevated)}.related-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--spacing-24);margin-top:var(--spacing-32)}
.related-card{display:flex;flex-direction:column;align-items:flex-start;gap:var(--spacing-20);padding:var(--spacing-24);border:var(--border-standard);border-radius:var(--radius-cards);background:var(--color-paper-white);text-decoration:none}
.related-card:nth-child(2){background:var(--color-lavender)}.related-card:nth-child(3){background:var(--color-sunburst)}.related-card h3{font-size:var(--text-subheading);line-height:var(--leading-subheading)}.related-card>span:last-child{margin-top:auto;font-weight:var(--font-weight-bold)}.related-card:hover h3{text-decoration:underline}
.article-footer{display:flex;align-items:center;justify-content:space-between;gap:var(--spacing-24);font-size:var(--text-caption);padding-block:var(--spacing-48)}
:focus-visible{outline:var(--border-standard);outline-offset:var(--spacing-4)}.skip-link{position:absolute;left:var(--spacing-24);top:var(--spacing-12);transform:translateY(-200%);padding:var(--spacing-16);background:var(--color-carbon);color:var(--color-paper-white);border-radius:var(--radius-buttons);z-index:2}.skip-link:focus{transform:none}
/* Existing responsive breakpoint and token sizes; no new type/space/radius values. */
@media(max-width:991px){.article-hero-grid{grid-template-columns:minmax(0,1fr) var(--spacing-180);gap:var(--spacing-24)}h1{font-size:var(--text-heading-sm)}.article-lead{font-size:var(--text-body-lg)}.article-layout{gap:var(--spacing-32);grid-template-columns:minmax(0,1fr) minmax(0,2fr)}.related-grid{grid-template-columns:1fr}.article-toc{padding:var(--spacing-16)}}
@media(max-width:767px){.article-header,.article-hero,.article-layout,.article-related,.article-footer{padding:var(--spacing-24)}.article-header{flex-wrap:wrap;gap:var(--spacing-16)}.article-brand{font-size:var(--text-body-lg)}.article-pill{padding:var(--spacing-12) var(--spacing-16)}.article-hero{border-radius:var(--radius-cards)}.article-hero-grid{grid-template-columns:1fr}.article-art{width:var(--spacing-128);justify-self:end}.article-breadcrumb{margin-bottom:var(--spacing-32)}.article-layout{grid-template-columns:1fr;gap:var(--spacing-40);padding-block:var(--spacing-40)}.article-toc{position:static}.article-section+.article-section{margin-top:var(--spacing-40)}h2{font-size:var(--text-subheading)}.article-sources{padding:var(--spacing-24)}.article-footer{flex-direction:column;align-items:flex-start}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.table-hint{display:none;font-size:var(--text-caption)} /* Existing caption12. */
@media(max-width:767px){.table-hint{display:block}}
/* DO3/4/6: brand navigation control also uses Carbon1, pill1600, spacing12/16. */
.article-brand{border:var(--border-standard);border-radius:var(--radius-nav);padding:var(--spacing-12) var(--spacing-16)}
.article-brand:hover{background:var(--color-carbon);color:var(--color-paper-white)}