@co0ontty/wand 1.6.1 → 1.7.0

package/dist/web-ui/content/scripts.js

@@ -58,6 +58,8 @@
 
     (function() {
       var configPath = "${escapeHtml(configPath)}";
+      var CHAT_EXPAND_STATE_STORAGE_KEY = "wand-chat-expand-state-v1";
+      var CHAT_AUTO_FOLLOW_STORAGE_KEY = "wand-chat-auto-follow";
 
       var state = {
         selectedId: (function() {
@@ -75,6 +77,7 @@
         _lastDomHtml: "",
         terminalSessionId: null,
         terminalOutput: "",
+        terminalLiveStreamSessions: {},
         terminalViewportSize: { width: 0, height: 0 },
         terminalAutoFollow: true,
         terminalScrollIdleTimer: null,
@@ -90,12 +93,21 @@
         inputQueue: Promise.resolve(),
         pendingMessages: [], // WebSocket 断线期间的消息队列
         messageQueue: [], // 用户消息排队等待发送
-        crossSessionQueue: [], // 跨会话排队消息 [{ id, text, cwd, mode, tool }]
+        crossSessionQueue: (function() {
+          try {
+            var saved = localStorage.getItem("wand-cross-session-queue");
+            var parsed = saved ? JSON.parse(saved) : [];
+            return Array.isArray(parsed) ? parsed : [];
+          } catch (e) {
+            return [];
+          }
+        })(), // 跨会话排队消息 [{ id, text, cwd, mode, tool }]
         structuredInputQueue: [], // 结构化会话同会话排队消息
         drafts: {},
         isSyncingInputBox: false,
         loginPending: false,
         loginChecked: false,
+        bootstrapping: true,
         sessionsDrawerOpen: false,
         modalOpen: false,
         presetValue: "",
@@ -103,6 +115,7 @@
         modeValue: "managed",
         chatMode: "managed",
         sessionCreateKind: "structured",
+        sessionCreateWorktree: false,
         sessionTool: "claude",
         preferredCommand: "claude",
         structuredRunner: "claude-cli-print",
@@ -130,6 +143,21 @@
             return false;
           }
         })(),
+        chatAutoFollow: (function() {
+          try {
+            var saved = localStorage.getItem(CHAT_AUTO_FOLLOW_STORAGE_KEY);
+            return saved === null ? true : saved === "true";
+          } catch (e) {
+            return true;
+          }
+        })(),
+        showChatJumpToBottom: false,
+        chatScrollThreshold: 200,
+        chatIsProgrammaticScroll: false,
+        chatScrollElement: null,
+        chatScrollHandler: null,
+        lastForegroundSyncAt: 0,
+        foregroundSyncTimer: null,
         currentMessages: [],
         lastRenderedHash: 0,
         lastRenderedMsgCount: 0,
@@ -244,6 +272,120 @@
         }
       }
 
+      function persistChatAutoFollow() {
+        try {
+          localStorage.setItem(CHAT_AUTO_FOLLOW_STORAGE_KEY, state.chatAutoFollow ? "true" : "false");
+        } catch (e) {
+          // Ignore localStorage errors
+        }
+      }
+
+      function getChatScrollElement() {
+        var chatOutput = document.getElementById("chat-output");
+        if (!chatOutput) {
+          state.chatScrollElement = null;
+          return null;
+        }
+        var chatMessages = chatOutput.querySelector(".chat-messages");
+        if (chatMessages) {
+          state.chatScrollElement = chatMessages;
+          return chatMessages;
+        }
+        state.chatScrollElement = null;
+        return null;
+      }
+
+      function isChatNearBottom(chatMsgs) {
+        var el = chatMsgs || getChatScrollElement();
+        if (!el) return true;
+        return el.scrollTop < state.chatScrollThreshold;
+      }
+
+      function updateChatFollowToggleButton() {
+        var button = document.getElementById("chat-follow-toggle");
+        if (!button) return;
+        var enabled = !!state.chatAutoFollow;
+        button.classList.toggle("active", enabled);
+        button.setAttribute("aria-pressed", enabled ? "true" : "false");
+        button.setAttribute("title", enabled ? "追踪底部：开启" : "追踪底部：已暂停");
+        button.textContent = enabled ? "追底" : "暂停";
+      }
+
+      function updateChatJumpToBottomButton() {
+        var button = document.getElementById("chat-jump-bottom");
+        var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        var shouldShow = !!selectedSession
+          && state.currentView === "chat"
+          && !state.chatAutoFollow
+          && !isChatNearBottom();
+        state.showChatJumpToBottom = shouldShow;
+        if (button) {
+          button.classList.toggle("visible", shouldShow);
+        }
+      }
+
+      function scrollChatToBottom(smooth) {
+        var chatMsgs = getChatScrollElement();
+        if (!chatMsgs || !chatMsgs.isConnected) return;
+        state.chatIsProgrammaticScroll = true;
+        if (smooth && typeof chatMsgs.scrollTo === "function") {
+          chatMsgs.scrollTo({ top: 0, behavior: "smooth" });
+          setTimeout(function() {
+            state.chatIsProgrammaticScroll = false;
+            updateChatJumpToBottomButton();
+          }, 220);
+          return;
+        }
+        chatMsgs.scrollTop = 0;
+        requestAnimationFrame(function() {
+          state.chatIsProgrammaticScroll = false;
+          updateChatJumpToBottomButton();
+        });
+      }
+
+      function setChatAutoFollow(enabled, options) {
+        options = options || {};
+        state.chatAutoFollow = !!enabled;
+        persistChatAutoFollow();
+        updateChatFollowToggleButton();
+        if (state.chatAutoFollow && options.scrollNow !== false) {
+          scrollChatToBottom(!!options.smooth);
+        } else {
+          updateChatJumpToBottomButton();
+        }
+      }
+
+      function bindChatScrollListener() {
+        var chatMsgs = getChatScrollElement();
+        if (!chatMsgs || !chatMsgs.isConnected) return;
+        if (state.chatScrollElement === chatMsgs && state.chatScrollHandler) {
+          updateChatJumpToBottomButton();
+          return;
+        }
+        if (state.chatScrollElement && state.chatScrollHandler) {
+          state.chatScrollElement.removeEventListener("scroll", state.chatScrollHandler);
+        }
+        state.chatScrollElement = chatMsgs;
+        state.chatScrollHandler = function() {
+          if (!chatMsgs.isConnected) return;
+          if (state.chatIsProgrammaticScroll) {
+            updateChatJumpToBottomButton();
+            return;
+          }
+          if (!isChatNearBottom(chatMsgs)) {
+            if (state.chatAutoFollow) {
+              setChatAutoFollow(false, { scrollNow: false });
+            } else {
+              updateChatJumpToBottomButton();
+            }
+            return;
+          }
+          updateChatJumpToBottomButton();
+        };
+        chatMsgs.addEventListener("scroll", state.chatScrollHandler, { passive: true });
+        updateChatJumpToBottomButton();
+      }
+
       // Helper function to persist selected session ID to localStorage
       function persistSelectedId() {
         try {
@@ -257,14 +399,302 @@
         }
       }
 
+      function getStructuredQueuedInputs(session) {
+        if (session && Array.isArray(session.queuedMessages)) {
+          return session.queuedMessages;
+        }
+        return state.structuredInputQueue;
+      }
+
+      function getSelectedStructuredQueuedInputs() {
+        var session = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        return getStructuredQueuedInputs(session);
+      }
+
+      function syncStructuredQueueFromSession(session) {
+        var queued = getStructuredQueuedInputs(session);
+        state.structuredInputQueue = Array.isArray(queued) ? queued.slice() : [];
+      }
+
+      function hasRenderOnlyStructuredBlock(message, marker) {
+        return !!(message && Array.isArray(message.content) && message.content.some(function(block) {
+          return block && typeof block === "object" && block[marker];
+        }));
+      }
+
+      function isQueuedStructuredMessage(message) {
+        return !!(message && message.role === "user" && hasRenderOnlyStructuredBlock(message, "__queued"));
+      }
+
+      function isProcessingStructuredMessage(message) {
+        return !!(message && message.role === "assistant" && hasRenderOnlyStructuredBlock(message, "__processing"));
+      }
+
+      function stripRenderOnlyStructuredMessages(messages) {
+        if (!Array.isArray(messages)) return [];
+        var removed = false;
+        var filtered = [];
+        for (var i = 0; i < messages.length; i++) {
+          var message = messages[i];
+          if (isQueuedStructuredMessage(message) || isProcessingStructuredMessage(message)) {
+            removed = true;
+            continue;
+          }
+          filtered.push(message);
+        }
+        return removed ? filtered : messages;
+      }
+
+      function normalizeStructuredSnapshot(snapshot, existingSession) {
+        if (!snapshot || !Array.isArray(snapshot.messages)) {
+          return snapshot;
+        }
+        var sessionKind = snapshot.sessionKind || (existingSession && existingSession.sessionKind);
+        if (sessionKind !== "structured") {
+          return snapshot;
+        }
+        var sanitizedMessages = stripRenderOnlyStructuredMessages(snapshot.messages);
+        if (sanitizedMessages === snapshot.messages) {
+          return snapshot;
+        }
+        return Object.assign({}, snapshot, { messages: sanitizedMessages });
+      }
+
+      function saveStructuredQueue() {
+        try {
+          var queued = getSelectedStructuredQueuedInputs();
+          if (!state.selectedId || queued.length === 0) {
+            return;
+          }
+          localStorage.setItem("wand-structured-queue", JSON.stringify({
+            sessionId: state.selectedId,
+            items: queued
+          }));
+        } catch (e) {
+          // Ignore localStorage errors
+        }
+      }
+
+      function clearStructuredQueuePersistence(sessionId) {
+        try {
+          var saved = localStorage.getItem("wand-structured-queue");
+          if (!saved) return;
+          var parsed = JSON.parse(saved);
+          if (!sessionId || !parsed || parsed.sessionId === sessionId) {
+            localStorage.removeItem("wand-structured-queue");
+          }
+        } catch (e) {
+          localStorage.removeItem("wand-structured-queue");
+        }
+      }
+
+      function restoreStructuredQueue() {
+        var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        if (selectedSession && Array.isArray(selectedSession.queuedMessages)) {
+          syncStructuredQueueFromSession(selectedSession);
+          saveStructuredQueue();
+          return;
+        }
+        try {
+          var saved = localStorage.getItem("wand-structured-queue");
+          if (!saved) return;
+          var parsed = JSON.parse(saved);
+          if (!parsed || parsed.sessionId !== state.selectedId || !Array.isArray(parsed.items)) {
+            return;
+          }
+          state.structuredInputQueue = parsed.items.slice(0, 10);
+        } catch (e) {
+          state.structuredInputQueue = [];
+        }
+      }
+
+      function persistCrossSessionQueue() {
+        try {
+          if (state.crossSessionQueue.length === 0) {
+            localStorage.removeItem("wand-cross-session-queue");
+            return;
+          }
+          localStorage.setItem("wand-cross-session-queue", JSON.stringify(state.crossSessionQueue));
+        } catch (e) {
+          // Ignore localStorage errors
+        }
+      }
+
       function getConfigCwd() {
         return (state.config && state.config.defaultCwd) || "/tmp";
       }
 
+      function loadChatExpandStateMap() {
+        try {
+          var saved = localStorage.getItem(CHAT_EXPAND_STATE_STORAGE_KEY);
+          if (!saved) return {};
+          var parsed = JSON.parse(saved);
+          return parsed && typeof parsed === "object" ? parsed : {};
+        } catch (e) {
+          return {};
+        }
+      }
+
+      function saveChatExpandStateMap(map) {
+        try {
+          if (!map || Object.keys(map).length === 0) {
+            localStorage.removeItem(CHAT_EXPAND_STATE_STORAGE_KEY);
+            return;
+          }
+          localStorage.setItem(CHAT_EXPAND_STATE_STORAGE_KEY, JSON.stringify(map));
+        } catch (e) {
+          // Ignore localStorage errors
+        }
+      }
+
+      function getCurrentChatExpandState() {
+        var sessionId = state.selectedId;
+        if (!sessionId) return {};
+        var map = loadChatExpandStateMap();
+        var sessionState = map[sessionId];
+        return sessionState && typeof sessionState === "object" ? sessionState : {};
+      }
+
+      function getPersistedExpandState(itemKey) {
+        if (!itemKey || !state.selectedId) return null;
+        var sessionState = getCurrentChatExpandState();
+        return typeof sessionState[itemKey] === "boolean" ? sessionState[itemKey] : null;
+      }
+
+      function setPersistedExpandState(itemKey, expanded) {
+        if (!itemKey || !state.selectedId) return;
+        var map = loadChatExpandStateMap();
+        var sessionId = state.selectedId;
+        var sessionState = map[sessionId];
+        if (!sessionState || typeof sessionState !== "object") {
+          sessionState = {};
+        }
+        sessionState[itemKey] = !!expanded;
+        map[sessionId] = sessionState;
+        saveChatExpandStateMap(map);
+      }
+
+      function getMessageKey(msg, fallbackIndex) {
+        if (!msg) {
+          return "msg:unknown-" + (typeof fallbackIndex === "number" ? fallbackIndex : 0);
+        }
+        if (msg.uuid) return "msg:" + msg.uuid;
+        if (msg.id) return "msg:" + msg.id;
+        if (msg.messageId) return "msg:" + msg.messageId;
+        if (msg.turnId) return "msg:" + msg.turnId;
+        return "msg:" + (typeof fallbackIndex === "number" ? fallbackIndex : 0);
+      }
+
+      function buildExpandKey(kind, parts) {
+        var filtered = [];
+        for (var i = 0; i < parts.length; i++) {
+          var part = parts[i];
+          if (part === undefined || part === null || part === "") continue;
+          filtered.push(String(part));
+        }
+        return kind + ":" + filtered.join(":");
+      }
+
+      function getElementExpandKey(el) {
+        if (!el || !el.dataset) return "";
+        return el.dataset.expandKey || "";
+      }
+
+      function isElementExpanded(el, kind) {
+        if (!el) return false;
+        switch (kind) {
+          case "tool-card":
+            return !el.classList.contains("collapsed");
+          case "thinking":
+            return el.classList.contains("expanded") && !el.classList.contains("collapsed");
+          case "inline-tool":
+            return el.classList.contains("inline-tool-open");
+          case "terminal": {
+            var body = el.querySelector(".term-body");
+            if (body) return body.style.display !== "none";
+            return el.dataset.expanded === "true";
+          }
+          case "tool-group":
+            return el.getAttribute("data-expanded") === "true";
+          default:
+            return false;
+        }
+      }
+
+      function applyExpandedState(el, kind, expanded) {
+        if (!el) return;
+        switch (kind) {
+          case "tool-card": {
+            el.classList.toggle("collapsed", !expanded);
+            break;
+          }
+          case "thinking": {
+            el.classList.toggle("collapsed", !expanded);
+            el.classList.toggle("expanded", !!expanded);
+            var previewEl = el.querySelector(".thinking-inline-preview");
+            if (previewEl) {
+              var fullText = el.dataset.thinking || "";
+              var preview = fullText.slice(0, 57) + (fullText.length > 60 ? "…" : "");
+              previewEl.textContent = expanded ? fullText : preview;
+            }
+            var actionEl = el.querySelector(".thinking-inline-action");
+            if (actionEl) actionEl.textContent = expanded ? "收起" : "展开";
+            break;
+          }
+          case "inline-tool": {
+            el.classList.toggle("inline-tool-open", !!expanded);
+            var inlineBody = el.querySelector(".inline-tool-expanded");
+            if (inlineBody) inlineBody.style.display = expanded ? "block" : "none";
+            break;
+          }
+          case "terminal": {
+            var body = el.querySelector(".term-body");
+            if (body) body.style.display = expanded ? "block" : "none";
+            el.dataset.expanded = expanded ? "true" : "false";
+            var toggleIcon = el.querySelector(".term-toggle-icon");
+            if (toggleIcon) toggleIcon.textContent = expanded ? "▼" : "▶";
+            break;
+          }
+          case "tool-group": {
+            el.setAttribute("data-expanded", expanded ? "true" : "false");
+            var groupBody = el.querySelector(".tool-group-body");
+            if (groupBody) groupBody.style.display = expanded ? "block" : "none";
+            var chevron = el.querySelector(".tool-group-chevron");
+            if (chevron) chevron.style.transform = expanded ? "rotate(180deg)" : "";
+            break;
+          }
+        }
+      }
+
+      function persistElementExpandState(el, kind) {
+        var itemKey = getElementExpandKey(el);
+        if (!itemKey) return;
+        setPersistedExpandState(itemKey, isElementExpanded(el, kind));
+      }
+
+      function applyPersistedExpandState(container) {
+        if (!container || !state.selectedId) return;
+        container.querySelectorAll("[data-expand-key]").forEach(function(el) {
+          var itemKey = getElementExpandKey(el);
+          var kind = el.dataset.expandKind || "";
+          var persisted = getPersistedExpandState(itemKey);
+          if (persisted === null || !kind) return;
+          applyExpandedState(el, kind, persisted);
+        });
+      }
+
       function resetChatRenderCache() {
         state.lastRenderedHash = 0;
         state.lastRenderedMsgCount = 0;
         state.lastRenderedEmpty = null;
+        state.renderPending = false;
+        if (state.chatScrollElement && state.chatScrollHandler) {
+          state.chatScrollElement.removeEventListener("scroll", state.chatScrollHandler);
+        }
+        state.chatScrollElement = null;
+        state.chatScrollHandler = null;
+        state.showChatJumpToBottom = false;
+        state.chatIsProgrammaticScroll = false;
       }
 
       function getEffectiveCwd() {
@@ -314,9 +744,6 @@
         }
       }
 
