.pack-stage{--card-w:clamp(150px,27vmin,330px);display:flex;flex-direction:column;align-items:center;gap:18px;container-type:inline-size}.pack-area,.pack-stage{position:relative;width:100%}.pack-area{--gap:clamp(8px,3vmin,48px);--cw:min(var(--card-w),calc((100cqw - 2 * var(--gap) - 28px) / 3));--pack-w:min(calc(var(--card-w) * 1.09),64cqw);display:grid;place-items:center;height:max(calc(var(--pack-w) * 1.4845),calc(var(--cw) * 1.5))}.rays{position:absolute;left:50%;top:50%;aspect-ratio:1;border-radius:50%;pointer-events:none;translate:-50% -50%;background:repeating-conic-gradient(from 0deg,var(--ray,rgba(255,214,102,.5)) 0deg 7deg,transparent 7deg 22.5deg);-webkit-mask:radial-gradient(closest-side,#000 16%,rgba(0,0,0,.55) 48%,transparent 100%);mask:radial-gradient(closest-side,#000 16%,rgba(0,0,0,.55) 48%,transparent 100%);animation:rays-spin 16s linear infinite}@keyframes rays-spin{to{rotate:1turn}}.pack-sealed{position:relative;border:0;background:none;padding:0;width:var(--pack-w);display:grid;place-items:center;cursor:pointer;-webkit-tap-highlight-color:transparent}.pack-rays{width:185%;opacity:.55}.pack-glow{position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(circle,rgba(255,210,90,.75),rgba(255,197,61,0) 65%);animation:glow-pulse 2.2s ease-in-out infinite}@keyframes glow-pulse{50%{transform:scale(1.12);opacity:.7}}.pack-art{position:relative;z-index:1;display:block;line-height:0;filter:drop-shadow(0 24px 22px rgba(90,50,0,.35))}.pack-art,.pack-art img{width:100%}.pack-foil{position:absolute;inset:0;pointer-events:none;-webkit-mask:url(/art/pack.webp) center/100% 100% no-repeat;mask:url(/art/pack.webp) center/100% 100% no-repeat;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.8) 46%,rgba(255,246,210,.45) 52%,transparent 60%) 0 0 /260% 100% no-repeat;mix-blend-mode:soft-light;animation:foil-glint 3.4s var(--ease-out) infinite}@keyframes foil-glint{0%,45%{background-position:130% 0}to{background-position:-30% 0}}.twinkle{position:absolute;z-index:2;width:calc(var(--pack-w) * .13 * var(--s, 1));aspect-ratio:1;pointer-events:none;background:radial-gradient(circle closest-side,#fff 0 22%,#ffe08a 55%,rgba(255,224,138,0) 100%);clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);animation:twinkle 2.4s ease-in-out infinite both}@keyframes twinkle{0%,to{scale:.15;opacity:0;rotate:0deg}40%{scale:1;opacity:1;rotate:45deg}70%{scale:.55;opacity:.7;rotate:70deg}}.pack-hint{position:absolute;z-index:3;bottom:-8px;display:inline-flex;align-items:center;gap:8px;padding:10px 20px;border-radius:99px;background:var(--ink);color:#fff;font-family:var(--font-display);font-weight:600;font-size:clamp(16px,2.2vmin,24px);box-shadow:var(--shadow-2);white-space:nowrap}.pack-cards{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center;gap:var(--gap)}.pack-gleam{position:absolute;z-index:0;inset:0;margin:auto;width:var(--pack-w);height:calc(var(--pack-w) * 1.4845);pointer-events:none}.pack-gleam:before{content:"";position:absolute;left:50%;top:17%;width:150%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(closest-side,rgba(255,250,228,.95),rgba(255,214,102,.55) 38%,rgba(255,197,61,0) 72%);opacity:0;animation:gleam .95s ease-out .1s forwards}.pack-gleam-rays{top:17%;width:240%;--ray:rgba(255,226,140,.6);opacity:0;animation:gleam .95s ease-out .1s forwards,rays-spin 7s linear infinite}@keyframes gleam{0%{opacity:0;scale:.3}30%{opacity:1;scale:1}to{opacity:0;scale:1.15}}.pack-torn{position:absolute;z-index:2;inset:0;margin:auto;width:var(--pack-w);height:calc(var(--pack-w) * 1.4845);pointer-events:none;filter:drop-shadow(0 24px 22px rgba(90,50,0,.35));animation:torn-shake .26s ease-out,torn-drop .48s cubic-bezier(.55,0,.8,.45) .38s forwards}.pack-torn img{position:absolute;inset:0;width:100%;height:100%}.pack-body{clip-path:polygon(0 16%,8% 18.5%,16% 15.5%,25% 18.5%,33% 15.5%,42% 18.5%,50% 15.5%,58% 18.5%,67% 15.5%,75% 18.5%,84% 15.5%,92% 18.5%,100% 16%,100% 100%,0 100%)}.pack-lid{clip-path:polygon(0 0,100% 0,100% 16%,92% 18.5%,84% 15.5%,75% 18.5%,67% 15.5%,58% 18.5%,50% 15.5%,42% 18.5%,33% 15.5%,25% 18.5%,16% 15.5%,8% 18.5%,0 16%);transform-origin:3% 17%;animation:lid-tear .62s cubic-bezier(.3,.1,.55,1) 40ms forwards}@keyframes torn-shake{0%,to{transform:none}30%{transform:rotate(-3deg) scale(1.04,.96)}65%{transform:rotate(2deg) scale(.98,1.02)}}@keyframes torn-drop{to{transform:translateY(38%) scale(.86) rotate(5deg);opacity:0}}@keyframes lid-tear{0%{transform:none}28%{transform:translate(1%,-2%) rotate(-10deg)}to{transform:translate(60%,-55%) rotate(-38deg);opacity:0}}.pack-slot{--from-x:calc((var(--mid) - var(--i)) * (var(--cw) + var(--gap)));--p0:var(--tomato);--p1:var(--sky);--p2:var(--sun);--p3:var(--leaf);--p4:#fff;position:relative;z-index:1;transform:rotate(var(--tilt));transition:scale .4s var(--ease-out),filter .4s}.pack-slot[data-rarity=rara]{--p0:#ffc53d;--p1:#ffe08a;--p2:#f4a62a;--p3:#fff1b8;--p4:#fff;--glow-core:rgba(255,244,200,.95);--glow:rgba(255,197,61,.5);--ray:rgba(255,210,90,.55);--ring:#ffd970}.pack-slot[data-rarity=brillante]{--p0:#ff8fc8;--p1:#ffe66b;--p2:#7be08c;--p3:#6bc5ff;--p4:#b38cff;--glow-core:rgba(255,255,250,.95);--glow:rgba(214,170,255,.45);--badge-delay:.75s;--sheen-delay:.6s;--spark-delay:200ms}.pack-stage[data-phase=opening] .pack-slot{animation:card-emerge .7s calc(.26s + var(--i) * 90ms) cubic-bezier(.25,.8,.35,1) both}@keyframes card-emerge{0%{transform:translate(var(--from-x),calc(var(--cw) * .25)) scale(.4) rotate(0deg);opacity:0}12%{opacity:1}42%{transform:translate(calc(var(--from-x) * .6),calc(var(--cw) * -.5)) scale(.85) rotate(calc(var(--tilt) * -4));animation-timing-function:cubic-bezier(.3,1.5,.55,1)}to{transform:translate(0) scale(1) rotate(var(--tilt));opacity:1}}.pack-cards[data-spotlight] .pack-slot:not([data-spot]){scale:.93;filter:brightness(.62) saturate(.7)}.pack-cards[data-spotlight] .pack-slot[data-spot]{z-index:4}.pack-slot[data-flipped]:not([data-rarity=comune]):not([data-spot]){z-index:0}.pack-cards[data-done] .pack-slot{animation:slot-hop .62s calc(1.25s + var(--i) * .11s) var(--ease-out) both}@keyframes slot-hop{0%,to{translate:0 0}35%{translate:0 -14%}65%{translate:0 2%}}.flip-card{position:relative;width:var(--cw);aspect-ratio:3/4;border:0;padding:0;background:none;border-radius:calc(var(--cw) * .08);perspective:1100px}.flip-card:disabled{cursor:default}.flip-card[data-next]{cursor:pointer}.flip-card[data-next]:before{content:"";position:absolute;inset:-10px;border-radius:calc(var(--cw) * .11);background:conic-gradient(from 0deg,#ffc53d,#ff8fab,#6bc5ff,#7be08c,#ffc53d);filter:blur(8px);opacity:.8;animation:spin 2.4s linear infinite;z-index:-1}.flip-card[data-next] .flip-inner{animation:next-bob 1.8s ease-in-out infinite}@keyframes next-bob{0%,to{translate:0 0}50%{translate:0 -4%}}@keyframes spin{to{transform:rotate(1turn)}}.pack-slot[data-charging] .flip-card:before{inset:-16px;opacity:1;filter:blur(12px);animation-duration:.7s}.pack-slot[data-rarity=rara][data-charging] .flip-card:before{background:conic-gradient(from 0deg,#ffc53d,#fff1b8,#f4a62a,#ffe08a,#ffc53d)}.pack-slot[data-rarity=brillante][data-charging] .flip-card:before{inset:-22px;animation:spin .5s linear infinite,halo-swell 1.15s ease-in both}@keyframes halo-swell{0%{opacity:.7;filter:blur(8px)}to{opacity:1;filter:blur(18px)}}.flip-inner{display:block;transform-style:preserve-3d}.flip-face,.flip-inner{position:absolute;inset:0}.flip-face{backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:inherit}.flip-back{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border-radius:calc(var(--cw) * .08);overflow:hidden;background:radial-gradient(circle at 50% 42%,rgba(255,197,61,.35),transparent 55%),radial-gradient(circle,rgba(255,255,255,.14) 1.5px,transparent 2px) 0 0 /18px 18px,linear-gradient(160deg,var(--night-2),var(--night));box-shadow:inset 0 0 0 calc(var(--cw) * .035) #fffdf8,inset 0 0 0 calc(var(--cw) * .05) rgba(255,197,61,.6),0 18px 30px -12px rgba(20,10,40,.5)}.flip-back img{width:46%;filter:drop-shadow(0 6px 8px rgba(0,0,0,.35))}.flip-back b{font-family:var(--font-display);font-weight:700;color:#fff;font-size:calc(var(--cw) * .13);letter-spacing:-.02em}.flip-front{transform:rotateY(180deg)}.flip-front .figurina{--w:var(--cw)}.pack-slot .fig-badge{top:calc(var(--w) * -.115);line-height:1.15;padding:calc(var(--w) * .014) calc(var(--w) * .065);font-size:calc(var(--w) * .078);background:var(--tomato-deep);box-shadow:0 calc(var(--w) * .022) 0 #7a2313}.pack-slot .is-double .fig-badge{background:var(--ink);box-shadow:0 calc(var(--w) * .022) 0 #0b0f25}.pack-slot .rarity-brillante .fig-rarity{box-shadow:0 0 0 min(2px,calc(var(--w) * .01)) #fff,0 0 0 min(4px,calc(var(--w) * .02)) #ff8fc8,0 0 0 min(6px,calc(var(--w) * .03)) #7fd2ff}.pack-slot .fig-badge{animation:badge-stamp .48s var(--badge-delay,.3s) cubic-bezier(.3,1.6,.5,1) both}@media (prefers-reduced-motion:reduce){.pack-slot .fig-badge{animation-delay:0s}}html[data-motion=reduced] .pack-slot .fig-badge{animation-delay:0s}@keyframes badge-stamp{0%{opacity:0;transform:translateX(-50%) scale(2.6) rotate(-18deg)}55%{opacity:1}to{opacity:1;transform:translateX(-50%) rotate(-4deg)}}.pack-slot[data-flipped]:not([data-rarity=comune]) .flip-front:after{content:"";position:absolute;inset:0;z-index:6;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,transparent 32%,rgba(255,255,255,.85) 46%,rgba(255,255,255,0) 60%) 0 0 /300% 100% no-repeat;animation:face-sheen 1s var(--sheen-delay,.35s) ease-out both}@keyframes face-sheen{0%{background-position:120% 0}to{background-position:-20% 0}}.card-aura{position:absolute;inset:0;z-index:-1;pointer-events:none}.aura-glow{position:absolute;left:50%;top:50%;width:calc(var(--cw) * 2.3);aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(closest-side,var(--glow-core),var(--glow) 42%,transparent 100%);animation:aura-bloom 1.4s var(--ease-out) both}@keyframes aura-bloom{0%{opacity:0;scale:.3}22%{opacity:1;scale:1.08}to{opacity:.55;scale:1}}.aura-rays{width:calc(var(--cw) * 3);animation:aura-rays-in 1.2s var(--ease-out) both,rays-settle 3s var(--ease-out) both}@keyframes rays-settle{0%{rotate:-60deg}to{rotate:0deg}}.pack-slot[data-rarity=brillante] .aura-rays{background:repeating-conic-gradient(from 0deg,hsl(340 100% 74%/.6) 0deg 6deg,transparent 6deg 14.4deg,hsl(45 100% 66%/.6) 14.4deg 20.4deg,transparent 20.4deg 28.8deg,hsl(140 80% 64%/.6) 28.8deg 34.8deg,transparent 34.8deg 43.2deg,hsl(198 100% 66%/.6) 43.2deg 49.2deg,transparent 49.2deg 57.6deg,hsl(275 100% 74%/.6) 57.6deg 63.6deg,transparent 63.6deg 72deg)}@keyframes aura-rays-in{0%{opacity:0;scale:.4}25%{opacity:1;scale:1.05}to{opacity:.4;scale:1}}.aura-ring{position:absolute;left:50%;top:50%;width:calc(var(--cw) * 1.3);aspect-ratio:1;translate:-50% -50%;border-radius:50%;border:calc(var(--cw) * .03) solid var(--ring,#fff);opacity:0;animation:ring-out .8s cubic-bezier(.1,.7,.3,1) both}.aura-ring+.aura-ring{animation-delay:.16s;border-width:calc(var(--cw) * .018)}.pack-slot[data-rarity=brillante] .aura-ring{border-color:transparent;background:conic-gradient(#ff8fc8,#ffe66b,#7be08c,#6bc5ff,#b38cff,#ff8fc8) border-box;-webkit-mask:linear-gradient(#000 0 0) padding-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) padding-box exclude,linear-gradient(#000 0 0)}@keyframes ring-out{0%{opacity:.95;scale:.4}to{opacity:0;scale:2.1}}.card-sparks{position:absolute;inset:0;z-index:3;pointer-events:none}.card-sparks i{position:absolute;left:50%;top:50%;width:calc(var(--cw) * .085);aspect-ratio:1;margin:calc(var(--cw) * -.0425);border-radius:50%;opacity:0;animation:spark-out .72s calc(var(--spark-delay, .12s) + var(--k) * 18ms) cubic-bezier(.15,.8,.35,1) both}.pack-slot:not([data-rarity=comune]) .card-sparks i{border-radius:0;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);width:calc(var(--cw) * .12);margin:calc(var(--cw) * -.06)}.card-sparks i:nth-child(5n+1){background:var(--p0)}.card-sparks i:nth-child(5n+2){background:var(--p1)}.card-sparks i:nth-child(5n+3){background:var(--p2)}.card-sparks i:nth-child(5n+4){background:var(--p3)}.card-sparks i:nth-child(5n){background:var(--p4)}@keyframes spark-out{0%{opacity:1;transform:rotate(var(--a)) translateY(calc(var(--cw) * -.35)) scale(.4)}70%{opacity:1}to{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--cw) * -1.15 * var(--r))) scale(1) rotate(160deg)}}.charge-motes{position:absolute;inset:0;z-index:3;pointer-events:none}.charge-motes i{position:absolute;left:50%;top:50%;width:calc(var(--cw) * .09);aspect-ratio:1;margin:calc(var(--cw) * -.045);border-radius:50%;opacity:0;box-shadow:0 0 calc(var(--cw) * .06) rgba(255,255,255,.85);animation:mote-in .56s ease-in infinite both}.charge-motes i:nth-child(5n+1){background:#ff8fc8}.charge-motes i:nth-child(5n+2){background:#ffe66b}.charge-motes i:nth-child(5n+3){background:#7be08c}.charge-motes i:nth-child(5n+4){background:#6bc5ff}.charge-motes i:nth-child(5n){background:#fff}@keyframes mote-in{0%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--cw) * -1.2)) scale(.6)}30%{opacity:1}to{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--cw) * -.3)) scale(1.2)}}.pack-foot{min-height:80px;display:grid;place-items:center}.pack-foot p{font-weight:800;color:var(--ink-2);font-size:clamp(16px,2vmin,26px)}