.hud-button{--hud-edge:var(--panel-edge);height:calc(var(--game-unit) * 2);padding-inline:calc(var(--game-unit) * .75);border-radius:calc(var(--game-unit) * .75);box-shadow:0 calc(var(--game-unit) * .25) 0 var(--hud-edge);white-space:nowrap;font-size:.9375em;position:relative}.hud-button:active:not(:disabled,[aria-disabled=true]){transform:translateY(calc(var(--game-unit) * .1875));box-shadow:0 calc(var(--game-unit) * .0625) 0 var(--hud-edge);transition-duration:0s}.hud-icon{width:1.5rem;height:1.5rem;display:none}.hud-button--icon{width:calc(var(--game-unit) * 2);padding-inline:0}.hud-button--icon .hud-label{display:none}.hud-button--icon .hud-icon{width:1.25em;height:1.25em;display:block}@media (prefers-reduced-motion:no-preference){.hud-button--icon .hud-icon{transition:transform var(--duration-hover) ease}}.hud-button--icon:hover .hud-icon{transform:rotate(45deg)}.checkers-game{grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:calc(var(--game-unit) * var(--hud-units,2.75)) minmax(0, 1fr);height:100%;min-height:0;color:var(--cream);font-family:var(--body);grid-template-areas:"stats modes controls""board board board";display:grid}.checkers-hud__stats,.checkers-hud__modes,.checkers-hud__controls{font-size:var(--game-unit);align-self:center}.checkers-hud__stats{margin-left:var(--game-unit);grid-area:stats;justify-self:start;gap:1.25em;display:flex}.checkers-hud__controls{margin-right:var(--game-unit);grid-area:controls;justify-self:end;gap:.5em;display:flex}.checkers-hud__modes{grid-area:modes;justify-self:center;gap:.25em;display:flex}.checkers-hud__mode{border-radius:calc(var(--game-unit) * .75);color:var(--cream);font-family:var(--display);white-space:nowrap;padding:.25em .75em;font-weight:600;text-decoration:none}.checkers-hud__mode:hover{background:#0000001f}.checkers-hud__mode[aria-current=page]{color:var(--cream);background:#00000038}.checkers-hud__stat{align-items:baseline;gap:.25em;display:flex}.checkers-hud__stat-label{color:var(--cream);font-size:.875em}.checkers-hud__stat-value{min-width:var(--reading);white-space:nowrap;font-size:1.0625em;font-weight:700;display:inline-grid}.checkers-hud__stat-value>span{grid-area:1/1}.checkers-hud__stat-reserve{visibility:hidden}.checkers-hud__refusal{max-width:calc(var(--game-unit) * 14);color:var(--cream);align-self:center;margin:0;font-size:.875em}.checkers-seats{flex-direction:column;align-items:flex-start;gap:.125em}.checkers-seats__list{flex-wrap:wrap;align-items:center;gap:.25em 1em;margin:0;padding:0;list-style:none;display:flex}.checkers-seats__seat{border-radius:calc(var(--game-unit) * .5);align-items:center;gap:.25em;padding:.125em .5em;font-size:.9375em;display:flex}.checkers-seats__badge{border-radius:calc(var(--game-unit) * .4);background:color-mix(in srgb, var(--accent) 28%, transparent);color:var(--cream);padding:0 .375em;font-size:.8125em;font-weight:700}.checkers-seats__seat[data-acting]{background:color-mix(in srgb, var(--accent) 22%, transparent)}.checkers-seats__seat[data-out]{opacity:.55}.checkers-seats__seat[data-out] .checkers-seats__name{text-decoration:line-through}.checkers-seats__disc{width:1.25em;height:1.25em}.checkers-seats__who{color:var(--cream-soft)}.checkers-seats__who:empty{display:none}.checkers-seats .trick-tag__clock{text-align:right;min-width:2.75ch;font-weight:700}.checkers-seats__note{color:var(--cream);margin:0;font-size:.875em}.checkers{width:100%;height:100%;min-height:0;padding:calc(var(--game-unit) * .5);box-sizing:border-box;isolation:isolate;--checkers-light:#eed9b6;--checkers-dark:#9c5f36;--checkers-edge:#5c3a1e;--checkers-mark:#fff6e3;--checkers-mark-edge:#2b1d05;--checkers-last:#c2853f;grid-area:board;justify-content:center;align-items:center;display:flex;position:relative;container-type:size}.checkers__board{--board:round(down, min(100cqw, 100cqh), calc(var(--size) * 1px));width:var(--board);height:var(--board);background:repeating-conic-gradient(var(--checkers-dark) 0 25%, var(--checkers-light) 0 50%) 0 0 / calc(200% / var(--size)) calc(200% / var(--size));box-shadow:0 0 0 calc(var(--game-unit) * .375) var(--checkers-edge);--focus-ring:var(--checkers-mark);border-radius:2px;flex:none;position:relative}.checkers__square,.checkers__piece{left:calc(var(--column) * 100% / var(--size));top:calc(var(--row) * 100% / var(--size));width:calc(100% / var(--size));height:calc(100% / var(--size));position:absolute}.checkers__square{z-index:1;color:inherit;cursor:default;background:0 0;border:0;border-radius:0;padding:0}.checkers__square:focus-visible{z-index:4;outline:.1875rem solid var(--focus-ring);outline-offset:-.1875rem}.checkers__square[data-last]{background:var(--checkers-last)}.checkers__square[data-path]{background:color-mix(in srgb, var(--checkers-mark) 22%, var(--checkers-dark))}.checkers__square[data-movable],.checkers__square[data-landing],.checkers__square[data-selected]{cursor:pointer}.checkers__square[data-movable]:after,.checkers__square[data-selected]:after{content:"";z-index:3;border:max(2px, calc(var(--board) / var(--size) * .07)) solid var(--accent);pointer-events:none;border-radius:50%;position:absolute;inset:4%}.checkers__square[data-selected]:after{border-color:var(--checkers-mark);box-shadow:0 0 0 max(1px, calc(var(--board) / var(--size) * .03)) var(--checkers-mark-edge);inset:1%}.checkers__square[data-landing]:after{content:"";z-index:3;border:max(1px, calc(var(--board) / var(--size) * .03)) solid var(--checkers-mark-edge);background:var(--checkers-mark);pointer-events:none;border-radius:50%;position:absolute;inset:34%}.checkers__piece{z-index:2;pointer-events:none;place-items:center;display:grid}.checkers__disc{width:86%;height:86%;filter:drop-shadow(0 calc(var(--board) / var(--size) * .03) calc(var(--board) / var(--size) * .03) #00000073);grid-area:1/1;position:relative}.checkers__piece[data-king] .checkers__disc{top:5%}.checkers__piece[data-king] .checkers__crown{top:-7%}.checkers__piece[data-jumped]{opacity:.45}.checkers-end{background:color-mix(in srgb, var(--table-edge) 60%, transparent)}.checkers-end__panel{text-align:center}.checkers-end__title{margin:0 0 .25rem}.checkers-end__reading{color:var(--ink-soft);margin:0 0 1.25rem}.checkers-end__actions{justify-content:center;gap:.75rem;display:flex}.checkers-level .setting{flex-direction:column;align-items:stretch;gap:.5em}.checkers-level .segmented{grid-template-columns:repeat(3,1fr);display:grid}.checkers-level .segmented span{text-align:center;padding-inline:.5em}@media (width<=48rem) and (height>=24rem){.checkers-game{grid-template:"stats""modes""board"minmax(0,1fr)"controls"/minmax(0,1fr)}.checkers-hud__modes{margin-top:-.25rem;padding-bottom:.125rem;font-size:.9375rem;line-height:1.25}.checkers-hud__mode{padding-block:.1875em}.checkers-hud__stats,.checkers-hud__controls{flex-wrap:wrap;justify-content:center;justify-self:center;margin:0;padding-block:.5rem;font-size:1rem}.checkers-hud__stats{gap:.25rem 1rem}.checkers-hud__controls{flex-direction:row-reverse;justify-content:space-evenly;gap:1.5rem .5rem;width:100%;padding-block:.75rem 1.5rem;padding-inline:.5rem}.checkers-seats{align-items:center}.checkers-seats__list{justify-content:center}.checkers-hud__refusal{text-align:center;flex-basis:100%;max-width:none;font-size:.875rem}.checkers-hud__label{color:var(--cream);font-family:var(--body);text-align:center;white-space:nowrap;pointer-events:none;font-size:.625rem;line-height:1;position:absolute;inset:calc(100% + .375rem) -1rem auto}.checkers-hud__icon{display:block}.checkers-hud__button--icon .checkers-hud__icon{width:1.5rem;height:1.5rem}.checkers-hud__button{border-radius:var(--radius-control);width:2.75rem;height:2.75rem;box-shadow:0 .25rem 0 var(--hud-edge);padding-inline:0}.checkers-hud__button:active:not(:disabled,[aria-disabled=true]){box-shadow:0 .0625rem 0 var(--hud-edge);transform:translateY(.1875rem)}.checkers{padding:.375rem}}
