:root {
  --primary-light: #111827;
  --secondary-light: #374151;
  --accent-light: #2563eb;
  --action-light: #f59e0b;
  --bg-light: #f5f6f8;
  --surface-light: #ffffff;
  --card-light: #ffffff;
  --border-light: #e5e7eb;
  --shadow-light: rgba(17, 24, 39, 0.08);
  --error-light: #dc2626;
  --success-light: #16a34a;
  --input-bg-light: #ffffff;
  --input-text-light: #111827;
  --input-border-light: #d1d5db;

  --primary-dark: #f9fafb;
  --secondary-dark: #cbd5e1;
  --accent-dark: #60a5fa;
  --action-dark: #fbbf24;
  --bg-dark: #0b1220;
  --surface-dark: #111827;
  --card-dark: #0f172a;
  --border-dark: #243244;
  --shadow-dark: rgba(0, 0, 0, 0.35);
  --error-dark: #f87171;
  --success-dark: #4ade80;
  --input-bg-dark: #0b1220;
  --input-text-dark: #f9fafb;
  --input-border-dark: #334155;
}

body.light-theme {
  --primary: var(--primary-light);
  --secondary: var(--secondary-light);
  --accent: var(--accent-light);
  --action: var(--action-light);
  --bg: var(--bg-light);
  --surface: var(--surface-light);
  --card: var(--card-light);
  --border: var(--border-light);
  --shadow: var(--shadow-light);
  --error: var(--error-light);
  --danger: var(--error-light);
  --success: var(--success-light);
  --input-bg: var(--input-bg-light);
  --input-text: var(--input-text-light);
  --input-border: var(--input-border-light);
}

body.dark-theme {
  --primary: var(--primary-dark);
  --secondary: var(--secondary-dark);
  --accent: var(--accent-dark);
  --action: var(--action-dark);
  --bg: var(--bg-dark);
  --surface: var(--surface-dark);
  --card: var(--card-dark);
  --border: var(--border-dark);
  --shadow: var(--shadow-dark);
  --error: var(--error-dark);
  --danger: var(--error-dark);
  --success: var(--success-dark);
  --input-bg: var(--input-bg-dark);
  --input-text: var(--input-text-dark);
  --input-border: var(--input-border-dark);
}

html, body {
  margin: 0;
  padding: 0;
}

body {
  background: var(--bg);
  color: var(--primary);
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

a { color: var(--accent); }
a:hover { filter: brightness(0.95); }
