@import"https://fonts.googleapis.com/css2?family=Syne:wght@600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap";:root{--bg-deep: #05070d;--bg-mid: #0a1220;--panel: rgba(10, 18, 32, .72);--panel-border: rgba(108, 180, 255, .28);--txt-main: #ecf8ff;--txt-soft: #8ea5c0;--accent: #49ff97;--accent-alt: #ff8f4f;--shadow: rgba(7, 31, 52, .45)}*{box-sizing:border-box}html,body{margin:0;min-height:100%}body{min-width:320px;color:var(--txt-main);font-family:IBM Plex Mono,monospace;background:radial-gradient(circle at 15% 10%,rgba(90,186,255,.13),transparent 30%),radial-gradient(circle at 80% 5%,rgba(73,255,151,.09),transparent 34%),linear-gradient(150deg,#03060d,#0b1221 48%,#070d19);overflow:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.08) .5px,transparent .5px);background-size:2px 2px;opacity:.14}#app{min-height:100vh;padding:clamp(.75rem,2.2vh,1.2rem)}.shell{width:min(1200px,100%);height:calc(100vh - clamp(1.5rem,4vh,2.4rem));margin:0 auto;display:grid;grid-template-rows:auto 1fr auto;gap:.7rem}.hud-panel{display:grid;grid-template-columns:1fr auto auto;gap:.8rem;align-items:center;padding:.8rem 1rem;border:1px solid var(--panel-border);border-radius:16px;background:var(--panel);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 16px 35px -20px var(--shadow)}.title-wrap{display:flex;flex-direction:column;gap:.1rem}.kicker{margin:0;color:var(--txt-soft);letter-spacing:.12em;text-transform:uppercase;font-size:.67rem}h1{margin:0;font-family:Syne,sans-serif;font-size:clamp(1.2rem,2vw,1.65rem);letter-spacing:.04em;font-weight:700}.stats{display:flex;gap:.5rem}.stat-block{min-width:clamp(74px,8vw,88px);border:1px solid rgba(108,180,255,.24);border-radius:10px;padding:.42rem .55rem;background:#0b1728bd}.stat-label{display:block;color:var(--txt-soft);font-size:.64rem;text-transform:uppercase;letter-spacing:.1em}.stat-block strong{display:block;margin-top:.13rem;font-size:1.1rem;font-weight:600}.action-btn{border:1px solid rgba(110,196,255,.4);border-radius:10px;padding:.58rem 1rem;color:var(--txt-main);background:linear-gradient(130deg,#11213adb,#0d192cd1),linear-gradient(0deg,transparent,transparent);font-family:inherit;font-weight:600;letter-spacing:.03em;cursor:pointer;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}.action-btn:hover{transform:translateY(-1px);border-color:#49ff97b3;box-shadow:0 0 0 1px #49ff9747 inset}.arena-wrap{position:relative;min-height:280px;border-radius:18px;overflow:hidden;border:1px solid rgba(108,180,255,.26);background:linear-gradient(180deg,#080f1dde,#050a14e8);box-shadow:0 40px 55px -46px #3a7cb5cc,inset 0 0 0 1px #61a0d417}.arena{position:absolute;top:0;right:0;bottom:0;left:0}.arena canvas{width:100%;height:100%;display:block}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;align-content:center;gap:.6rem;text-align:center;padding:1.4rem;background:radial-gradient(circle at 50% 30%,#0913228f,#040810e6);transition:opacity .18s ease}.overlay.hidden{opacity:0;pointer-events:none}.overlay h2{margin:0;font-family:Syne,sans-serif;font-size:clamp(1.4rem,3.2vw,2rem);letter-spacing:.04em}.overlay p{margin:0;width:min(70ch,100%);color:var(--txt-soft);font-size:clamp(.78rem,1.8vw,.9rem);line-height:1.45}.controls-strip{display:grid;grid-template-columns:1fr auto;align-items:center;gap:.6rem;padding:.72rem .95rem;border:1px solid rgba(108,180,255,.2);border-radius:12px;background:#0a111ea6}.controls-strip p{margin:0;color:var(--txt-soft);font-size:.79rem;line-height:1.35}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:1.65em;margin:0 .14rem;padding:.15em .5em;border-radius:6px;border:1px solid rgba(108,180,255,.34);background:#0d1b2fc7;font-family:inherit;font-size:.72rem;color:var(--txt-main)}.touch-pad{display:none;grid-template-columns:repeat(3,46px);grid-template-rows:repeat(3,46px);gap:.3rem;touch-action:manipulation}.touch-btn{border:1px solid rgba(108,180,255,.33);background:linear-gradient(160deg,#0e1f34e6,#081322f2);color:var(--txt-main);border-radius:9px;font-size:1rem;cursor:pointer}.touch-btn:active{transform:scale(.97)}.touch-btn.up{grid-column:2;grid-row:1}.touch-btn.left{grid-column:1;grid-row:2}.touch-btn.down{grid-column:2;grid-row:3}.touch-btn.right{grid-column:3;grid-row:2}@media (max-width: 980px){.hud-panel{grid-template-columns:1fr auto;grid-template-areas:"title button" "stats stats"}.title-wrap{grid-area:title}.stats{grid-area:stats}#restart{grid-area:button}}@media (max-width: 760px){.shell{height:calc(100vh - 1rem)}.controls-strip{grid-template-columns:1fr;justify-items:center;text-align:center}.touch-pad{display:grid}}