.booster-pack{--pressure: 0;--px: 50%;--py: 50%;--rx: 0deg;--ry: 0deg;--hover: 0;--strip-h: 8.5%;position:relative;width:min(240px,60vw);aspect-ratio:2 / 3;perspective:900px}@media(min-width:768px){.booster-pack{width:320px}}.booster-pack__button{position:absolute;left:5%;right:5%;top:-4%;height:108%;z-index:2;padding:0;border:none;background:none;cursor:pointer;transform:rotateY(var(--rx)) rotateX(var(--ry));scale:calc(1 + var(--pressure) * .03);transition:transform .45s cubic-bezier(.22,1,.36,1),scale .24s cubic-bezier(.34,1.56,.64,1);filter:drop-shadow(0 22px 28px rgba(0,0,0,.6));-webkit-tap-highlight-color:transparent}@media(hover:hover){.booster-pack--sealed:hover .booster-pack__button{transition-duration:.12s}}.booster-pack__button:focus-visible{outline:2px solid var(--foreground);outline-offset:6px}.booster-pack__button:disabled{cursor:default}.booster-pack--loading .booster-pack__button{cursor:progress}.booster-pack__layer{position:absolute;inset:0;-webkit-mask:url(/tcg/booster-popcorn.webp) center / 100% 100% no-repeat;mask:url(/tcg/booster-popcorn.webp) center / 100% 100% no-repeat}.booster-pack__layer--strip{clip-path:inset(0 0 calc(100% - var(--strip-h)) 0)}.booster-pack__layer--body{clip-path:inset(var(--strip-h) 0 0 0)}.booster-pack__art{position:absolute;inset:0;width:100%;height:100%}.booster-pack__sheen{position:absolute;inset:0;background:linear-gradient(105deg,transparent calc(var(--px) - 30%),rgba(255,255,255,.18) calc(var(--px) - 8%),rgba(255,255,255,.55) var(--px),rgba(255,255,255,.18) calc(var(--px) + 8%),transparent calc(var(--px) + 30%)),radial-gradient(ellipse 60% 40% at var(--px) var(--py),rgba(255,255,255,.25),transparent 70%);mix-blend-mode:soft-light;opacity:calc(.35 + var(--hover) * .65);transition:opacity .3s ease-out}.booster-pack__band{position:absolute;left:50%;top:50.6%;translate:-50% -50%;display:grid;place-items:center;width:90%;height:14.7%}.booster-pack__band img{width:74%;height:auto}.booster-pack__banner{position:absolute;left:50%;top:75.5%;translate:-50% -50%;width:46%;text-align:center;font-family:var(--font-alt);font-style:italic;font-weight:800;font-size:1.125rem;text-transform:uppercase;letter-spacing:.04em;color:#8b1a1a}.booster-pack__crinkles{position:absolute;inset:0;z-index:3;-webkit-mask:url(/tcg/booster-popcorn.webp) center / 100% 100% no-repeat;mask:url(/tcg/booster-popcorn.webp) center / 100% 100% no-repeat;pointer-events:none;transition:opacity .2s ease-out}.booster-pack__crinkle{position:absolute;width:0;height:0}.booster-pack__crease{position:absolute;left:0;top:-1px;width:var(--length);height:2px;transform-origin:0 50%;rotate:var(--angle);background:linear-gradient(90deg,#ffffff80,#fff0) top / 100% 1px no-repeat,linear-gradient(90deg,#0000008c,#0000) bottom / 100% 1px no-repeat;mix-blend-mode:overlay;animation:booster-pack-crinkle .2s cubic-bezier(.22,1,.36,1)}@keyframes booster-pack-crinkle{0%{scale:0 1;opacity:0}}.booster-pack__button--jolt-a{animation:booster-pack-jolt-a .26s cubic-bezier(.36,.07,.19,.97)}.booster-pack__button--jolt-b{animation:booster-pack-jolt-b .26s cubic-bezier(.36,.07,.19,.97)}@keyframes booster-pack-jolt-a{30%{translate:0 -3px;rotate:-1.2deg}65%{translate:0 1px;rotate:.6deg}}@keyframes booster-pack-jolt-b{30%{translate:0 -3px;rotate:1.2deg}65%{translate:0 1px;rotate:-.6deg}}.booster-pack--loading .booster-pack__button{animation:booster-pack-wait 1.2s ease-in-out infinite}@keyframes booster-pack-wait{50%{scale:1.015}}.booster-pack--empty .booster-pack__button{opacity:.35;filter:drop-shadow(0 18px 24px rgba(0,0,0,.55)) grayscale(1)}.booster-pack__pile{position:absolute;inset:0;z-index:0;transition:opacity .3s ease-out}.booster-pack__pile img{position:absolute;left:5%;right:5%;top:-4%;width:90%;height:108%;translate:var(--pile-x) calc(var(--depth) * -4px);rotate:var(--pile-rotate);filter:brightness(calc(1 - var(--depth) * .14)) drop-shadow(0 12px 18px rgba(0,0,0,.55));z-index:calc(10 - var(--depth))}.booster-pack--opening .booster-pack__pile{opacity:0}.boosters__deck-back{--depth: 1;position:absolute;inset:0;z-index:calc(-1 * var(--depth));overflow:hidden;border-radius:.5em;background:var(--card-back-bg, #0a0a0c);box-shadow:0 10px 24px #0009;transform:translateY(calc(var(--depth) * 4px)) rotate(var(--fan));filter:brightness(calc(1.1 - var(--depth) * .2));transition:transform .3s cubic-bezier(.22,1,.36,1),filter .3s ease-out}.boosters__deck-back img{width:100%;height:100%;object-fit:cover}.booster-pack__stack{position:absolute;inset:0;z-index:1;isolation:isolate;opacity:0}.booster-pack--opening .booster-pack__button{transform:none}.booster-pack--opening .booster-pack__crinkles{opacity:0}.booster-pack--opening .booster-pack__layer--strip{animation:booster-pack-strip-off .32s cubic-bezier(.3,.6,.4,1) forwards}@keyframes booster-pack-strip-off{to{transform:translate(72px,-96px) rotate(28deg);opacity:0}}.booster-pack--opening .booster-pack__stack{opacity:1;animation:booster-pack-stack-out .75s cubic-bezier(.22,1,.36,1) forwards}@keyframes booster-pack-stack-out{0%{transform:translateY(14%)}45%{transform:translateY(-34%)}to{transform:translateY(0)}}.booster-pack--opening .booster-pack__layer--body{animation:booster-pack-body-out .75s ease-in forwards}@keyframes booster-pack-body-out{0%,45%{transform:none;opacity:1}to{transform:translateY(70%);opacity:0}}@media(prefers-reduced-motion:reduce){.booster-pack__button,.booster-pack__sheen,.booster-pack__pile{transition:none}.booster-pack__crease,.booster-pack__button--jolt-a,.booster-pack__button--jolt-b,.booster-pack--loading .booster-pack__button,.booster-pack--opening .booster-pack__layer--strip,.booster-pack--opening .booster-pack__stack,.booster-pack--opening .booster-pack__layer--body{animation:none}}