.checkers-game,.checkers-controls,.checkers-board,.checkers-controls>*{box-sizing:border-box;min-width:0;max-width:100%}.checkers-game{display:grid;gap:var(--space-4);width:min(100%,48rem);margin:var(--space-5) auto 0;padding:clamp(var(--space-3),3vw,var(--space-5));background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);box-shadow:var(--shadow-md)}.checkers-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}.checkers-controls label{display:grid;min-width:0;gap:var(--space-1);color:var(--color-ink);font-weight:700}.checkers-controls [hidden]{display:none}.checkers-controls select{width:100%;min-height:2.75rem;padding:0 var(--space-3);color:var(--color-ink);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm)}.checkers-controls select:focus-visible,.checkers-board button:focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}.checkers-controls__actions{display:flex;grid-column:1 / -1;flex-wrap:wrap;gap:var(--space-3)}.checkers-config-note{grid-column:1 / -1;margin:0;color:var(--color-ink-muted);font-size:.875rem}.checkers-score{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-2)}.checkers-score>div{display:grid;min-width:0;gap:.1rem;padding:var(--space-2);text-align:center;background:var(--color-surface-muted);border-radius:var(--radius-sm)}.checkers-score span{color:var(--color-ink-muted);font-size:.8125rem;font-weight:700;overflow-wrap:anywhere}.checkers-score strong{color:var(--color-ink);font-size:1.35rem}.checkers-score small{color:var(--color-ink-muted);font-size:.72rem}.checkers-status,.checkers-capture,.checkers-feedback{min-height:1.5rem;margin:0;text-align:center}.checkers-status{min-height:2lh;color:var(--color-ink);font-weight:850}.checkers-capture{color:#805514;font-weight:750}.checkers-capture[hidden]{display:block;visibility:hidden}.checkers-feedback{color:var(--color-ink-muted)}.checkers-board{position:relative;display:grid;grid-template:repeat(8,minmax(0,1fr)) / repeat(8,minmax(0,1fr));width:min(100%,40rem);aspect-ratio:1;margin-inline:auto;overflow:hidden;border:3px solid #27334a;border-radius:var(--radius-md);background:#29344a;box-shadow:0 .6rem 1.6rem #0f172a2e;touch-action:manipulation}.checkers__square{display:grid;min-width:0;min-height:0;padding:0;place-items:center;border:0;border-radius:0}.checkers__square--light{background:#f1e4cd}.checkers__square--dark{position:relative;background:#50615c;cursor:pointer}.checkers__square--dark[aria-disabled=true]{cursor:default}.checkers__square--dark[aria-disabled=false]:hover{background:#5d716a}.checkers__square.is-legal-origin:after,.checkers__square.is-destination:after{position:absolute;top:8%;right:8%;bottom:8%;left:8%;border:2px dashed #ffe08a;border-radius:50%;content:"";pointer-events:none}.checkers__square.is-destination:after{top:25%;right:25%;bottom:25%;left:25%;border:0;background:#ffe08a;opacity:.78}.checkers__square.is-selected{z-index:1;box-shadow:inset 0 0 0 4px #ffe08a}.checkers__square.is-last-move{box-shadow:inset 0 0 0 3px #69cf9fd6}.checkers__square.is-last-move.is-selected{box-shadow:inset 0 0 0 4px #ffe08a,inset 0 0 0 7px #69cf9fd6}.checkers__piece{z-index:1;display:grid;width:78%;aspect-ratio:1;place-items:center;border:max(2px,.08em) solid rgb(21 29 40 / 46%);border-radius:50%;box-shadow:inset 0 .15rem .25rem #ffffff3b,0 .12rem .18rem #00000047;font-size:clamp(.65rem,4vw,1.2rem);font-weight:950}.checkers__piece--white{color:#44382b;background:linear-gradient(145deg,#fffdf7,#d7c9b4)}.checkers__piece--black{color:#fff;background:linear-gradient(145deg,#566174,#182131)}.checkers__piece--king{box-shadow:inset 0 0 0 2px #d9aa48,inset 0 .15rem .25rem #ffffff38,0 .12rem .18rem #00000047}.checkers-board.is-locked .checkers__piece{opacity:.94}.checkers__moving-piece{position:absolute;z-index:3;width:9.75%;left:var(--checkers-from-x);top:var(--checkers-from-y);pointer-events:none;transform:translate(-50%,-50%);transition:transform .36s cubic-bezier(.22,.8,.26,1);will-change:transform}.checkers__moving-piece.is-moving{transform:translate(calc(-50% + var(--checkers-delta-x)),calc(-50% + var(--checkers-delta-y)))}@media(max-width:40rem){.checkers-controls{grid-template-columns:1fr}.checkers-controls__actions,.checkers-config-note{grid-column:auto}.checkers-controls__actions .button{flex:1 1 10rem}.checkers-board{border-width:2px}}@media(max-width:23rem){.checkers-game{padding-inline:var(--space-2)}.checkers-score>div{padding-inline:var(--space-1)}}@media(prefers-reduced-motion:reduce){.checkers__piece,.checkers__square,.checkers__moving-piece{transition:none!important}}