/* =========================================================================
   LOSERS — one stylesheet. No frameworks, no CDNs, no web fonts.
   Design language: sticker sheet on graph paper. Heavy black outlines,
   hard offset shadows, mustard from the wordmark, red only for loss.
   ========================================================================= */

/* ---------- 1. Design tokens (defined once, used everywhere) ------------- */
:root{
  /* palette, sampled from the supplied logos */
  --mustard:      #FDBF03;   /* logo A field */
  --mustard-deep: #E9A916;   /* mascot wordmark */
  --mustard-dark: #8A6700;   /* mustard text on paper, accessible */
  --ink:          #0B0B0B;
  --ink-soft:     #1A1A1A;
  --paper:        #FAF6EE;
  --paper-2:      #F4EBDA;   /* mascot sticker outline cream */
  --white:        #FFFDF9;
  --red:          #BD2318;   /* mascot's cracked-chart line: loss only */
  --red-deep:     #8E1A12;
  --muted:        #5A554F;   /* 6.8:1 on paper */
  --grey:         #817C76;   /* decorative only */

  /* spacing scale */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 72px; --sp-9: 112px;

  /* radii */
  --r-1: 4px; --r-2: 10px; --r-3: 20px; --r-pill: 999px;

  /* borders + hard shadows */
  --bw: 3px;
  --bw-thick: 5px;
  --bd: var(--bw) solid var(--ink);
  --bd-thick: var(--bw-thick) solid var(--ink);
  --sh-1: 4px 4px 0 var(--ink);
  --sh-2: 8px 8px 0 var(--ink);
  --sh-mustard: 6px 6px 0 var(--mustard);

  /* type */
  --font-display: ui-sans-serif, system-ui, -apple-system, "Segoe UI", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  --fs-xs:   0.75rem;
  --fs-sm:   0.8125rem;
  --fs-base: 1.0625rem;
  --fs-md:   1.1875rem;
  --fs-lg:   1.375rem;
  --fs-xl:   clamp(1.6rem, 3.4vw, 2.25rem);
  --fs-2xl:  clamp(2.1rem, 6vw, 3.75rem);
  --fs-hero: clamp(2.75rem, 10.5vw, 7.5rem);

  --lh-tight: 0.92;
  --lh-snug: 1.15;
  --lh-body: 1.6;

  --wrap: 1120px;
  --wrap-narrow: 760px;
  --nav-h: 60px;
}

/* ---------- 2. Reset + base -------------------------------------------- */
*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  font-family:var(--font-body);
  font-size:var(--fs-base);
  line-height:var(--lh-body);
  color:var(--ink);
  background-color:var(--paper);
  background-image:
    linear-gradient(rgba(11,11,11,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(11,11,11,.05) 1px, transparent 1px);
  background-size:30px 30px;
  background-position:-1px -1px;
}

[hidden]{ display:none !important; }
img{ max-width:100%; height:auto; display:block; }
a{ color:var(--ink); text-underline-offset:3px; text-decoration-thickness:2px; }
a:hover{ color:var(--red); }
p{ margin:0 0 var(--sp-4); }
h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:-0.035em;
  line-height:var(--lh-tight);
  margin:0 0 var(--sp-4);
  font-stretch:condensed;
}
ul,ol{ margin:0 0 var(--sp-4); padding-left:1.25em; }
li{ margin-bottom:var(--sp-2); }
hr{ border:0; border-top:var(--bd); margin:var(--sp-6) 0; }

:focus-visible{
  outline:4px solid var(--red);
  outline-offset:3px;
}

.wrap{ width:100%; max-width:var(--wrap); margin:0 auto; padding:0 var(--sp-5); }
/* grid children default to min-width:auto; a 1024px image then widens the
   column past the viewport on narrow screens. Pin them to zero. */
