clay-server 2.26.0-beta.1 → 2.26.0-beta.11

package/lib/public/app.js

@@ -1,20 +1,21 @@
 import { avatarUrl, userAvatarUrl, mateAvatarUrl } from './modules/avatar.js';
 import { showToast, copyToClipboard, escapeHtml } from './modules/utils.js';
-import { refreshIcons, iconHtml, randomThinkingVerb } from './modules/icons.js';
+import { refreshIcons, iconHtml } from './modules/icons.js';
 import { renderMarkdown, highlightCodeBlocks, renderMermaidBlocks, closeMermaidModal, parseEmojis } from './modules/markdown.js';
-import { initSidebar, renderSessionList, handleSearchResults, updateSessionPresence, updatePageTitle, populateCliSessionList, renderIconStrip, renderSidebarPresence, initIconStrip, getEmojiCategories, renderUserStrip, setCurrentDmUser, updateDmBadge, updateSessionBadge, updateProjectBadge, closeDmUserPicker, spawnDustParticles, openMobileSheet, setMobileSheetMateData } from './modules/sidebar.js';
+import { initSidebar, renderSessionList, handleSearchResults, updateSessionPresence, updatePageTitle, populateCliSessionList, renderIconStrip, renderSidebarPresence, initIconStrip, getEmojiCategories, renderUserStrip, setCurrentDmUser, updateDmBadge, updateSessionBadge, updateProjectBadge, closeDmUserPicker, spawnDustParticles, openMobileSheet, setMobileSheetMateData, refreshMobileChatSheet } from './modules/sidebar.js';
 import { initMateSidebar, showMateSidebar, hideMateSidebar, renderMateSessionList, updateMateSidebarProfile, handleMateSearchResults } from './modules/mate-sidebar.js';
 import { initMateKnowledge, requestKnowledgeList, renderKnowledgeList, handleKnowledgeContent, hideKnowledge } from './modules/mate-knowledge.js';
 import { initMateMemory, renderMemoryList, hideMemory } from './modules/mate-memory.js';
-import { initRewind, setRewindMode, showRewindModal, clearPendingRewindUuid, addRewindButton } from './modules/rewind.js';
+import { initRewind, setRewindMode, showRewindModal, clearPendingRewindUuid, addRewindButton, onRewindComplete, onRewindError } from './modules/rewind.js';
 import { initNotifications, showDoneNotification, playDoneSound, isNotifAlertEnabled, isNotifSoundEnabled } from './modules/notifications.js';
 import { initInput, clearPendingImages, handleInputSync, autoResize, builtinCommands, sendMessage, hasSendableContent, setScheduleBtnDisabled, setScheduleDelayMs, clearScheduleDelay } from './modules/input.js';
 import { initQrCode, triggerShare } from './modules/qrcode.js';
 import { initFileBrowser, loadRootDirectory, refreshTree, handleFsList, handleFsRead, handleDirChanged, refreshIfOpen, handleFileChanged, handleFileHistory, handleGitDiff, handleFileAt, getPendingNavigate, closeFileViewer, resetFileBrowser } from './modules/filebrowser.js';
-import { initTerminal, openTerminal, closeTerminal, resetTerminals, handleTermList, handleTermCreated, handleTermOutput, handleTermExited, handleTermClosed, sendTerminalCommand } from './modules/terminal.js';
+import { initTerminal, openTerminal, closeTerminal, resetTerminals, handleTermList, handleTermCreated, handleTermOutput, handleTermResized, handleTermExited, handleTermClosed, sendTerminalCommand } from './modules/terminal.js';
+import { initContextSources, updateTerminalList, updateBrowserTabList, handleContextSourcesState, getActiveSources, hasActiveSources } from './modules/context-sources.js';
 import { initStickyNotes, handleNotesList, handleNoteCreated, handleNoteUpdated, handleNoteDeleted, openArchive, closeArchive, isArchiveOpen, hideNotes, showNotes, isNotesVisible } from './modules/sticky-notes.js';
-import { initTheme, getThemeColor, getComputedVar, onThemeChange, getCurrentTheme } from './modules/theme.js';
-import { initTools, resetToolState, saveToolState, restoreToolState, renderAskUserQuestion, markAskUserAnswered, renderPermissionRequest, markPermissionResolved, markPermissionCancelled, renderElicitationRequest, markElicitationResolved, renderPlanBanner, renderPlanCard, handleTodoWrite, handleTaskCreate, handleTaskUpdate, startThinking, appendThinking, stopThinking, resetThinkingGroup, createToolItem, updateToolExecuting, updateToolResult, markAllToolsDone, addTurnMeta, enableMainInput, getTools, getPlanContent, setPlanContent, isPlanFilePath, getTodoTools, updateSubagentActivity, addSubagentToolEntry, markSubagentDone, updateSubagentProgress, initSubagentStop, closeToolGroup, removeToolFromGroup } from './modules/tools.js';
+import { initTheme, getThemeColor, getComputedVar, onThemeChange, getCurrentTheme, getChatLayout } from './modules/theme.js';
+import { initTools, resetToolState, saveToolState, restoreToolState, renderAskUserQuestion, markAskUserAnswered, renderPermissionRequest, markPermissionResolved, markPermissionCancelled, renderElicitationRequest, markElicitationResolved, renderPlanBanner, renderPlanCard, handleTodoWrite, handleTaskCreate, handleTaskUpdate, startThinking, appendThinking, stopThinking, resetThinkingGroup, createToolItem, updateToolExecuting, updateToolResult, markAllToolsDone, addTurnMeta, resetTurnMetaCost, enableMainInput, getTools, getPlanContent, setPlanContent, isPlanFilePath, getTodoTools, updateSubagentActivity, addSubagentToolEntry, markSubagentDone, updateSubagentProgress, initSubagentStop, closeToolGroup, removeToolFromGroup } from './modules/tools.js';
 import { initServerSettings, updateSettingsStats, updateSettingsModels, updateDaemonConfig, handleSetPinResult, handleKeepAwakeChanged, handleAutoContinueChanged, handleRestartResult, handleShutdownResult, handleSharedEnv, handleSharedEnvSaved, handleGlobalClaudeMdRead, handleGlobalClaudeMdWrite } from './modules/server-settings.js';
 import { initProjectSettings, handleInstructionsRead, handleInstructionsWrite, handleProjectEnv, handleProjectEnvSaved, isProjectSettingsOpen, handleProjectSharedEnv, handleProjectSharedEnvSaved, handleProjectOwnerChanged } from './modules/project-settings.js';
 import { initSkills, handleSkillInstalled, handleSkillUninstalled } from './modules/skills.js';
@@ -31,7 +32,7 @@ import { initMateWizard, openMateWizard, closeMateWizard, handleMateCreated } fr
 import { initCommandPalette, handlePaletteSessionSwitch, setPaletteVersion } from './modules/command-palette.js';
 import { initLongPress } from './modules/longpress.js';
 import { initMention, handleMentionStart, handleMentionStream, handleMentionDone, handleMentionError, handleMentionActivity, renderMentionUser, renderMentionResponse } from './modules/mention.js';
-import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateResumed, handleDebateTurn, handleDebateActivity, handleDebateStream, handleDebateTurnDone, handleDebateCommentQueued, handleDebateCommentInjected, handleDebateEnded, handleDebateError, renderDebateStarted, renderDebateTurnDone, renderDebateEnded, renderDebateCommentInjected, renderDebateUserResume, openDebateModal, closeDebateModal, handleDebateBriefReady, renderDebateBriefReady, isDebateActive, resetDebateState } from './modules/debate.js';
+import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateResumed, handleDebateTurn, handleDebateActivity, handleDebateStream, handleDebateTurnDone, handleDebateCommentQueued, handleDebateCommentInjected, handleDebateEnded, handleDebateError, renderDebateStarted, renderDebateTurnDone, renderDebateEnded, renderDebateCommentInjected, renderDebateUserResume, openDebateModal, closeDebateModal, handleDebateBriefReady, renderDebateBriefReady, isDebateActive, resetDebateState, exportDebateAsPdf } from './modules/debate.js';
 
 // --- Base path for multi-project routing ---
   var slugMatch = location.pathname.match(/^\/p\/([a-z0-9_-]+)/);
