/* ============================================================
   Tocker — Typography tokens
   System-first stack (per brand charter): no bundled webfonts,
   maximum legibility & accessibility. Tabular mono for time/numerals.
   ============================================================ */

:root {
  /* ---- Families ---- */
  --font-sans:
    ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

  /* Tabular numerals for clocks, durations, timeline times */
  --font-mono:
    ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas,
    "Liberation Mono", monospace;

  /* ---- Weights ---- */
  --weight-regular: 400;
  --weight-medium:  500;
  --weight-semibold:600;  /* "650" charter intent → 600 in CSS */
  --weight-bold:    700;

  /* ---- Type scale (px) ---- */
  --text-hero:    52px; /* 40–56 hero title */
  --text-display: 40px; /* page title */
  --text-h1:      32px;
  --text-h2:      26px; /* section title 24–28 */
  --text-h3:      21px; /* card title 18–22 */
  --text-lg:      18px;
  --text-body:    16px; /* never below 16 in product UI */
  --text-sm:      14px;
  --text-caption: 13px;

  /* ---- Line heights ---- */
  --leading-tight:  1.15; /* large display */
  --leading-snug:   1.3;  /* headings */
  --leading-normal: 1.5;  /* body 1.45–1.6 */
  --leading-relaxed:1.6;

  /* ---- Letter spacing ---- */
  --tracking-tight:  -0.02em; /* large headings */
  --tracking-normal: 0;
  --tracking-wide:   0.04em;  /* small labels / eyebrows */
}