.hero__inner > *, .story > *, .grid > *, .footer__top > *{ min-width:0; }
.wrap--narrow{ max-width:var(--wrap-narrow); }
.vh{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip{
  position:absolute; left:var(--sp-4); top:-100px; z-index:100;
  background:var(--mustard); color:var(--ink); border:var(--bd);
  box-shadow:var(--sh-1); padding:var(--sp-3) var(--sp-4);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  text-decoration:none;
}
.skip:focus{ top:var(--sp-3); }

/* ---------- 3. Reveal + JS gating -------------------------------------- */
/* Ships pre-reveal. Post-reveal blocks stay out of the document, with or
   without JavaScript, until REVEAL is true in config.js. !important is
   deliberate: this gate must not lose a specificity fight to a layout rule
   (.chip and .footer__facts li both set display). At reveal, app.js removes
   the attribute rather than overriding display, so each element keeps its
   own layout. Same trick for .js-only. */
[data-reveal="post"]{ display:none !important; }
[data-reveal="pre"].reveal-off{ display:none !important; }
.js-only{ display:none !important; }

/* ---------- 4. Header + nav -------------------------------------------- */
.site-header{
  position:sticky; top:0; z-index:60;
  background:var(--ink);
  border-bottom:var(--bw-thick) solid var(--mustard);
}
.site-header__bar{
  display:flex; align-items:center; gap:var(--sp-4);
  min-height:var(--nav-h);
  padding:0 var(--sp-4);
  max-width:var(--wrap); margin:0 auto;
}
.brand{
  display:flex; align-items:center; gap:var(--sp-3);
  text-decoration:none; flex:0 0 auto;
}
.brand img{
  width:38px; height:38px; background:var(--ink);
  border:2px solid var(--mustard); border-radius:var(--r-1);
  object-fit:cover;
}
.brand span{
  font-family:var(--font-display); font-weight:900; font-size:1.15rem;
  letter-spacing:-0.03em; text-transform:uppercase; color:var(--mustard);
}
.brand:hover span{ color:var(--white); }

.nav{ margin-left:auto; overflow-x:auto; scrollbar-width:none; }
.nav::-webkit-scrollbar{ display:none; }
.nav ul{
  display:flex; gap:var(--sp-1); list-style:none; margin:0; padding:0;
}
.nav li{ margin:0; }
.nav a{
  display:block; white-space:nowrap; text-decoration:none;
  color:var(--paper-2);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-sm); letter-spacing:0.01em;
  padding:var(--sp-2) var(--sp-3);
  border-radius:var(--r-1);
  border:2px solid transparent;
}
.nav a:hover{ color:var(--ink); background:var(--mustard); }
.nav a[aria-current="true"]{
  color:var(--ink); background:var(--mustard); border-color:var(--mustard);
}
@media (max-width:860px){
  .site-header__bar{ flex-wrap:wrap; padding-bottom:var(--sp-2); }
  .nav{ margin-left:0; width:100%; padding-bottom:var(--sp-1); }
}

/* ---------- 5. Buttons, chips, stickers -------------------------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:var(--sp-2);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  letter-spacing:-0.01em; font-size:var(--fs-md);
  padding:var(--sp-3) var(--sp-5);
  background:var(--mustard); color:var(--ink);
  border:var(--bd); border-radius:var(--r-1);
  box-shadow:var(--sh-1);
  cursor:pointer; text-decoration:none;
  transition:transform .08s ease, box-shadow .08s ease;
}
.btn:hover{ background:var(--mustard-deep); color:var(--ink); }
.btn:active{ transform:translate(4px,4px); box-shadow:0 0 0 var(--ink); }
.btn--ghost{
  background:transparent; color:var(--ink); box-shadow:none;
  font-size:var(--fs-base); padding:var(--sp-2) var(--sp-4);
}
.btn--ghost:hover{ background:var(--ink); color:var(--mustard); }
/* on the black hero and the black sections the ghost link needs to be light */
.hero .btn--ghost,
.section--ink .btn--ghost{
  color:var(--mustard); border-color:var(--mustard);
  text-decoration:underline; text-underline-offset:5px;
}
.hero .btn--ghost:hover,
.section--ink .btn--ghost:hover{ background:var(--mustard); color:var(--ink); }
.btn--sm{ font-size:var(--fs-sm); padding:var(--sp-2) var(--sp-3); box-shadow:none; }
@media (prefers-reduced-motion: reduce){
  .btn{ transition:none; }
  .btn:active{ transform:none; box-shadow:var(--sh-1); }
}

