:root{--color-bg: #05060a;--panel: rgba(8, 12, 23, .72);--panel-strong: rgba(8, 12, 23, .9);--neon-cyan: #00e5ff;--neon-magenta: #ff2bd6;--neon-purple: #7a5cff;--neon-teal: #2fffa8;--ui-text: #e6e7ef;--muted: #9ba2bd;--danger: #ff4d4d;--warning: #ffb020;--success: #48e07c;--radius: 10px;--gap-2: 8px;--gap-3: 16px;--font-stack: "Segoe UI", Roboto, system-ui, sans-serif}*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;overflow:hidden;background:var(--color-bg);color:var(--ui-text);font-family:var(--font-stack)}button{font:inherit}#gameCanvas{position:fixed;top:0;right:0;bottom:0;left:0;width:100vw;height:100vh;display:block;touch-action:none;background:#05060a}.vignette{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 50% 55%,transparent 35%,rgba(0,0,0,.58) 100%),linear-gradient(90deg,rgba(0,229,255,.08),transparent 24%,transparent 76%,rgba(255,43,214,.08));opacity:.8;transition:background .14s ease,opacity .14s ease}.vignette.is-hit{background:radial-gradient(circle at 50% 55%,transparent 25%,rgba(255,77,77,.7) 100%),linear-gradient(90deg,rgba(255,77,77,.26),transparent 28%,transparent 72%,rgba(255,77,77,.26));opacity:1}.hud{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;padding:max(14px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left))}.hud__top,.hud__bottom{position:absolute;left:max(14px,env(safe-area-inset-left));right:max(14px,env(safe-area-inset-right));display:grid;align-items:center;gap:var(--gap-3)}.hud__top{top:max(14px,env(safe-area-inset-top));grid-template-columns:minmax(96px,1fr) auto minmax(96px,1fr)}.hud__bottom{bottom:max(14px,env(safe-area-inset-bottom));grid-template-columns:minmax(180px,340px) auto}.stat,.brand,.health,.icon-btn,.overlay__panel{border:1px solid rgba(154,162,189,.28);background:var(--panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 0 24px #00e5ff14}.stat{width:fit-content;min-width:96px;padding:8px 12px;border-radius:var(--radius)}.stat--time{justify-self:end;text-align:right}.stat__label,.health span,.eyebrow{display:block;color:var(--muted);font-size:.7rem;line-height:1;text-transform:uppercase;letter-spacing:0}.stat strong{display:block;margin-top:4px;color:#fff;font-size:clamp(1.05rem,2.2vw,1.55rem);line-height:1;text-shadow:0 0 12px rgba(0,229,255,.72)}.brand{display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:999px;color:#fff;font-size:clamp(.78rem,1.5vw,.98rem);font-weight:700;white-space:nowrap}.brand__mark{width:10px;height:10px;border-radius:50%;background:var(--neon-teal);box-shadow:0 0 16px var(--neon-teal),0 0 28px var(--neon-cyan)}.health{pointer-events:auto;padding:10px 12px;border-radius:var(--radius)}.health__track{width:100%;height:9px;margin-top:8px;overflow:hidden;border-radius:999px;background:#ffffff1f}.health__fill{width:100%;height:100%;background:linear-gradient(90deg,var(--success),var(--neon-cyan));box-shadow:0 0 16px #2fffa8a6;transform-origin:left center;transition:transform .16s ease,background .16s ease}.toggles{justify-self:end;display:flex;gap:var(--gap-2);pointer-events:auto}.icon-btn,.primary-btn,.ghost-btn{min-height:38px;border-radius:var(--radius);color:var(--ui-text);cursor:pointer}.icon-btn{min-width:68px;padding:0 12px}.icon-btn[aria-pressed=false]{color:var(--muted);border-color:#ff4d4d7a}.primary-btn,.ghost-btn{pointer-events:auto;border:1px solid rgba(255,255,255,.18);padding:0 18px;font-weight:800}.primary-btn{color:#041014;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-teal));box-shadow:0 0 24px #00e5ff47}.ghost-btn{color:var(--ui-text);background:#ffffff14}button:hover{filter:brightness(1.12)}button:active{transform:translateY(1px)}button:focus-visible{outline:2px solid var(--neon-teal);outline-offset:3px}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;padding:24px;pointer-events:auto;transition:opacity .16s ease,visibility .16s ease}.overlay.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.overlay__panel{width:min(560px,100%);padding:clamp(20px,4vw,34px);border-radius:var(--radius);background:linear-gradient(135deg,rgba(0,229,255,.12),transparent 28%,rgba(255,43,214,.12)),var(--panel-strong)}.overlay h1{margin:8px 0 10px;font-size:clamp(2rem,7vw,4.6rem);line-height:.95;letter-spacing:0;text-shadow:0 0 22px rgba(0,229,255,.48)}.overlay p{max-width:46ch;color:#c6cbe0;font-size:clamp(.96rem,1.8vw,1.08rem);line-height:1.55}.overlay__actions,.controls{display:flex;flex-wrap:wrap;gap:var(--gap-2)}.overlay__actions{margin-top:20px}.controls{margin-top:18px;color:var(--muted);font-size:.78rem}.controls span{border:1px solid rgba(154,162,189,.2);border-radius:999px;padding:6px 9px;background:#ffffff0d}.toast{position:absolute;top:86px;left:50%;transform:translate(-50%) translateY(-8px);padding:8px 12px;border:1px solid rgba(0,229,255,.34);border-radius:999px;background:#05060acc;color:#fff;font-weight:800;opacity:0;transition:opacity .14s ease,transform .14s ease}.toast.is-visible{opacity:1;transform:translate(-50%) translateY(0)}@media (max-width: 720px){.hud__top{grid-template-columns:1fr 1fr}.brand{display:none}.hud__bottom{grid-template-columns:1fr;gap:10px}.toggles{justify-self:center}.health{width:min(360px,100%);justify-self:center}}@media (max-height: 470px){.overlay__panel{padding:18px}.overlay h1{font-size:clamp(1.7rem,7vw,3rem)}.overlay p,.controls{display:none}}