@@ -564,6 +565,8 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
   // --- DM Mode Functions ---
   function openDm(targetUserId) {
     if (!ws || ws.readyState !== 1) return;
+    // Persist DM state for refresh recovery
+    try { localStorage.setItem("clay-active-dm", targetUserId); } catch (e) {}
     // Check mate skill updates before opening mate DM
     if (typeof targetUserId === "string" && targetUserId.indexOf("mate_") === 0) {
       showMateOnboarding(function () {
@@ -815,6 +818,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     dmMode = false;
     dmKey = null;
     dmTargetUser = null;
+    try { localStorage.removeItem("clay-active-dm"); } catch (e) {}
     setCurrentDmUser(null);
 
     var mainCol = document.getElementById("main-column");
@@ -1797,9 +1801,10 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
   };
   initSidebar(sidebarCtx);
   initIconStrip(sidebarCtx);
-  initMateSidebar(function () { return (dmMode && dmTargetUser && dmTargetUser.isMate) ? ws : null; });
-  initMateKnowledge(function () { return (dmMode && dmTargetUser && dmTargetUser.isMate) ? ws : null; });
-  initMateMemory(function () { return (dmMode && dmTargetUser && dmTargetUser.isMate) ? ws : null; }, { onShow: function () { hideKnowledge(); hideNotes(); } });
+  var wsGetter = function () { return ws; };
+  initMateSidebar(wsGetter);
+  initMateKnowledge(wsGetter);
+  initMateMemory(wsGetter, { onShow: function () { hideKnowledge(); hideNotes(); } });
   initMateWizard(
     function (msg) { if (ws && ws.readyState === 1) ws.send(JSON.stringify(msg)); },
     function (mate) { handleMateCreatedInApp(mate); }
@@ -2082,12 +2087,9 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
         activityEl = document.createElement("div");
         activityEl.className = "activity-inline";
         activityEl.innerHTML =
-          '<span class="activity-icon">' + iconHtml("sparkles") + '</span>' +
-          '<span class="activity-text"></span>';
+          '<div class="mate-thinking-dots"><span></span><span></span><span></span></div>';
         addToMessages(activityEl);
-        refreshIcons();
       }
-      activityEl.querySelector(".activity-text").textContent = text;
       scrollToBottom();
     } else {
       if (activityEl) {
@@ -2097,9 +2099,14 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     }
   }
 
-  // --- Mate pre-thinking (instant dots before server responds) ---
+  // --- Pre-thinking (instant dots before server responds) ---
   var matePreThinkingEl = null;
   var matePreThinkingTimer = null;
+  function showClaudePreThinking() {
+    if (getChatLayout() !== "channel") return;
+    var claudeAvatar = CLAUDE_CODE_AVATAR;
+    doShowMatePreThinking("Claude Code", claudeAvatar);
+  }
   function showMatePreThinking() {
     removeMatePreThinking();
     var mateName = dmTargetUser ? (dmTargetUser.displayName || "Mate") : "Mate";
@@ -2113,10 +2120,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
       '<img class="dm-bubble-avatar dm-bubble-avatar-mate" src="' + escapeHtml(mateAvatar) + '" alt="" style="display:block">' +
       '<div class="dm-bubble-content">' +
       '<div class="dm-bubble-header"><span class="dm-bubble-name">' + escapeHtml(mateName) + '</span></div>' +
-      '<div class="activity-inline mate-pre-activity">' +
-      '<span class="activity-icon">' + iconHtml("sparkles") + '</span>' +
-      '<span class="activity-text">' + randomThinkingVerb() + '...</span>' +
-      '</div>' +
+      '<div class="mate-thinking-dots"><span></span><span></span><span></span></div>' +
       '</div>';
     if (activityEl && activityEl.parentNode) {
       activityEl.parentNode.insertBefore(matePreThinkingEl, activityEl);
@@ -2468,7 +2472,9 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
   }
 
   function accumulateUsage(cost, usage) {
-    if (cost != null) sessionUsage.cost += cost;
+    // cost is the SDK's total_cost_usd — a cumulative running total, not a delta.
+    // Assign directly instead of summing to avoid overcounting.
+    if (cost != null) sessionUsage.cost = cost;
     if (usage) {
       sessionUsage.input += usage.input_tokens || usage.inputTokens || 0;
       sessionUsage.output += usage.output_tokens || usage.outputTokens || 0;
@@ -2596,6 +2602,9 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
   var contextMiniLabel = $("context-mini-label");
   var contextData = { contextWindow: 0, maxOutputTokens: 0, model: "-", cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0 };
   var headerContextEl = null;
+  var richContextUsage = null;
+  var ctxPopoverEl = null;
+  var ctxPopoverVisible = false;
 
   // Known context window sizes per model (fallback when SDK omits feature flag)
   var KNOWN_CONTEXT_WINDOWS = {
@@ -2643,6 +2652,14 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
         headerContextEl.className = "header-context";
         headerContextEl.innerHTML = '<div class="header-context-bar"><div class="header-context-fill"></div></div><span class="header-context-label"></span>';
         statusArea.insertBefore(headerContextEl, statusArea.firstChild);
+        headerContextEl.addEventListener("mouseenter", function() {
+          if (richContextUsage) {
+            showCtxPopover();
+          }
+        });
+        headerContextEl.addEventListener("mouseleave", function() {
+          ctxHoverTimer = setTimeout(hideCtxPopover, 120);
+        });
       }
       if (headerContextEl) {
         var hFill = headerContextEl.querySelector(".header-context-fill");
@@ -2650,7 +2667,12 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
         hFill.style.width = pct.toFixed(1) + "%";
         hFill.className = "header-context-fill" + cls;
         hLabel.textContent = pct.toFixed(0) + "%";
-        headerContextEl.dataset.tip = "Context window " + pct.toFixed(0) + "% used (" + formatTokens(used) + " / " + formatTokens(win) + " tokens)";
+        // Use data-tip as fallback when rich data is not yet loaded
+        if (richContextUsage) {
+          headerContextEl.removeAttribute("data-tip");
+        } else {
+          headerContextEl.dataset.tip = "Context window " + pct.toFixed(0) + "% used (" + formatTokens(used) + " / " + formatTokens(win) + " tokens)";
+        }
       }
     }
     contextUsedEl.textContent = formatTokens(used);
@@ -2666,7 +2688,8 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
   }
 
   function accumulateContext(cost, usage, modelUsage, lastStreamInputTokens) {
-    if (cost != null) contextData.cost += cost;
+    // cost is the SDK's total_cost_usd — a cumulative running total, not a delta.
+    if (cost != null) contextData.cost = cost;
     // Use latest turn values (not cumulative) since each turn's input_tokens
     // already includes the full conversation context up to that point
     if (usage) {
@@ -2714,9 +2737,158 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
 
   function resetContextData() {
     contextData = { contextWindow: 0, maxOutputTokens: 0, model: "-", cost: 0, input: 0, output: 0, cacheRead: 0, cacheWrite: 0, turns: 0 };
+    richContextUsage = null;
+    hideCtxPopover();
     updateContextPanel();
   }
 
+  // --- Rich context usage popover ---
+
+  var ctxHoverTimer = null;
+
+  function ensureCtxPopover() {
+    if (ctxPopoverEl) return;
+    ctxPopoverEl = document.createElement("div");
+    ctxPopoverEl.className = "context-usage-popover hidden";
+    // Keep popover open when hovering over it
+    ctxPopoverEl.addEventListener("mouseenter", function() {
+      if (ctxHoverTimer) { clearTimeout(ctxHoverTimer); ctxHoverTimer = null; }
+    });
+    ctxPopoverEl.addEventListener("mouseleave", function() {
+      hideCtxPopover();
+    });
+  }
+
+  function showCtxPopover() {
+    if (!headerContextEl || !richContextUsage) return;
+    if (ctxHoverTimer) { clearTimeout(ctxHoverTimer); ctxHoverTimer = null; }
+    ensureCtxPopover();
+    headerContextEl.appendChild(ctxPopoverEl);
+    renderCtxPopover();
+    ctxPopoverEl.classList.remove("hidden");
+    ctxPopoverVisible = true;
+  }
+
+  function hideCtxPopover() {
+    if (!ctxPopoverEl) return;
+    ctxPopoverEl.classList.add("hidden");
+    ctxPopoverVisible = false;
+  }
+
+  // Categories to hide from the legend (noise, not actionable)
+  var CTX_HIDDEN_CATS = { "Free space": 1, "Autocompact buffer": 1 };
+
+  function renderCtxPopover() {
+    if (!ctxPopoverEl || !richContextUsage) return;
+    var d = richContextUsage;
+    var cats = d.categories || [];
+    var total = d.totalTokens || 0;
+    var max = d.maxTokens || 0;
+    var pct = d.percentage != null ? d.percentage : (max > 0 ? (total / max) * 100 : 0);
+
+    var html = "";
+
+    // Header
+    html += '<div class="ctx-pop-header">';
+    html += '<span class="ctx-pop-model">' + escHtml(d.model || contextData.model || "-") + '</span>';
+    html += '<span class="ctx-pop-pct">' + pct.toFixed(0) + '%';
+    html += '<span class="ctx-pop-tokens">' + formatTokens(total) + ' / ' + formatTokens(max) + '</span>';
+    html += '</span>';
+    html += '</div>';
+
+    // Category emoji map
+    var CTX_EMOJI = {
+      "System prompt": "\ud83d\udcdc", "System tools": "\ud83d\udee0\ufe0f",
+      "Memory files": "\ud83d\udcc1", "Skills": "\u26a1", "Messages": "\ud83d\udcac",
+      "MCP tools": "\ud83d\udd0c", "Agents": "\ud83e\udd16", "Deferred tools": "\ud83d\udce6"
+    };
+
+    // Stacked bar
+    if (cats.length > 0 && max > 0) {
+      html += '<div class="ctx-cat-bar">';
+      for (var i = 0; i < cats.length; i++) {
+        var cat = cats[i];
+        if (cat.isDeferred || !cat.tokens || CTX_HIDDEN_CATS[cat.name]) continue;
+        var w = Math.max(0.3, (cat.tokens / max) * 100);
+        html += '<div style="width:' + w.toFixed(2) + '%;background:' + escHtml(cat.color) + '"></div>';
+      }
+      html += '</div>';
+
+      // Legend
+      html += '<div class="ctx-cat-legend">';
+      for (var j = 0; j < cats.length; j++) {
+        var c = cats[j];
+        if (c.isDeferred || !c.tokens || CTX_HIDDEN_CATS[c.name]) continue;
+        var emoji = CTX_EMOJI[c.name] || "\ud83d\udcca";
+        html += '<div class="ctx-cat-item">';
+        html += '<span class="ctx-cat-name">' + em(emoji) + ' ' + escHtml(c.name) + '</span>';
+        html += '<span class="ctx-cat-value">' + formatTokens(c.tokens) + '</span>';
+        html += '</div>';
+      }
+      html += '</div>';
+    }
+
+    // Message breakdown
+    var mb = d.messageBreakdown;
+    if (mb) {
+      html += '<div class="ctx-pop-divider"></div>';
+      html += '<div class="ctx-pop-section-label">' + em("\ud83d\udcac") + ' Messages</div>';
+      if (mb.userMessageTokens) {
+        html += '<div class="ctx-pop-row"><span class="ctx-pop-row-label">' + em("\ud83d\udc64") + ' User</span><span class="ctx-pop-row-value">' + formatTokens(mb.userMessageTokens) + '</span></div>';
+      }
+      if (mb.assistantMessageTokens) {
+        html += '<div class="ctx-pop-row"><span class="ctx-pop-row-label">' + em("\ud83e\udd16") + ' Assistant</span><span class="ctx-pop-row-value">' + formatTokens(mb.assistantMessageTokens) + '</span></div>';
+      }
+      if (mb.toolCallTokens) {
+        html += '<div class="ctx-pop-row"><span class="ctx-pop-row-label">' + em("\ud83d\udee0\ufe0f") + ' Tool calls</span><span class="ctx-pop-row-value">' + formatTokens(mb.toolCallTokens) + '</span></div>';
+      }
+      if (mb.toolResultTokens) {
+        html += '<div class="ctx-pop-row"><span class="ctx-pop-row-label">' + em("\ud83d\udccb") + ' Tool results</span><span class="ctx-pop-row-value">' + formatTokens(mb.toolResultTokens) + '</span></div>';
+      }
+      if (mb.attachmentTokens) {
+        html += '<div class="ctx-pop-row"><span class="ctx-pop-row-label">' + em("\ud83d\udcce") + ' Attachments</span><span class="ctx-pop-row-value">' + formatTokens(mb.attachmentTokens) + '</span></div>';
+      }
+    }
+
+    // Memory files
+    var mf = d.memoryFiles;
+    if (mf && mf.length > 0) {
+      html += '<div class="ctx-pop-divider"></div>';
+      html += '<div class="ctx-pop-section-label">' + em("\ud83d\udcc1") + ' Memory Files</div>';
+      var baseCount = {};
+      for (var mc = 0; mc < mf.length; mc++) {
+        var bn = mf[mc].path.split("/").pop() || mf[mc].path;
+        baseCount[bn] = (baseCount[bn] || 0) + 1;
+      }
+      for (var mi = 0; mi < mf.length; mi++) {
+        var fpath = mf[mi].path;
+        var fname = fpath.split("/").pop() || fpath;
+        if (baseCount[fname] > 1) {
+          var parts = fpath.split("/");
+          fname = parts.length >= 2 ? parts[parts.length - 2] + "/" + fname : fpath;
+        }
+        html += '<div class="ctx-pop-row"><span class="ctx-pop-row-label">' + em("\ud83d\udcc4") + ' ' + escHtml(fname) + '</span><span class="ctx-pop-row-value">' + formatTokens(mf[mi].tokens) + '</span></div>';
+      }
+    }
+
+    // Auto-compact note
+    if (d.isAutoCompactEnabled && d.autoCompactThreshold) {
+      html += '<div class="ctx-pop-note">' + em("\u267b\ufe0f") + ' Auto-compact at ' + formatTokens(d.autoCompactThreshold) + '</div>';
+    }
+
+    ctxPopoverEl.innerHTML = html;
+  }
+
+  function escHtml(s) {
+    var div = document.createElement("div");
+    div.textContent = s;
+    return div.innerHTML;
+  }
+
+  function em(emoji) {
+    return '<span class="ctx-emoji">' + emoji + '</span>';
+  }
+
   function resetContext() {
     resetContextData();
     // Keep view state, just reset data
@@ -2851,6 +3023,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     isMateDm: function () { return dmMode && dmTargetUser && dmTargetUser.isMate; },
     getMateName: function () { return dmTargetUser ? (dmTargetUser.displayName || "Mate") : "Mate"; },
     getMateAvatarUrl: function () { return document.body.dataset.mateAvatarUrl || ""; },
+    getClaudeAvatar: function () { return CLAUDE_CODE_AVATAR; },
     getMateById: function (id) {
       if (!id || !cachedMatesList) return null;
       for (var i = 0; i < cachedMatesList.length; i++) {
@@ -2871,6 +3044,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     var div = document.createElement("div");
     div.className = "msg-user" + (isOtherUser ? " msg-user-other" : "");
     div.dataset.turn = ++turnCounter;
+    if (shouldGroupMessage("msg-user")) div.classList.add("grouped");
     var bubble = document.createElement("div");
     bubble.className = "bubble";
     bubble.dir = "auto";
@@ -2961,8 +3135,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     header.appendChild(nameSpan);
     var timeSpan = document.createElement("span");
     timeSpan.className = "dm-bubble-time";
-    var nowH = new Date();
-    timeSpan.textContent = String(nowH.getHours()).padStart(2, "0") + ":" + String(nowH.getMinutes()).padStart(2, "0");
+    timeSpan.textContent = getMsgTime();
     header.appendChild(timeSpan);
     contentWrap.appendChild(header);
     contentWrap.appendChild(bubble);
@@ -2971,10 +3144,8 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     // Action bar below bubble (icons visible on hover)
     var actions = document.createElement("div");
     actions.className = "msg-actions";
-    var now = new Date();
-    var timeStr = String(now.getHours()).padStart(2, "0") + ":" + String(now.getMinutes()).padStart(2, "0");
     actions.innerHTML =
-      '<span class="msg-action-time">' + timeStr + '</span>' +
+      '<span class="msg-action-time">' + getMsgTime() + '</span>' +
       '<button class="msg-action-btn msg-action-copy" type="button" title="Copy">' + iconHtml("copy") + '</button>' +
       '<button class="msg-action-btn msg-action-fork" type="button" title="Fork">' + iconHtml("git-branch") + '</button>' +
       '<button class="msg-action-btn msg-action-rewind msg-user-rewind-btn" type="button" title="Rewind">' + iconHtml("rotate-ccw") + '</button>' +
@@ -2995,11 +3166,33 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     forceScrollToBottom();
   }
 
+  // Track the timestamp of the current message being processed (from history _ts or now)
+  var currentMsgTs = null;
+
+  function getMsgTime() {
+    var d = currentMsgTs ? new Date(currentMsgTs) : new Date();
+    return String(d.getHours()).padStart(2, "0") + ":" + String(d.getMinutes()).padStart(2, "0");
+  }
+
+  function shouldGroupMessage(senderClass) {
+    // Skip grouping during history replay if no timestamp data
+    if (replayingHistory && !currentMsgTs) return false;
+    var prev = messagesEl.lastElementChild;
+    if (!prev || !prev.classList.contains(senderClass)) return false;
+    var prevTime = prev.querySelector(".dm-bubble-time");
+    if (!prevTime) return false;
+    return prevTime.textContent === getMsgTime();
+  }
+
   function ensureAssistantBlock() {
     if (!currentMsgEl) {
       currentMsgEl = document.createElement("div");
       currentMsgEl.className = "msg-assistant";
       currentMsgEl.dataset.turn = turnCounter;
+
+      var grouped = shouldGroupMessage("msg-assistant");
+      if (grouped) currentMsgEl.classList.add("grouped");
+
       // Always render avatar + header structure (CSS controls visibility)
       var _isDm2 = document.body.classList.contains("mate-dm-active") && document.body.dataset.mateAvatarUrl;
       var avi = document.createElement("img");
@@ -3018,8 +3211,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
       header.appendChild(nameSpan);
       var timeSpan = document.createElement("span");
       timeSpan.className = "dm-bubble-time";
-      var nowA = new Date();
-      timeSpan.textContent = String(nowA.getHours()).padStart(2, "0") + ":" + String(nowA.getMinutes()).padStart(2, "0");
+      timeSpan.textContent = getMsgTime();
       header.appendChild(timeSpan);
       contentWrap.appendChild(header);
 
@@ -3547,42 +3739,134 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
 
   function addScheduledMessageBubble(text, resetsAt) {
     removeScheduledMessageBubble();
+    var isChannel = document.body.classList.contains("wide-view");
     var wrap = document.createElement("div");
     wrap.className = "msg-user scheduled-msg-wrap";
     wrap.id = "scheduled-msg-bubble";
 
-    var bubble = document.createElement("div");
-    bubble.className = "bubble scheduled-msg-bubble";
+    var countdownEl;
+    var cancelBtn;
 
-    var textEl = document.createElement("span");
-    textEl.textContent = text;
-    bubble.appendChild(textEl);
+    if (isChannel) {
+      // Channel mode: avatar + header with scheduled badge + message
+      var _me = cachedAllUsers.find(function (u) { return u.id === myUserId; });
+      if (!_me) { try { _me = JSON.parse(localStorage.getItem("clay_my_user") || "null"); } catch(e) {} }
+      var _myName = document.body.dataset.myDisplayName || (_me && (_me.displayName || _me.username)) || "Me";
 
-    var metaEl = document.createElement("div");
-    metaEl.className = "scheduled-msg-meta";
+      var avi = document.createElement("img");
+      avi.className = "dm-bubble-avatar dm-bubble-avatar-me";
+      avi.src = document.body.dataset.myAvatarUrl || userAvatarUrl(_me || { id: myUserId }, 36);
+      wrap.appendChild(avi);
 
-    var clockIcon = document.createElement("span");
-    clockIcon.className = "scheduled-msg-icon";
-    clockIcon.innerHTML = iconHtml("clock");
-    metaEl.appendChild(clockIcon);
+      var content = document.createElement("div");
+      content.className = "dm-bubble-content";
 
-    var countdownEl = document.createElement("span");
-    countdownEl.className = "scheduled-msg-countdown";
-    metaEl.appendChild(countdownEl);
+      var header = document.createElement("div");
+      header.className = "dm-bubble-header";
 
-    var cancelBtn = document.createElement("button");
-    cancelBtn.className = "scheduled-msg-cancel";
-    cancelBtn.title = "Cancel scheduled message";
-    cancelBtn.textContent = "\u00d7";
-    cancelBtn.addEventListener("click", function () {
-      if (ws && ws.readyState === 1) {
-        ws.send(JSON.stringify({ type: "cancel_scheduled_message" }));
-      }
-    });
-    metaEl.appendChild(cancelBtn);
+      var nameSpan = document.createElement("span");
+      nameSpan.className = "dm-bubble-name";
+      nameSpan.textContent = _myName;
+      header.appendChild(nameSpan);
+
+      var badge = document.createElement("span");
+      badge.className = "scheduled-msg-badge";
+      badge.innerHTML = iconHtml("clock");
+      countdownEl = document.createElement("span");
+      countdownEl.className = "scheduled-msg-countdown";
+      badge.appendChild(countdownEl);
+      header.appendChild(badge);
+
+      var actions = document.createElement("span");
+      actions.className = "scheduled-msg-actions";
+
+      var sendNowBtn = document.createElement("button");
+      sendNowBtn.className = "scheduled-msg-send-now";
+      sendNowBtn.textContent = "Send now";
+      sendNowBtn.addEventListener("click", function () {
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "send_scheduled_now" }));
+        }
+      });
+      actions.appendChild(sendNowBtn);
+
+      var sep = document.createElement("span");
+      sep.className = "scheduled-msg-sep";
+      sep.textContent = "\u00b7";
+      actions.appendChild(sep);
+
+      cancelBtn = document.createElement("button");
+      cancelBtn.className = "scheduled-msg-cancel";
+      cancelBtn.textContent = "Cancel";
+      cancelBtn.addEventListener("click", function () {
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "cancel_scheduled_message" }));
+        }
+      });
+      actions.appendChild(cancelBtn);
+
+      header.appendChild(actions);
+
+      content.appendChild(header);
+
+      var bubble = document.createElement("div");
+      bubble.className = "bubble scheduled-msg-bubble";
+      var textEl = document.createElement("span");
+      textEl.textContent = text;
+      bubble.appendChild(textEl);
+      content.appendChild(bubble);
+
+      wrap.appendChild(content);
+    } else {
+      // Bubble mode: original layout
+      var bubble = document.createElement("div");
+      bubble.className = "bubble scheduled-msg-bubble";
+
+      var textEl = document.createElement("span");
+      textEl.textContent = text;
+      bubble.appendChild(textEl);
+
+      var metaEl = document.createElement("div");
+      metaEl.className = "scheduled-msg-meta";
+
+      var clockIcon = document.createElement("span");
+      clockIcon.className = "scheduled-msg-icon";
+      clockIcon.innerHTML = iconHtml("clock");
+      metaEl.appendChild(clockIcon);
+
+      countdownEl = document.createElement("span");
+      countdownEl.className = "scheduled-msg-countdown";
+      metaEl.appendChild(countdownEl);
+
+      var sendNowBtn2 = document.createElement("button");
+      sendNowBtn2.className = "scheduled-msg-send-now";
+      sendNowBtn2.textContent = "Send now";
+      sendNowBtn2.addEventListener("click", function () {
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "send_scheduled_now" }));
+        }
+      });
+      metaEl.appendChild(sendNowBtn2);
+
+      var sep2 = document.createElement("span");
+      sep2.className = "scheduled-msg-sep";
+      sep2.textContent = "\u00b7";
+      metaEl.appendChild(sep2);
+
+      cancelBtn = document.createElement("button");
+      cancelBtn.className = "scheduled-msg-cancel";
+      cancelBtn.textContent = "Cancel";
+      cancelBtn.addEventListener("click", function () {
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "cancel_scheduled_message" }));
+        }
+      });
+      metaEl.appendChild(cancelBtn);
+
+      wrap.appendChild(bubble);
+      wrap.appendChild(metaEl);
+    }
 