.link-plain{ font-weight:700; }

/* dotted placeholder chip: everything still waiting on John's word */
.ph{
  display:inline-block;
  font-family:var(--font-mono); font-size:0.85em; font-weight:700;
  color:var(--red-deep); background:rgba(189,35,24,.07);
  border:2px dotted var(--red); border-radius:var(--r-1);
  padding:0 6px; white-space:nowrap;
  vertical-align:baseline;
}
.ph--filled{
  color:inherit; background:transparent; border:0; padding:0;
  font-family:inherit; font-size:inherit; font-weight:inherit;
}
/* the same chip on a black section: light red keeps the pending semantic
   and clears 4.5:1 (7.7:1 measured) where the deep red did not */
.hero .ph,
.section--ink .ph,
.site-footer .ph,
.card--ink .ph{
  color:#FF7A66; border-color:#FF7A66; background:rgba(189,35,24,.20);
}
/* ...but a white card inside a black section goes back to the deep red */
.section--ink .result .ph,
.section--ink .card .ph,
.section--ink .table-wrap .ph{
  color:var(--red-deep); border-color:var(--red); background:rgba(189,35,24,.07);
}

.chip{
  display:inline-flex; align-items:center; gap:var(--sp-2);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-xs); letter-spacing:0.02em;
  padding:6px var(--sp-3);
  border:var(--bd); border-radius:var(--r-pill);
  background:var(--white);
}
.chip--warn{ background:var(--red); color:var(--white); border-color:var(--ink); }
.chip--ink{ background:var(--ink); color:var(--mustard); }

.kicker{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-sm); letter-spacing:0.02em; line-height:1.35;
  color:var(--ink);
  background:var(--mustard);
  border:var(--bd); box-shadow:var(--sh-1);
  padding:var(--sp-2) var(--sp-3);
  display:inline-block; max-width:46ch;
  margin:0 0 var(--sp-4);
  transform:rotate(-1.2deg);
}
.kicker--ink{ background:var(--ink); color:var(--mustard); transform:rotate(0.8deg); }

/* ---------- 6. Sections ------------------------------------------------- */
.section{ padding:var(--sp-8) 0; scroll-margin-top:calc(var(--nav-h) + 12px); }
.section--tight{ padding:var(--sp-7) 0; }
.section--ink{
  background:var(--ink); color:var(--paper);
  border-block:var(--bw-thick) solid var(--ink);
}
.section--ink h2{ color:var(--mustard); }
.section--ink a{ color:var(--mustard); }
.section--paper2{ background:var(--paper-2); border-block:var(--bd); }

.section__head{ margin-bottom:var(--sp-6); }
.section__head h2{ font-size:var(--fs-2xl); }
.section__num{
  font-family:var(--font-mono); font-size:var(--fs-sm); font-weight:700;
  color:var(--muted); display:block; margin-bottom:var(--sp-2);
  letter-spacing:0.08em; text-transform:uppercase;
}
.section--ink .section__num{ color:var(--mustard-deep); }
.lede{ font-size:var(--fs-md); max-width:64ch; }
.fine{ font-size:var(--fs-sm); color:var(--muted); max-width:74ch; }
.section--ink .fine{ color:var(--paper-2); }

