/* insimbi.net prototype. Tokens from iridium-payments/brand tokens/insimbi.tokens.json (light) */
:root{--cusp:#E85DB6;--cusp-deep:#B5237F;--cusp-wash:#2E1526;--on-cusp:#101315;--page:#101315;--raised:#171B1F;--sunken:#1E2429;
--ink:#EEF2F4;--ink-2:#CDD5DA;--ink-3:#8A949A;--hair:#252C32;--rule:#39434A;
--paper:#F4F6F7;--iridium:#B9C1C6;--strata-1:#14181B;--strata-2:#191E22;--seam:#C9D0D4;--black:#111417;--fired:#8FB0E0;--working:#D2A63A;--plated:#3FBF85;--void:#EA6259;
--sans:"Schibsted Grotesk",system-ui,sans-serif;--mono:"Martian Mono",ui-monospace,monospace;color-scheme:dark}
/* Rule: --cusp (magenta) is used ONLY on .control elements and the ring's control arc. */
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--page);color:var(--ink);font:400 17px/1.55 var(--sans);-webkit-font-smoothing:antialiased}
a{color:inherit;text-underline-offset:3px;text-decoration-color:var(--rule)}a:hover{text-decoration-color:var(--ink)}
.mono{font-family:var(--mono);font-size:13px;letter-spacing:-.01em}
.top{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:28px;padding:14px clamp(16px,4vw,40px);
 background:color-mix(in oklab,var(--page) 82%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--hair)}
