/* The Aera landing: calm and exact. Live market data is the proof, set on the ordinary Aera
   ground with hairline rules and quiet type. Colour carries market meaning only: mint for bids,
   up and the primary action, pink for asks, Bitcoin orange inside the merged-mining diagram,
   amber for stale data and the environment. No decorative motion: what moves is real data. */
.landing[hidden] { display: none; }
.landing {
  --g: clamp(20px, 4vw, 64px);
  --lb-section: clamp(88px, 10vw, 144px);
  --lb-radius: 6px;
  /* One page grid: twelve columns between the gutters. Every section places its columns on these lines. */
  --lb-cols: repeat(12, minmax(0, 1fr));
  --lb-gap: clamp(24px, 2.6vw, 40px);
  --lb-btc: #ff931e;
  background: var(--ground-fill); color: var(--text);
}
.landing ::selection { background: var(--selection); color: var(--text); }

/* ---------- Shared type ---------- */
.lb-display {
  margin: 0; font: 700 clamp(3rem, 6.2vw, 6rem)/1 var(--font-display); font-stretch: 88%;
  letter-spacing: -.028em; word-spacing: .06em; text-wrap: balance; color: var(--text);
}
#lb-title > span { display: block; }
#lb-title .lb-title-work { color: var(--positive); }
.lb-heading {
  max-width: 18ch; margin: 0; font: 650 clamp(2rem, 3.6vw, 3.25rem)/1.06 var(--font-display); font-stretch: 90%;
  letter-spacing: -.022em; text-wrap: balance; color: var(--text);
}
.lb-num { font-family: var(--fontfam-term); font-variant-numeric: tabular-nums; }
.lb-nowrap { white-space: nowrap; }
.lb-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.lb-btn svg, .lb-row-end { flex: none; transition: transform 200ms cubic-bezier(.2, .8, .2, 1); }
.lb-btn:hover svg { transform: translateX(3px); }
.lb-link { margin-top: 28px; }

/* ---------- Hero: headline beside the live depth chart ---------- */
.lb-stage {
  display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); align-items: center; gap: 48px clamp(40px, 6vw, 104px);
  padding: clamp(56px, 8vw, 112px) var(--g) clamp(48px, 6vw, 88px);
}
.lb-hero-copy { display: grid; align-content: start; gap: 28px; min-width: 0; }
.lb-hero-side { display: grid; justify-items: start; gap: 32px; max-width: 46ch; }
.lb-lede { margin: 0; color: var(--text-soft); font-size: 1.125rem; line-height: 1.6; }
.lb-lede .aera-prose-link { color: var(--text); text-underline-offset: 4px; }

