.dice-stage{--die-size:clamp(126px, 19vw, 176px);--die-half-size:calc(var(--die-size) * .5);appearance:none;width:min(100%,760px);min-height:clamp(390px,47vw,530px);color:inherit;contain:layout style;cursor:pointer;isolation:isolate;perspective:1400px;text-align:initial;touch-action:manipulation;background:0 0;border:0;place-items:center;margin:0;padding:clamp(54px,8vw,96px) clamp(22px,5vw,56px);display:grid;position:relative}.dice-stage:disabled{cursor:default}.dice-stage:before{z-index:-2;content:"";pointer-events:none;background:radial-gradient(circle at 42% 36%,#ffffffd1,#0000 28%),radial-gradient(circle at 58% 62%,#61707d1a,#0000 58%),radial-gradient(at 50% 82%,#19212814,#0000 55%);border-radius:50%;position:absolute;inset:8% 4% 5%}.dice-set{grid-template-columns:repeat(2, var(--die-size));transform-style:preserve-3d;transition:transform .22s var(--ease-premium);align-items:center;gap:clamp(48px,10vw,104px);display:grid;position:relative}.dice-stage:not(:disabled):hover .dice-set{transform:translateY(-3px)scale(1.008)}.dice-stage[data-variant="1"] .premium-die:first-child{--dice-arc-x:25px;--dice-return-x:6px}.dice-stage[data-variant="1"] .premium-die:nth-child(2){--dice-arc-x:-38px;--dice-return-x:-14px}.dice-stage[data-variant="2"] .premium-die:first-child{--dice-arc-x:39px;--dice-return-x:14px}.dice-stage[data-variant="2"] .premium-die:nth-child(2){--dice-arc-x:-24px;--dice-return-x:-5px}.dice-flight,.dice-camera,.dice-cube{transform-style:preserve-3d;display:block;position:absolute;inset:0}.dice-camera{transform:rotateX(var(--dice-pose-x)) rotateY(var(--dice-pose-y)) rotateZ(var(--dice-pose-z))}.dice-cube{transform:rotateX(var(--dice-result-x)) rotateY(var(--dice-result-y)) rotateZ(var(--dice-result-z))}.dice-face{backface-visibility:hidden;background:radial-gradient(circle at 25% 18%,#fffffffa,#0000 32%),linear-gradient(145deg,#fffefa 0%,#f7f3ea 48%,#ddd5c7 100%);border:1px solid #72695b3d;border-radius:9%;display:block;position:absolute;inset:0;overflow:hidden;box-shadow:inset 0 0 0 3px #ffffff8f,inset -12px -15px 24px #5e523f29,inset 10px 10px 20px #ffffff9e}.dice-face:before,.dice-face:after{content:"";pointer-events:none;border-radius:7%;position:absolute}.dice-face:before{border:1px solid #ffffffb8;inset:4%;box-shadow:inset 0 0 0 1px #4b453c14}.dice-face:after{opacity:.64;background:linear-gradient(116deg,#0000 24%,#ffffff6b 39%,#0000 53%),radial-gradient(circle at 72% 78%,#5c503e1c,#0000 42%);inset:0}.dice-face[data-face=front]{transform:translateZ(var(--die-half-size))}.dice-face[data-face=back]{transform:rotateY(180deg) translateZ(var(--die-half-size))}.dice-face[data-face=right]{transform:rotateY(90deg) translateZ(var(--die-half-size))}.dice-face[data-face=left]{transform:rotateY(-90deg) translateZ(var(--die-half-size))}.dice-face[data-face=top]{transform:rotateX(90deg) translateZ(var(--die-half-size))}.dice-face[data-face=bottom]{transform:rotateX(-90deg) translateZ(var(--die-half-size))}.dice-pip{--pip-x:50%;--pip-y:50%;top:var(--pip-y);left:var(--pip-x);z-index:2;aspect-ratio:1;background:radial-gradient(circle at 34% 28%,#65707a 0 7%,#1c2329 31%,#050709 70%);border:1px solid #00000061;border-radius:50%;width:13.5%;display:block;position:absolute;transform:translate(-50%,-50%);box-shadow:inset 1px 2px 3px #000000b8,inset -1px -1px 2px #ffffff24,0 1px #ffffff8a}.dice-pip-top-left,.dice-pip-middle-left,.dice-pip-bottom-left{--pip-x:27%}.dice-pip-top-right,.dice-pip-middle-right,.dice-pip-bottom-right{--pip-x:73%}.dice-pip-top-left,.dice-pip-top-right{--pip-y:27%}.dice-pip-bottom-left,.dice-pip-bottom-right{--pip-y:73%}.dice-ground-shadow{z-index:-1;opacity:.76;transform-origin:50%;background:radial-gradient(#171d2247 0 18%,#171d221f 45%,#0000 73%);border-radius:50%;height:43%;display:block;position:absolute;bottom:-31%;left:-15%;right:-15%;transform:scaleY(.42)}.dice-stage[data-rolling=true] .premium-die:first-child .dice-flight{will-change:transform;animation:2.4s linear both dice-flight-left}.dice-stage[data-rolling=true] .premium-die:nth-child(2) .dice-flight{will-change:transform;animation:2.4s linear both dice-flight-right}.dice-stage[data-rolling=true] .premium-die:first-child .dice-camera{will-change:transform;animation:2.4s linear both dice-tumble-left}.dice-stage[data-rolling=true] .premium-die:nth-child(2) .dice-camera{will-change:transform;animation:2.4s linear both dice-tumble-right}.dice-stage[data-rolling=true] .dice-ground-shadow{will-change:opacity, transform;animation:2.4s linear both dice-moving-shadow}.dice-equation{font-variant-numeric:tabular-nums}@media (max-width:600px){.dice-stage{--die-size:clamp(104px, 30vw, 124px);min-height:340px;padding:60px 12px 66px}.dice-set{gap:clamp(28px,9vw,44px)}}.table-outcome .dice-equation{color:var(--table-ink-soft);font-family:var(--font-display), var(--font-ui), sans-serif;letter-spacing:.06em;font-size:clamp(.95rem,1.4vw,1.15rem);font-weight:500}.table-page .dice-stage{--die-size:clamp(88px, min(25vw, calc(100svh - 580px)), 172px);min-height:clamp(220px,min(28vw,100svh - 440px),360px);padding-block:clamp(28px,4vw,56px)}.table-page .dice-stage:before{background:radial-gradient(at 50% 60%,#00000047,#0000 62%);inset:14% 10% 4%}.poly-set{flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(14px,2.4vw,26px);max-width:100%;display:flex}.poly-die{--die-color:#f4ede0;--die-ink:#2a190c;--poly-size:clamp(64px, 9vw, 104px);width:var(--poly-size);aspect-ratio:1;filter:drop-shadow(0 10px 10px #00000073);rotate:calc((var(--die-index,0) * 41 % 17 - 8) * 1deg);place-items:center;display:grid;position:relative}.poly-set[data-count="1"] .poly-die{--poly-size:clamp(120px, 16vw, 170px)}.poly-die:before{background:radial-gradient(circle at 34% 28%, #ffffff8c, transparent 42%), linear-gradient(150deg, color-mix(in srgb, var(--die-color), white 18%), var(--die-color) 55%, color-mix(in srgb, var(--die-color), black 22%));content:"";position:absolute;inset:0}.poly-die b{color:var(--die-ink);font-family:var(--font-display), var(--font-ui), sans-serif;font-size:calc(var(--poly-size) * .36);font-variant-numeric:tabular-nums;line-height:1;position:relative}.poly-die[data-sides="4"]{--die-color:#c8413a;--die-ink:#fff4ec}.poly-die[data-sides="4"]:before{clip-path:polygon(50% 4%,97% 92%,3% 92%)}.poly-die[data-sides="4"] b{translate:0 18%}.poly-die[data-sides="6"]{--die-color:#f4ede0}.poly-die[data-sides="6"]:before{border-radius:18%}.poly-die[data-sides="8"]{--die-color:#2f6db3;--die-ink:#f2f7ff}.poly-die[data-sides="8"]:before{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%)}.poly-die[data-sides="10"]{--die-color:#2f8f5b;--die-ink:#f1fff6}.poly-die[data-sides="10"]:before{clip-path:polygon(50% 0,98% 42%,50% 100%,2% 42%)}.poly-die[data-sides="10"] b{translate:0 -6%}.poly-die[data-sides="12"]{--die-color:#6c3fa0;--die-ink:#f7f1ff}.poly-die[data-sides="12"]:before{clip-path:polygon(50% 0,100% 38%,81% 100%,19% 100%,0 38%)}.poly-die[data-sides="12"] b{translate:0 8%}.poly-die[data-sides="20"]{--die-color:#d9a21b;--die-ink:#2a190c}.poly-die[data-sides="20"]:before{clip-path:polygon(50% 0,94% 25%,94% 75%,50% 100%,6% 75%,6% 25%)}.poly-die[data-sides="100"]{--die-color:#1f7a85;--die-ink:#effcfd}.poly-die[data-sides="100"]:before{border-radius:50%}.poly-die[data-sides="100"] b{font-size:calc(var(--poly-size) * .3)}.poly-stage[data-rolling=true] .poly-die{animation:.9s cubic-bezier(.2,.8,.3,1) both poly-tumble;animation-delay:calc(var(--die-index,0) * 40ms)}.poly-stage[data-rolling=true] .poly-die b{opacity:0}.dice-types{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;display:grid}.dice-types button{border:1px solid var(--line);border-radius:var(--radius);background:color-mix(in srgb, var(--paper), transparent 4%);min-height:40px;color:var(--ink);cursor:pointer;font-weight:800}.dice-types button[aria-pressed=true]{color:#2a190c;background:#f3e4c4;border-color:#6e452a}.dice-types button:disabled{cursor:not-allowed;opacity:.6}@media (prefers-reduced-motion:reduce){.poly-stage[data-rolling=true] .poly-die{animation:none}}.table-panel .dice-reset{white-space:normal;text-align:center;width:100%;min-width:0}@keyframes dice-flight-left{0%{transform:translate3d(-38px,12px,-40px)scale(.93)rotate(-5deg)}9%{transform:translate3d(-18px,-36px,30px)scale(1)rotate(-1deg)}42%{transform:translate3d(var(--dice-arc-x), -118px, 120px) scale(1.035) rotateZ(8deg)}64%{transform:translate3d(var(--dice-return-x), -66px, 72px) scale(1.02) rotateZ(3deg)}76%{transform:translate(-7px,5px)scale(1.04,.94)rotate(-1deg)}84%{transform:translate3d(5px,-28px,30px)scale(1.012)rotate(1deg)}93%{transform:translate(-3px,2px)scale(1.012,.982)}to{transform:translate(0,0)scale(1)}}@keyframes dice-flight-right{0%{transform:translate3d(42px,16px,-52px)scale(.91)rotate(6deg)}11%{transform:translate3d(21px,-43px,24px)scale(1)rotate(2deg)}39%{transform:translate3d(var(--dice-arc-x), -104px, 108px) scale(1.028) rotateZ(-9deg)}62%{transform:translate3d(var(--dice-return-x), -76px, 84px) scale(1.02) rotateZ(-3deg)}74%{transform:translate(8px,6px)scale(1.045,.935)rotate(1deg)}83%{transform:translate3d(-6px,-34px,34px)scale(1.015)rotate(-1deg)}92%{transform:translate(3px,2px)scale(1.01,.984)}to{transform:translate(0,0)scale(1)}}@keyframes dice-tumble-left{0%{transform:rotateX(var(--dice-pose-x)) rotateY(var(--dice-pose-y)) rotateZ(var(--dice-pose-z))}10%{transform:rotateX(214deg)rotateY(286deg)rotate(82deg)}46%{transform:rotateX(782deg)rotateY(846deg)rotate(326deg)}70%{transform:rotateX(1190deg)rotateY(1252deg)rotate(574deg)}84%{transform:rotateX(1354deg)rotateY(1398deg)rotate(678deg)}93%{transform:rotateX(1402deg)rotateY(1454deg)rotate(708deg)}to{transform:rotateX(calc(var(--dice-pose-x) + 1440deg)) rotateY(calc(var(--dice-pose-y) + 1440deg)) rotateZ(calc(var(--dice-pose-z) + 720deg))}}@keyframes dice-tumble-right{0%{transform:rotateX(var(--dice-pose-x)) rotateY(var(--dice-pose-y)) rotateZ(var(--dice-pose-z))}11%{transform:rotateX(-238deg)rotateY(-272deg)rotate(-88deg)}43%{transform:rotateX(-748deg)rotateY(-836deg)rotate(-338deg)}68%{transform:rotateX(-1176deg)rotateY(-1238deg)rotate(-568deg)}83%{transform:rotateX(-1342deg)rotateY(-1382deg)rotate(-674deg)}92%{transform:rotateX(-1410deg)rotateY(-1442deg)rotate(-706deg)}to{transform:rotateX(calc(var(--dice-pose-x) - 1440deg)) rotateY(calc(var(--dice-pose-y) - 1440deg)) rotateZ(calc(var(--dice-pose-z) - 720deg))}}@keyframes dice-moving-shadow{0%{opacity:.58;transform:translate(0)scale(.78,.34)}42%{opacity:.16;transform:translate(0)scale(.42,.24)}74%{opacity:.9;transform:translate(0)scale(1.08,.46)}84%{opacity:.4;transform:translate(0)scale(.7,.31)}to{opacity:.76;transform:translate(0)scaleY(.42)}}@keyframes poly-tumble{0%{opacity:0;transform:translate(-40px,-70px)rotate(-200deg)scale(.7)}55%{opacity:1;transform:translate(6px,8px)rotate(25deg)scale(1.04)}75%{transform:translate(-3px,-6px)rotate(-8deg)}to{transform:none}}
