:root {
  --va-primary: #1f8f6a;
  --va-primary-dark: #166a4f;
  --va-accent: #3a86c8;
  --va-success: #229a72;
  --va-warning: #c9962a;
  --va-danger: #c84f5a;

  --va-bg: #f4f7fb;
  --va-surface: #ffffff;
  --va-surface-alt: #edf2f7;
  --va-border: rgba(0, 0, 0, 0.08);

  --va-text: #17212f;
  --va-text-muted: #607086;
  --va-muted: var(--va-text-muted);

  --va-shadow-sm: 0 8px 20px rgba(16, 24, 40, 0.06);
  --va-shadow-md: 0 14px 34px rgba(16, 24, 40, 0.10);
  --va-shadow-lg: 0 24px 60px rgba(16, 24, 40, 0.16);
  --va-shadow: var(--va-shadow-md);

  --va-radius-sm: 10px;
  --va-radius-md: 16px;
  --va-radius-lg: 22px;
  --va-radius: var(--va-radius-lg);

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

  --va-card-padding: 24px;
  --va-card-pad: var(--va-card-padding);
  --va-section-gap: 32px;
  --va-grid-gap: 24px;
  --va-max: 1280px;

  --va-focus-ring: 0 0 0 3px rgba(58, 134, 200, 0.22);

  --va-hero-overlay-start: rgba(7, 15, 28, 0.16);
  --va-hero-overlay-mid: rgba(7, 15, 28, 0.28);
  --va-hero-overlay-end: rgba(7, 15, 28, 0.52);

  --va-pill-bg: rgba(31, 143, 106, 0.10);
  --va-pill-border: rgba(31, 143, 106, 0.18);
  --va-pill-text: var(--va-text);

  --va-input-bg: var(--va-surface);
  --va-input-border: var(--va-border);
  --va-input-text: var(--va-text);
  --va-input-placeholder: color-mix(in srgb, var(--va-text-muted) 76%, transparent);

  --va-tab-bg: transparent;
  --va-tab-text: var(--va-text-muted);
  --va-tab-active-bg: color-mix(in srgb, var(--va-primary) 12%, transparent);
  --va-tab-active-text: var(--va-text);

  --va-secondary: #1d4ed8;
}

body.theme-dark,
body[data-theme="dark"] {
  --va-primary: #2fb486;
  --va-primary-dark: #218763;
  --va-accent: #69aee6;
  --va-success: #2fb486;
  --va-warning: #d7a94a;
  --va-danger: #df6a73;

  --va-bg: #08111f;
  --va-surface: rgba(15, 25, 45, 0.65);
  --va-surface-alt: rgba(21, 35, 58, 0.82);
  --va-border: rgba(255, 255, 255, 0.06);

  --va-text: #eef4fb;
  --va-text-muted: #9fb0c3;
  --va-muted: var(--va-text-muted);

  --va-shadow-sm: 0 10px 24px rgba(0, 0, 0, 0.22);
  --va-shadow-md: 0 18px 42px rgba(0, 0, 0, 0.30);
  --va-shadow-lg: 0 28px 70px rgba(0, 0, 0, 0.38);
  --va-shadow: var(--va-shadow-md);

  --va-focus-ring: 0 0 0 3px rgba(105, 174, 230, 0.24);

  --va-hero-overlay-start: rgba(8, 17, 31, 0.08);
  --va-hero-overlay-mid: rgba(8, 17, 31, 0.22);
  --va-hero-overlay-end: rgba(8, 17, 31, 0.48);

  --va-pill-bg: rgba(255, 255, 255, 0.06);
  --va-pill-border: rgba(255, 255, 255, 0.08);
  --va-pill-text: var(--va-text);

  --va-input-bg: rgba(255, 255, 255, 0.03);
  --va-input-border: rgba(255, 255, 255, 0.08);
  --va-input-text: var(--va-text);
}