/* Pack reveal scene. The collectible card's content and layout remain in cards.css. */
html.pack-reveal-open,html.pack-reveal-open body{overflow:hidden}
html.pack-reveal-open #toast{z-index:40}
.pack-reveal{--reveal-color:#b4bac6;--reveal-deep:#3f4450;--reveal-light:#e6e9ef;--reveal-glow:0px;position:fixed;inset:0;z-index:30;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;height:100dvh;padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px);overflow:hidden;isolation:isolate;background:#0a0911;color:#f2f3ee}
.pack-reveal-bg,.pack-reveal-fg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.pack-reveal-bg{z-index:0}.pack-reveal-fg{z-index:4}
.pack-reveal-top{position:relative;z-index:6;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px;padding:8px max(20px,env(safe-area-inset-right,0px)) 8px max(20px,env(safe-area-inset-left,0px));color:#b6b7c2;font-size:12px}
.pack-reveal-top>span{display:flex;align-items:baseline;gap:12px}.pack-reveal-top strong{color:#f1f2f6;letter-spacing:.04em;font-size:14px}.pack-reveal-progress{font-variant-numeric:tabular-nums;letter-spacing:.12em}
.pack-reveal-close{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:50%;background:#ffffff0b;color:#d7d9df;font-size:24px;font-weight:300;line-height:1}.pack-reveal-close:hover{background:#ffffff19}
.pack-reveal-stage{position:relative;z-index:2;min-width:0;min-height:0;perspective:1100px;touch-action:manipulation}
.pack-reveal-position{position:absolute;left:50%;top:50%;width:268px;height:375.2px;max-width:84%;transform:translate(-50%,-50%);transform-style:preserve-3d;will-change:transform}
.pack-reveal-motion{position:relative;width:100%;height:100%;transform:translate(var(--reveal-gx,0px),var(--reveal-gy,0px));transform-style:preserve-3d}
.pack-reveal .card.reveal-card{position:relative;z-index:1;display:block;width:100%;max-width:none;height:100%;padding:0;margin:0;aspect-ratio:5/7;animation:none;transform:none;box-shadow:none;touch-action:manipulation}
.pack-reveal .card.reveal-card:hover{transform:none}.pack-reveal .card.reveal-card:focus-visible{outline:2px solid #ffffffb3;outline-offset:10px}
.pack-reveal .card-v3{--idle:.1;--peak:.3;--g-idle:.08;--g-peak:.22}
.pack-reveal .card__tilt{transition:none;box-shadow:0 24px 55px #0009,0 0 var(--reveal-glow) color-mix(in srgb,var(--reveal-color) 35%,transparent)}
.pack-reveal .card__face::before{padding:1.5px;background:conic-gradient(from var(--spin),var(--ac-2),var(--reveal-light) 28deg,var(--ac) 60deg,var(--ac-2) 110deg,var(--ac-2) 180deg,var(--reveal-light) 208deg,var(--ac) 240deg,var(--ac-2) 290deg,var(--ac-2));animation:card-rim-spin 7s linear infinite!important;opacity:1}
.pack-reveal[data-theme="common"] .card__face::before{animation-duration:10s!important}
.pack-reveal[data-theme="epic"] .card__face::before{animation-duration:5s!important}
.pack-reveal[data-theme="legendary"] .card-v3{--idle:.12;--peak:.34;--g-idle:.09;--g-peak:.24}
.pack-reveal[data-theme="legendary"] .card__face::before{padding:clamp(1.5px,.65cqi,2px);background:conic-gradient(from var(--spin),#8c6019,#ffdf83 24deg,#fff8dc 44deg,#c89129 75deg,#7c5214 140deg,#ffe19b 192deg,#fff9df 220deg,#bd8420 265deg,#8c6019);animation-duration:3.6s!important}
.pack-reveal[data-theme="mythic"] .card-v3{--idle:.15;--peak:.4;--g-idle:.1;--g-peak:.26}
.pack-reveal[data-theme="mythic"] .card__face::before{padding:clamp(1.5px,.75cqi,2.3px);background:conic-gradient(from var(--spin),#ff6f9c,#fff 25deg,#ffb86b 70deg,#ff6f9c 120deg,#b86bff 170deg,#ffd1e0 210deg,#ff6f9c 250deg,#ffb86b 300deg,#ff6f9c);animation-duration:3.8s!important}
.pack-reveal[data-theme="transcendent"] .card-v3{--idle:.18;--peak:.46;--g-idle:.12;--g-peak:.3}
.pack-reveal[data-theme="transcendent"] .card__face::before{padding:clamp(1.6px,.8cqi,2.5px);animation-duration:6s!important;background:conic-gradient(from var(--spin),#ff68b9,#ffbd69 40deg,#fff7bc 72deg,#79ffd4 116deg,#77dbff 158deg,#fff 180deg,#9196ff 225deg,#dd85ff 268deg,#ff89be 306deg,#fff 330deg,#ff68b9)}
.pack-reveal[data-theme="mutation"] .card__face::before{background:conic-gradient(from var(--spin),#193522 0 18deg,#b5e99f 18deg 40deg,#193522 40deg 100deg,#b398e6 100deg 120deg,#193522 120deg 200deg,#b5e99f 200deg 220deg,#193522 220deg 300deg,#b398e6 300deg 315deg,#193522 315deg);animation-timing-function:steps(28)!important;animation-duration:4s!important}
.pack-reveal[data-theme="mutation"] .card__foil::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,#0005 0 1px,transparent 1px 4px);opacity:.2}
.pack-reveal-ghost-back,.pack-reveal-ghost-front{display:none;position:absolute;inset:0;border-radius:8.209% / 5.863%;pointer-events:none}
.pack-reveal[data-theme="mutation"] .pack-reveal-ghost-back{display:block;z-index:0;background:#9959e857;box-shadow:0 0 24px #9655ef55}
.pack-reveal[data-theme="mutation"] .pack-reveal-ghost-front{display:block;z-index:3;background:linear-gradient(#b77cff70,#a8e69630);mix-blend-mode:screen;opacity:0}
.pack-reveal .back{display:flex!important;align-items:center;justify-content:center;flex-direction:column;gap:14px;border:1px solid #8b939c75;border-radius:8.209% / 5.863%;background:radial-gradient(ellipse at 40% 25%,#59616c33,transparent 65%),repeating-linear-gradient(135deg,#a5aab509 0 1px,transparent 1px 13px),#13171e;box-shadow:0 25px 60px #0008!important;color:#c1c6cf;overflow:hidden}
.pack-reveal .back::before{content:"";position:absolute;inset:4%;border:1px solid #aab1bd26;border-radius:6% / 4.3%;pointer-events:none}
.pack-reveal .back-symbol{width:22%;height:auto;aspect-ratio:1;color:#b7bcc6;filter:drop-shadow(0 0 12px #b7bcc62b)}
.pack-reveal .back p{margin:0;font-size:clamp(9px,2.8vw,12px);letter-spacing:4px;color:#c1c6cf}.pack-reveal .back .card-meta{font-size:10px;letter-spacing:.04em;color:#7d8591}
.pack-reveal-info{position:relative;z-index:5;align-self:end;text-align:center;width:min(100%,540px);margin:0 auto;padding:10px 24px 8px;pointer-events:none}
.pack-reveal-info::before{content:"";position:absolute;inset:-25px -20px -20px;z-index:-1;background:radial-gradient(ellipse,#0a0911b8,transparent 72%)}
.pack-reveal-rarity{display:flex;align-items:center;justify-content:center;gap:8px;margin:0 0 7px;font-size:12px;font-weight:700;color:var(--reveal-color);letter-spacing:.08em}.pack-reveal-rarity i{width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 9px currentColor}
.pack-reveal-name{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;margin:0 0 10px;font-size:clamp(20px,4.8vw,28px);font-weight:700;line-height:1.35;letter-spacing:-.04em;word-break:keep-all;text-shadow:0 2px 20px #0009}
.pack-reveal-help{margin:0;color:#b1b2bf;font-size:12px;line-height:1.6}
.pack-reveal-bottom{position:relative;z-index:5;display:flex;align-items:center;justify-content:center;min-height:56px;padding:12px 24px 20px}
.pack-reveal-tray{display:flex;justify-content:center;gap:7px;margin:0;padding:0;list-style:none}
.pack-reveal-step{display:block;width:20px;height:4px;border-radius:4px;background:#ffffff1a}.pack-reveal-step.is-complete{background:var(--step-color,#b7bcc6);opacity:.6}.pack-reveal-step.is-current{background:var(--reveal-color);box-shadow:0 0 9px color-mix(in srgb,var(--reveal-color) 35%,transparent)}
@media(min-width:900px){.pack-reveal-top{padding-left:36px;padding-right:36px}.pack-reveal-bottom{min-height:72px}.pack-reveal-info{padding-bottom:12px}.pack-reveal-step{width:26px}}
@media(max-height:520px) and (min-width:560px){.pack-reveal{grid-template-columns:minmax(0,1fr) minmax(180px,32%);grid-template-rows:52px minmax(0,1fr) 48px}.pack-reveal-top{grid-column:1/-1;min-height:52px;padding-top:4px;padding-bottom:4px}.pack-reveal-stage{grid-column:1;grid-row:2/4}.pack-reveal-info{grid-column:2;grid-row:2;align-self:center;padding:8px 24px 8px 0}.pack-reveal-bottom{grid-column:2;grid-row:3;min-height:0;padding:8px 24px 14px 0}.pack-reveal-tray{gap:4px}.pack-reveal-step{width:13px}.pack-reveal-name{font-size:22px}}
@media(prefers-reduced-motion:reduce){.pack-reveal .card__face::before,.pack-reveal .card__face::after{animation:none!important}.pack-reveal .card__tilt{transform:none!important}.pack-reveal-motion{transform:none}.pack-reveal-ghost-back,.pack-reveal-ghost-front{display:none!important}}