/* ---------- 7. Hero ----------------------------------------------------- */
.hero{
  background:var(--ink);
  color:var(--paper);
  border-bottom:var(--bw-thick) solid var(--ink);
  padding:var(--sp-8) 0 var(--sp-7);
  position:relative; overflow:hidden;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(250,246,238,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(250,246,238,.055) 1px, transparent 1px);
  background-size:38px 38px;
  pointer-events:none;
}
.hero__inner{ position:relative; display:grid; gap:var(--sp-6); align-items:center; }
@media (min-width:900px){
  .hero__inner{ grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); gap:var(--sp-7); }
}
.hero h1{
  font-size:var(--fs-hero);
  color:var(--mustard);
  margin:0 0 var(--sp-4);
  text-wrap:balance;
}
.hero__sub{
  font-size:var(--fs-md); max-width:44ch; color:var(--paper);
  margin-bottom:var(--sp-5);
}
.hero__cta{ display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-4); margin-bottom:var(--sp-4); }
.hero__under{ font-size:var(--fs-sm); color:var(--paper-2); max-width:56ch; margin:0; }
.hero__art{ position:relative; }
.hero__art img{
  width:100%; border:var(--bd-thick); border-radius:var(--r-3);
  box-shadow:var(--sh-2);
}
.hero__sticker{
  position:absolute; left:-6px; bottom:-18px;
  max-width:min(300px, 78%);
  background:var(--paper); color:var(--ink);
  border:var(--bd); box-shadow:var(--sh-1); border-radius:var(--r-1);
  padding:var(--sp-2) var(--sp-3);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-xs); line-height:1.3; letter-spacing:0.01em;
  transform:rotate(-3deg);
}
.hero__stats{
  display:flex; flex-wrap:wrap; gap:var(--sp-2) var(--sp-5);
  margin-top:var(--sp-6); padding-top:var(--sp-5);
  border-top:2px dashed rgba(250,246,238,.35);
}
.stat{ display:flex; flex-direction:column; }
.stat__n{
  font-family:var(--font-display); font-weight:900; font-size:var(--fs-xl);
  color:var(--mustard); letter-spacing:-0.03em; line-height:1;
  font-variant-numeric:tabular-nums;
}
.stat__l{ font-size:var(--fs-xs); text-transform:uppercase; letter-spacing:0.06em; color:var(--paper-2); }

/* ---------- 8. Marquee (the one moving thing) --------------------------- */
.marquee{
  background:var(--mustard);
  border-block:var(--bd-thick);
  overflow:hidden;
  padding:var(--sp-3) 0;
}
.marquee__track{
  display:flex; width:max-content; gap:0;
  animation:marquee 60s linear infinite;
}
.marquee__group{ display:flex; gap:0; }
.marquee__item{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-base); letter-spacing:-0.01em; white-space:nowrap;
  padding:0 var(--sp-4); color:var(--ink);
  display:inline-flex; align-items:center; gap:var(--sp-4);
}
.marquee__item::after{ content:"✱"; color:var(--red); font-size:0.9em; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .marquee{ padding:var(--sp-4) 0; }
  .marquee__track{ animation:none; width:auto; flex-wrap:wrap; justify-content:center; }
  .marquee__item{ white-space:normal; padding:var(--sp-1) var(--sp-4); }
}

/* ---------- 9. Cards, panels, grids ------------------------------------ */
.card{
  color:var(--ink);
  background:var(--white);
  border:var(--bd); border-radius:var(--r-2);
  box-shadow:var(--sh-1);
  padding:var(--sp-5);
}
.card--ink{ background:var(--ink); color:var(--paper); box-shadow:var(--sh-mustard); }
.card--flat{ box-shadow:none; }
.grid{ display:grid; gap:var(--sp-5); }
@media (min-width:760px){
  .grid--3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .grid--2{ grid-template-columns:repeat(2, minmax(0,1fr)); }
}
.joke-card p:last-child{ margin-bottom:0; }
.joke-card__n{
  font-family:var(--font-display); font-weight:900; font-size:var(--fs-xl);
  color:var(--red); line-height:1; display:block; margin-bottom:var(--sp-3);
}

