@property --accent{syntax:"<color>";inherits:true;initial-value:#6dffa0}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#07080a;--ink:#ece8df;--muted:#9b978e;--line:#ffffff17;--glass:#090a0da8;--accent:#6dffa0;--sans:"Inter Tight", system-ui, sans-serif;--mono:"IBM Plex Mono", ui-monospace, monospace;--era-font:var(--sans);transition:--accent .8s}body[data-active=vector]{--accent:#6dffa0}body[data-active=bit8]{--accent:#f0743a}body[data-active=bit16]{--accent:#9db8ff}body[data-active=psx]{--accent:#c8a2ff}body[data-active=sixth]{--accent:#ffbe5c}body[data-active=pbr]{--accent:#e9dcc6}body[data-active=raytrace]{--accent:#7fd3ff}body[data-active=splats]{--accent:#ff9ecb}*{box-sizing:border-box}html{background:var(--bg);scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}body{background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;margin:0;transition:--accent .8s}a{color:inherit}#gl{z-index:0;width:100%;height:100lvh;display:block;position:fixed;inset:0}.top{z-index:10;pointer-events:none;font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;justify-content:space-between;align-items:center;padding:18px 24px;display:flex;position:fixed;inset:0 0 auto}.top a{pointer-events:auto;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#07080a80;border-radius:999px;padding:8px 10px;text-decoration:none}.mark:before{content:"";background:var(--accent);width:8px;height:8px;box-shadow:0 0 12px var(--accent);vertical-align:1px;margin-right:9px;display:inline-block}.rail{z-index:10;font:500 11px/1 var(--mono);opacity:0;flex-direction:column;gap:2px;transition:opacity .4s;display:flex;position:fixed;top:50%;right:20px;translate:0 -50%}body[data-active] .rail{opacity:1}.rail a{color:var(--muted);justify-content:flex-end;align-items:center;gap:8px;padding:7px 0;text-decoration:none;display:flex}.rail a:after{content:"";background:currentColor;width:14px;height:1px;transition:width .3s,background .3s}.rail a span{background:#07080a8c;border-radius:4px;padding:3px 6px}.rail a:hover{color:var(--ink)}body[data-active=vector] .rail [data-for=vector],body[data-active=bit8] .rail [data-for=bit8],body[data-active=bit16] .rail [data-for=bit16],body[data-active=psx] .rail [data-for=psx],body[data-active=sixth] .rail [data-for=sixth],body[data-active=pbr] .rail [data-for=pbr],body[data-active=raytrace] .rail [data-for=raytrace],body[data-active=splats] .rail [data-for=splats]{color:var(--accent)}body[data-active=vector] .rail [data-for=vector]:after,body[data-active=bit8] .rail [data-for=bit8]:after,body[data-active=bit16] .rail [data-for=bit16]:after,body[data-active=psx] .rail [data-for=psx]:after,body[data-active=sixth] .rail [data-for=sixth]:after,body[data-active=pbr] .rail [data-for=pbr]:after,body[data-active=raytrace] .rail [data-for=raytrace]:after,body[data-active=splats] .rail [data-for=splats]:after{width:28px}main{z-index:1;position:relative}.hero{place-items:center;height:100svh;min-height:560px;display:grid;position:relative;overflow:hidden}.hero:before{content:"";pointer-events:none;background:radial-gradient(60% 45% at 50% 46%,#07080ac7,#07080a33 70%,#0000);position:absolute;inset:0}.hero-copy{text-align:center;max-width:980px;padding:0 16px;position:relative}.kicker{font:500 12px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin:0 0 18px}.title{letter-spacing:.01em;white-space:nowrap;justify-content:center;align-items:baseline;margin:0;font-size:clamp(36px,8.4vw,124px);font-weight:400;line-height:1;display:flex}.title span{font-family:var(--f), var(--sans);text-align:center;min-width:.62em;animation:.9s cubic-bezier(.2,.7,.2,1) both letter;display:inline-block}.title span:nth-child(2){font-size:.62em;animation-delay:50ms}.title span:nth-child(11){font-size:.62em}.title span:nth-child(3){animation-delay:.1s}.title span:nth-child(4){animation-delay:.15s}.title span:nth-child(5){font-weight:700;animation-delay:.2s}.title span:nth-child(6){font-weight:800;animation-delay:.25s}.title span:nth-child(7){font-weight:700;animation-delay:.3s}.title span:nth-child(8){font-size:1.12em;font-style:italic;animation-delay:.35s}.title span:nth-child(9){font-weight:800;animation-delay:.4s}.title span:nth-child(10){animation-delay:.45s}.title span:nth-child(11){animation-delay:.5s}@keyframes letter{0%{opacity:0;filter:blur(8px);translate:0 .25em}}.lede{color:#d8d4cb;text-wrap:balance;max-width:560px;margin:26px auto 0;font-size:clamp(16px,1.6vw,19px)}.strips{font:500 11px/1.3 var(--mono);color:var(--ink);grid-template-columns:repeat(8,1fr);margin:0;padding:0;list-style:none;display:grid;position:absolute;inset:auto 0 0}.strips li{background:linear-gradient(#0000,#07080abf);padding:14px 10px 18px}.strips em{color:var(--muted);font-style:normal;display:block}.scroll-cue{font:500 11px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#07080a80;border-radius:999px;padding:10px 14px;text-decoration:none;position:absolute;bottom:84px;left:50%;translate:-50%}.scroll-cue:after{content:" ↓";animation:1.8s ease-in-out infinite nudge;display:inline-block}@keyframes nudge{50%{translate:0 3px}}.no-gl-note{display:none}.no-gl .no-gl-note{text-align:center;max-width:420px;color:var(--muted);padding:0 16px;display:block;position:absolute;bottom:140px}.chapter{height:230vh;padding:0 24px;display:flow-root;position:relative}.card{background:var(--glass);-webkit-backdrop-filter:blur(16px)saturate(1.2);border:1px solid var(--line);color:#d9d5cc;border-radius:16px;width:min(430px,100%);margin-top:40vh;padding:26px 28px 24px;font-size:15px;line-height:1.6;animation:linear both rise;animation-timeline:view();animation-range:entry entry 60%;position:sticky;top:max(84px,14vh)}@keyframes rise{0%{opacity:0;translate:0 40px}}.card p{margin:0 0 12px}.era{font:400 13px/1 var(--era-font);color:var(--accent);letter-spacing:.08em}.card .era{margin-bottom:14px}.card h2{font:400 34px/1.08 var(--era-font);color:var(--ink);text-wrap:balance;margin:0 0 16px}.how,.wild{font:400 12.5px/1.6 var(--mono);color:var(--muted)}.how{border-top:1px solid var(--line);padding-top:12px}.how b,.wild b{letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:4px;font-size:10.5px;font-weight:500;display:block}.wild{margin-bottom:0!important}.wild span{border:1px solid var(--line);color:#cfcac0;border-radius:999px;margin:0 4px 6px 0;padding:2px 8px;display:inline-block}#vector{--era-font:"Major Mono Display", var(--mono)}#vector h2{text-transform:lowercase;font-size:30px}#bit8{--era-font:"Press Start 2P", var(--mono)}#bit8 h2{font-size:19px;line-height:1.5}#bit8 .era{font-size:11px}#bit16{--era-font:"Pixelify Sans", var(--sans)}#bit16 h2{font-size:38px;font-weight:700}#psx{--era-font:"Audiowide", var(--sans)}#psx h2{font-size:30px}#sixth{--era-font:"Rajdhani", var(--sans)}#sixth h2{text-transform:uppercase;letter-spacing:.02em;font-size:38px;font-weight:700}#pbr{--era-font:"Inter Tight", var(--sans)}#pbr h2{letter-spacing:-.02em;font-weight:600}#raytrace{--era-font:"Space Grotesk", var(--sans)}#raytrace h2{letter-spacing:-.02em;font-weight:700}#splats{--era-font:"Instrument Serif", serif}#splats h2{font-size:44px;font-style:italic}.dock{z-index:20;opacity:0;visibility:hidden;-webkit-backdrop-filter:blur(16px)saturate(1.3);border:1px solid var(--line);max-width:calc(100vw - 32px);font:500 12px/1 var(--mono);background:#090a0dc7;border-radius:16px;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px 14px;padding:10px 12px 10px 16px;transition:opacity .35s,translate .35s,visibility .35s;display:flex;position:fixed;bottom:18px;left:50%;translate:-50% 16px}.dock.visible{opacity:1;visibility:visible;translate:-50%}.dock-era{color:var(--accent);letter-spacing:.06em;white-space:nowrap}.dock-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 14px;display:flex}.dock-status{color:var(--muted);white-space:nowrap;font-size:11px}.dock-status:empty{display:none}.ctl-range{color:var(--muted);align-items:center;gap:8px;display:flex}.ctl-range output{min-width:3.6em;color:var(--ink);font-variant-numeric:tabular-nums}input[type=range]{appearance:none;width:120px;height:18px;accent-color:var(--accent);background:0 0;margin:0}input[type=range]::-webkit-slider-runnable-track{background:#ffffff2e;border-radius:2px;height:2px}input[type=range]::-moz-range-track{background:#ffffff2e;height:2px}input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);border-radius:50%;width:14px;height:14px;margin-top:-6px;box-shadow:0 0 0 4px #00000059}input[type=range]::-moz-range-thumb{background:var(--accent);border:0;border-radius:50%;width:14px;height:14px}.seg{border:1px solid var(--line);border-radius:10px;padding:2px;display:inline-flex}.seg button,.tog{font:inherit;color:var(--muted);cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:8px;padding:7px 10px}.seg button[aria-pressed=true]{color:#08090b;background:var(--accent)}.tog{border:1px solid var(--line);padding-left:26px;position:relative}.tog:before{content:"";border:1px solid var(--muted);border-radius:2px;width:8px;height:8px;position:absolute;top:50%;left:10px;translate:0 -50%}.tog[aria-pressed=true]{color:var(--ink)}.tog[aria-pressed=true]:before{background:var(--accent);border-color:var(--accent);box-shadow:0 0 8px var(--accent)}.seg button:hover,.tog:hover{color:var(--ink)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.colophon{background:var(--bg);border-top:1px solid var(--line);padding:120px 24px 80px;position:relative}.colophon-inner{max-width:1040px;margin:0 auto}.colophon h2{text-wrap:balance;margin:0 0 24px;font:400 clamp(36px,5vw,64px)/1.05 Instrument Serif,serif}.colophon .big{color:#d8d4cb;text-wrap:pretty;max-width:720px;font-size:19px}.cols{border-top:1px solid var(--line);color:#cfcac0;grid-template-columns:1fr 1fr;gap:48px;margin-top:64px;padding-top:32px;font-size:15px;display:grid}.cols h3{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:0 0 14px}.cols ul{margin:0;padding:0;list-style:none}.cols li{border-bottom:1px solid var(--line);padding:8px 0}.cols li a{text-decoration:none}.cols li a:hover{color:var(--accent)}.author{border-top:1px solid var(--line);font:500 12px/1.6 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:28px;padding-top:16px}.author b{font:600 15px/1 var(--sans);letter-spacing:-.01em;text-transform:none;color:var(--ink)}.back{font:500 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:56px;text-decoration:none;display:inline-block}.back:hover{color:var(--ink)}@media (width<=720px){.rail{display:none}.chapter{padding:0 16px}.card{margin-top:110vh;padding:20px;font-size:14px;top:auto;bottom:120px}.card p:not(.era):not(.how):not(.wild):nth-of-type(3){display:none}.strips{font-size:9px}.strips em{display:none}.strips li{text-align:center;padding:10px 4px 14px}.cols{grid-template-columns:1fr;gap:32px}input[type=range]{width:96px}.dock{gap:8px;padding:8px 10px;bottom:10px}.dock-status{display:none}}.author a{color:inherit;text-decoration:none}.author a:hover{text-underline-offset:2px;text-decoration:underline}