.booster-pack{cursor:pointer;font:inherit;color:inherit;padding:0;text-align:initial;appearance:none;transform-origin:center bottom;transition:opacity .35s,transform .7s cubic-bezier(.22,1,.36,1)}
.booster-pack:focus-visible{outline:4px solid var(--yellow);outline-offset:8px}
.booster-scene{height:440px}
.booster-scene .collection-caption{bottom:5px;font-size:10px}
.booster-scene.is-opening .booster-fan,.booster-scene.is-open .booster-fan{transform:none}
.booster-scene.is-opening .booster-pack{animation:pack-shake .45s ease-in-out}
.booster-scene.is-open .booster-pack{transform:translateY(85px) rotate(-16deg) scale(.85);opacity:0;pointer-events:none}
.booster-scene.is-opening .pack-ridge:not(.bottom-ridge){animation:seal-tear .45s ease-in forwards}
.booster-scene.is-opening .collect-card,.booster-scene.is-open .collect-card{opacity:0;transition:opacity .3s}
.rare-reveal{position:absolute;z-index:5;left:50%;top:15px;width:204px;height:338px;opacity:0;pointer-events:none;transform:translate(-50%,95px) scale(.65) rotateY(90deg);transition:transform 1s cubic-bezier(.16,1,.3,1),opacity .3s;filter:drop-shadow(0 18px 16px #0f5a3340)}
.rare-card{position:relative;height:100%;padding:7px;border:2px solid #8d6318;border-radius:15px;background:linear-gradient(135deg,#fff3bb,#c99526 35%,#ffef9b 65%,#ab771b);overflow:hidden;box-shadow:inset 0 0 0 2px #fff5b1}
.rare-card img{display:block;width:100%;height:253px;object-fit:cover;border-radius:8px;border:1px solid #8d6318}
.rare-card img[hidden],.rare-word[hidden]{display:none}
.rare-word{height:253px;border:1px solid #8d6318;border-radius:8px;padding:15px 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:linear-gradient(145deg,hsl(var(--card-hue) 45% 89%),#fbf8ee);color:var(--ink)}
.rare-word>span{font-size:42px;color:#98701b;margin-bottom:14px}
.rare-word b{font:800 21px Display;overflow-wrap:anywhere;max-width:100%}
.rare-word p{font:12px/1.55 Inter;margin:14px 0 0;color:var(--ink)}
.booster-progress{position:absolute;top:-12px;left:0;right:0;text-align:center;font-size:9px;color:var(--deep)}
.rare-card strong{font-size:16px}
.rare-card strong{display:block;text-align:center;font:800 19px Display;color:var(--ink);margin-top:9px}
.rare-card small{display:block;text-align:center;font:9px Mono;letter-spacing:1.5px;color:#513808;margin-top:5px}
.rare-card:after{content:'';position:absolute;inset:-60%;background:linear-gradient(115deg,transparent 40%,#fff9 48%,#ffe8 50%,transparent 59%);transform:translateX(-70%) rotate(5deg);pointer-events:none}
.is-open .rare-reveal{opacity:1;transform:translate(-50%,0) scale(1) rotateY(0)}
.is-open .rare-card:after{animation:rare-shine 1.5s .6s ease-in-out both}
.is-open .booster-halo{background:radial-gradient(circle,#fff5bb 0,#f0c04055 35%,transparent 70%);box-shadow:0 0 65px #f0c04055;transition:all .7s}
.booster-again{position:absolute;bottom:42px;left:50%;transform:translateX(-50%);border:1px solid var(--ink);border-radius:25px;background:var(--surface);padding:10px 18px;white-space:nowrap;cursor:pointer;color:var(--ink);font:600 12px Inter;z-index:6}
.booster-again:hover{background:var(--yellow)}
.booster-again[hidden]{display:none}
.booster-particles{position:absolute;inset:0;pointer-events:none;z-index:4}
.booster-particles i{position:absolute;left:50%;top:45%;width:7px;height:12px;background:var(--yellow);opacity:0;border-radius:2px}
.is-open .booster-particles i{animation:booster-burst 1.1s ease-out both;animation-delay:var(--delay)}
@keyframes pack-shake{0%,100%{transform:rotate(-7deg)}25%{transform:rotate(-12deg) translateX(-4px)}65%{transform:rotate(0deg) translateX(4px)}}
@keyframes seal-tear{to{transform:translate(25px,-45px) rotate(25deg);opacity:0}}
@keyframes rare-shine{to{transform:translateX(70%) rotate(5deg)}}
@keyframes booster-burst{0%{opacity:0;transform:translate(0,0)}15%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) rotate(var(--r))}}
@media(max-width:700px){.booster-scene{height:430px}.rare-reveal{width:194px;height:323px}.rare-card img{height:238px}.booster-scene .collection-caption{font-size:9px}}
@media(max-width:700px){.rare-word{height:238px}}
@media(prefers-reduced-motion:reduce){.booster-scene *, .booster-scene *:after{animation:none!important;transition:none!important}.booster-particles{display:none}}