/* ═══════════════════════════════════════════════════════════════════════════
   BDC page family -- one column, one type scale (DESIGN 2026-11-07)
   Spec: docs/board/audit/2026-11-07_DESIGN_bdc_layout_type.md

   Linked LAST by templates/bdc-{index,detail,borrower,borrowers}.html, and
   every rule is scoped under the page class `.bdc-page` on their <body>. The
   shared sheets these pages also load (stock-page.css, bdc-detail-extras.css,
   bdc-index-extras.css) serve the 13F, bank, contractor, patent and industry
   pages too, and are not touched.

   The TYPE ROLES (--type-*, --rhythm-*, --measure-prose) are the ONE shared
   block in tokens.css :root (OWNER ruling 2026-11-07: 13F, BDC, LEARN and the
   chrome bar read the same names). This sheet only reads them; it declares no
   copy. Every role points at an existing rung: 12 / 14 / 16 / 18 / 24 / 32 / 52,
   nothing under 12, the prose measure 54ch.
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── 1. One content column ──────────────────────────────────────────────────
   Every top-level block is the 960 container with 20px gutters (content 920):
   the breadcrumb, the hero, the index's controls, cards, compare sections and
   footnote, and the detail / borrower content. The /bdcs/ compare sections sat
   at x=0, 1280 wide (measured 2026-11-07); detail H2s at 160 and 212. */
.bdc-page main,
.bdc-page .sp-main,
.bdc-page .sp-main.sp-main--doc {
  display: block;
  max-width: none;
  padding: 0;
  overflow-wrap: break-word;
}
.bdc-page .sp-breadcrumb,
.bdc-page .si-hero,
.bdc-page .bd-hero,
.bdc-page .si-controls,
.bdc-page .si-content,
.bdc-page .bd-content,
.bdc-page main > .bi-compare,
.bdc-page main > .ol-mcp-entry,
.bdc-page main > .si-footer-note {
  box-sizing: border-box;
  width: 100%;
  max-width: var(--page-max-width);
  margin-inline: auto;
  padding-inline: var(--space-5);
}
.bdc-page main > .ol-mcp-entry {
  max-width: calc(var(--page-max-width) - 2 * var(--space-5));
  padding-inline: var(--space-4);
}
/* Bands stay full-bleed grounds; their CONTENT sits on the column (the 13F
   rule: the breakout and this padding are both centred on the container). */
.bdc-page .bd-band {
  padding-inline: max(var(--space-5), calc(50vw - var(--page-max-width) / 2 + var(--space-5)));
  padding-block: var(--space-5);
  margin-block: calc(-1 * var(--space-5)) var(--space-5);
}
.bdc-page .bd-band:not(:has(*)) { display: none; }
.bdc-page .bd-content > .bd-band:last-child { margin-bottom: 0; }
.bdc-page .bd-funnel-inner { padding-inline: var(--space-5); }
.bdc-page .sp-breadcrumb {
  font-family: var(--font-ui);
  font-size: var(--type-small);
  padding-block: var(--space-2);
  border-bottom: 0;
  background: transparent;
  flex-wrap: wrap;
}
.bdc-page .sp-breadcrumb-current { font-weight: 400; }
.bdc-page .sp-breadcrumb a { display: inline-flex; align-items: center; min-height: var(--space-6); }

/* ── 2. Vertical rhythm: 40px between sections, bands included ───────────── */
.bdc-page .bd-section,
.bdc-page section.bd-qoq,
.bdc-page .bd-signup-wedge {
  margin: 0 0 var(--rhythm-section);
}
/* Blocks that are themselves the column keep their auto inline margins. */
.bdc-page main > .bi-compare,
.bdc-page .bd-funnel { margin-block: 0 var(--rhythm-section); }
.bdc-page main > .bi-compare:not(:has(h2)) { margin-block: 0; }
.bdc-page .bd-band > .bd-section:last-child,
.bdc-page .bd-band > section.bd-qoq:last-child,
.bdc-page .bd-band > :last-child { margin-bottom: 0; }
.bdc-page .si-content,
.bdc-page .bd-content { padding-bottom: var(--rhythm-section); }

/* ── 3. Headings ────────────────────────────────────────────────────────── */
.bdc-page .si-hero,
.bdc-page .bd-hero { padding-block: var(--space-10) var(--rhythm-section); }
.bdc-page .si-hero h1,
.bdc-page .bd-hero h1 {
  font-family: var(--font-brand);
  font-size: var(--type-title);
  font-weight: 500;
  line-height: 1.06;
  margin: 0 0 var(--space-4);
  /* BU-P3-1 (2026-11-08): a long borrower name (Centralsquare, 4 lines at
     375) breaks into even lines, never a lone last word. */
  text-wrap: balance;
}
/* The borrower H1's filing-entity half reads as part of the title, one step
   down -- never a third size. */