-    wrap.appendChild(bubble);
-    wrap.appendChild(metaEl);
     addToMessages(wrap);
     scheduledMsgEl = wrap;
     scrollToBottom();
@@ -3660,23 +3944,13 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     suggestionChipsEl.innerHTML = "";
     var chip = document.createElement("button");
     chip.className = "suggestion-chip";
-    chip.innerHTML =
-      '<span class="suggestion-chip-send">' + iconHtml("sparkles") +
-      '<span class="suggestion-chip-text">' + escapeHtml(suggestion) + '</span></span>' +
-      '<span class="suggestion-chip-edit">' + iconHtml("pencil") + '</span>';
+    chip.innerHTML = iconHtml("sparkles") +
+      '<span class="suggestion-chip-text">' + escapeHtml(suggestion) + '</span>';
     chip.addEventListener("click", function () {
       inputEl.value = suggestion;
       hideSuggestionChips();
       sendMessage();
     });
-    chip.querySelector(".suggestion-chip-edit").addEventListener("click", function (e) {
-      e.stopPropagation();
-      inputEl.value = suggestion;
-      inputEl.focus();
-      inputEl.select();
-      autoResize();
-      hideSuggestionChips();
-    });
     suggestionChipsEl.appendChild(chip);
     suggestionChipsEl.classList.remove("hidden");
     refreshIcons();
