:root{--paper: #FAF8F1;--page-line: #D6E0E9;--grid-line: #A9C3D8;--ink: #2A4A9A;--ink-rgb: 42, 74, 154;--text: #1B2F63;--hit: #C2392F;--hit-rgb: 194, 57, 47;--pencil: #6A7280;--pencil-rgb: 106, 114, 128;--ship-fill: rgba(42, 74, 154, .1);--sunk-fill: rgba(194, 57, 47, .12);--hover: rgba(42, 74, 154, .09);--miss-opacity: .5;--aim-opacity: .07;--divider: rgba(42, 74, 154, .3);--margin-line: rgba(194, 57, 47, .32);--btn-shadow: rgba(42, 74, 154, .18);--btn-secondary-border: rgba(106, 114, 128, .7);--chip-ink: rgba(42, 74, 154, .45);--chip-hit: rgba(194, 57, 47, .5);--chip-grey: rgba(106, 114, 128, .5);--counter-sunk-bg: rgba(194, 57, 47, .14);--danger-fill: rgba(194, 57, 47, .18);--cell: 40px;--font-hand: "Caveat", "Segoe Script", cursive;--font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;color-scheme:light}:root[data-theme=dark]{--paper: #14161A;--page-line: #262B33;--grid-line: #39424F;--ink: #8FB6E8;--ink-rgb: 143, 182, 232;--text: #E7E4DA;--hit: #E8695C;--hit-rgb: 232, 105, 92;--pencil: #8B9098;--pencil-rgb: 139, 144, 152;--ship-fill: rgba(143, 182, 232, .12);--sunk-fill: rgba(232, 105, 92, .16);--hover: rgba(143, 182, 232, .12);--miss-opacity: .6;--aim-opacity: .1;--divider: rgba(143, 182, 232, .35);--margin-line: rgba(232, 105, 92, .35);--btn-shadow: rgba(143, 182, 232, .22);--btn-secondary-border: rgba(139, 144, 152, .8);--chip-ink: rgba(143, 182, 232, .5);--chip-hit: rgba(232, 105, 92, .55);--chip-grey: rgba(139, 144, 152, .6);--counter-sunk-bg: rgba(232, 105, 92, .18);--danger-fill: rgba(232, 105, 92, .22);color-scheme:dark}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%}body{font-family:var(--font-mono);font-size:13px;color:var(--text);background-color:var(--paper);background-image:repeating-linear-gradient(to right,var(--page-line) 0 1px,transparent 1px var(--cell)),repeating-linear-gradient(to bottom,var(--page-line) 0 1px,transparent 1px var(--cell))}a{color:var(--text);text-decoration:none}a:hover{color:var(--ink)}button{font:inherit;color:inherit}.page{position:relative;min-height:100vh;padding:40px 40px 40px 80px;display:flex;flex-direction:column;gap:40px}.page:before{content:"";position:absolute;left:40px;top:0;bottom:0;width:1px;background:var(--margin-line);pointer-events:none}.header{height:80px;display:flex;align-items:flex-end;justify-content:space-between;gap:40px}.header__title{margin:0;font-family:var(--font-hand);font-weight:700;font-size:52px;line-height:1}.header__title a{color:inherit}.header__sub{margin:6px 0 0;font-size:12px;letter-spacing:.06em;color:var(--pencil)}.header__right{display:flex;align-items:center;gap:12px}.theme-link{display:flex;align-items:center;gap:10px;height:48px;padding:0 18px;border:1.5px solid var(--chip-ink);border-radius:2px;background:transparent;font-size:13px;letter-spacing:.04em;cursor:pointer;color:var(--text)}.theme-link svg{display:block}.btn{height:48px;padding:0 22px;border-radius:2px;background:transparent;cursor:pointer;font-family:var(--font-hand);font-size:26px;line-height:1;color:var(--text);border:1.5px solid var(--ink);box-shadow:3px 3px 0 var(--btn-shadow)}.btn:hover{background:var(--hover)}.btn:active{transform:translate(1px,1px);box-shadow:2px 2px 0 var(--btn-shadow)}.btn:disabled{opacity:.45;cursor:default;transform:none}.btn--secondary{border:1.5px dashed var(--btn-secondary-border);box-shadow:none;color:var(--pencil);font-size:24px}.btn--secondary:hover{background:transparent;color:var(--text)}.btn--block{width:100%}.btn--small{height:40px;font-size:22px;padding:0 16px}.field{height:48px;padding:0 14px;border-radius:2px;border:1.5px solid var(--chip-ink);background:transparent;color:var(--text);font-family:var(--font-mono);font-size:14px;width:100%}.field:focus{outline:2px solid var(--ink);outline-offset:-2px}.field::placeholder{color:var(--pencil)}.label{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--pencil)}.caption{font-size:13px;letter-spacing:.1em;text-transform:uppercase}.muted{font-size:12px;color:var(--pencil)}.hand{font-family:var(--font-hand)}.status{font-family:var(--font-hand);font-size:36px;line-height:1.1}.hint{margin:0;font-family:var(--font-hand);font-size:24px;line-height:1.25;color:var(--pencil);text-wrap:pretty}.divider{height:1px;background:var(--divider)}.error{color:var(--hit);font-size:12px}.board-col{width:calc(var(--cell) * 11);display:flex;flex-direction:column;flex:0 0 auto}.board-col__caption{height:var(--cell);display:flex;align-items:center;justify-content:space-between}.ruler{display:flex}.ruler__corner{width:var(--cell);flex:0 0 auto}.ruler__cell{width:var(--cell);height:var(--cell);display:flex;align-items:center;justify-content:center;font-family:var(--font-hand);font-size:26px;color:var(--ink);flex:0 0 auto}.ruler--v{flex-direction:column;width:var(--cell);flex:0 0 auto}.board-row{display:flex}.board{position:relative;width:calc(var(--cell) * 10);height:calc(var(--cell) * 10);box-shadow:0 0 0 1.5px var(--ink);background-image:repeating-linear-gradient(to right,var(--grid-line) 0 1px,transparent 1px var(--cell)),repeating-linear-gradient(to bottom,var(--grid-line) 0 1px,transparent 1px var(--cell));touch-action:none}.board__grid{display:grid;grid-template-columns:repeat(10,var(--cell));grid-auto-rows:var(--cell)}.cell{width:var(--cell);height:var(--cell);padding:0;border:0;background:transparent;display:flex;align-items:center;justify-content:center;appearance:none}.cell svg{display:block;width:100%;height:100%}.cell--btn{cursor:crosshair}.cell--btn:hover{background:var(--hover)}.cell--btn:focus-visible{outline:2px solid var(--ink);outline-offset:-2px}.cell--btn:disabled{cursor:default}.cell--btn:disabled:hover{background:transparent}.board__overlay{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none}.ship{position:absolute;display:block}.ship--drag{pointer-events:auto;cursor:grab}.ship--dragging{cursor:grabbing;opacity:.85}.board--dim{opacity:.6}.fleet{display:flex;flex-direction:column;gap:14px}.fleet__row{display:flex;align-items:center;gap:10px}.fleet__size{font-size:11px;color:var(--pencil);width:12px}.fleet__ships{display:flex;gap:8px}.fleet__ship{display:flex;gap:2px}.fleet__ship--sunk{opacity:.55}.deck{display:block;width:13px;height:13px;border:1.5px solid var(--ink)}.fleet__ship--sunk .deck{border-color:var(--hit);background:var(--counter-sunk-bg)}.journal{min-height:160px;display:flex;gap:40px;justify-content:space-between;border-top:1.5px solid var(--divider);padding-top:20px}.journal__left{display:flex;flex-direction:column;gap:14px;min-width:0}.chips{display:flex;gap:12px;flex-wrap:wrap}.chip{padding:8px 12px;border:1px dashed var(--chip-ink);border-radius:2px;font-size:13px;color:var(--text);white-space:nowrap}.chip--hit{border-color:var(--chip-hit);color:var(--hit)}.chip--miss{border-color:var(--chip-grey);color:var(--pencil)}.journal__right{width:320px;flex:0 0 auto}.battle{display:flex;gap:120px;align-items:flex-start;min-height:480px}.panel{width:200px;flex:0 0 auto;display:flex;flex-direction:column;gap:28px}.panel__status{display:flex;flex-direction:column;gap:2px}.panel__buttons{display:flex;flex-direction:column;gap:12px}.home{display:flex;gap:120px;align-items:flex-start;flex-wrap:wrap}.home__col{display:flex;flex-direction:column;gap:28px;width:440px}.home__actions{display:flex;flex-direction:column;gap:12px;width:280px}.name-form{display:flex;gap:12px;align-items:center}.stats{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;font-size:12px}.stats dt{color:var(--pencil)}.stats dd{margin:0}.leader{width:100%;border-collapse:collapse;font-size:12px}.leader th{text-align:left;font-weight:500;color:var(--pencil);font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:4px 8px 4px 0;border-bottom:1px solid var(--divider)}.leader td{padding:6px 8px 6px 0;border-bottom:1px dashed var(--chip-grey)}.overlay{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:#00000040;z-index:10}.overlay__card{background:var(--paper);box-shadow:0 0 0 1.5px var(--ink),6px 6px 0 var(--btn-shadow);padding:32px 40px;width:min(440px,92vw);display:flex;flex-direction:column;gap:20px}.overlay__title{margin:0;font-family:var(--font-hand);font-size:44px;line-height:1}.code{font-family:var(--font-mono);font-size:28px;letter-spacing:.3em}.link-row{display:flex;gap:12px;align-items:center}.link-row .field{flex:1}.report-link{align-self:flex-start;padding:0;border:none;background:none;cursor:pointer;font-family:var(--font-mono);font-size:12px;color:var(--pencil);text-decoration:underline dashed;text-underline-offset:3px}.report-link:hover:not(:disabled){color:var(--text)}.report-link:disabled{cursor:default;text-decoration:none}.report-reasons{margin:0;padding:0;border:none;display:flex;flex-direction:column;gap:10px}.report-reasons legend{margin-bottom:10px}.report-reasons label{display:flex;gap:10px;align-items:center;font-size:14px;cursor:pointer}.report-reasons input{accent-color:var(--ink);width:16px;height:16px;margin:0}@media(max-width:1360px){.battle{gap:60px;flex-wrap:wrap}.home{gap:60px}}@media(max-width:760px){:root{--cell: min(calc((100vw - 48px) / 11), 40px)}.page{padding:20px 16px 20px 32px;gap:24px}.page:before{left:16px}.header{height:auto;flex-wrap:wrap;align-items:flex-start}.header__title{font-size:40px}.battle{gap:32px;flex-direction:column}.battle>.board-col:nth-child(2){order:-1}.panel{width:100%}.journal{flex-direction:column;gap:16px;min-height:0}.journal__right{width:auto}.ruler__cell{font-size:20px}.home__col,.home__actions{width:100%}.cell--btn{position:relative}.cell--btn:after{content:"";position:absolute;inset:-4px}}