/* Strata Thesis design system. Own shell for issuers: navy chrome, one content column, hairline cards,
   tabular figures everywhere, one tooltip component. Rules carried from the StrataNova design spec:
   tabular numerals mandatory; teal marks the interface and OUR series only; green/red only for signed
   values; 3px radius; no drop shadows; pure SVG charts. Tokens first; light and dark.

   Type scale (the only font sizes in the app): label 11 · meta 12 · body 13 · emph 14 · title 18 (card and section
   titles) · h1 22 (page titles) · kpi 22 · hero 36 (Explore).
   Mono is for numbers in tables and KPIs and for tickers; never for words.
   Status colours: --ok positive/pass · --bad negative/fail · --warn caution · teal opportunity · grey served. */
:root {
  --bg: #f3f5f8; --surface: #ffffff; --surface-2: #f7f9fb; --ink: #17212c; --ink-2: #2b3a4a; --muted: #5f6c7b; --label: #62707d; --line: #e1e7ed; --line-2: #cbd4dd;
  --navy: #142541; --navy-2: #1d3357; --accent-strong: #142541; --accent-strong-2: #1d3357;
  --teal: #4f93a6; --teal-ink: #367587; --teal-soft: #e6f0f3; --soft: #f0f3f6; --soft-2: #e7ecf1; --before: #a7b1bc;
  /* --label is used for small caption text: #62707d is 4.5:1 on the page background (#f3f5f8), the lightest AA-passing grey */
  --ok: #3f7d5e; --warn: #9a6512; --bad: #b0574f; --warn-soft: #f7efdc; --ok-soft: #e6f1ec; --bad-soft: #f8e9e7;
  --pos: var(--ok); --neg: var(--bad);
  --sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, Consolas, monospace;
  --fs-label: 11px; --fs-meta: 12px; --fs-body: 13px; --fs-emph: 14px; --fs-title: 18px; --fs-h1: 22px; --fs-kpi: 22px; --fs-hero: 36px; --fs-mono: 12.5px; --fs-icon: 16px;
  --ls-label: .06em;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px;
  /* one control height (32), a small variant for dense tables (28); one control radius (4); 999 only for chips and tags */
  --r: 4px; --ctl-h: 32px; --ctl-h-sm: 28px; --card-pad: 16px; --gap: 14px; --topbar-h: 48px; --stick-top: var(--topbar-h);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0e1319; --surface: #161d26; --surface-2: #1a222c; --ink: #e4e9ee; --ink-2: #cfd7df; --muted: #96a3b1; --label: #76828f; --line: #26303b; --line-2: #34404d;
    --navy: #0f1a2c; --navy-2: #182642; --accent-strong: #3b5b8a; --accent-strong-2: #476a9c;
    --teal: #6fb3c4; --teal-ink: #8fc7d6; --teal-soft: rgba(111,179,196,.16); --soft: #1c2530; --soft-2: #232e3a; --before: #51606f;
    --ok: #62b98d; --warn: #d8a148; --bad: #e27a6f; --warn-soft: rgba(216,161,72,.14); --ok-soft: rgba(98,185,141,.14); --bad-soft: rgba(226,122,111,.14); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0e1319; --surface: #161d26; --surface-2: #1a222c; --ink: #e4e9ee; --ink-2: #cfd7df; --muted: #96a3b1; --label: #76828f; --line: #26303b; --line-2: #34404d;
  --navy: #0f1a2c; --navy-2: #182642; --accent-strong: #3b5b8a; --accent-strong-2: #476a9c;
  --teal: #6fb3c4; --teal-ink: #8fc7d6; --teal-soft: rgba(111,179,196,.16); --soft: #1c2530; --soft-2: #232e3a; --before: #51606f;
  --ok: #62b98d; --warn: #d8a148; --bad: #e27a6f; --warn-soft: rgba(216,161,72,.14); --ok-soft: rgba(98,185,141,.14); --bad-soft: rgba(226,122,111,.14); color-scheme: dark;
}

/* ── base ─────────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scrollbar-gutter: stable; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--ink); font: var(--fs-body)/1.45 var(--sans); font-variant-numeric: tabular-nums; -webkit-font-smoothing: antialiased; }
* { scrollbar-width: thin; scrollbar-color: var(--line-2) transparent; }
a { color: var(--teal-ink); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 2px; }
h1, h2, h3 { margin: 0; font-weight: 600; letter-spacing: -0.01em; }
h1, .ptitle { font-size: var(--fs-h1); line-height: 1.2; font-weight: 600; letter-spacing: -0.012em; }
/* one uppercase treatment for every eyebrow, header and field label */
h2, .label, .fig .k, .kpi .k, th, .fld > label, fieldset legend, .or, details.defs summary, .pill, .tag, .mini th, .tbl thead th {
  font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; font-weight: 600; color: var(--muted);
}
h2 { color: var(--ink-2); }
h3 { font-size: var(--fs-body); }
p { margin: 0; }
.mono { font-family: var(--mono); }
.num { font-family: var(--mono); font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
.label { display: block; }
.ok { color: var(--ok); } .warn { color: var(--warn); } .bad { color: var(--bad); }
.pos { color: var(--ok); } .neg { color: var(--bad); }
.na { color: var(--label); }
.psub { font-size: var(--fs-meta); color: var(--muted); font-weight: 400; }
.lede { color: var(--muted); max-width: 92ch; }
.crumbs { font-size: var(--fs-meta); color: var(--label); margin-bottom: 8px; }
.crumbs a { color: var(--muted); }
.dfn { border-bottom: 1px dotted var(--label); cursor: help; }
[data-tip] { cursor: default; }
th[data-tip], .k[data-tip], .label[data-tip], h2[data-tip], .psub[data-tip], span[data-tip] { cursor: help; }
th[data-tip], .k[data-tip] { text-decoration: underline dotted var(--label); text-underline-offset: 3px; text-decoration-thickness: 1px; }
/* inline separator: one glyph, even spacing on both sides, never a literal " · " with uneven spaces */
.sep { margin: 0 .4em; color: var(--label); font-weight: 400; }
.ticker, b.mono, .tbl td.l b.mono, .mini td b.mono { font-family: var(--mono); font-weight: 600; color: var(--teal-ink); }
[id] { scroll-margin-top: calc(var(--stick-top) + 16px); }
input[type="number"] { appearance: textfield; -moz-appearance: textfield; text-align: right; font-variant-numeric: tabular-nums; }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

/* ── shell ────────────────────────────────────────────────────────────── */
.wrap { max-width: 1480px; margin: 0 auto; padding: var(--sp-5) 24px 32px; }
.site-foot { border-top: 1px solid var(--line); background: var(--surface); }
.site-foot .sf-in { max-width: 1480px; margin: 0 auto; padding: 12px 24px; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: var(--fs-meta); color: var(--label); }
.site-foot a { color: var(--muted); }
@media (max-width: 700px) { .site-foot .sf-in { padding: 12px 16px; } }
/* page header: crumbs → title → subtitle, actions on the title baseline */
.phead { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; }
.phead .psub { margin-top: 2px; }

/* ── cards, figures, grids ────────────────────────────────────────────── */
.card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: var(--card-pad); min-width: 0; }
/* one inset inside every card: a table placed in .card-bleed (or directly in a card) runs edge to edge, its first and last
   columns sitting on the card inset so they line up with the title and the toolbar above */
