:root {
  --wa-font-family: 'Inter', system-ui, sans-serif;
  --wa-color-primary: #6366f1;
  --wa-color-primary-hover: #4f46e5;
  --wa-color-success: #22c55e;
  --wa-color-warning: #f59e0b;
  --wa-color-danger: #ef4444;
  --wa-color-info: #3b82f6;

  --wa-bg-primary: #ffffff;
  --wa-bg-secondary: #f9fafb;
  --wa-bg-tertiary: #f3f4f6;
  --wa-text-primary: #111827;
  --wa-text-secondary: #6b7280;
  --wa-border-color: #e5e7eb;
  --wa-radius: 0.5rem;
  --wa-spacing: 1rem;
}

.wa-dark {
  --wa-bg-primary: #111827;
  --wa-bg-secondary: #1f2937;
  --wa-bg-tertiary: #374151;
  --wa-text-primary: #f9fafb;
  --wa-text-secondary: #9ca3af;
  --wa-border-color: #374151;
}

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

body {
  font-family: var(--wa-font-family);
  background: var(--wa-bg-secondary);
  color: var(--wa-text-primary);
  line-height: 1.6;
}

a {
  color: var(--wa-color-primary);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}