.ko-die-roll-slot{--ko-roll-direction: 1;--ko-roll-pitch: 1;--ko-cube-size: 24px;--ko-cube-half: calc(var(--ko-cube-size) / 2);display:grid;place-items:center;width:44px;height:44px;border-radius:6px;background:radial-gradient(ellipse at 50% 75%,#322519c0,#17100880 72%);box-shadow:inset 0 0 0 1px #be986035;overflow:hidden;perspective:110px}.ko-dice-strip-select button:nth-child(2n) .ko-die-roll-slot{--ko-roll-direction: -1}.ko-dice-strip-select button:nth-child(3n+2) .ko-die-roll-slot{--ko-roll-pitch: -1}.ko-die-roll-slot:before,.ko-die-tumble{grid-area:1 / 1;animation-duration:var(--ko-die-duration);animation-delay:var(--ko-die-delay);animation-fill-mode:both}.ko-die-roll-slot:before{content:"";align-self:end;width:28px;height:9px;margin-bottom:3px;background:radial-gradient(ellipse,#000c,transparent 73%);animation-name:ko-strip-die-shadow}.ko-die-tumble{position:relative;display:block;width:var(--ko-cube-size);height:var(--ko-cube-size);transform-style:preserve-3d;animation-name:ko-strip-die-tumble;animation-timing-function:linear}.ko-die-cube-face{position:absolute;inset:0;border-radius:2px;backface-visibility:hidden;background-color:var(--ko-face-ivory, #ebd6a7);box-shadow:inset 0 0 0 1px #f8e5b888,inset -2px -2px 4px #62431a66;transform:rotateY(var(--ko-face-y, 0deg)) rotateX(var(--ko-face-x, 0deg)) translateZ(var(--ko-cube-half))}.ko-die-cube-face:nth-child(2){--ko-face-y: 90deg;--ko-face-ivory: #c6a169}.ko-die-cube-face:nth-child(3){--ko-face-y: 180deg;--ko-face-ivory: #dfc392}.ko-die-cube-face:nth-child(4){--ko-face-y: -90deg;--ko-face-ivory: #d2af7a}.ko-die-cube-face:nth-child(5){--ko-face-x: 90deg;--ko-face-ivory: #f4e1b4}.ko-die-cube-face:nth-child(6){--ko-face-x: -90deg;--ko-face-ivory: #b38d56}@keyframes ko-strip-die-tumble{0%{transform:translate3d(calc(-7px * var(--ko-roll-direction)),-14px,0) rotate(-23deg) rotateY(calc(-45deg * var(--ko-roll-direction))) rotateX(calc(-40deg * var(--ko-roll-pitch))) scale(.02)}16%{transform:translate3d(calc(-4px * var(--ko-roll-direction)),-6px,0) rotate(11deg) rotateY(calc(115deg * var(--ko-roll-direction))) rotateX(calc(86deg * var(--ko-roll-pitch))) scale(.88)}37%{transform:translate3d(calc(3px * var(--ko-roll-direction)),4px,0) rotate(42deg) rotateY(calc(302deg * var(--ko-roll-direction))) rotateX(calc(272deg * var(--ko-roll-pitch))) scale(.88)}56%{transform:translate3d(calc(2px * var(--ko-roll-direction)),-5px,0) rotate(22deg) rotateY(calc(433deg * var(--ko-roll-direction))) rotateX(calc(420deg * var(--ko-roll-pitch))) scale(.9)}76%{transform:translate3d(0,3px,0) rotate(-9deg) rotateY(calc(545deg * var(--ko-roll-direction))) rotateX(calc(535deg * var(--ko-roll-pitch))) scale(.9)}90%{transform:translate3d(0,-1px,0) rotate(5deg) rotateY(calc(584deg * var(--ko-roll-direction))) rotateX(calc(582deg * var(--ko-roll-pitch))) scale(.94)}to{transform:translateZ(0) rotate(2deg) rotateY(calc(602deg * var(--ko-roll-direction))) rotateX(calc(601deg * var(--ko-roll-pitch))) scale(1)}}@keyframes ko-strip-die-shadow{0%{transform:scale(.4);opacity:0}16%,56%{transform:scale(.78);opacity:.38}37%,76%{transform:scale(1);opacity:.9}to{transform:scale(.94);opacity:.72}}@media(prefers-reduced-motion:reduce){.ko-die-roll-slot:before,.ko-die-tumble{animation:none}.ko-die-tumble{visibility:hidden}.ko-dice-strip-select button{transition:none}}.ko-dice-strip .ko-dice-combination{color:#bde1b5;font-weight:700}.ko-dice-strip button[data-scoring=true]{outline:1px solid #b5cf93;outline-offset:-1px;box-shadow:inset 0 0 10px #7ca36d47}.ko-die-flat{background:linear-gradient(135deg,#f8efd2,#e2cf9a);box-shadow:inset 0 1px #fff9,0 2px 4px #0006}.ko-die-flat-pip{background:var(--ko-skin-pip, #1c1917)}.ko-dice-strip[data-dice-skin] .ko-die-flat{background:var(--ko-skin-pattern),linear-gradient(135deg,color-mix(in srgb,var(--ko-skin-face),white 14%),var(--ko-skin-face) 68%);box-shadow:inset 0 0 0 1px var(--ko-skin-rim),0 2px 4px #0008}.ko-dice-strip[data-dice-skin] .ko-die-cube-face{background-color:var(--ko-skin-face);box-shadow:inset 0 0 0 1px var(--ko-skin-rim)}.ko-dice-strip[data-dice-radiance]{--ko-glow-radius: 7px}.ko-dice-strip[data-dice-radiance=legendary]{--ko-glow-radius: 11px}.ko-dice-strip[data-dice-radiance] .ko-die-flat{box-shadow:inset 0 0 0 1px var(--ko-skin-rim),0 0 var(--ko-glow-radius) color-mix(in srgb,var(--ko-skin-rim),transparent 30%),0 2px 4px #0008}
