@font-face{font-family:Bricolage;src:url('./fonts/bricolage.woff2') format('woff2');font-display:swap;font-weight:400 700}
@font-face{font-family:Instrument;src:url('./fonts/instrument.woff2') format('woff2');font-display:swap;font-weight:400 700}
@font-face{font-family:PlexMono;src:url('./fonts/ibm-plex-mono.woff2') format('woff2');font-display:swap;font-weight:400 600}

:root{
  --ink:#07080a;
  --ink-2:#0b0c0f;
  --panel:#101115;
  --raised:#17181c;
  --line:rgba(255,255,255,.12);
  --line-strong:rgba(255,255,255,.22);
  --white:#fff;
  --text:#f7f7f8;
  --text-2:#d7d8dd;
  --muted:#92959f;
  --iris:#8c82ff;
  --iris-dim:#191630;
  --stock:#ece7dc;
  --stock-2:#d9d1c2;
  --stock-ink:#171715;
  --gold:#8e7450;
  --success:#43d49e;
  --radius:8px;
  --ease:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;background:var(--ink);color:var(--text);font-family:Instrument,Arial,sans-serif;line-height:1.45;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
button{font:inherit}
button,a{outline:none}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--iris);outline-offset:3px}
svg{display:block;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6}

.notice{position:fixed;z-index:50;top:0;left:0;right:0;height:29px;display:flex;align-items:center;justify-content:center;gap:18px;border-bottom:1px solid rgba(255,255,255,.1);background:#16171b;color:#b8bac2;font:500 10px/1 PlexMono,monospace;letter-spacing:.08em;text-transform:uppercase}
.notice span+span::before{content:'·';margin-right:18px;color:#555861}
.app-shell{min-height:100vh;padding-top:29px}

.rail{position:fixed;z-index:20;inset:29px auto 0 0;width:158px;display:flex;flex-direction:column;border-right:1px solid var(--line);background:var(--ink-2);padding:22px 14px 18px}
.brand{display:flex;align-items:center;gap:9px;padding:0 4px 28px;font:600 16px/1 Bricolage,sans-serif;letter-spacing:-.02em}
.brand svg{width:22px;height:22px;stroke-width:1.4}
.rail nav{display:grid;gap:5px}
.rail nav a{display:flex;align-items:center;gap:10px;min-height:39px;padding:0 9px;border-radius:6px;color:var(--muted);font-size:13px;transition:background .16s ease,color .16s ease}
.rail nav a svg{width:17px;height:17px}
.rail nav a:hover{background:var(--raised);color:var(--text)}
.rail nav a.active{background:var(--iris-dim);color:var(--text);box-shadow:inset 0 0 0 1px rgba(140,130,255,.38)}
.rail-set{margin-top:auto;padding:15px 9px 5px;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:4px 8px}
.rail-label{grid-column:1/-1;color:var(--muted);font:500 9px/1 PlexMono,monospace;letter-spacing:.1em;text-transform:uppercase}
.rail-number{font:600 32px/1 Bricolage,sans-serif}
.rail-meta{align-self:end;padding-bottom:3px;color:var(--success);font:500 10px/1 PlexMono,monospace}

main{margin-left:158px;min-width:0;padding:0 34px 80px}
.masthead{height:57px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.crumbs{display:flex;align-items:center;gap:9px;color:var(--muted);font-size:12px}
.crumbs a{color:var(--text-2)}
.icon-button,.set-controls button{display:grid;place-items:center;border:1px solid var(--line);background:transparent;color:var(--text-2);cursor:pointer;transition:background .16s ease,border-color .16s ease}
.icon-button{width:32px;height:32px;border-radius:6px}
.icon-button svg{width:17px;height:17px}
.icon-button:hover,.set-controls button:hover{background:var(--raised);border-color:var(--line-strong);color:var(--white)}

.world-intro{display:grid;grid-template-columns:minmax(320px,.95fr) minmax(320px,1.1fr) minmax(240px,.75fr);gap:42px;align-items:end;padding:26px 0 22px;border-bottom:1px solid var(--line)}
.edition,.set-kicker{display:block;color:var(--muted);font:500 10px/1.3 PlexMono,monospace;letter-spacing:.11em;text-transform:uppercase}
h1,h2,h3,p{margin:0}
h1{margin-top:10px;font:500 clamp(44px,4.3vw,70px)/.9 Bricolage,sans-serif;letter-spacing:-.045em;text-wrap:balance}
.premise{max-width:65ch;color:var(--text-2);font-size:16px;line-height:1.55}
.world-facts{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px}
.world-facts span{display:flex;align-items:baseline;gap:8px;color:var(--muted);font-size:12px}
.world-facts b{color:var(--text);font:500 25px/1 Bricolage,sans-serif}

.catalog-index{position:sticky;z-index:15;top:29px;display:flex;align-items:center;gap:28px;min-height:55px;overflow-x:auto;border-bottom:1px solid var(--line);background:rgba(7,8,10,.96);scrollbar-width:none}
.catalog-index::-webkit-scrollbar{display:none}
.catalog-index a{position:relative;display:flex;align-items:center;gap:7px;min-height:55px;white-space:nowrap;color:var(--muted);font-size:12px}
.catalog-index a:hover{color:var(--text)}
.catalog-index a.selected{color:var(--text)}
.catalog-index a.selected::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--iris)}
.catalog-index small{color:#686b73;font:500 10px PlexMono,monospace}

.issued-set{padding:24px 0 52px;overflow:hidden}
.set-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:14px}
.set-heading h2,.section-heading h2{margin-top:6px;font:500 28px/1 Bricolage,sans-serif;letter-spacing:-.025em}
.set-controls{display:flex;flex-shrink:0;align-items:center;gap:8px;color:var(--muted);font:500 10px PlexMono,monospace}
.set-controls span{white-space:nowrap}
.set-controls button{width:34px;height:34px;border-radius:50%}
.set-controls button svg{width:16px;height:16px}
.set-controls b{color:var(--text);font-size:12px;font-weight:500}

.card-stage{position:relative;height:min(42vw,510px);min-height:450px;margin:0 -8px 0 0;isolation:isolate}
.lobby-card{position:absolute;top:0;left:0;display:grid;grid-template-rows:minmax(0,1fr) auto;overflow:hidden;width:min(68%,830px);aspect-ratio:1.72;border:1px solid rgba(255,255,255,.16);border-radius:2px;background:var(--stock);box-shadow:0 24px 64px rgba(0,0,0,.48);transform-origin:center;transition:transform .55s var(--ease),filter .55s var(--ease),opacity .3s ease}
.lobby-card.is-current{z-index:3;left:0;transform:rotate(-.35deg)}
.lobby-card.is-next{z-index:2;top:28px;left:58%;width:min(52%,640px);transform:rotate(1.3deg);filter:brightness(.78)}
.lobby-card.is-queued{z-index:1;top:72px;left:74%;width:min(39%,480px);transform:rotate(3deg);filter:brightness(.58)}
.card-stage.is-shifting .lobby-card{transform:translateX(-18px) rotate(-1deg);opacity:.72}
.card-image{position:relative;min-height:0;overflow:hidden;background:#18191c}
.card-image::after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(23,23,21,.42),inset 0 -30px 40px rgba(0,0,0,.08);pointer-events:none}
.card-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.91) contrast(.99)}
.card-stock{min-height:128px;display:grid;grid-template-columns:114px minmax(0,1fr) auto;gap:20px;align-items:center;padding:17px 19px 16px;color:var(--stock-ink);background-color:var(--stock);background-image:repeating-linear-gradient(0deg,rgba(47,43,37,.018) 0,rgba(47,43,37,.018) 1px,transparent 1px,transparent 3px);box-shadow:inset 0 1px 0 rgba(23,23,21,.2)}
.plate-stamp{align-self:stretch;display:grid;grid-template-rows:auto 1fr;align-items:end;padding-right:17px;border-right:1px solid rgba(23,23,21,.24)}
.plate-stamp span,.edition-mark{font:500 8px/1.4 PlexMono,monospace;letter-spacing:.09em;text-transform:uppercase}
.plate-stamp b{align-self:end;font:500 43px/.85 Bricolage,sans-serif;letter-spacing:-.055em}
.card-copy h3{font:600 clamp(18px,1.65vw,25px)/1.03 Bricolage,sans-serif;letter-spacing:-.03em}
.card-copy p{max-width:58ch;margin-top:7px;color:#5e5a52;font-size:11px;line-height:1.35}
.edition-mark{align-self:end;max-width:90px;color:#6d675d;text-align:right}

.set-tray{display:flex;gap:9px;max-width:100%;margin-top:22px;overflow-x:auto;padding:2px 2px 12px;scrollbar-color:var(--line-strong) transparent}
.tray-card{position:relative;flex:0 0 160px;height:82px;overflow:hidden;border:1px solid var(--line);border-radius:4px;background:var(--panel);color:var(--white);cursor:pointer;text-align:left;transition:transform .2s var(--ease),border-color .2s ease}
.tray-card::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(7,8,10,.92),rgba(7,8,10,.08) 72%)}
.tray-card img{width:100%;height:100%;object-fit:cover;filter:saturate(.72)}
.tray-card span,.tray-card b{position:absolute;z-index:1;bottom:8px}
.tray-card span{left:9px;right:34px;overflow:hidden;color:#f2f2f2;font-size:10px;white-space:nowrap;text-overflow:ellipsis}
.tray-card b{right:9px;color:#d7d8dd;font:500 9px PlexMono,monospace}
.tray-card:hover{transform:translateY(-2px);border-color:var(--line-strong)}
.tray-card.active{border-color:var(--iris);box-shadow:0 0 0 1px var(--iris)}

.catalog-section{padding:54px 0 30px;border-top:1px solid var(--line)}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:32px;margin-bottom:22px}
.section-heading p{max-width:55ch;color:var(--muted);font-size:13px;text-align:right}
.plate-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.catalog-plate{overflow:hidden;border:1px solid var(--line);border-radius:4px;background:var(--panel)}
.catalog-plate img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;filter:saturate(.83)}
.catalog-plate>div{padding:13px 14px 15px;border-top:1px solid var(--line)}
.catalog-plate span,.location-strip span,.object-grid span{color:var(--muted);font:500 9px PlexMono,monospace;text-transform:uppercase;letter-spacing:.08em}
.catalog-plate h3,.location-strip h3,.object-grid h3{margin-top:4px;font:500 17px/1.1 Bricolage,sans-serif}
.catalog-plate p{margin-top:4px;color:var(--muted);font-size:11px}
.location-strip{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:12px}
.location-strip article{position:relative;min-height:330px;overflow:hidden;border:1px solid var(--line);border-radius:4px;background:var(--panel)}
.location-strip img{width:100%;height:100%;object-fit:cover}
.location-strip article::after{content:'';position:absolute;inset:30% 0 0;background:linear-gradient(transparent,rgba(7,8,10,.94))}
.location-strip span,.location-strip h3{position:absolute;z-index:1;left:16px}
.location-strip span{bottom:42px}
.location-strip h3{right:16px;bottom:16px;color:var(--white)}
.object-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.object-grid article{display:grid;grid-template-columns:42% 1fr;min-height:220px;overflow:hidden;border:1px solid var(--line);border-radius:4px;background:var(--panel)}
.object-grid img{width:100%;height:100%;object-fit:cover}
.object-grid div{display:flex;flex-direction:column;justify-content:flex-end;padding:18px}
.object-grid p{margin-top:8px;color:var(--muted);font-size:11px}
footer{display:flex;justify-content:space-between;gap:20px;margin-top:50px;padding:20px 0;border-top:1px solid var(--line);color:var(--muted);font:500 10px PlexMono,monospace}
footer a{color:var(--text-2)}
footer a:hover{color:var(--white)}

