:root {
  /* Palette tokens (ARGB source converted to CSS rgba) */
  --purchase-900: rgba(119, 111, 217, 0.902); /* text strong */
  --purchase-650: rgba(119, 111, 217, 0.651); /* text weak */
  --purchase-500: rgba(119, 111, 217, 0.451); /* stroke strong */
  --purchase-300: rgba(119, 111, 217, 0.200); /* stroke middle */
  --purchase-100: rgba(119, 111, 217, 0.102); /* stroke weak */
  --purchase-50: rgba(119, 111, 217, 0.051); /* fill */

  --brand-900: rgba(76, 99, 217, 0.902); /* text strong */
  --brand-650: rgba(76, 99, 217, 0.651); /* text weak */
  --brand-500: rgba(76, 99, 217, 0.451); /* stroke strong */
  --brand-300: rgba(76, 99, 217, 0.200); /* stroke middle */
  --brand-100: rgba(76, 99, 217, 0.102); /* stroke weak */
  --brand-50: rgba(76, 99, 217, 0.051); /* fill */
  --brand-25: rgba(76, 99, 217, 0.031); /* fill weak */

  --grey-900: rgba(0, 6, 38, 0.902); /* text strong */
  --grey-650: rgba(0, 8, 51, 0.651); /* text weak */
  --grey-500: rgba(0, 13, 77, 0.451); /* stroke strong */
  --grey-300: rgba(0, 13, 77, 0.200); /* stroke middle */
  --grey-100: rgba(0, 17, 102, 0.102); /* stroke weak */
  --grey-50: rgba(0, 21, 128, 0.051); /* fill */
  --grey-25: rgba(0, 21, 128, 0.031); /* light weak */

  --amber-1000: rgba(153, 115, 28, 1); /* text strong */
  --amber-800: rgba(153, 115, 28, 0.800); /* text weak/stroke strong */
  --amber-200: rgba(153, 115, 28, 0.102); /* stroke weak */
  --amber-50: rgba(153, 115, 28, 0.051); /* fill */

  --green-1000: rgba(6, 122, 88, 1); /* text strong */
  --green-800: rgba(6, 122, 88, 0.800); /* text weak/stroke strong */
  --green-200: rgba(6, 122, 88, 0.102); /* stroke weak */
  --green-50: rgba(6, 122, 88, 0.051); /* fill */

  --red-1000: rgba(199, 58, 58, 1); /* text strong */
  --red-800: rgba(199, 58, 58, 0.800); /* text weak/stroke strong */
  --red-200: rgba(199, 58, 58, 0.102); /* stroke weak */
  --red-50: rgba(199, 58, 58, 0.051); /* fill */

  /* Basic color override */
  --text-brand-strong-opaque: #5C72DD;
  --fill-brand-opaque: #F5F6FC;
  --fill-brand-weak-opaque: #FAFBFF;

  /* General colors */
  --background-overlay-color: #ffffff;
  --background-color: #ffffff;
  --background-weak-color: rgba(255, 255, 255, 0.827);

  --text-purchase-strong: var(--purchase-900);
  --text-purchase-weak: var(--purchase-650);
  --stroke-purchase-strong: var(--purchase-500);
  --stroke-purchase-middle: var(--purchase-300);
  --stroke-purchase-weak: var(--purchase-100);
  --fill-purchase: var(--purchase-50);

  --text-brand-strong: var(--brand-900);
  --text-brand-weak: var(--brand-650);
  --stroke-brand-strong: var(--brand-500);
  --stroke-brand-middle: var(--brand-300);
  --stroke-brand-weak: var(--brand-100);
  --fill-brand: var(--brand-50);
  --fill-brand-weak: var(--brand-25);

  --text-neutral-strong: var(--grey-900);
  --text-neutral-weak: var(--grey-650);
  --stroke-neutral-strong: var(--grey-500);
  --stroke-neutral-middle: var(--grey-300);
  --stroke-neutral-weak: var(--grey-100);
  --fill-neutral: var(--grey-50);
  --fill-neutral-weak: var(--grey-50);

  --text-success-strong: var(--green-1000);
  --text-success-weak: var(--green-800);
  --stroke-success-strong: var(--green-800);
  --stroke-success-weak: var(--green-200);
  --fill-success: var(--green-50);

  --text-warning-strong: var(--amber-1000);
  --text-warning-weak: var(--amber-800);
  --stroke-warning-strong: var(--amber-800);
  --stroke-warning-weak: var(--amber-200);
  --fill-warning: var(--amber-50);

  --text-error-strong: var(--red-1000);
  --text-error-weak: var(--red-800);
  --stroke-error-strong: var(--red-800);
  --stroke-error-weak: var(--red-200);
  --fill-error: var(--red-50);

  /* Semantic editor color tokens */
  --bg: var(--fill-brand-opaque);
  --surface: var(--background-color);
  --surface2: var(--background-color);
  --border: var(--stroke-brand-middle);
  --border-hover: var(--stroke-neutral-middle);
  --text: var(--text-neutral-strong);
  --text-muted: var(--text-neutral-weak);
  --text-hint: var(--stroke-neutral-strong);
  --accent: var(--text-brand-strong);
  --accent-light: var(--fill-brand);
  --accent2: var(--text-brand-strong);
  --accent2-light: var(--stroke-brand-weak);
  --amber: var(--text-warning-strong);
  --amber-light: var(--fill-warning);
  --danger: var(--text-error-strong);
  --danger-light: var(--fill-error);
  --success: var(--text-success-strong);
  --success-light: var(--fill-success);
  --select-border: var(--stroke-brand-middle);
  --select-active: var(--text-brand-weak);
}