fix: Inspect panel styles break when host page sets a custom html font-size (rem-based units)

🐛 The bug

When a host application uses postcss-pxtorem (or similar tools) to set a non-default font-size on for mobile responsive layouts (e.g. font-size: 41.4px instead of the browser default 16px), the nuxt-devtools-inspect-panel web component renders incorrectly.

The root cause is that the generated CSS in packages/devtools/src/webcomponents/.generated/css.ts uses rem units.
Since rem is relative to the host page's font-size — not the web component's own root — all rem-based
dimensions in the inspect panel scale incorrectly.

🛠️ To reproduce

[]

🌈 Expected behavior

The inspect panel should render consistently regardless of the host page's root font-size.

ℹ️ Additional context

Replace rem with px (or em scoped to the component's own font-size) in the web component's CSS, since web components don't inherit a predictable rem baseline from the host page.

Start in packages/devtools/src/webcomponents/.generated/css.ts and inspect the rem-based dimensions used by the inspect panel. Reproduce the panel with a host page whose html font-size is 41.4px, then verify it renders consistently with the default font size after the CSS units are updated.