fix(ui): open/close tool windows with the hidden attribute

panelUtils owns the window's inline left/top/z-index/height, so React
should not manage its style at all; use `hidden` (+ a CSS rule against
the frame's display:flex) instead of style.display (#1). Also drops a
dynamic style value the HMDesign guard reported as unverifiable.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/components/FloatingPanel.tsx

@@ -29,7 +29,8 @@ const GAP = 12
  * Drag (header), collapse (header double-click / button) and focus-to-front come from the ported
  * `makePanelDraggableAndCollapsible` (src/engine/panelUtils.ts, unchanged); resizing is CSS `resize: both` on the
  * frame, as in the sample. The frame keeps a static className because panelUtils toggles `collapsed` on it, and
- * React would overwrite a changing className. Open/closed only touches `style.display`.
+ * React would overwrite a changing className; panelUtils also owns its inline left/top/z-index/height. Open/closed
+ * is the `hidden` attribute, so neither of those is touched.
  */
 export function FloatingPanel({ title, icon, meta, actions, open, onClose, slot, anchorRef, size = "tall", children }: Props) {
   const frameRef = useRef<HTMLElement>(null)
@@ -71,7 +72,7 @@ export function FloatingPanel({ title, icon, meta, actions, open, onClose, slot,
       className="viewer-window"
       data-size={size}
       aria-label={title}
-      style={{ display: open ? undefined : "none" }}
+      hidden={!open}
     >
       <Card size="sm" className="viewer-window-card">
         <CardHeader ref={headerRef} className="viewer-window-header border-b">

src/hm-theme.css

@@ -126,6 +126,9 @@
   border-radius: var(--hm-radius-container);
   box-shadow: var(--hm-sem-floating-shadow);
 }
+.viewer-window[hidden] {
+  display: none;
+}
 .viewer-window[data-size="auto"] {
   height: auto;
   max-height: min(78dvh, 760px);