Correct way to edit CSS for light and dark modes

Support
2

The container query will work, but to simplify you can use the native light-dark() function in CSS to do this too:

.my-thing {
  background: light-dark(#fff, #000);
  color: light-dark(#222, #eee);
}

Generally in Discourse we rely on color variables that automatically change to avoid setting specific colors this way (--primary, --secondary, etc)… this allows colors to work no matter the color scheme.

You can see some examples here: https://meta.discourse.org/styleguide/atoms/colors and how they change if you switch to dark/light modes. These variables are set up by color palettes in /admin/config/colors