:root {

  --color-primary: #3B82F6;
  --color-primary-hover: #2563EB;
  --color-accent: #8B5CF6;

  --color-warm: #D97706;
  --color-warm-soft: #FEF3C7;
  --color-warm-ink: #78350F;

  --color-success: #10B981;
  --color-warn: #F59E0B;
  --color-danger: #EF4444;

  --gradient-brand: linear-gradient(135deg, #3B82F6 0%, #8B5CF6 100%);

  --bg-base: #FBFCFD;
  --bg-elevated: #FFFFFF;
  --bg-sunken: #F3F5F8;
  --text-primary: #0F172A;
  --text-secondary: #475569;
  --text-muted: #64748B;
  --border: #E5E7EB;
  --border-strong: #CBD5E1;

  --radius-sm: 8px;
  --radius-md: 18px;
  --radius-card: 28px;
  --radius-lg: 36px;
  --radius-xl: 48px;
  --radius-pill: 999px;

  --mod-tasks:    #3B82F6;
  --mod-time:     #06B6D4;
  --mod-calendar: #8B5CF6;
  --mod-goals:    #10B981;
  --mod-money:    #F59E0B;
  --mod-notes:    #64748B;
  --mod-family:   #EC4899;
  --mod-balance:  var(--color-primary);

  --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.04), 0 4px 12px rgba(15, 23, 42, 0.04);
  --shadow-card-hover: 0 2px 4px rgba(15, 23, 42, 0.06), 0 12px 28px rgba(15, 23, 42, 0.08);
  --shadow-hero: 0 20px 35px -10px rgba(15, 23, 42, 0.10);
  --shadow-focus: 0 0 0 3px rgba(59, 130, 246, 0.35);

  --font-display: 'Manrope', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-sans: var(--font-body);

  --fs-display: clamp(2.4rem, 1.6rem + 3.2vw, 3.75rem);
  --fs-h2: clamp(1.75rem, 1.35rem + 1.6vw, 2.4rem);
  --fs-h3: clamp(1.15rem, 1.05rem + 0.4vw, 1.35rem);
  --fs-lead: clamp(1.05rem, 1rem + 0.3vw, 1.2rem);
  --fs-body: 1rem;
  --fs-small: 0.875rem;
  --fs-tiny: 0.75rem;

  --lh-tight: 1.1;
  --lh-heading: 1.2;
  --lh-body: 1.55;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;
  --space-32: 128px;

  --ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out-soft: cubic-bezier(0.65, 0, 0.35, 1);
  --transition-fast: 150ms var(--ease-out-soft);
  --transition: 200ms var(--ease-out-soft);
  --transition-slow: 320ms var(--ease-out-soft);

  --content-max: 1200px;
  --content-narrow: 780px;
  --header-height: 72px;
}

body.dark {
  --bg-base: #0F172A;
  --bg-elevated: #1E293B;
  --bg-sunken: #0B1220;
  --text-primary: #E2E8F0;
  --text-secondary: #CBD5E1;
  --text-muted: #94A3B8;
  --border: #334155;
  --border-strong: #475569;

  --color-warm-soft: rgba(217, 119, 6, 0.18);
  --color-warm-ink: #FDE68A;

  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.30), 0 4px 12px rgba(0, 0, 0, 0.25);
  --shadow-card-hover: 0 2px 4px rgba(0, 0, 0, 0.35), 0 12px 28px rgba(0, 0, 0, 0.40);
  --shadow-hero: 0 20px 35px -10px rgba(0, 0, 0, 0.50);
  --shadow-focus: 0 0 0 3px rgba(96, 165, 250, 0.45);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-fast: 0ms;
    --transition: 0ms;
    --transition-slow: 0ms;
  }
}