.scene{perspective:1500px;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.figure{transform-style:preserve-3d;will-change:transform;position:relative}.cube{transform-style:preserve-3d;will-change:transform;position:absolute;top:-15px;left:-15px}.cube__face{backface-visibility:hidden;pointer-events:none;border:1px solid #00000026;width:30px;height:30px;position:absolute}.cube__face--front{background:#3b82f6;transform:rotateY(0)translateZ(15px)}.cube__face--back{background:#2563eb;transform:rotateY(180deg)translateZ(15px)}.cube__face--right{background:#fb7185;transform:rotateY(90deg)translateZ(15px)}.cube__face--left{background:#f43f5e;transform:rotateY(-90deg)translateZ(15px)}.cube__face--top{background:#fbbf24;transform:rotateX(90deg)translateZ(15px)}.cube__face--bottom{background:#f59e0b;transform:rotateX(-90deg)translateZ(15px)}.cube--lit .cube__face{animation:.3s ease-out forwards cube-light;animation-delay:var(--lit-delay,0s)}.cube--lit-again .cube__face{animation:.3s ease-out forwards cube-light-again;animation-delay:var(--lit-delay,0s)}@keyframes cube-light-again{to{background:#4ade80;border-color:#fff9}}.cube--fade .cube__face{animation:.6s ease-in both cube-unlight;animation-delay:var(--lit-delay,0s)}@keyframes cube-unlight{0%{background:#4ade80;border-color:#fff9}}@keyframes cube-light{to{background:#4ade80;border-color:#fff9}}