/* ============================================================
   Todoist — Typography Tokens
   Display/marketing = friendly geometric sans (Plus Jakarta Sans,
   a Google Fonts substitute — see readme CAVEATS).
   App/UI = the system stack Todoist's apps actually render in.
   ============================================================ */

/* Google Fonts @import removed for Team Hub: a third-party font fetch leaks
   visitor IPs to Google — the GDPR problem the neighbouring gclid-tracker exists
   to avoid. --font-display falls back to the system stack below; self-host Plus
   Jakarta Sans later if the display face is wanted. */

:root {
  /* ---- Families ---- */
  --font-display: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-ui: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --font-mono: 'SFMono-Regular', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* ---- Weights ---- */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  /* ---- Type scale (rem @ 16px base) ---- */
  --text-display-xl: 60px;  /* hero marketing */
  --text-display-lg: 46px;
  --text-display-md: 36px;
  --text-h1: 28px;
  --text-h2: 22px;
  --text-h3: 18px;
  --text-body-lg: 16px;
  --text-body: 15px;        /* default app body */
  --text-task: 14px;        /* task row text */
  --text-sm: 13px;          /* meta / labels */
  --text-xs: 12px;          /* timestamps / chips */
  --text-2xs: 11px;

  /* ---- Line heights ---- */
  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-normal: 1.5;
  --leading-relaxed: 1.65;

  /* ---- Letter spacing ---- */
  --tracking-tight: -0.02em;
  --tracking-snug: -0.01em;
  --tracking-normal: 0;
  --tracking-wide: 0.04em;

  /* ---- Semantic roles ---- */
  --type-hero-family: var(--font-display);
  --type-hero-weight: var(--weight-extrabold);
  --type-heading-family: var(--font-display);
  --type-heading-weight: var(--weight-bold);
  --type-body-family: var(--font-ui);
  --type-body-weight: var(--weight-regular);
  --type-ui-family: var(--font-ui);
}