:root,.light{--bg:#faf6ef;--bg-elevated:#fff;--fg:#2a2723;--fg-muted:#6b655b;--accent:#3a6488;--accent-hover:#2e5070;--accent-contrast:#fff;--border:#ece3d4;--success:#367044;--warn:#9a5429;--error:#a32f2f;--code-bg:#f2ece0;--link-visited:#7a5d86;--shadow-soft:0 1px 3px #28221a0d;--viz-1:#4a7aa0;--viz-2:#b06a3c;--viz-3:#5c7f4f;--viz-4:#a8546a;--viz-5:#74638f;--viz-6:#9a7d3a;--viz-active:#b5612a;--viz-muted:#9c8f78}.dark{--bg:#211e1a;--bg-elevated:#2c2823;--fg:#ece4d6;--fg-muted:#a89c88;--accent:#7ba3c4;--accent-hover:#93b6d2;--accent-contrast:#1c1a16;--border:#3a352d;--success:#6fae74;--warn:#d29155;--error:#d97a72;--code-bg:#1b1813;--link-visited:#b69ec2;--shadow-soft:0 2px 6px #0000004d}:root{--font-sans:ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, "SF Mono", "Cascadia Code", "JetBrains Mono", Menlo, Consolas, monospace;--text-h1:2rem;--lh-h1:1.2;--text-h2:1.5rem;--lh-h2:1.25;--text-h3:1.25rem;--lh-h3:1.3;--text-base:1rem;--lh-base:1.6;--text-sm:.875rem;--lh-sm:1.5;--text-code:.9375rem;--sp-1:.25rem;--sp-2:.5rem;--sp-3:.75rem;--sp-4:1rem;--sp-5:1.5rem;--sp-6:2rem;--sp-7:3rem;--sp-8:4rem;--content-max:1120px;--reading:72ch;--header-h:64px;--ad-h:clamp(60px, 10vh, 140px);--radius-card:12px}@media (max-width:600px){:root{--header-h:56px}}*{box-sizing:border-box}html,body{margin:0;padding:0;overflow-x:hidden}.app-shell{grid-template-rows:auto 1fr var(--ad-h);background:var(--bg);height:100dvh;color:var(--fg);font-family:var(--font-sans);font-size:var(--text-base);line-height:var(--lh-base);display:grid}.app-header{height:var(--header-h);background:var(--bg-elevated);border-bottom:1px solid var(--border)}.app-header>.wrap{height:100%;max-width:var(--content-max);padding:0 var(--sp-5);justify-content:space-between;align-items:center;margin-inline:auto;display:flex}.brand{align-items:center;gap:var(--sp-2);font-size:var(--text-h3);color:var(--fg);font-weight:700;text-decoration:none;display:inline-flex}.controls{align-items:center;gap:var(--sp-3);display:flex}.app-main{overflow-y:auto}.app-main>.wrap{max-width:var(--content-max);padding:var(--sp-6) var(--sp-5) var(--sp-8);margin-inline:auto}.prose{max-width:var(--reading)}.bleed{max-width:var(--content-max)}.ad-band{background:var(--bg);border-top:1px solid var(--border);color:var(--fg-muted);font-size:var(--text-sm);padding:var(--sp-2) var(--sp-5);justify-content:flex-start;align-items:center;display:flex}h1{font-size:var(--text-h1);line-height:var(--lh-h1);margin:0 0 var(--sp-4);font-weight:700}h2{font-size:var(--text-h2);line-height:var(--lh-h2);margin:var(--sp-6) 0 var(--sp-3);font-weight:650}h3{font-size:var(--text-h3);line-height:var(--lh-h3);margin:var(--sp-5) 0 var(--sp-2);font-weight:600}p{margin:0 0 var(--sp-4)}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-hover);text-decoration:underline}a:visited{color:var(--link-visited)}code{font-family:var(--font-mono);font-size:var(--text-code);background:var(--code-bg);border-radius:4px;padding:.1em .35em}.icon{background-color:currentColor;flex:none;display:inline-block;-webkit-mask-position:50%;mask-position:50%;-webkit-mask-size:contain;mask-size:contain;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}.btn,.pill{border:1px solid var(--border);color:var(--fg);font:inherit;padding:var(--sp-2) var(--sp-4);cursor:pointer;background:0 0;border-radius:999px}.btn:hover,.pill:hover{border-color:var(--accent);color:var(--accent)}.btn-primary{background:var(--accent);color:var(--accent-contrast);border-color:var(--accent)}.btn:disabled{opacity:.5;cursor:not-allowed}.seg-track{border:1px solid var(--border);border-radius:999px;gap:2px;padding:2px;display:inline-flex}.seg-item{justify-content:center;align-items:center;gap:var(--sp-1);min-width:40px;min-height:32px;padding:var(--sp-1) var(--sp-3);color:var(--fg-muted);font:inherit;font-size:var(--text-sm);cursor:pointer;background:0 0;border:none;border-radius:999px;display:inline-flex}.seg-item[aria-pressed=true]{background:var(--accent);color:var(--accent-contrast)}:where(.btn,.pill,.seg-item):focus-visible{outline:2px solid var(--accent);outline-offset:2px}.card-grid{gap:var(--sp-5);margin:var(--sp-6) 0;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));display:grid}.card{background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-card);padding:var(--sp-5);color:var(--fg);display:block}.card:hover{border-color:var(--accent);text-decoration:none}.card h3{margin:0 0 var(--sp-2)}.card p{color:var(--fg-muted);font-size:var(--text-sm);margin:0}.chip{border:1px solid var(--border);color:var(--fg-muted);font-size:var(--text-sm);padding:2px var(--sp-3);background:0 0;border-radius:999px;align-items:center;display:inline-flex}.chip-row{gap:var(--sp-2);margin-bottom:var(--sp-5);flex-wrap:wrap;display:flex}.viz-caption{color:var(--fg-muted);font-size:var(--text-sm)}.breadcrumb{align-items:center;gap:var(--sp-2);color:var(--fg-muted);font-size:var(--text-sm);margin-bottom:var(--sp-4);flex-wrap:wrap;display:flex}.breadcrumb a{align-items:center;gap:var(--sp-1);color:var(--fg-muted);display:inline-flex}.breadcrumb a:hover{color:var(--accent)}.bc-sep{opacity:.55}.byline{color:var(--fg-muted);font-size:var(--text-sm);margin-top:calc(-1 * var(--sp-2))}.recommend{margin-top:var(--sp-7)}.category-hero{align-items:flex-start;gap:var(--sp-4);margin-bottom:var(--sp-6);display:flex}.category-hero .icon{color:var(--accent);flex:none}.category-hero h1{margin-bottom:var(--sp-2)}.card .icon{margin-bottom:var(--sp-2);color:var(--accent);display:block}.stepplayer{margin:var(--sp-6) 0}.stepplayer-stage{justify-content:center;align-items:center;display:flex}.stepplayer-bar{justify-content:center;align-items:center;gap:var(--sp-3);margin-top:var(--sp-3);flex-wrap:wrap;display:flex}.stepplayer-count{color:var(--fg-muted);font-size:var(--text-sm);text-align:center;min-width:8ch}.btn{align-items:center;gap:var(--sp-1);display:inline-flex}@media (max-width:600px){.app-header>.wrap{padding:0 var(--sp-4)}.app-main>.wrap{padding:var(--sp-5) var(--sp-4) var(--sp-7)}.controls{gap:var(--sp-2)}}@media (max-width:400px){.brand-text{display:none}.seg-item{min-width:36px;padding:var(--sp-1) var(--sp-2)}}@media (prefers-reduced-motion:reduce){*{transition:none!important}}