:root{color-scheme:light;--bg:#f6f6f8;--card:#fff;--ink:#202027;--muted:#6e7079;--line:#dfe0e5;--soft:#ececf0;--accent:#07569d;--accent-ink:#fff}:root.dark{color-scheme:dark;--bg:#151516;--card:#242426;--ink:#f4f4f6;--muted:#aaaab1;--line:#55555b;--soft:#343438;--accent:#2d8bd5;--accent-ink:#fff}*{box-sizing:border-box}body{margin:0;min-width:320px;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button{font:inherit;cursor:pointer;color:var(--ink)}.game{width:min(100%,570px);margin:auto;padding:clamp(20px,5vw,38px) 18px 42px}.game-header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:26px}h1{margin:0;font-size:31px;font-weight:650;letter-spacing:-.045em}.game-header p{margin:8px 0 0;color:var(--muted);font-size:15px}.icon-button{width:42px;height:42px;border:0;border-radius:50%;background:transparent;color:var(--ink);font-size:27px}.score-card{display:grid;grid-template-columns:1fr 1fr;width:min(100%,360px);margin:0 auto 23px;border:2px solid var(--line);border-radius:999px;background:var(--card);overflow:hidden}.score-card>div{padding:8px 24px;text-align:center}.score-card>div+div{border-left:2px solid var(--line)}.stat-label{margin-right:5px;font-family:Georgia,serif;font-size:14px}.score-card strong{font-family:Georgia,serif;font-size:15px}.score-card small{font-size:13px;color:var(--muted)}.game-card{padding:0;background:transparent}.board-area{display:flex;align-items:center;justify-content:center;gap:clamp(15px,4vw,30px)}.board{display:grid;grid-template-columns:repeat(12,1fr);gap:0;width:min(76vw,395px);aspect-ratio:1;padding:4px;border:4px solid var(--line);border-radius:7px;background:var(--line);overflow:hidden;box-shadow:0 3px 8px rgb(0 0 0/.13)}.cell{aspect-ratio:1;background:var(--soft);transition:background .18s ease}.cell.flooded{box-shadow:inset 0 0 0 1px rgb(255 255 255/.08)}.cell.origin{position:relative}.cell.origin::after{content:"";position:absolute;inset:26%;border:2px solid rgb(255 255 255/.93);border-radius:50%}.palette{display:flex;flex-direction:column;gap:11px}.colour-button{width:43px;aspect-ratio:1;border:3px solid var(--card);border-radius:50%;background:var(--colour);box-shadow:0 0 0 1px var(--line),0 2px 6px rgb(0 0 0/.22);transition:transform .15s ease,opacity .15s ease}.colour-button:not(:disabled):hover{transform:scale(1.08)}.colour-button:not(:disabled):active{transform:scale(.9)}.colour-button:disabled{opacity:.22;cursor:default}.colour-button.legal{box-shadow:0 0 0 3px var(--card),0 0 0 5px var(--colour),0 2px 7px rgb(0 0 0/.22)}.progress{height:6px;margin:20px auto 0;max-width:395px;border-radius:999px;background:var(--soft);overflow:hidden}.progress span{display:block;width:0;height:100%;border-radius:inherit;background:var(--accent);transition:width .2s ease}.status{min-height:24px;margin:12px auto 0;max-width:395px;text-align:center;font-size:14px;font-weight:650}.controls{display:flex;gap:9px;max-width:395px;margin:18px auto 0}.controls button{flex:1;min-height:43px;border:1px solid var(--line);border-radius:11px;background:var(--card);padding:0 10px}.controls button:disabled{opacity:.42;cursor:default}.primary-button{border-color:var(--accent)!important;background:var(--accent)!important;color:var(--accent-ink)!important;font-weight:750}.best-score{margin:12px 0 0;text-align:center;color:var(--muted);font-size:13px}.best-score strong{color:var(--ink)}.instructions{max-width:395px;margin:21px auto 0;color:var(--muted);font-size:13px;line-height:1.48;text-align:center}@media(max-width:400px){.game{padding-inline:12px}.board-area{gap:14px}.board{width:calc(100vw - 94px)}.colour-button{width:37px}.palette{gap:9px}.score-card>div{padding-inline:16px}}
