@mindexec/cli 0.2.456 → 0.2.457

package/wwwroot/_content/MindExecution.Shared/js/mind-map-pipeline.js

@@ -1,16 +1,16 @@
-// File name: X:\Dev@Work\MindExecution\Client\wwwroot\js\mind-map-pipeline.js
-// [Refactor] Owns the async rendering queue and node resizing logic.
+// File name: X:\Dev@Work\MindExecution\Client\wwwroot\js\mind-map-pipeline.js
+// [Refactor] Owns the async rendering queue and node resizing logic.
 (function () {
     'use strict';
 
     const CSS3D_WRAPPER_TRANSITION = 'box-shadow .22s ease, filter .22s ease';
     const CSS3D_WRAPPER_WEBKIT_TRANSITION = '-webkit-box-shadow .22s ease, -webkit-filter .22s ease';
-
-    // ▼▼▼ [Changed] Add state variables to switch from debounce to throttle ▼▼▼
-    const debounceTimers = new Map();
-    const scrollUpdateThrottleTimers = new Map();
-    const lastScrollCall = new Map();
-    const resizeThrottleTimers = new Map(); // [New] throttle for texture updates during resize
+
+    // ▼▼▼ [Changed] Add state variables to switch from debounce to throttle ▼▼▼
+    const debounceTimers = new Map();
+    const scrollUpdateThrottleTimers = new Map();
+    const lastScrollCall = new Map();
+    const resizeThrottleTimers = new Map(); // [New] throttle for texture updates during resize
     const lastResizeUpdateCall = new Map(); // [New] last resize-update timestamp
     const THROTTLE_INTERVAL = 16; // 16ms -> ~60fps
     const RESIZE_HANDLE_SIZE = 16;
@@ -21,8 +21,9 @@
     const CSV_TABLE_MIN_WIDTH = 320;
     const CSV_TABLE_MIN_HEIGHT = 180;
     const REMOTE_FLEET_SEMANTIC_TYPE = 'RemoteFleetMonitor';
-    const REMOTE_FLEET_DISPLAY_NAME = 'Multi Desktop Monitor';
-    const REMOTE_FLEET_LEGACY_DISPLAY_NAME = 'Remote Fleet Monitor';
+    const REMOTE_FLEET_DISPLAY_NAME = 'Remote Work Console';
+    const REMOTE_FLEET_LEGACY_DISPLAY_NAME = 'Multi Desktop Monitor';
+    const REMOTE_FLEET_LEGACY_DISPLAY_NAME_V0 = 'Remote Fleet Monitor';
     const REMOTE_FLEET_MONITOR_MIN_WIDTH = 520;
     const REMOTE_FLEET_MONITOR_MIN_HEIGHT = 320;
 
@@ -44,7 +45,9 @@
         const contentType = getNodeContentType(nodeModel);
         const title = String(nodeModel?.prompt ?? nodeModel?.Prompt ?? '').trim();
         return contentType === 'templatelauncher'
-            && (title === REMOTE_FLEET_DISPLAY_NAME || title === REMOTE_FLEET_LEGACY_DISPLAY_NAME);
+            && (title === REMOTE_FLEET_DISPLAY_NAME
+                || title === REMOTE_FLEET_LEGACY_DISPLAY_NAME
+                || title === REMOTE_FLEET_LEGACY_DISPLAY_NAME_V0);
     }
 
     function isCsvTableNodeModel(nodeModel) {
@@ -145,7 +148,7 @@
     }
 
     // ▼▼▼ [Perf] Render queue (time-sliced) ▼▼▼
-    const renderQueue = [];
+    const renderQueue = [];
     const renderQueueSet = new Set();
     let renderQueueScheduled = false;
     let renderModuleRef = null;
@@ -154,52 +157,52 @@
     let renderSeq = 0;
     let renderQueueSortCount = 0;
     let renderQueueMaxLength = 0;
-
-    function computeRenderPriority(module, nodeId) {
-        const entry = module?.nodeObjectsById?.get(nodeId);
-        if (!entry) return 1000000;
-
-        const obj = entry.glObject || entry.cssObject;
-        const visible = obj?.visible === true;
-        const pos = obj?.position || { x: 0, y: 0 };
-        const cam = module.camera?.position || { x: 0, y: 0 };
-
-        const dx = pos.x - cam.x;
-        const dy = pos.y - cam.y;
-        const dist = Math.sqrt(dx * dx + dy * dy);
-
-        const isSelected = module.multiSelectedNodeIds?.has(nodeId) || module.selectedNodeIdJs === nodeId;
-
-        // 낮은 값이 우선: 보이는 노드 > 선택 노드 > 카메라 근접
-        let priority = dist;
-        if (!visible) priority += 100000;
-        if (isSelected) priority -= 5000;
-
-        return priority;
-    }
-
-    function enqueueRender(module, nodeId) {
-        if (!nodeId) return;
-        renderModuleRef = module;
+
+    function computeRenderPriority(module, nodeId) {
+        const entry = module?.nodeObjectsById?.get(nodeId);
+        if (!entry) return 1000000;
+
+        const obj = entry.glObject || entry.cssObject;
+        const visible = obj?.visible === true;
+        const pos = obj?.position || { x: 0, y: 0 };
+        const cam = module.camera?.position || { x: 0, y: 0 };
+
+        const dx = pos.x - cam.x;
+        const dy = pos.y - cam.y;
+        const dist = Math.sqrt(dx * dx + dy * dy);
+
+        const isSelected = module.multiSelectedNodeIds?.has(nodeId) || module.selectedNodeIdJs === nodeId;
+
+        // 낮은 값이 우선: 보이는 노드 > 선택 노드 > 카메라 근접
+        let priority = dist;
+        if (!visible) priority += 100000;
+        if (isSelected) priority -= 5000;
+
+        return priority;
+    }
+
+    function enqueueRender(module, nodeId) {
+        if (!nodeId) return;
+        renderModuleRef = module;
         if (!renderQueueSet.has(nodeId)) {
             renderQueue.push({ nodeId, priority: computeRenderPriority(module, nodeId), seq: renderSeq++ });
             renderQueueSet.add(nodeId);
             renderQueueDirty = true;
             renderQueueMaxLength = Math.max(renderQueueMaxLength, renderQueue.length);
-        }
-        scheduleRenderQueue();
-    }
-
+        }
+        scheduleRenderQueue();
+    }
+
     function scheduleRenderQueue() {
         if (renderQueueScheduled) return;
         renderQueueScheduled = true;
         scheduleNonVisualFrame(() => processRenderQueueBatch());
     }
-
-    async function processRenderQueueBatch() {
-        const start = performance.now();
-
-        // 우선순위 정렬 (가시/선택/거리)
+
+    async function processRenderQueueBatch() {
+        const start = performance.now();
+
+        // 우선순위 정렬 (가시/선택/거리)
         if (renderQueueDirty) {
             if (renderQueue.length > 1) {
                 renderQueue.sort((a, b) => (b.priority - a.priority) || (b.seq - a.seq));
@@ -210,64 +213,64 @@
 
         while (renderQueue.length > 0) {
             const item = renderQueue.pop();
-            const nodeId = item.nodeId;
-            renderQueueSet.delete(nodeId);
-            if (renderModuleRef) {
-                await processRenderQueue(renderModuleRef, nodeId);
-            }
-            if ((performance.now() - start) >= RENDER_BUDGET_MS) {
-                break;
-            }
-        }
-
-        renderQueueScheduled = false;
-        if (renderQueue.length > 0) {
-            scheduleRenderQueue();
-        }
-    }
-    // ▲▲▲ [Perf] ▲▲▲
-
-    // ▼▼▼ [New] Chunked-node virtual scroll constants ▼▼▼
-    const CHUNK_LINE_HEIGHT = 21; // 14px font * 1.5 line-height (matches plain text rendering)
-    const CHUNK_SIZE = 100; // lines per chunk (matches C# TextChunkService)
-    // ▲▲▲ [New] ▲▲▲
-
-    // ▼▼▼ [Perf] Deferred disposal to avoid GC/driver spikes ▼▼▼
+            const nodeId = item.nodeId;
+            renderQueueSet.delete(nodeId);
+            if (renderModuleRef) {
+                await processRenderQueue(renderModuleRef, nodeId);
+            }
+            if ((performance.now() - start) >= RENDER_BUDGET_MS) {
+                break;
+            }
+        }
+
+        renderQueueScheduled = false;
+        if (renderQueue.length > 0) {
+            scheduleRenderQueue();
+        }
+    }
+    // ▲▲▲ [Perf] ▲▲▲
+
+    // ▼▼▼ [New] Chunked-node virtual scroll constants ▼▼▼
+    const CHUNK_LINE_HEIGHT = 21; // 14px font * 1.5 line-height (matches plain text rendering)
+    const CHUNK_SIZE = 100; // lines per chunk (matches C# TextChunkService)
+    // ▲▲▲ [New] ▲▲▲
+
+    // ▼▼▼ [Perf] Deferred disposal to avoid GC/driver spikes ▼▼▼
     const disposeQueue = [];
     let disposeQueueHead = 0;
-    let disposeScheduled = false;
-    const DISPOSE_BUDGET_MS = 6; // soft budget per frame
-
-    function enqueueDispose(resource) {
-        if (!resource || typeof resource.dispose !== 'function') return;
-        disposeQueue.push(resource);
-        scheduleDispose();
-    }
-
-    function scheduleDispose() {
-        if (disposeScheduled) return;
-        disposeScheduled = true;
+    let disposeScheduled = false;
+    const DISPOSE_BUDGET_MS = 6; // soft budget per frame
+
+    function enqueueDispose(resource) {
+        if (!resource || typeof resource.dispose !== 'function') return;
+        disposeQueue.push(resource);
+        scheduleDispose();
+    }
+
+    function scheduleDispose() {
+        if (disposeScheduled) return;
+        disposeScheduled = true;
         if (typeof requestIdleCallback === 'function') {
             requestIdleCallback(processDisposeQueue);
         } else {
             scheduleNonVisualFrame(() => processDisposeQueue());
         }
     }
-
-    function processDisposeQueue(deadline) {
-        const start = performance.now();
+
+    function processDisposeQueue(deadline) {
+        const start = performance.now();
         while (disposeQueueHead < disposeQueue.length) {
             const item = disposeQueue[disposeQueueHead++];
-            try { item.dispose(); } catch { }
-
-            if (deadline && typeof deadline.timeRemaining === 'function') {
-                if (deadline.timeRemaining() < 1) break;
-            } else if ((performance.now() - start) >= DISPOSE_BUDGET_MS) {
-                break;
-            }
-        }
-
-        disposeScheduled = false;
+            try { item.dispose(); } catch { }
+
+            if (deadline && typeof deadline.timeRemaining === 'function') {
+                if (deadline.timeRemaining() < 1) break;
+            } else if ((performance.now() - start) >= DISPOSE_BUDGET_MS) {
+                break;
+            }
+        }
+
+        disposeScheduled = false;
         if (disposeQueueHead >= disposeQueue.length) {
             disposeQueue.length = 0;
             disposeQueueHead = 0;
@@ -278,16 +281,16 @@
         if (disposeQueueHead < disposeQueue.length) {
             scheduleDispose();
         }
-    }
-    // ▲▲▲ [Perf] ▲▲▲
-
+    }
+    // ▲▲▲ [Perf] ▲▲▲
+
     function removeGlowMesh(group) {
         if (!group?.getObjectByName) return null;
         const glowMesh = group.getObjectByName('glow');
         if (!glowMesh) return null;
-
-        group.remove(glowMesh);
-        enqueueDispose(glowMesh.geometry);
+
+        group.remove(glowMesh);
+        enqueueDispose(glowMesh.geometry);
         enqueueDispose(glowMesh.material);
         return null;
     }
@@ -298,27 +301,27 @@
             window.MindMapNodes.applyImageCoverUv(bodyMesh, width, height);
         }
     }
-
-    // ▼▼▼ [Changed] Geometry helper for rounded corners ▼▼▼
+
+    // ▼▼▼ [Changed] Geometry helper for rounded corners ▼▼▼
     function createRoundedRectGeometry(width, height, radius) {
         const shape = new THREE.Shape();
         const x = -width / 2;
         const y = -height / 2;
-
-        // Start at bottom-left, go clockwise
-        shape.moveTo(x, y + radius);
-        shape.quadraticCurveTo(x, y, x + radius, y);
-
-        shape.lineTo(x + width - radius, y);
-        shape.quadraticCurveTo(x + width, y, x + width, y + radius);
-
-        shape.lineTo(x + width, y + height - radius);
-        shape.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
-
-        shape.lineTo(x + radius, y + height);
-        shape.quadraticCurveTo(x, y + height, x, y + height - radius);
-
-        shape.lineTo(x, y + radius);
+
+        // Start at bottom-left, go clockwise
+        shape.moveTo(x, y + radius);
+        shape.quadraticCurveTo(x, y, x + radius, y);
+
+        shape.lineTo(x + width - radius, y);
+        shape.quadraticCurveTo(x + width, y, x + width, y + radius);
+
+        shape.lineTo(x + width, y + height - radius);
+        shape.quadraticCurveTo(x + width, y + height, x + width - radius, y + height);
+
+        shape.lineTo(x + radius, y + height);
+        shape.quadraticCurveTo(x, y + height, x, y + height - radius);
+
+        shape.lineTo(x, y + radius);
         const points = shape.getPoints();
         return new THREE.BufferGeometry().setFromPoints(points);
     }
@@ -404,102 +407,102 @@
     }
 
     // ▼▼▼ [New] Update visible content for virtual scrolling ▼▼▼