.card > .card-bleed, .card > .tbl-wrap:not(.inner) { margin-inline: calc(var(--card-pad) * -1); overflow-x: auto; }
.card > .tbl-wrap:not(.inner) { border-left: 0; border-right: 0; border-radius: 0; }
/* a tall table scrolls with the page so its header can stick under the topbar: no scroll box of its own above 1240px */
.card > .tbl-wrap.tall:not(.inner) { overflow: visible; }
@media (max-width: 1240px) { .card > .tbl-wrap.tall:not(.inner) { overflow-x: auto; } }
.card > .card-bleed { margin-top: 10px; border-top: 1px solid var(--line); }
.card-bleed .tbl thead th:first-child, .card-bleed .tbl td:first-child, .card > .tbl-wrap .tbl thead th:first-child, .card > .tbl-wrap .tbl td:first-child { padding-left: var(--card-pad); }
.card-bleed .tbl thead th:last-child, .card-bleed .tbl td:last-child, .card > .tbl-wrap .tbl thead th:last-child, .card > .tbl-wrap .tbl td:last-child { padding-right: var(--card-pad); }
.card-bleed .empty { text-align: left; padding: 12px var(--card-pad); }
.card > h2 { margin-bottom: 10px; }
.card .note, .note { font-size: var(--fs-meta); color: var(--label); margin-top: 10px; line-height: 1.45; }
.figs { display: grid; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.fig { background: var(--surface); padding: 10px 12px; min-width: 0; }
.fig .k { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.fig .v, .kpi .v { font-size: var(--fs-kpi); font-weight: 600; letter-spacing: -0.015em; margin-top: 3px; line-height: 1.15; font-variant-numeric: tabular-nums; }
.fig .s, .kpi .s { font-size: var(--fs-meta); color: var(--muted); margin-top: 3px; line-height: 1.35; display: block; }
.kpis { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.kpi { background: var(--surface); padding: 10px 14px; min-width: 0; }
.kpi .k { display: block; }
.kpi .v { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kpi .v .psub, .fig .v .psub { font-size: var(--fs-meta); display: block; margin-top: 2px; }
/* sibling cards in a row share one height (S-1); a grid that should not stretch says .grid.top */
.grid { display: grid; gap: var(--gap); align-items: stretch; }
.grid.top { align-items: start; }
.g2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.g5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.g6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.g7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.thesis-layout { display: grid; grid-template-columns: 392px minmax(0, 1fr); gap: var(--gap); align-items: start; }
.market-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: var(--gap); align-items: stretch; }
.market-side { display: grid; gap: var(--gap); align-content: start; align-items: stretch; }
.mk-stack { display: grid; gap: var(--gap); align-content: start; }
.explore-grid { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: var(--gap); align-items: start; }
/* the radar carries ten columns (flows, institutional and RIA adoption included): below 1700px it takes the full
   width and the side cards form a row beneath it */
@media (max-width: 1700px) { .market-grid { grid-template-columns: 1fr; } .market-side { grid-template-columns: repeat(2, minmax(0, 1fr)); } .market-side > .quiet { grid-column: 1 / -1; } }
@media (max-width: 1100px) { .market-side { grid-template-columns: 1fr; } .explore-grid { grid-template-columns: 1fr; } }
/* the rules rail: sticky, scrolls with the page rather than inside itself; its own scrollbar only appears when the
   viewport is shorter than the rail, and then it is thin and hidden until hover */
.thesis-layout > section:first-child { position: sticky; top: calc(var(--topbar-h) + 8px); max-height: calc(100vh - var(--topbar-h) - 16px); overflow-y: auto; padding-right: 2px; scrollbar-width: none; overscroll-behavior: contain; }
.thesis-layout > section:first-child:hover { scrollbar-width: thin; }
.thesis-layout > section:first-child::-webkit-scrollbar { width: 0; }
.rail-sec { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; font-weight: 600; color: var(--muted); padding-top: var(--sp-5); margin-top: var(--sp-1); border-top: 1px solid var(--line); }
.rail-sec:first-child { padding-top: 0; margin-top: 0; border-top: 0; }
.rowlink { font: 500 var(--fs-body) var(--sans); color: var(--teal-ink); opacity: .8; white-space: nowrap; }
tr:hover .rowlink, .roomrow:hover .rowlink { opacity: 1; }
/* tables grow with the page; headers stick under the topbar */
.tbl-wrap.tall { overflow: visible; }
.tbl-wrap.tall .tbl thead th { top: var(--stick-top); }
.tbl-wrap.tall .tbl tr.grp td { top: calc(var(--stick-top) + 31px); }
/* below 1240px a wide table scrolls inside its card (and loses the page-level sticky header) rather than
   pushing the whole page sideways; secondary columns are hidden first */
@media (max-width: 1240px) { .tbl-wrap.tall { overflow-x: auto; } .hide-md { display: none !important; } }
.tbl-wrap.inner { max-height: 70vh; overflow: auto; overscroll-behavior: contain; }
.chip .g { font-size: var(--fs-label); opacity: .8; }
.skel { background: linear-gradient(90deg, var(--soft) 25%, var(--soft-2) 50%, var(--soft) 75%); background-size: 200% 100%; animation: shimmer 1.2s infinite; border-radius: 2px; color: transparent; }
@keyframes shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }
.err { max-width: 560px; margin: 12vh auto; }
.reading { border-left: 3px solid var(--teal); }
.reading.quiet { border-left-color: var(--before); }
.reading .t { font-size: var(--fs-emph); font-weight: 600; margin-top: 4px; }
.reading p { font-size: var(--fs-body); color: var(--muted); margin: 2px 0 0; line-height: 1.5; }
.segbox { border: 1px solid var(--line); border-radius: var(--r); padding: var(--sp-3) var(--sp-4); min-width: 0; }
.popover { position: absolute; top: 100%; left: 0; z-index: 30; min-width: 320px; background: var(--surface); border: 1px solid var(--line-2); border-radius: var(--r); box-shadow: 0 6px 20px rgba(0,0,0,.12); margin-top: 4px; max-height: 320px; overflow: auto; }
.popover button { display: grid; grid-template-columns: 70px 1fr auto; gap: 10px; width: 100%; text-align: left; padding: 7px 10px; border: 0; background: transparent; font: var(--fs-body) var(--sans); color: var(--ink); cursor: pointer; border-bottom: 1px solid var(--soft); }
.popover button:hover, .popover button.sel { background: var(--soft); }
.rowact { font: 500 var(--fs-meta) var(--sans); color: var(--muted); background: none; border: 1px solid transparent; border-radius: var(--r); padding: 1px 6px; cursor: pointer; min-height: 24px; min-width: 24px; }
.rowact:hover { color: var(--bad); border-color: var(--line-2); }
.rowact.add:hover { color: var(--teal-ink); }
tr.forced td:first-child::before { content: "+"; color: var(--teal-ink); font-weight: 700; margin-right: 4px; }
button.fcard { text-align: left; background: var(--surface); color: inherit; font: inherit; cursor: pointer; width: 100%; }
button.fcard:hover { border-color: var(--teal); }
button.fcard:hover .psub:last-child { color: var(--teal-ink); }
.segbox .h { display: flex; justify-content: space-between; align-items: baseline; font-size: var(--fs-emph); font-weight: 600; }
.segbox .h .num { font: var(--fs-body) var(--mono); font-weight: 500; }
.quote { background: var(--soft); border: 1px dashed var(--line-2); border-radius: var(--r); padding: var(--sp-3) var(--sp-4); font-size: var(--fs-body); color: var(--muted); line-height: 1.6; }
.quote b { color: var(--ink); }
.info { border-left: 3px solid var(--teal); background: var(--teal-soft); padding: var(--sp-2) var(--sp-3); font-size: var(--fs-body); border-radius: var(--r); }
.empty { padding: var(--sp-4); color: var(--muted); font-size: var(--fs-body); text-align: center; }

/* ── controls (one height in a toolbar row) ───────────────────────────── */
.btn { font: 600 var(--fs-meta) var(--sans); height: var(--ctl-h); padding: 0 12px; border: 1px solid var(--line-2); border-radius: var(--r); background: var(--surface); color: var(--ink); cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.btn:hover { border-color: var(--accent-strong); text-decoration: none; }
.btn.primary { background: var(--accent-strong); color: #fff; border-color: var(--accent-strong); }
.btn.primary:hover { background: var(--accent-strong-2); }
.btn.teal { background: var(--teal); color: #fff; border-color: var(--teal); }
.btn:disabled { opacity: .5; cursor: not-allowed; background: var(--soft); color: var(--muted); border-color: var(--line-2); }
.btn.quiet { border-color: transparent; color: var(--teal-ink); background: transparent; }
/* the small variant, for dense tables and inline actions */
.btn.sm { height: var(--ctl-h-sm); padding: 0 10px; font-size: var(--fs-meta); }
.btn.quiet:hover { border-color: var(--line-2); }
.seg { display: inline-flex; border: 1px solid var(--line-2); border-radius: var(--r); overflow: hidden; background: var(--surface); height: var(--ctl-h); }
.seg a, .seg button { font: 500 var(--fs-meta) var(--sans); padding: 0 12px; border: 0; background: transparent; color: var(--ink); text-decoration: none; cursor: pointer; display: inline-flex; align-items: center; }
.seg a + a, .seg button + button { border-left: 1px solid var(--line-2); }
.seg a:hover { text-decoration: none; background: var(--soft); }
.seg .on { background: var(--accent-strong); color: #fff; font-weight: 600; }
.ctl, select.ctl, input.ctl { font: var(--fs-body) var(--sans); height: var(--ctl-h); padding: 0 9px; border: 1px solid var(--line-2); border-radius: var(--r); background: var(--surface); color: var(--ink); }
select.ctl { padding-right: 24px; appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%235f6c7b' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 8px center; }
.ctl:focus, .btn:focus-visible, .seg a:focus-visible, .seg button:focus-visible, .chip:focus-visible, a:focus-visible, button:focus-visible, summary:focus-visible, .ccard:focus-visible, .fcard:focus-visible, .rowlink:focus-visible { outline: 2px solid var(--teal); outline-offset: 1px; }
.ctl::placeholder { color: var(--label); }
.ctl.search { padding-left: 26px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Ccircle cx='5' cy='5' r='3.6' fill='none' stroke='%236b7886' stroke-width='1.4'/%3E%3Cpath d='M8 8l3 3' stroke='%236b7886' stroke-width='1.4'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: 8px center; }
/* unit inside the input: a wrapper with the suffix laid over the field's right edge */
.unit { position: relative; display: inline-flex; align-items: center; }
.unit input { padding-right: 22px; }
.unit::after { content: attr(data-unit); position: absolute; right: 8px; font-size: var(--fs-meta); color: var(--label); pointer-events: none; }
input[type="checkbox"], input[type="range"], input[type="radio"] { accent-color: var(--teal); width: 14px; height: 14px; vertical-align: middle; margin: 0; }
.toolbar { display: flex; gap: var(--sp-2); align-items: center; flex-wrap: wrap; }
.toolbar .grow { flex: 1 1 auto; }
.chip { font: 500 var(--fs-meta) var(--sans); height: var(--ctl-h); padding: 0 11px; border: 1px solid var(--line-2); border-radius: 999px; background: var(--surface); color: var(--ink); text-decoration: none; display: inline-flex; align-items: center; gap: 5px; }
.chip:hover { border-color: var(--accent-strong); text-decoration: none; }
/* an active exclusion is a removable chip, not a selected button */
.chip.on { background: var(--soft-2); color: var(--ink); border-color: transparent; }
.chip.on .g { color: var(--muted); }
.chip.on:hover { background: var(--bad-soft); border-color: transparent; }
.chip.on:hover .g { color: var(--bad); }
.chip.pos, .chip.neg, .chip.neu { height: 24px; padding: 0 9px; font-size: var(--fs-meta); }
.chip.pos { border-color: var(--ok); color: var(--ok); background: var(--ok-soft); }
.chip.neg { border-color: var(--bad); color: var(--bad); background: var(--bad-soft); }
.chip.neu { color: var(--muted); }
fieldset.ex { border: 1px solid var(--line-2); border-radius: var(--r); padding: 4px 10px; margin: 0; display: flex; gap: 14px; align-items: center; background: var(--surface); flex-wrap: wrap; }
fieldset.ex legend { padding: 0 4px; }

/* ── tables ───────────────────────────────────────────────────────────── */
.tbl-wrap { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); overflow-x: auto; }
.tbl-wrap.fade { position: relative; }
table.tbl { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--fs-body); }
.tbl thead th { position: sticky; top: 0; z-index: 2; background: var(--surface); padding: 9px 8px 7px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--line-2); }
.tbl thead th:first-child, .tbl td:first-child { padding-left: var(--card-pad); }
.tbl thead th:last-child, .tbl td:last-child { padding-right: var(--card-pad); }
.tbl thead th.l, .tbl td.l { text-align: left; }
.tbl th[data-sort] { cursor: pointer; user-select: none; }
.tbl th[data-sort]:hover, .tbl th.sorted { color: var(--ink); }
.tbl th .arr { display: inline-block; width: 11px; text-align: center; color: var(--label); font-size: var(--fs-label); margin-left: 3px; }
/* right-aligned columns: the arrow hangs left of the label and takes no width, so the label ends on the numbers' edge */
.tbl th:not(.l) .arr { width: 0; margin: 0; text-align: left; text-indent: -14px; vertical-align: baseline; }
.tbl th[data-sort]:hover .arr:empty::before { content: "↕"; }
.tbl th.sorted .arr { color: var(--ink); }
.tbl td { padding: 7px 8px; border-bottom: 1px solid var(--soft); text-align: right; white-space: nowrap; vertical-align: middle; }
.tbl tbody tr:last-child td { border-bottom: 0; }
.tbl td.num { font-family: var(--mono); font-size: var(--fs-mono); }
.tbl tbody tr:hover td { background: var(--soft); }
.tbl tr.me td, .mini tr.cur td { background: var(--soft); font-weight: 600; }
.tbl tr.me td:first-child, .mini tr.cur td:first-child { box-shadow: inset 2px 0 0 var(--teal); }
.tbl .sub { color: var(--muted); font-size: var(--fs-meta); font-weight: 400; }
.tbl .nm { display: block; max-width: 27ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tbl .nm .sub { display: block; overflow: hidden; text-overflow: ellipsis; }
.tbl.dense td { padding: 6px 8px; }
.tbl tr.grp td { background: var(--soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); text-align: left; padding: 7px var(--card-pad); font-size: var(--fs-body); cursor: pointer; position: sticky; top: 31px; z-index: 1; }
.tbl tr.grp:hover td { background: var(--soft-2); }
.tbl tr.grp .chev { display: inline-block; width: 14px; color: var(--muted); font-size: var(--fs-mono); transition: transform .12s; }
.tbl tr.grp.closed .chev { transform: rotate(-90deg); }
.tbl.grouped tr[data-grp]:not(.grp) td:first-child { padding-left: 28px; }
.tbl.dense thead th { padding: 8px 8px 6px; }
#comp.tbl.dense td, #comp.tbl.dense thead th { padding-left: 6px; padding-right: 6px; }
.tbl .btn { height: 24px; padding: 0 9px; font-size: var(--fs-meta); }
/* identity column stays put when a wide table scrolls */
.tbl.stick th:first-child, .tbl.stick td:first-child { position: sticky; left: 0; z-index: 1; background: var(--surface); box-shadow: inset -1px 0 0 var(--line); }
.tbl.stick thead th:first-child { z-index: 3; }
.tbl.stick tbody tr:hover td:first-child { background: var(--soft); }
.tbl-wrap.inner .tbl.stick td:last-child, .tbl-wrap.inner .tbl.stick th:last-child { padding-right: 20px; }
.tbl tr.empty td { text-align: center; color: var(--muted); padding: 22px; }
.bar { height: 7px; background: var(--soft-2); border-radius: 2px; position: relative; min-width: 50px; }
.bar i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--teal); border-radius: 2px; }
.bar i.grey { background: var(--before); }
.bar i.navy { background: var(--accent-strong); }
.bar i.pale { background: var(--line-2); }
.stack { display: flex; height: 7px; border-radius: 2px; overflow: hidden; min-width: 90px; background: var(--soft-2); }
.stack i { display: block; height: 7px; }
.pill { padding: 2px 7px; border-radius: var(--r); border: 1px solid currentColor; display: inline-block; }
/* reading tags: open space strongest teal, room soft teal, contested amber, thin amber outline, served grey */
.tag { padding: 2px 7px; border-radius: var(--r); white-space: nowrap; display: inline-block; min-width: 0; line-height: 1.4; }
.tag.open { background: var(--teal); color: #fff; }
.tag.room { background: var(--teal-soft); color: var(--teal-ink); }
.tag.some, .tag.contested { background: var(--warn-soft); color: var(--warn); }
.tag.thin { background: transparent; color: var(--muted); border: 1px solid var(--line-2); padding: 1px 6px; }
.tag.busy { background: transparent; color: var(--ink-2); border: 1px solid var(--ink-2); padding: 1px 6px; }
.tag.served { background: var(--soft-2); color: var(--muted); }
.tag.ok { background: var(--ok-soft); color: var(--ok); }
.tag.bad { background: var(--bad-soft); color: var(--bad); }
.tag.desc { background: var(--warn-soft); color: var(--warn); text-transform: none; letter-spacing: 0; font-weight: 500; }
.tag.type { background: var(--soft-2); color: var(--muted); padding: 1px 5px; font-size: var(--fs-label); letter-spacing: .06em; vertical-align: 1px; }
/* purity heat: five steps from soft to teal ink, text contrast flips at step 3 */
.heat { display: inline-block; min-width: 40px; text-align: center; padding: 2px 6px; border-radius: var(--r); font: var(--fs-meta) var(--mono); background: var(--soft-2); color: var(--ink); }
.heat.h1 { background: var(--soft-2); color: var(--ink); }
.heat.h2 { background: var(--teal-soft); color: var(--teal-ink); }
.heat.h3 { background: #bcd7de; color: var(--navy); }
.heat.h4 { background: var(--teal); color: #fff; }
.heat.h5 { background: var(--teal-ink); color: #fff; }
:root[data-theme="dark"] .heat.h3 { background: rgba(111,179,196,.4); color: var(--ink); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .heat.h3 { background: rgba(111,179,196,.4); color: var(--ink); } }
.mini { width: 100%; border-collapse: collapse; font-size: var(--fs-body); }
.mini th { text-align: right; padding: 3px 4px; border-bottom: 1px solid var(--line); }
.mini th:first-child, .mini td:first-child { text-align: left; }
.mini td { text-align: right; padding: 4px; border-bottom: 1px solid var(--soft); white-space: nowrap; }
.mini td.num { font-family: var(--mono); }
.mini tbody tr:hover td, .mini tr:hover td { background: var(--soft); }
.mini tr.subhead td { background: var(--surface); color: var(--muted); font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; font-weight: 600; padding-top: 10px; border-bottom: 1px solid var(--line); }
.mini tr.subhead:hover td { background: var(--surface); }
.mini td.hl, .mini th.hl { background: var(--soft); }
.bars { display: grid; grid-template-columns: 150px 1fr 44px; gap: 6px 10px; align-items: center; font-size: var(--fs-body); }
.bars .n { text-align: right; font-family: var(--mono); font-size: var(--fs-mono); }
.bars .l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bars .cap { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--muted); font-weight: 600; }
.roomrow { display: grid; grid-template-columns: 1fr 64px 64px; gap: 12px; align-items: center; padding: 8px 0; border-top: 1px solid var(--soft); }
.roomrow:first-of-type { border-top: 0; }
.roomrow .n { font-size: var(--fs-emph); font-weight: 600; text-align: right; font-family: var(--mono); }
.roomhead { display: grid; grid-template-columns: 1fr 64px 64px; gap: 12px; padding-bottom: 4px; border-bottom: 1px solid var(--line); }
.roomhead span { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--muted); font-weight: 600; text-align: right; }
.roomhead span:first-child { text-align: left; }

/* ── tooltip (one component; JS positions and clamps it) ──────────────── */
.tip { position: absolute; pointer-events: none; background: var(--navy); color: #fff; font-size: var(--fs-meta); line-height: 1.45; padding: 7px 10px; border-radius: var(--r); opacity: 0; transition: opacity .1s; white-space: nowrap; z-index: 3; }

/* ── thesis composer: one wide filter board, every input visible, sections side by side ── */
.rules { padding: var(--sp-4) var(--sp-5); }
.rules-board { display: grid; grid-template-columns: minmax(300px, 1.5fr) minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0 24px; align-items: start; }
.rsec { min-width: 0; padding-left: 24px; border-left: 1px solid var(--line); display: grid; align-content: start; }
.rsec:first-child, .rsec.thesis { padding-left: 0; border-left: 0; }
.rsec-h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 10px; }
.rsec-h h2 { margin: 0; }
.rsec-h .psub b { font-family: var(--mono); font-weight: 600; color: var(--ink); }
.fgrid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; }
.funnel { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 4px 10px; align-items: center; font-size: var(--fs-meta); margin-top: 6px; }
.funnel .cap { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--muted); font-weight: 600; }
.funnel .bar { height: 5px; }
.funnel .n { font-family: var(--mono); text-align: right; font-size: var(--fs-mono); }
.funnel .r { color: var(--muted); font-family: var(--mono); text-align: right; font-size: var(--fs-mono); min-width: 4ch; }
.funnel .lbl { display: flex; gap: 8px; align-items: center; min-width: 0; }
.funnel .lbl span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 1240px) { .rules-board { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 24px; } .rsec:nth-child(odd) { padding-left: 0; border-left: 0; } .rsec:nth-child(even) { padding-left: 24px; border-left: 1px solid var(--line); } }
@media (max-width: 760px) { .rules-board { grid-template-columns: 1fr; } .rsec { padding-left: 0 !important; border-left: 0 !important; } }

/* ── thesis composer (fields) ─────────────────────────────────────────── */
.fgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 10px 12px; }
.fld { min-width: 0; }
.fld > label { display: block; margin-bottom: 4px; line-height: 1.25; }
.fld .ctl { width: 100%; }
.fld .dialnum, .fld input[type="number"] { font: 500 var(--fs-body) var(--sans); font-variant-numeric: tabular-nums; text-align: right; }
.fld .themes { display: grid; gap: 6px; }
.fld .themes .trow { display: grid; grid-template-columns: minmax(0, 1fr) 24px; gap: 4px; align-items: center; }
.fld .themes .trow .x { height: 24px; width: 24px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.clause { padding: var(--sp-3) var(--sp-4); background: var(--soft); border-radius: var(--r); border-left: 3px solid var(--teal); }
.clause.ex { border-left-color: var(--bad); }
.clause .cl-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.clause .count { font: 500 var(--fs-meta) var(--sans); font-variant-numeric: tabular-nums; color: var(--teal-ink); margin-left: auto; white-space: nowrap; }
.clause .x { background: none; border: 0; color: var(--muted); cursor: pointer; font-size: var(--fs-icon); line-height: 1; padding: 2px 4px; }
.clause .x:hover { color: var(--bad); }
.or { display: flex; align-items: center; gap: 10px; color: var(--label); }
.or:before, .or:after { content: ""; flex: 1; height: 1px; background: var(--line); }
.busy { opacity: .55; transition: opacity .15s; }

/* ── constituent cards ────────────────────────────────────────────────── */
.ccard { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); padding: 10px 12px; text-decoration: none; color: inherit; display: block; min-width: 0; }
.ccard:hover { border-color: var(--teal); color: inherit; text-decoration: none; }
.ccard .h { display: flex; justify-content: space-between; font-weight: 600; font-size: var(--fs-body); }
.ccard .nm { font-size: var(--fs-meta); color: var(--muted); margin: 2px 0 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ccard .f { display: flex; justify-content: space-between; font-size: var(--fs-meta); margin-top: 6px; }

/* ── proof card ───────────────────────────────────────────────────────── */
.tl { display: grid; grid-template-columns: 12px 1fr; gap: 6px 10px; font-size: var(--fs-body); line-height: 1.5; margin-top: 10px; }
.tl .sw { width: 10px; height: 10px; border-radius: 2px; margin-top: 5px; background: var(--teal); }
.tl .sw.o { background: var(--line-2); }
.tl .why { color: var(--muted); }
.tl .conf { font-size: var(--fs-meta); color: var(--muted); font-variant-numeric: tabular-nums; }

/* ── charts (pure SVG). Text is held at a true 11px whatever the rendered width: JS sets --k per chart ── */
.scatter { width: 100%; height: auto; font-family: var(--sans); display: block; --k: 11px; }
.scatter text { fill: var(--muted); font-size: var(--k); }
.scatter text.ink { fill: var(--ink); }
.scatter text.lbl { pointer-events: none; paint-order: stroke; stroke: var(--surface); stroke-width: 3px; stroke-linejoin: round; }
.scatter text.zone { fill: var(--label); font-weight: 600; letter-spacing: .08em; }
.scatter.narrow text.lbl, .scatter.narrow line.lead { display: none; }
.scatter text.zone.room { fill: var(--teal-ink); }
.scatter line.axis { stroke: var(--line-2); }
.scatter line.grid { stroke: var(--soft-2); }
.scatter line.lead { stroke: var(--line-2); stroke-width: 1; }
.scatter circle { fill: var(--before); opacity: .7; stroke: var(--surface); stroke-width: 1; }
.scatter line.me { stroke: var(--teal); stroke-width: 2; }
.scatter circle.na { fill: var(--surface); stroke: var(--before); stroke-width: 1.5; opacity: 1; }
.scatter rect.me { fill: var(--teal); stroke: var(--navy); stroke-width: 1.5; }
.scatter rect.white { fill: var(--teal); opacity: .07; }
.scatter circle.pt { opacity: .8; cursor: pointer; transition: opacity .1s; }
/* A-2: an invisible 12px hit circle under every chart point */
.scatter circle.hitc { fill: transparent; stroke: none; opacity: 1; cursor: pointer; }
.scatter a:focus-visible circle.hitc { stroke: var(--teal); stroke-width: 2; }
.scatter circle.pt.room { fill: var(--teal); }
.scatter circle.pt.served { fill: var(--before); }
.scatter circle.pt.thin { fill: var(--line-2); }
.scatter circle.pt.some { fill: var(--teal); opacity: .45; }
.scatter circle.pt.open { fill: var(--surface); stroke: var(--teal); stroke-width: 1.8; opacity: 1; }
.scatter circle.pt:hover { opacity: 1; stroke: var(--navy); stroke-width: 1.5; }
.legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: var(--fs-meta); color: var(--muted); margin-top: 6px; align-items: center; }
.legend i { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin-right: 5px; vertical-align: -1px; background: var(--before); }
.legend i.room { background: var(--teal); } .legend i.some { background: var(--teal); opacity: .45; } .legend i.thin { background: var(--line-2); }
.legend i.open { background: var(--surface); border: 1.8px solid var(--teal); } .legend i.served { background: var(--before); }
.legend i.sq { border-radius: 1px; height: 3px; width: 14px; vertical-align: 3px; }

/* ── inline sparklines (flows by month, theme index) ─────────────────────── */
.spark { width: 72px; height: 18px; vertical-align: middle; overflow: visible; }
.spark rect.p { fill: var(--ok); opacity: .75; } .spark rect.n { fill: var(--bad); opacity: .75; }
.flowchart { width: 100%; display: block; }
.spark line.z { stroke: var(--line-2); stroke-width: 1; }
.spark path { fill: none; stroke: var(--accent-strong); stroke-width: 1.3; }
.spark.wide { width: 120px; }

/* ── KPI bands: a row of figures with a label saying what kind of data it is ── */
.bands { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 10px; align-items: stretch; }
.band { border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); padding: var(--sp-2) var(--sp-3) 10px; display: grid; gap: 6px; align-content: start; min-width: 0; }
.band > .label { margin: 0; display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.band > .label .psub { font-weight: 400; text-transform: none; letter-spacing: 0; }
.band .figs { gap: 0; margin: 0; border: 0; background: none; overflow: visible; }
.band .figs .fig { border: 0; border-radius: 0; padding: 2px 12px 0; background: none; box-shadow: -1px 0 0 var(--line); }
.band .figs .fig.rs, .band .figs .fig:first-child { box-shadow: none; padding-left: 0; }
.band .figs .fig .k { white-space: normal; overflow: visible; text-overflow: clip; }
.band .figs .fig .v.na { font-size: var(--fs-body); font-weight: 500; color: var(--label); margin-top: 6px; }
@media (max-width: 1300px) { .bands { grid-template-columns: 1fr 1fr; } .bands .band:first-child { grid-column: 1 / -1; } }
@media (max-width: 800px) { .bands { grid-template-columns: 1fr; } }

/* ── company proof card ───────────────────────────────────────────────── */
.co-head { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: 20px; align-items: start; }
.desc { font-size: var(--fs-body); line-height: 1.55; max-width: 84ch; }
.desc.clamp { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.desc-more { font-size: var(--fs-meta); }
.score-hero { background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--accent-strong); border-radius: var(--r); padding: var(--sp-3) var(--sp-4); display: grid; gap: 8px; }
.score-hero .big { font-size: var(--fs-hero); font-weight: 600; line-height: 1; letter-spacing: -0.02em; }
.score-hero .pillars { display: grid; grid-template-columns: 90px 1fr 32px; gap: 5px 10px; align-items: center; font-size: var(--fs-body); }
.score-hero .pillars .n { text-align: right; font-family: var(--mono); font-size: var(--fs-mono); }
.score-hero .zs { display: grid; grid-template-columns: repeat(4, auto); justify-content: space-between; gap: 8px; font-size: var(--fs-meta); color: var(--muted); white-space: nowrap; }
.score-hero .zs b { font-family: var(--mono); font-weight: 600; color: var(--ink); }
.score-hero .dot { display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--ok); margin-right: 5px; vertical-align: 0; }
.score-hero .dot.off { background: var(--warn); }
.kv { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 14px; font-size: var(--fs-body); align-items: baseline; }
.kv span { color: var(--muted); }
.kv b { font-family: var(--mono); font-weight: 600; text-align: right; white-space: nowrap; }
.kv b .psub { font-family: var(--sans); font-weight: 400; display: block; margin-top: 1px; }
.kv b .psub.inl { display: inline; margin: 0 0 0 4px; }
.call { border: 1px solid var(--line); border-radius: var(--r); padding: 10px 12px; background: var(--surface-2); display: grid; gap: 8px; }
.call .print { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 16px; font-size: var(--fs-body); }
.call .print > div { display: flex; gap: 6px; align-items: baseline; flex-wrap: wrap; }
.call .print .k { color: var(--muted); font-size: var(--fs-meta); text-transform: none; letter-spacing: 0; font-weight: 400; }
.call .print b { font-family: var(--mono); font-weight: 600; }
.call .tk { margin: 0; padding-left: 16px; font-size: var(--fs-body); line-height: 1.5; display: grid; gap: 4px; }
.call .readthru { font-size: var(--fs-body); line-height: 1.5; margin: 0; color: var(--ink); }
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.bars.esg .l { width: 96px; }
.co-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: var(--gap); align-items: start; }
@media (max-width: 1100px) { .co-head, .co-grid { grid-template-columns: 1fr; } }
.co-head > *, .co-grid > * { min-width: 0; }