.bdc-page .bd-hero h1 .bd-h1-filing { font-size: var(--type-h2); font-weight: 400; color: var(--text-secondary); }
.bdc-page .si-hero-eyebrow,
.bdc-page .bd-hero-ticker {
  font-family: var(--font-data);
  font-size: var(--type-label);
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold-link);
  margin-bottom: var(--space-4);
}
.bdc-page .si-hero-rule,
.bdc-page .bd-hero-rule { margin: 0 0 var(--space-5); }
.bdc-page .si-hero-sub,
.bdc-page .bd-hero-sub {
  font-family: var(--font-brand);
  font-size: var(--type-lede);
  line-height: 1.55;
  color: var(--text-secondary);
  max-width: var(--measure-prose);
  margin: 0 0 var(--space-4);
}
.bdc-page .bd-hero-meta {
  font-family: var(--font-data);
  font-size: var(--type-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted-body);
  margin: 0 0 var(--space-3);
}
.bdc-page .si-hero-sub a,
.bdc-page .bd-hero-sub a { font-size: inherit; }
.bdc-page .bi-hero-learn { font-family: var(--font-ui); font-size: var(--type-small); margin: 0 0 var(--space-4); }

/* H2: one treatment on every BDC page. Was 20.8 regular (detail, borrower),
   20 bold (/bdcs/ compare), 24 bold (the change sections). */
.bdc-page .bd-section > h2,
.bdc-page section.bd-qoq > h2,
.bdc-page .bi-compare > h2 {
  font-family: var(--font-brand);
  font-size: var(--type-h2);
  font-weight: 400;
  line-height: 1.25;
  color: var(--text-primary);
  margin: 0 0 var(--rhythm-head);
  padding-bottom: var(--space-2);
  border-bottom: 1px solid var(--border-subtle);
}

/* H3: one treatment (was 12 bold, 16.32 bold, 16.8 medium and 18.72 bold). */
.bdc-page .bd-section > h3,
.bdc-page .bd-faq-item h3,
.bdc-page .bd-qoq-col h3,
.bdc-page .bd-funnel-item h3,
.bdc-page .bd-divergence h3 {
  font-family: var(--font-brand);
  font-size: var(--type-h3);
  font-weight: 600;
  line-height: 1.3;
  color: var(--text-primary);
  margin: var(--space-6) 0 var(--space-2);
  letter-spacing: 0;
  text-transform: none;
}
.bdc-page .bd-section > h3:first-child,
.bdc-page .bd-qoq-col h3,
.bdc-page .bd-funnel-item h3,
.bdc-page .bd-divergence h3,
.bdc-page .bd-faq-item h3 { margin-top: 0; }
/* The funnel band is theme-stable navy: its heading keeps the band's ink. */
.bdc-page .bd-funnel-item h3 { color: var(--cool-paper); }
.bdc-page .bd-qoq-n {
  font-family: var(--font-data);
  font-size: var(--type-small);
  font-weight: 400;
  color: var(--text-secondary);
  margin-left: var(--space-1);
}

/* ── 4. Body, small and notes ──────────────────────────────────────────── */
.bdc-page .bdc-detail-explainer,
.bdc-page .bd-faq-item p,
.bdc-page .bd-lenders-summary,
.bdc-page .bd-signup-lede {
  font-family: var(--font-brand);
  font-size: var(--type-body);
  line-height: 1.6;
  color: var(--text-secondary);
  max-width: var(--measure-prose);
}
.bdc-page .bd-lenders-summary { color: var(--text-primary); margin: 0 0 var(--rhythm-block); }
.bdc-page .bdc-detail-explainer { margin: 0 0 var(--rhythm-block); }
.bdc-page .bdc-detail-explainer strong { color: var(--text-primary); font-weight: 700; }
.bdc-page .bd-faq-item { padding: var(--space-5) 0; }
.bdc-page .bd-faq-item p { margin: 0; }
.bdc-page .bd-faq-item:first-of-type { padding-top: 0; }

.bdc-page .bd-section-note,
.bdc-page .bi-compare-note,
.bdc-page .bi-learn-lead,
.bdc-page .bd-section > .bd-quality-note,
.bdc-page section.bd-qoq > .bd-quality-note,
.bdc-page .bd-section-note--prov,
.bdc-page .si-footer-note,
.bdc-page .bd-div-note,
.bdc-page .bd-acq-desc,
.bdc-page .bd-peer-footer {
  font-family: var(--font-brand);
  font-size: var(--type-small);
  font-style: normal;
  line-height: 1.55;
  letter-spacing: 0;
  text-align: left;
  color: var(--text-secondary);
  max-width: var(--measure-prose);
  margin: 0 0 var(--rhythm-block);
}
.bdc-page .si-footer-note { padding: 0; }
.bdc-page main > .si-footer-note { padding-bottom: var(--rhythm-section); }
.bdc-page .bd-section-note strong,
.bdc-page .bi-compare-note strong { color: var(--text-primary); }
/* A note after a table keeps the block gap above it (between two notes the
   margins collapse to the same one gap). */
