:root {
  --color-bg: #F6F5F1;
  --color-surface: #FFFFFF;
  --color-surface-alt: #EFEEE8;
  --color-border: #E2E1D9;
  --color-border-strong: #CBC9BE;
  --color-ink: #14171A;
  --color-ink-muted: #6B716C;
  --color-ink-faint: #9AA09A;

  --color-primary: #FF5A36;
  --color-primary-ink: #FFFFFF;
  --color-primary-soft: #FFE4DA;

  --color-success: #2F9E58;
  --color-success-soft: #DEF2E4;
  --color-warning: #C97A16;
  --color-warning-soft: #FBEBD3;
  --color-danger: #D14343;
  --color-danger-soft: #FAE1E1;
  --color-info: #2E6E8E;
  --color-info-soft: #DDEBF1;

  --font-display: 'Instrument Sans', system-ui, sans-serif;
  --font-body: 'Public Sans', system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, Menlo, Consolas, monospace;

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

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 2px rgba(20, 23, 26, .06);
  --shadow-md: 0 4px 12px rgba(20, 23, 26, .08), 0 1px 2px rgba(20, 23, 26, .06);
  --shadow-lg: 0 16px 40px -12px rgba(20, 23, 26, .22);

  --header-height: 64px;
  --sidebar-width: 232px;
  --bottom-nav-height: 64px;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #14171A;
    --color-surface: #1B1F22;
    --color-surface-alt: #21262A;
    --color-border: #2C3236;
    --color-border-strong: #3B4247;
    --color-ink: #EEEFEA;
    --color-ink-muted: #A2A8A3;
    --color-ink-faint: #6E7570;

    --color-primary: #FF6C4A;
    --color-primary-ink: #17110E;
    --color-primary-soft: #3A2119;

    --color-success: #49B876;
    --color-success-soft: #16281D;
    --color-warning: #E0A248;
    --color-warning-soft: #2E2210;
    --color-danger: #E36767;
    --color-danger-soft: #2E1717;
    --color-info: #6FB4D6;
    --color-info-soft: #16262E;

    --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
    --shadow-md: 0 4px 14px rgba(0, 0, 0, .4);
    --shadow-lg: 0 20px 44px -14px rgba(0, 0, 0, .6);
  }
}