/* =========================================================================
   $DENIM — "BLUEPRINT × 402 RECEIPT"
   Deep blueprint-blue ground, white line-art figures + annotations,
   white receipt-paper cards "pinned" on the blue for legible copy.
   Scroll is native + light: background-image on body (no fixed layers),
   no backdrop-filter, transform/opacity animation only.
   ========================================================================= */

:root{
  --bg:#0c2f6e;              /* blueprint page surface (also "show-through" in tears/holes) */
  --paper:#FFFFFF;           /* receipt card */
  --ink:#0B0D12;
  --blue:#0052FF;            /* Base-blue accent */
  --red:#E5484D;
  --slate:#6B7280;
  --on-blue:#EAF1FF;         /* headings on the blue */
  --cyan:#A9C4FF;            /* line-art + secondary text on blue */
  --wgrid:rgba(255,255,255,.10);
  --wgrid2:rgba(255,255,255,.055);
  --ink-08:rgba(11,13,18,.08);
  --ink-12:rgba(11,13,18,.12);
  --ink-05:rgba(11,13,18,.05);
  --radius:4px;
  --mono:'Space Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --disp:'Space Grotesk',system-ui,sans-serif;
  --body:'Inter',system-ui,sans-serif;
  --maxw:1280px;
  --rcptw:900px;
  --headw:840px;
  --shadow:6px 7px 0 rgba(4,16,46,.55);
  --shadow-sm:4px 4px 0 rgba(4,16,46,.5);
  --shadow-ink:5px 6px 0 var(--ink);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip;max-width:100%}
