Bring over the youtube shortcode from the old theme, and add styles for the figures
it creates. Add the .figure--youtube class to the <figure> element.
In addition to the color scheme changing based on the system setting, enable
setting the color scheme explicitly by adding a color-scheme="light | dark" attribute
on the <html> element.
Doing this was a bit tricky. I originally implemented the grayscale ramp by
reversing it when prefers-color-scheme: dark. This was convenient, but meant that
setting the color scheme explicitly didn't work.
Along the way I discovered the light-dark() CSS function. Deploy that as the preferred
style if the browser supports it. Otherwise, fall back on the prefers-color-scheme
media queries. This function only works if color-scheme: light dark is set on the
:root element.
