:root {
  --color-bg: #f5f5f7;
  --color-surface: #ffffff;
  --color-surface-2: #f0f0f3;
  --color-border: #e0e0e5;
  --color-text: #1a1a2e;
  --color-text-2: #6b6b80;
  --color-income: #34c759;
  --color-expense: #ff3b30;
  --color-transfer: #007aff;
  --color-accent: #007aff;
  --color-pending: #ff9500;

  --radius-s: 8px;
  --radius-m: 14px;
  --radius-l: 22px;
  --radius-xl: 32px;

  --shadow-card: 0 2px 12px rgba(0,0,0,.08);
  --shadow-sheet: 0 -4px 32px rgba(0,0,0,.12);

  --font: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', sans-serif;
  --max-w: 480px;
  --bottom-bar-h: 64px;

  /* Donut palette — 12 colors */
  --arc-0: #007aff;
  --arc-1: #34c759;
  --arc-2: #ff9500;
  --arc-3: #ff3b30;
  --arc-4: #af52de;
  --arc-5: #5ac8fa;
  --arc-6: #ffcc00;
  --arc-7: #ff6b35;
  --arc-8: #00c7be;
  --arc-9: #30b0c7;
  --arc-10: #e75480;
  --arc-11: #a2845e;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #1c1c1e;
    --color-surface: #2c2c2e;
    --color-surface-2: #3a3a3c;
    --color-border: #3a3a3c;
    --color-text: #f2f2f7;
    --color-text-2: #8e8e93;
  }
}