/* ---------- 10. Lookup -------------------------------------------------- */
.lookup__form{ display:grid; gap:var(--sp-3); }
.lookup__label{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-md); letter-spacing:-0.02em; line-height:1.2;
}
.lookup__row{ display:flex; flex-wrap:wrap; gap:var(--sp-3); }
.lookup__input{
  flex:1 1 320px; min-width:0;
  font-family:var(--font-mono); font-size:var(--fs-base);
  padding:var(--sp-3) var(--sp-4);
  background:var(--white); color:var(--ink);
  border:var(--bd); border-radius:var(--r-1);
  box-shadow:inset 3px 3px 0 rgba(11,11,11,.06);
}
.lookup__input::placeholder{ color:var(--muted); }
.lookup__help{ font-size:var(--fs-sm); color:var(--muted); max-width:70ch; margin:0; }
.lookup__status{ font-size:var(--fs-sm); color:var(--muted); min-height:1.4em; margin:0; }
.section--ink .lookup__help,
.section--ink .lookup__status{ color:var(--paper-2); }
.section--ink .lookup__status{ font-weight:700; }

.result{
  color:var(--ink);
  margin-top:var(--sp-5);
  border:var(--bd-thick); border-radius:var(--r-2);
  background:var(--white);
  box-shadow:var(--sh-2);
  overflow:hidden;
  animation:fadeIn 120ms ease-out;
}
@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion: reduce){ .result{ animation:none; } }
.result[hidden]{ display:none; }
.result__flag{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-sm); letter-spacing:0.06em;
  padding:var(--sp-2) var(--sp-4);
  background:var(--ink); color:var(--mustard);
}
.result--miss .result__flag{ background:var(--paper-2); color:var(--ink); }
.result--bad .result__flag{ background:var(--red); color:var(--white); }
.result__body{ padding:var(--sp-5); }
.result__body p:last-child{ margin-bottom:0; }
.result__figure{
  font-family:var(--font-display); font-weight:900;
  font-size:var(--fs-2xl); color:var(--red);
  line-height:1; letter-spacing:-0.03em;
  font-variant-numeric:tabular-nums;
  margin:0 0 var(--sp-2);
}
.result__figure small{ font-size:0.4em; color:var(--muted); letter-spacing:0.06em; }
.result__addr{
  font-family:var(--font-mono); font-size:var(--fs-sm); color:var(--muted);
  word-break:break-all; margin:0 0 var(--sp-4);
}
.result__tier{
  display:inline-block; margin-bottom:var(--sp-4);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-sm); letter-spacing:0.02em;
  background:var(--mustard); border:var(--bd); border-radius:var(--r-1);
  padding:4px var(--sp-3);
}
.safety-line{
  margin-top:var(--sp-4);
  font-size:var(--fs-sm); font-weight:700;
  border-top:2px dashed var(--grey); padding-top:var(--sp-3);
}

/* per-wallet airdrop, computed at lookup time */
.airdrop{
  display:flex; gap:var(--sp-4); align-items:center;
  margin:var(--sp-4) 0 0;
  padding:var(--sp-3) var(--sp-4);
  background:var(--paper-2);
  border:var(--bd); border-radius:var(--r-2);
}
.airdrop__mark{
  flex:0 0 auto; width:52px; height:52px;
  border:2px solid var(--ink); border-radius:50%;
}
.airdrop__n{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-lg); letter-spacing:-0.025em; line-height:1.1;
  margin:0 0 4px;
}
.airdrop__tail{
  display:inline-block;
  font-size:var(--fs-xs); letter-spacing:0.02em; color:var(--muted);
}
.airdrop__fine{ font-size:var(--fs-xs); color:var(--muted); margin:0; }

/* the token as an object, inline with a line of text */
.token-mark{
  display:inline-block; vertical-align:-7px;
  width:26px; height:26px; margin-right:var(--sp-2);
  border:2px solid var(--ink); border-radius:50%;
}
@media (max-width:480px){
  .airdrop{ gap:var(--sp-3); padding:var(--sp-3); }
  .airdrop__mark{ width:40px; height:40px; }
  .airdrop__n{ font-size:var(--fs-md); }
}