.brand{display:flex;gap:8px;align-items:center;font-weight:700;letter-spacing:-.02em;text-decoration:none;font-size:19px}
.top nav{display:flex;gap:20px;font-size:15px}.top nav a{text-decoration:none;color:var(--ink-2)}.top nav a[aria-current]{color:var(--ink)}
.tools{margin-left:auto;display:flex;gap:8px}
.tools button{font:500 12px var(--mono);background:var(--raised);border:1px solid var(--hair);color:var(--ink);border-radius:999px;padding:7px 12px;cursor:pointer}
.agent-toggle[aria-pressed=true]{background:var(--ink);color:var(--page)}
.eyebrow{font:400 12px var(--mono);color:var(--ink-2);text-transform:uppercase;letter-spacing:.06em;margin:0 0 18px}
h1,h2{font-weight:700;letter-spacing:-.035em;line-height:.98;margin:0 0 22px;font-variation-settings:"wght" var(--w,700)}
h1{font-size:clamp(44px,7.4vw,112px)}h2{font-size:clamp(34px,5vw,72px);max-width:14ch}
.lede{font-size:clamp(18px,1.6vw,22px);color:var(--ink-2);max-width:34ch}
/* ---------- home: ring stage + panels ---------- */
.ring-stage{position:fixed;inset:0;z-index:0;pointer-events:none;display:grid;place-items:center}
.ring-poster,#ring{grid-area:1/1;width:min(78vmin,780px);height:auto;aspect-ratio:1;transform:translateX(26vw);transition:opacity .8s}
#ring{width:100vw;height:100vh;transform:none;opacity:0}
.ring-live .ring-poster{opacity:0}.ring-live #ring{opacity:1}
main{position:relative;z-index:1}
.panel{min-height:100vh;padding:18vh clamp(16px,6vw,96px) 12vh;display:flex;flex-direction:column;justify-content:center;max-width:860px}
.panel h1,.panel h2{animation:settle linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
@keyframes settle{from{--w:420;transform:translateY(18px)}to{--w:760;transform:none}}
@property --w{syntax:"<number>";inherits:true;initial-value:700}
.ask{all:unset;cursor:text;display:flex;align-items:center;gap:14px;max-width:620px;margin-top:26px;padding:16px 18px;background:var(--raised);
 border:1.5px solid var(--cusp);border-radius:14px;box-shadow:0 1px 0 var(--hair),0 18px 50px -24px color-mix(in oklab,var(--cusp) 50%,transparent);transition:transform .2s cubic-bezier(.2,.9,.3,1.4)}
.ask:hover{transform:translateY(-2px)}.ask:active{transform:scale(.985)}
.ask-k{font:600 13px var(--mono);color:var(--cusp)}.ask-q{flex:1;font:400 15px var(--mono);color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ask-q::after{content:"█";animation:blink 1s steps(1) infinite;color:var(--ink)}@keyframes blink{50%{opacity:0}}
kbd{font:500 11px var(--mono);border:1px solid var(--hair);border-radius:6px;padding:3px 6px;color:var(--ink-2)}
.hint{color:var(--ink-2);margin-top:14px}
.controls{list-style:none;padding:0;margin:8px 0 0;display:grid;gap:10px;max-width:560px}
.controls li{display:flex;gap:16px;align-items:center;padding:16px 18px;background:var(--raised);border:1px solid var(--hair);border-radius:14px}
.controls b{display:block;font-size:19px}.controls span{color:var(--ink-2);font-size:15px}
.sw{position:relative;width:46px;height:26px;flex:none}.sw input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer;z-index:1}
.knob{position:absolute;inset:0;border-radius:99px;background:var(--rule);transition:background .25s}
.knob::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.sw input:checked+.knob{background:var(--cusp)}.sw input:checked+.knob::after{transform:translateX(20px)}
.sw input:focus-visible+.knob{outline:2px solid var(--cusp);outline-offset:3px}
.ledger{border-collapse:collapse;width:100%;max-width:600px;background:var(--raised);border:1px solid var(--hair);border-radius:14px;overflow:hidden}
.ledger th,.ledger td{padding:14px 18px;border-bottom:1px dashed var(--hair);text-align:left;font-weight:400}.ledger td{text-align:right}
.ledger tr:last-child th{color:var(--ink);font-weight:600}
/* dot-matrix numerals: mono glyphs masked through a dot grid */
.dots{font:600 22px/1 var(--mono);letter-spacing:.04em;-webkit-mask:radial-gradient(circle,#000 52%,#0000 56%) 0 0/4px 4px;mask:radial-gradient(circle,#000 52%,#0000 56%) 0 0/4px 4px}
.cta{display:inline-block;background:var(--cusp);color:var(--on-cusp);text-decoration:none;font-weight:600;padding:14px 22px;border-radius:999px;transition:transform .2s cubic-bezier(.2,.9,.3,1.4)}
.cta:hover{background:var(--cusp-deep);transform:translateY(-2px)}.ghost{margin-left:14px}
/* ---------- text-first sub pages ---------- */
.doc{max-width:720px;margin:0 auto;padding:12vh 24px 16vh}.doc h1{font-size:clamp(40px,6vw,76px)}
.doc pre,.doc .mono{white-space:pre-wrap}.doc pre{background:var(--raised);border:1px solid var(--hair);border-radius:12px;padding:18px;font:400 13px/1.7 var(--mono);overflow:auto}
.index{list-style:none;padding:0;border-top:1px solid var(--hair)}.index li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--hair)}.index span{color:var(--ink-2)}
.rates{width:100%;border-collapse:collapse}.rates th,.rates td{padding:14px 0;border-bottom:1px solid var(--hair);text-align:left;font-weight:400}.rates td{text-align:right}
.steps li{margin-bottom:10px}.stub{font:400 12px var(--mono);color:var(--ink-2);border-top:1px dashed var(--rule);padding-top:12px;margin-top:40px}
/* ---------- agent view ---------- */
.agent{position:relative;z-index:2;max-width:820px;margin:0 auto;padding:10vh 24px;white-space:pre-wrap;font-size:13px;line-height:1.7}
body.agent-on main,body.agent-on .ring-stage{display:none}
/* ---------- footer + cmdk ---------- */
.foot{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;padding:28px clamp(16px,4vw,40px);border-top:1px solid var(--hair);color:var(--ink-2);background:var(--page)}
.cmdk{width:min(640px,94vw);border:1px solid var(--hair);border-radius:16px;padding:0;background:var(--raised);box-shadow:0 30px 80px -20px #11141766}
.cmdk::backdrop{background:#11141733;backdrop-filter:blur(3px)}
.cmdk input{width:100%;border:0;border-bottom:1px solid var(--hair);padding:18px 20px;font:400 16px var(--mono);outline:none;caret-color:var(--cusp);background:transparent}
.cmdk ul{list-style:none;margin:0;padding:8px;max-height:50vh;overflow:auto}.cmdk li a{display:flex;justify-content:space-between;padding:10px 12px;border-radius:8px;text-decoration:none}
.cmdk li a:hover,.cmdk li a.sel{background:var(--sunken)}.cmdk li span{color:var(--ink-3)}.cmdk .hint{padding:0 20px 16px}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}
@media (max-width:760px){.ring-live #ring{opacity:.35}.dots{font-size:14px}.ledger th,.ledger td{padding:12px}.top nav{display:none}.ring-poster{transform:translate(30vw,-24vh);width:78vw;opacity:.45}
 .panel{padding-top:14vh}.ask-q{font-size:13px}.ghost{display:inline-block;margin:14px 0 0}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

/* ================= dark Technicolor revision: edge + depth (human view only) ================= */
h1,h2{font-weight:800;letter-spacing:-.055em;line-height:.88;font-variation-settings:"wght" var(--w,820)}
h1{font-size:clamp(46px,6.9vw,120px)}h2{font-size:clamp(42px,7.2vw,120px);max-width:12ch}
.panel h1 .x,.panel h2 .x{color:var(--paper)}
@keyframes settle{from{--w:500;transform:translateY(28px) skewY(2deg)}to{--w:860;transform:none}}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;color:var(--ink)}
.eyebrow::before{content:"";display:inline-block;width:28px;height:8px;margin-right:10px;background:var(--iridium);vertical-align:1px}
/* depth planes: parallax grid floor, soft ring shadow, film grain */
.plane{position:fixed;inset:-20vh -10vw;z-index:0;pointer-events:none}
.plane-grid{background:linear-gradient(var(--hair) 1px,transparent 1px) 0 0/100% 64px,linear-gradient(90deg,var(--hair) 1px,transparent 1px) 0 0/64px 100%;
 opacity:.55;transform:perspective(800px) rotateX(62deg) translateY(30vh);transform-origin:50% 100%;
 -webkit-mask:linear-gradient(transparent 30%,#000 70%);mask:linear-gradient(transparent 30%,#000 70%);
 animation:drift linear both;animation-timeline:scroll(root)}
@keyframes drift{to{background-position:0 640px,0 0}}
.floor{grid-area:1/1;align-self:end;width:min(70vmin,700px);height:60px;margin-bottom:12vh;transform:translateX(26vw);border-radius:50%;
 background:radial-gradient(closest-side,#000c,#0000);filter:blur(10px)}
.grain{position:fixed;inset:0;z-index:4;pointer-events:none;opacity:.13;mix-blend-mode:overlay;
 background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.ring-poster{filter:drop-shadow(0 40px 60px #000)}
/* glass layers over the ring */
.ask,.controls li,.ledger{background:color-mix(in oklab,var(--raised) 55%,transparent);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);
 border-color:#ffffff1f;box-shadow:inset 0 1px 0 #ffffff14,0 30px 60px -30px #000}
.ask{border:1.5px solid var(--cusp);box-shadow:0 0 0 6px color-mix(in oklab,var(--cusp) 14%,transparent),0 30px 80px -20px color-mix(in oklab,var(--cusp) 45%,transparent)}
/* section cut: clean full-bleed hard edge, single hairline */
.cut{display:block;width:100%;height:0;margin:0;border:0;border-top:1px solid var(--seam);position:relative;z-index:2}
@keyframes wipe{from{transform:scaleX(0)}to{transform:scaleX(1)}}
/* contrast/tension: inverted hard-edged paper slabs */
.panel.invert{max-width:none;background:var(--paper);color:var(--black);position:relative;z-index:2}
.panel.invert .lede{color:#2b3237}.panel.invert .eyebrow{color:var(--black)}.panel.invert .eyebrow::before{background:var(--black)}
.panel.invert h2{max-width:13ch;font-size:clamp(48px,8.4vw,140px)}
.ledger tr:last-child th{color:var(--paper)}
.cta{box-shadow:0 0 0 1px #fff3,0 18px 40px -12px var(--cusp)}
#ring{filter:none}
@media (max-width:760px){.floor{display:none}.plane-grid{opacity:.35}}
@media (prefers-reduced-motion:reduce){.plane-grid{transform:perspective(800px) rotateX(62deg) translateY(30vh)}}

/* ================= origin theme (undercurrent): reef strata, iridium ================= */
.plane-grid{background:
  linear-gradient(transparent 0 61%,color-mix(in oklab,var(--seam) 35%,transparent) 61% 61.2%,transparent 61.4%) 0 0/100% 100%,
  repeating-linear-gradient(176deg,var(--strata-1) 0 34px,var(--strata-2) 34px 52px,#0E1113 52px 90px,var(--strata-2) 90px 104px);
 transform:none;opacity:.9;inset:-10vh -5vw;-webkit-mask:linear-gradient(transparent 35%,#000 85%);mask:linear-gradient(transparent 35%,#000 85%);
 animation:strata linear both;animation-timeline:scroll(root)}
@keyframes strata{from{transform:translateY(8vh)}to{transform:translateY(-14vh)}}
.trust td{color:var(--ink)}
.panel.origin{min-height:70vh;max-width:760px}
.panel.origin h2{font-size:clamp(34px,4.6vw,64px);letter-spacing:-.04em;max-width:none}
.panel.origin .lede{font-size:17px;max-width:56ch;color:var(--ink);text-shadow:0 1px 12px #101315,0 0 2px #101315}
@media (prefers-reduced-motion:reduce){.plane-grid{transform:none}}

/* ================= design-review fixes ================= */
.panel#s-hero{min-height:auto;padding-top:16vh;padding-bottom:6vh}
.hero-cta{margin-top:22px;display:flex;align-items:center;gap:18px;flex-wrap:wrap}.hero-cta .ghost{margin:0}
.lede{color:var(--ink-2)}
.panel.origin .lede{text-shadow:none;background:color-mix(in oklab,var(--page) 78%,transparent);padding:2px 0;-webkit-mask:none;mask:none}
.builtfor{position:relative;z-index:2;padding:22px clamp(16px,6vw,96px);border-top:1px solid var(--hair);background:var(--page)}
.builtfor{padding-bottom:40px}.builtfor ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--hair);border:1px solid var(--hair)}
.builtfor a{display:grid;gap:6px;padding:22px;background:var(--raised);text-decoration:none;height:100%;transition:background .2s}
.builtfor a:hover{background:var(--sunken)}.builtfor b{font-size:20px;letter-spacing:-.02em}.builtfor span{color:var(--ink-2);font-size:15px}.builtfor i{font-style:normal;color:var(--ink);font-family:var(--mono)}
@media (max-width:760px){.builtfor ul{grid-template-columns:1fr}}
.doc{padding-top:6vh}.doc h2{font-size:clamp(28px,3.4vw,44px);max-width:none;margin-top:56px;scroll-margin-top:90px}
.doc p{color:var(--ink-2)}.doc .lede{color:var(--ink)}
.quote{font:800 clamp(30px,4vw,52px)/1 var(--sans);letter-spacing:-.04em;color:var(--ink)!important;margin:10px 0 18px}
.rates td.dots{-webkit-mask:none;mask:none;font-size:14px}

/* ================= signature motion ================= */
/* (1) ring story progress: each panel's position in the viewport, driven by CSS scroll timelines */
@property --k{syntax:"<number>";inherits:false;initial-value:0}
@keyframes kprog{from{--k:0}to{--k:1}}
.panel{animation:kprog linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
@supports (animation-timeline:view()){.panel{animation-range:entry 50% exit 50%}}
/* poster (no 3D): the same story told in CSS, a slow turn that settles closed */
@keyframes posterstory{0%{transform:translateX(26vw) rotate(-18deg) scale(.96)}50%{transform:translateX(30vw) rotate(10deg) scale(1.04)}100%{transform:translateX(26vw) rotate(0) scale(1)}}
.ring-poster{animation:posterstory linear both;animation-timeline:scroll(root)}
@media (max-width:760px){.ring-poster{animation:none}}
/* (2) cross-document view transitions: ring <-> mark, headline <-> headline */
body.home .ring-stage{view-transition-name:mark}
body.sub .brand img{view-transition-name:mark}
main h1{view-transition-name:headline}
::view-transition-group(mark),::view-transition-group(headline){animation-duration:.55s;animation-timing-function:cubic-bezier(.2,.8,.2,1)}
::view-transition-old(headline){animation:vt-out .3s both}::view-transition-new(headline){animation:vt-in .45s .1s both}
@keyframes vt-out{to{opacity:0;transform:translateY(-12px)}}@keyframes vt-in{from{opacity:0;transform:translateY(16px)}}
/* (3) live ledger demo */
.demo{margin-top:18px;max-width:640px;border:1px dashed var(--rule);padding:12px 14px;background:color-mix(in oklab,var(--page) 80%,transparent)}
.demo-h{margin:0 0 8px;color:var(--ink-2)}.live{color:var(--working);margin-right:6px}
.feed{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:11.5px}
.feed li{display:grid;grid-template-columns:90px 1fr;gap:2px 12px;padding:8px 0;border-top:1px solid var(--hair);animation:arrive .4s cubic-bezier(.2,.9,.3,1.2)}
.feed li b{grid-row:span 4;color:var(--ink-2);font-weight:500}.feed .r{color:var(--ink-2)}.feed .r.yours{color:var(--cusp)}
@keyframes arrive{from{opacity:0;transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.ring-poster{animation:none}.feed li{animation:none}}

/* rarity: restraint and negative space around the ring and origin moments */
.panel.origin{min-height:100vh;padding-block:clamp(120px,24vh,280px);max-width:680px}
.panel.origin .lede{line-height:1.75}
.panel.origin .rare{margin-top:clamp(40px,8vh,96px);max-width:52ch;font-size:15px;line-height:1.7;color:var(--ink);border-top:1px solid color-mix(in oklab,var(--seam) 40%,transparent);padding-top:20px}
.panel.origin .rare .src{display:block;margin-top:10px;font-size:12px;color:var(--iridium);text-decoration:underline;text-underline-offset:3px}

/* ================= v2: layout, market figures, colour bars, nav, a11y ================= */
.skip{position:absolute;left:12px;top:-60px;z-index:10;background:var(--ink);color:var(--page);padding:10px 14px;border-radius:8px;text-decoration:none;font-weight:600}
.skip:focus{top:12px}
.ring-stage{overflow:hidden}
.menu-btn{display:none;font:500 12px var(--mono);background:var(--raised);border:1px solid var(--hair);color:var(--ink);border-radius:999px;padding:7px 12px;cursor:pointer}
/* 12-column grid */
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:clamp(16px,2.4vw,40px);width:100%;max-width:1320px}
.grid>*{grid-column:1/-1;min-width:0}
.panel.wide{max-width:none}
.panel.wide .col-head{grid-column:1/8}
.panel.wide .col-body{grid-column:8/13;align-self:end}
.panel.wide .col-body .lede{max-width:40ch}
.panel#s-hero .grid,.panel.origin .grid{display:block}
#s-controls .col-head{grid-column:1/6}#s-controls .col-body{grid-column:7/13;align-self:start;padding-top:8px}
#s-controls h2{max-width:10ch}
#s-trust .col-head{grid-column:1/7}#s-trust .col-body{grid-column:7/13;align-self:end}
.sub-h{font:700 clamp(22px,2vw,30px)/1.1 var(--sans);letter-spacing:-.03em;margin:0 0 14px}
.ledger{max-width:none}.demo{max-width:none}
/* market figures */
.market{position:relative;z-index:2;background:var(--page);border-top:1px solid var(--hair);padding:56px clamp(16px,6vw,96px) 48px}
.mk-head{grid-column:1/5!important}.figures{grid-column:5/13!important}
.mk-title{font-size:clamp(28px,2.8vw,42px);line-height:1.02;max-width:14ch;letter-spacing:-.04em;margin-bottom:14px}
.mk-note{color:var(--ink-2);font-size:14px;margin:0}
.figures{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--hair);border:1px solid var(--hair)}
.figures li{background:var(--raised);padding:22px 22px 18px;display:flex;flex-direction:column;gap:8px}
.fig{font:800 clamp(30px,3.2vw,48px)/1 var(--sans);letter-spacing:-.04em;color:var(--ink)}
.figures span{color:var(--ink-2);font-size:15px;line-height:1.45}
.figures cite{font-style:normal;font-size:11.5px;margin-top:auto;padding-top:8px;color:var(--iridium)}
.figures cite a{text-decoration:underline;text-decoration-color:var(--rule)}
/* Technicolor bars: one strip, four control colours */
.bars{position:absolute;top:0;left:0;right:0;display:grid;grid-template-columns:repeat(4,1fr);height:10px}
#s-controls{position:relative}
.c-route{background:var(--fired)}.c-payout{background:var(--plated)}.c-price{background:var(--working)}.c-own{background:var(--void)}
.chip{display:inline-block;width:10px;height:10px;margin-right:10px;vertical-align:2px}
.live{color:var(--plated)}
/* headings */

.panel.invert{--ink-3:#4B555C}
/* subpages */
.items{list-style:none;padding:0;border-top:1px solid var(--hair)}.items li{padding:14px 0;border-bottom:1px solid var(--hair)}
.callout{font:600 15px var(--mono);color:var(--ink)!important;border:1px solid var(--rule);border-left:4px solid var(--working);padding:14px 16px;margin:18px 0}
.rates td{color:var(--ink-2)}
@media (max-width:1000px){.mk-head,.figures{grid-column:1/-1!important}.mk-head{margin-bottom:24px}}
@media (max-width:760px){
 .menu-btn{display:inline-block;order:3}.tools{order:2}
 .top{flex-wrap:wrap;gap:10px}
 .top nav{order:4;flex-basis:100%;flex-direction:column;gap:0;padding:8px 0 4px}
 .top.open nav{display:flex}
 .top nav a{padding:12px 2px;border-top:1px solid var(--hair);font-size:17px}
 .panel.wide .col-head,.panel.wide .col-body,#s-controls .col-head,#s-controls .col-body,#s-trust .col-head,#s-trust .col-body{grid-column:1/-1}
 #s-controls .col-body{padding-top:32px}
 .figures{grid-template-columns:1fr}
 .ask-q{white-space:normal}
}
.panel h2{line-height:.94;padding-bottom:.08em;margin-bottom:28px}
.panel.wide h2,.panel.invert.wide h2{max-width:16ch}
.panel.invert.wide h2{font-size:clamp(44px,6.4vw,112px)}

/* v3: hero text column slightly wider so the headline fits in 3 lines or fewer at 1440 */
.panel#s-hero{max-width:960px}

/* v5: market stats as separate blocks (replaces the old .figures list) */
.market{padding:clamp(64px,9vh,112px) clamp(20px,6vw,96px)}
.market .grid{margin:0 auto 0 0}
.mk-title{margin-bottom:18px}
.mk-head{margin-bottom:40px}
.stats{grid-column:5/13;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--hair);border:1px solid var(--hair)}
.stat{background:var(--raised);padding:32px 28px 26px;display:flex;flex-direction:column}
.stat p{margin:0}
.stat-fig{font:800 clamp(34px,3.4vw,52px)/1 var(--sans);letter-spacing:-.04em;color:var(--ink)}
.stat-desc{margin-top:16px!important;color:var(--ink-2);font-size:16px;line-height:1.5;max-width:36ch}
.stat-src{margin-top:auto!important;padding-top:22px;font-size:11.5px;font-style:normal;color:var(--iridium)}
.stat-src a{text-decoration:underline;text-decoration-color:var(--rule)}
@media (max-width:1000px){.stats{grid-column:1/-1}}
@media (max-width:760px){.stats{grid-template-columns:1fr}.stat{padding:26px 20px 22px}}
/* v4: keep the hero ring clear of the headline on desktop (1280–1920). Mobile unchanged. */
@media (min-width:761px){
 #ring{transform:translateX(3vw) scale(.8);transform-origin:100% 50%}
 .ring-poster{width:min(62vmin,620px)}
 .floor{transform:translateX(32vw);width:min(56vmin,560px)}
}
@keyframes posterstory{0%{transform:translateX(32vw) rotate(-18deg) scale(.96)}50%{transform:translateX(34vw) rotate(10deg) scale(1.02)}100%{transform:translateX(32vw) rotate(0) scale(1)}}

/* ================= Cast: signature cast-iron text (see README "Cast") =================
   Max ONE per page. Only a single key headline or the ring mark.
   Never body text, buttons, figures or links. Darkest stop #8F989E = 6.35:1 on --page. */
.cast{background:linear-gradient(100deg,#8F989E,#F4F7F8 40%,#9DA6AB 60%,#E7ECEE) 0 0/100% 100%;
 -webkit-background-clip:text;background-clip:text;color:transparent!important;-webkit-text-fill-color:transparent;
 line-height:1.08;padding-bottom:.14em}
/* one-time "cool" sheen on scroll-in: a highlight passes once, then the metal settles. Static without support or with reduced motion. */
@supports (animation-timeline:view()){
 .cast{background-image:linear-gradient(100deg,#8F989E,#F4F7F8 40%,#9DA6AB 60%,#E7ECEE),linear-gradient(100deg,transparent 40%,#ffffff 50%,transparent 60%);
  background-size:100% 100%,250% 100%;background-repeat:no-repeat;background-blend-mode:screen;
  animation:cast-cool linear both;animation-timeline:view();animation-range:entry 20% cover 45%}
 .panel h2.cast{animation:settle linear both,cast-cool linear both;animation-timeline:view(),view();animation-range:entry 0% cover 40%,entry 20% cover 45%}
}
@keyframes cast-cool{from{background-position:0 0,130% 0}to{background-position:0 0,-130% 0}}
@media (prefers-reduced-motion:reduce){.cast,.panel h2.cast{animation:none!important;background-image:linear-gradient(100deg,#8F989E,#F4F7F8 40%,#9DA6AB 60%,#E7ECEE)}}

/* v7: "elements" table of value movement (periodic-table tiles). No Cast here: it's reserved. */
.elements{display:block}
.el-head{max-width:760px;margin-bottom:40px}
.el-table{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--hair);border:1px solid var(--hair);max-width:1320px}
.el{position:relative;background:var(--raised);padding:22px 22px 20px;display:flex;flex-direction:column;min-height:260px;border-top:4px solid var(--el-c,var(--iridium))}
.el.c-route{--el-c:var(--fired)}.el.c-payout{--el-c:var(--plated)}.el.c-price{--el-c:var(--working)}.el.c-own{--el-c:var(--void)}.el.c-iron{--el-c:var(--iridium)}
.el.c-route,.el.c-payout,.el.c-price,.el.c-own,.el.c-iron{background:var(--raised)}
.el p{margin:0}
.el-no{position:absolute;top:14px;left:22px;font-size:11px;color:var(--ink-2)}
.el-sym{display:block;margin-top:18px;font:800 clamp(44px,4.4vw,64px)/1 var(--sans);letter-spacing:-.04em;color:var(--el-c,var(--ink))}
.el-name{margin-top:6px!important;display:flex;justify-content:space-between;gap:10px;align-items:baseline}
.el-name b{font-size:17px;letter-spacing:-.01em}.el-name .mono{font-size:11px;color:var(--ink-2)}
.el-fig{margin-top:18px!important;font:800 clamp(24px,2.1vw,32px)/1.05 var(--sans);letter-spacing:-.03em;color:var(--ink)}
.el-fc{display:inline-block;vertical-align:middle;margin-left:6px;font-size:10px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;border:1px solid var(--working);color:var(--working);padding:2px 6px}
.el-desc{margin-top:8px!important;color:var(--ink-2);font-size:14.5px;line-height:1.45}
.el-src{margin-top:8px!important;padding-top:4px;font-size:11px;color:var(--iridium)}
.el-src a,.el-more a{text-decoration:underline;text-decoration-color:var(--rule)}
.el-fe{grid-row:span 2;background:linear-gradient(160deg,var(--sunken),var(--strata-1));--el-c:var(--ink);justify-content:flex-end}
.el-fe .el-sym{font-size:clamp(96px,10vw,160px);margin-top:0;color:var(--ink)}
.el-fe .el-desc{font-size:16px;max-width:30ch}
.el-more{margin-top:18px!important;max-width:1320px;color:var(--ink-2);font-size:11.5px;line-height:1.7}
@media (max-width:1100px){.el-table{grid-template-columns:repeat(2,minmax(0,1fr))}.el-fe{grid-row:auto;grid-column:1/-1;min-height:200px}}
@media (max-width:640px){.el-table{grid-template-columns:1fr}.el{min-height:0}.el-fe .el-sym{font-size:96px}}

/* ================= v8 polish pass ================= */
/* Ring: keep the poster inside the viewport on desktop (it was clipped past the right edge) */
@media (min-width:761px){
 @keyframes posterstory{0%{transform:translateX(var(--ring-x)) rotate(-18deg) scale(.96)}50%{transform:translateX(var(--ring-x)) rotate(10deg) scale(1.02)}100%{transform:translateX(var(--ring-x)) rotate(0) scale(1)}}
 .ring-stage{--ring-x:min(32vw,calc(50vw - min(31vmin,310px) - 32px))}
 .ring-poster{transform:translateX(var(--ring-x))}
 .floor{transform:translateX(var(--ring-x))}
}
/* Ring: the fee table and demo feed sit on solid surfaces so the braid never runs through text */
#s-controls .ledger,#s-controls .demo{position:relative;z-index:2;background:var(--raised)}
#s-controls .demo{background:var(--page)}
#s-controls .sub-h{position:relative;z-index:2}
@media (max-width:760px){.ring-live #ring{opacity:.18}}
/* Elements: Fe content sits at the top like every other tile (no empty block above it) */
@media (min-width:1101px){
 .el-table{grid-template-columns:repeat(3,minmax(0,1fr))}
 .el-fe{grid-row:auto;grid-column:1/-1;min-height:0;display:grid;grid-template-columns:auto 1fr;column-gap:40px;align-items:end;padding-top:40px}
 .el-fe .el-sym{grid-row:1/3;margin-top:0}
 .el-fe .el-name{justify-content:flex-start}
}
/* Elements: Vs gets its own colour so every cohort reads distinctly */
.el.c-alloy{--el-c:var(--seam);background:var(--raised)}
/* Shared source links (origin note on Home and Company) */
.rare .srcs{display:block;margin-top:10px}
.rare .srcs .src,.panel.origin .rare .srcs .src{display:block;margin-top:6px;font-size:12px;color:var(--iridium);text-decoration:underline;text-underline-offset:3px}
.doc .rare{margin-top:32px;max-width:56ch;font-size:15px;line-height:1.7;border-top:1px solid color-mix(in oklab,var(--seam) 40%,transparent);padding-top:20px}
/* Visible keyboard focus everywhere */
:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:4px}
.ask:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.cmdk input:focus-visible{outline:none}
/* Touch devices have no ⌘K: show "Search" and drop the shortcut hint */
.kbtn .k-touch{display:none}
@media (hover:none) and (pointer:coarse){.kbtn .k-key,.ask kbd{display:none}.kbtn .k-touch{display:inline}}
.caps tbody th{font-weight:600;color:var(--ink)}.caps .cap-p{display:block;font-weight:400;color:var(--ink-2);margin-top:4px}.caps td{vertical-align:top;width:1%}
.pillars a{display:inline-flex;align-items:baseline;gap:12px;font-weight:600;white-space:nowrap}.pl-sym{font-size:12px;color:var(--ink-3);min-width:2ch}.pillars small{color:var(--ink-3)}
.pillars span{text-align:right}.callout.illus{border-left-color:var(--rule)}.callout.illus span{display:block;font-weight:400;color:var(--ink-2);margin-top:6px}.related{font-size:15px}
@media (max-width:640px){.index.pillars li{flex-direction:column;gap:4px}.pillars span{text-align:left}}
/* Value anatomy: transaction -> rails -> record. Three bones, one spine. Cohort colours from the elements table, no magenta. */
.anatomy{list-style:none;padding:0;margin:28px 0;display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid var(--hair);border-radius:12px;overflow:hidden;background:var(--raised)}
.anatomy li{position:relative;padding:18px 18px 20px;border-left:1px solid var(--hair)}.anatomy li:first-child{border-left:0}
.anatomy li::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--an-c)}
.anatomy .an-0{--an-c:var(--ink-3)}.anatomy .an-1{--an-c:var(--ink-2)}.anatomy .an-2{--an-c:var(--iridium)}
.anatomy li:not(:last-child)::after{content:"→";position:absolute;right:-8px;top:16px;font:400 13px var(--mono);color:var(--ink-3);background:var(--raised);z-index:1}
.an-k{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)!important;margin-bottom:8px}
.anatomy p{margin:0;font-size:15px;line-height:1.55}
@media (max-width:640px){.anatomy{grid-template-columns:1fr}.anatomy li{border-left:0;border-top:1px solid var(--hair)}.anatomy li:first-child{border-top:0}.anatomy li:not(:last-child)::after{content:"↓";right:auto;left:18px;top:auto;bottom:-10px}}
.early{font-size:12px;color:var(--ink-3)!important;margin-top:10px}
.tags{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:8px}.tags li{font-size:12px;color:var(--ink-2);border:1px solid var(--rule);border-radius:999px;padding:5px 11px}
.caps td{width:auto;text-align:left;vertical-align:top}.caps tbody th{width:38%;vertical-align:top;padding-right:20px}
@media (max-width:640px){.caps tr{display:block;padding:12px 0;border-bottom:1px solid var(--hair)}.caps tbody th,.caps td{display:block;width:auto;border:0;padding:2px 0}}