:root{--bg:#111317;--bg2:#1c2026;--panel:#20242a;--line:#41464e;--gold:#ff9b52;--sky:#adc2ca;--muted:#a9afb6;--white:#f7f1e9;--shadow:0 28px 90px #0009;color-scheme:dark;font-family:Inter,Arial,system-ui,sans-serif}
html{background:#101215}
body{background:radial-gradient(ellipse at 72% -9%,#3d2927 0,transparent 29%),linear-gradient(90deg,#ffffff04 1px,transparent 1px),linear-gradient(#ffffff04 1px,transparent 1px),#111317;background-size:auto,50px 50px,50px 50px,auto}
body::before{content:'';position:fixed;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#ffcf79,#ff8846 45%,#d84234 80%,#45262a);z-index:30}
h1,h2,h3{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-weight:800;letter-spacing:.015em;text-transform:uppercase}
h1{font-size:clamp(3.7rem,6.3vw,7.4rem);line-height:.87;letter-spacing:-.015em;margin-bottom:.19em}
h2{font-size:clamp(1.9rem,2.7vw,2.9rem)}
h3{font-size:1.34rem;line-height:1.08}
.eyebrow{color:var(--gold);font-size:.7rem;letter-spacing:.27em}
.topbar{height:78px;padding:0 clamp(20px,4vw,56px);background:#16181ce8;border-bottom:1px solid #ffffff1b;box-shadow:0 12px 32px #0003}
.brand{gap:13px}
.brand-mark{width:45px;height:45px;color:#1d2024;background:linear-gradient(145deg,#ffe09d,#ff813e 65%,#d94735);border:0;border-radius:11px 2px 11px 2px;font:900 14px Arial,sans-serif;transform:skew(-8deg);box-shadow:0 3px 14px #f86c3855}
.brand-mark::first-letter{letter-spacing:-.18em}
.brand strong{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:20px;letter-spacing:.09em}
.brand small{color:#d5a880;letter-spacing:.22em;font-size:9px}
.top-stats{gap:8px}
.stat-chip{background:#25282c;border:1px solid #55524e;color:#e9e1d8;border-radius:5px;padding:9px 13px;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
.stat-chip b{color:#ffc37e}
.icon-button{background:#25282c;color:#f4b579;border-color:#5b5650}
.shell{display:block;max-width:none}
.side-nav{min-height:0;height:auto;position:sticky;top:78px;z-index:14;display:flex;flex-direction:row;justify-content:flex-start;gap:3px;padding:0 clamp(20px,4vw,56px);background:#171a1ef5;border:0;border-bottom:1px solid #434448;backdrop-filter:blur(18px)}
.nav-item{display:flex;flex-direction:row;gap:10px;padding:14px 20px 13px;color:#adb4bb;border:0;border-bottom:3px solid transparent;border-radius:0;background:transparent;font-size:.76rem;letter-spacing:.09em;text-transform:uppercase}
.nav-item span:first-child{font-size:1.06rem;color:#e7a46d}
.nav-item:hover,.nav-item.active{color:#fff0df;background:linear-gradient(#ffffff0b,#f77b3120);border-color:transparent;border-bottom-color:#fa8b47}
.nav-item.active{box-shadow:none}
main{max-width:1550px;margin:auto;padding:clamp(28px,3.3vw,54px);padding-bottom:90px}
.section-head{margin-bottom:31px}
.section-head .section-sub{margin-top:18px}
.section-sub{color:#bac0c4;font-size:1rem;line-height:1.6;max-width:590px}
.page-title{font-size:clamp(3.3rem,5.5vw,6.2rem);line-height:.9}
.pack-layout{grid-template-columns:minmax(0,1.55fr) minmax(310px,.76fr);gap:20px}
.scene-card{border:1px solid #625e5b;border-radius:8px;background:radial-gradient(circle at 52% 39%,#3b3d3f,#181b20 70%);box-shadow:0 24px 75px #000a,inset 0 0 0 1px #ffffff10}
.scene-card::before{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(150deg,#ffffff0b,transparent 30%,transparent 65%,#fa7b1911),linear-gradient(transparent 74%,#080a0d70)}
.scene-card canvas{position:relative;z-index:0}
.scene-caption{z-index:2;left:27px;right:27px;bottom:23px;text-shadow:0 3px 10px #000}
.scene-caption strong{font:800 1.35rem Impact,'Arial Narrow',Arial,sans-serif;letter-spacing:.04em;text-transform:uppercase}
.scene-caption .tiny{border:1px solid #ffffff59;padding:7px 9px;letter-spacing:.13em;color:#fff;font-weight:800}
.orbit-note{z-index:2;background:#15191cba;border:1px solid #d6b29466;color:#fff4e8;border-radius:4px;font-weight:700;letter-spacing:.08em}
.panel{background:linear-gradient(145deg,#25292e,#1d2024 68%);border:1px solid #484b4e;border-radius:7px;padding:25px;box-shadow:0 12px 35px #0003}
.panel.accent{background:linear-gradient(150deg,#342a26,#222427 58%,#252021);border-color:#a35f3d;box-shadow:inset 0 1px #ffbd8440,0 18px 45px #0005}
.counter-row{border-bottom-color:#d8b18a37}
.counter strong{font-family:Impact,'Arial Narrow',Arial,sans-serif;font-size:2.2rem;font-weight:800;color:#fff4e9}
.counter small{color:#b9b9b9;text-transform:uppercase;letter-spacing:.09em}
.button{border-radius:4px;background:linear-gradient(120deg,#ffca77,#fb924a 59%,#f46e3b);color:#211d1b;text-transform:uppercase;letter-spacing:.08em;font-weight:900;box-shadow:0 5px 18px #f36e373b}
.button.secondary{background:#30353a;border:1px solid #6a7277;color:#f8f1e9;box-shadow:none}
.button.ghost{border-color:#886449;color:#ffb078;box-shadow:none}
.text-button{color:#ffac6b;letter-spacing:.025em}
.countdown{color:#c2b0a5}
.rarity{border-radius:2px;font-size:.61rem;letter-spacing:.11em;padding:6px 8px}
.rarity.common{color:#c3cbcb}.rarity.rare{color:#89d5ec}.rarity.superRare{color:#d5b3ff}.rarity.ultraRare{color:#ffa17e}.rarity.legendary{color:#ffdc8b}
.odds-grid{gap:10px}
.grid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:17px}
.car-card{background:#24282e;border:1px solid #565c5f;border-radius:6px;box-shadow:0 14px 36px #0004}
.car-card:hover{border-color:#ffaf6d;transform:translateY(-5px);box-shadow:0 20px 45px #0008}
.car-art{height:162px;background:radial-gradient(ellipse at 50% 65%,var(--tint),#343941 42%,#171b20 90%);border-bottom:1px solid #ffffff21;overflow:hidden}
.car-art::after{content:'';position:absolute;left:11%;right:11%;bottom:13px;height:1px;background:linear-gradient(90deg,transparent,#ffffff58,transparent)}
.car-art img{width:98%;height:98%;object-fit:contain;filter:drop-shadow(0 13px 12px #000a)}
.car-art svg{width:79%;max-width:260px}
.car-art .corner{position:absolute;z-index:1;right:12px;top:10px;font-size:1.13rem;color:#ffe0ad}
.sealed-art{background:linear-gradient(158deg,#f3934a 0 17%,#262b32 17% 37%,#171b22 37% 100%)}
.sealed-art::before{content:'';position:absolute;inset:14px;border:1px solid #e9bc886b;background:repeating-linear-gradient(120deg,transparent 0 19px,#ffffff0a 20px 21px)}
.mystery-mark{position:relative;z-index:1;font:900 5.2rem Impact,'Arial Narrow',Arial,sans-serif;color:#ffdfae;text-shadow:0 4px 19px #000b}
.car-body{padding:18px}
.car-body h3{font-size:1.27rem}
.car-meta small{color:#b8bec2}
.filters{padding:12px;background:#1c2025;border:1px solid #3e4449;border-radius:6px;gap:11px}
.field{background:#2a3035;border:1px solid #61676c;border-radius:3px;color:#f7f1e9}
.field::placeholder{color:#b5b5b5}
.empty{background:#1c2024;border-color:#796a5d;border-radius:6px}
.grade-score{font-family:Impact,'Arial Narrow',Arial,sans-serif;color:#ffbd7d;font-size:4.5rem}
.grade-cell{background:#161a1f;border:1px solid #383e43;border-radius:3px}
.progress{background:#3b4147;border-radius:2px}
.progress span{background:linear-gradient(90deg,#ffbc6f,#ee6943);border-radius:2px}
.history-row{border-bottom-color:#ffffff21}
.status{background:#342a25;border-left-color:#ff9b52}
#toast{background:#ffcf8b;color:#211b17;border-radius:5px}
dialog{background:#24282d;border-color:#836f60;border-radius:6px}
.legal{color:#a7a9a9}
.view-controls{position:absolute;z-index:3;left:20px;right:20px;top:14px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.view-options{display:flex;padding:3px;border:1px solid #6e757a;background:#12171cd9;border-radius:5px;backdrop-filter:blur(12px)}
.view-controls button{font:700 .65rem Arial,sans-serif;letter-spacing:.05em;text-transform:uppercase;color:#c5cbd0;border:0;border-radius:3px;background:transparent;padding:9px 10px;cursor:pointer;min-height:34px}
.view-controls button[aria-pressed=true]{color:#181a1d;background:#efbb82}
.view-controls button:focus-visible{outline:2px solid #ffffff;outline-offset:3px}
.view-controls .spin-control{background:#141a20d9;border:1px solid #6e757a;color:#f5ddc0}
.view-controls .spin-control[aria-pressed=true]{background:#262c33;color:#f5ddc0}
.inspection-scene{min-height:420px}
.inspection-scene .orbit-note{top:66px;right:20px}
@media(max-width:520px){.view-controls{left:14px;right:14px;top:14px;bottom:auto;gap:6px}.view-controls button{padding:7px 9px;min-height:34px;font-size:.6rem}.view-controls .spin-control{margin-left:auto}.inspection-scene{min-height:370px}.inspection-scene .orbit-note{top:102px;right:14px;font-size:.56rem;padding:6px 8px}}
@media(max-width:900px){.pack-layout,.detail-layout{grid-template-columns:1fr}.scene-card{height:min(610px,62vh)}}
@media(max-width:850px){.topbar{height:68px}.side-nav{position:fixed;top:auto;bottom:0;left:0;right:0;justify-content:space-around;padding:5px 4px calc(5px + env(safe-area-inset-bottom));border-top:1px solid #514c48;border-bottom:0;background:#16191df5;box-shadow:0 -15px 35px #0006}.nav-item{flex-direction:column;gap:1px;min-width:60px;padding:6px 4px 7px;font-size:.58rem;border-bottom:0;border-top:3px solid transparent}.nav-item span:first-child{font-size:1.23rem}.nav-item:hover,.nav-item.active{border-top-color:#ff9950;border-bottom-color:transparent;background:#f77b3120}main{padding:28px 18px calc(96px + env(safe-area-inset-bottom))}.scene-card{height:min(510px,54vh);min-height:330px}}
@media(max-width:520px){h1{font-size:clamp(3.3rem,13vw,4.8rem)}.page-title{font-size:clamp(3rem,12vw,4.4rem)}.topbar{padding:0 14px}.top-stats{gap:4px}.stat-chip{padding:7px;font-size:.66rem}.brand-mark{width:35px;height:35px}.brand strong{font-size:16px}.brand small{font-size:8px}.panel{padding:19px}.counter strong{font-size:1.65rem}.scene-caption{left:17px;right:17px;bottom:15px}.scene-caption strong{font-size:1.1rem}.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.car-art{height:117px}.car-body{padding:11px}.car-body h3{font-size:1.02rem}.car-meta{gap:6px}.car-meta small{font-size:.68rem}}
@media(max-width:360px){.top-stats .stat-chip:nth-child(2){display:none}.grid{grid-template-columns:1fr}}

/* Collection browsing shares the archive, with independent owned filters. */
.collection-switch{display:flex;gap:4px;width:max-content;max-width:100%;padding:4px;margin:0 0 20px;background:#191d22;border:1px solid #62676b;border-radius:7px}
.collection-switch button{min-height:44px;padding:10px 20px;border:0;border-radius:4px;background:transparent;color:#d5d8da;font-weight:800}
.collection-switch button[aria-pressed=true]{background:#efbb82;color:#181a1d}
.library-intro{max-width:70ch;line-height:1.6;margin-bottom:20px}
.collection-head{margin-bottom:20px}
.collection-head .page-title{font-size:clamp(2.5rem,4vw,4rem)}
.results-count{font-size:.8rem;font-variant-numeric:tabular-nums;margin:0 0 14px}
.library-card{height:100%;min-width:0}
.library-art{background:radial-gradient(ellipse at 50% 65%,#41484e,#1b2025 80%)}
.library-art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 10px #0006)}
.library-static{cursor:default}
.library-static:hover{transform:none;border-color:#565c5f;box-shadow:0 14px 36px #0004}
.library-card h3{overflow-wrap:anywhere}
.casting-status{font-size:.75rem;color:#bdc5cb}
.library-status{font-size:.75rem;line-height:1.5;color:#bdc5cb;margin:10px 0 0;font-variant-numeric:tabular-nums}

/* A single collapsed inspection disclosure leaves the casting in view. */
.view-controls{display:block;left:18px;right:auto;top:14px;max-width:calc(100% - 36px);width:max-content}
.view-controls summary{min-height:44px;display:list-item;width:max-content;max-width:100%;padding:13px 15px;background:#151a20f5;border:1px solid #778087;border-radius:5px;color:#f5ddc0;font-size:.75rem;font-weight:800;cursor:pointer}
.view-controls summary:focus-visible{outline:2px solid #ffbb7b;outline-offset:3px}
.inspection-tools{display:grid;grid-template-columns:1fr;gap:7px;padding:10px;margin-top:7px;border:1px solid #667078;border-radius:6px;background:#151a20f5;box-shadow:0 12px 24px #0007;max-height:calc(100% - 60px)}
.view-controls .view-options{display:flex;justify-content:space-between;padding:0;backdrop-filter:none;border:0;background:#20272e;gap:3px}
.view-controls button{min-width:44px;min-height:44px;padding:9px 13px;font-size:.68rem;flex:1;color:#d5dce2}
.view-controls .spin-control{width:100%;margin:0;min-height:44px}
.inspection-scene .orbit-note{top:18px;right:18px}
::selection{color:#1b1b1d;background:#efbb82}
input{caret-color:#ffb376}
html{scrollbar-color:#80644f #181c21}
@media(max-width:850px){
  .pack-layout{display:flex;flex-direction:column;gap:16px}
  .pack-side{display:contents}
  .pack-allowance{order:-1}
  .pack-layout>.scene-card{order:0}
  .pack-layout .pack-side>.panel:not(.pack-allowance){order:1}
}
@media(max-width:520px){
  .collection-head .section-sub{margin-top:12px;font-size:.9rem}
  .library-intro{font-size:.9rem;line-height:1.5;margin-bottom:16px}
  .pack-layout .scene-card{height:340px;min-height:300px}
  .pack-allowance .eyebrow{margin-bottom:12px}
  .pack-allowance .counter-row{padding-bottom:12px;margin-bottom:12px}
  .pack-allowance .countdown{margin-top:10px}
  .collection-switch{width:100%}
  .collection-switch button{flex:1;padding:10px 14px}
  .filters>.button{flex:1;min-width:0}
  .view-controls{left:12px;top:12px;max-width:calc(100% - 24px)}
  .view-controls button{min-height:44px;min-width:44px;padding:9px 12px;font-size:.65rem}
  .inspection-tools{gap:5px;padding:8px;margin-top:5px}
  .library-status{font-size:.7rem}
}
