:root,
body.dark {
--primary: #3b536f;
--on-primary: #d8dee9;
--primary-container: #2a3a50;
--on-primary-container: #e5e9f0;

--secondary: #2e3440;
--on-secondary: #d8dee9;
--secondary-container: #1c2027;
--on-secondary-container: #eceff4;

--tertiary: #2b303b;
--on-tertiary: #d8dee9;
--tertiary-container: #1a1d24;
--on-tertiary-container: #e5e9f0;

--error: #a5424d;
--on-error: #eceff4;
--error-container: #2b1f22;
--on-error-container: #d8dee9;

--background: #121417;
--on-background: #d8dee9;

--surface: #181a1f;
--on-surface: #d8dee9;

--surface-variant: #1f2228;
--on-surface-variant: #e5e9f0;

--outline: #3b4252;
--outline-variant: #2e3440;

--shadow: #000000;
--scrim: #000000;

--inverse-surface: #d8dee9;
--inverse-on-surface: #2e3440;
--inverse-primary: #5e81ac;

--surface-dim: #121417;
--surface-bright: #2e3440;

--surface-container-lowest: #0b0d10;
--surface-container-low: #121417;
--surface-container: #181a1f;
--surface-container-high: #1f2228;
--surface-container-highest: #2b303b;

}