@@ -3718,6 +3992,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     setStatus("connected");
     if (!loopActive) enableMainInput();
     resetUsage();
+    resetTurnMetaCost();
     resetContext();
     // Clear header indicators
     clearRateLimitIndicator();
@@ -3868,6 +4143,31 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
 
       // Session restore is now server-driven (user-presence.json).
       // Mate DM restore is also server-driven via "restore_mate_dm" message.
+      // Fallback: if server doesn't restore DM within 2s, try localStorage
+      var savedDm = null;
+      try { savedDm = localStorage.getItem("clay-active-dm"); } catch (e) {}
+      if (savedDm && !dmMode && !mateProjectSlug) {
+        var dmFallbackTimer = setTimeout(function () {
+          if (!dmMode && savedDm) {
+            console.log("[dm-restore] Server did not restore DM, using localStorage fallback:", savedDm);
+            openDm(savedDm);
+          }
+        }, 2000);
+        // Cancel fallback if server restores DM first
+        var origHandler = ws.onmessage;
+        var patchedOnce = false;
+        var checkRestore = function (evt) {
+          try {
+            var d = JSON.parse(evt.data);
+            if (d.type === "restore_mate_dm" && !patchedOnce) {
+              patchedOnce = true;
+              clearTimeout(dmFallbackTimer);
+            }
+          } catch (e) {}
+        };
+        ws.addEventListener("message", checkRestore);
+        setTimeout(function () { ws.removeEventListener("message", checkRestore); }, 3000);
+      }
       // Safety: clear returningFromMateDm after initial messages settle
       // (handles case where we connect to a non-main project that won't send restore_mate_dm)
       if (returningFromMateDm) {
@@ -3966,6 +4266,8 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     }
 
   function processMessage(msg) {
+      // Preserve original timestamp from history replay
+      currentMsgTs = msg._ts || null;
       var isMateDm = dmMode && dmTargetUser && dmTargetUser.isMate;
 
       // DEBUG: trace session/history loading
@@ -3980,6 +4282,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
       if (isMateDm) {
         if (msg.type === "session_list") {
           renderMateSessionList(msg.sessions || []);
+          refreshMobileChatSheet();
           // Override title bar with mate name and re-apply color
           var _mdn = (dmTargetUser.displayName || "New Mate");
           if (headerTitleEl) headerTitleEl.textContent = _mdn;
@@ -4057,6 +4360,10 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
 
         case "history_done":
           replayingHistory = false;
+          // Restore cached rich context usage BEFORE updateContextPanel runs
+          if (msg.contextUsage) {
+            richContextUsage = msg.contextUsage;
+          }
           // Restore accurate context data from the last result in full history
           if (msg.lastUsage || msg.lastModelUsage) {
             accumulateContext(msg.lastCost, msg.lastUsage, msg.lastModelUsage, msg.lastStreamInputTokens);
@@ -4321,9 +4628,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           break;
 
         case "session_list":
-          if (isMateDm) {
-            renderMateSessionList(msg.sessions || []);
-          }
+          renderMateSessionList(msg.sessions || []);
           renderSessionList(msg.sessions || []);
           handlePaletteSessionSwitch();
           break;
@@ -4414,6 +4719,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           break;
 
         case "user_message":
+          if (msg._internal) break;
           resetThinkingGroup();
           if (msg.planContent) {
             setPlanContent(msg.planContent);
@@ -4424,20 +4730,73 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           }
           break;
 
+        case "context_preview":
+          // Show a Context Card with tab screenshot between user message and assistant response
+          if (msg.tab) {
+            var card = document.createElement("div");
+            card.className = "context-card";
+
+            // Header
+            var header = document.createElement("div");
+            header.className = "context-card-header";
+            var icon = document.createElement("span");
+            icon.className = "context-card-icon";
+            icon.textContent = "\uD83D\uDC41";
+            header.appendChild(icon);
+            var label = document.createElement("span");
+            label.textContent = "Viewing tab";
+            header.appendChild(label);
+            card.appendChild(header);
+
+            // Screenshot
+            if (msg.tab.screenshotUrl) {
+              var img = document.createElement("img");
+              img.className = "context-card-screenshot";
+              img.src = msg.tab.screenshotUrl;
+              img.loading = "lazy";
+              img.addEventListener("click", function () { showImageModal(this.src); });
+              card.appendChild(img);
+            }
+
+            // Meta: title + domain
+            var tabTitle = msg.tab.title || "";
+            var tabDomain = "";
+            try { tabDomain = new URL(msg.tab.url).hostname; } catch (e) {}
+            if (tabTitle || tabDomain) {
+              var meta = document.createElement("div");
+              meta.className = "context-card-meta";
+              var titleEl = document.createElement("span");
+              titleEl.className = "context-card-title";
+              titleEl.textContent = tabTitle;
+              meta.appendChild(titleEl);
+              if (tabDomain) {
+                var domainEl = document.createElement("span");
+                domainEl.className = "context-card-domain";
+                domainEl.textContent = tabDomain;
+                meta.appendChild(domainEl);
+              }
+              card.appendChild(meta);
+            }
+
+            messagesEl.appendChild(card);
+            scrollToBottom();
+          }
+          break;
+
         case "status":
           if (msg.status === "processing") {
             setStatus("processing");
-            if (!(dmMode && dmTargetUser && dmTargetUser.isMate)) {
-              setActivity(randomThinkingVerb() + "...");
+            if (!(dmMode && dmTargetUser && dmTargetUser.isMate) && !matePreThinkingEl) {
+              setActivity("thinking");
             }
           }
           break;
 
         case "compacting":
           if (msg.active) {
-            setActivity("Compacting conversation...");
+            setActivity("compacting");
           } else if (!(dmMode && dmTargetUser && dmTargetUser.isMate)) {
-            setActivity(randomThinkingVerb() + "...");
+            setActivity("thinking");
           }
           break;
 
@@ -4453,7 +4812,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
         case "thinking_stop":
           stopThinking(msg.duration);
           if (!(dmMode && dmTargetUser && dmTargetUser.isMate)) {
-            setActivity(randomThinkingVerb() + "...");
+            setActivity("thinking");
           }
           break;
 
@@ -4619,6 +4978,14 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           accumulateContext(msg.cost, msg.usage, msg.modelUsage, msg.lastStreamInputTokens);
           break;
 
+        case "context_usage":
+          if (msg.data && !replayingHistory) {
+            richContextUsage = msg.data;
+            if (headerContextEl) headerContextEl.removeAttribute("data-tip");
+            if (ctxPopoverVisible) renderCtxPopover();
+          }
+          break;
+
         case "done":
           setActivity(null);
           stopThinking();
@@ -4711,6 +5078,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           break;
 
         case "rewind_complete":
+          onRewindComplete();
           setRewindMode(false);
           var rewindText = "Rewound to earlier point. Files have been restored.";
           if (msg.mode === "chat") rewindText = "Conversation rewound to earlier point.";
@@ -4719,6 +5087,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           break;
 
         case "rewind_error":
+          onRewindError();
           clearPendingRewindUuid();
           addSystemMessage(msg.text || "Rewind failed.", true);
           break;
@@ -4791,6 +5160,15 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
 
         case "term_list":
           handleTermList(msg);
+          updateTerminalList(msg.terminals);
+          break;
+
+        case "context_sources_state":
+          handleContextSourcesState(msg);
+          break;
+
+        case "extension_command":
+          sendExtensionCommand(msg.command, msg.args, msg.requestId);
           break;
 
         case "term_created":
@@ -4809,6 +5187,10 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           handleTermOutput(msg);
           break;
 
+        case "term_resized":
+          handleTermResized(msg);
+          break;
+
         case "term_exited":
           handleTermExited(msg);
           break;
@@ -4976,6 +5358,22 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
             // Update mate sidebar if currently viewing this mate
             if (dmMode && dmTargetUser && dmTargetUser.isMate && dmTargetUser.id === msg.mate.id) {
               updateMateSidebarProfile(msg.mate);
+              // Sync dmTargetUser so subsequent renders use fresh data
+              var mp2 = msg.mate.profile || {};
+              dmTargetUser.displayName = mp2.displayName || msg.mate.name || dmTargetUser.displayName;
+              dmTargetUser.avatarStyle = mp2.avatarStyle || dmTargetUser.avatarStyle;
+              dmTargetUser.avatarSeed = mp2.avatarSeed || dmTargetUser.avatarSeed;
+              dmTargetUser.avatarColor = mp2.avatarColor || dmTargetUser.avatarColor;
+              dmTargetUser.avatarCustom = mp2.avatarCustom || "";
+              dmTargetUser.profile = mp2;
+              // Refresh body dataset so new chat bubbles use the updated avatar
+              document.body.dataset.mateAvatarUrl = mateAvatarUrl(dmTargetUser, 36);
+              document.body.dataset.mateName = mp2.displayName || msg.mate.name || "";
+              // Update existing chat bubble avatars
+              var mateAvis = document.querySelectorAll(".dm-bubble-avatar-mate");
+              for (var mbi = 0; mbi < mateAvis.length; mbi++) {
+                mateAvis[mbi].src = document.body.dataset.mateAvatarUrl;
+              }
             }
             // Update DM header if currently chatting with this mate
             if (dmMode && dmTargetUser && dmTargetUser.id === msg.mate.id) {
@@ -5005,6 +5403,23 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           break;
 
         // --- @Mention ---
+        case "mention_processing":
+          // Broadcast: show/hide activity dot on mate avatar across all tabs
+          if (msg.mateId) {
+            var mateContainers = document.querySelectorAll('.icon-strip-mate[data-user-id="' + msg.mateId + '"]');
+            for (var mi = 0; mi < mateContainers.length; mi++) {
+              var dot = mateContainers[mi].querySelector(".icon-strip-status");
+              if (msg.active) {
+                if (dot) dot.classList.add("processing");
+                mateContainers[mi].classList.add("mention-active");
+              } else {
+                if (dot) dot.classList.remove("processing");
+                mateContainers[mi].classList.remove("mention-active");
+              }
+            }
+          }
+          break;
+
         case "mention_start":
           handleMentionStart(msg);
           break;
@@ -5082,6 +5497,10 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           }
           break;
 
+        case "debate_hand_raised":
+          // Visual feedback: hand is raised, waiting for floor
+          break;
+
         case "debate_comment_queued":
           handleDebateCommentQueued(msg);
           break;
@@ -5098,6 +5517,14 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
           showDebateConcludeConfirm(msg);
           break;
 
+        case "debate_user_floor":
+          showDebateUserFloor(msg);
+          break;
+
+        case "debate_user_floor_done":
+          renderDebateUserFloorDone(msg);
+          break;
+
         case "debate_user_resume":
           renderDebateUserResume(msg);
           break;
@@ -5443,10 +5870,17 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     isDmMode: function () { return dmMode && !(dmTargetUser && dmTargetUser.isMate); },
     getDmKey: function () { return dmKey; },
     handleDmSend: function () { handleDmSend(); },
+    isDebateEndedMode: function () { return debateEndedMode; },
+    handleDebateEndedSend: function () { handleDebateEndedSend(); },
+    isDebateConcludeMode: function () { return debateConcludeMode; },
+    handleDebateConcludeSend: function () { handleDebateConcludeSend(); },
+    isDebateFloorMode: function () { return debateFloorMode; },
+    handleDebateFloorSend: function () { handleDebateFloorSend(); },
     isMateDm: function () { return dmMode && dmTargetUser && dmTargetUser.isMate; },
     getMateName: function () { return dmTargetUser ? (dmTargetUser.displayName || "Mate") : "Mate"; },
     getMateAvatarUrl: function () { return document.body.dataset.mateAvatarUrl || ""; },
     showMatePreThinking: function () { showMatePreThinking(); },
+    showClaudePreThinking: function () { showClaudePreThinking(); },
   });
 
   // --- @Mention module ---
@@ -5475,6 +5909,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     availableBuiltins: function () { return cachedAvailableBuiltins || []; },
     currentMateId: function () { return (dmTargetUser && dmTargetUser.isMate) ? dmTargetUser.id : null; },
     requireSkills: requireSkills,
+    showDebateEndedMode: function (msg) { showDebateEndedMode(msg); },
   });
 
   // --- STT module (voice input via Web Speech API) ---
@@ -5737,6 +6172,65 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     fileViewerEl: $("file-viewer"),
   });
 
