*,:before,:after{box-sizing:border-box}html,body,#root{background:#0d3a4f;width:100%;height:100%;margin:0;overflow:hidden}button,input{font:inherit}.game-root{background:#0d3a4f;position:fixed;inset:0}.game-root canvas{cursor:crosshair}.loading{color:#e8f6ff;place-items:center;font-family:Segoe UI,system-ui,sans-serif;font-size:1.1rem;display:grid;position:absolute;inset:0}.toast-error{color:#fff;z-index:20;background:#7a1f1f;border-radius:8px;padding:.6rem 1rem;font-family:Segoe UI,system-ui,sans-serif;position:absolute;bottom:1.25rem;left:50%;transform:translate(-50%)}.lobby{color:#f4f8fb;background:#0d4e73;place-items:center;min-height:100vh;padding:1.5rem;font-family:Nunito,Segoe UI,system-ui,sans-serif;display:grid;position:relative;overflow:hidden}.lobby-bg{filter:blur(9px);background:url(/lobby/mar.jpg) 50%/cover no-repeat;position:absolute;inset:-28px;transform:scale(1.08)}.lobby-card{z-index:1;background:#0c203ae6;border-radius:22px;width:min(400px,100%);padding:1.35rem 1.35rem 1.05rem;position:relative;box-shadow:0 22px 50px #00142859}.lobby-kicker{letter-spacing:.16em;text-transform:uppercase;color:#d5e4f2;margin:0;font-size:.68rem;font-weight:800}.lobby h1{letter-spacing:.02em;text-transform:uppercase;text-shadow:0 3px #00000047;margin:.15rem 0 .4rem;font-family:Anton,Arial Narrow,Impact,sans-serif;font-size:clamp(2rem,5vw,2.45rem);font-weight:400;line-height:.95}.lobby-sub{color:#d5e2ee;margin:0 0 1rem;font-size:.92rem;font-weight:600;line-height:1.35}.lobby form{gap:.72rem;display:grid}.lobby label{color:#e7eef6;gap:.28rem;font-size:.82rem;font-weight:700;display:grid}.lobby-field{display:block;position:relative}.lobby-field svg{color:#ffffffe6;pointer-events:none;width:1.15rem;height:1.15rem;position:absolute;top:50%;right:.75rem;transform:translateY(-50%)}.lobby input{box-sizing:border-box;color:#fff;width:100%;font:inherit;background:#0610208c;border:1px solid #ffffff14;border-radius:10px;padding:.72rem 2.4rem .72rem .85rem;font-size:.98rem;font-weight:600}.lobby input::placeholder{color:#ffffffb8}.lobby input:focus{outline-offset:1px;outline:2px solid #f5a623}.lobby-go{color:#1c1408;font:inherit;cursor:pointer;background:linear-gradient(#ffb423,#f08a10);border:0;border-radius:10px;margin-top:.25rem;padding:.82rem 1rem;font-size:1.05rem;font-weight:800}.lobby-go:hover{filter:brightness(1.05)}.lobby-go:disabled{cursor:wait;opacity:.72}.lobby-colors{color:#e7eef6;gap:.35rem;font-size:.82rem;font-weight:700;display:grid}.lobby-colors>div{gap:.45rem;display:flex}.lobby-colors button{cursor:pointer;border:2px solid #0000;border-radius:50%;width:1.85rem;height:1.85rem;margin:0;padding:0;box-shadow:inset 0 0 0 1px #0000002e}.lobby-colors button[aria-checked=true]{border-color:#fff;box-shadow:0 0 0 2px #fff3}.lobby-music{color:#f0b4a2;margin:0;font-size:.85rem}.lobby-hints{background:#040c1873;border-radius:12px;justify-content:space-between;align-items:center;gap:.55rem;margin-top:.8rem;padding:.55rem .7rem;font-size:.82rem;font-weight:700;display:flex}.lobby-wasd{grid-template-columns:1.35rem 1.35rem 1.35rem auto;grid-template-areas:".w.label""a s d label";align-items:center;gap:.18rem;display:grid}.lobby-wasd .w{grid-area:w}.lobby-wasd .a{grid-area:a}.lobby-wasd .s{grid-area:s}.lobby-wasd .d{grid-area:d}.lobby-wasd span{grid-area:label;margin-left:.35rem}.lobby-hints kbd{color:#1a2430;background:#f3f6fa;border-radius:4px;place-items:center;min-width:1.35rem;height:1.25rem;padding:0 .28rem;font-family:inherit;font-size:.72rem;font-weight:800;display:grid}.lobby-mouse{flex:none;width:1.15rem;height:1.55rem}.lobby-shift{align-items:center;gap:.35rem;display:flex}.lobby-help{color:#fff;font:inherit;cursor:pointer;background:#ffffff0f;border:0;border-radius:999px;align-items:center;gap:.4rem;margin:.7rem auto 0;padding:.22rem .7rem .22rem .22rem;font-size:.82rem;font-weight:700;display:flex}.lobby-help i{background:#3d92d8;border-radius:50%;place-items:center;width:1.2rem;height:1.2rem;font-size:.78rem;font-style:normal;display:grid}.lobby-keys{color:#c5d6e6;gap:.35rem;margin:.7rem 0 0;padding:0;font-size:.82rem;line-height:1.35;list-style:none;display:grid}.hud{pointer-events:none;z-index:10;color:#f4f8fb;font-family:Segoe UI,system-ui,sans-serif;position:absolute;inset:0}.hud-top{pointer-events:auto;justify-content:space-between;align-items:center;padding:.85rem 1rem;display:flex}.hud-status{background:#081c26a6;border-radius:999px;align-items:center;gap:.45rem;padding:.4rem .75rem;font-size:.85rem;display:flex}.dot{background:#888;border-radius:50%;width:.55rem;height:.55rem}.dot.on{background:#3ecf6a;box-shadow:0 0 8px #3ecf6a}.hud-actions{align-items:center;gap:.45rem;display:flex;position:relative}.hud-gear{cursor:pointer;background:0 0;border:0;place-items:center;padding:.15rem;display:grid}.hud-gear img{filter:drop-shadow(0 1px 1px #00000073);width:1.35rem;height:1.35rem}.cfg-backdrop{z-index:40;pointer-events:auto;background:#0410186b;place-items:center;padding:1rem;display:grid;position:absolute;inset:0}.cfg{color:#f4f7fb;background:#1b3142e6;border-radius:18px;width:min(22.5rem,100%);padding:1.15rem 1.4rem 1.25rem;position:relative;box-shadow:0 18px 48px #00000059}.cfg h2{text-align:center;letter-spacing:.14em;text-transform:uppercase;margin:0 1.6rem .35rem;font-size:1.05rem;font-weight:700}.cfg-x{color:#f4f7fb;cursor:pointer;background:0 0;border:0;padding:.15rem .35rem;font-size:1.45rem;line-height:1;position:absolute;top:.55rem;right:.65rem}.cfg-field{margin-top:.85rem;display:block}.cfg-field>span:first-child{letter-spacing:.12em;text-transform:uppercase;margin-bottom:.4rem;font-size:.78rem;font-weight:700;display:block}.cfg-row{align-items:center;gap:.7rem;display:flex}.cfg-row .hud-ico{filter:none;flex:none;width:1.35rem;height:1.35rem}.cfg-slider{appearance:none;cursor:pointer;background-color:#0000;background-position:50%;background-repeat:no-repeat;background-size:100% 4px;border-radius:999px;outline:none;flex:1;height:16px}.cfg-slider::-webkit-slider-runnable-track{background:0 0;border:0;height:4px}.cfg-slider::-webkit-slider-thumb{appearance:none;background:#fff;border:0;border-radius:50%;width:16px;height:16px;margin-top:-6px;box-shadow:0 1px 3px #00000059}.cfg-slider::-moz-range-thumb{background:#fff;border:0;border-radius:50%;width:16px;height:16px}.cfg-slider::-moz-range-track{background:0 0;border:0;height:4px}.cfg-actions{flex-direction:column;gap:.55rem;margin-top:1.15rem;display:flex}.cfg-btn{color:#f4f7fb;font:inherit;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;background:#08121cb8;border:0;border-radius:8px;padding:.72rem .8rem;font-size:.92rem;font-weight:700}.cfg-btn:hover{background:#08121ce0}.hud-music{background:#081c26bf;border-radius:8px;align-items:center;gap:.45rem;padding:.4rem .7rem;font-size:.82rem;display:flex}.hud-music input[type=range]{accent-color:#e2b657;cursor:pointer;width:6.5rem}.hud-leave{color:#fff;cursor:pointer;background:#081c26bf;border:0;border-radius:8px;padding:.45rem .8rem}.hud-meters{align-items:flex-end;gap:1.15rem;display:flex;position:absolute;bottom:1.35rem;left:1.15rem}.hud-meter-col{flex-direction:column;gap:.38rem;width:min(13.2rem,48vw);display:flex}.hud-meter{align-items:center;gap:.48rem;display:flex}.hud-meter .hull-plates,.hud-meter .hud-bar{flex:1;min-width:0}.hud-ico{object-fit:contain;filter:drop-shadow(0 1px 1px #00000080);width:1.15rem;height:1.15rem}.hud-bar{background:#0000007a;border-radius:999px;height:7px;overflow:hidden;box-shadow:0 0 0 1px #ffffff38}.hud-bar>div{border-radius:inherit;height:100%;transition:width .12s linear}.hud-bar>.nitro{background:linear-gradient(90deg,#3aa4dc 0%,#7ec8f2 78%,#e7f7ff 100%)}.hud-bar>.nitro.on{box-shadow:0 0 8px #7ec8e3}.hud-bar>.cannon{background:#f0a030}.hud-shot{flex-direction:column;align-items:center;gap:.35rem;margin-bottom:.02rem;display:flex}.hud-shell{object-fit:contain;filter:drop-shadow(0 1px 2px #0000008c);width:2.7rem;height:2.7rem}.hull-plates{align-items:stretch;gap:.28rem;min-width:0;display:flex}.hull-plate{box-sizing:border-box;background:#00000073;border:1px solid #ffffff38;border-radius:3px;flex:1;min-width:0;height:10px;position:relative;overflow:hidden}.hud-meters .hull-plate{background:#0000007a;border:0;border-radius:999px;height:7px;box-shadow:0 0 0 1px #ffffff38}.hull-plate.on{background:#3dce6a;border-color:#b4ffc873}.hud-pips{gap:.22rem;width:2.7rem}.hud-pips .hull-plate{height:5px}.hud-pips .hull-plate.on{background:#0000007a;border:0}.hull-plate-fill{pointer-events:none;background:#fff;border-radius:999px;width:0;transition:width 60ms linear;position:absolute;top:0;bottom:0;left:0}.hud-pips .hull-plate.on .hull-plate-fill{width:100%!important}.hud-meters .hull-plates{margin:0}.hud-score{background:#081c26a6;border-radius:10px;gap:.3rem;width:min(200px,55vw);padding:.5rem .65rem;font-size:.82rem;display:grid;position:absolute;top:3.4rem;right:1rem}.hud-score>div{grid-template-columns:12px 1fr auto;align-items:center;gap:.4rem;display:grid}.hud-score>div.me{color:#ffe08a}.hud-sinks{align-items:center;gap:.2rem;display:inline-flex}.ship-mark{width:1.05rem;height:.75rem}.swatch{border-radius:2px;width:10px;height:10px}.hud-respawn{background:#081c26cc;border-radius:12px;padding:.9rem 1.4rem;font-size:1.15rem;font-weight:600;position:absolute;top:45%;left:50%;transform:translate(-50%,-50%)}html.is-phone,html.is-phone body{overscroll-behavior:none;width:100%;position:fixed;inset:0;overflow:hidden}.phone-shell{z-index:1;overscroll-behavior:none;background:#0d3a4f;position:fixed}.phone-shell.is-landscape{top:var(--vv-top,0px);left:var(--vv-left,0px);width:var(--vv-w,100dvw);height:var(--vv-h,100dvh)}.phone-shell.is-portrait{top:var(--vv-top,0px);left:calc(var(--vv-left,0px) + var(--vv-w,100dvw));width:var(--vv-h,100dvh);height:var(--vv-w,100dvw);transform-origin:0 0;pointer-events:none;transform:rotate(90deg)}.phone-shell.can-scroll{-webkit-overflow-scrolling:touch;touch-action:pan-y;overflow:auto}.phone-shell.is-play{overflow:hidden}.phone-stage{min-height:100%;position:relative}.phone-shell.is-play .phone-stage{height:100%}.phone-shell .game-root{position:absolute}.phone-shell.is-play canvas{touch-action:none}.phone-turn{z-index:40;text-align:center;color:#f4f8fb;background:radial-gradient(at 50% 18%,#2a8fb0 0%,#0000 52%),#0a2f3d;flex-direction:column;justify-content:center;align-items:center;gap:.55rem;padding:1.5rem;font-family:Segoe UI,system-ui,sans-serif;display:flex;position:fixed;inset:0}.phone-turn strong{font-size:1.7rem}.phone-turn p{max-width:18rem;margin:0;line-height:1.4}.phone-turn button{color:#1a1205;font:inherit;background:#e8a23a;border:0;border-radius:999px;margin-top:.45rem;padding:.85rem 1.25rem;font-weight:700}.phone-turn-hint{color:#b7d0dc;font-size:.85rem}.phone-shell .lobby{height:auto;min-height:100%;padding:calc(.7rem + env(safe-area-inset-top,0px)) calc(.8rem + env(safe-area-inset-right,0px)) calc(1.4rem + env(safe-area-inset-bottom,0px)) calc(.8rem + env(safe-area-inset-left,0px));overflow:auto}.phone-shell .lobby-card{width:min(420px,100%);margin:0 auto;padding:1rem 1rem .9rem}.phone-shell .lobby h1{font-size:1.85rem}.phone-shell .lobby-hints{flex-wrap:wrap;justify-content:center}.phone-shell .lobby-sub{margin-bottom:.75rem;font-size:.88rem}.phone-shell .lobby form{gap:.6rem}.phone-shell .lobby input{padding:.75rem 2.4rem .75rem .85rem;font-size:16px}.phone-shell .lobby-colors button{width:2.75rem;height:2.75rem}.phone-shell .hud-top{padding:calc(1.35rem + env(safe-area-inset-top,0px)) calc(.4rem + env(safe-area-inset-right,0px)) .15rem calc(.4rem + env(safe-area-inset-left,0px));flex-wrap:wrap;align-items:center;gap:.3rem}.phone-shell .hud-actions{flex-wrap:wrap;justify-content:flex-end;gap:.3rem}.phone-shell .hud-status,.phone-shell .hud-music,.phone-shell .hud-leave{font-size:.72rem}.phone-shell .hud-music{padding:.25rem .45rem}.phone-shell .hud-music input[type=range]{touch-action:pan-x;width:4.2rem}.phone-shell .hud-leave{padding:.28rem .5rem}.phone-shell .hud-meters{top:calc(4.75rem + env(safe-area-inset-top,0px));bottom:auto;left:calc(.55rem + env(safe-area-inset-left,0px))}.phone-shell .hud-meter-col{gap:.28rem;width:min(10.5rem,42vw)}.phone-shell .hud-ico{width:1rem;height:1rem}.phone-shell .hud-shell{width:2.15rem;height:2.15rem}.phone-shell .hud-score{top:4.3rem;right:calc(.4rem + env(safe-area-inset-right,0px));pointer-events:none;width:min(150px,22vw);max-height:22vh;padding:.28rem .4rem;font-size:.68rem;overflow:hidden}.mobile-controls{z-index:12;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;position:absolute;inset:0}.stick-slot{bottom:calc(.35rem + env(safe-area-inset-bottom,0px));pointer-events:none;flex-direction:column;align-items:center;gap:.12rem;display:flex;position:absolute}.stick-slot.left{left:calc(.4rem + env(safe-area-inset-left,0px))}.stick-slot.right{right:calc(.4rem + env(safe-area-inset-right,0px))}.stick-slot>span{color:#f4f8fb;text-shadow:0 1px 2px #000000a6;font-size:.68rem;font-weight:700}.stick{pointer-events:auto;touch-action:none;background-image:linear-gradient(#e8c478,#e8c478),linear-gradient(#e8c478,#e8c478),radial-gradient(circle at 50% 45%,#123a4a59,#081c26b8 68%);background-position:50%,50%,50%;background-repeat:no-repeat;background-size:2px 32%,32% 2px,100% 100%;border:2px solid #e8c478e0;border-radius:50%;width:clamp(104px,30vmin,148px);height:clamp(104px,30vmin,148px);position:relative;box-shadow:inset 0 0 0 7px #081c2647,0 8px 18px #00000047}.stick.on{border-color:#ffe08a;box-shadow:inset 0 0 0 7px #e8a23a4d,0 0 16px #e8a23a73}.stick-knob{pointer-events:none;background:radial-gradient(circle at 38% 32%,#fff1c9,#e8a23a 46%,#8a5a16);border:2px solid #fff4d2;border-radius:50%;width:46%;height:46%;position:absolute;top:50%;left:50%}.nitro-btn{right:calc(.45rem + env(safe-area-inset-right,0px) + clamp(104px, 30vmin, 148px) + .55rem);bottom:calc(1.15rem + env(safe-area-inset-bottom,0px));pointer-events:auto;touch-action:none;color:#1a1205;width:clamp(58px,16vmin,76px);height:clamp(58px,16vmin,76px);font:inherit;background:radial-gradient(circle at 38% 32%,#fff1c9,#c97a18 58%,#6d4310);border:2px solid #e8c478e6;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;font-weight:800;line-height:1.05;display:flex;position:absolute;box-shadow:0 8px 16px #00000047}.nitro-btn small{font-size:.68rem;font-weight:700}.nitro-btn.on{background:radial-gradient(circle at 38% 32%,#fff,#ffe08a 42%,#e07a12);box-shadow:0 0 16px #ff9a3cb3}.nitro-btn span{font-size:.72rem;position:relative}.nitro-btn small{position:relative}.phone-shell .cfg{width:min(20rem,100%);padding:1rem 1.05rem 1.05rem}.charge-ring{pointer-events:none;width:calc(100% + 12px);height:calc(100% + 12px);position:absolute;inset:-6px;overflow:visible;transform:rotate(-90deg)}.charge-ring circle{fill:none;stroke-width:5px}.charge-ring-track{stroke:#ffffff47}.charge-ring-value{stroke:#ffe08a;stroke-linecap:round}.nitro-btn .charge-ring-value{stroke:#fff6d8}.install-help{z-index:50;background:#0410189e;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.install-help div{color:#f4f7fb;background:#102833;border-radius:16px;width:min(22rem,100%);padding:1rem 1.1rem .9rem;box-shadow:0 16px 40px #00000059}.install-help strong{margin-bottom:.45rem;font-size:1rem;display:block}.install-help p{margin:0 0 .9rem;font-size:.92rem;line-height:1.4}.install-help button{color:#1b1408;background:#e7b15a;border:0;border-radius:999px;padding:.55rem 1rem;font-weight:700}