-    function updateVisibleContent(model, lineHeight, chunkSize) {
-        if (!model.isChunkedText || !model._chunks) {
-            model._visibleContent = model.response || '';
-            model._visibleScrollOffset = model.scrollOffset || 0;
-            return;
-        }
-
-        const scrollOffset = model.scrollOffset || 0;
-        const nodeHeight = model.height || 400;
-
-        // Visible line range in the current viewport
-        const visibleStartLine = Math.floor(scrollOffset / lineHeight);
-        const visibleLineCount = Math.ceil(nodeHeight / lineHeight) + 5; // small buffer
-
-        // Chunk indices needed for that range
-        const startChunkIndex = Math.floor(visibleStartLine / chunkSize) * chunkSize;
-        const endChunkIndex = Math.floor((visibleStartLine + visibleLineCount) / chunkSize) * chunkSize;
-
-        // Merge only the chunks that intersect the current viewport
-        let visibleContent = '';
-        let firstChunkStart = -1;
-        let hasContent = false;
-
-        for (let chunkStart = startChunkIndex; chunkStart <= endChunkIndex; chunkStart += chunkSize) {
-            if (model._chunks[chunkStart]) {
-                if (firstChunkStart === -1) firstChunkStart = chunkStart;
-                visibleContent += model._chunks[chunkStart] + '\n';
-                hasContent = true;
-            }
-        }
-
-        // ▼▼▼ [Changed] If no chunks exist in range, use the nearest loaded chunk ▼▼▼
-        if (!hasContent) {
-            // Find the nearest loaded chunk
-            const loadedChunks = Object.keys(model._chunks).map(Number).sort((a, b) => a - b);
-            if (loadedChunks.length > 0) {
-                // Pick the chunk closest to the current position
-                let closestChunk = loadedChunks[0];
-                for (const chunkStart of loadedChunks) {
-                    if (chunkStart <= startChunkIndex) {
-                        closestChunk = chunkStart;
-                    } else {
-                        break;
-                    }
-                }
-                firstChunkStart = closestChunk;
-                visibleContent = model._chunks[closestChunk] + '\n';
-
-                // Add the next chunk as well if present
-                const nextChunk = closestChunk + chunkSize;
-                if (model._chunks[nextChunk]) {
-                    visibleContent += model._chunks[nextChunk] + '\n';
-                }
-            } else {
-                // If no chunks exist at all, keep the previous response
-                return;
-            }
-        }
-        // ▲▲▲ [Changed] ▲▲▲
-
-        if (firstChunkStart === -1) firstChunkStart = 0;
-
-        // Compute relative scroll offset from the first chunk
-        const firstChunkPixelOffset = firstChunkStart * lineHeight;
-        const relativeScrollOffset = scrollOffset - firstChunkPixelOffset;
-
-        model._visibleContent = visibleContent;
-        model._visibleScrollOffset = Math.max(0, relativeScrollOffset);
-
-        // ▼▼▼ [Changed] Do not overwrite response for chunk nodes (saved/restored via full file path) ▼▼▼
-        // Chunk nodes are restored based on SourceFilePath, so avoid mutating response.
-        // model.response = visibleContent; // removed
-        // ▲▲▲ [Changed] ▲▲▲
-    }
-    // ▲▲▲ [New] ▲▲▲
-    // ▲▲▲ [Changed] ▲▲▲
-
-    async function processRenderQueue(module, nodeId) {
-        // ▼▼▼ [Profiling] Start per-node render timing ▼▼▼
-        // console.time(`[Pipeline] 6. Render Node ${nodeId}`);
-        // ▲▲▲ [Profiling] ▲▲▲
-
-        // ▼▼▼ [Changed] module.nodeRenderLocks -> window.MindMapNodes.nodeRenderLocks ▼▼▼
-        if (window.MindMapNodes.nodeRenderLocks.get(nodeId)) {
-            // console.log(`[Pipeline] [Log Detail] Node ${nodeId} skipped: Render lock active.`);
-            return;
-        }
-
-        // ▼▼▼ [Changed] module.pendingNodeUpdates -> window.MindMapNodes.pendingNodeUpdates ▼▼▼
-        const updateData = window.MindMapNodes.pendingNodeUpdates.get(nodeId);
-        if (!updateData) {
-            return;
-        }
-
-        // console.log(`[Pipeline] [Log Detail] Node ${nodeId} processing queue.`);
-
+    function updateVisibleContent(model, lineHeight, chunkSize) {
+        if (!model.isChunkedText || !model._chunks) {
+            model._visibleContent = model.response || '';
+            model._visibleScrollOffset = model.scrollOffset || 0;
+            return;
+        }
+
+        const scrollOffset = model.scrollOffset || 0;
+        const nodeHeight = model.height || 400;
+
+        // Visible line range in the current viewport
+        const visibleStartLine = Math.floor(scrollOffset / lineHeight);
+        const visibleLineCount = Math.ceil(nodeHeight / lineHeight) + 5; // small buffer
+
+        // Chunk indices needed for that range
+        const startChunkIndex = Math.floor(visibleStartLine / chunkSize) * chunkSize;
+        const endChunkIndex = Math.floor((visibleStartLine + visibleLineCount) / chunkSize) * chunkSize;
+
+        // Merge only the chunks that intersect the current viewport
+        let visibleContent = '';
+        let firstChunkStart = -1;
+        let hasContent = false;
+
+        for (let chunkStart = startChunkIndex; chunkStart <= endChunkIndex; chunkStart += chunkSize) {
+            if (model._chunks[chunkStart]) {
+                if (firstChunkStart === -1) firstChunkStart = chunkStart;
+                visibleContent += model._chunks[chunkStart] + '\n';
+                hasContent = true;
+            }
+        }
+
+        // ▼▼▼ [Changed] If no chunks exist in range, use the nearest loaded chunk ▼▼▼
+        if (!hasContent) {
+            // Find the nearest loaded chunk
+            const loadedChunks = Object.keys(model._chunks).map(Number).sort((a, b) => a - b);
+            if (loadedChunks.length > 0) {
+                // Pick the chunk closest to the current position
+                let closestChunk = loadedChunks[0];
+                for (const chunkStart of loadedChunks) {
+                    if (chunkStart <= startChunkIndex) {
+                        closestChunk = chunkStart;
+                    } else {
+                        break;
+                    }
+                }
+                firstChunkStart = closestChunk;
+                visibleContent = model._chunks[closestChunk] + '\n';
+
+                // Add the next chunk as well if present
+                const nextChunk = closestChunk + chunkSize;
+                if (model._chunks[nextChunk]) {
+                    visibleContent += model._chunks[nextChunk] + '\n';
+                }
+            } else {
+                // If no chunks exist at all, keep the previous response
+                return;
+            }
+        }
+        // ▲▲▲ [Changed] ▲▲▲
+
+        if (firstChunkStart === -1) firstChunkStart = 0;
+
+        // Compute relative scroll offset from the first chunk
+        const firstChunkPixelOffset = firstChunkStart * lineHeight;
+        const relativeScrollOffset = scrollOffset - firstChunkPixelOffset;
+
+        model._visibleContent = visibleContent;
+        model._visibleScrollOffset = Math.max(0, relativeScrollOffset);
+
+        // ▼▼▼ [Changed] Do not overwrite response for chunk nodes (saved/restored via full file path) ▼▼▼
+        // Chunk nodes are restored based on SourceFilePath, so avoid mutating response.
+        // model.response = visibleContent; // removed
+        // ▲▲▲ [Changed] ▲▲▲
+    }
+    // ▲▲▲ [New] ▲▲▲
+    // ▲▲▲ [Changed] ▲▲▲
+
+    async function processRenderQueue(module, nodeId) {
+        // ▼▼▼ [Profiling] Start per-node render timing ▼▼▼
+        // console.time(`[Pipeline] 6. Render Node ${nodeId}`);
+        // ▲▲▲ [Profiling] ▲▲▲
+
+        // ▼▼▼ [Changed] module.nodeRenderLocks -> window.MindMapNodes.nodeRenderLocks ▼▼▼
+        if (window.MindMapNodes.nodeRenderLocks.get(nodeId)) {
+            // console.log(`[Pipeline] [Log Detail] Node ${nodeId} skipped: Render lock active.`);
+            return;
+        }
+
+        // ▼▼▼ [Changed] module.pendingNodeUpdates -> window.MindMapNodes.pendingNodeUpdates ▼▼▼
+        const updateData = window.MindMapNodes.pendingNodeUpdates.get(nodeId);
+        if (!updateData) {
+            return;
+        }
+
+        // console.log(`[Pipeline] [Log Detail] Node ${nodeId} processing queue.`);
+
         const HANDLE_SIZE = RESIZE_HANDLE_SIZE;
         const nodeEntry = module.nodeObjectsById.get(nodeId);
         if (!nodeEntry) {
@@ -531,24 +534,24 @@
                 model.IsLoading = !!updateData.isLoading;
             }
             const zoomLevel = 2;
-
-            // ▼▼▼ [Perf] CSS3D 지원 노드는 거리와 무관하게 텍스처 생성 스킵 ▼▼▼
-            const cameraZ = module.camera?.position?.z || 0;
-            const threshold = 4000;
+
+            // ▼▼▼ [Perf] CSS3D 지원 노드는 거리와 무관하게 텍스처 생성 스킵 ▼▼▼
+            const cameraZ = module.camera?.position?.z || 0;
+            const threshold = 4000;
             const isHighMode = cameraZ < threshold;
             const supportsCss3d = model.contentType === 'text' ||
                 model.contentType === 'note' ||
                 model.contentType === 'memo' ||
                 model.contentType === 'markdown' ||
                 model.contentType === 'code';
-
-            // ★ [Fix] currentType이 'CSS'이면 카메라 거리와 무관하게 텍스처 생성 스킵
-            const isCssMode = nodeEntry.currentType === 'CSS';
-            const shouldSkipForCss = supportsCss3d && (isHighMode || cameraZ >= threshold || isCssMode);
-
-            if (shouldSkipForCss) {
-                const prevWidth = model.width || 0;
-                const prevHeight = model.height || 0;
+
+            // ★ [Fix] currentType이 'CSS'이면 카메라 거리와 무관하게 텍스처 생성 스킵
+            const isCssMode = nodeEntry.currentType === 'CSS';
+            const shouldSkipForCss = supportsCss3d && (isHighMode || cameraZ >= threshold || isCssMode);
+
+            if (shouldSkipForCss) {
+                const prevWidth = model.width || 0;
+                const prevHeight = model.height || 0;
                 const hasExplicitSizeUpdate =
                     (updateData.width !== null && updateData.width !== undefined) ||
                     (updateData.height !== null && updateData.height !== undefined);
@@ -558,10 +561,10 @@
                 model.Response = updateData.content;
                 if (updateData.width !== null && updateData.width !== undefined) model.width = updateData.width;
                 if (updateData.height !== null && updateData.height !== undefined) model.height = updateData.height;
-
-                // ▼▼▼ [Fix] Sync CSS3D/GL userData with updated model dimensions ▼▼▼
-                // Without this, syncCss3dContent() reads stale userData.worldWidth/Height
-                // and reverts the DOM size, causing content/node size mismatch.
+
+                // ▼▼▼ [Fix] Sync CSS3D/GL userData with updated model dimensions ▼▼▼
+                // Without this, syncCss3dContent() reads stale userData.worldWidth/Height
+                // and reverts the DOM size, causing content/node size mismatch.
                 if (nodeEntry.cssObject?.userData) {
                     nodeEntry.cssObject.userData.worldWidth = model.width || 400;
                     nodeEntry.cssObject.userData.worldHeight = model.height || 200;
@@ -619,43 +622,43 @@
                         inner.style.setProperty('--css3d-node-resolution-zoom', String(Math.max(1, Number(resolutionScale || 1))));
                         inner.style.setProperty('zoom', String(Math.max(1, Number(resolutionScale || 1))));
                     }
-                    const textarea = wrapper.querySelector('textarea');
-                    if (textarea) {
-                        textarea.style.width = '100%';
-                        textarea.style.height = '100%';
-                    }
-                }
-
-                // Update glow size if needed (no texture work)
-                const group = nodeEntry.glObject;
-                if (group) {
-                    if (!ENABLE_WEBGL_GLOW) {
-                        removeGlowMesh(group);
-                    } else if (window.MindMapGlowShader) {
-                        const glowMesh = group.getObjectByName('glow');
-                        const w = model.width || 400;
-                        const h = model.height || 200;
-                        if (glowMesh) {
-                            window.MindMapGlowShader.updateGlowSize(glowMesh, w, h, model.contentType || 'text');
-                            glowMesh.position.set(w / 2, -h / 2, 0); // [Fix] Z=0
-                        }
-                    }
-                }
-
-                // Keep WebGL body/tail geometry aligned with CSS3D size (prevents split)
-                if (nodeEntry.glObject) {
-                    const bodyMesh = nodeEntry.glObject.getObjectByName('body');
-                    const tailMesh = nodeEntry.glObject.getObjectByName('tail');
-                    const w = model.width || 400;
-                    const h = model.height || 200;
-
+                    const textarea = wrapper.querySelector('textarea');
+                    if (textarea) {
+                        textarea.style.width = '100%';
+                        textarea.style.height = '100%';
+                    }
+                }
+
+                // Update glow size if needed (no texture work)
+                const group = nodeEntry.glObject;
+                if (group) {
+                    if (!ENABLE_WEBGL_GLOW) {
+                        removeGlowMesh(group);
+                    } else if (window.MindMapGlowShader) {
+                        const glowMesh = group.getObjectByName('glow');
+                        const w = model.width || 400;
+                        const h = model.height || 200;
+                        if (glowMesh) {
+                            window.MindMapGlowShader.updateGlowSize(glowMesh, w, h, model.contentType || 'text');
+                            glowMesh.position.set(w / 2, -h / 2, 0); // [Fix] Z=0
+                        }
+                    }
+                }
+
+                // Keep WebGL body/tail geometry aligned with CSS3D size (prevents split)
+                if (nodeEntry.glObject) {
+                    const bodyMesh = nodeEntry.glObject.getObjectByName('body');
+                    const tailMesh = nodeEntry.glObject.getObjectByName('tail');
+                    const w = model.width || 400;
+                    const h = model.height || 200;
+
                     if (bodyMesh) {
                         const gp = bodyMesh.geometry && bodyMesh.geometry.parameters;
                         if (!gp || gp.width !== w || gp.height !== h) {
                             bodyMesh.geometry.dispose();
                             bodyMesh.geometry = new THREE.PlaneGeometry(w, h);
-                        }
-                        bodyMesh.position.set(w / 2, -h / 2, 0);
+                        }
+                        bodyMesh.position.set(w / 2, -h / 2, 0);
                         if (bodyMesh.material) {
                             bodyMesh.material.color?.setHex?.(0xffffff);
                             bodyMesh.material.needsUpdate = true;
@@ -665,79 +668,79 @@
                             applyImageCoverUv(bodyMesh, w, h);
                         }
                     }
-
-                    if (tailMesh) {
-                        tailMesh.position.set(w / 2, -h - 6, 0);
-                        if (tailMesh.material) {
-                            tailMesh.material.color?.setHex?.(0xffffff);
-                            tailMesh.material.needsUpdate = true;
-                        }
-                    }
-                }
-
-                // Persist size changes for CSS-rendered nodes as well.
-                // Without this, auto-grown AI note dimensions are not saved to the board.
-                const sizeChanged = Math.abs((model.width || 0) - prevWidth) > 0.5
-                    || Math.abs((model.height || 0) - prevHeight) > 0.5;
+
+                    if (tailMesh) {
+                        tailMesh.position.set(w / 2, -h - 6, 0);
+                        if (tailMesh.material) {
+                            tailMesh.material.color?.setHex?.(0xffffff);
+                            tailMesh.material.needsUpdate = true;
+                        }
+                    }
+                }
+
+                // Persist size changes for CSS-rendered nodes as well.
+                // Without this, auto-grown AI note dimensions are not saved to the board.
+                const sizeChanged = Math.abs((model.width || 0) - prevWidth) > 0.5
+                    || Math.abs((model.height || 0) - prevHeight) > 0.5;
                 if (!updateData.skipPersistDimensions && (sizeChanged || hasExplicitSizeUpdate) && module.dotNetHelper?.invokeMethodAsync) {
-                    try {
-                        await module.dotNetHelper.invokeMethodAsync(
-                            'UpdateNodeDimensions',
-                            nodeId,
-                            Math.round(model.width || 0),
-                            Math.round(model.height || 0)
-                        );
-                    } catch (e) {
-                        console.warn('[MindMapPipeline] Failed to persist CSS node dimensions:', e);
-                    }
-                }
-
-                window.MindMapNodes.pendingNodeUpdates.delete(nodeId);
-                window.MindMapNodes.nodeRenderLocks.set(nodeId, false);
-                return;
-            }
-            // ▲▲▲ [Perf] ▲▲▲
-
-            const width = (updateData.width !== null && updateData.width !== undefined) ?
-                updateData.width : (model.width || (model.contentType === 'image' ? 300 : 400));
-
-            // ▼▼▼ [Key change] Reduce height-change sensitivity (avoid jitter) ▼▼▼
-            // ▼▼▼ [Changed] Chunk nodes already have fixed maxScroll; skip recalculation ▼▼▼
-            // ▼▼▼ [Changed] Skip height recalculation for expanded nodes (they auto-grow in updateNodeContent) ▼▼▼
-            if ((model.contentType === 'text' || model.contentType === 'note') && !model.isChunkedText && !model.isExpanded) {
-                if (updateData.height === null || updateData.height === undefined) {
-                    const tempModel = { ...model, response: updateData.content };
-                    // When showFullAiResponse is true, do not cap height
-                    const defaultMaxHeight = module.aiNodeDefaultHeight || 200;
-                    const effectiveMaxHeight = module.showFullAiResponse ? 10000 : defaultMaxHeight;
-                    const { height: requiredHeight, maxScrollPx } = await window.MindMapTextureFactory.measureHtmlHeightAsync(tempModel, zoomLevel, width * zoomLevel, null, effectiveMaxHeight);
-
-                    // Keep AI/loading note nodes at least at the configured default height.
-                    // This prevents initial one-line collapse while streaming starts.
-                    const defaultPrompts = ['Note', 'Pasted Text', '에이전트 메모'];
-                    const promptText = model.prompt ?? model.Prompt ?? '';
-                    const isAiPrompt = !!promptText && !defaultPrompts.includes(promptText);
-                    const minPreferredHeight = (model.isLoading || isAiPrompt)
-                        ? (module.aiNodeDefaultHeight || 200)
-                        : 60;
-                    const normalizedRequiredHeight = Math.max(requiredHeight, minPreferredHeight);
-
-                    const currentHeight = (model.height || 0);
-                    // Update only if delta is >= 5px (was 2px -> 5px)
-                    if (Math.abs(currentHeight - normalizedRequiredHeight) > 5) {
-                        model.height = normalizedRequiredHeight;
-                        model.maxScroll = maxScrollPx / zoomLevel;
-                        model.scrollOffset = Math.min(model.scrollOffset || 0, model.maxScroll);
-                        updateData.height = normalizedRequiredHeight;
-                        try {
-                            module.dotNetHelper?.invokeMethodAsync('UpdateNodeDimensions', nodeId, Math.round(width), Math.round(normalizedRequiredHeight));
-                        } catch { }
-                    } else {
-                        // If the change is tiny, keep the existing height (avoid infinite loop)
-                        updateData.height = currentHeight;
-                    }
-                }
-            }
+                    try {
+                        await module.dotNetHelper.invokeMethodAsync(
+                            'UpdateNodeDimensions',
+                            nodeId,
+                            Math.round(model.width || 0),
+                            Math.round(model.height || 0)
+                        );
+                    } catch (e) {
+                        console.warn('[MindMapPipeline] Failed to persist CSS node dimensions:', e);
+                    }
+                }
+
+                window.MindMapNodes.pendingNodeUpdates.delete(nodeId);
+                window.MindMapNodes.nodeRenderLocks.set(nodeId, false);
+                return;
+            }
+            // ▲▲▲ [Perf] ▲▲▲
+
+            const width = (updateData.width !== null && updateData.width !== undefined) ?
+                updateData.width : (model.width || (model.contentType === 'image' ? 300 : 400));
+
+            // ▼▼▼ [Key change] Reduce height-change sensitivity (avoid jitter) ▼▼▼
+            // ▼▼▼ [Changed] Chunk nodes already have fixed maxScroll; skip recalculation ▼▼▼
+            // ▼▼▼ [Changed] Skip height recalculation for expanded nodes (they auto-grow in updateNodeContent) ▼▼▼
+            if ((model.contentType === 'text' || model.contentType === 'note') && !model.isChunkedText && !model.isExpanded) {
+                if (updateData.height === null || updateData.height === undefined) {
+                    const tempModel = { ...model, response: updateData.content };
+                    // When showFullAiResponse is true, do not cap height
+                    const defaultMaxHeight = module.aiNodeDefaultHeight || 200;
+                    const effectiveMaxHeight = module.showFullAiResponse ? 10000 : defaultMaxHeight;
+                    const { height: requiredHeight, maxScrollPx } = await window.MindMapTextureFactory.measureHtmlHeightAsync(tempModel, zoomLevel, width * zoomLevel, null, effectiveMaxHeight);
+
+                    // Keep AI/loading note nodes at least at the configured default height.
+                    // This prevents initial one-line collapse while streaming starts.
+                    const defaultPrompts = ['Note', 'Pasted Text', '에이전트 메모'];
+                    const promptText = model.prompt ?? model.Prompt ?? '';
+                    const isAiPrompt = !!promptText && !defaultPrompts.includes(promptText);
+                    const minPreferredHeight = (model.isLoading || isAiPrompt)
+                        ? (module.aiNodeDefaultHeight || 200)
+                        : 60;
+                    const normalizedRequiredHeight = Math.max(requiredHeight, minPreferredHeight);
+
+                    const currentHeight = (model.height || 0);
+                    // Update only if delta is >= 5px (was 2px -> 5px)
+                    if (Math.abs(currentHeight - normalizedRequiredHeight) > 5) {
+                        model.height = normalizedRequiredHeight;
+                        model.maxScroll = maxScrollPx / zoomLevel;
+                        model.scrollOffset = Math.min(model.scrollOffset || 0, model.maxScroll);
+                        updateData.height = normalizedRequiredHeight;
+                        try {
+                            module.dotNetHelper?.invokeMethodAsync('UpdateNodeDimensions', nodeId, Math.round(width), Math.round(normalizedRequiredHeight));
+                        } catch { }
+                    } else {
+                        // If the change is tiny, keep the existing height (avoid infinite loop)
+                        updateData.height = currentHeight;
+                    }
+                }
+            }
             // ▲▲▲ [Changed] ▲▲▲
             // ▲▲▲ [Key change] ▲▲▲
 