.lb-depth { min-width: 0; margin: 0; border: 1px solid var(--rule-strong); border-radius: var(--lb-radius); background: var(--panel-fill); }
.lb-depth-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; padding: 14px 20px; border-bottom: 1px solid var(--terminal-rule); }
.lb-depth-title { display: flex; align-items: baseline; gap: 14px; min-width: 0; }
.lb-depth-pair { color: var(--text); font: 650 1.125rem/1.2 var(--font-display); font-stretch: 92%; letter-spacing: -.005em; }
.lb-depth-status { display: inline-flex; align-items: center; gap: 7px; color: var(--text-soft); font: 400 .75rem/1 var(--fontfam-term); }
.lb-depth-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--rule-bright); }
.lb-depth[data-state="live"] .lb-depth-status::before { background: var(--positive); }
.lb-depth[data-state="stale"] .lb-depth-status { color: var(--network-label); }
.lb-depth[data-state="stale"] .lb-depth-status::before { background: var(--network-label); }
.lb-depth-figures { display: flex; gap: 24px; margin: 0; }
.lb-depth-figures div { display: flex; align-items: baseline; gap: 8px; }
.lb-depth-figures dt { color: var(--text-muted); font: 500 .6875rem/1 var(--font-sans); letter-spacing: .08em; text-transform: uppercase; }
.lb-depth-figures dd { margin: 0; color: var(--text); font: 400 .875rem/1 var(--fontfam-term); font-variant-numeric: tabular-nums; }
/* The plot leaves a gutter on its left for the gridline labels, so no label sits on a curve. */
.lb-depth-plot { position: relative; height: clamp(200px, 21vw, 280px); margin: 20px 20px 0 56px; }
.lb-depth-svg { display: block; width: 100%; height: 100%; overflow: visible; }
.lb-depth-svg path, .lb-depth-svg rect { vector-effect: non-scaling-stroke; }
.lb-depth-grid { fill: none; stroke: var(--terminal-rule); stroke-width: 1; }
.lb-depth-band { fill: rgb(236 242 239 / .035); }
.lb-depth-area--bid { fill: url(#lb-depth-bid-fill); }
.lb-depth-area--ask { fill: url(#lb-depth-ask-fill); }
.lb-depth-line { fill: none; stroke-width: 1.5; stroke-linejoin: miter; }
.lb-depth-line--bid { stroke: var(--positive); }
.lb-depth-line--ask { stroke: var(--danger-soft); }
.lb-depth-midline { fill: none; stroke: rgb(236 242 239 / .4); stroke-width: 1; stroke-dasharray: 3 4; }
.lb-depth-cursor { fill: none; stroke: var(--text-soft); stroke-width: 1; }
.lb-depth-ticks { position: absolute; inset: 0; pointer-events: none; }
.lb-depth-ticks span { position: absolute; right: calc(100% + 10px); transform: translateY(-50%); color: var(--text-muted); font: 400 .6875rem/1 var(--fontfam-term); font-variant-numeric: tabular-nums; }
.lb-depth-axis { position: relative; height: 28px; margin: 0 20px 0 56px; color: var(--text-muted); font: 400 .6875rem/28px var(--fontfam-term); font-variant-numeric: tabular-nums; border-top: 1px solid var(--rule-strong); }
.lb-depth-axis span { position: absolute; top: 0; transform: translateX(-50%); white-space: nowrap; }
.lb-depth-tip {
  position: absolute; z-index: 1; margin: 0; padding: 6px 10px; transform: translate(-50%, calc(-100% - 8px)); pointer-events: none; white-space: nowrap;
  border: 1px solid var(--rule-strong); border-radius: 4px; background: var(--panel-fill); color: var(--text); font: 400 .75rem/1.3 var(--fontfam-term);
}
.lb-depth-tip[hidden] { display: none; }
.lb-depth-tip[data-side="bid"] { border-color: rgb(var(--positive-rgb) / .45); }
.lb-depth-tip[data-side="ask"] { border-color: rgb(var(--danger-soft-rgb) / .45); }
.lb-depth-empty { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; color: var(--text-muted); font-size: .8125rem; }
.lb-depth-empty[hidden] { display: none; }
.lb-depth-legend { display: flex; flex-wrap: wrap; gap: 8px 28px; padding: 12px 20px 16px; color: var(--text-soft); font-size: .8125rem; }
.lb-depth-key { display: inline-flex; align-items: center; gap: 8px; }
.lb-depth-key::before { content: ""; width: 12px; height: 2px; }
.lb-depth-key--bid::before { background: var(--positive); }
.lb-depth-key--ask::before { background: var(--danger-soft); }
.lb-depth-key b { color: var(--text); font: 400 .8125rem var(--fontfam-term); font-variant-numeric: tabular-nums; }
.lb-depth[data-state="stale"] .lb-depth-plot, .lb-depth[data-state="stale"] .lb-depth-legend b { opacity: .6; }

/* The live strip: four instruments, each a real feed. */
.lb-board { --lb-fig: clamp(2.5rem, 4vw, 4.25rem); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 0; padding: 0 max(0px, calc(var(--g) - 24px)); list-style: none; border-block: 1px solid var(--terminal-rule); }
.lb-row { position: relative; min-width: 0; border-left: 1px solid var(--terminal-rule); }
.lb-row:first-child { border-left: 0; }
.lb-row, .landing .btn.lb-row-link {
  display: grid; grid-template-columns: minmax(0, 1fr) 20px; grid-template-rows: auto var(--lb-fig) auto; grid-template-areas: "label end" "figure figure" "meta meta";
  align-content: start; gap: 12px; min-height: 0; padding: 24px 24px 22px;
}
.lb-row:has(> .lb-row-link) { display: block; padding: 0; }
.landing .btn.lb-row-link { height: 100%; color: inherit; text-decoration: none; transition: background-color 160ms ease-out; }
.landing .btn.lb-row-link:is(:hover, :focus-visible):not(:disabled) { background: var(--terminal-control); }
.lb-row-link:hover .lb-row-end { transform: translateX(4px); color: var(--positive); }
.lb-row-label { grid-area: label; display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.lb-sym { color: var(--text); font: 600 .8125rem/1.3 var(--font-sans); letter-spacing: .06em; text-transform: uppercase; }
.lb-note { color: var(--text-muted); font-size: .8125rem; }
.lb-figure {
  overflow: hidden; height: 1em; white-space: nowrap;
  font-family: var(--font-display); font-stretch: 65%; font-weight: 700; font-feature-settings: "tnum" 1, "lnum" 1;
  font-size: clamp(2.5rem, 4vw, 4.25rem); line-height: 1; letter-spacing: -.01em;
}
/* The figure row keeps one height, so a figure shrunk to fit its column leaves the chips beneath in line. */
.lb-board .lb-figure { grid-area: figure; align-self: end; font-size: var(--lb-fig); color: var(--text); }
.lb-row-meta { grid-area: meta; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; color: var(--text-soft); font-size: .8125rem; line-height: 1.45; }
.lb-row-end { grid-area: end; width: 20px; height: 20px; justify-self: end; color: var(--text-muted); }
.lb-tag { display: inline-flex; align-items: center; min-height: 22px; padding: 1px 8px; border: 1px solid var(--rule-strong); border-radius: 3px; color: var(--text-soft); font: 500 .6875rem/1.3 var(--fontfam-term); letter-spacing: .02em; }
.lb-tag svg { width: 12px; height: 12px; margin: 0 5px; }
.lb-live { display: inline-flex; align-items: center; gap: 7px; color: var(--text); font-family: var(--fontfam-term); font-size: .75rem; }
.lb-live::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--rule-bright); }
.lb-live[data-state="live"]::before { background: var(--positive); }
.lb-live[data-state="stale"] { color: var(--network-label); }
.lb-live[data-state="stale"]::before { background: var(--network-label); }
/* Before a feed arrives the figures hold a quiet placeholder; a last-known value whose feed is interrupted stays readable, dimmed. */
.lb-figure:not([data-value]) { color: var(--rule-bright) !important; }
.lb-figure[data-stale="true"] { color: var(--text-soft) !important; }

/* Rolling digits. */
.rl { display: inline-block; height: 1em; overflow: hidden; vertical-align: top; }
.rl-strip { display: block; line-height: 1; transition: transform 900ms cubic-bezier(.2, .8, .2, 1); }
.rl-strip > span { display: block; height: 1em; }
.rl-sep { width: auto; }
.lb-reduced .rl-strip { transition: none; }

/* Ticker: the top spot and note markets by 24h volume, each a real link to its book. */
.lb-ticker { position: relative; overflow: hidden; height: 44px; border-bottom: 1px solid var(--terminal-rule); }
.lb-ticker-track { display: flex; width: max-content; height: 100%; animation: lb-marquee 70s linear infinite; }
.lb-ticker:is(:hover, :focus-within) .lb-ticker-track { animation-play-state: paused; }
.lb-tape { display: flex; align-items: center; gap: 36px; height: 100%; margin: 0; padding: 0 18px 0 36px; list-style: none; }
.lb-tape li { display: flex; align-items: center; height: 100%; white-space: nowrap; }
.lb-tape-label { color: var(--text-muted); font-family: var(--fontfam-term); font-size: .6875rem; font-weight: 500; letter-spacing: .04em; text-transform: uppercase; }
.lb-tick { display: inline-flex; align-items: center; gap: 10px; height: 100%; color: var(--text-muted); font-size: .8125rem; text-decoration: none; border-radius: 3px; }
.lb-tick:hover { color: var(--text); text-decoration: none; }
.lb-tick:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.lb-tick-pair { font-weight: 500; }
.lb-tick-value { color: var(--text); font-family: var(--fontfam-term); font-weight: 500; }
.lb-tick-change { font-family: var(--fontfam-term); font-style: normal; }
.lb-tick-change[data-tone="up"] { color: var(--positive); }
.lb-tick-change[data-tone="down"] { color: var(--danger-soft); }
.lb-tick-stale { color: var(--network-label); font-family: var(--fontfam-term); font-size: .625rem; text-transform: uppercase; letter-spacing: .04em; }
.landing .lb-tick-stale { font-size: .6875rem; }
.lb-tick[data-stale="true"] .lb-tick-value { color: var(--text-soft); }
@keyframes lb-marquee { to { transform: translateX(-50%); } }

/* ---------- Product chapters ---------- */
.lb-sheet {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: 56px clamp(40px, 7vw, 120px);
  padding: var(--lb-section) var(--g); border-bottom: 1px solid var(--terminal-rule);
}
.lb-sheet-copy > p { max-width: 54ch; margin: 24px 0 0; color: var(--text-soft); font-size: 1.0625rem; line-height: 1.62; }
.lb-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; max-width: 640px; margin-top: 32px; }
.lb-split > div { padding-top: 18px; border-top: 1px solid var(--rule-strong); }
.lb-split h3 { margin: 0 0 10px; color: var(--text); font: 600 1rem/1.35 var(--font-sans); }
.lb-split p { margin: 0; color: var(--text-soft); font-size: .9375rem; line-height: 1.6; }
.lb-sheet--notes .lb-demo { order: -1; }
.lb-sheet--minor { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); padding-block: clamp(72px, 8vw, 120px); }
.lb-heading--minor { max-width: 22ch; font-size: clamp(1.75rem, 2.8vw, 2.5rem); }
.lb-sheet--minor .lb-sheet-copy > p { margin-top: 18px; max-width: 58ch; font-size: 1rem; }
.lb-sheet--minor .lb-link { margin-top: 20px; }

/* Panels: one hairline border, one radius, no shadow. */
.lb-demo { position: relative; justify-self: center; width: min(100%, 500px); margin: 0; border: 1px solid var(--rule-strong); border-radius: var(--lb-radius); background: var(--panel-fill); font-size: .875rem; }
.lb-demo-head {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 50px; padding: 4px 20px;
  border-bottom: 1px solid var(--terminal-rule); color: var(--text-muted); font: 500 .75rem/1.4 var(--font-sans); letter-spacing: .08em; text-transform: uppercase;
}
.lb-demo-head > span:first-child { color: var(--text-soft); }
.lb-sheet--minor .lb-demo { order: 0; width: min(100%, 420px); font-size: .8125rem; }
.lb-demo dl { margin: 0; padding: 4px 20px; }
.lb-demo dl div { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 15px 0; border-bottom: 1px solid var(--terminal-rule); }
.lb-demo dl div:last-child { border-bottom: 0; }
.lb-demo dt { color: var(--text-soft); }
.lb-demo dd { margin: 0; text-align: right; color: var(--text); }
.lb-note-principal { display: block; color: var(--text); font: 700 3rem/1 var(--font-display); font-stretch: 65%; font-variant-numeric: tabular-nums; }
.lb-note-principal + span { display: block; margin-top: 6px; color: var(--text-soft); font-size: .75rem; }

/* Example charts: labelled, static. */
.lb-chart { margin: 0; padding: 20px 20px 8px; border-bottom: 1px solid var(--terminal-rule); }
.lb-chart svg { display: block; width: 100%; height: 100%; overflow: visible; }
/* Labels are HTML over the drawing, so they hold 11px at every width. */
.lb-chart-art { position: relative; width: 100%; }
.lb-chart-tag { position: absolute; left: var(--x); top: var(--y); color: var(--text-soft); font: 500 .6875rem/1.3 var(--font-sans); letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.lb-chart-tag--end { transform: translateX(-100%); }
.lb-chart-tag--accent { color: var(--positive); }
.lb-chart-tag--bright { color: var(--text); }
.lb-chart-tag--num { color: var(--text-muted); font-family: var(--fontfam-term); letter-spacing: 0; text-transform: none; }
.lb-chart-caption { margin: 14px 0 0; color: var(--text-muted); font-size: .8125rem; line-height: 1.45; }
.lb-chart-grid { fill: none; stroke: var(--terminal-rule); stroke-width: 1; }
.lb-par-fill { fill: rgb(var(--positive-rgb) / .06); }
.lb-par-line { fill: none; stroke: var(--text-muted); stroke-width: 1; stroke-dasharray: 4 5; }
.lb-par-gap { fill: none; stroke: var(--text-muted); stroke-width: 1; stroke-dasharray: 2 4; }
.lb-par-curve { fill: none; stroke: var(--positive); stroke-width: 2; stroke-linecap: round; }
.lb-par-buy { fill: var(--text); }
.lb-par-end { fill: var(--positive); }
.lb-par-ring { fill: none; stroke: rgb(var(--positive-rgb) / .4); stroke-width: 1; }
.lb-trigger-line { fill: none; stroke: var(--text-muted); stroke-width: 1; stroke-dasharray: 5 5; }
.lb-trigger-path { fill: none; stroke: var(--text-muted); stroke-width: 1.5; stroke-linejoin: round; }
.lb-trigger-after { fill: none; stroke: var(--positive); stroke-width: 2; stroke-linejoin: round; }
.lb-trigger-hit { fill: var(--positive); }
.lb-trigger-ring { fill: none; stroke: rgb(var(--positive-rgb) / .45); stroke-width: 1; }

/* ---------- Live order book ---------- */
.lb-book-market { color: var(--text); font-weight: 500; text-decoration: none; }
.lb-book-market:hover { color: var(--positive); text-decoration: none; }
.lb-book-market:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 2px; }
.lb-book { position: relative; }
.lb-book ol { margin: 0; padding: 8px 0; list-style: none; transition: opacity 300ms ease-out; }
.lb-book li { position: relative; display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px 20px; isolation: isolate; overflow: clip; font-family: var(--fontfam-term); font-variant-numeric: tabular-nums; }
/* Depth: a full-width wash slid in from the right edge, so it glides on the compositor, with the same quiet 1px leading
   edge as the Trading order book. The bar sits behind the figures. */
.lb-book li > i { position: absolute; z-index: -1; inset: 1px 0; transform: translateX(calc((1 - var(--w, 0)) * 100%)); transition: transform 800ms cubic-bezier(.2, .8, .2, 1); }
.lb-book li > i { --edge: rgb(var(--positive-rgb) / .55); --wash: rgb(var(--positive-rgb) / .12); background: var(--wash); box-shadow: inset 1px 0 var(--edge); }
.lb-book .ask { color: var(--danger-soft); } .lb-book .ask > i { --edge: rgb(var(--danger-soft-rgb) / .55); --wash: rgb(var(--danger-soft-rgb) / .12); }
.lb-book .bid { color: var(--positive); }
/* The depth a snapshot added or removed at a level, lit while the bar glides through it. */
.lb-book-delta { position: absolute; z-index: -1; top: 1px; bottom: 1px; pointer-events: none; }
.lb-book .ask > .lb-book-delta { background: rgb(var(--danger-soft-rgb) / .38); }
.lb-book .bid > .lb-book-delta { background: rgb(var(--positive-rgb) / .34); }
.lb-book li > span:last-of-type { color: var(--text-soft); }
.lb-book li.empty, .lb-book li.empty > span:last-of-type { color: var(--rule-bright); }
/* Sizes and the spread slide to a new value inside their own clip. */
.lb-book-size, .lb-book-spread { position: relative; display: inline-flex; justify-content: flex-end; overflow: hidden; }
.lb-v { display: block; white-space: nowrap; }
.lb-v--out { position: absolute; top: 0; right: 0; }
.lb-book .mid { margin: 4px 0; padding-block: 18px; border-block: 1px solid var(--terminal-rule); color: var(--text); font-family: var(--font-display); font-stretch: 65%; font-size: 2.5rem; font-weight: 700; line-height: 1; font-feature-settings: "tnum" 1, "lnum" 1; }
.lb-book-mid-fig { display: block; height: 1em; white-space: nowrap; }
.lb-book .mid > .lb-book-spread { color: var(--text-muted); font: .75rem/1.4 var(--fontfam-term); }
/* Departing levels play out in a copy above the list, outside the accessibility tree. */
.lb-book-ghosts { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; pointer-events: none; }
.lb-book-ghosts li { position: absolute; box-sizing: border-box; }
/* A market's first levels wait for the reveal until the book is in view. */
.lb-book[data-reveal="pending"] #lb-book-rows > li { opacity: 0; }
.lb-book[data-state="stale"] ol { opacity: .6; }
.lb-book-note { display: flex; align-items: center; gap: 8px; margin: 0; padding: 12px 20px; border-top: 1px solid var(--terminal-rule); color: var(--text-muted); font-family: var(--fontfam-term); font-size: .6875rem; }
.lb-book-note::before { content: ''; flex: none; width: 6px; height: 6px; border-radius: 50%; background: var(--rule-bright); }
.lb-book[data-state="live"] .lb-book-note::before { background: var(--positive); }
.lb-book[data-state="stale"] .lb-book-note { color: var(--network-label); } .lb-book[data-state="stale"] .lb-book-note::before { background: var(--network-label); }
.lb-reduced .lb-book li > i { transition: none; }

/* ---------- Rootstock: merged-mining diagram, ruler and milestones ---------- */
.lb-chain { position: relative; padding: var(--lb-section) 0 0; border-bottom: 1px solid var(--terminal-rule); overflow: hidden; }
.lb-chain-head { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(280px, .9fr); align-items: end; gap: 24px clamp(40px, 7vw, 120px); padding: 0 var(--g) clamp(40px, 5vw, 64px); }
.lb-chain-title { max-width: 16ch; margin: 0; color: var(--text); font: 650 clamp(2rem, 3.6vw, 3.25rem)/1.06 var(--font-display); font-stretch: 90%; letter-spacing: -.022em; text-wrap: balance; }
.lb-chain-lede { max-width: 54ch; margin: 0 0 .3em; color: var(--text-soft); font-size: 1.0625rem; line-height: 1.6; }
.lb-field { position: relative; margin: 0; height: clamp(280px, 30vw, 400px); border-top: 1px solid var(--terminal-rule); border-bottom: 1px solid var(--terminal-rule); }
.lb-field canvas { display: block; width: 100%; height: 100%; -webkit-mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent); }
.lb-field-legend { position: absolute; inset: 0; display: grid; grid-template-rows: auto 1fr auto; padding: 18px var(--g) 16px; pointer-events: none; font-size: .8125rem; line-height: 1.45; color: var(--text-soft); }
.lb-field-legend p { max-width: 38ch; margin: 0; }
.lb-field-legend strong { font-weight: 600; }
.lb-field-btc { grid-row: 1; }
.lb-field-btc strong { color: var(--lb-btc); }
.lb-field-rsk { grid-row: 3; align-self: end; }
.lb-field-rsk strong { color: var(--text); }
.lb-field-note { grid-row: 3; align-self: end; justify-self: end; max-width: none; color: var(--text-muted); font-family: var(--fontfam-term); font-size: .6875rem; }
.lb-ruler { position: relative; height: 56px; margin: clamp(40px, 5vw, 64px) var(--g) 0; }
.lb-ruler-line { position: absolute; left: 0; right: 0; top: 0; height: 1px; background: var(--rule-strong); }
.lb-ruler-mark { position: absolute; top: 0; left: var(--at); display: grid; justify-items: start; gap: 10px; transform: translateX(-50%); color: var(--text-muted); font-family: var(--fontfam-term); font-size: .75rem; }
.lb-ruler-mark:first-of-type { transform: none; }
.lb-ruler-mark--now { transform: translateX(-100%); justify-items: end; color: var(--positive); }
.lb-ruler-mark i { display: block; width: 1px; height: 12px; background: currentColor; justify-self: center; }
.lb-ruler-mark:first-of-type i { justify-self: start; }
.lb-ruler-mark--now i { justify-self: end; width: 7px; height: 7px; margin-top: -3px; border-radius: 50%; }
.lb-milestones { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)) minmax(0, 1.25fr); gap: 28px clamp(24px, 3vw, 48px); margin: 12px 0 0; padding: 0 var(--g) clamp(72px, 8vw, 112px); list-style: none; }
.lb-milestones li { display: grid; align-content: start; gap: 10px; }
.lb-year { font-family: var(--fontfam-term); font-size: .75rem; color: var(--text-muted); }
.lb-milestones h3 { margin: 0; color: var(--text); font: 600 1.0625rem/1.3 var(--font-sans); }
.lb-milestones p { margin: 0; color: var(--text-soft); font-size: .9375rem; line-height: 1.55; max-width: 34ch; }
.lb-milestone--now { padding-left: clamp(16px, 2vw, 28px); border-left: 1px solid var(--terminal-rule); }
.lb-milestone--now .lb-year { color: var(--positive); }
.lb-days { display: grid; gap: 4px; margin: 0; }
.lb-days-figure { color: var(--text); font-size: clamp(2.75rem, 4.6vw, 4.5rem); }
.lb-days-unit { color: var(--text); font-size: 1rem; font-weight: 600; }
.lb-milestone--now > p:last-child { max-width: 40ch; }

