:root{
  --ink:#0D111A; --ink-2:#111623; --ink-3:#181E2E;
  --parchment:#E8DFC9; --parchment-dim:#B8AE95;
  --gold:#C39A4E; --gold-dim:#8A6D34;
  --hairline:rgba(195,154,78,.22);
  --green:#7FA871; --red:#B36A5E;
  --serif:"Source Serif 4",Georgia,serif;
  --display:"Cinzel",serif;
  --italic:"Cormorant Garamond",Georgia,serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--ink); color:var(--parchment);
  font-family:var(--serif); font-weight:300; line-height:1.55;
  min-height:100vh;
  background-image:
    radial-gradient(1200px 700px at 80% -10%, rgba(195,154,78,.06), transparent 60%),
    radial-gradient(900px 600px at -10% 110%, rgba(195,154,78,.04), transparent 55%);
}
body::after{ /* grain */
  content:""; position:fixed; inset:0; pointer-events:none; opacity:.05; z-index:9999;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.6'/%3E%3C/svg%3E");
}
a{color:var(--gold);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}

/* ---------- gate ---------- */
.gate{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;text-align:center}
.gate .lion{width:104px;opacity:0;animation:rise 1.2s .1s cubic-bezier(.2,.7,.2,1) forwards;color:var(--gold)}
.gate h1{font-family:var(--display);font-weight:400;font-size:clamp(1.4rem,4.5vw,2.1rem);letter-spacing:.35em;text-indent:.35em;margin-top:1.6rem;opacity:0;animation:rise 1.2s .35s cubic-bezier(.2,.7,.2,1) forwards}
.gate .sub{font-family:var(--italic);font-style:italic;font-size:1.05rem;color:var(--parchment-dim);margin-top:.5rem;opacity:0;animation:rise 1.2s .55s cubic-bezier(.2,.7,.2,1) forwards}
.gate .rule{width:120px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);margin:2.2rem auto;opacity:0;animation:rise 1.2s .7s forwards}
.gate form{opacity:0;animation:rise 1.2s .85s cubic-bezier(.2,.7,.2,1) forwards}
.gate input{
  background:transparent;border:1px solid var(--hairline);color:var(--parchment);
  font-family:var(--serif);font-size:1.1rem;letter-spacing:.25em;text-align:center;
  padding:.85rem 1.2rem;width:min(320px,80vw);outline:none;transition:border-color .3s;
}
.gate input:focus{border-color:var(--gold)}
.gate button{
  display:block;margin:1.1rem auto 0;background:transparent;color:var(--gold);
  font-family:var(--display);font-size:.8rem;letter-spacing:.3em;text-indent:.3em;
  border:1px solid var(--gold-dim);padding:.7rem 2.2rem;cursor:pointer;transition:all .3s;
}
.gate button:hover{background:var(--gold);color:var(--ink)}
.gate .err{color:var(--red);margin-top:1rem;font-size:.95rem;min-height:1.4em}
.gate .foot{position:fixed;bottom:1.2rem;font-size:.75rem;letter-spacing:.15em;color:var(--parchment-dim);opacity:.6}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ---------- portal chrome ---------- */
header.bar{
  display:flex;align-items:center;gap:.9rem;padding:1rem 1.2rem;
  border-bottom:1px solid var(--hairline);position:sticky;top:0;background:rgba(13,17,26,.92);
  backdrop-filter:blur(8px);z-index:50;
}
header.bar .lion{width:34px;color:var(--gold);flex:none}
header.bar .word{font-family:var(--display);letter-spacing:.28em;font-size:.85rem;white-space:nowrap}
header.bar .word small{display:block;font-family:var(--italic);font-style:italic;letter-spacing:.05em;text-transform:none;font-size:.8rem;color:var(--parchment-dim)}
header.bar .client{margin-left:auto;font-family:var(--italic);font-style:italic;color:var(--parchment-dim);font-size:.95rem;white-space:nowrap}

nav.tabs{
  display:flex;gap:0;overflow-x:auto;border-bottom:1px solid var(--hairline);
  position:sticky;top:63px;background:rgba(13,17,26,.92);backdrop-filter:blur(8px);z-index:49;
  scrollbar-width:none;
}
nav.tabs::-webkit-scrollbar{display:none}
nav.tabs button{
  background:none;border:none;color:var(--parchment-dim);font-family:var(--display);
  font-size:.72rem;letter-spacing:.22em;padding:.95rem 1.1rem;cursor:pointer;white-space:nowrap;
  border-bottom:2px solid transparent;transition:color .25s,border-color .25s;
}
nav.tabs button.on{color:var(--gold);border-bottom-color:var(--gold)}

main{max-width:1180px;margin:0 auto;padding:1.6rem 1.2rem 5rem}
.section-title{font-family:var(--display);font-weight:400;letter-spacing:.24em;font-size:1rem;color:var(--gold);margin:2.2rem 0 .4rem}
.section-sub{font-family:var(--italic);font-style:italic;color:var(--parchment-dim);margin-bottom:1.2rem}

/* funnel */
.funnel{display:flex;flex-wrap:wrap;gap:1px;background:var(--hairline);border:1px solid var(--hairline);margin-top:1.4rem}
.funnel .cell{background:var(--ink-2);padding:1.3rem 1rem;text-align:center;flex:1 1 170px}
.funnel .n{font-family:var(--italic);font-size:2.4rem;line-height:1;color:var(--parchment)}
.funnel .n.gold{color:var(--gold)}
.funnel .l{font-family:var(--display);font-size:.62rem;letter-spacing:.22em;color:var(--parchment-dim);margin-top:.55rem}

