@mindexec/cli 0.2.476 → 0.2.478

package/wwwroot/_content/MindExecution.Shared/js/mind-map-multi-select.js

@@ -4,55 +4,55 @@
     'use strict';
 
     let _module = null;
-    let multiSelectOverlay = null;
-    let multiSelectMenu = null;
-    let singleImageOverlay = null;
-    let currentBounds = null;
+    let multiSelectOverlay = null;
+    let multiSelectMenu = null;
+    let singleImageOverlay = null;
+    let currentBounds = null;
     let isResizing = false;
     let resizeHandle = null;
     let resizeStartBounds = null;
     let resizeStartMouse = null;
     let initialNodeSizes = new Map(); // Store initial sizes for proportional scaling
 
-    const SINGLE_IMAGE_HANDLE_SIZE = 10;
-    const MULTI_SELECT_SCREEN_PADDING_PX = 10;
-
-    // ▼▼▼ [Perf] Throttling and caching for drag performance ▼▼▼
-    const UPDATE_THROTTLE_MS = 32; // ~30fps for overlay updates during drag
-    let lastUpdateTime = 0;
-    let cachedImageNodeIds = null; // Cached list of selected image node IDs
-    let isDragging = false; // Derived from module.isDraggingMultipleNodes
-    // ▲▲▲ [Perf] ▲▲▲
-
-    function setBrowserSelectionLock(active, reason) {
-        if (window.MindMapInteractions?.setBrowserSelectionLock) {
-            window.MindMapInteractions.setBrowserSelectionLock(active, reason || 'multi-select-resize');
-            return;
-        }
-
-        document?.body?.classList?.toggle?.('mindcanvas-browser-selection-locked', !!active);
-        document?.documentElement?.classList?.toggle?.('mindcanvas-browser-selection-locked', !!active);
-    }
-
-    function init(module) {
-        _module = module;
-        createMultiSelectOverlay();
-        createSingleImageOverlay();
-    }
-
-    function createMultiSelectOverlay() {
-        if (multiSelectOverlay?.isConnected) return;
-
-        // Create overlay container (absolutely positioned in 3D space via CSS3DObject)
-        multiSelectOverlay = document.createElement('div');
-        multiSelectOverlay.className = 'multi-select-overlay';
-        multiSelectOverlay.style.cssText = `
-            position: fixed;
-            pointer-events: none;
-            border: 2px dashed #2563eb;
-            background: rgba(37, 99, 235, 0.05);
-            border-radius: 8px;
-            display: none;
+    const SINGLE_IMAGE_HANDLE_SIZE = 10;
+    const MULTI_SELECT_SCREEN_PADDING_PX = 10;
+
+    // ▼▼▼ [Perf] Throttling and caching for drag performance ▼▼▼
+    const UPDATE_THROTTLE_MS = 32; // ~30fps for overlay updates during drag
+    let lastUpdateTime = 0;
+    let cachedImageNodeIds = null; // Cached list of selected image node IDs
+    let isDragging = false; // Derived from module.isDraggingMultipleNodes
+    // ▲▲▲ [Perf] ▲▲▲
+
+    function setBrowserSelectionLock(active, reason) {
+        if (window.MindMapInteractions?.setBrowserSelectionLock) {
+            window.MindMapInteractions.setBrowserSelectionLock(active, reason || 'multi-select-resize');
+            return;
+        }
+
+        document?.body?.classList?.toggle?.('mindcanvas-browser-selection-locked', !!active);
+        document?.documentElement?.classList?.toggle?.('mindcanvas-browser-selection-locked', !!active);
+    }
+
+    function init(module) {
+        _module = module;
+        createMultiSelectOverlay();
+        createSingleImageOverlay();
+    }
+
+    function createMultiSelectOverlay() {
+        if (multiSelectOverlay?.isConnected) return;
+
+        // Create overlay container (absolutely positioned in 3D space via CSS3DObject)
+        multiSelectOverlay = document.createElement('div');
+        multiSelectOverlay.className = 'multi-select-overlay';
+        multiSelectOverlay.style.cssText = `
+            position: fixed;
+            pointer-events: none;
+            border: 2px dashed #2563eb;
+            background: rgba(37, 99, 235, 0.05);
+            border-radius: 8px;
+            display: none;
             z-index: 1000;
         `;
 
@@ -105,59 +105,59 @@
         // Initial empty menu - will be updated by updateMenuButtons()
 
         multiSelectOverlay.appendChild(multiSelectMenu);
-
-        // Append to body (will be positioned in screen space)
-        document.body.appendChild(multiSelectOverlay);
-    }
-
-    function createSingleImageOverlay() {
-        if (singleImageOverlay?.isConnected) return;
-
-        singleImageOverlay = document.createElement('div');
-        singleImageOverlay.className = 'single-image-selection-overlay';
-        singleImageOverlay.style.cssText = `
-            position: fixed;
-            pointer-events: none;
-            background: transparent;
-            box-sizing: border-box;
-            outline: 1px dashed #2563eb;
-            outline-offset: 1px;
-            display: none;
-            visibility: hidden;
-            z-index: 999;
-        `;
-
-        const corners = ['nw', 'ne', 'sw', 'se'];
-        const handleOffset = SINGLE_IMAGE_HANDLE_SIZE / 2;
-        corners.forEach(corner => {
-            const handle = document.createElement('div');
-            handle.className = `single-image-selection-handle-${corner}`;
-            handle.style.cssText = `
-                position: absolute;
-                width: ${SINGLE_IMAGE_HANDLE_SIZE}px;
-                height: ${SINGLE_IMAGE_HANDLE_SIZE}px;
-                background: #2563eb;
-                pointer-events: none;
-            `;
-
-            if (corner.includes('n')) handle.style.top = `${-handleOffset}px`;
-            if (corner.includes('s')) handle.style.bottom = `${-handleOffset}px`;
-            if (corner.includes('w')) handle.style.left = `${-handleOffset}px`;
-            if (corner.includes('e')) handle.style.right = `${-handleOffset}px`;
-
-            singleImageOverlay.appendChild(handle);
-        });
-
-        document.body.appendChild(singleImageOverlay);
-    }
+
+        // Append to body (will be positioned in screen space)
+        document.body.appendChild(multiSelectOverlay);
+    }
+
+    function createSingleImageOverlay() {
+        if (singleImageOverlay?.isConnected) return;
+
+        singleImageOverlay = document.createElement('div');
+        singleImageOverlay.className = 'single-image-selection-overlay';
+        singleImageOverlay.style.cssText = `
+            position: fixed;
+            pointer-events: none;
+            background: transparent;
+            box-sizing: border-box;
+            outline: 1px dashed #2563eb;
+            outline-offset: 1px;
+            display: none;
+            visibility: hidden;
+            z-index: 999;
+        `;
+
+        const corners = ['nw', 'ne', 'sw', 'se'];
+        const handleOffset = SINGLE_IMAGE_HANDLE_SIZE / 2;
+        corners.forEach(corner => {
+            const handle = document.createElement('div');
+            handle.className = `single-image-selection-handle-${corner}`;
+            handle.style.cssText = `
+                position: absolute;
+                width: ${SINGLE_IMAGE_HANDLE_SIZE}px;
+                height: ${SINGLE_IMAGE_HANDLE_SIZE}px;
+                background: #2563eb;
+                pointer-events: none;
+            `;
+
+            if (corner.includes('n')) handle.style.top = `${-handleOffset}px`;
+            if (corner.includes('s')) handle.style.bottom = `${-handleOffset}px`;
+            if (corner.includes('w')) handle.style.left = `${-handleOffset}px`;
+            if (corner.includes('e')) handle.style.right = `${-handleOffset}px`;
+
+            singleImageOverlay.appendChild(handle);
+        });
+
+        document.body.appendChild(singleImageOverlay);
+    }
 
     // Resize move/end are handled by MindMapInteractions (centralized)
 
     function showMultiSelectBounds(selectedImageNodeIds) {
         if (!_module || selectedImageNodeIds.length < 2) {
-            hide();
-            return;
-        }
+            hide();
+            return;
+        }
 
         // Calculate bounding box of selected nodes
         let minX = Infinity, minY = Infinity, maxX = -Infinity, maxY = -Infinity;
@@ -182,12 +182,12 @@
         });
 
         if (minX === Infinity) {
-            hide();
-            return;
-        }
+            hide();
+            return;
+        }
 
         // Add padding
-        const padding = 10;
+        const padding = 10;
         minX -= padding;
         minY -= padding;
         maxX += padding;
@@ -212,86 +212,86 @@
             }
         });
 
-        // Convert node bounds to screen coordinates
-        updateOverlayPosition(selectedImageNodeIds);
-        multiSelectOverlay.style.display = 'block';
-        multiSelectOverlay.style.visibility = 'visible';
-    }
-
-    function getNodeScreenRect(nodeEntry) {
-        if (!nodeEntry || !_module) return null;
-
-        if (nodeEntry.currentType === 'CSS') {
-            const element = nodeEntry.cssObject?.element;
-            if (element?.isConnected) {
-                const rect = element.getBoundingClientRect();
-                if (Number.isFinite(rect.width) && Number.isFinite(rect.height) && rect.width > 0 && rect.height > 0) {
-                    return {
-                        left: rect.left,
-                        top: rect.top,
-                        right: rect.right,
-                        bottom: rect.bottom
-                    };
-                }
-            }
-        }
-
-        const obj = nodeEntry.glObject || nodeEntry.cssObject;
-        if (!obj || !_module.camera || !_module.container) return null;
-
-        const width = Math.max(1, Number(obj.userData?.worldWidth || nodeEntry.model?.width || 0) || 1);
-        const height = Math.max(1, Number(obj.userData?.worldHeight || nodeEntry.model?.height || 0) || 1);
-        const topLeft = worldToScreen(obj.position.x, obj.position.y, _module.camera, _module.container);
-        const bottomRight = worldToScreen(obj.position.x + width, obj.position.y - height, _module.camera, _module.container);
-        const left = Math.min(topLeft.x, bottomRight.x);
-        const top = Math.min(topLeft.y, bottomRight.y);
-        const right = Math.max(topLeft.x, bottomRight.x);
-        const bottom = Math.max(topLeft.y, bottomRight.y);
-
-        if (![left, top, right, bottom].every(Number.isFinite)) return null;
-
-        return { left, top, right, bottom };
-    }
-
-    function applyOverlayRect(left, top, right, bottom) {
-        multiSelectOverlay.style.left = `${left}px`;
-        multiSelectOverlay.style.top = `${top}px`;
-        multiSelectOverlay.style.width = `${Math.max(0, right - left)}px`;
-        multiSelectOverlay.style.height = `${Math.max(0, bottom - top)}px`;
-    }
-
-    function updateOverlayPosition(selectedNodeIds = null, forceWorldProjection = false) {
-        if (!currentBounds || !_module || !_module.camera || !_module.container) return;
-
-        if (!forceWorldProjection && Array.isArray(selectedNodeIds) && selectedNodeIds.length > 0) {
-            let minLeft = Infinity;
-            let minTop = Infinity;
-            let maxRight = -Infinity;
-            let maxBottom = -Infinity;
-
-            selectedNodeIds.forEach(nodeId => {
-                const rect = getNodeScreenRect(_module.nodeObjectsById.get(nodeId));
-                if (!rect) return;
-
-                minLeft = Math.min(minLeft, rect.left);
-                minTop = Math.min(minTop, rect.top);
-                maxRight = Math.max(maxRight, rect.right);
-                maxBottom = Math.max(maxBottom, rect.bottom);
-            });
-
-            if (minLeft !== Infinity) {
-                applyOverlayRect(
-                    minLeft - MULTI_SELECT_SCREEN_PADDING_PX,
-                    minTop - MULTI_SELECT_SCREEN_PADDING_PX,
-                    maxRight + MULTI_SELECT_SCREEN_PADDING_PX,
-                    maxBottom + MULTI_SELECT_SCREEN_PADDING_PX
-                );
-                return;
-            }
-        }
-
-        const camera = _module.camera;
-        const container = _module.container;
+        // Convert node bounds to screen coordinates
+        updateOverlayPosition(selectedImageNodeIds);
+        multiSelectOverlay.style.display = 'block';
+        multiSelectOverlay.style.visibility = 'visible';
+    }
+
+    function getNodeScreenRect(nodeEntry) {
+        if (!nodeEntry || !_module) return null;
+
+        if (nodeEntry.currentType === 'CSS') {
+            const element = nodeEntry.cssObject?.element;
+            if (element?.isConnected) {
+                const rect = element.getBoundingClientRect();
+                if (Number.isFinite(rect.width) && Number.isFinite(rect.height) && rect.width > 0 && rect.height > 0) {
+                    return {
+                        left: rect.left,
+                        top: rect.top,
+                        right: rect.right,
+                        bottom: rect.bottom
+                    };
+                }
+            }
+        }
+
+        const obj = nodeEntry.glObject || nodeEntry.cssObject;
+        if (!obj || !_module.camera || !_module.container) return null;
+
+        const width = Math.max(1, Number(obj.userData?.worldWidth || nodeEntry.model?.width || 0) || 1);
+        const height = Math.max(1, Number(obj.userData?.worldHeight || nodeEntry.model?.height || 0) || 1);
+        const topLeft = worldToScreen(obj.position.x, obj.position.y, _module.camera, _module.container);
+        const bottomRight = worldToScreen(obj.position.x + width, obj.position.y - height, _module.camera, _module.container);
+        const left = Math.min(topLeft.x, bottomRight.x);
+        const top = Math.min(topLeft.y, bottomRight.y);
+        const right = Math.max(topLeft.x, bottomRight.x);
+        const bottom = Math.max(topLeft.y, bottomRight.y);
+
+        if (![left, top, right, bottom].every(Number.isFinite)) return null;
+
+        return { left, top, right, bottom };
+    }
+
+    function applyOverlayRect(left, top, right, bottom) {
+        multiSelectOverlay.style.left = `${left}px`;
+        multiSelectOverlay.style.top = `${top}px`;
+        multiSelectOverlay.style.width = `${Math.max(0, right - left)}px`;
+        multiSelectOverlay.style.height = `${Math.max(0, bottom - top)}px`;
+    }
+
+    function updateOverlayPosition(selectedNodeIds = null, forceWorldProjection = false) {
+        if (!currentBounds || !_module || !_module.camera || !_module.container) return;
+
+        if (!forceWorldProjection && Array.isArray(selectedNodeIds) && selectedNodeIds.length > 0) {
+            let minLeft = Infinity;
+            let minTop = Infinity;
+            let maxRight = -Infinity;
+            let maxBottom = -Infinity;
+
+            selectedNodeIds.forEach(nodeId => {
+                const rect = getNodeScreenRect(_module.nodeObjectsById.get(nodeId));
+                if (!rect) return;
+
+                minLeft = Math.min(minLeft, rect.left);
+                minTop = Math.min(minTop, rect.top);
+                maxRight = Math.max(maxRight, rect.right);
+                maxBottom = Math.max(maxBottom, rect.bottom);
+            });
+
+            if (minLeft !== Infinity) {
+                applyOverlayRect(
+                    minLeft - MULTI_SELECT_SCREEN_PADDING_PX,
+                    minTop - MULTI_SELECT_SCREEN_PADDING_PX,
+                    maxRight + MULTI_SELECT_SCREEN_PADDING_PX,
+                    maxBottom + MULTI_SELECT_SCREEN_PADDING_PX
+                );
+                return;
+            }
+        }
+
+        const camera = _module.camera;
+        const container = _module.container;
 
         // Convert world corners to screen coordinates
         const topLeft = worldToScreen(currentBounds.minX, currentBounds.maxY, camera, container);
@@ -302,8 +302,8 @@
         const width = Math.abs(bottomRight.x - topLeft.x);
         const height = Math.abs(bottomRight.y - topLeft.y);
 
-        applyOverlayRect(left, top, left + width, top + height);
-    }
+        applyOverlayRect(left, top, left + width, top + height);
+    }
 
     function worldToScreen(worldX, worldY, camera, container) {
         const THREE = globalThis.THREE;
@@ -319,108 +319,108 @@
         };
     }
 
-    function hideSingleImageOverlay() {
-        if (singleImageOverlay) {
-            singleImageOverlay.style.display = 'none';
-            singleImageOverlay.style.visibility = 'hidden';
-        }
-    }
-
-    function getActiveSelectedNodeIds() {
-        if (!_module) return [];
-        if (_module.multiSelectedNodeIds?.size > 0) {
-            return Array.from(_module.multiSelectedNodeIds);
-        }
-        return _module.selectedNodeIdJs ? [_module.selectedNodeIdJs] : [];
-    }
-
-    function getSingleSelectedImageNodeId() {
-        const selectedIds = getActiveSelectedNodeIds();
-        if (selectedIds.length !== 1) return null;
-
-        const nodeId = selectedIds[0];
-        const nodeEntry = _module?.nodeObjectsById?.get(nodeId);
-        return nodeEntry?.model?.contentType === 'image' ? nodeId : null;
-    }
-
-    function updateSingleImageOverlay(forceWorldProjection = false) {
-        if (!_module || !singleImageOverlay || !_module.camera || !_module.container) return;
-
-        const nodeId = getSingleSelectedImageNodeId();
-        if (!nodeId) {
-            hideSingleImageOverlay();
-            return;
-        }
-
-        const nodeEntry = _module.nodeObjectsById.get(nodeId);
-        const obj = nodeEntry?.glObject || nodeEntry?.cssObject;
-        const model = nodeEntry?.model;
-        if (!obj || !model) {
-            hideSingleImageOverlay();
-            return;
-        }
-
-        // Camera-only motion must stay on the projection fast path. Reading the
-        // CSS node rect here can force layout and may still reflect the previous
-        // CSS3D camera transform when this overlay is updated in the same frame.
-        const screenRect = forceWorldProjection ? null : getNodeScreenRect(nodeEntry);
-        if (screenRect) {
-            const screenWidth = Math.max(0, screenRect.right - screenRect.left);
-            const screenHeight = Math.max(0, screenRect.bottom - screenRect.top);
-            if (screenWidth > 0 && screenHeight > 0) {
-                singleImageOverlay.style.left = `${screenRect.left}px`;
-                singleImageOverlay.style.top = `${screenRect.top}px`;
-                singleImageOverlay.style.width = `${screenWidth}px`;
-                singleImageOverlay.style.height = `${screenHeight}px`;
-                singleImageOverlay.style.display = 'block';
-                singleImageOverlay.style.visibility = 'visible';
-                return;
-            }
-        }
-
-        const x = obj.position.x;
-        const y = obj.position.y;
-        const width = Math.max(1, Number(model.width || obj.userData?.worldWidth || 0) || 1);
-        const height = Math.max(1, Number(model.height || obj.userData?.worldHeight || 0) || 1);
-
-        const topLeft = worldToScreen(x, y, _module.camera, _module.container);
-        const bottomRight = worldToScreen(x + width, y - height, _module.camera, _module.container);
-
-        const left = Math.min(topLeft.x, bottomRight.x);
-        const top = Math.min(topLeft.y, bottomRight.y);
-        const screenWidth = Math.abs(bottomRight.x - topLeft.x);
-        const screenHeight = Math.abs(bottomRight.y - topLeft.y);
-
-        if (![left, top, screenWidth, screenHeight].every(Number.isFinite) || screenWidth <= 0 || screenHeight <= 0) {
-            hideSingleImageOverlay();
-            return;
-        }
-
-        singleImageOverlay.style.left = `${left}px`;
-        singleImageOverlay.style.top = `${top}px`;
-        singleImageOverlay.style.width = `${screenWidth}px`;
-        singleImageOverlay.style.height = `${screenHeight}px`;
-        singleImageOverlay.style.display = 'block';
-        singleImageOverlay.style.visibility = 'visible';
-    }
-
-    function hide() {
-        if (multiSelectOverlay) {
-            multiSelectOverlay.style.display = 'none';
-            multiSelectOverlay.style.visibility = 'hidden';
-        }
-        hideSingleImageOverlay();
-        currentBounds = null;
-        initialNodeSizes.clear();
-    }
+    function hideSingleImageOverlay() {
+        if (singleImageOverlay) {
+            singleImageOverlay.style.display = 'none';
+            singleImageOverlay.style.visibility = 'hidden';
+        }
+    }
+
+    function getActiveSelectedNodeIds() {
+        if (!_module) return [];
+        if (_module.multiSelectedNodeIds?.size > 0) {
+            return Array.from(_module.multiSelectedNodeIds);
+        }
+        return _module.selectedNodeIdJs ? [_module.selectedNodeIdJs] : [];
+    }
+
+    function getSingleSelectedImageNodeId() {
+        const selectedIds = getActiveSelectedNodeIds();
+        if (selectedIds.length !== 1) return null;
+
+        const nodeId = selectedIds[0];
+        const nodeEntry = _module?.nodeObjectsById?.get(nodeId);
+        return nodeEntry?.model?.contentType === 'image' ? nodeId : null;
+    }
+
+    function updateSingleImageOverlay(forceWorldProjection = false) {
+        if (!_module || !singleImageOverlay || !_module.camera || !_module.container) return;
+
+        const nodeId = getSingleSelectedImageNodeId();
+        if (!nodeId) {
+            hideSingleImageOverlay();
+            return;
+        }
+
+        const nodeEntry = _module.nodeObjectsById.get(nodeId);
+        const obj = nodeEntry?.glObject || nodeEntry?.cssObject;
+        const model = nodeEntry?.model;
+        if (!obj || !model) {
+            hideSingleImageOverlay();
+            return;
+        }
+
+        // Camera-only motion must stay on the projection fast path. Reading the
+        // CSS node rect here can force layout and may still reflect the previous
+        // CSS3D camera transform when this overlay is updated in the same frame.
+        const screenRect = forceWorldProjection ? null : getNodeScreenRect(nodeEntry);
+        if (screenRect) {
+            const screenWidth = Math.max(0, screenRect.right - screenRect.left);
+            const screenHeight = Math.max(0, screenRect.bottom - screenRect.top);
+            if (screenWidth > 0 && screenHeight > 0) {
+                singleImageOverlay.style.left = `${screenRect.left}px`;
+                singleImageOverlay.style.top = `${screenRect.top}px`;
+                singleImageOverlay.style.width = `${screenWidth}px`;
+                singleImageOverlay.style.height = `${screenHeight}px`;
+                singleImageOverlay.style.display = 'block';
+                singleImageOverlay.style.visibility = 'visible';
+                return;
+            }
+        }
+
+        const x = obj.position.x;
+        const y = obj.position.y;
+        const width = Math.max(1, Number(model.width || obj.userData?.worldWidth || 0) || 1);
+        const height = Math.max(1, Number(model.height || obj.userData?.worldHeight || 0) || 1);
+
+        const topLeft = worldToScreen(x, y, _module.camera, _module.container);
+        const bottomRight = worldToScreen(x + width, y - height, _module.camera, _module.container);
+
+        const left = Math.min(topLeft.x, bottomRight.x);
+        const top = Math.min(topLeft.y, bottomRight.y);
+        const screenWidth = Math.abs(bottomRight.x - topLeft.x);
+        const screenHeight = Math.abs(bottomRight.y - topLeft.y);
+
+        if (![left, top, screenWidth, screenHeight].every(Number.isFinite) || screenWidth <= 0 || screenHeight <= 0) {
+            hideSingleImageOverlay();
+            return;
+        }
+
+        singleImageOverlay.style.left = `${left}px`;
+        singleImageOverlay.style.top = `${top}px`;
+        singleImageOverlay.style.width = `${screenWidth}px`;
+        singleImageOverlay.style.height = `${screenHeight}px`;
+        singleImageOverlay.style.display = 'block';
+        singleImageOverlay.style.visibility = 'visible';
+    }
+
+    function hide() {
+        if (multiSelectOverlay) {
+            multiSelectOverlay.style.display = 'none';
+            multiSelectOverlay.style.visibility = 'hidden';
+        }
+        hideSingleImageOverlay();
+        currentBounds = null;
+        initialNodeSizes.clear();
+    }
 
     function onResizeStart(e) {
         e.stopPropagation();
         e.preventDefault();
 
-        isResizing = true;
-        setBrowserSelectionLock(true, 'resize');
-        resizeHandle = e.target.dataset.corner;
+        isResizing = true;
+        setBrowserSelectionLock(true, 'resize');
+        resizeHandle = e.target.dataset.corner;
         resizeStartBounds = { ...currentBounds };
         resizeStartMouse = { x: e.clientX, y: e.clientY };
 
@@ -464,8 +464,8 @@
             return;
         }
 
-        currentBounds = newBounds;
-        updateOverlayPosition(null, true);
+        currentBounds = newBounds;
+        updateOverlayPosition(null, true);
 
         // Scale and reposition selected nodes proportionally
         scaleSelectedNodes();
@@ -474,9 +474,9 @@
     function onResizeEnd(e) {
         if (!isResizing) return;
 
-        isResizing = false;
-        setBrowserSelectionLock(false, 'resize');
-        resizeHandle = null;
+        isResizing = false;
+        setBrowserSelectionLock(false, 'resize');
+        resizeHandle = null;
         resizeStartBounds = null;
         resizeStartMouse = null;
         multiSelectOverlay.style.cursor = '';
@@ -584,9 +584,9 @@
             case 'stack':
                 await mergeSelectedImagesIntoStack();
                 break;
-            case 'expand':
-                await fitTextNodesToContentAndReflowY(selectedIds);
-                break;
+            case 'expand':
+                await fitTextNodesToContentAndReflowY(selectedIds);
+                break;
             case 'delete':
                 deleteSelectedNodes(selectedIds);
                 break;
@@ -594,9 +594,9 @@
     }
 
     // ▼▼▼ [New] Supported node types for multi-select ▼▼▼
-    const SUPPORTED_TYPES = ['image', 'text', 'markdown', 'note', 'code'];
-    const TEXT_TYPES = ['text', 'markdown', 'note', 'code'];
-    const TEXT_FIT_MAX_HEIGHT = 12000;
+    const SUPPORTED_TYPES = ['image', 'text', 'markdown', 'note', 'code'];
+    const TEXT_TYPES = ['text', 'markdown', 'note', 'code'];
+    const TEXT_FIT_MAX_HEIGHT = 12000;
     // ▲▲▲ [New] ▲▲▲
 
     function getSelectedNodeIds() {
@@ -766,12 +766,12 @@
                 .catch(err => console.warn('[MultiSelect] Failed to refresh node after tidy:', item.nodeId, err));
         });
 
-        if (_module.markLODPositionsDirty) {
-            _module.markLODPositionsDirty(selectedIds);
-        }
-        if (resized.length > 0 && _module.markLODDirty) {
-            _module.markLODDirty('update-node', resized.map(item => item.nodeId));
-        }
+        if (_module.markLODPositionsDirty) {
+            _module.markLODPositionsDirty(selectedIds);
+        }
+        if (resized.length > 0 && _module.markLODDirty) {
+            _module.markLODDirty('update-node', resized.map(item => item.nodeId));
+        }
         if (_module.updateVisibility && _module.camera) {
             _module.updateVisibility(_module.camera);
         }
@@ -824,17 +824,17 @@
             if (!result) return;
 
             const removedIds = result.removedNodeIds || result.RemovedNodeIds || [];
-            removedIds.forEach(nodeId => {
-                if (!nodeId) return;
-                if (_module.multiSelectedNodeIds?.delete) {
-                    _module.multiSelectedNodeIds.delete(nodeId);
-                }
-            });
-            if (window.MindMapNodes?.removeNodes) {
-                window.MindMapNodes.removeNodes(_module, removedIds);
-            } else {
-                removedIds.forEach(nodeId => window.MindMapNodes?.removeNode?.(_module, nodeId));
-            }
+            removedIds.forEach(nodeId => {
+                if (!nodeId) return;
+                if (_module.multiSelectedNodeIds?.delete) {
+                    _module.multiSelectedNodeIds.delete(nodeId);
+                }
+            });
+            if (window.MindMapNodes?.removeNodes) {
+                window.MindMapNodes.removeNodes(_module, removedIds);
+            } else {
+                removedIds.forEach(nodeId => window.MindMapNodes?.removeNode?.(_module, nodeId));
+            }
 
             const primaryNodeId = result.primaryNodeId || result.PrimaryNodeId || null;
             if (primaryNodeId) {
@@ -858,33 +858,33 @@
 
     function copySelectedNodes(selectedIds) {
         // Copy nodes to clipboard (as internal format)
-        const copiedNodes = [];
-        selectedIds.forEach(nodeId => {
-            const nodeEntry = _module.nodeObjectsById.get(nodeId);
-            if (nodeEntry?.model) {
-                const model = nodeEntry.model;
-                copiedNodes.push({
-                    contentType: model.contentType,
-                    prompt: model.prompt,
-                    response: model.response,
-                    width: model.width,
-                    height: model.height,
-                    positionX: model.positionX,
-                    positionY: model.positionY,
-                    positionZ: model.positionZ,
-                    isAiEnabled: model.isAiEnabled !== false,
-                    isWordWrap: !!model.isWordWrap,
-                    isChunkedText: model.isChunkedText,
-                    totalLineCount: model.totalLineCount,
-                    sourceFilePath: model.sourceFilePath,
-                    scrollOffset: model.scrollOffset,
-                    maxScroll: model.maxScroll,
-                    isExpanded: !!model.isExpanded,
-                    originalHeight: model.originalHeight,
-                    metadata: model.metadata
-                });
-            }
-        });
+        const copiedNodes = [];
+        selectedIds.forEach(nodeId => {
+            const nodeEntry = _module.nodeObjectsById.get(nodeId);
+            if (nodeEntry?.model) {
+                const model = nodeEntry.model;
+                copiedNodes.push({
+                    contentType: model.contentType,
+                    prompt: model.prompt,
+                    response: model.response,
+                    width: model.width,
+                    height: model.height,
+                    positionX: model.positionX,
+                    positionY: model.positionY,
+                    positionZ: model.positionZ,
+                    isAiEnabled: model.isAiEnabled !== false,
+                    isWordWrap: !!model.isWordWrap,
+                    isChunkedText: model.isChunkedText,
+                    totalLineCount: model.totalLineCount,
+                    sourceFilePath: model.sourceFilePath,
+                    scrollOffset: model.scrollOffset,
+                    maxScroll: model.maxScroll,
+                    isExpanded: !!model.isExpanded,
+                    originalHeight: model.originalHeight,
+                    metadata: model.metadata
+                });
+            }
+        });
 
         _module.copiedNodes = copiedNodes;
         _module.copiedNodesTimestamp = Date.now();
@@ -902,73 +902,73 @@
         console.log(`[MultiSelect] Copied ${copiedNodes.length} nodes`);
     }
 
-    function readCssPixelValue(value) {
-        const parsed = Number.parseFloat(String(value || '0'));
-        return Number.isFinite(parsed) ? parsed : 0;
-    }
-
-    function getVerticalBoxExtras(element) {
-        if (!element || typeof window === 'undefined' || !window.getComputedStyle) return 0;
-
-        const computed = window.getComputedStyle(element);
-        return readCssPixelValue(computed.paddingTop)
-            + readCssPixelValue(computed.paddingBottom)
-            + readCssPixelValue(computed.borderTopWidth)
-            + readCssPixelValue(computed.borderBottomWidth);
-    }
-
-    function getVerticalMargins(element) {
-        if (!element || typeof window === 'undefined' || !window.getComputedStyle) return 0;
-
-        const computed = window.getComputedStyle(element);
-        return readCssPixelValue(computed.marginTop) + readCssPixelValue(computed.marginBottom);
-    }
-
-    function forceNaturalBlockHeight(element, preserveScrollMetrics = false) {
-        if (!element?.style) return;
-
-        element.style.setProperty('height', 'auto', 'important');
-        element.style.setProperty('min-height', '0', 'important');
-        element.style.setProperty('max-height', 'none', 'important');
-        element.style.setProperty('flex', '0 0 auto', 'important');
-
-        if (preserveScrollMetrics) {
-            // Keep scrollbar-gutter and right padding active so wrapping matches the real CSS3D node.
-            element.style.setProperty('overflow-x', 'hidden', 'important');
-            element.style.setProperty('overflow-y', 'auto', 'important');
-        } else {
-            element.style.setProperty('overflow', 'visible', 'important');
-            element.style.setProperty('overflow-y', 'visible', 'important');
-        }
-    }
-
-    function measureOuterHeight(element, preferScrollHeight = false) {
-        if (!element) return 0;
-
-        let height = 0;
-        const push = (value) => {
-            const numeric = Number(value);
-            if (Number.isFinite(numeric) && numeric > height) {
-                height = numeric;
-            }
-        };
-
-        if (typeof element.getBoundingClientRect === 'function') {
-            push(element.getBoundingClientRect().height);
-        }
-        push(element.offsetHeight);
-        push(element.clientHeight);
-        if (preferScrollHeight) {
-            push(element.scrollHeight);
-        }
-
-        return Math.ceil(height + getVerticalMargins(element));
-    }
-
-    function measureExpandedHeightFromCssDom(nodeEntry, extraBuffer = 0) {
-        const wrapper = nodeEntry?.cssObject?.element;
-        const source = wrapper?.firstElementChild;
-        if (!source || typeof document === 'undefined') return null;
+    function readCssPixelValue(value) {
+        const parsed = Number.parseFloat(String(value || '0'));
+        return Number.isFinite(parsed) ? parsed : 0;
+    }
+
+    function getVerticalBoxExtras(element) {
+        if (!element || typeof window === 'undefined' || !window.getComputedStyle) return 0;
+
+        const computed = window.getComputedStyle(element);
+        return readCssPixelValue(computed.paddingTop)
+            + readCssPixelValue(computed.paddingBottom)
+            + readCssPixelValue(computed.borderTopWidth)
+            + readCssPixelValue(computed.borderBottomWidth);
+    }
+
+    function getVerticalMargins(element) {
+        if (!element || typeof window === 'undefined' || !window.getComputedStyle) return 0;
+
+        const computed = window.getComputedStyle(element);
+        return readCssPixelValue(computed.marginTop) + readCssPixelValue(computed.marginBottom);
+    }
+
+    function forceNaturalBlockHeight(element, preserveScrollMetrics = false) {
+        if (!element?.style) return;
+
+        element.style.setProperty('height', 'auto', 'important');
+        element.style.setProperty('min-height', '0', 'important');
+        element.style.setProperty('max-height', 'none', 'important');
+        element.style.setProperty('flex', '0 0 auto', 'important');
+
+        if (preserveScrollMetrics) {
+            // Keep scrollbar-gutter and right padding active so wrapping matches the real CSS3D node.
+            element.style.setProperty('overflow-x', 'hidden', 'important');
+            element.style.setProperty('overflow-y', 'auto', 'important');
+        } else {
+            element.style.setProperty('overflow', 'visible', 'important');
+            element.style.setProperty('overflow-y', 'visible', 'important');
+        }
+    }
+
+    function measureOuterHeight(element, preferScrollHeight = false) {
+        if (!element) return 0;
+
+        let height = 0;
+        const push = (value) => {
+            const numeric = Number(value);
+            if (Number.isFinite(numeric) && numeric > height) {
+                height = numeric;
+            }
+        };
+
+        if (typeof element.getBoundingClientRect === 'function') {
+            push(element.getBoundingClientRect().height);
+        }
+        push(element.offsetHeight);
+        push(element.clientHeight);
+        if (preferScrollHeight) {
+            push(element.scrollHeight);
+        }
+
+        return Math.ceil(height + getVerticalMargins(element));
+    }
+
+    function measureExpandedHeightFromCssDom(nodeEntry, extraBuffer = 0) {
+        const wrapper = nodeEntry?.cssObject?.element;
+        const source = wrapper?.firstElementChild;
+        if (!source || typeof document === 'undefined') return null;
 
         let probe = null;
         try {
@@ -997,56 +997,56 @@
                 boxSizing: 'border-box'
             });
 
-            const contentWrapper = probe.querySelector('.node-content-wrapper');
-            if (contentWrapper) {
-                forceNaturalBlockHeight(contentWrapper);
-                contentWrapper.style.display = 'block';
-            }
-
-            const contentSelectors = [
-                '[id^="node-response-"]',
-                '.node-response',
-                '.note-content',
-                '.markdown-body',
-                '.code-body',
-                '.code-body-content',
-                '.note-textarea',
-                'textarea'
-            ].join(', ');
-            const contentElements = Array.from(probe.querySelectorAll(contentSelectors));
-            contentElements.forEach(element => {
-                if (element.style) {
-                    element.style.display = element.tagName === 'TEXTAREA' ? 'block' : (element.style.display || 'block');
-                }
-                forceNaturalBlockHeight(element, true);
-            });
-
-            document.body.appendChild(probe);
-
-            const measuredWhole = Math.max(
-                measureOuterHeight(probe, true),
-                Math.ceil(probe.scrollHeight || 0)
-            );
-
-            let measuredByChildren = 0;
-            if (contentWrapper) {
-                measuredByChildren += getVerticalBoxExtras(probe);
-                measuredByChildren += getVerticalBoxExtras(contentWrapper);
-
-                Array.from(contentWrapper.children || []).forEach(child => {
-                    if (child instanceof HTMLElement && window.getComputedStyle(child).display === 'none') {
-                        return;
-                    }
-
-                    const isContent = child.matches?.(contentSelectors);
-                    measuredByChildren += measureOuterHeight(child, !!isContent);
-                });
-            }
-
-            const measured = Math.ceil(Math.max(measuredWhole, measuredByChildren));
-            if (!Number.isFinite(measured) || measured <= 0) return null;
-
-            return measured + Math.max(0, extraBuffer);
+            const contentWrapper = probe.querySelector('.node-content-wrapper');
+            if (contentWrapper) {
+                forceNaturalBlockHeight(contentWrapper);
+                contentWrapper.style.display = 'block';
+            }
+
+            const contentSelectors = [
+                '[id^="node-response-"]',
+                '.node-response',
+                '.note-content',
+                '.markdown-body',
+                '.code-body',
+                '.code-body-content',
+                '.note-textarea',
+                'textarea'
+            ].join(', ');
+            const contentElements = Array.from(probe.querySelectorAll(contentSelectors));
+            contentElements.forEach(element => {
+                if (element.style) {
+                    element.style.display = element.tagName === 'TEXTAREA' ? 'block' : (element.style.display || 'block');
+                }
+                forceNaturalBlockHeight(element, true);
+            });
+
+            document.body.appendChild(probe);
+
+            const measuredWhole = Math.max(
+                measureOuterHeight(probe, true),
+                Math.ceil(probe.scrollHeight || 0)
+            );
+
+            let measuredByChildren = 0;
+            if (contentWrapper) {
+                measuredByChildren += getVerticalBoxExtras(probe);
+                measuredByChildren += getVerticalBoxExtras(contentWrapper);
+
+                Array.from(contentWrapper.children || []).forEach(child => {
+                    if (child instanceof HTMLElement && window.getComputedStyle(child).display === 'none') {
+                        return;
+                    }
+
+                    const isContent = child.matches?.(contentSelectors);
+                    measuredByChildren += measureOuterHeight(child, !!isContent);
+                });
+            }
+
+            const measured = Math.ceil(Math.max(measuredWhole, measuredByChildren));
+            if (!Number.isFinite(measured) || measured <= 0) return null;
+
+            return measured + Math.max(0, extraBuffer);
         } catch {
             return null;
         } finally {
@@ -1056,334 +1056,334 @@
         }
     }
 
-    function getTextFitMinHeight(model) {
-        const contentType = String(model?.contentType || '').toLowerCase();
-        if (contentType === 'note') return 96;
-        if (contentType === 'code') return 120;
-        return 88;
-    }
-
-    async function measureTextFitHeight(nodeEntry) {
-        const model = nodeEntry?.model;
-        if (!model) return null;
-
-        const FIT_BUFFER = 18;
-        const minHeight = getTextFitMinHeight(model);
-
-        const domHeight = measureExpandedHeightFromCssDom(nodeEntry, FIT_BUFFER);
-        let factoryHeight = null;
-
-        if (window.MindMapTextureFactory?.measureHtmlHeightAsync) {
-            const zoomLevel = 2;
-            const measureModel = {
-                ...model,
-                response: model.response ?? model.Response ?? model.content ?? ''
-            };
-            const { height: measuredHeight } = await window.MindMapTextureFactory.measureHtmlHeightAsync(
-                measureModel,
-                zoomLevel,
-                (model.width || 400) * zoomLevel,
-                null,
-                TEXT_FIT_MAX_HEIGHT
-            );
-            factoryHeight = measuredHeight + FIT_BUFFER;
-        }
-
-        const requiredHeight = Math.max(
-            Number.isFinite(domHeight) ? domHeight : 0,
-            Number.isFinite(factoryHeight) ? factoryHeight : 0
-        );
-
-        if (!Number.isFinite(requiredHeight) || requiredHeight <= 0) {
-            return null;
-        }
-
-        return Math.min(TEXT_FIT_MAX_HEIGHT, Math.max(minHeight, Math.ceil(requiredHeight)));
-    }
-
-    function readRenderedTextOverflowAdjustment(item) {
-        const entry = item?.entry;
-        const root = entry?.cssObject?.element?.firstElementChild || entry?.cssObject?.element;
-        if (!root) return 0;
-
-        const contentEl = root.querySelector?.('[id^="node-response-"]')
-            || root.querySelector?.('.node-response')
-            || root.querySelector?.('.note-textarea')
-            || root.querySelector?.('textarea');
-        if (!contentEl) return 0;
-
-        const scrollHeight = Math.ceil(Number(contentEl.scrollHeight || 0));
-        const clientHeight = Math.ceil(Number(contentEl.clientHeight || 0));
-        const overflow = scrollHeight - clientHeight;
-        if (!Number.isFinite(overflow) || overflow <= 1) return 0;
-
-        return overflow + 12;
-    }
-
-    function refineTextFitItemsFromRenderedDom(items) {
-        if (!Array.isArray(items) || items.length === 0) return 0;
-
-        let adjusted = 0;
-        for (const item of items) {
-            const correction = readRenderedTextOverflowAdjustment(item);
-            if (correction <= 0) continue;
-
-            item.newHeight = Math.min(TEXT_FIT_MAX_HEIGHT, Math.ceil(item.newHeight + correction));
-            adjusted++;
-        }
-
-        return adjusted;
-    }
-
-    function getNodeFrame(nodeId) {
-        const entry = _module?.nodeObjectsById?.get?.(nodeId);
-        const model = entry?.model;
-        if (!entry || !model) return null;
-
-        const x = Number(model.positionX ?? model.x ?? entry.glObject?.position?.x ?? entry.cssObject?.position?.x ?? 0);
-        const y = Number(model.positionY ?? model.y ?? entry.glObject?.position?.y ?? entry.cssObject?.position?.y ?? 0);
-        const width = Math.max(1, Math.round(Number(model.width || 400)));
-        const height = Math.max(1, Math.round(Number(model.height || 200)));
-
-        return {
-            nodeId,
-            entry,
-            model,
-            x,
-            y,
-            width,
-            height,
-            left: x,
-            right: x + width,
-            centerX: x + width / 2
-        };
-    }
-
-    function horizontalOverlapRatio(a, b) {
-        const overlap = Math.min(a.right, b.right) - Math.max(a.left, b.left);
-        if (overlap <= 0) return 0;
-        return overlap / Math.max(1, Math.min(a.width, b.width));
-    }
-
-    function groupTextFramesByColumn(items) {
-        const groups = [];
-        const ordered = [...items].sort((a, b) => a.left - b.left || b.y - a.y);
-
-        for (const item of ordered) {
-            let target = null;
-            let bestScore = 0;
-
-            for (const group of groups) {
-                const groupFrame = {
-                    left: group.left,
-                    right: group.right,
-                    width: Math.max(1, group.right - group.left)
-                };
-                const overlapScore = horizontalOverlapRatio(item, groupFrame);
-                const centerDistance = Math.abs(item.centerX - group.centerX);
-                const centerThreshold = Math.max(80, Math.min(item.width, groupFrame.width) * 0.35);
-                const score = overlapScore > 0 ? overlapScore : (centerDistance <= centerThreshold ? 0.2 : 0);
-
-                if (score > bestScore) {
-                    bestScore = score;
-                    target = group;
-                }
-            }
-
-            if (!target || bestScore < 0.15) {
-                target = {
-                    items: [],
-                    left: item.left,
-                    right: item.right,
-                    centerX: item.centerX
-                };
-                groups.push(target);
-            }
-
-            target.items.push(item);
-            target.left = Math.min(target.left, item.left);
-            target.right = Math.max(target.right, item.right);
-            target.centerX = target.items.reduce((sum, n) => sum + n.centerX, 0) / target.items.length;
-        }
-
-        return groups;
-    }
-
-    function buildTextFitLayoutUpdates(items) {
-        const DEFAULT_GAP = 24;
-        const MIN_GAP = 12;
-        const groups = groupTextFramesByColumn(items);
-        const updates = [];
-
-        for (const group of groups) {
-            const ordered = [...group.items].sort((a, b) => b.y - a.y || a.x - b.x);
-
-            let previous = null;
-            for (const item of ordered) {
-                let y = item.y;
-
-                if (previous) {
-                    const originalGap = previous.y - previous.height - item.y;
-                    const gap = Number.isFinite(originalGap) && originalGap >= 0
-                        ? Math.max(MIN_GAP, originalGap)
-                        : DEFAULT_GAP;
-                    y = previous.newY - previous.newHeight - gap;
-                }
-
-                item.newY = y;
-                previous = item;
-
-                updates.push({
-                    nodeId: item.nodeId,
-                    x: item.x,
-                    y,
-                    width: item.width,
-                    height: item.newHeight
-                });
-            }
-        }
-
-        return updates;
-    }
-
-    async function applyTextFitLayoutUpdates(updates) {
-        if (!_module || !Array.isArray(updates) || updates.length === 0) return;
-
-        const renderPromises = [];
-
-        for (const update of updates) {
-            const entry = _module.nodeObjectsById.get(update.nodeId);
-            if (!entry || !entry.model) continue;
-
-            const width = Math.max(1, Math.round(Number(update.width || entry.model.width || 400)));
-            const height = Math.max(1, Math.round(Number(update.height || entry.model.height || 200)));
-            const x = Number(update.x ?? entry.model.positionX ?? entry.model.x ?? 0);
-            const y = Number(update.y ?? entry.model.positionY ?? entry.model.y ?? 0);
-
-            entry.model.positionX = x;
-            entry.model.positionY = y;
-            entry.model.x = x;
-            entry.model.y = y;
-            entry.model.width = width;
-            entry.model.height = height;
-            entry.model.originalHeight = height;
-            entry.model.isExpanded = false;
-            entry.model.scrollOffset = 0;
-            entry.model.maxScroll = 0;
-
-            if (entry.glObject) {
-                entry.glObject.position.x = x;
-                entry.glObject.position.y = y;
-                if (entry.glObject.userData) {
-                    entry.glObject.userData.worldWidth = width;
-                    entry.glObject.userData.worldHeight = height;
-                }
-            }
-            if (entry.cssObject) {
-                entry.cssObject.position.x = x;
-                entry.cssObject.position.y = y;
-                if (entry.cssObject.userData) {
-                    entry.cssObject.userData.worldWidth = width;
-                    entry.cssObject.userData.worldHeight = height;
-                }
-                window.MindMapCss3DManager?.syncCss3dContent?.(entry.model, entry.cssObject);
-                entry.cssObject.updateMatrixWorld?.(true);
-            }
-
-            window.MindMapNodes?.updateNodeSpatialGrid?.(_module, update.nodeId);
-            window.MindMapTextLOD?.invalidateNodeCache?.(update.nodeId, false);
-            window.MindMapTextOverlayV2?.invalidateNode?.(_module, update.nodeId, 'layout');
-
-            if (window.MindMapNodes?.pendingNodeUpdates && window.MindMapPipeline?.processRenderQueue) {
-                window.MindMapNodes.pendingNodeUpdates.set(update.nodeId, {
-                    content: entry.model.response ?? entry.model.Response ?? entry.model.content ?? '',
-                    width,
-                    height,
-                    skipMeasure: true,
-                    skipPersistDimensions: true
-                });
-                renderPromises.push(window.MindMapPipeline.processRenderQueue(_module, update.nodeId));
-            }
-        }
-
-        const RENDER_CHUNK_SIZE = 10;
-        for (let i = 0; i < renderPromises.length; i += RENDER_CHUNK_SIZE) {
-            await Promise.all(renderPromises.slice(i, i + RENDER_CHUNK_SIZE));
-            if (i + RENDER_CHUNK_SIZE < renderPromises.length) {
-                await new Promise(resolve => setTimeout(resolve, 0));
-            }
-        }
-
-        for (const update of updates) {
-            window.MindMapTextOverlayV2?.updateNodePlacement?.(_module, update.nodeId);
-        }
-
-        _module.markLODPositionsDirty?.();
-        _module.markLODDirty?.();
-        _module.updateVisibility?.(_module.camera);
-    }
-
-    // Fit selected text nodes to their CSS3D content and reflow Y inside each column.
-    async function fitTextNodesToContentAndReflowY(selectedIds) {
-        if (!_module) return;
-
-        const textNodeIds = selectedIds.filter(nodeId => {
-            const entry = _module.nodeObjectsById.get(nodeId);
-            return entry && TEXT_TYPES.includes(entry.model?.contentType);
-        });
-
-        if (textNodeIds.length === 0) {
-            console.log('[MultiSelect] No text nodes to fit');
-            return;
-        }
-
-        console.log(`[MultiSelect] Fitting ${textNodeIds.length} text nodes to content...`);
-        const startTime = performance.now();
-
-        const measureStart = performance.now();
-        const measurePromises = textNodeIds.map(async (nodeId) => {
-            const frame = getNodeFrame(nodeId);
-            if (!frame) return null;
-
-            try {
-                const newHeight = await measureTextFitHeight(frame.entry);
-                if (!Number.isFinite(newHeight) || newHeight <= 0) return null;
-                return { ...frame, newHeight };
-            } catch (err) {
-                console.error(`[MultiSelect] Failed to measure node ${nodeId}:`, err);
-                return null;
-            }
-        });
-
-        const measureResults = await Promise.all(measurePromises);
-        const fitItems = measureResults.filter(r => r !== null);
-
-        const measureTime = (performance.now() - measureStart).toFixed(0);
-        console.log(`[MultiSelect] Measured ${textNodeIds.length} nodes in ${measureTime}ms`);
-
-        if (fitItems.length > 0) {
-            let layoutUpdates = buildTextFitLayoutUpdates(fitItems);
-            await applyTextFitLayoutUpdates(layoutUpdates);
-
-            const refinedCount = refineTextFitItemsFromRenderedDom(fitItems);
-            if (refinedCount > 0) {
-                layoutUpdates = buildTextFitLayoutUpdates(fitItems);
-                await applyTextFitLayoutUpdates(layoutUpdates);
-                console.log(`[MultiSelect] Refined ${refinedCount} text node heights from rendered DOM`);
-            }
-
-            if (_module.dotNetHelper && layoutUpdates.length > 0) {
-                await _module.dotNetHelper.invokeMethodAsync('UpdateMultipleNodesPositionFromJs', layoutUpdates);
-                _module.dotNetHelper.invokeMethodAsync('TriggerBoardSave');
-            }
-
-            const elapsed = (performance.now() - startTime).toFixed(0);
-            console.log(`[MultiSelect] ✅ Fit ${layoutUpdates.length} text nodes in ${elapsed}ms`);
-        }
-
-        // Update bounds after fitting/reflow.
-        showMultiSelectBounds(getSelectedNodeIds());
-    }
+    function getTextFitMinHeight(model) {
+        const contentType = String(model?.contentType || '').toLowerCase();
+        if (contentType === 'note') return 96;
+        if (contentType === 'code') return 120;
+        return 88;
+    }
+
+    async function measureTextFitHeight(nodeEntry) {
+        const model = nodeEntry?.model;
+        if (!model) return null;
+
+        const FIT_BUFFER = 18;
+        const minHeight = getTextFitMinHeight(model);
+
+        const domHeight = measureExpandedHeightFromCssDom(nodeEntry, FIT_BUFFER);
+        let factoryHeight = null;
+
+        if (window.MindMapTextureFactory?.measureHtmlHeightAsync) {
+            const zoomLevel = 2;
+            const measureModel = {
+                ...model,
+                response: model.response ?? model.Response ?? model.content ?? ''
+            };
+            const { height: measuredHeight } = await window.MindMapTextureFactory.measureHtmlHeightAsync(
+                measureModel,
+                zoomLevel,
+                (model.width || 400) * zoomLevel,
+                null,
+                TEXT_FIT_MAX_HEIGHT
+            );
+            factoryHeight = measuredHeight + FIT_BUFFER;
+        }
+
+        const requiredHeight = Math.max(
+            Number.isFinite(domHeight) ? domHeight : 0,
+            Number.isFinite(factoryHeight) ? factoryHeight : 0
+        );
+
+        if (!Number.isFinite(requiredHeight) || requiredHeight <= 0) {
+            return null;
+        }
+
+        return Math.min(TEXT_FIT_MAX_HEIGHT, Math.max(minHeight, Math.ceil(requiredHeight)));
+    }
+
+    function readRenderedTextOverflowAdjustment(item) {
+        const entry = item?.entry;
+        const root = entry?.cssObject?.element?.firstElementChild || entry?.cssObject?.element;
+        if (!root) return 0;
+
+        const contentEl = root.querySelector?.('[id^="node-response-"]')
+            || root.querySelector?.('.node-response')
+            || root.querySelector?.('.note-textarea')
+            || root.querySelector?.('textarea');
+        if (!contentEl) return 0;
+
+        const scrollHeight = Math.ceil(Number(contentEl.scrollHeight || 0));
+        const clientHeight = Math.ceil(Number(contentEl.clientHeight || 0));
+        const overflow = scrollHeight - clientHeight;
+        if (!Number.isFinite(overflow) || overflow <= 1) return 0;
+
+        return overflow + 12;
+    }
+
+    function refineTextFitItemsFromRenderedDom(items) {
+        if (!Array.isArray(items) || items.length === 0) return 0;
+
+        let adjusted = 0;
+        for (const item of items) {
+            const correction = readRenderedTextOverflowAdjustment(item);
+            if (correction <= 0) continue;
+
+            item.newHeight = Math.min(TEXT_FIT_MAX_HEIGHT, Math.ceil(item.newHeight + correction));
+            adjusted++;
+        }
+
+        return adjusted;
+    }
+
+    function getNodeFrame(nodeId) {
+        const entry = _module?.nodeObjectsById?.get?.(nodeId);
+        const model = entry?.model;
+        if (!entry || !model) return null;
+
+        const x = Number(model.positionX ?? model.x ?? entry.glObject?.position?.x ?? entry.cssObject?.position?.x ?? 0);
+        const y = Number(model.positionY ?? model.y ?? entry.glObject?.position?.y ?? entry.cssObject?.position?.y ?? 0);
+        const width = Math.max(1, Math.round(Number(model.width || 400)));
+        const height = Math.max(1, Math.round(Number(model.height || 200)));
+
+        return {
+            nodeId,
+            entry,
+            model,
+            x,
+            y,
+            width,
+            height,
+            left: x,
+            right: x + width,
+            centerX: x + width / 2
+        };
+    }
+
+    function horizontalOverlapRatio(a, b) {
+        const overlap = Math.min(a.right, b.right) - Math.max(a.left, b.left);
+        if (overlap <= 0) return 0;
+        return overlap / Math.max(1, Math.min(a.width, b.width));
+    }
+
+    function groupTextFramesByColumn(items) {
+        const groups = [];
+        const ordered = [...items].sort((a, b) => a.left - b.left || b.y - a.y);
+
+        for (const item of ordered) {
+            let target = null;
+            let bestScore = 0;
+
+            for (const group of groups) {
+                const groupFrame = {
+                    left: group.left,
+                    right: group.right,
+                    width: Math.max(1, group.right - group.left)
+                };
+                const overlapScore = horizontalOverlapRatio(item, groupFrame);
+                const centerDistance = Math.abs(item.centerX - group.centerX);
+                const centerThreshold = Math.max(80, Math.min(item.width, groupFrame.width) * 0.35);
+                const score = overlapScore > 0 ? overlapScore : (centerDistance <= centerThreshold ? 0.2 : 0);
+
+                if (score > bestScore) {
+                    bestScore = score;
+                    target = group;
+                }
+            }
+
+            if (!target || bestScore < 0.15) {
+                target = {
+                    items: [],
+                    left: item.left,
+                    right: item.right,
+                    centerX: item.centerX
+                };
+                groups.push(target);
+            }
+
+            target.items.push(item);
+            target.left = Math.min(target.left, item.left);
+            target.right = Math.max(target.right, item.right);
+            target.centerX = target.items.reduce((sum, n) => sum + n.centerX, 0) / target.items.length;
+        }
+
+        return groups;
+    }
+
+    function buildTextFitLayoutUpdates(items) {
+        const DEFAULT_GAP = 24;
+        const MIN_GAP = 12;
+        const groups = groupTextFramesByColumn(items);
+        const updates = [];
+
+        for (const group of groups) {
+            const ordered = [...group.items].sort((a, b) => b.y - a.y || a.x - b.x);
+
+            let previous = null;
+            for (const item of ordered) {
+                let y = item.y;
+
+                if (previous) {
+                    const originalGap = previous.y - previous.height - item.y;
+                    const gap = Number.isFinite(originalGap) && originalGap >= 0
+                        ? Math.max(MIN_GAP, originalGap)
+                        : DEFAULT_GAP;
+                    y = previous.newY - previous.newHeight - gap;
+                }
+
+                item.newY = y;
+                previous = item;
+
+                updates.push({
+                    nodeId: item.nodeId,
+                    x: item.x,
+                    y,
+                    width: item.width,
+                    height: item.newHeight
+                });
+            }
+        }
+
+        return updates;
+    }
+
+    async function applyTextFitLayoutUpdates(updates) {
+        if (!_module || !Array.isArray(updates) || updates.length === 0) return;
+
+        const renderPromises = [];
+
+        for (const update of updates) {
+            const entry = _module.nodeObjectsById.get(update.nodeId);
+            if (!entry || !entry.model) continue;
+
+            const width = Math.max(1, Math.round(Number(update.width || entry.model.width || 400)));
+            const height = Math.max(1, Math.round(Number(update.height || entry.model.height || 200)));
+            const x = Number(update.x ?? entry.model.positionX ?? entry.model.x ?? 0);
+            const y = Number(update.y ?? entry.model.positionY ?? entry.model.y ?? 0);
+
+            entry.model.positionX = x;
+            entry.model.positionY = y;
+            entry.model.x = x;
+            entry.model.y = y;
+            entry.model.width = width;
+            entry.model.height = height;
+            entry.model.originalHeight = height;
+            entry.model.isExpanded = false;
+            entry.model.scrollOffset = 0;
+            entry.model.maxScroll = 0;
+
+            if (entry.glObject) {
+                entry.glObject.position.x = x;
+                entry.glObject.position.y = y;
+                if (entry.glObject.userData) {
+                    entry.glObject.userData.worldWidth = width;
+                    entry.glObject.userData.worldHeight = height;
+                }
+            }
+            if (entry.cssObject) {
+                entry.cssObject.position.x = x;
+                entry.cssObject.position.y = y;
+                if (entry.cssObject.userData) {
+                    entry.cssObject.userData.worldWidth = width;
+                    entry.cssObject.userData.worldHeight = height;
+                }
+                window.MindMapCss3DManager?.syncCss3dContent?.(entry.model, entry.cssObject);
+                entry.cssObject.updateMatrixWorld?.(true);
+            }
+
+            window.MindMapNodes?.updateNodeSpatialGrid?.(_module, update.nodeId);
+            window.MindMapTextLOD?.invalidateNodeCache?.(update.nodeId, false);
+            window.MindMapTextOverlayV2?.invalidateNode?.(_module, update.nodeId, 'layout');
+
+            if (window.MindMapNodes?.pendingNodeUpdates && window.MindMapPipeline?.processRenderQueue) {
+                window.MindMapNodes.pendingNodeUpdates.set(update.nodeId, {
+                    content: entry.model.response ?? entry.model.Response ?? entry.model.content ?? '',
+                    width,
+                    height,
+                    skipMeasure: true,
+                    skipPersistDimensions: true
+                });
+                renderPromises.push(window.MindMapPipeline.processRenderQueue(_module, update.nodeId));
+            }
+        }
+
+        const RENDER_CHUNK_SIZE = 10;
+        for (let i = 0; i < renderPromises.length; i += RENDER_CHUNK_SIZE) {
+            await Promise.all(renderPromises.slice(i, i + RENDER_CHUNK_SIZE));
+            if (i + RENDER_CHUNK_SIZE < renderPromises.length) {
+                await new Promise(resolve => setTimeout(resolve, 0));
+            }
+        }
+
+        for (const update of updates) {
+            window.MindMapTextOverlayV2?.updateNodePlacement?.(_module, update.nodeId);
+        }
+
+        _module.markLODPositionsDirty?.();
+        _module.markLODDirty?.();
+        _module.updateVisibility?.(_module.camera);
+    }
+
+    // Fit selected text nodes to their CSS3D content and reflow Y inside each column.
+    async function fitTextNodesToContentAndReflowY(selectedIds) {
+        if (!_module) return;
+
+        const textNodeIds = selectedIds.filter(nodeId => {
+            const entry = _module.nodeObjectsById.get(nodeId);
+            return entry && TEXT_TYPES.includes(entry.model?.contentType);
+        });
+
+        if (textNodeIds.length === 0) {
+            console.log('[MultiSelect] No text nodes to fit');
+            return;
+        }
+
+        console.log(`[MultiSelect] Fitting ${textNodeIds.length} text nodes to content...`);
+        const startTime = performance.now();
+
+        const measureStart = performance.now();
+        const measurePromises = textNodeIds.map(async (nodeId) => {
+            const frame = getNodeFrame(nodeId);
+            if (!frame) return null;
+
+            try {
+                const newHeight = await measureTextFitHeight(frame.entry);
+                if (!Number.isFinite(newHeight) || newHeight <= 0) return null;
+                return { ...frame, newHeight };
+            } catch (err) {
+                console.error(`[MultiSelect] Failed to measure node ${nodeId}:`, err);
+                return null;
+            }
+        });
+
+        const measureResults = await Promise.all(measurePromises);
+        const fitItems = measureResults.filter(r => r !== null);
+
+        const measureTime = (performance.now() - measureStart).toFixed(0);
+        console.log(`[MultiSelect] Measured ${textNodeIds.length} nodes in ${measureTime}ms`);
+
+        if (fitItems.length > 0) {
+            let layoutUpdates = buildTextFitLayoutUpdates(fitItems);
+            await applyTextFitLayoutUpdates(layoutUpdates);
+
+            const refinedCount = refineTextFitItemsFromRenderedDom(fitItems);
+            if (refinedCount > 0) {
+                layoutUpdates = buildTextFitLayoutUpdates(fitItems);
+                await applyTextFitLayoutUpdates(layoutUpdates);
+                console.log(`[MultiSelect] Refined ${refinedCount} text node heights from rendered DOM`);
+            }
+
+            if (_module.dotNetHelper && layoutUpdates.length > 0) {
+                await _module.dotNetHelper.invokeMethodAsync('UpdateMultipleNodesPositionFromJs', layoutUpdates);
+                _module.dotNetHelper.invokeMethodAsync('TriggerBoardSave');
+            }
+
+            const elapsed = (performance.now() - startTime).toFixed(0);
+            console.log(`[MultiSelect] ✅ Fit ${layoutUpdates.length} text nodes in ${elapsed}ms`);
+        }
+
+        // Update bounds after fitting/reflow.
+        showMultiSelectBounds(getSelectedNodeIds());
+    }
 
     function applyMasonryLayout(selectedIds) {
         if (!currentBounds || selectedIds.length === 0) return;
@@ -1511,27 +1511,27 @@
         if (multiSelectOverlay) {
             multiSelectOverlay.style.display = 'none';
             multiSelectOverlay.style.visibility = 'hidden';
-        }
-
-        // Delete via C# (batch delete - much faster than individual calls)
-        const snapshots = selectedIds
-            .map(nodeId => window.MindMapNodes?.captureDeleteSnapshot?.(_module, nodeId))
-            .filter(Boolean);
-        if (snapshots.length > 0) {
-            window.MindMapNodes?.removeNodes?.(_module, snapshots.map(snapshot => snapshot.nodeId));
-        }
-        _module.dotNetHelper.invokeMethodAsync('DeleteMultipleNodeSnapshotsFromJs', snapshots);
-
-        console.log(`[MultiSelect] Deleted ${selectedIds.length} nodes`);
-    }
+        }
+
+        // Delete via C# (batch delete - much faster than individual calls)
+        const snapshots = selectedIds
+            .map(nodeId => window.MindMapNodes?.captureDeleteSnapshot?.(_module, nodeId))
+            .filter(Boolean);
+        if (snapshots.length > 0) {
+            window.MindMapNodes?.removeNodes?.(_module, snapshots.map(snapshot => snapshot.nodeId));
+        }
+        _module.dotNetHelper.invokeMethodAsync('DeleteMultipleNodeSnapshotsFromJs', snapshots);
+
+        console.log(`[MultiSelect] Deleted ${selectedIds.length} nodes`);
+    }
 
     // Update overlay position on camera move or node drag (called from animate loop)
     // ▼▼▼ [Perf] Throttled and optimized for drag performance ▼▼▼
-    function updateMultiSelectOverlay() {
-        if (!_module || !multiSelectOverlay || multiSelectOverlay.style.display === 'none') return;
-
-        // Centralized drag-state sync from interactions module
-        const draggingNow = !!_module.isDraggingMultipleNodes;
+    function updateMultiSelectOverlay() {
+        if (!_module || !multiSelectOverlay || multiSelectOverlay.style.display === 'none') return;
+
+        // Centralized drag-state sync from interactions module
+        const draggingNow = !!_module.isDraggingMultipleNodes;
         if (draggingNow !== isDragging) {
             isDragging = draggingNow;
             lastUpdateTime = 0;
@@ -1581,45 +1581,45 @@
         }
 
         // Add padding
-        const padding = 10;
+        const padding = 10;
         currentBounds = {
             minX: minX - padding,
             minY: minY - padding,
             maxX: maxX + padding,
             maxY: maxY + padding
         };
-
-        updateOverlayPosition(selectedIds);
-    }
-
-    function update() {
-        if (!_module) return;
-        updateMultiSelectOverlay();
-        updateSingleImageOverlay();
-    }
-
-    // Camera-only fast path: currentBounds and node world frames are already
-    // canonical, so reproject only the fixed overlays. This deliberately avoids
-    // selected-node scans, DOM layout reads, menu work, and renderer rebuilds.
-    function updateForCameraMotion() {
-        if (!_module || !_module.camera || !_module.container) return false;
-
-        let updated = false;
-        if (multiSelectOverlay &&
-            multiSelectOverlay.style.display !== 'none' &&
-            currentBounds) {
-            updateOverlayPosition(null, true);
-            updated = true;
-        }
-
-        if (getSingleSelectedImageNodeId()) {
-            updateSingleImageOverlay(true);
-            updated = true;
-        }
-
-        return updated;
-    }
-    // ▲▲▲ [Perf] ▲▲▲
+
+        updateOverlayPosition(selectedIds);
+    }
+
+    function update() {
+        if (!_module) return;
+        updateMultiSelectOverlay();
+        updateSingleImageOverlay();
+    }
+
+    // Camera-only fast path: currentBounds and node world frames are already
+    // canonical, so reproject only the fixed overlays. This deliberately avoids
+    // selected-node scans, DOM layout reads, menu work, and renderer rebuilds.
+    function updateForCameraMotion() {
+        if (!_module || !_module.camera || !_module.container) return false;
+
+        let updated = false;
+        if (multiSelectOverlay &&
+            multiSelectOverlay.style.display !== 'none' &&
+            currentBounds) {
+            updateOverlayPosition(null, true);
+            updated = true;
+        }
+
+        if (getSingleSelectedImageNodeId()) {
+            updateSingleImageOverlay(true);
+            updated = true;
+        }
+
+        return updated;
+    }
+    // ▲▲▲ [Perf] ▲▲▲
 
     // ▼▼▼ [New] Dynamic menu button creation based on selection type ▼▼▼
     function updateMenuButtons() {
@@ -1639,24 +1639,24 @@
         // Copy is always available
         buttons.push({ icon: 'fa-regular fa-copy', title: 'Copy', action: 'copy', class: 'js-btn-multi-copy' });
 
-        const isMixedImageTextSelection = hasImages && hasText;
-
-        if (hasImages && !isMixedImageTextSelection) {
-            // Image layout organization actions
-            buttons.push({ icon: 'fa-solid fa-table-cells-large', title: 'Tidy masonry', action: 'masonry', class: 'js-btn-multi-masonry' });
-            buttons.push({ icon: 'fa-solid fa-border-all', title: 'Tidy grid', action: 'grid', class: 'js-btn-multi-grid' });
-            buttons.push({ icon: 'fa-solid fa-grip-lines', title: 'Tidy strip', action: 'stripHorizontal', class: 'js-btn-multi-strip' });
+        const isMixedImageTextSelection = hasImages && hasText;
+
+        if (hasImages && !isMixedImageTextSelection) {
+            // Image layout organization actions
+            buttons.push({ icon: 'fa-solid fa-table-cells-large', title: 'Tidy masonry', action: 'masonry', class: 'js-btn-multi-masonry' });
+            buttons.push({ icon: 'fa-solid fa-border-all', title: 'Tidy grid', action: 'grid', class: 'js-btn-multi-grid' });
+            buttons.push({ icon: 'fa-solid fa-grip-lines', title: 'Tidy strip', action: 'stripHorizontal', class: 'js-btn-multi-strip' });
 
             // Stack is only for image-only selection
             if (!hasText) {
                 buttons.push({ icon: 'fa-solid fa-layer-group', title: 'Stack into pile', action: 'stack', class: 'js-btn-multi-stack' });
             }
         }
-
-        // Text-specific actions
-        if (hasText && !isMixedImageTextSelection) {
-            buttons.push({ icon: 'fa-solid fa-arrows-up-down', title: 'Fit text height', action: 'expand', class: 'js-btn-multi-expand' });
-        }
+
+        // Text-specific actions
+        if (hasText && !isMixedImageTextSelection) {
+            buttons.push({ icon: 'fa-solid fa-arrows-up-down', title: 'Fit text height', action: 'expand', class: 'js-btn-multi-expand' });
+        }
 
         buttons.push({ separator: true });
         buttons.push({ icon: 'fa-solid fa-trash', title: 'Delete all', action: 'delete', class: 'js-btn-multi-delete delete-btn' });
@@ -1703,37 +1703,37 @@
     function checkAndUpdateDisplay() {
         if (!_module) return;
 
-        const nodeIds = getSelectedNodeIds();
-
-        if (nodeIds.length >= 2) {
-            updateMenuButtons(); // Update menu based on selection type
-            showMultiSelectBounds(nodeIds);
-            hideSingleImageOverlay();
-            // Hide single-node menu
-            if (window.MindMapMenuManager) {
-                window.MindMapMenuManager.hideMenu();
-            }
-        } else {
-            if (multiSelectOverlay) {
-                multiSelectOverlay.style.display = 'none';
-                multiSelectOverlay.style.visibility = 'hidden';
-            }
-            currentBounds = null;
-            initialNodeSizes.clear();
-            updateSingleImageOverlay();
-        }
-    }
+        const nodeIds = getSelectedNodeIds();
+
+        if (nodeIds.length >= 2) {
+            updateMenuButtons(); // Update menu based on selection type
+            showMultiSelectBounds(nodeIds);
+            hideSingleImageOverlay();
+            // Hide single-node menu
+            if (window.MindMapMenuManager) {
+                window.MindMapMenuManager.hideMenu();
+            }
+        } else {
+            if (multiSelectOverlay) {
+                multiSelectOverlay.style.display = 'none';
+                multiSelectOverlay.style.visibility = 'hidden';
+            }
+            currentBounds = null;
+            initialNodeSizes.clear();
+            updateSingleImageOverlay();
+        }
+    }
 
     window.MindMapMultiSelect = {
         init,
-        showMultiSelectBounds,
-        hide,
-        update,
-        updateForCameraMotion,
-        checkAndUpdateDisplay,
-        getSelectedImageNodeIds,
-        fitTextNodesToContentAndReflowY,
-        isResizing: () => isResizing,
+        showMultiSelectBounds,
+        hide,
+        update,
+        updateForCameraMotion,
+        checkAndUpdateDisplay,
+        getSelectedImageNodeIds,
+        fitTextNodesToContentAndReflowY,
+        isResizing: () => isResizing,
         handleResizeMove: onResizeMove,
         handleResizeEnd: onResizeEnd
     };