:root{--bg: #0e111b;--surface: #171c2b;--surface-hover: #1e2437;--border: #262d42;--text: #eef1f7;--muted: #9aa3b8;--accent: #35d0ba;--accent-text: #062b25;--coral: #ff5d73;--coral-text: #3a0710;--gold: #ffd166;--sea-1: #0f2340;--sea-2: #123058;--sea-line: #1d4170;--foam: #8fd3ff;--sunk: #6b7590;--ship: #c9d4ea;--ship-2: #a6b4d2;--ship-edge: #8796b8;--radius: 14px;color-scheme:dark}@media(prefers-color-scheme:light){:root:not([data-theme=dark]){--bg: #eef2f8;--surface: #ffffff;--surface-hover: #e7edf6;--border: #cfd8e6;--text: #172036;--muted: #59647c;--accent: #138a77;--accent-text: #ffffff;color-scheme:light}}:root[data-theme=light]{--bg: #eef2f8;--surface: #ffffff;--surface-hover: #e7edf6;--border: #cfd8e6;--text: #172036;--muted: #59647c;--accent: #138a77;--accent-text: #ffffff;color-scheme:light}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}button,select,input{font:inherit;color:inherit}button{cursor:pointer}a{color:inherit}h1,h2,p{margin:0}:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.app{max-width:480px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}.screen{flex:1;min-height:0;display:flex;flex-direction:column;padding:max(10px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.scroll{flex:1;display:flex;flex-direction:column;gap:10px}.scroll.center,.center{text-align:center}.scroll.center{justify-content:center}.muted{color:var(--muted)}.small{font-size:13px}.big{font-size:22px;font-weight:700}.spacer{flex:1}.topbar{display:flex;align-items:center;gap:10px;min-height:48px;margin-bottom:6px}.topbar h1{flex:1;font-size:17px;font-weight:650;line-height:1.2}.topbar h1 small{display:block;font-size:12px;font-weight:500;color:var(--muted)}.topbar-actions{min-width:44px}.icon-button{width:44px;height:44px;flex:none;border-radius:12px;border:1px solid var(--border);background:var(--surface);display:grid;place-items:center;text-decoration:none;font-size:22px}.icon-button svg,.btn svg,.mode .ico svg{width:20px;height:20px}.btn,.button{min-height:52px;width:100%;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);padding:10px 18px;font-size:16px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;touch-action:manipulation}.btn:active,.button:active{background:var(--surface-hover);transform:scale(.99)}.btn:disabled{opacity:.45;cursor:default}.btn.primary,.button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-text)}.btn.ghost{background:transparent}.button.danger{color:var(--coral)}.button.small{min-height:40px;width:auto;font-size:14px}.link{background:none;border:0;color:var(--accent);font-weight:600;min-height:40px}.legal-links{margin:0;line-height:1.8}.row{display:flex;gap:10px}.row>*{flex:1}.bottom-bar{margin-top:auto;padding-top:12px;display:flex;gap:10px}.bottom-bar.column{flex-direction:column}.hero{text-align:center;padding:12px 0 14px}.hero-art{width:120px;height:84px}.hero h1{margin:6px 0 2px;font-size:32px;letter-spacing:.5px}.hero h1 span{color:var(--foam)}:root[data-theme=light] .hero h1 span{color:#2a7fc0}.hero p{color:var(--muted);font-size:15px}.menu-list{display:flex;flex-direction:column;gap:10px}.mode{display:flex;align-items:center;gap:14px;text-align:left;width:100%;min-height:68px;padding:12px 14px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface)}.mode b{display:block;font-size:16px}.mode small{color:var(--muted);font-size:13px}.mode .ico{width:44px;height:44px;flex:none;border-radius:12px;display:grid;place-items:center;background:var(--sea-2);color:var(--foam)}.mode.featured{flex-direction:column;align-items:stretch;gap:10px;background:linear-gradient(135deg,#14335c,#12284a);border-color:#24508a;color:#eef1f7}.mode.featured small{color:#9aa3b8}.mode-head{display:flex;align-items:center;gap:14px}.join{display:flex;gap:8px}.join input{flex:1;min-width:0;min-height:48px;padding:0 14px;border-radius:12px;border:1px solid #262d42;background:#0e111b;color:#eef1f7;font:inherit;font-size:17px;letter-spacing:.12em;text-transform:uppercase}.join input::placeholder{color:#6b7590;letter-spacing:normal;text-transform:none}.join input[aria-invalid=true]{border-color:var(--coral)}.join .btn{width:auto;min-height:48px;border-color:#262d42;background:#0e111b;color:#eef1f7}.mode.featured p{margin:0;color:#9aa3b8}.seg{display:flex;gap:3px;padding:3px;border-radius:12px;border:1px solid #262d42;background:#0e111b}.seg button{flex:1;min-height:40px;border:0;border-radius:9px;background:transparent;color:#9aa3b8;font-size:14px;font-weight:600}.seg button.on{background:var(--sea-2);color:#eef1f7}.seg button:disabled{opacity:.5;font-size:12px;cursor:default}.account-hint{margin-top:6px;padding:10px 14px;border-radius:var(--radius);border:1px dashed var(--border);color:var(--muted);font-size:14px;text-align:left}.account-hint .row{align-items:center;margin-top:6px}.account-hint .row>*{flex:none}.board{display:grid;grid-template-columns:18px repeat(10,1fr);grid-template-rows:18px repeat(10,1fr);gap:2px;width:100%;aspect-ratio:1 / 1;touch-action:manipulation;user-select:none;-webkit-user-select:none}.place-board{touch-action:none}.board .lab{font-size:10px;color:var(--muted);display:grid;place-items:center}.cell{position:relative;display:grid;place-items:center;padding:0;min-width:0;border-radius:5px;border:1px solid var(--sea-line);background:linear-gradient(160deg,var(--sea-2),var(--sea-1))}button.cell:hover{filter:brightness(1.15)}.cell.ship{background:linear-gradient(160deg,var(--ship),var(--ship-2));border-color:var(--ship-edge)}.cell.ship.h-start{border-radius:10px 4px 4px 10px}.cell.ship.h-end{border-radius:4px 10px 10px 4px}.cell.ship.v-start{border-radius:10px 10px 4px 4px}.cell.ship.v-end{border-radius:4px 4px 10px 10px}.cell.miss:after,.cell.water:after{content:"";width:26%;height:26%;border-radius:50%;background:var(--foam);opacity:.75}.cell.water:after{opacity:.3}.cell.hit{background:linear-gradient(160deg,#ff7a8c,#e2475d);border-color:#ff9aa8}.cell.hit:after,.cell.sunk:after{content:"";width:56%;height:56%;background:linear-gradient(45deg,transparent 42%,var(--coral-text) 42%,var(--coral-text) 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,var(--coral-text) 42%,var(--coral-text) 58%,transparent 58%)}.cell.sunk{background:var(--sunk);border-color:#8a93ab}.cell.sunk:after{background:linear-gradient(45deg,transparent 42%,#262b3b 42%,#262b3b 58%,transparent 58%),linear-gradient(-45deg,transparent 42%,#262b3b 42%,#262b3b 58%,transparent 58%)}.cell.target{outline:3px solid var(--accent);outline-offset:1px;z-index:1}.cell.target:before{content:"";position:absolute;inset:22%;border:2px solid var(--accent);border-radius:50%}.cell.ghost-ok{background:#35d0ba73;border-color:var(--accent)}.cell.ghost-bad{background:#ff5d7366;border-color:var(--coral)}:root[data-motion=on] .cell.hit,:root[data-motion=on] .cell.miss,:root[data-motion=on] .cell.sunk{animation:splash .3s ease-out}@keyframes splash{0%{transform:scale(.6)}to{transform:scale(1)}}.board.waiting button.cell{cursor:default}.board.mini{grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);gap:1px}.board.mini .cell{border-radius:2px}.board-label{display:flex;justify-content:space-between;align-items:baseline;margin:6px 2px;font-size:13px;color:var(--muted)}.board-label b{color:var(--text);font-size:14px}.board-label.center{justify-content:center}.coord{font-variant-numeric:tabular-nums}.tray{display:flex;flex-wrap:wrap;gap:8px}.tray button{min-height:44px;padding:6px 10px;border-radius:12px;border:1px solid var(--border);background:var(--surface);display:flex;align-items:center;gap:8px;font-size:13px}.tray button.sel{border-color:var(--accent);background:#35d0ba1f}.tray button.placed{opacity:.55}.pips{display:flex;gap:2px}.pips i{width:10px;height:10px;border-radius:2px;background:var(--ship)}.help{min-height:40px;margin:8px 2px;color:var(--muted);font-size:13px}.status{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface)}.status .dot{width:10px;height:10px;flex:none;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px #35d0ba33}.status.wait .dot{background:var(--muted);box-shadow:none}.status .msg{flex:1;font-weight:600}.status .sub{color:var(--muted);font-size:14px}.toast,.ai-toast{min-height:22px;margin:6px 0 0;text-align:center;font-weight:650;font-size:15px}.ai-toast{margin:4px 0 0;font-size:12px;text-align:left}.toast.hit,.ai-toast.hit{color:var(--coral)}.toast.miss,.ai-toast.miss{color:var(--foam)}:root[data-theme=light] .toast.miss{color:#2a7fc0}.toast.sunk,.ai-toast.sunk{color:var(--gold)}:root[data-theme=light] .toast.sunk{color:#a06a00}.lower{display:grid;grid-template-columns:150px 1fr;gap:12px;align-items:start;margin-top:6px}.fleet-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.fleet-list li{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}.fleet-list .pips i{width:11px;height:11px}.fleet-list li.down{text-decoration:line-through;opacity:.55}.fleet-list li.down .pips i{background:var(--sunk)}@media(max-height:740px){.play .enemy .board{width:min(100%,calc(100dvh - 300px));margin:0 auto}.lower{grid-template-columns:110px 1fr}.fleet-list{gap:3px}}@media(min-width:900px)and (pointer:fine){.app:has(.play){max-width:980px}.play-boards{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}.play .lower{grid-template-columns:1fr}}.result .scroll{text-align:center}.trophy{width:76px;height:76px;margin:6px auto 0;display:block}.result h1{font-size:30px}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:6px 0}.stats.five{grid-template-columns:repeat(3,1fr)}.stat{padding:12px 6px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);text-align:center}.stat b{display:block;font-size:22px;font-variant-numeric:tabular-nums}.stat small{color:var(--muted);font-size:12px}.reveal .board{max-width:190px;margin:0 auto}.label{margin:14px 0 4px;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}.recent{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}.recent li{display:grid;grid-template-columns:1fr 1fr 1.2fr 1fr .8fr;gap:6px;font-size:13px;padding:8px 10px;border-radius:10px;background:var(--surface);border:1px solid var(--border)}.recent .won{color:var(--accent);font-weight:600}.setting{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:8px 12px;border-radius:12px;border:1px solid var(--border);background:var(--surface)}.setting small{display:block;color:var(--muted);font-size:12px}.setting input[type=checkbox]{width:22px;height:22px;flex:none;accent-color:var(--accent)}.setting select{padding:6px 8px;border-radius:8px;border:1px solid var(--border);background:var(--surface-hover)}.benefits{margin:4px 0;padding-left:20px;line-height:1.7}.consent{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:10;max-width:456px;margin:0 auto;padding:14px;border-radius:14px;border:1px solid var(--border);background:var(--surface);box-shadow:0 12px 30px #00000059;font-size:14px}.consent .row{margin-top:10px}.consent .button{min-height:44px}@media(prefers-reduced-motion:reduce){*{animation:none!important}}@media(min-width:900px)and (pointer:fine){.play .own .board{max-width:300px}}html.away .pl-info,html.away .pl-lang-hint{display:none}.pl-info{color:var(--text);border-top:1px solid var(--border)}.pl-info a{color:var(--accent)}.duel-code{margin:8px 0;font:700 clamp(34px,11vw,48px) / 1.1 ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;letter-spacing:.18em;color:var(--accent);user-select:all}.ready-board{width:min(70vw,260px);margin:8px auto}.duel-list ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}.duel-list li{display:flex;align-items:stretch;gap:8px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface)}.duel-list li.your-turn{border-color:var(--accent)}.duel-open{flex:1;min-width:0;min-height:56px;padding:8px 14px;border:0;background:none;color:inherit;text-align:left;font:inherit}.duel-open b,.duel-open small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.duel-open small{color:var(--muted);font-size:13px}.your-turn .duel-open small{color:var(--accent);font-weight:600}.btn.duel-quit{width:auto;min-height:0;margin:8px;padding:6px 12px;font-size:14px}.share-note{position:fixed;top:calc(env(safe-area-inset-top,0px) + 64px);right:16px;z-index:20;margin:0;padding:8px 14px;border-radius:999px;border:1px solid var(--border);background:var(--surface);font-size:14px;font-weight:650}