:root{--bg: #000;--ink: #fff;--cyan: #00f0ff;--magenta: #ff2bd6;--orange: #ff8a00;--acid: #8cff00;--gold: #ffd23f;--muted: rgba(255, 255, 255, .72);--panel: rgba(0, 0, 0, .86);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px);--safe-left: env(safe-area-inset-left, 0px);--safe-right: env(safe-area-inset-right, 0px);--font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;font-weight:700;overflow:hidden;overscroll-behavior:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}canvas{position:fixed;inset:0;width:100%;height:100%;display:block}#arena{touch-action:none}#overlay{pointer-events:none}.dim{position:fixed;inset:0;background:#000;opacity:0;pointer-events:none;transition:opacity .4s}[hidden]{display:none!important}p,h1,h2{margin:0}.screen{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(var(--safe-top) + 72px) 24px calc(var(--safe-bottom) + 48px)}.title{gap:14px;background:radial-gradient(ellipse at 50% 42%,#000000b8,#00000059 55%,#0000 80%)}#logo{position:static;width:200px;height:200px}.logo-words{display:flex;flex-direction:column;font-size:40px;font-weight:900;letter-spacing:.14em;line-height:1.1;color:var(--ink);text-shadow:0 0 18px rgba(0,240,255,.85),0 0 4px rgba(0,240,255,.9)}.logo-words span:last-child{color:var(--cyan)}.title-best{font-size:18px;color:var(--muted);letter-spacing:.06em;min-height:24px}.touch{margin-top:28px;font-size:20px;letter-spacing:.24em;color:var(--cyan);animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.55}}.hud{position:fixed;left:0;right:0;top:0;height:calc(var(--safe-top) + 72px);padding:calc(var(--safe-top) + 10px) calc(var(--safe-right) + 12px) 0 calc(var(--safe-left) + 14px);display:grid;grid-template-columns:1fr auto 1fr;align-items:start;pointer-events:none}.hud-left{display:flex;align-items:center;gap:8px;height:48px}.life{width:32px;height:32px;stroke:var(--cyan);fill:var(--cyan);filter:drop-shadow(0 0 4px rgba(0,240,255,.8))}.life.danger{stroke:#ff2840;fill:#ff2840;filter:drop-shadow(0 0 5px rgba(255,40,64,.9))}.count{font-size:20px;letter-spacing:.04em;color:var(--ink)}.hud-mid{display:flex;flex-direction:column;align-items:center;line-height:1;padding-top:6px}.score{font-size:28px;font-weight:900;letter-spacing:.04em;font-variant-numeric:tabular-nums;text-shadow:0 0 10px rgba(0,240,255,.6)}.score.gold{color:var(--gold);text-shadow:0 0 10px rgba(255,210,63,.7)}.score.gold:after{content:" BEST";font-size:16px;letter-spacing:.1em;vertical-align:middle}.mult{margin-top:6px;font-size:18px;color:var(--cyan);letter-spacing:.06em;min-height:18px}.icon-btn{pointer-events:auto;justify-self:end;width:48px;height:48px;border:2px solid rgba(255,255,255,.55);border-radius:4px;background:#0006;color:var(--ink);display:grid;place-items:center;padding:0;cursor:pointer}.icon-btn:active{border-color:var(--cyan)}.bars{width:16px;height:18px;border-left:5px solid var(--ink);border-right:5px solid var(--ink)}.mute{position:fixed;top:calc(var(--safe-top) + 10px);right:calc(var(--safe-right) + 12px)}.mute:before{content:"";width:22px;height:22px;background:var(--ink);clip-path:polygon(0 32%,30% 32%,62% 0,62% 100%,30% 68%,0 68%)}.mute.off:after{content:"";position:absolute;width:30px;height:3px;background:#ff2840;transform:rotate(-45deg)}.hint{position:fixed;left:0;right:0;bottom:calc(var(--safe-bottom) + 220px);text-align:center;font-size:20px;letter-spacing:.14em;color:var(--muted);pointer-events:none;transition:opacity .6s}.banner{position:fixed;left:0;right:0;top:30%;text-align:center;font-size:30px;font-weight:900;letter-spacing:.2em;color:var(--ink);text-shadow:0 0 16px rgba(0,240,255,.9);pointer-events:none;opacity:0;transition:opacity .2s}.banner.show{opacity:1}.countdown{position:fixed;left:0;right:0;top:38%;text-align:center;font-size:96px;font-weight:900;color:var(--cyan);text-shadow:0 0 24px rgba(0,240,255,.9);pointer-events:none}.toast{position:fixed;left:50%;bottom:calc(var(--safe-bottom) + 200px);transform:translate(-50%);padding:10px 18px;font-size:18px;letter-spacing:.1em;background:var(--panel);border:1px solid var(--cyan);border-radius:4px;opacity:0;pointer-events:none;transition:opacity .2s}.toast.show{opacity:1}.panel{position:fixed;left:50%;bottom:0;width:min(100%,480px);transform:translate(-50%);padding:28px calc(var(--safe-right) + 20px) calc(var(--safe-bottom) + 20px) calc(var(--safe-left) + 20px);background:var(--panel);border-top:2px solid var(--cyan);box-shadow:0 -10px 40px #00f0ff2e;display:flex;flex-direction:column;align-items:stretch;gap:12px;text-align:center;animation:rise .35s cubic-bezier(.2,.8,.2,1)}@keyframes rise{0%{transform:translate(-50%,100%)}to{transform:translate(-50%)}}.panel-title{font-size:32px;font-weight:900;letter-spacing:.24em;color:var(--cyan)}.panel-score{font-size:20px;color:var(--muted);letter-spacing:.06em;margin-bottom:8px}.rank{align-self:center;font-size:32px;font-weight:900;letter-spacing:.2em;padding-bottom:6px;border-bottom:4px solid var(--orange)}.big-score{font-size:48px;font-weight:900;letter-spacing:.03em;font-variant-numeric:tabular-nums;text-shadow:0 0 14px rgba(0,240,255,.6)}.best{font-size:20px;letter-spacing:.1em;color:var(--muted)}.best.new{color:var(--gold)}.stats{font-size:17px;color:var(--muted);letter-spacing:.02em}.next{font-size:18px;color:var(--ink);margin-bottom:10px;min-height:22px}.row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.btn{font-family:var(--font);font-size:20px;font-weight:900;letter-spacing:.18em;min-height:56px;border-radius:4px;cursor:pointer;color:var(--ink);background:transparent;border:2px solid var(--cyan);padding:0 12px}.btn.tall{min-height:64px}.btn.primary{background:var(--cyan);color:#000;box-shadow:0 0 18px #00f0ff8c}.btn.primary:active{background:#7ff8ff}.btn.outline:active{background:#00f0ff26}.card-logo{position:fixed;left:40px;top:36px;display:flex;flex-direction:column;font-size:44px;font-weight:900;letter-spacing:.14em;line-height:1.1;color:var(--ink);text-shadow:0 0 18px rgba(0,240,255,.85),0 0 4px rgba(0,240,255,.9)}.card-logo span:last-child{color:var(--cyan)}
