*{box-sizing:border-box}
body{margin:0;font-family:Tahoma,Arial,sans-serif;background:linear-gradient(145deg,#071827,#0d2b40);color:#eef8ff}
button,select{font:inherit}.bs-page{min-height:100vh;padding:24px 14px;display:flex;justify-content:center}.bs-card{width:min(1120px,100%);background:rgba(8,25,39,.94);border:1px solid rgba(121,190,220,.18);border-radius:24px;padding:22px;box-shadow:0 20px 60px rgba(0,0,0,.3);position:relative}.bs-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:18px}.bs-kicker{color:#66c9ff;font-size:13px;font-weight:800}.bs-header h1{margin:5px 0 8px;font-size:28px}.bs-header p,.bs-panel p{color:#a9c1d0;margin:0;line-height:1.7}.bs-turn{background:#123b54;border:1px solid #2b6b8f;padding:10px 15px;border-radius:12px;font-weight:800;white-space:nowrap}.bs-panel{margin-top:18px;background:rgba(255,255,255,.035);border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:18px}.bs-panel-head{display:flex;justify-content:space-between;gap:15px;align-items:center}.bs-panel h2{margin:0 0 5px}.bs-panel h3{margin:0 0 10px}.bs-setup-actions,.bs-actions{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.bs-btn{border:1px solid #3d6d85;background:#16384c;color:#fff;border-radius:11px;padding:10px 14px;cursor:pointer;font-weight:800}.bs-btn:hover{filter:brightness(1.12)}.bs-primary{background:#0b83c2;border-color:#37b7ef}.bs-btn:disabled{opacity:.45;cursor:not-allowed}.bs-fleet{display:flex;gap:9px;flex-wrap:wrap;margin:18px 0}.fleet-item{padding:9px 12px;border-radius:10px;border:1px solid #31576c;background:#102b3c;cursor:pointer}.fleet-item.selected{border-color:#54c8ff;box-shadow:0 0 0 2px rgba(84,200,255,.14)}.fleet-item.done{opacity:.45;text-decoration:line-through}.bs-board-wrap{display:flex;justify-content:center}.bs-boards{display:grid;grid-template-columns:1fr 1fr;gap:28px;justify-items:center}.bs-boards>div{width:min(100%,430px)}.bs-board{display:grid;grid-template-columns:repeat(10,1fr);width:min(430px,90vw);aspect-ratio:1;border:3px solid #3c718c;border-radius:12px;overflow:hidden;background:#0b4969;box-shadow:0 10px 30px rgba(0,0,0,.25)}.bs-cell{position:relative;border:1px solid rgba(255,255,255,.11);background:#0e5b80;cursor:pointer;display:flex;align-items:center;justify-content:center;min-width:0}.bs-cell:hover{background:#14739c}.setup-wrap .bs-cell.ship{background:#56717e}.setup-wrap .bs-cell.preview{background:#2b91b5}.setup-wrap .bs-cell.invalid{background:#9d3940}.bs-cell.miss{background:#143c52;cursor:default}.bs-cell.miss:after{content:"•";font-size:25px;color:#8bb2c4}.bs-cell.hit{background:#9b3f3f;cursor:default}.bs-cell.hit:after{content:"✕";font-size:21px;color:#fff;font-weight:900}.bs-cell.shiphit{background:#bd5145}.bs-cell.sunk{background:#6f2525}.bs-cell.hidden-ship{background:#0e5b80}.bs-cell.targetable{box-shadow:inset 0 0 0 2px rgba(110,222,255,.25)}.bs-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:20px}.bs-stats div{background:#0d2d40;border-radius:12px;padding:10px;text-align:center}.bs-stats span{display:block;color:#8fb0c0;font-size:12px;margin-bottom:4px}.bs-stats strong{font-size:16px}.bs-note{font-size:12px!important;margin-bottom:9px!important}.bs-message{text-align:center;margin:18px 0;padding:12px;border-radius:12px;background:#0d2d40;font-weight:800}.bs-message.good{background:#164e3b;color:#9df0c7}.bs-message.bad{background:#562e32;color:#ffc1c6}.bs-actions{justify-content:space-between}.bs-actions label{display:flex;gap:8px;align-items:center;color:#a9c1d0}.bs-actions select{background:#102d3e;color:#fff;border:1px solid #376177;border-radius:9px;padding:8px}.bs-overlay[hidden]{display:none}.bs-overlay{position:fixed;inset:0;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:20px;z-index:20}.bs-result{width:min(430px,100%);text-align:center;background:#092235;border:1px solid #39718d;border-radius:20px;padding:28px;box-shadow:0 20px 70px #000}.bs-result>div{font-size:50px}.bs-result h2{margin:10px 0}.bs-result p{color:#abc3d0;line-height:1.7}@media(max-width:760px){.bs-header,.bs-panel-head{flex-direction:column}.bs-boards{grid-template-columns:1fr}.bs-stats{grid-template-columns:repeat(2,1fr)}.bs-card{padding:15px}.bs-header h1{font-size:22px}.bs-board{width:min(430px,92vw)}}
