/* The Trading Vault — Typography
   Clean, modern, minimal. Manrope display + body; mono for data/code. */

:root {
  /* ---- Families ---- */
  --font-sans:    "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Manrope", system-ui, sans-serif; /* weight 800, tight tracking */
  --font-mono:    ui-monospace, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;

  /* ---- Weights ---- */
  --fw-light:    300; /* @kind font */
  --fw-regular:  400; /* @kind font */
  --fw-medium:   500; /* @kind font */
  --fw-semibold: 600; /* @kind font */
  --fw-bold:     700; /* @kind font */
  --fw-black:    800; /* @kind font */

  /* ---- Type scale (role-based) ---- */
  --fs-display:  clamp(34px, 6vw, 58px); /* @kind font */
  --fs-h1:       clamp(28px, 4vw, 40px); /* @kind font */
  --fs-h2:       22px; /* @kind font */
  --fs-h3:       18px; /* @kind font */
  --fs-body-lg:  18px; /* @kind font */
  --fs-body:     16px; /* @kind font */
  --fs-body-sm:  14px; /* @kind font */
  --fs-eyebrow:  11px; /* @kind font */
  --fs-label:    11px; /* @kind font */
  --fs-mono:     12.5px; /* @kind font */
  --fs-caption:  12px; /* @kind font */

  /* ---- Line heights ---- */
  --lh-tight:    1.04; /* @kind font */
  --lh-snug:     1.18; /* @kind font */
  --lh-normal:   1.5; /* @kind font */
  --lh-relaxed:  1.65; /* @kind font */

  /* ---- Tracking ---- */
  --tracking-display: -0.03em; /* @kind font */
  --tracking-tight:   -0.01em; /* @kind font */
  --tracking-normal:  0; /* @kind font */
  --tracking-label:   0.22em;  /* @kind font */
  --tracking-eyebrow: 0.34em;  /* @kind font */
  --tracking-btn:     0.12em;  /* @kind font */
}

/* ---- Role helpers (optional utilities) ---- */
.tv-display {
  font-family: var(--font-display);
  font-weight: var(--fw-black);
  font-size: var(--fs-display);
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-display);
  color: var(--text-heading);
}
.tv-h2 {
  font-family: var(--font-sans);
  font-weight: var(--fw-bold);
  font-size: var(--fs-h2);
  letter-spacing: var(--tracking-tight);
  color: var(--text-heading);
}
.tv-eyebrow {
  font-family: var(--font-sans);
  font-weight: var(--fw-semibold);
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--text-muted);
}
.tv-label {
  font-family: var(--font-sans);
  font-weight: var(--fw-bold);
  font-size: var(--fs-label);
  letter-spacing: var(--tracking-label);
  text-transform: uppercase;
  color: var(--text-heading);
}
.tv-body {
  font-family: var(--font-sans);
  font-weight: var(--fw-regular);
  font-size: var(--fs-body);
  line-height: var(--lh-relaxed);
  color: var(--text-body);
}
.tv-mono {
  font-family: var(--font-mono);
  font-weight: var(--fw-regular);
  font-size: var(--fs-mono);
  color: var(--text-body);
  font-variant-numeric: tabular-nums;
}