Dock causes a React hydration mismatch on <html> in SSR apps #482

I am trying to make devframe work inside of SSR apps in React, I noticed useScreenSafeArea from vueuse is being used and it is modifying the HTML attributes, this is fine in SPA or Nuxt app, but when rendering inside of a SSR React app, the server send the tag bare, and then vue runs and add style attributes to the HTML tag, then react hydration kicks in and compares the DOM from the server to the one the client now and sees the mismatch and the console shows an hydration mismatch warning
I opened a PR with a fix: #483

• Repro: https://github.com/omridevk/devframe-ssr-hydration-repro (second commit = whole change)
• No existing issue on hydration / safe-area (searched hydration, safe-area, useScreenSafeArea, suppressHydrationWarning, SSR).
• Aware of No clean path to mount a devtools-kit devtools.setup plugin (embedded dock) under Nuxt SSR (0.6) #289, but that one is about the dock not loading under Nuxt SSR, a different problem.
• The Next example doesn't show this: it renders its own UI with ui: false and puts suppressHydrationWarning on <html>.

(Disclaimer, code was written with Claude, but was meticulously reviewed by a human being or so I claim to be :P )