.booster-visual{--foil-accent:#a1bfff;--metal:#aecaff;--foil-low:#192452;--foil-mid:#4a65aa;--foil-high:#a1bfff}
.foil-scene{height:340px;position:relative;display:grid;place-items:center;perspective:950px;isolation:isolate;outline-offset:-4px}.scene-glow{position:absolute;inset:40px 10% 15px;background:radial-gradient(ellipse,color-mix(in srgb,var(--foil-accent) 19%,transparent),transparent 67%);z-index:-1}.foil-shadow{position:absolute;bottom:14px;left:22%;right:13%;height:24px;border-radius:50%;background:#000b;filter:blur(12px);transform:rotate(0deg)}.foil-object{position:relative;width:183px;height:270px;transform-style:preserve-3d;transform:translateY(var(--foil-lift,0px)) rotateX(var(--foil-tilt-x,0deg)) rotateY(var(--foil-tilt-y,0deg));transition:transform .22s ease-out;filter:drop-shadow(15px 14px 12px #0005)}.foil-scene:hover .foil-object,.foil-scene:focus-visible .foil-object{transform:translateY(var(--foil-lift,-4px)) rotateX(var(--foil-tilt-x,-3deg)) rotateY(var(--foil-tilt-y,5deg))}.foil-front{position:absolute;inset:0;transform:translateZ(9px);border-radius:4px;border:1px solid color-mix(in srgb,var(--metal) 75%,#fff);background:repeating-linear-gradient(97deg,transparent 0 21px,#ffffff0a 22px,transparent 23px 39px),linear-gradient(118deg,var(--foil-high),var(--foil-mid) 8%,var(--foil-low) 27%,var(--foil-mid) 58%,var(--foil-low) 75%,var(--foil-high));box-shadow:inset 2px 0 3px #fff5,inset -3px 0 5px #0008;overflow:hidden}.foil-side{position:absolute;top:2px;bottom:2px;right:0;width:18px;transform-origin:right center;transform:translateZ(9px) rotateY(90deg);background:repeating-linear-gradient(0deg,#0005 0 2px,transparent 2px 4px),linear-gradient(90deg,var(--foil-low),var(--foil-high));border:1px solid var(--metal);border-radius:3px}.foil-top{position:absolute;left:0;right:0;top:0;height:18px;transform-origin:top;transform:translateZ(9px) rotateX(-90deg);background:var(--foil-mid)}.foil-trim{position:absolute;inset:23px 11px 24px;border:1px solid color-mix(in srgb,var(--metal) 65%,transparent);box-shadow:0 0 0 3px #ffffff08,inset 0 0 0 3px #0001;clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}.crimp{position:absolute;left:0;right:0;height:15px;background:repeating-linear-gradient(90deg,#ffffff55 0 1px,#0006 1px 2px,transparent 2px 4px),linear-gradient(0deg,#0007,#fff6);box-shadow:0 2px 4px #0008;z-index:4}.crimp-top{top:0}.crimp-bottom{bottom:0;transform:rotate(180deg)}.foil-logo{position:absolute;left:0;right:0;top:37px;text-align:center;color:var(--metal);font-weight:850;font-size:13px;letter-spacing:2.4px;text-shadow:0 1px 2px #000b}.foil-logo span{display:block;font-size:5px;letter-spacing:2px;margin-top:5px;font-weight:500}.star-medallion{position:absolute;left:23px;right:23px;top:80px;height:132px;display:grid;place-items:center}.foil-star{width:110px;height:110px;color:var(--metal);filter:drop-shadow(4px 5px 3px #0009) drop-shadow(0 0 14px color-mix(in srgb,var(--metal) 35%,transparent));transform:rotate(-3deg)}.star-base{fill:var(--metal)}.star-light{fill:#ffffffb8}.star-shade{fill:#0004}.foil-caption{position:absolute;top:215px;left:0;right:0;text-align:center;color:var(--metal);text-shadow:0 1px 3px #000}.foil-caption strong{font-size:9px;letter-spacing:2px}.foil-caption span{display:block;font-size:4px;letter-spacing:1.5px;margin-top:6px}.foil-bottom-label{position:absolute;bottom:23px;left:0;right:0;text-align:center;color:var(--metal);font-size:5px;letter-spacing:1.5px}.foil-specks{position:absolute;inset:17px 4px;background-image:radial-gradient(circle,#fff 0 .6px,transparent 1px),radial-gradient(circle,var(--metal) 0 .6px,transparent 1.2px),radial-gradient(circle,#fff9 0 .4px,transparent .9px);background-size:17px 23px,29px 19px,11px 31px;background-position:3px 8px,8px 3px,2px 14px;opacity:.5;mask-image:linear-gradient(130deg,#000,transparent 40%,#000)}.foil-shine{position:absolute;inset:-80% -120%;background:linear-gradient(115deg,transparent 42%,#fff1 47%,#fff5 49%,#fff1 51%,transparent 56%);transform:translateX(-30%);animation:foil-reflect 6s ease-in-out infinite;pointer-events:none}.foil-glint{position:absolute;color:var(--metal);font-size:18px;text-shadow:0 0 12px var(--metal);animation:foil-glimmer 3.5s ease-in-out infinite;pointer-events:none}.glint-0{left:24%;top:21%;font-size:13px}.glint-1{right:22%;top:42%;animation-delay:.8s}.glint-2{left:28%;bottom:16%;font-size:12px;animation-delay:1.4s}.glint-3{right:17%;bottom:28%;font-size:10px;animation-delay:2s}.glint-4{right:32%;top:18%;font-size:9px;animation-delay:2.6s}
@keyframes foil-reflect{0%,20%{transform:translateX(-35%)}65%,100%{transform:translateX(35%)}}@keyframes foil-glimmer{0%,100%{opacity:.15;transform:scale(.6)}50%{opacity:1;transform:scale(1.15)}}

.foil-caption{line-height:1}.foil-caption strong{display:block;line-height:1.2}.foil-caption span{line-height:1.2}
.hero .booster-visual{width:40%;min-width:220px;height:300px;flex-shrink:0}.booster-stage .booster-visual{width:100%;max-width:430px;height:340px}
.quick-opening{--foil-accent:var(--light);--metal:var(--light);--foil-low:#192452;--foil-mid:#4a65aa;--foil-high:var(--light)}
.quick-opening .booster-piece .foil-front{transform:none;border-color:var(--light)}.quick-opening .sealed-booster{width:183px;height:270px}.quick-opening .foil-shine{animation:none}
@media(max-width:800px){.hero .booster-visual{width:36%;min-width:190px}.hero .foil-object{width:165px;height:250px}.hero .foil-logo{top:34px;font-size:11px}.hero .star-medallion{top:72px;height:124px;left:18px;right:18px}.hero .foil-caption{top:199px}.hero .foil-caption strong{font-size:8px}}
@media(max-width:600px){.hero{flex-direction:column;align-items:flex-start}.hero .booster-visual{align-self:center;width:100%;height:290px}.booster-stage .booster-visual{height:320px}}
@media(prefers-reduced-motion:reduce){.foil-shine,.foil-glint{animation:none}.foil-object{transition:none}.foil-scene:hover .foil-object,.foil-scene:focus-visible .foil-object{transform:none}}