@@ -815,87 +818,87 @@
 
             // ★ Invalidate LOD cache when content changes
             window.MindMapTextLOD?.invalidateNodeCache?.(nodeId);
-
-            const updateDataWithScroll = {
-                ...updateData,
-                scrollDelta: updateData.scrollDelta || 0
-            };
-
-            // ★ Troika 모드 체크: text/note/code 노드면 배경 전용 텍스처 사용
-            // ★ Code nodes always use Troika for text rendering
-            const isTroikaMode = (model.contentType === 'code') || // Code nodes always use Troika
-                (window.MindMapNodes?.getTextRenderMode?.() === 'troika'
-                    && (model.contentType === 'text' || model.contentType === 'note')
-                    && !model.isChunkedText);
-
-            let textures, w, h;
-            const existingTextures = window.MindMapNodes.textureCache.get(nodeId);
-
-            if (isTroikaMode) {
-                // ★ Troika 최적화: 이미 캐시된 텍스처가 있고, 크기와 내용이 동일하면 재사용
-                const canReuseTexture = existingTextures?.default?.body
-                    && existingTextures._cachedWidth === model.width
-                    && existingTextures._cachedHeight === model.height
-                    && existingTextures._cachedContent === model.response; // ★ Content change check
-
-                if (canReuseTexture) {
-                    // 캐시된 텍스처 재사용 (텍스처 재생성 스킵)
-                    textures = existingTextures;
-                    w = model.width;
-                    h = model.height;
-                } else {
-                    // 배경 텍스처 생성
-                    const result = await window.MindMapTextureFactory.generateTroikaBackgroundTextures(module, model, model.width, model.height);
-                    textures = result.textures;
-                    // 캐시 메타데이터 저장
-                    textures._cachedWidth = model.width;
-                    textures._cachedHeight = model.height;
-                    textures._cachedContent = model.response; // ★ Track content for change detection
-                    w = result.width;
-                    h = result.height;
-                }
-            } else {
-                // Canvas 모드: 기존 방식 (텍스트 포함)
-                const isResizeUpdate = updateData.width !== undefined || updateData.height !== undefined;
-                const isBatchExpand = updateData.skipSelected === true; // ★ Batch expand operation
-
-                // 고정 품질 렌더링 (LOD 품질 스케일 제거)
-                const qualityScale = 1.0;
-                console.log(`[processRenderQueue] Canvas mode for ${nodeId}, qualityScale=${qualityScale}, isResize=${isResizeUpdate}, isBatch=${isBatchExpand}`);
-                const result = await window.MindMapTextureFactory.generateAndCacheTextures(module, model, window.MindMapNodes.imageCache, updateDataWithScroll, qualityScale);
-                textures = result.textures;
-                w = result.width;
-                h = result.height;
-
-                // 캐시 메타데이터 (콘텐츠 변경 감지용)
-                if (textures.default?.body) {
-                    textures.default.body._cachedContent = model.response ?? '';
-                }
-            }
-
-            // ★ 기존 텍스처 dispose (Troika에서 재사용한 경우 제외)
-            if (existingTextures && existingTextures !== textures) {
-                enqueueDispose(existingTextures.default?.body);
-                enqueueDispose(existingTextures.selected?.body);
-                enqueueDispose(existingTextures.glow?.texture);
-            }
-            window.MindMapNodes.textureCache.set(nodeId, textures);
-
-            const isSelected = module.multiSelectedNodeIds.has(nodeId);
-            // ★ [Fix] If selected texture is null (skipSelected mode), use default texture
-            const active = (isSelected && textures.selected?.body) ? textures.selected : textures.default;
-            const group = nodeEntry.glObject;
-
-            const CORNER_RADIUS = 20;
-            const OUTLINE_SHRINK = 2;
-            const OUTLINE_RADIUS = Math.max(1, CORNER_RADIUS - 1);
-            const CHAMFER_SIZE = 16;
-
-            if (group) {
-                const bodyMesh = group.getObjectByName('body');
-                const tailMesh = group.getObjectByName('tail');
-                let glowMesh = group.getObjectByName('glow');
-                const outline = group.getObjectByName('outline');
+
+            const updateDataWithScroll = {
+                ...updateData,
+                scrollDelta: updateData.scrollDelta || 0
+            };
+
+            // ★ Troika 모드 체크: text/note/code 노드면 배경 전용 텍스처 사용
+            // ★ Code nodes always use Troika for text rendering
+            const isTroikaMode = (model.contentType === 'code') || // Code nodes always use Troika
+                (window.MindMapNodes?.getTextRenderMode?.() === 'troika'
+                    && (model.contentType === 'text' || model.contentType === 'note')
+                    && !model.isChunkedText);
+
+            let textures, w, h;
+            const existingTextures = window.MindMapNodes.textureCache.get(nodeId);
+
+            if (isTroikaMode) {
+                // ★ Troika 최적화: 이미 캐시된 텍스처가 있고, 크기와 내용이 동일하면 재사용
+                const canReuseTexture = existingTextures?.default?.body
+                    && existingTextures._cachedWidth === model.width
+                    && existingTextures._cachedHeight === model.height
+                    && existingTextures._cachedContent === model.response; // ★ Content change check
+
+                if (canReuseTexture) {
+                    // 캐시된 텍스처 재사용 (텍스처 재생성 스킵)
+                    textures = existingTextures;
+                    w = model.width;
+                    h = model.height;
+                } else {
+                    // 배경 텍스처 생성
+                    const result = await window.MindMapTextureFactory.generateTroikaBackgroundTextures(module, model, model.width, model.height);
+                    textures = result.textures;
+                    // 캐시 메타데이터 저장
+                    textures._cachedWidth = model.width;
+                    textures._cachedHeight = model.height;
+                    textures._cachedContent = model.response; // ★ Track content for change detection
+                    w = result.width;
+                    h = result.height;
+                }
+            } else {
+                // Canvas 모드: 기존 방식 (텍스트 포함)
+                const isResizeUpdate = updateData.width !== undefined || updateData.height !== undefined;
+                const isBatchExpand = updateData.skipSelected === true; // ★ Batch expand operation
+
+                // 고정 품질 렌더링 (LOD 품질 스케일 제거)
+                const qualityScale = 1.0;
+                console.log(`[processRenderQueue] Canvas mode for ${nodeId}, qualityScale=${qualityScale}, isResize=${isResizeUpdate}, isBatch=${isBatchExpand}`);
+                const result = await window.MindMapTextureFactory.generateAndCacheTextures(module, model, window.MindMapNodes.imageCache, updateDataWithScroll, qualityScale);
+                textures = result.textures;
+                w = result.width;
+                h = result.height;
+
+                // 캐시 메타데이터 (콘텐츠 변경 감지용)
+                if (textures.default?.body) {
+                    textures.default.body._cachedContent = model.response ?? '';
+                }
+            }
+
+            // ★ 기존 텍스처 dispose (Troika에서 재사용한 경우 제외)
+            if (existingTextures && existingTextures !== textures) {
+                enqueueDispose(existingTextures.default?.body);
+                enqueueDispose(existingTextures.selected?.body);
+                enqueueDispose(existingTextures.glow?.texture);
+            }
+            window.MindMapNodes.textureCache.set(nodeId, textures);
+
+            const isSelected = module.multiSelectedNodeIds.has(nodeId);
+            // ★ [Fix] If selected texture is null (skipSelected mode), use default texture
+            const active = (isSelected && textures.selected?.body) ? textures.selected : textures.default;
+            const group = nodeEntry.glObject;
+
+            const CORNER_RADIUS = 20;
+            const OUTLINE_SHRINK = 2;
+            const OUTLINE_RADIUS = Math.max(1, CORNER_RADIUS - 1);
+            const CHAMFER_SIZE = 16;
+
+            if (group) {
+                const bodyMesh = group.getObjectByName('body');
+                const tailMesh = group.getObjectByName('tail');
+                let glowMesh = group.getObjectByName('glow');
+                const outline = group.getObjectByName('outline');
                 if (!ENABLE_WEBGL_GLOW) {
                     glowMesh = removeGlowMesh(group);
                 }
@@ -907,18 +910,18 @@
                     if (!gp || gp.width !== w || gp.height !== h) {
                         bodyMesh.geometry.dispose();
                         bodyMesh.geometry = new THREE.PlaneGeometry(w, h);
-
-                        if (outline) {
-                            outline.geometry.dispose();
-                            outline.geometry = createRoundedRectGeometry(
-                                w - OUTLINE_SHRINK,
-                                h - OUTLINE_SHRINK,
-                                OUTLINE_RADIUS
-                            );
-                        }
-                    }
-                    if (active?.body) {
-                        bodyMesh.material.map = active.body;
+
+                        if (outline) {
+                            outline.geometry.dispose();
+                            outline.geometry = createRoundedRectGeometry(
+                                w - OUTLINE_SHRINK,
+                                h - OUTLINE_SHRINK,
+                                OUTLINE_RADIUS
+                            );
+                        }
+                    }
+                    if (active?.body) {
+                        bodyMesh.material.map = active.body;
                     }
                     bodyMesh.material.color.setHex(0xffffff);
                     bodyMesh.material.needsUpdate = true;
@@ -939,53 +942,53 @@
                         outline.position.z = 0; // [Fix] Z=0
                         outline.visible = false; // Disabled - using SDF glow instead
                     }
-                }
-                if (tailMesh) {
-                    if (active?.tail) {
-                        tailMesh.material.map = active.tail;
-                        tailMesh.material.needsUpdate = true;
-                    }
-                    tailMesh.position.set(w / 2, -h - 6, 0);
-                }
-
+                }
+                if (tailMesh) {
+                    if (active?.tail) {
+                        tailMesh.material.map = active.tail;
+                        tailMesh.material.needsUpdate = true;
+                    }
+                    tailMesh.position.set(w / 2, -h - 6, 0);
+                }
+
                 // ▼▼▼ [SDF Glow] Use shader-based glow (no textures!) ▼▼▼
