@fps-games/editor 0.1.5-beta.5 → 0.1.6-beta.1

package/node_modules/@fps-games/editor-browser/dist/local-editor-ui.js

@@ -8,7 +8,7 @@ import { LOCAL_EDITOR_BROWSER_INSPECTOR_VEC3_AXES, resolveLocalEditorBrowserInsp
 import { DEFAULT_EDITOR_TRANSFORM_OPERATION_SETTINGS, DEFAULT_EDITOR_TRANSFORM_TOOL_DESCRIPTORS, } from '@fps-games/editor-core';
 export { createLocalEditorViewportRevealController, isLocalEditorElementVisibleInViewport, resolveLocalEditorViewportRevealScrollTop, revealLocalEditorElementInViewport, } from './local-editor-ui-dock-panel.js';
 export { createLocalEditorHierarchyBlankMenu, createLocalEditorHierarchyCopyShortcutAction, createLocalEditorHierarchyDeleteShortcutAction, createLocalEditorHierarchyDuplicateShortcutAction, createLocalEditorHierarchyNodeMenu, createLocalEditorHierarchyPasteShortcutAction, createLocalEditorHierarchySelectAllShortcutAction, } from './local-editor-ui-hierarchy-actions.js';
-export { createLocalEditorHierarchyController, } from './local-editor-ui-hierarchy-controller.js';
+export { createLocalEditorHierarchyController, resolveLocalEditorHierarchyCreateMarkerParentId, } from './local-editor-ui-hierarchy-controller.js';
 export { resolveLocalEditorHierarchySearchRows, } from './local-editor-ui-hierarchy-view.js';
 export { createLocalEditorHierarchyAttachDialog, resolveLocalEditorHierarchyAttachTargets, } from './local-editor-ui-hierarchy-attach-dialog.js';
 export { canLocalEditorHierarchyNodeHaveChildren, createLocalEditorHierarchyTreeModel, isLocalEditorHierarchyNodeSelectable, isLocalEditorHierarchyNodeMovable, } from './local-editor-ui-hierarchy-tree.js';
@@ -22,6 +22,8 @@ import { createShortcutHelpPanel as createLocalEditorShortcutHelpPanel } from '.
 import { applyLocalEditorTheme, ensureLocalEditorTheme, LOCAL_EDITOR_THEME_CLASS, normalizeLocalEditorThemeName, } from './local-editor-ui-theme.js';
 import { createDefaultLocalEditorWorkbenchLayout, createLocalEditorWorkbenchLayoutController, createLocalEditorWorkbench, createSceneHeaderToolbar, createWorkbenchPanelContent, } from './local-editor-ui-workbench.js';
 import { createLocalEditorIcon, isLocalEditorIconName } from './local-editor-ui-icons.js';
+import { resolveLocalEditorBrowserAssetKind, } from './local-editor-ui-asset-kind.js';
+import { createLocalEditorPrefabStageTitle, filterLocalEditorPrefabStageStructureItems, findLocalEditorPrefabStageStructureItem, formatLocalEditorPrefabStageComparisonPreviewStatus, LOCAL_EDITOR_PREFAB_COMPARISON_COLUMN_WIDTH_PX, resolveLocalEditorRightDockVisibility, resolveLocalEditorPrefabStageComparisonPreviewTone, shouldLocalEditorClosePerformanceMonitor, shouldLocalEditorPrefabStageBlockHierarchyShortcut, shouldShowLocalEditorPrefabComparisonColumn, shouldToggleLocalEditorPrefabComparisonShortcut, } from './local-editor-ui-prefab-stage.js';
 export { applyLocalEditorBrowserInspectorControlBinding, createLocalEditorBrowserInspectorControlRegistry, formatLocalEditorBrowserInspectorNumberValue, formatLocalEditorBrowserInspectorValue, parseLocalEditorBrowserInspectorNumberValue, resolveLocalEditorBrowserInspectorSectionStatus, resolveLocalEditorBrowserInspectorControlRegistration, } from './local-editor-ui-panels.js';
 export { createLocalEditorBrowserInspectorGroupValueClipboardPayload, createLocalEditorBrowserInspectorVectorCopyPayload, parseLocalEditorBrowserInspectorGroupValueClipboardPayload, } from './local-editor-inspector-clipboard.js';
 export { LOCAL_EDITOR_BROWSER_INSPECTOR_VEC3_AXES, isLocalEditorBrowserInspectorTransformVectorGroupPath, resolveLocalEditorBrowserInspectorVectorGroupAxisFromPropertyPath, resolveLocalEditorBrowserInspectorVectorGroupPathFromPropertyPath, resolveLocalEditorBrowserInspectorVectorGroupPathFromProperties, } from './local-editor-inspector-groups.js';
@@ -66,8 +68,24 @@ function readInspectorInputValue(input, source) {
             b: (numeric & 255) / 255,
         };
     }
+    if (input.dataset.serializedJsonValue === 'true') {
+        try {
+            const parsed = JSON.parse(input.value);
+            return isInspectorSerializedInputValue(parsed) ? parsed : null;
+        }
+        catch {
+            return null;
+        }
+    }
     return input.value;
 }
