:root{--ink:#3a2e14;--ink-soft:#5a4a2a;--ink-faint:#7a6540;--gold:#8b6914;--rule:#c9b98c;--surface:#fffaf0;--felt:#2f6b46;--felt-dark:#255739;--felt-line:#1d4a2e;--disc-black:#23201a;--disc-white:#fbf8f1}*,:before,:after{box-sizing:border-box}html,body{margin:0;padding:0}body{min-height:100vh;color:var(--ink);-webkit-font-smoothing:antialiased;background:linear-gradient(170deg,#faf3e2 0%,#f0e4c5 45%,#f6ecd6 100%);padding:48px 20px;font-family:Georgia,Times New Roman,serif}main{max-width:620px;margin:0 auto}.crumb{color:var(--ink-faint);margin:0 0 20px;font-size:13px}.crumb a{color:var(--ink-faint)}h1{letter-spacing:1px;margin:0 0 16px;font-size:clamp(34px,7vw,48px);font-weight:400}h2{text-transform:uppercase;letter-spacing:2px;color:var(--ink-faint);margin:0 0 14px;font-size:12px;font-weight:400}.lead{color:var(--ink-soft);margin:0 0 32px;font-size:16px;line-height:1.7}.hint{color:var(--ink-faint);margin:10px 0 0;font-size:13px;line-height:1.6}.notice{border-left:3px solid var(--gold);color:var(--ink-soft);background:#fdf6e6;margin:12px 0;padding:10px 14px;font-size:14px;line-height:1.6}.scoreline{justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;display:flex}.tally{border:1px solid #0000;border-radius:999px;align-items:center;gap:8px;padding:6px 12px;transition:border-color .2s,background-color .2s;display:flex}.tally.active{border-color:var(--gold);background:var(--surface)}.pip{border-radius:50%;flex:none;width:16px;height:16px}.pip-black{background:var(--disc-black)}.pip-white{background:var(--disc-white);border:1px solid var(--rule)}.tally-count{text-align:right;min-width:1.4em;font-size:20px}.tally-label{text-transform:uppercase;letter-spacing:1px;color:var(--ink-faint);font-size:12px}.status{text-align:center;color:var(--ink-soft);margin:0;font-size:14px}.board{background:var(--felt-line);border:1px solid var(--felt-line);aspect-ratio:1;border-radius:10px;grid-template-columns:repeat(8,1fr);gap:2px;width:100%;padding:10px;display:grid;box-shadow:0 10px 28px #00000029}.cell{background:var(--felt);cursor:default;font:inherit;color:inherit;border:none;border-radius:2px;justify-content:center;align-items:center;padding:0;transition:background-color .15s;display:flex;position:relative}.cell.playable{cursor:pointer}.cell.playable:hover{background:#3a7d53}.cell:focus-visible{outline:3px solid var(--gold);outline-offset:-3px;z-index:1}.cell.last:after{content:"";pointer-events:none;border:2px solid #ffd67ad9;border-radius:3px;position:absolute;inset:4px}.disc{width:78%;height:78%;transform-style:preserve-3d;border-radius:50%;transition:transform .32s;transform:rotateY(0)scale(0)}.cell[data-state=black] .disc{transform:rotateY(0)scale(1)}.cell[data-state=white] .disc{transform:rotateY(180deg)scale(1)}.disc-face{backface-visibility:hidden;border-radius:50%;position:absolute;inset:11%}.disc-face.black{background:radial-gradient(circle at 35% 30%, #4a453c, var(--disc-black) 70%);box-shadow:inset 0 -2px 4px #00000080}.disc-face.white{background:radial-gradient(circle at 35% 30%,#fff,#e7e0d0 75%);transform:rotateY(180deg);box-shadow:inset 0 -2px 4px #0000002e}.cell.legal:before{content:"";pointer-events:none;background:#ffffff57;border-radius:50%;width:22%;height:22%;position:absolute}body.no-animation .disc,body.no-animation .cell,body.no-animation .tally{transition:none}@media (prefers-reduced-motion:reduce){.disc,.cell,.tally,.button{transition:none}}.panel{border:1px solid var(--rule);background:var(--surface);border-radius:12px;margin-top:34px;padding:20px 22px}.controls{flex-wrap:wrap;align-items:flex-end;gap:12px;display:flex}.field{text-transform:uppercase;letter-spacing:1px;color:var(--ink-faint);flex-direction:column;gap:5px;font-size:12px;display:flex}select{border:1px solid var(--rule);text-transform:none;letter-spacing:normal;color:var(--ink);background:#fff;border-radius:7px;padding:8px 10px;font-family:inherit;font-size:15px}select:focus-visible,.button:focus-visible,input[type=checkbox]:focus-visible{outline:3px solid var(--gold);outline-offset:2px}.button{border:1px solid var(--rule);color:var(--ink);cursor:pointer;background:#fff;border-radius:7px;padding:9px 18px;font-family:inherit;font-size:15px;transition:border-color .18s,background-color .18s}.button:hover{border-color:var(--gold)}.button.primary{background:var(--gold);border-color:var(--gold);color:#fffaf0}.button.primary:hover{background:#75590f}.button.quiet{color:var(--ink-soft);margin-top:16px;font-size:14px}.toggles{flex-wrap:wrap;gap:18px;margin-top:16px;display:flex}.check{color:var(--ink-soft);cursor:pointer;align-items:center;gap:8px;font-size:14px;display:flex}.thinking{text-align:center;color:var(--ink-faint);margin:12px 0 0;font-size:13px;font-style:italic}.moves{color:var(--ink-soft);flex-wrap:wrap;gap:6px 10px;max-height:150px;margin:0;padding:0 0 0 4px;font-size:14px;list-style:none;display:flex;overflow-y:auto}.moves li{font-variant-numeric:tabular-nums;align-items:center;gap:5px;display:flex}.moves .pip{width:10px;height:10px}.moves .empty{color:var(--ink-faint);font-style:italic}.record{border-collapse:collapse;width:100%;font-size:15px}.record th,.record td{text-align:right;border-bottom:1px solid #eadfc4;padding:8px 6px}.record th:first-child,.record td:first-child{text-align:left}.record th{text-transform:uppercase;letter-spacing:1px;color:var(--ink-faint);font-size:11px;font-weight:400}footer{color:var(--ink-faint);margin-top:48px;font-size:13px}footer a{color:var(--ink-faint)}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width<=480px){body{padding:32px 14px}.panel{padding:16px 14px}.scoreline{flex-wrap:wrap}.status{order:3;width:100%}}