:root{color-scheme:dark;font-family:system-ui,-apple-system,sans-serif;color:#e9eedf;background:#102b32}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 15% 0,#214a50,transparent 70%),#102b32}main{max-width:1160px;margin:auto;padding:32px 28px}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}h1{font:500 clamp(30px,4vw,48px) Georgia,serif;margin:6px 0 8px;letter-spacing:-1.5px}.eyebrow{font-size:10px;letter-spacing:2.5px;color:#a9c4bd;font-weight:700}.lede{font:17px Georgia,serif;color:#bbd0c9;margin:0}.edition{font-size:10px;line-height:1.7;letter-spacing:2px;border:1px solid #537073;border-radius:50%;width:86px;height:86px;display:grid;place-content:center;text-align:center}.layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,1fr);gap:32px}.tabletop{background:#162d36 url('linen.webp') center/cover;border:1px solid #56716c;border-radius:28px;box-shadow:0 24px 50px #041b2455;padding:10px}.board-wrap{position:relative;width:100%;max-width:600px;margin:auto;aspect-ratio:600/682}canvas{width:100%;height:100%;display:block}#cells{position:absolute;inset:0}.cell{position:absolute;border:0!important;background:transparent!important;box-shadow:none!important;border-radius:50%;width:6%;height:5.3%;padding:0;transform:translate(-50%,-50%);min-height:0!important}.cell:focus-visible{outline:3px solid #fff;outline-offset:1px}.legend{display:flex;justify-content:center;gap:20px;font-size:11px;color:#b5d0c8;margin-top:16px}.legend span{display:flex;align-items:center;gap:7px}i{width:10px;height:10px;border-radius:100%}.jade{background:#5fd2be}.coral{background:#f6a78e}aside{padding:8px 0}h2{font:28px Georgia,serif;margin:8px 0 12px}#message{min-height:48px;color:#c5d9d3;font-size:14px;line-height:1.6}.score{display:flex;border-top:1px solid #39575b;border-bottom:1px solid #39575b;padding:17px 0;gap:42px;margin:20px 0}.score strong{font:27px Georgia,serif;display:block}.score span{font-size:11px;color:#9fbbb6;letter-spacing:.5px}.controls{display:grid;gap:12px}label{font-size:11px;color:#a5c1b8;display:grid;gap:6px}select,button{font:inherit;color:#e8eee3;border:1px solid #52716e;background:#203f46;border-radius:9px;padding:11px 12px;min-height:42px}select{width:100%;font-size:13px}button{cursor:pointer;font-size:12px}button:hover{background:#31565b}button:disabled{opacity:.45;cursor:default}.primary{background:#d8e4b7;color:#183b3d;border-color:#d8e4b7;font-weight:700}.primary:hover{background:#e8efcd}.row{display:flex;gap:8px}.row button{flex:1}.history{font-size:11px;color:#a6c0b6;margin:18px 0;line-height:1.7}details{border-top:1px solid #39575b;padding-top:16px;font-size:12px;line-height:1.7;color:#b7cec5}summary{cursor:pointer;color:#ecedda;font-size:13px}details p{margin:10px 0}.save{font-size:10px;color:#91b3a9}footer{margin-top:30px;padding-top:20px;border-top:1px solid #39575b;color:#86aaa4;font-size:10px;line-height:2}a{color:#b6d2bd}button:focus-visible,select:focus-visible{outline:3px solid #efca78;outline-offset:3px}@media(max-width:760px){main{padding:20px 14px}.layout{grid-template-columns:1fr;gap:18px}header{margin-bottom:20px}.edition{width:65px;height:65px;font-size:8px}.lede{font-size:14px}.tabletop{padding:5px;border-radius:20px}aside{padding:0 8px}.legend{gap:14px;font-size:10px}#message{min-height:0}.score{margin:14px 0}.board-wrap{max-width:480px}footer{margin-top:22px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
