:root {
  --color-primary: #6424d0;
  --color-primary-contrast: #ffffff;
  --color-primary-hover: #551fb1;
  --color-primary-active: #4b1b9c;
  --color-accent: #6424d0;
  --color-primary-light-1: #7c46d8;
  --color-primary-light-2: #9d76eb;
  --color-primary-light-3: #c7b1f5;
  --color-primary-light-4: #d6c2f9;
  --color-primary-light-5: #e4d3ff;
  --color-primary-light-6: #efe2ff;
  --color-primary-light-7: #f7eeff;
  --color-primary-dark-1: #551fb1;
  --color-primary-dark-2: #4b1b9c;
  --color-primary-dark-3: #3f1782;
  --color-primary-dark-4: #3a1576;
  --color-primary-dark-5: #321266;
  --color-primary-dark-6: #2a0e57;
  --color-primary-dark-7: #220c47;
  --color-primary-alpha-10: #6424d019;
  --color-primary-alpha-20: #6424d033;
  --color-primary-alpha-30: #6424d04b;
  --color-primary-alpha-40: #6424d066;
  --color-primary-alpha-50: #6424d080;
  --color-primary-alpha-60: #6424d099;
  --color-primary-alpha-70: #6424d0b3;
  --color-primary-alpha-80: #6424d0cc;
  --color-primary-alpha-90: #6424d0e1;
}