/* ---------- Security ---------- */
.lb-security {
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); grid-template-areas: "copy audit" "guards guards"; align-items: start; gap: 56px clamp(40px, 6vw, 112px);
  padding: var(--lb-section) var(--g); border-bottom: 1px solid var(--terminal-rule);
}
.lb-security-copy { grid-area: copy; }
.lb-security-lede { max-width: 50ch; margin: 24px 0 0; color: var(--text-soft); font-size: 1.125rem; line-height: 1.6; }
.lb-audit { grid-area: audit; justify-self: stretch; width: 100%; }
/* Each model that has reviewed the contracts, with a mint check mark beside its name. */
.lb-auditors { margin: 0; padding: 0; list-style: none; }
.lb-auditor { display: flex; align-items: center; gap: 14px; padding: 18px 20px; border-bottom: 1px solid var(--terminal-rule); }
.lb-auditor:last-child { border-bottom: 0; }
.lb-auditor::before {
  content: ""; flex: none; width: 18px; height: 18px; background: var(--positive);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3L13 4.5' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
.lb-auditor-name { color: var(--text); font: 650 1.0625rem/1.2 var(--font-display); font-stretch: 92%; white-space: nowrap; }
.lb-guards { grid-area: guards; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px clamp(24px, 3vw, 48px); margin: 0; padding: 0; list-style: none; }
.lb-guards li { padding-top: 18px; border-top: 1px solid var(--rule-strong); }
.lb-guards h3 { margin: 0 0 10px; color: var(--text); font: 600 1rem/1.35 var(--font-sans); }
.lb-guards p { max-width: 48ch; margin: 0; color: var(--text-soft); font-size: .9375rem; line-height: 1.6; }

/* ---------- DAO ---------- */
.lb-custody { position: relative; padding: var(--lb-section) var(--g) 0; }
.lb-custody .lb-heading { max-width: 22ch; }
/* How a change reaches the protocol: four numbered steps on one rule. */
.lb-track { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 56px 0 0; padding: 0; list-style: none; counter-reset: lb-step; }
.lb-track::before { content: ""; position: absolute; left: 14px; right: 0; top: 14px; height: 1px; background: var(--rule-strong); }
.lb-track li { position: relative; display: grid; align-content: start; gap: 6px; padding-right: 24px; counter-increment: lb-step; }
.lb-track i { position: relative; display: grid; place-items: center; width: 29px; height: 29px; margin-bottom: 14px; border: 1px solid var(--rule-bright); border-radius: 50%; background: var(--ground-fill); color: var(--text-soft); font: 500 .75rem/1 var(--fontfam-term); font-style: normal; }
.lb-track i::before { content: counter(lb-step); }
.lb-track strong { color: var(--text); font: 600 1.125rem/1.3 var(--font-sans); }
.lb-track span { max-width: 26ch; color: var(--text-soft); font-size: .9375rem; line-height: 1.45; }
.lb-cells { margin: 64px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--terminal-rule); }
.lb-cells li { display: grid; grid-template-columns: minmax(200px, 1fr) minmax(0, 1.6fr); align-items: baseline; gap: 12px 48px; padding: 26px 0; border-bottom: 1px solid var(--terminal-rule); }
.lb-cells h3 { margin: 0; color: var(--text); font: 600 1.125rem/1.3 var(--font-sans); }
.lb-cells p { max-width: 62ch; margin: 0; color: var(--text-soft); font-size: 1rem; line-height: 1.6; }
.lb-dao { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px 40px; padding: 40px 0 clamp(80px, 9vw, 120px); }
.lb-dao p { max-width: 64ch; margin: 0; color: var(--text-soft); font-size: 1.0625rem; line-height: 1.6; }
.lb-dao strong { color: var(--text); font-weight: 600; }

