/* ============================================================================
 * Brand — define the look ONCE; the same palette carries across every version.
 * Emerald & tangerine: vibrant emerald green (gut/wellness) + warm tangerine
 * accent, on a light mint page, with deep-green ink.
 * Typography: Poppins headings + Inter body.
 * ==========================================================================*/
:root {
  --primary:        #059669;   /* emerald */
  --primary-dark:   #047857;
  --primary-soft:   #d1fae5;   /* soft fill for pills / tabs */
  --accent:         #f97316;   /* tangerine */
  --accent-dark:    #c2410c;
  --accent-soft:    #ffedd5;   /* light orange fill — “you / personal” parts */
  --ink:            #064e3b;   /* deep emerald ink */
  --muted:          #5f6b62;
  --sand:           #fff7ed;   /* light orange page background (warm off-white) */
  --card:           #ffffff;
  --line:           #f0e3d4;   /* warm hairline borders */
  --good:           #059669;
  --warn:           #dc2626;   /* clear red for crisis/safety, distinct from tangerine */

  --radius:         14px;
  --radius-sm:      9px;
  --shadow:         0 1px 2px rgba(80,40,10,.05), 0 6px 20px rgba(80,40,10,.07);
  --font:           'Inter', system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-head:      'Poppins', 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --maxw:           780px;
}