:root{--cyan:#55e7ff;--pink:#ff4f9a;--gold:#ffd45c;--green:#5cffb0;--violet:#aa78ff;--muted:#8f9dbc;--bg:#02030b}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;background:var(--bg);color:#eef7ff;font-family:Segoe UI,system-ui,sans-serif;touch-action:none}body{min-height:100dvh}#game{position:fixed;inset:0;overflow:hidden;background:#050817;user-select:none}canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none}h1{font-size:18px;letter-spacing:.16em;margin:0}h1 b{color:var(--pink);text-shadow:0 0 16px var(--pink)}.hud{display:flex;gap:7px}.hud>span{min-width:74px;border:1px solid #ffffff20;background:#071020b8;padding:8px 10px;border-radius:999px;font-size:12px;font-weight:900;text-align:center;backdrop-filter:blur(8px)}#orbCount{color:var(--cyan)}#timer{color:var(--gold);font-variant-numeric:tabular-nums}.reticle{position:absolute;z-index:3;left:50%;top:50%;width:38px;height:38px;transform:translate(-50%,-50%);pointer-events:none;filter:drop-shadow(0 0 6px #55e7ff)}.reticle i{position:absolute;background:#baf7ff;border-radius:2px}.reticle i:nth-child(1),.reticle i:nth-child(2){width:8px;height:2px;top:18px}.reticle i:nth-child(1){left:2px}.reticle i:nth-child(2){right:2px}.reticle i:nth-child(3),.reticle i:nth-child(4){width:2px;height:8px;left:18px}.reticle i:nth-child(3){top:2px}.reticle i:nth-child(4){bottom:2px}.reticle b{position:absolute;width:4px;height:4px;left:17px;top:17px;border-radius:50%;background:white}.prompt{position:absolute;z-index:4;left:50%;bottom:max(24px,env(safe-area-inset-bottom));transform:translateX(-50%);padding:7px 13px;border:1px solid #55e7ff55;border-radius:999px;background:#020611aa;color:#b8c7df;font-size:10px;font-weight:900;letter-spacing:.14em;white-space:nowrap;pointer-events:none;backdrop-filter:blur(8px);transition:.18s}.prompt.armed{border-color:#ff4f9aaa;color:#fff;background:#3a0b27bb;box-shadow:0 0 24px #ff4f9a55}.joystick{--size:clamp(108px,20vmin,154px);position:absolute;z-index:5;bottom:max(20px,env(safe-area-inset-bottom));width:var(--size);height:var(--size);touch-action:none}.joystick.left{left:max(20px,env(safe-area-inset-left))}.joystick.right{right:max(20px,env(safe-area-inset-right))}.stick-ring{position:absolute;inset:0;border:1px solid #a9ddff3d;border-radius:50%;background:radial-gradient(circle,#13284655 0 35%,#06132680 37% 62%,#55e7ff12 64%);box-shadow:inset 0 0 28px #55e7ff15,0 0 25px #0009;backdrop-filter:blur(3px)}.stick-ring:before,.stick-ring:after{content:"";position:absolute;background:#8bcfff1b}.stick-ring:before{left:50%;top:10%;bottom:10%;width:1px}.stick-ring:after{top:50%;left:10%;right:10%;height:1px}.stick-knob{position:absolute;left:50%;top:50%;width:46%;height:46%;transform:translate(-50%,-50%);display:grid;place-items:center;border:1px solid #b4edff80;border-radius:50%;background:radial-gradient(circle at 36% 30%,#5fe9ff45,#0c2a4dcc 65%);box-shadow:inset 0 0 14px #a8f4ff22,0 5px 18px #0009,0 0 14px #55e7ff25;will-change:transform}.right .stick-knob{border-color:#d1b6ff80;background:radial-gradient(circle at 36% 30%,#aa78ff45,#251546cc 65%);box-shadow:inset 0 0 14px #e3d7ff22,0 5px 18px #0009,0 0 14px #aa78ff25}.stick-knob span{font-size:9px;font-weight:900;letter-spacing:.13em;color:#d6f8ff}.joystick.active .stick-ring{border-color:#55e7ffaa;box-shadow:inset 0 0 35px #55e7ff25,0 0 28px #55e7ff22}.joystick.sling .stick-ring{border-color:#ff4f9aaa;background:radial-gradient(circle,#4a123655 0 35%,#21091b80 37% 62%,#ff4f9a18 64%);box-shadow:inset 0 0 35px #ff4f9a25,0 0 28px #ff4f9a33}.joystick.sling .stick-knob{border-color:#ffafd1;background:radial-gradient(circle at 36% 30%,#ff78b255,#4a102fcc 65%);box-shadow:0 0 24px #ff4f9a66}.overlay{position:absolute;z-index:12;inset:0;display:grid;place-items:center;padding:25px;background:#02040bc7;backdrop-filter:blur(12px);opacity:0;pointer-events:none;transition:.25s}.overlay.show{opacity:1;pointer-events:auto}.dialog{text-align:center;max-width:600px}.eyebrow{font-size:10px;letter-spacing:.32em;color:var(--cyan);font-weight:900}.dialog h2{font-size:clamp(42px,11vw,70px);line-height:.88;letter-spacing:-.06em;margin:16px 0}.dialog h2 b{color:var(--pink);text-shadow:0 0 30px #ff4f9a88}.dialog p{color:#a8b4cc;line-height:1.55;margin:20px auto;max-width:470px}.dialog button{border:0;border-radius:14px;padding:15px 24px;background:linear-gradient(135deg,var(--cyan),#7d8cff);color:#03101a;font-weight:950;letter-spacing:.08em;cursor:pointer;box-shadow:0 0 30px #55e7ff55}.dialog small{display:block;margin-top:14px;color:#65718c}@media (max-width:900px){.hud>span{min-width:68px;padding:7px 8px;font-size:10px}.prompt{bottom:calc(max(20px,env(safe-area-inset-bottom)) + var(--prompt-lift,0px))}}@media (max-width:600px) and (orientation:portrait){.joystick{--size:clamp(104px,29vw,138px);bottom:max(38px,env(safe-area-inset-bottom))}.joystick.left{left:14px}.joystick.right{right:14px}.prompt{bottom:calc(max(25px,env(safe-area-inset-bottom)) + var(--size,118px) + 28px)}}@media (max-height:480px){.joystick{--size:108px;bottom:10px}.joystick.left{left:16px}.joystick.right{right:16px}.prompt{bottom:14px}.dialog p{margin:12px auto}.dialog h2{margin:10px 0}}
.control-options{display:flex;align-items:center;gap:7px;isolation:isolate}
.control-options .game-topbar__select{z-index:1}
.control-options .game-topbar__select.open{z-index:100}
.joystick{--size:clamp(130px,24vmin,184px);bottom:max(44px,env(safe-area-inset-bottom));transition:width .18s,height .18s,bottom .18s}
#game.sling-mode .joystick{--size:clamp(145px,27vmin,204px)}
.joystick.left{left:max(clamp(30px,6vw,84px),env(safe-area-inset-left))}
.joystick.right{right:max(clamp(30px,6vw,84px),env(safe-area-inset-right))}
.backward-button{position:absolute;left:50%;top:calc(100% + 8px);width:88px;height:32px;transform:translateX(-50%);border:1px solid #55e7ff55;border-radius:999px;background:#061326d9;color:#bcefff;font:900 9px/1 Segoe UI,system-ui,sans-serif;letter-spacing:.12em;box-shadow:0 5px 18px #0009;touch-action:none;pointer-events:auto}
.backward-button.active{border-color:#55e7ffcc;background:#12385acc;color:#fff;box-shadow:0 0 20px #55e7ff55;transform:translateX(-50%) scale(.96)}
.projectile-button{position:absolute;left:50%;bottom:calc(100% + 10px);min-width:116px;height:34px;padding:0 12px;transform:translateX(-50%);border:1px solid #ffd45c88;border-radius:999px;background:#211707df;color:#ffe6a1;font:900 9px/1 Segoe UI,system-ui,sans-serif;letter-spacing:.1em;box-shadow:0 5px 18px #0009,0 0 14px #ffd45c18;touch-action:manipulation;pointer-events:auto;white-space:nowrap}
.projectile-button:active{transform:translateX(-50%) scale(.96)}
.projectile-button[data-projectile="seeker"]{border-color:#ff793dcc;background:#281006e8;color:#ffd0a8;box-shadow:0 0 20px #ff5b2860}
.projectile-button[data-projectile="miniMissiles"]{border-color:#aa78ffcc;background:#190d30e8;color:#ddcaff;box-shadow:0 0 20px #aa78ff60}
.fullscreen-button{position:absolute;z-index:7;right:max(12px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom));display:grid;place-items:center;width:38px;height:38px;padding:0;border:1px solid #aa78ff88;border-radius:12px;background:#110b26d9;color:#d9caff;box-shadow:0 5px 20px #000a,0 0 16px #aa78ff22;touch-action:manipulation}.fullscreen-button[hidden]{display:none}.fullscreen-button svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.fullscreen-button:active{transform:scale(.94);border-color:#d9caff;box-shadow:0 0 22px #aa78ff66}
@media (max-width:900px){
  .control-options{display:none}
  #game [data-game-topbar][data-mobile-compact].mobile-menu-open .control-options{position:absolute;z-index:40;top:46px;right:8px;display:grid;gap:5px;padding:7px;overflow:visible;border:1px solid #ffffff29;border-radius:15px;background:#070c1af7;box-shadow:0 14px 34px #0008}
  #game [data-game-topbar][data-mobile-compact].mobile-menu-open .control-options .game-topbar__select{position:relative!important;top:auto!important;right:auto!important;display:block}
  #game [data-game-topbar][data-mobile-compact].mobile-menu-open .control-options .game-topbar__select.open{z-index:1000!important}
  #game [data-game-topbar][data-mobile-compact].mobile-menu-open .control-options .game-topbar__select.open .game-topbar__select-menu{z-index:1001!important}
  #game [data-game-topbar][data-mobile-compact].mobile-menu-open .game-topbar__utilities{top:246px}
}
@media (max-width:600px) and (orientation:portrait){
  .joystick{--size:clamp(128px,36vw,158px);bottom:max(54px,env(safe-area-inset-bottom))}
  #game.sling-mode .joystick{--size:clamp(142px,40vw,176px)}
  .joystick.left{left:max(24px,env(safe-area-inset-left))}.joystick.right{right:max(24px,env(safe-area-inset-right))}
  .prompt{bottom:calc(max(25px,env(safe-area-inset-bottom)) + 190px)}
  #game.sling-mode .prompt{bottom:calc(max(25px,env(safe-area-inset-bottom)) + 208px)}
}
@media (max-height:480px){
  .joystick{--size:124px;bottom:22px}.joystick.left{left:26px}.joystick.right{right:26px}
  #game.sling-mode .joystick{--size:138px}
}
@media (orientation:landscape) and (max-height:600px){
  .joystick{bottom:max(clamp(44px,12vh,78px),env(safe-area-inset-bottom))}
  .joystick.left{left:max(clamp(56px,10vw,120px),env(safe-area-inset-left))}
  .joystick.right{right:max(clamp(56px,10vw,120px),env(safe-area-inset-right))}
}
