Automatically Switch CSS Colors Between Light And Dark Mode Based On User Preference

This is how I'm switching the CSS colors on my site from light to dark depending on user preference.

Code

Notes

The Kevin Powell video shows starting with light mode then switching to dark. I flipped it around with the idea that I pref dark so if someone doesn't have a setting it's the design I'd prefer to show. There's no problem with that according to the MDN article.
The only CSS on this page is what you see in the code snippet.

Add a little more CSS to give at least a little bit of layout

Reference

How to make a nice site with less CSS from Kevin Powell

Reference

CSS prefers-color-scheme (MDN)

Reference

CSS color-scheme (MDN)