fix(terminal): clamp output panel against the live CSS-var width

The ResizeObserver clamp compared the persisted store width, which is
intentionally stale during a drag; a terminal shrink mid-drag could
overwrite the live width with a stale store value. Compare against the
live --output-panel-width variable (store as pre-write fallback) so the
clamp converges with the drag instead of fighting it.

Author: waleedlatif1

apps/sim/app/workspace/[workspaceId]/w/[workflowId]/components/terminal/terminal.tsx

@@ -1255,6 +1255,10 @@ export const Terminal = memo(function Terminal() {
   /**
    * Adjust output panel width on resize.
    * Closes the output panel if there's not enough space for the minimum width.
+   * The clamp compares against the live `--output-panel-width` CSS variable
+   * (the visual width — during a drag it runs ahead of the store, which only
+   * commits on release) so a resize mid-drag can never stomp the drag with a
+   * stale store value; the store value is the fallback before any write.
    */
   useEffect(() => {
     const el = terminalRef.current
@@ -1271,7 +1275,11 @@ export const Terminal = memo(function Terminal() {
         return
       }
 
-      if (outputPanelWidth > maxWidth) {
+      const liveWidth = Number.parseFloat(
+        document.documentElement.style.getPropertyValue('--output-panel-width')
+      )
+      const currentWidth = Number.isNaN(liveWidth) ? outputPanelWidth : liveWidth
+      if (currentWidth > maxWidth) {
         setOutputPanelWidth(Math.max(maxWidth, MIN_OUTPUT_PANEL_WIDTH_PX))
       }
     }