diff --git a/packages/web-shell/client/App.test.tsx b/packages/web-shell/client/App.test.tsx
index 65e7e1c2097..c70f8d90f30 100644
--- a/packages/web-shell/client/App.test.tsx
+++ b/packages/web-shell/client/App.test.tsx
@@ -14,6 +14,7 @@ import type {
   VoiceStatusRevision,
   VoiceWorkspaceTarget,
 } from './voice/voice-workspace-target';
+import type { WebShellComposerToolbarRenderInfo } from './customization';
 import { loadSplitSessions, saveSplitSessions } from './utils/splitUrl';
 
 type StreamingState = 'idle' | 'responding';
@@ -420,8 +421,8 @@ vi.mock('./components/ChatEditor', async () => {
         focus: editorFocus,
       }));
       return React.createElement(
-        React.Fragment,
-        null,
+        'div',
+        { 'data-web-shell-composer': '' },
         React.createElement(
           'button',
           {
@@ -1467,6 +1468,8 @@ beforeEach(() => {
   mockConnection.workspaceCwd = '/tmp/project';
   mockConnection.status = 'connected';
   mockConnection.displayName = 'Session One';
+  mockConnection.currentMode = 'default';
+  mockConnection.currentModel = 'qwen';
   mockConnection.error = undefined;
   mockConnection.errorStatus = undefined;
   mockConnection.missingSession = false;
@@ -1612,6 +1615,134 @@ afterEach(() => {
   vi.restoreAllMocks();
 });
 
+describe('App composer footer renderer', () => {
+  it('passes composer state and keeps the header, composer, and footers ordered', async () => {
+    const composerFooterProps: WebShellComposerToolbarRenderInfo[] = [];
+    const ComposerFooter = (props: WebShellComposerToolbarRenderInfo) => {
+      composerFooterProps.push(props);
+      return <div data-testid="composer-footer">composer footer</div>;
+    };
+    const { container } = renderApp({
+      renderComposerHeader: () => (
+        <div data-testid="composer-header">composer header</div>
+      ),
+      renderComposerFooter: ComposerFooter,
+      renderFooter: () => <div data-testid="shell-footer">shell footer</div>,
+    });
+    await flush();
+
+    expect(composerFooterProps.at(-1)).toEqual({
+      disabled: false,
+      isRunning: false,
+      currentMode: 'default',
+      currentModel: 'qwen',
+      sessionName: 'Session One',
+    });
+
+    const composer = container.querySelector('[data-web-shell-composer]');
+    const composerHeader = container.querySelector(
+      '[data-testid="composer-header"]',
+    );
+    const composerFooter = container.querySelector(
+      '[data-testid="composer-footer"]',
+    );
+    const shellFooter = container.querySelector('[data-testid="shell-footer"]');
+
+    expect(composer).not.toBeNull();
+    expect(composerHeader?.parentElement?.nextElementSibling).toBe(composer);
+    expect(composer?.nextElementSibling).toBe(composerFooter);
+    expect(composerFooter?.parentElement).toBe(composer?.parentElement);
+    expect(composer?.parentElement?.nextElementSibling).toBe(shellFooter);
+  });
+
+  it('updates composer footer state and renders it in the empty welcome state', async () => {
+    const composerFooterProps: WebShellComposerToolbarRenderInfo[] = [];
+    const ComposerFooter = (props: WebShellComposerToolbarRenderInfo) => {
+      composerFooterProps.push(props);
+      return <div data-testid="composer-footer" />;
+    };
+    const { container, rerender } = renderApp({
+      renderComposerFooter: ComposerFooter,
+    });
+    await flush();
+
+    testState.streamingState = 'responding';
+    mockConnection.currentMode = 'plan';
+    mockConnection.currentModel = 'qwen-next';
+    mockConnection.displayName = 'Session Two';
+    rerender({ renderComposerFooter: ComposerFooter });
+    await flush();
+
+    expect(composerFooterProps.at(-1)).toEqual({
+      disabled: false,
+      isRunning: true,
+      currentMode: 'plan',
+      currentModel: 'qwen-next',
+      sessionName: 'Session Two',
+    });
+
+    mockConnection.catchingUp = true;
+    rerender({ renderComposerFooter: ComposerFooter });
+    await flush();
+
+    expect(composerFooterProps.at(-1)).toEqual({
+      disabled: true,
+      isRunning: true,
+      currentMode: 'plan',
+      currentModel: 'qwen-next',
+      sessionName: 'Session Two',
+    });
+
+    mockConnection.catchingUp = false;
+    testState.streamingState = 'idle';
+    mockConnection.sessionId = undefined;
+    mockConnection.displayName = undefined;
+    rerender({ renderComposerFooter: ComposerFooter });
+    await flush();
+
+    expect(
+      container.querySelector('[data-testid="composer-footer"]'),
+    ).not.toBeNull();
+    expect(composerFooterProps.at(-1)).toEqual({
+      disabled: false,
+      isRunning: false,
+      currentMode: 'plan',
+      currentModel: 'qwen-next',
+      sessionName: undefined,
+    });
+  });
+
+  it('does not add composer footer DOM when omitted or when the renderer returns null', async () => {
+    const { container, rerender } = renderApp();
+    await flush();
+
+    const composer = container.querySelector('[data-web-shell-composer]');
+    const composerChildren = Array.from(
+      composer?.parentElement?.children ?? [],
+    );
+    expect(composer?.nextElementSibling).toBeNull();
+
+    rerender({ renderComposerFooter: () => null });
+    await flush();
+
+    const nullComposer = container.querySelector('[data-web-shell-composer]');
+    const nullComposerChildren = Array.from(
+      nullComposer?.parentElement?.children ?? [],
+    );
+    expect(nullComposer?.nextElementSibling).toBeNull();
+    expect(nullComposerChildren).toHaveLength(composerChildren.length);
+    expect(
+      nullComposerChildren.map((child) =>
+        child.getAttribute('data-web-shell-composer'),
+      ),
+    ).toEqual(
+      composerChildren.map((child) =>
+        child.getAttribute('data-web-shell-composer'),
+      ),
+    );
+  });
+});
+
 describe('App shell command queueing', () => {
   it('lazily creates a session for ! shell commands in a new task', async () => {
     mockConnection.sessionId = undefined;
diff --git a/packages/web-shell/client/App.tsx b/packages/web-shell/client/App.tsx
index fe9da16c263..3064bad47e1 100644
--- a/packages/web-shell/client/App.tsx
+++ b/packages/web-shell/client/App.tsx
@@ -271,6 +271,7 @@ import {
   type ComposerToolbarEndRenderer,
   type ComposerToolbarRightRenderer,
   type ComposerHeaderRenderer,
+  type ComposerFooterRenderer,
   type ChatHeaderRenderer,
   type FooterRenderer,
   type LoadingPhrasesResolver,
@@ -619,6 +620,8 @@ export interface WebShellProps {
   renderComposerToolbarRight?: ComposerToolbarRightRenderer;
   /** Custom renderer shown directly above the chat composer input. */
   renderComposerHeader?: ComposerHeaderRenderer;
+  /** Custom renderer shown directly below the chat composer input. */
+  renderComposerFooter?: ComposerFooterRenderer;
   /**
    * Custom renderer shown at the top of the chat view, above the message list.
    * Only rendered when a session is active (not in the welcome/empty state).
@@ -1111,6 +1114,7 @@ export function App({
   renderComposerToolbarEnd,
   renderComposerToolbarRight,
   renderComposerHeader,
+  renderComposerFooter,
   renderChatHeader,
   renderFooter,
   bottomStatusItems,
@@ -1315,6 +1319,7 @@ export function App({
       renderComposerToolbarEnd,
       renderComposerToolbarRight,
       renderComposerHeader,
+      renderComposerFooter,
       renderFooter,
       compactThinking,
       collapseCompletedTurns,
@@ -1337,6 +1342,7 @@ export function App({
       renderComposerToolbarEnd,
       renderComposerToolbarRight,
       renderComposerHeader,
+      renderComposerFooter,
       renderFooter,
       compactThinking,
       collapseCompletedTurns,
@@ -1347,6 +1353,7 @@ export function App({
   );
   const CustomFooter = renderFooter;
   const CustomComposerHeader = renderComposerHeader;
+  const CustomComposerFooter = renderComposerFooter;
   const store = useTranscriptStore();
   const blocks = useTranscriptBlocks();
   const connection = useConnection();
@@ -8586,6 +8593,15 @@ export function App({
                           composerInputVersion={composerInputVersion}
                           placeholderText={composerPlaceholderText}
                         />
+                        {CustomComposerFooter && (
+                          <CustomComposerFooter
+                            disabled={isDisabled}
+                            isRunning={streamingState !== 'idle'}
+                            currentMode={currentMode}
+                            currentModel={currentModel}
+                            sessionName={sessionDisplayName}
+                          />
+                        )}
                       </div>
                       {CustomFooter ? (
                         hasMobileComposerBottom ? (
diff --git a/packages/web-shell/client/components/ChatPane.test.tsx b/packages/web-shell/client/components/ChatPane.test.tsx
index e0084e70c31..6fb13be440d 100644
--- a/packages/web-shell/client/components/ChatPane.test.tsx
+++ b/packages/web-shell/client/components/ChatPane.test.tsx
@@ -9,6 +9,11 @@ import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { act, forwardRef, useImperativeHandle } from 'react';
 import { createRoot, type Root } from 'react-dom/client';
 import { I18nProvider } from '../i18n';
+import {
+  WebShellCustomizationProvider,
+  type WebShellComposerToolbarRenderInfo,
+  type WebShellCustomization,
+} from '../customization';
 
 Object.assign(globalThis, { IS_REACT_ACT_ENVIRONMENT: true });
 
@@ -136,7 +141,7 @@ vi.mock('./ChatEditor', () => ({
       insertText,
     }));
     return (
-      <div>
+      <div data-web-shell-composer>
         <button
           data-testid="pane-submit"
           onClick={() => props.onSubmit('hello there')}
@@ -219,6 +224,7 @@ const { ChatPane } = await import('./ChatPane');
 
 let root: Root | null = null;
 let container: HTMLDivElement | null = null;
+const EMPTY_CUSTOMIZATION: WebShellCustomization = {};
 
 beforeEach(() => {
   connectionState = {
@@ -268,15 +274,35 @@ afterEach(() => {
   container = null;
 });
 
-function render(props: Record<string, unknown> = {}): void {
+function render(
+  props: Record<string, unknown> = {},
+  customization: WebShellCustomization = EMPTY_CUSTOMIZATION,
+): void {
   container = document.createElement('div');
   document.body.appendChild(container);
   root = createRoot(container);
   act(() =>
     root!.render(
-      <I18nProvider language="en">
-        <ChatPane {...props} />
-      </I18nProvider>,
+      <WebShellCustomizationProvider value={customization}>
+        <I18nProvider language="en">
+          <ChatPane {...props} />
+        </I18nProvider>
+      </WebShellCustomizationProvider>,
+    ),
+  );
+}
+
+function rerender(
+  props: Record<string, unknown> = {},
+  customization: WebShellCustomization = EMPTY_CUSTOMIZATION,
+): void {
+  act(() =>
+    root!.render(
+      <WebShellCustomizationProvider value={customization}>
+        <I18nProvider language="en">
+          <ChatPane {...props} />
+        </I18nProvider>
+      </WebShellCustomizationProvider>,
     ),
   );
 }
@@ -286,6 +312,80 @@ function testid(id: string): HTMLElement | null {
 }
 
 describe('ChatPane', () => {
+  it('renders the custom composer footer directly after the pane editor', () => {
+    const footerProps: WebShellComposerToolbarRenderInfo[] = [];
+    const ComposerFooter = (props: WebShellComposerToolbarRenderInfo) => {
+      footerProps.push(props);
+      return <div data-testid="pane-composer-footer">pane footer</div>;
+    };
+
+    render({}, { renderComposerFooter: ComposerFooter });
+
+    const composer = container!.querySelector('[data-web-shell-composer]');
+    const footer = testid('pane-composer-footer');
+    expect(composer?.nextElementSibling).toBe(footer);
+    expect(footer?.parentElement).toBe(composer?.parentElement);
+    expect(footerProps.at(-1)).toEqual({
+      disabled: false,
+      isRunning: false,
+      currentMode: 'default',
+      currentModel: '',
+      sessionName: 'Refactor core',
+    });
+  });
+
+  it('updates the custom composer footer with pane-scoped state', () => {
+    const footerProps: WebShellComposerToolbarRenderInfo[] = [];
+    const ComposerFooter = (props: WebShellComposerToolbarRenderInfo) => {
+      footerProps.push(props);
+      return <div data-testid="pane-composer-footer" />;
+    };
+    const customization = { renderComposerFooter: ComposerFooter };
+    render({}, customization);
+
+    streamingStateValue = 'responding';
+    connectionState.catchingUp = true;
+    connectionState.currentMode = 'plan';
+    connectionState.currentModel = 'qwen-next';
+    connectionState.displayName = 'Pane Two';
+    rerender({}, customization);
+
+    expect(footerProps.at(-1)).toEqual({
+      disabled: false,
+      isRunning: true,
+      currentMode: 'plan',
+      currentModel: 'qwen-next',
+      sessionName: 'Pane Two',
+    });
+
+    connectionState.catchingUp = false;
+    pendingPermission = {
+      id: 'perm-1',
+      toolName: 'write_file',
+      rawInput: {},
+    };
+    rerender({}, customization);
+
+    expect(latestChatEditorProps.disabled).toBe(true);
+    expect(footerProps.at(-1)?.disabled).toBe(true);
+  });
+
+  it('adds no composer footer DOM when omitted or returning null', () => {
+    render();
+    const composer = container!.querySelector('[data-web-shell-composer]');
+    const children = Array.from(composer?.parentElement?.children ?? []);
+    expect(composer?.nextElementSibling).toBeNull();
+    expect(latestChatEditorProps.disabled).toBe(false);
+
+    rerender({}, { renderComposerFooter: () => null });
+
+    const nullComposer = container!.querySelector('[data-web-shell-composer]');
+    expect(nullComposer?.nextElementSibling).toBeNull();
+    expect(
+      Array.from(nullComposer?.parentElement?.children ?? []),
+    ).toHaveLength(children.length);
+  });
+
   it('renders the session transcript and header label', () => {
     render({ title: 'Refactor core' });
     expect(testid('pane-messages')?.textContent).toBe('1');
@@ -384,13 +484,7 @@ describe('ChatPane', () => {
     expect(voiceTarget).toBeDefined();
 
     pendingPermission = { id: 'perm-1', toolName: 'write_file', rawInput: {} };
-    act(() => {
-      root?.render(
-        <I18nProvider language="en">
-          <ChatPane workspaceCwd="/w" />
-        </I18nProvider>,
-      );
-    });
+    rerender({ workspaceCwd: '/w' });
 
     expect(latestChatEditorProps.dialogOpen).toBe(true);
     expect(latestChatEditorProps.disabled).toBe(true);
@@ -443,13 +537,7 @@ describe('ChatPane', () => {
     render({ workspaceCwd: '/work/other' });
     expect(latestChatEditorProps.voiceTarget).toBeUndefined();
 
-    act(() => {
-      root?.render(
-        <I18nProvider language="en">
-          <ChatPane workspaceCwd="/work/api" hidden />
-        </I18nProvider>,
-      );
-    });
+    rerender({ workspaceCwd: '/work/api', hidden: true });
     expect(latestChatEditorProps.voiceTarget).toBeUndefined();
   });
 
diff --git a/packages/web-shell/client/components/ChatPane.tsx b/packages/web-shell/client/components/ChatPane.tsx
index a52961601e9..bb6b950b621 100644
--- a/packages/web-shell/client/components/ChatPane.tsx
+++ b/packages/web-shell/client/components/ChatPane.tsx
@@ -25,6 +25,7 @@ import type {
 import type { ACPToolCall } from '../adapters/types';
 import { SubagentDetailsProvider } from '../subagentDetailsContext';
 import { useI18n } from '../i18n';
+import { useWebShellCustomization } from '../customization';
 import { SESSION_TRANSCRIPT_PAGINATION_FEATURE } from '../constants/sessions';
 import { useMessages } from '../hooks/useMessages';
 import { useSessionArtifacts } from '../hooks/useSessionArtifacts';
@@ -149,6 +150,8 @@ export function ChatPane({
   voiceWorkspaces,
 }: ChatPaneProps) {
   const { t } = useI18n();
+  const { renderComposerFooter: CustomComposerFooter } =
+    useWebShellCustomization();
   const connection = useConnection();
   const actions = useActions();
   const workspaceActions = useWorkspaceActions();
@@ -731,6 +734,15 @@ export function ChatPane({
           onDismissFollowup={onDismissFollowup}
           placeholderText={t('splitView.composerPlaceholder')}
         />
+        {CustomComposerFooter && (
+          <CustomComposerFooter
+            disabled={approvalActive}
+            isRunning={isResponding}
+            currentMode={connection.currentMode ?? 'default'}
+            currentModel={connection.currentModel ?? ''}
+            sessionName={connection.displayName}
+          />
+        )}
       </div>
     </section>
   );
diff --git a/packages/web-shell/client/customization.tsx b/packages/web-shell/client/customization.tsx
index 27f6e4cc5f3..c79bfe1e555 100644
--- a/packages/web-shell/client/customization.tsx
+++ b/packages/web-shell/client/customization.tsx
@@ -318,6 +318,9 @@ export type ComposerToolbarRightRenderer =
 export type ComposerHeaderRenderer =
   ComponentType<WebShellComposerToolbarRenderInfo>;
 
+export type ComposerFooterRenderer =
+  ComponentType<WebShellComposerToolbarRenderInfo>;
+
 // ---- Background task info (public type for footer renderer) ----
 
 interface WebShellTaskBase {
@@ -422,6 +425,7 @@ export interface WebShellCustomization {
   renderComposerToolbarEnd?: ComposerToolbarEndRenderer;
   renderComposerToolbarRight?: ComposerToolbarRightRenderer;
   renderComposerHeader?: ComposerHeaderRenderer;
+  renderComposerFooter?: ComposerFooterRenderer;
   renderFooter?: FooterRenderer;
   compactThinking?: boolean;
   /**
diff --git a/packages/web-shell/client/index.tsx b/packages/web-shell/client/index.tsx
index e8fff50b5e5..3a5f5cf01af 100644
--- a/packages/web-shell/client/index.tsx
+++ b/packages/web-shell/client/index.tsx
@@ -172,6 +172,7 @@ export type {
   UserMessageContentRenderInfo,
   UserMessageContentParser,
   ComposerHeaderRenderer,
+  ComposerFooterRenderer,
   ComposerToolbarStartRenderer,
   ComposerToolbarRightRenderer,
   WebShellAtItemRenderInfo,