:root{--yellow: #ffe066;--yellow-hot: #ffcc00;--amber: #ffb84d;--chassis: #3a4660;--chassis-lit: #4a5772;--ink: #0d1017;--panel: #171d28;--text: #f4f4f4;--dim: #8b95ab;--dimmer: #5b6478;--screen-l: 5%;--screen-t: 4.8649%;--screen-w: 87.2222%;--screen-h: 64.3243%;--chrome: 8rem;--gutter: calc(2*clamp(.5rem, 2.5vw, 2rem) + clamp(.7rem, 2vh, 1.4rem) + 8px) ;--font-pixel: "Press Start 2P", ui-monospace, "Courier New", monospace;--font-mono: ui-monospace, "Cascadia Mono", Consolas, monospace;font-family:var(--font-pixel);line-height:1.6;color:var(--text);-webkit-text-size-adjust:100%}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100dvh;display:grid;place-items:center;overflow-x:hidden;padding:clamp(.5rem,2.5vw,2rem);color:var(--text);background-color:#2b3448;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' shape-rendering='crispEdges'%3E%3Crect width='96' height='96' fill='%232b3448'/%3E%3Cg fill='%23171d28'%3E%3Crect y='0' width='96' height='4'/%3E%3Crect y='48' width='96' height='4'/%3E%3Crect x='0' y='4' width='4' height='44'/%3E%3Crect x='48' y='4' width='4' height='44'/%3E%3Crect x='24' y='52' width='4' height='44'/%3E%3Crect x='72' y='52' width='4' height='44'/%3E%3C/g%3E%3C/svg%3E");background-repeat:repeat;background-size:96px 96px}@media (max-width: 480px){body{background-size:56px 56px}}#root{width:100%;display:grid;place-items:center}.shell{width:100%;display:flex;flex-direction:column;align-items:center}.tv-wrap{width:100%;display:grid;place-items:center}.tv{position:relative;width:min(100%,700px,calc((100dvh - var(--chrome, 8rem) - var(--gutter)) * .973));aspect-ratio:720 / 740;font-size:clamp(6px,2.1vw,14px);filter:drop-shadow(0 1.2rem 1.6rem rgba(0,0,0,.45))}@supports (width: 1cqi){.tv{container-type:inline-size}.tv-content{font-size:clamp(6px,2.35cqi,14px)}}.tv-svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%}.tv-led{fill:#3a2626;transition:fill .15s}.tv-led.is-rec{fill:#ff7a3d;filter:drop-shadow(0 0 7px #ff7a3d);animation:led-pulse 1s steps(2,end) infinite}.tv-led.is-armed{fill:#6cf07a;filter:drop-shadow(0 0 7px #6cf07a)}@keyframes led-pulse{0%,to{opacity:1}50%{opacity:.35}}.tv-screen{position:absolute;left:var(--screen-l);top:var(--screen-t);width:var(--screen-w);height:var(--screen-h);z-index:2;overflow:hidden;background:radial-gradient(120% 130% at 50% 40%,#12161f,#0d1017 55%,#070910);isolation:isolate}.tv-content{position:absolute;top:0;right:0;bottom:0;left:0;z-index:4;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.3em;padding:1.3em 1.2em;text-align:center}.tv-glass{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;pointer-events:none;background:linear-gradient(147deg,rgba(255,255,255,.055) 0%,transparent 42%),radial-gradient(115% 115% at 50% 50%,transparent 58%,rgba(0,0,0,.55) 100%)}.tv-scanlines{position:absolute;top:0;right:0;bottom:0;left:0;z-index:6;pointer-events:none;background:repeating-linear-gradient(to bottom,rgba(0,0,0,.24) 0 1px,transparent 1px 3px);mix-blend-mode:multiply;animation:crt-breathe 5.5s ease-in-out infinite}@keyframes crt-breathe{0%,to{opacity:.88}50%{opacity:1}}h1{margin:0;font-size:2.4em;letter-spacing:.1em;color:var(--yellow);text-shadow:.08em .08em 0 #232b3a,.16em .16em 0 #000,0 0 .5em rgba(255,224,102,.45)}h2{margin:0;font-size:1em;font-weight:400;letter-spacing:.1em;color:var(--dim)}label{display:block;font-size:1.05em;letter-spacing:.06em;color:var(--yellow)}.step{display:flex;flex-direction:column;align-items:center;gap:1.05em;width:100%}.row{display:flex;gap:.8em;flex-wrap:wrap;justify-content:center}.pixel-input,.pixel-btn{font:inherit;font-size:1em;border:.22em solid var(--yellow);border-radius:0;background:var(--panel);color:var(--text);padding:.7em 1em;box-shadow:.16em .16em #000;outline:none;transition:border-color .15s,box-shadow .15s,transform .05s,color .15s}.pixel-input{width:100%;min-width:0;letter-spacing:.04em;text-overflow:ellipsis}.pixel-input::placeholder{color:var(--dimmer)}.pixel-input:focus-visible,.pixel-btn:hover{border-color:var(--yellow-hot);box-shadow:.16em .16em 0 var(--yellow-hot)}.pixel-btn{cursor:pointer;color:var(--yellow);white-space:nowrap}.pixel-btn:active{transform:translate(.08em,.08em);box-shadow:.08em .08em #000}.pixel-btn.ghost{border-color:#4a5570;color:var(--dim)}.pixel-btn.ghost:hover{border-color:var(--dim);box-shadow:.16em .16em #4a5570}.meter{width:100%;height:.5em;background:var(--panel);border:.16em solid var(--chassis)}.meter-fill{height:100%;background:linear-gradient(90deg,var(--amber),var(--yellow));transition:width .08s linear,background .2s}.meter.is-armed{border-color:#2f6b3f}.meter.is-armed .meter-fill{background:linear-gradient(90deg,#3fbf5f,#6cf07a)}@keyframes answer-in{0%{opacity:0;transform:translateY(.3em)}to{opacity:1;transform:none}}.answer-display{display:flex;flex-direction:column;gap:.8em;max-width:40ch;animation:answer-in .28s ease-out both}.asked{margin:0;font-size:.78em;line-height:1.8;color:var(--dim)}.answer{margin:0;font-size:1.5em;line-height:1.7;color:var(--yellow);overflow-wrap:break-word;text-shadow:.06em .06em 0 #000,0 0 .6em rgba(255,224,102,.5)}.mute-btn{position:absolute;top:.6em;right:.6em;z-index:7;display:grid;place-items:center;width:2.4em;height:2.4em;padding:0;background:var(--panel);border:.16em solid var(--chassis);border-radius:0;color:var(--yellow);cursor:pointer}.mute-btn:hover{border-color:var(--yellow)}.mute-btn svg{width:60%;height:60%;display:block}.site-footer{width:min(100%,700px);margin-top:clamp(.7rem,2vh,1.4rem);display:flex;flex-direction:column;align-items:center;gap:.6rem;text-align:center}.ca{display:flex;align-items:stretch;gap:0;border:2px solid var(--chassis);background:#0d1017c7;max-width:100%}.ca-label,.ca-value{display:flex;align-items:center;font-family:var(--font-mono);font-size:clamp(.55rem,1.7vw,.74rem);letter-spacing:.04em;padding:.5em .7em}.ca-label{flex:none;color:var(--ink);background:var(--yellow);font-weight:700}.ca-value{min-width:0;color:var(--text);text-align:left;white-space:normal;overflow-wrap:anywhere;line-height:1.4}.ca-copy{flex:none;display:grid;place-items:center;width:2.2em;padding:0;color:var(--dim);background:transparent;border:0;border-left:2px solid var(--chassis);border-radius:0;cursor:pointer;transition:color .15s,background .15s}.ca-copy svg{width:1em;height:1em;display:block}.ca-copy:hover{color:var(--yellow);background:#ffe06614}.ca-copy.is-done{color:#6cf07a}.foot-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem}.foot-link{font-family:var(--font-mono);font-size:clamp(.62rem,1.9vw,.76rem);letter-spacing:.04em;padding:.5em .85em;color:var(--dim);background:#0d1017b8;border:2px solid var(--chassis);border-radius:0;text-decoration:none;cursor:pointer;transition:color .15s,border-color .15s,box-shadow .15s}.foot-link:hover{color:var(--yellow);border-color:var(--yellow);box-shadow:2px 2px #000}.foot-link.is-icon{display:grid;place-items:center;width:2.4em;height:2.4em;padding:0}.foot-link.is-icon svg{width:1.05em;height:1.05em;display:block}.foot-note{margin:0;display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;font-family:var(--font-mono);font-size:clamp(.55rem,1.6vw,.68rem);color:var(--dimmer)}.foot-sep{color:var(--chassis)}.stage-on .ca,.stage-on .foot-note,.stage-on .foot-nav .foot-link:not(.stage-toggle){display:none}.stage-on .stage-toggle{opacity:.18;border-color:transparent;background:transparent}.stage-on .stage-toggle:hover,.stage-on .stage-toggle:focus-visible{opacity:1;border-color:var(--chassis)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@keyframes sheet-in{0%{opacity:0}to{opacity:1}}@keyframes panel-in{0%{opacity:0;transform:translateY(1rem)}to{opacity:1;transform:none}}.sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:grid;place-items:center;padding:clamp(.5rem,3vw,2rem);background:#05070beb;animation:sheet-in .18s ease-out both}.sheet-panel{width:min(100%,640px);max-height:min(86dvh,720px);display:flex;flex-direction:column;background:#10141d;border:4px solid var(--yellow);box-shadow:10px 10px #000;animation:panel-in .22s ease-out both}.sheet-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.2rem;border-bottom:3px solid var(--chassis);background:#161c28}.sheet-head h2{font-size:clamp(.72rem,2.4vw,.95rem);color:var(--yellow);letter-spacing:.1em}.sheet-x{font-family:var(--font-pixel);font-size:.75rem;width:2.2rem;height:2.2rem;flex:none;color:var(--dim);background:var(--panel);border:2px solid var(--chassis);border-radius:0;cursor:pointer}.sheet-x:hover{color:var(--yellow);border-color:var(--yellow)}.sheet-body{padding:1.2rem;overflow-y:auto;font-family:var(--font-mono);font-size:clamp(.72rem,2.1vw,.85rem);line-height:1.85;color:#cdd4e2;display:flex;flex-direction:column;gap:1.1rem}.sheet-body p{margin:0}.sheet-body strong,.sheet-body b{color:var(--text)}.sheet-body code{font-family:var(--font-mono);font-size:.94em;padding:.1em .35em;color:var(--yellow);background:#ffe06617;border:1px solid rgba(255,224,102,.22);overflow-wrap:anywhere}.warn{padding:.7rem .9rem;color:var(--amber);background:#ffb84d17;border-left:4px solid var(--amber)}.steps{margin:0;padding-left:1.4rem;display:flex;flex-direction:column;gap:.9rem}.steps li::marker{color:var(--yellow)}.steps b{color:var(--yellow)}.example{padding:.9rem 1rem;background:#0c1017;border:2px solid var(--chassis)}.example p{margin:0 0 .5rem}.example p:last-child{margin-bottom:0}.example-label{display:block;margin-bottom:.6rem;font-family:var(--font-pixel);font-size:.6rem;letter-spacing:.12em;color:var(--dim)}.tips{margin:0;padding-left:1.4rem;display:flex;flex-direction:column;gap:.45rem}.tips li::marker{color:var(--chassis-lit)}.fineprint{font-size:.9em;color:var(--dimmer)}.sheet-foot{padding:1rem 1.2rem;border-top:3px solid var(--chassis);background:#161c28;display:flex;justify-content:flex-end}.sheet-foot .pixel-btn{font-family:var(--font-pixel);font-size:.72rem}:focus-visible{outline:.16em solid var(--yellow-hot);outline-offset:.16em}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}.tv-scanlines{display:none}}.sheet-body .ok{color:#6cf07a}.practice{width:100%;display:flex;flex-direction:column;gap:.35em;padding:.6em .7em;font-family:var(--font-mono);font-size:.72em;line-height:1.5;text-align:left;color:var(--dim);background:#ff7a3d14;border:.16em dashed #8a5a3a}.practice-row{display:flex;gap:.6em;align-items:baseline}.practice-key{flex:none;color:#c98a5e}.practice-val{color:var(--text);overflow-wrap:anywhere}.practice-val.is-empty{color:var(--dimmer)}.practice-val.is-answer{color:#6cf07a}.practice-state{color:#ff9a5d}.steps.tight{gap:.4rem}.sheet-body .rec{color:#ff9a5d}.practice-toggle{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 1rem;background:#ff7a3d14;border:2px dashed #8a5a3a}.practice-toggle p{margin:.3rem 0 0}.practice-toggle .pixel-btn{font-family:var(--font-pixel);font-size:.7rem;flex:none}
