:root { color-scheme: dark; --ink:#f3ead4; --muted:#a89c86; --panel:#17191c; --line:#37332c; --gold:#d8ad57; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:radial-gradient(circle at 50% -20%,#393323 0,#131416 42%,#090a0b 100%); color:var(--ink); font-family:Segoe UI,system-ui,sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.16; background-image:linear-gradient(90deg,transparent 49.8%,#fff1 50%,transparent 50.2%),linear-gradient(transparent 49.8%,#fff1 50%,transparent 50.2%); background-size:80px 80px; }
.topbar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:24px clamp(20px,5vw,72px); border-bottom:1px solid var(--line); background:#0d0f11dd; backdrop-filter:blur(12px); }
h1,h2,h3,p { margin-top:0; } h1 { margin-bottom:0; font-family:Georgia,serif; font-size:clamp(25px,4vw,42px); font-weight:500; } h2 { margin-bottom:8px; font-family:Georgia,serif; font-size:30px; }
.eyebrow { margin-bottom:5px; color:var(--gold); font-size:11px; font-weight:800; letter-spacing:.19em; text-transform:uppercase; }
.stats { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; }.stats span { padding:9px 12px; border:1px solid var(--line); border-radius:4px; color:var(--muted); font-size:13px; }.stats strong { color:var(--ink); }
main { width:min(1180px,calc(100% - 32px)); margin:32px auto 70px; }.panel { border:1px solid var(--line); background:linear-gradient(145deg,#202125,#121416); box-shadow:0 20px 50px #0006; }
.hero { display:flex; justify-content:space-between; align-items:center; gap:25px; padding:28px; }.hero p:last-child { max-width:670px; margin:0; color:var(--muted); line-height:1.55; }
button,select { border:1px solid #544b3a; border-radius:3px; padding:11px 15px; background:#17191b; color:var(--ink); font:inherit; cursor:pointer; }.primary { min-width:150px; border-color:#e0b756; color:#1b1405; background:linear-gradient(#ebc873,#b8872f); font-weight:800; box-shadow:0 0 24px #d7ad4d25; }.primary:hover { filter:brightness(1.1); }.ghost:hover,select:hover { border-color:var(--gold); }
.pack-buttons { max-width:470px; display:grid; grid-template-columns:repeat(2,minmax(145px,1fr)); gap:8px; }
.pack-buttons button { padding:9px 12px; font-size:12px; }
.pack-area { min-height:190px; margin-top:20px; padding:24px; display:flex; align-items:center; justify-content:center; gap:14px; overflow-x:auto; }.empty-copy { margin:0; color:var(--muted); }.pack-area .card { min-width:180px; animation:deal .45s backwards; }.pack-area .card:nth-child(2){animation-delay:.08s}.pack-area .card:nth-child(3){animation-delay:.16s}.pack-area .card:nth-child(4){animation-delay:.24s}.pack-area .card:nth-child(5){animation-delay:.32s}@keyframes deal{from{opacity:0;transform:translateY(30px) rotate(2deg)}}
.collection-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin:42px 0 15px; }.collection-heading h2 { margin:0; }.controls { display:flex; flex-wrap:wrap; gap:8px; }.collection { display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:18px; }
.card { position:relative; min-height:315px; padding:9px; border:2px solid var(--accent,#83775f); border-radius:11px; background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 22%,#1b1d20),#0d0f10 58%); box-shadow:0 10px 24px #0008,inset 0 0 0 4px #050606; cursor:pointer; transition:.18s transform,.18s box-shadow; }.card:hover{transform:translateY(-5px);box-shadow:0 17px 32px #000b,0 0 20px color-mix(in srgb,var(--accent) 25%,transparent),inset 0 0 0 4px #050606}.card.unowned{filter:grayscale(1);opacity:.38;cursor:default}.card.unowned .portrait,.card.unowned .card-copy{visibility:hidden}
.card-top,.grade-row { display:flex; justify-content:space-between; align-items:center; font-size:10px; letter-spacing:.09em; text-transform:uppercase; }.rarity { color:var(--accent); font-weight:800; }.portrait { height:115px; margin:8px 0; display:grid; place-items:center; border:1px solid color-mix(in srgb,var(--accent) 45%,#222); background:radial-gradient(circle,color-mix(in srgb,var(--accent) 30%,#181a1d),#090a0c); background-position:center 24%; background-size:cover; }.profession-mark { font:54px Georgia,serif; color:var(--accent); text-shadow:0 0 20px var(--accent); }.card-copy { min-height:119px; }.card h3 { margin:0 0 2px; font:20px Georgia,serif; }.subtitle { color:var(--accent); font-size:11px; text-transform:uppercase; letter-spacing:.1em; }.flavour { color:#aaa194; font:italic 12px Georgia,serif; line-height:1.4; }.grade-row { padding-top:8px; border-top:1px solid #ffffff1a; }.grade { color:var(--gold); font-size:23px; }.copy-count { position:absolute; right:8px; bottom:-10px; padding:3px 8px; border-radius:10px; background:#e7d2a0;color:#17120a;font-size:11px;font-weight:800; }
.common{--accent:#aaa18e}.uncommon{--accent:#62b47d}.rare{--accent:#5e9fe0}.elite{--accent:#b476dc}.legendary{--accent:#efb445}
dialog { width:min(520px,calc(100% - 30px)); border:1px solid var(--gold); border-radius:6px; padding:28px; background:#131518;color:var(--ink);box-shadow:0 30px 90px #000; }dialog::backdrop{background:#000b;backdrop-filter:blur(4px)}.dialog-close{position:absolute;right:10px;top:10px;padding:3px 10px;font-size:20px}.grade-detail{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:18px 0}.grade-detail div{padding:12px;border:1px solid var(--line);background:#0d0f11}.grade-detail span{display:block;color:var(--muted);font-size:11px;text-transform:uppercase}.grade-detail strong{font-size:22px}.final-grade{font:58px Georgia,serif;color:var(--gold)}
@media(max-width:720px){.topbar,.hero,.collection-heading{align-items:stretch;flex-direction:column}.stats{justify-content:flex-start}.pack-area{justify-content:flex-start}.controls>*{flex:1}.topbar{padding:20px}}

/* Collectible card redesign */
.collection { grid-template-columns:repeat(auto-fill,minmax(245px,1fr)); gap:26px; }
.pack-area { align-items:flex-start; padding-block:30px; }
.pack-area .card { min-width:245px; }
.card {
  min-height:430px;
  padding:9px;
  border:1px solid #ffffff35;
  border-radius:13px;
  background:linear-gradient(135deg,#eef3f3cc,#88949444 42%,#e6eeee99);
  box-shadow:0 16px 35px #000b,inset 0 0 0 1px #fff8;
  backdrop-filter:blur(3px);
}
.card::after { content:""; position:absolute; inset:3px; border:1px solid #fff5; border-radius:10px; pointer-events:none; }
.slab-label { height:48px; padding:4px 8px 7px; display:flex; align-items:center; justify-content:space-between; color:#181b1c; }
.slab-brand { display:flex; flex-direction:column; font:800 10px/1.15 Segoe UI,sans-serif; letter-spacing:.13em; }
.slab-brand small { margin-top:4px; color:#4f5759; font-size:9px; letter-spacing:.08em; }
.grade-box { display:flex; align-items:center; gap:8px; padding-left:9px; border-left:1px solid #20262844; }
.grade-box span { font-size:8px; font-weight:800; letter-spacing:.13em; }
.grade-box .grade { min-width:35px; color:#171a1b; font:700 28px/1 Georgia,serif; text-align:right; }
.card-inner { position:relative; min-height:355px; padding:9px; border:3px solid color-mix(in srgb,var(--accent) 75%,#201c14); border-radius:7px; overflow:hidden; background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 32%,#25211a),#090a0b 60%); box-shadow:inset 0 0 0 1px #f4ddb766,inset 0 0 22px #000; }
.card-inner::before { content:""; position:absolute; inset:0; opacity:.22; pointer-events:none; background:radial-gradient(circle at 20% 5%,#fff 0 1px,transparent 2px),radial-gradient(circle at 70% 35%,#fff 0 1px,transparent 2px); background-size:31px 37px,43px 47px; }
.nameplate { position:relative; height:34px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 7px; border-bottom:1px solid #e7d09e66; }
.card h3 { margin:0; overflow:hidden; font:600 20px/1 Georgia,serif; text-overflow:ellipsis; white-space:nowrap; text-shadow:0 1px 3px #000; }
.nameplate .rarity { flex:none; padding:3px 5px; border:1px solid currentColor; border-radius:2px; font-size:8px; letter-spacing:.12em; }
.portrait { position:relative; height:218px; margin:8px 0 0; border:1px solid #e7d09e99; box-shadow:inset 0 0 14px #0008; }
.portrait::after { content:""; position:absolute; inset:0; box-shadow:inset 0 -35px 35px #0005; pointer-events:none; }
.type-line { min-height:27px; padding:6px 5px 4px; display:flex; justify-content:space-between; gap:6px; border-bottom:1px solid #ffffff26; color:#ddd3c1; font-size:8px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.set-mark { color:var(--accent); }
.card-copy { position:relative; min-height:47px; display:grid; align-items:center; padding:7px 6px 4px; }
.flavour { margin:0; color:#d0c7b8; font:italic 12px/1.35 Georgia,serif; }
.card-footer { position:relative; display:flex; justify-content:space-between; padding:5px 5px 0; border-top:1px solid #ffffff20; color:#817b70; font-size:7px; font-weight:800; letter-spacing:.14em; }
.rarity-pips { color:var(--accent); text-shadow:0 0 7px var(--accent); }
.copy-count { right:-7px; bottom:-9px; z-index:3; min-width:34px; padding:5px 9px; border:2px solid #4a412f; background:#ead49f; box-shadow:0 3px 10px #000a; text-align:center; }
.card.unowned .card-inner { filter:grayscale(1); }
.card.unowned .portrait,.card.unowned .card-copy { visibility:visible; }
.card.unowned .portrait { background:#090a0b!important; }
.card.unowned .portrait::before { content:"?"; position:absolute; inset:0; display:grid; place-items:center; color:#595959; font:70px Georgia,serif; }
.card.unowned .nameplate h3,.card.unowned .subtitle,.card.unowned .flavour { color:transparent; }
.card.unowned .nameplate h3::after { content:"Undiscovered"; color:#827e77; }
@media(max-width:720px){.collection{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}

/* Guild Wars 1 art direction */
:root { --ink:#e8ddc2; --muted:#a69a82; --panel:#171510; --line:#4b4232; --gold:#b99a57; }
body { background:radial-gradient(ellipse at 50% -15%,#4a402d 0,#1e1b16 38%,#090a09 82%); }
body::before { opacity:.13; background-image:repeating-linear-gradient(112deg,transparent 0 36px,#c2a86a10 37px,#0000 39px),radial-gradient(circle at 20% 30%,#a9874914,transparent 37%); background-size:auto; }
.topbar { border-color:#5a4b34; background:linear-gradient(180deg,#181710f2,#0b0c0bf2); box-shadow:0 4px 16px #000; }
h1,h2 { color:#ded2b5; text-shadow:0 2px 2px #000; }
.panel { border-color:#5b4a30; background:linear-gradient(145deg,#272116,#12110e); box-shadow:0 20px 50px #0009,inset 0 0 35px #0006; }
.primary { border-color:#887144; color:#eee2c4; background:linear-gradient(#625337,#322919); box-shadow:inset 0 0 0 1px #bea67044,0 3px 10px #000; text-shadow:0 1px 2px #000; }
.card { min-height:430px; padding:0; border:0; border-radius:3px; background:#17130d; box-shadow:0 18px 34px #000c; backdrop-filter:none; clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px); }
.card::before { content:""; position:absolute; inset:0; z-index:0; pointer-events:none; background:linear-gradient(115deg,#d2b879 0,#67532e 9%,#291f12 13%,#a1864d 17%,#3a2c18 21%,#947744 80%,#2a2114 87%,#c6a865 100%); }
.card::after { inset:5px; z-index:0; border:1px solid #d4bd8055; border-radius:0; }
.slab-label { position:relative; z-index:1; height:45px; margin:5px 5px 0; padding:3px 8px; color:#d8c69e; background:linear-gradient(90deg,#17140e,#30291b 55%,#16130d); border-bottom:1px solid #917849; }
.slab-brand span { font-family:Georgia,serif; color:#c6af78; letter-spacing:.17em; }
.slab-brand small { color:#776d5b; }
.grade-box { border-color:#806b42; }.grade-box .grade { color:#d2b76f; text-shadow:0 0 10px #c29d4b55; }.grade-box span{color:#81735a}
.card-inner { z-index:1; min-height:374px; margin:0 7px 7px; padding:5px; border:1px solid #8f7444; border-radius:0; background:linear-gradient(155deg,#362b1a,#0d0d0b 66%); box-shadow:inset 0 0 0 2px #0b0a08,inset 0 0 20px #000; }
.card-inner::before { opacity:.17; background:repeating-linear-gradient(103deg,#d5bd7e18 0 1px,transparent 1px 7px); background-size:auto; }
.nameplate { height:35px; padding-inline:8px; border-bottom:1px solid #80693d; background:linear-gradient(90deg,#0d0d0b88,#73592a33,#0d0d0b88); }
.card h3 { color:#e7dcc3; font-size:19px; letter-spacing:.025em; }
.nameplate .rarity { border:0; color:var(--accent); font-size:8px; }
.portrait { height:225px; margin:5px 0 0; border:1px solid #806b42; background-position:center 21%; filter:saturate(.78) contrast(1.05); box-shadow:inset 0 0 18px #000; clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px)); }
.portrait::after { background:linear-gradient(0deg,#17120caa,transparent 30%); box-shadow:inset 0 0 25px #0008; }
.type-line { min-height:26px; padding-inline:7px; border-color:#6d5835; color:#b7aa91; background:#100f0ce8; }
.set-mark { color:#6f938e; }
.card-copy { min-height:49px; padding:8px 8px 5px; background:linear-gradient(#261e13bb,#12100c); }
.flavour { color:#bdb198; font-size:11px; }
.card-footer { border-color:#58482c; color:#5f574a; }.rarity-pips { color:var(--accent); }
.copy-count { right:-5px; bottom:-7px; border:1px solid #9b804a; border-radius:2px; color:#dfd1af; background:#211b11; box-shadow:0 3px 10px #000; }
.common{--accent:#8e897c}.uncommon{--accent:#64856e}.rare{--accent:#5f8d9e}.elite{--accent:#8b6d9b}.legendary{--accent:#b98d3f}

/* Compact collectible-card layout */
.collection { grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:24px; }
.pack-area .card { min-width:260px; }
.card { min-height:376px; padding:8px; border:3px solid #6e5528; border-radius:15px; background:linear-gradient(135deg,#d2b66e,#765c2e 38%,#d7bd76 72%,#55401f); clip-path:none; box-shadow:0 12px 24px #000a,inset 0 0 0 2px #ead28e99; }
.card::before { display:none; }.card::after { inset:4px; z-index:0; border:1px solid #342815; border-radius:11px; }
.card-inner { min-height:354px; margin:0; padding:8px; border:1px solid #3c301c; border-radius:9px; background:linear-gradient(145deg,#d8c99f,#ae9a6f); color:#282116; box-shadow:inset 0 0 18px #5c482933; }
.card-inner::before { opacity:.18; background:repeating-linear-gradient(105deg,#4d3a1d22 0 1px,transparent 1px 8px); }
.nameplate { height:50px; padding:2px 7px 5px; border:0; background:none; }
.nameplate>div:first-child { min-width:0; }.nameplate small { display:block; color:#746243; font:700 8px/1 Segoe UI,sans-serif; letter-spacing:.14em; }
.card h3 { margin-top:4px; color:#211c14; font:700 22px/1 Georgia,serif; text-shadow:none; }
.grade-box { align-self:center; flex:none; gap:4px; height:29px; padding:3px 7px; border:1px solid #8d764e; border-radius:50%; color:#44371f; background:#c8b88f88; }
.grade-box span { display:none; }.grade-box .grade { min-width:16px; color:#3a2c15; font:700 18px/1 Georgia,serif; text-align:center; text-shadow:none; }
.portrait { height:205px; margin:0; border:4px solid #574421; border-radius:3px; background-position:center 19%; filter:saturate(.86) contrast(1.03); box-shadow:0 2px 4px #0006,inset 0 0 12px #0008; clip-path:none; }
.portrait::after { background:linear-gradient(0deg,#1a130855,transparent 27%); }
.type-line { min-height:25px; margin:4px 4px 0; padding:5px 2px 4px; border-bottom:1px solid #806e4d; color:#443a2a; background:none; font-size:8px; }
.type-line .rarity { color:#315e67; }
.card-copy { min-height:47px; padding:7px 6px 4px; background:none; }
.flavour { color:#433929; font-size:11px; }
.card-footer { padding:5px 5px 0; border-color:#8c7955; color:#746344; }
.rarity-pips { color:#315e67; text-shadow:none; }
.copy-count { right:-7px; bottom:-8px; border:2px solid #9e8044; border-radius:12px; color:#f0dfb2; background:#241b0d; }
.card:hover { transform:translateY(-5px) rotate(-.25deg); box-shadow:0 18px 32px #000c,inset 0 0 0 2px #ead28e99; }
.card.unowned .card-inner { filter:grayscale(1); opacity:.66; }
@media(max-width:720px){.collection{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}}

.finish-badge { display:none; }
.dialog-finish { display:inline-block; margin:0 0 7px; padding:4px 8px; border:1px solid #796745; color:#d6bd82; font-size:10px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.holo .portrait::before { content:""; position:absolute; z-index:2; inset:-45% -90%; opacity:.34; pointer-events:none; background:linear-gradient(108deg,transparent 31%,#70fff077 39%,#78a8ff88 44%,#ef86e899 49%,#ffe78388 54%,#73ffe677 59%,transparent 67%); mix-blend-mode:screen; transform:translateX(-28%); animation:foil-sweep 6.8s ease-in-out infinite alternate; }
.reverse-holo .card-inner::after { content:""; position:absolute; z-index:2; inset:-28%; opacity:.34; pointer-events:none; background:repeating-linear-gradient(118deg,transparent 0 12px,#6fffe54d 18px,#74a8ff55 25px,#e98be05c 32px,#ffe47b4f 39px,transparent 48px),radial-gradient(circle at 30% 30%,#6fffe766,transparent 32%),radial-gradient(circle at 70% 65%,#e982df55,transparent 34%); background-size:170% 170%,100% 100%,100% 100%; mix-blend-mode:color-dodge; transform:translate3d(-5%,-4%,0) rotate(-2deg); animation:reverse-foil-drift 8s ease-in-out infinite alternate; }
.reverse-holo .portrait { z-index:2; }
.reverse-holo .portrait::after { box-shadow:inset 0 0 0 1000px #17120c28,inset 0 0 25px #0008; }
.reverse-holo .nameplate,.reverse-holo .type-line,.reverse-holo .card-copy,.reverse-holo .card-footer { position:relative; z-index:3; }
.holo,.reverse-holo { box-shadow:0 14px 28px #000b,0 0 18px #8bcfd544,inset 0 0 0 2px #f3dfa4aa; }
.alt-art { border-color:#c9b26c; background:linear-gradient(115deg,#352a18,#e8d38b 20%,#66502b 38%,#d0b96e 60%,#342815); }
.alt-art .card-inner { background:linear-gradient(145deg,#2a2115,#0e0d0a); }
.alt-art .nameplate { background:linear-gradient(90deg,#0c0b09,#2c2317); }
.alt-art .nameplate h3 { color:#fff7e7; text-shadow:0 1px 3px #000; }
.alt-art .nameplate small { color:#b7a77e; }
.alt-art .grade-box { border-color:#bda66b; background:#d2bf8d; }
.alt-art .portrait { height:205px; margin:0; border-color:#d7bd75; }
.alt-art .type-line { position:relative; z-index:4; left:auto; right:auto; bottom:auto; color:#f2e7ca; border-color:#76633d; background:#120e08; text-shadow:0 1px 2px #000; }
.alt-art .type-line .rarity { color:#f0cf72; }
.alt-art .card-copy { position:relative; z-index:4; left:auto; right:auto; bottom:auto; min-height:47px; background:linear-gradient(#20180f,#100c08); }
.alt-art .flavour { color:#e6dcc5; text-shadow:0 1px 2px #000; }
.alt-art .card-footer { position:relative; z-index:5; left:auto; right:auto; bottom:auto; border-top:1px solid #58482c; color:#c6b990; }
@keyframes foil-shift { from { background-position:-80% 0; } to { background-position:180% 0; } }
@keyframes foil-sweep { from { transform:translateX(-28%) rotate(-1deg); } to { transform:translateX(28%) rotate(1deg); } }
@keyframes reverse-foil-drift { from { transform:translate3d(-5%,-4%,0) rotate(-2deg); filter:hue-rotate(0deg); } to { transform:translate3d(5%,4%,0) rotate(2deg); filter:hue-rotate(35deg); } }
@media(prefers-reduced-motion:reduce){.finish-badge,.holo .portrait::before,.reverse-holo .card-inner::after{animation:none}}
@media(max-width:720px){.pack-buttons{grid-template-columns:1fr}}

/* Booster opening */
.opening-overlay[hidden] { display:none; }
.opening-overlay { position:fixed; z-index:100; inset:0; display:grid; place-items:center; overflow:hidden; background:radial-gradient(circle at 50% 45%,#5b4928 0,#18140df2 36%,#050605fa 80%); backdrop-filter:blur(8px); }
.opening-overlay::before { content:""; position:absolute; inset:-40%; opacity:.2; background:conic-gradient(from 0deg,transparent,#d6b66744,transparent 12%,transparent 45%,#7da8a344,transparent 57%); animation:opening-rays 9s linear infinite; }
.skip-opening { position:absolute; z-index:5; top:24px; right:28px; padding:8px 18px; border-color:#89754d; background:#100e0bcc; color:#ddc997; }
.opening-stage { position:relative; width:min(92vw,700px); height:min(82vh,690px); display:grid; place-items:center; perspective:1200px; }
.sealed-pack { position:absolute; z-index:3; width:265px; height:430px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; border:3px solid #b99a57; color:#ead9a9; background:radial-gradient(circle at 50% 35%,#765e30,#261d10 55%,#0d0c09); box-shadow:0 28px 65px #000, inset 0 0 0 5px #161109, inset 0 0 0 7px #a7894b55; clip-path:polygon(0 2%,4% 0,8% 2%,12% 0,16% 2%,20% 0,24% 2%,28% 0,32% 2%,36% 0,40% 2%,44% 0,48% 2%,52% 0,56% 2%,60% 0,64% 2%,68% 0,72% 2%,76% 0,80% 2%,84% 0,88% 2%,92% 0,96% 2%,100% 0,100% 98%,96% 100%,92% 98%,88% 100%,84% 98%,80% 100%,76% 98%,72% 100%,68% 98%,64% 100%,60% 98%,56% 100%,52% 98%,48% 100%,44% 98%,40% 100%,36% 98%,32% 100%,28% 98%,24% 100%,20% 98%,16% 100%,12% 98%,8% 100%,4% 98%,0 100%); }
.sealed-pack::after { content:""; position:absolute; inset:16px; border:1px solid #bda05d66; background:linear-gradient(115deg,transparent 25%,#fff2 36%,transparent 47%); background-size:260% 100%; animation:foil-shift 4s linear infinite; }
.sealed-pack small,.sealed-pack span { font-size:10px; font-weight:800; letter-spacing:.2em; }.sealed-pack strong { max-width:190px; font:700 31px/1.05 Georgia,serif; text-align:center; }.sealed-pack .pack-rune { font-size:66px; color:#77a19d; text-shadow:0 0 25px #8fd4cb; }
.sealed-pack.opening { animation:pack-shake .55s ease-in-out 1; }.sealed-pack.burst { opacity:0; transform:scale(1.8); filter:blur(12px); transition:.4s ease; }
.reveal-slot { position:relative; z-index:2; width:280px; min-height:400px; opacity:0; transform:translateY(50px) rotateY(90deg) scale(.8); }
.reveal-slot.active { opacity:1; transform:none; animation:card-reveal .5s cubic-bezier(.18,.8,.25,1.2); }
.reveal-slot .card { width:280px; }.reveal-slot.legendary-reveal { filter:drop-shadow(0 0 25px #e9bf58); }.reveal-slot.alt-art-reveal { filter:drop-shadow(0 0 38px #a8f3e9); }
.reveal-counter { position:absolute; z-index:4; bottom:0; color:#c7b58c; font-size:11px; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
@keyframes pack-shake { 20%{transform:rotate(-3deg)}40%{transform:rotate(4deg) scale(1.02)}60%{transform:rotate(-2deg)}80%{transform:rotate(1deg)} }
@keyframes card-reveal { from{opacity:0;transform:translateY(55px) rotateY(95deg) scale(.82);filter:brightness(2)}to{opacity:1;transform:none} }
@keyframes opening-rays { to{transform:rotate(360deg)} }
@media(max-width:600px){.opening-stage{height:88vh}.reveal-slot,.reveal-slot .card{width:250px}.sealed-pack{width:235px;height:380px}.skip-opening{top:12px;right:12px}}
@media(prefers-reduced-motion:reduce){.opening-overlay::before,.sealed-pack.opening,.reveal-slot.active{animation:none}}

/* Results-first booster reveal */
.opening-stage { width:min(94vw,860px); height:auto; min-height:650px; padding:38px 24px 45px; display:flex; flex-direction:column; justify-content:center; perspective:1200px; }
.opening-title { position:relative; z-index:2; align-self:stretch; text-align:center; }
.opening-title h2 { margin-bottom:18px; }
.standard-pulls { position:relative; z-index:2; display:grid; grid-template-columns:repeat(7,1fr); gap:9px; width:100%; }
.opening-standard-card.card { width:100%; min-width:0; min-height:166px; padding:4px; border-width:2px; border-radius:8px; cursor:default; animation:standard-deal .4s backwards; }
.opening-standard-card:nth-child(2){animation-delay:.04s}.opening-standard-card:nth-child(3){animation-delay:.08s}.opening-standard-card:nth-child(4){animation-delay:.12s}.opening-standard-card:nth-child(5){animation-delay:.16s}.opening-standard-card:nth-child(6){animation-delay:.20s}.opening-standard-card:nth-child(7){animation-delay:.24s}
.opening-standard-card .card-inner { min-height:154px; padding:3px; border-radius:5px; }
.opening-standard-card .nameplate { height:30px; padding:2px 4px; }.opening-standard-card .nameplate small { font-size:5px; }.opening-standard-card h3 { margin-top:2px; font-size:11px; }
.opening-standard-card .grade-box { height:20px; padding:2px 5px; }.opening-standard-card .grade-box .grade { min-width:10px; font-size:12px; }
.opening-standard-card .portrait { height:112px; border-width:2px; }
.opening-standard-card .type-line,.opening-standard-card .card-copy,.opening-standard-card .card-footer,.opening-standard-card .copy-count { display:none; }
.rare-heading { position:relative; z-index:2; margin:22px 0 8px; color:#cdb77f; font:700 10px Segoe UI,sans-serif; letter-spacing:.2em; text-transform:uppercase; }
.rare-pulls { position:relative; z-index:2; display:grid; grid-template-columns:repeat(3,210px); justify-content:center; gap:22px; min-height:316px; }
.rare-slot { width:210px; height:316px; perspective:1100px; filter:drop-shadow(0 15px 20px #000a); }
.card-back { width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:7px; border:5px solid #a78b4d; border-radius:13px; color:#cdb675; background:radial-gradient(circle,#4b3b20,#15110b 60%); box-shadow:inset 0 0 0 3px #19130b,inset 0 0 0 5px #796334; transform:rotateY(0); backface-visibility:hidden; }
.card-back::before { content:""; position:absolute; inset:16px; border:1px solid #877044; border-radius:50%; }
.card-back span { font-size:54px; color:#6f9c98; text-shadow:0 0 22px #75c4bc; }.card-back strong { font:700 22px Georgia,serif; letter-spacing:.12em; }.card-back small { font-size:8px; letter-spacing:.2em; }
.opening-rare-card.card { width:210px; min-height:316px; padding:6px; animation:rare-flip .7s cubic-bezier(.2,.75,.25,1); }
.opening-rare-card .card-inner { min-height:298px; padding:5px; }.opening-rare-card .nameplate { height:40px; }.opening-rare-card h3 { font-size:17px; }.opening-rare-card .portrait { height:177px; border-width:3px; }.opening-rare-card .type-line{min-height:22px}.opening-rare-card .card-copy{min-height:39px;padding-block:5px}.opening-rare-card .flavour{font-size:9px}.opening-rare-card .card-footer{font-size:6px}.opening-rare-card .copy-count{display:none}
.rare-slot.legendary-reveal { filter:drop-shadow(0 0 25px #e9bf58); }.rare-slot.alt-art-reveal { filter:drop-shadow(0 0 34px #a8f3e9); }
.reveal-counter { bottom:16px; }
@keyframes standard-deal{from{opacity:0;transform:translateY(-18px) scale(.92)}}
@keyframes rare-flip{0%{opacity:.2;transform:rotateY(180deg) scale(.86)}65%{filter:brightness(1.8)}100%{opacity:1;transform:none}}
@media(max-width:760px){.opening-overlay{overflow:auto}.opening-stage{min-height:920px;padding-top:70px}.standard-pulls{grid-template-columns:repeat(4,1fr)}.opening-standard-card.card{min-height:145px}.opening-standard-card .card-inner{min-height:133px}.opening-standard-card .portrait{height:91px}.rare-pulls{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.rare-slot,.opening-rare-card.card{width:100%;height:250px;min-height:250px}.opening-rare-card .card-inner{min-height:232px}.opening-rare-card .portrait{height:125px}.opening-rare-card .card-copy{display:none}}

/* Premium card face v2 */
.collection { grid-template-columns:repeat(auto-fill,minmax(248px,1fr)); gap:28px; }
.card {
  --frame:#857d6c; --frame-light:#c8bd9f; --surface:#d8ccb0; --surface-dark:#a99b7e;
  width:100%; min-height:0; aspect-ratio:5/7; padding:7px;
  border:1px solid #e9d99a99; border-radius:16px;
  background:linear-gradient(135deg,var(--frame-light),var(--frame) 28%,#33291a 48%,var(--frame) 72%,var(--frame-light));
  box-shadow:0 18px 34px #000c,inset 0 0 0 2px #fff5,inset 0 0 0 5px #21180d;
}
.card::after { inset:5px; border:1px solid #f7e7ad70; border-radius:12px; }
.card-inner {
  display:grid; grid-template-rows:44px 18px minmax(0,1fr) 27px 66px 16px;
  min-height:0; height:100%; margin:0; padding:7px;
  border:1px solid #2b2114; border-radius:10px;
  background:linear-gradient(145deg,var(--surface),var(--surface-dark));
  color:#251e13; box-shadow:inset 0 0 0 2px #f7edce88,inset 0 0 28px #3c2b142e;
}
.card-inner::before { opacity:.24; background:repeating-linear-gradient(108deg,#fff2 0 1px,transparent 1px 7px),radial-gradient(circle at 20% 10%,#fff7,transparent 28%); }
.common { --frame:#77736b; --frame-light:#bab4a7; --surface:#d4cbb7; --surface-dark:#a69d89; }
.uncommon { --frame:#47735e; --frame-light:#91b39d; --surface:#d5d0b5; --surface-dark:#a5a080; }
.rare { --frame:#32677b; --frame-light:#72aabd; --surface:#d7cfb4; --surface-dark:#a69a7b; }
.elite { --frame:#704f81; --frame-light:#ac83bf; --surface:#d5c7af; --surface-dark:#a4917b; }
.legendary { --frame:#a87724; --frame-light:#edcb70; --surface:#dfd0a9; --surface-dark:#ad9566; }
.nameplate { position:relative; z-index:4; height:auto; padding:1px 5px 3px; border:0; background:none; }
.card-identity { min-width:0; align-self:center; }
.nameplate small { margin-bottom:3px; color:#665943; font:800 7px/1 Segoe UI,sans-serif; letter-spacing:.16em; }
.card h3 { margin:0; color:#1c1710; font:700 clamp(17px,1.55vw,22px)/1 Georgia,serif; letter-spacing:.015em; text-shadow:0 1px #fff7; }
.grade-box { width:29px; height:29px; padding:0; display:grid; place-items:center; border:1px solid #675536; border-radius:50%; background:radial-gradient(circle at 35% 25%,#f3e4b9,#ad9869); box-shadow:0 1px 0 #fff8,inset 0 0 0 2px #6f5b3633; }
.grade-box .grade { min-width:0; color:#30230f; font:800 15px/1 Georgia,serif; }
.rank-line { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; padding:0 5px; border-top:1px solid #6e5b39; color:#55472e; font:800 7px/1 Segoe UI,sans-serif; letter-spacing:.14em; text-transform:uppercase; }
.rank-line .rarity-pips { color:var(--frame); font-size:9px; letter-spacing:.06em; }
.rank-line .rarity { color:#3e3423; }
.art-frame { position:relative; z-index:3; min-height:0; padding:4px; border:1px solid #3a2c17; background:linear-gradient(135deg,#d8be76,#4d391d 38%,#e4cc8b 70%,#3e2d18); box-shadow:0 2px 5px #21160b99; }
.portrait { width:100%; height:100%; margin:0; border:1px solid #17120b; border-radius:0; background-position:center 20%; filter:saturate(.92) contrast(1.05); box-shadow:inset 0 0 18px #0007; }
.type-line { position:relative; z-index:3; min-height:0; margin:0; padding:6px 5px 4px; border:0; color:#302719; background:linear-gradient(90deg,#74603b1c,#fff4,#74603b1c); font-size:8px; }
.type-line::before,.type-line::after { content:"◆"; color:var(--frame); font-size:6px; }
.type-line .subtitle { margin-right:auto; padding-left:5px; color:#2d2519; }
.edition-mark { color:#695b42; font-size:6px; letter-spacing:.12em; }
.card-copy { position:relative; z-index:3; min-height:0; padding:5px 7px; display:block; border:1px solid #7c6845; background:linear-gradient(#eee4c8cc,#cfc19fcc); box-shadow:inset 0 0 12px #6c553326; }
.lore-rule { display:flex; align-items:center; gap:5px; color:#6b593a; font:800 6px/1 Segoe UI,sans-serif; letter-spacing:.16em; }
.lore-rule::after { content:""; flex:1; height:1px; background:#8f7951; }
.flavour { margin-top:7px; color:#32291d; font:italic 10px/1.3 Georgia,serif; }
.card-footer { position:relative; z-index:3; padding:5px 3px 0; border:0; color:#5c4e38; font-size:6px; }
.collector-mark { letter-spacing:.12em; }
.copy-count { z-index:7; right:-6px; bottom:-7px; border-color:var(--frame-light); }
.card:hover { transform:translateY(-7px) rotate(-.35deg); box-shadow:0 24px 42px #000d,0 0 24px color-mix(in srgb,var(--frame-light) 25%,transparent),inset 0 0 0 2px #fff5,inset 0 0 0 5px #21180d; }

.alt-art .card-inner { background:linear-gradient(145deg,#292116,#0c0b08); }
.alt-art .nameplate { margin:-1px -1px 0; padding-inline:7px; background:linear-gradient(90deg,#100d09,#3a2e1c,#100d09); }
.alt-art .nameplate h3 { color:#fff; text-shadow:0 1px 4px #000; }
.alt-art .nameplate small { color:#c9b98d; }
.alt-art .rank-line { border-color:#7f683d; color:#ddc78e; background:#15110b; }
.alt-art .rank-line .rarity,.alt-art .rank-line .rarity-pips { color:#f0d477; }
.alt-art .type-line { color:#eee0bb; background:#15110b; }
.alt-art .type-line .subtitle,.alt-art .edition-mark { color:#eee0bb; }
.alt-art .card-copy { background:linear-gradient(#251d12,#100d09); border-color:#766039; }
.alt-art .lore-rule,.alt-art .flavour { color:#e9dcc0; }
.alt-art .lore-rule::after { background:#766039; }
.alt-art .card-footer { color:#bcae8a; }

.opening-standard-card.card { aspect-ratio:5/7; min-height:0; }
.opening-standard-card .card-inner { grid-template-rows:30px 12px minmax(0,1fr); min-height:0; }
.opening-standard-card .rank-line { font-size:5px; }
.opening-standard-card .art-frame { padding:2px; }
.opening-standard-card .portrait { height:100%; }
.opening-standard-card .type-line,.opening-standard-card .card-copy,.opening-standard-card .card-footer { display:none; }
.opening-rare-card.card { aspect-ratio:5/7; min-height:0; }
.opening-rare-card .card-inner { grid-template-rows:37px 15px minmax(0,1fr) 23px 51px 13px; min-height:0; }
.opening-rare-card .portrait { height:100%; }
.opening-rare-card .flavour { margin-top:5px; font-size:8px; }
@media(max-width:760px){.collection{grid-template-columns:repeat(auto-fill,minmax(235px,1fr))}}

/* Booster wrapper */
.pack-action { display:flex; align-items:center; gap:20px; }
.pack-action .pack-buttons { width:300px; grid-template-columns:1fr; }
.booster-pack { position:relative; flex:none; width:160px; height:265px; padding:0; overflow:hidden; border:0; border-radius:5px; color:#f7e7b7; background:#17110a; box-shadow:0 18px 28px #000b,0 0 0 1px #d7ba6d; isolation:isolate; }
.booster-pack::before { content:""; position:absolute; z-index:3; inset:-20% -75%; pointer-events:none; background:linear-gradient(108deg,transparent 32%,#ffffff80 42%,#77e8ff55 48%,#ef8ddd55 53%,#ffe07a55 58%,transparent 68%); mix-blend-mode:screen; transform:translateX(-27%); animation:pack-foil-sweep 7.5s ease-in-out infinite alternate; }
.booster-pack::after { content:"OPEN BOOSTER"; position:absolute; z-index:6; left:16px; right:16px; bottom:22px; padding:7px 5px; border:1px solid #efd17e; color:#160f07; background:linear-gradient(#f3d78b,#aa762b); box-shadow:0 2px 8px #000; font:900 9px/1 Segoe UI,sans-serif; letter-spacing:.14em; }
.pack-art { position:absolute; z-index:1; inset:12px 5px; background:linear-gradient(0deg,#0e0a06 2%,transparent 44%,#0c0906aa 100%),url('assets/cards/the-searing.png') center/cover; filter:saturate(1.08) contrast(1.08); }
.pack-brand { position:absolute; z-index:5; top:24px; left:9px; right:9px; display:flex; align-items:center; justify-content:center; gap:4px; color:#fff4d6; font:900 15px/.82 Georgia,serif; letter-spacing:.05em; text-align:left; text-shadow:0 2px 5px #000,0 0 6px #000; }
.pack-brand img { width:46px; height:46px; filter:drop-shadow(0 2px 3px #000); }
.pack-edition { position:absolute; z-index:5; left:0; right:0; top:76px; color:#f1c967; font:800 8px/1 Segoe UI,sans-serif; letter-spacing:.25em; text-shadow:0 2px 3px #000; }
.pack-count { position:absolute; z-index:5; left:0; right:0; bottom:58px; font:800 7px/1 Segoe UI,sans-serif; letter-spacing:.16em; text-shadow:0 1px 4px #000; }
.pack-crimp { position:absolute; z-index:7; left:0; right:0; height:13px; background:repeating-linear-gradient(90deg,#a68745 0 4px,#ead28b 4px 7px,#59411f 7px 10px); box-shadow:0 1px 3px #000; }
.pack-crimp-top { top:0; clip-path:polygon(0 0,100% 0,100% 72%,97% 100%,94% 72%,91% 100%,88% 72%,85% 100%,82% 72%,79% 100%,76% 72%,73% 100%,70% 72%,67% 100%,64% 72%,61% 100%,58% 72%,55% 100%,52% 72%,49% 100%,46% 72%,43% 100%,40% 72%,37% 100%,34% 72%,31% 100%,28% 72%,25% 100%,22% 72%,19% 100%,16% 72%,13% 100%,10% 72%,7% 100%,4% 72%,0 100%); }
.pack-crimp-bottom { bottom:0; transform:rotate(180deg); }
.booster-pack:hover { transform:translateY(-7px) rotate(1deg); filter:brightness(1.08); box-shadow:0 25px 36px #000d,0 0 24px #d4ad5366; }
@keyframes pack-foil-sweep { from { transform:translateX(-27%) rotate(-1deg); opacity:.46; } to { transform:translateX(27%) rotate(1deg); opacity:.72; } }

/* LittyWatch collector card back */
.card-back { position:relative; overflow:hidden; gap:9px; border:5px solid #ba9650; border-radius:14px; color:#f2dfaa; background:radial-gradient(circle at 50% 47%,#193e55 0,#071b2a 38%,#080d14 70%); box-shadow:inset 0 0 0 2px #f2d27d,inset 0 0 0 7px #1b1208,0 14px 24px #000b; }
.card-back::before { inset:17px; border:1px solid #d0a94f; border-radius:10px; box-shadow:inset 0 0 0 3px #0a1018,0 0 16px #46c8ff44; }
.card-back::after { content:""; position:absolute; inset:-35%; background:repeating-conic-gradient(from 0deg,#d5ab521b 0 2deg,transparent 2deg 18deg); animation:opening-rays 18s linear infinite; }
.back-orbit { position:relative; z-index:3; width:112px; height:112px; display:grid; place-items:center; border:1px solid #d5ae5b; border-radius:50%; background:radial-gradient(circle,#163c52,#07121c 68%); box-shadow:0 0 0 5px #091018,0 0 0 6px #896c36,0 0 25px #39b9f477; }
.back-orbit::before,.back-orbit::after { content:"✦"; position:absolute; top:50%; color:#e8c56d; font-size:16px; text-shadow:0 0 8px #f0cf72; }
.back-orbit::before { left:-20px; transform:translateY(-50%); }.back-orbit::after { right:-20px; transform:translateY(-50%); }
.back-orbit img { width:82px; height:82px; object-fit:contain; filter:drop-shadow(0 0 10px #38c2ff88); }
.card-back strong,.card-back small { position:relative; z-index:3; }
.card-back strong { font:800 15px/1 Georgia,serif; letter-spacing:.13em; text-shadow:0 2px 4px #000; }
.card-back small { color:#ae986d; font-size:6px; letter-spacing:.17em; }
@media(max-width:800px){.hero{align-items:center}.pack-action{width:100%;flex-direction:column}.pack-action .pack-buttons{width:min(100%,360px)}}

/* Clear booster result tray */
.opening-stage { width:min(94vw,960px); min-height:680px; padding:32px 28px 48px; }
.opening-title h2 { margin-bottom:14px; }
.standard-pulls { grid-template-columns:repeat(7,minmax(0,1fr)); gap:10px; padding:10px; border:1px solid #695735; border-radius:11px; background:linear-gradient(180deg,#0d1013cc,#17130dcc); box-shadow:inset 0 0 24px #000,0 12px 30px #0007; }
.standard-pull { position:relative; min-width:0; aspect-ratio:4/5; overflow:hidden; border:2px solid var(--frame); border-radius:8px; background:#0b0d0f; box-shadow:inset 0 0 0 1px var(--frame-light),0 6px 12px #000b; animation:standard-deal .4s backwards; }
.standard-pull:nth-child(2){animation-delay:.04s}.standard-pull:nth-child(3){animation-delay:.08s}.standard-pull:nth-child(4){animation-delay:.12s}.standard-pull:nth-child(5){animation-delay:.16s}.standard-pull:nth-child(6){animation-delay:.20s}.standard-pull:nth-child(7){animation-delay:.24s}
.standard-art { position:absolute; inset:4px 4px 36px; border:1px solid #c9ad6a88; border-radius:4px 4px 1px 1px; background-position:center 20%; background-size:cover; box-shadow:inset 0 -20px 25px #0005; }
.standard-info { position:absolute; left:4px; right:4px; bottom:4px; height:30px; display:flex; flex-direction:column; justify-content:center; min-width:0; padding:3px 5px; border-radius:1px 1px 4px 4px; color:#f1e6ca; background:linear-gradient(90deg,#15120d,#2d2619,#15120d); text-align:left; }
.standard-info strong { overflow:hidden; font:700 10px/1.05 Georgia,serif; text-overflow:ellipsis; white-space:nowrap; }
.standard-info span { margin-top:3px; overflow:hidden; color:var(--frame-light); font:800 5px/1 Segoe UI,sans-serif; letter-spacing:.08em; text-overflow:ellipsis; text-transform:uppercase; white-space:nowrap; }
.rare-heading { margin:18px 0 10px; }
.rare-pulls { grid-template-columns:repeat(3,220px); gap:24px; min-height:330px; }
.rare-slot { width:220px; height:330px; }
.opening-rare-card.card { width:220px; height:330px; }
.reveal-counter { bottom:14px; }
@media(max-width:760px){
  .opening-stage{min-height:950px;padding:64px 14px 45px}
  .standard-pulls{grid-template-columns:repeat(4,minmax(0,1fr));max-width:560px}
  .rare-pulls{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;gap:8px}
  .rare-slot,.opening-rare-card.card{width:100%;height:auto;aspect-ratio:2/3}
  .opening-rare-card .card-inner{height:100%}
}

/* Four selectable booster products */
.hero { align-items:flex-start; }
.pack-shelf { width:min(100%,590px); display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.pack-shelf .booster-pack { width:100%; height:auto; aspect-ratio:160/265; }
.pack-shelf .booster-pack::after { display:none; }
.pack-shelf .pack-brand { top:20px; gap:2px; font-size:10px; }
.pack-shelf .pack-brand img { width:34px; height:34px; }
.pack-shelf .pack-edition { top:60px; font-size:6px; }
.pack-kind { position:absolute; z-index:5; left:5px; right:5px; bottom:41px; color:#fff1c9; font:900 9px/1 Georgia,serif; letter-spacing:.08em; text-shadow:0 2px 4px #000; }
.pack-shelf .pack-count { bottom:22px; font-size:5px; }
.pack-holo { filter:hue-rotate(155deg) saturate(1.25); }
.pack-holo .pack-brand,.pack-holo .pack-kind,.pack-holo .pack-count,.pack-holo .pack-edition { filter:hue-rotate(-155deg); }
.pack-reverse { filter:hue-rotate(235deg) saturate(1.18); }
.pack-reverse .pack-brand,.pack-reverse .pack-kind,.pack-reverse .pack-count,.pack-reverse .pack-edition { filter:hue-rotate(-235deg); }
.pack-alt { filter:hue-rotate(285deg) saturate(1.28); }
.pack-alt .pack-brand,.pack-alt .pack-kind,.pack-alt .pack-count,.pack-alt .pack-edition { filter:hue-rotate(-285deg); }
.pack-dialog { width:min(470px,calc(100% - 28px)); }
.pack-summary { color:var(--muted); line-height:1.5; }
.odds-list { display:grid; gap:8px; margin:20px 0 24px; padding:0; list-style:none; }
.odds-list li { padding:10px 12px; border:1px solid #4e4433; background:#0d0e0f; color:#d8c9a9; font-size:12px; }
.pack-dialog .primary { width:100%; }
.opening-overlay.ready-to-close { cursor:pointer; }
.opening-overlay.ready-to-close .reveal-counter { color:#f0d17f; animation:continue-pulse 1.4s ease-in-out infinite; }
@keyframes continue-pulse { 50%{opacity:.5} }
@media(max-width:900px){.hero{align-items:center}.pack-shelf{width:100%}}
@media(max-width:600px){.pack-shelf{grid-template-columns:repeat(2,1fr);max-width:360px}.pack-shelf .booster-pack{max-width:170px}}

/* Physical foil pack silhouette */
.pack-shelf { gap:14px; perspective:1000px; }
.pack-shelf .booster-pack {
  aspect-ratio:158/278; overflow:hidden; border:0; border-radius:2px;
  clip-path:polygon(0 3%,3% 1%,6% 3%,9% 1%,12% 3%,15% 1%,18% 3%,21% 1%,24% 3%,27% 1%,30% 3%,33% 1%,36% 3%,39% 1%,42% 3%,45% 1%,48% 3%,51% 1%,54% 3%,57% 1%,60% 3%,63% 1%,66% 3%,69% 1%,72% 3%,75% 1%,78% 3%,81% 1%,84% 3%,87% 1%,90% 3%,93% 1%,96% 3%,100% 1%,100% 99%,96% 97%,93% 99%,90% 97%,87% 99%,84% 97%,81% 99%,78% 97%,75% 99%,72% 97%,69% 99%,66% 97%,63% 99%,60% 97%,57% 99%,54% 97%,51% 99%,48% 97%,45% 99%,42% 97%,39% 99%,36% 97%,33% 99%,30% 97%,27% 99%,24% 97%,21% 99%,18% 97%,15% 99%,12% 97%,9% 99%,6% 97%,3% 99%,0 97%);
  box-shadow:none; transform:rotate(var(--pack-tilt,0deg)); transition:.22s transform,.22s filter;
}
.pack-standard{--pack-tilt:-1.5deg}.pack-holo{--pack-tilt:.7deg}.pack-reverse{--pack-tilt:-.5deg}.pack-alt{--pack-tilt:1.2deg}
.pack-shelf .booster-pack:hover { transform:translateY(-10px) rotate(0deg) scale(1.025); }
.pack-shelf .booster-pack::after { content:""; display:block; position:absolute; z-index:7; inset:5px 3px; border:1px solid #fff3; border-radius:8px 8px 13px 13px; background:transparent; box-shadow:inset 7px 0 10px #0005,inset -7px 0 10px #fff1; pointer-events:none; }
.pack-seal { position:absolute; z-index:8; left:0; right:0; height:17px; background:repeating-linear-gradient(90deg,#3e321e 0 3px,#dfc379 3px 5px,#796034 5px 8px); box-shadow:0 2px 4px #0008; }
.pack-seal::after { content:""; position:absolute; left:50%; top:0; bottom:0; width:1px; background:#fff7; box-shadow:-3px 0 #0006,3px 0 #0005; }
.pack-seal-top { top:0; }.pack-seal-bottom { bottom:0; transform:rotate(180deg); }
.pack-shelf .pack-art { inset:13px 4px 14px; border-radius:7px 7px 12px 12px; box-shadow:inset 0 0 18px #0009; }
.pack-shelf .pack-brand { top:29px; font-size:9px; line-height:.9; }
.pack-brand strong i { color:#edcb76; font:italic 700 8px Georgia,serif; letter-spacing:.16em; }
.pack-shelf .pack-edition { top:72px; }
.pack-shelf .pack-kind { bottom:49px; }
.pack-shelf .pack-count { bottom:31px; }
.pack-shelf::after { content:""; grid-column:1/-1; height:16px; margin:-10px 18px 0; border-radius:50%; background:#0009; filter:blur(8px); }
.hero { flex-direction:column; }
.hero>div:first-child { width:100%; }
.hero .pack-shelf { align-self:center; width:min(100%,780px); }
@media(max-width:900px){.hero .pack-shelf{width:min(100%,680px)}}

/* Regional Prophecies boosters */
.pack-ascalon .pack-art { background-image:linear-gradient(0deg,#100904 2%,transparent 44%,#0c0906aa 100%),url('assets/cards/ascalon-vanguard.png'); }
.pack-shiverpeaks .pack-art { background-image:linear-gradient(0deg,#061019 2%,transparent 44%,#071019aa 100%),url('assets/cards/frost-gate.png'); }
.pack-desert .pack-art { background-image:linear-gradient(0deg,#130d04 2%,transparent 44%,#130c03aa 100%),url('assets/cards/ascension.png'); }
.pack-ascalon { --pack-tilt:.7deg; }
.pack-shiverpeaks { --pack-tilt:-.5deg; }
.pack-desert { --pack-tilt:1.2deg; }

/* Collection deck builder */
.deck-add { position:absolute; z-index:8; left:12px; bottom:-9px; padding:5px 8px; border:1px solid var(--frame-light); border-radius:10px; color:#f1dfae; background:#17120c; font-size:7px; font-weight:900; letter-spacing:.1em; }
.deck-add:hover { background:#302513; }
.deck-builder { margin-top:46px; padding:26px; }
.deck-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.deck-heading h2 { margin-bottom:5px; }
.deck-heading p:last-child { margin:0; color:var(--muted); }
.deck-count { flex:none; width:105px; height:105px; display:grid; place-content:center; border:1px solid #8d7442; border-radius:50%; background:radial-gradient(circle,#332817,#100e0a 70%); text-align:center; box-shadow:inset 0 0 18px #000,0 0 18px #b58e3c22; }
.deck-count strong { color:#e5c777; font:700 35px/1 Georgia,serif; }
.deck-count span { margin-top:5px; color:#9d8b66; font-size:8px; letter-spacing:.12em; text-transform:uppercase; }
.deck-actions { display:flex; gap:8px; margin:20px 0 14px; }
.deck-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:9px; min-height:76px; }
.deck-card { min-width:0; min-height:66px; padding:7px; display:grid; grid-template-columns:46px minmax(0,1fr) 18px; align-items:center; gap:9px; border-color:#51452f; background:linear-gradient(135deg,#171612,#0d0e0e); text-align:left; }
.deck-card:hover { border-color:#ad8c4c; }
.deck-thumb { width:46px; height:52px; border:1px solid #78633b; background-position:center 20%; background-size:cover; }
.deck-card strong,.deck-card small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.deck-card strong { color:#e5d8bc; font:700 13px Georgia,serif; }
.deck-card small { margin-top:5px; color:#8e816b; font-size:7px; text-transform:uppercase; }
.deck-card b { color:#776b59; font-size:17px; text-align:center; }
@media(max-width:650px){.deck-heading{align-items:flex-start}.deck-count{width:78px;height:78px}.deck-actions{flex-direction:column}.deck-actions button{width:100%}}

/* Product overview */
.product-lab { margin-top:20px; padding:22px; display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:22px; align-items:stretch; }
.product-group { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.product-group h3 { margin:0 0 5px; color:#e5d8bb; font:700 20px Georgia,serif; }
.product-group p:last-child { margin:0; color:var(--muted); font-size:12px; }
.single-packs { display:flex; gap:8px; }
.single-packs button { width:92px; height:118px; padding:12px 6px 9px; display:flex; flex-direction:column; align-items:center; justify-content:center; border:1px solid #7d6942; clip-path:polygon(0 4%,6% 1%,12% 4%,18% 1%,24% 4%,30% 1%,36% 4%,42% 1%,48% 4%,54% 1%,60% 4%,66% 1%,72% 4%,78% 1%,84% 4%,90% 1%,100% 4%,100% 96%,90% 99%,84% 96%,78% 99%,72% 96%,66% 99%,60% 96%,54% 99%,48% 96%,42% 99%,36% 96%,30% 99%,24% 96%,18% 99%,12% 96%,6% 99%,0 96%); background:linear-gradient(145deg,#243a43,#101419 65%,#514027); }
.single-packs button:nth-child(2){background:linear-gradient(145deg,#4a315a,#11131a 65%,#28515a)}.single-packs button:nth-child(3){background:linear-gradient(145deg,#6b4d22,#17100a 65%,#70405e)}
.single-packs span { color:#e4c66f; font-size:26px; }.single-packs strong { margin-top:7px; color:#efe3c7; font:700 11px Georgia,serif; }.single-packs small { margin-top:7px; color:#9e8f70; font-size:7px; letter-spacing:.12em; text-transform:uppercase; }
.collector-box { position:relative; min-height:176px; overflow:hidden; padding:24px 22px 20px 145px; border:1px solid #af8c49; border-radius:5px; background:linear-gradient(135deg,#352713,#0c0d0f 62%); box-shadow:inset 0 0 0 3px #16100a,inset 0 0 0 4px #7e6638,0 12px 24px #0008; text-align:left; }
.collector-box::after { content:""; position:absolute; top:0; right:0; bottom:0; width:18px; background:linear-gradient(90deg,#0008,#d0aa5833,#0008); border-left:1px solid #8a6d37; }
.box-art { position:absolute; inset:7px auto 7px 7px; width:120px; background:linear-gradient(0deg,#120c07aa,transparent),url('assets/cards/ascension.png') center/cover; border:1px solid #9b7b40; }
.box-logo { display:flex; align-items:center; gap:6px; color:#ddc485; font:700 8px Georgia,serif; letter-spacing:.08em; }.box-logo img{width:30px;height:30px}.collector-box>strong{display:block;margin-top:13px;color:#f3e3bd;font:700 19px/1.05 Georgia,serif}.collector-box>small{display:block;margin-top:11px;color:#9d8b68;font-size:7px;line-height:1.5;letter-spacing:.12em}

/* Keep long identity text and grading inside every card */
.nameplate { min-width:0; overflow:hidden; }
.card-identity { flex:1 1 auto; width:calc(100% - 36px); min-width:0; overflow:hidden; }
.card h3 { max-width:100%; margin-top:2px; overflow:hidden; font-size:clamp(13px,1.35vw,19px); line-height:.95; text-overflow:ellipsis; white-space:nowrap; }
.grade-box { flex:0 0 27px; width:27px; min-width:27px; height:27px; margin-left:5px; }
.card-footer { min-width:0; gap:5px; overflow:hidden; }
.card-footer span { min-width:0; overflow:hidden; font-size:5px; text-overflow:ellipsis; white-space:nowrap; }
.collector-mark { margin-left:auto; }

/* Pack tear and sequential full-opening board */
.opening-stage { width:min(96vw,1120px); min-height:min(92vh,820px); padding:28px 24px 54px; justify-content:flex-start; }
.opening-title { flex:none; }
.opening-title h2 { margin-bottom:12px; }
.opening-wrapper { position:absolute; z-index:12; left:50%; top:50%; width:190px; height:310px; transform:translate(-50%,-45%); filter:drop-shadow(0 20px 28px #000); transition:.25s opacity; }
.opening-wrapper::before { content:""; position:absolute; inset:0; border:2px solid #b79147; background:linear-gradient(0deg,#130c07bb,transparent 50%,#0d0b09aa),url('assets/cards/the-searing.png') center/cover; clip-path:polygon(0 3%,5% 0,10% 3%,15% 0,20% 3%,25% 0,30% 3%,35% 0,40% 3%,45% 0,50% 3%,55% 0,60% 3%,65% 0,70% 3%,75% 0,80% 3%,85% 0,90% 3%,95% 0,100% 3%,100% 97%,95% 100%,90% 97%,85% 100%,80% 97%,75% 100%,70% 97%,65% 100%,60% 97%,55% 100%,50% 97%,45% 100%,40% 97%,35% 100%,30% 97%,25% 100%,20% 97%,15% 100%,10% 97%,5% 100%,0 97%); }
.opening-wrapper img,.opening-wrapper>strong { position:absolute; z-index:3; left:50%; transform:translateX(-50%); }.opening-wrapper img{top:42px;width:58px}.opening-wrapper>strong{top:105px;width:160px;color:#f1dfb3;font:700 19px/.9 Georgia,serif;text-align:center;text-shadow:0 2px 5px #000}
.wrapper-top,.wrapper-bottom { position:absolute; z-index:5; left:0; right:0; height:50%; border-color:#c39e51; background:linear-gradient(115deg,#33240f,#9c7336,#1a1510); transition:.55s cubic-bezier(.2,.8,.2,1); pointer-events:none; }
.wrapper-top { top:0; opacity:.16; clip-path:polygon(0 0,100% 0,100% 92%,88% 96%,77% 90%,66% 97%,54% 91%,43% 98%,31% 92%,18% 97%,0 91%); }.wrapper-bottom{bottom:0;opacity:.12;clip-path:polygon(0 9%,18% 3%,31% 8%,43% 2%,54% 9%,66% 3%,77% 10%,88% 4%,100% 8%,100% 100%,0 100%)}
.opening-wrapper.tearing .wrapper-top { transform:translate(-18px,-64px) rotate(-8deg); opacity:.9; }.opening-wrapper.tearing .wrapper-bottom{transform:translate(14px,70px) rotate(6deg);opacity:.9}
.opening-wrapper.opened { opacity:0; pointer-events:none; }
.reveal-grid { position:relative; z-index:4; width:100%; display:grid; grid-template-columns:repeat(5,minmax(105px,145px)); justify-content:center; gap:10px; }
.reveal-grid .standard-pull { width:100%; aspect-ratio:4/5; opacity:0; animation:deal-from-stack .48s cubic-bezier(.2,.8,.2,1.15) forwards; }
.opening-stack { position:absolute; z-index:3; left:50%; bottom:60px; width:126px; height:178px; transform:translateX(-50%); }
.stacked-card { position:absolute; inset:0; overflow:hidden; border:5px solid #c19d54; border-radius:10px; background:radial-gradient(circle,#12364c,#061522 54%,#070b10); box-shadow:inset 0 0 0 2px #f0cf74,inset 0 0 0 6px #0c1118,0 12px 22px #000b; }
.stacked-card:nth-child(3n+1){transform:translate(-3px,2px) rotate(-2deg)}.stacked-card:nth-child(3n+2){transform:translate(3px,-1px) rotate(1.5deg)}
.stacked-card::before { content:""; position:absolute; inset:13px; border:1px solid #bd974d; border-radius:50%; box-shadow:0 0 0 5px #07121c,0 0 0 6px #6c542c; }
.stacked-card::after { content:""; position:absolute; inset:-30%; background:repeating-conic-gradient(from 0deg,#e1bb5724 0 1.5deg,transparent 1.5deg 18deg); }
.back-sigil { position:absolute; z-index:3; inset:36px 20px; display:grid; place-items:center; border:1px solid #c09a4d; border-radius:50%; background:#071622; }.back-sigil img{width:70px;height:70px;filter:drop-shadow(0 0 8px #48c8ff77)}
.special-reveal { overflow:visible!important; }
.special-reveal.holo { box-shadow:0 0 24px #57dcff,0 0 42px #ff7be077; }
.special-reveal.reverse-holo { box-shadow:0 0 0 2px #78ffe0,0 0 26px #b176ff99; }
.special-reveal.alt-art { box-shadow:0 0 30px #ffd76f,0 0 65px #9cf7ff; transform-origin:center; }
.pull-burst { position:absolute; z-index:-1; inset:-24px; pointer-events:none; border-radius:50%; animation:special-burst .85s ease-out both; }
.pull-burst.holo{background:radial-gradient(circle,#fff9 0,#6fffd466 22%,transparent 68%)}.pull-burst.reverse-holo{background:conic-gradient(transparent,#70ffe477,#ba7cff77,transparent,#ffdc7077,transparent)}.pull-burst.alt-art{background:conic-gradient(from 30deg,transparent,#fff 3%,transparent 7%,#ffd96c88 12%,transparent 18%,#8ff7ff99 24%,transparent 31%)}
@keyframes deal-from-stack{from{opacity:0;transform:translateY(210px) scale(.55) rotate(7deg)}to{opacity:1;transform:none}}
@keyframes special-burst{from{opacity:1;transform:scale(.25) rotate(-25deg)}to{opacity:0;transform:scale(1.5) rotate(25deg)}}
.box-opening .opening-stage { min-height:min(94vh,900px); }.box-opening .reveal-grid{grid-template-columns:repeat(10,minmax(62px,90px));gap:6px}.box-opening .standard-info strong{font-size:7px}.box-opening .standard-info span{font-size:4px}.box-opening .standard-art{inset:3px 3px 29px}.box-opening .standard-info{height:24px}.box-opening .opening-stack{width:105px;height:148px}
.single-opening .reveal-grid{grid-template-columns:220px}.single-opening .opening-stack{width:150px;height:212px}.single-opening .opening-wrapper{width:150px;height:244px}
@media(max-width:820px){.product-lab{grid-template-columns:1fr}.product-group{align-items:flex-start;flex-direction:column}.single-packs{width:100%}.single-packs button{flex:1}.reveal-grid{grid-template-columns:repeat(3,minmax(85px,125px))}.box-opening .reveal-grid{grid-template-columns:repeat(5,minmax(58px,86px))}.opening-stage{overflow:auto}.opening-stack{position:relative;left:auto;bottom:auto;margin:18px auto 0;transform:none}}

/* Full-size opening gallery */
.opening-overlay { overflow-y:auto; place-items:start center; }
.opening-stage { width:min(96vw,1320px); min-height:100vh; height:auto; padding:34px 28px 72px; overflow:visible; }
.opening-wrapper { position:fixed; top:50%; }
.opening-wrapper[hidden] { display:none; }
.opening-stack { position:fixed; left:auto; right:34px; bottom:34px; width:104px; height:146px; transform:none; }
.reveal-grid,
.box-opening .reveal-grid { grid-template-columns:repeat(5,minmax(0,220px)); align-items:start; gap:22px; }
.reveal-grid .standard-pull,
.box-opening .reveal-grid .standard-pull { width:100%; min-width:0; min-height:376px; aspect-ratio:auto; opacity:0; }
.opening-full-card.card { cursor:default; }
.opening-full-card.card:hover { transform:none; }
.opening-full-card .card-inner { min-height:354px; }
.opening-full-card .portrait { height:205px; }
.opening-full-card .card-copy { display:block; }
.opening-full-card .card h3 { font-size:19px; }
.single-opening .reveal-grid { grid-template-columns:270px; }
.single-opening .opening-full-card.card { min-height:420px; }
.single-opening .opening-full-card .card-inner { min-height:398px; }
.single-opening .opening-full-card .portrait { height:235px; }
.box-opening .opening-stage { min-height:100vh; }
.box-opening .opening-stack { width:90px; height:126px; }
.reveal-counter { position:relative; bottom:auto; margin-top:32px; padding:12px 18px; }
@media(max-width:1180px){.reveal-grid,.box-opening .reveal-grid{grid-template-columns:repeat(4,minmax(0,220px))}}
@media(max-width:900px){.reveal-grid,.box-opening .reveal-grid{grid-template-columns:repeat(3,minmax(0,210px))}.opening-stack{right:14px;bottom:14px}}
@media(max-width:680px){.opening-stage{padding:70px 14px 60px}.reveal-grid,.box-opening .reveal-grid{grid-template-columns:repeat(2,minmax(0,190px));gap:12px}.opening-stack{width:72px;height:101px}.opening-full-card.card{min-height:330px}.opening-full-card .card-inner{min-height:308px}.opening-full-card .portrait{height:165px}.opening-full-card .flavour{font-size:8px}}
@media(max-width:430px){.reveal-grid,.box-opening .reveal-grid{grid-template-columns:minmax(0,270px)}}

/* Prophecies sealed-product carousel */
.hero { display:grid; grid-template-columns:minmax(260px,.75fr) minmax(280px,.8fr) minmax(320px,1fr); align-items:center; gap:34px; }
.product-carousel { display:grid; grid-template-columns:42px minmax(210px,310px) 42px; align-items:center; justify-content:center; gap:12px; }
.product-arrow { width:42px; height:58px; padding:0; border:1px solid #8e7441; border-radius:50%; background:#0b0d0f; color:#eed79b; font:36px/1 Georgia,serif; }
.product-display { position:relative; width:100%; min-height:350px; overflow:hidden; border:2px solid #9d7e42; border-radius:8px; background:linear-gradient(145deg,#5b3017,#19110d 58%,#07090b); box-shadow:inset 0 0 0 5px #090806,0 18px 35px #000b; color:#f4e4bd; }
.product-display::before { content:""; position:absolute; inset:18px; border:1px solid #d2ad5c88; background:linear-gradient(#150c0666,#090806dd),url('assets/cards/the-searing.png') center/cover; }
.product-display>* { position:absolute; z-index:2; left:50%; transform:translateX(-50%); text-align:center; }
.product-emblem { top:54px; width:82px; height:82px; display:grid; place-items:center; border:2px solid #c99c43; border-radius:50%; background:#07121ccc; }.product-emblem img{width:66px;height:66px}
.product-set { top:154px; color:#dab45f; font-size:9px; font-weight:800; letter-spacing:.2em; }.product-display>strong{top:184px;width:90%;font:700 22px/1 Georgia,serif;text-shadow:0 2px 4px #000}.product-display>small{bottom:44px;width:85%;color:#d7c18e;font-size:8px;letter-spacing:.14em}
.product-bundle { min-height:250px; border-radius:13px; }.product-bundle::before{inset:13px}.product-bundle .product-emblem{top:30px}.product-bundle .product-set{top:124px}.product-bundle>strong{top:148px}.product-bundle>small{bottom:27px}
.product-box { min-height:235px; border-radius:6px 6px 18px 18px; transform:perspective(700px) rotateX(-2deg); }.product-box::after{content:"36";position:absolute;right:20px;top:18px;z-index:3;color:#f3d478;font:700 35px Georgia,serif}.product-box .product-emblem{top:26px;width:70px;height:70px}.product-box .product-emblem img{width:56px;height:56px}.product-box .product-set{top:105px}.product-box>strong{top:132px}.product-box>small{bottom:25px}
.product-etb { min-height:280px; border-radius:4px; background:linear-gradient(135deg,#173047,#080d12 60%,#654115); }.product-etb::before{inset:10px;background:linear-gradient(90deg,#07111dcc,#18100bcc),url('assets/cards/glint.png') center/cover}.product-etb .product-emblem{top:35px}.product-etb .product-set{top:132px}.product-etb>strong{top:158px}.product-etb>small{bottom:30px}
.product-details { align-self:stretch; padding:22px; border-left:1px solid #6f5831; background:#080a0b55; }.product-details h3{margin:5px 0 8px;font:24px Georgia,serif}.product-details p{color:#aaa18f}.product-details .odds-list{margin:16px 0;padding-left:18px;color:#d6c7a6;font-size:12px;line-height:1.65}.product-details b{color:#d5af5d;font-size:11px;text-transform:uppercase;letter-spacing:.1em}.product-details #product-specials{font-size:11px;line-height:1.5}.product-details .primary{margin-top:12px;width:100%}
.profession-mark { white-space:pre-line; font:700 15px/1.3 sans-serif; letter-spacing:.12em; text-align:center; }
.next-booster { align-self:center; min-width:220px; }
@media(max-width:1050px){.hero{grid-template-columns:1fr 1fr}.product-details{grid-column:1/-1;border-left:0;border-top:1px solid #6f5831}}
@media(max-width:680px){.hero{grid-template-columns:1fr}.product-carousel{grid-template-columns:36px minmax(190px,260px) 36px}.product-details{grid-column:auto}.product-display{min-height:310px}}

/* Product presentation and readable opening corrections */
.hero { grid-template-columns:minmax(430px,1.05fr) minmax(340px,.95fr); padding:34px; overflow:hidden; }
.hero>div:first-child { grid-column:1/-1; max-width:800px; }
.product-carousel { grid-template-columns:48px minmax(300px,440px) 48px; min-height:390px; }
.product-display { justify-self:center; min-height:0; transition:.25s transform,.25s filter; }
.product-display:hover { transform:translateY(-5px); filter:brightness(1.08); }
.product-pack { width:220px; height:360px; border-radius:4px; clip-path:polygon(0 3%,4% 0,8% 3%,12% 0,16% 3%,20% 0,24% 3%,28% 0,32% 3%,36% 0,40% 3%,44% 0,48% 3%,52% 0,56% 3%,60% 0,64% 3%,68% 0,72% 3%,76% 0,80% 3%,84% 0,88% 3%,92% 0,96% 3%,100% 0,100% 97%,96% 100%,92% 97%,88% 100%,84% 97%,80% 100%,76% 97%,72% 100%,68% 97%,64% 100%,60% 97%,56% 100%,52% 97%,48% 100%,44% 97%,40% 100%,36% 97%,32% 100%,28% 97%,24% 100%,20% 97%,16% 100%,12% 97%,8% 100%,4% 97%,0 100%); }
.product-pack::before { inset:14px 9px; }
.product-bundle { width:350px; height:245px; border-radius:8px; transform:perspective(700px) rotateY(-5deg); }
.product-bundle::after { content:"6 BOOSTERS"; position:absolute; z-index:3; right:14px; top:15px; padding:6px; border:1px solid #c49e51; color:#f2d47a; font-size:9px; letter-spacing:.12em; }
.product-box { width:430px; height:250px; border-radius:7px 7px 18px 18px; transform:perspective(800px) rotateX(-3deg); box-shadow:inset 0 0 0 5px #090806,0 28px 35px #000c; }
.product-box::before { inset:38px 12px 12px; }
.product-box::after { content:"36"; right:24px; top:58px; }
.product-box .product-emblem{top:58px}.product-box .product-set{top:140px}.product-box>strong{top:162px}.product-box>small{bottom:28px}
.product-box { border-top:16px solid #b38c47; }
.product-etb { width:300px; height:300px; min-height:0; border:5px solid #a78242; box-shadow:inset 0 0 0 5px #07101a,0 22px 36px #000b; }
.product-details { min-width:0; border:1px solid #5f4b2c; border-radius:4px; }
.product-details .odds-list { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:0; list-style:none; }
.product-details .odds-list li { padding:9px 10px; border:1px solid #55452c; background:#080a0bcc; }

.reveal-grid,.box-opening .reveal-grid { grid-template-columns:repeat(4,minmax(0,245px)); gap:24px; }
.opening-full-card .nameplate { min-height:47px; height:auto; align-items:flex-start; }
.opening-full-card .card-identity { padding-right:2px; }
.opening-full-card.card h3 { height:31px; overflow:hidden; white-space:normal; text-overflow:clip; font-size:17px; line-height:.92; }
.opening-full-card .grade-box { margin-top:2px; }
@media(max-width:1120px){.hero{grid-template-columns:1fr;padding:28px}.hero>div:first-child,.product-details{grid-column:auto}.product-carousel{min-height:380px}.reveal-grid,.box-opening .reveal-grid{grid-template-columns:repeat(3,minmax(0,245px))}}
@media(max-width:800px){.product-carousel{grid-template-columns:40px minmax(240px,1fr) 40px}.product-box{width:min(100%,390px)}.product-details .odds-list{grid-template-columns:1fr}.reveal-grid,.box-opening .reveal-grid{grid-template-columns:repeat(2,minmax(0,240px))}}
@media(max-width:520px){.hero{padding:20px 12px}.product-carousel{grid-template-columns:32px minmax(200px,1fr) 32px}.product-arrow{width:32px}.product-box,.product-bundle,.product-etb{width:100%}.product-box{height:225px}.reveal-grid,.box-opening .reveal-grid{grid-template-columns:minmax(0,280px)}}

/* Photographic sealed products */
.product-display,
.product-pack,.product-bundle,.product-box,.product-etb { width:100%; height:390px; min-height:390px; padding:0; border:0; border-radius:0; background:none; box-shadow:none; clip-path:none; transform:none; overflow:visible; }
.product-display::before,.product-display::after,.product-bundle::after,.product-box::after { display:none; content:none; }
.product-display:hover { transform:translateY(-4px) scale(1.015); filter:brightness(1.06); }
.product-render { position:absolute!important; inset:0!important; left:0!important; width:100%!important; height:350px!important; transform:none!important; object-fit:contain; filter:drop-shadow(0 22px 18px #000c); }
.product-pack .product-render { left:50%!important; width:270px!important; transform:translateX(-50%)!important; }
.pack-ascalonian .product-render { filter:drop-shadow(0 22px 18px #000c) saturate(.95); }
.pack-flameseeker .product-render { filter:drop-shadow(0 22px 18px #000c) hue-rotate(145deg) saturate(1.15); }
.pack-fire-islands .product-render { filter:drop-shadow(0 22px 18px #000c) hue-rotate(300deg) saturate(1.2); }
.product-caption { position:absolute!important; left:50%!important; bottom:0!important; top:auto!important; display:flex; align-items:center; gap:9px; width:max-content; max-width:95%; padding:8px 14px; border:1px solid #71592f; border-radius:20px; background:#080a0de8; transform:translateX(-50%)!important; color:#ead49b; box-shadow:0 8px 20px #0008; }
.product-caption strong { font:700 12px Georgia,serif; }.product-caption small{color:#9f947e;font-size:8px;text-transform:uppercase;letter-spacing:.1em}
.product-arrow { position:relative; z-index:4; box-shadow:0 8px 18px #0009; }
@media(max-width:520px){.product-display,.product-pack,.product-bundle,.product-box,.product-etb{height:320px;min-height:320px}.product-render{height:285px!important}.product-pack .product-render{width:215px!important}.product-caption{padding:6px 10px}}

/* Cinematic booster opening */
.opening-wrapper { width:245px; height:390px; background:none; filter:drop-shadow(0 25px 28px #000); animation:pack-arrival .7s cubic-bezier(.16,.8,.2,1) both; }
.opening-wrapper::before,.opening-wrapper::after { content:""; position:absolute; z-index:5; inset:0; opacity:0; background:url('assets/products/prophecies-booster.png') center/contain no-repeat; pointer-events:none; }
.opening-pack-render { position:absolute!important; inset:0!important; width:100%!important; height:100%!important; object-fit:contain; transform:none!important; transition:.12s opacity; }
.opening-wrapper .wrapper-top,.opening-wrapper .wrapper-bottom { display:none; }
.opening-wrapper.tearing { animation:pack-tension .55s ease-in-out both; }
.opening-wrapper.tearing .opening-pack-render { opacity:0; }
.opening-wrapper.tearing::before { opacity:1; clip-path:polygon(0 0,100% 0,100% 49%,88% 52%,77% 48%,65% 53%,53% 48%,40% 52%,28% 48%,15% 53%,0 49%); animation:foil-top-rip .72s cubic-bezier(.2,.8,.2,1) forwards; }
.opening-wrapper.tearing::after { opacity:1; clip-path:polygon(0 51%,15% 47%,28% 52%,40% 48%,53% 52%,65% 47%,77% 52%,88% 48%,100% 51%,100% 100%,0 100%); animation:foil-bottom-rip .72s cubic-bezier(.2,.8,.2,1) forwards; }
.opening-wrapper.opened { opacity:1; }
.opening-stack { opacity:0; transform:translateY(70px) rotate(-4deg) scale(.8); transition:.5s cubic-bezier(.15,.8,.2,1); }
.cards-ready .opening-stack { opacity:1; transform:translateY(0) rotate(-2deg) scale(1); }
.reveal-grid .standard-pull { transform-style:preserve-3d; backface-visibility:hidden; animation:card-flight .62s cubic-bezier(.18,.8,.2,1.08) forwards; }
.opening-overlay.premium-hit::after { content:""; position:fixed; z-index:2; inset:0; pointer-events:none; background:radial-gradient(circle at 50% 42%,#fff 0,#7fe8ff99 5%,#bf83ff44 18%,transparent 48%); animation:premium-screen-flash .9s ease-out both; }
.opening-overlay.alt-hit::after { background:radial-gradient(circle at 50% 42%,#fff 0,#ffd76fbb 6%,#78edff66 20%,transparent 52%); }
.premium-hit .opening-title h2 { animation:title-impact .7s ease-out; }
@keyframes pack-arrival{from{opacity:0;transform:translate(-50%,-35%) scale(.68) rotate(-7deg)}to{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}}
@keyframes pack-tension{0%,100%{transform:translate(-50%,-50%)}20%{transform:translate(-52%,-50%) rotate(-2deg)}40%{transform:translate(-48%,-50%) rotate(2deg)}60%{transform:translate(-51%,-50%) rotate(-1deg)}80%{transform:translate(-49%,-50%) rotate(1deg)}}
@keyframes foil-top-rip{0%{transform:none;filter:brightness(1)}35%{transform:translate(-5px,-10px) rotate(-2deg);filter:brightness(1.6)}100%{transform:translate(-80px,-260px) rotate(-18deg);opacity:0}}
@keyframes foil-bottom-rip{0%{transform:none;filter:brightness(1)}35%{transform:translate(5px,10px) rotate(2deg);filter:brightness(1.35)}100%{transform:translate(65px,250px) rotate(14deg);opacity:0}}
@keyframes card-flight{0%{opacity:0;transform:translate(70vw,55vh) scale(.34) rotateZ(9deg) rotateY(180deg)}55%{opacity:1;transform:translate(0,-12px) scale(1.045) rotateZ(-1deg) rotateY(18deg)}100%{opacity:1;transform:none}}
@keyframes premium-screen-flash{0%{opacity:0;transform:scale(.5)}18%{opacity:1}100%{opacity:0;transform:scale(1.35)}}
@keyframes title-impact{0%{text-shadow:0 0 0 transparent;transform:scale(1)}35%{text-shadow:0 0 25px #e8d38d;transform:scale(1.035)}100%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.opening-wrapper,.opening-wrapper.tearing,.opening-wrapper.tearing::before,.opening-wrapper.tearing::after,.reveal-grid .standard-pull,.opening-overlay.premium-hit::after{animation-duration:.01ms}}