/* Stackers v2 — bento terminal. A different site, not a reskin. */
:root{
  --bg:#0b0e11; --panel:#13171d; --panel2:#1a1f27; --line:#262d37;
  --paper:#f2eee4; --paper2:#e7e1d2; --ink:#16181c; --inkmut:#5c5648;
  --text:#eef1f6; --muted:#8b95a7; --accent:#2ba05c; --accent-hi:#3dd67e;
  --gold:#f0cc52; --red:#e05a4e;
  --mono:"Space Grotesk",ui-monospace,monospace;
  --sans:Inter,-apple-system,"Segoe UI",system-ui,sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
/* anchor targets stop below the sticky topbar instead of underneath it */
h1,h2,h3,[id]{scroll-margin-top:96px}
body{background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.65}
img{display:block;max-width:100%}
a{color:var(--accent-hi);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3{font-family:var(--mono);line-height:1.05;letter-spacing:-.02em}
.wrap{max-width:1240px;margin:0 auto;padding:0 24px}

/* ============ floating pill nav (index) + legacy header (inner pages) ============ */
.topbar{position:sticky;top:14px;z-index:60;display:flex;justify-content:center;padding:0 16px}
.pill{display:flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:22px;background:rgba(19,23,29,.88);border:2px solid var(--line);
  padding:10px 12px 10px 20px;backdrop-filter:blur(12px);box-shadow:0 12px 34px rgba(0,0,0,.5)}
.pill .logo{font-family:var(--mono);font-weight:800;font-size:18px;color:var(--text);letter-spacing:.05em}
.pill .logo b{color:var(--accent-hi)}
.pill a.link{color:var(--muted);font-size:14px;font-family:var(--mono)}
.pill a.link:hover,.pill a.link.active{color:var(--text);text-decoration:none}
header{position:sticky;top:0;z-index:50;background:rgba(11,14,17,.92);border-bottom:2px solid var(--line);backdrop-filter:blur(8px)}
.nav{display:flex;align-items:center;gap:24px;height:68px}
.logo{font-family:var(--mono);font-weight:800;font-size:20px;color:var(--text);letter-spacing:.05em}
.logo b{color:var(--accent-hi)}
.nav a.link{color:var(--muted);font-size:14.5px;font-family:var(--mono)}
.nav a.link:hover,.nav a.link.active{color:var(--text);text-decoration:none}
.nav .spacer{flex:1}
.round{font-family:var(--mono);font-size:13px;color:var(--muted);border:2px solid var(--line);padding:7px 12px;background:var(--panel)}
.round b{color:var(--accent-hi)}
.connect{font-family:var(--mono);font-size:13.5px;font-weight:700;padding:10px 16px;background:var(--accent);
  color:#07130b;border:2px solid var(--accent);cursor:pointer}
.connect:hover{background:var(--accent-hi)}
@media(max-width:920px){.round{display:none}.pill{gap:12px}.pill a.link{font-size:12.5px}}

/* ============ editorial hero ============ */
.heroX{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:center;padding:92px 0 44px}
.heroX .kicker{font-family:var(--mono);color:var(--accent-hi);font-weight:700;font-size:14px;letter-spacing:.22em;margin-bottom:18px}
.heroX h1{font-size:clamp(40px,6vw,86px);text-transform:uppercase}
.heroX h1 .row2{color:transparent;-webkit-text-stroke:2px var(--accent-hi)}
.heroX .sub{color:var(--muted);font-size:18px;max-width:50ch;margin:24px 0 32px}
.heroX .ctas{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.heroX .heroart{width:100%;max-width:440px;justify-self:end;border:2px solid var(--line);
  box-shadow:10px 10px 0 rgba(0,0,0,.45)}
.chip{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:13px;color:var(--text);
  background:var(--panel);border:2px solid var(--line);padding:8px 14px}
.chip b{color:var(--accent-hi)}
@media(max-width:980px){.heroX{grid-template-columns:1fr}.heroX .heroart{justify-self:center;max-width:400px}}

/* ============ bento grid ============ */
.bento{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;padding:56px 0}
.b{background:var(--panel);border:2px solid var(--line);padding:26px;position:relative;overflow:hidden}
.b:hover{border-color:#33404e}
.b .tag{font-family:var(--mono);font-size:11.5px;letter-spacing:.18em;color:var(--muted);margin-bottom:14px}
.b .huge{font-family:var(--mono);font-weight:800;font-size:clamp(38px,4.6vw,64px);line-height:1;color:var(--accent-hi)}
.b .huge span{color:var(--muted);font-size:.45em}
/* the headline figure keeps full size and colour; only the qualifier
   beside it is the muted, smaller one */
.b .huge span.n{color:var(--accent-hi);font-size:1em}
.b p{color:var(--muted);font-size:14.5px}
.b-6{grid-column:span 6}.b-4{grid-column:span 4}.b-3{grid-column:span 3}.b-8{grid-column:span 8}.b-12{grid-column:span 12}
.b .artstack{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:6px}
.b .artstack img{border:2px solid var(--line)}
.b .logostrip{display:flex;flex-wrap:wrap;gap:10px;margin-top:10px}
.b .logostrip img,.b .logostrip .badge{width:34px;height:34px;border-radius:50%;background:#3a3f4a;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:800;font-size:12px;color:#e8ecf2}
.b .barwrap{height:14px;background:var(--panel2);border:2px solid var(--line);margin-top:16px}
.b .barwrap i{display:block;height:100%;width:100%;background:linear-gradient(90deg,var(--accent),var(--accent-hi))}
.b.mintcard-b{background:linear-gradient(135deg,#14231a,var(--panel));border-color:var(--accent)}
/* the headline number: what the collection has actually paid out */
.b.paidband{background:linear-gradient(135deg,#0f2417,var(--panel));border-color:var(--accent)}
.paidnum{font-family:var(--mono);font-weight:800;line-height:1;color:var(--accent-hi);
  font-size:clamp(44px,7vw,96px);margin:6px 0 10px}
/* mint is over: the way in is the secondary market, so the button carries the
   mark of the place it sends you rather than reading as another site action */
.oslink{display:inline-flex;align-items:center;gap:8px}
.oslink svg{width:18px;height:18px;fill:currentColor;flex:none}
.b .fusepair{display:flex;align-items:center;gap:12px;margin-top:8px}
.b .fusepair img{width:88px;border:2px solid var(--line)}
.b .fusepair .arrow{color:var(--accent-hi);font-family:var(--mono);font-weight:800;font-size:22px}
@media(max-width:940px){.b-6,.b-4,.b-3,.b-8{grid-column:span 12}}

/* ============ light paper band ============ */
.paperband{background:var(--paper);color:var(--ink);padding:84px 0;border-top:6px solid var(--accent);border-bottom:6px solid var(--accent)}
.paperband h2{font-size:clamp(30px,4vw,48px);text-transform:uppercase;color:var(--ink)}
.paperband .lead{color:var(--inkmut);max-width:60ch;margin:14px 0 44px;font-size:17px}
.stepsX{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:3px solid var(--ink)}
.stepX{padding:26px 22px;border-right:3px solid var(--ink);background:var(--paper)}
.stepX:last-child{border-right:0}
.stepX:nth-child(even){background:var(--paper2)}
.stepX .num{font-family:var(--mono);font-weight:800;font-size:44px;color:var(--accent);line-height:1}
.stepX h3{font-size:17px;margin:12px 0 8px;color:var(--ink)}
.stepX p{color:var(--inkmut);font-size:14.5px}
.feeflow{margin-top:44px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:3px solid var(--ink);font-family:var(--mono)}
.fee{padding:20px 22px;border-right:3px solid var(--ink)}
.fee:last-child{border-right:0}
.fee .v{font-weight:800;font-size:26px;color:var(--ink)}
.fee .k{font-size:12.5px;color:var(--inkmut);margin-top:4px}
@media(max-width:940px){.stepsX,.feeflow{grid-template-columns:1fr 1fr}.stepX:nth-child(2),.fee:nth-child(2){border-right:0}.stepX,.fee{border-bottom:3px solid var(--ink)}}

/* ============ grails band ============ */
.grailband{padding:84px 0;background:radial-gradient(ellipse 800px 420px at 50% 0%,rgba(240,204,82,.07),transparent)}
.grailband h2{font-size:clamp(30px,4vw,48px);text-transform:uppercase}
.grailband .lead{color:var(--muted);max-width:60ch;margin:14px 0 40px}
.grailrow{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.grailrow img{border:2px solid var(--line)}
.grailrow img:hover{border-color:var(--gold)}
.grailrow .mystery{aspect-ratio:1;border:2px dashed var(--line);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:30px;color:var(--muted)}
@media(max-width:820px){.grailrow{grid-template-columns:repeat(3,1fr)}}

/* ============ marquee ============ */
.marquee{overflow:hidden;border-top:2px solid var(--line);border-bottom:2px solid var(--line);background:var(--panel);padding:14px 0}
.marquee .track{display:flex;gap:14px;width:max-content;animation:slide 60s linear infinite}
.marquee img{width:110px;height:110px;border:2px solid var(--line)}
@keyframes slide{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee:hover .track{animation-play-state:paused}

/* ============ legacy component set (inner pages) ============ */
.vox{background:var(--panel);border:2px solid var(--line);box-shadow:6px 6px 0 rgba(0,0,0,.42)}
.vox-hi{border-color:var(--accent)}
.btn{display:inline-block;font-family:var(--mono);font-weight:700;font-size:15px;padding:14px 24px;
  border:2px solid var(--accent);cursor:pointer;color:#07130b;background:var(--accent);box-shadow:6px 6px 0 rgba(0,0,0,.42);
  transition:transform .1s,box-shadow .1s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 rgba(0,0,0,.45);text-decoration:none;background:var(--accent-hi)}
.btn.ghost{background:transparent;color:var(--accent-hi)}
.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed;transform:none}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:44px;align-items:center;padding:72px 0 56px}
.hero h1{font-size:clamp(34px,5.2vw,58px);margin-bottom:18px}
.hero h1 em{font-style:normal;color:var(--accent-hi)}
.hero p{color:var(--muted);font-size:17.5px;max-width:46ch;margin-bottom:28px}
.hero .ctas{display:flex;gap:16px;flex-wrap:wrap}
.grid9{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.grid9 img{border:2px solid var(--line);transition:opacity .25s}
@media(max-width:900px){.hero{grid-template-columns:1fr}}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px 0 56px}
.stat{padding:22px 20px}
.stat .n{font-family:var(--mono);font-size:clamp(24px,3vw,36px);font-weight:800}
.stat .n.glow{color:var(--accent-hi)}
.stat .l{color:var(--muted);font-size:13px;margin-top:6px;font-family:var(--mono)}
@media(max-width:820px){.stats{grid-template-columns:repeat(2,1fr)}}
section{padding:56px 0}
.sec-title{font-size:clamp(22px,3vw,30px);margin-bottom:8px}
.sec-sub{color:var(--muted);margin-bottom:32px;max-width:64ch}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step{padding:22px}
.step .k{font-family:var(--mono);color:var(--accent-hi);font-weight:800;font-size:13px;margin-bottom:10px}
.step h3{font-size:17px;margin-bottom:8px}
.step p{color:var(--muted);font-size:14.5px}
@media(max-width:900px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.steps{grid-template-columns:1fr}}
.tables{display:grid;grid-template-columns:repeat(7,1fr);gap:12px}
.tbl{padding:16px 14px;text-align:center}
.tbl .logo,.tbl .badge{width:26px;height:26px;border-radius:50%;margin:0 auto 8px;display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-weight:800;font-size:12px;background:#3a3f4a;color:#e8ecf2}
.tbl .sym{font-family:var(--mono);font-weight:800;font-size:15px}
.tbl .chg{font-family:var(--mono);font-size:13px;margin-top:4px}
.up{color:var(--accent-hi)}.dn{color:var(--red)}
.tbl .seats{color:var(--muted);font-size:12px;margin-top:8px;font-family:var(--mono)}
@media(max-width:900px){.tables{grid-template-columns:repeat(4,1fr)}}
@media(max-width:520px){.tables{grid-template-columns:repeat(2,1fr)}}
.grails{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.grails .card{border:2px solid var(--line)}
.grails .mystery{aspect-ratio:1;background:repeating-linear-gradient(45deg,var(--panel) 0 12px,var(--panel2) 12px 24px);display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:26px;color:var(--muted)}
@media(max-width:820px){.grails{grid-template-columns:repeat(3,1fr)}}
.fuseband{padding:44px 36px;display:flex;align-items:center;gap:36px;flex-wrap:wrap;justify-content:space-between}
.fuseband .big{font-family:var(--mono);font-size:clamp(34px,5vw,54px);font-weight:800}
.fuseband .big span{color:var(--muted);font-size:.55em}
.supplybar{height:12px;background:var(--panel2);border:2px solid var(--line);margin-top:12px;width:min(420px,100%)}
.supplybar i{display:block;height:100%;background:var(--accent);width:100%}
.floor{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.fl{padding:22px}
.fl .head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:14px}
.fl .sym{font-family:var(--mono);font-weight:800;font-size:19px}
.fl .row{display:flex;justify-content:space-between;font-size:14px;color:var(--muted);padding:6px 0;border-top:1px solid var(--line);font-family:var(--mono)}
.fl .row b{color:var(--text)}
@media(max-width:900px){.floor{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.floor{grid-template-columns:1fr}}
.notice{padding:16px 20px;color:var(--muted);font-size:14.5px;border-left:4px solid var(--accent);background:var(--panel);margin:26px 0}
.counter{text-align:center;padding:56px 20px 40px}
.counter .huge{font-family:var(--mono);font-weight:800;font-size:clamp(52px,9vw,110px);line-height:1}
.counter .huge span{color:var(--muted);font-size:.4em}
.feed .item{display:flex;gap:14px;align-items:center;padding:16px;margin-bottom:12px}
.feed img{width:64px;height:64px;border:2px solid var(--line)}
.docs{display:grid;grid-template-columns:220px 1fr;gap:44px;padding:44px 0}
.docs nav{position:sticky;top:84px;align-self:start;display:flex;flex-direction:column;gap:10px}
.docs nav a{color:var(--muted);font-family:var(--mono);font-size:13.5px}
.docs h2{font-size:22px;margin:38px 0 12px;padding-top:8px}
.docs h2:first-child{margin-top:0}
.docs p,.docs li{color:#b8c0cc;font-size:15.5px;margin-bottom:10px}
.docs ul{padding-left:22px}
.docs table{border-collapse:collapse;width:100%;margin:12px 0;font-size:14.5px}
.docs th,.docs td{border:1px solid var(--line);padding:8px 12px;text-align:left;font-family:var(--mono)}
.docs th{color:var(--muted);font-weight:600}
.faq details{border:2px solid var(--line);background:var(--panel);margin-bottom:10px;padding:14px 18px}
.faq summary{cursor:pointer;font-weight:600;font-family:var(--mono);font-size:14.5px}
.faq p{margin-top:10px}
@media(max-width:820px){.docs{grid-template-columns:1fr}.docs nav{position:static;flex-direction:row;flex-wrap:wrap;gap:14px}}
.pick.on{border-color:var(--accent)}

/* ============ footer ============ */
footer{margin-top:88px;background:linear-gradient(180deg,var(--panel) 0%,#0b0e13 100%);
  border-top:1px solid var(--line)}

/* one row: identity anchors the left, links sit tight on the right */
.fbar{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;
  padding:28px 0 18px;flex-wrap:wrap}
.fbrand{display:flex;flex-direction:column;gap:7px}
.fmark{font-family:var(--mono);font-weight:800;font-size:16px;letter-spacing:.07em;
  color:var(--text);text-decoration:none;line-height:1}
.fmark b{color:var(--accent-hi)}
.ftag{color:#5f6874;font-size:12px;line-height:1.5;margin:0;max-width:42ch}
.fnav{display:flex;align-items:center;gap:20px;flex-wrap:wrap;justify-content:flex-end}
.fnav a{color:#8f98a5;font-size:12.5px;text-decoration:none;transition:color .15s}
.fnav a:hover{color:var(--accent-hi)}
.fnav .sep{width:1px;height:11px;background:#2a3038;flex:none}
.fnav a.ext{font-family:var(--mono);font-size:11.5px;letter-spacing:.09em;color:#6d7683}
.fnav a.ext:hover{color:var(--gold)}

/* a gold hairline instead of a hard rule: the only flourish down here */
.frule{height:1px;background:linear-gradient(90deg,rgba(217,178,62,.55),rgba(217,178,62,.10) 38%,transparent 72%)}

/* legal, deliberately quiet and narrow so it reads as fine print */
.ffine{padding:16px 0 0}
.fnote{color:#79818d;font-size:12px;line-height:1.6;margin:0 0 10px;max-width:88ch}
.fnote a{color:#98a0ac;text-decoration:underline;text-underline-offset:3px}
.fnote a:hover{color:var(--accent-hi)}
.disc{color:#4e555f;font-size:10.5px;line-height:1.75;margin:0;max-width:120ch}
.disc b{color:#6d7683;font-weight:700}
.copyline{padding:12px 0 22px;color:#3f4650;font-size:10.5px;font-family:var(--mono);
  letter-spacing:.03em}

@media(max-width:900px){
  .fbar{align-items:flex-start;gap:22px;padding:28px 0 18px}
  .fnav{justify-content:flex-start;gap:16px}
  .fnav .sep{display:none}
}
/* legacy three column footer, kept so nothing breaks if a page still uses it */
.fcols{display:grid;grid-template-columns:1.2fr 1fr 1.6fr;gap:36px;padding:44px 0}
.fcols h4{font-family:var(--mono);font-size:14px;margin-bottom:12px;color:var(--text)}
.fcols p,.fcols a{color:var(--muted);font-size:13.5px}
.fcols .addr{font-family:var(--mono);font-size:12.5px;word-break:break-all}
.fcols ul{list-style:none}
.fcols li{margin-bottom:8px}
@media(max-width:820px){.fcols{grid-template-columns:1fr}}


/* ============ v2 inner pages ============ */
.pagehead{padding:84px 0 30px}
.pagehead .kicker{font-family:var(--mono);color:var(--accent-hi);font-weight:700;font-size:13px;letter-spacing:.22em;margin-bottom:14px}
.pagehead h1{font-size:clamp(38px,5.5vw,72px);text-transform:uppercase}
.pagehead .sub{color:var(--muted);font-size:17px;max-width:56ch;margin-top:16px}
.chiprow{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0 10px}
.tierrow{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin:30px 0 10px}
.tiercard{background:var(--panel);border:2px solid var(--line);padding:22px 18px;text-align:center;position:relative}
.tiercard:hover{border-color:var(--accent)}
.tiercard .mult{font-family:var(--mono);font-weight:800;font-size:38px;color:var(--accent-hi);line-height:1}
.tiercard .nm{font-family:var(--mono);font-size:13px;margin:10px 0 6px}
.tiercard .cost{color:var(--muted);font-size:12.5px;font-family:var(--mono)}
.tiercard.top{border-color:var(--gold)}
.tiercard.top .mult{color:var(--gold)}
@media(max-width:940px){.tierrow{grid-template-columns:repeat(2,1fr)}}
.paperlite{background:var(--paper);color:var(--ink);padding:70px 0;border-top:6px solid var(--accent);border-bottom:6px solid var(--accent)}
.paperlite h2{color:var(--ink);font-size:clamp(26px,3.4vw,40px);text-transform:uppercase}
.paperlite .lead{color:var(--inkmut);margin:12px 0 34px;max-width:60ch}
.paperlite .vox{background:#fff;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--ink);color:var(--ink)}
.paperlite .mintrow{border-bottom:1px solid #cfc8b4;color:var(--inkmut)}
.paperlite .mintrow b{color:var(--accent)}
.paperlite .qty button{background:#fff;border:2px solid var(--ink);color:var(--ink)}
.paperlite .qty .n{color:var(--ink)}
.paperlite .mintnote{color:var(--inkmut)}
.paperlite .step p, .paperlite .step h3{color:var(--ink)}
.paperlite .step .k{color:var(--accent)}
.paperdocs{background:var(--paper);border-top:6px solid var(--accent)}
.paperdocs .docs p,.paperdocs .docs li{color:#3d382c}
.paperdocs .docs h2{color:var(--ink)}
.paperdocs .docs nav a{color:#6e6753}
.paperdocs .docs th,.paperdocs .docs td{border-color:#c9c2ae;color:var(--ink)}
.paperdocs .docs th{color:#6e6753}
.paperdocs .faq details{background:#fff;border:3px solid var(--ink)}
.paperdocs .faq summary{color:var(--ink)}
.paperdocs .faq p{color:#3d382c}
.paperdocs a{color:#1c7a45}
.fusegallery{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:10px}
.fusegallery img{width:100%;border:2px solid var(--line)}
@media(max-width:820px){.fusegallery{grid-template-columns:1fr}}