.bdc-page .bd-table-wrap ~ .bd-section-note,
.bdc-page .bi-compare-wrap ~ .bi-compare-note { margin-top: var(--rhythm-block); }

/* Lists of links (other borrowers, the learn pillar). */
.bdc-page .bd-related-list,
.bdc-page .bi-learn-list {
  font-family: var(--font-brand);
  font-size: var(--type-small);
  line-height: 1.5;
  margin: 0 0 var(--rhythm-block);
}
.bdc-page .bd-related-list a,
.bdc-page .bi-learn-list a,
.bdc-page .bi-learn-footer a { display: inline-flex; align-items: center; min-height: var(--space-6); }
.bdc-page .bi-learn-footer { font-family: var(--font-brand); font-size: var(--type-small); }
.bdc-page .bd-list li { font-size: var(--type-small); max-width: var(--measure-prose); }

/* ── 5. The as-of and provenance treatment ───────────────────────────────
   One device: a left hairline rule in the brand gold, no box, no italics,
   left aligned. As-of and provenance notes are Small; findings are Body. */
.bdc-page .bd-hero .bd-quality-note,
.bdc-page .bd-hero .bd-about-src,
.bdc-page .bd-asof-line,
.bdc-page .bd-callout {
  font-family: var(--font-brand);
  font-style: normal;
  letter-spacing: 0;
  text-align: left;
  max-width: var(--measure-prose);
  padding: 0 0 0 var(--space-3);
  border: 0;
  border-left: 1px solid var(--gold-link);
  border-radius: 0;
  background: transparent;
}
.bdc-page .bd-hero .bd-quality-note,
.bdc-page .bd-hero .bd-about-src,
.bdc-page .bd-asof-line {
  font-size: var(--type-small);
  line-height: 1.55;
  color: var(--text-secondary);
  margin: 0 0 var(--space-2);
}
.bdc-page .bd-hero .bd-ai-prose-note { font-size: inherit; font-style: normal; color: inherit; }
.bdc-page .bd-callout {
  font-size: var(--type-body);
  line-height: 1.6;
  color: var(--text-primary);
  margin: 0 0 var(--rhythm-block);
}
.bdc-page .bd-callout--neg { border-left-color: var(--text-negative); }
.bdc-page .bd-callout--asof { border-left-color: var(--border-strong); font-size: var(--type-small); }
.bdc-page .bd-stats + .bd-asof-line,
.bdc-page .bd-stats + .bd-quality-note { margin-top: var(--space-4); }

/* ── 6. Calls to action ─────────────────────────────────────────────────── */
.bdc-page .bd-cta-row { margin: var(--space-4) 0 0; }
.bdc-page .bd-cta,
.bdc-page .bd-cta-secondary {
  font-family: var(--font-ui);
  font-size: var(--type-small);
  font-weight: 500;
}

/* ── 7. Figures ─────────────────────────────────────────────────────────
   Every hero stat is a ledger tile: one value size (Figure, Geist Mono,
   tabular), a Small label, a Label note. The index's flex stats and the
   borrower page's flex stats become the detail page's ledger, so a page with
   6 tiles is 3 + 3, never 5 + 1 (the flex row's orphan). */
.bdc-page .si-hero .bi-stats,
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger) {
  --bdc-hero-cols: 3;
  display: grid;
  grid-template-columns: repeat(var(--bdc-hero-cols), minmax(0, 1fr));
  gap: 0;
  margin: var(--space-6) 0 0;
  border-top: 2px solid var(--text-primary);
  background: var(--bg-surface);
}
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger):has(> .bd-stat:nth-child(1):last-child) { --bdc-hero-cols: 1; }
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger):has(> .bd-stat:nth-child(2):last-child) { --bdc-hero-cols: 2; }
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger):has(> .bd-stat:nth-child(4):last-child) { --bdc-hero-cols: 4; }
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger):has(> .bd-stat:nth-child(5):last-child) { --bdc-hero-cols: 5; }
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger):has(> .bd-stat:nth-child(7):last-child),
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger):has(> .bd-stat:nth-child(8):last-child) { --bdc-hero-cols: 4; }
.bdc-page .bd-hero .bd-stats-ledger { margin-top: var(--space-6); }
.bdc-page .bi-stat,
.bdc-page .bd-hero .bd-stat {
  text-align: left;
  padding: var(--space-4);
  border-left: 1px solid var(--border-subtle);
}
.bdc-page .bi-stat:first-child,
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger) > .bd-stat:nth-child(1) { border-left: 0; }
/* The ledger's hairline method (bdc-detail-extras .bd-stats-ledger): every
   tile draws its own top and left rule and is pulled back by the rule's width;
   the container clips the ones on its own edge, so no row or column count
   leaves a stray line. The width is a local DEFINITION, as there. */
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger) { overflow: hidden; --bdc-rule: 1px; }
.bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger) > .bd-stat {
  border-top: 1px solid var(--border-subtle);
  margin: calc(-1 * var(--bdc-rule)) 0 0 calc(-1 * var(--bdc-rule));
}
.bdc-page .bi-stat-value,
.bdc-page .bd-stat-value {
  font-family: var(--font-data);
  font-size: var(--type-figure);
  font-weight: 600;
  font-variant-numeric: var(--tabular-nums);
  line-height: 1.2;
}
.bdc-page .bi-stat-label,
.bdc-page .bd-stat-label {
  font-family: var(--font-brand);
  font-size: var(--type-small);
  line-height: 1.4;
  color: var(--text-secondary);
  margin-top: var(--space-1);
}
.bdc-page .bd-stat-note,
.bdc-page .bd-pctile,
.bdc-page .bd-hero .ol-prov { font-size: var(--type-label); }

