:root{--bg:#0a1216;--bg-soft:#112027;--surface:#172e38;--surface-2:#1d3a46;--text:#e9f2f7;--muted:#9eb4c0;--accent:#ff9f1c;--accent-ink:#ff9f1c;--accent-2:#2ec4b6;--danger:#ff6b6b;--danger-ink:#ff9191;--border:#2a4b58;--control-border:#7295a3;--shadow:#00000047;--focus-ring:var(--accent);--font-head:"Space Grotesk", "Segoe UI", system-ui, sans-serif;--font-body:"IBM Plex Sans", "Segoe UI", system-ui, sans-serif;--radius:16px;--radius-sm:10px}:root[data-theme=light]{--bg:#f8fbff;--bg-soft:#e6f0fa;--surface:#fff;--surface-2:#f0f6fd;--text:#10222d;--muted:#495d6a;--accent:#ef6f00;--accent-ink:#a34a00;--accent-2:#0f9b8e;--danger:#b13030;--danger-ink:#a02b2b;--border:#c6d8e7;--control-border:#6b7f99;--shadow:#141e281f;--focus-ring:var(--accent-2)}*{box-sizing:border-box}.skip-link{background:var(--accent);color:var(--bg);border-radius:0 0 var(--radius-sm) var(--radius-sm);z-index:100;padding:.6rem 1.2rem;font-weight:600;text-decoration:none;position:absolute;top:0;left:-9999px}.skip-link:focus{left:50%;transform:translate(-50%)}body{font-family:var(--font-body);color:var(--text);background:radial-gradient(circle at 15% -10%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 38%), radial-gradient(circle at 80% 0%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 40%), linear-gradient(180deg, var(--bg-soft), var(--bg));min-height:100vh;margin:0}a{color:var(--text)}:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}.shell{grid-template-columns:minmax(0,1fr);gap:1rem;width:min(1180px,95vw);margin:1.5rem auto 2rem;display:grid}.hero{border:1px solid var(--border);background:linear-gradient(145deg, var(--surface), var(--surface-2));box-shadow:0 18px 48px var(--shadow);border-radius:20px;padding:1.2rem;position:relative}h1,h2,h3,h4{font-family:var(--font-head)}h1{margin:.45rem 0;font-size:clamp(1.8rem,3.8vw,3rem)}.subtitle{color:var(--muted);margin:.3rem 0 0;line-height:1.55}.source-bar{border-top:1px solid var(--border);flex-wrap:wrap;align-items:center;gap:.5rem .65rem;margin-top:.9rem;padding-top:.8rem;display:flex}.source-label{color:var(--muted);font-size:.85rem}.source-name{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.82rem}.file-btn{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--surface-2) 80%, transparent);color:var(--text);cursor:pointer;align-items:center;gap:.35rem;margin:0;padding:.45rem .8rem;font-size:.9rem;font-weight:600;transition:border-color .18s,background .18s;display:inline-flex}.file-btn:hover{border-color:color-mix(in srgb, var(--accent) 45%, var(--border))}.file-btn:focus-within{outline:3px solid var(--focus-ring);outline-offset:2px}.control-file{justify-content:center;width:100%}button.ghost,.ghost{background:0 0}.capacity{gap:.3rem;margin-top:.7rem;display:grid}.capacity-track{background:color-mix(in srgb, var(--surface-2) 80%, transparent);border:1px solid var(--border);border-radius:999px;height:8px;overflow:hidden}.capacity-fill{background:linear-gradient(90deg, var(--accent-2), var(--accent));border-radius:999px;width:0%;height:100%;transition:width .25s}.capacity-fill.over{background:var(--danger)}.copy-btn{border-radius:999px;width:auto;margin-left:.3rem;padding:.1rem .5rem;font-size:.78rem}button[data-busy=true]{opacity:.85;position:relative}button,.file-btn,.links a,.capacity-fill{transition:border-color .18s,background .18s,width .25s}.grid{grid-template-columns:1fr;gap:1rem;display:grid}.exhibit{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:0 10px 24px var(--shadow);padding:1rem}.exhibit h2{margin:0;font-size:1.25rem}.callout{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--accent-2) 12%, var(--surface));margin-top:.8rem;padding:.75rem}.row{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem;display:grid}label{color:var(--muted);margin-bottom:.2rem;font-size:.9rem;display:block}textarea,input[type=text],input[type=password],button{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--surface-2) 80%, transparent);width:100%;color:var(--text);padding:.55rem .65rem;font-family:inherit;font-size:.98rem}textarea,input[type=text],input[type=password]{border-color:var(--control-border)}input[type=checkbox]{width:auto;accent-color:var(--accent);margin-right:.35rem}textarea{resize:vertical;min-height:96px}button{cursor:pointer;font-weight:600}button:hover{border-color:color-mix(in srgb, var(--accent) 45%, var(--border))}button:disabled{opacity:.6;cursor:not-allowed}.controls{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.6rem;margin-top:.65rem;display:grid}.canvas-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.8rem;margin-top:.8rem;display:grid}.figure{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--surface-2) 50%, transparent);padding:.45rem}.figure h3,.figure h4{margin:.15rem 0 .45rem;font-size:.9rem}canvas{border:1px solid var(--border);width:100%;height:auto;image-rendering:pixelated;background:color-mix(in srgb, var(--bg) 75%, transparent);border-radius:8px}.stats{color:var(--muted);margin-top:.65rem;font-size:.92rem;line-height:1.45}.status-ok{color:var(--accent-2)}.status-warn{color:var(--danger-ink)}table{border-collapse:collapse;width:100%;margin-top:.6rem;font-size:.9rem}.table-wrap{-webkit-overflow-scrolling:touch;overflow-x:auto}th,td{border:1px solid var(--border);text-align:left;padding:.45rem}small{color:var(--muted)}.links{flex-wrap:wrap;gap:.45rem;margin-top:.7rem;display:flex}.links a{border:1px solid var(--border);color:var(--text);border-radius:999px;padding:.35rem .7rem;text-decoration:none}.links a:hover{border-color:color-mix(in srgb, var(--accent) 45%, var(--border));background:color-mix(in srgb, var(--accent) 10%, transparent)}@media (width<=760px){.shell{width:100%;margin-top:.8rem;padding:0 .7rem}.row,.canvas-grid,.controls{grid-template-columns:1fr}h1{padding-right:3rem}}@media (width<=480px){.exhibit{padding:.75rem}.hero{padding:.9rem}button,.file-btn{min-height:44px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.001ms!important;animation-duration:.001ms!important;animation-iteration-count:1!important}}[data-theme=light] .skip-link{background-color:#b95600}[data-theme=light] .status-ok{color:#0c7c72}.lead-sentence{margin:.6rem 0;font-size:1.05rem;line-height:1.5}.deep-dive{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--surface-2) 40%, transparent);margin-top:.8rem;padding:0 .75rem}.deep-dive[open]{padding-bottom:.4rem}.deep-dive summary{cursor:pointer;color:var(--text);font-weight:600;font-family:var(--font-head);padding:.65rem 0;font-size:.95rem}.deep-dive summary:hover{color:var(--accent-ink)}.deep-dive summary:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px;border-radius:6px}.deep-dive p{margin:.35rem 0;font-size:.9rem;line-height:1.5}.walkthrough{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--accent-2) 8%, var(--surface));margin-top:.9rem;padding:.85rem}.walkthrough h3{margin:0 0 .35rem;font-size:1rem}.walk-intro{color:var(--muted);margin:0 0 .7rem;font-size:.9rem;line-height:1.5}.walk-stage{gap:.6rem;display:grid}.walk-pixel{justify-items:start;gap:.4rem;display:grid}.walk-pixel-label{color:var(--muted);letter-spacing:.04em;text-transform:uppercase;font-size:.78rem}.walk-byte{font-family:var(--font-head);flex-wrap:wrap;align-items:center;gap:.4rem;display:flex}.walk-channel{letter-spacing:.06em;border:1px solid var(--border);color:var(--text);background:var(--surface-2);border-radius:999px;padding:.15rem .45rem;font-size:.75rem;font-weight:700}.walk-channel-0{border-color:var(--danger)}.walk-channel-1{border-color:var(--accent-2)}.walk-channel-2{border-color:var(--accent)}.walk-cells{gap:.25rem;display:inline-flex}.walk-bit{border:1px solid var(--border);background:color-mix(in srgb, var(--surface-2) 85%, transparent);width:1.7rem;height:1.9rem;color:var(--text);font-variant-numeric:tabular-nums;border-radius:6px;place-items:center;font-size:1rem;font-weight:700;display:inline-grid}.walk-bit-lsb{border-color:var(--accent);background:color-mix(in srgb, var(--accent) 18%, var(--surface));border-width:2px}.walk-bit-flip{animation:.5s walk-flip}@keyframes walk-flip{0%{transform:scale(1)}40%{background:color-mix(in srgb, var(--accent) 45%, var(--surface));transform:scale(1.28)}to{transform:scale(1)}}.walk-value{color:var(--text);font-variant-numeric:tabular-nums;font-weight:700}.walk-legend{color:var(--muted);font-variant-numeric:tabular-nums;flex-wrap:wrap;gap:.25rem;font-size:.7rem;display:flex}.walk-legend span{place-items:center;min-width:1.7rem;display:inline-grid}.walk-legend span:first-child{min-width:auto;margin-right:.2rem}.walk-legend-lsb{color:var(--text);font-weight:600;min-width:auto!important}.walk-caption{color:var(--text);margin:0;font-size:.92rem;line-height:1.5}.walk-note{color:var(--muted);margin-top:.3rem;font-size:.82rem;display:block}.walk-controls{margin-top:.7rem}.dct-primer{color:var(--text);margin:.55rem 0;font-size:.92rem;line-height:1.55}.dct-primer-hint{color:var(--muted);font-style:italic}.dct-basis{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--surface-2) 55%, transparent);align-items:center;gap:.7rem;margin-top:.6rem;padding:.55rem .7rem;display:flex}.dct-basis canvas{flex:none;width:64px;height:64px}.dct-basis-text{color:var(--muted);font-size:.88rem;line-height:1.45}.residual-note{color:var(--muted);margin-top:.5rem;font-size:.86rem;line-height:1.45}.exhibit-step{background:var(--accent-2);color:#06231f;vertical-align:middle;border-radius:999px;place-items:center;width:1.6rem;height:1.6rem;margin-right:.5rem;font-size:.9rem;font-weight:700;display:inline-grid}[data-theme=light] .exhibit-step{color:#fff;background:var(--accent-2)}.dep-hint{color:var(--muted);margin-top:.4rem;font-size:.85rem;display:block}.dep-hint[hidden]{display:none}.toy{border:1px solid var(--border);border-radius:var(--radius-sm);background:color-mix(in srgb, var(--accent-2) 8%, var(--surface));margin:.8rem 0;padding:.85rem}.toy h3{margin:0 0 .35rem;font-size:1rem}.toy-intro{color:var(--muted);margin:0 0 .6rem;font-size:.9rem;line-height:1.5}.toy-slider-row{flex-wrap:wrap;align-items:center;gap:.7rem;margin-bottom:.6rem;display:flex}.toy-slider-row input[type=range]{width:auto;min-width:0;accent-color:var(--accent);flex:4rem}.toy-slider-row label{color:var(--text);white-space:nowrap;margin:0;font-size:.9rem}.toy-readout{font-variant-numeric:tabular-nums;color:var(--text);white-space:nowrap;font-weight:700}.toy-caption{color:var(--muted);margin:.55rem 0 0;font-size:.88rem;line-height:1.5}.cl-hero{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:clamp(1rem,4vw,3rem);margin:clamp(1rem,3vw,2rem) 0 1.5rem;display:flex}.cl-hero-main{flex:22rem;min-width:min(100%,20rem)}.cl-hero-title{letter-spacing:.01em;margin:0;font-size:clamp(1.6rem,3.8vw,2.7rem);font-weight:700;line-height:1.1}.cl-hero-sub{letter-spacing:.01em;opacity:.85;margin:.4rem 0 0;font-size:clamp(.9rem,1.6vw,1.05rem)}.cl-hero-desc{color:var(--muted);max-width:60ch;margin:.55rem 0 0;font-size:1rem;line-height:1.5}.cl-hero-why{border:1px solid var(--border);background:color-mix(in oklab,var(--accent) 6%,transparent);border-radius:10px;flex:0 min(40%,26rem);min-width:min(100%,15rem);padding:.85rem 1.05rem}.cl-hero-why-label{letter-spacing:.14em;font-size:.68rem;font-weight:700;display:block}.cl-hero-why-text{margin:.35rem 0 0;font-size:.95rem;line-height:1.5}@media (width<=640px){.cl-hero{flex-direction:column}.cl-hero-why{flex-basis:auto;width:100%}.cl-hero-main{flex-basis:auto;min-width:0}}.stats,.figure,.callout,.result,output,.mono{overflow-wrap:anywhere}