@codexhost/cli-linux-x64 0.2.6 → 0.3.0-test.2

package/app/renderer-extension.js

@@ -36,6 +36,7 @@
     #ownershipRequestGenerations = /* @__PURE__ */ new WeakMap();
     #states = /* @__PURE__ */ new WeakMap();
     #switching = /* @__PURE__ */ new Set();
+    #pendingSubmissions = /* @__PURE__ */ new Set();
     #composerSequence = 0;
     #modelRequestSequence = 0;
     #ownershipRequestSequence = 0;
@@ -95,6 +96,7 @@
     rebindConversation(composer, target) {
       if (!isConversationTarget(target)) return null;
       const previous = this.#state(composer);
+      this.#pendingSubmissions.delete(previous);
       this.#modelRequestGenerations.set(previous, ++this.#modelRequestSequence);
       this.#ownershipRequestGenerations.set(previous, ++this.#ownershipRequestSequence);
       let state = this.#conversationState(target);
@@ -114,6 +116,7 @@
     restore(composer, agent, model, thinkingOptionId, permissionModeId) {
       if (!this.#enabledAgents.has(agent)) return null;
       const state = this.#state(composer);
+      this.#pendingSubmissions.delete(state);
       state.agent = agent;
       state.phase = "locked";
       if (agent === "pi" && model) state.piModel = model;
@@ -204,9 +207,21 @@
     }
     lock(composer) {
       const state = this.#state(composer);
+      this.#pendingSubmissions.delete(state);
       state.phase = "locked";
       return state;
     }
+    markSubmissionPending(composer) {
+      const state = this.#state(composer);
+      if (state.phase === "draft") this.#pendingSubmissions.add(state);
+      return state;
+    }
+    isSubmissionPending(composer) {
+      return this.#pendingSubmissions.has(this.#state(composer));
+    }
+    clearPendingSubmission(composer) {
+      this.#pendingSubmissions.delete(this.#state(composer));
+    }
     recordSubmission(composer) {
       const state = this.#state(composer);
       this.#lastSubmittedAgent = state.agent;
@@ -224,6 +239,9 @@
       if (isConversationTarget(target) && !bound) {
         this.#conversationStates.push({ target, state });
       }
+      if (isConversationTarget(target) && this.#pendingSubmissions.delete(state)) {
+        state.phase = "locked";
+      }
       return true;
     }
     async switchAgent(composer, nextAgent, operations) {
@@ -231,6 +249,7 @@
       if (!this.#enabledAgents.has(nextAgent)) return false;
       if (state.phase !== "draft" || this.#switching.has(state)) return false;
       if (state.agent === nextAgent) return true;
+      this.#pendingSubmissions.delete(state);
       this.#switching.add(state);
       try {
         if (!operations.applyAgent(nextAgent)) return false;
@@ -15783,21 +15802,88 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     return view;
   }
 
+  // src/renderer-model-picker-positioning.ts
+  var MENU_GAP = 4;
+  var MAIN_MENU_SIDE_OFFSET = 8;
+  var COLLISION_PADDING = 8;
+  var RENDERER_MODEL_PICKER_MAIN_MENU_WIDTH = 260;
+  var RENDERER_MODEL_PICKER_MODEL_MENU_WIDTH = 280;
+  var RENDERER_MODEL_PICKER_MODEL_MENU_MAX_HEIGHT = 360;
+  function clampPosition(value, minimum, maximum) {
+    return Math.min(Math.max(value, minimum), Math.max(minimum, maximum));
+  }
+  function fitWidth(preferredWidth, viewportWidth) {
+    return Math.max(
+      COLLISION_PADDING,
+      Math.min(preferredWidth, viewportWidth - COLLISION_PADDING * 2)
+    );
+  }
+  function fitHeight(viewport, top = COLLISION_PADDING) {
+    return Math.max(
+      COLLISION_PADDING,
+      Math.min(
+        RENDERER_MODEL_PICKER_MODEL_MENU_MAX_HEIGHT,
+        viewport.height * 0.6,
+        viewport.height - top - COLLISION_PADDING
+      )
+    );
+  }
+  function rendererModelPickerMainMenuPlacement(triggerRect, viewport, width = RENDERER_MODEL_PICKER_MAIN_MENU_WIDTH) {
+    const maxLeft = viewport.width - COLLISION_PADDING - width;
+    return {
+      left: clampPosition(triggerRect.right - width, COLLISION_PADDING, maxLeft),
+      width,
+      bottom: Math.max(COLLISION_PADDING, viewport.height - triggerRect.top + MAIN_MENU_SIDE_OFFSET)
+    };
+  }
+  function rendererModelPickerStandaloneModelMenuPlacement(triggerRect, viewport) {
+    const width = fitWidth(RENDERER_MODEL_PICKER_MODEL_MENU_WIDTH, viewport.width);
+    const maxLeft = viewport.width - COLLISION_PADDING - width;
+    return {
+      left: clampPosition(triggerRect.right - width, COLLISION_PADDING, maxLeft),
+      width,
+      maxHeight: fitHeight(viewport),
+      bottom: Math.max(COLLISION_PADDING, viewport.height - triggerRect.top + MAIN_MENU_SIDE_OFFSET)
+    };
+  }
+  function rendererModelPickerModelMenuPlacement(mainRect, viewport) {
+    const preferredWidth = fitWidth(RENDERER_MODEL_PICKER_MODEL_MENU_WIDTH, viewport.width);
+    const rightLeft = mainRect.right + MENU_GAP;
+    const leftLeft = mainRect.left - MENU_GAP - preferredWidth;
+    const rightAvailable = viewport.width - rightLeft - COLLISION_PADDING;
+    const leftAvailable = mainRect.left - MENU_GAP - COLLISION_PADDING;
+    let width;
+    let left;
+    if (rightAvailable >= preferredWidth) {
+      width = preferredWidth;
+      left = rightLeft;
+    } else if (leftAvailable >= preferredWidth) {
+      width = preferredWidth;
+      left = leftLeft;
+    } else if (rightAvailable >= leftAvailable) {
+      width = Math.max(COLLISION_PADDING, rightAvailable);
+      left = rightLeft;
+    } else {
+      width = Math.max(COLLISION_PADDING, leftAvailable);
+      left = mainRect.left - MENU_GAP - width;
+    }
+    const top = clampPosition(mainRect.top, COLLISION_PADDING, viewport.height - COLLISION_PADDING);
+    const maxHeight = fitHeight(viewport, top);
+    return {
+      left: clampPosition(left, COLLISION_PADDING, viewport.width - COLLISION_PADDING - width),
+      top,
+      width,
+      maxHeight
+    };
+  }
+
   // src/renderer-model-picker.ts
   var RENDERER_MODEL_TRIGGER_FALLBACK_CLASSES = "border-token-border no-drag cursor-interaction items-center gap-1 border whitespace-nowrap select-none focus:outline-none disabled:cursor-not-allowed disabled:opacity-40 flex rounded-full text-token-text-tertiary enabled:hover:bg-token-list-hover-background enabled:active:bg-token-foreground/15 data-[state=open]:bg-token-list-hover-background border-transparent h-token-button-composer px-2 py-0 text-sm leading-[18px] min-w-0";
   var MENU_CLASSES = "fixed z-50 overflow-hidden rounded-xl bg-token-dropdown-background/90 text-token-foreground shadow-lg backdrop-blur-xl";
   var SEARCH_INPUT_CLASSES = "mb-1 w-full shrink-0 rounded-lg border border-token-border bg-token-dropdown-background/95 px-2 py-1.5 text-sm text-token-foreground outline-none placeholder:text-token-text-tertiary disabled:cursor-not-allowed disabled:opacity-40";
   var OPTION_CLASSES = "flex w-full cursor-interaction items-center gap-2 rounded-lg px-2 py-2 text-left text-sm text-token-foreground outline-none enabled:hover:bg-token-list-hover-background enabled:active:bg-token-foreground/15 disabled:cursor-not-allowed disabled:opacity-40";
   var HEADING_CLASSES = "px-2 pb-1 pt-1.5 text-sm text-token-text-tertiary";
-  var MAIN_MENU_MIN_WIDTH = 160;
-  var MAIN_MENU_MAX_WIDTH = 180;
-  var MODEL_MENU_PREFERRED_WIDTH = 360;
-  var MODEL_MENU_MAX_WIDTH = 420;
-  var MODEL_MENU_MAX_HEIGHT = 360;
   var MODEL_TRIGGER_MAX_WIDTH = "min(200px, 26vw)";
-  var MAIN_MENU_LEFT_OFFSET = 96;
-  var MENU_GAP = 4;
-  var VIEWPORT_MARGIN = 8;
   var MODEL_SCROLLBAR_STYLE_ATTRIBUTE = "data-codexhost-model-picker-scrollbar";
   function popoverOpen2(menu) {
     return menu.matches(":popover-open");
@@ -15877,47 +15963,38 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   }
   function positionMainMenu(control) {
     const triggerRect = control.trigger.getBoundingClientRect();
-    const width = Math.min(MAIN_MENU_MAX_WIDTH, Math.max(MAIN_MENU_MIN_WIDTH, triggerRect.width));
-    const modelMenuWidth = Math.min(
-      MODEL_MENU_MAX_WIDTH,
-      Math.min(MODEL_MENU_PREFERRED_WIDTH, window.innerWidth - VIEWPORT_MARGIN * 2)
+    const placement = rendererModelPickerMainMenuPlacement(
+      triggerRect,
+      { width: window.innerWidth, height: window.innerHeight },
+      RENDERER_MODEL_PICKER_MAIN_MENU_WIDTH
     );
-    const preferredLeft = triggerRect.right - width - MAIN_MENU_LEFT_OFFSET;
-    const rightReservedLeft = window.innerWidth - VIEWPORT_MARGIN - modelMenuWidth - MENU_GAP - width;
-    const maxLeft = window.innerWidth - VIEWPORT_MARGIN - width;
-    const left = Math.max(
-      VIEWPORT_MARGIN,
-      Math.min(preferredLeft, Math.max(rightReservedLeft, VIEWPORT_MARGIN), maxLeft)
-    );
-    control.menu.style.setProperty("width", `${width}px`, "important");
-    control.menu.style.left = `${left}px`;
-    control.menu.style.maxWidth = `${width}px`;
+    control.menu.style.setProperty("width", `${placement.width}px`, "important");
+    control.menu.style.left = `${placement.left}px`;
+    control.menu.style.maxWidth = `${placement.width}px`;
     control.menu.style.right = "auto";
     control.menu.style.top = "auto";
-    control.menu.style.bottom = `${Math.max(
-      VIEWPORT_MARGIN,
-      window.innerHeight - triggerRect.top + 6
-    )}px`;
-  }
-  function positionModelMenu(control) {
-    const mainRect = control.menu.getBoundingClientRect();
-    const availableRight = window.innerWidth - mainRect.right - VIEWPORT_MARGIN;
-    const width = Math.min(MODEL_MENU_MAX_WIDTH, Math.max(VIEWPORT_MARGIN, availableRight));
-    const left = mainRect.right + MENU_GAP;
-    control.modelMenu.style.setProperty("width", `${width}px`, "important");
-    control.modelMenu.style.left = `${left}px`;
-    control.modelMenu.style.maxWidth = `${width}px`;
-    const maxHeight = Math.max(
-      VIEWPORT_MARGIN,
-      Math.min(MODEL_MENU_MAX_HEIGHT, window.innerHeight * 0.6, mainRect.bottom - VIEWPORT_MARGIN)
-    );
-    control.modelMenu.style.maxHeight = `${maxHeight}px`;
+    control.menu.style.bottom = `${placement.bottom}px`;
+  }
+  function positionAdvancedMenus(control) {
+    positionMainMenu(control);
+    positionModelMenu(control);
+  }
+  function positionModelMenu(control, standalone = false) {
+    const anchorRect = standalone ? control.trigger.getBoundingClientRect() : control.menu.getBoundingClientRect();
+    const placement = standalone ? rendererModelPickerStandaloneModelMenuPlacement(anchorRect, {
+      width: window.innerWidth,
+      height: window.innerHeight
+    }) : rendererModelPickerModelMenuPlacement(anchorRect, {
+      width: window.innerWidth,
+      height: window.innerHeight
+    });
+    control.modelMenu.style.setProperty("width", `${placement.width}px`, "important");
+    control.modelMenu.style.left = `${placement.left}px`;
+    control.modelMenu.style.maxWidth = `${placement.width}px`;
+    control.modelMenu.style.maxHeight = `${placement.maxHeight}px`;
     control.modelMenu.style.right = "auto";
-    control.modelMenu.style.top = "auto";
-    control.modelMenu.style.bottom = `${Math.max(
-      VIEWPORT_MARGIN,
-      window.innerHeight - mainRect.bottom
-    )}px`;
+    control.modelMenu.style.top = placement.top === void 0 ? "auto" : `${placement.top}px`;
+    control.modelMenu.style.bottom = placement.bottom === void 0 ? "auto" : `${placement.bottom}px`;
   }
   function syncRendererModelTriggerClass(control, nativeClassName) {
     control.trigger.className = nativeClassName?.trim() || RENDERER_MODEL_TRIGGER_FALLBACK_CLASSES;
@@ -16012,7 +16089,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     modelMenu.style.margin = "0";
     modelMenu.style.padding = "4px";
     modelMenu.style.border = "0";
-    modelMenu.style.maxHeight = "min(360px, 60vh)";
+    modelMenu.style.maxHeight = `min(${RENDERER_MODEL_PICKER_MODEL_MENU_MAX_HEIGHT}px, 60vh)`;
     modelMenu.style.overflowY = "auto";
     modelButton.setAttribute("aria-controls", modelMenu.id);
     const options = /* @__PURE__ */ new Map();
@@ -16073,33 +16150,41 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         applyModelSearchFilter(control);
       }
     };
+    const pickerOpen = () => popoverOpen2(menu) || popoverOpen2(modelMenu);
     const close = () => {
       closeModelMenu();
       if (popoverOpen2(menu)) menu.hidePopover();
     };
-    const openModelMenu = () => {
-      if (!popoverOpen2(menu) || popoverOpen2(modelMenu)) return;
+    const openModelMenu = (standalone = false) => {
+      if (!standalone && !popoverOpen2(menu) || popoverOpen2(modelMenu)) return;
       modelMenu.showPopover();
-      positionModelMenu(control);
+      positionModelMenu(control, standalone);
       modelButton.setAttribute("aria-expanded", "true");
     };
     const open = () => {
-      if (trigger.disabled || popoverOpen2(menu)) return;
+      if (trigger.disabled || pickerOpen()) return;
+      if (control.thinkingOptions.size === 0) {
+        openModelMenu(true);
+        return;
+      }
       menu.showPopover();
-      positionMainMenu(control);
+      positionAdvancedMenus(control);
     };
     const onTriggerClick = () => {
-      if (popoverOpen2(menu)) close();
+      if (pickerOpen()) close();
       else open();
     };
     const onToggle = () => {
       const openState = popoverOpen2(menu);
-      trigger.setAttribute("aria-expanded", String(openState));
+      trigger.setAttribute("aria-expanded", String(openState || popoverOpen2(modelMenu)));
       trigger.setAttribute("data-state", openState ? "open" : "closed");
       if (!openState) closeModelMenu();
     };
     const onModelToggle = () => {
-      modelButton.setAttribute("aria-expanded", String(popoverOpen2(modelMenu)));
+      const openState = popoverOpen2(modelMenu);
+      modelButton.setAttribute("aria-expanded", String(openState));
+      trigger.setAttribute("aria-expanded", String(openState || popoverOpen2(menu)));
+      trigger.setAttribute("data-state", openState || popoverOpen2(menu) ? "open" : "closed");
     };
     const onRootClick = (event) => {
       const target = event.target instanceof Element ? event.target.closest("button") : null;
@@ -16138,21 +16223,21 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       trigger.focus();
     };
     const onViewportChange = () => {
-      if (popoverOpen2(menu)) positionMainMenu(control);
-      if (popoverOpen2(modelMenu)) positionModelMenu(control);
+      if (popoverOpen2(menu)) positionAdvancedMenus(control);
+      else if (popoverOpen2(modelMenu)) positionModelMenu(control, true);
     };
     trigger.addEventListener("click", onTriggerClick);
     menu.addEventListener("toggle", onToggle);
     modelMenu.addEventListener("toggle", onModelToggle);
     modelButton.addEventListener("mouseenter", onModelHover);
-    root.addEventListener("click", onRootClick);
+    menu.addEventListener("click", onRootClick);
     modelMenu.addEventListener("click", onModelMenuClick);
     document.addEventListener("pointerdown", onDocumentPointerDown, true);
     document.addEventListener("keydown", onDocumentKeyDown, true);
     window.addEventListener("resize", onViewportChange);
     window.addEventListener("scroll", onViewportChange, true);
-    root.append(trigger, menu);
-    document.body.append(modelMenu);
+    root.append(trigger);
+    document.body.append(menu, modelMenu);
     searchHeader.append(searchInput);
     modelMenu.append(searchHeader, searchEmpty);
     const control = {
@@ -16175,7 +16260,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         menu.removeEventListener("toggle", onToggle);
         modelMenu.removeEventListener("toggle", onModelToggle);
         modelButton.removeEventListener("mouseenter", onModelHover);
-        root.removeEventListener("click", onRootClick);
+        menu.removeEventListener("click", onRootClick);
         modelMenu.removeEventListener("click", onModelMenuClick);
         searchInput.removeEventListener("input", onSearchInput);
         for (const type of silencedEventTypes) {
@@ -16186,6 +16271,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         document.removeEventListener("keydown", onDocumentKeyDown, true);
         window.removeEventListener("resize", onViewportChange);
         window.removeEventListener("scroll", onViewportChange, true);
+        menu.remove();
         modelMenu.remove();
         root.remove();
       }
@@ -17138,7 +17224,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   var CONTROL_ATTRIBUTE2 = "data-codexhost-harness-command-control";
   var MENU_ATTRIBUTE = "data-codexhost-harness-command-menu";
   var MENU_WIDTH = 320;
-  var VIEWPORT_MARGIN2 = 8;
+  var VIEWPORT_MARGIN = 8;
   var MENU_GAP2 = 8;
   var SVG_NS = "http://www.w3.org/2000/svg";
   var COMMAND_ICON_PATHS = [
@@ -17254,7 +17340,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     menu.style.inset = "auto";
     menu.style.zIndex = "2147483647";
     menu.style.width = `${MENU_WIDTH}px`;
-    menu.style.maxWidth = `calc(100vw - ${VIEWPORT_MARGIN2 * 2}px)`;
+    menu.style.maxWidth = `calc(100vw - ${VIEWPORT_MARGIN * 2}px)`;
     menu.style.maxHeight = "min(360px, calc(100vh - 16px))";
     menu.style.overflowY = "auto";
     menu.style.padding = "4px";
@@ -17275,14 +17361,14 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     const positionMenu2 = () => {
       const rect = trigger.getBoundingClientRect();
       const menuHeight = menu.getBoundingClientRect().height;
-      const opensAbove = rect.top >= menuHeight + MENU_GAP2 + VIEWPORT_MARGIN2;
+      const opensAbove = rect.top >= menuHeight + MENU_GAP2 + VIEWPORT_MARGIN;
       const left = clamp(
         rect.left,
-        VIEWPORT_MARGIN2,
-        window.innerWidth - MENU_WIDTH - VIEWPORT_MARGIN2
+        VIEWPORT_MARGIN,
+        window.innerWidth - MENU_WIDTH - VIEWPORT_MARGIN
       );
       menu.style.left = `${left}px`;
-      menu.style.top = opensAbove ? `${Math.max(VIEWPORT_MARGIN2, rect.top - menuHeight - MENU_GAP2)}px` : `${Math.min(window.innerHeight - menuHeight - VIEWPORT_MARGIN2, rect.bottom + MENU_GAP2)}px`;
+      menu.style.top = opensAbove ? `${Math.max(VIEWPORT_MARGIN, rect.top - menuHeight - MENU_GAP2)}px` : `${Math.min(window.innerHeight - menuHeight - VIEWPORT_MARGIN, rect.bottom + MENU_GAP2)}px`;
     };
     const focusActive = () => {
       const item = items[activeIndex];
@@ -17457,23 +17543,86 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     if (target instanceof Element) return target;
     return target instanceof Node ? target.parentElement : null;
   }
+  function controlDescription(element) {
+    const typed = element;
+    const read = (name) => typeof element.getAttribute === "function" ? element.getAttribute(name) : null;
+    return [typed.type, read("aria-label"), read("title"), read("data-testid")].filter((value) => typeof value === "string").join(" ").toLowerCase();
+  }
   function buttonText(button) {
-    return [
-      button.type,
-      button.getAttribute("aria-label"),
-      button.getAttribute("title"),
-      button.getAttribute("data-testid")
-    ].filter((value) => typeof value === "string").join(" ").toLowerCase();
+    return controlDescription(button);
+  }
+  function isOwnedRendererControl(element) {
+    return element.hasAttribute(CONTROL_ATTRIBUTE) || element.hasAttribute("data-codexhost-model-control") || element.hasAttribute("data-codexhost-permission-mode-control") || element.hasAttribute("data-codexhost-usage-control") || element.hasAttribute("data-codexhost-credits-control") || element.hasAttribute("data-codexhost-harness-command-control");
   }
   function isComposerSubmitButton(button) {
     if (button.type === "submit") return true;
     return /(^|\s)(send|submit|发送|提交)(\s|$)/u.test(buttonText(button));
   }
+  var VOICE_CONTROL_PATTERN = /(dictat|microphone|speech(?:[-_\s]?to[-_\s]?text)?|voice[-_\s]?input|(^|\s)voice(\s|$)|composer[-_](?:speech|dictat|mic)|语音|听写|麦克风|pause|暂停|stop recording|stop dictation|停止录音|停止听写|(^|\s)stop(\s|$))/iu;
+  var CANCEL_CONTROL_PATTERN = /(cancel|discard|close|dismiss|取消|关闭|丢弃)/iu;
+  var ATTACH_CONTROL_PATTERN = /(add files|attach files|attach file|attachment|composer[-_]attach|添加文件|附件)/iu;
+  var TRAILING_ACTION_WALK_DEPTH = 3;
+  function isComposerCancelButton(element) {
+    if (isOwnedRendererControl(element)) return false;
+    return CANCEL_CONTROL_PATTERN.test(controlDescription(element));
+  }
+  function isComposerVoiceButton(element) {
+    if (isOwnedRendererControl(element) || isComposerCancelButton(element)) return false;
+    const description = controlDescription(element);
+    if (/(^|\s)(send|submit|发送|提交)(\s|$)/u.test(description)) return false;
+    return VOICE_CONTROL_PATTERN.test(description);
+  }
+  function isComposerAttachButton(element) {
+    if (isOwnedRendererControl(element)) return false;
+    return ATTACH_CONTROL_PATTERN.test(controlDescription(element));
+  }
+  function isComposerTrailingActionButton(element) {
+    return isComposerVoiceButton(element) || isComposerSubmitButton(element);
+  }
+  function isTrailingActionNode(element) {
+    if (isComposerCancelButton(element)) return false;
+    if (isComposerTrailingActionButton(element)) return true;
+    if (typeof element.querySelectorAll !== "function") return false;
+    const buttons = [...element.querySelectorAll("button")];
+    return buttons.length > 0 && buttons.every((button) => isComposerTrailingActionButton(button));
+  }
+  function attachControlWithin(root) {
+    if (isComposerAttachButton(root)) return root;
+    if (typeof root.querySelectorAll !== "function") return null;
+    const matches = [
+      ...root.querySelectorAll("button, [aria-label], [title], [data-testid]")
+    ].filter(isComposerAttachButton);
+    return matches.length === 1 ? matches[0] ?? null : null;
+  }
   function sendButtonWithin(root) {
     return [...root.querySelectorAll("button")].find(
       (button) => isComposerSubmitButton(button)
     ) ?? null;
   }
+  function leftmostTrailingSibling(container, before) {
+    for (const child of container.children) {
+      if (child === before) break;
+      if (typeof child.hasAttribute !== "function") continue;
+      const element = child;
+      if (isOwnedRendererControl(element) || isComposerCancelButton(element)) continue;
+      if (isTrailingActionNode(element)) return element;
+    }
+    return null;
+  }
+  function trailingActionAnchor(sendButton) {
+    let container = sendButton.parentElement;
+    let before = sendButton;
+    for (let depth = 0; container && depth < TRAILING_ACTION_WALK_DEPTH; depth += 1) {
+      if (typeof container.matches === "function" && container.matches(CODEX_COMPOSER_SELECTOR)) {
+        break;
+      }
+      const candidate = leftmostTrailingSibling(container, before);
+      if (candidate) return candidate;
+      before = container;
+      container = container.parentElement;
+    }
+    return sendButton;
+  }
   function editorForElement(element) {
     return element.matches(EDITOR_SELECTOR) ? element : element.closest(EDITOR_SELECTOR);
   }
@@ -17619,7 +17768,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     for (const child of parent.children) {
       if (typeof child.hasAttribute !== "function") continue;
       const element = child;
-      if (element.hasAttribute("data-codexhost-credits-control") || element.hasAttribute("data-codexhost-harness-command-control")) {
+      if (element.hasAttribute("data-codexhost-credits-control") || element.hasAttribute("data-codexhost-harness-command-control") || isTrailingActionNode(element)) {
         continue;
       }
       return element;
@@ -17632,12 +17781,28 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       const parent = current.parentElement;
       if (!parent) break;
       const first = firstMaterialChild(parent);
-      if (first && first !== current && !first.contains(usageRoot)) return first;
+      if (first && first !== current && !first.contains(usageRoot)) {
+        return attachControlWithin(first) ?? first;
+      }
       if (parent === composer) break;
       current = parent;
     }
     return null;
   }
+  function refreshTrailingClusterPlacement(control) {
+    const sendButton = control.sendButton;
+    const modelRoot = control.modelPicker?.root;
+    const agentRoot = control.root ?? control.picker?.root;
+    if (!sendButton || !modelRoot || !agentRoot) return;
+    const anchor = trailingActionAnchor(sendButton);
+    const parent = anchor.parentElement;
+    if (!parent || typeof parent.insertBefore !== "function") return;
+    if (modelRoot.parentElement === parent && agentRoot.parentElement === parent && modelRoot.nextElementSibling === agentRoot && agentRoot.nextElementSibling === anchor) {
+      return;
+    }
+    parent.insertBefore(modelRoot, anchor);
+    parent.insertBefore(agentRoot, anchor);
+  }
   function refreshUsagePlacement(control) {
     const anchor = usagePlacementAnchor(control);
     if (!anchor) {
@@ -17690,6 +17855,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
   }
   function reconcileComposerNativeControls(control, hideModel, hidePermissionMode) {
     refreshNativeModelControl(control);
+    refreshTrailingClusterPlacement(control);
     refreshUsagePlacement(control);
     refreshNativePermissionModeControl(control);
     setNativeControlHidden(control.nativeModelControl, hideModel);
@@ -17717,7 +17883,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     const toolbar = sendButton.parentElement;
     const harnessCommands = mountRendererHarnessCommandControl(
       toolbar ?? composer,
-      sendButton,
+      trailingActionAnchor(sendButton),
       onSelectCommand
     );
     const permissionParent = nativePermissionModeControl?.element.parentElement;
@@ -17726,12 +17892,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     } else {
       composer.append(permissionModePicker.root);
     }
-    if (toolbar) {
-      toolbar.insertBefore(modelPicker.root, sendButton);
-      toolbar.insertBefore(picker.root, sendButton);
-    } else {
-      composer.append(modelPicker.root, picker.root);
-    }
+    if (!toolbar) composer.append(modelPicker.root, picker.root);
     const control = {
       composer,
       root: picker.root,
@@ -17747,6 +17908,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       sendButton,
       sendDisabledBeforeSwitch: null
     };
+    refreshTrailingClusterPlacement(control);
     refreshUsagePlacement(control);
     return control;
   }
@@ -17870,6 +18032,9 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     isConnected() {
       return this.element.isConnected;
     }
+    hostId() {
+      return sidebarThreadAttributes(this.element)?.hostId ?? null;
+    }
     threadId() {
       return threadIdFromSidebarRowElement(this.element);
     }
@@ -17939,7 +18104,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       const observer = new MutationObserver(onChange);
       observer.observe(this.root, {
         attributes: true,
-        attributeFilter: [SIDEBAR_THREAD_ID_ATTRIBUTE],
+        attributeFilter: [SIDEBAR_THREAD_ID_ATTRIBUTE, SIDEBAR_THREAD_HOST_ID_ATTRIBUTE],
         childList: true,
         subtree: true
       });
@@ -17960,78 +18125,88 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     const ownershipRetryTimers = /* @__PURE__ */ new Map();
     let disposed = false;
     let scanScheduled = false;
+    const ownershipKey = (hostId, threadId) => JSON.stringify([hostId, threadId]);
     const scheduleScan = () => {
       if (disposed || scanScheduled) return;
       scanScheduled = true;
       queueMicrotask(scan);
     };
-    const clearOwnershipRetry = (threadId) => {
-      const timer = ownershipRetryTimers.get(threadId);
+    const clearOwnershipRetry = (key) => {
+      const timer = ownershipRetryTimers.get(key);
       if (timer !== void 0) clearTimeout(timer);
-      ownershipRetryTimers.delete(threadId);
-      ownershipRetryAttempts.delete(threadId);
-      provisionalCodex.delete(threadId);
+      ownershipRetryTimers.delete(key);
+      ownershipRetryAttempts.delete(key);
+      provisionalCodex.delete(key);
     };
-    const scheduleOwnershipRetry = (threadId) => {
-      if (disposed || !provisionalCodex.has(threadId) || pending.has(threadId) || ownershipRetryTimers.has(threadId)) {
+    const scheduleOwnershipRetry = (hostId, threadId) => {
+      const key = ownershipKey(hostId, threadId);
+      if (disposed || !provisionalCodex.has(key) || pending.has(key) || ownershipRetryTimers.has(key)) {
         return;
       }
-      const attempt = ownershipRetryAttempts.get(threadId) ?? 0;
+      const attempt = ownershipRetryAttempts.get(key) ?? 0;
       const delay = OWNERSHIP_RETRY_DELAYS_MS[attempt];
       if (delay === void 0) return;
-      ownershipRetryAttempts.set(threadId, attempt + 1);
+      ownershipRetryAttempts.set(key, attempt + 1);
       const timer = setTimeout(() => {
-        ownershipRetryTimers.delete(threadId);
+        ownershipRetryTimers.delete(key);
         if (disposed) return;
-        failed.delete(threadId);
-        ownershipByThread.delete(threadId);
+        failed.delete(key);
+        ownershipByThread.delete(key);
         scheduleScan();
       }, delay);
-      ownershipRetryTimers.set(threadId, timer);
+      ownershipRetryTimers.set(key, timer);
     };
-    const requestOwnership = (threadIds, client) => {
-      for (const threadId of threadIds) pending.add(threadId);
+    const requestOwnership = (hostId, threadIds, client) => {
+      for (const threadId of threadIds) pending.add(ownershipKey(hostId, threadId));
       let succeeded = false;
       void Promise.resolve().then(() => client.listThreadOwnership({ threadIds })).then(({ threads }) => {
         if (disposed) return;
         for (const ownership of threads) {
-          ownershipByThread.set(ownership.threadId, rendererAgentForThreadOwnership(ownership));
-          failed.delete(ownership.threadId);
+          const key = ownershipKey(hostId, ownership.threadId);
+          ownershipByThread.set(key, rendererAgentForThreadOwnership(ownership));
+          failed.delete(key);
           if (ownership.owner === "codex") {
-            provisionalCodex.add(ownership.threadId);
-            scheduleOwnershipRetry(ownership.threadId);
+            provisionalCodex.add(key);
+            scheduleOwnershipRetry(hostId, ownership.threadId);
           } else {
-            clearOwnershipRetry(ownership.threadId);
+            clearOwnershipRetry(key);
           }
         }
         succeeded = true;
       }).catch(() => {
         if (disposed) return;
-        for (const threadId of threadIds) failed.add(threadId);
+        for (const threadId of threadIds) failed.add(ownershipKey(hostId, threadId));
       }).finally(() => {
-        for (const threadId of threadIds) pending.delete(threadId);
-        for (const threadId of threadIds) scheduleOwnershipRetry(threadId);
+        for (const threadId of threadIds) pending.delete(ownershipKey(hostId, threadId));
+        for (const threadId of threadIds) scheduleOwnershipRetry(hostId, threadId);
         if (succeeded) scheduleScan();
       });
     };
     const scan = () => {
       scanScheduled = false;
       if (disposed) return;
-      const unresolved = /* @__PURE__ */ new Set();
+      const unresolvedByHost = /* @__PURE__ */ new Map();
       for (const row of dom.rows()) {
         if (!row.isConnected()) {
           row.clear();
           continue;
         }
+        const hostId = row.hostId();
+        if (!hostId) {
+          row.clear();
+          continue;
+        }
         const threadId = hostThreadIdSchema.safeParse(row.threadId());
         const localAgent = options.getLocalAgent?.({
+          hostId,
           threadId: threadId.success ? threadId.data : null,
           draftId: row.draftId()
         });
         if (localAgent !== null && localAgent !== void 0) {
           if (threadId.success) {
-            ownershipByThread.set(threadId.data, localAgent === "codex" ? null : localAgent);
-            clearOwnershipRetry(threadId.data);
+            const key2 = ownershipKey(hostId, threadId.data);
+            ownershipByThread.set(key2, localAgent === "codex" ? null : localAgent);
+            clearOwnershipRetry(key2);
           }
           if (localAgent === "codex") row.clear();
           else row.render(localAgent);
@@ -18041,22 +18216,34 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
           row.clear();
           continue;
         }
-        if (ownershipByThread.has(threadId.data)) {
-          const agent = ownershipByThread.get(threadId.data);
+        const key = ownershipKey(hostId, threadId.data);
+        if (ownershipByThread.has(key)) {
+          const agent = ownershipByThread.get(key);
           if (agent) row.render(agent);
           else row.clear();
           continue;
         }
         row.clear();
-        if (!pending.has(threadId.data) && !failed.has(threadId.data)) {
+        if (!pending.has(key) && !failed.has(key)) {
+          let unresolved = unresolvedByHost.get(hostId);
+          if (!unresolved) {
+            unresolved = /* @__PURE__ */ new Set();
+            unresolvedByHost.set(hostId, unresolved);
+          }
           unresolved.add(threadId.data);
         }
       }
-      const client = options.getClient();
-      if (!client) return;
-      const threadIds = [...unresolved];
-      for (let index = 0; index < threadIds.length; index += THREAD_OWNERSHIP_LIST_MAX_LENGTH) {
-        requestOwnership(threadIds.slice(index, index + THREAD_OWNERSHIP_LIST_MAX_LENGTH), client);
+      for (const [hostId, unresolved] of unresolvedByHost) {
+        const client = options.getClient(hostId);
+        if (!client) continue;
+        const threadIds = [...unresolved];
+        for (let index = 0; index < threadIds.length; index += THREAD_OWNERSHIP_LIST_MAX_LENGTH) {
+          requestOwnership(
+            hostId,
+            threadIds.slice(index, index + THREAD_OWNERSHIP_LIST_MAX_LENGTH),
+            client
+          );
+        }
       }
     };
     const stopObserving = dom.observe(scheduleScan);
@@ -18064,12 +18251,12 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     return {
       refresh() {
         failed.clear();
-        for (const threadId of provisionalCodex) {
-          const timer = ownershipRetryTimers.get(threadId);
+        for (const key of provisionalCodex) {
+          const timer = ownershipRetryTimers.get(key);
           if (timer !== void 0) clearTimeout(timer);
-          ownershipRetryTimers.delete(threadId);
-          ownershipRetryAttempts.delete(threadId);
-          ownershipByThread.delete(threadId);
+          ownershipRetryTimers.delete(key);
+          ownershipRetryAttempts.delete(key);
+          ownershipByThread.delete(key);
         }
         scheduleScan();
       },
@@ -18467,28 +18654,38 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     }
     return `${CLAUDE_CODE_TRANSPORT_MODEL_PREFIX}${parsedModel.id}${parsedPermissionMode ? `@${parsedPermissionMode}` : ""}`;
   }
-  function grokTransportModelId(model, thinkingOptionId) {
+  function grokTransportModelId(model, permissionModeId, thinkingOptionId) {
     if (!model) {
-      if (thinkingOptionId) throw new Error("Grok transport Thinking requires a Model Ref");
+      if (permissionModeId || thinkingOptionId) {
+        throw new Error("Grok transport configuration requires a Model Ref");
+      }
       return GROK_TRANSPORT_MODEL_ID;
     }
     const parsedModel = harnessModelRefSchema.parse(model);
+    const parsedPermissionMode = permissionModeId ? harnessPermissionModeIdSchema.parse(permissionModeId) : void 0;
     const parsedThinking = thinkingOptionId ? harnessThinkingOptionIdSchema.parse(thinkingOptionId) : void 0;
-    return `${GROK_TRANSPORT_MODEL_PREFIX}${parsedModel.id}${parsedThinking ? `@@${parsedThinking}` : ""}`;
+    if (parsedThinking) {
+      return `${GROK_TRANSPORT_MODEL_PREFIX}${parsedModel.id}@${parsedPermissionMode ?? ""}@${parsedThinking}`;
+    }
+    return `${GROK_TRANSPORT_MODEL_PREFIX}${parsedModel.id}${parsedPermissionMode ? `@${parsedPermissionMode}` : ""}`;
   }
   function decodeGrokTransportModelId(value) {
     if (value === GROK_TRANSPORT_MODEL_ID) return {};
     if (typeof value !== "string" || !value.startsWith(GROK_TRANSPORT_MODEL_PREFIX)) return null;
     const components = value.slice(GROK_TRANSPORT_MODEL_PREFIX.length).split("@");
-    if (components.length !== 1 && components.length !== 3) return null;
-    const [modelId, emptyPermissionMode, thinkingOptionId] = components;
-    if (components.length === 3 && (emptyPermissionMode !== "" || !thinkingOptionId)) return null;
+    if (components.length < 1 || components.length > 3) return null;
+    const [modelId, permissionModeId, thinkingOptionId] = components;
+    if (components.length === 2 && !permissionModeId) return null;
+    if (components.length === 3 && !thinkingOptionId) return null;
     const model = harnessModelRefSchema.safeParse({ id: modelId });
     if (!model.success) return null;
+    const permissionMode = permissionModeId ? harnessPermissionModeIdSchema.safeParse(permissionModeId) : null;
+    if (permissionMode && !permissionMode.success) return null;
     const thinking = thinkingOptionId ? harnessThinkingOptionIdSchema.safeParse(thinkingOptionId) : null;
     if (thinking && !thinking.success) return null;
     return {
       model: model.data,
+      ...permissionMode?.success ? { permissionModeId: permissionMode.data } : {},
       ...thinking?.success ? { thinkingOptionId: thinking.data } : {}
     };
   }
@@ -18550,22 +18747,8 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     }
     return hostThreadIdSchema.parse(target[1]);
   }
-  function hasPrewarmMethod(value) {
-    return (typeof value === "object" || typeof value === "function") && value !== null && typeof value.prewarmThreadStart === "function";
-  }
-  function isActiveRequestManager(value) {
-    if (!isRecord5(value) || typeof value.sendRequest !== "function") return false;
-    const source = Function.prototype.toString.call(value.sendRequest);
-    return source.includes("send-cli-request-for-host") && hasPrewarmMethod(value.requestClient);
-  }
-  function matchesCurrentPrewarmSignature(target) {
-    const bridge = target.requestClient ?? target;
-    const stableApiShape = bridge.hostId === "local" && typeof bridge.sendRequest === "function" && typeof bridge.prewarmThreadStart === "function" && typeof bridge.enqueueRequest === "function";
-    if (stableApiShape) return true;
-    const prewarm = target.prewarmThreadStart ?? target.requestClient?.prewarmThreadStart;
-    if (!prewarm) return false;
-    const source = Function.prototype.toString.call(prewarm);
-    return source.includes("enqueueRequest") && source.includes("thread-prewarm-start") || source.includes("prewarm-thread-start-for-host");
+  function isCurrentRequestBridge(value) {
+    return isRecord5(value) && typeof value.hostId === "string" && value.hostId.length > 0 && typeof value.sendRequest === "function" && typeof value.prewarmThreadStart === "function" && typeof value.enqueueRequest === "function";
   }
   function findActivePrewarmTargets(root) {
     const editor = root.querySelector(
@@ -18595,10 +18778,9 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         const hookState = hook.memoizedState;
         if (isRecord5(hookState)) {
           const requestClient = hookState.requestClient;
-          if (isActiveRequestManager(hookState) && matchesCurrentPrewarmSignature(hookState)) {
-            targets.add(hookState);
-          } else if (hasPrewarmMethod(requestClient) && matchesCurrentPrewarmSignature(requestClient)) {
-            targets.add(typeof hookState.sendRequest === "function" ? hookState : requestClient);
+          const bridge = isCurrentRequestBridge(requestClient) ? requestClient : isCurrentRequestBridge(hookState) ? hookState : null;
+          if (bridge) {
+            targets.add(typeof hookState.sendRequest === "function" ? hookState : bridge);
           }
         }
         hook = typeof hook.next === "object" && hook.next !== null ? hook.next : null;
@@ -18651,10 +18833,17 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       return false;
     }
   }
-  function findComposerModelTarget(composer) {
-    const conversationThreadId = findComposerConversationThreadId(composer);
-    if (conversationThreadId === null) return null;
-    if (conversationThreadId !== void 0) return ["conversation", conversationThreadId];
+  function findComposerDomIdentity(composer) {
+    const children = Array.from(composer.children ?? []);
+    const portals = children.filter((child) => child.hasAttribute("data-above-composer-portal"));
+    if (portals.length === 0) return { kind: "unsupported" };
+    if (portals.length !== 1) return { kind: "ambiguous" };
+    const value = portals[0]?.getAttribute("data-above-composer-conversation-id");
+    if (value === null) return { kind: "draft" };
+    const candidate = hostThreadIdSchema.safeParse(value);
+    return candidate.success ? { kind: "conversation", threadId: candidate.data } : { kind: "ambiguous" };
+  }
+  function findComposerDraftIds(composer) {
     const draftIds = /* @__PURE__ */ new Set();
     let fiber = findComposerFiber(composer);
     for (let depth = 0; fiber && depth < 120; depth += 1) {
@@ -18669,6 +18858,21 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       const parent = fiber.return;
       fiber = (typeof parent === "object" || typeof parent === "function") && parent !== null ? parent : null;
     }
+    return draftIds;
+  }
+  function findComposerModelTarget(composer) {
+    const draftIds = findComposerDraftIds(composer);
+    const domIdentity = findComposerDomIdentity(composer);
+    if (domIdentity.kind === "ambiguous") return null;
+    if (domIdentity.kind === "conversation") {
+      return ["conversation", domIdentity.threadId];
+    }
+    if (domIdentity.kind === "draft") {
+      return draftIds.size === 1 ? ["default", draftIds.values().next().value] : null;
+    }
+    const conversationThreadId = findComposerConversationThreadId(composer);
+    if (conversationThreadId === null) return null;
+    if (conversationThreadId !== void 0) return ["conversation", conversationThreadId];
     if (draftIds.size !== 1) return null;
     return ["default", draftIds.values().next().value];
   }
@@ -18676,7 +18880,39 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     return isRecord5(value) && value.state === "ready";
   }
   function isDraftPrewarmPolicyReady(value) {
-    return isRecord5(value) && value.state === "ready" && typeof value.select === "function" && typeof value.clear === "function";
+    return isRecord5(value) && value.state === "ready" && typeof value.hostId === "string" && value.hostId.length > 0 && typeof value.select === "function" && typeof value.clear === "function";
+  }
+  function prewarmTargetHostId(target) {
+    const bridge = target.requestClient ?? target;
+    const hostId = target.getHostId?.() ?? bridge.hostId;
+    return typeof hostId === "string" && hostId.length > 0 ? hostId : null;
+  }
+  function rendererRequestTargetsForHost(targets, hostId) {
+    const matching = targets.filter((target) => prewarmTargetHostId(target) === hostId);
+    return matching.length === 1 ? matching : null;
+  }
+  function activeRendererDraftPrewarmTargets(policy, targets) {
+    if (!isDraftPrewarmPolicyReady(policy)) return null;
+    return rendererRequestTargetsForHost(targets, policy.hostId);
+  }
+  function resolveRendererRequestRoute(policy, discoveredTargets, previous) {
+    const activeTargets = activeRendererDraftPrewarmTargets(policy, discoveredTargets);
+    if (isDraftPrewarmPolicyReady(policy) && activeTargets) {
+      return { policy, targets: activeTargets };
+    }
+    return discoveredTargets.length === 0 && isDraftPrewarmPolicyReady(policy) && previous?.policy === policy ? previous : null;
+  }
+  function createRendererRequestRouteResolver(readPolicy, discoverTargets) {
+    let route = null;
+    return {
+      resolve() {
+        route = resolveRendererRequestRoute(readPolicy(), discoverTargets(), route);
+        return route;
+      },
+      clear() {
+        route = null;
+      }
+    };
   }
   async function waitForRendererDraftPrewarmPolicy(target) {
     const deadline = Date.now() + DRAFT_PREWARM_POLICY_WAIT_TIMEOUT_MS;
@@ -18691,7 +18927,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     }
   }
   function modelSelectionForAgent(officialSelection, reasoningEffort, agent, model, thinkingOptionId, permissionModeId) {
-    const transportModelId = agent === "pi" ? piTransportModelId(model, thinkingOptionId) : agent === "claude-code" ? claudeTransportModelId(model, permissionModeId, thinkingOptionId) : agent === "deepseek-harness" ? deepSeekHarnessTransportModelId(model) : agent === "grok" ? grokTransportModelId(model, thinkingOptionId) : transportModelIdForAgent(agent);
+    const transportModelId = agent === "pi" ? piTransportModelId(model, thinkingOptionId) : agent === "claude-code" ? claudeTransportModelId(model, permissionModeId, thinkingOptionId) : agent === "deepseek-harness" ? deepSeekHarnessTransportModelId(model) : agent === "grok" ? grokTransportModelId(model, permissionModeId, thinkingOptionId) : transportModelIdForAgent(agent);
     return transportModelId ? { model: transportModelId, reasoningEffort } : officialSelection;
   }
   function installCurrentRendererAdapter() {
@@ -18717,13 +18953,33 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       }
     });
     const usageSubscription = createThreadUsageSubscriptionRelay();
+    const requestRouteResolver = createRendererRequestRouteResolver(
+      () => window.__codexhostDraftPrewarmPolicyV1,
+      () => findActivePrewarmTargets(document)
+    );
+    const currentRequestRoute = () => requestRouteResolver.resolve();
+    const clientsByTarget = /* @__PURE__ */ new WeakMap();
+    const modelClientForTargets = (targets) => {
+      const target = targets[0];
+      if (targets.length !== 1 || !target) return null;
+      const cached2 = clientsByTarget.get(target);
+      if (cached2) return cached2;
+      const client = createRendererModelClient([target]);
+      if (client) clientsByTarget.set(target, client);
+      return client;
+    };
     const currentModelClient = () => {
-      const client = createRendererModelClient(findActivePrewarmTargets(document));
+      const client = modelClientForTargets(currentRequestRoute()?.targets ?? []);
       if (!client) throw new Error("Renderer Model request manager is unavailable");
       usageSubscription.connect(client);
       return client;
     };
     const modelControl = Object.freeze({
+      currentHostId: () => currentRequestRoute()?.policy.hostId ?? null,
+      clientForHost(hostId) {
+        const targets = rendererRequestTargetsForHost(findActivePrewarmTargets(document), hostId);
+        return modelClientForTargets(targets ?? []);
+      },
       forkThread: (input) => currentModelClient().forkThread(input),
       inspectHarness: (input) => currentModelClient().inspectHarness(input),
       inspectThread: (input) => currentModelClient().inspectThread(input),
@@ -18754,10 +19010,12 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     });
     let routingPolicy = null;
     let policyTimer = null;
+    let desiredCarrier = null;
     const captureRoutingPolicy = () => {
-      const discovered = window.__codexhostDraftPrewarmPolicyV1;
-      if (!isDraftPrewarmPolicyReady(discovered)) return false;
-      routingPolicy = discovered;
+      const route = currentRequestRoute();
+      if (!route) return false;
+      routingPolicy = route.policy;
+      routingPolicy.select(desiredCarrier);
       if (policyTimer !== null) {
         window.clearInterval(policyTimer);
         policyTimer = null;
@@ -18769,8 +19027,12 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       updateStatus("installing", "draft-routing-policy-unavailable", null);
       policyTimer = window.setInterval(captureRoutingPolicy, DRAFT_PREWARM_POLICY_POLL_INTERVAL_MS);
     }
+    const handleRoutingPolicyChange = () => {
+      captureRoutingPolicy();
+    };
+    window.addEventListener("codexhost:draft-prewarm-policy-changed", handleRoutingPolicyChange);
     const applyAgent = (agent, model, thinkingOptionId, permissionModeId) => {
-      if (disposed || routingPolicy === null) return false;
+      if (disposed) return false;
       const selection = modelSelectionForAgent(
         null,
         null,
@@ -18781,7 +19043,11 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       );
       const carrier = selection?.model;
       if (carrier !== null && carrier !== void 0 && typeof carrier !== "string") return false;
-      if (routingPolicy.select(carrier ?? null)) {
+      desiredCarrier = carrier ?? null;
+      const route = currentRequestRoute();
+      if (!route) return false;
+      routingPolicy = route.policy;
+      if (route.policy.select(desiredCarrier)) {
         modelUpdates += 1;
         liveStatus.modelUpdates = modelUpdates;
       }
@@ -18795,8 +19061,13 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
         if (disposed) return;
         disposed = true;
         if (policyTimer !== null) window.clearInterval(policyTimer);
+        window.removeEventListener(
+          "codexhost:draft-prewarm-policy-changed",
+          handleRoutingPolicyChange
+        );
         routingPolicy?.select(null);
         routingPolicy = null;
+        requestRouteResolver.clear();
         forkControl.dispose();
         usageSubscription.dispose();
       }
@@ -18848,9 +19119,11 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     const model = harnessModelRefSchema.safeParse(value.model);
     if (!model.success) return void 0;
     const thinkingOptionId = harnessThinkingOptionIdSchema.safeParse(value.thinkingOptionId);
+    const permissionModeId = harnessPermissionModeIdSchema.safeParse(value.permissionModeId);
     return {
       model: model.data,
-      ...thinkingOptionId.success ? { thinkingOptionId: thinkingOptionId.data } : {}
+      ...thinkingOptionId.success ? { thinkingOptionId: thinkingOptionId.data } : {},
+      ...permissionModeId.success ? { permissionModeId: permissionModeId.data } : {}
     };
   }
   function readPreference(storage) {
@@ -18890,15 +19163,17 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     const agent = readPreference(storage)?.lastAgent;
     return agent && enabledAgents.has(agent) ? agent : void 0;
   }
-  function readNewThreadExternalConfigurationPreference(agent, catalog, storage = rendererStorage2()) {
+  function readNewThreadExternalConfigurationPreference(agent, catalog, permissionModes, storage = rendererStorage2()) {
     const preference = readPreference(storage)?.externalByAgent[agent];
     if (!preference) return void 0;
     const catalogModel = catalog.models.find(({ ref }) => ref.id === preference.model.id);
     if (!catalogModel) return void 0;
     const thinkingOptionId = preference.thinkingOptionId && catalogModel.supportedThinkingOptionIds?.includes(preference.thinkingOptionId) ? preference.thinkingOptionId : void 0;
+    const permissionModeId = preference.permissionModeId && permissionModes?.modes.some(({ id }) => id === preference.permissionModeId) ? preference.permissionModeId : void 0;
     return {
       model: catalogModel.ref,
-      ...thinkingOptionId ? { thinkingOptionId } : {}
+      ...thinkingOptionId ? { thinkingOptionId } : {},
+      ...permissionModeId ? { permissionModeId } : {}
     };
   }
   function writeNewThreadAgentPreference(agent, storage = rendererStorage2()) {
@@ -18912,7 +19187,7 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
       storage
     );
   }
-  function writeNewThreadExternalConfigurationPreference(agent, model, thinkingOptionId, storage = rendererStorage2()) {
+  function writeNewThreadExternalConfigurationPreference(agent, model, thinkingOptionId, permissionModeId, storage = rendererStorage2()) {
     const current = readPreference(storage);
     writePreference(
       {
@@ -18922,7 +19197,8 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
           ...current?.externalByAgent,
           [agent]: {
             model: harnessModelRefSchema.parse(model),
-            ...thinkingOptionId ? { thinkingOptionId: harnessThinkingOptionIdSchema.parse(thinkingOptionId) } : {}
+            ...thinkingOptionId ? { thinkingOptionId: harnessThinkingOptionIdSchema.parse(thinkingOptionId) } : {},
+            ...permissionModeId ? { permissionModeId: harnessPermissionModeIdSchema.parse(permissionModeId) } : {}
           }
         }
       },
@@ -19122,6 +19398,10 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     runtimeCapabilityNotInstalled: "This runtime capability is not installed yet.",
     connectionsDescription: "Inspect the adapter and each Agent runtime used by the picker. Failed checks keep their error details here.",
     connectionAdapter: "Renderer adapter",
+    connectionHosts: "Hosts",
+    connectionLocalHost: "Local",
+    connectionRemoteHost: "Remote Host",
+    connectionActiveHost: "Current",
     connectionReason: "Reason",
     connectionRefresh: "Run connection diagnostics",
     connectionRefreshing: "Running diagnostics...",
@@ -19190,6 +19470,10 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     runtimeCapabilityNotInstalled: "\u8FD0\u884C\u65F6\u5C1A\u672A\u5B89\u88C5\u8BE5\u9879\u80FD\u529B\uFF0C\u56E0\u6B64\u6682\u4E0D\u53EF\u7528\u3002",
     connectionsDescription: "\u67E5\u770B\u9002\u914D\u5668\u548C Agent \u8FD0\u884C\u65F6\u7684\u771F\u5B9E\u68C0\u67E5\u7ED3\u679C\u3002\u5931\u8D25\u68C0\u67E5\u4F1A\u4FDD\u7559\u9519\u8BEF\u8BE6\u60C5\uFF0C\u65B9\u4FBF\u6392\u67E5\u65E0\u6CD5\u9009\u62E9\u7684\u95EE\u9898\u3002",
     connectionAdapter: "Renderer \u9002\u914D\u5668",
+    connectionHosts: "Host \u5217\u8868",
+    connectionLocalHost: "\u672C\u5730",
+    connectionRemoteHost: "\u8FDC\u7A0B Host",
+    connectionActiveHost: "\u5F53\u524D",
     connectionReason: "\u539F\u56E0",
     connectionRefresh: "\u91CD\u65B0\u8BCA\u65AD\u8FDE\u63A5",
     connectionRefreshing: "\u6B63\u5728\u8BCA\u65AD...",
@@ -19833,10 +20117,11 @@ Set the \`cycles\` parameter to \`"ref"\` to resolve cyclical schemas with defs.
     if (availability === "checking" || availability === "installing") return "checking";
     return "failed";
   }
-  function diagnosticText(name, snapshot) {
+  function diagnosticText(hostId, name, snapshot) {
     const error51 = snapshot.error;
     const lines = [
       "codexhost connection diagnostics",
+      `host: ${hostId}`,
       `agent: ${name}`,
       `status: ${snapshot.availability}`,
       ...error51 ? [
@@ -19882,7 +20167,7 @@ ${error51.stderrTail}`] : []
       () => showCopyButtonFeedback(button, messages.connectionCopyFailed, restoreLabel)
     );
   }
-  function appendConnectionRow(document2, parent, name, availability, detail, error51, messages, rowAttribute, diagnosticSnapshot) {
+  function appendConnectionRow(document2, parent, name, availability, detail, error51, messages, rowAttribute, diagnosticSnapshot, diagnosticHostId) {
     const row = document2.createElement("div");
     row.className = "settings-connection-row";
     if (rowAttribute) row.dataset.connectionAgent = rowAttribute;
@@ -19945,7 +20230,7 @@ ${error51.stderrTail}`] : []
         copyDiagnosticsToClipboard(
           document2,
           copy,
-          diagnosticText(name, diagnosticSnapshot),
+          diagnosticText(diagnosticHostId ?? "unknown", name, diagnosticSnapshot),
           messages,
           messages.connectionCopyDetails
         );
@@ -19961,6 +20246,18 @@ ${error51.stderrTail}`] : []
     row.append(identity, status, detailElement, details);
     parent.append(row);
   }
+  function connectionHostLabel(hostId, active, messages) {
+    const activeLabel = active ? ` \xB7 ${messages.connectionActiveHost}` : "";
+    if (hostId === "local") return `${messages.connectionLocalHost}${activeLabel}`;
+    const separator = hostId.lastIndexOf(":");
+    const encodedName = separator >= 0 ? hostId.slice(separator + 1) : hostId;
+    let name = encodedName;
+    try {
+      name = decodeURIComponent(encodedName);
+    } catch {
+    }
+    return `${messages.connectionRemoteHost}: ${name}${activeLabel}`;
+  }
   function connectionsPage(messages, getDiagnostics) {
     return Object.freeze({
       id: "connections",
@@ -19991,7 +20288,10 @@ ${error51.stderrTail}`] : []
         content.className = "settings-connection-list";
         context.content.append(heading, description, actions, content);
         let pending = false;
+        let selectedHostId = "local";
+        let latestSnapshot = null;
         const render = (snapshot) => {
+          latestSnapshot = snapshot;
           content.replaceChildren();
           if (!snapshot) {
             const empty = document2.createElement("div");
@@ -20010,19 +20310,50 @@ ${error51.stderrTail}`] : []
             messages,
             "renderer-adapter"
           );
-          for (const agent of snapshot.agents) {
+          const selectedHost = snapshot.hosts.find((host) => host.hostId === selectedHostId) ?? snapshot.hosts.find((host) => host.hostId === "local") ?? snapshot.hosts[0];
+          if (!selectedHost) return;
+          selectedHostId = selectedHost.hostId;
+          const tabs = document2.createElement("div");
+          tabs.className = "settings-connection-host-tabs";
+          tabs.setAttribute("role", "tablist");
+          tabs.setAttribute("aria-label", messages.connectionHosts);
+          const hostSection = document2.createElement("section");
+          hostSection.className = "settings-connection-host";
+          hostSection.dataset.connectionHost = selectedHost.hostId;
+          hostSection.setAttribute("role", "tabpanel");
+          const panelId = "codexhost-settings-connection-host-panel";
+          hostSection.id = panelId;
+          for (const host of snapshot.hosts) {
+            const tab = document2.createElement("button");
+            tab.type = "button";
+            tab.className = "settings-connection-host-tab";
+            tab.dataset.connectionHostTab = host.hostId;
+            tab.setAttribute("role", "tab");
+            tab.setAttribute("aria-controls", panelId);
+            tab.setAttribute("aria-selected", String(host.hostId === selectedHost.hostId));
+            tab.tabIndex = host.hostId === selectedHost.hostId ? 0 : -1;
+            tab.textContent = connectionHostLabel(host.hostId, host.active, messages);
+            tab.addEventListener("click", () => {
+              selectedHostId = host.hostId;
+              render(latestSnapshot);
+            });
+            tabs.append(tab);
+          }
+          for (const agent of selectedHost.agents) {
             appendConnectionRow(
               document2,
-              content,
+              hostSection,
               RENDERER_AGENT_LABELS[agent.agent],
               agent.availability,
               null,
               agent.error,
               messages,
               agent.agent,
-              agent
+              agent,
+              selectedHost.hostId
             );
           }
+          content.append(tabs, hostSection);
         };
         const diagnostics = getDiagnostics();
         render(diagnostics?.snapshot() ?? null);
@@ -20032,7 +20363,11 @@ ${error51.stderrTail}`] : []
         }
         copyAll.addEventListener("click", () => {
           const snapshot = diagnostics.snapshot();
-          const report = snapshot.agents.map((agent) => diagnosticText(RENDERER_AGENT_LABELS[agent.agent], agent)).join("\n\n");
+          const report = snapshot.hosts.flatMap(
+            (host) => host.agents.map(
+              (agent) => diagnosticText(host.hostId, RENDERER_AGENT_LABELS[agent.agent], agent)
+            )
+          ).join("\n\n");
           copyDiagnosticsToClipboard(document2, copyAll, report, messages, messages.connectionCopyAll);
         });
         const unsubscribe = diagnostics.subscribe(() => render(diagnostics.snapshot()));
@@ -20061,17 +20396,21 @@ ${error51.stderrTail}`] : []
                 createRendererSettingsIcon("diagnose", 16),
                 messages.connectionRefresh
               );
+              const snapshot = diagnostics.snapshot();
               render({
-                ...diagnostics.snapshot(),
-                agents: diagnostics.snapshot().agents.map((agent) => ({
-                  ...agent,
-                  availability: "error",
-                  error: {
-                    code: "internalError",
-                    message: error51 instanceof Error ? error51.message : String(error51),
-                    retryable: true,
-                    stage: "request"
-                  }
+                ...snapshot,
+                hosts: snapshot.hosts.map((host) => ({
+                  ...host,
+                  agents: host.agents.map((agent) => ({
+                    ...agent,
+                    availability: "error",
+                    error: {
+                      code: "internalError",
+                      message: error51 instanceof Error ? error51.message : String(error51),
+                      retryable: true,
+                      stage: "request"
+                    }
+                  }))
                 }))
               });
             }
@@ -20371,7 +20710,7 @@ ${error51.stderrTail}`] : []
   }
 
   // src/settings/shell.css
-  var shell_default = ':host {\n  --settings-bg: #181818;\n  --settings-sidebar: #1c1c1c;\n  --settings-panel: transparent;\n  --settings-text: #f5f5f5;\n  --settings-muted: #a1a1a1;\n  --settings-border: rgb(255 255 255 / 10%);\n  --settings-divider: rgb(255 255 255 / 10%);\n  --settings-hover: rgb(255 255 255 / 6%);\n  --settings-active: rgb(51 156 255 / 12%);\n  --settings-focus: #339cff;\n  color: var(--settings-text);\n  color-scheme: dark;\n  font:\n    14px/1.5 system-ui,\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    sans-serif;\n  letter-spacing: 0;\n}\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n  letter-spacing: 0;\n}\n\nbutton,\ninput,\nselect {\n  font: inherit;\n}\n\nbutton {\n  color: inherit;\n}\n\n[hidden] {\n  display: none !important;\n}\n\n.codexhost-settings-dialog {\n  width: min(1120px, calc(100vw - 32px));\n  height: min(780px, calc(100vh - 32px));\n  max-width: none;\n  max-height: none;\n  margin: auto;\n  padding: 0;\n  overflow: hidden;\n  color: var(--settings-text);\n  background: var(--settings-bg);\n  border: 1px solid var(--settings-border);\n  border-radius: 12px;\n  box-shadow: 0 24px 64px rgb(0 0 0 / 38%);\n}\n\n.codexhost-settings-dialog::backdrop {\n  background: rgb(0 0 0 / 52%);\n}\n\n.settings-frame,\n.settings-layout {\n  width: 100%;\n  height: 100%;\n  min-width: 0;\n  min-height: 0;\n}\n\n.settings-frame {\n  display: flex;\n  flex-direction: column;\n}\n\n.settings-layout {\n  flex: 1;\n  display: grid;\n  grid-template-columns: 240px minmax(0, 1fr);\n  background: var(--settings-bg);\n}\n\n.settings-sidebar {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex-direction: column;\n  overflow: hidden;\n  background: var(--settings-sidebar);\n  border-right: 1px solid var(--settings-border);\n  padding-top: 28px;\n}\n\n.settings-header {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n  height: 64px;\n  flex: none;\n  padding: 0 16px;\n  border-bottom: 1px solid var(--settings-border);\n}\n\n.settings-header-actions {\n  display: flex;\n  align-items: center;\n  flex: none;\n  gap: 12px;\n  margin-left: auto;\n}\n\n.settings-icon-button.settings-star-link {\n  width: auto;\n  gap: 6px;\n  padding-inline: 8px;\n  font-size: 12px;\n  line-height: 18px;\n  text-decoration: none;\n  border: 2px dashed #f5c542;\n  white-space: nowrap;\n}\n\n.settings-star-link .codexhost-settings-icon {\n  color: #f5c542;\n  fill: currentColor;\n  stroke: currentColor;\n}\n\n.settings-brand {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n  gap: 8px;\n}\n\n.settings-brand__mark {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 36px;\n  height: 36px;\n  flex: none;\n  color: var(--settings-text);\n}\n\n.settings-brand__mark .codexhost-settings-icon {\n  width: 32px;\n  height: 32px;\n  object-fit: contain;\n}\n\n.settings-brand__copy {\n  display: flex;\n  min-width: 0;\n  align-items: baseline;\n  gap: 0;\n  line-height: 20px;\n}\n\n.settings-brand__name {\n  overflow: hidden;\n  color: var(--settings-text);\n  font-size: 14px;\n  font-weight: 500;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.settings-brand__title {\n  margin-left: 14px;\n  padding-left: 14px;\n  color: var(--settings-muted);\n  font-size: 14px;\n  font-weight: 400;\n  border-left: 1px solid var(--settings-border);\n}\n\n.settings-nav {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex: 1;\n  flex-direction: column;\n  gap: 4px;\n  padding: 0 12px 16px;\n  overflow-y: auto;\n}\n\n.settings-nav-button {\n  display: grid;\n  grid-template-columns: 16px minmax(0, 1fr);\n  align-items: center;\n  width: 100%;\n  position: relative;\n  min-height: 40px;\n  flex: none;\n  gap: 12px;\n  padding: 8px 12px;\n  color: var(--settings-text);\n  font-size: 14px;\n  line-height: 21px;\n  text-align: left;\n  background: transparent;\n  border: 0;\n  border-radius: 10px;\n  cursor: pointer;\n}\n\n.settings-nav-button .codexhost-settings-icon {\n  width: 18px;\n  height: 18px;\n  opacity: 0.9;\n}\n\n.settings-nav-button:hover {\n  background: var(--settings-hover);\n}\n\n.settings-nav-button[aria-current="page"] {\n  background: var(--settings-active);\n  color: var(--settings-focus);\n}\n\n.settings-nav-button[aria-current="page"]::before {\n  position: absolute;\n  left: 0;\n  width: 3px;\n  height: 22px;\n  content: "";\n  background: var(--settings-focus);\n  border-radius: 0 3px 3px 0;\n}\n\n.settings-nav-button span {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.settings-icon-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n  flex: none;\n  padding: 0;\n  color: var(--settings-muted);\n  background: transparent;\n  border: 0;\n  border-radius: 8px;\n  cursor: pointer;\n}\n\n.settings-icon-button:hover {\n  color: var(--settings-text);\n  background: var(--settings-hover);\n}\n\n.settings-icon-button:focus-visible,\n.settings-nav-button:focus-visible {\n  outline: 2px solid var(--settings-focus);\n  outline-offset: 1px;\n}\n\n.settings-page {\n  display: block;\n  position: relative;\n  min-width: 0;\n  min-height: 0;\n  overflow-y: auto;\n  background: var(--settings-bg);\n  scrollbar-gutter: stable;\n}\n\n.settings-page__content {\n  width: min(930px, calc(100% - 80px));\n  margin-inline: auto;\n}\n\n.settings-page__content {\n  min-width: 0;\n  padding: 44px 0 56px;\n}\n\n.settings-section-label {\n  min-height: auto;\n  padding: 0 0 28px;\n  color: var(--settings-text);\n  font-size: 24px;\n  font-weight: 600;\n  line-height: 30px;\n}\n\n.settings-status-list,\n.settings-empty {\n  overflow: hidden;\n  background: var(--settings-panel);\n}\n\n.settings-status-row {\n  display: grid;\n  grid-template-columns: minmax(170px, 1fr) auto minmax(280px, 1.45fr);\n  position: relative;\n  align-items: center;\n  min-height: 88px;\n  gap: 28px;\n  padding: 16px 0;\n}\n\n.settings-status-row:not(:last-child)::after {\n  content: "";\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  height: 1px;\n  background: var(--settings-divider);\n}\n\n.settings-status-row__identity {\n  display: inline-flex;\n  align-items: center;\n  min-width: 0;\n  color: var(--settings-text);\n  gap: 14px;\n  font-size: 15px;\n  font-weight: 500;\n  line-height: 22px;\n}\n\n.settings-status-row__icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 44px;\n  height: 44px;\n  flex: none;\n  color: var(--settings-muted);\n  background: rgb(255 255 255 / 7%);\n  border-radius: 50%;\n}\n\n.settings-status-badge {\n  flex: none;\n  padding: 5px 12px;\n  color: var(--settings-muted);\n  font-size: 13px;\n  font-weight: 500;\n  line-height: 18px;\n  background: rgb(255 255 255 / 9%);\n  border: 1px solid rgb(255 255 255 / 6%);\n  border-radius: 6px;\n}\n\n.settings-status-row__detail {\n  min-width: 0;\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-page-description {\n  max-width: 760px;\n  margin: -12px 0 24px;\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-connection-actions {\n  display: flex;\n  justify-content: flex-end;\n  gap: 8px;\n  margin-bottom: 16px;\n}\n\n.settings-connection-list {\n  min-width: 0;\n  border-top: 1px solid var(--settings-divider);\n}\n\n.settings-connection-row {\n  display: grid;\n  grid-template-columns: minmax(180px, 1fr) auto minmax(260px, 1.5fr);\n  align-items: center;\n  min-width: 0;\n  min-height: 76px;\n  gap: 24px;\n  padding: 14px 0;\n  border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-row__identity {\n  display: inline-flex;\n  align-items: center;\n  min-width: 0;\n  gap: 10px;\n  color: var(--settings-text);\n  font-size: 14px;\n  line-height: 20px;\n}\n\n.settings-connection-row__identity strong {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  font-weight: 500;\n}\n\n.settings-connection-row__dot {\n  width: 9px;\n  height: 9px;\n  flex: none;\n  border-radius: 50%;\n  background: var(--settings-muted);\n}\n\n.settings-connection-row__dot[data-connection-tone="ready"] {\n  background: #22c55e;\n}\n\n.settings-connection-row__dot[data-connection-tone="checking"] {\n  background: #f5c542;\n}\n\n.settings-connection-row__dot[data-connection-tone="failed"] {\n  background: #ef4444;\n}\n\n.settings-status-badge[data-connection-tone="ready"] {\n  color: #4ade80;\n}\n\n.settings-status-badge[data-connection-tone="checking"] {\n  color: #f5c542;\n}\n\n.settings-status-badge[data-connection-tone="failed"] {\n  color: #f87171;\n}\n\n.settings-connection-row__detail {\n  display: grid;\n  min-width: 0;\n  align-items: center;\n  gap: 2px 12px;\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-connection-row__reason {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  white-space: pre-wrap;\n}\n\n.settings-connection-details-toggle {\n  width: fit-content;\n  padding: 0;\n  color: var(--settings-focus);\n  font: inherit;\n  font-size: 12px;\n  line-height: 18px;\n  background: transparent;\n  border: 0;\n  cursor: pointer;\n}\n\n.settings-connection-details-toggle:hover {\n  text-decoration: underline;\n}\n\n.settings-connection-details {\n  display: grid;\n  grid-column: 1 / -1;\n  gap: 6px;\n  min-width: 0;\n  margin: 4px 0 2px 32px;\n  padding: 12px;\n  color: var(--settings-muted);\n  background: rgb(255 255 255 / 4%);\n  border-left: 2px solid #ef4444;\n  border-radius: 4px;\n}\n\n.settings-connection-detail-line {\n  display: grid;\n  grid-template-columns: 112px minmax(0, 1fr);\n  gap: 12px;\n  min-width: 0;\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-connection-detail-line span {\n  color: var(--settings-muted);\n}\n\n.settings-connection-detail-line code {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  color: var(--settings-text);\n  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n  white-space: pre-wrap;\n}\n\n.settings-connection-stderr {\n  max-height: 220px;\n  min-width: 0;\n  margin: 4px 0 0;\n  padding: 10px;\n  overflow: auto;\n  color: #fca5a5;\n  font:\n    12px/18px ui-monospace,\n    "SFMono-Regular",\n    Consolas,\n    "Liberation Mono",\n    monospace;\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  background: rgb(0 0 0 / 28%);\n  border-radius: 4px;\n}\n\n.settings-connection-details .settings-command-button {\n  justify-self: start;\n  min-height: 30px;\n  font-size: 12px;\n}\n\n.settings-connection-row__detail time {\n  color: var(--settings-muted);\n  opacity: 0.8;\n}\n\n.settings-empty {\n  display: flex;\n  align-items: center;\n  min-height: 72px;\n  padding: 12px 16px;\n}\n\n.settings-empty > div {\n  display: grid;\n  min-width: 0;\n  gap: 2px;\n}\n\n.settings-empty strong {\n  color: var(--settings-text);\n  font-size: 13px;\n  font-weight: 500;\n  line-height: 19px;\n}\n\n.settings-empty span {\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 19px;\n}\n\n.settings-page-error {\n  padding: 16px;\n  color: var(--settings-text);\n  font-size: 13px;\n  background: var(--settings-panel);\n  border: 1px solid var(--settings-border);\n  border-radius: 20px;\n}\n\n.settings-update-metadata {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 24px;\n  margin-bottom: 24px;\n  padding: 0 4px 20px;\n  border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-update-metadata__item {\n  display: grid;\n  min-width: 0;\n  gap: 4px;\n}\n\n.settings-update-metadata__item span {\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-metadata__item strong {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  color: var(--settings-text);\n  font-size: 15px;\n  font-weight: 500;\n  line-height: 22px;\n}\n\n.settings-update-panel {\n  display: grid;\n  gap: 16px;\n  min-height: 128px;\n  padding: 20px;\n  color: var(--settings-text);\n  background: var(--settings-panel);\n  border: 1px solid var(--settings-border);\n  border-radius: 8px;\n}\n\n.settings-update-panel > strong,\n.settings-update-panel > span,\n.settings-update-summary,\n.settings-update-error {\n  margin: 0;\n  overflow-wrap: anywhere;\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-update-panel > span,\n.settings-update-summary {\n  color: var(--settings-muted);\n}\n\n.settings-update-error {\n  color: #ef4444;\n}\n\n.settings-update-progress {\n  width: 100%;\n  height: 8px;\n  accent-color: #238be8;\n}\n\n.settings-update-progress-detail {\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-notes {\n  display: grid;\n  min-width: 0;\n  gap: 12px;\n  color: var(--settings-muted);\n  font-size: 14px;\n  line-height: 22px;\n  overflow-wrap: anywhere;\n}\n\n.settings-update-notes > :first-child {\n  margin-top: 0;\n}\n\n.settings-update-notes > :last-child {\n  margin-bottom: 0;\n}\n\n.settings-update-notes h1,\n.settings-update-notes h2,\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n  margin: 6px 0 0;\n  color: var(--settings-text);\n  font-weight: 600;\n}\n\n.settings-update-notes h1 {\n  font-size: 18px;\n  line-height: 26px;\n}\n\n.settings-update-notes h2 {\n  font-size: 17px;\n  line-height: 24px;\n}\n\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n  font-size: 14px;\n  line-height: 22px;\n}\n\n.settings-update-notes p,\n.settings-update-notes ul,\n.settings-update-notes ol,\n.settings-update-notes pre,\n.settings-update-notes blockquote {\n  margin: 0;\n}\n\n.settings-update-notes ul,\n.settings-update-notes ol {\n  padding-left: 24px;\n}\n\n.settings-update-notes li {\n  padding-left: 4px;\n}\n\n.settings-update-notes li::marker {\n  color: var(--settings-muted);\n  font-size: 0.85em;\n}\n\n.settings-update-notes li + li {\n  margin-top: 14px;\n}\n\n.settings-update-notes .release-note-translation {\n  display: block;\n  margin-top: 3px;\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-update-notes blockquote {\n  padding: 8px 12px;\n  color: var(--settings-muted);\n  border-left: 3px solid var(--settings-focus);\n  background: rgb(255 255 255 / 4%);\n}\n\n.settings-update-notes hr {\n  width: 100%;\n  margin: 2px 0;\n  border: 0;\n  border-top: 1px solid var(--settings-divider);\n}\n\n.settings-update-notes strong {\n  color: var(--settings-text);\n  font-weight: 600;\n}\n\n.settings-update-notes a {\n  color: #7cb8ff;\n  text-decoration: none;\n}\n\n.settings-update-notes a:hover {\n  text-decoration: underline;\n}\n\n.settings-update-notes code {\n  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n  font-size: 12px;\n}\n\n.settings-update-notes :not(pre) > code {\n  padding: 1px 5px;\n  background: rgb(255 255 255 / 8%);\n  border-radius: 4px;\n}\n\n.settings-update-notes pre {\n  min-width: 0;\n  max-width: 100%;\n  padding: 10px 12px;\n  overflow-x: auto;\n  overflow-y: hidden;\n  background: rgb(0 0 0 / 28%);\n  border-radius: 6px;\n}\n\n.settings-update-notes pre code {\n  line-height: 18px;\n  white-space: pre-wrap;\n}\n\n.settings-update-version-row {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  align-items: center;\n  gap: 20px;\n  min-height: 32px;\n  color: var(--settings-muted);\n  font-size: 13px;\n}\n\n.settings-update-version-row strong {\n  color: var(--settings-text);\n  font-size: 15px;\n}\n\n.settings-update-manual {\n  display: grid;\n  min-width: 0;\n  gap: 6px;\n  margin-top: 14px;\n  padding-inline: 4px;\n}\n\n.settings-update-manual[hidden] {\n  display: none;\n}\n\n.settings-update-manual span {\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-manual code {\n  overflow-wrap: anywhere;\n  color: var(--settings-text);\n  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-actions {\n  display: flex;\n  min-width: 0;\n  margin-top: 16px;\n}\n\n.settings-command-button,\n.settings-update-link {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n  min-height: 36px;\n  gap: 8px;\n  padding: 8px 12px;\n  color: white;\n  font: inherit;\n  font-size: 13px;\n  text-decoration: none;\n  background: #1677d2;\n  border: 1px solid #238be8;\n  border-radius: 6px;\n  cursor: pointer;\n}\n\n.settings-command-button--secondary,\n.settings-update-link {\n  color: var(--settings-text);\n  background: transparent;\n  border-color: var(--settings-border);\n}\n\n.settings-command-button:hover,\n.settings-update-link:hover {\n  filter: brightness(1.08);\n}\n\n.settings-command-button:focus-visible,\n.settings-update-link:focus-visible {\n  outline: 2px solid var(--settings-focus);\n  outline-offset: 2px;\n}\n\n.codexhost-settings-icon {\n  display: block;\n  flex: none;\n  stroke: currentColor;\n}\n\n@media (max-width: 720px) {\n  .codexhost-settings-dialog {\n    width: calc(100vw - 16px);\n    height: calc(100vh - 16px);\n    border-radius: 10px;\n  }\n\n  .settings-layout {\n    grid-template-columns: minmax(0, 1fr);\n    grid-template-rows: auto minmax(0, 1fr);\n  }\n\n  .settings-sidebar {\n    border-right: 0;\n    border-bottom: 1px solid var(--settings-border);\n  }\n\n  .settings-header {\n    height: 56px;\n    padding-inline: 14px;\n  }\n\n  .settings-icon-button.settings-star-link {\n    width: 28px;\n    padding: 0;\n  }\n\n  .settings-star-link span {\n    display: none;\n  }\n\n  .settings-sidebar {\n    padding-top: 20px;\n  }\n\n  .settings-nav {\n    flex: none;\n    flex-direction: row;\n    gap: 4px;\n    padding: 7px 8px 8px;\n    overflow-x: auto;\n    overflow-y: hidden;\n  }\n\n  .settings-nav-button {\n    width: auto;\n    min-width: max-content;\n    min-height: 34px;\n    grid-template-columns: 16px auto;\n    border-radius: 10px;\n  }\n\n  .settings-page__content {\n    width: calc(100% - 40px);\n  }\n\n  .settings-page__content {\n    padding-top: 32px;\n    padding-bottom: 32px;\n  }\n\n  .settings-section-label {\n    padding-bottom: 20px;\n    font-size: 20px;\n    line-height: 26px;\n  }\n\n  .settings-status-row {\n    grid-template-columns: minmax(0, 1fr) auto;\n    gap: 16px;\n  }\n\n  .settings-connection-row {\n    grid-template-columns: minmax(0, 1fr) auto;\n    gap: 10px 16px;\n  }\n\n  .settings-connection-row__detail {\n    grid-column: 1 / -1;\n  }\n\n  .settings-status-row__detail {\n    grid-column: 1 / -1;\n    margin: -8px 0 0 58px;\n  }\n}\n\n@media (forced-colors: active) {\n  :host,\n  :host([data-theme="dark"]) {\n    --settings-bg: Canvas;\n    --settings-sidebar: Canvas;\n    --settings-panel: Canvas;\n    --settings-text: CanvasText;\n    --settings-muted: GrayText;\n    --settings-border: ButtonBorder;\n    --settings-divider: ButtonBorder;\n    --settings-hover: Highlight;\n    --settings-active: Highlight;\n    --settings-focus: Highlight;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  *,\n  *::before,\n  *::after {\n    scroll-behavior: auto !important;\n  }\n}\n';
+  var shell_default = ':host {\n  --settings-bg: #181818;\n  --settings-sidebar: #1c1c1c;\n  --settings-panel: transparent;\n  --settings-text: #f5f5f5;\n  --settings-muted: #a1a1a1;\n  --settings-border: rgb(255 255 255 / 10%);\n  --settings-divider: rgb(255 255 255 / 10%);\n  --settings-hover: rgb(255 255 255 / 6%);\n  --settings-active: rgb(51 156 255 / 12%);\n  --settings-focus: #339cff;\n  color: var(--settings-text);\n  color-scheme: dark;\n  font:\n    14px/1.5 system-ui,\n    -apple-system,\n    BlinkMacSystemFont,\n    "Segoe UI",\n    sans-serif;\n  letter-spacing: 0;\n}\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n  letter-spacing: 0;\n}\n\nbutton,\ninput,\nselect {\n  font: inherit;\n}\n\nbutton {\n  color: inherit;\n}\n\n[hidden] {\n  display: none !important;\n}\n\n.codexhost-settings-dialog {\n  width: min(1120px, calc(100vw - 32px));\n  height: min(780px, calc(100vh - 32px));\n  max-width: none;\n  max-height: none;\n  margin: auto;\n  padding: 0;\n  overflow: hidden;\n  color: var(--settings-text);\n  background: var(--settings-bg);\n  border: 1px solid var(--settings-border);\n  border-radius: 12px;\n  box-shadow: 0 24px 64px rgb(0 0 0 / 38%);\n}\n\n.codexhost-settings-dialog::backdrop {\n  background: rgb(0 0 0 / 52%);\n}\n\n.settings-frame,\n.settings-layout {\n  width: 100%;\n  height: 100%;\n  min-width: 0;\n  min-height: 0;\n}\n\n.settings-frame {\n  display: flex;\n  flex-direction: column;\n}\n\n.settings-layout {\n  flex: 1;\n  display: grid;\n  grid-template-columns: 240px minmax(0, 1fr);\n  background: var(--settings-bg);\n}\n\n.settings-sidebar {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex-direction: column;\n  overflow: hidden;\n  background: var(--settings-sidebar);\n  border-right: 1px solid var(--settings-border);\n  padding-top: 28px;\n}\n\n.settings-header {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n  height: 64px;\n  flex: none;\n  padding: 0 16px;\n  border-bottom: 1px solid var(--settings-border);\n}\n\n.settings-header-actions {\n  display: flex;\n  align-items: center;\n  flex: none;\n  gap: 12px;\n  margin-left: auto;\n}\n\n.settings-icon-button.settings-star-link {\n  width: auto;\n  gap: 6px;\n  padding-inline: 8px;\n  font-size: 12px;\n  line-height: 18px;\n  text-decoration: none;\n  border: 2px dashed #f5c542;\n  white-space: nowrap;\n}\n\n.settings-star-link .codexhost-settings-icon {\n  color: #f5c542;\n  fill: currentColor;\n  stroke: currentColor;\n}\n\n.settings-brand {\n  display: flex;\n  align-items: center;\n  min-width: 0;\n  gap: 8px;\n}\n\n.settings-brand__mark {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 36px;\n  height: 36px;\n  flex: none;\n  color: var(--settings-text);\n}\n\n.settings-brand__mark .codexhost-settings-icon {\n  width: 32px;\n  height: 32px;\n  object-fit: contain;\n}\n\n.settings-brand__copy {\n  display: flex;\n  min-width: 0;\n  align-items: baseline;\n  gap: 0;\n  line-height: 20px;\n}\n\n.settings-brand__name {\n  overflow: hidden;\n  color: var(--settings-text);\n  font-size: 14px;\n  font-weight: 500;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.settings-brand__title {\n  margin-left: 14px;\n  padding-left: 14px;\n  color: var(--settings-muted);\n  font-size: 14px;\n  font-weight: 400;\n  border-left: 1px solid var(--settings-border);\n}\n\n.settings-nav {\n  display: flex;\n  min-width: 0;\n  min-height: 0;\n  flex: 1;\n  flex-direction: column;\n  gap: 4px;\n  padding: 0 12px 16px;\n  overflow-y: auto;\n}\n\n.settings-nav-button {\n  display: grid;\n  grid-template-columns: 16px minmax(0, 1fr);\n  align-items: center;\n  width: 100%;\n  position: relative;\n  min-height: 40px;\n  flex: none;\n  gap: 12px;\n  padding: 8px 12px;\n  color: var(--settings-text);\n  font-size: 14px;\n  line-height: 21px;\n  text-align: left;\n  background: transparent;\n  border: 0;\n  border-radius: 10px;\n  cursor: pointer;\n}\n\n.settings-nav-button .codexhost-settings-icon {\n  width: 18px;\n  height: 18px;\n  opacity: 0.9;\n}\n\n.settings-nav-button:hover {\n  background: var(--settings-hover);\n}\n\n.settings-nav-button[aria-current="page"] {\n  background: var(--settings-active);\n  color: var(--settings-focus);\n}\n\n.settings-nav-button[aria-current="page"]::before {\n  position: absolute;\n  left: 0;\n  width: 3px;\n  height: 22px;\n  content: "";\n  background: var(--settings-focus);\n  border-radius: 0 3px 3px 0;\n}\n\n.settings-nav-button span {\n  min-width: 0;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.settings-icon-button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n  flex: none;\n  padding: 0;\n  color: var(--settings-muted);\n  background: transparent;\n  border: 0;\n  border-radius: 8px;\n  cursor: pointer;\n}\n\n.settings-icon-button:hover {\n  color: var(--settings-text);\n  background: var(--settings-hover);\n}\n\n.settings-icon-button:focus-visible,\n.settings-nav-button:focus-visible {\n  outline: 2px solid var(--settings-focus);\n  outline-offset: 1px;\n}\n\n.settings-page {\n  display: block;\n  position: relative;\n  min-width: 0;\n  min-height: 0;\n  overflow-y: auto;\n  background: var(--settings-bg);\n  scrollbar-gutter: stable;\n}\n\n.settings-page__content {\n  width: min(930px, calc(100% - 80px));\n  margin-inline: auto;\n}\n\n.settings-page__content {\n  min-width: 0;\n  padding: 44px 0 56px;\n}\n\n.settings-section-label {\n  min-height: auto;\n  padding: 0 0 28px;\n  color: var(--settings-text);\n  font-size: 24px;\n  font-weight: 600;\n  line-height: 30px;\n}\n\n.settings-status-list,\n.settings-empty {\n  overflow: hidden;\n  background: var(--settings-panel);\n}\n\n.settings-status-row {\n  display: grid;\n  grid-template-columns: minmax(170px, 1fr) auto minmax(280px, 1.45fr);\n  position: relative;\n  align-items: center;\n  min-height: 88px;\n  gap: 28px;\n  padding: 16px 0;\n}\n\n.settings-status-row:not(:last-child)::after {\n  content: "";\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  height: 1px;\n  background: var(--settings-divider);\n}\n\n.settings-status-row__identity {\n  display: inline-flex;\n  align-items: center;\n  min-width: 0;\n  color: var(--settings-text);\n  gap: 14px;\n  font-size: 15px;\n  font-weight: 500;\n  line-height: 22px;\n}\n\n.settings-status-row__icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: 44px;\n  height: 44px;\n  flex: none;\n  color: var(--settings-muted);\n  background: rgb(255 255 255 / 7%);\n  border-radius: 50%;\n}\n\n.settings-status-badge {\n  flex: none;\n  padding: 5px 12px;\n  color: var(--settings-muted);\n  font-size: 13px;\n  font-weight: 500;\n  line-height: 18px;\n  background: rgb(255 255 255 / 9%);\n  border: 1px solid rgb(255 255 255 / 6%);\n  border-radius: 6px;\n}\n\n.settings-status-row__detail {\n  min-width: 0;\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-page-description {\n  max-width: 760px;\n  margin: -12px 0 24px;\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-connection-actions {\n  display: flex;\n  justify-content: flex-end;\n  gap: 8px;\n  margin-bottom: 16px;\n}\n\n.settings-connection-list {\n  min-width: 0;\n  border-top: 1px solid var(--settings-divider);\n}\n\n.settings-connection-host-tabs {\n  display: flex;\n  gap: 6px;\n  padding: 20px 0 8px;\n  overflow-x: auto;\n  border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-host-tab {\n  flex: none;\n  padding: 7px 12px;\n  border: 0;\n  border-radius: 8px;\n  background: transparent;\n  color: var(--settings-muted);\n  font: inherit;\n  font-size: 13px;\n  line-height: 18px;\n  cursor: pointer;\n}\n\n.settings-connection-host-tab:hover {\n  background: var(--settings-hover);\n  color: var(--settings-text);\n}\n\n.settings-connection-host-tab[aria-selected="true"] {\n  background: var(--settings-active);\n  color: var(--settings-text);\n  font-weight: 600;\n}\n\n.settings-connection-host-tab:focus-visible {\n  outline: 2px solid var(--settings-focus);\n  outline-offset: -2px;\n}\n\n.settings-connection-row {\n  display: grid;\n  grid-template-columns: minmax(180px, 1fr) auto minmax(260px, 1.5fr);\n  align-items: center;\n  min-width: 0;\n  min-height: 76px;\n  gap: 24px;\n  padding: 14px 0;\n  border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-connection-row__identity {\n  display: inline-flex;\n  align-items: center;\n  min-width: 0;\n  gap: 10px;\n  color: var(--settings-text);\n  font-size: 14px;\n  line-height: 20px;\n}\n\n.settings-connection-row__identity strong {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  font-weight: 500;\n}\n\n.settings-connection-row__dot {\n  width: 9px;\n  height: 9px;\n  flex: none;\n  border-radius: 50%;\n  background: var(--settings-muted);\n}\n\n.settings-connection-row__dot[data-connection-tone="ready"] {\n  background: #22c55e;\n}\n\n.settings-connection-row__dot[data-connection-tone="checking"] {\n  background: #f5c542;\n}\n\n.settings-connection-row__dot[data-connection-tone="failed"] {\n  background: #ef4444;\n}\n\n.settings-status-badge[data-connection-tone="ready"] {\n  color: #4ade80;\n}\n\n.settings-status-badge[data-connection-tone="checking"] {\n  color: #f5c542;\n}\n\n.settings-status-badge[data-connection-tone="failed"] {\n  color: #f87171;\n}\n\n.settings-connection-row__detail {\n  display: grid;\n  min-width: 0;\n  align-items: center;\n  gap: 2px 12px;\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-connection-row__reason {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  white-space: pre-wrap;\n}\n\n.settings-connection-details-toggle {\n  width: fit-content;\n  padding: 0;\n  color: var(--settings-focus);\n  font: inherit;\n  font-size: 12px;\n  line-height: 18px;\n  background: transparent;\n  border: 0;\n  cursor: pointer;\n}\n\n.settings-connection-details-toggle:hover {\n  text-decoration: underline;\n}\n\n.settings-connection-details {\n  display: grid;\n  grid-column: 1 / -1;\n  gap: 6px;\n  min-width: 0;\n  margin: 4px 0 2px 32px;\n  padding: 12px;\n  color: var(--settings-muted);\n  background: rgb(255 255 255 / 4%);\n  border-left: 2px solid #ef4444;\n  border-radius: 4px;\n}\n\n.settings-connection-detail-line {\n  display: grid;\n  grid-template-columns: 112px minmax(0, 1fr);\n  gap: 12px;\n  min-width: 0;\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-connection-detail-line span {\n  color: var(--settings-muted);\n}\n\n.settings-connection-detail-line code {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  color: var(--settings-text);\n  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n  white-space: pre-wrap;\n}\n\n.settings-connection-stderr {\n  max-height: 220px;\n  min-width: 0;\n  margin: 4px 0 0;\n  padding: 10px;\n  overflow: auto;\n  color: #fca5a5;\n  font:\n    12px/18px ui-monospace,\n    "SFMono-Regular",\n    Consolas,\n    "Liberation Mono",\n    monospace;\n  white-space: pre-wrap;\n  overflow-wrap: anywhere;\n  background: rgb(0 0 0 / 28%);\n  border-radius: 4px;\n}\n\n.settings-connection-details .settings-command-button {\n  justify-self: start;\n  min-height: 30px;\n  font-size: 12px;\n}\n\n.settings-connection-row__detail time {\n  color: var(--settings-muted);\n  opacity: 0.8;\n}\n\n.settings-empty {\n  display: flex;\n  align-items: center;\n  min-height: 72px;\n  padding: 12px 16px;\n}\n\n.settings-empty > div {\n  display: grid;\n  min-width: 0;\n  gap: 2px;\n}\n\n.settings-empty strong {\n  color: var(--settings-text);\n  font-size: 13px;\n  font-weight: 500;\n  line-height: 19px;\n}\n\n.settings-empty span {\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 19px;\n}\n\n.settings-page-error {\n  padding: 16px;\n  color: var(--settings-text);\n  font-size: 13px;\n  background: var(--settings-panel);\n  border: 1px solid var(--settings-border);\n  border-radius: 20px;\n}\n\n.settings-update-metadata {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 24px;\n  margin-bottom: 24px;\n  padding: 0 4px 20px;\n  border-bottom: 1px solid var(--settings-divider);\n}\n\n.settings-update-metadata__item {\n  display: grid;\n  min-width: 0;\n  gap: 4px;\n}\n\n.settings-update-metadata__item span {\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-metadata__item strong {\n  min-width: 0;\n  overflow-wrap: anywhere;\n  color: var(--settings-text);\n  font-size: 15px;\n  font-weight: 500;\n  line-height: 22px;\n}\n\n.settings-update-panel {\n  display: grid;\n  gap: 16px;\n  min-height: 128px;\n  padding: 20px;\n  color: var(--settings-text);\n  background: var(--settings-panel);\n  border: 1px solid var(--settings-border);\n  border-radius: 8px;\n}\n\n.settings-update-panel > strong,\n.settings-update-panel > span,\n.settings-update-summary,\n.settings-update-error {\n  margin: 0;\n  overflow-wrap: anywhere;\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-update-panel > span,\n.settings-update-summary {\n  color: var(--settings-muted);\n}\n\n.settings-update-error {\n  color: #ef4444;\n}\n\n.settings-update-progress {\n  width: 100%;\n  height: 8px;\n  accent-color: #238be8;\n}\n\n.settings-update-progress-detail {\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-notes {\n  display: grid;\n  min-width: 0;\n  gap: 12px;\n  color: var(--settings-muted);\n  font-size: 14px;\n  line-height: 22px;\n  overflow-wrap: anywhere;\n}\n\n.settings-update-notes > :first-child {\n  margin-top: 0;\n}\n\n.settings-update-notes > :last-child {\n  margin-bottom: 0;\n}\n\n.settings-update-notes h1,\n.settings-update-notes h2,\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n  margin: 6px 0 0;\n  color: var(--settings-text);\n  font-weight: 600;\n}\n\n.settings-update-notes h1 {\n  font-size: 18px;\n  line-height: 26px;\n}\n\n.settings-update-notes h2 {\n  font-size: 17px;\n  line-height: 24px;\n}\n\n.settings-update-notes h3,\n.settings-update-notes h4,\n.settings-update-notes h5,\n.settings-update-notes h6 {\n  font-size: 14px;\n  line-height: 22px;\n}\n\n.settings-update-notes p,\n.settings-update-notes ul,\n.settings-update-notes ol,\n.settings-update-notes pre,\n.settings-update-notes blockquote {\n  margin: 0;\n}\n\n.settings-update-notes ul,\n.settings-update-notes ol {\n  padding-left: 24px;\n}\n\n.settings-update-notes li {\n  padding-left: 4px;\n}\n\n.settings-update-notes li::marker {\n  color: var(--settings-muted);\n  font-size: 0.85em;\n}\n\n.settings-update-notes li + li {\n  margin-top: 14px;\n}\n\n.settings-update-notes .release-note-translation {\n  display: block;\n  margin-top: 3px;\n  color: var(--settings-muted);\n  font-size: 13px;\n  line-height: 20px;\n}\n\n.settings-update-notes blockquote {\n  padding: 8px 12px;\n  color: var(--settings-muted);\n  border-left: 3px solid var(--settings-focus);\n  background: rgb(255 255 255 / 4%);\n}\n\n.settings-update-notes hr {\n  width: 100%;\n  margin: 2px 0;\n  border: 0;\n  border-top: 1px solid var(--settings-divider);\n}\n\n.settings-update-notes strong {\n  color: var(--settings-text);\n  font-weight: 600;\n}\n\n.settings-update-notes a {\n  color: #7cb8ff;\n  text-decoration: none;\n}\n\n.settings-update-notes a:hover {\n  text-decoration: underline;\n}\n\n.settings-update-notes code {\n  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n  font-size: 12px;\n}\n\n.settings-update-notes :not(pre) > code {\n  padding: 1px 5px;\n  background: rgb(255 255 255 / 8%);\n  border-radius: 4px;\n}\n\n.settings-update-notes pre {\n  min-width: 0;\n  max-width: 100%;\n  padding: 10px 12px;\n  overflow-x: auto;\n  overflow-y: hidden;\n  background: rgb(0 0 0 / 28%);\n  border-radius: 6px;\n}\n\n.settings-update-notes pre code {\n  line-height: 18px;\n  white-space: pre-wrap;\n}\n\n.settings-update-version-row {\n  display: grid;\n  grid-template-columns: minmax(0, 1fr) auto;\n  align-items: center;\n  gap: 20px;\n  min-height: 32px;\n  color: var(--settings-muted);\n  font-size: 13px;\n}\n\n.settings-update-version-row strong {\n  color: var(--settings-text);\n  font-size: 15px;\n}\n\n.settings-update-manual {\n  display: grid;\n  min-width: 0;\n  gap: 6px;\n  margin-top: 14px;\n  padding-inline: 4px;\n}\n\n.settings-update-manual[hidden] {\n  display: none;\n}\n\n.settings-update-manual span {\n  color: var(--settings-muted);\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-manual code {\n  overflow-wrap: anywhere;\n  color: var(--settings-text);\n  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;\n  font-size: 12px;\n  line-height: 18px;\n}\n\n.settings-update-actions {\n  display: flex;\n  min-width: 0;\n  margin-top: 16px;\n}\n\n.settings-command-button,\n.settings-update-link {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  width: fit-content;\n  min-height: 36px;\n  gap: 8px;\n  padding: 8px 12px;\n  color: white;\n  font: inherit;\n  font-size: 13px;\n  text-decoration: none;\n  background: #1677d2;\n  border: 1px solid #238be8;\n  border-radius: 6px;\n  cursor: pointer;\n}\n\n.settings-command-button--secondary,\n.settings-update-link {\n  color: var(--settings-text);\n  background: transparent;\n  border-color: var(--settings-border);\n}\n\n.settings-command-button:hover,\n.settings-update-link:hover {\n  filter: brightness(1.08);\n}\n\n.settings-command-button:focus-visible,\n.settings-update-link:focus-visible {\n  outline: 2px solid var(--settings-focus);\n  outline-offset: 2px;\n}\n\n.codexhost-settings-icon {\n  display: block;\n  flex: none;\n  stroke: currentColor;\n}\n\n@media (max-width: 720px) {\n  .codexhost-settings-dialog {\n    width: calc(100vw - 16px);\n    height: calc(100vh - 16px);\n    border-radius: 10px;\n  }\n\n  .settings-layout {\n    grid-template-columns: minmax(0, 1fr);\n    grid-template-rows: auto minmax(0, 1fr);\n  }\n\n  .settings-sidebar {\n    border-right: 0;\n    border-bottom: 1px solid var(--settings-border);\n  }\n\n  .settings-header {\n    height: 56px;\n    padding-inline: 14px;\n  }\n\n  .settings-icon-button.settings-star-link {\n    width: 28px;\n    padding: 0;\n  }\n\n  .settings-star-link span {\n    display: none;\n  }\n\n  .settings-sidebar {\n    padding-top: 20px;\n  }\n\n  .settings-nav {\n    flex: none;\n    flex-direction: row;\n    gap: 4px;\n    padding: 7px 8px 8px;\n    overflow-x: auto;\n    overflow-y: hidden;\n  }\n\n  .settings-nav-button {\n    width: auto;\n    min-width: max-content;\n    min-height: 34px;\n    grid-template-columns: 16px auto;\n    border-radius: 10px;\n  }\n\n  .settings-page__content {\n    width: calc(100% - 40px);\n  }\n\n  .settings-page__content {\n    padding-top: 32px;\n    padding-bottom: 32px;\n  }\n\n  .settings-section-label {\n    padding-bottom: 20px;\n    font-size: 20px;\n    line-height: 26px;\n  }\n\n  .settings-status-row {\n    grid-template-columns: minmax(0, 1fr) auto;\n    gap: 16px;\n  }\n\n  .settings-connection-row {\n    grid-template-columns: minmax(0, 1fr) auto;\n    gap: 10px 16px;\n  }\n\n  .settings-connection-row__detail {\n    grid-column: 1 / -1;\n  }\n\n  .settings-status-row__detail {\n    grid-column: 1 / -1;\n    margin: -8px 0 0 58px;\n  }\n}\n\n@media (forced-colors: active) {\n  :host,\n  :host([data-theme="dark"]) {\n    --settings-bg: Canvas;\n    --settings-sidebar: Canvas;\n    --settings-panel: Canvas;\n    --settings-text: CanvasText;\n    --settings-muted: GrayText;\n    --settings-border: ButtonBorder;\n    --settings-divider: ButtonBorder;\n    --settings-hover: Highlight;\n    --settings-active: Highlight;\n    --settings-focus: Highlight;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  *,\n  *::before,\n  *::after {\n    scroll-behavior: auto !important;\n  }\n}\n';
 
   // src/settings/shell.ts
   var SETTINGS_SHELL_ATTRIBUTE = "data-codexhost-settings-shell";
@@ -21034,6 +21373,9 @@ ${error51.stderrTail}`] : []
   function draftPermissionMode(catalog, requested) {
     return catalog.modes.find(({ id }) => id === requested)?.id ?? catalog.modes.find(({ id }) => id === catalog.defaultModeId)?.id ?? catalog.defaultModeId;
   }
+  function shouldPersistNewThreadConfigurationSelection(phase) {
+    return phase === "draft";
+  }
   function restoredThreadOwnership(inspection) {
     if (inspection.owner === "codex") return { agent: "codex" };
     if (inspection.harnessId === "pi") {
@@ -21057,10 +21399,12 @@ ${error51.stderrTail}`] : []
       }
       const model = inspection.effectiveModel ?? transportSelection.model;
       const thinkingOptionId = selectableThinkingOptionId(inspection) ?? transportSelection.thinkingOptionId;
+      const permissionModeId = inspection.effectivePermissionModeId ?? transportSelection.permissionModeId;
       return {
         agent: "grok",
         ...model ? { model } : {},
-        ...thinkingOptionId ? { thinkingOptionId } : {}
+        ...thinkingOptionId ? { thinkingOptionId } : {},
+        ...permissionModeId ? { permissionModeId } : {}
       };
     }
     if (inspection.harnessId === "claude-code") {
@@ -21091,10 +21435,10 @@ ${error51.stderrTail}`] : []
   function isOwnershipSubmissionBlocked(status) {
     return status === "loading" || status === "error";
   }
-  function shouldTransferComposerState(sourceTarget, replacementTarget, sourcePhase) {
+  function shouldTransferComposerState(sourceTarget, replacementTarget, sourcePhase, submissionPending = false) {
     if (!sourceTarget || !replacementTarget) return false;
     if (sourceTarget === replacementTarget) return true;
-    return sourcePhase === "locked" && sourceTarget[0] === "default" && replacementTarget[0] === "conversation";
+    return (sourcePhase === "locked" || submissionPending) && sourceTarget[0] === "default" && replacementTarget[0] === "conversation";
   }
   function isLateConversationTarget(mountedTarget, currentTarget) {
     if (currentTarget?.[0] !== "conversation") return false;
@@ -21103,13 +21447,16 @@ ${error51.stderrTail}`] : []
     if (mountedTarget?.[0] !== "conversation") return false;
     return mountedTarget.length !== currentTarget.length || mountedTarget.some((value, index) => value !== currentTarget[index]);
   }
-  function lateConversationTargetResolution(mountedTarget, currentTarget, sourcePhase) {
+  function lateConversationTargetResolution(mountedTarget, currentTarget, sourcePhase, submissionPending = false) {
     if (!isLateConversationTarget(mountedTarget, currentTarget)) return "none";
-    return mountedTarget?.[0] === "default" && sourcePhase === "locked" ? "transfer" : "inspect";
+    return mountedTarget?.[0] === "default" && (sourcePhase === "locked" || submissionPending) ? "transfer" : "inspect";
   }
   function isComposerModelWriteAllowed(target) {
     return target?.[0] === "default";
   }
+  function shouldApplyDraftAgentCarrier(agent, model) {
+    return agent === "codex" || model !== void 0;
+  }
   function applyComposerModelWrite(target, write) {
     if (target?.[0] === "conversation") return true;
     if (!isComposerModelWriteAllowed(target)) return false;
@@ -21159,6 +21506,8 @@ ${error51.stderrTail}`] : []
     let modelControl = null;
     let usageNotificationDispose = null;
     const localAgentForSidebarThread = (input) => {
+      const mountedHostId = modelControl?.currentHostId?.() ?? "local";
+      if (input.hostId !== mountedHostId) return null;
       for (const mounted of mountedByComposer.values()) {
         const target = mounted.modelTarget;
         if (target?.[0] === "default" && input.draftId !== null && target[1] === input.draftId) {
@@ -21171,7 +21520,7 @@ ${error51.stderrTail}`] : []
       return null;
     };
     const sidebarAgentIcons = installRendererSidebarAgentIcons({
-      getClient: () => modelControl,
+      getClient: (hostId) => modelClientForHost(hostId),
       getLocalAgent: localAgentForSidebarThread
     });
     let connectionDiagnostics = null;
@@ -21185,23 +21534,36 @@ ${error51.stderrTail}`] : []
       modelUpdates: 0,
       hook: null
     };
-    let harnessAvailability = Object.fromEntries(
-      externalAgents.map((agent) => [agent, "checking"])
-    );
-    const harnessAvailabilityErrors = {
-      pi: void 0,
-      "claude-code": void 0,
-      "deepseek-harness": void 0,
-      grok: void 0
+    const createHostHarnessAvailabilityState = () => ({
+      availability: Object.fromEntries(
+        externalAgents.map((agent) => [agent, "checking"])
+      ),
+      errors: {
+        pi: void 0,
+        "claude-code": void 0,
+        "deepseek-harness": void 0,
+        grok: void 0
+      },
+      requestGeneration: 0,
+      request: null,
+      retryTimer: null,
+      retryAttempt: 0
+    });
+    const harnessAvailabilityByHost = /* @__PURE__ */ new Map();
+    const hostHarnessAvailabilityState = (hostId) => {
+      let state = harnessAvailabilityByHost.get(hostId);
+      if (!state) {
+        state = createHostHarnessAvailabilityState();
+        harnessAvailabilityByHost.set(hostId, state);
+      }
+      return state;
     };
+    let activeAvailabilityHostId = "local";
+    const activeHarnessAvailabilityState = () => hostHarnessAvailabilityState(activeAvailabilityHostId);
     const connectionListeners = /* @__PURE__ */ new Set();
     const publishConnectionStatus = () => {
       for (const listener of connectionListeners) listener();
     };
-    let availabilityRequestGeneration = 0;
-    let availabilityRequest = null;
-    let availabilityRetryTimer = null;
-    let availabilityRetryAttempt = 0;
     const availabilityRetryDelays = [500, 1e3, 2e3, 4e3, 8e3];
     const usageRefreshTimers = /* @__PURE__ */ new Map();
     const usageRefreshAttempts = /* @__PURE__ */ new Map();
@@ -21217,7 +21579,8 @@ ${error51.stderrTail}`] : []
           writeNewThreadExternalConfigurationPreference(
             state.agent,
             model,
-            controller.thinkingOptionForAgent(composer, state.agent)
+            controller.thinkingOptionForAgent(composer, state.agent),
+            controller.permissionModeForAgent(composer, state.agent)
           );
         }
       }
@@ -21237,7 +21600,7 @@ ${error51.stderrTail}`] : []
         controller.get(mounted.composer),
         adapterStatus.state,
         controller.isSwitching(mounted.composer) || isOwnershipSubmissionBlocked(mounted.ownershipStatus),
-        harnessAvailability,
+        activeHarnessAvailabilityState().availability,
         mounted.modelView,
         mounted.permissionModeView,
         mounted.usage,
@@ -21426,7 +21789,8 @@ ${error51.stderrTail}`] : []
       const resolution = lateConversationTargetResolution(
         mounted.modelTarget,
         currentTarget,
-        controller.get(mounted.composer).phase
+        controller.get(mounted.composer).phase,
+        controller.isSubmissionPending(mounted.composer)
       );
       if (resolution === "none") return false;
       const previousTarget = mounted.modelTarget;
@@ -21463,7 +21827,7 @@ ${error51.stderrTail}`] : []
       const state = controller.get(mounted.composer);
       if (state.agent === "codex") return;
       const agent = state.agent;
-      const availability = harnessAvailability[agent];
+      const availability = activeHarnessAvailabilityState().availability[agent];
       if (availability !== "ready") {
         mounted.modelView = {
           status: adapterStatus.state !== "ready" || availability === "checking" ? "waitingForAdapter" : "error",
@@ -21493,6 +21857,16 @@ ${error51.stderrTail}`] : []
         }
         if (inspection.status !== "ready") throw new Error(inspection.error.message);
         const current = controller.get(mounted.composer);
+        const previousModel = controller.modelForAgent(mounted.composer, agent);
+        const previousModelAvailable = previousModel !== void 0 && inspection.catalog.models.some((model) => model.ref.id === previousModel.id);
+        if (current.phase === "locked" && previousModel && !previousModelAvailable) {
+          throw new Error("Existing Thread Model is absent from the current Catalog");
+        }
+        const preferredConfiguration = current.phase === "draft" && !previousModelAvailable ? readNewThreadExternalConfigurationPreference(
+          agent,
+          inspection.catalog,
+          inspection.permissionModes
+        ) : void 0;
         const previousPermissionModeId = controller.permissionModeForAgent(mounted.composer, agent);
         let selectedPermissionModeId;
         if (inspection.capabilities.configuration.selectPermissionMode) {
@@ -21502,7 +21876,7 @@ ${error51.stderrTail}`] : []
           }
           mounted.permissionModeView = { status: "loading", catalog: permissionModes };
           const effectivePermissionModeId = current.phase === "locked" ? mounted.threadConfiguration?.effectivePermissionModeId : void 0;
-          const preferredPermissionModeId = agent === "claude-code" ? readClaudePermissionModePreference(permissionModes) : void 0;
+          const preferredPermissionModeId = preferredConfiguration?.permissionModeId ?? (agent === "claude-code" ? readClaudePermissionModePreference(permissionModes) : void 0);
           selectedPermissionModeId = draftPermissionMode(
             permissionModes,
             effectivePermissionModeId ?? previousPermissionModeId ?? preferredPermissionModeId
@@ -21531,12 +21905,6 @@ ${error51.stderrTail}`] : []
           }
           return;
         }
-        const previousModel = controller.modelForAgent(mounted.composer, agent);
-        const previousModelAvailable = previousModel !== void 0 && inspection.catalog.models.some((model) => model.ref.id === previousModel.id);
-        if (current.phase === "locked" && previousModel && !previousModelAvailable) {
-          throw new Error("Existing Thread Model is absent from the current Catalog");
-        }
-        const preferredConfiguration = current.phase === "draft" && !previousModelAvailable ? readNewThreadExternalConfigurationPreference(agent, inspection.catalog) : void 0;
         const selected = previousModelAvailable ? previousModel : preferredConfiguration?.model ?? inspection.catalog.defaultModel;
         if (!selected) throw new Error("External Harness did not report its default Model");
         const effectiveCatalog = current.phase === "locked" && mounted.threadConfiguration ? catalogWithConfigurationState(inspection.catalog, selected, mounted.threadConfiguration) : inspection.catalog;
@@ -21616,6 +21984,7 @@ ${error51.stderrTail}`] : []
       }
     };
     const selectExternalModel = async (mounted, modelId) => {
+      controller.clearPendingSubmission(mounted.composer);
       const current = controller.get(mounted.composer);
       if (current.agent === "codex") return;
       const agent = current.agent;
@@ -21687,13 +22056,13 @@ ${error51.stderrTail}`] : []
           effectiveThinkingOptionId = supportsThinkingSelection ? selectableThinkingOptionId(state) : void 0;
           effectiveCatalog = supportsThinkingSelection ? catalogWithConfigurationState(catalog, effectiveModel, state) : catalog;
           resolvedModelLabel = state.resolvedModelLabel;
-          const effectivePermissionModeId = state.effectivePermissionModeId ?? previousPermissionModeId;
+          const effectivePermissionModeId2 = state.effectivePermissionModeId ?? previousPermissionModeId;
           if (!applyExternalConfiguration(
             mounted,
             agent,
             effectiveModel,
             effectiveThinkingOptionId,
-            effectivePermissionModeId
+            effectivePermissionModeId2
           )) {
             throw new Error("Confirmed external Model could not be applied to the Composer");
           }
@@ -21702,11 +22071,18 @@ ${error51.stderrTail}`] : []
         if (!isCurrentModelRequest(mounted, generation)) return;
         controller.setExternalModel(mounted.composer, agent, effectiveModel);
         controller.setExternalThinkingOption(mounted.composer, agent, effectiveThinkingOptionId);
-        writeNewThreadExternalConfigurationPreference(
-          agent,
-          effectiveModel,
-          effectiveThinkingOptionId
-        );
+        const effectivePermissionModeId = mounted.threadConfiguration?.effectivePermissionModeId ?? previousPermissionModeId;
+        if (effectivePermissionModeId) {
+          controller.setExternalPermissionMode(mounted.composer, agent, effectivePermissionModeId);
+        }
+        if (shouldPersistNewThreadConfigurationSelection(current.phase)) {
+          writeNewThreadExternalConfigurationPreference(
+            agent,
+            effectiveModel,
+            effectiveThinkingOptionId,
+            effectivePermissionModeId
+          );
+        }
         mounted.modelView = {
           status: "ready",
           catalog: effectiveCatalog,
@@ -21739,6 +22115,7 @@ ${error51.stderrTail}`] : []
       }
     };
     const selectPermissionMode = async (mounted, permissionModeId) => {
+      controller.clearPendingSubmission(mounted.composer);
       const current = controller.get(mounted.composer);
       if (current.agent === "codex") return;
       const agent = current.agent;
@@ -21747,9 +22124,6 @@ ${error51.stderrTail}`] : []
       const model = controller.modelForAgent(mounted.composer, agent);
       if (!catalog || !selectedPermissionModeId || !model || !modelControl) return;
       const previousPermissionModeId = controller.permissionModeForAgent(mounted.composer, agent);
-      if (agent === "claude-code") {
-        writeClaudePermissionModePreference(selectedPermissionModeId);
-      }
       const thinkingOptionId = controller.thinkingOptionForAgent(mounted.composer, agent);
       const generation = controller.beginModelRequest(mounted.composer);
       mounted.permissionModeView = {
@@ -21814,6 +22188,17 @@ ${error51.stderrTail}`] : []
         }
         if (!isCurrentModelRequest(mounted, generation)) return;
         controller.setExternalPermissionMode(mounted.composer, agent, effectivePermissionModeId);
+        if (shouldPersistNewThreadConfigurationSelection(current.phase)) {
+          writeNewThreadExternalConfigurationPreference(
+            agent,
+            model,
+            thinkingOptionId,
+            effectivePermissionModeId
+          );
+          if (agent === "claude-code") {
+            writeClaudePermissionModePreference(effectivePermissionModeId);
+          }
+        }
         mounted.permissionModeView = {
           status: "ready",
           catalog,
@@ -21841,6 +22226,7 @@ ${error51.stderrTail}`] : []
       }
     };
     const selectExternalThinking = async (mounted, thinkingOptionId) => {
+      controller.clearPendingSubmission(mounted.composer);
       const current = controller.get(mounted.composer);
       if (current.agent === "codex") return;
       const agent = current.agent;
@@ -21919,7 +22305,18 @@ ${error51.stderrTail}`] : []
         }
         if (!isCurrentModelRequest(mounted, generation)) return;
         controller.setExternalThinkingOption(mounted.composer, agent, effectiveThinkingOptionId);
-        writeNewThreadExternalConfigurationPreference(agent, model, effectiveThinkingOptionId);
+        const effectivePermissionModeId = mounted.threadConfiguration?.effectivePermissionModeId ?? permissionModeId;
+        if (effectivePermissionModeId) {
+          controller.setExternalPermissionMode(mounted.composer, agent, effectivePermissionModeId);
+        }
+        if (shouldPersistNewThreadConfigurationSelection(current.phase)) {
+          writeNewThreadExternalConfigurationPreference(
+            agent,
+            model,
+            effectiveThinkingOptionId,
+            effectivePermissionModeId
+          );
+        }
         mounted.modelView = {
           status: "ready",
           catalog: effectiveCatalog,
@@ -21943,14 +22340,19 @@ ${error51.stderrTail}`] : []
       }
     };
     const switchComposerAgent = async (mounted, agent) => {
-      if (agent !== "codex" && harnessAvailability[agent] !== "ready") return false;
+      if (agent !== "codex" && activeHarnessAvailabilityState().availability[agent] !== "ready") {
+        return false;
+      }
+      controller.clearPendingSubmission(mounted.composer);
       const composerId = controller.get(mounted.composer).composerId;
       controller.invalidateModelRequests(mounted.composer);
       const switching = controller.switchAgent(mounted.composer, agent, {
         applyAgent(nextAgent) {
+          const model = controller.modelForAgent(mounted.composer, nextAgent);
+          if (!shouldApplyDraftAgentCarrier(nextAgent, model)) return true;
           return applyAdapterAgent?.(
             nextAgent,
-            controller.modelForAgent(mounted.composer, nextAgent),
+            model,
             nextAgent !== "codex" ? controller.thinkingOptionForAgent(mounted.composer, nextAgent) : void 0,
             nextAgent !== "codex" ? controller.permissionModeForAgent(mounted.composer, nextAgent) : void 0,
             mounted.composer
@@ -21987,53 +22389,67 @@ ${error51.stderrTail}`] : []
       const url2 = RENDERER_AGENT_INSTALL_URLS[agent];
       window.open(url2, "_blank", "noopener,noreferrer");
     };
-    const resetHarnessAvailabilityRetry = () => {
-      if (availabilityRetryTimer !== null) {
-        window.clearTimeout(availabilityRetryTimer);
-        availabilityRetryTimer = null;
+    function resetHarnessAvailabilityRetry(hostId) {
+      const state = hostHarnessAvailabilityState(hostId);
+      if (state.retryTimer !== null) {
+        window.clearTimeout(state.retryTimer);
+        state.retryTimer = null;
       }
-      availabilityRetryAttempt = 0;
-    };
-    const scheduleHarnessAvailabilityRetry = () => {
-      if (disposed || availabilityRetryTimer !== null || availabilityRetryAttempt >= availabilityRetryDelays.length) {
+      state.retryAttempt = 0;
+    }
+    function scheduleHarnessAvailabilityRetry(hostId) {
+      const state = hostHarnessAvailabilityState(hostId);
+      if (disposed || state.retryTimer !== null || state.retryAttempt >= availabilityRetryDelays.length) {
         return;
       }
-      const delay = availabilityRetryDelays[availabilityRetryAttempt];
-      availabilityRetryAttempt += 1;
-      availabilityRetryTimer = window.setTimeout(() => {
-        availabilityRetryTimer = null;
-        void refreshHarnessAvailability(true, true);
+      const delay = availabilityRetryDelays[state.retryAttempt];
+      state.retryAttempt += 1;
+      state.retryTimer = window.setTimeout(() => {
+        state.retryTimer = null;
+        void refreshHarnessAvailabilityForHost(hostId, true, true);
       }, delay);
-    };
-    const refreshHarnessAvailability = (refresh = false, retry = false) => {
-      if (!retry) resetHarnessAvailabilityRetry();
-      if (!modelControl) return Promise.resolve();
-      const client = modelControl;
-      if (availabilityRequest?.client === client) return availabilityRequest.promise;
-      harnessAvailability = Object.fromEntries(
+    }
+    function modelClientForHost(hostId) {
+      if (!modelControl) return null;
+      const selected = modelControl.clientForHost?.(hostId);
+      if (selected) return selected;
+      const currentHostId = modelControl.currentHostId?.() ?? "local";
+      return currentHostId === hostId ? modelControl : null;
+    }
+    function refreshHarnessAvailabilityForHost(hostId, refresh = false, retry = false) {
+      const state = hostHarnessAvailabilityState(hostId);
+      if (!retry) resetHarnessAvailabilityRetry(hostId);
+      const client = modelClientForHost(hostId);
+      if (!client) {
+        scheduleHarnessAvailabilityRetry(hostId);
+        return Promise.resolve();
+      }
+      if (state.request?.client === client) return state.request.promise;
+      state.availability = Object.fromEntries(
         externalAgents.map((agent) => [
           agent,
-          harnessAvailability[agent] === "ready" ? "ready" : "checking"
+          state.availability[agent] === "ready" ? "ready" : "checking"
         ])
       );
-      publishConnectionStatus();
-      for (const mounted of mountedByComposer.values()) renderMounted(mounted);
-      const generation = ++availabilityRequestGeneration;
+      if (hostId === activeAvailabilityHostId) {
+        publishConnectionStatus();
+        for (const mounted of mountedByComposer.values()) renderMounted(mounted);
+      }
+      const generation = ++state.requestGeneration;
       const promise2 = (async () => {
         await Promise.all(
           externalAgents.map(async (agent) => {
             let status = "error";
+            let nextError;
             try {
               const inspection = await client.inspectHarness({
                 harnessId: externalHarnessIds[agent],
                 refresh
               });
               status = inspection.status === "ready" ? "ready" : inspection.status;
-              if (inspection.status === "ready") {
-                harnessAvailabilityErrors[agent] = void 0;
-              } else {
+              if (inspection.status !== "ready") {
                 const error51 = inspection.error;
-                harnessAvailabilityErrors[agent] = {
+                nextError = {
                   code: error51.code,
                   message: error51.message,
                   retryable: error51.retryable,
@@ -22045,24 +22461,29 @@ ${error51.stderrTail}`] : []
               }
             } catch (error51) {
               status = "error";
-              harnessAvailabilityErrors[agent] = {
+              nextError = {
                 code: "internalError",
                 message: error51 instanceof Error ? error51.message : String(error51),
                 retryable: true,
                 stage: "request"
               };
             }
-            if (generation !== availabilityRequestGeneration || disposed) return;
-            harnessAvailability = { ...harnessAvailability, [agent]: status };
+            if (generation !== state.requestGeneration || disposed) return;
+            state.errors[agent] = nextError;
+            state.availability = { ...state.availability, [agent]: status };
+            if (hostId !== activeAvailabilityHostId) {
+              publishConnectionStatus();
+              return;
+            }
             for (const mounted of mountedByComposer.values()) {
-              const state = controller.get(mounted.composer);
-              if (adapterStatus.state === "ready" && state.phase === "draft" && state.agent === agent && status !== "ready") {
+              const composerState = controller.get(mounted.composer);
+              if (adapterStatus.state === "ready" && composerState.phase === "draft" && composerState.agent === agent && status !== "ready") {
                 await switchComposerAgent(mounted, "codex");
               }
             }
             for (const mounted of mountedByComposer.values()) {
-              const state = controller.get(mounted.composer);
-              if (state.agent === agent) {
+              const composerState = controller.get(mounted.composer);
+              if (composerState.agent === agent) {
                 void loadExternalCatalog(mounted);
               }
               renderMounted(mounted);
@@ -22070,37 +22491,66 @@ ${error51.stderrTail}`] : []
             publishConnectionStatus();
           })
         );
-        if (externalAgents.every((agent) => harnessAvailability[agent] === "ready")) {
-          resetHarnessAvailabilityRetry();
+        if (generation !== state.requestGeneration || disposed) return;
+        if (externalAgents.every((agent) => state.availability[agent] === "ready")) {
+          resetHarnessAvailabilityRetry(hostId);
         } else {
-          scheduleHarnessAvailabilityRetry();
+          scheduleHarnessAvailabilityRetry(hostId);
         }
       })();
       const request = { client, promise: promise2 };
-      availabilityRequest = request;
+      state.request = request;
       void promise2.then(
         () => {
-          if (availabilityRequest === request) availabilityRequest = null;
+          if (state.request === request) state.request = null;
         },
         () => {
-          if (availabilityRequest === request) availabilityRequest = null;
+          if (state.request === request) state.request = null;
         }
       );
       return promise2;
+    }
+    function reconcileHarnessAvailabilityHost() {
+      const reportedHostId = modelControl?.currentHostId?.();
+      const hostId = reportedHostId ?? (modelControl?.currentHostId ? activeAvailabilityHostId : "local");
+      if (hostId === activeAvailabilityHostId) return;
+      activeAvailabilityHostId = hostId;
+      hostHarnessAvailabilityState(hostId);
+      publishConnectionStatus();
+      for (const mounted of mountedByComposer.values()) renderMounted(mounted);
+      void refreshHarnessAvailabilityForHost(hostId);
+    }
+    const refreshHarnessAvailability = (refresh = false) => {
+      reconcileHarnessAvailabilityHost();
+      return refreshHarnessAvailabilityForHost(activeAvailabilityHostId, refresh);
     };
     connectionDiagnostics = {
       snapshot() {
+        const hostIds = [
+          "local",
+          ...[...harnessAvailabilityByHost.keys()].filter((hostId) => hostId !== "local").sort()
+        ];
         return {
           adapter: { ...adapterStatus },
-          agents: externalAgents.map((agent) => ({
-            agent,
-            availability: harnessAvailability[agent] ?? "checking",
-            error: harnessAvailabilityErrors[agent] ?? null
-          }))
+          hosts: hostIds.map((hostId) => {
+            const state = hostHarnessAvailabilityState(hostId);
+            return {
+              hostId,
+              active: hostId === activeAvailabilityHostId,
+              agents: externalAgents.map((agent) => ({
+                agent,
+                availability: state.availability[agent] ?? "checking",
+                error: state.errors[agent] ?? null
+              }))
+            };
+          })
         };
       },
       refresh() {
-        return refreshHarnessAvailability(true);
+        for (const hostId of harnessAvailabilityByHost.keys()) {
+          void refreshHarnessAvailabilityForHost(hostId, true);
+        }
+        return Promise.resolve();
       },
       subscribe(listener) {
         connectionListeners.add(listener);
@@ -22169,13 +22619,16 @@ ${error51.stderrTail}`] : []
       };
       mountedByComposer.set(composer, mounted);
       if (isComposerModelWriteAllowed(modelTarget)) {
-        applyAdapterAgent?.(
-          state.agent,
-          controller.modelForAgent(composer, state.agent),
-          state.agent !== "codex" ? controller.thinkingOptionForAgent(composer, state.agent) : void 0,
-          state.agent !== "codex" ? controller.permissionModeForAgent(composer, state.agent) : void 0,
-          composer
-        );
+        const model = controller.modelForAgent(composer, state.agent);
+        if (shouldApplyDraftAgentCarrier(state.agent, model)) {
+          applyAdapterAgent?.(
+            state.agent,
+            model,
+            state.agent !== "codex" ? controller.thinkingOptionForAgent(composer, state.agent) : void 0,
+            state.agent !== "codex" ? controller.permissionModeForAgent(composer, state.agent) : void 0,
+            composer
+          );
+        }
       }
       renderMounted(mounted);
       sidebarAgentIcons.refresh();
@@ -22200,7 +22653,8 @@ ${error51.stderrTail}`] : []
         if (!shouldTransferComposerState(
           replacement.sourceModelTarget,
           replacementTarget,
-          sourceState.phase
+          sourceState.phase,
+          controller.isSubmissionPending(replacement.source.composer)
         ) || !controller.transfer(replacement.source.composer, target, replacementTarget)) {
           pendingReplacements.delete(target);
         }
@@ -22227,6 +22681,16 @@ ${error51.stderrTail}`] : []
         const composer = composerForEditor(editor);
         if (composer) mount(composer);
       }
+      const localAvailability = hostHarnessAvailabilityState("local").availability;
+      if (externalAgents.some((agent) => localAvailability[agent] === "checking")) {
+        void refreshHarnessAvailabilityForHost("local");
+      }
+      reconcileHarnessAvailabilityHost();
+      if (externalAgents.some(
+        (agent) => activeHarnessAvailabilityState().availability[agent] === "checking"
+      )) {
+        void refreshHarnessAvailability();
+      }
       pendingReplacements.clear();
     };
     const scheduleScan = (refreshTargets = false) => {
@@ -22282,11 +22746,13 @@ ${error51.stderrTail}`] : []
         return state.phase === "locked" && mounted.ownershipStatus === "ready";
       }
       if (!mounted || !isComposerModelWriteAllowed(mounted.modelTarget)) return false;
+      const model = controller.modelForAgent(composer, state.agent);
+      if (!shouldApplyDraftAgentCarrier(state.agent, model)) return false;
       return applyComposerModelWrite(
         mounted.modelTarget,
         () => applyAdapterAgent?.(
           state.agent,
-          controller.modelForAgent(composer, state.agent),
+          model,
           state.agent !== "codex" ? controller.thinkingOptionForAgent(composer, state.agent) : void 0,
           state.agent !== "codex" ? controller.permissionModeForAgent(composer, state.agent) : void 0,
           composer
@@ -22308,7 +22774,7 @@ ${error51.stderrTail}`] : []
       if (!isExternalConfigurationReady(mounted)) return false;
       if (current.phase === "locked") return true;
       if (!applyComposerAgent(composer)) return false;
-      controller.lock(composer);
+      controller.markSubmissionPending(composer);
       renderMounted(mounted);
       return true;
     };
@@ -22321,6 +22787,7 @@ ${error51.stderrTail}`] : []
     const onBeforeInput = (event) => {
       const composer = composerForTarget(event.target);
       if (!composer) return;
+      controller.clearPendingSubmission(composer);
       const mounted = mountedByComposer.get(composer);
       if (mounted && isOwnershipSubmissionBlocked(mounted.ownershipStatus)) return;
       if (controller.isSwitching(composer) || !applyComposerAgent(composer)) blockEvent(event);
@@ -22378,10 +22845,15 @@ ${error51.stderrTail}`] : []
       transferReplacedComposers(mutations);
       scheduleScan(mutations.some(mutationMayChangeComposerTarget));
     });
+    const onHostRouteChange = () => {
+      reconcileHarnessAvailabilityHost();
+      void refreshHarnessAvailability();
+    };
     const onAdapterStatus = () => {
       publishConnectionStatus();
       if (adapterStatus.state === "ready") {
         sidebarAgentIcons.refresh();
+        void refreshHarnessAvailabilityForHost("local");
         void refreshHarnessAvailability();
         for (const mounted of mountedByComposer.values()) {
           if (mounted.modelView.status === "waitingForAdapter" && mounted.composer.isConnected && applyComposerAgent(mounted.composer)) {
@@ -22403,10 +22875,17 @@ ${error51.stderrTail}`] : []
     document.addEventListener("keydown", onKeyDown, true);
     document.addEventListener("click", onClick, true);
     const onWindowFocus = () => {
-      if (externalAgents.some((agent) => harnessAvailability[agent] !== "ready")) {
+      reconcileHarnessAvailabilityHost();
+      const local = hostHarnessAvailabilityState("local");
+      if (externalAgents.some((agent) => local.availability[agent] !== "ready")) {
+        void refreshHarnessAvailabilityForHost("local", true);
+      }
+      const active = activeHarnessAvailabilityState();
+      if (externalAgents.some((agent) => active.availability[agent] !== "ready")) {
         void refreshHarnessAvailability(true);
       }
     };
+    window.addEventListener("codexhost:draft-prewarm-policy-changed", onHostRouteChange);
     window.addEventListener("codexhost:renderer-adapter-status", onAdapterStatus);
     window.addEventListener("focus", onWindowFocus);
     const connectedComposers = () => [...mountedByComposer.values()].filter(
@@ -22423,7 +22902,7 @@ ${error51.stderrTail}`] : []
           version: 2,
           mountedComposers: selections.length,
           enabledAgents: [...enabledAgents],
-          availability: { ...harnessAvailability },
+          availability: { ...activeHarnessAvailabilityState().availability },
           selections,
           adapter: { ...adapterStatus }
         };
@@ -22470,8 +22949,16 @@ ${error51.stderrTail}`] : []
           } catch {
           }
         });
+        for (const state of harnessAvailabilityByHost.values()) {
+          state.requestGeneration += 1;
+          state.request = null;
+          if (state.retryTimer !== null) window.clearTimeout(state.retryTimer);
+        }
+        harnessAvailabilityByHost.clear();
+        activeAvailabilityHostId = "local";
         sidebarAgentIcons.refresh();
-        void refreshHarnessAvailability();
+        void refreshHarnessAvailabilityForHost("local");
+        reconcileHarnessAvailabilityHost();
         const connected = connectedComposers();
         if (connected.length === 1) {
           const mounted = connected[0];
@@ -22504,9 +22991,14 @@ ${error51.stderrTail}`] : []
         document.removeEventListener("submit", onSubmit, true);
         document.removeEventListener("keydown", onKeyDown, true);
         document.removeEventListener("click", onClick, true);
+        window.removeEventListener("codexhost:draft-prewarm-policy-changed", onHostRouteChange);
         window.removeEventListener("codexhost:renderer-adapter-status", onAdapterStatus);
         window.removeEventListener("focus", onWindowFocus);
-        resetHarnessAvailabilityRetry();
+        for (const state of harnessAvailabilityByHost.values()) {
+          state.requestGeneration += 1;
+          if (state.retryTimer !== null) window.clearTimeout(state.retryTimer);
+        }
+        harnessAvailabilityByHost.clear();
         for (const timer of usageRefreshTimers.values()) window.clearTimeout(timer);
         usageRefreshTimers.clear();
         for (const mounted of mountedByComposer.values()) {