/* variables.css — CSS custom properties & design tokens */

:root {
  --bg:  #f9f6f1;
  --bg-warm:  #fbf9f4;
  --bg-card:  #fffef9;
  --bg-elevated:  #fefcf7;
  --bg-inset:  #f3ede4;
  --green-dark:  #4a6741;
  --green:  #7a9e6d;
  --green-light:  #a4c495;
  --green-pale:  #dcefd4;
  --green-bg:  rgba(122, 158, 109, 0.07);
  --green-border:  rgba(122, 158, 109, 0.22);
  --green-glow:  rgba(122, 158, 109, 0.10);
  --purple:  #9a7da8;
  --purple-light:  #c4a8d2;
  --purple-pale:  #eee3f4;
  --purple-bg:  rgba(154, 125, 168, 0.07);
  --purple-border:  rgba(154, 125, 168, 0.22);
  --gold:  #c4a265;
  --gold-light:  #dcc48e;
  --gold-pale:  #f7ecd3;
  --gold-bg:  rgba(196, 162, 101, 0.07);
  --gold-border:  rgba(196, 162, 101, 0.22);
  --cream:  #fefaf4;
  --sand:  #ede5d8;
  --sage:  #dde9d6;
  --linen:  #f6f1e9;
  --text:  #33402e;
  --text-secondary:  #5e6e55;
  --text-muted:  #8d9a82;
  --text-faint:  #bac6af;
  --text-warm:  #4d5e44;
  --border:  #eae4da;
  --border-light:  #f2ece4;
  --border-whisper:  rgba(80, 60, 30, 0.03);
  --danger:  #c45050;
  --danger-bg:  rgba(196, 80, 80, 0.06);
  --radius:  20px;
  --radius-sm:  16px;
  --radius-xs:  10px;
  --radius-full:  100px;
  --shadow-whisper:  0 1px 3px rgba(80, 60, 30, 0.03);
  --shadow-soft:  0 2px 6px rgba(80, 60, 30, 0.04), 0 1px 2px rgba(80, 60, 30, 0.02);
  --shadow-float:  0 4px 20px rgba(80, 60, 30, 0.05), 0 2px 6px rgba(80, 60, 30, 0.03);
  --shadow-dream:  0 8px 36px rgba(80, 60, 30, 0.06), 0 2px 10px rgba(80, 60, 30, 0.03);
  --shadow-glow:  0 4px 24px rgba(122, 158, 109, 0.12);
  --shadow-card:  0 2px 8px rgba(80, 60, 30, 0.04), 0 0 0 1px rgba(80, 60, 30, 0.02);
  --font:  'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-display:  'Playfair Display', Georgia, serif;
  --rose:  #d4868e;
  --rose-light:  #f2ccd0;
  --rose-bg:  rgba(212, 134, 142, 0.06);
  --nav-height:  76px;
  --safe-bottom:  env(safe-area-inset-bottom, 0px);
  --ease:  cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-out:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-bounce:  cubic-bezier(0.34, 1.4, 0.64, 1);
  --ease-gentle:  cubic-bezier(0.4, 0, 0.2, 1);
}