/* ---------- 11. Tables -------------------------------------------------- */
.table-wrap{
  color:var(--ink);
  border:var(--bd); border-radius:var(--r-2); background:var(--white);
  box-shadow:var(--sh-1); overflow-x:auto;
}
table{ width:100%; border-collapse:collapse; font-size:var(--fs-sm); }
caption{
  text-align:left; padding:var(--sp-4) var(--sp-4) 0;
  font-size:var(--fs-sm); color:var(--muted);
}
th,td{ padding:var(--sp-3) var(--sp-4); text-align:left; border-bottom:2px solid rgba(11,11,11,.12); }
thead th{
  background:var(--ink); color:var(--mustard);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-xs); letter-spacing:0.06em; border-bottom:var(--bd);
}
tbody tr:last-child td{ border-bottom:0; }
tbody tr:nth-child(even){ background:rgba(244,235,218,.55); }
.num{ text-align:right; font-variant-numeric:tabular-nums; font-family:var(--font-mono); }
.loss{ color:var(--red); font-weight:700; }
.addr{ font-family:var(--font-mono); font-weight:700; }
.rank{ font-family:var(--font-display); font-weight:900; font-size:var(--fs-base); }
.tier-cell{ font-family:var(--font-display); font-weight:900; text-transform:uppercase; font-size:var(--fs-xs); letter-spacing:0.02em; }
.trophy{
  display:inline-block; margin-left:var(--sp-2);
  background:var(--red); color:var(--white);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:0.65rem; letter-spacing:0.04em;
  border:2px solid var(--ink); border-radius:var(--r-pill);
  padding:1px 8px; vertical-align:middle;
}
tr.is-top td{ background:rgba(253,191,3,.22); }
.rows-more[hidden]{ display:none; }
.table-actions{ display:flex; flex-wrap:wrap; gap:var(--sp-3); align-items:center; margin-top:var(--sp-4); }

@media (max-width:640px){
  thead.responsive-head{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }
  table.responsive tbody tr{
    display:grid; grid-template-columns:auto 1fr; gap:2px var(--sp-3);
    padding:var(--sp-3) var(--sp-4); border-bottom:2px solid rgba(11,11,11,.12);
  }
  table.responsive tbody td{ border:0; padding:0; display:flex; gap:var(--sp-2); align-items:baseline; }
  table.responsive tbody td::before{
    content:attr(data-label);
    font-family:var(--font-display); font-weight:900; text-transform:uppercase;
    font-size:var(--fs-xs); color:var(--muted); min-width:5.5em;
  }
  table.responsive tbody td.cell-rank{ grid-row:span 3; align-self:center; }
  table.responsive tbody td.cell-rank::before{ content:"#"; min-width:0; color:var(--muted); }
  .num{ text-align:left; }
}

/* ---------- 12. Allocation bar ------------------------------------------ */
.alloc{ margin:0 0 var(--sp-5); }
.alloc__bar{
  display:flex; width:100%; height:76px;
  border:var(--bd-thick); border-radius:var(--r-2); overflow:hidden;
  box-shadow:var(--sh-1); background:var(--white);
}
.alloc__seg{
  display:flex; align-items:center; justify-content:center;
  border-right:var(--bd); min-width:0; position:relative;
  font-family:var(--font-display); font-weight:900; font-size:var(--fs-sm);
  letter-spacing:-0.01em; color:var(--ink);
}
.alloc__seg:last-child{ border-right:0; }
.alloc__seg span{ padding:0 var(--sp-2); }
.alloc__seg--drop{ background:var(--mustard); }
.alloc__seg--pool{ background:var(--ink); color:var(--mustard); }
.alloc__seg--fund{ background:var(--paper-2); }
.alloc__seg--treasury{ background:repeating-linear-gradient(45deg, var(--white) 0 6px, var(--paper-2) 6px 12px); font-size:var(--fs-xs); }
.alloc__legend{ list-style:none; margin:var(--sp-5) 0 0; padding:0; display:grid; gap:var(--sp-3); }
@media (min-width:760px){ .alloc__legend{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--sp-3) var(--sp-5); } }
.alloc__legend li{ display:flex; gap:var(--sp-3); align-items:flex-start; margin:0; }
.swatch{
  flex:0 0 auto; width:22px; height:22px; border:var(--bd); border-radius:var(--r-1); margin-top:3px;
}
.swatch--drop{ background:var(--mustard); }
.swatch--pool{ background:var(--ink); }
.swatch--fund{ background:var(--paper-2); }
.swatch--treasury{ background:repeating-linear-gradient(45deg, var(--white) 0 4px, var(--paper-2) 4px 8px); }
.alloc__pct{ font-family:var(--font-display); font-weight:900; font-size:var(--fs-md); letter-spacing:-0.02em; }
.supply-line{
  font-family:var(--font-mono); font-size:var(--fs-sm); font-weight:700;
  border-top:2px dashed var(--grey); padding-top:var(--sp-3); margin-top:var(--sp-5);
}
@media (max-width:560px){
  .alloc__bar{ height:64px; }
  .alloc__seg{ font-size:var(--fs-xs); }
  .alloc__seg--treasury span{ display:none; }
}