/* ── 8. Tables: one density, one header, numbers in Geist Mono ──────────── */
.bdc-page .bd-table,
.bdc-page .bi-compare-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--font-brand);
  font-size: var(--type-small);
  line-height: 1.4;
}
.bdc-page .bd-table th,
.bdc-page .bi-compare-table th {
  font-family: var(--font-ui);
  font-size: var(--type-label);
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-secondary);
  background: var(--bg-elevated);
  border-bottom: 1px solid var(--border-default);
  padding: var(--space-2) var(--space-3);
  text-align: left;
  vertical-align: bottom;
}
.bdc-page .bd-table td,
.bdc-page .bi-compare-table td {
  padding: var(--space-2) var(--space-3);
  border-bottom: 1px solid var(--border-subtle);
  color: var(--text-primary);
  vertical-align: middle;
}
.bdc-page .bd-table .bd-num,
.bdc-page .bi-compare-table .bi-num,
.bdc-page .bd-qoq-fv,
.bdc-page .bd-mixbar-pct,
.bdc-page .bd-meta dd {
  font-family: var(--font-data);
  font-variant-numeric: var(--tabular-nums);
}
.bdc-page .bd-table .bd-num,
.bdc-page .bi-compare-table .bi-num { text-align: right; }
.bdc-page .bd-table td.bd-num,
.bdc-page .bi-compare-table td.bi-num { white-space: nowrap; }
.bdc-page .bd-table th.bd-num,
.bdc-page .bi-compare-table th.bi-num { font-family: var(--font-ui); text-align: right; }
/* A header wraps rather than widening its column (the trend's "Wtd-Avg spread
   as filed (bps)" was 220px on one line); an abbreviation says what it stands
   for, a unit takes its own line. */
.bdc-page .bd-table th,
.bdc-page .bi-compare-table th { white-space: normal; hyphens: manual; }
.bdc-page .bd-table th abbr,
.bdc-page .bi-compare-table th abbr { text-decoration: none; border-bottom: 1px dotted currentColor; cursor: help; }
.bdc-page .bi-th-unit,
.bdc-page .bi-cell-note,
.bdc-page .bi-compare-name {
  display: block;
  font-size: var(--type-label);
  font-weight: 400;
  color: var(--text-secondary);
  white-space: normal;
}
.bdc-page .bi-th-unit { text-transform: none; letter-spacing: 0; }
.bdc-page .bi-compare-name { font-family: var(--font-brand); }
.bdc-page .bi-cell-note { font-family: var(--font-data); }
/* A 24px tap target that keeps a link's own lines stacked: the holdings
   company link carries the brand and the filing name as two block lines, and
   a row flex laid them side by side (measured: a 241px cell). */
.bdc-page .bd-table a,
.bdc-page .bi-compare-table a {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-height: var(--space-6);
  font-weight: 600;
}
/* A link inside a sentence in a cell (the Exited table's "Possibly the same
   company ... holds <a>"): inline, so the sentence's closing stop stays on its
   line. The flex box above left the "." alone on a line under the link
   (pdi-ta, 375, 2026-11-08). WCAG 2.5.8 exempts a link set in a sentence.
   (Written `a[href]` in a81db98ea to dodge a check_css_dead_override false
   positive; the checker is fixed, so the natural selector is back.) */
.bdc-page .bd-table .bd-related-hint a { display: inline; min-height: 0; }
/* The borrower page's pricing table (2026-11-08, 1280):
   - a figure's qualifier ("spread as filed, may include PIK", "n/m, not a
     price", "unpriced") is its own line under the figure, at most 20 characters
     wide, so one phrase no longer sets its column's width (the spread column
     was 297px and pushed the PIK chip under "SOFR");
   - the as-of and filed dates never break at a hyphen ("2026-06-" / "30"). */
