/* Checkers reuses the board-first shell and established paper/wood/rust tokens. */
:root:not([data-game="checkers"]) .only-checkers { display: none !important; }
:root[data-game="checkers"] .board-wrap.only-gomoku,
:root[data-game="checkers"] #page-footer .only-gomoku,
:root[data-game="checkers"] #game-faq .only-gomoku,
:root[data-game="checkers"] .rules-list.only-gomoku { display: none !important; }
.ck-wrap { container-type: inline-size; }
.ck-wrap::before, .ck-wrap::after { display: none; }
#checkers-board { position: absolute; inset: 3.2%; display: grid; grid-template-columns: repeat(8, 1fr); grid-template-rows: repeat(8, 1fr); border: 1px solid var(--grid); border-radius: 4px; overflow: hidden; }
.ck-cell { position: relative; display: grid; place-items: center; padding: 0; border: 0; border-radius: 0; cursor: pointer; }
.ck-cell:disabled { cursor: default; opacity: 1; }
.ck-light { background: #ebd6af; }
.ck-dark { background: #98744d; }
.ck-cell:focus-visible { outline: 3px solid var(--ink); outline-offset: -3px; z-index: 1; }
.ck-piece { display: grid; place-items: center; width: 76%; aspect-ratio: 1; border-radius: 50%; pointer-events: none; box-shadow: 0 3px 2px #33271670, inset 0 0 0 3px #ffffff20, inset 0 -4px 0 #00000025; font: 600 6cqw/1 var(--sans); }
.ck-black { background: radial-gradient(circle at 35% 25%, #555953, #232925 70%); color: #f7ead0; }
.ck-white { background: radial-gradient(circle at 35% 25%, #fffdf5, #dfcdaa 80%); color: var(--ink); }
.ck-selected .ck-piece { outline: 3px solid var(--ink); outline-offset: 2px; }
.ck-target::after { content: ''; position: absolute; width: 25%; aspect-ratio: 1; border-radius: 50%; background: var(--ink); opacity: .65; pointer-events: none; }
.ck-target:has(.ck-preview)::after { display: none; }
.ck-preview { opacity: .8; outline: 3px solid var(--accent); outline-offset: 1px; }
.ck-preview-origin .ck-piece { opacity: .35; }
.ck-last { box-shadow: inset 0 0 0 2px var(--accent); }
.ck-hint { width: var(--col); min-height: 20px; margin: 10px 0 0; color: var(--muted); font: 14px/1.45 var(--sans); text-align: center; }