body{
  margin:0;color:var(--on-blue);position:relative;z-index:0;
  font-family:var(--body);font-size:17px;line-height:1.55;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
  background-color:var(--bg);
  /* cheap, NON-fixed blueprint graph grid (scrolls with content) + top glow */
  background-image:
    linear-gradient(var(--wgrid) 1px,transparent 1px),
    linear-gradient(90deg,var(--wgrid) 1px,transparent 1px),
    linear-gradient(var(--wgrid2) 1px,transparent 1px),
    linear-gradient(90deg,var(--wgrid2) 1px,transparent 1px),
    linear-gradient(180deg,#17499f 0,#0c2f6e 780px);
  background-size:140px 140px,140px 140px,28px 28px,28px 28px,100% 100%;
  background-repeat:repeat,repeat,repeat,repeat,no-repeat;
  background-position:center top;
}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
b{font-weight:700}
.mono{font-family:var(--mono)}
.tk{font-weight:700;letter-spacing:.01em}

/* ---------- section heads (on blue) ---------- */
.sec-head{max-width:var(--headw);margin:0 auto 42px;padding:0 16px;text-align:center}
.sec-no{display:inline-block;font-family:var(--mono);font-size:12px;font-weight:700;
  letter-spacing:.18em;color:#fff;border:1.5px solid rgba(255,255,255,.55);border-radius:2px;
  padding:5px 12px;margin-bottom:20px;background:rgba(0,82,255,.35)}
.sec-title{font-family:var(--disp);font-weight:700;font-size:clamp(30px,5.2vw,52px);
  line-height:1.03;letter-spacing:-.022em;margin:0 0 14px;color:#fff}
.sec-sub{margin:0 auto;max-width:56ch;color:var(--cyan);font-size:16.5px}

/* corner registration ticks */
.tick{position:absolute;width:13px;height:13px;z-index:3;pointer-events:none}
.tick::before,.tick::after{content:"";position:absolute;background:var(--blue)}
.tick::before{width:13px;height:1.5px;top:0;left:0}
.tick::after{width:1.5px;height:13px;top:0;left:0}
.tick-tl{top:-7px;left:-7px}
.tick-tr{top:-7px;right:-7px;transform:scaleX(-1)}
.tick-bl{bottom:-7px;left:-7px;transform:scaleY(-1)}
.tick-br{bottom:-7px;right:-7px;transform:scale(-1)}

/* ---------- receipt card (white paper pinned on blue) ---------- */
.rcpt{position:relative;background:var(--paper);color:var(--ink);border:2px solid var(--ink);
  border-radius:var(--radius);box-shadow:var(--shadow)}
.rcpt-head,.rcpt-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:14px 22px;font-family:var(--mono);font-size:12.5px;letter-spacing:.06em}
.rcpt-head{background:var(--ink);color:#fff}
.rcpt-head .tk{color:#fff}
.rcpt-status b{color:#fff;background:var(--blue);border-radius:2px;padding:0 5px}
.rcpt-dot{width:10px;height:10px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 2px #fff}
.rcpt-foot{color:var(--slate);border-top:1.5px dashed var(--ink-12)}
.perf{position:relative;height:0;border-top:2px dashed var(--ink);margin:0}
.perf::before,.perf::after{content:"";position:absolute;top:-10px;width:18px;height:18px;border-radius:50%;
  background:var(--bg);border:2px solid var(--ink)}
.perf::before{left:-11px}
.perf::after{right:-11px}
.dots{flex:1;min-width:14px;align-self:flex-end;margin:0 8px 6px;border-bottom:2px dotted var(--ink-12)}

/* ---------- blueprint figure (line-art in the wide margins) ---------- */
.field{display:grid;grid-template-columns:1fr minmax(0,var(--rcptw)) 1fr;gap:clamp(14px,2.2vw,32px);
  align-items:center;max-width:var(--maxw);margin:0 auto;padding:0 clamp(16px,4vw,34px)}
.figure{display:flex;flex-direction:column;align-items:center;gap:14px;color:var(--cyan);padding:12px 4px;min-width:0}
.fig-label{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.14em;color:#fff;
  border:1px solid rgba(255,255,255,.4);border-radius:2px;padding:3px 9px}
.fig-svg{width:100%;max-width:168px;height:auto;overflow:visible}
.fig-svg text{stroke:none;fill:currentColor}
.fig-svg .dim{stroke:var(--cyan)}
.figt{font-family:var(--mono);font-size:8.5px;font-weight:700;letter-spacing:.06em;text-anchor:middle}
.dimt{font-family:var(--mono);font-size:7px;letter-spacing:.04em;text-anchor:middle;fill:var(--cyan)}
.figbig{font-family:var(--disp);font-size:30px;font-weight:700;text-anchor:middle}
.figstamp{font-family:var(--mono);font-size:13px;font-weight:700;fill:#fff}
.fig-notes{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:7px;width:100%;max-width:168px}
.fig-notes li{font-family:var(--mono);font-size:11.5px;color:#fff;border-left:2px solid #fff;padding-left:9px}

/* ---------- NAV (solid, no backdrop-filter) ---------- */
.nav{position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:12px clamp(16px,4vw,38px);background:rgba(10,42,102,.95);
  border-bottom:1.5px solid rgba(255,255,255,.12)}
.nav-logo{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:700;font-size:20px;color:#fff}
.nav-patch{width:34px;height:34px;border:1.5px solid rgba(255,255,255,.5);border-radius:6px;background:#fff}
.nav-links{display:flex;gap:4px}
.nav-links a{font-family:var(--mono);font-size:13px;letter-spacing:.02em;color:var(--cyan);
  padding:7px 12px;border-radius:3px;transition:background .15s,color .15s}
.nav-links a:hover{color:#fff;background:rgba(255,255,255,.08)}
.chip{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:12.5px;font-weight:700;
  color:#fff;border:1.5px solid rgba(255,255,255,.5);border-radius:999px;padding:6px 13px 6px 7px;
  background:rgba(255,255,255,.06);white-space:nowrap}
.chip svg{width:19px;height:19px}

/* floating buy pill */
.buy-pill{position:fixed;right:18px;bottom:18px;z-index:45;display:flex;align-items:center;gap:8px;
  font-family:var(--disp);font-weight:700;font-size:15px;color:#fff;background:var(--blue);
  border:2px solid var(--ink);border-radius:999px;padding:11px 18px;box-shadow:var(--shadow-sm);
  opacity:0;transform:translateY(16px) scale(.95);pointer-events:none;transition:opacity .25s,transform .25s}
.buy-pill.show{opacity:1;transform:none;pointer-events:auto}
.buy-pill .tk{color:#fff;text-decoration:underline;text-underline-offset:.15em}
.code402{font-family:var(--mono);font-weight:700;background:#fff;color:var(--blue);
  border-radius:3px;padding:1px 6px;font-size:.85em;letter-spacing:.02em}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:pointer;
  font-family:var(--disp);font-weight:700;font-size:15.5px;border-radius:4px;padding:13px 20px;
  border:2px solid var(--ink);background:#fff;color:var(--ink);box-shadow:var(--shadow-ink);
  transition:transform .14s,box-shadow .14s}
.btn:hover{transform:translate(-1px,-1px);box-shadow:6px 7px 0 var(--ink)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn-pay{background:var(--blue);color:#fff}
.btn-pay .code402{background:#fff;color:var(--blue)}
.btn-mega{font-size:20px;padding:18px 32px}
.btn-ghost{background:#fff;font-size:13.5px;padding:10px 15px;font-family:var(--mono);font-weight:700}
.btn-ca{font-family:var(--mono);font-weight:700;font-size:13.5px;background:#fff;gap:7px;padding:12px 15px}
.btn .ico{width:18px;height:18px}
.tba{font-family:var(--mono);font-size:10px;font-weight:700;letter-spacing:.08em;background:var(--blue);
  color:var(--ink);border-radius:2px;padding:2px 5px;margin-left:2px}

.social-row{display:flex;gap:10px;flex-wrap:wrap}
.soc{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:13px;font-weight:700;
  color:var(--ink);border:1.5px solid var(--ink);border-radius:3px;padding:8px 12px;background:#fff;transition:background .15s}
.soc svg{width:16px;height:16px}
.soc:hover{background:var(--blue);color:#fff}
.soc.disabled{opacity:.42;pointer-events:none}

/* ---------- HERO ---------- */
.hero{padding:52px 0 12px}
.hero-rcpt{width:100%}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:20px;padding:34px clamp(22px,3vw,44px) 38px;align-items:center}
.h1{font-family:var(--disp);font-weight:700;font-size:clamp(40px,6vw,76px);line-height:.98;
  letter-spacing:-.035em;margin:0 0 20px;color:var(--ink)}
.stamp-404,.stamp-402{display:inline-block;font-family:var(--mono);font-weight:700;letter-spacing:-.02em;
  border:3px solid;border-radius:6px;padding:0 10px;transform:rotate(-3deg);line-height:1}
.stamp-404{color:var(--red);border-color:var(--red)}
.stamp-402{color:#fff;border-color:var(--blue);background:var(--blue);transform:rotate(2deg)}
.lede{font-size:17px;color:var(--slate);max-width:44ch;margin:0 0 24px}
.lede b{color:var(--ink)}
.lineitems{border-top:1.5px dashed var(--ink-12);padding-top:16px;margin-bottom:26px}
.li{display:flex;align-items:flex-end;gap:2px;font-size:13.5px;font-family:var(--mono);color:var(--slate);padding:5px 0}
.li>span:first-child{letter-spacing:.08em}
.li .mono{color:var(--ink);font-size:13.5px}
.li .tk{color:var(--blue)}
.li-total{margin-top:6px;padding-top:11px;border-top:2px solid var(--ink)}
.li-total span{font-weight:700}
.li-total .mono{font-size:18px;color:var(--ink)}
.li-total small{color:var(--slate);font-size:11px;font-weight:400}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px}

/* AGENT UNIT — mini blueprint inside the white hero card */
.unit{position:relative;margin:0;justify-self:center;width:min(100%,340px);aspect-ratio:1;
  display:grid;place-items:center;border:1.5px solid var(--blue);border-radius:6px;background:
    linear-gradient(90deg,rgba(0,82,255,.08) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(rgba(0,82,255,.08) 1px,transparent 1px) 0 0/30px 30px}
.unit-label{position:absolute;top:-10px;left:14px;background:var(--paper);padding:0 8px;
  font-size:10.5px;font-weight:700;letter-spacing:.14em;color:var(--blue)}
.dim{position:absolute;font-size:9.5px;color:var(--blue);letter-spacing:.08em}
.dim-top{top:6px;left:50%;transform:translateX(-50%);padding:0 6px;background:var(--paper)}
.dim-top::before,.dim-top::after{content:"";position:absolute;top:50%;width:46px;height:1px;background:var(--blue)}
.dim-top::before{right:100%}.dim-top::after{left:100%}
.dim-side{bottom:7px;left:50%;transform:translateX(-50%);padding:0 6px;background:var(--paper)}
.seal-ring{position:absolute;width:86%;max-width:244px;aspect-ratio:1;animation:spin 26s linear infinite}
.seal-ring svg{width:100%;height:100%}
.seal-text{font-family:var(--mono);font-size:12.5px;font-weight:700;letter-spacing:.14em;fill:var(--ink)}
.seal-patch{width:64%;max-width:220px;height:auto;position:relative;z-index:2;
  filter:drop-shadow(2px 3px 0 rgba(11,13,18,.16))}
.bob{animation:bob 4.6s ease-in-out infinite}
.paid-stamp{position:absolute;right:8%;bottom:14%;z-index:3;font-family:var(--mono);font-weight:700;
  color:var(--blue);border:3px double var(--blue);border-radius:6px;padding:3px 10px;
  transform:rotate(-14deg);letter-spacing:.1em;background:rgba(255,255,255,.72);font-size:17px}
.callouts{position:absolute;inset:0;list-style:none;margin:0;padding:0}
.co{position:absolute;font-size:10px;color:var(--ink);background:var(--paper);
  border-left:2px solid var(--blue);padding:2px 6px;white-space:nowrap}
.co1{top:12%;left:-5%}.co2{top:30%;right:-7%}
.co3{bottom:26%;left:-6%}.co4{bottom:9%;right:-5%}

.scroll-hint{text-align:center;font-family:var(--mono);font-size:12.5px;color:var(--cyan);
  letter-spacing:.06em;margin:26px 0 6px;animation:nudge 1.8s ease-in-out infinite}

/* ---------- ticker strip ---------- */
.strip{overflow:hidden;contain:layout paint;background:var(--ink);color:#fff;border-top:2px solid var(--ink);
  border-bottom:2px solid var(--ink);padding:12px 0;margin:36px 0;white-space:nowrap}
.strip-b{background:var(--blue);color:#fff;border-color:var(--ink)}
.strip-track{display:inline-flex;align-items:center;gap:26px;font-family:var(--mono);font-weight:700;
  font-size:14.5px;letter-spacing:.05em;will-change:transform;animation:marq 26s linear infinite}
.strip-track span{display:inline-block}
.strip .tk{color:#fff;text-decoration:underline;text-underline-offset:.15em}
.strip-b .tk{color:#fff}
.strip-track i{color:rgba(255,255,255,.55);font-style:normal}
.strip-b .strip-track i{color:rgba(255,255,255,.6)}

/* ---------- 01 HANDSHAKE ---------- */
.handshake{padding:44px 0}
.schematic{position:relative;max-width:1060px;margin:0 auto 30px;padding:34px 24px 24px;
  border:1.5px solid rgba(255,255,255,.35);border-radius:6px;background:rgba(255,255,255,.04)}
.schem-cap{position:absolute;top:-10px;left:18px;background:var(--bg);padding:0 8px;
  font-size:11px;font-weight:700;letter-spacing:.1em;color:#fff}
.flow{display:flex;align-items:stretch;justify-content:center;gap:0;flex-wrap:wrap}
.node{position:relative;flex:1;min-width:120px;max-width:180px;text-align:center;
  border:1.5px solid var(--ink);border-radius:4px;background:#fff;color:var(--ink);padding:14px 10px;
  box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:3px;align-items:center}
.node .node-k{font-size:9.5px;font-weight:700;letter-spacing:.1em;color:var(--slate)}
.node b{font-family:var(--disp);font-size:22px;line-height:1}
.node small{font-size:10.5px;color:var(--slate)}
.node-402{border-color:var(--ink);background:var(--blue)}
.node-402 b{color:#fff}
.node-402 .node-k,.node-402 small{color:rgba(255,255,255,.8)}
.node-out b{color:var(--blue)}
.wire{flex:0 0 40px;align-self:center;height:2px;background:rgba(255,255,255,.5);position:relative}
.wire::after{content:"";position:absolute;right:-1px;top:50%;transform:translateY(-50%);
  border-left:7px solid rgba(255,255,255,.5);border-top:5px solid transparent;border-bottom:5px solid transparent}
.node.lit{box-shadow:5px 5px 0 var(--blue);border-color:var(--blue)}
.wire.lit{background:#fff}
.wire.lit::after{border-left-color:#fff}
.flow-branch{margin-top:18px;text-align:center}
.branch-x{display:inline-block;font-size:12.5px;color:#fff;border:1.5px dashed var(--red);
  border-radius:4px;padding:6px 14px;background:rgba(229,72,77,.18)}
.branch-x .r{color:#ff9ea0}
.r{color:var(--red)}.g{color:var(--blue)}

.hs-field{align-items:stretch}
.terminal{width:100%;border:2px solid var(--ink);border-radius:6px;overflow:hidden;box-shadow:var(--shadow);align-self:center}
.term-bar{display:flex;align-items:center;gap:7px;background:var(--ink);padding:11px 15px}
.tdot{width:11px;height:11px;border-radius:50%;background:#4a4d57}
.tdot:nth-child(1){background:var(--red)}
.tdot:nth-child(2){background:#E6B23D}
.tdot:nth-child(3){background:var(--blue)}
.term-title{color:#aeb2bd;font-size:12.5px;margin-left:8px}
.term-body{background:#0a1430;padding:24px clamp(18px,3vw,30px);font-family:var(--mono);font-size:14.5px;
  line-height:2.05;color:#cdd7f0;min-height:250px}
.tline{opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}
.tline.show{opacity:1;transform:none}
.tline .pre{color:#fff;font-weight:700}
.tline .cmd{color:#8ab0ff;font-weight:700}
.tline .arr{color:var(--cyan)}
.tline .muted{color:#7f8db5;font-size:13px}
.tline .tag{background:#2b3a66;color:#c4cff0;border-radius:3px;padding:1px 6px;font-size:12px}
.tline .ok{color:#fff;font-weight:700}
.tline .usdc{color:#8ab0ff;font-weight:700}
.tline b.r{color:#ff8a8d}
.tline b.g{color:#fff}
.mint-amt,.mint-amt .tk{color:#fff;font-weight:700}
.tcursor{opacity:1;transform:none}
.cursor{color:#fff;animation:blink 1s step-end infinite}
.term-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;
  background:#0a1430;border-top:1.5px solid #1d2a52;padding:13px 17px}
.steps-dots{display:flex;gap:7px}
.sdot{width:9px;height:9px;border-radius:50%;background:#26335c;border:1.5px solid #38477a;transition:background .2s,border-color .2s}
.sdot.on{background:#fff;border-color:#fff}
.btn-replay{background:transparent;color:#aeb8d8;border-color:#38477a;box-shadow:none}
.btn-replay:hover{background:#13204a;transform:none;box-shadow:none;color:#fff}

/* ---------- 02 GATE ---------- */
.gate{max-width:var(--maxw);margin:0 auto;padding:36px clamp(16px,4vw,34px)}
.decision{display:flex;flex-direction:column;align-items:center;margin-bottom:8px}
.dec-in{font-size:13px;color:var(--cyan)}
.dec-node{position:relative;margin-top:14px;font-size:14px;font-weight:700;color:var(--ink);
  border:1.5px solid #fff;border-radius:4px;padding:8px 18px;background:var(--blue);color:#fff}
.dec-node::before{content:"";position:absolute;top:-14px;left:50%;width:2px;height:14px;background:rgba(255,255,255,.6)}
.dec-node::after{content:"";position:absolute;bottom:-28px;left:16%;right:16%;height:28px;
  border:2px solid rgba(255,255,255,.4);border-top:none;border-radius:0 0 8px 8px}
.gate-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:1000px;margin:52px auto 0}
.gcard{position:relative;border:2px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);
  padding:30px;box-shadow:var(--shadow)}
.gcard-pass{box-shadow:6px 7px 0 var(--blue)}
.gcard-fail{box-shadow:6px 7px 0 var(--red)}
.gcard-part{position:absolute;top:-11px;right:16px;background:var(--bg);padding:2px 8px;font-size:10px;
  font-weight:700;letter-spacing:.12em;color:var(--cyan)}
.gcard-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.gcode{font-family:var(--mono);font-weight:700;font-size:46px;line-height:1}
.gstamp{font-family:var(--mono);font-weight:700;font-size:14px;letter-spacing:.08em;
  border:2.5px solid;border-radius:5px;padding:5px 12px;transform:rotate(5deg)}
.gstamp-pass{color:#fff;border-color:var(--blue);background:var(--blue)}
.gstamp-fail{color:var(--red);border-color:var(--red);transform:rotate(-6deg)}
.gcard h3{font-family:var(--disp);font-size:27px;margin:0 0 4px}
.gcard-sub{color:var(--slate);font-size:15px;margin:0 0 18px}
.glist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.glist li{font-size:16px;padding-left:28px;position:relative}
.glist li::before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:700}
.glist-x li::before{content:"✕";color:var(--red)}
.glist .tk{color:var(--blue)}

/* ---------- 03 PRICING — 5 wide price-tag tiers ---------- */
.pricing{max-width:var(--maxw);margin:0 auto;padding:40px clamp(16px,4vw,34px)}
.tiers{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.tier{position:relative;border:2px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);
  padding:40px 16px 18px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;align-items:center;
  text-align:center;transition:transform .14s,box-shadow .14s}
.tier:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.tier-first{box-shadow:5px 6px 0 var(--blue)}
.tier-last{box-shadow:5px 6px 0 var(--blue)}
.grommet{position:absolute;top:14px;left:50%;transform:translateX(-50%);width:16px;height:16px;border-radius:50%;
  background:var(--bg);border:2px solid var(--ink)}
.tier-band{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--slate)}
.tier-price{font-family:var(--disp);font-weight:700;font-size:clamp(38px,4vw,56px);line-height:1;color:var(--blue);margin:4px 0 2px}
.tier-per{font-size:11px;color:var(--slate);margin-bottom:12px}
.perf-sm{width:100%;border-top-width:1.5px}
.perf-sm::before,.perf-sm::after{display:none}
.tier-meta{width:100%;margin:14px 0 0;display:flex;flex-direction:column;gap:9px}
.tier-meta div{display:flex;justify-content:space-between;gap:8px;font-size:11.5px}
.tier-meta dt{color:var(--slate);letter-spacing:.06em}
.tier-meta dd{margin:0;font-weight:700;color:var(--ink)}
.tier-stamp{margin-top:14px;font-family:var(--mono);font-weight:700;font-size:9.5px;letter-spacing:.04em;
  color:#fff;background:var(--blue);border:1.5px solid var(--blue);border-radius:3px;padding:3px 7px;transform:rotate(-3deg)}
.tier-stamp-cap{color:var(--red);background:#fff;border-color:var(--red);transform:rotate(3deg)}
.capbar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:4px 10px;margin-top:26px;
  border:2px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);padding:16px 22px;
  box-shadow:var(--shadow-sm);font-family:var(--mono);font-size:13.5px}
.capbar-k{color:var(--slate);letter-spacing:.06em;font-weight:700}
.capbar-v{color:var(--ink);font-weight:700}
.capbar-v .tk{color:var(--blue)}
.capbar .dots{min-width:20px;margin-bottom:5px}
.capbar-sep{flex:0 0 100%;height:0}

/* ---------- 04 SPECS — wide title-block sheet ---------- */
.specs{max-width:var(--maxw);margin:0 auto;padding:40px clamp(16px,4vw,34px)}
.sheet{position:relative;border:2px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);box-shadow:var(--shadow);overflow:hidden}
.sheet-head{display:flex;justify-content:space-between;align-items:center;gap:10px;background:var(--ink);color:#fff;padding:14px 22px;font-size:12.5px;letter-spacing:.06em;font-family:var(--mono)}
.sheet-head .tk{color:#fff}
.sheet-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.cell{padding:22px 24px;border-right:1.5px solid var(--ink-12);border-bottom:1.5px solid var(--ink-12);
  display:flex;flex-direction:column;gap:5px;min-height:118px}
.cell:nth-child(3n){border-right:none}
.cell small{font-size:11px;letter-spacing:.1em;color:var(--slate);font-weight:700}
.cell b{font-family:var(--mono);font-size:24px;line-height:1.1;color:var(--ink)}
.cell b .tk{color:var(--blue)}
.cell span{font-size:13px;color:var(--slate)}
.cell span b{font-family:var(--body);font-size:13px;color:var(--ink)}
.cell-hi{background:rgba(0,82,255,.08)}
.cell-hi b{color:var(--blue)}
.titleblock{display:grid;grid-template-columns:repeat(6,1fr);border-top:2px solid var(--ink)}
.tb-cell{padding:12px 14px;border-right:1.5px solid var(--ink-12);font-size:14px;font-weight:700;font-family:var(--mono)}
.tb-cell:last-child{border-right:none}
.tb-cell small{display:block;font-size:9px;letter-spacing:.1em;color:var(--slate);font-weight:700;margin-bottom:4px}
.tb-cell .tk{color:var(--blue);font-size:13px}

/* ---------- 05 HOW ---------- */
.how{max-width:var(--maxw);margin:0 auto;padding:40px clamp(16px,4vw,34px)}
.steps{display:flex;align-items:stretch;justify-content:center;gap:0;flex-wrap:wrap;max-width:1080px;margin:0 auto}
.step{position:relative;flex:1;min-width:230px;border:2px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);
  padding:30px 24px 24px;box-shadow:var(--shadow-sm)}
.step-no{position:absolute;top:-15px;left:20px;background:var(--blue);color:#fff;font-size:15px;font-weight:700;
  border:2px solid var(--ink);border-radius:4px;padding:3px 11px}
.step h3{font-family:var(--disp);font-size:21px;margin:8px 0 10px}
.step p{font-size:15.5px;color:var(--slate);margin:0 0 18px}
.step p b{color:var(--ink)}
.step p .tk{color:var(--blue)}
.step-tag{display:inline-block;font-size:11.5px;font-weight:700;color:var(--blue);
  border:1.5px solid var(--blue);border-radius:3px;padding:3px 10px;background:rgba(0,82,255,.06)}
.step-wire{flex:0 0 46px;align-self:center;height:2px;background:rgba(255,255,255,.5);position:relative}
.step-wire::after{content:"";position:absolute;right:-1px;top:50%;transform:translateY(-50%);
  border-left:8px solid rgba(255,255,255,.5);border-top:6px solid transparent;border-bottom:6px solid transparent}
.big-cta{text-align:center;margin-top:40px}

/* ---------- How-to-mint: scroll-driven numbered sequence ----------
   Base.org "Use Cases"-inspired staggered reveal, re-rendered in our
   blueprint/receipt language. Pure IntersectionObserver + CSS: no scroll
   listener, GPU transform/opacity only. One-shot on section enter.        */
.how .steps{--seq:0s}
/* resting (pre-reveal) states */
.how .step{opacity:0;transform:translateY(28px) scale(.982);will-change:transform,opacity}
.how .step-no{opacity:0;transform:scale(.55) rotate(-9deg);transform-origin:left center}
.how .step-tag{opacity:0;transform:translateY(8px)}
.how .step::before{content:"";position:absolute;left:-2px;right:-2px;top:-2px;height:3px;border-radius:6px 6px 0 0;
  background:linear-gradient(90deg,var(--blue),rgba(0,82,255,0));transform:scaleX(0);transform-origin:left center;pointer-events:none}
.how .step-wire{overflow:visible}
.how .wire-fill{position:absolute;inset:0;background:var(--blue);border-radius:2px;transform:scaleX(0);transform-origin:left center}
.how .step-wire::after{opacity:0}
/* --- sequence fires (JS adds .seq-go) --- */
.how .steps.seq-go .step{opacity:1;transform:none;transition:opacity .6s ease,transform .72s cubic-bezier(.22,1,.36,1)}
.how .steps.seq-go .step::before{transform:scaleX(1);transition:transform .7s cubic-bezier(.16,1,.3,1)}
.how .steps.seq-go .step-no{opacity:1;transform:none;transition:opacity .35s ease,transform .55s cubic-bezier(.34,1.56,.64,1)}
.how .steps.seq-go .step-tag{opacity:1;transform:none;transition:opacity .4s ease,transform .5s cubic-bezier(.22,1,.36,1)}
.how .steps.seq-go .wire-fill{transform:scaleX(1);transition:transform .52s cubic-bezier(.65,0,.35,1)}
.how .steps.seq-go .step-wire::after{opacity:1;transition:opacity .25s ease}
/* --- stagger (children order: step,wire,step,wire,step) --- */
.how .steps.seq-go .step:nth-child(1){transition-delay:.04s}
.how .steps.seq-go .step:nth-child(1)::before{transition-delay:.12s}
.how .steps.seq-go .step:nth-child(1) .step-no{transition-delay:.20s}
.how .steps.seq-go .step:nth-child(1) .step-tag{transition-delay:.34s}
.how .steps.seq-go .step-wire:nth-child(2) .wire-fill{transition-delay:.30s}
.how .steps.seq-go .step-wire:nth-child(2)::after{transition-delay:.78s}
.how .steps.seq-go .step:nth-child(3){transition-delay:.40s}
.how .steps.seq-go .step:nth-child(3)::before{transition-delay:.48s}
.how .steps.seq-go .step:nth-child(3) .step-no{transition-delay:.56s}
.how .steps.seq-go .step:nth-child(3) .step-tag{transition-delay:.70s}
.how .steps.seq-go .step-wire:nth-child(4) .wire-fill{transition-delay:.66s}
.how .steps.seq-go .step-wire:nth-child(4)::after{transition-delay:1.14s}
.how .steps.seq-go .step:nth-child(5){transition-delay:.76s}
.how .steps.seq-go .step:nth-child(5)::before{transition-delay:.84s}
.how .steps.seq-go .step:nth-child(5) .step-no{transition-delay:.92s}
.how .steps.seq-go .step:nth-child(5) .step-tag{transition-delay:1.06s}

/* =========================================================================
   How-to-mint: continuously-LOOPING blueprint micro-illustrations
   Base.org "Use Cases" cards feel alive at rest (bars fill, nodes pulse,
   pips flow). Re-rendered in OUR blueprint/receipt language: a small dark
   blueprint panel (#0c2f6e) with white + Base-blue line-art per step.
   Pure CSS keyframes, transform/opacity only. No JS, no scroll, no libs.
   prefers-reduced-motion: every loop freezes to a completed static state.
   ========================================================================= */
.step-fig{margin:2px 0 16px;padding:0}
.step-fig .sfig{display:block;width:100%;height:auto;background:var(--bg);
  border:1.5px solid var(--ink);border-radius:5px;padding:6px 8px;box-sizing:border-box;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.sfig-cap{display:block;margin-top:6px;font-size:10px;font-weight:700;letter-spacing:.12em;
  color:var(--slate);text-align:left}
.sfig text{font-family:var(--mono);font-weight:700}
.sf-st402,.sf-st200 text{font-size:15px}
.sf-stamp-t{font-size:12px;letter-spacing:.04em}
.sf-coin-t{font-size:12px}
.sf-paid{font-size:9px;letter-spacing:.14em}
.sf-ok{font-size:8px;letter-spacing:.1em}

@media (prefers-reduced-motion:no-preference){
  /* --- FIG.01 agent-ID: node pulse + scan sweep + pip flow + gate check --- */
  .sf-pulse{transform-box:fill-box;transform-origin:center;animation:sfPulse 2.6s ease-in-out infinite}
  .sf-scan{animation:sfScan 2.6s cubic-bezier(.45,0,.55,1) infinite}
  .sf-pip{animation:sfPip 2.6s ease-in infinite}
  .sf-check{stroke-dasharray:46;stroke-dashoffset:46;animation:sfDraw 2.6s ease-out infinite}
  .sf-gate-glow{transform-box:fill-box;transform-origin:center;animation:sfGlow 2.6s ease-in-out infinite}
  .sf-row{transform-box:fill-box;transform-origin:left center;animation:sfRow 2.6s ease-out infinite}
  .sf-row.r2{animation-delay:.12s}
  .sf-row.r3{animation-delay:.24s}
  /* --- FIG.02 voucher: signature draws, stamp presses, anchors blink --- */
  .sf-sign{stroke-dasharray:180;stroke-dashoffset:180;animation:sfDraw2 3.4s ease-in-out infinite}
  .sf-stamp{transform-box:fill-box;transform-origin:196px 47px;transform:scale(1.6);opacity:0;
    animation:sfStamp 3.4s ease-out infinite}
  .sf-anchor{transform-box:fill-box;transform-origin:center;animation:sfBlink 3.4s steps(1,end) infinite}
  .sf-anchor.a2{animation-delay:1.7s}
  /* --- FIG.03 x402: coin travels, bar fills, status flips 402->200 --- */
  .sf-coin{animation:sfCoin 3s cubic-bezier(.5,0,.5,1) infinite}
  .sf-fill{transform-box:fill-box;transform-origin:left center;transform:scaleX(0);
    animation:sfFill 3s cubic-bezier(.5,0,.5,1) infinite}
  .sf-paid{opacity:0;animation:sfPaid 3s ease-out infinite}
  .sf-st402{animation:sfFlipOut 3s steps(1,end) infinite}
  .sf-st200{opacity:0;animation:sfFlipIn 3s steps(1,end) infinite}
}
@keyframes sfPulse{0%,100%{opacity:.15;transform:scale(.82)}45%{opacity:.85;transform:scale(1.12)}}
@keyframes sfScan{0%{transform:translateY(0);opacity:0}8%{opacity:.9}60%{transform:translateY(54px);opacity:.9}72%,100%{transform:translateY(54px);opacity:0}}
@keyframes sfPip{0%{transform:translateX(0);opacity:0}55%{opacity:0}62%{opacity:1}100%{transform:translateX(28px);opacity:1}}
@keyframes sfDraw{0%,62%{stroke-dashoffset:46}86%,100%{stroke-dashoffset:0}}
@keyframes sfGlow{0%,60%{opacity:0}80%{opacity:.6}100%{opacity:.25}}
@keyframes sfRow{0%{transform:scaleX(0);opacity:.2}30%,100%{transform:scaleX(1);opacity:1}}
@keyframes sfDraw2{0%{stroke-dashoffset:180}60%{stroke-dashoffset:0}88%{stroke-dashoffset:0}100%{stroke-dashoffset:180}}
@keyframes sfStamp{0%,46%{transform:scale(1.6);opacity:0}60%{transform:scale(.92);opacity:1}66%{transform:scale(1.04)}72%{transform:scale(1)}92%{transform:scale(1);opacity:1}100%{transform:scale(1);opacity:0}}
@keyframes sfBlink{0%,92%{opacity:1}96%{opacity:.25}}
@keyframes sfCoin{0%{transform:translateX(24px);opacity:0}10%{opacity:1}52%{transform:translateX(192px);opacity:1}58%{opacity:0}100%{transform:translateX(192px);opacity:0}}
@keyframes sfFill{0%,8%{transform:scaleX(0)}55%{transform:scaleX(1)}92%{transform:scaleX(1)}100%{transform:scaleX(0)}}
@keyframes sfPaid{0%,55%{opacity:0}66%{opacity:1}92%{opacity:1}100%{opacity:0}}
@keyframes sfFlipOut{0%,52%{opacity:1}55%,100%{opacity:0}}
@keyframes sfFlipIn{0%,52%{opacity:0}55%,95%{opacity:1}100%{opacity:0}}

/* ---------- 06 STAMP WALL ---------- */
.wall{max-width:var(--maxw);margin:0 auto;padding:40px clamp(16px,4vw,34px)}
.board{position:relative;height:580px;max-width:1180px;margin:0 auto;border:2px solid var(--ink);border-radius:8px;
  background:radial-gradient(var(--ink-08) 1px,transparent 1.4px) 0 0/22px 22px,var(--paper);box-shadow:var(--shadow);
  overflow:hidden;contain:layout paint}
.stk{position:absolute;left:var(--x);top:var(--y);transform:translate(var(--tx,0),var(--ty,0)) rotate(var(--r));
  cursor:grab;z-index:2;transition:box-shadow .15s;touch-action:none;user-select:none;color:var(--ink)}
.stk.dragging{cursor:grabbing;z-index:20}
.polaroid{background:#fff;border:2px solid var(--ink);border-radius:4px;padding:8px 8px 4px;width:200px;box-shadow:var(--shadow-sm)}
.polaroid .pframe{border:1.5px solid var(--ink);border-radius:2px;overflow:hidden;background:#eef2fb}
.polaroid img{width:100%;display:block}
.polaroid figcaption{font-size:11px;padding:7px 2px 3px;text-align:center;letter-spacing:.04em;color:var(--slate)}
.diecut{width:180px;filter:drop-shadow(2px 3px 0 rgba(11,13,18,.18))}
.stamp{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
  width:160px;height:160px;border:3px solid var(--ink);border-radius:8px;background:#fff;font-family:var(--mono);font-weight:700;box-shadow:var(--shadow-sm)}
.stamp span{font-size:26px;line-height:1.05;letter-spacing:.02em}
.stamp small{font-size:9px;font-weight:400;color:var(--slate);margin-top:6px;padding:0 6px}
.st-base{background:var(--blue);border-color:var(--ink);color:#fff}
.st-base small{color:rgba(255,255,255,.8)}
.st-blue{background:var(--blue);color:#fff;border-color:var(--ink)}
.st-blue span{color:#fff}
.st-red{border-color:var(--red);color:var(--red)}
.st-ink{background:var(--ink);color:#fff}
.st-ink span{color:#fff}
.bubble{position:absolute;top:-16px;right:-14px;background:var(--blue);border:2px solid var(--ink);border-radius:12px 12px 12px 2px;
  padding:5px 11px;font-size:12px;font-weight:700;color:var(--ink);box-shadow:2px 2px 0 var(--ink)}
.stk-hint{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);font-size:11px;color:var(--slate);letter-spacing:.04em;pointer-events:none}

/* ---------- 07 BUY ---------- */
.buy{max-width:var(--maxw);margin:0 auto;padding:40px clamp(16px,4vw,34px)}
.buy-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:start}
.buy-left{display:flex;flex-direction:column;gap:16px}
.ca-bar{display:flex;align-items:center;gap:14px;cursor:pointer;border:2px solid var(--ink);border-radius:6px;background:#fff;color:var(--ink);
  padding:16px 20px;box-shadow:var(--shadow-sm);text-align:left;transition:transform .14s,box-shadow .14s;width:100%}
.ca-bar:hover{transform:translate(-1px,-1px);box-shadow:var(--shadow)}
.ca-base{width:32px;height:32px;flex:0 0 auto}
.ca-mid{flex:1;min-width:0}
.ca-mid small{display:block;font-size:10px;letter-spacing:.1em;color:var(--slate);font-weight:700}
.ca-mid code{display:block;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ca-copy{flex:0 0 auto;font-size:12px;font-weight:700;color:#fff;background:var(--blue);border-radius:3px;padding:7px 13px}
.buy-notes{display:grid;grid-template-columns:1fr 1fr;gap:10px;border:1.5px dashed rgba(255,255,255,.3);border-radius:6px;padding:16px 18px}
.buy-notes span{font-family:var(--mono);font-size:13px;color:#fff;border-left:2px solid #fff;padding-left:9px}
.chart-links{display:flex;gap:10px;flex-wrap:wrap}
.chart-box{position:relative;border:2px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);padding:44px 24px;text-align:center;box-shadow:var(--shadow)}
.chart-cap{position:absolute;top:-11px;left:18px;background:var(--bg);padding:2px 8px;font-size:11px;font-weight:700;letter-spacing:.1em;color:var(--cyan)}
.chart-patch{width:140px;height:140px;margin:0 auto 16px;filter:drop-shadow(2px 3px 0 rgba(11,13,18,.14))}
.chart-empty h3{font-family:var(--disp);font-size:25px;margin:0 0 8px}
.chart-empty p{color:var(--slate);font-size:15px;max-width:40ch;margin:0 auto}

/* ---------- FOOTER ---------- */
.foot{max-width:var(--maxw);margin:44px auto 0;padding:10px clamp(16px,4vw,34px) 56px}
.foot-rcpt{max-width:460px;margin:0 auto;padding:34px 28px;text-align:center}
.foot-seal{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:12px}
.foot-patch{width:76px;height:76px;border:1.5px solid var(--ink);border-radius:8px;background:#fff}
.foot-word{font-family:var(--disp);font-weight:700;font-size:28px;color:var(--ink)}
.foot-word .tk{color:var(--blue)}
.foot-thanks{font-size:14px;font-weight:700;letter-spacing:.1em;color:var(--ink);margin:4px 0}
.barcode{height:46px;margin:16px auto;max-width:280px;
  background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 5px,transparent 5px 9px,var(--ink) 9px 12px,transparent 12px 14px)}
.foot-code{font-size:11px;color:var(--slate);letter-spacing:.04em;margin:0 0 16px}
.foot-soc{justify-content:center}
.disclaimer{max-width:720px;margin:30px auto 0;font-size:12px;line-height:1.7;color:var(--cyan);text-align:center}
.disclaimer .tk{color:#fff}
.copy{text-align:center;font-size:11px;color:var(--cyan);margin-top:14px;opacity:.85}
.copy .tk{color:#fff}

/* ---------- lightbox ---------- */
#lightbox{position:fixed;inset:0;z-index:90;display:none;align-items:center;justify-content:center;background:rgba(4,16,46,.78);padding:20px}
#lightbox.open{display:flex}
.lb-card{position:relative;background:#fff;border:2px solid var(--ink);border-radius:8px;padding:14px;box-shadow:var(--shadow);max-width:min(92vw,460px)}
.lb-card img{width:100%;border-radius:4px}
.lb-close{position:absolute;top:-16px;right:-16px;width:38px;height:38px;border-radius:50%;background:#fff;
  border:2px solid var(--ink);font-size:22px;font-weight:700;cursor:pointer;line-height:1}

/* ---------- toast ---------- */
#toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);z-index:95;background:var(--ink);color:#fff;
  font-family:var(--mono);font-size:13px;padding:11px 18px;border-radius:6px;box-shadow:var(--shadow-sm);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
#toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- reveal (IntersectionObserver, transform/opacity only) ---------- */
.reveal{opacity:0;transform:translateY(22px)}
.reveal.in{opacity:1;transform:none;transition:opacity .55s ease,transform .55s cubic-bezier(.3,1.3,.5,1)}

/* ---------- animations ---------- */
@keyframes marq{to{transform:translateX(-50%)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-12px) rotate(1.5deg)}}
@keyframes blink{50%{opacity:0}}
@keyframes nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(5px)}}

/* ---------- responsive ---------- */
@media (max-width:1100px){.fig-notes li{font-size:11px}}
@media (max-width:960px){
  .nav-links{display:none}
  .field{grid-template-columns:1fr;gap:0}
  .figure{display:none}                 /* collapse flanking blueprint figures on mobile */
  .hero-grid{grid-template-columns:1fr;gap:28px}
  .unit{order:-1;width:min(86vw,320px)}
  .tiers{grid-template-columns:repeat(2,1fr)}
  .sheet-grid{grid-template-columns:repeat(2,1fr)}
  .cell:nth-child(3n){border-right:1.5px solid var(--ink-12)}
  .cell:nth-child(2n){border-right:none}
  .titleblock{grid-template-columns:repeat(3,1fr)}
  .steps{flex-direction:column;max-width:460px}
  .step-wire{width:2px;height:30px;flex-basis:30px;transform:rotate(90deg)}
  .step-wire::after{right:50%;top:auto;bottom:-1px;transform:translateX(50%)}
  .how .wire-fill{transform:scaleY(0);transform-origin:top center}
  .how .steps.seq-go .wire-fill{transform:scaleY(1)}
  .gate-grid{max-width:560px}
  .buy-grid{grid-template-columns:1fr}
}
@media (max-width:620px){
  body{font-size:16px}
  .hero{padding:34px 0 6px}
  .hero-grid{padding:26px 18px 28px}
  .h1{font-size:clamp(36px,13vw,56px)}
  .tiers{grid-template-columns:1fr 1fr}
  .tier{padding:36px 12px 16px}
  .sheet-grid{grid-template-columns:1fr}
  .cell{border-right:none !important;min-height:0}
  .titleblock{grid-template-columns:1fr 1fr 1fr}
  .tb-cell:nth-child(n+4){border-top:1.5px solid var(--ink-12)}
  .gate-grid{grid-template-columns:1fr;max-width:400px}
  .flow{flex-direction:column;align-items:center}
  .flow .node{max-width:240px;width:100%}
  .wire{flex-basis:30px;width:2px;height:30px;transform:rotate(90deg)}
  .wire::after{right:50%;top:auto;bottom:-1px;transform:translateX(50%)}
  .co,.callouts{display:none}
  .buy-pill{right:12px;bottom:12px;font-size:13.5px;padding:9px 14px}
}
@media (max-width:400px){.tiers{grid-template-columns:1fr}.board{height:660px}}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .bob,.seal-ring,.strip-track,.scroll-hint,.cursor{animation:none !important}
  .tline{opacity:1;transform:none}
  .reveal{opacity:1;transform:none}
  .how .step,.how .step-no,.how .step-tag{opacity:1 !important;transform:none !important;transition:none !important}
  .how .step::before,.how .wire-fill{transform:scaleX(1) !important;transition:none !important}
  .how .step-wire::after{opacity:1 !important}
  /* freeze in-card micro-illustrations to a completed/settled state */
  .sfig *{animation:none !important}
  .sf-scan,.sf-pip{opacity:0 !important}
  .sf-pulse{opacity:.5 !important}
  .sf-gate-glow{opacity:.25 !important}
  .sf-check{stroke-dashoffset:0 !important}
  .sf-row{transform:scaleX(1) !important;opacity:1 !important}
  .sf-sign{stroke-dashoffset:0 !important}
  .sf-stamp{opacity:1 !important;transform:scale(1) !important}
  .sf-anchor{opacity:1 !important}
  .sf-coin{opacity:0 !important}
  .sf-fill{transform:scaleX(1) !important}
  .sf-paid{opacity:1 !important}
  .sf-st402{opacity:0 !important}
  .sf-st200{opacity:1 !important}
  .btn:hover,.ca-bar:hover,.tier:hover{transform:none}
}

/* =========================================================================
   Dense blueprint background sheet (static, single paint, non-fixed)
   ========================================================================= */
.bp-sheet{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;overflow:hidden}
.bp-sheet svg{display:block;width:100%;height:100%}

/* =========================================================================
   Stamp wall — richer set + tactile
   ========================================================================= */
.wall-fig{position:absolute;top:12px;left:16px;font-family:var(--mono);font-size:10px;font-weight:700;
  letter-spacing:.14em;color:var(--slate);pointer-events:none;z-index:1}
.board .tick{z-index:1}
.stk{box-shadow:var(--shadow-sm)}
.stk:not(.dragging):hover{transform:translate(var(--tx,0),var(--ty,0)) rotate(var(--r)) translateY(-3px) scale(1.03);box-shadow:7px 9px 0 var(--ink-12);z-index:9}
.stk.dragging{box-shadow:10px 13px 0 rgba(4,16,46,.22)}
@media (prefers-reduced-motion:no-preference){
  .wobble{animation:wobble 5.5s ease-in-out infinite;transform-origin:50% 60%}
  .wobble.w2{animation-duration:6.6s;animation-delay:-1.4s}
  .wobble.w3{animation-duration:7.4s;animation-delay:-3s}
}
@keyframes wobble{0%,100%{transform:rotate(var(--r))}50%{transform:rotate(calc(var(--r) + 3deg))}}
.stk.dragging.wobble{animation:none}

/* receipt stub sticker */
.stub{width:128px;background:#fff;border:2px solid var(--ink);border-radius:3px;padding:10px 12px 14px;font-family:var(--mono)}
.stub .stub-h{font-size:9px;letter-spacing:.1em;color:var(--slate);border-bottom:1.5px dashed var(--ink-12);padding-bottom:6px;margin-bottom:6px}
.stub .stub-r{display:flex;justify-content:space-between;font-size:11px;font-weight:700;color:var(--ink);margin:3px 0}
.stub .stub-b{height:16px;margin-top:8px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 5px,transparent 5px 8px)}
/* blueprint FIG line-art sticker */
.figstk{width:132px;background:#0c2f6e;border:2px solid var(--ink);border-radius:6px;padding:10px;color:#dbe8ff}
.figstk svg{width:100%;height:auto;display:block}
.figstk .figstk-cap{display:block;text-align:center;font-family:var(--mono);font-size:9px;letter-spacing:.1em;color:#aac4ff;margin-top:6px}
/* extra stamp tints */
.st-outline{background:#fff;border-color:var(--ink);color:var(--ink)}
.st-outline span{color:var(--blue)}

/* =========================================================================
   INVITE PAGE
   ========================================================================= */
.sub-page{max-width:var(--maxw);margin:0 auto;padding:44px clamp(16px,4vw,34px) 10px}
.invite-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:center;margin-bottom:10px}
.invite-hero .ih-copy h1{font-family:var(--disp);font-weight:700;font-size:clamp(34px,5.4vw,58px);line-height:1.01;
  letter-spacing:-.03em;color:#fff;margin:0 0 16px}
.invite-hero .ih-copy h1 .em{color:#fff;text-decoration:underline;text-decoration-color:var(--blue);text-decoration-thickness:.08em;text-underline-offset:.1em}
.invite-hero .ih-sub{color:var(--cyan);font-size:17px;max-width:46ch;margin:0 0 22px}
.invite-hero .ih-sub b{color:#fff}
.plus-pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:700;font-size:13px;
  color:#fff;background:var(--blue);border:2px solid #fff;border-radius:999px;padding:7px 14px;margin-bottom:10px}

/* referral figure card (blueprint) */
.ref-fig{position:relative;border:1.5px solid rgba(255,255,255,.35);border-radius:8px;background:rgba(255,255,255,.04);
  padding:26px 22px;color:var(--cyan)}
.ref-fig .fig-label{position:absolute;top:-11px;left:18px;background:var(--bg)}
.ref-diagram{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}
.ref-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;justify-content:center}
.ref-box{font-family:var(--mono);font-size:12px;color:#fff;border:1.5px solid rgba(255,255,255,.5);border-radius:5px;padding:10px 14px;background:rgba(255,255,255,.05)}
.ref-box b{color:#fff;text-decoration:underline;text-underline-offset:.15em}
.ref-plus{font-family:var(--mono);font-weight:700;color:#fff;font-size:20px}
.ref-note{font-family:var(--mono);font-size:11.5px;color:var(--cyan);max-width:40ch}

/* ref link block (white card) */
.ref-card{max-width:var(--maxw);margin:34px auto 0;padding:0 clamp(16px,4vw,34px)}
.ref-inner{border:2px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);box-shadow:var(--shadow);overflow:hidden}
.ref-inner .rc-head{display:flex;justify-content:space-between;align-items:center;background:var(--ink);color:#fff;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;padding:13px 20px}
.ref-inner .rc-head .tk{color:#fff}
.rc-body{padding:24px clamp(18px,3vw,30px)}
.rc-body h3{font-family:var(--disp);font-size:22px;margin:0 0 6px}
.rc-body p{color:var(--slate);font-size:15px;margin:0 0 18px}
.ref-field{display:flex;align-items:stretch;gap:0;border:2px solid var(--ink);border-radius:6px;overflow:hidden;max-width:560px}
.ref-field code{flex:1;min-width:0;font-family:var(--mono);font-size:13.5px;padding:13px 15px;background:#f4f7ff;color:var(--ink);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:center}
.ref-field button{flex:0 0 auto;border:none;border-left:2px solid var(--ink);background:var(--blue);color:#fff;
  font-family:var(--disp);font-weight:700;font-size:14px;padding:0 20px;cursor:pointer}
.ref-field button:hover{background:#0047dd}
.ref-live{display:inline-flex;align-items:center;gap:7px;margin-top:12px;font-family:var(--mono);font-size:11.5px;color:var(--slate)}
.ref-live b{color:var(--blue)}
.rc-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:22px}
.rc-step{border:1.5px solid var(--ink-12);border-radius:6px;padding:14px;background:#f8faff}
.rc-step .mono{font-size:11px;color:var(--blue);font-weight:700}
.rc-step p{font-size:13.5px;color:var(--ink);margin:6px 0 0}

/* leaderboard ledger */
.leader{max-width:var(--maxw);margin:48px auto 0;padding:0 clamp(16px,4vw,34px)}
.ledger{position:relative;border:2px solid var(--ink);border-radius:8px;background:#fff;color:var(--ink);box-shadow:var(--shadow);overflow:hidden}
.ledger-head{display:flex;justify-content:space-between;align-items:center;background:var(--ink);color:#fff;
  font-family:var(--mono);font-size:12.5px;letter-spacing:.06em;padding:14px 22px}
.ledger-head .tk{color:#fff}
.sample-wm{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.1em;color:var(--ink);
  background:var(--blue);color:#fff;border:2px solid #fff;border-radius:4px;padding:4px 10px;transform:rotate(-2deg)}
.ledger-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ltable{width:100%;border-collapse:collapse;min-width:620px;font-family:var(--mono);font-size:13.5px}
.ltable thead th{text-align:left;font-size:10.5px;letter-spacing:.08em;color:var(--slate);font-weight:700;
  padding:14px 18px;border-bottom:2px dashed var(--ink);background:#f4f7ff}
.ltable td{padding:13px 18px;border-bottom:1.5px dashed var(--ink-12);color:var(--ink)}
.ltable tbody tr:nth-child(odd){background:#fbfcff}
.ltable .rank{font-weight:700;color:var(--blue)}
.ltable .rank-1{color:var(--blue)}
.ltable .aid{color:var(--ink);font-weight:700}
.ltable .bonus{color:var(--blue);font-weight:700}
.ltable .bonus::before{content:"+"}
.ltable .maxed{color:var(--red)}
.ledger-foot{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;
  padding:14px 22px;border-top:2px solid var(--ink);font-family:var(--mono);font-size:11.5px;color:var(--slate)}
.ledger-foot .tk{color:var(--blue)}
.ledger-watermark{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:2}
.ledger-watermark span{font-family:var(--disp);font-weight:700;font-size:clamp(34px,7vw,74px);color:rgba(0,82,255,.07);
  letter-spacing:.04em;transform:rotate(-14deg);white-space:nowrap}

@media (max-width:860px){
  .invite-hero{grid-template-columns:1fr;gap:24px}
  .rc-steps{grid-template-columns:1fr}
}
@media (max-width:620px){
  .ref-field button{padding:0 14px;font-size:13px}
  .ledger-watermark span{font-size:38px}
}

/* hero invite link */
.hero-invite{display:inline-block;margin-top:16px;font-family:var(--mono);font-size:12.5px;color:var(--blue);
  border-bottom:1.5px dashed var(--blue);padding-bottom:2px;transition:color .15s}
.hero-invite b{color:var(--ink)}
.hero-invite:hover{color:#0047dd}

/* stamp wall: fewer stickers on mobile */
@media (max-width:620px){
  .board .mhide{display:none}
  .board{height:640px}
}
@media (max-width:400px){.board{height:680px}}

/* =========================================================================
   MOBILE NAV (hamburger) — shared by both pages
   ========================================================================= */
.nav-toggle{display:none;width:44px;height:44px;border:1.5px solid rgba(255,255,255,.5);border-radius:6px;background:rgba(255,255,255,.06);
  cursor:pointer;flex-direction:column;align-items:center;justify-content:center;gap:5px;padding:0;flex:0 0 auto}
.nav-toggle:focus-visible{outline:2px solid #fff;outline-offset:2px}
.nav-toggle span{display:block;width:20px;height:2px;background:#fff;border-radius:2px;transition:transform .2s,opacity .2s}
.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-menu{display:contents}
.nav-links a[aria-current="page"]{color:#fff;text-decoration:underline;text-underline-offset:.2em;text-decoration-color:var(--blue)}
@media (max-width:960px){
  .nav{flex-wrap:wrap}
  .nav-toggle{display:flex;margin-left:auto}
  .nav-menu{display:none;flex-basis:100%;flex-direction:column;gap:10px;padding:12px 0 6px;margin-top:10px;border-top:1.5px solid rgba(255,255,255,.12)}
  .nav.open .nav-menu{display:flex}
  .nav-links{display:flex;flex-direction:column;gap:4px}
  .nav-links a{font-size:15px;padding:11px 12px;border:1.5px solid rgba(255,255,255,.14);border-radius:4px;color:#fff;background:rgba(255,255,255,.03)}
  .nav-links a:hover{background:rgba(0,82,255,.4);color:#fff}
  .nav .chip{align-self:flex-start}
}

/* =========================================================================
   MINT TERMINAL (interactive, pre-launch preview)
   ========================================================================= */
.mintpanel{max-width:var(--maxw);margin:0 auto;padding:44px clamp(16px,4vw,34px)}
.mp-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:26px;align-items:stretch}
.mp-term{border:2px solid var(--ink);border-radius:6px;overflow:hidden;box-shadow:var(--shadow);background:#0a1430;color:#cdd7f0}
.mp-term .term-bar{gap:7px}
.mp-preview-tag{margin-left:auto;font-size:10px;letter-spacing:.12em;font-weight:700;color:#fff;background:var(--blue);border-radius:2px;padding:2px 7px}
.mp-block{padding:18px clamp(16px,2.5vw,24px);border-bottom:1.5px solid #1d2a52}
.mp-label{font-size:11px;letter-spacing:.12em;color:#aeb8d8;font-weight:700;margin-bottom:12px}
.mp-label small{font-weight:400;letter-spacing:.02em;color:#7f8db5}
.mp-label code{color:#fff;font-family:var(--mono)}
.mp-paths{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mp-path{text-align:left;background:#13204a;border:1.5px solid #38477a;border-radius:5px;color:#fff;padding:12px 14px;cursor:pointer;
  display:flex;flex-direction:column;gap:3px;font-family:var(--disp);font-size:15px;transition:border-color .15s,background .15s}
.mp-path small{color:#aeb8d8;font-size:11px}
.mp-path:hover{border-color:#fff}
.mp-path.on{border-color:#fff;background:var(--blue);box-shadow:inset 0 0 0 1px #fff}
.mp-agent{margin-top:12px;font-size:12.5px;color:#aeb8d8}
.mp-agent.ok{color:#fff}
.mp-agent .r{color:#ff8a8d}.mp-agent .g{color:#fff;background:var(--blue);border-radius:2px;padding:0 5px}
.mp-agent.shake{animation:shake .4s}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.mp-cli{display:flex;align-items:center;gap:10px;background:#060d22;border:1.5px solid #38477a;border-radius:5px;padding:8px 12px}
.mp-cli .pre{color:#fff;font-weight:700}
.mp-cli input{flex:1;min-width:0;background:transparent;border:none;color:#fff;font-size:15px;outline:none;font-family:var(--mono)}
.mp-cli input::placeholder{color:#5c6a95}
.mp-cli:focus-within{border-color:#fff}
.mp-run{background:var(--blue);color:#fff;border:none;border-radius:3px;padding:7px 12px;font-weight:700;font-size:12px;cursor:pointer}
.mp-stepper{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}
.mp-k{font-size:11px;letter-spacing:.1em;color:#aeb8d8;font-weight:700}
.mp-step{width:36px;height:36px;border:1.5px solid #38477a;background:#13204a;color:#fff;border-radius:4px;font-size:18px;cursor:pointer;line-height:1}
.mp-step:hover{border-color:#fff}
.mp-stepper input{width:76px;height:36px;text-align:center;background:#060d22;border:1.5px solid #38477a;border-radius:4px;color:#fff;font-size:15px;font-weight:700}
.mp-cap{font-size:11px;color:#7f8db5;margin-left:auto}
.mp-cap b{color:#fff}
.mp-sim{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px;font-size:10.5px;color:#7f8db5;letter-spacing:.06em}
.mp-sim label{display:flex;flex-direction:column;gap:5px}
.mp-sim small{letter-spacing:0;color:#5c6a95}
.mp-sim input,.mp-sim select{background:#060d22;border:1.5px solid #38477a;border-radius:4px;color:#fff;padding:7px 9px;font-family:var(--mono);font-size:12.5px;max-width:100%}
.mp-logwrap{border-bottom:none}
.mp-log{font-size:13.5px;line-height:1.95;min-height:170px;max-height:260px;overflow-y:auto}
.mp-rcpt .mp-body{padding:18px 22px 6px}
.mp-body .li{font-size:13.5px}
.mp-bands{margin:10px 0 4px;border:1.5px dashed var(--ink-12);border-radius:4px;padding:8px 12px;font-size:11.5px;color:var(--slate)}
.mp-band{display:flex;justify-content:space-between;gap:10px;padding:2px 0}
.mp-cta{padding:10px 22px 18px;display:flex;flex-direction:column;align-items:center;gap:10px}
.mp-mint{width:100%;font-size:18px}
.mp-mint.done{background:var(--ink);color:#fff}
.mp-mint:disabled{cursor:default;transform:none}
.mp-note{font-size:11.5px;color:var(--slate);text-align:center}
.mp-note b{color:var(--blue)}
.mp-fine{display:flex;flex-wrap:wrap;gap:6px 14px;padding:14px 22px 16px;font-size:10.5px;color:var(--slate)}
.mp-fine b{color:var(--ink)}
@media (max-width:960px){.mp-grid{grid-template-columns:1fr}}
@media (max-width:620px){.mp-paths,.mp-sim{grid-template-columns:1fr}.mp-cap{margin-left:0;flex-basis:100%}}
@media (prefers-reduced-motion:reduce){.mp-agent.shake{animation:none}}

/* =========================================================================
   DENIM — lightweight CSS/SVG twill weave + faint fabric noise (static, tileable)
   Applied selectively: stamp-wall board + footer band only.
   ========================================================================= */
:root{
  --denim-blue:#1d4aa8;
  --copper:#D08A3C;
  --denim-stack:
    url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"),
    repeating-linear-gradient(45deg,rgba(255,255,255,.075) 0 2px,transparent 2px 6px),
    repeating-linear-gradient(-45deg,rgba(0,0,0,.14) 0 1px,transparent 1px 5px);
}
.denim{background-color:var(--denim-blue);background-image:var(--denim-stack);background-size:120px 120px,auto,auto}
.stitch{outline:2px dashed var(--copper);outline-offset:-10px}
/* stamp-wall board on denim */
.board.denim{background-color:var(--denim-blue);background-image:var(--denim-stack);background-size:120px 120px,auto,auto}
.board.denim .wall-fig,.board.denim .stk-hint{color:rgba(255,255,255,.85)}
.board.denim .tick::before,.board.denim .tick::after{background:#fff}
/* footer band on denim */
.foot.denim{max-width:none;margin:44px 0 0;padding:46px clamp(16px,4vw,34px) 56px;border-top:3px dashed var(--copper)}
.foot.denim .disclaimer,.foot.denim .copy{color:rgba(255,255,255,.88)}
.foot.denim .disclaimer .tk,.foot.denim .copy .tk{color:#fff}

/* leaderboard: search + zeroed top-10 */
.lb-top{font-size:11px;letter-spacing:.14em;font-weight:700;color:#fff;background:var(--blue);border-radius:2px;padding:3px 9px}
.ledger-search{display:flex;align-items:center;gap:10px;padding:14px 22px;background:#f4f7ff;border-bottom:1.5px dashed var(--ink-12);flex-wrap:wrap}
.ledger-search label{font-size:10.5px;letter-spacing:.12em;font-weight:700;color:var(--slate);flex:0 0 auto}
.ledger-search input{flex:1;min-width:200px;border:2px solid var(--ink);border-radius:4px;padding:10px 12px;font-family:var(--mono);font-size:13.5px;background:#fff;color:var(--ink)}
.ledger-search input:focus{outline:none;border-color:var(--blue)}
.ledger-search button{border:2px solid var(--ink);background:var(--blue);color:#fff;font-family:var(--disp);font-weight:700;font-size:14px;padding:10px 18px;border-radius:4px;cursor:pointer}
.ledger-search button:hover{background:#0047dd}
.lb-result{padding:11px 22px;font-size:12.5px;color:var(--slate);border-bottom:2px dashed var(--ink)}
.lb-result b{color:var(--blue)}
.ledger-zero td{color:var(--slate)}
.ledger-zero .aid{font-weight:400;color:#9aa3b8;letter-spacing:.04em}
.ledger-zero .rank{color:var(--slate)}
.ledger-zero .rank-1{color:var(--blue)}
.ledger-zero .bonus{color:var(--slate)}
@media (max-width:620px){.ledger-search label{flex-basis:100%}}

/* ---------- MINT: prompt-to-mint centerpiece ---------- */
.mp-promptblock{background:linear-gradient(180deg,#0f1d44,#0a1430)}
.mp-prompt{display:flex;align-items:center;gap:12px;background:#fff;border:2px solid var(--ink);border-radius:8px;padding:8px 8px 8px 16px;box-shadow:var(--shadow-sm)}
.mp-prompt:focus-within{box-shadow:0 0 0 3px var(--blue),var(--shadow-sm)}
.mp-spark{color:var(--blue);font-size:18px;flex:0 0 auto}
.mp-prompt input{flex:1;min-width:0;border:none;outline:none;background:transparent;color:var(--ink);font-family:var(--body);font-size:17px;padding:10px 0}
.mp-prompt input::placeholder{color:#8a93a8}
.mp-go{flex:0 0 auto;display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;border:2px solid var(--ink);border-radius:6px;
  font-family:var(--disp);font-weight:700;font-size:15px;padding:11px 16px;cursor:pointer;transition:transform .14s}
.mp-go:hover{transform:translateY(-1px)}
.mp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.mp-chip{font-family:var(--mono);font-size:12px;color:#fff;background:rgba(255,255,255,.06);border:1.5px solid #38477a;border-radius:999px;padding:6px 12px;cursor:pointer;transition:border-color .15s,background .15s}
.mp-chip:hover{border-color:#fff;background:var(--blue)}
.mp-flowline{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin-top:14px;font-size:10.5px;letter-spacing:.06em;color:#aeb8d8}
.mp-flowline i{font-style:normal;color:#5c6a95}
.mp-flowline .hi{color:#fff;background:var(--blue);border-radius:2px;padding:1px 6px}
.mp-alt .mp-label{color:#7f8db5}
.mp-alt .mp-cli{padding:6px 10px}
.mp-alt .mp-cli input{font-size:14px}
@media (max-width:620px){
  .mp-prompt{flex-wrap:wrap;padding:10px}
  .mp-prompt input{flex-basis:100%;font-size:16px}
  .mp-go{width:100%;justify-content:center}
}

/* ---------- MINT: generated-prompt block ---------- */
.mp-tabs{display:flex;gap:6px;margin-bottom:10px}
.mp-tab{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:#aeb8d8;background:transparent;border:1.5px solid #38477a;border-radius:4px;padding:6px 11px;cursor:pointer}
.mp-tab.on{color:#fff;background:var(--blue);border-color:#fff}
.mp-out{margin:0;background:#fff;color:var(--ink);border:2px solid var(--ink);border-radius:8px;padding:16px 18px;font-size:14.5px;line-height:1.7;
  white-space:pre-wrap;word-break:break-word;box-shadow:var(--shadow-sm);min-height:112px}
.mp-out:focus{outline:3px solid var(--blue);outline-offset:2px}
.mp-copyrow{margin-top:14px}
.mp-copy{width:100%;font-size:15.5px;padding:14px 18px}
.mp-canote{margin:14px 0 0;font-size:11px;color:#aeb8d8}
.mp-path[aria-pressed="true"]{border-color:#fff;background:var(--blue);box-shadow:inset 0 0 0 1px #fff}

/* ============================================================
   DENIM PATCH ART — embroidered illustration layer
   (operator-supplied art; patches have their own frames,
   so host cards drop their borders/padding under *-art)
   ============================================================ */
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* hero product shot */
.unit-art{border:0;background:none;box-shadow:none;width:min(100%,430px);aspect-ratio:auto;display:flex;align-items:center;justify-content:center;padding:0}
.unit-art .unit-patch{width:100%;height:auto;display:block;filter:drop-shadow(6px 8px 14px rgba(4,16,46,.4));animation:bob 5.5s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.unit-art .unit-patch{animation:none}}

/* CTA rendered as a denim button patch */
.btn-img{display:inline-block;border:0;background:none;padding:0;line-height:0;transition:transform .14s ease}
.btn-img img{display:block;width:clamp(230px,34vw,320px);height:auto;filter:drop-shadow(4px 5px 9px rgba(4,16,46,.34))}
.btn-img:hover{transform:translateY(-2px)}
.btn-img:focus-visible{outline:3px solid #fff;outline-offset:3px;border-radius:12px}

/* gate: the two door patches */
.gcard-art{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;overflow:visible}
.gcard-art img{width:100%;height:auto;display:block}
.gcard-art.gcard-pass img{filter:drop-shadow(7px 8px 0 rgba(0,82,255,.28))}
.gcard-art.gcard-fail img{filter:drop-shadow(7px 8px 0 rgba(229,72,77,.28))}

/* pricing: the five rate-tag patches */
.tier-art{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;overflow:visible}
.tier-art img{width:100%;height:auto;display:block;filter:drop-shadow(4px 6px 8px rgba(4,16,46,.3))}
.tier-art:hover{box-shadow:none!important}

/* how-to: the three step patches */
.step-art{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
.step-art img{width:100%;height:auto;display:block;filter:drop-shadow(5px 6px 10px rgba(4,16,46,.3))}
.how .step.step-art::before{display:none!important}

/* stamp wall: patches as draggable stickers */
.stk-art{filter:drop-shadow(4px 6px 7px rgba(4,16,46,.32))}
.stk-art img{width:var(--w,150px);height:auto;display:block;pointer-events:none;-webkit-user-drag:none}

/* buy: coin-badge link patches */
.link-coin{display:inline-flex;flex-direction:column;align-items:center;gap:4px;padding:0;border:0;background:none;transition:transform .14s ease}
.link-coin img{width:76px;height:auto;display:block;filter:drop-shadow(3px 4px 6px rgba(4,16,46,.3))}
.link-coin span{font-family:var(--mono);font-size:10.5px;font-weight:700;letter-spacing:.08em;color:var(--cyan)}
.link-coin:hover{transform:translateY(-3px)}
.link-coin[aria-disabled="true"]{opacity:.85;cursor:not-allowed}

/* ---------- LORE — "THE DENIM CUT" band ---------- */
.lore{position:relative;overflow:hidden;margin:0;padding:72px clamp(16px,4vw,34px) 76px;
  background:
    linear-gradient(135deg,rgba(255,255,255,.05) 0 1px,transparent 1px 7px),
    linear-gradient(180deg,#123a86,#0c2f6e 55%,#0a2a63 100%),var(--denim-blue,#1d4aa8);
  background-color:#123a86;border-top:3px solid var(--ink);border-bottom:3px solid var(--ink);
  box-shadow:inset 0 0 90px rgba(4,16,46,.55)}
.lore::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:url(assets/art/lore-bg.png) center/cover no-repeat;opacity:.55;
  mix-blend-mode:luminosity}
.lore-inner{max-width:760px;margin:0 auto;text-align:center;position:relative;z-index:1}
.lore-mark{width:min(84%,440px);height:auto;margin:0 auto 10px;display:block;
  filter:drop-shadow(3px 4px 8px rgba(4,16,46,.5))}
.lore-kicker{font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.22em;color:var(--cyan);
  text-transform:uppercase;margin:0 0 26px}
.lore-body{display:flex;flex-direction:column;gap:18px}
.lore-body p{margin:0;color:#eef3ff;font-size:clamp(15.5px,2.2vw,18px);line-height:1.74;
  font-family:var(--body);text-wrap:pretty}
.lore-body p b{color:#fff}
.lore-kick{font-family:var(--disp)!important;font-weight:700;font-size:clamp(19px,3vw,24px)!important;
  color:#fff!important;letter-spacing:.01em;margin-top:4px!important}
.lore-byline{margin:30px 0 0;font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--cyan)}
.lore-stitch{position:absolute;left:18px;right:18px;height:0;border-top:2px dashed rgba(201,160,90,.5);pointer-events:none}
.lore-stitch.top{top:14px}.lore-stitch.bot{bottom:14px}

/* footer wordmark */
.foot-wordmark{display:block;width:min(70%,360px);height:auto;margin:0 auto 26px;
  filter:drop-shadow(2px 3px 7px rgba(4,16,46,.4));opacity:.96}

@media (max-width:720px){
  .link-coin img{width:64px}
  .lore{padding:56px 18px 60px}
  .btn-img img{width:min(78vw,300px)}
  /* shrink wall stamps so the sticker pile reads clean, not a clump */
  .stk-art img{width:calc(var(--w,150px) * .66)}
}
@media (max-width:420px){
  .stk-art img{width:calc(var(--w,150px) * .56)}
}

/* invite quest buttons (blue, like ref Copy) + share layout — 2026-11-09 */
.ref-card .btn{display:inline-flex;align-items:center;justify-content:center;background:var(--blue);color:#fff;border:2px solid var(--ink);border-radius:6px;padding:9px 16px;font-family:inherit;font-weight:700;font-size:13px;line-height:1;cursor:pointer;box-shadow:var(--shadow);text-decoration:none;white-space:nowrap}
.ref-card .btn:hover{background:#0047dd}
.ref-card #agentId:focus{outline:none;border-color:var(--blue)}
.ref-card .ref-share{display:flex;flex-direction:column;align-items:flex-start;gap:8px;margin-top:16px}
.ref-card .ref-share-note{font-size:11px;line-height:1.5;color:var(--slate);opacity:.85;max-width:440px;letter-spacing:.01em}

/* spec sheet cells — center align all content (2026-11-09) */
.sheet .cell{text-align:center;align-items:center}
.sheet .titleblock .tb-cell{text-align:center}

/* spec sheet as receipt rows (dotted leader) — 2026-11-09 */
.sheet-rows{padding:6px clamp(16px,2.6vw,30px) 14px}
.srow{display:grid;grid-template-columns:auto 1fr auto;align-items:center;column-gap:12px;padding:14px 2px;border-bottom:1.5px dashed var(--ink-12)}
.srow:last-child{border-bottom:none}
.srow .sk{font-size:11.5px;letter-spacing:.11em;color:var(--slate);font-weight:700;white-space:nowrap}
.srow .sd{align-self:center;height:0;border-top:2px dotted var(--ink-12)}
.srow .sv{font-family:var(--mono);font-size:20px;line-height:1.1;color:var(--ink);font-weight:700;white-space:nowrap;text-align:right}
.srow .sv .tk{color:var(--blue)}
.srow .ssub{grid-column:1 / -1;font-size:12.5px;color:var(--slate);margin-top:4px}
.srow .ssub b{color:var(--ink)}
.srow.hi{background:rgba(0,82,255,.06)}
.srow.hi .sv{color:var(--blue)}
@media(max-width:560px){.srow .sv{font-size:16px}.srow .sk{font-size:10.5px}}

/* footer agent endpoints row — 2026-11-09 */
.foot-rcpt .foot-machine{margin:16px 0 0;font-size:10.5px;letter-spacing:.08em;color:var(--slate);font-weight:700}
.foot-rcpt .foot-machine a{color:var(--blue);text-decoration:none}
.foot-rcpt .foot-machine a:hover{text-decoration:underline}

/* footer = paper receipt (torn zigzag edges) — 2026-11-09 */
.foot-rcpt{position:relative;background:#fdfdfb;border:none;border-radius:0;box-shadow:0 22px 46px rgba(0,0,0,.34);padding:38px 30px 34px}
.foot-rcpt::before,.foot-rcpt::after{content:"";position:absolute;left:0;right:0;height:12px;z-index:1;
  background:linear-gradient(45deg,transparent 50%,#fdfdfb 50%),linear-gradient(-45deg,transparent 50%,#fdfdfb 50%);
  background-size:12px 12px;background-repeat:repeat-x}
.foot-rcpt::before{top:-11px}
.foot-rcpt::after{bottom:-11px;transform:scaleY(-1)}

/* center mint receipt fine print + blend footer into page bg — 2026-11-09 */
.mp-fine{justify-content:center;text-align:center}
.foot.denim{background:transparent;border-top:none}

/* center the 3 chart/social link coins — 2026-11-09 */
.chart-links{justify-content:center}

/* invite card -> denim-stitched receipt — 2026-11-09 */
.ref-card .rc-body{position:relative}
.ref-card .rc-body::before{content:"";position:absolute;inset:9px;pointer-events:none;border:2px dashed var(--copper);border-radius:4px;opacity:.5;z-index:0}
.ref-card .rc-body > *{position:relative;z-index:1}
.ref-card .q-task{border-bottom:1.5px dashed var(--ink-12);padding:13px 4px}
.ref-card .q-task:last-of-type{border-bottom:none}
.ref-card .q-no{color:var(--blue) !important;opacity:1 !important}
.ref-card .btn,.ref-card .btn-xpost{box-shadow:2px 2px 0 var(--ink)}
.ref-card .rc-steps{border-top:2px dashed var(--copper);padding-top:16px;margin-top:4px}
