.bg-game{max-width:900px;margin:0 auto;--bg-frame:#354760;--bg-field:#e8dfcf;--bg-point-a:#be7954;--bg-point-b:#8096ad;--bg-ink:#19263a;--bg-accent:#9e431b}.bg-player-line{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0;font-size:14px}.bg-player{display:inline-flex;align-items:center;gap:8px;padding:5px 10px;border-radius:20px}.bg-player.is-current{background:#253249;color:#fff}.bg-player>.bg-checker{width:22px;height:22px;flex:none}.bg-stats{display:flex;gap:16px;color:#34435b;font-size:13px}.bg-game .bg-status{margin:8px 0 14px;min-height:1.4em}.bg-board{display:grid;position:relative;grid-template-columns:minmax(0,1fr) 5% minmax(0,1fr) 6.5%;grid-template-rows:minmax(0,1fr) 64px minmax(0,1fr);aspect-ratio:1.7;min-height:290px;border:9px solid var(--bg-frame);border-radius:9px;background:var(--bg-field);box-shadow:0 5px 14px #14213722;overflow:hidden}.bg-quadrant{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:2px;padding:0 4px;min-width:0;min-height:0}.bg-q1{grid-area:1/1}.bg-q2{grid-area:1/3}.bg-q3{grid-area:3/1}.bg-q4{grid-area:3/3}.table .bg-point{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-width:0;min-height:0;width:100%;height:100%;padding:20px 1px 0;border:0;border-radius:0;background:transparent;color:var(--bg-ink);isolation:isolate}.table .bg-point:before{position:absolute;inset:17px 0 0;content:'';clip-path:polygon(0 0,100% 0,50% 100%);z-index:-1;background:var(--bg-point-a)}.table .bg-point.is-even:before{background:var(--bg-point-b)}.bg-bottom .bg-point{justify-content:flex-end;padding:0 1px 20px}.bg-bottom .bg-point:before{inset:0 0 17px;clip-path:polygon(50% 0,100% 100%,0 100%)}.bg-point-number{position:absolute;top:2px;left:0;right:0;text-align:center;font:700 12px/1 Arial}.bg-bottom .bg-point-number{top:auto;bottom:2px}.bg-stack{display:flex;flex-direction:column;align-items:center;width:100%;position:relative;z-index:2}.bg-bottom .bg-stack{flex-direction:column-reverse}.bg-checker{box-sizing:border-box;display:block;width:min(100%,50px);aspect-ratio:1;flex:none;border-radius:50%;border:2px solid #24334b;box-shadow:inset 0 0 0 3px #ffffff33,0 2px 3px #14213755;position:relative;background:#fbf5e9}.bg-stack .bg-checker+.bg-checker{margin-top:-13%}.bg-bottom .bg-stack .bg-checker+.bg-checker{margin-top:0;margin-bottom:-13%}.bg-checker.is-dark,.is-dark>.bg-checker{background:#22334d;border-color:#111e33;color:#fff9ee}.bg-checker.is-light,.is-light>.bg-checker{background:#fbf5e9;border-color:#5a626c;color:#19263a}.bg-checker b{position:absolute;inset:0;display:grid;place-items:center;font:700 clamp(10px,1.7cqw,16px)/1 Arial}.table .bg-board button:disabled{opacity:1;filter:none;cursor:default}.table .bg-board button.is-source{cursor:pointer}.table .bg-point.is-source .bg-stack>.bg-checker:last-child{box-shadow:inset 0 0 0 2px #ffffff80,0 0 0 2px #a14920,0 2px 3px #14213766}.table .bg-board .is-selected{outline:3px solid var(--bg-accent);outline-offset:-3px}.table .bg-point.is-selected{background:#edbd7780}.table .bg-point.is-target{background:#f6c383aa;cursor:pointer;box-shadow:inset 0 0 0 3px var(--bg-accent)}.bg-target-mark{position:absolute;top:63%;font-size:18px;color:#7b3216}.bg-bottom .bg-target-mark{top:23%}.table .bg-point.is-last:after{content:'';position:absolute;inset:0 0 auto;height:4px;background:#9e431b}.bg-bottom .bg-point.is-last:after{inset:auto 0 0}.table .bg-board button:focus-visible{outline:3px solid #9e431b;outline-offset:-3px;z-index:4}.bg-bar{grid-area:1/2/4/3;background:var(--bg-frame);display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:14px 3px;min-width:0;z-index:2}.bg-bar-label{color:#faf7ef;font:700 10px/1 Arial;letter-spacing:.5px}.table .bg-bar-stack{border:0;background:transparent;color:#fff;min-height:80px;width:100%;min-width:0;padding:3px 0;font-size:12px}.bg-bar-stack .bg-stack{margin-bottom:4px}.bg-bar-stack .bg-checker{border-width:1px}.table .bg-bar-stack.is-source{outline:2px solid #ffc17d;outline-offset:-2px}.bg-off-trays{grid-area:1/4/4/5;display:flex;flex-direction:column;gap:34px;padding:5px 3px;background:var(--bg-frame);min-width:0}.table .bg-off{flex:1;min-width:0;min-height:0;width:100%;padding:8px 1px;background:#d9d0c1;border:1px solid #1a2a42;border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:5px;color:var(--bg-ink);font-size:11px}.bg-off-stack{display:flex;flex-direction:column-reverse;gap:2px;justify-content:flex-start;width:100%;min-height:0;flex:1}.bg-off-stack i{height:7px;min-height:3px;border-radius:3px;border:1px solid #657188;background:#faf5e9}.bg-off-stack.is-dark i{background:#24354f;border-color:#12223c}.table .bg-off.is-target{background:#f6c383;outline:3px solid #a14920;outline-offset:-3px;cursor:pointer}.bg-dice{grid-area:2/1;display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;font-size:12px}.table .bg-die{width:40px;height:40px;min-height:0;min-width:0;flex:0 1 40px;padding:6px;background:#fffaf0;color:#24354b;border:1px solid #6d7788;border-radius:7px;box-shadow:0 2px 3px #24354b33}.table .bg-die.is-used{opacity:.38;box-shadow:none}.bg-die-pips{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:2px;height:100%}.bg-die-pips i{border-radius:50%}.bg-die-pips .is-pip{background:#24354b}.bg-roll-note{grid-area:2/3;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-size:13px;line-height:1.5}.bg-roll-note small{font-size:11px}.bg-controls{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:16px 0 10px}.bg-controls button{padding:10px 20px;min-height:42px}.bg-notice,.bg-last,.bg-help,.bg-mobile-tip{text-align:center;font-size:13px;line-height:1.5;margin:8px 0}.bg-notice{min-height:1.5em}.bg-last{font-weight:700}.bg-help{color:#526078;font-size:12px}.bg-mobile-tip{display:none;color:#526078;font-size:11px}
@container(max-width:600px){.bg-board{border-width:5px;grid-template-rows:minmax(0,1fr) 49px minmax(0,1fr);grid-template-columns:minmax(0,1fr) 6% minmax(0,1fr) 8%;min-height:280px}.bg-quadrant{gap:0;padding:0 2px}.table .bg-point{padding-top:17px}.bg-bottom .bg-point{padding:0 1px 17px}.bg-point-number{font-size:10px}.bg-checker{border-width:1px;box-shadow:inset 0 0 0 2px #ffffff33,0 1px 2px #14213755}.bg-player-line{font-size:12px;gap:5px}.bg-player{padding:4px 5px;gap:5px}.bg-player>.bg-checker{width:17px;height:17px}.bg-stats{gap:8px;font-size:11px}.bg-dice{gap:3px}.table .bg-die{width:29px;height:29px;flex-basis:29px;padding:4px;border-radius:5px}.bg-roll-note{font-size:11px}.bg-bar{padding:10px 1px}.bg-bar-label{font-size:8px;letter-spacing:0}.bg-off-trays{padding:3px 1px;gap:26px}.table .bg-off{font-size:9px;padding:6px 0}.bg-off-stack i{height:5px}.bg-mobile-tip{display:block}}
@container(max-width:360px){.bg-board{min-height:255px;border-width:4px}.bg-player-line{font-size:11px}.bg-stats{font-size:10px;gap:5px}.table .bg-die{width:23px;height:25px;flex-basis:23px;padding:3px}.bg-dice{gap:2px}.bg-checker b{font-size:10px}.bg-roll-note{font-size:10px}.bg-off strong{font-size:9px}}
.bg-stack .bg-checker{width:min(100%,38px)}.bg-stack .bg-checker+.bg-checker{margin-top:-45%}.bg-bottom .bg-stack .bg-checker+.bg-checker{margin-top:0;margin-bottom:-45%}
@container(min-width:800px){.bg-stack .bg-checker{width:min(100%,48px)}}
.bg-game{container-type:inline-size;min-width:0;width:100%}.bg-board{box-sizing:border-box;width:100%}
@media(min-width:700px){.bg-game{max-width:clamp(520px,calc(170svh - 731px),900px)}}