/* ── definitions ──────────────────────────────────────────────────────── */
details.defs { margin-top: var(--sp-3); font-size: var(--fs-meta); color: var(--label); line-height: 1.5; }
details.defs summary { cursor: pointer; }
details.defs dl { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 8px 24px; margin: 10px 0 0; max-width: none; }
details.defs dl div { max-width: 72ch; }
details.defs dt { font-weight: 600; color: var(--ink); display: inline; }
details.defs dd { margin: 0; display: inline; color: var(--muted); }
details.defs dt::after { content: " "; }
.login { max-width: 360px; margin: 10vh auto; }

/* ── responsive ───────────────────────────────────────────────────────── */
@media (max-width: 1240px) { .thesis-layout { grid-template-columns: 1fr; } .thesis-layout > section:first-child { position: static; max-height: none; overflow: visible; } .kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .g3, .g4, .g5, .g6, .g7 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) {
  .wrap { padding-inline: 16px; }
  .g2, .g3, .g4, .g5, .g6, .g7 { grid-template-columns: 1fr; }
  .kpis, .figs.g7, .figs { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .bars { grid-template-columns: 110px 1fr 40px; }
  .co-head { grid-template-columns: 1fr; }
  .phead form, .phead .row { flex-wrap: wrap !important; }
  .phead select.ctl { min-width: 0 !important; max-width: 100%; }
  .toolbar .grow { display: none; }
  .toolbar > form, .toolbar > span { flex-wrap: wrap; }
  .tbl-wrap.inner { max-height: none; }
  .scatter { min-height: 180px; }
  .band .figs { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .band .figs .fig:nth-child(2n+1) { box-shadow: none; padding-left: 0; }
  .band .figs .fig { padding-bottom: 8px; }
  .legend .psub { margin-left: 0 !important; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ── fund page: what the prospectus says ── */
.pros-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 24px; margin-top: 10px; align-items: start; }
.pros-lede { margin: 0; font-size: var(--fs-emph); line-height: 1.55; color: var(--ink); max-width: 72ch; }
.pros-body { margin: 4px 0 0; font-size: var(--fs-body); line-height: 1.55; color: var(--ink); max-width: 80ch; }
.pros-kv { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 7px 14px; margin: 0; font-size: var(--fs-body); }
.pros-kv dt { font-size: var(--fs-label); letter-spacing: var(--ls-label); text-transform: uppercase; color: var(--muted); font-weight: 600; padding-top: 2px; }
.pros-kv dd { margin: 0; line-height: 1.45; min-width: 0; }
.pros-sub { display: block; color: var(--muted); font-size: var(--fs-meta); margin-top: 2px; }
.pros-risks { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 8px; }
.pros-risks summary { cursor: pointer; font-size: var(--fs-meta); color: var(--muted); }
@media (max-width: 900px) { .pros-grid { grid-template-columns: 1fr; } }

/* ── Builder: how it compares to the space ── */
.space-grid { min-width: 860px; }
.space-grid th, .space-grid td { vertical-align: top; padding: 7px 10px; }
.space-grid td.l.muted { white-space: nowrap; font-size: var(--fs-meta); }
.space-grid .hl { background: var(--soft); }
.space-grid .sn { white-space: nowrap; line-height: 1.5; }
.space-grid .sn.out { opacity: .5; }
.chip.sm { font-size: var(--fs-label); padding: 1px 7px; height: auto; margin: 0 2px 3px 0; cursor: default; }
.ovm th, .ovm td { padding: 4px 8px; text-align: center; }
.ovm th.l { text-align: left; }
.space-grid th, .space-grid td, .space-grid td.num { text-align: left; }
.space-grid thead th .sub { text-transform: none; letter-spacing: 0; }

.toast { position: fixed; left: 50%; bottom: 24px; transform: translate(-50%, 20px); opacity: 0; pointer-events: none; transition: all .18s; background: var(--ink); color: var(--surface); border-radius: var(--r); padding: 9px 14px; display: flex; gap: 12px; align-items: center; z-index: 50; font-size: var(--fs-body); box-shadow: 0 6px 20px rgba(0,0,0,.2); }
.toast.on { opacity: 1; transform: translate(-50%, 0); pointer-events: auto; }
.toast button { background: transparent; border: 1px solid currentColor; color: inherit; border-radius: var(--r); padding: 2px 9px; font: 600 var(--fs-meta) var(--sans); cursor: pointer; }
.purpose { margin: 2px 0 10px; color: var(--muted); font-size: var(--fs-body); max-width: 90ch; }
.term { border-bottom: 1px dotted var(--label); cursor: help; }
@media (prefers-reduced-motion: reduce) { .toast { transition: none; } }


/* ── company page: place in the thesis; embedded in the Builder drawer ── */
.co-place { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; border: 1px solid var(--line); border-left: 3px solid var(--teal); background: var(--teal-soft); border-radius: var(--r); padding: 8px 12px; margin: 0 0 12px; font-size: var(--fs-body); }
.co-place .spacer { flex: 1 1 auto; }
.btn.ghostbtn { background: var(--surface); }
body.embed .wrap { padding-top: 12px; }

/* ── Builder: page header, folds, adjustments, sticky KPI strip with deltas, result tabs, checks, drawer ── */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.th-head { margin: 4px 0 12px; }
.th-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.th-row .spacer { flex: 1 1 auto; }
.th-name { font: 600 var(--fs-title) var(--sans); color: var(--ink); border: 1px solid transparent; border-radius: var(--r); background: transparent; padding: 2px 6px; margin-left: -6px; min-width: 0; width: min(520px, 100%); }
.th-name:hover { border-color: var(--line); }
.th-name:focus { border-color: var(--accent-strong); outline: 0; background: var(--surface); }
.th-status { font-size: var(--fs-meta); color: var(--muted); white-space: nowrap; }
.th-status .dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--warn); margin-right: 6px; vertical-align: 1px; }
.btn.primary { background: var(--accent-strong); border-color: var(--accent-strong); color: #fff; }
.btn.primary:hover { filter: brightness(1.08); }
.btn:disabled { opacity: .45; cursor: default; }
.th-summary { margin: 6px 0 0; color: var(--muted); font-size: var(--fs-body); max-width: 120ch; }
.name-prompt { display: flex; gap: 8px; align-items: center; margin-top: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); }
.name-prompt label { font-size: var(--fs-meta); color: var(--muted); }
.name-prompt input { width: 360px; }
.hist-wrap, .colpick-wrap { position: relative; }
.hist-pop { right: 0; left: auto; width: 380px; }
.hist-pop button { grid-template-columns: 1fr auto; }
#origin-note, #draft-note { margin-bottom: 12px; }
details.adv { margin-top: 10px; border-top: 1px dashed var(--line); padding-top: 8px; }
details.adv > summary { cursor: pointer; font-size: var(--fs-meta); color: var(--muted); list-style: none; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
details.adv > summary::-webkit-details-marker { display: none; }
details.adv > summary::before { content: "▸"; font-size: var(--fs-label); }
details.adv[open] > summary::before { content: "▾"; }
details.adv[open] > summary { margin-bottom: 8px; }
.adv-sum .muted { font-size: var(--fs-meta); }
.adj-list { display: grid; gap: 4px; }
.adj-item { display: flex; align-items: center; gap: 8px; font-size: var(--fs-body); }
.adj-item .x { margin-left: auto; }
.adj-add { display: flex; gap: 6px; margin-top: 8px; }
.adj-add input { width: 110px; }
.kpibar { position: sticky; top: var(--stick-top); z-index: 15; background: var(--bg); margin: 14px -2px 0; padding: 6px 2px 0; }
.kpibar .figs { margin: 0; }
.kpibar.busy .figs { opacity: .55; transition: opacity .15s; }
.kpibar .fig .v .delta { font-size: var(--fs-meta); font-weight: 600; margin-left: 6px; vertical-align: 2px; font-family: var(--mono); }
.kpibar .fig .v .delta.up { color: var(--ok); }
.kpibar .fig .v .delta.down { color: var(--bad); }
.kpibar .fig.changed { animation: figflash 1.4s ease-out; }
@keyframes figflash { 0% { background: var(--teal-soft); } 100% { background: transparent; } }
.rtabs { display: flex; gap: 2px; border-bottom: 1px solid var(--line); margin-top: 8px; overflow-x: auto; scrollbar-width: none; }
.rtabs button { background: none; border: 0; border-bottom: 2px solid transparent; padding: 9px 14px 8px; font: 500 var(--fs-body) var(--sans); color: var(--muted); cursor: pointer; white-space: nowrap; }
.rtabs button.on { color: var(--ink); border-bottom-color: var(--teal); font-weight: 600; }
.rtabs button:hover { color: var(--ink); }
.tcount { font-size: var(--fs-label); font-family: var(--mono); color: var(--muted); margin-left: 4px; }
.tcount.warn { color: var(--warn); font-weight: 600; }
.tcount.bad { color: var(--bad); font-weight: 600; }
.out { margin-top: 14px; }
.tabpanel[hidden] { display: none !important; }
.card.busy { opacity: .6; transition: opacity .15s; }
#tab-constituents .tbl-wrap.tall .tbl thead th, [data-panel="constituents"] .tbl-wrap.tall .tbl thead th { top: calc(var(--stick-top) + var(--kpi-h, 0px)); }
[data-panel="constituents"] .tbl-wrap.tall .tbl tr.grp td { top: calc(var(--stick-top) + var(--kpi-h, 0px) + 31px); }
#ctab .rowact { opacity: 0; transition: opacity .12s; }
#ctab tr:hover .rowact, #ctab .rowact:focus, #ctab tr.near .rowact { opacity: 1; }
.colpick { right: 0; left: auto; width: 240px; padding-bottom: 6px; }
.cp-presets { display: flex; flex-wrap: wrap; gap: 4px; padding: 0 12px 6px; }
.cp-presets .chip.sm { cursor: pointer; }
.cp-row { display: flex; gap: 8px; align-items: center; padding: 3px 12px; font-size: var(--fs-body); cursor: pointer; }
.check { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 10px; padding: 10px 0; border-top: 1px solid var(--line); }
.check:first-child { border-top: 0; }
.ck-ico { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font: 700 var(--fs-label) var(--sans); color: #fff; background: var(--label); }
.check.ok .ck-ico { background: var(--ok); }
.check.bad .ck-ico { background: var(--bad); }
.check.warn .ck-ico { background: var(--warn); }
.ck-fix { font-size: var(--fs-meta); color: var(--ink); margin-top: 3px; }
.ck-fix::before { content: "To change it: "; color: var(--muted); }
.empty-state { margin-top: 8px; }
.es-pick { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 10px 0; }
.es-pick #es-find { width: 260px; }
.es-chosen { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.es-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px 18px; max-height: 420px; overflow: auto; padding: 4px 0; }
.es-group { display: flex; flex-wrap: wrap; gap: 6px; align-content: start; }
.es-group .gs-kind { width: 100%; padding: 0; }
.es-alt { margin-top: 14px; font-size: var(--fs-body); color: var(--muted); display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.co-drawer { position: fixed; top: var(--stick-top); right: 0; bottom: 0; width: min(760px, 100vw); background: var(--bg); border-left: 1px solid var(--line-2); box-shadow: -10px 0 28px rgba(0,0,0,.16); z-index: 35; display: flex; flex-direction: column; }
.cd-head { display: flex; align-items: center; gap: 10px; padding: 8px 12px; border-bottom: 1px solid var(--line); background: var(--surface); }
.cd-head .spacer { flex: 1 1 auto; }
.co-drawer iframe { flex: 1 1 auto; width: 100%; border: 0; background: var(--bg); }
@media (max-width: 900px) { .name-prompt input { width: 100%; } .kpibar { position: static; } }
@media (prefers-reduced-motion: reduce) { .kpibar .fig.changed { animation: none; } }

/* the hidden attribute always wins over component display rules */
[hidden] { display: none !important; }
.rsec { min-width: 0; }
.adj-add { flex-wrap: wrap; }
.adj-add input { flex: 1 1 90px; min-width: 0; width: auto; }

/* ── Builder, design-review pass (2026-10-18) ── */
/* S-2: a check row of state "info" must not pick up the global .info callout: every row has one structure */
.check.info { border-left: 0; background: none; border-radius: 0; padding: 10px 0; font-size: inherit; }
.ck-fix a { font-weight: 500; }
/* S-4: past the rules, the KPI strip folds into one 44px row beside the tabs; below 1100px only the tabs remain */
#kpi-sentinel { height: 1px; margin-top: 13px; }
.kpibar { margin-top: 0; }
.kpibar.is-compact { display: flex; align-items: center; gap: 16px; padding: 0; border-bottom: 1px solid var(--line); box-shadow: 0 6px 12px -10px rgba(0, 0, 0, .25); }
.kpibar.is-compact .rtabs { order: 0; margin-top: 0; border-bottom: 0; flex: 0 0 auto; }
.kpibar.is-compact .figs { order: 1; display: flex; flex: 1 1 auto; justify-content: flex-end; gap: 18px; border: 0; background: none; overflow: hidden; min-width: 0; }
.kpibar.is-compact .fig { background: none; padding: 0; display: flex; align-items: baseline; gap: 6px; white-space: nowrap; }
.kpibar.is-compact .fig .k { font-size: var(--fs-label); }
.kpibar.is-compact .fig .v { font-size: var(--fs-emph); margin: 0; }
.kpibar.is-compact .fig .v .delta, .kpibar.is-compact .fig .s { display: none; }
.kpibar.is-compact .fig:nth-child(3), .kpibar.is-compact .fig:nth-child(4), .kpibar.is-compact .fig:nth-child(5) { display: none; }
.kpibar.is-compact .fig .tag { font-size: var(--fs-label) !important; padding: 0 5px !important; }
@media (max-width: 1100px) { .kpibar.is-compact .figs { display: none; } .kpibar:not(.is-compact) { position: static; } }
/* BL-5: the Diversification figure is a link to Checks */
.fig.goto { cursor: pointer; }
.fig.goto:hover { background: var(--soft); }
.fig .linkish { color: var(--teal-ink); }
/* BL-3: the name reads as editable */
.th-name-wrap { display: inline-flex; align-items: center; gap: 4px; min-width: 0; max-width: 100%; }
.th-name-wrap .th-name { field-sizing: content; width: auto; min-width: 14ch; max-width: min(70ch, 100%); }
.th-name { border: 0; border-bottom: 1px dashed transparent; border-radius: 0; }
.th-name:hover { border-bottom-color: var(--line-2); }
.th-name:focus { border-bottom: 1px solid var(--accent-strong); background: transparent; }
.th-pen { color: var(--label); font-size: var(--fs-emph); pointer-events: none; }
.th-name-wrap:hover .th-pen { color: var(--teal-ink); }
/* BL-4: four rules columns that line up; headers on one line; "+ Add" actions left-aligned */
@media (min-width: 1241px) { .rules-board { grid-template-columns: minmax(300px, 1.3fr) repeat(3, minmax(0, 1fr)); } }
.rsec-h h2 { white-space: nowrap; }
.rsec-h .psub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.add-btn { justify-self: start; margin-top: 8px; }
.funnel .lbl span { white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.25; }
/* BL-7: Apply is a button */
.fcard .fc-apply { margin-top: 8px; pointer-events: none; }
button.fcard:hover .fc-apply { border-color: var(--teal); color: var(--teal-ink); }
/* BL-2 / S-5: the theme picker packs its groups in columns and scrolls with the page */
.es-list { display: block; columns: 5 220px; column-gap: 24px; max-height: none; overflow: visible; }
.es-group { break-inside: avoid; margin-bottom: 16px; }
.es-group .chip { margin: 0 4px 4px 0; height: auto; min-height: var(--ctl-h); padding-block: 4px; text-align: left; max-width: 100%; }
.es-group .chip:hover { background: var(--teal-soft); border-color: var(--teal); }
.es-group .chip.on { background: var(--teal-soft); color: var(--teal-ink); border-color: var(--teal); font-weight: 600; }
.es-group .chip.on::before { content: "✓"; margin-right: 2px; }
.es-chosen .chip { padding-right: 4px; }
.es-chosen .chip .x { background: none; border: 0; color: inherit; cursor: pointer; width: 20px; height: 20px; padding: 0; border-radius: 50%; }
.es-chosen .chip .x:hover { background: var(--bad-soft); color: var(--bad); }
/* S-10: chips that select get a teal hover, not the remove (red) one */
.chip:not(.on):hover { background: var(--teal-soft); }
/* BL-8: names on two lines instead of an ellipsis; Exclude visible, faint, on every row */
.nm2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.35; white-space: normal; }
#ctab td:first-child { min-width: 240px; max-width: 320px; white-space: normal; }
#ctab .rowact { opacity: .55; }
#ctab tr:hover .rowact, #ctab .rowact:focus { opacity: 1; }
/* BL-9: comparison grid columns of one width; five largest as a fixed list; the funds table on the card inset */
.space-grid { table-layout: fixed; }
.space-grid th:first-child, .space-grid td:first-child { width: 170px; }
.space-grid .nm2 { -webkit-line-clamp: 2; }
ol.top5 { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
ol.top5 li { display: flex; justify-content: space-between; gap: 8px; line-height: 1.5; }
ol.top5 li.nb { opacity: .5; }
.space-grid td, .space-grid th { white-space: normal; }
.space-grid .chip.sm { white-space: nowrap; }
.ovm-wrap { display: grid; gap: 16px; margin-top: 16px; justify-items: start; }
.comp-sub { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.comp-tbl { min-width: 900px; }
/* R-3: KPI strips never leave an orphan cell: the tiles wrap and the last row stretches */
.kpibar:not(.is-compact) .figs { display: flex; flex-wrap: wrap; }
.kpibar:not(.is-compact) .figs .fig { flex: 1 1 170px; min-width: 0; }
/* the rules board: headers may wrap; one column below 900px so no field is squeezed past its card */
.rsec-h { flex-wrap: wrap; row-gap: 2px; }
@media (max-width: 900px) { .rules-board { grid-template-columns: 1fr; } .rsec { padding-left: 0 !important; border-left: 0 !important; } .th-name-wrap .th-name { max-width: 100%; } }
.rules-board .fld, .rules-board .fld .ctl, .rules-board .unit { min-width: 0; max-width: 100%; }
/* the screen funnel: a short fixed track per step, so the step names keep the width */
.funnel .lbl { align-items: baseline; }
.funnel .ftrack { flex: 0 0 40px; height: 5px; background: var(--soft-2); border-radius: 2px; overflow: hidden; align-self: center; }
.funnel .ftrack i { display: block; height: 100%; background: var(--teal); }
.funnel .ftrack i.grey { background: var(--before); }
/* a field whose label wraps keeps its control level with its neighbour's */
.rules-board .fgrid { align-items: end; }
/* two figure bands: side by side when there is room, both full width when there is not (never one stranded) */
@media (max-width: 1300px) { .bands > .band:first-child:nth-last-child(2) { grid-column: auto; } }
@media (max-width: 900px) { .bands > .band:first-child:nth-last-child(2), .bands > .band:first-child:nth-last-child(2) ~ .band { grid-column: 1 / -1; } .bands:has(> .band:first-child:nth-last-child(2)) { grid-template-columns: 1fr; } }
.kpibar { margin-inline: 0; }
/* long theme names wrap inside a frontier card; on a narrow chart the zone label gives way to the thesis line */
button.fcard, button.fcard b { overflow-wrap: anywhere; }
.scatter.narrow text.zone { display: none; }
/* a wide mini table scrolls inside its card on a phone instead of pushing the page */
@media (max-width: 520px) { .card > table.mini, .card table.mini.wide { display: block; overflow-x: auto; } }
/* ── custom themes (demo): the form, the clause box, the note ── */
.add-row { gap: 8px; margin-top: 8px; }
.custom-form { margin-top: 10px; padding: 12px var(--card-pad); border: 1px dashed var(--teal); border-radius: var(--r); background: var(--surface); display: grid; gap: 10px; }
.cf-tabs { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cf-pane { display: grid; gap: 10px; }
.cf-row { display: grid; grid-template-columns: minmax(120px, 1fr) minmax(0, 2.4fr); gap: 10px; align-items: end; }
.cf-desc { height: auto; min-height: var(--ctl-h); padding: 6px 9px; resize: vertical; font: var(--fs-body)/1.4 var(--sans); }
.cf-ex { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; }
.cf-ex .chip.sm { cursor: pointer; }
.cf-run { display: flex; align-items: center; gap: 10px; }
.cf-bar { flex: 0 0 160px; height: 6px; background: var(--soft-2); border-radius: 3px; overflow: hidden; }
.cf-bar i { display: block; height: 100%; width: 0; background: var(--teal); transition: width .4s; }
.cf-out { display: grid; gap: 6px; }
.cf-sum { font-size: var(--fs-body); }
.cf-top td.l { white-space: normal; }
.cf-top th:last-child, .cf-top td:last-child { text-align: left; }
.cf-act { gap: 8px; }
.cdef { margin-top: 10px; padding: 8px 10px; border-radius: var(--r); background: var(--surface); border: 1px solid var(--line); display: grid; gap: 6px; }
.cdef-h { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.cdef-def { font-size: var(--fs-meta); color: var(--ink-2); line-height: 1.45; }
.tag.custom { background: var(--teal); color: #fff; }
.custom-note { margin-bottom: 12px; }
.es-custom { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); display: grid; gap: 6px; }
@media (max-width: 700px) { .cf-row { grid-template-columns: 1fr; } }
/* custom themes: the estimate flag, provenance, the library, the request form */
.tag.est { background: var(--warn-soft); color: var(--warn); }
.cdef-prov { font-size: var(--fs-meta); color: var(--muted); line-height: 1.45; }
.req-link { font-size: var(--fs-meta); font-weight: 600; }
.cdef-cap { margin-top: 6px; }
.custom-note { display: grid; gap: 4px; }
.cn-prov { font-size: var(--fs-meta); color: var(--ink-2); }
.cn-act { font-size: var(--fs-meta); }
.cf-lib { display: grid; gap: 6px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.cf-lib-row { display: flex; flex-wrap: wrap; gap: 6px; }
.cf-lib-item { display: inline-flex; align-items: center; gap: 2px; }
.cf-lib-item .chip { height: auto; min-height: var(--ctl-h); padding: 4px 12px; gap: 8px; }
.cf-lib-item .x { background: none; border: 0; color: var(--label); cursor: pointer; min-width: 24px; height: 24px; border-radius: var(--r); font-size: var(--fs-meta); }
.cf-lib-item .x:hover, .cf-lib-item .x.armed { color: var(--bad); background: var(--bad-soft); }
.modal-scrim { position: fixed; inset: 0; background: rgba(15, 26, 44, .35); z-index: 60; }
.modal { position: fixed; z-index: 61; top: 50%; left: 50%; transform: translate(-50%, -50%); width: min(620px, calc(100vw - 32px)); max-height: calc(100vh - 48px); overflow: auto; display: grid; gap: 12px; box-shadow: 0 20px 60px rgba(0, 0, 0, .25); }
.modal-h { display: flex; justify-content: space-between; align-items: center; }
.modal-h h2 { font-size: var(--fs-title); text-transform: none; letter-spacing: 0; color: var(--ink); }
.modal-h .x { background: none; border: 0; font-size: var(--fs-icon); color: var(--muted); cursor: pointer; width: var(--ctl-h); height: var(--ctl-h); border-radius: var(--r); }
.modal-h .x:hover { background: var(--soft); }
.req-form { display: grid; gap: 10px; }
.req-form textarea.ctl { height: auto; padding: 6px 9px; font: var(--fs-body)/1.45 var(--sans); resize: vertical; }
.req-two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.req-done { display: grid; gap: 10px; font-size: var(--fs-body); }
@media (max-width: 600px) { .req-two { grid-template-columns: 1fr; } }
/* ── custom themes: two-step AI form ── */
.cf-def { display: grid; gap: 10px; }
.cf-def .cf-desc { min-height: calc(5 * 1.4em + 12px); }
.cf-known { display: grid; gap: 6px; }
.cf-known-row { display: flex; flex-wrap: wrap; gap: 4px; }
.cf-more summary { cursor: pointer; }
.cf-more > div { margin-top: 4px; }
.cf-flagged { display: grid; gap: 6px; margin-top: 6px; }
.cf-flagged td:first-child { width: 24px; }
/* AI-estimate bands */
.band { display: inline-block; padding: 1px 7px; border-radius: 9px; font-size: var(--fs-label); font-weight: 600; letter-spacing: .02em; white-space: nowrap; border: 1px solid var(--line); color: var(--ink-2); background: var(--surface); }
.band-core { background: var(--teal); border-color: var(--teal); color: #fff; }
.band-significant { border-color: var(--teal); color: var(--teal); }
.band-minor { color: var(--muted); }
.fld label .psub { text-transform: none; letter-spacing: 0; font-weight: 400; }

/* ── the Builder's rules board, quieter: sentence-case headers with a count pill, short labels, one control style ── */
.card.rules { padding: 20px 24px; }
.rules .rsec { border-left-color: var(--soft-2); }
.rules .rsec-h { align-items: center; margin-bottom: 12px; }
.rules .rsec-h h2 { font-size: var(--fs-emph); font-weight: 600; text-transform: none; letter-spacing: -.005em; color: var(--ink); }
.rules .rsec-h .psub { background: var(--teal-soft); color: var(--teal-ink); border-radius: 999px; padding: 2px 9px; font-size: var(--fs-meta); font-weight: 600; font-variant-numeric: tabular-nums; }
.rules .rsec-h .psub:empty { display: none; }
.rules .rsec-sub { margin-top: 18px; }
.rules .fld { gap: 5px; }
.rules .fld label { text-transform: none; letter-spacing: 0; font-size: var(--fs-meta); font-weight: 500; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rules .ctl { height: 34px; border-color: var(--line); border-radius: 6px; transition: border-color .12s; }
.rules .ctl:hover { border-color: var(--line-2); }
.rules .fgrid { gap: 12px 12px; }
.rules .clause { background: var(--surface); border: 1px solid var(--line); border-left: 3px solid var(--teal); border-radius: 8px; padding: 12px 14px; }
.rules .clause.ex { border-left-color: var(--bad); padding: 10px 12px; }
.rules .clause .cl-head.solo { display: none; }
.rules .clause .cl-head .label { text-transform: none; letter-spacing: 0; font-size: var(--fs-meta); }
.rules .cl-grid { grid-template-columns: 96px minmax(0, 1fr); margin-top: 10px; }
.rules .fld .themes { display: grid; gap: 6px; }
.rules .fld .themes .trow .x, .rules .clause .x { color: var(--label); font-size: var(--fs-title); }
.rules .btn.sm { height: 28px; padding: 0 10px; border: 1px dashed var(--line-2); background: transparent; color: var(--ink-2); font-weight: 600; }
.rules .btn.sm:hover { border-style: solid; border-color: var(--teal); color: var(--teal-ink); }
.rules .add-row { margin-top: 10px; }
.rules .add-btn { margin-top: 0; }
.rules details.adv { border-top: 0; margin-top: 10px; padding-top: 0; }
.rules details.adv > summary { font-size: var(--fs-meta); color: var(--muted); font-weight: 500; }
.rules details.adv > summary .chip.sm { font-size: var(--fs-label); }
.rules-cap { font-size: var(--fs-meta); color: var(--muted); font-weight: 500; margin: 16px 0 6px; }
.rules .funnel { grid-template-columns: minmax(0, 1fr) 40px 40px; gap: 7px 10px; font-size: var(--fs-body); margin-top: 0; }
.rules .funnel .ftrack { flex: 0 0 52px; height: 6px; border-radius: 3px; }
.rules .funnel .n, .rules .funnel .r { font-family: var(--sans); font-size: var(--fs-body); font-variant-numeric: tabular-nums; }
.rules .funnel .r { color: var(--ink); font-weight: 600; }
.rules-facts { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--soft-2); }
.rules-facts > div { display: grid; gap: 1px; min-width: 0; }
.rules-facts span { font-size: var(--fs-label); color: var(--muted); }
.rules-facts b { font-size: var(--fs-emph); font-weight: 600; font-variant-numeric: tabular-nums; }
.rules-facts:empty { display: none; }
.rules .adj-fold { margin-top: 14px; }
.rules .adj-add .ctl { height: 28px; }