+  // --- Context Sources ---
+  initContextSources({
+    get ws() { return ws; },
+    get connected() { return connected; },
+  });
+
+  // --- Chrome Extension Bridge ---
+  var _extRequestCallbacks = {}; // requestId -> callback function
+
+  function sendExtensionCommand(command, args, requestId) {
+    window.postMessage({
+      source: "clay-page",
+      payload: {
+        type: "clay_ext_command",
+        command: command,
+        args: args,
+        requestId: requestId
+      }
+    }, "*");
+  }
+
+  function handleExtensionResult(requestId, result) {
+    // Check local callback first (for server-initiated requests)
+    var cb = _extRequestCallbacks[requestId];
+    if (cb) {
+      delete _extRequestCallbacks[requestId];
+      cb(result);
+      return;
+    }
+    // Forward to server
+    if (ws && ws.readyState === 1) {
+      ws.send(JSON.stringify({
+        type: "extension_result",
+        requestId: requestId,
+        result: result
+      }));
+    }
+  }
+
+  window.addEventListener("message", function(event) {
+    if (event.source !== window) return;
+    if (!event.data || event.data.source !== "clay-chrome-extension") return;
+    var msg = event.data.payload;
+
+    if (msg.type === "clay_ext_tab_list") {
+      updateBrowserTabList(msg.tabs);
+      // Also inform server about tab list
+      if (ws && ws.readyState === 1) {
+        ws.send(JSON.stringify({
+          type: "browser_tab_list",
+          tabs: msg.tabs
+        }));
+      }
+    }
+    if (msg.type === "clay_ext_result") {
+      handleExtensionResult(msg.requestId, msg.result);
+    }
+  });
+
   // --- Playbook Engine ---
   initPlaybook();
 