-                if (ENABLE_WEBGL_GLOW && window.MindMapGlowShader) {
-                    const contentType = model.contentType || 'text';
-                    if (glowMesh) {
-                        window.MindMapGlowShader.updateGlowSize(glowMesh, w, h, contentType);
-                        window.MindMapGlowShader.updateGlowSelection(glowMesh, isSelected);
-                        glowMesh.position.set(w / 2, -h / 2, 0); // [Fix] Z=0
-                        glowMesh.renderOrder = baseRenderOrder - 5;
-                    } else {
-                        const newGlow = window.MindMapGlowShader.createSDFGlowMesh(w, h, isSelected, contentType);
-                        newGlow.position.set(w / 2, -h / 2, 0); // [Fix] Z=0
-                        newGlow.renderOrder = baseRenderOrder - 5;
-                        // ★ 카메라 거리에 따라 초기 가시성 설정
-                        const cameraZ = module.camera?.position?.z ?? Infinity;
-                        const threshold = 4000;
-                        newGlow.visible = cameraZ < threshold;
-                        group.add(newGlow);
-                    }
-                }
-                // ▲▲▲ [SDF Glow] ▲▲▲
-
-                // ▼▼▼ [Changed] Update resize handles (4 corners + optional 4 edges) ▼▼▼
-                if (model.contentType !== 'pdf') {
-                    // [Fix] 이미지 노드 리사이즈 핸들 크기 통일 (Note와 동일한 16px)
-                    const actualHandleSize = HANDLE_SIZE;
-
-                    const edgeWidthLength = Math.max(10, w - actualHandleSize * 2);
-                    const edgeHeightLength = Math.max(10, h - actualHandleSize * 2);
-
-                    const handleConfigs = {
-                        // ▼▼▼ [Fix] Corners - Z값을 0으로 통일하여 시차(Parallax) 완전 제거 ▼▼▼
-                        'resizeHandle_TL': { x: actualHandleSize / 2, y: -actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 },
-                        'resizeHandle_TR': { x: w - actualHandleSize / 2, y: -actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 },
-                        'resizeHandle_BL': { x: actualHandleSize / 2, y: -h + actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 },
-                        'resizeHandle_BR': { x: w - actualHandleSize / 2, y: -h + actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 }
-                        // ▲▲▲ [Fix] ▲▲▲
-                    };
-
+                if (ENABLE_WEBGL_GLOW && window.MindMapGlowShader) {
+                    const contentType = model.contentType || 'text';
+                    if (glowMesh) {
+                        window.MindMapGlowShader.updateGlowSize(glowMesh, w, h, contentType);
+                        window.MindMapGlowShader.updateGlowSelection(glowMesh, isSelected);
+                        glowMesh.position.set(w / 2, -h / 2, 0); // [Fix] Z=0
+                        glowMesh.renderOrder = baseRenderOrder - 5;
+                    } else {
+                        const newGlow = window.MindMapGlowShader.createSDFGlowMesh(w, h, isSelected, contentType);
+                        newGlow.position.set(w / 2, -h / 2, 0); // [Fix] Z=0
+                        newGlow.renderOrder = baseRenderOrder - 5;
+                        // ★ 카메라 거리에 따라 초기 가시성 설정
+                        const cameraZ = module.camera?.position?.z ?? Infinity;
+                        const threshold = 4000;
+                        newGlow.visible = cameraZ < threshold;
+                        group.add(newGlow);
+                    }
+                }
+                // ▲▲▲ [SDF Glow] ▲▲▲
+
+                // ▼▼▼ [Changed] Update resize handles (4 corners + optional 4 edges) ▼▼▼
+                if (model.contentType !== 'pdf') {
+                    // [Fix] 이미지 노드 리사이즈 핸들 크기 통일 (Note와 동일한 16px)
+                    const actualHandleSize = HANDLE_SIZE;
+
+                    const edgeWidthLength = Math.max(10, w - actualHandleSize * 2);
+                    const edgeHeightLength = Math.max(10, h - actualHandleSize * 2);
+
+                    const handleConfigs = {
+                        // ▼▼▼ [Fix] Corners - Z값을 0으로 통일하여 시차(Parallax) 완전 제거 ▼▼▼
+                        'resizeHandle_TL': { x: actualHandleSize / 2, y: -actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 },
+                        'resizeHandle_TR': { x: w - actualHandleSize / 2, y: -actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 },
+                        'resizeHandle_BL': { x: actualHandleSize / 2, y: -h + actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 },
+                        'resizeHandle_BR': { x: w - actualHandleSize / 2, y: -h + actualHandleSize / 2, w: actualHandleSize, h: actualHandleSize, z: 0 }
+                        // ▲▲▲ [Fix] ▲▲▲
+                    };
+
                     if (model.contentType !== 'image') {
                         Object.assign(handleConfigs, {
                             // ▼▼▼ [Fix] Edges - Z값을 0으로 통일 ▼▼▼
@@ -996,17 +999,17 @@
                             // ▲▲▲ [Fix] ▲▲▲
                         });
                     }
-
-                    // Iterate all possible handles to update position OR hide if not needed
-                    const allHandleNames = [
-                        'resizeHandle_TL', 'resizeHandle_TR', 'resizeHandle_BL', 'resizeHandle_BR',
-                        'resizeHandle_T', 'resizeHandle_B', 'resizeHandle_L', 'resizeHandle_R'
-                    ];
-
-                    allHandleNames.forEach(name => {
-                        const handle = group.getObjectByName(name);
-                        const cfg = handleConfigs[name];
-
+
+                    // Iterate all possible handles to update position OR hide if not needed
+                    const allHandleNames = [
+                        'resizeHandle_TL', 'resizeHandle_TR', 'resizeHandle_BL', 'resizeHandle_BR',
+                        'resizeHandle_T', 'resizeHandle_B', 'resizeHandle_L', 'resizeHandle_R'
+                    ];
+
+                    allHandleNames.forEach(name => {
+                        const handle = group.getObjectByName(name);
+                        const cfg = handleConfigs[name];
+
                         if (handle) {
                             if (cfg) {
                                 // Active handle: update position/size and ensure visible
@@ -1027,7 +1030,7 @@
                                 handle.visible = false;
                             }
                         }
-                    });
+                    });
                 }
                 // ▲▲▲ [Changed] ▲▲▲
 
@@ -1055,26 +1058,26 @@
                 }
             }
         } catch (err) {
-            console.error(`[Pipeline] Render Node ${nodeId} Failed:`, err);
-        } finally {
-            window.MindMapNodes.nodeRenderLocks.set(nodeId, false);
-            // console.timeEnd(`[Pipeline] 6. Render Node ${nodeId}`);
-
-            // If another update arrived while processing, re-run (with a small delay)
-            if (window.MindMapNodes.pendingNodeUpdates.has(nodeId)) {
-                setTimeout(() => enqueueRender(module, nodeId), 50);
-            }
-        }
-    }
-
-    // --- Resizing handlers (keep existing behavior) ---
-
-    // ▼▼▼ [Changed] Add corner parameter for four-corner resizing ▼▼▼
-    function startResizing(module, nodeId, startX, startY, corner = 'BR') {
-        const nodeEntry = module.nodeObjectsById.get(nodeId);
-        if (!nodeEntry) return false;
-        if (nodeEntry.model.contentType === 'pdf') return false;
-
+            console.error(`[Pipeline] Render Node ${nodeId} Failed:`, err);
+        } finally {
+            window.MindMapNodes.nodeRenderLocks.set(nodeId, false);
+            // console.timeEnd(`[Pipeline] 6. Render Node ${nodeId}`);
+
+            // If another update arrived while processing, re-run (with a small delay)
+            if (window.MindMapNodes.pendingNodeUpdates.has(nodeId)) {
+                setTimeout(() => enqueueRender(module, nodeId), 50);
+            }
+        }
+    }
+
+    // --- Resizing handlers (keep existing behavior) ---
+
+    // ▼▼▼ [Changed] Add corner parameter for four-corner resizing ▼▼▼
+    function startResizing(module, nodeId, startX, startY, corner = 'BR') {
+        const nodeEntry = module.nodeObjectsById.get(nodeId);
+        if (!nodeEntry) return false;
+        if (nodeEntry.model.contentType === 'pdf') return false;
+
         module.isResizing = true;
         module.resizingNodeId = nodeId;
         module.resizeCorner = corner; // TL, TR, BL, BR
@@ -1095,203 +1098,203 @@
         window.MindMapInteractions?.setBrowserSelectionLock?.(true, 'resize');
         document.body.classList.add('is-resizing');
         module.resizeStartMousePos = { x: startX, y: startY };
-        module.resizeStartDimensions = {
-            w: nodeEntry.model.width || 400,
-            h: nodeEntry.model.height || 200
-        };
-        // Store initial position from the active render object (CSS/GL) to avoid
-        // image-node jumps when CSS and GL are slightly out of sync.
-        const activePos = module.resizeNodeObject?.position
-            || nodeEntry.cssObject?.position
-            || nodeEntry.glObject?.position
-            || { x: 0, y: 0 };
-        module.resizeStartPosition = {
-            x: activePos.x,
-            y: activePos.y
-        };
-
-        // Force immediate CSS/GL transform alignment at resize start.
-        if (nodeEntry.glObject) {
-            nodeEntry.glObject.position.x = activePos.x;
-            nodeEntry.glObject.position.y = activePos.y;
-        }
-        if (nodeEntry.cssObject) {
-            nodeEntry.cssObject.position.x = activePos.x;
-            nodeEntry.cssObject.position.y = activePos.y;
-            nodeEntry.cssObject.updateMatrixWorld(true);
-        }
-
-        // ▼▼▼ [Fix] 리사이즈 중 CSS transition 비활성화하여 즉시 크기 변경 ▼▼▼
-        if (nodeEntry.cssObject && nodeEntry.cssObject.element) {
-            const wrapper = nodeEntry.cssObject.element;
-            wrapper.style.transition = 'none';
-            const inner = wrapper.firstElementChild;
-            if (inner) {
-                inner.style.transition = 'none';
-            }
-        }
-        // ▲▲▲ [Fix] ▲▲▲
-
-        // ▼▼▼ [UndoRedo] Capture before-state for undo ▼▼▼
-        if (module.dotNetHelper) {
-            try { module.dotNetHelper.invokeMethodAsync('StartResizeCapture', nodeId); } catch { }
-        }
-        // ▲▲▲ [UndoRedo] ▲▲▲
-
-        return true;
-    }
-    // ▲▲▲ [Changed] ▲▲▲
-
-    function doResizing(module, currentX, currentY) {
+        module.resizeStartDimensions = {
+            w: nodeEntry.model.width || 400,
+            h: nodeEntry.model.height || 200
+        };
+        // Store initial position from the active render object (CSS/GL) to avoid
+        // image-node jumps when CSS and GL are slightly out of sync.
+        const activePos = module.resizeNodeObject?.position
+            || nodeEntry.cssObject?.position
+            || nodeEntry.glObject?.position
+            || { x: 0, y: 0 };
+        module.resizeStartPosition = {
+            x: activePos.x,
+            y: activePos.y
+        };
+
+        // Force immediate CSS/GL transform alignment at resize start.
+        if (nodeEntry.glObject) {
+            nodeEntry.glObject.position.x = activePos.x;
+            nodeEntry.glObject.position.y = activePos.y;
+        }
+        if (nodeEntry.cssObject) {
+            nodeEntry.cssObject.position.x = activePos.x;
+            nodeEntry.cssObject.position.y = activePos.y;
+            nodeEntry.cssObject.updateMatrixWorld(true);
+        }
+
+        // ▼▼▼ [Fix] 리사이즈 중 CSS transition 비활성화하여 즉시 크기 변경 ▼▼▼
+        if (nodeEntry.cssObject && nodeEntry.cssObject.element) {
+            const wrapper = nodeEntry.cssObject.element;
+            wrapper.style.transition = 'none';
+            const inner = wrapper.firstElementChild;
+            if (inner) {
+                inner.style.transition = 'none';
+            }
+        }
+        // ▲▲▲ [Fix] ▲▲▲
+
+        // ▼▼▼ [UndoRedo] Capture before-state for undo ▼▼▼
+        if (module.dotNetHelper) {
+            try { module.dotNetHelper.invokeMethodAsync('StartResizeCapture', nodeId); } catch { }
+        }
+        // ▲▲▲ [UndoRedo] ▲▲▲
+
+        return true;
+    }
+    // ▲▲▲ [Changed] ▲▲▲
+
+    function doResizing(module, currentX, currentY) {
         if (!module.isResizing || !module.resizeNodeObject) return;
         // ▼▼▼ [Changed] Cap max node size: X=2000, Y=4000 ▼▼▼
         const MAX_NODE_WIDTH = 2000;
         const MAX_NODE_HEIGHT = 4000;
         // ▲▲▲ [Changed] ▲▲▲
-
-        const vfov = (module.camera.fov * Math.PI) / 180;
-        const viewHeight = 2 * Math.tan(vfov / 2) * module.camera.position.z;
-        const viewWidth = viewHeight * module.camera.aspect;
-        const screenToWorldFactorX = viewWidth / module.container.clientWidth;
-        const screenToWorldFactorY = viewHeight / module.container.clientHeight;
-        const worldDeltaX = (currentX - module.resizeStartMousePos.x) * screenToWorldFactorX;
-        // ▼▼▼ [Fix] Negate Y delta: screen Y increases downward, world Y increases upward ▼▼▼
-        const worldDeltaY = -(currentY - module.resizeStartMousePos.y) * screenToWorldFactorY;
-
-        const HANDLE_SIZE = RESIZE_HANDLE_SIZE;
-        // ▼▼▼ [Changed] Use stored nodeId (CSS3D mode compatible) ▼▼▼
-        const nodeId = module.resizingNodeId || (module.resizeNodeObject.userData?.nodeId || module.resizeNodeObject.element?.dataset?.nodeId);
-        const nodeEntry = module.nodeObjectsById.get(nodeId);
-        if (!nodeEntry) {
-            console.warn('[Pipeline] doResizing: nodeEntry not found for', nodeId);
-            return;
-        }
-
-        const corner = module.resizeCorner || 'BR';
-        const startW = module.resizeStartDimensions.w;
-        const startH = module.resizeStartDimensions.h;
-        const startX = module.resizeStartPosition.x;
-        const startY = module.resizeStartPosition.y;
-
-        let finalWidth, finalHeight, newPosX, newPosY;
-
-        // ▼▼▼ [Changed] Eight-direction resize logic (4 corners + 4 edges) ▼▼▼
-        // Node position is top-left corner in Three.js (Y increases upward)
-        // Depending on handle, we compute size and position differently
-        switch (corner) {
-            // === Corners (diagonal resize) ===
-            case 'TL': // Top-Left: anchor bottom-right, move top-left
-                finalWidth = startW - worldDeltaX;
-                finalHeight = startH + worldDeltaY;
-                newPosX = startX + worldDeltaX;
-                newPosY = startY + worldDeltaY;
-                break;
-            case 'TR': // Top-Right: anchor bottom-left, expand right/up
-                finalWidth = startW + worldDeltaX;
-                finalHeight = startH + worldDeltaY;
-                newPosX = startX;
-                newPosY = startY + worldDeltaY;
-                break;
-            case 'BL': // Bottom-Left: anchor top-right, expand left/down
-                finalWidth = startW - worldDeltaX;
-                finalHeight = startH - worldDeltaY;
-                newPosX = startX + worldDeltaX;
-                newPosY = startY;
-                break;
-            case 'BR': // Bottom-Right: anchor top-left (original behavior)
-                finalWidth = startW + worldDeltaX;
-                finalHeight = startH - worldDeltaY;
-                newPosX = startX;
-                newPosY = startY;
-                break;
-            // === Edges (single-direction resize) ===
-            case 'T': // Top edge: vertical only, anchor bottom
-                finalWidth = startW;
-                finalHeight = startH + worldDeltaY;
-                newPosX = startX;
-                newPosY = startY + worldDeltaY;
-                break;
-            case 'B': // Bottom edge: vertical only, anchor top
-                finalWidth = startW;
-                finalHeight = startH - worldDeltaY;
-                newPosX = startX;
-                newPosY = startY;
-                break;
-            case 'L': // Left edge: horizontal only, anchor right
-                finalWidth = startW - worldDeltaX;
-                finalHeight = startH;
-                newPosX = startX + worldDeltaX;
-                newPosY = startY;
-                break;
-            case 'R': // Right edge: horizontal only, anchor left
-                finalWidth = startW + worldDeltaX;
-                finalHeight = startH;
-                newPosX = startX;
-                newPosY = startY;
-                break;
-            default:
-                finalWidth = startW + worldDeltaX;
-                finalHeight = startH - worldDeltaY;
-                newPosX = startX;
-                newPosY = startY;
-                break;
-        }
-
+
+        const vfov = (module.camera.fov * Math.PI) / 180;
+        const viewHeight = 2 * Math.tan(vfov / 2) * module.camera.position.z;
+        const viewWidth = viewHeight * module.camera.aspect;
+        const screenToWorldFactorX = viewWidth / module.container.clientWidth;
+        const screenToWorldFactorY = viewHeight / module.container.clientHeight;
+        const worldDeltaX = (currentX - module.resizeStartMousePos.x) * screenToWorldFactorX;
+        // ▼▼▼ [Fix] Negate Y delta: screen Y increases downward, world Y increases upward ▼▼▼
+        const worldDeltaY = -(currentY - module.resizeStartMousePos.y) * screenToWorldFactorY;
+
+        const HANDLE_SIZE = RESIZE_HANDLE_SIZE;
+        // ▼▼▼ [Changed] Use stored nodeId (CSS3D mode compatible) ▼▼▼
+        const nodeId = module.resizingNodeId || (module.resizeNodeObject.userData?.nodeId || module.resizeNodeObject.element?.dataset?.nodeId);
+        const nodeEntry = module.nodeObjectsById.get(nodeId);
+        if (!nodeEntry) {
+            console.warn('[Pipeline] doResizing: nodeEntry not found for', nodeId);
+            return;
+        }
+
+        const corner = module.resizeCorner || 'BR';
+        const startW = module.resizeStartDimensions.w;
+        const startH = module.resizeStartDimensions.h;
+        const startX = module.resizeStartPosition.x;
+        const startY = module.resizeStartPosition.y;
+
+        let finalWidth, finalHeight, newPosX, newPosY;
+
+        // ▼▼▼ [Changed] Eight-direction resize logic (4 corners + 4 edges) ▼▼▼
+        // Node position is top-left corner in Three.js (Y increases upward)
+        // Depending on handle, we compute size and position differently
+        switch (corner) {
+            // === Corners (diagonal resize) ===
+            case 'TL': // Top-Left: anchor bottom-right, move top-left
+                finalWidth = startW - worldDeltaX;
+                finalHeight = startH + worldDeltaY;
+                newPosX = startX + worldDeltaX;
+                newPosY = startY + worldDeltaY;
+                break;
+            case 'TR': // Top-Right: anchor bottom-left, expand right/up
+                finalWidth = startW + worldDeltaX;
+                finalHeight = startH + worldDeltaY;
+                newPosX = startX;
+                newPosY = startY + worldDeltaY;
+                break;
+            case 'BL': // Bottom-Left: anchor top-right, expand left/down
+                finalWidth = startW - worldDeltaX;
+                finalHeight = startH - worldDeltaY;
+                newPosX = startX + worldDeltaX;
+                newPosY = startY;
+                break;
+            case 'BR': // Bottom-Right: anchor top-left (original behavior)
+                finalWidth = startW + worldDeltaX;
+                finalHeight = startH - worldDeltaY;
+                newPosX = startX;
+                newPosY = startY;
+                break;
+            // === Edges (single-direction resize) ===
+            case 'T': // Top edge: vertical only, anchor bottom
+                finalWidth = startW;
+                finalHeight = startH + worldDeltaY;
+                newPosX = startX;
+                newPosY = startY + worldDeltaY;
+                break;
+            case 'B': // Bottom edge: vertical only, anchor top
+                finalWidth = startW;
+                finalHeight = startH - worldDeltaY;
+                newPosX = startX;
+                newPosY = startY;
+                break;
+            case 'L': // Left edge: horizontal only, anchor right
+                finalWidth = startW - worldDeltaX;
+                finalHeight = startH;
+                newPosX = startX + worldDeltaX;
+                newPosY = startY;
+                break;
+            case 'R': // Right edge: horizontal only, anchor left
+                finalWidth = startW + worldDeltaX;
+                finalHeight = startH;
+                newPosX = startX;
+                newPosY = startY;
+                break;
+            default:
+                finalWidth = startW + worldDeltaX;
+                finalHeight = startH - worldDeltaY;
+                newPosX = startX;
+                newPosY = startY;
+                break;
+        }
+
         // Clamp size
         const minClampedSize = clampRemoteFleetResizeDimensions(nodeEntry.model, finalWidth, finalHeight);
         let clampedWidth = Math.min(MAX_NODE_WIDTH, minClampedSize.width);
         let clampedHeight = Math.min(MAX_NODE_HEIGHT, minClampedSize.height);
-
-        // ▼▼▼ [Image Resize Fix] Remove specific Ratio Preservation for now (Treat as normal nodes) ▼▼▼
-        // Normal nodes Logic (apply to all)
-        // Adjust position if size was clamped (keep anchor point fixed)
-        if (corner === 'TL' || corner === 'BL' || corner === 'L') {
-            // Left handles: position adjusts with width changes
-            const widthDiff = finalWidth - clampedWidth;
-            newPosX += widthDiff;
-        }
-        if (corner === 'TL' || corner === 'TR' || corner === 'T') {
-            // Top handles: position adjusts with height changes
-            const heightDiff = finalHeight - clampedHeight;
-            newPosY -= heightDiff;
-        }
-        // ▲▲▲ [Image Resize Fix] ▲▲▲
-        // ▲▲▲ [Image Resize Fix] ▲▲▲
-
-        finalWidth = clampedWidth;
-        finalHeight = clampedHeight;
-        // ▲▲▲ [Changed] ▲▲▲
-
-        // ▼▼▼ [Refactor] 스냅 현상 제거: 실수형 크기/좌표 그대로 사용 ▼▼▼
-        nodeEntry.model.width = finalWidth;
-        nodeEntry.model.height = finalHeight;
-
-        // ▼▼▼ [Changed] Update node position for corner resizing ▼▼▼
-        if (nodeEntry.glObject) {
-            nodeEntry.glObject.position.x = newPosX;
-            nodeEntry.glObject.position.y = newPosY;
-        }
-        if (nodeEntry.cssObject) {
-            nodeEntry.cssObject.position.x = newPosX;
-            nodeEntry.cssObject.position.y = newPosY;
-            // ▼▼▼ [Fix] CSS3D matrixWorld 즉시 갱신하여 CSS3DRenderer가 새 위치를 반영하도록 보장 ▼▼▼
-            nodeEntry.cssObject.updateMatrixWorld(true);
-            // ▲▲▲ [Fix] ▲▲▲
-        }
-        // ▼▼▼ [Fix] model position도 동기화하여 다른 sync 로직과의 일관성 보장 ▼▼▼
-        nodeEntry.model.positionX = newPosX;
-        nodeEntry.model.positionY = newPosY;
-        // ▲▲▲ [Fix] ▲▲▲
-        // ▲▲▲ [Changed] ▲▲▲
-
+
+        // ▼▼▼ [Image Resize Fix] Remove specific Ratio Preservation for now (Treat as normal nodes) ▼▼▼
+        // Normal nodes Logic (apply to all)
+        // Adjust position if size was clamped (keep anchor point fixed)
+        if (corner === 'TL' || corner === 'BL' || corner === 'L') {
+            // Left handles: position adjusts with width changes
+            const widthDiff = finalWidth - clampedWidth;
+            newPosX += widthDiff;
+        }
+        if (corner === 'TL' || corner === 'TR' || corner === 'T') {
+            // Top handles: position adjusts with height changes
+            const heightDiff = finalHeight - clampedHeight;
+            newPosY -= heightDiff;
+        }
+        // ▲▲▲ [Image Resize Fix] ▲▲▲
+        // ▲▲▲ [Image Resize Fix] ▲▲▲
+
+        finalWidth = clampedWidth;
+        finalHeight = clampedHeight;
+        // ▲▲▲ [Changed] ▲▲▲
+
+        // ▼▼▼ [Refactor] 스냅 현상 제거: 실수형 크기/좌표 그대로 사용 ▼▼▼
+        nodeEntry.model.width = finalWidth;
+        nodeEntry.model.height = finalHeight;
+
+        // ▼▼▼ [Changed] Update node position for corner resizing ▼▼▼
+        if (nodeEntry.glObject) {
+            nodeEntry.glObject.position.x = newPosX;
+            nodeEntry.glObject.position.y = newPosY;
+        }
+        if (nodeEntry.cssObject) {
+            nodeEntry.cssObject.position.x = newPosX;
+            nodeEntry.cssObject.position.y = newPosY;
+            // ▼▼▼ [Fix] CSS3D matrixWorld 즉시 갱신하여 CSS3DRenderer가 새 위치를 반영하도록 보장 ▼▼▼
+            nodeEntry.cssObject.updateMatrixWorld(true);
+            // ▲▲▲ [Fix] ▲▲▲
+        }
+        // ▼▼▼ [Fix] model position도 동기화하여 다른 sync 로직과의 일관성 보장 ▼▼▼
+        nodeEntry.model.positionX = newPosX;
+        nodeEntry.model.positionY = newPosY;
+        // ▲▲▲ [Fix] ▲▲▲
+        // ▲▲▲ [Changed] ▲▲▲
+
         if (nodeEntry.cssObject) {
             const wrapper = nodeEntry.cssObject.element;
-            // ▼▼▼ [Fix] CSS3D 노드는 resolutionScale을 고려하여 DOM 크기 설정 ▼▼▼
-            // CSS3D 객체의 scale은 1/resolutionScale이므로, DOM 크기는 worldSize * resolutionScale
-            const resolutionScale = nodeEntry.cssObject.userData?.resolutionScale || 1;
-            const domWidth = nodeEntry.model.width * resolutionScale;
-            const domHeight = nodeEntry.model.height * resolutionScale;
-
+            // ▼▼▼ [Fix] CSS3D 노드는 resolutionScale을 고려하여 DOM 크기 설정 ▼▼▼
+            // CSS3D 객체의 scale은 1/resolutionScale이므로, DOM 크기는 worldSize * resolutionScale
+            const resolutionScale = nodeEntry.cssObject.userData?.resolutionScale || 1;
+            const domWidth = nodeEntry.model.width * resolutionScale;
+            const domHeight = nodeEntry.model.height * resolutionScale;
+
             wrapper.style.width = domWidth + 'px';
             wrapper.style.height = domHeight + 'px';
             wrapper.style.minWidth = domWidth + 'px';
@@ -1310,27 +1313,27 @@
                 innerContent.style.maxHeight = nodeEntry.model.height + 'px';
 
                 // ▼▼▼ [Fix] 이미지 노드의 경우 내부 img 요소 크기도 업데이트 ▼▼▼
-                if (nodeEntry.model.contentType === 'image') {
-                    const imgEl = innerContent.querySelector('img');
-                    if (imgEl) {
-                        imgEl.style.width = '100%';
-                        imgEl.style.height = '100%';
-                    }
-                    // contentWrapper와 responseDiv 크기도 업데이트
-                    const contentWrapper = innerContent.querySelector('.node-content-wrapper');
-                    if (contentWrapper) {
-                        contentWrapper.style.width = '100%';
-                        contentWrapper.style.height = '100%';
-                    }
-                    const responseDiv = innerContent.querySelector('.node-response');
-                    if (responseDiv) {
-                        responseDiv.style.width = '100%';
-                        responseDiv.style.height = '100%';
-                    }
-                }
-                // ▲▲▲ [Fix] ▲▲▲
-            }
-
+                if (nodeEntry.model.contentType === 'image') {
+                    const imgEl = innerContent.querySelector('img');
+                    if (imgEl) {
+                        imgEl.style.width = '100%';
+                        imgEl.style.height = '100%';
+                    }
+                    // contentWrapper와 responseDiv 크기도 업데이트
+                    const contentWrapper = innerContent.querySelector('.node-content-wrapper');
+                    if (contentWrapper) {
+                        contentWrapper.style.width = '100%';
+                        contentWrapper.style.height = '100%';
+                    }
+                    const responseDiv = innerContent.querySelector('.node-response');
+                    if (responseDiv) {
+                        responseDiv.style.width = '100%';
+                        responseDiv.style.height = '100%';
+                    }
+                }
+                // ▲▲▲ [Fix] ▲▲▲
+            }
+
             // ▼▼▼ [Fix] userData도 업데이트하여 syncCss3dContent에서 올바른 크기 사용 ▼▼▼
             nodeEntry.cssObject.userData.worldWidth = nodeEntry.model.width;
             nodeEntry.cssObject.userData.worldHeight = nodeEntry.model.height;