/* ---------- Close ---------- */
.lb-close { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 48px; padding: clamp(96px, 11vw, 160px) var(--g); border-top: 1px solid var(--terminal-rule); }
.lb-close-copy { display: grid; justify-items: start; gap: 40px; }
.lb-display--close { max-width: 14ch; font-size: clamp(2.75rem, 5.6vw, 5.5rem); }
.lb-mint { color: var(--positive); }
.lb-close-mark { width: clamp(120px, 16vw, 220px); height: auto; color: var(--text); }

/* ---------- Footer ---------- */
.lb-footer { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(2, minmax(0, 1fr)); align-items: start; gap: 32px; padding: 48px var(--g) 40px; border-top: 1px solid var(--terminal-rule); font-size: .875rem; }
.lb-footer-nav { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.lb-footer-nav .btn { gap: 10px; }
.lb-footer-nav a:hover { color: var(--text); }
.lb-footer-env { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 10px; margin: 16px 0 0; padding-top: 20px; border-top: 1px solid var(--terminal-rule); color: var(--text-muted); font-size: .8125rem; }
/* The dot stays beside the first line when the note wraps on narrow screens. */
.lb-env-dot { flex: none; width: 7px; height: 7px; margin-top: calc((1lh - 7px) / 2); border-radius: 50%; background: var(--network-label); }
.lb-footer-env a { color: var(--network-label); text-underline-offset: 3px; }
.lb-footer-env[hidden] { display: none; }

/* Wide screens: every section sits on the twelve-column page grid. Copy takes columns 1–6 and its companion
   starts on column 7; Trade stands the live book on columns 5–8 between its two features; Series Notes
   runs one wide panel across 1–8 with Borrow and Lend on 9–12. */
@media (min-width: 1101px) {
  .lb-stage, .lb-sheet, .lb-chain-head, .lb-security, .lb-close, .lb-footer { grid-template-columns: var(--lb-cols); column-gap: var(--lb-gap); }
  .lb-hero-copy { grid-column: 1 / 7; }
  .lb-depth { grid-column: 7 / 13; }
  .lb-sheet-copy { grid-column: 1 / 7; }
  .lb-sheet .lb-demo { grid-column: 7 / 13; justify-self: stretch; width: auto; }
  .lb-sheet--minor .lb-demo { grid-column: 8 / 13; width: auto; }
  .lb-chain-title { grid-column: 1 / 7; }
  .lb-chain-lede { grid-column: 7 / 13; }
  .lb-security-copy { grid-column: 1 / 7; }
  .lb-audit { grid-column: 7 / 13; }
  .lb-security { grid-template-areas: none; }
  .lb-security-copy, .lb-audit, .lb-guards { grid-row: auto; }
  .lb-guards { grid-column: 1 / 13; grid-template-columns: var(--lb-cols); column-gap: var(--lb-gap); }
  .lb-guards li { grid-column: span 4; }
  .lb-track { grid-template-columns: var(--lb-cols); column-gap: var(--lb-gap); }
  .lb-track li { grid-column: span 3; }
  .lb-cells li { grid-template-columns: var(--lb-cols); column-gap: var(--lb-gap); }
  .lb-cells h3 { grid-column: 1 / 7; }
  .lb-cells p { grid-column: 7 / 13; }
  .lb-close-copy { grid-column: 1 / 9; }
  .lb-close-mark { grid-column: 11 / 13; justify-self: end; }
  .lb-footer-brand { grid-column: 1 / 7; }
  .lb-footer-nav:nth-of-type(1) { grid-column: 7 / 10; }
  .lb-footer-nav:nth-of-type(2) { grid-column: 10 / 13; }

  .lb-sheet--notes { grid-template-areas: none; align-items: start; }
  .lb-sheet--notes .lb-sheet-copy { display: contents; }
  .lb-sheet--notes .lb-heading { grid-column: 1 / 13; grid-row: 1; max-width: 26ch; margin-bottom: 8px; }
  .lb-sheet--notes .lb-demo { grid-column: 1 / 9; grid-row: 2 / span 2; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); grid-template-areas: "head head" "chart terms"; }
  .lb-sheet--notes .lb-split { grid-column: 9 / 13; grid-row: 2; grid-template-columns: minmax(0, 1fr); gap: 24px; margin: 0; }
  .lb-sheet--notes .lb-link { grid-column: 9 / 13; grid-row: 3; align-self: start; margin: 8px 0 0; }
  .lb-sheet--notes .lb-demo-head { grid-area: head; }
  .lb-sheet--notes .lb-chart { grid-area: chart; display: flex; flex-direction: column; justify-content: center; padding: 28px; border-bottom: 0; border-right: 1px solid var(--terminal-rule); }
  .lb-sheet--notes .lb-demo dl { grid-area: terms; align-self: center; padding: 8px 28px; }
}
@media (min-width: 1280px) {
  .lb-sheet--trade { align-items: start; row-gap: 48px; }
  .lb-sheet--trade .lb-sheet-copy, .lb-sheet--trade .lb-split { display: contents; }
  .lb-sheet--trade .lb-heading { grid-column: 1 / 7; grid-row: 1 / span 2; }
  .lb-sheet--trade .lb-sheet-copy > p { grid-column: 7 / 13; grid-row: 1; max-width: 60ch; margin: 0; }
  .lb-sheet--trade .lb-link { grid-column: 7 / 13; grid-row: 2; justify-self: start; margin: -24px 0 0; }
  /* The two features stand either side of the book on one shared rule, level with its top. */
  .lb-sheet--trade .lb-split > div { grid-row: 3; align-self: start; }
  .lb-sheet--trade .lb-split > div:first-child { grid-column: 1 / 5; }
  .lb-sheet--trade .lb-split > div:last-child { grid-column: 9 / 13; }
  .lb-sheet--trade .lb-book { grid-column: 5 / 9; grid-row: 3; }
}

