:root{
  /* brand + accents (from app) */
  --brand: #0f4d40;          /* headings, CTAs */
  --brand-700:#0a3d33;       /* hover */
  --progress:#10B981;        /* green progress bar */
  --rose-50:#FFF1F2;         /* blush surface */
  --mint-50:#ECFDF5;         /* mint surface */
  --sand-50:#FFF7ED;         /* warm surface */
  --lilac-50:#F3E8FF;        /* optional section alt */

  /* neutrals */
  --bg:#FFF9F7;              /* page background (warm white) */
  --surface:#FFFFFF;         /* cards/navbars */
  --surface-soft:#F8FAFC;    /* chips/soft fills */
  --text:#1F2937;            /* titles/body */
  --muted:#64748B;           /* secondary text */
  --border:#E5E7EB;          /* dividers/borders */
  --shadow:0 2px 12px rgba(16,24,40,.06);

  /* blog / content accents */
  --blog-heading:#1C1C1C;
  --blog-intro-muted:#7f8c8d;
  --blog-body-text:#444444;
  --blog-meta-text:#999999;
  --blog-accent-green:#045d56;
  --blog-accent-amber:#FFB703;
  --blog-cta-bg-start:#f8f9fa;
  --blog-cta-bg-end:#e9ecef;
  --blog-cta-button-start:#045d56;
  --blog-cta-button-end:#033c3a;

  /* treemap colors */
  --treemap-rent:#4E79A7;
  --treemap-groceries:#F28E2B;
  --treemap-dining:#E15759;
  --treemap-transport:#76B7B2;
  --treemap-utilities:#59A14F;
  --treemap-shopping:#EDC948;
  --treemap-health:#B07AA1;
  --treemap-subscriptions:#FF9DA7;
  
  /* layout */
  --nav-height: 62px;         /* navbar height */
}

body {
  font-family: 'Segoe UI', sans-serif;
  margin: 0;
  padding: 0;
  background-color: var(--bg);
  color: var(--text);
}

/* Global box-sizing */
* { 
  box-sizing: border-box; 
}