:root {
  --color-primary: #06ad5b;
  --color-primary-dark: #003908;
  --color-secondary: #c5da4c;
  --color-secondary-dark: #4f571f;
  --color-accent-1: #c5da4c;
  --color-accent-2: #7a4df4;
  --color-accent-3: #f995ce;
  --color-accent-4: #f2bf40;
  --gradient-brand: linear-gradient(24deg, #06ad5b 0%, #06ad5b 30%, #7a4df4 60%, #f995ce 80%, #f2bf40 100%);
  --gradient-primary: linear-gradient(135deg, #c5da4c 0%, #06ad5b 100%);
  --color-primary-100: #c5ebd3;
  --color-primary-200: #9edeb6;
  --color-primary-300: #77d199;
  --color-primary-400: #50c47c;
  --color-primary-500: #06ad5b;
  --color-primary-600: #1a8a49;
  --color-primary-700: #146838;
  --color-primary-800: #0e4627;
  --color-primary-900: #072312;
  --color-secondary-100: #f3f6dc;
  --color-secondary-300: #dfe8ab;
  --color-secondary-500: #c5da4c;
  --color-secondary-600: #9dae3d;
  --color-secondary-700: #76822e;
  --color-neutral-50: #fafbfa;
  --color-neutral-100: #f5f7f5;
  --color-neutral-200: #eff2ef;
  --color-neutral-300: #d8ded8;
  --color-neutral-400: #c2c8c2;
  --color-neutral-500: #9ba19b;
  --color-neutral-600: #6b716b;
  --color-neutral-700: #4a514a;
  --color-neutral-800: #2f352f;
  --color-neutral-900: #1a1f1a;
  --color-surface: #fff;
  --color-surface-raised: #fff;
  --color-surface-sunken: #eff2ef;
  --color-border: #d8ded8;
  --color-border-strong: #c2c8c2;
  --color-text: #072312;
  --color-text-secondary: #336139;
  --color-text-muted: #636963;
  --color-text-inverse: #fff;
  --color-overlay: #00000080;
  --color-surface-brand: #0e4627;
  --color-surface-brand-text: #f8faf8;
  --color-success: #21ad5b;
  --color-success-dark: #0e4627;
  --color-warning: #f2bf40;
  --color-warning-dark: #960;
  --color-error: #cc3d3d;
  --color-error-dark: #7a1f1f;
  --color-info: #0288d1;
  --color-info-dark: #075985;
  --color-primary-fill: #146838;
  --color-primary-fill-hover: #0e4627;
  --color-on-primary: #fff;
  --color-primary-text: #146838;
  --color-focus: #146838;
  --color-border-input: #7d847d;
  --color-text-placeholder: #676d67;
  --color-surface-inverse: #072312;
  --color-text-on-inverse: #fff;
  --color-warning-text: #7a5200;
  --color-error-fill: #b42d2d;
  --color-on-error: #fff;
  --color-rating-active: #a87400;
  --color-accent-2-dark: #4c1d95;
  --color-accent-3-dark: #831843;
  --color-accent-4-dark: #614c1a;
  --color-primary-50: color-mix(in srgb, var(--color-primary) 50%, var(--color-surface));
  --color-primary-dark-50: color-mix(in srgb, var(--color-primary-dark) 50%, var(--color-surface));
  --color-secondary-50: color-mix(in srgb, var(--color-secondary) 50%, var(--color-surface));
  --color-accent-1-50: color-mix(in srgb, var(--color-accent-1) 50%, var(--color-surface));
  --color-accent-2-50: color-mix(in srgb, var(--color-accent-2) 50%, var(--color-surface));
  --color-accent-3-50: color-mix(in srgb, var(--color-accent-3) 50%, var(--color-surface));
  --color-accent-4-50: color-mix(in srgb, var(--color-accent-4) 50%, var(--color-surface));
  --shadow-sm: 0 1px 2px   #0723120f;
  --shadow-md: 0 2px 6px   #07231214;
  --shadow-lg: 0 8px 20px  #0723121a;
  --shadow-xl: 0 16px 32px #07231224;
}

::selection {
  background: var(--color-primary-200);
  color: var(--color-primary-dark);
}

@media (prefers-contrast: more) {
  :root {
    --color-border: var(--color-border-input);
    --color-text-muted: var(--color-text-secondary);
  }
}