:root {
  --font-display: "Sora", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-body: "DM Sans", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono: 'SFMono-Regular', Menlo, Monaco, Consolas, monospace;
  --font-sans: var(--font-body);

  --color-ink: #1d1d1f;
  --color-ink-secondary: #424245;
  --color-ink-tertiary: #86868b;
  --color-ink-muted: #aeaeb2;

  --color-surface: #ffffff;
  --color-surface-raised: #fbfbfd;
  --color-surface-sunken: #f5f5f7;

  --color-border: #d2d2d7;
  --color-border-subtle: #e8e8ed;
  --color-border-focus: #0071e3;

  --color-accent: #e8450e;
  --color-accent-hover: #d03d0b;
  --color-accent-subtle: #fef3ee;

  --color-error: #ff3b30;
  --color-error-bg: #fff5f5;
  --color-success: #34c759;
  --color-success-bg: #f0fdf4;
  --color-warning: #ff9500;
  --color-warning-bg: #fffbeb;

  --radius: 10px;
  --radius-sm: 6px;
  --radius-lg: 14px;
  --radius-full: 9999px;

  --shadow-sm: 0 2px 8px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 20px rgba(0,0,0,0.06);
  --shadow-input-focus: inset 0 0 0 2px var(--color-border-focus), 0 0 0 4px rgba(0,113,227,0.12);

  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;

  --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --duration: 200ms;
  --duration-slow: 400ms;
}
