@xingjisoft/neutrino 0.4.0 → 0.4.1

package/web/app.js

@@ -147,6 +147,7 @@ function showGate(message = "") {
   closeStream();
   setStatus("locked", "offline");
   document.getElementById("settings-dialog").close();
+  document.getElementById("background-dialog")?.close?.();
 
   // A modal dialog stays above streaming repaints and traps keyboard focus.
   const gate = document.createElement("dialog");
@@ -184,6 +185,78 @@ function showGate(message = "") {
   gate.showModal();
 }
 
+// -------------------------------------------------------- background invite
+//
+// Accepting changes the running console's lifetime immediately, including
+// conversations already in flight. A resident console never offers the prompt.
+
+let backgroundPromptAnswered = false;
+
+function showBackgroundPrompt() {
+  if (backgroundPromptAnswered || !el.backgroundDialog?.showModal) return;
+  if (el.backgroundDialog.open) return;
+  if (el.backgroundFeedback) {
+    el.backgroundFeedback.textContent = "";
+    el.backgroundFeedback.classList.remove("error");
+  }
+  try {
+    el.backgroundDialog.showModal();
+  } catch {
+    // An embedder without dialog support still gets the setting in Settings.
+  }
+}
+
+function maybePromptBackground(config) {
+  if (!config?.settings?.background_prompt) return;
+  if (config.settings.background === true) return;
+  showBackgroundPrompt();
+}
+
+async function answerBackgroundPrompt(enable) {
+  if (backgroundPromptAnswered) return;
+  backgroundPromptAnswered = true;
+  const feedback = el.backgroundFeedback;
+  const cancel = el.backgroundCancel;
+  const confirm = el.backgroundEnable;
+  if (cancel) cancel.disabled = true;
+  if (confirm) confirm.disabled = true;
+  if (feedback) {
+    feedback.textContent = "";
+    feedback.classList.remove("error");
+  }
+  try {
+    if (enable) {
+      const response = await apiFetch("/api/settings", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ settings: { background: true } }),
+      });
+      const body = await response.json();
+      if (!response.ok) throw new Error(body.error || `HTTP ${response.status}`);
+      if (body.settings?.background_running !== true) {
+        throw new Error(tr("Background residency could not be applied. Restart the console and try again."));
+      }
+      try { await preferences.load(); } catch { /* Residency is already active. */ }
+    } else {
+      // Consume the invitation for this CLI run. A failed dismissal is
+      // harmless: the prompt simply returns on the next page load.
+      try {
+        await apiFetch("/api/background/dismiss", { method: "POST" });
+      } catch { /* Keep the close local. */ }
+    }
+    el.backgroundDialog?.close?.();
+  } catch (error) {
+    backgroundPromptAnswered = false;
+    if (feedback) {
+      feedback.textContent = tr(error.message);
+      feedback.classList.add("error");
+    }
+  } finally {
+    if (cancel) cancel.disabled = false;
+    if (confirm) confirm.disabled = false;
+  }
+}
+
 const el = {
   app: document.getElementById("app"),
   back: document.getElementById("back-to-menu"),
@@ -195,6 +268,7 @@ const el = {
   proTip: document.getElementById("pro-tip"),
   proTipClose: document.getElementById("pro-tip-close"),
   proExit: document.getElementById("pro-exit"),
+  header: document.getElementById("main-header"),
   title: document.getElementById("session-title"),
   sub: document.getElementById("session-sub"),
   controls: document.getElementById("controls"),
@@ -252,8 +326,28 @@ const el = {
   agentsList: document.getElementById("agents-list"),
   agentsFeedback: document.getElementById("agents-feedback"),
   agentsCwd: document.getElementById("agents-cwd"),
+  agentActions: document.getElementById("agent-actions"),
+  agentMigrate: document.getElementById("agent-migrate"),
+  agentMigrateFeedback: document.getElementById("agent-migrate-feedback"),
+  backgroundDialog: document.getElementById("background-dialog"),
+  backgroundFeedback: document.getElementById("background-feedback"),
+  backgroundCancel: document.getElementById("background-cancel"),
+  backgroundEnable: document.getElementById("background-enable"),
 };
 
+if (el.backgroundCancel) {
+  el.backgroundCancel.addEventListener("click", () => { void answerBackgroundPrompt(false); });
+}
+if (el.backgroundEnable) {
+  el.backgroundEnable.addEventListener("click", () => { void answerBackgroundPrompt(true); });
+}
+if (el.backgroundDialog) {
+  el.backgroundDialog.addEventListener("cancel", (event) => {
+    event.preventDefault();
+    void answerBackgroundPrompt(false);
+  });
+}
+
 const state = {
   overview: null,
   // { kind: "live", key } | { kind: "file", id } | { kind: "new", cwd } |
@@ -272,6 +366,7 @@ const state = {
   fileData: null,
   // Last loaded read-only transcript from another agent.
   agentData: null,
+  agentMigration: null,
   // { key, path } | null — the working directory the sidebar is scoped to.
   workspace: storedWorkspace(),
   // Plan / usage card visibility and the plan it was opened for.
@@ -746,12 +841,14 @@ function openStream(key) {
 
   source.onopen = () => setStatus("live", "live");
   source.onerror = () => {
-    // EventSource retries automatically; just surface the state.
+    // EventSource retries automatically; wait for a fresh snapshot to flash.
+    el.header?.classList.remove("is-thinking");
     setStatus("reconnecting…", "offline");
   };
 }
 
 function closeStream() {
+  el.header?.classList.remove("is-thinking");
   if (state.eventSource) {
     state.eventSource.close();
     state.eventSource = null;
@@ -865,17 +962,37 @@ async function continueSession(id, selection = preferences.selectionForFile(id))
 
 function setComposerMode(mode) {
   state.composerMode = mode;
+  el.agentActions.classList.add("hidden");
   el.composer.classList.remove("hidden");
   el.input.placeholder = mode === "resume"
     ? tr("Continue this conversation…")
     : mode === "new"
       ? tr("Message Neutrino in this folder…")
       : tr("Message Neutrino…");
+  renderComposerAction();
+}
+
+function canPauseFromComposer() {
+  const selection = state.selection;
+  const snapshot = state.snapshot;
+  return Boolean(selection?.kind === "live" && snapshot?.key === selection.key
+    && snapshot.busy && !snapshot.paused && !el.input.value.trim());
+}
+
+function renderComposerAction() {
+  const pause = canPauseFromComposer();
+  const label = pause ? "Pause" : "Send message";
+  el.send.classList.toggle("is-pause", pause);
+  el.send.setAttribute("data-i18n-title", label);
+  el.send.setAttribute("data-i18n-aria-label", label);
+  el.send.title = tr(label);
+  el.send.setAttribute("aria-label", tr(label));
 }
 
 function hideComposer() {
   preferences.clear();
   el.composer.classList.add("hidden");
+  el.agentActions.classList.add("hidden");
   renderApproval(null);
 }
 
@@ -1027,6 +1144,8 @@ function decideApproval(approved) {
 function renderLive() {
   const snapshot = state.snapshot;
   if (!snapshot) return;
+  renderComposerAction();
+  el.header?.classList.toggle("is-thinking", Boolean(snapshot.busy && !snapshot.paused && !snapshot.approval));
   state.fileData = null;
   state.agentData = null;
   el.title.textContent = snapshot.title || tr("New conversation");
@@ -1393,6 +1512,11 @@ async function postAction(key, action, body) {
   }
 }
 
+function activateComposer() {
+  if (canPauseFromComposer()) return postAction(state.selection.key, "pause");
+  return sendMessage();
+}
+
 async function sendMessage() {
   const selection = state.selection;
   if (!selection) return;
@@ -1444,6 +1568,7 @@ async function sendMessage() {
 function autosize() {
   el.input.style.height = "auto";
   el.input.style.height = `${Math.min(el.input.scrollHeight, 220)}px`;
+  renderComposerAction();
 }
 
 // ------------------------------------------------------- workspaces & dialogs
@@ -2192,7 +2317,7 @@ function renderAgentList(groups) {
         "</span>";
       item.addEventListener("click", () => {
         el.agentsDialog.close();
-        void selectAgentSession(group.id, session.id, session.title || "");
+        void selectAgentSession(group.id, session.id, session.title || "", group.cwd);
       });
       section.appendChild(item);
     }
@@ -2211,7 +2336,7 @@ async function openAgentsDialog() {
       const response = await apiFetch(`/api/agents/${agent.id}/sessions?cwd=${encodeURIComponent(cwd)}`, { cache: "no-store" });
       const data = await response.json().catch(() => ({}));
       if (!response.ok) throw new Error(apiError(data, `HTTP ${response.status}`));
-      return { ...agent, sessions: Array.isArray(data.sessions) ? data.sessions : [] };
+      return { ...agent, cwd: data.cwd || cwd, sessions: Array.isArray(data.sessions) ? data.sessions : [] };
     }));
     el.agentsFeedback.textContent = "";
     renderAgentList(groups);
@@ -2238,11 +2363,53 @@ function renderAgentView(data) {
   renderApproval(null);
   renderPlanCard(null);
   hideComposer();
+  renderAgentMigration(data);
 }
 
-async function selectAgentSession(agent, id, title) {
+function renderAgentMigration(data) {
+  el.agentActions.classList.remove("hidden");
+  el.agentMigrate.disabled = Boolean(state.agentMigration) || !data.cwd || !data.messages?.length;
+  el.agentMigrate.textContent = state.agentMigration === state.selection ? tr("Migrating…") : tr("Migrate session");
+}
+
+async function migrateSelectedAgentSession() {
+  const selection = state.selection;
+  const source = state.agentData;
+  if (selection?.kind !== "agent" || !source?.cwd || !source.messages?.length || state.agentMigration) return;
+  state.agentMigration = selection;
+  el.agentMigrateFeedback.textContent = "";
+  renderAgentMigration(source);
+  try {
+    const payload = { cwd: source.cwd };
+    if (PRO_MODE) payload.pro_preset = currentProPreset();
+    const response = await apiFetch(`/api/agents/${encodeURIComponent(selection.agent)}/sessions/${encodeURIComponent(selection.id)}/migrate`, {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(payload),
+    });
+    const data = await response.json().catch(() => ({}));
+    if (!response.ok) throw new Error(apiError(data, `HTTP ${response.status}`));
+    if (state.selection === selection) {
+      setWorkspace({ path: data.cwd });
+      await selectLive(data.key);
+      el.input.focus();
+    }
+    await loadOverview({ silent: true });
+  } catch (error) {
+    if (state.selection === selection) {
+      el.agentMigrateFeedback.textContent = tr("Could not migrate this session: {error}", { error: error.message });
+    }
+  } finally {
+    state.agentMigration = null;
+    if (state.selection?.kind === "agent" && state.agentData) renderAgentMigration(state.agentData);
+  }
+}
+
+async function selectAgentSession(agent, id, title, cwd) {
+  const scope = cwd || await agentsScopeCwd();
   closeStream();
-  state.selection = { kind: "agent", agent, id, title };
+  const selection = { kind: "agent", agent, id, title, cwd: scope };
+  state.selection = selection;
   state.snapshot = null;
   state.fileData = null;
   state.agentData = null;
@@ -2254,17 +2421,20 @@ async function selectAgentSession(agent, id, title) {
   renderApproval(null);
   renderPlanCard(null);
   hideComposer();
+  el.agentMigrateFeedback.textContent = "";
   el.title.textContent = tr("Loading…");
   el.sub.textContent = title || "";
   resetMessagePane(tr("Loading…"));
   setConversationView(true);
   try {
-    const response = await apiFetch(`/api/agents/${encodeURIComponent(agent)}/sessions/${encodeURIComponent(id)}`, { cache: "no-store" });
+    const response = await apiFetch(`/api/agents/${encodeURIComponent(agent)}/sessions/${encodeURIComponent(id)}?cwd=${encodeURIComponent(scope)}`, { cache: "no-store" });
     const data = await response.json().catch(() => ({}));
+    if (state.selection !== selection) return;
     if (!response.ok) throw new Error(apiError(data, `HTTP ${response.status}`));
-    state.agentData = { ...data, agent, cwd: state.agentData?.cwd || state.workspace?.path || "" };
+    state.agentData = { ...data, agent, cwd: data.cwd || scope };
     renderAgentView(state.agentData);
   } catch (error) {
+    if (state.selection !== selection) return;
     el.title.textContent = title || tr("Conversation");
     el.sub.textContent = tr("Could not load this session: {error}", { error: error.message });
     resetMessagePane(tr("Could not load this session: {error}", { error: error.message }));
@@ -2505,7 +2675,7 @@ function initializeProWorkspace() {
 
 el.refresh.addEventListener("click", () => loadOverview());
 el.back.addEventListener("click", () => setConversationView(false));
-el.send.addEventListener("click", sendMessage);
+el.send.addEventListener("click", activateComposer);
 el.input.addEventListener("input", autosize);
 el.input.addEventListener("keydown", (event) => {
   if (event.key === "Enter" && !event.shiftKey) {
@@ -2528,6 +2698,7 @@ el.workspaceAdd.addEventListener("click", () => {
   openFolderDialog({ start: state.workspace?.path || state.workspaces?.cwd || "", onPick: (path) => openWorkspace(path) });
 });
 el.agentsOpen.addEventListener("click", () => openAgentsDialog());
+el.agentMigrate.addEventListener("click", () => migrateSelectedAgentSession());
 el.agentsClose.addEventListener("click", () => el.agentsDialog.close());
 el.agentsDialog.addEventListener("cancel", (event) => {
   event.preventDefault();
@@ -2609,10 +2780,14 @@ window.addEventListener("beforeunload", closeStream);
 initializeLanguage();
 initializeProWorkspace();
 preferences.load()
-  .then((config) => {
+  .then(async (config) => {
     const language = config?.settings?.language;
-    if (language && language !== uiLanguage()) return changeInterfaceLanguage(language, { persist: false });
-    return undefined;
+    if (language && language !== uiLanguage()) {
+      await changeInterfaceLanguage(language, { persist: false });
+    }
+    // Offer background residency only after the interface language is settled,
+    // so the invitation is never briefly shown in the wrong language.
+    maybePromptBackground(config);
   })
   .catch(error => console.error(error));
 loadOverview().then(() => {

package/web/i18n.js

@@ -132,6 +132,12 @@ const ZH = {
   "Working directory": "工作目录",
   "Working directories": "工作目录",
   "Other agents": "其他 Agent",
+  "Migrate session": "迁移会话",
+  "Migrating…": "迁移中…",
+  "Copy this history into a new Neutrino conversation in the same folder": "将历史复制为同一工作目录下的新 Neutrino 会话",
+  "Could not migrate this session: {error}": "无法迁移此会话：{error}",
+  "session not found in this working directory": "此工作目录中未找到该会话",
+  "this session has no messages to migrate": "此会话没有可迁移的消息",
   "Read-only sessions recorded by other coding agents in this working directory.": "其他编码 Agent 在此工作目录中记录的只读会话。",
   "No saved sessions from other agents in this folder.": "此文件夹中暂无其他 Agent 保存的会话。",
   "Claude Code": "Claude Code",
@@ -298,6 +304,14 @@ const ZH = {
   "Extreme-risk auto-approval (del class, 3 separate review rounds)": "极高风险自动审批（删除类命令，独立审查 3 轮）",
   "Sound alerts (turn finished, approval waiting)": "声音提醒（回合结束、等待审批）",
   "Start the Web console with the terminal": "随终端启动 Web 控制台（下次启动生效）",
+  "Background residency": "后台常驻",
+  "Run the Web console in the background and keep browser tasks alive after the CLI exits": "让 Web 控制台在后台运行，CLI 退出后浏览器中的任务继续执行",
+  "Off by default. Changes take effect immediately, including for running browser tasks. The regular and Pro workspaces share this setting. Terminal conversations still end when the terminal closes.": "默认关闭。切换立即生效，正在运行的浏览器任务也会受到保护；普通模式与 Pro 模式共用此设置。终端内的对话仍会在终端关闭时结束。",
+  "Enable background residency to avoid accidentally interrupting tasks": "建议开启后台常驻，避免误触中断任务",
+  "Enable": "开启",
+  "Background residency is on. Browser tasks keep running after the terminal closes.": "后台常驻已立即开启。关闭终端后，浏览器任务会继续执行。",
+  "Background residency is off. Current tasks can finish before the console closes.": "后台常驻已立即关闭。控制台退出前会等待当前任务完成。",
+  "Background residency could not be applied. Restart the console and try again.": "后台常驻未能生效，请重启控制台后重试。",
   "Safety determines automatic approval; task relevance only blocks unanimously confirmed, extreme mismatches. Delete-class automatic approval also requires this setting.": "自动审批取决于安全性；任务相关性只有在两位审查者一致确认极端不匹配时才会阻止执行。删除类命令的自动审批还需要开启此设置。",
   "Web access": "Web 访问",
   "Allow access from other devices (LAN, 0.0.0.0)": "允许其他设备访问（局域网，0.0.0.0）",

package/web/index.html

@@ -128,6 +128,11 @@
 
         <div id="approval" class="approval hidden" role="alert" aria-live="assertive"></div>
 
+        <footer id="agent-actions" class="agent-actions hidden">
+          <p id="agent-migrate-feedback" class="form-feedback error" role="status" aria-live="polite"></p>
+          <button id="agent-migrate" class="control primary" type="button" data-i18n="Migrate session" title="Copy this history into a new Neutrino conversation in the same folder" data-i18n-title="Copy this history into a new Neutrino conversation in the same folder">Migrate session</button>
+        </footer>
+
         <footer id="composer" class="composer hidden">
           <div class="composer-inner">
             <div class="composer-card">
@@ -157,7 +162,7 @@
                 </div>
               </details>
               <button id="send" class="primary" type="button" title="Send message" aria-label="Send message" data-i18n-title="Send message" data-i18n-aria-label="Send message">
-                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 19V5M5 12l7-7 7 7" /></svg>
+                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path class="send-icon" d="M12 19V5M5 12l7-7 7 7" /><rect class="pause-icon" x="5" y="5" width="14" height="14" rx="2" fill="currentColor" stroke="none" /></svg>
               </button>
             </div>
             <div class="composer-hint">
@@ -222,6 +227,9 @@
           <label class="checkbox-label"><input id="settings-sound" type="checkbox" /> <span data-i18n="Sound alerts (turn finished, approval waiting)">Sound alerts (turn finished, approval waiting)</span></label>
           <label class="checkbox-label"><input id="settings-web-console" type="checkbox" /> <span data-i18n="Start the Web console with the terminal">Start the Web console with the terminal</span></label>
           <p class="settings-note" data-i18n="Safety determines automatic approval; task relevance only blocks unanimously confirmed, extreme mismatches. Delete-class automatic approval also requires this setting.">Safety determines automatic approval; task relevance only blocks unanimously confirmed, extreme mismatches. Delete-class automatic approval also requires this setting.</p>
+          <h3 data-i18n="Background residency">Background residency</h3>
+          <label class="checkbox-label"><input id="settings-background" type="checkbox" /> <span data-i18n="Run the Web console in the background and keep browser tasks alive after the CLI exits">Run the Web console in the background and keep browser tasks alive after the CLI exits</span></label>
+          <p class="settings-note" data-i18n="Off by default. Changes take effect immediately, including for running browser tasks. The regular and Pro workspaces share this setting. Terminal conversations still end when the terminal closes.">Off by default. Changes take effect immediately, including for running browser tasks. The regular and Pro workspaces share this setting. Terminal conversations still end when the terminal closes.</p>
           <h3 data-i18n="Web access">Web access</h3>
           <label class="checkbox-label"><input id="settings-web-lan" type="checkbox" /> <span data-i18n="Allow access from other devices (LAN, 0.0.0.0)">Allow access from other devices (LAN, 0.0.0.0)</span></label>
           <p class="settings-note" data-i18n="Binds the Web console to 0.0.0.0 so other devices on your network can open it, like --lan. Takes effect immediately; turning it off returns the console to 127.0.0.1. Keep the Web password on: anyone who can reach this port can drive the agent.">Binds the Web console to 0.0.0.0 so other devices on your network can open it, like --lan. Takes effect immediately; turning it off returns the console to 127.0.0.1. Keep the Web password on: anyone who can reach this port can drive the agent.</p>
@@ -239,6 +247,27 @@
       </form>
     </dialog>
 
+    <dialog id="background-dialog" class="sheet-dialog background-dialog" aria-labelledby="background-title">
+      <div class="sheet background-sheet">
+        <header class="sheet-header background-header">
+          <span class="background-mark" aria-hidden="true">
+            <svg viewBox="0 0 24 24" fill="none" aria-hidden="true">
+              <ellipse cx="12" cy="12" rx="9.4" ry="3.8" transform="rotate(-30 12 12)" stroke="currentColor" stroke-width="1.7" />
+              <circle cx="12" cy="12" r="3.1" stroke="currentColor" stroke-width="1.7" />
+            </svg>
+          </span>
+          <div class="background-copy">
+            <h2 id="background-title" data-i18n="Enable background residency to avoid accidentally interrupting tasks">Enable background residency to avoid accidentally interrupting tasks</h2>
+          </div>
+        </header>
+        <p id="background-feedback" class="form-feedback background-feedback" role="status" aria-live="polite"></p>
+        <footer class="sheet-actions background-actions">
+          <button id="background-cancel" class="control" type="button" data-i18n="Cancel">Cancel</button>
+          <button id="background-enable" class="primary" type="button" data-i18n="Enable" autofocus>Enable</button>
+        </footer>
+      </div>
+    </dialog>
+
     <dialog id="new-chat-dialog" class="sheet-dialog" aria-labelledby="new-chat-title">
       <form id="new-chat-form" class="sheet">
         <header class="sheet-header">

package/web/settings.js

@@ -7,7 +7,7 @@ export function createSettingsUI({ apiFetch, applyModel, onLanguageChange, proMo
     "settings-open", "settings-dialog", "settings-form", "settings-close", "settings-cancel", "settings-save", "settings-feedback",
     "default-provider", "default-model", "default-intensity", "settings-context", "settings-compress-note", "settings-reviewer",
     "settings-extreme", "settings-sound", "settings-password", "settings-password-confirm",
-    "settings-language", "settings-plan", "settings-approval", "settings-web-console", "settings-web-lan",
+    "settings-language", "settings-plan", "settings-approval", "settings-web-console", "settings-web-lan", "settings-background",
     "settings-pro", "settings-pro-preset", "settings-pro-depth"];
   const el = Object.fromEntries(ids.map(id => [id, document.getElementById(id)]));
   let config = null;
@@ -21,6 +21,10 @@ export function createSettingsUI({ apiFetch, applyModel, onLanguageChange, proMo
   // saved, so editing another setting never pins an interface that came from
   // --lan/--host on the command line.
   let lanInitial = false;
+  // Same idea for background residency: the dialog must not overwrite a value
+  // changed from the terminal while it was open.
+  let backgroundInitial = false;
+  let backgroundChanging = false;
 
   async function json(path, body) {
     const response = await apiFetch(path, body === undefined ? { cache: "no-store" } : {
@@ -178,8 +182,45 @@ export function createSettingsUI({ apiFetch, applyModel, onLanguageChange, proMo
     el["settings-sound"].checked = config.settings.sound_alerts !== false;
     el["settings-web-console"].checked = config.settings.web_console !== false;
     el["settings-web-lan"].checked = config.settings.web_lan === true;
+    el["settings-background"].checked = config.settings.background_running === true;
+    backgroundInitial = el["settings-background"].checked;
     lanInitial = el["settings-web-lan"].checked;
   }
+  el["settings-background"].addEventListener("change", async () => {
+    if (!config || backgroundChanging) return;
+    const enabled = el["settings-background"].checked;
+    backgroundChanging = true;
+    el["settings-background"].disabled = true;
+    el["settings-save"].disabled = true;
+    message(el["settings-feedback"], t("Applying…"));
+    try {
+      const updated = await json("/api/settings", { settings: { background: enabled } });
+      if (updated.settings.background_running !== enabled) {
+        throw new Error(t("Background residency could not be applied. Restart the console and try again."));
+      }
+      config = updated;
+      backgroundInitial = config.settings.background_running === true;
+      el["settings-background"].checked = backgroundInitial;
+      onCatalogChange?.(config);
+      message(el["settings-feedback"], t(enabled
+        ? "Background residency is on. Browser tasks keep running after the terminal closes."
+        : "Background residency is off. Current tasks can finish before the console closes."));
+    } catch (error) {
+      // A response can be lost after the service applied the change. Ask the
+      // service for its actual state before putting the switch back.
+      try {
+        config = await json("/api/settings");
+        backgroundInitial = config.settings.background_running === true;
+      } catch { /* Keep the last confirmed value and show the error. */ }
+      el["settings-background"].checked = backgroundInitial;
+      message(el["settings-feedback"], t(error.message), true);
+    } finally {
+      backgroundChanging = false;
+      el["settings-background"].disabled = false;
+      el["settings-save"].disabled = false;
+    }
+  });
+
   function renderContextWindow() {
     const provider = config.providers.find(entry => entry.name === el["default-provider"].value);
     const model = provider?.models.find(entry => entry.name === el["default-model"].value);
@@ -260,6 +301,7 @@ export function createSettingsUI({ apiFetch, applyModel, onLanguageChange, proMo
     el["settings-save"].disabled = true;
     const wasLan = config?.settings?.web_lan === true;
     const lanChanged = el["settings-web-lan"].checked !== lanInitial;
+    const backgroundChanged = el["settings-background"].checked !== backgroundInitial;
     const selection = { provider: el["default-provider"].value, model: el["default-model"].value, intensity: el["default-intensity"].value };
     const settings = {
       ...(!proMode ? {
@@ -275,6 +317,7 @@ export function createSettingsUI({ apiFetch, applyModel, onLanguageChange, proMo
       sound_alerts: el["settings-sound"].checked,
       web_console: el["settings-web-console"].checked,
       ...(lanChanged ? { web_lan: el["settings-web-lan"].checked } : {}),
+      ...(backgroundChanged ? { background: el["settings-background"].checked } : {}),
       language: el["settings-language"].value,
       approval_mode: el["settings-approval"].value,
     };
@@ -289,16 +332,24 @@ export function createSettingsUI({ apiFetch, applyModel, onLanguageChange, proMo
       // server bound and (when available) the address to open elsewhere.
       el["settings-web-lan"].checked = config.settings.web_lan === true;
       lanInitial = el["settings-web-lan"].checked;
+      el["settings-background"].checked = config.settings.background_running === true;
+      backgroundInitial = el["settings-background"].checked;
       const urls = Array.isArray(config.settings.web_urls) ? config.settings.web_urls : [];
       const lanNote = config.settings.web_lan === wasLan ? "" : config.settings.web_lan
         ? urls.length
           ? t("LAN access is on. Open {urls} from another device.", { urls: urls.join(" · ") })
           : t("LAN access is on, but no network address was found. Only this machine can connect.")
         : t("LAN access is off. Only this machine can connect.");
+      const backgroundNote = !backgroundChanged
+        ? ""
+        : config.settings.background
+          ? t("Background residency is on. Browser tasks keep running after the terminal closes.")
+          : t("Background residency is off. Current tasks can finish before the console closes.");
       const savedText = password
         ? t("Settings saved. Web password updated permanently.")
         : t("Settings saved.");
-      message(el["settings-feedback"], lanNote ? `${savedText} ${lanNote}` : savedText);
+      const notes = [lanNote, backgroundNote].filter(Boolean).join(" ");
+      message(el["settings-feedback"], notes ? `${savedText} ${notes}` : savedText);
     } catch (error) { message(el["settings-feedback"], t(error.message), true); }
     finally { el["settings-save"].disabled = false; }
   });

package/web/style.css

@@ -597,6 +597,16 @@ svg {
   border-bottom: 1px solid var(--border-soft);
 }
 
+/* Match the CLI's 500ms thinking phases across the full title bar. */
+.main-header.is-thinking {
+  background-color: #28393d;
+  animation: header-thinking 1s steps(1, end) infinite;
+}
+
+.main-header.is-thinking .main-title h1 {
+  color: #99d9ea;
+}
+
 .main-title {
   flex: 1;
   min-width: 0;
@@ -1372,6 +1382,26 @@ svg {
 
 /* --------------------------------------------------------------- composer */
 
+.agent-actions {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 12px;
+  padding: 12px clamp(16px, 4vw, 40px) max(18px, env(safe-area-inset-bottom));
+}
+
+.agent-actions .form-feedback {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+  overflow-wrap: anywhere;
+}
+
+.agent-actions button {
+  flex-shrink: 0;
+}
+
 .composer {
   flex-shrink: 0;
   padding: 0 clamp(16px, 4vw, 40px) 18px;
@@ -1554,6 +1584,15 @@ svg {
   height: 18px;
 }
 
+#send .pause-icon,
+#send.is-pause .send-icon {
+  display: none;
+}
+
+#send.is-pause .pause-icon {
+  display: block;
+}
+
 #send:hover {
   background: var(--primary-hover);
 }
@@ -2659,6 +2698,56 @@ select option {
   flex: 1;
 }
 
+/* One-time background-residency invitation. The orbit badge is the regular
+   console's own mark, so the offer reads as part of the same product. */
+.background-dialog {
+  width: min(460px, calc(100vw - 24px));
+}
+
+.background-header {
+  align-items: center;
+  justify-content: flex-start;
+  gap: 14px;
+  border-bottom: 0;
+  padding-bottom: 18px;
+}
+
+.background-mark {
+  display: flex;
+  flex: none;
+  align-items: center;
+  justify-content: center;
+  width: 46px;
+  height: 46px;
+  color: var(--accent);
+  background: var(--surface-1);
+  border: 1px solid var(--border-soft);
+  border-radius: 13px;
+}
+
+.background-mark svg {
+  width: 24px;
+  height: 24px;
+}
+
+.background-copy {
+  min-width: 0;
+}
+
+.background-copy h2 {
+  font-size: 15px;
+  line-height: 1.55;
+  font-weight: 600;
+}
+
+.background-feedback:empty {
+  display: none;
+}
+
+.background-actions {
+  border-top: 1px solid var(--border-soft);
+}
+
 /* Folder picker */
 .folder-sheet {
   max-height: calc(100vh - 32px);
@@ -3032,6 +3121,18 @@ html.pro-transitioning body::before {
 
 /* -------------------------------------------------------------- animations */
 
+@keyframes header-thinking {
+  0%,
+  100% {
+    background-color: #28393d;
+    border-bottom-color: rgba(153, 217, 234, 0.45);
+  }
+  50% {
+    background-color: var(--bg);
+    border-bottom-color: var(--border-soft);
+  }
+}
+
 @keyframes blink {
   0%,
   49% {