/* A quieter layout and foil booster inspired by the reference screens. */
:root{--bg:#0b0e0c;--panel:#111713;--mint:#45cea0;--muted:#919b95;--border:#2b332e}
body{background:var(--bg)}
.sidebar{background:#111613;padding-top:32px}
.sidebar>.brand{gap:0;letter-spacing:-.8px}
.sidebar .brand-mark,.sidebar .brand small{display:none}
.nav{margin-top:58px;gap:10px}
.nav button{padding:18px 17px;border-radius:16px;font-weight:500;gap:16px}
.nav button svg{width:25px;height:25px;stroke-width:1.7}
.nav button.active{background:#192d24}
.topbar{justify-content:flex-end;margin-bottom:0;height:32px}
.topbar-label{display:none}
.topbar .pill{display:flex;align-items:center;border:0;background:#111a15;padding:7px 12px;}
.topbar .pill b{display:flex}.topbar .pill svg{width:17px;height:17px}
.main{padding-top:20px}
.packs-view{max-width:920px;margin:0 auto;text-align:center}
.intro{padding-top:4px}
.intro h1{line-height:1.15;font-weight:700;letter-spacing:-1.2px;margin-bottom:12px}
.intro p{color:#929a94}
.intro .text-button{padding:10px 14px}
.pack-stage{padding-top:0}
.pack-aura{position:relative;isolation:isolate;width:350px;height:380px;margin:24px 0 12px;background:none}
.pack-aura:before{content:'';position:absolute;inset:40px 25px;background:radial-gradient(ellipse,#c1944033 0%,#ac874016 45%,transparent 72%);filter:blur(19px);z-index:-1;transition:opacity .4s}
.foil-pack{position:relative;width:230px;height:345px;display:block;padding:0;background:transparent;border:0;filter:drop-shadow(0 4px 17px #e5c48224);transition:transform .35s cubic-bezier(.2,.7,.2,1),filter .35s}
.foil-pack>img{width:100%;height:100%;object-fit:contain;display:block}
.foil-pack:hover:not(:disabled){transform:translateY(-7px) rotate(-1.5deg);filter:drop-shadow(0 5px 22px #e5c48250)}
.foil-pack:disabled{opacity:.65}
.pack-stage>.pack-open{background:none;color:var(--mint);font-family:Outfit,sans-serif;font-weight:600;padding:10px 28px;min-width:130px;transform:none}
.pack-open:hover{color:#80edc7;background:#182b21;transform:none}
.stock{margin-top:26px;padding:17px 30px;min-width:194px;border-radius:18px;background:#111613}
.stock strong{}.stock strong span{}.stock small{margin-top:7px}
.timer{color:#707f74;margin-top:13px}
.opening .foil-pack{animation:unwrap .78s ease-in both;pointer-events:none}
.opening.pack-aura:before{animation:packFlash .78s ease-in both}
.reveal .counter{margin:14px 0 32px}.reveal .counter b{}
.reveal .new-label{display:none}
.reveal .card{width:330px;border-radius:20px;box-shadow:0 0 22px color-mix(in srgb,var(--tone) 26%,transparent)}
.reveal .card-art{height:220px}.reveal .card-body{min-height:250px;padding:22px 20px 17px}
.reveal .word{line-height:1.1;letter-spacing:-.7px;margin-bottom:9px}.reveal .translations{line-height:1.55}
.reveal .badge{top:12px;left:12px;padding:6px 9px}
.reveal .star{top:10px;right:10px;padding:7px;background:#12201e22}.reveal .star svg{width:24px;height:24px}
.reveal-nav{gap:22px;margin:30px 0}.round{width:52px;height:52px}.dots{gap:10px}.dots button{width:12px;height:12px}
.reveal>.primary{padding:16px 25px}
.grid{gap:25px}.card{border:0;border-radius:17px}.card-art{height:155px}.card-art img{transition:transform .5s}.card:hover .card-art img{transform:scale(1.035)}
.card-body{position:relative;isolation:isolate;min-height:142px;padding:16px 16px 12px;background:var(--light)}
.card-body:before{content:'';position:absolute;inset:0;z-index:-1;opacity:.22;background:repeating-radial-gradient(ellipse at 110% -20%,transparent 0 17px,#fff9 20px 23px,transparent 32px 45px);pointer-events:none}
.r0{--tone:#a9d5be;--light:#cdeadd;--dark:#47755d}.r1{--tone:#88bde9;--light:#c5dff6;--dark:#356990}.r2{--tone:#ad8ce4;--light:#ddd0f0;--dark:#73549d}.r3{--tone:#dd77aa;--light:#f3c9df;--dark:#a7477b}.r4{--tone:#e9c650;--light:#f5de87;--dark:#a78121}
.word{font-weight:700}.card-foot{letter-spacing:.6px;font-weight:600}.badge{}.star{background:#14201e22}.card.unowned{opacity:.64}
.card-art.photo-pending{background:color-mix(in srgb,var(--dark) 70%,#14221b)}
.page-heading{margin-top:16px}.page-heading h1{}.filters{margin-top:12px;margin-bottom:20px}.rarities{margin-bottom:28px}
.mini-profile{border-top-color:#253128}.summary-grid .card{width:195px}.summary-grid .card-art{height:145px}
@keyframes unwrap{0%{transform:translateY(0)}25%{transform:translateY(-6px) rotate(2deg)}48%{transform:translateY(0) rotate(-2deg)}70%{transform:scale(1.06);opacity:1;filter:brightness(1.6) drop-shadow(0 0 28px #ecdda7)}100%{transform:translateY(-20px) scale(1.1);opacity:0;filter:brightness(2)}}
@keyframes packFlash{70%{opacity:1;transform:scale(1.5)}100%{opacity:0;transform:scale(2)}}
@media(min-width:1500px){.layout{grid-template-columns:285px 1fr}.sidebar{width:285px;padding:34px 25px}.sidebar>.brand{}.main{padding-left:50px;padding-right:50px}.intro h1{}.pack-aura{height:400px}.foil-pack{width:244px;height:366px}.grid{grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}.card-art{height:165px}}
@media(min-width:721px) and (max-height:850px){.main{padding-top:15px}.topbar{height:25px}.intro h1{}.intro p{}.pack-aura{height:300px;margin:14px 0 0}.foil-pack{width:178px;height:267px}.stock{margin-top:19px;padding:13px 30px}.stock small{margin-top:4px}.reveal .counter{margin:4px 0 20px}.reveal .card{width:285px}.reveal .card-art{height:185px}.reveal .card-body{min-height:190px}.reveal-nav{margin:22px 0}}
@media(max-width:1050px) and (min-width:721px){.sidebar>.brand{}.nav button{}.grid{gap:18px}}
@media(max-width:720px){.sidebar{padding:0}.nav{margin:0;gap:0}.nav button{padding:12px 3px;border-radius:0;gap:5px}.nav button svg{width:21px;height:21px}.nav button.active{background:none}.topbar{height:29px;justify-content:space-between;margin-bottom:25px}.main{padding:18px 18px 96px}.intro{padding-top:0}.intro h1{margin-bottom:10px}.intro p{max-width:280px;margin:auto;line-height:1.5}.intro .text-button{padding:9px}.pack-aura{width:290px;height:310px;margin:17px 0 7px}.foil-pack{width:195px;height:292px}.stock{margin-top:21px;padding:13px 25px;min-width:190px}.pack-stage>.pack-open{}.stock strong{}.timer{margin-top:11px}.grid{gap:15px}.card-art{height:124px}.card-body{min-height:138px;padding:14px 12px 12px}.word{}.translations{}.badge{}.card-foot{}.page-heading h1{}.page-heading{margin-top:0}.reveal .counter{margin:0 0 24px}.reveal .card{width:min(310px,100%)}.reveal .card-art{height:200px}.reveal .card-body{min-height:215px;padding:20px}.reveal .word{}.reveal .translations{}.reveal-nav{margin:25px 0}.round{width:46px;height:46px}.dots button{width:10px;height:10px}.summary-grid .card{width:calc(50% - 10px)}}
@media(max-width:720px) and (max-height:750px){.topbar{margin-bottom:18px}.pack-aura{height:257px;margin-top:7px}.foil-pack{width:166px;height:249px}.intro h1{}.stock{margin-top:14px}}