@@ -1344,17 +1347,17 @@
 
         if (nodeEntry.glObject) {
             const group = nodeEntry.glObject;
-
-            const bodyMesh = group.getObjectByName('body');
-            const outline = group.getObjectByName('outline');
-            let glowMesh = group.getObjectByName('glow');
-            if (!ENABLE_WEBGL_GLOW) {
-                glowMesh = removeGlowMesh(group);
-            }
-            const CORNER_RADIUS = 20;
-            const OUTLINE_SHRINK = 2;
-            const OUTLINE_RADIUS = Math.max(1, CORNER_RADIUS - 1);
-            const CHAMFER_SIZE = 16;
+
+            const bodyMesh = group.getObjectByName('body');
+            const outline = group.getObjectByName('outline');
+            let glowMesh = group.getObjectByName('glow');
+            if (!ENABLE_WEBGL_GLOW) {
+                glowMesh = removeGlowMesh(group);
+            }
+            const CORNER_RADIUS = 20;
+            const OUTLINE_SHRINK = 2;
+            const OUTLINE_RADIUS = Math.max(1, CORNER_RADIUS - 1);
+            const CHAMFER_SIZE = 16;
             if (bodyMesh) {
                 bodyMesh.geometry.dispose();
                 bodyMesh.geometry = new THREE.PlaneGeometry(nodeEntry.model.width, nodeEntry.model.height);
@@ -1366,15 +1369,15 @@
                 if (nodeEntry.currentResizeType === 'CSS') {
                     bodyMesh.visible = false;
                 }
-                // ▲▲▲ [Fix] ▲▲▲
-
-                // ▼▼▼ [Image Resize Fix] Don't clear map during resize to prevent white flash/loss ▼▼▼
-                // if (bodyMesh.material.map) {
-                //    bodyMesh.material.map = null;
-                //    bodyMesh.material.color.setHex(0xffffff);
-                //    bodyMesh.material.needsUpdate = true;
-                // }
-                // ▲▲▲ [Image Resize Fix] ▲▲▲
+                // ▲▲▲ [Fix] ▲▲▲
+
+                // ▼▼▼ [Image Resize Fix] Don't clear map during resize to prevent white flash/loss ▼▼▼
+                // if (bodyMesh.material.map) {
+                //    bodyMesh.material.map = null;
+                //    bodyMesh.material.color.setHex(0xffffff);
+                //    bodyMesh.material.needsUpdate = true;
+                // }
+                // ▲▲▲ [Image Resize Fix] ▲▲▲
                 const isSelected = module.multiSelectedNodeIds.has(module.resizingNodeId) || module.selectedNodeIdJs === module.resizingNodeId;
                 if (nodeEntry.model.contentType === 'image') {
                     const usesCssViewDuringResize =
@@ -1412,87 +1415,87 @@
                         outline.material.opacity = 1.0;
                     }
                 }
-            }
-
-            // ▼▼▼ [Changed] Update glow position during resize (keep visible, no flickering) ▼▼▼
-            if (ENABLE_WEBGL_GLOW && glowMesh) {
-                // Update position to match bodyMesh
-                glowMesh.position.set(nodeEntry.model.width / 2, -nodeEntry.model.height / 2, 0); // [Fix] Z=0
-                // Don't hide - causes flickering
-            }
-            // ▲▲▲ [Changed] ▲▲▲
-            const tailMesh = group.getObjectByName('tail');
-            if (tailMesh) {
-                tailMesh.position.set(nodeEntry.model.width / 2, -nodeEntry.model.height - 6, 0);
-            }
-            // ▼▼▼ [Changed] Update eight resize handles (4 corners + 4 edges with geometry) ▼▼▼
-            const edgeWidthLength = Math.max(10, nodeEntry.model.width - HANDLE_SIZE * 2);
-            const edgeHeightLength = Math.max(10, nodeEntry.model.height - HANDLE_SIZE * 2);
-            const handleConfigs = {
-                // ▼▼▼ [Fix] Corners Z=0 for parallax elimination ▼▼▼
-                'resizeHandle_TL': { x: HANDLE_SIZE / 2, y: -HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
-                'resizeHandle_TR': { x: nodeEntry.model.width - HANDLE_SIZE / 2, y: -HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
-                'resizeHandle_BL': { x: HANDLE_SIZE / 2, y: -nodeEntry.model.height + HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
-                'resizeHandle_BR': { x: nodeEntry.model.width - HANDLE_SIZE / 2, y: -nodeEntry.model.height + HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
-                // Edges Z=0
-                'resizeHandle_T': { x: nodeEntry.model.width / 2, y: -HANDLE_SIZE / 2, w: edgeWidthLength, h: HANDLE_SIZE, z: 0 },
-                'resizeHandle_B': { x: nodeEntry.model.width / 2, y: -nodeEntry.model.height + HANDLE_SIZE / 2, w: edgeWidthLength, h: HANDLE_SIZE, z: 0 },
-                'resizeHandle_L': { x: HANDLE_SIZE / 2, y: -nodeEntry.model.height / 2, w: HANDLE_SIZE, h: edgeHeightLength, z: 0 },
-                'resizeHandle_R': { x: nodeEntry.model.width - HANDLE_SIZE / 2, y: -nodeEntry.model.height / 2, w: HANDLE_SIZE, h: edgeHeightLength, z: 0 }
-                // ▲▲▲ [Fix] ▲▲▲
-            };
-            Object.entries(handleConfigs).forEach(([name, cfg]) => {
-                const handle = group.getObjectByName(name);
-                if (handle) {
-                    handle.position.set(cfg.x, cfg.y, cfg.z);
-                    const gp = handle.geometry?.parameters;
-                    if (gp && (gp.width !== cfg.w || gp.height !== cfg.h)) {
-                        handle.geometry.dispose();
-                        handle.geometry = new THREE.PlaneGeometry(cfg.w, cfg.h);
-                    }
-                }
-            });
-            // ▲▲▲ [Changed] ▲▲▲
-
-            // ▼▼▼ [New] Update Troika text clipRect on resize for code nodes ▼▼▼
-            if (nodeEntry.model.contentType === 'code') {
-                const troikaText = group.userData.troikaText;
-                if (troikaText && troikaText.userData) {
-                    const padding = troikaText.userData.padding || 16;
-                    const filenameHeight = troikaText.userData.filenameHeight || 0; // ★ Include filename height
-                    const newWidth = nodeEntry.model.width;
-                    const newHeight = nodeEntry.model.height;
-                    const newTextWidth = newWidth - padding * 2;
-                    const newVisibleHeight = newHeight - padding * 2 - filenameHeight; // ★ Subtract filename height
-
-                    // Update userData dimensions
-                    troikaText.userData.nodeWidth = newWidth;
-                    troikaText.userData.nodeHeight = newHeight;
-                    troikaText.userData.textWidth = newTextWidth;
-                    troikaText.userData.visibleHeight = newVisibleHeight;
-
-                    // ★ DO NOT update maxWidth - code nodes should keep maxWidth: Infinity (no word wrap)
-                    // troikaText.maxWidth = newTextWidth; // REMOVED - this forces word wrap
-
-                    // Keep existing scroll and recalc maxScroll based on totalHeight
-                    const totalHeight = troikaText.userData.totalHeight || newVisibleHeight;
-                    const maxScroll = Math.max(0, totalHeight - newVisibleHeight);
-                    nodeEntry.model.maxScroll = maxScroll;
-
-                    // Clamp scroll position
-                    let scrollY = troikaText.userData.scrollY || 0;
-                    if (scrollY > maxScroll) {
-                        scrollY = maxScroll;
-                        troikaText.userData.scrollY = scrollY;
-                    }
-
-                    // Update clipRect - clip to visible area only
-                    const clipTop = -scrollY;
-                    const clipBottom = -scrollY - newVisibleHeight;
-                    troikaText.clipRect = [0, clipBottom, newTextWidth, clipTop];
-                    troikaText.sync();
-
-                    // Update scrollbar - show/hide based on whether scrolling is needed
+            }
+
+            // ▼▼▼ [Changed] Update glow position during resize (keep visible, no flickering) ▼▼▼
+            if (ENABLE_WEBGL_GLOW && glowMesh) {
+                // Update position to match bodyMesh
+                glowMesh.position.set(nodeEntry.model.width / 2, -nodeEntry.model.height / 2, 0); // [Fix] Z=0
+                // Don't hide - causes flickering
+            }
+            // ▲▲▲ [Changed] ▲▲▲
+            const tailMesh = group.getObjectByName('tail');
+            if (tailMesh) {
+                tailMesh.position.set(nodeEntry.model.width / 2, -nodeEntry.model.height - 6, 0);
+            }
+            // ▼▼▼ [Changed] Update eight resize handles (4 corners + 4 edges with geometry) ▼▼▼
+            const edgeWidthLength = Math.max(10, nodeEntry.model.width - HANDLE_SIZE * 2);
+            const edgeHeightLength = Math.max(10, nodeEntry.model.height - HANDLE_SIZE * 2);
+            const handleConfigs = {
+                // ▼▼▼ [Fix] Corners Z=0 for parallax elimination ▼▼▼
+                'resizeHandle_TL': { x: HANDLE_SIZE / 2, y: -HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
+                'resizeHandle_TR': { x: nodeEntry.model.width - HANDLE_SIZE / 2, y: -HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
+                'resizeHandle_BL': { x: HANDLE_SIZE / 2, y: -nodeEntry.model.height + HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
+                'resizeHandle_BR': { x: nodeEntry.model.width - HANDLE_SIZE / 2, y: -nodeEntry.model.height + HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
+                // Edges Z=0
+                'resizeHandle_T': { x: nodeEntry.model.width / 2, y: -HANDLE_SIZE / 2, w: edgeWidthLength, h: HANDLE_SIZE, z: 0 },
+                'resizeHandle_B': { x: nodeEntry.model.width / 2, y: -nodeEntry.model.height + HANDLE_SIZE / 2, w: edgeWidthLength, h: HANDLE_SIZE, z: 0 },
+                'resizeHandle_L': { x: HANDLE_SIZE / 2, y: -nodeEntry.model.height / 2, w: HANDLE_SIZE, h: edgeHeightLength, z: 0 },
+                'resizeHandle_R': { x: nodeEntry.model.width - HANDLE_SIZE / 2, y: -nodeEntry.model.height / 2, w: HANDLE_SIZE, h: edgeHeightLength, z: 0 }
+                // ▲▲▲ [Fix] ▲▲▲
+            };
+            Object.entries(handleConfigs).forEach(([name, cfg]) => {
+                const handle = group.getObjectByName(name);
+                if (handle) {
+                    handle.position.set(cfg.x, cfg.y, cfg.z);
+                    const gp = handle.geometry?.parameters;
+                    if (gp && (gp.width !== cfg.w || gp.height !== cfg.h)) {
+                        handle.geometry.dispose();
+                        handle.geometry = new THREE.PlaneGeometry(cfg.w, cfg.h);
+                    }
+                }
+            });
+            // ▲▲▲ [Changed] ▲▲▲
+
+            // ▼▼▼ [New] Update Troika text clipRect on resize for code nodes ▼▼▼
+            if (nodeEntry.model.contentType === 'code') {
+                const troikaText = group.userData.troikaText;
+                if (troikaText && troikaText.userData) {
+                    const padding = troikaText.userData.padding || 16;
+                    const filenameHeight = troikaText.userData.filenameHeight || 0; // ★ Include filename height
+                    const newWidth = nodeEntry.model.width;
+                    const newHeight = nodeEntry.model.height;
+                    const newTextWidth = newWidth - padding * 2;
+                    const newVisibleHeight = newHeight - padding * 2 - filenameHeight; // ★ Subtract filename height
+
+                    // Update userData dimensions
+                    troikaText.userData.nodeWidth = newWidth;
+                    troikaText.userData.nodeHeight = newHeight;
+                    troikaText.userData.textWidth = newTextWidth;
+                    troikaText.userData.visibleHeight = newVisibleHeight;
+
+                    // ★ DO NOT update maxWidth - code nodes should keep maxWidth: Infinity (no word wrap)
+                    // troikaText.maxWidth = newTextWidth; // REMOVED - this forces word wrap
+
+                    // Keep existing scroll and recalc maxScroll based on totalHeight
+                    const totalHeight = troikaText.userData.totalHeight || newVisibleHeight;
+                    const maxScroll = Math.max(0, totalHeight - newVisibleHeight);
+                    nodeEntry.model.maxScroll = maxScroll;
+
+                    // Clamp scroll position
+                    let scrollY = troikaText.userData.scrollY || 0;
+                    if (scrollY > maxScroll) {
+                        scrollY = maxScroll;
+                        troikaText.userData.scrollY = scrollY;
+                    }
+
+                    // Update clipRect - clip to visible area only
+                    const clipTop = -scrollY;
+                    const clipBottom = -scrollY - newVisibleHeight;
+                    troikaText.clipRect = [0, clipBottom, newTextWidth, clipTop];
+                    troikaText.sync();
+
+                    // Update scrollbar - show/hide based on whether scrolling is needed
                     const scrollbarTrack = group.getObjectByName('scrollbarTrack');
                     const scrollbarThumb = group.getObjectByName('scrollbarThumb');
                     const isCssMode = nodeEntry.currentType === 'CSS';
@@ -1505,131 +1508,131 @@
                         } else {
                             scrollbarTrack.visible = true;
                             scrollbarThumb.visible = true;
-
-                            const SCROLLBAR_WIDTH = 6;
-                            const SCROLLBAR_PADDING = 4;
-                            const SCROLLBAR_TOP_MARGIN = 16;
-                            const SCROLLBAR_BOTTOM_MARGIN = 16;
-                            const SCROLLBAR_RADIUS = 3;
-                            const trackHeight = newHeight - SCROLLBAR_TOP_MARGIN - SCROLLBAR_BOTTOM_MARGIN - filenameHeight; // ★ Include filenameHeight
-                            const trackX = newWidth - SCROLLBAR_WIDTH - SCROLLBAR_PADDING;
-                            const trackY = -SCROLLBAR_TOP_MARGIN - filenameHeight; // ★ Include filenameHeight
-
-                            // Update track position and geometry
-                            scrollbarTrack.position.set(trackX, trackY, 3);
-                            if (scrollbarTrack.geometry) {
-                                scrollbarTrack.geometry.dispose();
-                                if (window.MindMapObjectManager?.createRoundedRectFilledGeometry) {
-                                    scrollbarTrack.geometry = window.MindMapObjectManager.createRoundedRectFilledGeometry(SCROLLBAR_WIDTH, trackHeight, SCROLLBAR_RADIUS);
-                                } else {
-                                    scrollbarTrack.geometry = new THREE.PlaneGeometry(SCROLLBAR_WIDTH, trackHeight);
-                                }
-                            }
-
-                            // Update thumb
-                            const thumbHeightRatio = Math.min(1, newVisibleHeight / (maxScroll + newVisibleHeight));
-                            const thumbHeight = Math.max(24, trackHeight * thumbHeightRatio);
-                            const scrollRatio = scrollY / maxScroll;
-                            const thumbTravel = trackHeight - thumbHeight;
-                            const thumbY = trackY - (scrollRatio * thumbTravel); // ★ Use trackY which includes filenameHeight
-
-                            scrollbarThumb.position.set(trackX, thumbY, 3.1);
-                            if (scrollbarThumb.geometry) {
-                                scrollbarThumb.geometry.dispose();
-                                if (window.MindMapObjectManager?.createRoundedRectFilledGeometry) {
-                                    scrollbarThumb.geometry = window.MindMapObjectManager.createRoundedRectFilledGeometry(SCROLLBAR_WIDTH, thumbHeight, SCROLLBAR_RADIUS);
-                                } else {
-                                    scrollbarThumb.geometry = new THREE.PlaneGeometry(SCROLLBAR_WIDTH, thumbHeight);
-                                }
-                            }
-                            scrollbarThumb.userData.trackHeight = trackHeight;
-                            scrollbarThumb.userData.thumbHeight = thumbHeight;
-                        }
-                    }
-                }
-            }
-            // ▲▲▲ [New] ▲▲▲
-
-            // ▼▼▼ [New] Update glow shader dimensions on resize ▼▼▼
-            if (ENABLE_WEBGL_GLOW && glowMesh && window.MindMapGlowShader?.updateGlowSize) {
-                window.MindMapGlowShader.updateGlowSize(glowMesh, nodeEntry.model.width, nodeEntry.model.height, nodeEntry.model.contentType);
-            }
-            // ▲▲▲ [New] ▲▲▲
-
-            group.userData.worldWidth = nodeEntry.model.width;
-            group.userData.worldHeight = nodeEntry.model.height;
-        }
-
+
+                            const SCROLLBAR_WIDTH = 6;
+                            const SCROLLBAR_PADDING = 4;
+                            const SCROLLBAR_TOP_MARGIN = 16;
+                            const SCROLLBAR_BOTTOM_MARGIN = 16;
+                            const SCROLLBAR_RADIUS = 3;
+                            const trackHeight = newHeight - SCROLLBAR_TOP_MARGIN - SCROLLBAR_BOTTOM_MARGIN - filenameHeight; // ★ Include filenameHeight
+                            const trackX = newWidth - SCROLLBAR_WIDTH - SCROLLBAR_PADDING;
+                            const trackY = -SCROLLBAR_TOP_MARGIN - filenameHeight; // ★ Include filenameHeight
+
+                            // Update track position and geometry
+                            scrollbarTrack.position.set(trackX, trackY, 3);
+                            if (scrollbarTrack.geometry) {
+                                scrollbarTrack.geometry.dispose();
+                                if (window.MindMapObjectManager?.createRoundedRectFilledGeometry) {
+                                    scrollbarTrack.geometry = window.MindMapObjectManager.createRoundedRectFilledGeometry(SCROLLBAR_WIDTH, trackHeight, SCROLLBAR_RADIUS);
+                                } else {
+                                    scrollbarTrack.geometry = new THREE.PlaneGeometry(SCROLLBAR_WIDTH, trackHeight);
+                                }
+                            }
+
+                            // Update thumb
+                            const thumbHeightRatio = Math.min(1, newVisibleHeight / (maxScroll + newVisibleHeight));
+                            const thumbHeight = Math.max(24, trackHeight * thumbHeightRatio);
+                            const scrollRatio = scrollY / maxScroll;
+                            const thumbTravel = trackHeight - thumbHeight;
+                            const thumbY = trackY - (scrollRatio * thumbTravel); // ★ Use trackY which includes filenameHeight
+
+                            scrollbarThumb.position.set(trackX, thumbY, 3.1);
+                            if (scrollbarThumb.geometry) {
+                                scrollbarThumb.geometry.dispose();
+                                if (window.MindMapObjectManager?.createRoundedRectFilledGeometry) {
+                                    scrollbarThumb.geometry = window.MindMapObjectManager.createRoundedRectFilledGeometry(SCROLLBAR_WIDTH, thumbHeight, SCROLLBAR_RADIUS);
+                                } else {
+                                    scrollbarThumb.geometry = new THREE.PlaneGeometry(SCROLLBAR_WIDTH, thumbHeight);
+                                }
+                            }
+                            scrollbarThumb.userData.trackHeight = trackHeight;
+                            scrollbarThumb.userData.thumbHeight = thumbHeight;
+                        }
+                    }
+                }
+            }
+            // ▲▲▲ [New] ▲▲▲
+
+            // ▼▼▼ [New] Update glow shader dimensions on resize ▼▼▼
+            if (ENABLE_WEBGL_GLOW && glowMesh && window.MindMapGlowShader?.updateGlowSize) {
+                window.MindMapGlowShader.updateGlowSize(glowMesh, nodeEntry.model.width, nodeEntry.model.height, nodeEntry.model.contentType);
+            }
+            // ▲▲▲ [New] ▲▲▲
+
+            group.userData.worldWidth = nodeEntry.model.width;
+            group.userData.worldHeight = nodeEntry.model.height;
+        }
+
         // ▼▼▼ [Fix] LOD 모드에서 리사이즈 시 InstancedMesh 실시간 업데이트 ▼▼▼
         if (module.lodRenderer?.isInLODMode && module.lodRenderer?.requestResidentPatch) {
             module.lodRenderer.requestResidentPatch('update-node', nodeId);
         }
-        // ▲▲▲ [Fix] ▲▲▲
-    }
-
-    function debouncedProcessRenderQueue(module, nodeId, updateData) {
-        if (debounceTimers.has(nodeId)) {
-            clearTimeout(debounceTimers.get(nodeId));
-        }
-        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
-        const timer = setTimeout(() => {
-            enqueueRender(module, nodeId);
-            debounceTimers.delete(nodeId);
-        }, 100);
-        debounceTimers.set(nodeId, timer);
-    }
-
-    function throttledProcessRenderQueueDuringResize(module, nodeId, updateData) {
-        const now = performance.now();
-        const lastCallTime = lastResizeUpdateCall.get(nodeId) || 0;
-
-        if (now - lastCallTime < THROTTLE_INTERVAL) {
-            window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
-            if (resizeThrottleTimers.has(nodeId)) return;
-            const timer = setTimeout(() => {
-                const queuedUpdateData = window.MindMapNodes.pendingNodeUpdates.get(nodeId);
-                if (queuedUpdateData) {
-                    enqueueRender(module, nodeId);
-                }
-                resizeThrottleTimers.delete(nodeId);
-            }, THROTTLE_INTERVAL);
-            resizeThrottleTimers.set(nodeId, timer);
-            return;
-        }
-
-        lastResizeUpdateCall.set(nodeId, now);
-        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
-        enqueueRender(module, nodeId);
-
-        // ▼▼▼ [Fix] Maintain appropriate resize cursor during doResizing ▼▼▼
-        let cursor = 'nwse-resize';
-        switch (corner) {
-            case 'TL': case 'BR': cursor = 'nwse-resize'; break;
-            case 'TR': case 'BL': cursor = 'nesw-resize'; break;
-            case 'T': case 'B': cursor = 'ns-resize'; break;
-            case 'L': case 'R': cursor = 'ew-resize'; break;
-        }
-        document.body.style.cursor = cursor;
-        // ▲▲▲ [Fix] ▲▲▲
-    }
-
-    function throttledScrollUpdate(module, nodeId, scrollDelta) {
-        const now = performance.now();
-        const lastCallTime = lastScrollCall.get(nodeId) || 0;
-
-        if (now - lastCallTime < THROTTLE_INTERVAL) {
-            return;
-        }
-        lastScrollCall.set(nodeId, now);
-
-        const nodeEntry = module.nodeObjectsById.get(nodeId);
-        if (!nodeEntry) return;
-
-        const model = nodeEntry.model;
-        const oldOffset = model.scrollOffset || 0;
-        const maxScroll = model.maxScroll || 0;
-        const newOffset = Math.max(0, Math.min(oldOffset + scrollDelta, maxScroll));
-
+        // ▲▲▲ [Fix] ▲▲▲
+    }
+
+    function debouncedProcessRenderQueue(module, nodeId, updateData) {
+        if (debounceTimers.has(nodeId)) {
+            clearTimeout(debounceTimers.get(nodeId));
+        }
+        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
+        const timer = setTimeout(() => {
+            enqueueRender(module, nodeId);
+            debounceTimers.delete(nodeId);
+        }, 100);
+        debounceTimers.set(nodeId, timer);
+    }
+
+    function throttledProcessRenderQueueDuringResize(module, nodeId, updateData) {
+        const now = performance.now();
+        const lastCallTime = lastResizeUpdateCall.get(nodeId) || 0;
+
+        if (now - lastCallTime < THROTTLE_INTERVAL) {
+            window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
+            if (resizeThrottleTimers.has(nodeId)) return;
+            const timer = setTimeout(() => {
+                const queuedUpdateData = window.MindMapNodes.pendingNodeUpdates.get(nodeId);
+                if (queuedUpdateData) {
+                    enqueueRender(module, nodeId);
+                }
+                resizeThrottleTimers.delete(nodeId);
+            }, THROTTLE_INTERVAL);
+            resizeThrottleTimers.set(nodeId, timer);
+            return;
+        }
+
+        lastResizeUpdateCall.set(nodeId, now);
+        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
+        enqueueRender(module, nodeId);
+
+        // ▼▼▼ [Fix] Maintain appropriate resize cursor during doResizing ▼▼▼
+        let cursor = 'nwse-resize';
+        switch (corner) {
+            case 'TL': case 'BR': cursor = 'nwse-resize'; break;
+            case 'TR': case 'BL': cursor = 'nesw-resize'; break;
+            case 'T': case 'B': cursor = 'ns-resize'; break;
+            case 'L': case 'R': cursor = 'ew-resize'; break;
+        }
+        document.body.style.cursor = cursor;
+        // ▲▲▲ [Fix] ▲▲▲
+    }
+
+    function throttledScrollUpdate(module, nodeId, scrollDelta) {
+        const now = performance.now();
+        const lastCallTime = lastScrollCall.get(nodeId) || 0;
+
+        if (now - lastCallTime < THROTTLE_INTERVAL) {
+            return;
+        }
+        lastScrollCall.set(nodeId, now);
+
+        const nodeEntry = module.nodeObjectsById.get(nodeId);
+        if (!nodeEntry) return;
+
+        const model = nodeEntry.model;
+        const oldOffset = model.scrollOffset || 0;
+        const maxScroll = model.maxScroll || 0;
+        const newOffset = Math.max(0, Math.min(oldOffset + scrollDelta, maxScroll));
+
         if (Math.abs(newOffset - oldOffset) < 0.1) return;
 
         model.scrollOffset = newOffset;
@@ -1637,213 +1640,213 @@
 
         // ▼▼▼ [New] Code nodes: update Troika text via scrollCodeText ▼▼▼
         if (model.contentType === 'code' && nodeEntry.glObject) {
-            const troikaText = nodeEntry.glObject.userData.troikaText;
-            if (troikaText && window.MindMapTroikaText?.scrollCodeText) {
-                // Use scrollCodeText which handles both position and clipRect
-                const scrollResult = window.MindMapTroikaText.scrollCodeText(troikaText, scrollDelta);
-                if (scrollResult) {
-                    model.scrollOffset = scrollResult.scrollY;
-
-                    // ★ Update scrollbar thumb position (ShapeGeometry anchor is top-left, not center)
-                    const scrollbarThumb = nodeEntry.glObject.getObjectByName('scrollbarThumb');
-                    if (scrollbarThumb && scrollResult.maxScroll > 0) {
-                        const thumbData = scrollbarThumb.userData;
-                        const thumbTravel = thumbData.trackHeight - thumbData.thumbHeight;
-                        const thumbY = -thumbData.topMargin - (scrollResult.scrollRatio * thumbTravel);
-                        scrollbarThumb.position.y = thumbY;
-                    }
-                }
-
-                // Persist scroll position to C#
-                throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
-                return;
-            }
-        }
-        // ▲▲▲ [New] ▲▲▲
-
-        // ▼▼▼ [Refactor] Fetch content directly from C# (no cache) ▼▼▼
-        if (model.isChunkedText && module.dotNetHelper) {
-            // Cancel the previous request (process only the latest)
-            if (model._scrollFetchController) {
-                model._scrollFetchController.abort = true;
-            }
-            const controller = { abort: false };
-            model._scrollFetchController = controller;
-
-            // Debounce: render after scrolling stops
-            if (model._scrollDebounceTimer) {
-                clearTimeout(model._scrollDebounceTimer);
-            }
-            model._scrollDebounceTimer = setTimeout(async () => {
-                if (controller.abort) return;
-
-                try {
-                    const result = await module.dotNetHelper.invokeMethodAsync(
-                        'GetTextByScrollPosition',
-                        nodeId,
-                        model.scrollOffset,
-                        model.height || 400,
-                        CHUNK_LINE_HEIGHT
-                    );
-
-                    if (controller.abort || !result) return;
-
-                    // Set content used for rendering
-                    model._visibleContent = result.content;
-                    model._visibleScrollOffset = result.relativeScrollOffset;
-
-                    window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
-                        content: result.content,
-                        width: model.width,
-                        height: model.height,
-                        scrollDelta: 0
-                    });
-                    enqueueRender(module, nodeId);
-                } catch (e) {
-                    console.error(`[Pipeline] GetTextByScrollPosition error:`, e);
-                }
-            }, 16); // 16ms - 60fps throttle
-
-            // Persist scroll position to C#
-            throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
-            return;
-        }
-        // ▲▲▲ [Refactor] ▲▲▲
-
-        // Regular nodes (non-chunked)
-        const updateData = {
-            content: model.response,
-            width: model.width,
-            height: model.height,
-            scrollDelta: 0
-        };
-        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
-        enqueueRender(module, nodeId);
-
-        // ▼▼▼ [New] Persist scroll position for regular nodes too ▼▼▼
-        throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
-        // ▲▲▲ [New] ▲▲▲
-    }
-
-    // ▼▼▼ [New] Set absolute scroll position (for scrollbar drag) ▼▼▼
-    function setScrollPosition(module, nodeId, absoluteScrollPosition) {
-        const now = performance.now();
-        const lastCallTime = lastScrollCall.get(nodeId) || 0;
-
-        // Throttling (ignore calls that arrive too quickly)
-        if (now - lastCallTime < THROTTLE_INTERVAL) {
-            return;
-        }
-        lastScrollCall.set(nodeId, now);
-
-        const nodeEntry = module.nodeObjectsById.get(nodeId);
-        if (!nodeEntry) return;
-
-        const model = nodeEntry.model;
-        const oldOffset = model.scrollOffset || 0;
-        const maxScroll = model.maxScroll || 0;
-        const newOffset = Math.max(0, Math.min(absoluteScrollPosition, maxScroll));
-
+            const troikaText = nodeEntry.glObject.userData.troikaText;
+            if (troikaText && window.MindMapTroikaText?.scrollCodeText) {
+                // Use scrollCodeText which handles both position and clipRect
+                const scrollResult = window.MindMapTroikaText.scrollCodeText(troikaText, scrollDelta);
+                if (scrollResult) {
+                    model.scrollOffset = scrollResult.scrollY;
+
+                    // ★ Update scrollbar thumb position (ShapeGeometry anchor is top-left, not center)
+                    const scrollbarThumb = nodeEntry.glObject.getObjectByName('scrollbarThumb');
+                    if (scrollbarThumb && scrollResult.maxScroll > 0) {
+                        const thumbData = scrollbarThumb.userData;
+                        const thumbTravel = thumbData.trackHeight - thumbData.thumbHeight;
+                        const thumbY = -thumbData.topMargin - (scrollResult.scrollRatio * thumbTravel);
+                        scrollbarThumb.position.y = thumbY;
+                    }
+                }
+
+                // Persist scroll position to C#
+                throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
+                return;
+            }
+        }
+        // ▲▲▲ [New] ▲▲▲
+
+        // ▼▼▼ [Refactor] Fetch content directly from C# (no cache) ▼▼▼
+        if (model.isChunkedText && module.dotNetHelper) {
+            // Cancel the previous request (process only the latest)
+            if (model._scrollFetchController) {
+                model._scrollFetchController.abort = true;
+            }
+            const controller = { abort: false };
+            model._scrollFetchController = controller;
+
+            // Debounce: render after scrolling stops
+            if (model._scrollDebounceTimer) {
+                clearTimeout(model._scrollDebounceTimer);
+            }
+            model._scrollDebounceTimer = setTimeout(async () => {
+                if (controller.abort) return;
+
+                try {
+                    const result = await module.dotNetHelper.invokeMethodAsync(
+                        'GetTextByScrollPosition',
+                        nodeId,
+                        model.scrollOffset,
+                        model.height || 400,
+                        CHUNK_LINE_HEIGHT
+                    );
+
+                    if (controller.abort || !result) return;
+
+                    // Set content used for rendering
+                    model._visibleContent = result.content;
+                    model._visibleScrollOffset = result.relativeScrollOffset;
+
+                    window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
+                        content: result.content,
+                        width: model.width,
+                        height: model.height,
+                        scrollDelta: 0
+                    });
+                    enqueueRender(module, nodeId);
+                } catch (e) {
+                    console.error(`[Pipeline] GetTextByScrollPosition error:`, e);
+                }
+            }, 16); // 16ms - 60fps throttle
+
+            // Persist scroll position to C#
+            throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
+            return;
+        }
+        // ▲▲▲ [Refactor] ▲▲▲
+
+        // Regular nodes (non-chunked)
+        const updateData = {
+            content: model.response,
+            width: model.width,
+            height: model.height,
+            scrollDelta: 0
+        };
+        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
+        enqueueRender(module, nodeId);
+
+        // ▼▼▼ [New] Persist scroll position for regular nodes too ▼▼▼
+        throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
+        // ▲▲▲ [New] ▲▲▲
+    }
+
+    // ▼▼▼ [New] Set absolute scroll position (for scrollbar drag) ▼▼▼
+    function setScrollPosition(module, nodeId, absoluteScrollPosition) {
+        const now = performance.now();
+        const lastCallTime = lastScrollCall.get(nodeId) || 0;
+
+        // Throttling (ignore calls that arrive too quickly)
+        if (now - lastCallTime < THROTTLE_INTERVAL) {
+            return;
+        }
+        lastScrollCall.set(nodeId, now);
+
+        const nodeEntry = module.nodeObjectsById.get(nodeId);
+        if (!nodeEntry) return;
+
+        const model = nodeEntry.model;
+        const oldOffset = model.scrollOffset || 0;
+        const maxScroll = model.maxScroll || 0;
+        const newOffset = Math.max(0, Math.min(absoluteScrollPosition, maxScroll));
+
         if (Math.abs(newOffset - oldOffset) < 0.1) return;
 
         model.scrollOffset = newOffset;
         window.MindMapCss3DManager?.syncCss3dScrollFromModel?.(module, nodeId);
 
         // ▼▼▼ [Refactor] Fetch content directly from C# (no cache) ▼▼▼
-        if (model.isChunkedText && module.dotNetHelper) {
-            // Cancel the previous request (process only the latest)
-            if (model._scrollFetchController) {
-                model._scrollFetchController.abort = true;
-            }
-            const controller = { abort: false };
-            model._scrollFetchController = controller;
-
-            // Throttle: update every 16ms even during fast scrolling (~60fps)
-            if (model._scrollDebounceTimer) {
-                clearTimeout(model._scrollDebounceTimer);
-            }
-            model._scrollDebounceTimer = setTimeout(async () => {
-                if (controller.abort) return;
-
-                try {
-                    const result = await module.dotNetHelper.invokeMethodAsync(
-                        'GetTextByScrollPosition',
-                        nodeId,
-                        model.scrollOffset,
-                        model.height || 400,
-                        CHUNK_LINE_HEIGHT
-                    );
-
-                    if (controller.abort || !result) return;
-
-                    // Set content used for rendering
-                    model._visibleContent = result.content;
-                    model._visibleScrollOffset = result.relativeScrollOffset;
-
-                    window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
-                        content: result.content,
-                        width: model.width,
-                        height: model.height,
-                        scrollDelta: 0
-                    });
-                    enqueueRender(module, nodeId);
-                } catch (e) {
-                    console.error(`[Pipeline] GetTextByScrollPosition error:`, e);
-                }
-            }, 16); // 16ms - 60fps throttle
-
-            // Persist scroll position to C#
-            throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
-            return;
-        }
-        // ▲▲▲ [Refactor] ▲▲▲
-
-        // Regular nodes (non-chunked)
-        const updateData = {
-            content: model.response,
-            width: model.width,
-            height: model.height,
-            scrollDelta: 0
-        };
-        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
-        enqueueRender(module, nodeId);
-
-        // ▼▼▼ [New] Persist scroll position for regular nodes too ▼▼▼
-        throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
-        // ▲▲▲ [New] ▲▲▲
-    }
-    // ▲▲▲ [New] Set absolute scroll position (for scrollbar drag) ▲▲▲
-
-    function throttledUpdateScrollInCSharp(module, nodeId, scrollOffset) {
-        if (scrollUpdateThrottleTimers.has(nodeId)) {
-            clearTimeout(scrollUpdateThrottleTimers.get(nodeId));
-        }
-        const timer = setTimeout(() => {
-            try {
-                module.dotNetHelper?.invokeMethodAsync('UpdateNodeScroll', nodeId, scrollOffset);
-            } catch (e) {
-                console.error(`[Pipeline] Failed to update scroll in C# for node ${nodeId}:`, e);
-            }
-            scrollUpdateThrottleTimers.delete(nodeId);
-        }, 100);
-        scrollUpdateThrottleTimers.set(nodeId, timer);
-    }
-
-    async function stopResizing(module) {
-        if (!module.isResizing || !module.resizeNodeObject) return;
-
-        // ▼▼▼ [Changed] Use stored nodeId (CSS3D mode compatible) ▼▼▼
-        const nodeId = module.resizingNodeId || (module.resizeNodeObject.userData?.nodeId || module.resizeNodeObject.element?.dataset?.nodeId);
-        const nodeEntry = module.nodeObjectsById.get(nodeId);
-
-        if (nodeEntry && module.dotNetHelper) {
-            const currentPosX = nodeEntry.glObject?.position?.x ?? nodeEntry.cssObject?.position?.x ?? 0;
-            const currentPosY = nodeEntry.glObject?.position?.y ?? nodeEntry.cssObject?.position?.y ?? 0;
-            let finalPosX = currentPosX;
-            let finalPosY = currentPosY;
-
-            // Respect global snap toggle. Resize itself stays free-form while dragging;
-            // snapping is applied only at the end when enabled.
+        if (model.isChunkedText && module.dotNetHelper) {
+            // Cancel the previous request (process only the latest)
+            if (model._scrollFetchController) {
+                model._scrollFetchController.abort = true;
+            }
+            const controller = { abort: false };
+            model._scrollFetchController = controller;
+
+            // Throttle: update every 16ms even during fast scrolling (~60fps)
+            if (model._scrollDebounceTimer) {
+                clearTimeout(model._scrollDebounceTimer);
+            }
+            model._scrollDebounceTimer = setTimeout(async () => {
+                if (controller.abort) return;
+
+                try {
+                    const result = await module.dotNetHelper.invokeMethodAsync(
+                        'GetTextByScrollPosition',
+                        nodeId,
+                        model.scrollOffset,
+                        model.height || 400,
+                        CHUNK_LINE_HEIGHT
+                    );
+
+                    if (controller.abort || !result) return;
+
+                    // Set content used for rendering
+                    model._visibleContent = result.content;
+                    model._visibleScrollOffset = result.relativeScrollOffset;
+
+                    window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
+                        content: result.content,
+                        width: model.width,
+                        height: model.height,
+                        scrollDelta: 0
+                    });
+                    enqueueRender(module, nodeId);
+                } catch (e) {
+                    console.error(`[Pipeline] GetTextByScrollPosition error:`, e);
+                }
+            }, 16); // 16ms - 60fps throttle
+
+            // Persist scroll position to C#
+            throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
+            return;
+        }
+        // ▲▲▲ [Refactor] ▲▲▲
+
+        // Regular nodes (non-chunked)
+        const updateData = {
+            content: model.response,
+            width: model.width,
+            height: model.height,
+            scrollDelta: 0
+        };
+        window.MindMapNodes.pendingNodeUpdates.set(nodeId, updateData);
+        enqueueRender(module, nodeId);
+
+        // ▼▼▼ [New] Persist scroll position for regular nodes too ▼▼▼
+        throttledUpdateScrollInCSharp(module, nodeId, model.scrollOffset);
+        // ▲▲▲ [New] ▲▲▲
+    }
+    // ▲▲▲ [New] Set absolute scroll position (for scrollbar drag) ▲▲▲
+
+    function throttledUpdateScrollInCSharp(module, nodeId, scrollOffset) {
+        if (scrollUpdateThrottleTimers.has(nodeId)) {
+            clearTimeout(scrollUpdateThrottleTimers.get(nodeId));
+        }
+        const timer = setTimeout(() => {
+            try {
+                module.dotNetHelper?.invokeMethodAsync('UpdateNodeScroll', nodeId, scrollOffset);
+            } catch (e) {
+                console.error(`[Pipeline] Failed to update scroll in C# for node ${nodeId}:`, e);
+            }
+            scrollUpdateThrottleTimers.delete(nodeId);
+        }, 100);
+        scrollUpdateThrottleTimers.set(nodeId, timer);
+    }
+
+    async function stopResizing(module) {
+        if (!module.isResizing || !module.resizeNodeObject) return;
+
+        // ▼▼▼ [Changed] Use stored nodeId (CSS3D mode compatible) ▼▼▼
+        const nodeId = module.resizingNodeId || (module.resizeNodeObject.userData?.nodeId || module.resizeNodeObject.element?.dataset?.nodeId);
+        const nodeEntry = module.nodeObjectsById.get(nodeId);
+
+        if (nodeEntry && module.dotNetHelper) {
+            const currentPosX = nodeEntry.glObject?.position?.x ?? nodeEntry.cssObject?.position?.x ?? 0;
+            const currentPosY = nodeEntry.glObject?.position?.y ?? nodeEntry.cssObject?.position?.y ?? 0;
+            let finalPosX = currentPosX;
+            let finalPosY = currentPosY;
+
+            // Respect global snap toggle. Resize itself stays free-form while dragging;
+            // snapping is applied only at the end when enabled.
             if (module.gridSnapEnabled !== false) {
                 const GRID_SIZE = module.GRID_SIZE || 10;
                 nodeEntry.model.width = Math.round(nodeEntry.model.width / GRID_SIZE) * GRID_SIZE;
@@ -1857,20 +1860,20 @@
                 nodeEntry.model.height);
             nodeEntry.model.width = finalClampedSize.width;
             nodeEntry.model.height = finalClampedSize.height;
-
-            if (nodeEntry.glObject) {
-                nodeEntry.glObject.position.x = finalPosX;
-                nodeEntry.glObject.position.y = finalPosY;
-            }
-            if (nodeEntry.cssObject) {
-                nodeEntry.cssObject.position.x = finalPosX;
-                nodeEntry.cssObject.position.y = finalPosY;
-                nodeEntry.cssObject.updateMatrixWorld(true);
-
-                // ▼▼▼ [Fix] 그리드 스냅 후 CSS3D DOM 크기도 업데이트 ▼▼▼
-                const wrapper = nodeEntry.cssObject.element;
-                if (wrapper) {
-                    const resolutionScale = nodeEntry.cssObject.userData?.resolutionScale || 1;
+
+            if (nodeEntry.glObject) {
+                nodeEntry.glObject.position.x = finalPosX;
+                nodeEntry.glObject.position.y = finalPosY;
+            }
+            if (nodeEntry.cssObject) {
+                nodeEntry.cssObject.position.x = finalPosX;
+                nodeEntry.cssObject.position.y = finalPosY;
+                nodeEntry.cssObject.updateMatrixWorld(true);
+
+                // ▼▼▼ [Fix] 그리드 스냅 후 CSS3D DOM 크기도 업데이트 ▼▼▼
+                const wrapper = nodeEntry.cssObject.element;
+                if (wrapper) {
+                    const resolutionScale = nodeEntry.cssObject.userData?.resolutionScale || 1;
                     const domWidth = nodeEntry.model.width * resolutionScale;
                     const domHeight = nodeEntry.model.height * resolutionScale;
 
@@ -1892,25 +1895,25 @@
 
                         // ▼▼▼ [Fix] 이미지 노드의 경우 내부 img 요소 크기도 업데이트 ▼▼▼
                         if (nodeEntry.model.contentType === 'image') {
-                            const imgEl = innerContent.querySelector('img');
-                            if (imgEl) {
-                                imgEl.style.width = '100%';
-                                imgEl.style.height = '100%';
-                            }
-                            const contentWrapper = innerContent.querySelector('.node-content-wrapper');
-                            if (contentWrapper) {
-                                contentWrapper.style.width = '100%';
-                                contentWrapper.style.height = '100%';
-                            }
-                            const responseDiv = innerContent.querySelector('.node-response');
-                            if (responseDiv) {
-                                responseDiv.style.width = '100%';
-                                responseDiv.style.height = '100%';
-                            }
-                        }
-                        // ▲▲▲ [Fix] ▲▲▲
-                    }
-
+                            const imgEl = innerContent.querySelector('img');
+                            if (imgEl) {
+                                imgEl.style.width = '100%';
+                                imgEl.style.height = '100%';
+                            }
+                            const contentWrapper = innerContent.querySelector('.node-content-wrapper');
+                            if (contentWrapper) {
+                                contentWrapper.style.width = '100%';
+                                contentWrapper.style.height = '100%';
+                            }
+                            const responseDiv = innerContent.querySelector('.node-response');
+                            if (responseDiv) {
+                                responseDiv.style.width = '100%';
+                                responseDiv.style.height = '100%';
+                            }
+                        }
+                        // ▲▲▲ [Fix] ▲▲▲
+                    }
+
                     // userData 업데이트
                     nodeEntry.cssObject.userData.worldWidth = nodeEntry.model.width;
                     nodeEntry.cssObject.userData.worldHeight = nodeEntry.model.height;
@@ -1918,21 +1921,21 @@
                 }
                 // ▲▲▲ [Fix] ▲▲▲
             }
-            try {
-                await module.dotNetHelper.invokeMethodAsync(
-                    'UpdateNodeDimensions',
-                    nodeId,
-                    Math.round(nodeEntry.model.width),
-                    Math.round(nodeEntry.model.height)
-                );
-                // ▼▼▼ [Changed] Also update position in C# ▼▼▼
-                await module.dotNetHelper.invokeMethodAsync(
-                    'UpdateNodePosition',
-                    nodeId,
-                    Math.round(finalPosX),
-                    Math.round(finalPosY)
-                );
-                // ▲▲▲ [Changed] ▲▲▲
+            try {
+                await module.dotNetHelper.invokeMethodAsync(
+                    'UpdateNodeDimensions',
+                    nodeId,
+                    Math.round(nodeEntry.model.width),
+                    Math.round(nodeEntry.model.height)
+                );
+                // ▼▼▼ [Changed] Also update position in C# ▼▼▼
+                await module.dotNetHelper.invokeMethodAsync(
+                    'UpdateNodePosition',
+                    nodeId,
+                    Math.round(finalPosX),
+                    Math.round(finalPosY)
+                );
+                // ▲▲▲ [Changed] ▲▲▲
             } catch (e) {
                 console.error('[MindMapPipeline] Error updating dimensions/position:', e);
             }
@@ -1947,18 +1950,18 @@
 
             // ▼▼▼ [UndoRedo] Record resize command after dimensions/position are persisted ▼▼▼
             try { await module.dotNetHelper.invokeMethodAsync('EndResizeWithUndo'); } catch { }
-            // ▲▲▲ [UndoRedo] ▲▲▲
-
-            if (nodeEntry.glObject) {
-                const outline = nodeEntry.glObject.getObjectByName('outline');
-                let glowMesh = nodeEntry.glObject.getObjectByName('glow');
-                if (!ENABLE_WEBGL_GLOW) {
-                    glowMesh = removeGlowMesh(nodeEntry.glObject);
-                }
-                const bodyMesh = nodeEntry.glObject.getObjectByName('body');
-                const isSelected = module.multiSelectedNodeIds.has(nodeId) || module.selectedNodeIdJs === nodeId;
-
-                // ▼▼▼ [Fix] 그리드 스냅 후 body mesh 크기/위치 업데이트 ▼▼▼
+            // ▲▲▲ [UndoRedo] ▲▲▲
+
+            if (nodeEntry.glObject) {
+                const outline = nodeEntry.glObject.getObjectByName('outline');
+                let glowMesh = nodeEntry.glObject.getObjectByName('glow');
+                if (!ENABLE_WEBGL_GLOW) {
+                    glowMesh = removeGlowMesh(nodeEntry.glObject);
+                }
+                const bodyMesh = nodeEntry.glObject.getObjectByName('body');
+                const isSelected = module.multiSelectedNodeIds.has(nodeId) || module.selectedNodeIdJs === nodeId;
+
+                // ▼▼▼ [Fix] 그리드 스냅 후 body mesh 크기/위치 업데이트 ▼▼▼
                 if (bodyMesh) {
                     bodyMesh.geometry.dispose();
                     bodyMesh.geometry = new THREE.PlaneGeometry(nodeEntry.model.width, nodeEntry.model.height);
@@ -1970,10 +1973,10 @@
                     if (nodeEntry.currentResizeType === 'CSS') {
                         bodyMesh.visible = false;
                     }
-                    // ▲▲▲ [Fix] ▲▲▲
-                }
-                // ▲▲▲ [Fix] ▲▲▲
-
+                    // ▲▲▲ [Fix] ▲▲▲
+                }
+                // ▲▲▲ [Fix] ▲▲▲
+
                 if (nodeEntry.model.contentType === 'image') {
                     const usesCssViewAfterResize =
                         nodeEntry.currentResizeType === 'CSS' ||
@@ -1999,29 +2002,29 @@
                     outline.material.color.setHex(isSelected ? 0x7b7ff2 : 0x374151);
                     outline.visible = false; // Disabled - using SDF glow instead
                 }
-
-                // ▼▼▼ [Changed] After resizing, update glow using SDF shader ▼▼▼
-                if (ENABLE_WEBGL_GLOW && glowMesh && window.MindMapGlowShader?.updateGlowSize) {
-                    const contentType = nodeEntry.model.contentType || 'text';
-                    window.MindMapGlowShader.updateGlowSize(glowMesh, nodeEntry.model.width, nodeEntry.model.height, contentType);
-                    glowMesh.position.set(
-                        nodeEntry.model.width / 2,
-                        -nodeEntry.model.height / 2,
-                        0
-                    );
-                    // ★ 카메라 거리에 따라 가시성 설정
-                    const cameraZ = module.camera?.position?.z ?? Infinity;
-                    const threshold = 4000;
-                    glowMesh.visible = cameraZ < threshold;
-                }
-                // ▲▲▲ [Changed] ▲▲▲
-
-                // ▼▼▼ [Fix] 리사이즈 종료 후 8방향 핸들 위치 업데이트 ▼▼▼
-                const HANDLE_SIZE = RESIZE_HANDLE_SIZE;
-                const w = nodeEntry.model.width;
-                const h = nodeEntry.model.height;
-                const edgeWidthLength = Math.max(10, w - HANDLE_SIZE * 2);
-                const edgeHeightLength = Math.max(10, h - HANDLE_SIZE * 2);
+
+                // ▼▼▼ [Changed] After resizing, update glow using SDF shader ▼▼▼
+                if (ENABLE_WEBGL_GLOW && glowMesh && window.MindMapGlowShader?.updateGlowSize) {
+                    const contentType = nodeEntry.model.contentType || 'text';
+                    window.MindMapGlowShader.updateGlowSize(glowMesh, nodeEntry.model.width, nodeEntry.model.height, contentType);
+                    glowMesh.position.set(
+                        nodeEntry.model.width / 2,
+                        -nodeEntry.model.height / 2,
+                        0
+                    );
+                    // ★ 카메라 거리에 따라 가시성 설정
+                    const cameraZ = module.camera?.position?.z ?? Infinity;
+                    const threshold = 4000;
+                    glowMesh.visible = cameraZ < threshold;
+                }
+                // ▲▲▲ [Changed] ▲▲▲
+
+                // ▼▼▼ [Fix] 리사이즈 종료 후 8방향 핸들 위치 업데이트 ▼▼▼
+                const HANDLE_SIZE = RESIZE_HANDLE_SIZE;
+                const w = nodeEntry.model.width;
+                const h = nodeEntry.model.height;
+                const edgeWidthLength = Math.max(10, w - HANDLE_SIZE * 2);
+                const edgeHeightLength = Math.max(10, h - HANDLE_SIZE * 2);
                 const handleConfigs = {
                     // Corners
                     'resizeHandle_TL': { x: HANDLE_SIZE / 2, y: -HANDLE_SIZE / 2, w: HANDLE_SIZE, h: HANDLE_SIZE, z: 0 },
@@ -2059,25 +2062,25 @@
                         handle.material.needsUpdate = true;
                     }
                 });
-                // ▲▲▲ [Fix] ▲▲▲
-            }
-
-            if (debounceTimers.has(nodeId)) {
-                clearTimeout(debounceTimers.get(nodeId));
-                debounceTimers.delete(nodeId);
-            }
-            if (resizeThrottleTimers.has(nodeId)) {
-                clearTimeout(resizeThrottleTimers.get(nodeId));
-                resizeThrottleTimers.delete(nodeId);
-            }
-
+                // ▲▲▲ [Fix] ▲▲▲
+            }
+
+            if (debounceTimers.has(nodeId)) {
+                clearTimeout(debounceTimers.get(nodeId));
+                debounceTimers.delete(nodeId);
+            }
+            if (resizeThrottleTimers.has(nodeId)) {
+                clearTimeout(resizeThrottleTimers.get(nodeId));
+                resizeThrottleTimers.delete(nodeId);
+            }
+
             if (nodeEntry.currentResizeType === 'CSS') {
                 console.log(`[stopResizing] CSS type - queuing texture update for ${nodeId}`);
 
                 // ▼▼▼ [Fix] CSS3D 노드의 최종 크기를 resolutionScale 고려하여 설정 ▼▼▼
                 if (nodeEntry.cssObject && nodeEntry.cssObject.element) {
-                    const wrapper = nodeEntry.cssObject.element;
-                    const resolutionScale = nodeEntry.cssObject.userData?.resolutionScale || 1;
+                    const wrapper = nodeEntry.cssObject.element;
+                    const resolutionScale = nodeEntry.cssObject.userData?.resolutionScale || 1;
                     const domWidth = nodeEntry.model.width * resolutionScale;
                     const domHeight = nodeEntry.model.height * resolutionScale;
 
@@ -2097,7 +2100,7 @@
                         innerContent.style.maxWidth = nodeEntry.model.width + 'px';
                         innerContent.style.maxHeight = nodeEntry.model.height + 'px';
                     }
-
+
                     // userData 업데이트
                     nodeEntry.cssObject.userData.worldWidth = nodeEntry.model.width;
                     nodeEntry.cssObject.userData.worldHeight = nodeEntry.model.height;
@@ -2121,72 +2124,72 @@
                 if (textarea) {
                     window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
                         content: textarea.value,
-                        width: nodeEntry.model.width,
-                        height: nodeEntry.model.height
-                    });
-                    enqueueRender(module, nodeId);
-                }
-            } else if (nodeEntry.currentResizeType === 'GL') {
-                // ▼▼▼ [Refactor] After resizing a chunk node, fetch content directly from C# ▼▼▼
-                if (nodeEntry.model.isChunkedText && module.dotNetHelper) {
-                    try {
-                        const result = await module.dotNetHelper.invokeMethodAsync(
-                            'GetTextByScrollPosition',
-                            nodeId,
-                            nodeEntry.model.scrollOffset || 0,
-                            nodeEntry.model.height || 400,
-                            CHUNK_LINE_HEIGHT
-                        );
-
-                        if (result) {
-                            nodeEntry.model._visibleContent = result.content;
-                            nodeEntry.model._visibleScrollOffset = result.relativeScrollOffset;
-
-                            window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
-                                content: result.content,
-                                width: nodeEntry.model.width,
-                                height: nodeEntry.model.height,
-                                scrollDelta: 0
-                            });
-                            enqueueRender(module, nodeId);
-                        }
-                    } catch (e) {
-                        console.error(`[Pipeline] GetTextByScrollPosition error on resize:`, e);
-                    }
-                } else {
-                    // ▲▲▲ [Refactor] ▲▲▲
-                    // Regular nodes (non-chunked) + IMAGE NODES
-
-                    // ▼▼▼ [Fix] 이미지 노드 리사이즈 시 기존 텍스처 유지 ▼▼▼
-                    if (nodeEntry.model.contentType === 'image') {
-                        // 이미지 노드는 URL이 변하지 않으므로 텍스처 재생성 불필요
-                        // geometry만 업데이트하고 기존 텍스처를 유지
-                        const bodyMesh = nodeEntry.glObject?.getObjectByName('body');
-                        if (bodyMesh && bodyMesh.material.map) {
-                            // 기존 텍스처 유지 - 아무것도 하지 않음
-                            console.log(`[stopResizing] Image node ${nodeId} - keeping existing texture`);
-                        } else {
-                            console.warn(`[stopResizing] Image node ${nodeId} - no texture found, may need reload`);
-                        }
-                    } else {
-                        // [Fix] Ensure regular nodes have content for texture generation
-                        const content = nodeEntry.model.response;
-
-                        console.log(`[stopResizing] GL type - queuing texture update for ${nodeId}, size ${nodeEntry.model.width}x${nodeEntry.model.height}`);
-                        window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
-                            content: content,
-                            width: nodeEntry.model.width,
-                            height: nodeEntry.model.height
-                        });
-                        enqueueRender(module, nodeId);
-                    }
-                    // ▲▲▲ [Fix] ▲▲▲
-                }
-            }
-
-            window.MindMapNodes.updateNodeSpatialGrid(module, nodeId);
-
-            // ▼▼▼ [Fix] 리사이즈 종료 후 CSS transition 복원 ▼▼▼
+                        width: nodeEntry.model.width,
+                        height: nodeEntry.model.height
+                    });
+                    enqueueRender(module, nodeId);
+                }
+            } else if (nodeEntry.currentResizeType === 'GL') {
+                // ▼▼▼ [Refactor] After resizing a chunk node, fetch content directly from C# ▼▼▼
+                if (nodeEntry.model.isChunkedText && module.dotNetHelper) {
+                    try {
+                        const result = await module.dotNetHelper.invokeMethodAsync(
+                            'GetTextByScrollPosition',
+                            nodeId,
+                            nodeEntry.model.scrollOffset || 0,
+                            nodeEntry.model.height || 400,
+                            CHUNK_LINE_HEIGHT
+                        );
+
+                        if (result) {
+                            nodeEntry.model._visibleContent = result.content;
+                            nodeEntry.model._visibleScrollOffset = result.relativeScrollOffset;
+
+                            window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
+                                content: result.content,
+                                width: nodeEntry.model.width,
+                                height: nodeEntry.model.height,
+                                scrollDelta: 0
+                            });
+                            enqueueRender(module, nodeId);
+                        }
+                    } catch (e) {
+                        console.error(`[Pipeline] GetTextByScrollPosition error on resize:`, e);
+                    }
+                } else {
+                    // ▲▲▲ [Refactor] ▲▲▲
+                    // Regular nodes (non-chunked) + IMAGE NODES
+
+                    // ▼▼▼ [Fix] 이미지 노드 리사이즈 시 기존 텍스처 유지 ▼▼▼
+                    if (nodeEntry.model.contentType === 'image') {
+                        // 이미지 노드는 URL이 변하지 않으므로 텍스처 재생성 불필요
+                        // geometry만 업데이트하고 기존 텍스처를 유지
+                        const bodyMesh = nodeEntry.glObject?.getObjectByName('body');
+                        if (bodyMesh && bodyMesh.material.map) {
+                            // 기존 텍스처 유지 - 아무것도 하지 않음
+                            console.log(`[stopResizing] Image node ${nodeId} - keeping existing texture`);
+                        } else {
+                            console.warn(`[stopResizing] Image node ${nodeId} - no texture found, may need reload`);
+                        }
+                    } else {
+                        // [Fix] Ensure regular nodes have content for texture generation
+                        const content = nodeEntry.model.response;
+
+                        console.log(`[stopResizing] GL type - queuing texture update for ${nodeId}, size ${nodeEntry.model.width}x${nodeEntry.model.height}`);
+                        window.MindMapNodes.pendingNodeUpdates.set(nodeId, {
+                            content: content,
+                            width: nodeEntry.model.width,
+                            height: nodeEntry.model.height
+                        });
+                        enqueueRender(module, nodeId);
+                    }
+                    // ▲▲▲ [Fix] ▲▲▲
+                }
+            }
+
+            window.MindMapNodes.updateNodeSpatialGrid(module, nodeId);
+
+            // ▼▼▼ [Fix] 리사이즈 종료 후 CSS transition 복원 ▼▼▼
             if (nodeEntry.cssObject && nodeEntry.cssObject.element) {
                 const wrapper = nodeEntry.cssObject.element;
                 wrapper.style.transition = CSS3D_WRAPPER_TRANSITION;
@@ -2197,9 +2200,9 @@
                     inner.style.webkitTransition = 'none';
                 }
             }
