:root{--color-bg:#f3efe6;--color-surface:#fffdf7;--color-text:#2b2a28;--color-border:#d8d0bf;--color-accent:#7c4a2d;--color-on-accent:#fffdf7;--color-backdrop:#2b2a2873;--radius-m:.5rem;--space-s:.5rem;--space-m:1rem;--space-l:1.5rem;--font-size-display:3rem;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;--size-tap-target:2.75rem;--size-die:2.125rem;--color-game-bg:#2b2521;--color-game-text:#f3e9d6;--color-game-chip:#3b322c;--color-game-accent:#f0c24b;--color-board-frame:#6b4528;--color-board-surface:#d9b67c;--color-board-point-a:#f1dfb6;--color-board-point-b:#8d3a2a;--color-board-bar:#6b4528;--color-board-tray:#5a3921;--color-checker-white:#f6ecd8;--color-checker-white-edge:#b9a07a;--color-checker-black:#2a211d;--color-checker-black-edge:#0e0a08;--color-die-face:#fbf5e6;--color-die-edge:#b9a07a;--color-die-pip:#2a211d;--color-board-selected:#fbf5e64d;--color-board-target:#f0c24b73}*{box-sizing:border-box}html,body{background:var(--color-bg);min-height:100%;color:var(--color-text);font-family:var(--font-sans);margin:0}.screen{place-content:center;justify-items:center;gap:var(--space-l);min-block-size:100dvh;min-inline-size:360px;padding-block:var(--space-l);padding-inline:var(--space-m);text-align:center;display:grid}.home__title{font-size:var(--font-size-display);margin-block:0}.home__actions{gap:var(--space-m);inline-size:min(100%,16rem);display:grid}.button{min-block-size:var(--size-tap-target);padding-block:.625rem;padding-inline:var(--space-l);border:1px solid var(--color-accent);border-radius:var(--radius-m);background:var(--color-surface);color:var(--color-accent);font:inherit;text-align:center;cursor:pointer;justify-content:center;align-items:center;font-weight:600;text-decoration:none;display:inline-flex}.button--primary{background:var(--color-accent);color:var(--color-on-accent)}.button:hover{filter:brightness(1.05)}.dialog__backdrop{padding:var(--space-m);background:var(--color-backdrop);place-items:center;display:grid;position:fixed;inset:0}.dialog{inline-size:min(20rem,100%);padding:var(--space-l);border:1px solid var(--color-border);border-radius:var(--radius-m);background:var(--color-surface);color:var(--color-text);text-align:start}.dialog__title{margin-block:0 var(--space-m)}.dialog__body{margin-block:0 var(--space-l)}.dialog__actions{gap:var(--space-s);justify-content:flex-end;display:flex}.settings-dialog__group{gap:var(--space-s);padding:var(--space-m);border:1px solid var(--color-border);border-radius:var(--radius-m);margin-block-end:var(--space-m);display:grid}.settings-dialog__option{align-items:center;gap:var(--space-s);min-block-size:var(--size-tap-target);display:flex}.settings-dialog__auto-roll{margin-block-end:var(--space-l)}.setup__form{gap:var(--space-m);text-align:start;inline-size:min(100%,18rem);display:grid}.setup__field{gap:var(--space-s);display:grid}.setup__field input{min-block-size:var(--size-tap-target);padding-block:var(--space-s);padding-inline:var(--space-s);border:1px solid var(--color-border);border-radius:var(--radius-m);background:var(--color-surface);color:var(--color-text);font:inherit}.setup__lengths{gap:var(--space-m);padding:var(--space-m);border:1px solid var(--color-border);border-radius:var(--radius-m);margin:0;display:flex}.setup__length{align-items:center;gap:var(--space-s);min-block-size:var(--size-tap-target);display:flex}.game-over__title{margin-block:0}.game-over__winner{margin-block:0;font-size:1.5rem;font-weight:600}.game-over__result{margin-block:0}.game-over__score{gap:var(--space-s);padding:var(--space-m);border:1px solid var(--color-border);border-radius:var(--radius-m);background:var(--color-surface);margin-block:0;list-style:none;display:grid}.game-over__score-row{gap:var(--space-m);justify-content:space-between;display:flex}.game-over__score-name{font-weight:600}.game-over__actions{gap:var(--space-m);inline-size:min(100%,16rem);display:grid}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.game-screen{background:var(--color-game-bg);block-size:100dvh;min-inline-size:360px;color:var(--color-game-text);flex-direction:column;display:flex}.game-screen__board{flex:1;min-block-size:15rem;position:relative}.board{inset:var(--space-s);inline-size:calc(100% - 2 * var(--space-s));block-size:calc(100% - 2 * var(--space-s));display:block;position:absolute}.board__frame{fill:var(--color-board-frame)}.board__surface{fill:var(--color-board-surface)}.board__bar{fill:var(--color-board-bar)}.board__tray{fill:var(--color-board-tray)}.board__column{fill:#0000}.board [role=button]{cursor:pointer}.board [data-selected]>.board__column{fill:var(--color-board-selected)}.board [data-target]>.board__column,.board [data-off][data-target]{fill:var(--color-board-target)}.board__triangle--a{fill:var(--color-board-point-a)}.board__triangle--b{fill:var(--color-board-point-b)}.checker{stroke-width:2.5px}.checker--white{fill:var(--color-checker-white);stroke:var(--color-checker-white-edge)}.checker--black{fill:var(--color-checker-black);stroke:var(--color-checker-black-edge)}.board__count{font-family:var(--font-sans);font-size:22px;font-weight:600}.board__count--on-white{fill:var(--color-checker-black)}.board__count--on-black{fill:var(--color-checker-white)}.player-bar{align-items:center;gap:var(--space-s);min-block-size:calc(var(--size-tap-target) + 2 * var(--space-s));padding-block:var(--space-s);padding-inline:var(--space-m);display:flex}.player-bar__avatar{border-radius:50%;flex-shrink:0;place-items:center;block-size:2.25rem;inline-size:2.25rem;font-size:.9375rem;font-weight:600;display:grid}.player-bar__avatar--white{border:2px solid var(--color-checker-white-edge);background:var(--color-checker-white);color:var(--color-checker-black)}.player-bar__avatar--black{border:2px solid var(--color-game-text);background:var(--color-checker-black);color:var(--color-checker-white)}.player-bar--active .player-bar__avatar{box-shadow:0 0 0 3px var(--color-game-accent)}.player-bar__identity{flex-direction:column;gap:.125rem;min-inline-size:0;display:flex}.player-bar__name{text-overflow:ellipsis;white-space:nowrap;font-size:1rem;overflow:hidden}.player-bar__score{font-variant-numeric:tabular-nums;opacity:.7;font-size:.75rem}.player-bar__spacer{flex:1}.player-bar__undo{min-block-size:var(--size-tap-target);border:1px solid var(--color-board-frame);border-radius:var(--radius-m);background:var(--color-game-chip);color:var(--color-game-text);font:inherit;justify-content:center;align-items:center;gap:.25rem;padding-block:.3125rem;padding-inline:.625rem;font-size:.8125rem;display:flex}.player-bar__undo:enabled{cursor:pointer}.player-bar__undo:enabled:hover{filter:brightness(1.08)}html[dir=rtl] .player-bar__undo-arrow{display:inline-block;transform:scaleX(-1)}.dice-control{min-inline-size:var(--size-tap-target);color:inherit;font:inherit;background:0 0;border:0;flex-direction:column;flex-shrink:0;align-items:center;gap:.125rem;padding:.25rem;display:flex}.dice-control:enabled{cursor:pointer}.dice-control:enabled:hover{filter:brightness(1.08)}.dice-control__dice{gap:.375rem;display:flex}.dice-control__label{opacity:.75;font-size:.75rem}.die{inline-size:var(--size-die);block-size:var(--size-die)}.die--used{opacity:.35}.die__face{fill:var(--color-die-face);stroke:var(--color-die-edge)}.die__pip{fill:var(--color-die-pip)}.game-screen__message{pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.game-screen__message-text{padding-block:var(--space-s);padding-inline:var(--space-m);border-radius:var(--radius-m);background:var(--color-game-chip);color:var(--color-game-text);font-weight:600}.game-screen__menu{inline-size:var(--size-tap-target);block-size:var(--size-tap-target);border-radius:var(--radius-m);background:var(--color-game-chip);color:var(--color-game-text);cursor:pointer;border:0;flex-shrink:0;place-items:center;font-size:1.125rem;display:grid}.game-screen__menu-actions{gap:var(--space-s);display:grid}@media (width<=480px){:root{--size-die:1.75rem}.player-bar{padding-inline:var(--space-s)}}@media (height<=480px){.game-screen__board{min-block-size:12.5rem}}
