:root {
  --color-primary: #0e123f;
  --color-primary-dark: #0b0e32;
  --color-primary-light: #11164c;
  --color-secondary: #3f3b0e;
  --color-secondary-dark: #322f0b;
  --color-secondary-light: #4c4711;
  --color-dark: #1b1c1e;
  --color-light: #fffefd;
  --color-gray: #bfc1c5;
  --color-gray-dark: #70747c;
  --color-gray-light: #dadbde;
  --color-border: #a4a7ad;
  --color-border-dark: #898d95;
  --color-border-light: #babcc1;
  --color-background: #e7e8ea;
  --color-background-dark: #dfe0e2;
  --color-background-light: #eff0f1;
  --color-text: #27292b;
  --color-text-light: #898d95;
  --color-success: #32b643;
  --color-warning: #ffb700;
  --color-error: #e85600;
  --color-link: #0e123f;
  --color-link-dark: #050615;
  --color-link-light: #171e69;
  --color-code: #575b61;
  --color-highlight: #ffe9b3;
  --margin-2xsmall: 4px;
  --margin-xsmall: 8px;
  --margin-small: 16px;
  --margin-medium: 32px;
  --margin-large: 64px;
  --margin-xlarge: 128px;
  --padding-2xsmall: 4px;
  --padding-xsmall: 8px;
  --padding-small: 16px;
  --padding-medium: 32px;
  --padding-large: 64px;
  --padding-xlarge: 128px;
  --width-small: 150px;
  --width-medium: 300px;
  --width-large: 450px;
  --width-xlarge: 600px;
  --width-2xlarge: 750px;
  --height-small: 150px;
  --height-medium: 300px;
  --height-large: 450px;
  --height-xlarge: 600px;
  --height-2xlarge: 750px;
  --gap-small: 16px;
  --gap-medium: 32px;
  --gap-large: 64px;
  --border-radius-2xsmall: 4px;
  --border-radius-xsmall: 8px;
  --border-radius-small: 16px;
  --border-radius-medium: 32px;
  --border-radius-large: 64px;
  --border-width: 2px;
  --border-width-thin: 1px;
  --border-width-thick: 4px;
  --font-family: "Fira Sans", Verdana, sans-serif;
  --font-family-heading: var(--font-family);
  --font-family-code: "Fira Code", Consolas, "Andale Mono WT", "Andale Mono",
    "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono",
    "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco,
    "Courier New", Courier, monospace;
  --font-family-blockquote: var(--font-family);
  --font-family-drop-cap: var(--font-family);
  --font-size-xsmall: 0.5rem;
  --font-size-small: 0.75rem;
  --font-size: 16px;
  --font-size-heading-h5: 1.25rem;
  --font-size-heading-h4: 1.5rem;
  --font-size-heading-h3: 1.75rem;
  --font-size-heading-h2: 2rem;
  --font-size-heading-h1: 2.5rem;
  --line-height: 1.5;
  --line-height-heading: 1.2;
  --heading-space-after: 1rem;
  --heading-space-after: 0.75rem;
  --animation-duration: 1s;
  --animation-delay: 1s;
}

.dark {
  --color-primary: #1a1c33;
  --color-primary-dark: #141629;
  --color-primary-light: #1f213e;
  --color-secondary: #33311a;
  --color-secondary-dark: #292814;
  --color-secondary-light: #3e3b1f;
  --color-border: white;
  --color-border-dark: white;
  --color-border-light: white;
  --color-background: #27292b;
  --color-background-dark: #202123;
  --color-background-light: #2e3033;
  --color-text: #e7e8ea;
  --color-text-light: white;
  --color-code: white;
  --color-link: #1a1c33;
  --color-link-dark: #090911;
  --color-link-light: #2a2e56;
}