*{box-sizing:border-box}body{color:#e5e7eb;background:#0f172a;margin:0;font-family:system-ui,Arial,sans-serif}.screen{place-items:center;min-height:100vh;padding:24px;display:grid}.card{text-align:center;background:#111827;border:1px solid #334155;border-radius:20px;width:min(100%,520px);padding:32px;box-shadow:0 20px 60px #00000059}h1{margin-top:0;font-size:2.2rem}p{color:#cbd5e1;line-height:1.5}.actions{gap:12px;margin:28px 0 18px;display:grid}button{cursor:pointer;color:#082f49;background:#38bdf8;border:0;border-radius:12px;padding:14px 18px;font-size:1rem;font-weight:700}button:hover{background:#7dd3fc}.small{color:#94a3b8;font-size:.9rem}.game-code{color:#e0f2fe;letter-spacing:.2em;background:#020617;border:1px solid #38bdf8;border-radius:14px;margin:24px auto;padding:18px;font-size:2rem;font-weight:800}.text-input{text-align:center;text-transform:uppercase;color:#e5e7eb;background:#020617;border:1px solid #334155;border-radius:12px;width:100%;padding:14px;font-size:1.2rem}.secondary{color:#e5e7eb;background:#334155}.secondary:hover{background:#475569}.wide{width:min(100%,760px)}.board{grid-template-columns:repeat(10,1fr);gap:4px;margin-top:24px;display:grid}.cell{aspect-ratio:1;background:#0f172a;border:1px solid #334155;border-radius:6px}.placement-panel{gap:12px;margin-top:20px;display:grid}.cell.ship{background:#38bdf8;border-color:#7dd3fc}.cell.shot{cursor:not-allowed;background:#475569}.cell.hit{background:#ef4444;border-color:#fecaca}.cell.miss{background:#64748b;border-color:#cbd5e1}.win{color:#22c55e;font-size:1.4rem;font-weight:800}.lose{color:#ef4444;font-size:1.4rem;font-weight:800}.floating-turn-button{z-index:1000;border-radius:999px;width:auto;padding:10px 14px;font-size:.9rem;position:fixed;top:16px;right:16px;box-shadow:0 8px 24px #00000059}.game-menu{z-index:900;background:#111827;border:1px solid #334155;border-radius:18px;align-content:start;gap:12px;width:220px;padding:18px;display:grid;position:fixed;top:16px;bottom:16px;left:16px}.menu-toggle{display:none}@media (width<=900px){.menu-toggle{z-index:1001;width:auto;padding:10px 14px;display:block;position:fixed;top:16px;left:16px}.game-menu{display:none}.game-menu.open{display:grid}}.waiting-banner{color:#e0f2fe;background:#1e293b;border:1px solid #38bdf8;border-radius:12px;margin-top:18px;padding:12px 14px;font-weight:700;position:relative;overflow:hidden}.waiting-banner:before{content:"";opacity:.35;z-index:0;background:#facc15;width:0%;position:absolute;inset:0}.waiting-banner>span{z-index:1;position:relative}@keyframes fill-rematch-banner{0%{width:0%}to{width:100%}}.hidden{display:none}#rematchGame.loading{position:relative;overflow:hidden}#rematchGame.loading:before{content:"";opacity:.45;background:#facc15;width:0%;animation:20s linear forwards fill-rematch-button;position:absolute;inset:0}#rematchGame.loading span{z-index:1;position:relative}@keyframes fill-rematch-button{0%{width:0%}to{width:100%}}#rematchGame:disabled{color:#9ca3af;cursor:not-allowed;opacity:1;background:#374151}#rematchGame:disabled:hover{background:#374151}#rematchGame.loading:disabled{color:#082f49}.cell.sunk{background:#7f1d1d;border-color:#fca5a5}@media (width<=600px){.screen{padding:72px 10px 16px}.card,.wide{width:100%;padding:18px}.board{gap:3px;width:100%;max-width:calc(100vw - 36px)}.cell{min-width:0;padding:0}}