@layer components{.cd-stage{--die:calc(var(--space-8) + var(--space-3));--coin:min(calc(var(--space-9) * 2 + var(--space-5)), 60cqi)}.cd-table{perspective:calc(var(--wheel-max) * 2);cursor:pointer;container-type:inline-size}.cd-coin-wrap{width:var(--coin);aspect-ratio:1;place-items:center;display:grid;position:relative}.cd-coin{width:100%;height:100%;transform-style:preserve-3d;position:relative;transform:rotateX(0)}.cd-coin.is-tails{transform:rotateX(180deg)}.cd-coin__face{-webkit-backface-visibility:hidden;backface-visibility:hidden;width:100%;height:100%;position:absolute;inset:0}.cd-coin__face--tails{transform:rotateX(180deg)}.cd-coin__disc{stroke:var(--color-text);stroke-width:1.5px}.cd-coin__face--heads .cd-coin__disc{fill:var(--color-accent)}.cd-coin__face--tails .cd-coin__disc{fill:var(--color-indigo)}.cd-coin__ring{fill:none;stroke:var(--color-surface);stroke-width:2.5px;stroke-dasharray:3 2.2}.cd-coin__ink,.cd-coin__ink path{fill:none;stroke:var(--color-surface);stroke-width:6px;stroke-linecap:square;stroke-linejoin:miter}.cd-coin__face--tails .cd-coin__ink path{stroke-width:4px;stroke-linejoin:round}.cd-shadow{bottom:calc(var(--space-4) * -1);width:70%;height:var(--space-2);border-radius:var(--radius-full);background:var(--color-text);opacity:.12;position:absolute}.cd-stage[data-phase=rolling] .cd-shadow{animation:cd-shadow var(--dur-celebrate) var(--ease-in-out)}@keyframes cd-shadow{45%{opacity:.05;transform:scale(.6)}}.cd-dice{justify-content:center;align-items:center;gap:var(--space-5);flex-wrap:wrap;max-width:100%;display:flex}.cd-dice--5,.cd-dice--6{gap:var(--space-4)}.cd-die-wrap{width:var(--die);height:var(--die);transform-style:preserve-3d;transform:perspective(calc(var(--die) * 6)) rotateX(-16deg) rotateY(-20deg)}.cd-shape-wrap{transform:none}.cd-cube{width:100%;height:100%;transform-style:preserve-3d;position:relative}.cd-cube__side{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute;inset:0}.cd-cube__side--1{transform:translateZ(calc(var(--die) / 2))}.cd-cube__side--6{transform:rotateY(180deg) translateZ(calc(var(--die) / 2))}.cd-cube__side--2{transform:rotateX(90deg) translateZ(calc(var(--die) / 2))}.cd-cube__side--5{transform:rotateX(-90deg) translateZ(calc(var(--die) / 2))}.cd-cube__side--3{transform:rotateY(90deg) translateZ(calc(var(--die) / 2))}.cd-cube__side--4{transform:rotateY(-90deg) translateZ(calc(var(--die) / 2))}.cd-face{width:100%;height:100%;display:block}.cd-face__paper{fill:var(--color-surface);stroke:var(--color-text);stroke-width:3px}.cd-face__pip{fill:var(--color-text)}.cd-face__pip--one{fill:var(--color-accent)}.cd-shape{width:100%;height:100%;display:block;overflow:visible}.cd-shape__paper{fill:var(--color-surface);stroke:var(--color-text);stroke-width:3px;stroke-linejoin:round}.cd-shape__line{fill:none;stroke:var(--color-border-strong);stroke-width:1.5px}.cd-shape__num{fill:var(--color-text);font-weight:var(--weight-heavy);font-family:inherit}.cd-shape-wrap:not(.is-landed) .cd-shape__num{opacity:0}.cd-shape-wrap.is-landed .cd-shape__num{animation:reveal-fade var(--dur-3) var(--ease-out) both}.cd-result{justify-items:center;gap:var(--space-1);min-height:calc(var(--text-3xl) * var(--leading-title-cjk) + var(--space-5));display:grid}.cd-result__big{font-size:var(--text-3xl);font-weight:var(--weight-heavy);line-height:var(--leading-title-cjk);animation:cd-pop var(--dur-4) var(--ease-overshoot) both}.cd-result__wait{color:var(--color-text-3);font-weight:var(--weight-semibold);font-size:var(--text-lg);animation:none}.cd-result__dice{font-size:var(--text-md);color:var(--color-text-2)}@keyframes cd-pop{0%{opacity:0;transform:scale(1.6)}to{opacity:1;transform:none}}.cd-tally{color:var(--color-text-2);font-size:var(--text-sm)}.cd-settings .segmented{flex-wrap:wrap}.cd-settings .segmented__item{min-width:var(--target-s)}.cd-more a{color:var(--color-indigo);font-weight:var(--weight-semibold)}@media (prefers-reduced-motion:reduce){.cd-result__big,.cd-shape-wrap.is-landed .cd-shape__num{animation:reveal-fade var(--dur-reveal) var(--ease-out) both}.cd-stage[data-phase=rolling] .cd-shadow{animation:none}}.cd-stage.is-present{--die:calc(var(--space-9) + var(--space-7));--coin:min(60vh, 36rem)}.cd-stage.is-present .cd-result__big{font-size:var(--text-present)}}
