diff --git a/src/web-ui/AGENTS.md b/src/web-ui/AGENTS.md
index 7e85877ab3..fb8b39f73c 100644
--- a/src/web-ui/AGENTS.md
+++ b/src/web-ui/AGENTS.md
@@ -243,6 +243,17 @@ pnpm --dir src/web-ui run test:run src/app/components/SceneBar/SceneBar.test.tsx
 These local DOM/store fixtures cover the session tab limit, other-device tabs and simulated
 SSH/Peer identities; they do not establish native rendering or live remote behavior.
 
+For close/reopen, numbered tab selection and layout shortcuts across conversation,
+content, split groups and terminals:
+
+```bash
+pnpm --dir src/web-ui run test:run src/app/hooks/useTabCloseShortcut.test.tsx src/infrastructure/services/ShortcutManager.test.ts src/app/components/panels/content-canvas/hooks/useTabLifecycle.btw.test.tsx
+```
+
+These DOM/store fixtures simulate Windows/Linux/macOS modifiers, concurrent
+canvas owners, close guards and Peer switches. They do not establish native
+keyboard delivery or live SSH, Remote Control, Peer Device or Detached Dispatch behavior.
+
 For composer mode restoration, passive synchronization, or explicit mode selection:
 
 ```bash
diff --git a/src/web-ui/README.md b/src/web-ui/README.md
index 1b5a1dc0f5..a44744cf6c 100644
--- a/src/web-ui/README.md
+++ b/src/web-ui/README.md
@@ -9,6 +9,21 @@ This directory contains OpenBitFun’s **Web UI** (React + TypeScript). The same
 - **Desktop**: loaded via **Tauri**
 - **Server/Web**: built into static assets and served by the backend
 
+## Closing tabs with the keyboard
+
+In Desktop, **Ctrl+W** on Windows/Linux or **Cmd+W** on macOS closes the current
+tab in the region you are using. From the conversation area it closes the
+conversation tab; from the file or terminal area it closes that area's current
+tab. Split views use the focused group. An empty content pane does not close a
+conversation in the other pane.
+
+The shortcut uses the same unsaved-change checks and terminal lifecycle as the
+tab's close button. Existing custom bindings for **Close tab** continue to apply
+to both regions. Dialogs and held-key repeats do not close additional tabs.
+Numbered tab selection, reopening a closed tab and layout shortcuts also stay
+with their owning canvas. Recording a new binding in Settings captures the key
+without executing the existing command.
+
 ## Creating a project
 
 The sidebar's add button opens two clickable cards without footer actions.
diff --git a/src/web-ui/README.zh-CN.md b/src/web-ui/README.zh-CN.md
index 6759ebc6ce..dc2a3c6c29 100644
--- a/src/web-ui/README.zh-CN.md
+++ b/src/web-ui/README.zh-CN.md
@@ -9,6 +9,18 @@
 - **Desktop**：通过 **Tauri** 加载运行
 - **Server/Web**：构建为静态资源，由后端提供访问
 
+## 使用快捷键关闭标签
+
+桌面端使用 **Ctrl+W**（Windows/Linux）或 **Cmd+W**（macOS）关闭当前操作区域的标签。
+在中间会话区域操作时关闭当前会话标签；在文件或终端区域操作时关闭该区域的当前标签。
+多个分栏按焦点所在分组响应，空的内容区域不会转而关闭另一侧的会话。
+
+快捷键与标签关闭按钮共用未保存内容检查和终端生命周期处理。
+已有的“关闭标签”自定义快捷键对两个区域均生效。
+弹窗交互和长按按键产生的重复事件不会继续关闭其他标签。
+数字切换标签、重新打开标签和布局快捷键也只作用于当前画布。
+在设置页录入新快捷键时，按键用于录入，不会执行原有命令。
+
 ## 创建项目
 
 左侧导航的新增按钮展示两张可点击卡片，首层不设底部操作按钮。
diff --git a/src/web-ui/src/app/components/panels/content-canvas/hooks/useKeyboardShortcuts.ts b/src/web-ui/src/app/components/panels/content-canvas/hooks/useKeyboardShortcuts.ts
index 2bb97996ed..2f085a9a45 100644
--- a/src/web-ui/src/app/components/panels/content-canvas/hooks/useKeyboardShortcuts.ts
+++ b/src/web-ui/src/app/components/panels/content-canvas/hooks/useKeyboardShortcuts.ts
@@ -2,15 +2,17 @@
  * useKeyboardShortcuts Hook
  *
  * Registers canvas-level keyboard shortcuts via ShortcutManager.
- * All shortcuts use scope 'canvas' so they only fire when focus is inside
- * the editor canvas area (data-shortcut-scope="canvas").
+ * Canvas shortcuts follow DOM scope. Close also follows the workbench's focused
+ * pane when focus returns to the document body after a tab is removed.
  */
 
-import { useCallback } from 'react';
+import { useCallback, useContext } from 'react';
 import { CANVAS_OVERVIEW_SHORTCUT } from '@/shared/constants/shortcuts';
 import { useShortcut } from '@/infrastructure/hooks/useShortcut';
 import { activeEditTargetService } from '@/tools/editor/services/ActiveEditTargetService';
-import { useCanvasStore } from '../stores';
+import { CanvasStoreModeContext, useCanvasStore } from '../stores';
+import { useTabCloseShortcut } from '@/app/hooks/useTabCloseShortcut';
+import { useSceneStore } from '@/app/stores/sceneStore';
 import type { EditorGroupId } from '../types';
 
 interface UseKeyboardShortcutsOptions {
@@ -21,6 +23,7 @@ interface UseKeyboardShortcutsOptions {
 }
 
 export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {}) => {
+  const mode = useContext(CanvasStoreModeContext);
   const {
     enabled = true,
     missionControlEnabled = true,
@@ -31,6 +34,7 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
   const {
     primaryGroup,
     secondaryGroup,
+    tertiaryGroup,
     activeGroupId,
     layout,
     closeTab,
@@ -43,12 +47,28 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
     toggleMissionControl,
   } = useCanvasStore();
 
-  const getActiveGroup = useCallback(() => {
-    return activeGroupId === 'primary' ? primaryGroup : secondaryGroup;
-  }, [activeGroupId, primaryGroup, secondaryGroup]);
-
-  const getVisibleTabs = useCallback(() => {
-    return getActiveGroup().tabs.filter((t) => !t.isHidden);
+  const ownsCanvasEvent = useCallback((event: KeyboardEvent) => event.target instanceof Element
+    && event.target.closest('[data-canvas-mode]')?.getAttribute('data-canvas-mode') === mode, [mode]);
+  const canvasShortcutOptions = { enabled, when: ownsCanvasEvent };
+
+  const getFocusedGroupId = useCallback((event: KeyboardEvent): EditorGroupId => {
+    // Keyboard focus can enter a split group without its click handler running.
+    const groupElement = event.target instanceof Element
+      ? event.target.closest('[data-openbitfun-group], [data-canvas-toolbar-group]') : null;
+    const focusedGroup = groupElement?.getAttribute('data-openbitfun-group')
+      ?? groupElement?.getAttribute('data-canvas-toolbar-group');
+    return focusedGroup === 'primary' || focusedGroup === 'secondary' || focusedGroup === 'tertiary'
+      ? focusedGroup : activeGroupId;
+  }, [activeGroupId]);
+
+  const getActiveGroup = useCallback((event: KeyboardEvent) => {
+    const groupId = getFocusedGroupId(event);
+    return groupId === 'primary' ? primaryGroup
+      : groupId === 'secondary' ? secondaryGroup : tertiaryGroup;
+  }, [getFocusedGroupId, primaryGroup, secondaryGroup, tertiaryGroup]);
+
+  const getVisibleTabs = useCallback((event: KeyboardEvent) => {
+    return getActiveGroup(event).tabs.filter((t) => !t.isHidden);
   }, [getActiveGroup]);
 
   // Find in file (Monaco) — only when `data-shortcut-scope="editor"` is innermost
@@ -58,7 +78,13 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
     () => {
       activeEditTargetService.openMonacoFind();
     },
-    { enabled, priority: 20, description: 'keyboard.shortcuts.editor.findInFile' }
+    {
+      enabled, priority: 20, description: 'keyboard.shortcuts.editor.findInFile',
+      // Main document editors share the active edit target service. Canvas
+      // instances must nevertheless survive another canvas unmounting.
+      when: event => event.target instanceof Element
+        && (!event.target.closest('[data-canvas-mode]') || ownsCanvasEvent(event)),
+    }
   );
 
   // Mission control
@@ -68,6 +94,7 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
     () => toggleMissionControl(),
     {
       enabled: enabled && missionControlEnabled,
+      when: ownsCanvasEvent,
       priority: 10,
       description: 'keyboard.shortcuts.canvas.missionControl',
     }
@@ -78,7 +105,7 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
     'canvas.splitHorizontal',
     { key: '\\', ctrl: true, scope: 'canvas' },
     () => setSplitMode(layout.splitMode === 'horizontal' ? 'none' : 'horizontal'),
-    { enabled, description: 'keyboard.shortcuts.canvas.splitHorizontal' }
+    { ...canvasShortcutOptions, description: 'keyboard.shortcuts.canvas.splitHorizontal' }
   );
 
   // Vertical split: mod+Shift+\
@@ -86,7 +113,7 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
     'canvas.splitVertical',
     { key: '\\', ctrl: true, shift: true, scope: 'canvas' },
     () => setSplitMode(layout.splitMode === 'vertical' ? 'none' : 'vertical'),
-    { enabled, description: 'keyboard.shortcuts.canvas.splitVertical' }
+    { ...canvasShortcutOptions, description: 'keyboard.shortcuts.canvas.splitVertical' }
   );
 
   // Anchor zone: mod+`
