:root{font-family:Bahnschrift,Aptos,Segoe UI Variable,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#e8f4ff;background:radial-gradient(circle at top,rgba(67,123,255,.24),transparent 28%),radial-gradient(circle at right,rgba(28,195,187,.12),transparent 26%),linear-gradient(180deg,#040d18,#081523 48%,#0a1a2f);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;min-width:320px;min-height:100vh;background:transparent;overflow-x:hidden}button{border-radius:999px;border:1px solid rgba(83,160,255,.24);padding:.8rem 1.08rem;font-size:.98rem;font-weight:600;font-family:inherit;background:linear-gradient(180deg,#4b99ff,#2b6fe8);color:#f8fbff;cursor:pointer;box-shadow:0 14px 30px #1854b13d;transition:transform .12s ease,filter .12s ease,opacity .12s ease,box-shadow .12s ease}button:hover{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 18px 34px #1854b14d}button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}button:focus,button:focus-visible{outline:3px solid rgba(115,240,255,.5);outline-offset:2px}*{box-sizing:border-box}#root{min-height:100vh}.app-shell{--surface-1: rgba(9, 20, 36, .9);--surface-2: rgba(12, 28, 48, .88);--surface-3: rgba(20, 43, 72, .74);--line-soft: rgba(160, 208, 255, .12);--line-strong: rgba(125, 215, 255, .24);--text-soft: rgba(221, 234, 246, .82);--text-dim: rgba(184, 202, 221, .66);--glow: 0 28px 70px rgba(1, 8, 18, .34);position:relative;width:min(1680px,calc(100vw - 1rem));margin:0 auto;padding:1rem 0 1.6rem}.app-shell-live{padding-top:.75rem}.app-shell:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 12%,rgba(66,154,255,.14),transparent 24%),radial-gradient(circle at 92% 8%,rgba(95,255,225,.08),transparent 20%),radial-gradient(circle at 48% 100%,rgba(255,161,82,.08),transparent 26%);z-index:-1}.panel{position:relative;overflow:clip;background:linear-gradient(180deg,#122239f0,#081220f5),linear-gradient(135deg,rgba(255,255,255,.04),transparent 40%);border:1px solid var(--line-soft);border-radius:30px;box-shadow:var(--glow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.panel:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.08),transparent 30%);opacity:.72}.hero,.setup-grid,.live-layout{margin-top:.9rem}.hero{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(16rem,.7fr);gap:1rem;padding:1.35rem 1.45rem;align-items:end}.hero-live{grid-template-columns:minmax(0,1fr) auto;padding:1rem 1.15rem}.hero-intro{min-width:0}.hero h1,.command-panel h2,.panel-heading h2,.setup-card h2,.enemy-card h3{margin:0;letter-spacing:-.05em}.hero h1{font-size:clamp(2.4rem,4vw,4.8rem);line-height:.92}.hero-live h1{font-size:clamp(1.65rem,2.2vw,2.4rem)}.hero-copy{max-width:46rem;margin:.6rem 0 0;color:var(--text-soft);font-size:1rem}.hero-meta,.button-row,.captain-heading,.enemy-head,.panel-heading,.command-primary,.command-statuses,.ship-selector,.enemy-target-topline,.enemy-target-metrics,.enemy-focus-meta,.enemy-intel-summary{display:flex;gap:.7rem;flex-wrap:wrap}.hero-meta{justify-content:flex-end;align-self:start;max-width:26rem}.captain-heading,.enemy-head,.panel-heading,.enemy-target-topline,.enemy-focus-meta,.enemy-intel-summary{align-items:center}.status-pill{display:inline-flex;align-items:center;min-height:2.25rem;border-radius:999px;padding:.45rem .82rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.08);color:#eff8ff;font-size:.88rem;line-height:1.15}.status-ok{background:#36c18529;border-color:#36c18547}.status-warn{background:#ffae4724;border-color:#ffae473d}.your-turn{background:#58bbff2e;border-color:#58bbff57}.setup-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(18rem,.9fr);gap:1rem}.setup-card,.board-panel,.battle-panel{padding:1.2rem}.command-panel{padding:1.05rem 1.15rem 1.15rem;display:grid;gap:.85rem}.command-primary{justify-content:space-between;align-items:flex-start}.command-title-block{min-width:0}.command-copy{margin:.45rem 0 0;color:var(--text-dim);max-width:40rem}.command-actions{justify-content:flex-end}.command-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem}.command-stat{display:grid;gap:.28rem;min-width:0;padding:.9rem .95rem;border-radius:22px;background:linear-gradient(180deg,#ffffff0d,#ffffff08);border:1px solid rgba(255,255,255,.07)}.command-stat-highlight{border-color:#7dd7ff47;background:linear-gradient(180deg,#468fd92e,#11233c47)}.command-stat-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.16em;color:#81d9ff}.command-stat strong{font-size:1.05rem;line-height:1.1}.command-stat p{margin:0;color:var(--text-soft);font-size:.84rem}.command-statuses{align-items:center}.live-layout{display:grid;grid-template-columns:1fr;grid-template-areas:"command" "workspace";gap:.9rem;align-items:start}.command-panel{grid-area:command}.board-workspace{grid-area:workspace;display:grid;grid-template-columns:1fr;gap:.9rem}.board-panel,.battle-panel{display:grid;gap:1rem}.board-workspace-lobby{grid-template-columns:1fr}.live-layout-battle .board-workspace,.live-layout-finished .board-workspace{grid-template-columns:minmax(18rem,.92fr) minmax(20rem,1.08fr);align-items:start}.panel-heading{justify-content:space-between}.self-board-layout{display:grid;gap:1rem}.self-board-layout-lobby{grid-template-columns:minmax(0,1.15fr) minmax(18rem,.85fr);align-items:start}.board-display,.lobby-tools,.enemy-intel-column{display:grid;gap:.9rem;min-width:0}.board-display-primary{grid-template-rows:auto auto}.board-wrap{display:flex;justify-content:center;overflow:auto}.board-wrap-centered{justify-content:center}.board{display:grid;width:min(100%,clamp(19rem,33vw,31rem));min-width:15rem;grid-template-columns:repeat(8,minmax(0,1fr));gap:clamp(.24rem,.42vw,.52rem)}.board-dragging{cursor:grabbing}.live-layout-lobby .board{width:min(100%,clamp(18rem,31vw,29rem))}.enemy-board,.enemy-focus-board{width:min(100%,clamp(19rem,33vw,31rem))}.cell{position:relative;width:100%;aspect-ratio:1;border-radius:14px;border:1px solid rgba(255,255,255,.08);padding:0;font-size:clamp(.92rem,1.3vw,1.15rem);font-weight:700;box-shadow:inset 0 1px #ffffff14;transition:transform .12s ease,border-color .12s ease,filter .12s ease}.cell:disabled{opacity:1;cursor:default}.cell.interactive:hover{transform:translateY(-1px);border-color:#86d3ff5c;filter:brightness(1.06)}.cell-highlighted{border-color:#83e2ff9e;box-shadow:inset 0 1px #ffffff14,0 0 0 2px #83e2ff33}.cell-dragging{cursor:grabbing}.cell-water,.cell-unknown{background:linear-gradient(180deg,#6495c229,#3a5a7d2e)}.cell-ship{background:linear-gradient(180deg,#738ba4,#49627d)}.cell-hit{background:linear-gradient(180deg,#ff9a73,#d94e47)}.cell-miss{background:linear-gradient(180deg,#dbedf838,#abc6dd38)}.cell-sunk{background:linear-gradient(180deg,#451725,#85273f)}.cell-sonar{border-color:#75daff73;box-shadow:inset 0 1px #ffffff14,0 0 0 1px #75daff2e}.cell-sonar-center{box-shadow:inset 0 1px #ffffff14,0 0 0 2px #75daff57}.cell-value{position:relative;z-index:1}.cell-overlay-label{position:absolute;right:.22rem;bottom:.22rem;min-width:1.08rem;padding:.05rem .18rem;border-radius:999px;background:#75daffe0;color:#062032;font-size:.64rem;font-weight:800;line-height:1.1}.draft-status-row{display:flex;gap:.65rem;flex-wrap:wrap}.ship-selector{gap:.55rem}.draft-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(10.75rem,1fr));gap:.7rem}.draft-catalog-tight{grid-template-columns:repeat(2,minmax(0,1fr))}.draft-card{display:grid;gap:.16rem;text-align:left;border-radius:18px;padding:.85rem .95rem}.draft-card-topline{display:flex;justify-content:space-between;gap:.75rem;align-items:flex-start}.draft-card-topline span,.draft-card>span:not(.draft-card-topline){font-size:.78rem}.draft-card-active{border-color:#83e2ff5c}.draft-card-selected,.ship-chip.selected,.size-chip-active{background:linear-gradient(180deg,#83e2ff,#4393ff);color:#081929;border-color:#83e2ff66}.draft-card-selected .draft-card-topline span,.draft-card-selected>span:not(.draft-card-topline){color:#081929c7}.panel-footer{display:flex;justify-content:space-between;gap:1rem;align-items:center;color:var(--text-soft)}.ship-roster{display:grid;gap:.5rem;margin-top:.85rem}.ship-roster-compact{grid-template-columns:repeat(auto-fit,minmax(8.4rem,1fr));margin-top:.75rem}.ship-roster-enemy-detail{grid-template-columns:1fr;margin-top:0}.ship-roster-chip{display:grid;gap:.14rem;padding:.68rem .78rem;border-radius:16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.07);color:#deecfce0}.ship-roster-chip strong{font-size:.9rem}.ship-roster-chip span{font-size:.76rem;color:#cadbedc7}.ship-roster-chip-enemy{gap:.24rem;padding:.82rem .9rem;background:linear-gradient(180deg,#ffffff0d,#ffffff08)}.ship-roster-status,.ability-hint{color:#9ee4ff}.ship-roster-chip-sunk{opacity:.62;border-color:#ff7d7d2e}.ability-hint{margin:0;font-size:.9rem}.placement-hint{color:var(--text-soft)}.enemy-stage,.enemy-focus-layout{display:grid;gap:.9rem}.enemy-target-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:.7rem}.enemy-target-strip.opponent-count-2,.enemy-target-strip.opponent-count-3{grid-template-columns:repeat(auto-fit,minmax(12rem,1fr))}.enemy-target-card{display:grid;gap:.42rem;padding:.9rem;text-align:left;border-radius:20px;border:1px solid rgba(125,174,228,.16);background:linear-gradient(180deg,#ffffff0a,#ffffff05);transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}.enemy-target-card:hover{transform:translateY(-1px);border-color:#7dd7ff66;box-shadow:0 14px 28px #02070f2e}.enemy-target-card-active{border-color:#7dd7ff94;background:linear-gradient(180deg,#3e81c342,#10233e4d);box-shadow:0 0 0 1px #7dd7ff2e}.enemy-target-subline,.enemy-target-metrics{color:var(--text-soft);font-size:.82rem}.enemy-focus-layout{grid-template-columns:minmax(0,1.18fr) minmax(18rem,.82fr);align-items:start}.enemy-card{display:grid;gap:.75rem;min-width:0;padding:1rem;border-radius:22px;background:#ffffff08;border:1px solid rgba(255,255,255,.05)}.enemy-focus-head,.enemy-intel-heading,.enemy-head{justify-content:space-between;align-items:flex-start}.enemy-focus-board-wrap,.enemy-board-wrap{width:100%}.enemy-intel-card{max-height:min(32rem,calc(100vh - 17rem));overflow:auto}.status-dot{width:.78rem;height:.78rem;border-radius:999px;display:inline-block;flex:0 0 auto}.eyebrow{margin:0 0 .32rem;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:#7dd7ff;opacity:.92}label{display:grid;gap:.45rem;color:#d9e7f6;text-align:left}.field-label{display:block;margin-bottom:.45rem;color:#d9e7f6;text-align:left}input{width:100%;border-radius:16px;border:1px solid rgba(125,174,228,.2);background:#040b16b8;color:#f2fbff;padding:.9rem 1rem;transition:border-color .14s ease,box-shadow .14s ease,background .14s ease}input::placeholder{color:#c5d6e773}input:focus{outline:none;border-color:#7dd7ff8c;box-shadow:0 0 0 4px #56aaff24;background:#06101eeb}.secondary{background:#ffffff0f}.compact button,.ship-chip{padding:.58rem .82rem}.powerup-button{display:inline-flex;align-items:center;gap:.5rem}.room-size-row{justify-content:flex-start}.room-size-row button{min-width:5.5rem;color:#e6f3ff;border-color:#a0d0ff29}.room-size-row .size-chip-active{background:linear-gradient(180deg,#9fe8ff,#2f7dff);color:#f8fcff;border-color:#9fe8ffe0;box-shadow:0 12px 24px #1d58bc57,inset 0 1px #ffffff4d;text-shadow:0 1px 1px rgba(7,24,45,.28)}.room-size-row .size-chip-active:hover{filter:brightness(1.03)}.button-text{white-space:nowrap}.cooldown-tag{border-radius:999px;padding:.16rem .42rem;background:#0711218c;border:1px solid rgba(255,255,255,.1);font-size:.74rem;color:#e9f2fac2}.cooldown-ready{color:#9ee4ff}.cooldown-offline{color:#ffb4b4}.rules-list,.log-list{margin:0;padding-left:1.1rem;color:var(--text-soft)}.rules-list{display:grid;gap:.75rem}.winner-banner,.error-text{border-radius:16px;padding:.82rem .95rem}.winner-banner{background:#ffcc5c24;color:#ffe7ac}.winner-actions{display:flex;justify-content:space-between;gap:1rem;align-items:center}.error-text{background:#ff6f9129;color:#ffd2db}.floating-error{position:sticky;bottom:.75rem;z-index:2;margin-top:.9rem;margin-left:auto;max-width:min(30rem,100%)}@media(max-width:1440px){.command-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.self-board-layout-lobby,.enemy-focus-layout,.live-layout-battle .board-workspace,.live-layout-finished .board-workspace{grid-template-columns:1fr}.enemy-intel-card{max-height:none}}@media(max-width:1120px){.hero,.setup-grid,.live-layout{grid-template-columns:1fr}.live-layout{grid-template-areas:"command" "workspace"}.command-primary,.panel-footer,.winner-actions,.hero-meta{justify-content:flex-start}}@media(max-width:820px){.app-shell{width:min(100vw - .7rem,1680px);padding-bottom:1rem}.panel,.enemy-target-card,.command-stat,.enemy-card{border-radius:22px}.hero,.setup-card,.command-panel,.board-panel,.battle-panel{padding:1rem}.command-summary-grid,.draft-catalog-tight,.enemy-target-strip,.self-board-layout-lobby{grid-template-columns:1fr}.board,.enemy-board,.enemy-focus-board,.live-layout-lobby .board{width:min(100%,24rem)}.button-row,.command-statuses,.hero-meta{gap:.55rem}.button-text{white-space:normal}.hero h1{font-size:clamp(2rem,11vw,3rem)}}@media(prefers-reduced-motion:no-preference){.panel{animation:panel-rise .42s ease both}}@keyframes panel-rise{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}