:root {
    // Palette
    --color-base03: #002b36;
    --color-base01: #586e75;
    --color-base00: #657b83;
    --color-base0: #839496;
    --color-base1: #93a1a1;
    --color-base3: #fdf6e3;
    --color-blue: #268bd2;

    // Semantic
    --bg: var(--color-base3);
    --text: var(--color-base00);
    --heading: var(--color-base01);
    --link: var(--color-blue);
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg: var(--color-base03);
        --text: var(--color-base0);
        --heading: var(--color-base1);
    }
}