/* ---------- Responsive ---------- */
@media (max-width: 1279px) { .lb-milestones { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1199px) { .lb-ruler-mark--recent { display: none; } }
@media (max-width: 1100px) {
  .lb-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-row:nth-child(odd) { border-left: 0; }
  .lb-row:nth-child(n + 3) { border-top: 1px solid var(--terminal-rule); }
  .lb-security { grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "audit" "guards"; }
  .lb-audit { max-width: 720px; }
}
@media (max-width: 900px) {
  .lb-stage { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .lb-sheet { grid-template-columns: minmax(0, 1fr); }
  .lb-sheet--notes .lb-demo { order: 0; }
  .lb-demo { justify-self: start; }
  .lb-sheet--minor .lb-demo { width: min(100%, 500px); }
  .lb-milestones { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-chain-head { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .lb-field { height: clamp(300px, 80vw, 380px); }
  .lb-field-legend { font-size: .75rem; }
  .lb-field-note { display: none; }
  .lb-guards { grid-template-columns: minmax(0, 1fr); }
  .lb-track { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 36px; }
  .lb-track::before { display: none; }
  .lb-close { grid-template-columns: minmax(0, 1fr); }
  .lb-close-mark { order: -1; width: 96px; }
}
@media (max-width: 640px) {
  .lb-stage { padding-top: 40px; }
  .lb-display { font-size: clamp(2.75rem, 13vw, 4.5rem); }
  .lb-hero-side { gap: 24px; }
  .lb-hero-side .lb-btn { width: 100%; }
  .lb-depth-head { padding: 12px 16px; }
  .lb-depth-figures { gap: 16px; }
  .lb-depth-plot { height: 190px; margin: 16px 16px 0 48px; }
  .lb-depth-axis { margin: 0 16px 0 48px; }
  .lb-depth-legend { padding: 12px 16px 14px; }
  .lb-board { grid-template-columns: minmax(0, 1fr); }
  .lb-row { border-left: 0; }
  .lb-row:nth-child(n + 2) { border-top: 1px solid var(--terminal-rule); }
  .lb-row, .landing .btn.lb-row-link { gap: 8px 12px; padding: 18px var(--g); }
  .lb-row:has(> .lb-row-link) { padding: 0; }
  .lb-board { --lb-fig: clamp(2.5rem, 13vw, 3.5rem); padding: 0; }
  .lb-row-meta > span:not(.lb-tag):not(.lb-live) { display: none; }
  .lb-board .lb-row--lead .lb-row-meta > span:not(.lb-live) { display: inline; }
  .lb-split, .lb-cells li { grid-template-columns: minmax(0, 1fr); }
  .lb-milestones { grid-template-columns: minmax(0, 1fr); }
  .lb-milestone--now { padding: 24px 0 0; border-left: 0; border-top: 1px solid var(--terminal-rule); }
  .lb-ruler { display: none; }
  .lb-field-legend p { max-width: 30ch; }
  .lb-security-lede { font-size: 1.0625rem; }
  .lb-auditor { padding: 16px; }
  .lb-footer { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lb-footer-brand { grid-column: 1 / -1; }
}
@media (max-width: 380px) {
  .lb-row-label .lb-note { font-size: .75rem; }
  .lb-demo dl { padding-inline: 14px; }
  .lb-demo dl div { gap: 12px; }
  .lb-chart { padding-inline: 12px; }
  .lb-depth-figures dt { display: none; }
  .lb-track { grid-template-columns: minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .lb-ticker { overflow-x: auto; scrollbar-width: thin; }
  .lb-ticker-track { animation: none; }
  #lb-tape-copy { display: none; }
  .rl-strip, .lb-book li > i, .lb-btn svg, .lb-row-end { transition: none; }
}