:root{--cell-size: clamp(22px, 6vw, 34px);--gap: 2px;color-scheme:light}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#0b3d5c;color:#08222f}.app{max-width:1100px;margin:0 auto;padding:1rem}.app-header h1{color:#fff;margin:.25rem 0 1rem}.feedback{min-height:1.5rem;padding:.5rem .75rem;border-radius:6px;margin-bottom:1rem;background:#eef6fb;border:1px solid #c6ddea}.feedback-error{background:#fdecea;border-color:#f5c6c0;color:#7a1c12}.feedback-success{background:#e8f5e9;border-color:#bfe3c2;color:#1b5e20}.feedback:empty{visibility:hidden}button{font:inherit;padding:.45rem .8rem;border-radius:6px;border:1px solid #90b4c7;background:#fff;cursor:pointer}button:disabled{opacity:.5;cursor:not-allowed}button.primary,.start-button{background:#0d6efd;border-color:#0d6efd;color:#fff}.start-screen,.placement-ui,.battle-ui{background:#fff;border-radius:10px;padding:1rem}.difficulty-selector{border:1px solid #c6ddea;border-radius:8px;margin-bottom:1rem}.difficulty-option{display:inline-flex;gap:.4rem;align-items:center;margin-right:1rem;padding:.3rem .5rem;border-radius:6px}.difficulty-option.selected{background:#e7f1fb;outline:2px solid #0d6efd}.difficulty-hint{color:#567;font-size:.85em}.placement-ui{display:grid;grid-template-columns:1fr;gap:1rem}@media (min-width: 720px){.placement-ui{grid-template-columns:320px 1fr}}.placement-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:.75rem}.ship-manifest{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.75rem}.ship-spec{letter-spacing:1px}.ship-spec.active{outline:2px solid #0d6efd}.ship-spec.done{opacity:.45}.ship-count{color:#567;margin-left:2px}.placed-list{margin-bottom:.75rem;display:flex;flex-direction:column;gap:.3rem}.placed-ship{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.board-panel h2{font-size:1rem;margin:0 0 .5rem;color:#123}.grid-board{display:inline-block;-webkit-user-select:none;user-select:none}.grid-board .row{display:flex;gap:var(--gap);margin-bottom:var(--gap)}.cell{width:var(--cell-size);height:var(--cell-size);display:inline-flex;align-items:center;justify-content:center;padding:0;border:1px solid #9db9c9;background:#d7ecf7;color:#123;font-size:calc(var(--cell-size) * .55);line-height:1}.cell:focus-visible{outline:3px solid #0d6efd;outline-offset:1px;z-index:1}.cell-ship{background:#5b7d92;color:#fff}.cell-placed{background:#4a6b7d;color:#fff}.cell-miss{background:#bcd9ea;color:#35607a}.cell-hit{background:#ffb74d;color:#7a3c00}.cell-sunk{background:#e57373;color:#5f0f0f}.cell-automiss{background:#cfe3ef;color:#6c93a8}.battle-ui{display:grid;grid-template-columns:1fr;gap:1rem}@media (min-width: 720px){.battle-ui{grid-template-columns:1fr 1fr}}