#sea-battle-app{margin:12px 0 0}.sb-game{--sb-sea:#d3e9f4;--sb-sea-2:#bedcec;--sb-line:#6f97ae;--sb-ink:#10324a;--sb-miss:#23465f;--sb-hit:#c42b1c;--sb-sunk:#7a1410;--sb-hull:linear-gradient(180deg, #b47e47, #84552b);--sb-hull-edge:#4a2c17;--sb-lab:26px;--sb-pop-ms:.32s;gap:12px;min-width:0;display:grid}.sb-topbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;display:flex}.sb-info{flex-wrap:wrap;gap:2px 16px;font-size:1.1rem;display:flex}.sb-detail{font-weight:700}.sb-rules{color:var(--muted)}.sb-note{border-left:6px solid var(--gingham);background:var(--surface-2,var(--bg));padding:4px 12px;font-weight:700}.sb-extra{border:3px solid var(--text);border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:var(--highlight-soft);border-left-width:10px;padding:6px 12px;font-weight:800}.game-status .sb-extra{margin:0 0 6px}.sb-table{min-width:0}.sb-boards{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:16px 24px;display:grid}.sb-boards.is-setup{grid-template-columns:minmax(0,560px);justify-content:center}.sb-panel{gap:8px;min-width:0;display:grid}.sb-board-title{font-family:var(--font-display);text-align:center;margin:0;font-size:1.35rem}.sb-board{grid-template-columns:var(--sb-lab) repeat(10, minmax(0, 1fr));grid-template-rows:var(--sb-lab) repeat(10, auto);background:var(--wood-bg,var(--wood));width:100%;max-width:560px;box-shadow:var(--shadow-md);border-radius:12px;gap:1px;margin:0 auto;padding:6px 6px 6px 2px;display:grid;position:relative}.sb-board.is-your-turn{box-shadow:0 0 0 4px var(--highlight), var(--shadow-md)}.sb-corner{display:block}.sb-coord{color:#fff6e6;place-items:center;font-size:.9rem;font-weight:800;line-height:1;display:grid}.sb-sq{aspect-ratio:1;background:linear-gradient(160deg, var(--sb-sea), var(--sb-sea-2));min-width:0;min-height:0;box-shadow:inset 0 0 0 1px var(--sb-line);color:var(--sb-ink);font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;border:0;border-radius:2px;place-items:center;margin:0;padding:0;display:grid;position:relative}.sb-board-fleet:not(.is-setup) .sb-sq,.sb-board-shots .sb-sq.is-miss,.sb-board-shots .sb-sq.is-hit{cursor:default}.sb-sq:focus-visible{z-index:6;outline:4px solid var(--focus);outline-offset:-2px}.sb-board-shots.is-your-turn .sb-sq:not(.is-miss):not(.is-hit):hover{background:var(--highlight-soft)}.sb-ship{z-index:1;pointer-events:none;margin:3px;position:relative}.sb-ship.is-mine{border:2px solid var(--sb-hull-edge);background:var(--sb-hull);border-radius:999px;box-shadow:inset 0 2px #ffffff40,0 2px 3px #00000059}.sb-ship.is-mine.is-sunk{background:repeating-linear-gradient(45deg,#6b4a32 0 6px,#4e3322 6px 12px)}.sb-ship.is-sunk{border:4px solid var(--sb-sunk);background-color:#7a14102e;background-image:repeating-linear-gradient(45deg,#7a141047 0 4px,#0000 4px 9px);border-radius:6px;margin:1px}.sb-ship.is-mine.is-sunk{border-radius:6px}.sb-ship.is-revealed{border:3px dashed var(--sb-ink);background:#10324a29;border-radius:999px;margin:2px}.sb-ship.is-picked{outline:4px dashed var(--highlight);outline-offset:1px;box-shadow:0 0 0 7px #10324a99}.sb-ship-tag{z-index:4;pointer-events:none;place-items:center;min-width:0;display:grid;position:relative;overflow:visible}.sb-ship-tag.sb-ship-h{align-items:end}.sb-ship-tag.sb-ship-h .sb-ship-label{translate:0 40%}.sb-ship-tag.sb-ship-v{justify-items:end}.sb-ship-tag.sb-ship-v .sb-ship-label{translate:40%}.sb-ship-label{background:var(--sb-sunk);color:#fff;white-space:nowrap;border-radius:999px;padding:0 5px;font-size:.78rem;font-weight:800;line-height:1.3}.sb-ship-tag.is-revealed .sb-ship-label{background:var(--sb-ink)}.sb-ship-v .sb-ship-label{writing-mode:vertical-rl;padding:5px 0}.sb-mark{z-index:2;pointer-events:none;display:block;position:relative}.sb-miss{aspect-ratio:1;background:var(--sb-miss);border:2px solid #fff;border-radius:50%;width:28%}.sb-hit{aspect-ratio:1;width:78%}.sb-hit:before,.sb-hit:after{content:"";background:var(--sb-hit);border:1.5px solid #fff;border-radius:3px;width:100%;height:26%;position:absolute;top:50%;left:50%;translate:-50% -50%;box-shadow:0 0 0 1px #500a0599}.sb-hit:before{rotate:45deg}.sb-hit:after{rotate:-45deg}.sb-mark.is-new{animation:sb-pop var(--sb-pop-ms) ease-out both}@keyframes sb-pop{0%{opacity:0;scale:1.8}}.reduce-motion .sb-mark{animation:none!important}.sb-sq.is-last:after{content:"";z-index:3;box-shadow:inset 0 0 0 4px var(--highlight), inset 0 0 0 6px var(--sb-ink);pointer-events:none;border-radius:2px;position:absolute;inset:0}.sb-sq.is-aimed{background:var(--highlight-soft)}.sb-aim{z-index:2;aspect-ratio:1;border:3px solid var(--sb-ink);background:linear-gradient(var(--sb-ink), var(--sb-ink)) center / 3px 100% no-repeat, linear-gradient(var(--sb-ink), var(--sb-ink)) center / 100% 3px no-repeat;pointer-events:none;border-radius:50%;place-items:center;width:76%;display:grid;position:relative}.sb-aim-n{background:var(--highlight);color:var(--sb-ink);border-radius:999px;padding:0 4px;font-size:.8rem;font-weight:800;line-height:1.2}.sb-sq.is-hint{outline:4px dashed var(--sb-ink);outline-offset:-4px}.sb-tag{z-index:5;border:2px solid var(--sb-ink);background:var(--highlight);color:var(--sb-ink);pointer-events:none;border-radius:999px;padding:0 4px;font-size:.72rem;font-weight:800;line-height:1.2;position:absolute;top:-2px;left:50%;translate:-50% -50%}.sb-fleet h3{flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:4px 0 6px;font-size:1.15rem;display:flex}.sb-left{color:var(--muted);font-size:1rem;font-weight:600}.sb-fleet ul{flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none;display:flex}.sb-fleet-item{border:2px solid var(--border);background:var(--surface);border-radius:999px;align-items:center;gap:6px;padding:3px 8px;font-size:1.05rem;display:inline-flex}.sb-fleet-item.is-sunk{border-color:var(--sb-sunk);background:#f8e3df}.sb-fleet-item.is-sunk .sb-fleet-name{text-decoration:line-through;text-decoration-thickness:2px}.sb-badge{border:2px solid var(--text);background:var(--surface-2);white-space:nowrap;border-radius:999px;padding:0 7px;font-size:.85rem;font-weight:800}.is-sunk .sb-badge{border-color:var(--sb-sunk);background:var(--sb-sunk);color:#fff}.sb-pegs{gap:2px;display:inline-flex}.sb-peg{border:2px solid var(--sb-hull-edge);background:#c79761;border-radius:2px;width:11px;height:11px}.sb-peg.is-hit{border-color:var(--sb-sunk);background:var(--sb-hit)}.sb-legend{flex-wrap:wrap;justify-content:center;gap:6px 18px;font-size:1.05rem;display:flex}.sb-key{align-items:center;gap:6px;display:inline-flex}.sb-key-sq{background:var(--sb-sea);width:30px;height:30px;box-shadow:inset 0 0 0 1px var(--sb-line);border-radius:3px;place-items:center;display:inline-grid;position:relative}.sb-key-sunk{box-shadow:inset 0 0 0 3px var(--sb-sunk);background:#7a14102e}.sb-key-last{box-shadow:inset 0 0 0 4px var(--highlight), inset 0 0 0 6px var(--sb-ink)}.sb-controls{gap:10px;display:grid}.sb-buttons{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.sb-buttons .btn{flex:auto;max-width:360px;min-height:56px}.sb-setup{gap:10px;display:grid}.sb-ships{flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.sb-ship-btn{border:3px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);min-height:56px;color:var(--text);font:inherit;cursor:pointer;align-items:center;gap:8px;padding:6px 14px;font-size:1.1rem;font-weight:700;display:inline-flex}.sb-ship-btn.is-placed{background:var(--surface-2)}.sb-ship-btn.is-selected{border-color:var(--text);background:var(--highlight-soft);box-shadow:0 0 0 4px var(--highlight)}.sb-ship-btn:focus-visible,.sb-tab:focus-visible{outline:4px solid var(--focus);outline-offset:2px}.sb-tabs{display:none}.sb-tab{border:3px solid var(--primary);background:var(--surface);min-height:52px;color:var(--primary);font:inherit;cursor:pointer;flex:1 1 0;padding:4px 8px;font-weight:800}.sb-tab:first-child{border-radius:var(--radius) 0 0 var(--radius)}.sb-tab:last-child{border-radius:0 var(--radius) var(--radius) 0}.sb-tab.is-active{background:var(--primary);color:var(--on-primary);text-underline-offset:4px;text-decoration:underline}.sb-settings .text-input{width:100%;max-width:320px;margin:4px 0 10px;display:block}@media (width<=767px){.sb-game{--sb-lab:20px}.sb-info{font-size:1rem}.sb-tabs{display:flex}.sb-boards,.sb-boards.is-setup{grid-template-columns:minmax(0,1fr)}.sb-boards[data-tab=shots] .sb-panel-fleet,.sb-boards[data-tab=fleet] .sb-panel-shots,.sb-legend{display:none}.sb-board-title{font-size:1.1rem}.sb-board{border-radius:8px;width:calc(100% + 16px);max-width:none;margin:0 -8px;padding:3px 3px 3px 0}.sb-coord{font-size:.75rem}.sb-ship-label{font-size:.68rem}.sb-fleet h3{font-size:1.05rem}.sb-fleet-item{padding:2px 6px;font-size:.95rem}.sb-pegs{display:none}.sb-ships{overscroll-behavior-x:contain;flex-wrap:nowrap;justify-content:flex-start;padding:4px 4px 6px;overflow-x:auto}.sb-ship-btn{flex:none;min-height:52px;padding:4px 10px;font-size:1rem}.sb-buttons{gap:8px}.sb-buttons .btn{flex:40%;padding:6px 10px}.play-dock .is-docked .sb-extra{border-width:2px 2px 2px 6px;padding:2px 8px;display:block;margin:0 0 2px!important}}