With the dark mode, I added several dozen CSS variables. Currently, they are *only* used by the dark mode. The goal was to not break anything in the light mode while working on the dark mode.

This is what it often looks like in the code:

.cm-s-default {
    color: black;
}

@media (prefers-dark-interface) {
    :root {
        --text-color: hsl(0, 0%, 88%);
    }
    .cm-s-default {
        color: var(--text-color);
    }
}

Now that we don't expect many changes in the dark mode, it makes sense to start using the same variables for the light mode as well:

:root {
    --text-color: black;
}

@media (prefers-dark-interface) {
    :root {
        --text-color: hsl(0, 0%, 88%);
    }
}

.cm-s-default {
    color: var(--text-color);
}