From 2c5205b06e3217574b9204d40f57cf4a17ac7a4f Mon Sep 17 00:00:00 2001
From: steven_li <liyuxuan2001@hotmail.com>
Date: Fri, 5 Jun 2026 11:46:40 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0MinIO=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E7=B3=BB=E7=BB=9F=E6=94=AF=E6=8C=81=E5=B9=B6=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E5=A4=96=E9=83=A8=E8=BF=9E=E6=8E=A5=E5=99=A8=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 添加MinIO用户文件系统配置选项(BEAVER_MINIO_ROOT_USER等)
- 更新外部连接器配置结构，包括BASE_URL和认证令牌设置
- 改进connector provider支持更多类型(official, feishu_bot等)
- 实现Mistral模型推理模式支持reasoning_effort参数
- 增强外部连接器策略配置和运行时配置管理
- 添加connector bridge事件验证和安全保护机制
- 优化任务路由逻辑，区分simple_chat和new_task场景
- 更新初始技能工具提示配置，分离authoring admin功能
---
 .env.example                                  |  18 +-
 app-instance/README.md                        |   4 +
 .../beaver/engine/providers/litellm.py        |  13 +
 .../channels/connections/external.py          |  79 ++-
 .../backend/beaver/interfaces/web/app.py      |  80 ++-
 .../backend/beaver/services/agent_service.py  |  16 +
 .../builtin/intent-agent-router/SKILL.md      |   9 +-
 app-instance/backend/beaver/tasks/router.py   |   3 +
 .../test_external_connector_bridge_api.py     |  86 +++
 .../unit/test_external_sidecar_connectors.py  | 142 +++++
 .../unit/test_initial_skill_tool_hints.py     |  25 +-
 .../tests/unit/test_litellm_thinking_mode.py  |  84 +++
 .../tests/unit/test_main_agent_router.py      |  16 +
 .../tests/unit/test_task_mode_feedback.py     | 185 +++++++
 app-instance/create-instance.sh               |  62 ++-
 app-instance/entrypoint.sh                    |  67 +++
 .../frontend/app/(app)/files/page.tsx         | 180 ++++---
 .../frontend/app/(app)/marketplace/page.tsx   |  69 ++-
 app-instance/frontend/app/(app)/mcp/page.tsx  | 177 ++++---
 .../notifications/[scheduledRunId]/page.tsx   |  42 +-
 .../frontend/app/(app)/notifications/page.tsx |  23 +-
 .../frontend/app/(app)/outlook/page.tsx       | 147 +++---
 app-instance/frontend/app/(app)/page.tsx      | 263 ++++++---
 .../frontend/app/(app)/skills/page.tsx        | 207 ++++++--
 .../frontend/app/(app)/status/page.tsx        | 499 ++++++++++++++----
 .../app/(app)/tasks/[taskId]/page.tsx         |  63 +--
 .../frontend/app/(app)/tasks/page.tsx         | 291 +++++++++-
 .../frontend/components/AppRuntimeBridge.tsx  |   3 +-
 app-instance/frontend/components/Header.tsx   | 244 ++++++---
 .../frontend/components/LanguageSwitcher.tsx  |   2 +-
 .../CurrentSessionProgressSidebar.tsx         | 280 +---------
 .../components/chat-workbench/MessageList.tsx |  61 ++-
 .../components/skills/SkillDetailView.tsx     |  38 +-
 .../task-detail/TaskAcceptanceCard.tsx        |  20 +-
 .../components/task-detail/TaskLiveHeader.tsx |   8 +-
 .../components/task-detail/TaskSideRail.tsx   |   6 +-
 .../components/task-detail/TaskTimeline.tsx   |  31 +-
 .../task-detail/TaskTimelineCard.tsx          |   6 +-
 .../task-management/TaskManagementTabs.tsx    |   2 +-
 .../frontend/components/ui/button.tsx         |   6 +-
 .../frontend/components/ui/dialog.tsx         |   4 +-
 app-instance/frontend/components/ui/input.tsx |   2 +-
 .../frontend/components/ui/select.tsx         |   2 +-
 .../frontend/components/ui/switch.tsx         |   4 +-
 app-instance/frontend/components/ui/tabs.tsx  |   4 +-
 app-instance/frontend/lib/api.ts              |   5 +
 .../lib/channel-connector-state.test.ts       |  60 +++
 .../frontend/lib/channel-connector-state.ts   |  28 +
 .../frontend/lib/channel-connectors.test.ts   |  13 +
 .../frontend/lib/session-progress.test.ts     | 201 -------
 app-instance/frontend/lib/session-progress.ts | 392 --------------
 .../frontend/lib/task-process.test.ts         | 160 ++++++
 app-instance/frontend/lib/task-process.ts     |  75 +++
 .../frontend/lib/task-timeline-view.test.ts   |  52 ++
 .../frontend/lib/task-timeline-view.ts        |  37 ++
 .../frontend/test-results/.last-run.json      |   9 +
 .../error-context.md                          | 281 ++++++++++
 .../error-context.md                          | 208 ++++++++
 .../error-context.md                          | 316 +++++++++++
 .../error-context.md                          | 260 +++++++++
 auth-portal/src/app/globals.css               | 161 +++++-
 auth-portal/src/app/login/page.tsx            |  35 +-
 auth-portal/src/test-results/.last-run.json   |   4 +
 authz-service/.env.example                    |   9 +
 .../seed-data/backend_credentials.json        |   2 +-
 deploy-control/.env.example                   |   5 +
 deploy-control/README.md                      |   7 +-
 deploy-control/server.py                      |  15 +
 .../tests/test_connector_instance_config.py   |  58 ++
 docker-compose.external-connectors.yml        |   6 +-
 .../2026-06-04-auto-accept-on-new-topic.md    |  73 +++
 ...26-06-04-chat-task-timeline-consistency.md |  75 +++
 .../2026-06-04-initial-multi-search-engine.md | 104 ++++
 ...6-06-04-auto-accept-on-new-topic-design.md |  60 +++
 ...4-chat-task-timeline-consistency-design.md |  59 +++
 docs/ui-ux/README.md                          |  84 +++
 docs/ui-ux/pages/auth-login.md                | 220 ++++++++
 docs/ui-ux/pages/chat-workbench.md            | 346 ++++++++++++
 docs/ui-ux/pages/files.md                     | 120 +++++
 docs/ui-ux/pages/marketplace.md               | 106 ++++
 docs/ui-ux/pages/mcp-tools.md                 | 114 ++++
 docs/ui-ux/pages/notifications.md             | 135 +++++
 docs/ui-ux/pages/outlook.md                   | 121 +++++
 docs/ui-ux/pages/settings.md                  | 120 +++++
 docs/ui-ux/pages/skills.md                    | 121 +++++
 docs/ui-ux/pages/task-management.md           | 144 +++++
 external-connector/external_connector/app.py  |   4 +-
 .../node/feishu_event_utils.js                | 216 ++++++++
 .../node/feishu_ws_receiver.js                | 132 ++---
 .../providers/feishu_bot.py                   | 190 ++++++-
 .../providers/weixin_ilink.py                 |  35 +-
 .../tests/node/feishu_event_utils.test.js     | 189 +++++++
 .../tests/test_feishu_bot_provider.py         | 183 ++++++-
 external-connector/tests/test_sidecar_api.py  |  11 +
 .../tests/test_weixin_ilink_provider.py       |  32 ++
 scripts/deploy-initial-skills.sh              | 116 ++--
 skills/_index/disabled.json                   |   6 +-
 skills/_index/published.json                  |   4 +-
 .../current.json                              |   2 +-
 skills/multi-search-engine/skill.json         |  16 +
 .../versions/v0001/CHANGELOG.md               |  18 +
 .../versions/v0001/CHANNELLOG.md              |  48 ++
 .../versions/v0001/SKILL.md                   | 156 ++++++
 .../versions/v0001/_meta.json                 |   6 +
 .../versions/v0001/config.json                |  85 +++
 .../versions/v0001/metadata.json              |   7 +
 .../v0001/references/advanced-search.md       | 146 +++++
 .../v0001/references/international-search.md  | 398 ++++++++++++++
 .../versions/v0001/version.json               |  31 ++
 skills/skills-admin/skill.json                |   6 +-
 skills/skills-admin/versions/v0001/SKILL.md   |  22 +-
 .../skills-admin/versions/v0001/version.json  |  12 +-
 skills/skills-authoring-admin/current.json    |   3 +
 skills/skills-authoring-admin/skill.json      |  13 +
 .../versions/v0001/SKILL.md                   |  28 +
 .../versions/v0001/version.json               |  22 +
 skills/web-operation/skill.json               |  13 -
 skills/web-operation/versions/v0001/SKILL.md  |  36 --
 .../web-operation/versions/v0001/version.json |  22 -
 test-results/.last-run.json                   |   4 +
 120 files changed, 8321 insertions(+), 1865 deletions(-)
 create mode 100644 app-instance/frontend/lib/channel-connector-state.test.ts
 create mode 100644 app-instance/frontend/lib/channel-connector-state.ts
 delete mode 100644 app-instance/frontend/lib/session-progress.test.ts
 delete mode 100644 app-instance/frontend/lib/session-progress.ts
 create mode 100644 app-instance/frontend/lib/task-process.test.ts
 create mode 100644 app-instance/frontend/lib/task-process.ts
 create mode 100644 app-instance/frontend/lib/task-timeline-view.test.ts
 create mode 100644 app-instance/frontend/lib/task-timeline-view.ts
 create mode 100644 app-instance/frontend/test-results/.last-run.json
 create mode 100644 app-instance/frontend/test-results/market-settings-qa-marketp-0de76-ail-file-install-flow-works/error-context.md
 create mode 100644 app-instance/frontend/test-results/market-settings-qa-marketp-a30a5-ngs-error-state-is-readable/error-context.md
 create mode 100644 app-instance/frontend/test-results/market-settings-qa-marketp-f612f-nnel-and-restart-flows-work/error-context.md
 create mode 100644 app-instance/frontend/test-results/market-settings-qa-marketp-f6b19-ow-or-visible-small-targets/error-context.md
 create mode 100644 auth-portal/src/test-results/.last-run.json
 create mode 100644 deploy-control/tests/test_connector_instance_config.py
 create mode 100644 docs/superpowers/plans/2026-06-04-auto-accept-on-new-topic.md
 create mode 100644 docs/superpowers/plans/2026-06-04-chat-task-timeline-consistency.md
 create mode 100644 docs/superpowers/plans/2026-06-04-initial-multi-search-engine.md
 create mode 100644 docs/superpowers/specs/2026-06-04-auto-accept-on-new-topic-design.md
 create mode 100644 docs/superpowers/specs/2026-06-04-chat-task-timeline-consistency-design.md
 create mode 100644 docs/ui-ux/README.md
 create mode 100644 docs/ui-ux/pages/auth-login.md
 create mode 100644 docs/ui-ux/pages/chat-workbench.md
 create mode 100644 docs/ui-ux/pages/files.md
 create mode 100644 docs/ui-ux/pages/marketplace.md
 create mode 100644 docs/ui-ux/pages/mcp-tools.md
 create mode 100644 docs/ui-ux/pages/notifications.md
 create mode 100644 docs/ui-ux/pages/outlook.md
 create mode 100644 docs/ui-ux/pages/settings.md
 create mode 100644 docs/ui-ux/pages/skills.md
 create mode 100644 docs/ui-ux/pages/task-management.md
 create mode 100644 external-connector/external_connector/node/feishu_event_utils.js
 create mode 100644 external-connector/tests/node/feishu_event_utils.test.js
 mode change 100644 => 100755 scripts/deploy-initial-skills.sh
 rename skills/{web-operation => multi-search-engine}/current.json (93%)
 create mode 100644 skills/multi-search-engine/skill.json
 create mode 100644 skills/multi-search-engine/versions/v0001/CHANGELOG.md
 create mode 100644 skills/multi-search-engine/versions/v0001/CHANNELLOG.md
 create mode 100644 skills/multi-search-engine/versions/v0001/SKILL.md
 create mode 100644 skills/multi-search-engine/versions/v0001/_meta.json
 create mode 100644 skills/multi-search-engine/versions/v0001/config.json
 create mode 100644 skills/multi-search-engine/versions/v0001/metadata.json
 create mode 100644 skills/multi-search-engine/versions/v0001/references/advanced-search.md
 create mode 100644 skills/multi-search-engine/versions/v0001/references/international-search.md
 create mode 100644 skills/multi-search-engine/versions/v0001/version.json
 create mode 100644 skills/skills-authoring-admin/current.json
 create mode 100644 skills/skills-authoring-admin/skill.json
 create mode 100644 skills/skills-authoring-admin/versions/v0001/SKILL.md
 create mode 100644 skills/skills-authoring-admin/versions/v0001/version.json
 delete mode 100644 skills/web-operation/skill.json
 delete mode 100644 skills/web-operation/versions/v0001/SKILL.md
 delete mode 100644 skills/web-operation/versions/v0001/version.json
 create mode 100644 test-results/.last-run.json

diff --git a/.env.example b/.env.example
index 00c63f2..6ac2e26 100644
--- a/.env.example
+++ b/.env.example
@@ -26,17 +26,27 @@ BEAVER_AUTHZ_URL=http://beaver-authz-service:19090
 BEAVER_OUTLOOK_MCP_URL=
 BEAVER_OUTLOOK_MCP_SERVER_ID=outlook_mcp
 
+# User file system backed by MinIO/S3.
+BEAVER_MINIO_ROOT_USER=
+BEAVER_MINIO_ROOT_PASSWORD=
+BEAVER_USER_FILES_BUCKET=beaver-user-files
+BEAVER_USER_FILES_MINIO_ENDPOINT=
+BEAVER_USER_FILES_MAX_UPLOAD_BYTES=5368709120
+
 # Must be reachable from auth-portal and authz-service containers.
 BEAVER_DEPLOY_URL=http://beaver-deploy-control:8090
 
 # External connector sidecar
-EXTERNAL_CONNECTOR_TOKEN=
-BEAVER_BRIDGE_TOKEN=
+EXTERNAL_CONNECTOR_BASE_URL=http://external-connector:8787
+# Required for connector management API authentication.
+EXTERNAL_CONNECTOR_TOKEN=change-me-connector-token
+# Required for sidecar -> Beaver bridge authentication.
+BEAVER_BRIDGE_TOKEN=change-me-bridge-token
 BEAVER_BRIDGE_BASE_URL=http://app-instance:8080
 EXTERNAL_CONNECTOR_PORT=8787
 CONNECTOR_PUBLIC_BASE_URL=http://localhost:8787
-# fake | vendor_cli | weixin_ilink
-CONNECTOR_PROVIDER=vendor_cli
+# fake | official | vendor_cli | weixin_ilink | feishu_bot
+CONNECTOR_PROVIDER=official
 CONNECTOR_COMMAND_TIMEOUT_SECONDS=120
 WEIXIN_CONNECT_COMMAND=
 WEIXIN_STATUS_COMMAND=
diff --git a/app-instance/README.md b/app-instance/README.md
index 3ec143b..6034e77 100644
--- a/app-instance/README.md
+++ b/app-instance/README.md
@@ -72,6 +72,8 @@ docker build -t beaver/app-instance:latest .
 - `--client-secret`
 - `--network`
 - `--host-bind-ip`
+- `--initial-skills-dir`
+- `--skip-initial-skills`
 - `--build`
 - `--replace`
 
@@ -127,6 +129,8 @@ BEAVER_WORKSPACE=/root/.beaver/workspace
 
 所以模型 `provider/api_key/api_base/model` 配一次即可，Web / channel 请求不需要、也不应该携带 API Key。
 
+`create-instance.sh` 默认会把仓库根目录的 `skills/` 非覆盖式复制到实例 workspace，并把同一个目录只读挂载到实例容器的 `/opt/app/initial-skills`。`entrypoint.sh` 每次启动都会用该目录补齐缺失的 published 初始 skills；已有 skill 目录不会被覆盖，index 只做并集追加。
+
 ## 当前状态
 
 这层已经支持：
diff --git a/app-instance/backend/beaver/engine/providers/litellm.py b/app-instance/backend/beaver/engine/providers/litellm.py
index 74a5d3c..fab3ded 100644
--- a/app-instance/backend/beaver/engine/providers/litellm.py
+++ b/app-instance/backend/beaver/engine/providers/litellm.py
@@ -185,6 +185,13 @@ class LiteLLMProvider(LLMProvider):
             kwargs["provider"] = provider_payload
 
     def _apply_thinking_mode(self, original_model: str, resolved_model: str, kwargs: dict[str, Any], enabled: bool | None) -> None:
+        if self._uses_mistral_reasoning_parser(original_model, resolved_model):
+            if enabled is not None:
+                extra_body = dict(kwargs.get("extra_body") or {})
+                extra_body["reasoning_effort"] = "high" if enabled else "none"
+                kwargs["extra_body"] = extra_body
+            return
+
         extra_body = dict(kwargs.get("extra_body") or {})
         chat_template_kwargs = dict(extra_body.get("chat_template_kwargs") or {})
         chat_template_kwargs["enable_thinking"] = False
@@ -192,6 +199,12 @@ class LiteLLMProvider(LLMProvider):
         extra_body["thinking"] = {"type": "disabled"}
         kwargs["extra_body"] = extra_body
 
+    def _uses_mistral_reasoning_parser(self, original_model: str, resolved_model: str) -> bool:
+        if self.provider_name != "vllm":
+            return False
+        model_names = f"{original_model} {resolved_model}".lower()
+        return "mistral" in model_names
+
     async def chat(
         self,
         messages: list[dict[str, Any]],
diff --git a/app-instance/backend/beaver/interfaces/channels/connections/external.py b/app-instance/backend/beaver/interfaces/channels/connections/external.py
index f11ec00..2a68f15 100644
--- a/app-instance/backend/beaver/interfaces/channels/connections/external.py
+++ b/app-instance/backend/beaver/interfaces/channels/connections/external.py
@@ -8,6 +8,18 @@ from .models import ChannelRuntimeSpec, ValidationResult
 from .sidecar_client import ConnectorSidecarClient
 from .store import ChannelConnectionStore, CredentialStore
 
+POLICY_CONFIG_KEYS = {
+    "allowFrom",
+    "groupAllowFrom",
+    "requireMentionInGroups",
+    "respondToMentionAll",
+    "dmMode",
+    "maxMessageChars",
+    "textBatchDelayMs",
+    "textBatchMaxMessages",
+    "textBatchMaxChars",
+}
+
 
 class ExternalConnectorBase:
     kind = ""
@@ -33,6 +45,8 @@ class ExternalConnectorBase:
         owner_user_id: str | None,
         options: dict[str, Any],
     ) -> dict[str, Any]:
+        runtime_config = {"sidecarBaseUrl": self.sidecar_base_url}
+        runtime_config.update(_policy_runtime_config(options))
         connection = self.connection_store.create(
             kind=self.kind,
             mode="sidecar",
@@ -40,7 +54,7 @@ class ExternalConnectorBase:
             account_id="",
             owner_user_id=owner_user_id,
             auth_type="connector_session",
-            runtime_config={"sidecarBaseUrl": self.sidecar_base_url},
+            runtime_config=runtime_config,
             capabilities=list(self.capabilities),
         )
         connection = self.connection_store.update_status(connection.connection_id, status="pairing", last_error=None)
@@ -54,7 +68,8 @@ class ExternalConnectorBase:
         }
         view = dict(await self.sidecar_client.start_session(payload))
         connection.pairing_session_id = str(view.get("sessionId") or "")
-        self.connection_store.update(connection)
+        connection = self.connection_store.update(connection)
+        connection = self._apply_session_view(connection, view)
         view["connectionId"] = connection.connection_id
         view["channelId"] = connection.channel_id
         return view
@@ -62,6 +77,12 @@ class ExternalConnectorBase:
     async def poll_session(self, session_id: str) -> dict[str, Any]:
         view = dict(await self.sidecar_client.get_session(session_id))
         connection = self._connection_for_session(session_id)
+        connection = self._apply_session_view(connection, view)
+        view["connectionId"] = connection.connection_id
+        view["channelId"] = connection.channel_id
+        return view
+
+    def _apply_session_view(self, connection: Any, view: dict[str, Any]) -> Any:
         status = str(view.get("status") or "")
         if status == "connected":
             connection.account_id = str(view.get("accountId") or connection.account_id)
@@ -78,9 +99,7 @@ class ExternalConnectorBase:
                 status="error",
                 last_error=str(view.get("error") or status),
             )
-        view["connectionId"] = connection.connection_id
-        view["channelId"] = connection.channel_id
-        return view
+        return self.connection_store.get(connection.connection_id)
 
     async def validate(self, connection_id: str) -> ValidationResult:
         connection = self.connection_store.get(connection_id)
@@ -106,6 +125,7 @@ class ExternalConnectorBase:
             config={
                 "platformKind": self.kind,
                 "connectionId": connection.connection_id,
+                **dict(connection.runtime_config),
                 "sidecarBaseUrl": connection.runtime_config.get("sidecarBaseUrl") or self.sidecar_base_url,
             },
             secrets_ref=None,
@@ -129,3 +149,52 @@ class WeixinConnector(ExternalConnectorBase):
 class FeishuConnector(ExternalConnectorBase):
     kind = "feishu"
     capabilities = ["receive_text", "send_text", "receive_media", "groups"]
+
+
+def _policy_runtime_config(options: dict[str, Any]) -> dict[str, Any]:
+    result: dict[str, Any] = {}
+    for key in POLICY_CONFIG_KEYS:
+        if key not in options:
+            continue
+        value = options[key]
+        if key in {"allowFrom", "groupAllowFrom"}:
+            items = _string_list(value)
+            if items:
+                result[key] = items
+            continue
+        if key in {"maxMessageChars", "textBatchDelayMs", "textBatchMaxMessages", "textBatchMaxChars"}:
+            number = _positive_int(value)
+            if number is not None:
+                result[key] = number
+            continue
+        if key in {"requireMentionInGroups", "respondToMentionAll"}:
+            result[key] = _bool(value)
+            continue
+        text = str(value or "").strip()
+        if text:
+            result[key] = text
+    return result
+
+
+def _string_list(value: Any) -> list[str]:
+    if isinstance(value, str):
+        raw_items = value.replace("\n", ",").split(",")
+    elif isinstance(value, list):
+        raw_items = value
+    else:
+        raw_items = []
+    return [str(item).strip() for item in raw_items if str(item).strip()]
+
+
+def _positive_int(value: Any) -> int | None:
+    try:
+        number = int(value)
+    except (TypeError, ValueError):
+        return None
+    return number if number > 0 else None
+
+
+def _bool(value: Any) -> bool:
+    if isinstance(value, bool):
+        return value
+    return str(value).strip().lower() in {"1", "true", "yes", "on"}
diff --git a/app-instance/backend/beaver/interfaces/web/app.py b/app-instance/backend/beaver/interfaces/web/app.py
index e81179e..3ef6f11 100644
--- a/app-instance/backend/beaver/interfaces/web/app.py
+++ b/app-instance/backend/beaver/interfaces/web/app.py
@@ -431,6 +431,37 @@ def _connection_response_view(connection: Any) -> dict[str, Any]:
     return view
 
 
+def _connector_session_response_view(view: dict[str, Any]) -> dict[str, Any]:
+    result = dict(view)
+    metadata = result.get("metadata")
+    if isinstance(metadata, dict):
+        result["metadata"] = {
+            str(key): value
+            for key, value in metadata.items()
+            if not _is_sensitive_metadata_key(str(key))
+        }
+    return result
+
+
+def _is_sensitive_metadata_key(key: str) -> bool:
+    lowered = key.lower()
+    return any(token in lowered for token in ("secret", "token", "password", "authorization", "credential"))
+
+
+async def _activate_connected_channel(
+    request: Request,
+    registry: ChannelConnectorRegistry,
+    connection: Any,
+) -> Any:
+    if connection.status != "connected":
+        return connection
+    runtime = get_channel_runtime(request)
+    config = (await registry.materialize_channel_configs()).get(connection.channel_id)
+    if config is not None:
+        await runtime.add_channel(connection.channel_id, config)
+    return registry.connection_store.get(connection.connection_id)
+
+
 def _normalize_connection_config(config: dict[str, Any] | None) -> dict[str, Any]:
     if not isinstance(config, dict):
         return {}
@@ -441,6 +472,36 @@ def _normalize_connection_config(config: dict[str, Any] | None) -> dict[str, Any
     }
 
 
+def _connector_bridge_guard(connection: Any, payload: WebConnectorBridgeEventRequest) -> None:
+    if connection.status == "revoked":
+        raise HTTPException(status_code=404, detail="Channel connection not found")
+    if connection.status not in {"connected", "running"}:
+        raise HTTPException(status_code=409, detail="Channel connection is not connected")
+    mismatches: list[str] = []
+    if payload.channel_id != connection.channel_id:
+        mismatches.append("channelId")
+    if payload.kind != connection.kind:
+        mismatches.append("kind")
+    if payload.account_id != connection.account_id:
+        mismatches.append("accountId")
+    if mismatches:
+        raise HTTPException(status_code=403, detail=f"Bridge event does not match connection: {', '.join(mismatches)}")
+    content = payload.content.strip()
+    if not content:
+        raise HTTPException(status_code=400, detail="Bridge event content is required")
+    max_chars = _positive_int(connection.runtime_config.get("maxMessageChars"), default=20000)
+    if len(content) > max_chars:
+        raise HTTPException(status_code=413, detail=f"Bridge event content exceeds maxMessageChars ({max_chars})")
+
+
+def _positive_int(value: Any, *, default: int) -> int:
+    try:
+        number = int(value)
+    except (TypeError, ValueError):
+        return default
+    return number if number > 0 else default
+
+
 def _camel_to_snake_text(value: str) -> str:
     result: list[str] = []
     for char in value.strip():
@@ -721,8 +782,10 @@ def create_app(
         connection_id = _clean_text(view.get("connectionId"))
         connection_view = None
         if connection_id:
-            connection_view = _connection_response_view(registry.connection_store.get(connection_id))
-        return WebConnectorSessionResponse(session=view, connection=connection_view)
+            connection = registry.connection_store.get(connection_id)
+            connection = await _activate_connected_channel(request, registry, connection)
+            connection_view = _connection_response_view(connection)
+        return WebConnectorSessionResponse(session=_connector_session_response_view(view), connection=connection_view)
 
     @app.get("/api/channel-connector-sessions/{session_id}", response_model=WebConnectorSessionResponse)
     async def get_channel_connector_session(session_id: str, request: Request) -> WebConnectorSessionResponse:
@@ -739,11 +802,11 @@ def create_app(
             raise HTTPException(status_code=400, detail="Connector does not support sessions")
         view = await poll_session(session_id)
         connection = registry.connection_store.get(connection.connection_id)
-        if connection.status == "connected":
-            runtime = get_channel_runtime(request)
-            config = (await registry.materialize_channel_configs())[connection.channel_id]
-            await runtime.add_channel(connection.channel_id, config)
-        return WebConnectorSessionResponse(session=view, connection=_connection_response_view(connection))
+        connection = await _activate_connected_channel(request, registry, connection)
+        return WebConnectorSessionResponse(
+            session=_connector_session_response_view(view),
+            connection=_connection_response_view(connection),
+        )
 
     @app.post("/api/channel-connector-bridge/events", response_model=WebConnectorBridgeEventResponse)
     async def accept_connector_bridge_event(
@@ -760,8 +823,7 @@ def create_app(
             connection = registry.connection_store.get(payload.connection_id)
         except KeyError:
             raise HTTPException(status_code=404, detail="Channel connection not found")
-        if connection.status == "revoked":
-            raise HTTPException(status_code=404, detail="Channel connection not found")
+        _connector_bridge_guard(connection, payload)
 
         store = _message_dedupe_store(_channel_connection_workspace(request))
         begin = store.begin(
diff --git a/app-instance/backend/beaver/services/agent_service.py b/app-instance/backend/beaver/services/agent_service.py
index c2d1750..c3d87a6 100644
--- a/app-instance/backend/beaver/services/agent_service.py
+++ b/app-instance/backend/beaver/services/agent_service.py
@@ -604,6 +604,8 @@ class AgentService:
         if active_task is not None and decision.short_title and not active_task.metadata.get("short_title"):
             active_task.metadata["short_title"] = decision.short_title
             task_service.store.upsert_task(active_task)
+        if active_task is not None and (decision.action == "simple_chat" or decision.starts_new_task):
+            await self._accept_active_task_for_new_topic(active_task)
         if active_task is not None and decision.closes_task:
             task_service.close_task(active_task.task_id, reason=decision.reason)
             return await runner(message, **kwargs)
@@ -636,6 +638,20 @@ class AgentService:
             )
         return await self._run_task_mode(message, runner=runner, kwargs=kwargs, task=task)
 
+    async def _accept_active_task_for_new_topic(self, task: TaskRecord) -> None:
+        """Accept a completed active Task before routing an unrelated new topic."""
+
+        if task.status != "awaiting_acceptance":
+            return
+        run_id = next((item for item in reversed(task.run_ids) if item), None)
+        if not run_id:
+            return
+        await self.submit_acceptance(
+            session_id=task.session_id,
+            run_id=run_id,
+            acceptance_type="accept",
+        )
+
     def _record_revision_acceptance_for_task(
         self,
         loaded: Any,
diff --git a/app-instance/backend/beaver/skills/builtin/intent-agent-router/SKILL.md b/app-instance/backend/beaver/skills/builtin/intent-agent-router/SKILL.md
index 741b779..881e757 100644
--- a/app-instance/backend/beaver/skills/builtin/intent-agent-router/SKILL.md
+++ b/app-instance/backend/beaver/skills/builtin/intent-agent-router/SKILL.md
@@ -32,16 +32,23 @@ When there is an active task, do not force every new user message into that task
 
 - Choose `revise_task` when the user asks to change, correct, refine, expand, reformat, or redo the latest active task result.
 - Choose `continue_task` for neutral follow-up questions or additional next steps that still belong to the active task.
-- Choose `new_task` when the user asks for clearly unrelated work.
+- Choose `simple_chat` for unrelated lightweight conversation. This starts a new topic and the previous task will be accepted automatically.
+- Choose `new_task` when the user asks for clearly unrelated work that needs Task capabilities. This starts a new topic and the previous task will be accepted automatically.
 - Choose `close_task` when the user says the task is satisfactory or finished, such as "可以了", "就这样", or "that's good".
 - Choose `abandon_task` when the user says to stop, cancel, or no longer do the active task.
 
+Do not classify unrelated lightweight conversation as `revise_task` merely because
+the active task is awaiting acceptance. A revision must ask to change or correct
+the active task result.
+
 Examples with an active weather task:
 
 - "再详细一点" -> `revise_task`
 - "加上明后天穿衣建议" -> `revise_task`
 - "顺便查一下深圳" -> `continue_task`
 - "帮我写一个采购合同" -> `new_task`
+- "吃饭没" -> `simple_chat`
+- "我在冰岛" -> `simple_chat`
 - "可以了" -> `close_task`
 - "不用了" -> `abandon_task`
 
diff --git a/app-instance/backend/beaver/tasks/router.py b/app-instance/backend/beaver/tasks/router.py
index 688ad54..4451fab 100644
--- a/app-instance/backend/beaver/tasks/router.py
+++ b/app-instance/backend/beaver/tasks/router.py
@@ -161,6 +161,9 @@ class MainAgentRouter:
             "Critical policy:\n"
             "- If there is an active Task, choose continue_task or revise_task unless the user's topic is completely unrelated "
             "to that Task or the user explicitly closes/abandons it.\n"
+            "- With an active Task, choose simple_chat for unrelated lightweight conversation and new_task for unrelated work "
+            "that needs Task capabilities. Either decision starts a new topic.\n"
+            "- An unrelated lightweight conversation must not be classified as revise_task merely because the active Task is awaiting acceptance.\n"
             "- Choose revise_task when the active Task is awaiting feedback or needs revision and the user asks for changes "
             "such as '改一下', '加上', '删除', '换成', '再详细点', '格式改成', '不要', or equivalent wording.\n"
             "- Choose continue_task for neutral follow-up questions or additional next steps that do not imply dissatisfaction with the previous result.\n"
diff --git a/app-instance/backend/tests/unit/test_external_connector_bridge_api.py b/app-instance/backend/tests/unit/test_external_connector_bridge_api.py
index 91d20c7..83c0ddd 100644
--- a/app-instance/backend/tests/unit/test_external_connector_bridge_api.py
+++ b/app-instance/backend/tests/unit/test_external_connector_bridge_api.py
@@ -34,6 +34,21 @@ def _connected_connection(tmp_path):
     return connection
 
 
+def _connection_with_status(tmp_path, status: str):
+    state_dir = tmp_path / "state" / "channel_connections"
+    store = ChannelConnectionStore(state_dir / "connections.json")
+    connection = store.create(
+        kind="feishu",
+        mode="sidecar",
+        display_name="Feishu Main",
+        account_id="feishu:app-1",
+        owner_user_id=None,
+        auth_type="connector_session",
+    )
+    store.update_status(connection.connection_id, status=status, last_error=None)
+    return connection
+
+
 def _payload(connection, *, event_id: str = "evt-1", delivery_attempt: int = 1) -> dict:
     return {
         "eventId": event_id,
@@ -85,6 +100,77 @@ def test_bridge_endpoint_rejects_invalid_token(tmp_path, monkeypatch) -> None:
         service.close()
 
 
+def test_bridge_endpoint_rejects_connection_identity_mismatch(tmp_path, monkeypatch) -> None:
+    app, service = _app(tmp_path, monkeypatch)
+    try:
+        with TestClient(app) as client:
+            connection = _connected_connection(tmp_path)
+            payload = _payload(connection)
+            payload["channelId"] = "forged-channel"
+            payload["kind"] = "feishu"
+            payload["accountId"] = "feishu:attacker"
+            response = client.post(
+                "/api/channel-connector-bridge/events",
+                headers={"Authorization": "Bearer bridge-token"},
+                json=payload,
+            )
+        assert response.status_code == 403
+        assert "does not match connection" in response.json()["detail"]
+    finally:
+        service.close()
+
+
+def test_bridge_endpoint_rejects_inactive_connection(tmp_path, monkeypatch) -> None:
+    app, service = _app(tmp_path, monkeypatch)
+    try:
+        with TestClient(app) as client:
+            connection = _connection_with_status(tmp_path, "pairing")
+            response = client.post(
+                "/api/channel-connector-bridge/events",
+                headers={"Authorization": "Bearer bridge-token"},
+                json={
+                    **_payload(connection),
+                    "kind": "feishu",
+                    "accountId": "feishu:app-1",
+                },
+            )
+        assert response.status_code == 409
+        assert "not connected" in response.json()["detail"]
+    finally:
+        service.close()
+
+
+def test_bridge_endpoint_rejects_empty_or_oversized_content(tmp_path, monkeypatch) -> None:
+    app, service = _app(tmp_path, monkeypatch)
+    try:
+        with TestClient(app) as client:
+            connection = _connection_with_status(tmp_path, "connected")
+            blank = client.post(
+                "/api/channel-connector-bridge/events",
+                headers={"Authorization": "Bearer bridge-token"},
+                json={
+                    **_payload(connection, event_id="blank"),
+                    "kind": "feishu",
+                    "accountId": "feishu:app-1",
+                    "content": "   ",
+                },
+            )
+            too_long = client.post(
+                "/api/channel-connector-bridge/events",
+                headers={"Authorization": "Bearer bridge-token"},
+                json={
+                    **_payload(connection, event_id="too-long"),
+                    "kind": "feishu",
+                    "accountId": "feishu:app-1",
+                    "content": "x" * 20001,
+                },
+            )
+        assert blank.status_code == 400
+        assert too_long.status_code == 413
+    finally:
+        service.close()
+
+
 def test_bridge_endpoint_dedupes_repeated_event(tmp_path, monkeypatch) -> None:
     app, service = _app(tmp_path, monkeypatch)
     try:
diff --git a/app-instance/backend/tests/unit/test_external_sidecar_connectors.py b/app-instance/backend/tests/unit/test_external_sidecar_connectors.py
index 40ed8a0..40b4248 100644
--- a/app-instance/backend/tests/unit/test_external_sidecar_connectors.py
+++ b/app-instance/backend/tests/unit/test_external_sidecar_connectors.py
@@ -43,6 +43,22 @@ class FakeSidecarClient:
         return {"ok": True}
 
 
+class ImmediateConnectedSidecarClient(FakeSidecarClient):
+    async def start_session(self, payload: dict) -> dict:
+        self.started.append(payload)
+        session = {
+            "sessionId": "cs_connected",
+            "kind": payload["kind"],
+            "status": "connected",
+            "qrImage": None,
+            "accountId": f"{payload['kind']}:me",
+            "displayName": "Connected Account",
+            "metadata": {"stateRef": "state-1", "appSecret": "secret-1", "tenantAccessToken": "token-1"},
+        }
+        self.sessions["cs_connected"] = session
+        return session
+
+
 def test_weixin_connector_starts_connector_session(tmp_path) -> None:
     async def run() -> None:
         connection_store = ChannelConnectionStore(tmp_path / "connections.json")
@@ -67,6 +83,30 @@ def test_weixin_connector_starts_connector_session(tmp_path) -> None:
     asyncio.run(run())
 
 
+def test_feishu_connector_start_session_connected_updates_connection(tmp_path) -> None:
+    async def run() -> None:
+        connection_store = ChannelConnectionStore(tmp_path / "connections.json")
+        credential_store = CredentialStore(tmp_path / "credentials.json")
+        client = ImmediateConnectedSidecarClient()
+        connector = FeishuConnector(
+            connection_store=connection_store,
+            credential_store=credential_store,
+            sidecar_client=client,
+            sidecar_base_url="http://external-connector:8787",
+        )
+
+        view = await connector.start_session(display_name="Feishu Main", owner_user_id=None, options={})
+        connection = connection_store.get(view["connectionId"])
+
+        assert view["status"] == "connected"
+        assert connection.status == "connected"
+        assert connection.account_id == "feishu:me"
+        assert connection.display_name == "Connected Account"
+        assert connection.credentials_ref is not None
+
+    asyncio.run(run())
+
+
 def test_weixin_connector_poll_connected_materializes_external_runtime(tmp_path) -> None:
     async def run() -> None:
         connection_store = ChannelConnectionStore(tmp_path / "connections.json")
@@ -124,6 +164,67 @@ def test_feishu_connector_uses_feishu_kind(tmp_path) -> None:
     asyncio.run(run())
 
 
+def test_feishu_connector_persists_policy_options_in_runtime_config(tmp_path) -> None:
+    async def run() -> None:
+        connection_store = ChannelConnectionStore(tmp_path / "connections.json")
+        credential_store = CredentialStore(tmp_path / "credentials.json")
+        client = FakeSidecarClient()
+        connector = FeishuConnector(
+            connection_store=connection_store,
+            credential_store=credential_store,
+            sidecar_client=client,
+            sidecar_base_url="http://external-connector:8787",
+        )
+
+        await connector.start_session(
+            display_name="Feishu Main",
+            owner_user_id=None,
+            options={
+                "domain": "feishu",
+                "requireMentionInGroups": True,
+                "allowFrom": ["ou_1"],
+                "groupAllowFrom": ["oc_1"],
+                "maxMessageChars": 1234,
+            },
+        )
+        connection = connection_store.list()[0]
+
+        assert client.started[0]["options"]["requireMentionInGroups"] is True
+        assert connection.runtime_config["requireMentionInGroups"] is True
+        assert connection.runtime_config["allowFrom"] == ["ou_1"]
+        assert connection.runtime_config["groupAllowFrom"] == ["oc_1"]
+        assert connection.runtime_config["maxMessageChars"] == 1234
+
+    asyncio.run(run())
+
+
+def test_feishu_connector_materializes_policy_for_external_runtime(tmp_path) -> None:
+    async def run() -> None:
+        connection_store = ChannelConnectionStore(tmp_path / "connections.json")
+        credential_store = CredentialStore(tmp_path / "credentials.json")
+        client = ImmediateConnectedSidecarClient()
+        connector = FeishuConnector(
+            connection_store=connection_store,
+            credential_store=credential_store,
+            sidecar_client=client,
+            sidecar_base_url="http://external-connector:8787",
+        )
+
+        view = await connector.start_session(
+            display_name="Feishu Main",
+            owner_user_id=None,
+            options={"requireMentionInGroups": True, "allowFrom": ["ou_1"], "groupAllowFrom": ["oc_1"]},
+        )
+        spec = await connector.materialize_runtime(view["connectionId"])
+
+        assert spec.config["platformKind"] == "feishu"
+        assert spec.config["requireMentionInGroups"] is True
+        assert spec.config["allowFrom"] == ["ou_1"]
+        assert spec.config["groupAllowFrom"] == ["oc_1"]
+
+    asyncio.run(run())
+
+
 def test_connector_session_api_starts_and_polls_connected_session(tmp_path, monkeypatch) -> None:
     monkeypatch.setenv("EXTERNAL_CONNECTOR_TOKEN", "connector-token")
     config_path = tmp_path / "config.json"
@@ -174,3 +275,44 @@ def test_connector_session_api_starts_and_polls_connected_session(tmp_path, monk
             assert polled.json()["connection"]["channel_id"] in app.state.channel_runtime.adapters
     finally:
         service.close()
+
+
+def test_connector_session_api_activates_immediate_connected_session(tmp_path, monkeypatch) -> None:
+    monkeypatch.setenv("EXTERNAL_CONNECTOR_TOKEN", "connector-token")
+    config_path = tmp_path / "config.json"
+    config_path.write_text(
+        '{"agents": {"defaults": {"workspace": "%s"}}, "providers": {}}' % str(tmp_path),
+        encoding="utf-8",
+    )
+    service = AgentService(config_path=config_path)
+    app = create_app(service=service, manage_service_lifecycle=False)
+    client = ImmediateConnectedSidecarClient()
+
+    try:
+        with TestClient(app) as http:
+            state_dir = tmp_path / "state" / "channel_connections"
+            connection_store = ChannelConnectionStore(state_dir / "connections.json")
+            credential_store = CredentialStore(state_dir / "credentials.json")
+            registry = ChannelConnectorRegistry(connection_store=connection_store, credential_store=credential_store)
+            registry.register(
+                FeishuConnector(
+                    connection_store=connection_store,
+                    credential_store=credential_store,
+                    sidecar_client=client,
+                    sidecar_base_url="http://external-connector:8787",
+                )
+            )
+            app.state.channel_connector_registry = registry
+
+            started = http.post(
+                "/api/channel-connector-sessions",
+                json={"kind": "feishu", "displayName": "Feishu Main", "options": {}},
+            )
+
+            assert started.status_code == 200
+            connection = started.json()["connection"]
+            assert connection["status"] == "connected"
+            assert connection["channel_id"] in app.state.channel_runtime.adapters
+            assert started.json()["session"]["metadata"] == {"stateRef": "state-1"}
+    finally:
+        service.close()
diff --git a/app-instance/backend/tests/unit/test_initial_skill_tool_hints.py b/app-instance/backend/tests/unit/test_initial_skill_tool_hints.py
index 7118893..592f33b 100644
--- a/app-instance/backend/tests/unit/test_initial_skill_tool_hints.py
+++ b/app-instance/backend/tests/unit/test_initial_skill_tool_hints.py
@@ -30,10 +30,14 @@ EXPECTED_INITIAL_SKILL_TOOLS = {
         "mcp_outlook_mcp_calendar_find_meeting_times",
         "mcp_outlook_mcp_calendar_delta_sync",
     ],
-    "skills-admin": ["skills_list", "skill_manage", "skill_view"],
+    "skills-admin": ["skills_list", "skill_view"],
     "terminal-operation": ["terminal", "process", "execute_code"],
     "utility-tools": ["clarify", "delegate", "send_message", "spawn", "todo"],
-    "web-operation": ["web_fetch", "web_search"],
+    "multi-search-engine": ["web_fetch"],
+}
+
+EXPECTED_NON_INITIAL_SKILL_TOOLS = {
+    "skills-authoring-admin": ["skill_manage"],
 }
 
 
@@ -48,6 +52,23 @@ def test_initial_skill_tool_hints_match_runtime_tool_names() -> None:
         assert version["tool_hints"] == expected_tools
 
 
+def test_skill_authoring_admin_is_seeded_but_not_initial() -> None:
+    published = json.loads((REPO_ROOT / "skills" / "_index" / "published.json").read_text(encoding="utf-8"))
+    disabled = json.loads((REPO_ROOT / "skills" / "_index" / "disabled.json").read_text(encoding="utf-8"))
+
+    assert "skills-authoring-admin" not in published["items"]
+    assert "skills-authoring-admin" in disabled["items"]
+
+    for skill_name, expected_tools in EXPECTED_NON_INITIAL_SKILL_TOOLS.items():
+        skill_dir = REPO_ROOT / "skills" / skill_name / "versions" / "v0001"
+        frontmatter, _body = parse_frontmatter((skill_dir / "SKILL.md").read_text(encoding="utf-8"))
+        version = json.loads((skill_dir / "version.json").read_text(encoding="utf-8"))
+
+        assert frontmatter["tools"] == expected_tools
+        assert version["frontmatter"]["tools"] == expected_tools
+        assert version["tool_hints"] == expected_tools
+
+
 def test_default_runtime_registers_skill_view_tool(tmp_path: Path) -> None:
     loaded = EngineLoader(workspace=tmp_path).load()
     try:
diff --git a/app-instance/backend/tests/unit/test_litellm_thinking_mode.py b/app-instance/backend/tests/unit/test_litellm_thinking_mode.py
index f3a547e..1700d87 100644
--- a/app-instance/backend/tests/unit/test_litellm_thinking_mode.py
+++ b/app-instance/backend/tests/unit/test_litellm_thinking_mode.py
@@ -169,6 +169,90 @@ def test_thinking_mode_is_forced_disabled_even_when_requested_enabled(monkeypatc
     }
 
 
+def test_mistral_vllm_uses_reasoning_effort_instead_of_qwen_thinking_body(
+    monkeypatch: pytest.MonkeyPatch,
+) -> None:
+    captured: dict = {}
+
+    class Message:
+        content = "ok"
+        reasoning_content = None
+        tool_calls = []
+
+    class Choice:
+        message = Message()
+        finish_reason = "stop"
+
+    class Response:
+        choices = [Choice()]
+        usage = None
+
+    async def fake_acompletion(**kwargs):
+        captured.update(kwargs)
+        return Response()
+
+    monkeypatch.setattr("beaver.engine.providers.litellm.acompletion", fake_acompletion)
+    monkeypatch.setattr("beaver.engine.providers.litellm.litellm", SimpleNamespace())
+
+    provider = LiteLLMProvider(
+        api_key="EMPTY",
+        api_base="http://localhost:8000/v1",
+        default_model="mistralai/Mistral-Medium-3.5-128B",
+        provider_name="vllm",
+    )
+    asyncio.run(
+        provider.chat(
+            [{"role": "user", "content": "reply ok"}],
+            model="mistralai/Mistral-Medium-3.5-128B",
+            thinking_enabled=True,
+        )
+    )
+
+    assert captured["model"] == "hosted_vllm/mistralai/Mistral-Medium-3.5-128B"
+    assert captured["extra_body"] == {"reasoning_effort": "high"}
+
+
+def test_mistral_vllm_omits_reasoning_body_when_thinking_mode_is_unspecified(
+    monkeypatch: pytest.MonkeyPatch,
+) -> None:
+    captured: dict = {}
+
+    class Message:
+        content = "ok"
+        reasoning_content = None
+        tool_calls = []
+
+    class Choice:
+        message = Message()
+        finish_reason = "stop"
+
+    class Response:
+        choices = [Choice()]
+        usage = None
+
+    async def fake_acompletion(**kwargs):
+        captured.update(kwargs)
+        return Response()
+
+    monkeypatch.setattr("beaver.engine.providers.litellm.acompletion", fake_acompletion)
+    monkeypatch.setattr("beaver.engine.providers.litellm.litellm", SimpleNamespace())
+
+    provider = LiteLLMProvider(
+        api_key="EMPTY",
+        api_base="http://localhost:8000/v1",
+        default_model="mistralai/Mistral-Medium-3.5-128B",
+        provider_name="vllm",
+    )
+    asyncio.run(
+        provider.chat(
+            [{"role": "user", "content": "reply ok"}],
+            model="mistralai/Mistral-Medium-3.5-128B",
+        )
+    )
+
+    assert "extra_body" not in captured
+
+
 def test_litellm_provider_sanitizes_tool_call_arguments(monkeypatch: pytest.MonkeyPatch) -> None:
     captured: dict = {}
 
diff --git a/app-instance/backend/tests/unit/test_main_agent_router.py b/app-instance/backend/tests/unit/test_main_agent_router.py
index 7100a83..cba3703 100644
--- a/app-instance/backend/tests/unit/test_main_agent_router.py
+++ b/app-instance/backend/tests/unit/test_main_agent_router.py
@@ -149,6 +149,22 @@ def test_router_injects_intent_skill_guidance() -> None:
     assert "Weather and current external data" in prompt
 
 
+def test_router_prompt_treats_unrelated_lightweight_conversation_as_new_topic() -> None:
+    provider = RouterProvider('{"action":"simple_chat","reason":"unrelated lightweight conversation"}')
+
+    asyncio.run(
+        MainAgentRouter().classify(
+            "吃饭没",
+            active_task=_task(),
+            provider=provider,
+        )
+    )
+
+    prompt = provider.calls[0]["messages"][1]["content"]
+    assert "unrelated lightweight conversation" in prompt
+    assert "must not be classified as revise_task merely because the active Task is awaiting acceptance" in prompt
+
+
 def test_router_closes_active_task_from_llm_decision() -> None:
     decision = asyncio.run(
         MainAgentRouter().classify(
diff --git a/app-instance/backend/tests/unit/test_task_mode_feedback.py b/app-instance/backend/tests/unit/test_task_mode_feedback.py
index 90b59a2..d15432d 100644
--- a/app-instance/backend/tests/unit/test_task_mode_feedback.py
+++ b/app-instance/backend/tests/unit/test_task_mode_feedback.py
@@ -99,6 +99,191 @@ def test_task_run_records_evidence_and_waits_for_acceptance(tmp_path: Path) -> N
     assert "validated" not in event_types
 
 
+def test_unrelated_simple_chat_auto_accepts_active_task(tmp_path: Path) -> None:
+    service = AgentService(
+        loader=EngineLoader(
+            workspace=tmp_path,
+            task_execution_planner=StubTaskExecutionPlanner(),
+        )
+    )
+    first = asyncio.run(
+        service.process_direct(
+            "recommend food in Hengqin",
+            session_id="web:new-topic-chat",
+            provider_bundle=_bundle("Food recommendations"),
+        )
+    )
+
+    second = asyncio.run(
+        service.process_direct(
+            "have you eaten?",
+            session_id="web:new-topic-chat",
+            provider_bundle=_bundle("I do not eat.", route_action="simple_chat"),
+        )
+    )
+
+    task_service = service.create_loop().boot().task_service
+    assert task_service is not None
+    previous = task_service.get_task(first.task_id or "")
+    assert previous is not None
+    assert previous.status == "closed"
+    assert previous.run_ids == [first.run_id]
+    assert previous.feedback[-1]["acceptance_type"] == "accept"
+    assert previous.metadata["final_accepted_run_id"] == first.run_id
+    assert second.task_id is None
+
+
+def test_unrelated_new_task_auto_accepts_previous_task(tmp_path: Path) -> None:
+    service = AgentService(
+        loader=EngineLoader(
+            workspace=tmp_path,
+            task_execution_planner=StubTaskExecutionPlanner(),
+        )
+    )
+    first = asyncio.run(
+        service.process_direct(
+            "recommend food in Hengqin",
+            session_id="web:new-topic-task",
+            provider_bundle=_bundle("Food recommendations"),
+        )
+    )
+
+    second = asyncio.run(
+        service.process_direct(
+            "check today's weather in Iceland",
+            session_id="web:new-topic-task",
+            provider_bundle=_bundle("Weather result", route_action="new_task"),
+        )
+    )
+
+    task_service = service.create_loop().boot().task_service
+    assert task_service is not None
+    previous = task_service.get_task(first.task_id or "")
+    current = task_service.get_task(second.task_id or "")
+    assert previous is not None
+    assert current is not None
+    assert previous.status == "closed"
+    assert previous.run_ids == [first.run_id]
+    assert previous.feedback[-1]["acceptance_type"] == "accept"
+    assert current.task_id != previous.task_id
+    assert current.status == "awaiting_acceptance"
+    assert current.run_ids == [second.run_id]
+
+
+def test_related_follow_up_continues_active_task_without_accepting_it(tmp_path: Path) -> None:
+    service = AgentService(
+        loader=EngineLoader(
+            workspace=tmp_path,
+            task_execution_planner=StubTaskExecutionPlanner(),
+        )
+    )
+    first = asyncio.run(
+        service.process_direct(
+            "recommend food in Hengqin",
+            session_id="web:continue-topic",
+            provider_bundle=_bundle("Food recommendations"),
+        )
+    )
+
+    second = asyncio.run(
+        service.process_direct(
+            "include restaurants near the port",
+            session_id="web:continue-topic",
+            provider_bundle=_bundle("More recommendations", route_action="continue_task"),
+        )
+    )
+
+    task_service = service.create_loop().boot().task_service
+    assert task_service is not None
+    task = task_service.get_task(first.task_id or "")
+    assert task is not None
+    assert second.task_id == first.task_id
+    assert task.status == "awaiting_acceptance"
+    assert task.run_ids == [first.run_id, second.run_id]
+    assert task.feedback == []
+
+
+def test_requested_revision_keeps_active_task_without_accepting_it(tmp_path: Path) -> None:
+    service = AgentService(
+        loader=EngineLoader(
+            workspace=tmp_path,
+            task_execution_planner=StubTaskExecutionPlanner(),
+        )
+    )
+    first = asyncio.run(
+        service.process_direct(
+            "recommend food in Hengqin",
+            session_id="web:revise-topic",
+            provider_bundle=_bundle("Food recommendations"),
+        )
+    )
+
+    second = asyncio.run(
+        service.process_direct(
+            "remove expensive restaurants",
+            session_id="web:revise-topic",
+            provider_bundle=_bundle("Revised recommendations", route_action="revise_task"),
+        )
+    )
+
+    task_service = service.create_loop().boot().task_service
+    assert task_service is not None
+    task = task_service.get_task(first.task_id or "")
+    assert task is not None
+    assert second.task_id == first.task_id
+    assert task.status == "awaiting_acceptance"
+    assert task.run_ids == [first.run_id, second.run_id]
+    assert [item["acceptance_type"] for item in task.feedback] == ["revise"]
+
+
+def test_router_failure_fallback_does_not_auto_accept_active_task(tmp_path: Path) -> None:
+    service = AgentService(
+        loader=EngineLoader(
+            workspace=tmp_path,
+            task_execution_planner=StubTaskExecutionPlanner(),
+        )
+    )
+    first = asyncio.run(
+        service.process_direct(
+            "recommend food in Hengqin",
+            session_id="web:router-fallback",
+            provider_bundle=_bundle("Food recommendations"),
+        )
+    )
+    fallback_bundle = ProviderBundle(
+        main_runtime=SimpleNamespace(model="stub-model", provider_name="stub"),
+        main_provider=StubProvider(
+            [
+                LLMResponse(
+                    content="Continued response",
+                    finish_reason="stop",
+                    provider_name="stub",
+                    model="stub-model",
+                )
+            ]
+        ),
+        auxiliary_runtime=SimpleNamespace(model="stub-model", provider_name="stub"),
+        auxiliary_provider=StubProvider([]),
+    )
+
+    second = asyncio.run(
+        service.process_direct(
+            "continue after router failure",
+            session_id="web:router-fallback",
+            provider_bundle=fallback_bundle,
+        )
+    )
+
+    task_service = service.create_loop().boot().task_service
+    assert task_service is not None
+    task = task_service.get_task(first.task_id or "")
+    assert task is not None
+    assert second.task_id == first.task_id
+    assert task.status == "awaiting_acceptance"
+    assert task.run_ids == [first.run_id, second.run_id]
+    assert task.feedback == []
+
+
 def test_acceptance_closes_task_and_triggers_learning(tmp_path: Path) -> None:
     service = AgentService(
         loader=EngineLoader(
diff --git a/app-instance/create-instance.sh b/app-instance/create-instance.sh
index c500093..0bba41c 100755
--- a/app-instance/create-instance.sh
+++ b/app-instance/create-instance.sh
@@ -19,6 +19,9 @@ AUTHZ_INTERNAL_TOKEN=""
 AUTHZ_OUTLOOK_MCP_URL=""
 OUTLOOK_MCP_SERVER_ID="${OUTLOOK_MCP_SERVER_ID:-outlook_mcp}"
 USER_FILES_MAX_UPLOAD_BYTES="${USER_FILES_MAX_UPLOAD_BYTES:-}"
+EXTERNAL_CONNECTOR_BASE_URL="${EXTERNAL_CONNECTOR_BASE_URL:-http://external-connector:8787}"
+EXTERNAL_CONNECTOR_TOKEN="${EXTERNAL_CONNECTOR_TOKEN:-}"
+BEAVER_BRIDGE_TOKEN="${BEAVER_BRIDGE_TOKEN:-}"
 BACKEND_ID=""
 CLIENT_ID=""
 CLIENT_SECRET=""
@@ -40,6 +43,7 @@ REGISTRY_PATH="${REGISTRY_PATH:-$REGISTRY_PATH_DEFAULT}"
 NETWORK_NAME="${NETWORK_NAME:-}"
 HOST_BIND_IP="${HOST_BIND_IP:-127.0.0.1}"
 INITIAL_SKILLS_DIR="${INITIAL_SKILLS_DIR:-${SCRIPT_DIR}/../skills}"
+INITIAL_SKILLS_EXCLUDE="${INITIAL_SKILLS_EXCLUDE:-officebench-mcp}"
 SEED_INITIAL_SKILLS=1
 FORCE_BUILD=0
 REPLACE=0
@@ -73,6 +77,11 @@ Optional:
                               Default Outlook MCP server id. Default: outlook_mcp
   --user-files-max-upload-bytes <bytes>
                               Optional max upload size for the user file system.
+  --external-connector-base-url <url>
+                              External connector sidecar URL. Default: http://external-connector:8787
+  --external-connector-token <token>
+                              Service token used for Beaver-to-sidecar requests.
+  --bridge-token <token>      Service token accepted from the connector bridge.
   --backend-id <id>           Pre-assigned backend id.
   --client-id <id>            Pre-assigned AuthZ client id.
   --client-secret <secret>    Pre-assigned AuthZ client secret.
@@ -299,6 +308,15 @@ data = {
                 "textBatchDelaySeconds": 0.5,
             },
         },
+        "terminal-dev": {
+            "enabled": True,
+            "kind": "terminal",
+            "mode": "websocket",
+            "accountId": "local",
+            "displayName": "Terminal Dev",
+            "config": {},
+            "secrets": {},
+        },
     },
 }
 
@@ -344,7 +362,7 @@ seed_initial_skills() {
   fi
 
   mkdir -p "$target_dir"
-  INITIAL_SKILLS_DIR="$initial_skills_dir" TARGET_DIR="$target_dir" python3 - <<'PY'
+  INITIAL_SKILLS_DIR="$initial_skills_dir" TARGET_DIR="$target_dir" INITIAL_SKILLS_EXCLUDE="$INITIAL_SKILLS_EXCLUDE" python3 - <<'PY'
 import json
 import shutil
 import os
@@ -352,10 +370,13 @@ from pathlib import Path
 
 initial = Path(os.environ["INITIAL_SKILLS_DIR"]).resolve()
 target = Path(os.environ["TARGET_DIR"]).resolve()
+excluded = {item.strip() for item in os.environ.get("INITIAL_SKILLS_EXCLUDE", "").split(",") if item.strip()}
 
 for child in sorted(initial.iterdir()):
     if child.name.startswith("."):
         continue
+    if child.name in excluded:
+        continue
     destination = target / child.name
     if destination.exists():
         continue
@@ -383,6 +404,8 @@ for index_name in ("published", "disabled"):
     merged = []
     for item in [*target_items, *initial_items]:
         text = str(item).strip()
+        if text in excluded:
+            continue
         if text and text not in merged:
             merged.append(text)
     target_index.parent.mkdir(parents=True, exist_ok=True)
@@ -534,6 +557,18 @@ while [[ $# -gt 0 ]]; do
       USER_FILES_MAX_UPLOAD_BYTES="${2:-}"
       shift 2
       ;;
+    --external-connector-base-url)
+      EXTERNAL_CONNECTOR_BASE_URL="${2:-}"
+      shift 2
+      ;;
+    --external-connector-token)
+      EXTERNAL_CONNECTOR_TOKEN="${2:-}"
+      shift 2
+      ;;
+    --bridge-token)
+      BEAVER_BRIDGE_TOKEN="${2:-}"
+      shift 2
+      ;;
     --backend-id)
       BACKEND_ID="${2:-}"
       shift 2
@@ -643,6 +678,16 @@ if [[ "$SKIP_PROVIDER_CONFIG" -ne 1 ]]; then
   esac
 fi
 
+if [[ -n "$INITIAL_SKILLS_DIR" ]]; then
+  INITIAL_SKILLS_DIR="$(INITIAL_SKILLS_DIR="$INITIAL_SKILLS_DIR" python3 - <<'PY'
+import os
+from pathlib import Path
+
+print(Path(os.environ["INITIAL_SKILLS_DIR"]).expanduser().resolve())
+PY
+)"
+fi
+
 if [[ -n "$BACKEND_ID$CLIENT_ID$CLIENT_SECRET" ]]; then
   [[ -n "$BACKEND_ID" && -n "$CLIENT_ID" && -n "$CLIENT_SECRET" ]] || die "backend identity requires --backend-id, --client-id and --client-secret together"
 fi
@@ -721,14 +766,29 @@ RUN_ARGS=(
   -e "APP_BACKEND_PORT=18080"
   -e "BEAVER_ENABLE_SELF_RESTART=1"
   -e "BEAVER_OUTLOOK_MCP_SERVER_ID=${OUTLOOK_MCP_SERVER_ID}"
+  -e "EXTERNAL_CONNECTOR_BASE_URL=${EXTERNAL_CONNECTOR_BASE_URL}"
   --label "beaver.instance.id=${INSTANCE_ID}"
   --label "beaver.instance.slug=${INSTANCE_SLUG}"
   --label "beaver.instance.public_url=${PUBLIC_URL}"
 )
 
+if [[ "$SEED_INITIAL_SKILLS" -eq 1 && -n "$INITIAL_SKILLS_DIR" ]]; then
+  RUN_ARGS+=(
+    -v "${INITIAL_SKILLS_DIR}:/opt/app/initial-skills:ro"
+    -e "BEAVER_INITIAL_SKILLS_DIR=/opt/app/initial-skills"
+    -e "BEAVER_INITIAL_SKILLS_EXCLUDE=${INITIAL_SKILLS_EXCLUDE}"
+  )
+fi
+
 if [[ -n "$USER_FILES_MAX_UPLOAD_BYTES" ]]; then
   RUN_ARGS+=(-e "BEAVER_USER_FILES_MAX_UPLOAD_BYTES=${USER_FILES_MAX_UPLOAD_BYTES}")
 fi
+if [[ -n "$EXTERNAL_CONNECTOR_TOKEN" ]]; then
+  RUN_ARGS+=(-e "EXTERNAL_CONNECTOR_TOKEN=${EXTERNAL_CONNECTOR_TOKEN}")
+fi
+if [[ -n "$BEAVER_BRIDGE_TOKEN" ]]; then
+  RUN_ARGS+=(-e "BEAVER_BRIDGE_TOKEN=${BEAVER_BRIDGE_TOKEN}")
+fi
 
 if [[ -n "$NETWORK_NAME" ]]; then
   RUN_ARGS+=(--network "$NETWORK_NAME")
diff --git a/app-instance/entrypoint.sh b/app-instance/entrypoint.sh
index ad5e876..17a31c6 100755
--- a/app-instance/entrypoint.sh
+++ b/app-instance/entrypoint.sh
@@ -12,6 +12,8 @@ BEAVER_CONFIG_PATH="${BEAVER_CONFIG_PATH:-$BEAVER_HOME/config.json}"
 BEAVER_WORKSPACE="${BEAVER_WORKSPACE:-$BEAVER_HOME/workspace}"
 BEAVER_AUTH_FILE="${BEAVER_AUTH_FILE:-$BEAVER_HOME/web_auth_users.json}"
 BEAVER_RUNTIME_ENV_FILE="${BEAVER_RUNTIME_ENV_FILE:-$BEAVER_HOME/runtime.env}"
+BEAVER_INITIAL_SKILLS_DIR="${BEAVER_INITIAL_SKILLS_DIR:-/opt/app/initial-skills}"
+BEAVER_INITIAL_SKILLS_EXCLUDE="${BEAVER_INITIAL_SKILLS_EXCLUDE:-officebench-mcp}"
 
 log() {
   printf '[app-instance] %s\n' "$*"
@@ -26,6 +28,68 @@ require_file() {
   fi
 }
 
+seed_initial_skills() {
+  local initial_skills_dir="$1"
+  local target_dir="$2"
+
+  if [[ ! -d "$initial_skills_dir" ]]; then
+    return
+  fi
+  if [[ ! -f "$initial_skills_dir/_index/published.json" ]]; then
+    log "initial skills source has no published index, skipping: ${initial_skills_dir}"
+    return
+  fi
+
+  mkdir -p "$target_dir"
+  INITIAL_SKILLS_DIR="$initial_skills_dir" TARGET_DIR="$target_dir" INITIAL_SKILLS_EXCLUDE="$BEAVER_INITIAL_SKILLS_EXCLUDE" python - <<'PY'
+import json
+import os
+import shutil
+from pathlib import Path
+
+initial = Path(os.environ["INITIAL_SKILLS_DIR"]).resolve()
+target = Path(os.environ["TARGET_DIR"]).resolve()
+excluded = {item.strip() for item in os.environ.get("INITIAL_SKILLS_EXCLUDE", "").split(",") if item.strip()}
+
+for child in sorted(initial.iterdir()):
+    if child.name.startswith(".") or child.name in excluded:
+        continue
+    destination = target / child.name
+    if destination.exists():
+        continue
+    if child.is_dir():
+        shutil.copytree(child, destination)
+    elif child.is_file():
+        shutil.copy2(child, destination)
+
+for index_name in ("published", "disabled"):
+    initial_index = initial / "_index" / f"{index_name}.json"
+    target_index = target / "_index" / f"{index_name}.json"
+    if not initial_index.exists():
+        continue
+    try:
+        initial_items = json.loads(initial_index.read_text(encoding="utf-8")).get("items", [])
+    except json.JSONDecodeError:
+        initial_items = []
+    if target_index.exists():
+        try:
+            target_items = json.loads(target_index.read_text(encoding="utf-8")).get("items", [])
+        except json.JSONDecodeError:
+            target_items = []
+    else:
+        target_items = []
+    merged = []
+    for item in [*target_items, *initial_items]:
+        text = str(item).strip()
+        if text in excluded:
+            continue
+        if text and text not in merged:
+            merged.append(text)
+    target_index.parent.mkdir(parents=True, exist_ok=True)
+    target_index.write_text(json.dumps({"items": merged}, indent=2, ensure_ascii=False) + "\n", encoding="utf-8")
+PY
+}
+
 cleanup() {
   local status=$?
 
@@ -54,12 +118,15 @@ if [[ -f "$BEAVER_RUNTIME_ENV_FILE" ]]; then
 fi
 
 require_file "$BEAVER_CONFIG_PATH" "Missing Beaver config"
+seed_initial_skills "$BEAVER_INITIAL_SKILLS_DIR" "$BEAVER_WORKSPACE/skills"
 
 export BEAVER_AUTH_FILE
 export BEAVER_RUNTIME_ENV_FILE
 export BEAVER_HOME
 export BEAVER_CONFIG_PATH
 export BEAVER_WORKSPACE
+export BEAVER_INITIAL_SKILLS_DIR
+export BEAVER_INITIAL_SKILLS_EXCLUDE
 export PORT="$APP_FRONTEND_PORT"
 export HOSTNAME="127.0.0.1"
 export PYTHONFAULTHANDLER="${PYTHONFAULTHANDLER:-1}"
diff --git a/app-instance/frontend/app/(app)/files/page.tsx b/app-instance/frontend/app/(app)/files/page.tsx
index 70e91d3..126808e 100644
--- a/app-instance/frontend/app/(app)/files/page.tsx
+++ b/app-instance/frontend/app/(app)/files/page.tsx
@@ -34,6 +34,7 @@ import { Button } from '@/components/ui/button';
 import { ScrollArea } from '@/components/ui/scroll-area';
 import { type AppLocale, pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
+import { containedLongTextClass, containedPreservedLongTextClass } from '@/lib/text-wrapping';
 
 const LOAD_RETRY_DELAYS_MS = [0, 600, 1200];
 
@@ -126,8 +127,8 @@ export default function FilesPage() {
       if (selectedFile?.path === item.path) {
         setSelectedFile(null);
       }
-    } catch {
-      // ignore
+    } catch (err: any) {
+      setLoadError(err.message || pickAppText(locale, '删除失败', 'Delete failed'));
     }
   };
 
@@ -147,8 +148,8 @@ export default function FilesPage() {
       a.click();
       a.remove();
       URL.revokeObjectURL(a.href);
-    } catch {
-      // ignore
+    } catch (err: any) {
+      setPreviewError(err.message || pickAppText(locale, '下载失败', 'Download failed'));
     }
   };
 
@@ -160,13 +161,13 @@ export default function FilesPage() {
     setUploadProgress(0);
     try {
       for (let i = 0; i < files.length; i++) {
-        await uploadUserFile(files[i], currentPath || 'uploads', (pct) => {
+        await uploadUserFile(files[i], currentPath, (pct) => {
           setUploadProgress(Math.round((i / files.length) * 100 + pct / files.length));
         });
       }
       await load();
-    } catch {
-      // ignore
+    } catch (err: any) {
+      setLoadError(err.message || pickAppText(locale, '上传失败', 'Upload failed'));
     } finally {
       setUploading(false);
       setUploadProgress(0);
@@ -183,8 +184,8 @@ export default function FilesPage() {
       setShowMkdir(false);
       setNewDirName('');
       await load();
-    } catch {
-      // ignore
+    } catch (err: any) {
+      setLoadError(err.message || pickAppText(locale, '创建文件夹失败', 'Failed to create folder'));
     }
   };
 
@@ -213,16 +214,17 @@ export default function FilesPage() {
   };
 
   return (
-    <div className="mx-auto max-w-7xl p-6">
+    <div className="mx-auto w-full max-w-7xl overflow-x-hidden px-4 py-6 sm:px-6">
       {/* Header */}
-      <div className="flex items-center justify-between mb-4">
+      <div className="mb-4 flex flex-wrap items-center justify-between gap-3">
         <h1 className="text-2xl font-bold">{pickAppText(locale, '文件管理', 'Files')}</h1>
-        <div className="flex items-center gap-2">
+        <div className="flex flex-wrap items-center gap-2">
           <Button
             variant="outline"
             size="sm"
+            className="h-11"
             onClick={() => setShowMkdir(true)}
-            disabled={loading || !currentPath}
+            disabled={loading}
           >
             <FolderPlus className="w-4 h-4 mr-1" />
             {pickAppText(locale, '新建文件夹', 'New folder')}
@@ -230,8 +232,9 @@ export default function FilesPage() {
           <Button
             variant="outline"
             size="sm"
+            className="h-11"
             onClick={() => fileInputRef.current?.click()}
-            disabled={uploading || !currentPath}
+            disabled={uploading}
           >
             {uploading ? (
               <>
@@ -252,7 +255,15 @@ export default function FilesPage() {
             className="hidden"
             onChange={handleUpload}
           />
-          <Button variant="outline" size="sm" onClick={() => load()} disabled={loading}>
+          <Button
+            variant="outline"
+            size="icon"
+            className="h-11 w-11"
+            onClick={() => load()}
+            disabled={loading}
+            aria-label={pickAppText(locale, '刷新', 'Refresh')}
+            title={pickAppText(locale, '刷新', 'Refresh')}
+          >
             {loading ? (
               <Loader2 className="w-4 h-4 animate-spin" />
             ) : (
@@ -266,7 +277,7 @@ export default function FilesPage() {
       <div className="flex items-center gap-1 mb-4 text-sm text-muted-foreground flex-wrap">
         <button
           onClick={() => navigateTo('')}
-          className="flex items-center gap-1 hover:text-foreground transition-colors px-1.5 py-0.5 rounded hover:bg-accent"
+          className="inline-flex h-11 items-center gap-1 rounded px-2 transition-colors hover:bg-accent hover:text-foreground"
         >
           <Home className="w-3.5 h-3.5" />
           {pickAppText(locale, '文件', 'Files')}
@@ -279,7 +290,7 @@ export default function FilesPage() {
               <ChevronRight className="w-3 h-3 flex-shrink-0" />
               <button
                 onClick={() => navigateTo(path)}
-                className={`px-1.5 py-0.5 rounded transition-colors ${
+                className={`inline-flex h-11 items-center rounded px-2 text-left transition-colors ${containedLongTextClass} ${
                   isLast
                     ? 'text-foreground font-medium'
                     : 'hover:text-foreground hover:bg-accent'
@@ -294,9 +305,13 @@ export default function FilesPage() {
 
       {/* New directory input */}
       {showMkdir && (
-        <div className="flex items-center gap-2 mb-4">
+        <div className="mb-4 flex flex-wrap items-center gap-2">
           <Folder className="w-4 h-4 text-muted-foreground" />
+          <label htmlFor="new-folder-name" className="sr-only">
+            {pickAppText(locale, '文件夹名称', 'Folder name')}
+          </label>
           <input
+            id="new-folder-name"
             ref={mkdirInputRef}
             type="text"
             value={newDirName}
@@ -309,15 +324,16 @@ export default function FilesPage() {
               }
             }}
             placeholder={pickAppText(locale, '文件夹名称', 'Folder name')}
-            className="flex-1 px-3 py-1.5 text-sm border border-border rounded-md bg-background focus:outline-none focus:ring-1 focus:ring-ring"
+            className="h-11 min-w-0 flex-1 rounded-md border border-border bg-background px-3 text-sm focus:outline-none focus:ring-1 focus:ring-ring"
             autoFocus
           />
-          <Button size="sm" onClick={handleCreateDir}>
+          <Button size="sm" className="h-11" onClick={handleCreateDir}>
             {pickAppText(locale, '创建', 'Create')}
           </Button>
           <Button
             size="sm"
             variant="ghost"
+            className="h-11"
             onClick={() => {
               setShowMkdir(false);
               setNewDirName('');
@@ -328,9 +344,9 @@ export default function FilesPage() {
         </div>
       )}
 
-      <div className="grid gap-4 lg:grid-cols-[minmax(360px,440px)_minmax(0,1fr)]">
+      <div className="grid min-w-0 grid-cols-[minmax(0,1fr)] gap-4 lg:grid-cols-[minmax(360px,440px)_minmax(0,1fr)]">
         {/* File list */}
-        <div className="min-h-[520px] rounded-lg border border-border bg-card">
+        <div className="min-w-0 rounded-lg border border-border bg-card lg:min-h-[520px]">
           {loading && items.length === 0 ? (
             <div className="flex items-center justify-center py-20 text-muted-foreground">
               <Loader2 className="w-6 h-6 animate-spin" />
@@ -340,7 +356,7 @@ export default function FilesPage() {
               <FolderOpen className="w-12 h-12 mb-4 opacity-50" />
               <p className="text-lg font-medium">{pickAppText(locale, '加载失败', 'Failed to load')}</p>
               <p className="max-w-sm text-center text-sm">{loadError}</p>
-              <Button className="mt-4" variant="outline" size="sm" onClick={() => load()}>
+              <Button className="mt-4 h-11" variant="outline" size="sm" onClick={() => load()}>
                 <RefreshCw className="mr-1 h-4 w-4" />
                 {pickAppText(locale, '重试', 'Retry')}
               </Button>
@@ -349,90 +365,80 @@ export default function FilesPage() {
             <div className="flex flex-col items-center justify-center py-20 text-muted-foreground">
               <FolderOpen className="w-12 h-12 mb-4 opacity-50" />
               <p className="text-lg font-medium">{pickAppText(locale, '空文件夹', 'Empty folder')}</p>
-              <p className="text-sm">{pickAppText(locale, '点击上方"上传"或"新建文件夹"按钮开始使用', 'Use "Upload" or "New folder" above to get started')}</p>
+              <p className="px-4 text-center text-sm">{pickAppText(locale, '点击上方"上传"或"新建文件夹"按钮开始使用', 'Use "Upload" or "New folder" above to get started')}</p>
             </div>
           ) : (
-            <ScrollArea className="h-[calc(100vh-15rem)] min-h-[520px]">
+            <ScrollArea className="max-h-[calc(100vh-15rem)] min-h-[360px] lg:min-h-[520px]">
               <div className="space-y-1 p-2">
                 {items.map((item) => (
-                  <button
+                  <div
                     key={item.path}
-                    type="button"
-                    className={`group flex w-full items-center gap-3 rounded-lg border px-3 py-2.5 text-left transition-colors hover:bg-accent/30 ${
+                    className={`group flex min-w-0 flex-col gap-2 rounded-lg border p-2 text-left transition-colors hover:bg-accent/30 sm:flex-row sm:items-center ${
                       selectedFile?.path === item.path ? 'border-primary bg-accent/40' : 'border-border bg-card'
                     }`}
-                    onClick={() => {
-                      if (item.type === 'directory') {
-                        navigateTo(item.path);
-                      } else {
-                        void openFile(item);
-                      }
-                    }}
                   >
-                    <div className="flex-shrink-0">
-                      {item.type === 'directory' ? (
-                        <Folder className="w-5 h-5 text-blue-500" />
-                      ) : (
-                        <FileIcon name={item.name} contentType={item.content_type || undefined} />
-                      )}
-                    </div>
-
-                    <div className="min-w-0 flex-1">
-                      <div className="truncate text-sm font-medium">{item.name}</div>
-                      <p className="text-xs text-muted-foreground">
-                        {item.type === 'file' && formatSize(item.size)}
-                        {item.modified && (
-                          <>
-                            {item.type === 'file' && ' · '}
-                            {formatDate(item.modified)}
-                          </>
+                    <button
+                      type="button"
+                      className="flex min-h-[3.5rem] min-w-0 flex-1 items-center gap-3 rounded-md px-1 py-2 text-left"
+                      onClick={() => {
+                        if (item.type === 'directory') {
+                          navigateTo(item.path);
+                        } else {
+                          void openFile(item);
+                        }
+                      }}
+                    >
+                      <div className="flex-shrink-0">
+                        {item.type === 'directory' ? (
+                          <Folder className="w-5 h-5 text-blue-500" />
+                        ) : (
+                          <FileIcon name={item.name} contentType={item.content_type || undefined} />
                         )}
-                      </p>
-                    </div>
+                      </div>
 
-                    <div className="flex items-center gap-1 opacity-0 transition-opacity group-hover:opacity-100">
+                      <div className="min-w-0 flex-1">
+                        <div className={`text-sm font-medium ${containedLongTextClass}`}>{item.name}</div>
+                        <p className={`text-xs text-muted-foreground ${containedLongTextClass}`}>
+                          {item.type === 'file' && formatSize(item.size)}
+                          {item.modified && (
+                            <>
+                              {item.type === 'file' && ' · '}
+                              {formatDate(item.modified)}
+                            </>
+                          )}
+                        </p>
+                      </div>
+                    </button>
+
+                    <div className="flex shrink-0 items-center justify-end gap-1 opacity-100 md:opacity-0 md:transition-opacity md:group-hover:opacity-100">
                       {item.type === 'file' && (
-                        <span
-                          role="button"
-                          tabIndex={0}
-                          className="inline-flex h-7 w-7 items-center justify-center rounded-md hover:bg-accent"
+                        <button
+                          type="button"
+                          className="inline-flex h-11 w-11 items-center justify-center rounded-md hover:bg-accent"
                           onClick={(event) => {
                             event.stopPropagation();
                             void handleDownload(item);
                           }}
-                          onKeyDown={(event) => {
-                            if (event.key === 'Enter' || event.key === ' ') {
-                              event.preventDefault();
-                              event.stopPropagation();
-                              void handleDownload(item);
-                            }
-                          }}
+                          aria-label={`${pickAppText(locale, '下载', 'Download')} ${item.name}`}
                           title={pickAppText(locale, '下载', 'Download')}
                         >
                           <Download className="w-4 h-4" />
-                        </span>
+                        </button>
                       )}
-                      <span
-                        role="button"
-                        tabIndex={0}
-                        className="inline-flex h-7 w-7 items-center justify-center rounded-md text-destructive hover:bg-accent hover:text-destructive"
+                      <button
+                        type="button"
+                        className="inline-flex h-11 w-11 items-center justify-center rounded-md text-destructive hover:bg-accent hover:text-destructive"
                         onClick={(event) => {
                           event.stopPropagation();
                           void handleDelete(item);
                         }}
-                        onKeyDown={(event) => {
-                          if (event.key === 'Enter' || event.key === ' ') {
-                            event.preventDefault();
-                            event.stopPropagation();
-                            void handleDelete(item);
-                          }
-                        }}
+                        aria-label={`${pickAppText(locale, '删除', 'Delete')} ${item.name}`}
                         title={pickAppText(locale, '删除', 'Delete')}
                       >
                         <Trash2 className="w-4 h-4" />
-                      </span>
+                      </button>
                     </div>
-                  </button>
+                  </div>
                 ))}
               </div>
             </ScrollArea>
@@ -471,7 +477,7 @@ function FilePreviewPanel({
   locale: AppLocale;
 }) {
   return (
-    <div className="min-h-[520px] rounded-lg border border-border bg-card p-4">
+    <div className="min-w-0 rounded-lg border border-border bg-card p-4 lg:min-h-[520px]">
       {loading ? (
         <div className="flex h-[420px] items-center justify-center text-muted-foreground">
           <Loader2 className="h-6 w-6 animate-spin" />
@@ -485,16 +491,16 @@ function FilePreviewPanel({
         </div>
       ) : (
         <div className="space-y-3">
-          <div className="flex flex-wrap items-start justify-between gap-3 border-b border-border pb-3">
+          <div className="flex min-w-0 flex-wrap items-start justify-between gap-3 border-b border-border pb-3">
             <div className="min-w-0">
-              <h2 className="break-all text-base font-semibold">{file.name}</h2>
-              <p className="mt-1 text-xs text-muted-foreground">
+              <h2 className={`text-base font-semibold ${containedLongTextClass}`}>{file.name}</h2>
+              <p className={`mt-1 text-xs text-muted-foreground ${containedLongTextClass}`}>
                 {formatSize(file.size)} · {formatDate(file.modified)} · {file.content_type}
                 {file.is_truncated ? ` · ${pickAppText(locale, '仅预览前 1MB', 'Showing first 1MB')}` : ''}
               </p>
             </div>
             {downloadUrl && (
-              <Button variant="outline" size="sm" asChild>
+              <Button variant="outline" size="sm" className="h-11" asChild>
                 <a href={downloadUrl}>
                   <Download className="mr-2 h-4 w-4" />
                   {pickAppText(locale, '下载', 'Download')}
@@ -514,11 +520,11 @@ function FilePreviewPanel({
               <p className="text-sm font-medium">{pickAppText(locale, '该文件不能直接预览', 'This file cannot be previewed')}</p>
             </div>
           ) : isMarkdown(file) ? (
-            <div className="prose prose-sm max-h-[620px] max-w-none overflow-auto text-black prose-a:text-black prose-code:text-black prose-headings:text-black prose-li:text-black prose-p:text-black prose-pre:bg-muted prose-pre:text-black prose-strong:text-black [&>*:first-child]:mt-0 [&>*:last-child]:mb-0">
+            <div className={`prose prose-sm max-h-[620px] max-w-none overflow-auto text-black prose-a:text-black prose-code:text-black prose-headings:text-black prose-li:text-black prose-p:text-black prose-pre:bg-muted prose-pre:text-black prose-strong:text-black [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 [&_*]:min-w-0 ${containedLongTextClass}`}>
               <ReactMarkdown remarkPlugins={[remarkGfm]}>{file.content || ''}</ReactMarkdown>
             </div>
           ) : (
-            <pre className="max-h-[620px] overflow-auto whitespace-pre-wrap rounded-md border border-border bg-background p-4 text-xs leading-5 text-black">
+            <pre className={`max-h-[620px] overflow-auto rounded-md border border-border bg-background p-4 text-xs leading-5 text-black ${containedPreservedLongTextClass}`}>
               {file.content || ''}
             </pre>
           )}
diff --git a/app-instance/frontend/app/(app)/marketplace/page.tsx b/app-instance/frontend/app/(app)/marketplace/page.tsx
index 2ef4949..32ec326 100644
--- a/app-instance/frontend/app/(app)/marketplace/page.tsx
+++ b/app-instance/frontend/app/(app)/marketplace/page.tsx
@@ -168,10 +168,18 @@ export default function MarketplacePage() {
   const totalPages = useMemo(() => Math.max(1, Math.ceil(total / 12)), [total]);
 
   return (
-    <div className="mx-auto max-w-7xl p-6">
-      <div className="mx-auto mb-10 max-w-4xl">
+    <div className="mx-auto max-w-7xl space-y-6 p-4 sm:p-6">
+      <div className="mx-auto max-w-4xl space-y-5">
+        <div className="text-center">
+          <h1 className="text-2xl font-bold tracking-normal sm:text-3xl">
+            {t('市场', 'Marketplace')}
+          </h1>
+          <p className="mt-2 text-sm leading-6 text-muted-foreground">
+            {t('搜索、查看并安装 SkillHub 技能。', 'Search, inspect, and install SkillHub skills.')}
+          </p>
+        </div>
         <form
-          className="flex gap-3"
+          className="flex flex-col gap-3 sm:flex-row"
           onSubmit={(event) => {
             event.preventDefault();
             setPage(0);
@@ -187,7 +195,7 @@ export default function MarketplacePage() {
               className="h-14 rounded-2xl pl-12 text-base"
             />
           </div>
-          <Button type="submit" className="h-14 rounded-2xl px-10 text-base">
+          <Button type="submit" className="h-14 rounded-2xl px-10 text-base sm:w-auto">
             {t('搜索', 'Search')}
           </Button>
         </form>
@@ -195,9 +203,9 @@ export default function MarketplacePage() {
 
       {error && (
         <Card className="mb-6 border-destructive">
-          <CardContent className="flex items-center gap-2 pt-6 text-sm text-destructive">
-            <AlertCircle className="h-4 w-4" />
-            {error}
+          <CardContent className="flex items-start gap-2 pt-6 text-sm text-destructive">
+            <AlertCircle className="mt-0.5 h-4 w-4 shrink-0" />
+            <span className="min-w-0 break-words">{error}</span>
           </CardContent>
         </Card>
       )}
@@ -206,6 +214,7 @@ export default function MarketplacePage() {
         <div className="space-y-5">
           <Button
             variant="ghost"
+            className="h-11"
             onClick={() => {
               setSelected(null);
               setVersionDetail(null);
@@ -239,7 +248,7 @@ export default function MarketplacePage() {
               onOpenFile={(filePath) => void openFile(filePath)}
               badges={
                 <>
-                  <Badge variant="outline">@{selected.namespace}</Badge>
+                  <Badge variant="outline" className="max-w-full break-all">@{selected.namespace}</Badge>
                   <Badge variant="outline">{t('下载', 'Downloads')}: {selected.downloadCount || 0}</Badge>
                   <Badge variant="outline">{t('收藏', 'Stars')}: {selected.starCount || 0}</Badge>
                   {selected.installed && (
@@ -251,7 +260,7 @@ export default function MarketplacePage() {
                 </>
               }
               actions={
-                <Button onClick={installSelected} disabled={installing || detailLoading || versionLoading}>
+                <Button className="h-11" onClick={installSelected} disabled={installing || detailLoading || versionLoading}>
                   {installing ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : <Download className="mr-2 h-4 w-4" />}
                   {selected.installed ? t('重新安装/更新', 'Reinstall/update') : t('安装', 'Install')}
                 </Button>
@@ -283,7 +292,7 @@ export default function MarketplacePage() {
                 {label}
               </Button>
             ))}
-            <span className="ml-4 text-sm font-medium text-muted-foreground">{t('筛选：', 'Filter:')}</span>
+            <span className="text-sm font-medium text-muted-foreground sm:ml-4">{t('筛选：', 'Filter:')}</span>
             <Button size="sm" variant={starredOnly ? 'default' : 'outline'} onClick={() => setStarredOnly((value) => !value)}>
               <Star className="mr-2 h-4 w-4" />
               {t('只看已收藏', 'Starred only')}
@@ -297,28 +306,34 @@ export default function MarketplacePage() {
           ) : (
             <div className="grid gap-5 md:grid-cols-2 xl:grid-cols-3">
               {items.map((item) => (
-                <Card key={`${item.namespace}/${item.slug}`} className="cursor-pointer transition hover:border-primary" onClick={() => void openDetail(item)}>
-                  <CardHeader>
-                    <div className="flex items-start justify-between gap-3">
-                      <CardTitle className="text-xl">{item.displayName || item.slug}</CardTitle>
-                      <Badge variant="outline">@{item.namespace}</Badge>
-                    </div>
-                  </CardHeader>
-                  <CardContent className="space-y-5">
-                    <p className="line-clamp-3 min-h-[4.5rem] text-sm leading-6 text-muted-foreground">{item.summary}</p>
-                    <div className="flex flex-wrap items-center gap-3 text-sm text-muted-foreground">
-                      <Badge variant="secondary">v{publishedVersion(item) || '-'}</Badge>
-                      <span>{item.downloadCount || 0}</span>
-                      <span>{item.starCount || 0}</span>
-                      {item.installed && <Badge variant="outline">{t('已安装', 'Installed')}</Badge>}
-                    </div>
-                  </CardContent>
+                <Card key={`${item.namespace}/${item.slug}`} className="overflow-hidden transition hover:border-primary">
+                  <button
+                    type="button"
+                    className="block h-full w-full text-left"
+                    onClick={() => void openDetail(item)}
+                  >
+                    <CardHeader>
+                      <div className="flex flex-col items-start gap-3 sm:flex-row sm:justify-between">
+                        <CardTitle className="min-w-0 break-words text-xl">{item.displayName || item.slug}</CardTitle>
+                        <Badge variant="outline" className="max-w-full break-all">@{item.namespace}</Badge>
+                      </div>
+                    </CardHeader>
+                    <CardContent className="space-y-5">
+                      <p className="line-clamp-3 min-h-[4.5rem] break-words text-sm leading-6 text-muted-foreground">{item.summary}</p>
+                      <div className="flex flex-wrap items-center gap-3 text-sm text-muted-foreground">
+                        <Badge variant="secondary" className="max-w-full break-all">v{publishedVersion(item) || '-'}</Badge>
+                        <span>{item.downloadCount || 0}</span>
+                        <span>{item.starCount || 0}</span>
+                        {item.installed && <Badge variant="outline">{t('已安装', 'Installed')}</Badge>}
+                      </div>
+                    </CardContent>
+                  </button>
                 </Card>
               ))}
             </div>
           )}
 
-          <div className="flex items-center justify-center gap-3">
+          <div className="flex flex-wrap items-center justify-center gap-3">
             <Button variant="outline" disabled={page <= 0} onClick={() => setPage((value) => Math.max(0, value - 1))}>
               {t('上一页', 'Previous')}
             </Button>
diff --git a/app-instance/frontend/app/(app)/mcp/page.tsx b/app-instance/frontend/app/(app)/mcp/page.tsx
index 16da65b..2ad24a9 100644
--- a/app-instance/frontend/app/(app)/mcp/page.tsx
+++ b/app-instance/frontend/app/(app)/mcp/page.tsx
@@ -247,6 +247,9 @@ export default function MCPPage() {
   };
 
   const handleDelete = async (serverId: string) => {
+    if (!window.confirm(t('确定删除这个 MCP 服务吗？此操作不可撤销。', 'Delete this MCP server? This action cannot be undone.'))) {
+      return;
+    }
     try {
       await deleteMcpServer(serverId);
       setSelectedServerId((current) => (current === serverId ? null : current));
@@ -312,9 +315,9 @@ export default function MCPPage() {
   }
 
   return (
-    <div className="max-w-6xl mx-auto p-6 space-y-6">
-      <div className="flex items-center justify-between gap-4 flex-wrap">
-        <div>
+    <div className="mx-auto max-w-6xl space-y-6 p-4 sm:p-6">
+      <div className="flex flex-col gap-4 sm:flex-row sm:items-start sm:justify-between">
+        <div className="min-w-0">
           <h1 className="text-2xl font-bold flex items-center gap-2">
             <ServerCog className="w-6 h-6" />
             {t('工具', 'Tools')}
@@ -323,8 +326,8 @@ export default function MCPPage() {
             {t('本地工具和在线工具都通过 MCP Server 暴露；本地工具按类别由真实 stdio MCP 子进程承载。', 'Local and online tools are both exposed through MCP servers. Local tool categories run as real stdio MCP subprocesses.')}
           </p>
         </div>
-        <div className="flex items-center gap-2">
-          <Button variant="outline" size="sm" onClick={() => void load(true)}>
+        <div className="flex w-full flex-wrap items-center gap-2 sm:w-auto sm:justify-end">
+          <Button variant="outline" size="sm" className="h-11" onClick={() => void load(true)}>
             <RefreshCw className={`w-4 h-4 mr-2 ${refreshing ? 'animate-spin' : ''}`} />
             {t('刷新', 'Refresh')}
           </Button>
@@ -333,12 +336,12 @@ export default function MCPPage() {
             if (!open) resetForm();
           }}>
             <DialogTrigger asChild>
-              <Button size="sm">
+              <Button size="sm" className="h-11">
                 <Plus className="w-4 h-4 mr-2" />
                 {t('新增工具服务', 'Add tool server')}
               </Button>
             </DialogTrigger>
-            <DialogContent className="sm:max-w-2xl">
+            <DialogContent className="max-h-[calc(100dvh-2rem)] w-[calc(100vw-2rem)] overflow-y-auto sm:max-w-2xl">
               <DialogHeader>
                 <DialogTitle>{editingId ? t('编辑 MCP 服务', 'Edit MCP server') : t('新增 MCP 服务', 'Add MCP server')}</DialogTitle>
               </DialogHeader>
@@ -346,11 +349,11 @@ export default function MCPPage() {
                 <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
                   <div className="space-y-2">
                     <Label htmlFor="id">ID</Label>
-                    <Input id="id" value={form.id} onChange={(e) => setForm((s) => ({ ...s, id: e.target.value }))} required disabled={!!editingId} />
+                    <Input id="id" className="h-11" value={form.id} onChange={(e) => setForm((s) => ({ ...s, id: e.target.value }))} required disabled={!!editingId} />
                   </div>
                   <div className="space-y-2">
                     <Label htmlFor="tool_timeout">{t('工具超时', 'Tool timeout')}</Label>
-                    <Input id="tool_timeout" type="number" min="1" value={form.tool_timeout} onChange={(e) => setForm((s) => ({ ...s, tool_timeout: e.target.value }))} />
+                    <Input id="tool_timeout" className="h-11" type="number" min="1" value={form.tool_timeout} onChange={(e) => setForm((s) => ({ ...s, tool_timeout: e.target.value }))} />
                   </div>
                 </div>
                 <Tabs
@@ -390,6 +393,7 @@ export default function MCPPage() {
                       <Label htmlFor="url">{t('MCP Server 地址', 'MCP server URL')}</Label>
                       <Input
                         id="url"
+                        className="h-11"
                         value={form.url}
                         onChange={(e) => setForm((s) => ({ ...s, url: e.target.value }))}
                         placeholder="http://localhost:3001/mcp"
@@ -403,7 +407,7 @@ export default function MCPPage() {
                           id="auth_mode"
                           value={form.auth_mode}
                           onChange={(e) => setForm((s) => ({ ...s, auth_mode: e.target.value }))}
-                          className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm"
+                          className="flex h-11 w-full rounded-md border border-input bg-background px-3 py-2 text-sm"
                         >
                           <option value="none">none</option>
                           <option value="oauth_backend_token">oauth_backend_token</option>
@@ -452,6 +456,7 @@ export default function MCPPage() {
                         <Label htmlFor="command">{t('命令', 'Command')}</Label>
                         <Input
                           id="command"
+                          className="h-11"
                           value={form.command}
                           onChange={(e) => setForm((s) => ({ ...s, command: e.target.value }))}
                           placeholder="npx"
@@ -462,6 +467,7 @@ export default function MCPPage() {
                         <Label htmlFor="args">{t('参数', 'Arguments')}</Label>
                         <Input
                           id="args"
+                          className="h-11"
                           value={form.args}
                           onChange={(e) => setForm((s) => ({ ...s, args: e.target.value }))}
                           placeholder="-y @modelcontextprotocol/server-github"
@@ -470,11 +476,11 @@ export default function MCPPage() {
                     </div>
                   </TabsContent>
                 </Tabs>
-                <div className="flex justify-end gap-2">
-                  <Button type="button" variant="outline" onClick={() => setDialogOpen(false)}>
+                <div className="sticky bottom-0 -mx-6 -mb-6 flex justify-end gap-2 border-t bg-background px-6 py-4">
+                  <Button type="button" variant="outline" className="h-11" onClick={() => setDialogOpen(false)}>
                     {t('取消', 'Cancel')}
                   </Button>
-                  <Button type="submit" disabled={submitting}>
+                  <Button type="submit" className="h-11" disabled={submitting}>
                     {submitting ? <Loader2 className="w-4 h-4 animate-spin mr-2" /> : <Plus className="w-4 h-4 mr-2" />}
                     {t('保存', 'Save')}
                   </Button>
@@ -488,7 +494,7 @@ export default function MCPPage() {
       {error && (
         <Card className="border-destructive">
           <CardContent className="pt-6">
-            <div className="flex items-center gap-2 text-destructive text-sm">
+            <div className="flex items-center gap-2 break-words text-sm text-destructive">
               <AlertCircle className="w-4 h-4" />
               {error}
             </div>
@@ -500,9 +506,9 @@ export default function MCPPage() {
         setToolTab(value as 'local' | 'online');
         setSelectedServerId(null);
       }} className="space-y-4">
-        <TabsList>
-          <TabsTrigger value="local">{t('本地工具', 'Local tools')}</TabsTrigger>
-          <TabsTrigger value="online">{t('在线工具', 'Online tools')}</TabsTrigger>
+        <TabsList className="h-auto min-h-11">
+          <TabsTrigger value="local" className="h-11 px-4">{t('本地工具', 'Local tools')}</TabsTrigger>
+          <TabsTrigger value="online" className="h-11 px-4">{t('在线工具', 'Online tools')}</TabsTrigger>
         </TabsList>
       </Tabs>
 
@@ -511,78 +517,73 @@ export default function MCPPage() {
           {visibleServers.map((server) => (
             <Card
               key={server.id}
-              role="button"
-              tabIndex={0}
-              onClick={() => setSelectedServerId(server.id)}
-              onKeyDown={(event) => {
-                if (event.key === 'Enter' || event.key === ' ') {
-                  event.preventDefault();
-                  setSelectedServerId(server.id);
-                }
-              }}
               className={cn(
-                'cursor-pointer transition-colors',
+                'min-w-0 transition-colors',
                 selectedServerId === server.id && 'border-primary bg-primary/5 shadow-sm'
               )}
             >
-              <CardHeader className="pb-3">
-                <div className="flex items-start justify-between gap-4">
-                  <div>
-                    <CardTitle className="text-base">{server.name}</CardTitle>
-                    <p className="text-xs text-muted-foreground mt-1 font-mono">{server.id}</p>
+              <div
+                role="button"
+                tabIndex={0}
+                onClick={() => setSelectedServerId(server.id)}
+                onKeyDown={(event) => {
+                  if (event.key === 'Enter' || event.key === ' ') {
+                    event.preventDefault();
+                    setSelectedServerId(server.id);
+                  }
+                }}
+                className="min-h-11 cursor-pointer rounded-t-lg focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
+              >
+                <CardHeader className="pb-3">
+                  <div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
+                    <div className="min-w-0">
+                      <CardTitle className="break-words text-base">{server.name}</CardTitle>
+                      <p className="mt-1 break-all font-mono text-xs text-muted-foreground">{server.id}</p>
+                    </div>
+                    <div className="flex min-w-0 flex-wrap items-center gap-2 sm:justify-end">
+                      <Badge variant="outline">{transportLabel(server.transport, locale)}</Badge>
+                      <Badge variant="secondary">{server.category || (server.kind === 'local' ? 'local' : 'online')}</Badge>
+                      {server.managed && <Badge variant="outline">{t('内置', 'Built-in')}</Badge>}
+                      <Badge variant={server.status === 'connected' ? 'default' : server.status === 'error' ? 'destructive' : 'secondary'}>
+                        {serverStatusLabel(server.status, locale)}
+                      </Badge>
+                    </div>
                   </div>
-                  <div className="flex items-center gap-2 flex-wrap justify-end">
-                    <Badge variant="outline">{transportLabel(server.transport, locale)}</Badge>
-                    <Badge variant="secondary">{server.category || (server.kind === 'local' ? 'local' : 'online')}</Badge>
-                    {server.managed && <Badge variant="outline">{t('内置', 'Built-in')}</Badge>}
-                    <Badge variant={server.status === 'connected' ? 'default' : server.status === 'error' ? 'destructive' : 'secondary'}>
-                      {serverStatusLabel(server.status, locale)}
-                    </Badge>
-                  </div>
-                </div>
-              </CardHeader>
-              <CardContent className="pt-0 space-y-3 text-sm">
-                {server.url && <div><span className="font-medium">URL:</span> <span className="text-muted-foreground break-all">{server.url}</span></div>}
-                {server.command && <div><span className="font-medium">{t('命令：', 'Command:')}</span> <span className="text-muted-foreground">{server.command} {(server.args || []).join(' ')}</span></div>}
-                {server.auth_mode && server.auth_mode !== 'none' && <div><span className="font-medium">{t('鉴权：', 'Auth:')}</span> <span className="text-muted-foreground">{server.auth_mode}</span></div>}
-                {(server.auth_audience || server.auth_mode === 'oauth_backend_token') && (
-                  <div><span className="font-medium">Audience：</span> <span className="text-muted-foreground">{server.auth_audience || resolveAuthAudience(server.id)}</span></div>
-                )}
-                {(server.auth_scopes || []).length > 0 && <div><span className="font-medium">Scopes：</span> <span className="text-muted-foreground break-all">{(server.auth_scopes || []).join(', ')}</span></div>}
-                {server.auth_mode === 'oauth_backend_token' && (!server.auth_scopes || server.auth_scopes.length === 0) && (
-                  <div><span className="font-medium">Scopes：</span> <span className="text-muted-foreground">{t('由 AuthZ 动态决定', 'Derived from AuthZ')}</span></div>
-                )}
-                <div className="flex items-center gap-2 flex-wrap text-xs text-muted-foreground">
-                  <span>{t(`${discoveredToolCount(server.id, tools, server.tool_count)} 个工具`, `${discoveredToolCount(server.id, tools, server.tool_count)} tools`)}</span>
-                  <span>{selectedServerId === server.id ? t('已选中', 'Selected') : t('点击查看工具', 'Click to view tools')}</span>
-                  {server.last_error && <span className="text-rose-300">{server.last_error}</span>}
-                </div>
-                <div className="flex items-center gap-2 justify-end">
-                  {!server.managed && (
-                    <Button variant="outline" size="sm" onClick={(event) => {
-                      event.stopPropagation();
-                      openEdit(server);
-                    }}>
-                      {t('编辑', 'Edit')}
-                    </Button>
+                </CardHeader>
+                <CardContent className="space-y-3 pt-0 text-sm">
+                  {server.url && <div className="break-words"><span className="font-medium">URL:</span> <span className="break-all text-muted-foreground">{server.url}</span></div>}
+                  {server.command && <div className="break-words"><span className="font-medium">{t('命令：', 'Command:')}</span> <span className="break-all text-muted-foreground">{server.command} {(server.args || []).join(' ')}</span></div>}
+                  {server.auth_mode && server.auth_mode !== 'none' && <div className="break-words"><span className="font-medium">{t('鉴权：', 'Auth:')}</span> <span className="break-all text-muted-foreground">{server.auth_mode}</span></div>}
+                  {(server.auth_audience || server.auth_mode === 'oauth_backend_token') && (
+                    <div className="break-words"><span className="font-medium">Audience：</span> <span className="break-all text-muted-foreground">{server.auth_audience || resolveAuthAudience(server.id)}</span></div>
                   )}
-                  <Button variant="outline" size="sm" onClick={(event) => {
-                    event.stopPropagation();
-                    void handleTest(server.id);
-                  }} disabled={testingId === server.id}>
-                    {testingId === server.id ? <Loader2 className="w-4 h-4 animate-spin mr-2" /> : <TestTube2 className="w-4 h-4 mr-2" />}
-                    {t('测试', 'Test')}
+                  {(server.auth_scopes || []).length > 0 && <div className="break-words"><span className="font-medium">Scopes：</span> <span className="break-all text-muted-foreground">{(server.auth_scopes || []).join(', ')}</span></div>}
+                  {server.auth_mode === 'oauth_backend_token' && (!server.auth_scopes || server.auth_scopes.length === 0) && (
+                    <div className="break-words"><span className="font-medium">Scopes：</span> <span className="text-muted-foreground">{t('由 AuthZ 动态决定', 'Derived from AuthZ')}</span></div>
+                  )}
+                  <div className="flex min-w-0 flex-wrap items-center gap-2 text-xs text-muted-foreground">
+                    <span>{t(`${discoveredToolCount(server.id, tools, server.tool_count)} 个工具`, `${discoveredToolCount(server.id, tools, server.tool_count)} tools`)}</span>
+                    <span>{selectedServerId === server.id ? t('已选中', 'Selected') : t('点击查看工具', 'Click to view tools')}</span>
+                    {server.last_error && <span className="break-all text-destructive">{server.last_error}</span>}
+                  </div>
+                </CardContent>
+              </div>
+              <CardContent className="flex flex-wrap items-center justify-end gap-2 pt-0">
+                {!server.managed && (
+                  <Button variant="outline" size="sm" className="h-11" onClick={() => openEdit(server)}>
+                    {t('编辑', 'Edit')}
                   </Button>
-                  {!server.managed && (
-                    <Button variant="outline" size="sm" onClick={(event) => {
-                      event.stopPropagation();
-                      void handleDelete(server.id);
-                    }}>
-                      <Trash2 className="w-4 h-4 mr-2" />
-                      {t('删除', 'Delete')}
-                    </Button>
-                  )}
-                </div>
+                )}
+                <Button variant="outline" size="sm" className="h-11" onClick={() => void handleTest(server.id)} disabled={testingId === server.id}>
+                  {testingId === server.id ? <Loader2 className="w-4 h-4 animate-spin mr-2" /> : <TestTube2 className="w-4 h-4 mr-2" />}
+                  {t('测试', 'Test')}
+                </Button>
+                {!server.managed && (
+                  <Button variant="outline" size="sm" className="h-11" onClick={() => void handleDelete(server.id)}>
+                    <Trash2 className="w-4 h-4 mr-2" />
+                    {t('删除', 'Delete')}
+                  </Button>
+                )}
               </CardContent>
             </Card>
           ))}
@@ -595,9 +596,9 @@ export default function MCPPage() {
           )}
         </div>
 
-        <Card>
+        <Card className="min-w-0">
           <CardHeader>
-            <CardTitle className="text-base flex items-center gap-2">
+            <CardTitle className="flex items-center gap-2 break-words text-base">
               <Wrench className="w-4 h-4" />
               {selectedServer ? t(`${selectedServer.name} 的工具`, `${selectedServer.name} tools`) : t('工具详情', 'Tool details')}
             </CardTitle>
@@ -613,12 +614,12 @@ export default function MCPPage() {
             )}
             {selectedToolGroup && (
               <div className="space-y-2">
-                <div className="text-sm font-medium">{selectedToolGroup.server_id}</div>
+                <div className="break-all text-sm font-medium">{selectedToolGroup.server_id}</div>
                 <div className="space-y-2">
                   {selectedToolGroup.tools.map((tool) => (
-                    <div key={String(tool.name)} className="rounded-md border border-border/70 px-3 py-2 bg-background/60">
-                      <div className="text-sm font-medium">{String(tool.tool_name || tool.name)}</div>
-                      <div className="text-xs text-muted-foreground mt-1 whitespace-pre-wrap break-words">
+                    <div key={String(tool.name)} className="min-w-0 rounded-md border border-border/70 bg-background/60 px-3 py-2">
+                      <div className="break-all text-sm font-medium">{String(tool.tool_name || tool.name)}</div>
+                      <div className="mt-1 whitespace-pre-wrap break-words text-xs text-muted-foreground">
                         {String(tool.description || '—')}
                       </div>
                     </div>
diff --git a/app-instance/frontend/app/(app)/notifications/[scheduledRunId]/page.tsx b/app-instance/frontend/app/(app)/notifications/[scheduledRunId]/page.tsx
index 708bf56..e2b104a 100644
--- a/app-instance/frontend/app/(app)/notifications/[scheduledRunId]/page.tsx
+++ b/app-instance/frontend/app/(app)/notifications/[scheduledRunId]/page.tsx
@@ -9,6 +9,7 @@ import { getNotification, sendMessage } from '@/lib/api';
 import type { ChatMessage, NotificationDetail } from '@/types';
 import { pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
+import { containedLongTextClass } from '@/lib/text-wrapping';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
 import { ChatWorkbench } from '@/components/chat-workbench/ChatWorkbench';
@@ -27,6 +28,7 @@ export default function NotificationDetailPage() {
   const [submitting, setSubmitting] = useState(false);
   const messagesEndRef = useRef<HTMLDivElement>(null);
   const viewportRef = useRef<HTMLDivElement>(null);
+  const replyTextareaId = `notification-reply-${scheduledRunId}`;
 
   const load = React.useCallback(async () => {
     setLoading(true);
@@ -94,8 +96,8 @@ export default function NotificationDetailPage() {
 
   if (!detail) {
     return (
-      <main className="mx-auto max-w-4xl px-6 py-8">
-        <Link href="/notifications" className="inline-flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground">
+      <main className="mx-auto max-w-4xl px-4 py-6 sm:px-6 sm:py-8">
+        <Link href="/notifications" className="inline-flex h-11 items-center gap-2 text-sm text-muted-foreground hover:text-foreground">
           <ArrowLeft className="h-4 w-4" />
           {pickAppText(locale, '返回通知', 'Back to notifications')}
         </Link>
@@ -106,29 +108,29 @@ export default function NotificationDetailPage() {
 
   return (
     <main className="flex h-[calc(100vh-4rem)] flex-col bg-background">
-      <div className="border-b border-[#E6E1DE] bg-[#F7F6F5] px-6 py-4">
+      <div className="border-b border-[#E6E1DE] bg-[#F7F6F5] px-4 py-4 sm:px-6">
         <div className="mx-auto flex max-w-6xl flex-wrap items-center justify-between gap-3">
           <div className="min-w-0">
-            <Link href="/notifications" className="mb-2 inline-flex items-center gap-2 text-sm text-muted-foreground hover:text-foreground">
+            <Link href="/notifications" className="mb-2 inline-flex h-11 items-center gap-2 text-sm text-muted-foreground hover:text-foreground">
               <ArrowLeft className="h-4 w-4" />
               {pickAppText(locale, '通知列表', 'Notifications')}
             </Link>
             <div className="flex min-w-0 flex-wrap items-center gap-2">
-              <h1 className="truncate text-xl font-semibold">{detail.title || detail.job_name}</h1>
-              <Badge variant={detail.status === 'error' ? 'destructive' : 'secondary'}>{detail.status}</Badge>
-              {detail.engaged && <Badge>{pickAppText(locale, '已接入 Task', 'Task linked')}</Badge>}
+              <h1 className={`min-w-0 max-w-full text-lg font-semibold sm:text-xl ${containedLongTextClass}`}>{detail.title || detail.job_name}</h1>
+              <Badge variant={detail.status === 'error' ? 'destructive' : 'secondary'} className="shrink-0">{detail.status}</Badge>
+              {detail.engaged && <Badge className="shrink-0">{pickAppText(locale, '已接入 Task', 'Task linked')}</Badge>}
             </div>
             <p className="mt-1 text-sm text-muted-foreground">
               {pickAppText(locale, '生成时间', 'Generated')}: {formatTime(detail.started_at)}
             </p>
           </div>
-          <div className="flex items-center gap-2">
-            <Button variant="outline" size="sm" onClick={() => void load()}>
+          <div className="flex flex-wrap items-center gap-2">
+            <Button variant="outline" size="sm" className="h-11" onClick={() => void load()}>
               <RefreshCw className="mr-2 h-4 w-4" />
               {pickAppText(locale, '刷新', 'Refresh')}
             </Button>
             {detail.task_id && (
-              <Button asChild size="sm">
+              <Button asChild size="sm" className="h-11">
                 <Link href={`/tasks/${encodeURIComponent(detail.task_id)}`}>{pickAppText(locale, '查看任务', 'Open task')}</Link>
               </Button>
             )}
@@ -136,7 +138,7 @@ export default function NotificationDetailPage() {
         </div>
       </div>
 
-      {error && <div className="mx-auto w-full max-w-6xl px-6 pt-3 text-sm text-destructive">{error}</div>}
+      {error && <div className={`mx-auto w-full max-w-6xl px-4 pt-3 text-sm text-destructive sm:px-6 ${containedLongTextClass}`}>{error}</div>}
 
       <div className="min-h-0 flex-1">
         <ChatWorkbench
@@ -154,13 +156,15 @@ export default function NotificationDetailPage() {
         />
       </div>
 
-      <div className="border-t border-[#E6E1DE] bg-background px-6 py-4">
+      <div className="border-t border-[#E6E1DE] bg-background px-4 py-4 sm:px-6">
         <div className="mx-auto max-w-5xl">
           <div className="mb-2 flex flex-wrap gap-2">
             <Button
               type="button"
               size="sm"
               variant={intent === 'revise_once' ? 'default' : 'outline'}
+              className="h-11"
+              aria-pressed={intent === 'revise_once'}
               onClick={() => setIntent('revise_once')}
             >
               <RefreshCw className="mr-2 h-4 w-4" />
@@ -170,13 +174,15 @@ export default function NotificationDetailPage() {
               type="button"
               size="sm"
               variant={intent === 'update_future' ? 'default' : 'outline'}
+              className="h-11"
+              aria-pressed={intent === 'update_future'}
               onClick={() => setIntent('update_future')}
             >
               <Settings2 className="mr-2 h-4 w-4" />
               {pickAppText(locale, '以后按这样', 'Apply going forward')}
             </Button>
             {detail.engaged && (
-              <span className="inline-flex items-center gap-1 text-xs text-muted-foreground">
+              <span className="inline-flex min-h-11 items-center gap-1 text-xs text-muted-foreground">
                 <Check className="h-3.5 w-3.5" />
                 {pickAppText(locale, '这条通知已经接入 Task', 'This notification is linked to a Task')}
               </span>
@@ -184,7 +190,13 @@ export default function NotificationDetailPage() {
           </div>
           {intent && (
             <div className="rounded-[20px] border border-[#E6E1DE] bg-white p-3 shadow-[0_6px_18px_rgba(0,0,0,0.06)]">
+              <label htmlFor={replyTextareaId} className="mb-2 block px-2 text-xs font-medium text-muted-foreground">
+                {intent === 'update_future'
+                  ? pickAppText(locale, '以后这类通知的调整说明', 'Future notification adjustment')
+                  : pickAppText(locale, '本次通知的修改说明', 'Revision note for this notification')}
+              </label>
               <textarea
+                id={replyTextareaId}
                 value={input}
                 onChange={(event) => setInput(event.target.value)}
                 placeholder={
@@ -192,10 +204,10 @@ export default function NotificationDetailPage() {
                     ? pickAppText(locale, '告诉我以后这类通知要怎么调整...', 'Describe how future notifications should change...')
                     : pickAppText(locale, '告诉我这次内容要怎么改...', 'Describe how this result should change...')
                 }
-                className="block min-h-20 w-full resize-none border-0 bg-transparent px-2 py-1 text-sm leading-6 outline-none"
+                className={`block min-h-20 w-full resize-none border-0 bg-transparent px-2 py-1 text-sm leading-6 outline-none ${containedLongTextClass}`}
               />
               <div className="flex justify-end">
-                <Button size="sm" onClick={() => void submitReply()} disabled={!input.trim() || submitting}>
+                <Button size="sm" className="h-11" onClick={() => void submitReply()} disabled={!input.trim() || submitting}>
                   {submitting ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : <Send className="mr-2 h-4 w-4" />}
                   {pickAppText(locale, '发送', 'Send')}
                 </Button>
diff --git a/app-instance/frontend/app/(app)/notifications/page.tsx b/app-instance/frontend/app/(app)/notifications/page.tsx
index 3b5ba88..5fa3b06 100644
--- a/app-instance/frontend/app/(app)/notifications/page.tsx
+++ b/app-instance/frontend/app/(app)/notifications/page.tsx
@@ -8,6 +8,7 @@ import { listNotifications } from '@/lib/api';
 import type { NotificationRun } from '@/types';
 import { pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
+import { containedLongTextClass } from '@/lib/text-wrapping';
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent } from '@/components/ui/card';
@@ -40,18 +41,18 @@ export default function NotificationsPage() {
   };
 
   return (
-    <main className="mx-auto flex h-[calc(100vh-4rem)] max-w-6xl flex-col px-6 py-8">
+    <main className="mx-auto flex h-[calc(100vh-4rem)] max-w-6xl flex-col px-4 py-6 sm:px-6 sm:py-8">
       <div className="mb-6 flex flex-wrap items-center justify-between gap-3">
-        <div>
+        <div className="min-w-0">
           <h1 className="flex items-center gap-2 text-2xl font-semibold tracking-tight">
             <Bell className="h-5 w-5" />
             {pickAppText(locale, '通知', 'Notifications')}
           </h1>
-          <p className="mt-1 text-sm text-muted-foreground">
+          <p className="mt-1 max-w-2xl text-sm text-muted-foreground">
             {pickAppText(locale, '定时任务生成的日报、提醒和总结会固定出现在这里。', 'Scheduled reports, reminders, and summaries appear here.')}
           </p>
         </div>
-        <Button onClick={() => void load()} variant="outline" size="sm">
+        <Button onClick={() => void load()} variant="outline" size="sm" className="h-11">
           <RefreshCw className="mr-2 h-4 w-4" />
           {pickAppText(locale, '刷新', 'Refresh')}
         </Button>
@@ -83,21 +84,21 @@ export default function NotificationsPage() {
               <Link
                 key={item.scheduled_run_id}
                 href={`/notifications/${encodeURIComponent(item.scheduled_run_id)}`}
-                className="grid gap-3 px-5 py-4 transition-colors hover:bg-[#F7F6F5] md:grid-cols-[minmax(0,1fr)_180px_110px_24px]"
+                className="grid min-w-0 gap-3 px-4 py-4 transition-colors hover:bg-[#F7F6F5] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset sm:px-5 md:grid-cols-[minmax(0,1fr)_180px_110px_24px]"
               >
                 <div className="min-w-0">
                   <div className="flex min-w-0 items-center gap-2">
-                    <span className="truncate font-medium">{item.title || item.job_name}</span>
-                    {item.engaged && <Badge variant="secondary">{pickAppText(locale, '已接入 Task', 'Task linked')}</Badge>}
-                    {item.status === 'error' && <Badge variant="destructive">{pickAppText(locale, '错误', 'Error')}</Badge>}
+                    <span className={`min-w-0 flex-1 font-medium ${containedLongTextClass}`}>{item.title || item.job_name}</span>
+                    {item.engaged && <Badge variant="secondary" className="shrink-0">{pickAppText(locale, '已接入 Task', 'Task linked')}</Badge>}
+                    {item.status === 'error' && <Badge variant="destructive" className="shrink-0">{pickAppText(locale, '错误', 'Error')}</Badge>}
                   </div>
-                  <p className="mt-1 line-clamp-2 text-sm text-muted-foreground">{item.output || item.message}</p>
+                  <p className={`mt-1 line-clamp-2 text-sm text-muted-foreground ${containedLongTextClass}`}>{item.output || item.message}</p>
                 </div>
-                <div className="flex items-center gap-2 text-sm text-muted-foreground">
+                <div className="flex min-w-0 items-center gap-2 text-sm text-muted-foreground">
                   <Clock3 className="h-4 w-4" />
                   {formatTime(item.started_at)}
                 </div>
-                <div className="text-sm text-muted-foreground">{item.job_name}</div>
+                <div className={`text-sm text-muted-foreground ${containedLongTextClass}`}>{item.job_name}</div>
                 <ArrowRight className="hidden h-4 w-4 self-center text-muted-foreground md:block" />
               </Link>
             ))}
diff --git a/app-instance/frontend/app/(app)/outlook/page.tsx b/app-instance/frontend/app/(app)/outlook/page.tsx
index 851d0da..d069725 100644
--- a/app-instance/frontend/app/(app)/outlook/page.tsx
+++ b/app-instance/frontend/app/(app)/outlook/page.tsx
@@ -318,7 +318,7 @@ function renderPlainText(content: string): React.ReactNode[] {
             href={part}
             target="_blank"
             rel="noreferrer noopener"
-            className="text-primary underline underline-offset-2 break-all"
+            className="inline-block min-h-11 max-w-full break-all py-2 text-primary underline underline-offset-2"
           >
             {part}
           </a>
@@ -461,7 +461,9 @@ export default function OutlookPage() {
       if (!background) {
         setStatusLoading(false);
       }
-      if (!nextStatus.configured) {
+      if (nextStatus.configured) {
+        await loadOverview(options?.preserveOverview ?? background);
+      } else {
         setOverview(null);
         setOverviewLoading(false);
       }
@@ -647,6 +649,9 @@ export default function OutlookPage() {
   };
 
   const handleDisconnect = async () => {
+    if (!window.confirm(t('确定断开 Outlook 连接吗？已保存的连接凭据会被移除。', 'Disconnect Outlook? Saved connection credentials will be removed.'))) {
+      return;
+    }
     setDisconnecting(true);
     setError(null);
     try {
@@ -671,9 +676,7 @@ export default function OutlookPage() {
 
   const refreshOverview = async () => {
     await loadStatus(true, { preserveOverview: true });
-    if (activeView === 'settings' && isConfigured) {
-      await loadOverview(true);
-    } else if (activeView === 'inbox') {
+    if (activeView === 'inbox') {
       await loadMailboxPage('inbox', inboxPage?.page.skip ?? 0);
     } else if (activeView === 'sent') {
       await loadMailboxPage('sent', sentPage?.page.skip ?? 0);
@@ -684,14 +687,14 @@ export default function OutlookPage() {
 
   return (
     <div className="min-h-full">
-      <div className="mx-auto max-w-7xl space-y-6 p-6">
+      <div className="mx-auto max-w-7xl space-y-6 p-4 sm:p-6">
         <section className="rounded-2xl border bg-card px-4 py-4 shadow-sm">
           <div className="flex flex-col gap-3 xl:flex-row xl:items-center xl:justify-between">
-            <div className="flex flex-wrap items-center gap-2 text-sm">
-              <div className="mr-2 flex items-center gap-2 text-lg font-semibold text-foreground">
+            <div className="flex min-w-0 flex-wrap items-center gap-2 text-sm">
+              <h1 className="mr-2 flex min-w-0 items-center gap-2 text-lg font-semibold text-foreground">
                 <Mail className="h-5 w-5" />
                 Outlook
-              </div>
+              </h1>
               {statusPending ? (
                 <>
                   <Skeleton className="h-6 w-20 rounded-full" />
@@ -710,9 +713,9 @@ export default function OutlookPage() {
                     {status?.mcp_registered ? t('MCP 已注册', 'MCP registered') : t('MCP 未注册', 'MCP not registered')}
                   </Badge>
                   <Badge variant="secondary">{status?.provider || 'ews'}</Badge>
-                  <span className="text-muted-foreground">{t('邮箱', 'Mailbox')} {overview?.mailbox || status?.saved?.email || '-'}</span>
-                  <span className="text-muted-foreground">{t('时区', 'Timezone')} {status?.saved?.default_timezone || overview?.timezone || form.default_timezone}</span>
-                  <span className="text-muted-foreground">
+                  <span className="min-w-0 break-all text-muted-foreground">{t('邮箱', 'Mailbox')} {overview?.mailbox || status?.saved?.email || '-'}</span>
+                  <span className="min-w-0 break-all text-muted-foreground">{t('时区', 'Timezone')} {status?.saved?.default_timezone || overview?.timezone || form.default_timezone}</span>
+                  <span className="min-w-0 break-words text-muted-foreground">
                     {t('最近刷新', 'Last refreshed')} {formatDateTime((overview?.meta?.last_overview_refresh_at || status?.meta?.last_overview_refresh_at) as string | undefined, locale)}
                   </span>
                 </>
@@ -727,7 +730,7 @@ export default function OutlookPage() {
                   <TopStat label={t('日程', 'Calendar')} value={String(eventCount)} loading={overviewPending} />
                 </>
               ) : null}
-              <Button variant="outline" size="sm" onClick={() => void refreshOverview()}>
+              <Button variant="outline" size="sm" className="h-11" onClick={() => void refreshOverview()}>
                 <RefreshCw className={`mr-2 h-4 w-4 ${refreshing ? 'animate-spin' : ''}`} />
                 {t('刷新', 'Refresh')}
               </Button>
@@ -740,7 +743,7 @@ export default function OutlookPage() {
             <CardContent className="pt-6">
               <div className="flex items-start gap-3 text-sm text-destructive">
                 <AlertCircle className="mt-0.5 h-4 w-4 shrink-0" />
-                <span>{error}</span>
+                <span className="min-w-0 flex-1 break-all">{error}</span>
               </div>
             </CardContent>
           </Card>
@@ -752,7 +755,7 @@ export default function OutlookPage() {
               {overviewWarnings.map((warning, index) => (
                 <div key={`${warning}-${index}`} className="flex items-start gap-3">
                   <AlertCircle className="mt-0.5 h-4 w-4 shrink-0" />
-                  <span>{warning}</span>
+                  <span className="min-w-0 flex-1 break-all">{warning}</span>
                 </div>
               ))}
             </CardContent>
@@ -771,7 +774,7 @@ export default function OutlookPage() {
                 <TabsTrigger
                   key={view.id}
                   value={view.id}
-                  className="h-auto rounded-xl border border-transparent px-4 py-3 data-[state=active]:border-border data-[state=active]:shadow-sm"
+                  className="min-h-11 rounded-xl border border-transparent px-4 py-3 data-[state=active]:border-border data-[state=active]:shadow-sm"
                 >
                   <div className="flex w-full items-center justify-between gap-3">
                     <div className="flex items-center gap-3">
@@ -872,53 +875,67 @@ export default function OutlookPage() {
                 </CardHeader>
                 <CardContent className="space-y-5 pt-6">
                   <div className="grid gap-4 md:grid-cols-2">
-                    <Field label={t('邮箱地址', 'Email address')} required>
+                    <Field id="outlook-email" label={t('邮箱地址', 'Email address')} required>
                       <Input
+                        id="outlook-email"
+                        className="h-11"
                         value={form.email}
                         onChange={(event) => updateField('email', event.target.value)}
                         placeholder="you@boardware.com"
                       />
                     </Field>
-                    <Field label={t('用户名', 'Username')}>
+                    <Field id="outlook-username" label={t('用户名', 'Username')}>
                       <Input
+                        id="outlook-username"
+                        className="h-11"
                         value={form.username}
                         onChange={(event) => updateField('username', event.target.value)}
                         placeholder={t('留空时默认取邮箱前缀', 'Leave blank to default to the email prefix')}
                       />
                     </Field>
-                    <Field label={t('密码', 'Password')} required>
+                    <Field id="outlook-password" label={t('密码', 'Password')} required>
                       <Input
+                        id="outlook-password"
+                        className="h-11"
                         type="password"
                         value={form.password}
                         onChange={(event) => updateField('password', event.target.value)}
                         placeholder={t('请输入邮箱密码', 'Enter the mailbox password')}
                       />
                     </Field>
-                    <Field label={t('域', 'Domain')}>
+                    <Field id="outlook-domain" label={t('域', 'Domain')}>
                       <Input
+                        id="outlook-domain"
+                        className="h-11"
                         value={form.domain}
                         onChange={(event) => updateField('domain', event.target.value)}
                         placeholder="boardware.com.mo"
                       />
                     </Field>
-                    <Field label="EWS URL">
+                    <Field id="outlook-service-endpoint" label="EWS URL">
                       <Input
+                        id="outlook-service-endpoint"
+                        className="h-11"
                         value={form.service_endpoint}
                         onChange={(event) => updateField('service_endpoint', event.target.value)}
                         placeholder="https://mail.boardware.com.mo/EWS/Exchange.asmx"
                         disabled={form.autodiscover}
                       />
                     </Field>
-                    <Field label="Server Host">
+                    <Field id="outlook-server" label="Server Host">
                       <Input
+                        id="outlook-server"
+                        className="h-11"
                         value={form.server}
                         onChange={(event) => updateField('server', event.target.value)}
                         placeholder="mail.boardware.com.mo"
                         disabled={form.autodiscover}
                       />
                     </Field>
-                    <Field label={t('时区', 'Timezone')}>
+                    <Field id="outlook-timezone" label={t('时区', 'Timezone')}>
                       <Input
+                        id="outlook-timezone"
+                        className="h-11"
                         value={form.default_timezone}
                         onChange={(event) => updateField('default_timezone', event.target.value)}
                         placeholder="Asia/Shanghai"
@@ -944,16 +961,17 @@ export default function OutlookPage() {
                   </div>
 
                   <div className="flex flex-wrap justify-end gap-2">
-                    <Button variant="outline" onClick={handleTest} disabled={!canTest || testing}>
+                    <Button variant="outline" className="h-11" onClick={handleTest} disabled={!canTest || testing}>
                       {testing ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : <CheckCircle2 className="mr-2 h-4 w-4" />}
                       {t('测试连接', 'Test connection')}
                     </Button>
-                    <Button onClick={handleConnect} disabled={!canTest || saving}>
+                    <Button className="h-11" onClick={handleConnect} disabled={!canTest || saving}>
                       {saving ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : <Save className="mr-2 h-4 w-4" />}
                       {t('保存并启用', 'Save and enable')}
                     </Button>
                     <Button
                       variant="outline"
+                      className="h-11"
                       onClick={handleDisconnect}
                       disabled={!status?.configured || disconnecting}
                     >
@@ -966,8 +984,8 @@ export default function OutlookPage() {
                     <div className="rounded-3xl border bg-muted/30 p-4 text-sm">
                       <div className="flex flex-wrap items-center gap-2">
                         <Badge variant="default">{t('测试成功', 'Test succeeded')}</Badge>
-                        <span className="text-muted-foreground">{testResult.mailbox}</span>
-                        <span className="text-muted-foreground">{t('用户名', 'Username')}: {testResult.resolved_username}</span>
+                        <span className="break-all text-muted-foreground">{testResult.mailbox}</span>
+                        <span className="break-all text-muted-foreground">{t('用户名', 'Username')}: {testResult.resolved_username}</span>
                       </div>
                       <div className="mt-3 grid gap-3 md:grid-cols-3">
                         <MiniStat label={t('检测到文件夹', 'Detected folders')} value={String(testResult.sample.folders.length)} />
@@ -979,7 +997,7 @@ export default function OutlookPage() {
                           {testWarnings.map((warning, index) => (
                             <div key={`${warning}-${index}`} className="flex items-start gap-2">
                               <AlertCircle className="mt-0.5 h-4 w-4 shrink-0" />
-                              <span>{warning}</span>
+                              <span className="min-w-0 flex-1 break-all">{warning}</span>
                             </div>
                           ))}
                         </div>
@@ -1054,10 +1072,10 @@ export default function OutlookPage() {
         </Tabs>
 
         <Dialog open={Boolean(selectedMessageRef)} onOpenChange={(open) => !open && setSelectedMessageRef(null)}>
-          <DialogContent className="sm:max-w-5xl">
+          <DialogContent className="bottom-4 left-4 right-4 top-4 max-h-none w-auto max-w-none translate-x-0 translate-y-0 overflow-y-auto data-[state=open]:slide-in-from-left-0 data-[state=open]:slide-in-from-top-0 data-[state=closed]:slide-out-to-left-0 data-[state=closed]:slide-out-to-top-0 sm:bottom-auto sm:left-[50%] sm:right-auto sm:top-[50%] sm:max-h-[calc(100dvh-2rem)] sm:w-[calc(100vw-2rem)] sm:max-w-5xl sm:translate-x-[-50%] sm:translate-y-[-50%] sm:data-[state=open]:slide-in-from-left-1/2 sm:data-[state=open]:slide-in-from-top-[48%] sm:data-[state=closed]:slide-out-to-left-1/2 sm:data-[state=closed]:slide-out-to-top-[48%]">
             <DialogHeader>
-              <DialogTitle>{selectedMessage?.subject || t('邮件详情', 'Message details')}</DialogTitle>
-              <DialogDescription>
+              <DialogTitle className="break-words pr-8 leading-6">{selectedMessage?.subject || t('邮件详情', 'Message details')}</DialogTitle>
+              <DialogDescription className="break-words">
                 {selectedMessage?.receivedDateTime ? formatDateTime(selectedMessage.receivedDateTime, locale) : t('正在加载', 'Loading')}
               </DialogDescription>
             </DialogHeader>
@@ -1066,7 +1084,7 @@ export default function OutlookPage() {
                 <Loader2 className="h-6 w-6 animate-spin text-muted-foreground" />
               </div>
             ) : selectedMessage ? (
-              <div className="grid gap-4 lg:grid-cols-[280px,1fr]">
+              <div className="grid min-w-0 gap-4 lg:grid-cols-[280px,1fr]">
                 <div className="space-y-4 rounded-2xl border bg-muted/20 p-4 text-sm">
                   <InfoRow label={t('发件人', 'From')} value={mailboxLabel(selectedMessage.from)} />
                   <InfoRow
@@ -1085,7 +1103,7 @@ export default function OutlookPage() {
                   </div>
                 </div>
 
-                <div className="overflow-hidden rounded-2xl border bg-background">
+                <div className="min-w-0 overflow-hidden rounded-2xl border bg-background">
                   <div className="border-b px-4 py-3 text-xs font-medium uppercase tracking-[0.18em] text-muted-foreground">
                     {t('正文', 'Body')}
                   </div>
@@ -1115,10 +1133,10 @@ export default function OutlookPage() {
         </Dialog>
 
         <Dialog open={Boolean(selectedEvent)} onOpenChange={(open) => !open && setSelectedEvent(null)}>
-          <DialogContent className="sm:max-w-2xl">
+          <DialogContent className="bottom-4 left-4 right-4 top-4 max-h-none w-auto max-w-none translate-x-0 translate-y-0 overflow-y-auto data-[state=open]:slide-in-from-left-0 data-[state=open]:slide-in-from-top-0 data-[state=closed]:slide-out-to-left-0 data-[state=closed]:slide-out-to-top-0 sm:bottom-auto sm:left-[50%] sm:right-auto sm:top-[50%] sm:max-h-[calc(100dvh-2rem)] sm:w-[calc(100vw-2rem)] sm:max-w-2xl sm:translate-x-[-50%] sm:translate-y-[-50%] sm:data-[state=open]:slide-in-from-left-1/2 sm:data-[state=open]:slide-in-from-top-[48%] sm:data-[state=closed]:slide-out-to-left-1/2 sm:data-[state=closed]:slide-out-to-top-[48%]">
             <DialogHeader>
-              <DialogTitle>{selectedEvent?.subject || t('日程详情', 'Event details')}</DialogTitle>
-              <DialogDescription>
+              <DialogTitle className="break-words pr-8 leading-6">{selectedEvent?.subject || t('日程详情', 'Event details')}</DialogTitle>
+              <DialogDescription className="break-words">
                 {selectedEvent
                   ? `${formatDateTime(selectedEvent.start?.dateTime, locale)} - ${formatDateTime(selectedEvent.end?.dateTime, locale)}`
                   : t('日程详情', 'Event details')}
@@ -1135,7 +1153,7 @@ export default function OutlookPage() {
                 <Separator />
                 <div className="space-y-2">
                   <p className="text-xs uppercase tracking-[0.18em] text-muted-foreground">{t('说明', 'Notes')}</p>
-                  <div className="rounded-lg border bg-muted/40 p-3 whitespace-pre-wrap">
+                  <div className="rounded-lg border bg-muted/40 p-3 whitespace-pre-wrap break-words">
                     {selectedEvent.bodyPreview || t('没有更多说明。', 'No additional notes.')}
                   </div>
                 </div>
@@ -1149,17 +1167,19 @@ export default function OutlookPage() {
 }
 
 function Field({
+  id,
   label,
   required = false,
   children,
 }: {
+  id: string;
   label: string;
   required?: boolean;
   children: React.ReactNode;
 }) {
   return (
     <div className="space-y-2">
-      <Label className="text-sm font-medium">
+      <Label htmlFor={id} className="text-sm font-medium">
         {label}
         {required ? <span className="ml-1 text-destructive">*</span> : null}
       </Label>
@@ -1235,25 +1255,26 @@ function MessageCard({
   const pageLabel = page ? t(`第 ${currentPage} 页 · 本页 ${page.returned} 封`, `Page ${currentPage} · ${page.returned} messages`) : t('正在读取邮件…', 'Loading messages...');
 
   return (
-    <Card className="rounded-[28px] shadow-sm">
-      <CardHeader className="flex flex-row items-center justify-between gap-4 border-b pb-5">
-        <div className="space-y-1">
-          <CardTitle className="flex items-center gap-2 text-base">
+    <Card className="min-w-0 rounded-[28px] shadow-sm">
+      <CardHeader className="flex flex-col gap-4 border-b pb-5 sm:flex-row sm:items-center sm:justify-between">
+        <div className="min-w-0 space-y-1">
+          <CardTitle className="flex items-center gap-2 break-words text-base">
             {icon}
             {title}
           </CardTitle>
           <p className="text-sm text-muted-foreground">{loading ? t('正在读取邮件…', 'Loading messages...') : pageLabel}</p>
         </div>
-        <div className="flex items-center gap-2">
-          <Button variant="ghost" size="sm" onClick={onRefresh} disabled={refreshing}>
+        <div className="flex flex-wrap items-center gap-2">
+          <Button variant="ghost" size="sm" className="h-11 w-11 p-0" aria-label={t('刷新邮件', 'Refresh mail')} title={t('刷新邮件', 'Refresh mail')} onClick={onRefresh} disabled={refreshing}>
             <RefreshCw className={`h-4 w-4 ${refreshing ? 'animate-spin' : ''}`} />
           </Button>
-          <Button variant="outline" size="sm" onClick={onPreviousPage} disabled={!page || page.skip === 0 || refreshing}>
+          <Button variant="outline" size="sm" className="h-11" onClick={onPreviousPage} disabled={!page || page.skip === 0 || refreshing}>
             {t('上一页', 'Previous')}
           </Button>
           <Button
             variant="outline"
             size="sm"
+            className="h-11"
             onClick={onNextPage}
             disabled={!page || !page.has_more || refreshing}
           >
@@ -1284,17 +1305,17 @@ function MessageCard({
                 key={item.id || `${item.subject}-${item.receivedDateTime}`}
                 type="button"
                 onClick={() => item.id && onOpen(item)}
-                className="w-full rounded-2xl border bg-card p-4 text-left transition-colors hover:bg-muted/40"
+                className="min-h-11 w-full rounded-2xl border bg-card p-4 text-left transition-colors hover:bg-muted/40"
               >
                 <div className="flex flex-col gap-3 lg:flex-row lg:items-start lg:justify-between">
                   <div className="min-w-0 flex-1">
-                    <p className="truncate font-medium text-foreground">{item.subject || t('(无主题)', '(No subject)')}</p>
-                    <p className="mt-1 truncate text-xs text-muted-foreground">{mailboxLabel(item.from)}</p>
-                    <p className="mt-3 line-clamp-2 text-sm leading-6 text-muted-foreground">
+                    <p className="break-words font-medium text-foreground">{item.subject || t('(无主题)', '(No subject)')}</p>
+                    <p className="mt-1 break-all text-xs text-muted-foreground">{mailboxLabel(item.from)}</p>
+                    <p className="mt-3 line-clamp-2 break-words text-sm leading-6 text-muted-foreground">
                       {item.bodyPreview || t('没有预览内容。', 'No preview available.')}
                     </p>
                   </div>
-                  <div className="flex shrink-0 items-center gap-2 lg:flex-col lg:items-end">
+                  <div className="flex shrink-0 flex-wrap items-center gap-2 lg:flex-col lg:items-end">
                     <Badge variant={item.isRead ? 'secondary' : 'default'}>
                       {item.isRead ? t('已读', 'Read') : t('未读', 'Unread')}
                     </Badge>
@@ -1357,10 +1378,10 @@ function EventCard({
   });
 
   return (
-    <Card className="rounded-[28px] shadow-sm">
-      <CardHeader className="flex flex-row items-center justify-between space-y-0 border-b pb-5">
-        <div className="space-y-1">
-          <CardTitle className="flex items-center gap-2 text-base">
+    <Card className="min-w-0 rounded-[28px] shadow-sm">
+      <CardHeader className="flex flex-col gap-4 space-y-0 border-b pb-5 sm:flex-row sm:items-center sm:justify-between">
+        <div className="min-w-0 space-y-1">
+          <CardTitle className="flex items-center gap-2 break-words text-base">
             <CalendarDays className="h-4 w-4" />
             {t('日程安排', 'Schedule')}
           </CardTitle>
@@ -1368,17 +1389,17 @@ function EventCard({
             {formatDayLabel(weekDays[0], locale)} - {formatDayLabel(weekDays[weekDays.length - 1], locale)}
           </p>
         </div>
-        <div className="flex items-center gap-2">
-          <Button variant="outline" size="sm" onClick={onPreviousWeek} disabled={refreshing}>
+        <div className="flex flex-wrap items-center gap-2">
+          <Button variant="outline" size="sm" className="h-11" onClick={onPreviousWeek} disabled={refreshing}>
             {t('上一周', 'Previous week')}
           </Button>
-          <Button variant="outline" size="sm" onClick={onCurrentWeek} disabled={refreshing}>
+          <Button variant="outline" size="sm" className="h-11" onClick={onCurrentWeek} disabled={refreshing}>
             {t('本周', 'This week')}
           </Button>
-          <Button variant="outline" size="sm" onClick={onNextWeek} disabled={refreshing}>
+          <Button variant="outline" size="sm" className="h-11" onClick={onNextWeek} disabled={refreshing}>
             {t('下一周', 'Next week')}
           </Button>
-          <Button variant="ghost" size="sm" onClick={onRefresh} disabled={refreshing}>
+          <Button variant="ghost" size="sm" className="h-11 w-11 p-0" aria-label={t('刷新日程', 'Refresh calendar')} title={t('刷新日程', 'Refresh calendar')} onClick={onRefresh} disabled={refreshing}>
             <RefreshCw className={`h-4 w-4 ${refreshing ? 'animate-spin' : ''}`} />
           </Button>
         </div>
@@ -1397,7 +1418,7 @@ function EventCard({
         ) : (
           <div className="grid gap-3 lg:grid-cols-2 2xl:grid-cols-3">
             {eventsByDay.map((day) => (
-              <div key={day.key} className="rounded-2xl border bg-card p-4">
+              <div key={day.key} className="min-w-0 rounded-2xl border bg-card p-4">
                 <div className="flex items-center justify-between gap-3">
                   <div>
                     <p className="font-medium text-foreground">{day.label}</p>
@@ -1413,13 +1434,13 @@ function EventCard({
                         key={item.id || `${item.subject}-${item.start?.dateTime}`}
                         type="button"
                         onClick={() => onOpen(item)}
-                        className="w-full rounded-xl border bg-background p-3 text-left transition-colors hover:bg-muted/40"
+                        className="min-h-11 w-full rounded-xl border bg-background p-3 text-left transition-colors hover:bg-muted/40"
                       >
-                        <p className="font-medium text-foreground">{item.subject || t('(无主题)', '(No subject)')}</p>
+                        <p className="break-words font-medium text-foreground">{item.subject || t('(无主题)', '(No subject)')}</p>
                         <p className="mt-1 text-xs text-muted-foreground">
                           {formatTime(item.start?.dateTime, locale)} - {formatTime(item.end?.dateTime, locale)}
                         </p>
-                        <p className="mt-2 text-sm text-muted-foreground">
+                        <p className="mt-2 break-words text-sm text-muted-foreground">
                           {item.location?.displayName || t('未设置地点', 'No location set')}
                         </p>
                       </button>
diff --git a/app-instance/frontend/app/(app)/page.tsx b/app-instance/frontend/app/(app)/page.tsx
index 169c869..9ed2e01 100644
--- a/app-instance/frontend/app/(app)/page.tsx
+++ b/app-instance/frontend/app/(app)/page.tsx
@@ -2,15 +2,24 @@
 
 import Link from 'next/link';
 import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
-import { Brain, Plus, Send, Trash2, X } from 'lucide-react';
+import { Brain, Menu, Plus, Send, Trash2, X } from 'lucide-react';
 
 import { ChatWorkbench } from '@/components/chat-workbench/ChatWorkbench';
 import { CurrentSessionProgressSidebar } from '@/components/chat-workbench/CurrentSessionProgressSidebar';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
 import { ScrollArea } from '@/components/ui/scroll-area';
 import {
   archiveSession,
   createSession,
   getActiveTask,
+  getBackendTask,
   getSession,
   getSessionProcess,
   listSessions,
@@ -27,9 +36,9 @@ import {
 } from '@/lib/chat-messages';
 import { pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
-import { buildSessionProgressView } from '@/lib/session-progress';
 import { useChatStore } from '@/lib/store';
-import type { ActiveTask, ChatMessage, FileAttachment, SessionUpdatedEvent, WsEvent } from '@/types';
+import { buildTaskTimelineView } from '@/lib/task-timeline-view';
+import type { ActiveTask, BackendTask, ChatMessage, FileAttachment, SessionUpdatedEvent, WsEvent } from '@/types';
 
 function isSessionUpdatedEvent(data: WsEvent | Record<string, unknown>): data is SessionUpdatedEvent {
   return data.type === 'session_updated' && typeof data.session_id === 'string';
@@ -86,13 +95,17 @@ export default function ChatPage() {
   const [thinkingModeEnabled, setThinkingModeEnabled] = useState(loadThinkingModePreference);
   const [pendingFiles, setPendingFiles] = useState<Array<{ file: File; id?: string; progress: number; error?: string }>>([]);
   const [activeTask, setActiveTask] = useState<ActiveTask | null>(null);
+  const [activeTaskDetail, setActiveTaskDetail] = useState<BackendTask | null>(null);
   const [revisionTargetRunId, setRevisionTargetRunId] = useState<string | null>(null);
   const [documentHidden, setDocumentHidden] = useState(isDocumentHidden);
+  const [sessionDrawerOpen, setSessionDrawerOpen] = useState(false);
+  const [archiveTargetSessionId, setArchiveTargetSessionId] = useState<string | null>(null);
   const messagesEndRef = useRef<HTMLDivElement>(null);
   const messageViewportRef = useRef<HTMLDivElement>(null);
   const textareaRef = useRef<HTMLTextAreaElement>(null);
   const fileInputRef = useRef<HTMLInputElement>(null);
   const loadSessionReqSeq = useRef(0);
+  const loadActiveTaskReqSeq = useRef(0);
   const loadedSessionIdRef = useRef<string | null>(null);
   const refreshSessionOnReconnectRef = useRef(false);
   const hasConnectedRef = useRef(false);
@@ -120,16 +133,15 @@ export default function ChatPage() {
   );
 
   const selectedSessionRunId = selectedRunId && sessionRunIds.has(selectedRunId) ? selectedRunId : null;
-  const sessionProgressView = useMemo(
+  const activeTaskTimelineView = useMemo(
     () =>
-      buildSessionProgressView({
-        sessionId,
-        processRuns,
-        processEvents,
-        processArtifacts,
-        locale,
+      buildTaskTimelineView({
+        task: activeTaskDetail,
+        liveRuns: processRuns,
+        liveEvents: processEvents,
+        liveArtifacts: processArtifacts,
       }),
-    [locale, processArtifacts, processEvents, processRuns, sessionId]
+    [activeTaskDetail, processArtifacts, processEvents, processRuns]
   );
 
   const loadSessions = useCallback(async () => {
@@ -142,12 +154,34 @@ export default function ChatPage() {
   }, []);
 
   const loadActiveTask = useCallback(async (key: string) => {
+    const reqSeq = ++loadActiveTaskReqSeq.current;
     try {
-      if (useChatStore.getState().sessionId !== key) return;
-      setActiveTask(await getActiveTask(key));
+      const nextActiveTask = await getActiveTask(key);
+      if (reqSeq !== loadActiveTaskReqSeq.current || useChatStore.getState().sessionId !== key) return;
+      setActiveTask(nextActiveTask);
+      if (!nextActiveTask) {
+        setActiveTaskDetail(null);
+        return;
+      }
+      setActiveTaskDetail((current) => (current?.task_id === nextActiveTask.task_id ? current : null));
+      try {
+        const detail = await getBackendTask(nextActiveTask.task_id);
+        if (reqSeq !== loadActiveTaskReqSeq.current || useChatStore.getState().sessionId !== key) return;
+        if (detail.is_open === false) {
+          setActiveTask(null);
+          setActiveTaskDetail(null);
+          return;
+        }
+        setActiveTaskDetail(detail);
+      } catch {
+        if (reqSeq === loadActiveTaskReqSeq.current && useChatStore.getState().sessionId === key) {
+          setActiveTaskDetail(null);
+        }
+      }
     } catch {
-      if (useChatStore.getState().sessionId === key) {
+      if (reqSeq === loadActiveTaskReqSeq.current && useChatStore.getState().sessionId === key) {
         setActiveTask(null);
+        setActiveTaskDetail(null);
       }
     }
   }, []);
@@ -194,6 +228,7 @@ export default function ChatPage() {
       setIsThinking(false);
     }
     setActiveTask(null);
+    setActiveTaskDetail(null);
     setRevisionTargetRunId(null);
     setInput(useChatStore.getState().getInputDraft(sessionId));
     void loadSessionMessages(sessionId);
@@ -299,6 +334,7 @@ export default function ChatPage() {
 
   useEffect(() => {
     shouldSnapToLatestRef.current = true;
+    setSessionDrawerOpen(false);
   }, [sessionId]);
 
   useLayoutEffect(() => {
@@ -474,6 +510,7 @@ export default function ChatPage() {
     setSessionId(id);
     setSelectedRunId(null);
     setActiveTask(null);
+    setActiveTaskDetail(null);
     setRevisionTargetRunId(null);
     clearInputDraft(id);
     setInput('');
@@ -487,14 +524,15 @@ export default function ChatPage() {
     void loadSessions();
   };
 
-  const handleArchiveSession = async (key: string, e: React.MouseEvent) => {
-    e.stopPropagation();
+  const handleArchiveSession = async (key: string) => {
     try {
       await archiveSession(key);
+      setArchiveTargetSessionId(null);
       useChatStore.getState().setSessions(useChatStore.getState().sessions.filter((session) => session.key !== key));
       if (key === sessionId) {
         setSessionId('web:default');
         setActiveTask(null);
+        setActiveTaskDetail(null);
         setRevisionTargetRunId(null);
         clearInputDraft(key);
         setInput(useChatStore.getState().getInputDraft('web:default'));
@@ -514,9 +552,11 @@ export default function ChatPage() {
   const handleSelectSession = (key: string) => {
     setSelectedRunId(null);
     setActiveTask(null);
+    setActiveTaskDetail(null);
     setRevisionTargetRunId(null);
     setInput(useChatStore.getState().getInputDraft(key));
     setSessionId(key);
+    setSessionDrawerOpen(false);
   };
 
   const removePendingFile = useCallback((file: File) => {
@@ -551,53 +591,101 @@ export default function ChatPage() {
     return key;
   };
 
-  return (
-    <div className="flex h-[calc(100vh-4rem)] bg-background">
-      <aside className="flex w-[280px] shrink-0 flex-col border-r border-[#E6E1DE] bg-[#F7F6F5]">
-        <div className="px-5 pb-5 pt-6">
-          <button
-            type="button"
-            onClick={handleNewSession}
-            className="flex h-11 w-full items-center justify-center gap-2 rounded-full bg-primary px-4 text-sm font-medium text-primary-foreground transition-colors hover:bg-[#342E2B]"
-          >
-            <Plus className="h-4 w-4" />
-            {pickAppText(locale, '新对话', 'New chat')}
-          </button>
-        </div>
-        <ScrollArea className="flex-1">
-          <div className="space-y-3 px-3 pb-6">
-            <div className="px-3 pb-2 text-[14px] text-muted-foreground">{pickAppText(locale, '最近对话', 'Recent chats')}</div>
-            {sessions.length === 0 && (
-              <p className="px-3 py-4 text-sm text-muted-foreground">{pickAppText(locale, '暂无对话记录', 'No chat history yet')}</p>
-            )}
-            {sessions.map((session) => (
+  const archiveTargetSessionName = archiveTargetSessionId ? formatSessionName(archiveTargetSessionId) : '';
+
+  const renderSessionSidebar = (variant: 'desktop' | 'drawer') => (
+    <>
+      <div className="px-5 pb-5 pt-6">
+        <button
+          type="button"
+          onClick={() => {
+            setSessionDrawerOpen(false);
+            void handleNewSession();
+          }}
+          className="flex h-11 w-full items-center justify-center gap-2 rounded-full bg-primary px-4 text-sm font-medium text-primary-foreground transition-colors hover:bg-[#342E2B]"
+        >
+          <Plus className="h-4 w-4" />
+          {pickAppText(locale, '新对话', 'New chat')}
+        </button>
+      </div>
+      <ScrollArea className="flex-1">
+        <div className="space-y-3 px-3 pb-6">
+          <div className="px-3 pb-2 text-[14px] text-muted-foreground">{pickAppText(locale, '最近对话', 'Recent chats')}</div>
+          {sessions.length === 0 && (
+            <p className="px-3 py-4 text-sm text-muted-foreground">{pickAppText(locale, '暂无对话记录', 'No chat history yet')}</p>
+          )}
+          {sessions.map((session) => {
+            const sessionName = formatSessionName(session.key);
+            const isCurrent = session.key === sessionId;
+
+            return (
               <div
-                key={session.key}
-                onClick={() => handleSelectSession(session.key)}
-                className={`group flex cursor-pointer items-center justify-between rounded-xl px-4 py-3 text-[15px] transition-colors ${
-                  session.key === sessionId
+                key={`${variant}:${session.key}`}
+                className={`group flex items-center gap-1 rounded-xl px-2 py-1 text-[15px] transition-colors ${
+                  isCurrent
                     ? 'bg-[#EFEEED] text-foreground'
-                    : 'text-foreground hover:bg-[#EFEEED]/70'
+                    : 'text-foreground hover:bg-[#EFEEED]/70 focus-within:bg-[#EFEEED]/70'
                 }`}
               >
-                <div className="truncate">
-                  <span className="truncate">{formatSessionName(session.key)}</span>
-                </div>
-                  <button
-                  onClick={(event) => handleArchiveSession(session.key, event)}
-                  className="opacity-0 group-hover:opacity-100 p-0.5 hover:text-destructive transition-opacity"
-                  title={pickAppText(locale, '归档会话', 'Archive session')}
-                  aria-label={pickAppText(locale, '归档会话', 'Archive session')}
+                <button
+                  type="button"
+                  onClick={() => handleSelectSession(session.key)}
+                  className="flex h-11 min-w-0 flex-1 items-center rounded-lg px-2 text-left outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                  aria-current={isCurrent ? 'true' : undefined}
                 >
-                  <Trash2 className="w-3.5 h-3.5" />
+                  <span className="truncate">{sessionName}</span>
+                </button>
+                <button
+                  type="button"
+                  onClick={() => setArchiveTargetSessionId(session.key)}
+                  className="flex h-11 w-11 shrink-0 items-center justify-center rounded-lg text-muted-foreground opacity-100 transition-colors hover:bg-white hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring md:opacity-0 md:group-hover:opacity-100 md:group-focus-within:opacity-100"
+                  title={pickAppText(locale, '归档会话', 'Archive session')}
+                  aria-label={pickAppText(locale, `归档会话 ${sessionName}`, `Archive session ${sessionName}`)}
+                >
+                  <Trash2 className="h-4 w-4" />
                 </button>
               </div>
-            ))}
-          </div>
-        </ScrollArea>
+            );
+          })}
+        </div>
+      </ScrollArea>
+    </>
+  );
+
+  return (
+    <div className="relative flex h-[calc(100dvh-4rem)] overflow-hidden bg-background">
+      <aside className="hidden w-[280px] shrink-0 flex-col border-r border-[#E6E1DE] bg-[#F7F6F5] md:flex">
+        {renderSessionSidebar('desktop')}
       </aside>
 
+      {sessionDrawerOpen && (
+        <div className="fixed inset-x-0 bottom-0 top-16 z-40 md:hidden">
+          <button
+            type="button"
+            className="absolute inset-0 bg-black/30"
+            aria-label={pickAppText(locale, '关闭最近对话', 'Close recent chats')}
+            onClick={() => setSessionDrawerOpen(false)}
+          />
+          <aside className="absolute bottom-0 left-0 top-0 flex w-[min(86vw,320px)] flex-col border-r border-[#E6E1DE] bg-[#F7F6F5] shadow-2xl">
+            {renderSessionSidebar('drawer')}
+          </aside>
+        </div>
+      )}
+
       <div className="flex-1 flex flex-col min-w-0">
+        <div className="flex min-h-14 items-center gap-2 border-b border-[#E6E1DE] bg-[#F7F6F5] px-3 md:hidden">
+          <button
+            type="button"
+            onClick={() => setSessionDrawerOpen(true)}
+            className="flex h-11 w-11 items-center justify-center rounded-full border border-[#E6E1DE] bg-white text-[#1D1715]"
+            aria-label={pickAppText(locale, '打开最近对话', 'Open recent chats')}
+          >
+            <Menu className="h-5 w-5" />
+          </button>
+          <div className="min-w-0 text-sm font-medium text-foreground">
+            <span className="block truncate">{formatSessionName(sessionId)}</span>
+          </div>
+        </div>
         <div className="flex-1 min-h-0">
           <ChatWorkbench
             messages={messages}
@@ -614,14 +702,14 @@ export default function ChatPage() {
           />
         </div>
 
-        <div className="bg-background px-8 pb-8 pt-4">
+        <div className="bg-background px-3 pb-4 pt-3 sm:px-5 sm:pb-6 md:px-8 md:pb-8 md:pt-4">
           <div className="mx-auto max-w-5xl">
             {(activeTask || revisionTargetRunId) && (
               <div className="mb-2 flex">
                 {activeTask ? (
                   <Link
                     href={`/tasks/${encodeURIComponent(activeTask.task_id)}`}
-                    className="inline-flex max-w-full items-center gap-2 rounded-full border border-[#D8D2CE] bg-[#F7F6F5] px-3 py-1.5 text-xs text-foreground transition-colors hover:bg-[#EFEEED]"
+                    className="inline-flex h-11 max-w-full items-center gap-2 rounded-full border border-[#D8D2CE] bg-[#F7F6F5] px-3 text-xs text-foreground transition-colors hover:bg-[#EFEEED]"
                     title={activeTask.description}
                   >
                     <span className="shrink-0 text-muted-foreground">
@@ -638,7 +726,7 @@ export default function ChatPage() {
             {pendingFiles.length > 0 && (
               <div className="mb-2 space-y-1">
                 {pendingFiles.map((item, index) => (
-                  <div key={`${item.file.name}:${index}`} className="flex items-center gap-2 px-3 py-1.5 bg-muted rounded-md text-sm">
+                  <div key={`${item.file.name}:${index}`} className="flex min-h-11 items-center gap-2 rounded-md bg-muted px-3 py-1.5 text-sm">
                     <span className="truncate flex-1">
                       {item.file.name}{' '}
                       <span className="text-muted-foreground">({(item.file.size / 1024).toFixed(0)}KB)</span>
@@ -652,8 +740,13 @@ export default function ChatPage() {
                     ) : (
                       <span className="text-[#657162] text-xs">{pickAppText(locale, '就绪', 'Ready')}</span>
                     )}
-                    <button onClick={() => removePendingFile(item.file)} className="text-muted-foreground hover:text-foreground">
-                      <X className="w-3.5 h-3.5" />
+                    <button
+                      type="button"
+                      onClick={() => removePendingFile(item.file)}
+                      className="flex h-11 w-11 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-background hover:text-foreground"
+                      aria-label={pickAppText(locale, `移除附件 ${item.file.name}`, `Remove attachment ${item.file.name}`)}
+                    >
+                      <X className="h-4 w-4" />
                     </button>
                   </div>
                 ))}
@@ -662,8 +755,14 @@ export default function ChatPage() {
 
             <div className="relative rounded-[28px] border border-[#E6E1DE] bg-white p-4 shadow-[0_8px_24px_rgba(0,0,0,0.08)]">
               <input ref={fileInputRef} type="file" multiple className="hidden" onChange={handleFileSelect} />
+              <label htmlFor="chat-composer" className="sr-only">
+                {revisionTargetRunId
+                  ? pickAppText(locale, '修改要求', 'Revision request')
+                  : pickAppText(locale, '消息内容', 'Message content')}
+              </label>
 
               <textarea
+                id="chat-composer"
                 ref={textareaRef}
                 value={input}
                 onChange={(e) => {
@@ -677,7 +776,7 @@ export default function ChatPage() {
                     : pickAppText(locale, '今天想聊什么？', 'What would you like to talk about today?')
                 }
                 rows={1}
-                className="block w-full resize-none border-0 bg-transparent px-2 pb-8 pt-1 text-[17px] leading-7 placeholder:text-muted-foreground focus:outline-none disabled:cursor-not-allowed disabled:opacity-50"
+                className="block w-full resize-none border-0 bg-transparent px-1 pb-8 pt-1 text-[16px] leading-7 placeholder:text-muted-foreground focus:outline-none disabled:cursor-not-allowed disabled:opacity-50 sm:px-2 sm:text-[17px]"
                 style={{ minHeight: '72px', maxHeight: '200px' }}
                 onInput={(e) => {
                   const target = e.target as HTMLTextAreaElement;
@@ -687,18 +786,20 @@ export default function ChatPage() {
               />
 
               <div className="flex items-center justify-between">
-                <div className="flex items-center gap-5 text-[15px] text-muted-foreground">
+                <div className="flex items-center gap-2 text-[15px] text-muted-foreground sm:gap-5">
                   <button
+                    type="button"
                     onClick={() => fileInputRef.current?.click()}
-                    className="inline-flex items-center gap-2 text-foreground transition-colors hover:text-muted-foreground"
+                    className="inline-flex h-11 w-11 items-center justify-center rounded-full text-foreground transition-colors hover:bg-[#F7F5F4] hover:text-muted-foreground"
                     title={pickAppText(locale, '添加附件', 'Add attachment')}
+                    aria-label={pickAppText(locale, '添加附件', 'Add attachment')}
                   >
                     <Plus className="h-5 w-5" />
                   </button>
                   <button
                     type="button"
                     onClick={toggleThinkingMode}
-                    className={`inline-flex h-8 items-center gap-2 rounded-full border px-3 text-sm transition-colors ${
+                    className={`inline-flex h-11 items-center gap-2 rounded-full border px-3 text-sm transition-colors ${
                       thinkingModeEnabled
                         ? 'border-primary/40 bg-[#F1EFEE] text-foreground'
                         : 'border-[#E6E1DE] bg-white text-muted-foreground hover:text-foreground'
@@ -729,7 +830,43 @@ export default function ChatPage() {
         </div>
       </div>
 
-      {sessionProgressView && <CurrentSessionProgressSidebar view={sessionProgressView} />}
+      <Dialog open={Boolean(archiveTargetSessionId)} onOpenChange={(open) => !open && setArchiveTargetSessionId(null)}>
+        <DialogContent className="max-w-[calc(100vw-2rem)] sm:max-w-md">
+          <DialogHeader>
+            <DialogTitle>{pickAppText(locale, '归档此会话？', 'Archive this chat?')}</DialogTitle>
+            <DialogDescription>
+              {pickAppText(
+                locale,
+                archiveTargetSessionName ? `会话「${archiveTargetSessionName}」会从最近对话中移除。` : '此会话会从最近对话中移除。',
+                archiveTargetSessionName ? `Chat "${archiveTargetSessionName}" will be removed from recent chats.` : 'This chat will be removed from recent chats.'
+              )}
+            </DialogDescription>
+          </DialogHeader>
+          <DialogFooter className="gap-2 sm:gap-2">
+            <button
+              type="button"
+              onClick={() => setArchiveTargetSessionId(null)}
+              className="h-11 rounded-md border border-border px-4 text-sm text-muted-foreground hover:bg-accent"
+            >
+              {pickAppText(locale, '取消', 'Cancel')}
+            </button>
+            <button
+              type="button"
+              onClick={() => archiveTargetSessionId && void handleArchiveSession(archiveTargetSessionId)}
+              className="h-11 rounded-md bg-destructive px-4 text-sm font-medium text-destructive-foreground hover:bg-destructive/90"
+            >
+              {pickAppText(locale, '确认归档', 'Confirm archive')}
+            </button>
+          </DialogFooter>
+        </DialogContent>
+      </Dialog>
+
+      {activeTaskDetail ? (
+        <CurrentSessionProgressSidebar
+          cards={activeTaskTimelineView?.cards ?? []}
+          isLive={Boolean(activeTaskDetail.is_open && wsStatus === 'connected')}
+        />
+      ) : null}
     </div>
   );
 }
diff --git a/app-instance/frontend/app/(app)/skills/page.tsx b/app-instance/frontend/app/(app)/skills/page.tsx
index caaaecc..6d23e35 100644
--- a/app-instance/frontend/app/(app)/skills/page.tsx
+++ b/app-instance/frontend/app/(app)/skills/page.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import React, { useCallback, useEffect, useRef, useState } from 'react';
+import { usePathname, useRouter, useSearchParams } from 'next/navigation';
 import {
   AlertCircle,
   BarChart3,
@@ -77,13 +78,25 @@ import { containedJsonTextClass, containedLongTextClass } from '@/lib/text-wrapp
 
 const TERMINAL_DRAFT_STATUSES = new Set(['rejected', 'published', 'disabled', 'archived']);
 const REJECTABLE_DRAFT_STATUSES = new Set(['draft', 'in_review', 'approved']);
+type SkillsTab = 'published' | 'candidates' | 'drafts';
+
+function normalizeSkillsTab(value: string | null | undefined): SkillsTab {
+  if (value === 'candidates' || value === 'drafts') {
+    return value;
+  }
+  return 'published';
+}
 
 export default function SkillsPage() {
   const { locale } = useAppI18n();
+  const pathname = usePathname();
+  const router = useRouter();
+  const searchParams = useSearchParams();
   const t = (zh: string, en: string) => pickAppText(locale, zh, en);
   const [skills, setSkills] = useState<Skill[]>([]);
   const [candidates, setCandidates] = useState<SkillLearningCandidate[]>([]);
   const [drafts, setDrafts] = useState<SkillDraft[]>([]);
+  const [activeTab, setActiveTab] = useState<SkillsTab>(() => normalizeSkillsTab(searchParams?.get('tab')));
   const [loading, setLoading] = useState(true);
   const [actionId, setActionId] = useState<string | null>(null);
   const [error, setError] = useState<string | null>(null);
@@ -119,6 +132,23 @@ export default function SkillsPage() {
     void load();
   }, [load]);
 
+  useEffect(() => {
+    setActiveTab(normalizeSkillsTab(searchParams?.get('tab')));
+  }, [searchParams]);
+
+  const changeTab = (value: string) => {
+    const nextTab = normalizeSkillsTab(value);
+    setActiveTab(nextTab);
+    const nextParams = new URLSearchParams(searchParams?.toString());
+    if (nextTab === 'published') {
+      nextParams.delete('tab');
+    } else {
+      nextParams.set('tab', nextTab);
+    }
+    const query = nextParams.toString();
+    router.replace(query ? `${pathname}?${query}` : pathname, { scroll: false });
+  };
+
   const runAction = async (id: string, action: () => Promise<unknown>) => {
     setActionId(id);
     setError(null);
@@ -193,18 +223,18 @@ export default function SkillsPage() {
   }
 
   return (
-    <div className="mx-auto max-w-6xl space-y-6 bg-white p-6 text-black [--background:0_0%_100%] [--card:0_0%_100%] [--card-foreground:0_0%_0%] [--foreground:0_0%_0%] [--muted-foreground:0_0%_0%] [--popover:0_0%_100%] [--popover-foreground:0_0%_0%] [--secondary-foreground:0_0%_0%]">
+    <div className="mx-auto w-full max-w-6xl space-y-6 overflow-x-hidden bg-white px-4 py-6 text-black [--background:0_0%_100%] [--card:0_0%_100%] [--card-foreground:0_0%_0%] [--foreground:0_0%_0%] [--muted-foreground:0_0%_0%] [--popover:0_0%_100%] [--popover-foreground:0_0%_0%] [--secondary-foreground:0_0%_0%] sm:px-6">
       <div className="flex flex-wrap items-center justify-between gap-3">
         <h1 className="flex items-center gap-2 text-2xl font-bold">
           <Puzzle className="w-6 h-6" />
           {t('技能', 'Skills')}
         </h1>
-        <div className="flex items-center gap-2">
-          <Button onClick={() => void load()} variant="outline" size="sm">
+        <div className="flex flex-wrap items-center gap-2">
+          <Button onClick={() => void load()} variant="outline" size="sm" className="h-11">
             <RefreshCw className="mr-2 h-4 w-4" />
             {t('刷新', 'Refresh')}
           </Button>
-          <Button onClick={() => setShowUpload(true)} size="sm">
+          <Button onClick={() => setShowUpload(true)} size="sm" className="h-11">
             <Upload className="mr-2 h-4 w-4" />
             {t('上传技能', 'Upload skill')}
           </Button>
@@ -238,6 +268,7 @@ export default function SkillsPage() {
           <Button
             variant="ghost"
             size="sm"
+            className="h-11"
             onClick={() => {
               setSelectedSkillName(null);
               setSkillDetail(null);
@@ -277,19 +308,20 @@ export default function SkillsPage() {
               }
               actions={
                 <div className="flex flex-wrap gap-2">
-                  <Button variant="outline" size="sm" onClick={() => downloadSkill(skillDetail.skill.name).catch((err) => setError(err.message))}>
+                  <Button variant="outline" size="sm" className="h-11" onClick={() => downloadSkill(skillDetail.skill.name).catch((err) => setError(err.message))}>
                     <Download className="mr-2 h-4 w-4" />
                     {t('下载', 'Download')}
                   </Button>
                   {skillDetail.skill.source === 'workspace' && (
                     <>
-                      <Button variant="outline" size="sm" onClick={() => onRollbackSkill(skillDetail.skill.name)}>
+                      <Button variant="outline" size="sm" className="h-11" onClick={() => onRollbackSkill(skillDetail.skill.name)}>
                         <RefreshCw className="mr-2 h-4 w-4" />
                         {t('回滚', 'Rollback')}
                       </Button>
                       <Button
                         variant="outline"
                         size="sm"
+                        className="h-11"
                         disabled={Boolean(actionId)}
                         onClick={() => void runAction(`disable:${skillDetail.skill.name}`, () => disablePublishedSkill(skillDetail.skill.name, t('人工禁用', 'Manual disable')))}
                       >
@@ -299,7 +331,7 @@ export default function SkillsPage() {
                       <Button
                         variant="outline"
                         size="sm"
-                        className="text-destructive hover:text-destructive"
+                        className="h-11 text-destructive hover:text-destructive"
                         disabled={Boolean(actionId)}
                         onClick={() => void runAction(`delete:${skillDetail.skill.name}`, () => deleteSkill(skillDetail.skill.name)).then(() => {
                           setSelectedSkillName(null);
@@ -330,14 +362,14 @@ export default function SkillsPage() {
       )}
 
       {!selectedSkillName && (
-        <Tabs defaultValue="published" className="space-y-4">
-        <TabsList>
-          <TabsTrigger value="published">{t('已发布', 'Published')}</TabsTrigger>
-          <TabsTrigger value="candidates">{t('候选', 'Candidates')}</TabsTrigger>
-          <TabsTrigger value="drafts">{t('草稿评审', 'Draft review')}</TabsTrigger>
+        <Tabs value={activeTab} onValueChange={changeTab} className="min-w-0 space-y-4">
+        <TabsList className="h-auto min-h-11 w-full max-w-full justify-start overflow-x-auto sm:w-auto">
+          <TabsTrigger value="published" className="h-10">{t('已发布', 'Published')}</TabsTrigger>
+          <TabsTrigger value="candidates" className="h-10">{t('候选', 'Candidates')}</TabsTrigger>
+          <TabsTrigger value="drafts" className="h-10">{t('草稿评审', 'Draft review')}</TabsTrigger>
         </TabsList>
 
-        <TabsContent value="published">
+        <TabsContent value="published" className="min-w-0">
           <PublishedSkillsTable
             skills={skills}
             onOpen={(name) => void openSkillDetail(name)}
@@ -350,7 +382,7 @@ export default function SkillsPage() {
           />
         </TabsContent>
 
-        <TabsContent value="candidates">
+        <TabsContent value="candidates" className="min-w-0">
           <Card>
             <CardHeader>
               <CardTitle className="text-base">{t('学习候选', 'Learning candidates')}</CardTitle>
@@ -384,7 +416,7 @@ export default function SkillsPage() {
           </Card>
         </TabsContent>
 
-        <TabsContent value="drafts">
+        <TabsContent value="drafts" className="min-w-0">
           <Card>
             <CardHeader>
               <CardTitle className="text-base">{t('草稿、评审与发布', 'Drafts, review, and publish')}</CardTitle>
@@ -473,6 +505,54 @@ function PublishedSkillsTable({
         {skills.length === 0 ? (
           <EmptyState icon={<Puzzle className="h-8 w-8" />} text={t('暂无技能', 'No skills yet')} />
         ) : (
+          <>
+          <div className="space-y-3 p-3 md:hidden">
+            {skills.map((skill) => (
+              <div key={`${skill.source}:${skill.name}:card`} className="min-w-0 rounded-lg border border-border bg-white p-4">
+                <button
+                  type="button"
+                  className="block min-h-11 w-full text-left"
+                  onClick={() => onOpen(skill.name)}
+                >
+                  <div className={`text-sm font-semibold ${containedLongTextClass}`}>{skill.name}</div>
+                  <div className={`mt-1 text-sm leading-5 text-muted-foreground ${containedLongTextClass}`}>
+                    {skill.description || '-'}
+                  </div>
+                </button>
+                <div className="mt-3 flex flex-wrap gap-2">
+                  <Badge variant={skill.source === 'builtin' ? 'secondary' : 'default'} className="text-xs">
+                    {skill.source === 'builtin' ? t('内置', 'Built in') : t('工作区', 'Workspace')}
+                  </Badge>
+                  <Badge variant={skill.available ? 'default' : 'outline'} className="text-xs">
+                    {skill.available ? t('可用', 'Available') : t('不可用', 'Unavailable')}
+                  </Badge>
+                </div>
+                <div className="mt-3 flex flex-wrap gap-2">
+                  <Button variant="outline" size="sm" className="h-11" onClick={() => onDownload(skill.name)}>
+                    <Download className="mr-2 h-4 w-4" />
+                    {t('下载', 'Download')}
+                  </Button>
+                  {skill.source === 'workspace' && (
+                    <>
+                      <Button variant="outline" size="sm" className="h-11" onClick={() => onRollback(skill.name)}>
+                        <RefreshCw className="mr-2 h-4 w-4" />
+                        {t('回滚', 'Rollback')}
+                      </Button>
+                      <Button variant="outline" size="sm" className="h-11" onClick={() => onDisable(skill.name)}>
+                        <ShieldCheck className="mr-2 h-4 w-4" />
+                        {t('禁用', 'Disable')}
+                      </Button>
+                      <Button variant="outline" size="sm" className="h-11 text-destructive hover:text-destructive" onClick={() => onDelete(skill.name)}>
+                        <Trash2 className="mr-2 h-4 w-4" />
+                        {t('删除', 'Delete')}
+                      </Button>
+                    </>
+                  )}
+                </div>
+              </div>
+            ))}
+          </div>
+          <div className="hidden md:block">
           <Table>
             <TableHeader>
               <TableRow>
@@ -490,7 +570,7 @@ function PublishedSkillsTable({
                   className="cursor-pointer"
                   onClick={() => onOpen(skill.name)}
                 >
-                  <TableCell className="font-medium">{skill.name}</TableCell>
+                  <TableCell className={`font-medium ${containedLongTextClass}`}>{skill.name}</TableCell>
                   <TableCell>
                     <span className="block max-w-[360px] truncate text-sm text-muted-foreground">
                       {skill.description}
@@ -508,7 +588,14 @@ function PublishedSkillsTable({
                   </TableCell>
                   <TableCell>
                     <div className="flex items-center gap-1">
-                      <Button variant="ghost" size="icon" className="h-7 w-7" onClick={(event) => { event.stopPropagation(); onDownload(skill.name); }}>
+                      <Button
+                        variant="ghost"
+                        size="icon"
+                        className="h-11 w-11"
+                        aria-label={t('下载', 'Download')}
+                        title={t('下载', 'Download')}
+                        onClick={(event) => { event.stopPropagation(); onDownload(skill.name); }}
+                      >
                         <Download className="h-3.5 w-3.5" />
                       </Button>
                       {skill.source === 'workspace' && (
@@ -516,7 +603,9 @@ function PublishedSkillsTable({
                           <Button
                             variant="ghost"
                             size="icon"
-                            className="h-7 w-7"
+                            className="h-11 w-11"
+                            aria-label={t('回滚', 'Rollback')}
+                            title={t('回滚', 'Rollback')}
                             onClick={(event) => {
                               event.stopPropagation();
                               onRollback(skill.name);
@@ -527,7 +616,9 @@ function PublishedSkillsTable({
                           <Button
                             variant="ghost"
                             size="icon"
-                            className="h-7 w-7"
+                            className="h-11 w-11"
+                            aria-label={t('禁用', 'Disable')}
+                            title={t('禁用', 'Disable')}
                             onClick={(event) => {
                               event.stopPropagation();
                               onDisable(skill.name);
@@ -538,7 +629,9 @@ function PublishedSkillsTable({
                           <Button
                             variant="ghost"
                             size="icon"
-                            className="h-7 w-7 text-destructive hover:text-destructive"
+                            className="h-11 w-11 text-destructive hover:text-destructive"
+                            aria-label={t('删除', 'Delete')}
+                            title={t('删除', 'Delete')}
                             onClick={(event) => {
                               event.stopPropagation();
                               onDelete(skill.name);
@@ -554,6 +647,8 @@ function PublishedSkillsTable({
               ))}
             </TableBody>
           </Table>
+          </div>
+          </>
         )}
       </CardContent>
     </Card>
@@ -590,7 +685,7 @@ function CandidateCard({
     : null;
 
   return (
-    <div className="rounded-lg border border-border bg-white p-4">
+    <div className="min-w-0 max-w-full rounded-lg border border-border bg-white p-4">
       <div className="flex flex-wrap items-start justify-between gap-4">
         <div className="min-w-0 flex-1 space-y-3">
           <div className="flex flex-wrap items-center gap-2">
@@ -607,7 +702,7 @@ function CandidateCard({
 
           <div>
             <h3 className="break-words text-base font-semibold tracking-normal">{title}</h3>
-            <p className="mt-1 text-sm leading-6 text-muted-foreground">
+            <p className={`mt-1 text-sm leading-6 text-muted-foreground ${containedLongTextClass}`}>
               {candidate.reason || t('没有提供候选理由。', 'No candidate reason was provided.')}
             </p>
           </div>
@@ -656,7 +751,7 @@ function CandidateCard({
           )}
 
           <div className="flex flex-wrap gap-2 text-xs text-muted-foreground">
-            <span className="font-mono">{candidate.candidate_id}</span>
+            <span className={`font-mono ${containedLongTextClass}`}>{candidate.candidate_id}</span>
             {String(evidence.task_id || '') && <span>{t('任务', 'Task')}: {String(evidence.task_id)}</span>}
             {String(evidence.skill_version || '') && <span>{t('基线版本', 'Base version')}: {String(evidence.skill_version)}</span>}
             {candidate.created_at && <span>{t('创建于', 'Created')}: {formatDateTime(candidate.created_at)}</span>}
@@ -666,11 +761,12 @@ function CandidateCard({
         </div>
 
         <div className="flex shrink-0 flex-wrap gap-2">
-          <Button size="sm" variant="outline" disabled={Boolean(actionId)} onClick={onIgnore}>
+          <Button size="sm" variant="outline" className="h-11" disabled={Boolean(actionId)} onClick={onIgnore}>
             {t('忽略', 'Ignore')}
           </Button>
           <Button
             size="sm"
+            className="h-11"
             disabled={Boolean(actionId)}
             onClick={() => void onSynthesize()}
           >
@@ -685,6 +781,7 @@ function CandidateCard({
             <Button
               size="sm"
               variant="outline"
+              className="h-11"
               disabled={Boolean(actionId)}
               onClick={() => void onRegenerate()}
             >
@@ -753,7 +850,7 @@ function DraftCard({
     void onPublish(isHighRisk);
   };
   return (
-    <div className="rounded-lg border border-border bg-white p-4">
+    <div className="min-w-0 max-w-full rounded-lg border border-border bg-white p-4">
       <div className="flex flex-wrap items-start justify-between gap-3">
         <div className="min-w-0 flex-1">
           <div className="flex flex-wrap items-center gap-2">
@@ -776,9 +873,9 @@ function DraftCard({
           </div>
           <div className="mt-2">
             <div className="text-xs font-medium text-muted-foreground">{t('技能名', 'Skill name')}</div>
-            <h3 className="break-words text-lg font-semibold tracking-normal">{draft.skill_name}</h3>
+            <h3 className={`text-lg font-semibold tracking-normal ${containedLongTextClass}`}>{draft.skill_name}</h3>
           </div>
-          <p className="mt-1 text-sm leading-6 text-muted-foreground">
+          <p className={`mt-1 text-sm leading-6 text-muted-foreground ${containedLongTextClass}`}>
             {draft.reason || description || t('没有提供草稿说明。', 'No draft notes were provided.')}
           </p>
           <div className="mt-3 grid gap-3 md:grid-cols-3">
@@ -805,37 +902,37 @@ function DraftCard({
             </div>
           )}
           <div className="mt-3 flex flex-wrap gap-2 text-xs text-muted-foreground">
-            <span className="font-mono">{draft.skill_name}/{draft.draft_id}</span>
+            <span className={`font-mono ${containedLongTextClass}`}>{draft.skill_name}/{draft.draft_id}</span>
             <span>{t('创建者', 'Author')}: {draft.created_by}</span>
             <span>{t('创建于', 'Created')}: {formatDateTime(draft.created_at)}</span>
           </div>
         </div>
         <div className="flex flex-wrap gap-2">
-          <Button variant="outline" size="sm" disabled={busy || submitBlocked} onClick={() => void onSubmit()}>
+          <Button variant="outline" size="sm" className="h-11" disabled={busy || submitBlocked} onClick={() => void onSubmit()}>
             <Send className="mr-2 h-4 w-4" />
             {t('送审', 'Submit')}
           </Button>
-          <Button variant="outline" size="sm" disabled={busy || approveBlocked} onClick={() => void onApprove()}>
+          <Button variant="outline" size="sm" className="h-11" disabled={busy || approveBlocked} onClick={() => void onApprove()}>
             <Check className="mr-2 h-4 w-4" />
             {t('批准', 'Approve')}
           </Button>
-          <Button variant="outline" size="sm" disabled={busy || rejectBlocked} onClick={() => void onReject()}>
+          <Button variant="outline" size="sm" className="h-11" disabled={busy || rejectBlocked} onClick={() => void onReject()}>
             <XCircle className="mr-2 h-4 w-4" />
             {t('拒绝', 'Reject')}
           </Button>
-          <Button variant="outline" size="sm" disabled={busy || TERMINAL_DRAFT_STATUSES.has(draft.status)} onClick={() => void onRecheckSafety()}>
+          <Button variant="outline" size="sm" className="h-11" disabled={busy || TERMINAL_DRAFT_STATUSES.has(draft.status)} onClick={() => void onRecheckSafety()}>
             <ShieldCheck className="mr-2 h-4 w-4" />
             {t('复检', 'Recheck')}
           </Button>
-          <Button size="sm" disabled={busy || publishBlocked} onClick={handlePublish}>
+          <Button size="sm" className="h-11" disabled={busy || publishBlocked} onClick={handlePublish}>
             <Rocket className="mr-2 h-4 w-4" />
             {t('发布', 'Publish')}
           </Button>
         </div>
       </div>
 
-      <div className="mt-4 grid gap-3 lg:grid-cols-[minmax(0,1fr)_340px]">
-        <div className="rounded-md border border-border bg-muted/20 p-4">
+      <div className="mt-4 grid min-w-0 gap-3 lg:grid-cols-[minmax(0,1fr)_340px]">
+        <div className="min-w-0 max-w-full rounded-md border border-border bg-muted/20 p-3 sm:p-4">
           <div className="mb-3 flex flex-wrap items-center justify-between gap-2">
             <div className="flex items-center gap-2 text-sm font-medium">
               <FileText className="h-4 w-4 text-muted-foreground" />
@@ -858,7 +955,7 @@ function DraftCard({
           )}
         </div>
 
-        <div className="space-y-3">
+        <div className="min-w-0 space-y-3">
           <GateSummary
             title={t('发布门禁', 'Publish gates')}
             summary={canPublishLabel}
@@ -883,7 +980,7 @@ function DraftCard({
         </div>
       </div>
 
-      <div className="mt-3 grid gap-3 md:grid-cols-2">
+      <div className="mt-3 grid min-w-0 gap-3 md:grid-cols-2">
         <SafetyReportPanel report={safety} />
         <EvalReportPanel report={evalReport} />
       </div>
@@ -905,7 +1002,7 @@ function SafetyReportPanel({ report }: { report?: SkillDraftSafetyReport | null
   }
   const problems = [...(report.blocked_reasons || []), ...(report.issues || [])];
   return (
-    <div className="rounded-md border border-border bg-muted/20 p-4">
+    <div className="min-w-0 rounded-md border border-border bg-muted/20 p-4">
       <div className="mb-3 flex flex-wrap items-center justify-between gap-2">
         <div className="flex items-center gap-2 text-sm font-medium">
           {report.passed ? <ShieldCheck className="h-4 w-4 text-muted-foreground" /> : <ShieldAlert className="h-4 w-4 text-destructive" />}
@@ -922,7 +1019,7 @@ function SafetyReportPanel({ report }: { report?: SkillDraftSafetyReport | null
             {problems.map((item, index) => (
               <li key={`${item}:${index}`} className="flex gap-2">
                 <AlertCircle className="mt-1 h-3.5 w-3.5 shrink-0 text-destructive" />
-                <span>{item}</span>
+                <span className={containedLongTextClass}>{item}</span>
               </li>
             ))}
           </ul>
@@ -933,7 +1030,7 @@ function SafetyReportPanel({ report }: { report?: SkillDraftSafetyReport | null
         </p>
       )}
       {report.suggested_fix && (
-        <p className="mt-3 rounded-md border border-border bg-white p-3 text-sm">
+        <p className={`mt-3 rounded-md border border-border bg-white p-3 text-sm ${containedLongTextClass}`}>
           <span className="font-medium">{t('建议处理', 'Suggested fix')}:</span> {report.suggested_fix}
         </p>
       )}
@@ -957,7 +1054,7 @@ function EvalReportPanel({ report }: { report?: SkillDraftEvalReport | null }) {
   }
   if (report.status === 'skipped_provider_unavailable') {
     return (
-      <div className="rounded-md border border-border bg-muted/20 p-4">
+      <div className="min-w-0 rounded-md border border-border bg-muted/20 p-4">
         <div className="mb-2 flex items-center gap-2 text-sm font-medium">
           <BarChart3 className="h-4 w-4 text-muted-foreground" />
           {t('评估报告', 'Eval report')}
@@ -970,7 +1067,7 @@ function EvalReportPanel({ report }: { report?: SkillDraftEvalReport | null }) {
     );
   }
   return (
-    <div className="rounded-md border border-border bg-muted/20 p-4">
+    <div className="min-w-0 rounded-md border border-border bg-muted/20 p-4">
       <div className="mb-3 flex flex-wrap items-center justify-between gap-2">
         <div className="flex items-center gap-2 text-sm font-medium">
           <BarChart3 className="h-4 w-4 text-muted-foreground" />
@@ -1002,7 +1099,19 @@ function EvalReportPanel({ report }: { report?: SkillDraftEvalReport | null }) {
           <div className="border-b border-border px-3 py-2 text-xs font-medium text-muted-foreground">
             {t('回放案例', 'Replay cases')}
           </div>
-          <div className="max-h-48 overflow-auto">
+          <div className="space-y-2 p-3 md:hidden">
+            {report.cases.map((item, index) => (
+              <div key={`${String(item.run_id || index)}:${index}:card`} className="rounded-md border border-border bg-muted/20 p-3 text-xs">
+                <div className={`font-mono ${containedLongTextClass}`}>{String(item.run_id || '-')}</div>
+                <div className="mt-2 grid grid-cols-3 gap-2">
+                  <MetricTile label={t('基线', 'Baseline')} value={formatScore(toNumber(item.baseline_score))} />
+                  <MetricTile label={t('候选', 'Candidate')} value={formatScore(toNumber(item.candidate_score))} />
+                  <MetricTile label={t('变化', 'Delta')} value={formatSignedScore(toNumber(item.delta))} />
+                </div>
+              </div>
+            ))}
+          </div>
+          <div className="hidden max-h-48 overflow-auto md:block">
             <table className="w-full text-left text-xs">
               <thead className="bg-muted/40 text-muted-foreground">
                 <tr>
@@ -1042,7 +1151,7 @@ function GateSummary({
   items: Array<{ label: string; ok: boolean }>;
 }) {
   return (
-    <div className="rounded-md border border-border bg-muted/20 p-4">
+    <div className="min-w-0 rounded-md border border-border bg-muted/20 p-4">
       <div className="mb-2 flex items-center gap-2 text-sm font-medium">
         <ListChecks className="h-4 w-4 text-muted-foreground" />
         {title}
@@ -1070,7 +1179,7 @@ function ReadablePanel({
   empty: string;
 }) {
   return (
-    <div className="rounded-md border border-border bg-muted/20 p-4">
+    <div className="min-w-0 rounded-md border border-border bg-muted/20 p-4">
       <div className="mb-2 flex items-center gap-2 text-sm font-medium">
         {icon}
         {title}
@@ -1090,7 +1199,7 @@ function ReadableFact({
   value: string;
 }) {
   return (
-    <div className="rounded-md border border-border bg-white p-3">
+    <div className="min-w-0 rounded-md border border-border bg-white p-3">
       <div className="mb-1 flex items-center gap-2 text-xs font-medium text-muted-foreground">
         {icon}
         {label}
@@ -1111,7 +1220,7 @@ function MetricTile({
 }) {
   const toneClass = tone === 'bad' ? 'text-destructive' : 'text-foreground';
   return (
-    <div className="rounded-md border border-border bg-white p-3">
+    <div className="min-w-0 rounded-md border border-border bg-white p-3">
       <div className="text-xs font-medium text-muted-foreground">{label}</div>
       <div className={`mt-1 text-lg font-semibold ${toneClass}`}>{value}</div>
     </div>
@@ -1121,7 +1230,7 @@ function MetricTile({
 function RawDetails({ title, payload }: { title: string; payload: unknown }) {
   return (
     <details className="mt-3 min-w-0 max-w-full overflow-hidden rounded-md border border-border bg-white">
-      <summary className="flex cursor-pointer list-none items-center justify-between gap-2 px-3 py-2 text-xs font-medium text-muted-foreground">
+      <summary className="flex h-11 cursor-pointer list-none items-center justify-between gap-2 px-3 py-2 text-xs font-medium text-muted-foreground">
         {title}
         <ChevronDown className="h-3.5 w-3.5" />
       </summary>
@@ -1134,7 +1243,7 @@ function RawDetails({ title, payload }: { title: string; payload: unknown }) {
 
 function MarkdownPreview({ content }: { content: string }) {
   return (
-    <div className="prose prose-sm max-w-none text-black prose-a:text-black prose-code:rounded prose-code:bg-white prose-code:px-1 prose-code:py-0.5 prose-code:text-black prose-headings:text-black prose-headings:tracking-normal prose-li:text-black prose-p:text-black prose-pre:border prose-pre:border-border prose-pre:bg-white prose-pre:text-black prose-strong:text-black [&>*:first-child]:mt-0 [&>*:last-child]:mb-0">
+    <div className={`prose prose-sm max-w-none text-black prose-a:text-black prose-code:rounded prose-code:bg-white prose-code:px-1 prose-code:py-0.5 prose-code:text-black prose-headings:text-black prose-headings:tracking-normal prose-li:text-black prose-p:text-black prose-pre:border prose-pre:border-border prose-pre:bg-white prose-pre:text-black prose-strong:text-black [&>*:first-child]:mt-0 [&>*:last-child]:mb-0 [&_*]:min-w-0 ${containedLongTextClass}`}>
       <ReactMarkdown remarkPlugins={[remarkGfm]}>{content}</ReactMarkdown>
     </div>
   );
diff --git a/app-instance/frontend/app/(app)/status/page.tsx b/app-instance/frontend/app/(app)/status/page.tsx
index 7b57a88..c47651c 100644
--- a/app-instance/frontend/app/(app)/status/page.tsx
+++ b/app-instance/frontend/app/(app)/status/page.tsx
@@ -21,6 +21,7 @@ import {
   getChannelConfig,
   getChannelConnectorSession,
   getStatus,
+  listChannelConnections,
   listChannelConnectors,
   listChannelEvents,
   restartRuntime,
@@ -54,6 +55,7 @@ import { Textarea } from '@/components/ui/textarea';
 import type {
   ChannelConfigDetail,
   ChannelConnectorDescriptor,
+  ChannelConnectionView,
   ChannelEventRecord,
   ChannelStatus,
   ConnectorSessionResponse,
@@ -62,6 +64,7 @@ import type {
 } from '@/types';
 import { AppLocale, pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
+import { connectorChannelForKind, visibleConnectorCards } from '@/lib/channel-connector-state';
 
 type ProviderFormState = {
   enabled: boolean;
@@ -137,6 +140,8 @@ const EMPTY_CHANNEL_FORM: ChannelFormState = {
 
 const CONFIGURABLE_CHANNEL_KINDS = new Set(['telegram', 'feishu', 'qqbot', 'weixin']);
 const SESSION_CONNECTOR_KINDS = new Set(['weixin', 'feishu']);
+const VISIBLE_PROVIDER_IDS = new Set(['openai', 'deepseek', 'dashscope', 'vllm']);
+const LOCAL_CONNECTOR_KINDS = new Set(['terminal']);
 
 type ConnectorWizardForm = {
   kind: string;
@@ -146,6 +151,12 @@ type ConnectorWizardForm = {
   appId: string;
   appSecret: string;
   verificationToken: string;
+  requireMentionInGroups: boolean;
+  respondToMentionAll: boolean;
+  dmMode: 'open' | 'allowlist' | 'pair' | 'disabled';
+  allowFrom: string;
+  groupAllowFrom: string;
+  maxMessageChars: string;
 };
 
 const EMPTY_CONNECTOR_WIZARD: ConnectorWizardForm = {
@@ -156,6 +167,12 @@ const EMPTY_CONNECTOR_WIZARD: ConnectorWizardForm = {
   appId: '',
   appSecret: '',
   verificationToken: '',
+  requireMentionInGroups: true,
+  respondToMentionAll: false,
+  dmMode: 'open',
+  allowFrom: '',
+  groupAllowFrom: '',
+  maxMessageChars: '20000',
 };
 
 export default function StatusPage() {
@@ -193,6 +210,7 @@ export default function StatusPage() {
   const [restarting, setRestarting] = useState(false);
   const [restartError, setRestartError] = useState<string | null>(null);
   const [connectors, setConnectors] = useState<ChannelConnectorDescriptor[]>([]);
+  const [channelConnections, setChannelConnections] = useState<ChannelConnectionView[]>([]);
   const [loadingConnectors, setLoadingConnectors] = useState(false);
   const [connectorDialogOpen, setConnectorDialogOpen] = useState(false);
   const [connectorForm, setConnectorForm] = useState<ConnectorWizardForm>(() => ({ ...EMPTY_CONNECTOR_WIZARD }));
@@ -234,8 +252,17 @@ export default function StatusPage() {
     }
   };
 
+  const loadChannelConnections = async () => {
+    try {
+      setChannelConnections(await listChannelConnections());
+    } catch {
+      setChannelConnections([]);
+    }
+  };
+
   useEffect(() => {
     loadConnectors();
+    void loadChannelConnections();
   }, []);
 
   useEffect(() => {
@@ -329,15 +356,19 @@ export default function StatusPage() {
     setChannelError(null);
     setChannelRestartRequired(false);
     setChannelEvents([]);
-    setLoadingChannelConfig(true);
+    setLoadingChannelConfig(channel.kind !== 'terminal');
     setLoadingChannelEvents(true);
-    try {
-      const config = await getChannelConfig(channel.channel_id);
-      setChannelConfig(config);
-      setChannelForm(channelFormFromConfig(config));
-    } catch (err: any) {
-      setChannelError(err.message || pickAppText(locale, '加载通道配置失败', 'Failed to load channel configuration'));
-    } finally {
+    if (channel.kind !== 'terminal') {
+      try {
+        const config = await getChannelConfig(channel.channel_id);
+        setChannelConfig(config);
+        setChannelForm(channelFormFromConfig(config));
+      } catch (err: any) {
+        setChannelError(err.message || pickAppText(locale, '加载通道配置失败', 'Failed to load channel configuration'));
+      } finally {
+        setLoadingChannelConfig(false);
+      }
+    } else {
       setLoadingChannelConfig(false);
     }
     try {
@@ -396,6 +427,11 @@ export default function StatusPage() {
     });
   };
 
+  const openLocalConnectorDetails = (kind: string, channel?: ChannelStatus) => {
+    if (kind !== 'terminal') return;
+    void openChannelDetails(channel || terminalFallbackChannel(locale));
+  };
+
   const handleStartConnectorSession = async () => {
     if (!connectorForm.kind || !SESSION_CONNECTOR_KINDS.has(connectorForm.kind)) return;
     setStartingConnector(true);
@@ -405,6 +441,14 @@ export default function StatusPage() {
       if (connectorForm.kind === 'feishu') {
         options.domain = connectorForm.domain || 'feishu';
         options.mode = connectorForm.mode;
+        options.requireMentionInGroups = connectorForm.requireMentionInGroups;
+        options.respondToMentionAll = connectorForm.respondToMentionAll;
+        options.dmMode = connectorForm.dmMode;
+        const allowFrom = parseList(connectorForm.allowFrom);
+        const groupAllowFrom = parseList(connectorForm.groupAllowFrom);
+        if (allowFrom.length) options.allowFrom = allowFrom;
+        if (groupAllowFrom.length) options.groupAllowFrom = groupAllowFrom;
+        if (connectorForm.maxMessageChars.trim()) options.maxMessageChars = Number(connectorForm.maxMessageChars.trim());
         if (connectorForm.appId.trim()) options.appId = connectorForm.appId.trim();
         if (connectorForm.appSecret.trim()) options.appSecret = connectorForm.appSecret.trim();
         if (connectorForm.verificationToken.trim()) options.verificationToken = connectorForm.verificationToken.trim();
@@ -415,6 +459,10 @@ export default function StatusPage() {
         options,
       });
       setConnectorSession(response);
+      if (response.session.status === 'connected') {
+        await loadStatus();
+        await loadChannelConnections();
+      }
       if (!connectorSessionDone(response.session.status)) {
         window.setTimeout(() => {
           void pollConnectorSession(response.session.sessionId);
@@ -434,6 +482,7 @@ export default function StatusPage() {
       setConnectorSession(response);
       if (response.session.status === 'connected') {
         await loadStatus();
+        await loadChannelConnections();
       }
     } catch (err: any) {
       setConnectorError(err.message || pickAppText(locale, '刷新连接状态失败', 'Failed to refresh connector status'));
@@ -452,14 +501,14 @@ export default function StatusPage() {
 
   if (error) {
     return (
-      <div className="max-w-4xl mx-auto p-6">
+      <div className="mx-auto max-w-4xl p-4 sm:p-6">
         <Card className="border-destructive">
           <CardContent className="pt-6">
-            <div className="flex items-center gap-3 text-destructive">
-              <AlertCircle className="w-5 h-5" />
-              <div>
+            <div className="flex items-start gap-3 text-destructive">
+              <AlertCircle className="mt-0.5 h-5 w-5 shrink-0" />
+              <div className="min-w-0">
                 <p className="font-medium">{pickAppText(locale, '无法连接到 Boardware Agent Sandbox 后端', 'Unable to connect to the Boardware Agent Sandbox backend')}</p>
-                <p className="text-sm text-muted-foreground mt-1">{error}</p>
+                <p className="mt-1 break-words text-sm text-muted-foreground">{error}</p>
                 <p className="text-sm text-muted-foreground mt-1">{pickAppText(locale, '请确认后端服务已启动，并且当前页面可以访问它。', 'Please confirm the backend service is running and reachable from this page.')}</p>
               </div>
             </div>
@@ -475,8 +524,11 @@ export default function StatusPage() {
 
   if (!status) return null;
 
+  const visibleProviders = status.providers.filter(visibleProvider);
+  const connectorCards = visibleConnectorCards(connectors);
+
   return (
-    <div className="mx-auto max-w-6xl p-6 space-y-6">
+    <div className="mx-auto max-w-6xl space-y-6 p-4 sm:p-6">
       <div className="flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between">
         <div>
           <h1 className="text-2xl font-bold">{pickAppText(locale, '配置', 'Settings')}</h1>
@@ -575,7 +627,7 @@ export default function StatusPage() {
             </div>
           </div>
           <div className="flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between">
-            <div className="text-sm text-destructive">{agentError || ''}</div>
+            <div className="min-w-0 break-words text-sm text-destructive">{agentError || ''}</div>
             <Button onClick={handleSaveAgentConfig} disabled={savingAgent} className="sm:self-end">
               {savingAgent ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : null}
               {pickAppText(locale, '保存智能体配置', 'Save agent config')}
@@ -594,13 +646,13 @@ export default function StatusPage() {
         </CardHeader>
         <CardContent>
           <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-3">
-            {status.providers.map((p) => (
+            {visibleProviders.map((p) => (
               <button
                 key={p.id || p.name}
                 type="button"
                 onClick={() => openProviderDialog(p)}
                 className={[
-                  'group flex min-h-[76px] w-full items-start justify-between rounded-lg border p-3 text-left transition',
+                  'group flex min-h-[76px] w-full items-start justify-between gap-3 rounded-lg border p-3 text-left transition',
                   p.active
                     ? 'border-primary bg-primary/5 shadow-sm'
                     : 'border-border bg-background hover:border-primary/50 hover:bg-muted/40',
@@ -613,11 +665,11 @@ export default function StatusPage() {
                     ) : (
                       <XCircle className="h-4 w-4 shrink-0 text-muted-foreground/40" />
                     )}
-                    <span className={p.has_key ? 'truncate' : 'truncate text-muted-foreground'}>
+                    <span className={p.has_key ? 'break-all' : 'break-all text-muted-foreground'}>
                       {providerLabel(p)}
                     </span>
                   </span>
-                  <span className="block truncate text-xs text-muted-foreground">
+                  <span className="block break-words text-xs text-muted-foreground">
                     {p.active
                       ? pickAppText(locale, '当前默认', 'Current default')
                       : p.enabled
@@ -625,7 +677,7 @@ export default function StatusPage() {
                         : pickAppText(locale, '点击配置', 'Click to configure')}
                   </span>
                   {(p.detail || p.api_key_masked) && (
-                    <span className="block truncate text-xs text-muted-foreground">
+                    <span className="block break-all text-xs text-muted-foreground">
                       {p.api_key_masked || p.detail}
                     </span>
                   )}
@@ -639,7 +691,7 @@ export default function StatusPage() {
 
       <Dialog open={Boolean(selectedProvider)} onOpenChange={(open) => !open && setSelectedProvider(null)}>
         <DialogContent className="sm:max-w-[520px]">
-          <DialogHeader>
+          <DialogHeader className="pr-10">
             <DialogTitle>
               {pickAppText(locale, '配置提供商', 'Configure provider')}
               {selectedProvider ? ` · ${providerLabel(selectedProvider)}` : ''}
@@ -649,8 +701,8 @@ export default function StatusPage() {
             </DialogDescription>
           </DialogHeader>
           <div className="space-y-5 py-2">
-            <div className="flex items-center justify-between rounded-lg border px-3 py-2">
-              <div>
+            <div className="flex items-center justify-between gap-4 rounded-lg border px-3 py-2">
+              <div className="min-w-0">
                 <Label className="text-sm">{pickAppText(locale, '启用提供商', 'Enable provider')}</Label>
                 <p className="text-xs text-muted-foreground">
                   {pickAppText(locale, '关闭会从配置中移除这个提供商', 'Turning this off removes this provider from config')}
@@ -709,7 +761,7 @@ export default function StatusPage() {
             </div>
 
             {providerError ? (
-              <p className="text-sm text-destructive">{providerError}</p>
+              <p className="break-words text-sm text-destructive">{providerError}</p>
             ) : null}
           </div>
           <DialogFooter>
@@ -725,19 +777,22 @@ export default function StatusPage() {
       </Dialog>
 
       <Dialog open={Boolean(selectedChannel)} onOpenChange={(open) => !open && setSelectedChannel(null)}>
-        <DialogContent className="max-h-[92vh] overflow-y-auto sm:max-w-[820px]">
-          <DialogHeader>
-            <DialogTitle>{selectedChannel?.display_name || selectedChannel?.channel_id}</DialogTitle>
-            <DialogDescription>
+        <DialogContent className="sm:max-w-[820px]">
+          <DialogHeader className="pr-10">
+            <DialogTitle className="break-words leading-tight">{selectedChannel?.display_name || selectedChannel?.channel_id}</DialogTitle>
+            <DialogDescription className="break-all">
               {selectedChannel ? `${selectedChannel.kind}/${selectedChannel.mode} · ${selectedChannel.channel_id}` : ''}
             </DialogDescription>
           </DialogHeader>
           {selectedChannel ? (
             <div className="space-y-5">
+              {selectedChannel.kind === 'terminal' ? (
+                <TerminalConnectionGuide channel={selectedChannel} locale={locale} />
+              ) : null}
               {CONFIGURABLE_CHANNEL_KINDS.has(channelForm.kind) ? (
-                <div className="space-y-5 rounded-lg border p-4">
+                <div className="min-w-0 space-y-5 rounded-lg border p-4">
                   <div className="flex items-center justify-between gap-4">
-                    <div>
+                    <div className="min-w-0">
                       <p className="text-sm font-medium">{pickAppText(locale, '连接配置', 'Connection settings')}</p>
                       <p className="text-xs text-muted-foreground">
                         {pickAppText(locale, '凭据留空会保留已保存的值。保存后重启实例才会重新连接通道。', 'Leave credentials blank to keep saved values. Restart the instance after saving to reconnect channels.')}
@@ -751,15 +806,17 @@ export default function StatusPage() {
                   </div>
 
                   <div className="grid gap-4 md:grid-cols-2">
-                    <Field label={pickAppText(locale, '显示名', 'Display name')}>
+                    <Field id="channel-display-name" label={pickAppText(locale, '显示名', 'Display name')}>
                       <Input
+                        id="channel-display-name"
                         value={channelForm.displayName}
                         onChange={(event) => setChannelForm((prev) => ({ ...prev, displayName: event.target.value }))}
                         placeholder={selectedChannel.display_name || selectedChannel.channel_id}
                       />
                     </Field>
-                    <Field label="Account ID">
+                    <Field id="channel-account-id" label="Account ID">
                       <Input
+                        id="channel-account-id"
                         value={channelForm.accountId}
                         onChange={(event) => setChannelForm((prev) => ({ ...prev, accountId: event.target.value }))}
                         placeholder="bot-main"
@@ -810,11 +867,11 @@ export default function StatusPage() {
                   />
                   <ChannelPolicyFields form={channelForm} locale={locale} setForm={setChannelForm} />
 
-                  {channelError ? <p className="text-sm text-destructive">{channelError}</p> : null}
+                  {channelError ? <p className="break-words text-sm text-destructive">{channelError}</p> : null}
                   {channelRestartRequired ? (
                     <div className="flex flex-col gap-3 rounded-md border border-amber-500/40 bg-amber-500/10 p-3 text-sm sm:flex-row sm:items-center sm:justify-between">
-                      <span>{pickAppText(locale, '配置已保存。重启实例后通道会按新配置启动。', 'Configuration saved. Restart the instance to start channels with the new settings.')}</span>
-                      <Button variant="outline" size="sm" onClick={() => setRestartOpen(true)}>
+                      <span className="min-w-0 break-words">{pickAppText(locale, '配置已保存。重启实例后通道会按新配置启动。', 'Configuration saved. Restart the instance to start channels with the new settings.')}</span>
+                    <Button variant="outline" size="sm" className="shrink-0" onClick={() => setRestartOpen(true)}>
                         <RefreshCw className="mr-2 h-4 w-4" />
                         {pickAppText(locale, '重启实例', 'Restart instance')}
                       </Button>
@@ -844,11 +901,11 @@ export default function StatusPage() {
                   <div className="max-h-[320px] overflow-auto rounded-md border">
                     {channelEvents.map((event) => (
                       <div key={event.event_id} className="border-b px-3 py-2 text-xs last:border-b-0">
-                        <div className="flex items-center justify-between gap-2">
-                          <span className="font-medium">{event.kind}</span>
-                          <span className="text-muted-foreground">{event.created_at}</span>
+                        <div className="flex flex-col gap-1 sm:flex-row sm:items-center sm:justify-between sm:gap-2">
+                          <span className="break-all font-medium">{event.kind}</span>
+                          <span className="break-all text-muted-foreground">{event.created_at}</span>
                         </div>
-                        <div className="mt-1 text-muted-foreground">
+                        <div className="mt-1 break-words text-muted-foreground">
                           {event.status}{event.error ? ` · ${event.error}` : ''}
                         </div>
                       </div>
@@ -868,7 +925,7 @@ export default function StatusPage() {
 
       <Dialog open={restartOpen} onOpenChange={setRestartOpen}>
         <DialogContent className="sm:max-w-[420px]">
-          <DialogHeader>
+          <DialogHeader className="pr-10">
             <DialogTitle>{pickAppText(locale, '重启实例？', 'Restart instance?')}</DialogTitle>
             <DialogDescription>
               {pickAppText(
@@ -878,7 +935,7 @@ export default function StatusPage() {
               )}
             </DialogDescription>
           </DialogHeader>
-          {restartError ? <p className="text-sm text-destructive">{restartError}</p> : null}
+          {restartError ? <p className="break-words text-sm text-destructive">{restartError}</p> : null}
           <DialogFooter>
             <Button variant="outline" onClick={() => setRestartOpen(false)} disabled={restarting}>
               {pickAppText(locale, '取消', 'Cancel')}
@@ -898,8 +955,8 @@ export default function StatusPage() {
           setConnectorError(null);
         }
       }}>
-        <DialogContent className="max-h-[92vh] overflow-y-auto sm:max-w-[560px]">
-          <DialogHeader>
+        <DialogContent className="sm:max-w-[560px]">
+          <DialogHeader className="pr-10">
             <DialogTitle>
               {connectorForm.kind ? connectorDisplayName({ kind: connectorForm.kind }) : pickAppText(locale, '连接通道', 'Connect channel')}
             </DialogTitle>
@@ -913,8 +970,9 @@ export default function StatusPage() {
           </DialogHeader>
 
           <div className="space-y-5">
-            <Field label={pickAppText(locale, '显示名', 'Display name')}>
+            <Field id="connector-display-name" label={pickAppText(locale, '显示名', 'Display name')}>
               <Input
+                id="connector-display-name"
                 value={connectorForm.displayName}
                 onChange={(event) => setConnectorForm((prev) => ({ ...prev, displayName: event.target.value }))}
                 disabled={Boolean(connectorSession) || startingConnector}
@@ -961,6 +1019,75 @@ export default function StatusPage() {
                     ))}
                   </div>
                 ) : null}
+                <div className="space-y-4 rounded-lg border p-3">
+                  <div className="flex items-center justify-between gap-4">
+                    <div className="min-w-0">
+                      <p className="text-sm font-medium">{pickAppText(locale, '群聊必须 @ Beaver', 'Require @ in groups')}</p>
+                      <p className="text-xs text-muted-foreground">
+                        {pickAppText(locale, '默认开启，避免群聊所有消息触发智能体。', 'Enabled by default to avoid processing every group message.')}
+                      </p>
+                    </div>
+                    <Switch
+                      checked={connectorForm.requireMentionInGroups}
+                      onCheckedChange={(checked) => setConnectorForm((prev) => ({ ...prev, requireMentionInGroups: checked }))}
+                      disabled={Boolean(connectorSession) || startingConnector}
+                    />
+                  </div>
+                  <div className="flex items-center justify-between gap-4">
+                    <div className="min-w-0">
+                      <p className="text-sm font-medium">{pickAppText(locale, '响应 @所有人', 'Respond to @all')}</p>
+                      <p className="text-xs text-muted-foreground">
+                        {pickAppText(locale, '默认关闭，避免群公告式消息触发。', 'Disabled by default to avoid broadcast-style triggers.')}
+                      </p>
+                    </div>
+                    <Switch
+                      checked={connectorForm.respondToMentionAll}
+                      onCheckedChange={(checked) => setConnectorForm((prev) => ({ ...prev, respondToMentionAll: checked }))}
+                      disabled={Boolean(connectorSession) || startingConnector}
+                    />
+                  </div>
+                  <div className="grid gap-4 md:grid-cols-2">
+                    <Field label={pickAppText(locale, '私聊策略', 'DM policy')}>
+                      <Select
+                        value={connectorForm.dmMode}
+                        onValueChange={(value) => setConnectorForm((prev) => ({ ...prev, dmMode: value as ConnectorWizardForm['dmMode'] }))}
+                        disabled={Boolean(connectorSession) || startingConnector}
+                      >
+                        <SelectTrigger><SelectValue /></SelectTrigger>
+                        <SelectContent>
+                          <SelectItem value="open">{pickAppText(locale, '开放', 'Open')}</SelectItem>
+                          <SelectItem value="allowlist">{pickAppText(locale, '白名单', 'Allowlist')}</SelectItem>
+                          <SelectItem value="pair">{pickAppText(locale, '已配对', 'Paired')}</SelectItem>
+                          <SelectItem value="disabled">{pickAppText(locale, '关闭', 'Disabled')}</SelectItem>
+                        </SelectContent>
+                      </Select>
+                    </Field>
+                    <Field label={pickAppText(locale, '最大入站长度', 'Max inbound chars')}>
+                      <Input
+                        value={connectorForm.maxMessageChars}
+                        onChange={(event) => setConnectorForm((prev) => ({ ...prev, maxMessageChars: event.target.value }))}
+                        disabled={Boolean(connectorSession) || startingConnector}
+                        placeholder="20000"
+                      />
+                    </Field>
+                  </div>
+                  <Field label={pickAppText(locale, '允许私聊用户 Open ID', 'Allowed DM user Open IDs')}>
+                    <Textarea
+                      value={connectorForm.allowFrom}
+                      onChange={(event) => setConnectorForm((prev) => ({ ...prev, allowFrom: event.target.value }))}
+                      disabled={Boolean(connectorSession) || startingConnector}
+                      placeholder="ou_xxx, ou_yyy"
+                    />
+                  </Field>
+                  <Field label={pickAppText(locale, '允许群 Chat ID', 'Allowed group Chat IDs')}>
+                    <Textarea
+                      value={connectorForm.groupAllowFrom}
+                      onChange={(event) => setConnectorForm((prev) => ({ ...prev, groupAllowFrom: event.target.value }))}
+                      disabled={Boolean(connectorSession) || startingConnector}
+                      placeholder="oc_xxx, oc_yyy"
+                    />
+                  </Field>
+                </div>
                 {connectorForm.mode === 'link' ? (
                   <div className="grid gap-4 md:grid-cols-2">
                     <Field label="App ID">
@@ -997,8 +1124,8 @@ export default function StatusPage() {
               <div className="space-y-4 rounded-lg border p-4">
                 <div className="flex items-center justify-between gap-3">
                   <div className="min-w-0">
-                    <p className="truncate text-sm font-medium">{connectorSession.session.sessionId}</p>
-                    <p className="text-xs text-muted-foreground">
+                    <p className="break-all text-sm font-medium">{connectorSession.session.sessionId}</p>
+                    <p className="break-all text-xs text-muted-foreground">
                       {connectorSession.connection?.channel_id || connectorSession.connection?.connection_id || '-'}
                     </p>
                   </div>
@@ -1020,7 +1147,7 @@ export default function StatusPage() {
                   <div className="space-y-2 text-sm">
                     {connectorSession.session.instructions.map((item, index) => (
                       <div key={`${index}-${item}`} className="rounded-md border bg-muted/30 px-3 py-2">
-                        {item}
+                        <span className="break-words">{item}</span>
                       </div>
                     ))}
                   </div>
@@ -1032,12 +1159,12 @@ export default function StatusPage() {
                   </div>
                 ) : null}
                 {connectorSession.session.error ? (
-                  <p className="text-sm text-destructive">{connectorSession.session.error}</p>
+                  <p className="break-words text-sm text-destructive">{connectorSession.session.error}</p>
                 ) : null}
               </div>
             ) : null}
 
-            {connectorError ? <p className="text-sm text-destructive">{connectorError}</p> : null}
+            {connectorError ? <p className="break-words text-sm text-destructive">{connectorError}</p> : null}
           </div>
 
           <DialogFooter>
@@ -1073,31 +1200,60 @@ export default function StatusPage() {
         </CardHeader>
         <CardContent>
           <div className="space-y-5">
-            <div className="grid gap-2 sm:grid-cols-3">
-              {(connectors.length ? connectors : [{ kind: 'telegram' }, { kind: 'weixin' }, { kind: 'feishu' }]).map((connector) => {
-                const supportsSession = SESSION_CONNECTOR_KINDS.has(connector.kind);
+            <div className="grid grid-cols-1 gap-3 sm:grid-cols-2">
+              {connectorCards.map((connector) => {
+                const channel = connectorChannelForKind(connector.kind, status.channels);
+                const connection = connectorConnectionForKind(connector.kind, channelConnections);
+                const isRunning = channel?.state === 'running' || connection?.status === 'connected';
+                const isLocalConnector = LOCAL_CONNECTOR_KINDS.has(connector.kind);
+                const canStart = SESSION_CONNECTOR_KINDS.has(connector.kind) && !channel && !isRunning;
                 return (
                   <button
                     key={connector.kind}
                     type="button"
-                    onClick={() => supportsSession && openConnectorDialog(connector)}
-                    disabled={!supportsSession}
+                    onClick={() => {
+                      if (isLocalConnector) {
+                        openLocalConnectorDetails(connector.kind, channel);
+                      } else if (channel) {
+                        void openChannelDetails(channel);
+                      } else if (canStart) {
+                        openConnectorDialog(connector);
+                      }
+                    }}
+                    disabled={!channel && !canStart && !isLocalConnector}
                     className={[
-                      'flex min-h-[86px] w-full items-start justify-between rounded-lg border px-3 py-3 text-left text-sm transition',
-                      supportsSession ? 'hover:border-primary/50 hover:bg-muted/40' : 'opacity-70',
+                      'group flex min-h-[76px] w-full items-start justify-between gap-3 rounded-lg border p-3 text-left transition',
+                      isRunning
+                        ? 'border-primary bg-primary/5 shadow-sm'
+                        : canStart
+                          ? 'border-border bg-background hover:border-primary/50 hover:bg-muted/40'
+                          : 'border-border bg-background opacity-70',
                     ].join(' ')}
                   >
                     <span className="min-w-0 space-y-1">
-                      <span className="flex items-center gap-2 font-medium">
-                        {supportsSession ? <QrCode className="h-4 w-4" /> : <PlugZap className="h-4 w-4" />}
-                        <span className="truncate">{connectorDisplayName(connector)}</span>
+                      <span className="flex items-center gap-2 text-sm font-medium">
+                        {isRunning ? (
+                          <CheckCircle2 className="h-4 w-4 shrink-0 text-green-500" />
+                        ) : canStart || isLocalConnector ? (
+                          <QrCode className="h-4 w-4 shrink-0" />
+                        ) : (
+                          <PlugZap className="h-4 w-4 shrink-0 text-muted-foreground/50" />
+                        )}
+                        <span className={isRunning ? 'break-all' : 'break-all text-muted-foreground'}>
+                          {connectorDisplayName(connector)}
+                        </span>
                       </span>
-                      <span className="block truncate text-xs text-muted-foreground">
-                        {connectorAuthLabel(connector, locale)}
+                      <span className="block break-words text-xs text-muted-foreground">
+                        {connectorCardSubtitle(connector, channel, connection, locale)}
                       </span>
+                      {channel || connection || isLocalConnector ? (
+                        <span className="block break-all text-xs text-muted-foreground">
+                          {connectorCardChannelLabel(channel, connection, locale)}
+                        </span>
+                      ) : null}
                     </span>
-                    <Badge variant={supportsSession ? 'outline' : 'secondary'}>
-                      {supportsSession ? pickAppText(locale, '连接', 'Connect') : pickAppText(locale, '令牌', 'Token')}
+                    <Badge variant={connectorCardBadgeVariant(channel, connection)} className="shrink-0">
+                      {connectorCardBadgeLabel(connector, channel, connection, locale)}
                     </Badge>
                   </button>
                 );
@@ -1109,33 +1265,6 @@ export default function StatusPage() {
                 {pickAppText(locale, '正在加载连接器', 'Loading connectors')}
               </div>
             ) : null}
-            <div className="space-y-2">
-            {status.channels.length === 0 ? (
-              <p className="text-sm text-muted-foreground">
-                {pickAppText(locale, '尚未配置通道', 'No channels configured')}
-              </p>
-            ) : (
-              status.channels.map((ch) => (
-                <button
-                  key={ch.channel_id}
-                  type="button"
-                  onClick={() => openChannelDetails(ch)}
-                  className="flex w-full items-center justify-between rounded-lg border px-3 py-2 text-left text-sm hover:bg-muted/40"
-                >
-                  <span className="min-w-0">
-                    <span className="block truncate font-medium">{ch.display_name || ch.channel_id}</span>
-                    <span className="block truncate text-xs text-muted-foreground">
-                      {ch.channel_id} · {ch.kind}/{ch.mode} · {ch.account_id}
-                      {typeof ch.connected_peers === 'number' ? ` · ${ch.connected_peers} peer${ch.connected_peers === 1 ? '' : 's'}` : ''}
-                    </span>
-                  </span>
-                  <Badge variant={channelStateBadgeVariant(ch.state)}>
-                    {ch.state}
-                  </Badge>
-                </button>
-              ))
-            )}
-            </div>
           </div>
         </CardContent>
       </Card>
@@ -1154,10 +1283,10 @@ function InfoRow({
   ok?: boolean;
 }) {
   return (
-    <div className="flex items-center justify-between text-sm">
-      <span className="text-muted-foreground">{label}</span>
-      <div className="flex items-center gap-2">
-        <code className="bg-muted px-2 py-0.5 rounded text-xs max-w-[400px] truncate">
+    <div className="grid min-w-0 gap-1 text-sm sm:grid-cols-[minmax(0,1fr)_minmax(0,auto)] sm:items-start">
+      <span className="min-w-0 break-words text-muted-foreground">{label}</span>
+      <div className="flex min-w-0 items-center gap-2 sm:justify-end">
+        <code className="min-w-0 max-w-full whitespace-normal break-all rounded bg-muted px-2 py-0.5 text-xs sm:max-w-[400px]">
           {value}
         </code>
         {ok !== undefined &&
@@ -1171,14 +1300,180 @@ function InfoRow({
   );
 }
 
+function TerminalConnectionGuide({ channel, locale }: { channel: ChannelStatus; locale: AppLocale }) {
+  const connected = channel.state === 'running';
+  const instructions = terminalConnectionGuide(locale);
+  return (
+    <div className="space-y-4 rounded-lg border p-4">
+      <div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
+        <div className="space-y-1">
+          <p className="text-sm font-medium">
+            {pickAppText(locale, '小终端连接方式', 'Terminal connection method')}
+          </p>
+          <p className="text-xs text-muted-foreground">
+            {pickAppText(
+              locale,
+              '小终端通过本地 WebSocket 通道接入当前实例；这里展示的是连接状态和接入说明。',
+              'The terminal connects to this instance through the local WebSocket channel; this panel shows status and connection guidance.'
+            )}
+          </p>
+        </div>
+        <Badge variant={connected ? 'default' : 'secondary'}>{channel.state}</Badge>
+      </div>
+
+      <div className="grid gap-4 md:grid-cols-[220px_1fr]">
+        <div className="rounded-md border bg-muted/30 p-3">
+          <div className="mx-auto grid h-44 w-44 grid-cols-7 grid-rows-7 gap-1 rounded bg-background p-3">
+            {TERMINAL_FAKE_QR_CELLS.map((filled, index) => (
+              <span
+                key={index}
+                className={filled ? 'rounded-[2px] bg-foreground' : 'rounded-[2px] bg-transparent'}
+              />
+            ))}
+          </div>
+          <p className="mt-3 text-center text-xs font-medium">
+            {pickAppText(locale, '示意二维码（Fake QR）', 'Illustrative QR (Fake QR)')}
+          </p>
+          <p className="mt-1 text-center text-xs text-muted-foreground">
+            {pickAppText(locale, '不可扫码，仅用于标识终端连接入口。', 'Not scannable; it only marks the terminal connection entry.')}
+          </p>
+        </div>
+        <div className="space-y-2 text-sm">
+          {instructions.map((item) => (
+            <div key={item} className="rounded-md border bg-muted/20 px-3 py-2">
+              {item}
+            </div>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}
+
+const TERMINAL_FAKE_QR_CELLS = [
+  true, true, true, false, true, true, true,
+  true, false, true, false, true, false, true,
+  true, true, true, false, true, true, true,
+  false, false, false, true, false, true, false,
+  true, false, true, false, true, false, true,
+  false, true, false, true, false, true, false,
+  true, false, true, true, false, false, true,
+];
+
+function terminalConnectionGuide(locale: AppLocale): string[] {
+  return [
+    pickAppText(locale, '保持本实例页面在线，终端客户端会通过 WebSocket 连接 Beaver。', 'Keep this instance online; the terminal client connects to Beaver over WebSocket.'),
+    pickAppText(locale, '连接成功后，通道状态会显示 running，并显示当前 connected peers 数量。', 'After connection succeeds, the channel status shows running and the connected peers count is updated.'),
+    pickAppText(locale, '这里的二维码是 fake 的说明图，不代表真实扫码绑定流程。', 'The QR shown here is fake guidance artwork, not a real scan-to-bind flow.'),
+  ];
+}
+
+function terminalFallbackChannel(locale: AppLocale): ChannelStatus {
+  return {
+    channel_id: 'terminal',
+    kind: 'terminal',
+    mode: 'websocket',
+    display_name: pickAppText(locale, '小终端', 'Terminal'),
+    enabled: false,
+    state: 'disabled',
+    account_id: 'local',
+    capabilities: ['receive_text', 'send_text'],
+    connected_peers: 0,
+  };
+}
+
 function providerLabel(provider: ProviderStatus): string {
   return provider.label || provider.name;
 }
 
+function providerIdentity(provider: ProviderStatus): string {
+  const identity = (provider.id || provider.name || provider.label || '').trim().toLowerCase();
+  if (identity === 'vllm/local') return 'vllm';
+  return identity;
+}
+
+function visibleProvider(provider: ProviderStatus): boolean {
+  return VISIBLE_PROVIDER_IDS.has(providerIdentity(provider));
+}
+
+function connectorConnectionForKind(
+  kind: string,
+  connections: ChannelConnectionView[]
+): ChannelConnectionView | undefined {
+  const matches = connections.filter((connection) => connection.kind === kind && connection.status !== 'revoked');
+  return (
+    matches.find((connection) => connection.status === 'connected') ||
+    matches.find((connection) => connection.status !== 'error') ||
+    matches[0]
+  );
+}
+
+function connectorCardSubtitle(
+  connector: ChannelConnectorDescriptor,
+  channel: ChannelStatus | undefined,
+  connection: ChannelConnectionView | undefined,
+  locale: AppLocale
+): string {
+  if (channel?.state === 'running' || connection?.status === 'connected') {
+    return pickAppText(locale, '已连接', 'Connected');
+  }
+  if (channel) return channel.state;
+  if (connection) return connection.status;
+  if (connector.kind === 'terminal') return pickAppText(locale, '本地终端连接', 'Local terminal connection');
+  return connectorAuthLabel(connector, locale);
+}
+
+function connectorCardChannelLabel(
+  channel: ChannelStatus | undefined,
+  connection: ChannelConnectionView | undefined,
+  locale: AppLocale
+): string {
+  const rawChannelId = connection?.channel_id || channel?.channel_id || '';
+  const channelId = compactMainSuffix(rawChannelId);
+  const accountId = compactMainSuffix(connection?.account_id || channel?.account_id || '');
+  const mode = connection?.mode || channel?.mode || '';
+  const parts = [channelId, mode, accountId].filter(Boolean);
+  if (!channel && !connection) return pickAppText(locale, '连接方式说明', 'Connection instructions');
+  if (parts.length === 0) return pickAppText(locale, '通道已连接', 'Channel connected');
+  return `${pickAppText(locale, '通道', 'Channel')}: ${parts.join(' · ')}`;
+}
+
+function compactMainSuffix(value: string): string {
+  return value.replace(/[-_]?main$/i, '').trim();
+}
+
+function connectorCardBadgeVariant(
+  channel: ChannelStatus | undefined,
+  connection: ChannelConnectionView | undefined
+): 'default' | 'secondary' | 'destructive' | 'outline' {
+  if (channel?.state === 'running' || connection?.status === 'connected') return 'default';
+  if (channel?.state === 'error' || channel?.state === 'degraded' || connection?.status === 'error') {
+    return 'destructive';
+  }
+  if (channel?.state === 'disabled' || channel?.state === 'stopped' || connection?.status === 'revoked') {
+    return 'secondary';
+  }
+  return 'outline';
+}
+
+function connectorCardBadgeLabel(
+  connector: ChannelConnectorDescriptor,
+  channel: ChannelStatus | undefined,
+  connection: ChannelConnectionView | undefined,
+  locale: AppLocale
+): string {
+  if (channel?.state === 'running' || connection?.status === 'connected') return 'running';
+  if (channel) return channel.state;
+  if (connection) return connection.status;
+  if (connector.kind === 'terminal') return pickAppText(locale, '说明', 'Guide');
+  return pickAppText(locale, '连接', 'Connect');
+}
+
 function connectorDisplayName(connector: Pick<ChannelConnectorDescriptor, 'kind' | 'displayName' | 'display_name'>): string {
   if (connector.displayName || connector.display_name) return connector.displayName || connector.display_name || connector.kind;
   if (connector.kind === 'weixin') return 'Weixin';
   if (connector.kind === 'feishu') return 'Feishu/Lark';
+  if (connector.kind === 'terminal') return 'Terminal';
   if (connector.kind === 'telegram') return 'Telegram';
   return connector.kind;
 }
@@ -1187,6 +1482,7 @@ function connectorAuthLabel(connector: ChannelConnectorDescriptor, locale: AppLo
   const authType = connector.authType || connector.auth_type;
   if (connector.kind === 'weixin') return authType || pickAppText(locale, 'QR', 'QR');
   if (connector.kind === 'feishu') return authType || pickAppText(locale, '插件', 'Plugin');
+  if (connector.kind === 'terminal') return pickAppText(locale, 'Fake QR', 'Fake QR');
   if (connector.kind === 'telegram') return authType || pickAppText(locale, 'Token', 'Token');
   return authType || connector.kind;
 }
@@ -1217,19 +1513,10 @@ function connectorSessionBadgeVariant(status: string): 'default' | 'secondary' |
   return 'outline';
 }
 
-function channelStateBadgeVariant(
-  state: ChannelStatus['state']
-): 'default' | 'secondary' | 'destructive' | 'outline' {
-  if (state === 'running') return 'default';
-  if (state === 'error' || state === 'degraded') return 'destructive';
-  if (state === 'disabled' || state === 'stopped') return 'secondary';
-  return 'outline';
-}
-
-function Field({ label, children }: { label: string; children: React.ReactNode }) {
+function Field({ id, label, children }: { id?: string; label: string; children: React.ReactNode }) {
   return (
-    <div className="grid gap-2">
-      <Label>{label}</Label>
+    <div className="grid min-w-0 gap-2">
+      <Label htmlFor={id}>{label}</Label>
       {children}
     </div>
   );
diff --git a/app-instance/frontend/app/(app)/tasks/[taskId]/page.tsx b/app-instance/frontend/app/(app)/tasks/[taskId]/page.tsx
index 812478e..189b1de 100644
--- a/app-instance/frontend/app/(app)/tasks/[taskId]/page.tsx
+++ b/app-instance/frontend/app/(app)/tasks/[taskId]/page.tsx
@@ -19,7 +19,7 @@ import { pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
 import { useChatStore } from '@/lib/store';
 import { shouldPollTaskDetail, taskDetailDurationMs } from '@/lib/task-detail-refresh';
-import { buildTaskTimelineCards } from '@/lib/task-timeline';
+import { buildTaskTimelineView } from '@/lib/task-timeline-view';
 import type { BackendTask } from '@/types';
 
 const TERMINAL_TASK_STATUSES = new Set(['closed', 'abandoned', 'cancelled', 'error']);
@@ -45,6 +45,7 @@ export default function TaskDetailPage() {
   const mountedRef = React.useRef(true);
 
   React.useEffect(() => {
+    mountedRef.current = true;
     return () => {
       mountedRef.current = false;
     };
@@ -89,44 +90,17 @@ export default function TaskDetailPage() {
     return () => window.clearInterval(id);
   }, [backendTask, loadBackendTask]);
 
-  const taskRunIds = useMemo(() => {
-    const ids = new Set<string>();
-    for (const run of backendTask?.process_runs ?? []) ids.add(run.run_id);
-    for (const runId of backendTask?.run_ids ?? []) ids.add(runId);
-    return ids;
-  }, [backendTask]);
-
-  const liveRuns = useMemo(
-    () => processRuns.filter((run) => taskRunIds.has(run.run_id) || run.metadata?.task_id === taskId),
-    [processRuns, taskId, taskRunIds]
-  );
-
-  const liveEvents = useMemo(
-    () => processEvents.filter((event) => taskRunIds.has(event.run_id) || event.metadata?.task_id === taskId),
-    [processEvents, taskId, taskRunIds]
-  );
-
-  const liveArtifacts = useMemo(
-    () => processArtifacts.filter((artifact) => taskRunIds.has(artifact.run_id) || artifact.metadata?.task_id === taskId),
-    [processArtifacts, taskId, taskRunIds]
-  );
-
-  const renderedRuns = liveRuns.length > 0 ? liveRuns : backendTask?.process_runs ?? [];
-  const renderedEvents = liveEvents.length > 0 ? liveEvents : backendTask?.process_events ?? [];
-  const renderedArtifacts = liveArtifacts.length > 0 ? liveArtifacts : backendTask?.process_artifacts ?? [];
-
-  const timelineCards = useMemo(
+  const timelineView = useMemo(
     () =>
-      backendTask
-        ? buildTaskTimelineCards({
-            task: backendTask,
-            processRuns: renderedRuns,
-            processEvents: renderedEvents,
-            processArtifacts: renderedArtifacts,
-          })
-        : [],
-    [backendTask, renderedArtifacts, renderedEvents, renderedRuns]
+      buildTaskTimelineView({
+        task: backendTask,
+        liveRuns: processRuns,
+        liveEvents: processEvents,
+        liveArtifacts: processArtifacts,
+      }),
+    [backendTask, processArtifacts, processEvents, processRuns]
   );
+  const timelineCards = timelineView?.cards ?? [];
 
   const activeLabel =
     [...timelineCards].reverse().find((card) => !['acceptance', 'task_created'].includes(card.type))?.title ?? '-';
@@ -164,13 +138,13 @@ export default function TaskDetailPage() {
       <div className="min-h-screen bg-background">
         <TaskLiveHeader task={backendTask} activeLabel={activeLabel} durationMs={durationMs} reviewTargetId={TASK_RESULT_REVIEW_ID} />
 
-        <main className="mx-auto grid max-w-7xl gap-6 p-6 xl:grid-cols-[minmax(0,1fr)_360px]">
-          <div className="space-y-4">
+        <main className="mx-auto grid min-w-0 max-w-7xl gap-6 p-4 sm:p-6 xl:grid-cols-[minmax(0,1fr)_360px]">
+          <div className="min-w-0 space-y-4">
             <div className="flex justify-end">
               <Button
                 variant="ghost"
                 size="sm"
-                className="text-destructive hover:text-destructive"
+                className="h-11 text-destructive hover:text-destructive"
                 disabled={Boolean(actionBusy)}
                 onClick={() => void deleteCurrentBackendTask()}
               >
@@ -217,7 +191,12 @@ export default function TaskDetailPage() {
             />
           </div>
 
-          <TaskSideRail task={backendTask} runs={renderedRuns} artifacts={renderedArtifacts} cards={timelineCards} />
+          <TaskSideRail
+            task={backendTask}
+            runs={timelineView?.process.runs ?? []}
+            artifacts={timelineView?.process.artifacts ?? []}
+            cards={timelineCards}
+          />
         </main>
       </div>
     );
@@ -225,7 +204,7 @@ export default function TaskDetailPage() {
 
   return (
     <div className="mx-auto flex max-w-4xl flex-col gap-4 p-6">
-      <Button asChild variant="outline" className="w-fit">
+      <Button asChild variant="outline" className="h-11 w-fit">
         <Link href="/tasks">
           <ArrowLeft className="mr-2 h-4 w-4" />
           {pickAppText(locale, '返回任务列表', 'Back to tasks')}
diff --git a/app-instance/frontend/app/(app)/tasks/page.tsx b/app-instance/frontend/app/(app)/tasks/page.tsx
index 09142bf..1c1171d 100644
--- a/app-instance/frontend/app/(app)/tasks/page.tsx
+++ b/app-instance/frontend/app/(app)/tasks/page.tsx
@@ -46,6 +46,7 @@ export default function TasksPage() {
 function OrdinaryTasks() {
   const { locale } = useAppI18n();
   const [backendTasks, setBackendTasks] = useState<BackendTask[]>([]);
+  const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
   const visibleTasks = useMemo(
@@ -58,17 +59,25 @@ function OrdinaryTasks() {
 
   const loadBackendTasks = React.useCallback(() => {
     let cancelled = false;
+    setLoading(true);
+    setError(null);
     listBackendTasks()
       .then((items) => {
         if (!cancelled) setBackendTasks(Array.isArray(items) ? items : []);
       })
-      .catch(() => {
-        if (!cancelled) setBackendTasks([]);
+      .catch((err: any) => {
+        if (!cancelled) {
+          setBackendTasks([]);
+          setError(err.message || pickAppText(locale, '加载任务失败', 'Failed to load tasks'));
+        }
+      })
+      .finally(() => {
+        if (!cancelled) setLoading(false);
       });
     return () => {
       cancelled = true;
     };
-  }, []);
+  }, [locale]);
 
   useEffect(() => loadBackendTasks(), [loadBackendTasks]);
 
@@ -86,7 +95,18 @@ function OrdinaryTasks() {
     }
   };
 
-  if (visibleTasks.length === 0) {
+  if (loading) {
+    return (
+      <Card>
+        <CardContent className="flex items-center justify-center py-16 text-muted-foreground">
+          <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+          {pickAppText(locale, '加载任务中', 'Loading tasks')}
+        </CardContent>
+      </Card>
+    );
+  }
+
+  if (visibleTasks.length === 0 && !error) {
     return (
       <Card className="border-dashed">
         <CardContent className="flex flex-col items-center justify-center py-16 text-center">
@@ -113,7 +133,19 @@ function OrdinaryTasks() {
         </CardContent>
       </Card>
     )}
-    <Card>
+    {visibleTasks.length > 0 ? (
+      <>
+        <div className="grid gap-3 xl:hidden">
+          {visibleTasks.map((task) => (
+            <OrdinaryTaskCard
+              key={task.task_id}
+              task={task}
+              locale={locale}
+              onDelete={() => void handleDeleteBackendTask(task)}
+            />
+          ))}
+        </div>
+        <Card className="hidden xl:block">
       <CardContent className="p-0">
         <Table>
           <TableHeader>
@@ -154,7 +186,7 @@ function OrdinaryTasks() {
                 <TableCell className="text-xs text-muted-foreground">{formatTaskRuntimeTime(task.updated_at, locale)}</TableCell>
                 <TableCell>
                   <div className="flex items-center gap-1">
-                    <Button asChild size="sm" variant="outline">
+                    <Button asChild size="sm" variant="outline" className="h-11">
                       <Link href={`/tasks/${encodeURIComponent(task.task_id)}`}>
                         {pickAppText(locale, '进入', 'Open')}
                         <ArrowRight className="ml-2 h-3.5 w-3.5" />
@@ -163,8 +195,9 @@ function OrdinaryTasks() {
                     <Button
                       size="icon"
                       variant="ghost"
-                      className="h-8 w-8 text-destructive hover:text-destructive"
+                      className="h-11 w-11 text-destructive hover:text-destructive"
                       onClick={() => void handleDeleteBackendTask(task)}
+                      aria-label={pickAppText(locale, `删除任务 ${task.short_title || task.task_id}`, `Delete task ${task.short_title || task.task_id}`)}
                       title={pickAppText(locale, '删除任务', 'Delete task')}
                     >
                       <Trash2 className="h-3.5 w-3.5" />
@@ -177,10 +210,80 @@ function OrdinaryTasks() {
         </Table>
       </CardContent>
     </Card>
+      </>
+    ) : null}
     </div>
   );
 }
 
+function OrdinaryTaskCard({
+  task,
+  locale,
+  onDelete,
+}: {
+  task: BackendTask;
+  locale: 'zh-CN' | 'en-US';
+  onDelete: () => void;
+}) {
+  const title = task.short_title || String(task.metadata?.short_title || '') || task.description || task.goal || task.task_id;
+
+  return (
+    <Card className="rounded-md">
+      <CardContent className="space-y-4 p-4">
+        <div className="min-w-0">
+          <div className="flex min-w-0 flex-wrap items-center gap-2">
+            <h2 className="min-w-0 flex-1 text-base font-semibold">{title}</h2>
+            {task.is_open ? <Badge variant="secondary">{pickAppText(locale, '进行中', 'Active')}</Badge> : null}
+          </div>
+          <p className="mt-1 line-clamp-2 text-sm text-muted-foreground">
+            {task.description || task.session_id}
+          </p>
+        </div>
+
+        <div className="grid grid-cols-2 gap-x-4 gap-y-3 text-xs">
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '状态', 'Status')}</div>
+            <Badge className="mt-1" variant={task.status === 'awaiting_acceptance' || task.status === 'closed' ? 'default' : 'secondary'}>
+              {taskStatusLabel(task.status, locale)}
+            </Badge>
+          </div>
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '来源', 'Source')}</div>
+            <div className="mt-1 text-sm">{taskSourceLabel(task, locale)}</div>
+          </div>
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '运行 / 技能', 'Runs / skills')}</div>
+            <div className="mt-1 text-sm">{task.run_ids.length} / {task.skill_names.length}</div>
+          </div>
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '更新时间', 'Updated')}</div>
+            <div className="mt-1 text-sm">{formatTaskRuntimeTime(task.updated_at, locale)}</div>
+          </div>
+        </div>
+
+        <div className="flex items-center justify-end gap-2 border-t border-border pt-3">
+          <Button
+            size="icon"
+            variant="ghost"
+            className="h-11 w-11 text-destructive hover:text-destructive"
+            onClick={onDelete}
+            aria-label={pickAppText(locale, `删除任务 ${title}`, `Delete task ${title}`)}
+            title={pickAppText(locale, '删除任务', 'Delete task')}
+          >
+            <Trash2 className="h-4 w-4" />
+          </Button>
+          <Button asChild variant="outline" className="h-11">
+            <Link href={`/tasks/${encodeURIComponent(task.task_id)}`}>
+              {pickAppText(locale, '进入任务', 'Open task')}
+              <ArrowRight className="ml-2 h-4 w-4" />
+            </Link>
+          </Button>
+        </div>
+      </CardContent>
+    </Card>
+  );
+}
+
 function taskStatusLabel(status: string, locale: 'zh-CN' | 'en-US') {
   const labels: Record<string, [string, string]> = {
     open: ['已创建', 'Open'],
@@ -246,6 +349,13 @@ function ScheduledTasks() {
     }
   };
 
+  const handleRemoveJob = (job: CronJob) => {
+    if (!window.confirm(pickAppText(locale, `删除定时任务“${job.name}”？`, `Delete scheduled task "${job.name}"?`))) {
+      return;
+    }
+    void runJobAction(() => removeCronJob(job.id));
+  };
+
   return (
     <div className="space-y-4">
       <div className="flex flex-wrap items-center justify-between gap-3">
@@ -254,11 +364,11 @@ function ScheduledTasks() {
           {pickAppText(locale, '每次触发会生成通知记录；需要修改时再接入 Task。', 'Each trigger creates a notification record; connect it to a Task when revision is needed.')}
         </div>
         <div className="flex items-center gap-2">
-          <Button onClick={() => void loadJobs()} variant="outline" size="sm">
+          <Button onClick={() => void loadJobs()} variant="outline" size="sm" className="h-11">
             <RefreshCw className="mr-2 h-4 w-4" />
             {pickAppText(locale, '刷新', 'Refresh')}
           </Button>
-          <Button onClick={() => setShowAdd(true)} size="sm">
+          <Button onClick={() => setShowAdd(true)} size="sm" className="h-11">
             <Plus className="mr-2 h-4 w-4" />
             {pickAppText(locale, '新建定时任务', 'New scheduled task')}
           </Button>
@@ -287,7 +397,23 @@ function ScheduledTasks() {
         />
       )}
 
-      <Card>
+      {!loading && jobs.length > 0 ? (
+        <div className="grid gap-3 xl:hidden">
+          {jobs.map((job) => (
+            <ScheduledJobCard
+              key={job.id}
+              job={job}
+              locale={locale}
+              formatTime={formatTime}
+              onToggle={(checked) => void runJobAction(() => toggleCronJob(job.id, checked))}
+              onRun={() => void runJobAction(() => runCronJob(job.id))}
+              onRemove={() => handleRemoveJob(job)}
+            />
+          ))}
+        </div>
+      ) : null}
+
+      <Card className={!loading && jobs.length > 0 ? 'hidden xl:block' : undefined}>
         <CardContent className="p-0">
           {loading ? (
             <div className="flex items-center justify-center py-16 text-muted-foreground">
@@ -316,7 +442,11 @@ function ScheduledTasks() {
                 {jobs.map((job) => (
                   <TableRow key={job.id}>
                     <TableCell>
-                      <Switch checked={job.enabled} onCheckedChange={(checked) => void runJobAction(() => toggleCronJob(job.id, checked))} />
+                      <Switch
+                        checked={job.enabled}
+                        onCheckedChange={(checked) => void runJobAction(() => toggleCronJob(job.id, checked))}
+                        aria-label={pickAppText(locale, `切换定时任务 ${job.name}`, `Toggle scheduled task ${job.name}`)}
+                      />
                     </TableCell>
                     <TableCell>
                       <div className="font-medium">{job.name}</div>
@@ -330,7 +460,7 @@ function ScheduledTasks() {
                       <span className="block max-w-[260px] truncate text-sm">{job.message}</span>
                     </TableCell>
                     <TableCell>
-                      <Button asChild size="sm" variant="outline" disabled={!job.last_scheduled_run_id && !job.last_task_id}>
+                      <Button asChild size="sm" variant="outline" className="h-11" disabled={!job.last_scheduled_run_id && !job.last_task_id}>
                         <Link href={job.last_scheduled_run_id ? `/notifications/${encodeURIComponent(job.last_scheduled_run_id)}` : job.last_task_id ? `/tasks/${encodeURIComponent(job.last_task_id)}` : '/tasks'}>
                           <FolderDown className="mr-2 h-3.5 w-3.5" />
                           {formatTime(job.last_run_at_ms)}
@@ -348,10 +478,24 @@ function ScheduledTasks() {
                     </TableCell>
                     <TableCell>
                       <div className="flex items-center gap-1">
-                        <Button variant="ghost" size="icon" className="h-8 w-8" onClick={() => void runJobAction(() => runCronJob(job.id))}>
+                        <Button
+                          variant="ghost"
+                          size="icon"
+                          className="h-11 w-11"
+                          onClick={() => void runJobAction(() => runCronJob(job.id))}
+                          aria-label={pickAppText(locale, `立即运行 ${job.name}`, `Run ${job.name} now`)}
+                          title={pickAppText(locale, '立即运行', 'Run now')}
+                        >
                           <Play className="h-3.5 w-3.5" />
                         </Button>
-                        <Button variant="ghost" size="icon" className="h-8 w-8 text-destructive hover:text-destructive" onClick={() => void runJobAction(() => removeCronJob(job.id))}>
+                        <Button
+                          variant="ghost"
+                          size="icon"
+                          className="h-11 w-11 text-destructive hover:text-destructive"
+                          onClick={() => handleRemoveJob(job)}
+                          aria-label={pickAppText(locale, `删除定时任务 ${job.name}`, `Delete scheduled task ${job.name}`)}
+                          title={pickAppText(locale, '删除定时任务', 'Delete scheduled task')}
+                        >
                           <Trash2 className="h-3.5 w-3.5" />
                         </Button>
                       </div>
@@ -367,6 +511,112 @@ function ScheduledTasks() {
   );
 }
 
+function ScheduledJobCard({
+  job,
+  locale,
+  formatTime,
+  onToggle,
+  onRun,
+  onRemove,
+}: {
+  job: CronJob;
+  locale: 'zh-CN' | 'en-US';
+  formatTime: (ms: number | null) => string;
+  onToggle: (checked: boolean) => void;
+  onRun: () => void;
+  onRemove: () => void;
+}) {
+  const historyHref = job.last_scheduled_run_id
+    ? `/notifications/${encodeURIComponent(job.last_scheduled_run_id)}`
+    : job.last_task_id
+      ? `/tasks/${encodeURIComponent(job.last_task_id)}`
+      : '/tasks';
+
+  return (
+    <Card className="rounded-md">
+      <CardContent className="space-y-4 p-4">
+        <div className="flex items-start justify-between gap-4">
+          <div className="min-w-0">
+            <h2 className="text-base font-semibold">{job.name}</h2>
+            <p className="mt-1 break-all text-xs text-muted-foreground">{job.id}</p>
+          </div>
+          <label className="flex min-h-11 shrink-0 items-center gap-2 text-sm">
+            <span className="sr-only">{pickAppText(locale, '启用', 'Enabled')}</span>
+            <Switch
+              checked={job.enabled}
+              onCheckedChange={onToggle}
+              aria-label={pickAppText(locale, `切换定时任务 ${job.name}`, `Toggle scheduled task ${job.name}`)}
+            />
+          </label>
+        </div>
+
+        <p className="text-sm leading-6 text-muted-foreground">{job.message}</p>
+
+        <div className="grid grid-cols-2 gap-x-4 gap-y-3 text-xs">
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '计划', 'Schedule')}</div>
+            <code className="mt-1 inline-block rounded bg-muted px-1.5 py-0.5">{job.schedule_display}</code>
+          </div>
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '下次运行', 'Next run')}</div>
+            <div className="mt-1 text-sm">{formatTime(job.next_run_at_ms)}</div>
+          </div>
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '上次运行', 'Last run')}</div>
+            <div className="mt-1 text-sm">{formatTime(job.last_run_at_ms)}</div>
+          </div>
+          <div>
+            <div className="text-muted-foreground">{pickAppText(locale, '状态', 'Status')}</div>
+            <div className="mt-1">
+              {job.last_status === 'ok' ? (
+                <Badge>{pickAppText(locale, '成功', 'OK')}</Badge>
+              ) : job.last_status === 'error' ? (
+                <Badge variant="destructive">{pickAppText(locale, '错误', 'Error')}</Badge>
+              ) : (
+                <span className="text-muted-foreground">-</span>
+              )}
+            </div>
+          </div>
+        </div>
+
+        <div className="flex flex-wrap items-center justify-end gap-2 border-t border-border pt-3">
+          <Button
+            asChild
+            variant="outline"
+            className="h-11"
+            disabled={!job.last_scheduled_run_id && !job.last_task_id}
+          >
+            <Link href={historyHref}>
+              <FolderDown className="mr-2 h-4 w-4" />
+              {pickAppText(locale, '运行历史', 'History')}
+            </Link>
+          </Button>
+          <Button
+            variant="ghost"
+            size="icon"
+            className="h-11 w-11"
+            onClick={onRun}
+            aria-label={pickAppText(locale, `立即运行 ${job.name}`, `Run ${job.name} now`)}
+            title={pickAppText(locale, '立即运行', 'Run now')}
+          >
+            <Play className="h-4 w-4" />
+          </Button>
+          <Button
+            variant="ghost"
+            size="icon"
+            className="h-11 w-11 text-destructive hover:text-destructive"
+            onClick={onRemove}
+            aria-label={pickAppText(locale, `删除定时任务 ${job.name}`, `Delete scheduled task ${job.name}`)}
+            title={pickAppText(locale, '删除定时任务', 'Delete scheduled task')}
+          >
+            <Trash2 className="h-4 w-4" />
+          </Button>
+        </div>
+      </CardContent>
+    </Card>
+  );
+}
+
 function AddJobForm({
   targetSessionKey,
   onAdd,
@@ -403,7 +653,14 @@ function AddJobForm({
       <CardHeader className="pb-4">
         <div className="flex items-center justify-between">
           <CardTitle className="text-base">{pickAppText(locale, '新建定时任务', 'New scheduled task')}</CardTitle>
-          <Button variant="ghost" size="icon" className="h-7 w-7" onClick={onCancel}>
+          <Button
+            variant="ghost"
+            size="icon"
+            className="h-11 w-11"
+            onClick={onCancel}
+            aria-label={pickAppText(locale, '关闭新建定时任务表单', 'Close new scheduled task form')}
+            title={pickAppText(locale, '关闭', 'Close')}
+          >
             <X className="h-4 w-4" />
           </Button>
         </div>
@@ -452,8 +709,8 @@ function AddJobForm({
             </p>
           </div>
           <div className="flex justify-end gap-2">
-            <Button type="button" variant="outline" onClick={onCancel}>{pickAppText(locale, '取消', 'Cancel')}</Button>
-            <Button type="submit" disabled={!name.trim() || !message.trim()}>
+            <Button type="button" variant="outline" className="h-11" onClick={onCancel}>{pickAppText(locale, '取消', 'Cancel')}</Button>
+            <Button type="submit" className="h-11" disabled={!name.trim() || !message.trim()}>
               <Plus className="mr-2 h-4 w-4" />
               {pickAppText(locale, '创建', 'Create')}
             </Button>
diff --git a/app-instance/frontend/components/AppRuntimeBridge.tsx b/app-instance/frontend/components/AppRuntimeBridge.tsx
index ac97476..f6bd612 100644
--- a/app-instance/frontend/components/AppRuntimeBridge.tsx
+++ b/app-instance/frontend/components/AppRuntimeBridge.tsx
@@ -4,6 +4,7 @@ import React from 'react';
 import { usePathname } from 'next/navigation';
 
 import { getStatus, listSessions, wsManager } from '@/lib/api';
+import { runtimeBridgeEnabledForPath } from '@/lib/channel-connector-state';
 import { useChatStore } from '@/lib/store';
 import type { ProcessWsEvent, SessionUpdatedEvent, WsEvent } from '@/types';
 
@@ -47,7 +48,7 @@ export function AppRuntimeBridge() {
   const ingestProcessEvent = useChatStore((state) => state.ingestProcessEvent);
   const statusCheckCleanupRef = React.useRef<(() => void) | null>(null);
   const statusCheckInFlightRef = React.useRef(false);
-  const chatRuntimeEnabled = pathname === '/' || pathname.startsWith('/tasks') || pathname.startsWith('/notifications');
+  const chatRuntimeEnabled = runtimeBridgeEnabledForPath(pathname);
 
   const loadSessions = React.useCallback(async () => {
     try {
diff --git a/app-instance/frontend/components/Header.tsx b/app-instance/frontend/components/Header.tsx
index ee9d80a..51b28e9 100644
--- a/app-instance/frontend/components/Header.tsx
+++ b/app-instance/frontend/components/Header.tsx
@@ -3,7 +3,7 @@
 import React from 'react';
 import Link from 'next/link';
 import { usePathname, useRouter } from 'next/navigation';
-import { Bell, Bot, ChevronDown, FolderOpen, ListTodo, LogOut, Mail, MessageSquare, Puzzle, Settings, Store, Wrench } from 'lucide-react';
+import { Bell, Bot, ChevronDown, FolderOpen, ListTodo, LogOut, Mail, Menu, MessageSquare, Puzzle, Settings, Store, Wrench, X } from 'lucide-react';
 import { logout } from '@/lib/api';
 import { LanguageSwitcher } from '@/components/LanguageSwitcher';
 import { Avatar, AvatarFallback } from '@/components/ui/avatar';
@@ -69,6 +69,7 @@ const Header = () => {
   const { locale } = useAppI18n();
   const pathname = usePathname();
   const router = useRouter();
+  const [mobileMenuOpen, setMobileMenuOpen] = React.useState(false);
   const user = useChatStore((s) => s.user);
   const isAuthLoading = useChatStore((s) => s.isAuthLoading);
   const setUser = useChatStore((s) => s.setUser);
@@ -93,108 +94,175 @@ const Header = () => {
     router.refresh();
   };
 
+  React.useEffect(() => {
+    setMobileMenuOpen(false);
+  }, [pathname]);
+
+  React.useEffect(() => {
+    if (!mobileMenuOpen) return;
+
+    const previousOverflow = document.body.style.overflow;
+    const handleKeyDown = (event: KeyboardEvent) => {
+      if (event.key === 'Escape') {
+        setMobileMenuOpen(false);
+      }
+    };
+
+    document.body.style.overflow = 'hidden';
+    document.addEventListener('keydown', handleKeyDown);
+
+    return () => {
+      document.body.style.overflow = previousOverflow;
+      document.removeEventListener('keydown', handleKeyDown);
+    };
+  }, [mobileMenuOpen]);
+
   const userInitial = (user?.username || user?.email || '?').trim().charAt(0).toUpperCase();
 
-  return (
-    <header className="fixed left-0 right-0 top-0 z-50 border-b border-[#E6E1DE] bg-[#F7F6F5]/95 backdrop-blur">
-      <div className="mx-auto max-w-[1720px] px-4 sm:px-6 lg:px-8">
-        <div className="grid h-16 grid-cols-[minmax(120px,1fr)_auto_minmax(120px,1fr)] items-center gap-4">
-          <Link href="/" className="flex shrink-0 items-center">
-            <span className="font-serif text-[28px] font-semibold leading-none text-[#0B0B0B]">
-              Beaver
-            </span>
-          </Link>
+  const renderNavLinks = (compact = false) =>
+    NAV_ITEMS.map((item) => {
+      const isActive =
+        item.href === '/'
+          ? pathname === '/'
+          : item.matchPrefixes?.some((prefix) => pathname.startsWith(prefix)) ?? pathname.startsWith(item.href);
+      const Icon = item.icon;
+      return (
+        <Link
+          key={item.href}
+          href={item.href}
+          onClick={compact ? () => setMobileMenuOpen(false) : undefined}
+          className={`flex h-11 shrink-0 items-center gap-2 rounded-full text-sm font-medium transition-colors ${
+            compact ? 'justify-start rounded-lg border border-transparent bg-background px-4' : 'px-4'
+          } ${
+            isActive
+              ? 'bg-primary text-primary-foreground'
+              : compact
+                ? 'text-[#4F4642] hover:border-[#E6E1DE] hover:bg-muted hover:text-[#0B0B0B]'
+                : 'text-[#4F4642] hover:bg-[#F7F5F4] hover:text-[#0B0B0B]'
+          }`}
+        >
+          <Icon className="h-4 w-4" />
+          {navLabel(item.key)}
+        </Link>
+      );
+    });
 
-          <nav className="flex items-center gap-1 rounded-full border border-[#E6E1DE] bg-white px-1.5 py-1 shadow-[0_1px_2px_rgba(0,0,0,0.04)]">
-              {NAV_ITEMS.map((item) => {
-                const isActive =
-                  item.href === '/'
-                    ? pathname === '/'
-                    : item.matchPrefixes?.some((prefix) => pathname.startsWith(prefix)) ?? pathname.startsWith(item.href);
-                const Icon = item.icon;
-                return (
-                  <Link
-                    key={item.href}
-                    href={item.href}
-                    className={`flex shrink-0 items-center gap-1.5 rounded-full px-4 py-2 text-sm font-medium transition-colors ${
-                      isActive
-                        ? 'bg-primary text-primary-foreground'
-                        : 'text-[#4F4642] hover:bg-[#F7F5F4] hover:text-[#0B0B0B]'
-                    }`}
-                  >
-                    <Icon className="w-4 h-4" />
-                    {navLabel(item.key)}
-                  </Link>
-                );
-              })}
+  return (
+    <>
+      <header className="fixed left-0 right-0 top-0 z-50 border-b border-[#E6E1DE] bg-[#F7F6F5]/95 backdrop-blur">
+        <div className="mx-auto max-w-[1720px] px-4 sm:px-6 lg:px-8">
+          <div className="flex h-16 items-center justify-between gap-3">
+            <div className="flex min-w-0 items-center gap-2">
+              <button
+                type="button"
+                className="inline-flex h-11 w-11 items-center justify-center rounded-full border border-[#E6E1DE] bg-white text-[#1D1715] transition-colors hover:bg-[#F7F5F4] 2xl:hidden"
+                aria-label={mobileMenuOpen ? pickAppText(locale, '关闭导航', 'Close navigation') : pickAppText(locale, '打开导航', 'Open navigation')}
+                aria-expanded={mobileMenuOpen}
+                aria-controls="app-primary-mobile-nav"
+                onClick={() => setMobileMenuOpen((open) => !open)}
+              >
+                {mobileMenuOpen ? <X className="h-5 w-5" /> : <Menu className="h-5 w-5" />}
+              </button>
+              <Link href="/" className="hidden h-11 shrink-0 items-center min-[360px]:flex">
+                <span className="font-serif text-[26px] font-semibold leading-none text-[#0B0B0B] sm:text-[28px]">
+                  Beaver
+                </span>
+              </Link>
+            </div>
+
+            <nav className="hidden items-center gap-1 rounded-full border border-[#E6E1DE] bg-white px-1.5 py-1 shadow-[0_1px_2px_rgba(0,0,0,0.04)] 2xl:flex">
+              {renderNavLinks(false)}
             </nav>
 
-          <div className="flex min-w-0 items-center justify-end gap-3">
-            <div className="hidden shrink-0 sm:block">
-              <ConnectionDot />
-            </div>
-            <div className="flex shrink-0 items-center gap-2">
-              <LanguageSwitcher />
-              {user ? (
-                <Popover>
-                  <PopoverTrigger asChild>
-                    <button
-                      type="button"
-                      className="flex items-center gap-2 rounded-full border border-[#E6E1DE] bg-white px-2 py-1.5 text-sm font-medium text-[#1D1715] transition-colors hover:bg-[#F7F5F4]"
-                    >
-                      <Avatar className="h-8 w-8 border border-[#E6E1DE]">
-                        <AvatarFallback className="bg-primary text-xs font-semibold text-primary-foreground">
-                          {userInitial}
-                        </AvatarFallback>
-                        </Avatar>
-                        <span className="hidden max-w-28 truncate sm:block">{user.username}</span>
-                        <ChevronDown className="h-4 w-4 text-muted-foreground" />
-                    </button>
-                  </PopoverTrigger>
-                  <PopoverContent align="end" className="w-80 rounded-3xl border-border/70 p-0 shadow-2xl">
-                    <div className="overflow-hidden rounded-3xl bg-[linear-gradient(180deg,#F7F5F4,#FFFFFF)]">
-                      <div className="border-b border-border/60 px-6 py-5">
-                        <p className="truncate text-center text-sm font-medium text-muted-foreground">
-                          {user.email}
-                        </p>
-                      </div>
-
-                      <div className="flex flex-col items-center gap-4 px-6 py-6 text-center">
-                        <Avatar className="h-24 w-24 border-4 border-white shadow-sm">
-                          <AvatarFallback className="bg-primary text-4xl font-semibold text-primary-foreground">
+            <div className="flex min-w-0 shrink-0 items-center justify-end gap-2 sm:gap-3">
+              <div className="hidden shrink-0 xl:block">
+                <ConnectionDot />
+              </div>
+              <div className="flex shrink-0 items-center gap-2">
+                <LanguageSwitcher />
+                {user ? (
+                  <Popover>
+                    <PopoverTrigger asChild>
+                      <button
+                        type="button"
+                        className="flex h-11 w-11 items-center justify-center gap-2 rounded-full border border-[#E6E1DE] bg-white px-1.5 text-sm font-medium text-[#1D1715] transition-colors hover:bg-[#F7F5F4] sm:w-auto sm:justify-start sm:px-2"
+                        aria-label={pickAppText(locale, '打开账号菜单', 'Open account menu')}
+                      >
+                        <Avatar className="h-8 w-8 border border-[#E6E1DE]">
+                          <AvatarFallback className="bg-primary text-xs font-semibold text-primary-foreground">
                             {userInitial}
                           </AvatarFallback>
                         </Avatar>
-                        <div className="space-y-1">
-                          <p className="text-2xl font-semibold tracking-tight text-foreground">
-                            {pickAppText(locale, `${user.username}，你好！`, `Hi, ${user.username}`)}
-                          </p>
-                          <p className="text-sm text-muted-foreground">
-                            {pickAppText(locale, '当前已登录到你的工作区实例。', 'You are currently signed in to your workspace instance.')}
+                        <span className="hidden max-w-28 truncate sm:block">{user.username}</span>
+                        <ChevronDown className="hidden h-4 w-4 text-muted-foreground sm:block" />
+                      </button>
+                    </PopoverTrigger>
+                    <PopoverContent align="end" className="w-80 rounded-3xl border-border/70 p-0 shadow-2xl">
+                      <div className="overflow-hidden rounded-3xl bg-[linear-gradient(180deg,#F7F5F4,#FFFFFF)]">
+                        <div className="border-b border-border/60 px-6 py-5">
+                          <p className="truncate text-center text-sm font-medium text-muted-foreground">
+                            {user.email}
                           </p>
                         </div>
-                      </div>
 
-                      <div className="border-t border-border/60 bg-white/90 px-4 py-4">
-                        <Button
-                          type="button"
-                          variant="outline"
-                          onClick={handleLogout}
-                          className="h-12 w-full justify-center rounded-2xl text-sm font-semibold"
-                        >
-                          <LogOut className="mr-2 h-4 w-4" />
-                          {pickAppText(locale, '退出登录', 'Sign Out')}
-                        </Button>
+                        <div className="flex flex-col items-center gap-4 px-6 py-6 text-center">
+                          <Avatar className="h-24 w-24 border-4 border-white shadow-sm">
+                            <AvatarFallback className="bg-primary text-4xl font-semibold text-primary-foreground">
+                              {userInitial}
+                            </AvatarFallback>
+                          </Avatar>
+                          <div className="space-y-1">
+                            <p className="text-2xl font-semibold tracking-tight text-foreground">
+                              {pickAppText(locale, `${user.username}，你好！`, `Hi, ${user.username}`)}
+                            </p>
+                            <p className="text-sm text-muted-foreground">
+                              {pickAppText(locale, '当前已登录到你的工作区实例。', 'You are currently signed in to your workspace instance.')}
+                            </p>
+                          </div>
+                        </div>
+
+                        <div className="border-t border-border/60 bg-white/90 px-4 py-4">
+                          <Button
+                            type="button"
+                            variant="outline"
+                            onClick={handleLogout}
+                            className="h-12 w-full justify-center rounded-2xl text-sm font-semibold"
+                          >
+                            <LogOut className="mr-2 h-4 w-4" />
+                            {pickAppText(locale, '退出登录', 'Sign Out')}
+                          </Button>
+                        </div>
                       </div>
-                    </div>
-                  </PopoverContent>
-                </Popover>
-              ) : !isAuthLoading ? null : null}
+                    </PopoverContent>
+                  </Popover>
+                ) : !isAuthLoading ? null : null}
+              </div>
             </div>
           </div>
         </div>
-      </div>
-    </header>
+      </header>
+      {mobileMenuOpen && (
+        <>
+          <button
+            type="button"
+            className="fixed inset-x-0 bottom-0 top-16 z-40 bg-black/40 2xl:hidden"
+            aria-label={pickAppText(locale, '关闭导航', 'Close navigation')}
+            onClick={() => setMobileMenuOpen(false)}
+          />
+          <nav
+            id="app-primary-mobile-nav"
+            aria-label={pickAppText(locale, '主导航', 'Primary navigation')}
+            className="fixed bottom-0 left-0 top-16 z-[45] isolate w-[min(86vw,320px)] overflow-y-auto border-r border-[#E6E1DE] bg-background text-foreground shadow-[12px_0_32px_rgba(29,23,21,0.24)] animate-in slide-in-from-left-full duration-200 2xl:hidden"
+          >
+            <div className="min-h-full bg-background px-4 py-5">
+              <div className="grid gap-2 bg-background">
+              {renderNavLinks(true)}
+              </div>
+            </div>
+          </nav>
+        </>
+      )}
+    </>
   );
 };
 
diff --git a/app-instance/frontend/components/LanguageSwitcher.tsx b/app-instance/frontend/components/LanguageSwitcher.tsx
index 6e9605b..5c8aa8d 100644
--- a/app-instance/frontend/components/LanguageSwitcher.tsx
+++ b/app-instance/frontend/components/LanguageSwitcher.tsx
@@ -27,7 +27,7 @@ export function LanguageSwitcher({ className }: { className?: string }) {
           type="button"
           onClick={() => setLocale(option.value)}
           className={cn(
-            'rounded px-2 py-1 text-xs font-medium transition-colors',
+            'h-11 w-11 rounded text-xs font-medium transition-colors',
             locale === option.value
               ? 'bg-background text-foreground shadow-sm'
               : 'text-muted-foreground hover:text-foreground'
diff --git a/app-instance/frontend/components/chat-workbench/CurrentSessionProgressSidebar.tsx b/app-instance/frontend/components/chat-workbench/CurrentSessionProgressSidebar.tsx
index 53d278c..275eec8 100644
--- a/app-instance/frontend/components/chat-workbench/CurrentSessionProgressSidebar.tsx
+++ b/app-instance/frontend/components/chat-workbench/CurrentSessionProgressSidebar.tsx
@@ -1,254 +1,21 @@
 'use client';
 
 import React from 'react';
-import {
-  AlertCircle,
-  CheckCircle2,
-  Circle,
-  FileJson,
-  FileOutput,
-  FileText,
-  Image as ImageIcon,
-  Link2,
-  ListChecks,
-  Loader2,
-  PanelRightOpen,
-  X,
-} from 'lucide-react';
+import { Activity, PanelRightOpen, X } from 'lucide-react';
 
+import { TaskTimeline } from '@/components/task-detail';
 import { ScrollArea } from '@/components/ui/scroll-area';
-import { appStatusLabel } from '@/lib/i18n/common';
 import { pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
-import type {
-  SessionProgressArtifactView,
-  SessionProgressStepView,
-  SessionProgressView,
-} from '@/lib/session-progress';
-import type { ProcessArtifact, ProcessRunStatus } from '@/types';
-
-function formatShortTime(value: string, locale: 'zh-CN' | 'en-US') {
-  const date = new Date(value);
-  if (Number.isNaN(date.getTime())) return value;
-  return new Intl.DateTimeFormat(locale, {
-    hour: '2-digit',
-    minute: '2-digit',
-  }).format(date);
-}
-
-function statusTone(status: ProcessRunStatus) {
-  if (status === 'done') return 'text-[#2F8D50] bg-[#E3F1E7] border-[#B8D9C2]';
-  if (status === 'running') return 'text-[#2F6FCA] bg-[#E7EEF9] border-[#B8CBE8]';
-  if (status === 'error') return 'text-[#8A3A2D] bg-[#F0E5E1] border-[#D9BDB4]';
-  if (status === 'cancelled') return 'text-[#6A5E58] bg-[#ECE8E5] border-[#D8D2CE]';
-  return 'text-[#6A5E58] bg-[#F0ECE9] border-[#D8D2CE]';
-}
-
-function StepMarker({ step, index }: { step: SessionProgressStepView; index: number }) {
-  if (step.status === 'done') {
-    return (
-      <span className="flex h-6 w-6 items-center justify-center rounded-full bg-[#2F8D50] text-white">
-        <CheckCircle2 className="h-4 w-4" />
-      </span>
-    );
-  }
-  if (step.status === 'running') {
-    return (
-      <span className="flex h-6 w-6 items-center justify-center rounded-full bg-[#2F6FCA] text-[11px] font-semibold text-white">
-        {index + 1}
-      </span>
-    );
-  }
-  if (step.status === 'error') {
-    return (
-      <span className="flex h-6 w-6 items-center justify-center rounded-full bg-[#8A3A2D] text-white">
-        <AlertCircle className="h-4 w-4" />
-      </span>
-    );
-  }
-  return (
-    <span className="flex h-6 w-6 items-center justify-center rounded-full bg-[#D8D2CE] text-[#6A5E58]">
-      <Circle className="h-3.5 w-3.5" />
-    </span>
-  );
-}
-
-function artifactIcon(type: ProcessArtifact['artifact_type']) {
-  if (type === 'json') return <FileJson className="h-4 w-4" />;
-  if (type === 'image') return <ImageIcon className="h-4 w-4" />;
-  if (type === 'link') return <Link2 className="h-4 w-4" />;
-  if (type === 'markdown' || type === 'text') return <FileText className="h-4 w-4" />;
-  return <FileOutput className="h-4 w-4" />;
-}
-
-function ProgressHeader({ view }: { view: SessionProgressView }) {
-  const { locale } = useAppI18n();
-  const percent = view.progress.percent;
-
-  return (
-    <section className="rounded-lg border border-[#ECE7E3] bg-white px-4 py-4 shadow-[0_8px_24px_rgba(0,0,0,0.04)]">
-      <div className="flex items-start gap-3">
-        <div className="mt-0.5 flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-[#E3F1E7] text-[#2F8D50]">
-          <ListChecks className="h-4 w-4" />
-        </div>
-        <div className="min-w-0 flex-1">
-          <div className="line-clamp-2 text-sm font-semibold text-foreground">{view.title}</div>
-          <div className="mt-2 flex items-center gap-2">
-            <span className={`rounded-full border px-2 py-0.5 text-[11px] font-medium ${statusTone(view.status)}`}>
-              {appStatusLabel(view.status, locale)}
-            </span>
-            <span className="text-[11px] text-muted-foreground">
-              {pickAppText(locale, '更新于', 'Updated')} {formatShortTime(view.updatedAt, locale)}
-            </span>
-          </div>
-        </div>
-      </div>
-
-      <div className="mt-4">
-        <div className="mb-2 flex items-center justify-between gap-3 text-xs text-muted-foreground">
-          <span>{view.progress.label}</span>
-          {percent !== null && <span className="font-medium text-foreground">{percent}%</span>}
-        </div>
-        <div className="h-2 overflow-hidden rounded-full bg-[#ECE8E5]">
-          <div
-            className="h-full rounded-full bg-[#5DB56F] transition-all"
-            style={{ width: `${percent ?? 0}%` }}
-          />
-        </div>
-      </div>
-
-      {view.summary && (
-        <p className="mt-3 line-clamp-3 text-xs leading-5 text-muted-foreground">{view.summary}</p>
-      )}
-    </section>
-  );
-}
-
-function StepList({ steps }: { steps: SessionProgressStepView[] }) {
-  const { locale } = useAppI18n();
-
-  return (
-    <section className="rounded-lg border border-[#ECE7E3] bg-white px-4 py-4">
-      <div className="mb-4 flex items-center justify-between">
-        <h3 className="text-sm font-semibold text-foreground">
-          {pickAppText(locale, '运行步骤', 'Run Steps')}
-        </h3>
-        <span className="text-xs text-muted-foreground">
-          {pickAppText(locale, `${steps.length} 步`, `${steps.length} steps`)}
-        </span>
-      </div>
-
-      <div className="space-y-0">
-        {steps.map((step, index) => (
-          <div key={step.runId} className="grid grid-cols-[24px_1fr] gap-3">
-            <div className="flex flex-col items-center">
-              <StepMarker step={step} index={index} />
-              {index < steps.length - 1 && <span className="mt-2 h-full min-h-8 w-px bg-[#E6E1DE]" />}
-            </div>
-            <div className="pb-5">
-              <div className="flex items-start justify-between gap-3">
-                <div className="min-w-0">
-                  <div className="line-clamp-2 text-sm font-medium text-foreground">
-                    {index + 1}. {step.title}
-                  </div>
-                  <div className="mt-1 text-[11px] text-muted-foreground">
-                    {step.actorName} · {formatShortTime(step.updatedAt, locale)}
-                  </div>
-                </div>
-                <span className={`shrink-0 rounded-full border px-2 py-0.5 text-[11px] ${statusTone(step.status)}`}>
-                  {appStatusLabel(step.status, locale)}
-                </span>
-              </div>
-              {step.description && (
-                <p className="mt-2 line-clamp-3 text-xs leading-5 text-muted-foreground">
-                  {step.description}
-                </p>
-              )}
-              {step.status === 'running' && (
-                <div className="mt-2 flex items-center gap-1.5 text-[11px] text-[#2F6FCA]">
-                  <Loader2 className="h-3 w-3 animate-spin" />
-                  <span>{pickAppText(locale, '正在处理', 'In progress')}</span>
-                </div>
-              )}
-            </div>
-          </div>
-        ))}
-      </div>
-    </section>
-  );
-}
-
-function ArtifactRow({ artifact }: { artifact: SessionProgressArtifactView }) {
-  return (
-    <a
-      href={artifact.url || undefined}
-      target={artifact.url ? '_blank' : undefined}
-      rel={artifact.url ? 'noreferrer' : undefined}
-      className="block rounded-lg border border-[#ECE7E3] bg-[#FDFDFC] px-3 py-3 transition-colors hover:bg-[#F7F6F5]"
-    >
-      <div className="flex items-start gap-3">
-        <div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-[#ECE8E5] text-[#5F5550]">
-          {artifactIcon(artifact.type)}
-        </div>
-        <div className="min-w-0 flex-1">
-          <div className="truncate text-sm font-medium text-foreground">{artifact.title}</div>
-          <div className="mt-1 text-[11px] text-muted-foreground">
-            {artifact.actorName} · {artifact.typeLabel}
-          </div>
-          <p className="mt-2 line-clamp-2 text-xs leading-5 text-muted-foreground">{artifact.preview}</p>
-        </div>
-      </div>
-    </a>
-  );
-}
-
-function ArtifactSection({ view }: { view: SessionProgressView }) {
-  const { locale } = useAppI18n();
-
-  return (
-    <section className="rounded-lg border border-[#ECE7E3] bg-white px-4 py-4">
-      <div className="mb-3 flex items-center justify-between">
-        <h3 className="text-sm font-semibold text-foreground">
-          {pickAppText(locale, '生成内容', 'Generated Content')}
-        </h3>
-        <span className="text-xs text-muted-foreground">
-          {pickAppText(locale, `${view.artifacts.length} 个`, `${view.artifacts.length} items`)}
-        </span>
-      </div>
-
-      {view.artifactTypeSummaries.length > 0 ? (
-        <div className="mb-3 flex flex-wrap gap-2">
-          {view.artifactTypeSummaries.map((item) => (
-            <span
-              key={item.type}
-              className="inline-flex items-center gap-1.5 rounded-full border border-[#E6E1DE] bg-[#F7F6F5] px-2.5 py-1 text-xs text-[#4F4642]"
-            >
-              {artifactIcon(item.type)}
-              <span>{item.label}</span>
-              <span className="font-semibold">{item.count}</span>
-            </span>
-          ))}
-        </div>
-      ) : (
-        <p className="mb-3 text-xs text-muted-foreground">
-          {pickAppText(locale, '暂时还没有生成内容。', 'No generated content yet.')}
-        </p>
-      )}
-
-      <div className="space-y-2">
-        {view.artifacts.map((artifact) => (
-          <ArtifactRow key={artifact.artifactId} artifact={artifact} />
-        ))}
-      </div>
-    </section>
-  );
-}
+import type { TaskTimelineCard } from '@/types';
 
 function ProgressPanel({
-  view,
+  cards,
+  isLive,
   onClose,
 }: {
-  view: SessionProgressView;
+  cards: TaskTimelineCard[];
+  isLive: boolean;
   onClose?: () => void;
 }) {
   const { locale } = useAppI18n();
@@ -260,11 +27,14 @@ function ProgressPanel({
           <h2 className="text-base font-semibold text-foreground">
             {pickAppText(locale, '当前会话的运行进度', 'Current Session Progress')}
           </h2>
-          <p className="text-xs text-muted-foreground">
-            {pickAppText(locale, '任务列表会自动刷新', 'Task updates refresh automatically')}
+          <p className="flex items-center gap-1.5 text-xs text-muted-foreground">
+            {isLive ? <Activity className="h-3.5 w-3.5" /> : null}
+            {isLive
+              ? pickAppText(locale, '任务时间线实时更新', 'Task timeline updates live')
+              : pickAppText(locale, '与任务详情时间线一致', 'Matches the Task detail timeline')}
           </p>
         </div>
-        {onClose && (
+        {onClose ? (
           <button
             type="button"
             onClick={onClose}
@@ -273,28 +43,32 @@ function ProgressPanel({
           >
             <X className="h-4 w-4" />
           </button>
-        )}
+        ) : null}
       </div>
 
       <ScrollArea className="min-h-0 flex-1 px-4 py-4">
-        <div className="space-y-4 pb-6">
-          <ProgressHeader view={view} />
-          <StepList steps={view.steps} />
-          <ArtifactSection view={view} />
+        <div className="pb-6">
+          <TaskTimeline cards={cards} isLive={isLive} showHeader={false} />
         </div>
       </ScrollArea>
     </div>
   );
 }
 
-export function CurrentSessionProgressSidebar({ view }: { view: SessionProgressView }) {
+export function CurrentSessionProgressSidebar({
+  cards,
+  isLive,
+}: {
+  cards: TaskTimelineCard[];
+  isLive: boolean;
+}) {
   const { locale } = useAppI18n();
   const [mobileOpen, setMobileOpen] = React.useState(false);
 
   return (
     <>
       <aside className="hidden h-full w-[380px] shrink-0 border-l border-[#E6E1DE] xl:flex">
-        <ProgressPanel view={view} />
+        <ProgressPanel cards={cards} isLive={isLive} />
       </aside>
 
       <button
@@ -306,7 +80,7 @@ export function CurrentSessionProgressSidebar({ view }: { view: SessionProgressV
         <PanelRightOpen className="h-5 w-5" />
       </button>
 
-      {mobileOpen && (
+      {mobileOpen ? (
         <div className="fixed inset-0 z-50 xl:hidden">
           <button
             type="button"
@@ -315,10 +89,10 @@ export function CurrentSessionProgressSidebar({ view }: { view: SessionProgressV
             aria-label={pickAppText(locale, '关闭进度面板', 'Close progress panel')}
           />
           <div className="absolute inset-y-0 right-0 w-[min(92vw,390px)] border-l border-[#E6E1DE] shadow-2xl">
-            <ProgressPanel view={view} onClose={() => setMobileOpen(false)} />
+            <ProgressPanel cards={cards} isLive={isLive} onClose={() => setMobileOpen(false)} />
           </div>
         </div>
-      )}
+      ) : null}
     </>
   );
 }
diff --git a/app-instance/frontend/components/chat-workbench/MessageList.tsx b/app-instance/frontend/components/chat-workbench/MessageList.tsx
index 9b6b637..dcebb7f 100644
--- a/app-instance/frontend/components/chat-workbench/MessageList.tsx
+++ b/app-instance/frontend/components/chat-workbench/MessageList.tsx
@@ -10,6 +10,14 @@ import { getTaskCardMessageIndexes, hasVisibleChatContent, normalizedMessageText
 import { AgentTeamBlock } from '@/components/chat-workbench/AgentTeamBlock';
 import { MarkdownContent } from '@/components/chat-workbench/MarkdownContent';
 import { ScrollArea } from '@/components/ui/scroll-area';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
 import { pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
 import { containedPreservedLongTextClass } from '@/lib/text-wrapping';
@@ -58,6 +66,8 @@ function MessageBubble({
   const textContent = normalizedMessageText(message.content);
   const [feedbackMode, setFeedbackMode] = React.useState<'accept' | null>(null);
   const [feedbackComment, setFeedbackComment] = React.useState('');
+  const [confirmAbandonOpen, setConfirmAbandonOpen] = React.useState(false);
+  const feedbackTextareaId = message.run_id ? `feedback-note-${message.run_id}` : undefined;
 
   return (
     <div className={`flex gap-3 ${isUser ? 'justify-end' : ''}`}>
@@ -130,7 +140,7 @@ function MessageBubble({
               </div>
               <Link
                 href={`/tasks/${encodeURIComponent(message.task_id)}`}
-                className="inline-flex h-8 items-center gap-1 rounded-md bg-primary px-3 text-xs font-medium text-primary-foreground hover:bg-primary/90"
+                className="inline-flex h-11 items-center gap-1 rounded-md bg-primary px-3 text-xs font-medium text-primary-foreground hover:bg-primary/90"
               >
                 {pickAppText(locale, '查看任务', 'Open task')}
                 <ChevronRight className="h-3.5 w-3.5" />
@@ -157,7 +167,7 @@ function MessageBubble({
                   <button
                     type="button"
                     onClick={() => setFeedbackMode('accept')}
-                    className="inline-flex h-8 items-center gap-1 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent hover:text-foreground"
+                    className="inline-flex h-11 items-center gap-1 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent hover:text-foreground"
                   >
                     <ThumbsUp className="h-3.5 w-3.5" />
                     {pickAppText(locale, '接受', 'Accept')}
@@ -165,15 +175,15 @@ function MessageBubble({
                   <button
                     type="button"
                     onClick={() => onRequestRevision(message.run_id!)}
-                    className="inline-flex h-8 items-center gap-1 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent hover:text-foreground"
+                    className="inline-flex h-11 items-center gap-1 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent hover:text-foreground"
                   >
                     <RefreshCcw className="h-3.5 w-3.5" />
                     {pickAppText(locale, '需要修改', 'Revise')}
                   </button>
                   <button
                     type="button"
-                    onClick={() => onFeedback(message.run_id!, 'abandon')}
-                    className="inline-flex h-8 items-center gap-1 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent hover:text-foreground"
+                    onClick={() => setConfirmAbandonOpen(true)}
+                    className="inline-flex h-11 items-center gap-1 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent hover:text-foreground"
                   >
                     <XCircle className="h-3.5 w-3.5" />
                     {pickAppText(locale, '放弃', 'Abandon')}
@@ -181,7 +191,11 @@ function MessageBubble({
                 </div>
                 {feedbackMode && (
                   <div className="space-y-2 rounded-md border border-border bg-background p-2">
+                    <label htmlFor={feedbackTextareaId} className="sr-only">
+                      {pickAppText(locale, '接受反馈备注', 'Acceptance note')}
+                    </label>
                     <textarea
+                      id={feedbackTextareaId}
                       value={feedbackComment}
                       onChange={(event) => setFeedbackComment(event.target.value)}
                       placeholder={pickAppText(locale, '可选：补充说明...', 'Optional note...')}
@@ -194,14 +208,14 @@ function MessageBubble({
                           setFeedbackMode(null);
                           setFeedbackComment('');
                         }}
-                        className="h-8 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent"
+                        className="h-11 rounded-md border border-border px-3 text-xs text-muted-foreground hover:bg-accent"
                       >
                         {pickAppText(locale, '取消', 'Cancel')}
                       </button>
                       <button
                         type="button"
                         onClick={() => onFeedback(message.run_id!, feedbackMode, feedbackComment.trim() || undefined)}
-                        className="h-8 rounded-md bg-primary px-3 text-xs font-medium text-primary-foreground hover:bg-primary/90"
+                        className="h-11 rounded-md bg-primary px-3 text-xs font-medium text-primary-foreground hover:bg-primary/90"
                       >
                         {pickAppText(locale, '提交', 'Submit')}
                       </button>
@@ -210,6 +224,35 @@ function MessageBubble({
                 )}
               </>
             )}
+            <Dialog open={confirmAbandonOpen} onOpenChange={setConfirmAbandonOpen}>
+              <DialogContent className="max-w-[calc(100vw-2rem)] sm:max-w-md">
+                <DialogHeader>
+                  <DialogTitle>{pickAppText(locale, '放弃当前任务？', 'Abandon this task?')}</DialogTitle>
+                  <DialogDescription>
+                    {pickAppText(locale, '放弃后会停止等待该任务的验收结果，此操作需要明确确认。', 'This stops waiting for this task acceptance result and requires confirmation.')}
+                  </DialogDescription>
+                </DialogHeader>
+                <DialogFooter className="gap-2 sm:gap-2">
+                  <button
+                    type="button"
+                    onClick={() => setConfirmAbandonOpen(false)}
+                    className="h-11 rounded-md border border-border px-4 text-sm text-muted-foreground hover:bg-accent"
+                  >
+                    {pickAppText(locale, '取消', 'Cancel')}
+                  </button>
+                  <button
+                    type="button"
+                    onClick={() => {
+                      setConfirmAbandonOpen(false);
+                      onFeedback(message.run_id!, 'abandon');
+                    }}
+                    className="h-11 rounded-md bg-destructive px-4 text-sm font-medium text-destructive-foreground hover:bg-destructive/90"
+                  >
+                    {pickAppText(locale, '确认放弃', 'Confirm abandon')}
+                  </button>
+                </DialogFooter>
+              </DialogContent>
+            </Dialog>
             {message.feedback_error && (
               <span className="text-xs text-destructive">{message.feedback_error}</span>
             )}
@@ -394,8 +437,8 @@ export function MessageList({
   })();
 
   return (
-    <ScrollArea className="h-full px-8" viewportRef={viewportRef}>
-      <div className="mx-auto max-w-5xl space-y-8 py-10">
+    <ScrollArea className="h-full px-3 sm:px-5 md:px-8" viewportRef={viewportRef}>
+      <div className="mx-auto max-w-5xl space-y-8 py-6 md:py-10">
         {visibleMessages.length === 0 && teamGroups.length === 0 && !isThinking && (
           <div className="flex flex-col items-center justify-center py-20 text-muted-foreground">
             <Bot className="w-12 h-12 mb-4 opacity-50" />
diff --git a/app-instance/frontend/components/skills/SkillDetailView.tsx b/app-instance/frontend/components/skills/SkillDetailView.tsx
index 42737ca..5dcd52b 100644
--- a/app-instance/frontend/components/skills/SkillDetailView.tsx
+++ b/app-instance/frontend/components/skills/SkillDetailView.tsx
@@ -54,27 +54,27 @@ export function SkillDetailView({
 }: SkillDetailViewProps) {
   const readme = stripFrontmatter(content || '');
   return (
-    <div className="rounded-lg border border-border bg-white text-black [--background:0_0%_100%] [--card:0_0%_100%] [--card-foreground:0_0%_0%] [--foreground:0_0%_0%] [--muted-foreground:0_0%_0%] [--popover:0_0%_100%] [--popover-foreground:0_0%_0%] [--secondary-foreground:0_0%_0%]">
-      <div className="border-b border-border p-5">
+    <div className="min-w-0 rounded-lg border border-border bg-white text-black [--background:0_0%_100%] [--card:0_0%_100%] [--card-foreground:0_0%_0%] [--foreground:0_0%_0%] [--muted-foreground:0_0%_0%] [--popover:0_0%_100%] [--popover-foreground:0_0%_0%] [--secondary-foreground:0_0%_0%]">
+      <div className="border-b border-border p-4 sm:p-5">
         <div className="flex flex-wrap items-start justify-between gap-4">
-          <div className="min-w-0">
+          <div className="min-w-0 flex-1">
             <div className="mb-2 flex flex-wrap items-center gap-2">
               {badges}
               <Badge variant="outline">v{currentVersion || '-'}</Badge>
               {loadingVersion && <Loader2 className="h-4 w-4 animate-spin text-muted-foreground" />}
             </div>
             <h2 className="break-words text-2xl font-semibold tracking-normal">{title}</h2>
-            {summary && <p className="mt-2 max-w-4xl text-sm leading-6 text-muted-foreground">{summary}</p>}
+            {summary && <p className="mt-2 max-w-4xl break-words text-sm leading-6 text-muted-foreground">{summary}</p>}
           </div>
           {actions}
         </div>
       </div>
 
-      <Tabs defaultValue="overview" className="p-5">
-        <TabsList>
-          <TabsTrigger value="overview">{labels.overview}</TabsTrigger>
-          <TabsTrigger value="files">{labels.files}</TabsTrigger>
-          <TabsTrigger value="versions">{labels.versions}</TabsTrigger>
+      <Tabs defaultValue="overview" className="p-4 sm:p-5">
+        <TabsList className="h-auto min-h-11 flex-wrap">
+          <TabsTrigger value="overview" className="min-h-11">{labels.overview}</TabsTrigger>
+          <TabsTrigger value="files" className="min-h-11">{labels.files}</TabsTrigger>
+          <TabsTrigger value="versions" className="min-h-11">{labels.versions}</TabsTrigger>
         </TabsList>
 
         <TabsContent value="overview" className="mt-5">
@@ -86,7 +86,7 @@ export function SkillDetailView({
         </TabsContent>
 
         <TabsContent value="files" className="mt-5">
-          <div className="grid gap-4 lg:grid-cols-[320px_minmax(0,1fr)]">
+          <div className="grid min-w-0 gap-4 lg:grid-cols-[minmax(0,320px)_minmax(0,1fr)]">
             <div className="min-h-[420px] rounded-lg border border-border">
               {files.length === 0 ? (
                 <EmptyPanel icon={<FileText className="h-7 w-7" />} text={labels.noFiles} />
@@ -96,7 +96,7 @@ export function SkillDetailView({
                     <button
                       key={file.filePath}
                       type="button"
-                      className={`flex w-full items-center justify-between gap-3 rounded-md px-3 py-2 text-left text-sm transition hover:bg-muted ${
+                      className={`flex min-h-11 w-full items-center justify-between gap-3 rounded-md px-3 py-3 text-left text-sm transition hover:bg-muted ${
                         selectedFile?.filePath === file.filePath ? 'bg-muted' : ''
                       }`}
                       onClick={() => onOpenFile(file.filePath)}
@@ -109,7 +109,7 @@ export function SkillDetailView({
               )}
             </div>
 
-            <div className="min-h-[420px] rounded-lg border border-border bg-muted/20 p-4">
+            <div className="min-w-0 rounded-lg border border-border bg-muted/20 p-4 lg:min-h-[420px]">
               {loadingFile ? (
                 <div className="flex h-[360px] items-center justify-center">
                   <Loader2 className="h-5 w-5 animate-spin text-muted-foreground" />
@@ -129,7 +129,7 @@ export function SkillDetailView({
               <button
                 key={version.version}
                 type="button"
-                className={`flex w-full items-center justify-between gap-4 rounded-lg border px-4 py-3 text-left transition hover:bg-muted ${
+                className={`flex min-h-11 w-full flex-col gap-3 rounded-lg border px-4 py-3 text-left transition hover:bg-muted sm:flex-row sm:items-center sm:justify-between sm:gap-4 ${
                   version.version === currentVersion ? 'border-primary bg-muted' : 'border-border'
                 }`}
                 onClick={() => onSelectVersion(version.version)}
@@ -137,15 +137,15 @@ export function SkillDetailView({
                 <div className="min-w-0">
                   <div className="flex flex-wrap items-center gap-2">
                     <GitBranch className="h-4 w-4 text-muted-foreground" />
-                    <span className="font-mono text-sm">{version.version}</span>
+                    <span className="break-all font-mono text-sm">{version.version}</span>
                     {version.version === currentVersion && <Badge variant="secondary">{labels.current}</Badge>}
                     {version.status && <Badge variant="outline">{version.status}</Badge>}
                   </div>
                   {version.changeReason && (
-                    <p className="mt-1 truncate text-xs text-muted-foreground">{version.changeReason}</p>
+                    <p className="mt-1 break-words text-xs text-muted-foreground">{version.changeReason}</p>
                   )}
                 </div>
-                <div className="shrink-0 text-right text-xs text-muted-foreground">
+                <div className="shrink-0 text-left text-xs text-muted-foreground sm:text-right">
                   {version.publishedAt || version.createdAt || ''}
                   {typeof version.totalSize === 'number' && (
                     <div>
@@ -165,7 +165,7 @@ export function SkillDetailView({
 function FilePreview({ file, labels }: { file: SkillFileContent; labels: SkillDetailViewProps['labels'] }) {
   const content = file.content || '';
   return (
-    <div className="space-y-3">
+    <div className="min-w-0 space-y-3">
       <div className="flex flex-wrap items-center justify-between gap-2">
         <div className="break-all font-mono text-sm font-medium">{file.filePath}</div>
         <Badge variant="outline">
@@ -177,7 +177,7 @@ function FilePreview({ file, labels }: { file: SkillFileContent; labels: SkillDe
       ) : isMarkdown(file.filePath, file.contentType) ? (
         <MarkdownPreview content={stripFrontmatter(content)} />
       ) : (
-        <pre className="max-h-[560px] overflow-auto rounded-md border border-border bg-background p-4 text-xs leading-5">
+        <pre className="max-h-[560px] max-w-full overflow-auto whitespace-pre-wrap break-words rounded-md border border-border bg-background p-4 text-xs leading-5">
           {content}
         </pre>
       )}
@@ -187,7 +187,7 @@ function FilePreview({ file, labels }: { file: SkillFileContent; labels: SkillDe
 
 function MarkdownPreview({ content }: { content: string }) {
   return (
-    <div className="prose prose-sm max-w-none text-black prose-a:text-black prose-blockquote:text-black prose-code:rounded prose-code:bg-muted prose-code:px-1 prose-code:py-0.5 prose-code:text-black prose-headings:text-black prose-headings:tracking-normal prose-li:text-black prose-p:text-black prose-pre:border prose-pre:border-border prose-pre:bg-muted prose-pre:text-black prose-strong:text-black prose-table:text-black prose-td:text-black prose-th:text-black [&>*:first-child]:mt-0 [&>*:last-child]:mb-0">
+    <div className="prose prose-sm max-w-none break-words text-black prose-a:text-black prose-blockquote:text-black prose-code:break-words prose-code:rounded prose-code:bg-muted prose-code:px-1 prose-code:py-0.5 prose-code:text-black prose-headings:text-black prose-headings:tracking-normal prose-li:text-black prose-p:text-black prose-pre:whitespace-pre-wrap prose-pre:break-words prose-pre:border prose-pre:border-border prose-pre:bg-muted prose-pre:text-black prose-strong:text-black prose-table:block prose-table:overflow-x-auto prose-table:text-black prose-td:text-black prose-th:text-black [&>*:first-child]:mt-0 [&>*:last-child]:mb-0">
       <ReactMarkdown remarkPlugins={[remarkGfm]}>{content}</ReactMarkdown>
     </div>
   );
diff --git a/app-instance/frontend/components/task-detail/TaskAcceptanceCard.tsx b/app-instance/frontend/components/task-detail/TaskAcceptanceCard.tsx
index 38b0247..e5a6da0 100644
--- a/app-instance/frontend/components/task-detail/TaskAcceptanceCard.tsx
+++ b/app-instance/frontend/components/task-detail/TaskAcceptanceCard.tsx
@@ -7,6 +7,7 @@ import { TaskRuntimeStatusBadge, formatTaskRuntimeTime } from '@/components/task
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
+import { Label } from '@/components/ui/label';
 import { Textarea } from '@/components/ui/textarea';
 import { pickAppText } from '@/lib/i18n/core';
 import { useAppI18n } from '@/lib/i18n/provider';
@@ -96,7 +97,7 @@ function FeedbackButton({
   const isBusy = actionBusy === type || Boolean(actionBusy?.endsWith(type));
 
   return (
-    <Button type="button" variant="outline" className="w-full justify-center" disabled={disabled || Boolean(actionBusy)} onClick={onClick}>
+    <Button type="button" variant="outline" className="h-11 w-full justify-center" disabled={disabled || Boolean(actionBusy)} onClick={onClick}>
       {isBusy ? <Loader2 className="mr-2 h-4 w-4 animate-spin" /> : icon}
       {label}
     </Button>
@@ -156,6 +157,7 @@ export function TaskAcceptanceControls({
   onSubmit,
 }: Props) {
   const { locale } = useAppI18n();
+  const commentId = React.useId();
   const [localComment, setLocalComment] = React.useState('');
   const comment = revision ?? localComment;
   const setComment = onRevisionChange ?? setLocalComment;
@@ -224,12 +226,16 @@ export function TaskAcceptanceControls({
           />
         </div>
 
-        <Textarea
-          value={comment}
-          onChange={(event) => setComment(event.target.value)}
-          disabled={Boolean(recordedFeedback) || isFinalized || !isReadyForAcceptance || Boolean(actionBusy)}
-          placeholder={pickAppText(locale, '需要修改时写下具体要求；接受或放弃可选填说明。', 'Describe requested changes; notes are optional for accept or abandon.')}
-        />
+        <div className="space-y-2">
+          <Label htmlFor={commentId}>{pickAppText(locale, '验收说明', 'Acceptance note')}</Label>
+          <Textarea
+            id={commentId}
+            value={comment}
+            onChange={(event) => setComment(event.target.value)}
+            disabled={Boolean(recordedFeedback) || isFinalized || !isReadyForAcceptance || Boolean(actionBusy)}
+            placeholder={pickAppText(locale, '需要修改时写下具体要求；接受或放弃可选填说明。', 'Describe requested changes; notes are optional for accept or abandon.')}
+          />
+        </div>
         <div className={`text-xs text-muted-foreground ${containedPreservedLongTextClass}`}>
           {pickAppText(locale, '验收将记录到当前任务运行：', 'Acceptance will be recorded on run: ')}
           <span className="font-mono">{runId || '-'}</span>
diff --git a/app-instance/frontend/components/task-detail/TaskLiveHeader.tsx b/app-instance/frontend/components/task-detail/TaskLiveHeader.tsx
index ef9b743..650f5fa 100644
--- a/app-instance/frontend/components/task-detail/TaskLiveHeader.tsx
+++ b/app-instance/frontend/components/task-detail/TaskLiveHeader.tsx
@@ -43,17 +43,17 @@ export function TaskLiveHeader({ task, activeLabel, durationMs, reviewTargetId }
   const showReviewLink = Boolean(reviewTargetId && ['awaiting_acceptance', 'needs_revision'].includes(task.status));
 
   return (
-    <header className="sticky top-0 z-20 border-b border-border bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/80">
+    <header className="sticky top-[65px] z-20 min-w-0 border-b border-border bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/80">
       <div className="mx-auto flex max-w-7xl flex-col gap-3 px-4 py-3 sm:px-6">
         <div className="flex flex-wrap items-center justify-between gap-2">
           <div className="flex flex-wrap items-center gap-2">
-            <Button asChild variant="outline" size="sm">
+            <Button asChild variant="outline" size="sm" className="h-11">
               <Link href="/tasks">
                 <ArrowLeft className="mr-2 h-4 w-4" />
                 {pickAppText(locale, '返回任务', 'Back to tasks')}
               </Link>
             </Button>
-            <Button asChild variant="ghost" size="sm">
+            <Button asChild variant="ghost" size="sm" className="h-11">
               <Link href="/">
                 <MessageSquare className="mr-2 h-4 w-4" />
                 {pickAppText(locale, '对话', 'Chat')}
@@ -70,7 +70,7 @@ export function TaskLiveHeader({ task, activeLabel, durationMs, reviewTargetId }
             )}
             {activeLabel ? <Badge variant="secondary">{activeLabel}</Badge> : null}
             {showReviewLink ? (
-              <Button asChild variant="default" size="sm">
+              <Button asChild variant="default" size="sm" className="h-11">
                 <a href={`#${reviewTargetId}`}>
                   <CheckCircle2 className="mr-2 h-4 w-4" />
                   {pickAppText(locale, '验收', 'Review')}
diff --git a/app-instance/frontend/components/task-detail/TaskSideRail.tsx b/app-instance/frontend/components/task-detail/TaskSideRail.tsx
index 5e393bd..88dba94 100644
--- a/app-instance/frontend/components/task-detail/TaskSideRail.tsx
+++ b/app-instance/frontend/components/task-detail/TaskSideRail.tsx
@@ -131,7 +131,7 @@ export function TaskSideRail({ task, runs, artifacts, cards }: Props) {
   const latestAlert = cards.filter(isWarningOrError).sort((a, b) => toTime(b.createdAt) - toTime(a.createdAt))[0] ?? null;
 
   return (
-    <aside className="space-y-4">
+    <aside className="min-w-0 space-y-4">
       <Card className="rounded-md">
         <CardHeader>
           <CardTitle className="text-base">{pickAppText(locale, '任务状态', 'Task status')}</CardTitle>
@@ -230,14 +230,14 @@ export function TaskSideRail({ task, runs, artifacts, cards }: Props) {
                     <div className="mt-1 text-xs text-muted-foreground">{artifact.artifact_type}</div>
                   </div>
                   {href ? (
-                    <Button asChild size="sm" variant="outline" className="shrink-0">
+                    <Button asChild size="sm" variant="outline" className="h-11 shrink-0">
                       <a href={href} target="_blank" rel="noopener noreferrer">
                         {artifact.url ? <ExternalLink className="mr-2 h-3.5 w-3.5" /> : <Download className="mr-2 h-3.5 w-3.5" />}
                         {artifact.url ? pickAppText(locale, '打开', 'Open') : pickAppText(locale, '下载', 'Download')}
                       </a>
                     </Button>
                   ) : inlinePayload ? (
-                    <Button size="sm" variant="outline" className="shrink-0" onClick={() => downloadInlineArtifact(artifact)}>
+                    <Button size="sm" variant="outline" className="h-11 shrink-0" onClick={() => downloadInlineArtifact(artifact)}>
                       <Download className="mr-2 h-3.5 w-3.5" />
                       {pickAppText(locale, '下载', 'Download')}
                     </Button>
diff --git a/app-instance/frontend/components/task-detail/TaskTimeline.tsx b/app-instance/frontend/components/task-detail/TaskTimeline.tsx
index dfa8f58..914f241 100644
--- a/app-instance/frontend/components/task-detail/TaskTimeline.tsx
+++ b/app-instance/frontend/components/task-detail/TaskTimeline.tsx
@@ -14,26 +14,29 @@ type Props = {
   isLive: boolean;
   resultAcceptance?: TaskResultAcceptance;
   reviewTargetId?: string;
+  showHeader?: boolean;
 };
 
-export function TaskTimeline({ cards, isLive, resultAcceptance, reviewTargetId }: Props) {
+export function TaskTimeline({ cards, isLive, resultAcceptance, reviewTargetId, showHeader = true }: Props) {
   const { locale } = useAppI18n();
 
   return (
     <section className="space-y-3">
-      <div className="flex items-center justify-between gap-3">
-        <h2 className="text-base font-semibold">{pickAppText(locale, '时间线', 'Timeline')}</h2>
-        {isLive ? (
-          <div className="flex items-center gap-2 text-xs font-medium text-muted-foreground">
-            <span className="relative flex h-2 w-2">
-              <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-primary opacity-75" />
-              <span className="relative inline-flex h-2 w-2 rounded-full bg-primary" />
-            </span>
-            <Activity className="h-3.5 w-3.5" />
-            {pickAppText(locale, '实时更新', 'Live')}
-          </div>
-        ) : null}
-      </div>
+      {showHeader ? (
+        <div className="flex items-center justify-between gap-3">
+          <h2 className="text-base font-semibold">{pickAppText(locale, '时间线', 'Timeline')}</h2>
+          {isLive ? (
+            <div className="flex items-center gap-2 text-xs font-medium text-muted-foreground">
+              <span className="relative flex h-2 w-2">
+                <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-primary opacity-75" />
+                <span className="relative inline-flex h-2 w-2 rounded-full bg-primary" />
+              </span>
+              <Activity className="h-3.5 w-3.5" />
+              {pickAppText(locale, '实时更新', 'Live')}
+            </div>
+          ) : null}
+        </div>
+      ) : null}
 
       {cards.length === 0 ? (
         <Card className="rounded-md border-dashed">
diff --git a/app-instance/frontend/components/task-detail/TaskTimelineCard.tsx b/app-instance/frontend/components/task-detail/TaskTimelineCard.tsx
index 4d5c854..eba8297 100644
--- a/app-instance/frontend/components/task-detail/TaskTimelineCard.tsx
+++ b/app-instance/frontend/components/task-detail/TaskTimelineCard.tsx
@@ -148,7 +148,7 @@ function TaskResultHistory({ card }: { card: TaskTimelineCardView }) {
 
   return (
     <details className="mt-3 min-w-0 max-w-full overflow-hidden rounded-md border border-border bg-muted/20 px-3 py-2 text-sm">
-      <summary className="flex cursor-pointer select-none items-center justify-between gap-3 font-medium">
+      <summary className="flex min-h-[44px] cursor-pointer select-none items-center justify-between gap-3 font-medium">
         <span>{pickAppText(locale, '展开历史版本', 'Show previous versions')}</span>
         <ChevronDown className="h-4 w-4 text-muted-foreground" />
       </summary>
@@ -182,7 +182,7 @@ export function TaskTimelineCard({ card, resultAcceptance, reviewTargetId }: Pro
   const shouldRenderResultAcceptance = Boolean(card.type === 'result' && resultAcceptance && card.runId === resultAcceptance.runId);
 
   return (
-    <Card id={shouldRenderResultAcceptance ? reviewTargetId : undefined} className="scroll-mt-28 overflow-hidden rounded-md">
+    <Card id={shouldRenderResultAcceptance ? reviewTargetId : undefined} className="min-w-0 max-w-full scroll-mt-44 overflow-hidden rounded-md">
       <CardContent className="p-4">
         <div className="flex gap-3">
           <div className="flex h-9 w-9 shrink-0 items-center justify-center rounded-md bg-muted">
@@ -224,7 +224,7 @@ export function TaskTimelineCard({ card, resultAcceptance, reviewTargetId }: Pro
 
             {card.type === 'result_history' ? <TaskResultHistory card={card} /> : card.details ? (
               <details className="mt-3 min-w-0 max-w-full overflow-hidden rounded-md border border-border bg-muted/20 px-3 py-2 text-xs">
-                <summary className="cursor-pointer select-none font-medium text-muted-foreground">
+                <summary className="flex min-h-[44px] cursor-pointer select-none items-center font-medium text-muted-foreground">
                   {pickAppText(locale, '详情 JSON', 'Details JSON')}
                 </summary>
                 <pre className={`mt-2 max-h-72 overflow-auto text-[11px] leading-5 text-muted-foreground ${containedJsonTextClass}`}>
diff --git a/app-instance/frontend/components/task-management/TaskManagementTabs.tsx b/app-instance/frontend/components/task-management/TaskManagementTabs.tsx
index fea28e5..01735ba 100644
--- a/app-instance/frontend/components/task-management/TaskManagementTabs.tsx
+++ b/app-instance/frontend/components/task-management/TaskManagementTabs.tsx
@@ -41,7 +41,7 @@ export function TaskManagementTabs() {
               key={tab.href}
               href={tab.href}
               className={cn(
-                'inline-flex items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium transition-colors',
+                'inline-flex h-11 items-center gap-2 rounded-xl px-4 py-2 text-sm font-medium transition-colors',
                 isActive
                   ? 'bg-background text-foreground shadow-sm'
                   : 'text-muted-foreground hover:bg-background/70 hover:text-foreground'
diff --git a/app-instance/frontend/components/ui/button.tsx b/app-instance/frontend/components/ui/button.tsx
index e04e46a..e7dba89 100644
--- a/app-instance/frontend/components/ui/button.tsx
+++ b/app-instance/frontend/components/ui/button.tsx
@@ -20,10 +20,10 @@ const buttonVariants = cva(
         link: 'text-primary underline-offset-4 hover:underline',
       },
       size: {
-        default: 'h-10 px-4 py-2',
-        sm: 'h-9 rounded-md px-3',
+        default: 'h-11 px-4 py-2',
+        sm: 'h-11 rounded-md px-3',
         lg: 'h-11 rounded-md px-8',
-        icon: 'h-10 w-10',
+        icon: 'h-11 w-11',
       },
     },
     defaultVariants: {
diff --git a/app-instance/frontend/components/ui/dialog.tsx b/app-instance/frontend/components/ui/dialog.tsx
index b552952..062c1eb 100644
--- a/app-instance/frontend/components/ui/dialog.tsx
+++ b/app-instance/frontend/components/ui/dialog.tsx
@@ -38,13 +38,13 @@ const DialogContent = React.forwardRef<
     <DialogPrimitive.Content
       ref={ref}
       className={cn(
-        'fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg',
+        'fixed left-4 right-4 top-4 z-50 grid max-h-[calc(100vh-2rem)] w-auto max-w-none gap-4 overflow-x-hidden overflow-y-auto rounded-lg border bg-background p-5 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 sm:left-[50%] sm:right-auto sm:top-[50%] sm:w-full sm:max-w-lg sm:translate-x-[-50%] sm:translate-y-[-50%] sm:p-6 sm:data-[state=closed]:zoom-out-95 sm:data-[state=open]:zoom-in-95 sm:data-[state=closed]:slide-out-to-left-1/2 sm:data-[state=closed]:slide-out-to-top-[48%] sm:data-[state=open]:slide-in-from-left-1/2 sm:data-[state=open]:slide-in-from-top-[48%] [&>*]:min-w-0',
         className
       )}
       {...props}
     >
       {children}
-      <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
+      <DialogPrimitive.Close className="absolute right-3 top-3 flex h-11 w-11 items-center justify-center rounded-full opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
         <X className="h-4 w-4" />
         <span className="sr-only">Close</span>
       </DialogPrimitive.Close>
diff --git a/app-instance/frontend/components/ui/input.tsx b/app-instance/frontend/components/ui/input.tsx
index 66d607e..da8d0d4 100644
--- a/app-instance/frontend/components/ui/input.tsx
+++ b/app-instance/frontend/components/ui/input.tsx
@@ -11,7 +11,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
       <input
         type={type}
         className={cn(
-          'flex h-10 w-full rounded-lg border border-transparent bg-input px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring/10 disabled:cursor-not-allowed disabled:opacity-50',
+          'flex h-11 w-full rounded-lg border border-transparent bg-input px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:outline-none focus-visible:ring-4 focus-visible:ring-ring/10 disabled:cursor-not-allowed disabled:opacity-50',
           className
         )}
         ref={ref}
diff --git a/app-instance/frontend/components/ui/select.tsx b/app-instance/frontend/components/ui/select.tsx
index 9f3ef21..31f144f 100644
--- a/app-instance/frontend/components/ui/select.tsx
+++ b/app-instance/frontend/components/ui/select.tsx
@@ -19,7 +19,7 @@ const SelectTrigger = React.forwardRef<
   <SelectPrimitive.Trigger
     ref={ref}
     className={cn(
-      'flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
+      'flex h-11 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
       className
     )}
     {...props}
diff --git a/app-instance/frontend/components/ui/switch.tsx b/app-instance/frontend/components/ui/switch.tsx
index fcdbe8b..897534d 100644
--- a/app-instance/frontend/components/ui/switch.tsx
+++ b/app-instance/frontend/components/ui/switch.tsx
@@ -11,7 +11,7 @@ const Switch = React.forwardRef<
 >(({ className, ...props }, ref) => (
   <SwitchPrimitives.Root
     className={cn(
-      'peer inline-flex h-6 w-11 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
+      'peer inline-flex h-11 w-14 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent px-1 transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input',
       className
     )}
     {...props}
@@ -19,7 +19,7 @@ const Switch = React.forwardRef<
   >
     <SwitchPrimitives.Thumb
       className={cn(
-        'pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0'
+        'pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-7 data-[state=unchecked]:translate-x-0'
       )}
     />
   </SwitchPrimitives.Root>
diff --git a/app-instance/frontend/components/ui/tabs.tsx b/app-instance/frontend/components/ui/tabs.tsx
index 7315537..26b7f35 100644
--- a/app-instance/frontend/components/ui/tabs.tsx
+++ b/app-instance/frontend/components/ui/tabs.tsx
@@ -14,7 +14,7 @@ const TabsList = React.forwardRef<
   <TabsPrimitive.List
     ref={ref}
     className={cn(
-      'inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground',
+      'inline-flex min-h-11 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground',
       className
     )}
     {...props}
@@ -29,7 +29,7 @@ const TabsTrigger = React.forwardRef<
   <TabsPrimitive.Trigger
     ref={ref}
     className={cn(
-      'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm',
+      'inline-flex h-11 min-h-11 items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm',
       className
     )}
     {...props}
diff --git a/app-instance/frontend/lib/api.ts b/app-instance/frontend/lib/api.ts
index a85e020..a047a69 100644
--- a/app-instance/frontend/lib/api.ts
+++ b/app-instance/frontend/lib/api.ts
@@ -8,6 +8,7 @@ import type {
   ChatLogsResponse,
   BackendTask,
   ChatMessage,
+  ChannelConnectionView,
   ChannelConfigDetail,
   ChannelConfigPayload,
   ChannelConnectorDescriptor,
@@ -666,6 +667,10 @@ export async function listChannelConnectors(): Promise<ChannelConnectorDescripto
   return fetchJSON('/api/channel-connectors');
 }
 
+export async function listChannelConnections(): Promise<ChannelConnectionView[]> {
+  return fetchJSON('/api/channel-connections');
+}
+
 export async function startChannelConnectorSession(
   payload: ConnectorSessionStartPayload
 ): Promise<ConnectorSessionResponse> {
diff --git a/app-instance/frontend/lib/channel-connector-state.test.ts b/app-instance/frontend/lib/channel-connector-state.test.ts
new file mode 100644
index 0000000..2534811
--- /dev/null
+++ b/app-instance/frontend/lib/channel-connector-state.test.ts
@@ -0,0 +1,60 @@
+import { describe, expect, it } from 'vitest';
+
+import { connectorChannelForKind, runtimeBridgeEnabledForPath, visibleConnectorCards } from '@/lib/channel-connector-state';
+import type { ChannelConnectorDescriptor, ChannelStatus } from '@/types';
+
+
+function channel(overrides: Partial<ChannelStatus>): ChannelStatus {
+  return {
+    channel_id: 'weixin-main',
+    kind: 'weixin',
+    mode: 'polling',
+    account_id: 'wx-main',
+    display_name: 'Weixin Main',
+    enabled: false,
+    state: 'disabled',
+    capabilities: [],
+    connected_peers: 0,
+    ...overrides,
+  };
+}
+
+
+describe('connector channel cards', () => {
+  it('does not let a disabled static channel block connector onboarding', () => {
+    expect(connectorChannelForKind('weixin', [channel({})])).toBeUndefined();
+  });
+
+  it('selects a running connector channel', () => {
+    const running = channel({ enabled: true, state: 'running' });
+
+    expect(connectorChannelForKind('weixin', [running])).toEqual(running);
+  });
+
+  it('selects a running terminal channel', () => {
+    const running = channel({
+      channel_id: 'terminal-dev',
+      kind: 'terminal',
+      mode: 'websocket',
+      display_name: 'Terminal Dev',
+      enabled: true,
+      state: 'running',
+      connected_peers: 1,
+    });
+
+    expect(connectorChannelForKind('terminal', [running])).toEqual(running);
+  });
+
+  it('always includes terminal as a local connector card fallback', () => {
+    const connectors: ChannelConnectorDescriptor[] = [{ kind: 'weixin', authType: 'qr' }, { kind: 'feishu', authType: 'plugin' }];
+
+    expect(visibleConnectorCards(connectors).map((connector) => connector.kind)).toEqual(['weixin', 'feishu', 'terminal']);
+  });
+});
+
+
+describe('app runtime bridge', () => {
+  it('stays enabled on settings pages so the global connection status is accurate', () => {
+    expect(runtimeBridgeEnabledForPath('/settings')).toBe(true);
+  });
+});
diff --git a/app-instance/frontend/lib/channel-connector-state.ts b/app-instance/frontend/lib/channel-connector-state.ts
new file mode 100644
index 0000000..7e47777
--- /dev/null
+++ b/app-instance/frontend/lib/channel-connector-state.ts
@@ -0,0 +1,28 @@
+import type { ChannelConnectorDescriptor, ChannelStatus } from '@/types';
+
+
+const CONNECTOR_CARD_KINDS = ['weixin', 'feishu', 'terminal'];
+
+export function connectorChannelForKind(kind: string, channels: ChannelStatus[]): ChannelStatus | undefined {
+  const matches = channels.filter((channel) => channel.kind === kind);
+  return (
+    matches.find((channel) => channel.state === 'running') ||
+    matches.find((channel) => channel.enabled && channel.state !== 'disabled' && channel.state !== 'stopped')
+  );
+}
+
+
+export function visibleConnectorCards(connectors: ChannelConnectorDescriptor[]): ChannelConnectorDescriptor[] {
+  const byKind = new Map<string, ChannelConnectorDescriptor>();
+  connectors.forEach((connector) => {
+    if (CONNECTOR_CARD_KINDS.includes(connector.kind) && !byKind.has(connector.kind)) {
+      byKind.set(connector.kind, connector);
+    }
+  });
+  return CONNECTOR_CARD_KINDS.map((kind) => byKind.get(kind) || { kind });
+}
+
+
+export function runtimeBridgeEnabledForPath(_pathname: string): boolean {
+  return true;
+}
diff --git a/app-instance/frontend/lib/channel-connectors.test.ts b/app-instance/frontend/lib/channel-connectors.test.ts
index f001043..a2cef18 100644
--- a/app-instance/frontend/lib/channel-connectors.test.ts
+++ b/app-instance/frontend/lib/channel-connectors.test.ts
@@ -1,6 +1,7 @@
 import { afterEach, describe, expect, it, vi } from 'vitest';
 
 import {
+  listChannelConnections,
   getChannelConnectorSession,
   listChannelConnectors,
   startChannelConnectorSession,
@@ -38,6 +39,18 @@ describe('channel connector api', () => {
     expect(String(firstFetchCall(fetchMock)[0])).toMatch(/\/api\/channel-connectors$/);
   });
 
+  it('lists existing channel connections', async () => {
+    const fetchMock = vi.fn(() =>
+      mockJsonResponse([{ connection_id: 'conn_1', channel_id: 'weixin-1', kind: 'weixin', status: 'connected' }])
+    );
+    globalThis.fetch = fetchMock as typeof fetch;
+
+    const connections = await listChannelConnections();
+
+    expect(connections[0].status).toBe('connected');
+    expect(String(firstFetchCall(fetchMock)[0])).toMatch(/\/api\/channel-connections$/);
+  });
+
   it('starts a connector session with options', async () => {
     const fetchMock = vi.fn(() =>
       mockJsonResponse({
diff --git a/app-instance/frontend/lib/session-progress.test.ts b/app-instance/frontend/lib/session-progress.test.ts
deleted file mode 100644
index 89534af..0000000
--- a/app-instance/frontend/lib/session-progress.test.ts
+++ /dev/null
@@ -1,201 +0,0 @@
-import { describe, expect, it } from 'vitest';
-
-import { buildSessionProgressView } from '@/lib/session-progress';
-import type { ProcessArtifact, ProcessEvent, ProcessRun } from '@/types';
-
-describe('session progress view builder', () => {
-  it('selects the latest active root run for the current session and builds its run tree', () => {
-    const processRuns: ProcessRun[] = [
-      {
-        run_id: 'old-root',
-        parent_run_id: null,
-        session_id: 'web:current',
-        actor_type: 'agent',
-        actor_id: 'main',
-        actor_name: 'Main Agent',
-        title: '旧任务',
-        status: 'done',
-        started_at: '2026-05-22T08:00:00.000Z',
-        finished_at: '2026-05-22T08:05:00.000Z',
-      },
-      {
-        run_id: 'latest-root',
-        parent_run_id: null,
-        session_id: 'web:current',
-        actor_type: 'agent',
-        actor_id: 'main',
-        actor_name: 'Main Agent',
-        title: '销售数据分析报告生成',
-        status: 'running',
-        started_at: '2026-05-22T09:00:00.000Z',
-        metadata: {
-          step_index: 3,
-          step_total: 5,
-        },
-      },
-      {
-        run_id: 'collect-data',
-        parent_run_id: 'latest-root',
-        session_id: 'web:current',
-        actor_type: 'agent',
-        actor_id: 'collector',
-        actor_name: 'Data Agent',
-        title: '收集销售数据',
-        status: 'done',
-        started_at: '2026-05-22T09:01:00.000Z',
-        finished_at: '2026-05-22T09:03:00.000Z',
-        summary: '已获取 Q1 销售数据',
-      },
-      {
-        run_id: 'clean-data',
-        parent_run_id: 'latest-root',
-        session_id: 'web:current',
-        actor_type: 'agent',
-        actor_id: 'cleaner',
-        actor_name: 'Cleaning Agent',
-        title: '数据清洗与预处理',
-        status: 'running',
-        started_at: '2026-05-22T09:04:00.000Z',
-      },
-      {
-        run_id: 'other-root',
-        parent_run_id: null,
-        session_id: 'web:other',
-        actor_type: 'agent',
-        actor_id: 'main',
-        actor_name: 'Main Agent',
-        title: '其他会话任务',
-        status: 'running',
-        started_at: '2026-05-22T10:00:00.000Z',
-      },
-    ];
-
-    const processEvents: ProcessEvent[] = [
-      {
-        event_id: 'evt-clean',
-        run_id: 'clean-data',
-        parent_run_id: 'latest-root',
-        kind: 'run_progress',
-        actor_type: 'agent',
-        actor_id: 'cleaner',
-        actor_name: 'Cleaning Agent',
-        text: '清洗缺失值、异常值，统一格式',
-        created_at: '2026-05-22T09:05:00.000Z',
-      },
-    ];
-
-    const processArtifacts: ProcessArtifact[] = [
-      {
-        artifact_id: 'artifact-json',
-        run_id: 'collect-data',
-        actor_type: 'agent',
-        actor_id: 'collector',
-        actor_name: 'Data Agent',
-        title: '销售数据',
-        artifact_type: 'json',
-        data: { rows: 120 },
-        created_at: '2026-05-22T09:03:30.000Z',
-      },
-      {
-        artifact_id: 'artifact-markdown',
-        run_id: 'clean-data',
-        actor_type: 'agent',
-        actor_id: 'cleaner',
-        actor_name: 'Cleaning Agent',
-        title: '清洗说明',
-        artifact_type: 'markdown',
-        content: '已完成数据标准化。',
-        created_at: '2026-05-22T09:05:30.000Z',
-      },
-      {
-        artifact_id: 'artifact-other-session',
-        run_id: 'other-root',
-        actor_type: 'agent',
-        actor_id: 'main',
-        title: '其他会话产物',
-        artifact_type: 'text',
-        content: '不应出现',
-        created_at: '2026-05-22T10:01:00.000Z',
-      },
-    ];
-
-    const view = buildSessionProgressView({
-      sessionId: 'web:current',
-      processRuns,
-      processEvents,
-      processArtifacts,
-      locale: 'zh-CN',
-    });
-
-    expect(view).not.toBeNull();
-    expect(view?.rootRunId).toBe('latest-root');
-    expect(view?.title).toBe('销售数据分析报告生成');
-    expect(view?.progress).toMatchObject({
-      value: 3,
-      max: 5,
-      percent: 60,
-      label: '运行中：3 / 5 步',
-    });
-    expect(view?.steps.map((step) => step.runId)).toEqual(['collect-data', 'clean-data', 'latest-root']);
-    expect(view?.steps.find((step) => step.runId === 'clean-data')?.description).toBe('清洗缺失值、异常值，统一格式');
-    expect(view?.artifactTypeSummaries).toEqual([
-      { type: 'json', count: 1, label: 'JSON' },
-      { type: 'markdown', count: 1, label: 'Markdown' },
-    ]);
-    expect(view?.artifacts.map((artifact) => artifact.artifactId)).toEqual(['artifact-markdown', 'artifact-json']);
-  });
-
-  it('falls back to completed child run counts when no explicit progress metadata exists', () => {
-    const processRuns: ProcessRun[] = [
-      {
-        run_id: 'root',
-        parent_run_id: null,
-        session_id: 'web:current',
-        actor_type: 'agent',
-        actor_id: 'main',
-        actor_name: 'Main Agent',
-        title: '生成总结',
-        status: 'running',
-        started_at: '2026-05-22T09:00:00.000Z',
-      },
-      {
-        run_id: 'done-child',
-        parent_run_id: 'root',
-        session_id: 'web:current',
-        actor_type: 'agent',
-        actor_id: 'writer',
-        actor_name: 'Writer',
-        title: '整理结果',
-        status: 'done',
-        started_at: '2026-05-22T09:01:00.000Z',
-        finished_at: '2026-05-22T09:02:00.000Z',
-      },
-      {
-        run_id: 'running-child',
-        parent_run_id: 'root',
-        session_id: 'web:current',
-        actor_type: 'agent',
-        actor_id: 'reviewer',
-        actor_name: 'Reviewer',
-        title: '复核结果',
-        status: 'running',
-        started_at: '2026-05-22T09:03:00.000Z',
-      },
-    ];
-
-    const view = buildSessionProgressView({
-      sessionId: 'web:current',
-      processRuns,
-      processEvents: [],
-      processArtifacts: [],
-      locale: 'zh-CN',
-    });
-
-    expect(view?.progress).toMatchObject({
-      value: 1,
-      max: 2,
-      percent: 50,
-      label: '已完成 1 / 2 步',
-    });
-  });
-});
diff --git a/app-instance/frontend/lib/session-progress.ts b/app-instance/frontend/lib/session-progress.ts
deleted file mode 100644
index fdb3977..0000000
--- a/app-instance/frontend/lib/session-progress.ts
+++ /dev/null
@@ -1,392 +0,0 @@
-import type { ProcessArtifact, ProcessEvent, ProcessRun, ProcessRunStatus } from '@/types';
-import { getCurrentAppLocale, pickAppText, type AppLocale } from '@/lib/i18n/core';
-
-const TERMINAL_STATUSES = new Set<ProcessRunStatus>(['done', 'error', 'cancelled']);
-const ACTIVE_STATUSES = new Set<ProcessRunStatus>(['queued', 'running', 'waiting']);
-const ARTIFACT_TYPE_ORDER: ProcessArtifact['artifact_type'][] = [
-  'text',
-  'json',
-  'file',
-  'image',
-  'link',
-  'markdown',
-];
-
-export interface SessionProgressValueView {
-  label: string;
-  value: number | null;
-  max: number | null;
-  percent: number | null;
-}
-
-export interface SessionProgressStepView {
-  runId: string;
-  title: string;
-  actorName: string;
-  status: ProcessRunStatus;
-  description: string | null;
-  startedAt: string;
-  updatedAt: string;
-  finishedAt: string | null;
-  artifactCount: number;
-  isRoot: boolean;
-  isCurrent: boolean;
-}
-
-export interface SessionProgressArtifactView {
-  artifactId: string;
-  runId: string;
-  title: string;
-  type: ProcessArtifact['artifact_type'];
-  typeLabel: string;
-  actorName: string;
-  preview: string;
-  createdAt: string;
-  url?: string;
-}
-
-export interface SessionProgressArtifactTypeSummary {
-  type: ProcessArtifact['artifact_type'];
-  count: number;
-  label: string;
-}
-
-export interface SessionProgressView {
-  rootRunId: string;
-  title: string;
-  status: ProcessRunStatus;
-  summary: string | null;
-  updatedAt: string;
-  progress: SessionProgressValueView;
-  steps: SessionProgressStepView[];
-  artifacts: SessionProgressArtifactView[];
-  artifactTypeSummaries: SessionProgressArtifactTypeSummary[];
-}
-
-export type BuildSessionProgressInput = {
-  sessionId: string;
-  processRuns: ProcessRun[];
-  processEvents: ProcessEvent[];
-  processArtifacts: ProcessArtifact[];
-  locale?: AppLocale;
-};
-
-function toTime(value?: string | null): number | null {
-  if (!value) return null;
-  const parsed = new Date(value).getTime();
-  return Number.isFinite(parsed) ? parsed : null;
-}
-
-function latestTimestamp(values: Array<string | null | undefined>): string | null {
-  let selected: string | null = null;
-  let selectedTime = -1;
-  for (const value of values) {
-    const time = toTime(value);
-    if (time === null || time <= selectedTime) continue;
-    selected = value ?? null;
-    selectedTime = time;
-  }
-  return selected;
-}
-
-function compareIsoDesc(a?: string | null, b?: string | null): number {
-  return (toTime(b) ?? 0) - (toTime(a) ?? 0);
-}
-
-function firstNumber(metadata: Record<string, unknown> | undefined, keys: string[]): number | null {
-  for (const key of keys) {
-    const value = metadata?.[key];
-    if (typeof value === 'number' && Number.isFinite(value)) return value;
-  }
-  return null;
-}
-
-function buildChildrenMap(processRuns: ProcessRun[]): Map<string, ProcessRun[]> {
-  const map = new Map<string, ProcessRun[]>();
-  for (const run of processRuns) {
-    if (!run.parent_run_id) continue;
-    const children = map.get(run.parent_run_id);
-    if (children) {
-      children.push(run);
-    } else {
-      map.set(run.parent_run_id, [run]);
-    }
-  }
-  return map;
-}
-
-function collectRunTree(rootRun: ProcessRun, childrenMap: Map<string, ProcessRun[]>): ProcessRun[] {
-  const collected: ProcessRun[] = [];
-  const stack = [rootRun];
-  const seen = new Set<string>();
-
-  while (stack.length > 0) {
-    const current = stack.pop();
-    if (!current || seen.has(current.run_id)) continue;
-    seen.add(current.run_id);
-    collected.push(current);
-    const children = childrenMap.get(current.run_id) ?? [];
-    for (let index = children.length - 1; index >= 0; index -= 1) {
-      stack.push(children[index]);
-    }
-  }
-
-  return collected;
-}
-
-function groupByRunId<T extends { run_id: string }>(items: T[]): Map<string, T[]> {
-  const map = new Map<string, T[]>();
-  for (const item of items) {
-    const existing = map.get(item.run_id);
-    if (existing) {
-      existing.push(item);
-    } else {
-      map.set(item.run_id, [item]);
-    }
-  }
-  return map;
-}
-
-function getRunUpdatedAt(
-  run: ProcessRun,
-  eventsByRun: Map<string, ProcessEvent[]>,
-  artifactsByRun: Map<string, ProcessArtifact[]>,
-): string {
-  return (
-    latestTimestamp([
-      run.finished_at,
-      run.started_at,
-      ...(eventsByRun.get(run.run_id) ?? []).map((event) => event.created_at),
-      ...(artifactsByRun.get(run.run_id) ?? []).map((artifact) => artifact.created_at),
-    ]) ?? run.started_at
-  );
-}
-
-function getTreeUpdatedAt(
-  runs: ProcessRun[],
-  eventsByRun: Map<string, ProcessEvent[]>,
-  artifactsByRun: Map<string, ProcessArtifact[]>,
-): string {
-  return latestTimestamp(runs.map((run) => getRunUpdatedAt(run, eventsByRun, artifactsByRun))) ?? runs[0]?.started_at ?? '';
-}
-
-function latestEventText(events: ProcessEvent[]): string | null {
-  const event = [...events]
-    .filter((item) => item.text?.trim())
-    .sort((a, b) => compareIsoDesc(a.created_at, b.created_at))[0];
-  return event?.text?.trim() || null;
-}
-
-function percent(value: number, max: number): number {
-  return Math.max(0, Math.min(100, Math.round((value / max) * 100)));
-}
-
-function explicitProgress(
-  rootRun: ProcessRun,
-  treeEvents: ProcessEvent[],
-  locale: AppLocale,
-): SessionProgressValueView | null {
-  const metadataSources = [
-    rootRun.metadata,
-    ...[...treeEvents]
-      .sort((a, b) => compareIsoDesc(a.created_at, b.created_at))
-      .map((event) => event.metadata),
-  ];
-
-  for (const metadata of metadataSources) {
-    const stepValue = firstNumber(metadata, ['step_index']);
-    const stepMax = firstNumber(metadata, ['step_total']);
-    if (stepValue !== null && stepMax !== null && stepMax > 0) {
-      const safeValue = Math.min(stepValue, stepMax);
-      return {
-        label: pickAppText(locale, `运行中：${safeValue} / ${stepMax} 步`, `Running: ${safeValue} / ${stepMax} steps`),
-        value: safeValue,
-        max: stepMax,
-        percent: percent(safeValue, stepMax),
-      };
-    }
-
-    const stageValue = firstNumber(metadata, ['stage_index', 'phase_index']);
-    const stageMax = firstNumber(metadata, ['stage_total', 'phase_total']);
-    if (stageValue !== null && stageMax !== null && stageMax > 0) {
-      const safeValue = Math.min(stageValue, stageMax);
-      return {
-        label: pickAppText(locale, `运行中：${safeValue} / ${stageMax} 阶段`, `Running: ${safeValue} / ${stageMax} stages`),
-        value: safeValue,
-        max: stageMax,
-        percent: percent(safeValue, stageMax),
-      };
-    }
-  }
-
-  return null;
-}
-
-function fallbackProgress(taskRuns: ProcessRun[], locale: AppLocale): SessionProgressValueView {
-  const childRuns = taskRuns.filter((run) => run.parent_run_id);
-  const runsForProgress = childRuns.length > 0 ? childRuns : taskRuns;
-  const doneRuns = runsForProgress.filter((run) => run.status === 'done').length;
-  const totalRuns = runsForProgress.length;
-
-  if (totalRuns > 0) {
-    return {
-      label: pickAppText(locale, `已完成 ${doneRuns} / ${totalRuns} 步`, `Completed ${doneRuns} / ${totalRuns} steps`),
-      value: doneRuns,
-      max: totalRuns,
-      percent: percent(doneRuns, totalRuns),
-    };
-  }
-
-  return {
-    label: pickAppText(locale, '等待任务数据', 'Waiting for task data'),
-    value: null,
-    max: null,
-    percent: null,
-  };
-}
-
-function artifactTypeLabel(type: ProcessArtifact['artifact_type'], locale: AppLocale): string {
-  if (type === 'text') return pickAppText(locale, '文本', 'Text');
-  if (type === 'json') return 'JSON';
-  if (type === 'file') return pickAppText(locale, '文件', 'File');
-  if (type === 'image') return pickAppText(locale, '图片', 'Image');
-  if (type === 'link') return pickAppText(locale, '链接', 'Link');
-  return 'Markdown';
-}
-
-function artifactPreview(artifact: ProcessArtifact, locale: AppLocale): string {
-  if (artifact.content?.trim()) {
-    return artifact.content.trim().replace(/\s+/g, ' ').slice(0, 120);
-  }
-  if (artifact.url?.trim()) return artifact.url.trim();
-  if (artifact.data !== undefined) {
-    return JSON.stringify(artifact.data).slice(0, 120);
-  }
-  return pickAppText(locale, '暂无预览', 'No preview');
-}
-
-function buildArtifactSummaries(
-  artifacts: ProcessArtifact[],
-  locale: AppLocale,
-): SessionProgressArtifactTypeSummary[] {
-  const counts = new Map<ProcessArtifact['artifact_type'], number>();
-  for (const artifact of artifacts) {
-    counts.set(artifact.artifact_type, (counts.get(artifact.artifact_type) ?? 0) + 1);
-  }
-  return ARTIFACT_TYPE_ORDER
-    .filter((type) => counts.has(type))
-    .map((type) => ({
-      type,
-      count: counts.get(type) ?? 0,
-      label: artifactTypeLabel(type, locale),
-    }));
-}
-
-function buildArtifactViews(
-  artifacts: ProcessArtifact[],
-  locale: AppLocale,
-): SessionProgressArtifactView[] {
-  return [...artifacts]
-    .sort((a, b) => compareIsoDesc(a.created_at, b.created_at))
-    .map((artifact) => ({
-      artifactId: artifact.artifact_id,
-      runId: artifact.run_id,
-      title: artifact.title,
-      type: artifact.artifact_type,
-      typeLabel: artifactTypeLabel(artifact.artifact_type, locale),
-      actorName: artifact.actor_name || artifact.actor_id,
-      preview: artifactPreview(artifact, locale),
-      createdAt: artifact.created_at,
-      url: artifact.url,
-    }));
-}
-
-function buildSteps(
-  rootRun: ProcessRun,
-  taskRuns: ProcessRun[],
-  eventsByRun: Map<string, ProcessEvent[]>,
-  artifactsByRun: Map<string, ProcessArtifact[]>,
-): SessionProgressStepView[] {
-  return [...taskRuns]
-    .sort((a, b) => {
-      if (a.run_id === rootRun.run_id) return 1;
-      if (b.run_id === rootRun.run_id) return -1;
-      return (toTime(a.started_at) ?? 0) - (toTime(b.started_at) ?? 0);
-    })
-    .map((run) => {
-      const runEvents = eventsByRun.get(run.run_id) ?? [];
-      const runArtifacts = artifactsByRun.get(run.run_id) ?? [];
-      return {
-        runId: run.run_id,
-        title: run.title,
-        actorName: run.actor_name,
-        status: run.status,
-        description: latestEventText(runEvents) || run.summary?.trim() || null,
-        startedAt: run.started_at,
-        updatedAt: getRunUpdatedAt(run, eventsByRun, artifactsByRun),
-        finishedAt: run.finished_at ?? null,
-        artifactCount: runArtifacts.length,
-        isRoot: run.run_id === rootRun.run_id,
-        isCurrent: !TERMINAL_STATUSES.has(run.status),
-      };
-    });
-}
-
-export function buildSessionProgressView({
-  sessionId,
-  processRuns,
-  processEvents,
-  processArtifacts,
-  locale = getCurrentAppLocale(),
-}: BuildSessionProgressInput): SessionProgressView | null {
-  const sessionRuns = processRuns.filter((run) => run.session_id === sessionId);
-  const rootRuns = sessionRuns.filter((run) => !run.parent_run_id);
-  if (rootRuns.length === 0) return null;
-
-  const allChildrenMap = buildChildrenMap(processRuns);
-  const runTreeCache = new Map<string, ProcessRun[]>();
-  const treeForRoot = (root: ProcessRun) => {
-    const cached = runTreeCache.get(root.run_id);
-    if (cached) return cached;
-    const tree = collectRunTree(root, allChildrenMap).filter(
-      (run) => run.session_id === sessionId || run.run_id === root.run_id
-    );
-    runTreeCache.set(root.run_id, tree);
-    return tree;
-  };
-
-  const allEventsByRun = groupByRunId(processEvents);
-  const allArtifactsByRun = groupByRunId(processArtifacts);
-  const selectedRoot = [...rootRuns].sort((a, b) => {
-    const aActive = ACTIVE_STATUSES.has(a.status);
-    const bActive = ACTIVE_STATUSES.has(b.status);
-    if (aActive !== bActive) return aActive ? -1 : 1;
-    return compareIsoDesc(
-      getTreeUpdatedAt(treeForRoot(a), allEventsByRun, allArtifactsByRun),
-      getTreeUpdatedAt(treeForRoot(b), allEventsByRun, allArtifactsByRun)
-    );
-  })[0];
-
-  if (!selectedRoot) return null;
-
-  const taskRuns = treeForRoot(selectedRoot);
-  const taskRunIds = new Set(taskRuns.map((run) => run.run_id));
-  const taskEvents = processEvents.filter((event) => taskRunIds.has(event.run_id));
-  const taskArtifacts = processArtifacts.filter((artifact) => taskRunIds.has(artifact.run_id));
-  const eventsByRun = groupByRunId(taskEvents);
-  const artifactsByRun = groupByRunId(taskArtifacts);
-  const updatedAt = getTreeUpdatedAt(taskRuns, eventsByRun, artifactsByRun);
-  const progress = explicitProgress(selectedRoot, taskEvents, locale) ?? fallbackProgress(taskRuns, locale);
-
-  return {
-    rootRunId: selectedRoot.run_id,
-    title: selectedRoot.title,
-    status: selectedRoot.status,
-    summary: selectedRoot.summary?.trim() || latestEventText(eventsByRun.get(selectedRoot.run_id) ?? []) || null,
-    updatedAt,
-    progress,
-    steps: buildSteps(selectedRoot, taskRuns, eventsByRun, artifactsByRun),
-    artifacts: buildArtifactViews(taskArtifacts, locale),
-    artifactTypeSummaries: buildArtifactSummaries(taskArtifacts, locale),
-  };
-}
diff --git a/app-instance/frontend/lib/task-process.test.ts b/app-instance/frontend/lib/task-process.test.ts
new file mode 100644
index 0000000..bbfc355
--- /dev/null
+++ b/app-instance/frontend/lib/task-process.test.ts
@@ -0,0 +1,160 @@
+import { describe, expect, it } from 'vitest';
+
+import { selectTaskProcess } from '@/lib/task-process';
+import type { BackendTask, ProcessArtifact, ProcessEvent, ProcessRun } from '@/types';
+
+function task(): BackendTask {
+  return {
+    task_id: 'task-1',
+    session_id: 'web:default',
+    description: 'Build report',
+    goal: 'Build report',
+    constraints: [],
+    priority: 0,
+    status: 'running',
+    creator: 'user',
+    created_at: '2026-06-04T00:00:00.000Z',
+    updated_at: '2026-06-04T00:01:00.000Z',
+    run_ids: ['main-run'],
+    skill_names: [],
+    feedback: [],
+    metadata: {},
+    process_runs: [
+      {
+        run_id: 'main-run',
+        session_id: 'web:default',
+        actor_type: 'agent',
+        actor_id: 'main',
+        actor_name: 'Main Agent',
+        title: 'Persisted main run',
+        status: 'waiting',
+        started_at: '2026-06-04T00:00:10.000Z',
+        metadata: { task_id: 'task-1' },
+      },
+    ],
+    process_events: [
+      {
+        event_id: 'persisted-event',
+        run_id: 'main-run',
+        kind: 'task_planned',
+        actor_type: 'system',
+        actor_id: 'planner',
+        actor_name: 'Planner',
+        text: 'Persisted plan',
+        created_at: '2026-06-04T00:00:20.000Z',
+        metadata: { task_id: 'task-1' },
+      },
+    ],
+    process_artifacts: [],
+  };
+}
+
+describe('selectTaskProcess', () => {
+  it('merges persisted and live task process data while excluding other tasks', () => {
+    const liveRuns: ProcessRun[] = [
+      {
+        run_id: 'main-run',
+        session_id: 'web:default',
+        actor_type: 'agent',
+        actor_id: 'main',
+        actor_name: 'Main Agent',
+        title: 'Live main run',
+        status: 'running',
+        started_at: '2026-06-04T00:00:10.000Z',
+        metadata: { task_id: 'task-1' },
+      },
+      {
+        run_id: 'child-run',
+        parent_run_id: 'main-run',
+        session_id: 'subagent:child',
+        actor_type: 'agent',
+        actor_id: 'child',
+        actor_name: 'Child Agent',
+        title: 'Child work',
+        status: 'done',
+        started_at: '2026-06-04T00:00:30.000Z',
+      },
+      {
+        run_id: 'other-run',
+        session_id: 'web:default',
+        actor_type: 'agent',
+        actor_id: 'other',
+        actor_name: 'Other Agent',
+        title: 'Other task',
+        status: 'running',
+        started_at: '2026-06-04T00:00:40.000Z',
+        metadata: { task_id: 'task-2' },
+      },
+    ];
+    const liveEvents: ProcessEvent[] = [
+      {
+        event_id: 'child-event',
+        run_id: 'child-run',
+        parent_run_id: 'main-run',
+        kind: 'run_progress',
+        actor_type: 'agent',
+        actor_id: 'child',
+        actor_name: 'Child Agent',
+        text: 'Child finished',
+        created_at: '2026-06-04T00:00:50.000Z',
+      },
+      {
+        event_id: 'other-event',
+        run_id: 'other-run',
+        kind: 'run_progress',
+        actor_type: 'agent',
+        actor_id: 'other',
+        actor_name: 'Other Agent',
+        text: 'Other task progress',
+        created_at: '2026-06-04T00:00:55.000Z',
+        metadata: { task_id: 'task-2' },
+      },
+    ];
+    const liveArtifacts: ProcessArtifact[] = [
+      {
+        artifact_id: 'child-artifact',
+        run_id: 'child-run',
+        actor_type: 'agent',
+        actor_id: 'child',
+        actor_name: 'Child Agent',
+        title: 'Child result',
+        artifact_type: 'text',
+        created_at: '2026-06-04T00:01:00.000Z',
+      },
+      {
+        artifact_id: 'other-artifact',
+        run_id: 'other-run',
+        actor_type: 'agent',
+        actor_id: 'other',
+        title: 'Other result',
+        artifact_type: 'text',
+        created_at: '2026-06-04T00:01:05.000Z',
+      },
+    ];
+
+    const selected = selectTaskProcess({
+      task: task(),
+      liveRuns,
+      liveEvents,
+      liveArtifacts,
+    });
+
+    expect(selected.runs.map((run) => run.run_id)).toEqual(['main-run', 'child-run']);
+    expect(selected.runs[0].title).toBe('Live main run');
+    expect(selected.events.map((event) => event.event_id)).toEqual(['persisted-event', 'child-event']);
+    expect(selected.artifacts.map((artifact) => artifact.artifact_id)).toEqual(['child-artifact']);
+  });
+
+  it('returns persisted task process data when no live data is available', () => {
+    const selected = selectTaskProcess({
+      task: task(),
+      liveRuns: [],
+      liveEvents: [],
+      liveArtifacts: [],
+    });
+
+    expect(selected.runs.map((run) => run.run_id)).toEqual(['main-run']);
+    expect(selected.events.map((event) => event.event_id)).toEqual(['persisted-event']);
+    expect(selected.artifacts).toEqual([]);
+  });
+});
diff --git a/app-instance/frontend/lib/task-process.ts b/app-instance/frontend/lib/task-process.ts
new file mode 100644
index 0000000..7f685ab
--- /dev/null
+++ b/app-instance/frontend/lib/task-process.ts
@@ -0,0 +1,75 @@
+import type { BackendTask, ProcessArtifact, ProcessEvent, ProcessRun } from '@/types';
+
+export type TaskProcessSelection = {
+  runs: ProcessRun[];
+  events: ProcessEvent[];
+  artifacts: ProcessArtifact[];
+};
+
+export type SelectTaskProcessInput = {
+  task: BackendTask;
+  liveRuns?: ProcessRun[];
+  liveEvents?: ProcessEvent[];
+  liveArtifacts?: ProcessArtifact[];
+};
+
+function mergeById<T>(
+  persisted: T[],
+  live: T[],
+  idFor: (item: T) => string,
+): T[] {
+  const merged = new Map<string, T>();
+  for (const item of persisted) merged.set(idFor(item), item);
+  for (const item of live) merged.set(idFor(item), item);
+  return Array.from(merged.values());
+}
+
+function runBelongsToTask(run: ProcessRun, taskId: string, runIds: Set<string>): boolean {
+  return runIds.has(run.run_id) || run.metadata?.task_id === taskId;
+}
+
+function expandTaskRunIds(runs: ProcessRun[], taskId: string, seedRunIds: Set<string>): Set<string> {
+  const selected = new Set(seedRunIds);
+  for (const run of runs) {
+    if (run.metadata?.task_id === taskId) selected.add(run.run_id);
+  }
+
+  let changed = true;
+  while (changed) {
+    changed = false;
+    for (const run of runs) {
+      if (!run.parent_run_id || !selected.has(run.parent_run_id) || selected.has(run.run_id)) continue;
+      selected.add(run.run_id);
+      changed = true;
+    }
+  }
+  return selected;
+}
+
+export function selectTaskProcess({
+  task,
+  liveRuns = [],
+  liveEvents = [],
+  liveArtifacts = [],
+}: SelectTaskProcessInput): TaskProcessSelection {
+  const persistedRuns = task.process_runs ?? [];
+  const persistedEvents = task.process_events ?? [];
+  const persistedArtifacts = task.process_artifacts ?? [];
+  const allRuns = mergeById(persistedRuns, liveRuns, (run) => run.run_id);
+  const seedRunIds = new Set([
+    ...task.run_ids.filter(Boolean),
+    ...persistedRuns.map((run) => run.run_id),
+  ]);
+  const taskRunIds = expandTaskRunIds(allRuns, task.task_id, seedRunIds);
+  const runs = allRuns.filter((run) => runBelongsToTask(run, task.task_id, taskRunIds));
+
+  return {
+    runs,
+    events: mergeById(persistedEvents, liveEvents, (event) => event.event_id).filter(
+      (event) => taskRunIds.has(event.run_id) || event.metadata?.task_id === task.task_id
+    ),
+    artifacts: mergeById(persistedArtifacts, liveArtifacts, (artifact) => artifact.artifact_id).filter(
+      (artifact) => taskRunIds.has(artifact.run_id) || artifact.metadata?.task_id === task.task_id
+    ),
+  };
+}
diff --git a/app-instance/frontend/lib/task-timeline-view.test.ts b/app-instance/frontend/lib/task-timeline-view.test.ts
new file mode 100644
index 0000000..ef7a16c
--- /dev/null
+++ b/app-instance/frontend/lib/task-timeline-view.test.ts
@@ -0,0 +1,52 @@
+import { describe, expect, it } from 'vitest';
+
+import { buildTaskTimelineView } from '@/lib/task-timeline-view';
+import type { BackendTask, ProcessEvent } from '@/types';
+
+function task(): BackendTask {
+  return {
+    task_id: 'task-1',
+    session_id: 'web:default',
+    description: 'Build report',
+    goal: 'Build report',
+    constraints: [],
+    priority: 0,
+    status: 'running',
+    creator: 'user',
+    created_at: '2026-06-04T00:00:00.000Z',
+    updated_at: '2026-06-04T00:01:00.000Z',
+    run_ids: ['main-run'],
+    skill_names: [],
+    feedback: [],
+    metadata: {},
+  };
+}
+
+describe('buildTaskTimelineView', () => {
+  it('builds canonical task timeline cards from matching live process data', () => {
+    const liveEvents: ProcessEvent[] = [
+      {
+        event_id: 'plan',
+        run_id: 'main-run',
+        kind: 'task_planned',
+        actor_type: 'system',
+        actor_id: 'planner',
+        actor_name: 'Planner',
+        text: 'Plan created',
+        created_at: '2026-06-04T00:00:10.000Z',
+      },
+    ];
+
+    const view = buildTaskTimelineView({
+      task: task(),
+      liveEvents,
+    });
+
+    expect(view?.cards.map((card) => card.type)).toEqual(['task_created', 'plan']);
+    expect(view?.process.events.map((event) => event.event_id)).toEqual(['plan']);
+  });
+
+  it('returns null when there is no active task to display', () => {
+    expect(buildTaskTimelineView({ task: null })).toBeNull();
+  });
+});
diff --git a/app-instance/frontend/lib/task-timeline-view.ts b/app-instance/frontend/lib/task-timeline-view.ts
new file mode 100644
index 0000000..6125e3a
--- /dev/null
+++ b/app-instance/frontend/lib/task-timeline-view.ts
@@ -0,0 +1,37 @@
+import { selectTaskProcess, type SelectTaskProcessInput, type TaskProcessSelection } from '@/lib/task-process';
+import { buildTaskTimelineCards } from '@/lib/task-timeline';
+import type { BackendTask, TaskTimelineCard } from '@/types';
+
+export type BuildTaskTimelineViewInput = Omit<SelectTaskProcessInput, 'task'> & {
+  task: BackendTask | null;
+};
+
+export type TaskTimelineView = {
+  process: TaskProcessSelection;
+  cards: TaskTimelineCard[];
+};
+
+export function buildTaskTimelineView({
+  task,
+  liveRuns,
+  liveEvents,
+  liveArtifacts,
+}: BuildTaskTimelineViewInput): TaskTimelineView | null {
+  if (!task) return null;
+
+  const process = selectTaskProcess({
+    task,
+    liveRuns,
+    liveEvents,
+    liveArtifacts,
+  });
+  return {
+    process,
+    cards: buildTaskTimelineCards({
+      task,
+      processRuns: process.runs,
+      processEvents: process.events,
+      processArtifacts: process.artifacts,
+    }),
+  };
+}
diff --git a/app-instance/frontend/test-results/.last-run.json b/app-instance/frontend/test-results/.last-run.json
new file mode 100644
index 0000000..e2e7941
--- /dev/null
+++ b/app-instance/frontend/test-results/.last-run.json
@@ -0,0 +1,9 @@
+{
+  "status": "failed",
+  "failedTests": [
+    "f5227d990c583bf1cb5e-1c04b5ceddc2ff622275",
+    "f5227d990c583bf1cb5e-960e0b45f6e36c90c9ae",
+    "f5227d990c583bf1cb5e-205bf022968074780a04",
+    "f5227d990c583bf1cb5e-ebfd66136ede563d8670"
+  ]
+}
\ No newline at end of file
diff --git a/app-instance/frontend/test-results/market-settings-qa-marketp-0de76-ail-file-install-flow-works/error-context.md b/app-instance/frontend/test-results/market-settings-qa-marketp-0de76-ail-file-install-flow-works/error-context.md
new file mode 100644
index 0000000..461a146
--- /dev/null
+++ b/app-instance/frontend/test-results/market-settings-qa-marketp-0de76-ail-file-install-flow-works/error-context.md
@@ -0,0 +1,281 @@
+# Instructions
+
+- Following Playwright test failed.
+- Explain why, be concise, respect Playwright best practices.
+- Provide a snippet of code with the fix, if possible.
+
+# Test info
+
+- Name: market-settings-qa.spec.js >> marketplace and settings QA >> marketplace search detail file install flow works
+- Location: ../../../../../../tmp/beaver-market-settings-qa/market-settings-qa.spec.js:188:3
+
+# Error details
+
+```
+Error: expect(locator).toBeVisible() failed
+
+Locator: getByText(/src\/very-long-ui-token/)
+Expected: visible
+Error: strict mode violation: getByText(/src\/very-long-ui-token/) resolved to 3 elements:
+    1) <span class="min-w-0 break-all font-mono text-xs">src/very-long-ui-token-0123456789abcdefghijklmnop…</span> aka getByRole('button', { name: 'src/very-long-ui-token-' })
+    2) <div class="break-all font-mono text-sm font-medium">src/very-long-ui-token-0123456789abcdefghijklmnop…</div> aka getByText('src/very-long-ui-token-').nth(1)
+    3) <h1>src/very-long-ui-token-0123456789abcdefghijklmnop…</h1> aka getByRole('heading', { name: 'src/very-long-ui-token-' })
+
+Call log:
+  - Expect "toBeVisible" with timeout 8000ms
+  - waiting for getByText(/src\/very-long-ui-token/)
+
+```
+
+# Page snapshot
+
+```yaml
+- generic [ref=e1]:
+  - generic [ref=e2]:
+    - banner [ref=e3]:
+      - generic [ref=e5]:
+        - generic [ref=e6]:
+          - button "Open navigation" [ref=e7] [cursor=pointer]:
+            - img [ref=e8]
+          - link "Beaver" [ref=e9] [cursor=pointer]:
+            - /url: /
+            - generic [ref=e10]: Beaver
+        - generic [ref=e12]:
+          - generic [ref=e13]:
+            - img [ref=e14]
+            - button "ZH" [ref=e18] [cursor=pointer]
+            - button "EN" [ref=e19] [cursor=pointer]
+          - button "Open account menu" [ref=e20] [cursor=pointer]:
+            - generic [ref=e22]: U
+    - main [ref=e23]:
+      - generic [ref=e24]:
+        - generic [ref=e26]:
+          - generic [ref=e27]:
+            - img [ref=e28]
+            - textbox "Search skills..." [ref=e31]: qa
+          - button "Search" [ref=e32] [cursor=pointer]
+        - generic [ref=e33]:
+          - button "Back to search" [ref=e34] [cursor=pointer]:
+            - img [ref=e35]
+            - text: Back to search
+          - generic [ref=e37]:
+            - generic [ref=e39]:
+              - generic [ref=e40]:
+                - generic [ref=e41]:
+                  - generic [ref=e42]: "@team-very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789"
+                  - generic [ref=e43]: "Downloads: 12345"
+                  - generic [ref=e44]: "Stars: 7"
+                  - generic [ref=e45]: v1.0.0-alpha-long-version-name-0123456789
+                - heading "SkillHub very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789" [level=2] [ref=e46]
+                - paragraph [ref=e47]: 这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。 https://example.com/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789
+              - button "Install" [ref=e48] [cursor=pointer]:
+                - img [ref=e49]
+                - text: Install
+            - generic [ref=e52]:
+              - tablist [ref=e53]:
+                - tab "Overview" [ref=e54] [cursor=pointer]
+                - tab "Files" [selected] [ref=e55] [cursor=pointer]
+                - tab "Versions" [ref=e56] [cursor=pointer]
+              - tabpanel "Files" [ref=e57]:
+                - generic [ref=e58]:
+                  - generic [ref=e60]:
+                    - button "SKILL.md 2.0 KB" [ref=e61] [cursor=pointer]:
+                      - generic [ref=e62]: SKILL.md
+                      - generic [ref=e63]: 2.0 KB
+                    - button "src/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/implementation.ts 4.0 KB" [active] [ref=e64] [cursor=pointer]:
+                      - generic [ref=e65]: src/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/implementation.ts
+                      - generic [ref=e66]: 4.0 KB
+                  - generic [ref=e68]:
+                    - generic [ref=e69]:
+                      - generic [ref=e70]: src/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/implementation.ts
+                      - generic [ref=e71]: "Size: 2.0 KB"
+                    - generic [ref=e72]:
+                      - heading "src/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/implementation.ts" [level=1] [ref=e73]
+                      - paragraph [ref=e74]: 这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。这是用于市场页和配置页响应式检测的超长文本。
+                      - paragraph [ref=e75]:
+                        - code [ref=e76]: "`very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789`"
+  - alert [ref=e77]
+```
+
+# Test source
+
+```ts
+  99  |   });
+  100 |   await page.route('**/api/marketplaces/skills/search**', async (route) => {
+  101 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  102 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ items: [skillItem()], total: 1, page: 0, size: 12 }) });
+  103 |   });
+  104 |   await page.route('**/api/marketplaces/skills/*/*/versions/*/file**', async (route) => {
+  105 |     const url = new URL(route.request().url());
+  106 |     const filePath = url.searchParams.get('path') || 'SKILL.md';
+  107 |     callLog.push({ method: route.request().method(), url: route.request().url(), filePath });
+  108 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ filePath, fileSize: 2000, contentType: 'text/markdown', isBinary: false, content: `# ${filePath}\n\n${LONG_TEXT}\n\n\`${LONG}${LONG}\`` }) });
+  109 |   });
+  110 |   await page.route('**/api/marketplaces/skills/*/*/versions/*', async (route) => {
+  111 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  112 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ detail: { version: '1.0.0-alpha-long-version-name-0123456789', status: 'published', parsedMetadataJson: JSON.stringify({ body: `# Skill\n\n${LONG_TEXT}` }) }, files: [{ filePath: 'SKILL.md', fileSize: 2048, contentType: 'text/markdown' }, { filePath: `src/${LONG}/implementation.ts`, fileSize: 4096, contentType: 'text/plain' }] }) });
+  113 |   });
+  114 |   await page.route('**/api/marketplaces/skills/*/*/versions', async (route) => {
+  115 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  116 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ items: [{ version: '1.0.0-alpha-long-version-name-0123456789', status: 'published', createdAt: '2026-06-04T08:00:00Z', changeReason: LONG_TEXT }], total: 1, page: 0, size: 20 }) });
+  117 |   });
+  118 |   await page.route('**/api/marketplaces/skills/*/*/install', async (route) => {
+  119 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  120 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true, skill_name: `skill-${LONG}`, version: '1.0.0-alpha-long-version-name-0123456789', source: 'skillhub', namespace: `team-${LONG}` }) });
+  121 |   });
+  122 |   await page.route('**/api/marketplaces/skills/*/*', async (route) => {
+  123 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  124 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(skillItem()) });
+  125 |   });
+  126 |   await page.route('**/api/status', async (route) => {
+  127 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  128 |     if (statusError) {
+  129 |       await route.fulfill({ status: 500, contentType: 'application/json', body: JSON.stringify({ detail: 'QA status error' }) });
+  130 |       return;
+  131 |     }
+  132 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(statusPayload()) });
+  133 |   });
+  134 |   await page.route('**/api/providers/*/config', async (route) => {
+  135 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  136 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  137 |   });
+  138 |   await page.route('**/api/agent/config', async (route) => {
+  139 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  140 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  141 |   });
+  142 |   await page.route('**/api/channels/*/config', async (route) => {
+  143 |     const body = route.request().postDataJSON?.();
+  144 |     callLog.push({ method: route.request().method(), url: route.request().url(), body });
+  145 |     if (route.request().method() === 'GET') {
+  146 |       await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ channel_id: `telegram-${LONG}`, enabled: true, kind: 'telegram', mode: 'polling', account_id: `bot-${LONG}`, display_name: `Telegram ${LONG}`, config: { requireMentionInGroups: true }, secrets: { botToken: '***' } }) });
+  147 |     } else {
+  148 |       await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true, channel_id: `telegram-${LONG}`, restart_required: true, channel: { channel_id: `telegram-${LONG}`, enabled: true, kind: 'telegram', mode: 'polling', account_id: `bot-${LONG}`, display_name: `Telegram ${LONG}`, config: body?.config || {}, secrets: {} } }) });
+  149 |     }
+  150 |   });
+  151 |   await page.route('**/api/channels/*/events**', async (route) => {
+  152 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  153 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ event_id: `event-${LONG}`, channel_id: `telegram-${LONG}`, kind: 'message', status: `ok-${LONG}`, error: null, created_at: '2026-06-04T08:00:00Z' }]) });
+  154 |   });
+  155 |   await page.route('**/api/channel-connectors', async (route) => {
+  156 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  157 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ kind: 'terminal', displayName: 'Terminal' }, { kind: 'telegram', displayName: 'Telegram' }, { kind: 'feishu', displayName: 'Feishu/Lark', authType: 'plugin' }]) });
+  158 |   });
+  159 |   await page.route('**/api/channel-connections', async (route) => {
+  160 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  161 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ connection_id: `conn-${LONG}`, channel_id: `telegram-${LONG}`, kind: 'telegram', mode: 'polling', display_name: 'Telegram', account_id: `bot-${LONG}`, status: 'connected', auth_type: 'token' }]) });
+  162 |   });
+  163 |   await page.route('**/api/runtime/restart', async (route) => {
+  164 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  165 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  166 |   });
+  167 | }
+  168 | 
+  169 | async function collectMetrics(page) {
+  170 |   return await page.evaluate(() => {
+  171 |     const viewportWidth = window.innerWidth;
+  172 |     const bodyWidth = document.body.scrollWidth;
+  173 |     const docWidth = document.documentElement.scrollWidth;
+  174 |     const overflowElements = Array.from(document.querySelectorAll('body *')).map((el) => {
+  175 |       const rect = el.getBoundingClientRect();
+  176 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || '').trim().slice(0, 100), left: rect.left, right: rect.right, width: rect.width, className: String(el.className || '') };
+  177 |     }).filter((item) => item.width > 1 && (item.left < -1 || item.right > viewportWidth + 1)).slice(0, 30);
+  178 |     const smallTargets = Array.from(document.querySelectorAll('button, a, input:not([type=hidden]), textarea, [role="button"], [role="switch"], [role="combobox"], [role="tab"]')).map((el) => {
+  179 |       const rect = el.getBoundingClientRect();
+  180 |       const style = window.getComputedStyle(el);
+  181 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || el.getAttribute('title') || '').trim().slice(0, 100), width: Math.round(rect.width), height: Math.round(rect.height), visible: style.visibility !== 'hidden' && style.display !== 'none' && Number(style.opacity) > 0.01 && rect.width > 0 && rect.height > 0 };
+  182 |     }).filter((item) => item.visible && (item.width < 44 || item.height < 44)).slice(0, 30);
+  183 |     return { viewportWidth, bodyWidth, docWidth, horizontalOverflow: Math.max(bodyWidth, docWidth) > viewportWidth + 1, overflowElements, smallTargets };
+  184 |   });
+  185 | }
+  186 | 
+  187 | test.describe('marketplace and settings QA', () => {
+  188 |   test('marketplace search detail file install flow works', async ({ page }) => {
+  189 |     await page.setViewportSize({ width: 390, height: 844 });
+  190 |     await installRoutes(page);
+  191 |     await page.goto(`${APP}/marketplace`);
+  192 |     await expect(page.getByPlaceholder(/搜索技能|Search skills/)).toBeVisible();
+  193 |     await page.getByPlaceholder(/搜索技能|Search skills/).fill('qa');
+  194 |     await page.getByRole('button', { name: /搜索|Search/ }).click();
+  195 |     await page.getByText(/SkillHub very-long-ui-token/).click();
+  196 |     await expect(page.getByRole('heading', { name: /SkillHub very-long-ui-token/ })).toBeVisible();
+  197 |     await page.getByRole('tab', { name: /文件|Files/ }).click();
+  198 |     await page.getByRole('button', { name: /src\/very-long-ui-token/ }).click();
+> 199 |     await expect(page.getByText(/src\/very-long-ui-token/)).toBeVisible();
+      |                                                             ^ Error: expect(locator).toBeVisible() failed
+  200 |     await page.getByRole('button', { name: /安装|Install/ }).click();
+  201 |     await expect.poll(() => callLog.some((call) => call.url.includes('/install') && call.method === 'POST')).toBe(true);
+  202 |     await page.screenshot({ path: path.join(SHOT_DIR, 'market-detail-390x844.png'), fullPage: true });
+  203 |   });
+  204 | 
+  205 |   test('settings agent provider channel and restart flows work', async ({ page }) => {
+  206 |     await page.setViewportSize({ width: 390, height: 844 });
+  207 |     await installRoutes(page);
+  208 |     await page.goto(`${APP}/settings`);
+  209 |     await expect(page.getByRole('heading', { name: /配置|Settings/ })).toBeVisible();
+  210 |     await page.getByLabel(/温度|Temperature/).fill('0.3');
+  211 |     await page.getByRole('button', { name: /保存智能体配置|Save agent config/ }).click();
+  212 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/agent/config') && call.method !== 'GET')).toBe(true);
+  213 |     await page.getByRole('button', { name: /OpenAI/ }).click();
+  214 |     await expect(page.getByRole('dialog')).toBeVisible();
+  215 |     await page.getByLabel(/请求超时|Request timeout/).fill('60');
+  216 |     await page.getByRole('button', { name: /保存|Save/ }).click();
+  217 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/providers/openai/config'))).toBe(true);
+  218 |     await page.getByRole('button', { name: /Telegram/ }).click();
+  219 |     await expect(page.getByRole('dialog')).toBeVisible();
+  220 |     await page.getByLabel(/显示名|Display name/).fill(`Telegram ${LONG}`);
+  221 |     await page.getByRole('button', { name: /保存通道配置|Save channel config/ }).click();
+  222 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/channels/') && call.method !== 'GET')).toBe(true);
+  223 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-channel-390x844.png'), fullPage: true });
+  224 |     await page.keyboard.press('Escape');
+  225 |     await page.getByRole('button', { name: /重启实例|Restart instance/ }).first().click();
+  226 |     await expect(page.getByRole('dialog')).toBeVisible();
+  227 |     await page.getByRole('button', { name: /^重启$|^Restart$/ }).click();
+  228 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/runtime/restart'))).toBe(true);
+  229 |   });
+  230 | 
+  231 |   test('settings error state is readable', async ({ page }) => {
+  232 |     await page.setViewportSize({ width: 390, height: 844 });
+  233 |     await installRoutes(page, { statusError: true });
+  234 |     await page.goto(`${APP}/settings`);
+  235 |     await expect(page.getByText(/QA status error|无法连接|Unable to connect/)).toBeVisible();
+  236 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-error-390x844.png'), fullPage: true });
+  237 |     const metrics = await collectMetrics(page);
+  238 |     expect(metrics.horizontalOverflow, JSON.stringify(metrics.overflowElements, null, 2)).toBe(false);
+  239 |   });
+  240 | 
+  241 |   test('responsive layouts have no page overflow or visible small targets', async ({ browser }) => {
+  242 |     const results = [];
+  243 |     for (const viewport of [
+  244 |       { width: 320, height: 568 },
+  245 |       { width: 390, height: 844 },
+  246 |       { width: 844, height: 390 },
+  247 |       { width: 768, height: 1024 },
+  248 |       { width: 1365, height: 900 },
+  249 |     ]) {
+  250 |       const market = await browser.newPage({ viewport });
+  251 |       await installRoutes(market);
+  252 |       await market.goto(`${APP}/marketplace`);
+  253 |       await market.getByText(/SkillHub very-long-ui-token/).click();
+  254 |       await market.screenshot({ path: path.join(SHOT_DIR, `market-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  255 |       const marketMetrics = await collectMetrics(market);
+  256 |       await market.close();
+  257 | 
+  258 |       const settings = await browser.newPage({ viewport });
+  259 |       await installRoutes(settings);
+  260 |       await settings.goto(`${APP}/settings`);
+  261 |       await settings.getByRole('button', { name: /Telegram/ }).click();
+  262 |       await settings.screenshot({ path: path.join(SHOT_DIR, `settings-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  263 |       const settingsMetrics = await collectMetrics(settings);
+  264 |       await settings.close();
+  265 | 
+  266 |       results.push({ viewport, marketMetrics, settingsMetrics });
+  267 |       expect(marketMetrics.horizontalOverflow, JSON.stringify(marketMetrics.overflowElements, null, 2)).toBe(false);
+  268 |       expect(settingsMetrics.horizontalOverflow, JSON.stringify(settingsMetrics.overflowElements, null, 2)).toBe(false);
+  269 |       expect(marketMetrics.smallTargets, JSON.stringify(marketMetrics.smallTargets, null, 2)).toEqual([]);
+  270 |       expect(settingsMetrics.smallTargets, JSON.stringify(settingsMetrics.smallTargets, null, 2)).toEqual([]);
+  271 |     }
+  272 |     fs.writeFileSync(REPORT, JSON.stringify({ results }, null, 2));
+  273 |   });
+  274 | });
+  275 | 
+```
\ No newline at end of file
diff --git a/app-instance/frontend/test-results/market-settings-qa-marketp-a30a5-ngs-error-state-is-readable/error-context.md b/app-instance/frontend/test-results/market-settings-qa-marketp-a30a5-ngs-error-state-is-readable/error-context.md
new file mode 100644
index 0000000..199fbc3
--- /dev/null
+++ b/app-instance/frontend/test-results/market-settings-qa-marketp-a30a5-ngs-error-state-is-readable/error-context.md
@@ -0,0 +1,208 @@
+# Instructions
+
+- Following Playwright test failed.
+- Explain why, be concise, respect Playwright best practices.
+- Provide a snippet of code with the fix, if possible.
+
+# Test info
+
+- Name: market-settings-qa.spec.js >> marketplace and settings QA >> settings error state is readable
+- Location: ../../../../../../tmp/beaver-market-settings-qa/market-settings-qa.spec.js:231:3
+
+# Error details
+
+```
+Error: expect(locator).toBeVisible() failed
+
+Locator: getByText(/QA status error|无法连接|Unable to connect/)
+Expected: visible
+Error: strict mode violation: getByText(/QA status error|无法连接|Unable to connect/) resolved to 2 elements:
+    1) <p class="font-medium">Unable to connect to the Boardware Agent Sandbox …</p> aka getByText('Unable to connect to the')
+    2) <p class="text-sm text-muted-foreground mt-1">API error 500: QA status error</p> aka getByText('API error 500: QA status error')
+
+Call log:
+  - Expect "toBeVisible" with timeout 8000ms
+  - waiting for getByText(/QA status error|无法连接|Unable to connect/)
+
+```
+
+# Page snapshot
+
+```yaml
+- generic [active] [ref=e1]:
+  - generic [ref=e2]:
+    - banner [ref=e3]:
+      - generic [ref=e5]:
+        - generic [ref=e6]:
+          - button "Open navigation" [ref=e7] [cursor=pointer]:
+            - img [ref=e8]
+          - link "Beaver" [ref=e9] [cursor=pointer]:
+            - /url: /
+            - generic [ref=e10]: Beaver
+        - generic [ref=e12]:
+          - generic [ref=e13]:
+            - img [ref=e14]
+            - button "ZH" [ref=e18] [cursor=pointer]
+            - button "EN" [ref=e19] [cursor=pointer]
+          - button "Open account menu" [ref=e20] [cursor=pointer]:
+            - generic [ref=e22]: U
+    - main [ref=e23]:
+      - generic [ref=e26]:
+        - generic [ref=e27]:
+          - img [ref=e28]
+          - generic [ref=e30]:
+            - paragraph [ref=e31]: Unable to connect to the Boardware Agent Sandbox backend
+            - paragraph [ref=e32]: "API error 500: QA status error"
+            - paragraph [ref=e33]: Please confirm the backend service is running and reachable from this page.
+        - button "Retry" [ref=e34] [cursor=pointer]:
+          - img [ref=e35]
+          - text: Retry
+  - alert [ref=e40]
+```
+
+# Test source
+
+```ts
+  135 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  136 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  137 |   });
+  138 |   await page.route('**/api/agent/config', async (route) => {
+  139 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  140 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  141 |   });
+  142 |   await page.route('**/api/channels/*/config', async (route) => {
+  143 |     const body = route.request().postDataJSON?.();
+  144 |     callLog.push({ method: route.request().method(), url: route.request().url(), body });
+  145 |     if (route.request().method() === 'GET') {
+  146 |       await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ channel_id: `telegram-${LONG}`, enabled: true, kind: 'telegram', mode: 'polling', account_id: `bot-${LONG}`, display_name: `Telegram ${LONG}`, config: { requireMentionInGroups: true }, secrets: { botToken: '***' } }) });
+  147 |     } else {
+  148 |       await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true, channel_id: `telegram-${LONG}`, restart_required: true, channel: { channel_id: `telegram-${LONG}`, enabled: true, kind: 'telegram', mode: 'polling', account_id: `bot-${LONG}`, display_name: `Telegram ${LONG}`, config: body?.config || {}, secrets: {} } }) });
+  149 |     }
+  150 |   });
+  151 |   await page.route('**/api/channels/*/events**', async (route) => {
+  152 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  153 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ event_id: `event-${LONG}`, channel_id: `telegram-${LONG}`, kind: 'message', status: `ok-${LONG}`, error: null, created_at: '2026-06-04T08:00:00Z' }]) });
+  154 |   });
+  155 |   await page.route('**/api/channel-connectors', async (route) => {
+  156 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  157 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ kind: 'terminal', displayName: 'Terminal' }, { kind: 'telegram', displayName: 'Telegram' }, { kind: 'feishu', displayName: 'Feishu/Lark', authType: 'plugin' }]) });
+  158 |   });
+  159 |   await page.route('**/api/channel-connections', async (route) => {
+  160 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  161 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ connection_id: `conn-${LONG}`, channel_id: `telegram-${LONG}`, kind: 'telegram', mode: 'polling', display_name: 'Telegram', account_id: `bot-${LONG}`, status: 'connected', auth_type: 'token' }]) });
+  162 |   });
+  163 |   await page.route('**/api/runtime/restart', async (route) => {
+  164 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  165 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  166 |   });
+  167 | }
+  168 | 
+  169 | async function collectMetrics(page) {
+  170 |   return await page.evaluate(() => {
+  171 |     const viewportWidth = window.innerWidth;
+  172 |     const bodyWidth = document.body.scrollWidth;
+  173 |     const docWidth = document.documentElement.scrollWidth;
+  174 |     const overflowElements = Array.from(document.querySelectorAll('body *')).map((el) => {
+  175 |       const rect = el.getBoundingClientRect();
+  176 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || '').trim().slice(0, 100), left: rect.left, right: rect.right, width: rect.width, className: String(el.className || '') };
+  177 |     }).filter((item) => item.width > 1 && (item.left < -1 || item.right > viewportWidth + 1)).slice(0, 30);
+  178 |     const smallTargets = Array.from(document.querySelectorAll('button, a, input:not([type=hidden]), textarea, [role="button"], [role="switch"], [role="combobox"], [role="tab"]')).map((el) => {
+  179 |       const rect = el.getBoundingClientRect();
+  180 |       const style = window.getComputedStyle(el);
+  181 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || el.getAttribute('title') || '').trim().slice(0, 100), width: Math.round(rect.width), height: Math.round(rect.height), visible: style.visibility !== 'hidden' && style.display !== 'none' && Number(style.opacity) > 0.01 && rect.width > 0 && rect.height > 0 };
+  182 |     }).filter((item) => item.visible && (item.width < 44 || item.height < 44)).slice(0, 30);
+  183 |     return { viewportWidth, bodyWidth, docWidth, horizontalOverflow: Math.max(bodyWidth, docWidth) > viewportWidth + 1, overflowElements, smallTargets };
+  184 |   });
+  185 | }
+  186 | 
+  187 | test.describe('marketplace and settings QA', () => {
+  188 |   test('marketplace search detail file install flow works', async ({ page }) => {
+  189 |     await page.setViewportSize({ width: 390, height: 844 });
+  190 |     await installRoutes(page);
+  191 |     await page.goto(`${APP}/marketplace`);
+  192 |     await expect(page.getByPlaceholder(/搜索技能|Search skills/)).toBeVisible();
+  193 |     await page.getByPlaceholder(/搜索技能|Search skills/).fill('qa');
+  194 |     await page.getByRole('button', { name: /搜索|Search/ }).click();
+  195 |     await page.getByText(/SkillHub very-long-ui-token/).click();
+  196 |     await expect(page.getByRole('heading', { name: /SkillHub very-long-ui-token/ })).toBeVisible();
+  197 |     await page.getByRole('tab', { name: /文件|Files/ }).click();
+  198 |     await page.getByRole('button', { name: /src\/very-long-ui-token/ }).click();
+  199 |     await expect(page.getByText(/src\/very-long-ui-token/)).toBeVisible();
+  200 |     await page.getByRole('button', { name: /安装|Install/ }).click();
+  201 |     await expect.poll(() => callLog.some((call) => call.url.includes('/install') && call.method === 'POST')).toBe(true);
+  202 |     await page.screenshot({ path: path.join(SHOT_DIR, 'market-detail-390x844.png'), fullPage: true });
+  203 |   });
+  204 | 
+  205 |   test('settings agent provider channel and restart flows work', async ({ page }) => {
+  206 |     await page.setViewportSize({ width: 390, height: 844 });
+  207 |     await installRoutes(page);
+  208 |     await page.goto(`${APP}/settings`);
+  209 |     await expect(page.getByRole('heading', { name: /配置|Settings/ })).toBeVisible();
+  210 |     await page.getByLabel(/温度|Temperature/).fill('0.3');
+  211 |     await page.getByRole('button', { name: /保存智能体配置|Save agent config/ }).click();
+  212 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/agent/config') && call.method !== 'GET')).toBe(true);
+  213 |     await page.getByRole('button', { name: /OpenAI/ }).click();
+  214 |     await expect(page.getByRole('dialog')).toBeVisible();
+  215 |     await page.getByLabel(/请求超时|Request timeout/).fill('60');
+  216 |     await page.getByRole('button', { name: /保存|Save/ }).click();
+  217 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/providers/openai/config'))).toBe(true);
+  218 |     await page.getByRole('button', { name: /Telegram/ }).click();
+  219 |     await expect(page.getByRole('dialog')).toBeVisible();
+  220 |     await page.getByLabel(/显示名|Display name/).fill(`Telegram ${LONG}`);
+  221 |     await page.getByRole('button', { name: /保存通道配置|Save channel config/ }).click();
+  222 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/channels/') && call.method !== 'GET')).toBe(true);
+  223 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-channel-390x844.png'), fullPage: true });
+  224 |     await page.keyboard.press('Escape');
+  225 |     await page.getByRole('button', { name: /重启实例|Restart instance/ }).first().click();
+  226 |     await expect(page.getByRole('dialog')).toBeVisible();
+  227 |     await page.getByRole('button', { name: /^重启$|^Restart$/ }).click();
+  228 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/runtime/restart'))).toBe(true);
+  229 |   });
+  230 | 
+  231 |   test('settings error state is readable', async ({ page }) => {
+  232 |     await page.setViewportSize({ width: 390, height: 844 });
+  233 |     await installRoutes(page, { statusError: true });
+  234 |     await page.goto(`${APP}/settings`);
+> 235 |     await expect(page.getByText(/QA status error|无法连接|Unable to connect/)).toBeVisible();
+      |                                                                            ^ Error: expect(locator).toBeVisible() failed
+  236 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-error-390x844.png'), fullPage: true });
+  237 |     const metrics = await collectMetrics(page);
+  238 |     expect(metrics.horizontalOverflow, JSON.stringify(metrics.overflowElements, null, 2)).toBe(false);
+  239 |   });
+  240 | 
+  241 |   test('responsive layouts have no page overflow or visible small targets', async ({ browser }) => {
+  242 |     const results = [];
+  243 |     for (const viewport of [
+  244 |       { width: 320, height: 568 },
+  245 |       { width: 390, height: 844 },
+  246 |       { width: 844, height: 390 },
+  247 |       { width: 768, height: 1024 },
+  248 |       { width: 1365, height: 900 },
+  249 |     ]) {
+  250 |       const market = await browser.newPage({ viewport });
+  251 |       await installRoutes(market);
+  252 |       await market.goto(`${APP}/marketplace`);
+  253 |       await market.getByText(/SkillHub very-long-ui-token/).click();
+  254 |       await market.screenshot({ path: path.join(SHOT_DIR, `market-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  255 |       const marketMetrics = await collectMetrics(market);
+  256 |       await market.close();
+  257 | 
+  258 |       const settings = await browser.newPage({ viewport });
+  259 |       await installRoutes(settings);
+  260 |       await settings.goto(`${APP}/settings`);
+  261 |       await settings.getByRole('button', { name: /Telegram/ }).click();
+  262 |       await settings.screenshot({ path: path.join(SHOT_DIR, `settings-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  263 |       const settingsMetrics = await collectMetrics(settings);
+  264 |       await settings.close();
+  265 | 
+  266 |       results.push({ viewport, marketMetrics, settingsMetrics });
+  267 |       expect(marketMetrics.horizontalOverflow, JSON.stringify(marketMetrics.overflowElements, null, 2)).toBe(false);
+  268 |       expect(settingsMetrics.horizontalOverflow, JSON.stringify(settingsMetrics.overflowElements, null, 2)).toBe(false);
+  269 |       expect(marketMetrics.smallTargets, JSON.stringify(marketMetrics.smallTargets, null, 2)).toEqual([]);
+  270 |       expect(settingsMetrics.smallTargets, JSON.stringify(settingsMetrics.smallTargets, null, 2)).toEqual([]);
+  271 |     }
+  272 |     fs.writeFileSync(REPORT, JSON.stringify({ results }, null, 2));
+  273 |   });
+  274 | });
+  275 | 
+```
\ No newline at end of file
diff --git a/app-instance/frontend/test-results/market-settings-qa-marketp-f612f-nnel-and-restart-flows-work/error-context.md b/app-instance/frontend/test-results/market-settings-qa-marketp-f612f-nnel-and-restart-flows-work/error-context.md
new file mode 100644
index 0000000..f075810
--- /dev/null
+++ b/app-instance/frontend/test-results/market-settings-qa-marketp-f612f-nnel-and-restart-flows-work/error-context.md
@@ -0,0 +1,316 @@
+# Instructions
+
+- Following Playwright test failed.
+- Explain why, be concise, respect Playwright best practices.
+- Provide a snippet of code with the fix, if possible.
+
+# Test info
+
+- Name: market-settings-qa.spec.js >> marketplace and settings QA >> settings agent provider channel and restart flows work
+- Location: ../../../../../../tmp/beaver-market-settings-qa/market-settings-qa.spec.js:205:3
+
+# Error details
+
+```
+Error: expect(received).toBe(expected) // Object.is equality
+
+Expected: true
+Received: false
+
+Call Log:
+- Timeout 8000ms exceeded while waiting on the predicate
+```
+
+# Page snapshot
+
+```yaml
+- generic [active] [ref=e1]:
+  - generic [ref=e2]:
+    - banner [ref=e3]:
+      - generic [ref=e5]:
+        - generic [ref=e6]:
+          - button "Open navigation" [ref=e7] [cursor=pointer]:
+            - img [ref=e8]
+          - link "Beaver" [ref=e9] [cursor=pointer]:
+            - /url: /
+            - generic [ref=e10]: Beaver
+        - generic [ref=e12]:
+          - generic [ref=e13]:
+            - img [ref=e14]
+            - button "ZH" [ref=e18] [cursor=pointer]
+            - button "EN" [ref=e19] [cursor=pointer]
+          - button "Open account menu" [ref=e20] [cursor=pointer]:
+            - generic [ref=e22]: U
+    - main [ref=e23]:
+      - generic [ref=e24]:
+        - generic [ref=e25]:
+          - generic [ref=e26]:
+            - heading "Settings" [level=1] [ref=e27]
+            - paragraph [ref=e28]: Manage models, tools, integrations, and instance runtime status. Tasks and notifications stay in their own pages.
+          - button "Refresh" [ref=e29] [cursor=pointer]:
+            - img [ref=e30]
+            - text: Refresh
+        - generic [ref=e35]:
+          - heading "Instance runtime" [level=3] [ref=e37]:
+            - img [ref=e38]
+            - text: Instance runtime
+          - generic [ref=e41]:
+            - generic [ref=e42]:
+              - generic [ref=e43]:
+                - paragraph [ref=e44]: Runtime and debugging
+                - paragraph [ref=e45]: Inspect per-chat runtime logs and current instance status.
+              - generic [ref=e46]:
+                - link "Runtime Logs" [ref=e47] [cursor=pointer]:
+                  - /url: /logs
+                  - img [ref=e48]
+                  - text: Runtime Logs
+                - button "Restart instance" [ref=e51] [cursor=pointer]:
+                  - img [ref=e52]
+                  - text: Restart instance
+            - generic [ref=e57]:
+              - generic [ref=e58]:
+                - generic [ref=e59]: Config file
+                - code [ref=e61]: /home/ivan/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/config/beaver.yml
+              - generic [ref=e62]:
+                - generic [ref=e63]: Workspace
+                - code [ref=e65]: /home/ivan/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/workspace
+        - generic [ref=e66]:
+          - heading "Agent configuration" [level=3] [ref=e68]:
+            - img [ref=e69]
+            - text: Agent configuration
+          - generic [ref=e72]:
+            - generic [ref=e73]:
+              - generic [ref=e74]: Model
+              - code [ref=e76]: qwen-very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789
+            - generic [ref=e77]:
+              - generic [ref=e78]:
+                - generic [ref=e79]: Max tokens
+                - textbox "Max tokens" [ref=e80]:
+                  - /placeholder: Model default
+                  - text: "4096"
+              - generic [ref=e81]:
+                - generic [ref=e82]: Temperature
+                - textbox "Temperature" [ref=e83]: "0.2"
+              - generic [ref=e84]:
+                - generic [ref=e85]: Max tool iterations
+                - textbox "Max tool iterations" [ref=e86]: "30"
+            - button "Save agent config" [ref=e88] [cursor=pointer]
+        - generic [ref=e89]:
+          - heading "Providers" [level=3] [ref=e91]:
+            - img [ref=e92]
+            - text: Providers
+          - generic [ref=e97]:
+            - button "OpenAI very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789 Current default sk-********" [ref=e98] [cursor=pointer]:
+              - generic [ref=e99]:
+                - generic [ref=e100]:
+                  - img [ref=e101]
+                  - generic [ref=e104]: OpenAI very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789
+                - generic [ref=e105]: Current default
+                - generic [ref=e106]: sk-********
+              - img [ref=e107]
+            - button "DeepSeek Click to configure" [ref=e110] [cursor=pointer]:
+              - generic [ref=e111]:
+                - generic [ref=e112]:
+                  - img [ref=e113]
+                  - generic [ref=e117]: DeepSeek
+                - generic [ref=e118]: Click to configure
+              - img [ref=e119]
+        - generic [ref=e122]:
+          - heading "Channels" [level=3] [ref=e124]:
+            - img [ref=e125]
+            - text: Channels
+          - generic [ref=e133]:
+            - button "Weixin QR Connect" [ref=e134] [cursor=pointer]:
+              - generic [ref=e135]:
+                - generic [ref=e136]:
+                  - img [ref=e137]
+                  - generic [ref=e143]: Weixin
+                - generic [ref=e144]: QR
+              - generic [ref=e145]: Connect
+            - button "Feishu/Lark plugin Connect" [ref=e146] [cursor=pointer]:
+              - generic [ref=e147]:
+                - generic [ref=e148]:
+                  - img [ref=e149]
+                  - generic [ref=e155]: Feishu/Lark
+                - generic [ref=e156]: plugin
+              - generic [ref=e157]: Connect
+            - button "Terminal Local terminal connection Connection instructions Guide" [ref=e158] [cursor=pointer]:
+              - generic [ref=e159]:
+                - generic [ref=e160]:
+                  - img [ref=e161]
+                  - generic [ref=e167]: Terminal
+                - generic [ref=e168]: Local terminal connection
+                - generic [ref=e169]: Connection instructions
+              - generic [ref=e170]: Guide
+  - alert [ref=e171]
+```
+
+# Test source
+
+```ts
+  112 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ detail: { version: '1.0.0-alpha-long-version-name-0123456789', status: 'published', parsedMetadataJson: JSON.stringify({ body: `# Skill\n\n${LONG_TEXT}` }) }, files: [{ filePath: 'SKILL.md', fileSize: 2048, contentType: 'text/markdown' }, { filePath: `src/${LONG}/implementation.ts`, fileSize: 4096, contentType: 'text/plain' }] }) });
+  113 |   });
+  114 |   await page.route('**/api/marketplaces/skills/*/*/versions', async (route) => {
+  115 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  116 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ items: [{ version: '1.0.0-alpha-long-version-name-0123456789', status: 'published', createdAt: '2026-06-04T08:00:00Z', changeReason: LONG_TEXT }], total: 1, page: 0, size: 20 }) });
+  117 |   });
+  118 |   await page.route('**/api/marketplaces/skills/*/*/install', async (route) => {
+  119 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  120 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true, skill_name: `skill-${LONG}`, version: '1.0.0-alpha-long-version-name-0123456789', source: 'skillhub', namespace: `team-${LONG}` }) });
+  121 |   });
+  122 |   await page.route('**/api/marketplaces/skills/*/*', async (route) => {
+  123 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  124 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(skillItem()) });
+  125 |   });
+  126 |   await page.route('**/api/status', async (route) => {
+  127 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  128 |     if (statusError) {
+  129 |       await route.fulfill({ status: 500, contentType: 'application/json', body: JSON.stringify({ detail: 'QA status error' }) });
+  130 |       return;
+  131 |     }
+  132 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify(statusPayload()) });
+  133 |   });
+  134 |   await page.route('**/api/providers/*/config', async (route) => {
+  135 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  136 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  137 |   });
+  138 |   await page.route('**/api/agent/config', async (route) => {
+  139 |     callLog.push({ method: route.request().method(), url: route.request().url(), body: route.request().postDataJSON?.() });
+  140 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  141 |   });
+  142 |   await page.route('**/api/channels/*/config', async (route) => {
+  143 |     const body = route.request().postDataJSON?.();
+  144 |     callLog.push({ method: route.request().method(), url: route.request().url(), body });
+  145 |     if (route.request().method() === 'GET') {
+  146 |       await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ channel_id: `telegram-${LONG}`, enabled: true, kind: 'telegram', mode: 'polling', account_id: `bot-${LONG}`, display_name: `Telegram ${LONG}`, config: { requireMentionInGroups: true }, secrets: { botToken: '***' } }) });
+  147 |     } else {
+  148 |       await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true, channel_id: `telegram-${LONG}`, restart_required: true, channel: { channel_id: `telegram-${LONG}`, enabled: true, kind: 'telegram', mode: 'polling', account_id: `bot-${LONG}`, display_name: `Telegram ${LONG}`, config: body?.config || {}, secrets: {} } }) });
+  149 |     }
+  150 |   });
+  151 |   await page.route('**/api/channels/*/events**', async (route) => {
+  152 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  153 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ event_id: `event-${LONG}`, channel_id: `telegram-${LONG}`, kind: 'message', status: `ok-${LONG}`, error: null, created_at: '2026-06-04T08:00:00Z' }]) });
+  154 |   });
+  155 |   await page.route('**/api/channel-connectors', async (route) => {
+  156 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  157 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ kind: 'terminal', displayName: 'Terminal' }, { kind: 'telegram', displayName: 'Telegram' }, { kind: 'feishu', displayName: 'Feishu/Lark', authType: 'plugin' }]) });
+  158 |   });
+  159 |   await page.route('**/api/channel-connections', async (route) => {
+  160 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  161 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ connection_id: `conn-${LONG}`, channel_id: `telegram-${LONG}`, kind: 'telegram', mode: 'polling', display_name: 'Telegram', account_id: `bot-${LONG}`, status: 'connected', auth_type: 'token' }]) });
+  162 |   });
+  163 |   await page.route('**/api/runtime/restart', async (route) => {
+  164 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  165 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  166 |   });
+  167 | }
+  168 | 
+  169 | async function collectMetrics(page) {
+  170 |   return await page.evaluate(() => {
+  171 |     const viewportWidth = window.innerWidth;
+  172 |     const bodyWidth = document.body.scrollWidth;
+  173 |     const docWidth = document.documentElement.scrollWidth;
+  174 |     const overflowElements = Array.from(document.querySelectorAll('body *')).map((el) => {
+  175 |       const rect = el.getBoundingClientRect();
+  176 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || '').trim().slice(0, 100), left: rect.left, right: rect.right, width: rect.width, className: String(el.className || '') };
+  177 |     }).filter((item) => item.width > 1 && (item.left < -1 || item.right > viewportWidth + 1)).slice(0, 30);
+  178 |     const smallTargets = Array.from(document.querySelectorAll('button, a, input:not([type=hidden]), textarea, [role="button"], [role="switch"], [role="combobox"], [role="tab"]')).map((el) => {
+  179 |       const rect = el.getBoundingClientRect();
+  180 |       const style = window.getComputedStyle(el);
+  181 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || el.getAttribute('title') || '').trim().slice(0, 100), width: Math.round(rect.width), height: Math.round(rect.height), visible: style.visibility !== 'hidden' && style.display !== 'none' && Number(style.opacity) > 0.01 && rect.width > 0 && rect.height > 0 };
+  182 |     }).filter((item) => item.visible && (item.width < 44 || item.height < 44)).slice(0, 30);
+  183 |     return { viewportWidth, bodyWidth, docWidth, horizontalOverflow: Math.max(bodyWidth, docWidth) > viewportWidth + 1, overflowElements, smallTargets };
+  184 |   });
+  185 | }
+  186 | 
+  187 | test.describe('marketplace and settings QA', () => {
+  188 |   test('marketplace search detail file install flow works', async ({ page }) => {
+  189 |     await page.setViewportSize({ width: 390, height: 844 });
+  190 |     await installRoutes(page);
+  191 |     await page.goto(`${APP}/marketplace`);
+  192 |     await expect(page.getByPlaceholder(/搜索技能|Search skills/)).toBeVisible();
+  193 |     await page.getByPlaceholder(/搜索技能|Search skills/).fill('qa');
+  194 |     await page.getByRole('button', { name: /搜索|Search/ }).click();
+  195 |     await page.getByText(/SkillHub very-long-ui-token/).click();
+  196 |     await expect(page.getByRole('heading', { name: /SkillHub very-long-ui-token/ })).toBeVisible();
+  197 |     await page.getByRole('tab', { name: /文件|Files/ }).click();
+  198 |     await page.getByRole('button', { name: /src\/very-long-ui-token/ }).click();
+  199 |     await expect(page.getByText(/src\/very-long-ui-token/)).toBeVisible();
+  200 |     await page.getByRole('button', { name: /安装|Install/ }).click();
+  201 |     await expect.poll(() => callLog.some((call) => call.url.includes('/install') && call.method === 'POST')).toBe(true);
+  202 |     await page.screenshot({ path: path.join(SHOT_DIR, 'market-detail-390x844.png'), fullPage: true });
+  203 |   });
+  204 | 
+  205 |   test('settings agent provider channel and restart flows work', async ({ page }) => {
+  206 |     await page.setViewportSize({ width: 390, height: 844 });
+  207 |     await installRoutes(page);
+  208 |     await page.goto(`${APP}/settings`);
+  209 |     await expect(page.getByRole('heading', { name: /配置|Settings/ })).toBeVisible();
+  210 |     await page.getByLabel(/温度|Temperature/).fill('0.3');
+  211 |     await page.getByRole('button', { name: /保存智能体配置|Save agent config/ }).click();
+> 212 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/agent/config') && call.method !== 'GET')).toBe(true);
+      |                                                                                                                      ^ Error: expect(received).toBe(expected) // Object.is equality
+  213 |     await page.getByRole('button', { name: /OpenAI/ }).click();
+  214 |     await expect(page.getByRole('dialog')).toBeVisible();
+  215 |     await page.getByLabel(/请求超时|Request timeout/).fill('60');
+  216 |     await page.getByRole('button', { name: /保存|Save/ }).click();
+  217 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/providers/openai/config'))).toBe(true);
+  218 |     await page.getByRole('button', { name: /Telegram/ }).click();
+  219 |     await expect(page.getByRole('dialog')).toBeVisible();
+  220 |     await page.getByLabel(/显示名|Display name/).fill(`Telegram ${LONG}`);
+  221 |     await page.getByRole('button', { name: /保存通道配置|Save channel config/ }).click();
+  222 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/channels/') && call.method !== 'GET')).toBe(true);
+  223 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-channel-390x844.png'), fullPage: true });
+  224 |     await page.keyboard.press('Escape');
+  225 |     await page.getByRole('button', { name: /重启实例|Restart instance/ }).first().click();
+  226 |     await expect(page.getByRole('dialog')).toBeVisible();
+  227 |     await page.getByRole('button', { name: /^重启$|^Restart$/ }).click();
+  228 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/runtime/restart'))).toBe(true);
+  229 |   });
+  230 | 
+  231 |   test('settings error state is readable', async ({ page }) => {
+  232 |     await page.setViewportSize({ width: 390, height: 844 });
+  233 |     await installRoutes(page, { statusError: true });
+  234 |     await page.goto(`${APP}/settings`);
+  235 |     await expect(page.getByText(/QA status error|无法连接|Unable to connect/)).toBeVisible();
+  236 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-error-390x844.png'), fullPage: true });
+  237 |     const metrics = await collectMetrics(page);
+  238 |     expect(metrics.horizontalOverflow, JSON.stringify(metrics.overflowElements, null, 2)).toBe(false);
+  239 |   });
+  240 | 
+  241 |   test('responsive layouts have no page overflow or visible small targets', async ({ browser }) => {
+  242 |     const results = [];
+  243 |     for (const viewport of [
+  244 |       { width: 320, height: 568 },
+  245 |       { width: 390, height: 844 },
+  246 |       { width: 844, height: 390 },
+  247 |       { width: 768, height: 1024 },
+  248 |       { width: 1365, height: 900 },
+  249 |     ]) {
+  250 |       const market = await browser.newPage({ viewport });
+  251 |       await installRoutes(market);
+  252 |       await market.goto(`${APP}/marketplace`);
+  253 |       await market.getByText(/SkillHub very-long-ui-token/).click();
+  254 |       await market.screenshot({ path: path.join(SHOT_DIR, `market-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  255 |       const marketMetrics = await collectMetrics(market);
+  256 |       await market.close();
+  257 | 
+  258 |       const settings = await browser.newPage({ viewport });
+  259 |       await installRoutes(settings);
+  260 |       await settings.goto(`${APP}/settings`);
+  261 |       await settings.getByRole('button', { name: /Telegram/ }).click();
+  262 |       await settings.screenshot({ path: path.join(SHOT_DIR, `settings-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  263 |       const settingsMetrics = await collectMetrics(settings);
+  264 |       await settings.close();
+  265 | 
+  266 |       results.push({ viewport, marketMetrics, settingsMetrics });
+  267 |       expect(marketMetrics.horizontalOverflow, JSON.stringify(marketMetrics.overflowElements, null, 2)).toBe(false);
+  268 |       expect(settingsMetrics.horizontalOverflow, JSON.stringify(settingsMetrics.overflowElements, null, 2)).toBe(false);
+  269 |       expect(marketMetrics.smallTargets, JSON.stringify(marketMetrics.smallTargets, null, 2)).toEqual([]);
+  270 |       expect(settingsMetrics.smallTargets, JSON.stringify(settingsMetrics.smallTargets, null, 2)).toEqual([]);
+  271 |     }
+  272 |     fs.writeFileSync(REPORT, JSON.stringify({ results }, null, 2));
+  273 |   });
+  274 | });
+  275 | 
+```
\ No newline at end of file
diff --git a/app-instance/frontend/test-results/market-settings-qa-marketp-f6b19-ow-or-visible-small-targets/error-context.md b/app-instance/frontend/test-results/market-settings-qa-marketp-f6b19-ow-or-visible-small-targets/error-context.md
new file mode 100644
index 0000000..7db0348
--- /dev/null
+++ b/app-instance/frontend/test-results/market-settings-qa-marketp-f6b19-ow-or-visible-small-targets/error-context.md
@@ -0,0 +1,260 @@
+# Instructions
+
+- Following Playwright test failed.
+- Explain why, be concise, respect Playwright best practices.
+- Provide a snippet of code with the fix, if possible.
+
+# Test info
+
+- Name: market-settings-qa.spec.js >> marketplace and settings QA >> responsive layouts have no page overflow or visible small targets
+- Location: ../../../../../../tmp/beaver-market-settings-qa/market-settings-qa.spec.js:241:3
+
+# Error details
+
+```
+TimeoutError: locator.click: Timeout 8000ms exceeded.
+Call log:
+  - waiting for getByRole('button', { name: /Telegram/ })
+
+```
+
+# Page snapshot
+
+```yaml
+- generic [active] [ref=e1]:
+  - generic [ref=e2]:
+    - banner [ref=e3]:
+      - generic [ref=e5]:
+        - button "Open navigation" [ref=e7] [cursor=pointer]:
+          - img [ref=e8]
+        - generic [ref=e10]:
+          - generic [ref=e11]:
+            - img [ref=e12]
+            - button "ZH" [ref=e16] [cursor=pointer]
+            - button "EN" [ref=e17] [cursor=pointer]
+          - button "Open account menu" [ref=e18] [cursor=pointer]:
+            - generic [ref=e20]: U
+    - main [ref=e21]:
+      - generic [ref=e22]:
+        - generic [ref=e23]:
+          - generic [ref=e24]:
+            - heading "Settings" [level=1] [ref=e25]
+            - paragraph [ref=e26]: Manage models, tools, integrations, and instance runtime status. Tasks and notifications stay in their own pages.
+          - button "Refresh" [ref=e27] [cursor=pointer]:
+            - img [ref=e28]
+            - text: Refresh
+        - generic [ref=e33]:
+          - heading "Instance runtime" [level=3] [ref=e35]:
+            - img [ref=e36]
+            - text: Instance runtime
+          - generic [ref=e39]:
+            - generic [ref=e40]:
+              - generic [ref=e41]:
+                - paragraph [ref=e42]: Runtime and debugging
+                - paragraph [ref=e43]: Inspect per-chat runtime logs and current instance status.
+              - generic [ref=e44]:
+                - link "Runtime Logs" [ref=e45] [cursor=pointer]:
+                  - /url: /logs
+                  - img [ref=e46]
+                  - text: Runtime Logs
+                - button "Restart instance" [ref=e49] [cursor=pointer]:
+                  - img [ref=e50]
+                  - text: Restart instance
+            - generic [ref=e55]:
+              - generic [ref=e56]:
+                - generic [ref=e57]: Config file
+                - code [ref=e59]: /home/ivan/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/config/beaver.yml
+              - generic [ref=e60]:
+                - generic [ref=e61]: Workspace
+                - code [ref=e63]: /home/ivan/very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789/workspace
+        - generic [ref=e64]:
+          - heading "Agent configuration" [level=3] [ref=e66]:
+            - img [ref=e67]
+            - text: Agent configuration
+          - generic [ref=e70]:
+            - generic [ref=e71]:
+              - generic [ref=e72]: Model
+              - code [ref=e74]: qwen-very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789
+            - generic [ref=e75]:
+              - generic [ref=e76]:
+                - generic [ref=e77]: Max tokens
+                - textbox "Max tokens" [ref=e78]:
+                  - /placeholder: Model default
+                  - text: "4096"
+              - generic [ref=e79]:
+                - generic [ref=e80]: Temperature
+                - textbox "Temperature" [ref=e81]: "0.2"
+              - generic [ref=e82]:
+                - generic [ref=e83]: Max tool iterations
+                - textbox "Max tool iterations" [ref=e84]: "30"
+            - button "Save agent config" [ref=e86] [cursor=pointer]
+        - generic [ref=e87]:
+          - heading "Providers" [level=3] [ref=e89]:
+            - img [ref=e90]
+            - text: Providers
+          - generic [ref=e95]:
+            - button "OpenAI very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789 Current default sk-********" [ref=e96] [cursor=pointer]:
+              - generic [ref=e97]:
+                - generic [ref=e98]:
+                  - img [ref=e99]
+                  - generic [ref=e102]: OpenAI very-long-ui-token-0123456789abcdefghijklmnopqrstuvwxyz-0123456789
+                - generic [ref=e103]: Current default
+                - generic [ref=e104]: sk-********
+              - img [ref=e105]
+            - button "DeepSeek Click to configure" [ref=e108] [cursor=pointer]:
+              - generic [ref=e109]:
+                - generic [ref=e110]:
+                  - img [ref=e111]
+                  - generic [ref=e115]: DeepSeek
+                - generic [ref=e116]: Click to configure
+              - img [ref=e117]
+        - generic [ref=e120]:
+          - heading "Channels" [level=3] [ref=e122]:
+            - img [ref=e123]
+            - text: Channels
+          - generic [ref=e131]:
+            - button "Weixin QR Connect" [ref=e132] [cursor=pointer]:
+              - generic [ref=e133]:
+                - generic [ref=e134]:
+                  - img [ref=e135]
+                  - generic [ref=e141]: Weixin
+                - generic [ref=e142]: QR
+              - generic [ref=e143]: Connect
+            - button "Feishu/Lark plugin Connect" [ref=e144] [cursor=pointer]:
+              - generic [ref=e145]:
+                - generic [ref=e146]:
+                  - img [ref=e147]
+                  - generic [ref=e153]: Feishu/Lark
+                - generic [ref=e154]: plugin
+              - generic [ref=e155]: Connect
+            - button "Terminal Local terminal connection Connection instructions Guide" [ref=e156] [cursor=pointer]:
+              - generic [ref=e157]:
+                - generic [ref=e158]:
+                  - img [ref=e159]
+                  - generic [ref=e165]: Terminal
+                - generic [ref=e166]: Local terminal connection
+                - generic [ref=e167]: Connection instructions
+              - generic [ref=e168]: Guide
+  - alert [ref=e169]
+```
+
+# Test source
+
+```ts
+  161 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify([{ connection_id: `conn-${LONG}`, channel_id: `telegram-${LONG}`, kind: 'telegram', mode: 'polling', display_name: 'Telegram', account_id: `bot-${LONG}`, status: 'connected', auth_type: 'token' }]) });
+  162 |   });
+  163 |   await page.route('**/api/runtime/restart', async (route) => {
+  164 |     callLog.push({ method: route.request().method(), url: route.request().url() });
+  165 |     await route.fulfill({ status: 200, contentType: 'application/json', body: JSON.stringify({ ok: true }) });
+  166 |   });
+  167 | }
+  168 | 
+  169 | async function collectMetrics(page) {
+  170 |   return await page.evaluate(() => {
+  171 |     const viewportWidth = window.innerWidth;
+  172 |     const bodyWidth = document.body.scrollWidth;
+  173 |     const docWidth = document.documentElement.scrollWidth;
+  174 |     const overflowElements = Array.from(document.querySelectorAll('body *')).map((el) => {
+  175 |       const rect = el.getBoundingClientRect();
+  176 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || '').trim().slice(0, 100), left: rect.left, right: rect.right, width: rect.width, className: String(el.className || '') };
+  177 |     }).filter((item) => item.width > 1 && (item.left < -1 || item.right > viewportWidth + 1)).slice(0, 30);
+  178 |     const smallTargets = Array.from(document.querySelectorAll('button, a, input:not([type=hidden]), textarea, [role="button"], [role="switch"], [role="combobox"], [role="tab"]')).map((el) => {
+  179 |       const rect = el.getBoundingClientRect();
+  180 |       const style = window.getComputedStyle(el);
+  181 |       return { tag: el.tagName, text: (el.textContent || el.getAttribute('aria-label') || el.getAttribute('title') || '').trim().slice(0, 100), width: Math.round(rect.width), height: Math.round(rect.height), visible: style.visibility !== 'hidden' && style.display !== 'none' && Number(style.opacity) > 0.01 && rect.width > 0 && rect.height > 0 };
+  182 |     }).filter((item) => item.visible && (item.width < 44 || item.height < 44)).slice(0, 30);
+  183 |     return { viewportWidth, bodyWidth, docWidth, horizontalOverflow: Math.max(bodyWidth, docWidth) > viewportWidth + 1, overflowElements, smallTargets };
+  184 |   });
+  185 | }
+  186 | 
+  187 | test.describe('marketplace and settings QA', () => {
+  188 |   test('marketplace search detail file install flow works', async ({ page }) => {
+  189 |     await page.setViewportSize({ width: 390, height: 844 });
+  190 |     await installRoutes(page);
+  191 |     await page.goto(`${APP}/marketplace`);
+  192 |     await expect(page.getByPlaceholder(/搜索技能|Search skills/)).toBeVisible();
+  193 |     await page.getByPlaceholder(/搜索技能|Search skills/).fill('qa');
+  194 |     await page.getByRole('button', { name: /搜索|Search/ }).click();
+  195 |     await page.getByText(/SkillHub very-long-ui-token/).click();
+  196 |     await expect(page.getByRole('heading', { name: /SkillHub very-long-ui-token/ })).toBeVisible();
+  197 |     await page.getByRole('tab', { name: /文件|Files/ }).click();
+  198 |     await page.getByRole('button', { name: /src\/very-long-ui-token/ }).click();
+  199 |     await expect(page.getByText(/src\/very-long-ui-token/)).toBeVisible();
+  200 |     await page.getByRole('button', { name: /安装|Install/ }).click();
+  201 |     await expect.poll(() => callLog.some((call) => call.url.includes('/install') && call.method === 'POST')).toBe(true);
+  202 |     await page.screenshot({ path: path.join(SHOT_DIR, 'market-detail-390x844.png'), fullPage: true });
+  203 |   });
+  204 | 
+  205 |   test('settings agent provider channel and restart flows work', async ({ page }) => {
+  206 |     await page.setViewportSize({ width: 390, height: 844 });
+  207 |     await installRoutes(page);
+  208 |     await page.goto(`${APP}/settings`);
+  209 |     await expect(page.getByRole('heading', { name: /配置|Settings/ })).toBeVisible();
+  210 |     await page.getByLabel(/温度|Temperature/).fill('0.3');
+  211 |     await page.getByRole('button', { name: /保存智能体配置|Save agent config/ }).click();
+  212 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/agent/config') && call.method !== 'GET')).toBe(true);
+  213 |     await page.getByRole('button', { name: /OpenAI/ }).click();
+  214 |     await expect(page.getByRole('dialog')).toBeVisible();
+  215 |     await page.getByLabel(/请求超时|Request timeout/).fill('60');
+  216 |     await page.getByRole('button', { name: /保存|Save/ }).click();
+  217 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/providers/openai/config'))).toBe(true);
+  218 |     await page.getByRole('button', { name: /Telegram/ }).click();
+  219 |     await expect(page.getByRole('dialog')).toBeVisible();
+  220 |     await page.getByLabel(/显示名|Display name/).fill(`Telegram ${LONG}`);
+  221 |     await page.getByRole('button', { name: /保存通道配置|Save channel config/ }).click();
+  222 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/channels/') && call.method !== 'GET')).toBe(true);
+  223 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-channel-390x844.png'), fullPage: true });
+  224 |     await page.keyboard.press('Escape');
+  225 |     await page.getByRole('button', { name: /重启实例|Restart instance/ }).first().click();
+  226 |     await expect(page.getByRole('dialog')).toBeVisible();
+  227 |     await page.getByRole('button', { name: /^重启$|^Restart$/ }).click();
+  228 |     await expect.poll(() => callLog.some((call) => call.url.includes('/api/runtime/restart'))).toBe(true);
+  229 |   });
+  230 | 
+  231 |   test('settings error state is readable', async ({ page }) => {
+  232 |     await page.setViewportSize({ width: 390, height: 844 });
+  233 |     await installRoutes(page, { statusError: true });
+  234 |     await page.goto(`${APP}/settings`);
+  235 |     await expect(page.getByText(/QA status error|无法连接|Unable to connect/)).toBeVisible();
+  236 |     await page.screenshot({ path: path.join(SHOT_DIR, 'settings-error-390x844.png'), fullPage: true });
+  237 |     const metrics = await collectMetrics(page);
+  238 |     expect(metrics.horizontalOverflow, JSON.stringify(metrics.overflowElements, null, 2)).toBe(false);
+  239 |   });
+  240 | 
+  241 |   test('responsive layouts have no page overflow or visible small targets', async ({ browser }) => {
+  242 |     const results = [];
+  243 |     for (const viewport of [
+  244 |       { width: 320, height: 568 },
+  245 |       { width: 390, height: 844 },
+  246 |       { width: 844, height: 390 },
+  247 |       { width: 768, height: 1024 },
+  248 |       { width: 1365, height: 900 },
+  249 |     ]) {
+  250 |       const market = await browser.newPage({ viewport });
+  251 |       await installRoutes(market);
+  252 |       await market.goto(`${APP}/marketplace`);
+  253 |       await market.getByText(/SkillHub very-long-ui-token/).click();
+  254 |       await market.screenshot({ path: path.join(SHOT_DIR, `market-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  255 |       const marketMetrics = await collectMetrics(market);
+  256 |       await market.close();
+  257 | 
+  258 |       const settings = await browser.newPage({ viewport });
+  259 |       await installRoutes(settings);
+  260 |       await settings.goto(`${APP}/settings`);
+> 261 |       await settings.getByRole('button', { name: /Telegram/ }).click();
+      |                                                                ^ TimeoutError: locator.click: Timeout 8000ms exceeded.
+  262 |       await settings.screenshot({ path: path.join(SHOT_DIR, `settings-${viewport.width}x${viewport.height}.png`), fullPage: true });
+  263 |       const settingsMetrics = await collectMetrics(settings);
+  264 |       await settings.close();
+  265 | 
+  266 |       results.push({ viewport, marketMetrics, settingsMetrics });
+  267 |       expect(marketMetrics.horizontalOverflow, JSON.stringify(marketMetrics.overflowElements, null, 2)).toBe(false);
+  268 |       expect(settingsMetrics.horizontalOverflow, JSON.stringify(settingsMetrics.overflowElements, null, 2)).toBe(false);
+  269 |       expect(marketMetrics.smallTargets, JSON.stringify(marketMetrics.smallTargets, null, 2)).toEqual([]);
+  270 |       expect(settingsMetrics.smallTargets, JSON.stringify(settingsMetrics.smallTargets, null, 2)).toEqual([]);
+  271 |     }
+  272 |     fs.writeFileSync(REPORT, JSON.stringify({ results }, null, 2));
+  273 |   });
+  274 | });
+  275 | 
+```
\ No newline at end of file
diff --git a/auth-portal/src/app/globals.css b/auth-portal/src/app/globals.css
index 5e78e62..a494104 100644
--- a/auth-portal/src/app/globals.css
+++ b/auth-portal/src/app/globals.css
@@ -31,6 +31,7 @@ html,
 body {
   margin: 0;
   min-height: 100%;
+  overflow-x: hidden;
 }
 
 body {
@@ -56,7 +57,7 @@ select {
 
 .portal-page {
   position: relative;
-  min-height: 100vh;
+  min-height: 100dvh;
   display: grid;
   place-items: center;
   padding: 32px;
@@ -68,7 +69,7 @@ select {
 
 .auth-page {
   width: 100%;
-  min-height: 100vh;
+  min-height: 100dvh;
   display: flex;
   align-items: center;
   justify-content: flex-end;
@@ -122,11 +123,11 @@ select {
 
 .ghost-icon-button {
   position: absolute;
-  right: 18px;
+  right: 10px;
   top: 50%;
   z-index: 2;
-  width: 30px;
-  height: 30px;
+  width: 44px;
+  height: 44px;
   padding: 0;
   border: 0;
   color: #a29d99;
@@ -203,6 +204,9 @@ select {
 
 .login-footer a {
   justify-self: start;
+  min-height: 44px;
+  display: inline-flex;
+  align-items: center;
 }
 
 .portal-toolbar {
@@ -234,8 +238,8 @@ select {
 }
 
 .language-switcher button {
-  min-width: 34px;
-  height: 28px;
+  min-width: 44px;
+  min-height: 44px;
   border: 0;
   border-radius: 999px;
   color: var(--zinc-600);
@@ -524,7 +528,7 @@ select {
 
 .auth-page .auth-card.login-card {
   width: 100%;
-  max-height: calc(100vh - clamp(48px, 10vh, 112px));
+  max-height: calc(100dvh - clamp(48px, 10vh, 112px));
   padding: clamp(30px, 5vh, 54px) clamp(24px, 3.2vw, 44px) clamp(26px, 4vh, 40px);
   display: flex;
   flex-direction: column;
@@ -578,6 +582,14 @@ select {
   display: block;
 }
 
+.auth-page .login-field-label {
+  display: block;
+  margin-bottom: 8px;
+  color: var(--zinc-600);
+  font-size: 13px;
+  font-weight: 700;
+}
+
 .auth-page .login-field input,
 .auth-page .login-field select {
   min-height: clamp(50px, 6vh, 60px);
@@ -680,7 +692,7 @@ select {
   .auth-page .auth-card.login-card {
     min-height: auto;
     padding: 34px 22px 28px;
-    max-height: calc(100vh - 104px);
+    max-height: calc(100dvh - 104px);
   }
 
   .auth-page .login-logo {
@@ -722,3 +734,134 @@ select {
     padding: 24px 20px;
   }
 }
+
+@media (max-width: 640px) and (max-height: 700px) {
+  .auth-page {
+    padding: 76px 16px 12px;
+  }
+
+  .auth-page .auth-card.login-card {
+    max-height: calc(100dvh - 88px);
+    padding: 20px 22px 18px;
+  }
+
+  .auth-page .login-logo {
+    width: 58px;
+    margin-bottom: 10px;
+  }
+
+  .auth-page .auth-card.login-card h1 {
+    margin-bottom: 14px;
+    font-size: 23px;
+  }
+
+  .auth-page .login-card .auth-form {
+    gap: 8px;
+  }
+
+  .auth-page .login-field-label {
+    margin-bottom: 4px;
+    font-size: 12px;
+  }
+
+  .auth-page .login-field input,
+  .auth-page .login-field select {
+    min-height: 46px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+  }
+
+  .auth-page .login-card .primary-button {
+    min-height: 48px;
+  }
+
+  .auth-page .login-card .error-text {
+    min-height: 18px;
+  }
+
+  .auth-page .login-divider {
+    margin: 12px 0 8px;
+    font-size: 13px;
+  }
+
+  .auth-page .login-footer {
+    margin-top: 0;
+    font-size: 13px;
+  }
+}
+
+@media (max-height: 520px) and (orientation: landscape) {
+  .portal-page {
+    display: block;
+    min-height: 100dvh;
+    overflow-y: auto;
+  }
+
+  .auth-page {
+    min-height: 100dvh;
+    align-items: flex-start;
+    justify-content: center;
+    padding: 52px 16px 6px;
+  }
+
+  .auth-page .portal-panel {
+    width: min(480px, 100%);
+  }
+
+  .auth-page .auth-card.login-card {
+    max-height: calc(100dvh - 64px);
+    padding: 12px 22px 10px;
+    overflow: visible;
+  }
+
+  .auth-page .login-logo {
+    width: 34px;
+    margin-bottom: 2px;
+  }
+
+  .auth-page .auth-card.login-card h1 {
+    margin-bottom: 4px;
+    font-size: 20px;
+  }
+
+  .auth-page .login-card .auth-form {
+    gap: 4px;
+  }
+
+  .auth-page .login-field-label {
+    margin-bottom: 2px;
+    font-size: 11px;
+  }
+
+  .auth-page .login-field input,
+  .auth-page .login-field select {
+    min-height: 44px;
+    padding-top: 8px;
+    padding-bottom: 8px;
+  }
+
+  .auth-page .login-card .error-text {
+    min-height: 14px;
+    font-size: 12px;
+  }
+
+  .auth-page .login-card .primary-button {
+    min-height: 44px;
+    padding-top: 8px;
+    padding-bottom: 8px;
+  }
+
+  .auth-page .login-divider {
+    margin: 6px 0 4px;
+    font-size: 12px;
+  }
+
+  .auth-page .login-footer {
+    margin-top: 0;
+    font-size: 12px;
+  }
+
+  .portal-toolbar {
+    top: 8px;
+  }
+}
diff --git a/auth-portal/src/app/login/page.tsx b/auth-portal/src/app/login/page.tsx
index a2f15f5..917500f 100644
--- a/auth-portal/src/app/login/page.tsx
+++ b/auth-portal/src/app/login/page.tsx
@@ -3,7 +3,7 @@
 import Image from 'next/image';
 import Link from 'next/link';
 import { useSearchParams } from 'next/navigation';
-import { useState } from 'react';
+import { useRef, useState } from 'react';
 
 import { LanguageSwitcher } from '@/components/LanguageSwitcher';
 import { buildFrontendHandoffUrl, login, withNext } from '@/lib/auth-client';
@@ -20,6 +20,7 @@ export default function LoginPage() {
   const [showPassword, setShowPassword] = useState(false);
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState('');
+  const errorRef = useRef<HTMLDivElement>(null);
 
   const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {
     event.preventDefault();
@@ -30,7 +31,14 @@ export default function LoginPage() {
       const response = await login(username, password);
       window.location.replace(buildFrontendHandoffUrl(response, nextPath));
     } catch (err) {
-      setError(err instanceof Error ? err.message : pickPortalText(locale, '登录失败，请稍后重试', 'Sign-in failed. Please try again.'));
+      const rawMessage = err instanceof Error ? err.message : '';
+      const friendlyMessage = /401|Invalid credentials|用户名或密码/.test(rawMessage)
+        ? pickPortalText(locale, '用户名或密码错误，请检查后重试。', 'Username or password is incorrect. Please check and try again.')
+        : pickPortalText(locale, '登录失败，请稍后重试。', 'Sign-in failed. Please try again.');
+      setError(friendlyMessage);
+      window.requestAnimationFrame(() => {
+        errorRef.current?.focus();
+      });
     } finally {
       setLoading(false);
     }
@@ -56,7 +64,7 @@ export default function LoginPage() {
 
             <form className="auth-form" onSubmit={handleSubmit}>
               <div className="field login-field">
-                <label className="visually-hidden" htmlFor="username">{pickPortalText(locale, '用户名', 'Username')}</label>
+                <label className="login-field-label" htmlFor="username">{pickPortalText(locale, '用户名', 'Username')}</label>
                 <UserIcon />
                 <input
                   id="username"
@@ -69,7 +77,7 @@ export default function LoginPage() {
               </div>
 
               <div className="field login-field">
-                <label className="visually-hidden" htmlFor="password">{pickPortalText(locale, '密码', 'Password')}</label>
+                <label className="login-field-label" htmlFor="password">{pickPortalText(locale, '密码', 'Password')}</label>
                 <LockIcon />
                 <input
                   id="password"
@@ -90,9 +98,24 @@ export default function LoginPage() {
                 </button>
               </div>
 
-              <div className="error-text">{error}</div>
+              <div
+                ref={errorRef}
+                className="error-text"
+                role={error ? 'alert' : undefined}
+                aria-live="polite"
+                tabIndex={error ? -1 : undefined}
+              >
+                {error}
+              </div>
 
-              <button className="primary-button" type="submit" disabled={loading}>
+              <button
+                className="primary-button"
+                type="submit"
+                disabled={loading}
+                aria-label={loading
+                  ? pickPortalText(locale, '登录中', 'Signing in')
+                  : pickPortalText(locale, '登录', 'Sign in')}
+              >
                 {loading
                   ? pickPortalText(locale, '登录中...', 'Signing in...')
                   : <ArrowRightIcon />}
diff --git a/auth-portal/src/test-results/.last-run.json b/auth-portal/src/test-results/.last-run.json
new file mode 100644
index 0000000..5fca3f8
--- /dev/null
+++ b/auth-portal/src/test-results/.last-run.json
@@ -0,0 +1,4 @@
+{
+  "status": "failed",
+  "failedTests": []
+}
\ No newline at end of file
diff --git a/authz-service/.env.example b/authz-service/.env.example
index 3b51954..edde058 100644
--- a/authz-service/.env.example
+++ b/authz-service/.env.example
@@ -7,3 +7,12 @@ AUTHZ_UPSTREAM_TIMEOUT_SECONDS=15
 
 DEPLOY_API_BASE_URL=http://beaver-deploy-control:8090
 DEPLOY_API_TOKEN=change-me
+
+# User file system MinIO provisioning.
+USER_FILES_MINIO_PROVISIONING_ENABLED=1
+USER_FILES_MINIO_ENDPOINT=minio:9000
+USER_FILES_MINIO_PUBLIC_ENDPOINT=minio:9000
+USER_FILES_MINIO_ADMIN_ACCESS_KEY=change-me
+USER_FILES_MINIO_ADMIN_SECRET_KEY=change-me
+USER_FILES_MINIO_BUCKET=beaver-user-files
+USER_FILES_MINIO_SECURE=0
diff --git a/authz-service/runtime/seed-data/backend_credentials.json b/authz-service/runtime/seed-data/backend_credentials.json
index 4da0675..8302941 100644
--- a/authz-service/runtime/seed-data/backend_credentials.json
+++ b/authz-service/runtime/seed-data/backend_credentials.json
@@ -1,3 +1,3 @@
 {
-  "credentials": []
+  "credentials": {}
 }
diff --git a/deploy-control/.env.example b/deploy-control/.env.example
index 3d5f8a9..f22b2d2 100644
--- a/deploy-control/.env.example
+++ b/deploy-control/.env.example
@@ -16,6 +16,11 @@ APP_INSTANCE_API_BASE=
 DEFAULT_AUTHZ_BASE_URL=http://beaver-authz-service:19090
 DEFAULT_AUTHZ_OUTLOOK_MCP_URL=
 DEFAULT_OUTLOOK_MCP_SERVER_ID=outlook_mcp
+DEFAULT_USER_FILES_MAX_UPLOAD_BYTES=5368709120
+DEFAULT_EXTERNAL_CONNECTOR_BASE_URL=http://external-connector:8787
+DEFAULT_EXTERNAL_CONNECTOR_TOKEN=
+DEFAULT_BEAVER_BRIDGE_TOKEN=
+DEFAULT_INITIAL_SKILLS_DIR=/home/ivan/xuan/beaver_project/skills
 
 DEPLOY_PUBLIC_SCHEME=http
 DEPLOY_PUBLIC_BASE_DOMAIN=localhost
diff --git a/deploy-control/README.md b/deploy-control/README.md
index 6766075..cbc8d88 100644
--- a/deploy-control/README.md
+++ b/deploy-control/README.md
@@ -60,8 +60,9 @@ uv run server.py
 - Docker socket：`/var/run/docker.sock`
 - `/home/ivan/xuan/beaver_project/app-instance`
 - `/home/ivan/xuan/beaver_project/router-proxy`
+- `/home/ivan/xuan/beaver_project/skills`
 
-并传入对应环境变量，让容器内脚本路径仍能访问这两个目录。
+并传入对应环境变量，让容器内脚本路径仍能访问这些目录。
 
 关键点：
 
@@ -79,14 +80,16 @@ docker run -d \
   -v /var/run/docker.sock:/var/run/docker.sock \
   -v /home/ivan/xuan/beaver_project/app-instance:/home/ivan/xuan/beaver_project/app-instance \
   -v /home/ivan/xuan/beaver_project/router-proxy:/home/ivan/xuan/beaver_project/router-proxy \
+  -v /home/ivan/xuan/beaver_project/skills:/home/ivan/xuan/beaver_project/skills:ro \
   -e APP_INSTANCE_DIR=/home/ivan/xuan/beaver_project/app-instance \
   -e ROUTER_PROXY_DIR=/home/ivan/xuan/beaver_project/router-proxy \
+  -e DEFAULT_INITIAL_SKILLS_DIR=/home/ivan/xuan/beaver_project/skills \
   -e DEPLOY_CONTROL_API_TOKEN=change-me \
   -e APP_INSTANCE_IMAGE=beaver/app-instance:latest \
   -e APP_INSTANCE_NETWORK_NAME=beaver-instance-edge \
   beaver/deploy-control:latest
 ```
 
-如果这里错把宿主机目录映射成容器内的另一个短路径，例如 `/app-instance`，那么 `deploy-control` 通过 Docker socket 创建实例时会把错误路径传给 Docker，最终导致实例容器拿不到 `config.json` 并持续重启。
+如果这里错把宿主机目录映射成容器内的另一个短路径，例如 `/app-instance`，那么 `deploy-control` 通过 Docker socket 创建实例时会把错误路径传给 Docker，最终导致实例容器拿不到 `config.json` 并持续重启。`skills` 目录也必须挂载到同一个绝对路径；否则新实例第一次创建时不会在 workspace 里种入初始 skills。
 
 新实例注册时不会写入模型 provider/API key。注册后由 `auth-portal` 引导页调用 `POST /api/instances/configure-provider`，在用户确认后写入该实例配置并重启实例容器。
diff --git a/deploy-control/server.py b/deploy-control/server.py
index 86aded9..b016dc7 100755
--- a/deploy-control/server.py
+++ b/deploy-control/server.py
@@ -42,6 +42,13 @@ DEFAULT_AUTHZ_INTERNAL_TOKEN = os.environ.get("DEFAULT_AUTHZ_INTERNAL_TOKEN", ""
 DEFAULT_AUTHZ_OUTLOOK_MCP_URL = os.environ.get("DEFAULT_AUTHZ_OUTLOOK_MCP_URL", "").strip()
 DEFAULT_OUTLOOK_MCP_SERVER_ID = os.environ.get("DEFAULT_OUTLOOK_MCP_SERVER_ID", "outlook_mcp").strip() or "outlook_mcp"
 DEFAULT_USER_FILES_MAX_UPLOAD_BYTES = os.environ.get("DEFAULT_USER_FILES_MAX_UPLOAD_BYTES", "").strip()
+DEFAULT_EXTERNAL_CONNECTOR_BASE_URL = os.environ.get(
+    "DEFAULT_EXTERNAL_CONNECTOR_BASE_URL",
+    "http://external-connector:8787",
+).strip()
+DEFAULT_EXTERNAL_CONNECTOR_TOKEN = os.environ.get("DEFAULT_EXTERNAL_CONNECTOR_TOKEN", "").strip()
+DEFAULT_BEAVER_BRIDGE_TOKEN = os.environ.get("DEFAULT_BEAVER_BRIDGE_TOKEN", "").strip()
+DEFAULT_INITIAL_SKILLS_DIR = os.environ.get("DEFAULT_INITIAL_SKILLS_DIR", str(APP_INSTANCE_DIR.parent / "skills")).strip()
 PUBLIC_SCHEME = os.environ.get("DEPLOY_PUBLIC_SCHEME", "http").strip() or "http"
 PUBLIC_BASE_DOMAIN = os.environ.get("DEPLOY_PUBLIC_BASE_DOMAIN", "localhost").strip()
 PUBLIC_HOST_TEMPLATE = os.environ.get("DEPLOY_PUBLIC_HOST_TEMPLATE", "{slug}.{base_domain}").strip()
@@ -274,6 +281,14 @@ def create_or_get_instance(payload: dict[str, Any]) -> dict[str, Any]:
             command.extend(["--outlook-mcp-server-id", DEFAULT_OUTLOOK_MCP_SERVER_ID])
         if DEFAULT_USER_FILES_MAX_UPLOAD_BYTES:
             command.extend(["--user-files-max-upload-bytes", DEFAULT_USER_FILES_MAX_UPLOAD_BYTES])
+        if DEFAULT_EXTERNAL_CONNECTOR_BASE_URL:
+            command.extend(["--external-connector-base-url", DEFAULT_EXTERNAL_CONNECTOR_BASE_URL])
+        if DEFAULT_EXTERNAL_CONNECTOR_TOKEN:
+            command.extend(["--external-connector-token", DEFAULT_EXTERNAL_CONNECTOR_TOKEN])
+        if DEFAULT_BEAVER_BRIDGE_TOKEN:
+            command.extend(["--bridge-token", DEFAULT_BEAVER_BRIDGE_TOKEN])
+        if DEFAULT_INITIAL_SKILLS_DIR:
+            command.extend(["--initial-skills-dir", DEFAULT_INITIAL_SKILLS_DIR])
         if payload.get("replace") is True:
             command.append("--replace")
 
diff --git a/deploy-control/tests/test_connector_instance_config.py b/deploy-control/tests/test_connector_instance_config.py
new file mode 100644
index 0000000..50ce122
--- /dev/null
+++ b/deploy-control/tests/test_connector_instance_config.py
@@ -0,0 +1,58 @@
+from __future__ import annotations
+
+import importlib.util
+from pathlib import Path
+from typing import Any
+
+
+SERVER_PATH = Path(__file__).resolve().parents[1] / "server.py"
+
+
+def _load_server_module():
+    spec = importlib.util.spec_from_file_location("deploy_control_server_connector_tests", SERVER_PATH)
+    assert spec and spec.loader
+    module = importlib.util.module_from_spec(spec)
+    spec.loader.exec_module(module)
+    return module
+
+
+def test_new_instance_receives_external_connector_configuration(monkeypatch) -> None:
+    server = _load_server_module()
+    commands: list[list[str]] = []
+    record: dict[str, Any] = {
+        "instance_id": "terminaltest",
+        "container_name": "app-instance-terminaltest",
+        "host_port": 20001,
+        "public_url": "http://terminaltest.example.test",
+    }
+    lookups = iter([None, None, record])
+
+    monkeypatch.setattr(server, "get_registry_record", lambda **_kwargs: next(lookups))
+    monkeypatch.setattr(server, "ensure_network", lambda: None)
+    monkeypatch.setattr(server, "ensure_proxy", lambda: None)
+    monkeypatch.setattr(server, "wait_for_backend", lambda _record: None)
+    monkeypatch.setattr(server, "DEFAULT_EXTERNAL_CONNECTOR_BASE_URL", "http://external-connector:8787")
+    monkeypatch.setattr(server, "DEFAULT_EXTERNAL_CONNECTOR_TOKEN", "connector-token")
+    monkeypatch.setattr(server, "DEFAULT_BEAVER_BRIDGE_TOKEN", "bridge-token")
+    monkeypatch.setattr(server, "DEFAULT_INITIAL_SKILLS_DIR", "/srv/beaver/skills")
+
+    def capture_command(args: list[str], **_kwargs: Any) -> str:
+        commands.append(args)
+        return ""
+
+    monkeypatch.setattr(server, "run_command", capture_command)
+
+    result = server.create_or_get_instance(
+        {
+            "username": "terminaltest",
+            "password": "secret",
+            "instance_id": "terminaltest",
+        }
+    )
+
+    command = commands[0]
+    assert command[command.index("--external-connector-base-url") + 1] == "http://external-connector:8787"
+    assert command[command.index("--external-connector-token") + 1] == "connector-token"
+    assert command[command.index("--bridge-token") + 1] == "bridge-token"
+    assert command[command.index("--initial-skills-dir") + 1] == "/srv/beaver/skills"
+    assert result["created"] is True
diff --git a/docker-compose.external-connectors.yml b/docker-compose.external-connectors.yml
index 8bc6d59..64436a1 100644
--- a/docker-compose.external-connectors.yml
+++ b/docker-compose.external-connectors.yml
@@ -5,11 +5,11 @@ services:
     restart: unless-stopped
     environment:
       BEAVER_BRIDGE_BASE_URL: ${BEAVER_BRIDGE_BASE_URL:-http://app-instance:8080}
-      BEAVER_BRIDGE_TOKEN: ${BEAVER_BRIDGE_TOKEN}
-      CONNECTOR_API_TOKEN: ${EXTERNAL_CONNECTOR_TOKEN}
+      BEAVER_BRIDGE_TOKEN: ${BEAVER_BRIDGE_TOKEN:?BEAVER_BRIDGE_TOKEN is required}
+      CONNECTOR_API_TOKEN: ${EXTERNAL_CONNECTOR_TOKEN:?EXTERNAL_CONNECTOR_TOKEN is required}
       CONNECTOR_HOME: /var/lib/external-connector
       CONNECTOR_PUBLIC_BASE_URL: ${CONNECTOR_PUBLIC_BASE_URL:-http://localhost:8787}
-      CONNECTOR_PROVIDER: ${CONNECTOR_PROVIDER:-vendor_cli}
+      CONNECTOR_PROVIDER: ${CONNECTOR_PROVIDER:-official}
       CONNECTOR_COMMAND_TIMEOUT_SECONDS: ${CONNECTOR_COMMAND_TIMEOUT_SECONDS:-120}
       WEIXIN_CONNECT_COMMAND: ${WEIXIN_CONNECT_COMMAND:-}
       WEIXIN_STATUS_COMMAND: ${WEIXIN_STATUS_COMMAND:-}
diff --git a/docs/superpowers/plans/2026-06-04-auto-accept-on-new-topic.md b/docs/superpowers/plans/2026-06-04-auto-accept-on-new-topic.md
new file mode 100644
index 0000000..af35c60
--- /dev/null
+++ b/docs/superpowers/plans/2026-06-04-auto-accept-on-new-topic.md
@@ -0,0 +1,73 @@
+# Auto-Accept on New Topic Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Silently accept an awaiting Task before processing an unrelated new topic.
+
+**Architecture:** Keep the existing Intent Agent actions. Treat `simple_chat` and `new_task` decisions made while a Task is active as new-topic boundaries, reuse `submit_acceptance()` for the old Task's latest run, and then continue the original routing decision.
+
+**Tech Stack:** Python, pytest, Beaver TaskService and AgentService
+
+---
+
+### Task 1: Lock the State Transition with Tests
+
+**Files:**
+- Modify: `app-instance/backend/tests/unit/test_task_mode_feedback.py`
+
+- [ ] Add a failing test proving an unrelated `simple_chat` message formally accepts the previous Task and does not append another run to it.
+- [ ] Add a failing test proving `new_task` formally accepts the previous Task before creating a separate Task.
+- [ ] Add tests proving `continue_task` and `revise_task` retain the existing active Task behavior.
+- [ ] Run:
+
+```bash
+uv run pytest -q tests/unit/test_task_mode_feedback.py
+```
+
+Expected before implementation: the new-topic tests fail because the previous Task remains `awaiting_acceptance`.
+
+### Task 2: Implement New-Topic Auto-Accept
+
+**Files:**
+- Modify: `app-instance/backend/beaver/services/agent_service.py`
+
+- [ ] Add a focused async helper that accepts only an `awaiting_acceptance` Task with a latest run.
+- [ ] Call the helper after routing when the decision is `simple_chat` or starts a new Task.
+- [ ] Reuse `submit_acceptance()` so acceptance history, final accepted run, run memory, and learning behavior remain consistent.
+- [ ] Run:
+
+```bash
+uv run pytest -q tests/unit/test_task_mode_feedback.py
+```
+
+Expected: all task-mode feedback tests pass.
+
+### Task 3: Clarify Intent Routing Guidance
+
+**Files:**
+- Modify: `app-instance/backend/beaver/tasks/router.py`
+- Modify: `app-instance/backend/beaver/skills/builtin/intent-agent-router/SKILL.md`
+- Modify: `app-instance/backend/tests/unit/test_main_agent_router.py`
+
+- [ ] Assert the generated routing prompt explicitly says unrelated lightweight conversation is `simple_chat`, not `revise_task`.
+- [ ] Update both routing guidance sources with the same rule and examples.
+- [ ] Run:
+
+```bash
+uv run pytest -q tests/unit/test_main_agent_router.py
+```
+
+Expected: all router tests pass.
+
+### Task 4: Regression Verification
+
+**Files:**
+- Verify only
+
+- [ ] Run:
+
+```bash
+uv run pytest -q tests/unit/test_main_agent_router.py tests/unit/test_task_mode_feedback.py tests/unit/test_active_task_api.py tests/unit/test_process_projection.py
+```
+
+- [ ] Inspect the final diff to confirm no frontend confirmation or unrelated state changes were introduced.
diff --git a/docs/superpowers/plans/2026-06-04-chat-task-timeline-consistency.md b/docs/superpowers/plans/2026-06-04-chat-task-timeline-consistency.md
new file mode 100644
index 0000000..9b1a842
--- /dev/null
+++ b/docs/superpowers/plans/2026-06-04-chat-task-timeline-consistency.md
@@ -0,0 +1,75 @@
+# Chat Task Timeline Consistency Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Render the active Task's canonical timeline in the chat progress sidebar and hide it when no active Task exists.
+
+**Architecture:** Extract task-scoped process filtering into a shared frontend helper, use it in both Task detail and chat, and make the chat sidebar a responsive wrapper around the existing `TaskTimeline` component.
+
+**Tech Stack:** React, Next.js, TypeScript, Vitest
+
+---
+
+### Task 1: Extract Shared Task Process Selection
+
+**Files:**
+- Create: `app-instance/frontend/lib/task-process.ts`
+- Create: `app-instance/frontend/lib/task-process.test.ts`
+- Modify: `app-instance/frontend/app/(app)/tasks/[taskId]/page.tsx`
+
+- [ ] Write failing tests for merging persisted task process data with matching live process data.
+- [ ] Implement `selectTaskProcess()` returning task-scoped runs, events, and artifacts.
+- [ ] Replace the Task detail page's local filtering with the shared helper.
+- [ ] Run:
+
+```bash
+npm test -- --run lib/task-process.test.ts lib/task-timeline.test.ts
+```
+
+### Task 2: Replace Chat Progress View with Task Timeline
+
+**Files:**
+- Modify: `app-instance/frontend/components/chat-workbench/CurrentSessionProgressSidebar.tsx`
+- Modify: `app-instance/frontend/app/(app)/page.tsx`
+
+- [ ] Load full `BackendTask` detail whenever `activeTask` exists.
+- [ ] Clear full Task detail whenever active Task becomes `null` or the session changes.
+- [ ] Build chat timeline cards using `selectTaskProcess()` and `buildTaskTimelineCards()`.
+- [ ] Change `CurrentSessionProgressSidebar` to accept timeline cards and render `TaskTimeline` without acceptance controls.
+- [ ] Remove the chat page's use of `buildSessionProgressView()`.
+
+### Task 3: Add Visibility and Consistency Tests
+
+**Files:**
+- Modify: `app-instance/frontend/lib/task-process.test.ts`
+- Modify: `app-instance/frontend/lib/task-timeline.test.ts`
+- Delete if unused: `app-instance/frontend/lib/session-progress.test.ts`
+- Delete if unused: `app-instance/frontend/lib/session-progress.ts`
+
+- [ ] Cover empty/no-active input behavior in the shared helper.
+- [ ] Confirm the same Task/process input creates the same timeline cards on both surfaces.
+- [ ] Remove the obsolete session-progress builder and tests if no imports remain.
+- [ ] Run:
+
+```bash
+npm test
+```
+
+### Task 4: Frontend Verification
+
+**Files:**
+- Verify only
+
+- [ ] Run:
+
+```bash
+npm run typecheck
+npm run build
+```
+
+- [ ] Validate the rendered chat flow with Playwright because the Browser plugin is not available:
+
+```text
+chat page with active Task -> open current-session progress -> same timeline cards as Task detail
+Task closes -> current-session progress disappears
+```
diff --git a/docs/superpowers/plans/2026-06-04-initial-multi-search-engine.md b/docs/superpowers/plans/2026-06-04-initial-multi-search-engine.md
new file mode 100644
index 0000000..d15bc70
--- /dev/null
+++ b/docs/superpowers/plans/2026-06-04-initial-multi-search-engine.md
@@ -0,0 +1,104 @@
+# Initial Multi Search Engine Implementation Plan
+
+> **For agentic workers:** REQUIRED SUB-SKILL: Use superpowers:subagent-driven-development (recommended) or superpowers:executing-plans to implement this plan task-by-task. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Replace the initial `web-operation` skill with SkillHub `multi-search-engine` while keeping `web_fetch` reliably available when the skill is selected.
+
+**Architecture:** Initial skills are copied from the repository `skills/` directory into each instance workspace by `create-instance.sh` and `entrypoint.sh`. This change updates the seed catalog, not existing user workspace state.
+
+**Tech Stack:** Python skill catalog storage, JSON seed metadata, Markdown `SKILL.md`, pytest.
+
+---
+
+### Task 1: Update Initial Skill Contract
+
+**Files:**
+- Modify: `app-instance/backend/tests/unit/test_initial_skill_tool_hints.py`
+
+- [ ] **Step 1: Write the failing test**
+
+Change `EXPECTED_INITIAL_SKILL_TOOLS` so it expects:
+
+```python
+"multi-search-engine": ["web_fetch"],
+```
+
+and no longer expects:
+
+```python
+"web-operation": ["web_fetch", "web_search"],
+```
+
+- [ ] **Step 2: Run test to verify it fails**
+
+Run:
+
+```bash
+cd app-instance/backend
+pytest tests/unit/test_initial_skill_tool_hints.py -q
+```
+
+Expected: FAIL because `skills/multi-search-engine/versions/v0001/SKILL.md` does not exist yet.
+
+### Task 2: Replace Seed Skill
+
+**Files:**
+- Create: `skills/multi-search-engine/current.json`
+- Create: `skills/multi-search-engine/skill.json`
+- Create: `skills/multi-search-engine/versions/v0001/SKILL.md`
+- Create: `skills/multi-search-engine/versions/v0001/version.json`
+- Create: `skills/multi-search-engine/versions/v0001/CHANGELOG.md`
+- Create: `skills/multi-search-engine/versions/v0001/CHANNELLOG.md`
+- Create: `skills/multi-search-engine/versions/v0001/config.json`
+- Create: `skills/multi-search-engine/versions/v0001/metadata.json`
+- Create: `skills/multi-search-engine/versions/v0001/references/advanced-search.md`
+- Create: `skills/multi-search-engine/versions/v0001/references/international-search.md`
+- Modify: `skills/_index/published.json`
+
+- [ ] **Step 1: Add SkillHub content**
+
+Fetch `global/multi-search-engine@20260413.065325` from SkillHub and store it as seed version `v0001`.
+
+- [ ] **Step 2: Add tool hint**
+
+Ensure `SKILL.md` frontmatter contains:
+
+```yaml
+tools:
+  - web_fetch
+```
+
+- [ ] **Step 3: Update published index**
+
+Remove `web-operation` and add `multi-search-engine`.
+
+### Task 3: Verify
+
+**Files:**
+- Test: `app-instance/backend/tests/unit/test_initial_skill_tool_hints.py`
+
+- [ ] **Step 1: Run targeted tests**
+
+Run:
+
+```bash
+cd app-instance/backend
+pytest tests/unit/test_initial_skill_tool_hints.py tests/unit/test_marketplace_and_mcp.py -q
+```
+
+Expected: PASS.
+
+- [ ] **Step 2: Inspect seed metadata**
+
+Run:
+
+```bash
+python - <<'PY'
+import json
+from pathlib import Path
+print(json.loads(Path('skills/_index/published.json').read_text())['items'])
+print(json.loads(Path('skills/multi-search-engine/versions/v0001/version.json').read_text())['tool_hints'])
+PY
+```
+
+Expected: `multi-search-engine` is published, `web-operation` is absent, and tool hints are `["web_fetch"]`.
diff --git a/docs/superpowers/specs/2026-06-04-auto-accept-on-new-topic-design.md b/docs/superpowers/specs/2026-06-04-auto-accept-on-new-topic-design.md
new file mode 100644
index 0000000..88270e8
--- /dev/null
+++ b/docs/superpowers/specs/2026-06-04-auto-accept-on-new-topic-design.md
@@ -0,0 +1,60 @@
+# Auto-Accept Task When a New Topic Starts
+
+## Goal
+
+Prevent unrelated follow-up conversation from being appended to the previous
+Task. When the Intent Agent decides that the user's current message starts a
+new topic, Beaver should silently accept the previous Task before processing
+the current message.
+
+## User Experience
+
+- No confirmation dialog or extra assistant message is shown.
+- A related follow-up or requested change continues the existing Task.
+- An unrelated lightweight message is handled as `simple_chat`.
+- Unrelated work that needs Task capabilities is handled as `new_task`.
+- Before either new-topic path continues, the previous Task is formally
+  accepted.
+
+## Routing Rules
+
+The existing Intent Agent actions remain unchanged:
+
+- `continue_task` and `revise_task` belong to the active Task.
+- `close_task` and `abandon_task` keep their existing explicit semantics.
+- With an active Task, `simple_chat` means an unrelated lightweight new topic.
+- With an active Task, `new_task` means unrelated work that needs a separate
+  Task.
+
+The Intent Agent guidance must explicitly distinguish unrelated lightweight
+conversation from revisions. A message must not be classified as
+`revise_task` merely because an active Task is awaiting acceptance.
+
+## State Transition
+
+Before processing a `simple_chat` or `new_task` decision:
+
+1. Check whether the active Task is `awaiting_acceptance`.
+2. Find its latest completed run.
+3. Record a normal `accept` acceptance against that run.
+4. Continue processing the current message using the original routing
+   decision.
+
+The normal acceptance path must be reused so that the Task becomes `closed`,
+`final_accepted_run_id` is recorded, acceptance events are persisted, run
+memory is updated, and skill-learning candidates can be generated.
+
+Tasks without an acceptance-eligible completed run are left unchanged. Router
+failures retain the existing conservative `continue_task` fallback and must
+not auto-accept a Task.
+
+## Testing
+
+Backend tests must cover:
+
+- An unrelated `simple_chat` message accepts the previous Task and is not
+  appended as another Task run.
+- A `new_task` decision accepts the previous Task and creates a separate Task.
+- `continue_task` and `revise_task` do not auto-accept the active Task.
+- Router failure fallback does not auto-accept the active Task.
+- Auto-accept records the final accepted run and normal acceptance history.
diff --git a/docs/superpowers/specs/2026-06-04-chat-task-timeline-consistency-design.md b/docs/superpowers/specs/2026-06-04-chat-task-timeline-consistency-design.md
new file mode 100644
index 0000000..5169fb6
--- /dev/null
+++ b/docs/superpowers/specs/2026-06-04-chat-task-timeline-consistency-design.md
@@ -0,0 +1,59 @@
+# Chat Current-Task Timeline Consistency
+
+## Goal
+
+Make the chat page's current-session progress panel show the same timeline
+content as the active Task's detail page.
+
+## Visibility
+
+- Show the chat-side timeline only while the current session has an active
+  Task.
+- Hide the panel immediately when the Task is accepted, auto-accepted,
+  abandoned, closed, or when the user switches sessions.
+- Do not show the most recently completed Task after it is no longer active.
+
+## Shared Data Model
+
+The Task detail page remains the canonical timeline behavior.
+
+Both surfaces must:
+
+1. Load the full `BackendTask` payload from `/api/tasks/{task_id}`.
+2. Combine the task's persisted process data with matching live process data.
+3. Use one shared task-process filtering helper.
+4. Build cards with `buildTaskTimelineCards()`.
+5. Render cards with `TaskTimeline`.
+
+This keeps card types, ordering, fallback milestones, result history,
+acceptance history, tool status, and deduplication consistent.
+
+## Chat Panel
+
+`CurrentSessionProgressSidebar` becomes a responsive wrapper around
+`TaskTimeline`.
+
+- Desktop keeps the existing right sidebar.
+- Smaller viewports keep the existing floating open button and drawer.
+- The panel title remains "当前会话的运行进度".
+- Timeline cards match the Task detail timeline.
+- Chat does not render duplicate acceptance controls inside the sidebar,
+  because acceptance controls already exist on chat result messages.
+
+## Data Refresh
+
+- Whenever the active Task changes, the chat page loads its full Task detail.
+- Existing message, process, feedback, and WebSocket refresh paths reload both
+  the active Task identity and its full detail.
+- If the active-task endpoint returns `null`, the cached active Task detail is
+  cleared immediately and the sidebar disappears.
+- A task-detail load failure hides the sidebar rather than showing stale data.
+
+## Testing
+
+- Shared process filtering returns the same task-scoped runs, events, and
+  artifacts for both surfaces.
+- The chat-side timeline cards are produced by `buildTaskTimelineCards()`.
+- No active Task produces no chat-side timeline.
+- Switching to a closed/no-active Task clears the chat-side timeline.
+- Frontend unit tests, typecheck, and production build pass.
diff --git a/docs/ui-ux/README.md b/docs/ui-ux/README.md
new file mode 100644
index 0000000..e971844
--- /dev/null
+++ b/docs/ui-ux/README.md
@@ -0,0 +1,84 @@
+# Beaver UI/UX 页面维护文档
+
+## 文档目的
+
+本目录用于按页面持续维护 Beaver 前端的 UI/UX 结构与真实测试结论。
+
+每一页需要记录：
+
+- 页面、子页、详情页、弹窗和主要状态。
+- 组件层级关系、视觉位置和响应式变化。
+- 每个可操作控件的触发方式、状态变化、反馈、UX 目的和异常恢复逻辑。
+- 多视口下的越界、重叠、滚动、触控目标和可访问性结论。
+- 已发现问题、优先级、代码位置和后续验收标准。
+
+文档描述的是当前真实实现。建议设计与当前实现不一致时，必须明确标记为“待修复”，不能混写为已实现行为。
+
+## 测试原则
+
+每个页面至少执行以下检查：
+
+1. 页面身份、标题和首屏内容正确，无空白页或框架错误覆盖层。
+2. 在 `320px`、`375px`、`390px`、`768px`、`1024px`、`1365px` 和宽屏视口检查布局。
+3. 至少检查一个手机横屏视口。
+4. 检查横向越界、内容裁切、组件重叠、嵌套滚动和固定元素遮挡。
+5. 真实点击或键盘操作每个主要控件，并验证状态变化。
+6. 检查加载、成功、失败、空数据、禁用和权限不足状态。
+7. 检查键盘顺序、焦点可见性、可访问名称、错误播报和触控目标尺寸。
+8. 截图和临时测试脚本默认保存在 `/tmp`，不提交到仓库。
+
+## 问题等级
+
+| 等级 | 定义 |
+| --- | --- |
+| P0 | 阻断核心流程、页面不可用、数据安全或严重误操作风险 |
+| P1 | 核心流程明显受损、响应式严重异常、关键可访问性缺失 |
+| P2 | 可完成任务但体验、可发现性、触控或反馈质量不足 |
+| P3 | 视觉一致性、轻微布局或低风险优化项 |
+
+## 页面清单
+
+| 页面域 | 页面或状态 | 路由 | 文档 | 状态 |
+| --- | --- | --- | --- | --- |
+| 认证门户 | 登录页 | `/login?next=...` | [登录页](./pages/auth-login.md) | 已修复并复测通过 |
+| 认证门户 | 注册页 | `/register?next=...` | 待创建 | 待测试 |
+| 认证门户 | 注册后的模型配置子页 | `/register?next=...` 注册成功后 | 待创建 | 待测试 |
+| 主应用认证入口 | 登录跳转页 | `/login?next=...` | 待创建 | 待测试 |
+| 主应用 | 对话工作台 | `/` | [对话工作台](./pages/chat-workbench.md) | 已修复并复测通过 |
+| 主应用 | 任务列表 | `/tasks` | [Task 任务页](./pages/task-management.md) | 已修复并复测通过 |
+| 主应用 | 任务详情 | `/tasks/[taskId]` | [Task 任务页](./pages/task-management.md) | 已修复并复测通过 |
+| 主应用 | 通知列表 | `/notifications` | [通知页](./pages/notifications.md) | 已修复并本地复测通过 |
+| 主应用 | 通知详情 | `/notifications/[scheduledRunId]` | [通知页](./pages/notifications.md) | 已修复并本地复测通过 |
+| 主应用 | 定时任务 | `/cron` | 待创建 | 待测试 |
+| 主应用 | 技能列表与详情 | `/skills` | [技能页](./pages/skills.md) | 已修复并复测通过 |
+| 主应用 | 文件管理与预览 | `/files` | [文件页](./pages/files.md) | 已修复并复测通过 |
+| 主应用 | MCP 工具管理 | `/mcp` | [工具页](./pages/mcp-tools.md) | 已修复并复测通过 |
+| 主应用 | 智能体管理 | `/agents` | 待创建 | 待测试 |
+| 主应用 | Outlook | `/outlook` | [Outlook 页](./pages/outlook.md) | 已修复并复测通过 |
+| 主应用 | 技能市场与详情 | `/marketplace` | [市场页](./pages/marketplace.md) | 已修复并复测通过 |
+| 主应用 | 配置 | `/settings` | [配置页](./pages/settings.md) | 已修复并复测通过 |
+| 主应用 | 系统状态 | `/status` | [配置页](./pages/settings.md) | 与配置页同实现，已复测通过 |
+| 主应用 | 日志 | `/logs` | 待创建 | 待测试 |
+
+## 当前测试环境
+
+- 浏览器自动化：Playwright Chromium。
+- Browser 插件：本轮不可用，使用 Playwright fallback。
+- 登录页测试日期：2026-06-04。
+- 登录页测试结果：自动化用例执行通过；所有实测视口无页面横向越界、无小点击目标、无首屏控件出界。
+- 对话工作台测试日期：2026-06-04。
+- 对话工作台测试结果：自动化用例 `4 passed`；使用模拟 API 数据完成真实浏览器点击、键盘、响应式测量和截图；所有实测视口无页面横向越界、无可见小点击目标。
+- Task 任务页测试日期：2026-06-04。
+- Task 任务页测试结果：自动化用例 `14 passed`；覆盖普通任务、定时任务、任务详情和缺省态；所有实测视口无页面横向越界、无可见小点击目标。
+- 通知页测试日期：2026-06-04。
+- 通知页测试结果：本地自动化用例 `4 passed`；覆盖通知列表、通知详情、空态、错误态和回复交互；所有实测视口无页面横向越界、无可见小点击目标。
+- 技能页测试日期：2026-06-04。
+- 技能页测试结果：本地与 `terminaltest` 自动化用例均 `3 passed`；覆盖候选操作、草稿评审操作和草稿页响应式；候选/草稿操作后不再回到已发布页，所有实测视口无页面横向越界、无可见小点击目标。
+- 文件页测试日期：2026-06-04。
+- 文件页测试结果：本地与 `terminaltest` 自动化用例均 `4 passed`；覆盖根目录空态、创建文件夹、目录切换、Markdown 预览、下载、删除、错误态和响应式；所有实测视口无页面横向越界、无可见小点击目标。
+- 工具页测试日期：2026-06-04。
+- 工具页测试结果：本地与 `terminaltest` 自动化用例均 `4 passed`；覆盖服务选择、工具详情、Tab 切换、Test、Add、Edit、Delete confirm、Refresh、JSON 错误、加载错误和响应式；所有实测视口无页面横向越界、无可见小点击目标。
+- Outlook 页测试日期：2026-06-04。
+- Outlook 页测试结果：本地与 `terminaltest` 自动化用例均 `4 passed`；覆盖已配置状态、overview 加载、Inbox、邮件详情、Calendar、日程详情、Settings、Test、Save、Disconnect confirm、状态错误和响应式；所有实测视口无页面横向越界、无可见小点击目标。
+- 市场页与配置页测试日期：2026-06-04。
+- 市场页与配置页测试结果：本地与 `terminaltest` 自动化用例均 `4 passed`；覆盖市场搜索、详情、文件预览、安装、配置页智能体保存、Provider 保存、Feishu 通道保存、重启确认、状态错误和响应式；所有实测视口无页面横向越界、无可见小点击目标。
diff --git a/docs/ui-ux/pages/auth-login.md b/docs/ui-ux/pages/auth-login.md
new file mode 100644
index 0000000..2184a1e
--- /dev/null
+++ b/docs/ui-ux/pages/auth-login.md
@@ -0,0 +1,220 @@
+# 认证门户：登录页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 认证门户登录页 |
+| 真实页面路由 | `/login?next=<目标路径>` |
+| 页面实现 | `auth-portal/src/app/login/page.tsx` |
+| 样式实现 | `auth-portal/src/app/globals.css` |
+| API 客户端 | `auth-portal/src/lib/auth-client.ts` |
+| 主应用入口关系 | 主应用 `/login` 只显示跳转提示并重定向到认证门户，不承载登录表单 |
+| 核心任务 | 输入用户名和密码，完成认证后通过 handoff 返回目标工作区页面 |
+| 测试状态 | 已完成修复并复测通过；所有实测视口无横向越界、无小点击目标、无首屏控件出界 |
+
+## 2. 信息架构与组件层级
+
+```text
+portal-page
+├── portal-toolbar                         层级 z-index: 10，右上角
+│   └── LanguageSwitcher
+│       ├── Lang 标签
+│       ├── ZH 按钮
+│       └── EN 按钮
+└── auth-page                              全屏背景层
+    └── portal-panel                       登录卡片定位容器
+        └── auth-card.login-card           登录主容器，手机竖屏与横屏均做紧凑适配
+            ├── Boardware Logo
+            ├── 页面标题
+            ├── auth-form
+            │   ├── 用户名字段
+            │   │   ├── 可见 label
+            │   │   ├── 用户图标
+            │   │   └── 用户名 input
+            │   ├── 密码字段
+            │   │   ├── 可见 label
+            │   │   ├── 锁图标
+            │   │   ├── 密码 input
+            │   │   └── 显示或隐藏密码按钮
+            │   ├── 错误信息区域
+            │   └── 登录提交按钮
+            ├── “或”分隔线
+            └── 注册引导与注册链接
+```
+
+### 层级关系
+
+- 背景图属于最低视觉层，用于传达产品品牌和 Agent/Memory/Tools 等能力氛围。
+- 登录卡片是唯一主任务容器，具有半透明白色表面、边框和阴影。
+- 语言切换器脱离登录卡片，绝对定位在页面右上角，`z-index: 10`。
+- 表单错误位于密码字段与登录按钮之间，属于当前提交动作的内联反馈。
+- 页面无弹窗、抽屉或二级详情层。
+
+## 3. 布局与大概位置
+
+### 桌面与宽屏，大于 920px
+
+- 页面占满视口，背景图居中并 `cover`。
+- 登录卡片位于页面右侧，垂直居中。
+- `portal-panel` 宽度使用 `clamp(360px, 34vw, 560px)`。
+- 页面右侧留白由 `clamp(24px, 8vw, 128px)` 控制。
+- 语言切换器固定在右上角，距顶部约 `20px`，距右侧约 `24px`。
+- 实测 `1365×900` 和 `1920×1080` 无横向越界、无组件重叠。
+
+### 平板与中等宽度，小于等于 920px
+
+- 登录卡片从右侧布局切换为水平居中、靠近页面底部。
+- 容器最大宽度约 `520px`。
+- 页面顶部保留品牌背景展示空间。
+- 实测 `768×1024` 和 `1024×768` 无横向越界、无组件重叠。
+
+### 手机，小于等于 640px
+
+- 页面左右边距约 `16px`。
+- 登录卡片在矮屏手机下进入紧凑节奏，缩小 Logo、标题和表单间距。
+- 输入框高度约 `54px`，字号 `16px`，可避免 iOS 输入自动缩放。
+- `320×568`、`375×667`、`390×844` 均可在首屏完整展示主要内容。
+
+### 手机横屏
+
+- 实测 `844×390` 时使用横屏紧凑布局，主要控件完整位于视口内。
+- 页面无横向越界，无双层滚动。
+
+## 4. 页面状态
+
+| 状态 | 当前表现 | UX 目的 | 测试结论 |
+| --- | --- | --- | --- |
+| 初始状态 | 显示 Logo、标题、空用户名和密码、登录按钮、注册入口 | 清晰建立品牌和唯一主任务 | 通过 |
+| 输入状态 | 输入框显示文本；密码默认掩码 | 防止密码旁观泄露 | 通过 |
+| 密码可见状态 | 点击眼睛按钮后，密码类型切换为 `text`，按钮名称同步变为“隐藏密码” | 降低密码输入错误 | 通过 |
+| 浏览器必填校验 | 空表单提交被浏览器阻止，并聚焦用户名 | 避免无效网络请求 | 通过 |
+| 提交中 | 登录按钮禁用，并显示“登录中...” | 防止重复提交，告知请求正在处理 | 通过 |
+| 登录失败 | 在密码字段下方显示友好错误，按钮恢复可用，错误区域可被播报并获得焦点 | 让用户修正凭据后重试 | 通过 |
+| 登录成功 | 构造 `/handoff?code=...&next=...` 并使用 `location.replace` 跳转 | 安全把认证结果交给目标工作区，并避免返回到已提交登录页 | 通过 |
+| 语言切换 | ZH/EN 立即更新字段、错误和辅助文案，并写入 cookie/localStorage | 支持中英文用户并保持选择 | 通过，刷新后保持 |
+| 注册跳转 | 跳转到 `/register` 并保留 `next` 参数 | 注册完成后仍返回原目标页 | 通过 |
+
+## 5. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 切换中文或英文 | 点击右上角 ZH/EN | 当前语言按钮高亮；页面文案立即更新；刷新后保持 | 降低语言理解成本 | 正常 |
+| 聚焦用户名或密码 | 点击或 Tab | 输入框边框、背景和外部阴影变化 | 明确当前输入位置 | 正常 |
+| 输入用户名 | 键盘输入 | 受控输入更新，支持 `autocomplete=username` | 减少重复输入 | 正常 |
+| 输入密码 | 键盘输入 | 默认掩码，支持 `autocomplete=current-password` | 保护敏感信息并支持密码管理器 | 正常 |
+| 显示或隐藏密码 | 点击眼睛图标 | `password/text` 类型切换，可访问名称同步切换 | 帮助用户核对密码 | 正常 |
+| 空表单提交 | 点击提交或按 Enter | 浏览器原生 required 校验阻止请求并聚焦用户名 | 及早阻止无效操作 | 正常 |
+| 有效表单提交 | 点击提交或在密码框按 Enter | 清空旧错误；按钮禁用；显示加载文案；发起登录请求 | 提供明确进度并防止重复提交 | 正常 |
+| 登录失败 | API 返回失败 | 显示本地化错误；按钮恢复可用；错误区域 `role="alert"`/`aria-live` 并获得焦点 | 支持修正后重试 | 正常 |
+| 登录成功 | API 返回 token 和 handoff code | 使用 `location.replace` 前往目标前端 handoff 页，保留 `next` | 完成认证并返回原任务 | 正常 |
+| 前往注册 | 点击注册链接 | 前往注册页并保留 `next` | 为无账号用户提供明确替代路径 | 正常 |
+
+## 6. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。
+
+| 视口 | 横向越界 | 页面纵向滚动 | 卡片内部滚动 | 卡片完整位于视口 | 结论 |
+| --- | --- | --- | --- | --- | --- |
+| `320×568` | 无 | 无 | 无 | 是 | 通过 |
+| `375×667` | 无 | 无 | 无 | 是 | 通过 |
+| `390×844` | 无 | 无 | 无 | 是 | 通过 |
+| `844×390` 横屏 | 无 | 无 | 无 | 是 | 通过 |
+| `768×1024` | 无 | 无 | 无 | 是 | 通过 |
+| `1024×768` | 无 | 无 | 无 | 是 | 通过 |
+| `1365×900` | 无 | 无 | 无 | 是 | 通过 |
+| `1920×1080` | 无 | 无 | 无 | 是 | 通过 |
+
+## 7. 可访问性与触控检查
+
+### 已通过
+
+- 页面存在一个清晰的 `h1`。
+- Logo 有 `alt="Boardware logo"`。
+- 用户名和密码均存在与 input 关联的 label。
+- Tab 顺序符合 DOM 和视觉顺序：ZH → EN → 用户名 → 密码 → 显示密码 → 登录 → 注册。
+- 密码显示按钮具有动态可访问名称。
+- 用户名和密码支持浏览器自动填充。
+- 输入框、语言按钮、显示密码按钮、提交按钮和注册链接的实际命中区域均不小于 `44×44px`。
+- 登录按钮具有本地化可访问名称。
+- 登录失败错误使用 `role="alert"` 与 `aria-live`，并在失败后聚焦错误区域。
+
+### 待继续观察
+
+- 本轮未使用真实屏幕阅读器做端到端朗读，只通过 DOM、焦点和 Playwright 辅助信息验证。
+- 登录背景图片仍可继续做 WebP/AVIF 与响应式加载优化。
+
+## 8. 已修复问题与遗留优化
+
+### 已修复：手机横屏双层纵向滚动
+
+- 复现：使用 `844×390` 访问登录页。
+- 用户看到：卡片底部超出首屏；页面可滚动，卡片内部也可滚动。
+- 影响：用户难以判断应滚动页面还是卡片；单独滚动卡片后仍无法看到注册链接。
+- 相关实现：
+  - `.auth-page` 在 `<=920px` 时保留顶部和底部 padding。
+  - `.auth-card.login-card` 同时设置基于 `100vh` 的 `max-height` 和 `overflow-y:auto`。
+- 复测结论：`844×390` 无横向越界、无双层滚动，提交和注册入口均在首屏可达。
+
+### 已修复：登录按钮缺少可访问名称
+
+- 复现：使用键盘 Tab 到登录按钮，或检查辅助功能树。
+- 用户影响：屏幕阅读器只能识别为无名称按钮。
+- 相关实现：提交按钮默认仅渲染箭头 SVG，SVG 为 `aria-hidden`。
+- 复测结论：按钮拥有本地化 `aria-label`，加载状态继续表达“登录中”。
+
+### 已修复：错误反馈缺少可访问播报和焦点恢复
+
+- 复现：提交错误凭据。
+- 当前反馈：显示“接口错误 401: 用户名或密码错误”，但无 `role="alert"`、无 `aria-live`，失败后焦点未落在错误或字段上。
+- 用户影响：技术错误码增加理解成本；屏幕阅读器和键盘用户可能不知道提交已经失败。
+- 复测结论：
+  - 用户文案不暴露 HTTP 状态与“接口错误”前缀。
+  - 文案说明原因和恢复方式，例如“用户名或密码错误，请检查后重试”。
+  - 错误使用 `role="alert"`/`aria-live`，并聚焦错误摘要。
+
+### 已修复：关键次级操作点击区域过小
+
+- 影响范围：语言按钮、显示密码按钮、注册链接。
+- 复测结论：语言按钮、显示密码按钮、提交和注册链接实际命中区域均达到至少 `44×44px`。
+
+### 遗留优化：登录背景资源偏大
+
+- `login-background.png` 约 `1.3MB`，当前未提供 WebP/AVIF 或响应式尺寸。
+- 用户影响：弱网和移动网络下首屏背景显示较慢。
+- 建议验收标准：提供 WebP/AVIF，并根据视口加载合理尺寸；保留背景空间避免布局变化。
+
+## 9. 当前实现的正向 UX
+
+- 页面只有一个主操作，层级清晰。
+- 桌面使用背景品牌视觉和右侧卡片，主任务聚焦明确。
+- 手机输入字号为 `16px`，避免 iOS 自动放大。
+- 请求中禁用提交按钮，可防止重复登录。
+- 错误区域预留最小高度，错误出现时不会明显推动后续内容。
+- `next` 参数在注册跳转和成功 handoff 中均正确保留。
+- 语言选择刷新后保持。
+- 所有实测视口均无横向越界。
+
+## 10. 后续验收清单
+
+- [x] 修复横屏双层滚动后，重新测试 `844×390` 和更低高度视口。
+- [x] 为提交按钮添加本地化可访问名称。
+- [x] 改善登录失败文案、错误播报和焦点恢复。
+- [x] 扩大语言、显示密码和注册链接的触控区域。
+- [x] 评估并实现持续可见的字段标签。
+- [ ] 优化登录背景图片格式和响应式加载。
+- [ ] 在 Safari、iOS Safari 和 Android Chrome 验证动态地址栏与 `100vh` 行为。
+- [ ] 使用屏幕阅读器完成一次端到端登录测试。
+
+## 11. 本轮测试证据
+
+- 自动化结果：`/tmp/beaver-login-qa-results.json`
+- 截图目录：`/tmp/beaver-login-qa-shots`
+- 临时测试脚本：`/tmp/beaver-ui-qa-tests/login-page-qa.spec.js`
+- 测试命令：
+
+```bash
+./node_modules/.bin/playwright test login-page-qa.spec.js \
+  --config=/tmp/beaver-ui-qa-tests/pw.config.js \
+  --workers=1
+```
diff --git a/docs/ui-ux/pages/chat-workbench.md b/docs/ui-ux/pages/chat-workbench.md
new file mode 100644
index 0000000..0b533ab
--- /dev/null
+++ b/docs/ui-ux/pages/chat-workbench.md
@@ -0,0 +1,346 @@
+# 主应用：对话工作台 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 对话工作台 |
+| 路由 | `/` |
+| 页面实现 | `app-instance/frontend/app/(app)/page.tsx` |
+| 全局外壳 | `components/AppShell.tsx`、`components/Header.tsx`、`components/AuthGuard.tsx`、`components/AppRuntimeBridge.tsx` |
+| 消息区 | `components/chat-workbench/ChatWorkbench.tsx`、`MessageList.tsx`、`AgentTeamBlock.tsx` |
+| 进度区 | `components/chat-workbench/CurrentSessionProgressSidebar.tsx` |
+| 核心任务 | 选择或创建会话，发送文本或附件，与 Assistant 协作并处理任务验收 |
+| 测试状态 | 已完成修复并复测通过；所有实测视口无页面横向越界、无小点击目标，核心交互可用 |
+
+本页是主应用默认工作区。它同时承载全局导航、会话管理、消息时间线、Agent 运行过程、任务验收、附件上传、消息输入和当前任务进度。
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+├── Header                                      固定头部，z-index: 50，高 64px
+│   ├── Beaver 品牌入口
+│   ├── 桌面主导航：对话、Task、通知、技能、文件、工具、智能体、Outlook、市场、配置
+│   ├── 窄屏菜单按钮与移动导航面板
+│   ├── 连接状态
+│   ├── LanguageSwitcher
+│   └── 账号按钮
+│       └── Account Popover                     浮层，含账号信息和退出登录
+└── main.pt-16
+    └── AuthGuard
+        ├── AppRuntimeBridge                    会话列表、WebSocket 与运行状态同步
+        └── ChatPage                            高度 calc(100vh - 4rem)
+            ├── Desktop Session Sidebar         md 及以上左侧固定 280px
+            │   ├── 新对话按钮
+            │   └── 最近对话滚动列表
+            │       └── 会话选择按钮 + 44px 归档按钮
+            ├── Mobile Session Drawer           手机最近对话抽屉
+            ├── Conversation Column             中央弹性宽度
+            │   ├── ChatWorkbench
+            │   │   └── MessageList
+            │   │       ├── 空状态
+            │   │       ├── 用户消息
+            │   │       ├── Assistant Markdown 消息
+            │   │       ├── 消息附件
+            │   │       ├── 任务卡与查看任务链接
+            │   │       ├── 验收操作与内联反馈面板
+            │   │       ├── Agent Team / Subtask 卡片
+            │   │       └── 思考中状态
+            │   └── Composer
+            │       ├── 当前任务或修改任务状态胶囊
+            │       ├── 待上传附件列表
+            │       └── 输入器
+            │           ├── textarea
+            │           ├── 添加附件
+            │           ├── 思考模式
+            │           └── 发送
+            └── Current Session Progress
+                ├── >= xl：右侧固定 380px 侧栏
+                └── < xl：右上角浮动按钮 + 右侧抽屉
+```
+
+## 3. 布局、位置与层级
+
+### 全局头部
+
+- 固定在视口顶部，高度 `64px`，页面主体使用 `pt-16` 避免被遮挡。
+- 桌面宽屏显示品牌、完整主导航、连接状态、语言和账号。
+- `2xl` 以下收起完整导航，显示菜单按钮；点击后从左侧滑入独立导航抽屉。
+- 移动导航抽屉使用完全不透明的应用背景色、右侧阴影和独立滚动；抽屉外显示深色遮罩，底层页面不可交互且不会透过抽屉显示。
+- “对话、通知、技能”等导航项区域和每个导航项均显式使用不透明应用表面背景，不依赖底层页面或透明父容器。
+- 抽屉最大宽度为 `320px`，不会在平板或窄屏桌面退化为横向铺满的双列透明菜单。
+- 层级顺序为页面内容 < 遮罩 < 导航抽屉 < 固定头部；打开时锁定页面滚动。
+- 账号和语言入口在 `320px` 到宽屏范围内始终可达。
+
+### 工作台主体
+
+- 主体为横向 `flex`，高度 `calc(100vh - 4rem)`。
+- 左侧会话栏在 `md` 及以上显示；手机默认隐藏，使用“最近对话”按钮打开抽屉。
+- 中央对话列使用 `flex-1 min-w-0`，消息区占剩余高度，输入器固定在对话列底部。
+- 输入器外层在手机使用较小左右边距，`md` 及以上恢复桌面边距；textarea 高度范围为 `72px` 到 `200px`。
+- 当存在运行中任务时：
+  - `xl` 及以上显示右侧固定 `380px` 进度栏。
+  - 小于 `xl` 时显示右上角 `44×44px` 浮动按钮，点击后打开右侧抽屉。
+
+### 消息与运行过程
+
+- 消息时间线使用独立滚动区域，中央内容最大宽度 `5xl`。
+- 用户消息右对齐、深色圆角气泡；Assistant 消息左对齐、透明背景。
+- Assistant 创建任务后显示任务卡；待验收消息下方显示接受、需要修改、放弃。
+- Agent Team 作为较大的运行过程区块插入消息时间线，内部 Subtask 卡片可横向排列并点击选中。
+- 当前任务状态胶囊位于输入器上方，点击可前往任务详情。
+
+### 弹层与覆盖层
+
+| 层 | 触发入口 | 当前行为 |
+| --- | --- | --- |
+| 账号 Popover | 头部账号按钮 | 右对齐浮层；点击按钮打开；`Escape` 关闭；退出登录后跳往认证门户 |
+| 移动导航抽屉 | `2xl` 以下的汉堡菜单 | 左侧滑入不透明面板；显示背景遮罩；点击遮罩、导航项或按 `Escape` 关闭 |
+| 进度抽屉 | `< xl` 的右上角进度按钮 | 背景遮罩 + 右侧抽屉；点击遮罩或关闭按钮可关闭 |
+| 接受反馈面板 | 待验收消息的“接受” | 在消息下方内联展开，不遮挡页面 |
+| 修改任务状态 | 待验收消息的“需要修改” | 不打开弹窗；聚焦底部输入器并切换提示文案 |
+| 放弃确认弹窗 | 待验收消息的“放弃” | 先说明后果，确认后才提交 `abandon` |
+| 归档确认弹窗 | 会话行归档按钮 | 先说明会话将从最近对话移除，确认后归档 |
+
+## 4. 页面状态
+
+| 状态 | 当前表现 | UX 目的 | 测试结论 |
+| --- | --- | --- | --- |
+| 认证加载 | `AuthGuard` 显示加载中 | 避免未认证内容闪现 | 本轮未单独注入慢认证 |
+| 空会话 | 中央显示 Beaver 和“发送消息开始对话” | 给出明确起点 | 通过 |
+| 已加载会话 | 显示消息、任务卡和运行过程 | 恢复历史上下文 | 通过 |
+| 切换会话 | 更新消息、进度、当前任务和输入草稿 | 快速在多任务间切换 | 通过，逐会话草稿正常保留 |
+| 思考模式关闭或开启 | 按钮使用 `aria-pressed`，状态写入 localStorage | 让用户控制推理深度并保持偏好 | 通过 |
+| 输入与换行 | `Enter` 发送，`Shift+Enter` 换行 | 提高聊天输入效率 | 通过 |
+| 空输入 | 发送按钮禁用 | 防止无效提交 | 通过 |
+| 发送中或思考中 | 禁用发送，并显示思考中状态 | 防止重复发送并提供过程反馈 | HTTP 模拟流程通过；真实 WebSocket 流未测 |
+| 附件上传中 | 显示文件名、大小和进度条 | 表达上传进度 | 模拟上传通过 |
+| 附件就绪 | 显示“就绪”，可移除 | 发送前确认附件 | 通过，但移除按钮可访问性不合格 |
+| 待验收 | 显示接受、需要修改、放弃 | 让用户决定任务后续 | 三类操作均通过 |
+| 接受反馈展开 | 显示可选备注、取消和提交 | 支持带上下文验收 | 通过 |
+| 修改任务 | 输入器切换为修改要求并自动聚焦 | 降低修改路径成本 | 通过 |
+| 放弃任务 | 点击后打开确认弹窗，确认后提交并显示已放弃 | 防止误终止任务 | 通过 |
+| 进度侧栏或抽屉 | 显示整体进度、步骤和产物 | 在不离开对话的情况下理解执行状态 | 通过 |
+| 账号弹层 | 显示账号信息和退出按钮 | 提供会话级账号入口 | 打开、Escape 关闭、退出登录均通过 |
+
+## 5. 操作与 UX 逻辑
+
+### 全局头部
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 返回对话页 | 点击 Beaver 或“对话” | 导航到 `/` | 提供稳定主页入口 | 正常 |
+| 主导航切换 | 桌面点击导航项；窄屏点击菜单后选择导航项 | 前往对应主应用页面，当前项高亮 | 在产品模块间切换 | 正常 |
+| 切换 ZH/EN | 点击语言按钮 | 页面文案立即变化并持久化 | 支持中英文用户 | 正常 |
+| 打开账号弹层 | 点击账号按钮 | 显示账号信息与退出登录 | 集中账号操作 | 宽屏和移动端均正常 |
+| 关闭账号弹层 | 按 `Escape` 或点击外部 | 浮层关闭并返回原页面 | 提供清晰退出路径 | `Escape` 实测正常 |
+| 退出登录 | 点击退出登录 | 清除 access/refresh token，跳往认证门户 `/login?next=/` | 安全退出并保留返回路径 | 正常 |
+
+### 会话栏
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 新对话 | 点击顶部主按钮 | 创建新 session、清空消息和输入、显示空状态 | 快速开始新任务 | 正常 |
+| 选择会话 | 点击会话按钮，或键盘聚焦后 Enter/Space | 切换消息、当前任务、运行进度和草稿 | 支持并行工作 | 正常 |
+| 保留草稿 | 在不同会话输入后切换 | 每个 session 恢复各自草稿 | 防止上下文切换丢失输入 | 正常 |
+| 归档会话 | 点击会话行右侧 44px 归档按钮并确认 | 归档后从列表移除；失败时插入 Assistant 错误消息 | 清理历史会话并降低误操作 | 正常 |
+
+### 消息、任务与 Agent 过程
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 查看任务 | 点击消息任务卡或当前任务胶囊 | 前往 `/tasks/<taskId>` | 深入任务详情 | 路由实测正常 |
+| 查看消息附件 | 点击图片或文件链接 | 图片新窗口打开；文件下载 | 获取 Assistant 或用户提供的内容 | 本轮未连接真实文件服务 |
+| 选择 Agent 卡片 | 点击 Subtask 卡片 | 卡片出现选中 ring | 明确当前关注的运行单元 | 正常 |
+| 接受任务 | 点击“接受” | 展开可选备注面板 | 在提交前允许补充验收上下文 | 正常 |
+| 取消接受 | 点击反馈面板“取消” | 关闭面板并清空备注 | 避免误提交 | 正常 |
+| 提交接受 | 输入可选备注后点击“提交” | 提交 `accept`，显示“已接受” | 完成任务验收 | 正常 |
+| 请求修改 | 点击“需要修改” | 输入器自动聚焦并切换修改提示；发送后提交 `revise` | 让修改请求复用主输入器 | 正常 |
+| 放弃任务 | 点击“放弃”后确认 | 确认后提交 `abandon`，显示已放弃 | 终止不再需要的任务并降低误操作 | 正常 |
+
+### 输入器与附件
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 输入消息 | 点击 textarea 并输入 | 自动增长，最大高度 `200px`；写入当前会话草稿 | 支持多行消息并防止输入丢失 | 正常 |
+| 换行 | `Shift+Enter` | 插入换行，不发送 | 支持结构化输入 | 正常 |
+| 键盘发送 | `Enter` | 清空输入、显示用户消息、等待回复 | 提高高频对话效率 | 正常 |
+| 点击发送 | 点击发送按钮 | 与键盘发送相同 | 为鼠标和触控提供明确入口 | 正常 |
+| 空输入发送 | 空输入时点击或按 Enter | 发送按钮禁用，无请求 | 防止无效提交 | 正常 |
+| 添加附件 | 点击加号并选择文件 | 上传并显示进度、错误或就绪状态 | 在对话中补充文件上下文 | 模拟上传正常 |
+| 超过 50MB 文件 | 选择过大文件 | 前端显示“最大 50MB”错误 | 及早阻止无效上传 | 代码路径确认；本轮未真实构造 50MB 文件 |
+| 移除待发送附件 | 点击附件行右侧 X | 从待发送列表移除 | 发送前修正附件选择 | 正常，按钮有文件名相关可访问名称 |
+| 切换思考模式 | 点击“思考” | `aria-pressed` 切换并持久化 | 让用户控制回答方式 | 正常 |
+
+### 进度面板
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 查看桌面进度 | `xl` 及以上自动显示 | 右侧固定展示进度、步骤和产物 | 保持过程透明 | 正常 |
+| 打开进度抽屉 | `< xl` 点击右上角浮动按钮 | 打开遮罩和右侧抽屉 | 在较窄空间按需查看进度 | 正常 |
+| 关闭进度抽屉 | 点击 X 或遮罩 | 返回对话页 | 避免抽屉阻塞主任务 | 正常 |
+| 打开产物链接 | 点击产物行 | 有 URL 时新窗口打开 | 快速访问结果 | 本轮未访问外部 URL |
+
+## 6. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。页面使用模拟 API 数据，所有布局渲染、点击、键盘操作和截图均在真实浏览器中执行。
+
+| 视口 | 页面横向越界 | textarea 实测宽度 | 会话栏 | 进度展示 | 结论 |
+| --- | --- | --- | --- | --- | --- |
+| `320×568` | 无 | `262px` | 移动抽屉 | 抽屉可打开 | 通过 |
+| `375×667` | 无 | `317px` | 移动抽屉 | 抽屉可打开 | 通过 |
+| `390×844` | 无 | `332px` | 移动抽屉 | 抽屉可打开 | 通过 |
+| `844×390` 横屏 | 无 | `466px` | 固定 `280px` | 抽屉可打开 | 通过 |
+| `768×1024` | 无 | `390px` | 固定 `280px` | 抽屉可打开 | 通过 |
+| `1024×768` | 无 | `646px` | 固定 `280px` | 抽屉可打开 | 通过 |
+| `1365×900` | 无 | `607px` | 固定 `280px` | 固定右栏 `380px` | 通过 |
+| `1920×1080` | 无 | `990px` | 固定 `280px` | 固定右栏 `380px` | 通过 |
+
+### 关键量化证据
+
+- `320px`、`375px`、`390px` 手机竖屏均无页面横向越界。
+- 手机竖屏 textarea 实测宽度分别为 `262px`、`317px`、`332px`。
+- `390px` 手机宽度下，账号入口 `44×44px` 且完整位于视口内。
+- `1365px` 宽度下，账号入口完整位于视口内，完整导航收起为菜单入口。
+- 最终复测中抽样视口可见小目标数为 `0`。
+
+## 7. 可访问性与触控检查
+
+### 已通过
+
+- 发送按钮具有本地化 `aria-label`。
+- 思考模式使用 `aria-pressed` 表达开关状态。
+- 归档按钮、进度按钮和进度关闭按钮具有可访问名称。
+- 账号 Popover 可使用 `Escape` 关闭。
+- 修改任务后焦点自动移动到主输入器。
+- 空输入时发送按钮使用原生 `disabled`。
+- 长连续文本在桌面消息气泡中正常换行，未引发页面横向越界。
+- 会话选择使用语义按钮，并通过 `aria-current` 表达当前会话。
+- 附件移除按钮具有包含文件名的可访问名称。
+- 主输入器和反馈输入器均有 label 关联。
+- 所有最终抽样视口中，可见可交互控件命中区域均不小于 `44×44px`。
+
+### 已修复
+
+| 等级 | 问题 | 证据与影响 | 建议验收标准 |
+| --- | --- | --- | --- |
+| P1 | 会话行不可键盘操作 | 已改为语义按钮 | 支持 Enter/Space，当前会话使用 `aria-current` |
+| P2 | 归档入口依赖悬停且目标过小 | 已改为 44px 归档按钮，并支持键盘焦点显示 | 触控环境可操作，目标至少 `44×44px` |
+| P2 | 待发送附件移除按钮无名称且过小 | 已添加“移除附件 <文件名>”名称并扩大到 44px | 屏幕阅读器和触控均可用 |
+| P2 | 多个关键操作小于 `44px` | 已扩大导航、语言、账号、任务链接、反馈、附件、思考模式等控件 | 最终抽样视口小目标数为 `0` |
+| P2 | 主输入器和反馈输入器仅使用 placeholder | 已补充 label | 输入后仍有稳定字段语义 |
+| P2 | 归档与放弃缺少确认或撤销 | 已补充站内确认弹窗 | 操作需确认后执行 |
+
+## 8. 已修复问题与仍需观察项
+
+### 已修复：手机竖屏下对话核心流程不可用
+
+- 复现：使用 `320×568`、`375×667` 或 `390×844` 访问 `/`。
+- 用户看到：左侧 `280px` 会话栏占据绝大部分视口，中央消息与输入器被压缩到右侧细条；需要横向滚动。
+- 实测证据：文档宽度为 `549px`；textarea 可见宽度仅 `16px`。
+- 影响：用户无法正常阅读消息、输入内容或使用发送与反馈操作。
+- 相关实现：
+  - `app/(app)/page.tsx` 的会话栏始终为 `w-[280px] shrink-0`。
+  - 输入器始终保留 `px-8`。
+- 复测结论：
+  - 手机竖屏无页面横向滚动。
+  - 会话列表改为抽屉，默认优先显示对话内容。
+  - 输入器在 `320px` 宽度仍可完整输入和发送。
+
+### 已修复：全局头部缺少响应式策略
+
+- 复现：在 `1365px` 及以下查看头部。
+- 用户看到：
+  - `1365px` 时连接状态、语言和账号区域相互挤压，账号入口右侧被裁切。
+  - `1024px`、`768px`、`390px` 时大量导航与账号入口位于视口外。
+- 实测证据：
+  - `1365px` 时账号入口右边界 `1392px`。
+  - `390px` 时账号入口起点 `x=1302px`。
+- 相关实现：`components/Header.tsx` 始终渲染 10 个完整文字导航项，并使用固定三列网格。
+- 复测结论：在 `320px` 到 `1365px` 提供可操作的移动或紧凑导航，账号、语言和当前模块入口始终可达。
+
+### 已修复：会话选择不支持键盘
+
+- 复现：使用 Tab 键尝试选择最近对话。
+- 当前结果：会话行是带 `onClick` 的 `div`，无 `role`、无 `tabIndex`，不会进入键盘焦点顺序。
+- 用户影响：键盘和部分辅助技术用户无法切换会话。
+- 相关实现：`app/(app)/page.tsx` 会话列表行。
+- 复测结论：会话项使用语义按钮，支持键盘操作，当前项具有 `aria-current`。
+
+### 已修复：放弃任务立即执行，无确认或撤销
+
+- 复现：点击待验收消息的“放弃”。
+- 当前结果：点击后先打开确认弹窗，确认后才提交 `abandon` 请求。
+- 用户影响：误触会直接终止任务，恢复路径不明确。
+- 相关实现：`MessageList.tsx` 的放弃按钮直接调用 `onFeedback(..., 'abandon')`。
+- 复测结论：放弃前明确说明后果并要求确认。
+
+### 已修复：会话归档入口可发现性和误操作保护不足
+
+- 归档按钮默认 `opacity-0`，只有悬停会话行才显示。
+- 按钮实测约 `18×18px`，触控设备不易发现和点击。
+- 点击后先打开确认弹窗，确认后归档。
+- 复测结论：触控环境可操作；命中区域至少 `44×44px`；归档前要求确认。
+
+### 已修复：关键触控目标普遍偏小
+
+- 影响范围：头部导航、语言切换、归档、查看任务、接受/修改/放弃、反馈取消/提交、附件、思考模式。
+- 用户影响：手机、平板和运动能力受限用户更容易误触或漏触。
+- 复测结论：最终抽样视口可见小目标数为 `0`。
+
+### 已修复：待发送附件移除按钮缺少可访问名称
+
+- 复现：添加附件并等待“就绪”。
+- 当前结果：右侧 X 为无文本、无 `aria-label`、无 `title` 的按钮，尺寸约 `14×14px`。
+- 复测结论：名称包含操作和文件名，命中区域至少 `44×44px`。
+
+### 已修复：移动视口高度使用 `100vh`
+
+- 工作台使用 `h-[calc(100vh-4rem)]`，没有使用动态视口单位。
+- 用户影响：iOS Safari 等动态地址栏环境中，底部输入器可能被浏览器 UI 遮挡或发生高度跳变。
+- 复测结论：工作台主体改用 `100dvh`。仍建议在移动真机验证输入法与地址栏变化。
+
+## 9. 当前实现的正向 UX
+
+- 新对话、会话切换、发送、修改、验收和进度查看形成完整工作流。
+- 每个会话独立保留输入草稿，切换后可恢复。
+- `Enter` 发送和 `Shift+Enter` 换行符合聊天产品惯例。
+- 空输入时禁用发送；异步发送时避免重复提交。
+- 修改任务会自动聚焦输入器并切换提示文案，路径清晰。
+- 接受任务先展开可选备注，允许取消后再提交。
+- 任务卡和当前任务胶囊均可直接进入任务详情。
+- 进度面板同时表达总体进度、步骤和产物；小于 `xl` 时抽屉打开与关闭正常。
+- 账号 Popover 支持 `Escape`，退出登录正确清除 token 并返回认证门户。
+- 本轮所有实测交互均未产生控制台错误或框架错误覆盖层。
+
+## 10. 后续验收清单
+
+- [x] 为手机和窄屏设计会话抽屉、紧凑头部和主对话优先布局。
+- [x] 修复 `320px`、`375px`、`390px` 横向越界并确保输入器完整可用。
+- [x] 修复 `1365px` 及以下头部挤压和账号入口越界。
+- [x] 将会话行改为完整的键盘与辅助技术可操作元素。
+- [x] 为放弃任务和归档会话增加确认。
+- [x] 扩大所有关键触控目标到至少 `44×44px`。
+- [x] 为附件移除按钮添加本地化可访问名称。
+- [x] 为主输入器和反馈输入器补充明确 label。
+- [ ] 使用真实 WebSocket、真实上传、网络失败和超时状态复测。
+- [ ] 测试 50MB 边界、上传失败、发送失败和反馈失败恢复路径。
+- [ ] 在 iOS Safari、Android Chrome 和桌面 Safari 复测动态视口与输入法。
+- [ ] 使用屏幕阅读器完成发送、切换会话和任务验收流程。
+
+## 11. 本轮测试证据
+
+- 自动化结果：`/tmp/beaver-chat-qa-results.json`
+- 截图目录：`/tmp/beaver-chat-qa-shots`
+- 临时测试脚本：`/tmp/beaver-ui-qa-tests/chat-page-qa.spec.js`
+- API 环境：使用确定性模拟数据；真实浏览器负责页面渲染、点击、键盘、路由、响应式测量与截图。
+- 自动化结果：`4 passed`。
+- 测试命令：
+
+```bash
+/tmp/beaver-ui-qa-tests/node_modules/.bin/playwright test \
+  /tmp/beaver-ui-qa-tests/chat-page-qa.spec.js \
+  --config=/tmp/beaver-ui-qa-tests/pw.config.js \
+  --workers=1
+```
diff --git a/docs/ui-ux/pages/files.md b/docs/ui-ux/pages/files.md
new file mode 100644
index 0000000..e57a2e7
--- /dev/null
+++ b/docs/ui-ux/pages/files.md
@@ -0,0 +1,120 @@
+# 主应用：文件页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 文件管理 |
+| 路由 | `/files` |
+| 页面实现 | `app-instance/frontend/app/(app)/files/page.tsx` |
+| 关键组件 | `FilesPage`、`FilePreviewPanel`、`FileIcon`、`ScrollArea` |
+| 核心任务 | 浏览目录、创建文件夹、上传文件、预览文本/Markdown/图片/二进制文件、下载文件、删除文件或目录 |
+| 测试状态 | 已修复并复测通过；本地与 `terminaltest` 生产实例均通过 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    └── /files
+        ├── Page Header
+        │   ├── h1 Files
+        │   ├── New folder
+        │   ├── Upload
+        │   ├── hidden file input
+        │   └── Refresh
+        ├── Breadcrumbs
+        │   ├── Files root
+        │   └── 当前路径 segments
+        ├── New directory form
+        │   ├── Folder name input
+        │   ├── Create
+        │   └── Cancel
+        └── Content grid
+            ├── File list panel
+            │   ├── Loading state
+            │   ├── Error state + Retry
+            │   ├── Empty state
+            │   └── File / Directory rows
+            │       ├── Open / Preview primary button
+            │       ├── Download
+            │       └── Delete
+            └── FilePreviewPanel
+                ├── Empty preview
+                ├── Loading preview
+                ├── Error preview
+                ├── File metadata
+                ├── Download
+                ├── Image preview
+                ├── Markdown preview
+                ├── Text preview
+                └── Binary fallback
+```
+
+## 3. 布局与响应式规则
+
+- 页面外层使用 `max-w-7xl`，移动端内边距为 `16px`，桌面端为 `24px`。
+- 内容区默认单列，`lg` 以上改为左侧文件列表、右侧预览双栏。
+- 左侧文件列表和右侧预览都使用 `min-w-0`，避免长文件名、Markdown、代码块撑破页面。
+- 文件行移动端为上下结构：上方文件信息，下方下载/删除操作；`sm` 以上恢复横向布局。
+- 下载/删除在移动端始终可见，桌面端保留 hover 显示。
+- 根目录也允许创建文件夹和上传文件；空态文案与按钮行为一致。
+- 面包屑、文件行主按钮、下载、删除、创建、取消、刷新等主要可点击目标均为 `44px` 以上。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 刷新文件列表 | 点击 Refresh | 调用 browse 接口重新加载当前路径 | 获取最新目录状态 | 正常 |
+| 根目录新建文件夹 | 点击 New folder，输入名称，点击 Create | 调用 mkdir，成功后刷新列表 | 空 workspace 也能开始组织文件 | 正常 |
+| 根目录上传文件 | 点击 Upload，选择文件 | 调用 upload，显示进度并刷新列表 | 空 workspace 也能添加文件 | 正常 |
+| 进入目录 | 点击目录主区域 | 调用 browse，更新 breadcrumbs 和列表 | 浏览层级文件 | 正常 |
+| 返回上级或根目录 | 点击 breadcrumbs | 调用 browse 对应路径 | 快速导航 | 正常 |
+| 预览文件 | 点击文件主区域 | 调用 preview，右侧显示内容 | 快速查看文件 | 正常 |
+| 下载文件 | 点击文件行或预览区 Download | 调用 download，浏览器下载 blob | 获取原始文件 | 正常 |
+| 删除文件/目录 | 点击 Delete 并确认 | 调用 delete，成功后从列表移除 | 管理文件空间，防误删 | 正常 |
+| 加载失败 | browse 接口失败 | 显示错误、详情和 Retry | 明确异常恢复路径 | 正常 |
+| 二进制文件预览 | 文件不可预览 | 显示不可直接预览提示 | 避免乱码 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地 dev server `http://127.0.0.1:3080` 与生产实例 `terminaltest`；API 使用模拟数据，真实浏览器执行点击、上传入口、目录切换、预览、下载、删除确认和截图。
+
+| 页面/状态 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| 根目录空态 | `390×844` | 无 | 0 | New folder 和 Upload 在根目录可用 |
+| 文件预览 | `390×844` | 无 | 0 | 可进入目录、预览 Markdown、下载、删除 |
+| 加载错误 | `390×844` | 无 | 0 | 错误和 Retry 可见 |
+| 文件预览 | `320×568` | 无 | 0 | 长文件名、操作按钮、Markdown 预览均未撑破页面 |
+| 文件预览 | `390×844` | 无 | 0 | 手机竖屏布局清晰 |
+| 文件预览 | `844×390` 横屏 | 无 | 0 | 横屏无页面级横向滚动 |
+| 文件预览 | `768×1024` | 无 | 0 | 平板布局稳定 |
+| 文件预览 | `1365×900` | 无 | 0 | 桌面双栏布局正常 |
+
+### 关键量化证据
+
+- 本地文件页 QA 自动化用例 `4 passed`。
+- 部署到 `terminaltest` 后，同一套文件页 QA 自动化用例 `4 passed`。
+- 根目录空态中 `New folder` 和 `Upload` 均为 enabled。
+- 创建文件夹调用 `/api/user-files/mkdir?path=docs`。
+- 下载调用 `/api/user-files/download`。
+- 删除调用 `/api/user-files/delete`，并经过浏览器确认。
+- 实测 `320×568`、`390×844`、`844×390`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 所有实测视口可见小触控目标数为 `0`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | 根目录空态提示可上传/新建，但按钮被禁用 | 根目录允许 New folder 和 Upload |
+| P1 | `320px` 下文件列表被 `minmax(360px,440px)` 和长文件名撑破页面 | 默认单列改为 `minmax(0,1fr)`，列表和预览加 `min-w-0` |
+| P1 | 文件行里嵌套下载/删除 role button，移动端不可发现且触控小 | 改为主打开按钮 + 独立下载/删除按钮，移动端始终可见 |
+| P2 | 文件行长文件名与操作按钮互相挤压 | 移动端文件行改为信息在上、操作在下 |
+| P2 | Refresh 是 icon-only 且缺少可访问名称 | 补充 `aria-label/title`，命中区为 `44px` |
+| P2 | 面包屑按钮和文件主按钮触控高度不足 | 固定为 `44px` 以上 |
+| P2 | Markdown/text 预览长内容可能撑破页面 | 预览区增加容器内换行和 preserved long text 规则 |
+
+## 7. 剩余观察项
+
+- 本轮自动化使用模拟 API 数据覆盖常见文件类型；真实大文件、超大图片、深层目录和上传失败恢复仍需持续观察。
+- 浏览器原生下载行为只验证 download API 被调用，未校验操作系统保存结果。
diff --git a/docs/ui-ux/pages/marketplace.md b/docs/ui-ux/pages/marketplace.md
new file mode 100644
index 0000000..c07958e
--- /dev/null
+++ b/docs/ui-ux/pages/marketplace.md
@@ -0,0 +1,106 @@
+# 主应用：市场页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 技能市场 |
+| 路由 | `/marketplace` |
+| 页面实现 | `app-instance/frontend/app/(app)/marketplace/page.tsx` |
+| 关键组件 | `MarketplacePage`、`SkillDetailView`、`Tabs`、`Card`、`Button`、`Input` |
+| 核心任务 | 搜索 SkillHub 技能、排序筛选、打开详情、查看说明/文件/版本、安装或更新技能 |
+| 测试状态 | 已修复并复测通过；本地与 `terminaltest` 生产实例均通过 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    └── /marketplace
+        ├── Page Header
+        │   ├── h1 Marketplace
+        │   └── 页面说明
+        ├── Search Form
+        │   ├── 搜索输入框
+        │   └── Search
+        ├── Error Card
+        ├── Search Results
+        │   ├── Sort Buttons
+        │   ├── Starred only Filter
+        │   ├── Skill Button Cards
+        │   └── Pagination
+        └── Skill Detail
+            ├── Back to search
+            ├── Detail Header
+            │   ├── namespace/download/star/version badges
+            │   ├── title/summary
+            │   └── Install/Reinstall
+            ├── Overview Tab
+            ├── Files Tab
+            │   ├── file list
+            │   └── file preview
+            └── Versions Tab
+                └── version rows
+```
+
+## 3. 布局与响应式规则
+
+- 页面外层使用 `max-w-7xl`，移动端内边距为 `16px`，桌面端为 `24px`。
+- 搜索区在移动端垂直排列，桌面端输入框和 Search 按钮横向排列。
+- 结果卡片使用真正的 `button` 语义，而不是仅给 Card 绑定 click，键盘和读屏器都能识别为可操作项。
+- 技能名、namespace、版本号、文件路径、README markdown 和代码预览都允许在容器内断行。
+- 详情页文件列表和文件预览在桌面端左右分栏，移动端垂直排列。
+- Tabs、按钮、输入框和分页操作均满足 `44px` 触控目标。
+- Markdown 中的长代码、表格和链接不会撑出页面；表格在内容区内横向滚动。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 搜索技能 | 输入关键词后点击 Search 或提交表单 | 调用 SkillHub search，列表刷新 | 快速定位技能 | 正常 |
+| 切换排序 | 点击 Relevance/Downloads/Newest | 当前排序按钮进入选中态并重新加载 | 支持按不同意图浏览 | 正常 |
+| 只看收藏 | 点击 Starred only | 本地筛选 starCount 大于 0 的结果 | 聚焦已收藏技能 | 正常 |
+| 打开技能详情 | 点击技能卡片按钮 | 加载 detail、version list、SKILL.md | 进入安装前审阅 | 正常 |
+| 返回搜索 | 点击 Back to search | 清空详情状态并回到结果列表 | 提供明确退出路径 | 正常 |
+| 切换说明/文件/版本 | 点击 tab | 同页切换内容区 | 让审阅信息分层 | 正常 |
+| 打开文件 | Files tab 点击文件路径 | 加载并预览文件内容 | 审核技能代码或文档 | 正常 |
+| 切换版本 | Versions tab 点击版本行 | 加载指定版本详情和 README | 安装前比较版本 | 正常 |
+| 安装技能 | 点击 Install/Reinstall | 调用 install API，按钮 loading，成功后显示 installed | 完成技能接入 | 正常 |
+| 加载/安装失败 | API 返回错误 | 显示错误卡片，文本断行 | 明确失败原因并保留当前上下文 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地 dev server `http://127.0.0.1:3080` 与生产实例 `terminaltest`；API 使用模拟数据，真实浏览器执行点击、输入、详情打开、文件预览、安装和截图。
+
+| 页面/状态 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| 搜索结果 + 详情 | `320×568` | 无 | 0 | 长 skill 名、namespace 和 summary 不撑破页面 |
+| 搜索结果 + 详情 | `390×844` | 无 | 0 | 可搜索、打开详情、切换文件并安装 |
+| 搜索结果 + 详情 | `844×390` 横屏 | 无 | 0 | 横屏内容可滚动，不产生页面级横向滚动 |
+| 搜索结果 + 详情 | `768×1024` | 无 | 0 | 平板详情布局稳定 |
+| 搜索结果 + 详情 | `1365×900` | 无 | 0 | 桌面分栏和卡片布局正常 |
+
+### 关键量化证据
+
+- 本地与 `terminaltest` 市场/配置组合 QA 自动化用例均 `4 passed`，其中覆盖市场流。
+- 覆盖搜索、详情、文件 tab、长路径文件预览、安装请求和响应式。
+- 实测 `320×568`、`390×844`、`844×390`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 所有实测视口可见小触控目标数为 `0`。
+- 本地截图保存在 `/tmp/beaver-market-settings-qa-local-shots`，生产截图保存在 `/tmp/beaver-market-settings-qa-prod-shots`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | 结果卡片只有 Card click，没有按钮语义，键盘和辅助技术不可稳定操作 | 改为真实 `button` 卡片 |
+| P1 | 技能详情里的文件路径、版本号、markdown 代码块可能撑破移动端 | 增加 `min-w-0`、`break-all`、`break-words` 和 markdown 预览约束 |
+| P2 | 页面缺少清晰 `h1`，市场页身份不明确 | 增加语义化标题和说明 |
+| P2 | 搜索表单在窄屏可能挤压 | 移动端改为纵向布局 |
+| P2 | Tabs 触控高度不足 44px | 基础 `TabsTrigger` 调整为 `44px` |
+| P2 | 排序、筛选、返回、安装、分页等操作触控尺寸不统一 | 基础按钮和页面操作统一提升到 `44px` |
+| P3 | 长 namespace 和版本 badge 只截断或可能撑宽 | 改为容器内断行 |
+
+## 7. 剩余观察项
+
+- 本轮使用模拟 SkillHub 数据；真实市场里若存在复杂 HTML/Markdown 表格或超大文件，仍需持续抽样检查。
+- 当前安装成功后停留在详情页并更新 installed 状态，后续可考虑增加轻量 toast，增强成功反馈。
diff --git a/docs/ui-ux/pages/mcp-tools.md b/docs/ui-ux/pages/mcp-tools.md
new file mode 100644
index 0000000..35e0c75
--- /dev/null
+++ b/docs/ui-ux/pages/mcp-tools.md
@@ -0,0 +1,114 @@
+# 主应用：工具页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 工具 / MCP 工具管理 |
+| 路由 | `/mcp` |
+| 页面实现 | `app-instance/frontend/app/(app)/mcp/page.tsx` |
+| 关键组件 | `MCPPage`、`Dialog`、`Tabs`、MCP 服务卡片、工具详情面板 |
+| 核心任务 | 查看本地/在线 MCP 服务、新增服务、编辑服务、测试连接、删除服务、查看已发现工具 |
+| 测试状态 | 已修复并复测通过；本地与 `terminaltest` 生产实例均通过 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    └── /mcp
+        ├── Page Header
+        │   ├── h1 Tools
+        │   ├── Refresh
+        │   └── Add tool server
+        ├── Add / Edit MCP Dialog
+        │   ├── ID
+        │   ├── Tool timeout
+        │   ├── Connection mode tabs
+        │   │   ├── Remote MCP server
+        │   │   │   ├── URL
+        │   │   │   ├── Auth mode
+        │   │   │   ├── AuthZ permissions preview
+        │   │   │   └── Headers JSON
+        │   │   └── Install and launch
+        │   │       ├── Command
+        │   │       └── Arguments
+        │   └── Cancel / Save
+        ├── Error Card
+        ├── Tool kind tabs
+        │   ├── Local tools
+        │   └── Online tools
+        └── Content grid
+            ├── MCP service list
+            │   ├── Selectable service content
+            │   └── Edit / Test / Delete
+            └── Tool details panel
+                ├── Empty selection state
+                ├── Empty tools state
+                └── Tool cards
+```
+
+## 3. 布局与响应式规则
+
+- 页面外层使用 `max-w-6xl`，移动端内边距为 `16px`，桌面端为 `24px`。
+- 移动端头部按钮自动换行，`Refresh` 和 `Add tool server` 均为 `44px` 高度。
+- 内容区默认单列；`xl` 以上变为左侧 MCP 服务列表、右侧工具详情双栏。
+- MCP 服务卡片的可选中区域和编辑/测试/删除按钮分离，避免卡片 role button 内嵌按钮。
+- 移动端服务卡片头部改为纵向布局，徽章不会挤出右侧边界。
+- 长 ID、URL、command、Audience、Scopes、last error 和工具描述都在容器内换行。
+- 新增/编辑弹窗限制在当前视口内，内容可滚动，底部 Cancel/Save 保持可达。
+- 页面主要按钮、Tab 和服务选择区域均满足 `44px` 触控目标。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 刷新工具服务 | 点击 Refresh | 重新拉取 MCP servers、tools、AuthZ 状态 | 获取最新连接和工具发现状态 | 正常 |
+| 切换本地/在线工具 | 点击 Local tools / Online tools | 切换服务列表，并清空右侧选中态 | 避免跨分类误看详情 | 正常 |
+| 选择服务 | 点击服务卡片内容区域或键盘 Enter/Space | 卡片高亮，右侧显示对应工具 | 查看该 MCP 暴露的工具 | 正常 |
+| 测试服务 | 点击 Test | 按钮显示 loading，成功后刷新状态 | 验证 MCP 当前可连接性 | 正常 |
+| 新增远程服务 | 点击 Add tool server，填写 URL/Auth/Header，点击 Save | 校验 ID、URL、timeout、Headers JSON，成功后关闭弹窗并刷新 | 接入已部署 MCP 服务 | 正常 |
+| 新增本地服务 | 弹窗中切换 Install and launch，填写 command/args，点击 Save | 校验 ID、command、timeout，成功后关闭弹窗并刷新 | 接入本地 stdio MCP 进程 | 正常 |
+| 编辑服务 | 点击 Edit | 打开同一弹窗并带入原配置，保存后刷新 | 修改用户自定义 MCP 配置 | 正常 |
+| 删除服务 | 点击 Delete，确认浏览器弹窗 | 确认后调用 delete，成功后取消选中并刷新 | 防止误删 MCP 配置 | 正常 |
+| JSON 输入错误 | Headers JSON 非对象或语法错误 | 页面错误卡显示解析错误，弹窗保持打开 | 保留用户输入并指出修复方向 | 正常 |
+| 加载失败 | servers 接口失败 | 显示错误卡，不阻断页面头部操作 | 明确异常原因并允许重新刷新 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地 dev server `http://127.0.0.1:3080` 与生产实例 `terminaltest`；API 使用模拟数据，真实浏览器执行点击、输入、确认弹窗和截图。
+
+| 页面/状态 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| 本地服务详情 | `390×844` | 无 | 0 | 可选择服务、查看工具详情、测试连接 |
+| 在线服务详情 | `390×844` | 无 | 0 | 超长 ID、URL、Audience、错误信息未撑破页面 |
+| 加载错误 | `390×844` | 无 | 0 | 错误卡可读，头部操作仍可见 |
+| 在线服务详情 | `320×568` | 无 | 0 | 窄屏卡片徽章和长字符串均正常换行 |
+| 在线服务详情 | `390×844` | 无 | 0 | 手机竖屏可完成查看与操作 |
+| 在线服务详情 | `844×390` 横屏 | 无 | 0 | 横屏无页面级横向滚动 |
+| 在线服务详情 | `768×1024` | 无 | 0 | 平板单列布局稳定 |
+| 在线服务详情 | `1365×900` | 无 | 0 | 桌面双栏布局正常 |
+
+### 关键量化证据
+
+- 本地工具页 QA 自动化用例 `4 passed`。
+- 部署到 `terminaltest` 后，同一套工具页 QA 自动化用例 `4 passed`。
+- 覆盖服务选择、工具详情、Tab 切换、Test、Add、Edit、Delete confirm、Refresh、JSON 错误和加载错误。
+- 实测 `320×568`、`390×844`、`844×390`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 所有实测视口可见小触控目标数为 `0`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | `320px` 下在线服务卡片徽章、Audience 长字符串和错误信息横向越界 | 卡片头部移动端纵向布局，所有长字段加 `break-all/min-w-0` |
+| P1 | 新增/编辑弹窗内容过高时 Save 按钮在移动端被挤出视口 | Dialog 限制 `max-height`、启用内部滚动，底部操作区 sticky |
+| P1 | 删除 MCP 服务没有确认，误删风险高 | 删除前增加浏览器确认弹窗 |
+| P2 | 服务卡片整体 `role=button` 内部嵌套 Edit/Test/Delete 按钮 | 改为内容区域可选中，操作按钮独立 |
+| P2 | Refresh、Add、Local/Online tabs 和卡片操作按钮触控高度不足 | 统一提升到 `44px` |
+| P2 | Headers JSON 错误只显示页面级错误，弹窗可能遮挡操作 | 错误卡可读，弹窗保持打开且操作按钮可达 |
+
+## 7. 剩余观察项
+
+- 本轮自动化使用模拟 MCP 与 AuthZ 数据；真实 MCP 连接超时、鉴权 403 和工具发现异常仍需在后续联测中观察。
+- 当前删除使用浏览器原生确认弹窗，后续可统一为应用内确认 Dialog，以保持视觉一致性。
diff --git a/docs/ui-ux/pages/notifications.md b/docs/ui-ux/pages/notifications.md
new file mode 100644
index 0000000..7a5c1fe
--- /dev/null
+++ b/docs/ui-ux/pages/notifications.md
@@ -0,0 +1,135 @@
+# 主应用：通知页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 通知中心 |
+| 通知列表路由 | `/notifications` |
+| 通知详情路由 | `/notifications/[scheduledRunId]` |
+| 页面实现 | `app-instance/frontend/app/(app)/notifications/page.tsx`、`app-instance/frontend/app/(app)/notifications/[scheduledRunId]/page.tsx` |
+| 关键组件 | `NotificationsPage`、`NotificationDetailPage`、`ChatWorkbench`、`MessageList`、`Button`、`Badge` |
+| 核心任务 | 查看定时任务生成的通知、进入通知详情、刷新通知、对通知结果提出本次修改或未来规则调整、打开已接入 Task |
+| 测试状态 | 已修复并复测通过；本地与 `terminaltest` 生产实例均通过 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    ├── /notifications
+    │   ├── Page Header
+    │   │   ├── h1 Notifications
+    │   │   ├── 页面说明
+    │   │   └── 刷新按钮
+    │   ├── Error Card
+    │   └── Notification List Panel
+    │       ├── Loading State
+    │       ├── Empty State
+    │       └── Notification Link Row/Card
+    │           ├── 标题
+    │           ├── 状态 Badge
+    │           ├── 摘要
+    │           ├── 生成时间
+    │           ├── job 名称
+    │           └── 桌面端箭头
+    └── /notifications/[scheduledRunId]
+        ├── Detail Header
+        │   ├── 返回通知列表
+        │   ├── 标题
+        │   ├── 状态 / 已接入 Task Badge
+        │   ├── 生成时间
+        │   ├── 刷新按钮
+        │   └── 查看任务按钮
+        ├── Error Banner
+        ├── ChatWorkbench
+        │   └── MessageList
+        │       ├── 用户原始请求
+        │       └── 通知生成结果
+        └── Reply Panel
+            ├── 修改这次
+            ├── 以后按这样
+            ├── 已接入提示
+            └── 回复输入框 + 发送
+```
+
+## 3. 布局与响应式规则
+
+### 通知列表
+
+- 外层使用 `max-w-6xl`，移动端内边距为 `16px`，桌面端为 `24px`。
+- 列表区域是独立白色面板，内部垂直滚动，不产生页面级横向滚动。
+- 移动端列表项按单列卡片阅读：标题、摘要、时间和 job 名称上下排列。
+- `md` 及以上使用网格列展示摘要、时间、job 名称和箭头，方便桌面端扫描。
+- 长标题、长摘要和长 job 名称都使用容器内断行，避免 ID 或连续字符串撑破卡片。
+- 刷新按钮高度为 `44px`，满足移动端触控目标要求。
+
+### 通知详情
+
+- 页面整体高度为 `calc(100vh - 4rem)`，位于全局 header 下方。
+- 顶部详情 header 使用浅色背景和底部分隔线，承载返回、标题、状态、生成时间和操作按钮。
+- 移动端标题允许换行，不再只截断；长 scheduled run id 或长标题不会撑破页面。
+- 中间 `ChatWorkbench` 使用剩余高度展示消息流。
+- 底部回复区是独立面板，包含两个意图按钮和按需出现的输入框。
+- 回复输入框有可见 label，不依赖 placeholder 作为唯一说明。
+- 返回、刷新、查看任务、意图选择、发送等关键操作均为 `44px` 高度。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 刷新通知列表 | 点击列表页 Refresh | 调用 `GET /api/notifications`，列表重新渲染 | 获取最新定时通知 | 正常 |
+| 打开通知详情 | 点击通知列表项 | 跳转 `/notifications/[scheduledRunId]` | 查看通知完整上下文和结果 | 正常 |
+| 空通知状态 | 列表接口返回空数组 | 显示“暂无通知” | 明确没有可处理内容 | 正常 |
+| 列表加载失败 | 列表接口失败 | 显示错误卡片 | 让用户知道是接口异常而不是无数据 | 正常 |
+| 返回通知列表 | 详情页点击返回 | 跳转 `/notifications` | 提供明确退出路径 | 正常 |
+| 刷新通知详情 | 详情页点击 Refresh | 调用 `GET /api/notifications/[id]` | 重新获取当前通知状态 | 正常 |
+| 修改这次 | 点击 `Revise this` | 按钮进入选中态，显示“本次通知的修改说明”输入框 | 只影响本次通知结果 | 正常 |
+| 以后按这样 | 点击 `Apply going forward` | 按钮进入选中态，显示“以后这类通知的调整说明”输入框 | 将用户偏好表达为未来规则 | 正常 |
+| 发送修改说明 | 输入内容后点击 Send | 调用 `POST /api/chat`，携带 `reply_to_scheduled_run_id` 和 `scheduled_reply_intent` | 把通知反馈接回对话/任务处理流程 | 正常 |
+| 打开已接入 Task | 已存在 `task_id` 时点击 Open task | 跳转 `/tasks/[taskId]` | 从通知继续跟进任务 | 正常 |
+| 通知不存在 | 详情接口失败或无数据 | 显示错误信息和返回通知入口 | 提供异常恢复路径 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地 dev server `http://127.0.0.1:3080` 与生产实例 `terminaltest`；API 使用模拟数据，真实浏览器执行点击、输入、跳转和截图。
+
+| 页面 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| 通知列表 | `320×568` | 无 | 0 | 长标题和长 job 名在卡片内换行 |
+| 通知列表 | `390×844` | 无 | 0 | 手机竖屏可刷新、进入详情 |
+| 通知列表 | `844×390` 横屏 | 无 | 0 | 横屏无页面级横向滚动 |
+| 通知列表 | `768×1024` | 无 | 0 | 平板列表布局稳定 |
+| 通知列表 | `1365×900` | 无 | 0 | 桌面网格列可扫描 |
+| 通知空态 | `390×844` | 无 | 0 | 空态居中显示 |
+| 通知错误态 | `390×844` | 无 | 0 | 错误信息在卡片内可读 |
+| 通知详情 | `320×568` | 无 | 0 | 顶部标题换行，回复区不遮挡 |
+| 通知详情 | `390×844` | 无 | 0 | 消息流和底部回复区分层清楚 |
+| 通知详情 | `768×1024` | 无 | 0 | 平板详情布局正常 |
+| 通知详情 | `1365×900` | 无 | 0 | 桌面详情布局正常 |
+| 通知详情错误态 | `390×844` | 无 | 0 | 返回通知入口可见 |
+
+### 关键量化证据
+
+- 本地通知页 QA 自动化用例 `4 passed`。
+- 部署到 `terminaltest` 后，同一套通知页 QA 自动化用例 `4 passed`。
+- 列表实测视口 `320×568`、`390×844`、`844×390`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 详情实测视口 `320×568`、`390×844`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 所有实测视口可见小触控目标数为 `0`。
+- 回复提交实测请求包含 `reply_to_scheduled_run_id` 和 `scheduled_reply_intent=revise_once`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | 通知列表长标题、长 job 名在移动端被右侧裁切或存在撑破风险 | 标题、摘要和 job 名增加容器内断行；列表项保留 `min-w-0` |
+| P2 | 列表 Refresh 按钮高度只有 36px，低于移动端触控标准 | 调整为 `44px` |
+| P2 | 详情页返回、Refresh、Revise、Apply going forward 等操作高度不足 44px | 统一调整为 `44px` |
+| P2 | 详情页标题只截断，移动端无法判断完整通知主题 | 改为可换行并控制在容器内 |
+| P2 | 详情回复输入框依赖 placeholder 表达含义 | 增加可见 label，并根据意图区分本次修改/未来调整 |
+| P3 | 意图按钮缺少明确 pressed 状态语义 | 增加 `aria-pressed` |
+
+## 7. 剩余观察项
+
+- 本地 mocked API 场景会出现 WebSocket 握手失败日志，因为测试 token 不对应真实后端 WS；该日志不影响通知页 HTTP 交互和布局结论。
+- 后续接入真实用户历史通知时，仍需持续观察第三方系统生成的异常长 Markdown、附件和错误文本。
diff --git a/docs/ui-ux/pages/outlook.md b/docs/ui-ux/pages/outlook.md
new file mode 100644
index 0000000..f8eb7f6
--- /dev/null
+++ b/docs/ui-ux/pages/outlook.md
@@ -0,0 +1,121 @@
+# 主应用：Outlook 页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | Outlook |
+| 路由 | `/outlook` |
+| 页面实现 | `app-instance/frontend/app/(app)/outlook/page.tsx` |
+| 关键组件 | `OutlookPage`、`MessageCard`、`EventCard`、`Field`、邮件详情 Dialog、日程详情 Dialog |
+| 核心任务 | 配置 Outlook/EWS 连接、测试连接、保存启用、断开连接、查看收件箱/发件箱、分页、查看邮件详情、查看未来 7 天日程 |
+| 测试状态 | 已修复并复测通过；本地与 `terminaltest` 生产实例均通过 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    └── /outlook
+        ├── Status Header
+        │   ├── h1 Outlook
+        │   ├── connection / MCP / provider badges
+        │   ├── mailbox / timezone / last refresh
+        │   ├── Inbox / Sent / Calendar stats
+        │   └── Refresh
+        ├── Error Card
+        ├── Warning Card
+        ├── View Tabs
+        │   ├── Inbox
+        │   ├── Sent
+        │   ├── Calendar
+        │   └── Settings
+        ├── Inbox / Sent
+        │   ├── Mailbox header
+        │   ├── Refresh / Previous / Next
+        │   └── Message rows
+        ├── Calendar
+        │   ├── Week header
+        │   ├── Previous week / This week / Next week / Refresh
+        │   └── Day cards
+        ├── Settings
+        │   ├── Connection settings form
+        │   ├── Test connection / Save and enable / Disconnect
+        │   ├── Test result panel
+        │   └── Connection status panel
+        ├── Message detail Dialog
+        │   ├── metadata panel
+        │   └── body preview
+        └── Event detail Dialog
+            ├── organizer / location / attendees
+            └── notes
+```
+
+## 3. 布局与响应式规则
+
+- 页面外层使用 `max-w-7xl`，移动端内边距为 `16px`，桌面端为 `24px`。
+- 顶部状态区有语义化 `h1`，长邮箱、时区和刷新时间允许容器内断行。
+- 已配置时显示 Inbox、Sent、Calendar、Settings；未配置时只显示 Settings。
+- 邮件列表和日程列表在移动端头部为上下布局，分页和刷新按钮可换行。
+- 邮件详情和日程详情 Dialog 在移动端使用 `left/right/top/bottom: 16px` 的独立面板，内容可滚动，不再被默认居中动画撑出视口。
+- 设置表单字段均有 `label htmlFor` 与 input `id` 绑定，支持可访问名称和自动化定位。
+- 输入框、主要按钮、分页按钮、刷新 icon、Dialog 关闭按钮均满足 `44px` 触控目标。
+- 邮件正文里的明文链接使用 `min-height: 44px` 的可点击区域，移动端更容易点击。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 初次加载已配置状态 | 打开 `/outlook` | 加载 status 后自动加载 overview | 顶部统计和 warning 不显示过期空值 | 正常 |
+| 刷新 Outlook | 点击 Refresh | 刷新 status/overview，并刷新当前 tab 数据 | 获取最新连接、邮件或日程状态 | 正常 |
+| 切换 Inbox/Sent/Calendar/Settings | 点击 tab | 切换视图，按需加载邮箱或日程数据 | 保持页面内工作流清晰 | 正常 |
+| 查看邮件详情 | 点击邮件行 | 打开邮件详情 Dialog，加载 message-detail | 阅读正文和收发件人信息 | 正常 |
+| 查看日程详情 | 点击日程卡片 | 打开日程详情 Dialog | 查看地点、参会人和说明 | 正常 |
+| 邮件分页 | 点击 Previous / Next | 使用当前 skip 加载上一页/下一页 | 浏览更多邮件 | 正常 |
+| 日程切周 | 点击 Previous week / This week / Next week | 更新 7 天范围并重新加载 events | 快速查看周视图 | 正常 |
+| 测试连接 | 填写必要字段后点击 Test connection | 显示 testing，成功后显示 sample 与 warning | 保存前验证配置可用 | 正常 |
+| 保存并启用 | 点击 Save and enable | 成功后清空密码、刷新状态并进入 Inbox | 完成 Outlook 接入 | 正常 |
+| 断开连接 | 点击 Disconnect 并确认 | 清空 overview、选中详情和分页缓存，回到 Settings | 防止误断开并恢复到配置状态 | 正常 |
+| 状态加载失败 | status 接口失败 | 显示错误卡 | 明确异常原因 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地 dev server `http://127.0.0.1:3080` 与生产实例 `terminaltest`；API 使用模拟数据，真实浏览器执行点击、输入、确认弹窗、分页、详情弹窗和截图。
+
+| 页面/状态 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| 邮件详情 | `390×844` | 无 | 0 | 可打开邮件详情，长主题、收件人、正文和链接均可读 |
+| 日程详情 | `390×844` | 无 | 0 | 可打开日程详情，长地点和参会人可断行 |
+| 设置表单 | `390×844` | 无 | 0 | 字段可通过 label 操作，测试/保存/断开流程正常 |
+| 状态错误 | `390×844` | 无 | 0 | 错误卡可读 |
+| 邮件详情 + 设置 | `320×568` | 无 | 0 | 窄屏无页面级横向滚动，Dialog 可滚动 |
+| 邮件详情 + 设置 | `390×844` | 无 | 0 | 手机竖屏布局稳定 |
+| 邮件详情 + 设置 | `844×390` 横屏 | 无 | 0 | 横屏不出现页面级横向滚动 |
+| 邮件详情 + 设置 | `768×1024` | 无 | 0 | 平板布局稳定 |
+| 邮件详情 + 设置 | `1365×900` | 无 | 0 | 桌面布局正常 |
+
+### 关键量化证据
+
+- 本地 Outlook 页 QA 自动化用例 `4 passed`。
+- 部署到 `terminaltest` 后，同一套 Outlook 页 QA 自动化用例 `4 passed`。
+- 覆盖已配置状态、overview 加载、Inbox、邮件详情、Calendar、日程详情、Settings、Test、Save、Disconnect confirm、状态错误和响应式。
+- 实测 `320×568`、`390×844`、`844×390`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 所有实测视口可见小触控目标数为 `0`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | 已配置 Outlook 初次进入页面不会主动加载 overview，顶部统计可能一直为 0 | `loadStatus` 在 configured 状态下自动加载 overview |
+| P1 | 设置表单 label 未绑定 input，辅助技术和自动化无法按字段名定位 | `Field` 增加 `htmlFor`，所有输入框增加稳定 `id` |
+| P1 | 邮件详情和日程详情 Dialog 在移动端会被默认居中/slide 动画撑出视口 | 移动端改为四边 inset 面板并覆盖 slide 偏移 |
+| P1 | 长邮箱、EWS URL、邮件主题、地点、参会人、warning 可能撑破布局 | 关键文本增加 `min-w-0`、`break-all` 或 `break-words` |
+| P2 | Refresh、分页、表单操作、Dialog 关闭等触控目标不足 | 统一提升到 `44px` |
+| P2 | 断开 Outlook 连接没有确认，误操作风险高 | Disconnect 前增加浏览器确认弹窗 |
+| P2 | 邮件正文中的明文链接触控高度过小 | 链接改为可换行的 `44px` 点击区域 |
+| P2 | 邮件/日程列表头部在移动端按钮挤压 | 头部改为移动端纵向布局，操作按钮可换行 |
+
+## 7. 剩余观察项
+
+- 本轮自动化使用模拟 Outlook API 数据；真实 EWS 超时、鉴权失败、HTML 邮件复杂表格和超大正文仍需持续观察。
+- 当前 Disconnect 使用浏览器原生确认弹窗，后续可统一为应用内确认 Dialog，以保持视觉一致性。
diff --git a/docs/ui-ux/pages/settings.md b/docs/ui-ux/pages/settings.md
new file mode 100644
index 0000000..852409e
--- /dev/null
+++ b/docs/ui-ux/pages/settings.md
@@ -0,0 +1,120 @@
+# 主应用：配置页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 配置 |
+| 主路由 | `/settings` |
+| 同实现路由 | `/status` |
+| 页面实现 | `app-instance/frontend/app/(app)/settings/page.tsx` re-export `app-instance/frontend/app/(app)/status/page.tsx` |
+| 关键组件 | `StatusPage`、Provider Dialog、Channel Detail Dialog、Connector Dialog、Restart Dialog、`InfoRow`、`Field` |
+| 核心任务 | 查看实例运行信息、调整智能体参数、配置模型提供商、配置/连接通道、查看通道事件、重启实例 |
+| 测试状态 | 已修复并复测通过；本地与 `terminaltest` 生产实例均通过 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    └── /settings
+        ├── Page Header
+        │   ├── h1 Settings
+        │   ├── 页面说明
+        │   └── Refresh
+        ├── Instance runtime Card
+        │   ├── Runtime Logs
+        │   ├── Restart instance
+        │   └── config/workspace InfoRow
+        ├── Agent configuration Card
+        │   ├── model InfoRow
+        │   ├── max tokens / temperature / max tool iterations
+        │   └── Save agent config
+        ├── Providers Card
+        │   └── provider button cards
+        ├── Provider Dialog
+        │   ├── enable switch
+        │   ├── model / API key / API base / timeout
+        │   └── Cancel / Save
+        ├── Channels Card
+        │   └── connector/channel button cards
+        ├── Channel Detail Dialog
+        │   ├── channel title and id
+        │   ├── connection settings
+        │   ├── credential fields
+        │   ├── policy fields
+        │   ├── channel state InfoRows
+        │   └── recent events
+        ├── Connector Dialog
+        │   ├── display name / domain / mode
+        │   ├── QR or plugin session
+        │   └── Close / Refresh / Start connection
+        └── Restart Dialog
+            ├── warning text
+            └── Cancel / Restart
+```
+
+## 3. 布局与响应式规则
+
+- `/settings` 和 `/status` 使用同一实现；当前文档按配置页维护。
+- 页面外层使用 `max-w-6xl`，移动端内边距为 `16px`，桌面端为 `24px`。
+- `InfoRow` 使用响应式网格，长配置路径、workspace、model、channel id 和 URL 都在容器内断行。
+- Provider 与 Channel 卡片是按钮语义，移动端单列，平板/桌面多列。
+- 所有 Dialog 移动端使用 `width: calc(100vw - 2rem)`、顶部 16px、最大高度 `calc(100vh - 2rem)`、内部滚动；桌面端保持居中面板。
+- Dialog 直接子元素统一 `min-w-0`，避免长标题或表单网格把弹窗撑出视口。
+- 输入框、按钮、下拉、tab、switch 等可见操作均满足 `44px` 触控目标。
+- 通道表单的 `Display name`、`Account ID` 等关键字段具备 label/input 绑定，可按标签点击和自动化定位。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 刷新配置 | 点击 Refresh | 重新调用 `/api/status` | 获取最新实例状态 | 正常 |
+| 打开运行日志 | 点击 Runtime Logs | 跳转 `/logs` | 进入运行排障入口 | 正常 |
+| 打开重启确认 | 点击 Restart instance | 打开确认 Dialog | 防止误重启 | 正常 |
+| 确认重启 | Dialog 点击 Restart | 调用 `/api/runtime/restart`，成功后关闭并延迟刷新 | 应用配置变更或恢复运行态 | 正常 |
+| 保存智能体配置 | 修改参数后点击 Save agent config | 校验数值并调用 `/api/agent-config` | 调整模型上下文和推理参数 | 正常 |
+| 打开 Provider | 点击 OpenAI/DeepSeek 等卡片 | 打开 Provider Dialog 并填入当前值 | 配置模型接入 | 正常 |
+| 保存 Provider | Dialog 点击 Save | 调用 `/api/providers/{id}/config`，成功后刷新 status | 启用或更新默认提供商 | 正常 |
+| 打开通道详情 | 点击已存在通道卡片 | 加载 `/api/channels/{id}/config` 和 events | 查看并编辑通道连接 | 正常 |
+| 保存通道配置 | Dialog 点击 Save channel config | 调用 `/api/channels/{id}/config`，必要时提示重启 | 更新 IM/终端通道配置 | 正常 |
+| 打开连接器 | 点击可启动的 Weixin/Feishu 卡片 | 打开连接器 Dialog | 启动扫码或插件接入流程 | 正常 |
+| 状态加载失败 | `/api/status` 失败 | 显示错误卡片和 Retry | 明确异常并提供恢复入口 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地 dev server `http://127.0.0.1:3080` 与生产实例 `terminaltest`；API 使用模拟数据，真实浏览器执行点击、输入、弹窗保存、重启确认和截图。
+
+| 页面/状态 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| 配置页 + 飞书通道弹窗 | `320×568` | 无 | 0 | 长 config path、workspace、provider 名和 channel id 均不越界 |
+| 配置页 + 飞书通道弹窗 | `390×844` | 无 | 0 | 可保存智能体、Provider、通道配置并打开重启确认 |
+| 配置页 + 飞书通道弹窗 | `844×390` 横屏 | 无 | 0 | 横屏 Dialog 可滚动，不撑出页面 |
+| 配置页 + 飞书通道弹窗 | `768×1024` | 无 | 0 | 平板布局稳定 |
+| 配置页 + 飞书通道弹窗 | `1365×900` | 无 | 0 | 桌面卡片和 Dialog 布局正常 |
+| 状态错误 | `390×844` | 无 | 0 | 错误文案和 Retry 可读可点 |
+
+### 关键量化证据
+
+- 本地与 `terminaltest` 市场/配置组合 QA 自动化用例均 `4 passed`，其中覆盖配置流。
+- 覆盖智能体配置保存、OpenAI Provider 保存、Feishu 通道保存、重启确认、状态错误和响应式。
+- 实测 `320×568`、`390×844`、`844×390`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 所有实测视口可见小触控目标数为 `0`。
+- 本地截图保存在 `/tmp/beaver-market-settings-qa-local-shots`，生产截图保存在 `/tmp/beaver-market-settings-qa-prod-shots`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | 配置页 Dialog 在移动端按桌面宽度居中，长内容会撑出或被裁切 | 基础 `DialogContent` 增加移动端 `calc(100vw - 2rem)` 宽度、最大高度、滚动和 `min-w-0` |
+| P1 | `InfoRow` 的长路径固定 `max-w-[400px] truncate`，在窄屏撑破页面 | 改为响应式网格和 `break-all` |
+| P1 | 通道表单关键 label 未绑定输入框，真实点击标签和自动化定位不稳定 | `Field` 支持 `htmlFor`，关键字段增加稳定 `id` |
+| P2 | Provider、Channel 卡片长名称和 channel id 可能撑宽 | 卡片内部增加 `min-w-0`、`break-all` 和可换行文本 |
+| P2 | Button/Input/Select/Tabs 触控高度不足或不统一 | 基础组件统一提升到 44px 级别 |
+| P2 | 通道最近事件时间和状态长文本可能挤压 | 改为移动端纵向布局并断行 |
+| P3 | 错误文案和保存提示可能被长文本撑开 | 增加 `break-words` |
+
+## 7. 剩余观察项
+
+- 本轮使用模拟 provider/channel 数据；真实第三方连接器返回超长错误、二维码图片或异常 instructions 时仍需抽样验证。
+- `/settings` 与 `/status` 共用同一实现，后续如果产品语义拆分，需要分别维护两份页面文档。
diff --git a/docs/ui-ux/pages/skills.md b/docs/ui-ux/pages/skills.md
new file mode 100644
index 0000000..171a047
--- /dev/null
+++ b/docs/ui-ux/pages/skills.md
@@ -0,0 +1,121 @@
+# 主应用：技能页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | 技能管理 |
+| 主路由 | `/skills` |
+| 候选子页 | `/skills?tab=candidates` |
+| 草稿评审子页 | `/skills?tab=drafts` |
+| 页面实现 | `app-instance/frontend/app/(app)/skills/page.tsx` |
+| 关键组件 | `PublishedSkillsTable`、`CandidateCard`、`DraftCard`、`SafetyReportPanel`、`EvalReportPanel`、`RawDetails`、`UploadSkillForm` |
+| 核心任务 | 查看已发布技能、打开技能详情、上传技能、处理学习候选、生成草稿、提交/批准/拒绝/复检/发布草稿 |
+| 测试状态 | 已修复并复测通过；本地与 `terminaltest` 生产实例均通过 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    └── /skills
+        ├── Page Header
+        │   ├── h1 Skills
+        │   ├── Refresh
+        │   └── Upload skill
+        ├── Error Card
+        ├── UploadSkillForm
+        ├── SkillDetailView
+        │   ├── Overview
+        │   ├── Files
+        │   ├── Versions
+        │   └── Download / Rollback / Disable / Delete
+        └── Tabs
+            ├── Published
+            │   ├── < md：技能卡片列表
+            │   └── >= md：技能表格
+            ├── Candidates
+            │   └── CandidateCard
+            │       ├── 状态、风险、置信度
+            │       ├── 候选理由和影响范围
+            │       ├── 原始候选数据
+            │       └── Ignore / Synthesize draft / Regenerate
+            └── Draft review
+                └── DraftCard
+                    ├── 状态、safety、eval badge
+                    ├── 草稿说明和元数据
+                    ├── Submit / Approve / Reject / Recheck / Publish
+                    ├── Proposed skill body
+                    ├── Publish gates
+                    ├── Raw draft payload
+                    ├── Safety report
+                    └── Eval report
+```
+
+## 3. 布局与响应式规则
+
+- 页面外层使用 `max-w-6xl` 和响应式内边距：移动端 `16px`，桌面端 `24px`。
+- tabs 是受控状态，并同步到 URL：候选为 `?tab=candidates`，草稿评审为 `?tab=drafts`。
+- `runAction -> load()` 后不会再把候选或草稿评审重置到 Published。
+- 移动端 Published 不显示宽表格，改为技能卡片；桌面端保留表格以便扫描。
+- Candidates 和 Draft review 的卡片、Markdown、JSON、长 id 都使用容器内断行和 `min-w-0/max-w-full`。
+- 草稿评审的 eval replay cases 在移动端显示卡片，桌面端显示表格。
+- 原始数据 `details/summary` 的点击高度为 `44px`。
+- 主要操作按钮均达到 `44px` 触控目标。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 切换 Published | 点击 Published tab | URL 移除 `tab` 参数 | 回到已发布技能列表 | 正常 |
+| 切换 Candidates | 点击 Candidates tab | URL 变为 `/skills?tab=candidates` | 处理学习候选 | 正常 |
+| 切换 Draft review | 点击 Draft review tab | URL 变为 `/skills?tab=drafts` | 审核和发布草稿 | 正常 |
+| 刷新技能页 | 点击 Refresh | 重新拉取已发布、候选、草稿数据 | 获取最新技能状态 | 正常 |
+| 上传技能 | 点击 Upload skill | 展开上传表单，上传成功后刷新 | 将本地技能包进入草稿评审 | 正常 |
+| 打开技能详情 | 点击 Published 技能 | 显示 `SkillDetailView` | 查看版本、文件和内容 | 正常 |
+| 生成草稿 | Candidates 点击 Synthesize draft | 调用候选 draft 接口，刷新数据后仍停留 Candidates | 不打断候选处理上下文 | 正常 |
+| 忽略候选 | Candidates 点击 Ignore | 本地隐藏该候选 | 快速清理不处理候选 | 正常 |
+| 送审草稿 | Draft review 点击 Submit | 调用 submit 接口，刷新后仍停留 Draft review | 进入人工评审流程 | 正常 |
+| 批准草稿 | Draft review 点击 Approve | 调用 approve 接口，刷新后仍停留 Draft review | 满足发布门禁前置 | 正常 |
+| 拒绝草稿 | Draft review 点击 Reject | 调用 reject 接口，刷新后仍停留 Draft review | 阻止不合格草稿继续发布 | 正常 |
+| 复检安全 | Draft review 点击 Recheck | 调用 safety 接口，刷新后仍停留 Draft review | 获取最新安全结论 | 正常 |
+| 发布草稿 | Draft review 点击 Publish | 满足门禁后调用 publish；高风险需要确认 | 将草稿转为已发布技能 | 正常 |
+| 展开原始数据 | 点击 Raw details summary | 展开/收起 JSON | 为审核提供可追溯原始数据 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地 dev server `http://127.0.0.1:3080` 与生产实例 `terminaltest`；API 使用模拟数据，真实浏览器执行点击、输入、跳转和截图。
+
+| 页面 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| Candidates | `390×844` | 无 | 0 | 生成草稿后仍停留候选页 |
+| Draft review | `390×844` | 无 | 0 | 送审和批准后仍停留草稿评审页 |
+| Draft review | `320×568` | 无 | 0 | 长 draft id、Markdown、eval cases 均未撑破页面 |
+| Draft review | `390×844` | 无 | 0 | 手机竖屏可完成审核操作 |
+| Draft review | `844×390` 横屏 | 无 | 0 | 横屏不出现页面级横向滚动 |
+| Draft review | `768×1024` | 无 | 0 | 平板布局稳定 |
+| Draft review | `1365×900` | 无 | 0 | 桌面布局正常 |
+
+### 关键量化证据
+
+- 本地技能页 QA 自动化用例 `3 passed`。
+- 部署到 `terminaltest` 后，同一套技能页 QA 自动化用例 `3 passed`。
+- 候选页点击 `Synthesize draft` 后 active tab 仍为 `Candidates`。
+- 草稿评审点击 `Submit` 和 `Approve` 后 active tab 仍为 `Draft review`。
+- Draft review 实测 `320×568`、`390×844`、`844×390`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 所有实测视口可见小触控目标数为 `0`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | Candidates 和 Draft review 中执行任意异步操作后会回到 Published | tabs 从 `defaultValue` 改为受控 `value`，并同步 URL `tab` 参数 |
+| P1 | 草稿页 `320px` 下长 draft id、Markdown、评估表格会造成横向撑开风险 | 卡片、Markdown、JSON、长文本统一加容器内断行；eval cases 小屏改卡片 |
+| P2 | Published 移动端使用宽表格，操作列容易隐藏 | `< md` 改为技能卡片，`>= md` 保留表格 |
+| P2 | 多个按钮、icon 操作和 Raw details summary 触控高度不足 | 统一提升到 `44px`，icon-only 按钮补充可访问名称 |
+| P2 | 候选/草稿 tab 无 URL 状态，刷新或分享不能保留子页 | 增加 `?tab=candidates` 和 `?tab=drafts` |
+
+## 7. 剩余观察项
+
+- 本轮自动化使用模拟数据覆盖长 id、长 Markdown、候选和草稿状态转换；真实后端极端数据仍需在后续页面联测中持续观察。
+- 发布高风险草稿的确认分支没有在本轮自动化里实际确认发布，只验证了普通草稿审核路径。
diff --git a/docs/ui-ux/pages/task-management.md b/docs/ui-ux/pages/task-management.md
new file mode 100644
index 0000000..3bd8052
--- /dev/null
+++ b/docs/ui-ux/pages/task-management.md
@@ -0,0 +1,144 @@
+# 主应用：Task 任务页 UI/UX
+
+## 1. 页面定义
+
+| 项目 | 内容 |
+| --- | --- |
+| 页面名称 | Task 任务管理 |
+| 普通任务路由 | `/tasks` |
+| 定时任务子页 | `/tasks?tab=scheduled` |
+| 任务详情路由 | `/tasks/[taskId]` |
+| 页面实现 | `app-instance/frontend/app/(app)/tasks/page.tsx`、`app-instance/frontend/app/(app)/tasks/[taskId]/page.tsx` |
+| 关键组件 | `TaskManagementTabs`、`TaskLiveHeader`、`TaskTimeline`、`TaskTimelineCard`、`TaskSideRail`、`TaskAcceptanceControls` |
+| 核心任务 | 查看任务列表、进入任务详情、删除任务、管理定时任务、查看任务时间线、提交验收反馈 |
+| 测试状态 | 已修复并复测通过；普通任务、定时任务、任务详情和缺省态在实测视口均无横向越界 |
+
+## 2. 信息架构与组件层级
+
+```text
+AppShell
+└── main.pt-16
+    ├── /tasks
+    │   ├── Page Header
+    │   │   ├── h1 Tasks
+    │   │   ├── 页面说明
+    │   │   └── TaskManagementTabs
+    │   ├── OrdinaryTasks
+    │   │   ├── Loading Card
+    │   │   ├── Empty Card
+    │   │   ├── < xl：OrdinaryTaskCard 列表
+    │   │   └── >= xl：任务表格
+    │   └── ScheduledTasks
+    │       ├── 辅助说明
+    │       ├── 刷新 / 新建定时任务
+    │       ├── AddJobForm
+    │       ├── < xl：ScheduledJobCard 列表
+    │       └── >= xl：定时任务表格
+    └── /tasks/[taskId]
+        ├── TaskLiveHeader                 sticky top: 65px，避让全局头部
+        └── main grid
+            ├── 主列
+            │   ├── 删除任务
+            │   └── TaskTimeline
+            │       ├── 任务创建
+            │       ├── 计划 / 工具 / Agent / 产物 / 结果卡片
+            │       ├── Details JSON 展开区
+            │       └── TaskAcceptanceControls
+            └── TaskSideRail
+                ├── 任务状态
+                ├── 活跃运行
+                ├── 最新提醒
+                ├── Agent team
+                └── 产物
+```
+
+## 3. 布局与响应式规则
+
+### 普通任务列表
+
+- 页面外层使用 `max-w-7xl` 和响应式内边距。
+- `< xl` 视口显示任务卡片，不再显示宽表格；状态、来源、运行数、技能数、更新时间和操作全部在卡片内可见。
+- `>= xl` 视口显示完整表格，适合批量扫描和横向比较。
+- 加载状态显示独立 loading card，不会在接口返回前误显示“暂无普通任务”。
+- 删除任务前使用浏览器确认，取消后不改变列表，确认后从列表移除。
+
+### 定时任务子页
+
+- `< xl` 视口显示定时任务卡片，避免将“历史、状态、操作”藏在内部横向滚动表格右侧。
+- `>= xl` 视口显示表格。
+- 新建表单以内联卡片展示，包含任务名称、调度类型、调度参数、任务消息、来源会话说明、取消和创建。
+- 定时任务删除前需要确认，降低误删风险。
+- Switch、运行、删除、历史、刷新、新建等入口均有可访问名称和 44px 触控目标。
+
+### 任务详情
+
+- `TaskLiveHeader` 为 sticky，固定在全局头部下方 `65px`，避免与全局 header 的边框重叠。
+- 主内容在 `xl` 以下单列排列：时间线在前，侧栏在后。
+- `xl` 及以上使用 `minmax(0,1fr) + 360px` 双栏：左侧时间线，右侧状态和产物。
+- 主列、侧栏、卡片和 JSON 区均使用 `min-w-0`、`max-w-full` 和受控换行，防止长 run id、session id、JSON 或产物标题撑破页面。
+- `Details JSON` 的 summary 命中高度为 44px，支持触控展开。
+
+## 4. 操作与 UX 逻辑
+
+| 操作 | 触发方式 | 状态变化与反馈 | UX 目的 | 当前结果 |
+| --- | --- | --- | --- | --- |
+| 切换普通/定时任务 | 点击 TaskManagementTabs | URL 在 `/tasks` 与 `/tasks?tab=scheduled` 间切换，当前 tab 高亮 | 区分用户任务和自动触发任务 | 正常 |
+| 普通任务进入详情 | 点击“进入任务 / Open task” | 跳转 `/tasks/[taskId]` | 查看时间线、运行过程和验收 | 正常 |
+| 删除普通任务 | 点击删除按钮后确认 | 取消不变；确认后调用 `DELETE /api/tasks/[id]` 并移除行/卡片 | 防止误删，保持列表干净 | 正常 |
+| 刷新定时任务 | 点击刷新 | 重新调用定时任务列表接口 | 获取最新调度状态 | 正常 |
+| 新建定时任务 | 点击新建，填写表单并创建 | 提交 `POST /api/cron/jobs`，成功后收起表单并刷新列表 | 创建自动提醒入口 | 正常 |
+| 切换定时任务启用 | 点击 Switch | 调用 toggle 接口，刷新列表 | 快速暂停/恢复自动任务 | 正常 |
+| 立即运行定时任务 | 点击播放按钮 | 调用 run 接口，刷新列表 | 手动触发一次计划任务 | 正常 |
+| 删除定时任务 | 点击删除按钮后确认 | 取消不变；确认后调用删除接口并刷新列表 | 防止误删自动任务 | 正常 |
+| 返回任务列表 | 详情页点击 Back to tasks | 返回 `/tasks` | 提供明确退出路径 | 正常 |
+| 返回对话 | 详情页点击 Chat | 返回 `/` | 回到任务来源工作台 | 正常 |
+| 跳到验收区 | 点击 Review | 定位到当前结果验收卡片 | 减少长时间线中的查找成本 | 正常 |
+| 展开 Details JSON | 点击 summary | 展开或收起 JSON 明细 | 为调试和审计保留细节 | 正常 |
+| 提交修改意见 | 填写验收说明，点击 Needs revision | 调用 `/api/chat/acceptance`，提交 `revise` 和 comment | 将验收反馈记录到当前 run | 正常 |
+| 下载产物 | 点击 Download | 对内联产物生成下载 | 获取任务输出 | 正常 |
+| 任务不存在 | 访问缺失 task id | 显示“任务不存在”和返回任务列表 | 明确异常恢复路径 | 正常 |
+
+## 5. 响应式测试矩阵
+
+测试日期：2026-06-04。浏览器：Playwright Chromium。环境：本地生产构建 `next build` + `next start` 以及实际 `terminaltest` 实例；API 使用模拟数据，所有布局和交互在真实浏览器中执行。
+
+| 页面 | 视口 | 横向越界 | 小触控目标 | 关键结论 |
+| --- | --- | --- | --- | --- |
+| 普通任务 | `320×568` | 无 | 0 | 卡片信息完整，操作可见 |
+| 普通任务 | `390×844` | 无 | 0 | 手机竖屏可直接进入和删除 |
+| 普通任务 | `844×390` 横屏 | 无 | 0 | 横屏不需要页面横向滚动 |
+| 普通任务 | `768×1024` | 无 | 0 | 平板单列卡片正常 |
+| 普通任务 | `1024×768` | 无 | 0 | 窄桌面单列卡片正常 |
+| 普通任务 | `1365×900` | 无 | 0 | 宽屏表格正常 |
+| 定时任务 | `390×844` | 无 | 0 | 定时任务卡片完整显示历史、状态和操作 |
+| 任务详情 | `320×568` | 无 | 0 | 长 session id、JSON、验收区均未撑破页面 |
+| 任务详情 | `390×844` | 无 | 0 | sticky 头部避让全局头部 |
+| 任务详情 | `768×1024` | 无 | 0 | 单列详情和侧栏顺序正常 |
+| 任务详情 | `1365×900` | 无 | 0 | 双栏详情正常，侧栏产物可下载 |
+
+### 关键量化证据
+
+- 普通任务所有实测视口 `scrollWidth === clientWidth`。
+- 定时任务 `390×844` 视口 `scrollWidth === clientWidth`。
+- 任务详情 `320×568`、`390×844`、`768×1024`、`1365×900` 均无页面级横向越界。
+- 任务详情 sticky 头部实测 `globalBottom=65`、`taskTop=65`、`overlapsGlobal=false`。
+- 最终复测中所有检查视口可见小触控目标数为 `0`。
+- 部署到 `terminaltest` 后，同一套 Task QA 自动化用例 `14 passed`。
+
+## 6. 已修复问题
+
+| 等级 | 问题 | 修复 |
+| --- | --- | --- |
+| P1 | 普通任务和定时任务在手机端只露出表格左侧，核心操作藏在内部横向滚动区 | `< xl` 改为卡片布局，宽屏保留表格 |
+| P1 | 任务详情在 `320px` 和 `390px` 被时间线内容撑到约 `626px`，产生页面级横向越界 | 主列、卡片、侧栏加入 `min-w-0/max-w-full`，控制长文本和 JSON |
+| P1 | 任务详情 sticky 头部滚动后与全局固定头部重叠 | sticky top 改为 `65px`，避让全局 header 和边框 |
+| P1 | React Strict Mode 下任务详情 `mountedRef` 清理后不恢复，详情可能停留在“任务不存在/加载中” | effect 挂载时重置 `mountedRef.current = true` |
+| P2 | 定时任务删除无确认 | 删除前增加确认弹窗 |
+| P2 | 定时任务播放/删除图标按钮无可访问名称且目标偏小 | 补充 `aria-label/title`，扩大到 44px |
+| P2 | tabs、summary、switch 等控件命中高度不足 44px | 统一提高到 44px 触控目标 |
+| P2 | 普通任务首次加载可能误显示空状态 | 增加 loading 状态 |
+
+## 7. 剩余观察项
+
+- 本轮自动化使用模拟 API 数据验证布局和交互；真实后端数据的极端状态仍需在后续页面联测中持续观察。
+- Playwright 报告中存在一次 404 控制台日志，来源为浏览器资源请求，不影响 Task 页面核心 API 与交互。
diff --git a/external-connector/external_connector/app.py b/external-connector/external_connector/app.py
index 3f646ee..3c29924 100644
--- a/external-connector/external_connector/app.py
+++ b/external-connector/external_connector/app.py
@@ -13,7 +13,9 @@ def create_app(*, provider: ConnectorProvider, api_token: str) -> FastAPI:
     app = FastAPI(title="External Connector")
 
     def require_auth(authorization: str | None) -> None:
-        if api_token and authorization != f"Bearer {api_token}":
+        if not api_token:
+            raise HTTPException(status_code=503, detail="Connector API token is not configured")
+        if authorization != f"Bearer {api_token}":
             raise HTTPException(status_code=401, detail="Invalid connector token")
 
     @app.get("/health")
diff --git a/external-connector/external_connector/node/feishu_event_utils.js b/external-connector/external_connector/node/feishu_event_utils.js
new file mode 100644
index 0000000..916eae3
--- /dev/null
+++ b/external-connector/external_connector/node/feishu_event_utils.js
@@ -0,0 +1,216 @@
+function bridgeEventFromFeishu(data, env) {
+  const message = objectValue(data.message);
+  const sender = objectValue(data.sender);
+  const senderId = objectValue(sender.sender_id);
+  const isGroup = message.chat_type === "group";
+  const peerId = isGroup
+    ? stringValue(message.chat_id || "")
+    : stringValue(senderId.open_id || senderId.user_id || "");
+  const userId = stringValue(senderId.open_id || senderId.user_id || "");
+  const messageId = stringValue(message.message_id || randomId());
+  const eventId = stringValue(data.event_id || data.eventId || `${env.channelId}:${messageId}`);
+  return {
+    eventId,
+    timestamp: new Date().toISOString(),
+    deliveryAttempt: 1,
+    connectionId: env.connectionId,
+    channelId: env.channelId,
+    kind: "feishu",
+    accountId: env.accountId,
+    peerId,
+    peerType: isGroup ? "group" : "dm",
+    userId,
+    threadId: stringValue(message.chat_id || "") || null,
+    messageId,
+    messageType: stringValue(message.message_type || "text"),
+    content: extractText(message),
+    metadata: {
+      chatId: message.chat_id || null,
+      rawMessageType: message.message_type || null,
+      senderType: sender.sender_type || null,
+    },
+  };
+}
+
+function bridgeEventFromNormalizedMessage(message, env, options = {}) {
+  const maxMessageChars = positiveInt(options.maxMessageChars, 20000);
+  const content = normalizedContent(message).trim();
+  if (!content || content.length > maxMessageChars) {
+    return null;
+  }
+  const isGroup = message.chatType === "group";
+  const messageId = stringValue(message.messageId || randomId());
+  const chatId = stringValue(message.chatId || "");
+  const senderId = stringValue(message.senderId || "");
+  const eventId = stringValue(rawEventId(message.raw) || `${env.channelId}:${messageId}`);
+  return {
+    eventId,
+    timestamp: new Date().toISOString(),
+    deliveryAttempt: 1,
+    connectionId: env.connectionId,
+    channelId: env.channelId,
+    kind: "feishu",
+    accountId: env.accountId,
+    peerId: isGroup ? chatId : senderId,
+    peerType: isGroup ? "group" : "dm",
+    userId: senderId,
+    threadId: chatId || null,
+    messageId,
+    messageType: stringValue(message.rawContentType || "text"),
+    content,
+    metadata: {
+      chatId: chatId || null,
+      rawMessageType: message.rawContentType || null,
+      senderName: message.senderName || null,
+      mentions: Array.isArray(message.mentions) ? message.mentions : [],
+      mentionAll: Boolean(message.mentionAll),
+      mentionedBot: Boolean(message.mentionedBot),
+      resources: Array.isArray(message.resources) ? message.resources : [],
+      createTime: message.createTime || null,
+      rootId: message.rootId || null,
+      threadId: message.threadId || null,
+      replyToMessageId: message.replyToMessageId || null,
+    },
+  };
+}
+
+function buildChannelOptions({ appId, appSecret, domain, policy }) {
+  const resolvedPolicy = policy || parsePolicyEnv(process.env);
+  return {
+    appId,
+    appSecret,
+    domain,
+    includeRawEvent: true,
+    source: "beaver",
+    handshakeTimeoutMs: 15000,
+    wsConfig: { pingTimeout: 10 },
+    policy: {
+      requireMention: resolvedPolicy.requireMentionInGroups,
+      respondToMentionAll: resolvedPolicy.respondToMentionAll,
+      dmMode: resolvedPolicy.dmMode,
+      dmAllowlist: resolvedPolicy.allowFrom,
+      groupAllowlist: resolvedPolicy.groupAllowFrom,
+    },
+    safety: {
+      chatQueue: { enabled: true },
+      staleMessageWindowMs: positiveInt(resolvedPolicy.staleMessageWindowMs, 10 * 60 * 1000),
+      batch: {
+        text: {
+          delayMs: positiveInt(resolvedPolicy.textBatchDelayMs, 0),
+          maxMessages: positiveInt(resolvedPolicy.textBatchMaxMessages, 10),
+          maxChars: positiveInt(resolvedPolicy.textBatchMaxChars, resolvedPolicy.maxMessageChars),
+        },
+      },
+    },
+    outbound: {
+      textChunkLimit: resolvedPolicy.maxMessageChars,
+      retry: { maxAttempts: 3, baseDelayMs: 500 },
+      ssrfGuard: true,
+    },
+  };
+}
+
+function parsePolicyEnv(env) {
+  return {
+    requireMentionInGroups: envBool(env.FEISHU_REQUIRE_MENTION_IN_GROUPS, true),
+    respondToMentionAll: envBool(env.FEISHU_RESPOND_TO_MENTION_ALL, false),
+    dmMode: stringValue(env.FEISHU_DM_MODE || "open") || "open",
+    allowFrom: envList(env.FEISHU_ALLOW_FROM || env.FEISHU_DM_ALLOW_FROM || ""),
+    groupAllowFrom: envList(env.FEISHU_GROUP_ALLOW_FROM || ""),
+    maxMessageChars: positiveInt(env.FEISHU_MAX_MESSAGE_CHARS, 20000),
+    textBatchDelayMs: positiveInt(env.FEISHU_TEXT_BATCH_DELAY_MS, 0),
+    textBatchMaxMessages: positiveInt(env.FEISHU_TEXT_BATCH_MAX_MESSAGES, 10),
+    textBatchMaxChars: positiveInt(env.FEISHU_TEXT_BATCH_MAX_CHARS, 20000),
+    staleMessageWindowMs: positiveInt(env.FEISHU_STALE_MESSAGE_WINDOW_MS, 10 * 60 * 1000),
+  };
+}
+
+function ignoreReason(data) {
+  const sender = objectValue(data.sender);
+  const senderType = stringValue(sender.sender_type || "").toLowerCase();
+  if (senderType && senderType !== "user") {
+    return `sender_type:${senderType}`;
+  }
+  const content = extractText(objectValue(data.message)).trim();
+  if (content.startsWith("/feishu")) {
+    return "feishu_command";
+  }
+  return "";
+}
+
+function normalizedContent(message) {
+  const parts = [stringValue(message.content || "")];
+  const resources = Array.isArray(message.resources) ? message.resources : [];
+  for (const resource of resources) {
+    if (!resource || typeof resource !== "object") {
+      continue;
+    }
+    const type = stringValue(resource.type || "file");
+    const fileName = stringValue(resource.fileName || "");
+    parts.push(`[${type}${fileName ? `: ${fileName}` : ""}]`);
+  }
+  return parts.filter((part) => part.trim()).join("\n");
+}
+
+function rawEventId(raw) {
+  const rawObject = objectValue(raw);
+  const header = objectValue(rawObject.header);
+  return rawObject.event_id || rawObject.eventId || header.event_id || header.eventId || "";
+}
+
+function extractText(message) {
+  const content = message.content;
+  if (typeof content !== "string") {
+    return "";
+  }
+  try {
+    const parsed = JSON.parse(content);
+    if (parsed && parsed.text != null) {
+      return String(parsed.text);
+    }
+  } catch (_error) {
+    return content;
+  }
+  return content;
+}
+
+function envList(value) {
+  return stringValue(value)
+    .replace(/\n/g, ",")
+    .split(",")
+    .map((item) => item.trim())
+    .filter(Boolean);
+}
+
+function envBool(value, defaultValue) {
+  if (value == null || value === "") {
+    return defaultValue;
+  }
+  return ["1", "true", "yes", "on"].includes(String(value).trim().toLowerCase());
+}
+
+function positiveInt(value, defaultValue) {
+  const number = Number.parseInt(String(value ?? ""), 10);
+  return Number.isFinite(number) && number > 0 ? number : defaultValue;
+}
+
+function objectValue(value) {
+  return value && typeof value === "object" ? value : {};
+}
+
+function stringValue(value) {
+  return value == null ? "" : String(value);
+}
+
+function randomId() {
+  return `${Date.now()}-${Math.random().toString(16).slice(2)}`;
+}
+
+module.exports = {
+  bridgeEventFromFeishu,
+  bridgeEventFromNormalizedMessage,
+  buildChannelOptions,
+  ignoreReason,
+  extractText,
+  parsePolicyEnv,
+};
diff --git a/external-connector/external_connector/node/feishu_ws_receiver.js b/external-connector/external_connector/node/feishu_ws_receiver.js
index 8f31bd7..163b0fe 100644
--- a/external-connector/external_connector/node/feishu_ws_receiver.js
+++ b/external-connector/external_connector/node/feishu_ws_receiver.js
@@ -1,4 +1,9 @@
 const Lark = require("@larksuiteoapi/node-sdk");
+const {
+  bridgeEventFromNormalizedMessage,
+  buildChannelOptions,
+  parsePolicyEnv,
+} = require("./feishu_event_utils");
 
 const appId = requireEnv("FEISHU_APP_ID");
 const appSecret = requireEnv("FEISHU_APP_SECRET");
@@ -10,99 +15,78 @@ const bridgeToken = requireEnv("BEAVER_BRIDGE_TOKEN");
 const domain = (process.env.FEISHU_DOMAIN || "feishu").toLowerCase() === "lark"
   ? Lark.Domain.Lark
   : Lark.Domain.Feishu;
+const policy = parsePolicyEnv(process.env);
+const env = { connectionId, channelId, accountId };
 
-const wsClient = new Lark.WSClient({
-  appId,
-  appSecret,
-  domain,
-  loggerLevel: Lark.LoggerLevel.info,
-  onReady: () => log("feishu_ws_ready", {}),
-  onError: (error) => log("feishu_ws_error", { error: redact(String(error && error.message ? error.message : error)) }),
-  onReconnecting: () => log("feishu_ws_reconnecting", {}),
-  onReconnected: () => log("feishu_ws_reconnected", {}),
-  handshakeTimeoutMs: 15000,
-  wsConfig: { pingTimeout: 10 },
-});
-
-const dispatcher = new Lark.EventDispatcher({}).register({
-  "im.message.receive_v1": async (data) => {
-    const event = bridgeEventFromFeishu(data);
+const channel = Lark.createLarkChannel(buildChannelOptions({ appId, appSecret, domain, policy }));
+channel.on({
+  message: async (message) => {
+    const event = bridgeEventFromNormalizedMessage(message, env, { maxMessageChars: policy.maxMessageChars });
+    if (!event) {
+      log("feishu_inbound_ignored", {
+        connectionId,
+        messageId: message.messageId,
+        reason: "empty_or_oversized",
+      });
+      return;
+    }
     log("feishu_inbound_message", {
       connectionId,
       eventId: event.eventId,
       messageId: event.messageId,
       peerId: event.peerId,
+      peerType: event.peerType,
       textLength: event.content.length,
     });
     await postJson(`${bridgeBaseUrl}/api/channel-connector-bridge/events`, event);
   },
+  reject: (event) => {
+    log("feishu_inbound_ignored", {
+      connectionId,
+      messageId: event.messageId,
+      peerId: event.chatId,
+      userId: event.senderId,
+      reason: event.reason,
+    });
+  },
+  error: (error) => {
+    log("feishu_ws_error", {
+      connectionId,
+      code: error.code || "unknown",
+      error: redact(String(error && error.message ? error.message : error)),
+    });
+  },
+  reconnecting: () => log("feishu_ws_reconnecting", { connectionId }),
+  reconnected: () => log("feishu_ws_reconnected", { connectionId }),
 });
 
 process.on("SIGTERM", () => {
-  wsClient.close({ force: true });
-  process.exit(0);
+  channel.disconnect().finally(() => process.exit(0));
 });
 process.on("SIGINT", () => {
-  wsClient.close({ force: true });
-  process.exit(0);
+  channel.disconnect().finally(() => process.exit(0));
 });
 
-wsClient.start({ eventDispatcher: dispatcher }).catch((error) => {
+channel.connect().then(() => {
+  log("feishu_ws_ready", {
+    connectionId,
+    requireMentionInGroups: policy.requireMentionInGroups,
+    dmMode: policy.dmMode,
+    groupAllowlistSize: policy.groupAllowFrom.length,
+    dmAllowlistSize: policy.allowFrom.length,
+  });
+}).catch((error) => {
   log("feishu_ws_start_failed", { error: redact(String(error && error.message ? error.message : error)) });
   process.exit(1);
 });
 
 setInterval(() => {
-  if (typeof wsClient.getConnectionStatus === "function") {
-    log("feishu_ws_status", wsClient.getConnectionStatus());
+  const status = channel.getConnectionStatus();
+  if (status) {
+    log("feishu_ws_status", { connectionId, ...status });
   }
 }, 60000).unref();
 
-function bridgeEventFromFeishu(data) {
-  const message = objectValue(data.message);
-  const sender = objectValue(data.sender);
-  const senderId = objectValue(sender.sender_id);
-  const peerId = stringValue(senderId.open_id || senderId.user_id || "");
-  const messageId = stringValue(message.message_id || randomId());
-  const eventId = stringValue(data.event_id || data.eventId || `${channelId}:${messageId}`);
-  return {
-    eventId,
-    timestamp: new Date().toISOString(),
-    deliveryAttempt: 1,
-    connectionId,
-    channelId,
-    kind: "feishu",
-    accountId,
-    peerId,
-    peerType: message.chat_type === "group" ? "group" : "dm",
-    userId: peerId,
-    threadId: stringValue(message.chat_id || "") || null,
-    messageId,
-    messageType: stringValue(message.message_type || "text"),
-    content: extractText(message),
-    metadata: {
-      chatId: message.chat_id || null,
-      rawMessageType: message.message_type || null,
-    },
-  };
-}
-
-function extractText(message) {
-  const content = message.content;
-  if (typeof content !== "string") {
-    return "";
-  }
-  try {
-    const parsed = JSON.parse(content);
-    if (parsed && parsed.text != null) {
-      return String(parsed.text);
-    }
-  } catch (_error) {
-    return content;
-  }
-  return content;
-}
-
 async function postJson(url, payload) {
   const response = await fetch(url, {
     method: "POST",
@@ -126,18 +110,6 @@ function requireEnv(name) {
   return value;
 }
 
-function objectValue(value) {
-  return value && typeof value === "object" ? value : {};
-}
-
-function stringValue(value) {
-  return value == null ? "" : String(value);
-}
-
-function randomId() {
-  return `${Date.now()}-${Math.random().toString(16).slice(2)}`;
-}
-
 function log(event, fields) {
   console.log(JSON.stringify({ event, ...fields }));
 }
diff --git a/external-connector/external_connector/providers/feishu_bot.py b/external-connector/external_connector/providers/feishu_bot.py
index 8dead95..40b713f 100644
--- a/external-connector/external_connector/providers/feishu_bot.py
+++ b/external-connector/external_connector/providers/feishu_bot.py
@@ -89,6 +89,7 @@ class FeishuBotProvider:
         verification_token = str(options.get("verificationToken") or options.get("verification_token") or "").strip()
         mode = str(options.get("mode") or "create").strip().lower()
         domain = _domain(options)
+        metadata.update(_policy_metadata(options))
         if not app_id or not app_secret:
             if mode != "link":
                 return self._start_registration_session(session, metadata=metadata, domain=domain)
@@ -157,34 +158,44 @@ class FeishuBotProvider:
         target = dict(payload.get("target") or {})
         metadata = dict(session.metadata)
         api_base = _open_api_base_url(str(metadata.get("domain") or "feishu"), self.api_base_url)
+        peer_type = str(target.get("peerType") or "dm")
+        receive_id_type = "chat_id" if peer_type == "group" else "open_id"
+        receive_id = str(target.get("threadId") or target.get("peerId") or "") if receive_id_type == "chat_id" else str(target.get("peerId") or "")
+        chunks = _text_chunks(str(payload.get("content") or ""), _positive_int(metadata.get("maxMessageChars"), default=20000))
+        provider_message_ids: list[str] = []
         try:
-            response = self.http.post(
-                f"{api_base}/open-apis/im/v1/messages?receive_id_type=open_id",
-                json={
-                    "receive_id": str(target.get("peerId") or ""),
-                    "msg_type": "text",
-                    "content": json.dumps({"text": str(payload.get("content") or "")}, ensure_ascii=False),
-                },
-                headers={"Authorization": f"Bearer {token}", "Content-Type": "application/json"},
-                timeout=20,
-            )
-            response.raise_for_status()
+            for chunk in chunks:
+                response = self.http.post(
+                    f"{api_base}/open-apis/im/v1/messages?receive_id_type={receive_id_type}",
+                    json={
+                        "receive_id": receive_id,
+                        "msg_type": "text",
+                        "content": json.dumps({"text": chunk}, ensure_ascii=False),
+                    },
+                    headers={"Authorization": f"Bearer {token}", "Content-Type": "application/json"},
+                    timeout=20,
+                )
+                response.raise_for_status()
+                data = dict(response.json())
+                if int(data.get("code") or 0) != 0:
+                    error = str(data.get("msg") or data)
+                    self.store.fail_send(begin.dedupe_key, error=error)
+                    return {"ok": False, "error": error, "httpStatus": 502}
+                provider_message_ids.append(str((data.get("data") or {}).get("message_id") or f"feishu_{payload['requestId']}"))
         except Exception as exc:
             error = str(exc)
             self.store.fail_send(begin.dedupe_key, error=error)
             return {"ok": False, "error": error, "httpStatus": 502}
-        data = dict(response.json())
-        if int(data.get("code") or 0) != 0:
-            error = str(data.get("msg") or data)
-            self.store.fail_send(begin.dedupe_key, error=error)
-            return {"ok": False, "error": error, "httpStatus": 502}
-        provider_message_id = str((data.get("data") or {}).get("message_id") or f"feishu_{payload['requestId']}")
+        provider_message_id = ",".join(provider_message_ids) or f"feishu_{payload['requestId']}"
         self.store.complete_send(begin.dedupe_key, provider_message_id=provider_message_id)
         return {"ok": True, "providerMessageId": provider_message_id}
 
     def handle_event(self, payload: dict[str, Any]) -> dict[str, Any]:
         challenge = payload.get("challenge")
         if challenge:
+            token = str(payload.get("token") or (payload.get("header") or {}).get("token") or "")
+            if not token or self._session_for_verification_token(token) is None:
+                return {"ok": False, "error": "verification token is required", "httpStatus": 401}
             return {"challenge": challenge}
         header = dict(payload.get("header") or {})
         event = dict(payload.get("event") or {})
@@ -192,9 +203,14 @@ class FeishuBotProvider:
         session = self._session_for_app_id(app_id)
         expected_token = str(session.metadata.get("verificationToken") or "")
         received_token = str(header.get("token") or payload.get("token") or "")
-        if expected_token and received_token != expected_token:
+        if not expected_token or received_token != expected_token:
             return {"ok": False, "error": "invalid verification token", "httpStatus": 401}
+        ignored = _ignore_reason(event)
+        if ignored:
+            return {"ok": True, "ignored": ignored}
         bridge_event = _bridge_event_from_feishu(session, header, event)
+        if bridge_event is None:
+            return {"ok": True, "ignored": "empty_or_oversized"}
         self.bridge_post(
             f"{self.bridge_base_url}/api/channel-connector-bridge/events",
             bridge_event,
@@ -234,6 +250,18 @@ class FeishuBotProvider:
                 return session
         raise KeyError(app_id)
 
+    def _session_for_verification_token(self, token: str) -> ConnectorSessionState | None:
+        sessions = self.store.list_sessions()
+        for session in sorted(sessions, key=lambda item: item.updated_at, reverse=True):
+            if (
+                session.kind == "feishu"
+                and session.status == "connected"
+                and token
+                and session.metadata.get("verificationToken") == token
+            ):
+                return session
+        return None
+
     def _default_bridge_post(self, url: str, payload: dict[str, Any], headers: dict[str, str]) -> None:
         response = self.http.post(url, json=payload, headers=headers, timeout=20)
         response.raise_for_status()
@@ -415,6 +443,15 @@ class FeishuBotProvider:
                 "FEISHU_CONNECTION_ID": session.connection_id,
                 "FEISHU_CHANNEL_ID": session.channel_id,
                 "FEISHU_ACCOUNT_ID": str(session.account_id or ""),
+                "FEISHU_REQUIRE_MENTION_IN_GROUPS": _env_bool(metadata.get("requireMentionInGroups"), default=True),
+                "FEISHU_RESPOND_TO_MENTION_ALL": _env_bool(metadata.get("respondToMentionAll"), default=False),
+                "FEISHU_DM_MODE": str(metadata.get("dmMode") or "open"),
+                "FEISHU_ALLOW_FROM": ",".join(_string_list(metadata.get("allowFrom"))),
+                "FEISHU_GROUP_ALLOW_FROM": ",".join(_string_list(metadata.get("groupAllowFrom"))),
+                "FEISHU_MAX_MESSAGE_CHARS": str(_positive_int(metadata.get("maxMessageChars"), default=20000)),
+                "FEISHU_TEXT_BATCH_DELAY_MS": str(_positive_int(metadata.get("textBatchDelayMs"), default=0)),
+                "FEISHU_TEXT_BATCH_MAX_MESSAGES": str(_positive_int(metadata.get("textBatchMaxMessages"), default=10)),
+                "FEISHU_TEXT_BATCH_MAX_CHARS": str(_positive_int(metadata.get("textBatchMaxChars"), default=20000)),
                 "BEAVER_BRIDGE_BASE_URL": self.bridge_base_url,
                 "BEAVER_BRIDGE_TOKEN": self.bridge_token,
             }
@@ -422,13 +459,20 @@ class FeishuBotProvider:
         return subprocess.Popen(["node", str(script)], env=env, cwd=str(script.parent))
 
 
-def _bridge_event_from_feishu(session: ConnectorSessionState, header: dict[str, Any], event: dict[str, Any]) -> dict[str, Any]:
+def _bridge_event_from_feishu(session: ConnectorSessionState, header: dict[str, Any], event: dict[str, Any]) -> dict[str, Any] | None:
     message = dict(event.get("message") or {})
     sender = dict(event.get("sender") or {})
     sender_id = dict(sender.get("sender_id") or {})
-    peer_id = str(sender_id.get("open_id") or sender_id.get("user_id") or "")
+    is_group = message.get("chat_type") == "group"
+    sender_open_id = str(sender_id.get("open_id") or sender_id.get("user_id") or "")
+    chat_id = str(message.get("chat_id") or "")
+    peer_id = chat_id if is_group else sender_open_id
     message_id = str(message.get("message_id") or uuid4().hex)
     event_id = str(header.get("event_id") or f"{session.channel_id}:{message_id}")
+    content = _extract_text(message).strip()
+    max_chars = _positive_int(session.metadata.get("maxMessageChars"), default=20000)
+    if not content or len(content) > max_chars:
+        return None
     return {
         "eventId": event_id,
         "timestamp": time.strftime("%Y-%m-%dT%H:%M:%SZ", time.gmtime()),
@@ -438,13 +482,18 @@ def _bridge_event_from_feishu(session: ConnectorSessionState, header: dict[str,
         "kind": "feishu",
         "accountId": session.account_id,
         "peerId": peer_id,
-        "peerType": "group" if message.get("chat_type") == "group" else "dm",
-        "userId": peer_id,
-        "threadId": str(message.get("chat_id") or "") or None,
+        "peerType": "group" if is_group else "dm",
+        "userId": sender_open_id,
+        "threadId": chat_id or None,
         "messageId": message_id,
         "messageType": str(message.get("message_type") or "text"),
-        "content": _extract_text(message),
-        "metadata": {"chatId": message.get("chat_id"), "rawMessageType": message.get("message_type")},
+        "content": content,
+        "metadata": {
+            "chatId": message.get("chat_id"),
+            "rawMessageType": message.get("message_type"),
+            "senderType": sender.get("sender_type"),
+            "mentions": message.get("mentions") if isinstance(message.get("mentions"), list) else [],
+        },
     }
 
 
@@ -480,6 +529,97 @@ def _extract_text(message: dict[str, Any]) -> str:
     return ""
 
 
+def _text_chunks(text: str, max_chars: int) -> list[str]:
+    cleaned = str(text or "")
+    if not cleaned:
+        return [""]
+    size = max(1, int(max_chars))
+    return [cleaned[index : index + size] for index in range(0, len(cleaned), size)]
+
+
+def _ignore_reason(event: dict[str, Any]) -> str:
+    sender = dict(event.get("sender") or {})
+    sender_type = str(sender.get("sender_type") or "").strip().lower()
+    if sender_type and sender_type != "user":
+        return f"sender_type:{sender_type}"
+    message = dict(event.get("message") or {})
+    content = _extract_text(message).strip()
+    if content.startswith("/feishu"):
+        return "feishu_command"
+    return ""
+
+
+def _policy_metadata(options: dict[str, Any]) -> dict[str, Any]:
+    metadata: dict[str, Any] = {}
+    for key in ("allowFrom", "allow_from"):
+        items = _string_list(options.get(key))
+        if items:
+            metadata["allowFrom"] = items
+            break
+    for key in ("groupAllowFrom", "group_allow_from"):
+        items = _string_list(options.get(key))
+        if items:
+            metadata["groupAllowFrom"] = items
+            break
+    if "requireMentionInGroups" in options or "require_mention_in_groups" in options:
+        metadata["requireMentionInGroups"] = _bool(options.get("requireMentionInGroups", options.get("require_mention_in_groups")))
+    else:
+        metadata["requireMentionInGroups"] = True
+    if "respondToMentionAll" in options or "respond_to_mention_all" in options:
+        metadata["respondToMentionAll"] = _bool(options.get("respondToMentionAll", options.get("respond_to_mention_all")))
+    dm_mode = str(options.get("dmMode") or options.get("dm_mode") or "open").strip()
+    metadata["dmMode"] = dm_mode if dm_mode in {"open", "allowlist", "pair", "disabled"} else "open"
+    for key, metadata_key, default in (
+        ("maxMessageChars", "maxMessageChars", 20000),
+        ("textBatchDelayMs", "textBatchDelayMs", 0),
+        ("textBatchMaxMessages", "textBatchMaxMessages", 10),
+        ("textBatchMaxChars", "textBatchMaxChars", 20000),
+    ):
+        alt_key = _camel_to_snake(key)
+        if key in options or alt_key in options:
+            metadata[metadata_key] = _positive_int(options.get(key, options.get(alt_key)), default=default)
+    return metadata
+
+
+def _string_list(value: Any) -> list[str]:
+    if isinstance(value, str):
+        raw_items = value.replace("\n", ",").split(",")
+    elif isinstance(value, list):
+        raw_items = value
+    else:
+        raw_items = []
+    return [str(item).strip() for item in raw_items if str(item).strip()]
+
+
+def _bool(value: Any) -> bool:
+    if isinstance(value, bool):
+        return value
+    return str(value).strip().lower() in {"1", "true", "yes", "on"}
+
+
+def _positive_int(value: Any, *, default: int) -> int:
+    try:
+        number = int(value)
+    except (TypeError, ValueError):
+        return default
+    return number if number > 0 else default
+
+
+def _env_bool(value: Any, *, default: bool) -> str:
+    if value is None:
+        return "true" if default else "false"
+    return "true" if _bool(value) else "false"
+
+
+def _camel_to_snake(value: str) -> str:
+    result: list[str] = []
+    for char in value:
+        if char.isupper() and result:
+            result.append("_")
+        result.append(char.lower())
+    return "".join(result)
+
+
 def _domain(options: dict[str, Any]) -> str:
     domain = str(options.get("domain") or "feishu").strip().lower()
     return "lark" if domain == "lark" else "feishu"
diff --git a/external-connector/external_connector/providers/weixin_ilink.py b/external-connector/external_connector/providers/weixin_ilink.py
index daf65d3..5cf1a54 100644
--- a/external-connector/external_connector/providers/weixin_ilink.py
+++ b/external-connector/external_connector/providers/weixin_ilink.py
@@ -45,6 +45,7 @@ class WeixinIlinkProvider:
         self.start_receivers = start_receivers
         self._receiver_stops: dict[str, threading.Event] = {}
         self._receiver_lock = threading.Lock()
+        self._start_existing_connected_receivers()
 
     def connectors(self) -> list[dict[str, Any]]:
         return [
@@ -303,13 +304,45 @@ class WeixinIlinkProvider:
             self._receiver_stops[session.connection_id] = stop
             thread = threading.Thread(target=self._receiver_loop, args=(session.connection_id, stop), daemon=True)
             thread.start()
+        print(
+            json.dumps(
+                {
+                    "event": "weixin_receiver_started",
+                    "connectionId": session.connection_id,
+                    "channelId": session.channel_id,
+                },
+                ensure_ascii=False,
+            ),
+            flush=True,
+        )
+        return None
+
+    def _start_existing_connected_receivers(self) -> None:
+        if not self.start_receivers:
+            return None
+        for session in self.store.list_sessions():
+            if session.kind != "weixin" or session.status != "connected":
+                continue
+            if _has_connection_material(session):
+                self._ensure_receiver(session)
         return None
 
     def _receiver_loop(self, connection_id: str, stop: threading.Event) -> None:
         while not stop.is_set():
             try:
                 self.poll_once(connection_id)
-            except Exception:
+            except Exception as exc:
+                print(
+                    json.dumps(
+                        {
+                            "event": "weixin_receiver_error",
+                            "connectionId": connection_id,
+                            "error": str(exc)[:300],
+                        },
+                        ensure_ascii=False,
+                    ),
+                    flush=True,
+                )
                 time.sleep(5)
             stop.wait(1)
 
diff --git a/external-connector/tests/node/feishu_event_utils.test.js b/external-connector/tests/node/feishu_event_utils.test.js
new file mode 100644
index 0000000..a08a5a7
--- /dev/null
+++ b/external-connector/tests/node/feishu_event_utils.test.js
@@ -0,0 +1,189 @@
+const test = require("node:test");
+const assert = require("node:assert/strict");
+
+const {
+  bridgeEventFromFeishu,
+  bridgeEventFromNormalizedMessage,
+  buildChannelOptions,
+  ignoreReason,
+  parsePolicyEnv,
+} = require("../../external_connector/node/feishu_event_utils");
+
+test("ignores Feishu app or bot sender events", () => {
+  assert.equal(ignoreReason({ sender: { sender_type: "app" }, message: { content: "{\"text\":\"hello\"}" } }), "sender_type:app");
+  assert.equal(ignoreReason({ sender: { sender_type: "bot" }, message: { content: "{\"text\":\"hello\"}" } }), "sender_type:bot");
+});
+
+test("ignores Feishu slash commands intended for the platform integration", () => {
+  assert.equal(ignoreReason({ sender: { sender_type: "user" }, message: { content: "{\"text\":\"/feishu start\"}" } }), "feishu_command");
+});
+
+test("keeps user messages and records sender type metadata", () => {
+  const event = bridgeEventFromFeishu(
+    {
+      event_id: "evt_1",
+      sender: { sender_type: "user", sender_id: { open_id: "ou_user" } },
+      message: {
+        message_id: "om_1",
+        chat_id: "oc_1",
+        chat_type: "p2p",
+        message_type: "text",
+        content: "{\"text\":\"hello\"}",
+      },
+    },
+    { connectionId: "conn_1", channelId: "feishu-main", accountId: "feishu:cli_1" },
+  );
+
+  assert.equal(ignoreReason({ sender: { sender_type: "user" }, message: { content: "{\"text\":\"hello\"}" } }), "");
+  assert.equal(event.content, "hello");
+  assert.equal(event.peerId, "ou_user");
+  assert.equal(event.metadata.senderType, "user");
+});
+
+test("uses chat id as peer id for group messages", () => {
+  const event = bridgeEventFromFeishu(
+    {
+      event_id: "evt_1",
+      sender: { sender_type: "user", sender_id: { open_id: "ou_user" } },
+      message: {
+        message_id: "om_1",
+        chat_id: "oc_group",
+        chat_type: "group",
+        message_type: "text",
+        content: "{\"text\":\"@bot hello\"}",
+      },
+    },
+    { connectionId: "conn_1", channelId: "feishu-main", accountId: "feishu:cli_1" },
+  );
+
+  assert.equal(event.peerType, "group");
+  assert.equal(event.peerId, "oc_group");
+  assert.equal(event.userId, "ou_user");
+});
+
+test("builds SDK channel options from explicit Feishu policy environment", () => {
+  const policy = parsePolicyEnv({
+    FEISHU_REQUIRE_MENTION_IN_GROUPS: "false",
+    FEISHU_RESPOND_TO_MENTION_ALL: "true",
+    FEISHU_DM_MODE: "allowlist",
+    FEISHU_ALLOW_FROM: "ou_1, ou_2",
+    FEISHU_GROUP_ALLOW_FROM: "oc_1\noc_2",
+    FEISHU_MAX_MESSAGE_CHARS: "1234",
+    FEISHU_TEXT_BATCH_DELAY_MS: "250",
+    FEISHU_TEXT_BATCH_MAX_MESSAGES: "5",
+    FEISHU_TEXT_BATCH_MAX_CHARS: "2048",
+  });
+  const options = buildChannelOptions({
+    appId: "cli_1",
+    appSecret: "secret",
+    domain: "feishu",
+    policy,
+  });
+
+  assert.equal(options.policy.requireMention, false);
+  assert.equal(options.policy.respondToMentionAll, true);
+  assert.equal(options.policy.dmMode, "allowlist");
+  assert.deepEqual(options.policy.dmAllowlist, ["ou_1", "ou_2"]);
+  assert.deepEqual(options.policy.groupAllowlist, ["oc_1", "oc_2"]);
+  assert.equal(options.outbound.textChunkLimit, 1234);
+  assert.equal(options.safety.batch.text.delayMs, 250);
+  assert.equal(options.safety.batch.text.maxMessages, 5);
+  assert.equal(options.safety.batch.text.maxChars, 2048);
+  assert.equal(options.includeRawEvent, true);
+});
+
+test("normalizes SDK message events for Beaver bridge", () => {
+  const event = bridgeEventFromNormalizedMessage(
+    {
+      messageId: "om_1",
+      chatId: "oc_group",
+      chatType: "group",
+      senderId: "ou_user",
+      content: "hello",
+      rawContentType: "text",
+      resources: [{ type: "image", fileKey: "img_1", fileName: "photo.png" }],
+      mentions: [{ openId: "ou_bot", name: "Beaver", isBot: true }],
+      mentionAll: false,
+      mentionedBot: true,
+      createTime: 1710000000000,
+      raw: { event_id: "evt_1" },
+    },
+    { connectionId: "conn_1", channelId: "feishu-main", accountId: "feishu:cli_1" },
+    { maxMessageChars: 100 },
+  );
+
+  assert.equal(event.eventId, "evt_1");
+  assert.equal(event.peerType, "group");
+  assert.equal(event.peerId, "oc_group");
+  assert.equal(event.userId, "ou_user");
+  assert.equal(event.threadId, "oc_group");
+  assert.match(event.content, /^hello/);
+  assert.deepEqual(event.metadata.mentions[0].openId, "ou_bot");
+  assert.deepEqual(event.metadata.resources[0].type, "image");
+});
+
+test("uses sender id as peer id for SDK direct messages", () => {
+  const event = bridgeEventFromNormalizedMessage(
+    {
+      messageId: "om_dm",
+      chatId: "oc_dm",
+      chatType: "p2p",
+      senderId: "ou_user",
+      content: "hello dm",
+      rawContentType: "text",
+      resources: [],
+      mentions: [],
+      mentionAll: false,
+      mentionedBot: false,
+      createTime: 1710000000000,
+      raw: { header: { event_id: "evt_dm" } },
+    },
+    { connectionId: "conn_1", channelId: "feishu-main", accountId: "feishu:cli_1" },
+  );
+
+  assert.equal(event.peerType, "dm");
+  assert.equal(event.peerId, "ou_user");
+  assert.equal(event.threadId, "oc_dm");
+});
+
+test("drops empty and oversized SDK message events", () => {
+  assert.equal(
+    bridgeEventFromNormalizedMessage(
+      {
+        messageId: "om_empty",
+        chatId: "oc_dm",
+        chatType: "p2p",
+        senderId: "ou_user",
+        content: "   ",
+        rawContentType: "text",
+        resources: [],
+        mentions: [],
+        mentionAll: false,
+        mentionedBot: false,
+        createTime: 1710000000000,
+      },
+      { connectionId: "conn_1", channelId: "feishu-main", accountId: "feishu:cli_1" },
+    ),
+    null,
+  );
+  assert.equal(
+    bridgeEventFromNormalizedMessage(
+      {
+        messageId: "om_big",
+        chatId: "oc_dm",
+        chatType: "p2p",
+        senderId: "ou_user",
+        content: "x".repeat(11),
+        rawContentType: "text",
+        resources: [],
+        mentions: [],
+        mentionAll: false,
+        mentionedBot: false,
+        createTime: 1710000000000,
+      },
+      { connectionId: "conn_1", channelId: "feishu-main", accountId: "feishu:cli_1" },
+      { maxMessageChars: 10 },
+    ),
+    null,
+  );
+});
diff --git a/external-connector/tests/test_feishu_bot_provider.py b/external-connector/tests/test_feishu_bot_provider.py
index 8577a1e..c1255bd 100644
--- a/external-connector/tests/test_feishu_bot_provider.py
+++ b/external-connector/tests/test_feishu_bot_provider.py
@@ -1,6 +1,7 @@
 from __future__ import annotations
 
 import json
+import subprocess
 from urllib.parse import parse_qs
 
 from external_connector.app import create_app
@@ -12,6 +13,17 @@ from external_connector.state import SidecarStateStore
 from fastapi.testclient import TestClient
 
 
+def test_feishu_node_event_utils() -> None:
+    result = subprocess.run(
+        ["node", "--test", "tests/node/feishu_event_utils.test.js"],
+        check=False,
+        capture_output=True,
+        text=True,
+    )
+
+    assert result.returncode == 0, result.stdout + result.stderr
+
+
 class FakeResponse:
     def __init__(self, payload: dict[str, object]) -> None:
         self.payload = payload
@@ -169,6 +181,36 @@ def test_feishu_bot_provider_connects_with_app_credentials(tmp_path) -> None:
     assert receiver_starts == ["conn_1"]
 
 
+def test_feishu_bot_provider_stores_runtime_policy_options(tmp_path) -> None:
+    receiver_starts: list[str] = []
+    provider = _provider(tmp_path, receiver_starts=receiver_starts)
+
+    session = provider.start_session(
+        {
+            "kind": "feishu",
+            "connectionId": "conn_1",
+            "channelId": "feishu-main",
+            "displayName": "Feishu Main",
+            "callbackBaseUrl": "http://beaver:8080",
+            "options": {
+                "appId": "cli_xxx",
+                "appSecret": "secret",
+                "verificationToken": "verify-token",
+                "requireMentionInGroups": True,
+                "allowFrom": ["ou_1"],
+                "groupAllowFrom": ["oc_1"],
+                "maxMessageChars": 1234,
+            },
+        }
+    )
+
+    stored = provider.store.get_session(session["sessionId"])
+    assert stored.metadata["requireMentionInGroups"] is True
+    assert stored.metadata["allowFrom"] == ["ou_1"]
+    assert stored.metadata["groupAllowFrom"] == ["oc_1"]
+    assert stored.metadata["maxMessageChars"] == 1234
+
+
 def test_feishu_bot_provider_send_uses_tenant_token_and_dedupes(tmp_path) -> None:
     provider = _provider(tmp_path)
     session = provider.start_session(
@@ -205,13 +247,96 @@ def test_feishu_bot_provider_send_uses_tenant_token_and_dedupes(tmp_path) -> Non
     assert send_posts[0][1]["msg_type"] == "text"
 
 
-def test_feishu_event_route_returns_challenge(tmp_path) -> None:
+def test_feishu_bot_provider_send_uses_chat_id_for_group_targets(tmp_path) -> None:
+    provider = _provider(tmp_path)
+    provider.start_session(
+        {
+            "kind": "feishu",
+            "connectionId": "conn_1",
+            "channelId": "feishu-main",
+            "displayName": "Feishu Main",
+            "callbackBaseUrl": "http://beaver:8080",
+            "options": {"appId": "cli_xxx", "appSecret": "secret"},
+        }
+    )
+
+    result = provider.send(
+        {
+            "requestId": "out_group_1",
+            "connectionId": "conn_1",
+            "channelId": "feishu-main",
+            "kind": "feishu",
+            "target": {"peerId": "oc_group", "peerType": "group", "threadId": "oc_group"},
+            "content": "hello group",
+            "metadata": {},
+        }
+    )
+
+    send_posts = [item for item in provider.http.posts if "/open-apis/im/v1/messages" in item[0]]
+    assert result["ok"] is True
+    assert send_posts[-1][0].endswith("?receive_id_type=chat_id")
+    assert send_posts[-1][1]["receive_id"] == "oc_group"
+
+
+def test_feishu_bot_provider_send_chunks_oversized_text(tmp_path) -> None:
+    provider = _provider(tmp_path)
+    session = provider.start_session(
+        {
+            "kind": "feishu",
+            "connectionId": "conn_1",
+            "channelId": "feishu-main",
+            "displayName": "Feishu Main",
+            "callbackBaseUrl": "http://beaver:8080",
+            "options": {"appId": "cli_xxx", "appSecret": "secret", "maxMessageChars": 5},
+        }
+    )
+
+    result = provider.send(
+        {
+            "requestId": "out_chunked",
+            "connectionId": "conn_1",
+            "channelId": "feishu-main",
+            "kind": "feishu",
+            "target": {"peerId": "ou_user", "peerType": "dm", "threadId": None},
+            "content": "helloworld!",
+            "metadata": {},
+        }
+    )
+
+    send_posts = [item for item in provider.http.posts if "/open-apis/im/v1/messages" in item[0]]
+    contents = [json.loads(item[1]["content"])["text"] for item in send_posts]
+    assert session["status"] == "connected"
+    assert result["ok"] is True
+    assert contents == ["hello", "world", "!"]
+
+
+def test_feishu_event_route_requires_known_verification_token_for_challenge(tmp_path) -> None:
     provider = _provider(tmp_path)
     app = create_app(provider=provider, api_token="sidecar-token")
 
     with TestClient(app) as client:
         response = client.post("/feishu/events", json={"challenge": "abc"})
 
+    assert response.status_code == 401
+
+
+def test_feishu_event_route_returns_challenge_for_matching_token(tmp_path) -> None:
+    provider = _provider(tmp_path)
+    provider.start_session(
+        {
+            "kind": "feishu",
+            "connectionId": "conn_1",
+            "channelId": "feishu-main",
+            "displayName": "Feishu Main",
+            "callbackBaseUrl": "http://beaver:8080",
+            "options": {"appId": "cli_xxx", "appSecret": "secret", "verificationToken": "verify-token"},
+        }
+    )
+    app = create_app(provider=provider, api_token="sidecar-token")
+
+    with TestClient(app) as client:
+        response = client.post("/feishu/events", json={"challenge": "abc", "token": "verify-token"})
+
     assert response.status_code == 200
     assert response.json() == {"challenge": "abc"}
 
@@ -259,6 +384,62 @@ def test_feishu_event_route_forwards_message_to_bridge(tmp_path) -> None:
     assert bridge_posts[0][1]["peerId"] == "ou_user"
 
 
+def test_feishu_event_route_ignores_bot_sender_and_platform_commands(tmp_path) -> None:
+    bridge_posts: list[tuple[str, dict[str, object], dict[str, str]]] = []
+    provider = _provider(tmp_path, bridge_posts=bridge_posts)
+    provider.start_session(
+        {
+            "kind": "feishu",
+            "connectionId": "conn_1",
+            "channelId": "feishu-main",
+            "displayName": "Feishu Main",
+            "callbackBaseUrl": "http://beaver:8080",
+            "options": {"appId": "cli_xxx", "appSecret": "secret", "verificationToken": "verify-token"},
+        }
+    )
+    app = create_app(provider=provider, api_token="sidecar-token")
+
+    with TestClient(app) as client:
+        bot = client.post(
+            "/feishu/events",
+            json={
+                "header": {"event_id": "evt_bot", "token": "verify-token", "app_id": "cli_xxx"},
+                "event": {
+                    "sender": {"sender_type": "bot", "sender_id": {"open_id": "ou_bot"}},
+                    "message": {
+                        "message_id": "om_bot",
+                        "chat_id": "oc_chat",
+                        "chat_type": "p2p",
+                        "message_type": "text",
+                        "content": "{\"text\":\"hello\"}",
+                    },
+                },
+            },
+        )
+        command = client.post(
+            "/feishu/events",
+            json={
+                "header": {"event_id": "evt_command", "token": "verify-token", "app_id": "cli_xxx"},
+                "event": {
+                    "sender": {"sender_type": "user", "sender_id": {"open_id": "ou_user"}},
+                    "message": {
+                        "message_id": "om_command",
+                        "chat_id": "oc_chat",
+                        "chat_type": "p2p",
+                        "message_type": "text",
+                        "content": "{\"text\":\"/feishu start\"}",
+                    },
+                },
+            },
+        )
+
+    assert bot.status_code == 200
+    assert command.status_code == 200
+    assert bot.json() == {"ok": True, "ignored": "sender_type:bot"}
+    assert command.json() == {"ok": True, "ignored": "feishu_command"}
+    assert bridge_posts == []
+
+
 def test_composite_provider_routes_feishu_and_weixin_descriptors(tmp_path) -> None:
     store = SidecarStateStore(tmp_path / "state.json")
     provider = CompositeProvider([FakeProvider(store), _provider(tmp_path)])
diff --git a/external-connector/tests/test_sidecar_api.py b/external-connector/tests/test_sidecar_api.py
index 7706d58..e1490cc 100644
--- a/external-connector/tests/test_sidecar_api.py
+++ b/external-connector/tests/test_sidecar_api.py
@@ -70,6 +70,17 @@ def test_sidecar_http_api_requires_bearer_token(tmp_path) -> None:
     assert response.status_code == 401
 
 
+def test_sidecar_http_api_fails_closed_without_configured_token(tmp_path) -> None:
+    app = create_app(provider=FakeProvider(SidecarStateStore(tmp_path / "state.json")), api_token="")
+
+    with TestClient(app) as client:
+        response = client.get("/connectors")
+        health = client.get("/health")
+
+    assert response.status_code == 503
+    assert health.status_code == 200
+
+
 def test_sidecar_http_api_session_and_send(tmp_path) -> None:
     app = create_app(provider=FakeProvider(SidecarStateStore(tmp_path / "state.json")), api_token="sidecar-token")
     headers = {"Authorization": "Bearer sidecar-token"}
diff --git a/external-connector/tests/test_weixin_ilink_provider.py b/external-connector/tests/test_weixin_ilink_provider.py
index a0ee6b2..5f010d8 100644
--- a/external-connector/tests/test_weixin_ilink_provider.py
+++ b/external-connector/tests/test_weixin_ilink_provider.py
@@ -206,6 +206,38 @@ def test_weixin_ilink_provider_recovers_token_session_persisted_as_scanned(tmp_p
     assert recovered["accountId"] == "weixin:bot-1@im.bot"
 
 
+def test_weixin_ilink_provider_starts_existing_connected_receiver_on_startup(tmp_path) -> None:
+    store = SidecarStateStore(tmp_path / "state.json")
+    session = store.create_session(
+        kind="weixin",
+        connection_id="conn_1",
+        channel_id="weixin-main",
+        display_name="Weixin Main",
+        options={},
+    )
+    store.update_session(
+        session.session_id,
+        status="connected",
+        account_id="weixin:bot-1@im.bot",
+        metadata={
+            "token": "bot-token",
+            "baseUrl": "https://api.weixin.example",
+            "userId": "wx-owner",
+            "getUpdatesBuf": "buf",
+        },
+    )
+
+    provider = WeixinIlinkProvider(
+        store=store,
+        http_client=FakeHttpClient(),
+        bridge_base_url="http://beaver:8080",
+        bridge_token="bridge-token",
+    )
+
+    assert "conn_1" in provider._receiver_stops
+    provider.logout("conn_1")
+
+
 def test_weixin_ilink_provider_send_uses_saved_token_and_dedupes(tmp_path) -> None:
     http = FakeHttpClient()
     provider = WeixinIlinkProvider(
diff --git a/scripts/deploy-initial-skills.sh b/scripts/deploy-initial-skills.sh
old mode 100644
new mode 100755
index fe977ec..2105a8a
--- a/scripts/deploy-initial-skills.sh
+++ b/scripts/deploy-initial-skills.sh
@@ -1,61 +1,101 @@
-#!/bin/bash
-# Deploy initial skills to all runtime instances via docker cp
-# Usage: ./scripts/deploy-initial-skills.sh
+#!/usr/bin/env bash
+# Deploy initial skills to app-instance containers without overwriting existing skill directories.
+# Usage:
+#   ./scripts/deploy-initial-skills.sh
+#   ./scripts/deploy-initial-skills.sh app-instance-terminaltest
 
 set -euo pipefail
 
-SKILL_SOURCE="/home/ivan/xuan/beaver_project/skills"
-DOCKER_NAMES=("app-instance-steven" "app-instance-benson" "app-instance-jayc" "app-instance-officebench")
+SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
+REPO_ROOT="$(cd "${SCRIPT_DIR}/.." && pwd)"
+SKILL_SOURCE="${SKILL_SOURCE:-${REPO_ROOT}/skills}"
+SKILL_EXCLUDE="${SKILL_EXCLUDE:-officebench-mcp}"
 
-SKILLS=(
-  "outlook-mail"
-  "filesystem-operation"
-  "terminal-operation"
-  "web-operation"
-  "utility-tools"
-  "skills-admin"
-  "cron-scheduler"
-  "memory-management"
+if [[ ! -f "${SKILL_SOURCE}/_index/published.json" ]]; then
+  printf '[deploy-initial-skills] missing published index: %s\n' "${SKILL_SOURCE}/_index/published.json" >&2
+  exit 1
+fi
+
+if [[ $# -gt 0 ]]; then
+  DOCKER_NAMES=("$@")
+else
+  mapfile -t DOCKER_NAMES < <(docker ps --format '{{.Names}}' | grep '^app-instance-' | sort)
+fi
+
+if [[ "${#DOCKER_NAMES[@]}" -eq 0 ]]; then
+  printf '[deploy-initial-skills] no app-instance containers found\n' >&2
+  exit 1
+fi
+
+SKILLS_JSON="$(SKILL_SOURCE="$SKILL_SOURCE" SKILL_EXCLUDE="$SKILL_EXCLUDE" python3 - <<'PY'
+import json
+import os
+from pathlib import Path
+
+source = Path(os.environ["SKILL_SOURCE"])
+excluded = {item.strip() for item in os.environ.get("SKILL_EXCLUDE", "").split(",") if item.strip()}
+items = json.loads((source / "_index" / "published.json").read_text(encoding="utf-8")).get("items", [])
+print(json.dumps([str(item).strip() for item in items if str(item).strip() and str(item).strip() not in excluded]))
+PY
+)"
+
+mapfile -t SKILLS < <(SKILLS_JSON="$SKILLS_JSON" python3 - <<'PY'
+import json
+import os
+
+for item in json.loads(os.environ["SKILLS_JSON"]):
+    print(item)
+PY
 )
 
 for container in "${DOCKER_NAMES[@]}"; do
-  echo "==> Deploying to $container..."
+  printf '==> Deploying initial skills to %s...\n' "$container"
 
   docker exec "$container" mkdir -p /root/.beaver/workspace/skills/_index
 
   for skill in "${SKILLS[@]}"; do
-    if [ -d "$SKILL_SOURCE/$skill" ]; then
-      docker cp "$SKILL_SOURCE/$skill" "$container":/root/.beaver/workspace/skills/
-      echo "    + $skill"
+    if [[ ! -d "$SKILL_SOURCE/$skill" ]]; then
+      printf '    ! missing source skill: %s\n' "$skill"
+      continue
     fi
+    if docker exec "$container" test -e "/root/.beaver/workspace/skills/$skill"; then
+      printf '    = %s\n' "$skill"
+      continue
+    fi
+    docker cp "$SKILL_SOURCE/$skill" "$container":/root/.beaver/workspace/skills/
+    printf '    + %s\n' "$skill"
   done
 
-  # Merge index: keep existing entries + add new skills, no duplicates
-  docker exec "$container" python3 -c "
+  docker exec -i -e SKILLS_JSON="$SKILLS_JSON" "$container" python3 - <<'PY'
 import json
+import os
 from pathlib import Path
 
-idx = Path('/root/.beaver/workspace/skills/_index/published.json')
-existing = json.loads(idx.read_text()) if idx.exists() else {'items': []}
+idx = Path("/root/.beaver/workspace/skills/_index/published.json")
+try:
+    existing = json.loads(idx.read_text(encoding="utf-8")) if idx.exists() else {"items": []}
+except json.JSONDecodeError:
+    existing = {"items": []}
+items = existing.get("items")
+if not isinstance(items, list):
+    items = []
 
-new_skills = $(printf '["%s"]' "$(IFS=,; echo "${SKILLS[*]}")" | sed 's/,/", "/g')
+merged = []
+for item in [*items, *json.loads(os.environ["SKILLS_JSON"])]:
+    text = str(item).strip()
+    if text and text not in merged:
+        merged.append(text)
 
-seen = set(existing['items'])
-for s in new_skills:
-    if s not in seen:
-        existing['items'].append(s)
-        seen.add(s)
+idx.parent.mkdir(parents=True, exist_ok=True)
+idx.write_text(json.dumps({"items": merged}, ensure_ascii=False, indent=2) + "\n", encoding="utf-8")
+print(f"    index updated: {len(merged)} skills")
+PY
 
-idx.write_text(json.dumps(existing, ensure_ascii=False, indent=2) + '\n')
-print(f\"Index updated: {len(existing['items'])} skills\")
-"
+  if [[ -f "$SKILL_SOURCE/_index/disabled.json" ]]; then
+    docker cp "$SKILL_SOURCE/_index/disabled.json" "$container":/root/.beaver/workspace/skills/_index/disabled.json
+  fi
 
-  docker cp "$SKILL_SOURCE/_index/disabled.json" "$container":/root/.beaver/workspace/skills/_index/disabled.json
-
-  echo "    [done]"
+  printf '    [done]\n'
 done
 
-echo ""
-echo "Done! All skills deployed to all instances."
-echo "Containers: ${DOCKER_NAMES[*]}"
-echo "Skills: ${SKILLS[*]}"
+printf '\nDone. Containers: %s\n' "${DOCKER_NAMES[*]}"
diff --git a/skills/_index/disabled.json b/skills/_index/disabled.json
index fc69ce2..3c21bcc 100644
--- a/skills/_index/disabled.json
+++ b/skills/_index/disabled.json
@@ -1,3 +1,5 @@
 {
-  "items": []
-}
\ No newline at end of file
+  "items": [
+    "skills-authoring-admin"
+  ]
+}
diff --git a/skills/_index/published.json b/skills/_index/published.json
index 8541897..05494a9 100644
--- a/skills/_index/published.json
+++ b/skills/_index/published.json
@@ -3,11 +3,11 @@
     "outlook-mail",
     "filesystem-operation",
     "terminal-operation",
-    "web-operation",
     "utility-tools",
     "skills-admin",
     "cron-scheduler",
     "memory-management",
-    "officebench-mcp"
+    "officebench-mcp",
+    "multi-search-engine"
   ]
 }
diff --git a/skills/web-operation/current.json b/skills/multi-search-engine/current.json
similarity index 93%
rename from skills/web-operation/current.json
rename to skills/multi-search-engine/current.json
index 0c6a67a..804b8d9 100644
--- a/skills/web-operation/current.json
+++ b/skills/multi-search-engine/current.json
@@ -1,3 +1,3 @@
 {
   "current_version": "v0001"
-}
\ No newline at end of file
+}
diff --git a/skills/multi-search-engine/skill.json b/skills/multi-search-engine/skill.json
new file mode 100644
index 0000000..f4fedba
--- /dev/null
+++ b/skills/multi-search-engine/skill.json
@@ -0,0 +1,16 @@
+{
+  "created_at": "2026-06-04T09:44:11.388282+00:00",
+  "current_version": "v0001",
+  "description": "Multi search engine integration with 16 engines (7 CN + 9 Global). Supports advanced search operators, time filters, site search, privacy engines, and WolframAlpha knowledge queries. No API keys required.",
+  "display_name": "multi-search-engine",
+  "lineage": [],
+  "name": "multi-search-engine",
+  "owners": [
+    "system",
+    "skillhub"
+  ],
+  "source_kind": "initial",
+  "status": "active",
+  "tags": [],
+  "updated_at": "2026-06-04T09:44:11.388282+00:00"
+}
diff --git a/skills/multi-search-engine/versions/v0001/CHANGELOG.md b/skills/multi-search-engine/versions/v0001/CHANGELOG.md
new file mode 100644
index 0000000..ac41dd8
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/CHANGELOG.md
@@ -0,0 +1,18 @@
+# Changelog
+
+## v2.1.0 (2026-04-11)
+- Version bump to 2.1.0
+
+## v2.0.1 (2026-02-06)
+- Simplified documentation
+- Removed gov-related content
+- Optimized for ClawHub publishing
+
+## v2.0.0 (2026-02-06)
+- Added 9 international search engines
+- Enhanced advanced search capabilities
+- Added DuckDuckGo Bangs support
+- Added WolframAlpha knowledge queries
+
+## v1.0.0 (2026-02-04)
+- Initial release with 8 domestic search engines
diff --git a/skills/multi-search-engine/versions/v0001/CHANNELLOG.md b/skills/multi-search-engine/versions/v0001/CHANNELLOG.md
new file mode 100644
index 0000000..2b51b9b
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/CHANNELLOG.md
@@ -0,0 +1,48 @@
+# Multi Search Engine
+
+## 基本信息
+
+- **名称**: multi-search-engine
+- **版本**: v2.0.1
+- **描述**: 集成16个搜索引擎（7国内+9国际），支持高级搜索语法
+- **发布时间**: 2026-02-06
+
+## 搜索引擎
+
+**国内（7个）**: 百度、必应CN、必应INT、360、搜狗、微信、神马
+**国际（9个）**: Google、Google HK、DuckDuckGo、Yahoo、Startpage、Brave、Ecosia、Qwant、WolframAlpha
+
+## 核心功能
+
+- 高级搜索操作符（site:, filetype:, intitle:等）
+- DuckDuckGo Bangs快捷命令
+- 时间筛选（小时/天/周/月/年）
+- 隐私保护搜索
+- WolframAlpha知识计算
+
+## 更新记录
+
+### v2.0.1 (2026-02-06)
+- 精简文档，优化发布
+
+### v2.0.0 (2026-02-06)
+- 新增9个国际搜索引擎
+- 强化深度搜索能力
+
+### v1.0.0 (2026-02-04)
+- 初始版本：8个国内搜索引擎
+
+## 使用示例
+
+```javascript
+// Google搜索
+web_fetch({"url": "https://www.google.com/search?q=python"})
+
+// 隐私搜索
+web_fetch({"url": "https://duckduckgo.com/html/?q=privacy"})
+
+// 站内搜索
+web_fetch({"url": "https://www.google.com/search?q=site:github.com+python"})
+```
+
+MIT License
diff --git a/skills/multi-search-engine/versions/v0001/SKILL.md b/skills/multi-search-engine/versions/v0001/SKILL.md
new file mode 100644
index 0000000..8242876
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/SKILL.md
@@ -0,0 +1,156 @@
+---
+name: multi-search-engine
+description: Multi search engine integration with 16 engines (7 CN + 9 Global). Supports advanced search operators, time filters, site search, privacy engines, and WolframAlpha knowledge queries. No API keys required.
+tools:
+  - web_fetch
+---
+
+# Multi Search Engine
+
+Integration of 16 search engines for web crawling without API keys.
+
+## Workflow
+
+1. **Preparation**: AI Agent initializes an empty in-memory cookie store. Cookies are only acquired dynamically during search operations when access is denied
+
+2. **Language Evaluation**: Detect the language attribute of the search query. If the query is in Chinese, use Domestic search engines (Baidu, Bing CN, Bing INT, 360, Sogou, WeChat, Shenma). If the query is non-Chinese, use International search engines (Google, Google HK, DuckDuckGo, Yahoo, Startpage, Brave, Ecosia, Qwant, WolframAlpha). Select engines based on query relevance and availability.
+
+3. **Controlled Search**: Use web_fetch to execute search requests with rate limiting:
+   - Add 1-2 second delay between requests to respect server load
+   - Batch requests in groups of 3-4 engines with sequential execution between batches
+   - Include standard browser headers to identify as legitimate user agent
+   - If access is denied (403/429), fetch engine homepage to obtain fresh session cookies
+
+4. **Cookie Management**: 
+   - Cookies are stored ONLY in memory during runtime
+   - Cookies are acquired on-demand when search requests fail
+   - No cookies are read from or written to config.json or any file
+   - Cookies are cleared after search session completes
+   - Only session cookies from search engine domains are captured
+
+5. **Retry Mechanism**: If a search fails due to cookie/session issues, retry once with freshly acquired cookies after a 2-second delay
+
+6. **Result Aggregation**: Consolidate successful results from search engines, organize and summarize them to output a core search report
+
+## Search Engines
+
+### Domestic (7)
+- **Baidu**: `https://www.baidu.com/s?wd={keyword}`
+- **Bing CN**: `https://cn.bing.com/search?q={keyword}&ensearch=0`
+- **Bing INT**: `https://cn.bing.com/search?q={keyword}&ensearch=1`
+- **360**: `https://www.so.com/s?q={keyword}`
+- **Sogou**: `https://sogou.com/web?query={keyword}`
+- **WeChat**: `https://wx.sogou.com/weixin?type=2&query={keyword}`
+- **Shenma**: `https://m.sm.cn/s?q={keyword}`
+
+### International (9)
+- **Google**: `https://www.google.com/search?q={keyword}`
+- **Google HK**: `https://www.google.com.hk/search?q={keyword}`
+- **DuckDuckGo**: `https://duckduckgo.com/html/?q={keyword}`
+- **Yahoo**: `https://search.yahoo.com/search?p={keyword}`
+- **Startpage**: `https://www.startpage.com/sp/search?query={keyword}`
+- **Brave**: `https://search.brave.com/search?q={keyword}`
+- **Ecosia**: `https://www.ecosia.org/search?q={keyword}`
+- **Qwant**: `https://www.qwant.com/?q={keyword}`
+- **WolframAlpha**: `https://www.wolframalpha.com/input?i={keyword}`
+
+## Quick Examples
+
+```javascript
+// Basic search
+web_fetch({"url": "https://www.google.com/search?q=python+tutorial"})
+
+// Site-specific
+web_fetch({"url": "https://www.google.com/search?q=site:github.com+react"})
+
+// File type
+web_fetch({"url": "https://www.google.com/search?q=machine+learning+filetype:pdf"})
+
+// Time filter (past week)
+web_fetch({"url": "https://www.google.com/search?q=ai+news&tbs=qdr:w"})
+
+// Privacy search
+web_fetch({"url": "https://duckduckgo.com/html/?q=privacy+tools"})
+
+// DuckDuckGo Bangs
+web_fetch({"url": "https://duckduckgo.com/html/?q=!gh+tensorflow"})
+
+// Knowledge calculation
+web_fetch({"url": "https://www.wolframalpha.com/input?i=100+USD+to+CNY"})
+```
+
+## Advanced Operators
+
+| Operator | Example | Description |
+|----------|---------|-------------|
+| `site:` | `site:github.com python` | Search within site |
+| `filetype:` | `filetype:pdf report` | Specific file type |
+| `""` | `"machine learning"` | Exact match |
+| `-` | `python -snake` | Exclude term |
+| `OR` | `cat OR dog` | Either term |
+
+## Time Filters
+
+| Parameter | Description |
+|-----------|-------------|
+| `tbs=qdr:h` | Past hour |
+| `tbs=qdr:d` | Past day |
+| `tbs=qdr:w` | Past week |
+| `tbs=qdr:m` | Past month |
+| `tbs=qdr:y` | Past year |
+
+## Privacy Engines
+
+- **DuckDuckGo**: No tracking
+- **Startpage**: Google results + privacy
+- **Brave**: Independent index
+- **Qwant**: EU GDPR compliant
+
+## Bangs Shortcuts (DuckDuckGo)
+
+| Bang | Destination |
+|------|-------------|
+| `!g` | Google |
+| `!gh` | GitHub |
+| `!so` | Stack Overflow |
+| `!w` | Wikipedia |
+| `!yt` | YouTube |
+
+## WolframAlpha Queries
+
+- Math: `integrate x^2 dx`
+- Conversion: `100 USD to CNY`
+- Stocks: `AAPL stock`
+- Weather: `weather in Beijing`
+
+## Documentation
+
+- `references/advanced-search.md` - Domestic search guide
+- `references/international-search.md` - International search guide
+- `CHANGELOG.md` - Version history
+
+## License
+
+MIT
+
+## Security & Privacy Notice
+
+### Cookie Handling
+- **Purpose**: Cookies are used ONLY to maintain search session state when access is denied (403/429 errors)
+- **Storage**: Cookies are kept STRICTLY in memory during runtime - NEVER persisted to disk or config files
+- **Acquisition**: Cookies are acquired on-demand from search engine homepages only when search requests fail
+- **Scope**: Only session cookies from the specific search engine domain are captured
+- **Lifecycle**: Cookies are cleared immediately after the search session completes
+- **No Pre-configuration**: No cookies are loaded from config.json or any external file at startup
+- **No API Keys**: This tool uses standard web search URLs, no authentication required
+
+### Crawling Ethics
+- **Rate Limiting**: Implement reasonable delays between requests (recommend 1-2 seconds)
+- **Respect robots.txt**: Honor search engine crawling policies
+- **Terms of Service**: Users are responsible for complying with search engine ToS
+- **Purpose**: Designed for legitimate search aggregation, not mass data scraping
+
+### Data Handling
+- **No Personal Data**: Tool does not collect or transmit user personal information
+- **Local Execution**: All operations run locally, no external data transmission
+- **Session Isolation**: Cookies are session-specific and cleared after use
diff --git a/skills/multi-search-engine/versions/v0001/_meta.json b/skills/multi-search-engine/versions/v0001/_meta.json
new file mode 100644
index 0000000..6247bac
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/_meta.json
@@ -0,0 +1,6 @@
+{
+  "ownerId": "kn79j8kk7fb9w10jh83803j7f180a44m",
+  "slug": "multi-search-engine",
+  "version": "2.1.3",
+  "publishedAt": 1775879953831
+}
\ No newline at end of file
diff --git a/skills/multi-search-engine/versions/v0001/config.json b/skills/multi-search-engine/versions/v0001/config.json
new file mode 100644
index 0000000..dac91f8
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/config.json
@@ -0,0 +1,85 @@
+{
+  "name": "multi-search-engine",
+  "engines": [
+    {
+      "name": "Baidu",
+      "url": "https://www.baidu.com/s?wd={keyword}",
+      "region": "cn"
+    },
+    {
+      "name": "Bing CN",
+      "url": "https://cn.bing.com/search?q={keyword}&ensearch=0",
+      "region": "cn"
+    },
+    {
+      "name": "Bing INT",
+      "url": "https://cn.bing.com/search?q={keyword}&ensearch=1",
+      "region": "cn"
+    },
+    {
+      "name": "360",
+      "url": "https://www.so.com/s?q={keyword}",
+      "region": "cn"
+    },
+    {
+      "name": "Sogou",
+      "url": "https://sogou.com/web?query={keyword}",
+      "region": "cn"
+    },
+    {
+      "name": "WeChat",
+      "url": "https://wx.sogou.com/weixin?type=2&query={keyword}",
+      "region": "cn"
+    },
+    {
+      "name": "Shenma",
+      "url": "https://m.sm.cn/s?q={keyword}",
+      "region": "cn"
+    },
+    {
+      "name": "Google",
+      "url": "https://www.google.com/search?q={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "Google HK",
+      "url": "https://www.google.com.hk/search?q={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "DuckDuckGo",
+      "url": "https://duckduckgo.com/html/?q={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "Yahoo",
+      "url": "https://search.yahoo.com/search?p={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "Startpage",
+      "url": "https://www.startpage.com/sp/search?query={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "Brave",
+      "url": "https://search.brave.com/search?q={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "Ecosia",
+      "url": "https://www.ecosia.org/search?q={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "Qwant",
+      "url": "https://www.qwant.com/?q={keyword}",
+      "region": "global"
+    },
+    {
+      "name": "WolframAlpha",
+      "url": "https://www.wolframalpha.com/input?i={keyword}",
+      "region": "global"
+    }
+  ]
+}
\ No newline at end of file
diff --git a/skills/multi-search-engine/versions/v0001/metadata.json b/skills/multi-search-engine/versions/v0001/metadata.json
new file mode 100644
index 0000000..9e89474
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/metadata.json
@@ -0,0 +1,7 @@
+{
+  "name": "multi-search-engine",
+  "version": "2.1.0",
+  "description": "Multi search engine with 16 engines (7 CN + 9 Global). Supports advanced operators, time filters, privacy engines.",
+  "engines": 16,
+  "requires_api_key": false
+}
\ No newline at end of file
diff --git a/skills/multi-search-engine/versions/v0001/references/advanced-search.md b/skills/multi-search-engine/versions/v0001/references/advanced-search.md
new file mode 100644
index 0000000..85bc5e3
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/references/advanced-search.md
@@ -0,0 +1,146 @@
+# 国内搜索引擎深度搜索指南
+
+## 🔍 百度 (Baidu)
+
+### 特色功能
+
+| 功能 | 说明 | URL |
+|------|------|-----|
+| **中文优化** | 中文内容索引最全 | `https://www.baidu.com/s?wd={keyword}` |
+| **百度学术** | 学术资源搜索 | `https://xueshu.baidu.com/s?wd={keyword}` |
+| **百度新闻** | 新闻聚合 | `https://news.baidu.com/` |
+
+### 搜索示例
+
+```javascript
+// 1. 基础搜索
+web_fetch({"url": "https://www.baidu.com/s?wd=Python教程"})
+
+// 2. 站内搜索
+web_fetch({"url": "https://www.baidu.com/s?wd=site:github.com+python"})
+
+// 3. 文件类型搜索
+web_fetch({"url": "https://www.baidu.com/s?wd=机器学习+filetype:pdf"})
+
+// 4. 学术搜索
+web_fetch({"url": "https://xueshu.baidu.com/s?wd=深度学习+图像识别"})
+```
+
+---
+
+## 🔎 必应中国版 (Bing CN/INT)
+
+### 特色功能
+
+| 功能 | 说明 | URL |
+|------|------|-----|
+| **中文优化** | `ensearch=0` 中文结果 | `https://cn.bing.com/search?q={keyword}&ensearch=0` |
+| **国际版** | `ensearch=1` 英文结果 | `https://cn.bing.com/search?q={keyword}&ensearch=1` |
+| **学术搜索** | 学术资源 | `https://cn.bing.com/academic/search?q={keyword}` |
+
+### 搜索示例
+
+```javascript
+// 1. 中文搜索结果
+web_fetch({"url": "https://cn.bing.com/search?q=人工智能技术&ensearch=0"})
+
+// 2. 英文搜索结果（使用中国服务器）
+web_fetch({"url": "https://cn.bing.com/search?q=artificial+intelligence&ensearch=1"})
+
+// 3. 学术搜索
+web_fetch({"url": "https://cn.bing.com/academic/search?q=机器学习算法"})
+```
+
+---
+
+## 🔍 360搜索
+
+### 特色功能
+
+| 功能 | 说明 | URL |
+|------|------|-----|
+| **安全搜索** | 内置安全防护 | 默认开启 |
+| **基础搜索** | 网页搜索 | `https://www.so.com/s?q={keyword}` |
+
+### 搜索示例
+
+```javascript
+// 1. 基础搜索
+web_fetch({"url": "https://www.so.com/s?q=网络安全"})
+
+// 2. 站内搜索
+web_fetch({"url": "https://www.so.com/s?q=site:zhihu.com+python"})
+```
+
+---
+
+## 🔍 搜狗 (Sogou) + 微信搜索
+
+### 特色功能
+
+| 功能 | 说明 | URL |
+|------|------|-----|
+| **网页搜索** | 通用搜索 | `https://sogou.com/web?query={keyword}` |
+| **微信公众号** | 搜公众号文章（唯一渠道） | `https://wx.sogou.com/weixin?type=2&query={keyword}` |
+| **知乎优化** | 知乎内容索引好 | `site:zhihu.com` 配合使用 |
+
+### 搜索示例
+
+```javascript
+// 1. 网页搜索
+web_fetch({"url": "https://sogou.com/web?query=python教程"})
+
+// 2. 微信公众号文章搜索
+web_fetch({"url": "https://wx.sogou.com/weixin?type=2&query=Python编程"})
+
+// 3. 搜索特定公众号
+web_fetch({"url": "https://wx.sogou.com/weixin?type=2&query=公众号:机器之心"})
+
+// 4. 知乎内容搜索
+web_fetch({"url": "https://www.sogou.com/web?query=site:zhihu.com+机器学习"})
+```
+
+---
+
+## 📱 神马搜索 (Shenma)
+
+### 特色功能
+
+| 功能 | 说明 | URL |
+|------|------|-----|
+| **移动优化** | 专注移动端搜索 | `https://m.sm.cn/s?q={keyword}` |
+| **阿里生态** | 整合阿里系内容 | UC浏览器默认搜索 |
+
+### 搜索示例
+
+```javascript
+// 1. 移动端搜索
+web_fetch({"url": "https://m.sm.cn/s?q=python入门教程"})
+
+// 2. 移动网站点搜索
+web_fetch({"url": "https://m.sm.cn/s?q=site:zhuanlan.zhihu.com+AI"})
+```
+
+---
+
+## 🌍 国内搜索策略
+
+### 按搜索目标选择引擎
+
+| 搜索目标 | 首选引擎 | 原因 |
+|---------|---------|------|
+| **综合中文内容** | 百度 | 中文索引最全 |
+| **微信公众号** | 搜狗微信 | 唯一支持公众号搜索 |
+| **知乎内容** | 搜狗 | 知乎优化好 |
+| **移动端内容** | 神马 | 移动端优化 |
+| **学术资源** | 必应学术 | 学术索引 |
+| **中英文双语** | 必应中国/国际版 | enswitch切换 |
+| **新闻资讯** | 百度新闻 | 新闻聚合 |
+
+---
+
+## 📚 参考资料
+
+- [百度搜索高级语法](https://baike.baidu.com/item/搜索语法)
+- [必应搜索技巧](https://cn.bing.com/tips)
+- [搜狗搜索帮助](https://help.sogou.com/)
diff --git a/skills/multi-search-engine/versions/v0001/references/international-search.md b/skills/multi-search-engine/versions/v0001/references/international-search.md
new file mode 100644
index 0000000..dba4f49
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/references/international-search.md
@@ -0,0 +1,398 @@
+# 国际搜索引擎深度搜索指南
+
+## 🔍 Google 深度搜索
+
+### 1.1 基础高级搜索操作符
+
+| 操作符 | 功能 | 示例 | URL |
+|--------|------|------|-----|
+| `""` | 精确匹配 | `"machine learning"` | `https://www.google.com/search?q=%22machine+learning%22` |
+| `-` | 排除关键词 | `python -snake` | `https://www.google.com/search?q=python+-snake` |
+| `OR` | 或运算 | `machine learning OR deep learning` | `https://www.google.com/search?q=machine+learning+OR+deep+learning` |
+| `*` | 通配符 | `machine * algorithms` | `https://www.google.com/search?q=machine+*+algorithms` |
+| `()` | 分组 | `(apple OR microsoft) phones` | `https://www.google.com/search?q=(apple+OR+microsoft)+phones` |
+| `..` | 数字范围 | `laptop $500..$1000` | `https://www.google.com/search?q=laptop+%24500..%241000` |
+
+### 1.2 站点与文件搜索
+
+| 操作符 | 功能 | 示例 |
+|--------|------|------|
+| `site:` | 站内搜索 | `site:github.com python projects` |
+| `filetype:` | 文件类型 | `filetype:pdf annual report` |
+| `inurl:` | URL包含 | `inurl:login admin` |
+| `intitle:` | 标题包含 | `intitle:"index of" mp3` |
+| `intext:` | 正文包含 | `intext:password filetype:txt` |
+| `cache:` | 查看缓存 | `cache:example.com` |
+| `related:` | 相关网站 | `related:github.com` |
+| `info:` | 网站信息 | `info:example.com` |
+
+### 1.3 时间筛选参数
+
+| 参数 | 含义 | URL示例 |
+|------|------|---------|
+| `tbs=qdr:h` | 过去1小时 | `https://www.google.com/search?q=news&tbs=qdr:h` |
+| `tbs=qdr:d` | 过去24小时 | `https://www.google.com/search?q=news&tbs=qdr:d` |
+| `tbs=qdr:w` | 过去1周 | `https://www.google.com/search?q=news&tbs=qdr:w` |
+| `tbs=qdr:m` | 过去1月 | `https://www.google.com/search?q=news&tbs=qdr:m` |
+| `tbs=qdr:y` | 过去1年 | `https://www.google.com/search?q=news&tbs=qdr:y` |
+| `tbs=cdr:1,cd_min:1/1/2024,cd_max:12/31/2024` | 自定义日期范围 | 2024年全年 |
+
+### 1.4 语言和地区筛选
+
+| 参数 | 功能 | 示例 |
+|------|------|------|
+| `hl=en` | 界面语言 | `https://www.google.com/search?q=test&hl=en` |
+| `lr=lang_zh-CN` | 搜索结果语言 | `https://www.google.com/search?q=test&lr=lang_zh-CN` |
+| `cr=countryCN` | 国家/地区 | `https://www.google.com/search?q=test&cr=countryCN` |
+| `gl=us` | 地理位置 | `https://www.google.com/search?q=test&gl=us` |
+
+### 1.5 特殊搜索类型
+
+| 类型 | URL | 说明 |
+|------|-----|------|
+| 图片搜索 | `https://www.google.com/search?q={keyword}&tbm=isch` | `tbm=isch` 表示图片 |
+| 新闻搜索 | `https://www.google.com/search?q={keyword}&tbm=nws` | `tbm=nws` 表示新闻 |
+| 视频搜索 | `https://www.google.com/search?q={keyword}&tbm=vid` | `tbm=vid` 表示视频 |
+| 地图搜索 | `https://www.google.com/search?q={keyword}&tbm=map` | `tbm=map` 表示地图 |
+| 购物搜索 | `https://www.google.com/search?q={keyword}&tbm=shop` | `tbm=shop` 表示购物 |
+| 图书搜索 | `https://www.google.com/search?q={keyword}&tbm=bks` | `tbm=bks` 表示图书 |
+| 学术搜索 | `https://scholar.google.com/scholar?q={keyword}` | Google Scholar |
+
+### 1.6 Google 深度搜索示例
+
+```javascript
+// 1. 搜索GitHub上的Python机器学习项目
+web_fetch({"url": "https://www.google.com/search?q=site:github.com+python+machine+learning"})
+
+// 2. 搜索2024年的PDF格式机器学习教程
+web_fetch({"url": "https://www.google.com/search?q=machine+learning+tutorial+filetype:pdf&tbs=cdr:1,cd_min:1/1/2024"})
+
+// 3. 搜索标题包含"tutorial"的Python相关页面
+web_fetch({"url": "https://www.google.com/search?q=intitle:tutorial+python"})
+
+// 4. 搜索过去一周的新闻
+web_fetch({"url": "https://www.google.com/search?q=AI+breakthrough&tbs=qdr:w&tbm=nws"})
+
+// 5. 搜索中文内容（界面英文，结果中文）
+web_fetch({"url": "https://www.google.com/search?q=人工智能&lr=lang_zh-CN&hl=en"})
+
+// 6. 搜索特定价格范围的笔记本电脑
+web_fetch({"url": "https://www.google.com/search?q=laptop+%241000..%242000+best+rating"})
+
+// 7. 搜索排除Wikipedia的结果
+web_fetch({"url": "https://www.google.com/search?q=python+programming+-wikipedia"})
+
+// 8. 搜索学术文献
+web_fetch({"url": "https://scholar.google.com/scholar?q=deep+learning+optimization"})
+
+// 9. 搜索缓存页面（查看已删除内容）
+web_fetch({"url": "https://webcache.googleusercontent.com/search?q=cache:example.com"})
+
+// 10. 搜索相关网站
+web_fetch({"url": "https://www.google.com/search?q=related:stackoverflow.com"})
+```
+
+---
+
+## 🦆 DuckDuckGo 深度搜索
+
+### 2.1 DuckDuckGo 特色功能
+
+| 功能 | 语法 | 示例 |
+|------|------|------|
+| **Bangs 快捷** | `!缩写` | `!g python` → Google搜索 |
+| **密码生成** | `password` | `https://duckduckgo.com/?q=password+20` |
+| **颜色转换** | `color` | `https://duckduckgo.com/?q=+%23FF5733` |
+| **短链接** | `shorten` | `https://duckduckgo.com/?q=shorten+example.com` |
+| **二维码生成** | `qr` | `https://duckduckgo.com/?q=qr+hello+world` |
+| **生成UUID** | `uuid` | `https://duckduckgo.com/?q=uuid` |
+| **Base64编解码** | `base64` | `https://duckduckgo.com/?q=base64+hello` |
+
+### 2.2 DuckDuckGo Bangs 完整列表
+
+#### 搜索引擎
+
+| Bang | 跳转目标 | 示例 |
+|------|---------|------|
+| `!g` | Google | `!g python tutorial` |
+| `!b` | Bing | `!b weather` |
+| `!y` | Yahoo | `!y finance` |
+| `!sp` | Startpage | `!sp privacy` |
+| `!brave` | Brave Search | `!brave tech` |
+
+#### 编程开发
+
+| Bang | 跳转目标 | 示例 |
+|------|---------|------|
+| `!gh` | GitHub | `!gh tensorflow` |
+| `!so` | Stack Overflow | `!so javascript error` |
+| `!npm` | npmjs.com | `!npm express` |
+| `!pypi` | PyPI | `!pypi requests` |
+| `!mdn` | MDN Web Docs | `!mdn fetch api` |
+| `!docs` | DevDocs | `!docs python` |
+| `!docker` | Docker Hub | `!docker nginx` |
+
+#### 知识百科
+
+| Bang | 跳转目标 | 示例 |
+|------|---------|------|
+| `!w` | Wikipedia | `!w machine learning` |
+| `!wen` | Wikipedia英文 | `!wen artificial intelligence` |
+| `!wt` | Wiktionary | `!wt serendipity` |
+| `!imdb` | IMDb | `!imdb inception` |
+
+#### 购物价格
+
+| Bang | 跳转目标 | 示例 |
+|------|---------|------|
+| `!a` | Amazon | `!a wireless headphones` |
+| `!e` | eBay | `!e vintage watch` |
+| `!ali` | AliExpress | `!ali phone case` |
+
+#### 地图位置
+
+| Bang | 跳转目标 | 示例 |
+|------|---------|------|
+| `!m` | Google Maps | `!m Beijing` |
+| `!maps` | OpenStreetMap | `!maps Paris` |
+
+### 2.3 DuckDuckGo 搜索参数
+
+| 参数 | 功能 | 示例 |
+|------|------|------|
+| `kp=1` | 严格安全搜索 | `https://duckduckgo.com/html/?q=test&kp=1` |
+| `kp=-1` | 关闭安全搜索 | `https://duckduckgo.com/html/?q=test&kp=-1` |
+| `kl=cn` | 中国区域 | `https://duckduckgo.com/html/?q=news&kl=cn` |
+| `kl=us-en` | 美国英文 | `https://duckduckgo.com/html/?q=news&kl=us-en` |
+| `ia=web` | 网页结果 | `https://duckduckgo.com/?q=test&ia=web` |
+| `ia=images` | 图片结果 | `https://duckduckgo.com/?q=test&ia=images` |
+| `ia=news` | 新闻结果 | `https://duckduckgo.com/?q=test&ia=news` |
+| `ia=videos` | 视频结果 | `https://duckduckgo.com/?q=test&ia=videos` |
+
+### 2.4 DuckDuckGo 深度搜索示例
+
+```javascript
+// 1. 使用Bang跳转到Google搜索
+web_fetch({"url": "https://duckduckgo.com/html/?q=!g+machine+learning"})
+
+// 2. 直接搜索GitHub上的项目
+web_fetch({"url": "https://duckduckgo.com/html/?q=!gh+react"})
+
+// 3. 查找Stack Overflow答案
+web_fetch({"url": "https://duckduckgo.com/html/?q=!so+python+list+comprehension"})
+
+// 4. 生成密码
+web_fetch({"url": "https://duckduckgo.com/?q=password+16"})
+
+// 5. Base64编码
+web_fetch({"url": "https://duckduckgo.com/?q=base64+hello+world"})
+
+// 6. 颜色代码转换
+web_fetch({"url": "https://duckduckgo.com/?q=%23FF5733"})
+
+// 7. 搜索YouTube视频
+web_fetch({"url": "https://duckduckgo.com/html/?q=!yt+python+tutorial"})
+
+// 8. 查看Wikipedia
+web_fetch({"url": "https://duckduckgo.com/html/?q=!w+artificial+intelligence"})
+
+// 9. 亚马逊商品搜索
+web_fetch({"url": "https://duckduckgo.com/html/?q=!a+laptop"})
+
+// 10. 生成二维码
+web_fetch({"url": "https://duckduckgo.com/?q=qr+https://github.com"})
+```
+
+---
+
+## 🔎 Brave Search 深度搜索
+
+### 3.1 Brave Search 特色功能
+
+| 功能 | 参数 | 示例 |
+|------|------|------|
+| **独立索引** | 无依赖Google/Bing | 自有爬虫索引 |
+| **Goggles** | 自定义搜索规则 | 创建个性化过滤器 |
+| **Discussions** | 论坛讨论搜索 | 聚合Reddit等论坛 |
+| **News** | 新闻聚合 | 独立新闻索引 |
+
+### 3.2 Brave Search 参数
+
+| 参数 | 功能 | 示例 |
+|------|------|------|
+| `tf=pw` | 本周 | `https://search.brave.com/search?q=news&tf=pw` |
+| `tf=pm` | 本月 | `https://search.brave.com/search?q=tech&tf=pm` |
+| `tf=py` | 本年 | `https://search.brave.com/search?q=AI&tf=py` |
+| `safesearch=strict` | 严格安全 | `https://search.brave.com/search?q=test&safesearch=strict` |
+| `source=web` | 网页搜索 | 默认 |
+| `source=news` | 新闻搜索 | `https://search.brave.com/search?q=tech&source=news` |
+| `source=images` | 图片搜索 | `https://search.brave.com/search?q=cat&source=images` |
+| `source=videos` | 视频搜索 | `https://search.brave.com/search?q=music&source=videos` |
+
+### 3.3 Brave Search Goggles（自定义过滤器）
+
+Goggles 允许创建自定义搜索规则：
+
+```
+$discard  // 丢弃所有
+$boost,site=stackoverflow.com  // 提升Stack Overflow
+$boost,site=github.com  // 提升GitHub
+$boost,site=docs.python.org  // 提升Python文档
+```
+
+### 3.4 Brave Search 深度搜索示例
+
+```javascript
+// 1. 本周科技新闻
+web_fetch({"url": "https://search.brave.com/search?q=technology&tf=pw&source=news"})
+
+// 2. 本月AI发展
+web_fetch({"url": "https://search.brave.com/search?q=artificial+intelligence&tf=pm"})
+
+// 3. 图片搜索
+web_fetch({"url": "https://search.brave.com/search?q=machine+learning&source=images"})
+
+// 4. 视频教程
+web_fetch({"url": "https://search.brave.com/search?q=python+tutorial&source=videos"})
+
+// 5. 使用独立索引搜索
+web_fetch({"url": "https://search.brave.com/search?q=privacy+tools"})
+```
+
+---
+
+## 📊 WolframAlpha 知识计算搜索
+
+### 4.1 WolframAlpha 数据类型
+
+| 类型 | 查询示例 | URL |
+|------|---------|-----|
+| **数学计算** | `integrate x^2 dx` | `https://www.wolframalpha.com/input?i=integrate+x%5E2+dx` |
+| **单位换算** | `100 miles to km` | `https://www.wolframalpha.com/input?i=100+miles+to+km` |
+| **货币转换** | `100 USD to CNY` | `https://www.wolframalpha.com/input?i=100+USD+to+CNY` |
+| **股票数据** | `AAPL stock` | `https://www.wolframalpha.com/input?i=AAPL+stock` |
+| **天气查询** | `weather in Beijing` | `https://www.wolframalpha.com/input?i=weather+in+Beijing` |
+| **人口数据** | `population of China` | `https://www.wolframalpha.com/input?i=population+of+China` |
+| **化学元素** | `properties of gold` | `https://www.wolframalpha.com/input?i=properties+of+gold` |
+| **营养成分** | `nutrition of apple` | `https://www.wolframalpha.com/input?i=nutrition+of+apple` |
+| **日期计算** | `days between Jan 1 2020 and Dec 31 2024` | 日期间隔计算 |
+| **时区转换** | `10am Beijing to New York` | 时区转换 |
+| **IP地址** | `8.8.8.8` | IP信息查询 |
+| **条形码** | `scan barcode 123456789` | 条码信息 |
+| **飞机航班** | `flight AA123` | 航班信息 |
+
+### 4.2 WolframAlpha 深度搜索示例
+
+```javascript
+// 1. 计算积分
+web_fetch({"url": "https://www.wolframalpha.com/input?i=integrate+sin%28x%29+from+0+to+pi"})
+
+// 2. 解方程
+web_fetch({"url": "https://www.wolframalpha.com/input?i=solve+x%5E2-5x%2B6%3D0"})
+
+// 3. 货币实时汇率
+web_fetch({"url": "https://www.wolframalpha.com/input?i=100+USD+to+CNY"})
+
+// 4. 股票实时数据
+web_fetch({"url": "https://www.wolframalpha.com/input?i=Apple+stock+price"})
+
+// 5. 城市天气
+web_fetch({"url": "https://www.wolframalpha.com/input?i=weather+in+Shanghai+tomorrow"})
+
+// 6. 国家统计信息
+web_fetch({"url": "https://www.wolframalpha.com/input?i=GDP+of+China+vs+USA"})
+
+// 7. 化学计算
+web_fetch({"url": "https://www.wolframalpha.com/input?i=molar+mass+of+H2SO4"})
+
+// 8. 物理常数
+web_fetch({"url": "https://www.wolframalpha.com/input?i=speed+of+light"})
+
+// 9. 营养信息
+web_fetch({"url": "https://www.wolframalpha.com/input?i=calories+in+banana"})
+
+// 10. 历史日期
+web_fetch({"url": "https://www.wolframalpha.com/input?i=events+on+July+20+1969"})
+```
+
+---
+
+## 🔧 Startpage 隐私搜索
+
+### 5.1 Startpage 特色功能
+
+| 功能 | 说明 | URL |
+|------|------|-----|
+| **代理浏览** | 匿名访问搜索结果 | 点击"匿名查看" |
+| **无追踪** | 不记录搜索历史 | 默认开启 |
+| **EU服务器** | 受欧盟隐私法保护 | 数据在欧洲 |
+| **代理图片** | 图片代理加载 | 隐藏IP |
+
+### 5.2 Startpage 参数
+
+| 参数 | 功能 | 示例 |
+|------|------|------|
+| `cat=web` | 网页搜索 | 默认 |
+| `cat=images` | 图片搜索 | `...&cat=images` |
+| `cat=video` | 视频搜索 | `...&cat=video` |
+| `cat=news` | 新闻搜索 | `...&cat=news` |
+| `language=english` | 英文结果 | `...&language=english` |
+| `time=day` | 过去24小时 | `...&time=day` |
+| `time=week` | 过去一周 | `...&time=week` |
+| `time=month` | 过去一月 | `...&time=month` |
+| `time=year` | 过去一年 | `...&time=year` |
+| `nj=0` | 关闭 family filter | `...&nj=0` |
+
+### 5.3 Startpage 深度搜索示例
+
+```javascript
+// 1. 隐私搜索
+web_fetch({"url": "https://www.startpage.com/sp/search?query=privacy+tools"})
+
+// 2. 图片隐私搜索
+web_fetch({"url": "https://www.startpage.com/sp/search?query=nature&cat=images"})
+
+// 3. 本周新闻（隐私模式）
+web_fetch({"url": "https://www.startpage.com/sp/search?query=tech+news&time=week&cat=news"})
+
+// 4. 英文结果搜索
+web_fetch({"url": "https://www.startpage.com/sp/search?query=machine+learning&language=english"})
+```
+
+---
+
+## 🌐 其他国际搜索引擎
+
+### Yahoo
+
+```javascript
+web_fetch({"url": "https://search.yahoo.com/search?p={keyword}"})
+```
+
+### Ecosia（环保搜索）
+
+```javascript
+web_fetch({"url": "https://www.ecosia.org/search?q={keyword}"})
+```
+
+### Qwant（欧盟隐私搜索）
+
+```javascript
+web_fetch({"url": "https://www.qwant.com/?q={keyword}"})
+```
+
+---
+
+## 🌍 国际搜索策略
+
+### 按搜索目标选择引擎
+
+| 搜索目标 | 首选引擎 | 原因 |
+|---------|---------|------|
+| **学术研究** | Google Scholar | 学术资源索引最全 |
+| **编程开发** | Google + DuckDuckGo Bangs | 技术文档全面 |
+| **隐私敏感** | DuckDuckGo / Brave | 不追踪用户 |
+| **实时新闻** | Brave News | 独立新闻索引 |
+| **知识计算** | WolframAlpha | 结构化数据计算 |
+| **隐私+Google结果** | Startpage | Google结果+隐私保护 |
+
diff --git a/skills/multi-search-engine/versions/v0001/version.json b/skills/multi-search-engine/versions/v0001/version.json
new file mode 100644
index 0000000..25fb953
--- /dev/null
+++ b/skills/multi-search-engine/versions/v0001/version.json
@@ -0,0 +1,31 @@
+{
+  "change_reason": "Initial skill seeded from SkillHub global/multi-search-engine@20260413.065325",
+  "content_hash": "fd2d3fecd923622e6fda6c607ae4913a9a88601cbb266c7b6a25ea856e4d7f91",
+  "created_at": "2026-06-04T09:44:11.388282+00:00",
+  "created_by": "skillhub",
+  "frontmatter": {
+    "description": "Multi search engine integration with 16 engines (7 CN + 9 Global). Supports advanced search operators, time filters, site search, privacy engines, and WolframAlpha knowledge queries. No API keys required.",
+    "name": "multi-search-engine",
+    "tools": [
+      "web_fetch"
+    ]
+  },
+  "parent_version": null,
+  "provenance": {
+    "namespace": "global",
+    "skillhub_version": "20260413.065325",
+    "slug": "multi-search-engine",
+    "source": "initial_skills",
+    "source_kind": "initial",
+    "upstream_source": "skillhub",
+    "source_url": "https://skillhub.bwgdi.com/space/global/multi-search-engine"
+  },
+  "review_state": "published",
+  "skill_name": "multi-search-engine",
+  "summary": "# Multi Search Engine Integration of 16 search engines for web crawling without API keys. ## Workflow",
+  "summary_hash": "214e55914a70eabf8635c1d0bd4df1f46e01f988bed9ef42070aeab6aaf12c3b",
+  "tool_hints": [
+    "web_fetch"
+  ],
+  "version": "v0001"
+}
diff --git a/skills/skills-admin/skill.json b/skills/skills-admin/skill.json
index 02477c7..244afaa 100644
--- a/skills/skills-admin/skill.json
+++ b/skills/skills-admin/skill.json
@@ -1,13 +1,13 @@
 {
   "created_at": "2026-05-26T00:00:00.000000+00:00",
   "current_version": "v0001",
-  "description": "技能（Skill）列表查看、内容加载和草稿管理。用于浏览已发布技能和创建新技能草稿。",
+  "description": "技能（Skill）列表查看和内容加载。用于浏览已发布技能、读取技能正文和支持文件。",
   "display_name": "skills-admin",
   "lineage": [],
   "name": "skills-admin",
   "owners": ["system"],
   "source_kind": "initial",
   "status": "active",
-  "tags": ["skills", "admin", "management", "draft"],
+  "tags": ["skills", "admin", "inspection"],
   "updated_at": "2026-05-26T00:00:00.000000+00:00"
-}
\ No newline at end of file
+}
diff --git a/skills/skills-admin/versions/v0001/SKILL.md b/skills/skills-admin/versions/v0001/SKILL.md
index dbbfbba..4c41a3b 100644
--- a/skills/skills-admin/versions/v0001/SKILL.md
+++ b/skills/skills-admin/versions/v0001/SKILL.md
@@ -1,15 +1,14 @@
 ---
 name: skills-admin
-description: 技能（Skill）列表查看、内容加载和草稿管理。用于浏览已发布技能和创建新技能草稿。
+description: 技能（Skill）列表查看和内容加载。用于浏览已发布技能、读取技能正文和支持文件。
 tools:
   - skills_list
-  - skill_manage
   - skill_view
 ---
 
-# Skills Admin — 技能管理
+# Skills Admin — 技能查看
 
-查看已发布的技能列表、加载技能详情和创建新技能草稿。
+查看已发布的技能列表并加载技能详情。
 
 ## 工具说明
 
@@ -25,18 +24,9 @@ tools:
 - 不传文件路径时返回 SKILL.md 主内容
 - 支持按需加载 references/、templates/ 等目录
 
-### skill_manage
-创建新技能草稿（draft）。
-- `action` (str): 仅支持 "create_draft"
-- `name` (str): 技能名称
-- `description` (str): 技能描述
-- `content` (str): 技能正文（SKILL.md 格式）
-- 创建的草稿需经过 review → publish 流程
-
 ## 使用原则
 
 1. 需要参考某个技能的详细内容时，先 `skills_list` 找到名称，再用 `skill_view` 加载
-2. 创建新技能时先写清楚 description，便于后续被 selector 选中
-3. 技能正文使用标准 frontmatter + Markdown 格式
-4. 支持文件放在 skill 目录的 references/、templates/、scripts/ 等子目录
-5. Draft 创建后需要走 review/publish 流程才能生效
+2. 用户问“你有哪些技能”时，优先使用 `skills_list` 获取当前可见技能
+3. 用户问某个技能如何工作时，用 `skill_view` 读取正文或支持文件
+4. 这个默认技能不创建草稿；技能创作能力属于单独的 authoring/admin skill
diff --git a/skills/skills-admin/versions/v0001/version.json b/skills/skills-admin/versions/v0001/version.json
index 3004c67..942b6fd 100644
--- a/skills/skills-admin/versions/v0001/version.json
+++ b/skills/skills-admin/versions/v0001/version.json
@@ -1,12 +1,12 @@
 {
-  "change_reason": "Initial skill for skills management",
+  "change_reason": "Initial skill for skills inspection",
   "content_hash": "placeholder",
   "created_at": "2026-05-26T00:00:00.000000+00:00",
   "created_by": "system",
   "frontmatter": {
-    "description": "技能（Skill）列表查看、内容加载和草稿管理。用于浏览已发布技能和创建新技能草稿。",
+    "description": "技能（Skill）列表查看和内容加载。用于浏览已发布技能、读取技能正文和支持文件。",
     "name": "skills-admin",
-    "tools": ["skills_list", "skill_manage", "skill_view"]
+    "tools": ["skills_list", "skill_view"]
   },
   "parent_version": null,
   "provenance": {
@@ -15,8 +15,8 @@
   },
   "review_state": "published",
   "skill_name": "skills-admin",
-  "summary": "Skills Admin — 技能列表查看、内容加载和草稿管理",
+  "summary": "Skills Admin — 技能列表查看和内容加载",
   "summary_hash": "placeholder",
-  "tool_hints": ["skills_list", "skill_manage", "skill_view"],
+  "tool_hints": ["skills_list", "skill_view"],
   "version": "v0001"
-}
\ No newline at end of file
+}
diff --git a/skills/skills-authoring-admin/current.json b/skills/skills-authoring-admin/current.json
new file mode 100644
index 0000000..804b8d9
--- /dev/null
+++ b/skills/skills-authoring-admin/current.json
@@ -0,0 +1,3 @@
+{
+  "current_version": "v0001"
+}
diff --git a/skills/skills-authoring-admin/skill.json b/skills/skills-authoring-admin/skill.json
new file mode 100644
index 0000000..09af259
--- /dev/null
+++ b/skills/skills-authoring-admin/skill.json
@@ -0,0 +1,13 @@
+{
+  "created_at": "2026-06-04T00:00:00.000000+00:00",
+  "current_version": "v0001",
+  "description": "技能草稿创建管理。用于显式创建新 Skill draft，默认不向普通 Agent 暴露。",
+  "display_name": "skills-authoring-admin",
+  "lineage": [],
+  "name": "skills-authoring-admin",
+  "owners": ["system"],
+  "source_kind": "initial",
+  "status": "disabled",
+  "tags": ["skills", "admin", "authoring", "draft"],
+  "updated_at": "2026-06-04T00:00:00.000000+00:00"
+}
diff --git a/skills/skills-authoring-admin/versions/v0001/SKILL.md b/skills/skills-authoring-admin/versions/v0001/SKILL.md
new file mode 100644
index 0000000..f865cac
--- /dev/null
+++ b/skills/skills-authoring-admin/versions/v0001/SKILL.md
@@ -0,0 +1,28 @@
+---
+name: skills-authoring-admin
+description: 技能草稿创建管理。用于显式创建新 Skill draft，默认不向普通 Agent 暴露。
+tools:
+  - skill_manage
+---
+
+# Skills Authoring Admin — 技能草稿创建
+
+创建新的技能草稿。这个能力用于管理员、开发者或受控的技能创作流程，不属于默认初始 Agent 能力。
+
+## 工具说明
+
+### skill_manage
+创建新技能草稿（draft）。
+- `action` (str): 仅支持 "create_draft"
+- `name` (str): 技能名称
+- `description` (str): 技能描述
+- `content` (str): 技能正文（SKILL.md 格式）
+- 创建的草稿需经过 review → publish 流程
+
+## 使用原则
+
+1. 只有用户明确要求创建或沉淀一个 Skill 时才使用
+2. 创建草稿前确认 skill 名称、触发场景、工具依赖和正文边界
+3. 技能正文使用标准 frontmatter + Markdown 格式
+4. Draft 创建后必须经过 review → publish 流程才能生效
+5. 自学习候选生成草稿不依赖这个 tool；自学习流程走 SkillLearningPipelineService
diff --git a/skills/skills-authoring-admin/versions/v0001/version.json b/skills/skills-authoring-admin/versions/v0001/version.json
new file mode 100644
index 0000000..9f67186
--- /dev/null
+++ b/skills/skills-authoring-admin/versions/v0001/version.json
@@ -0,0 +1,22 @@
+{
+  "change_reason": "Split skill draft authoring out of default skills admin",
+  "content_hash": "placeholder",
+  "created_at": "2026-06-04T00:00:00.000000+00:00",
+  "created_by": "system",
+  "frontmatter": {
+    "description": "技能草稿创建管理。用于显式创建新 Skill draft，默认不向普通 Agent 暴露。",
+    "name": "skills-authoring-admin",
+    "tools": ["skill_manage"]
+  },
+  "parent_version": null,
+  "provenance": {
+    "source": "initial_skills",
+    "source_kind": "initial"
+  },
+  "review_state": "disabled",
+  "skill_name": "skills-authoring-admin",
+  "summary": "Skills Authoring Admin — 技能草稿创建",
+  "summary_hash": "placeholder",
+  "tool_hints": ["skill_manage"],
+  "version": "v0001"
+}
diff --git a/skills/web-operation/skill.json b/skills/web-operation/skill.json
deleted file mode 100644
index ef342ac..0000000
--- a/skills/web-operation/skill.json
+++ /dev/null
@@ -1,13 +0,0 @@
-{
-  "created_at": "2026-05-26T00:00:00.000000+00:00",
-  "current_version": "v0001",
-  "description": "网页内容抓取和搜索引擎查询。支持任意 URL 抓取、多搜索引擎和结构化数据提取。",
-  "display_name": "web-operation",
-  "lineage": [],
-  "name": "web-operation",
-  "owners": ["system"],
-  "source_kind": "initial",
-  "status": "active",
-  "tags": ["web", "search", "fetch", "crawl"],
-  "updated_at": "2026-05-26T00:00:00.000000+00:00"
-}
\ No newline at end of file
diff --git a/skills/web-operation/versions/v0001/SKILL.md b/skills/web-operation/versions/v0001/SKILL.md
deleted file mode 100644
index 80ea3f0..0000000
--- a/skills/web-operation/versions/v0001/SKILL.md
+++ /dev/null
@@ -1,36 +0,0 @@
----
-name: web-operation
-description: 网页内容抓取和搜索引擎查询。支持任意 URL 抓取、多搜索引擎和结构化数据提取。
-tools:
-  - web_fetch
-  - web_search
----
-
-# Web Operation — 网络抓取与搜索
-
-网页抓取和网络搜索工具集。
-
-## 工具说明
-
-### web_fetch
-获取指定 URL 的网页内容并转换为 Markdown。
-- 支持 HTML → Markdown 自动转换
-- 可使用 prompt 参数提取特定信息
-- 结果由 AI 总结后返回
-- HTTP URL 自动升级为 HTTPS
-- 含 15 分钟缓存
-
-### web_search
-搜索引擎查询，获取最新网络信息。
-- 支持 domain 过滤（include/block）
-- 搜索当前日期的信息使用正确年份
-- 返回结果包含 URL 链接
-
-## 使用原则
-
-1. 优先使用 `web_search` 搜索信息，再用 `web_fetch` 深入阅读
-2. 获取动态/需要认证的页面可能失败，此时尝试简化请求或换源
-3. 抓取 API 文档时注意区分 REST API 和 GraphQL
-4. 搜索结果必须标注来源链接
-5. 避免短时间内大量请求同一站点（限频）
-6. 不抓取需要登录认证的私密页面
diff --git a/skills/web-operation/versions/v0001/version.json b/skills/web-operation/versions/v0001/version.json
deleted file mode 100644
index 0139a87..0000000
--- a/skills/web-operation/versions/v0001/version.json
+++ /dev/null
@@ -1,22 +0,0 @@
-{
-  "change_reason": "Initial skill for web fetching and searching",
-  "content_hash": "placeholder",
-  "created_at": "2026-05-26T00:00:00.000000+00:00",
-  "created_by": "system",
-  "frontmatter": {
-    "description": "网页内容抓取和搜索引擎查询。支持任意 URL 抓取、多搜索引擎和结构化数据提取。",
-    "name": "web-operation",
-    "tools": ["web_fetch", "web_search"]
-  },
-  "parent_version": null,
-  "provenance": {
-    "source": "initial_skills",
-    "source_kind": "initial"
-  },
-  "review_state": "published",
-  "skill_name": "web-operation",
-  "summary": "Web Operation — 网页抓取与网络搜索工具集",
-  "summary_hash": "placeholder",
-  "tool_hints": ["web_fetch", "web_search"],
-  "version": "v0001"
-}
\ No newline at end of file
diff --git a/test-results/.last-run.json b/test-results/.last-run.json
new file mode 100644
index 0000000..cbcc1fb
--- /dev/null
+++ b/test-results/.last-run.json
@@ -0,0 +1,4 @@
+{
+  "status": "passed",
+  "failedTests": []
+}
\ No newline at end of file