In the element theme, the font-size in :root should be scoped to hydrogen

[svieujot]

To avoid bleeding outsize of the hydrogen container when hydrogen is embedded in a web page.

https://github.com/vector-im/hydrogen-web/blob/25d0cbe9a2120169db2e00942d216b31afbcf021/src/platform/web/ui/css/themes/element/theme.css#L21

[bwindels]

We could move this line to index.html so it is not included for embedded cases, but I wonder if this will effectively require to move away from rem units in CSS, as they couple the root font-size to the scale factor of the hydrogen. They don't seem ideal for the embedded use case, as they prevent other sections on the page from using rem units as well. Instead, we could use:

• em units, but there scaling will depend on nesting, which is undesirable.
• px, but then we can't offer a scale factor.
• use css variables for either the scale factor or all font-sizes used, but would need to see if postcss can inline these (for IE).
• same, but use preprocessor variables (in combination with snowpack)