minecodex 0.1.19 → 0.2.1

package/packages/runtime-host/src/codex-runtime.mjs

@@ -37,7 +37,7 @@ export function responsiveSummaryVisibleSurface({ displayMode, isPinned, isPopov
 }
 
 export function responsiveSummaryContentShift({ displayMode, isPinned }, layout = RESPONSIVE_SUMMARY_LAYOUT) {
-  return displayMode === "shift" && isPinned
+  return displayMode !== "overlay" && isPinned
     ? -(layout.panelWidth + layout.panelInset) / 2
     : 0;
 }
@@ -78,6 +78,18 @@ function requireDeclaredLoopbackSurface(feature, value) {
   return url;
 }
 
+export function pageScriptServiceOrigin(feature) {
+  if (!feature.pageScript || !feature.surfaceUrl || !feature.healthUrl) return null;
+  const surfaceUrl = new URL(feature.surfaceUrl);
+  const healthUrl = new URL(feature.healthUrl);
+  if (
+    surfaceUrl.origin !== healthUrl.origin
+    || surfaceUrl.protocol !== "http:"
+    || !LOOPBACK_SURFACE_HOSTS.has(surfaceUrl.hostname)
+  ) return null;
+  return surfaceUrl.origin;
+}
+
 function findFrameByName(frameTree, frameName) {
   if (frameTree.frame?.name === frameName) return frameTree.frame;
   for (const child of frameTree.childFrames ?? []) {
@@ -127,9 +139,6 @@ export function createInjectionSource(features, {
     const pinnedSurfaceMarker = "data-codex-personal-pinned-summary";
     const modalSurfaceMarker = "data-codex-personal-modal";
     const promptPreviewMarker = "data-codex-personal-prompt-preview";
-    const threadShiftStyle = document.createElement("style");
-    threadShiftStyle.setAttribute("data-codex-personal-summary-shift-style", "");
-    threadShiftStyle.textContent = "[data-codex-personal-summary-shift] { transform: none !important; --thread-wide-block-inline-shift: 0px !important; }";
     const nativeLabels = {
       sites: ["sites", "站点"],
       scheduled: ["scheduled", "计划任务"],
@@ -254,7 +263,7 @@ export function createInjectionSource(features, {
     const modelSelectorFeature = features.find(
       (feature) => feature.entry?.kind === "composer-model-selector",
     ) ?? null;
-    const pageScriptFeatures = features.filter((feature) => feature.entry?.kind === "page-script");
+    const pageScriptFeatures = features.filter((feature) => feature.pageScript);
     const pageSurfaces = new Map();
     const pinnedSurfaces = new Map();
     const surfaceRecords = new Map();
@@ -273,9 +282,9 @@ export function createInjectionSource(features, {
     let savedComposerThread = null;
     let currentThread = null;
     let currentSummaryDisplayMode = null;
-    let shiftedThreadContent = null;
-    let shiftedThreadOriginal = null;
+    let shiftedConversationOwners = [];
     let mainContentObserver = null;
+    let toolbarReadiness = null;
     const domObservers = [];
     const pageScriptCleanups = [];
     const pendingHostActions = new Map();
@@ -300,6 +309,11 @@ export function createInjectionSource(features, {
     let modelSelectorNativeFastIcons = null;
     // Fast 图标来源标记：bundle 静态提取 vs DOM 克隆，DOM 克隆优先以保持像素一致。
     let modelSelectorNativeFastIconSources = null;
+    // DOM 克隆可见性门控：仅在 Fast 控件从无到有时扫描一次，常驻会话不逐帧扫描。
+    let modelSelectorFastControlVisible = false;
+    // 持久化脏标记：仅在图标实际变化时写一次 localStorage。
+    let modelSelectorNativeFastIconsDirty = false;
+    const modelSelectorFastIconStorageKey = "codex-model-slider:fast-icons:v1";
     const modelSelectorStyle = document.createElement("style");
     modelSelectorStyle.setAttribute("data-codex-model-slider-style", "");
     modelSelectorStyle.textContent = `
@@ -380,7 +394,7 @@ export function createInjectionSource(features, {
       document.documentElement.append(modelSelectorStyle);
       // 启动阶段就解析 Fast 图标：先读持久化的原生克隆，再从 app bundle 静态提取兜底，
       // 避免首次会话必须等用户点开弹窗后 DOM 里才出现图标。
-      const persistedIcons = loadPersistedNativeFastIcons();
+      const persistedIcons = loadPersistedNativeFastIcons(modelSelectorFastIconStorageKey);
       if (persistedIcons) {
         modelSelectorNativeFastIcons = persistedIcons;
         modelSelectorNativeFastIconSources = {};
@@ -400,9 +414,16 @@ export function createInjectionSource(features, {
           "window",
           "document",
           "MutationObserver",
+          "config",
           `"use strict";\n${source}`,
         );
-        const cleanup = installer(lifetime.signal, window, document, MutationObserver);
+        const cleanup = installer(
+          lifetime.signal,
+          window,
+          document,
+          MutationObserver,
+          feature.pageScript.config ?? {},
+        );
         if (typeof cleanup === "function") pageScriptCleanups.push(cleanup);
       } catch (error) {
         console.warn(`[codex-personal] page-script feature failed: ${feature.id}`, error);
@@ -467,6 +488,57 @@ export function createInjectionSource(features, {
       }) ?? null;
     }
 
+    function structuralToolbarAnchor() {
+      const buttons = Array.from(document.querySelectorAll("button"));
+      return buttons.find((button) => /temporary chat/i.test(button.getAttribute("aria-label") ?? ""))
+        ?? buttons.find((button) => new Set(["Toggle summary", "Toggle pinned summary"])
+          .has(button.getAttribute("aria-label")))
+        ?? buttons.find((button) => button.getAttribute("aria-label") === "Toggle bottom panel")
+        ?? buttons.find((button) => button.getAttribute("aria-label") === "Toggle side panel")
+        ?? null;
+    }
+
+    function stopToolbarReadiness() {
+      if (!toolbarReadiness) return;
+      toolbarReadiness.observer.disconnect();
+      if (toolbarReadiness.retryTimer != null) clearTimeout(toolbarReadiness.retryTimer);
+      if (toolbarReadiness.deadlineTimer != null) clearTimeout(toolbarReadiness.deadlineTimer);
+      toolbarReadiness = null;
+    }
+
+    function ensureToolbarReadiness(candidate) {
+      const thread = threadIdentity();
+      if (toolbarReadiness?.candidate === candidate && toolbarReadiness.thread === thread) return;
+      stopToolbarReadiness();
+      const record = {
+        candidate,
+        thread,
+        attempts: 0,
+        retryTimer: null,
+        deadlineTimer: null,
+        observer: null,
+      };
+      const wake = () => {
+        if (toolbarReadiness !== record) return;
+        queueEnsure();
+      };
+      record.observer = new ResizeObserver(wake);
+      record.observer.observe(candidate);
+      const header = candidate.closest("header");
+      if (header) record.observer.observe(header);
+      const retry = () => {
+        if (toolbarReadiness !== record || record.attempts >= 8) return;
+        record.attempts += 1;
+        wake();
+        record.retryTimer = setTimeout(retry, 75);
+      };
+      record.retryTimer = setTimeout(retry, 75);
+      record.deadlineTimer = setTimeout(() => {
+        if (toolbarReadiness === record) stopToolbarReadiness();
+      }, 1_500);
+      toolbarReadiness = record;
+    }
+
     function toolbarControlRoot(button) {
       return button?.parentElement?.parentElement ?? button?.parentElement ?? button ?? null;
     }
@@ -521,8 +593,10 @@ export function createInjectionSource(features, {
     }
 
     function mainContentViewport() {
-      return document.querySelector("[data-app-shell-main-content-layout]")
+      const composer = currentComposer();
+      return composer?.closest("main[data-app-shell-main-surface]")
         ?? document.querySelector("main[data-app-shell-main-surface]")
+        ?? document.querySelector("[data-app-shell-main-content-layout]")
         ?? document.querySelector("main");
     }
 
@@ -662,37 +736,43 @@ export function createInjectionSource(features, {
       return null;
     }
 
-    const modelSelectorFastIconStorageKey = "codex-model-slider:fast-icons:v1";
-
     function persistNativeFastIcons() {
-      if (!modelSelectorNativeFastIcons) return;
+      if (!modelSelectorNativeFastIcons || !modelSelectorNativeFastIconsDirty) return;
       try {
         const payload = {};
         for (const [state, template] of Object.entries(modelSelectorNativeFastIcons)) {
           payload[state] = template.outerHTML;
         }
         localStorage.setItem(modelSelectorFastIconStorageKey, JSON.stringify(payload));
+        modelSelectorNativeFastIconsDirty = false;
       } catch {
         // localStorage 不可用时静默降级，仅本次会话内生效。
       }
     }
 
-    function loadPersistedNativeFastIcons() {
+    function loadPersistedNativeFastIcons(storageKey) {
+      let stored;
       try {
-        const payload = JSON.parse(localStorage.getItem(modelSelectorFastIconStorageKey) ?? "null");
-        if (!payload || typeof payload !== "object") return null;
-        const icons = {};
-        for (const [state, markup] of Object.entries(payload)) {
-          if (typeof markup !== "string") continue;
-          const container = document.createElement("template");
-          container.innerHTML = markup;
-          const svg = container.content.querySelector("svg");
-          if (svg) icons[state] = svg;
-        }
-        return Object.keys(icons).length ? icons : null;
+        stored = localStorage.getItem(storageKey);
       } catch {
         return null;
       }
+      let payload;
+      try {
+        payload = JSON.parse(stored ?? "null");
+      } catch {
+        return null;
+      }
+      if (!payload || typeof payload !== "object") return null;
+      const icons = {};
+      for (const [state, markup] of Object.entries(payload)) {
+        if (typeof markup !== "string") continue;
+        const container = document.createElement("template");
+        container.innerHTML = markup;
+        const svg = container.content.querySelector("svg");
+        if (svg) icons[state] = svg;
+      }
+      return Object.keys(icons).length ? icons : null;
     }
 
     function extractFastIconPath(source, prefix) {
@@ -701,6 +781,8 @@ export function createInjectionSource(features, {
     }
 
     async function loadNativeFastIconFromBundle() {
+      // 两个图标均已就绪（持久化或 DOM 克隆）时不再拉取整包 app-initial 资源。
+      if (modelSelectorNativeFastIcons?.active && modelSelectorNativeFastIcons?.inactive) return;
       const sourceLink = document.querySelector('link[href*="/assets/app-initial-"][href$=".js"]');
       if (!sourceLink?.href) return;
       try {
@@ -728,6 +810,7 @@ export function createInjectionSource(features, {
         define("active", "M11\\.9125 21\\.4125", { viewBox: "0 0 24 24" });
         define("inactive", "M7\\.38 16\\.2207", { viewBox: "0 0 20 20", transform: "translate(2.43 1.609)" });
         if (gained) {
+          modelSelectorNativeFastIconsDirty = true;
           persistNativeFastIcons();
           applyNativeFastIconsToShells();
           queueEnsure();
@@ -747,32 +830,36 @@ export function createInjectionSource(features, {
 
     function captureNativeFastIcon() {
       // Fast 图标只在 Fast 控件渲染后才出现在 DOM（打开菜单或 GPT 模型）；
-      // 启动阶段已有 bundle/持久化兜底，因此无可见 Fast 控件时不做全页扫描。
-      if (!hasVisibleFastControl()) {
-        return modelSelectorNativeFastIcons;
-      }
-      const capture = (state, pathPrefix) => {
-        const current = modelSelectorNativeFastIcons?.[state];
-        const currentSource = modelSelectorNativeFastIconSources?.[state];
-        if (current && currentSource === "dom") return;
-        const path = Array.from(document.querySelectorAll("svg path")).find(
-          (candidate) => candidate.getAttribute("d")?.startsWith(pathPrefix),
-        );
-        const svg = path?.closest("svg");
-        if (!svg) return;
-        const template = svg.cloneNode(true);
-        template.removeAttribute("id");
-        template.removeAttribute("width");
-        template.removeAttribute("height");
-        if (!modelSelectorNativeFastIcons) {
-          modelSelectorNativeFastIcons = {};
-          modelSelectorNativeFastIconSources = {};
-        }
-        modelSelectorNativeFastIcons[state] = template;
-        modelSelectorNativeFastIconSources[state] = "dom";
-      };
-      capture("active", "M11.9125 21.4125");
-      capture("inactive", "M7.38 16.2207");
+      // 只在控件可见性从无到有时做一次全页扫描（升级为 DOM 克隆），
+      // 常驻会话不逐帧扫描整个文档；缺图标时由 bundle/持久化兜底。
+      const visible = hasVisibleFastControl();
+      const justBecameVisible = visible && !modelSelectorFastControlVisible;
+      modelSelectorFastControlVisible = visible;
+      if (visible && justBecameVisible) {
+        const capture = (state, pathPrefix) => {
+          const current = modelSelectorNativeFastIcons?.[state];
+          const currentSource = modelSelectorNativeFastIconSources?.[state];
+          if (current && currentSource === "dom") return;
+          const path = Array.from(document.querySelectorAll("svg path")).find(
+            (candidate) => candidate.getAttribute("d")?.startsWith(pathPrefix),
+          );
+          const svg = path?.closest("svg");
+          if (!svg) return;
+          const template = svg.cloneNode(true);
+          template.removeAttribute("id");
+          template.removeAttribute("width");
+          template.removeAttribute("height");
+          if (!modelSelectorNativeFastIcons) {
+            modelSelectorNativeFastIcons = {};
+            modelSelectorNativeFastIconSources = {};
+          }
+          modelSelectorNativeFastIcons[state] = template;
+          modelSelectorNativeFastIconSources[state] = "dom";
+          modelSelectorNativeFastIconsDirty = true;
+        };
+        capture("active", "M11.9125 21.4125");
+        capture("inactive", "M7.38 16.2207");
+      }
       const ready = Boolean(
         modelSelectorNativeFastIcons?.active && modelSelectorNativeFastIcons?.inactive,
       );
@@ -785,14 +872,18 @@ export function createInjectionSource(features, {
 
     function applyNativeFastIconsToShells() {
       document.querySelectorAll("[data-codex-model-slider-fast]").forEach((button) => {
-        const icon = createNativeFastIcon(button.getAttribute("aria-pressed") === "true");
         const content = button.querySelector("[data-codex-model-slider-fast-content]");
-        if (icon && content) content.replaceChildren(icon);
+        // 幂等补装：只给还没有图标的按钮补上，避免每次 ensure 都重建节点。
+        if (!content || content.querySelector("svg")) return;
+        const icon = createNativeFastIcon(button.getAttribute("aria-pressed") === "true");
+        if (icon) content.replaceChildren(icon);
       });
     }
 
     function createNativeFastIcon(active) {
-      const template = captureNativeFastIcon()?.[active ? "active" : "inactive"];
+      // 直接读取已就绪的图标存储（启动时由 bundle/持久化填充，运行期由
+      // captureNativeFastIcon 升级为 DOM 克隆），避免再次触发捕获造成递归。
+      const template = modelSelectorNativeFastIcons?.[active ? "active" : "inactive"];
       if (!template) return null;
       const icon = template.cloneNode(true);
       icon.setAttribute("aria-hidden", "true");
@@ -895,14 +986,16 @@ export function createInjectionSource(features, {
         (option) => String(option.thinkingEffort ?? "") === String(selected.thinkingEffort ?? ""),
       );
       const selectedEffort = selectedOption ? effortFor(selectedOption) : (efforts[0] ?? "instant");
+      const defaultEffort = String(version.defaultReasoningEffort ?? efforts[0] ?? "instant").toLowerCase();
       const models = [{
         model: String(selected.slug ?? ""),
         displayName: String(version?.label ?? selected.slug ?? ""),
-        defaultReasoningEffort: selectedEffort,
+        defaultReasoningEffort: defaultEffort,
         supportedReasoningEfforts: efforts.map((effort) => ({ reasoningEffort: effort })),
       }];
       return {
         models,
+        reasoningEffort: selectedEffort,
         onSelectReasoningEffort(effort) {
           const target = options.find((option) => effortFor(option) === String(effort).toLowerCase());
           if (!target) return;
@@ -914,8 +1007,9 @@ export function createInjectionSource(features, {
       };
     }
 
-    function nativeCatalogModelFor(identity) {
-      const models = nativeComposerModelController()?.models ?? [];
+    function nativeCatalogModelFor(identity, selector = modelSelectorFeature?.modelSelector) {
+      const controller = nativeComposerModelController();
+      const models = controller?.models ?? [];
       const exact = models.find((model) => String(model.model ?? "").toLowerCase() === identity.raw.toLowerCase());
       const target = comparableModelLabel(identity.backend);
       const aliases = exact ? [] : models.filter((model) => (
@@ -923,13 +1017,25 @@ export function createInjectionSource(features, {
       ));
       const model = exact ?? (aliases.length === 1 ? aliases[0] : null);
       if (!model) return null;
+      const nativeReasoningLevels = (model.supportedReasoningEfforts ?? []).map((level) => ({
+        effort: String(level?.reasoningEffort ?? level?.effort ?? level ?? "").toLowerCase(),
+      })).filter((level) => level.effort);
+      const allowed = selector?.reasoningEffortOverrides?.[identity.raw.toLowerCase()];
+      const supportedReasoningLevels = allowed
+        ? nativeReasoningLevels.filter((level) => allowed.includes(level.effort))
+        : nativeReasoningLevels;
+      const currentReasoningLevel = String(controller?.reasoningEffort ?? "").toLowerCase();
       return {
         slug: String(model.model ?? ""),
         displayName: String(model.displayName ?? model.model ?? ""),
-        defaultReasoningLevel: String(model.defaultReasoningEffort ?? ""),
-        supportedReasoningLevels: (model.supportedReasoningEfforts ?? []).map((level) => ({
-          effort: String(level?.reasoningEffort ?? level?.effort ?? level ?? ""),
-        })).filter((level) => level.effort),
+        currentReasoningLevel: nativeReasoningLevels.some(
+          (level) => level.effort === currentReasoningLevel,
+        ) ? currentReasoningLevel : null,
+        currentReasoningLevelVisible: supportedReasoningLevels.some(
+          (level) => level.effort === currentReasoningLevel,
+        ),
+        defaultReasoningLevel: String(model.defaultReasoningEffort ?? "").toLowerCase(),
+        supportedReasoningLevels,
       };
     }
 
@@ -1362,18 +1468,19 @@ export function createInjectionSource(features, {
     }
 
     function enhanceModelItem(item, menu, selector, index) {
-      if (item.querySelector("[data-codex-model-slider-row]")) return;
       const observedRaw = modelItemRawValue(item);
       if (!observedRaw) return;
-      if (!modelSelectorOriginalItems.has(item)) modelSelectorOriginalItems.set(item, item.innerHTML);
       const observedIdentity = modelIdentity(observedRaw);
       const nativeDescriptor = nativeModelDescriptorForItem(item, observedRaw);
       const catalogModel = catalogModelFor(observedIdentity, selector);
       const raw = catalogModel?.slug ?? nativeDescriptor?.slug ?? observedRaw;
+      // 先刷新 dataset：React 原地复用菜单节点时，raw/排序/收藏键不能基于过期值。
       item.dataset.codexModelSliderRaw = raw;
       item.dataset.codexModelSliderItem = "";
       item.dataset.codexModelSliderOrder = String(index);
       item.dataset.codexModelSliderIdentitySource = catalogModel ? "catalog" : nativeDescriptor ? "native" : "visible";
+      if (item.querySelector("[data-codex-model-slider-row]")) return;
+      if (!modelSelectorOriginalItems.has(item)) modelSelectorOriginalItems.set(item, item.innerHTML);
 
       const identity = modelIdentity(raw);
       const display = modelDisplayLabel(identity, selector);
@@ -1574,6 +1681,9 @@ export function createInjectionSource(features, {
     }
 
     function selectNativeEffort(parentMenu, effort) {
+      const identity = modelIdentity(nativeModelValue(parentMenu));
+      const model = modelDefinitionFor(identity, modelSelectorFeature?.modelSelector);
+      if (!model?.supportedReasoningLevels?.some((level) => level.effort === String(effort).toLowerCase())) return;
       const controller = nativeComposerModelController();
       if (typeof controller?.onSelectReasoningEffort === "function") {
         controller.onSelectReasoningEffort(effort);
@@ -1649,6 +1759,24 @@ export function createInjectionSource(features, {
       rail.setAttribute("aria-valuenow", String(index));
     }
 
+    function neutralizeStaleSliderVisual(rail) {
+      for (const selector of [
+        "[data-codex-model-slider-native-range]",
+        "[data-codex-model-slider-native-thumb]",
+        "[data-codex-model-slider-range]",
+        "[data-codex-model-slider-thumb]",
+      ]) {
+        rail.querySelectorAll(selector).forEach((element) => {
+          element.style.setProperty("visibility", "hidden");
+        });
+      }
+      rail.querySelectorAll("[data-codex-model-slider-tick]").forEach((tick) => {
+        tick.removeAttribute("data-selected");
+      });
+      rail.removeAttribute("aria-valuenow");
+      rail.style.removeProperty("--codex-model-slider-progress");
+    }
+
     function nativeParticleSeed(index, salt) {
       const value = Math.sin((index + 1) * 12.9898 + salt * 78.233) * 43758.5453;
       return value - Math.floor(value);
@@ -1775,7 +1903,8 @@ export function createInjectionSource(features, {
 
     function createGenericModelSlider(parentMenu, selector, identity, model, selectedEffort) {
       const efforts = model.supportedReasoningLevels.map((level) => level.effort);
-      const selectedIndex = Math.max(0, efforts.indexOf(selectedEffort));
+      const selectedIndex = efforts.indexOf(selectedEffort);
+      const selectedEffortVisible = selectedIndex >= 0;
       const classes = Object.fromEntries([
         "Menu",
         "ViewToggle",
@@ -1873,7 +2002,20 @@ export function createInjectionSource(features, {
       rail.setAttribute("aria-label", locale === "zh-CN" ? "推理强度" : "Reasoning effort");
       rail.setAttribute("aria-valuemin", "0");
       rail.setAttribute("aria-valuemax", String(efforts.length - 1));
-      rail.setAttribute("aria-valuetext", effortLabel(efforts[selectedIndex]));
+      rail.setAttribute("aria-valuetext", selectedEffortVisible
+        ? effortLabel(selectedEffort)
+        : (locale === "zh-CN" ? "当前档位不可用" : "Current effort unavailable"));
+      rail.toggleAttribute("data-stale-reasoning-effort", !selectedEffortVisible);
+      if (!selectedEffortVisible) {
+        rail.setAttribute("aria-disabled", "true");
+        rail.removeAttribute("tabindex");
+        neutralizeStaleSliderVisual(rail);
+        const staleView = document.createElement("div");
+        staleView.className = classes.SimpleView;
+        staleView.append(nativeSlider ?? rail);
+        shell.append(viewControls, staleView);
+        return shell;
+      }
       if (!nativeSlider) {
         const track = document.createElement("div");
         track.setAttribute("data-codex-model-slider-track", "");
@@ -1969,7 +2111,7 @@ export function createInjectionSource(features, {
       // 控制器推导的任务内实际 effort 优先，避免子任务/主任务切换后触发器属性滞后；
       // 触发器属性仅在控制器无法解析时作为实时回退，静态目录默认值最后兜底。
       const nativeModel = nativeCatalogModelFor(identity);
-      const selectedEffort = nativeModel?.defaultReasoningLevel
+      const selectedEffort = nativeModel?.currentReasoningLevel
         ?? document.querySelector("[data-codex-intelligence-trigger]")
           ?.getAttribute("data-selected-reasoning-effort")
         ?? model.defaultReasoningLevel
@@ -2077,7 +2219,6 @@ export function createInjectionSource(features, {
     function ensureModelSelector() {
       const selector = modelSelectorFeature?.modelSelector;
       if (!selector) return;
-      captureNativeFastIcon();
       pruneModelSubmenuPositionObservers();
       if (!modelSelectorStyle.isConnected) document.head?.append(modelSelectorStyle);
       enhanceComposerModelTrigger(selector);
@@ -2089,11 +2230,17 @@ export function createInjectionSource(features, {
             returnToNativeModelSlider();
           }, 80);
         }
-        return;
+      } else {
+        enhanceNativeModelPicker(parentMenu, selector);
+        const submenu = nativeModelSubmenu(parentMenu);
+        if (submenu) enhanceNativeModelSubmenu(submenu, selector);
+      }
+      try {
+        // 图标工作与菜单增强解耦：放在最后并隔离异常，任何失败都不影响标签与菜单。
+        captureNativeFastIcon();
+      } catch (error) {
+        console.warn("[codex-personal] fast icon capture failed", error);
       }
-      enhanceNativeModelPicker(parentMenu, selector);
-      const submenu = nativeModelSubmenu(parentMenu);
-      if (submenu) enhanceNativeModelSubmenu(submenu, selector);
     }
 
     function restoreModelSelectorEnhancements() {
@@ -2335,9 +2482,11 @@ export function createInjectionSource(features, {
       }
       if (next === currentThread) return;
       currentThread = next;
+      stopToolbarReadiness();
       savedComposerRange = null;
       savedComposerThread = null;
       hidePinnedSurfaces();
+      queueEnsure();
     }
 
     function currentComposer() {
@@ -2399,16 +2548,23 @@ export function createInjectionSource(features, {
       ]);
       for (const element of selected) {
         if (element.hasAttribute(entryMarker) || alreadySuppressed.has(element)) continue;
-        suppressedSelections.push({
+        const selection = {
           element,
           ariaCurrent: element.getAttribute("aria-current"),
           threadSelected: element.getAttribute("data-app-action-sidebar-thread-selected"),
+          hadPrimaryGhost: element.classList.contains("bg-primary-ghost-hover"),
+          hadHoverPrimaryGhost: element.classList.contains("hover:bg-primary-ghost-hover"),
           hadActiveClass: element.classList.contains("bg-token-list-hover-background"),
           hadHoverClass: element.classList.contains("hover:bg-token-list-hover-background"),
-        });
+        };
+        suppressedSelections.push(selection);
         element.removeAttribute("aria-current");
         element.removeAttribute("data-app-action-sidebar-thread-selected");
+        // 原生选中态（灰底）现在由 bg-primary-ghost-hover 承载，需一并移除；
+        // 旧 token 类仍保留处理，以便兼容旧主题。
+        element.classList.remove("bg-primary-ghost-hover");
         element.classList.remove("bg-token-list-hover-background");
+        if (!selection.hadHoverPrimaryGhost) element.classList.add("hover:bg-primary-ghost-hover");
         element.classList.add("hover:bg-token-list-hover-background");
       }
     }
@@ -2421,6 +2577,8 @@ export function createInjectionSource(features, {
         if (selection.threadSelected !== null) {
           element.setAttribute("data-app-action-sidebar-thread-selected", selection.threadSelected);
         }
+        element.classList.toggle("bg-primary-ghost-hover", Boolean(selection.hadPrimaryGhost));
+        element.classList.toggle("hover:bg-primary-ghost-hover", Boolean(selection.hadHoverPrimaryGhost));
         element.classList.toggle("bg-token-list-hover-background", selection.hadActiveClass);
         element.classList.toggle("hover:bg-token-list-hover-background", selection.hadHoverClass);
       }
@@ -2432,6 +2590,7 @@ export function createInjectionSource(features, {
         const entry = findEntry(feature.id);
         if (!entry) continue;
         const selected = feature.id === activePageFeatureId;
+        entry.classList.toggle("bg-primary-ghost-hover", selected);
         entry.classList.toggle("bg-token-list-hover-background", selected);
         entry.classList.toggle("hover:bg-token-list-hover-background", !selected);
         if (selected) entry.setAttribute("aria-current", "page");
@@ -2528,24 +2687,23 @@ export function createInjectionSource(features, {
       }
     }
 
-    function threadScrollContent() {
-      const scrollContainer = mainContentViewport()?.querySelector(".thread-scroll-container");
-      return scrollContainer?.firstElementChild instanceof HTMLElement
-        ? scrollContainer.firstElementChild
-        : null;
-    }
-
     function restoreThreadContentShift() {
-      if (!shiftedThreadContent || !shiftedThreadOriginal) return;
-      const { element, position, left, transition } = shiftedThreadOriginal;
-      if (element.isConnected) {
-        element.style.setProperty("position", position.value, position.priority);
-        element.style.setProperty("left", left.value, left.priority);
-        element.style.setProperty("transition", transition.value, transition.priority);
+      for (const { element, shift, translate } of shiftedConversationOwners) {
+        if (!element.isConnected) continue;
+        if (shift.value) {
+          element.style.setProperty(
+            "--thread-wide-block-inline-shift",
+            shift.value,
+            shift.priority,
+          );
+        } else {
+          element.style.removeProperty("--thread-wide-block-inline-shift");
+        }
+        if (translate.value) element.style.setProperty("translate", translate.value, translate.priority);
+        else element.style.removeProperty("translate");
         element.removeAttribute("data-codex-personal-summary-shift");
       }
-      shiftedThreadContent = null;
-      shiftedThreadOriginal = null;
+      shiftedConversationOwners = [];
     }
 
     function applyThreadContentShift(value) {
@@ -2553,45 +2711,40 @@ export function createInjectionSource(features, {
         restoreThreadContentShift();
         return;
       }
-      if (!threadShiftStyle.isConnected) {
-        (document.head ?? document.documentElement)?.append(threadShiftStyle);
-      }
-      const content = threadScrollContent();
-      if (!content) {
+      const viewport = mainContentViewport();
+      const owners = viewport
+        ? Array.from(viewport.querySelectorAll('[style*="--thread-wide-block-inline-shift"]'))
+        : [];
+      if (!owners.length) {
         restoreThreadContentShift();
         return;
       }
-      if (shiftedThreadContent !== content) {
+      if (
+        shiftedConversationOwners.length !== owners.length
+        || owners.some((owner, index) => shiftedConversationOwners[index]?.element !== owner)
+      ) {
         restoreThreadContentShift();
-        shiftedThreadContent = content;
-        shiftedThreadOriginal = {
-          element: content,
-          position: {
-            value: content.style.getPropertyValue("position"),
-            priority: content.style.getPropertyPriority("position"),
-          },
-          left: {
-            value: content.style.getPropertyValue("left"),
-            priority: content.style.getPropertyPriority("left"),
+        shiftedConversationOwners = owners.map((owner) => ({
+          element: owner,
+          shift: {
+            value: owner.style.getPropertyValue("--thread-wide-block-inline-shift"),
+            priority: owner.style.getPropertyPriority("--thread-wide-block-inline-shift"),
           },
-          transition: {
-            value: content.style.getPropertyValue("transition"),
-            priority: content.style.getPropertyPriority("transition"),
+          translate: {
+            value: owner.style.getPropertyValue("translate"),
+            priority: owner.style.getPropertyPriority("translate"),
           },
-        };
+        }));
+      }
+      for (const owner of owners) {
+        owner.style.setProperty(
+          "--thread-wide-block-inline-shift",
+          `${Number(value)}px`,
+          "important",
+        );
+        owner.style.setProperty("translate", `${Number(value)}px 0`, "important");
+        owner.setAttribute("data-codex-personal-summary-shift", String(value));
       }
-      const duration = reducedMotion() ? 0 : 300;
-      content.style.setProperty("transition", duration
-        ? "left 300ms cubic-bezier(.2,.8,.2,1)"
-        : "none", "important");
-      content.style.setProperty("position", "relative", "important");
-      content.style.setProperty("left", `${value}px`, "important");
-      content.setAttribute("data-codex-personal-summary-shift", String(value));
-      if (duration) window.setTimeout(() => {
-        if (content.getAttribute("data-codex-personal-summary-shift") !== String(value)) return;
-        content.style.setProperty("transition", "none", "important");
-        content.style.setProperty("left", `${value}px`, "important");
-      }, duration + 50);
     }
 
     function setSummarySurfaceVisible(surface, visible, mode) {
@@ -2696,7 +2849,7 @@ export function createInjectionSource(features, {
       surface.setAttribute("data-codex-personal-summary-presentation", displayMode);
       setSummarySurfaceVisible(surface, true, displayMode);
 
-      const shift = displayMode === "shift"
+      const shift = displayMode !== "overlay"
         ? -(layout.panelWidth + layout.panelInset) / 2
         : 0;
       applyThreadContentShift(shift);
@@ -3341,8 +3494,12 @@ export function createInjectionSource(features, {
       const detail = feature?.detailTabs?.find((candidate) => candidate.id === detailId);
       if (!feature || !detail) throw new Error("The requested detail Tab is not registered");
       const result = await openNativeDetailTab(feature, detail);
-      if (!result) throw nativeTabCapabilityError
-        ?? new Error("Codex native right-panel tabs are unavailable");
+      if (!result) {
+        const error = nativeTabCapabilityError
+          ?? new Error("Codex native right-panel tabs are unavailable");
+        error.code = "NATIVE_TAB_UNAVAILABLE";
+        throw error;
+      }
       return result;
     }
 
@@ -3457,13 +3614,20 @@ export function createInjectionSource(features, {
     }
 
     function ensureToolbarEntries() {
-      if (!toolbarFeatures.length) return;
+      if (!toolbarFeatures.length) {
+        stopToolbarReadiness();
+        return;
+      }
       const temporaryChatButton = nativeTemporaryChatButton();
       const summaryButton = nativeSummaryButton();
       const bottomPanelButton = nativeBottomPanelButton();
       const sidePanelButton = nativeSidePanelButton();
       const anchorButton = temporaryChatButton ?? summaryButton ?? bottomPanelButton ?? sidePanelButton;
-      if (!anchorButton) return;
+      if (!anchorButton) {
+        const candidate = structuralToolbarAnchor();
+        if (candidate) ensureToolbarReadiness(candidate);
+        return;
+      }
       const anchorRoot = toolbarControlRoot(anchorButton);
       // The bottom/side-panel toggles sit in narrow fixed containers that
       // travel with the native panels. Entries anchored to them must live in
@@ -3474,7 +3638,10 @@ export function createInjectionSource(features, {
       const useFallbackAnchor = anchorButton === sidePanelButton || anchorButton === bottomPanelButton;
       const summaryGroup = useFallbackAnchor ? null : nativeSummaryToolbarGroup(anchorButton);
       let targetGroup = summaryGroup ?? ensureFallbackSummaryToolbarGroup(anchorButton);
-      if (!targetGroup) return;
+      if (!targetGroup) {
+        ensureToolbarReadiness(anchorButton);
+        return;
+      }
       let cursor = useFallbackAnchor ? null : anchorRoot;
       for (const feature of toolbarFeatures) {
         const entries = Array.from(document.querySelectorAll(`[${entryMarker}="${feature.id}"]`));
@@ -3510,6 +3677,11 @@ export function createInjectionSource(features, {
           if (!used) group.remove();
         });
       }
+      if (toolbarFeatures.every((feature) => findEntry(feature.id)?.isConnected)) {
+        stopToolbarReadiness();
+      } else {
+        ensureToolbarReadiness(anchorButton);
+      }
     }
 
     function ensureEntries() {
@@ -3568,6 +3740,13 @@ export function createInjectionSource(features, {
       }, record.origin);
     }
 
+    function hostActionFailure(error) {
+      return {
+        code: typeof error?.code === "string" ? error.code : "HOST_ACTION_FAILED",
+        message: error?.message ?? "Host action failed",
+      };
+    }
+
     async function handleSurfaceHostAction(record, message) {
       const feature = featureById.get(record.featureId);
       const { requestId, action, payload = {} } = message;
@@ -3631,7 +3810,7 @@ export function createInjectionSource(features, {
       } catch (error) {
         respondToSurface(record, requestId, {
           ok: false,
-          error: { code: "HOST_ACTION_FAILED", message: error.message },
+          error: hostActionFailure(error),
         });
       }
     }
@@ -3799,9 +3978,9 @@ export function createInjectionSource(features, {
         if (ensureFrame != null) cancelAnimationFrame(ensureFrame);
         if (ensureTimer != null) clearTimeout(ensureTimer);
         for (const observer of domObservers) observer.disconnect();
+        stopToolbarReadiness();
         mainContentObserver?.observer.disconnect();
         restoreThreadContentShift();
-        threadShiftStyle.remove();
         for (const root of document.querySelectorAll("[data-codex-personal-toolbar-entry]")) root.remove();
         for (const group of document.querySelectorAll("[data-codex-personal-summary-toolbar-group]")) group.remove();
         for (const surface of pageSurfaces.values()) surface.remove();
@@ -3832,7 +4011,15 @@ export function createInjectionSource(features, {
     detailTabs: feature.detailTabs ?? [],
     hostActions: feature.hostActions ?? [],
     modelSelector: feature.modelSelector ?? null,
-    pageScript: feature.pageScript ?? null,
+    pageScript: feature.pageScript ? {
+      ...feature.pageScript,
+      config: {
+        serviceOrigin: pageScriptServiceOrigin(feature),
+        bindingName,
+        bindingToken,
+        featureId: feature.id,
+      },
+    } : null,
   }));
   return `(${install.toString()})(${JSON.stringify({
     version: RUNTIME_VERSION,
@@ -3854,7 +4041,9 @@ export function createRuntimeReadyContract({
   runtimeSessionId,
 }) {
   const discovered = Boolean(renderer.discovered);
+  const discoveredTargets = Math.max(0, Number(renderer.discoveredTargets) || 0);
   const injectedTargets = Math.max(0, Number(renderer.injectedTargets) || 0);
+  const targetFailures = Array.isArray(renderer.targetFailures) ? renderer.targetFailures : [];
   const active = Boolean(renderer.active) && discovered && injectedTargets > 0;
   return {
     pid,
@@ -3872,8 +4061,11 @@ export function createRuntimeReadyContract({
     })),
     renderer: {
       discovered,
+      discoveredTargets,
       injectedTargets,
       active,
+      healthy: active && targetFailures.length === 0 && injectedTargets === discoveredTargets,
+      targetFailures,
       runtimeSessionId: renderer.runtimeSessionId ?? runtimeSessionId,
     },
   };
@@ -4074,6 +4266,8 @@ export class CodexRuntime {
     this.onStatusChange = onStatusChange;
     this.onManagedCodexPidChange = onManagedCodexPidChange;
     this.injectedTargets = new Set();
+    this.rendererTargetIds = new Set();
+    this.targetFailures = new Map();
     this.clients = new Map();
     this.scriptIds = new Map();
     this.bindingTokens = new Map();
@@ -4127,10 +4321,21 @@ export class CodexRuntime {
 
   getRendererStatus() {
     const injectedTargets = this.injectedTargets.size;
+    const discoveredTargets = this.rendererTargetIds.size;
+    const targetFailures = Array.from(this.targetFailures, ([targetId, failure]) => ({
+      targetId,
+      attempts: failure.attempts,
+      state: "retrying",
+      lastFailure: failure.lastFailure,
+    })).sort((left, right) => left.targetId.localeCompare(right.targetId));
+    const active = !this.stopping && this.rendererDiscovered && injectedTargets > 0;
     return {
       discovered: this.rendererDiscovered,
+      discoveredTargets,
       injectedTargets,
-      active: !this.stopping && this.rendererDiscovered && injectedTargets > 0,
+      active,
+      healthy: active && targetFailures.length === 0 && injectedTargets === discoveredTargets,
+      targetFailures,
       runtimeSessionId: this.runtimeSessionId,
     };
   }
@@ -4141,8 +4346,11 @@ export class CodexRuntime {
     if (
       previous
       && previous.discovered === status.discovered
+      && previous.discoveredTargets === status.discoveredTargets
       && previous.injectedTargets === status.injectedTargets
       && previous.active === status.active
+      && previous.healthy === status.healthy
+      && JSON.stringify(previous.targetFailures) === JSON.stringify(status.targetFailures)
       && previous.runtimeSessionId === status.runtimeSessionId
     ) return;
     this.lastRendererStatus = status;
@@ -4186,6 +4394,8 @@ export class CodexRuntime {
     this.bindingTokens.clear();
     this.hostActionChains.clear();
     this.injectedTargets.clear();
+    this.rendererTargetIds.clear();
+    this.targetFailures.clear();
     this.rendererDiscovered = false;
     this.browserClient?.socket.close();
     this.browserClient = null;
@@ -4549,6 +4759,10 @@ export class CodexRuntime {
       });
       return;
     }
+    if (request.action === "import-generated-image") {
+      await this.importGeneratedImage(feature, request.payload);
+      return;
+    }
     try {
       if (request.action !== "attach-file") throw new Error("Unsupported native Host action");
       const result = await this.attachFileToComposer(client, request.payload?.path, request.requestId);
@@ -4561,6 +4775,22 @@ export class CodexRuntime {
     }
   }
 
+  async importGeneratedImage(feature, payload) {
+    const origin = pageScriptServiceOrigin(feature);
+    if (!origin) throw new Error("Generated image import service is unavailable");
+    const response = await this.fetchImpl(new URL("/api/import-generated-image", origin), {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        Origin: CODEX_APP_ORIGIN,
+      },
+      body: JSON.stringify(payload),
+    });
+    if (!response?.ok) {
+      throw new Error(`Generated image import returned HTTP ${response?.status ?? "error"}`);
+    }
+  }
+
   async refreshTargets() {
     let response;
     try {
@@ -4587,8 +4817,14 @@ export class CodexRuntime {
         .filter((target) => target.type === "page" && target.url === "app://-/index.html")
         .map((target) => target.id),
     );
+    this.rendererTargetIds = liveRendererIds;
     let removedTarget = false;
-    for (const id of this.injectedTargets) {
+    const trackedTargetIds = new Set([
+      ...this.injectedTargets,
+      ...this.clients.keys(),
+      ...this.targetFailures.keys(),
+    ]);
+    for (const id of trackedTargetIds) {
       if (liveRendererIds.has(id)) continue;
       removedTarget = true;
       this.clients.get(id)?.socket.close();
@@ -4597,6 +4833,7 @@ export class CodexRuntime {
       this.bindingTokens.delete(id);
       this.hostActionChains.delete(id);
       this.injectedTargets.delete(id);
+      this.targetFailures.delete(id);
     }
     const rendererDiscovered = liveRendererIds.size > 0;
     const rendererChanged = rendererDiscovered !== this.rendererDiscovered;
@@ -4607,8 +4844,12 @@ export class CodexRuntime {
       if (target.type !== "page" || target.url !== "app://-/index.html" || this.injectedTargets.has(target.id)) {
         continue;
       }
-      const client = await this.connectClient(target.webSocketDebuggerUrl);
+      const previousFailure = this.targetFailures.get(target.id);
+      if (previousFailure && Date.now() < previousFailure.nextRetryAt) continue;
+      let client;
+      let scriptIdentifier = null;
       try {
+        client = await this.connectClient(target.webSocketDebuggerUrl);
         await Promise.all([
           client.send("Page.enable"),
           client.send("Runtime.enable"),
@@ -4630,6 +4871,7 @@ export class CodexRuntime {
         const script = await client.send("Page.addScriptToEvaluateOnNewDocument", {
           source: createDocumentBootstrapSource(source),
         });
+        scriptIdentifier = script.identifier;
         await waitForExpression(
           client,
           `document.readyState === "interactive" || document.readyState === "complete"`,
@@ -4642,15 +4884,33 @@ export class CodexRuntime {
             + ` && window.__codexPersonalRuntime?.sessionId === ${JSON.stringify(this.runtimeSessionId)}`,
         );
         this.clients.set(target.id, client);
-        this.scriptIds.set(target.id, script.identifier);
+        this.scriptIds.set(target.id, scriptIdentifier);
         this.injectedTargets.add(target.id);
+        this.targetFailures.delete(target.id);
         this.notifyStatusChange();
       } catch (error) {
         this.bindingTokens.delete(target.id);
-        client.socket.close();
-        throw error;
+        if (client) {
+          if (scriptIdentifier) {
+            await client.send("Page.removeScriptToEvaluateOnNewDocument", {
+              identifier: scriptIdentifier,
+            }).catch(() => {});
+          }
+          await client.send("Runtime.removeBinding", { name: HOST_BINDING_NAME }).catch(() => {});
+          client.socket.close();
+        }
+        const attempts = (previousFailure?.attempts ?? 0) + 1;
+        const retryDelay = Math.min(5_000, 250 * (2 ** Math.min(attempts - 1, 5)));
+        this.targetFailures.set(target.id, {
+          attempts,
+          lastFailure: error.message,
+          nextRetryAt: Date.now() + retryDelay,
+        });
+        this.logger.warn?.(`Renderer injection failed for ${target.id}; retrying`, error.message);
+        this.notifyStatusChange();
       }
     }
+    this.notifyStatusChange();
   }
 
   async stop() {
@@ -4680,6 +4940,8 @@ export class CodexRuntime {
       this.bindingTokens.clear();
       this.hostActionChains.clear();
       this.injectedTargets.clear();
+      this.rendererTargetIds.clear();
+      this.targetFailures.clear();
       this.rendererDiscovered = false;
       this.notifyStatusChange();
       this.monitorPromise = null;