.has-soblueitmakesmecry-background-color {
  background-color: #04cfff;
}

/* Color variables */

/* Colors in :root are default values used in the light theme */
:root {
  --colors-theme-hint-primary: #000;
  --colors-theme-hint-secondary: #fc1de5;
  --colors-surface-primary: #fff;
  --colors-surface-recess-1: #f5f5f5;
  --colors-surface-recess-2: #d4d4d4;
  --colors-surface-recess-3: #a3a3a3;
  --colors-surface-recess-4: #404040;
  --colors-surface-recess-5: #171717;
  --colors-surface-hover-1: #ef3;
  --colors-surface-hover-2: #c0fc1d;
  --colors-surface-hover-3: #fc1de5;
  --colors-text-primary: #0a0a0a;
  --colors-text-primary-contrast: #fff;
}

.dark-theme {
  --colors-surface-primary: #171717;
  --colors-surface-recess-1: #404040;
  --colors-surface-recess-2: #525252;
  --colors-surface-recess-3: #737373;
  --colors-surface-recess-4: #a3a3a3;
  --colors-surface-recess-5: #f5f5f5;
  --colors-surface-hover-1: #e64500;
  --colors-surface-hover-2: #1d76fc;
  --colors-surface-hover-3: #fc1de5;
}

body {
  background-color: var(--colors-surface-primary);
  color: var(--colors-text-primary);
}