feat(console): show "agent is responding" above the chat input

console/index.html

@@ -62,6 +62,7 @@
                     <span class="chat-conn" id="ac-chat-conn">disconnected</span>
                   </div>
                   <div id="ac-chat-log" class="chat-log"></div>
+                  <div id="ac-chat-status" class="chat-status" hidden><span class="chat-spinner" aria-label="thinking"></span>agent is responding…</div>
                   <form id="ac-chat-form" class="chat-input">
                     <textarea id="ac-chat-text" class="chat-text" rows="2" placeholder="Message this agent…  (Enter to send · Shift+Enter for a newline)"></textarea>
                     <div class="chat-actions">
@@ -225,6 +226,7 @@
               <span class="chat-conn" id="chat-conn">disconnected</span>
             </div>
             <div id="chat-log" class="chat-log"></div>
+            <div id="chat-status" class="chat-status" hidden><span class="chat-spinner" aria-label="thinking"></span>agent is responding…</div>
             <form id="chat-form" class="chat-input">
               <textarea id="chat-text" class="chat-text" rows="2" placeholder="Message the agent…  (Enter to send · Shift+Enter for a newline)"></textarea>
               <div class="chat-actions">

console/src/agentConsole.ts

@@ -53,6 +53,7 @@ export function initAgentConsole(cfg: AgentConsoleConfig): AgentConsole {
   const send = document.getElementById("ac-chat-send") as HTMLButtonElement | null;
   const stop = document.getElementById("ac-chat-stop") as HTMLButtonElement | null;
   const conn = document.getElementById("ac-chat-conn");
+  const status = document.getElementById("ac-chat-status");
 
   const noop: AgentConsole = {
     refresh: async () => {},
@@ -141,9 +142,9 @@ export function initAgentConsole(cfg: AgentConsoleConfig): AgentConsole {
     // Optimistic "connecting" until the first `remote-status` (or ready in mock).
     renderHeader(cfg.mock ? "connected" : "connecting");
     renderList();
-    if (log && form && text && send && stop && conn) {
+    if (log && form && text && send && stop && conn && status) {
       panel = createChatPanel(
-        { log, form, text, send, stop, conn },
+        { log, form, text, send, stop, conn, status },
         {
           agent: name,
           source: cfg.source,

console/src/chatPanel.ts

@@ -34,6 +34,12 @@ export interface ChatPanelElements {
   send: HTMLButtonElement;
   stop: HTMLButtonElement;
   conn: HTMLElement;
+  // A fixed line above the input box, shown only while a turn is in flight —
+  // unlike `conn` (which also carries the not-ready/connected states and can
+  // scroll out of view above a long transcript), this sits right where the
+  // user is about to type, so "is it still working?" never requires a glance
+  // up top or a scroll through the log.
+  status: HTMLElement;
 }
 
 export interface ChatPanelOptions {
@@ -113,6 +119,7 @@ export function createChatPanel(
     els.conn.textContent = label;
     els.conn.classList.toggle("is-connected", r && !turnActive);
     els.conn.classList.toggle("is-error", false);
+    els.status.hidden = !turnActive;
   }
 
   // Enqueue a prompt and try to release it. `flush` is the single choke point

console/src/main.ts

@@ -70,6 +70,7 @@ const chatTextEl = document.getElementById("chat-text") as HTMLTextAreaElement |
 const chatSendEl = document.getElementById("chat-send") as HTMLButtonElement | null;
 const chatStopEl = document.getElementById("chat-stop") as HTMLButtonElement | null;
 const chatConnEl = document.getElementById("chat-conn");
+const chatStatusEl = document.getElementById("chat-status");
 const source = defaultSource();
 
 // The Debug drawer (ADR #83 Part D / slice 6, 7.6): Activity/MCP/Config
@@ -813,7 +814,8 @@ function buildManagementPanel(): void {
     !chatTextEl ||
     !chatSendEl ||
     !chatStopEl ||
-    !chatConnEl
+    !chatConnEl ||
+    !chatStatusEl
   )
     return;
   managementPanel = createChatPanel(
@@ -824,6 +826,7 @@ function buildManagementPanel(): void {
       send: chatSendEl,
       stop: chatStopEl,
       conn: chatConnEl,
+      status: chatStatusEl,
     },
     { source, mock: isMock(), note },
   );

console/src/styles.css

@@ -1139,6 +1139,15 @@ button.act:disabled {
   font-size: 11px;
   color: var(--warn);
 }
+.chat-status {
+  font-size: 12px;
+  color: var(--muted);
+  margin-top: 8px;
+}
+.chat-status .chat-spinner {
+  margin-left: 0;
+  margin-right: 6px;
+}
 .chat-input {
   display: flex;
   gap: 8px;