/* ---------- 13. Story + fund ------------------------------------------- */
.story{ display:grid; gap:var(--sp-6); }
@media (min-width:900px){ .story{ grid-template-columns:minmax(0,1fr) minmax(0,340px); gap:var(--sp-7); } }
.story__art img{
  border:var(--bd-thick); border-radius:var(--r-3); box-shadow:var(--sh-mustard);
  background:var(--ink);
}
.story__art figcaption{ font-size:var(--fs-xs); color:var(--muted); margin-top:var(--sp-3); }
.section--ink .story__art figcaption{ color:var(--paper-2); }
.pull{
  border-left:var(--bw-thick) solid var(--red);
  padding:var(--sp-2) 0 var(--sp-2) var(--sp-4);
  margin:var(--sp-5) 0;
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-lg); letter-spacing:-0.025em; line-height:1.1;
}
.fund__rules{ list-style:none; padding:0; margin:var(--sp-5) 0 0; display:grid; gap:var(--sp-3); }
.fund__rules li{
  display:flex; gap:var(--sp-3); align-items:flex-start; margin:0;
  border:var(--bd); border-radius:var(--r-2); background:var(--white); padding:var(--sp-3) var(--sp-4);
}
.fund__rules b{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-xs); letter-spacing:0.04em;
  background:var(--ink); color:var(--mustard);
  border-radius:var(--r-1); padding:2px 8px; flex:0 0 auto; margin-top:3px;
}

/* ---------- 14. Steps + FAQ -------------------------------------------- */
.steps{ counter-reset:step; list-style:none; padding:0; display:grid; gap:var(--sp-3); }
.steps li{
  counter-increment:step; margin:0;
  display:flex; gap:var(--sp-4); align-items:flex-start;
  border:var(--bd); border-radius:var(--r-2); background:var(--white);
  padding:var(--sp-4);
}
.steps li::before{
  content:counter(step);
  flex:0 0 auto;
  font-family:var(--font-display); font-weight:900; font-size:var(--fs-lg);
  background:var(--mustard); color:var(--ink);
  border:var(--bd); border-radius:var(--r-1);
  width:40px; height:40px; display:grid; place-items:center; line-height:1;
}
.faq{ display:grid; gap:var(--sp-3); }
details.qa{
  border:var(--bd); border-radius:var(--r-2); background:var(--white);
  box-shadow:var(--sh-1);
}
details.qa[open]{ background:var(--paper-2); }
details.qa summary{
  cursor:pointer; list-style:none;
  padding:var(--sp-4);
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-md); letter-spacing:-0.02em; line-height:1.2;
  display:flex; gap:var(--sp-4); align-items:center; justify-content:space-between;
}
details.qa summary::-webkit-details-marker{ display:none; }
details.qa summary::after{
  content:"+"; font-size:1.4em; line-height:1; color:var(--red); flex:0 0 auto;
}
details.qa[open] summary::after{ content:"–"; }
details.qa summary:hover{ color:var(--red); }
.qa__body{ padding:0 var(--sp-4) var(--sp-4); }
.qa__body p:last-child{ margin-bottom:0; }

