@Meyerweb completely contrived example (sorry ahead of time if this does not bear any relevance to your question, all depends on how the variables are being used, and how the project is toggling dark/light mode styling)
```
// variables that might be defined in your variables.scss file
$a_color: #dca;
$an_another_color: #753;

// some random stylesheet
.foo {
background: $a_background_color;
}
@media (prefers-color-scheme: dark) {
.foo {
background: $an_another_color;
}
}
```

@wholewheattoast So basically define dark-mode versions of all the colors, like so:
```
$main-color: #333;
$dark-main-color: #CCC;
$bg-color: #EEE;
$dark-bg-color: #111;
```
…and then flop everything in CSS `@media()` statements? That feels really clumsy, given that the `$color` references will be scattered throughout the rest of the Sass. I’d much rather something like:
```
$main-color: #333;
$bg-color: #EEE;

@media (prefers-color-scheme: dark) {
$main-color: #CCC;
$bg-color: #111;
}
```