.crate-opening-art{position:relative;isolation:isolate;width:230px;height:214px;margin-top:-20px}.crate-opening-art .crate-art-svg{position:relative;z-index:1;width:100%;height:100%;overflow:visible}.crate-opening-art .crate-object{transform-box:view-box;transform-origin:124px 218px}.crate-opening-art .crate-ground{transform-box:fill-box;transform-origin:50% 50%}.crate-opening-art :is(.crate-lock,.crate-door,.crate-bow,.crate-beam){transform-box:fill-box}.crate-opening-art .crate-lid{transform-origin:50% 100%}.crate-opening-art .crate-lock{transform-origin:50% 0}.crate-opening-art .crate-shape-vault .crate-lock{transform-origin:50% 50%}.crate-opening-art .crate-door{transform-origin:0 50%}.crate-opening-art .crate-bow{transform-origin:50% 80%}.crate-opening-art .crate-beam{transform-origin:50% 100%}.crate-opening-art .crate-lid-open{opacity:0}.crate-opening-art .crate-aura{transition:opacity .3s ease-out}.crate-opening-art:is(.is-shaking,.is-open) .crate-aura{opacity:0}.crate-opening-art .crate-sparkles{opacity:0;transform-box:view-box;transform-origin:128px 150px}.crate-opening-art.is-open .crate-sparkles{opacity:1;animation:crate-sparkles-out .6s cubic-bezier(.2,1.4,.4,1) .22s both}.crate-opening-art.is-open:has(.crate-shape-vault) .crate-sparkles{animation-delay:.58s}@keyframes crate-sparkles-out{0%{opacity:0;transform:scale(.35)}40%{opacity:1}to{opacity:1;transform:none}}.crate-opening-art :is(.crate-sparkle,.crate-glint){transform-box:fill-box;transform-origin:50% 50%}.crate-opening-art.is-open .crate-sparkle{animation:crate-twinkle var(--twinkle-duration, 2s) ease-in-out var(--twinkle-delay, 0s) infinite}.crate-opening-art.is-open .crate-glint{animation:crate-glint var(--twinkle-duration, 2s) ease-in-out var(--twinkle-delay, 0s) infinite}@keyframes crate-twinkle{0%,to{opacity:.65;transform:scale(.7) rotate(0)}45%{opacity:1;transform:scale(1.1) rotate(20deg)}60%{opacity:1;transform:scale(.95) rotate(28deg)}}@keyframes crate-glint{0%,to{opacity:.4;transform:scale(.7)}50%{opacity:1;transform:scale(1.3)}}.crate-opening-art.is-idle .crate-object{animation:crate-float 2.4s ease-in-out infinite}.crate-opening-art.is-idle .crate-ground{animation:crate-ground-float 2.4s ease-in-out infinite}@keyframes crate-float{50%{transform:translateY(-6px)}}@keyframes crate-ground-float{50%{transform:scale(.92);opacity:.2}}.crate-opening-art.is-shaking .crate-object{animation:crate-charge .9s ease-in-out infinite,crate-power 2.4s ease-in forwards}.crate-opening-art.is-shaking .crate-ground{animation:crate-ground-hop .9s ease-in-out infinite}.crate-opening-art.is-shaking .crate-lid{animation:crate-lid-knock .9s ease-out infinite}.crate-opening-art.is-shaking .crate-lock{animation:crate-rattle .3s ease-in-out infinite}.crate-opening-art.is-shaking .crate-bow{animation:crate-bow-wiggle .9s ease-in-out infinite}.crate-opening-art.is-shaking .crate-shape-vault .crate-lock{animation:none}.crate-opening-art.is-shaking .crate-dial{animation:crate-dial-search 1.8s ease-in-out infinite}.crate-opening-art.is-shaking .crate-door{animation:crate-door-strain .9s ease-in-out infinite}@keyframes crate-charge{0%,to{transform:none}10%{transform:rotate(-4deg)}22%{transform:rotate(3.5deg)}34%{transform:rotate(-2deg)}46%{transform:scale(1.05,.93)}60%{transform:translateY(-11px) scale(.97,1.04) rotate(1.5deg)}74%{transform:scale(1.04,.95)}86%{transform:rotate(-1deg)}}@keyframes crate-power{0%{filter:drop-shadow(0 0 0 transparent)}to{filter:drop-shadow(0 0 9px var(--crate-glow, #fff))}}@keyframes crate-ground-hop{0%,46%,74%,to{transform:none}60%{transform:scale(.82);opacity:.18}}@keyframes crate-lid-knock{0%,70%,to{transform:none}76%{transform:translateY(-6px)}83%{transform:none}89%{transform:translateY(-2.5px)}94%{transform:none}}@keyframes crate-rattle{0%,to{transform:rotate(0)}25%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}}@keyframes crate-bow-wiggle{0%,94%,to{transform:none}15%{transform:rotate(-9deg) scale(1.04)}35%{transform:rotate(8deg) scale(.97)}55%{transform:rotate(-5deg)}70%{transform:rotate(3deg)}76%{transform:translateY(-6px) rotate(-4deg)}83%{transform:none}89%{transform:translateY(-2.5px)}}@keyframes crate-dial-search{0%,to{transform:rotate(0)}30%{transform:rotate(120deg)}55%{transform:rotate(40deg)}80%{transform:rotate(210deg)}}@keyframes crate-door-strain{0%,to{transform:none}74%{transform:translate(1.5px)}84%{transform:translate(-1px)}}.crate-opening-art.is-open .crate-object{animation:crate-pop .7s cubic-bezier(.3,.7,.4,1) both;filter:drop-shadow(0 0 9px var(--crate-glow, #fff))}.crate-opening-art.is-open .crate-ground{animation:crate-ground-pop .7s ease-out both}.crate-opening-art.is-open .crate-beam{opacity:1;animation:crate-beam-rise .7s cubic-bezier(.2,1.1,.4,1) .22s both}@keyframes crate-pop{0%{transform:none}16%{transform:scale(1.09,.86)}38%{transform:translateY(-14px) scale(.94,1.09)}60%{transform:scale(1.04,.97)}80%{transform:scale(.99,1.01)}to{transform:none}}@keyframes crate-ground-pop{38%{transform:scale(.8);opacity:.16}}@keyframes crate-beam-rise{0%{opacity:0;transform:scaleY(.1)}45%{opacity:1;transform:scaleY(1.12)}to{opacity:1;transform:scaleY(1)}}.crate-opening-art.is-open .crate-lock{opacity:0;transform:translateY(64px) rotate(40deg);animation:crate-lock-drop .5s cubic-bezier(.5,0,.9,.6) both}.crate-opening-art.is-open :is(.crate-shape-chest,.crate-shape-crate) .crate-lid{opacity:0;transform:scaleY(0);animation:crate-lid-fold .14s ease-in .12s both}.crate-opening-art.is-open .crate-lid-open{opacity:1;animation:crate-lid-swing .62s cubic-bezier(.3,.8,.4,1) .22s both}@keyframes crate-lock-drop{0%{opacity:1;transform:none}18%{opacity:1;transform:translateY(-5px) rotate(-12deg)}to{opacity:0;transform:translateY(64px) rotate(40deg)}}@keyframes crate-lid-fold{0%{opacity:1;transform:none}55%{opacity:1}85%{opacity:0}to{opacity:0;transform:scaleY(.1)}}@keyframes crate-lid-swing{0%{opacity:0;transform:scaleY(0)}1%{opacity:1}42%{transform:scaleY(1.14)}64%{transform:scaleY(.93)}82%{transform:scaleY(1.03)}to{transform:scaleY(1)}}.crate-opening-art.is-open .crate-shape-vault .crate-lock{opacity:1;transform:none;animation:crate-gem-flash .4s ease-out both}.crate-opening-art.is-open .crate-dial{transform:rotate(400deg);animation:crate-dial-unlock .32s cubic-bezier(.3,0,.3,1) both}.crate-opening-art.is-open .crate-wheel{transform:rotate(150deg);animation:crate-wheel-turn .3s cubic-bezier(.3,1.5,.5,1) .14s both}.crate-opening-art.is-open .crate-door{opacity:0;animation:crate-door-swing .22s cubic-bezier(.5,0,.9,.5) .42s both}.crate-opening-art.is-open .crate-door-open{opacity:1;animation:crate-door-unfold .45s cubic-bezier(.2,.7,.4,1) .63s both}.crate-opening-art.is-open .crate-shape-vault .crate-object{animation:crate-recoil .5s ease-out .63s both}.crate-opening-art .crate-beam-front{transform-origin:50% 50%}.crate-opening-art.is-open .crate-beam-front{animation:crate-glow-swell .6s cubic-bezier(.2,1.3,.4,1) .55s both}@keyframes crate-glow-swell{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:none}}@keyframes crate-gem-flash{40%{transform:scale(1.5)}}@keyframes crate-dial-unlock{0%{transform:rotate(0)}to{transform:rotate(400deg)}}@keyframes crate-wheel-turn{0%{transform:rotate(0)}to{transform:rotate(150deg)}}@keyframes crate-door-swing{0%{opacity:1;transform:none}30%{transform:matrix(.851,.058,0,1,0,0)}60%{transform:matrix(.523,.12,0,1,0,0)}85%{opacity:1;transform:matrix(.187,.154,0,1,0,0)}to{opacity:0;transform:matrix(.08,.161,0,1,0,0)}}@keyframes crate-door-unfold{0%{opacity:0;transform:scaleX(.12)}1%{opacity:1}50%{transform:scaleX(1.16)}72%{transform:scaleX(.95)}88%{transform:scaleX(1.02)}to{transform:none}}@keyframes crate-recoil{0%,to{transform:none}30%{transform:translate(3px) rotate(1.2deg)}60%{transform:translate(-1px) rotate(-.4deg)}}.crate-opening-art.is-open .crate-bow{opacity:0;transform:translate(34px,-120px) rotate(200deg) scale(.6);animation:crate-bow-pop .55s cubic-bezier(.3,.6,.5,1) both}.crate-opening-art.is-open .crate-shape-gift .crate-lid{opacity:0;transform:translate(-70px,-130px) rotate(-40deg);transform-box:fill-box;transform-origin:50% 50%;animation:crate-gift-lid .7s cubic-bezier(.25,.7,.45,1) .1s both}@keyframes crate-bow-pop{0%{opacity:1;transform:none}22%{opacity:1;transform:translateY(-6px) scale(1.25)}70%{opacity:1}to{opacity:0;transform:translate(34px,-120px) rotate(200deg) scale(.6)}}@keyframes crate-gift-lid{0%{opacity:1;transform:none}16%{opacity:1;transform:translateY(4px) scale(1.04,.94)}50%{opacity:1;transform:translate(-24px,-74px) rotate(-16deg)}to{opacity:0;transform:translate(-70px,-130px) rotate(-40deg)}}.crate-burst{position:absolute;inset:-40px;border-radius:50%;opacity:0;transform:scale(.4);background:radial-gradient(circle,#fff 0 12%,var(--crate-glow) 20%,transparent 62%),repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--crate-glow) 55%,transparent) 0 8deg,transparent 8deg 24deg);-webkit-mask:radial-gradient(circle,#000 35%,transparent 70%);mask:radial-gradient(circle,#000 35%,transparent 70%);pointer-events:none}.crate-opening-art:after{content:"";position:absolute;z-index:0;inset:10%;border-radius:50%;opacity:0;pointer-events:none;background:radial-gradient(circle,#fff 0 20%,color-mix(in srgb,var(--crate-glow) 60%,transparent) 45%,transparent 70%)}.crate-opening-art.is-open .crate-burst{opacity:1;transform:scale(1) rotate(24deg);animation:crate-burst .9s cubic-bezier(.2,1.1,.4,1) .2s both}.crate-opening-art.is-open:after{animation:crate-flash .45s ease-out .22s both}.crate-opening-art.is-open:has(.crate-shape-vault) .crate-burst{animation-delay:.55s}.crate-opening-art.is-open:has(.crate-shape-vault):after{animation-delay:.58s}@keyframes crate-burst{0%{opacity:0;transform:scale(.3)}35%{opacity:1}to{opacity:1;transform:scale(1) rotate(24deg)}}@keyframes crate-flash{0%{opacity:0;transform:scale(.5)}25%{opacity:.9}to{opacity:0;transform:scale(1.3)}}.crate-opening-art.is-quiet,.crate-opening-art.is-quiet *{animation:none!important}.crate-opening-art.is-quiet:after{animation:none!important}@media(prefers-reduced-motion:reduce){.crate-opening-art,.crate-opening-art *,.crate-opening-art:after{animation:none!important}}
