.ss-game{--navy:#0b2638;--sea:#0c6687;--foam:#d8f5ff;max-width:1100px;margin:1.5rem auto;padding:clamp(14px,3vw,30px);border-radius:24px;background:linear-gradient(145deg,#e9f0f2,#cfdde2);box-shadow:0 20px 50px #0c26352a;color:#102530;}
.ss-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:14px}.ss-header h2{margin:0;color:#0a2b3d}.ss-kicker{margin:0 0 4px;color:#47717f}.ss-subtitle{margin:.35rem 0 0;color:#4b6570}.ss-btn{border:1px solid #8ba7b1;background:#eef4f6;color:#153746;border-radius:12px;padding:.7rem 1rem;cursor:pointer}.ss-btn-primary{background:#153e56;color:#fff;border-color:#153e56}.ss-btn-secondary{white-space:nowrap}.ss-btn:active{transform:translateY(1px)}
.ss-status{margin:12px 0 18px;padding:12px 15px;border-left:4px solid #2f7997;background:#f6fbfc;border-radius:8px;}.ss-setup{margin-bottom:18px}.ss-fleet-panel{background:#f8fbfc;border:1px solid #b8cdd5;border-radius:18px;padding:16px}.ss-fleet-panel h3{margin:0 0 4px}.ss-fleet-panel p{margin:.25rem 0 1rem;color:#50656e}.ss-fleet{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px}.ss-fleet-ship{display:flex;align-items:center;gap:10px;text-align:left;border:1px solid #a9bcc3;border-radius:12px;background:#fff;padding:9px;cursor:pointer}.ss-fleet-ship strong,.ss-fleet-ship small{display:block}.ss-fleet-ship small{color:#657a83}.ss-fleet-ship.is-selected{outline:3px solid #2f799755}.ss-fleet-ship.is-placed{opacity:.5}.ss-setup-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ss-mini-ship{display:inline-block;height:16px;min-width:42px;border-radius:60% 18% 18% 60%/55%;background:linear-gradient(#9ba8ad,#536269 55%,#303b40);box-shadow:inset 0 2px #dfe8eb,0 3px 5px #223c472c;position:relative}.ss-mini-2{width:42px}.ss-mini-3{width:54px}.ss-mini-4{width:66px}.ss-mini-5{width:78px}.ss-mini-ship:after{content:"";position:absolute;left:42%;top:-4px;width:16%;height:6px;border-radius:3px;background:#5e6c72;box-shadow:8px 2px 0 -1px #77858a}
.ss-battlefields{display:grid;grid-template-columns:1fr 1fr;gap:20px}.ss-sea-card{border-radius:20px;padding:14px;background:linear-gradient(160deg,#143f52,#092c3f);box-shadow:0 12px 28px #071f2d36,inset 0 1px #ffffff22}.ss-sea-title{display:flex;justify-content:space-between;align-items:baseline;color:#fff;padding:0 4px 10px;}.ss-sea-title small{color:#9dc8d8}.ss-grid-shell{position:relative;padding:22px 0 0 24px}.ss-grid{aspect-ratio:1;display:grid;grid-template-columns:repeat(10,1fr);grid-template-rows:repeat(10,1fr);border:1px solid #bce9f555;background:radial-gradient(circle at 65% 20%,#4db3c755 0 3%,transparent 20%),repeating-linear-gradient(15deg,#ffffff0d 0 2px,transparent 2px 16px),linear-gradient(145deg,#137a9b,#07506f 60%,#063f5a);box-shadow:inset 0 0 40px #032b405c,0 0 0 1px #061f2a;overflow:hidden;position:relative}.ss-grid:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 0 35%,#ffffff12 42%,transparent 50% 100%);mix-blend-mode:screen}.ss-cell{position:relative;border:0;border-right:1px solid #d5f5ff29;border-bottom:1px solid #d5f5ff29;background:transparent;padding:0;min-width:0;cursor:pointer}.ss-grid-own .ss-cell{cursor:crosshair}.ss-grid-enemy .ss-cell:hover{background:#e7fbff21}.ss-grid.is-locked .ss-cell{cursor:not-allowed}
.ss-coordinates{position:absolute;color:#b7d6df;font-size:.68rem;font-weight:800;user-select:none}.ss-coordinates-top{left:24px;right:0;top:1px;height:20px;display:grid;grid-template-columns:repeat(10,1fr);text-align:center}.ss-coordinates-left{left:0;top:22px;bottom:0;width:21px;display:grid;grid-template-rows:repeat(10,1fr);align-items:center;text-align:right;padding-right:5px}
.ss-cell.has-ship:before,.ss-cell.reveal-sunk:before{content:"";position:absolute;z-index:2;background:linear-gradient(180deg,#c7d2d6 0,#819097 24%,#394950 58%,#1f3037 100%);box-shadow:inset 0 2px #edf5f7,inset 0 -3px #14272d,0 3px 6px #00182180}.ss-cell[data-orientation="h"].has-ship:before{left:2px;right:-2px;top:25%;bottom:25%}.ss-cell[data-orientation="v"].has-ship:before{top:2px;bottom:-2px;left:25%;right:25%}.ss-cell.has-ship[data-segment="0"]:before{border-radius:65% 10% 10% 65%}.ss-cell[data-orientation="v"].has-ship[data-segment="0"]:before{border-radius:65% 65% 10% 10%}.ss-cell.has-ship:after{content:"";position:absolute;z-index:3;width:28%;height:22%;left:36%;top:31%;border-radius:4px;background:#67777d;box-shadow:0 -3px 0 #8c999e,7px 2px 0 -2px #243238}.ss-cell.is-miss:before{content:"";position:absolute;z-index:5;width:28%;aspect-ratio:1;border-radius:50%;left:36%;top:36%;background:#e6fbffb8;box-shadow:0 0 0 4px #d9f8ff22,0 0 12px #fff}.ss-cell.is-hit:before{content:"";position:absolute;z-index:6;width:42%;aspect-ratio:1;left:29%;top:29%;border-radius:50%;background:radial-gradient(circle,#fff7a3 0 12%,#ffad36 18% 35%,#e33218 40% 58%,#29110b 65% 100%);box-shadow:0 0 10px #ff9c38,0 0 22px #ff4a1e}.ss-cell.is-hit:after{content:"×";position:absolute;z-index:7;inset:0;display:grid;place-items:center;color:#210703;font-size:clamp(14px,3vw,24px);font-weight:950}.ss-cell.is-sunk{background:#511c165e}.ss-cell.is-sunk:before{filter:brightness(.55) saturate(.6)}
.ss-legend{display:flex;gap:16px;flex-wrap:wrap;margin:16px 2px 0;color:#405861;}.ss-legend span{display:flex;align-items:center;gap:7px}.ss-dot{width:12px;height:12px;border-radius:50%;display:inline-block}.ss-dot-hit{background:#e8471c;box-shadow:0 0 5px #ef6e39}.ss-dot-miss{background:#dff9ff;border:1px solid #7fc5da}.ss-dot-sunk{background:#5a2923}.ss-rules{margin-top:14px;border-top:1px solid #aebfc6;padding-top:12px}.ss-rules summary{cursor:pointer;}.ss-rules p{color:#435962}
.ss-lightbox[hidden]{display:none!important}.ss-lightbox{position:fixed;inset:0;z-index:99999;padding:18px;background:linear-gradient(180deg,#04111ccc,#082236cc);display:grid;place-items:center;backdrop-filter:blur(4px)}.ss-lightbox-dialog{width:min(92vw,540px);border-radius:26px;overflow:hidden;background:linear-gradient(180deg,#fefefe,#edf7fb 55%,#e6f1f5);box-shadow:0 28px 60px #02131d7a,0 0 0 1px #ffffff9f;text-align:center}.ss-lightbox-head{padding:24px 24px 18px;background:radial-gradient(circle at top,#fff8c5 0,#fff2a8 14%,#f5fbff 42%,#ecf6fa 100%)}.ss-lightbox-badge{width:74px;height:74px;margin:0 auto 10px;border-radius:50%;display:grid;place-items:center;font-size:2rem;background:radial-gradient(circle,#fffbdd 0,#f3cb58 58%,#b87a11 100%);box-shadow:inset 0 3px #fff7d8,0 10px 24px #b87a1148}.ss-lightbox-kicker{margin:0 0 6px;color:#8c620d}.ss-lightbox-head h3{margin:0;color:#113247}.ss-lightbox-text{margin:12px auto 0;max-width:34ch;color:#395262}.ss-lightbox-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;padding:16px 18px 22px}.ss-lightbox-open{overflow:hidden}
@media(max-width:760px){.ss-game{margin:.5rem -4px;padding:12px;border-radius:16px}.ss-header{align-items:center}.ss-subtitle{}.ss-battlefields{grid-template-columns:1fr}.ss-enemy-card{order:-1}.ss-sea-card{padding:9px}.ss-grid-shell{padding:19px 0 0 20px}.ss-coordinates-top{left:20px}.ss-coordinates-left{top:19px;width:18px;font-size:.6rem}.ss-cell.is-hit:after{font-size:18px}.ss-fleet{grid-template-columns:1fr 1fr}.ss-fleet-ship{padding:7px;}.ss-mini-ship{display:none}.ss-lightbox-head{padding:22px 18px 16px}.ss-lightbox-actions{padding:14px 12px 18px}}
@media(max-width:440px){.ss-fleet{grid-template-columns:1fr}.ss-btn{padding:.65rem .8rem}.ss-header{display:block}.ss-header .ss-btn{margin-top:10px}.ss-lightbox-dialog{width:94vw}.ss-lightbox-actions{display:grid;grid-template-columns:1fr}.ss-lightbox-badge{width:66px;height:66px;font-size:1.8rem}}
.ss-ai-setting{display:grid;gap:5px;max-width:280px;margin-top:12px}.ss-ai-setting span{}.ss-ai-setting select{padding:.65rem .75rem;border:1px solid #a9bcc3;border-radius:10px;background:#fff;color:inherit;}