:root {
  color-scheme: light;

  --bg: #f6f7f9;
  --surface: #ffffff;
  --surface-2: #eef1f4;
  --surface-hover: #e6eaee;
  --border: #dfe3e8;
  --border-strong: #c7cdd5;
  --text: #16181b;
  --text-2: #59606a;
  --text-3: #7c838d;
  --on-accent: #ffffff;

  --accent: #1b7f53;
  --accent-strong: #146442;
  --accent-soft: #dff2e8;
  --danger: #c2352a;
  --danger-soft: #fce9e7;
  --warning: #9a6200;
  --warning-soft: #fbf0d9;

  --protein: #d23f5a;
  --carbs: #c98300;
  --fat: #3574cf;
  --calories: var(--accent);

  --chart-trend: var(--accent);
  --chart-dot: #9aa1ab;
  --chart-goal: #b77a12;
  --chart-grid: #e8ebef;

  --radius-sm: 8px;
  --radius: 12px;
  --radius-lg: 18px;
  --shadow: 0 1px 2px rgb(16 24 40 / 6%), 0 1px 3px rgb(16 24 40 / 8%);
  --shadow-lg: 0 12px 32px rgb(16 24 40 / 18%);

  --font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.375rem;
  --text-2xl: 1.75rem;
  --text-3xl: 2.25rem;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;

  --sidebar-width: 232px;
  --tabbar-height: 64px;
  --touch: 44px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0e1013;
    --surface: #171a1f;
    --surface-2: #1f232a;
    --surface-hover: #272c34;
    --border: #2a2f37;
    --border-strong: #3a414b;
    --text: #eceef1;
    --text-2: #a3aab4;
    --text-3: #7d848e;
    --on-accent: #07140d;
    --accent: #43c98c;
    --accent-strong: #6ad8a6;
    --accent-soft: #143324;
    --danger: #f07166;
    --danger-soft: #3a1c1a;
    --warning: #e8b04b;
    --warning-soft: #33280f;
    --protein: #f07088;
    --carbs: #f0b545;
    --fat: #6fa6f2;
    --chart-dot: #6d747e;
    --chart-goal: #e8b04b;
    --chart-grid: #232830;
    --shadow: 0 1px 2px rgb(0 0 0 / 40%);
    --shadow-lg: 0 16px 40px rgb(0 0 0 / 55%);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0e1013;
  --surface: #171a1f;
  --surface-2: #1f232a;
  --surface-hover: #272c34;
  --border: #2a2f37;
  --border-strong: #3a414b;
  --text: #eceef1;
  --text-2: #a3aab4;
  --text-3: #7d848e;
  --on-accent: #07140d;
  --accent: #43c98c;
  --accent-strong: #6ad8a6;
  --accent-soft: #143324;
  --danger: #f07166;
  --danger-soft: #3a1c1a;
  --warning: #e8b04b;
  --warning-soft: #33280f;
  --protein: #f07088;
  --carbs: #f0b545;
  --fat: #6fa6f2;
  --chart-dot: #6d747e;
  --chart-goal: #e8b04b;
  --chart-grid: #232830;
  --shadow: 0 1px 2px rgb(0 0 0 / 40%);
  --shadow-lg: 0 16px 40px rgb(0 0 0 / 55%);
}