*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --color-primary: #2563eb;
  --color-primary-dark: #1d4ed8;
  --color-primary-soft: #dbeafe;
  --color-success: #10b981;
  --color-success-soft: #d1fae5;
  --color-danger: #ef4444;
  --color-danger-soft: #fee2e2;
  --color-warning: #f59e0b;
  --color-warning-soft: #fef3c7;
  --color-bg: #f8fafc;
  --color-surface: #fff;
  --color-border: #e2e8f0;
  --color-text: #0f172a;
  --color-text-soft: #64748b;
  --color-text-muted: #94a3b8;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

html, body {
  height: 100%;
  font-family: var(--font-sans);
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  line-height: 1.5;
}

input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; border: none; background: none; }
a { color: var(--color-primary); text-decoration: none; transition: color .15s; }
a:hover { color: var(--color-primary-dark); }