:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#020508;color:#eaffff}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#020508}
body{display:grid;place-items:center}button{font:inherit;color:inherit}
#app{position:relative;width:min(100vw,100vh,600px);height:min(100vw,100vh,600px);aspect-ratio:1;background:#05090d;overflow:hidden;outline:1px solid #18313b}
canvas{display:block;width:100%;height:100%;touch-action:none}
.overlay{position:absolute;inset:0;display:none;align-items:center;justify-content:center;padding:9%;background:rgba(2,7,10,.84);text-align:center}
.overlay.show{display:flex}.panel{width:100%;max-width:470px}.eyebrow{font-size:12px;letter-spacing:.24em;color:#6fe7ff;text-transform:uppercase}
h1{margin:.35em 0 .1em;font-size:clamp(36px,8vw,62px);line-height:.92;letter-spacing:.04em}h2{margin:.25em 0;font-size:clamp(25px,5vw,38px)}
.tag{color:#a7bbc1;margin:10px 0 28px}.hint{margin-top:22px;color:#8defff;font-weight:800;letter-spacing:.08em}.small{font-size:13px;color:#adc0c5}
.menu{display:grid;gap:8px;margin-top:18px}.choice{border:1px solid #31505a;border-radius:10px;padding:10px 12px;text-align:left;background:#081117}
.choice.active{border-color:#8bffca;background:#0d2825;box-shadow:0 0 0 2px rgba(139,255,202,.14)}.choice b{display:block}.choice span{font-size:12px;color:#adc0c5}
.debug-controls{position:absolute;inset:auto 8px 8px 8px;grid-template-columns:repeat(4,1fr);gap:5px;padding:7px;background:rgba(0,0,0,.82);border:1px solid #38505a}
.debug-controls:not([hidden]){display:grid}.debug-controls button{min-height:38px;background:#10212a;border:1px solid #527181;border-radius:6px;font-size:12px;font-weight:800}
.debug-controls button:active{background:#27505d}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}