diff --git a/packages/super-editor/src/components/SuperEditor.vue b/packages/super-editor/src/components/SuperEditor.vue
index 1a0e33efb0..a6c8e2ad9a 100644
--- a/packages/super-editor/src/components/SuperEditor.vue
+++ b/packages/super-editor/src/components/SuperEditor.vue
@@ -302,6 +302,7 @@ const openPopover = (component, props, position) => {
 const tableResizeState = reactive({
   visible: false,
   tableElement: null,
+  dragging: false,
 });
 
 /**
@@ -553,6 +554,9 @@ const isNearRowBoundary = (event, tableElement) => {
  * @returns {void}
  */
 const updateTableResizeOverlay = (event) => {
+  // Don't change overlay visibility while a resize drag is active
+  if (tableResizeState.dragging) return;
+
   // Throttle: skip if called too frequently
   const now = Date.now();
   if (now - lastUpdateTableResizeTimestamp < TABLE_RESIZE_THROTTLE_MS) {
@@ -594,6 +598,17 @@ const updateTableResizeOverlay = (event) => {
  * Hide table resize overlay (on mouse leave)
  */
 const hideTableResizeOverlay = () => {
+  if (tableResizeState.dragging) return;
+  tableResizeState.visible = false;
+  tableResizeState.tableElement = null;
+};
+
+const onTableResizeStart = () => {
+  tableResizeState.dragging = true;
+};
+
+const onTableResizeEnd = () => {
+  tableResizeState.dragging = false;
   tableResizeState.visible = false;
   tableResizeState.tableElement = null;
 };
@@ -735,7 +750,12 @@ const handleOverlayUpdates = (event) => {
   } else {
     updateTableResizeOverlay(event);
   }
-  updateImageResizeOverlay(event);
+  // Don't evaluate image overlay during an active table resize drag —
+  // without the oversized table overlay, pointer events can reach images
+  // and spuriously activate the image resize overlay mid-drag.
+  if (!tableResizeState.dragging) {
+    updateImageResizeOverlay(event);
+  }
 };
 
 /**
@@ -1207,6 +1227,8 @@ onBeforeUnmount(() => {
         :editor="activeEditor"
         :visible="tableResizeState.visible"
         :tableElement="tableResizeState.tableElement"
+        @resize-start="onTableResizeStart"
+        @resize-end="onTableResizeEnd"
       />
       <!-- Image resize overlay for interactive image resizing -->
       <ImageResizeOverlay
diff --git a/packages/super-editor/src/components/TableResizeOverlay.test.js b/packages/super-editor/src/components/TableResizeOverlay.test.js
index bd7ec70ad3..c8214173c3 100644
--- a/packages/super-editor/src/components/TableResizeOverlay.test.js
+++ b/packages/super-editor/src/components/TableResizeOverlay.test.js
@@ -1041,4 +1041,358 @@ describe('TableResizeOverlay', () => {
       wrapper.unmount();
     });
   });
+
+  // ==========================================================================
+  // Visual bounds during drag (SD-2094)
+  // ==========================================================================
+
+  describe('Visual bounds during drag (SD-2094)', () => {
+    /** Metadata with both column and row boundaries for cross-axis tests */
+    const metadataWithRows = {
+      columns: [
+        { i: 0, x: 0, w: 100, min: 50, r: 1 },
+        { i: 1, x: 100, w: 150, min: 50, r: 1 },
+      ],
+      rows: [
+        { i: 0, y: 0, h: 50, min: 30, r: 1 },
+        { i: 1, y: 50, h: 50, min: 30, r: 1 },
+      ],
+    };
+
+    it('should not expand overlay width during column drag', async () => {
+      const tableElement = createMockTableElement();
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      // Start a column drag
+      const event = new MouseEvent('mousedown', { clientX: 100 });
+      Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(event, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onHandleMouseDown(event, 0);
+
+      await nextTick();
+
+      // Overlay width should remain at table width (350), not expanded
+      const style = wrapper.vm.overlayStyle;
+      expect(style.width).toBe('350px');
+      expect(style.height).toBe('200px');
+
+      wrapper.unmount();
+    });
+
+    it('should not expand overlay height during row drag', async () => {
+      const tableElement = createMockTableElement(metadataWithRows);
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      // Start a row drag
+      const event = new MouseEvent('mousedown', { clientY: 50 });
+      Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(event, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onRowHandleMouseDown(event, 0);
+
+      await nextTick();
+
+      // Overlay height should remain at table height (200), not expanded
+      const style = wrapper.vm.overlayStyle;
+      expect(style.width).toBe('350px');
+      expect(style.height).toBe('200px');
+
+      wrapper.unmount();
+    });
+
+    it('should constrain row handle width to table width', async () => {
+      const tableElement = createMockTableElement(metadataWithRows);
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      const rowBoundary = wrapper.vm.resizableRowBoundaries[0];
+      const style = wrapper.vm.getRowHandleStyle(rowBoundary);
+
+      // Width should be explicit pixel value matching table width, not '100%'
+      expect(style.width).toBe('350px');
+
+      wrapper.unmount();
+    });
+
+    it('should constrain column handle fallback height to table height', async () => {
+      const tableElement = createMockTableElement();
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      const boundary = wrapper.vm.resizableBoundaries[0];
+      // null segment height triggers the fallback
+      const style = wrapper.vm.getSegmentHandleStyle(boundary, { y: null, h: null });
+
+      // Height should be explicit pixel value matching table height, not '100%'
+      expect(style.height).toBe('200px');
+
+      wrapper.unmount();
+    });
+
+    it('should constrain column guideline height to table height during drag', async () => {
+      const tableElement = createMockTableElement();
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      const event = new MouseEvent('mousedown', { clientX: 100 });
+      Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(event, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onHandleMouseDown(event, 0);
+
+      await nextTick();
+
+      const style = wrapper.vm.guidelineStyle;
+      expect(style.height).toBe('200px');
+
+      wrapper.unmount();
+    });
+
+    it('should constrain row guideline width to table width during drag', async () => {
+      const tableElement = createMockTableElement(metadataWithRows);
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      const event = new MouseEvent('mousedown', { clientY: 50 });
+      Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(event, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onRowHandleMouseDown(event, 0);
+
+      await nextTick();
+
+      const style = wrapper.vm.rowGuidelineStyle;
+      expect(style.width).toBe('350px');
+
+      wrapper.unmount();
+    });
+
+    it('should hide row handles during column drag', async () => {
+      const tableElement = createMockTableElement(metadataWithRows);
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      // Row handles should be visible before drag
+      const rowHandlesBefore = wrapper.findAll('.resize-handle--row');
+      expect(rowHandlesBefore.length).toBeGreaterThan(0);
+      expect(rowHandlesBefore[0].element.style.display).not.toBe('none');
+
+      // Start a column drag
+      const event = new MouseEvent('mousedown', { clientX: 100 });
+      Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(event, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onHandleMouseDown(event, 0);
+
+      await nextTick();
+
+      // Row handles should be hidden (v-show sets display:none) during column drag
+      const rowHandlesDuring = wrapper.findAll('.resize-handle--row');
+      for (const handle of rowHandlesDuring) {
+        expect(handle.element.style.display).toBe('none');
+      }
+
+      wrapper.unmount();
+    });
+
+    it('should hide column handles during row drag', async () => {
+      const tableElement = createMockTableElement(metadataWithRows);
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      // Column handles should be visible before drag
+      const colHandlesBefore = wrapper.findAll('.resize-handle:not(.resize-handle--row)');
+      expect(colHandlesBefore.length).toBeGreaterThan(0);
+      expect(colHandlesBefore[0].element.style.display).not.toBe('none');
+
+      // Start a row drag
+      const event = new MouseEvent('mousedown', { clientY: 50 });
+      Object.defineProperty(event, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(event, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onRowHandleMouseDown(event, 0);
+
+      await nextTick();
+
+      // Column handles should be hidden (v-show sets display:none) during row drag
+      const colHandlesDuring = wrapper.findAll('.resize-handle:not(.resize-handle--row)');
+      for (const handle of colHandlesDuring) {
+        expect(handle.element.style.display).toBe('none');
+      }
+
+      wrapper.unmount();
+    });
+
+    it('should always emit resize-end on column drag mouseup', async () => {
+      const tableElement = createMockTableElement();
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor: createMockEditor(),
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      // Start drag
+      const downEvent = new MouseEvent('mousedown', { clientX: 100 });
+      Object.defineProperty(downEvent, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(downEvent, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onHandleMouseDown(downEvent, 0);
+
+      expect(wrapper.vm.dragState).not.toBeNull();
+
+      // Immediately release (zero delta — below MIN_RESIZE_DELTA_PX)
+      const upEvent = new MouseEvent('mouseup');
+      document.dispatchEvent(upEvent);
+
+      await nextTick();
+
+      // resize-end should still be emitted even with zero delta
+      expect(wrapper.emitted('resize-end')).toBeDefined();
+      expect(wrapper.emitted('resize-end').length).toBeGreaterThanOrEqual(1);
+
+      wrapper.unmount();
+    });
+
+    it('should cancel an active column drag on window blur', async () => {
+      const editor = createMockEditor();
+      const tableElement = createMockTableElement();
+      const wrapper = mount(TableResizeOverlay, {
+        props: {
+          editor,
+          visible: true,
+          tableElement,
+        },
+      });
+
+      await nextTick();
+
+      const downEvent = new MouseEvent('mousedown', { clientX: 100 });
+      Object.defineProperty(downEvent, 'preventDefault', { value: vi.fn() });
+      Object.defineProperty(downEvent, 'stopPropagation', { value: vi.fn() });
+      wrapper.vm.onHandleMouseDown(downEvent, 0);
+
+      expect(wrapper.vm.dragState).not.toBeNull();
+      expect(editor.view.dom.style.pointerEvents).toBe('none');
+
+      window.dispatchEvent(new Event('blur'));
+      await nextTick();
+
+      expect(wrapper.vm.dragState).toBeNull();
+      expect(editor.view.dom.style.pointerEvents).toBe('auto');
+      expect(wrapper.emitted('resize-end')).toBeDefined();
+
+      wrapper.unmount();
+    });
+
+    it('should cancel an active row drag when the document becomes hidden', async () => {
+      const originalVisibilityState = Object.getOwnPropertyDescriptor(document, 'visibilityState');
+      Object.defineProperty(document, 'visibilityState', {
+        configurable: true,
+        value: 'hidden',
+      });
+
+      try {
+        const editor = createMockEditor();
+        const metadata = {
+          columns: [
+            { i: 0, x: 0, w: 100, min: 50, r: 1 },
+            { i: 1, x: 100, w: 150, min: 50, r: 1 },
+          ],
+          rows: [
+            { i: 0, y: 0, h: 50, min: 30, r: 1 },
+            { i: 1, y: 50, h: 50, min: 30, r: 1 },
+          ],
+        };
+        const tableElement = createMockTableElement(metadata);
+        const wrapper = mount(TableResizeOverlay, {
+          props: {
+            editor,
+            visible: true,
+            tableElement,
+          },
+        });
+
+        await nextTick();
+
+        const downEvent = new MouseEvent('mousedown', { clientY: 50 });
+        Object.defineProperty(downEvent, 'preventDefault', { value: vi.fn() });
+        Object.defineProperty(downEvent, 'stopPropagation', { value: vi.fn() });
+        wrapper.vm.onRowHandleMouseDown(downEvent, 0);
+
+        expect(wrapper.vm.rowDragState).not.toBeNull();
+        expect(editor.view.dom.style.pointerEvents).toBe('none');
+
+        document.dispatchEvent(new Event('visibilitychange'));
+        await nextTick();
+
+        expect(wrapper.vm.rowDragState).toBeNull();
+        expect(editor.view.dom.style.pointerEvents).toBe('auto');
+        expect(wrapper.emitted('resize-end')).toBeDefined();
+
+        wrapper.unmount();
+      } finally {
+        if (originalVisibilityState) {
+          Object.defineProperty(document, 'visibilityState', originalVisibilityState);
+        } else {
+          delete document.visibilityState;
+        }
+      }
+    });
+  });
 });
diff --git a/packages/super-editor/src/components/TableResizeOverlay.vue b/packages/super-editor/src/components/TableResizeOverlay.vue
index ff62310ff8..fccf2a522a 100644
--- a/packages/super-editor/src/components/TableResizeOverlay.vue
+++ b/packages/super-editor/src/components/TableResizeOverlay.vue
@@ -14,6 +14,7 @@
     >
       <div
         v-for="(segment, segmentIndex) in getBoundarySegments(boundary)"
+        v-show="!rowDragState"
         :key="`handle-${boundary.type}-${boundary.index}-${segmentIndex}`"
         class="resize-handle"
         :class="{
@@ -33,6 +34,7 @@
     <!-- Resize handles for each row boundary -->
     <div
       v-for="(rowBoundary, rowBoundaryIndex) in resizableRowBoundaries"
+      v-show="!dragState"
       :key="`row-handle-${rowBoundary.i}`"
       class="resize-handle resize-handle--row"
       :class="{
@@ -78,6 +80,8 @@ const emit = defineEmits(['resize-start', 'resize-move', 'resize-end', 'resize-s
 
 const overlayEl = ref(null);
 const overlayRect = ref(null);
+const tableScreenWidth = computed(() => `${overlayRect.value?.width ?? 0}px`);
+const tableScreenHeight = computed(() => `${overlayRect.value?.height ?? 0}px`);
 const isViewingMode = () => props.editor?.options?.documentMode === 'viewing';
 /**
  * Parsed table metadata from data-table-boundaries attribute
@@ -225,12 +229,6 @@ const RESIZE_HANDLE_HEIGHT_PX = 9;
  */
 const RESIZE_HANDLE_OFFSET_PX = 4;
 
-/** Extension added to overlay width during drag for smooth mouse tracking */
-const DRAG_OVERLAY_EXTENSION_PX = 1000;
-
-/** Minimum overlay width during drag operations */
-const MIN_DRAG_OVERLAY_WIDTH_PX = 2000;
-
 /** Throttle interval for mouse move events (60fps = ~16.67ms) */
 const THROTTLE_INTERVAL_MS = 16;
 
@@ -244,6 +242,36 @@ const MIN_RESIZE_DELTA_PX = 1;
 let rafId = null;
 let isUnmounted = false;
 
+function removeInteractionCancelListeners() {
+  window.removeEventListener('blur', onInteractionCancel);
+  document.removeEventListener('visibilitychange', onInteractionCancel);
+}
+
+function cancelActiveResizeDrag() {
+  if (!dragState.value && !rowDragState.value) return;
+
+  forcedCleanup.value = true;
+  if (dragState.value) {
+    onDocumentMouseUp(new MouseEvent('mouseup'));
+  }
+  if (rowDragState.value) {
+    onRowDocumentMouseUp();
+  }
+  forcedCleanup.value = false;
+}
+
+function onInteractionCancel(event) {
+  if (!dragState.value && !rowDragState.value) return;
+  if (event?.type === 'visibilitychange' && document.visibilityState === 'visible') {
+    return;
+  }
+  if (document.visibilityState && document.visibilityState !== 'visible') {
+    cancelActiveResizeDrag();
+    return;
+  }
+  cancelActiveResizeDrag();
+}
+
 /**
  * Starts continuous RAF-based tracking of the overlay position.
  *
@@ -288,25 +316,14 @@ const overlayStyle = computed(() => {
   if (!overlayRect.value || !props.tableElement) return {};
 
   const rect = overlayRect.value;
-
-  // During any drag operation, use a very large overlay to ensure smooth mouse tracking
-  // This prevents issues when the mouse moves beyond the original table bounds
-  let overlayWidth = rect.width;
-  let overlayHeight = rect.height;
   const isDragging = dragState.value || rowDragState.value;
-  if (dragState.value) {
-    overlayWidth = Math.max(rect.width + DRAG_OVERLAY_EXTENSION_PX, MIN_DRAG_OVERLAY_WIDTH_PX);
-  }
-  if (rowDragState.value) {
-    overlayHeight = Math.max(rect.height + DRAG_OVERLAY_EXTENSION_PX, MIN_DRAG_OVERLAY_WIDTH_PX);
-  }
 
   return {
     position: 'absolute',
     left: `${rect.left}px`,
     top: `${rect.top}px`,
-    width: `${overlayWidth}px`,
-    height: `${overlayHeight}px`,
+    width: `${rect.width}px`,
+    height: `${rect.height}px`,
     pointerEvents: isDragging ? 'auto' : 'none',
     zIndex: 10,
   };
@@ -530,7 +547,7 @@ function getSegmentHandleStyle(boundary, segment) {
     left: `${scaledX}px`,
     top: scaledY != null ? `${scaledY}px` : '0',
     width: `${RESIZE_HANDLE_WIDTH_PX}px`,
-    height: scaledH != null ? `${scaledH}px` : '100%',
+    height: scaledH != null ? `${scaledH}px` : tableScreenHeight.value,
     transform: `translateX(-${RESIZE_HANDLE_OFFSET_PX}px)`,
     cursor: 'col-resize',
     pointerEvents: 'auto',
@@ -558,7 +575,7 @@ const guidelineStyle = computed(() => {
     left: `${newX}px`,
     top: '0',
     width: '2px',
-    height: '100%',
+    height: tableScreenHeight.value,
     backgroundColor: '#4A90E2',
     pointerEvents: 'none',
     zIndex: 20,
@@ -578,7 +595,7 @@ function getRowHandleStyle(rowBoundary) {
     position: 'absolute',
     left: '0',
     top: `${scaledY}px`,
-    width: '100%',
+    width: tableScreenWidth.value,
     height: `${RESIZE_HANDLE_HEIGHT_PX}px`,
     transform: `translateY(-${RESIZE_HANDLE_OFFSET_PX}px)`,
     cursor: 'row-resize',
@@ -602,7 +619,7 @@ const rowGuidelineStyle = computed(() => {
     position: 'absolute',
     left: '0',
     top: `${newY}px`,
-    width: '100%',
+    width: tableScreenWidth.value,
     height: '2px',
     backgroundColor: '#4A90E2',
     pointerEvents: 'none',
@@ -776,6 +793,8 @@ function onHandleMouseDown(event, resizableBoundaryIndex) {
   try {
     document.addEventListener('mousemove', onDocumentMouseMove);
     document.addEventListener('mouseup', onDocumentMouseUp);
+    window.addEventListener('blur', onInteractionCancel);
+    document.addEventListener('visibilitychange', onInteractionCancel);
 
     emit('resize-start', {
       columnIndex: boundary.index,
@@ -903,26 +922,25 @@ function onDocumentMouseUp(event) {
   // Clean up event listeners and restore pointer events
   document.removeEventListener('mousemove', onDocumentMouseMove);
   document.removeEventListener('mouseup', onDocumentMouseUp);
+  removeInteractionCancelListeners();
 
   if (props.editor?.view?.dom) {
     const pmView = props.editor.view.dom;
     pmView.style.pointerEvents = 'auto';
   }
 
-  // Only dispatch transaction if:
-  // 1. Not a forced cleanup
-  // 2. Delta is significant (> MIN_RESIZE_DELTA_PX)
+  // Only dispatch transaction if not a forced cleanup and delta is significant
   if (!forcedCleanup.value && Math.abs(finalDelta) > MIN_RESIZE_DELTA_PX) {
     dispatchResizeTransaction(columnIndex, newWidths);
-
-    emit('resize-end', {
-      columnIndex,
-      finalWidths: newWidths,
-      delta: finalDelta,
-    });
   }
 
-  // Clear drag state
+  // Always emit resize-end so the parent can clear its dragging flag
+  emit('resize-end', {
+    columnIndex,
+    finalWidths: newWidths,
+    delta: finalDelta,
+  });
+
   dragState.value = null;
 }
 
@@ -1145,6 +1163,8 @@ function onRowHandleMouseDown(event, rowBoundaryIndex) {
 
   document.addEventListener('mousemove', onRowDocumentMouseMove);
   document.addEventListener('mouseup', onRowDocumentMouseUp);
+  window.addEventListener('blur', onInteractionCancel);
+  document.addEventListener('visibilitychange', onInteractionCancel);
 
   emit('resize-start', { rowIndex: rowBoundary.i });
 }
@@ -1180,6 +1200,7 @@ function onRowDocumentMouseUp() {
 
   document.removeEventListener('mousemove', onRowDocumentMouseMove);
   document.removeEventListener('mouseup', onRowDocumentMouseUp);
+  removeInteractionCancelListeners();
 
   if (props.editor?.view?.dom) {
     props.editor.view.dom.style.pointerEvents = 'auto';
@@ -1187,9 +1208,11 @@ function onRowDocumentMouseUp() {
 
   if (!forcedCleanup.value && Math.abs(finalDelta) > MIN_RESIZE_DELTA_PX) {
     dispatchRowResizeTransaction(rowIndex, newHeight);
-    emit('resize-end', { rowIndex, newHeight, delta: finalDelta });
   }
 
+  // Always emit resize-end so the parent can clear its dragging flag
+  emit('resize-end', { rowIndex, newHeight, delta: finalDelta });
+
   rowDragState.value = null;
 }
 
@@ -1299,16 +1322,7 @@ watch(
     } else {
       stopOverlayTracking();
       // Clean up drag state if overlay is hidden
-      if (dragState.value) {
-        forcedCleanup.value = true;
-        onDocumentMouseUp(new MouseEvent('mouseup'));
-        forcedCleanup.value = false;
-      }
-      if (rowDragState.value) {
-        forcedCleanup.value = true;
-        onRowDocumentMouseUp();
-        forcedCleanup.value = false;
-      }
+      cancelActiveResizeDrag();
     }
   },
 );
@@ -1346,6 +1360,7 @@ onBeforeUnmount(() => {
     props.editor.view.dom.style.pointerEvents = 'auto';
   }
 
+  removeInteractionCancelListeners();
   window.removeEventListener('scroll', updateOverlayRect, true);
   window.removeEventListener('resize', updateOverlayRect);
 });
@@ -1398,20 +1413,20 @@ onBeforeUnmount(() => {
 .resize-handle--row::before {
   left: 0;
   top: 50%;
-  width: 100%;
+  width: inherit;
   height: 2px;
   transform: translateY(-1px);
 }
 
 .resize-handle--row:hover::before {
   height: 3px;
-  width: 100%;
+  width: inherit;
   transform: translateY(-1.5px);
 }
 
 .resize-handle--row.resize-handle--active::before {
   height: 2px;
-  width: 100%;
+  width: inherit;
   transform: translateY(-1px);
 }
 
diff --git a/tests/behavior/tests/tables/resize.spec.ts b/tests/behavior/tests/tables/resize.spec.ts
index 744b1fe129..60478ad769 100644
--- a/tests/behavior/tests/tables/resize.spec.ts
+++ b/tests/behavior/tests/tables/resize.spec.ts
@@ -114,3 +114,47 @@ test('resize the table by dragging the right edge', async ({ superdoc }) => {
   const grid = await getTableGrid(superdoc.page);
   expect(grid).toHaveLength(3);
 });
+
+test('row handles are hidden during column resize drag (SD-2094)', async ({ superdoc }) => {
+  await superdoc.executeCommand('insertTable', { rows: 3, cols: 3, withHeaderRow: false });
+  await superdoc.waitForStable();
+
+  await superdoc.type('Hello');
+  await superdoc.waitForStable();
+
+  // Hover the first column boundary to make the resize overlay appear
+  await hoverColumnBoundary(superdoc.page, 0);
+  await superdoc.waitForStable();
+
+  const handle = superdoc.page.locator('.resize-handle[data-boundary-type="inner"]').first();
+  await expect(handle).toBeAttached({ timeout: 5000 });
+
+  // Start dragging — hold mouse down and move incrementally
+  const box = await handle.boundingBox();
+  if (!box) throw new Error('Resize handle not visible');
+  const x = box.x + box.width / 2;
+  const y = box.y + box.height / 2;
+
+  await superdoc.page.mouse.move(x, y);
+  await superdoc.page.mouse.down();
+  // Move a small amount to activate drag state
+  await superdoc.page.mouse.move(x + 10, y);
+  await superdoc.page.waitForTimeout(50);
+
+  await superdoc.snapshot('during column drag — row handles should be hidden');
+
+  // Verify drag is active by checking for the guideline
+  const guideline = superdoc.page.locator('.resize-guideline');
+  await expect(guideline).toBeAttached({ timeout: 5000 });
+
+  // Row handles should be hidden (v-show) during column drag
+  const rowHandles = superdoc.page.locator('.resize-handle--row');
+  const rowCount = await rowHandles.count();
+  expect(rowCount).toBeGreaterThan(0);
+  for (let i = 0; i < rowCount; i++) {
+    await expect(rowHandles.nth(i)).toBeHidden();
+  }
+
+  await superdoc.page.mouse.up();
+  await superdoc.waitForStable();
+});
diff --git a/tests/behavior/tests/tables/row-resize.spec.ts b/tests/behavior/tests/tables/row-resize.spec.ts
index f3bdf83b0a..7bba74dfab 100644
--- a/tests/behavior/tests/tables/row-resize.spec.ts
+++ b/tests/behavior/tests/tables/row-resize.spec.ts
@@ -158,3 +158,43 @@ test('row boundary is not resizable at rowspan-merged rows', async ({ superdoc }
   expect(row1).toBeDefined();
   expect(row1!.resizable).toBe(1);
 });
+
+test('column handles are hidden during row resize drag (SD-2094)', async ({ superdoc }) => {
+  await superdoc.executeCommand('insertTable', { rows: 3, cols: 3, withHeaderRow: false });
+  await superdoc.waitForStable();
+
+  await superdoc.type('Hello');
+  await superdoc.waitForStable();
+
+  // Hover the first row boundary to show the resize overlay
+  await hoverRowBoundary(superdoc.page, 0);
+  await superdoc.waitForStable();
+
+  const handle = superdoc.page.locator('.resize-handle--row').first();
+  await expect(handle).toBeAttached({ timeout: 5000 });
+
+  // Start dragging — hold mouse down and move incrementally
+  const box = await handle.boundingBox();
+  if (!box) throw new Error('Row resize handle not visible');
+  const x = box.x + box.width / 2;
+  const y = box.y + box.height / 2;
+
+  await superdoc.page.mouse.move(x, y);
+  await superdoc.page.mouse.down();
+  // Move a small amount to activate drag state
+  await superdoc.page.mouse.move(x, y + 10);
+  await superdoc.page.waitForTimeout(50);
+
+  await superdoc.snapshot('during row drag — column handles should be hidden');
+
+  // Column handles should be hidden (v-show) during row drag
+  const colHandles = superdoc.page.locator('.resize-handle[data-boundary-type]');
+  const colCount = await colHandles.count();
+  expect(colCount).toBeGreaterThan(0);
+  for (let i = 0; i < colCount; i++) {
+    await expect(colHandles.nth(i)).toBeHidden();
+  }
+
+  await superdoc.page.mouse.up();
+  await superdoc.waitForStable();
+});