/* ============================================================
   MIMIC — Typography tokens
   Two families only:
   • Rubik  — UI, headings, buttons, nav labels, numerals.
              Used at Medium (500) almost everywhere; Regular
              (400) for large display kanji & quiet numerals.
   • Inter  — running body: song lists, descriptions, romaji,
              English meanings & translations.
   Japanese (kanji / kana) inherits these stacks and falls
   through to the platform's native JP font.
   ============================================================ */
:root {
  /* ---- Families ---- */
  --font-ui: "Rubik", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-jp: "Rubik", "Hiragino Kaku Gothic ProN", "Hiragino Sans",
             "Yu Gothic", "Noto Sans JP", sans-serif;

  /* ---- Weights ---- */
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-bold: 700;   /* Inter bold for romaji / emphasis on cards */

  /* ---- Type scale (px) ---- */
  --text-display: 48px; /* splash / hero kanji */
  --text-h1: 36px;      /* flashcard prompt word */
  --text-h2: 27px;      /* nav kanji 語彙 / 歌詞 */
  --text-h3: 25px;      /* "Daily Flashcards", section titles */
  --text-lg: 21px;      /* button labels, large body */
  --text-md: 19px;      /* default body, list rows */
  --text-base: 17px;    /* song titles */
  --text-sm: 16px;      /* artists, secondary */
  --text-xs: 13px;      /* progress counts (3/10) */
  --text-2xs: 10px;     /* nav sub-labels (Vocabulary 34/456) */

  /* ---- Line heights ---- */
  --leading-tight: 100%;   /* headings, buttons (set lh:1) */
  --leading-snug: 1.3;
  --leading-body: 1.45;    /* lyrics, descriptions */
  --leading-list: 55.5px;  /* the airy song-list row rhythm */

  /* ---- Letter spacing ---- */
  --tracking-tight: -0.01em;
  --tracking-normal: 0;
  --tracking-list: 0.082em;/* the song-list spacing */
}