*{box-sizing:border-box}html{color-scheme:dark}body{margin:0;background:#0a171f;color:#eaf4ef;font:16px/1.5 system-ui,sans-serif}main{max-width:580px;margin:auto;padding:16px}header{border-bottom:1px solid #31505d;margin-bottom:16px}h1{font-size:clamp(26px,7vw,38px);line-height:1.1;margin:6px 0 16px}p{margin:8px 0 16px}.eyebrow{font-size:12px;letter-spacing:.15em;color:#9dd9c6}.stats{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap;font-weight:700}.board{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:4px;margin:16px auto;max-width:380px}.board button{min-width:44px;min-height:48px;padding:4px;font-size:22px;position:relative;border-radius:10px;background:#1a3341;color:#f3f9ff;border:1px solid #466574}.board button small{font-size:9px;position:absolute;left:3px;top:1px;color:#b8cbd0}.board button.open{background:#294348}.board button.paint{background:#d4b574;color:#152b32}.board button.water{background:#265a76}.board button.portal{background:#674b80}.board button.danger{background:#7c3349}.board button.active{outline:3px solid #b4f6d0;background:#466946;color:#fff}button{font:inherit;cursor:pointer;min-height:46px;min-width:44px;border:1px solid #547784;border-radius:9px;padding:10px 13px;background:#233b49;color:#f3f8ff;touch-action:manipulation}button:hover{filter:brightness(1.17)}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #fff;outline-offset:2px}.controls{display:flex;flex-wrap:wrap;gap:8px}.controls button{flex:1 1 100px}.panel{background:#132a34;border:1px solid #284956;border-radius:14px;padding:14px;margin:14px 0;white-space:pre-line;overflow-wrap:anywhere}.status{border-left:4px solid #d4b574}.status.won{border-color:#90e4b4}.status.lost{border-color:#ed8096}details{border-top:1px solid #31505d;margin-top:20px}summary{min-height:48px;padding:12px 0;cursor:pointer}a{display:inline-flex;align-items:center;min-height:44px;color:#a7e8d1;overflow-wrap:anywhere}footer{font-size:13px;color:#adc6cb;margin-top:20px}@media(max-width:350px){main{padding:12px}.board{gap:3px}.board button{min-height:46px;font-size:19px}.controls button{flex-basis:90px}}@media(prefers-reduced-motion:no-preference){button{transition:background .12s,outline .12s}}
button:disabled{cursor:default;opacity:.72}button:disabled:hover{filter:none}

h1{font-family:Georgia,serif}#board{gap:4px;padding:6px;border-radius:12px}#board button{min-height:48px;font-size:24px}#board small{font-size:10px;line-height:12px}#board svg{display:block;width:100%;height:45px}body{background:linear-gradient(#173b49,#2e5360);color:#e8eadb}.panel{background:#2e5360;border:2px solid #87acb5}#board{background:#87acb5}#controls button{background:#567c85;border-color:#87acb5}#board button{background:#31535c;padding:0;border-radius:8px;position:relative}#board small{position:absolute;right:3px;top:2px;background:#d7c597;color:#534b35;border-radius:3px;padding:1px 3px}

#board small{left:auto;bottom:auto;width:auto}