.bdc-page .bd-table td.bd-num .bd-neg-tag {
  display: block;
  /* max-content, not fit-content: the tag keeps its own width (capped at
     20ch) when the table is tight, so it is two lines at most ("SPREAD AS
     FILED, / MAY INCLUDE PIK"). With fit-content the table squeezed it to
     its longest word, three lines in a 115px column (optimizely, 1280). */
  width: max-content;
  max-width: 20ch;
  margin: var(--space-1) 0 0 auto;
  white-space: normal;
  text-align: right;
  line-height: 1.3;
}
.bdc-page .bd-table .bd-asof,
.bdc-page .bd-table .bd-filed { white-space: nowrap; }
/* The same grammar in the Rate cell: the benchmark, then its chips (PIK,
   non-USD) each on a line under it. The chip had sat beside "SOFR" on roomy
   tables and dropped under it on tight ones, row to row in one table
   (diligent, 1280); now every PIK row reads the same way. */
.bdc-page .bd-table td[data-col="rate"] .bd-chip { display: table; margin: var(--space-1) 0 0; }
.bdc-page .bd-table--snapshot td.bd-num { text-align: right; white-space: normal; }
.bdc-page .bd-table--snapshot td.bd-snapshot-band { font-size: var(--type-small); color: var(--text-secondary); }
.bdc-page .bi-compare-wrap { border-radius: 0; border-color: var(--border-subtle); }
/* /bdcs/ does not load the detail sheet, where the chip is defined, so the
   "below 80" / "non-accrual" chips on "Where lenders disagree" printed as
   bare words. The same chip, on this page family's own sheet. */
.bdc-page .bi-compare-table .bd-chip {
  display: inline-block;
  font-family: var(--font-data);
  font-size: var(--type-label);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: var(--space-0-5) var(--space-1-5);
  border: 1px solid var(--text-negative);
  border-radius: 2px;
  color: var(--text-negative);
  white-space: nowrap;
  margin-left: var(--space-1);
}
/* The compare table's first column: the ticker, the name under it, wrapping.
   Ten figures across one 920px column: its cells keep the block padding and
   take 8px a side instead of 12 (measured: 950px at 12, 840 at 8). */
.bdc-page #bdc-compare-table th,
.bdc-page #bdc-compare-table td { padding-inline: var(--space-2); }
.bdc-page #bdc-compare-table td:first-child { white-space: normal; min-width: 8rem; }
.bdc-page #bdc-compare-table .bi-cell-note { font-family: var(--font-brand); }
.bdc-page #bdc-compare-table td:first-child a { margin-right: var(--space-1); }
/* Holdings: the long text columns wrap inside a bounded measure, so the
   figures on the right stay on screen at 1280 (GSEC's holdings table was
   1,039 in 856; ARCC's 912 hid "% of net assets"). */
.bdc-page .bd-table td[data-col="company"],
.bdc-page .bd-table td[data-col="sector"] { white-space: normal; }
/* A coupon is one figure: "SOFR + 6.50%" never breaks at its "+" (2026-11-08:
   the wrap above split it on ARCC, PFLT and GECC at 1280). Only the clamped
   filing string (a <span title>, ssr_bdc._coupon_display) wraps. */
.bdc-page .bd-table td[data-col="coupon"] { white-space: nowrap; }
.bdc-page .bd-table td[data-col="coupon"] > span[title] { white-space: normal; }
.bdc-page .bd-table td[data-col="sector"],
.bdc-page .bd-table td[data-col="coupon"] { min-width: 6rem; }
.bdc-page .bd-table td[data-col="type"] .bd-chip { margin-block: var(--space-0-5); }
/* The trend table's quarter never breaks across two lines. */
.bdc-page .bd-table--trend td:first-child { white-space: nowrap; }
.bdc-page .bd-trend-stack { gap: var(--rhythm-block); }
.bdc-page .bd-trend-legend { font-size: var(--type-label); }
.bdc-page .bd-table-foot a { font-size: var(--type-small); }

/* Composition: the lien legend and the sector ledger. */
.bdc-page .bd-mixbar-item { font-family: var(--font-ui); font-size: var(--type-small); }
.bdc-page .bd-meta {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3) var(--space-6);
  margin: var(--space-4) 0 0;
  font-size: var(--type-small);
}
.bdc-page .bd-meta:has(> :nth-child(2):last-child),
.bdc-page .bd-meta:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bdc-page .bd-meta dt {
  font-family: var(--font-data);
  font-size: var(--type-label);
  font-weight: 400;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted-body);
}
.bdc-page .bd-meta dd { margin: var(--space-1) 0 0; color: var(--text-primary); }

