.coin{--coin-size:56px;--coin-thickness:3px;--coin-edge-width:calc(var(--coin-thickness) * 2);--coin-edge-x:calc((var(--coin-size) - var(--coin-edge-width)) / 2);--coin-container-size:calc(var(--coin-size) + 18px);--coin-duration:2s;--coin-face-color:#ffcd6c;--coin-inner-color:#ffaa04;--coin-edge-color:#ffaa04;--coin-play-state:running;height:var(--coin-container-size);width:var(--coin-container-size);position:relative}.coin__wrapper{height:var(--coin-size);width:var(--coin-size);transform-style:preserve-3d;animation:coin-rotate var(--coin-duration) infinite linear;animation-play-state:var(--coin-play-state);position:absolute}.coin__face{height:var(--coin-size);width:var(--coin-size);backface-visibility:hidden;background:var(--coin-face-color);border-radius:50%;width:100%;height:100%;position:absolute}.coin__face--outer.coin__face--front{transform:translateZ(var(--coin-thickness))}.coin__face--inner.coin__face--front{background:var(--coin-inner-color);transform:rotateY(180deg) translateZ(calc(var(--coin-thickness) * -1))}.coin__face--inner.coin__face--back{background:var(--coin-inner-color);transform:translateZ(calc(var(--coin-thickness) * -1))}.coin__face--outer.coin__face--back{transform:rotateY(180deg) translateZ(var(--coin-thickness))}.coin__icon{width:100%;height:100%;display:block}.coin__side{transform:translateX(var(--coin-edge-x)) rotateY(90deg);width:var(--coin-edge-width);height:var(--coin-size);background:var(--coin-edge-color);border-radius:0;position:absolute}@keyframes coin-rotate{to{transform:rotateY(360deg)}}@media (prefers-reduced-motion:reduce){.coin__wrapper{animation:none;transform:rotateY(24deg)}}