:root {
  --surface_base: var(--white);
  --surface_elevated: var(--grey-50);
  --surface_subtle: var(--grey-100);
  --surface_muted: var(--grey-150);
  --surface_inverse: var(--grey-800);
  --surface_overlay: rgba(0, 0, 0, 0.16);

  --text_primary: var(--grey-800);
  --text_secondary: var(--grey-600);
  --text_tertiary: var(--grey-500);
  --text_disabled: var(--grey-350);
  --text_inverse: var(--white);
  --text_link: var(--violet-500);

  --border_subtle: var(--grey-100);
  --border_default: var(--grey-150);
  --border_strong: var(--grey-300);
  --border_inverse: var(--grey-800);

  --interactive_primary: var(--grey-800);
  --interactive_primary-hover: var(--grey-600);
  --interactive_primary-disabled: var(--grey-400);
  --interactive_primary-hover-2: var(--grey-600);
  --interactive_secondary: var(--grey-100);
  --interactive_secondary-hover: var(--grey-150);
  --interactive_secondary-active: var(--grey-200);
  --interactive_accent: var(--violet-500);
  --interactive_accent-subtle: var(--violet-200);
  --interactive_disabled-bg: var(--grey-100);
  --interactive_disabled-fg: var(--grey-350);
  --focus_ring: var(--violet-500);

  --status_success: var(--green-500);
  --status_success-hover: var(--green-600);
  --status_success-active: var(--green-700);
  --status_success-subtle: var(--green-100);
  --status_danger: var(--red-500);
  --status_danger-hover: var(--red-700);
  --status_danger-active: var(--red-800);
  --status_danger-subtle: var(--red-100);
  --status_warning: var(--yellow-500);
  --status_warning-hover: var(--yellow-600);
  --status_warning-active: var(--yellow-800);
  --status_warning-subtle: var(--yellow-100);
  --status_info: var(--blue-500);
  --status_info-hover: var(--blue-700);
  --status_info-active: var(--blue-800);
  --status_info-subtle: var(--blue-100);
  --status_attention: var(--violet-500);
  --status_attention-hover: var(--violet-600);
  --status_attention-active: var(--violet-700);
  --status_attention-subtle: var(--violet-100);
}