@@ -6706,6 +7200,223 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     scrollToBottom();
   }
 
+  var debateFloorMode = false;
+  var debateConcludeMode = false;
+
+  function showDebateConcludeMode() {
+    debateConcludeMode = true;
+    removeDebateBottomBar();
+    var inputArea = document.getElementById("input-area");
+    if (inputArea) {
+      inputArea.classList.add("debate-floor-mode");
+      inputArea.style.display = "";
+    }
+    // Add conclude banner above input
+    var existingBanner = document.getElementById("debate-floor-banner");
+    if (existingBanner) existingBanner.remove();
+    var banner = document.createElement("div");
+    banner.id = "debate-floor-banner";
+    banner.className = "debate-floor-banner";
+    banner.innerHTML = iconHtml("check-circle") + " <span>The moderator is ready to conclude</span>" +
+      '<button class="debate-floor-done-btn debate-floor-end-btn" id="debate-floor-end-btn">End Debate</button>';
+    if (inputArea && inputArea.parentNode) {
+      inputArea.parentNode.insertBefore(banner, inputArea);
+    }
+    refreshIcons();
+    // End Debate button
+    var endBtn = document.getElementById("debate-floor-end-btn");
+    if (endBtn) {
+      endBtn.addEventListener("click", function () {
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "debate_conclude_response", action: "end" }));
+        }
+        exitDebateConcludeMode();
+      });
+    }
+    // Update placeholder
+    var inputEl = document.getElementById("input");
+    if (inputEl) {
+      inputEl._origPlaceholder = inputEl._origPlaceholder || inputEl.placeholder;
+      inputEl.placeholder = "Add a direction to continue the debate...";
+      inputEl.focus();
+    }
+    scrollToBottom();
+  }
+
+  function exitDebateConcludeMode() {
+    debateConcludeMode = false;
+    var inputArea = document.getElementById("input-area");
+    if (inputArea) inputArea.classList.remove("debate-floor-mode");
+    var banner = document.getElementById("debate-floor-banner");
+    if (banner) banner.remove();
+    var inputEl = document.getElementById("input");
+    if (inputEl && inputEl._origPlaceholder) {
+      inputEl.placeholder = inputEl._origPlaceholder;
+      delete inputEl._origPlaceholder;
+    }
+  }
+
+  function handleDebateConcludeSend() {
+    var text = inputEl.value.trim();
+    if (ws && ws.readyState === 1) {
+      ws.send(JSON.stringify({ type: "debate_conclude_response", action: "continue", text: text }));
+    }
+    inputEl.value = "";
+    exitDebateConcludeMode();
+    showDebateBottomBar("live");
+  }
+
+  var debateEndedMode = false;
+
+  function showDebateEndedMode(msg) {
+    debateEndedMode = true;
+    removeDebateBottomBar();
+    var inputArea = document.getElementById("input-area");
+    if (inputArea) {
+      inputArea.classList.add("debate-floor-mode");
+      inputArea.style.display = "";
+    }
+    var existingBanner = document.getElementById("debate-floor-banner");
+    if (existingBanner) existingBanner.remove();
+    var banner = document.createElement("div");
+    banner.id = "debate-floor-banner";
+    banner.className = "debate-floor-banner";
+    banner.innerHTML = iconHtml("check-circle") + " <span>Debate ended</span>" +
+      '<button class="debate-floor-done-btn" id="debate-ended-resume-btn">Resume</button>' +
+      '<button class="debate-floor-done-btn" id="debate-ended-pdf-btn">' + iconHtml("download") + ' PDF</button>';
+    if (inputArea && inputArea.parentNode) {
+      inputArea.parentNode.insertBefore(banner, inputArea);
+    }
+    refreshIcons();
+    // Resume button
+    var resumeBtn = document.getElementById("debate-ended-resume-btn");
+    if (resumeBtn) {
+      resumeBtn.addEventListener("click", function () {
+        handleDebateEndedSend();
+      });
+    }
+    // PDF button
+    var pdfBtn = document.getElementById("debate-ended-pdf-btn");
+    if (pdfBtn) {
+      pdfBtn.addEventListener("click", function () {
+        pdfBtn.disabled = true;
+        exportDebateAsPdf().then(function () { pdfBtn.disabled = false; }).catch(function () { pdfBtn.disabled = false; });
+      });
+    }
+    var inputEl2 = document.getElementById("input");
+    if (inputEl2) {
+      inputEl2._origPlaceholder = inputEl2._origPlaceholder || inputEl2.placeholder;
+      inputEl2.placeholder = "Continue with a new direction...";
+    }
+    scrollToBottom();
+  }
+
+  function exitDebateEndedMode() {
+    debateEndedMode = false;
+    var inputArea = document.getElementById("input-area");
+    if (inputArea) inputArea.classList.remove("debate-floor-mode");
+    var banner = document.getElementById("debate-floor-banner");
+    if (banner) banner.remove();
+    var inputEl2 = document.getElementById("input");
+    if (inputEl2 && inputEl2._origPlaceholder) {
+      inputEl2.placeholder = inputEl2._origPlaceholder;
+      delete inputEl2._origPlaceholder;
+    }
+  }
+
+  function handleDebateEndedSend() {
+    var text = inputEl.value.trim();
+    if (ws && ws.readyState === 1) {
+      ws.send(JSON.stringify({ type: "debate_conclude_response", action: "continue", text: text }));
+    }
+    inputEl.value = "";
+    exitDebateEndedMode();
+  }
+
+  function showDebateUserFloor(msg) {
+    debateFloorMode = true;
+    // Remove debate bottom bar and show input area in floor mode
+    removeDebateBottomBar();
+    var inputArea = document.getElementById("input-area");
+    if (inputArea) {
+      inputArea.classList.add("debate-floor-mode");
+      inputArea.style.display = "";
+    }
+    // Add floor banner above input
+    var existingBanner = document.getElementById("debate-floor-banner");
+    if (existingBanner) existingBanner.remove();
+    var banner = document.createElement("div");
+    banner.id = "debate-floor-banner";
+    banner.className = "debate-floor-banner";
+    banner.innerHTML = iconHtml("mic") + " <span>You have the floor</span>" +
+      '<button class="debate-floor-done-btn" id="debate-floor-done-btn">Pass</button>';
+    if (inputArea && inputArea.parentNode) {
+      inputArea.parentNode.insertBefore(banner, inputArea);
+    }
+    refreshIcons();
+    // Done button: exit floor mode without sending
+    var doneBtn = document.getElementById("debate-floor-done-btn");
+    if (doneBtn) {
+      doneBtn.addEventListener("click", function () {
+        // Pass without speaking: resume debate
+        if (ws && ws.readyState === 1) {
+          ws.send(JSON.stringify({ type: "debate_user_floor_response", text: "(The user passed without speaking)" }));
+        }
+        exitDebateFloorMode();
+        showDebateBottomBar("live");
+      });
+    }
+    // Update placeholder
+    var inputEl = document.getElementById("input");
+    if (inputEl) {
+      inputEl._origPlaceholder = inputEl.placeholder;
+      inputEl.placeholder = "Share your thoughts with the panel...";
+      inputEl.focus();
+    }
+    scrollToBottom();
+  }
+
+  function exitDebateFloorMode() {
+    debateFloorMode = false;
+    var inputArea = document.getElementById("input-area");
+    if (inputArea) inputArea.classList.remove("debate-floor-mode");
+    var banner = document.getElementById("debate-floor-banner");
+    if (banner) banner.remove();
+    var inputEl = document.getElementById("input");
+    if (inputEl && inputEl._origPlaceholder) {
+      inputEl.placeholder = inputEl._origPlaceholder;
+      delete inputEl._origPlaceholder;
+    }
+  }
+
+  function handleDebateFloorSend() {
+    var text = inputEl.value.trim();
+    if (!text) return;
+    if (ws && ws.readyState === 1) {
+      ws.send(JSON.stringify({ type: "debate_user_floor_response", text: text }));
+    }
+    inputEl.value = "";
+    exitDebateFloorMode();
+    showDebateBottomBar("live");
+  }
+
+  function renderDebateUserFloorDone(msg) {
+    if (!messagesEl) return;
+    var el = document.createElement("div");
+    el.className = "debate-user-comment";
+    var label = document.createElement("span");
+    label.className = "debate-comment-label";
+    label.innerHTML = iconHtml("mic") + " User:";
+    var textEl = document.createElement("div");
+    textEl.className = "debate-comment-text";
+    textEl.textContent = msg.text || "";
+    el.appendChild(label);
+    el.appendChild(textEl);
+    messagesEl.appendChild(el);
+    refreshIcons();
+    scrollToBottom();
+  }
+
   // Legacy handler kept for compatibility
   function showDebateSticky(phase, msg) {
     if (phase === "ended" || phase === "hide") {
@@ -6769,6 +7480,7 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
       bar.innerHTML =
         '<div class="debate-bottom-inner">' +
           '<button class="debate-bottom-hand" id="debate-bottom-hand">' + iconHtml("hand") + ' Raise hand</button>' +
+          '<span class="debate-bottom-waiting hidden" id="debate-bottom-waiting">' + iconHtml("loader") + ' You will get the floor after the current speaker</span>' +
           '<button class="debate-bottom-stop" id="debate-bottom-stop">' + iconHtml("square") + ' Stop</button>' +
         '</div>';
 
@@ -6776,6 +7488,14 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
       inputArea.style.display = "none";
       refreshIcons();
 
+      // Restore raised state if hand was already raised
+      if (debateHandRaiseOpen) {
+        var handBtn = document.getElementById("debate-bottom-hand");
+        var waitingEl = document.getElementById("debate-bottom-waiting");
+        if (handBtn) { handBtn.classList.add("raised"); handBtn.classList.add("hidden"); }
+        if (waitingEl) waitingEl.classList.remove("hidden");
+      }
+
       document.getElementById("debate-bottom-hand").addEventListener("click", function () {
         toggleDebateHandRaise();
       });
@@ -6785,47 +7505,9 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
         }
       });
     } else if (mode === "conclude") {
-      bar.innerHTML =
-        '<div class="debate-bottom-inner debate-bottom-conclude">' +
-          '<div class="debate-bottom-conclude-label">' + iconHtml("check-circle") + ' The moderator is ready to conclude. End the debate?</div>' +
-          '<textarea class="debate-bottom-conclude-input" id="debate-bottom-conclude-input" rows="3" placeholder="Or add a direction to continue..."></textarea>' +
-          '<div class="debate-bottom-conclude-actions">' +
-            '<button class="debate-bottom-continue" id="debate-bottom-continue">Continue</button>' +
-            '<button class="debate-bottom-end" id="debate-bottom-end">End Debate</button>' +
-          '</div>' +
-        '</div>';
-
-      inputArea.parentNode.insertBefore(bar, inputArea);
-      inputArea.style.display = "none";
-      refreshIcons();
-
-      var textArea = document.getElementById("debate-bottom-conclude-input");
-      document.getElementById("debate-bottom-end").addEventListener("click", function () {
-        if (ws && ws.readyState === 1) {
-          ws.send(JSON.stringify({ type: "debate_conclude_response", action: "end" }));
-        }
-        removeDebateBottomBar();
-      });
-      document.getElementById("debate-bottom-continue").addEventListener("click", function () {
-        var text = textArea ? textArea.value.trim() : "";
-        if (ws && ws.readyState === 1) {
-          ws.send(JSON.stringify({ type: "debate_conclude_response", action: "continue", text: text }));
-        }
-        removeDebateBottomBar();
-        showDebateBottomBar("live");
-      });
-      if (textArea) {
-        textArea.focus();
-        textArea.addEventListener("keydown", function (e) {
-          if (e.key === "Enter" && !e.shiftKey) {
-            e.preventDefault();
-            document.getElementById("debate-bottom-continue").click();
-          }
-        });
-        textArea.addEventListener("input", function () {
-          debateAutoResize(textArea, 12);
-        });
-      }
+      // Use native input area with conclude banner
+      showDebateConcludeMode();
+      return; // don't create a separate bar
     }
   }
 