@@ -94,7 +121,7 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
     'canvas.anchorZone',
     { key: '`', ctrl: true, scope: 'canvas' },
     () => setAnchorPosition(layout.anchorPosition === 'hidden' ? 'bottom' : 'hidden'),
-    { enabled, description: 'keyboard.shortcuts.canvas.anchorZone' }
+    { ...canvasShortcutOptions, description: 'keyboard.shortcuts.canvas.anchorZone' }
   );
 
   // Maximize: mod+Shift+M
@@ -102,23 +129,35 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
     'canvas.maximize',
     { key: 'M', ctrl: true, shift: true, scope: 'canvas' },
     () => toggleMaximize(),
-    { enabled, description: 'keyboard.shortcuts.canvas.maximize' }
+    { ...canvasShortcutOptions, description: 'keyboard.shortcuts.canvas.maximize' }
   );
 
   // Close current tab: mod+W
-  useShortcut(
-    'tab.close',
-    { key: 'W', ctrl: true, scope: 'canvas', allowInInput: true },
-    () => {
-      const activeGroup = getActiveGroup();
+  useTabCloseShortcut(
+    'app',
+    event => {
+      const groupId = getFocusedGroupId(event);
+      const activeGroup = getActiveGroup(event);
       if (!activeGroup.activeTabId) return;
       if (handleCloseWithDirtyCheck) {
-        handleCloseWithDirtyCheck(activeGroup.activeTabId, activeGroupId);
+        return handleCloseWithDirtyCheck(activeGroup.activeTabId, groupId);
       } else {
-        closeTab(activeGroup.activeTabId, activeGroupId);
+        closeTab(activeGroup.activeTabId, groupId);
       }
     },
-    { enabled, priority: 10, description: 'keyboard.shortcuts.tab.close' }
+    {
+      enabled,
+      priority: 20,
+      when: event => {
+        const target = event.target instanceof Element ? event.target : null;
+        const owner = target?.closest('[data-canvas-mode]')?.getAttribute('data-canvas-mode');
+        if (owner) return owner === mode;
+        // Explicit editor/chat/terminal scope always wins over remembered pane focus.
+        if (target?.closest('[data-shortcut-scope], [data-openbitfun-component="scene-bar"]')) return false;
+        const scene = useSceneStore.getState();
+        return mode === 'agent' && scene.paneSelections[scene.focusedPane].kind === 'canvas';
+      },
+    }
   );
 
   // Reopen closed tab: mod+Shift+T
@@ -130,29 +169,29 @@ export const useKeyboardShortcuts = (options: UseKeyboardShortcutsOptions = {})
       reopenClosedTab();
       onReveal?.();
     },
-    { enabled, priority: 10, description: 'keyboard.shortcuts.tab.reopenClosed' }
+    { ...canvasShortcutOptions, priority: 10, description: 'keyboard.shortcuts.tab.reopenClosed' }
   );
 
   // Switch to tab by number: mod+1~9
   const switchToTabByIndex = useCallback(
-    (index: number) => {
-      const tabs = getVisibleTabs();
+    (event: KeyboardEvent, index: number) => {
+      const tabs = getVisibleTabs(event);
       const target = index === -1 ? tabs[tabs.length - 1] : tabs[index];
-      if (target) switchToTab(target.id, activeGroupId);
+      if (target) switchToTab(target.id, getFocusedGroupId(event));
     },
-    [getVisibleTabs, switchToTab, activeGroupId]
+    [getVisibleTabs, switchToTab, getFocusedGroupId]
   );
 
   // allowInInput so Ctrl+1..9 still work while focus is in a Monaco editor
-  useShortcut('tab.switch1',    { key: '1', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(0),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switch2',    { key: '2', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(1),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switch3',    { key: '3', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(2),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switch4',    { key: '4', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(3),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switch5',    { key: '5', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(4),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switch6',    { key: '6', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(5),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switch7',    { key: '7', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(6),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switch8',    { key: '8', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(7),  { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
-  useShortcut('tab.switchLast', { key: '9', ctrl: true, scope: 'canvas', allowInInput: true }, () => switchToTabByIndex(-1), { enabled, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch1',    { key: '1', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 0),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch2',    { key: '2', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 1),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch3',    { key: '3', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 2),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch4',    { key: '4', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 3),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch5',    { key: '5', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 4),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch6',    { key: '6', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 5),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch7',    { key: '7', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 6),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switch8',    { key: '8', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, 7),  { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
+  useShortcut('tab.switchLast', { key: '9', ctrl: true, scope: 'canvas', allowInInput: true }, event => switchToTabByIndex(event, -1), { ...canvasShortcutOptions, description: 'keyboard.shortcuts.tab.switchMerged' });
 };
 
 export default useKeyboardShortcuts;
diff --git a/src/web-ui/src/app/hooks/useGlobalSceneShortcuts.ts b/src/web-ui/src/app/hooks/useGlobalSceneShortcuts.ts
index 9ed9ec1d66..23e5acc84c 100644
--- a/src/web-ui/src/app/hooks/useGlobalSceneShortcuts.ts
+++ b/src/web-ui/src/app/hooks/useGlobalSceneShortcuts.ts
@@ -14,6 +14,7 @@ import { useCallback } from 'react';
 import { useShortcut } from '@/infrastructure/hooks/useShortcut';
 import { useSceneStore } from '@/app/stores/sceneStore';
 import type { SceneTabId } from '@/app/components/SceneBar/types';
+import { useTabCloseShortcut } from './useTabCloseShortcut';
 
 function activateSceneByStripIndex(index: number): void {
   const { openTabs, activateScene } = useSceneStore.getState();
@@ -28,6 +29,19 @@ function openSceneById(id: SceneTabId): void {
 export function useGlobalSceneShortcuts(): void {
   const byIndex = useCallback((i: number) => () => activateSceneByStripIndex(i), []);
 
+  useTabCloseShortcut('app', event => {
+    // A canvas owns its tabs, including nested file/terminal views. An empty
+    // or temporarily inactive canvas must never close the conversation instead.
+    if (event.target instanceof Element && event.target.closest('[data-shortcut-scope="canvas"]')) return;
+    const { activeTabId, openTabs, closeScene } = useSceneStore.getState();
+    // Tabbing onto a scene label does not activate it. Its own close shortcut
+    // must still address that label, rather than the previously focused pane.
+    const focusedTabId = event.target instanceof Element
+      ? event.target.closest('[data-scene-tab-id]')?.getAttribute('data-scene-tab-id') : null;
+    const targetId = focusedTabId ? openTabs.find(tab => tab.id === focusedTabId)?.id : activeTabId;
+    if (targetId) return closeScene(targetId);
+  });
+
   // ── Scene-bar position shortcuts (Alt+1–3) ────────────────────────────
   useShortcut('scene.focus1', { key: '1', alt: true, scope: 'app', allowInInput: true }, byIndex(0), {
     priority: 12,
diff --git a/src/web-ui/src/app/hooks/useTabCloseShortcut.test.tsx b/src/web-ui/src/app/hooks/useTabCloseShortcut.test.tsx
new file mode 100644
index 0000000000..26c02f457b
--- /dev/null
+++ b/src/web-ui/src/app/hooks/useTabCloseShortcut.test.tsx
@@ -0,0 +1,375 @@
+// @vitest-environment jsdom
+import React, { act, createRef, useContext } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { Portal } from '@openbitfun/ui';
+import { shortcutManager } from '@/infrastructure/services/ShortcutManager';
+import { activeEditTargetService } from '@/tools/editor/services/ActiveEditTargetService';
+import { activateSurface } from '@/infrastructure/peer-device/deviceSurface';
+import { useConfirmDialogStore } from '@/infrastructure/confirm-dialog/confirmDialogService';
+import {
+  cancelPendingSettingsNavigation, discardAndContinueSettingsNavigation, getSettingsDraftSnapshot,
+  registerSettingsDraft, resetSettingsDraftRegistryForTests,
+} from '@/infrastructure/config/settingsDraftRegistry';
+import { resetSceneStoreForTest, useSceneStore } from '../stores/sceneStore';
+import { getSessionSceneTabId } from '../components/SceneBar/types';
+import { useGlobalSceneShortcuts } from './useGlobalSceneShortcuts';
+import { useKeyboardShortcuts } from '../components/panels/content-canvas/hooks/useKeyboardShortcuts';
+import { useTabLifecycle } from '../components/panels/content-canvas/hooks/useTabLifecycle';
+import {
+  CanvasStoreModeContext, clearAgentCanvasForPeerSwitch, useAgentCanvasStore, useBottomTerminalCanvasStore,
+} from '../components/panels/content-canvas/stores';
+import type { EditorGroupId } from '../components/panels/content-canvas/types';
+
+const host = vi.hoisted(() => ({ destroyTerminal: vi.fn() }));
+vi.mock('@/infrastructure/i18n', () => ({ useI18n: () => ({ t: (key: string) => key }) }));
+vi.mock('@/shared/services/destroyTerminalSession', () => ({ destroyTerminalSession: host.destroyTerminal }));
+vi.mock('@/shared/services/workbenchContentService', () => ({ openCanvasContent: vi.fn(), openContentInBestTarget: vi.fn() }));
+vi.mock('@/shared/services/pendingTabQueue', () => ({ drainPendingTabs: () => [] }));
+vi.mock('@/flow_chat/services/BtwSessionLifecycle', () => ({
+  discardBtwSession: vi.fn(), saveBtwSessionAsFork: vi.fn(), canSaveBtwSessionAsFork: () => false,
+}));
+vi.mock('@/flow_chat/store/FlowChatStore', () => ({ flowChatStore: { getState: () => ({ sessions: new Map() }) } }));
+
+globalThis.IS_REACT_ACT_ENVIRONMENT = true;
+const session = { surfaceId: 'local', workspaceKey: 'project', sessionId: 'conversation' };
+const sessionTabId = getSessionSceneTabId(session);
+
+function GlobalShortcuts() { useGlobalSceneShortcuts(); return null; }
+function CanvasShortcuts({ enabled = true }: { enabled?: boolean }) {
+  const mode = useContext(CanvasStoreModeContext);
+  const { handleCloseWithDirtyCheck } = useTabLifecycle({ mode });
+  useKeyboardShortcuts({ enabled, handleCloseWithDirtyCheck });
+  return null;
+}
+function Fixture({ canvasEnabled = true, bottom = false }: { canvasEnabled?: boolean; bottom?: boolean }) {
+  return <>
+    <GlobalShortcuts />
+    <textarea data-testid="chat" data-shortcut-scope="chat"
+      onFocus={() => useSceneStore.getState().focusPane('primary')} />
+    <div data-testid="canvas-shell" tabIndex={-1} data-shortcut-scope="canvas" data-canvas-mode="agent"
+      onFocus={() => useSceneStore.getState().focusPane(useSceneStore.getState().canvasPane)}>
+      <CanvasStoreModeContext.Provider value="agent"><CanvasShortcuts enabled={canvasEnabled} /></CanvasStoreModeContext.Provider>
+      {(['primary', 'secondary', 'tertiary'] as const).map(group => <div key={group} data-openbitfun-group={group}>
+        <textarea data-testid={`editor-${group}`} data-shortcut-scope="editor" />
+        <textarea data-testid={`terminal-${group}`} data-shortcut-scope="terminal" />
+      </div>)}
+    </div>
+    {bottom && <div data-shortcut-scope="canvas" data-canvas-mode="bottom-terminal">
+      <CanvasStoreModeContext.Provider value="bottom-terminal"><CanvasShortcuts /></CanvasStoreModeContext.Provider>
+      <textarea data-testid="bottom-terminal" data-shortcut-scope="terminal" />
+    </div>}
+  </>;
+}
+
+describe('close-tab keyboard ownership', () => {
+  let root: Root;
+  let container: HTMLDivElement;
+  let primaryModifier: KeyboardEventInit;
+  const setPlatform = (platform: string) => {
+    Object.defineProperty(navigator, 'platform', { configurable: true, value: platform });
+    primaryModifier = platform === 'MacIntel' ? { metaKey: true } : { ctrlKey: true };
+  };
+  const press = async (target: string | HTMLElement, extra: KeyboardEventInit = {}) => {
+    const element = typeof target === 'string' ? container.querySelector<HTMLElement>(`[data-testid="${target}"]`)! : target;
+    const event = new KeyboardEvent('keydown', { key: 'w', ...primaryModifier, bubbles: true, cancelable: true, ...extra });
+    await act(async () => { element.focus(); element.dispatchEvent(event); });
+    return event;
+  };
+  const addFile = (group: EditorGroupId = 'primary') => {
+    useAgentCanvasStore.getState().addTab({ type: 'code-editor', title: group, data: { filePath: `/project/${group}.ts` } }, 'active', group);
+    return useAgentCanvasStore.getState()[`${group}Group`].activeTabId!;
+  };
+  const render = async (props: React.ComponentProps<typeof Fixture> = {}) => {
+    await act(async () => root.render(<Fixture {...props} />));
+  };
+
+  beforeEach(() => {
+    vi.clearAllMocks();
+    host.destroyTerminal.mockResolvedValue(undefined);
+    activateSurface('local');
+    resetSceneStoreForTest();
+    resetSettingsDraftRegistryForTests();
+    clearAgentCanvasForPeerSwitch();
+    useAgentCanvasStore.getState().reset();
+    useBottomTerminalCanvasStore.getState().reset();
+    shortcutManager.clear();
+    shortcutManager.loadUserOverrides({});
+    shortcutManager.setEnabled(true);
+    setPlatform('Win32');
+    useSceneStore.getState().openSessionScene(session);
+    container = document.createElement('div');
+    document.body.append(container);
+    root = createRoot(container);
+  });
+
+  afterEach(async () => {
+    await act(async () => { useConfirmDialogStore.getState().cancel(); });
+    await act(async () => root.unmount());
+    container.remove();
+    shortcutManager.clear();
+    shortcutManager.loadUserOverrides({});
+    activateSurface('local');
+    resetSettingsDraftRegistryForTests();
+    vi.restoreAllMocks();
+  });
+
+  it.each(['Win32', 'Linux x86_64', 'MacIntel'])('closes only the conversation from the middle input on %s', async platform => {
+    setPlatform(platform);
+    const file = addFile();
+    await render();
+    const event = await press('chat');
+    expect(event.defaultPrevented).toBe(true);
+    expect(useSceneStore.getState().openTabs).toEqual([]);
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(file);
+  });
+
+  it.each(['Win32', 'Linux x86_64', 'MacIntel'])('closes only the right file from its editor on %s', async platform => {
+    setPlatform(platform);
+    addFile();
+    await render();
+    const event = await press('editor-primary');
+    expect(event.defaultPrevented).toBe(true);
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+    expect(useSceneStore.getState().openTabs.map(tab => tab.id)).toEqual([sessionTabId]);
+  });
+
+  it.each(['Win32', 'Linux x86_64', 'MacIntel'])('closes the right terminal through its lifecycle on %s', async platform => {
+    setPlatform(platform);
+    useAgentCanvasStore.getState().addTab({ type: 'terminal', title: 'right', data: { sessionId: 'right-pty' } }, 'active');
+    useBottomTerminalCanvasStore.getState().addTab({ type: 'terminal', title: 'bottom', data: { sessionId: 'bottom-pty' } }, 'active');
+    await render({ bottom: true });
+    await press('terminal-primary');
+    expect(host.destroyTerminal).toHaveBeenCalledExactlyOnceWith('right-pty');
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+    expect(useBottomTerminalCanvasStore.getState().primaryGroup.tabs).toHaveLength(1);
+    expect(useSceneStore.getState().openTabs.map(tab => tab.id)).toEqual([sessionTabId]);
+    await press('bottom-terminal');
+    expect(host.destroyTerminal).toHaveBeenLastCalledWith('bottom-pty');
+    expect(useBottomTerminalCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it('detaches a persistent workspace terminal without destroying its process', async () => {
+    useAgentCanvasStore.getState().addTab({ type: 'terminal', title: 'Shell', data: { sessionId: 'pty' }, metadata: { terminalCloseBehavior: 'detach' } }, 'active');
+    await render();
+    await press('terminal-primary');
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+    expect(host.destroyTerminal).not.toHaveBeenCalled();
+  });
+
+  it('uses the keyboard-focused third split even when the stored active group is different', async () => {
+    useAgentCanvasStore.getState().setSplitMode('grid');
+    addFile('primary'); addFile('secondary'); addFile('tertiary');
+    useAgentCanvasStore.getState().setActiveGroup('primary');
+    await render();
+    await press('editor-tertiary');
+    expect(useAgentCanvasStore.getState().tertiaryGroup.tabs).toEqual([]);
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toHaveLength(1);
+    expect(useAgentCanvasStore.getState().secondaryGroup.tabs).toHaveLength(1);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it('routes the external tab strip to its canvas and focused group', async () => {
+    useAgentCanvasStore.getState().setSplitMode('horizontal');
+    addFile('primary'); addFile('secondary');
+    await render();
+    const strip = document.createElement('div');
+    strip.innerHTML = '<div data-shortcut-scope="canvas" data-canvas-mode="agent"><button data-canvas-toolbar-group="primary">File</button></div>';
+    container.append(strip);
+    await press(strip.querySelector('button')!);
+    // The surviving secondary group is merged into primary by the close lifecycle.
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs.map(tab => tab.title)).toEqual(['secondary']);
+    expect(useAgentCanvasStore.getState().secondaryGroup.tabs).toEqual([]);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it('changes the responding region when focus moves from the right editor back to chat', async () => {
+    addFile();
+    useAgentCanvasStore.getState().addTab({ type: 'code-editor', title: 'second', data: { filePath: '/project/second.ts' } }, 'active');
+    await render();
+    await press('editor-primary');
+    expect(useSceneStore.getState().activeTabId).toBeNull();
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toHaveLength(1);
+    await press('chat');
+    expect(useSceneStore.getState().openTabs).toEqual([]);
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toHaveLength(1);
+  });
+
+  it('retains right-pane ownership when closing a tab leaves keyboard focus on the document body', async () => {
+    addFile();
+    useAgentCanvasStore.getState().addTab({ type: 'code-editor', title: 'second', data: { filePath: '/project/second.ts' } }, 'active');
+    await render();
+    await press('editor-primary');
+    await press(document.body);
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it('closes the keyboard-focused scene label even when the right pane was previously focused', async () => {
+    const file = addFile();
+    await render();
+    useSceneStore.getState().focusPane('secondary');
+    const label = document.createElement('div');
+    label.dataset.openbitfunComponent = 'scene-bar';
+    label.dataset.sceneTabId = sessionTabId;
+    const button = document.createElement('button');
+    label.append(button);
+    container.append(label);
+    await press(button);
+    expect(useSceneStore.getState().openTabs).toEqual([]);
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(file);
+  });
+
+  it.each([true, false])('never falls through an empty/unavailable right pane to the conversation (enabled=%s)', async canvasEnabled => {
+    await render({ canvasEnabled });
+    expect((await press('terminal-primary')).defaultPrevented).toBe(true);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it('preserves one pending dirty confirmation and respects cancellation', async () => {
+    const file = addFile();
+    useAgentCanvasStore.getState().setTabDirty(file, 'primary', true);
+    await render();
+    await press('editor-primary');
+    expect(useConfirmDialogStore.getState().isOpen).toBe(true);
+    const resolve = useConfirmDialogStore.getState().resolve;
+    await press('editor-primary');
+    expect(useConfirmDialogStore.getState().resolve).toBe(resolve);
+    await act(async () => { useConfirmDialogStore.getState().cancel(); });
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(file);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+    await press('editor-primary');
+    await act(async () => { useConfirmDialogStore.getState().confirm(); });
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+  });
+
+  it('uses the settings draft guard when closing a top-level settings tab', async () => {
+    useSceneStore.getState().openScene('settings');
+    registerSettingsDraft({ id: 'form', pageId: 'application.voice', label: 'Voice', dirty: true, save: vi.fn(), discard: vi.fn() });
+    await render();
+    await press('chat');
+    expect(getSettingsDraftSnapshot().pendingNavigation).not.toBeNull();
+    expect(useSceneStore.getState().activeTabId).toBe('settings');
+    cancelPendingSettingsNavigation();
+    expect(useSceneStore.getState().activeTabId).toBe('settings');
+    await press('chat');
+    await act(async () => { await discardAndContinueSettingsNavigation(); });
+    expect(useSceneStore.getState().openTabs.map(tab => tab.id)).toEqual([sessionTabId]);
+  });
+
+  it('does not apply an old close confirmation after a peer surface switch', async () => {
+    const file = addFile();
+    useAgentCanvasStore.getState().setTabDirty(file, 'primary', true);
+    await render();
+    await press('editor-primary');
+    activateSurface('peer-b');
+    await act(async () => { useConfirmDialogStore.getState().confirm(); });
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(file);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it.each([{ repeat: true }, { isComposing: true }, { keyCode: 229 }])('consumes repeated/IME-owned close without closing either region: %o', async extra => {
+    addFile();
+    await render();
+    expect((await press('editor-primary', extra)).defaultPrevented).toBe(true);
+    expect((await press('chat', extra)).defaultPrevented).toBe(true);
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toHaveLength(1);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it('does not close the underlying scene while an overlay owns interaction', async () => {
+    const surfaceRef = createRef<HTMLDivElement>();
+    await act(async () => root.render(<><Fixture /><Portal surfaceRef={surfaceRef}>
+      <div ref={surfaceRef}><input data-testid="dialog-input" /></div>
+    </Portal></>));
+    const input = document.querySelector<HTMLElement>('[data-testid="dialog-input"]')!;
+    expect((await press(input)).defaultPrevented).toBe(true);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+
+  it('keeps the existing close command override for both regions', async () => {
+    addFile();
+    shortcutManager.loadUserOverrides({ 'tab.close': { key: 'q', alt: true } });
+    await render();
+    await press('editor-primary');
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toHaveLength(1);
+    await press('editor-primary', { key: 'q', ctrlKey: false, altKey: true });
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+    await press('chat', { key: 'q', ctrlKey: false, altKey: true });
+    expect(useSceneStore.getState().openTabs).toEqual([]);
+  });
+
+  it('switches numbered tabs in the right canvas without changing the simultaneously mounted bottom canvas', async () => {
+    const first = addFile();
+    useAgentCanvasStore.getState().addTab({ type: 'text-viewer', title: 'second', data: {} }, 'active');
+    useBottomTerminalCanvasStore.getState().addTab({ type: 'text-viewer', title: 'bottom-first', data: {} }, 'active');
+    useBottomTerminalCanvasStore.getState().addTab({ type: 'text-viewer', title: 'bottom-second', data: {} }, 'active');
+    const bottom = useBottomTerminalCanvasStore.getState().primaryGroup.activeTabId;
+    await render({ bottom: true });
+    await press('editor-primary', { key: '2', code: 'Digit2' });
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(first);
+    expect(useBottomTerminalCanvasStore.getState().primaryGroup.activeTabId).toBe(bottom);
+  });
+
+  it('keeps right-canvas tab navigation registered when the bottom canvas unmounts', async () => {
+    const first = addFile();
+    useAgentCanvasStore.getState().addTab({ type: 'text-viewer', title: 'second', data: {} }, 'active');
+    await render({ bottom: true });
+    await render({ bottom: false });
+    expect((await press('editor-primary', { key: '2', code: 'Digit2' })).defaultPrevented).toBe(true);
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(first);
+  });
+
+  it('keeps editor find registered when another canvas unmounts', async () => {
+    const find = vi.spyOn(activeEditTargetService, 'openMonacoFind').mockImplementation(() => {});
+    await render({ bottom: true });
+    await render({ bottom: false });
+    await press('editor-primary', { key: 'f' });
+    expect(find).toHaveBeenCalledOnce();
+  });
+
+  it('uses the focused split for numbered tab selection before a click updates activeGroupId', async () => {
+    useAgentCanvasStore.getState().setSplitMode('grid');
+    const first = addFile('tertiary');
+    useAgentCanvasStore.getState().addTab({ type: 'text-viewer', title: 'second', data: {} }, 'active', 'tertiary');
+    const primary = addFile('primary');
+    useAgentCanvasStore.getState().setActiveGroup('primary');
+    await render();
+    await press('editor-tertiary', { key: '2', code: 'Digit2' });
+    expect(useAgentCanvasStore.getState().tertiaryGroup.activeTabId).toBe(first);
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(primary);
+  });
+
+  it('reopens a closed right-canvas tab without consuming the bottom canvas history', async () => {
+    const file = addFile();
+    useAgentCanvasStore.getState().closeTab(file, 'primary');
+    useBottomTerminalCanvasStore.getState().addTab({ type: 'text-viewer', title: 'bottom', data: {} }, 'active');
+    const bottom = useBottomTerminalCanvasStore.getState().primaryGroup.activeTabId!;
+    useBottomTerminalCanvasStore.getState().closeTab(bottom, 'primary');
+    await render({ bottom: true });
+    await press('editor-primary', { key: 't', shiftKey: true });
+    expect(useAgentCanvasStore.getState().primaryGroup.activeTabId).toBe(file);
+    expect(useBottomTerminalCanvasStore.getState().primaryGroup.tabs).toEqual([]);
+    expect(useBottomTerminalCanvasStore.getState().closedTabs).toHaveLength(1);
+  });
+
+  it('applies canvas layout shortcuts only to the owning canvas', async () => {
+    addFile();
+    await render({ bottom: true });
+    await press('canvas-shell', { key: 'm', shiftKey: true });
+    expect(useAgentCanvasStore.getState().layout.isMaximized).toBe(true);
+    expect(useBottomTerminalCanvasStore.getState().layout.isMaximized).toBe(false);
+  });
+
+  it('does not treat macOS Control or extra modifiers as Command+W', async () => {
+    setPlatform('MacIntel');
+    addFile();
+    await render();
+    for (const extra of [{ metaKey: false, ctrlKey: true }, { ctrlKey: true }, { shiftKey: true }, { altKey: true }]) {
+      expect((await press('editor-primary', extra)).defaultPrevented).toBe(false);
+    }
+    expect(useAgentCanvasStore.getState().primaryGroup.tabs).toHaveLength(1);
+    expect(useSceneStore.getState().openTabs).toHaveLength(1);
+  });
+});
diff --git a/src/web-ui/src/app/hooks/useTabCloseShortcut.ts b/src/web-ui/src/app/hooks/useTabCloseShortcut.ts
new file mode 100644
index 0000000000..5904153166
--- /dev/null
+++ b/src/web-ui/src/app/hooks/useTabCloseShortcut.ts
@@ -0,0 +1,34 @@
+import { useRef } from 'react';
+import { hasOverlayLayers } from '@openbitfun/ui';
+import { useShortcut, type UseShortcutOptions } from '@/infrastructure/hooks/useShortcut';
+import type { ShortcutScope } from '@/shared/types/shortcut';
+import { isImeOwnedKeyboardEvent } from '@/shared/utils/ime';
+import { createLogger } from '@/shared/utils/logger';
+
+const log = createLogger('TabCloseShortcut');
+
+/** Share the binding and interaction guards while each surface owns its close lifecycle. */
+export function useTabCloseShortcut(
+  scope: ShortcutScope,
+  close: (event: KeyboardEvent) => void | Promise<unknown>,
+  options: UseShortcutOptions = {},
+): void {
+  const pending = useRef(false);
+  useShortcut('tab.close', {
+    key: 'w', ctrl: true, scope, allowInInput: true, inheritInChildScopes: true,
+  }, event => {
+    // Still consume the shortcut while a dialog/IME owns interaction or a close
+    // is pending; never let it fall through to closing a different tab/window.
+    if (event.repeat || isImeOwnedKeyboardEvent(event) || hasOverlayLayers() || pending.current) return;
+    pending.current = true;
+    void (async () => {
+      try {
+        await close(event);
+      } catch (error) {
+        log.error('Failed to close tab', { scope, error });
+      } finally {
+        pending.current = false;
+      }
+    })();
+  }, { priority: 10, description: 'keyboard.shortcuts.tab.close', ...options });
+}
diff --git a/src/web-ui/src/app/scenes/settings/AGENTS.md b/src/web-ui/src/app/scenes/settings/AGENTS.md
index 186ed78ede..3d989950bd 100644
--- a/src/web-ui/src/app/scenes/settings/AGENTS.md
+++ b/src/web-ui/src/app/scenes/settings/AGENTS.md
@@ -43,6 +43,16 @@ pnpm --dir src/web-ui run test:run src/infrastructure/config/components/common/S
 ```
 
 Follow the parent guide for `check:web`, i18n, and Appearance registration checks.
+
+For keyboard shortcut recording, command suppression, IME and capture lifetime:
+
+```bash
+pnpm --dir src/web-ui run test:run src/app/scenes/settings/pages/application/KeyboardShortcutsSection.test.tsx src/app/scenes/settings/pages/application/KeyboardShortcutsSection.presentation.test.ts src/infrastructure/services/ShortcutManager.test.ts
+```
+
+These DOM fixtures simulate Windows/macOS modifiers and retained settings sections;
+they do not establish native keyboard delivery or live remote behavior.
+
 For the independent Appearance conversation-width setting and shared drag preference:
 
 ```bash
diff --git a/src/web-ui/src/app/scenes/settings/pages/application/KeyboardShortcutsSection.test.tsx b/src/web-ui/src/app/scenes/settings/pages/application/KeyboardShortcutsSection.test.tsx
new file mode 100644
index 0000000000..934975603e
--- /dev/null
+++ b/src/web-ui/src/app/scenes/settings/pages/application/KeyboardShortcutsSection.test.tsx
@@ -0,0 +1,107 @@
+// @vitest-environment jsdom
+import React, { act } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
+import { shortcutManager } from '@/infrastructure/services/ShortcutManager';
+import { resetSettingsDraftRegistryForTests } from '@/infrastructure/config/settingsDraftRegistry';
+import KeyboardShortcutsSection from './KeyboardShortcutsSection';
+
+vi.mock('@/infrastructure/i18n', () => ({ useI18n: () => ({ t: (key: string) => key === 'keyboard.shortcuts.tab.close' ? 'Close tab' : key }) }));
+vi.mock('@/infrastructure/config/services/ConfigManager', () => ({
+  configManager: { getConfig: vi.fn(async () => ({})), setConfig: vi.fn(async () => {}) },
+}));
+
+globalThis.IS_REACT_ACT_ENVIRONMENT = true;
+
+describe('keyboard shortcut recording ownership', () => {
+  let root: Root;
+  let container: HTMLDivElement;
+  const close = vi.fn();
+  const press = async (target: HTMLElement, extra: KeyboardEventInit = {}) => {
+    const event = new KeyboardEvent('keydown', { key: 'w', ctrlKey: true, bubbles: true, cancelable: true, ...extra });
+    await act(async () => { target.dispatchEvent(event); });
+    return event;
+  };
+  const record = async () => {
+    const row = [...container.querySelectorAll<HTMLElement>('[data-openbitfun-part="item"]')]
+      .find(item => item.textContent?.includes('Close tab'))!;
+    const button = row.querySelector<HTMLButtonElement>('button[aria-pressed]')!;
+    await act(async () => { button.click(); });
+    expect(document.activeElement).toBe(button);
+    return button;
+  };
+
+  beforeEach(async () => {
+    vi.clearAllMocks();
+    resetSettingsDraftRegistryForTests();
+    Object.defineProperty(navigator, 'platform', { configurable: true, value: 'Win32' });
+    shortcutManager.clear();
+    shortcutManager.setEnabled(true);
+    shortcutManager.loadUserOverrides({});
+    shortcutManager.register('tab.close', { key: 'w', ctrl: true, scope: 'app', allowInInput: true }, close,
+      { description: 'keyboard.shortcuts.tab.close' });
+    container = document.createElement('div');
+    document.body.append(container);
+    root = createRoot(container);
+    await act(async () => root.render(<KeyboardShortcutsSection />));
+  });
+  afterEach(async () => {
+    await act(async () => root.unmount());
+    container.remove();
+    shortcutManager.clear();
+    resetSettingsDraftRegistryForTests();
+    vi.restoreAllMocks();
+  });
+
+  it.each(['Win32', 'MacIntel'])('records the close binding without executing it on %s, then restores dispatch', async platform => {
+    Object.defineProperty(navigator, 'platform', { configurable: true, value: platform });
+    const modifier = platform === 'MacIntel' ? { ctrlKey: false, metaKey: true } : { ctrlKey: true };
+    const button = await record();
+    const laterListener = vi.fn();
+    window.addEventListener('keydown', laterListener, true);
+    try {
+      expect((await press(button, modifier)).defaultPrevented).toBe(true);
+      expect(close).not.toHaveBeenCalled();
+      expect(laterListener).not.toHaveBeenCalled();
+      expect(button.getAttribute('aria-pressed')).toBe('false');
+      expect(container.textContent).toContain('keyboard.apply');
+      await press(button, modifier);
+      expect(close).toHaveBeenCalledOnce();
+    } finally { window.removeEventListener('keydown', laterListener, true); }
+  });
+
+  it.each([{ repeat: true }, { isComposing: true }, { keyCode: 229 }])('keeps recording while ignoring held keys and IME: %o', async extra => {
+    const button = await record();
+    await press(button, extra);
+    expect(close).not.toHaveBeenCalled();
+    expect(button.getAttribute('aria-pressed')).toBe('true');
+    await press(button, { key: 'Escape', ctrlKey: false });
+    expect(button.getAttribute('aria-pressed')).toBe('false');
+  });
+
+  it('does not capture keys belonging to another region while settings stays mounted', async () => {
+    const button = await record();
+    await press(document.body);
+    expect(close).toHaveBeenCalledOnce();
+    expect(button.getAttribute('aria-pressed')).toBe('true');
+  });
+
+  it('releases capture when the section unmounts', async () => {
+    await record();
+    await act(async () => root.render(null));
+    await press(document.body);
+    expect(close).toHaveBeenCalledOnce();
+  });
+
+  it('keeps global conflict checks when a command also has a scoped registration', async () => {
+    await act(async () => {
+      shortcutManager.register('tab.close', { key: 'w', ctrl: true, scope: 'workbench-content', allowInInput: true }, vi.fn());
+      shortcutManager.register('fixture.chat', { key: 'q', ctrl: true, scope: 'chat' }, vi.fn(), { description: 'Chat command' });
+    });
+    const button = await record();
+    await press(button, { key: 'q' });
+    const apply = [...container.querySelectorAll<HTMLButtonElement>('button')].find(item => item.textContent === 'keyboard.apply')!;
+    expect(apply.disabled).toBe(true);
+    expect(container.querySelector('[role="alert"]')).not.toBeNull();
+  });
+});
diff --git a/src/web-ui/src/app/scenes/settings/pages/application/KeyboardShortcutsSection.tsx b/src/web-ui/src/app/scenes/settings/pages/application/KeyboardShortcutsSection.tsx
index 02527e5f0c..412c515793 100644
--- a/src/web-ui/src/app/scenes/settings/pages/application/KeyboardShortcutsSection.tsx
+++ b/src/web-ui/src/app/scenes/settings/pages/application/KeyboardShortcutsSection.tsx
@@ -38,6 +38,7 @@ import {
 } from '@/shared/constants/shortcuts';
 import type { ShortcutConfig } from '@/shared/types/shortcut';
 import { createLogger } from '@/shared/utils/logger';
+import { isImeOwnedKeyboardEvent } from '@/shared/utils/ime';
 import { useSettingsSectionAnchor } from '../shared/useSettingsSectionAnchor';
 
 const log = createLogger('KeyboardShortcutsSection');
@@ -101,7 +102,14 @@ function formatShortcutKeyCap(key: string, t: (key: string) => string): string {
 }
 
 function mergeCatalogWithLive(live: ShortcutRegistration[]): ShortcutRegistration[] {
-  const liveById = new Map(live.map((r) => [r.id, r]));
+  const liveById = new Map<string, ShortcutRegistration>();
+  for (const registration of live) {
+    // A scoped instance must not narrow a command that is also active globally;
+    // otherwise recording can miss conflicts with commands in other panels.
+    if (!liveById.has(registration.id) || (registration.config.scope ?? 'app') === 'app') {
+      liveById.set(registration.id, registration);
+    }
+  }
   const out: ShortcutRegistration[] = [];
   for (const def of ALL_SHORTCUTS) {
     const hit = liveById.get(def.id);
@@ -313,8 +321,14 @@ const KeyboardShortcutsSection: React.FC = () => {
   const [saveError, setSaveError] = useState<string | null>(null);
 
   const recordingRef = useRef<string | null>(null);
+  const sectionRef = useRef<HTMLDivElement>(null);
   const saveInFlightRef = useRef(false);
   recordingRef.current = recordingId;
+  const toggleRecording = useCallback((event: React.MouseEvent<HTMLButtonElement>, id: string) => {
+    // Pointer activation does not focus buttons on every WebView/platform.
+    event.currentTarget.focus();
+    setRecordingId(current => current === id ? null : id);
+  }, []);
 
   // Live registrations from ShortcutManager (effects may register after first paint).
   const refreshRegistrations = useCallback(() => {
@@ -344,8 +358,7 @@ const KeyboardShortcutsSection: React.FC = () => {
     if (!recordingId) return;
 
     const handleCapture = (e: KeyboardEvent) => {
-      e.preventDefault();
-      e.stopPropagation();
+      if (e.repeat || isImeOwnedKeyboardEvent(e)) return;
 
       if (e.key === 'Escape') {
         setRecordingId(null);
@@ -353,6 +366,8 @@ const KeyboardShortcutsSection: React.FC = () => {
       }
 
       const isMac = navigator.platform.toUpperCase().includes('MAC');
+      // Physical Control is not representable by the logical Ctrl/Cmd field.
+      if (isMac && e.ctrlKey) return;
       const ctrl = isMac ? e.metaKey : e.ctrlKey;
 
       if (recordingId === MERGED_SCENE_RECORD_ID) {
@@ -407,8 +422,10 @@ const KeyboardShortcutsSection: React.FC = () => {
       setRecordingId(null);
     };
 
-    window.addEventListener('keydown', handleCapture, true);
-    return () => window.removeEventListener('keydown', handleCapture, true);
+    // Settings scenes can stay mounted behind another pane. Capture only keys
+    // from this section, and release ownership when recording ends/unmounts.
+    return shortcutManager.capture(handleCapture, event => event.target instanceof Node
+      && sectionRef.current?.contains(event.target) === true);
   }, [recordingId]);
 
   // Apply all pending changes
@@ -611,7 +628,7 @@ const KeyboardShortcutsSection: React.FC = () => {
   });
 
   return (
-    <div id={sectionAnchor} data-openbitfun-component="keyboard-shortcuts" data-openbitfun-part="root">
+    <div ref={sectionRef} id={sectionAnchor} data-openbitfun-component="keyboard-shortcuts" data-openbitfun-part="root">
       <ConfigPageSection title={t('keyboard.title')} bodySurface={false}>
         {/* Search + actions bar */}
         <div className="kb-shortcuts__toolbar" data-openbitfun-component="keyboard-shortcuts" data-openbitfun-part="toolbar">
@@ -706,9 +723,7 @@ const KeyboardShortcutsSection: React.FC = () => {
                       size="xs"
                       tone={mergedTabConflict ? 'danger' : 'neutral'}
                       variant={recordingId === MERGED_TAB_RECORD_ID ? 'primary' : 'outline'}
-                      onClick={() =>
-                        setRecordingId(recordingId === MERGED_TAB_RECORD_ID ? null : MERGED_TAB_RECORD_ID)
-                      }
+                      onClick={event => toggleRecording(event, MERGED_TAB_RECORD_ID)}
                     >
                       {recordingId === MERGED_TAB_RECORD_ID ? t('keyboard.recording') : mergedTabKeyLabel}
                     </Button>
@@ -775,9 +790,7 @@ const KeyboardShortcutsSection: React.FC = () => {
                       size="xs"
                       tone={mergedSceneConflict ? 'danger' : 'neutral'}
                       variant={recordingId === MERGED_SCENE_RECORD_ID ? 'primary' : 'outline'}
-                      onClick={() =>
-                        setRecordingId(recordingId === MERGED_SCENE_RECORD_ID ? null : MERGED_SCENE_RECORD_ID)
-                      }
+                      onClick={event => toggleRecording(event, MERGED_SCENE_RECORD_ID)}
                     >
                       {recordingId === MERGED_SCENE_RECORD_ID ? t('keyboard.recording') : mergedSceneKeyLabel}
                     </Button>
@@ -849,7 +862,7 @@ const KeyboardShortcutsSection: React.FC = () => {
                         size="xs"
                         tone={conflict ? 'danger' : 'neutral'}
                         variant={isRecording ? 'primary' : 'outline'}
-                        onClick={() => setRecordingId(isRecording ? null : reg.id)}
+                        onClick={event => toggleRecording(event, reg.id)}
                       >
                         {isRecording
                           ? t('keyboard.recording')
diff --git a/src/web-ui/src/app/workbench/ContentResourceView.tsx b/src/web-ui/src/app/workbench/ContentResourceView.tsx
index d82a8ec344..815247ac98 100644
--- a/src/web-ui/src/app/workbench/ContentResourceView.tsx
+++ b/src/web-ui/src/app/workbench/ContentResourceView.tsx
@@ -9,7 +9,7 @@ import { confirmDialogChoice } from '@/infrastructure/confirm-dialog';
 import { useI18n } from '@/infrastructure/i18n';
 import { useSceneStore } from '../stores/sceneStore';
 import { getActiveSurfaceId } from '@/infrastructure/peer-device/deviceSurface';
-import { useShortcut } from '@/infrastructure/hooks/useShortcut';
+import { useTabCloseShortcut } from '../hooks/useTabCloseShortcut';
 import { useWorkbenchResize } from './workbenchResize';
 
 export default function ContentResourceView({ resourceId, isActive }: { resourceId: string; isActive: boolean }) {
@@ -41,7 +41,7 @@ export default function ContentResourceView({ resourceId, isActive }: { resource
     await document.save();
     return !useContentResourceStore.getState().resources[resourceId]?.isDirty;
   }), [document, resourceId, t]);
-  useShortcut('tab.close', { key: 'w', ctrl: true, scope: 'workbench-content', allowInInput: true },
+  useTabCloseShortcut('workbench-content',
     () => useSceneStore.getState().closeScene(`content:${resourceId}`),
     { enabled: isActive && focused, priority: 20, description: 'keyboard.shortcuts.tab.close' });
   if (!resource || !document) return null;
diff --git a/src/web-ui/src/app/workbench/WorkbenchLayout.tsx b/src/web-ui/src/app/workbench/WorkbenchLayout.tsx
index f4b9541fe1..e375fcce76 100644
--- a/src/web-ui/src/app/workbench/WorkbenchLayout.tsx
+++ b/src/web-ui/src/app/workbench/WorkbenchLayout.tsx
@@ -79,7 +79,7 @@ export default function WorkbenchLayout({ workspacePath, children, ...windowProp
   const renderTabs = (location: WorkbenchPane) => <div className="openbitfun-workbench-layout__pane-tabs"
     data-openbitfun-scene="workbench" data-openbitfun-part="paneTabs">
     {(location === 'primary' || hasSecondaryScenes) && <SceneBar pane={location} showDropHint={false} />}
-    {location === canvasPane && <div className="openbitfun-workbench-layout__canvas-tabs" data-openbitfun-scene="workbench" data-openbitfun-part="canvasTabs" data-shortcut-scope="canvas"
+    {location === canvasPane && <div className="openbitfun-workbench-layout__canvas-tabs" data-openbitfun-scene="workbench" data-openbitfun-part="canvasTabs" data-shortcut-scope="canvas" data-canvas-mode="agent"
       onPointerDownCapture={() => useSceneStore.getState().selectCanvas()}
       onFocusCapture={() => useSceneStore.getState().selectCanvas()}>
       <CanvasToolbarHost />
diff --git a/src/web-ui/src/infrastructure/hooks/useShortcut.ts b/src/web-ui/src/infrastructure/hooks/useShortcut.ts
index 087108e018..6abbad7ae6 100644
--- a/src/web-ui/src/infrastructure/hooks/useShortcut.ts
+++ b/src/web-ui/src/infrastructure/hooks/useShortcut.ts
@@ -8,6 +8,8 @@ export interface UseShortcutOptions {
   priority?: number;
   /** Set to false to temporarily disable this shortcut without unregistering. */
   enabled?: boolean;
+  /** Restrict this mounted handler to the event's owning surface. */
+  when?: (event: KeyboardEvent) => boolean;
 }
 
 /**
@@ -29,6 +31,11 @@ export function useShortcut(
   options: UseShortcutOptions = {}
 ): void {
   const { description, priority, enabled = true } = options;
+  const hasOwnerPredicate = Boolean(options.when);
+  const owner = useRef(Symbol(id));
+  const whenRef = useRef(options.when);
+  whenRef.current = options.when;
+  const stableWhen = useRef((event: KeyboardEvent) => whenRef.current?.(event) ?? true);
 
   // Keep the latest callback in a ref so changes don't trigger re-registration.
   const callbackRef = useRef<ShortcutCallback>(callback);
@@ -46,6 +53,7 @@ export function useShortcut(
     meta: config.meta,
     scope: config.scope,
     allowInInput: config.allowInInput,
+    inheritInChildScopes: config.inheritInChildScopes,
   });
 
   useEffect(() => {
@@ -54,9 +62,11 @@ export function useShortcut(
     const unregister = shortcutManager.register(id, config, stableCallback.current, {
       description,
       priority,
+      owner: hasOwnerPredicate ? owner.current : undefined,
+      when: stableWhen.current,
     });
 
     return unregister;
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [id, configKey, enabled, description, priority]);
+  }, [id, configKey, enabled, description, priority, hasOwnerPredicate]);
 }
diff --git a/src/web-ui/src/infrastructure/services/ShortcutManager.test.ts b/src/web-ui/src/infrastructure/services/ShortcutManager.test.ts
index fc6162704b..bd1a989b99 100644
--- a/src/web-ui/src/infrastructure/services/ShortcutManager.test.ts
+++ b/src/web-ui/src/infrastructure/services/ShortcutManager.test.ts
@@ -101,6 +101,50 @@ describe('ShortcutManager platform primary modifier', () => {
     expect(side).not.toHaveBeenCalled();
   });
 
+  it('inherits only opted-in commands through terminal scope and preserves the terminal event otherwise', () => {
+    setPlatform('Win32');
+    const close = vi.fn(), escape = vi.fn(), main = vi.fn();
+    shortcutManager.register('tab.close', { key: 'w', ctrl: true, scope: 'app', allowInInput: true }, main);
+    shortcutManager.register('tab.close', { key: 'w', ctrl: true, scope: 'canvas', allowInInput: true, inheritInChildScopes: true }, close);
+    shortcutManager.register('canvas.escape', { key: 'Escape', scope: 'canvas', allowInInput: true }, escape);
+    const canvas = document.createElement('div');
+    canvas.dataset.shortcutScope = 'canvas';
+    const terminal = document.createElement('textarea');
+    terminal.dataset.shortcutScope = 'terminal';
+    canvas.append(terminal);
+    document.body.append(canvas);
+    terminal.dispatchEvent(new KeyboardEvent('keydown', { key: 'w', ctrlKey: true, bubbles: true, cancelable: true }));
+    const escapeEvent = new KeyboardEvent('keydown', { key: 'Escape', bubbles: true, cancelable: true });
+    terminal.dispatchEvent(escapeEvent);
+    expect(close).toHaveBeenCalledOnce();
+    expect(main).not.toHaveBeenCalled();
+    expect(escape).not.toHaveBeenCalled();
+    expect(escapeEvent.defaultPrevented).toBe(false);
+  });
+
+  it('keeps separately owned handlers through override changes and another owner unmounting', () => {
+    setPlatform('Win32');
+    const right = document.createElement('div'), bottom = document.createElement('div');
+    right.dataset.shortcutScope = bottom.dataset.shortcutScope = 'canvas';
+    document.body.append(right, bottom);
+    const onRight = vi.fn(), onBottom = vi.fn();
+    const config = { key: 'w', ctrl: true, scope: 'canvas' as const };
+    shortcutManager.register('tab.close', config, onRight, { owner: Symbol(), when: event => right.contains(event.target as Node) });
+    const removeBottom = shortcutManager.register('tab.close', config, onBottom, { owner: Symbol(), when: event => bottom.contains(event.target as Node) });
+    shortcutManager.loadUserOverrides({ 'tab.close': { key: 'q', alt: true } });
+    const press = (element: HTMLElement) => element.dispatchEvent(new KeyboardEvent('keydown', { key: 'q', altKey: true, bubbles: true, cancelable: true }));
+    press(right); press(bottom);
+    expect(onRight).toHaveBeenCalledOnce();
+    expect(onBottom).toHaveBeenCalledOnce();
+    removeBottom();
+    press(right); press(bottom);
+    expect(onRight).toHaveBeenCalledTimes(2);
+    expect(onBottom).toHaveBeenCalledOnce();
+    expect(shortcutManager.unregister('tab.close')).toBe(true);
+    press(right);
+    expect(onRight).toHaveBeenCalledTimes(2);
+  });
+
   afterEach(() => {
     shortcutManager.clear();
     vi.restoreAllMocks();
diff --git a/src/web-ui/src/infrastructure/services/ShortcutManager.ts b/src/web-ui/src/infrastructure/services/ShortcutManager.ts
index fb906196f2..63e96a43cf 100644
--- a/src/web-ui/src/infrastructure/services/ShortcutManager.ts
+++ b/src/web-ui/src/infrastructure/services/ShortcutManager.ts
@@ -15,6 +15,16 @@ export interface ShortcutRegistration {
   callback: ShortcutCallback;
   description?: string;
   priority: number;
+  /** Restrict a registration to its owning surface before choosing a winner. */
+  when?: (event: KeyboardEvent) => boolean;
+}
+
+export interface ShortcutRegistrationOptions {
+  description?: string;
+  priority?: number;
+  /** Distinguish mounted instances of the same command without changing its settings ID. */
+  owner?: symbol;
+  when?: (event: KeyboardEvent) => boolean;
 }
 
 /**
@@ -151,7 +161,9 @@ function makeEventKey(scope: ShortcutScope, event: KeyboardEvent): string {
   const c = ctrl ? '1' : '0';
   const s = event.shiftKey ? '1' : '0';
   const a = event.altKey ? '1' : '0';
-  const m = !isMacPlatform() && event.metaKey ? '1' : '0';
+  // Physical Control on macOS is an additional modifier, not logical Ctrl/Cmd.
+  // Keep it distinct so Ctrl+Cmd+W cannot match Cmd+W (or Ctrl+W a plain W).
+  const m = (isMacPlatform() ? event.ctrlKey : event.metaKey) ? '1' : '0';
   return `${scope}:${eventKeyForLookup(event)}:${c}${s}${a}${m}`;
 }
 
@@ -159,9 +171,9 @@ export class ShortcutManager {
   private static instance: ShortcutManager;
 
   /**
-   * All registrations, keyed by shortcut id.
+   * Registrations keyed by scope/command, or by an explicitly mounted owner.
    */
-  private registrations: Map<string, ShortcutRegistration & { defaultConfig: ShortcutConfig }> = new Map();
+  private registrations: Map<string | symbol, ShortcutRegistration & { defaultConfig: ShortcutConfig }> = new Map();
 
   /**
    * O(1) lookup index: mapKey → sorted registrations (descending priority).
@@ -171,6 +183,7 @@ export class ShortcutManager {
 
   private keyDownHandler: ((e: KeyboardEvent) => void) | null = null;
   private isEnabled: boolean = true;
+  private captures = new Map<symbol, Pick<ShortcutRegistration, 'callback' | 'when'>>();
 
   /**
    * User overrides from configManager (id → key+modifiers).
@@ -212,12 +225,12 @@ export class ShortcutManager {
     id: string,
     config: ShortcutConfig,
     callback: ShortcutCallback,
-    options?: { description?: string; priority?: number }
+    options?: ShortcutRegistrationOptions
   ): () => void {
     // Apply user override if present
     const effectiveConfig = this.applyOverride(id, config);
 
-    const registrationKey = `${config.scope ?? 'app'}:${id}`;
+    const registrationKey = options?.owner ?? `${config.scope ?? 'app'}:${id}`;
     const existing = this.registrations.get(registrationKey);
     if (existing) {
       this.removeFromLookupMap(existing);
@@ -230,6 +243,7 @@ export class ShortcutManager {
       callback,
       description: options?.description,
       priority: options?.priority ?? 0,
+      when: options?.when,
     };
 
     this.registrations.set(registrationKey, registration);
@@ -281,9 +295,27 @@ export class ShortcutManager {
 
   // ─── Event handling ────────────────────────────────────────────────────────
 
+  /** A keybinding recorder owns matching events before commands and native fallbacks. */
+  public capture(callback: ShortcutCallback, when: (event: KeyboardEvent) => boolean): () => void {
+    const owner = Symbol('shortcut-capture');
+    this.captures.set(owner, { callback, when });
+    return () => { this.captures.delete(owner); };
+  }
+
   private handleKeyDown(event: KeyboardEvent): void {
-    if (!this.isEnabled) return;
     if (event.defaultPrevented) return;
+    const capture = [...this.captures.values()].reverse().find(owner => owner.when?.(event));
+    if (capture) {
+      event.preventDefault();
+      event.stopImmediatePropagation();
+      try {
+        capture.callback(event);
+      } catch (error) {
+        log.error('Shortcut capture failed', { error });
+      }
+      return;
+    }
+    if (!this.isEnabled) return;
     if (this.isImeOwnedKey(event)) return;
     // The latest overlay owns Escape even if focus is still in its trigger.
     if (event.key === 'Escape' && hasOverlayLayers()) return;
@@ -319,6 +351,7 @@ export class ShortcutManager {
     const appList = this.lookupMap.get(appKey) ?? [];
     for (const reg of appList) {
       if (inInput && !reg.config.allowInInput) continue;
+      if (reg.when && !reg.when(event)) continue;
       results.push(reg);
     }
 
@@ -331,12 +364,25 @@ export class ShortcutManager {
         ? 'workbench-content' : 'canvas';
       const panelScopes: ShortcutScope[] =
         activeScope === 'editor' ? ['editor', editorOwner] : [activeScope];
+      // Only opted-in commands cross a nested panel boundary. In particular,
+      // closing a terminal tab belongs to its canvas, while terminal Escape
+      // and other terminal commands retain their own scope.
+      const ancestorScopes = new Set<ShortcutScope>(panelScopes);
+      let ancestor = event.target instanceof Element
+        ? event.target.closest('[data-shortcut-scope]') : null;
+      while (ancestor) {
+        const scope = this.detectScope(ancestor);
+        if (scope !== 'app') ancestorScopes.add(scope);
+        ancestor = ancestor.parentElement?.closest('[data-shortcut-scope]') ?? null;
+      }
       const panelRegs: ShortcutRegistration[] = [];
-      for (const scope of panelScopes) {
+      for (const scope of ancestorScopes) {
         for (const reg of this.lookupMap.get(makeEventKey(scope, event)) ?? []) {
+          if (!panelScopes.includes(scope) && !reg.config.inheritInChildScopes) continue;
           if (inInput && !reg.config.allowInInput) {
             continue;
           }
+          if (reg.when && !reg.when(event)) continue;
           panelRegs.push(reg);
         }
       }
@@ -562,6 +608,7 @@ export class ShortcutManager {
   }
 
   public clear(): void {
+    this.captures.clear();
     this.registrations.clear();
     this.lookupMap.clear();
     this.notifyRegistrationListeners();
diff --git a/src/web-ui/src/shared/constants/shortcuts.ts b/src/web-ui/src/shared/constants/shortcuts.ts
index 1fb7daced6..1c01911b0e 100644
--- a/src/web-ui/src/shared/constants/shortcuts.ts
+++ b/src/web-ui/src/shared/constants/shortcuts.ts
@@ -30,6 +30,11 @@ function mod(
 // navigation and layout operations that must always be reachable.
 
 export const APP_SHORTCUTS: ShortcutDef[] = [
+  {
+    id: 'tab.close',
+    config: mod('W', { scope: 'app', allowInInput: true }),
+    descriptionKey: 'keyboard.shortcuts.tab.close',
+  },
   // Panel layout
   {
     id: 'panel.toggleLeft',
@@ -114,11 +119,6 @@ export const CANVAS_SHORTCUTS: ShortcutDef[] = [
     descriptionKey: 'keyboard.shortcuts.canvas.maximize',
   },
   // Tab management
-  {
-    id: 'tab.close',
-    config: mod('W', { scope: 'canvas', allowInInput: true }),
-    descriptionKey: 'keyboard.shortcuts.tab.close',
-  },
   {
     id: 'tab.reopenClosed',
     config: mod('T', { shift: true, scope: 'canvas', allowInInput: true }),
diff --git a/src/web-ui/src/shared/types/shortcut.ts b/src/web-ui/src/shared/types/shortcut.ts
index d686ca9382..965475a1f6 100644
--- a/src/web-ui/src/shared/types/shortcut.ts
+++ b/src/web-ui/src/shared/types/shortcut.ts
@@ -33,4 +33,6 @@ export interface ShortcutConfig {
    * element is focused. Defaults to false.
    */
   allowInInput?: boolean;
+  /** Also handle nested panel scopes, such as a terminal inside this canvas. */
+  inheritInChildScopes?: boolean;
 }