:root{--black:#171513;--paper:#f3efe5;--muted:#817a70;--line:#bdb5a7;--lime:#d6ed62;--purple:#6d4ca1}*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--paper)}body{margin:0;color:var(--black);background:var(--paper);font-family:Arial,Helvetica,sans-serif}button{font:inherit}.app{min-height:100vh;overflow:hidden}
.header{padding:20px 18px 0;background:var(--paper)}.header-row{height:38px;display:grid;grid-template-columns:1fr auto 1fr;align-items:start}.logo{color:var(--black);text-decoration:none;font:950 21px/1 var(--font-mono);letter-spacing:-.07em}.logo sup{margin-left:3px;color:var(--purple);font-size:9px;vertical-align:top}.issue{padding-top:3px;color:var(--muted);font:700 7px var(--font-mono);letter-spacing:.12em}.album-link{padding-top:2px;color:var(--black);text-align:right;text-decoration:none;font:800 9px var(--font-mono)}.rule{position:relative;height:34px;border-bottom:1.5px solid var(--black)}.peek{position:absolute;left:50%;bottom:-1px;width:92px;height:76px;overflow:hidden;transform:translateX(-50%);pointer-events:none}.peek img{position:absolute;width:112px;height:112px;left:50%;top:15px;transform:translateX(-50%);object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 2px 0 rgba(23,21,19,.28))}
.hero{padding:36px 18px 65px}.hero-heading{max-width:420px;margin:0 auto 22px;display:flex;align-items:end;justify-content:space-between;gap:16px}.hero-heading p{margin:0 0 6px;color:var(--purple);font:800 9px var(--font-mono);letter-spacing:.13em}.hero-heading h1{margin:0;font-size:clamp(34px,10vw,48px);line-height:.9;letter-spacing:-.07em}.hero-heading>span{padding-bottom:2px;color:var(--muted);font:700 9px var(--font-mono);text-transform:uppercase}.display{display:flex;flex-direction:column;align-items:center}.flip{width:min(89vw,400px);aspect-ratio:5/7;padding:0;border:0;background:none;perspective:1300px;cursor:pointer}.flip-inner{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.2,.8,.2,1)}.flip.back .flip-inner{transform:rotateY(180deg)}.card{position:absolute;inset:0;overflow:hidden;padding:13px;border:1.5px solid #151311;border-radius:17px;background:#d8b65b;box-shadow:0 12px 35px rgba(42,34,26,.16),0 3px 0 #151311;backface-visibility:hidden}.card:before{content:'';position:absolute;inset:6px;border:1px solid rgba(255,255,255,.7);border-radius:11px;pointer-events:none}.shine{position:absolute;z-index:10;inset:-40%;pointer-events:none;opacity:.25;mix-blend-mode:screen;background:linear-gradient(110deg,transparent 34%,rgba(149,255,231,.9) 43%,rgba(255,159,230,.95) 49%,rgba(255,246,122,.9) 55%,transparent 64%);transform:translateX(-45%);animation:shine 5s ease-in-out infinite}@keyframes shine{0%,35%{transform:translateX(-45%)}65%,100%{transform:translateX(45%)}}.card-title{height:42px;padding:0 4px;display:flex;align-items:center;justify-content:space-between}.card-title strong{font-size:19px;letter-spacing:-.04em}.card-title i{width:29px;height:29px;display:grid;place-items:center;border:1.5px solid var(--black);border-radius:50%;background:#f5eab8;font:900 16px var(--font-mono);font-style:normal}.art{position:relative;height:57%;display:grid;place-items:center;overflow:hidden;border:1.5px solid var(--black);background-position:center;background-size:cover;image-rendering:pixelated}.art:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 40px rgba(22,18,16,.16)}.art img{position:relative;z-index:2;width:83%;height:83%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(3px 5px 0 rgba(25,21,18,.32))}.holo{position:absolute;z-index:3;inset:0;opacity:.22;mix-blend-mode:screen;background:linear-gradient(135deg,transparent 25%,rgba(255,255,255,.9) 45%,transparent 63%)}.facts{display:flex;justify-content:space-between;margin:8px 2px 0;padding-bottom:7px;border-bottom:1px solid rgba(23,21,19,.38);font:800 9px var(--font-mono);text-transform:uppercase}.card blockquote{min-height:39px;margin:8px 4px 5px;font:italic 600 12px/1.3 Georgia,serif}.ability{margin:0 2px;padding:8px 9px;display:flex;justify-content:space-between;border:1.5px solid var(--black);background:rgba(255,248,220,.62);font:800 9px var(--font-mono)}.ability b{color:#68284a}.number{position:absolute;right:16px;bottom:5px;font:700 6px var(--font-mono);letter-spacing:.1em}.reverse{transform:rotateY(180deg);padding:13px;background:#292330}.reverse-inner{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px solid var(--lime);border-radius:10px;background:radial-gradient(circle at 50% 44%,#594279,transparent 35%),repeating-linear-gradient(45deg,rgba(255,255,255,.035) 0 8px,transparent 8px 16px)}.reverse-inner img{width:54%;aspect-ratio:1;object-fit:contain;image-rendering:pixelated}.reverse-inner strong{margin-top:17px;color:#fff;font:950 24px var(--font-mono);letter-spacing:.16em}.reverse-inner small{margin-top:5px;color:var(--lime);font:700 8px var(--font-mono);letter-spacing:.18em}.hint{margin:16px 0 0;color:var(--muted);font:700 8px var(--font-mono);letter-spacing:.1em}
.album{padding:52px 0 62px;background:#19171a;color:#f3efe5}.album-head{padding:0 18px 22px;display:grid;grid-template-columns:auto 1fr auto;align-items:end;gap:15px}.album-head p,.album-head span{margin:0;color:#918894;font:700 8px var(--font-mono);letter-spacing:.1em}.album-head h2{margin:0;font-size:32px;letter-spacing:-.06em}.rail{display:flex;gap:13px;overflow-x:auto;padding:4px 18px 22px;scroll-snap-type:x mandatory;scrollbar-width:none}.rail::-webkit-scrollbar{display:none}.thumb{flex:0 0 154px;padding:0 0 10px;border:1px solid #4d474f;background:#262328;color:#f3efe5;text-align:left;scroll-snap-align:start;cursor:pointer;transition:transform .16s,border-color .16s}.thumb.selected{border-color:var(--lime);transform:translateY(-3px)}.thumb-art{position:relative;aspect-ratio:1;display:grid;place-items:center;overflow:hidden;border-bottom:1px solid #4d474f;background-position:center;background-size:cover;image-rendering:pixelated}.thumb-art img{width:86%;height:86%;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(2px 3px 0 rgba(0,0,0,.35))}.thumb-art b{position:absolute;top:6px;right:6px;padding:3px 5px;color:#171513;background:var(--lime);font:900 8px var(--font-mono)}.thumb>strong,.thumb>small{display:block;margin-inline:9px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.thumb>strong{margin-top:9px;font-size:11px}.thumb>small{margin-top:2px;color:#948b96;font:700 7px var(--font-mono);text-transform:uppercase}footer{padding:22px 18px;display:flex;justify-content:space-between;gap:20px;background:#0d0c0e;color:#706a71;font:700 7px var(--font-mono);letter-spacing:.08em}
@media(min-width:760px){.header{padding:26px 42px 0}.header-row{height:44px}.issue{font-size:8px}.rule{height:42px}.peek{width:120px;height:92px}.peek img{width:145px;height:145px;top:12px}.hero{padding-top:54px}.hero-heading{max-width:430px}.album-head{max-width:1100px;margin:auto;padding-inline:0}.rail{max-width:1136px;margin:auto;padding-inline:18px;display:grid;grid-template-columns:repeat(4,1fr);overflow:visible}.thumb{width:auto}.album{padding-inline:28px}footer{padding-inline:42px}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* Card families and rarity system */
.rarity-tag{position:absolute;z-index:6;top:55px;left:18px;padding:4px 7px;border:1px solid rgba(255,255,255,.55);color:#fff;background:rgba(23,21,19,.72);backdrop-filter:blur(4px);font:800 7px var(--font-mono);letter-spacing:.1em;text-transform:uppercase}.variant-1{background:linear-gradient(150deg,#e4c978,#b98b43)}.variant-2{background:linear-gradient(150deg,#d9e39a,#7da462)}.variant-3{background:linear-gradient(150deg,#bfd4df,#627c9a)}.variant-4{background:linear-gradient(150deg,#ffc47b,#db6573)}.variant-5{background:linear-gradient(150deg,#e6c58c,#8f684c)}.variant-6{background:linear-gradient(150deg,#9bdbe1,#526b99)}.variant-7{background:linear-gradient(150deg,#e9a6c3,#8d4f83)}.variant-8{background:linear-gradient(150deg,#fff1a0,#c9812c)}
.tier-1 .shine{opacity:.06;animation:none}.tier-1{border-color:#4a3a28}.tier-2{border-color:#6d7955;box-shadow:inset 0 0 0 4px #edf0c6,0 12px 35px rgba(42,34,26,.16),0 3px 0 #30352a}.tier-2 .shine{opacity:.18}.tier-3{border:2px solid #e5eef3;box-shadow:inset 0 0 0 3px #42546c,inset 0 0 0 5px #dce9ee,0 13px 38px rgba(33,44,64,.22),0 3px 0 #273544}.tier-3 .shine{opacity:.34}.tier-4{border:2px solid #5e3b17;box-shadow:inset 0 0 0 3px #ffe99a,inset 0 0 0 6px #a96722,0 15px 42px rgba(81,48,16,.28),0 3px 0 #4d2e12}.tier-4 .shine{opacity:.42}.tier-5{border:2px solid #f8e5ff;box-shadow:inset 0 0 0 3px #744d8d,inset 0 0 0 6px #f0b9e0,0 0 30px rgba(196,116,226,.34),0 15px 42px rgba(46,22,54,.3)}.tier-5 .shine{opacity:.58;animation-duration:3.8s}.tier-6{border:2px solid #fff5b3;box-shadow:inset 0 0 0 3px #9c5b20,inset 0 0 0 6px #ffe572,0 0 35px rgba(255,212,61,.55),0 16px 44px rgba(61,33,14,.35)}.tier-6 .shine{opacity:.72;animation-duration:2.8s}.tier-6 .rarity-tag{color:#201509;background:#ffe66b;border-color:#201509}.tier-6 .card-title i{background:#261a2c;color:#ffe975;border-color:#ffe975}.thumb-tier-1{opacity:.82}.thumb-tier-2{border-color:#77835c}.thumb-tier-3{border-color:#9ebdce}.thumb-tier-4{border-color:#d59a45}.thumb-tier-5{border-color:#d48ac5;box-shadow:inset 0 0 0 1px rgba(232,164,255,.25)}.thumb-tier-6{border-color:#ffe26a;box-shadow:0 0 18px rgba(255,217,75,.16)}
.sealed .reverse{transform:rotateY(0)}.sealed:not(.locked) .reverse{box-shadow:0 0 0 1px var(--lime),0 16px 45px rgba(30,22,35,.22);animation:waiting 2.5s ease-in-out infinite}.locked{cursor:default;filter:saturate(.35) brightness(.72)}.locked .shine{display:none}.lock-mark{position:absolute;top:18px;right:18px;color:#84778b;font-size:15px}@keyframes waiting{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.between{width:min(89vw,400px);margin-top:18px;text-align:center}.between>p{margin:0;color:var(--muted);font:700 8px var(--font-mono);letter-spacing:.1em}.between .available{color:#684694;font-weight:900}.countdown{margin-top:16px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.countdown span{color:var(--muted);font:700 8px var(--font-mono);letter-spacing:.1em}.countdown strong{font:850 18px var(--font-mono);font-variant-numeric:tabular-nums}.between .complete{margin-top:15px;color:#6d4ca1}.thumb.future{opacity:.42;filter:saturate(.2)}.thumb.ready{border-color:var(--lime);box-shadow:inset 0 0 0 1px rgba(214,237,98,.32)}.thumb.ready small{color:var(--lime)}.thumb-art .mystery{color:#b9afb9;font:900 38px var(--font-mono)}
.sound-toggle{padding:4px 8px;border:1px solid var(--line);color:var(--muted);background:transparent;font:800 7px monospace;letter-spacing:.1em;cursor:pointer}.opening .flip-inner{animation:booster .14s steps(2) infinite}.opening:after{content:'✦';position:absolute;z-index:30;left:50%;top:50%;color:#fff4a0;font-size:80px;text-shadow:0 0 25px #fff,0 0 60px #d386ff;transform:translate(-50%,-50%);animation:flash .85s ease-out both}@keyframes booster{0%{transform:translate(-3px,1px) rotate(-1deg)}100%{transform:translate(3px,-1px) rotate(1deg)}}@keyframes flash{0%,55%{opacity:0;scale:.2}75%{opacity:1;scale:1.35}100%{opacity:0;scale:2}}.blink{animation:blink .35s steps(2) infinite}@keyframes blink{50%{opacity:.3}}.final-reward{margin-top:20px;padding:20px 14px;border:1.5px solid #6d4ca1;background:linear-gradient(135deg,#2c2038,#5f3e78);color:#fff;box-shadow:0 8px 25px rgba(67,40,87,.25)}.final-reward span,.final-reward strong{display:block;font-family:monospace}.final-reward span{color:var(--lime);font-size:8px;letter-spacing:.1em}.final-reward strong{margin-top:9px;font-size:21px}.final-reward p{margin:8px 0 0;font:italic 14px/1.4 Georgia,serif}
.reset-demo{margin-top:18px;padding:9px 12px;border:1px solid var(--line);color:var(--muted);background:transparent;font:800 8px monospace;letter-spacing:.08em;cursor:pointer}
/* iPhone/Safari: stable 3D flip and a card that clears the browser toolbar */
.flip-inner{-webkit-transform-style:preserve-3d}.card{-webkit-backface-visibility:hidden;backface-visibility:hidden}.reverse{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.sealed .reverse{-webkit-transform:rotateY(0);transform:rotateY(0)}.flip.back .flip-inner{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}
@media(max-width:759px){.header{padding-top:max(18px,env(safe-area-inset-top))}.hero{padding-top:30px;padding-bottom:48px}.hero-heading{width:min(82vw,350px);display:grid;grid-template-columns:1fr;margin-bottom:17px}.hero-heading h1{font-size:clamp(31px,9vw,42px);line-height:.95}.hero-heading>span{margin-top:8px;padding:0}.flip{width:min(82vw,350px)}.between{width:min(82vw,350px)}.card{padding:11px;border-radius:15px}.card-title{height:36px}.card-title strong{font-size:17px}.art{height:56%}.card blockquote{min-height:32px;margin-block:6px;font-size:11px}.ability{padding:7px 8px}.album{padding-bottom:calc(62px + env(safe-area-inset-bottom))}}
@media(max-width:759px){.flip-inner,.flip.back .flip-inner{-webkit-transform:none;transform:none}.card{-webkit-transform:none;transform:none;transition:opacity .22s ease;backface-visibility:visible;-webkit-backface-visibility:visible}.reverse{opacity:0;visibility:hidden}.sealed .reverse,.flip.back .reverse{opacity:1;visibility:visible}.flip.back .face{opacity:0;visibility:hidden}}
/* TCG card art direction v2 */
button{color:inherit;-webkit-appearance:none;appearance:none}.face{--frame:#b88b43;--accent:#fff0ad;--ink:#241b12;padding:12px;color:var(--ink);border:3px solid #241d17;background:linear-gradient(145deg,var(--accent),var(--frame));box-shadow:inset 0 0 0 3px rgba(255,255,255,.7),inset 0 0 0 7px color-mix(in srgb,var(--frame) 72%,#211a14),0 5px 0 #211a14,0 18px 38px rgba(38,29,21,.22)}.face:before{inset:7px;border:1px solid rgba(255,255,255,.82);border-radius:8px}.card-title{height:39px;margin:0 3px 8px;padding:0 9px;border:1.5px solid rgba(36,29,22,.75);border-radius:8px 8px 3px 3px;background:rgba(255,248,219,.76);box-shadow:inset 0 1px rgba(255,255,255,.8)}.card-title strong{font-size:17px;font-weight:900;color:var(--ink)}.card-title i{width:25px;height:25px;border:1.5px solid var(--ink);background:var(--accent);font-size:13px}.art{height:55%;margin:0 3px;border:2px solid #2b231c;border-radius:3px;box-shadow:0 3px 0 rgba(43,35,28,.25),inset 0 0 0 2px rgba(255,255,255,.3)}.art img{width:79%;height:79%}.rarity-tag{top:64px;left:21px;padding:4px 7px;border:1px solid rgba(255,255,255,.75);border-radius:2px;color:#fff;background:#211d1acc;backdrop-filter:none;font-size:6px;box-shadow:2px 2px 0 rgba(0,0,0,.25)}.facts{margin:9px 5px 0;padding:0 1px 7px;color:rgba(36,27,18,.75);font-size:7px;letter-spacing:.08em}.card blockquote{margin:8px 8px 6px;color:#33271c;font-size:11px;line-height:1.25}.ability{margin:0 4px;padding:8px 9px;border:1.5px solid #2b231c;border-radius:3px;background:rgba(255,249,225,.76);box-shadow:inset 0 -2px rgba(69,49,28,.12)}.ability b{color:#5c2948}.number{right:18px;bottom:6px;color:rgba(36,27,18,.62)}.variant-1{--frame:#bb8a43;--accent:#f5dda0}.variant-2{--frame:#6f9664;--accent:#e6e9a8}.variant-3{--frame:#66829b;--accent:#d6e5ea}.variant-4{--frame:#cc6670;--accent:#ffd092}.variant-5{--frame:#92705b;--accent:#ead0a1}.variant-6{--frame:#567a9a;--accent:#b4e1df}.variant-7{--frame:#965a88;--accent:#efb4ce}.variant-8{--frame:#b96d25;--accent:#ffe77e}.tier-2,.tier-3,.tier-4,.tier-5,.tier-6{border-color:#241d17}.tier-3{box-shadow:inset 0 0 0 3px #edf6f7,inset 0 0 0 7px #526c83,0 5px 0 #263746,0 18px 40px rgba(33,44,64,.25)}.tier-4{box-shadow:inset 0 0 0 3px #fff0a8,inset 0 0 0 7px #9f6227,0 5px 0 #513116,0 18px 40px rgba(81,48,16,.28)}.tier-5{box-shadow:inset 0 0 0 3px #fceaff,inset 0 0 0 7px #784f8c,0 5px 0 #402849,0 0 28px rgba(196,116,226,.3),0 18px 40px rgba(46,22,54,.28)}.tier-6{box-shadow:inset 0 0 0 3px #fff7b8,inset 0 0 0 7px #a46322,0 5px 0 #573411,0 0 34px rgba(255,212,61,.5),0 18px 42px rgba(61,33,14,.34)}