@@ -6845,74 +7527,34 @@ import { initDebate, handleDebatePreparing, handleDebateStarted, handleDebateRes
     var handBar = document.getElementById("debate-hand-raise-bar");
     if (handBar) handBar.remove();
     debateHandRaiseOpen = false;
+    // Clean up floor/conclude modes
+    if (debateFloorMode) exitDebateFloorMode();
+    if (debateConcludeMode) exitDebateConcludeMode();
+    if (debateEndedMode) exitDebateEndedMode();
     // Restore input area
     var inputArea = document.getElementById("input-area");
     if (inputArea) inputArea.style.display = "";
   }
 
   function toggleDebateHandRaise(forceState) {
-    var show = typeof forceState === "boolean" ? forceState : !debateHandRaiseOpen;
-    debateHandRaiseOpen = show;
-
-    var existing = document.getElementById("debate-hand-raise-bar");
-    if (!show) {
-      if (existing) existing.remove();
-      return;
-    }
-    if (existing) {
-      var inp = existing.querySelector(".debate-hand-input");
-      if (inp) { inp.value = ""; inp.focus(); }
-      return;
-    }
-
-    // Create hand raise bar above input area
-    var bar = document.createElement("div");
-    bar.id = "debate-hand-raise-bar";
-    bar.className = "debate-hand-raise-bar";
-    bar.innerHTML =
-      '<div class="debate-hand-raise-inner">' +
-        '<span class="debate-hand-raise-label">' + iconHtml("hand") + ' Your comment:</span>' +
-        '<textarea class="debate-hand-input" rows="1" placeholder="Type your comment..."></textarea>' +
-        '<button class="debate-hand-send">Send</button>' +
-        '<button class="debate-hand-cancel">Cancel</button>' +
-      '</div>';
-
-    var inputArea = document.getElementById("input-area");
-    if (inputArea && inputArea.parentNode) {
-      inputArea.parentNode.insertBefore(bar, inputArea);
-    }
-    refreshIcons();
-
-    var textarea = bar.querySelector(".debate-hand-input");
-    var sendBtn = bar.querySelector(".debate-hand-send");
-    var cancelBtn = bar.querySelector(".debate-hand-cancel");
-
-    if (textarea) {
-      textarea.focus();
-      textarea.addEventListener("input", function () {
-        debateAutoResize(textarea, 12);
-      });
+    var raise = typeof forceState === "boolean" ? forceState : !debateHandRaiseOpen;
+    debateHandRaiseOpen = raise;
+
+    // Update UI: hide hand button, show waiting message
+    var handBtn = document.getElementById("debate-bottom-hand");
+    var waitingEl = document.getElementById("debate-bottom-waiting");
+    if (raise) {
+      if (handBtn) { handBtn.classList.add("raised"); handBtn.classList.add("hidden"); }
+      if (waitingEl) waitingEl.classList.remove("hidden");
+    } else {
+      if (handBtn) { handBtn.classList.remove("raised"); handBtn.classList.remove("hidden"); }
+      if (waitingEl) waitingEl.classList.add("hidden");
     }
 
-    sendBtn.addEventListener("click", function () {
-      var text = textarea ? textarea.value.trim() : "";
-      if (!text) return;
-      if (ws && ws.readyState === 1) {
-        ws.send(JSON.stringify({ type: "debate_comment", text: text }));
-      }
-      toggleDebateHandRaise(false);
-    });
-
-    cancelBtn.addEventListener("click", function () {
-      toggleDebateHandRaise(false);
-    });
-
-    if (textarea) {
-      textarea.addEventListener("keydown", function (e) {
-        if (e.key === "Enter" && !e.shiftKey) { e.preventDefault(); sendBtn.click(); }
-        if (e.key === "Escape") { toggleDebateHandRaise(false); }
-      });
+    if (raise && ws && ws.readyState === 1) {
+      ws.send(JSON.stringify({ type: "debate_hand_raise" }));
     }
+    // Floor mode will be activated when server sends debate_user_floor
   }
 
   function sendDebateStickyComment() {