.bg-app{--bg:#14110e;--ink:#f4efe6;--muted:#b7aa9a;--cream:#f6f1e6;--tile-ink:#1c1712;--gold:#e4b15a;--line:#f4efe61f;--surface:#ffffff09;--sheet:#221c17;--chip:#ffffff0a;min-height:100dvh;color:var(--ink);background:radial-gradient(circle at 12% -10%, #e4b15a29, transparent 32%), radial-gradient(circle at 100% 0%, #165c4847, transparent 34%), var(--bg)}.bg-app[data-theme=light]{--bg:#f4efe4;--ink:#1c1712;--muted:#6b5e52;--cream:#fffaf2;--tile-ink:#1c1712;--gold:#b8862f;--line:#1c171224;--surface:#1c17120b;--sheet:#fffdf8;--chip:#1c17120f;background:radial-gradient(circle at 12% -10%, #b8862f29, transparent 32%), radial-gradient(circle at 100% 0%, #165c481f, transparent 34%), var(--bg)}.bg-table{width:min(76rem,100% - .4rem);min-height:100dvh;padding:max(.35rem, env(safe-area-inset-top)) max(.4rem, env(safe-area-inset-right)) calc(.4rem + env(safe-area-inset-bottom)) max(.4rem, env(safe-area-inset-left));flex-direction:column;gap:.35rem;margin:0 auto;display:flex}.bg-head{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:.6rem;display:flex}.bg-head h1{font-family:var(--font-tile);letter-spacing:-.04em;margin:.15rem 0 0;font-size:clamp(1.8rem,4vw,2.4rem);font-weight:560;line-height:.9}.bg-scores{flex-wrap:wrap;gap:.4rem;width:100%;display:flex}.bg-score{background:var(--chip);white-space:nowrap;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .7rem;display:flex}.bg-score.now{background:#e4b15a29}.bg-score strong{font-variant-numeric:tabular-nums;font-size:1.05rem}.bg-status{text-align:center;min-height:1.45rem;font-family:var(--font-tile);letter-spacing:-.03em;margin:0;font-size:clamp(1.05rem,2.6vw,1.35rem)}.bg-status.is-over{color:var(--gold)}.bg-slot{flex:1;place-items:start center;min-height:16rem;display:grid}.bg-slot.is-locked .bg-point,.bg-slot.is-locked .bg-bar-pile,.bg-slot.is-locked .bg-tray{pointer-events:none}.bg-board{width:100%;height:100%;transition:transform .45s}.bg-board.is-flipped,.bg-board.is-flipped .bg-num,.bg-board.is-flipped .bg-off-count,.bg-board.is-flipped .bg-bar-count,.bg-board.is-flipped .bg-checker em,.bg-board.is-flipped .bg-cube span{transform:rotate(180deg)}.bg-frame{background:repeating-linear-gradient(90deg,#ffffff0b 0 1px,#0000 1px 7px),linear-gradient(165deg,#7a4b2c,#3c2416 42%,#2a170f);border-radius:.95rem;width:100%;height:100%;padding:.42rem;box-shadow:inset 0 0 0 2px #1a0e09,0 18px 36px #00000059}.bg-felt{background:radial-gradient(circle at 50% 0,#ffffff24,#0000 36%),#163f32;border-radius:.5rem;width:100%;height:100%;padding:.28rem;box-shadow:inset 0 0 0 1px #00000073,inset 0 0 24px #00000040}.bg-grid{grid-template-rows:1fr 1fr;grid-template-columns:repeat(6,minmax(0,1fr)) minmax(1.75rem,.82fr) repeat(6,minmax(0,1fr)) minmax(1.3rem,.58fr);gap:.1rem 0;height:100%;display:grid}.bg-point{background:0 0;border:none;min-width:0;min-height:0;padding:0;position:relative}.bg-point:focus-visible,.bg-bar-pile:focus-visible,.bg-tray:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}.bg-tri{pointer-events:none;position:absolute;inset:.12rem .05rem}.edge-top .bg-tri{clip-path:polygon(0 0,100% 0,50% 100%)}.edge-bottom .bg-tri{clip-path:polygon(50% 0,0 100%,100% 100%)}.tone-light .bg-tri{background:linear-gradient(#f7edd8,#e3d0ad)}.edge-bottom.tone-light .bg-tri{background:linear-gradient(#e3d0ad,#f7edd8)}.tone-dark .bg-tri{background:linear-gradient(#a3383c,#6e1f28)}.edge-bottom.tone-dark .bg-tri{background:linear-gradient(#6e1f28,#a3383c)}.bg-point.is-selected{box-shadow:inset 0 0 0 2px var(--gold)}.bg-point.is-target .bg-tri{filter:brightness(1.22)}.bg-point.is-last .bg-tri{filter:saturate(1.15)brightness(1.08)}.bg-num{z-index:2;text-align:center;font-variant-numeric:tabular-nums;pointer-events:none;font-size:.62rem;line-height:1;position:absolute;left:0;right:0}.edge-top .bg-num{top:.18rem}.edge-bottom .bg-num{bottom:.18rem}.tone-light .bg-num{color:#3a24169e}.tone-dark .bg-num{color:#fff4e6c7}.bg-point .bg-stack{pointer-events:none;flex-direction:column;align-items:center;display:flex;position:absolute;inset:.9rem 0 .15rem}.bg-point.edge-bottom .bg-stack{top:.15rem;bottom:.9rem;transform:rotate(180deg)}.bg-checker{aspect-ratio:1;z-index:1;border-radius:50%;flex:none;place-items:center;width:78%;display:grid}.bg-checker.white{color:#3a2a1c;background:radial-gradient(circle at 35% 32%,#fff,#f4e6d0 58%,#cbb892);box-shadow:inset 0 0 0 2px #5a3c1e47,0 2px 3px #00000059}.bg-checker.black{color:#f4efe6;background:radial-gradient(circle at 35% 32%,#4c433b,#1a120e 62%,#070605);box-shadow:inset 0 0 0 2px #e4b15a73,0 2px 3px #00000073}.bg-point.is-source .bg-checker{box-shadow:0 0 0 2px var(--gold), 0 2px 3px #00000059}.bg-point.edge-bottom .bg-checker{transform:rotate(180deg)}.bg-checker.is-lifted{transform:translateY(-3px)}.bg-point.edge-bottom .bg-checker.is-lifted{transform:rotate(180deg)translateY(-3px)}.bg-checker em{font-size:.68rem;font-style:normal;font-weight:760;line-height:1}.bg-point.is-target:after{content:"";background:var(--gold);z-index:3;pointer-events:none;border-radius:50%;width:.62rem;height:.62rem;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 0 0 4px #e4b15a47}.bg-point.edge-top.is-target:after{bottom:16%}.bg-point.edge-bottom.is-target:after{top:16%}.bg-point.is-hit:after{background:0 0;box-shadow:inset 0 0 0 3px #f7f1e6,0 0 0 3px #f7f1e647}.bg-bar{background:radial-gradient(circle at 50% 16%,#e4b15ab3 0 2px,#0000 3px),radial-gradient(circle at 50% 84%,#e4b15ab3 0 2px,#0000 3px),linear-gradient(90deg,#24150e,#4a2e1c 48%,#24150e);border-radius:.35rem;flex-direction:column;grid-area:1/7/span 2;justify-content:space-between;align-items:center;margin:0 .16rem;display:flex;position:relative}.bg-bar-pile{z-index:1;background:0 0;border:none;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.12rem;width:100%;min-height:0;padding:.15rem;display:flex;position:relative}.bg-bar-pile .bg-stack{flex-direction:column;align-items:center;width:100%;display:flex;position:relative}.bg-bar-pile .bg-checker{width:78%}.bg-bar-count,.bg-off-count{font-variant-numeric:tabular-nums;color:#f4efe6db;font-size:.72rem;font-weight:750;line-height:1}.bg-bar-pile.is-selected .bg-checker{transform:translateY(-2px)}.bg-cube{z-index:2;color:#2a1c0c;width:1.7rem;height:1.7rem;font-family:var(--font-tile);background:linear-gradient(145deg,#ffe7a8,#c4923a 55%,#8a6420);border-radius:.28rem;place-items:center;font-weight:650;line-height:1;display:grid;position:absolute;left:50%;box-shadow:0 2px #6d5018,0 8px 12px #00000047}.bg-cube.owner-center{top:50%;transform:translate(-50%,-50%)}.bg-cube.owner-black{top:1.5rem;transform:translate(-50%)}.bg-cube.owner-white{bottom:1.5rem;transform:translate(-50%)}.bg-tray{min-width:0;height:100%;min-height:0;color:inherit;background:#0003;border:none;border-radius:.35rem;flex-direction:column;align-items:center;gap:.12rem;margin-left:.18rem;padding:.18rem;display:flex;overflow:hidden}.bg-tray.edge-top{grid-area:1/14;justify-content:flex-start}.bg-tray.edge-bottom{grid-area:2/14;justify-content:flex-end}.bg-tray-stack{flex-direction:column;align-items:center;width:100%;min-height:0;display:flex;overflow:hidden}.bg-tray .bg-checker{flex:none;width:92%;min-width:0;min-height:0;margin-top:-58%}.bg-tray .bg-checker:first-child{margin-top:0}.bg-tray.is-target{box-shadow:inset 0 0 0 2px var(--gold)}.bg-dock{justify-items:center;gap:.4rem;padding-bottom:.15rem;display:grid}.bg-dice{flex-wrap:wrap;justify-content:center;gap:.4rem;min-height:2.75rem;display:flex}.bg-die{background:linear-gradient(160deg,#fffaf3,#e7d7c0);border-radius:.45rem;grid-template-rows:repeat(3,1fr);grid-template-columns:repeat(3,1fr);width:2.7rem;height:2.7rem;padding:.28rem;display:grid;box-shadow:inset 0 0 0 1px #ffffffb3,0 1px #c8b89a,0 8px 14px #00000047}.bg-die i{border-radius:50%;place-self:center;width:.42rem;height:.42rem}.bg-die i.on{background:#1c1712}.bg-die.is-used{opacity:.38}.bg-die.is-empty{box-shadow:inset 0 0 0 1px var(--line);background:0 0}@keyframes bg-roll{0%{transform:rotate(-14deg)scale(.82)}55%{transform:rotate(8deg)scale(1.06)}to{transform:none}}.bg-die.is-fresh{animation:.42s bg-roll}.bg-actions{flex-wrap:wrap;gap:.4rem;width:min(34rem,100%);display:flex}.bg-actions .deal,.bg-actions .ghost-btn,.bg-actions .text-action{flex:1;width:auto;min-width:7rem;margin-top:0}.bg-direction{text-align:center;margin:0}@media (min-width:960px){.bg-table{grid-template:"head head""status status""board dock"minmax(0,1fr)/minmax(0,1fr) 17rem;align-items:stretch;height:100dvh;min-height:0;display:grid}.bg-head{grid-area:head}.bg-status{text-align:left;grid-area:status}.bg-slot{grid-area:board;place-items:center;min-height:0}.bg-dock{grid-area:dock;align-content:end;justify-items:stretch;padding-bottom:.4rem}.bg-actions{width:100%}}.bg-sheet-back{z-index:20;background:#00000075;place-items:end center;padding:.8rem;display:grid;position:fixed;inset:0}.bg-sheet{background:var(--sheet);border:1px solid var(--line);border-radius:1.25rem 1.25rem 1rem 1rem;width:min(28rem,100%);max-height:min(34rem,100dvh - 1.6rem);padding:1rem 1rem 1.15rem;overflow:auto}.bg-sheet h2{letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin:.85rem 0 .45rem;font-size:.78rem;font-weight:600}:-webkit-any(.bg-app:fullscreen,.bg-app:-webkit-full-screen,.bg-app.is-cover){width:100%;height:100%;min-height:100%;overflow:hidden}:is(.bg-app:fullscreen,.bg-app:fullscreen,.bg-app.is-cover){width:100%;height:100%;min-height:100%;overflow:hidden}.bg-app.is-cover{z-index:40;width:100vw;height:100dvh;position:fixed;inset:0}:-webkit-any(.bg-app:fullscreen .bg-table,.bg-app:-webkit-full-screen .bg-table,.bg-app.is-cover .bg-table){width:100%;max-width:none;height:100%;min-height:0;max-height:100%}:is(.bg-app:fullscreen .bg-table,.bg-app:fullscreen .bg-table,.bg-app.is-cover .bg-table){width:100%;max-width:none;height:100%;min-height:0;max-height:100%}:-webkit-any(.bg-app:fullscreen .bg-direction,.bg-app:-webkit-full-screen .bg-direction,.bg-app.is-cover .bg-direction){display:none}:is(.bg-app:fullscreen .bg-direction,.bg-app:fullscreen .bg-direction,.bg-app.is-cover .bg-direction){display:none}@media (prefers-reduced-motion:reduce){.bg-die.is-fresh{animation:none}.bg-board{transition:none}.bg-checker.is-lifted,.bg-point.edge-bottom .bg-checker.is-lifted{transform:rotate(0)}.bg-point.edge-bottom .bg-checker{transform:rotate(180deg)}}
