.dark .Wheel .WheelArrow{filter:drop-shadow(0 -2px 3px rgb(0,0,0))}.Wheel{align-items:center;display:flex;justify-content:center;-webkit-mask:linear-gradient(90deg,transparent,#fff 40%,#fff 60%,transparent);mask:linear-gradient(90deg,transparent,#fff 40%,#fff 60%,transparent);overflow:hidden;position:relative}@keyframes spinwheel{0%{transform:perspective(1200px) rotateY(-36deg)}to{transform:perspective(1200px) rotateY(-396deg)}}.Wheel .WheelArrow{bottom:0;height:35px;position:absolute;width:35px;z-index:1}.Wheel .WheelArrow .WheelArrowItem{clip-path:polygon(50% 0,20% 100%,80% 100%);height:100%;width:100%}.Wheel .WheelBox{height:120px;position:relative;transform:perspective(1200px) rotateY(var(--wheel-deg));transform-style:preserve-3d;transition:transform 2s ease;width:120px}.Wheel .WheelBox--NoSpinning{animation:spinwheel 30s linear infinite}.Wheel .WheelBox .WheelItem{align-items:center;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;transform:rotateY(calc(var(--wheel-item-index)*36deg)) translateZ(200px);transform-origin:center;transform-style:preserve-3d;width:100%;-webkit-box-reflect:below 5px linear-gradient(transparent,transparent);box-reflect:below 5px linear-gradient(transparent,transparent);transition:all .5s ease}.Wheel .WheelBox .WheelItem:hover{transform:rotateY(calc(var(--wheel-item-index)*36deg)) translateZ(200px) scale(1.1)}.Dice{max-height:var(--dice-size);max-width:var(--dice-size);min-height:var(--dice-size);min-width:var(--dice-size);position:relative;transform-style:preserve-3d;transition:1s ease}@keyframes rolling{50%{transform:rotateX(450deg) rotateY(450deg) scale(.8) scaleZ(.8)}}.Dice--rolling{animation:rolling 2s infinite}.Dice .Face{align-items:center;background:#000;box-shadow:0 0 20px -10px #0000004d;display:flex;height:100%;justify-content:center;overflow:hidden;position:absolute;transform-style:preserve-3d;width:100%}.Dice .Face .Face-dot{background:linear-gradient(#ffffffe6,#fff)}.Dice .Face-1{transform:translateZ(calc(var(--dice-size)/2))}.Dice .Face-2{transform:rotateX(90deg) translateZ(calc(var(--dice-size)/2))}.Dice .Face-3{transform:rotateY(-90deg) translateZ(calc(var(--dice-size)/2))}.Dice .Face-4{transform:rotateY(90deg) translateZ(calc(var(--dice-size)/2))}.Dice .Face-5{transform:rotateX(-90deg) translateZ(calc(var(--dice-size)/2))}.Dice .Face-6{transform:rotateX(180deg) translateZ(calc(var(--dice-size)/2))}