*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}canvas,button,.powerup-btn,.board-canvas-wrap,#fire-controls-wrap{-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}#fire-controls-wrap canvas{touch-action:manipulation;outline:none}:root{--bg-dark: #030712;--bg-deep: #0a0f1e;--bg-panel: rgba(15, 23, 42, .85);--bg-panel-hover: rgba(15, 23, 42, .95);--border-glow: rgba(56, 189, 248, .15);--border-bright: rgba(56, 189, 248, .35);--primary: #6366f1;--primary-light: #818cf8;--accent: #38bdf8;--accent-glow: rgba(56, 189, 248, .4);--danger: #ef4444;--success: #22c55e;--warning: #f59e0b;--text-primary: #e2e8f0;--text-secondary: #94a3b8;--text-muted: #475569;--font-display: "Orbitron", monospace;--font-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif}html,body{width:100%;height:100%;overflow:hidden;background:var(--bg-dark);color:var(--text-primary);font-family:var(--font-body)}body.mobile-scroll{overflow-y:auto}#app{min-width:100%;min-height:100%;width:100%;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:clamp(.5rem,1.5vh,1.5rem) 1rem 1rem;position:relative;background:radial-gradient(ellipse at 30% 20%,rgba(99,102,241,.08) 0%,transparent 50%),radial-gradient(ellipse at 70% 80%,rgba(56,189,248,.06) 0%,transparent 50%),var(--bg-dark)}#title-screen{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;background:radial-gradient(ellipse at 50% 30%,rgba(99,102,241,.12) 0%,transparent 60%),radial-gradient(ellipse at 50% 70%,rgba(56,189,248,.08) 0%,transparent 60%),var(--bg-dark);transition:opacity .6s ease,transform .6s ease}#title-screen.hidden{opacity:0;transform:scale(1.05);pointer-events:none}#main-menu{position:absolute;top:0;right:0;bottom:0;left:0;display:none;align-items:center;justify-content:center;z-index:90;padding:1rem;background:radial-gradient(ellipse at 50% 20%,rgba(56,189,248,.1) 0%,transparent 55%),var(--bg-dark)}#main-menu.active{display:flex}.main-menu-panel{width:min(100%,860px);height:min(760px,calc(100vh - 2rem));max-height:calc(100vh - 2rem);display:flex;flex-direction:column;gap:.85rem;padding:1.25rem 1.25rem 3.2rem;background:var(--bg-panel);border:1px solid var(--border-bright);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:relative;overflow:hidden}.menu-sonar-frame{display:grid;place-items:center;min-height:0;flex:1 1 0;width:100%;margin-block:.2rem .15rem;overflow:hidden}.sonar-screen{width:100%;height:100%;min-height:0;position:relative;overflow:hidden;border:1px solid rgba(27,91,44,.44);border-radius:2px;background:radial-gradient(circle at 50% 48%,rgba(78,93,13,.2),transparent 42%),#000300;box-shadow:inset 0 0 42px #000000e6,inset 0 0 92px #99b82324,0 0 34px #8eb0261a;z-index:1;touch-action:none;-webkit-user-select:none;user-select:none}.sonar-screen:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(0,0,0,.34),transparent 9%,transparent 91%,rgba(0,0,0,.34)),radial-gradient(circle at 50% 48%,transparent 52%,rgba(16,24,3,.68) 74%),linear-gradient(105deg,rgba(226,243,135,.08),transparent 18%,transparent 78%,rgba(204,225,92,.05));pointer-events:none;z-index:2}.sonar-screen.sonar-barebones,.sonar-screen.sonar-shader{background:#000;border-color:#27d2e659;box-shadow:none}.sonar-screen.sonar-barebones:before,.sonar-screen.sonar-barebones:after,.sonar-screen.sonar-shader:before,.sonar-screen.sonar-shader:after{display:none}.sonar-screen:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.045) 0,rgba(255,255,255,.045) 1px,transparent 1px,transparent 4px);opacity:.34;pointer-events:none;z-index:3}.sonar-canvas{display:block;width:100%;height:100%;touch-action:none}.sonar-barebones-sweep{position:absolute;left:0;top:0;height:2px;pointer-events:none;transform-origin:0 50%;will-change:transform;z-index:2}.menu-kicker,.lan-title{font-family:var(--font-display);font-size:.7rem;font-weight:700;letter-spacing:.18em;color:var(--accent);text-transform:uppercase}.menu-label{color:var(--text-muted);font-family:var(--font-display);font-size:.58rem;letter-spacing:.18em;text-transform:uppercase}.menu-input,.menu-select{width:100%;min-height:44px;padding:.6rem .75rem;border:1px solid var(--border-glow);border-radius:4px;background:#0a1628bf;color:var(--text-primary);font:600 .85rem var(--font-display);letter-spacing:.08em}.emoji-row,.menu-actions,.menu-account-actions,.menu-mode-actions,.join-row,.room-options{display:flex;gap:.65rem;flex-wrap:wrap}.menu-account-actions{justify-content:center;order:1}.menu-mode-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));order:2}.menu-sonar-frame{order:4}.menu-home .menu-mode-panel{order:3}.menu-mode-actions .btn{padding-inline:1rem}.menu-mode-panel{display:grid;gap:.75rem;align-content:start;min-height:0}.menu-subpage-header{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem}.menu-back-button{justify-self:end}.mode-title{justify-self:start;color:var(--accent);font-family:var(--font-display);font-size:clamp(1.35rem,3vw,2rem);font-weight:800;letter-spacing:.2em;text-align:center;text-transform:uppercase;text-shadow:0 0 18px rgba(56,189,248,.35)}.settings-page{width:min(100%,760px);height:auto;min-height:min(620px,calc(100vh - 2rem));padding-bottom:3.2rem}.settings-tabs,.settings-mode-grid{display:grid;gap:.65rem}.settings-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.settings-mode-grid{grid-template-columns:repeat(auto-fit,minmax(9rem,1fr))}.settings-tabs .btn,.settings-mode-btn{padding-inline:1rem}.settings-tabs .btn.selected,.settings-mode-btn.selected{border-color:var(--accent);background:#38bdf824;box-shadow:inset 0 0 24px #38bdf814,0 0 18px #38bdf829}.settings-panel{display:grid;gap:.75rem;padding:.8rem;border:1px solid rgba(56,189,248,.16);border-radius:6px;background:#0a162880}.settings-preview-wrap{position:relative;display:grid;place-items:center;min-height:190px;overflow:hidden;border:1px solid rgba(56,189,248,.16);border-radius:4px;background:#000}.settings-preview-board{display:block;width:min(100%,360px);aspect-ratio:6 / 5}.settings-toggle{min-height:44px;display:flex;align-items:center;gap:.65rem;color:var(--text-secondary);font:700 .72rem var(--font-display);letter-spacing:.12em;text-transform:uppercase}.settings-toggle input{width:18px;height:18px;accent-color:var(--accent)}.settings-range{display:grid;grid-template-columns:minmax(120px,.55fr) minmax(120px,1fr) minmax(48px,auto);align-items:center;gap:.75rem;color:var(--text-secondary);font:700 .62rem var(--font-display);letter-spacing:.12em;text-transform:uppercase}.settings-range input{width:100%;accent-color:var(--accent)}.settings-range output{min-width:48px;color:var(--accent);text-align:right}.settings-reset-btn{justify-self:end;margin-top:.15rem}.emoji-btn{width:44px;height:44px;border:1px solid var(--border-glow);border-radius:6px;background:#0a1628a6;cursor:pointer;font-size:1.3rem}.emoji-btn.selected{border-color:var(--accent);box-shadow:0 0 16px #38bdf82e}.room-options{align-items:center;justify-content:space-between;color:var(--text-secondary);font-size:.78rem}.join-row{display:grid;grid-template-columns:1fr auto}.menu-status,.lan-empty{color:var(--text-secondary);font-size:.78rem}.lan-room-list{display:grid;gap:.5rem}.lan-room-btn{min-height:44px;display:flex;justify-content:space-between;align-items:center;padding:.6rem .75rem;border:1px solid var(--border-glow);border-radius:4px;background:#0a1628a6;color:var(--text-primary);cursor:pointer}.multiplayer-command-panel{display:grid;gap:.65rem;padding:.7rem;border:1px solid rgba(56,189,248,.12);border-radius:6px;background:#0a162873}.multiplayer-command-panel:empty{display:none}.command-status-panel{position:absolute;left:50%;bottom:-1px;width:min(440px,calc(100% - 3rem));height:32px;display:grid;grid-template-columns:minmax(0,auto) auto;align-items:center;justify-content:center;gap:.75rem;padding:0 1.1rem;transform:translate(-50%);border:1px solid rgba(148,163,184,.42);border-bottom:0;border-radius:7px 7px 0 0;background:linear-gradient(90deg,rgba(226,232,240,.14),transparent 16%,rgba(148,163,184,.16) 50%,transparent 84%,rgba(226,232,240,.12)),linear-gradient(180deg,#47556985,#0f172ae6 46%,#020617f5);box-shadow:inset 0 1px #ffffff2e,inset 0 -10px 18px #00000038,0 -8px 26px #38bdf814;clip-path:polygon(18px 0,calc(100% - 18px) 0,100% 100%,0 100%)}.command-status-panel:before{content:"";position:absolute;inset:4px 18px auto;height:1px;background:linear-gradient(90deg,transparent,rgba(226,232,240,.38),transparent);opacity:.75;pointer-events:none}.status-led{width:10px;height:10px;border-radius:50%;background:var(--danger);box-shadow:0 0 12px #ef44448c;justify-self:start}.status-led.online{background:var(--success);box-shadow:0 0 14px #22c55e99}.command-status-label{color:#cbd5e1b8;font-family:var(--font-display);font-size:.52rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;white-space:nowrap}.menu-header-row,.profile-summary-row,.profile-history-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.account-status{margin-top:.25rem;color:var(--text-secondary);font-size:.78rem}.profile-dock:empty{display:none}.auth-panel,.profile-panel{display:grid;gap:.7rem;padding:.8rem;border:1px solid rgba(56,189,248,.16);border-radius:6px;background:#0a162880}.auth-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem}.auth-code-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:.55rem;align-items:center}.auth-actions{justify-content:flex-start}.profile-page{width:min(100%,760px)}.profile-avatar{display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;border:1px solid var(--border-glow);border-radius:6px;background:#0f172abf;font-size:1.45rem}.profile-name{color:var(--text-primary);font-family:var(--font-display);font-size:.95rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.profile-subline,.profile-history-row span{color:var(--text-secondary);font-size:.72rem}.profile-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem}.profile-stat-grid>div{display:grid;gap:.2rem;min-height:54px;padding:.55rem;border:1px solid rgba(56,189,248,.1);border-radius:4px;background:#03071259}.profile-stat-grid strong,.profile-history-row strong{color:var(--accent);font-family:var(--font-display);font-size:.82rem}.profile-stat-grid span,.profile-history-title{color:var(--text-muted);font-family:var(--font-display);font-size:.55rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}.profile-history-list{display:grid;gap:.45rem;max-height:180px;overflow-y:auto;padding-right:.25rem}.profile-history-row{padding:.55rem;border:1px solid rgba(56,189,248,.1);border-radius:4px;background:#03071252}.profile-history-row>div{display:grid;gap:.18rem}.mp-room-code,.mp-row{display:flex;justify-content:space-between;gap:.75rem;color:var(--text-secondary);font-size:.78rem}.mp-room-code strong{color:var(--accent);font-family:var(--font-display);letter-spacing:.18em}.mp-attack-grid{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.mp-attack-grid #mp-targets,.mp-attack-grid #btn-mp-fire{grid-column:span 2}.title-logo{font-family:var(--font-display);font-size:4.5rem;font-weight:900;letter-spacing:.15em;background:linear-gradient(135deg,var(--accent) 0%,var(--primary-light) 50%,var(--primary) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-shadow:none;filter:drop-shadow(0 0 30px rgba(99,102,241,.4));margin-bottom:.5rem;animation:titlePulse 3s ease-in-out infinite}.title-subtitle{font-family:var(--font-display);font-size:.85rem;letter-spacing:.5em;color:var(--text-muted);text-transform:uppercase;margin-bottom:3rem}@keyframes titlePulse{0%,to{filter:drop-shadow(0 0 30px rgba(99,102,241,.4))}50%{filter:drop-shadow(0 0 50px rgba(99,102,241,.6))}}.btn{font-family:var(--font-display);font-size:.9rem;font-weight:600;letter-spacing:.15em;padding:1rem 3rem;border:1px solid var(--border-bright);border-radius:4px;background:var(--bg-panel);color:var(--accent);cursor:pointer;transition:all .3s ease;text-transform:uppercase;position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,rgba(56,189,248,.1) 0%,transparent 50%);opacity:0;transition:opacity .3s ease}.btn:hover{border-color:var(--accent);background:#38bdf81a;box-shadow:0 0 30px #38bdf833,inset 0 0 30px #38bdf80d;transform:translateY(-2px)}.btn:hover:before{opacity:1}.btn:active{transform:translateY(0)}.btn-primary{background:linear-gradient(135deg,var(--primary) 0%,#4f46e5 100%);border-color:var(--primary-light);color:#fff}.btn-primary:hover{background:linear-gradient(135deg,var(--primary-light) 0%,var(--primary) 100%);border-color:var(--primary-light);box-shadow:0 0 30px #6366f14d,inset 0 0 30px #6366f11a}.btn-small{font-size:.7rem;padding:.5rem 1.2rem;letter-spacing:.1em}.btn-danger{border-color:#ef444466;color:var(--danger)}.btn-danger:hover{border-color:var(--danger);background:#ef44441a;box-shadow:0 0 30px #ef444433}#game-container{display:none;flex-direction:column;align-items:center;gap:clamp(.3rem,.7vh,.65rem);padding:0;width:100%;height:100%;max-width:min(100%,1260px);overflow:hidden}#game-container.active{display:flex}#phase-banner{font-family:var(--font-display);font-size:.85rem;font-weight:600;letter-spacing:.3em;color:var(--accent);text-transform:uppercase;padding:.6rem 2rem;border:1px solid var(--border-glow);border-radius:4px;background:var(--bg-panel);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .4s ease;text-align:center;min-width:300px}#phase-banner.hit{color:var(--danger);border-color:#ef444466;animation:bannerFlash .5s ease}#phase-banner.miss{color:var(--text-secondary)}#phase-banner.victory{color:var(--success);border-color:#22c55e66;font-size:1.1rem}#top-stats-panel{display:none;align-items:center;justify-content:center;gap:clamp(.8rem,2vw,1.4rem);width:min(100%,560px);min-height:2.2rem;padding:.35rem .75rem;background:#0f172ab8;border:1px solid var(--border-glow);border-radius:6px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}#top-stats-panel.active{display:flex}@keyframes bannerFlash{0%,to{box-shadow:none}50%{box-shadow:0 0 20px #ef44444d}}#boards-area{display:flex;gap:clamp(.55rem,1.2vw,1rem);align-items:flex-start;justify-content:center;flex-wrap:nowrap;width:100%;flex:0 0 auto}.board-side-panel{display:none;flex:0 0 128px;width:128px;min-height:180px;margin-top:1.5rem;padding:.65rem;flex-direction:column;gap:.6rem;background:#0f172ab8;border:1px solid var(--border-glow);border-radius:6px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.board-side-panel.active{display:flex}.side-panel-title{font-family:var(--font-display);font-size:.56rem;font-weight:700;letter-spacing:.16em;color:var(--text-muted);text-transform:uppercase;text-align:center}.side-fleet-list{display:flex;flex-direction:column;gap:.42rem}.side-fleet-summary{display:flex;flex-direction:column;gap:.35rem;padding:.4rem;border:1px solid rgba(56,189,248,.08);border-radius:4px;background:#0a16286b}.side-fleet-summary-label{color:var(--accent);font-family:var(--font-display);font-size:.52rem;font-weight:700;letter-spacing:.12em;text-align:center;text-transform:uppercase}.side-fleet-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"icon name status" "grid grid grid";align-items:center;gap:.25rem .35rem;min-width:0;padding:.35rem .4rem;border-radius:4px;background:#0a162873;border:1px solid rgba(56,189,248,.08)}.side-fleet-row.sunk{border-color:#ef444452;background:#7f1d1d2e}.side-ship-icon{grid-area:icon;width:1rem;font-size:.9rem;line-height:1;text-align:center}.side-ship-name{grid-area:name;overflow:hidden;color:var(--text-secondary);font-family:var(--font-display);font-size:.5rem;font-weight:600;letter-spacing:.08em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.side-ship-status{grid-area:status;color:var(--danger);font-family:var(--font-display);font-size:.48rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.side-ship-grid{grid-area:grid;display:grid;gap:1px;justify-self:center}.side-ship-grid-cell{width:6px;height:6px;border-radius:1px;background:transparent}.side-ship-grid-cell.active{box-shadow:0 0 4px currentColor}.side-fleet-pips{display:grid;grid-template-columns:repeat(auto-fit,minmax(7px,1fr));gap:.22rem;width:100%;align-items:center}.side-fleet-pip{width:100%;height:8px;min-width:4px;border-radius:2px;background:var(--primary);box-shadow:0 0 5px #6366f147}.side-fleet-pip.hit,.side-fleet-pip.sunk{background:var(--danger);box-shadow:0 0 5px #ef44444d}.side-fleet-row.sunk .side-ship-name{color:var(--danger);text-decoration:line-through}.side-fleet-row.sunk .side-ship-grid{opacity:.7}.board-section{display:flex;flex-direction:column;align-items:center;gap:.45rem;flex:0 1 auto;transition:transform .28s ease,opacity .28s ease}.board-label{font-family:var(--font-display);font-size:.7rem;font-weight:600;letter-spacing:.25em;color:var(--text-muted);text-transform:uppercase}.board-canvas-wrap{position:relative;border:1px solid var(--border-glow);border-radius:8px;overflow:hidden;background:#0a162899;box-shadow:0 0 40px #0006,inset 0 0 40px #38bdf808;transition:border-color .3s ease,box-shadow .3s ease,transform .28s ease}.board-canvas-wrap.active{border-color:var(--border-bright);box-shadow:0 0 40px #38bdf81a,inset 0 0 40px #38bdf80d}.board-canvas-wrap canvas{display:block;width:min(480px,calc((100vw - 22rem)/2),40vh);height:auto}#ship-trash-zone{display:none;flex-direction:column;align-items:center;justify-content:center;margin-top:1rem;padding:1rem;border:2px dashed rgba(239,68,68,.3);border-radius:8px;color:#ef444480;transition:all .2s ease;opacity:0;pointer-events:none;transform:translateY(-10px)}#ship-trash-zone.visible{display:flex;opacity:1;transform:translateY(0)}#ship-trash-zone.highlight{border-color:#ef4444cc;background:#ef44441a;color:#ef4444;box-shadow:0 0 15px #ef44444d;transform:scale(1.05)}.trash-icon{font-size:2rem;margin-bottom:.2rem}.trash-text{font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.1em}#placement-panel{display:none;flex-direction:column;gap:.6rem;padding:.75rem;background:var(--bg-panel);border:1px solid var(--border-glow);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:270px}#placement-panel.active{display:flex}.placement-turn #boards-area{display:grid;grid-template-columns:minmax(460px,min(64vw,720px)) minmax(340px,500px);grid-template-areas:"playerBoard placement";align-items:start;gap:clamp(.8rem,2vw,1.35rem)}.placement-turn #player-board-section{grid-area:playerBoard;width:100%}.placement-turn #placement-panel{grid-area:placement;display:flex;width:100%;max-width:none}.placement-turn #player-board-section .board-canvas-wrap canvas{width:min(100%,680px,72vh)}.placement-turn .ship-groups-container{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.placement-turn .ship-group-items{display:grid;grid-template-columns:minmax(0,1fr)}.placement-title{font-family:var(--font-display);font-size:.7rem;font-weight:600;letter-spacing:.2em;color:var(--text-muted);text-transform:uppercase;margin-bottom:.2rem}.ship-groups-container{display:flex;flex-direction:column;gap:.55rem;align-items:start}.ship-group{display:flex;flex-direction:column;gap:.25rem;width:100%}.ship-group-title{font-family:var(--font-display);font-size:.65rem;color:var(--accent);text-transform:uppercase;letter-spacing:.1em;border-bottom:1px solid rgba(56,189,248,.2);padding-bottom:.2rem}.ship-group-items{display:flex;flex-wrap:wrap;gap:.3rem}.ship-item{display:flex;align-items:center;gap:.35rem;padding:.35rem .45rem;border:1px solid transparent;border-radius:4px;cursor:pointer;transition:all .2s ease;font-size:.75rem;min-width:112px}.ship-item:hover{background:#38bdf80d;border-color:var(--border-glow)}.ship-item.selected{background:#6366f126;border-color:var(--primary);box-shadow:0 0 15px #6366f11a}.ship-item.placed{opacity:.5}.ship-item.placed.selected{opacity:1}.ship-icon{font-size:.95rem;width:1.05rem;text-align:center}.ship-info{display:flex;flex-direction:column;gap:.3rem;flex-grow:1}.ship-name{font-weight:500;font-size:.68rem;color:var(--text-primary)}.ship-grid{display:grid;gap:1px}.ship-grid-cell{width:6px;height:6px;border-radius:1px;background-color:transparent}.ship-grid-cell.active{box-shadow:0 0 4px currentColor}.ship-item.placed .ship-grid-cell.active{opacity:.3}.placement-actions{display:flex;gap:.5rem;flex-wrap:wrap}#hud-panel{display:none;gap:clamp(.75rem,2vw,1.4rem);padding:.65rem 1rem;background:var(--bg-panel);border:1px solid var(--border-glow);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);justify-content:center;flex-wrap:wrap;max-width:min(100%,760px);align-self:center;margin-inline:auto}#hud-panel.active{display:flex}.hud-group{display:flex;flex-direction:column;align-items:center;gap:.3rem}.hud-label{font-family:var(--font-display);font-size:.6rem;font-weight:600;letter-spacing:.2em;color:var(--text-muted);text-transform:uppercase}.hud-value{font-family:var(--font-display);font-size:.95rem;font-weight:700;color:var(--accent)}.fleet-status{display:flex;gap:.4rem;align-items:center}.fleet-pip{width:10px;height:10px;border-radius:2px;background:var(--primary);transition:all .3s ease}.fleet-pip.sunk{background:var(--danger);opacity:.5;transform:scale(.8)}#gameover-overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:none;flex-direction:column;align-items:center;justify-content:center;z-index:200;background:#030712e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:fadeIn .6s ease}#gameover-overlay.active{display:flex}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.gameover-title{font-family:var(--font-display);font-size:3.5rem;font-weight:900;letter-spacing:.1em;margin-bottom:1rem}.gameover-title.victory{background:linear-gradient(135deg,var(--success) 0%,#4ade80 50%,var(--accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 30px rgba(34,197,94,.4))}.gameover-title.defeat{background:linear-gradient(135deg,var(--danger) 0%,#f87171 50%,var(--warning) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 30px rgba(239,68,68,.4))}.gameover-stats{display:flex;gap:2rem;margin-bottom:2rem}.gameover-stat{text-align:center}.gameover-stat-value{font-family:var(--font-display);font-size:1.8rem;font-weight:700;color:var(--accent)}.gameover-stat-label{font-size:.75rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em}.gameover-actions{display:flex;gap:1rem;margin-bottom:2.5rem;flex-wrap:wrap;justify-content:center}.gameover-actions.hidden{display:none}.retro-display-host{position:relative}.retro-display-source-hidden{opacity:0}.retro-display-effect{image-rendering:auto;contain:strict}.gameover-actions .hidden{display:none}.gameover-difficulty-control{display:flex;align-items:center;gap:.6rem;min-height:44px;padding:.35rem .45rem .35rem .8rem;border:1px solid var(--border-glow);border-radius:8px;background:#0a16289e}.gameover-difficulty-control span{font-family:var(--font-display);font-size:.68rem;color:var(--text-secondary);letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}.gameover-difficulty-control .menu-select{width:128px;min-width:128px}.match-stats-panel{width:min(92vw,760px);background:#0a1628d9;border:1px solid var(--border-bright);border-radius:10px;padding:1rem;margin-bottom:1.25rem;box-shadow:0 0 40px #38bdf81f}.match-stats-panel.hidden{display:none}.match-stats-title{font-family:var(--font-display);letter-spacing:.14em;font-size:.95rem;color:var(--accent);margin-bottom:.8rem}.match-stats-meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;margin-bottom:.9rem;font-size:.85rem}.match-stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.match-stats-player-card{border:1px solid var(--border-glow);border-radius:8px;background:#03071273;padding:.75rem}.match-stats-player-name{font-family:var(--font-display);letter-spacing:.08em;font-size:.82rem;margin-bottom:.6rem}.match-stats-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;font-size:.78rem;color:var(--text-secondary);margin-bottom:.35rem}.match-stats-row strong{color:var(--text-primary)}.match-stats-close{margin-top:.8rem;width:100%}.post-game-status-box{display:flex;flex-direction:column;gap:.75rem;background:#0a162866;border:1px solid var(--border-glow);border-radius:8px;padding:1rem 1.5rem;min-width:280px}.post-game-status-box.hidden{display:none}.post-game-player{display:flex;justify-content:space-between;align-items:center;gap:2rem}.post-game-player .player-info{display:flex;align-items:center;gap:.75rem}.post-game-player .player-emoji{font-size:1.4rem}.post-game-player .player-name{font-family:var(--font-display);font-size:.85rem;font-weight:600;color:var(--text-primary)}.player-choice{font-size:1.2rem;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#0003}.player-choice.playAgain{color:var(--success);text-shadow:0 0 10px rgba(34,197,94,.5)}.player-choice.mainMenu{color:var(--danger);text-shadow:0 0 10px rgba(239,68,68,.5)}.player-choice.none{color:var(--text-muted);opacity:.5}@media (max-width: 720px){.gameover-stats{gap:1rem;flex-wrap:wrap;justify-content:center}.match-stats-grid,.match-stats-meta{grid-template-columns:1fr}}#toast{position:fixed;top:5.5rem;left:50%;transform:translate(-50%) translateY(-140%);opacity:0;visibility:hidden;padding:.8rem 2rem;background:var(--bg-panel);border:1px solid var(--border-bright);border-radius:6px;font-family:var(--font-display);font-size:.75rem;font-weight:600;letter-spacing:.15em;color:var(--accent);text-transform:uppercase;z-index:1000;transition:transform .4s cubic-bezier(.34,1.56,.64,1),opacity .2s ease,visibility .2s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:none}#toast.visible{transform:translate(-50%) translateY(0);opacity:1;visibility:visible}#toast:empty,#toast.visible:empty{opacity:0;visibility:hidden}#toast.sunk{color:var(--danger);border-color:#ef444480;box-shadow:0 0 30px #ef444433}#scanlines{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:9999;background:repeating-linear-gradient(0deg,rgba(0,0,0,.03) 0px,rgba(0,0,0,.03) 1px,transparent 1px,transparent 3px);opacity:.5}@media (max-width: 900px){html,body{overflow-x:hidden;overflow-y:auto}#app{height:auto;min-height:100vh;padding-inline:.65rem}#game-container{height:auto;min-height:100vh;overflow:visible}#boards-area{display:grid;grid-template-columns:minmax(112px,32vw) minmax(0,1fr) minmax(92px,23vw);grid-template-areas:"playerBoard playerFleet playerFleet" "enemyBoard enemyBoard enemyFleet" "placement placement placement";align-items:start;gap:.55rem}.board-side-panel{width:100%;min-height:0;margin-top:0;padding:.45rem}.side-fleet-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}#player-fleet-panel{grid-area:playerFleet;max-height:none;overflow:visible}#player-board-section{grid-area:playerBoard;width:100%}#enemy-board-section{grid-area:enemyBoard;width:100%}#enemy-fleet-panel{grid-area:enemyFleet;align-self:stretch;max-height:calc(100vw - 8rem);overflow-y:auto}#enemy-fleet-panel .side-fleet-list{display:flex;flex-direction:column}#placement-panel{grid-area:placement}.board-canvas-wrap canvas{width:min(480px,calc(100vw - 2rem),44vh)}#player-board-section .board-canvas-wrap canvas{width:min(100%,150px,32vw)}#enemy-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 8rem),52vh)}.board-label{font-size:.58rem;letter-spacing:.18em}.side-panel-title{font-size:.5rem}.side-fleet-summary{padding:.32rem}.side-fleet-row{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"icon name" "grid grid" "status status";padding:.32rem}.side-ship-name{font-size:.46rem}.side-ship-icon{width:.9rem;font-size:.82rem}.side-ship-grid-cell{width:5px;height:5px}.opponent-turn #player-board-section .board-label{font-size:.48rem}.opponent-turn #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 8rem),52vh)}.opponent-turn #player-fleet-panel{min-height:132px}.title-logo{font-size:2.8rem}#phase-banner,#top-stats-panel,#powerup-info-container,#powerup-bar,#fire-controls-wrap{width:100%}#powerup-bar{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;padding:.55rem}.powerup-btn,.btn,.btn-small{min-height:44px}#fire-controls-wrap{min-height:190px}#fire-controls-wrap canvas{width:min(100%,460px)!important}}@media (max-width: 900px) and (orientation: landscape),(max-height: 540px) and (max-width: 1180px){#app{padding:.35rem}#game-container{gap:.25rem}#phase-banner{min-width:0;padding:.35rem .8rem;font-size:.58rem}#top-stats-panel{min-height:1.8rem;padding:.2rem .5rem}#boards-area{display:grid;grid-template-columns:108px minmax(300px,1fr) 132px;grid-template-areas:"player enemy enemyFleet";align-items:start;gap:.45rem}#player-fleet-panel{display:none}#player-board-section{grid-area:player}#enemy-board-section{grid-area:enemy}#enemy-fleet-panel{grid-area:enemyFleet;width:132px;max-height:275px;overflow:hidden}#player-board-section .board-canvas-wrap canvas{width:108px}#enemy-board-section .board-canvas-wrap canvas{width:min(52vw,330px)}#powerup-info-container{height:1.9rem;min-height:1.9rem}#powerup-info,#salvo-counter,#weapon-armed-info{padding:.32rem .55rem;font-size:.55rem}#powerup-bar{grid-template-columns:repeat(5,minmax(68px,1fr));max-width:min(100%,760px)}.powerup-btn{min-height:44px;padding:.35rem}.powerup-icon{font-size:1rem}.powerup-name{font-size:.45rem}#fire-controls-wrap{min-height:138px}#fire-controls-wrap canvas{width:min(420px,64vw)!important}}#powerup-info-container{height:2.4rem;min-height:2.4rem;display:flex;align-items:center;justify-content:center;gap:.5rem;margin-top:0;flex-wrap:nowrap;align-self:center;width:min(100%,820px)}#powerup-info,#salvo-counter,#weapon-armed-info{display:none;opacity:0;transform:translateY(10px);transition:all .3s ease;color:var(--accent);font-family:var(--font-display);font-size:.75rem;font-weight:600;letter-spacing:.15em;background:#0a1628cc;padding:.5rem 1rem;border-radius:4px;border:1px solid var(--border-glow);text-transform:uppercase;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#powerup-info{max-width:min(100%,620px)}#powerup-info.visible,#salvo-counter.visible,#weapon-armed-info.visible{display:flex;align-items:center;opacity:1;transform:translateY(0)}#powerup-info{overflow:hidden}#powerup-info .marquee-text{display:inline-block;min-width:max-content;will-change:transform}#powerup-info.visible.marquee .marquee-text{animation:weaponInfoMarquee 18s linear infinite}@keyframes weaponInfoMarquee{0%,25%{transform:translate(0)}56%,85%{transform:translate(calc(-1 * var(--marquee-distance, 0px)))}85.01%{transform:translate(0)}to{transform:translate(0)}}#salvo-counter{color:var(--warning);border-color:#f59e0b59}#weapon-armed-info{color:var(--danger);border-color:#ef444466}#powerup-bar{display:none;gap:.65rem;padding:.7rem .9rem;background:var(--bg-panel);border:1px solid var(--border-glow);border-radius:8px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);justify-content:center;grid-template-columns:repeat(5,minmax(88px,1fr));max-width:min(100%,820px);width:min(100%,820px);align-self:center;margin-inline:auto}#powerup-bar.active{display:grid}.powerup-btn{position:relative;display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:.55rem .7rem;border:1px solid var(--border-glow);border-radius:6px;background:#0a162899;cursor:pointer;transition:all .3s ease;min-width:0;min-height:58px}.powerup-btn:hover:not(.disabled){border-color:var(--accent);background:#38bdf814;box-shadow:0 0 15px #38bdf826;transform:translateY(-2px)}.powerup-btn.selected{border-color:var(--primary);background:#6366f126;box-shadow:0 0 20px #6366f133}.powerup-btn.disabled{opacity:.35;cursor:not-allowed;filter:grayscale(.5)}.powerup-icon{font-size:1.45rem}.powerup-name{font-family:var(--font-display);font-size:.56rem;font-weight:600;letter-spacing:.1em;color:var(--text-secondary);text-transform:uppercase}.powerup-cooldown{position:absolute;top:2px;right:4px;font-family:var(--font-display);font-size:.5rem;font-weight:700;color:var(--warning);background:#0009;padding:1px 3px;border-radius:2px}.torpedo-direction{display:flex;gap:.3rem;margin-top:.3rem}.torpedo-dir-btn{font-family:var(--font-display);font-size:.5rem;padding:.2rem .5rem;border:1px solid var(--border-glow);border-radius:3px;background:#0a162899;color:var(--text-secondary);cursor:pointer;transition:all .2s ease}.torpedo-dir-btn:hover,.torpedo-dir-btn.selected{border-color:var(--accent);color:var(--accent);background:#38bdf81a}#fire-controls-wrap{display:none;align-items:center;justify-content:center;padding:0;width:min(100%,700px);min-height:min(320px,32vh);overflow:hidden;align-self:center;margin-inline:auto}#fire-controls-wrap.active{display:flex}#fire-controls-wrap canvas{display:block;width:min(100%,700px,64vh)!important;height:auto!important}@media (max-width: 1180px){#boards-area{flex-wrap:wrap}#placement-panel{order:3;max-width:min(100%,760px)}.ship-groups-container{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}}@media (max-width: 1180px) and (min-width: 901px){.placement-turn #boards-area{display:grid;grid-template-columns:minmax(430px,1fr) minmax(320px,440px);grid-template-areas:"playerBoard placement"}.placement-turn #placement-panel{order:initial;max-width:none}}.targeting-label{font-family:var(--font-display);font-size:.6rem;font-weight:600;letter-spacing:.15em;color:var(--warning);text-transform:uppercase;padding:.3rem .8rem;background:#f59e0b1a;border:1px solid rgba(245,158,11,.3);border-radius:4px;margin-right:.8rem;animation:targetPulse 1.5s ease infinite}@keyframes targetPulse{0%,to{opacity:.8}50%{opacity:1}}@keyframes ripple{0%{transform:scale(0);opacity:1}to{transform:scale(2);opacity:0}}@keyframes hitPulse{0%{box-shadow:0 0 #ef444466}70%{box-shadow:0 0 0 15px #ef444400}to{box-shadow:0 0 #ef444400}}@media (max-width: 900px){html,body{overflow-x:hidden}#app{padding:.35rem}#game-container.active{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(112px,.82fr);grid-template-areas:"banner stats" "boards boards" "info info" "powerups powerups" "fire fire";align-items:start;gap:.35rem;min-height:0;max-width:100%;overflow:visible}#phase-banner{grid-area:banner;min-width:0;width:100%;min-height:44px;padding:.38rem .5rem;font-size:clamp(.52rem,2.8vw,.68rem);letter-spacing:.18em;display:flex;align-items:center;justify-content:center}#top-stats-panel{grid-area:stats;width:100%;min-height:44px;padding:.25rem .35rem;gap:.45rem}.hud-group{gap:.12rem}.hud-label{font-size:.42rem;letter-spacing:.12em}.hud-value{font-size:.72rem}#boards-area{grid-area:boards;display:grid;grid-template-columns:minmax(96px,28vw) minmax(0,1fr) minmax(64px,18vw);grid-template-areas:"playerBoard playerFleet playerFleet" "enemyBoard enemyBoard enemyFleet" "placement placement placement";gap:.35rem;width:100%}.board-section{gap:.24rem}.board-label{width:100%;font-size:.48rem;letter-spacing:.14em;text-align:left}#player-board-section .board-canvas-wrap canvas{width:min(100%,112px,28vw)}#enemy-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 5.5rem),45vh)}.board-side-panel{padding:.34rem;gap:.32rem;border-radius:5px}#player-fleet-panel{align-self:stretch}#player-fleet-panel .side-panel-title{margin-bottom:-.1rem}#player-fleet-panel .side-fleet-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.26rem}#player-fleet-panel .side-fleet-summary{gap:.18rem;padding:.25rem}#player-fleet-panel .side-fleet-pips{grid-template-columns:repeat(auto-fit,minmax(6px,1fr));gap:.12rem;min-width:0;overflow:hidden}#player-fleet-panel .side-fleet-pip{width:100%;height:clamp(4px,1.45vw,7px)}#player-fleet-panel .side-fleet-row{grid-template-columns:1fr;grid-template-areas:"icon" "name" "grid" "status";justify-items:center;gap:.12rem;padding:.22rem;min-height:50px}#player-fleet-panel .side-ship-name{max-width:100%;font-size:.36rem;letter-spacing:.03em;text-align:center}#player-fleet-panel .side-ship-icon{width:auto;font-size:.74rem}#player-fleet-panel .side-ship-grid-cell,#enemy-fleet-panel .side-ship-grid-cell{width:4px;height:4px}#enemy-fleet-panel{max-height:min(45vh,calc(100vw - 4.5rem));overflow-y:hidden}#enemy-fleet-panel .side-fleet-list{gap:.25rem}#enemy-fleet-panel .side-fleet-summary{padding:.24rem}#enemy-fleet-panel .side-fleet-pips{gap:.1rem}#enemy-fleet-panel .side-fleet-pip{width:100%;height:5px}#enemy-fleet-panel .side-fleet-row{padding:.24rem;gap:.12rem}#enemy-fleet-panel .side-ship-name{font-size:.34rem;letter-spacing:.03em}#powerup-info-container{grid-area:info;height:auto;min-height:1.65rem;width:100%;flex-wrap:wrap;align-items:stretch;gap:.25rem}#powerup-info,#salvo-counter,#weapon-armed-info{min-width:0;max-width:100%;padding:.3rem .5rem;font-size:.48rem;letter-spacing:.08em;white-space:normal;overflow:visible;line-height:1.15;display:flex;align-items:center}#powerup-info{flex:1 1 58%}#salvo-counter,#weapon-armed-info{flex:1 1 34%;justify-content:center}#powerup-bar{grid-area:powerups;grid-template-columns:repeat(5,minmax(0,1fr));gap:.32rem;width:100%;max-width:100%;padding:.42rem}.powerup-btn{min-height:44px;padding:.26rem .12rem;gap:.12rem}.powerup-icon{font-size:clamp(1rem,5vw,1.28rem)}.powerup-name{font-size:clamp(.34rem,1.7vw,.46rem);letter-spacing:.04em;line-height:1.05;overflow-wrap:anywhere;text-align:center}.powerup-cooldown{top:.12rem;right:.18rem;font-size:.4rem}#fire-controls-wrap{grid-area:fire;min-height:118px;width:100%}#fire-controls-wrap canvas{width:min(100%,330px)!important}.opponent-turn #boards-area{grid-template-columns:minmax(0,1fr) minmax(122px,30vw);grid-template-areas:"playerBoard playerFleet" "enemyBoard enemyFleet" "placement placement"}.opponent-turn #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 9.2rem),54vh)}.opponent-turn #enemy-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 9.2rem),38vh)}.opponent-turn #player-fleet-panel .side-fleet-list{grid-template-columns:repeat(2,minmax(0,1fr))}.opponent-turn #player-fleet-panel .side-fleet-row{min-height:44px}.placement-turn #game-container,#game-container.placement-turn.active{grid-template-columns:minmax(0,1fr);grid-template-areas:"banner" "boards"}.placement-turn #top-stats-panel,.placement-turn #powerup-info-container,.placement-turn #powerup-bar,.placement-turn #fire-controls-wrap{display:none}.placement-turn #boards-area{grid-template-columns:minmax(0,56vw) minmax(128px,1fr);grid-template-areas:"playerBoard placement";align-items:start;gap:.45rem}.placement-turn #player-board-section .board-canvas-wrap canvas{width:min(100%,56vw,390px)}.placement-turn #placement-panel{width:100%;max-width:none;padding:.45rem;gap:.42rem}.placement-turn .placement-title{font-size:.52rem;letter-spacing:.12em}.placement-turn .placement-actions{gap:.28rem}.placement-turn .placement-actions .btn{min-height:38px;padding-inline:.42rem;font-size:.5rem}.placement-turn .ship-groups-container{display:grid;grid-template-columns:minmax(0,1fr);gap:.34rem}.placement-turn .ship-group{gap:.2rem}.placement-turn .ship-group-title{font-size:.46rem;letter-spacing:.08em}.placement-turn .ship-group-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(92px,1fr));gap:.24rem}.placement-turn .ship-item{min-width:0;padding:.28rem;gap:.25rem}.placement-turn .ship-name{font-size:.48rem;line-height:1.05}.placement-turn .ship-icon{font-size:.8rem;width:.9rem}.mine-targeting-own #boards-area{grid-template-columns:minmax(96px,28vw) minmax(0,1fr) minmax(64px,18vw);grid-template-areas:"enemyBoard enemyFleet enemyFleet" "playerBoard playerBoard playerFleet"}.mine-targeting-own #player-board-section .board-label{color:var(--success);text-shadow:0 0 12px rgba(34,197,94,.5)}.mine-targeting-own #player-board-section .board-canvas-wrap{border-color:#22c55ee6;box-shadow:0 0 28px #22c55e38,inset 0 0 40px #22c55e14;transform:translateY(-2px)}.mine-targeting-own #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 5.5rem),45vh)}.mine-targeting-own #enemy-board-section .board-canvas-wrap canvas{width:min(100%,112px,28vw)}}@media (max-width: 900px){#game-container.active.placement-turn{height:100svh;min-height:100svh;overflow:hidden;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"banner" "boards"}#game-container.active.placement-turn #phase-banner{min-height:38px;padding-block:.4rem}#game-container.active.placement-turn #boards-area{height:100%;min-height:0;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"playerBoard" "placement";align-content:start;gap:.35rem}#game-container.active.placement-turn #player-board-section{min-width:0}#game-container.active.placement-turn #player-board-section .board-label{text-align:center}#game-container.active.placement-turn #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - .7rem),55svh)}#game-container.active.placement-turn #placement-panel{min-height:0;max-height:100%;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr);padding:.38rem;gap:.34rem}#game-container.active.placement-turn .placement-title{display:none}#game-container.active.placement-turn .placement-actions{position:sticky;top:0;z-index:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.28rem;padding-bottom:.04rem;background:linear-gradient(180deg,#091222fa,#091222c7)}#game-container.active.placement-turn .placement-actions .btn{min-width:0;min-height:40px;padding-inline:.22rem;font-size:.46rem;white-space:normal;line-height:1.05}#game-container.active.placement-turn .ship-groups-container{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:.12rem}#game-container.active.placement-turn .ship-group-items{grid-template-columns:repeat(2,minmax(0,1fr))}#game-container.active.mine-targeting-own{min-height:100svh}#game-container.active.mine-targeting-own #boards-area{grid-template-columns:minmax(0,1fr) minmax(78px,20vw);grid-template-areas:"enemyBoard enemyFleet" "playerBoard playerFleet";align-items:start;gap:.34rem}#game-container.active.mine-targeting-own #enemy-board-section .board-canvas-wrap canvas{width:min(100%,28vw,20svh)}#game-container.active.mine-targeting-own #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 6.4rem),40svh)}#game-container.active.mine-targeting-own #enemy-fleet-panel,#game-container.active.mine-targeting-own #player-fleet-panel{align-self:start;max-height:none;min-height:0;padding:.3rem;gap:.22rem;overflow:hidden}#game-container.active.mine-targeting-own #enemy-fleet-panel .side-fleet-list,#game-container.active.mine-targeting-own #player-fleet-panel .side-fleet-list{display:none}#game-container.active.mine-targeting-own .side-panel-title{font-size:.48rem;line-height:1}#game-container.active.mine-targeting-own .side-fleet-summary{padding:.24rem}#game-container.active.mine-targeting-own .side-fleet-pips{grid-template-columns:repeat(auto-fit,minmax(5px,1fr));gap:.1rem}#game-container.active.mine-targeting-own .side-fleet-pip{width:100%;height:5px}#game-container.active.mine-targeting-own #powerup-info-container{min-height:1.35rem;gap:.2rem}#game-container.active.mine-targeting-own #powerup-info,#game-container.active.mine-targeting-own #salvo-counter,#game-container.active.mine-targeting-own #weapon-armed-info{padding:.24rem .38rem;font-size:.44rem;line-height:1.08}#game-container.active.mine-targeting-own #powerup-bar{gap:.25rem;padding:.34rem}#game-container.active.mine-targeting-own .powerup-btn{min-height:40px;padding:.2rem .1rem}#game-container.active.mine-targeting-own #fire-controls-wrap{min-height:102px}#game-container.active.mine-targeting-own #fire-controls-wrap canvas{width:min(100%,300px)!important}}@media (max-width: 900px){.main-menu-panel{width:min(100%,720px);max-height:calc(100dvh - .8rem);padding:.85rem .85rem 2.8rem;gap:.62rem}.menu-mode-actions,.settings-mode-grid,.menu-account-actions{gap:.45rem}.settings-range{grid-template-columns:1fr minmax(120px,1.2fr) auto;gap:.5rem}html,body,body.mobile-scroll{width:100%;height:100dvh;min-height:100dvh;overflow:hidden!important}#app{position:fixed;top:0;right:0;bottom:0;left:0;height:100dvh;min-height:0;overflow:hidden;padding:.22rem}#game-container.active:not(.placement-turn){height:calc(100dvh - .44rem);min-height:0;max-height:calc(100dvh - .44rem);overflow:hidden;gap:.22rem;grid-template-rows:auto auto auto auto auto;align-content:space-between}#phase-banner,#top-stats-panel{min-height:36px;padding:.22rem .34rem;border-radius:5px}#phase-banner{font-size:clamp(.46rem,2.45vw,.58rem);letter-spacing:.14em}#top-stats-panel{gap:.28rem}.hud-label{font-size:.34rem}.hud-value{font-size:.58rem}#game-container.active:not(.placement-turn) #boards-area{min-height:0;max-height:100%;overflow:hidden;gap:.24rem}#game-container.active:not(.placement-turn):not(.opponent-turn) #boards-area{grid-template-columns:minmax(78px,25vw) minmax(0,1fr) minmax(74px,19vw);grid-template-areas:"playerBoard playerFleet playerFleet" "enemyBoard enemyBoard enemyFleet" "placement placement placement"}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-board-section .board-canvas-wrap canvas{width:min(100%,25vw,15dvh)}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 5.5rem),34dvh)}#game-container.active.opponent-turn #boards-area{grid-template-columns:minmax(0,1fr) minmax(96px,24vw);grid-template-areas:"playerBoard playerFleet" "enemyBoard enemyFleet";grid-template-rows:auto auto}#game-container.active.opponent-turn #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 6.2rem),36dvh)}#game-container.active.opponent-turn #enemy-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 6.2rem),27dvh)}.board-section{gap:.13rem}.board-label{font-size:.4rem;line-height:1}.board-side-panel{min-height:0;max-height:100%;overflow:hidden;padding:.25rem;gap:.2rem}.side-panel-title{font-size:.42rem;line-height:1}.side-fleet-summary{padding:.22rem;gap:.18rem}.side-fleet-summary-text{font-size:.48rem}.side-fleet-pips{gap:.09rem}.side-fleet-pip{width:100%;height:5px}.side-fleet-list{gap:.2rem}.side-fleet-row{min-height:0;padding:.22rem;gap:.08rem}.side-ship-name{font-size:.34rem;line-height:1}.side-ship-icon{font-size:.68rem}.side-ship-grid{gap:1px}.side-ship-grid-cell{width:4px;height:4px}#player-fleet-panel .side-fleet-list{grid-template-columns:repeat(5,minmax(0,1fr))}#game-container.active.opponent-turn #player-fleet-panel .side-fleet-list{grid-template-columns:repeat(2,minmax(0,1fr))}#game-container.active.opponent-turn #enemy-fleet-panel .side-fleet-list{display:none}#enemy-fleet-panel{max-height:100%}#powerup-info-container{min-height:1.05rem;gap:.16rem}#powerup-info,#salvo-counter,#weapon-armed-info{padding:.2rem .34rem;font-size:.38rem;line-height:1.05}#powerup-bar{gap:.22rem;padding:.3rem}.powerup-btn{min-height:38px;padding:.18rem .08rem}.powerup-icon{font-size:clamp(.84rem,4vw,1rem)}.powerup-name{font-size:clamp(.3rem,1.42vw,.38rem)}#fire-controls-wrap{min-height:clamp(170px,28dvh,340px)}#fire-controls-wrap canvas{width:min(100%,700px,64dvh)!important}}@media (orientation: landscape) and (max-height: 620px) and (pointer: coarse){html,body,body.mobile-scroll{width:100%;height:100dvh;min-height:100dvh;overflow:hidden!important}#app{position:fixed;top:0;right:0;bottom:0;left:0;height:100dvh;min-height:0;overflow:hidden;padding:.18rem}#game-container.active:not(.placement-turn){display:grid;height:calc(100dvh - .36rem);max-height:calc(100dvh - .36rem);min-height:0;max-width:100%;overflow:hidden;gap:.18rem;grid-template-columns:minmax(0,1fr) minmax(190px,26vw);grid-template-rows:auto auto minmax(0,1fr) auto;grid-template-areas:"banner stats" "boards info" "boards powerups" "boards fire";align-content:stretch}#phase-banner,#top-stats-panel{min-height:30px;padding:.16rem .36rem}#phase-banner{font-size:clamp(.42rem,1.5vw,.56rem);letter-spacing:.16em}#top-stats-panel{gap:.38rem}.hud-label{font-size:.32rem}.hud-value{font-size:.58rem}#game-container.active:not(.placement-turn) #boards-area{grid-area:boards;min-height:0;max-height:100%;overflow:hidden;display:grid;grid-template-columns:minmax(72px,12vw) minmax(0,1fr) minmax(112px,16vw);grid-template-areas:"playerBoard enemyBoard enemyFleet";align-items:start;gap:.28rem}#game-container.active:not(.placement-turn) #player-board-section{grid-area:playerBoard}#game-container.active:not(.placement-turn) #enemy-board-section{grid-area:enemyBoard}#game-container.active:not(.placement-turn) #enemy-fleet-panel{grid-area:enemyFleet}#game-container.active:not(.placement-turn) #player-fleet-panel{display:none!important}#game-container.active:not(.placement-turn) #player-board-section .board-canvas-wrap canvas{width:min(100%,18dvh,12vw)}#game-container.active:not(.placement-turn) #enemy-board-section .board-canvas-wrap canvas{width:min(100%,64dvh,48vw)}#game-container.active:not(.placement-turn) #enemy-fleet-panel{max-height:calc(100dvh - 4rem);overflow:hidden;padding:.28rem}#game-container.active:not(.placement-turn) #enemy-fleet-panel .side-fleet-list{gap:.2rem}#game-container.active:not(.placement-turn) #enemy-fleet-panel .side-fleet-row{min-height:38px;padding:.2rem}#powerup-info-container{grid-area:info;min-height:0;gap:.14rem}#powerup-info,#salvo-counter,#weapon-armed-info{padding:.18rem .28rem;font-size:.34rem}#powerup-bar{grid-area:powerups;grid-template-columns:repeat(2,minmax(0,1fr));align-self:stretch;gap:.18rem;padding:.24rem}.powerup-btn{min-height:30px;padding:.12rem .08rem}.powerup-icon{font-size:clamp(.7rem,3.2dvh,.95rem)}.powerup-name{font-size:clamp(.26rem,1.2dvh,.34rem)}#fire-controls-wrap{grid-area:fire;min-height:22dvh;align-self:end}#fire-controls-wrap canvas{width:min(100%,54dvh,380px)!important}}@media (max-width: 900px) and (orientation: portrait){html,body,body.mobile-scroll{height:100svh;min-height:100svh}#app{height:100svh}#game-container.active:not(.placement-turn){height:calc(100svh - .44rem);max-height:calc(100svh - .44rem);gap:clamp(.08rem,.35svh,.18rem);grid-template-rows:auto minmax(0,1fr) auto auto clamp(112px,18svh,205px);align-content:stretch}#phase-banner,#top-stats-panel{min-height:40px}#phase-banner{font-size:clamp(.54rem,2.75vw,.68rem);letter-spacing:.16em}.hud-label{font-size:.38rem}.hud-value{font-size:.68rem}#game-container.active:not(.placement-turn):not(.opponent-turn) #boards-area{--mobile-own-strip-height: clamp(58px, 7.8svh, 74px);display:grid;grid-template-columns:minmax(54px,15vw) minmax(0,1fr) minmax(44px,10.5vw);grid-template-rows:var(--mobile-own-strip-height) minmax(0,1fr);grid-template-areas:"playerBoard playerFleet playerFleet" "enemyBoard enemyBoard enemyFleet" "placement placement placement";align-content:start;gap:clamp(.12rem,.42svh,.22rem);justify-items:stretch}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-board-section{display:flex;flex-direction:column;align-items:center;justify-self:center;width:fit-content;max-width:100%}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-board-section .board-label{align-self:center;width:100%;text-align:center}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-board-section .board-canvas-wrap{align-self:center;display:inline-block;width:fit-content;max-width:100%;margin-inline:auto}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 3.65rem),calc(100svh - 358px),470px)}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-board-section{height:var(--mobile-own-strip-height);min-height:0;overflow:hidden;align-self:stretch}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-board-section .board-canvas-wrap canvas{width:min(100%,13.5vw,calc(var(--mobile-own-strip-height) - .72rem))}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel{height:var(--mobile-own-strip-height);min-height:0;padding:clamp(.07rem,.32svh,.12rem);gap:clamp(.04rem,.2svh,.08rem);overflow:hidden}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel .side-panel-title{font-size:clamp(.24rem,1.15vw,.3rem)}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel .side-fleet-summary{padding:clamp(.05rem,.22svh,.09rem);gap:clamp(.03rem,.16svh,.06rem)}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel .side-fleet-list{gap:clamp(.06rem,.24svh,.1rem)}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel .side-fleet-row{min-height:clamp(25px,3.35svh,34px);padding:clamp(.04rem,.2svh,.08rem);grid-template-columns:auto minmax(0,max-content);grid-template-areas:"name name" "icon grid";justify-content:center;justify-items:center;gap:.03rem .12rem}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel .side-ship-icon{font-size:clamp(.42rem,1.9vw,.56rem)}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel .side-ship-grid-cell{width:clamp(2.4px,.7vw,3.2px);height:clamp(2.4px,.7vw,3.2px)}#game-container.active:not(.placement-turn):not(.opponent-turn) #player-fleet-panel .side-ship-name{font-size:clamp(.22rem,1.08vw,.27rem);max-width:100%;text-align:center}#game-container.active.opponent-turn #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 6.2rem),30svh)}#game-container.active.opponent-turn #enemy-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 6.2rem),22svh)}.side-panel-title{font-size:.46rem}.side-fleet-summary-text{font-size:.54rem}.side-ship-name{font-size:.38rem}#powerup-info,#salvo-counter,#weapon-armed-info{font-size:clamp(.52rem,2.2vw,.62rem)}.powerup-name{font-size:clamp(.36rem,1.7vw,.46rem)}#fire-controls-wrap{min-height:clamp(112px,18svh,205px);align-self:stretch;align-items:flex-end;padding-bottom:max(.1rem,env(safe-area-inset-bottom))}#fire-controls-wrap canvas{aspect-ratio:760 / 360;max-height:calc(100% - max(.1rem,env(safe-area-inset-bottom)));object-fit:contain;width:min(100%,590px,54svh)!important}#powerup-info-container{height:clamp(1.28rem,3.7svh,1.55rem);min-height:clamp(1.28rem,3.7svh,1.55rem);flex-wrap:nowrap;align-items:center;gap:.22rem;width:100%}#powerup-info,#salvo-counter,#weapon-armed-info{min-width:0;padding:.26rem .44rem;line-height:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#powerup-info,#salvo-counter{flex:0 1 auto;max-width:none}#powerup-info{flex:999 1 0}#weapon-armed-info{flex:0 1 auto;max-width:none;min-width:max-content}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel{width:100%;height:100%;max-height:none;min-height:0;margin-top:0;display:grid;grid-template-columns:minmax(0,1fr) clamp(3px,.78vw,5px);grid-template-rows:auto minmax(0,1fr);grid-template-areas:"title title" "ships summary";align-items:stretch;padding:clamp(.08rem,.32svh,.14rem);gap:clamp(.08rem,.32svh,.14rem);overflow:hidden}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-panel-title{display:block;grid-area:title;font-size:clamp(.32rem,1.45vw,.42rem);line-height:1}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-fleet-summary{grid-area:summary;padding:0;border:0;background:transparent;align-items:center;justify-content:start;min-width:0;overflow:hidden}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-fleet-summary-label{display:none}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-fleet-pips{grid-template-columns:1fr;grid-auto-rows:minmax(3px,1fr);gap:1px;height:100%;width:100%;align-content:stretch}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-fleet-pip{width:100%;height:100%;min-height:3px}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-fleet-list{grid-area:ships;display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(0,1fr);gap:clamp(.08rem,.32svh,.14rem);min-height:0;overflow:hidden}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-fleet-row{grid-template-columns:minmax(0,1fr);grid-template-areas:"name" "icon" "grid" "status";align-content:center;justify-items:center;min-height:0;padding:clamp(.04rem,.22svh,.08rem);gap:clamp(.02rem,.16svh,.06rem)}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-ship-icon{grid-area:icon;font-size:clamp(.42rem,1.9vw,.56rem);width:auto}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-ship-grid{grid-area:grid;justify-self:center}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-ship-status{display:none}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel .side-ship-name{display:block;max-width:100%;text-align:center;font-size:clamp(.23rem,1.15vw,.31rem)}#game-container.active.mine-targeting-own:not(.placement-turn):not(.opponent-turn) #boards-area{grid-template-columns:minmax(54px,14vw) minmax(0,1fr) minmax(44px,10.5vw);grid-template-areas:"enemyBoard enemyFleet enemyFleet" "playerBoard playerBoard playerFleet" "placement placement placement"}#game-container.active.mine-targeting-own:not(.placement-turn):not(.opponent-turn) #enemy-board-section .board-canvas-wrap canvas{width:min(100%,14vw,calc(var(--mobile-own-strip-height) - .72rem))}#game-container.active.mine-targeting-own:not(.placement-turn):not(.opponent-turn) #player-board-section{height:auto;overflow:visible}#game-container.active.mine-targeting-own:not(.placement-turn):not(.opponent-turn) #player-board-section .board-canvas-wrap canvas{width:min(100%,calc(100vw - 3.65rem),calc(100svh - 358px),470px)}}@media (max-width: 900px) and (orientation: portrait) and (max-height: 740px){#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-board-section .board-canvas-wrap canvas{width:min(calc(100vw - 3.65rem),calc(100svh - 370px),405px)}#game-container.active:not(.placement-turn):not(.opponent-turn) #enemy-fleet-panel{max-height:none}#fire-controls-wrap{min-height:clamp(106px,17svh,185px)}#fire-controls-wrap canvas{width:min(100%,560px,51svh)!important}}