-      renderBootLoading();
-      restoreLoginSession();
-
       function renderBootLoading() {
         var app = document.getElementById("app");
         if (!app) return;
@@ -324,11 +751,65 @@
           '<div class="boot-loading">' +
             '<div class="boot-loading-card">' +
               '<div class="boot-loading-spinner"></div>' +
-              '<div class="boot-loading-text">正在恢复会话…</div>' +
+              '<div class="boot-loading-text">正在连接 Wand…</div>' +
             '</div>' +
           '</div>';
       }
 
+      function scheduleForegroundSync(reason) {
+        if (!state.config) return;
+        if (document.hidden) return;
+        var now = Date.now();
+        if (now - state.lastForegroundSyncAt < 1500) return;
+        state.lastForegroundSyncAt = now;
+        if (state.foregroundSyncTimer) {
+          clearTimeout(state.foregroundSyncTimer);
+        }
+        state.foregroundSyncTimer = setTimeout(function() {
+          state.foregroundSyncTimer = null;
+          syncOnForeground(reason);
+        }, 80);
+      }
+
+      function syncOnForeground(reason) {
+        if (!state.config) return Promise.resolve();
+        if (document.hidden) return Promise.resolve();
+        if (!state.ws || (state.ws.readyState !== WebSocket.OPEN && state.ws.readyState !== WebSocket.CONNECTING)) {
+          initWebSocket();
+        }
+        return loadSessions({ skipSelectedOutputReload: true }).then(function() {
+          if (state.selectedId) {
+            return loadOutput(state.selectedId);
+          }
+          scheduleChatRender(true);
+        }).catch(function(e) {
+          console.error("[wand] foreground sync failed:", reason, e);
+        });
+      }
+
+      function bindForegroundSyncListeners() {
+        if (window.__wandForegroundSyncBound) return;
+        window.__wandForegroundSyncBound = true;
+
+        document.addEventListener("visibilitychange", function() {
+          if (!document.hidden) {
+            scheduleForegroundSync("visibility");
+          }
+        });
+
+        window.addEventListener("focus", function() {
+          scheduleForegroundSync("focus");
+        });
+
+        window.addEventListener("pageshow", function() {
+          scheduleForegroundSync("pageshow");
+        });
+
+        window.addEventListener("resume", function() {
+          scheduleForegroundSync("resume");
+        });
+      }
+
       function restoreLoginSession() {
         fetch("/api/config", { credentials: "same-origin" })
           .then(function(res) {
@@ -344,20 +825,16 @@
             state.config = config;
             state.loginChecked = true;
             requestAnimationFrame(function() {
-              // Render the app shell first, THEN load session data into it.
-              // Skip updateShellChrome() here — sessions aren't loaded yet.
-              // refreshAll() will call updateShellChrome() after sessions arrive.
               try {
                 render({ skipShellChrome: true });
               } catch (_e) {
                 // render() may fail if external scripts (xterm.js) failed to load;
                 // continue with polling and session loading so the app remains functional
               }
+              bindForegroundSyncListeners();
               startPolling();
               refreshAll();
-              // Request browser notification permission after login
               requestNotificationPermission();
-              // Show update bubble if server reports an available update
               if (config.updateAvailable && config.latestVersion) {
                 showNotificationBubble({
                   title: "\u53d1\u73b0\u65b0\u7248\u672c",
@@ -373,7 +850,6 @@
                 });
                 sendBrowserNotification("Wand \u53d1\u73b0\u65b0\u7248\u672c", "\u5f53\u524d " + (config.currentVersion || "-") + " \u2192 \u6700\u65b0 " + config.latestVersion, { tag: "wand-update" });
               }
-              // Auto-load claude history since section defaults to expanded
               if (state.claudeHistoryExpanded && !state.claudeHistoryLoaded) {
                 loadClaudeHistory();
               }
@@ -381,7 +857,6 @@
           })
           .catch(function() {
             state.loginChecked = true;
-            // If offline (no network), show a friendly offline message instead of login
             if (!navigator.onLine) {
               var app = document.getElementById("app");
               if (app) {
@@ -394,7 +869,6 @@
                     '</div>' +
                   '</div>';
               }
-              // Retry when network comes back
               window.addEventListener('online', function() { location.reload(); }, { once: true });
               return;
             }
@@ -402,6 +876,9 @@
           });
       }
 
+      renderBootLoading();
+      restoreLoginSession();
+
       function render(options) {
         var skipShellChrome = options && options.skipShellChrome;
         var app = document.getElementById("app");
@@ -613,7 +1090,10 @@
             '</aside>' +
             '<main class="main-content">' +
               '<span class="current-task hidden" id="current-task"></span>' +
-              '' +
+              '<div class="view-toggle-bar' + (state.selectedId ? '' : ' hidden') + '" id="view-toggle-bar">' +
+                '<button id="view-terminal-btn" class="topbar-btn' + (state.currentView === "terminal" ? ' active' : '') + '" type="button" title="查看原始终端输出">终端</button>' +
+                '<button id="view-chat-btn" class="topbar-btn' + (state.currentView !== "terminal" ? ' active' : '') + '" type="button" title="查看聊天解析视图">聊天</button>' +
+              '</div>' +
               // File panel backdrop (mobile)
               '<div id="file-panel-backdrop" class="file-panel-backdrop' + (state.filePanelOpen ? " open" : "") + '"></div>' +
               // File side panel
@@ -644,7 +1124,12 @@
                 '</div>' +
                 '<button id="terminal-jump-bottom" class="terminal-jump-bottom' + (state.showTerminalJumpToBottom ? ' visible' : '') + '" type="button" title="回到底部">↓ 最新</button>' +
               '</div>' +
-              '<div id="chat-output" class="chat-container hidden"></div>' +
+              '<div id="chat-output" class="chat-container hidden">' +
+                '<div class="chat-overlay-controls">' +
+                  '<button id="chat-follow-toggle" class="chat-follow-toggle topbar-btn' + (state.chatAutoFollow ? ' active' : '') + '" type="button" aria-pressed="' + (state.chatAutoFollow ? 'true' : 'false') + '" title="' + (state.chatAutoFollow ? '追踪底部：开启' : '追踪底部：已暂停') + '">' + (state.chatAutoFollow ? '追底' : '暂停') + '</button>' +
+                '</div>' +
+                '<button id="chat-jump-bottom" class="chat-jump-bottom' + (state.showChatJumpToBottom ? ' visible' : '') + '" type="button" title="回到底部并继续追底">↓ 最新</button>' +
+              '</div>' +
               '<div id="blank-chat" class="blank-chat' + (state.selectedId ? " hidden" : "") + '">' +
                 '<div class="blank-chat-inner">' +
                   '<div class="blank-chat-logo">W</div>' +
@@ -654,6 +1139,9 @@
                     '<button class="blank-chat-tool-btn" id="welcome-tool-claude" type="button">' +
                       '<span class="tool-icon">🤖</span>新建终端会话' +
                     '</button>' +
+                    '<button class="blank-chat-tool-btn" id="welcome-tool-codex" type="button">' +
+                      '<span class="tool-icon">⌘</span>新建 Codex 会话' +
+                    '</button>' +
                     '<button class="blank-chat-tool-btn" id="welcome-tool-structured" type="button">' +
                       '<span class="tool-icon">💬</span>新建结构化会话' +
                     '</button>' +
@@ -683,7 +1171,7 @@
                   '</div>' +
                 '</div>' +
                 '<div class="input-composer">' +
-                  '<textarea id="input-box" class="input-textarea" placeholder="' + (state.terminalInteractive ? "终端交互模式开启中，请直接在终端中输入" : "输入消息...") + '" rows="1">' + escapeHtml(currentDraft) + '</textarea>' +
+                  '<textarea id="input-box" class="input-textarea" placeholder="' + getComposerPlaceholder(selectedSession, state.terminalInteractive) + '" rows="1">' + escapeHtml(currentDraft) + '</textarea>' +
                   '<div class="input-composer-bar">' +
                     '<div class="input-composer-left">' +
                       '<select id="chat-mode-select" class="chat-mode-select" title="仅对新建会话生效">' +
@@ -721,7 +1209,7 @@
                     '<span id="session-kind-display" class="session-kind-display">' + (selectedSession ? getSessionKindLabel(selectedSession) : '终端') + '</span>' +
                     '<span class="session-info-separator">|</span>' +
                     '<span id="session-status-display" class="session-status-display">' + (selectedSession ? getSessionStatusLabel(selectedSession) : '-') + '</span>' +
-                    (selectedSession && selectedSession.claudeSessionId ? '<span class="session-info-separator">|</span><span id="claude-session-id-badge" class="claude-session-id-badge" data-claude-id="' + escapeHtml(selectedSession.claudeSessionId) + '" title="点击复制 Claude 会话 ID">☁ ' + escapeHtml(selectedSession.claudeSessionId.slice(0, 8)) + '</span>' : '') +
+                    (selectedSession && selectedSession.provider === "claude" && selectedSession.claudeSessionId ? '<span class="session-info-separator">|</span><span id="claude-session-id-badge" class="claude-session-id-badge" data-claude-id="' + escapeHtml(selectedSession.claudeSessionId) + '" title="点击复制 Claude 会话 ID">☁ ' + escapeHtml(selectedSession.claudeSessionId.slice(0, 8)) + '</span>' : '') +
                     (selectedSession && !isStructuredSession(selectedSession) ? '<span class="session-info-separator">|</span><span id="session-exit-display" class="session-exit-display">退出码=' + (selectedSession.exitCode !== undefined ? selectedSession.exitCode : 'n/a') + '</span>' : '') +
                   '</div>' +
                 '</div>' +
@@ -1796,7 +2284,7 @@
         var recoveryHint = "";
         var checkbox = renderManageCheckbox("sessions", session.id, "选择会话 " + session.command);
 
-        if (session.claudeSessionId) {
+        if (session.provider === "claude" && session.claudeSessionId) {
           var shortId = session.claudeSessionId.slice(0, 8);
           sessionIdDisplay = '<span class="session-id" title="' + escapeHtml(session.claudeSessionId) + '">' + escapeHtml(shortId) + '</span>';
           if (session.status !== "running" && !state.sessionsManageMode && !isStructuredSession(session)) {
@@ -1834,12 +2322,20 @@
         '</div>';
       }
 
+      function renderWorktreeBadge(session) {
+        if (!session || !session.worktreeEnabled) return "";
+        var title = session.worktree && session.worktree.branch
+          ? ' title="' + escapeHtml('Worktree: ' + session.worktree.branch) + '"'
+          : '';
+        return '<span class="session-kind-badge worktree"' + title + '>Worktree</span>';
+      }
+
       function renderSessionKindBadge(session) {
         if (!session) return "";
-        if (isStructuredSession(session)) {
-          return '<span class="session-kind-badge structured">Structured</span>';
-        }
-        return '<span class="session-kind-badge pty">PTY</span>';
+        var primary = isStructuredSession(session)
+          ? '<span class="session-kind-badge structured">Structured</span>'
+          : '<span class="session-kind-badge pty">PTY</span>';
+        return primary + renderWorktreeBadge(session);
       }
 
       function renderModeCards(selectedMode) {
@@ -1859,6 +2355,20 @@
         }).join("");
       }
 
+      function renderProviderOptions(selectedTool) {
+        var tools = [
+          { id: "claude", label: "Claude", desc: "完整 Claude 会话能力" },
+          { id: "codex", label: "Codex", desc: "PTY 透传，全权限启动" }
+        ];
+        return tools.map(function(tool) {
+          var active = tool.id === selectedTool ? " active" : "";
+          return '<button type="button" class="mode-card provider-card' + active + '" data-provider="' + tool.id + '">' +
+            '<span class="mode-card-label">' + tool.label + '</span>' +
+            '<span class="mode-card-desc">' + tool.desc + '</span>' +
+          '</button>';
+        }).join("");
+      }
+
       function renderSessionKindOptions(selectedKind) {
         var kinds = [
           { id: "structured", label: "结构化", desc: "智能对话模式" },
@@ -1866,17 +2376,29 @@
         ];
         return kinds.map(function(kind) {
           var active = kind.id === selectedKind ? " active" : "";
-          return '<button type="button" class="mode-card session-kind-card' + active + '" data-session-kind="' + kind.id + '">' +
+          var disabled = (state.sessionTool === "codex" && kind.id === "structured") ? " disabled" : "";
+          return '<button type="button" class="mode-card session-kind-card' + active + disabled + '" data-session-kind="' + kind.id + '">' +
             '<span class="mode-card-label">' + kind.label + '</span>' +
             '<span class="mode-card-desc">' + kind.desc + '</span>' +
           '</button>';
         }).join("");
       }
 
+      function renderWorktreeToggle(enabled) {
+        return '<label class="session-inline-toggle" for="session-worktree-toggle">' +
+          '<input id="session-worktree-toggle" type="checkbox" class="field-checkbox"' + (enabled ? ' checked' : '') + ' />' +
+          '<span class="session-inline-toggle-label">Worktree 模式</span>' +
+        '</label>';
+      }
+
       function getSessionKindHint(kind) {
+        var tool = state.sessionTool || "claude";
         if (kind === "structured") {
           return "结构化聊天界面，支持多轮对话、流式输出和工具调用展示。";
         }
+        if (tool === "codex") {
+          return "Codex 仅支持 PTY；terminal 是原始输出，chat 是解析后的阅读视图。";
+        }
         return "原始 PTY 终端会话，支持持续交互、终端视图和权限流。";
       }
 
@@ -1884,22 +2406,32 @@
         var modalTool = getPreferredTool();
         var modalMode = getSafeModeForTool(modalTool, state.modeValue || state.chatMode || "default");
         var sessionKind = state.sessionCreateKind || "structured";
+        var worktreeEnabled = state.sessionCreateWorktree === true;
         return '<section id="session-modal" class="modal-backdrop hidden">' +
           '<div class="modal session-modal">' +
             '<div class="modal-header">' +
               '<div>' +
                 '<h2 class="modal-title">新对话</h2>' +
-                '<p class="modal-subtitle">启动 Claude 会话，选择会话类型、模式和工作目录。</p>' +
+                '<p class="modal-subtitle">启动 Claude 或 Codex 会话，选择 provider、会话类型、模式和工作目录。</p>' +
               '</div>' +
               '<button id="close-modal-button" class="btn btn-ghost btn-icon">&times;</button>' +
             '</div>' +
             '<div class="modal-body">' +
+              '<div class="field">' +
+                '<label class="field-label">Provider</label>' +
+                '<div id="provider-cards" class="mode-cards">' +
+                  renderProviderOptions(modalTool) +
+                '</div>' +
+              '</div>' +
               '<div class="field">' +
                 '<label class="field-label">会话类型</label>' +
                 '<div id="session-kind-cards" class="mode-cards">' +
                   renderSessionKindOptions(sessionKind) +
                 '</div>' +
-                '<p id="session-kind-description" class="field-hint">' + escapeHtml(getSessionKindHint(sessionKind)) + '</p>' +
+                '<div class="field-hint session-kind-hint-row">' +
+                  '<span id="session-kind-description">' + escapeHtml(getSessionKindHint(sessionKind)) + '</span>' +
+                  renderWorktreeToggle(worktreeEnabled) +
+                '</div>' +
               '</div>' +
               '<div class="field">' +
                 '<label class="field-label">模式</label>' +
@@ -1927,7 +2459,10 @@
       // Global toggle function for tool card headers — called via onclick attribute
       window.__tcToggle = function(e, headerEl) {
         var card = headerEl.closest(".tool-use-card");
-        if (card) card.classList.toggle("collapsed");
+        if (card) {
+          card.classList.toggle("collapsed");
+          persistElementExpandState(card, "tool-card");
+        }
         if (e) { e.preventDefault(); e.stopPropagation(); }
       };
       // Toggle function for inline thinking blocks — called via onclick attribute
@@ -1947,6 +2482,7 @@
           var action = el.querySelector(".thinking-inline-action");
           if (action) action.textContent = "展开";
         }
+        persistElementExpandState(el, "thinking");
       };
       // Toggle function for inline tool rows (Read, Glob, Grep, etc.)
       window.__inlineToolToggle = function(el) {
@@ -1964,6 +2500,7 @@
             statusSpan.textContent = "✓";
           }
         }
+        persistElementExpandState(el, "inline-tool");
       };
       // Toggle function for terminal tool blocks
       window.__terminalExpand = function(el) {
@@ -1976,6 +2513,7 @@
           container.dataset.expanded = isHidden ? "true" : "false";
           var toggleIcon = el.querySelector(".term-toggle-icon");
           if (toggleIcon) toggleIcon.textContent = isHidden ? "▼" : "▶";
+          persistElementExpandState(container, "terminal");
         }
       };
       // Update streaming thinking content (called from WebSocket handler)
