/* ============================================================
   FlowSpace — Typography tokens
   Typeface: Inter (variable, screen-optimised).
   Mono: JetBrains Mono (awaiting font upload — fallback renders).
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

:root {

  /* ── Font families ────────────────────────────── */
  --font-family-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-family-mono: 'JetBrains Mono', 'Fira Code', 'Cascadia Code', monospace;

  /* ── Font sizes — base 16px, scale ~1.25 ──────── */
  --font-size-2xs: 0.625rem;  /* 10px */
  --font-size-xs:  0.75rem;   /* 12px */
  --font-size-sm:  0.875rem;  /* 14px */
  --font-size-md:  1rem;      /* 16px — body base */
  --font-size-lg:  1.125rem;  /* 18px */
  --font-size-xl:  1.25rem;   /* 20px */
  --font-size-2xl: 1.5rem;    /* 24px */
  --font-size-3xl: 1.875rem;  /* 30px */
  --font-size-4xl: 2.25rem;   /* 36px */
  --font-size-5xl: 3rem;      /* 48px */
  --font-size-6xl: 3.5rem;    /* 56px */
  --font-size-7xl: 4.5rem;    /* 72px */

  /* ── Font weights ─────────────────────────────── */
  --font-weight-light:     300;  /* @kind font */
  --font-weight-regular:   400;  /* @kind font */
  --font-weight-medium:    500;  /* @kind font */
  --font-weight-semibold:  600;  /* @kind font */
  --font-weight-bold:      700;  /* @kind font */
  --font-weight-extrabold: 800;  /* @kind font */
  --font-weight-black:     900;  /* @kind font */

  /* ── Line heights ─────────────────────────────── */
  --line-height-none:    1;      /* @kind font */
  --line-height-tight:   1.2;    /* @kind font */
  --line-height-snug:    1.35;   /* @kind font */
  --line-height-normal:  1.5;    /* @kind font */
  --line-height-relaxed: 1.625;  /* @kind font */
  --line-height-loose:   2;      /* @kind font */

  /* ── Letter spacing ───────────────────────────── */
  --letter-spacing-tighter: -0.05em;   /* @kind font */
  --letter-spacing-tight:   -0.025em;  /* @kind font */
  --letter-spacing-normal:  0em;       /* @kind font */
  --letter-spacing-wide:    0.025em;   /* @kind font */
  --letter-spacing-wider:   0.05em;    /* @kind font */
  --letter-spacing-widest:  0.1em;     /* @kind font */

  /* ── Composite text styles (font shorthand) ───── */
  --text-display-2xl: var(--font-weight-bold) var(--font-size-7xl)/var(--line-height-tight) var(--font-family-sans);
  --text-display-xl:  var(--font-weight-bold) var(--font-size-6xl)/var(--line-height-tight) var(--font-family-sans);
  --text-display-lg:  var(--font-weight-bold) var(--font-size-5xl)/var(--line-height-snug) var(--font-family-sans);
  --text-heading-xl:  var(--font-weight-bold) var(--font-size-4xl)/var(--line-height-snug) var(--font-family-sans);
  --text-heading-lg:  var(--font-weight-semibold) var(--font-size-3xl)/var(--line-height-snug) var(--font-family-sans);
  --text-heading-md:  var(--font-weight-semibold) var(--font-size-2xl)/var(--line-height-snug) var(--font-family-sans);
  --text-heading-sm:  var(--font-weight-semibold) var(--font-size-xl)/var(--line-height-snug) var(--font-family-sans);
  --text-heading-xs:  var(--font-weight-semibold) var(--font-size-lg)/var(--line-height-snug) var(--font-family-sans);
  --text-body-lg:     var(--font-weight-regular) var(--font-size-lg)/var(--line-height-normal) var(--font-family-sans);
  --text-body-md:     var(--font-weight-regular) var(--font-size-md)/var(--line-height-normal) var(--font-family-sans);
  --text-body-sm:     var(--font-weight-regular) var(--font-size-sm)/var(--line-height-normal) var(--font-family-sans);
  --text-label-lg:    var(--font-weight-medium) var(--font-size-md)/var(--line-height-tight) var(--font-family-sans);
  --text-label-md:    var(--font-weight-medium) var(--font-size-sm)/var(--line-height-tight) var(--font-family-sans);
  --text-label-sm:    var(--font-weight-medium) var(--font-size-xs)/var(--line-height-tight) var(--font-family-sans);
  --text-caption:     var(--font-weight-regular) var(--font-size-xs)/var(--line-height-normal) var(--font-family-sans);
  --text-overline:    var(--font-weight-semibold) var(--font-size-xs)/var(--line-height-none) var(--font-family-sans);
}
