:root{color:#f8fafc;background:#071224;font-family:system-ui,Apple SD Gothic Neo,Malgun Gothic,sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body,main,.screen{width:100%;height:100%;margin:0;overflow:hidden}body{position:relative;overscroll-behavior:none;touch-action:none}[hidden]{display:none!important}button{border:0;border-radius:1rem;color:inherit;font:inherit;font-weight:900;cursor:pointer}button:focus-visible{outline:4px solid #fde047;outline-offset:4px}.menu{display:grid;place-items:center;padding:1.5rem;background:radial-gradient(circle at 20% 15%,#2563eb 0 2%,transparent 22%),radial-gradient(circle at 78% 75%,#db2777 0 1%,transparent 25%),linear-gradient(145deg,#101f43,#071224 65%)}.menu:before,.menu:after{content:"";position:fixed;width:23rem;height:23rem;border:2px solid #ffffff18;border-radius:50%;transform:rotate(30deg)}.menu:before{left:-10rem;bottom:-8rem}.menu:after{right:-9rem;top:-9rem}.menu-card{position:relative;z-index:1;width:min(54rem,100%);text-align:center}.eyebrow{margin:0 0 .5rem;color:#67e8f9;font-size:.78rem;font-weight:900;letter-spacing:.2em}h1{margin:0;font:950 clamp(3.5rem,10vw,7rem)/.9 Impact,system-ui,sans-serif;letter-spacing:-.06em;text-shadow:0 .12em 0 #db2777,0 .2em 1em #0008}.lead{margin:1.5rem auto;max-width:38rem;color:#cbd5e1}.mode-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.mode-card{display:grid;gap:.4rem;padding:1.35rem;background:#ffffff12;border:2px solid #ffffff24;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);text-align:left;transition:transform .15s,background .15s}.mode-card:first-child{border-color:#38bdf899}.mode-card:last-child{border-color:#f472b699}.mode-card:hover{transform:translateY(-4px);background:#ffffff20}.mode-card strong{font-size:1.35rem}.mode-card span{color:#cbd5e1;font-size:.9rem;font-weight:500}.team-mode-card{grid-column:1 / -1;border-color:#34d39999!important;background:linear-gradient(120deg,#14532d88,#1e3a8a88)!important}.role-panel{width:min(50rem,100%)}.map-panel{width:min(58rem,100%)}.map-panel>p:not(.eyebrow){color:#cbd5e1}.map-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin:1rem 0}.map-card{overflow:hidden;padding:0;border:3px solid #ffffff26;border-radius:1rem;background:#071224;text-align:left;transition:transform .15s,border-color .15s}.map-card:hover,.map-card.is-selected{transform:translateY(-3px);border-color:#67e8f9;box-shadow:0 0 1.5rem #22d3ee55}.map-card img{display:block;width:100%;aspect-ratio:16 / 9;object-fit:cover}.map-card span{display:grid;gap:.25rem;padding:.8rem}.map-card b{font-size:1rem}.map-card small{color:#94a3b8;font-size:.72rem}.role-grid{display:grid;grid-template-columns:1fr 1fr;gap:.8rem;margin:1.2rem 0}.role-grid button{display:grid;gap:.35rem;padding:1.1rem;border:2px solid #ffffff20;background:#ffffff10;text-align:left}.role-grid button[data-team-role=tank]{border-color:#93c5fd;background:#3b82f6}.role-grid button[data-team-role=assault]{border-color:#fca5a5;background:#ef4444}.role-grid button[data-team-role=speed]{border-color:#fef08a;color:#1c1917;background:#facc15}.role-grid button[data-team-role=collector]{border-color:#d9f99d;color:#1a2e05;background:#a3e635}.role-grid button:hover{filter:brightness(1.14);transform:translateY(-2px)}.role-grid b{font-size:1.15rem}.role-grid span{color:#cbd5e1;font-size:.82rem;font-weight:500}.role-grid button[data-team-role=speed] span,.role-grid button[data-team-role=collector] span{color:#1c1917}.controls{margin:1rem 0;display:grid;gap:.35rem;color:#94a3b8;font-size:.8rem}.controls b{color:#fff}#loading-status{color:#67e8f9;font-size:.8rem}.online-menu{margin:1rem auto;padding:1rem;border:1px solid #67e8f955;border-radius:1.2rem;background:#07122499}.online-menu h2{margin:0 0 .75rem;font-size:1.2rem}.online-menu h2 small{color:#67e8f9;font-size:.72rem}.online-fields{display:grid;grid-template-columns:1fr 1fr;gap:.7rem;text-align:left}.online-fields label{color:#cbd5e1;font-size:.72rem;font-weight:800}.online-fields input{display:block;width:100%;margin-top:.25rem;padding:.75rem;border:1px solid #ffffff33;border-radius:.7rem;color:#fff;background:#ffffff10;font:inherit;text-transform:none}#room-code{text-transform:uppercase;letter-spacing:.12em}.online-actions{display:flex;justify-content:center;gap:.6rem;margin-top:.7rem}.online-actions button{padding:.75rem 1.3rem;background:#2563eb}.online-actions button:last-child{background:#db2777}#online-message{min-height:1.2em;margin:.45rem 0 0;color:#fca5a5;font-size:.78rem}.room-panel{width:min(48rem,100%);max-height:calc(100vh - 2rem);overflow-y:auto}.online-map-grid{margin:.75rem 0}.online-map-grid .map-card span{padding:.55rem .7rem}.online-map-grid .map-card img{aspect-ratio:2.35 / 1}.room-code{padding:.25rem .55rem!important;min-height:auto!important;border-radius:.5rem!important;color:#fde047;background:#ffffff12!important;font-family:ui-monospace,monospace;letter-spacing:.12em}.room-players{display:grid;gap:.45rem;padding:0;list-style:none}.room-players li{display:flex;justify-content:space-between;padding:.7rem .85rem;border-radius:.7rem;background:#ffffff0d;text-align:left}.room-players strong{color:#94a3b8;font-size:.8rem}.room-players strong.is-ready{color:#34d399}.panel button:disabled{cursor:not-allowed;opacity:.4}.game,#game-canvas{display:block;width:100%;height:100%}.game:before,.game:after{content:"";position:fixed;z-index:2;inset:0;pointer-events:none;opacity:var(--speed-intensity, 0)}.game:before{background:repeating-conic-gradient(from 0deg at 50% 58%,#fff0 0deg 3.5deg,#dff8ff99 3.7deg 3.85deg,#fff0 4deg 8deg);-webkit-mask-image:radial-gradient(circle at 50% 58%,transparent 0 27%,#000 68%);mask-image:radial-gradient(circle at 50% 58%,transparent 0 27%,#000 68%);transform:scale(1.35);animation:speed-pulse .28s linear infinite}.game:after{background:radial-gradient(circle at 50% 54%,transparent 35%,#07122480 100%);mix-blend-mode:multiply}.game[data-boosting=true]:before{opacity:1;filter:drop-shadow(0 0 .4rem #67e8f9);animation-duration:.14s}@keyframes speed-pulse{50%{transform:scale(1.43);opacity:calc(var(--speed-intensity, 0) * .72)}}#hud-layer{position:fixed;inset:0;pointer-events:none}.player-overlay{position:absolute;top:1rem;left:1rem;right:1rem;display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem}.missile-warning{position:absolute;z-index:3;top:clamp(6.5rem,17vh,10rem);left:50%;display:grid;grid-template-columns:auto auto;align-items:center;gap:.05rem .5rem;min-width:min(18rem,80vw);padding:.75rem 1.1rem;transform:translate(-50%);border:3px solid #fef08a;border-radius:.8rem;color:#fff;background:#b91c1cee;box-shadow:0 0 1.8rem #ef4444,inset 0 0 1rem #450a0a;text-align:left;animation:missile-warning-flash .55s steps(2,end) infinite}.missile-warning span{grid-row:1 / 3;font-size:2rem}.missile-warning strong{font:950 1.05rem/1 system-ui,sans-serif;letter-spacing:.04em}.missile-warning small{color:#fef08a;font-size:.72rem;font-weight:900}@keyframes missile-warning-flash{50%{opacity:.32;filter:brightness(1.8);transform:translate(-50%) scale(1.04)}}.hud-card{width:min(17rem,45vw);padding:.8rem 1rem;border:1px solid #ffffff35;border-radius:1rem;background:#071224cc;box-shadow:0 .5rem 2rem #0005}.hud-card header{color:#67e8f9;font-size:.75rem;font-weight:900;letter-spacing:.15em}.hud-card strong{font-size:2rem}.hud-card small{color:#94a3b8}.hud-card p{display:flex;justify-content:space-between;margin:.25rem 0;font-size:.8rem;font-weight:900}.hud-card meter{width:100%;height:.6rem;accent-color:#fde047}.hud-card time{color:#cbd5e1;font-variant-numeric:tabular-nums}.item-slots{display:flex;gap:.35rem;margin:.35rem 0}.item-slots b{position:relative;flex:1;min-height:2.1rem;display:grid;place-items:center;padding:.2rem;border:2px solid #ffffff45;border-radius:.55rem;background:#0f172acc;color:#fde047;font-size:1.35rem}.item-slots b:after{content:attr(data-key);position:absolute;right:.18rem;bottom:.05rem;color:#fff9;font-size:.52rem}.touch-item{position:absolute;right:0;width:4rem;height:4rem;font-size:.65rem;background:#eab308dd}.touch-item-1{bottom:8.5rem}.touch-item-2{bottom:13rem}.hud-card.boosting{border-color:#fde047;box-shadow:0 0 2rem #fde04766}.team-hud{width:min(24rem,60vw);padding:.8rem 1rem;border:1px solid #60a5fa;border-radius:1rem;background:#071224dd;box-shadow:0 .5rem 2rem #0008}.team-hud header{color:#60a5fa;font-weight:950}.team-score{display:flex;justify-content:space-between;margin:.35rem 0}.team-score .blue{color:#60a5fa}.team-score .red{color:#f87171}.team-hud p{display:flex;justify-content:space-between;margin:.35rem 0;font-size:.78rem}.team-hud meter{width:100%;accent-color:#22c55e}.team-hud small{color:#cbd5e1}#hud-layer[data-mode=team-battle] .minimap{margin-left:auto}.team-economy{position:fixed;left:1rem;bottom:1rem;width:min(32rem,calc(100vw - 2rem));padding:.75rem;border:1px solid #facc1566;border-radius:1rem;background:#071224dd;pointer-events:auto}.team-kill-feed{position:fixed;top:1rem;left:1rem;display:grid;gap:.35rem;width:min(23rem,48vw)}.kill-feed-entry{margin:0;padding:.48rem .7rem;border-left:4px solid #f87171;border-radius:.35rem;background:#071224dd;box-shadow:0 .3rem 1rem #0007;font-size:.76rem;font-weight:900}.team-notifications{position:fixed;right:1rem;bottom:1rem;display:grid;gap:.45rem;justify-items:end;width:min(26rem,48vw)}.team-notification{margin:0;padding:.7rem .9rem;border:1px solid #fde04799;border-radius:.7rem;color:#fde047;background:#071224e8;box-shadow:0 .4rem 1.4rem #0009;font-size:.82rem;font-weight:900}.team-economy>div:first-child{display:flex;justify-content:space-between;color:#fde047}.cargo{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem;margin:.45rem 0}.cargo i{padding:.4rem;border:1px dashed #ffffff40;border-radius:.45rem;color:#64748b;font-size:.72rem;font-style:normal;text-align:center}.cargo i.filled{border-style:solid;color:#fff;background:#ffffff12}.team-economy small{color:#94a3b8}.shop{display:flex;gap:.3rem;margin-top:.4rem}.shop button{flex:1;min-height:2rem;padding:.3rem;border-radius:.45rem;background:#854d0e;font-size:.68rem}.team-economy p{min-height:1.1em;margin:.35rem 0 0;color:#67e8f9;font-size:.72rem}.touch-drop{position:absolute;right:4.4rem;bottom:17.4rem;width:3.4rem;height:3.4rem;background:#475569dd;font-size:.58rem}.touch-attack{display:none;position:absolute;background:#dc2626e8}.minimap{display:block;flex:0 0 auto;width:10rem;height:10rem;border:1px solid #ffffff35;border-radius:1rem;background:#071224cc;box-shadow:0 .5rem 2rem #0005}#hud-layer[data-mode=local-two] .player-overlay{width:calc(50% - 1.5rem);right:auto}#hud-layer[data-mode=local-two] .player-overlay[data-player-overlay="1"]{left:calc(50% + .5rem)}#hud-layer[data-mode=local-two] .missile-warning{min-width:min(14rem,42vw)}#hud-layer[data-mode=local-two]:after{content:"";position:fixed;top:0;bottom:0;left:50%;width:2px;background:#fff8}#countdown{position:fixed;inset:0;display:grid;place-items:center;pointer-events:none;font:950 clamp(6rem,22vw,14rem)/1 Impact,system-ui,sans-serif;color:#fff;text-shadow:0 .08em 0 #db2777,0 .12em 1em #000;animation:pop .25s ease-out}#touch-controls{position:fixed;z-index:4;inset:0;pointer-events:none;user-select:none;-webkit-user-select:none}.touch-joystick{position:absolute;left:max(1rem,env(safe-area-inset-left));bottom:max(1rem,env(safe-area-inset-bottom));width:clamp(7.5rem,24vw,10rem);aspect-ratio:1;border:2px solid #fff7;border-radius:50%;background:#07122480;box-shadow:inset 0 0 2rem #38bdf833;pointer-events:auto;touch-action:none}.touch-joystick:before,.touch-joystick:after{content:"";position:absolute;inset:48% 18%;border-radius:1rem;background:#ffffff28}.touch-joystick:after{inset:18% 48%}.touch-joystick-knob{position:absolute;z-index:1;inset:27%;border:2px solid #fff9;border-radius:50%;background:#38bdf8dd;box-shadow:0 .35rem 1rem #0008;will-change:transform}.touch-actions{position:absolute;right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));display:flex;align-items:flex-end;gap:clamp(.6rem,2vw,1rem);pointer-events:auto}.touch-button{width:clamp(4.7rem,15vw,6.5rem);aspect-ratio:1;padding:0;border:2px solid #ffffff99;border-radius:50%;box-shadow:0 .4rem 1rem #0008;text-shadow:0 2px #0007;touch-action:none}.touch-button-drift{background:#8b5cf6dd;transform:translateY(-1.7rem)}.touch-button-boost{background:#db2777e8}.touch-button.is-pressed{filter:brightness(1.35);transform:scale(.9)}.touch-button-drift.is-pressed{transform:translateY(-1.7rem) scale(.9)}.touch-pause{position:absolute;top:max(.65rem,env(safe-area-inset-top));left:50%;width:2.8rem;height:2.8rem;padding:0;transform:translate(-50%);border:1px solid #fff6;background:#071224aa;pointer-events:auto}.touch-fullscreen{position:absolute;top:max(.65rem,env(safe-area-inset-top));right:max(.65rem,env(safe-area-inset-right));width:2.8rem;height:2.8rem;padding:0;border:1px solid #fff6;background:#071224aa;font-size:1.35rem;pointer-events:auto}.touch-fullscreen[aria-pressed=true]{background:#2563ebdd}@keyframes pop{0%{transform:scale(1.6);opacity:0}}.overlay{position:fixed;z-index:5;inset:0;display:grid;place-items:center;padding:1rem;background:#071224d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.panel{width:min(31rem,100%);padding:2rem;border:1px solid #ffffff25;border-radius:1.5rem;background:#101f43;text-align:center;box-shadow:0 2rem 5rem #0008}.panel h2{margin:0 0 .5rem;font-size:2rem}.panel button{min-height:3rem;margin:.3rem;padding:.6rem 1.1rem;background:#2563eb}.panel>button:last-child{background:#334155}table{width:100%;margin:1rem 0;border-collapse:collapse}th,td{padding:.65rem;border-bottom:1px solid #ffffff1f;text-align:left}td:first-child{color:#fde047;font-weight:900}@media(max-width:800px){.hud-card{width:min(11rem,45vw);padding:.6rem .75rem}.hud-card strong{font-size:1.45rem}.minimap{width:7rem;height:7rem}}@media(max-width:600px){.mode-grid,.online-fields,.role-grid,.map-grid{grid-template-columns:1fr}.controls div:nth-child(2){display:none}.menu{overflow-y:auto;place-items:start center}.menu-card{padding-bottom:2rem}.map-panel{padding:1rem;max-height:calc(100vh - 1rem);overflow-y:auto}.online-map-grid{grid-template-columns:repeat(2,1fr)}.online-map-grid .map-card b{font-size:.75rem}}@media(hover:hover)and (pointer:fine){#touch-controls{display:none!important}}@media(hover:none),(pointer:coarse){.player-overlay{top:max(.5rem,env(safe-area-inset-top));left:max(.5rem,env(safe-area-inset-left));right:max(3.75rem,calc(env(safe-area-inset-right) + 3.25rem));gap:.45rem}.hud-card{width:min(8.5rem,42vw);padding:.4rem .55rem;border-radius:.7rem;background:#071224b8}.hud-card strong{font-size:1.2rem}.hud-card p{margin:.12rem 0;font-size:.68rem}.hud-card .item-slots{display:none}.hud-card meter{height:.4rem}.hud-card time{font-size:.72rem}.missile-warning{top:clamp(5rem,15vh,7rem);min-width:min(15rem,68vw);padding:.55rem .75rem}.missile-warning span{font-size:1.55rem}.missile-warning strong{font-size:.85rem}.missile-warning small{font-size:.62rem}.minimap{width:clamp(4.75rem,16vw,6rem);height:clamp(4.75rem,16vw,6rem);border-radius:.7rem;background:#071224b8}.touch-joystick{width:clamp(7.25rem,24vw,9rem)}.touch-actions{right:max(.75rem,env(safe-area-inset-right));bottom:max(.75rem,env(safe-area-inset-bottom));display:block;width:9.5rem;height:9.5rem}.touch-actions .touch-button{position:absolute;width:4.2rem;height:4.2rem;transform:none;font-size:.68rem}.touch-actions .touch-item{top:0;bottom:auto;border-width:1px;background:#eab308df;font-size:1.35rem}.touch-actions .touch-item-1{left:0;right:auto}.touch-actions .touch-item-2{right:0}.touch-actions .touch-button-drift{left:0;bottom:0}.touch-actions .touch-button-boost{right:0;bottom:0}.touch-actions .touch-button.is-pressed{transform:scale(.9)}#touch-controls:not([data-mode=team-battle]) .touch-actions{width:12rem;height:13rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-button{left:auto;top:auto}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-button-boost{right:0;bottom:0;width:5.6rem;height:5.6rem;font-size:.82rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-button-drift{right:6.2rem;bottom:1.1rem;width:5.2rem;height:5.2rem;font-size:.78rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-item-1{right:6.7rem;bottom:7.4rem;width:4.8rem;height:4.8rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-item-2{right:.3rem;bottom:6.4rem;width:4.8rem;height:4.8rem}.touch-drop,.touch-attack{left:0;right:auto;bottom:0;font-size:.62rem}#touch-controls:not([data-mode=team-battle]) .touch-drop,#touch-controls:not([data-mode=team-battle]) .touch-attack{display:none}#touch-controls[data-mode=team-battle] .touch-button-drift,#touch-controls[data-mode=team-battle] .touch-button-boost{display:none}#touch-controls[data-mode=team-battle] .touch-attack{display:block;left:auto;right:0}#touch-controls[data-mode=team-battle] .touch-item{font-size:1rem}#hud-layer[data-mode=team-battle] .team-economy{left:50%;bottom:max(10.5rem,calc(env(safe-area-inset-bottom) + 10rem));width:min(13rem,58vw);padding:.45rem;transform:translate(-50%)}.team-economy small{display:none}.team-economy .shop button{min-height:2.5rem;font-size:.55rem}.team-economy p{font-size:.6rem}}@media(max-height:500px){.player-overlay{top:.5rem;left:.5rem;right:.5rem}.hud-card{width:9.5rem;padding:.4rem .6rem}.hud-card strong{font-size:1.2rem}.minimap{width:5.5rem;height:5.5rem}}@media(max-height:500px)and (hover:none),(max-height:500px)and (pointer:coarse){.player-overlay{top:max(.35rem,env(safe-area-inset-top));left:max(.35rem,env(safe-area-inset-left));right:max(3.5rem,calc(env(safe-area-inset-right) + 3rem))}.minimap{width:4.5rem;height:4.5rem}.touch-item{width:3rem;height:3rem}.touch-actions{width:8rem;height:8rem}.touch-actions .touch-button{width:3.5rem;height:3.5rem}#touch-controls:not([data-mode=team-battle]) .touch-actions{width:10.5rem;height:9.5rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-button-boost{width:4.6rem;height:4.6rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-button-drift{right:5.2rem;bottom:.5rem;width:4.3rem;height:4.3rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-item-1{right:5.6rem;bottom:5rem;width:3.9rem;height:3.9rem}#touch-controls:not([data-mode=team-battle]) .touch-actions .touch-item-2{right:.25rem;bottom:4.9rem;width:3.9rem;height:3.9rem}#hud-layer[data-mode=team-battle] .team-economy{bottom:max(.35rem,env(safe-area-inset-bottom));width:min(18rem,34vw)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.game:before{display:none}}