@@ -2075,6 +2613,15 @@
             quickStartSession();
           });
         }
+        var welcomeCodexBtn = document.getElementById("welcome-tool-codex");
+        if (welcomeCodexBtn) {
+          welcomeCodexBtn.addEventListener("click", function() {
+            state.sessionTool = "codex";
+            state.preferredCommand = "codex";
+            state.modeValue = "full-access";
+            quickStartSession();
+          });
+        }
         var welcomeStructuredBtn = document.getElementById("welcome-tool-structured");
         if (welcomeStructuredBtn) {
           welcomeStructuredBtn.addEventListener("click", function() {
@@ -2097,10 +2644,26 @@
         // Claude session ID badge click-to-copy (event delegation on document)
         document.addEventListener("click", handleClaudeIdCopy);
 
+        var providerCardsEl = document.getElementById("provider-cards");
+        if (providerCardsEl) providerCardsEl.addEventListener("click", function(e) {
+          var card = e.target.closest(".provider-card");
+          if (!card || card.classList.contains("disabled")) return;
+          var provider = card.getAttribute("data-provider");
+          if (provider) {
+            state.sessionTool = provider;
+            state.preferredCommand = provider;
+            if (provider === "codex") {
+              state.sessionCreateKind = "pty";
+              state.modeValue = "full-access";
+            }
+            syncSessionModalUI();
+          }
+        });
+
         var kindCardsEl = document.getElementById("session-kind-cards");
         if (kindCardsEl) kindCardsEl.addEventListener("click", function(e) {
           var card = e.target.closest(".session-kind-card");
-          if (!card) return;
+          if (!card || card.classList.contains("disabled")) return;
           var kind = card.getAttribute("data-session-kind");
           if (kind) {
             state.sessionCreateKind = kind;
@@ -2118,6 +2681,10 @@
             syncSessionModalUI();
           }
         });
+        var worktreeToggleEl = document.getElementById("session-worktree-toggle");
+        if (worktreeToggleEl) worktreeToggleEl.addEventListener("change", function() {
+          state.sessionCreateWorktree = this.checked;
+        });
         var cwdEl = document.getElementById("cwd");
         if (cwdEl) {
           cwdEl.addEventListener("input", function() { state.cwdValue = this.value; });
@@ -2219,6 +2786,9 @@
           inputBox.addEventListener("keydown", handleInputBoxKeydown);
           inputBox.addEventListener("paste", handleInputPaste);
           inputBox.addEventListener("input", function() {
+            if (handleInteractiveTextInput(inputBox)) {
+              return;
+            }
             refreshInputBoxState(inputBox);
             setDraftValue(inputBox.value, true);
           });
@@ -2233,6 +2803,8 @@
         // View toggle handlers
         var viewTermBtn = document.getElementById("view-terminal-btn");
         if (viewTermBtn) viewTermBtn.addEventListener("click", function() { setView("terminal"); });
+        var viewChatBtn = document.getElementById("view-chat-btn");
+        if (viewChatBtn) viewChatBtn.addEventListener("click", function() { setView("chat"); });
         // Terminal interactive toggle (both topbar and terminal-header)
         var terminalInteractiveToggles = ["terminal-interactive-toggle-top"];
         terminalInteractiveToggles.forEach(function(id) {
@@ -2312,8 +2884,18 @@
         if (jumpBottomBtn) jumpBottomBtn.addEventListener("click", function() {
           maybeScrollTerminalToBottom("force");
         });
-
-        // File explorer
+        var chatFollowToggle = document.getElementById("chat-follow-toggle");
+        if (chatFollowToggle) chatFollowToggle.addEventListener("click", function() {
+          if (state.chatAutoFollow) {
+            setChatAutoFollow(false, { scrollNow: false });
+          } else {
+            setChatAutoFollow(true, { scrollNow: true, smooth: false });
+          }
+        });
+        var chatJumpBottomBtn = document.getElementById("chat-jump-bottom");
+        if (chatJumpBottomBtn) chatJumpBottomBtn.addEventListener("click", function() {
+          setChatAutoFollow(true, { scrollNow: true, smooth: true });
+        });
         var fileRefresh = document.getElementById("file-explorer-refresh");
         if (fileRefresh) fileRefresh.addEventListener("click", refreshFileExplorer);
 
@@ -2959,8 +3541,8 @@
 
       function setTerminalManualScrollActive() {
         state.terminalAutoFollow = false;
+        clearTerminalScrollIdleTimer();
         updateTerminalJumpToBottomButton();
-        scheduleTerminalResumeFollow();
       }
 
       function maybeScrollTerminalToBottom(reason) {
@@ -3171,6 +3753,7 @@
         var shouldScroll = opts.scroll !== false;
         var sessionChanged = state.terminalSessionId !== nextSessionId;
         var currentOutput = state.terminalOutput || "";
+        var liveChunkStream = !!(nextSessionId && state.terminalLiveStreamSessions[nextSessionId]);
         var wrote = false;
 
         if (normalizedOutput === currentOutput && !sessionChanged) {
@@ -3199,6 +3782,10 @@
         } else if (normalizedOutput.length < currentOutput.length && !sessionChanged) {
           // Ignore regressive snapshots for the active session; wait for an explicit replace.
           return false;
+        } else if (liveChunkStream && !sessionChanged && mode !== "replace" && currentOutput && !normalizedOutput.startsWith(currentOutput)) {
+          // When a session is already streaming live chunks, do not let polled snapshots
+          // rewrite the terminal unless they are strict appends of what we've rendered.
+          return false;
         } else if (normalizedOutput.startsWith(currentOutput)) {
           var delta = normalizedOutput.slice(currentOutput.length);
           if (delta) {
@@ -3352,7 +3939,7 @@
         if (state.selectedId) {
           var session = state.sessions.find(function(s) { return s.id === state.selectedId; });
           if (session) {
-            syncTerminalBuffer(session.id, session.output || "", { mode: "replace", scroll: false });
+            syncTerminalBuffer(session.id, session.output || "", { mode: "append", scroll: false });
           }
         } else {
           state.terminal.writeln("点击上方「新对话」开始你的第一次对话。");
@@ -3467,14 +4054,38 @@
       }
 
       function getPreferredTool() {
-        return "claude";
+        return state.sessionTool || state.preferredCommand || "claude";
       }
 
       function getComposerTool() {
-        return "claude";
+        var selected = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        return (selected && selected.provider) || state.preferredCommand || "claude";
+      }
+
+      function getComposerPlaceholder(session, terminalInteractive) {
+        if (terminalInteractive) {
+          return "终端交互模式开启中，请直接在终端中输入";
+        }
+        if (session && session.provider === "codex") {
+          if (session.status !== "running") {
+            return "Codex 会话已结束，无法继续发送";
+          }
+          return state.currentView === "terminal"
+            ? "向 Codex 发送输入；terminal 为原始 TUI 输出"
+            : "向 Codex 发送输入；chat 为解析后的阅读视图";
+        }
+        if (session && !isStructuredSession(session) && session.status !== "running") {
+          return "会话已结束，无法继续发送";
+        }
+        return session && isStructuredSession(session) && session.structuredState && session.structuredState.inFlight
+          ? "思考中，可继续发送，消息会自动排队"
+          : "输入消息...";
       }
 
       function getToolModeHint(tool, mode) {
+        if (tool === "codex") {
+          return "Codex 当前仅支持 PTY 透传，并固定以 full-access 启动。";
+        }
         if (mode === "full-access") {
           return "自动确认权限请求与高权限操作，适合你确认环境安全后的连续修改。";
         }
@@ -3491,6 +4102,9 @@
       }
 
       function getSupportedModes(tool) {
+        if (tool === "codex") {
+          return ["full-access"];
+        }
         return ["default", "full-access", "auto-edit", "native", "managed"];
       }
 
@@ -3523,13 +4137,21 @@
       }
 
       function getSessionKindLabel(session) {
-        return isStructuredSession(session) ? "结构化" : "终端";
+        var provider = session && session.provider ? session.provider : "claude";
+        return (isStructuredSession(session) ? "结构化" : "终端") + " · " + provider;
       }
 
       function getSessionKindDescription(session) {
         return isStructuredSession(session)
           ? "结构化 · 块级记录"
-          : "终端 · PTY 会话";
+          : (session && session.provider === "codex"
+            ? "终端 · Codex PTY（chat 为解析视图）"
+            : "终端 · PTY 会话");
+      }
+
+      function shouldRequestChatFormat(session) {
+        if (!session) return false;
+        return isStructuredSession(session) || session.provider === "codex";
       }
 
       function isRecoverableToolError(toolResult, nextResult) {
@@ -3546,9 +4168,7 @@
       }
 
       function isStructuredSession(session) {
-        var result = !!session && (session.sessionKind === "structured" || session.runner === "claude-cli-print");
-        if (session) console.log("[WAND] isStructuredSession id:", session.id, "sessionKind:", session.sessionKind, "runner:", session.runner, "=>", result);
-        return result;
+        return !!session && (session.sessionKind === "structured" || session.runner === "claude-cli-print");
       }
 
       function syncComposerModeSelect() {
@@ -3561,12 +4181,13 @@
         if (modeHint) modeHint.textContent = getModeHint(state.chatMode);
       }
 
-      function createStructuredSession(prompt, cwdOverride, modeOverride) {
+      function createStructuredSession(prompt, cwdOverride, modeOverride, worktreeEnabled) {
         var payload = {
           cwd: cwdOverride || getEffectiveCwd(),
           mode: modeOverride || state.chatMode || (state.config && state.config.defaultMode) || "default",
           runner: state.structuredRunner || "claude-cli-print",
-          prompt: prompt || undefined
+          prompt: prompt || undefined,
+          worktreeEnabled: worktreeEnabled === true
         };
         console.log("[WAND] createStructuredSession payload:", JSON.stringify(payload));
         return fetch("/api/structured-sessions", {
@@ -3599,24 +4220,31 @@
       function applyCurrentView() {
         var hasSession = !!state.selectedId;
         var terminalBtn = document.getElementById("view-terminal-btn");
+        var chatBtn = document.getElementById("view-chat-btn");
+        var toggleBar = document.getElementById("view-toggle-bar");
         var terminalContainer = document.getElementById("output");
         var chatContainer = document.getElementById("chat-output");
         var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
         var structured = isStructuredSession(selectedSession);
         var showTerminal = hasSession && !structured && state.currentView === "terminal";
         var showChat = hasSession && (structured || state.currentView !== "terminal");
-        console.log("[WAND] applyCurrentView hasSession:", hasSession, "structured:", structured, "currentView:", state.currentView, "showTerminal:", showTerminal, "showChat:", showChat, "sessionKind:", selectedSession && selectedSession.sessionKind, "runner:", selectedSession && selectedSession.runner);
-
         if (structured) {
           state.currentView = "chat";
         } else if (!hasSession) {
           state.currentView = "terminal";
         }
 
+        if (toggleBar) {
+          toggleBar.classList.toggle("hidden", !hasSession);
+        }
         if (terminalBtn) {
           terminalBtn.classList.toggle("hidden", structured || !hasSession);
           terminalBtn.classList.toggle("active", showTerminal);
         }
+        if (chatBtn) {
+          chatBtn.classList.toggle("hidden", !hasSession);
+          chatBtn.classList.toggle("active", showChat);
+        }
         if (terminalContainer) {
           terminalContainer.classList.toggle("active", showTerminal);
           terminalContainer.classList.toggle("hidden", !showTerminal);
@@ -3625,22 +4253,45 @@
           chatContainer.classList.toggle("active", showChat);
           chatContainer.classList.toggle("hidden", !showChat);
         }
+        if (chatContainer && showChat) {
+          ensureChatMessagesContainer(chatContainer);
+        }
+        bindChatScrollListener();
+        updateChatFollowToggleButton();
+        updateChatJumpToBottomButton();
         updateInteractiveControls();
       }
 
       function syncSessionModalUI() {
         var modeHint = document.getElementById("mode-description");
         var kindHint = document.getElementById("session-kind-description");
-        var tool = "claude";
+        var tool = state.sessionTool || "claude";
         var sessionKind = state.sessionCreateKind || "structured";
 
+        if (tool === "codex" && sessionKind === "structured") {
+          sessionKind = "pty";
+          state.sessionCreateKind = "pty";
+        }
+
         state.sessionTool = tool;
         state.modeValue = getSafeModeForTool(tool, state.modeValue || state.chatMode || "default");
 
+        var providerCards = document.querySelectorAll("#provider-cards .provider-card");
+        if (providerCards.length) {
+          providerCards.forEach(function(card) {
+            var provider = card.getAttribute("data-provider");
+            card.classList.toggle("active", provider === tool);
+            card.classList.remove("disabled");
+          });
+        }
+
         var kindCards = document.querySelectorAll("#session-kind-cards .session-kind-card");
         if (kindCards.length) {
           kindCards.forEach(function(card) {
-            card.classList.toggle("active", card.getAttribute("data-session-kind") === sessionKind);
+            var kind = card.getAttribute("data-session-kind");
+            var disabled = tool === "codex" && kind === "structured";
+            card.classList.toggle("active", kind === sessionKind);
+            card.classList.toggle("disabled", disabled);
           });
         }
 
@@ -3657,33 +4308,31 @@
 
       function updateSessionSnapshot(snapshot) {
         if (!snapshot || !snapshot.id) return;
-        if (snapshot.id === state.selectedId || (snapshot.sessionKind === "structured") || snapshot.structuredState) {
-          console.log("[WAND] updateSessionSnapshot", snapshot.id, JSON.stringify({
-            status: snapshot.status,
-            exitCode: snapshot.exitCode,
-            sessionKind: snapshot.sessionKind,
-            runner: snapshot.runner,
-            inFlight: snapshot.structuredState && snapshot.structuredState.inFlight,
-            msgCount: snapshot.messages && snapshot.messages.length
-          }));
-        }
+        var currentSession = state.sessions.find(function(session) { return session.id === snapshot.id; }) || null;
+        var normalizedSnapshot = normalizeStructuredSnapshot(snapshot, currentSession);
         var updated = false;
         var prevSession = null;
         state.sessions = state.sessions.map(function(session) {
-          if (session.id !== snapshot.id) return session;
+          if (session.id !== normalizedSnapshot.id) return session;
           prevSession = session;
           updated = true;
-          return Object.assign({}, session, snapshot);
+          return Object.assign({}, session, normalizedSnapshot);
         });
         if (!updated) {
-          state.sessions.unshift(snapshot);
+          state.sessions.unshift(normalizedSnapshot);
+        }
+        var updatedSession = state.sessions.find(function(session) { return session.id === normalizedSnapshot.id; }) || normalizedSnapshot;
+        if (updatedSession && Array.isArray(updatedSession.queuedMessages) && normalizedSnapshot.id === state.selectedId) {
+          syncStructuredQueueFromSession(updatedSession);
+          saveStructuredQueue();
+          updateStructuredQueueCounter();
         }
-        if (snapshot.id === state.selectedId) {
+        if (normalizedSnapshot.id === state.selectedId) {
           reconcileInteractiveState();
           updateTaskDisplay();
         }
         // When a session transitions to a non-running state, try flushing cross-session queue
-        if (snapshot.status && snapshot.status !== "running" && state.crossSessionQueue.length > 0) {
+        if (normalizedSnapshot.status && normalizedSnapshot.status !== "running" && state.crossSessionQueue.length > 0) {
           // Use setTimeout(0) to let the current event processing complete first
           setTimeout(flushCrossSessionQueue, 0);
         }
@@ -3703,6 +4352,7 @@
         var keepLocalOutput = localOutput.length > serverOutput.length;
         var localStructuredState = localSession.structuredState || null;
         var serverStructuredState = serverSession.structuredState || null;
+        var structuredSession = (localSession.sessionKind === "structured") || (serverSession.sessionKind === "structured");
         var localHasPendingAssistant = !!(localSession.messages && localSession.messages.length && (function() {
           var last = localSession.messages[localSession.messages.length - 1];
           return last && last.role === "assistant" && Array.isArray(last.content) && last.content.some(function(block) {
@@ -3716,6 +4366,16 @@
           && localHasPendingAssistant
           && !!localStructuredState.activeRequestId
           && (!serverStructuredState || !serverStructuredState.activeRequestId || serverStructuredState.activeRequestId === localStructuredState.activeRequestId);
+        var localMessages = Array.isArray(localSession.messages)
+          ? (structuredSession ? stripRenderOnlyStructuredMessages(localSession.messages) : localSession.messages)
+          : [];
+        var serverMessages = Array.isArray(serverSession.messages)
+          ? (structuredSession ? stripRenderOnlyStructuredMessages(serverSession.messages) : serverSession.messages)
+          : [];
+        var preserveLocalMessages = localMessages.length > serverMessages.length
+          || (localMessages.length > 0 && serverMessages.length > 0
+            && JSON.stringify(localMessages[localMessages.length - 1]) !== JSON.stringify(serverMessages[serverMessages.length - 1])
+            && JSON.stringify(localMessages).length > JSON.stringify(serverMessages).length);
 
         if (keepLocalOutput) {
           merged.output = localOutput;
@@ -3727,6 +4387,10 @@
           merged.messages = localSession.messages;
         }
 
+        if (preserveLocalMessages) {
+          merged.messages = localMessages;
+        }
+
         if (localSession.id === state.selectedId) {
           if (localSession.permissionBlocked && serverSession.permissionBlocked === false) {
           } else if (localSession.permissionBlocked && !serverSession.permissionBlocked) {
@@ -3749,6 +4413,9 @@
         if (session && session.messages && session.messages.length > 0) {
           return session.messages;
         }
+        if (session && session.sessionKind === "structured") {
+          return [];
+        }
         if (!allowFallback) {
           return [];
         }
@@ -3774,7 +4441,8 @@
         return recent ? recent.id : sessions[0].id;
       }
 
-      function loadSessions() {
+      function loadSessions(options) {
+        var opts = options || {};
         return fetch("/api/sessions", { credentials: "same-origin" })
           .then(function(res) {
             if (res.status === 401) {
@@ -3800,6 +4468,9 @@
             if (preferredSessionId !== undefined) {
               state.selectedId = preferredSessionId;
             }
+            restoreStructuredQueue();
+            updateStructuredQueueCounter();
+            state.bootstrapping = false;
             persistSelectedId();
             if (state.modalOpen) {
               updateSessionsList();
@@ -3817,23 +4488,34 @@
             }
             updateShellChrome();
 
-            // For structured sessions, loadOutput is needed to fetch messages
-            // (the sessions list endpoint doesn't include them).
-            // On page refresh this is the only place that can trigger it.
-            if (state.selectedId) {
+            var reloadPromise = Promise.resolve();
+            if (!opts.skipSelectedOutputReload && state.selectedId) {
+              reloadPromise = loadOutput(state.selectedId);
+            } else if (state.selectedId) {
               var sel = state.sessions.find(function(s) { return s.id === state.selectedId; });
               if (isStructuredSession(sel)) {
-                loadOutput(state.selectedId);
+                resetChatRenderCache();
+                scheduleChatRender(true);
               }
             }
 
-            // Try to flush cross-session queue on every session list refresh
-            if (state.crossSessionQueue.length > 0) {
-              flushCrossSessionQueue();
-            }
+            return reloadPromise.then(function() {
+              if (state.crossSessionQueue.length > 0) {
+                flushCrossSessionQueue();
+              }
+              renderCrossSessionQueue();
+            });
           })
           .catch(function(e) {
-            console.error("[wand] loadSessions failed:", e);
+            var message = (e && e.message) || "";
+            var isTransientAbort =
+              message === "Failed to fetch" ||
+              message === "NetworkError when attempting to fetch resource." ||
+              message === "Load failed" ||
+              /aborted|aborterror|networkerror|failed to fetch/i.test(message);
+            if (!isTransientAbort) {
+              console.error("[wand] loadSessions failed:", e);
+            }
           });
       }
 
@@ -3896,7 +4578,7 @@
         }
 
         if (selectedSession && state.terminal) {
-          syncTerminalBuffer(selectedSession.id, selectedSession.output || "", { mode: "replace" });
+          syncTerminalBuffer(selectedSession.id, selectedSession.output || "", { mode: "append", scroll: false });
         } else if (!selectedSession) {
           state.terminalSessionId = null;
           state.terminalOutput = "";
@@ -3933,7 +4615,7 @@
         }
         var sess = state.sessions.find(function(s) { return s.id === id; });
         var url = "/api/sessions/" + id;
-        if (isStructuredSession(sess)) {
+        if (shouldRequestChatFormat(sess)) {
           url += "?format=chat";
         }
         return fetch(url, { credentials: "same-origin" })
@@ -3952,14 +4634,7 @@
             updateShellChrome();
 
             var selectedSession = state.sessions.find(function(s) { return s.id === id; });
-            state.currentMessages = getPreferredMessages(selectedSession, data.output, false);
-            if (selectedSession && selectedSession.sessionKind === "structured") {
-              appendQueuedPlaceholders(state.currentMessages);
-            }
-
-            if (state.terminal) {
-              syncTerminalBuffer(id, data.output || "", { mode: "replace" });
-            }
+              state.currentMessages = buildMessagesForRender(selectedSession, getPreferredMessages(selectedSession, data.output, false));
 
             renderChat(false);
           });
@@ -3967,9 +4642,7 @@
 
       function selectSession(id) {
         var foundSession = state.sessions.find(function(item) { return item.id === id; });
-        console.log("[WAND] selectSession id:", id, "found:", !!foundSession, "sessionKind:", foundSession && foundSession.sessionKind, "runner:", foundSession && foundSession.runner, "isStructured:", isStructuredSession(foundSession));
         if (!foundSession) {
-          console.warn("[WAND] selectSession: session not found, skipping", id);
           return;
         }
         state.selectedId = id;
@@ -3977,7 +4650,8 @@
         // Clear queued inputs from the previous session to prevent cross-session leaks
         state.messageQueue = [];
         state.pendingMessages = [];
-        state.structuredInputQueue = [];
+        syncStructuredQueueFromSession(foundSession);
+        restoreStructuredQueue();
         updateStructuredQueueCounter();
         resetChatRenderCache();
         state.currentMessages = [];
@@ -4054,7 +4728,9 @@
           modal.classList.remove("hidden");
           lastFocusedElement = document.activeElement;
           state.sessionTool = getPreferredTool();
-          state.sessionCreateKind = "structured";
+          state.preferredCommand = state.sessionTool;
+          state.sessionCreateKind = state.sessionTool === "codex" ? "pty" : "structured";
+          state.sessionCreateWorktree = false;
           state.modeValue = getSafeModeForTool(state.sessionTool, state.modeValue || state.chatMode);
           syncSessionModalUI();
           loadRecentPathBubbles();
@@ -4553,14 +5229,14 @@
       function quickStartSession() {
         var command = getPreferredTool();
         var defaultCwd = getEffectiveCwd();
-        var defaultMode = (state.config && state.config.defaultMode) ? state.config.defaultMode : "default";
+        var defaultMode = getSafeModeForTool(command, (state.config && state.config.defaultMode) ? state.config.defaultMode : "default");
         state.preferredCommand = command;
         state.chatMode = getSafeModeForTool(command, state.chatMode);
         fetch("/api/commands", {
           method: "POST",
           headers: { "Content-Type": "application/json" },
           credentials: "same-origin",
-          body: JSON.stringify({ command: command, cwd: defaultCwd, mode: defaultMode })
+          body: JSON.stringify({ command: command, provider: command, cwd: defaultCwd, mode: defaultMode })
         })
         .then(function(res) { return res.json(); })
         .then(function(data) {
@@ -4588,6 +5264,7 @@
         var errorEl = document.getElementById("modal-error");
         var command = getPreferredTool();
         var sessionKind = state.sessionCreateKind || "structured";
+        var worktreeEnabled = state.sessionCreateWorktree === true;
 
         hideError(errorEl);
 
@@ -4596,22 +5273,22 @@
         var selectedMode = getSafeModeForTool(command, state.modeValue);
 
         if (sessionKind === "structured") {
-          startStructuredSessionFromModal(cwd, selectedMode, errorEl);
+          startStructuredSessionFromModal(cwd, selectedMode, worktreeEnabled, errorEl);
           return;
         }
 
-        runPtyCommandFromModal(command, cwd, selectedMode, errorEl);
+        runPtyCommandFromModal(command, cwd, selectedMode, worktreeEnabled, errorEl);
       }
 
-      function startStructuredSessionFromModal(cwd, mode, errorEl) {
-        console.log("[WAND] startStructuredSessionFromModal cwd:", cwd, "mode:", mode);
+      function startStructuredSessionFromModal(cwd, mode, worktreeEnabled, errorEl) {
+        console.log("[WAND] startStructuredSessionFromModal cwd:", cwd, "mode:", mode, "worktreeEnabled:", worktreeEnabled);
         _sessionCreating = true;
         state.modeValue = mode;
         state.chatMode = mode;
         state.sessionTool = "claude";
         state.preferredCommand = "claude";
         syncComposerModeSelect();
-        return createStructuredSession(undefined, cwd, mode)
+        return createStructuredSession(undefined, cwd, mode, worktreeEnabled)
           .then(function(data) {
             saveWorkingDir(cwd);
             closeSessionModal();
@@ -4625,8 +5302,8 @@
           .finally(function() { _sessionCreating = false; });
       }
 
-      function runPtyCommandFromModal(command, cwd, mode, errorEl) {
-        console.log("[WAND] runPtyCommandFromModal command:", command, "cwd:", cwd, "mode:", mode);
+      function runPtyCommandFromModal(command, cwd, mode, worktreeEnabled, errorEl) {
+        console.log("[WAND] runPtyCommandFromModal command:", command, "cwd:", cwd, "mode:", mode, "worktreeEnabled:", worktreeEnabled);
         _sessionCreating = true;
         state.modeValue = mode;
         state.chatMode = mode;
@@ -4640,8 +5317,10 @@
           credentials: "same-origin",
           body: JSON.stringify({
             command: command,
+            provider: command,
             cwd: cwd,
-            mode: mode
+            mode: mode,
+            worktreeEnabled: worktreeEnabled
           })
         })
         .then(function(res) { return res.json(); })
@@ -4669,7 +5348,9 @@
           }
         })
         .catch(function() {
-          showError(errorEl, "无法启动会话，请确认 Claude 已正确安装。");
+          showError(errorEl, command === "codex"
+            ? "无法启动 Codex 会话，请确认 codex 已正确安装并可在终端中执行。"
+            : "无法启动 Claude 会话，请确认 Claude 已正确安装。");
         })
         .finally(function() { _sessionCreating = false; });
       }
@@ -4957,10 +5638,25 @@
         }
       }
 
+      function handleInteractiveTextInput(inputBox) {
+        if (!state.terminalInteractive || !inputBox) return false;
+        var value = inputBox.value || "";
+        if (!value) return false;
+        queueDirectInput(value, "interactive_text").catch(function() {});
+        inputBox.value = "";
+        autoResizeInput(inputBox);
+        setDraftValue("", true);
+        return true;
+      }
+
       function handleInputPaste(event) {
         var pasted = event.clipboardData && event.clipboardData.getData("text");
         if (!pasted) return;
         event.preventDefault();
+        if (state.terminalInteractive) {
+          queueDirectInput(pasted, "paste").catch(function() {});
+          return;
+        }
         var inputBox = document.getElementById("input-box");
         if (inputBox) {
           var start = inputBox.selectionStart || 0;
@@ -5065,6 +5761,7 @@
           tool: getPreferredTool(),
           queuedAt: Date.now()
         });
+        persistCrossSessionQueue();
         renderCrossSessionQueue();
       }
 
@@ -5089,6 +5786,7 @@
             showToast(data.error, "error");
             // 失败回填队首，不丢消息
             state.crossSessionQueue.unshift(item);
+            persistCrossSessionQueue();
             renderCrossSessionQueue();
             return null;
           }
@@ -5098,6 +5796,7 @@
           _queueLaunching = false;
           showToast((error && error.message) || "无法启动排队会话。", "error");
           state.crossSessionQueue.unshift(item);
+          persistCrossSessionQueue();
           renderCrossSessionQueue();
         });
       }
@@ -5106,6 +5805,7 @@
         var idx = state.crossSessionQueue.findIndex(function(q) { return q.id === queueId; });
         if (idx < 0) return;
         var item = state.crossSessionQueue.splice(idx, 1)[0];
+        persistCrossSessionQueue();
         renderCrossSessionQueue();
         // 立即发送不受 _queueLaunching 限制
         fetch("/api/commands", {
@@ -5123,12 +5823,18 @@
         .then(function(data) {
           if (data.error) {
             showToast(data.error, "error");
+            state.crossSessionQueue.splice(idx, 0, item);
+            persistCrossSessionQueue();
+            renderCrossSessionQueue();
             return null;
           }
           return activateSession(data);
         })
         .catch(function(error) {
           showToast((error && error.message) || "无法启动排队会话。", "error");
+          state.crossSessionQueue.splice(idx, 0, item);
+          persistCrossSessionQueue();
+          renderCrossSessionQueue();
         });
       }
 
@@ -5136,6 +5842,7 @@
         var idx = state.crossSessionQueue.findIndex(function(q) { return q.id === queueId; });
         if (idx < 0) return;
         state.crossSessionQueue.splice(idx, 1);
+        persistCrossSessionQueue();
         renderCrossSessionQueue();
         if (state.crossSessionQueue.length === 0) {
           showToast("排队已清空。", "info");
@@ -5168,6 +5875,7 @@
 
         if (state.crossSessionQueue.length === 0) {
           if (container) container.remove();
+          persistCrossSessionQueue();
           return;
         }
 
@@ -5239,6 +5947,7 @@
         if (e.target.closest("#queue-clear-all")) {
           e.preventDefault();
           state.crossSessionQueue = [];
+          persistCrossSessionQueue();
           renderCrossSessionQueue();
           showToast("排队已清空。", "info");
           return;
@@ -5286,6 +5995,7 @@
           credentials: "same-origin",
           body: JSON.stringify({
             command: preferredTool,
+            provider: preferredTool,
             cwd: defaultCwd,
             mode: mode,
             initialInput: value
@@ -5314,7 +6024,9 @@
           });
         })
         .catch(function(error) {
-          showToast((error && error.message) || "无法启动会话。", "error");
+          showToast((error && error.message) || (preferredTool === "codex"
+            ? "无法启动 Codex 会话。"
+            : "无法启动 Claude 会话。"), "error");
           welcomeInput.placeholder = "输入你的问题，按 Enter 发送...";
           welcomeInput.disabled = false;
         });
@@ -5353,6 +6065,7 @@
           credentials: "same-origin",
           body: JSON.stringify({
             command: preferredTool,
+            provider: preferredTool,
             cwd: defaultCwd,
             mode: mode,
             initialInput: value || undefined
@@ -5378,7 +6091,9 @@
           return loadOutput(data.id);
         })
         .catch(function(error) {
-          showToast((error && error.message) || "无法启动会话。", "error");
+          showToast((error && error.message) || (preferredTool === "codex"
+            ? "无法启动 Codex 会话。"
+            : "无法启动 Claude 会话。"), "error");
         });
       }
 
@@ -5434,7 +6149,7 @@
 
         var inputBox = document.getElementById("input-box");
         var value = inputBox ? inputBox.value : "";
-        var selectedSession = state.sessions.find(function(session) { return session.id === state.selectedId; }) || null;
+        var selectedSession = getSelectedSession();
         if (value) {
           console.log("[WAND] sendInputFromBox", {
             sessionId: state.selectedId,
@@ -5455,16 +6170,12 @@
             return postStructuredInput(value, inputBox, selectedSession);
           }
 
-          // Send text + Enter as a single call to avoid race conditions
-          var combinedInput = value + getControlInput("enter");
+          var submitChunks = getTerminalSubmitChunks(selectedSession, value);
           var isOffline = !state.wsConnected;
 
           if (isOffline) {
             // Offline: queue for flush on reconnect, clear input immediately
-            if (state.pendingMessages.length >= 100) {
-              state.pendingMessages.shift();
-            }
-            state.pendingMessages.push(combinedInput);
+            queueOfflineTerminalChunks(submitChunks);
             if (inputBox) {
               inputBox.value = "";
               autoResizeInput(inputBox);
@@ -5479,7 +6190,11 @@
               showToast("会话未就绪，将稍后重试。", "info");
               return null;
             }
-            return queueDirectInput(combinedInput, "enter_text").then(function() {
+            var submitView = state.currentView;
+            if (readySession && readySession.provider === "codex" && state.selectedId !== readySession.id) {
+              throw new Error("Codex session changed before input send.");
+            }
+            return sendTerminalChunks(submitChunks, "enter_text", 0, submitView).then(function() {
               // Clear input only after the send succeeds
               if (inputBox && inputBox.value === value) {
                 inputBox.value = "";
@@ -5502,58 +6217,32 @@
           showToast("会话不存在，请重新选择或新建会话。", "error");
           return Promise.resolve();
         }
-        if (session.structuredState && session.structuredState.inFlight && session.status === "running") {
-          // Queue the message for sending after current processing completes
-          if (state.structuredInputQueue.length >= 10) {
-            showToast("排队消息已满（最多 10 条），请等待当前消息处理完成。", "warning");
-            return Promise.resolve();
-          }
-          state.structuredInputQueue.push(input);
-          if (inputBox) {
-            inputBox.value = "";
-            autoResizeInput(inputBox);
-          }
-          setDraftValue("");
-          // Show the queued message in chat view with a "queued" marker
-          var queuedTurn = { role: "user", content: [{ type: "text", text: input, __queued: true }] };
-          var curMsgs = Array.isArray(state.currentMessages) ? state.currentMessages.slice() : [];
-          curMsgs.push(queuedTurn);
-          state.currentMessages = curMsgs;
-          // Also update session.messages so the queued turn survives WS updates
-          session.messages = curMsgs;
+
+        var isQueueing = !!(session.structuredState && session.structuredState.inFlight && session.status === "running");
+        if (!isQueueing) {
+          // Immediately render user message with thinking indicator
+          var userTurn = { role: "user", content: [{ type: "text", text: input }] };
+          var userMsgs = stripRenderOnlyStructuredMessages(Array.isArray(session.messages) ? session.messages.slice() : []);
+          userMsgs.push(userTurn);
+          var optimisticStructuredState = Object.assign({}, session.structuredState || {}, { inFlight: true });
+          updateSessionSnapshot({
+            id: session.id,
+            status: "running",
+            structuredState: optimisticStructuredState,
+          });
+          state.currentMessages = buildMessagesForRender(Object.assign({}, session, {
+            status: "running",
+            structuredState: optimisticStructuredState,
+          }), userMsgs);
+          updateInputHint("思考中…");
           renderChat(true);
-          showToast("已排队（第 " + state.structuredInputQueue.length + " 条），将在当前消息处理完成后自动发送。", "info");
-          updateStructuredQueueCounter();
-          return Promise.resolve();
         }
 
-        // Immediately render user message with thinking indicator
-        var userTurn = { role: "user", content: [{ type: "text", text: input }] };
-        var thinkingTurn = { role: "assistant", content: [{ type: "text", text: "", __processing: true }] };
-        var userMsgs = Array.isArray(session.messages) ? session.messages.slice() : [];
-        // Filter out __queued placeholders — they'll be re-appended after the new turns
-        userMsgs = userMsgs.filter(function(m) {
-          return !(m.role === "user" && m.content && m.content.some(function(b) { return b.__queued; }));
-        });
-        userMsgs.push(userTurn);
-        userMsgs.push(thinkingTurn);
-        // Re-append remaining queued messages after the current send
-        appendQueuedPlaceholders(userMsgs);
-        session.messages = userMsgs;
-        state.currentMessages = userMsgs;
-        // Mark inFlight optimistically to prevent double-send via WS updates
-        if (session.structuredState) {
-          session.structuredState.inFlight = true;
-        }
-        session.status = "running";
         if (inputBox) {
           inputBox.value = "";
           autoResizeInput(inputBox);
         }
-        // Keep send button enabled so user can queue more messages
-        updateInputHint("思考中…");
         setDraftValue("");
-        renderChat(true);
 
         return fetch("/api/structured-sessions/" + state.selectedId + "/messages", {
           method: "POST",
@@ -5568,27 +6257,29 @@
           }
           if (snapshot && snapshot.id) {
             updateSessionSnapshot(snapshot);
-            if (snapshot.messages && snapshot.messages.length > 0) {
-              state.currentMessages = snapshot.messages;
-              // Re-append queued user messages
-              appendQueuedPlaceholders(state.currentMessages);
-            }
+            var refreshedSession = state.sessions.find(function(s) { return s.id === snapshot.id; }) || snapshot;
+            state.currentMessages = buildMessagesForRender(refreshedSession, getPreferredMessages(refreshedSession, snapshot.output, false));
             renderChat(true);
-            updateInputHint("Enter 发送 · Shift+Enter 换行");
+            if (isQueueing) {
+              var queuedCount = getStructuredQueuedInputs(refreshedSession).length;
+              showToast("已排队（第 " + queuedCount + " 条），将在当前消息处理完成后自动发送。", "info");
+            } else {
+              updateInputHint("Enter 发送 · Shift+Enter 换行");
+            }
           }
         })
         .catch(function(error) {
-          // Reset inFlight so user can send again
-          if (session.structuredState) {
-            session.structuredState.inFlight = false;
-          }
-          // Clear remaining queued messages since the session is likely broken
-          if (state.structuredInputQueue.length > 0) {
-            var dropped = state.structuredInputQueue.length;
-            state.structuredInputQueue = [];
-            updateStructuredQueueCounter();
-            showToast("发送失败，已清空 " + dropped + " 条排队消息。", "error");
-          } else {
+          updateSessionSnapshot({
+            id: session.id,
+            structuredState: Object.assign({}, session.structuredState || {}, { inFlight: false }),
+          });
+          var message = (error && error.message) || "";
+          var isTransientAbort =
+            message === "Failed to fetch" ||
+            message === "NetworkError when attempting to fetch resource." ||
+            message === "Load failed" ||
+            /aborted|aborterror|networkerror|failed to fetch/i.test(message);
+          if (!isTransientAbort) {
             showToast((error && error.message) || "无法发送结构化消息。", "error");
           }
           updateInputHint("Enter 发送 · Shift+Enter 换行");
@@ -5602,7 +6293,7 @@
 
       function updateStructuredQueueCounter() {
         var counter = document.getElementById("queue-counter");
-        var count = state.structuredInputQueue.length;
+        var count = getSelectedStructuredQueuedInputs().length;
         if (counter) {
           counter.textContent = "队列: " + count;
           if (count > 0) {
@@ -5615,56 +6306,48 @@
 
       // Append queued user message placeholders to currentMessages so they
       // remain visible across WS updates and re-renders.
-      function appendQueuedPlaceholders(messages) {
-        if (state.structuredInputQueue.length === 0) return messages;
-        for (var qi = 0; qi < state.structuredInputQueue.length; qi++) {
-          messages.push({ role: "user", content: [{ type: "text", text: state.structuredInputQueue[qi], __queued: true }] });
+      function buildMessagesForRender(session, messages) {
+        var sanitized = Array.isArray(messages) ? stripRenderOnlyStructuredMessages(messages) : [];
+        var base = Array.isArray(sanitized) ? sanitized.slice() : [];
+        if (!session || session.sessionKind !== "structured") {
+          return base;
         }
-        return messages;
+        var queued = getStructuredQueuedInputs(session);
+        if (queued && queued.length > 0) {
+          for (var qi = 0; qi < queued.length; qi++) {
+            base.push({ role: "user", content: [{ type: "text", text: queued[qi], __queued: true }] });
+          }
+        }
+        if (session.structuredState && session.structuredState.inFlight) {
+          var last = base[base.length - 1];
+          if (!last || last.role !== "assistant") {
+            base.push({ role: "assistant", content: [{ type: "text", text: "", __processing: true }] });
+          }
+        }
+        return base;
       }
 
+
       function flushStructuredInputQueue() {
-        if (state.structuredInputQueue.length === 0) return;
         var session = state.sessions.find(function(s) { return s.id === state.selectedId; });
-        if (!session || session.sessionKind !== "structured") {
-          state.structuredInputQueue = [];
-          updateStructuredQueueCounter();
-          return;
-        }
-        // Only flush if not inFlight
-        if (session.structuredState && session.structuredState.inFlight) return;
-        var nextInput = state.structuredInputQueue.shift();
+        syncStructuredQueueFromSession(session);
         updateStructuredQueueCounter();
-        if (nextInput) {
-          // Remove __queued marker from the matching user turn already in chat.
-          // postStructuredInput will find it's not inFlight now and do the
-          // normal send path, which re-adds the user turn + thinking turn.
-          // So we need to remove the queued placeholder first to avoid duplicates.
-          var msgs = Array.isArray(state.currentMessages) ? state.currentMessages : [];
-          for (var qi = msgs.length - 1; qi >= 0; qi--) {
-            var qm = msgs[qi];
-            if (qm.role === "user" && qm.content && qm.content.some(function(b) {
-              return b.__queued && b.text === nextInput;
-            })) {
-              msgs.splice(qi, 1);
-              break;
-            }
-          }
-          state.currentMessages = msgs;
-          if (session.messages) session.messages = msgs;
-          // Pass null for inputBox to avoid clearing user's current typing
-          postStructuredInput(nextInput, null, session);
-        }
       }
 
       function getInputErrorMessage(error) {
+        var selectedSession = getSelectedSession();
+        var isCodex = selectedSession && selectedSession.provider === "codex";
         if (error && (error.errorCode === "SESSION_NOT_RUNNING" || error.errorCode === "SESSION_NO_PTY")) {
-          return "会话已结束；若存在 Claude 历史会话，将在你下次发送消息时自动恢复。";
+          return isCodex
+            ? "Codex 会话已结束，请新建会话后继续。"
+            : "会话已结束；若存在 Claude 历史会话，将在你下次发送消息时自动恢复。";
         }
         if (error && error.errorCode === "SESSION_NOT_FOUND") {
           return "会话不存在，请重新选择或新建会话。";
         }
-        return (error && error.message) || "会话暂不可用；若存在 Claude 历史会话，将自动尝试恢复。";
+        return (error && error.message) || (isCodex
+          ? "Codex 会话暂不可用，请检查终端视图或新建会话。"
+          : "会话暂不可用；若存在 Claude 历史会话，将自动尝试恢复。");
       }
 
       function buildInputError(payload) {
@@ -5704,7 +6387,7 @@
       }
 
       function canAutoResumeSession(session) {
-        return !!(session && session.status === "exited" && session.claudeSessionId && hasRealConversationHistory(session));
+        return !!(session && session.provider === "claude" && session.status === "exited" && session.claudeSessionId && hasRealConversationHistory(session));
       }
 
       function ensureSessionReadyForInput(session, errorEl) {
@@ -5735,11 +6418,48 @@
         });
       }
 
-      function queueDirectInput(input, shortcutKey) {
+      function getTerminalSubmitChunks(session, text) {
+        if (session && session.provider === "codex") {
+          return [text, String.fromCharCode(13)];
+        }
+        return [text + String.fromCharCode(13)];
+      }
+
+      function sendTerminalChunks(chunks, shortcutKey, delayMs, viewOverride) {
+        var sequence = Array.isArray(chunks) ? chunks.filter(function(chunk) { return !!chunk; }) : [];
+        if (sequence.length === 0) {
+          return Promise.resolve();
+        }
+        var delay = typeof delayMs === "number" ? delayMs : 0;
+        return sequence.reduce(function(promise, chunk, index) {
+          return promise.then(function() {
+            if (index > 0 && delay > 0) {
+              return new Promise(function(resolve) {
+                setTimeout(resolve, delay);
+              }).then(function() {
+                return queueDirectInput(chunk, index === sequence.length - 1 ? shortcutKey : undefined, viewOverride);
+              });
+            }
+            return queueDirectInput(chunk, index === sequence.length - 1 ? shortcutKey : undefined, viewOverride);
+          });
+        }, Promise.resolve());
+      }
+
+      function queueOfflineTerminalChunks(chunks) {
+        var sequence = Array.isArray(chunks) ? chunks.filter(function(chunk) { return !!chunk; }) : [];
+        sequence.forEach(function(chunk) {
+          if (state.pendingMessages.length >= 100) {
+            state.pendingMessages.shift();
+          }
+          state.pendingMessages.push(chunk);
+        });
+      }
+
+      function queueDirectInput(input, shortcutKey, viewOverride) {
         if (!input || !state.selectedId) return Promise.resolve();
         state.messageQueue.push(input);
         state.inputQueue = state.inputQueue.then(function() {
-          return postInput(input, shortcutKey).finally(function() {
+          return postInput(input, shortcutKey, viewOverride).finally(function() {
             var idx = state.messageQueue.indexOf(input);
             if (idx > -1) state.messageQueue.splice(idx, 1);
             scheduleMobileDomUpdate();
@@ -5748,8 +6468,9 @@
         return state.inputQueue;
       }
 
-      function postInput(input, shortcutKey) {
+      function postInput(input, shortcutKey, viewOverride) {
         if (!state.selectedId) return Promise.resolve();
+        var effectiveView = viewOverride || state.currentView;
 
         // Pre-check: don't send if session is not running
         if (!isSelectedSessionRunning()) {
@@ -5788,7 +6509,7 @@
         console.log("[wand] postInput: sending", {
           sessionId: state.selectedId,
           inputLength: input.length,
-          view: state.currentView,
+          view: effectiveView,
           wsConnected: state.wsConnected
         });
 
@@ -5796,7 +6517,7 @@
           method: "POST",
           headers: { "Content-Type": "application/json" },
           credentials: "same-origin",
-          body: JSON.stringify({ input: input, view: state.currentView, shortcutKey: shortcutKey || undefined })
+          body: JSON.stringify({ input: input, view: effectiveView, shortcutKey: shortcutKey || undefined })
         })
         .then(function(res) {
           if (!res.ok) {
@@ -5834,6 +6555,14 @@
         return queueDirectInput(input);
       }
 
+      function getSelectedSession() {
+        return state.sessions.find(function(session) { return session.id === state.selectedId; }) || null;
+      }
+
+      function getTerminalSubmitSequence(session) {
+        return session && session.provider === "codex" ? "\n" : String.fromCharCode(13);
+      }
+
       function isTerminalInteractionAvailable() {
         return !!state.selectedId && state.currentView === "terminal";
       }
@@ -6004,6 +6733,9 @@
       function updateInteractiveControls() {
         var selectedSession = state.sessions.find(function(session) { return session.id === state.selectedId; });
         var structured = isStructuredSession(selectedSession);
+        var isCodex = selectedSession && selectedSession.provider === "codex";
+        var isRunning = !!selectedSession && selectedSession.status === "running";
+        var composer = document.getElementById("input-box");
         // Update both toggle buttons (topbar and terminal-header)
         var toggles = ["terminal-interactive-toggle-top"];
         toggles.forEach(function(id) {
@@ -6019,7 +6751,27 @@
         var expandedRow = document.querySelector(".inline-shortcuts-expanded-row");
         if (expandedRow) expandedRow.classList.toggle("hidden", structured || state.currentView !== "terminal");
         var inputHint = document.querySelector(".input-hint");
-        if (inputHint) inputHint.classList.toggle("hidden", structured ? true : state.currentView === "terminal");
+        if (inputHint) {
+          inputHint.classList.toggle("hidden", structured ? true : state.currentView === "terminal");
+          if (!structured && selectedSession) {
+            inputHint.textContent = isCodex
+              ? "Enter 发送 · chat 为解析视图，terminal 为原始输出"
+              : "Enter 发送 · Shift+Enter 换行";
+          }
+        }
+        var disableStructuredInput = !!selectedSession && structured && isCodex && !isRunning;
+        if (composer) {
+          composer.placeholder = getComposerPlaceholder(selectedSession, state.terminalInteractive);
+          composer.disabled = structured ? disableStructuredInput : (!!selectedSession && !isRunning);
+          composer.setAttribute("aria-disabled", composer.disabled ? "true" : "false");
+        }
+        var sendBtn = document.getElementById("send-input-button");
+        if (sendBtn) {
+          sendBtn.disabled = structured ? disableStructuredInput : (!!selectedSession && !isRunning);
+          sendBtn.setAttribute("title", isCodex
+            ? (isRunning ? "发送给 Codex" : "Codex 会话已结束")
+            : (structured ? "发送" : (!selectedSession || isRunning ? "发送" : "会话已结束")));
+        }
         var container = document.getElementById("output");
         if (container) container.classList.toggle("interactive", !structured && state.terminalInteractive);
       }
@@ -7345,6 +8097,10 @@
       }
 
       function focusInputFromTap() {
+        if (state.terminalInteractive) {
+          focusTerminalContainer();
+          return;
+        }
         var inputBox = document.getElementById('input-box');
         if (!inputBox || !state.selectedId || document.activeElement === inputBox) return;
         focusInputWithSelection(inputBox);
@@ -7355,6 +8111,10 @@
         if (!output) return;
         output.setAttribute("tabindex", "0");
         output.focus();
+        var terminalTextarea = output.querySelector(".xterm-helper-textarea");
+        if (terminalTextarea && typeof terminalTextarea.focus === "function") {
+          terminalTextarea.focus();
+        }
       }
 
       // Mobile keyboard handling
@@ -7450,7 +8210,7 @@
 
       function initTerminalResizeHandle() {
         // 终端容器拖动调整大小功能
-        var container = document.getElementById("terminal-container");
+        var container = document.getElementById("output");
         if (!container) return;
 
         // 创建拖动手柄
@@ -7747,27 +8507,19 @@
               if (msg.data.messages) {
                 snapshot.messages = msg.data.messages;
               }
+              if (msg.data.queuedMessages) {
+                snapshot.queuedMessages = msg.data.queuedMessages;
+              }
+              if (msg.data.structuredState) {
+                snapshot.structuredState = msg.data.structuredState;
+              }
               updateSessionSnapshot(snapshot);
               if (msg.sessionId === state.selectedId) {
-                state.currentMessages = getPreferredMessages(snapshot, msg.data.output, false);
-                // Re-append queued user messages that haven't been sent yet
-                if (msg.data.sessionKind === 'structured') {
-                  appendQueuedPlaceholders(state.currentMessages);
-                }
-                // Structured session with inFlight: keep __processing placeholder
-                // so the loading indicator stays visible until assistant content arrives
-                if (msg.data.sessionKind === 'structured') {
-                  var outSession = state.sessions.find(function(s) { return s.id === msg.sessionId; });
-                  if (outSession && outSession.structuredState && outSession.structuredState.inFlight) {
-                    var lastCur = state.currentMessages[state.currentMessages.length - 1];
-                    if (!lastCur || lastCur.role !== 'assistant') {
-                      state.currentMessages.push({ role: "assistant", content: [{ type: "text", text: "", __processing: true }] });
-                    }
-                  }
-                }
+                var updatedSession = state.sessions.find(function(s) { return s.id === msg.sessionId; }) || snapshot;
+                state.currentMessages = buildMessagesForRender(updatedSession, getPreferredMessages(updatedSession, msg.data.output, false));
                 updateTaskDisplay();
                 // Structured sessions: render immediately for responsiveness
-                if (msg.data.sessionKind === 'structured') {
+                if (updatedSession.sessionKind === 'structured' || msg.data.sessionKind === 'structured') {
                   renderChat();
                 } else {
                   scheduleChatRender();
@@ -7780,10 +8532,13 @@
               if (msg.data.chunk && (!state.terminalSessionId || state.terminalSessionId === msg.sessionId)) {
                 // Fast path: write chunk directly to avoid full-output comparison
                 // which can trigger terminal.reset() and cause screen flicker.
+                state.terminalLiveStreamSessions[msg.sessionId] = true;
                 state.terminal.write(msg.data.chunk);
                 state.terminalSessionId = msg.sessionId;
                 if (msg.data.output) {
                   state.terminalOutput = normalizeTerminalOutput(msg.data.output);
+                } else {
+                  state.terminalOutput = normalizeTerminalOutput((state.terminalOutput || "") + msg.data.chunk);
                 }
                 maybeScrollTerminalToBottom("output");
                 updateTerminalJumpToBottomButton();
@@ -7811,6 +8566,9 @@
             if (msg.data && msg.data.structuredState) {
               endedSnapshot.structuredState = msg.data.structuredState;
             }
+            if (msg.data && msg.data.queuedMessages) {
+              endedSnapshot.queuedMessages = msg.data.queuedMessages;
+            }
             updateSessionSnapshot(endedSnapshot);
 
             if (msg.sessionId === state.selectedId) {
@@ -7846,22 +8604,24 @@
             }
 
             // Clear stale queued inputs for PTY sessions.
-            // For structured sessions, each "ended" means one turn completed (not
-            // the session terminated), so we must NOT clear the structured queue —
-            // instead, flush the next queued message.
+            // For structured sessions, the queue is now managed by the server snapshot.
             state.messageQueue = [];
             state.pendingMessages = [];
 
             var endedSessionObj = state.sessions.find(function(s) { return s.id === msg.sessionId; });
-            var isStructuredEnded = endedSessionObj && endedSessionObj.sessionKind === "structured";
+            var selectedSessionObj = msg.sessionId === state.selectedId
+              ? state.sessions.find(function(s) { return s.id === state.selectedId; })
+              : null;
+            var isStructuredEnded = !!(
+              (endedSessionObj && endedSessionObj.sessionKind === "structured") ||
+              (selectedSessionObj && selectedSessionObj.sessionKind === "structured")
+            );
 
-            if (isStructuredEnded && msg.sessionId === state.selectedId &&
-                state.structuredInputQueue.length > 0) {
-              // Structured session turn completed — flush next queued message
-              setTimeout(flushStructuredInputQueue, 50);
+            if (isStructuredEnded && msg.sessionId === state.selectedId) {
+              flushStructuredInputQueue();
             } else if (!isStructuredEnded) {
-              // PTY session ended — clear structured queue too
               state.structuredInputQueue = [];
+              clearStructuredQueuePersistence(state.selectedId);
               updateStructuredQueueCounter();
             }
 
@@ -7896,7 +8656,13 @@
             // Initial state for subscribed session (after reconnect or subscription)
             if (msg.sessionId === state.selectedId && msg.data) {
               if (chatRenderTimer) { clearTimeout(chatRenderTimer); chatRenderTimer = null; }
-              updateTerminalOutput(msg.data.output || "", msg.sessionId, "replace");
+              updateSessionSnapshot(msg.data);
+              var initSession = state.sessions.find(function(s) { return s.id === msg.sessionId; });
+              state.currentMessages = buildMessagesForRender(initSession || msg.data, getPreferredMessages(initSession || msg.data, msg.data.output, false));
+              renderChat(true);
+              updateTaskDisplay();
+              updateApprovalStats();
+              updateTerminalOutput(msg.data.output || "", msg.sessionId, "append");
               // Ensure terminal is properly fitted after receiving initial data
               scheduleTerminalResize(true);
             }
@@ -7913,7 +8679,6 @@
             break;
           case 'status':
             if (msg.sessionId && msg.data) {
-              console.log('[WAND] ws status', msg.sessionId, JSON.stringify(msg.data));
               var statusUpdate = { id: msg.sessionId };
               if (Object.prototype.hasOwnProperty.call(msg.data, 'status')) {
                 statusUpdate.status = msg.data.status;
@@ -8026,8 +8791,14 @@
         var permissionLabel = document.getElementById("permission-actions-label");
         if (!taskEl) return;
         var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        if (selectedSession && selectedSession.provider === "codex") {
+          if (permissionActionsEl) permissionActionsEl.classList.add("hidden");
+          taskEl.classList.remove("permission-blocked");
+        }
         var pendingEscalation = selectedSession && selectedSession.pendingEscalation ? selectedSession.pendingEscalation : null;
-        var isBlocked = pendingEscalation || (selectedSession && selectedSession.permissionBlocked);
+        var isBlocked = selectedSession && selectedSession.provider !== "codex"
+          ? (pendingEscalation || selectedSession.permissionBlocked)
+          : false;
 
         if (isBlocked) {
           var isAutoApprove = selectedSession && selectedSession.autoApprovePermissions;
@@ -8161,6 +8932,11 @@
 
       function toggleAutoApprove() {
         if (!state.selectedId) return;
+        var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        if (selectedSession && selectedSession.provider === "codex") {
+          showToast("Codex 会话固定以 full-access PTY 启动，不支持切换自动批准。", "info");
+          return;
+        }
         var toggle = document.getElementById("auto-approve-toggle");
         if (toggle) toggle.style.opacity = "0.5";
         fetch("/api/sessions/" + encodeURIComponent(state.selectedId) + "/toggle-auto-approve", {
@@ -8190,6 +8966,12 @@
         var toggle = document.getElementById("auto-approve-toggle");
         if (!toggle) return;
         var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
+        if (selectedSession && selectedSession.provider === "codex") {
+          toggle.className = "auto-approve-indicator active";
+          toggle.title = "Codex 固定以 full-access PTY 启动，不支持切换自动批准";
+          toggle.textContent = "🛡 Codex 固定全权限";
+          return;
+        }
         var enabled = selectedSession && selectedSession.autoApprovePermissions;
         if (enabled) {
           toggle.className = "auto-approve-indicator active";
@@ -8222,6 +9004,10 @@
         }
         applyCurrentView();
         reconcileInteractiveState();
+        var selectedSession = getSelectedSession();
+        if (selectedSession) {
+          state.currentMessages = buildMessagesForRender(selectedSession, getPreferredMessages(selectedSession, selectedSession.output, true));
+        }
         updateTerminalJumpToBottomButton();
         if (state.currentView === "terminal") {
           state.terminalViewportSize = { width: 0, height: 0 };
@@ -8260,10 +9046,7 @@
           // Re-parse messages from the latest session output (fallback for edge cases)
           var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
           if (selectedSession) {
-            state.currentMessages = getPreferredMessages(selectedSession, selectedSession.output, true);
-            if (selectedSession.sessionKind === "structured") {
-              appendQueuedPlaceholders(state.currentMessages);
-            }
+              state.currentMessages = buildMessagesForRender(selectedSession, getPreferredMessages(selectedSession, selectedSession.output, true));
           }
           renderChat();
         }, 30);
@@ -8353,6 +9136,26 @@
         return systemInfo;
       }
 
+      function ensureChatMessagesContainer(chatOutput) {
+        if (!chatOutput) return null;
+        var chatMessages = chatOutput.querySelector(".chat-messages");
+        if (chatMessages) return chatMessages;
+        chatMessages = document.createElement("div");
+        chatMessages.className = "chat-messages";
+        chatOutput.appendChild(chatMessages);
+        return chatMessages;
+      }
+
+      function renderChatEmptyState(chatOutput, html) {
+        var chatMessages = ensureChatMessagesContainer(chatOutput);
+        if (!chatMessages) return null;
+        chatMessages.innerHTML = html;
+        bindChatScrollListener();
+        updateChatFollowToggleButton();
+        updateChatJumpToBottomButton();
+        return chatMessages;
+      }
+
       function doRenderChat(forceFullRender) {
         var chatOutput = document.getElementById("chat-output");
         if (!chatOutput) return;
@@ -8360,7 +9163,7 @@
         var selectedSession = state.sessions.find(function(s) { return s.id === state.selectedId; });
         if (!selectedSession) {
           if (state.lastRenderedEmpty !== "none") {
-            chatOutput.innerHTML = '<div class="empty-state"><strong>未选择会话</strong><br>点击上方「新对话」开始你的第一次对话。</div>';
+            renderChatEmptyState(chatOutput, '<div class="empty-state"><strong>未选择会话</strong><br>点击上方「新对话」开始你的第一次对话。</div>');
             state.lastRenderedEmpty = "none";
             state.lastRenderedMsgCount = 0;
           }
@@ -8371,7 +9174,7 @@
 
         if (messages.length === 0) {
           if (state.lastRenderedEmpty !== "empty") {
-            chatOutput.innerHTML = '<div class="empty-state"><strong>对话已开始</strong><br>在下方输入框发送消息，Claude 会自动回复。</div>';
+            renderChatEmptyState(chatOutput, '<div class="empty-state"><strong>对话已开始</strong><br>在下方输入框发送消息，Claude 会自动回复。</div>');
             state.lastRenderedEmpty = "empty";
             state.lastRenderedMsgCount = 0;
           }
@@ -8424,12 +9227,8 @@
         state.lastRenderedMsgCount = msgCount;
         state.lastRenderedHash = outputHash;
 
-        var chatMessages = chatOutput.querySelector(".chat-messages");
-        if (!chatMessages) {
-          // First render - create container
-          chatOutput.innerHTML = '<div class="chat-messages"></div>';
-          chatMessages = chatOutput.querySelector(".chat-messages");
-        }
+        var chatMessages = ensureChatMessagesContainer(chatOutput);
+        if (!chatMessages) return;
 
         var existingCount = chatMessages.querySelectorAll(".chat-message").length;
         // Full render when: forced, no existing messages, or message count decreased/changed
@@ -8447,7 +9246,7 @@
           for (var i = 0; i < reversedMessages.length; i++) {
             var msg = reversedMessages[i];
             var originalIndex = msgCount - 1 - i; // Original index in messages array
-            
+
             // Find system info for this message position
             var sysInfo = null;
             for (var j = 0; j < systemInfo.length; j++) {
@@ -8456,7 +9255,7 @@
                 break;
               }
             }
-            
+
             // Render system info card if exists
             if (sysInfo) {
               html += '<div class="chat-message system-info">' +
@@ -8466,21 +9265,30 @@
                 '</div>' +
               '</div>';
             }
-            
+
             // Render message
-            html += renderChatMessage(msg, roundUsageByIndex[originalIndex] || null);
+            html += renderChatMessage(msg, roundUsageByIndex[originalIndex] || null, originalIndex);
           }
-          
+
           chatMessages.innerHTML = html;
           attachAllCopyHandlers(chatMessages);
+          bindChatScrollListener();
+          applyPersistedExpandState(chatMessages);
           // Only expand the single newest tool card (first chat-message = newest due to column-reverse)
           var firstMsg = chatMessages.querySelector(".chat-message:not(.system-info)");
           if (firstMsg) {
             var cards = firstMsg.querySelectorAll(".tool-use-card");
             if (cards.length > 0) {
-              cards[0].classList.remove("collapsed");
+              var firstCard = cards[0];
+              var firstCardKey = getElementExpandKey(firstCard);
+              if (getPersistedExpandState(firstCardKey) === null) {
+                firstCard.classList.remove("collapsed");
+              }
               for (var ci = 1; ci < cards.length; ci++) {
-                cards[ci].classList.add("collapsed");
+                var cardKey = getElementExpandKey(cards[ci]);
+                if (getPersistedExpandState(cardKey) === null) {
+                  cards[ci].classList.add("collapsed");
+                }
               }
             }
           }
@@ -8495,6 +9303,8 @@
         function collapseOldToolCards(container, newEls) {
           var allCards = container.querySelectorAll(".tool-use-card");
           allCards.forEach(function(c) {
+            var cardKey = getElementExpandKey(c);
+            if (getPersistedExpandState(cardKey) !== null) return;
             // Keep expanded if this card is inside a newly added message
             if (newEls) {
               for (var i = 0; i < newEls.length; i++) {
@@ -8558,7 +9368,7 @@
           for (var i = 0; i < newMessages.length; i++) {
             var div = document.createElement("div");
             var nmOrigIdx = existingCount + (newMessages.length - 1 - i);
-            div.innerHTML = renderChatMessage(newMessages[i], roundUsageByIndex[nmOrigIdx] || null);
+            div.innerHTML = renderChatMessage(newMessages[i], roundUsageByIndex[nmOrigIdx] || null, nmOrigIdx);
             var el = div.firstElementChild;
             if (el) {
               el.classList.add("animate-in");
@@ -8567,7 +9377,9 @@
             }
           }
           chatMessages.insertBefore(fragment, chatMessages.firstChild);
+          bindChatScrollListener();
           attachAllCopyHandlers(chatMessages);
+          applyPersistedExpandState(chatMessages);
           // Collapse all existing cards; new cards (with animate-in) stay expanded
           collapseOldToolCards(chatMessages, insertedEls);
           // Scroll to bottom (newest message) - column-reverse: scrollTop=0 is visual bottom
@@ -8588,7 +9400,7 @@
             var currentEl = existingEls[mi];
             var tmpWrap = document.createElement("div");
             var srOrigIdx = reversedMessages.length - 1 - mi;
-            tmpWrap.innerHTML = renderChatMessage(reversedMessages[mi], roundUsageByIndex[srOrigIdx] || null);
+            tmpWrap.innerHTML = renderChatMessage(reversedMessages[mi], roundUsageByIndex[srOrigIdx] || null, srOrigIdx);
             var replacementEl = tmpWrap.firstElementChild;
             if (!replacementEl) continue;
             if (currentEl.innerHTML !== replacementEl.innerHTML || currentEl.className !== replacementEl.className) {
@@ -8606,6 +9418,8 @@
             fullRenderChat();
           }
           if (replacedAny) {
+            bindChatScrollListener();
+            applyPersistedExpandState(chatMessages);
             requestAnimationFrame(function() {
               smartScrollToBottom(chatMessages);
             });
@@ -8613,6 +9427,8 @@
             var allCards = chatMessages.querySelectorAll(".tool-use-card");
             var newestCard = null;
             allCards.forEach(function(c) {
+              var cardKey = getElementExpandKey(c);
+              if (getPersistedExpandState(cardKey) !== null) return;
               if (newestMsgEl && newestMsgEl.contains(c)) {
                 if (!newestCard) newestCard = c;
                 else c.classList.add("collapsed");
@@ -8635,14 +9451,15 @@
       // Smart scroll: only auto-scroll if user is near bottom
       // column-reverse: scrollTop near 0 = visual bottom (newest messages)
       function smartScrollToBottom(container) {
-        var chatMsgs = container.querySelector ? container.querySelector(".chat-messages") : container;
-        if (!chatMsgs) chatMsgs = container;
-        var threshold = 200;
-        // column-reverse: scrollTop=0 is the visual bottom; positive = scrolled up
-        var isNearBottom = chatMsgs.scrollTop < threshold;
-        if (isNearBottom) {
-          chatMsgs.scrollTop = 0;
+        if (!state.chatAutoFollow) {
+          updateChatJumpToBottomButton();
+          return;
         }
+        var chatMsgs = container && container.classList && container.classList.contains("chat-messages")
+          ? container
+          : getChatScrollElement();
+        if (!chatMsgs || !chatMsgs.isConnected) return;
+        scrollChatToBottom(false);
       }
 
       // --- Todo progress bar ---
@@ -9026,6 +9843,74 @@
         }, 150);
       }
 
+      function isNoiseLine(line) {
+        if (!line) return false;
+        var trimmed = String(line).trim();
+        if (!trimmed) return false;
+        if (trimmed.indexOf("────") === 0) return true;
+        if (trimmed === "❯" || trimmed === "›") return true;
+        if (/^[╭╰│┌└┐┘├┤┬┴┼─═]{2,}$/.test(trimmed)) return true;
+        if (/^[▁▂▃▄▅▆▇█▔▕▏▐]+$/.test(trimmed)) return true;
+        if (trimmed.indexOf("esc to interrupt") !== -1) return true;
+        if (trimmed.indexOf("Claude Code v") !== -1) return true;
+        if (/^Sonnet\b/.test(trimmed)) return true;
+        if (trimmed.indexOf("Failed to install Anthropic") !== -1) return true;
+        if (trimmed.indexOf("Claude Code has switched") !== -1) return true;
+        if (trimmed.indexOf("? for shortcuts") !== -1) return true;
+        if (trimmed.indexOf("Claude is waiting") !== -1) return true;
+        if (trimmed.indexOf("[wand]") !== -1) return true;
+        if (trimmed.indexOf("0;") === 0 || trimmed.indexOf("9;") === 0) return true;
+        if (trimmed.indexOf("ctrl+g") !== -1) return true;
+        if (trimmed.indexOf("/effort") !== -1) return true;
+        if (/^Using .* for .* session/.test(trimmed)) return true;
+        if (trimmed.indexOf("Press ") === 0 && trimmed.indexOf(" for") !== -1) return true;
+        if (trimmed.indexOf("type ") === 0 && trimmed.indexOf(" to ") !== -1) return true;
+        if (trimmed.indexOf("auto mode is unavailable") !== -1) return true;
+        if (/MCP server.*failed/i.test(trimmed)) return true;
+        if (trimmed.indexOf("Germinating") !== -1 || trimmed.indexOf("Doodling") !== -1 || trimmed.indexOf("Brewing") !== -1) return true;
+        if (trimmed.indexOf("Permissions") !== -1 && trimmed.indexOf("mode") !== -1) return true;
+        if (trimmed.indexOf("●") === 0 && trimmed.indexOf("·") !== -1) return true;
+        if (trimmed.indexOf("[>") === 0 || trimmed.indexOf("[<") === 0) return true;
+        if (trimmed.indexOf("Captured Claude session ID") !== -1) return true;
+        if (/^>_\s*OpenAI Codex\b/.test(trimmed)) return true;
+        if (/^OpenAI Codex\b/i.test(trimmed)) return true;
+        if (/^(model|directory):\s+/i.test(trimmed)) return true;
+        if (/^(tip|context):\s+/i.test(trimmed)) return true;
+        if (/^work(tree|space):\s+/i.test(trimmed)) return true;
+        if (/^(approvals?|sandbox|provider|session id):\s+/i.test(trimmed)) return true;
+        if (/^(thinking|working)(\.\.\.|…)?$/i.test(trimmed)) return true;
+        if (/^[•◦·]\s+Working\b/i.test(trimmed)) return true;
+        if (/^[•◦·]\s+(Running|Planning|Applying|Reading|Searching)\b/i.test(trimmed)) return true;
+        if (/^[•◦·]\s+(Inspecting|Reviewing|Summarizing|Editing|Updating|Writing)\b/i.test(trimmed)) return true;
+        if (/^[•◦·]\s+Completed\b/i.test(trimmed)) return true;
+        if (/^(ctrl|enter|tab|shift|esc|alt)\+/i.test(trimmed)) return true;
+        if (/\b(open|close|toggle) (chat|terminal)\b/i.test(trimmed)) return true;
+        if (/\b(approve|deny)\b.*\b(permission|approval)\b/i.test(trimmed)) return true;
+        if (/^(use|press) .* (to|for) .*/i.test(trimmed)) return true;
+        if (/^(?:token|context window|remaining context|conversation):\s+/i.test(trimmed)) return true;
+        if (/^(?:cwd|path):\s+\//i.test(trimmed)) return true;
+        if (/^[<>│┆╎].*[<>│┆╎]$/.test(trimmed) && trimmed.length < 8) return true;
+        return false;
+      }
+
+      function stripAnsi(text) {
+        return String(text || "")
+          .replace(/\x1b\][^\x07]*(\x07|\x1b\\)/g, "")
+          .replace(/\x1b\[(\d+)C/g, function(_match, count) { return " ".repeat(Number(count) || 1); })
+          .replace(/\x1b\[[0-9;?]*[AB]/g, "\n")
+          .replace(/\x1b\[[0-9;?]*[su]/g, "")
+          .replace(/\x1b\[[0-9;?]*[HfJKr]/g, "\n")
+          .replace(/\x1bM/g, "\n")
+          .replace(/\x1b\[[0-9;?]*[ST]/g, "\n")
+          .replace(/\x1b\[[0-9;?]*[a-zA-Z]/g, "")
+          .replace(/\x1b[><=ePX^_]/g, "")
+          .replace(/[\u00a0\u200b-\u200d\ufeff]/g, " ")
+          .replace(/[\x00-\x08\x0b\x0c\x0e-\x1f]/g, "")
+          .replace(/\r\n?/g, "\n")
+          .replace(/[ \t]+\n/g, "\n")
+          .replace(/\n{3,}/g, "\n\n");
+      }
+
       function parseMessages(output, command) {
         var messages = [];
         if (!output) return messages;
@@ -9035,6 +9920,269 @@
         var carriageReturn = String.fromCharCode(13);
         var esc = String.fromCharCode(27);
 
+        if (/^codex\b/.test(String(command || "").trim())) {
+          var codexFooterRe = /\bgpt-\d+(?:\.\d+)?(?:\s+[a-z0-9.-]+)?\s+·\s+\d+%\s+left\s+·\s+(?:\/|~\/).+/i;
+          var codexActivityRe = /^(?:thinking|working|running|planning|applying|reading|searching|inspecting|reviewing|summarizing|editing|updating|writing|completed)\b/i;
+
+          function stripCodexSegment(raw) {
+            return String(raw || "")
+              .replace(/\x1b\][^\x07]*(\x07|\x1b\\)/g, "")
+              .replace(/\x1b\[(\d+)C/g, function(_match, count) { return " ".repeat(Number(count) || 1); })
+              .replace(/\x1b\[[0-9;?]*[AB]/g, newline)
+              .replace(/\x1b\[[0-9;?]*[su]/g, "")
+              .replace(/\x1b\[[0-9;?]*[HfJKr]/g, newline)
+              .replace(/\x1bM/g, newline)
+              .replace(/\x1b\[[0-9;?]*[ST]/g, newline)
+              .replace(/\x1b\[[0-9;?]*[a-zA-Z]/g, "")
+              .replace(/\x1b[><=ePX^_]/g, "")
+              .replace(/[\u00a0\u200b-\u200d\ufeff]/g, " ")
+              .replace(/[\x00-\x08\x0b\x0c\x0e-\x1f]/g, "")
+              .replace(/[ \t]+\n/g, newline);
+          }
+
+          function normalizeCodexText(value) {
+            return String(value || "")
+              .replace(/\s+/g, " ")
+              .replace(/[M]+$/g, "")
+              .trim();
+          }
+
+          function normalizeCodexPromptLine(line) {
+            return String(line || "")
+              .replace(/^›\s*/, "")
+              .replace(/^>\s*/, "")
+              .trim();
+          }
+
+          function shouldIgnoreCodexLine(line) {
+            var trimmed = String(line || "").trim();
+            if (!trimmed) return true;
+            if (isNoiseLine(trimmed)) return true;
+            if (codexFooterRe.test(trimmed)) return true;
+            if (/^[╭╰│┌└┐┘├┤┬┴┼─═]/.test(trimmed)) return true;
+            if (/^\[>[0-9;?]*u$/i.test(trimmed)) return true;
+            if (/^M+$/i.test(trimmed)) return true;
+            if (/^(?:OpenAI Codex|Codex)\b/i.test(trimmed)) return true;
+            if (/^(?:tokens?|context window|remaining context|approvals?|sandbox|provider|session id):\s*/i.test(trimmed)) return true;
+            if (/^(?:thinking|working)\s*(?:\.\.\.|…)?$/i.test(trimmed)) return true;
+            if (/^[•◦·]\s+(?:thinking|working|running|planning|applying|reading|searching|inspecting|reviewing|summarizing|editing|updating|writing|completed)\b/i.test(trimmed)) return true;
+            if (/^(?:model|directory|tip|context|cwd|path):\s+/i.test(trimmed)) return true;
+            return false;
+          }
+
+          function extractCodexPromptCandidate(line) {
+            var trimmed = String(line || "").trim();
+            if (!/^›(?:\s|$)/.test(trimmed)) return null;
+            if (codexFooterRe.test(trimmed)) return null;
+            var prompt = normalizeCodexText(normalizeCodexPromptLine(trimmed));
+            if (!prompt || shouldIgnoreCodexLine(prompt)) return null;
+            return prompt;
+          }
+
+          function extractCodexAssistantCandidate(line) {
+            var trimmed = String(line || "").trim();
+            if (!/^[•◦·⏺]/.test(trimmed)) return null;
+
+            var assistant = trimmed
+              .replace(/^[•◦·]\s*/, "")
+              .replace(/^⏺\s+/, "")
+              .replace(/^│\s*/, "")
+              .trim();
+            if (!assistant || /^[•◦·⏺]$/.test(assistant)) return null;
+
+            assistant = assistant
+              .replace(/\s*\(\d+[smh]?\s*•\s*esc to interrupt\)[\s\S]*$/i, "")
+              .replace(/(?:[a-z]{1,6})?›[\s\S]*$/, "")
+              .replace(/\s{2,}gpt-\d[\s\S]*$/i, "")
+              .replace(/\b(?:OpenAI Codex|model:|directory:|Tip:)\b[\s\S]*$/i, "");
+            assistant = normalizeCodexText(assistant);
+
+            if (!assistant || assistant.length < 2 || codexActivityRe.test(assistant) || shouldIgnoreCodexLine(assistant)) {
+              return null;
+            }
+            return assistant;
+          }
+
+          function extractCodexEchoCandidate(line) {
+            var trimmed = normalizeCodexText(line);
+            if (!trimmed || shouldIgnoreCodexLine(trimmed)) return null;
+            if (/^[•◦·⏺›]/.test(trimmed)) return null;
+            if (/^[\[\]<>0-9;?]+u?$/i.test(trimmed)) return null;
+            if (/^[╭╰│┌└┐┘├┤┬┴┼─═]/.test(trimmed)) return null;
+            if (trimmed.length > 500) return null;
+            return trimmed;
+          }
+
+          function isLikelyAssistantTailArtifact(longer, shorter) {
+            if (longer.indexOf(shorter) !== 0) return false;
+            var suffix = longer.slice(shorter.length);
+            return /^[a-z]{1,4}$/i.test(suffix);
+          }
+
+          function coalesceAssistantLines(lines) {
+            var collected = [];
+            for (var i = 0; i < lines.length; i++) {
+              var normalized = normalizeCodexText(lines[i]);
+              if (!normalized || normalized.length < 2 || shouldIgnoreCodexLine(normalized)) continue;
+
+              var previous = collected[collected.length - 1];
+              if (!previous) {
+                collected.push(normalized);
+                continue;
+              }
+              if (normalized === previous) continue;
+              if (normalized.indexOf(previous) === 0) {
+                collected[collected.length - 1] = normalized;
+                continue;
+              }
+              if (previous.indexOf(normalized) === 0) {
+                if (isLikelyAssistantTailArtifact(previous, normalized)) {
+                  collected[collected.length - 1] = normalized;
+                }
+                continue;
+              }
+              collected.push(normalized);
+            }
+            return collected.join(newline).trim();
+          }
+
+          function extractVisiblePrompt(lines) {
+            for (var i = 0; i < lines.length; i++) {
+              var line = String(lines[i] || "").trim();
+              if (!line) continue;
+
+              var inlinePrompt = extractCodexPromptCandidate(line);
+              if (inlinePrompt) return inlinePrompt;
+
+              if (line === "›") {
+                for (var j = i + 1; j < lines.length; j++) {
+                  var nextLine = normalizeCodexText(lines[j]);
+                  if (!nextLine || codexFooterRe.test(nextLine) || shouldIgnoreCodexLine(nextLine)) continue;
+                  return nextLine;
+                }
+              }
+            }
+            return null;
+          }
+
+          function extractVisibleAssistantLines(lines) {
+            var assistantLines = [];
+            var collecting = false;
+
+            for (var i = 0; i < lines.length; i++) {
+              var line = String(lines[i] || "").trim();
+              if (!line) {
+                if (collecting) break;
+                continue;
+              }
+
+              var assistant = extractCodexAssistantCandidate(line);
+              if (assistant) {
+                assistantLines.push(assistant);
+                collecting = true;
+                continue;
+              }
+
+              if (collecting) {
+                if (line === "›" || /^›(?:\s|$)/.test(line) || codexFooterRe.test(line) || shouldIgnoreCodexLine(line)) {
+                  break;
+                }
+                assistantLines.push(normalizeCodexText(line));
+              }
+            }
+
+            return assistantLines;
+          }
+
+          var rawCandidates = [];
+          var candidateOrder = 0;
+          var rawSegments = text.replace(/\r\n?/g, newline).split(newline);
+          for (var rs = 0; rs < rawSegments.length; rs++) {
+            var cleanedSegment = stripCodexSegment(rawSegments[rs]);
+            var pieces = cleanedSegment.split(newline);
+            for (var pi = 0; pi < pieces.length; pi++) {
+              var piece = String(pieces[pi] || "").trim();
+              if (!piece) continue;
+
+              var promptCandidate = extractCodexPromptCandidate(piece);
+              if (promptCandidate) {
+                rawCandidates.push({ kind: "user", order: candidateOrder++, text: promptCandidate });
+                continue;
+              }
+
+              var assistantCandidate = extractCodexAssistantCandidate(piece);
+              if (assistantCandidate) {
+                rawCandidates.push({ kind: "assistant", order: candidateOrder++, text: assistantCandidate });
+                continue;
+              }
+
+              var echoCandidate = extractCodexEchoCandidate(piece);
+              if (echoCandidate) {
+                rawCandidates.push({ kind: "echo", order: candidateOrder++, text: echoCandidate });
+              }
+            }
+          }
+
+          var candidates = rawCandidates.filter(function(candidate, index, list) {
+            var previous = list[index - 1];
+            return !previous || previous.kind !== candidate.kind || previous.text !== candidate.text;
+          });
+
+          var explicitUsers = candidates.filter(function(candidate) { return candidate.kind === "user"; });
+          var assistantCandidates = candidates.filter(function(candidate) { return candidate.kind === "assistant"; });
+          var echoCandidates = candidates.filter(function(candidate) { return candidate.kind === "echo"; });
+          var strippedOutput = stripAnsi(text);
+          var strippedLines = strippedOutput.split(newline).map(function(line) { return String(line || "").trimEnd(); });
+          var visiblePrompt = extractVisiblePrompt(strippedLines);
+          var latestExplicitUser = explicitUsers.length ? explicitUsers[explicitUsers.length - 1] : null;
+          var echoedUserCandidates = echoCandidates
+            .map(function(candidate) { return candidate.text; })
+            .filter(function(value) { return value.length >= 3; });
+          var latestEchoUser = null;
+          for (var eu = echoedUserCandidates.length - 1; eu >= 0; eu--) {
+            if (echoedUserCandidates[eu] !== visiblePrompt) {
+              latestEchoUser = echoedUserCandidates[eu];
+              break;
+            }
+          }
+          if (!latestEchoUser && echoedUserCandidates.length) {
+            latestEchoUser = echoedUserCandidates[echoedUserCandidates.length - 1];
+          }
+
+          var currentUser = latestExplicitUser ? latestExplicitUser.text : latestEchoUser;
+          var rawAssistantLines = assistantCandidates
+            .filter(function(candidate) { return !latestExplicitUser || candidate.order > latestExplicitUser.order; })
+            .map(function(candidate) { return candidate.text; });
+          var visibleAssistantFallback = [];
+          var bulletMatches = strippedOutput.match(/^[ \t]*[•◦·⏺][ \t]*(.+)$/gm) || [];
+          for (var bm = 0; bm < bulletMatches.length; bm++) {
+            var bulletContent = normalizeCodexText(bulletMatches[bm].replace(/^[ \t]*[•◦·⏺][ \t]*/, ""));
+            if (!bulletContent) continue;
+            if (codexActivityRe.test(bulletContent)) continue;
+            if (codexFooterRe.test(bulletContent)) continue;
+            if (/\b(?:OpenAI Codex|model:|directory:|Tip:|esc to interrupt)\b/i.test(bulletContent)) continue;
+            visibleAssistantFallback.push(bulletContent);
+          }
+
+          var assistantText = coalesceAssistantLines(rawAssistantLines)
+            || coalesceAssistantLines(extractVisibleAssistantLines(strippedLines))
+            || (visibleAssistantFallback.length ? visibleAssistantFallback[visibleAssistantFallback.length - 1] : null);
+
+          if (currentUser) {
+            messages.push({ role: "user", content: currentUser });
+          }
+          if (assistantText) {
+            messages.push({ role: "assistant", content: assistantText });
+          }
+          if (!messages.length && latestExplicitUser) {
+            messages.push({ role: "user", content: latestExplicitUser.text });
+          } else if (!messages.length && latestEchoUser) {
+            messages.push({ role: "user", content: latestEchoUser });
+          }
+
+          return messages;
+        }
+
         // Optimized ANSI escape sequence stripping
         // Handles: CSI sequences, OSC sequences, single-character escapes, control chars
         var nul = String.fromCharCode(0);
@@ -9318,24 +10466,64 @@
         };
       })();
 
+      var DEFAULT_CHAT_PERSONA = {
+        user: {
+          name: "赛博虎妞",
+          avatarSvg: PIXEL_AVATAR.user
+        },
+        assistant: {
+          name: "勤劳初二",
+          avatarSvg: PIXEL_AVATAR.assistant
+        }
+      };
+
+      function getStructuredChatPersona(role) {
+        var configPersona = state.config && state.config.structuredChatPersona;
+        var roleConfig = configPersona && configPersona[role] ? configPersona[role] : null;
+        var defaults = DEFAULT_CHAT_PERSONA[role] || DEFAULT_CHAT_PERSONA.assistant;
+        return {
+          name: roleConfig && typeof roleConfig.name === "string" && roleConfig.name.trim()
+            ? roleConfig.name.trim()
+            : defaults.name,
+          avatar: roleConfig && typeof roleConfig.avatar === "string" && roleConfig.avatar.trim()
+            ? roleConfig.avatar.trim()
+            : null,
+          avatarSvg: defaults.avatarSvg
+        };
+      }
+
+      function renderAvatarFallback(svg) {
+        return '<div class="pixel-avatar">' + svg + '</div>';
+      }
+
+      function handleChatAvatarImageError(img, role) {
+        if (!img || !img.parentNode) return;
+        var persona = getStructuredChatPersona(role === "user" ? "user" : "assistant");
+        img.outerHTML = renderAvatarFallback(persona.avatarSvg);
+      }
+
       function chatAvatar(role) {
-        var isUser = role === "user";
-        var svg = isUser ? PIXEL_AVATAR.user : PIXEL_AVATAR.assistant;
-        var name = isUser ? "赛博虎妞" : "勤劳初二";
+        var personaRole = role === "user" ? "user" : "assistant";
+        var persona = getStructuredChatPersona(personaRole);
+        var avatarInner = persona.avatar
+          ? '<img class="pixel-avatar-image" src="' + escapeHtml(persona.avatar) + '" alt="' + escapeHtml(persona.name) + '" onerror="handleChatAvatarImageError(this, ' + JSON.stringify(personaRole) + ')" />'
+          : renderAvatarFallback(persona.avatarSvg);
         return '<div class="chat-message-avatar ' + role + '">' +
-          '<div class="pixel-avatar">' + svg + '</div>' +
-          '<span class="avatar-name">' + name + '</span>' +
+          avatarInner +
+          '<span class="avatar-name">' + escapeHtml(persona.name) + '</span>' +
         '</div>';
       }
 
-      function renderChatMessage(msg, roundUsage) {
+      function renderChatMessage(msg, roundUsage, messageIndex) {
         // Thinking card (deep thought) — from PTY parsing
         if (msg.role === "thinking") {
+          var thinkingKey = buildExpandKey("thinking", [getMessageKey(msg, messageIndex), "pty"]);
+          var thinkingExpanded = getPersistedExpandState(thinkingKey) === true;
           return '<div class="chat-message thinking">' +
-            '<div class="thinking-inline thinking-pty collapsed" data-thinking="" onclick="__thinkingToggle(this)">' +
+            '<div class="thinking-inline thinking-pty ' + (thinkingExpanded ? 'expanded' : 'collapsed') + '" data-expand-kind="thinking" data-expand-key="' + escapeHtml(thinkingKey) + '" data-thinking="" onclick="__thinkingToggle(this)">' +
               '<span class="thinking-inline-icon">⦿</span>' +
               '<span class="thinking-inline-preview">' + escapeHtml(msg.content) + '</span>' +
-              '<span class="thinking-inline-action">展开</span>' +
+              '<span class="thinking-inline-action">' + (thinkingExpanded ? '收起' : '展开') + '</span>' +
             '</div>' +
           '</div>';
         }
@@ -9352,7 +10540,7 @@
 
         // Structured content blocks (from JSON chat mode)
         if (Array.isArray(msg.content)) {
-          return renderStructuredMessage(msg, roundUsage);
+          return renderStructuredMessage(msg, roundUsage, messageIndex);
         }
 
         // Legacy string content (from PTY parsing)
@@ -9442,7 +10630,7 @@
 
       var TOOL_GROUP_LABELS = { Read: "读取", Glob: "搜索", Grep: "搜索", WebFetch: "抓取", WebSearch: "搜索", TodoRead: "待办" };
 
-      function renderToolGroup(items, role, toolResults) {
+      function renderToolGroup(items, role, toolResults, messageKey) {
         // Count by tool name
         var counts = {};
         for (var k = 0; k < items.length; k++) {
@@ -9466,28 +10654,32 @@
           parts.push(counts[name] + " " + (TOOL_GROUP_LABELS[name] || name));
         }
         var summaryText = parts.join(" · ");
+        var groupKey = buildExpandKey("tool-group", [messageKey, items[0] && items[0].index, items.length]);
+        var persistedExpanded = getPersistedExpandState(groupKey);
+        var shouldExpand = persistedExpanded === null ? false : persistedExpanded;
 
         // Render each item's inline-tool card
         var innerHtml = "";
         for (var k = 0; k < items.length; k++) {
           try {
-            innerHtml += renderContentBlock(items[k].block, role, toolResults, items[k].index);
+            innerHtml += renderContentBlock(items[k].block, role, toolResults, items[k].index, messageKey);
           } catch (e) {
             innerHtml += '<div class="render-error">工具渲染失败</div>';
           }
         }
 
-        return '<div class="tool-group" data-expanded="false" data-status="' + statusClass + '">' +
+        return '<div class="tool-group" data-expand-kind="tool-group" data-expand-key="' + escapeHtml(groupKey) + '" data-expanded="' + (shouldExpand ? 'true' : 'false') + '" data-status="' + statusClass + '">' +
           '<div class="tool-group-summary" onclick="__toolGroupToggle(this.parentNode)">' +
             '<span class="tool-group-status">' + statusIcon + '</span>' +
             '<span class="tool-group-text">' + escapeHtml(summaryText) + '</span>' +
             '<span class="tool-group-count">' + items.length + ' 个调用</span>' +
-            '<svg class="tool-group-chevron" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"/></svg>' +
+            '<svg class="tool-group-chevron" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" style="transform:' + (shouldExpand ? 'rotate(180deg)' : '') + '"><polyline points="6 9 12 15 18 9"/></svg>' +
           '</div>' +
-          '<div class="tool-group-body">' + innerHtml + '</div>' +
+          '<div class="tool-group-body" style="display:' + (shouldExpand ? 'block' : 'none') + ';">' + innerHtml + '</div>' +
         '</div>';
       }
 
+
       // global toggle
       window.__toolGroupToggle = function(el) {
         if (!el) return;
@@ -9497,11 +10689,13 @@
         if (body) body.style.display = expanded ? "none" : "block";
         var chevron = el.querySelector(".tool-group-chevron");
         if (chevron) chevron.style.transform = expanded ? "" : "rotate(180deg)";
+        persistElementExpandState(el, "tool-group");
       };
 
-      function renderStructuredMessage(msg, roundUsage) {
+      function renderStructuredMessage(msg, roundUsage, messageIndex) {
         var role = msg.role;
         var avatar = chatAvatar(role);
+        var messageKey = getMessageKey(msg, messageIndex);
 
         // Check if this is a queued user message
         var isQueued = role === "user" && msg.content && msg.content.some(function(b) { return b.__queued; });
@@ -9525,9 +10719,9 @@
             var grp = groups[g];
             try {
               if (grp.type === "group") {
-                blocksHtml += renderToolGroup(grp.items, role, toolResults);
+                blocksHtml += renderToolGroup(grp.items, role, toolResults, messageKey);
               } else {
-                blocksHtml += renderContentBlock(grp.block, role, toolResults, grp.index);
+                blocksHtml += renderContentBlock(grp.block, role, toolResults, grp.index, messageKey);
               }
             } catch (e) {
               blocksHtml += '<div class="render-error">消息块渲染失败</div>';
@@ -9544,13 +10738,13 @@
         var queuedClass = isQueued ? " queued" : "";
         var queuedBadge = isQueued ? '<span class="queued-badge">排队中</span>' : "";
 
-        return '<div class="chat-message ' + role + queuedClass + '">' +
+        return '<div class="chat-message ' + role + queuedClass + '" data-message-key="' + escapeHtml(messageKey) + '">' +
           avatar +
           '<div class="chat-message-content">' + blocksHtml + queuedBadge + '</div>' +
           usageHtml +
         '</div>';
       }
-      function renderContentBlock(block, role, toolResults, index) {
+      function renderContentBlock(block, role, toolResults, index, messageKey) {
         if (!block || !block.type) return "";
 
         switch (block.type) {
@@ -9572,15 +10766,17 @@
                 '</div>' +
               '</div>';
             }
-            return '<div class="thinking-inline collapsed" data-thinking="' + escapeHtml(thinkingText) + '" onclick="__thinkingToggle(this)">' +
+            var thinkingKey = buildExpandKey("thinking", [messageKey, index]);
+            var thinkingExpanded = getPersistedExpandState(thinkingKey) === true;
+            return '<div class="thinking-inline ' + (thinkingExpanded ? 'expanded' : 'collapsed') + '" data-expand-kind="thinking" data-expand-key="' + escapeHtml(thinkingKey) + '" data-thinking="' + escapeHtml(thinkingText) + '" onclick="__thinkingToggle(this)">' +
               '<span class="thinking-inline-icon">⦿</span>' +
-              '<span class="thinking-inline-preview">' + escapeHtml(preview) + '</span>' +
-              '<span class="thinking-inline-action">展开</span>' +
+              '<span class="thinking-inline-preview">' + escapeHtml(thinkingExpanded ? thinkingText : preview) + '</span>' +
+              '<span class="thinking-inline-action">' + (thinkingExpanded ? '收起' : '展开') + '</span>' +
             '</div>';
 
           case "tool_use":
             var toolResult = pickToolResultForDisplay(toolResults, block.id);
-            var rendered = renderToolUseCard(block, toolResult, index);
+            var rendered = renderToolUseCard(block, toolResult, index, messageKey);
             if (hasRecoveredToolNoise(toolResults, block.id)) {
               rendered = renderRecoveredToolHint(block.name || "工具") + rendered;
             }
@@ -9594,8 +10790,10 @@
         }
       }
 
-      function renderInlineTool(block, toolResult, toolName, fileInfo, extraInfo) {
+      function renderInlineTool(block, toolResult, toolName, fileInfo, extraInfo, messageKey, index) {
         var toolId = block.id || "tool-" + toolName;
+        var expandKey = buildExpandKey("inline-tool", [messageKey, toolId || index, index]);
+        var persistedExpanded = getPersistedExpandState(expandKey);
         var inputData = block.input || {};
         var resultContent = extractToolResultText(toolResult && toolResult.content);
 
@@ -9666,16 +10864,16 @@
         var fullResult = resultContent;
 
         var expandedHtml = "";
-        var shouldExpand = false;  // All inline tools collapsed by default
+        var shouldExpand = persistedExpanded === null ? false : persistedExpanded;
         if (hasResult) {
           expandedHtml = '<div class="inline-tool-expanded" style="display: ' + (shouldExpand ? 'block' : 'none') + ';">' +
             '<div class="inline-tool-result">' + formatInlineResult(resultContent, toolName) + '</div>' +
           '</div>';
         } else if (isError) {
-          expandedHtml = '<div class="inline-tool-expanded" style="display: none;"><div class="inline-tool-result inline-tool-error">' +
+          expandedHtml = '<div class="inline-tool-expanded" style="display: ' + (shouldExpand ? 'block' : 'none') + ';"><div class="inline-tool-result inline-tool-error">' +
             escapeHtml(resultContent || "操作失败") + '</div></div>';
         } else if (!toolResult) {
-          expandedHtml = '<div class="inline-tool-expanded" style="display: none;"><div class="inline-tool-loading">等待响应…</div></div>';
+          expandedHtml = '<div class="inline-tool-expanded" style="display: ' + (shouldExpand ? 'block' : 'none') + ';"><div class="inline-tool-loading">等待响应…</div></div>';
         }
 
         var extraInfoHtml = meta ? '<span class="inline-tool-meta">' + escapeHtml(meta) + '</span>' : '';
@@ -9683,6 +10881,8 @@
         if (shouldExpand) extraClass += ' inline-tool-open';
 
         return '<div class="inline-tool ' + extraClass + '" ' +
+          'data-expand-kind="inline-tool" ' +
+          'data-expand-key="' + escapeHtml(expandKey) + '" ' +
           'data-result="' + escapeHtml(fullResult) + '" ' +
           'data-preview="' + previewDataAttr + '" ' +
           'data-status="' + (isError ? 'error' : (hasResult ? 'done' : 'pending')) + '" ' +
@@ -9698,10 +10898,13 @@
       }
 
       // Terminal-style display for Bash commands
-      function renderTerminalTool(block, toolResult, toolName) {
+      function renderTerminalTool(block, toolResult, toolName, messageKey, index) {
         var inputData = block.input || {};
         var command = inputData.command || inputData.cmd || "";
         var resultContent = extractToolResultText(toolResult && toolResult.content);
+        var toolId = block.id || "tool-" + toolName;
+        var expandKey = buildExpandKey("terminal", [messageKey, toolId || index, index]);
+        var persistedExpanded = getPersistedExpandState(expandKey);
 
         var isError = toolResult && toolResult.is_error;
         var exitCode = inputData.exitCode;
@@ -9739,22 +10942,21 @@
 
         // Show command preview in header (truncate long commands)
         var cmdPreview = command.length > 80 ? command.slice(0, 77) + "…" : command;
+        var shouldExpand = persistedExpanded === null ? false : persistedExpanded;
 
-        return '<div class="inline-terminal" data-expanded="false">' +
+        return '<div class="inline-terminal" data-expand-kind="terminal" data-expand-key="' + escapeHtml(expandKey) + '" data-expanded="' + (shouldExpand ? 'true' : 'false') + '">' +
           '<div class="term-header" onclick="__terminalExpand(this)">' +
             statusDot +
             '<span class="term-cmd-preview"><span class="term-prompt">$</span> ' + escapeHtml(cmdPreview) + '</span>' +
-            '<span class="term-toggle-icon">▶</span>' +
+            '<span class="term-toggle-icon">' + (shouldExpand ? '▼' : '▶') + '</span>' +
           '</div>' +
-          '<div class="term-body" style="display:none;">' +
+          '<div class="term-body" style="display:' + (shouldExpand ? 'block' : 'none') + ';">' +
             '<div class="term-command"><span class="term-prompt">$</span> ' + cmdDisplay + '</div>' +
             (outputHtml ? '<div class="term-output">' + outputHtml + '</div>' : '') +
             exitCodeHtml +
           '</div>' +
         '</div>';
       }
-
-      // GitHub-style diff display for Edit/Write/MultiEdit
       function extractToolResultText(content) {
         if (!content) return "";
         if (typeof content === "string") return content;
@@ -9845,7 +11047,7 @@
         return '<pre class="inline-tool-result-text" style="max-height: 300px; overflow-y: auto;">' + escapeHtml(content) + '</pre>';
       }
 
-      function renderToolUseCard(block, toolResult, index) {
+      function renderToolUseCard(block, toolResult, index, messageKey) {
         var toolName = block.name || "unknown";
         var toolId = block.id || "tool-" + toolName + "-" + (typeof index === "number" ? index : 0);
         var fileInfo = extractFileInfo(toolName, block.input);
@@ -9853,12 +11055,12 @@
         // ── Lightweight inline tools: Read, Glob, Grep, WebFetch, WebSearch, TodoRead
         if (toolName === "Read" || toolName === "Glob" || toolName === "Grep" ||
             toolName === "WebFetch" || toolName === "WebSearch" || toolName === "TodoRead") {
-          return renderInlineTool(block, toolResult, toolName, fileInfo, "");
+          return renderInlineTool(block, toolResult, toolName, fileInfo, "", messageKey, index);
         }
 
         // ── Terminal-style: Bash
         if (toolName === "Bash") {
-          return renderTerminalTool(block, toolResult, toolName);
+          return renderTerminalTool(block, toolResult, toolName, messageKey, index);
         }
 
         // ── Diff-style: Edit, Write, MultiEdit
@@ -9937,9 +11139,12 @@
           headerIcon = getToolIcon(toolName);
         }
 
-        var collapsedClass = statusClass !== "loading" ? " collapsed" : "";
+        var expandKey = buildExpandKey("tool-card", [messageKey, toolId]);
+        var persistedExpanded = getPersistedExpandState(expandKey);
+        var shouldExpand = persistedExpanded === null ? statusClass === "loading" : persistedExpanded;
+        var collapsedClass = shouldExpand ? "" : " collapsed";
         var toggleHtml = '<span class="tool-use-toggle">▼</span>';
-        return '<div class="tool-use-card ' + statusClass + collapsedClass + '" data-tool-use-id="' + escapeHtml(toolId) + '">' +
+        return '<div class="tool-use-card ' + statusClass + collapsedClass + '" data-expand-kind="tool-card" data-expand-key="' + escapeHtml(expandKey) + '" data-tool-use-id="' + escapeHtml(toolId) + '">' +
           '<div class="tool-use-header" data-tool-toggle onclick="__tcToggle(event,this)">' +
             '<span class="tool-use-icon">' + headerIcon + '</span>' +
             '<span class="tool-use-name">' + escapeHtml(titleText) + '</span>' +