:root{
  --bg:#050505;
  --paper:#f4f0e9;
  --muted:#92928f;
  --line:rgba(255,255,255,.13);
  --accent:#9a6cff;
  --serif:Georgia,"Times New Roman",serif;
  --sans:"Arial Narrow","Helvetica Neue",Arial,sans-serif;
  --mono:"SFMono-Regular",Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box}
html{background:var(--bg);scroll-behavior:smooth}
body{margin:0;background:
  radial-gradient(circle at 71% 28%,rgba(133,104,177,.055),transparent 24%),
  linear-gradient(180deg,#030405 0,#070707 44%,#030303 100%);
  color:var(--paper);font-family:var(--sans);min-height:100vh}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.24;z-index:20;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.96' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.08'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
button,a{font:inherit;color:inherit}
button{cursor:pointer}
.topbar{height:82px;padding:0 clamp(22px,4vw,64px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.07);position:relative;z-index:30}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:800 10px var(--mono);letter-spacing:.25em}
.brand-dot{width:20px;height:20px;border:1px solid #ffffff24;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 22px rgba(157,218,255,.13)}
.brand-dot:after{content:"";width:4px;height:4px;background:#e5fbff;border-radius:50%;box-shadow:0 0 9px #a4efff}
.build{text-align:right;font:700 8px var(--mono);letter-spacing:.2em;line-height:1.45;color:#7d7d7a}.build b{display:block;color:#e7e3dc;font-size:9px}
main{width:min(1500px,100%);margin:0 auto;padding:0 clamp(22px,4vw,64px)}
.intro{min-height:64vh;padding:clamp(84px,12vh,150px) 0 80px;display:flex;flex-direction:column;justify-content:center;border-bottom:1px solid var(--line)}
.eyebrow{display:flex;align-items:center;gap:10px;font:800 9px var(--mono);letter-spacing:.22em;color:#93928e}.eyebrow i{width:5px;height:5px;border-radius:50%;background:#eaffff;box-shadow:0 0 13px #9de8ff}
.intro h1,.gate h2{font:400 clamp(60px,9vw,138px)/.82 var(--serif);letter-spacing:-.07em;margin:34px 0 32px;max-width:1100px}.intro h1 em,.gate h2 em{font-weight:400;color:#aaa3b2}
.intro>p{max-width:700px;margin:0;font:400 clamp(17px,1.45vw,23px)/1.55 var(--sans);color:#a6a39e}.principles{display:flex;flex-wrap:wrap;gap:8px;margin-top:48px}.principles span{border:1px solid var(--line);border-radius:999px;padding:11px 14px;font:750 8px var(--mono);letter-spacing:.16em;color:#a7a6a1;background:#ffffff05}
.cabinet{min-height:100vh;padding:110px 0;display:grid;grid-template-columns:minmax(320px,.82fr) minmax(430px,1.18fr);align-items:center;gap:clamp(60px,8vw,140px);border-bottom:1px solid var(--line)}
.cabinet-copy{position:relative;z-index:3}.section-no{font:700 9px var(--mono);letter-spacing:.2em;color:#686866}.section-no span{color:#e8e4dd}.rarity-line{display:flex;align-items:center;gap:10px;margin-top:56px;font:800 9px var(--mono);letter-spacing:.18em;color:var(--accent)}.rarity-line i{display:block;width:7px;height:16px;border-radius:99px;background:var(--accent);box-shadow:0 0 14px var(--accent)}
.cabinet h2{font:400 clamp(68px,7vw,118px)/.84 var(--serif);letter-spacing:-.065em;text-transform:capitalize;margin:20px 0 27px}.thesis{max-width:610px;font-size:18px;line-height:1.6;color:#a9a6a0;margin:0}.spec-list{margin:54px 0 0;border-top:1px solid var(--line)}.spec-list div{display:grid;grid-template-columns:120px 1fr;gap:20px;border-bottom:1px solid var(--line);padding:16px 0}.spec-list dt{font:700 8px var(--mono);letter-spacing:.18em;color:#6d6d6a}.spec-list dd{margin:0;font:800 9px var(--mono);letter-spacing:.12em;color:#ddd9d1}
.controls{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:34px}.control{min-height:74px;text-align:left;padding:15px 17px;border-radius:14px;border:1px solid var(--line);background:#090a0c;transition:border-color .25s,background .25s}.control span,.control small{display:block}.control span{font:800 9px var(--mono);letter-spacing:.14em}.control small{font:700 7px var(--mono);letter-spacing:.1em;color:#73736f;margin-top:6px;line-height:1.4}.control.active{border-color:color-mix(in srgb,var(--accent) 55%,#ffffff1a);background:color-mix(in srgb,var(--accent) 7%,#08090b)}.control.active span{color:color-mix(in srgb,var(--accent) 75%,white)}
.card-bay{position:relative;min-height:850px;display:flex;align-items:center;justify-content:center;flex-direction:column;isolation:isolate}.card-atmosphere{position:absolute;width:min(660px,90%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 17%,transparent),transparent 64%);filter:blur(26px);opacity:.45;transition:background .5s}
.collector-card{--mx:50%;--my:50%;--card-accent:#9a6cff;width:min(510px,86vw);aspect-ratio:2/3;position:relative;z-index:2;filter:drop-shadow(0 70px 90px rgba(0,0,0,.9));user-select:none;-webkit-user-select:none;touch-action:none}
.card-stock{position:absolute;inset:0;border-radius:4.8%;overflow:hidden;background:#050609;border:1px solid rgba(255,255,255,.24);box-shadow:inset 0 0 0 4px #06070a,inset 0 0 0 5px rgba(255,255,255,.12),inset 0 0 50px rgba(255,255,255,.035)}
.card-stock:before{content:"";position:absolute;inset:10px;z-index:5;border-radius:3.7%;border:1px solid rgba(255,255,255,.3);box-shadow:0 0 0 1px #000,inset 0 0 0 1px rgba(0,0,0,.8);pointer-events:none}
.card-stock:after{content:"";position:absolute;inset:15px;z-index:4;border-radius:3.1%;border:1px solid color-mix(in srgb,var(--card-accent) 38%,#ffffff18);pointer-events:none}
.card-art{position:absolute;inset:15px;width:calc(100% - 30px);height:calc(100% - 30px);object-fit:cover;border-radius:3.1%;display:block}
.art-grade{position:absolute;inset:15px;z-index:2;border-radius:3.1%;background:linear-gradient(180deg,rgba(0,0,0,.34) 0,transparent 28%,transparent 67%,rgba(0,0,0,.72) 100%);pointer-events:none}
.card-vignette{position:absolute;inset:15px;z-index:3;border-radius:3.1%;box-shadow:inset 0 0 80px #0009,inset 0 0 12px #000;pointer-events:none}
.micrograin{position:absolute;inset:0;z-index:9;opacity:.09;mix-blend-mode:soft-light;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='5' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")}
.foil-map{position:absolute;inset:15px;z-index:8;border-radius:3.1%;pointer-events:none;opacity:.08;mix-blend-mode:screen;background:radial-gradient(circle at var(--mx) var(--my),rgba(255,255,255,.82) 0,rgba(255,255,255,.11) 8%,transparent 22%),linear-gradient(112deg,transparent 17%,color-mix(in srgb,var(--card-accent) 28%,transparent) 34%,rgba(255,255,255,.25) 47%,rgba(126,214,255,.16) 54%,transparent 70%);transition:opacity .35s}
.collector-card.inspecting .foil-map{opacity:.27}.collector-card.still .foil-map{opacity:0!important}
.card-frame{position:absolute;inset:0;z-index:10;pointer-events:none}.corner{position:absolute;width:42px;height:42px;border-color:rgba(255,255,255,.58);opacity:.65}.corner.tl{left:22px;top:22px;border-left:1px solid;border-top:1px solid}.corner.tr{right:22px;top:22px;border-right:1px solid;border-top:1px solid}.corner.bl{left:22px;bottom:22px;border-left:1px solid;border-bottom:1px solid}.corner.br{right:22px;bottom:22px;border-right:1px solid;border-bottom:1px solid}
.card-header{position:absolute;z-index:12;left:37px;right:37px;top:31px;text-align:center;text-shadow:0 2px 10px #000,0 0 28px #000}.card-brand,.card-id{position:absolute;top:0;font:750 7px var(--mono);letter-spacing:.14em;color:#d9d7d1}.card-brand{left:0}.card-id{right:0}.card-header h3{margin:34px 0 9px;font:500 clamp(28px,3vw,46px)/.95 var(--serif);letter-spacing:-.04em;color:#f7f4ed}.card-class{display:flex;align-items:center;justify-content:center;gap:7px;font:800 7px var(--mono);letter-spacing:.18em;color:color-mix(in srgb,var(--card-accent) 68%,white)}.card-class i{width:4px;height:9px;border-radius:99px;background:var(--card-accent);box-shadow:0 0 10px var(--card-accent)}
.card-footer{position:absolute;z-index:12;left:36px;right:36px;bottom:31px;display:grid;grid-template-columns:1fr 52px 1fr;align-items:end;text-shadow:0 2px 8px #000}.card-footer>div:not(.sigil){display:flex;flex-direction:column;gap:4px}.card-footer span{font:700 6px var(--mono);letter-spacing:.13em;color:#8f8d88}.card-footer b{font:800 8px var(--mono);letter-spacing:.12em;color:#eeebe4}.card-footer .serial{text-align:right}.sigil{width:42px;height:42px;border-radius:50%;place-self:center;display:grid;place-items:center;border:1px solid rgba(255,255,255,.48);background:#050609cc;box-shadow:0 0 0 4px #050609,0 0 0 5px color-mix(in srgb,var(--card-accent) 35%,#ffffff20)}.sigil i{width:15px;height:15px;transform:rotate(45deg);border:1px solid var(--card-accent);box-shadow:inset 0 0 8px color-mix(in srgb,var(--card-accent) 55%,transparent),0 0 8px color-mix(in srgb,var(--card-accent) 45%,transparent)}
.collector-card[data-rarity="legendary"] .card-stock{border-color:#e2c89988}.collector-card[data-rarity="legendary"] .foil-map{background:radial-gradient(circle at var(--mx) var(--my),#fff7 0,#ffe2a122 9%,transparent 22%),linear-gradient(108deg,transparent 18%,#e5bd6830 36%,#fff4ce3d 47%,#a8e9ff1c 55%,transparent 72%)}
.collector-card[data-rarity="mythic"] .card-stock{border-color:#cbd9e2aa;box-shadow:inset 0 0 0 4px #05070a,inset 0 0 0 5px rgba(236,248,255,.24),inset 0 0 58px rgba(167,211,255,.07)}.collector-card[data-rarity="mythic"] .foil-map{background:radial-gradient(circle at var(--mx) var(--my),#fff 0,#c9efff55 4%,transparent 19%),linear-gradient(112deg,transparent 16%,#9adfff2b 34%,#fff7 46%,#c9a4ff3b 55%,transparent 72%),repeating-linear-gradient(67deg,transparent 0 11px,#d9f6ff0a 12px 13px)}
.inspection-note{position:relative;z-index:3;margin:22px 0 0;font:750 8px var(--mono);letter-spacing:.16em;color:#777773;text-align:center}
.card-selector{padding:55px 0 120px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border-bottom:1px solid var(--line)}.selector{min-height:124px;border:1px solid var(--line);background:#08090a;border-radius:18px;padding:12px;display:grid;grid-template-columns:68px 1fr 34px;align-items:center;gap:15px;text-align:left;transition:background .25s,border-color .25s,transform .25s}.selector:hover{transform:translateY(-2px)}.selector.active{background:color-mix(in srgb,var(--accent) 6%,#090a0b);border-color:color-mix(in srgb,var(--accent) 42%,#ffffff1c)}.thumb{width:68px;height:96px;border-radius:9px;overflow:hidden;border:1px solid #ffffff22}.thumb img{width:100%;height:100%;object-fit:cover}.selector-copy small,.selector-copy b,.selector-copy em{display:block}.selector-copy small{font:700 7px var(--mono);letter-spacing:.17em;color:#6f6f6c}.selector-copy b{font:500 18px var(--serif);margin:7px 0 6px}.selector-copy em{font:750 7px var(--mono);font-style:normal;letter-spacing:.11em;color:#8e8d89}.arrow{width:32px;height:32px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;font-size:13px}
.gate{padding:140px 0;display:grid;grid-template-columns:1.1fr .9fr;gap:8vw;align-items:end}.gate h2{font-size:clamp(58px,7vw,108px);margin-bottom:0}.gate-copy>p{font-size:18px;line-height:1.6;color:#aaa7a1;max-width:600px}.gate-score{margin-top:38px;border:1px solid var(--line);border-radius:20px;padding:28px;background:#080909}.gate-score span,.gate-score b,.gate-score small{display:block}.gate-score span{font:400 58px var(--serif);letter-spacing:-.05em}.gate-score b{font:800 9px var(--mono);letter-spacing:.16em;margin-top:9px;color:#d8d4cc}.gate-score small{font:700 8px/1.6 var(--mono);letter-spacing:.08em;color:#777771;margin-top:9px}.gate-score a{color:#b8b5af;text-underline-offset:3px}.gate-score.pass{border-color:#9ff5d466;background:#9ff5d408}.gate-score.pass span{color:#bfffe5}.gate-score.fail{border-color:#ffb49b55;background:#ff8c6607}.gate-score.fail span{color:#ffc2ae}
.footer{min-height:100px;border-top:1px solid var(--line);padding:0 clamp(22px,4vw,64px);display:flex;align-items:center;justify-content:space-between;font:700 8px var(--mono);letter-spacing:.17em;color:#686865}
@media(max-width:980px){.cabinet{grid-template-columns:1fr;gap:70px}.card-bay{min-height:auto}.cabinet-copy{max-width:760px}.card-selector{grid-template-columns:1fr}.selector{grid-template-columns:68px 1fr 40px}.gate{grid-template-columns:1fr}.gate-copy{max-width:740px}}
@media(max-width:620px){.topbar{height:68px}.build span{display:none}.intro{min-height:72vh;padding-top:70px}.intro h1{font-size:clamp(54px,18vw,82px)}.principles{flex-direction:column;align-items:flex-start}.cabinet{padding:78px 0}.cabinet h2{font-size:65px}.controls{grid-template-columns:1fr}.card-bay{margin-left:-10px;margin-right:-10px}.collector-card{width:min(420px,91vw)}.card-header{left:29px;right:29px;top:27px}.card-header h3{font-size:28px;margin-top:30px}.card-brand,.card-id{font-size:5px}.card-footer{left:29px;right:29px;bottom:27px;grid-template-columns:1fr 44px 1fr}.card-footer span{font-size:5px}.card-footer b{font-size:6px}.sigil{width:35px;height:35px}.card-selector{padding-bottom:80px}.gate{padding:90px 0}.footer{flex-direction:column;justify-content:center;gap:10px;text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.selector{transition:none}.foil-map{transition:none}}