:root{color-scheme:dark;--bg:#111;--panel:#1b1b1b;--line:#444;--text:#eee;--muted:#aaa;--mint:#55dd88;--gold:#d7aa48;--red:#f58a9d}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 83% 8%,#55dd8812,transparent 40%),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:14px;line-height:1.5}.shell{max-width:1220px;margin:auto;padding:0 36px}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button{cursor:pointer;transition:background .16s,transform .16s;border:0}button:disabled{opacity:.42;cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--mint);outline-offset:4px}button:active:not(:disabled){transform:translateY(1px)}[hidden]{display:none!important}.masthead{display:flex;align-items:center;justify-content:space-between;padding:26px 0;border-bottom:1px solid var(--line)}.brand{display:flex;gap:13px;align-items:center;text-decoration:none;color:var(--text);font-size:23px;font-weight:800;letter-spacing:4px}.brand-icon{font-size:29px;color:var(--mint);background:#1f2a22;border:1px solid #3d5a45;border-radius:12px;width:51px;height:51px;display:grid;place-items:center;letter-spacing:0}.brand-sub{display:block;font-size:8px;font-weight:600;letter-spacing:2px;color:var(--muted);margin-top:1px}.connection{font-size:10px;letter-spacing:1.4px;color:var(--muted);display:flex;align-items:center;gap:9px}.connection i{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 12px #55dd8880}.connection.offline i{background:var(--gold)}.intro{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:46px 0 38px}.eyebrow{color:var(--mint);font-size:10px;letter-spacing:2px;font-weight:700}h1{font-size:clamp(30px,4vw,48px);letter-spacing:-1.8px;line-height:1.14;margin:15px 0 16px;font-weight:650}h1 em{color:var(--mint);font-style:normal}.intro p,.lobby p,.rules p{color:var(--muted);margin:0}.radar{width:176px;height:176px;flex-shrink:0;border:1px solid #2f6b4577;border-radius:50%;position:relative;margin-right:38px;background:repeating-radial-gradient(circle,transparent 0 27px,#2f6b4555 28px 29px),conic-gradient(from 25deg,transparent 0deg,#55dd8822 60deg,transparent 61deg);box-shadow:0 0 50px #55dd8809}.radar-cross:before,.radar-cross:after{content:'';position:absolute;background:#2f6b4566}.radar-cross:before{height:1px;top:50%;left:-12px;right:-12px}.radar-cross:after{width:1px;left:50%;top:-12px;bottom:-12px}.blip{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--mint);box-shadow:0 0 14px #55dd88}.b1{top:51px;right:44px}.b2{bottom:40px;left:53px;width:4px;height:4px}.radar-label{position:absolute;bottom:-27px;width:100%;text-align:center;font-size:9px;color:var(--muted);letter-spacing:2px}.panel{background:linear-gradient(120deg,#202020,var(--panel));border:1px solid var(--line);border-radius:14px}.lobby{padding:30px;display:grid;grid-template-columns:1fr 240px;gap:25px}.lobby h2{font-size:23px;margin:8px 0}.name-field{align-self:center}label{display:block;font-size:12px;color:var(--muted)}input{display:block;width:100%;min-width:0;background:#111;border:1px solid #444;border-radius:7px;color:var(--text);padding:12px 14px;margin-top:7px}input::placeholder{color:#8a8f8a}.lobby-actions{grid-column:1/-1;display:flex;gap:20px;align-items:center;border-top:1px solid var(--line);padding-top:24px}.primary,.secondary{min-height:44px;padding:11px 19px;border-radius:7px;font-weight:650;white-space:nowrap}.primary{background:var(--mint);color:#07140c}.primary:hover:not(:disabled){background:#6ee39b}.primary span{padding-left:38px}.secondary{background:#252525;color:var(--text);border:1px solid #444}.secondary:hover:not(:disabled){background:#333}.or{font-size:12px;color:var(--muted)}#join-form{display:flex;gap:10px}#code{width:180px;margin:0;letter-spacing:3px;text-transform:uppercase}.room-bar{padding:14px 20px;display:flex;align-items:center;justify-content:space-between;gap:12px}.room-bar>div:first-child{display:flex;align-items:center;gap:14px}#room-code{font-size:19px;letter-spacing:3px}.text-button{background:transparent;color:var(--muted);padding:8px;font-size:12px}.text-button:hover{color:var(--mint)}.opponent-status{color:var(--muted);font-size:12px}#invite-fallback{padding:15px;margin-top:8px}.status-bar{display:flex;align-items:center;gap:15px;padding:26px 0}.status-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:50%;background:#55dd8813;color:var(--mint);font-size:24px}.status-bar h2{margin:0;font-size:21px}.status-bar p{margin:4px 0 0;color:var(--muted);font-size:12px}#rematch{margin-left:auto}.boards{display:grid;grid-template-columns:1fr 1fr;gap:22px}.board-panel{padding:23px}.board-heading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:17px}.board-heading h2{font-size:22px;margin:4px 0 0;font-weight:600;letter-spacing:-.5px}.counter{font-size:10px;color:var(--muted);border:1px solid var(--line);padding:5px 9px;border-radius:20px;white-space:nowrap}.board{display:grid;grid-template-columns:20px repeat(10,minmax(0,1fr));gap:3px;width:100%;user-select:none}.axis{display:grid;place-items:center;color:#8a8f8a;font-size:10px;aspect-ratio:1}.cell{position:relative;display:grid;place-items:center;aspect-ratio:1;border:1px solid #3a3f3a;border-radius:3px;background:#161a16;padding:0;color:var(--text);font-size:clamp(14px,2.1vw,25px);line-height:1}.cell:disabled{opacity:1;cursor:default}.cell.ship{background:#4b8a63;border-color:#63a87d;box-shadow:inset 0 0 0 3px #2f5c40}.cell.ship:after{content:'';width:34%;height:34%;border:1px solid #9fcfb0;border-radius:2px}.cell.hit,.cell.sunk{color:#ffbcaf;background:#5a2f2c;border-color:#8a524a}.cell.sunk{background:#8f3f38;border-color:#c9705f}.cell.hit:after,.cell.sunk:after{display:none}.cell.miss{color:#9a9f98;font-size:23px}.cell.water{background:#111;border-color:#333;color:#666;font-size:21px}.cell.preview{background:#2f5c40;border-color:var(--mint)}.cell.invalid{background:#5a2f2c;border-color:var(--red)}.cell:not(:disabled):hover{border-color:var(--mint);filter:brightness(1.3)}.enemy-panel.active{border-color:#3d7a52;box-shadow:0 0 24px #55dd8808}.enemy-panel.active .cell:not(:disabled){cursor:crosshair}.board-caption{font-size:11px;color:var(--muted);margin:16px 0 0;min-height:17px}.placement{margin-top:20px;padding:20px;display:flex;align-items:center;gap:22px;flex-wrap:wrap}.fleet-description p{font-size:11px;margin:4px 0 0;color:var(--muted)}.fleet{display:flex;gap:9px;flex:1}.fleet-option{padding:8px 10px;border:1px solid #444;border-radius:7px;background:#252525;min-width:56px;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:5px}.fleet-option.selected{border-color:var(--mint);background:#1f3326;color:var(--mint)}.mini-ship{display:flex;gap:2px;height:10px}.mini-ship i{width:9px;height:9px;background:currentColor;border-radius:1px}.fleet-option small{font-size:10px}.placement-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.placement-actions button{font-size:12px;padding:9px 13px}kbd{font:9px ui-monospace,monospace;border:1px solid #555;border-radius:3px;padding:1px 4px;margin-left:8px;color:var(--muted)}.placement-help{flex-basis:100%;font-size:11px;color:var(--muted);margin:0}.battle-bottom{padding:20px 0}.legend{display:flex;flex-wrap:wrap;gap:17px;font-size:10px;color:var(--muted)}.legend span{display:flex;gap:6px;align-items:center}.legend i{display:inline-grid;place-items:center;width:14px;height:14px;border-radius:2px;font-style:normal;font-size:15px}.legend-ship{background:#4b8a63}.legend-hit{background:#5a2f2c;color:#ffbcaf}.legend-sunk{background:#8f3f38;color:#ffbcaf}.legend-miss,.legend-water{background:#161a16}#last-shot{font-size:12px;color:var(--gold);margin:16px 0 0}.notice{position:fixed;bottom:25px;left:50%;transform:translateX(-50%);background:#1f3326;border:1px solid #3f7a55;color:#eafff2;border-radius:10px;padding:14px 23px;z-index:10;width:max-content;max-width:calc(100% - 32px);box-shadow:0 12px 40px #0008}.notice.error{background:#3f2326;border-color:#a96865}.rules{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin:38px 0 42px}.rule-number{font:11px ui-monospace,monospace;color:var(--mint);border-bottom:1px solid #2f6b45;padding-bottom:4px}.rules h3{font-size:14px;font-weight:600;margin:12px 0 7px}.rules p{font-size:12px;line-height:1.8}footer{border-top:1px solid var(--line);display:flex;justify-content:space-between;padding:22px 0;color:#8a8f8a;font-size:9px;letter-spacing:1.4px}.footer-dot{margin:0 10px;color:var(--mint)}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@media(min-width:1000px){body.in-game .intro{padding:28px 0}body.in-game h1{font-size:32px}body.in-game .radar{width:110px;height:110px}body.in-game .radar-label{font-size:8px}body.in-game .intro p{font-size:12px}}
@media(max-width:900px){.shell{padding:0 22px}.board-panel{padding:16px}.boards{gap:14px}.board-heading{align-items:flex-start}.board-heading .eyebrow{font-size:8px;letter-spacing:1px}.board-heading h2{font-size:19px}.counter{font-size:9px;padding:4px 6px}.placement{gap:16px}.placement-actions{flex-basis:100%}.radar{margin-right:12px;width:135px;height:135px}.room-bar{flex-wrap:wrap}.opponent-status{order:3;width:100%}.rules{gap:24px}}
@media(max-width:620px){.shell{padding:0 14px}.masthead{padding:19px 0}.brand{font-size:20px;gap:9px}.brand-icon{width:43px;height:43px}.brand-sub{font-size:7px}.connection{font-size:8px;letter-spacing:.3px;max-width:104px}.intro{padding:30px 0 25px}.intro p{font-size:12px;max-width:300px}.radar{display:none}h1{font-size:34px}.lobby{grid-template-columns:1fr;padding:22px;gap:20px}.lobby h2{font-size:21px}.lobby p{font-size:12px}.lobby-actions{flex-wrap:wrap;gap:13px}.lobby-actions>.primary{width:100%}.or{width:100%;text-align:center}#join-form{width:100%}#code{flex:1;width:0}#join{flex-shrink:0}.room-bar{padding:12px;gap:6px}.room-bar>div:first-child{gap:8px;flex-wrap:wrap}.room-bar .eyebrow{font-size:8px}#room-code{font-size:15px}.text-button{font-size:10px;padding:7px 4px}.boards{grid-template-columns:1fr;gap:17px}.board-panel{padding:18px}.board-heading .eyebrow{font-size:9px;letter-spacing:1.6px}.board-heading h2{font-size:22px}.counter{font-size:10px}.cell{font-size:23px}.status-bar{padding:21px 0;gap:10px;flex-wrap:wrap}.status-bar h2{font-size:19px}.status-bar p{font-size:11px}.status-bar>div:nth-child(2){flex:1}.status-icon{width:35px;height:35px}.placement{padding:16px;gap:16px}.fleet{gap:7px;flex-basis:100%}.fleet-option{flex:1}.placement-actions{gap:6px}.placement-actions button{padding:9px 10px}.placement-actions #ready{flex:1}.legend{gap:10px}.rules{grid-template-columns:1fr;gap:22px;margin:25px 0 30px}.rules>div{position:relative;padding-left:35px}.rule-number{position:absolute;left:0;top:4px}.rules h3{margin:0 0 4px}footer{gap:14px;font-size:8px;letter-spacing:.5px}body.in-game .intro h1{font-size:25px}body.in-game .intro p{display:none}body.in-game .intro{padding:22px 0 15px}body.in-game .intro .eyebrow{font-size:8px}}
.lobby-actions{flex-wrap:wrap}
@media(max-width:620px){.lobby-actions>#create{width:100%}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

/* --- Playora: wspólny motyw (na bazie Collective Conflict) --- */
body{background:var(--bg)}
button:focus-visible,a:focus-visible,input:focus-visible{outline-color:var(--mint)}
.masthead{border-bottom-color:var(--line)}
.brand{text-transform:uppercase}
.brand-icon{color:#07140c;background:var(--mint);border-color:#3f7a55}
.eyebrow{color:#9a9f98}
h1,h2,h3{color:var(--text)}
.panel{background:var(--panel);border-color:var(--line)}
input{background:#111;border-color:var(--line);color:var(--text)}
input::placeholder{color:#7f857f}
.primary{background:var(--mint);color:#07140c}
.secondary{background:#252525;color:var(--text);border:1px solid var(--line)}
.counter{border-color:var(--line);color:#9a9f98}
.text-button{color:#9a9f98}
.text-button:hover{color:var(--mint)}
.status-icon{background:#55dd881a;color:var(--mint)}
.cell{border-color:#3a3f3a;background:#161a16}
.placement-help,.board-caption,.fleet-description p,.opponent-status{color:#9a9f98}
.notice{background:#1f3326;border-color:#3f7a55;color:#eafff2}
.notice.error{background:#3f2326;border-color:#a96865}
.rule-number{color:var(--mint);border-bottom-color:#2f6b45}
footer{border-top-color:var(--line);color:#8a8f8a}
.footer-dot{color:var(--mint)}