.ledgernote{border-left:2px solid var(--gold-dim);padding:.9rem 1.1rem;margin:1.6rem 0;font-family:var(--italic);font-style:italic;font-size:1.08rem;color:var(--parchment-dim)}
.ledgernote b{color:var(--parchment);font-style:normal}

/* golden cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1rem;margin-top:1.2rem}
.card{
  background:linear-gradient(160deg,var(--ink-2),var(--ink-3));border:1px solid var(--hairline);
  padding:1.2rem 1.2rem 1rem;position:relative;overflow:hidden;
}
.card::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--gold),transparent 70%)}
.card .score{position:absolute;top:.9rem;right:1rem;font-family:var(--italic);font-size:1.7rem;color:var(--gold)}
.card h3{font-family:var(--serif);font-weight:400;font-size:1.12rem;padding-right:3rem;line-height:1.3}
.card .trade{font-family:var(--display);font-size:.6rem;letter-spacing:.22em;color:var(--gold-dim);margin:.35rem 0 .8rem;text-transform:uppercase}
.card dl{display:grid;grid-template-columns:auto 1fr;gap:.15rem .8rem;font-size:.92rem}
.card dt{color:var(--parchment-dim);font-family:var(--italic);font-style:italic;white-space:nowrap}
.card dd{color:var(--parchment)}
.card .why{margin-top:.8rem;padding-top:.7rem;border-top:1px solid var(--hairline);font-size:.85rem;color:var(--parchment-dim);line-height:1.5}
.badge{display:inline-block;border:1px solid var(--gold-dim);color:var(--gold);font-family:var(--display);font-size:.55rem;letter-spacing:.18em;padding:.2rem .5rem;margin:.15rem .25rem .15rem 0;vertical-align:middle}

/* tables */
.tablewrap{overflow-x:auto;border:1px solid var(--hairline);margin-top:1rem}
table{width:100%;border-collapse:collapse;font-size:.9rem;min-width:720px}
th{font-family:var(--display);font-size:.6rem;letter-spacing:.2em;color:var(--gold-dim);text-align:left;padding:.7rem .8rem;border-bottom:1px solid var(--hairline);position:sticky;top:0;background:var(--ink-2);cursor:pointer;white-space:nowrap}
th:hover{color:var(--gold)}
td{padding:.55rem .8rem;border-bottom:1px solid rgba(195,154,78,.08);vertical-align:top}
tr:hover td{background:rgba(195,154,78,.04)}
.num{text-align:right;font-variant-numeric:tabular-nums}
.searchrow{display:flex;gap:.8rem;align-items:center;margin-top:1.2rem;flex-wrap:wrap}
.searchrow input{background:var(--ink-2);border:1px solid var(--hairline);color:var(--parchment);font-family:var(--serif);padding:.6rem .9rem;width:min(340px,100%);outline:none}
.searchrow input:focus{border-color:var(--gold)}
.searchrow .count{font-family:var(--italic);font-style:italic;color:var(--parchment-dim)}
.age-fresh{color:var(--green)} .age-aged{color:var(--parchment-dim)}
.age-stale{color:var(--gold)} .age-fossil{color:var(--red)}
.status-pending{color:var(--parchment-dim);font-style:italic}

/* buy-box */
.bb{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem;margin-top:1.2rem}
.bb .item{border:1px solid var(--hairline);background:var(--ink-2);padding:1.1rem 1.2rem}
.bb .item h4{font-family:var(--display);font-weight:400;font-size:.68rem;letter-spacing:.24em;color:var(--gold-dim);margin-bottom:.5rem}
.bb .item p{font-size:.98rem}

footer{border-top:1px solid var(--hairline);margin-top:4rem;padding:1.6rem 1.2rem;text-align:center;font-family:var(--italic);font-style:italic;color:var(--parchment-dim);font-size:.9rem}

.reveal{opacity:0;transform:translateY(12px);transition:opacity .7s,transform .7s}
.reveal.in{opacity:1;transform:none}
@media (max-width:640px){
  main{padding:1.2rem .8rem 4rem}
  .funnel .n{font-size:1.9rem}
  header.bar .word{letter-spacing:.18em;font-size:.78rem}
}

.chip{background:none;border:1px solid var(--hairline);color:var(--parchment-dim);font-family:var(--display);font-size:.58rem;letter-spacing:.16em;padding:.45rem .7rem;cursor:pointer;transition:all .25s;white-space:nowrap}
.chip:hover{border-color:var(--gold-dim);color:var(--parchment)}
.chip.on{border-color:var(--gold);color:var(--gold);background:rgba(195,154,78,.08)}
.lensrow{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem;margin-top:1.2rem}
.lens{background:linear-gradient(160deg,var(--ink-2),var(--ink-3));border:1px solid var(--hairline);padding:.85rem 1rem;cursor:pointer;text-align:left;transition:all .25s;color:var(--parchment)}
.lens span{display:block;font-family:var(--display);font-size:.72rem;letter-spacing:.2em;color:var(--parchment)}
.lens small{display:block;font-family:var(--italic);font-style:italic;color:var(--parchment-dim);margin-top:.3rem;font-size:.85rem}
.lens:hover{border-color:var(--gold-dim)}
.lens.on{border-color:var(--gold);box-shadow:inset 0 0 0 1px var(--gold)}
.lens.on span{color:var(--gold)}