/* ── 9. Change lists (.bd-qoq-grid): the column count follows the item count
   (the 13F rule), so no column sits alone on a row. */
.bdc-page .bd-qoq-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6) var(--space-8);
  margin-top: var(--rhythm-block);
}
.bdc-page .bd-qoq-grid:has(> .bd-qoq-col:only-child) { grid-template-columns: minmax(0, 1fr); }
.bdc-page .bd-qoq-grid:has(> .bd-qoq-col:nth-child(3):last-child),
.bdc-page .bd-qoq-grid:has(> .bd-qoq-col:nth-child(5):last-child),
.bdc-page .bd-qoq-grid:has(> .bd-qoq-col:nth-child(6):last-child) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bdc-page .bd-qoq-col li {
  overflow-wrap: anywhere;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-3);
  min-height: var(--space-8);
  padding: var(--space-1) 0;
  font-family: var(--font-brand);
  font-size: var(--type-small);
  line-height: 1.4;
  border-bottom: 1px solid var(--border-subtle);
}
.bdc-page .bd-qoq-col a { display: inline-flex; align-items: center; min-height: var(--space-6); font-weight: 600; }
.bdc-page .bd-qoq-fv { text-align: right; color: var(--text-secondary); }
.bdc-page .bd-qoq-sub { display: block; font-size: var(--type-label); color: var(--text-secondary); }

