:root{color-scheme:dark;--bg: #0b0a10;--panel: #13121b;--line: #262433;--text: #e8e4f2;--dim: #8d88a3;--accent: #ff4fa8;--ok: #5ee39a;--bad: #ff5c7a;--mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--sans: system-ui, -apple-system, "Segoe UI", sans-serif}*{box-sizing:border-box}html,body{height:100%;margin:0}body{background:var(--bg);color:var(--text);font:14px/1.45 var(--sans)}button,select,input{font:inherit;color:inherit}a{color:inherit}.top{grid-area:top;display:flex;align-items:baseline;gap:18px;padding:10px 18px;border-bottom:1px solid var(--line)}.mark{font:700 18px/1 var(--mono);letter-spacing:.18em;text-decoration:none;background:linear-gradient(180deg,#fff6e8,#ff9c7c 55%,#8a3cc8);-webkit-background-clip:text;background-clip:text;color:transparent}.tagline{margin:0;color:var(--dim);font-size:13px;flex:1}.gh{color:var(--dim);display:flex;align-self:center}.gh:hover{color:var(--text)}.credit a{color:var(--dim);text-decoration:none}.credit a:hover{color:var(--text);text-decoration:underline}.question .credit{margin-top:14px;font-size:13px}.back{font-size:13px;color:var(--dim);text-decoration:none}.back:before{content:"← "}.back:hover{color:var(--text)}.res{display:flex;gap:8px;align-items:center;color:var(--dim);font-size:12px}.res select{background:var(--panel);border:1px solid var(--line);border-radius:6px;padding:3px 6px}.is-home .rail,.is-home .stage,.is-home .side,.is-home .code,.is-home .back,.is-home .res,.is-lab .home{display:none}body.is-home{display:flex;flex-direction:column;min-height:100vh}body.is-lab{display:grid;grid-template-columns:210px minmax(0,1fr) 290px;grid-template-rows:auto minmax(0,1fr) minmax(190px,38vh);grid-template-areas:"top top top" "rail stage side" "code code code";height:100vh;overflow:hidden}.home{position:relative;flex:1;min-height:620px;overflow:hidden;background:radial-gradient(ellipse 60% 50% at 50% 52%,#ff4fa818,transparent 70%),radial-gradient(ellipse 80% 70% at 50% 120%,#4fc3e812,transparent 70%)}.question{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);width:min(560px,46vw);text-align:center;z-index:1}.question .logo{display:block;width:min(560px,86%,58vh);margin:0 auto 10px;image-rendering:pixelated;transform:rotate(-3deg);filter:drop-shadow(0 0 28px #ff4fa855)}.question h1{margin:0 0 14px;font:700 clamp(26px,3.2vw,44px)/1.15 var(--sans);letter-spacing:-.01em}.question .in{white-space:nowrap}.question b{display:inline-block;transition:color .2s}.question b.flip{animation:flip .2s ease-out}@keyframes flip{0%{transform:translateY(-.35em) rotateX(70deg);opacity:.2}to{transform:none;opacity:1}}.question p{margin:0 auto;max-width:440px;color:var(--dim);font-size:15px}.card{position:absolute;left:var(--x);top:var(--y);width:clamp(130px,min(15vw,25vh),230px);transform:translate(-50%,-50%) rotate(var(--r));padding:7px 7px 9px;background:#17151f;border:1px solid var(--line);border-radius:10px;box-shadow:0 18px 40px #000a;text-decoration:none;transition:transform .25s,box-shadow .25s,border-color .25s}.card:hover,.card:focus-visible{transform:translate(-50%,-54%) rotate(0) scale(1.08);border-color:var(--accent);box-shadow:0 24px 60px #000c,0 0 0 1px var(--accent);z-index:2;outline:none}.card canvas{display:block;width:100%;aspect-ratio:16 / 9;border-radius:6px;background:#000;image-rendering:pixelated}.card .label{display:block;margin-top:7px;font:600 12.5px var(--mono);letter-spacing:.06em}.card .label b{color:var(--dim);font-weight:400;margin-right:4px}.card .trick{display:block;font-size:11.5px;color:var(--dim)}.rail{grid-area:rail;overflow-y:auto;border-right:1px solid var(--line);padding:8px 0}.rail a{display:grid;grid-template-columns:26px 1fr;padding:7px 14px 7px 12px;border-left:2px solid transparent;color:var(--dim);text-decoration:none}.rail a:hover{color:var(--text);background:#ffffff06}.rail a[aria-current=true]{color:var(--text);border-left-color:var(--accent);background:#ff4fa810}.rail .num{font:12px/1.6 var(--mono);opacity:.6}.rail .name{font:600 13px/1.6 var(--mono);letter-spacing:.06em}.rail .sub{grid-column:2;font-size:11.5px;opacity:.75}.stage{grid-area:stage;display:flex;flex-direction:column;min-height:0;padding:14px 16px 8px;gap:8px}.panes{flex:1;min-height:0;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:14px;align-items:center}.pane{margin:0;min-width:0;display:flex;flex-direction:column;align-items:center;gap:7px;height:100%;justify-content:center}.pane[hidden]{display:none}.pane canvas{display:block;max-width:100%;max-height:calc(100% - 30px);aspect-ratio:16 / 9;image-rendering:pixelated;background:#000;border-radius:4px;box-shadow:0 0 0 1px var(--line),0 10px 40px #0008}.pane figcaption{display:flex;gap:12px;align-items:center;font:12px var(--mono);color:var(--dim)}.pane .who{font-weight:600}.cost{display:flex;align-items:center;gap:8px;cursor:help}.bar{width:70px;height:5px;border-radius:3px;background:#ffffff14;overflow:hidden}.bar i{display:block;height:100%;width:0;background:var(--ok);transition:width .3s}.bar i.over{background:var(--bad)}.transport{display:flex;align-items:center;gap:6px;font:12px var(--mono);color:var(--dim)}.icon{width:30px;height:26px;border-radius:6px;border:1px solid var(--line);background:var(--panel);cursor:pointer;font-size:12px}.icon:hover{border-color:var(--dim)}.frame{margin-left:8px;min-width:9ch}.fps{margin-left:auto}.side{grid-area:side;border-left:1px solid var(--line);padding:12px 16px;overflow-y:auto;display:flex;flex-direction:column;gap:16px}.side h2{margin:0 0 7px;font:600 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}.side [hidden]{display:none}.picker{display:flex;flex-wrap:wrap;gap:6px}.picker button{border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:3px 11px;cursor:pointer;font-size:13px;--c: var(--dim)}.picker button:hover{border-color:var(--c)}.picker button[aria-checked=true]{border-color:var(--c);background:color-mix(in srgb,var(--c) 18%,var(--panel));color:#fff}.picker button:disabled{opacity:.35;cursor:default}.hint{margin:8px 0 0;font-size:12.5px;color:var(--dim)}.ladder ol{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-direction:column;gap:5px}.ladder button{display:grid;grid-template-columns:22px 1fr;gap:4px;width:100%;text-align:left;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--panel);cursor:pointer}.ladder button:hover{border-color:var(--dim)}.ladder button[aria-pressed=true]{border-color:var(--accent);background:#ff4fa812}.ladder button>b{font:600 13px var(--mono);color:var(--accent)}.ladder .sname{display:block;font-weight:600;font-size:13px}.ladder .sname em{font:400 11px var(--mono);font-style:normal;color:var(--accent);margin-left:4px}.ladder .hint{margin:0 0 8px}.ladder .stext{display:none;font-size:12px;color:var(--dim);margin-top:2px}.ladder button[aria-pressed=true] .stext{display:block}.verdict{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:10px 12px}.verdict p{margin:0 0 8px;font:12.5px/1.45 var(--mono)}.verdict .same{color:var(--ok)}.verdict .differ{color:var(--bad)}.toggle{display:flex;gap:8px;align-items:center;font-size:12.5px;color:var(--dim);cursor:pointer}.toggle:has(input:disabled){opacity:.4;cursor:default}.legend{margin:8px 0 0!important;display:flex;align-items:center;gap:6px;font:12px var(--sans)!important;color:var(--dim)}.legend i{width:12px;height:12px;border-radius:2px;display:inline-block}.legend i.same{background:#444}.legend i.differ{background:#ff40ff;margin-left:8px}.wide{width:100%;padding:6px 10px;border:1px solid var(--line);border-radius:8px;background:var(--panel);cursor:pointer;font-size:13px}.wide:hover{border-color:var(--dim)}.wide:disabled{opacity:.5;cursor:default}.race ol{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}.race li{display:grid;grid-template-columns:minmax(78px,max-content) 1fr 62px;grid-template-rows:auto auto;align-items:center;column-gap:8px;font:12px var(--mono)}.race .rl{color:var(--c);font-weight:600}.race .rbar{height:6px;border-radius:3px;background:#ffffff10;overflow:hidden}.race .rbar i{display:block;height:100%;background:var(--c)}.race .rms{text-align:right;color:var(--text)}.race .rv{grid-column:2 / 4;font-size:11px;color:var(--ok)}.race .rv.differ{color:var(--bad)}.race li.native{opacity:.6}.race li.native .rv{color:var(--dim)}.about h2{color:var(--text);font-size:13px;letter-spacing:.08em}.about p{margin:0 0 6px;color:var(--dim);font-size:13px}.about .trick{color:var(--accent);font:12px var(--mono)}.code{grid-area:code;border-top:1px solid var(--line);display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);min-height:0}.excerpt{display:flex;flex-direction:column;min-height:0;border-right:1px solid var(--line);border-top:3px solid var(--c);background:color-mix(in srgb,var(--c) 4%,var(--bg))}.excerpt:last-child{border-right:0}.excerpt header{display:flex;gap:10px;align-items:baseline;padding:7px 14px;font:12px var(--mono);color:var(--dim);border-bottom:1px solid var(--line)}.excerpt header b{color:var(--c);font-size:13px;white-space:nowrap}.excerpt header .how{font-family:var(--sans);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.excerpt header .full{white-space:nowrap;border:1px solid var(--line);background:none;border-radius:6px;padding:1px 8px;font:11.5px var(--mono);color:var(--dim);cursor:pointer}.excerpt header .full:hover{color:var(--text);border-color:var(--c)}.excerpt .note{margin:0;padding:8px 14px;font-size:12.5px;color:var(--text);background:color-mix(in srgb,var(--c) 9%,transparent);border-bottom:1px solid var(--line)}.excerpt .note code{font:11.5px var(--mono);color:var(--c)}.excerpt .body{overflow:auto;flex:1;min-height:0}.excerpt pre{margin:0;padding:10px 14px;font:12.5px/1.5 var(--mono);background:transparent!important;tab-size:4}.excerpt .missing{padding:14px;color:var(--dim);font-style:italic}@media(max-width:900px){body.is-lab{display:flex;flex-direction:column;height:auto;overflow:auto}.top{flex-wrap:wrap;padding:10px 16px}.tagline{flex-basis:100%;order:3}.rail{order:1;position:sticky;top:0;z-index:3;display:flex;overflow-x:auto;padding:0;background:var(--bg);border-right:0;border-bottom:1px solid var(--line)}.stage{padding:12px 16px;order:2}.side{order:3;border-left:0;border-top:1px solid var(--line)}.code{order:4;grid-auto-flow:row}.panes{grid-auto-flow:row}.pane canvas{max-height:none;width:100%}.rail a{flex:none;display:block;padding:10px 14px;border-left:0;border-bottom:2px solid transparent}.rail .num{display:none}.rail a[aria-current=true]{border-bottom-color:var(--accent)}.rail .sub{display:none}.excerpt{border-right:0}.excerpt .body{max-height:60vh}body.is-home{height:auto}.home{min-height:0;overflow:visible;padding:24px 16px;display:flex;flex-direction:column;gap:20px}.question{position:static;transform:none;width:auto}.cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}.card{position:static;width:auto;transform:rotate(calc(var(--r) / 2))}.card:hover{transform:scale(1.03)}}.source{position:fixed;inset:0;z-index:10}.source[hidden]{display:none}.source .scrim{position:absolute;inset:0;background:#0009}.drawer{position:absolute;top:0;right:0;bottom:0;width:min(1000px,94vw);display:flex;flex-direction:column;background:var(--bg);border-left:1px solid var(--line);box-shadow:-20px 0 60px #000a}.drawer header{display:flex;align-items:baseline;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line);font:12.5px var(--mono);color:var(--dim)}.drawer header b{font-size:14px}.drawer header span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drawer-body{flex:1;min-height:0;display:grid;grid-template-columns:190px minmax(0,1fr)}.drawer nav{overflow-y:auto;border-right:1px solid var(--line);padding:6px 0}.drawer nav button{display:block;width:100%;text-align:left;padding:4px 12px;border:0;background:none;font:12px var(--mono);color:var(--dim);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drawer nav button:hover{color:var(--text)}.drawer nav button[aria-current=true]{color:var(--text);background:#ff4fa814}.drawer-code{overflow:auto}.drawer-code pre{margin:0;padding:12px 16px;font:12.5px/1.5 var(--mono);background:transparent!important;tab-size:4;counter-reset:ln}.drawer-code .line{counter-increment:ln}.drawer-code .line:before{content:counter(ln);display:inline-block;width:3.2em;margin-right:1em;text-align:right;color:#ffffff30}.drawer-code .line.hl{background:#ff4fa81c;box-shadow:inset 3px 0 0 var(--accent)}@media(max-width:900px){.drawer-body{grid-template-columns:minmax(0,1fr)}.drawer nav{display:none}}