Chat replaces the session view in place — not a modal; sidebar stays live

surfaces/gui/src/App.tsx

@@ -1772,6 +1772,11 @@ export function App() {
             )}
           </div>
         </div>
+        {/* # team chat replaces the session view in place (owner ask 2026-08-16 —
+            not a modal): the sidebar stays live, Esc/back returns to the session. */}
+        {chatTeam && surface === "session" && (
+          <TeamChatView teamId={chatTeam} onClose={() => setChatTeam(null)} />
+        )}
         <div className={"main-workspace" + (railHidden ? " rail-hidden" : "")}>
           <div className="main-chat">
             {/* Automation-run context (owner ask 2026-07-04): a __run__ session looked like any
@@ -2010,7 +2015,6 @@ export function App() {
           {boardOpen && board && board.space && (
             <BoardOverlay board={board} onClose={() => setBoardOpen(false)} onTransition={moveBoardItem} />
           )}
-          {chatTeam && <TeamChatView teamId={chatTeam} onClose={() => setChatTeam(null)} />}
         </div>
       </div>
       )}

surfaces/gui/src/components/TeamChatView.tsx

@@ -68,18 +68,20 @@ export function TeamChatView({ teamId, onClose }: { teamId: string; onClose: ()
   const messages = chat?.messages || [];
 
   return (
-    <div className="board-overlay" data-testid="teamchat-view" onClick={onClose}>
-      <div className="board-overlay-panel chat-panel" onClick={(e) => e.stopPropagation()}>
-        <div className="board-overlay-head">
-          <div className="board-overlay-title">
-            <span className="chat-hash">#</span>
-            <span>team chat</span>
-            <span className="board-overlay-space">questions &amp; consensus — status lives on the board</span>
-          </div>
-          <button className="artifact-icon-btn" onClick={onClose} aria-label="Close chat" title="Close">
-            <Icon name="x" size={16} />
-          </button>
+    // Replaces the session view IN PLACE (absolute inside .main, not a modal):
+    // the sidebar stays interactive; back or Esc returns to the session.
+    <div className="chat-view" data-testid="teamchat-view">
+      <div className="chat-view-head">
+        <button className="artifact-icon-btn" onClick={onClose} aria-label="Back to session" title="Back">
+          <Icon name="arrowLeft" size={16} />
+        </button>
+        <div className="board-overlay-title">
+          <span className="chat-hash">#</span>
+          <span>team chat</span>
+          <span className="board-overlay-space">questions &amp; consensus — status lives on the board</span>
         </div>
+      </div>
+      <div className="chat-view-body">
         <div className="chat-scroll">
           {messages.length === 0 && (
             <div className="chat-empty">
@@ -127,3 +129,5 @@ export function TeamChatView({ teamId, onClose }: { teamId: string; onClose: ()
     </div>
   );
 }
+// Note: artifact links in chat (agents referencing reports, click → artifact
+// viewer) are planned — see the Linear follow-up on chat evolution.

surfaces/gui/src/styles.css

@@ -1776,3 +1776,8 @@ html[data-platform="linux"] ::-webkit-scrollbar-thumb:hover { background-color:
 /* Sidebar chat row */
 .team-hash { color: var(--faint); font-weight: 700; font-size: 12px; width: 10px; text-align: center; }
 .team-chat-badge { margin-left: auto; background: var(--accent); color: #fff; font-size: 10px; font-weight: 700; border-radius: 8px; padding: 0 6px; }
+
+/* # team chat as an in-place view (not a modal): fills .main, sidebar stays live. */
+.chat-view { position: absolute; inset: 0; z-index: 40; background: var(--paper); display: flex; flex-direction: column; }
+.chat-view-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--line); background: var(--panel); }
+.chat-view-body { flex: 1; display: flex; flex-direction: column; min-height: 0; max-width: 860px; width: 100%; margin: 0 auto; }