/* ── 10. Cards: kicker (Label) -> title (Body 600) -> body (Small) ──────── */
.bdc-page .si-ticker-grid,
.bdc-page .bd-lesson-grid,
.bdc-page .bd-peer-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
  align-items: stretch;
}
.bdc-page .bd-peer-grid:has(> :nth-child(4):last-child),
.bdc-page .bd-peer-grid:has(> :nth-child(7):last-child),
.bdc-page .bd-peer-grid:has(> :nth-child(8):last-child) { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bdc-page .bd-peer-grid:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* ds-ok-selector: no new name -- the existing BDC directory, lesson and peer
   cards (exempted at their definitions), restyled to one card hierarchy on
   the BDC pages only (the 13F sheet's rule, the same three families). */
.bdc-page .bi-card,
.bdc-page .bd-lesson-card,
.bdc-page .bd-peer-card {
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
  height: 100%;
  box-sizing: border-box;
  padding: var(--space-4);
  border-radius: 2px;
}
.bdc-page .bi-row { row-gap: var(--space-2); column-gap: var(--space-3); }
.bdc-page .bi-card-sym {
  font-family: var(--font-data);
  font-size: var(--type-small);
  font-weight: 600;
  letter-spacing: 0.04em;
  min-width: 0;
}
.bdc-page .bi-card-name,
.bdc-page .bd-lesson-title,
.bdc-page .bd-peer-name {
  font-family: var(--font-brand);
  font-size: var(--type-body);
  font-weight: 600;
  line-height: 1.3;
  color: var(--text-primary);
  white-space: normal;
  overflow: visible;
}
.bdc-page .bd-lesson-title { color: var(--gold-link); }
.bdc-page .bi-figs {
  font-family: var(--font-data);
  font-size: var(--type-small);
  font-variant-numeric: var(--tabular-nums);
  line-height: 1.5;
  color: var(--text-secondary);
}
.bdc-page .bd-lesson-desc {
  font-family: var(--font-brand);
  font-size: var(--type-small);
  font-style: normal;
  line-height: 1.5;
  color: var(--text-secondary);
}
.bdc-page .bd-lesson-kicker,
.bdc-page .bd-peer-holdings {
  font-family: var(--font-data);
  font-size: var(--type-label);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--text-muted-body);
}
.bdc-page .bd-peer-top { display: flex; flex-direction: column; align-items: flex-start; gap: var(--space-1); }
.bdc-page .bd-peer-ticker { font-family: var(--font-data); font-size: var(--type-small); }
.bdc-page .bd-peer-aum {
  font-family: var(--font-data);
  font-size: var(--type-small);
  font-variant-numeric: var(--tabular-nums);
  color: var(--gold-link);
}
.bdc-page .bd-peer-holdings { margin-top: auto; }

/* ── 11. The /bdcs/ controls ────────────────────────────────────────────── */
.bdc-page .si-controls { margin-bottom: var(--rhythm-section); gap: var(--space-3); }
.bdc-page .si-search { font-size: var(--type-body); }
.bdc-page .bi-alpha-btn { font-family: var(--font-data); font-size: var(--type-small); }
.bdc-page .si-empty { font-family: var(--font-brand); font-size: var(--type-body); text-align: left; padding: var(--space-6) 0; }

/* ── 12. Funnel, signup, assistant entry ────────────────────────────────── */
.bdc-page .bd-funnel-kicker { font-size: var(--type-label); margin-bottom: var(--space-5); }
.bdc-page .bd-funnel-item p { font-family: var(--font-brand); font-size: var(--type-small); line-height: 1.55; opacity: 1; }
.bdc-page .bd-funnel-note { font-size: var(--type-label); }
.bdc-page .bd-signup-wedge { padding: var(--space-6); border-radius: 2px; }
.bdc-page .bd-signup-lede { margin-inline: auto; color: var(--text-primary); }
.bdc-page .bd-signup-sub { font-size: var(--type-label); }
.bdc-page .ol-mcp-entry { font-family: var(--font-brand); font-size: var(--type-small); line-height: 1.55; margin-bottom: var(--rhythm-section); }

/* ── 13. Borrower page lists ────────────────────────────────────────────── */
.bdc-page .bd-news-headline,
.bdc-page .bd-acq-headline { font-family: var(--font-brand); font-size: var(--type-body); line-height: 1.45; }
.bdc-page .bd-news-headline a { display: inline; }
.bdc-page .bd-news-item,
.bdc-page .bd-acq-item { padding: var(--space-3) 0; }
.bdc-page .bd-empty { font-family: var(--font-brand); font-size: var(--type-small); text-align: left; padding: var(--space-5); }
.bdc-page .bd-div-line { font-family: var(--font-brand); font-size: var(--type-body); line-height: 1.55; }
.bdc-page .bd-divergence { border-radius: 0; }
.bdc-page .bd-filing-entity { font-size: var(--type-small); }

/* Prose with no class of its own (the mark-flags lede and list, the
   divergence band's lines) keeps the measure too. */
.bdc-page .bd-section > p,
.bdc-page .bd-flag-list li,
.bdc-page .bd-divergence p { max-width: var(--measure-prose); }
.bdc-page .bd-section > p:not([class]) { font-size: var(--type-body); line-height: 1.6; color: var(--text-secondary); margin: 0 0 var(--rhythm-block); }
.bdc-page .bd-flag-list li { font-size: var(--type-small); line-height: 1.55; margin-bottom: var(--space-2); }

/* Tap targets: every link and control a reader taps is at least 24px tall
   (WCAG 2.5.8); links set inline in a sentence are exempt by the standard
   and keep their line. */
.bdc-page .bi-hero-learn a,
.bdc-page .ol-mcp-entry-link,
.bdc-page .bd-peer-footer a,
.bdc-page .bd-acq-meta a,
.bdc-page .bd-news-meta a { display: inline-flex; align-items: center; min-height: var(--space-6); }
.bdc-page main summary { min-height: var(--space-6); }

/* The last block of a section owns no bottom margin: the section's own 40px
   is the only gap below it. Declared after every rule that sets one (the 13F
   CHAOS lesson: earlier in the sheet it lost on source order). */
.bdc-page .bd-section > :last-child,
.bdc-page .bd-section > ul:last-child,
.bdc-page section.bd-qoq > :last-child,
.bdc-page .bi-compare > :last-child { margin-bottom: 0; }

/* ── 14. Phones and tablets ───────────────────────────────────────────── */
@media (max-width: 719px) {
  .bdc-page .si-hero h1,
  .bdc-page .bd-hero h1 { font-size: var(--type-title-sm); }
  .bdc-page .bd-hero h1 .bd-h1-filing { font-size: var(--type-h3); }
  .bdc-page .si-hero,
  .bdc-page .bd-hero { padding-block: var(--space-6); }
  .bdc-page .si-ticker-grid,
  .bdc-page .bd-lesson-grid,
  .bdc-page .bd-peer-grid,
  .bdc-page .bd-peer-grid:has(> :nth-child(4):last-child),
  .bdc-page .bd-peer-grid:has(> :nth-child(2):last-child),
  .bdc-page .bd-qoq-grid,
  .bdc-page .bd-qoq-grid:has(> .bd-qoq-col:nth-child(3):last-child),
  .bdc-page .bd-qoq-grid:has(> .bd-qoq-col:nth-child(5):last-child),
  .bdc-page .bd-qoq-grid:has(> .bd-qoq-col:nth-child(6):last-child) { grid-template-columns: minmax(0, 1fr); }
  .bdc-page .bd-meta,
  .bdc-page .bd-meta:has(> :nth-child(2):last-child),
  .bdc-page .bd-meta:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  /* Hero ledgers: two up, an odd last tile spans the row. */
  /* Same specificity as the count rules above, and later, so it wins. */
  .bdc-page .si-hero .bi-stats,
  .bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger):has(> .bd-stat:nth-child(n+2):last-child) { --bdc-hero-cols: 2; }
  .bdc-page .si-hero .bi-stats > .bi-stat:nth-child(2n+1),
  .bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger) > .bd-stat:nth-child(2n+1) { border-left: 0; }
  .bdc-page .si-hero .bi-stats > .bi-stat:nth-child(n+3) { border-top: 1px solid var(--border-subtle); }
  .bdc-page .si-hero .bi-stats > .bi-stat:nth-child(2n+1):last-child,
  .bdc-page .bd-hero .bd-stats:not(.bd-stats-ledger) > .bd-stat:nth-child(2n+1):last-child { grid-column: 1 / -1; }
  .bdc-page .bd-table th,
  .bdc-page .bd-table td,
  .bdc-page .bi-compare-table th,
  .bdc-page .bi-compare-table td { padding: var(--space-2); }
  /* Wide tables scroll inside their named region, and the identifying column
     stays put: the BDC on the compare table (its name drops to the screen
     reader -- every BDC has a card above), the quarter on the trend. */
  .bdc-page #bdc-compare-table td:first-child,
  .bdc-page #bdc-compare-table th:first-child,
  .bdc-page .bd-table--trend th:first-child,
  .bdc-page .bd-table--trend td:first-child {
    position: sticky;
    left: 0;
    z-index: var(--z-base);
    background: var(--bg-base);
    background-image: linear-gradient(to left, var(--border-default) 1px, transparent 1px);
  }
  .bdc-page #bdc-compare-table th:first-child,
  .bdc-page .bd-table--trend th:first-child { background-color: var(--bg-elevated); }
  .bdc-page .bd-band .bd-table--trend td:first-child { background-color: var(--surface-alt); }
  .bdc-page #bdc-compare-table td:first-child { min-width: 0; }
  .bdc-page #bdc-compare-table .bi-compare-name {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .bdc-page #bdc-compare-table .bi-cell-note { max-width: 7rem; }
  /* "Where lenders disagree" as labelled cards: the borrower across the top,
     then seniority and gap, then the two marks, each under its own name. */
  .bdc-page .bi-cards { overflow-x: visible; border: 0; background: none; }
  .bdc-page .bi-cards .bi-compare-table,
  .bdc-page .bi-cards .bi-compare-table tbody { display: block; }
  .bdc-page .bi-cards .bi-compare-table colgroup,
  .bdc-page .bi-cards .bi-compare-table thead { display: none; }
  .bdc-page .bi-cards .bi-compare-table tr {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-2) var(--space-3);
    padding: var(--space-3) 0;
    border-bottom: 1px solid var(--border-subtle);
  }
  .bdc-page .bi-cards .bi-compare-table td { display: block; padding: 0; border: 0; text-align: left; white-space: normal; }
  .bdc-page .bi-cards td[data-label]::before {
    content: attr(data-label);
    display: block;
    font-family: var(--font-ui);
    font-size: var(--type-label);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--text-secondary);
  }
  .bdc-page .bi-cards td[data-col="name"] { grid-column: 1 / -1; grid-row: 1; }
  .bdc-page .bi-cards td[data-col="low"]  { grid-column: 1; grid-row: 2; }
  .bdc-page .bi-cards td[data-col="high"] { grid-column: 2; grid-row: 2; }
  .bdc-page .bi-cards td[data-col="lien"] { grid-column: 1; grid-row: 3; }
  .bdc-page .bi-cards td[data-col="gap"]  { grid-column: 2; grid-row: 3; }
  .bdc-page .bi-cards td[data-col="name"]::before { content: none; }
  .bdc-page .bi-cards td[data-col="name"] a { font-size: var(--type-body); }
  /* CHAOS 2026-11-07: one label treatment. The borrower page's cards (the
     shared sheet's .bd-cards) set their labels in Geist Mono 400 at 0.04em,
     while every table header and the index's cards use the header role. */
  .bdc-page .bd-cards td[data-label]::before {
    font-family: var(--font-ui);
    font-weight: 600;
    letter-spacing: 0.06em;
  }
  /* Exited and other positions on the borrower page: labelled cards too
     (the shared sheet's card rules apply under 640px; these place them). */
  .bdc-page .bd-cards--exited td[data-col="lender"]    { grid-column: 1; grid-row: 1; font-weight: 600; }
  .bdc-page .bd-cards--exited td[data-col="fairvalue"] { grid-column: 2; grid-row: 1; }
  .bdc-page .bd-cards--exited td[data-col="status"]    { grid-column: 1 / -1; grid-row: 2; }
  .bdc-page .bd-cards--exited td[data-col="positions"] { grid-column: 1; grid-row: 3; }
  .bdc-page .bd-cards--other td[data-col="lender"]     { grid-column: 1; grid-row: 1; font-weight: 600; }
  .bdc-page .bd-cards--other td[data-col="fairvalue"]  { grid-column: 2; grid-row: 1; }
  .bdc-page .bd-cards--other td[data-col="lien"]       { grid-column: 1; grid-row: 2; }
  .bdc-page .bd-cards--other td[data-col="asof"]       { grid-column: 2; grid-row: 2; }
}