@font-face { font-family:'Inter'; src:url('/fonts/inter-var-latin.woff2') format('woff2'); font-weight:300 700; font-display:swap; }
:root { --ink:#1d1d1f; --steel:#6e6e73; --line:rgb(29 29 31 / .14); --bg:#fff; --paper:#f5f5f7; --night:#000; --snow:#f5f5f7; --f:-apple-system,BlinkMacSystemFont,'Inter',system-ui,sans-serif; }
*,*::before,*::after { box-sizing:border-box; margin:0; }
body { background:var(--bg); color:var(--ink); font:400 17px/1.6 var(--f); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration-color:var(--line); text-underline-offset:3px; }
a:hover { text-decoration-color:var(--ink); }
a:focus-visible, button:focus-visible, input:focus-visible { outline:2px solid var(--ink); outline-offset:3px; border-radius:2px; }
[hidden] { display:none !important; }
.wrap { max-width:1120px; margin:0 auto; padding:0 clamp(20px,4vw,48px); }
.sr { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.bar { padding-top:28px; display:flex; justify-content:space-between; align-items:center; gap:16px; font-size:14px; color:var(--steel); }
.bar a { text-decoration:none; }
.bar .home { display:block; color:var(--ink); }
.bar .home svg { display:block; width:96px; height:auto; fill:currentColor; }
.switch { display:flex; gap:4px; padding:3px; border:1px solid var(--line); border-radius:999px; }
.switch a { padding:6px 16px; border-radius:999px; font-size:14px; line-height:1.4; transition:background .35s, color .35s; }
.switch a:hover { color:var(--ink); }
.switch a[aria-current] { background:var(--ink); color:#fff; }
.hero { padding:clamp(56px,9vw,112px) 0 clamp(36px,5vw,56px); }
.kicker { font-size:14px; color:var(--steel); margin-bottom:18px; }
h1 { font:600 clamp(44px,8vw,96px)/1 var(--f); letter-spacing:-.045em; }
.lede { margin-top:26px; font-size:clamp(18px,2.2vw,22px); line-height:1.45; color:#3a3a3e; max-width:30em; }
.start { margin-top:28px; font-size:15px; color:var(--steel); display:flex; flex-wrap:wrap; gap:6px 18px; }
.start b { font-weight:500; color:var(--ink); }

.tools { position:sticky; top:0; z-index:5; margin:0 calc(-1 * clamp(20px,4vw,48px)); padding:12px clamp(20px,4vw,48px); background:rgb(255 255 255 / .92); backdrop-filter:blur(12px); border-bottom:1px solid var(--line); display:flex; align-items:center; gap:12px 20px; flex-wrap:wrap; }
.search { position:relative; flex:0 1 280px; min-width:200px; }
.search svg { position:absolute; left:14px; top:50%; width:16px; height:16px; margin-top:-8px; fill:none; stroke:var(--steel); stroke-width:2; stroke-linecap:round; pointer-events:none; }
.search input { width:100%; height:40px; padding:0 14px 0 38px; border:1px solid var(--line); border-radius:999px; background:var(--bg); font:400 15px var(--f); color:var(--ink); transition:border-color .35s; }
.search input::placeholder { color:var(--steel); }
.search input:hover, .search input:focus { border-color:var(--ink); }
.search input::-webkit-search-cancel-button { cursor:pointer; }
.chips { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; flex:1 1 360px; padding:2px; margin:-2px; }
.chips::-webkit-scrollbar { display:none; }
.chips button { flex:none; height:40px; padding:0 16px; border-radius:999px; border:1px solid var(--line); background:var(--bg); font:400 14px var(--f); color:var(--steel); cursor:pointer; transition:background .35s, color .35s, border-color .35s; }
.chips button:hover { color:var(--ink); border-color:var(--ink); }
.chips button[aria-pressed="true"] { background:var(--ink); border-color:var(--ink); color:#fff; }
.chips i { font-style:normal; margin-left:6px; opacity:.55; font-variant-numeric:tabular-nums; }
.status { margin-top:20px; font-size:14px; color:var(--steel); }

.group { padding-top:clamp(40px,6vw,72px); }
.group-head { display:flex; justify-content:space-between; align-items:baseline; gap:16px; border-bottom:1px solid var(--line); padding-bottom:14px; margin-bottom:clamp(18px,2.4vw,28px); }
.group-head h2 { font:600 clamp(24px,3vw,34px)/1.1 var(--f); letter-spacing:-.03em; }
.group-head p { font-size:14px; color:var(--steel); text-align:right; }
.lib { list-style:none; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(28px,3vw,40px) clamp(16px,2vw,24px); }
.card { position:relative; display:flex; flex-direction:column; scroll-margin-top:90px; }
.card h3 a { text-decoration:none; }
.card .mins{display:block;margin-top:10px;font-size:13px;color:var(--steel)}
.card h3 a::after { content:''; position:absolute; inset:0; }
.card:hover h3 a { text-decoration:underline; text-decoration-color:var(--ink); }
.card:hover .thumb { transform:scale(.985); }
.thumb { position:relative; aspect-ratio:4/3; overflow:hidden; display:grid; place-items:center; background:var(--paper); color:var(--ink); transition:transform .5s cubic-bezier(.16,1,.3,1); }
.card:not([data-tone]):nth-child(odd) .thumb, .card[data-tone="d"] .thumb { background:var(--night); color:var(--snow); }
.thumb svg { width:46%; height:auto; overflow:visible; fill:none; stroke:currentColor; stroke-width:5; stroke-linecap:round; stroke-linejoin:round; }
.thumb svg.ic { stroke-width:.9; }
.thumb .f { fill:currentColor; stroke:none; }
.thumb .no { position:absolute; left:16px; top:14px; font-size:13px; font-variant-numeric:tabular-nums; opacity:.75; }
.card h3 { margin-top:16px; font:600 21px/1.2 var(--f); letter-spacing:-.02em; }
.card p { margin-top:6px; color:var(--steel); font-size:15px; line-height:1.5; }
.pager { margin-top:clamp(48px,6vw,72px); display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:8px; }
.pager button { min-width:40px; height:40px; padding:0 14px; border-radius:999px; border:1px solid var(--line); background:var(--bg); font:400 14px var(--f); color:var(--steel); cursor:pointer; font-variant-numeric:tabular-nums; transition:background .35s, color .35s, border-color .35s; }
.pager button:hover:not(:disabled) { color:var(--ink); border-color:var(--ink); }
.pager button[aria-current="page"] { background:var(--ink); border-color:var(--ink); color:#fff; }
.pager button:disabled { opacity:.35; cursor:default; }
.pager span { color:var(--steel); padding:0 2px; }
.empty { padding:72px 0 0; }
.empty p { color:#3a3a3e; }
.empty button { margin-top:14px; height:40px; padding:0 20px; border-radius:999px; border:1px solid var(--ink); background:var(--bg); font:500 14px var(--f); color:var(--ink); cursor:pointer; }
.cta { margin-top:clamp(72px,10vw,128px); padding:32px 0 0; border-top:1px solid var(--line); }
.cta h2 { font:600 clamp(26px,3.6vw,36px)/1.1 var(--f); letter-spacing:-.03em; }
.cta p { margin-top:12px; color:#3a3a3e; max-width:34em; }
.btn { display:inline-block; border:0; font-family:inherit; cursor:pointer; margin-top:22px; padding:12px 26px; border-radius:999px; background:var(--ink); color:#fff; text-decoration:none; font-size:15px; font-weight:500; transition:opacity .35s; }
.btn:hover { opacity:.82; }
.foot { margin-top:96px; padding:24px 0; border-top:1px solid var(--line); font-size:14px; color:var(--steel); display:flex; flex-wrap:wrap; gap:8px 24px; }
@media (max-width:900px) { .lib { grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px) { body { font-size:16px; } .lib { grid-template-columns:1fr; } .search { flex:1 1 100%; } .chips { flex:1 1 100%; } .group-head p { display:none; } .bar > a:last-child { display:none; } }
@media (prefers-reduced-motion:reduce) { * { transition:none !important; } }
[hidden] { display:none !important; }

.skip { position:absolute; top:8px; left:16px; transform:translateY(-180%); z-index:30; background:#fff; padding:12px 20px; border:2px solid var(--ink); }
.skip:focus { transform:none; }
.breadcrumbs { display:flex; gap:8px; flex-wrap:wrap; align-items:center; color:var(--steel); font-size:14px; margin-bottom:24px; }
.breadcrumbs a { text-decoration:none; }
.breadcrumbs a:hover { text-decoration:underline; }
.breadcrumbs span[aria-hidden] { opacity:.5; }
.hub-hero { padding-bottom:clamp(36px,5vw,60px); }
.hub-hero h1 { max-width:10em; }
.hub-hero .lede { max-width:34em; }
.shelves { display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.volume { display:flex; flex-direction:column; position:relative; min-width:0; }
.volume-link { text-decoration:none; }
.volume-link::after { content:''; position:absolute; inset:0; }
.volume-link:focus-visible { outline:none; }
.volume:has(.volume-link:focus-visible) { outline:2px solid var(--ink); outline-offset:8px; }
.cover { position:relative; aspect-ratio:1.17; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(24px,3.5vw,44px); overflow:hidden; border:1px solid var(--line); background:var(--paper); }
.cover::before { content:''; position:absolute; inset:0 auto 0 14px; width:1px; background:currentColor; opacity:.12; }
.cover.dark { background:#000; color:var(--snow); border-color:#000; }
.cover small { font-size:14px; opacity:.65; }
.cover-title { font-size:clamp(44px,5.8vw,74px); font-weight:600; letter-spacing:-.06em; line-height:1.03; }
.cover-base { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; }
.cover-base p { font-size:14px; line-height:1.5; max-width:15em; opacity:.7; }
.cover-symbol { width:78px; height:78px; flex:none; fill:none; stroke:currentColor; stroke-width:2; }
.volume h2 { font-size:clamp(24px,3vw,30px); line-height:1.15; letter-spacing:-.03em; font-weight:600; margin-top:24px; }
.volume > p { font-size:16px; color:var(--steel); margin-top:12px; max-width:29em; }
.volume-meta { font-size:14px; color:var(--steel); margin-top:18px; }
.volume-action { margin-top:18px; display:flex; align-items:center; gap:12px; font-size:15px; font-weight:500; }
.volume-action svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.5; transition:transform .25s; }
.volume:hover .volume-action svg { transform:translateX(4px); }
.choose-note { margin-top:64px; padding-top:24px; border-top:1px solid var(--line); display:grid; grid-template-columns:1fr 1fr; gap:32px; }
.choose-note h2 { font-size:24px; line-height:1.25; letter-spacing:-.03em; }
.choose-note p { color:var(--steel); font-size:16px; max-width:34em; }
.track-nav { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; font-size:14px; }
.track-nav a { padding:8px 16px; border-radius:999px; border:1px solid var(--line); text-decoration:none; }
.track-nav a[aria-current="page"] { background:var(--ink); color:#fff; border-color:var(--ink); }
.definition { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:0 0 40px; }
.definition div { border-top:1px solid var(--line); padding-top:16px; }
.definition dt { font-size:21px; font-weight:600; letter-spacing:-.02em; }
.definition dd { font-size:15px; color:var(--steel); margin-top:8px; }
.reading { max-width:760px; margin:auto; }
.article-hero { padding-bottom:40px; }
.article-hero h1 { font-size:clamp(38px,6vw,72px); line-height:1.04; }
.article-meta { font-size:14px; color:var(--steel); margin-top:20px; }
.article-body { font-size:18px; line-height:1.75; }
.article-body p { margin-top:20px; }
.article-body h2 { font-size:clamp(27px,3.5vw,36px); font-weight:600; line-height:1.15; letter-spacing:-.035em; margin-top:56px; scroll-margin-top:24px; }
.article-body h3 { font-size:21px; line-height:1.3; letter-spacing:-.02em; margin-top:32px; }
.article-body ul,.article-body ol { padding-left:24px; margin-top:20px; }
.article-body li { margin-top:12px; padding-left:4px; }
.article-body .answer { padding:28px; background:var(--paper); margin:0; font-size:19px; line-height:1.6; }
.article-body .answer p { margin:0; }
.article-body .example { padding:24px; border:1px solid var(--line); margin-top:28px; }
.article-body .example h3 { margin-top:0; font-size:16px; }
.article-body .example p { font-size:17px; }
.article-body .example > :last-child { margin-bottom:0; }
.article-body .checklist { list-style:none; padding:0; }
.article-body .checklist li { display:flex; gap:12px; padding:14px 0; border-bottom:1px solid var(--line); margin:0; }
.checklist li::before { content:'✓'; flex:none; font-weight:600; }
.article-body .sources { font-size:15px; line-height:1.6; }
.sources li { overflow-wrap:anywhere; }
.article-body pre { padding:24px; background:var(--paper); overflow-x:auto; font-size:14px; line-height:1.6; margin-top:24px; }
.article-body code { font-size:.85em; }
.article-body pre:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.table-wrap { max-width:100%; overflow-x:auto; margin-top:28px; border:1px solid var(--line); }
.table-wrap:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
.table-wrap table { width:100%; border-collapse:collapse; text-align:left; font-size:15px; line-height:1.55; }
.table-wrap caption { text-align:left; padding:18px 20px; font-size:15px; font-weight:600; background:var(--paper); }
.table-wrap th,.table-wrap td { vertical-align:top; padding:16px 20px; border-top:1px solid var(--line); min-width:140px; }
.table-wrap th { font-weight:600; }
.table-wrap thead th { background:var(--paper); }
.worksheet { margin-top:28px; padding:24px; background:var(--paper); }
.article-body .worksheet h3 { margin-top:0; font-size:19px; }
.worksheet dl { display:grid; grid-template-columns:150px minmax(0,1fr); margin-top:18px; gap:12px 20px; font-size:16px; line-height:1.6; }
.worksheet dt { font-weight:600; }
.worksheet dd { min-width:0; }
.related-reading { margin-top:48px; padding-top:8px; border-top:1px solid var(--line); }
.article-body .related-reading h2 { font-size:27px; margin-top:24px; }
.article-body .related-reading ul { list-style:none; padding:0; }
.article-body .related-reading li { padding:0; margin-top:20px; }
.article-body .related-reading li > a { font-size:17px; font-weight:600; }
.article-body .related-reading p { font-size:15px; line-height:1.55; color:var(--steel); margin-top:5px; }
@media(max-width:600px) { .worksheet { padding:20px; } .worksheet dl { grid-template-columns:1fr; gap:4px; } .worksheet dd + dt { margin-top:12px; } .table-wrap th,.table-wrap td { min-width:130px; padding:14px; } }
.toc-inline { padding:24px 0; border-block:1px solid var(--line); margin-top:32px; font-size:15px; }
.toc-inline ol { display:flex; flex-wrap:wrap; gap:10px 24px; list-style:none; padding:0; margin-top:12px; }
.toc-inline li { margin:0; padding:0; }
.chapter-nav { display:grid; grid-template-columns:1fr 1fr; gap:24px; border-top:1px solid var(--line); margin-top:56px; padding-top:24px; }
.chapter-nav a { font-size:17px; text-decoration:none; }
.chapter-nav a:hover b { text-decoration:underline; }
.chapter-nav span { display:block; color:var(--steel); font-size:13px; margin-bottom:8px; }
.chapter-nav .next { text-align:right; }
@media(max-width:600px) { .shelves { grid-template-columns:1fr; gap:48px; } .cover { aspect-ratio:1.1; } .cover-title { font-size:clamp(44px,15.5vw,64px); } .cover-symbol { width:64px; height:64px; } .choose-note { grid-template-columns:1fr; gap:16px; margin-top:48px; } .definition { grid-template-columns:1fr; gap:16px; } .definition dd { margin-top:4px; } .article-body { font-size:17px; } .article-body .answer { padding:22px; font-size:18px; } .chapter-nav { gap:16px; } .track-nav a { font-size:13px; padding:8px 12px; } }

/* chapter evidence: numbered citations, figures, stat callouts */
.article-body { counter-reset:fig; }
sup.cite { font-size:.68em; line-height:0; margin-left:2px; font-variant-numeric:tabular-nums; }
sup.cite a { text-decoration:none; font-weight:600; padding:2px 1px; border-radius:3px; }
sup.cite a:hover { background:var(--paper); text-decoration:underline; }
.sources ol { padding-left:26px; }
.sources li { margin-top:10px; padding-left:4px; scroll-margin-top:24px; }
.sources li:target { background:var(--paper); box-shadow:-8px 0 0 var(--paper), 8px 0 0 var(--paper); }
.sources li span { display:block; color:var(--steel); font-size:14px; line-height:1.5; margin-top:2px; }
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:1px; margin-top:32px; background:var(--line); border:1px solid var(--line); }
.stat { background:var(--bg); padding:20px 22px; }
.stat b { display:block; font-size:clamp(34px,6vw,46px); line-height:1; font-weight:600; letter-spacing:-.04em; }
.stat span { display:block; margin-top:10px; font-size:14px; line-height:1.5; color:var(--steel); }
.note { margin-top:28px; padding:4px 0 4px 20px; border-left:3px solid var(--ink); font-size:17px; line-height:1.65; }
.article-body .note p { margin-top:12px; }
.article-body .note p:first-child { margin-top:0; }

/* figures: svg diagrams and html components share one frame */
.fig { margin:36px 0 0; counter-increment:fig; }
.fig .plate { background:var(--paper); padding:clamp(16px,3vw,30px); }
.fig figcaption { margin-top:12px; font-size:14px; line-height:1.55; color:var(--steel); }
.fig figcaption::before { content:'Figure ' counter(fig) '. '; font-weight:600; color:var(--ink); }
.ic { width:22px; height:22px; flex:none; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.fig .plate > svg { display:block; width:100%; max-width:440px; height:auto; margin:0 auto; overflow:visible; fill:none; stroke:var(--ink); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; font-family:var(--f); }
.fig svg .t { fill:var(--ink); stroke:none; font-size:13px; }
.fig svg .tb { fill:var(--ink); stroke:none; font-size:13px; font-weight:600; }
.fig svg .ts { fill:var(--steel); stroke:none; font-size:11.5px; }
.fig svg .tw { fill:#fff; stroke:none; font-size:13px; font-weight:600; }
.fig svg .tws { fill:#fff; stroke:none; font-size:11.5px; opacity:.8; }
.fig svg .tc { text-anchor:middle; }
.fig svg .te { text-anchor:end; }
.fig svg .box { fill:#fff; }
.fig svg .ink { fill:var(--ink); stroke:var(--ink); }
.fig svg .soft { fill:none; stroke:var(--line); }
.fig svg .dash { stroke-dasharray:5 5; }
.fig svg .thin { stroke-width:1; }
.fig svg .thick { stroke-width:2.5; }
.fig svg .fill { fill:var(--ink); stroke:none; }
.fig svg .mute { fill:rgb(29 29 31 / .08); stroke:none; }
.fig svg .none { fill:none; }
.fig svg .wi { color:#fff; stroke:#fff; }

/* steps: horizontal on wide screens, a vertical timeline on phones */
.article-body .flow { --n:5; list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(var(--n),minmax(0,1fr)); gap:0 16px; }
.article-body .flow li { position:relative; margin:0; padding:0; }
.flow .dot { width:44px; height:44px; border-radius:50%; background:var(--ink); color:#fff; display:grid; place-items:center; position:relative; z-index:1; }
.flow .dot .ic { width:22px; height:22px; }
.flow li:not(:last-child)::before { content:''; position:absolute; top:21px; left:44px; right:-16px; height:1px; background:rgb(29 29 31 / .3); }
.fig .flow b { display:block; margin-top:14px; font-size:16px; line-height:1.25; }
.fig .flow p { margin:6px 0 0; font-size:14px; line-height:1.5; }
.fig .flow small { display:block; margin-top:8px; font-size:13px; line-height:1.45; color:var(--steel); }
@media(max-width:720px) {
  .article-body .flow { grid-template-columns:1fr; }
  .article-body .flow li { padding:0 0 26px 60px; min-height:44px; }
  .article-body .flow li:last-child { padding-bottom:0; }
  .flow .dot { position:absolute; left:0; top:0; }
  .flow li:not(:last-child)::before { top:44px; bottom:0; left:21px; right:auto; width:1px; height:auto; }
  .fig .flow b { margin-top:0; padding-top:2px; }
}

/* tiles: equal cards with an icon */
.article-body .tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; padding:0; margin:0; list-style:none; }
.article-body .tiles > li, .tiles > div { margin:0; padding:18px; background:#fff; border:1px solid var(--line); }
.tiles .ic { width:26px; height:26px; margin-bottom:12px; display:block; }
.fig .tiles b { display:block; font-size:16px; line-height:1.25; }
.fig .tiles p { margin:6px 0 0; font-size:14px; line-height:1.5; color:var(--steel); }
.fig .tiles small { display:block; margin-top:10px; font-size:13px; line-height:1.45; }
.tiles .dark { background:var(--ink); border-color:var(--ink); color:#fff; }
.fig .tiles .dark p { color:rgb(255 255 255 / .75); }

/* before / after */
.pair { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.pair > div { background:#fff; border:1px solid var(--line); padding:18px; }
.pair .good { border:1.5px solid var(--ink); }
.fig .pair .h { margin:0 0 10px; font-size:12px; letter-spacing:.06em; text-transform:uppercase; color:var(--steel); font-weight:600; }
.fig .pair .good .h { color:var(--ink); }
.fig .pair p { margin:0; font-size:15px; line-height:1.55; }
.fig .pair p + p { margin-top:8px; }
.fig .pair small { display:block; margin-top:10px; font-size:13px; line-height:1.45; color:var(--steel); }
@media(max-width:640px) { .pair { grid-template-columns:1fr; } }

/* search result mock-up */
.serp { background:#fff; border:1px solid var(--line); padding:18px 20px; }
.serp + .serp { margin-top:12px; }
.serp .url { display:flex; align-items:center; gap:10px; font-size:13px; color:#4d5156; line-height:1.3; min-width:0; }
.serp .fav { flex:none; width:26px; height:26px; border-radius:50%; background:var(--paper); display:grid; place-items:center; color:var(--ink); }
.serp .fav .ic { width:14px; height:14px; }
.serp .ttl { margin-top:8px; font-size:19px; line-height:1.3; font-weight:500; text-decoration:underline; text-decoration-color:var(--line); text-underline-offset:3px; }
.fig .serp .snip { margin:6px 0 0; font-size:14px; line-height:1.55; color:#4d5156; }
.serp mark { background:none; color:var(--ink); font-weight:700; }
.serp .tag { display:inline-block; margin-bottom:10px; padding:2px 8px; border-radius:999px; background:var(--paper); color:var(--steel); font-size:11px; font-weight:600; letter-spacing:.05em; text-transform:uppercase; }

/* horizontal bars */
.fig .bars { --max:100; display:grid; gap:18px; }
.bars .lab { display:block; font-size:14px; line-height:1.4; margin-bottom:6px; }
.bars .track { display:flex; align-items:center; gap:10px; }
.bars i { display:block; height:16px; background:var(--ink); width:calc(var(--v) / var(--max) * 100%); min-width:2px; }
.bars .light i { background:var(--steel); }
.bars .faint i { background:rgb(29 29 31 / .22); }
.bars b { font-size:14px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.bars small { display:block; margin-top:4px; font-size:12.5px; color:var(--steel); }
.fig .legend { margin-top:16px; font-size:13px; color:var(--steel); line-height:1.5; }
@media(max-width:600px) { .fig .plate { padding:14px 6px; } .fig .plate:has(.flow, .tiles, .pair, .serp, .bars) { padding:14px 12px; } .stat { padding:16px 18px; } }