/* Source of truth: theme/typography.ts. Sizes are dp in the app; 1dp = 1px here. */
:root{
  --font-sans:"DM Sans",system-ui,sans-serif;
  --font-serif-display:"Fraunces","DM Sans",serif;
  --font-weight-regular:400;
  --font-weight-medium:500;

  /* Fraunces — emotional headers only */
  --text-hero:34px;
  --text-screen-title:28px;
  --text-section-title:24px;

  /* DM Sans 400 — body and supporting copy */
  --text-body-lg:18px;
  --text-body:16px;
  --text-body-sm:14px;
  --text-caption:12px;
  --text-micro:11px;

  /* DM Sans 500 — labels, buttons, list titles */
  --text-button:16px;
  --text-list-title:16px;
  --text-label:14px;

  /* Whisper — DM Sans italic, the app's one lyrical voice */
  --text-whisper-home:22px;
  --line-whisper-home:34px;
  --text-whisper-history:18px;
  --line-whisper-history:28px;

  /* Widget (medium 4x3, design space 320x300dp) */
  --text-widget-whisper:15px;
  --text-widget-name:13px;
  --text-widget-status:11px;
  --text-widget-meta:10px;
  --text-widget-paused:15px;

  /* Widget (small 2x2) */
  --text-widget-sm-name:12px;
  --text-widget-sm-whisper:13px;
  --text-widget-sm-status:9px;
}