-            // ▲▲▲ [Fix] ▲▲▲
-        }
-
+            // ▲▲▲ [Fix] ▲▲▲
+        }
+
         module.isResizing = false;
         module.resizeNodeObject = null;
         module.resizingNodeId = null; // ▼▼▼ [Changed] clear resizingNodeId ▼▼▼
@@ -2208,18 +2211,18 @@
 
         // ▼▼▼ [Fix] Reset cursor after resizing ▼▼▼
         document.body.style.cursor = '';
-        // ▲▲▲ [Fix] ▲▲▲
-    }
-
-    // Expose MindMapPipeline globally
+        // ▲▲▲ [Fix] ▲▲▲
+    }
+
+    // Expose MindMapPipeline globally
     window.MindMapPipeline = {
-        processRenderQueue: processRenderQueue,
-        debouncedProcessRenderQueue: debouncedProcessRenderQueue,
-        throttledScrollUpdate: throttledScrollUpdate,
-        setScrollPosition: setScrollPosition, // [New] for scrollbar dragging
-        throttledProcessRenderQueueDuringResize: throttledProcessRenderQueueDuringResize,
-        startResizing: startResizing,
-        doResizing: doResizing,
+        processRenderQueue: processRenderQueue,
+        debouncedProcessRenderQueue: debouncedProcessRenderQueue,
+        throttledScrollUpdate: throttledScrollUpdate,
+        setScrollPosition: setScrollPosition, // [New] for scrollbar dragging
+        throttledProcessRenderQueueDuringResize: throttledProcessRenderQueueDuringResize,
+        startResizing: startResizing,
+        doResizing: doResizing,
         stopResizing: stopResizing,
         getQueueDebugMetrics: () => ({
             sortCount: renderQueueSortCount,
@@ -2232,8 +2235,8 @@
             renderQueueMaxLength = renderQueue.length;
         },
         throttledUpdateScrollInCSharp: throttledUpdateScrollInCSharp
-    };
-
-    console.log('? mind-map-pipeline.js loaded');
-})();
-
+    };
+
+    console.log('? mind-map-pipeline.js loaded');
+})();
+