@media(max-width:1100px){
  .world-intro{grid-template-columns:1fr 1fr}.world-facts{grid-column:1/-1;grid-template-columns:repeat(4,1fr);padding-top:4px}
  .lobby-card{width:76%}.lobby-card.is-next{left:63%;width:55%}.lobby-card.is-queued{left:79%;width:42%}
  .object-grid{grid-template-columns:1fr}.object-grid article{min-height:180px}
}

@media(max-width:760px){
  .notice{justify-content:flex-start;gap:10px;overflow:hidden;padding:0 12px;white-space:nowrap}.notice span:last-child{display:none}
  .rail{position:fixed;inset:auto 0 0 0;width:auto;height:64px;display:block;border-top:1px solid var(--line);border-right:0;padding:6px 12px;background:rgba(11,12,15,.97)}
  .brand,.rail-set{display:none}.rail nav{display:grid;grid-template-columns:repeat(3,1fr);height:100%;gap:4px}.rail nav a{flex-direction:column;justify-content:center;gap:2px;min-height:0;padding:2px;font-size:10px}.rail nav a svg{width:16px;height:16px}
  main{margin-left:0;padding:0 16px 96px}.masthead{height:49px}.world-intro{grid-template-columns:1fr;gap:22px;padding:28px 0 24px}h1{font-size:48px;line-height:.92}.premise{font-size:14px}.world-facts{grid-template-columns:1fr 1fr;gap:13px 20px}.catalog-index{top:29px;gap:22px;min-height:49px}.catalog-index a{min-height:49px}
  .issued-set{padding-top:25px}.set-heading{align-items:center}.set-heading h2{font-size:23px}.set-kicker{font-size:9px}.set-controls{gap:6px}
  .card-stage{height:575px;min-height:575px;margin-right:0}.lobby-card{width:94%;aspect-ratio:auto;height:525px}.lobby-card.is-current{left:0}.lobby-card.is-next{top:24px;left:84%;width:88%;height:500px}.lobby-card.is-queued{display:none}.card-stock{min-height:168px;grid-template-columns:72px 1fr;gap:13px;padding:14px}.plate-stamp{padding-right:12px}.plate-stamp b{font-size:35px}.card-copy h3{font-size:19px}.edition-mark{grid-column:2;max-width:none;text-align:left}.card-copy p{font-size:10px}.set-tray{margin-top:12px}.tray-card{flex-basis:132px;height:70px}
  .section-heading{display:block}.section-heading p{margin-top:8px;text-align:left}.plate-grid{grid-template-columns:1fr}.location-strip{display:flex;overflow-x:auto}.location-strip article{flex:0 0 82%;min-height:380px}.object-grid article{grid-template-columns:44% 1fr;min-height:190px}footer{display:grid;padding-bottom:10px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.lobby-card,.tray-card{transition:none}}