:root{font-family:system-ui,-apple-system,sans-serif;color:#e2efec;background:#101f29;font-synthesis:none}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 10% 0,#23485380,transparent 60%),#101f29}main{width:min(950px,calc(100% - 28px));margin:32px auto}header{position:relative;padding:0 8px 24px}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(48px,8vw,76px);line-height:.95;letter-spacing:-.045em;margin:12px 0}h1 span{display:block;font-family:system-ui,sans-serif;font-size:18px;letter-spacing:.18em;text-transform:uppercase;color:#95cab8;margin:15px 0}.eyebrow{font-size:11px;letter-spacing:.2em;color:#e1b56a}.intro{position:absolute;right:0;bottom:30px;line-height:1.7;color:#a7c2c6}.game{padding:20px;border:1px solid #6b8e9255;border-radius:20px;background:#132832;box-shadow:0 24px 80px #0005}.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:15px;flex-wrap:wrap}label{color:#a7c2c6;font-size:13px}select,button{font:inherit;color:inherit;background:#203a45;border:1px solid #728f9455;border-radius:8px;padding:10px 14px;cursor:pointer}select{margin-left:8px}button:hover{background:#31525c}button:focus-visible,select:focus-visible{outline:3px solid #a8edce;outline-offset:3px}button:disabled{opacity:.4;cursor:default}#stats{flex:1;text-align:center;color:#b8cfcc;font-size:13px}#board{width:min(100%,500px);margin:auto;aspect-ratio:1;touch-action:manipulation}svg{width:100%;height:100%;display:block;border:1px solid #6d979b66;border-radius:10px;background:#15303a}.tile{cursor:pointer}.tile:hover .land{fill:#345a5f}.land{fill:#1d3e47;stroke:#32525c;stroke-width:.5}.wet{fill:#255d7d}.water{fill:#438ec0}.wall{fill:#8f9c9d;stroke:#c7d1cb;stroke-width:1}.ship{fill:#efc16b;stroke:#ffe2a0;stroke-width:.4}.cursor{fill:none;stroke:#b7ffdb;stroke-width:2;pointer-events:none}.ripple{stroke:#92ceec;fill:none;opacity:.5}.status{min-height:55px;text-align:center;display:grid;place-items:center;color:#b8d8cf;padding:10px;line-height:1.4}.actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.primary{background:#b8e1bf;color:#142c2b;font-weight:650}.primary:hover{background:#d0f0d5}kbd{font:10px system-ui;background:#0002;padding:3px 5px;border-radius:4px;margin-left:8px}.guide{display:grid;grid-template-columns:1fr 1fr;gap:35px;padding:20px 10px}h2{font-family:Georgia,serif;font-size:20px;font-weight:400;color:#eddfbf}.guide p{font-size:14px;color:#a7c2c6;line-height:1.7}footer{text-align:center;font-size:12px;line-height:1.8;color:#7d9fa5}footer a{color:#badbca}footer span{font-size:11px}button[hidden]{display:none}@media(max-width:650px){main{margin:20px auto}.intro{position:static;font-size:14px}.game{padding:10px}.toolbar{gap:6px}button,select{padding:9px 10px}#stats{order:4;flex-basis:100%;padding:4px}.guide{grid-template-columns:1fr;gap:0}h1{font-size:52px}}