/**
 * kol-type-mono-classes.css — Mono typography CLASSES (class-only).
 *
 * Split out of kol-typography-mono.css so a consumer can adopt the mono type
 * SCALE (.kol-mono-N / .kol-helper-N) WITHOUT inheriting the JetBrains Mono
 * @font-face / :root token / @theme contract. Each consumer's own
 * --kol-font-family-mono supplies the actual font — fonts are per-app:
 * apps/brand = JetBrains Mono, apps/web = RightGroteskMono.
 *
 * Classes reference --kol-font-family-mono + literal px values only; nothing
 * else from the canonical typography files.
 *
 * Architecture: docs/kol-migration/locked/typography-system.md
 */

/* =============================================================================
 * BASE SCALE — multi-line mono body / values. Weight 400 (regular), with leading.
 * ============================================================================= */

.kol-mono-8 {
  font-family: var(--kol-font-family-mono);
  font-size: 8px;
  line-height: 12px;
  font-weight: 400;
}

.kol-mono-10 {
  font-family: var(--kol-font-family-mono);
  font-size: 10px;
  line-height: 14px;
  font-weight: 400;
}

.kol-mono-12 {
  font-family: var(--kol-font-family-mono);
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
}

.kol-mono-14 {
  font-family: var(--kol-font-family-mono);
  font-size: 14px;
  line-height: 18px;
  font-weight: 400;
}

.kol-mono-16 {
  font-family: var(--kol-font-family-mono);
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
}

.kol-mono-20 {
  font-family: var(--kol-font-family-mono);
  font-size: 20px;
  line-height: 26px;
  font-weight: 400;
}

/* =============================================================================
 * MONO HEADING ROLES — the app tier's masthead voice (PageHeaderMonoTitle,
 * kol-fxr 2026-08-27; user ruling: kol-monitor's deployed masthead — JetBrains
 * Mono 32 / 500 — is the look for the app tier). Three rungs mirroring the
 * sans roles PageHeader's sizes ride: heading-03 (32), display-03, display-02,
 * mono at weight 500. `PageHeader voice="mono"` wears them.
 * ============================================================================= */

.kol-mono-heading-03 {
  font-family: var(--kol-font-family-mono);
  font-size: var(--kol-text-heading-03);
  line-height: 110%;
  font-weight: 500;
}

.kol-mono-display-03 {
  font-family: var(--kol-font-family-mono);
  font-size: var(--kol-text-display-03);
  line-height: 100%;
  font-weight: 500;
}

.kol-mono-display-02 {
  font-family: var(--kol-font-family-mono);
  font-size: var(--kol-text-display-02);
  line-height: 100%;
  font-weight: 500;
}

/* =============================================================================
 * LABEL SCALE — single-line labels. Weight 500 (medium), no leading,
 * letter-spaced. For label/value pairs at the same size where the label needs
 * visual prominence (heavier weight) without size-jumping. Wider letter-spacing
 * on the smallest two stops for sub-12px readability.
 * ============================================================================= */

.kol-helper-8 {
  font-family: var(--kol-font-family-mono);
  font-size: 8px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.10em;
}

.kol-helper-10 {
  font-family: var(--kol-font-family-mono);
  font-size: 10px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.10em;
}

.kol-helper-12 {
  font-family: var(--kol-font-family-mono);
  font-size: 12px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.kol-helper-14 {
  font-family: var(--kol-font-family-mono);
  font-size: 14px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.kol-helper-16 {
  font-family: var(--kol-font-family-mono);
  font-size: 16px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.06em;
}

.kol-helper-20 {
  font-family: var(--kol-font-family-mono);
  font-size: 20px;
  line-height: 1;
  font-weight: 500;
  letter-spacing: 0.06em;
}