+function isInspectorSerializedInputValue(value) {
+    return value == null
+        || typeof value === 'number'
+        || typeof value === 'string'
+        || typeof value === 'boolean'
+        || (!!value && typeof value === 'object' && !Array.isArray(value));
+}
 const TRANSFORM_TOOL_ICONS = {
     select: 'select',
     move: 'move',
@@ -206,7 +224,8 @@ function createInspectorPropertyInputs(input, source, lockedVectorGroups) {
     if (!propertyInput)
         return null;
     const groupPath = resolveLocalEditorBrowserInspectorVectorGroupPathFromPropertyPath(propertyInput.path);
-    if (!groupPath || !lockedVectorGroups.has(groupPath))
+    const forceVectorLock = input.dataset.serializedForceVectorLock === 'true';
+    if (!groupPath || (!forceVectorLock && !lockedVectorGroups.has(groupPath)))
         return [propertyInput];
     if (propertyInput.control !== 'number' || propertyInput.valueType !== 'number')
         return [propertyInput];
@@ -352,6 +371,33 @@ function createRenderingActionInput(button) {
         ...(params ? { params } : {}),
     };
 }
+function createInspectorActionInput(button) {
+    const actionId = button.dataset.editorInspectorAction;
+    if (!actionId)
+        return null;
+    const params = parseRenderingActionParams(button.dataset.editorInspectorActionParams);
+    const targetIds = parseInspectorActionTargetIds(button.dataset.editorInspectorActionTargetIds);
+    return {
+        actionId,
+        targetId: button.dataset.editorInspectorActionTargetId || null,
+        targetIds,
+        path: button.dataset.editorInspectorActionPath,
+        ...(params ? { params } : {}),
+    };
+}
+function parseInspectorActionTargetIds(value) {
+    if (!value)
+        return undefined;
+    try {
+        const parsed = JSON.parse(value);
+        return Array.isArray(parsed) && parsed.every(item => typeof item === 'string')
+            ? parsed
+            : undefined;
+    }
+    catch {
+        return undefined;
+    }
+}
 function parseRenderingActionParams(value) {
     if (!value)
         return null;
@@ -371,7 +417,40 @@ function readInspectorCommitMode(input) {
 function readRenderingCommitMode(input) {
     return input.dataset.renderingCommitMode ?? 'live';
 }
+function isLocalEditorRightDockTab(value) {
+    return value === 'inspector' || value === 'rendering' || value === 'markers';
+}
 function resolveLocalEditorRightDockContentKey(state, tab, inspectorFilter) {
+    if (tab === 'markers') {
+        const markerPanel = state.markerPanel;
+        if (!markerPanel)
+            return 'markers:none';
+        return [
+            'markers',
+            markerPanel.activeMarkerId ?? '',
+            markerPanel.markersVisible === false ? 'markers-hidden' : 'markers-visible',
+            markerPanel.status ?? '',
+            markerPanel.markerTypes.map(markerType => [
+                markerType.type,
+                markerType.label,
+                markerType.kind ?? '',
+                markerType.description ?? '',
+                markerType.usedByCount ?? 0,
+            ].join('=')).join(';'),
+            (markerPanel.relations ?? []).map(relation => [
+                relation.id,
+                relation.type,
+                relation.from.kind,
+                relation.from.id,
+                relation.from.visibility ?? '',
+                relation.to.kind,
+                relation.to.id,
+                relation.to.visibility ?? '',
+                relation.selected ? 'selected' : '',
+                relation.status ?? '',
+            ].join('=')).join(';'),
+        ].join(':');
+    }
     if (tab === 'rendering') {
         const rendering = state.renderingPanel;
         if (!rendering)
@@ -396,20 +475,22 @@ function resolveLocalEditorRightDockContentKey(state, tab, inspectorFilter) {
         inspectorFilter,
     ].join(':');
 }
-function findLocalEditorRightDockScrollViewport(tab, inspectorPanel, renderingPanel) {
-    const panel = tab === 'inspector' ? inspectorPanel : renderingPanel;
+function findLocalEditorRightDockScrollViewport(tab, inspectorPanel, renderingPanel, markersPanel) {
+    const panel = tab === 'inspector' ? inspectorPanel : tab === 'rendering' ? renderingPanel : markersPanel;
     const selector = tab === 'inspector'
         ? '[data-editor-inspector-scroll-viewport]'
-        : '[data-editor-rendering-scroll-viewport]';
+        : tab === 'rendering'
+            ? '[data-editor-rendering-scroll-viewport]'
+            : '[data-editor-markers-scroll-viewport]';
     return panel.querySelector(selector) ?? panel;
 }
-function captureLocalEditorRightDockScrollSnapshot(state, tab, inspectorFilter, inspectorPanel, renderingPanel) {
+function captureLocalEditorRightDockScrollSnapshot(state, tab, inspectorFilter, inspectorPanel, renderingPanel, markersPanel) {
     if (!state || state.mode !== 'editor')
         return null;
-    const viewport = findLocalEditorRightDockScrollViewport(tab, inspectorPanel, renderingPanel);
+    const viewport = findLocalEditorRightDockScrollViewport(tab, inspectorPanel, renderingPanel, markersPanel);
     if (!viewport)
         return null;
-    const panel = tab === 'inspector' ? inspectorPanel : renderingPanel;
+    const panel = tab === 'inspector' ? inspectorPanel : tab === 'rendering' ? renderingPanel : markersPanel;
     return {
         tab,
         contentKey: resolveLocalEditorRightDockContentKey(state, tab, inspectorFilter),
@@ -418,15 +499,15 @@ function captureLocalEditorRightDockScrollSnapshot(state, tab, inspectorFilter,
         scrollTop: viewport.scrollTop,
     };
 }
-function restoreLocalEditorRightDockScrollSnapshot(snapshot, state, tab, inspectorFilter, inspectorPanel, renderingPanel) {
+function restoreLocalEditorRightDockScrollSnapshot(snapshot, state, tab, inspectorFilter, inspectorPanel, renderingPanel, markersPanel) {
     if (!snapshot || snapshot.tab !== tab || state.mode !== 'editor')
         return;
-    const panel = tab === 'inspector' ? inspectorPanel : renderingPanel;
+    const panel = tab === 'inspector' ? inspectorPanel : tab === 'rendering' ? renderingPanel : markersPanel;
     if ((panel.dataset.editorPanelId ?? tab) !== snapshot.panelId)
         return;
     if (resolveLocalEditorRightDockContentKey(state, tab, inspectorFilter) !== snapshot.contentKey)
         return;
-    const viewport = findLocalEditorRightDockScrollViewport(tab, inspectorPanel, renderingPanel);
+    const viewport = findLocalEditorRightDockScrollViewport(tab, inspectorPanel, renderingPanel, markersPanel);
     if (!viewport)
         return;
     viewport.scrollLeft = snapshot.scrollLeft;
@@ -455,6 +536,132 @@ function readRenderingImmediateSource(input) {
         return 'list';
     return 'input';
 }
+function createMarkerTypeActionInput(button) {
+    const action = button.dataset.editorMarkerTypeAction;
+    if (action === 'create') {
+        const block = button.closest('[data-editor-marker-type-create]');
+        if (!block)
+            return null;
+        const type = readMarkerTypeFieldValue(block, 'type');
+        if (!type)
+            return null;
+        const label = readMarkerTypeFieldValue(block, 'label') || type;
+        return {
+            action: 'create',
+            type,
+            label,
+            kind: readMarkerTypeFieldValue(block, 'kind') || undefined,
+            description: readMarkerTypeFieldValue(block, 'description') || undefined,
+        };
+    }
+    const row = button.closest('[data-editor-marker-type-row]');
+    const type = row?.dataset.editorMarkerTypeRow?.trim() ?? '';
+    if (!row || !type)
+        return null;
+    if (action === 'delete')
+        return { action: 'delete', type };
+    if (action !== 'update')
+        return null;
+    return {
+        action: 'update',
+        type,
+        label: readMarkerTypeFieldValue(row, 'label') || type,
+        kind: readMarkerTypeFieldValue(row, 'kind') || undefined,
+        description: readMarkerTypeFieldValue(row, 'description'),
+    };
+}
+function createMarkerRelationActionInput(target) {
+    const action = target.dataset.editorMarkerRelationAction;
+    if (action === 'delete') {
+        const row = target.closest('[data-editor-marker-relation-row]');
+        const relationId = row?.dataset.editorMarkerRelationRow?.trim() ?? '';
+        return relationId ? { action: 'delete', relationId } : null;
+    }
+    if (action === 'reverse') {
+        const row = target.closest('[data-editor-marker-relation-row]');
+        const relationId = row?.dataset.editorMarkerRelationRow?.trim() ?? '';
+        return relationId ? { action: 'reverse', relationId } : null;
+    }
+    if (action === 'delete-connected') {
+        const markerId = target.dataset.editorMarkerRelationMarkerId?.trim() ?? '';
+        return { action: 'delete-connected', ...(markerId ? { markerId } : {}) };
+    }
+    if (action === 'select') {
+        const row = target.closest('[data-editor-marker-relation-row]');
+        const relationId = row?.dataset.editorMarkerRelationRow?.trim() ?? '';
+        return relationId ? { action: 'select', relationId } : null;
+    }
+    if (action === 'pick-cancel')
+        return { action: 'pick-cancel' };
+    if (action !== 'create' && action !== 'pick-start')
+        return null;
+    const block = target.closest('[data-editor-marker-relation-create]');
+    if (!block)
+        return null;
+    const type = readMarkerRelationTypeFieldValue(block);
+    const from = readMarkerRelationEndpointFieldValue(block, 'from');
+    const to = readMarkerRelationEndpointFieldValue(block, 'to');
+    if (!type || !from || (action === 'create' && !to))
+        return null;
+    const directed = readMarkerRelationDirectionFieldValue(block);
+    if (action === 'pick-start') {
+        return {
+            action: 'pick-start',
+            type,
+            fromKind: from.kind,
+            fromId: from.id,
+            ...(directed === null ? {} : { directed }),
+        };
+    }
+    return {
+        action: 'create',
+        type,
+        fromKind: from.kind,
+        fromId: from.id,
+        toKind: to.kind,
+        toId: to.id,
+        ...(directed === null ? {} : { directed }),
+    };
+}
+function readMarkerTypeFieldValue(parent, field) {
+    const input = parent.querySelector(`[data-editor-marker-type-field="${field}"]`);
+    return input?.value.trim() ?? '';
+}
+function readMarkerRelationTypeFieldValue(parent) {
+    const select = parent.querySelector('[data-editor-marker-relation-field="type"]');
+    return select?.value.trim() ?? '';
+}
+function readMarkerRelationDirectionFieldValue(parent) {
+    const select = parent.querySelector('[data-editor-marker-relation-field="directed"]');
+    if (!select || select.value === 'default')
+        return null;
+    return select.value === 'true';
+}
+function readMarkerRelationEndpointFieldValue(parent, field) {
+    const select = parent.querySelector(`[data-editor-marker-relation-field="${field}"]`);
+    const option = select?.selectedOptions.item(0) ?? null;
+    const kind = option?.dataset.editorMarkerRelationEndpointKind?.trim();
+    const id = option?.dataset.editorMarkerRelationEndpointId?.trim();
+    if (kind && id)
+        return { kind, id };
+    return decodeMarkerRelationEndpointValue(select?.value);
+}
+function decodeMarkerRelationEndpointValue(value) {
+    const raw = value?.trim();
+    if (!raw)
+        return null;
+    const separator = raw.indexOf(':');
+    if (separator <= 0)
+        return null;
+    const kind = raw.slice(0, separator);
+    const encodedId = raw.slice(separator + 1);
+    try {
+        return { kind, id: decodeURIComponent(encodedId) };
+    }
+    catch {
+        return { kind, id: encodedId };
+    }
+}
 function markLocalEditorKeyboardCommittedValue(input) {
     input.dataset.editorKeyboardCommittedValue = input.value;
 }
@@ -764,6 +971,50 @@ const PERFORMANCE_MONITOR_METRIC_GROUPS = [
         ],
     },
 ];
+const PREFAB_IMPORT_STATS_METRICS = [
+    {
+        key: 'source',
+        label: 'Source',
+        description: '当前 prefab preview 使用的 source model 或 source url。',
+        format: stats => stats?.sourceId ?? stats?.assetId ?? '--',
+    },
+    {
+        key: 'nodes',
+        label: 'Nodes',
+        description: 'Babylon 导入后 runtime snapshot 中的节点总数，包含虚拟 root。',
+        format: stats => formatPerformanceInteger(stats?.nodeCount ?? null),
+    },
+    {
+        key: 'transforms',
+        label: 'Transforms',
+        description: 'runtime snapshot 中 root/transform 节点数量。',
+        format: stats => formatPerformanceInteger(stats?.transformCount ?? null),
+    },
+    {
+        key: 'meshes',
+        label: 'Meshes',
+        description: 'runtime snapshot 中可渲染 mesh 节点数量。',
+        format: stats => formatPerformanceInteger(stats?.meshCount ?? null),
+    },
+    {
+        key: 'materials',
+        label: 'Materials',
+        description: 'runtime snapshot 关联到的材质数量。',
+        format: stats => formatPerformanceInteger(stats?.materialCount ?? null),
+    },
+    {
+        key: 'textures',
+        label: 'Textures',
+        description: 'runtime snapshot 关联到的贴图数量。',
+        format: stats => formatPerformanceInteger(stats?.textureCount ?? null),
+    },
+    {
+        key: 'animations',
+        label: 'Animations',
+        description: 'runtime snapshot 关联到的 animation group 数量。',
+        format: stats => formatPerformanceInteger(stats?.animationCount ?? null),
+    },
+];
 function createSceneFrameRateOverlay(doc) {
     const root = doc.createElement('div');
     root.classList.add(LOCAL_EDITOR_THEME_CLASS);
@@ -982,6 +1233,359 @@ function renderPerformanceMonitorOverlay(overlay, stats, open) {
         stats?.activeReasons.length ? `active: ${stats.activeReasons.join(', ')}` : '',
     ].filter(Boolean).join(' | ');
 }
+function createPrefabImportStatsOverlay(doc) {
+    const root = doc.createElement('section');
+    root.classList.add(LOCAL_EDITOR_THEME_CLASS);
+    root.dataset.editorPrefabImportStatsOverlay = 'true';
+    root.setAttribute('aria-label', 'Prefab import diagnostics');
+    root.style.cssText = [
+        'display:none',
+        'width:236px',
+        'max-width:100%',
+        'box-sizing:border-box',
+        'padding:10px',
+        'border:1px solid color-mix(in srgb, var(--fps-editor-border) 78%, transparent)',
+        'border-radius:6px',
+        'background:color-mix(in srgb, var(--fps-editor-chrome) 88%, transparent)',
+        'box-shadow:var(--fps-editor-shadow-panel)',
+        'backdrop-filter:blur(6px)',
+        'font-family:var(--fps-editor-font)',
+        'font-size:11px',
+        'font-weight:800',
+        'color:var(--fps-editor-text)',
+        'pointer-events:auto',
+    ].join(';');
+    const header = doc.createElement('div');
+    header.style.cssText = 'display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;';
+    const title = doc.createElement('div');
+    title.textContent = 'Prefab Import';
+    title.style.cssText = 'min-width:0;color:var(--fps-editor-text-strong);font-size:12px;font-weight:900;line-height:1.2;';
+    const modeLabel = doc.createElement('span');
+    modeLabel.textContent = 'MISSING';
+    modeLabel.style.cssText = [
+        'flex:0 0 auto',
+        'padding:2px 5px',
+        'border:1px solid var(--fps-editor-border-soft)',
+        'border-radius:4px',
+        'background:color-mix(in srgb, var(--fps-editor-field) 72%, transparent)',
+        'color:var(--fps-editor-muted)',
+        'font-size:9px',
+        'line-height:1',
+        'font-weight:900',
+    ].join(';');
+    header.append(title, modeLabel);
+    const grid = doc.createElement('div');
+    grid.style.cssText = [
+        'display:grid',
+        'grid-template-columns:minmax(0,1fr) minmax(76px,108px)',
+        'gap:5px 10px',
+        'align-items:center',
+    ].join(';');
+    const values = {};
+    for (const metric of PREFAB_IMPORT_STATS_METRICS) {
+        const rowLabel = doc.createElement('span');
+        rowLabel.textContent = metric.label;
+        rowLabel.title = metric.description;
+        rowLabel.setAttribute('aria-label', `${metric.label}: ${metric.description}`);
+        rowLabel.style.cssText = [
+            'min-width:0',
+            'overflow:hidden',
+            'text-overflow:ellipsis',
+            'white-space:nowrap',
+            'color:var(--fps-editor-muted-strong)',
+            'cursor:help',
+        ].join(';');
+        const value = doc.createElement('span');
+        value.textContent = '--';
+        value.title = metric.description;
+        value.setAttribute('aria-label', `${metric.label}: --。${metric.description}`);
+        value.style.cssText = [
+            'min-width:0',
+            'justify-self:end',
+            'max-width:108px',
+            'overflow:hidden',
+            'text-overflow:ellipsis',
+            'white-space:nowrap',
+            'font-variant-numeric:tabular-nums',
+            'color:var(--fps-editor-text-strong)',
+            'text-align:right',
+            'cursor:help',
+        ].join(';');
+        values[metric.key] = value;
+        grid.append(rowLabel, value);
+    }
+    root.append(header, grid);
+    return { root, modeLabel, values };
+}
+function renderPrefabImportStatsOverlay(overlay, stage) {
+    if (!stage) {
+        overlay.root.style.display = 'none';
+        return;
+    }
+    overlay.root.style.display = 'block';
+    const stats = stage.importStats ?? null;
+    const status = stats?.status ?? (stage.importStructureReady === false ? 'loading' : 'missing');
+    overlay.modeLabel.textContent = formatPrefabImportStatsStatusLabel(status);
+    overlay.modeLabel.style.color = status === 'ready'
+        ? 'var(--fps-editor-success)'
+        : status === 'loading'
+            ? 'var(--fps-editor-warn)'
+            : 'var(--fps-editor-danger-strong)';
+    for (const metric of PREFAB_IMPORT_STATS_METRICS) {
+        const value = metric.format(stats);
+        overlay.values[metric.key].textContent = value;
+        overlay.values[metric.key].title = `${metric.description}\n${value}`;
+        overlay.values[metric.key].setAttribute('aria-label', `${metric.label}: ${value}。${metric.description}`);
+    }
+    overlay.root.title = [
+        `status: ${status}`,
+        stats?.projectionNodeId ? `preview: ${stats.projectionNodeId}` : stage.previewNodeId ? `preview: ${stage.previewNodeId}` : '',
+        stats?.assetId ? `asset: ${stats.assetId}` : '',
+        stats?.sourceId ? `source: ${stats.sourceId}` : '',
+    ].filter(Boolean).join(' | ');
+}
+function createPrefabStagePreviewLayout(doc) {
+    const root = doc.createElement('section');
+    root.classList.add(LOCAL_EDITOR_THEME_CLASS);
+    root.dataset.editorPrefabStagePreviewLayout = 'true';
+    root.setAttribute('aria-label', 'Prefab stage preview layout');
+    root.style.cssText = [
+        'position:absolute',
+        'left:0',
+        'right:0',
+        'top:38px',
+        'bottom:0',
+        'z-index:4',
+        'display:none',
+        'pointer-events:none',
+        'overflow:hidden',
+        'font-family:var(--fps-editor-font)',
+    ].join(';');
+    const mainRegion = doc.createElement('div');
+    mainRegion.dataset.editorPrefabStageMainPreview = 'true';
+    mainRegion.style.cssText = [
+        'position:absolute',
+        'left:0',
+        'top:0',
+        'bottom:0',
+        'right:0',
+        'min-width:0',
+        'overflow:hidden',
+        'pointer-events:none',
+    ].join(';');
+    const comparisonColumn = doc.createElement('aside');
+    comparisonColumn.dataset.editorPrefabStageComparisonColumn = 'true';
+    comparisonColumn.setAttribute('aria-label', 'Prefab comparison previews');
+    comparisonColumn.style.cssText = [
+        'position:absolute',
+        'top:0',
+        'right:0',
+        'bottom:0',
+        `width:${LOCAL_EDITOR_PREFAB_COMPARISON_COLUMN_WIDTH_PX}px`,
+        'display:none',
+        'flex-direction:column',
+        'box-sizing:border-box',
+        'gap:10px',
+        'padding:10px',
+        'border-left:1px solid color-mix(in srgb, var(--fps-editor-divider) 82%, transparent)',
+        'background:transparent',
+        'box-shadow:none',
+        'pointer-events:auto',
+        'overflow:hidden',
+    ].join(';');
+    root.append(mainRegion, comparisonColumn);
+    return { root, mainRegion, comparisonColumn };
+}
+function createPrefabComparisonPreviewOverlay(doc) {
+    const root = doc.createElement('section');
+    root.classList.add(LOCAL_EDITOR_THEME_CLASS);
+    root.dataset.editorPrefabComparisonPreviewOverlay = 'true';
+    root.setAttribute('aria-label', 'Prefab clone and InstanceMesh comparison previews');
+    root.style.cssText = [
+        'display:none',
+        'flex:1 1 auto',
+        'min-height:0',
+        'width:100%',
+        'box-sizing:border-box',
+        'grid-template-rows:minmax(0,1fr) minmax(0,1fr)',
+        'gap:10px',
+        'overflow:hidden',
+        'font-family:var(--fps-editor-font)',
+        'pointer-events:auto',
+    ].join(';');
+    return { root, cards: new Map() };
+}
+function renderPrefabComparisonPreviewOverlay(overlay, stage) {
+    const previews = stage?.comparisonPreviews ?? [];
+    if (!stage || previews.length === 0) {
+        overlay.root.style.display = 'none';
+        return;
+    }
+    overlay.root.style.display = 'grid';
+    const visibleIds = new Set();
+    for (const preview of previews) {
+        const card = getOrCreatePrefabComparisonPreviewCard(overlay, preview);
+        visibleIds.add(preview.id);
+        card.root.style.display = 'flex';
+        card.title.textContent = preview.label;
+        card.statusLabel.textContent = formatLocalEditorPrefabStageComparisonPreviewStatus(preview.status);
+        card.statusLabel.style.color = getPrefabComparisonPreviewStatusColor(preview.status);
+        card.surface.dataset.editorPrefabComparisonPreviewId = preview.id;
+        card.surface.dataset.editorPrefabComparisonPreviewSurface = preview.projectionNodeId;
+        card.surface.dataset.editorPrefabComparisonPreviewStatus = preview.status;
+        card.surface.style.background = preview.status === 'ready'
+            ? 'transparent'
+            : 'color-mix(in srgb, var(--fps-editor-field) 74%, transparent)';
+        card.surface.textContent = preview.status === 'ready'
+            ? ''
+            : preview.status === 'loading'
+                ? 'Preview loading'
+                : 'Preview unavailable';
+        card.root.title = [
+            `${preview.label}: ${preview.status}`,
+            `mode: ${preview.mode}`,
+            `projection: ${preview.projectionNodeId}`,
+        ].join(' | ');
+    }
+    for (const [id, card] of overlay.cards) {
+        if (!visibleIds.has(id))
+            card.root.style.display = 'none';
+    }
+}
+function readPrefabComparisonPreviewSurfaces(overlay) {
+    if (overlay.root.style.display === 'none')
+        return [];
+    const surfaces = [];
+    for (const [previewId, card] of overlay.cards) {
+        if (card.root.style.display === 'none')
+            continue;
+        const projectionNodeId = card.surface.dataset.editorPrefabComparisonPreviewSurface;
+        if (!projectionNodeId)
+            continue;
+        const rect = card.surface.getBoundingClientRect();
+        if (rect.width < 1 || rect.height < 1)
+            continue;
+        surfaces.push({
+            previewId,
+            projectionNodeId,
+            element: card.surface,
+            rect,
+        });
+    }
+    return surfaces;
+}
+function findPrefabComparisonPreviewSurface(target) {
+    return target instanceof HTMLElement
+        ? target.closest('[data-editor-prefab-comparison-preview-surface]')
+        : null;
+}
+function readPrefabComparisonPreviewSurfaceId(surface) {
+    return surface.dataset.editorPrefabComparisonPreviewId
+        ?? surface.closest('[data-editor-prefab-comparison-preview]')?.dataset.editorPrefabComparisonPreview
+        ?? null;
+}
+function isPrefabComparisonPreviewSurfaceReady(surface) {
+    return surface.dataset.editorPrefabComparisonPreviewStatus === 'ready';
+}
+function getOrCreatePrefabComparisonPreviewCard(overlay, preview) {
+    const existing = overlay.cards.get(preview.id);
+    if (existing)
+        return existing;
+    const doc = overlay.root.ownerDocument;
+    const root = doc.createElement('article');
+    root.dataset.editorPrefabComparisonPreview = preview.id;
+    root.style.cssText = [
+        'display:flex',
+        'flex-direction:column',
+        'min-width:0',
+        'min-height:0',
+        'flex:1 1 0',
+        'box-sizing:border-box',
+        'padding:8px',
+        'border:1px solid color-mix(in srgb, var(--fps-editor-border) 78%, transparent)',
+        'border-radius:6px',
+        'background:transparent',
+        'box-shadow:none',
+        'color:var(--fps-editor-text)',
+        'pointer-events:auto',
+        'overflow:hidden',
+    ].join(';');
+    const header = doc.createElement('div');
+    header.style.cssText = [
+        'display:flex',
+        'align-items:center',
+        'justify-content:space-between',
+        'gap:8px',
+        'margin-bottom:7px',
+        'padding:6px 8px',
+        'border:1px solid color-mix(in srgb, var(--fps-editor-border) 74%, transparent)',
+        'border-radius:5px',
+        'background:color-mix(in srgb, var(--fps-editor-chrome) 86%, transparent)',
+        'box-shadow:0 6px 14px color-mix(in srgb, #000 18%, transparent)',
+    ].join(';');
+    const title = doc.createElement('div');
+    title.textContent = preview.label;
+    title.style.cssText = [
+        'min-width:0',
+        'overflow:hidden',
+        'text-overflow:ellipsis',
+        'white-space:nowrap',
+        'color:var(--fps-editor-text-strong)',
+        'font-size:12px',
+        'line-height:1.2',
+        'font-weight:900',
+    ].join(';');
+    const statusLabel = doc.createElement('span');
+    statusLabel.textContent = 'UNAVAILABLE';
+    statusLabel.style.cssText = [
+        'flex:0 0 auto',
+        'padding:2px 5px',
+        'border:1px solid var(--fps-editor-border-soft)',
+        'border-radius:4px',
+        'background:color-mix(in srgb, var(--fps-editor-field) 72%, transparent)',
+        'font-size:9px',
+        'line-height:1',
+        'font-weight:900',
+    ].join(';');
+    header.append(title, statusLabel);
+    const surface = doc.createElement('div');
+    surface.style.cssText = [
+        'display:flex',
+        'flex:1 1 auto',
+        'align-items:center',
+        'justify-content:center',
+        'width:100%',
+        'min-height:0',
+        'box-sizing:border-box',
+        'border:1px solid color-mix(in srgb, var(--fps-editor-border-soft) 84%, transparent)',
+        'border-radius:4px',
+        'background:transparent',
+        'overflow:hidden',
+        'color:var(--fps-editor-muted)',
+        'font-size:10px',
+        'font-weight:800',
+        'text-align:center',
+        'touch-action:none',
+        'user-select:none',
+        'cursor:grab',
+    ].join(';');
+    root.append(header, surface);
+    overlay.root.appendChild(root);
+    const card = { root, title, statusLabel, surface };
+    overlay.cards.set(preview.id, card);
+    return card;
+}
+function getPrefabComparisonPreviewStatusColor(status) {
+    const tone = resolveLocalEditorPrefabStageComparisonPreviewTone(status);
+    return tone === 'success'
+        ? 'var(--fps-editor-success)'
+        : tone === 'warning'
+            ? 'var(--fps-editor-warn)'
+            : 'var(--fps-editor-danger-strong)';
+}
+function formatPrefabImportStatsStatusLabel(status) {
+    return status === 'ready' ? 'READY' : status === 'loading' ? 'LOADING' : 'MISSING';
+}
 function formatPerformanceInteger(value) {
     return typeof value === 'number' && Number.isFinite(value) ? String(Math.round(value)) : '--';
 }
@@ -1413,10 +2017,10 @@ function formatSvgNumber(value) {
     return Number.isFinite(value) ? value.toFixed(2) : '0';
 }
 function isLocalEditorAssetBrowserTab(value) {
-    return value === 'all' || value === 'models' || value === 'materials' || value === 'textures';
+    return value === 'all' || value === 'models' || value === 'prefabs' || value === 'materials' || value === 'textures';
 }
-function createAssetBrowserMenuItems(state, asset) {
-    const assetKind = resolveBrowserAssetKind(asset);
+export function createAssetBrowserMenuItems(state, asset) {
+    const assetKind = resolveLocalEditorBrowserAssetKind(asset);
     const placeable = asset.placeable !== false && asset.disabled !== true;
     const activeId = state.activeId;
     const items = [];
@@ -1449,6 +2053,20 @@ function createAssetBrowserMenuItems(state, asset) {
             label: '查看贴图预览',
         });
     }
+    else if (assetKind === 'prefab') {
+        items.push({
+            id: 'asset.edit-prefab',
+            label: '编辑 Prefab',
+            disabled: !asset.prefab,
+            disabledReason: '该预制体资产缺少可编辑参数。',
+        });
+        items.push({
+            id: 'asset.duplicate-prefab',
+            label: '复制 Prefab',
+            disabled: !asset.assetId && !asset.id,
+            disabledReason: '该预制体资产缺少可复制的 Prefab ID。',
+        });
+    }
     if (assetKind === 'material') {
         items.push({
             id: 'asset.apply-material',
@@ -1486,6 +2104,21 @@ function createAssetBrowserMenuItems(state, asset) {
             disabledReason: '自发光遮罩绑定将在下一步接入。',
         });
     }
+    else if (assetKind === 'prefab') {
+        items.push({
+            id: 'asset.add-to-scene',
+            label: '添加 Prefab 到场景',
+            separatorBefore: true,
+            disabled: !placeable,
+            disabledReason: '该 Prefab 当前不可放置。',
+        });
+        items.push({
+            id: 'asset.place',
+            label: '进入 Prefab 放置模式',
+            disabled: !placeable,
+            disabledReason: '该 Prefab 当前不可放置。',
+        });
+    }
     else {
         items.push({
             id: 'asset.add-to-scene',
@@ -1499,12 +2132,18 @@ function createAssetBrowserMenuItems(state, asset) {
             disabled: !placeable,
             disabledReason: '该模型当前不可放置。',
         });
+        items.push({
+            id: 'asset.create-prefab',
+            label: '创建 Prefab',
+            disabled: !asset.assetId && !asset.id,
+            disabledReason: '该模型缺少可创建 Prefab 的 Asset ID。',
+            separatorBefore: true,
+        });
         items.push({
             id: 'asset.add-as-child',
             label: '添加为当前节点子对象',
             disabled: true,
             disabledReason: '子对象添加动作将在资产 patch 中接入。',
-            separatorBefore: true,
         });
         items.push({
             id: 'asset.replace-selected-model',
@@ -1532,22 +2171,12 @@ function getMaterialAssetDeleteDisabledReason(asset) {
         return `该材质正在被 ${usageCount} 处使用，请先替换或解绑。`;
     return undefined;
 }
-function resolveBrowserAssetKind(asset) {
-    const kind = `${asset.kind ?? ''}`.trim().toLowerCase();
-    const id = `${asset.id ?? ''}`.trim().toLowerCase();
-    const assetId = `${asset.assetId ?? ''}`.trim().toLowerCase();
-    if (kind === 'material' || id.startsWith('material:') || assetId.startsWith('mat_'))
-        return 'material';
-    if (kind === 'texture' || kind === 'image' || id.startsWith('texture:') || assetId.startsWith('texture_'))
-        return 'texture';
-    return 'model';
-}
 function createAssetBrowserActionInput(actionId, asset) {
     return {
         actionId,
         assetId: asset.assetId ?? asset.id,
         browserAssetId: asset.id,
-        assetKind: asset.kind,
+        assetKind: asset.kind ?? resolveLocalEditorBrowserAssetKind(asset),
     };
 }
 function copyTextToClipboard(win, text) {
@@ -1755,6 +2384,7 @@ export function createLocalEditorBrowserUi(options = {}) {
     const redoButton = createToolbarIconButton(doc, '重做', 'redo', '重做');
     let helpOpen = false;
     let performanceMonitorOpen = false;
+    let prefabComparisonPreviewOpen = true;
     let assetPreviewOpen = false;
     let previewedAsset = null;
     let assetPreviewMode = 'preview';
@@ -1762,6 +2392,8 @@ export function createLocalEditorBrowserUi(options = {}) {
     let assetPickerFilter = '';
     let assetPickerInput = null;
     let assetPickerProperty = null;
+    let prefabStageExplorerFilter = '';
+    let prefabComparisonPreviewDrag = null;
     const editorStatusButton = createToolbarIconButton(doc, '编辑器状态', 'status', '编辑器状态');
     editorStatusButton.dataset.editorStatusButton = 'true';
     editorStatusButton.style.cursor = 'help';
@@ -1772,14 +2404,22 @@ export function createLocalEditorBrowserUi(options = {}) {
     const rightDockTabs = doc.createElement('div');
     const inspectorPanel = createWorkbenchPanelContent(doc);
     const renderingPanel = createWorkbenchPanelContent(doc);
+    const markersPanel = createWorkbenchPanelContent(doc);
     workbench.leftDock.appendChild(leftDockTabs);
     workbench.leftDock.appendChild(hierarchyPanel);
     workbench.rightDock.appendChild(rightDockTabs);
     workbench.rightDock.appendChild(inspectorPanel);
     workbench.rightDock.appendChild(renderingPanel);
+    workbench.rightDock.appendChild(markersPanel);
     root.appendChild(workbench.root);
     tooltipSurfaces.add(workbench.root);
-    const workbenchLayoutController = createLocalEditorWorkbenchLayoutController(doc, workbench);
+    const workbenchLayoutController = createLocalEditorWorkbenchLayoutController(doc, workbench, {
+        onAfterApply(layout) {
+            if (currentState?.mode === 'editor' && currentState.prefabStage) {
+                applyPrefabStageWorkbenchLayoutOverride(layout);
+            }
+        },
+    });
     const findAssetBrowserScrollViewport = () => (assetPanel.querySelector('[data-editor-asset-browser-scroll-viewport]'));
     const assetBrowserViewportReveal = createLocalEditorViewportRevealController({
         getViewport: findAssetBrowserScrollViewport,
@@ -2152,13 +2792,20 @@ export function createLocalEditorBrowserUi(options = {}) {
     performanceMonitorButton.dataset.performanceMonitorToggle = 'true';
     const gridToggleButton = createToolbarIconButton(doc, '网格', 'grid', '显示 / 隐藏 Scene View 网格');
     gridToggleButton.dataset.editorGridToggle = 'true';
+    const prefabComparisonPreviewButton = createToolbarIconButton(doc, '对比预览', 'eye', 'Compare Previews (Shift+P)', 'toggle');
+    prefabComparisonPreviewButton.dataset.prefabComparisonPreviewToggle = 'true';
     const sceneHelpButton = createToolbarIconButton(doc, '快捷键', 'help', '快捷键与操作说明');
     sceneQuickActions.appendChild(localTestGroup);
+    const prefabStageBackButton = createToolbarIconButton(doc, '返回场景', 'chevron-right', '返回主场景');
+    prefabStageBackButton.dataset.editorPrefabStageBack = 'true';
+    prefabStageBackButton.style.display = 'none';
+    sceneQuickActions.appendChild(prefabStageBackButton);
     sceneQuickActions.appendChild(undoButton);
     sceneQuickActions.appendChild(redoButton);
     sceneQuickActions.appendChild(dirtyBadge);
     sceneUtilityActions.appendChild(performanceMonitorButton);
     sceneUtilityActions.appendChild(gridToggleButton);
+    sceneUtilityActions.appendChild(prefabComparisonPreviewButton);
     sceneUtilityActions.appendChild(themeToggleButton);
     sceneUtilityActions.appendChild(sceneHelpButton);
     const cameraPreviewGroup = doc.createElement('div');
@@ -2190,6 +2837,9 @@ export function createLocalEditorBrowserUi(options = {}) {
     const projectionToggleButton = createToolbarIconButton(doc, '投影模式', 'projection-perspective', '切换投影模式');
     projectionToggleButton.dataset.viewportProjectionToggle = 'true';
     viewportToolsGroup.appendChild(projectionToggleButton);
+    const markerVisibilityButton = createToolbarIconButton(doc, '标记视图', 'view-overlay', '隐藏标记与关系线', 'toggle');
+    markerVisibilityButton.dataset.viewportMarkerVisibilityToggle = 'true';
+    viewportToolsGroup.appendChild(markerVisibilityButton);
     const overlaySettingsButton = createToolbarIconButton(doc, '视口信息层设置', 'view-overlay', '视口信息层设置', 'settings');
     overlaySettingsButton.dataset.viewportOverlaySettingsToggle = 'true';
     viewportToolsGroup.appendChild(overlaySettingsButton);
@@ -2266,6 +2916,112 @@ export function createLocalEditorBrowserUi(options = {}) {
     const coordinateAxesOverlay = createCoordinateAxesOverlay(doc);
     const sceneFrameRateOverlay = createSceneFrameRateOverlay(doc);
     const performanceMonitorOverlay = createPerformanceMonitorOverlay(doc);
+    const prefabImportStatsOverlay = createPrefabImportStatsOverlay(doc);
+    const prefabComparisonPreviewOverlay = createPrefabComparisonPreviewOverlay(doc);
+    const prefabStagePreviewLayout = createPrefabStagePreviewLayout(doc);
+    prefabImportStatsOverlay.root.style.position = 'absolute';
+    prefabImportStatsOverlay.root.style.top = '10px';
+    prefabImportStatsOverlay.root.style.right = '14px';
+    prefabComparisonPreviewOverlay.root.style.height = '100%';
+    prefabStagePreviewLayout.mainRegion.appendChild(prefabImportStatsOverlay.root);
+    prefabStagePreviewLayout.comparisonColumn.appendChild(prefabComparisonPreviewOverlay.root);
+    const emitPrefabComparisonPreviewInteraction = (input) => {
+        if (currentState?.mode !== 'editor' || !currentState.prefabStage)
+            return;
+        callbacks.onPrefabComparisonPreviewInteraction?.(input);
+    };
+    const endPrefabComparisonPreviewDrag = (pointerId) => {
+        const drag = prefabComparisonPreviewDrag;
+        if (!drag || (pointerId != null && drag.pointerId !== pointerId))
+            return;
+        try {
+            if (!drag.surface.hasPointerCapture || drag.surface.hasPointerCapture(drag.pointerId)) {
+                drag.surface.releasePointerCapture?.(drag.pointerId);
+            }
+        }
+        catch {
+            // Pointer capture may already be released by the browser when this cleanup runs.
+        }
+        drag.surface.style.cursor = 'grab';
+        prefabComparisonPreviewDrag = null;
+    };
+    const onPrefabComparisonPreviewPointerDown = (event) => {
+        if (event.button !== 0 || currentState?.mode !== 'editor' || !currentState.prefabStage)
+            return;
+        const surface = findPrefabComparisonPreviewSurface(event.target);
+        if (!surface || !isPrefabComparisonPreviewSurfaceReady(surface))
+            return;
+        const previewId = readPrefabComparisonPreviewSurfaceId(surface);
+        if (!previewId)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        endPrefabComparisonPreviewDrag();
+        try {
+            surface.setPointerCapture?.(event.pointerId);
+        }
+        catch {
+            // Pointer capture is an input nicety; drag state still works through the overlay listener.
+        }
+        surface.style.cursor = 'grabbing';
+        prefabComparisonPreviewDrag = {
+            pointerId: event.pointerId,
+            previewId,
+            surface,
+            lastClientX: event.clientX,
+            lastClientY: event.clientY,
+        };
+    };
+    const onPrefabComparisonPreviewPointerMove = (event) => {
+        const drag = prefabComparisonPreviewDrag;
+        if (!drag || drag.pointerId !== event.pointerId)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        const deltaX = event.clientX - drag.lastClientX;
+        const deltaY = event.clientY - drag.lastClientY;
+        drag.lastClientX = event.clientX;
+        drag.lastClientY = event.clientY;
+        if (Math.abs(deltaX) < 0.001 && Math.abs(deltaY) < 0.001)
+            return;
+        emitPrefabComparisonPreviewInteraction({
+            kind: 'orbit',
+            previewId: drag.previewId,
+            deltaX,
+            deltaY,
+        });
+    };
+    const onPrefabComparisonPreviewPointerEnd = (event) => {
+        const drag = prefabComparisonPreviewDrag;
+        if (!drag || drag.pointerId !== event.pointerId)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        endPrefabComparisonPreviewDrag(event.pointerId);
+    };
+    const onPrefabComparisonPreviewWheel = (event) => {
+        if (currentState?.mode !== 'editor' || !currentState.prefabStage)
+            return;
+        const surface = findPrefabComparisonPreviewSurface(event.target);
+        if (!surface || !isPrefabComparisonPreviewSurfaceReady(surface))
+            return;
+        const previewId = readPrefabComparisonPreviewSurfaceId(surface);
+        if (!previewId)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        emitPrefabComparisonPreviewInteraction({
+            kind: 'zoom',
+            previewId,
+            deltaY: event.deltaY,
+        });
+    };
+    prefabComparisonPreviewOverlay.root.addEventListener('pointerdown', onPrefabComparisonPreviewPointerDown);
+    prefabComparisonPreviewOverlay.root.addEventListener('pointermove', onPrefabComparisonPreviewPointerMove);
+    prefabComparisonPreviewOverlay.root.addEventListener('pointerup', onPrefabComparisonPreviewPointerEnd);
+    prefabComparisonPreviewOverlay.root.addEventListener('pointercancel', onPrefabComparisonPreviewPointerEnd);
+    prefabComparisonPreviewOverlay.root.addEventListener('lostpointercapture', onPrefabComparisonPreviewPointerEnd);
+    prefabComparisonPreviewOverlay.root.addEventListener('wheel', onPrefabComparisonPreviewWheel, { passive: false });
     const spatialOverlay = createSpatialOverlay(doc);
     const measurementOverlay = createMeasurementOverlay(doc);
     sceneToolOverlay.appendChild(sceneTitle);
@@ -2286,6 +3042,7 @@ export function createLocalEditorBrowserUi(options = {}) {
     workbench.sceneFrame.appendChild(measurementOverlay.root);
     workbench.sceneFrame.appendChild(sceneFrameRateOverlay.root);
     workbench.sceneFrame.appendChild(performanceMonitorOverlay.root);
+    workbench.sceneFrame.appendChild(prefabStagePreviewLayout.root);
     workbench.sceneFrame.appendChild(coordinateAxesOverlay.root);
     root.appendChild(localTestMenu);
     root.appendChild(toolbarOverflowMenu);
@@ -2483,6 +3240,9 @@ export function createLocalEditorBrowserUi(options = {}) {
         applyLocalEditorTheme(measurementOverlay.root, activeTheme);
         applyLocalEditorTheme(sceneFrameRateOverlay.root, activeTheme);
         applyLocalEditorTheme(performanceMonitorOverlay.root, activeTheme);
+        applyLocalEditorTheme(prefabStagePreviewLayout.root, activeTheme);
+        applyLocalEditorTheme(prefabImportStatsOverlay.root, activeTheme);
+        applyLocalEditorTheme(prefabComparisonPreviewOverlay.root, activeTheme);
         applyLocalEditorTheme(shortcutHelpPanel, activeTheme);
         applyLocalEditorTheme(assetPreviewModal, activeTheme);
         applyLocalEditorTheme(assetPickerModal, activeTheme);
@@ -3002,6 +3762,9 @@ export function createLocalEditorBrowserUi(options = {}) {
     performanceMonitorButton.addEventListener('click', () => {
         setPerformanceMonitorOpen(!performanceMonitorOpen);
     });
+    prefabComparisonPreviewButton.addEventListener('click', () => {
+        setPrefabComparisonPreviewOpen(!prefabComparisonPreviewOpen);
+    });
     gridToggleButton.addEventListener('click', () => {
         const visible = currentState?.grid?.visible ?? true;
         callbacks.onGridVisibleChange?.(!visible);
@@ -3055,6 +3818,12 @@ export function createLocalEditorBrowserUi(options = {}) {
             callbacks.onViewportProjectionModeChange?.(nextMode);
             return;
         }
+        const markerVisibilityToggle = target?.closest('[data-viewport-marker-visibility-toggle]');
+        if (markerVisibilityToggle) {
+            const markersVisible = currentState?.viewportTools?.markersVisible ?? true;
+            callbacks.onMarkerViewportVisibilityChange?.(!markersVisible);
+            return;
+        }
         const overlayToggle = target?.closest('[data-viewport-overlay-settings-toggle]');
         if (overlayToggle) {
             event.stopPropagation();
@@ -3088,10 +3857,21 @@ export function createLocalEditorBrowserUi(options = {}) {
             contextMenu.close();
         performanceMonitorOpen = open;
         LocalEditorShared.applyButtonActiveState(performanceMonitorButton, performanceMonitorOpen);
-        renderPerformanceMonitorOverlay(performanceMonitorOverlay, currentState?.mode === 'editor' ? currentState.performanceStats ?? null : null, currentState?.mode === 'editor' && performanceMonitorOpen);
+        renderPerformanceMonitorOverlay(performanceMonitorOverlay, currentState?.mode === 'editor' && !currentState.prefabStage ? currentState.performanceStats ?? null : null, currentState?.mode === 'editor' && !currentState.prefabStage && performanceMonitorOpen);
         if (notify)
             callbacks.onPerformanceMonitorOpenChange?.(performanceMonitorOpen);
     };
+    const setPrefabComparisonPreviewOpen = (open) => {
+        if (prefabComparisonPreviewOpen === open)
+            return;
+        if (!open)
+            endPrefabComparisonPreviewDrag();
+        prefabComparisonPreviewOpen = open;
+        if (currentState)
+            renderPreviewState(currentState);
+        LocalEditorShared.applyButtonActiveState(prefabComparisonPreviewButton, prefabComparisonPreviewOpen);
+        callbacks.onPrefabComparisonPreviewLayoutChange?.();
+    };
     const openAssetPreviewModal = (asset) => {
         if (!asset.preview)
             return;
@@ -3164,7 +3944,10 @@ export function createLocalEditorBrowserUi(options = {}) {
     }
     function renderAssetPreviewModal() {
         const asset = resolvePreviewedAssetFromState();
-        if (!assetPreviewOpen || !asset || (assetPreviewMode === 'preview' && !asset.preview) || (assetPreviewMode === 'material-editor' && !asset.material)) {
+        if (!assetPreviewOpen
+            || !asset
+            || (assetPreviewMode === 'preview' && !asset.preview)
+            || (assetPreviewMode === 'material-editor' && !asset.material)) {
             assetPreviewModal.style.display = 'none';
             assetPreviewTitle.textContent = '';
             assetPreviewMeta.textContent = '';
@@ -3404,7 +4187,7 @@ export function createLocalEditorBrowserUi(options = {}) {
         const options = [{ label: '继承 / 无', value: '', meta: '清空贴图引用' }];
         const seen = new Set(['']);
         for (const asset of currentState?.assets ?? []) {
-            if (resolveBrowserAssetKind(asset) !== 'texture')
+            if (resolveLocalEditorBrowserAssetKind(asset) !== 'texture')
                 continue;
             const value = asset.preview?.kind === 'image'
                 ? asset.preview.url
@@ -3564,6 +4347,9 @@ export function createLocalEditorBrowserUi(options = {}) {
     sceneHelpButton.addEventListener('click', () => {
         setShortcutHelpOpen(!helpOpen);
     });
+    prefabStageBackButton.addEventListener('click', () => {
+        callbacks.onExitPrefabStage?.();
+    });
     themeToggleButton.addEventListener('click', () => {
         setActiveTheme(activeTheme === 'dark' ? 'light' : 'dark');
     });
@@ -3583,9 +4369,9 @@ export function createLocalEditorBrowserUi(options = {}) {
             closeAssetPreviewModal();
     });
     assetPreviewBody.addEventListener('change', (event) => {
+        const target = event.target instanceof HTMLElement ? event.target : null;
         if (assetPreviewMode !== 'material-editor')
             return;
-        const target = event.target instanceof HTMLElement ? event.target : null;
         const input = target?.closest('[data-editor-asset-material-field]');
         if (!input)
             return;
@@ -3764,6 +4550,10 @@ export function createLocalEditorBrowserUi(options = {}) {
                     openAssetMaterialEditorModal(asset);
                     return;
                 }
+                if (item.id === 'asset.edit-prefab') {
+                    callbacks.onAssetAction?.(createAssetBrowserActionInput(item.id, asset));
+                    return;
+                }
                 if (item.id === 'asset.copy-id') {
                     copyTextToClipboard(doc.defaultView, asset.assetId ?? asset.id);
                     return;
@@ -3776,7 +4566,7 @@ export function createLocalEditorBrowserUi(options = {}) {
         const target = event.target instanceof HTMLElement ? event.target : null;
         const openTabButton = target?.closest('[data-editor-open-right-dock-tab]');
         const openTab = openTabButton?.dataset.editorOpenRightDockTab;
-        if (openTab === 'inspector' || openTab === 'rendering') {
+        if (isLocalEditorRightDockTab(openTab)) {
             panelRegistry.setRightDockTab(openTab);
             if (currentState)
                 render(currentState);
@@ -3784,7 +4574,7 @@ export function createLocalEditorBrowserUi(options = {}) {
         }
         const tabButton = target?.closest('[data-editor-right-dock-tab]');
         const tab = tabButton?.dataset.editorRightDockTab;
-        if (tab === 'inspector' || tab === 'rendering') {
+        if (isLocalEditorRightDockTab(tab)) {
             panelRegistry.setRightDockTab(tab);
             if (currentState)
                 render(currentState);
@@ -3792,6 +4582,12 @@ export function createLocalEditorBrowserUi(options = {}) {
     });
     workbench.leftDock.addEventListener('click', (event) => {
         const target = event.target instanceof HTMLElement ? event.target : null;
+        const prefabStageItem = target?.closest('[data-editor-prefab-stage-item]');
+        const prefabStageItemId = prefabStageItem?.dataset.editorPrefabStageItem;
+        if (prefabStageItemId) {
+            callbacks.onSelectPrefabStageItem?.(prefabStageItemId);
+            return;
+        }
         const tabButton = target?.closest('[data-editor-left-dock-tab]');
         const tab = tabButton?.dataset.editorLeftDockTab;
         if (tab === 'hierarchy') {
@@ -3800,6 +4596,15 @@ export function createLocalEditorBrowserUi(options = {}) {
                 render(currentState);
         }
     });
+    workbench.leftDock.addEventListener('input', (event) => {
+        const target = event.target instanceof HTMLElement ? event.target : null;
+        const input = target?.closest('[data-editor-prefab-stage-explorer-search]');
+        if (!input)
+            return;
+        prefabStageExplorerFilter = input.value;
+        if (currentState)
+            render(currentState);
+    });
     const hierarchyController = createLocalEditorHierarchyController({
         doc,
         panel: hierarchyPanel,
@@ -3882,6 +4687,28 @@ export function createLocalEditorBrowserUi(options = {}) {
             callbacks.onRenderingAction?.(actionInput);
             return;
         }
+        const inspectorActionButton = target?.closest('[data-editor-inspector-action]');
+        if (inspectorActionButton) {
+            if (inspectorActionButton.disabled)
+                return;
+            const actionInput = createInspectorActionInput(inspectorActionButton);
+            if (!actionInput)
+                return;
+            event.preventDefault();
+            event.stopPropagation();
+            callbacks.onInspectorAction?.(actionInput);
+            return;
+        }
+        const relationTarget = target?.closest('[data-editor-marker-relation-action]');
+        if (relationTarget && !(relationTarget instanceof HTMLButtonElement && relationTarget.disabled)) {
+            const relationInput = createMarkerRelationActionInput(relationTarget);
+            if (!relationInput)
+                return;
+            event.preventDefault();
+            event.stopPropagation();
+            callbacks.onMarkerRelationAction?.(relationInput);
+            return;
+        }
         const vectorLockButton = target?.closest('[data-editor-inspector-vector-lock]');
         if (vectorLockButton) {
             const groupPath = vectorLockButton.dataset.editorInspectorVectorLock;
@@ -4084,6 +4911,28 @@ export function createLocalEditorBrowserUi(options = {}) {
             openStaticShadowBakePopover();
         callbacks.onRenderingAction?.(actionInput);
     });
+    markersPanel.addEventListener('click', (event) => {
+        const eventTarget = event.target instanceof HTMLElement ? event.target : null;
+        const relationTarget = eventTarget?.closest('[data-editor-marker-relation-action]');
+        if (relationTarget && !(relationTarget instanceof HTMLButtonElement && relationTarget.disabled)) {
+            const relationInput = createMarkerRelationActionInput(relationTarget);
+            if (!relationInput)
+                return;
+            event.preventDefault();
+            event.stopPropagation();
+            callbacks.onMarkerRelationAction?.(relationInput);
+            return;
+        }
+        const actionButton = eventTarget?.closest('[data-editor-marker-type-action]');
+        if (!actionButton || actionButton.disabled)
+            return;
+        const actionInput = createMarkerTypeActionInput(actionButton);
+        if (!actionInput)
+            return;
+        event.preventDefault();
+        event.stopPropagation();
+        callbacks.onMarkerTypeAction?.(actionInput);
+    });
     const onKeyDown = (event) => {
         if (event.defaultPrevented)
             return;
@@ -4125,9 +4974,27 @@ export function createLocalEditorBrowserUi(options = {}) {
             closeStaticShadowBakePopover();
             return;
         }
+        if (key === 'escape' && currentState?.prefabStage) {
+            event.preventDefault();
+            callbacks.onExitPrefabStage?.();
+            return;
+        }
         const primaryModifier = event.metaKey || event.ctrlKey;
         const handleDocumentShortcut = inputRouter.shouldHandleDocumentShortcut(event);
         const handleGlobalShortcut = inputRouter.shouldHandleGlobalShortcut(event);
+        if (shouldToggleLocalEditorPrefabComparisonShortcut({
+            inPrefabStage: currentState.prefabStage != null,
+            handleGlobalShortcut,
+            key,
+            shiftKey: event.shiftKey,
+            metaKey: event.metaKey,
+            ctrlKey: event.ctrlKey,
+            altKey: event.altKey,
+        })) {
+            event.preventDefault();
+            setPrefabComparisonPreviewOpen(!prefabComparisonPreviewOpen);
+            return;
+        }
         if (handleDocumentShortcut && localTestActionsEnabled && primaryModifier && key === 's') {
             event.preventDefault();
             callbacks.onSaveScene?.();
@@ -4146,9 +5013,22 @@ export function createLocalEditorBrowserUi(options = {}) {
             callbacks.onRedo?.();
             return;
         }
-        if (handleGlobalShortcut && hierarchyController.handleEditShortcut(event)) {
+        if (shouldLocalEditorPrefabStageBlockHierarchyShortcut({
+            inPrefabStage: currentState.prefabStage != null,
+            handleGlobalShortcut,
+            key,
+            metaKey: event.metaKey,
+            ctrlKey: event.ctrlKey,
+            altKey: event.altKey,
+        })) {
+            event.preventDefault();
+            return;
+        }
+        if (!currentState.prefabStage && handleGlobalShortcut && hierarchyController.handleEditShortcut(event)) {
             return;
         }
+        if (currentState.prefabStage)
+            return;
         if (!handleGlobalShortcut || event.metaKey || event.ctrlKey || event.altKey)
             return;
         const toolByKey = {
@@ -4190,8 +5070,276 @@ export function createLocalEditorBrowserUi(options = {}) {
             ? operationState.canAlign
             : operationState.canDistribute;
     }
+    function applyPrefabStageWorkbenchLayoutOverride(layout = workbenchLayoutController.getLayout()) {
+        const leftWidth = Math.min(Math.max(layout.leftWidth, 220), 420);
+        const rightWidth = Math.min(Math.max(layout.rightWidth, 300), 520);
+        workbench.leftDock.style.display = 'flex';
+        workbench.leftDock.style.width = `${leftWidth}px`;
+        workbench.leftDock.style.bottom = '0';
+        workbench.leftDock.style.zIndex = '';
+        workbench.leftDock.style.boxShadow = '';
+        workbench.rightDock.style.display = 'flex';
+        workbench.rightDock.style.width = `${rightWidth}px`;
+        workbench.rightDock.style.zIndex = '';
+        workbench.rightDock.style.boxShadow = '';
+        workbench.sceneFrame.style.left = `${leftWidth}px`;
+        workbench.sceneFrame.style.right = `${rightWidth}px`;
+        workbench.sceneFrame.style.bottom = '0';
+        workbench.bottomDock.style.display = 'none';
+        workbench.bottomResizer.style.display = 'none';
+        workbench.bottomToggle.style.display = 'none';
+        workbench.leftToggle.style.display = 'none';
+        workbench.rightToggle.style.display = 'none';
+        workbench.leftResizer.style.bottom = '0';
+        workbench.rightResizer.style.bottom = '0';
+    }
+    function renderPrefabStageStructurePanel(stage) {
+        LocalEditorShared.clearElement(hierarchyPanel);
+        hierarchyPanel.dataset.editorPanelId = 'prefab-explorer';
+        hierarchyPanel.appendChild(createPrefabStagePanelHeader('Prefab Explorer', 'hierarchy'));
+        const search = doc.createElement('input');
+        search.type = 'search';
+        search.dataset.editorPrefabStageExplorerSearch = 'true';
+        search.placeholder = 'Filter';
+        search.value = prefabStageExplorerFilter;
+        search.style.cssText = [
+            'width:calc(100% - 16px)',
+            'height:28px',
+            'margin:6px 8px 8px',
+            'padding:0 8px',
+            'border:1px solid var(--fps-editor-border-strong)',
+            'border-radius:0',
+            'background:var(--fps-editor-input-bg)',
+            'color:var(--fps-editor-text)',
+            'font-size:12px',
+            'font-weight:700',
+            'outline:none',
+        ].join(';');
+        hierarchyPanel.appendChild(search);
+        if (stage.importStructureReady === false) {
+            const loading = doc.createElement('div');
+            loading.textContent = 'Loading import structure...';
+            loading.style.cssText = 'padding:0 8px 8px;color:var(--fps-editor-muted);font-size:11px;font-weight:800';
+            hierarchyPanel.appendChild(loading);
+        }
+        const list = doc.createElement('div');
+        list.style.cssText = 'display:flex;flex-direction:column;gap:1px';
+        const visibleItems = filterLocalEditorPrefabStageStructureItems(stage.structureItems, prefabStageExplorerFilter);
+        const renderItem = (item, depth) => {
+            const button = doc.createElement('button');
+            button.type = 'button';
+            button.dataset.editorPrefabStageItem = item.id;
+            const selected = stage.selectedItemId === item.id;
+            const icon = isLocalEditorIconName(item.icon)
+                ? item.icon
+                : item.kind === 'root'
+                    ? 'prefab'
+                    : item.kind === 'source'
+                        ? 'asset'
+                        : item.kind === 'material'
+                            ? 'material-slot'
+                            : item.kind === 'texture'
+                                ? 'asset'
+                                : item.kind === 'animation'
+                                    ? 'execute'
+                                    : item.kind === 'group'
+                                        ? 'group'
+                                        : 'object';
+            button.style.cssText = [
+                'width:100%',
+                'min-height:26px',
+                'display:flex',
+                'align-items:center',
+                'gap:6px',
+                `padding:3px 8px 3px ${8 + depth * 16}px`,
+                `border:1px solid ${selected ? 'var(--fps-editor-accent)' : 'transparent'}`,
+                'border-radius:0',
+                `background:${selected ? 'var(--fps-editor-row-selected)' : 'transparent'}`,
+                `color:${selected ? 'var(--fps-editor-row-selected-text)' : 'var(--fps-editor-text)'}`,
+                'font-size:12px',
+                'font-weight:800',
+                'text-align:left',
+                'cursor:pointer',
+                'overflow:hidden',
+            ].join(';');
+            button.appendChild(createLocalEditorIcon(doc, icon, { size: 14 }));
+            const label = doc.createElement('span');
+            label.textContent = item.label;
+            label.style.cssText = 'min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1';
+            button.appendChild(label);
+            if (item.readonly === true) {
+                const readonlyBadge = doc.createElement('span');
+                readonlyBadge.textContent = 'READONLY';
+                readonlyBadge.style.cssText = [
+                    'flex:0 0 auto',
+                    'padding:1px 4px',
+                    'border-radius:2px',
+                    'background:var(--fps-editor-chip-bg)',
+                    'color:var(--fps-editor-muted-strong)',
+                    'font-size:9px',
+                    'font-weight:900',
+                ].join(';');
+                button.appendChild(readonlyBadge);
+            }
+            list.appendChild(button);
+            for (const child of item.children ?? [])
+                renderItem(child, depth + 1);
+        };
+        for (const item of visibleItems)
+            renderItem(item, 0);
+        if (visibleItems.length === 0) {
+            const empty = doc.createElement('div');
+            empty.textContent = prefabStageExplorerFilter.trim() ? 'No matching items.' : 'No structure available.';
+            empty.style.cssText = 'padding:8px;color:var(--fps-editor-muted);font-size:12px;font-weight:800';
+            list.appendChild(empty);
+        }
+        hierarchyPanel.appendChild(list);
+    }
+    function renderPrefabStagePropertiesPanel(stage) {
+        inspectorPanel.dataset.editorPanelId = 'prefab-properties';
+        inspectorPanel.style.display = '';
+        renderingPanel.style.display = 'none';
+        if (stage.inspectorObject) {
+            LocalEditorPanels.renderInspectorPanel(doc, inspectorPanel, {
+                ...currentState,
+                selectedIds: stage.inspectorObject.targetIds,
+                activeId: stage.inspectorObject.activeId,
+                selectionSummary: {
+                    count: stage.inspectorObject.targetIds.length,
+                    activeId: stage.inspectorObject.activeId,
+                },
+                serializedObject: null,
+                serializedMultiObject: null,
+                inspectorObject: stage.inspectorObject,
+                inspectorMultiObject: null,
+            }, inspectorFilter, {
+                ...options.inspector,
+                title: 'Prefab Properties',
+                emptyText: 'Select an item in Prefab Explorer.',
+                summaryTitle: 'Prefab',
+                lockedVectorGroups: lockedInspectorVectorGroups,
+            });
+            return;
+        }
+        LocalEditorShared.clearElement(inspectorPanel);
+        inspectorPanel.appendChild(createPrefabStagePanelHeader('Prefab Properties', 'inspector'));
+        const selectedItem = findLocalEditorPrefabStageStructureItem(stage, stage.selectedItemId);
+        const grid = doc.createElement('div');
+        grid.style.cssText = 'display:flex;flex-direction:column;gap:7px;min-width:0';
+        appendPrefabStageReadonlyRow(grid, '名称', stage.label);
+        appendPrefabStageReadonlyRow(grid, 'Prefab ID', stage.assetId);
+        appendPrefabStageReadonlyRow(grid, 'Source', stage.sourceAssetId ?? '未设置');
+        appendPrefabStageReadonlyRow(grid, 'Preview', stage.previewNodeId ?? '未生成');
+        appendPrefabStageReadonlyRow(grid, 'Selected', selectedItem?.label ?? stage.selectedItemId ?? 'Prefab Root');
+        appendPrefabStageReadonlyRow(grid, 'Mode', stage.readonly ? '只读' : '可编辑');
+        appendPrefabStageSelectedItemDetails(grid, selectedItem);
+        inspectorPanel.appendChild(grid);
+    }
+    function appendPrefabStageSelectedItemDetails(container, item) {
+        if (!item)
+            return;
+        appendPrefabStageReadonlyRow(container, 'Kind', item.kind);
+        if (item.sourceAssetId)
+            appendPrefabStageReadonlyRow(container, 'Source Asset', item.sourceAssetId);
+        if (item.slotId)
+            appendPrefabStageReadonlyRow(container, 'Slot ID', item.slotId);
+        if (item.ownerNodePath)
+            appendPrefabStageReadonlyRow(container, 'Owner Path', item.ownerNodePath);
+        if (item.meshIndex != null)
+            appendPrefabStageReadonlyRow(container, 'Mesh Index', String(item.meshIndex));
+        if (item.primitiveIndex != null)
+            appendPrefabStageReadonlyRow(container, 'Primitive', String(item.primitiveIndex));
+        if (item.sourceMaterialIndex != null) {
+            appendPrefabStageReadonlyRow(container, 'Material Index', String(item.sourceMaterialIndex));
+        }
+        if (item.sourceMaterialIndices?.length) {
+            appendPrefabStageReadonlyRow(container, 'Material Indices', item.sourceMaterialIndices.join(', '));
+        }
+        if (item.sourceMaterialName)
+            appendPrefabStageReadonlyRow(container, 'Material Name', item.sourceMaterialName);
+        if (item.sourceMaterialNames?.length) {
+            appendPrefabStageReadonlyRow(container, 'Material Names', item.sourceMaterialNames.join(', '));
+        }
+        if (item.meta)
+            appendPrefabStageReadonlyRow(container, 'Meta', item.meta);
+    }
+    function resolvePrefabStageAssetFromState(stage) {
+        return currentState?.assets.find(asset => (asset.id === stage.browserAssetId
+            || asset.id === `prefab:${stage.assetId}`
+            || asset.assetId === stage.assetId
+            || asset.prefab?.id === stage.assetId)) ?? null;
+    }
+    function createPrefabStagePanelHeader(title, icon) {
+        const header = doc.createElement('div');
+        header.style.cssText = [
+            'display:flex',
+            'align-items:center',
+            'gap:8px',
+            'min-height:30px',
+            'margin:-8px -8px 8px',
+            'padding:0 8px',
+            'border-bottom:1px solid var(--fps-editor-divider)',
+            'background:var(--fps-editor-chrome-dark)',
+        ].join(';');
+        header.appendChild(createLocalEditorIcon(doc, icon, { size: 14 }));
+        const label = doc.createElement('h2');
+        label.textContent = title;
+        label.style.cssText = [
+            'min-width:0',
+            'margin:0',
+            'overflow:hidden',
+            'text-overflow:ellipsis',
+            'white-space:nowrap',
+            'font-size:13px',
+            'font-weight:800',
+            'color:var(--fps-editor-text-strong)',
+        ].join(';');
+        header.appendChild(label);
+        return header;
+    }
+    function appendPrefabStageReadonlyRow(container, label, value) {
+        const row = doc.createElement('div');
+        row.style.cssText = [
+            'display:grid',
+            'grid-template-columns:92px minmax(0,1fr)',
+            'gap:8px',
+            'align-items:center',
+            'min-height:26px',
+        ].join(';');
+        const rowLabel = doc.createElement('div');
+        rowLabel.textContent = label;
+        rowLabel.style.cssText = [
+            'min-width:0',
+            'overflow:hidden',
+            'text-overflow:ellipsis',
+            'white-space:nowrap',
+            'color:var(--fps-editor-muted)',
+            'font-size:11px',
+            'font-weight:800',
+        ].join(';');
+        const output = doc.createElement('div');
+        output.textContent = value;
+        output.title = value;
+        output.style.cssText = [
+            'min-width:0',
+            'overflow:hidden',
+            'text-overflow:ellipsis',
+            'white-space:nowrap',
+            'padding:4px 7px',
+            'border:1px solid var(--fps-editor-border)',
+            'border-radius:3px',
+            'background:var(--fps-editor-field)',
+            'color:var(--fps-editor-text-strong)',
+            'font-size:12px',
+            'font-weight:800',
+        ].join(';');
+        row.appendChild(rowLabel);
+        row.appendChild(output);
+        container.appendChild(row);
+    }
     const renderPreviewState = (state) => {
         const inEditor = state.mode === 'editor';
+        const inPrefabStage = !!state.prefabStage;
         const disabled = state.busy;
         const transformTool = state.transformTool ?? null;
         const transformOperations = state.transformOperations ?? {
@@ -4235,8 +5383,22 @@ export function createLocalEditorBrowserUi(options = {}) {
             ? 'var(--fps-editor-border)'
             : statusToneColor;
         renderCoordinateAxesOverlay(coordinateAxesOverlay, inEditor ? state.coordinateAxes ?? null : null);
-        renderSceneFrameRateOverlay(sceneFrameRateOverlay, inEditor ? state.sceneFrameStats ?? null : null);
-        renderPerformanceMonitorOverlay(performanceMonitorOverlay, inEditor ? state.performanceStats ?? null : null, inEditor && performanceMonitorOpen);
+        renderSceneFrameRateOverlay(sceneFrameRateOverlay, inEditor && !inPrefabStage ? state.sceneFrameStats ?? null : null);
+        renderPerformanceMonitorOverlay(performanceMonitorOverlay, inEditor && !inPrefabStage ? state.performanceStats ?? null : null, inEditor && !inPrefabStage && performanceMonitorOpen);
+        const comparisonColumnVisible = shouldShowLocalEditorPrefabComparisonColumn({
+            inPrefabStage: inEditor && inPrefabStage,
+            userOpen: prefabComparisonPreviewOpen,
+            sceneWidth: workbench.sceneFrame.clientWidth,
+        });
+        if (!comparisonColumnVisible)
+            endPrefabComparisonPreviewDrag();
+        prefabStagePreviewLayout.root.style.display = inEditor && inPrefabStage ? 'block' : 'none';
+        prefabStagePreviewLayout.mainRegion.style.right = comparisonColumnVisible
+            ? `${LOCAL_EDITOR_PREFAB_COMPARISON_COLUMN_WIDTH_PX}px`
+            : '0';
+        prefabStagePreviewLayout.comparisonColumn.style.display = comparisonColumnVisible ? 'flex' : 'none';
+        renderPrefabImportStatsOverlay(prefabImportStatsOverlay, inEditor && inPrefabStage ? state.prefabStage ?? null : null);
+        renderPrefabComparisonPreviewOverlay(prefabComparisonPreviewOverlay, inEditor && inPrefabStage && comparisonColumnVisible ? state.prefabStage ?? null : null);
         renderSpatialOverlay(spatialOverlay, inEditor ? state.viewportSpatialOverlay ?? null : null);
         renderMeasurementOverlay(measurementOverlay, inEditor ? state.viewportMeasurement ?? null : null);
         const boxSelection = state.boxSelection;
@@ -4263,38 +5425,44 @@ export function createLocalEditorBrowserUi(options = {}) {
         };
         renderPreviewState(currentState);
         if (shouldRenderInspectorPreview && panelRegistry.getRightDockTab() === 'inspector') {
-            const rightDockScrollSnapshot = captureLocalEditorRightDockScrollSnapshot(currentState, 'inspector', inspectorFilter, inspectorPanel, renderingPanel);
+            const rightDockScrollSnapshot = captureLocalEditorRightDockScrollSnapshot(currentState, 'inspector', inspectorFilter, inspectorPanel, renderingPanel, markersPanel);
             LocalEditorPanels.renderInspectorPanel(doc, inspectorPanel, currentState, inspectorFilter, {
                 ...options.inspector,
                 lockedVectorGroups: lockedInspectorVectorGroups,
             });
-            restoreLocalEditorRightDockScrollSnapshot(rightDockScrollSnapshot, currentState, 'inspector', inspectorFilter, inspectorPanel, renderingPanel);
+            restoreLocalEditorRightDockScrollSnapshot(rightDockScrollSnapshot, currentState, 'inspector', inspectorFilter, inspectorPanel, renderingPanel, markersPanel);
         }
     };
     const render = (state) => {
         const previousState = currentState;
         const previousRightTab = panelRegistry.getRightDockTab();
-        const rightDockScrollSnapshot = captureLocalEditorRightDockScrollSnapshot(previousState, previousRightTab, inspectorFilter, inspectorPanel, renderingPanel);
+        const rightDockScrollSnapshot = captureLocalEditorRightDockScrollSnapshot(previousState, previousRightTab, inspectorFilter, inspectorPanel, renderingPanel, markersPanel);
         currentState = state;
         const focusSnapshot = captureLocalEditorEditableFocus(doc);
         const inEditor = state.mode === 'editor';
         const disabled = state.busy;
+        const prefabStage = inEditor ? state.prefabStage ?? null : null;
+        const inPrefabStage = !!prefabStage;
+        if (!inPrefabStage || previousState?.prefabStage?.assetId !== prefabStage.assetId) {
+            prefabStageExplorerFilter = '';
+        }
         if (!inEditor || disabled)
             contextMenu.close();
         hostChrome.style.display = !inEditor && localTestActionsEnabled ? 'flex' : 'none';
         enterEditorButton.disabled = disabled;
-        for (const button of [saveButton, saveAndRunButton, discardRunButton, undoButton, redoButton, sceneHelpButton, sceneCameraButton, performanceMonitorButton, gridToggleButton]) {
+        for (const button of [saveButton, saveAndRunButton, discardRunButton, undoButton, redoButton, sceneHelpButton, sceneCameraButton, performanceMonitorButton, gridToggleButton, prefabComparisonPreviewButton]) {
             button.style.display = 'inline-flex';
             button.disabled = disabled;
         }
-        localTestGroup.style.display = inEditor && localTestActionsEnabled ? 'flex' : 'none';
+        localTestGroup.style.display = inEditor && !inPrefabStage && localTestActionsEnabled ? 'flex' : 'none';
         localTestButton.disabled = disabled;
         if (!inEditor || !localTestActionsEnabled)
             closeLocalTestMenu();
         if (!inEditor)
             helpOpen = false;
-        if (!inEditor && performanceMonitorOpen)
+        if (shouldLocalEditorClosePerformanceMonitor({ inEditor, inPrefabStage, performanceMonitorOpen })) {
             setPerformanceMonitorOpen(false);
+        }
         if (!inEditor || disabled) {
             assetPreviewOpen = false;
             previewedAsset = null;
@@ -4306,7 +5474,16 @@ export function createLocalEditorBrowserUi(options = {}) {
         syncInputModalOpen();
         const transformTool = state.transformTool ?? null;
         workbench.root.style.display = inEditor ? '' : 'none';
+        workbench.root.dataset.editorPrefabStage = String(inPrefabStage);
+        sceneTitle.textContent = createLocalEditorPrefabStageTitle(prefabStage);
         sceneToolOverlay.style.display = inEditor ? 'flex' : 'none';
+        prefabStageBackButton.style.display = inPrefabStage ? 'inline-flex' : 'none';
+        workbench.leftToggle.style.display = '';
+        workbench.rightToggle.style.display = '';
+        workbench.bottomToggle.style.display = '';
+        workbenchLayoutController.refresh();
+        if (inPrefabStage)
+            applyPrefabStageWorkbenchLayoutOverride();
         if (!inEditor)
             closeSnapSettingsPopover();
         if (!inEditor)
@@ -4318,7 +5495,7 @@ export function createLocalEditorBrowserUi(options = {}) {
         if (!inEditor)
             closeStaticShadowBakePopover();
         const staticShadowBakeAction = findLocalEditorRenderingAction(state.renderingPanel, STATIC_SHADOW_BAKE_ACTION_ID);
-        const staticShadowBakeVisible = inEditor && !!staticShadowBakeAction;
+        const staticShadowBakeVisible = inEditor && !inPrefabStage && !!staticShadowBakeAction;
         staticShadowBakeGroup.style.display = staticShadowBakeVisible ? 'flex' : 'none';
         const staticShadowBakeDisabled = disabled || !staticShadowBakeAction || staticShadowBakeAction.action.disabled === true;
         staticShadowBakeButton.disabled = staticShadowBakeDisabled;
@@ -4330,7 +5507,7 @@ export function createLocalEditorBrowserUi(options = {}) {
         LocalEditorShared.applyButtonActiveState(staticShadowBakeButton, !!staticShadowBakeAction?.system?.progress);
         renderStaticShadowBakePopover(state);
         const sceneCameraPreview = state.sceneCameraPreview ?? { enabled: false, available: false };
-        cameraPreviewGroup.style.display = inEditor ? 'flex' : 'none';
+        cameraPreviewGroup.style.display = inEditor && !inPrefabStage ? 'flex' : 'none';
         sceneCameraButton.disabled = disabled || !sceneCameraPreview.available;
         const sceneCameraTooltip = sceneCameraPreview.available
             ? '从 Main Camera 查看当前场景'
@@ -4357,6 +5534,10 @@ export function createLocalEditorBrowserUi(options = {}) {
         setToolbarButtonIcon(doc, projectionToggleButton, projectionMode === 'orthographic' ? 'projection-ortho' : 'projection-perspective');
         setToolbarButtonTooltip(projectionToggleButton, viewportProjectionTooltip || `投影模式：${VIEWPORT_PROJECTION_LABELS[projectionMode]}。切换为${VIEWPORT_PROJECTION_LABELS[nextProjectionMode]}`);
         LocalEditorShared.applyButtonActiveState(projectionToggleButton, projectionMode === 'orthographic');
+        const markersVisible = viewportTools?.markersVisible ?? true;
+        markerVisibilityButton.disabled = disabled;
+        setToolbarButtonTooltip(markerVisibilityButton, markersVisible ? '隐藏标记与关系线' : '显示标记与关系线');
+        LocalEditorShared.applyButtonActiveState(markerVisibilityButton, markersVisible);
         overlaySettingsButton.disabled = disabled;
         setToolbarButtonTooltip(overlaySettingsButton, '视口信息层设置');
         LocalEditorShared.applyButtonActiveState(overlaySettingsButton, overlaySettingsOpen);
@@ -4378,12 +5559,21 @@ export function createLocalEditorBrowserUi(options = {}) {
         if (!inEditor || disabled || viewportToolsGroup.style.display === 'none')
             closeOverlaySettingsPopover();
         const gridState = state.grid ?? { visible: false, available: false };
-        performanceMonitorButton.disabled = disabled;
+        performanceMonitorButton.style.display = inPrefabStage ? 'none' : 'inline-flex';
+        performanceMonitorButton.disabled = disabled || inPrefabStage;
         setToolbarButtonTooltip(performanceMonitorButton, performanceMonitorOpen ? '隐藏性能监控' : '显示性能监控');
         LocalEditorShared.applyButtonActiveState(performanceMonitorButton, performanceMonitorOpen);
+        prefabComparisonPreviewButton.style.display = inPrefabStage ? 'inline-flex' : 'none';
+        prefabComparisonPreviewButton.disabled = disabled || !inPrefabStage;
+        setToolbarButtonTooltip(prefabComparisonPreviewButton, prefabComparisonPreviewOpen
+            ? '隐藏对比预览 (Shift+P)'
+            : '显示对比预览 (Shift+P)');
+        LocalEditorShared.applyButtonActiveState(prefabComparisonPreviewButton, inPrefabStage && prefabComparisonPreviewOpen);
         gridToggleButton.disabled = disabled || !gridState.available;
         setToolbarButtonTooltip(gridToggleButton, gridState.visible ? '隐藏 Scene View 网格' : '显示 Scene View 网格');
         LocalEditorShared.applyButtonActiveState(gridToggleButton, gridState.visible);
+        toolGroup.style.display = inEditor && !inPrefabStage ? 'flex' : 'none';
+        spaceGroup.style.display = inEditor && !inPrefabStage ? 'flex' : 'none';
         for (const [tool, button] of toolButtons) {
             button.disabled = disabled;
             LocalEditorShared.applyButtonActiveState(button, transformTool?.activeTool === tool);
@@ -4401,7 +5591,7 @@ export function createLocalEditorBrowserUi(options = {}) {
             canDistribute: false,
         };
         const operationSettings = transformOperations.settings;
-        snapGroup.style.display = inEditor ? 'flex' : 'none';
+        snapGroup.style.display = inEditor && !inPrefabStage ? 'flex' : 'none';
         snapButton.disabled = disabled;
         snapEnabledInput.disabled = disabled;
         snapEnabledInput.checked = operationSettings.snap.enabled;
@@ -4414,7 +5604,7 @@ export function createLocalEditorBrowserUi(options = {}) {
         }
         if (!inEditor || disabled || snapGroup.style.display === 'none')
             closeSnapSettingsPopover();
-        placementGroup.style.display = inEditor ? 'flex' : 'none';
+        placementGroup.style.display = inEditor && !inPrefabStage ? 'flex' : 'none';
         placementButton.disabled = disabled;
         setToolbarButtonIcon(doc, placementButton, PLACEMENT_MODE_ICONS[operationSettings.placementMode]);
         setToolbarButtonTooltip(placementButton, `放置模式 · ${PLACEMENT_MODE_DESCRIPTIONS[operationSettings.placementMode]}`);
@@ -4425,7 +5615,7 @@ export function createLocalEditorBrowserUi(options = {}) {
         }
         if (!inEditor || disabled || placementGroup.style.display === 'none')
             closePlacementSettingsPopover();
-        actionGroup.style.display = inEditor ? 'flex' : 'none';
+        actionGroup.style.display = inEditor && !inPrefabStage ? 'flex' : 'none';
         const hasTransformAction = transformOperations.canAlign || transformOperations.canDistribute;
         transformActionButton.disabled = disabled || !hasTransformAction;
         setToolbarButtonTooltip(transformActionButton, hasTransformAction ? '对齐与分布' : '选择至少 2 个对象后可用');
@@ -4449,9 +5639,29 @@ export function createLocalEditorBrowserUi(options = {}) {
         scheduleToolbarOverflowLayout();
         if (!inEditor)
             return;
+        const activeRightTab = panelRegistry.getRightDockTab();
+        if (inPrefabStage && prefabStage) {
+            const rightDockVisibility = resolveLocalEditorRightDockVisibility({
+                inPrefabStage: true,
+                activeRightTab,
+            });
+            leftDockTabs.style.display = 'none';
+            rightDockTabs.style.display = rightDockVisibility.tabsDisplay;
+            inspectorPanel.style.display = rightDockVisibility.inspectorDisplay;
+            renderingPanel.style.display = rightDockVisibility.renderingDisplay;
+            renderPrefabStageStructurePanel(prefabStage);
+            renderPrefabStagePropertiesPanel(prefabStage);
+            restoreLocalEditorEditableFocus(doc, focusSnapshot);
+            return;
+        }
+        leftDockTabs.style.display = '';
         const hierarchyDescriptor = panelRegistry.getActivePanel('left');
         const rightDescriptor = panelRegistry.getActivePanel('right');
-        const activeRightTab = panelRegistry.getRightDockTab();
+        const rightDockVisibility = resolveLocalEditorRightDockVisibility({
+            inPrefabStage: false,
+            activeRightTab,
+        });
+        rightDockTabs.style.display = rightDockVisibility.tabsDisplay;
         const activeBottomTab = panelRegistry.getBottomDockTab();
         const assetBrowserTabChanged = assetBrowserTab !== lastRenderedAssetBrowserTab;
         const bottomDockTabChanged = activeBottomTab !== lastRenderedBottomDockTab;
@@ -4462,8 +5672,10 @@ export function createLocalEditorBrowserUi(options = {}) {
         hierarchyPanel.dataset.editorPanelId = hierarchyDescriptor?.id ?? 'hierarchy';
         inspectorPanel.dataset.editorPanelId = activeRightTab === 'inspector' ? rightDescriptor?.id ?? 'inspector' : 'inspector';
         renderingPanel.dataset.editorPanelId = activeRightTab === 'rendering' ? rightDescriptor?.id ?? 'rendering' : 'rendering';
-        inspectorPanel.style.display = activeRightTab === 'inspector' ? '' : 'none';
-        renderingPanel.style.display = activeRightTab === 'rendering' ? '' : 'none';
+        markersPanel.dataset.editorPanelId = activeRightTab === 'markers' ? rightDescriptor?.id ?? 'markers' : 'markers';
+        inspectorPanel.style.display = rightDockVisibility.inspectorDisplay;
+        renderingPanel.style.display = rightDockVisibility.renderingDisplay;
+        markersPanel.style.display = activeRightTab === 'markers' ? '' : 'none';
         LocalEditorPanels.renderWorkbenchLeftDockTabs(doc, leftDockTabs, 'hierarchy', panelRegistry.getPanels('left'));
         hierarchyController.render(state);
         LocalEditorPanels.renderWorkbenchBottomDockPanel(doc, assetPanel, state, activeBottomTab, panelRegistry.getPanels('bottom'), assetBrowserTab);
@@ -4486,11 +5698,14 @@ export function createLocalEditorBrowserUi(options = {}) {
                 lockedVectorGroups: lockedInspectorVectorGroups,
             });
         }
-        else {
+        else if (activeRightTab === 'rendering') {
             LocalEditorPanels.renderRenderingPanel(doc, renderingPanel, state);
         }
+        else {
+            LocalEditorPanels.renderMarkerPanel(doc, markersPanel, state);
+        }
         restoreLocalEditorEditableFocus(doc, focusSnapshot);
-        restoreLocalEditorRightDockScrollSnapshot(rightDockScrollSnapshot, state, activeRightTab, inspectorFilter, inspectorPanel, renderingPanel);
+        restoreLocalEditorRightDockScrollSnapshot(rightDockScrollSnapshot, state, activeRightTab, inspectorFilter, inspectorPanel, renderingPanel, markersPanel);
     };
     return {
         update(state) {
@@ -4500,12 +5715,15 @@ export function createLocalEditorBrowserUi(options = {}) {
         updateSceneFrameStats(stats) {
             if (currentState)
                 currentState = { ...currentState, sceneFrameStats: stats };
-            renderSceneFrameRateOverlay(sceneFrameRateOverlay, currentState?.mode === 'editor' ? stats : null);
+            renderSceneFrameRateOverlay(sceneFrameRateOverlay, currentState?.mode === 'editor' && !currentState.prefabStage ? stats : null);
         },
         updatePerformanceStats(stats) {
             if (currentState)
                 currentState = { ...currentState, performanceStats: stats };
-            renderPerformanceMonitorOverlay(performanceMonitorOverlay, currentState?.mode === 'editor' ? stats : null, currentState?.mode === 'editor' && performanceMonitorOpen);
+            renderPerformanceMonitorOverlay(performanceMonitorOverlay, currentState?.mode === 'editor' && !currentState.prefabStage ? stats : null, currentState?.mode === 'editor' && !currentState.prefabStage && performanceMonitorOpen);
+        },
+        getPrefabComparisonPreviewSurfaces() {
+            return readPrefabComparisonPreviewSurfaces(prefabComparisonPreviewOverlay);
         },
         setTheme(theme) {
             setActiveTheme(theme);
@@ -4535,6 +5753,7 @@ export function createLocalEditorBrowserUi(options = {}) {
             measurementOverlay.root.remove();
             sceneFrameRateOverlay.root.remove();
             performanceMonitorOverlay.root.remove();
+            prefabStagePreviewLayout.root.remove();
             boxSelectionOverlay.remove();
             shortcutHelpPanel.remove();
             assetPreviewModal.remove();