I have a React app using JoyUI running in a shadow DOM (because it's a chrome extension content script).
When the font-size of some web page that the extension is running in is set to eg. 14px instead of 16px, my shadow DOM content script UI changes size. This is because the JoyUI CSS variables are based on rem, which is always inherited from the root html element and can't be changed just for the shadow DOM (eg. by setting font-size: initial; on the shadow DOM root).
How can I force JoyUI to always use 16px as the standard font size?
In MUI (not JoyUI) it's possible to manually set the htmlFontSize in a custom theme.
Is there a way to do something similar in JoyUI?