:root{color-scheme:dark;--accent:#67f0ff;--hot:#ff4c7d;--bg:#060813}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#fff;touch-action:none}canvas{position:absolute;inset:0;width:100%;height:100%}.top{position:absolute;z-index:3;left:24px;right:24px;top:max(18px,env(safe-area-inset-top));display:flex;justify-content:space-between;align-items:center;pointer-events:none}.back{pointer-events:auto;color:#9aa6bb;text-decoration:none;border:1px solid #26324a;padding:9px 12px;font-size:11px;letter-spacing:.14em;background:#090d1b99}.name{font-weight:900;letter-spacing:.16em}.name b{color:var(--accent)}.hud{display:flex;gap:20px;text-align:right}.hud span{display:block;color:#748198;font-size:9px;letter-spacing:.18em}.hud strong{font-size:22px}.overlay{position:absolute;z-index:5;inset:0;display:grid;place-items:center;padding:22px;background:radial-gradient(circle,#111a30bb,#03050cdd);opacity:0;visibility:hidden;transition:.25s}.overlay.show{opacity:1;visibility:visible}.panel{width:min(520px,92vw);padding:38px 30px;text-align:center;background:#0d1325ee;border:1px solid #33415f;clip-path:polygon(0 0,94% 0,100% 10%,100% 100%,6% 100%,0 90%)}.panel h1{margin:7px 0 14px;font-size:clamp(42px,9vw,74px);line-height:.88;letter-spacing:-.04em}.panel p{color:#aeb9ca;line-height:1.5;margin:0 auto 22px;max-width:390px}.panel small{display:block;color:#6f7c93;margin-bottom:18px;letter-spacing:.08em}.panel button{border:0;background:var(--accent);color:#061017;padding:15px 24px;min-width:190px;font-weight:900;letter-spacing:.14em;cursor:pointer}.tip{position:absolute;z-index:3;left:50%;bottom:max(20px,env(safe-area-inset-bottom));transform:translateX(-50%);color:#78859a;font-size:10px;letter-spacing:.16em;white-space:nowrap;pointer-events:none}.touch{position:absolute;z-index:3;bottom:max(18px,env(safe-area-inset-bottom));left:20px;right:20px;display:none;justify-content:space-between;pointer-events:none}.touch button{pointer-events:auto;width:64px;height:64px;border:1px solid #41506d;background:#0e1529cc;color:#fff;border-radius:50%;font-size:24px}@media(max-width:700px){.top{left:12px;right:12px}.name{display:none}.hud{gap:10px}.hud strong{font-size:18px}.tip{bottom:14px;width:calc(100% - 24px);text-align:center;white-space:normal}.touch{display:flex}.panel{padding:30px 22px}}
