/* ============================================================
   Scordle Games — Typography tokens
   Source: scordle-02-design-system.md §2.3
   Android = Roboto (Material 3), iOS = SF Pro (HIG).
   For web/prototyping we ship Roboto (the Android face) as the
   primary family and fall back to the system UI stack so iOS
   previews render in SF Pro automatically. Never hardcode sizes —
   reference a scale token.
   ============================================================ */

:root {
  /* --- Families --- */
  --font-sans: "Roboto", "Roboto Flex", -apple-system, BlinkMacSystemFont,
    "Segoe UI", system-ui, sans-serif;
  /* iOS/HIG preview face — system stack resolves to SF Pro on Apple devices */
  --font-system: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Roboto",
    system-ui, sans-serif;

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

  /* --- Type scale (§2.3) — px values mirror the sp/pt scale --- */
  --display-small: 36px;     /* Splash app name only */
  --headline-large: 32px;    /* Screen titles (rare) */
  --headline-medium: 28px;   /* Section headers; SCORE VALUES */
  --headline-small: 24px;    /* Card titles, club/competition names */
  --title-large: 22px;       /* Top app bar title */
  --title-medium: 16px;      /* List primary text, tab labels */
  --title-small: 14px;       /* Secondary list text, chip labels */
  --body-large: 16px;        /* Feed card body, descriptions */
  --body-medium: 14px;       /* Standard body, form labels */
  --body-small: 12px;        /* Captions, timestamps, metadata */
  --label-large: 14px;       /* Button text (all buttons) */
  --label-medium: 12px;      /* Badges, tags, small chips */
  --label-small: 11px;       /* Score superscripts, axis labels */

  /* --- Line heights (unitless ratios) --- */
  --line-tight: 1.15; /* @kind other */
  --line-snug: 1.3; /* @kind other */
  --line-normal: 1.5; /* @kind other */
}
