/* tyretoken.org v3. Copy rule: say what TYRE and the Fund DO, never what anything is WORTH. No <b>/<strong>. Cyan is a signal colour, never paragraph text.
   Shared by / and /fund, linked as /site.css?v=3. Fonts (Google Fonts only): Barlow Condensed 600 = display only;
   DM Sans 400 = body, 500 = labels/buttons/h3; Archivo italic 900 = .wd wordmark only; JetBrains Mono 400 = hex only.
   Uppercase + tracking only on: .eyebrow .label .tag .verb .fig .k .u .nets .hero-meta .road .when .contract .net footer .meta .wd */

/* ------------------------------------------------------------------ 1. tokens */
:root{
  --bg:#0A0C0E; --bg-2:#101416; --panel:#0D1012; --pane:#12191C;
  --ink:#F2F5F7;      /* 17.9:1 on bg */
  --text:#B8C2C9;     /* 10.8:1 bg, 9.8 pane: body, hero paragraphs, safety */
  --muted:#9AA5AD;    /* 7.8:1 bg, 7.1 pane: head paragraphs, descs, labels, status */
  --grey:#828E95;     /* 5.8:1 bg, 5.5 bg-2: dim second headline lines only */
  --faint:#808B93;    /* 5.6:1: footer fine print only */
  --rule:#1C2226; --rule-2:#2A3238;
  --ctl:#5C6870;      /* 3.4:1: borders of real controls */
  --accent:#22C8F0;   /* 9.9:1 bg, 9.3 bg-2 */
  --accent-hover:#5AD8F5; --on-accent:#061318;   /* 9.5:1 on accent */
  --accent-line:rgb(34 200 240 / .6); --accent-soft:rgb(34 200 240 / .35);
  --display:'Barlow Condensed','Arial Narrow',system-ui,sans-serif;
  --sans:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --wordmark:'Archivo',var(--sans);
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --pad:clamp(16px,4.4vw,64px); --w:1280px; --nav-h:76px; --sec:clamp(80px,10vw,152px);
}

/* ------------------------------------------------------------------ 2. base */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);scroll-behavior:smooth;scroll-padding-top:96px;-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--text);font:400 17px/1.65 var(--sans);-webkit-font-smoothing:antialiased;font-kerning:normal;overflow-wrap:break-word}
/* No UA bold anywhere: headings and b/strong inherit. */
h1,h2,h3{font-size:inherit;font-weight:inherit}
b,strong{font-weight:inherit;color:inherit}
ul,ol{list-style:none}
::selection{background:rgb(34 200 240 / .28);color:#fff}
a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--accent-line);text-underline-offset:.22em}
a:hover{text-decoration-color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}
.sr-only{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:12px;top:-60px;z-index:100;padding:10px 14px;border-radius:2px;background:var(--ink);color:var(--bg);font:500 14px/1 var(--sans);text-decoration:none}
.skip:focus{top:12px}
.wrap{max-width:var(--w);margin-inline:auto;padding-inline:var(--pad)}
.num{color:var(--ink);font-variant-numeric:tabular-nums}
.mail{color:var(--ink);white-space:nowrap}
.note{font-size:15px;line-height:1.6;color:var(--muted)}
@media (max-width:640px){body{font-size:16px}}

/* ------------------------------------------------------------------ 3. type scale
   h1.display / h2.display > span.l + " " + span.l[.cy|.dim]  (the literal space keeps words apart for screen readers) */
