.hero{--cube-size:45px}@media only screen and (max-width:560px){.hero{--cube-size:45px}}.hero-small{--cube-size:30px}@media only screen and (max-width:560px){.hero-small{--cube-size:30px}}.env{height:var(--cube-size);width:var(--cube-size);position:relative;transform-style:preserve-3d;transform:rotate(35.264deg) rotateY(-30deg) rotateX(35.264deg)}.mystery-shadow{position:absolute;top:0;left:0;background:#000;border-radius:1.25%;opacity:.25;filter:blur(calc(var(--cube-size) * .1));transform:translateZ(calc(var(--cube-size) * -1)) scale(.95);will-change:transform;transform-style:preserve-3d}.cube,.mystery-shadow{width:100%;height:100%}.cube{position:relative;transform:rotate(-90deg) rotateX(-90deg);transform-style:preserve-3d}.face{position:absolute;width:100%;height:100%;background:#000;font-size:30px;top:0;left:0;backface-visibility:hidden;color:#ddd;box-shadow:0 0 1px .5px #ddd}.face--1{transform:translateY(calc(var(--cube-size) * -.5)) rotateX(90deg)}.face--2{transform:translateZ(calc(var(--cube-size) * .5))}.face--3{transform:translateY(calc(var(--cube-size) * .5)) rotateX(-90deg)}.face--4{transform:translateZ(calc(var(--cube-size) * -.5)) rotateX(180deg)}.face--5{transform:translateX(calc(var(--cube-size) * -.5)) rotateY(-90deg)}.face--6{transform:translateX(calc(var(--cube-size) * .5)) rotateY(90deg)}.face img,.face svg{position:absolute;width:100%;height:100%;top:0;left:0}.mystery-cube__face-icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%) translateZ(1px);display:flex;align-items:center;justify-content:center;line-height:1;width:auto;height:auto;pointer-events:none;z-index:2}.mystery-cube__face-icon svg{position:relative;width:260%;height:260%;stroke:var(--color-orange,#e99e49);fill:none;color:var(--color-orange,#e99e49)}.cube-small>div>svg{margin-top:-4px}.cube-small .face{font-size:18px}@keyframes mysteryCubeFadeIn{0%{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}.mystery-cube__boost{position:absolute;inset:-12px;pointer-events:none;z-index:3}.mystery-cube__boost span{position:absolute;top:50%;left:50%;width:6px;height:6px;border-radius:999px;background:#ffba7b;box-shadow:0 0 10px rgba(255,186,123,.9);transform:translate(-50%,-50%);animation:mysteryCubeBoost .9s ease-out forwards}.mystery-cube__boost span:nth-child(2){background:#fff5a4;box-shadow:0 0 10px rgba(255,245,164,.9)}.mystery-cube__boost span:nth-child(3){background:#7dffc4;box-shadow:0 0 10px rgba(125,255,196,.9)}.mystery-cube__boost span:nth-child(4){background:#77d1ef;box-shadow:0 0 10px rgba(119,209,239,.9)}@keyframes mysteryCubeBoost{0%{opacity:.95;transform:translate(-50%,-50%) scale(.6)}to{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(1.3)}}.mystery-cube__charging{position:absolute;top:50%;left:50%;width:60px;height:60px;transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;z-index:4;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,186,123,.8) 0deg);animation:mysteryCubeCharge var(--charge-duration,2s) linear forwards;mask-image:radial-gradient(circle,transparent 42%,black 44%,black 56%,transparent 58%);-webkit-mask-image:radial-gradient(circle,transparent 42%,black 44%,black 56%,transparent 58%)}@keyframes mysteryCubeCharge{0%{background:conic-gradient(from 0deg,rgba(255,186,123,.9) 0deg,transparent 0deg);filter:drop-shadow(0 0 4px rgba(255,186,123,.6))}25%{background:conic-gradient(from 0deg,rgba(255,245,164,.9) 0deg,rgba(255,186,123,.9) 90deg,transparent 90deg);filter:drop-shadow(0 0 6px rgba(255,245,164,.7))}50%{background:conic-gradient(from 0deg,rgba(125,255,196,.9) 0deg,rgba(255,245,164,.9) 90deg,rgba(255,186,123,.9) 180deg,transparent 180deg);filter:drop-shadow(0 0 8px rgba(125,255,196,.7))}75%{background:conic-gradient(from 0deg,rgba(119,209,239,.9) 0deg,rgba(125,255,196,.9) 90deg,rgba(255,245,164,.9) 180deg,rgba(255,186,123,.9) 270deg,transparent 270deg);filter:drop-shadow(0 0 10px rgba(119,209,239,.8))}to{background:conic-gradient(from 0deg,rgba(255,118,128,.95) 0deg,rgba(119,209,239,.95) 90deg,rgba(125,255,196,.95) 180deg,rgba(255,245,164,.95) 270deg,rgba(255,186,123,.95) 1turn);filter:drop-shadow(0 0 12px rgba(255,118,128,.9))}}