.account-pack-opening{--pack-accent:#c1d9cf;position:fixed;inset:0;margin:0;border:0;border-radius:0;padding:0;width:100vw;height:100dvh;max-width:none;max-height:none;color:#f1eee4;background:#0d1215;font-family:Arial,sans-serif;overflow:auto;color-scheme:dark}
.account-pack-opening[open]{display:flex;flex-direction:column}.account-pack-opening::backdrop{background:#0d1215}
.account-pack-opening *{box-sizing:border-box}.account-pack-opening button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}.account-pack-opening button:focus-visible{outline:2px solid #f5e9cc;outline-offset:6px}.account-pack-opening button:disabled{cursor:wait;opacity:.35}
.pack-atmosphere{position:absolute;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 32% 55%,#45615538,transparent 52%),radial-gradient(ellipse at 83% 5%,#49667522,transparent 60%)}
.pack-atmosphere:before{content:'';position:absolute;inset:10%;background:radial-gradient(ellipse at center,color-mix(in srgb,var(--pack-accent) 8%,transparent),transparent 65%);filter:blur(50px);animation:pack-breathe 9s ease-in-out infinite alternate}
.pack-atmosphere i{position:absolute;left:var(--x);top:var(--y);width:2px;height:2px;border-radius:50%;background:#ded6ba80;box-shadow:0 0 9px #dce3c75c;animation:pack-drift 15s var(--delay) linear infinite}
.pack-header,.pack-footer{position:relative;display:flex;align-items:center;justify-content:space-between;margin:0 5%;flex-shrink:0}.pack-header{min-height:95px;border-bottom:1px solid #ffffff10;font-size:11px;letter-spacing:.2em;color:#afbdbd}.pack-header b{font-weight:400;padding:0 15px;color:#6f8086}.pack-header button{font-size:31px;width:44px;height:44px;border-radius:50%;letter-spacing:0}.pack-header button:hover{background:#ffffff0d}
.pack-footer{padding:24px 0;gap:20px;font-size:12px;color:#9ca9ab}.pack-footer kbd{font:inherit;margin-right:6px}
.pack-layout{position:relative;flex:1;display:grid;grid-template-columns:1.12fr 1fr;gap:6vw;align-items:center;width:min(1240px,88%);margin:auto;padding:38px 0;min-height:0}
.pack-stage{height:min(62vh,610px);min-height:320px;position:relative;display:grid;place-items:center;perspective:1100px}.pack-stage:before{content:'';position:absolute;inset:8% -12%;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--pack-accent) 12%,transparent),transparent 66%);filter:blur(16px);pointer-events:none}
.pack-sealed{position:relative;min-height:0;min-width:0;height:100%;width:100%;display:grid;place-items:center;padding:0;transition:transform .5s ease}.pack-sealed img{position:absolute;inset:0;max-height:100%;max-width:100%;height:100%;width:100%;object-fit:contain;filter:drop-shadow(0 25px 40px #0008);animation:pack-float 7s ease-in-out infinite}.pack-sealed:hover{transform:translateY(-7px) rotate(-2deg)}
.pack-copy{max-width:490px}.pack-eyebrow{color:var(--pack-accent);font-size:11px;line-height:1.7;letter-spacing:.2em;margin:0 0 24px}.pack-copy h1{font-size:clamp(32px,3.3vw,57px);font-weight:400;line-height:1.09;letter-spacing:-.035em;margin:0 0 27px;text-wrap:balance}.pack-description{font-size:17px;color:#bec8c8;line-height:1.7;margin:0 0 30px;max-width:440px}.pack-status{min-height:22px;font-size:13px;line-height:1.6;color:#a6b8b9;margin:0 0 28px}.pack-actions{display:flex;gap:14px 24px;align-items:center;flex-wrap:wrap;min-height:53px}.pack-actions button{font-size:14px;padding:15px 0}.account-pack-opening .pack-primary{background:#f3ecd7;color:#151b1d;border-radius:30px;padding:17px 28px;min-width:156px}.account-pack-opening .pack-primary:hover{background:#fff8e5;box-shadow:0 0 30px #f1e6cc16}
.pack-card-reveal{position:relative;height:100%;width:100%;display:grid;place-items:center;animation:pack-reveal .85s cubic-bezier(.2,.7,.2,1) both;color:#bac7c7;text-align:center}.pack-card-reveal img{display:block;object-fit:contain;width:100%;height:100%;max-height:min(62vh,610px);filter:drop-shadow(0 23px 30px #0008) drop-shadow(0 0 30px color-mix(in srgb,var(--pack-accent) 17%,transparent))}
.account-pack-opening[data-phase="opening"] .pack-sealed{animation:pack-charge 1.2s ease-in-out infinite alternate}.account-pack-opening[data-phase="opening"] .pack-stage:before{animation:pack-breathe 1.1s infinite alternate}.account-pack-opening[data-phase="error"] .pack-sealed{opacity:.4}
@keyframes pack-float{50%{transform:translateY(-12px)}}@keyframes pack-breathe{to{opacity:.45;transform:scale(1.08)}}@keyframes pack-drift{from{transform:translateY(30px);opacity:0}20%,75%{opacity:.65}to{transform:translate(20px,-65px);opacity:0}}@keyframes pack-charge{to{transform:scale(.97);filter:brightness(1.17)}}@keyframes pack-reveal{from{opacity:0;transform:rotateY(-65deg) translateY(12px) scale(.95)}to{opacity:1;transform:none}}
@media(max-width:700px){.pack-header{min-height:74px;font-size:9px;letter-spacing:.12em}.pack-header b{padding:0 7px}.pack-layout{grid-template-columns:1fr;gap:28px;width:86%;padding:25px 0}.pack-stage{height:35dvh;min-height:230px}.pack-stage:before{inset:8% 0}.pack-card-reveal img{max-height:35dvh}.pack-copy{max-width:none;text-align:center}.pack-eyebrow{font-size:9px;margin-bottom:13px}.pack-copy h1{font-size:32px;margin-bottom:17px}.pack-description{font-size:14px;margin:0 auto 18px}.pack-status{margin-bottom:16px;font-size:12px}.pack-actions{justify-content:center;gap:8px 18px}.pack-actions button{font-size:12px}.account-pack-opening .pack-primary{padding:15px 22px}.pack-footer{font-size:9px;padding:20px 0}.pack-footer>span:first-child{display:none}.pack-footer{justify-content:center}}
@media(prefers-reduced-motion:reduce){.account-pack-opening *,.account-pack-opening :before{animation:none!important;transition:none!important}}
