/* ============================================================
   Bullet v8 — design tokens (from the mobile-app design system).
   Source of truth for v8 web styling. Loaded before v8.css on every
   restyled screen. Splash (00) + Welcome (01) are off-limits and do
   not load this. Meet Mariana/Richie load this for fonts only.
   ============================================================ */
:root {
  /* Surfaces */
  --bg-app: #FFFFFF;            /* app background (white — pink removed) */
  --bg-white: #FFFFFF;
  --bg-subtle: #F5F5F5;
  --bg-subtle-lighter: #F9F9F9;

  /* Text */
  --text-primary: #2C2C2C;
  --text-secondary: #757575;
  --text-tertiary: #9A9A9A;
  --text-important: #FE3D16;
  --text-on-dark: #FFFFFF;

  /* Ink (CTA fill) */
  --ink: #1F1F23;

  /* Borders */
  --border-primary: #ECECEC;
  --border-subtle: #ABACAE;

  /* Accents — two oranges by design, different roles */
  --orange-calm: #F2994A;       /* icons, calm states */
  --orange-energy: #FF9F00;     /* streak, hero moments, energy */
  --accent-pink: #E94560;

  /* Status */
  --success-fg: #16A34A;  --success-bg: #DCFCE7;
  --pending-fg: #A16207;  --pending-bg: #FEF3C7;  --pending-border: #FCD34D;
  --rose-fg: #9F1239;     --rose-bg: #FFF1F2;     --rose-border: #FECDD3;
  --flame: #E04E2A;

  /* Type scale (px on web) */
  --fs-caption2: 11px;    --lh-caption2: 13px;
  --fs-caption1: 12px;    --lh-caption1: 16px;
  --fs-footnote: 13px;    --lh-footnote: 18px;
  --fs-subhead: 15px;     --lh-subhead: 20px;
  --fs-callout: 16px;     --lh-callout: 21px;
  --fs-body: 17px;        --lh-body: 22px;
  --fs-title3: 20px;      --lh-title3: 25px;
  --fs-title2: 22px;      --lh-title2: 28px;
  --fs-title1: 32px;      --lh-title1: 38px;
  --fs-large-title: 34px; --lh-large-title: 41px;

  /* Weights */
  --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-heavy: 800;

  /* Spacing */
  --space-xxs: 2px;  --space-xs: 4px;  --space-xs-plus: 6px;  --space-sm: 8px;
  --space-sm-plus: 10px; --space-md: 12px; --space-md-plus: 14px; --space-base: 16px;
  --space-base-plus: 18px; --space-lg: 20px; --space-lg-plus: 22px; --space-xl: 24px;
  --space-xxl: 32px; --space-xxxl: 48px;

  /* Radius */
  --radius-xs: 4px;  --radius-sm: 8px;  --radius-md: 12px;  --radius-sm-plus: 14px;
  --radius-lg: 16px; --radius-card: 18px; --radius-xl: 20px;  --radius-hero: 22px;
  --radius-pill: 9999px;

  /* Shadows — flat by default; only on floating affordances */
  --shadow-card: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-floating-pill: 0 6px 16px rgba(0,0,0,0.06);
  --shadow-cta: 0 4px 12px rgba(0,0,0,0.18);

  /* Motion */
  --motion-fast: 150ms; --motion-normal: 220ms; --motion-slow: 320ms;

  /* Font family — intentionally system stack (brand font deferred) */
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}