:root{color-scheme:light;font-family:Avenir Next,Trebuchet MS,Segoe UI,sans-serif;line-height:1.45;font-weight:400;--page-bg: #f4efe5;--page-bg-deep: #ebe2d3;--surface: rgba(255, 252, 246, .96);--surface-muted: #f7f1e6;--surface-soft: #fbf7f1;--border: #dacdb7;--border-strong: #c9b696;--text: #24313a;--text-soft: #62717a;--accent: #536f63;--accent-soft: #dde8e0;--warm: #c6835f;--warm-soft: #f3e4da;--sun: #d49a53;--sun-soft: #faecd8;--fern: #7a9a6d;--fern-soft: #e4eddc;--berry: #b36a76;--berry-soft: #f2dfe3;--river: #658aa5;--river-soft: #dee7ef;color:var(--text);background:radial-gradient(circle at top,rgba(255,255,255,.86),transparent 30rem),linear-gradient(180deg,var(--page-bg) 0%,var(--page-bg-deep) 100%)}*{box-sizing:border-box}html{min-height:100%;max-width:100%;overflow-x:clip}body{margin:0;min-width:320px;min-height:100dvh;max-width:100%;overflow-x:clip;color:var(--text);background:radial-gradient(circle at top,rgba(255,255,255,.86),transparent 30rem),linear-gradient(180deg,var(--page-bg) 0%,var(--page-bg-deep) 100%);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}button{font:inherit}button:focus-visible{outline:3px solid rgba(83,111,99,.2);outline-offset:3px}.page-shell{width:min(1220px,calc(100vw - 18px));margin:0 auto;padding:10px 0 14px}.game-panel{min-height:calc(100dvh - 24px);border:1px solid var(--border);border-radius:28px;background:var(--surface);box-shadow:0 18px 42px #24313a14;padding:16px;display:flex;flex-direction:column;gap:14px}.toolbar{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:14px 18px}.title-block{flex:1 1 220px}.eyebrow{margin:0 0 6px;color:var(--text-soft);font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.game-title{margin:0;color:var(--text);font-size:clamp(1.72rem,3vw,2.6rem);line-height:.96;letter-spacing:-.05em}.subtitle{margin:8px 0 0;color:var(--text-soft);font-size:.98rem}.player-strip{display:flex;flex-wrap:wrap;gap:10px;flex:1 1 260px;align-items:stretch}.player-pill{min-width:126px;display:inline-flex;align-items:center;gap:10px;padding:10px 12px;border-radius:18px;border:1px solid var(--border);background:var(--surface-soft);box-shadow:inset 0 1px #ffffffbf;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease}.player-pill.is-current{transform:translateY(-1px);border-color:var(--border-strong);box-shadow:inset 0 1px #fffc,0 10px 22px #24313a14}.player-pill.is-winner{border-color:var(--border-strong);box-shadow:inset 0 1px #ffffffd9,0 12px 24px #24313a1a}.player-pill-token{width:30px;height:30px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:#fffdf8;font-size:.86rem;font-weight:800;box-shadow:inset 0 1px #ffffff40}.player-pill-copy{display:grid;gap:2px}.player-pill-copy strong{font-size:.98rem}.player-pill-copy small{color:var(--text-soft);font-size:.8rem}.toolbar-actions{flex:1 1 360px;display:grid;gap:10px}.player-count-picker,.action-buttons{display:flex;flex-wrap:wrap;gap:10px}.player-count-button,.roll-button,.restart-button,.ghost-button{border-radius:999px;padding:10px 16px;font-weight:700;cursor:pointer;transition:transform .14s ease,background-color .14s ease,color .14s ease,border-color .14s ease,box-shadow .14s ease}.player-count-button:hover,.roll-button:hover,.restart-button:hover,.ghost-button:hover{transform:translateY(-1px)}.player-count-button{border:1px solid var(--border);background:var(--surface-muted);color:var(--text-soft)}.player-count-button.is-active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.roll-button,.restart-button{border:1px solid transparent;color:#fffdf8}.roll-button{background:var(--accent);box-shadow:0 12px 24px #536f632e}.roll-button:hover{background:#476155}.roll-button:disabled{cursor:not-allowed;transform:none;opacity:.55;box-shadow:none}.restart-button{background:var(--warm);box-shadow:0 12px 24px #c6835f2e}.restart-button:hover{background:#b87451}.ghost-button{border:1px solid var(--border);background:var(--surface-muted);color:var(--text)}.play-layout{display:grid;gap:16px;align-items:start}.board-column,.info-column{min-width:0}.board-stage{--stage-inset: 18px;position:relative;width:min(100%,calc(100dvh - 220px),720px);aspect-ratio:1;margin:0 auto;border-radius:28px;border:1px solid var(--border);background:radial-gradient(circle at top,rgba(255,255,255,.75),transparent 60%),linear-gradient(180deg,#f8f3ea,#efe4d3);box-shadow:inset 0 1px #ffffffe0,0 12px 28px #24313a14}.connector-layer,.board{position:absolute;inset:var(--stage-inset)}.connector-layer{width:calc(100% - (var(--stage-inset) * 2));height:calc(100% - (var(--stage-inset) * 2))}.board{display:grid;grid-template-columns:repeat(var(--board-side),minmax(0,1fr));grid-template-rows:repeat(var(--board-side),minmax(0,1fr));gap:8px}.board-cell{position:relative;min-width:0;border-radius:18px;border:1px solid rgba(123,102,75,.12);background:linear-gradient(180deg,#ffffffc7,#f8f1e7f5),var(--surface-soft);box-shadow:inset 0 1px #ffffffb8,0 2px 6px #24313a0a;padding:10px 10px 8px;display:grid;align-content:space-between;overflow:hidden}.board-cell[data-route-kind=ladder]{background:linear-gradient(180deg,#ffffffc7,#faefddfa),var(--surface-soft)}.board-cell[data-route-kind=snake]{background:linear-gradient(180deg,#ffffffc7,#edf6edfa),var(--surface-soft)}.board-cell.is-start{border-color:#d3ba8f}.board-cell.is-finish{border-color:#bf9f5f;background:linear-gradient(180deg,#fffc,#f8e8c3fa),var(--surface-soft)}.square-number{color:var(--text-soft);font-size:.86rem;font-weight:800}.square-badge{justify-self:start;display:inline-flex;align-items:center;min-height:24px;padding:3px 8px;border-radius:999px;background:#ffffffd6;color:var(--text);font-size:.74rem;font-weight:800;letter-spacing:.02em}.token-stack{display:flex;flex-wrap:wrap;align-items:flex-end;gap:6px;min-height:34px}.token{width:28px;height:28px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;color:#fffdf8;font-size:.76rem;font-weight:800;letter-spacing:.02em;box-shadow:inset 0 1px #ffffff47,0 6px 12px #24313a1f}.token.is-current{outline:3px solid rgba(255,255,255,.68);outline-offset:2px}.info-column{display:grid;gap:12px;align-content:start}.status-badge{display:inline-flex;align-items:center;gap:10px;min-height:54px;padding:12px 14px;border-radius:20px;border:1px solid var(--border);background:var(--surface-muted)}.status-badge-dot{width:18px;height:18px;border-radius:999px;background:currentColor;box-shadow:inset 0 1px #ffffff40}.status-badge strong{font-size:1rem;letter-spacing:-.01em}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:10px}.stat-card{padding:12px 14px;border:1px solid var(--border);border-radius:18px;background:var(--surface-muted)}.stat-label{display:block;color:var(--text-soft);font-size:.8rem}.stat-card strong{display:block;margin-top:5px;font-size:1.12rem;letter-spacing:-.03em}.message{min-height:3.4rem;margin:0;color:var(--accent);font-size:1rem;font-weight:700}.hint-text{margin:0;color:var(--text-soft);font-size:.9rem}.connector-rail,.connector-rung{stroke:#b78a5f;stroke-linecap:round}.connector-rail{stroke-width:7}.connector-rung{stroke-width:4}.connector-path{fill:none;stroke:#7c9a6e;stroke-width:10;stroke-linecap:round}.connector-head{fill:#7c9a6e}.connector-eye{fill:#fffdf8}.is-sun{color:#9b692b;background:var(--sun-soft)}.is-sun .player-pill-token,.token.is-sun{background:var(--sun)}.is-fern{color:#4f6d45;background:var(--fern-soft)}.is-fern .player-pill-token,.token.is-fern{background:var(--fern)}.is-berry{color:#7d4750;background:var(--berry-soft)}.is-berry .player-pill-token,.token.is-berry{background:var(--berry)}.is-river{color:#45657e;background:var(--river-soft)}.is-river .player-pill-token,.token.is-river{background:var(--river)}@media(min-width:860px){.game-panel{padding:14px;gap:12px}.toolbar{gap:12px 16px}.play-layout{grid-template-columns:minmax(0,1.16fr) minmax(300px,.84fr);gap:16px}.board-stage{width:min(100%,calc(100dvh - 210px),600px)}.toolbar-actions{justify-items:end}.player-count-picker,.action-buttons{justify-content:flex-end}}@media(min-width:1280px){.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:859px){.toolbar-actions,.player-count-picker,.action-buttons{justify-items:start;justify-content:flex-start}}@media(max-width:700px){.page-shell{width:min(100vw,calc(100vw - 10px));padding:5px 0 8px}.game-panel{min-height:calc(100dvh - 12px);border-radius:22px;padding:12px;gap:12px}.toolbar{gap:10px 12px}.eyebrow{margin-bottom:4px;font-size:.72rem}.game-title{font-size:1.56rem}.subtitle{display:none}.player-strip{gap:8px}.player-strip[data-players="4"]{gap:6px;flex-wrap:nowrap}.player-strip[data-players="4"] .player-pill{min-width:0;flex:1 1 0;gap:5px;padding:8px 6px}.player-strip[data-players="4"] .player-pill-token{width:24px;height:24px;font-size:.72rem}.player-strip[data-players="4"] .player-pill-copy strong{font-size:.8rem}.player-strip[data-players="4"] .player-pill-copy small{font-size:.64rem}.toolbar-actions{gap:6px}.player-count-button,.roll-button,.restart-button,.ghost-button{padding:8px 12px;font-size:.9rem}.player-count-button{min-width:42px;justify-content:center;padding-inline:0}.board-stage{--stage-inset: 12px;width:min(100%,280px);border-radius:22px}.board{gap:6px}.board-cell{border-radius:14px;padding:8px 8px 7px}.player-pill{min-width:88px;padding:8px 9px}.player-pill-token,.token{width:25px;height:25px}.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.stat-card{padding:10px;border-radius:15px}.stat-card strong{font-size:1rem}.status-badge{min-height:48px;padding:10px 12px}.message{min-height:2.9rem;font-size:.94rem}.hint-text{display:none}}@media(min-width:701px)and (max-width:859px){.player-strip[data-players="4"]{gap:8px}.player-strip[data-players="4"] .player-pill{min-width:0;flex:1 1 calc((100% - 24px)/4);gap:6px;padding:10px 8px}.player-strip[data-players="4"] .player-pill-token{width:26px;height:26px;font-size:.76rem}.player-strip[data-players="4"] .player-pill-copy strong{font-size:.86rem}.player-strip[data-players="4"] .player-pill-copy small{font-size:.7rem}.board-stage{width:min(100%,560px)}.stats-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.message{min-height:3rem}.hint-text{display:none}}