*{box-sizing:border-box}html,body{margin:0;height:100%;background:#0b1026;color:#f4ecdc;font-family:system-ui,-apple-system,Segoe UI,sans-serif;overflow:hidden}#app{position:relative;height:100%;overflow:hidden}#stage{display:block;width:100%;height:100%;touch-action:none}.screen{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:.75rem;text-align:center;padding:1.5rem;z-index:10;overflow-y:auto;background:radial-gradient(ellipse at center,#080c1eb3,#040610f2)}.screen[hidden],#hud[hidden],.touch-controls[hidden],#warn-banner[hidden]{display:none}.eyebrow{margin:0;font-size:.75rem;letter-spacing:.3em;text-transform:uppercase;color:#ffc46b}h1{margin:0;font-size:clamp(2.4rem,9vw,5rem);line-height:1;letter-spacing:-.02em}h2{margin:0;font-size:clamp(1.8rem,6vw,3rem);line-height:1.1}.lede{margin:0 auto;max-width:36rem;color:#d9d2c2}.hint{margin:0;font-size:.8rem;color:#b8bfd2}button{font:inherit}.primary,.ghost{padding:.7rem 1.6rem;border-radius:999px;font-weight:700;cursor:pointer;font-size:1rem}.primary{border:1px solid #ffc46b;background:#ffc46b;color:#231602}.ghost{border:1px solid #9aa3bd;background:transparent;color:#f4ecdc}button:disabled{opacity:.45;cursor:default}button:focus-visible{outline:2px solid #ffe08a;outline-offset:3px}.row{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:center}.stars{margin:0;font-size:2rem;letter-spacing:.25em;color:#ffc46b}.score-line{margin:0;font-weight:700}#levels{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center}#levels button{display:grid;gap:.15rem;min-width:7.6rem;padding:.6rem .9rem;border-radius:.9rem;border:1px solid #4a5578;background:#0b1026d1;color:#f4ecdc;cursor:pointer}#levels button[aria-checked=true]{border-color:#ffc46b;background:#ffc46b29;box-shadow:0 0 0 1px #ffc46b inset}.lv-name{font-weight:700}.lv-meta{font-size:.74rem;color:#cfd5e6}#hud{position:absolute;inset:0;z-index:4;pointer-events:none;display:grid;grid-template-rows:auto auto auto auto 1fr auto;align-content:start;gap:.4rem;padding:max(.6rem,env(safe-area-inset-top)) .6rem max(.6rem,env(safe-area-inset-bottom))}.hud-top{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.hud-top span{background:#080c1ed1;border:1px solid #3b4668;border-radius:999px;padding:.22rem .7rem;font-size:.82rem;font-weight:700}.hud-top span.warn{color:#ffb08a;border-color:#ff8a6b}.hud-top span.good{color:#ffe08a;border-color:#ffc46b}#mute-btn{pointer-events:auto;margin-left:auto;padding:.3rem .8rem;border-radius:999px;border:1px solid #8fd6c8;background:#080c1ed1;color:#8fd6c8;cursor:pointer;font-size:.8rem}#strip{position:relative;height:26px;border-radius:13px;background:#080c1ed9;border:1px solid #3b4668;overflow:hidden}#dawn-fill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,#34468cb3,#ffaa5abf)}#pips{position:absolute;inset:0}#pips b{position:absolute;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#3a4258;border:2px solid #6a7490}#pips b.lit{background:#ffd98a;border-color:#fff1c4;box-shadow:0 0 8px #ffc46b}#pips b.low{background:#ff9a4a;border-color:#ffd0a0}#pips b.shut{border-color:#8fd6ff;box-shadow:0 0 8px #8fd6ff}#pips b.target{border-color:#ff6a4a;box-shadow:0 0 0 3px #ff6a4a8c}#who{position:absolute;top:3px;bottom:3px;width:4px;margin-left:-2px;border-radius:2px;background:#fff}#warn-banner{grid-row:3;justify-self:center;max-width:94%;margin:.1rem 0;padding:.4rem 1rem;border-radius:999px;background:#962814f0;border:1px solid #ffd45a;color:#fff;font-weight:700;font-size:.88rem;text-align:center;animation:pulse .7s ease-in-out infinite alternate}@keyframes pulse{to{transform:scale(1.04)}}#hud-status{grid-row:4;margin:0;align-self:start;text-align:center;font-size:.85rem;color:#ffe2b0;text-shadow:0 1px 3px #000;min-height:1em}.touch-controls{grid-row:6;pointer-events:auto;display:flex;gap:.5rem;justify-content:center;padding-bottom:.4rem}.touch-controls button{flex:1;padding:1rem .4rem;border-radius:16px;border:1px solid #ffc46b;background:#080c1ec7;color:#fff1d6;font-weight:700;font-size:1rem;touch-action:none;user-select:none;-webkit-user-select:none}.touch-controls #relight-btn{flex:1.5;background:#ffc46b;color:#231602}.touch-controls #shutter-btn{flex:1.3;border-color:#8fd6ff;color:#cfeeff}.touch-controls button:active{filter:brightness(1.25)}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(ellipse at center,transparent 55%,rgba(2,4,12,.5))}@media(prefers-reduced-motion:reduce){#warn-banner{animation:none}}