/* ---------- 15. Safety strip ------------------------------------------- */
.safety{
  border:var(--bd-thick); border-radius:var(--r-2);
  background:var(--white); padding:var(--sp-5);
  box-shadow:var(--sh-1);
}
.safety h3{ font-size:var(--fs-lg); margin-bottom:var(--sp-3); }
.chips{ display:flex; flex-wrap:wrap; gap:var(--sp-2); margin-top:var(--sp-4); }

/* ---------- 16. Footer + disclosure ------------------------------------ */
.site-footer{
  background:var(--ink); color:var(--paper);
  border-top:var(--bw-thick) solid var(--mustard);
  padding:var(--sp-8) 0 var(--sp-7);
}
.site-footer a{ color:var(--mustard); }
.footer__top{ display:grid; gap:var(--sp-6); margin-bottom:var(--sp-6); }
@media (min-width:900px){ .footer__top{ grid-template-columns:minmax(0,320px) minmax(0,1fr); gap:var(--sp-7); } }
.footer__mark img{ width:132px; border:var(--bd); border-radius:var(--r-2); }
.footer__facts{ list-style:none; padding:0; margin:0; display:grid; gap:var(--sp-2); font-size:var(--fs-sm); }
.footer__facts li{ margin:0; display:flex; flex-wrap:wrap; gap:var(--sp-2); align-items:baseline; }
.footer__facts b{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-xs); letter-spacing:0.05em; color:var(--mustard-deep);
  min-width:9.5em;
}
.hash{ font-family:var(--font-mono); font-size:var(--fs-xs); word-break:break-all; }
.disclosure{
  border:3px solid var(--paper-2); border-radius:var(--r-2);
  padding:var(--sp-5); margin-top:var(--sp-6);
  background:rgba(250,246,238,.05);
}
.disclosure h2{
  font-size:var(--fs-sm); letter-spacing:0.08em; color:var(--paper-2);
  text-transform:uppercase; margin-bottom:var(--sp-4);
}
.disclosure p{
  font-family:var(--font-body); font-size:var(--fs-sm); line-height:1.65;
  color:var(--paper); text-transform:none; letter-spacing:0;
}
.disclosure p:last-child{ margin-bottom:0; }
.footer__bottom{
  margin-top:var(--sp-6); padding-top:var(--sp-5);
  border-top:2px dashed rgba(250,246,238,.35);
  display:grid; gap:var(--sp-3); font-size:var(--fs-sm);
}
.footer__warn{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:var(--fs-base); color:var(--mustard); letter-spacing:-0.01em;
}
.copy-btn{
  font-family:var(--font-display); font-weight:900; text-transform:uppercase;
  font-size:0.65rem; letter-spacing:0.04em;
  background:var(--mustard); color:var(--ink);
  border:2px solid var(--ink); border-radius:var(--r-1);
  padding:2px 8px; cursor:pointer;
}
.copy-btn:hover{ background:var(--white); }
.copy-note{ font-size:var(--fs-xs); color:var(--mustard); }

/* ---------- 17. 404 ----------------------------------------------------- */
.oops{
  min-height:70vh; display:grid; place-items:center; text-align:center;
  padding:var(--sp-8) 0;
}
.oops h1{ font-size:var(--fs-2xl); margin-bottom:var(--sp-4); }
.oops img{
  width:min(320px, 70vw); margin:0 auto var(--sp-5);
  border:var(--bd-thick); border-radius:var(--r-3); box-shadow:var(--sh-2);
  background:var(--ink);
}
.oops p{ max-width:52ch; margin-left:auto; margin-right:auto; }

/* ---------- 18. noscript ------------------------------------------------ */
.noscript{
  background:var(--red); color:var(--white);
  border-bottom:var(--bd);
  padding:var(--sp-3) 0; font-size:var(--fs-sm); font-weight:700;
}