h1.display{font:600 clamp(56px,9.2vw,152px)/.9 var(--display);letter-spacing:-.012em;color:var(--ink)}
h2.display{font:600 clamp(44px,6.4vw,104px)/.94 var(--display);letter-spacing:-.01em;color:var(--ink);text-wrap:balance}
.display .l{display:block}
.cy{color:var(--accent)}
.dim{color:var(--grey)}
.h-sans{font:500 clamp(28px,3vw,40px)/1.15 var(--sans);letter-spacing:-.015em;color:var(--ink)}
h3{font:500 clamp(22px,2vw,28px)/1.2 var(--sans);color:var(--ink)}
.eyebrow{font:500 13px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.eyebrow.line::before{content:"";display:inline-block;width:40px;height:1px;margin-right:16px;vertical-align:middle;background:currentColor}
.eyebrow.plain{color:var(--muted)}
.label{font:500 12px/1.5 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

/* ------------------------------------------------------------------ 4. sections
   <section id aria-labelledby [class="alt"]><div class="wrap sec">
     <div class="head"><div><p class="eyebrow">NN / Label</p><h2 class="display" id>…</h2></div><p class="head-p">…</p></div>
     …content…
   </div></section>        (.head-p is optional) */
section{border-top:1px solid var(--rule)}
section.alt{background:var(--bg-2)}
.sec{padding-block:var(--sec)}
.sec.tight{padding-top:clamp(48px,6vw,88px)}
.head{display:grid;gap:24px;margin-bottom:clamp(40px,5vw,72px)}
.head .eyebrow{margin-bottom:20px}
.head-p{font-size:17px;line-height:1.7;color:var(--muted);max-width:30em}
/* Two columns only from 1100px: below that the 26rem paragraph column squeezes the headline into broken lines. */
@media (min-width:1100px){
  .head{grid-template-columns:minmax(0,1fr) minmax(0,26rem);column-gap:64px;align-items:end}
  .head>div:only-child{grid-column:1/-1}   /* no .head-p: the headline takes the full width */
  .head-p{padding-bottom:.5em}
}

/* ------------------------------------------------------------------ 5. nav (both pages)
   nav[aria-label=Main] > .wrap.row > a.lockup(svg + span.wd) + ul.links > li > a  +  a.btn.line.nav-btn("The token" + svg) */
nav{position:sticky;top:0;z-index:40;background:rgb(10 12 14 / .82);border-bottom:1px solid rgb(255 255 255 / .07)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){nav{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}}
nav .row{display:flex;align-items:center;gap:24px;min-height:var(--nav-h)}
.lockup{display:inline-flex;align-items:center;gap:12px;min-height:44px;margin-right:auto;color:#fff;text-decoration:none}
.lockup svg{width:30px;height:30px;flex:none}
.wd{font-family:var(--wordmark);font-weight:900;font-style:italic;font-size:26px;line-height:1;letter-spacing:-.005em;text-transform:uppercase;color:#fff}
.links{display:flex;gap:2px}
.links a{display:flex;align-items:center;min-height:44px;padding:0 14px;font:400 15px/1 var(--sans);color:var(--text);text-decoration:none;white-space:nowrap}
.links a:hover{color:var(--ink)}
.links a:focus-visible{outline-offset:-2px}
/* .btn.nav-btn: two classes so these win over the generic .btn rules further down. */
.btn.nav-btn{min-height:48px;padding:0 20px;gap:14px;font-size:15px}
.nav-btn svg{width:14px;height:14px;flex:none;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round}
/* 761–1023: same single row, tighter, so lockup + 5 links + button fit without scrolling. */
@media (min-width:761px) and (max-width:1023px){
  nav .row{gap:16px}
  .links a{padding:0 9px;font-size:14px}
  .btn.nav-btn{padding:0 16px;gap:12px}
}
/* 760 and below: static, two rows, no JS. Row 1 lockup + button, row 2 all five links. */
@media (max-width:760px){
  html{scroll-padding-top:16px}
  nav{position:static}
  nav .row{flex-wrap:wrap;row-gap:0;padding-block:8px;min-height:0}
  .links{order:3;flex:1 0 100%;justify-content:space-between;margin-inline:-7px}
  .links a{padding:0 7px;font-size:14px}
  .btn.nav-btn{min-height:44px;padding:0 16px}
}
@media (max-width:420px){.links{margin-inline:-5px}.links a{padding:0 5px;font-size:13px}}
@media (max-width:350px){.links{margin-inline:-3px}.links a{padding:0 3px;font-size:12.5px}}

/* ------------------------------------------------------------------ 6. buttons
   p.acts > a.btn.solid | a.btn.line | a.tlink.  "→" lives in <span aria-hidden="true">. */
.acts{display:flex;flex-wrap:wrap;align-items:center;gap:16px 32px;margin-top:clamp(28px,3.4vw,44px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:0 28px;border-radius:2px;font:500 16px/1 var(--sans);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .15s,border-color .15s,color .15s}
.btn.solid{background:var(--accent);border:1px solid var(--accent);color:var(--on-accent)}
.btn.solid:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn.line{background:transparent;border:1px solid var(--ctl);color:var(--ink)}
.btn.line:hover{border-color:var(--ink)}
.tlink{display:inline-block;padding:14px 0 6px;font:500 16px/1.5 var(--sans);color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:rgb(242 245 247 / .5);text-underline-offset:10px}
.tlink:hover{text-decoration-color:var(--accent)}

/* ------------------------------------------------------------------ 7. home hero
   <header class="hero" id="top"><div class="art" aria-hidden="true"></div><div class="wrap hero-in">
     p.eyebrow.line + h1.display + p.lede + p.sub + p.acts + div.hero-meta(span)
   </div></header>
   The photo runs up under the translucent nav. The scrim (::before) is tuned by measurement against the
   composited background, not by eye: re-measure whenever hero.jpg changes. Measured 1 Oct 2026 on the dark
   wheel (1672x941): the image sits at 85% so the hub stays in frame, and the 1100px+ scrim stops sit 16 points
   right of the first draft, which had left the cyan headline line over the spokes under 4.5:1. */
.hero{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;min-height:clamp(620px,92vh,940px);min-height:clamp(620px,92svh,940px);margin-top:calc(-1 * var(--nav-h) - 1px);padding-top:calc(var(--nav-h) + clamp(56px,10vh,140px));padding-bottom:clamp(28px,4vw,48px)}
.hero-in{display:flex;flex-direction:column;flex:1;width:100%}
.hero>.art{position:absolute;z-index:-2;top:0;right:0;bottom:0;width:min(66%,1320px);background:var(--bg) url(/hero.jpg) 85% 50%/cover no-repeat;pointer-events:none;animation:hero-in 1.6s cubic-bezier(.2,.7,.2,1) both}
@keyframes hero-in{from{opacity:0;transform:scale(1.04)}to{opacity:1;transform:none}}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  /* --te: right edge of "Worth preserving." (6.15em incl. tracking), so the scrim follows the headline at every width.
     Re-key if the h1 text or size changes. */
  --te:calc(50% - min(50%, 640px) + min(4.4vw, 64px) + min(9.2vw, 152px) * 6.15);
  background:
  linear-gradient(90deg,var(--bg) 0%,var(--bg) calc(var(--te) - 12vw),rgb(10 12 14 / .9) calc(var(--te) + 1vw),rgb(10 12 14 / .5) calc(var(--te) + 7vw),rgb(10 12 14 / .15) calc(var(--te) + 13vw),rgb(10 12 14 / 0) calc(var(--te) + 18vw)),
  linear-gradient(0deg,var(--bg) 0%,rgb(10 12 14 / 0) 30%),
  linear-gradient(180deg,rgb(10 12 14 / .55) 0%,rgb(10 12 14 / 0) 16%)}
.hero .eyebrow{margin-bottom:28px}
.hero .lede{margin-top:clamp(24px,3vw,36px);font-size:clamp(19px,1.7vw,23px);line-height:1.5;color:var(--text);max-width:min(31ch,44vw)}
.hero .sub{margin-top:16px;font-size:16px;line-height:1.65;color:var(--text);max-width:min(36ch,44vw)}
.hero-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:auto;padding-top:clamp(48px,8vw,112px);font:500 12px/1.5 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
@media (min-width:761px) and (max-width:1099px){
  .hero>.art{width:62%}
  .hero::before{background:
    linear-gradient(90deg,var(--bg) 0%,var(--bg) 40%,rgb(10 12 14 / .92) 52%,rgb(10 12 14 / .74) 64%,rgb(10 12 14 / .34) 80%,rgb(10 12 14 / 0) 94%),
    linear-gradient(0deg,var(--bg) 0%,rgb(10 12 14 / 0) 30%),
    linear-gradient(180deg,rgb(10 12 14 / .75) 0%,rgb(10 12 14 / 0) 22%)}
}
/* Phones: the photo becomes a band above the text. */
@media (max-width:760px){
  .hero{margin-top:0;padding-top:0;min-height:0;display:block}
  .hero>.art{top:0;left:0;right:0;bottom:auto;width:100%;height:340px;background-position:65% 50%}
  .hero::before{inset:0 0 auto 0;height:340px;background:linear-gradient(180deg,rgb(10 12 14 / .3) 0%,rgb(10 12 14 / .55) 50%,rgb(10 12 14 / .9) 80%,var(--bg) 100%)}
  .hero-in{padding-top:270px;padding-bottom:40px}
  .hero h1.display{font-size:min(calc((100vw - 32px) / 6.4), 72px)}   /* "Worth preserving." stays on one line */
  .hero .lede,.hero .sub{max-width:none}
}

/* ------------------------------------------------------------------ 8. hero figures (home)
   div.wrap > div.figs[role=list] > div.fig[role=listitem] > p.top(span.n + " " + span.k) + p.d */
.figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--rule-2)}
.fig{padding:clamp(28px,3vw,40px) clamp(20px,3vw,40px) clamp(40px,5vw,64px)}
.fig:first-child{padding-left:0}
.fig+.fig{border-left:1px solid var(--rule-2)}
.fig .top{display:flex;align-items:center;flex-wrap:wrap;gap:6px 16px}
.fig .n{font:600 clamp(48px,5.2vw,76px)/1 var(--display);letter-spacing:-.01em;color:var(--ink);font-variant-numeric:lining-nums}
.fig .k{font:500 13px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.fig .d{margin-top:14px;font-size:15px;line-height:1.6;color:var(--muted);max-width:28ch}
@media (max-width:760px){
  .figs{grid-template-columns:1fr}
  .fig,.fig:first-child{padding:24px 0}
  .fig+.fig{border-left:0;border-top:1px solid var(--rule)}
}

/* ------------------------------------------------------------------ 9. ecosystem (static: every row in the selected look)
   ol.eco > li.app[aria-labelledby=app-N] >
     div.app-id(span.no[aria-hidden] + h3#app-N + span.verb) +
     div.app-pane(span.tag[.live] + p.pane-h + p.pane-p + p.pane-foot) */
.eco{border:1px solid var(--rule-2);border-radius:2px;overflow:hidden}
.app{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.app+.app{border-top:1px solid var(--rule-2)}
.app-id{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:baseline;column-gap:24px;align-content:start;padding:clamp(28px,3.4vw,48px);background:var(--panel)}
.app-id .no{font:500 13px/1 var(--sans);letter-spacing:.08em;color:var(--accent);font-variant-numeric:tabular-nums}
.app-id h3{font:400 clamp(22px,2.2vw,30px)/1.2 var(--sans);letter-spacing:-.01em;color:var(--ink)}
.app-id .verb{font:500 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.app-pane{padding:clamp(28px,3.4vw,48px);background:radial-gradient(120% 120% at 100% 0%,rgb(34 200 240 / .08),rgb(34 200 240 / 0) 60%),var(--pane)}
.tag{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;border:1px solid var(--ctl);border-radius:2px;font:500 12px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.tag.live{color:var(--accent);border-color:var(--accent-soft)}
.pane-h{margin-top:28px;font:600 clamp(34px,3.6vw,56px)/1 var(--display);color:var(--ink);max-width:7em;text-wrap:balance}   /* always two lines */
.pane-p{margin-top:18px;font-size:16.5px;line-height:1.65;color:var(--text);max-width:34em}
.pane-foot{margin-top:24px;padding-top:16px;border-top:1px solid var(--rule-2);font-size:14px;line-height:1.55;color:var(--muted)}
@media (min-width:1001px){
  .app-id{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
  .app-id .verb{margin-top:auto}
}
@media (max-width:1000px){
  .app{grid-template-columns:1fr}
  .app-id{padding:24px 20px 20px}
  .app-pane{padding:24px 20px 28px}
  .pane-h{margin-top:20px}
}

/* ------------------------------------------------------------------ 10. timeline (rewards, section.alt)
   ol.road > li > div.node > span.n[aria-hidden]"01" ; time.when[datetime] ; h3 ; p */
.road{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:clamp(24px,3vw,48px)}
.road>li{min-width:0}
.road .node{display:flex;align-items:center;margin-bottom:24px}
.road .node::before{content:"";flex:1;height:1px;background:var(--rule-2)}
.road .n{flex:none;display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--accent-soft);border-radius:50%;font:500 13px/1 var(--sans);color:var(--accent);font-variant-numeric:tabular-nums}
.road .when{display:block;font:500 13px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.road h3{margin-top:18px}
.road p{margin-top:12px;font-size:16px;line-height:1.65;color:var(--text);max-width:30em}
@media (max-width:760px){.road{grid-template-columns:1fr;row-gap:44px}}

/* ------------------------------------------------------------------ 11. weights table
   div.weights-block > h3.h-sans#purpose + p.lead + div.weights[role=table][aria-labelledby=purpose]
     > div.sr-only[role=row](3 × span[role=columnheader]) + div.entry[role=row] > span.term[role=rowheader] + span.val[role=cell] + span.desc[role=cell]
   ; p.note */
.weights-block{margin-top:clamp(64px,8vw,112px)}
.weights-block .lead{margin-top:12px;max-width:36em;color:var(--muted)}
.weights{margin-top:28px;border-top:1px solid var(--rule-2)}
.weights .entry{display:grid;grid-template-columns:14rem 7rem minmax(0,1fr);column-gap:32px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--rule-2)}
.weights .term{font:400 19px/1.35 var(--sans);color:var(--ink)}
.weights .val{font:600 clamp(36px,3.6vw,48px)/1 var(--display);color:var(--ink);font-variant-numeric:tabular-nums}
.weights .desc{font-size:15.5px;line-height:1.6;color:var(--muted)}
.weights+.note{margin-top:16px}
@media (max-width:760px){
  .weights .entry{grid-template-columns:minmax(0,1fr) auto;row-gap:8px}
  .weights .desc{grid-column:1/-1}
}

/* ------------------------------------------------------------------ 12. points strip + details fold
   div.strip > p + a.tlink ;  details.more > summary + div.more-body > ul > li   (the plus is drawn, not a glyph) */
.strip{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;margin-top:clamp(56px,7vw,96px);padding:16px 0;border-block:1px solid var(--rule-2)}
.strip p{font-size:17px;color:var(--ink)}
details.more{margin-top:32px;border-block:1px solid var(--rule-2)}
.strip+details.more{margin-top:0;border-top:0}
details.more>summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:16px 0;cursor:pointer;list-style:none;font:400 17px/1.4 var(--sans);color:var(--text)}
details.more>summary:hover{color:var(--ink)}
details.more>summary::-webkit-details-marker{display:none}
details.more>summary::after{content:"";flex:none;width:14px;height:14px;background:linear-gradient(var(--accent),var(--accent)) center/100% 2px no-repeat,linear-gradient(var(--accent),var(--accent)) center/2px 100% no-repeat;transition:transform .2s ease}
details.more[open]>summary::after{transform:rotate(45deg)}
details.more>summary:focus-visible{outline-offset:2px}
.more-body{padding-bottom:24px}
.more-body li{position:relative;padding:8px 0 8px 22px;font-size:15.5px;line-height:1.6;color:var(--text);max-width:44em}
.more-body li::before{content:"";position:absolute;left:0;top:1.3em;width:10px;height:1px;background:var(--accent)}

/* ------------------------------------------------------------------ 13. supply
   Hooks written by supply.js, do not rename: #bar > span ; #legend > .row-s > .sw + .nm(.sub) + .addr + .amt(.pct) ;
   #status > .dotlive | .dotold ; p.note.backing#backing.
   div.supply > div.supply-top(div > p.eyebrow.plain + p.total(span.n + " " + span.u) ; p.nets) + p.intro + #bar + #legend + #status
   then p.note.backing#backing ; details.more */
.supply-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px 32px;padding-bottom:20px;border-bottom:1px solid var(--rule-2)}
.total{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;margin-top:10px}
.total .n{font:600 clamp(52px,9vw,128px)/.92 var(--display);letter-spacing:-.01em;color:var(--ink);font-variant-numeric:tabular-nums lining-nums}
.u{font:500 14px/1 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.nets{font:500 12px/1.4 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.supply .intro{margin-top:20px;max-width:40em;font-size:16px;color:var(--muted)}
.bar{display:flex;height:4px;margin-top:28px;background:var(--rule-2);border-radius:2px;overflow:hidden}
.bar span{display:block;height:100%;min-width:0;transition:width .6s ease}
.bar span+span{box-shadow:inset 2px 0 0 var(--bg)}
.legend{margin-top:8px}
.row-s{display:grid;grid-template-columns:10px minmax(0,1fr) 13rem minmax(9rem,auto);gap:20px;align-items:baseline;padding:20px 0;border-bottom:1px solid var(--rule);font-size:16px;line-height:1.45}
.sw{width:10px;height:10px;border-radius:50%;align-self:start;margin-top:7px}
.row-s .nm{color:var(--ink)}
.row-s .sub{display:block;margin-top:4px;font-size:14px;color:var(--muted);text-wrap:balance}
.row-s .addr{font:400 14px/1.5 var(--sans);color:var(--muted);overflow-wrap:anywhere}
.row-s .addr a{font:400 13.5px/1.5 var(--mono)}
.row-s .amt{font:600 clamp(24px,2.2vw,30px)/1.05 var(--display);color:var(--ink);text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums lining-nums}
.row-s .pct{display:block;margin-top:6px;font:400 13px/1.3 var(--sans);color:var(--muted)}
@media (max-width:760px){.row-s{grid-template-columns:10px minmax(0,1fr) auto}.row-s .addr{grid-column:2/-1;grid-row:2}}
@media (max-width:480px){.row-s{grid-template-columns:10px minmax(0,1fr)}.row-s .amt{grid-column:2;grid-row:2;text-align:left}.row-s .addr{grid-column:2;grid-row:3}}
.status{margin-top:16px;font-size:14px;line-height:1.5;color:var(--muted)}
.status .dotlive,.status .dotold{display:inline-block;width:8px;height:8px;margin-right:10px;vertical-align:0;border-radius:50%}
.status .dotlive{background:var(--accent);box-shadow:0 0 0 3px rgb(34 200 240 / .18)}
.status .dotold{border:1.5px solid var(--muted)}
.backing{margin-top:12px;max-width:44em}

/* ------------------------------------------------------------------ 14. contracts (section#contracts > div.wrap.sec.tight)
   h2.h-sans#h-contracts + p + div.contracts > article.contract > h3.net + span.hash#c-eth|#c-base + span.acts > button.mini[data-copy] + a.mini
   + p#copy-status.sr-only[role=status] + p.note + h3.label.fixed-h + dl.fixed > div > dt + dd
   supply.js's copy fallback needs .contract > .hash. Hashes are always shown in full. */
.sec>.h-sans+p{margin-top:16px;max-width:40em;color:var(--text)}
.contracts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:32px}
.contract{display:flex;flex-direction:column;gap:16px;padding:clamp(24px,3vw,36px);border:1px solid var(--rule-2);border-radius:2px;background:linear-gradient(180deg,#0F1416,#0B0E10)}
.contract .net{font:500 13px/1.4 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.contract .hash{font:400 15px/1.55 var(--mono);color:var(--ink);overflow-wrap:anywhere}
.contract .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:0}
.mini{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;border:1px solid var(--ctl);border-radius:2px;background:none;font:500 14px/1 var(--sans);color:var(--ink);text-decoration:none;cursor:pointer;white-space:nowrap}
.mini:hover{border-color:var(--ink)}
.mini[data-done]{color:var(--accent);border-color:var(--accent)}
.contracts+.note,.contracts+.sr-only+.note{margin-top:16px}
@media (max-width:860px){.contracts{grid-template-columns:1fr}}
@media (max-width:420px){.contract .hash{font-size:13px}}
.fixed-h{margin-top:56px}
.fixed{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;margin-top:20px}
.fixed>div{padding-top:20px;border-top:1px solid var(--rule-2)}
.fixed dt{font:500 17px/1.35 var(--sans);color:var(--ink)}
.fixed dd{margin-top:8px;font-size:15.5px;line-height:1.6;color:var(--muted)}
@media (max-width:860px){.fixed{grid-template-columns:1fr;gap:24px}}

/* ------------------------------------------------------------------ 15. Fund card (home section#fund > div.wrap.sec > div.fund-card)
   div(p.eyebrow + h2.display) + div(p.fund-fig(span.n + " " + span.u) + p.fund-p + p.fund-p + p.acts > a.btn.line + p.small) */
.fund-card{display:grid;gap:40px;padding:clamp(28px,5.4vw,80px);border:1px solid rgb(34 200 240 / .22);border-radius:2px;background:radial-gradient(90% 120% at 100% 0%,rgb(34 200 240 / .10),rgb(34 200 240 / 0) 60%),linear-gradient(180deg,#0E1416,#0B0F11)}
@media (min-width:900px){.fund-card{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);column-gap:72px;align-items:start}}
.fund-card .eyebrow{margin-bottom:20px}
.fund-card h2.display{font-size:clamp(48px,7vw,112px)}
.fund-fig{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px}
.fund-fig .n{font:600 clamp(48px,5vw,72px)/1 var(--display);color:var(--ink)}
.fund-p{margin-top:16px;color:var(--text);max-width:34em}
.fund-card .acts{margin-top:28px}
.fund-card .small{margin-top:24px;font-size:14px;line-height:1.6;color:var(--muted)}

/* ------------------------------------------------------------------ 16. safety (both pages; never inside <details>)
   ul.safe > li   (two columns from 900px; an odd count just ends, the shared bottom rule closes the grid) */
.safe{display:grid;column-gap:64px;border-bottom:1px solid var(--rule)}
.safe>li{position:relative;padding:20px 0 20px 32px;border-top:1px solid var(--rule);font-size:16px;line-height:1.6;color:var(--text)}
.safe>li::before{content:"";position:absolute;left:0;top:calc(20px + .8em);width:14px;height:2px;background:var(--accent)}
@media (min-width:900px){.safe{grid-template-columns:repeat(2,minmax(0,1fr))}}
.after-safe{margin-top:32px}
/* Standalone text links (not inside a sentence) get a 44px target too. */
.after-safe a,.register+p a,a.site{display:inline-flex;align-items:center;min-height:44px}

/* ------------------------------------------------------------------ 17. footer (both pages)
   footer > div.wrap > div.foot-top(span.wd"Tyre" + p.motto + span.site | a.site) + p.fine + div.meta(span + a|span + span) */
footer{border-top:1px solid var(--rule);padding:clamp(56px,7vw,96px) 0 40px}
.foot-top{display:grid;gap:16px;align-items:center;padding-bottom:40px;border-bottom:1px solid var(--rule)}
@media (min-width:761px){
  .foot-top{grid-template-columns:1fr auto 1fr}
  .foot-top>:last-child{justify-self:end}
  .motto{text-align:center}
}
.foot-top .wd{font-size:30px}
.motto{font:600 clamp(26px,2.6vw,34px)/1.1 var(--display);color:var(--ink)}
.site{font:500 14px/1.5 var(--sans);letter-spacing:.06em;color:var(--muted)}
a.site{color:var(--muted)}
footer .fine{margin-top:32px;max-width:80ch;font-size:13.5px;line-height:1.75;color:var(--faint)}
footer .meta{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px 32px;margin-top:28px;font:500 12px/1.5 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
footer .meta a{display:inline-flex;align-items:center;min-height:44px;color:var(--muted)}
footer .meta a,.register+p a{gap:.35em}   /* inline-flex collapses the space before the ↗ */
@media (max-width:760px){footer .meta{flex-direction:column;align-items:flex-start;gap:4px}}

/* ------------------------------------------------------------------ 18. /fund
   Hero: div.wrap > header.hero.solo > p.eyebrow.line + h1.display + p.lede + div.round[role=note] > i[aria-hidden] + p > span.lead
   (no image, no scrim, no negative margin: every home-hero rule is reset here) */
.hero.solo{display:block;position:static;isolation:auto;overflow:visible;min-height:0;margin-top:0;padding-block:clamp(64px,10vw,160px) clamp(48px,6vw,88px)}
.hero.solo::before{content:none}
.hero.solo h1.display{font-size:clamp(52px,8.4vw,136px)}
.hero.solo .eyebrow{margin-bottom:28px}
.hero.solo .lede{margin-top:32px;max-width:40em;font-size:clamp(18px,1.6vw,21px);line-height:1.6;color:var(--text)}
.round{display:flex;align-items:flex-start;gap:14px;margin-top:36px;max-width:46em;padding:20px 24px;border:1px solid var(--accent-soft);border-radius:2px;background:rgb(34 200 240 / .05)}
.round i{flex:none;width:10px;height:10px;margin-top:.55em;border-radius:50%;border:1.5px solid var(--accent)}
.round p{font-size:16px;line-height:1.65;color:var(--text)}
.round .lead{color:var(--ink)}   /* colour only, never weight */

/* Kinds: ol.kinds > li > span.no[aria-hidden] + h3 + p */
.kinds{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid var(--rule-2);border-radius:2px;overflow:hidden;background:var(--panel)}
.kinds>li{padding:clamp(24px,3.4vw,44px)}
.kinds>li:nth-child(n+3){border-top:1px solid var(--rule-2)}
.kinds>li:nth-child(even){border-left:1px solid var(--rule-2)}
.kinds .no{display:block;font:500 13px/1 var(--sans);letter-spacing:.08em;color:var(--accent)}
.kinds h3{margin-top:18px;font:600 clamp(30px,3vw,44px)/1 var(--display);color:var(--ink)}
.kinds p{margin-top:14px;font-size:16px;line-height:1.65;color:var(--text);max-width:34em}
@media (max-width:760px){
  .kinds{grid-template-columns:1fr}
  .kinds>li+li{border-top:1px solid var(--rule-2)}
  .kinds>li:nth-child(even){border-left:0}
}

/* Steps: ol.steps > li > span.n[aria-hidden]"01" + div > h3 + p (+ p) ; then div.after-steps > details.more + p.note */
.steps{max-width:52rem}
.steps>li{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:28px;padding-bottom:48px}
.steps>li:last-child{padding-bottom:0}
.steps>li:not(:last-child)::before{content:"";position:absolute;left:20px;top:48px;bottom:8px;width:1px;background:var(--rule-2)}
.steps .n{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--accent-soft);border-radius:50%;font:500 13px/1 var(--sans);color:var(--accent);font-variant-numeric:tabular-nums}
.steps h3{margin-top:6px}
.steps p{margin-top:12px;font-size:16.5px;line-height:1.7;color:var(--text);max-width:38em}
.steps .tip{margin-top:20px;padding:14px 18px;border:1px solid var(--rule-2);border-radius:2px;background:var(--panel);font-size:15.5px;line-height:1.6}
@media (max-width:520px){.steps>li{column-gap:16px}}
.after-steps{margin-top:40px;max-width:52rem}
.after-steps details.more{margin-top:0}
.after-steps .note{margin-top:16px}

/* Five tests: dl.tests > div > dt + dd ; then div.prose > p + h3.h3-sm + p + p + details.more */
.tests{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px}
.tests>div{padding-top:20px;border-top:1px solid var(--accent-soft)}
.tests dt{font:600 clamp(28px,2.6vw,36px)/1 var(--display);color:var(--ink)}
.tests dd{margin-top:10px;font-size:15px;line-height:1.55;color:var(--muted)}
@media (max-width:1000px){.tests{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:560px){.tests{grid-template-columns:1fr}}
.prose{max-width:44em;margin-top:40px}
.prose>*+*{margin-top:16px}
.prose>.h3-sm{margin-top:48px}
.prose>.h3-sm+*{margin-top:12px}
.prose>details.more{margin-top:32px}
.h3-sm{font:500 20px/1.3 var(--sans);color:var(--ink)}

/* Grants: p.figline(span.n + " " + span.u + " " + span.k) + p + dl.terms > div > dt + dd ; details.more ; div.register ; p > a */
.figline{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.figline .n{font:600 clamp(52px,6vw,88px)/1 var(--display);color:var(--ink);font-variant-numeric:tabular-nums}
.figline .k{font-size:15px;color:var(--muted)}
.figline+p{margin-top:16px;max-width:40em}
.terms{margin-top:32px;border-top:1px solid var(--rule-2)}
.terms>div{display:grid;grid-template-columns:12rem minmax(0,1fr);column-gap:32px;padding:18px 0;border-bottom:1px solid var(--rule-2)}
.terms dt{font:400 17px/1.5 var(--sans);color:var(--ink)}
.terms dd{font-size:15.5px;line-height:1.6;color:var(--muted)}
@media (max-width:640px){.terms>div{grid-template-columns:1fr;row-gap:4px}}
.terms+details.more{margin-top:0;border-top:0}
.register{margin-top:32px;padding:24px;border:1px dashed var(--rule-2);border-radius:2px;font-size:15.5px;line-height:1.6;color:var(--muted)}
.register+p{margin-top:20px}

/* ------------------------------------------------------------------ 19. forced colors, reduced motion */
@media (forced-colors:active){
  :focus-visible{outline:2px solid CanvasText}
  .lockup svg circle:first-child{stroke:CanvasText}
  .hero>.art,.hero::before{display:none}
  .bar span,.sw,.status .dotlive,.status .dotold,.round i,details.more>summary::after,.safe>li::before,.more-body li::before{forced-color-adjust:none}
  .btn,.mini,.tag,.road .n,.steps .n{border-color:ButtonText}
  .eco,.contract,.fund-card,.kinds,.round,.register,.steps .tip{border-color:CanvasText}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}