@import"https://fonts.googleapis.com/css2?family=DM+Mono&family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,600&display=swap";:root{font-family:DM Sans;color:#eaf4f5;background:#061827;--line:#32627366;--gold:#e6c67d;--mute:#91a9b0}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% -20%,#176080,#09283c 35%,#061827 75%);min-height:100vh}button{font:inherit;color:inherit;cursor:pointer}.app{max-width:1560px;margin:auto;padding:25px 42px}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:20px}header a{color:#fff;text-decoration:none;font:25px Playfair Display}header a:first-letter{color:var(--gold)}header span{font:10px DM Mono;letter-spacing:1px;border:1px solid var(--line);border-radius:20px;padding:9px 14px}header button{border:0;background:none;color:var(--gold);font-size:20px}.hero{text-align:center;padding:58px 0 40px}.hero p,.panel>p{font:10px DM Mono;letter-spacing:2px;color:var(--gold)}.hero h1{font:600 clamp(46px,6vw,80px)/1 "Playfair Display";letter-spacing:-3px;margin:0 0 16px}.hero i{color:#9dd5d3}.hero span{color:var(--mute);font-size:15px}.layout{display:grid;grid-template-columns:218px minmax(560px,1fr) 218px;gap:28px}.panel{background:#0c2c3eb8;border:1px solid var(--line);border-radius:14px;padding:19px}.panel>p{margin:0 0 18px}.panel p small{float:right;color:var(--mute);letter-spacing:0}.ship{width:100%;border:1px solid transparent;background:transparent;padding:9px 7px;border-radius:7px;text-align:left;font-size:12px;display:grid;grid-template-columns:45px 1fr 30px;align-items:center}.ship span{color:#82c6ca;font-family:DM Mono;letter-spacing:-2px}.ship small{font-size:10px;color:var(--mute)}.ship.selected,.ship:hover{border-color:#377488;background:#123c51}.ship.placed{opacity:.4}.fleet>div:nth-last-child(2){display:flex;gap:6px;margin-top:15px}.fleet>div:nth-last-child(2) button,.intel button{border:1px solid var(--line);background:transparent;border-radius:7px;padding:9px 7px;font-size:10px;flex:1}.primary{margin-top:12px;width:100%;padding:11px;border:0;border-radius:7px;background:var(--gold);color:#142b35;font-weight:700;font-size:12px}.primary:disabled{opacity:.35}.boards{display:grid;grid-template-columns:1fr 28px 1fr;gap:15px;align-items:center}.boards h2{font-size:14px;margin:0 0 13px}.boards h2 b{font:10px DM Mono;color:var(--gold);margin-right:7px}.boards h2 small{float:right;color:var(--mute);font:10px DM Sans}.boards>em{font:10px DM Mono;color:var(--gold);text-align:center}.board{display:grid;grid-template-columns:repeat(10,1fr);aspect-ratio:1;border:1px solid #2d6070;background:repeating-linear-gradient(0deg,transparent 0 calc(10% - 1px),#8fcacd1a calc(10% - 1px) 10%),repeating-linear-gradient(90deg,transparent 0 calc(10% - 1px),#8fcacd1a calc(10% - 1px) 10%),#0a3044}.cell{padding:0;background:transparent;border:1px solid #8fcacd0b;color:#fff;font-size:14px}.player .cell:hover,.board:not(.locked) .cell:hover{background:#e6c67d33}.ship:before{content:"";display:block;margin:auto;width:60%;height:60%;background:#7dc5c6;border-radius:2px;box-shadow:0 0 8px #6ebec0}.cell.hit{background:#b6524c}.cell.miss{color:#8ab8bd;font-size:18px}.turn{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:16px 0;margin-bottom:15px}.turn small{display:block;color:var(--mute);font-size:10px;margin-top:4px}.intel ol{padding-left:16px;min-height:140px;color:#b6c9cc;font-size:11px;line-height:1.6}.score{border-top:1px solid var(--line);padding-top:14px;display:flex;gap:28px;font:9px DM Mono;color:var(--mute)}.score b{display:block;color:var(--gold);font:26px Playfair Display}#toast{position:fixed;left:50%;bottom:25px;transform:translate(-50%,20px);opacity:0;background:var(--gold);color:#142b35;padding:11px 17px;border-radius:8px;font-size:12px;font-weight:700;transition:.25s}#toast.show{opacity:1;transform:translate(-50%)}@media(max-width:1100px){.layout{grid-template-columns:190px 1fr}.intel{grid-column:1/-1}.intel ol{min-height:70px}}@media(max-width:720px){.app{padding:18px}.layout{display:flex;flex-direction:column}.panel,.boards{width:100%}.boards{grid-template-columns:1fr}.boards>em{display:none}.hero{padding:42px 0 28px}.ship{display:inline-grid;width:50%}}.ship{grid-template-columns:52px minmax(0,1fr) auto;gap:7px}.ship-preview{display:flex;align-items:center;gap:2px;height:16px}.ship-preview i{display:block;flex:1;height:8px;min-width:5px;background:linear-gradient(180deg,#a8e0df,#5faeb4);border-radius:2px;box-shadow:0 1px 5px #6ebec088}.ship-preview i:first-child{border-radius:5px 2px 2px 5px}.ship-preview i:last-child{border-radius:2px 5px 5px 2px}.ship-name{min-width:0;white-space:nowrap}.ship-name small{display:block}#rotate{display:flex;align-items:center;justify-content:center;gap:6px}.rotate-icon{width:12px;height:12px;display:inline-block;border:1.5px solid currentColor;border-left-color:transparent;border-radius:50%;position:relative;transform:rotate(-35deg)}.rotate-icon:after{content:"";position:absolute;right:-3px;top:-2px;width:0;height:0;border-left:4px solid currentColor;border-top:3px solid transparent;border-bottom:3px solid transparent}.ship:before{content:none}.board .cell.ship{position:relative}.board .cell.ship:before{content:"";position:absolute;display:block;top:20%;right:0;bottom:20%;left:0;background:linear-gradient(180deg,#a8e0df,#5faeb4);box-shadow:0 1px 6px #6ebec088;z-index:1}.board .cell.ship.bow-h:before{border-radius:7px 1px 1px 7px}.board .cell.ship.stern-h:before{border-radius:1px 7px 7px 1px}.board .cell.ship.bow-v:before{border-radius:7px 7px 1px 1px}.board .cell.ship.stern-v:before{border-radius:1px 1px 7px 7px}.board .cell.hit{z-index:2}.board .cell.hit:before{background:#b6524c}.board{width:100%;min-width:0;aspect-ratio:1 / 1;grid-template-columns:repeat(10,minmax(0,1fr));grid-template-rows:repeat(10,minmax(0,1fr));overflow:hidden}.board .cell{min-width:0;min-height:0;width:100%;height:100%;aspect-ratio:auto;line-height:1}.lucide{width:16px;height:16px;stroke-width:1.8;vertical-align:middle}.brand-icon{color:var(--gold);width:23px;height:23px;margin-right:7px;vertical-align:-4px}header button .lucide{width:20px;height:20px}.fleet button .lucide{width:14px;height:14px}.primary .lucide{margin-left:7px;vertical-align:-3px}.placed-icon{color:var(--gold);justify-self:end}.board:not(.locked) .cell:hover{background:#e6c67d3d;box-shadow:inset 0 0 0 2px var(--gold);z-index:3}.board .cell.miss,.board .cell.hit{font-size:0;position:relative}.board .cell.miss:after{content:"";position:absolute;width:36%;height:36%;border:2px solid #b4e4e5;border-radius:50%;left:32%;top:32%;box-shadow:0 0 8px #b4e4e577}.board .cell.hit:after{content:"";position:absolute;z-index:3;left:50%;top:50%;width:44%;height:2px;background:#fff;transform:translate(-50%,-50%) rotate(45deg);box-shadow:0 0 0 1px #fff,0 0 10px #fff}.board .cell.hit:before{z-index:1}.board .cell.last-shot{box-shadow:inset 0 0 0 2px var(--gold),0 0 12px #e6c67d88;z-index:4}.board .cell.last-shot:focus{outline:none}.mobile-nav{display:none}.board .cell.miss:after{box-sizing:border-box;width:38%;height:auto;aspect-ratio:1;left:50%;top:50%;transform:translate(-50%,-50%)}@media(max-width:700px){body{padding-bottom:76px}.layout{display:block}.mobile-nav{position:fixed;z-index:20;display:grid;grid-template-columns:repeat(4,1fr);gap:2px;left:0;right:0;bottom:0;padding:7px 8px max(7px,env(safe-area-inset-bottom));background:#082638f2;border-top:1px solid var(--line);box-shadow:0 -8px 24px #03101c88}.mobile-nav button{border:0;background:transparent;color:var(--mute);font-size:9px;line-height:1.15;padding:5px 2px;display:grid;justify-items:center;gap:3px}.mobile-nav .lucide{width:18px;height:18px}.mobile-nav button.active{color:var(--gold)}.mission-panel,.player-wrap,.enemy-wrap,.log-panel,.boards{display:none}[data-mobile-view=mission] header.mission-panel{display:flex}[data-mobile-view=mission] .hero.mission-panel,[data-mobile-view=mission] .fleet.mission-panel,[data-mobile-view=player] .boards,[data-mobile-view=enemy] .boards,[data-mobile-view=player] .player-wrap,[data-mobile-view=enemy] .enemy-wrap,[data-mobile-view=log] .log-panel{display:block}.boards h2{margin-top:0}.board{max-width:none}.intel{min-height:0}}@media(max-width:700px){header.mission-panel{display:flex}}@media(max-width:700px){.mobile-nav{grid-template-columns:repeat(3,1fr)}.hero.mission-panel{display:none!important}[data-mobile-view=player] .fleet.mission-panel,[data-mobile-view=player] .boards,[data-mobile-view=player] .player-wrap{display:block}.in-game[data-mobile-view=player] .fleet.mission-panel{display:none}.in-game[data-mobile-view=player] .boards{margin-top:14px}}.board .cell.hit.sunk:after{width:48%;height:48%;background:linear-gradient(45deg,transparent 44%,#fff 45%,#fff 55%,transparent 56%),linear-gradient(-45deg,transparent 44%,#fff 45%,#fff 55%,transparent 56%);box-shadow:0 0 9px #fff;transform:translate(-50%,-50%)}