From 4124faa040262f15e632516c0360673c8bdbab7e Mon Sep 17 00:00:00 2001
From: JOJO <1498581755@qq.com>
Date: Fri, 10 Apr 2026 14:34:18 +0800
Subject: [PATCH] =?UTF-8?q?feat(frontend):=20=E4=BC=98=E5=8C=96=E8=81=8A?=
 =?UTF-8?q?=E5=A4=A9=E7=95=8C=E9=9D=A2=E4=B8=8E=E7=9B=91=E6=8E=A7=E4=BA=A4?=
 =?UTF-8?q?=E4=BA=92=E4=BD=93=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 static/src/App.vue                            |  116 +-
 static/src/admin/AdminDashboardApp.vue        |  116 +-
 static/src/admin/ApiAdminApp.vue              |  115 +-
 static/src/admin/CustomToolsApp.vue           |  153 +-
 static/src/admin/CustomToolsGuideApp.vue      |   16 +-
 static/src/admin/PolicyApp.vue                |  121 +-
 static/src/admin/useSecondaryPass.ts          |    4 +-
 static/src/components/chat/ChatArea.vue       |  543 +++--
 static/src/components/chat/MinimalBlocks.vue  |   89 +-
 static/src/components/chat/StackedBlocks.vue  |  193 +-
 .../components/chat/VirtualMonitorSurface.vue |   58 +-
 .../components/chat/actions/ActionSummary.vue |   33 +-
 .../chat/actions/AppendPayloadAction.vue      |    8 +-
 .../chat/actions/ModifyDetailsAction.vue      |   12 +-
 .../chat/actions/ModifySummaryAction.vue      |    8 +-
 .../chat/actions/ThinkingAction.vue           |    6 +-
 .../components/chat/actions/ToolAction.vue    |   26 +-
 .../components/chat/actions/toolRenderers.ts  |   28 +-
 .../chat/loaders/BouncingSquaresLoader.vue    |    2 +-
 .../loaders/ChaoticOrbitSquaresLoader.vue     |   44 +-
 .../chat/loaders/DotSpinnerSquaresLoader.vue  |   73 +-
 .../chat/loaders/DualChaseLoader.vue          |    8 +-
 .../chat/loaders/FiveSquaresLoader.vue        |  156 +-
 .../chat/loaders/FollowTrackSquaresLoader.vue |   34 +-
 .../loaders/FourCornerCycleSquaresLoader.vue  |   33 +-
 .../loaders/JumpingSequenceSquaresLoader.vue  |   25 +-
 .../chat/loaders/LeapFrogSquaresLoader.vue    |   22 +-
 .../loaders/NewtonCradleSquaresLoader.vue     |   32 +-
 .../chat/loaders/NineGridLoader.vue           |  434 +++-
 .../chat/loaders/OrbitBlurSquaresLoader.vue   |   13 +-
 .../chat/loaders/RotatingSquaresLoader.vue    |   85 +-
 .../loaders/ShadowRollingSquaresLoader.vue    |   72 +-
 .../chat/loaders/WaveMatrixSquaresLoader.vue  |   25 +-
 .../chat/monitor/MonitorDirector.ts           |  678 ++++--
 static/src/components/chat/monitor/types.ts   |    6 +-
 static/src/components/files/FileNode.vue      |    6 +-
 static/src/components/input/InputComposer.vue |   49 +-
 static/src/components/input/QuickMenu.vue     |   50 +-
 .../overlay/BackgroundCommandDialog.vue       |   14 +-
 .../overlay/ConversationReviewDialog.vue      |   32 +-
 static/src/components/overlay/ImagePicker.vue |   58 +-
 .../overlay/NewUserTutorialPrompt.vue         |   12 +-
 .../overlay/SubAgentActivityDialog.vue        |    8 +-
 .../components/overlay/TutorialOverlay.vue    |  132 +-
 static/src/components/overlay/VideoPicker.vue |   18 +-
 static/src/components/panels/FocusPanel.vue   |    6 +-
 static/src/components/panels/LeftPanel.vue    |   77 +-
 .../personalization/ExperienceOnboarding.vue  |    2 +-
 .../personalization/PersonalizationDrawer.vue | 2122 ++++++++++-------
 static/src/components/shell/ConfirmDialog.vue |    6 +-
 .../src/components/shell/EasterEggOverlay.vue |    7 +-
 static/src/components/shell/QuotaToast.vue    |    4 +-
 .../sidebar/ConversationSidebar.vue           |   97 +-
 static/src/components/token/TokenDrawer.vue   |   53 +-
 .../styles/components/panels/_left-panel.scss |    6 +
 55 files changed, 4128 insertions(+), 2018 deletions(-)

diff --git a/static/src/App.vue b/static/src/App.vue
index 8575a29..2e3cb93 100644
--- a/static/src/App.vue
+++ b/static/src/App.vue
@@ -116,11 +116,7 @@
             :format-rate="formatRate"
           />
 
-          <div
-            v-if="titleRibbonVisible"
-            class="conversation-ribbon"
-            ref="titleRibbon"
-          >
+          <div v-if="titleRibbonVisible" class="conversation-ribbon" ref="titleRibbon">
             <button
               type="button"
               class="conversation-ribbon__selector"
@@ -135,18 +131,23 @@
                 <span class="selector-mode">{{ headerRunModeLabel }}</span>
               </span>
               <svg viewBox="0 0 24 24" aria-hidden="true" class="selector-caret">
-                <path d="M7 10l5 5 5-5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" />
+                <path
+                  d="M7 10l5 5 5-5"
+                  fill="none"
+                  stroke="currentColor"
+                  stroke-width="1.8"
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                />
               </svg>
             </button>
 
-            <span class="conversation-ribbon__text">{{ titleTypingText || currentConversationTitle }}</span>
+            <span class="conversation-ribbon__text">{{
+              titleTypingText || currentConversationTitle
+            }}</span>
 
             <transition name="header-menu">
-              <div
-                v-if="headerMenuOpen"
-                class="model-mode-dropdown"
-                ref="headerMenu"
-              >
+              <div v-if="headerMenuOpen" class="model-mode-dropdown" ref="headerMenu">
                 <div class="dropdown-column" data-tutorial="header-model-options">
                   <div class="dropdown-title">模型</div>
                   <div class="dropdown-list dropdown-list--models">
@@ -204,7 +205,7 @@
             :format-search-time="formatSearchTime"
             :format-search-domains="formatSearchDomains"
           />
-          <VirtualMonitorSurface v-show="chatDisplayMode === 'monitor'" />
+          <VirtualMonitorSurface v-if="chatDisplayMode === 'monitor'" />
 
           <div v-if="blankHeroActive" class="blank-hero-overlay">
             <span class="icon icon-lg" :style="iconStyle('bot')" aria-hidden="true"></span>
@@ -227,7 +228,13 @@
                 <path d="M8 11h8a1 1 0 0 1 1 1v6a1 1 0 0 1-1 1H8a1 1 0 0 1-1-1v-6a1 1 0 0 1 1-1Z" />
                 <path d="M9 11V8a3 3 0 0 1 6 0v3" />
               </svg>
-              <svg v-else viewBox="0 0 24 24" aria-hidden="true" stroke-linecap="round" stroke-linejoin="round">
+              <svg
+                v-else
+                viewBox="0 0 24 24"
+                aria-hidden="true"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+              >
                 <path d="M12 5v12" />
                 <path d="M7 13l5 5 5-5" />
               </svg>
@@ -298,10 +305,14 @@
           </div>
         </main>
 
-        <div v-if="!isMobileViewport" class="resize-handle" @mousedown="startResize('right', $event)"></div>
+        <div
+          v-if="!isMobileViewport"
+          class="resize-handle"
+          @mousedown="startResize('right', $event)"
+        ></div>
       </div>
 
-      <PersonalizationDrawer />
+      <PersonalizationDrawer v-if="personalizationStore.visible" />
       <transition name="overlay-fade">
         <ImagePicker
           v-if="imagePickerOpen"
@@ -354,7 +365,7 @@
       </transition>
       <SubAgentActivityDialog />
       <BackgroundCommandDialog />
-      <TutorialOverlay />
+      <TutorialOverlay v-if="tutorialStore.running" />
       <NewUserTutorialPrompt
         :visible="tutorialPromptVisible"
         :username="tutorialPromptUsername"
@@ -370,7 +381,13 @@
         ref="mobilePanelTrigger"
       >
         <div class="mobile-panel-topbar">
-          <button type="button" class="mobile-panel-fab" data-tutorial="mobile-menu-trigger" aria-label="切换工作区" @click="toggleMobileOverlayMenu">
+          <button
+            type="button"
+            class="mobile-panel-fab"
+            data-tutorial="mobile-menu-trigger"
+            aria-label="切换工作区"
+            @click="toggleMobileOverlayMenu"
+          >
             <img :src="mobilePanelIcon" alt="" aria-hidden="true" />
           </button>
           <button
@@ -409,8 +426,18 @@
                   stroke-linecap="round"
                   stroke-linejoin="round"
                 />
-                <path d="M8 8.5h8" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" />
-                <path d="M8 11.5h5" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" />
+                <path
+                  d="M8 8.5h8"
+                  stroke="currentColor"
+                  stroke-width="1.7"
+                  stroke-linecap="round"
+                />
+                <path
+                  d="M8 11.5h5"
+                  stroke="currentColor"
+                  stroke-width="1.7"
+                  stroke-linecap="round"
+                />
               </svg>
               <div class="item-label">对话记录</div>
             </button>
@@ -421,7 +448,12 @@
               aria-label="工作文件"
               @click="openMobileOverlay('workspace')"
             >
-              <img class="mobile-menu-icon" :src="mobileMenuIcons.workspace" alt="" aria-hidden="true" />
+              <img
+                class="mobile-menu-icon"
+                :src="mobileMenuIcons.workspace"
+                alt=""
+                aria-hidden="true"
+              />
               <div class="item-label">工作文件</div>
             </button>
             <button
@@ -431,7 +463,12 @@
               aria-label="个人空间"
               @click="handleMobilePersonalClick"
             >
-              <img class="mobile-menu-icon" :src="mobileMenuIcons.personal" alt="" aria-hidden="true" />
+              <img
+                class="mobile-menu-icon"
+                :src="mobileMenuIcons.personal"
+                alt=""
+                aria-hidden="true"
+              />
               <div class="item-label">个人空间</div>
             </button>
             <button
@@ -441,7 +478,12 @@
               aria-label="新建对话"
               @click="createNewConversation"
             >
-              <img class="mobile-menu-icon" :src="mobileMenuIcons.newChat" alt="" aria-hidden="true" />
+              <img
+                class="mobile-menu-icon"
+                :src="mobileMenuIcons.newChat"
+                alt=""
+                aria-hidden="true"
+              />
               <div class="item-label">新建对话</div>
             </button>
             <button
@@ -451,7 +493,12 @@
               aria-label="刷新页面"
               @click="handleMobileRefreshClick"
             >
-              <img class="mobile-menu-icon" :src="mobileMenuIcons.refresh" alt="" aria-hidden="true" />
+              <img
+                class="mobile-menu-icon"
+                :src="mobileMenuIcons.refresh"
+                alt=""
+                aria-hidden="true"
+              />
               <div class="item-label">刷新页面</div>
             </button>
           </div>
@@ -537,7 +584,13 @@
           @click.self="closeMobileOverlay"
         >
           <div class="mobile-panel-sheet mobile-panel-sheet--workspace">
-            <button type="button" class="mobile-overlay-close" data-tutorial="mobile-workspace-close" aria-label="关闭面板" @click="closeMobileOverlay">
+            <button
+              type="button"
+              class="mobile-overlay-close"
+              data-tutorial="mobile-workspace-close"
+              aria-label="关闭面板"
+              @click="closeMobileOverlay"
+            >
               ×
             </button>
             <LeftPanel
@@ -561,14 +614,23 @@
 </template>
 
 <script setup lang="ts">
+import { defineAsyncComponent } from 'vue';
 import appOptions from './app';
-import VirtualMonitorSurface from './components/chat/VirtualMonitorSurface.vue';
 import VideoPicker from './components/overlay/VideoPicker.vue';
+import { usePersonalizationStore } from './stores/personalization';
+import { useTutorialStore } from './stores/tutorial';
+
+const VirtualMonitorSurface = defineAsyncComponent(
+  () => import('./components/chat/VirtualMonitorSurface.vue')
+);
+const personalizationStore = usePersonalizationStore();
+const tutorialStore = useTutorialStore();
 
 const mobilePanelIcon = new URL('../icons/align-left.svg', import.meta.url).href;
 const isAppShell =
   typeof window !== 'undefined' &&
-  (new URLSearchParams(window.location.search).has('app_shell') || Boolean((window as any)?.AndroidThemeBridge));
+  (new URLSearchParams(window.location.search).has('app_shell') ||
+    Boolean((window as any)?.AndroidThemeBridge));
 const mobileMenuIcons = {
   workspace: new URL('../icons/folder.svg', import.meta.url).href,
   personal: new URL('../icons/user.svg', import.meta.url).href,
diff --git a/static/src/admin/AdminDashboardApp.vue b/static/src/admin/AdminDashboardApp.vue
index 8162560..0c8aa6e 100644
--- a/static/src/admin/AdminDashboardApp.vue
+++ b/static/src/admin/AdminDashboardApp.vue
@@ -20,7 +20,14 @@
           <button type="button" :disabled="secondaryLoading" @click="handleVerifySecondary">
             {{ secondaryLoading ? '校验中...' : '确认进入' }}
           </button>
-          <button type="button" class="ghost-btn" :disabled="secondaryLoading" @click="checkSecondary">重新检测</button>
+          <button
+            type="button"
+            class="ghost-btn"
+            :disabled="secondaryLoading"
+            @click="checkSecondary"
+          >
+            重新检测
+          </button>
         </div>
         <p v-if="secondaryError" class="secondary-error">{{ secondaryError }}</p>
       </div>
@@ -31,9 +38,7 @@
         <p>最近更新：{{ timeAgo(snapshot?.generated_at || overview.generated_at) }}</p>
       </div>
       <div class="header-actions">
-        <label>
-          <input type="checkbox" v-model="autoRefresh" /> 自动刷新
-        </label>
+        <label> <input type="checkbox" v-model="autoRefresh" /> 自动刷新 </label>
         <button type="button" :disabled="refreshing" @click="handleManualRefresh">
           {{ refreshing ? '刷新中...' : '立即刷新' }}
         </button>
@@ -215,7 +220,10 @@
                     <td>{{ formatPercentNumber(item.stats?.memory?.percent) }}</td>
                     <td>{{ formatBytes(item.stats?.memory?.used_bytes) }}</td>
                     <td>{{ formatBytes(item.stats?.memory?.limit_bytes) }}</td>
-                    <td>{{ formatBytes(item.stats?.net_io?.rx_bytes) }} / {{ formatBytes(item.stats?.net_io?.tx_bytes) }}</td>
+                    <td>
+                      {{ formatBytes(item.stats?.net_io?.rx_bytes) }} /
+                      {{ formatBytes(item.stats?.net_io?.tx_bytes) }}
+                    </td>
                     <td>
                       <span :class="['status-badge', containerStatusClass(item)]">
                         {{ item.state?.status || (item.state?.running ? '运行中' : '未知') }}
@@ -254,12 +262,14 @@
                 </div>
                 <div class="upload-meta">
                   <span>{{ timeAgo(upload.timestamp) }}</span>
-              <span :class="['status-badge', upload.accepted ? 'online' : 'danger']">
-                {{ upload.accepted ? '通过' : '阻断' }}
-              </span>
-              <span v-if="upload.error?.message" class="status-badge danger">{{ upload.error.message }}</span>
-            </div>
-          </li>
+                  <span :class="['status-badge', upload.accepted ? 'online' : 'danger']">
+                    {{ upload.accepted ? '通过' : '阻断' }}
+                  </span>
+                  <span v-if="upload.error?.message" class="status-badge danger">{{
+                    upload.error.message
+                  }}</span>
+                </div>
+              </li>
             </ul>
           </section>
           <section v-else-if="activeSection === 'balance'" key="balance" class="panel">
@@ -269,7 +279,9 @@
                 <p class="muted">手动刷新，查看 Kimi / DeepSeek / Qwen 余额</p>
               </div>
               <div class="balance-actions">
-                <span class="muted" v-if="balanceUpdatedAt">上次刷新：{{ timeAgo(balanceUpdatedAt) }}</span>
+                <span class="muted" v-if="balanceUpdatedAt"
+                  >上次刷新：{{ timeAgo(balanceUpdatedAt) }}</span
+                >
                 <button type="button" :disabled="balanceLoading" @click="fetchBalance">
                   {{ balanceLoading ? '查询中...' : '手动刷新' }}
                 </button>
@@ -280,7 +292,12 @@
               <span>{{ balanceError }}</span>
             </section>
             <div class="balance-grid">
-              <div v-for="card in balanceCards" :key="card.key" class="balance-card" :class="{ error: !card.success }">
+              <div
+                v-for="card in balanceCards"
+                :key="card.key"
+                class="balance-card"
+                :class="{ error: !card.success }"
+              >
                 <div class="balance-card-head">
                   <h3>{{ card.label }}</h3>
                   <span v-if="card.success" class="status-badge online">正常</span>
@@ -295,7 +312,9 @@
                   <li v-if="card.extras.voucher !== undefined">券：{{ card.extras.voucher }}</li>
                   <li v-if="card.extras.cash !== undefined">现金：{{ card.extras.cash }}</li>
                   <li v-if="card.extras.granted !== undefined">赠送：{{ card.extras.granted }}</li>
-                  <li v-if="card.extras.topped_up !== undefined">充值：{{ card.extras.topped_up }}</li>
+                  <li v-if="card.extras.topped_up !== undefined">
+                    充值：{{ card.extras.topped_up }}
+                  </li>
                   <li v-if="card.extras.rate">汇率 USD→CNY：{{ card.extras.rate }}</li>
                 </ul>
                 <p v-else class="muted small">{{ card.error || '未知错误' }}</p>
@@ -341,10 +360,20 @@
                 <h4>{{ code.code }}</h4>
                 <span>{{ inviteStatus(code.remaining) }}</span>
                 <div class="invite-actions">
-                  <button type="button" class="mini-btn" :disabled="inviteSubmitting" @click="editInvite(code)">
+                  <button
+                    type="button"
+                    class="mini-btn"
+                    :disabled="inviteSubmitting"
+                    @click="editInvite(code)"
+                  >
                     调整次数
                   </button>
-                  <button type="button" class="mini-btn danger" :disabled="inviteSubmitting" @click="removeInvite(code.code)">
+                  <button
+                    type="button"
+                    class="mini-btn danger"
+                    :disabled="inviteSubmitting"
+                    @click="removeInvite(code.code)"
+                  >
                     删除
                   </button>
                 </div>
@@ -371,7 +400,13 @@ type Snapshot = Record<string, any> | null;
 
 type SectionId = 'overview' | 'usage' | 'users' | 'containers' | 'uploads' | 'balance' | 'invites';
 
-const { verified: secondaryVerified, loading: secondaryLoading, error: secondaryError, check: checkSecondary, verify: verifySecondary } = useSecondaryPass();
+const {
+  verified: secondaryVerified,
+  loading: secondaryLoading,
+  error: secondaryError,
+  check: checkSecondary,
+  verify: verifySecondary
+} = useSecondaryPass();
 const secondaryPassword = ref('');
 
 const loading = ref(true);
@@ -474,8 +509,17 @@ const fetchCsrfToken = async (): Promise<string> => {
 };
 
 const parseInviteRemaining = (raw: unknown): number | null => {
-  const text = String(raw ?? '').trim().toLowerCase();
-  if (!text || text === 'unlimited' || text === 'null' || text === 'none' || text === '不限' || text === '无限制') {
+  const text = String(raw ?? '')
+    .trim()
+    .toLowerCase();
+  if (
+    !text ||
+    text === 'unlimited' ||
+    text === 'null' ||
+    text === 'none' ||
+    text === '不限' ||
+    text === '无限制'
+  ) {
     return null;
   }
   const parsed = Number(text);
@@ -494,16 +538,18 @@ const createInvite = async () => {
   inviteSubmitting.value = true;
   inviteError.value = null;
   try {
-    const remaining = newInviteUnlimited.value ? null : parseInviteRemaining(newInviteRemaining.value);
+    const remaining = newInviteUnlimited.value
+      ? null
+      : parseInviteRemaining(newInviteRemaining.value);
     const csrfToken = await fetchCsrfToken();
     const resp = await fetch('/api/admin/invites', {
       method: 'POST',
       headers: {
         'Content-Type': 'application/json',
-        'X-CSRF-Token': csrfToken,
+        'X-CSRF-Token': csrfToken
       },
       credentials: 'same-origin',
-      body: JSON.stringify({ code, remaining }),
+      body: JSON.stringify({ code, remaining })
     });
     const payload = await resp.json();
     if (!resp.ok || !payload.success) {
@@ -534,10 +580,10 @@ const editInvite = async (item: any) => {
       method: 'PUT',
       headers: {
         'Content-Type': 'application/json',
-        'X-CSRF-Token': csrfToken,
+        'X-CSRF-Token': csrfToken
       },
       credentials: 'same-origin',
-      body: JSON.stringify({ code: item?.code, remaining }),
+      body: JSON.stringify({ code: item?.code, remaining })
     });
     const payload = await resp.json();
     if (!resp.ok || !payload.success) {
@@ -562,10 +608,10 @@ const removeInvite = async (code: string) => {
       method: 'DELETE',
       headers: {
         'Content-Type': 'application/json',
-        'X-CSRF-Token': csrfToken,
+        'X-CSRF-Token': csrfToken
       },
       credentials: 'same-origin',
-      body: JSON.stringify({ code }),
+      body: JSON.stringify({ code })
     });
     const payload = await resp.json();
     if (!resp.ok || !payload.success) {
@@ -693,9 +739,11 @@ const balanceCards = computed(() => {
       success,
       currency,
       amount,
-      amountCny: data.available_cny ?? (currency === 'USD' && usdToCnyRate.value && amount != null
-        ? Math.round(amount * usdToCnyRate.value * 100) / 100
-        : null),
+      amountCny:
+        data.available_cny ??
+        (currency === 'USD' && usdToCnyRate.value && amount != null
+          ? Math.round(amount * usdToCnyRate.value * 100) / 100
+          : null),
       extras: data,
       error: success ? null : data.error
     };
@@ -717,7 +765,8 @@ const metricCards = computed(() => [
     title: '容器使用',
     value: `${containerSummary.value.active || 0}/${containerSummary.value.max_containers ?? '∞'}`,
     sub:
-      containerSummary.value.available_slots === null || containerSummary.value.available_slots === undefined
+      containerSummary.value.available_slots === null ||
+      containerSummary.value.available_slots === undefined
         ? '无限制'
         : `${containerSummary.value.available_slots} 个空闲`
   },
@@ -819,7 +868,7 @@ const inviteStatus = (remaining: number | null | undefined) => {
 :global(body) {
   margin: 0;
   background: #f7f3ea;
-  font-family: 'Iowan Old Style', ui-serif, Georgia, Cambria, "Times New Roman", serif;
+  font-family: 'Iowan Old Style', ui-serif, Georgia, Cambria, 'Times New Roman', serif;
   color: #2a2013;
   overflow: hidden;
 }
@@ -896,7 +945,10 @@ button {
   font-weight: 600;
   cursor: pointer;
   box-shadow: inset 0 -2px 0 rgba(189, 93, 58, 0.25);
-  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.2s ease;
+  transition:
+    transform 0.15s ease,
+    box-shadow 0.15s ease,
+    background 0.2s ease;
 }
 
 button:disabled {
diff --git a/static/src/admin/ApiAdminApp.vue b/static/src/admin/ApiAdminApp.vue
index fad4c8c..f186fc7 100644
--- a/static/src/admin/ApiAdminApp.vue
+++ b/static/src/admin/ApiAdminApp.vue
@@ -16,7 +16,14 @@
           <button type="button" :disabled="secondaryLoading" @click="handleVerifySecondary">
             {{ secondaryLoading ? '校验中...' : '确认' }}
           </button>
-          <button type="button" class="ghost-btn" :disabled="secondaryLoading" @click="checkSecondary">重新检测</button>
+          <button
+            type="button"
+            class="ghost-btn"
+            :disabled="secondaryLoading"
+            @click="checkSecondary"
+          >
+            重新检测
+          </button>
         </div>
         <p v-if="secondaryError" class="secondary-error">{{ secondaryError }}</p>
       </div>
@@ -49,12 +56,17 @@
         <div class="metric-card">
           <p>累计 Token</p>
           <strong>{{ formatNumber(overview.token_totals?.total_tokens || 0) }}</strong>
-          <span class="muted">输入 {{ formatNumber(overview.token_totals?.input_tokens || 0) }} / 输出 {{ formatNumber(overview.token_totals?.output_tokens || 0) }}</span>
+          <span class="muted"
+            >输入 {{ formatNumber(overview.token_totals?.input_tokens || 0) }} / 输出
+            {{ formatNumber(overview.token_totals?.output_tokens || 0) }}</span
+          >
         </div>
         <div class="metric-card">
           <p>活动容器</p>
           <strong>{{ overview.totals?.containers_active || 0 }}</strong>
-          <span class="muted">可用槽位 {{ overview.totals?.available_container_slots ?? '—' }}</span>
+          <span class="muted"
+            >可用槽位 {{ overview.totals?.available_container_slots ?? '—' }}</span
+          >
         </div>
       </div>
     </section>
@@ -91,7 +103,9 @@
               <td colspan="10">暂无 API 账号</td>
             </tr>
             <tr v-for="u in users" :key="u.username">
-              <td><strong>{{ u.username }}</strong></td>
+              <td>
+                <strong>{{ u.username }}</strong>
+              </td>
               <td>{{ u.note || '—' }}</td>
               <td>{{ formatTime(u.created_at) }}</td>
               <td>{{ formatNumber(u.usage?.total_requests || 0) }}</td>
@@ -104,9 +118,17 @@
               </td>
               <td class="token-cell">
                 <span class="token-text">
-                  {{ revealTokens[u.username]?.visible ? (revealTokens[u.username]?.token || '—') : '••••••••••' }}
+                  {{
+                    revealTokens[u.username]?.visible
+                      ? revealTokens[u.username]?.token || '—'
+                      : '••••••••••'
+                  }}
                 </span>
-                <button class="icon-btn" @click="toggleReveal(u.username)" :disabled="revealLoading === u.username">
+                <button
+                  class="icon-btn"
+                  @click="toggleReveal(u.username)"
+                  :disabled="revealLoading === u.username"
+                >
                   <svg viewBox="0 0 24 24" width="18" height="18" aria-hidden="true">
                     <path
                       d="M1 12s4-7 11-7 11 7 11 7-4 7-11 7S1 12 1 12Zm11 3a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z"
@@ -116,12 +138,22 @@
                     />
                   </svg>
                 </button>
-                <button class="icon-btn" @click="copyToken(u.username)" :disabled="revealLoading === u.username">
+                <button
+                  class="icon-btn"
+                  @click="copyToken(u.username)"
+                  :disabled="revealLoading === u.username"
+                >
                   📋
                 </button>
               </td>
               <td>
-                <button class="link danger" @click="deleteUser(u.username)" :disabled="deleting === u.username">删除</button>
+                <button
+                  class="link danger"
+                  @click="deleteUser(u.username)"
+                  :disabled="deleting === u.username"
+                >
+                  删除
+                </button>
               </td>
             </tr>
           </tbody>
@@ -157,7 +189,10 @@
                 <td>{{ formatPercentNumber(c.stats?.cpu_percent) }}</td>
                 <td>{{ formatPercentNumber(c.stats?.memory?.percent) }}</td>
                 <td>{{ formatBytes(c.stats?.memory?.used_bytes) }}</td>
-                <td>{{ formatBytes(c.stats?.net_io?.rx_bytes) }} / {{ formatBytes(c.stats?.net_io?.tx_bytes) }}</td>
+                <td>
+                  {{ formatBytes(c.stats?.net_io?.rx_bytes) }} /
+                  {{ formatBytes(c.stats?.net_io?.tx_bytes) }}
+                </td>
                 <td>
                   <span :class="['status-badge', c.running ? 'online' : 'offline']">
                     {{ c.running ? '运行中' : '未运行' }}
@@ -179,7 +214,8 @@
             <div>
               <strong>{{ item.original_name || '未命名文件' }}</strong>
               <div class="muted small">
-                用户 {{ item.username }} · {{ formatBytes(item.size) }} · {{ item.source || 'unknown' }}
+                用户 {{ item.username }} · {{ formatBytes(item.size) }} ·
+                {{ item.source || 'unknown' }}
               </div>
             </div>
             <div class="muted small">
@@ -204,7 +240,12 @@
         </button>
       </div>
       <div class="balance-grid">
-        <div v-for="card in balanceCards" :key="card.key" class="balance-card" :class="{ error: !card.success }">
+        <div
+          v-for="card in balanceCards"
+          :key="card.key"
+          class="balance-card"
+          :class="{ error: !card.success }"
+        >
           <div class="balance-card-head">
             <h4>{{ card.label }}</h4>
             <span :class="['status-badge', card.success ? 'online' : 'danger']">
@@ -224,7 +265,13 @@
 import { computed, onBeforeUnmount, onMounted, ref, watch } from 'vue';
 import { useSecondaryPass } from './useSecondaryPass';
 
-const { verified: secondaryVerified, loading: secondaryLoading, error: secondaryError, check: checkSecondary, verify: verifySecondary } = useSecondaryPass();
+const {
+  verified: secondaryVerified,
+  loading: secondaryLoading,
+  error: secondaryError,
+  check: checkSecondary,
+  verify: verifySecondary
+} = useSecondaryPass();
 const secondaryPassword = ref('');
 
 const loading = ref(false);
@@ -250,7 +297,10 @@ const containerItems = computed(() => {
   return Object.keys(items).map((key) => ({ key, ...(items[key] || {}) }));
 });
 const totalRequests = computed(() =>
-  users.value.reduce((sum, u) => sum + ((u.usage && u.usage.total_requests) ? u.usage.total_requests : 0), 0)
+  users.value.reduce(
+    (sum, u) => sum + (u.usage && u.usage.total_requests ? u.usage.total_requests : 0),
+    0
+  )
 );
 
 const balanceCards = computed(() => {
@@ -264,7 +314,7 @@ const balanceCards = computed(() => {
       amount: data.available ?? data.total ?? null,
       amountCny: data.amount_cny ?? data.amountCny ?? null,
       currency: data.currency || '',
-      error: data.error,
+      error: data.error
     };
   });
 });
@@ -339,7 +389,7 @@ const fetchUsers = async () => {
       ...u,
       usage: u.usage || { total_requests: 0, endpoints: {}, last_request_at: null },
       tokens: u.tokens || { total_tokens: 0, input_tokens: 0, output_tokens: 0 },
-      storage: u.storage || { total_bytes: 0 },
+      storage: u.storage || { total_bytes: 0 }
     }));
     users.value.forEach((u) => {
       map[u.username] = revealTokens.value[u.username] || { token: '', visible: false };
@@ -383,7 +433,7 @@ const createUser = async () => {
       method: 'POST',
       credentials: 'same-origin',
       headers: { 'Content-Type': 'application/json' },
-      body: JSON.stringify({ username, note: createForm.value.note }),
+      body: JSON.stringify({ username, note: createForm.value.note })
     });
     const data = await resp.json();
     if (!resp.ok || !data.success) throw new Error(data.error || '创建失败');
@@ -404,7 +454,7 @@ const deleteUser = async (username: string) => {
   try {
     const resp = await fetch(`/api/admin/api-users/${encodeURIComponent(username)}`, {
       method: 'DELETE',
-      credentials: 'same-origin',
+      credentials: 'same-origin'
     });
     const data = await resp.json();
     if (!resp.ok || !data.success) throw new Error(data.error || '删除失败');
@@ -425,7 +475,7 @@ const toggleReveal = async (username: string) => {
   revealLoading.value = username;
   try {
     const resp = await fetch(`/api/admin/api-users/${encodeURIComponent(username)}/token`, {
-      credentials: 'same-origin',
+      credentials: 'same-origin'
     });
     const data = await resp.json();
     if (!resp.ok || !data.success) throw new Error(data.error || '获取失败');
@@ -503,7 +553,7 @@ onBeforeUnmount(() => {
 :global(body) {
   margin: 0;
   background: #f7f3ea;
-  font-family: 'Iowan Old Style', ui-serif, Georgia, Cambria, "Times New Roman", serif;
+  font-family: 'Iowan Old Style', ui-serif, Georgia, Cambria, 'Times New Roman', serif;
   color: #2a2013;
 }
 
@@ -549,11 +599,11 @@ onBeforeUnmount(() => {
 }
 
 .metric-card {
-  background: rgba(255,255,255,0.94);
+  background: rgba(255, 255, 255, 0.94);
   border-radius: 16px;
   padding: 14px;
-  border: 1px solid rgba(44,32,19,0.12);
-  box-shadow: inset 0 1px 0 rgba(255,255,255,0.6);
+  border: 1px solid rgba(44, 32, 19, 0.12);
+  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6);
 }
 
 .metric-card p {
@@ -594,7 +644,7 @@ onBeforeUnmount(() => {
 .create-form input {
   padding: 10px 12px;
   border-radius: 12px;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
 }
 
 button {
@@ -626,9 +676,10 @@ table {
   border-collapse: collapse;
 }
 
-th, td {
+th,
+td {
   padding: 10px;
-  border-bottom: 1px solid rgba(0,0,0,0.08);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
   text-align: left;
   font-size: 14px;
 }
@@ -640,8 +691,8 @@ th, td {
 }
 
 .icon-btn {
-  background: rgba(255,255,255,0.9);
-  border: 1px solid rgba(0,0,0,0.12);
+  background: rgba(255, 255, 255, 0.9);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   border-radius: 8px;
   padding: 6px;
   cursor: pointer;
@@ -667,7 +718,7 @@ th, td {
 }
 
 .status-badge.offline {
-  background: rgba(0,0,0,0.06);
+  background: rgba(0, 0, 0, 0.06);
   color: #5f5140;
 }
 
@@ -693,8 +744,8 @@ th, td {
 .upload-item {
   padding: 10px;
   border-radius: 12px;
-  background: rgba(255,255,255,0.92);
-  border: 1px solid rgba(0,0,0,0.06);
+  background: rgba(255, 255, 255, 0.92);
+  border: 1px solid rgba(0, 0, 0, 0.06);
 }
 
 .grid {
@@ -718,8 +769,8 @@ th, td {
 }
 
 .balance-card {
-  background: rgba(255,255,255,0.92);
-  border: 1px solid rgba(44,32,19,0.12);
+  background: rgba(255, 255, 255, 0.92);
+  border: 1px solid rgba(44, 32, 19, 0.12);
   border-radius: 14px;
   padding: 12px;
 }
diff --git a/static/src/admin/CustomToolsApp.vue b/static/src/admin/CustomToolsApp.vue
index 5d7e2d5..8932cd7 100644
--- a/static/src/admin/CustomToolsApp.vue
+++ b/static/src/admin/CustomToolsApp.vue
@@ -13,10 +13,17 @@
           @keyup.enter="handleVerifySecondary"
         />
         <div class="secondary-actions">
-          <button type="button" class="primary" :disabled="secondaryLoading" @click="handleVerifySecondary">
+          <button
+            type="button"
+            class="primary"
+            :disabled="secondaryLoading"
+            @click="handleVerifySecondary"
+          >
             {{ secondaryLoading ? '校验中...' : '确认' }}
           </button>
-          <button type="button" class="ghost" :disabled="secondaryLoading" @click="checkSecondary">重新检测</button>
+          <button type="button" class="ghost" :disabled="secondaryLoading" @click="checkSecondary">
+            重新检测
+          </button>
         </div>
         <p v-if="secondaryError" class="secondary-error">{{ secondaryError }}</p>
       </div>
@@ -29,12 +36,16 @@
           <p>每个工具一个文件夹，三层文件独立存放；仅管理员可见并可调用。</p>
         </div>
         <div class="actions">
-        <button type="button" class="primary" @click="openCreateModal">新建工具</button>
-        <button type="button" class="ghost" @click="refresh" :disabled="loading">{{ loading ? '刷新中...' : '刷新列表' }}</button>
-        <a class="ghost" href="/static/custom_tools/guide.html" target="_blank" rel="noopener">查看开发指南</a>
+          <button type="button" class="primary" @click="openCreateModal">新建工具</button>
+          <button type="button" class="ghost" @click="refresh" :disabled="loading">
+            {{ loading ? '刷新中...' : '刷新列表' }}
+          </button>
+          <a class="ghost" href="/static/custom_tools/guide.html" target="_blank" rel="noopener"
+            >查看开发指南</a
+          >
           <a class="ghost" href="/admin/monitor" target="_blank" rel="noopener">返回监控</a>
-        <a class="ghost" href="/admin/policy" target="_blank" rel="noopener">策略配置</a>
-      </div>
+          <a class="ghost" href="/admin/policy" target="_blank" rel="noopener">策略配置</a>
+        </div>
       </header>
 
       <section class="panel" v-if="error">
@@ -84,28 +95,49 @@
             <p>{{ activeTool.description || '未填写描述' }}</p>
           </div>
           <div class="drawer-actions">
-            <button type="button" class="primary" @click="saveAll" :disabled="saving">{{ saving ? '保存中...' : '保存' }}</button>
+            <button type="button" class="primary" @click="saveAll" :disabled="saving">
+              {{ saving ? '保存中...' : '保存' }}
+            </button>
             <button type="button" class="danger" @click="openDeleteConfirm()">删除</button>
             <button type="button" class="ghost" @click="closeEditor">关闭</button>
           </div>
         </header>
 
         <div class="tabs">
-          <button :class="{active: tab==='definition'}" @click="tab='definition'">definition.json</button>
-          <button :class="{active: tab==='execution'}" @click="tab='execution'">execution.py</button>
-          <button :class="{active: tab==='return'}" @click="tab='return'">return.json</button>
-          <button :class="{active: tab==='meta'}" @click="tab='meta'">meta.json</button>
+          <button :class="{ active: tab === 'definition' }" @click="tab = 'definition'">
+            definition.json
+          </button>
+          <button :class="{ active: tab === 'execution' }" @click="tab = 'execution'">
+            execution.py
+          </button>
+          <button :class="{ active: tab === 'return' }" @click="tab = 'return'">return.json</button>
+          <button :class="{ active: tab === 'meta' }" @click="tab = 'meta'">meta.json</button>
         </div>
 
         <div class="editor">
-          <textarea v-if="tab==='definition'" v-model="buffers.definition" spellcheck="false"></textarea>
-          <textarea v-else-if="tab==='execution'" v-model="buffers.execution" spellcheck="false"></textarea>
-          <textarea v-else-if="tab==='return'" v-model="buffers.return" spellcheck="false"></textarea>
+          <textarea
+            v-if="tab === 'definition'"
+            v-model="buffers.definition"
+            spellcheck="false"
+          ></textarea>
+          <textarea
+            v-else-if="tab === 'execution'"
+            v-model="buffers.execution"
+            spellcheck="false"
+          ></textarea>
+          <textarea
+            v-else-if="tab === 'return'"
+            v-model="buffers.return"
+            spellcheck="false"
+          ></textarea>
           <textarea v-else v-model="buffers.meta" spellcheck="false"></textarea>
         </div>
 
         <div class="hint">
-          <p>提示：execution.py 中的字典/集合需要用 <code v-pre>{{ ... }}</code> 包裹，避免被模板替换。</p>
+          <p>
+            提示：execution.py 中的字典/集合需要用
+            <code v-pre>{{ ... }}</code> 包裹，避免被模板替换。
+          </p>
           <p>保存后无需重启，系统会自动 reload 自定义工具。</p>
         </div>
       </div>
@@ -121,8 +153,10 @@
           <label>工具 ID（小写/下划线）：<input v-model="createForm.id" /></label>
           <label>描述：<input v-model="createForm.description" /></label>
           <div class="modal-actions">
-            <button type="button" class="ghost" @click="createModal=false">取消</button>
-            <button type="button" class="primary" @click="createTool" :disabled="creating">{{ creating ? '创建中...' : '创建' }}</button>
+            <button type="button" class="ghost" @click="createModal = false">取消</button>
+            <button type="button" class="primary" @click="createTool" :disabled="creating">
+              {{ creating ? '创建中...' : '创建' }}
+            </button>
           </div>
         </div>
       </div>
@@ -133,10 +167,14 @@
       <div v-if="confirmDeleteModal" class="modal-backdrop">
         <div class="modal">
           <h3>确认删除</h3>
-          <p class="delete-tip">确定删除工具 <strong>{{ deleteTargetId }}</strong> 吗？该操作不可恢复。</p>
+          <p class="delete-tip">
+            确定删除工具 <strong>{{ deleteTargetId }}</strong> 吗？该操作不可恢复。
+          </p>
           <div class="modal-actions">
-            <button type="button" class="ghost" @click="confirmDeleteModal=false">取消</button>
-            <button type="button" class="danger" @click="performDelete" :disabled="deleting">{{ deleting ? '删除中...' : '确认删除' }}</button>
+            <button type="button" class="ghost" @click="confirmDeleteModal = false">取消</button>
+            <button type="button" class="danger" @click="performDelete" :disabled="deleting">
+              {{ deleting ? '删除中...' : '确认删除' }}
+            </button>
           </div>
         </div>
       </div>
@@ -159,7 +197,13 @@ interface CustomTool {
   return_file?: string;
 }
 
-const { verified: secondaryVerified, loading: secondaryLoading, error: secondaryError, check: checkSecondary, verify: verifySecondary } = useSecondaryPass();
+const {
+  verified: secondaryVerified,
+  loading: secondaryLoading,
+  error: secondaryError,
+  check: checkSecondary,
+  verify: verifySecondary
+} = useSecondaryPass();
 const secondaryPassword = ref('');
 
 const tools = ref<CustomTool[]>([]);
@@ -221,10 +265,20 @@ const openEditorPage = (tool: CustomTool) => {
 const loadBuffers = async (id: string) => {
   if (!secondaryVerified.value) return;
   try {
-    buffers.definition = await fetchText(`/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=definition.json`);
-    buffers.execution = await fetchText(`/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=execution.py`);
-    buffers.return = await fetchText(`/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=return.json`, '');
-    buffers.meta = await fetchText(`/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=meta.json`, '');
+    buffers.definition = await fetchText(
+      `/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=definition.json`
+    );
+    buffers.execution = await fetchText(
+      `/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=execution.py`
+    );
+    buffers.return = await fetchText(
+      `/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=return.json`,
+      ''
+    );
+    buffers.meta = await fetchText(
+      `/api/admin/custom-tools/file?id=${encodeURIComponent(id)}&name=meta.json`,
+      ''
+    );
   } catch (e: any) {
     error.value = e.message;
   }
@@ -270,11 +324,6 @@ const reloadRegistry = async () => {
   await fetch('/api/admin/custom-tools/reload', { method: 'POST', credentials: 'same-origin' });
 };
 
-const confirmDelete = async () => {
-  if (!activeTool.value) return;
-  openDeleteConfirm(activeTool.value);
-};
-
 const openDeleteConfirm = (tool?: CustomTool) => {
   const target = tool || activeTool.value;
   if (!target) return;
@@ -287,7 +336,10 @@ const performDelete = async () => {
   if (!deleteTargetId.value) return;
   deleting.value = true;
   try {
-    const res = await fetch(`/api/admin/custom-tools?id=${encodeURIComponent(deleteTargetId.value)}`, { method: 'DELETE', credentials: 'same-origin' });
+    const res = await fetch(
+      `/api/admin/custom-tools?id=${encodeURIComponent(deleteTargetId.value)}`,
+      { method: 'DELETE', credentials: 'same-origin' }
+    );
     const data = await res.json();
     if (!data.success) throw new Error(data.error || '删除失败');
     activeTool.value = null;
@@ -387,9 +439,9 @@ watch(secondaryVerified, async (val) => {
 /* Claude 经典：米色+白色+深棕的柔和高对比配色 */
 :global(html, body) {
   min-height: 100%;
-  background: radial-gradient(140% 120% at 20% 20%, rgba(239, 229, 214, 0.9), transparent),
-    radial-gradient(120% 120% at 80% 0%, rgba(255, 255, 255, 0.9), transparent),
-    #f8f3e8;
+  background:
+    radial-gradient(140% 120% at 20% 20%, rgba(239, 229, 214, 0.9), transparent),
+    radial-gradient(120% 120% at 80% 0%, rgba(255, 255, 255, 0.9), transparent), #f8f3e8;
 }
 :global(#custom-tools-app) {
   min-height: 100vh;
@@ -411,7 +463,15 @@ watch(secondaryVerified, async (val) => {
   max-width: 1180px;
   margin: 0 auto;
   padding: 28px;
-  font-family: 'Space Grotesk', 'Noto Sans SC', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  font-family:
+    'Space Grotesk',
+    'Noto Sans SC',
+    'Inter',
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    sans-serif;
   color: var(--ink);
   background: transparent;
 }
@@ -465,7 +525,11 @@ watch(secondaryVerified, async (val) => {
   border-radius: var(--radius-md);
   padding: 14px;
   cursor: pointer;
-  transition: border-color 0.2s, box-shadow 0.2s, transform 0.1s, background 0.2s;
+  transition:
+    border-color 0.2s,
+    box-shadow 0.2s,
+    transform 0.1s,
+    background 0.2s;
   background: linear-gradient(180deg, #fffdf8 0%, #ffffff 50%, #fbf6ed 100%);
 }
 .tool-card:hover {
@@ -643,8 +707,13 @@ watch(secondaryVerified, async (val) => {
   margin: 4px 0 8px;
   color: var(--muted);
 }
-.error { color: #dc2626; }
-.empty { color: var(--muted); padding: 12px; }
+.error {
+  color: #dc2626;
+}
+.empty {
+  color: var(--muted);
+  padding: 12px;
+}
 
 /* 按钮样式与主站一致风格 */
 .primary,
@@ -658,7 +727,11 @@ watch(secondaryVerified, async (val) => {
   padding: 10px 18px;
 }
 .primary {
-  background: linear-gradient(135deg, var(--claude-accent, #da7756) 0%, var(--claude-accent-strong, #bd5d3a) 100%);
+  background: linear-gradient(
+    135deg,
+    var(--claude-accent, #da7756) 0%,
+    var(--claude-accent-strong, #bd5d3a) 100%
+  );
   color: #fff;
   border: none;
   cursor: pointer;
diff --git a/static/src/admin/CustomToolsGuideApp.vue b/static/src/admin/CustomToolsGuideApp.vue
index 9e5a306..2bce6b7 100644
--- a/static/src/admin/CustomToolsGuideApp.vue
+++ b/static/src/admin/CustomToolsGuideApp.vue
@@ -42,9 +42,9 @@ onMounted(() => {
 <style scoped>
 :global(html, body) {
   min-height: 100%;
-  background: radial-gradient(140% 120% at 20% 20%, rgba(239, 229, 214, 0.9), transparent),
-    radial-gradient(120% 120% at 80% 0%, rgba(255, 255, 255, 0.9), transparent),
-    #f8f3e8;
+  background:
+    radial-gradient(140% 120% at 20% 20%, rgba(239, 229, 214, 0.9), transparent),
+    radial-gradient(120% 120% at 80% 0%, rgba(255, 255, 255, 0.9), transparent), #f8f3e8;
 }
 :global(#custom-tools-guide) {
   min-height: 100vh;
@@ -61,7 +61,15 @@ onMounted(() => {
   max-width: 1080px;
   margin: 0 auto;
   padding: 24px 16px 32px;
-  font-family: 'Space Grotesk', 'Noto Sans SC', 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  font-family:
+    'Space Grotesk',
+    'Noto Sans SC',
+    'Inter',
+    system-ui,
+    -apple-system,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    sans-serif;
   color: var(--ink);
 }
 .guide-header {
diff --git a/static/src/admin/PolicyApp.vue b/static/src/admin/PolicyApp.vue
index 931135b..fa614c9 100644
--- a/static/src/admin/PolicyApp.vue
+++ b/static/src/admin/PolicyApp.vue
@@ -13,10 +13,22 @@
           @keyup.enter="handleVerifySecondary"
         />
         <div class="secondary-actions">
-          <button type="button" class="primary" :disabled="secondaryLoading" @click="handleVerifySecondary">
+          <button
+            type="button"
+            class="primary"
+            :disabled="secondaryLoading"
+            @click="handleVerifySecondary"
+          >
             {{ secondaryLoading ? '校验中...' : '确认' }}
           </button>
-          <button type="button" class="ghost-btn" :disabled="secondaryLoading" @click="checkSecondary">重新检测</button>
+          <button
+            type="button"
+            class="ghost-btn"
+            :disabled="secondaryLoading"
+            @click="checkSecondary"
+          >
+            重新检测
+          </button>
         </div>
         <p v-if="secondaryError" class="secondary-error">{{ secondaryError }}</p>
       </div>
@@ -33,7 +45,12 @@
             <span class="caret">▾</span>
           </button>
           <div class="dropdown-menu" v-if="targetMenuOpen">
-            <button v-for="opt in targetOptions" :key="opt.value" type="button" @click="pickTargetType(opt.value)">
+            <button
+              v-for="opt in targetOptions"
+              :key="opt.value"
+              type="button"
+              @click="pickTargetType(opt.value)"
+            >
               {{ opt.label }}
             </button>
           </div>
@@ -89,7 +106,7 @@
               <div class="tool-select-search">
                 <input v-model="toolSearch" type="text" placeholder="搜索或添加工具 ID" />
               </div>
-            <div class="tool-select-options">
+              <div class="tool-select-options">
                 <label v-for="tool in filteredToolOptions(cat)" :key="tool">
                   <input
                     type="checkbox"
@@ -111,7 +128,11 @@
             </div>
           </div>
           <label class="toggle-row compact">
-            <input type="checkbox" :checked="getCategoryDefault(cat.id)" @change="setCategoryDefault(cat.id, $event.target.checked)" />
+            <input
+              type="checkbox"
+              :checked="getCategoryDefault(cat.id)"
+              @change="setCategoryDefault(cat.id, $event.target.checked)"
+            />
             <span class="fancy-check" aria-hidden="true">
               <svg viewBox="0 0 64 64">
                 <path
@@ -145,11 +166,7 @@
           <h2>模型禁用</h2>
         </div>
         <div class="toggle-grid">
-          <label
-            v-for="model in defaults.models"
-            :key="model"
-            class="toggle-row"
-          >
+          <label v-for="model in defaults.models" :key="model" class="toggle-row">
             <input type="checkbox" :checked="isModelDisabled(model)" @change="toggleModel(model)" />
             <span class="fancy-check" aria-hidden="true">
               <svg viewBox="0 0 64 64">
@@ -169,12 +186,12 @@
           <h2>前端禁用项</h2>
         </div>
         <div class="toggle-grid">
-          <label
-            v-for="key in defaults.ui_block_keys"
-            :key="key"
-            class="toggle-row"
-          >
-            <input type="checkbox" :checked="!!form.config.ui_blocks[key]" @change="toggleUiBlock(key, $event)" />
+          <label v-for="key in defaults.ui_block_keys" :key="key" class="toggle-row">
+            <input
+              type="checkbox"
+              :checked="!!form.config.ui_blocks[key]"
+              @change="toggleUiBlock(key, $event)"
+            />
             <span class="fancy-check" aria-hidden="true">
               <svg viewBox="0 0 64 64">
                 <path
@@ -242,7 +259,13 @@ const defaults = reactive({
   ui_block_keys: [] as string[]
 });
 
-const { verified: secondaryVerified, loading: secondaryLoading, error: secondaryError, check: checkSecondary, verify: verifySecondary } = useSecondaryPass();
+const {
+  verified: secondaryVerified,
+  loading: secondaryLoading,
+  error: secondaryError,
+  check: checkSecondary,
+  verify: verifySecondary
+} = useSecondaryPass();
 const secondaryPassword = ref('');
 
 const form = reactive({
@@ -275,7 +298,9 @@ const targetOptions = [
   { value: 'invite', label: '邀请码' }
 ] as const;
 
-const targetTypeLabel = computed(() => targetOptions.find(o => o.value === form.target_type)?.label || '全局');
+const targetTypeLabel = computed(
+  () => targetOptions.find((o) => o.value === form.target_type)?.label || '全局'
+);
 const targetMenuOpen = ref(false);
 const openForceMenu = ref<string | null>(null);
 const openToolMenu = ref<string | null>(null);
@@ -497,9 +522,7 @@ function rebuildCategoryOverrides() {
     if (!item.id) return;
     map[item.id] = {
       label: item.label || item.id,
-      tools: (item.tools || [])
-        .map((s) => (typeof s === 'string' ? s.trim() : ''))
-        .filter(Boolean),
+      tools: (item.tools || []).map((s) => (typeof s === 'string' ? s.trim() : '')).filter(Boolean),
       default_enabled: !!item.default_enabled
     };
     if (item.forced === true || item.forced === false) {
@@ -642,7 +665,7 @@ onBeforeUnmount(() => {
 :global(body) {
   margin: 0;
   background: #f7f3ea;
-  font-family: 'Iowan Old Style', ui-serif, Georgia, Cambria, "Times New Roman", serif;
+  font-family: 'Iowan Old Style', ui-serif, Georgia, Cambria, 'Times New Roman', serif;
   color: #2a2013;
 }
 
@@ -680,7 +703,7 @@ onBeforeUnmount(() => {
 .ghost-btn {
   padding: 10px 12px;
   border-radius: 12px;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   background: rgba(255, 255, 255, 0.9);
   color: #2a2013;
   display: inline-flex;
@@ -700,9 +723,9 @@ onBeforeUnmount(() => {
   left: 0;
   min-width: 160px;
   background: #fff;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   border-radius: 12px;
-  box-shadow: 0 12px 30px rgba(0,0,0,0.12);
+  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);
   display: flex;
   flex-direction: column;
   overflow: hidden;
@@ -719,13 +742,13 @@ onBeforeUnmount(() => {
 }
 
 .dropdown-menu button:hover {
-  background: rgba(0,0,0,0.04);
+  background: rgba(0, 0, 0, 0.04);
 }
 
 .text-field input {
   padding: 10px 12px;
   border-radius: 12px;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   background: #fff;
 }
 
@@ -737,7 +760,7 @@ onBeforeUnmount(() => {
   align-items: center;
   justify-content: space-between;
   gap: 8px;
-  border: 1px solid rgba(0,0,0,0.08);
+  border: 1px solid rgba(0, 0, 0, 0.08);
 }
 
 .banner.success {
@@ -796,12 +819,14 @@ onBeforeUnmount(() => {
 .category-row select {
   padding: 8px 10px;
   border-radius: 10px;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   background: #fff;
 }
 
 .id-input {
-  font-family: "SFMono-Regular", ui-monospace, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  font-family:
+    'SFMono-Regular', ui-monospace, Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
+    monospace;
 }
 
 .checkbox-cell {
@@ -834,8 +859,8 @@ onBeforeUnmount(() => {
   gap: 8px;
   padding: 10px 12px;
   border-radius: 14px;
-  border: 1px solid rgba(0,0,0,0.12);
-  background: rgba(255,255,255,0.92);
+  border: 1px solid rgba(0, 0, 0, 0.12);
+  background: rgba(255, 255, 255, 0.92);
   cursor: pointer;
   transition: all 0.2s ease;
 }
@@ -848,7 +873,7 @@ onBeforeUnmount(() => {
   width: 34px;
   height: 18px;
   border-radius: 999px;
-  background: rgba(0,0,0,0.12);
+  background: rgba(0, 0, 0, 0.12);
   position: relative;
   transition: all 0.2s ease;
 }
@@ -862,7 +887,7 @@ onBeforeUnmount(() => {
   height: 14px;
   border-radius: 50%;
   background: #fff;
-  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
   transition: all 0.2s ease;
 }
 
@@ -916,7 +941,9 @@ onBeforeUnmount(() => {
   cursor: pointer;
   padding: 6px 10px;
   border-radius: 10px;
-  transition: background 0.15s ease, border-color 0.15s ease;
+  transition:
+    background 0.15s ease,
+    border-color 0.15s ease;
 }
 
 .link.danger {
@@ -933,7 +960,7 @@ onBeforeUnmount(() => {
 button {
   padding: 8px 12px;
   border-radius: 10px;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   background: #fff;
   cursor: pointer;
 }
@@ -960,7 +987,10 @@ button:disabled {
   border: 1px solid var(--theme-control-border, rgba(118, 103, 84, 0.25));
   background: var(--theme-surface-muted, rgba(255, 255, 255, 0.85));
   cursor: pointer;
-  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
+  transition:
+    border-color 0.2s ease,
+    box-shadow 0.2s ease,
+    background 0.2s ease;
 }
 
 .toggle-row.compact {
@@ -1001,7 +1031,10 @@ button:disabled {
   stroke-width: 5;
   stroke-linecap: round;
   stroke-linejoin: round;
-  transition: stroke-dasharray 0.5s ease, stroke-dashoffset 0.5s ease, stroke 0.2s ease;
+  transition:
+    stroke-dasharray 0.5s ease,
+    stroke-dashoffset 0.5s ease,
+    stroke 0.2s ease;
   stroke-dasharray: 241 9999999;
   stroke-dashoffset: 0;
 }
@@ -1029,7 +1062,7 @@ button:disabled {
   gap: 8px;
   padding: 9px 10px;
   border-radius: 10px;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   background: #fff;
   cursor: pointer;
   min-height: 40px;
@@ -1037,7 +1070,7 @@ button:disabled {
 
 .tool-select.open .tool-select-trigger {
   border-color: rgba(118, 103, 84, 0.4);
-  box-shadow: 0 10px 24px rgba(0,0,0,0.08);
+  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
 }
 
 .tool-badges {
@@ -1068,7 +1101,7 @@ button:disabled {
   background: #fffaf4;
   border: 1px solid rgba(118, 103, 84, 0.2);
   border-radius: 12px;
-  box-shadow: 0 16px 36px rgba(0,0,0,0.12);
+  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.12);
   padding: 10px;
   display: flex;
   flex-direction: column;
@@ -1080,7 +1113,7 @@ button:disabled {
   width: 100%;
   padding: 8px 10px;
   border-radius: 10px;
-  border: 1px solid rgba(0,0,0,0.12);
+  border: 1px solid rgba(0, 0, 0, 0.12);
   background: #fff;
 }
 
@@ -1104,8 +1137,8 @@ button:disabled {
   gap: 6px;
   padding: 6px 8px;
   border-radius: 8px;
-  background: rgba(255,255,255,0.85);
-  border: 1px solid rgba(0,0,0,0.06);
+  background: rgba(255, 255, 255, 0.85);
+  border: 1px solid rgba(0, 0, 0, 0.06);
   cursor: pointer;
 }
 
diff --git a/static/src/admin/useSecondaryPass.ts b/static/src/admin/useSecondaryPass.ts
index 499a7db..171b273 100644
--- a/static/src/admin/useSecondaryPass.ts
+++ b/static/src/admin/useSecondaryPass.ts
@@ -28,7 +28,7 @@ export function useSecondaryPass() {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         credentials: 'same-origin',
-        body: JSON.stringify({ password }),
+        body: JSON.stringify({ password })
       });
       const data = await resp.json();
       if (!resp.ok || !data.success) {
@@ -48,7 +48,7 @@ export function useSecondaryPass() {
     loading,
     error,
     check,
-    verify,
+    verify
   };
 }
 
diff --git a/static/src/components/chat/ChatArea.vue b/static/src/components/chat/ChatArea.vue
index 22fde1b..9b5e201 100644
--- a/static/src/components/chat/ChatArea.vue
+++ b/static/src/components/chat/ChatArea.vue
@@ -19,12 +19,20 @@
             <div v-if="msg.content" class="bubble-text">{{ msg.content }}</div>
             <div v-if="msg.images && msg.images.length" class="image-inline-row">
               <div class="image-thumbnail-wrapper" v-for="img in msg.images" :key="img">
-                <img :src="getPreviewUrl(img)" :alt="formatImageName(img)" class="image-thumbnail" />
+                <img
+                  :src="getPreviewUrl(img)"
+                  :alt="formatImageName(img)"
+                  class="image-thumbnail"
+                />
               </div>
             </div>
             <div v-if="msg.videos && msg.videos.length" class="image-inline-row video-inline-row">
               <div class="image-thumbnail-wrapper" v-for="video in msg.videos" :key="video">
-                <img :src="getPreviewUrl(video)" :alt="formatImageName(video)" class="image-thumbnail" />
+                <img
+                  :src="getPreviewUrl(video)"
+                  :alt="formatImageName(video)"
+                  class="image-thumbnail"
+                />
               </div>
             </div>
           </div>
@@ -32,10 +40,19 @@
         <div v-else-if="msg.role === 'assistant'" class="assistant-message">
           <!-- 在 assistant 消息前显示 AI Assistant 头部 -->
           <!-- 只有当前一条消息是 user 且当前消息有内容时才显示 -->
-          <div v-if="index > 0 && filteredMessages[index - 1].role === 'user' && (hasRenderableAssistantActions(msg.actions || []) || msg.awaitingFirstContent)" class="message-header icon-label">
+          <div
+            v-if="
+              index > 0 &&
+              filteredMessages[index - 1].role === 'user' &&
+              (hasRenderableAssistantActions(msg.actions || []) || msg.awaitingFirstContent)
+            "
+            class="message-header icon-label"
+          >
             <span class="icon icon-sm" :style="iconStyleSafe('bot')" aria-hidden="true"></span>
             <span>{{ aiAssistantName }}</span>
-            <span v-if="assistantWorkLabel(index)" class="assistant-work-status">{{ assistantWorkLabel(index) }}</span>
+            <span v-if="assistantWorkLabel(index)" class="assistant-work-status">{{
+              assistantWorkLabel(index)
+            }}</span>
           </div>
           <div
             v-if="msg.awaitingFirstContent"
@@ -77,7 +94,7 @@
             />
           </template>
           <template v-else-if="stackedBlocksEnabled">
-            <template v-for="(group, groupIndex) in splitActionGroups(msg.actions || [], index)" :key="group.key">
+            <template v-for="group in splitActionGroups(msg.actions || [], index)" :key="group.key">
               <StackedBlocks
                 v-if="group.kind === 'stack'"
                 class="stacked-blocks-wrapper"
@@ -103,53 +120,90 @@
                   'streaming-content': group.action?.streaming,
                   'completed-tool': group.action?.type === 'tool' && !group.action?.streaming,
                   'immediate-show':
-                    group.action?.streaming || group.action?.type === 'text' || group.action?.type === 'thinking',
+                    group.action?.streaming ||
+                    group.action?.type === 'text' ||
+                    group.action?.type === 'thinking',
                   'thinking-finished': group.action?.type === 'thinking' && !group.action?.streaming
                 }"
               >
                 <div
                   v-if="group.action?.type === 'thinking'"
                   class="collapsible-block thinking-block"
-                  :class="{ expanded: expandedBlocks?.has(group.action.blockId || `${index}-thinking-${group.actionIndex}`) }"
+                  :class="{
+                    expanded: expandedBlocks?.has(
+                      group.action.blockId || `${index}-thinking-${group.actionIndex}`
+                    )
+                  }"
                 >
-                  <div class="collapsible-header" @click="toggleBlock(group.action.blockId || `${index}-thinking-${group.actionIndex}`)">
+                  <div
+                    class="collapsible-header"
+                    @click="
+                      toggleBlock(group.action.blockId || `${index}-thinking-${group.actionIndex}`)
+                    "
+                  >
                     <div class="arrow"></div>
                     <div class="status-icon">
-                      <span class="thinking-icon" :class="{ 'thinking-animation': group.action.streaming }">
-                        <span class="icon icon-sm" :style="iconStyleSafe('brain')" aria-hidden="true"></span>
+                      <span
+                        class="thinking-icon"
+                        :class="{ 'thinking-animation': group.action.streaming }"
+                      >
+                        <span
+                          class="icon icon-sm"
+                          :style="iconStyleSafe('brain')"
+                          aria-hidden="true"
+                        ></span>
                       </span>
                     </div>
-                    <span class="status-text">{{ group.action.streaming ? '正在思考...' : '思考过程' }}</span>
+                    <span class="status-text">{{
+                      group.action.streaming ? '正在思考...' : '思考过程'
+                    }}</span>
                   </div>
                   <div
                     class="collapsible-content"
-                    :ref="el => registerCollapseContent(group.action.blockId || `${index}-thinking-${group.actionIndex}`, el)"
+                    :ref="
+                      (el) =>
+                        registerCollapseContent(
+                          group.action.blockId || `${index}-thinking-${group.actionIndex}`,
+                          el
+                        )
+                    "
                   >
                     <div
                       class="content-inner thinking-content"
-                      :ref="el => registerThinkingRef(group.action.blockId || `${index}-thinking-${group.actionIndex}`, el)"
+                      :ref="
+                        (el) =>
+                          registerThinkingRef(
+                            group.action.blockId || `${index}-thinking-${group.actionIndex}`,
+                            el
+                          )
+                      "
                       @scroll="
                         handleThinkingScroll(
                           group.action.blockId || `${index}-thinking-${group.actionIndex}`,
                           $event
                         )
                       "
-                      style="max-height: 240px; overflow-y: auto;"
-                >
-                  {{ group.action.content }}
+                      style="max-height: 240px; overflow-y: auto"
+                    >
+                      {{ group.action.content }}
+                    </div>
+                  </div>
                 </div>
-              </div>
-            </div>
 
                 <div v-else-if="group.action?.type === 'text'" class="text-output">
                   <div class="text-content" :class="{ 'streaming-text': group.action.streaming }">
-                    <div v-if="group.action.streaming" v-html="renderMarkdown(group.action.content, true)"></div>
+                    <div
+                      v-if="group.action.streaming"
+                      v-html="renderMarkdown(group.action.content, true)"
+                    ></div>
                     <div v-else v-html="renderMarkdown(group.action.content, false)"></div>
                   </div>
                 </div>
 
                 <div
-                  v-else-if="group.action?.type === 'system' && getSubAgentSystemNoticeLabel(group.action)"
+                  v-else-if="
+                    group.action?.type === 'system' && getSubAgentSystemNoticeLabel(group.action)
+                  "
                   class="sub-agent-system-summary-line"
                 >
                   {{ getSubAgentSystemNoticeLabel(group.action) }}
@@ -163,26 +217,56 @@
                   <div class="append-placeholder-content">
                     <template v-if="group.action.append?.success !== false">
                       <div class="icon-label append-status">
-                        <span class="icon icon-sm" :style="iconStyleSafe('pencil')" aria-hidden="true"></span>
-                        <span>已写入 {{ group.action.append?.path || '目标文件' }} 的追加内容（内容已保存至文件）</span>
+                        <span
+                          class="icon icon-sm"
+                          :style="iconStyleSafe('pencil')"
+                          aria-hidden="true"
+                        ></span>
+                        <span
+                          >已写入
+                          {{ group.action.append?.path || '目标文件' }}
+                          的追加内容（内容已保存至文件）</span
+                        >
                       </div>
                     </template>
                     <template v-else>
                       <div class="icon-label append-status append-error-text">
-                        <span class="icon icon-sm" :style="iconStyleSafe('x')" aria-hidden="true"></span>
-                        <span>向 {{ group.action.append?.path || '目标文件' }} 写入失败，内容已截获供后续修复。</span>
+                        <span
+                          class="icon icon-sm"
+                          :style="iconStyleSafe('x')"
+                          aria-hidden="true"
+                        ></span>
+                        <span
+                          >向
+                          {{ group.action.append?.path || '目标文件' }}
+                          写入失败，内容已截获供后续修复。</span
+                        >
                       </div>
                     </template>
                     <div class="append-meta" v-if="group.action.append">
-                      <span v-if="group.action.append.lines !== null && group.action.append.lines !== undefined">
+                      <span
+                        v-if="
+                          group.action.append.lines !== null &&
+                          group.action.append.lines !== undefined
+                        "
+                      >
                         · 行数 {{ group.action.append.lines }}
                       </span>
-                      <span v-if="group.action.append.bytes !== null && group.action.append.bytes !== undefined">
+                      <span
+                        v-if="
+                          group.action.append.bytes !== null &&
+                          group.action.append.bytes !== undefined
+                        "
+                      >
                         · 字节 {{ group.action.append.bytes }}
                       </span>
                     </div>
                     <div class="append-warning icon-label" v-if="group.action.append?.forced">
-                      <span class="icon icon-sm" :style="iconStyleSafe('triangleAlert')" aria-hidden="true"></span>
+                      <span
+                        class="icon icon-sm"
+                        :style="iconStyleSafe('triangleAlert')"
+                        aria-hidden="true"
+                      ></span>
                       <span>未检测到结束标记，请根据提示继续补充。</span>
                     </div>
                   </div>
@@ -195,16 +279,28 @@
                 >
                   <div class="append-placeholder-content">
                     <div class="icon-label append-status">
-                      <span class="icon icon-sm" :style="iconStyleSafe('pencil')" aria-hidden="true"></span>
+                      <span
+                        class="icon icon-sm"
+                        :style="iconStyleSafe('pencil')"
+                        aria-hidden="true"
+                      ></span>
                       <span>{{ group.action.append?.summary || '文件追加完成' }}</span>
                     </div>
                     <div class="append-meta" v-if="group.action.append">
                       <span>{{ group.action.append.path || '目标文件' }}</span>
-                      <span v-if="group.action.append.lines">· 行数 {{ group.action.append.lines }}</span>
-                      <span v-if="group.action.append.bytes">· 字节 {{ group.action.append.bytes }}</span>
+                      <span v-if="group.action.append.lines"
+                        >· 行数 {{ group.action.append.lines }}</span
+                      >
+                      <span v-if="group.action.append.bytes"
+                        >· 字节 {{ group.action.append.bytes }}</span
+                      >
                     </div>
                     <div class="append-warning icon-label" v-if="group.action.append?.forced">
-                      <span class="icon icon-sm" :style="iconStyleSafe('triangleAlert')" aria-hidden="true"></span>
+                      <span
+                        class="icon icon-sm"
+                        :style="iconStyleSafe('triangleAlert')"
+                        aria-hidden="true"
+                      ></span>
                       <span>未检测到结束标记，请按提示继续补充。</span>
                     </div>
                   </div>
@@ -213,172 +309,263 @@
                 <ToolAction
                   v-else-if="group.action?.type === 'tool'"
                   :action="group.action"
-                  :expanded="expandedBlocks?.has(group.action.blockId || `${index}-tool-${group.actionIndex}`)"
+                  :expanded="
+                    expandedBlocks?.has(
+                      group.action.blockId || `${index}-tool-${group.actionIndex}`
+                    )
+                  "
                   :icon-style="iconStyleSafe"
                   :get-tool-animation-class="getToolAnimationClass"
                   :get-tool-icon="getToolIcon"
                   :get-tool-status-text="getToolStatusText"
-                :get-tool-description="getToolDescription"
-                :format-search-topic="formatSearchTopic"
-                :format-search-time="formatSearchTime"
-                :format-search-domains="formatSearchDomains"
-                :streaming-message="streamingMessage"
-                :register-collapse-content="registerCollapseContent"
-                :collapse-key="group.action.blockId || `${index}-tool-${group.actionIndex}`"
-                @toggle="toggleBlock(group.action.blockId || `${index}-tool-${group.actionIndex}`)"
-              />
+                  :get-tool-description="getToolDescription"
+                  :format-search-topic="formatSearchTopic"
+                  :format-search-time="formatSearchTime"
+                  :format-search-domains="formatSearchDomains"
+                  :streaming-message="streamingMessage"
+                  :register-collapse-content="registerCollapseContent"
+                  :collapse-key="group.action.blockId || `${index}-tool-${group.actionIndex}`"
+                  @toggle="
+                    toggleBlock(group.action.blockId || `${index}-tool-${group.actionIndex}`)
+                  "
+                />
               </div>
             </template>
           </template>
 
           <template v-else>
-            <div
+            <template
               v-for="(action, actionIndex) in msg.actions || []"
-              v-if="isActionVisible(action)"
               :key="action.id || `${index}-${actionIndex}`"
-              class="action-item"
-              :class="{
-                'streaming-content': action.streaming,
-                'completed-tool': action.type === 'tool' && !action.streaming,
-                'immediate-show': action.streaming || action.type === 'text' || action.type === 'thinking',
-                'thinking-finished': action.type === 'thinking' && !action.streaming
-              }"
             >
               <div
-                v-if="action.type === 'thinking'"
-                class="collapsible-block thinking-block"
-                :class="{ expanded: expandedBlocks?.has(action.blockId || `${index}-thinking-${actionIndex}`) }"
+                v-if="isActionVisible(action)"
+                class="action-item"
+                :class="{
+                  'streaming-content': action.streaming,
+                  'completed-tool': action.type === 'tool' && !action.streaming,
+                  'immediate-show':
+                    action.streaming || action.type === 'text' || action.type === 'thinking',
+                  'thinking-finished': action.type === 'thinking' && !action.streaming
+                }"
               >
-                <div class="collapsible-header" @click="toggleBlock(action.blockId || `${index}-thinking-${actionIndex}`)">
-                  <div class="arrow"></div>
-                  <div class="status-icon">
-                    <span class="thinking-icon" :class="{ 'thinking-animation': action.streaming }">
-                      <span class="icon icon-sm" :style="iconStyleSafe('brain')" aria-hidden="true"></span>
-                    </span>
-                  </div>
-                  <span class="status-text">{{ action.streaming ? '正在思考...' : '思考过程' }}</span>
-                </div>
                 <div
-                  class="collapsible-content"
-                  :ref="el => registerCollapseContent(action.blockId || `${index}-thinking-${actionIndex}`, el)"
+                  v-if="action.type === 'thinking'"
+                  class="collapsible-block thinking-block"
+                  :class="{
+                    expanded: expandedBlocks?.has(
+                      action.blockId || `${index}-thinking-${actionIndex}`
+                    )
+                  }"
                 >
                   <div
-                    class="content-inner thinking-content"
-                    :ref="el => registerThinkingRef(action.blockId || `${index}-thinking-${actionIndex}`, el)"
-                    @scroll="
-                      handleThinkingScroll(
-                        action.blockId || `${index}-thinking-${actionIndex}`,
-                        $event
-                      )
-                    "
-                    style="max-height: 240px; overflow-y: auto;"
+                    class="collapsible-header"
+                    @click="toggleBlock(action.blockId || `${index}-thinking-${actionIndex}`)"
                   >
-                    {{ action.content }}
+                    <div class="arrow"></div>
+                    <div class="status-icon">
+                      <span
+                        class="thinking-icon"
+                        :class="{ 'thinking-animation': action.streaming }"
+                      >
+                        <span
+                          class="icon icon-sm"
+                          :style="iconStyleSafe('brain')"
+                          aria-hidden="true"
+                        ></span>
+                      </span>
+                    </div>
+                    <span class="status-text">{{
+                      action.streaming ? '正在思考...' : '思考过程'
+                    }}</span>
+                  </div>
+                  <div
+                    class="collapsible-content"
+                    :ref="
+                      (el) =>
+                        registerCollapseContent(
+                          action.blockId || `${index}-thinking-${actionIndex}`,
+                          el
+                        )
+                    "
+                  >
+                    <div
+                      class="content-inner thinking-content"
+                      :ref="
+                        (el) =>
+                          registerThinkingRef(
+                            action.blockId || `${index}-thinking-${actionIndex}`,
+                            el
+                          )
+                      "
+                      @scroll="
+                        handleThinkingScroll(
+                          action.blockId || `${index}-thinking-${actionIndex}`,
+                          $event
+                        )
+                      "
+                      style="max-height: 240px; overflow-y: auto"
+                    >
+                      {{ action.content }}
+                    </div>
                   </div>
                 </div>
-              </div>
 
-              <div v-else-if="action.type === 'text'" class="text-output">
-                <div class="text-content" :class="{ 'streaming-text': action.streaming }">
-                  <div v-if="action.streaming" v-html="renderMarkdown(action.content, true)"></div>
-                  <div v-else v-html="renderMarkdown(action.content, false)"></div>
+                <div v-else-if="action.type === 'text'" class="text-output">
+                  <div class="text-content" :class="{ 'streaming-text': action.streaming }">
+                    <div
+                      v-if="action.streaming"
+                      v-html="renderMarkdown(action.content, true)"
+                    ></div>
+                    <div v-else v-html="renderMarkdown(action.content, false)"></div>
+                  </div>
                 </div>
-              </div>
 
-              <div
-                v-else-if="action.type === 'system' && getSubAgentSystemNoticeLabel(action)"
-                class="sub-agent-system-summary-line"
-              >
-                {{ getSubAgentSystemNoticeLabel(action) }}
-              </div>
+                <div
+                  v-else-if="action.type === 'system' && getSubAgentSystemNoticeLabel(action)"
+                  class="sub-agent-system-summary-line"
+                >
+                  {{ getSubAgentSystemNoticeLabel(action) }}
+                </div>
 
-              <div
-                v-else-if="action.type === 'append_payload'"
-                class="append-placeholder"
-                :class="{ 'append-error': action.append?.success === false }"
-              >
-                <div class="append-placeholder-content">
-                  <template v-if="action.append?.success !== false">
+                <div
+                  v-else-if="action.type === 'append_payload'"
+                  class="append-placeholder"
+                  :class="{ 'append-error': action.append?.success === false }"
+                >
+                  <div class="append-placeholder-content">
+                    <template v-if="action.append?.success !== false">
+                      <div class="icon-label append-status">
+                        <span
+                          class="icon icon-sm"
+                          :style="iconStyleSafe('pencil')"
+                          aria-hidden="true"
+                        ></span>
+                        <span
+                          >已写入
+                          {{ action.append?.path || '目标文件' }}
+                          的追加内容（内容已保存至文件）</span
+                        >
+                      </div>
+                    </template>
+                    <template v-else>
+                      <div class="icon-label append-status append-error-text">
+                        <span
+                          class="icon icon-sm"
+                          :style="iconStyleSafe('x')"
+                          aria-hidden="true"
+                        ></span>
+                        <span
+                          >向
+                          {{ action.append?.path || '目标文件' }}
+                          写入失败，内容已截获供后续修复。</span
+                        >
+                      </div>
+                    </template>
+                    <div class="append-meta" v-if="action.append">
+                      <span
+                        v-if="action.append.lines !== null && action.append.lines !== undefined"
+                      >
+                        · 行数 {{ action.append.lines }}
+                      </span>
+                      <span
+                        v-if="action.append.bytes !== null && action.append.bytes !== undefined"
+                      >
+                        · 字节 {{ action.append.bytes }}
+                      </span>
+                    </div>
+                    <div class="append-warning icon-label" v-if="action.append?.forced">
+                      <span
+                        class="icon icon-sm"
+                        :style="iconStyleSafe('triangleAlert')"
+                        aria-hidden="true"
+                      ></span>
+                      <span>未检测到结束标记，请根据提示继续补充。</span>
+                    </div>
+                  </div>
+                </div>
+
+                <div
+                  v-else-if="action.type === 'append'"
+                  class="append-placeholder"
+                  :class="{ 'append-error': action.append?.success === false }"
+                >
+                  <div class="append-placeholder-content">
                     <div class="icon-label append-status">
-                      <span class="icon icon-sm" :style="iconStyleSafe('pencil')" aria-hidden="true"></span>
-                      <span>已写入 {{ action.append?.path || '目标文件' }} 的追加内容（内容已保存至文件）</span>
+                      <span
+                        class="icon icon-sm"
+                        :style="iconStyleSafe('pencil')"
+                        aria-hidden="true"
+                      ></span>
+                      <span>{{ action.append?.summary || '文件追加完成' }}</span>
                     </div>
-                  </template>
-                  <template v-else>
-                    <div class="icon-label append-status append-error-text">
-                      <span class="icon icon-sm" :style="iconStyleSafe('x')" aria-hidden="true"></span>
-                      <span>向 {{ action.append?.path || '目标文件' }} 写入失败，内容已截获供后续修复。</span>
+                    <div class="append-meta" v-if="action.append">
+                      <span>{{ action.append.path || '目标文件' }}</span>
+                      <span v-if="action.append.lines">· 行数 {{ action.append.lines }}</span>
+                      <span v-if="action.append.bytes">· 字节 {{ action.append.bytes }}</span>
+                    </div>
+                    <div class="append-warning icon-label" v-if="action.append?.forced">
+                      <span
+                        class="icon icon-sm"
+                        :style="iconStyleSafe('triangleAlert')"
+                        aria-hidden="true"
+                      ></span>
+                      <span>未检测到结束标记，请按提示继续补充。</span>
                     </div>
-                  </template>
-                  <div class="append-meta" v-if="action.append">
-                    <span v-if="action.append.lines !== null && action.append.lines !== undefined">
-                      · 行数 {{ action.append.lines }}
-                    </span>
-                    <span v-if="action.append.bytes !== null && action.append.bytes !== undefined">
-                      · 字节 {{ action.append.bytes }}
-                    </span>
-                  </div>
-                  <div class="append-warning icon-label" v-if="action.append?.forced">
-                    <span class="icon icon-sm" :style="iconStyleSafe('triangleAlert')" aria-hidden="true"></span>
-                    <span>未检测到结束标记，请根据提示继续补充。</span>
                   </div>
                 </div>
-              </div>
 
-              <div
-                v-else-if="action.type === 'append'"
-                class="append-placeholder"
-                :class="{ 'append-error': action.append?.success === false }"
-              >
-                <div class="append-placeholder-content">
-                  <div class="icon-label append-status">
-                    <span class="icon icon-sm" :style="iconStyleSafe('pencil')" aria-hidden="true"></span>
-                    <span>{{ action.append?.summary || '文件追加完成' }}</span>
-                  </div>
-                  <div class="append-meta" v-if="action.append">
-                    <span>{{ action.append.path || '目标文件' }}</span>
-                    <span v-if="action.append.lines">· 行数 {{ action.append.lines }}</span>
-                    <span v-if="action.append.bytes">· 字节 {{ action.append.bytes }}</span>
-                  </div>
-                  <div class="append-warning icon-label" v-if="action.append?.forced">
-                    <span class="icon icon-sm" :style="iconStyleSafe('triangleAlert')" aria-hidden="true"></span>
-                    <span>未检测到结束标记，请按提示继续补充。</span>
-                  </div>
-                </div>
+                <ToolAction
+                  v-else-if="action.type === 'tool'"
+                  :action="action"
+                  :expanded="expandedBlocks?.has(action.blockId || `${index}-tool-${actionIndex}`)"
+                  :icon-style="iconStyleSafe"
+                  :get-tool-animation-class="getToolAnimationClass"
+                  :get-tool-icon="getToolIcon"
+                  :get-tool-status-text="getToolStatusText"
+                  :get-tool-description="getToolDescription"
+                  :format-search-topic="formatSearchTopic"
+                  :format-search-time="formatSearchTime"
+                  :format-search-domains="formatSearchDomains"
+                  :streaming-message="streamingMessage"
+                  :register-collapse-content="registerCollapseContent"
+                  :collapse-key="action.blockId || `${index}-tool-${actionIndex}`"
+                  @toggle="toggleBlock(action.blockId || `${index}-tool-${actionIndex}`)"
+                />
               </div>
-
-              <ToolAction
-                v-else-if="action.type === 'tool'"
-                :action="action"
-                :expanded="expandedBlocks?.has(action.blockId || `${index}-tool-${actionIndex}`)"
-                :icon-style="iconStyleSafe"
-                :get-tool-animation-class="getToolAnimationClass"
-                :get-tool-icon="getToolIcon"
-                :get-tool-status-text="getToolStatusText"
-                :get-tool-description="getToolDescription"
-                :format-search-topic="formatSearchTopic"
-                :format-search-time="formatSearchTime"
-                :format-search-domains="formatSearchDomains"
-                :streaming-message="streamingMessage"
-                :register-collapse-content="registerCollapseContent"
-                :collapse-key="action.blockId || `${index}-tool-${actionIndex}`"
-                @toggle="toggleBlock(action.blockId || `${index}-tool-${actionIndex}`)"
-              />
-            </div>
+            </template>
           </template>
         </div>
-        <div v-else class="system-message" @vue:mounted="() => console.log('[ChatArea] 渲染系统消息:', { index, role: msg.role, content: msg.content })">
-          <div class="collapsible-block system-block" :class="{ expanded: expandedBlocks?.has(`system-${index}`) }">
+        <div
+          v-else
+          class="system-message"
+          @vue:mounted="
+            () =>
+              console.log('[ChatArea] 渲染系统消息:', {
+                index,
+                role: msg.role,
+                content: msg.content
+              })
+          "
+        >
+          <div
+            class="collapsible-block system-block"
+            :class="{ expanded: expandedBlocks?.has(`system-${index}`) }"
+          >
             <div class="collapsible-header" @click="toggleBlock(`system-${index}`)">
               <div class="arrow"></div>
               <div class="status-icon">
-                <span class="tool-icon icon icon-md" :style="iconStyleSafe('info')" aria-hidden="true"></span>
+                <span
+                  class="tool-icon icon icon-md"
+                  :style="iconStyleSafe('info')"
+                  aria-hidden="true"
+                ></span>
               </div>
               <span class="status-text">系统消息 (role: {{ msg.role }})</span>
             </div>
             <div
               class="collapsible-content"
-              :ref="el => registerCollapseContent(`system-${index}`, el)"
+              :ref="(el) => registerCollapseContent(`system-${index}`, el)"
             >
               <div class="content-inner">
                 {{ msg.content }}
@@ -437,20 +624,29 @@ const userName = computed(() => {
 });
 const filteredMessages = computed(() => {
   const source = props.messages || [];
-  const droppedRoleSystem = source.filter(m => m && m.role === 'system');
+  const droppedRoleSystem = source.filter((m) => m && m.role === 'system');
   if (droppedRoleSystem.length > 0) {
     console.log('[DEBUG_SYSTEM][render] filteredMessages 过滤了 role=system 消息', {
       count: droppedRoleSystem.length,
       samples: droppedRoleSystem.slice(0, 3)
     });
   }
-  return source.filter(m => !(m && m.metadata && m.metadata.system_injected_image) && m.role !== 'system');
+  return source.filter(
+    (m) => !(m && m.metadata && m.metadata.system_injected_image) && m.role !== 'system'
+  );
 });
 const latestMessageIndex = computed(() => filteredMessages.value.length - 1);
 const SUB_AGENT_DONE_LABEL_RE = /^子智能体\d+\s*任务完成$/;
 const SUB_AGENT_DONE_PREFIX_RE = /^(?:✅\s*)?子智能体\s*#?\s*(\d+)\s*任务摘要[:：]/;
 const BG_RUN_COMMAND_DONE_LABEL_RE = /^(?:\[)?后台\s*run_command\s*完成(?:\])?$/;
-const RENDERABLE_ACTION_TYPES = new Set(['thinking', 'text', 'tool', 'append', 'append_payload', 'system']);
+const RENDERABLE_ACTION_TYPES = new Set([
+  'thinking',
+  'text',
+  'tool',
+  'append',
+  'append_payload',
+  'system'
+]);
 const nowMs = ref(Date.now());
 let timerHandle: number | null = null;
 const debugLoggedSystemActionKeys = new Set<string>();
@@ -525,7 +721,10 @@ function getSubAgentSystemNoticeLabel(action: any): string | null {
     }
     return null;
   }
-  if (action.variant === 'sub_agent_done' && (SUB_AGENT_DONE_LABEL_RE.test(content) || BG_RUN_COMMAND_DONE_LABEL_RE.test(content))) {
+  if (
+    action.variant === 'sub_agent_done' &&
+    (SUB_AGENT_DONE_LABEL_RE.test(content) || BG_RUN_COMMAND_DONE_LABEL_RE.test(content))
+  ) {
     if (!debugLoggedSystemActionKeys.has(`${key}-variant-pass`)) {
       console.log('[DEBUG_SYSTEM][render] 命中 variant 渲染', { action, label: content });
       debugLoggedSystemActionKeys.add(`${key}-variant-pass`);
@@ -535,7 +734,10 @@ function getSubAgentSystemNoticeLabel(action: any): string | null {
   const m = content.match(SUB_AGENT_DONE_PREFIX_RE);
   if (m && /已完成/.test(content)) {
     if (!debugLoggedSystemActionKeys.has(`${key}-regex-pass`)) {
-      console.log('[DEBUG_SYSTEM][render] 命中 regex 渲染', { action, normalized: `子智能体${m[1]} 任务完成` });
+      console.log('[DEBUG_SYSTEM][render] 命中 regex 渲染', {
+        action,
+        normalized: `子智能体${m[1]} 任务完成`
+      });
       debugLoggedSystemActionKeys.add(`${key}-regex-pass`);
     }
     return `子智能体${m[1]} 任务完成`;
@@ -614,9 +816,15 @@ function assistantWorkLabel(index: number): string {
   if (status === 'working') {
     return `工作中 ${formatDurationMs(nowMs.value - startMs)}`;
   }
-  const durationMs = typeof timer.duration_ms === 'number'
-    ? timer.duration_ms
-    : Math.max(0, (Number.isFinite(Date.parse(timer.finished_at || '')) ? Date.parse(timer.finished_at) : nowMs.value) - startMs);
+  const durationMs =
+    typeof timer.duration_ms === 'number'
+      ? timer.duration_ms
+      : Math.max(
+          0,
+          (Number.isFinite(Date.parse(timer.finished_at || ''))
+            ? Date.parse(timer.finished_at)
+            : nowMs.value) - startMs
+        );
   return `工作完成 ${formatDurationMs(durationMs)}`;
 }
 
@@ -633,7 +841,8 @@ onBeforeUnmount(() => {
   }
 });
 
-const isStackable = (action: any) => action && (action.type === 'thinking' || action.type === 'tool');
+const isStackable = (action: any) =>
+  action && (action.type === 'thinking' || action.type === 'tool');
 const isEmptyTextAction = (action: any) => {
   if (!action || action.type !== 'text') {
     return false;
@@ -652,7 +861,7 @@ const splitActionGroups = (actions: any[] = [], messageIndex = 0) => {
   if (actions.length > 0) {
     console.log(`[splitActionGroups] 消息 ${messageIndex}:`, {
       totalActions: actions.length,
-      actionTypes: actions.map(a => a.type),
+      actionTypes: actions.map((a) => a.type),
       stackedBlocksEnabled: props.stackedBlocksEnabled
     });
   }
@@ -698,7 +907,7 @@ const splitActionGroups = (actions: any[] = [], messageIndex = 0) => {
   if (actions.length > 0) {
     console.log(`[splitActionGroups] 消息 ${messageIndex} 结果:`, {
       totalGroups: result.length,
-      groups: result.map(g => ({
+      groups: result.map((g) => ({
         kind: g.kind,
         actionsCount: g.kind === 'stack' ? g.actions.length : 1,
         actionType: g.kind === 'stack' ? g.actions[0]?.type : g.action?.type
diff --git a/static/src/components/chat/MinimalBlocks.vue b/static/src/components/chat/MinimalBlocks.vue
index dc11b62..1b211a8 100644
--- a/static/src/components/chat/MinimalBlocks.vue
+++ b/static/src/components/chat/MinimalBlocks.vue
@@ -29,8 +29,20 @@
           </div>
           <!-- 加载动画或完成图标 -->
           <div class="summary-status-icon">
-            <component v-if="isSummaryRunning(group.actions, group.id)" :is="getSummaryLoader(group.id)" />
-            <svg v-else class="check-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <component
+              v-if="isSummaryRunning(group.actions, group.id)"
+              :is="getSummaryLoader(group.id)"
+            />
+            <svg
+              v-else
+              class="check-icon"
+              width="18"
+              height="18"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+            >
               <circle cx="12" cy="12" r="10" />
               <polyline points="7.5 12 10.5 15 16.5 9" />
             </svg>
@@ -40,11 +52,7 @@
         <!-- 步骤容器（展开时显示所有步骤） -->
         <div class="steps-container" :class="{ show: expandedGroups.has(group.id) }">
           <div class="steps-wrapper">
-            <div
-              v-for="(step, idx) in getSummarySteps(group.actions)"
-              :key="step.id"
-              class="step-item"
-            >
+            <div v-for="step in getSummarySteps(group.actions)" :key="step.id" class="step-item">
               <div class="step-timeline">
                 <span
                   class="step-icon icon icon-sm"
@@ -57,14 +65,16 @@
                 <div v-if="step.type === 'thinking'" class="step-body">
                   <div
                     class="thinking-content"
-                    :ref="el => registerThinking(step.id, el)"
+                    :ref="(el) => registerThinking(step.id, el)"
                     @scroll="handleScroll(step.id, $event)"
                     v-html="renderContent(step.content)"
                   ></div>
                 </div>
                 <div v-else-if="step.type === 'tool'" class="step-body">
                   <div class="step-header">{{ getToolName(step.action) }}</div>
-                  <div class="tool-intent" v-if="getToolIntent(step.action)">{{ getToolIntent(step.action) }}</div>
+                  <div class="tool-intent" v-if="getToolIntent(step.action)">
+                    {{ getToolIntent(step.action) }}
+                  </div>
                   <div class="tool-result" v-if="step.action.tool?.result">
                     <div v-html="renderToolResult(step.action)"></div>
                   </div>
@@ -79,7 +89,11 @@
       </div>
 
       <!-- 文本组 -->
-      <div v-else-if="group.type === 'text'" class="text-output" :class="{ 'streaming-text': group.streaming }">
+      <div
+        v-else-if="group.type === 'text'"
+        class="text-output"
+        :class="{ 'streaming-text': group.streaming }"
+      >
         <div class="text-content" :class="{ 'streaming-text': group.streaming }">
           <div v-if="group.streaming" v-html="renderMarkdown(group.content || '', true)"></div>
           <div v-else v-html="renderMarkdown(group.content || '', false)"></div>
@@ -91,7 +105,15 @@
             <span class="summary-preview">{{ group.content || '' }}</span>
           </div>
           <div class="summary-status-icon">
-            <svg class="check-icon" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+            <svg
+              class="check-icon"
+              width="18"
+              height="18"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              stroke-width="2"
+            >
               <circle cx="12" cy="12" r="10" />
               <polyline points="7.5 12 10.5 15 16.5 9" />
             </svg>
@@ -172,11 +194,11 @@ const getAnimatedSummaryChars = (text: string) => Array.from(text || '');
 
 // 获取摘要组的加载动画组件（每次action类型切换时随机一次）
 const getSummaryLoader = (groupId: string) => {
-  const group = blockGroups.value.find(g => g.id === groupId);
+  const group = blockGroups.value.find((g) => g.id === groupId);
   if (!group || !group.actions) return getRandomLoader();
 
   // 找到当前正在streaming的action，或最后一个action
-  const streamingAction = group.actions.find(a => a.streaming);
+  const streamingAction = group.actions.find((a) => a.streaming);
   const currentAction = streamingAction || group.actions[group.actions.length - 1];
 
   if (!currentAction) return getRandomLoader();
@@ -196,9 +218,10 @@ const getSummaryLoader = (groupId: string) => {
   // 使用"类型切换点"作为key
   // 如果是第一个action，或者类型发生了切换，就会生成新的key
   // 如果是相同类型的连续action（如多个工具并行），使用相同的key
-  const typeSegmentKey = lastDifferentTypeIndex >= 0
-    ? `${group.actions[lastDifferentTypeIndex].id}-${currentAction.type}`
-    : `start-${currentAction.type}`;
+  const typeSegmentKey =
+    lastDifferentTypeIndex >= 0
+      ? `${group.actions[lastDifferentTypeIndex].id}-${currentAction.type}`
+      : `start-${currentAction.type}`;
 
   const cacheKey = `${groupId}-${typeSegmentKey}`;
 
@@ -221,7 +244,8 @@ const blockGroups = computed(() => {
       // 先保存当前的 thinking/tool 组
       if (currentGroup.length > 0) {
         // 使用第一个 action 的 id 作为 group id，保证稳定性
-        const firstActionId = currentGroup[0].id || currentGroup[0].blockId || `summary-${groupIndex}`;
+        const firstActionId =
+          currentGroup[0].id || currentGroup[0].blockId || `summary-${groupIndex}`;
         groups.push({
           type: 'summary',
           id: `summary-${firstActionId}`,
@@ -270,7 +294,7 @@ const blockGroups = computed(() => {
 // 获取摘要组的预览文本（始终显示最新的思考/工具）
 const getSummaryPreview = (actions: Action[]) => {
   // 优先返回正在 streaming 的最后一个
-  const streamingActions = actions.filter(a => a.streaming);
+  const streamingActions = actions.filter((a) => a.streaming);
 
   let currentStep;
   if (streamingActions.length > 0) {
@@ -278,7 +302,7 @@ const getSummaryPreview = (actions: Action[]) => {
     currentStep = streamingActions[streamingActions.length - 1];
   } else {
     // 如果没有 streaming 的（全部完成了），优先返回最后一个工具
-    const toolActions = actions.filter(a => a.type === 'tool');
+    const toolActions = actions.filter((a) => a.type === 'tool');
     if (toolActions.length > 0) {
       currentStep = toolActions[toolActions.length - 1];
     } else {
@@ -332,11 +356,11 @@ const isSummaryRunning = (actions: Action[], groupId: string) => {
   }
 
   // 找到当前 group 在 blockGroups 中的索引
-  const currentIndex = blockGroups.value.findIndex(g => g.id === groupId);
+  const currentIndex = blockGroups.value.findIndex((g) => g.id === groupId);
   if (currentIndex === -1) return false;
 
   // 检查后面是否有文本输出
-  const hasTextAfter = blockGroups.value.slice(currentIndex + 1).some(g => g.type === 'text');
+  const hasTextAfter = blockGroups.value.slice(currentIndex + 1).some((g) => g.type === 'text');
 
   // 只有当后面有文本输出时，才显示对勾（说明这个摘要组已经完成并开始输出了）
   // 否则一直显示加载动画（即使工具执行完了，也要等下一个步骤或文本输出）
@@ -360,9 +384,9 @@ const toggleExpand = (groupId: string) => {
 
     // 折叠后，取消注册该组中的思考内容 ref
     nextTick(() => {
-      const group = blockGroups.value.find(g => g.id === groupId);
+      const group = blockGroups.value.find((g) => g.id === groupId);
       if (group && group.actions) {
-        group.actions.forEach(action => {
+        group.actions.forEach((action) => {
           if (action.type === 'thinking') {
             const blockId = action.id || action.blockId;
             if (blockId && typeof props.registerThinkingRef === 'function') {
@@ -377,9 +401,9 @@ const toggleExpand = (groupId: string) => {
 
     // 展开后，注册该组中的思考内容 ref
     nextTick(() => {
-      const group = blockGroups.value.find(g => g.id === groupId);
+      const group = blockGroups.value.find((g) => g.id === groupId);
       if (group && group.actions) {
-        group.actions.forEach(action => {
+        group.actions.forEach((action) => {
           if (action.type === 'thinking') {
             const blockId = action.id || action.blockId;
             if (blockId) {
@@ -487,8 +511,9 @@ const registerThinking = (key: string, el: Element | null) => {
   }
 
   // 检查当前思考内容所在的摘要是否展开
-  const group = blockGroups.value.find(g =>
-    g.type === 'summary' && g.actions && g.actions.some(a => (a.id === key || a.blockId === key))
+  const group = blockGroups.value.find(
+    (g) =>
+      g.type === 'summary' && g.actions && g.actions.some((a) => a.id === key || a.blockId === key)
   );
 
   // 只有展开的摘要中的思考内容才注册到父组件
@@ -505,9 +530,13 @@ const handleScroll = (blockId: string, event: Event) => {
   }
 };
 
-watch(() => props.actions, () => {
-  // 简化：不需要动态更新高度
-}, { deep: true });
+watch(
+  () => props.actions,
+  () => {
+    // 简化：不需要动态更新高度
+  },
+  { deep: true }
+);
 </script>
 
 <style scoped>
diff --git a/static/src/components/chat/StackedBlocks.vue b/static/src/components/chat/StackedBlocks.vue
index fe29dc5..0da69a6 100644
--- a/static/src/components/chat/StackedBlocks.vue
+++ b/static/src/components/chat/StackedBlocks.vue
@@ -30,94 +30,129 @@
         :style="{ transform: `translateY(${innerOffset}px)` }"
         appear
       >
-      <div v-for="(action, idx) in stackableActions" :key="blockKey(action, idx)" class="stacked-item">
         <div
-          v-if="action.type === 'thinking'"
-          class="collapsible-block thinking-block stacked-block"
-          :class="{ expanded: isExpanded(action, idx), processing: action.streaming }"
+          v-for="(action, idx) in stackableActions"
+          :key="blockKey(action, idx)"
+          class="stacked-item"
         >
-          <div class="collapsible-header" @click="toggleBlock(blockKey(action, idx))">
-            <div class="arrow"></div>
-            <div class="status-icon">
-              <span class="thinking-icon" :class="{ 'thinking-animation': action.streaming }">
-                <span class="icon icon-sm" :style="iconStyle('brain')" aria-hidden="true"></span>
-              </span>
+          <div
+            v-if="action.type === 'thinking'"
+            class="collapsible-block thinking-block stacked-block"
+            :class="{ expanded: isExpanded(action, idx), processing: action.streaming }"
+          >
+            <div class="collapsible-header" @click="toggleBlock(blockKey(action, idx))">
+              <div class="arrow"></div>
+              <div class="status-icon">
+                <span class="thinking-icon" :class="{ 'thinking-animation': action.streaming }">
+                  <span class="icon icon-sm" :style="iconStyle('brain')" aria-hidden="true"></span>
+                </span>
+              </div>
+              <span class="status-text">{{ action.streaming ? '正在思考...' : '思考过程' }}</span>
             </div>
-            <span class="status-text">{{ action.streaming ? '正在思考...' : '思考过程' }}</span>
-          </div>
-          <div class="collapsible-content" :style="contentStyle(blockKey(action, idx))">
-            <div
-              class="content-inner thinking-content"
-              :ref="el => registerThinking(blockKey(action, idx), el)"
-              @scroll="handleThinkingScrollInternal(blockKey(action, idx), $event)"
-              style="max-height: 240px; overflow-y: auto;"
-            >
-              {{ action.content }}
+            <div class="collapsible-content" :style="contentStyle(blockKey(action, idx))">
+              <div
+                class="content-inner thinking-content"
+                :ref="(el) => registerThinking(blockKey(action, idx), el)"
+                @scroll="handleThinkingScrollInternal(blockKey(action, idx), $event)"
+                style="max-height: 240px; overflow-y: auto"
+              >
+                {{ action.content }}
+              </div>
             </div>
           </div>
-        </div>
 
-        <div
-          v-else-if="action.type === 'tool'"
-          class="collapsible-block tool-block stacked-block"
-          :class="{
-            expanded: isExpanded(action, idx),
-            processing: isToolProcessing(action),
-            completed: isToolCompleted(action)
-          }"
-        >
-          <div class="collapsible-header" @click="toggleBlock(blockKey(action, idx))">
-            <div class="arrow"></div>
-            <div class="status-icon">
-              <span
-                class="tool-icon icon icon-md"
-                :class="getToolAnimationClass(action.tool)"
-                :style="iconStyle(getToolIcon(action.tool))"
-                aria-hidden="true"
-              ></span>
+          <div
+            v-else-if="action.type === 'tool'"
+            class="collapsible-block tool-block stacked-block"
+            :class="{
+              expanded: isExpanded(action, idx),
+              processing: isToolProcessing(action),
+              completed: isToolCompleted(action)
+            }"
+          >
+            <div class="collapsible-header" @click="toggleBlock(blockKey(action, idx))">
+              <div class="arrow"></div>
+              <div class="status-icon">
+                <span
+                  class="tool-icon icon icon-md"
+                  :class="getToolAnimationClass(action.tool)"
+                  :style="iconStyle(getToolIcon(action.tool))"
+                  aria-hidden="true"
+                ></span>
+              </div>
+              <span class="status-text">{{ getToolStatusText(action.tool) }}</span>
+              <span class="tool-desc">{{ getToolDescription(action.tool) }}</span>
             </div>
-            <span class="status-text">{{ getToolStatusText(action.tool) }}</span>
-            <span class="tool-desc">{{ getToolDescription(action.tool) }}</span>
-          </div>
-          <div class="collapsible-content" :style="contentStyle(blockKey(action, idx))">
-            <div class="content-inner">
-              <div v-if="shouldUseEnhancedDisplay && renderToolResult(action)" v-html="renderToolResult(action)"></div>
-              <div v-else-if="!shouldUseEnhancedDisplay && action.tool?.name === 'web_search' && action.tool?.result">
-                <div class="search-meta">
-                  <div><strong>搜索内容：</strong>{{ action.tool.result.query || action.tool.arguments?.query }}</div>
-                  <div><strong>主题：</strong>{{ formatSearchTopic(action.tool.result.filters || {}) }}</div>
-                  <div><strong>时间范围：</strong>{{ formatSearchTime(action.tool.result.filters || {}) }}</div>
-                  <div><strong>限定网站：</strong>{{ formatSearchDomains(action.tool.result.filters || {}) }}</div>
-                  <div><strong>结果数量：</strong>{{ action.tool.result.total_results }}</div>
-                </div>
-                <div v-if="action.tool.result.results && action.tool.result.results.length" class="search-result-list">
-                  <div v-for="item in action.tool.result.results" :key="item.url || item.index" class="search-result-item">
-                    <div class="search-result-title">{{ item.title || '无标题' }}</div>
-                    <div class="search-result-url">
-                      <a v-if="item.url" :href="item.url" target="_blank">{{ item.url }}</a><span v-else>无可用链接</span>
+            <div class="collapsible-content" :style="contentStyle(blockKey(action, idx))">
+              <div class="content-inner">
+                <div
+                  v-if="shouldUseEnhancedDisplay && renderToolResult(action)"
+                  v-html="renderToolResult(action)"
+                ></div>
+                <div
+                  v-else-if="
+                    !shouldUseEnhancedDisplay &&
+                    action.tool?.name === 'web_search' &&
+                    action.tool?.result
+                  "
+                >
+                  <div class="search-meta">
+                    <div>
+                      <strong>搜索内容：</strong
+                      >{{ action.tool.result.query || action.tool.arguments?.query }}
+                    </div>
+                    <div>
+                      <strong>主题：</strong
+                      >{{ formatSearchTopic(action.tool.result.filters || {}) }}
+                    </div>
+                    <div>
+                      <strong>时间范围：</strong
+                      >{{ formatSearchTime(action.tool.result.filters || {}) }}
+                    </div>
+                    <div>
+                      <strong>限定网站：</strong
+                      >{{ formatSearchDomains(action.tool.result.filters || {}) }}
+                    </div>
+                    <div><strong>结果数量：</strong>{{ action.tool.result.total_results }}</div>
+                  </div>
+                  <div
+                    v-if="action.tool.result.results && action.tool.result.results.length"
+                    class="search-result-list"
+                  >
+                    <div
+                      v-for="item in action.tool.result.results"
+                      :key="item.url || item.index"
+                      class="search-result-item"
+                    >
+                      <div class="search-result-title">{{ item.title || '无标题' }}</div>
+                      <div class="search-result-url">
+                        <a v-if="item.url" :href="item.url" target="_blank">{{ item.url }}</a
+                        ><span v-else>无可用链接</span>
+                      </div>
                     </div>
                   </div>
+                  <div v-else class="search-empty">未返回详细的搜索结果。</div>
                 </div>
-                <div v-else class="search-empty">未返回详细的搜索结果。</div>
-              </div>
-              <div v-else-if="action.tool?.name === 'run_python' && action.tool?.result">
-                <div class="code-block">
-                  <div class="code-label">代码：</div>
-                  <pre><code class="language-python">{{ action.tool.result.code || action.tool.arguments?.code }}</code></pre>
+                <div v-else-if="action.tool?.name === 'run_python' && action.tool?.result">
+                  <div class="code-block">
+                    <div class="code-label">代码：</div>
+                    <pre><code class="language-python">{{ action.tool.result.code || action.tool.arguments?.code }}</code></pre>
+                  </div>
+                  <div v-if="action.tool.result.output" class="output-block">
+                    <div class="output-label">输出：</div>
+                    <pre>{{ action.tool.result.output }}</pre>
+                  </div>
                 </div>
-                <div v-if="action.tool.result.output" class="output-block">
-                  <div class="output-label">输出：</div>
-                  <pre>{{ action.tool.result.output }}</pre>
+                <div v-else>
+                  <pre>{{
+                    JSON.stringify(action.tool?.result || action.tool?.arguments, null, 2)
+                  }}</pre>
                 </div>
               </div>
-              <div v-else>
-                <pre>{{ JSON.stringify(action.tool?.result || action.tool?.arguments, null, 2) }}</pre>
-              </div>
             </div>
+            <div v-if="isToolProcessing(action)" class="progress-indicator"></div>
           </div>
-          <div v-if="isToolProcessing(action)" class="progress-indicator"></div>
         </div>
-      </div>
       </TransitionGroup>
     </div>
   </div>
@@ -154,7 +189,12 @@ const shouldUseEnhancedDisplay = computed(() => {
 });
 
 const renderToolResult = (action: any) => {
-  return renderEnhancedToolResult(action, props.formatSearchTopic, props.formatSearchTime, props.formatSearchDomains);
+  return renderEnhancedToolResult(
+    action,
+    props.formatSearchTopic,
+    props.formatSearchTime,
+    props.formatSearchDomains
+  );
 };
 
 const VISIBLE_LIMIT = 6;
@@ -175,7 +215,9 @@ let syncRaf: number | null = null;
 let syncUntil = 0;
 const isMoreAnimating = ref(false);
 
-const stackableActions = computed(() => (props.actions || []).filter((item) => item && (item.type === 'thinking' || item.type === 'tool')));
+const stackableActions = computed(() =>
+  (props.actions || []).filter((item) => item && (item.type === 'thinking' || item.type === 'tool'))
+);
 
 const hiddenCount = computed(() => Math.max(0, stackableActions.value.length - VISIBLE_LIMIT));
 const moreVisible = computed(() => hiddenCount.value > 0 || showAll.value);
@@ -268,7 +310,8 @@ const setShellMetrics = () => {
 
   moreHeight.value = moreVisible.value ? moreBaseHeight() : 0;
 
-  const targetShell = moreHeight.value + (showAll.value || !moreVisible.value ? totalHeight : windowHeight);
+  const targetShell =
+    moreHeight.value + (showAll.value || !moreVisible.value ? totalHeight : windowHeight);
   const targetOffset = showAll.value || !moreVisible.value ? 0 : -hiddenHeight;
 
   shellHeight.value = targetShell;
diff --git a/static/src/components/chat/VirtualMonitorSurface.vue b/static/src/components/chat/VirtualMonitorSurface.vue
index b4ef8da..82462ff 100644
--- a/static/src/components/chat/VirtualMonitorSurface.vue
+++ b/static/src/components/chat/VirtualMonitorSurface.vue
@@ -3,16 +3,16 @@
     <div class="monitor-stage">
       <div class="monitor">
         <div class="monitor-shell">
-            <div class="monitor-top">
-              <div class="monitor-brand">Agent Display Surface</div>
-              <div class="status-pill-group">
-                <div class="status-pill">{{ statusLabel }}</div>
-                <div class="progress-pill" v-if="currentProgressLabel">
-                  <span class="pulse-dot"></span>
-                  <span class="progress-text">{{ currentProgressLabel }}</span>
-                </div>
+          <div class="monitor-top">
+            <div class="monitor-brand">Agent Display Surface</div>
+            <div class="status-pill-group">
+              <div class="status-pill">{{ statusLabel }}</div>
+              <div class="progress-pill" v-if="currentProgressLabel">
+                <span class="pulse-dot"></span>
+                <span class="progress-text">{{ currentProgressLabel }}</span>
               </div>
             </div>
+          </div>
           <div class="monitor-screen" ref="screenEl">
             <div class="desktop-layer">
               <div class="desktop-section apps">
@@ -167,11 +167,19 @@
               </div>
               <div class="wait-body">
                 <div class="flip-clock" ref="waitDisplay">
-                  <div class="flip-digit" data-value="0"><span class="top">0</span><span class="bottom">0</span></div>
-                  <div class="flip-digit" data-value="0"><span class="top">0</span><span class="bottom">0</span></div>
+                  <div class="flip-digit" data-value="0">
+                    <span class="top">0</span><span class="bottom">0</span>
+                  </div>
+                  <div class="flip-digit" data-value="0">
+                    <span class="top">0</span><span class="bottom">0</span>
+                  </div>
                   <div class="flip-separator">:</div>
-                  <div class="flip-digit" data-value="0"><span class="top">0</span><span class="bottom">0</span></div>
-                  <div class="flip-digit" data-value="0"><span class="top">0</span><span class="bottom">0</span></div>
+                  <div class="flip-digit" data-value="0">
+                    <span class="top">0</span><span class="bottom">0</span>
+                  </div>
+                  <div class="flip-digit" data-value="0">
+                    <span class="top">0</span><span class="bottom">0</span>
+                  </div>
                 </div>
               </div>
             </div>
@@ -297,21 +305,21 @@ const bubbleIconSlot = ref<HTMLElement | null>(null);
 const bubbleTextSlot = ref<HTMLElement | null>(null);
 const mousePointer = ref<HTMLElement | null>(null);
 
-const mouseIcon = new URL('../../icons/mouse-pointer-2.svg', import.meta.url).href;
+const mouseIcon = new URL('../../../icons/mouse-pointer-2.svg', import.meta.url).href;
 
 const assets = {
-  brainIcon: new URL('../../icons/brain.svg', import.meta.url).href,
-  folderIcon: new URL('../../icons/folder.svg', import.meta.url).href,
-  folderOpenIcon: new URL('../../icons/folder-open.svg', import.meta.url).href,
-  fileIcon: new URL('../../icons/file.svg', import.meta.url).href,
+  brainIcon: new URL('../../../icons/brain.svg', import.meta.url).href,
+  folderIcon: new URL('../../../icons/folder.svg', import.meta.url).href,
+  folderOpenIcon: new URL('../../../icons/folder-open.svg', import.meta.url).href,
+  fileIcon: new URL('../../../icons/file.svg', import.meta.url).href,
   apps: {
-    browser: new URL('../../icons/globe.svg', import.meta.url).href,
-    terminal: new URL('../../icons/laptop.svg', import.meta.url).href,
-    command: new URL('../../icons/terminal.svg', import.meta.url).href,
-    python: new URL('../../icons/python.svg', import.meta.url).href,
-    memory: new URL('../../icons/sticky-note.svg', import.meta.url).href,
-    todo: new URL('../../icons/clipboard.svg', import.meta.url).href,
-    subagent: new URL('../../icons/bot.svg', import.meta.url).href
+    browser: new URL('../../../icons/globe.svg', import.meta.url).href,
+    terminal: new URL('../../../icons/laptop.svg', import.meta.url).href,
+    command: new URL('../../../icons/terminal.svg', import.meta.url).href,
+    python: new URL('../../../icons/python.svg', import.meta.url).href,
+    memory: new URL('../../../icons/sticky-note.svg', import.meta.url).href,
+    todo: new URL('../../../icons/clipboard.svg', import.meta.url).href,
+    subagent: new URL('../../../icons/bot.svg', import.meta.url).href
   }
 };
 
@@ -398,7 +406,7 @@ onMounted(() => {
 // 监听桌面根目录变化，确保文件/文件夹实时渲染（包括刷新后首帧）
 watch(
   lastTreeSnapshot,
-  roots => {
+  (roots) => {
     if (director.value && Array.isArray(roots)) {
       director.value.setDesktopRoots(roots, { immediate: true });
     }
diff --git a/static/src/components/chat/actions/ActionSummary.vue b/static/src/components/chat/actions/ActionSummary.vue
index 23ffbb2..2a8d3af 100644
--- a/static/src/components/chat/actions/ActionSummary.vue
+++ b/static/src/components/chat/actions/ActionSummary.vue
@@ -1,7 +1,11 @@
 <template>
   <div class="action-summary">
     <div class="summary-header icon-label">
-      <span class="icon icon-sm" :style="iconStyle(action.type === 'apply' ? 'pencil' : 'clipboard')" aria-hidden="true"></span>
+      <span
+        class="icon icon-sm"
+        :style="iconStyle(action.type === 'apply' ? 'pencil' : 'clipboard')"
+        aria-hidden="true"
+      ></span>
       <span>{{ action.title || (action.type === 'apply' ? '应用修改' : '追加内容') }}</span>
     </div>
     <div class="summary-content" v-if="action.content">
@@ -9,9 +13,30 @@
     </div>
     <div class="summary-actions">
       <button type="button" class="ghost" @click="$emit('copy', action, blockId)">复制</button>
-      <button type="button" class="ghost" v-if="action.type === 'apply'" @click="$emit('apply', action, blockId)">应用</button>
-      <button type="button" class="ghost" v-if="action.type === 'append'" @click="$emit('run', action, blockId)">执行</button>
-      <button v-if="action.path" type="button" class="ghost" @click="$emit('download', action.path)">下载文件</button>
+      <button
+        type="button"
+        class="ghost"
+        v-if="action.type === 'apply'"
+        @click="$emit('apply', action, blockId)"
+      >
+        应用
+      </button>
+      <button
+        type="button"
+        class="ghost"
+        v-if="action.type === 'append'"
+        @click="$emit('run', action, blockId)"
+      >
+        执行
+      </button>
+      <button
+        v-if="action.path"
+        type="button"
+        class="ghost"
+        @click="$emit('download', action.path)"
+      >
+        下载文件
+      </button>
     </div>
   </div>
 </template>
diff --git a/static/src/components/chat/actions/AppendPayloadAction.vue b/static/src/components/chat/actions/AppendPayloadAction.vue
index aa1ee79..a3c7453 100644
--- a/static/src/components/chat/actions/AppendPayloadAction.vue
+++ b/static/src/components/chat/actions/AppendPayloadAction.vue
@@ -15,8 +15,12 @@
       </template>
       <div class="append-meta" v-if="action.append">
         <span v-if="action.append.path">{{ action.append.path }}</span>
-        <span v-if="action.append.lines !== null && action.append.lines !== undefined">· 行数 {{ action.append.lines }}</span>
-        <span v-if="action.append.bytes !== null && action.append.bytes !== undefined">· 字节 {{ action.append.bytes }}</span>
+        <span v-if="action.append.lines !== null && action.append.lines !== undefined"
+          >· 行数 {{ action.append.lines }}</span
+        >
+        <span v-if="action.append.bytes !== null && action.append.bytes !== undefined"
+          >· 字节 {{ action.append.bytes }}</span
+        >
       </div>
       <div class="append-warning icon-label" v-if="action.append?.forced">
         <span class="icon icon-sm" :style="iconStyle('triangleAlert')" aria-hidden="true"></span>
diff --git a/static/src/components/chat/actions/ModifyDetailsAction.vue b/static/src/components/chat/actions/ModifyDetailsAction.vue
index c2f945d..2304509 100644
--- a/static/src/components/chat/actions/ModifyDetailsAction.vue
+++ b/static/src/components/chat/actions/ModifyDetailsAction.vue
@@ -18,9 +18,15 @@
           <pre class="entry-content">{{ entry.content }}</pre>
         </div>
         <div class="modify-meta" v-if="action.modify">
-          <span v-if="action.modify.total !== null && action.modify.total !== undefined">· 共 {{ action.modify.total }} 处</span>
-          <span v-if="action.modify.completed && action.modify.completed.length">· 已完成 {{ action.modify.completed.length }} 处</span>
-          <span v-if="action.modify.failed && action.modify.failed.length">· 未完成 {{ action.modify.failed.length }} 处</span>
+          <span v-if="action.modify.total !== null && action.modify.total !== undefined"
+            >· 共 {{ action.modify.total }} 处</span
+          >
+          <span v-if="action.modify.completed && action.modify.completed.length"
+            >· 已完成 {{ action.modify.completed.length }} 处</span
+          >
+          <span v-if="action.modify.failed && action.modify.failed.length"
+            >· 未完成 {{ action.modify.failed.length }} 处</span
+          >
         </div>
         <div class="modify-warning icon-label" v-if="action.modify?.forced">
           <span class="icon icon-sm" :style="iconStyle('triangleAlert')" aria-hidden="true"></span>
diff --git a/static/src/components/chat/actions/ModifySummaryAction.vue b/static/src/components/chat/actions/ModifySummaryAction.vue
index 2578e2c..92b70e2 100644
--- a/static/src/components/chat/actions/ModifySummaryAction.vue
+++ b/static/src/components/chat/actions/ModifySummaryAction.vue
@@ -7,8 +7,12 @@
       </div>
       <div class="modify-meta" v-if="action.modify">
         <span v-if="action.modify.total">· 共 {{ action.modify.total }} 处</span>
-        <span v-if="action.modify.completed">· 完成 {{ action.modify.completed.length || action.modify.completed }} 处</span>
-        <span v-if="action.modify.failed">· 未完成 {{ action.modify.failed.length || action.modify.failed }} 处</span>
+        <span v-if="action.modify.completed"
+          >· 完成 {{ action.modify.completed.length || action.modify.completed }} 处</span
+        >
+        <span v-if="action.modify.failed"
+          >· 未完成 {{ action.modify.failed.length || action.modify.failed }} 处</span
+        >
       </div>
       <div class="modify-warning icon-label" v-if="action.modify?.forced">
         <span class="icon icon-sm" :style="iconStyle('triangleAlert')" aria-hidden="true"></span>
diff --git a/static/src/components/chat/actions/ThinkingAction.vue b/static/src/components/chat/actions/ThinkingAction.vue
index 4b95566..0aeb10e 100644
--- a/static/src/components/chat/actions/ThinkingAction.vue
+++ b/static/src/components/chat/actions/ThinkingAction.vue
@@ -12,9 +12,9 @@
     <div class="collapsible-content">
       <div
         class="content-inner thinking-content"
-        :ref="el => setRef(blockId, el)"
-        @scroll="event => handleScroll(blockId, event)"
-        style="max-height: 240px; overflow-y: auto;"
+        :ref="(el) => setRef(blockId, el)"
+        @scroll="(event) => handleScroll(blockId, event)"
+        style="max-height: 240px; overflow-y: auto"
       >
         {{ action.content }}
       </div>
diff --git a/static/src/components/chat/actions/ToolAction.vue b/static/src/components/chat/actions/ToolAction.vue
index 5f36480..46f62ef 100644
--- a/static/src/components/chat/actions/ToolAction.vue
+++ b/static/src/components/chat/actions/ToolAction.vue
@@ -22,7 +22,11 @@
     </div>
     <div
       class="collapsible-content"
-      :ref="el => registerCollapseContent && registerCollapseContent(collapseKey || action.tool.id || action.id || 'tool', el)"
+      :ref="
+        (el) =>
+          registerCollapseContent &&
+          registerCollapseContent(collapseKey || action.tool.id || action.id || 'tool', el)
+      "
     >
       <div class="content-inner">
         <div v-if="shouldUseEnhancedDisplay" v-html="renderEnhancedToolResult()"></div>
@@ -80,7 +84,7 @@ function formatBytes(bytes: number): string {
   const k = 1024;
   const sizes = ['B', 'KB', 'MB', 'GB'];
   const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return Math.round(bytes / Math.pow(k, i) * 100) / 100 + ' ' + sizes[i];
+  return Math.round((bytes / Math.pow(k, i)) * 100) / 100 + ' ' + sizes[i];
 }
 
 function renderEnhancedToolResult(): string {
@@ -255,10 +259,13 @@ function renderWriteFile(result: any, args: any): string {
   if (isAppend) {
     html += `<div><strong>模式：</strong>追加</div>`;
   }
+  if (!result.success && result.error) {
+    html += `<div><strong>错误：</strong>${escapeHtml(String(result.error))}</div>`;
+  }
   html += '</div>';
 
   // 显示写入的内容
-  if (content) {
+  if (result.success && content) {
     html += '<div class="tool-result-diff scrollable">';
     const lines = content.split('\n');
     lines.forEach((line: string) => {
@@ -284,8 +291,15 @@ function renderEditFile(result: any, args: any): string {
   let html = '<div class="tool-result-meta">';
   html += `<div><strong>路径：</strong>${escapeHtml(path)}</div>`;
   html += `<div><strong>状态：</strong>${status}</div>`;
+  if (!result.success && result.error) {
+    html += `<div><strong>错误：</strong>${escapeHtml(String(result.error))}</div>`;
+  }
   html += '</div>';
 
+  if (!result.success) {
+    return html;
+  }
+
   // 如果有 replacements 数组，使用新格式
   if (replacements.length > 0) {
     html += '<div class="tool-result-diff scrollable">';
@@ -689,7 +703,7 @@ function renderTodoCreate(result: any, args: any): string {
     html += '<div class="tool-result-content">';
     html += '<div class="todo-list">';
     tasks.forEach((task: any) => {
-      const taskText = typeof task === 'string' ? task : (task.text || task.title || '');
+      const taskText = typeof task === 'string' ? task : task.text || task.title || '';
       html += `<div class="todo-item"><input type="checkbox" disabled /> ${escapeHtml(taskText)}</div>`;
     });
     html += '</div>';
@@ -713,7 +727,7 @@ function renderTodoUpdate(result: any, args: any): string {
     html += '<div class="tool-result-content">';
     html += '<div class="todo-list">';
     tasks.forEach((task: any) => {
-      const taskText = typeof task === 'string' ? task : (task.text || task.title || '');
+      const taskText = typeof task === 'string' ? task : task.text || task.title || '';
       const completed = typeof task === 'object' && (task.completed || task.done || task.checked);
       html += `<div class="todo-item"><input type="checkbox" ${completed ? 'checked' : ''} disabled /> ${escapeHtml(taskText)}</div>`;
     });
@@ -989,7 +1003,7 @@ function renderEasterEgg(result: any, args: any): string {
   gap: 8px;
 }
 
-.todo-item input[type="checkbox"] {
+.todo-item input[type='checkbox'] {
   margin: 0;
 }
 
diff --git a/static/src/components/chat/actions/toolRenderers.ts b/static/src/components/chat/actions/toolRenderers.ts
index 7b9b62b..7a65699 100644
--- a/static/src/components/chat/actions/toolRenderers.ts
+++ b/static/src/components/chat/actions/toolRenderers.ts
@@ -11,7 +11,7 @@ export function formatBytes(bytes: number): string {
   const k = 1024;
   const sizes = ['B', 'KB', 'MB', 'GB'];
   const i = Math.floor(Math.log(bytes) / Math.log(k));
-  return Math.round(bytes / Math.pow(k, i) * 100) / 100 + ' ' + sizes[i];
+  return Math.round((bytes / Math.pow(k, i)) * 100) / 100 + ' ' + sizes[i];
 }
 
 export function renderEnhancedToolResult(
@@ -89,7 +89,7 @@ export function renderEnhancedToolResult(
   else if (name === 'todo_create') {
     return renderTodoCreate(result, args);
   } else if (name === 'todo_update_task') {
-    return renderTodoUpdate(result, args);
+    return renderTodoUpdate(result);
   }
 
   // 彩蛋类
@@ -200,10 +200,13 @@ function renderWriteFile(result: any, args: any): string {
   if (isAppend) {
     html += `<div><strong>模式：</strong>追加</div>`;
   }
+  if (!result.success && result.error) {
+    html += `<div><strong>错误：</strong>${escapeHtml(String(result.error))}</div>`;
+  }
   html += '</div>';
 
   // 显示写入的内容
-  if (content) {
+  if (result.success && content) {
     html += '<div class="tool-result-diff scrollable">';
     const lines = content.split('\n');
     lines.forEach((line: string) => {
@@ -229,8 +232,15 @@ function renderEditFile(result: any, args: any): string {
   let html = '<div class="tool-result-meta">';
   html += `<div><strong>路径：</strong>${escapeHtml(path)}</div>`;
   html += `<div><strong>状态：</strong>${status}</div>`;
+  if (!result.success && result.error) {
+    html += `<div><strong>错误：</strong>${escapeHtml(String(result.error))}</div>`;
+  }
   html += '</div>';
 
+  if (!result.success) {
+    return html;
+  }
+
   // 如果有 replacements 数组，使用新格式
   if (replacements.length > 0) {
     html += '<div class="tool-result-diff scrollable">';
@@ -618,7 +628,8 @@ function renderTodoCreate(result: any, args: any): string {
     html += '<div class="tool-result-content">';
     html += '<div class="todo-list">';
     tasks.forEach((task: any) => {
-      const taskText = typeof task === 'string' ? task : (task.text || task.title || task.content || '');
+      const taskText =
+        typeof task === 'string' ? task : task.text || task.title || task.content || '';
       html += `<div class="todo-item"><input type="checkbox" disabled /> ${escapeHtml(taskText)}</div>`;
     });
     html += '</div>';
@@ -628,7 +639,7 @@ function renderTodoCreate(result: any, args: any): string {
   return html;
 }
 
-function renderTodoUpdate(result: any, args: any): string {
+function renderTodoUpdate(result: any): string {
   const status = result.success ? '✓ 已更新' : '✗ 失败';
   const todoList = result.todo_list || {};
   const title = todoList.title || '';
@@ -643,8 +654,11 @@ function renderTodoUpdate(result: any, args: any): string {
     html += '<div class="tool-result-content">';
     html += '<div class="todo-list">';
     tasks.forEach((task: any) => {
-      const taskText = typeof task === 'string' ? task : (task.text || task.title || task.content || '');
-      const completed = typeof task === 'object' && (task.status === 'done' || task.completed || task.done || task.checked);
+      const taskText =
+        typeof task === 'string' ? task : task.text || task.title || task.content || '';
+      const completed =
+        typeof task === 'object' &&
+        (task.status === 'done' || task.completed || task.done || task.checked);
       html += `<div class="todo-item"><input type="checkbox" ${completed ? 'checked' : ''} disabled /> ${escapeHtml(taskText)}</div>`;
     });
     html += '</div>';
diff --git a/static/src/components/chat/loaders/BouncingSquaresLoader.vue b/static/src/components/chat/loaders/BouncingSquaresLoader.vue
index 3eee72a..6e9c4c4 100644
--- a/static/src/components/chat/loaders/BouncingSquaresLoader.vue
+++ b/static/src/components/chat/loaders/BouncingSquaresLoader.vue
@@ -14,7 +14,7 @@
 .bouncing-squares-loader {
   --loader-scale: 0.45;
   --square-size: 7.6px; /* 7.6 * 0.45 ≈ 3.42px，略大一点 */
-  --square-gap: 8.9px;  /* 固定间距，缩放后约 4px */
+  --square-gap: 8.9px; /* 固定间距，缩放后约 4px */
   --start-x: 3px;
   position: relative;
   width: 40px;
diff --git a/static/src/components/chat/loaders/ChaoticOrbitSquaresLoader.vue b/static/src/components/chat/loaders/ChaoticOrbitSquaresLoader.vue
index 78913b6..5f13488 100644
--- a/static/src/components/chat/loaders/ChaoticOrbitSquaresLoader.vue
+++ b/static/src/components/chat/loaders/ChaoticOrbitSquaresLoader.vue
@@ -21,7 +21,7 @@
 
 .chaotic-orbit-loader::before,
 .chaotic-orbit-loader::after {
-  content: "";
+  content: '';
   position: absolute;
   width: 3px;
   height: 3px;
@@ -29,16 +29,42 @@
   will-change: transform;
 }
 
-.chaotic-orbit-loader::before { animation: orbit var(--speed) linear infinite; }
-.chaotic-orbit-loader::after { animation: orbit var(--speed) linear calc(var(--speed) / -2) infinite; }
+.chaotic-orbit-loader::before {
+  animation: orbit var(--speed) linear infinite;
+}
+.chaotic-orbit-loader::after {
+  animation: orbit var(--speed) linear calc(var(--speed) / -2) infinite;
+}
 
-@keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
+@keyframes rotate {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}
 
 @keyframes orbit {
-  0% { transform: translate(12px) scale(.74); opacity:.65; }
-  25% { transform: translate(0) scale(.47); opacity:.3; }
-  50% { transform: translate(-12px) scale(.74); opacity:.65; }
-  75% { transform: translate(0) scale(1); opacity:1; }
-  100% { transform: translate(12px) scale(.74); opacity:.65; }
+  0% {
+    transform: translate(12px) scale(0.74);
+    opacity: 0.65;
+  }
+  25% {
+    transform: translate(0) scale(0.47);
+    opacity: 0.3;
+  }
+  50% {
+    transform: translate(-12px) scale(0.74);
+    opacity: 0.65;
+  }
+  75% {
+    transform: translate(0) scale(1);
+    opacity: 1;
+  }
+  100% {
+    transform: translate(12px) scale(0.74);
+    opacity: 0.65;
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/DotSpinnerSquaresLoader.vue b/static/src/components/chat/loaders/DotSpinnerSquaresLoader.vue
index 817169f..12a8d3a 100644
--- a/static/src/components/chat/loaders/DotSpinnerSquaresLoader.vue
+++ b/static/src/components/chat/loaders/DotSpinnerSquaresLoader.vue
@@ -18,7 +18,7 @@
 <style scoped>
 .dot-spinner-loader {
   --size: 22px;
-  --speed: .9s;
+  --speed: 0.9s;
   position: relative;
   display: flex;
   align-items: center;
@@ -39,32 +39,67 @@
 }
 
 .dot::before {
-  content: "";
+  content: '';
   width: 3px;
   height: 3px;
   background: var(--claude-text-tertiary);
   transform: scale(0);
-  opacity: .5;
+  opacity: 0.5;
   animation: pulse calc(var(--speed) * 1.111) ease-in-out infinite;
 }
 
-.dot:nth-child(2) { transform: rotate(45deg); }
-.dot:nth-child(2)::before { animation-delay: calc(var(--speed) * -0.875); }
-.dot:nth-child(3) { transform: rotate(90deg); }
-.dot:nth-child(3)::before { animation-delay: calc(var(--speed) * -0.75); }
-.dot:nth-child(4) { transform: rotate(135deg); }
-.dot:nth-child(4)::before { animation-delay: calc(var(--speed) * -0.625); }
-.dot:nth-child(5) { transform: rotate(180deg); }
-.dot:nth-child(5)::before { animation-delay: calc(var(--speed) * -0.5); }
-.dot:nth-child(6) { transform: rotate(225deg); }
-.dot:nth-child(6)::before { animation-delay: calc(var(--speed) * -0.375); }
-.dot:nth-child(7) { transform: rotate(270deg); }
-.dot:nth-child(7)::before { animation-delay: calc(var(--speed) * -0.25); }
-.dot:nth-child(8) { transform: rotate(315deg); }
-.dot:nth-child(8)::before { animation-delay: calc(var(--speed) * -0.125); }
+.dot:nth-child(2) {
+  transform: rotate(45deg);
+}
+.dot:nth-child(2)::before {
+  animation-delay: calc(var(--speed) * -0.875);
+}
+.dot:nth-child(3) {
+  transform: rotate(90deg);
+}
+.dot:nth-child(3)::before {
+  animation-delay: calc(var(--speed) * -0.75);
+}
+.dot:nth-child(4) {
+  transform: rotate(135deg);
+}
+.dot:nth-child(4)::before {
+  animation-delay: calc(var(--speed) * -0.625);
+}
+.dot:nth-child(5) {
+  transform: rotate(180deg);
+}
+.dot:nth-child(5)::before {
+  animation-delay: calc(var(--speed) * -0.5);
+}
+.dot:nth-child(6) {
+  transform: rotate(225deg);
+}
+.dot:nth-child(6)::before {
+  animation-delay: calc(var(--speed) * -0.375);
+}
+.dot:nth-child(7) {
+  transform: rotate(270deg);
+}
+.dot:nth-child(7)::before {
+  animation-delay: calc(var(--speed) * -0.25);
+}
+.dot:nth-child(8) {
+  transform: rotate(315deg);
+}
+.dot:nth-child(8)::before {
+  animation-delay: calc(var(--speed) * -0.125);
+}
 
 @keyframes pulse {
-  0%, 100% { transform: scale(0); opacity: .5; }
-  50% { transform: scale(1); opacity: 1; }
+  0%,
+  100% {
+    transform: scale(0);
+    opacity: 0.5;
+  }
+  50% {
+    transform: scale(1);
+    opacity: 1;
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/DualChaseLoader.vue b/static/src/components/chat/loaders/DualChaseLoader.vue
index f2bb5fa..3a65a76 100644
--- a/static/src/components/chat/loaders/DualChaseLoader.vue
+++ b/static/src/components/chat/loaders/DualChaseLoader.vue
@@ -18,7 +18,7 @@
 .dual-chase-loader::before {
   box-sizing: border-box;
   position: absolute;
-  content: "";
+  content: '';
   width: var(--size);
   height: var(--size);
   top: 50%;
@@ -34,7 +34,8 @@
 }
 
 @keyframes chase-down {
-  0%, 100% {
+  0%,
+  100% {
     transform: none;
   }
 
@@ -52,7 +53,8 @@
 }
 
 @keyframes chase-up {
-  0%, 100% {
+  0%,
+  100% {
     transform: none;
   }
 
diff --git a/static/src/components/chat/loaders/FiveSquaresLoader.vue b/static/src/components/chat/loaders/FiveSquaresLoader.vue
index ee202d8..7cbce6c 100644
--- a/static/src/components/chat/loaders/FiveSquaresLoader.vue
+++ b/static/src/components/chat/loaders/FiveSquaresLoader.vue
@@ -60,48 +60,142 @@
 }
 
 @keyframes square1 {
-  0% { left: 0; top: 0; }
-  8.33% { left: 0; top: var(--offset); }
-  100% { left: 0; top: var(--offset); }
+  0% {
+    left: 0;
+    top: 0;
+  }
+  8.33% {
+    left: 0;
+    top: var(--offset);
+  }
+  100% {
+    left: 0;
+    top: var(--offset);
+  }
 }
 
 @keyframes square2 {
-  0% { left: 0; top: var(--offset); }
-  8.33% { left: 0; top: calc(2 * var(--offset)); }
-  16.67% { left: var(--offset); top: calc(2 * var(--offset)); }
-  25% { left: var(--offset); top: var(--offset); }
-  83.33% { left: var(--offset); top: var(--offset); }
-  91.67% { left: var(--offset); top: 0; }
-  100% { left: 0; top: 0; }
+  0% {
+    left: 0;
+    top: var(--offset);
+  }
+  8.33% {
+    left: 0;
+    top: calc(2 * var(--offset));
+  }
+  16.67% {
+    left: var(--offset);
+    top: calc(2 * var(--offset));
+  }
+  25% {
+    left: var(--offset);
+    top: var(--offset);
+  }
+  83.33% {
+    left: var(--offset);
+    top: var(--offset);
+  }
+  91.67% {
+    left: var(--offset);
+    top: 0;
+  }
+  100% {
+    left: 0;
+    top: 0;
+  }
 }
 
 @keyframes square3 {
-  0%, 100% { left: var(--offset); top: var(--offset); }
-  16.67% { left: var(--offset); top: var(--offset); }
-  25% { left: var(--offset); top: 0; }
-  33.33% { left: calc(2 * var(--offset)); top: 0; }
-  41.67% { left: calc(2 * var(--offset)); top: var(--offset); }
-  66.67% { left: calc(2 * var(--offset)); top: var(--offset); }
-  75% { left: calc(2 * var(--offset)); top: calc(2 * var(--offset)); }
-  83.33% { left: var(--offset); top: calc(2 * var(--offset)); }
-  91.67% { left: var(--offset); top: var(--offset); }
+  0%,
+  100% {
+    left: var(--offset);
+    top: var(--offset);
+  }
+  16.67% {
+    left: var(--offset);
+    top: var(--offset);
+  }
+  25% {
+    left: var(--offset);
+    top: 0;
+  }
+  33.33% {
+    left: calc(2 * var(--offset));
+    top: 0;
+  }
+  41.67% {
+    left: calc(2 * var(--offset));
+    top: var(--offset);
+  }
+  66.67% {
+    left: calc(2 * var(--offset));
+    top: var(--offset);
+  }
+  75% {
+    left: calc(2 * var(--offset));
+    top: calc(2 * var(--offset));
+  }
+  83.33% {
+    left: var(--offset);
+    top: calc(2 * var(--offset));
+  }
+  91.67% {
+    left: var(--offset);
+    top: var(--offset);
+  }
 }
 
 @keyframes square4 {
-  0% { left: calc(2 * var(--offset)); top: var(--offset); }
-  33.33% { left: calc(2 * var(--offset)); top: var(--offset); }
-  41.67% { left: calc(2 * var(--offset)); top: calc(2 * var(--offset)); }
-  50% { left: calc(3 * var(--offset)); top: calc(2 * var(--offset)); }
-  58.33% { left: calc(3 * var(--offset)); top: var(--offset); }
-  100% { left: calc(3 * var(--offset)); top: var(--offset); }
+  0% {
+    left: calc(2 * var(--offset));
+    top: var(--offset);
+  }
+  33.33% {
+    left: calc(2 * var(--offset));
+    top: var(--offset);
+  }
+  41.67% {
+    left: calc(2 * var(--offset));
+    top: calc(2 * var(--offset));
+  }
+  50% {
+    left: calc(3 * var(--offset));
+    top: calc(2 * var(--offset));
+  }
+  58.33% {
+    left: calc(3 * var(--offset));
+    top: var(--offset);
+  }
+  100% {
+    left: calc(3 * var(--offset));
+    top: var(--offset);
+  }
 }
 
 @keyframes square5 {
-  0% { left: calc(3 * var(--offset)); top: var(--offset); }
-  50% { left: calc(3 * var(--offset)); top: var(--offset); }
-  58.33% { left: calc(3 * var(--offset)); top: 0; }
-  66.67% { left: calc(2 * var(--offset)); top: 0; }
-  75% { left: calc(2 * var(--offset)); top: var(--offset); }
-  100% { left: calc(2 * var(--offset)); top: var(--offset); }
+  0% {
+    left: calc(3 * var(--offset));
+    top: var(--offset);
+  }
+  50% {
+    left: calc(3 * var(--offset));
+    top: var(--offset);
+  }
+  58.33% {
+    left: calc(3 * var(--offset));
+    top: 0;
+  }
+  66.67% {
+    left: calc(2 * var(--offset));
+    top: 0;
+  }
+  75% {
+    left: calc(2 * var(--offset));
+    top: var(--offset);
+  }
+  100% {
+    left: calc(2 * var(--offset));
+    top: var(--offset);
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/FollowTrackSquaresLoader.vue b/static/src/components/chat/loaders/FollowTrackSquaresLoader.vue
index e5a867a..a4a5d94 100644
--- a/static/src/components/chat/loaders/FollowTrackSquaresLoader.vue
+++ b/static/src/components/chat/loaders/FollowTrackSquaresLoader.vue
@@ -29,14 +29,34 @@
   animation: follow-track 1.25s infinite;
 }
 
-.sq:nth-child(1) { top: 0; animation-delay: 0.15s; }
-.sq:nth-child(2) { top: 5px; animation-delay: 0.3s; }
-.sq:nth-child(3) { top: 10px; animation-delay: 0.45s; }
-.sq:nth-child(4) { top: 15px; animation-delay: 0.6s; }
-.sq:nth-child(5) { top: 20px; animation-delay: 0.75s; }
+.sq:nth-child(1) {
+  top: 0;
+  animation-delay: 0.15s;
+}
+.sq:nth-child(2) {
+  top: 5px;
+  animation-delay: 0.3s;
+}
+.sq:nth-child(3) {
+  top: 10px;
+  animation-delay: 0.45s;
+}
+.sq:nth-child(4) {
+  top: 15px;
+  animation-delay: 0.6s;
+}
+.sq:nth-child(5) {
+  top: 20px;
+  animation-delay: 0.75s;
+}
 
 @keyframes follow-track {
-  0% { transform: rotate(0deg) translateY(-4px); }
-  60%, 100% { transform: rotate(360deg) translateY(-4px); }
+  0% {
+    transform: rotate(0deg) translateY(-4px);
+  }
+  60%,
+  100% {
+    transform: rotate(360deg) translateY(-4px);
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/FourCornerCycleSquaresLoader.vue b/static/src/components/chat/loaders/FourCornerCycleSquaresLoader.vue
index 74329e8..3ba4d02 100644
--- a/static/src/components/chat/loaders/FourCornerCycleSquaresLoader.vue
+++ b/static/src/components/chat/loaders/FourCornerCycleSquaresLoader.vue
@@ -30,15 +30,32 @@
   animation: corner-cycle 1.8s ease-in-out infinite;
 }
 
-.sq:nth-child(1) { animation-delay: -0.45s; }
-.sq:nth-child(2) { animation-delay: -0.9s; }
-.sq:nth-child(3) { animation-delay: -1.35s; }
-.sq:nth-child(4) { animation-delay: -1.8s; }
+.sq:nth-child(1) {
+  animation-delay: -0.45s;
+}
+.sq:nth-child(2) {
+  animation-delay: -0.9s;
+}
+.sq:nth-child(3) {
+  animation-delay: -1.35s;
+}
+.sq:nth-child(4) {
+  animation-delay: -1.8s;
+}
 
 @keyframes corner-cycle {
-  0%, 100% { transform: translate(-6px, -6px); }
-  25% { transform: translate(6px, -6px); }
-  50% { transform: translate(6px, 6px); }
-  75% { transform: translate(-6px, 6px); }
+  0%,
+  100% {
+    transform: translate(-6px, -6px);
+  }
+  25% {
+    transform: translate(6px, -6px);
+  }
+  50% {
+    transform: translate(6px, 6px);
+  }
+  75% {
+    transform: translate(-6px, 6px);
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/JumpingSequenceSquaresLoader.vue b/static/src/components/chat/loaders/JumpingSequenceSquaresLoader.vue
index 0d048c0..8175096 100644
--- a/static/src/components/chat/loaders/JumpingSequenceSquaresLoader.vue
+++ b/static/src/components/chat/loaders/JumpingSequenceSquaresLoader.vue
@@ -26,13 +26,26 @@
   animation: jump 2s ease infinite;
 }
 
-.sq:nth-child(2n) { animation-delay: 300ms; }
-.sq:nth-child(3n) { animation-delay: 600ms; }
+.sq:nth-child(2n) {
+  animation-delay: 300ms;
+}
+.sq:nth-child(3n) {
+  animation-delay: 600ms;
+}
 
 @keyframes jump {
-  0%, 100% { transform: translateY(0); }
-  25% { transform: translateY(-10px) scale(0.66); }
-  50% { transform: translateY(0); }
-  75% { transform: translateY(3px) scale(0.9); }
+  0%,
+  100% {
+    transform: translateY(0);
+  }
+  25% {
+    transform: translateY(-10px) scale(0.66);
+  }
+  50% {
+    transform: translateY(0);
+  }
+  75% {
+    transform: translateY(3px) scale(0.9);
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/LeapFrogSquaresLoader.vue b/static/src/components/chat/loaders/LeapFrogSquaresLoader.vue
index 24187d0..5c46592 100644
--- a/static/src/components/chat/loaders/LeapFrogSquaresLoader.vue
+++ b/static/src/components/chat/loaders/LeapFrogSquaresLoader.vue
@@ -35,7 +35,7 @@
 }
 
 .dot::before {
-  content: "";
+  content: '';
   width: 3px;
   height: 3px;
   background: var(--claude-text-tertiary);
@@ -52,10 +52,20 @@
 }
 
 @keyframes leap {
-  0% { transform: translateX(0) rotate(0deg); }
-  33.333% { transform: translateX(0) rotate(180deg); }
-  66.666% { transform: translateX(calc(var(--size) * -0.4)) rotate(180deg); }
-  99.999% { transform: translateX(calc(var(--size) * -0.8)) rotate(180deg); }
-  100% { transform: translateX(0) rotate(0deg); }
+  0% {
+    transform: translateX(0) rotate(0deg);
+  }
+  33.333% {
+    transform: translateX(0) rotate(180deg);
+  }
+  66.666% {
+    transform: translateX(calc(var(--size) * -0.4)) rotate(180deg);
+  }
+  99.999% {
+    transform: translateX(calc(var(--size) * -0.8)) rotate(180deg);
+  }
+  100% {
+    transform: translateX(0) rotate(0deg);
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/NewtonCradleSquaresLoader.vue b/static/src/components/chat/loaders/NewtonCradleSquaresLoader.vue
index d3e3efc..4a6cdb8 100644
--- a/static/src/components/chat/loaders/NewtonCradleSquaresLoader.vue
+++ b/static/src/components/chat/loaders/NewtonCradleSquaresLoader.vue
@@ -31,7 +31,7 @@
 }
 
 .dot::after {
-  content: "";
+  content: '';
   position: absolute;
   top: 75%;
   width: 3px;
@@ -48,14 +48,32 @@
 }
 
 @keyframes swing {
-  0% { transform: rotate(0deg); animation-timing-function: ease-out; }
-  25% { transform: rotate(70deg); animation-timing-function: ease-in; }
-  50% { transform: rotate(0deg); animation-timing-function: linear; }
+  0% {
+    transform: rotate(0deg);
+    animation-timing-function: ease-out;
+  }
+  25% {
+    transform: rotate(70deg);
+    animation-timing-function: ease-in;
+  }
+  50% {
+    transform: rotate(0deg);
+    animation-timing-function: linear;
+  }
 }
 
 @keyframes swing2 {
-  0% { transform: rotate(0deg); animation-timing-function: linear; }
-  50% { transform: rotate(0deg); animation-timing-function: ease-out; }
-  75% { transform: rotate(-70deg); animation-timing-function: ease-in; }
+  0% {
+    transform: rotate(0deg);
+    animation-timing-function: linear;
+  }
+  50% {
+    transform: rotate(0deg);
+    animation-timing-function: ease-out;
+  }
+  75% {
+    transform: rotate(-70deg);
+    animation-timing-function: ease-in;
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/NineGridLoader.vue b/static/src/components/chat/loaders/NineGridLoader.vue
index 81294c2..0e12476 100644
--- a/static/src/components/chat/loaders/NineGridLoader.vue
+++ b/static/src/components/chat/loaders/NineGridLoader.vue
@@ -32,7 +32,7 @@
 }
 
 .box:before {
-  content: "";
+  content: '';
   position: absolute;
   left: 0;
   top: 0;
@@ -59,139 +59,355 @@
   margin-bottom: 0;
 }
 
-.box:nth-child(1) { animation: moveBox-1 4s infinite; }
-.box:nth-child(2) { animation: moveBox-2 4s infinite; }
-.box:nth-child(3) { animation: moveBox-3 4s infinite; }
-.box:nth-child(4) { animation: moveBox-4 4s infinite; }
-.box:nth-child(5) { animation: moveBox-5 4s infinite; }
-.box:nth-child(6) { animation: moveBox-6 4s infinite; }
-.box:nth-child(7) { animation: moveBox-7 4s infinite; }
-.box:nth-child(8) { animation: moveBox-8 4s infinite; }
-.box:nth-child(9) { animation: moveBox-9 4s infinite; }
+.box:nth-child(1) {
+  animation: moveBox-1 4s infinite;
+}
+.box:nth-child(2) {
+  animation: moveBox-2 4s infinite;
+}
+.box:nth-child(3) {
+  animation: moveBox-3 4s infinite;
+}
+.box:nth-child(4) {
+  animation: moveBox-4 4s infinite;
+}
+.box:nth-child(5) {
+  animation: moveBox-5 4s infinite;
+}
+.box:nth-child(6) {
+  animation: moveBox-6 4s infinite;
+}
+.box:nth-child(7) {
+  animation: moveBox-7 4s infinite;
+}
+.box:nth-child(8) {
+  animation: moveBox-8 4s infinite;
+}
+.box:nth-child(9) {
+  animation: moveBox-9 4s infinite;
+}
 
 @keyframes moveBox-1 {
-  9% { transform: translate(-7px, 0); }
-  18% { transform: translate(0, 0); }
-  27% { transform: translate(0, 0); }
-  36% { transform: translate(7px, 0); }
-  45% { transform: translate(7px, 7px); }
-  54% { transform: translate(7px, 7px); }
-  63% { transform: translate(7px, 7px); }
-  72% { transform: translate(7px, 0); }
-  81% { transform: translate(0, 0); }
-  90% { transform: translate(-7px, 0); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(-7px, 0);
+  }
+  18% {
+    transform: translate(0, 0);
+  }
+  27% {
+    transform: translate(0, 0);
+  }
+  36% {
+    transform: translate(7px, 0);
+  }
+  45% {
+    transform: translate(7px, 7px);
+  }
+  54% {
+    transform: translate(7px, 7px);
+  }
+  63% {
+    transform: translate(7px, 7px);
+  }
+  72% {
+    transform: translate(7px, 0);
+  }
+  81% {
+    transform: translate(0, 0);
+  }
+  90% {
+    transform: translate(-7px, 0);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-2 {
-  9% { transform: translate(0, 0); }
-  18% { transform: translate(7px, 0); }
-  27% { transform: translate(0, 0); }
-  36% { transform: translate(7px, 0); }
-  45% { transform: translate(7px, 7px); }
-  54% { transform: translate(7px, 7px); }
-  63% { transform: translate(7px, 7px); }
-  72% { transform: translate(7px, 7px); }
-  81% { transform: translate(0, 7px); }
-  90% { transform: translate(0, 7px); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(0, 0);
+  }
+  18% {
+    transform: translate(7px, 0);
+  }
+  27% {
+    transform: translate(0, 0);
+  }
+  36% {
+    transform: translate(7px, 0);
+  }
+  45% {
+    transform: translate(7px, 7px);
+  }
+  54% {
+    transform: translate(7px, 7px);
+  }
+  63% {
+    transform: translate(7px, 7px);
+  }
+  72% {
+    transform: translate(7px, 7px);
+  }
+  81% {
+    transform: translate(0, 7px);
+  }
+  90% {
+    transform: translate(0, 7px);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-3 {
-  9% { transform: translate(-7px, 0); }
-  18% { transform: translate(-7px, 0); }
-  27% { transform: translate(0, 0); }
-  36% { transform: translate(-7px, 0); }
-  45% { transform: translate(-7px, 0); }
-  54% { transform: translate(-7px, 0); }
-  63% { transform: translate(-7px, 0); }
-  72% { transform: translate(-7px, 0); }
-  81% { transform: translate(-7px, -7px); }
-  90% { transform: translate(0, -7px); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(-7px, 0);
+  }
+  18% {
+    transform: translate(-7px, 0);
+  }
+  27% {
+    transform: translate(0, 0);
+  }
+  36% {
+    transform: translate(-7px, 0);
+  }
+  45% {
+    transform: translate(-7px, 0);
+  }
+  54% {
+    transform: translate(-7px, 0);
+  }
+  63% {
+    transform: translate(-7px, 0);
+  }
+  72% {
+    transform: translate(-7px, 0);
+  }
+  81% {
+    transform: translate(-7px, -7px);
+  }
+  90% {
+    transform: translate(0, -7px);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-4 {
-  9% { transform: translate(-7px, 0); }
-  18% { transform: translate(-7px, 0); }
-  27% { transform: translate(-7px, -7px); }
-  36% { transform: translate(0, -7px); }
-  45% { transform: translate(0, 0); }
-  54% { transform: translate(0, -7px); }
-  63% { transform: translate(0, -7px); }
-  72% { transform: translate(0, -7px); }
-  81% { transform: translate(-7px, -7px); }
-  90% { transform: translate(-7px, 0); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(-7px, 0);
+  }
+  18% {
+    transform: translate(-7px, 0);
+  }
+  27% {
+    transform: translate(-7px, -7px);
+  }
+  36% {
+    transform: translate(0, -7px);
+  }
+  45% {
+    transform: translate(0, 0);
+  }
+  54% {
+    transform: translate(0, -7px);
+  }
+  63% {
+    transform: translate(0, -7px);
+  }
+  72% {
+    transform: translate(0, -7px);
+  }
+  81% {
+    transform: translate(-7px, -7px);
+  }
+  90% {
+    transform: translate(-7px, 0);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-5 {
-  9% { transform: translate(0, 0); }
-  18% { transform: translate(0, 0); }
-  27% { transform: translate(0, 0); }
-  36% { transform: translate(7px, 0); }
-  45% { transform: translate(7px, 0); }
-  54% { transform: translate(7px, 0); }
-  63% { transform: translate(7px, 0); }
-  72% { transform: translate(7px, 0); }
-  81% { transform: translate(7px, -7px); }
-  90% { transform: translate(0, -7px); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(0, 0);
+  }
+  18% {
+    transform: translate(0, 0);
+  }
+  27% {
+    transform: translate(0, 0);
+  }
+  36% {
+    transform: translate(7px, 0);
+  }
+  45% {
+    transform: translate(7px, 0);
+  }
+  54% {
+    transform: translate(7px, 0);
+  }
+  63% {
+    transform: translate(7px, 0);
+  }
+  72% {
+    transform: translate(7px, 0);
+  }
+  81% {
+    transform: translate(7px, -7px);
+  }
+  90% {
+    transform: translate(0, -7px);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-6 {
-  9% { transform: translate(0, 0); }
-  18% { transform: translate(-7px, 0); }
-  27% { transform: translate(-7px, 0); }
-  36% { transform: translate(0, 0); }
-  45% { transform: translate(0, 0); }
-  54% { transform: translate(0, 0); }
-  63% { transform: translate(0, 0); }
-  72% { transform: translate(0, 7px); }
-  81% { transform: translate(-7px, 7px); }
-  90% { transform: translate(-7px, 0); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(0, 0);
+  }
+  18% {
+    transform: translate(-7px, 0);
+  }
+  27% {
+    transform: translate(-7px, 0);
+  }
+  36% {
+    transform: translate(0, 0);
+  }
+  45% {
+    transform: translate(0, 0);
+  }
+  54% {
+    transform: translate(0, 0);
+  }
+  63% {
+    transform: translate(0, 0);
+  }
+  72% {
+    transform: translate(0, 7px);
+  }
+  81% {
+    transform: translate(-7px, 7px);
+  }
+  90% {
+    transform: translate(-7px, 0);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-7 {
-  9% { transform: translate(7px, 0); }
-  18% { transform: translate(7px, 0); }
-  27% { transform: translate(7px, 0); }
-  36% { transform: translate(0, 0); }
-  45% { transform: translate(0, -7px); }
-  54% { transform: translate(7px, -7px); }
-  63% { transform: translate(0, -7px); }
-  72% { transform: translate(0, -7px); }
-  81% { transform: translate(0, 0); }
-  90% { transform: translate(7px, 0); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(7px, 0);
+  }
+  18% {
+    transform: translate(7px, 0);
+  }
+  27% {
+    transform: translate(7px, 0);
+  }
+  36% {
+    transform: translate(0, 0);
+  }
+  45% {
+    transform: translate(0, -7px);
+  }
+  54% {
+    transform: translate(7px, -7px);
+  }
+  63% {
+    transform: translate(0, -7px);
+  }
+  72% {
+    transform: translate(0, -7px);
+  }
+  81% {
+    transform: translate(0, 0);
+  }
+  90% {
+    transform: translate(7px, 0);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-8 {
-  9% { transform: translate(0, 0); }
-  18% { transform: translate(-7px, 0); }
-  27% { transform: translate(-7px, -7px); }
-  36% { transform: translate(0, -7px); }
-  45% { transform: translate(0, -7px); }
-  54% { transform: translate(0, -7px); }
-  63% { transform: translate(0, -7px); }
-  72% { transform: translate(0, -7px); }
-  81% { transform: translate(7px, -7px); }
-  90% { transform: translate(7px, 0); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(0, 0);
+  }
+  18% {
+    transform: translate(-7px, 0);
+  }
+  27% {
+    transform: translate(-7px, -7px);
+  }
+  36% {
+    transform: translate(0, -7px);
+  }
+  45% {
+    transform: translate(0, -7px);
+  }
+  54% {
+    transform: translate(0, -7px);
+  }
+  63% {
+    transform: translate(0, -7px);
+  }
+  72% {
+    transform: translate(0, -7px);
+  }
+  81% {
+    transform: translate(7px, -7px);
+  }
+  90% {
+    transform: translate(7px, 0);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 
 @keyframes moveBox-9 {
-  9% { transform: translate(-7px, 0); }
-  18% { transform: translate(-7px, 0); }
-  27% { transform: translate(0, 0); }
-  36% { transform: translate(-7px, 0); }
-  45% { transform: translate(0, 0); }
-  54% { transform: translate(0, 0); }
-  63% { transform: translate(-7px, 0); }
-  72% { transform: translate(-7px, 0); }
-  81% { transform: translate(-14px, 0); }
-  90% { transform: translate(-7px, 0); }
-  100% { transform: translate(0, 0); }
+  9% {
+    transform: translate(-7px, 0);
+  }
+  18% {
+    transform: translate(-7px, 0);
+  }
+  27% {
+    transform: translate(0, 0);
+  }
+  36% {
+    transform: translate(-7px, 0);
+  }
+  45% {
+    transform: translate(0, 0);
+  }
+  54% {
+    transform: translate(0, 0);
+  }
+  63% {
+    transform: translate(-7px, 0);
+  }
+  72% {
+    transform: translate(-7px, 0);
+  }
+  81% {
+    transform: translate(-14px, 0);
+  }
+  90% {
+    transform: translate(-7px, 0);
+  }
+  100% {
+    transform: translate(0, 0);
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/OrbitBlurSquaresLoader.vue b/static/src/components/chat/loaders/OrbitBlurSquaresLoader.vue
index 5c30a70..9fc4d82 100644
--- a/static/src/components/chat/loaders/OrbitBlurSquaresLoader.vue
+++ b/static/src/components/chat/loaders/OrbitBlurSquaresLoader.vue
@@ -32,7 +32,7 @@
 }
 
 .orbe::after {
-  content: "";
+  content: '';
   position: absolute;
   top: 0;
   left: 0;
@@ -43,8 +43,13 @@
 }
 
 @keyframes orbit {
-  0% {}
-  80% { transform: rotate(360deg); }
-  100% { transform: rotate(360deg); }
+  0% {
+  }
+  80% {
+    transform: rotate(360deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/RotatingSquaresLoader.vue b/static/src/components/chat/loaders/RotatingSquaresLoader.vue
index 20fa266..47fd028 100644
--- a/static/src/components/chat/loaders/RotatingSquaresLoader.vue
+++ b/static/src/components/chat/loaders/RotatingSquaresLoader.vue
@@ -16,23 +16,74 @@
 
 <style scoped>
 @keyframes square-animation {
-  0% { left: 0; top: 0; }
-  10.5% { left: 0; top: 0; }
-  12.5% { left: 8px; top: 0; }
-  23% { left: 8px; top: 0; }
-  25% { left: 16px; top: 0; }
-  35.5% { left: 16px; top: 0; }
-  37.5% { left: 16px; top: 8px; }
-  48% { left: 16px; top: 8px; }
-  50% { left: 8px; top: 8px; }
-  60.5% { left: 8px; top: 8px; }
-  62.5% { left: 8px; top: 16px; }
-  73% { left: 8px; top: 16px; }
-  75% { left: 0; top: 16px; }
-  85.5% { left: 0; top: 16px; }
-  87.5% { left: 0; top: 8px; }
-  98% { left: 0; top: 8px; }
-  100% { left: 0; top: 0; }
+  0% {
+    left: 0;
+    top: 0;
+  }
+  10.5% {
+    left: 0;
+    top: 0;
+  }
+  12.5% {
+    left: 8px;
+    top: 0;
+  }
+  23% {
+    left: 8px;
+    top: 0;
+  }
+  25% {
+    left: 16px;
+    top: 0;
+  }
+  35.5% {
+    left: 16px;
+    top: 0;
+  }
+  37.5% {
+    left: 16px;
+    top: 8px;
+  }
+  48% {
+    left: 16px;
+    top: 8px;
+  }
+  50% {
+    left: 8px;
+    top: 8px;
+  }
+  60.5% {
+    left: 8px;
+    top: 8px;
+  }
+  62.5% {
+    left: 8px;
+    top: 16px;
+  }
+  73% {
+    left: 8px;
+    top: 16px;
+  }
+  75% {
+    left: 0;
+    top: 16px;
+  }
+  85.5% {
+    left: 0;
+    top: 16px;
+  }
+  87.5% {
+    left: 0;
+    top: 8px;
+  }
+  98% {
+    left: 0;
+    top: 8px;
+  }
+  100% {
+    left: 0;
+    top: 0;
+  }
 }
 
 .rotating-squares-loader {
diff --git a/static/src/components/chat/loaders/ShadowRollingSquaresLoader.vue b/static/src/components/chat/loaders/ShadowRollingSquaresLoader.vue
index 7ed88e1..a3b8964 100644
--- a/static/src/components/chat/loaders/ShadowRollingSquaresLoader.vue
+++ b/static/src/components/chat/loaders/ShadowRollingSquaresLoader.vue
@@ -18,14 +18,68 @@
 }
 
 @keyframes roll {
-  0%   { box-shadow: 0 0 transparent, 0 0 transparent, 0 0 transparent, 0 0 transparent; }
-  12%  { box-shadow: 6px 0 currentColor, 0 0 transparent, 0 0 transparent, 0 0 transparent; }
-  25%  { box-shadow: 12px 0 currentColor, 6px 0 currentColor, 0 0 transparent, 0 0 transparent; }
-  36%  { box-shadow: 18px 0 currentColor, 12px 0 currentColor, 6px 0 currentColor, 0 0 transparent; }
-  50%  { box-shadow: 24px 0 currentColor, 18px 0 currentColor, 12px 0 currentColor, 6px 0 currentColor; }
-  62%  { box-shadow: 36px 0 transparent, 24px 0 currentColor, 18px 0 currentColor, 12px 0 currentColor; }
-  75%  { box-shadow: 36px 0 transparent, 36px 0 transparent, 24px 0 currentColor, 18px 0 currentColor; }
-  87%  { box-shadow: 36px 0 transparent, 36px 0 transparent, 36px 0 transparent, 24px 0 currentColor; }
-  100% { box-shadow: 36px 0 transparent, 36px 0 transparent, 36px 0 transparent, 36px 0 transparent; }
+  0% {
+    box-shadow:
+      0 0 transparent,
+      0 0 transparent,
+      0 0 transparent,
+      0 0 transparent;
+  }
+  12% {
+    box-shadow:
+      6px 0 currentColor,
+      0 0 transparent,
+      0 0 transparent,
+      0 0 transparent;
+  }
+  25% {
+    box-shadow:
+      12px 0 currentColor,
+      6px 0 currentColor,
+      0 0 transparent,
+      0 0 transparent;
+  }
+  36% {
+    box-shadow:
+      18px 0 currentColor,
+      12px 0 currentColor,
+      6px 0 currentColor,
+      0 0 transparent;
+  }
+  50% {
+    box-shadow:
+      24px 0 currentColor,
+      18px 0 currentColor,
+      12px 0 currentColor,
+      6px 0 currentColor;
+  }
+  62% {
+    box-shadow:
+      36px 0 transparent,
+      24px 0 currentColor,
+      18px 0 currentColor,
+      12px 0 currentColor;
+  }
+  75% {
+    box-shadow:
+      36px 0 transparent,
+      36px 0 transparent,
+      24px 0 currentColor,
+      18px 0 currentColor;
+  }
+  87% {
+    box-shadow:
+      36px 0 transparent,
+      36px 0 transparent,
+      36px 0 transparent,
+      24px 0 currentColor;
+  }
+  100% {
+    box-shadow:
+      36px 0 transparent,
+      36px 0 transparent,
+      36px 0 transparent,
+      36px 0 transparent;
+  }
 }
 </style>
diff --git a/static/src/components/chat/loaders/WaveMatrixSquaresLoader.vue b/static/src/components/chat/loaders/WaveMatrixSquaresLoader.vue
index 8794d19..6977b4a 100644
--- a/static/src/components/chat/loaders/WaveMatrixSquaresLoader.vue
+++ b/static/src/components/chat/loaders/WaveMatrixSquaresLoader.vue
@@ -29,13 +29,26 @@
   animation: wave var(--speed) ease-in-out infinite;
 }
 
-.sq:nth-child(1) { animation-delay: calc(var(--speed) * -0.45); }
-.sq:nth-child(2) { animation-delay: calc(var(--speed) * -0.3); }
-.sq:nth-child(3) { animation-delay: calc(var(--speed) * -0.15); }
-.sq:nth-child(4) { animation-delay: 0s; }
+.sq:nth-child(1) {
+  animation-delay: calc(var(--speed) * -0.45);
+}
+.sq:nth-child(2) {
+  animation-delay: calc(var(--speed) * -0.3);
+}
+.sq:nth-child(3) {
+  animation-delay: calc(var(--speed) * -0.15);
+}
+.sq:nth-child(4) {
+  animation-delay: 0s;
+}
 
 @keyframes wave {
-  0%, 100% { transform: translateY(0); }
-  50% { transform: translateY(-8px); }
+  0%,
+  100% {
+    transform: translateY(0);
+  }
+  50% {
+    transform: translateY(-8px);
+  }
 }
 </style>
diff --git a/static/src/components/chat/monitor/MonitorDirector.ts b/static/src/components/chat/monitor/MonitorDirector.ts
index 92ab789..177b3b6 100644
--- a/static/src/components/chat/monitor/MonitorDirector.ts
+++ b/static/src/components/chat/monitor/MonitorDirector.ts
@@ -6,12 +6,6 @@ type SceneHandler = (payload: Record<string, any>, runtime: MonitorSceneRuntime)
 type ContextMenuType = 'desktop' | 'folder' | 'file' | 'browser' | 'terminal' | 'focus';
 type TerminalMenuAction = 'snapshot' | 'reset' | 'close';
 
-type DesktopIcon = {
-  id: string;
-  label: string;
-  icon: string;
-};
-
 interface MonitorAssets {
   brainIcon: string;
   folderIcon: string;
@@ -193,10 +187,9 @@ type TerminalLine = {
   role: 'prompt' | 'output' | 'note';
 };
 
-const DEFAULT_TERMINAL_NAME = '终端1';
 const TERMINAL_NAME_PREFIX = '终端';
 
-const sleep = (ms: number) => new Promise(resolve => setTimeout(resolve, ms));
+const sleep = (ms: number) => new Promise((resolve) => setTimeout(resolve, ms));
 
 export class MonitorDirector implements MonitorDriver {
   private elements: MonitorElements;
@@ -237,7 +230,12 @@ export class MonitorDirector implements MonitorDriver {
   private manualInteractionEnabled = false;
   private manualListenersAttached = false;
   private manualPositions = new Map<HTMLElement, { left: number; top: number }>();
-  private manualDragState: { pointerId: number; target: HTMLElement; offsetX: number; offsetY: number } | null = null;
+  private manualDragState: {
+    pointerId: number;
+    target: HTMLElement;
+    offsetX: number;
+    offsetY: number;
+  } | null = null;
   private editorScene = {
     lines: [] as string[],
     placeholder: false
@@ -304,7 +302,8 @@ export class MonitorDirector implements MonitorDriver {
     this.bindTerminalInteractions();
     this.populateDesktop();
     this.setupScreenObserver();
-    this.extractionAnchor = this.windowAnchors.get(this.elements.extractionWindow) || this.extractionAnchor;
+    this.extractionAnchor =
+      this.windowAnchors.get(this.elements.extractionWindow) || this.extractionAnchor;
     this.prepareExtractionTemplate();
     this.layoutFloatingWindows();
     // 标记当前构建，便于用户确认是否加载了最新前端代码
@@ -321,7 +320,7 @@ export class MonitorDirector implements MonitorDriver {
 
   destroy() {
     this.setManualInteractionEnabled(false);
-    this.destroyFns.forEach(fn => fn());
+    this.destroyFns.forEach((fn) => fn());
     this.destroyFns = [];
     this.stopBubbleTimers();
   }
@@ -344,7 +343,7 @@ export class MonitorDirector implements MonitorDriver {
       this.activeFolder = null;
       this.refreshFolderIconStates();
     } else {
-      this.windowOrder = this.windowOrder.filter(win => win && win.classList.contains('visible'));
+      this.windowOrder = this.windowOrder.filter((win) => win && win.classList.contains('visible'));
     }
     this.hideContextMenus();
     if (!options?.preserveBubble) {
@@ -408,7 +407,7 @@ export class MonitorDirector implements MonitorDriver {
           preserved.set(key, entries);
         }
       });
-      this.desktopRoots.forEach(root => {
+      this.desktopRoots.forEach((root) => {
         if (!preserved.has(root)) {
           preserved.set(root, []);
         }
@@ -419,7 +418,7 @@ export class MonitorDirector implements MonitorDriver {
       this.pendingDesktopFolders.clear();
     } else {
       const previousSet = new Set(previousRoots);
-      this.desktopRoots.forEach(folder => {
+      this.desktopRoots.forEach((folder) => {
         if (!previousSet.has(folder)) {
           const existing = this.folderIcons.get(folder);
           if (existing && !existing.classList.contains('pending-reveal')) {
@@ -428,7 +427,7 @@ export class MonitorDirector implements MonitorDriver {
           this.pendingDesktopFolders.add(folder);
         }
       });
-      Array.from(this.pendingDesktopFolders).forEach(folder => {
+      Array.from(this.pendingDesktopFolders).forEach((folder) => {
         if (!this.desktopRoots.includes(folder)) {
           this.pendingDesktopFolders.delete(folder);
         }
@@ -527,7 +526,11 @@ export class MonitorDirector implements MonitorDriver {
     this.startProgressBubble(progressLabel);
   }
 
-  async playScene(name: string, payload: Record<string, any>, runtime: MonitorSceneRuntime): Promise<void> {
+  async playScene(
+    name: string,
+    payload: Record<string, any>,
+    runtime: MonitorSceneRuntime
+  ): Promise<void> {
     const handler = this.sceneHandlers[name] || this.sceneHandlers.genericTool;
     const progressLabel = getSceneProgressLabel(name);
     const hasPreviewForScene = !!this.progressBubbleBase && this.progressSceneName === name;
@@ -617,7 +620,9 @@ export class MonitorDirector implements MonitorDriver {
       const waitKey = payload?.executionId ?? payload?.id ?? payload?.arguments?.id ?? null;
       try {
         const preResult = await innerWait(waitKey);
-        const preResultStatus = String(preResult?.status || preResult?.result?.status || '').toLowerCase();
+        const preResultStatus = String(
+          preResult?.status || preResult?.result?.status || ''
+        ).toLowerCase();
         const preResultFailed =
           ['failed', 'error'].includes(preResultStatus) ||
           preResult?.success === false ||
@@ -848,7 +853,10 @@ export class MonitorDirector implements MonitorDriver {
       this.progressBubbleTimer = null;
     }
     const bubble = this.elements.speechBubble;
-    const shouldHideBubble = this.progressBubbleActive && !options?.preserveBubble && bubble.classList.contains('progress');
+    const shouldHideBubble =
+      this.progressBubbleActive &&
+      !options?.preserveBubble &&
+      bubble.classList.contains('progress');
     this.progressBubbleBase = null;
     this.progressSceneName = null;
     this.progressBubbleActive = false;
@@ -900,7 +908,7 @@ export class MonitorDirector implements MonitorDriver {
     return raw
       .replace(/\\/g, '/')
       .split('/')
-      .map(segment => segment.trim())
+      .map((segment) => segment.trim())
       .filter(Boolean);
   }
 
@@ -996,7 +1004,9 @@ export class MonitorDirector implements MonitorDriver {
       return;
     }
     this.desktopRenderLocked = false;
-    monitorLifecycleDebug('desktopRender:unlock', { pending: this.pendingDesktopRoots?.length || 0 });
+    monitorLifecycleDebug('desktopRender:unlock', {
+      pending: this.pendingDesktopRoots?.length || 0
+    });
     if (this.pendingDesktopRoots) {
       const pending = this.pendingDesktopRoots;
       this.pendingDesktopRoots = null;
@@ -1016,7 +1026,7 @@ export class MonitorDirector implements MonitorDriver {
   private refreshFolderIconStates() {
     // 需求简化：不区分开关状态，统一使用同一图标
     this.folderIcons.forEach((_icon, name) => {
-      this.setFolderIconState(name, false);
+      this.setFolderIconState(name);
     });
   }
 
@@ -1051,7 +1061,7 @@ export class MonitorDirector implements MonitorDriver {
     this.ensureFolderKey(folderKey);
     const entries = this.folderEntries.get(folderKey) || [];
     this.elements.folderBody.innerHTML = '';
-    entries.forEach(entry => {
+    entries.forEach((entry) => {
       const icon = document.createElement('div');
       icon.className = 'folder-entry';
       icon.dataset.entryName = entry.name;
@@ -1083,14 +1093,18 @@ export class MonitorDirector implements MonitorDriver {
     });
   }
 
-  private upsertFolderEntry(folderKey: string, entry: { name: string; type: 'folder' | 'file' }, options: { animate?: boolean } = {}) {
+  private upsertFolderEntry(
+    folderKey: string,
+    entry: { name: string; type: 'folder' | 'file' },
+    options: { animate?: boolean } = {}
+  ) {
     if (!folderKey) {
       return;
     }
     this.ensureFolderKey(folderKey);
     const path = this.composePath([folderKey, entry.name].filter(Boolean));
     const list = this.folderEntries.get(folderKey) || [];
-    const idx = list.findIndex(item => item.name === entry.name && item.type === entry.type);
+    const idx = list.findIndex((item) => item.name === entry.name && item.type === entry.type);
     if (idx >= 0) {
       list[idx] = { ...entry, path };
     } else {
@@ -1106,7 +1120,7 @@ export class MonitorDirector implements MonitorDriver {
     if (!entryPath) {
       return null;
     }
-    return this.elements.folderBody.querySelector<HTMLElement>(`[data-entry-path=\"${entryPath}\"]`);
+    return this.elements.folderBody.querySelector<HTMLElement>(`[data-entry-path="${entryPath}"]`);
   }
 
   private async doubleClickDesktopFolder(folderName: string) {
@@ -1239,7 +1253,7 @@ export class MonitorDirector implements MonitorDriver {
   private populateDesktop() {
     this.appIcons.clear();
     this.elements.appsGrid.innerHTML = '';
-    DESKTOP_APPS.forEach(app => {
+    DESKTOP_APPS.forEach((app) => {
       const div = document.createElement('div');
       div.className = 'desktop-icon app';
       div.dataset.appId = app.id;
@@ -1262,7 +1276,7 @@ export class MonitorDirector implements MonitorDriver {
       return;
     }
     const desiredRoots = this.desktopRoots.filter(
-      folder => !this.pendingDesktopFolders.has(folder) && !this.isCreationPending(folder)
+      (folder) => !this.pendingDesktopFolders.has(folder) && !this.isCreationPending(folder)
     );
     const knownRoots = new Set(this.desktopRoots);
 
@@ -1277,7 +1291,7 @@ export class MonitorDirector implements MonitorDriver {
     });
 
     // 更新/创建所有根目录图标，pending 项先不挂载到 DOM
-    this.desktopRoots.forEach(folder => {
+    this.desktopRoots.forEach((folder) => {
       let icon = this.folderIcons.get(folder) || null;
       if (!icon) {
         icon = this.createDesktopFolderIcon(folder);
@@ -1294,7 +1308,9 @@ export class MonitorDirector implements MonitorDriver {
       }
     });
 
-    const currentOrder = Array.from(grid.querySelectorAll<HTMLElement>('[data-folder-name]')).map(node => node.dataset.folderName || '');
+    const currentOrder = Array.from(grid.querySelectorAll<HTMLElement>('[data-folder-name]')).map(
+      (node) => node.dataset.folderName || ''
+    );
     let requiresReorder = desiredRoots.length !== currentOrder.length;
     if (!requiresReorder) {
       for (let i = 0; i < desiredRoots.length; i += 1) {
@@ -1306,15 +1322,16 @@ export class MonitorDirector implements MonitorDriver {
     }
     if (requiresReorder) {
       const folderNodes = Array.from(grid.querySelectorAll<HTMLElement>('[data-folder-name]'));
-      folderNodes.forEach(node => node.remove());
-      const firstNonFolderSibling = Array.from(grid.children).find(child => {
-        if (!(child instanceof HTMLElement)) {
-          return false;
-        }
-        return !child.dataset.folderName;
-      }) || null;
+      folderNodes.forEach((node) => node.remove());
+      const firstNonFolderSibling =
+        Array.from(grid.children).find((child) => {
+          if (!(child instanceof HTMLElement)) {
+            return false;
+          }
+          return !child.dataset.folderName;
+        }) || null;
       let lastInserted: HTMLElement | null = null;
-      desiredRoots.forEach(folder => {
+      desiredRoots.forEach((folder) => {
         const icon = this.folderIcons.get(folder);
         if (!icon) {
           return;
@@ -1397,7 +1414,7 @@ export class MonitorDirector implements MonitorDriver {
     windowEl.className = 'window extraction-window';
     const header = document.createElement('div');
     header.className = 'window-header';
-    ['red', 'yellow', 'green'].forEach(color => {
+    ['red', 'yellow', 'green'].forEach((color) => {
       const dot = document.createElement('span');
       dot.className = `traffic-dot ${color}`;
       header.appendChild(dot);
@@ -1459,7 +1476,7 @@ export class MonitorDirector implements MonitorDriver {
   }
 
   private clearExtractionWindows() {
-    this.extractionWindows.forEach(instance => {
+    this.extractionWindows.forEach((instance) => {
       this.closeWindow(instance.element, { animate: false });
       this.windowAnchors.delete(instance.element);
       this.manualPositions.delete(instance.element);
@@ -1522,7 +1539,10 @@ export class MonitorDirector implements MonitorDriver {
     this.commandCurrentText = '';
   }
 
-  private async revealCommandWindow(title = '命令行', options: { reset?: boolean; focusInput?: boolean } = {}) {
+  private async revealCommandWindow(
+    title = '命令行',
+    options: { reset?: boolean; focusInput?: boolean } = {}
+  ) {
     const { reset = true, focusInput = false } = options;
     const visible = this.isWindowVisible(this.elements.commandWindow);
     if (!visible) {
@@ -1576,7 +1596,7 @@ export class MonitorDirector implements MonitorDriver {
       return;
     }
     const frag = document.createDocumentFragment();
-    lines.forEach(line => {
+    lines.forEach((line) => {
       const row = document.createElement('div');
       row.className = 'command-line';
       row.textContent = line;
@@ -1627,7 +1647,10 @@ export class MonitorDirector implements MonitorDriver {
     await this.click();
   }
 
-  private async typePythonCode(code: string, options: { deletePrevious?: boolean; animate?: boolean } = {}) {
+  private async typePythonCode(
+    code: string,
+    options: { deletePrevious?: boolean; animate?: boolean } = {}
+  ) {
     if (!this.elements.pythonInput) return;
     const { deletePrevious = true, animate = true } = options;
     const target = this.elements.pythonInput;
@@ -1678,7 +1701,9 @@ export class MonitorDirector implements MonitorDriver {
     }
   }
 
-  private async ensureMemoryWindowVisible(options: { initialEntries?: string[]; snapshotProvided?: boolean; memoryType?: string } = {}) {
+  private async ensureMemoryWindowVisible(
+    options: { initialEntries?: string[]; snapshotProvided?: boolean; memoryType?: string } = {}
+  ) {
     const { initialEntries, snapshotProvided = false, memoryType = 'main' } = options;
     const hydrate = async () => {
       if (snapshotProvided) {
@@ -1707,12 +1732,15 @@ export class MonitorDirector implements MonitorDriver {
     return Array.from(this.elements.memoryList.children) as HTMLElement[];
   }
 
-  private extractMemorySnapshotEntries(payload: any, stage: 'before' | 'after' = 'before'): { entries: string[]; provided: boolean } {
+  private extractMemorySnapshotEntries(
+    payload: any,
+    stage: 'before' | 'after' = 'before'
+  ): { entries: string[]; provided: boolean } {
     const key = stage === 'after' ? 'monitor_snapshot_after' : 'monitor_snapshot';
     const snapshot = payload?.[key];
     const entries = snapshot?.entries;
     if (Array.isArray(entries)) {
-      return { entries: entries.map(entry => String(entry ?? '')), provided: true };
+      return { entries: entries.map((entry) => String(entry ?? '')), provided: true };
     }
     return { entries: [], provided: !!snapshot };
   }
@@ -1727,7 +1755,7 @@ export class MonitorDirector implements MonitorDriver {
 
   private async waitForScrollSettled(el: HTMLElement, targetTop: number, timeout = 600) {
     const started = Date.now();
-    return new Promise<void>(resolve => {
+    return new Promise<void>((resolve) => {
       const tick = () => {
         const arrived = Math.abs(el.scrollTop - targetTop) < 2;
         const expired = Date.now() - started > timeout;
@@ -1819,7 +1847,11 @@ export class MonitorDirector implements MonitorDriver {
     return item;
   }
 
-  private async typeIntoMemoryCard(card: HTMLElement, text: string, options: { clearFirst?: boolean } = {}) {
+  private async typeIntoMemoryCard(
+    card: HTMLElement,
+    text: string,
+    options: { clearFirst?: boolean } = {}
+  ) {
     if (!card) return;
     const body = card.querySelector('.memory-text') as HTMLElement | null;
     if (!body) return;
@@ -1908,7 +1940,7 @@ export class MonitorDirector implements MonitorDriver {
   private renderMemoryEntries(entries: string[]) {
     if (!this.elements.memoryList) return;
     this.elements.memoryList.innerHTML = '';
-    entries.forEach(text => {
+    entries.forEach((text) => {
       const card = this.createMemoryCard(text);
       card.classList.add('visible');
       this.elements.memoryList.appendChild(card);
@@ -1916,7 +1948,7 @@ export class MonitorDirector implements MonitorDriver {
     this.updateMemoryMeta();
   }
 
-  private async revealTerminalWindow(instance: TerminalShell, title: string) {
+  private async revealTerminalWindow(instance: TerminalShell) {
     await this.movePointerToApp('terminal');
     await this.click();
     this.showWindow(instance.element);
@@ -1964,7 +1996,7 @@ export class MonitorDirector implements MonitorDriver {
     const history = this.getTerminalHistory(sessionId);
     const { bodyEl } = this.getTerminalInstance();
     bodyEl.innerHTML = '';
-    history.forEach(line => {
+    history.forEach((line) => {
       const pre = document.createElement('pre');
       pre.textContent = line.text;
       if (line.role === 'prompt') {
@@ -2003,7 +2035,7 @@ export class MonitorDirector implements MonitorDriver {
     } else {
       history[history.length - 1].text = `➜ ${command}`.trimEnd();
     }
-    outputs.forEach(line => history.push({ text: line, role: 'output' }));
+    outputs.forEach((line) => history.push({ text: line, role: 'output' }));
     history.push({ text: '➜ ', role: 'prompt' });
     this.renderTerminalHistory(sessionId);
   }
@@ -2088,7 +2120,7 @@ export class MonitorDirector implements MonitorDriver {
   }
 
   private nextTerminalName() {
-    const existing = Array.from(this.terminalSessions.values()).map(s => s.name);
+    const existing = Array.from(this.terminalSessions.values()).map((s) => s.name);
     let idx = existing.length + 1;
     let candidate = `${TERMINAL_NAME_PREFIX}${idx}`;
     while (existing.includes(candidate)) {
@@ -2099,8 +2131,14 @@ export class MonitorDirector implements MonitorDriver {
   }
 
   private ensureSessionRecord(sessionId: string, name?: string, rawName?: string) {
-    const baseName = (name || rawName || this.terminalSessionNames.get(sessionId) || '').trim() || this.nextTerminalName();
-    this.terminalSessions.set(sessionId, { id: sessionId, name: baseName, rawName: rawName || name });
+    const baseName =
+      (name || rawName || this.terminalSessionNames.get(sessionId) || '').trim() ||
+      this.nextTerminalName();
+    this.terminalSessions.set(sessionId, {
+      id: sessionId,
+      name: baseName,
+      rawName: rawName || name
+    });
     this.terminalSessionNames.set(sessionId, baseName);
     this.terminalSessionTitleMap.set(baseName, sessionId);
     if (rawName) {
@@ -2120,7 +2158,9 @@ export class MonitorDirector implements MonitorDriver {
   }
 
   private getTabElement(sessionId: string) {
-    return this.elements.terminalTabList.querySelector<HTMLElement>(`[data-session-id="${sessionId}"]`);
+    return this.elements.terminalTabList.querySelector<HTMLElement>(
+      `[data-session-id="${sessionId}"]`
+    );
   }
 
   private renderTerminalTabs() {
@@ -2128,7 +2168,9 @@ export class MonitorDirector implements MonitorDriver {
       return;
     }
     this.elements.terminalTabList.innerHTML = '';
-    const tabs: Array<{ id: string; name: string }> = Array.from(this.terminalSessions.values()).map(s => ({
+    const tabs: Array<{ id: string; name: string }> = Array.from(
+      this.terminalSessions.values()
+    ).map((s) => ({
       id: s.id,
       name: s.name
     }));
@@ -2138,7 +2180,7 @@ export class MonitorDirector implements MonitorDriver {
       return;
     }
     this.elements.terminalAddButton.classList.remove('lonely');
-    tabs.forEach(session => {
+    tabs.forEach((session) => {
       const btn = document.createElement('button');
       btn.className = 'terminal-tab';
       btn.dataset.sessionId = session.id;
@@ -2170,9 +2212,19 @@ export class MonitorDirector implements MonitorDriver {
 
   private async ensureTerminalSessionReady(
     payload: any,
-    options: { focusPrompt?: boolean; forceNew?: boolean; createIfMissing?: boolean; activate?: boolean } = {}
+    options: {
+      focusPrompt?: boolean;
+      forceNew?: boolean;
+      createIfMissing?: boolean;
+      activate?: boolean;
+    } = {}
   ) {
-    const { focusPrompt = false, createIfMissing = true, forceNew = false, activate = true } = options;
+    const {
+      focusPrompt = false,
+      createIfMissing = true,
+      forceNew = false,
+      activate = true
+    } = options;
     const requestedNew =
       payload?.arguments?.create_new === true ||
       payload?.arguments?.new_session === true ||
@@ -2194,12 +2246,13 @@ export class MonitorDirector implements MonitorDriver {
       preferExisting: !(forceNew || requestedNew || !!nameHint)
     });
     let sessionId = meta.sessionId;
-    const needsNew = forceNew || requestedNew || !sessionId || !this.terminalSessions.has(sessionId);
+    const needsNew =
+      forceNew || requestedNew || !sessionId || !this.terminalSessions.has(sessionId);
 
     const shell = this.getTerminalInstance();
     const wasVisible = this.isWindowVisible(shell.element);
     if (!wasVisible) {
-      await this.revealTerminalWindow(shell, '终端');
+      await this.revealTerminalWindow(shell);
     } else {
       this.showWindow(shell.element);
     }
@@ -2243,10 +2296,16 @@ export class MonitorDirector implements MonitorDriver {
     } else {
       this.renderTerminalTabs();
     }
-    return { sessionId, title: meta.title, instance: this.getTerminalInstance(), prompt: promptEl, created, reopened: !wasVisible };
+    return {
+      sessionId,
+      title: meta.title,
+      instance: this.getTerminalInstance(),
+      prompt: promptEl,
+      created,
+      reopened: !wasVisible
+    };
   }
 
-
   private scrollPromptIntoView(instance: TerminalShell) {
     if (!instance.bodyEl) {
       return;
@@ -2255,11 +2314,11 @@ export class MonitorDirector implements MonitorDriver {
   }
 
   private sanitizeTerminalOutput(lines: string[]): string[] {
-    const promptLike = /^root@[\w.-]+:.*[#\$]\s*/;
+    const promptLike = /^root@[\w.-]+:.*[#$]\s*/;
     return lines
-      .map(line => (line === null || line === undefined ? '' : String(line)))
-      .filter(line => !promptLike.test(line.trim()))
-      .map(line => line.replace(/\r$/, ''));
+      .map((line) => (line === null || line === undefined ? '' : String(line)))
+      .filter((line) => !promptLike.test(line.trim()))
+      .map((line) => line.replace(/\r$/, ''));
   }
 
   private resolveSessionMeta(
@@ -2269,7 +2328,12 @@ export class MonitorDirector implements MonitorDriver {
       createIfMissing = false,
       forceNewIfAbsent = false,
       preferExisting = true
-    }: { persist?: boolean; createIfMissing?: boolean; forceNewIfAbsent?: boolean; preferExisting?: boolean } = {}
+    }: {
+      persist?: boolean;
+      createIfMissing?: boolean;
+      forceNewIfAbsent?: boolean;
+      preferExisting?: boolean;
+    } = {}
   ) {
     const nameCandidates = [
       payload?.arguments?.session_name,
@@ -2400,7 +2464,7 @@ export class MonitorDirector implements MonitorDriver {
       this.elements.memoryWindow,
       this.elements.todoWindow,
       this.elements.waitWindow
-    ].forEach(win => this.closeWindow(win, { animate: false }));
+    ].forEach((win) => this.closeWindow(win, { animate: false }));
     this.clearExtractionWindows();
     this.clearTerminalSessions();
     this.windowOrder = [];
@@ -2443,15 +2507,25 @@ export class MonitorDirector implements MonitorDriver {
       this.manualPositions.set(el, { left, top });
       return;
     }
-    const availableWidth = Math.max(0, this.elements.screen.clientWidth - WINDOW_PADDING * 2 - width);
+    const availableWidth = Math.max(
+      0,
+      this.elements.screen.clientWidth - WINDOW_PADDING * 2 - width
+    );
     const availableHeight = Math.max(
       0,
-      this.elements.screen.clientHeight - WINDOW_PADDING - WINDOW_TOP_OFFSET - WINDOW_PADDING - height
+      this.elements.screen.clientHeight -
+        WINDOW_PADDING -
+        WINDOW_TOP_OFFSET -
+        WINDOW_PADDING -
+        height
     );
     const baseLeft = WINDOW_PADDING + availableWidth * anchor.x;
     const baseTop = WINDOW_TOP_OFFSET + availableHeight * anchor.y;
     const maxLeft = this.elements.screen.clientWidth - width - WINDOW_PADDING;
-    const maxTop = Math.max(WINDOW_TOP_OFFSET, this.elements.screen.clientHeight - height - WINDOW_PADDING);
+    const maxTop = Math.max(
+      WINDOW_TOP_OFFSET,
+      this.elements.screen.clientHeight - height - WINDOW_PADDING
+    );
     const left = Math.min(Math.max(WINDOW_PADDING, baseLeft), Math.max(WINDOW_PADDING, maxLeft));
     const top = Math.min(Math.max(WINDOW_TOP_OFFSET, baseTop), maxTop);
     el.style.left = `${left}px`;
@@ -2482,7 +2556,8 @@ export class MonitorDirector implements MonitorDriver {
       }
       const results = Array.isArray(completion?.result?.results) ? completion.result.results : [];
       this.renderSearchResults(results);
-      this.elements.browserStatus.textContent = completion?.status === 'completed' ? '搜索完成，已加载结果' : '搜索未完成';
+      this.elements.browserStatus.textContent =
+        completion?.status === 'completed' ? '搜索完成，已加载结果' : '搜索未完成';
       await sleep(320);
       await this.simulateResultBrowsing();
       this.pushWindowToStack(this.elements.browserWindow);
@@ -2491,7 +2566,11 @@ export class MonitorDirector implements MonitorDriver {
     this.sceneHandlers.webExtract = async (payload, runtime) => {
       this.applySceneStatus(runtime, 'webExtract', '正在提取');
       const targetUrl =
-        payload?.arguments?.url || payload?.arguments?.target_url || payload?.result?.url || payload?.result?.source || '';
+        payload?.arguments?.url ||
+        payload?.arguments?.target_url ||
+        payload?.result?.url ||
+        payload?.result?.source ||
+        '';
       let usedExistingSearch = false;
       if (targetUrl) {
         const resultEl = await this.focusSearchResultByUrl(targetUrl);
@@ -2517,7 +2596,11 @@ export class MonitorDirector implements MonitorDriver {
           await this.movePointerToElement(searchBar, { offsetX: -40 });
           await this.click();
         }
-        const navigateInput = targetUrl || payload?.arguments?.query || payload?.arguments?.title || 'https://example.com';
+        const navigateInput =
+          targetUrl ||
+          payload?.arguments?.query ||
+          payload?.arguments?.title ||
+          'https://example.com';
         await this.typeSearchQuery(navigateInput);
         this.elements.browserStatus.textContent = targetUrl ? '正在打开网页...' : '正在搜索...';
         await sleep(900);
@@ -2528,7 +2611,12 @@ export class MonitorDirector implements MonitorDriver {
         url: targetUrl
       });
       this.showWindow(extractionInstance.element);
-      const displayUrl = targetUrl || payload?.arguments?.url || payload?.result?.url || payload?.result?.source || '';
+      const displayUrl =
+        targetUrl ||
+        payload?.arguments?.url ||
+        payload?.result?.url ||
+        payload?.result?.source ||
+        '';
       extractionInstance.urlEl.textContent = displayUrl;
       extractionInstance.stateEl.textContent = '提取中...';
       extractionInstance.stateEl.classList.remove('complete');
@@ -2543,7 +2631,10 @@ export class MonitorDirector implements MonitorDriver {
         return;
       }
       const resolvedResult = completion?.result ?? payload?.result ?? null;
-      const { hasContent, hasError } = this.renderExtractionSummary(extractionInstance.summaryEl, resolvedResult);
+      const { hasContent, hasError } = this.renderExtractionSummary(
+        extractionInstance.summaryEl,
+        resolvedResult
+      );
       const finalStatus = this.resolveExtractionStatus(completion, payload, resolvedResult);
       const computedStatus = finalStatus || (hasError ? 'failed' : hasContent ? 'completed' : null);
       if (computedStatus === 'failed') {
@@ -2580,14 +2671,18 @@ export class MonitorDirector implements MonitorDriver {
         }
         const resultPromise = runtime
           .waitForResult(payload.executionId || payload.id)
-          .catch(error => {
+          .catch((error) => {
             console.warn('[MonitorDirector] createFolder waitForResult error', error);
             return null;
           });
         if (segments.length) {
           const openedParent = await this.openFolderChain(segments);
           if (openedParent) {
-            await this.movePointerToElement(this.elements.folderBody, { offsetX: 40, offsetY: 40, duration: 720 });
+            await this.movePointerToElement(this.elements.folderBody, {
+              offsetX: 40,
+              offsetY: 40,
+              duration: 720
+            });
             await this.click({ right: true });
             this.showContextMenu('folder');
             await sleep(200);
@@ -2665,14 +2760,18 @@ export class MonitorDirector implements MonitorDriver {
         }
         const resultPromise = runtime
           .waitForResult(payload.executionId || payload.id)
-          .catch(error => {
+          .catch((error) => {
             console.warn('[MonitorDirector] createFile waitForResult error', error);
             return null;
           });
         if (segments.length) {
           const openedParent = await this.openFolderChain(segments);
           if (openedParent) {
-            await this.movePointerToElement(this.elements.folderBody, { offsetX: 30, offsetY: 20, duration: 720 });
+            await this.movePointerToElement(this.elements.folderBody, {
+              offsetX: 30,
+              offsetY: 20,
+              duration: 720
+            });
             await this.click({ right: true });
             this.showContextMenu('folder');
             await sleep(200);
@@ -2771,13 +2870,20 @@ export class MonitorDirector implements MonitorDriver {
       const targetSegments = this.normalizePathSegments(targetPath);
       const fromName = sourceSegments.pop() || '';
       const toName = targetSegments.pop() || '';
-      renameDebug('scene:resolved-names', { fromName, toName, sourceSegments: [...sourceSegments], targetSegments: [...targetSegments] });
+      renameDebug('scene:resolved-names', {
+        fromName,
+        toName,
+        sourceSegments: [...sourceSegments],
+        targetSegments: [...targetSegments]
+      });
       const clickRenameInFileMenu = async () => {
         this.showContextMenu('file');
         await this.waitForMenuVisible(this.elements.fileMenu, 240);
         const highlighted = await this.highlightMenu('file', 'rename');
         if (!highlighted) {
-          const btn = this.elements.fileMenu.querySelector<HTMLButtonElement>('button[data-action="rename"]');
+          const btn = this.elements.fileMenu.querySelector<HTMLButtonElement>(
+            'button[data-action="rename"]'
+          );
           if (btn) {
             await this.movePointerToElement(btn, { duration: 300 });
             btn.classList.add('active');
@@ -2792,13 +2898,19 @@ export class MonitorDirector implements MonitorDriver {
         if (sourceSegments.length) {
           const parentKey = await this.openFolderChain(sourceSegments);
           if (parentKey) {
-            const existing = (this.folderEntries.get(parentKey) || []).find(item => item.name === fromName);
+            const existing = (this.folderEntries.get(parentKey) || []).find(
+              (item) => item.name === fromName
+            );
             const entryType = existing?.type || 'file';
-            this.upsertFolderEntry(parentKey, { name: fromName, type: entryType }, { animate: false });
+            this.upsertFolderEntry(
+              parentKey,
+              { name: fromName, type: entryType },
+              { animate: false }
+            );
             await this.openFolder(parentKey, parentKey);
             await sleep(40);
             const entryPath = this.composePath([parentKey, fromName]);
-            let entryEl = this.findFolderEntryElement(entryPath);
+            const entryEl = this.findFolderEntryElement(entryPath);
             renameDebug('scene:folder-target', { entryPath, found: !!entryEl });
             if (!entryEl) {
               renameDebug('scene:folder-missing-target', { entryPath });
@@ -2850,17 +2962,22 @@ export class MonitorDirector implements MonitorDriver {
         await sleep(300);
         return;
       }
-      const openDeleteMenu = async (targetEl: HTMLElement | null, menuType: ContextMenuType = 'file') => {
+      const openDeleteMenu = async (
+        targetEl: HTMLElement | null,
+        menuType: ContextMenuType = 'file'
+      ) => {
         if (!targetEl) {
           return false;
         }
         await this.movePointerToElement(targetEl, { duration: 600 });
         await this.click({ right: true });
-        this.showContextMenu('file');
+        this.showContextMenu(menuType);
         await sleep(160);
         const highlighted = await this.highlightMenu('file', 'delete');
         if (!highlighted) {
-          const btn = this.elements.fileMenu.querySelector<HTMLButtonElement>('button[data-action="delete"]');
+          const btn = this.elements.fileMenu.querySelector<HTMLButtonElement>(
+            'button[data-action="delete"]'
+          );
           if (btn) {
             await this.movePointerToElement(btn, { duration: 320 });
           }
@@ -2872,7 +2989,9 @@ export class MonitorDirector implements MonitorDriver {
       if (segments.length) {
         const parentKey = await this.openFolderChain(segments);
         if (parentKey) {
-          const existing = (this.folderEntries.get(parentKey) || []).find(item => item.name === name);
+          const existing = (this.folderEntries.get(parentKey) || []).find(
+            (item) => item.name === name
+          );
           const entryType = existing?.type || 'file';
           this.upsertFolderEntry(parentKey, { name, type: entryType }, { animate: false });
           await this.openFolder(parentKey, parentKey);
@@ -2910,14 +3029,21 @@ export class MonitorDirector implements MonitorDriver {
     this.sceneHandlers.wait = async (payload, runtime) => {
       this.applySceneStatus(runtime, 'wait', '正在等待');
       const duration =
-        Number(payload?.arguments?.duration || payload?.arguments?.seconds || payload?.seconds || payload?.duration) || 5;
+        Number(
+          payload?.arguments?.duration ||
+            payload?.arguments?.seconds ||
+            payload?.seconds ||
+            payload?.duration
+        ) || 5;
       await this.movePointerToDesktop();
       await this.click({ right: true });
       this.showContextMenu('desktop');
       await sleep(200);
       const highlighted = await this.highlightMenu('desktop', 'wait');
       if (!highlighted) {
-        const btn = this.elements.desktopMenu.querySelector<HTMLButtonElement>('button[data-action="wait"]');
+        const btn = this.elements.desktopMenu.querySelector<HTMLButtonElement>(
+          'button[data-action="wait"]'
+        );
         if (btn) {
           await this.movePointerToElement(btn, { duration: 320 });
         }
@@ -2925,7 +3051,9 @@ export class MonitorDirector implements MonitorDriver {
       await this.click();
       this.hideContextMenus();
       await sleep(140); // 等菜单完全收起后再出现等待提示
-      const waitPromise = runtime.waitForResult(payload.executionId || payload.id).catch(() => null);
+      const waitPromise = runtime
+        .waitForResult(payload.executionId || payload.id)
+        .catch(() => null);
       await this.playWaitCountdown(duration, waitPromise);
     };
 
@@ -2936,7 +3064,8 @@ export class MonitorDirector implements MonitorDriver {
       const filename = segments.pop() || 'file.txt';
       const snapshotPath =
         (typeof payload?.monitor_snapshot?.path === 'string' && payload.monitor_snapshot.path) ||
-        (typeof payload?.monitor_snapshot_after?.path === 'string' && payload.monitor_snapshot_after.path) ||
+        (typeof payload?.monitor_snapshot_after?.path === 'string' &&
+          payload.monitor_snapshot_after.path) ||
         null;
       const canonicalPath = snapshotPath || this.composePath([...segments, filename]);
       const fetchTargetPath = canonicalPath || rawPath;
@@ -2988,7 +3117,7 @@ export class MonitorDirector implements MonitorDriver {
       this.prepareEditorScene(beforeLines);
       const completion = await runtime
         .waitForResult(payload.executionId || payload.id)
-        .catch(error => {
+        .catch((error) => {
           console.warn('[MonitorDirector] appendFile waitForResult error', error);
           return null;
         });
@@ -3022,7 +3151,9 @@ export class MonitorDirector implements MonitorDriver {
       if (!afterLines.length && canonicalPath && this.editorSnapshots.has(canonicalPath)) {
         afterLines = this.editorSnapshots.get(canonicalPath)!.slice();
       }
-      const fallbackNew = this.normalizeLines(payload?.arguments?.content || payload?.result?.content || '');
+      const fallbackNew = this.normalizeLines(
+        payload?.arguments?.content || payload?.result?.content || ''
+      );
       const nextLines = afterLines.length ? afterLines : fallbackNew;
       editorDebug('scene:appendFile:nextLines', {
         after: afterLines.length,
@@ -3043,7 +3174,7 @@ export class MonitorDirector implements MonitorDriver {
     this.sceneHandlers.runCommand = async (payload, runtime) => {
       const toolLabel = payload?.name || payload?.tool || 'run_command';
       this.applySceneStatus(runtime, 'runCommand', `调用 ${toolLabel}`);
-      const command = payload?.arguments?.command || payload?.result?.command || 'echo \"Hello\"';
+      const command = payload?.arguments?.command || payload?.result?.command || 'echo "Hello"';
       const reuse = this.isWindowVisible(this.elements.commandWindow);
       if (reuse) {
         this.showWindow(this.elements.commandWindow);
@@ -3090,7 +3221,7 @@ export class MonitorDirector implements MonitorDriver {
         }
       }
       this.latestPythonExecutionId = runId;
-      const code = payload?.arguments?.code || 'print(\"Hello\")';
+      const code = payload?.arguments?.code || 'print("Hello")';
       const codeLines = this.normalizeLines(code);
       const animate = codeLines.length <= 15;
       const runToken = ++this.pythonRunToken;
@@ -3126,7 +3257,9 @@ export class MonitorDirector implements MonitorDriver {
 
     this.sceneHandlers.reader = async (payload, runtime) => {
       const targetPath = payload?.arguments?.path || payload?.result?.path || '文档';
-      const readMode = String(payload?.arguments?.type || payload?.result?.type || 'read').toLowerCase();
+      const readMode = String(
+        payload?.arguments?.type || payload?.result?.type || 'read'
+      ).toLowerCase();
       const statusMap: Record<string, string> = {
         search: '文件搜索',
         extract: '提取片段'
@@ -3137,7 +3270,10 @@ export class MonitorDirector implements MonitorDriver {
         targetPath,
         readMode
       });
-      const targetEntry = await this.revealFileTarget(targetPath, { doubleClick: true, spawnDesktopFile: true });
+      const targetEntry = await this.revealFileTarget(targetPath, {
+        doubleClick: true,
+        spawnDesktopFile: true
+      });
       if (!targetEntry) {
         await this.movePointerToDesktop();
       }
@@ -3160,7 +3296,10 @@ export class MonitorDirector implements MonitorDriver {
       if (!this.ensureSuccessOrErrorBubble(completion, payload, '阅读失败')) {
         return;
       }
-      const { source: resultPayload, label: payloadSource } = this.resolveReaderPayload(payload, completion);
+      const { source: resultPayload, label: payloadSource } = this.resolveReaderPayload(
+        payload,
+        completion
+      );
       readerDebug('readerScene:payload resolved', {
         executionId: payload?.executionId || payload?.id,
         payloadSource,
@@ -3178,7 +3317,8 @@ export class MonitorDirector implements MonitorDriver {
           count: extractedLines.length
         });
       } else {
-        const fallbackMessage = completion?.message || payload?.result?.message || '未返回可显示内容';
+        const fallbackMessage =
+          completion?.message || payload?.result?.message || '未返回可显示内容';
         this.renderReaderMessage(fallbackMessage);
         readerDebug('readerScene:fallback message', {
           executionId: payload?.executionId || payload?.id,
@@ -3204,7 +3344,7 @@ export class MonitorDirector implements MonitorDriver {
       }
       const completion = await runtime
         .waitForResult(payload.executionId || payload.id)
-        .catch(error => {
+        .catch((error) => {
           console.warn('[MonitorDirector] focus waitForResult error', error);
           return null;
         });
@@ -3250,12 +3390,10 @@ export class MonitorDirector implements MonitorDriver {
       } else {
         await this.movePointerToDesktop();
       }
-      await runtime
-        .waitForResult(payload.executionId || payload.id)
-        .catch(error => {
-          console.warn('[MonitorDirector] unfocus waitForResult error', error);
-          return null;
-        });
+      await runtime.waitForResult(payload.executionId || payload.id).catch((error) => {
+        console.warn('[MonitorDirector] unfocus waitForResult error', error);
+        return null;
+      });
       if (!this.ensureSuccessOrErrorBubble(null, payload, '取消聚焦失败')) {
         return;
       }
@@ -3280,12 +3418,18 @@ export class MonitorDirector implements MonitorDriver {
 
     this.sceneHandlers.memoryUpdate = async (payload, runtime) => {
       this.applySceneStatus(runtime, 'memoryUpdate', '正在同步记忆');
-      const { entries: initialEntries, provided: snapshotProvided } = this.extractMemorySnapshotEntries(payload, 'before');
-      const memoryType =
-        (payload?.arguments?.memory_type || payload?.result?.memory_type || 'main').toString().toLowerCase();
+      const { entries: initialEntries, provided: snapshotProvided } =
+        this.extractMemorySnapshotEntries(payload, 'before');
+      const memoryType = (payload?.arguments?.memory_type || payload?.result?.memory_type || 'main')
+        .toString()
+        .toLowerCase();
       await this.ensureMemoryWindowVisible({ initialEntries, snapshotProvided, memoryType });
 
-      const op = (payload?.arguments?.operation || payload?.result?.operation || 'append').toLowerCase();
+      const op = (
+        payload?.arguments?.operation ||
+        payload?.result?.operation ||
+        'append'
+      ).toLowerCase();
       const content = payload?.arguments?.content || payload?.result?.content || '';
       const index = Number(payload?.arguments?.index || payload?.result?.index || 0) || 0;
 
@@ -3309,33 +3453,39 @@ export class MonitorDirector implements MonitorDriver {
         payload?.arguments?.title ||
         payload?.arguments?.task ||
         '待办摘要';
-    const tasks = this.normalizeTodoTasks(payload?.arguments?.tasks || summary);
-    await this.ensureTodoWindowVisible();
-    this.resetTodoBoard({ summary: true, list: true });
-    await this.typeTodoSummary(summary);
-    for (const task of tasks) {
-      await this.animateTodoAppend(task, { scrollIntoView: false });
-    }
-    if (this.elements.todoList) {
-      this.elements.todoList.scrollTop = 0;
-    }
-    await sleep(320);
-  };
+      const tasks = this.normalizeTodoTasks(payload?.arguments?.tasks || summary);
+      await this.ensureTodoWindowVisible();
+      this.resetTodoBoard({ summary: true, list: true });
+      await this.typeTodoSummary(summary);
+      for (const task of tasks) {
+        await this.animateTodoAppend(task, { scrollIntoView: false });
+      }
+      if (this.elements.todoList) {
+        this.elements.todoList.scrollTop = 0;
+      }
+      await sleep(320);
+    };
 
     this.sceneHandlers.todoUpdate = async (payload, runtime) => {
       this.applySceneStatus(runtime, 'todoUpdate', '正在调整待办');
       await this.ensureTodoWindowVisible();
       const targetText = payload?.arguments?.title || payload?.arguments?.task || null;
-      const targetIndex = Number(payload?.arguments?.task_index || payload?.arguments?.index || 0) || null;
+      const targetIndex =
+        Number(payload?.arguments?.task_index || payload?.arguments?.index || 0) || null;
       const completed =
-        payload?.arguments?.completed ?? payload?.arguments?.done ?? payload?.arguments?.checked ?? true;
+        payload?.arguments?.completed ??
+        payload?.arguments?.done ??
+        payload?.arguments?.checked ??
+        true;
       await this.toggleTodoItem(targetText, !!completed, targetIndex);
       await sleep(260);
     };
 
     this.sceneHandlers.todoFinish = async (_payload, runtime) => {
       this.applySceneStatus(runtime, 'todoFinish', '正在完成任务');
-      const redDot = this.elements.todoWindow.querySelector('.traffic-dot.red') as HTMLElement | null;
+      const redDot = this.elements.todoWindow.querySelector(
+        '.traffic-dot.red'
+      ) as HTMLElement | null;
       if (redDot) {
         await this.movePointerToElement(redDot, { duration: 420 });
         await this.click();
@@ -3379,7 +3529,7 @@ export class MonitorDirector implements MonitorDriver {
         // 确保窗口可见，但不强制激活
         const shell = this.getTerminalInstance();
         if (!this.isWindowVisible(shell.element)) {
-          await this.revealTerminalWindow(shell, '终端');
+          await this.revealTerminalWindow(shell);
         } else {
           this.showWindow(shell.element);
         }
@@ -3419,7 +3569,8 @@ export class MonitorDirector implements MonitorDriver {
         payload?.title ||
         null;
       const mappedExisting =
-        nameHint && (this.terminalRawNameMap.has(nameHint) || this.terminalSessionTitleMap.has(nameHint));
+        nameHint &&
+        (this.terminalRawNameMap.has(nameHint) || this.terminalSessionTitleMap.has(nameHint));
       const shouldForceNew =
         payload?.arguments?.create_new === true ||
         payload?.arguments?.new_session === true ||
@@ -3436,7 +3587,10 @@ export class MonitorDirector implements MonitorDriver {
 
     this.sceneHandlers.terminalInput = async (payload, runtime) => {
       this.applySceneStatus(runtime, 'terminalInput', '调用 terminal_input');
-      const { sessionId } = await this.ensureTerminalSessionReady(payload, { focusPrompt: true, activate: true });
+      const { sessionId } = await this.ensureTerminalSessionReady(payload, {
+        focusPrompt: true,
+        activate: true
+      });
       const command =
         payload?.arguments?.command ||
         payload?.arguments?.input ||
@@ -3446,7 +3600,7 @@ export class MonitorDirector implements MonitorDriver {
       await this.typeSessionCommand(sessionId, command);
       const completion = await runtime
         .waitForResult(payload.executionId || payload.id)
-        .catch(error => {
+        .catch((error) => {
           console.warn('[MonitorDirector] terminalInput waitForResult error', error);
           return null;
         });
@@ -3469,7 +3623,10 @@ export class MonitorDirector implements MonitorDriver {
 
     this.sceneHandlers.terminalSnapshot = async (payload, runtime) => {
       this.applySceneStatus(runtime, 'terminalSnapshot', '正在获取终端');
-      const { sessionId } = await this.ensureTerminalSessionReady(payload, { focusPrompt: false, activate: false });
+      const { sessionId } = await this.ensureTerminalSessionReady(payload, {
+        focusPrompt: false,
+        activate: false
+      });
       terminalMenuDebug('scene:terminalSnapshot:start', { sessionId });
       await this.openTerminalContextMenu(sessionId);
       terminalMenuDebug('scene:terminalSnapshot:menu-opened', { sessionId });
@@ -3482,14 +3639,21 @@ export class MonitorDirector implements MonitorDriver {
     this.sceneHandlers.terminalSleep = async (payload, runtime) => {
       this.applySceneStatus(runtime, 'terminalSleep', '正在等待');
       const duration =
-        Number(payload?.arguments?.duration || payload?.arguments?.seconds || payload?.seconds || payload?.duration) || 5;
+        Number(
+          payload?.arguments?.duration ||
+            payload?.arguments?.seconds ||
+            payload?.seconds ||
+            payload?.duration
+        ) || 5;
       await this.movePointerToDesktop();
       await this.click({ right: true });
       this.showContextMenu('desktop');
       await sleep(200);
       const highlighted = await this.highlightMenu('desktop', 'wait');
       if (!highlighted) {
-        const btn = this.elements.desktopMenu.querySelector<HTMLButtonElement>('button[data-action="wait"]');
+        const btn = this.elements.desktopMenu.querySelector<HTMLButtonElement>(
+          'button[data-action="wait"]'
+        );
         if (btn) {
           await this.movePointerToElement(btn, { duration: 320 });
         }
@@ -3497,7 +3661,9 @@ export class MonitorDirector implements MonitorDriver {
       await this.click();
       this.hideContextMenus();
       await sleep(140); // 等菜单完全收起后再出现等待提示
-      const waitPromise = runtime.waitForResult(payload.executionId || payload.id).catch(() => null);
+      const waitPromise = runtime
+        .waitForResult(payload.executionId || payload.id)
+        .catch(() => null);
       await this.playWaitCountdown(duration, waitPromise);
     };
 
@@ -3506,7 +3672,11 @@ export class MonitorDirector implements MonitorDriver {
     this.sceneHandlers.webSave = async (_payload, runtime) => {
       this.applySceneStatus(runtime, 'webSave', '正在保存网页');
       const targetUrl =
-        _payload?.arguments?.url || _payload?.arguments?.target_url || _payload?.result?.url || _payload?.result?.source || '';
+        _payload?.arguments?.url ||
+        _payload?.arguments?.target_url ||
+        _payload?.result?.url ||
+        _payload?.result?.source ||
+        '';
       let targetEl: HTMLLIElement | null = null;
       if (targetUrl) {
         targetEl = await this.focusSearchResultByUrl(targetUrl);
@@ -3520,7 +3690,10 @@ export class MonitorDirector implements MonitorDriver {
         await this.click({ right: true });
         this.showContextMenu('browser');
       } else {
-        await this.movePointerToElement(this.elements.browserWindow, { offsetX: 40, offsetY: -120 });
+        await this.movePointerToElement(this.elements.browserWindow, {
+          offsetX: 40,
+          offsetY: -120
+        });
         await this.click({ right: true });
         this.showContextMenu('browser');
       }
@@ -3730,7 +3903,10 @@ export class MonitorDirector implements MonitorDriver {
     const width = el.offsetWidth;
     const height = el.offsetHeight;
     const maxLeft = this.elements.screen.clientWidth - width - WINDOW_PADDING;
-    const maxTop = Math.max(WINDOW_TOP_OFFSET, this.elements.screen.clientHeight - height - WINDOW_PADDING);
+    const maxTop = Math.max(
+      WINDOW_TOP_OFFSET,
+      this.elements.screen.clientHeight - height - WINDOW_PADDING
+    );
     const clampedLeft = Math.min(Math.max(WINDOW_PADDING, left), Math.max(WINDOW_PADDING, maxLeft));
     const clampedTop = Math.min(Math.max(WINDOW_TOP_OFFSET, top), maxTop);
     return { left: clampedLeft, top: clampedTop };
@@ -3803,7 +3979,9 @@ export class MonitorDirector implements MonitorDriver {
     this.manualPositions.delete(windowEl);
     this.cancelManualDrag();
     this.closeWindow(windowEl, { animate: true });
-    this.windowOrder = this.windowOrder.filter(win => win && win !== windowEl && win.classList.contains('visible'));
+    this.windowOrder = this.windowOrder.filter(
+      (win) => win && win !== windowEl && win.classList.contains('visible')
+    );
     if (windowEl === this.elements.terminalWindow) {
       this.activeTerminalSessionId = null;
       return;
@@ -3825,10 +4003,17 @@ export class MonitorDirector implements MonitorDriver {
 
   private async movePointerToDesktop() {
     this.refreshScreenRect();
-    return this.movePointerToElement(this.elements.desktopGrid, { offsetX: 160, offsetY: 120, duration: 700 });
+    return this.movePointerToElement(this.elements.desktopGrid, {
+      offsetX: 160,
+      offsetY: 120,
+      duration: 700
+    });
   }
 
-  private async movePointerToElement(target: Element | null, options: { offsetX?: number; offsetY?: number; duration?: number } = {}) {
+  private async movePointerToElement(
+    target: Element | null,
+    options: { offsetX?: number; offsetY?: number; duration?: number } = {}
+  ) {
     if (!target) {
       return;
     }
@@ -3841,7 +4026,8 @@ export class MonitorDirector implements MonitorDriver {
       this.dismissBubble(true);
     } else {
       progressDebug('movePointer:preserve-progress', {
-        target: target instanceof HTMLElement ? target.className || target.tagName : target?.toString()
+        target:
+          target instanceof HTMLElement ? target.className || target.tagName : target?.toString()
       });
     }
     const { offsetX = 0, offsetY = 0, duration = 900 } = options;
@@ -3962,7 +4148,7 @@ export class MonitorDirector implements MonitorDriver {
     if (typeof ResizeObserver === 'undefined') {
       return;
     }
-    this.screenObserver = new ResizeObserver(entries => {
+    this.screenObserver = new ResizeObserver((entries) => {
       const entry = Array.isArray(entries) ? entries[0] : null;
       const width = entry?.contentRect?.width || this.elements.screen.clientWidth;
       const height = entry?.contentRect?.height || this.elements.screen.clientHeight;
@@ -3993,7 +4179,9 @@ export class MonitorDirector implements MonitorDriver {
     if (!el) {
       return;
     }
-    this.windowOrder = this.windowOrder.filter(win => win && win !== el && win.classList.contains('visible'));
+    this.windowOrder = this.windowOrder.filter(
+      (win) => win && win !== el && win.classList.contains('visible')
+    );
     this.windowOrder.push(el);
     this.enforceWindowLimit();
     this.updateWindowZIndices();
@@ -4003,7 +4191,7 @@ export class MonitorDirector implements MonitorDriver {
     if (!this.windowOrder.length) {
       return;
     }
-    this.windowOrder = this.windowOrder.filter(win => win && win.classList.contains('visible'));
+    this.windowOrder = this.windowOrder.filter((win) => win && win.classList.contains('visible'));
     while (this.windowOrder.length > this.maxVisibleWindows) {
       const stale = this.windowOrder.shift();
       if (stale) {
@@ -4031,7 +4219,7 @@ export class MonitorDirector implements MonitorDriver {
     if (isFolderWindow) {
       this.activeFolder = null;
     }
-    this.windowOrder = this.windowOrder.filter(win => win && win !== el);
+    this.windowOrder = this.windowOrder.filter((win) => win && win !== el);
     const animate = options.animate ?? false;
     if (!animate) {
       el.classList.remove('visible', 'closing');
@@ -4057,7 +4245,9 @@ export class MonitorDirector implements MonitorDriver {
   private raiseWindowForTarget(target: Element | null) {
     const ancestor = this.findWindowAncestor(target);
     if (ancestor) {
-      this.windowOrder = this.windowOrder.filter(win => win && win !== ancestor && win.classList.contains('visible'));
+      this.windowOrder = this.windowOrder.filter(
+        (win) => win && win !== ancestor && win.classList.contains('visible')
+      );
       this.windowOrder.push(ancestor);
       this.enforceWindowLimit();
       this.updateWindowZIndices();
@@ -4106,9 +4296,9 @@ export class MonitorDirector implements MonitorDriver {
       this.elements.focusMenu,
       this.elements.browserMenu,
       this.elements.terminalMenu
-    ].forEach(menu => {
+    ].forEach((menu) => {
       menu.classList.remove('visible');
-      menu.querySelectorAll('button').forEach(btn => btn.classList.remove('active'));
+      menu.querySelectorAll('button').forEach((btn) => btn.classList.remove('active'));
     });
     this.hideSecondaryMenu();
     this.hideWaitOverlay();
@@ -4122,14 +4312,17 @@ export class MonitorDirector implements MonitorDriver {
     this.secondaryMenu = null;
   }
 
-  private showSecondaryMenu(anchorMenu: HTMLElement | null, items: Array<{ label: string; action: string }>) {
+  private showSecondaryMenu(
+    anchorMenu: HTMLElement | null,
+    items: Array<{ label: string; action: string }>
+  ) {
     this.hideSecondaryMenu();
     if (!anchorMenu || !items.length) {
       return null;
     }
     const menu = document.createElement('div');
     menu.className = 'context-menu secondary-menu visible';
-    items.forEach(item => {
+    items.forEach((item) => {
       const btn = document.createElement('button');
       btn.textContent = item.label;
       btn.dataset.action = item.action;
@@ -4139,12 +4332,17 @@ export class MonitorDirector implements MonitorDriver {
     const rect = anchorMenu.getBoundingClientRect();
     const left = rect.right - this.screenRect.left + 10;
     const top = rect.top - this.screenRect.top + 4;
-    const { x, y } = this.clampToScreen(left, top, menu.offsetWidth || 180, menu.offsetHeight || 60);
+    const { x, y } = this.clampToScreen(
+      left,
+      top,
+      menu.offsetWidth || 180,
+      menu.offsetHeight || 60
+    );
     menu.style.left = `${x}px`;
     menu.style.top = `${y}px`;
     this.secondaryMenu = menu;
     monitorLifecycleDebug('secondaryMenu:show', {
-      items: items.map(item => item.action),
+      items: items.map((item) => item.action),
       anchorRect: { left: rect.left, top: rect.top, width: rect.width, height: rect.height },
       pos: { x, y }
     });
@@ -4152,12 +4350,19 @@ export class MonitorDirector implements MonitorDriver {
   }
 
   private async chooseSecondaryMenuAction(action: string) {
-    const btn = this.secondaryMenu?.querySelector<HTMLButtonElement>(`button[data-action="${action}"]`) || null;
+    const btn =
+      this.secondaryMenu?.querySelector<HTMLButtonElement>(`button[data-action="${action}"]`) ||
+      null;
     if (!btn) {
       monitorLifecycleDebug('secondaryMenu:missing-btn', { action, hasMenu: !!this.secondaryMenu });
       return false;
     }
-    monitorLifecycleDebug('secondaryMenu:choose', { action, rect: btn.getBoundingClientRect().toJSON ? btn.getBoundingClientRect().toJSON() : btn.getBoundingClientRect() });
+    monitorLifecycleDebug('secondaryMenu:choose', {
+      action,
+      rect: btn.getBoundingClientRect().toJSON
+        ? btn.getBoundingClientRect().toJSON()
+        : btn.getBoundingClientRect()
+    });
     await this.movePointerToElement(btn, { duration: 320 });
     btn.classList.add('active');
     await sleep(200);
@@ -4207,7 +4412,11 @@ export class MonitorDirector implements MonitorDriver {
       terminalMenuDebug('openContextMenu:tab-rect', { sessionId, rect, coords });
     } else {
       terminalMenuDebug('openContextMenu:no-tab', { sessionId });
-      await this.movePointerToElement(this.elements.terminalWindow, { offsetX: 18, offsetY: 0, duration: 420 });
+      await this.movePointerToElement(this.elements.terminalWindow, {
+        offsetX: 18,
+        offsetY: 0,
+        duration: 420
+      });
       await this.click({ right: true });
     }
     this.terminalContextSessionId = sessionId;
@@ -4236,7 +4445,9 @@ export class MonitorDirector implements MonitorDriver {
       btn.classList.remove('active');
       terminalMenuDebug('chooseMenuAction:target', {
         action,
-        rect: btn.getBoundingClientRect().toJSON ? btn.getBoundingClientRect().toJSON() : btn.getBoundingClientRect()
+        rect: btn.getBoundingClientRect().toJSON
+          ? btn.getBoundingClientRect().toJSON()
+          : btn.getBoundingClientRect()
       });
     } else {
       const highlighted = await this.highlightMenu('terminal', action);
@@ -4261,7 +4472,10 @@ export class MonitorDirector implements MonitorDriver {
     while (!menu.classList.contains('visible') && performance.now() - start < timeout) {
       await sleep(16);
     }
-    monitorLifecycleDebug('menu:visible-check', { hasMenu: !!menu, visible: menu.classList.contains('visible') });
+    monitorLifecycleDebug('menu:visible-check', {
+      hasMenu: !!menu,
+      visible: menu.classList.contains('visible')
+    });
     return menu.classList.contains('visible');
   }
 
@@ -4318,7 +4532,7 @@ export class MonitorDirector implements MonitorDriver {
     };
     this.waitOverlayTimer = window.setInterval(update, 260);
     const done = until || Promise.resolve();
-    const minDuration = new Promise(resolve => setTimeout(resolve, total * 1000));
+    const minDuration = new Promise((resolve) => setTimeout(resolve, total * 1000));
     try {
       await Promise.all([done.catch(() => null), minDuration]);
     } finally {
@@ -4419,7 +4633,7 @@ export class MonitorDirector implements MonitorDriver {
     this.refreshFolderIconStates();
   }
 
-  private setFolderIconState(folderName: string, open: boolean) {
+  private setFolderIconState(folderName: string) {
     if (!folderName) {
       return;
     }
@@ -4440,8 +4654,8 @@ export class MonitorDirector implements MonitorDriver {
     if (!list) {
       return;
     }
-    const entry = list.find(item => item.name === entryName) || null;
-    const next = list.filter(item => item.name !== entryName);
+    const entry = list.find((item) => item.name === entryName) || null;
+    const next = list.filter((item) => item.name !== entryName);
     this.folderEntries.set(folderName, next);
     if (entry?.type === 'folder') {
       const key = this.composePath([folderName, entryName].filter(Boolean));
@@ -4460,12 +4674,17 @@ export class MonitorDirector implements MonitorDriver {
     this.refreshFolderIconStates();
   }
 
-  private renameFolderEntry(folderName: string, fromName: string, toName: string, options: { skipRender?: boolean } = {}) {
+  private renameFolderEntry(
+    folderName: string,
+    fromName: string,
+    toName: string,
+    options: { skipRender?: boolean } = {}
+  ) {
     const entries = this.folderEntries.get(folderName);
     if (!entries) {
       return;
     }
-    const entry = entries.find(item => item.name === fromName);
+    const entry = entries.find((item) => item.name === fromName);
     if (entry) {
       entry.name = toName;
       entry.path = this.composePath([folderName, toName].filter(Boolean));
@@ -4517,7 +4736,11 @@ export class MonitorDirector implements MonitorDriver {
     renameDebug('animate:end', { final: span.textContent });
   }
 
-  private renameDesktopRoot(fromName: string, toName: string, options: { skipRender?: boolean } = {}) {
+  private renameDesktopRoot(
+    fromName: string,
+    toName: string,
+    options: { skipRender?: boolean } = {}
+  ) {
     if (!fromName || !toName || fromName === toName) {
       return;
     }
@@ -4532,8 +4755,10 @@ export class MonitorDirector implements MonitorDriver {
     this.folderEntries.forEach((entries, key) => {
       if (key === fromName || key.startsWith(`${fromName}/`)) {
         const newKey = toName + key.slice(fromName.length);
-        const mapped = entries.map(item => {
-          const nextPath = item.path.startsWith(fromName) ? toName + item.path.slice(fromName.length) : item.path;
+        const mapped = entries.map((item) => {
+          const nextPath = item.path.startsWith(fromName)
+            ? toName + item.path.slice(fromName.length)
+            : item.path;
           return { ...item, path: nextPath };
         });
         updatedEntries.set(newKey, mapped);
@@ -4559,7 +4784,6 @@ export class MonitorDirector implements MonitorDriver {
     }
   }
 
-
   private openEditorWindow(filename: string) {
     this.showWindow(this.elements.editorWindow);
     this.elements.editorHeaderText.textContent = filename;
@@ -4655,7 +4879,11 @@ export class MonitorDirector implements MonitorDriver {
         }
       );
       if (!response.ok) {
-        editorDebug('snapshotFetch:http-error', { executionId: key, stage, status: response.status });
+        editorDebug('snapshotFetch:http-error', {
+          executionId: key,
+          stage,
+          status: response.status
+        });
         return null;
       }
       const data = await response.json().catch(() => null);
@@ -4733,7 +4961,12 @@ export class MonitorDirector implements MonitorDriver {
     });
   }
 
-  private buildEditorLineElement(text: string, index: number, extraClass?: string, options?: { prefill?: boolean }) {
+  private buildEditorLineElement(
+    text: string,
+    index: number,
+    extraClass?: string,
+    options?: { prefill?: boolean }
+  ) {
     const row = document.createElement('div');
     const classes = ['code-line'];
     if (extraClass) {
@@ -4806,10 +5039,7 @@ export class MonitorDirector implements MonitorDriver {
       return;
     }
     // - ≤8 行：保留原逐字符/行内阈值逻辑
-    if (
-      currentLines.length > EDITOR_DIFF_LIMIT ||
-      targetLines.length > EDITOR_DIFF_LIMIT
-    ) {
+    if (currentLines.length > EDITOR_DIFF_LIMIT || targetLines.length > EDITOR_DIFF_LIMIT) {
       editorDebug('animate:skip-large', {
         currentLines: currentLines.length,
         targetLines: targetLines.length
@@ -4928,7 +5158,7 @@ export class MonitorDirector implements MonitorDriver {
     const operations: EditorOperation[] = [];
     const working = before.slice();
     let pointer = 0;
-    rawOps.forEach(op => {
+    rawOps.forEach((op) => {
       if (op.type === 'keep') {
         pointer += 1;
         return;
@@ -5084,10 +5314,16 @@ export class MonitorDirector implements MonitorDriver {
     }
   }
 
-  private async typeLineText(target: HTMLElement, text: string, options: { instant?: boolean } = {}) {
+  private async typeLineText(
+    target: HTMLElement,
+    text: string,
+    options: { instant?: boolean } = {}
+  ) {
     const normalized = text && text.length ? text : ' ';
     const shouldInstant =
-      typeof options.instant === 'boolean' ? options.instant : normalized.length > EDITOR_TYPING_THRESHOLD;
+      typeof options.instant === 'boolean'
+        ? options.instant
+        : normalized.length > EDITOR_TYPING_THRESHOLD;
     target.textContent = '';
     if (shouldInstant) {
       target.textContent = normalized;
@@ -5116,7 +5352,9 @@ export class MonitorDirector implements MonitorDriver {
       return;
     }
     const shouldInstant =
-      typeof options.instant === 'boolean' ? options.instant : current.length > EDITOR_TYPING_THRESHOLD;
+      typeof options.instant === 'boolean'
+        ? options.instant
+        : current.length > EDITOR_TYPING_THRESHOLD;
     if (shouldInstant) {
       target.textContent = '';
       await sleep(60);
@@ -5260,7 +5498,9 @@ export class MonitorDirector implements MonitorDriver {
   }
 
   private clearResultTargets() {
-    this.elements.browserResults.querySelectorAll('.target').forEach(node => node.classList.remove('target'));
+    this.elements.browserResults
+      .querySelectorAll('.target')
+      .forEach((node) => node.classList.remove('target'));
   }
 
   private renderSearchResults(results: any[]) {
@@ -5274,7 +5514,7 @@ export class MonitorDirector implements MonitorDriver {
       empty.textContent = '暂无搜索结果';
       this.elements.browserResults.appendChild(empty);
     } else {
-      subset.forEach(result => {
+      subset.forEach((result) => {
         const li = document.createElement('li');
         const title = document.createElement('strong');
         const url = typeof result?.url === 'string' ? result.url : '';
@@ -5299,7 +5539,10 @@ export class MonitorDirector implements MonitorDriver {
     }
   }
 
-  private renderExtractionSummary(target: HTMLElement, result: any): { hasContent: boolean; hasError: boolean } {
+  private renderExtractionSummary(
+    target: HTMLElement,
+    result: any
+  ): { hasContent: boolean; hasError: boolean } {
     if (!target) {
       return { hasContent: false, hasError: false };
     }
@@ -5321,7 +5564,7 @@ export class MonitorDirector implements MonitorDriver {
     const sections = this.normalizeExtractionSections(result);
     if (sections.length) {
       hasContent = true;
-      sections.forEach(section => {
+      sections.forEach((section) => {
         const block = document.createElement('div');
         block.className = 'extract-block';
         if (section.title || section.url) {
@@ -5351,7 +5594,7 @@ export class MonitorDirector implements MonitorDriver {
       ? (result.failed_results as Array<Record<string, any>>)
       : [];
     if (failedList.length) {
-      failedList.slice(0, 2).forEach(item => {
+      failedList.slice(0, 2).forEach((item) => {
         appendMessage(`⚠️ ${item?.url || 'URL'}: ${item?.error || '提取失败'}`);
       });
     }
@@ -5388,7 +5631,10 @@ export class MonitorDirector implements MonitorDriver {
         return String(value);
       }
       if (Array.isArray(value)) {
-        return value.map(item => pickText(item)).filter(Boolean).join('\n\n');
+        return value
+          .map((item) => pickText(item))
+          .filter(Boolean)
+          .join('\n\n');
       }
       if (typeof value === 'object') {
         const priorityKeys = [
@@ -5413,7 +5659,10 @@ export class MonitorDirector implements MonitorDriver {
           }
         }
         if (Array.isArray(value.sections)) {
-          return value.sections.map((section: any) => pickText(section)).filter(Boolean).join('\n\n');
+          return value.sections
+            .map((section: any) => pickText(section))
+            .filter(Boolean)
+            .join('\n\n');
         }
       }
       return '';
@@ -5450,7 +5699,11 @@ export class MonitorDirector implements MonitorDriver {
     return sections;
   }
 
-  private resolveExtractionStatus(completion: any, payload: any, result: any): 'completed' | 'failed' | null {
+  private resolveExtractionStatus(
+    completion: any,
+    payload: any,
+    result: any
+  ): 'completed' | 'failed' | null {
     const statusCandidate = (completion?.status || payload?.status || '').toString().toLowerCase();
     if (statusCandidate === 'completed') {
       return 'completed';
@@ -5508,7 +5761,7 @@ export class MonitorDirector implements MonitorDriver {
       payload?.arguments?.target_path,
       fallback
     ];
-    const resolved = candidates.find(path => typeof path === 'string' && path.trim().length);
+    const resolved = candidates.find((path) => typeof path === 'string' && path.trim().length);
     return resolved || fallback;
   }
 
@@ -5516,7 +5769,11 @@ export class MonitorDirector implements MonitorDriver {
    * 工具失败时统一弹出红色气泡并终止后续动画。
    * 返回 true 表示成功可继续，false 表示已提示错误应中断。
    */
-  private ensureSuccessOrErrorBubble(completion: any, payload?: any, fallbackMessage = '工具执行错误'): boolean {
+  private ensureSuccessOrErrorBubble(
+    completion: any,
+    payload?: any,
+    fallbackMessage = '工具执行错误'
+  ): boolean {
     const ok = this.toolResultSucceeded(completion ?? payload ?? null);
     if (ok) {
       return true;
@@ -5533,7 +5790,7 @@ export class MonitorDirector implements MonitorDriver {
 
   private normalizeLines(content: any): string[] {
     if (typeof content === 'string') {
-      const parts = content.split(/\r?\n/).map(line => line.replace(/\t/g, '    '));
+      const parts = content.split(/\r?\n/).map((line) => line.replace(/\t/g, '    '));
       return parts.length ? parts : [''];
     }
     if (typeof content === 'number') {
@@ -5541,11 +5798,12 @@ export class MonitorDirector implements MonitorDriver {
     }
     if (Array.isArray(content)) {
       const lines: string[] = [];
-      content.forEach(item => {
+      content.forEach((item) => {
         if (typeof item === 'string' || typeof item === 'number') {
           lines.push(String(item));
         } else if (item && typeof item === 'object') {
-          const text = item.content || item.text || (Array.isArray(item.lines) ? item.lines.join('\n') : '');
+          const text =
+            item.content || item.text || (Array.isArray(item.lines) ? item.lines.join('\n') : '');
           if (text) {
             lines.push(...this.normalizeLines(text));
           }
@@ -5594,7 +5852,10 @@ export class MonitorDirector implements MonitorDriver {
     });
   }
 
-  private resolveReaderPayload(payload: any, completion: any): { source: any; label: string | null } {
+  private resolveReaderPayload(
+    payload: any,
+    completion: any
+  ): { source: any; label: string | null } {
     const candidates = [
       { label: 'completion.result', value: completion?.result },
       { label: 'completion.result.tool_payload', value: completion?.result?.tool_payload },
@@ -5699,7 +5960,7 @@ export class MonitorDirector implements MonitorDriver {
     this.elements.readerOcr.innerHTML = '';
     const normalized = this.normalizeLines(lines);
     const segments = (normalized.length ? normalized : ['OCR 内容就绪']).slice(0, 6);
-    segments.forEach(line => {
+    segments.forEach((line) => {
       const p = document.createElement('p');
       p.textContent = line;
       this.elements.readerOcr.appendChild(p);
@@ -5730,7 +5991,10 @@ export class MonitorDirector implements MonitorDriver {
     });
 
     if (typeof source === 'string' || Array.isArray(source)) {
-      const lines = this.normalizeLines(source).map((text, index) => ({ text, lineNumber: index + 1 }));
+      const lines = this.normalizeLines(source).map((text, index) => ({
+        text,
+        lineNumber: index + 1
+      }));
       readerDebug('extractReaderLines:string/array', { count: lines.length });
       return lines;
     }
@@ -5855,7 +6119,11 @@ export class MonitorDirector implements MonitorDriver {
   private findTodoItemByText(text?: string | null): HTMLElement | null {
     if (!text) return null;
     const target = (text || '').trim();
-    return this.getTodoItems().find(item => item.querySelector('.todo-text')?.textContent?.trim() === target) || null;
+    return (
+      this.getTodoItems().find(
+        (item) => item.querySelector('.todo-text')?.textContent?.trim() === target
+      ) || null
+    );
   }
 
   private findTodoItemByIndex(index?: number | null): HTMLElement | null {
@@ -5868,7 +6136,7 @@ export class MonitorDirector implements MonitorDriver {
   private normalizeTodoTasks(raw: any): Array<{ text: string; done?: boolean }> {
     if (Array.isArray(raw)) {
       return raw
-        .map(item => {
+        .map((item) => {
           if (typeof item === 'string') return { text: item, done: false };
           if (item && typeof item === 'object') {
             const text = String(item.title || item.task || item.text || '').trim();
@@ -5913,7 +6181,7 @@ export class MonitorDirector implements MonitorDriver {
   private renderTodoItems(items: Array<{ text: string; done?: boolean }>) {
     if (!this.elements.todoList) return;
     this.elements.todoList.innerHTML = '';
-    items.forEach(task => {
+    items.forEach((task) => {
       const card = this.createTodoItem(task.text, !!task.done);
       card.classList.add('visible');
       this.elements.todoList.appendChild(card);
@@ -5954,7 +6222,10 @@ export class MonitorDirector implements MonitorDriver {
     }
   }
 
-  private async animateTodoAppend(task: { text: string; done?: boolean }, options: { scrollIntoView?: boolean } = {}) {
+  private async animateTodoAppend(
+    task: { text: string; done?: boolean },
+    options: { scrollIntoView?: boolean } = {}
+  ) {
     if (!this.elements.todoList) return;
     const { scrollIntoView = false } = options;
     const card = this.createTodoItem(task.text, !!task.done);
@@ -5966,7 +6237,10 @@ export class MonitorDirector implements MonitorDriver {
     await sleep(180);
   }
 
-  private async scrollTodoItemIntoView(card: HTMLElement | null, options: { waitMs?: number } = {}) {
+  private async scrollTodoItemIntoView(
+    card: HTMLElement | null,
+    options: { waitMs?: number } = {}
+  ) {
     if (!card || !this.elements.todoList) return;
     const body = this.elements.todoList;
     const margin = 8;
@@ -5991,7 +6265,9 @@ export class MonitorDirector implements MonitorDriver {
 
     // 计算需要滚动的位置（基于相对坐标，避免 offsetParent 不一致的问题）
     const needsScrollDown = relBottom > viewBottom - margin;
-    const targetTop = needsScrollDown ? relBottom - body.clientHeight + margin : Math.max(0, relTop - margin);
+    const targetTop = needsScrollDown
+      ? relBottom - body.clientHeight + margin
+      : Math.max(0, relTop - margin);
     const clampedTop = Math.max(0, targetTop);
 
     body.scrollTo({ top: clampedTop, behavior: 'smooth' });
diff --git a/static/src/components/chat/monitor/types.ts b/static/src/components/chat/monitor/types.ts
index e694e43..c2d6363 100644
--- a/static/src/components/chat/monitor/types.ts
+++ b/static/src/components/chat/monitor/types.ts
@@ -29,7 +29,11 @@ export interface MonitorDriver {
   showThinkingBubble(): void;
   hideBubble(): void;
   previewSceneProgress(name: string): void;
-  playScene(name: string, payload: Record<string, any>, runtime: MonitorSceneRuntime): Promise<void>;
+  playScene(
+    name: string,
+    payload: Record<string, any>,
+    runtime: MonitorSceneRuntime
+  ): Promise<void>;
   destroy(): void;
   preparePendingCreation?(path?: string | null): void;
 }
diff --git a/static/src/components/files/FileNode.vue b/static/src/components/files/FileNode.vue
index 0691837..d0fcd4b 100644
--- a/static/src/components/files/FileNode.vue
+++ b/static/src/components/files/FileNode.vue
@@ -3,7 +3,11 @@
     <div v-if="node.type === 'folder'" class="file-node folder-node">
       <button class="folder-header" type="button" :style="folderPadding" @click="toggle">
         <span class="folder-arrow">{{ isExpanded ? '▾' : '▸' }}</span>
-        <span class="icon icon-sm folder-icon" :style="iconStyle(isExpanded ? 'folderOpen' : 'folder')" aria-hidden="true"></span>
+        <span
+          class="icon icon-sm folder-icon"
+          :style="iconStyle(isExpanded ? 'folderOpen' : 'folder')"
+          aria-hidden="true"
+        ></span>
         <span class="folder-name">{{ node.name }}</span>
       </button>
       <div v-show="isExpanded" class="folder-children">
diff --git a/static/src/components/input/InputComposer.vue b/static/src/components/input/InputComposer.vue
index de2cf3a..a37404c 100644
--- a/static/src/components/input/InputComposer.vue
+++ b/static/src/components/input/InputComposer.vue
@@ -10,18 +10,43 @@
           'has-text': (inputMessage || '').trim().length > 0
         }"
       >
-        <input type="file" ref="fileUploadInput" class="file-input-hidden" multiple @change="onFileChange" />
+        <input
+          type="file"
+          ref="fileUploadInput"
+          class="file-input-hidden"
+          multiple
+          @change="onFileChange"
+        />
         <div class="input-stack">
           <div v-if="selectedImages && selectedImages.length" class="image-inline-row">
             <div class="image-thumbnail-wrapper" v-for="img in selectedImages" :key="img">
               <img :src="getPreviewUrl(img)" :alt="formatImageName(img)" class="image-thumbnail" />
-              <button type="button" class="image-remove-btn-hover" @click.stop="$emit('remove-image', img)">×</button>
+              <button
+                type="button"
+                class="image-remove-btn-hover"
+                @click.stop="$emit('remove-image', img)"
+              >
+                ×
+              </button>
             </div>
           </div>
-          <div v-if="selectedVideos && selectedVideos.length" class="image-inline-row video-inline-row">
+          <div
+            v-if="selectedVideos && selectedVideos.length"
+            class="image-inline-row video-inline-row"
+          >
             <div class="image-thumbnail-wrapper" v-for="video in selectedVideos" :key="video">
-              <img :src="getPreviewUrl(video)" :alt="formatImageName(video)" class="image-thumbnail" />
-              <button type="button" class="image-remove-btn-hover" @click.stop="$emit('remove-video', video)">×</button>
+              <img
+                :src="getPreviewUrl(video)"
+                :alt="formatImageName(video)"
+                class="image-thumbnail"
+              />
+              <button
+                type="button"
+                class="image-remove-btn-hover"
+                @click.stop="$emit('remove-video', video)"
+              >
+                ×
+              </button>
             </div>
           </div>
           <div class="input-row">
@@ -54,7 +79,10 @@
                 !isConnected ||
                 (inputLocked && !streamingMessage) ||
                 (mediaUploading && !streamingMessage) ||
-                ((!(inputMessage || '').trim() && (!selectedImages?.length && !selectedVideos?.length)) && !streamingMessage)
+                (!(inputMessage || '').trim() &&
+                  !selectedImages?.length &&
+                  !selectedVideos?.length &&
+                  !streamingMessage)
               "
             >
               <span v-if="streamingMessage" class="stop-icon"></span>
@@ -165,7 +193,14 @@ const props = defineProps<{
   currentConversationId: string | null;
   iconStyle: (key: string) => Record<string, string>;
   toolCategoryIcon: (categoryId: string) => string;
-  modelOptions: Array<{ key: string; label: string; description: string; disabled?: boolean; supportsImage?: boolean; supportsVideo?: boolean }>;
+  modelOptions: Array<{
+    key: string;
+    label: string;
+    description: string;
+    disabled?: boolean;
+    supportsImage?: boolean;
+    supportsVideo?: boolean;
+  }>;
   currentModelKey: string;
   selectedImages?: string[];
   selectedVideos?: string[];
diff --git a/static/src/components/input/QuickMenu.vue b/static/src/components/input/QuickMenu.vue
index 9e515ab..a4ddd14 100644
--- a/static/src/components/input/QuickMenu.vue
+++ b/static/src/components/input/QuickMenu.vue
@@ -60,7 +60,6 @@
         <span class="entry-arrow">›</span>
       </button>
 
-
       <transition name="submenu-slide">
         <div class="quick-submenu tool-submenu" v-if="toolMenuOpen">
           <div class="submenu-status" v-if="toolSettingsLoading">正在同步工具状态...</div>
@@ -76,13 +75,15 @@
               :disabled="streamingMessage || !isConnected || toolSettingsLoading"
             >
               <span class="submenu-label icon-label">
-                <span class="icon icon-sm" :style="getIconStyle(toolCategoryIcon(category.id))" aria-hidden="true"></span>
+                <span
+                  class="icon icon-sm"
+                  :style="getIconStyle(toolCategoryIcon(category.id))"
+                  aria-hidden="true"
+                ></span>
                 <span>{{ category.label }}</span>
               </span>
               <span class="entry-arrow">
-                <template v-if="category.locked">
-                  被管理员锁定
-                </template>
+                <template v-if="category.locked"> 被管理员锁定 </template>
                 <template v-else>
                   {{ category.enabled ? '禁用' : '启用' }}
                 </template>
@@ -149,7 +150,14 @@ const props = defineProps<{
   modeMenuOpen: boolean;
   runMode?: 'fast' | 'thinking' | 'deep';
   modelMenuOpen: boolean;
-  modelOptions: Array<{ key: string; label: string; description: string; disabled?: boolean; supportsImage?: boolean; supportsVideo?: boolean }>;
+  modelOptions: Array<{
+    key: string;
+    label: string;
+    description: string;
+    disabled?: boolean;
+    supportsImage?: boolean;
+    supportsVideo?: boolean;
+  }>;
   currentModelKey: string;
   blockUpload?: boolean;
   blockToolToggle?: boolean;
@@ -176,41 +184,15 @@ defineEmits<{
   (event: 'pick-video'): void;
 }>();
 
-const runModeOptions = [
-  { value: 'fast', label: '快速模式' },
-  { value: 'thinking', label: '思考模式' },
-  { value: 'deep', label: '深度思考模式' }
-] as const;
-
-const runModeLabelMap: Record<'fast' | 'thinking' | 'deep', string> = {
-  fast: '快速模式',
-  thinking: '思考模式',
-  deep: '深度思考'
-};
-
-const resolvedRunMode = computed<'fast' | 'thinking' | 'deep'>(() => {
-  if (props.runMode === 'deep' || props.runMode === 'thinking' || props.runMode === 'fast') {
-    return props.runMode;
-  }
-  return props.thinkingMode ? 'thinking' : 'fast';
-});
-
-const runModeLabel = computed(() => runModeLabelMap[resolvedRunMode.value]);
-
 const getIconStyle = (key: string) => (props.iconStyle ? props.iconStyle(key) : {});
 
-const currentModelLabel = computed(() => {
-  const found = props.modelOptions?.find(m => m.key === props.currentModelKey);
-  return found ? found.label : '未选择';
-});
-
 const currentModelSupportsImage = computed(() => {
-  const found = props.modelOptions?.find(m => m.key === props.currentModelKey) as any;
+  const found = props.modelOptions?.find((m) => m.key === props.currentModelKey) as any;
   return !!found?.supportsImage;
 });
 
 const currentModelSupportsVideo = computed(() => {
-  const found = props.modelOptions?.find(m => m.key === props.currentModelKey) as any;
+  const found = props.modelOptions?.find((m) => m.key === props.currentModelKey) as any;
   return !!found?.supportsVideo;
 });
 </script>
diff --git a/static/src/components/overlay/BackgroundCommandDialog.vue b/static/src/components/overlay/BackgroundCommandDialog.vue
index 9f61029..e7ad277 100644
--- a/static/src/components/overlay/BackgroundCommandDialog.vue
+++ b/static/src/components/overlay/BackgroundCommandDialog.vue
@@ -3,16 +3,20 @@
     <div v-if="activeCommand" class="subagent-activity-overlay" @click.self="close">
       <div class="subagent-activity-modal bg-command-modal">
         <div class="subagent-activity-header">
-          <div class="subagent-activity-title">
-            后台指令 {{ activeCommand.command_id }}
-          </div>
+          <div class="subagent-activity-title">后台指令 {{ activeCommand.command_id }}</div>
           <button type="button" class="subagent-activity-close" @click="close">×</button>
         </div>
         <div class="subagent-activity-meta">
-          <span class="subagent-activity-status" :class="activeDetail?.status || activeCommand.status || ''">
+          <span
+            class="subagent-activity-status"
+            :class="activeDetail?.status || activeCommand.status || ''"
+          >
             {{ activeDetail?.status || activeCommand.status || 'running' }}
           </span>
-          <span class="subagent-activity-summary" v-if="activeDetail?.command || activeCommand.command">
+          <span
+            class="subagent-activity-summary"
+            v-if="activeDetail?.command || activeCommand.command"
+          >
             {{ activeDetail?.command || activeCommand.command }}
           </span>
         </div>
diff --git a/static/src/components/overlay/ConversationReviewDialog.vue b/static/src/components/overlay/ConversationReviewDialog.vue
index 2c2f970..61155e1 100644
--- a/static/src/components/overlay/ConversationReviewDialog.vue
+++ b/static/src/components/overlay/ConversationReviewDialog.vue
@@ -8,7 +8,9 @@
         </div>
         <div class="header-actions">
           <div v-if="generatedPath" class="hint">已生成 {{ generatedPath }}</div>
-          <button type="button" class="ghost-btn" @click="$emit('close')" :disabled="submitting">关闭</button>
+          <button type="button" class="ghost-btn" @click="$emit('close')" :disabled="submitting">
+            关闭
+          </button>
         </div>
       </div>
 
@@ -63,7 +65,9 @@
         <div class="review-right">
           <div class="preview-header">
             <span>预览（前 {{ previewLimit }} 条）</span>
-            <span v-if="preview && preview.length" class="preview-count">{{ preview.length }} 条</span>
+            <span v-if="preview && preview.length" class="preview-count"
+              >{{ preview.length }} 条</span
+            >
           </div>
           <div class="preview-box" :class="{ loading: previewLoading }">
             <div v-if="previewLoading" class="placeholder">
@@ -90,7 +94,11 @@
 
       <div class="review-footer">
         <label class="toggle-send">
-          <input type="checkbox" :checked="sendToModel" @change="$emit('toggle-send', ($event.target as HTMLInputElement).checked)" />
+          <input
+            type="checkbox"
+            :checked="sendToModel"
+            @change="$emit('toggle-send', ($event.target as HTMLInputElement).checked)"
+          />
           <span class="switch"></span>
           <span class="label">是否发送给模型</span>
         </label>
@@ -110,7 +118,7 @@
 <script setup lang="ts">
 defineOptions({ name: 'ConversationReviewDialog' });
 
-const props = defineProps<{
+defineProps<{
   open: boolean;
   conversations: Array<{
     id: string;
@@ -134,9 +142,9 @@ const props = defineProps<{
 }>();
 
 const icons = {
-  loading: new URL('../../icons/clock.svg', import.meta.url).href,
-  error: new URL('../../icons/triangle-alert.svg', import.meta.url).href,
-  empty: new URL('../../icons/file.svg', import.meta.url).href
+  loading: new URL('../../../icons/clock.svg', import.meta.url).href,
+  error: new URL('../../../icons/triangle-alert.svg', import.meta.url).href,
+  empty: new URL('../../../icons/file.svg', import.meta.url).href
 };
 
 defineEmits<{
@@ -277,7 +285,10 @@ const formatUpdatedAt = (value: string | number) => {
   border-radius: 10px;
   padding: 14px 14px;
   cursor: pointer;
-  transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease;
+  transition:
+    border-color 0.15s ease,
+    box-shadow 0.15s ease,
+    transform 0.15s ease;
   overflow: hidden;
   min-height: 64px;
   line-height: 1.4;
@@ -443,7 +454,10 @@ const formatUpdatedAt = (value: string | number) => {
   padding: 10px 18px;
   font-weight: 600;
   font-size: 14px;
-  transition: transform 0.12s ease, box-shadow 0.12s ease, background 0.12s ease;
+  transition:
+    transform 0.12s ease,
+    box-shadow 0.12s ease,
+    background 0.12s ease;
 }
 
 .toggle-send {
diff --git a/static/src/components/overlay/ImagePicker.vue b/static/src/components/overlay/ImagePicker.vue
index cf63ab6..8250d2e 100644
--- a/static/src/components/overlay/ImagePicker.vue
+++ b/static/src/components/overlay/ImagePicker.vue
@@ -1,16 +1,11 @@
 <template>
   <transition name="overlay-fade">
-      <div v-if="open" class="image-picker-backdrop" @click.self="close">
+    <div v-if="open" class="image-picker-backdrop" @click.self="close">
       <div class="image-picker-panel">
         <div class="header">
           <div class="header-left">
             <div class="title">选择图片（最多9张）</div>
-            <button
-              type="button"
-              class="local-btn"
-              :disabled="uploading"
-              @click="triggerLocal"
-            >
+            <button type="button" class="local-btn" :disabled="uploading" @click="triggerLocal">
               {{ uploading ? '上传中...' : '从本地发送' }}
             </button>
             <input
@@ -25,30 +20,37 @@
           <button class="close-btn" @click="close">×</button>
         </div>
         <div class="body">
-        <div v-if="loading" class="loading">加载中...</div>
-        <div v-else-if="!images.length" class="empty">未找到图片文件</div>
-        <div v-else class="grid">
-          <div
-            v-for="item in images"
-            :key="item.path"
-            class="card"
-            :class="{ selected: selectedSet.has(item.path) }"
-            @click="toggle(item.path)"
-            :title="item.path"
-          >
-            <img :src="previewUrl(item.path)" :alt="item.name" />
-            <div class="name">{{ item.name }}</div>
+          <div v-if="loading" class="loading">加载中...</div>
+          <div v-else-if="!images.length" class="empty">未找到图片文件</div>
+          <div v-else class="grid">
+            <div
+              v-for="item in images"
+              :key="item.path"
+              class="card"
+              :class="{ selected: selectedSet.has(item.path) }"
+              @click="toggle(item.path)"
+              :title="item.path"
+            >
+              <img :src="previewUrl(item.path)" :alt="item.name" />
+              <div class="name">{{ item.name }}</div>
+            </div>
+          </div>
+        </div>
+        <div class="footer">
+          <div class="count">已选 {{ selectedSet.size }} / 9</div>
+          <div class="actions">
+            <button type="button" class="btn secondary" @click="close">取消</button>
+            <button
+              type="button"
+              class="btn primary"
+              :disabled="!selectedSet.size"
+              @click="confirm"
+            >
+              确认
+            </button>
           </div>
         </div>
       </div>
-      <div class="footer">
-        <div class="count">已选 {{ selectedSet.size }} / 9</div>
-        <div class="actions">
-          <button type="button" class="btn secondary" @click="close">取消</button>
-          <button type="button" class="btn primary" :disabled="!selectedSet.size" @click="confirm">确认</button>
-        </div>
-      </div>
-    </div>
     </div>
   </transition>
 </template>
diff --git a/static/src/components/overlay/NewUserTutorialPrompt.vue b/static/src/components/overlay/NewUserTutorialPrompt.vue
index 6f0a284..276b077 100644
--- a/static/src/components/overlay/NewUserTutorialPrompt.vue
+++ b/static/src/components/overlay/NewUserTutorialPrompt.vue
@@ -1,7 +1,12 @@
 <template>
   <transition name="overlay-fade">
     <div v-if="visible" class="new-user-tutorial-mask" @click.self="emitSkip">
-      <div class="new-user-tutorial-dialog" role="dialog" aria-modal="true" aria-label="新手教程提示">
+      <div
+        class="new-user-tutorial-dialog"
+        role="dialog"
+        aria-modal="true"
+        aria-label="新手教程提示"
+      >
         <p class="eyebrow">欢迎</p>
         <h3>新用户 {{ username || '用户' }}</h3>
         <p class="desc">是否需要通过新手教程来快速认识这个系统？</p>
@@ -87,7 +92,10 @@ button {
   font-weight: 700;
   font-size: 13px;
   cursor: pointer;
-  transition: transform 0.16s ease, box-shadow 0.2s ease, opacity 0.2s ease;
+  transition:
+    transform 0.16s ease,
+    box-shadow 0.2s ease,
+    opacity 0.2s ease;
 }
 
 .primary {
diff --git a/static/src/components/overlay/SubAgentActivityDialog.vue b/static/src/components/overlay/SubAgentActivityDialog.vue
index 9a5d844..73a5349 100644
--- a/static/src/components/overlay/SubAgentActivityDialog.vue
+++ b/static/src/components/overlay/SubAgentActivityDialog.vue
@@ -9,8 +9,12 @@
           <button type="button" class="subagent-activity-close" @click="close">×</button>
         </div>
         <div class="subagent-activity-meta">
-          <span class="subagent-activity-status" :class="activeAgent.status || ''">{{ activeAgent.status || 'running' }}</span>
-          <span class="subagent-activity-summary" v-if="activeAgent.summary">{{ activeAgent.summary }}</span>
+          <span class="subagent-activity-status" :class="activeAgent.status || ''">{{
+            activeAgent.status || 'running'
+          }}</span>
+          <span class="subagent-activity-summary" v-if="activeAgent.summary">{{
+            activeAgent.summary
+          }}</span>
         </div>
         <div class="subagent-activity-body">
           <div v-if="activityError" class="subagent-activity-error">{{ activityError }}</div>
diff --git a/static/src/components/overlay/TutorialOverlay.vue b/static/src/components/overlay/TutorialOverlay.vue
index d8b05bc..617ee75 100644
--- a/static/src/components/overlay/TutorialOverlay.vue
+++ b/static/src/components/overlay/TutorialOverlay.vue
@@ -10,12 +10,37 @@
     @touchcancel="handleTouchEnd"
   >
     <div class="tutorial-click-blocker" @click.stop></div>
-    <div v-if="stepReady && maskVisible" class="tutorial-mask" :style="[maskTopStyle, maskInteractivityStyle]" @click.stop></div>
-    <div v-if="stepReady && maskVisible" class="tutorial-mask" :style="[maskLeftStyle, maskInteractivityStyle]" @click.stop></div>
-    <div v-if="stepReady && maskVisible" class="tutorial-mask" :style="[maskRightStyle, maskInteractivityStyle]" @click.stop></div>
-    <div v-if="stepReady && maskVisible" class="tutorial-mask" :style="[maskBottomStyle, maskInteractivityStyle]" @click.stop></div>
+    <div
+      v-if="stepReady && maskVisible"
+      class="tutorial-mask"
+      :style="[maskTopStyle, maskInteractivityStyle]"
+      @click.stop
+    ></div>
+    <div
+      v-if="stepReady && maskVisible"
+      class="tutorial-mask"
+      :style="[maskLeftStyle, maskInteractivityStyle]"
+      @click.stop
+    ></div>
+    <div
+      v-if="stepReady && maskVisible"
+      class="tutorial-mask"
+      :style="[maskRightStyle, maskInteractivityStyle]"
+      @click.stop
+    ></div>
+    <div
+      v-if="stepReady && maskVisible"
+      class="tutorial-mask"
+      :style="[maskBottomStyle, maskInteractivityStyle]"
+      @click.stop
+    ></div>
 
-    <div v-if="stepReady && maskVisible" class="tutorial-highlight" :style="highlightStyle" aria-hidden="true"></div>
+    <div
+      v-if="stepReady && maskVisible"
+      class="tutorial-highlight"
+      :style="highlightStyle"
+      aria-hidden="true"
+    ></div>
     <span
       v-if="clickEffect"
       class="tutorial-click-effect"
@@ -36,9 +61,13 @@
       </header>
       <h3 class="tutorial-popover__title">{{ step?.title || '新手教程' }}</h3>
       <p class="tutorial-popover__desc">{{ step?.description || '' }}</p>
-      <p v-if="isWaitingTarget" class="tutorial-popover__warn">未找到目标元素，可稍后重试或跳过当前步骤。</p>
+      <p v-if="isWaitingTarget" class="tutorial-popover__warn">
+        未找到目标元素，可稍后重试或跳过当前步骤。
+      </p>
       <p v-else-if="isMustClick" class="tutorial-popover__hint">请点击高亮目标继续。</p>
-      <p v-if="showPersonalScrollHint" class="tutorial-popover__hint">提示：个人空间内容可上下滚动查看。</p>
+      <p v-if="showPersonalScrollHint" class="tutorial-popover__hint">
+        提示：个人空间内容可上下滚动查看。
+      </p>
 
       <footer class="tutorial-popover__actions">
         <button type="button" class="tutorial-btn" :disabled="nextDisabled" @click="goNext">
@@ -69,7 +98,12 @@ const GAP = 14;
 const HIGHLIGHT_PADDING = 2;
 
 const tutorialStore = useTutorialStore();
-const { running, activeStep: step, visibleStepIndex, totalVisibleSteps } = storeToRefs(tutorialStore);
+const {
+  running,
+  activeStep: step,
+  visibleStepIndex,
+  totalVisibleSteps
+} = storeToRefs(tutorialStore);
 
 const panelRef = ref<HTMLElement | null>(null);
 const targetRect = ref<RectLike | null>(null);
@@ -89,7 +123,13 @@ const maskVisible = computed(() => Boolean(targetRect.value));
 const nextDisabled = computed(() => isMustClick.value && !!targetRect.value);
 const isPersonalTutorialPhase = computed(() => {
   const id = step.value?.id || '';
-  return id === 'personal-overview' || id === 'open-personal-space' || id === 'close-personal-space' || id.startsWith('tab-') || id.startsWith('page-');
+  return (
+    id === 'personal-overview' ||
+    id === 'open-personal-space' ||
+    id === 'close-personal-space' ||
+    id.startsWith('tab-') ||
+    id.startsWith('page-')
+  );
 });
 const showPersonalScrollHint = computed(() => isPersonalTutorialPhase.value);
 const nextLabel = computed(() => {
@@ -117,7 +157,12 @@ const maskTopStyle = computed(() => {
 const maskLeftStyle = computed(() => {
   const rect = clampedRect.value;
   if (!rect) return {};
-  return { top: `${rect.top}px`, left: '0px', width: `${Math.max(0, rect.left)}px`, height: `${rect.height}px` };
+  return {
+    top: `${rect.top}px`,
+    left: '0px',
+    width: `${Math.max(0, rect.left)}px`,
+    height: `${rect.height}px`
+  };
 });
 
 const maskRightStyle = computed(() => {
@@ -228,10 +273,17 @@ const placePopover = (rect: RectLike | null) => {
 
   const placements: Array<'top' | 'right' | 'bottom' | 'left'> =
     preferred === 'auto'
-      ? (['right', 'bottom', 'left', 'top'] as Array<'top' | 'right' | 'bottom' | 'left'>).sort((a, b) => spaces[b] - spaces[a])
+      ? (['right', 'bottom', 'left', 'top'] as Array<'top' | 'right' | 'bottom' | 'left'>).sort(
+          (a, b) => spaces[b] - spaces[a]
+        )
       : [preferred as 'top' | 'right' | 'bottom' | 'left', 'right', 'bottom', 'left', 'top'];
 
-  let best: { p: 'top' | 'right' | 'bottom' | 'left'; left: number; top: number; overlap: number } | null = null;
+  let best: {
+    p: 'top' | 'right' | 'bottom' | 'left';
+    left: number;
+    top: number;
+    overlap: number;
+  } | null = null;
   for (const p of Array.from(new Set(placements))) {
     let top = 0;
     let left = 0;
@@ -251,9 +303,19 @@ const placePopover = (rect: RectLike | null) => {
 
     const clampedLeft = clamp(left, edge, Math.max(edge, vw - panelWidth - edge));
     const clampedTop = clamp(top, edge, Math.max(edge, vh - panelHeight - edge));
-    const fits = left >= edge && top >= edge && left + panelWidth <= vw - edge && top + panelHeight <= vh - edge;
-    const overlapX = Math.max(0, Math.min(clampedLeft + panelWidth, rect.right) - Math.max(clampedLeft, rect.left));
-    const overlapY = Math.max(0, Math.min(clampedTop + panelHeight, rect.bottom) - Math.max(clampedTop, rect.top));
+    const fits =
+      left >= edge &&
+      top >= edge &&
+      left + panelWidth <= vw - edge &&
+      top + panelHeight <= vh - edge;
+    const overlapX = Math.max(
+      0,
+      Math.min(clampedLeft + panelWidth, rect.right) - Math.max(clampedLeft, rect.left)
+    );
+    const overlapY = Math.max(
+      0,
+      Math.min(clampedTop + panelHeight, rect.bottom) - Math.max(clampedTop, rect.top)
+    );
     const overlap = overlapX * overlapY;
     if (fits) {
       resolvedPlacement.value = p;
@@ -292,7 +354,14 @@ const updateRect = () => {
   const rect = el.getBoundingClientRect();
   targetRect.value =
     rect.width > 0 && rect.height > 0
-      ? { top: rect.top, left: rect.left, width: rect.width, height: rect.height, right: rect.right, bottom: rect.bottom }
+      ? {
+          top: rect.top,
+          left: rect.left,
+          width: rect.width,
+          height: rect.height,
+          right: rect.right,
+          bottom: rect.bottom
+        }
       : null;
   placePopover(targetRect.value);
 };
@@ -321,12 +390,17 @@ const handleCaptureClick = (event: MouseEvent) => {
 };
 
 const getPersonalScrollTarget = () => {
-  const pageCandidates = Array.from(document.querySelectorAll('.personalization-content .personal-page')) as HTMLElement[];
+  const pageCandidates = Array.from(
+    document.querySelectorAll('.personalization-content .personal-page')
+  ) as HTMLElement[];
   const pageScrollable = pageCandidates.find((el) => el.scrollHeight - el.clientHeight > 2);
   if (pageScrollable) return pageScrollable;
   const content = document.querySelector('.personalization-content') as HTMLElement | null;
   if (content && content.scrollHeight - content.clientHeight > 2) return content;
-  return (document.querySelector('[data-tutorial="personal-content-shell"]') as HTMLElement | null) || content;
+  return (
+    (document.querySelector('[data-tutorial="personal-content-shell"]') as HTMLElement | null) ||
+    content
+  );
 };
 
 const handleWheel = (event: WheelEvent) => {
@@ -397,7 +471,12 @@ const triggerAutoClick = () => {
     const targetEl = menu || (document.body as HTMLElement);
     playClickEffect(targetEl);
     window.setTimeout(() => {
-      const event = new MouseEvent('click', { bubbles: true, cancelable: true, clientX: 12, clientY: 12 });
+      const event = new MouseEvent('click', {
+        bubbles: true,
+        cancelable: true,
+        clientX: 12,
+        clientY: 12
+      });
       document.body.dispatchEvent(event);
     }, 420);
     return true;
@@ -420,9 +499,12 @@ const triggerAutoClick = () => {
     },
     shouldScroll ? 220 : 0
   );
-  window.setTimeout(() => {
-    (el as HTMLElement).click();
-  }, shouldScroll ? 640 : 420);
+  window.setTimeout(
+    () => {
+      (el as HTMLElement).click();
+    },
+    shouldScroll ? 640 : 420
+  );
   return true;
 };
 
@@ -447,7 +529,7 @@ const handleExit = () => tutorialStore.exitTutorial();
 
 watch(
   () => [running.value, step.value?.id],
-  async ([isRunning, stepId], [prevRunning, prevStepId]) => {
+  async ([, stepId], [prevRunning, prevStepId]) => {
     if (!running.value) {
       targetRect.value = null;
       stepReady.value = true;
@@ -461,7 +543,9 @@ watch(
       }
       const nextStep = step.value;
       const settleDelay =
-        nextStep?.mode === 'must_click' || nextStep?.autoClick || nextStep?.autoOutsideClick ? 500 : 0;
+        nextStep?.mode === 'must_click' || nextStep?.autoClick || nextStep?.autoOutsideClick
+          ? 500
+          : 0;
       stepSettleTimer = window.setTimeout(async () => {
         await nextTick();
         updateRect();
diff --git a/static/src/components/overlay/VideoPicker.vue b/static/src/components/overlay/VideoPicker.vue
index aec7cc5..97ffa5a 100644
--- a/static/src/components/overlay/VideoPicker.vue
+++ b/static/src/components/overlay/VideoPicker.vue
@@ -1,16 +1,11 @@
 <template>
   <transition name="overlay-fade">
-      <div v-if="open" class="image-picker-backdrop" @click.self="close">
+    <div v-if="open" class="image-picker-backdrop" @click.self="close">
       <div class="image-picker-panel">
         <div class="header">
           <div class="header-left">
             <div class="title">选择视频（一次最多 1 个）</div>
-            <button
-              type="button"
-              class="local-btn"
-              :disabled="uploading"
-              @click="triggerLocal"
-            >
+            <button type="button" class="local-btn" :disabled="uploading" @click="triggerLocal">
               {{ uploading ? '上传中...' : '从本地发送' }}
             </button>
             <input
@@ -47,7 +42,14 @@
           <div class="count">已选 {{ selectedSet.size }} / 1</div>
           <div class="actions">
             <button type="button" class="btn secondary" @click="close">取消</button>
-            <button type="button" class="btn primary" :disabled="!selectedSet.size" @click="confirm">确认</button>
+            <button
+              type="button"
+              class="btn primary"
+              :disabled="!selectedSet.size"
+              @click="confirm"
+            >
+              确认
+            </button>
           </div>
         </div>
       </div>
diff --git a/static/src/components/panels/FocusPanel.vue b/static/src/components/panels/FocusPanel.vue
index a9c0f14..03f5748 100644
--- a/static/src/components/panels/FocusPanel.vue
+++ b/static/src/components/panels/FocusPanel.vue
@@ -1,5 +1,9 @@
 <template>
-  <aside class="sidebar right-sidebar" :class="{ collapsed }" :style="{ width: collapsed ? '0px' : width + 'px' }">
+  <aside
+    class="sidebar right-sidebar"
+    :class="{ collapsed }"
+    :style="{ width: collapsed ? '0px' : width + 'px' }"
+  >
     <div class="sidebar-header">
       <h3 class="icon-label">
         <span class="icon icon-sm" :style="iconStyle('eye')" aria-hidden="true"></span>
diff --git a/static/src/components/panels/LeftPanel.vue b/static/src/components/panels/LeftPanel.vue
index e3943c0..cfbed8b 100644
--- a/static/src/components/panels/LeftPanel.vue
+++ b/static/src/components/panels/LeftPanel.vue
@@ -4,7 +4,11 @@
       <div class="compact-status-card">
         <div class="status-line">
           <div class="status-brand">
-            <span class="status-logo-image status-logo-inline" v-html="statusLogoSvg" aria-hidden="true"></span>
+            <span
+              class="status-logo-image status-logo-inline"
+              v-html="statusLogoSvg"
+              aria-hidden="true"
+            ></span>
             <div class="brand-text">
               <span class="brand-name">AI Agent</span>
               <span class="agent-version" v-if="agentVersion">{{ agentVersion }}</span>
@@ -42,7 +46,12 @@
       <div class="sidebar-panel-card">
         <div class="sidebar-header">
           <div class="panel-menu-wrapper" ref="panelMenuWrapper">
-            <button class="sidebar-view-toggle" data-tutorial="panel-menu-toggle" @click.stop="$emit('toggle-panel-menu')" title="切换侧边栏">
+            <button
+              class="sidebar-view-toggle"
+              data-tutorial="panel-menu-toggle"
+              @click.stop="$emit('toggle-panel-menu')"
+              title="切换侧边栏"
+            >
               <span class="icon icon-md" :style="iconStyle('menu')" aria-hidden="true"></span>
             </button>
             <transition name="fade">
@@ -61,7 +70,11 @@
                   @click.stop="$emit('select-panel', 'todo')"
                   title="待办列表"
                 >
-                  <span class="icon icon-md" :style="iconStyle('stickyNote')" aria-hidden="true"></span>
+                  <span
+                    class="icon icon-md"
+                    :style="iconStyle('stickyNote')"
+                    aria-hidden="true"
+                  ></span>
                 </button>
                 <button
                   type="button"
@@ -77,7 +90,11 @@
                   @click.stop="$emit('select-panel', 'backgroundCommands')"
                   title="后台指令"
                 >
-                  <span class="icon icon-md" :style="iconStyle('terminal')" aria-hidden="true"></span>
+                  <span
+                    class="icon icon-md"
+                    :style="iconStyle('terminal')"
+                    aria-hidden="true"
+                  ></span>
                 </button>
               </div>
             </transition>
@@ -114,10 +131,19 @@
           <div v-if="panelMode === 'todo'" class="todo-panel">
             <div v-if="!todoList" class="todo-empty">暂无待办列表</div>
             <div v-else>
-              <div class="todo-task" v-for="task in todoList.tasks || []" :key="task.index" :class="{ done: task.status === 'done' }">
+              <div
+                class="todo-task"
+                v-for="task in todoList.tasks || []"
+                :key="task.index"
+                :class="{ done: task.status === 'done' }"
+              >
                 <span class="todo-task-title">task{{ task.index }}：{{ task.title }}</span>
                 <span class="todo-task-status icon-label">
-                  <span class="icon icon-sm" :style="iconStyle(task.status === 'done' ? 'check' : 'checkbox')" aria-hidden="true"></span>
+                  <span
+                    class="icon icon-sm"
+                    :style="iconStyle(task.status === 'done' ? 'check' : 'checkbox')"
+                    aria-hidden="true"
+                  ></span>
                   <span>{{ task.status === 'done' ? '完成' : '未完成' }}</span>
                 </span>
               </div>
@@ -127,7 +153,12 @@
           <div v-else-if="panelMode === 'subAgents'" class="sub-agent-panel">
             <div v-if="!subAgents.length" class="sub-agent-empty">暂无运行中的子智能体</div>
             <div v-else class="sub-agent-cards">
-              <div class="sub-agent-card" v-for="agent in subAgents" :key="agent.task_id" @click="openSubAgent(agent)">
+              <div
+                class="sub-agent-card"
+                v-for="agent in subAgents"
+                :key="agent.task_id"
+                @click="openSubAgent(agent)"
+              >
                 <div class="sub-agent-header">
                   <span class="sub-agent-id">#{{ agent.agent_id }}</span>
                   <span class="sub-agent-status" :class="agent.status">{{ agent.status }}</span>
@@ -147,10 +178,14 @@
                 @click="openBackgroundCommand(command)"
               >
                 <div class="sub-agent-header">
-                  <span class="sub-agent-id">{{ command.command_id }}</span>
-                  <span class="sub-agent-status" :class="command.status">{{ command.status || 'running' }}</span>
+                  <span class="sub-agent-id">状态</span>
+                  <span class="sub-agent-status" :class="command.status">{{
+                    formatBackgroundCommandStatus(command.status)
+                  }}</span>
+                </div>
+                <div class="sub-agent-summary background-command-summary">
+                  {{ formatBackgroundCommandPreview(command.command) }}
                 </div>
-                <div class="sub-agent-summary">{{ command.command || '（空命令）' }}</div>
                 <div class="sub-agent-tool">
                   {{ formatBackgroundCommandMeta(command) }}
                 </div>
@@ -209,7 +244,7 @@ defineEmits<{
 }>();
 
 const panelMenuWrapper = ref<HTMLElement | null>(null);
-const statusLogoSvg = statusLogoSvgRaw.replace(/fill=\"#000000\"/g, 'fill=\"currentColor\"');
+const statusLogoSvg = statusLogoSvgRaw.replace(/fill="#000000"/g, 'fill="currentColor"');
 const panelStyle = computed(() => {
   if (props.collapsed) {
     return {
@@ -266,7 +301,8 @@ const modeIndicatorTitle = computed(() => {
 const fileStore = useFileStore();
 const subAgentStore = useSubAgentStore();
 const backgroundCommandStore = useBackgroundCommandStore();
-const { fileTree, expandedFolders, todoList, fileTreeUnavailable, fileTreeMessage } = storeToRefs(fileStore);
+const { fileTree, expandedFolders, todoList, fileTreeUnavailable, fileTreeMessage } =
+  storeToRefs(fileStore);
 const { subAgents } = storeToRefs(subAgentStore);
 const { commands: backgroundCommands } = storeToRefs(backgroundCommandStore);
 
@@ -281,9 +317,22 @@ const openBackgroundCommand = (command: any) => {
 const formatBackgroundCommandMeta = (command: any) => {
   const code = command?.return_code;
   if (code === null || code === undefined) {
-    return '点击查看实时输出';
+    return '状态码：--';
   }
-  return `返回码：${code}`;
+  return `状态码：${code}`;
+};
+
+const formatBackgroundCommandStatus = (status: any) => {
+  const normalized = (status || 'running').toString().toLowerCase();
+  return normalized;
+};
+
+const formatBackgroundCommandPreview = (rawCommand: any) => {
+  const content = (rawCommand || '（空命令）').toString().replace(/\s+/g, ' ').trim();
+  if (!content) {
+    return '（空命令）';
+  }
+  return content;
 };
 
 defineExpose({
diff --git a/static/src/components/personalization/ExperienceOnboarding.vue b/static/src/components/personalization/ExperienceOnboarding.vue
index 416899c..13739d2 100644
--- a/static/src/components/personalization/ExperienceOnboarding.vue
+++ b/static/src/components/personalization/ExperienceOnboarding.vue
@@ -143,7 +143,7 @@ function confirmSelection() {
   border-radius: 14px;
   padding: 16px 14px;
   cursor: pointer;
-  transition: .2s ease;
+  transition: 0.2s ease;
   box-shadow: 0 8px 18px rgba(61, 57, 41, 0.06);
   background: #fff;
 }
diff --git a/static/src/components/personalization/PersonalizationDrawer.vue b/static/src/components/personalization/PersonalizationDrawer.vue
index 15f97b9..390ddde 100644
--- a/static/src/components/personalization/PersonalizationDrawer.vue
+++ b/static/src/components/personalization/PersonalizationDrawer.vue
@@ -17,8 +17,17 @@
             <p>配置 AI 智能体的个性化偏好</p>
           </div>
           <div class="personal-page-actions">
-            <button type="button" class="personal-page-logout" @click="personalization.logout()">退出登录</button>
-            <button type="button" class="personal-page-close" data-tutorial="personal-close" @click="personalization.closeDrawer()">返回工作区</button>
+            <button type="button" class="personal-page-logout" @click="personalization.logout()">
+              退出登录
+            </button>
+            <button
+              type="button"
+              class="personal-page-close"
+              data-tutorial="personal-close"
+              @click="personalization.closeDrawer()"
+            >
+              返回工作区
+            </button>
           </div>
         </div>
         <div class="personalization-body" v-if="!loading">
@@ -36,7 +45,9 @@
                   @click.prevent="setActiveTab(tab.id)"
                 >
                   <span>{{ tab.label }}</span>
-                  <small v-if="tab.description" class="personal-tab-desc">{{ tab.description }}</small>
+                  <small v-if="tab.description" class="personal-tab-desc">{{
+                    tab.description
+                  }}</small>
                 </button>
               </nav>
               <div class="personalization-content-shell" data-tutorial="personal-content-shell">
@@ -46,128 +57,223 @@
                   @touchend.passive="handleSwipeEnd"
                 >
                   <transition name="personal-page-vertical" mode="out-in">
-                    <section v-if="activeTab === 'preferences'" key="preferences" class="personal-page personal-page-pref" data-tutorial="personal-page-preferences">
-                    <div class="personal-toggle-row">
-                      <label class="personal-toggle">
-                        <span class="toggle-text">
-                          <span class="toggle-title">启用个性化提示</span>
-                          <span class="toggle-desc">开启后才会注入您的偏好</span>
-                        </span>
-                        <span class="toggle-switch">
-                          <input
-                            type="checkbox"
-                            :checked="form.enabled"
-                            :disabled="toggleUpdating"
-                            @change="personalization.toggleEnabled()"
-                          />
-                          <span class="switch-slider"></span>
-                        </span>
-                      </label>
-                    </div>
-                    <p class="section-note">仅作用于当前工作区，可随时在左下角开关。</p>
-                    <div class="personalization-sections">
-                      <div class="personal-left-column">
-                        <div class="personal-section personal-info">
-                          <label class="personal-field">
-                            <span>您希望AI智能体怎么自称？</span>
+                    <section
+                      v-if="activeTab === 'preferences'"
+                      key="preferences"
+                      class="personal-page personal-page-pref"
+                      data-tutorial="personal-page-preferences"
+                    >
+                      <div class="personal-toggle-row">
+                        <label class="personal-toggle">
+                          <span class="toggle-text">
+                            <span class="toggle-title">启用个性化提示</span>
+                            <span class="toggle-desc">开启后才会注入您的偏好</span>
+                          </span>
+                          <span class="toggle-switch">
                             <input
-                              type="text"
-                              placeholder="如：小秘、助理小A"
-                              :value="form.self_identify"
-                              maxlength="20"
-                              @input="personalization.updateField({ key: 'self_identify', value: $event.target.value })"
-                              @focus="personalization.clearFeedback()"
+                              type="checkbox"
+                              :checked="form.enabled"
+                              :disabled="toggleUpdating"
+                              @change="personalization.toggleEnabled()"
                             />
-                          </label>
-                          <label class="personal-field">
-                            <span>您希望AI智能体怎么称呼您？</span>
-                            <input
-                              type="text"
-                              placeholder="如：Jojo、老师"
-                              :value="form.user_name"
-                              maxlength="20"
-                              @input="personalization.updateField({ key: 'user_name', value: $event.target.value })"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                          <label class="personal-field">
-                            <span>您的职业是？</span>
-                            <input
-                              type="text"
-                              placeholder="如：产品经理、设计师"
-                              :value="form.profession"
-                              maxlength="20"
-                              @input="personalization.updateField({ key: 'profession', value: $event.target.value })"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                          <div class="personal-field">
-                            <label>
-                              <span>您希望AI智能体用何种语气与您交流？</span>
+                            <span class="switch-slider"></span>
+                          </span>
+                        </label>
+                      </div>
+                      <p class="section-note">仅作用于当前工作区，可随时在左下角开关。</p>
+                      <div class="personalization-sections">
+                        <div class="personal-left-column">
+                          <div class="personal-section personal-info">
+                            <label class="personal-field">
+                              <span>您希望AI智能体怎么自称？</span>
                               <input
                                 type="text"
-                                placeholder="请选择或输入语气"
-                                :value="form.tone"
+                                placeholder="如：小秘、助理小A"
+                                :value="form.self_identify"
                                 maxlength="20"
-                                @input="personalization.updateField({ key: 'tone', value: $event.target.value })"
+                                @input="
+                                  personalization.updateField({
+                                    key: 'self_identify',
+                                    value: $event.target.value
+                                  })
+                                "
                                 @focus="personalization.clearFeedback()"
                               />
                             </label>
-                            <div class="tone-preset-row">
-                              <span>快速填入：</span>
-                              <div class="tone-preset-buttons">
-                                <button type="button" v-for="preset in tonePresets" :key="preset" @click.prevent="personalization.applyTonePreset(preset)">
-                                  {{ preset }}
-                                </button>
+                            <label class="personal-field">
+                              <span>您希望AI智能体怎么称呼您？</span>
+                              <input
+                                type="text"
+                                placeholder="如：Jojo、老师"
+                                :value="form.user_name"
+                                maxlength="20"
+                                @input="
+                                  personalization.updateField({
+                                    key: 'user_name',
+                                    value: $event.target.value
+                                  })
+                                "
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                            <label class="personal-field">
+                              <span>您的职业是？</span>
+                              <input
+                                type="text"
+                                placeholder="如：产品经理、设计师"
+                                :value="form.profession"
+                                maxlength="20"
+                                @input="
+                                  personalization.updateField({
+                                    key: 'profession',
+                                    value: $event.target.value
+                                  })
+                                "
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                            <div class="personal-field">
+                              <label>
+                                <span>您希望AI智能体用何种语气与您交流？</span>
+                                <input
+                                  type="text"
+                                  placeholder="请选择或输入语气"
+                                  :value="form.tone"
+                                  maxlength="20"
+                                  @input="
+                                    personalization.updateField({
+                                      key: 'tone',
+                                      value: $event.target.value
+                                    })
+                                  "
+                                  @focus="personalization.clearFeedback()"
+                                />
+                              </label>
+                              <div class="tone-preset-row">
+                                <span>快速填入：</span>
+                                <div class="tone-preset-buttons">
+                                  <button
+                                    type="button"
+                                    v-for="preset in tonePresets"
+                                    :key="preset"
+                                    @click.prevent="personalization.applyTonePreset(preset)"
+                                  >
+                                    {{ preset }}
+                                  </button>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
-                      </div>
-                      <div class="personal-right-column">
-                        <div class="personal-section personal-considerations">
-                          <div class="personal-field">
-                            <span>您希望AI智能体在回答问题时必须考虑的信息是？</span>
-                            <div class="consideration-input">
-                              <input
-                                type="text"
-                                :value="newConsideration"
-                                maxlength="50"
-                                placeholder="输入后点击 + 号添加"
-                                @input="personalization.updateNewConsideration($event.target.value)"
-                                @focus="personalization.clearFeedback()"
-                              />
-                              <button
-                                type="button"
-                                class="consideration-add"
-                                :disabled="!newConsideration || form.considerations.length >= maxConsiderations"
-                                @click="personalization.addConsideration()"
-                              >
-                                +
-                              </button>
-                            </div>
-                            <ul class="consideration-list" v-if="form.considerations.length">
-                              <li
-                                v-for="(item, idx) in form.considerations"
-                                :key="`consideration-${idx}`"
-                                class="consideration-item"
-                                draggable="true"
-                                @dragstart="personalization.considerationDragStart(idx, $event)"
-                                @dragover.prevent="personalization.considerationDragOver(idx, $event)"
-                                @drop.prevent="personalization.considerationDrop(idx, $event)"
-                                @dragend="personalization.considerationDragEnd()"
-                              >
-                                <span class="drag-handle" aria-hidden="true">≡</span>
-                                <span class="consideration-text">{{ item }}</span>
-                                <button type="button" class="consideration-remove" @click="personalization.removeConsideration(idx)">
-                                  −
+                        <div class="personal-right-column">
+                          <div class="personal-section personal-considerations">
+                            <div class="personal-field">
+                              <span>您希望AI智能体在回答问题时必须考虑的信息是？</span>
+                              <div class="consideration-input">
+                                <input
+                                  type="text"
+                                  :value="newConsideration"
+                                  maxlength="50"
+                                  placeholder="输入后点击 + 号添加"
+                                  @input="
+                                    personalization.updateNewConsideration($event.target.value)
+                                  "
+                                  @focus="personalization.clearFeedback()"
+                                />
+                                <button
+                                  type="button"
+                                  class="consideration-add"
+                                  :disabled="
+                                    !newConsideration ||
+                                    form.considerations.length >= maxConsiderations
+                                  "
+                                  @click="personalization.addConsideration()"
+                                >
+                                  +
                                 </button>
-                              </li>
-                            </ul>
-                            <p class="consideration-hint" v-else>尚未添加任何必备信息</p>
-                            <p class="consideration-limit">最多 {{ maxConsiderations }} 条，可拖动排序</p>
+                              </div>
+                              <ul class="consideration-list" v-if="form.considerations.length">
+                                <li
+                                  v-for="(item, idx) in form.considerations"
+                                  :key="`consideration-${idx}`"
+                                  class="consideration-item"
+                                  draggable="true"
+                                  @dragstart="personalization.considerationDragStart(idx, $event)"
+                                  @dragover.prevent="
+                                    personalization.considerationDragOver(idx, $event)
+                                  "
+                                  @drop.prevent="personalization.considerationDrop(idx, $event)"
+                                  @dragend="personalization.considerationDragEnd()"
+                                >
+                                  <span class="drag-handle" aria-hidden="true">≡</span>
+                                  <span class="consideration-text">{{ item }}</span>
+                                  <button
+                                    type="button"
+                                    class="consideration-remove"
+                                    @click="personalization.removeConsideration(idx)"
+                                  >
+                                    −
+                                  </button>
+                                </li>
+                              </ul>
+                              <p class="consideration-hint" v-else>尚未添加任何必备信息</p>
+                              <p class="consideration-limit">
+                                最多 {{ maxConsiderations }} 条，可拖动排序
+                              </p>
+                            </div>
+                          </div>
+                          <div class="personal-form-actions card-aligned">
+                            <div class="personal-status-group">
+                              <transition name="personal-status-fade">
+                                <span class="status success" v-if="status">{{ status }}</span>
+                              </transition>
+                              <transition name="personal-status-fade">
+                                <span class="status error" v-if="error">{{ error }}</span>
+                              </transition>
+                            </div>
+                            <button type="submit" class="primary" :disabled="saving">
+                              {{ saving ? '保存中...' : '保存设置' }}
+                            </button>
                           </div>
                         </div>
+                      </div>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'image'"
+                      key="image"
+                      class="personal-page behavior-page"
+                      data-tutorial="personal-page-image"
+                    >
+                      <div class="behavior-section">
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">图片压缩</span>
+                            <p class="behavior-desc">
+                              发送图片或调用 view_image 时自动等比缩放，防止大图占用过多 tokens。
+                            </p>
+                          </div>
+                          <div class="run-mode-options">
+                            <button
+                              v-for="option in imageCompressionOptions"
+                              :key="option.id"
+                              type="button"
+                              class="run-mode-card"
+                              :class="{ active: form.image_compression === option.id }"
+                              :aria-pressed="form.image_compression === option.id"
+                              @click.prevent="personalization.setImageCompression(option.id)"
+                            >
+                              <div class="run-mode-card-header">
+                                <span class="run-mode-title">{{ option.label }}</span>
+                              </div>
+                              <p class="run-mode-desc">{{ option.desc }}</p>
+                            </button>
+                          </div>
+                          <p class="behavior-hint">
+                            缩放保持原始比例；若原图已低于目标分辨率，将直接使用原图。
+                          </p>
+                        </div>
+                      </div>
+                      <div class="personal-actions-row">
                         <div class="personal-form-actions card-aligned">
                           <div class="personal-status-group">
                             <transition name="personal-status-fade">
@@ -182,814 +288,994 @@
                           </button>
                         </div>
                       </div>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'image'" key="image" class="personal-page behavior-page" data-tutorial="personal-page-image">
-                    <div class="behavior-section">
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">图片压缩</span>
-                          <p class="behavior-desc">发送图片或调用 view_image 时自动等比缩放，防止大图占用过多 tokens。</p>
-                        </div>
-                        <div class="run-mode-options">
-                          <button
-                            v-for="option in imageCompressionOptions"
-                            :key="option.id"
-                            type="button"
-                            class="run-mode-card"
-                            :class="{ active: form.image_compression === option.id }"
-                            :aria-pressed="form.image_compression === option.id"
-                            @click.prevent="personalization.setImageCompression(option.id)"
-                          >
-                            <div class="run-mode-card-header">
-                              <span class="run-mode-title">{{ option.label }}</span>
-                            </div>
-                            <p class="run-mode-desc">{{ option.desc }}</p>
-                          </button>
-                        </div>
-                        <p class="behavior-hint">缩放保持原始比例；若原图已低于目标分辨率，将直接使用原图。</p>
-                      </div>
-                    </div>
-                    <div class="personal-actions-row">
-                      <div class="personal-form-actions card-aligned">
-                        <div class="personal-status-group">
-                          <transition name="personal-status-fade">
-                            <span class="status success" v-if="status">{{ status }}</span>
-                          </transition>
-                          <transition name="personal-status-fade">
-                            <span class="status error" v-if="error">{{ error }}</span>
-                          </transition>
-                        </div>
-                        <button type="submit" class="primary" :disabled="saving">
-                          {{ saving ? '保存中...' : '保存设置' }}
-                        </button>
-                      </div>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'model'" key="model" class="personal-page behavior-page" data-tutorial="personal-page-model">
-                    <div class="behavior-section">
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">默认模型</span>
-                          <p class="field-desc">为新对话/登录后首次请求选择首选模型，会与默认思考模式一起生效。</p>
-                        </div>
-                        <div class="run-mode-options model-options">
-                          <button
-                            v-for="option in filteredModelOptions"
-                            :key="option.id"
-                            type="button"
-                            class="run-mode-card"
-                            :class="[{ active: form.default_model === option.value }, { disabled: option.disabled }]"
-                            :aria-pressed="form.default_model === option.value"
-                            :disabled="option.disabled"
-                            @click.prevent="!option.disabled && setDefaultModel(option.value)"
-                          >
-                            <div class="run-mode-card-header">
-                              <span class="run-mode-title">{{ option.label }}</span>
-                              <span v-if="option.badge" class="run-mode-badge">{{ option.badge }}</span>
-                              <span v-if="option.disabled" class="run-mode-badge danger">已禁用</span>
-                            </div>
-                            <p class="run-mode-desc">{{ option.desc }}</p>
-                          </button>
-                        </div>
-                        <p class="behavior-hint">
-                          MiniMax-M2.5 仅支持深度思考模式，选择时会给出提示。
-                        </p>
-                      </div>
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">默认思考模型</span>
-                          <p class="field-desc">设定登录或新建任务时的初始运行模式，仍可通过主界面随时切换。</p>
-                        </div>
-                        <div class="run-mode-options">
-                          <button
-                            v-for="option in runModeOptions"
-                            :key="option.id"
-                            type="button"
-                            class="run-mode-card"
-                            :class="{ active: isRunModeActive(option.value) }"
-                            :aria-pressed="isRunModeActive(option.value)"
-                            @click.prevent="setDefaultRunMode(option.value)"
-                          >
-                            <div class="run-mode-card-header">
-                              <span class="run-mode-title">{{ option.label }}</span>
-                              <span v-if="option.badge" class="run-mode-badge">{{ option.badge }}</span>
-                            </div>
-                            <p class="run-mode-desc">{{ option.desc }}</p>
-                          </button>
-                        </div>
-                      </div>
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">思考频率</span>
-                          <p class="field-desc">控制连续快速模式运行多少轮后，系统会强制切换到思考模型。</p>
-                        </div>
-                        <div class="thinking-presets">
-                          <button
-                            v-for="preset in thinkingPresets"
-                            :key="preset.id"
-                            type="button"
-                            :class="{ active: isPresetActive(preset.value) }"
-                            @click.prevent="applyThinkingPreset(preset.value)"
-                          >
-                            {{ preset.label }}
-                            <small>{{ preset.value }} 轮</small>
-                          </button>
-                        </div>
-                        <div class="thinking-input-row">
-                          <label>
-                            <span>自定义轮数</span>
-                            <input
-                              type="number"
-                              :min="thinkingIntervalRange.min"
-                              :max="thinkingIntervalRange.max"
-                              :placeholder="`默认 ${thinkingIntervalDefault} 轮`"
-                              :value="form.thinking_interval ?? ''"
-                              @input="handleThinkingInput"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                          <span class="thinking-hint">范围 {{ thinkingIntervalRange.min }}~{{ thinkingIntervalRange.max }} 轮。</span>
-                          <button type="button" class="link-button" @click.prevent="restoreThinkingInterval">
-                            恢复默认
-                          </button>
-                        </div>
-                      </div>
-                    </div>
-                    <div class="personal-actions-row">
-                      <div class="personal-form-actions card-aligned">
-                        <div class="personal-status-group">
-                          <transition name="personal-status-fade">
-                            <span class="status success" v-if="status">{{ status }}</span>
-                          </transition>
-                          <transition name="personal-status-fade">
-                            <span class="status error" v-if="error">{{ error }}</span>
-                          </transition>
-                        </div>
-                        <button type="submit" class="primary" :disabled="saving">
-                          {{ saving ? '保存中...' : '保存设置' }}
-                        </button>
-                      </div>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'usage'" key="usage" class="personal-page usage-summary-page" data-tutorial="personal-page-usage">
-                    <div class="usage-summary-card">
-                      <div class="usage-summary-header">
-                        <div>
-                          <p class="usage-summary-eyebrow">对话用量</p>
-                          <h3>用量统计</h3>
-                          <p class="usage-summary-desc">累计统计所有对话的输入/输出 Token、对话数量、用户消息与工具调用。</p>
-                          <p class="usage-summary-note">宿主机模式同样统计 data/conversations 内的记录。</p>
-                        </div>
-                      </div>
-                      <div class="usage-summary-grid usage-summary-grid--tokens">
-                        <div class="usage-summary-item">
-                          <div class="label">累计输入</div>
-                          <div class="value value--success">{{ formatTokenCount(usageSummary.total_input_tokens) }}</div>
-                        </div>
-                        <div class="usage-summary-item">
-                          <div class="label">累计输出</div>
-                          <div class="value value--warning">{{ formatTokenCount(usageSummary.total_output_tokens) }}</div>
-                        </div>
-                      </div>
-                      <div class="usage-summary-grid usage-summary-grid--counts">
-                        <div class="usage-summary-item">
-                          <div class="label">总对话数</div>
-                          <div class="value">{{ formatTokenCount(usageSummary.total_conversations) }}</div>
-                        </div>
-                        <div class="usage-summary-item">
-                          <div class="label">用户消息数</div>
-                          <div class="value">{{ formatTokenCount(usageSummary.total_user_messages) }}</div>
-                        </div>
-                        <div class="usage-summary-item">
-                          <div class="label">工具调用次数</div>
-                          <div class="value">{{ formatTokenCount(usageSummary.total_tools) }}</div>
-                        </div>
-                      </div>
-                      <div class="usage-summary-meta">
-                        <span v-if="usageError" class="usage-summary-error">{{ usageError }}</span>
-                        <span v-else-if="usageLoading">正在同步最新统计...</span>
-                        <span v-else>最近更新：{{ usageUpdatedText }}</span>
-                        <button
-                          type="button"
-                          class="usage-summary-refresh"
-                          @click="fetchUsageSummary"
-                          :disabled="usageLoading"
-                        >
-                          {{ usageLoading ? '刷新中...' : '刷新数据' }}
-                        </button>
-                      </div>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'app-update'" key="app-update" class="personal-page app-update-page" data-tutorial="personal-page-app-update">
-                    <div class="usage-summary-card">
-                      <div class="usage-summary-header">
-                        <div>
-                          <p class="usage-summary-eyebrow">App 更新</p>
-                          <h3>软件更新</h3>
-                          <p class="usage-summary-desc">仅移动 App 可见。自动检查新版本，也可手动检查。</p>
-                          <p class="usage-summary-note">
-                            当前版本：{{ appCurrentVersionText }}
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'model'"
+                      key="model"
+                      class="personal-page behavior-page"
+                      data-tutorial="personal-page-model"
+                    >
+                      <div class="behavior-section">
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">默认模型</span>
+                            <p class="field-desc">
+                              为新对话/登录后首次请求选择首选模型，会与默认思考模式一起生效。
+                            </p>
+                          </div>
+                          <div class="run-mode-options model-options">
+                            <button
+                              v-for="option in filteredModelOptions"
+                              :key="option.id"
+                              type="button"
+                              class="run-mode-card"
+                              :class="[
+                                { active: form.default_model === option.value },
+                                { disabled: option.disabled }
+                              ]"
+                              :aria-pressed="form.default_model === option.value"
+                              :disabled="option.disabled"
+                              @click.prevent="!option.disabled && setDefaultModel(option.value)"
+                            >
+                              <div class="run-mode-card-header">
+                                <span class="run-mode-title">{{ option.label }}</span>
+                                <span v-if="option.badge" class="run-mode-badge">{{
+                                  option.badge
+                                }}</span>
+                                <span v-if="option.disabled" class="run-mode-badge danger"
+                                  >已禁用</span
+                                >
+                              </div>
+                              <p class="run-mode-desc">{{ option.desc }}</p>
+                            </button>
+                          </div>
+                          <p class="behavior-hint">
+                            MiniMax-M2.5 仅支持深度思考模式，选择时会给出提示。
                           </p>
                         </div>
-                      </div>
-
-                      <div class="usage-summary-grid usage-summary-grid--counts">
-                        <div class="usage-summary-item">
-                          <div class="label">最新版本</div>
-                          <div class="value">{{ appLatestVersionText }}</div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">默认思考模型</span>
+                            <p class="field-desc">
+                              设定登录或新建任务时的初始运行模式，仍可通过主界面随时切换。
+                            </p>
+                          </div>
+                          <div class="run-mode-options">
+                            <button
+                              v-for="option in runModeOptions"
+                              :key="option.id"
+                              type="button"
+                              class="run-mode-card"
+                              :class="{ active: isRunModeActive(option.value) }"
+                              :aria-pressed="isRunModeActive(option.value)"
+                              @click.prevent="setDefaultRunMode(option.value)"
+                            >
+                              <div class="run-mode-card-header">
+                                <span class="run-mode-title">{{ option.label }}</span>
+                                <span v-if="option.badge" class="run-mode-badge">{{
+                                  option.badge
+                                }}</span>
+                              </div>
+                              <p class="run-mode-desc">{{ option.desc }}</p>
+                            </button>
+                          </div>
                         </div>
-                        <div class="usage-summary-item">
-                          <div class="label">安装包大小</div>
-                          <div class="value">{{ appLatestFileSizeText }}</div>
-                        </div>
-                        <div class="usage-summary-item">
-                          <div class="label">更新状态</div>
-                          <div class="value" :class="{ 'value--warning': appHasUpdate }">
-                            {{ appUpdateStateText }}
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">思考频率</span>
+                            <p class="field-desc">
+                              控制连续快速模式运行多少轮后，系统会强制切换到思考模型。
+                            </p>
+                          </div>
+                          <div class="thinking-presets">
+                            <button
+                              v-for="preset in thinkingPresets"
+                              :key="preset.id"
+                              type="button"
+                              :class="{ active: isPresetActive(preset.value) }"
+                              @click.prevent="applyThinkingPreset(preset.value)"
+                            >
+                              {{ preset.label }}
+                              <small>{{ preset.value }} 轮</small>
+                            </button>
+                          </div>
+                          <div class="thinking-input-row">
+                            <label>
+                              <span>自定义轮数</span>
+                              <input
+                                type="number"
+                                :min="thinkingIntervalRange.min"
+                                :max="thinkingIntervalRange.max"
+                                :placeholder="`默认 ${thinkingIntervalDefault} 轮`"
+                                :value="form.thinking_interval ?? ''"
+                                @input="handleThinkingInput"
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                            <span class="thinking-hint"
+                              >范围 {{ thinkingIntervalRange.min }}~{{
+                                thinkingIntervalRange.max
+                              }}
+                              轮。</span
+                            >
+                            <button
+                              type="button"
+                              class="link-button"
+                              @click.prevent="restoreThinkingInterval"
+                            >
+                              恢复默认
+                            </button>
                           </div>
                         </div>
                       </div>
-
-                      <div class="app-update-changelog" v-if="appUpdateChangelogText">
-                        <div class="app-update-changelog-title">更新说明</div>
-                        <pre class="app-update-changelog-content">{{ appUpdateChangelogText }}</pre>
-                      </div>
-
-                      <div class="usage-summary-meta">
-                        <span v-if="appUpdateError" class="usage-summary-error">{{ appUpdateError }}</span>
-                        <span v-else-if="appUpdateChecking">正在检查版本...</span>
-                        <span v-else>{{ appUpdateCheckedText }}</span>
-                        <div class="app-update-actions">
-                          <button type="button" class="usage-summary-refresh" @click="checkAppUpdate" :disabled="appUpdateChecking">
-                            {{ appUpdateChecking ? '检查中...' : '手动检查' }}
+                      <div class="personal-actions-row">
+                        <div class="personal-form-actions card-aligned">
+                          <div class="personal-status-group">
+                            <transition name="personal-status-fade">
+                              <span class="status success" v-if="status">{{ status }}</span>
+                            </transition>
+                            <transition name="personal-status-fade">
+                              <span class="status error" v-if="error">{{ error }}</span>
+                            </transition>
+                          </div>
+                          <button type="submit" class="primary" :disabled="saving">
+                            {{ saving ? '保存中...' : '保存设置' }}
                           </button>
+                        </div>
+                      </div>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'usage'"
+                      key="usage"
+                      class="personal-page usage-summary-page"
+                      data-tutorial="personal-page-usage"
+                    >
+                      <div class="usage-summary-card">
+                        <div class="usage-summary-header">
+                          <div>
+                            <p class="usage-summary-eyebrow">对话用量</p>
+                            <h3>用量统计</h3>
+                            <p class="usage-summary-desc">
+                              累计统计所有对话的输入/输出 Token、对话数量、用户消息与工具调用。
+                            </p>
+                            <p class="usage-summary-note">
+                              宿主机模式同样统计 data/conversations 内的记录。
+                            </p>
+                          </div>
+                        </div>
+                        <div class="usage-summary-grid usage-summary-grid--tokens">
+                          <div class="usage-summary-item">
+                            <div class="label">累计输入</div>
+                            <div class="value value--success">
+                              {{ formatTokenCount(usageSummary.total_input_tokens) }}
+                            </div>
+                          </div>
+                          <div class="usage-summary-item">
+                            <div class="label">累计输出</div>
+                            <div class="value value--warning">
+                              {{ formatTokenCount(usageSummary.total_output_tokens) }}
+                            </div>
+                          </div>
+                        </div>
+                        <div class="usage-summary-grid usage-summary-grid--counts">
+                          <div class="usage-summary-item">
+                            <div class="label">总对话数</div>
+                            <div class="value">
+                              {{ formatTokenCount(usageSummary.total_conversations) }}
+                            </div>
+                          </div>
+                          <div class="usage-summary-item">
+                            <div class="label">用户消息数</div>
+                            <div class="value">
+                              {{ formatTokenCount(usageSummary.total_user_messages) }}
+                            </div>
+                          </div>
+                          <div class="usage-summary-item">
+                            <div class="label">工具调用次数</div>
+                            <div class="value">
+                              {{ formatTokenCount(usageSummary.total_tools) }}
+                            </div>
+                          </div>
+                        </div>
+                        <div class="usage-summary-meta">
+                          <span v-if="usageError" class="usage-summary-error">{{
+                            usageError
+                          }}</span>
+                          <span v-else-if="usageLoading">正在同步最新统计...</span>
+                          <span v-else>最近更新：{{ usageUpdatedText }}</span>
                           <button
                             type="button"
                             class="usage-summary-refresh"
-                            :disabled="!appHasUpdate || !appDownloadUrl"
-                            @click="downloadLatestApp"
+                            @click="fetchUsageSummary"
+                            :disabled="usageLoading"
                           >
-                            下载更新
+                            {{ usageLoading ? '刷新中...' : '刷新数据' }}
                           </button>
                         </div>
                       </div>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'behavior'" key="behavior" class="personal-page behavior-page" data-tutorial="personal-page-behavior">
-                    <div class="behavior-section">
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">使用自定义称呼</span>
-                          <p class="field-desc">开启后，对话区域将使用您在"个性化设置"中配置的自称和称呼。关闭则显示默认的"AI Assistant"和"用户"。</p>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'app-update'"
+                      key="app-update"
+                      class="personal-page app-update-page"
+                      data-tutorial="personal-page-app-update"
+                    >
+                      <div class="usage-summary-card">
+                        <div class="usage-summary-header">
+                          <div>
+                            <p class="usage-summary-eyebrow">App 更新</p>
+                            <h3>软件更新</h3>
+                            <p class="usage-summary-desc">
+                              仅移动 App 可见。自动检查新版本，也可手动检查。
+                            </p>
+                            <p class="usage-summary-note">当前版本：{{ appCurrentVersionText }}</p>
+                          </div>
+                        </div>
+
+                        <div class="usage-summary-grid usage-summary-grid--counts">
+                          <div class="usage-summary-item">
+                            <div class="label">最新版本</div>
+                            <div class="value">{{ appLatestVersionText }}</div>
+                          </div>
+                          <div class="usage-summary-item">
+                            <div class="label">安装包大小</div>
+                            <div class="value">{{ appLatestFileSizeText }}</div>
+                          </div>
+                          <div class="usage-summary-item">
+                            <div class="label">更新状态</div>
+                            <div class="value" :class="{ 'value--warning': appHasUpdate }">
+                              {{ appUpdateStateText }}
+                            </div>
+                          </div>
+                        </div>
+
+                        <div class="app-update-changelog" v-if="appUpdateChangelogText">
+                          <div class="app-update-changelog-title">更新说明</div>
+                          <pre class="app-update-changelog-content">{{
+                            appUpdateChangelogText
+                          }}</pre>
+                        </div>
+
+                        <div class="usage-summary-meta">
+                          <span v-if="appUpdateError" class="usage-summary-error">{{
+                            appUpdateError
+                          }}</span>
+                          <span v-else-if="appUpdateChecking">正在检查版本...</span>
+                          <span v-else>{{ appUpdateCheckedText }}</span>
+                          <div class="app-update-actions">
+                            <button
+                              type="button"
+                              class="usage-summary-refresh"
+                              @click="checkAppUpdate"
+                              :disabled="appUpdateChecking"
+                            >
+                              {{ appUpdateChecking ? '检查中...' : '手动检查' }}
+                            </button>
+                            <button
+                              type="button"
+                              class="usage-summary-refresh"
+                              :disabled="!appHasUpdate || !appDownloadUrl"
+                              @click="downloadLatestApp"
+                            >
+                              下载更新
+                            </button>
+                          </div>
                         </div>
-                        <label class="toggle-row">
-                          <input
-                            type="checkbox"
-                            :checked="form.use_custom_names"
-                            @change="personalization.updateField({ key: 'use_custom_names', value: $event.target.checked })"
-                          />
-                          <span class="fancy-check" aria-hidden="true">
-                            <svg viewBox="0 0 64 64">
-                              <path
-                                d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                                pathLength="575.0541381835938"
-                                class="fancy-path"
-                              ></path>
-                            </svg>
-                          </span>
-                          <span>在对话中显示自定义称呼</span>
-                        </label>
                       </div>
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">增强工具显示</span>
-                          <p class="field-desc">开启后工具块将显示格式化的内容，关闭则显示原始 JSON 数据。默认开启。</p>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'behavior'"
+                      key="behavior"
+                      class="personal-page behavior-page"
+                      data-tutorial="personal-page-behavior"
+                    >
+                      <div class="behavior-section">
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">使用自定义称呼</span>
+                            <p class="field-desc">
+                              开启后，对话区域将使用您在"个性化设置"中配置的自称和称呼。关闭则显示默认的"AI
+                              Assistant"和"用户"。
+                            </p>
+                          </div>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.use_custom_names"
+                              @change="
+                                personalization.updateField({
+                                  key: 'use_custom_names',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>在对话中显示自定义称呼</span>
+                          </label>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">增强工具显示</span>
+                            <p class="field-desc">
+                              开启后工具块将显示格式化的内容，关闭则显示原始 JSON 数据。默认开启。
+                            </p>
+                          </div>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.enhanced_tool_display"
+                              @change="
+                                personalization.updateField({
+                                  key: 'enhanced_tool_display',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>显示格式化的工具结果（更清晰易读）</span>
+                          </label>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">上下文压缩策略</span>
+                            <p class="field-desc">可分别控制自动浅层压缩与自动深层压缩。</p>
+                          </div>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.auto_shallow_compress_enabled"
+                              @change="
+                                personalization.updateField({
+                                  key: 'auto_shallow_compress_enabled',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>自动浅层压缩</span>
+                          </label>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.auto_deep_compress_enabled"
+                              @change="
+                                personalization.updateField({
+                                  key: 'auto_deep_compress_enabled',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>自动深层压缩</span>
+                          </label>
+                          <div class="compression-custom-grid">
+                            <label class="compression-input-row">
+                              <span>浅压缩触发上下文</span>
+                              <input
+                                type="number"
+                                min="1000"
+                                step="1"
+                                placeholder="默认 80000"
+                                :value="form.shallow_compress_trigger_tokens ?? ''"
+                                @input="
+                                  handleCompressionNumberInput(
+                                    'shallow_compress_trigger_tokens',
+                                    $event
+                                  )
+                                "
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                            <label class="compression-input-row">
+                              <span>浅压缩保留最近 Tool 条数</span>
+                              <input
+                                type="number"
+                                min="0"
+                                step="1"
+                                placeholder="默认 15"
+                                :value="form.shallow_compress_keep_recent_tools ?? ''"
+                                @input="
+                                  handleCompressionNumberInput(
+                                    'shallow_compress_keep_recent_tools',
+                                    $event
+                                  )
+                                "
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                            <label class="compression-input-row">
+                              <span>浅压缩每轮最多替换条数</span>
+                              <input
+                                type="number"
+                                min="1"
+                                step="1"
+                                placeholder="默认 10"
+                                :value="form.shallow_compress_max_replace_per_round ?? ''"
+                                @input="
+                                  handleCompressionNumberInput(
+                                    'shallow_compress_max_replace_per_round',
+                                    $event
+                                  )
+                                "
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                            <label class="compression-input-row">
+                              <span>浅压缩触发间隔（Tool 调用次数）</span>
+                              <input
+                                type="number"
+                                min="1"
+                                step="1"
+                                placeholder="默认 10"
+                                :value="form.shallow_compress_trigger_tool_calls_interval ?? ''"
+                                @input="
+                                  handleCompressionNumberInput(
+                                    'shallow_compress_trigger_tool_calls_interval',
+                                    $event
+                                  )
+                                "
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                            <label class="compression-input-row">
+                              <span>深压缩触发上下文</span>
+                              <input
+                                type="number"
+                                min="1000"
+                                step="1"
+                                placeholder="默认 150000"
+                                :value="form.deep_compress_trigger_tokens ?? ''"
+                                @input="
+                                  handleCompressionNumberInput(
+                                    'deep_compress_trigger_tokens',
+                                    $event
+                                  )
+                                "
+                                @focus="personalization.clearFeedback()"
+                              />
+                            </label>
+                          </div>
+                          <div class="compression-actions-row">
+                            <button
+                              type="button"
+                              class="compression-reset-btn"
+                              @click.prevent="restoreCompressionDefaults"
+                            >
+                              恢复默认
+                            </button>
+                          </div>
+                          <p class="field-desc compression-custom-hint">
+                            自定义项留空则使用默认值；深压缩触发上下文必须大于浅压缩触发上下文。
+                          </p>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">堆叠块显示模式</span>
+                            <p class="field-desc">选择思考/工具块的显示方式。默认为堆叠动画。</p>
+                          </div>
+                          <div class="run-mode-options">
+                            <button
+                              v-for="option in blockDisplayOptions"
+                              :key="option.id"
+                              type="button"
+                              class="run-mode-card"
+                              :class="{ active: experiments.blockDisplayMode === option.value }"
+                              :aria-pressed="experiments.blockDisplayMode === option.value"
+                              @click.prevent="handleBlockDisplayModeChange(option.value)"
+                            >
+                              <div class="run-mode-card-header">
+                                <span class="run-mode-title">{{ option.label }}</span>
+                                <span v-if="option.badge" class="run-mode-badge">{{
+                                  option.badge
+                                }}</span>
+                              </div>
+                              <p class="run-mode-desc">{{ option.desc }}</p>
+                            </button>
+                          </div>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">静默禁用</span>
+                            <p class="field-desc">
+                              禁用工具时不再注入提示消息，模型不会感知被禁用项。
+                            </p>
+                          </div>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.silent_tool_disable"
+                              @change="
+                                personalization.updateField({
+                                  key: 'silent_tool_disable',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>静默禁用工具（不向模型提示）</span>
+                          </label>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">自动生成对话标题</span>
+                            <p class="field-desc">默认开启；关闭后标题将沿用首条消息。</p>
+                          </div>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.auto_generate_title"
+                              @change="
+                                personalization.updateField({
+                                  key: 'auto_generate_title',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>使用快速模型为新对话生成含 emoji 的简短标题</span>
+                          </label>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">工具意图提示</span>
+                            <p class="field-desc">
+                              开启后，调用工具时会先用约15字告诉你要做什么，替代“正在/完成”文案。
+                            </p>
+                          </div>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.tool_intent_enabled"
+                              @change="
+                                personalization.updateField({
+                                  key: 'tool_intent_enabled',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>在工具块显示"我要做什么"的简短提示</span>
+                          </label>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">Skill 提示系统</span>
+                            <p class="field-desc">
+                              开启后，检测到特定关键词时会自动提示模型阅读相关 skill（如
+                              terminal-guide、sub-agent-guide 等）。
+                            </p>
+                          </div>
+                          <label class="toggle-row">
+                            <input
+                              type="checkbox"
+                              :checked="form.skill_hints_enabled"
+                              @change="
+                                personalization.updateField({
+                                  key: 'skill_hints_enabled',
+                                  value: $event.target.checked
+                                })
+                              "
+                            />
+                            <span class="fancy-check" aria-hidden="true">
+                              <svg viewBox="0 0 64 64">
+                                <path
+                                  d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                  pathLength="575.0541381835938"
+                                  class="fancy-path"
+                                ></path>
+                              </svg>
+                            </span>
+                            <span>根据关键词自动提示阅读相关 skill</span>
+                          </label>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">强约束系统</span>
+                            <p class="field-desc">
+                              开启后，若未在当前对话先阅读对应
+                              SKILL.md，直接调用工具会返回“必须先阅读”。仅对个人空间中已启用的 skill
+                              生效。
+                            </p>
+                          </div>
+                          <div class="strict-skill-grid">
+                            <label class="toggle-row">
+                              <input
+                                type="checkbox"
+                                :checked="form.skill_strict_terminal_enabled"
+                                @change="
+                                  personalization.updateField({
+                                    key: 'skill_strict_terminal_enabled',
+                                    value: $event.target.checked
+                                  })
+                                "
+                              />
+                              <span class="fancy-check" aria-hidden="true">
+                                <svg viewBox="0 0 64 64">
+                                  <path
+                                    d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                    pathLength="575.0541381835938"
+                                    class="fancy-path"
+                                  ></path>
+                                </svg>
+                              </span>
+                              <span>Terminal 系列工具</span>
+                            </label>
+                            <label class="toggle-row">
+                              <input
+                                type="checkbox"
+                                :checked="form.skill_strict_sub_agent_enabled"
+                                @change="
+                                  personalization.updateField({
+                                    key: 'skill_strict_sub_agent_enabled',
+                                    value: $event.target.checked
+                                  })
+                                "
+                              />
+                              <span class="fancy-check" aria-hidden="true">
+                                <svg viewBox="0 0 64 64">
+                                  <path
+                                    d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                    pathLength="575.0541381835938"
+                                    class="fancy-path"
+                                  ></path>
+                                </svg>
+                              </span>
+                              <span>子智能体系列工具</span>
+                            </label>
+                            <label class="toggle-row">
+                              <input
+                                type="checkbox"
+                                :checked="form.skill_strict_run_command_foreground_enabled"
+                                @change="
+                                  personalization.updateField({
+                                    key: 'skill_strict_run_command_foreground_enabled',
+                                    value: $event.target.checked
+                                  })
+                                "
+                              />
+                              <span class="fancy-check" aria-hidden="true">
+                                <svg viewBox="0 0 64 64">
+                                  <path
+                                    d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                    pathLength="575.0541381835938"
+                                    class="fancy-path"
+                                  ></path>
+                                </svg>
+                              </span>
+                              <span>run_command 前台模式</span>
+                            </label>
+                            <label class="toggle-row">
+                              <input
+                                type="checkbox"
+                                :checked="form.skill_strict_run_command_background_enabled"
+                                @change="
+                                  personalization.updateField({
+                                    key: 'skill_strict_run_command_background_enabled',
+                                    value: $event.target.checked
+                                  })
+                                "
+                              />
+                              <span class="fancy-check" aria-hidden="true">
+                                <svg viewBox="0 0 64 64">
+                                  <path
+                                    d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
+                                    pathLength="575.0541381835938"
+                                    class="fancy-path"
+                                  ></path>
+                                </svg>
+                              </span>
+                              <span>run_command 后台模式</span>
+                            </label>
+                          </div>
+                        </div>
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">默认禁用工具类别</span>
+                            <p class="field-desc">
+                              选择后，这些类别在新任务中会保持关闭，也可随时通过快捷菜单临时开启。
+                            </p>
+                          </div>
+                          <div class="tool-category-grid" v-if="toolCategories.length">
+                            <label
+                              v-for="category in toolCategories"
+                              :key="category.id"
+                              class="tool-category-chip"
+                            >
+                              <input
+                                type="checkbox"
+                                :checked="form.disabled_tool_categories.includes(category.id)"
+                                @change="toggleCategory(category.id)"
+                              />
+                              <span>{{ category.label }}</span>
+                            </label>
+                          </div>
+                          <p class="behavior-hint" v-else>暂无可配置的工具类别。</p>
                         </div>
-                        <label class="toggle-row">
-                          <input
-                            type="checkbox"
-                            :checked="form.enhanced_tool_display"
-                            @change="personalization.updateField({ key: 'enhanced_tool_display', value: $event.target.checked })"
-                          />
-                          <span class="fancy-check" aria-hidden="true">
-                            <svg viewBox="0 0 64 64">
-                              <path
-                                d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                                pathLength="575.0541381835938"
-                                class="fancy-path"
-                              ></path>
-                            </svg>
-                          </span>
-                          <span>显示格式化的工具结果（更清晰易读）</span>
-                        </label>
                       </div>
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">上下文压缩策略</span>
-                          <p class="field-desc">可分别控制自动浅层压缩与自动深层压缩。</p>
-                        </div>
-                        <label class="toggle-row">
-                          <input
-                            type="checkbox"
-                            :checked="form.auto_shallow_compress_enabled"
-                            @change="personalization.updateField({ key: 'auto_shallow_compress_enabled', value: $event.target.checked })"
-                          />
-                          <span class="fancy-check" aria-hidden="true">
-                            <svg viewBox="0 0 64 64">
-                              <path
-                                d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                                pathLength="575.0541381835938"
-                                class="fancy-path"
-                              ></path>
-                            </svg>
-                          </span>
-                          <span>自动浅层压缩</span>
-                        </label>
-                        <label class="toggle-row">
-                          <input
-                            type="checkbox"
-                            :checked="form.auto_deep_compress_enabled"
-                            @change="personalization.updateField({ key: 'auto_deep_compress_enabled', value: $event.target.checked })"
-                          />
-                          <span class="fancy-check" aria-hidden="true">
-                            <svg viewBox="0 0 64 64">
-                              <path
-                                d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                                pathLength="575.0541381835938"
-                                class="fancy-path"
-                              ></path>
-                            </svg>
-                          </span>
-                          <span>自动深层压缩</span>
-                        </label>
-                        <div class="compression-custom-grid">
-                          <label class="compression-input-row">
-                            <span>浅压缩触发上下文</span>
-                            <input
-                              type="number"
-                              min="1000"
-                              step="1"
-                              placeholder="默认 80000"
-                              :value="form.shallow_compress_trigger_tokens ?? ''"
-                              @input="handleCompressionNumberInput('shallow_compress_trigger_tokens', $event)"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                          <label class="compression-input-row">
-                            <span>浅压缩保留最近 Tool 条数</span>
-                            <input
-                              type="number"
-                              min="0"
-                              step="1"
-                              placeholder="默认 15"
-                              :value="form.shallow_compress_keep_recent_tools ?? ''"
-                              @input="handleCompressionNumberInput('shallow_compress_keep_recent_tools', $event)"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                          <label class="compression-input-row">
-                            <span>浅压缩每轮最多替换条数</span>
-                            <input
-                              type="number"
-                              min="1"
-                              step="1"
-                              placeholder="默认 10"
-                              :value="form.shallow_compress_max_replace_per_round ?? ''"
-                              @input="handleCompressionNumberInput('shallow_compress_max_replace_per_round', $event)"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                          <label class="compression-input-row">
-                            <span>浅压缩触发间隔（Tool 调用次数）</span>
-                            <input
-                              type="number"
-                              min="1"
-                              step="1"
-                              placeholder="默认 10"
-                              :value="form.shallow_compress_trigger_tool_calls_interval ?? ''"
-                              @input="handleCompressionNumberInput('shallow_compress_trigger_tool_calls_interval', $event)"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                          <label class="compression-input-row">
-                            <span>深压缩触发上下文</span>
-                            <input
-                              type="number"
-                              min="1000"
-                              step="1"
-                              placeholder="默认 150000"
-                              :value="form.deep_compress_trigger_tokens ?? ''"
-                              @input="handleCompressionNumberInput('deep_compress_trigger_tokens', $event)"
-                              @focus="personalization.clearFeedback()"
-                            />
-                          </label>
-                        </div>
-                        <div class="compression-actions-row">
-                          <button type="button" class="compression-reset-btn" @click.prevent="restoreCompressionDefaults">
-                            恢复默认
+                      <div class="personal-actions-row">
+                        <div class="personal-form-actions card-aligned">
+                          <div class="personal-status-group">
+                            <transition name="personal-status-fade">
+                              <span class="status success" v-if="status">{{ status }}</span>
+                            </transition>
+                            <transition name="personal-status-fade">
+                              <span class="status error" v-if="error">{{ error }}</span>
+                            </transition>
+                          </div>
+                          <button type="submit" class="primary" :disabled="saving">
+                            {{ saving ? '保存中...' : '保存设置' }}
                           </button>
                         </div>
-                        <p class="field-desc compression-custom-hint">
-                          自定义项留空则使用默认值；深压缩触发上下文必须大于浅压缩触发上下文。
-                        </p>
                       </div>
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">堆叠块显示模式</span>
-                          <p class="field-desc">选择思考/工具块的显示方式。默认为堆叠动画。</p>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'skills'"
+                      key="skills"
+                      class="personal-page behavior-page"
+                      data-tutorial="personal-page-skills"
+                    >
+                      <div class="behavior-section">
+                        <div class="behavior-field">
+                          <div class="behavior-field-header">
+                            <span class="field-title">可用 Skills</span>
+                            <p class="field-desc">
+                              勾选后会注入 system prompt，并同步到工作区的 skills/ 目录。
+                            </p>
+                          </div>
+                          <div class="tool-category-grid" v-if="skillsCatalog.length">
+                            <label
+                              v-for="skill in skillsCatalog"
+                              :key="skill.id"
+                              class="tool-category-chip"
+                            >
+                              <input
+                                type="checkbox"
+                                :checked="form.enabled_skills.includes(skill.id)"
+                                @change="personalization.toggleSkill(skill.id)"
+                              />
+                              <span>{{ skill.label }}</span>
+                            </label>
+                          </div>
+                          <p class="behavior-hint" v-else>暂无可用的 skills。</p>
                         </div>
-                        <div class="run-mode-options">
+                      </div>
+                      <div class="personal-actions-row">
+                        <div class="personal-form-actions card-aligned">
+                          <div class="personal-status-group">
+                            <transition name="personal-status-fade">
+                              <span class="status success" v-if="status">{{ status }}</span>
+                            </transition>
+                            <transition name="personal-status-fade">
+                              <span class="status error" v-if="error">{{ error }}</span>
+                            </transition>
+                          </div>
+                          <button type="submit" class="primary" :disabled="saving">
+                            {{ saving ? '保存中...' : '保存设置' }}
+                          </button>
+                        </div>
+                      </div>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'theme'"
+                      key="theme"
+                      class="personal-page theme-page"
+                      data-tutorial="personal-page-theme"
+                    >
+                      <div class="theme-section">
+                        <div class="theme-header">
+                          <div>
+                            <h3>界面主题</h3>
+                            <p>在经典、明亮和夜间之间一键切换。会立即应用并保存在本地。</p>
+                          </div>
+                          <div class="theme-badge">Beta</div>
+                        </div>
+                        <div class="theme-grid">
                           <button
-                            v-for="option in blockDisplayOptions"
+                            v-for="option in themeOptions"
                             :key="option.id"
                             type="button"
-                            class="run-mode-card"
-                            :class="{ active: experiments.blockDisplayMode === option.value }"
-                            :aria-pressed="experiments.blockDisplayMode === option.value"
-                            @click.prevent="handleBlockDisplayModeChange(option.value)"
+                            class="theme-card"
+                            :class="{ active: activeTheme === option.id }"
+                            @click.prevent="applyThemeOption(option.id)"
                           >
-                            <div class="run-mode-card-header">
-                              <span class="run-mode-title">{{ option.label }}</span>
-                              <span v-if="option.badge" class="run-mode-badge">{{ option.badge }}</span>
+                            <div class="theme-card-head">
+                              <div class="theme-dot-row">
+                                <span
+                                  v-for="(color, idx) in option.swatches"
+                                  :key="`${option.id}-${idx}`"
+                                  class="theme-dot"
+                                  :style="{ background: color }"
+                                  aria-hidden="true"
+                                ></span>
+                              </div>
+                              <span class="theme-check" v-if="activeTheme === option.id">✓</span>
+                            </div>
+                            <div class="theme-card-body">
+                              <h4>{{ option.label }}</h4>
+                              <p>{{ option.desc }}</p>
                             </div>
-                            <p class="run-mode-desc">{{ option.desc }}</p>
                           </button>
                         </div>
-                      </div>
-                  <div class="behavior-field">
-                    <div class="behavior-field-header">
-                      <span class="field-title">静默禁用</span>
-                      <p class="field-desc">禁用工具时不再注入提示消息，模型不会感知被禁用项。</p>
-                    </div>
-                    <label class="toggle-row">
-                      <input
-                        type="checkbox"
-                        :checked="form.silent_tool_disable"
-                        @change="personalization.updateField({ key: 'silent_tool_disable', value: $event.target.checked })"
-                      />
-                      <span class="fancy-check" aria-hidden="true">
-                        <svg viewBox="0 0 64 64">
-                          <path
-                            d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                            pathLength="575.0541381835938"
-                            class="fancy-path"
-                          ></path>
-                        </svg>
-                      </span>
-                      <span>静默禁用工具（不向模型提示）</span>
-                    </label>
-                  </div>
-                  <div class="behavior-field">
-                    <div class="behavior-field-header">
-                      <span class="field-title">自动生成对话标题</span>
-                      <p class="field-desc">默认开启；关闭后标题将沿用首条消息。</p>
-                    </div>
-                        <label class="toggle-row">
-                          <input
-                            type="checkbox"
-                            :checked="form.auto_generate_title"
-                            @change="personalization.updateField({ key: 'auto_generate_title', value: $event.target.checked })"
-                          />
-                          <span class="fancy-check" aria-hidden="true">
-                            <svg viewBox="0 0 64 64">
-                              <path
-                                d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                                pathLength="575.0541381835938"
-                                class="fancy-path"
-                              ></path>
-                            </svg>
-                          </span>
-                          <span>使用快速模型为新对话生成含 emoji 的简短标题</span>
-                        </label>
-                      </div>
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">工具意图提示</span>
-                          <p class="field-desc">开启后，调用工具时会先用约15字告诉你要做什么，替代“正在/完成”文案。</p>
-                        </div>
-                        <label class="toggle-row">
-                          <input
-                            type="checkbox"
-                            :checked="form.tool_intent_enabled"
-                            @change="personalization.updateField({ key: 'tool_intent_enabled', value: $event.target.checked })"
-                          />
-                          <span class="fancy-check" aria-hidden="true">
-                            <svg viewBox="0 0 64 64">
-                              <path
-                                d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                                pathLength="575.0541381835938"
-                                class="fancy-path"
-                          ></path>
-                        </svg>
-                      </span>
-                      <span>在工具块显示"我要做什么"的简短提示</span>
-                    </label>
-                  </div>
-                  <div class="behavior-field">
-                    <div class="behavior-field-header">
-                      <span class="field-title">Skill 提示系统</span>
-                      <p class="field-desc">开启后，检测到特定关键词时会自动提示模型阅读相关 skill（如 terminal-guide、sub-agent-guide 等）。</p>
-                    </div>
-                    <label class="toggle-row">
-                      <input
-                        type="checkbox"
-                        :checked="form.skill_hints_enabled"
-                        @change="personalization.updateField({ key: 'skill_hints_enabled', value: $event.target.checked })"
-                      />
-                      <span class="fancy-check" aria-hidden="true">
-                        <svg viewBox="0 0 64 64">
-                          <path
-                            d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                            pathLength="575.0541381835938"
-                            class="fancy-path"
-                          ></path>
-                        </svg>
-                      </span>
-                      <span>根据关键词自动提示阅读相关 skill</span>
-                    </label>
-                  </div>
-                  <div class="behavior-field">
-                    <div class="behavior-field-header">
-                      <span class="field-title">强约束系统</span>
-                      <p class="field-desc">开启后，若未在当前对话先阅读对应 SKILL.md，直接调用工具会返回“必须先阅读”。仅对个人空间中已启用的 skill 生效。</p>
-                    </div>
-                    <div class="strict-skill-grid">
-                      <label class="toggle-row">
-                        <input
-                          type="checkbox"
-                          :checked="form.skill_strict_terminal_enabled"
-                          @change="personalization.updateField({ key: 'skill_strict_terminal_enabled', value: $event.target.checked })"
-                        />
-                        <span class="fancy-check" aria-hidden="true">
-                          <svg viewBox="0 0 64 64">
-                            <path
-                              d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                              pathLength="575.0541381835938"
-                              class="fancy-path"
-                            ></path>
-                          </svg>
-                        </span>
-                        <span>Terminal 系列工具</span>
-                      </label>
-                      <label class="toggle-row">
-                        <input
-                          type="checkbox"
-                          :checked="form.skill_strict_sub_agent_enabled"
-                          @change="personalization.updateField({ key: 'skill_strict_sub_agent_enabled', value: $event.target.checked })"
-                        />
-                        <span class="fancy-check" aria-hidden="true">
-                          <svg viewBox="0 0 64 64">
-                            <path
-                              d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                              pathLength="575.0541381835938"
-                              class="fancy-path"
-                            ></path>
-                          </svg>
-                        </span>
-                        <span>子智能体系列工具</span>
-                      </label>
-                      <label class="toggle-row">
-                        <input
-                          type="checkbox"
-                          :checked="form.skill_strict_run_command_foreground_enabled"
-                          @change="personalization.updateField({ key: 'skill_strict_run_command_foreground_enabled', value: $event.target.checked })"
-                        />
-                        <span class="fancy-check" aria-hidden="true">
-                          <svg viewBox="0 0 64 64">
-                            <path
-                              d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                              pathLength="575.0541381835938"
-                              class="fancy-path"
-                            ></path>
-                          </svg>
-                        </span>
-                        <span>run_command 前台模式</span>
-                      </label>
-                      <label class="toggle-row">
-                        <input
-                          type="checkbox"
-                          :checked="form.skill_strict_run_command_background_enabled"
-                          @change="personalization.updateField({ key: 'skill_strict_run_command_background_enabled', value: $event.target.checked })"
-                        />
-                        <span class="fancy-check" aria-hidden="true">
-                          <svg viewBox="0 0 64 64">
-                            <path
-                              d="M 0 16 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 16 L 32 48 L 64 16 V 8 A 8 8 90 0 0 56 0 H 8 A 8 8 90 0 0 0 8 V 56 A 8 8 90 0 0 8 64 H 56 A 8 8 90 0 0 64 56 V 16"
-                              pathLength="575.0541381835938"
-                              class="fancy-path"
-                            ></path>
-                          </svg>
-                        </span>
-                        <span>run_command 后台模式</span>
-                      </label>
-                    </div>
-                  </div>
-                  <div class="behavior-field">
-                    <div class="behavior-field-header">
-                      <span class="field-title">默认禁用工具类别</span>
-                      <p class="field-desc">选择后，这些类别在新任务中会保持关闭，也可随时通过快捷菜单临时开启。</p>
-                    </div>
-                        <div class="tool-category-grid" v-if="toolCategories.length">
-                          <label
-                            v-for="category in toolCategories"
-                            :key="category.id"
-                            class="tool-category-chip"
-                          >
-                            <input
-                              type="checkbox"
-                              :checked="form.disabled_tool_categories.includes(category.id)"
-                              @change="toggleCategory(category.id)"
-                            />
-                            <span>{{ category.label }}</span>
-                          </label>
-                        </div>
-                        <p class="behavior-hint" v-else>暂无可配置的工具类别。</p>
-                      </div>
-                    </div>
-                    <div class="personal-actions-row">
-                      <div class="personal-form-actions card-aligned">
-                        <div class="personal-status-group">
-                          <transition name="personal-status-fade">
-                            <span class="status success" v-if="status">{{ status }}</span>
-                          </transition>
-                          <transition name="personal-status-fade">
-                            <span class="status error" v-if="error">{{ error }}</span>
-                          </transition>
-                        </div>
-                        <button type="submit" class="primary" :disabled="saving">
-                          {{ saving ? '保存中...' : '保存设置' }}
-                        </button>
-                      </div>
-                    </div>
-                    </section>
-                  <section v-else-if="activeTab === 'skills'" key="skills" class="personal-page behavior-page" data-tutorial="personal-page-skills">
-                    <div class="behavior-section">
-                      <div class="behavior-field">
-                        <div class="behavior-field-header">
-                          <span class="field-title">可用 Skills</span>
-                          <p class="field-desc">勾选后会注入 system prompt，并同步到工作区的 skills/ 目录。</p>
-                        </div>
-                        <div class="tool-category-grid" v-if="skillsCatalog.length">
-                          <label
-                            v-for="skill in skillsCatalog"
-                            :key="skill.id"
-                            class="tool-category-chip"
-                          >
-                            <input
-                              type="checkbox"
-                              :checked="form.enabled_skills.includes(skill.id)"
-                              @change="personalization.toggleSkill(skill.id)"
-                            />
-                            <span>{{ skill.label }}</span>
-                          </label>
-                        </div>
-                        <p class="behavior-hint" v-else>暂无可用的 skills。</p>
-                      </div>
-                    </div>
-                    <div class="personal-actions-row">
-                      <div class="personal-form-actions card-aligned">
-                        <div class="personal-status-group">
-                          <transition name="personal-status-fade">
-                            <span class="status success" v-if="status">{{ status }}</span>
-                          </transition>
-                          <transition name="personal-status-fade">
-                            <span class="status error" v-if="error">{{ error }}</span>
-                          </transition>
-                        </div>
-                        <button type="submit" class="primary" :disabled="saving">
-                          {{ saving ? '保存中...' : '保存设置' }}
-                        </button>
-                      </div>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'theme'" key="theme" class="personal-page theme-page" data-tutorial="personal-page-theme">
-                    <div class="theme-section">
-                      <div class="theme-header">
-                        <div>
-                          <h3>界面主题</h3>
-                          <p>在经典、明亮和夜间之间一键切换。会立即应用并保存在本地。</p>
-                        </div>
-                        <div class="theme-badge">Beta</div>
-                      </div>
-                      <div class="theme-grid">
-                        <button
-                          v-for="option in themeOptions"
-                          :key="option.id"
-                          type="button"
-                          class="theme-card"
-                          :class="{ active: activeTheme === option.id }"
-                          @click.prevent="applyThemeOption(option.id)"
-                        >
-                          <div class="theme-card-head">
-                            <div class="theme-dot-row">
-                              <span
-                                v-for="(color, idx) in option.swatches"
-                                :key="`${option.id}-${idx}`"
-                                class="theme-dot"
-                                :style="{ background: color }"
-                                aria-hidden="true"
-                              ></span>
-                            </div>
-                            <span class="theme-check" v-if="activeTheme === option.id">✓</span>
-                          </div>
-                          <div class="theme-card-body">
-                            <h4>{{ option.label }}</h4>
-                            <p>{{ option.desc }}</p>
-                          </div>
-                        </button>
-                      </div>
-                      <p class="theme-note">虚拟显示器保持原样；仅主界面、侧边栏与个人空间配色随主题改变。</p>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'tutorial'" key="tutorial" class="personal-page tutorial-page">
-                    <div class="tutorial-intro-content">
-                      <div class="tutorial-intro-header">
-                        <p class="tutorial-intro-eyebrow">功能引导</p>
-                        <h3>新手教程</h3>
-                        <p class="tutorial-intro-desc">
-                          通过高亮 + 悬浮说明窗，快速了解主要功能入口和常用设置。
+                        <p class="theme-note">
+                          虚拟显示器保持原样；仅主界面、侧边栏与个人空间配色随主题改变。
                         </p>
                       </div>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'tutorial'"
+                      key="tutorial"
+                      class="personal-page tutorial-page"
+                    >
+                      <div class="tutorial-intro-content">
+                        <div class="tutorial-intro-header">
+                          <p class="tutorial-intro-eyebrow">功能引导</p>
+                          <h3>新手教程</h3>
+                          <p class="tutorial-intro-desc">
+                            通过高亮 + 悬浮说明窗，快速了解主要功能入口和常用设置。
+                          </p>
+                        </div>
 
-                      <div class="tutorial-intro-features">
-                        <div class="tutorial-feature-item">
-                          <div>
-                            <h4>主界面导览</h4>
-                            <p>认识侧边栏、工作区、模型与模式选择。</p>
+                        <div class="tutorial-intro-features">
+                          <div class="tutorial-feature-item">
+                            <div>
+                              <h4>主界面导览</h4>
+                              <p>认识侧边栏、工作区、模型与模式选择。</p>
+                            </div>
+                          </div>
+                          <div class="tutorial-feature-item">
+                            <div>
+                              <h4>快捷菜单</h4>
+                              <p>学习上传文件、对话回顾、用量统计等高频功能。</p>
+                            </div>
+                          </div>
+                          <div class="tutorial-feature-item">
+                            <div>
+                              <h4>个人空间</h4>
+                              <p>了解模型偏好、主题、Skills、图片压缩等配置。</p>
+                            </div>
                           </div>
                         </div>
-                        <div class="tutorial-feature-item">
-                          <div>
-                            <h4>快捷菜单</h4>
-                            <p>学习上传文件、对话回顾、用量统计等高频功能。</p>
-                          </div>
-                        </div>
-                        <div class="tutorial-feature-item">
-                          <div>
-                            <h4>个人空间</h4>
-                            <p>了解模型偏好、主题、Skills、图片压缩等配置。</p>
-                          </div>
-                        </div>
-                      </div>
 
-                      <div class="tutorial-intro-actions">
-                        <button type="button" class="tutorial-start-button" @click="startTutorial">
-                          开始新手教程
-                        </button>
-                        <p class="tutorial-intro-hint">教程开始后会自动关闭个人空间，您可随时退出或跳过当前步骤。</p>
-                      </div>
-                    </div>
-                  </section>
-                  <section v-else-if="activeTab === 'admin-monitor'" key="admin-monitor" class="personal-page admin-monitor-page">
-                    <div class="admin-monitor-panel">
-                      <div class="admin-monitor-heading">
-                        <p class="admin-monitor-eyebrow">系统资源</p>
-                        <div class="admin-monitor-title-row">
-                          <h3>管理员监控入口</h3>
-                          <span class="admin-monitor-chip">自动刷新</span>
+                        <div class="tutorial-intro-actions">
+                          <button
+                            type="button"
+                            class="tutorial-start-button"
+                            @click="startTutorial"
+                          >
+                            开始新手教程
+                          </button>
+                          <p class="tutorial-intro-hint">
+                            教程开始后会自动关闭个人空间，您可随时退出或跳过当前步骤。
+                          </p>
                         </div>
-                        <p class="admin-monitor-desc">独立面板集中展示配额趋势、容器运行、项目存储与上传安全。</p>
                       </div>
-                      <div class="admin-monitor-highlights">
-                        <span class="admin-monitor-tag">用量统计</span>
-                        <span class="admin-monitor-tag">容器健康</span>
-                        <span class="admin-monitor-tag">上传审计</span>
-                        <span class="admin-monitor-tag">邀请码管理</span>
-                      </div>
-                      <div class="admin-monitor-actions">
-                        <button type="button" class="admin-monitor-button" @click="openAdminPanel">
-                          打开监控面板
-                        </button>
-                        <button type="button" class="admin-monitor-button ghost" @click="openApiAdmin">
-                          API 管理
-                        </button>
-                        <p class="admin-monitor-hint">新窗口开启，不打断当前对话与配置。</p>
-                      </div>
-                    </div>
-                    <div class="admin-monitor-panel secondary">
-                      <div class="admin-monitor-heading">
-                        <p class="admin-monitor-eyebrow">自定义工具</p>
-                        <div class="admin-monitor-title-row">
-                          <h3>自定义工具管理</h3>
-                          <span class="admin-monitor-chip alt">低代码 · Python</span>
+                    </section>
+                    <section
+                      v-else-if="activeTab === 'admin-monitor'"
+                      key="admin-monitor"
+                      class="personal-page admin-monitor-page"
+                    >
+                      <div class="admin-monitor-panel">
+                        <div class="admin-monitor-heading">
+                          <p class="admin-monitor-eyebrow">系统资源</p>
+                          <div class="admin-monitor-title-row">
+                            <h3>管理员监控入口</h3>
+                            <span class="admin-monitor-chip">自动刷新</span>
+                          </div>
+                          <p class="admin-monitor-desc">
+                            独立面板集中展示配额趋势、容器运行、项目存储与上传安全。
+                          </p>
+                        </div>
+                        <div class="admin-monitor-highlights">
+                          <span class="admin-monitor-tag">用量统计</span>
+                          <span class="admin-monitor-tag">容器健康</span>
+                          <span class="admin-monitor-tag">上传审计</span>
+                          <span class="admin-monitor-tag">邀请码管理</span>
+                        </div>
+                        <div class="admin-monitor-actions">
+                          <button
+                            type="button"
+                            class="admin-monitor-button"
+                            @click="openAdminPanel"
+                          >
+                            打开监控面板
+                          </button>
+                          <button
+                            type="button"
+                            class="admin-monitor-button ghost"
+                            @click="openApiAdmin"
+                          >
+                            API 管理
+                          </button>
+                          <p class="admin-monitor-hint">新窗口开启，不打断当前对话与配置。</p>
                         </div>
-                        <p class="admin-monitor-desc">在线创建/编辑 definition.json、execution.py、return.json、meta.json，保存后自动生效。</p>
                       </div>
-                      <div class="admin-monitor-highlights">
-                        <span class="admin-monitor-tag">仅管理员可见</span>
-                        <span class="admin-monitor-tag">容器内执行</span>
-                        <span class="admin-monitor-tag">无需重启</span>
-                        <span class="admin-monitor-tag">三层拆分</span>
+                      <div class="admin-monitor-panel secondary">
+                        <div class="admin-monitor-heading">
+                          <p class="admin-monitor-eyebrow">自定义工具</p>
+                          <div class="admin-monitor-title-row">
+                            <h3>自定义工具管理</h3>
+                            <span class="admin-monitor-chip alt">低代码 · Python</span>
+                          </div>
+                          <p class="admin-monitor-desc">
+                            在线创建/编辑
+                            definition.json、execution.py、return.json、meta.json，保存后自动生效。
+                          </p>
+                        </div>
+                        <div class="admin-monitor-highlights">
+                          <span class="admin-monitor-tag">仅管理员可见</span>
+                          <span class="admin-monitor-tag">容器内执行</span>
+                          <span class="admin-monitor-tag">无需重启</span>
+                          <span class="admin-monitor-tag">三层拆分</span>
+                        </div>
+                        <div class="admin-monitor-actions">
+                          <button
+                            type="button"
+                            class="admin-monitor-button"
+                            @click="openCustomTools"
+                          >
+                            打开自定义工具
+                          </button>
+                          <p class="admin-monitor-hint">新窗口打开 /admin/custom-tools 页面。</p>
+                        </div>
                       </div>
-                      <div class="admin-monitor-actions">
-                        <button type="button" class="admin-monitor-button" @click="openCustomTools">
-                          打开自定义工具
-                        </button>
-                        <p class="admin-monitor-hint">新窗口打开 /admin/custom-tools 页面。</p>
-                      </div>
-                    </div>
-                  </section>
+                    </section>
                   </transition>
                 </div>
               </div>
@@ -1005,7 +1291,7 @@
 <script setup lang="ts">
 import { ref, computed, watch, onMounted } from 'vue';
 import { storeToRefs } from 'pinia';
-import { usePersonalizationStore, type BlockDisplayMode } from '@/stores/personalization';
+import { usePersonalizationStore } from '@/stores/personalization';
 import { useResourceStore } from '@/stores/resource';
 import { useUiStore } from '@/stores/ui';
 import { usePolicyStore } from '@/stores/policy';
@@ -1090,7 +1376,13 @@ type CompressionField =
   | 'shallow_compress_trigger_tool_calls_interval'
   | 'deep_compress_trigger_tokens';
 
-const runModeOptions: Array<{ id: string; label: string; desc: string; value: RunModeValue; badge?: string }> = [
+const runModeOptions: Array<{
+  id: string;
+  label: string;
+  desc: string;
+  value: RunModeValue;
+  badge?: string;
+}> = [
   { id: 'fast', label: '快速模式', desc: '追求响应速度，跳过思考模型', value: 'fast' },
   { id: 'thinking', label: '思考模式', desc: '首轮回复会先输出思考过程', value: 'thinking' },
   { id: 'deep', label: '深度思考', desc: '整轮对话都使用思考模型', value: 'deep' }
@@ -1107,7 +1399,7 @@ const filteredModelOptions = computed(() =>
       value: opt.key,
       label: opt.label,
       desc: opt.description || '',
-      badge: multimodal === 'image,video' ? '图文' : (opt.deepOnly ? '深度思考' : undefined),
+      badge: multimodal === 'image,video' ? '图文' : opt.deepOnly ? '深度思考' : undefined,
       deepOnly: !!opt.deepOnly,
       fastOnly: !!opt.fastOnly,
       disabled: policyStore.disabledModelSet.has(opt.key)
@@ -1175,8 +1467,14 @@ if (typeof window !== 'undefined') {
   const vcRaw = params.get('app_vc') || '';
   const vnRaw = params.get('app_vn') || '';
   const bridge = (window as any)?.AndroidThemeBridge;
-  const bridgeVcRaw = bridge && typeof bridge.getAppVersionCode === 'function' ? String(bridge.getAppVersionCode() || '') : '';
-  const bridgeVnRaw = bridge && typeof bridge.getAppVersionName === 'function' ? String(bridge.getAppVersionName() || '') : '';
+  const bridgeVcRaw =
+    bridge && typeof bridge.getAppVersionCode === 'function'
+      ? String(bridge.getAppVersionCode() || '')
+      : '';
+  const bridgeVnRaw =
+    bridge && typeof bridge.getAppVersionName === 'function'
+      ? String(bridge.getAppVersionName() || '')
+      : '';
   // App 端优先使用 Bridge 实时版本，避免 WebView 恢复旧 URL 参数导致显示过期版本号
   const finalVcRaw = bridgeVcRaw || vcRaw;
   const finalVnRaw = bridgeVnRaw || vnRaw;
@@ -1189,8 +1487,14 @@ const hydrateAppVersionFromBridge = () => {
   const bridge = (window as any)?.AndroidThemeBridge;
   if (!bridge) return;
   try {
-    const vcRaw = typeof bridge.getAppVersionCode === 'function' ? String(bridge.getAppVersionCode() || '') : '';
-    const vnRaw = typeof bridge.getAppVersionName === 'function' ? String(bridge.getAppVersionName() || '') : '';
+    const vcRaw =
+      typeof bridge.getAppVersionCode === 'function'
+        ? String(bridge.getAppVersionCode() || '')
+        : '';
+    const vnRaw =
+      typeof bridge.getAppVersionName === 'function'
+        ? String(bridge.getAppVersionName() || '')
+        : '';
     if (vcRaw && /^\d+$/.test(vcRaw)) {
       appCurrentVersionCode.value = Number(vcRaw);
     }
@@ -1326,7 +1630,13 @@ watch(
     if (isVisible && tab === 'usage') {
       fetchUsageSummary();
     }
-    if (isVisible && tab === 'app-update' && isAppShell.value && !appUpdateInfo.value && !appUpdateChecking.value) {
+    if (
+      isVisible &&
+      tab === 'app-update' &&
+      isAppShell.value &&
+      !appUpdateInfo.value &&
+      !appUpdateChecking.value
+    ) {
       checkAppUpdate();
     }
   }
@@ -1481,7 +1791,10 @@ const restoreCompressionDefaults = () => {
 };
 
 const isPresetActive = (value: number) => {
-  if (form.value.thinking_interval === null || typeof form.value.thinking_interval === 'undefined') {
+  if (
+    form.value.thinking_interval === null ||
+    typeof form.value.thinking_interval === 'undefined'
+  ) {
     return value === thinkingIntervalDefault.value;
   }
   return form.value.thinking_interval === value;
@@ -1492,9 +1805,26 @@ const toggleCategory = (categoryId: string) => {
 };
 
 const blockDisplayOptions = [
-  { id: 'traditional', label: '传统列表', desc: '按时间顺序垂直排列，经典样式', value: 'traditional' as const },
-  { id: 'stacked', label: '堆叠动画', desc: '超过 6 条自动收纳为"更多"，动态展示', value: 'stacked' as const, badge: '推荐' },
-  { id: 'minimal', label: '极简模式', desc: '摘要行 + 无缝展开，流式输出效果', value: 'minimal' as const, badge: '新' }
+  {
+    id: 'traditional',
+    label: '传统列表',
+    desc: '按时间顺序垂直排列，经典样式',
+    value: 'traditional' as const
+  },
+  {
+    id: 'stacked',
+    label: '堆叠动画',
+    desc: '超过 6 条自动收纳为"更多"，动态展示',
+    value: 'stacked' as const,
+    badge: '推荐'
+  },
+  {
+    id: 'minimal',
+    label: '极简模式',
+    desc: '摘要行 + 无缝展开，流式输出效果',
+    value: 'minimal' as const,
+    badge: '新'
+  }
 ];
 
 const handleBlockDisplayModeChange = (mode: 'traditional' | 'stacked' | 'minimal') => {
@@ -1589,7 +1919,9 @@ const applyThemeOption = (theme: ThemeKey) => {
   color: var(--claude-text);
   font-size: 12px;
   cursor: pointer;
-  transition: transform 0.18s ease, box-shadow 0.18s ease;
+  transition:
+    transform 0.18s ease,
+    box-shadow 0.18s ease;
 }
 
 .compression-reset-btn:hover {
@@ -1658,7 +1990,9 @@ const applyThemeOption = (theme: ThemeKey) => {
   font-size: 12px;
   font-weight: 600;
   cursor: pointer;
-  transition: transform 0.18s ease, box-shadow 0.18s ease;
+  transition:
+    transform 0.18s ease,
+    box-shadow 0.18s ease;
   box-shadow: 0 6px 14px rgba(61, 57, 41, 0.12);
   display: inline-flex;
   align-items: center;
@@ -1882,7 +2216,9 @@ const applyThemeOption = (theme: ThemeKey) => {
   letter-spacing: 0.04em;
   box-shadow: var(--theme-shadow-soft, var(--claude-shadow));
   cursor: pointer;
-  transition: transform 0.18s ease, box-shadow 0.18s ease;
+  transition:
+    transform 0.18s ease,
+    box-shadow 0.18s ease;
   display: inline-flex;
   align-items: center;
   justify-content: center;
diff --git a/static/src/components/shell/ConfirmDialog.vue b/static/src/components/shell/ConfirmDialog.vue
index 9468496..70cbb1c 100644
--- a/static/src/components/shell/ConfirmDialog.vue
+++ b/static/src/components/shell/ConfirmDialog.vue
@@ -8,7 +8,11 @@
           <button type="button" class="confirm-button" @click="resolve(false)">
             {{ dialog.cancelText || '取消' }}
           </button>
-          <button type="button" class="confirm-button confirm-button--primary" @click="resolve(true)">
+          <button
+            type="button"
+            class="confirm-button confirm-button--primary"
+            @click="resolve(true)"
+          >
             {{ dialog.confirmText || '确认' }}
           </button>
         </div>
diff --git a/static/src/components/shell/EasterEggOverlay.vue b/static/src/components/shell/EasterEggOverlay.vue
index 5ac124b..e9b9759 100644
--- a/static/src/components/shell/EasterEggOverlay.vue
+++ b/static/src/components/shell/EasterEggOverlay.vue
@@ -1,5 +1,10 @@
 <template>
-  <div class="easter-egg-overlay" :class="{ active: state.active }" aria-hidden="true" ref="overlayRoot"></div>
+  <div
+    class="easter-egg-overlay"
+    :class="{ active: state.active }"
+    aria-hidden="true"
+    ref="overlayRoot"
+  ></div>
 </template>
 
 <script setup lang="ts">
diff --git a/static/src/components/shell/QuotaToast.vue b/static/src/components/shell/QuotaToast.vue
index b594072..d4ed4ba 100644
--- a/static/src/components/shell/QuotaToast.vue
+++ b/static/src/components/shell/QuotaToast.vue
@@ -2,9 +2,7 @@
   <transition name="quota-toast-fade">
     <div class="quota-toast" v-if="quotaToast">
       <span class="quota-toast-label">{{ quotaToast.message }}</span>
-      <button type="button" class="toast-close" aria-label="关闭通知" @click="dismiss">
-        ×
-      </button>
+      <button type="button" class="toast-close" aria-label="关闭通知" @click="dismiss">×</button>
     </div>
   </transition>
 </template>
diff --git a/static/src/components/sidebar/ConversationSidebar.vue b/static/src/components/sidebar/ConversationSidebar.vue
index 46053c0..bb52637 100644
--- a/static/src/components/sidebar/ConversationSidebar.vue
+++ b/static/src/components/sidebar/ConversationSidebar.vue
@@ -19,8 +19,18 @@
                     stroke-width="1.7"
                     stroke-linejoin="round"
                   />
-                  <path d="M9 9.5h10" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" />
-                  <path d="M9 13h6" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" />
+                  <path
+                    d="M9 9.5h10"
+                    stroke="currentColor"
+                    stroke-width="1.7"
+                    stroke-linecap="round"
+                  />
+                  <path
+                    d="M9 13h6"
+                    stroke="currentColor"
+                    stroke-width="1.7"
+                    stroke-linecap="round"
+                  />
                 </svg>
               </slot>
             </span>
@@ -62,7 +72,12 @@
             @click="$emit('toggle-workspace')"
           >
             <span class="sr-only">{{ workspaceCollapsed ? '显示工作区' : '隐藏工作区' }}</span>
-            <span class="icon icon-md" data-tutorial="workspace-toggle" aria-hidden="true" :style="iconStyle('layers')"></span>
+            <span
+              class="icon icon-md"
+              data-tutorial="workspace-toggle"
+              aria-hidden="true"
+              :style="iconStyle('layers')"
+            ></span>
           </button>
           <button
             type="button"
@@ -72,8 +87,15 @@
             :aria-disabled="displayModeDisabled"
             :title="displayMode === 'monitor' ? '退出显示器' : '虚拟显示器'"
           >
-            <span class="sr-only">{{ displayMode === 'monitor' ? '退出显示器' : '虚拟显示器' }}</span>
-            <span class="icon icon-md" data-tutorial="monitor-toggle" aria-hidden="true" :style="iconStyle('monitor')"></span>
+            <span class="sr-only">{{
+              displayMode === 'monitor' ? '退出显示器' : '虚拟显示器'
+            }}</span>
+            <span
+              class="icon icon-md"
+              data-tutorial="monitor-toggle"
+              aria-hidden="true"
+              :style="iconStyle('monitor')"
+            ></span>
           </button>
         </div>
       </template>
@@ -85,7 +107,11 @@
           @click="$emit('create')"
         >
           <template v-if="monitorModeActive">
-            <span class="monitor-icon-slot icon icon-md" :style="iconStyle('pencil')" aria-hidden="true"></span>
+            <span
+              class="monitor-icon-slot icon icon-md"
+              :style="iconStyle('pencil')"
+              aria-hidden="true"
+            ></span>
             <span class="sr-only">新建对话</span>
           </template>
           <template v-else>
@@ -111,13 +137,22 @@
               <span class="sr-only">{{ collapsed ? '展开对话记录' : '折叠对话记录' }}</span>
             </template>
             <template v-else>
-              <span v-if="collapsed" class="icon icon-md" :style="iconStyle('menu')" aria-hidden="true"></span>
+              <span
+                v-if="collapsed"
+                class="icon icon-md"
+                :style="iconStyle('menu')"
+                aria-hidden="true"
+              ></span>
               <span v-else class="toggle-arrow" aria-hidden="true">←</span>
             </template>
           </template>
           <template v-else>
             <template v-if="monitorModeActive">
-              <span class="monitor-icon-slot icon icon-md" :style="iconStyle('x')" aria-hidden="true"></span>
+              <span
+                class="monitor-icon-slot icon icon-md"
+                :style="iconStyle('x')"
+                aria-hidden="true"
+              ></span>
               <span class="sr-only">关闭侧边栏</span>
             </template>
             <template v-else>
@@ -136,13 +171,20 @@
             :value="searchQuery"
             placeholder="搜索对话..."
             @input="$emit('search', ($event.target as HTMLInputElement).value)"
-            @keydown.enter.prevent="$emit('search-submit', ($event.target as HTMLInputElement).value)"
+            @keydown.enter.prevent="
+              $emit('search-submit', ($event.target as HTMLInputElement).value)
+            "
           />
         </div>
       </div>
 
       <div class="conversation-list">
-        <div v-if="loading && !displayConversations.length && !searchActive" class="loading-conversations">正在加载...</div>
+        <div
+          v-if="loading && !displayConversations.length && !searchActive"
+          class="loading-conversations"
+        >
+          正在加载...
+        </div>
         <div v-else-if="!displayConversations.length && !loading" class="no-conversations">
           {{ searchActive ? '未找到匹配对话' : '暂无对话记录' }}
         </div>
@@ -158,7 +200,7 @@
             <div class="conversation-meta">
               <span class="conversation-time">{{ formatTime(conv.updated_at) }}</span>
               <span class="conversation-counts">
-                {{ (conv.total_messages || 0) }}条消息
+                {{ conv.total_messages || 0 }}条消息
                 <span v-if="(conv.total_tools || 0) > 0"> · {{ conv.total_tools }}工具</span>
               </span>
             </div>
@@ -183,7 +225,12 @@
           </div>
         </div>
         <div v-if="!searchActive && hasMore" class="load-more">
-          <button class="load-more-btn" type="button" :disabled="loadingMore" @click="$emit('load-more')">
+          <button
+            class="load-more-btn"
+            type="button"
+            :disabled="loadingMore"
+            @click="$emit('load-more')"
+          >
             {{ loadingMore ? '载入中...' : '加载更多' }}
           </button>
         </div>
@@ -222,7 +269,12 @@
         @click="$emit('personal')"
       >
         <span class="sr-only">个人页面</span>
-        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 20 20"
+          fill="currentColor"
+          aria-hidden="true"
+        >
           <path
             fill-rule="evenodd"
             clip-rule="evenodd"
@@ -279,7 +331,11 @@ const uiStore = useUiStore();
 const conversationStore = useConversationStore();
 const personalizationStore = usePersonalizationStore();
 
-const { sidebarCollapsed: collapsed, workspaceCollapsed, chatDisplayMode: uiChatDisplayMode } = storeToRefs(uiStore);
+const {
+  sidebarCollapsed: collapsed,
+  workspaceCollapsed,
+  chatDisplayMode: uiChatDisplayMode
+} = storeToRefs(uiStore);
 const {
   searchQuery,
   searchResults,
@@ -299,9 +355,14 @@ const iconStyle = (key: string) => (props.iconStyle ? props.iconStyle(key) : {})
 const resolvedShowCollapseButton = computed(() => props.showCollapseButton);
 const resolvedCollapseButtonVariant = computed(() => props.collapseButtonVariant);
 const displayMode = computed(() => props.displayMode);
-const monitorModeActive = computed(() => displayMode.value === 'monitor' || uiChatDisplayMode.value === 'monitor');
+const monitorModeActive = computed(
+  () => displayMode.value === 'monitor' || uiChatDisplayMode.value === 'monitor'
+);
 const displayModeDisabled = computed(() => props.displayModeDisabled);
-const displayConversations = computed(() => (searchActive.value ? searchResults.value : conversations.value));
-const loading = computed(() => (searchActive.value ? searchInProgress.value : conversationsLoading.value));
-
+const displayConversations = computed(() =>
+  searchActive.value ? searchResults.value : conversations.value
+);
+const loading = computed(() =>
+  searchActive.value ? searchInProgress.value : conversationsLoading.value
+);
 </script>
diff --git a/static/src/components/token/TokenDrawer.vue b/static/src/components/token/TokenDrawer.vue
index 1323369..bceced7 100644
--- a/static/src/components/token/TokenDrawer.vue
+++ b/static/src/components/token/TokenDrawer.vue
@@ -1,7 +1,13 @@
 <template>
   <div class="token-drawer" v-if="visible" :class="{ collapsed }" data-tutorial="token-drawer">
     <div class="token-display-panel">
-      <button class="token-close-btn" type="button" data-tutorial="token-close" @click="emit('toggle')" aria-label="收起用量统计">
+      <button
+        class="token-close-btn"
+        type="button"
+        data-tutorial="token-close"
+        @click="emit('toggle')"
+        aria-label="收起用量统计"
+      >
         <span class="sr-only">关闭</span>
       </button>
       <div class="token-panel-content">
@@ -11,7 +17,9 @@
             <div class="stat-grid stat-grid--triple">
               <div class="stat-block">
                 <div class="stat-label">当前上下文</div>
-                <div class="stat-value stat-value--accent">{{ formatTokenCount(currentContextTokens || 0) }}</div>
+                <div class="stat-value stat-value--accent">
+                  {{ formatTokenCount(currentContextTokens || 0) }}
+                </div>
               </div>
               <div class="stat-block">
                 <div class="stat-label">累计输入</div>
@@ -39,18 +47,20 @@
                 <div class="stat-grid stat-grid--double">
                   <div class="stat-block">
                     <div class="stat-label">CPU</div>
-                    <div class="stat-value">{{ formatPercentage(containerStatus.stats.cpu_percent) }}</div>
+                    <div class="stat-value">
+                      {{ formatPercentage(containerStatus.stats.cpu_percent) }}
+                    </div>
                   </div>
-                <div class="stat-block">
-                  <div class="stat-label">内存</div>
-                  <div class="stat-value stat-value--mono">
-                    {{ formatBytes(containerStatus.stats.memory.used_bytes) }}
-                    <template v-if="containerStatus.stats.memory.limit_bytes">
-                      / {{ formatBytes(containerStatus.stats.memory.limit_bytes) }}
-                    </template>
-                  </div>
-                  <div class="stat-foot" v-if="containerStatus.stats.memory.percent">
-                    {{ formatPercentage(containerStatus.stats.memory.percent) }}
+                  <div class="stat-block">
+                    <div class="stat-label">内存</div>
+                    <div class="stat-value stat-value--mono">
+                      {{ formatBytes(containerStatus.stats.memory.used_bytes) }}
+                      <template v-if="containerStatus.stats.memory.limit_bytes">
+                        / {{ formatBytes(containerStatus.stats.memory.limit_bytes) }}
+                      </template>
+                    </div>
+                    <div class="stat-foot" v-if="containerStatus.stats.memory.percent">
+                      {{ formatPercentage(containerStatus.stats.memory.percent) }}
                     </div>
                   </div>
                 </div>
@@ -65,7 +75,9 @@
               <div class="stat-block" v-for="tier in quotaTiers" :key="tier.key">
                 <div class="stat-label">{{ tier.label }}</div>
                 <div class="stat-value">{{ formatQuotaValue(tier.value) }}</div>
-                <div class="stat-foot" v-if="(tier.value.count || 0) > 0">重置 {{ formatResetTime(tier.value.reset_at) }}</div>
+                <div class="stat-foot" v-if="(tier.value.count || 0) > 0">
+                  重置 {{ formatResetTime(tier.value.reset_at) }}
+                </div>
               </div>
             </div>
           </div>
@@ -75,14 +87,18 @@
               <div class="stat-block">
                 <div class="stat-label">网络</div>
                 <div class="stat-value stat-value--mono">
-                  ↓{{ formatRate(containerNetRate.down_bps) }} ↑{{ formatRate(containerNetRate.up_bps) }}
+                  ↓{{ formatRate(containerNetRate.down_bps) }} ↑{{
+                    formatRate(containerNetRate.up_bps)
+                  }}
                 </div>
               </div>
               <div class="stat-block">
                 <div class="stat-label">存储</div>
                 <div class="stat-value stat-value--mono">
                   {{ formatBytes(projectStorage.used_bytes) }}
-                  <template v-if="projectStorage.limit_bytes">/ {{ formatBytes(projectStorage.limit_bytes) }}</template>
+                  <template v-if="projectStorage.limit_bytes"
+                    >/ {{ formatBytes(projectStorage.limit_bytes) }}</template
+                  >
                 </div>
                 <div class="stat-foot" v-if="typeof projectStorage.usage_percent === 'number'">
                   {{ projectStorage.usage_percent.toFixed(1) }}%
@@ -108,7 +124,10 @@ const emit = defineEmits<{
 const props = defineProps<{
   visible: boolean;
   collapsed: boolean;
-  currentConversationTokens: { cumulative_input_tokens?: number; cumulative_output_tokens?: number };
+  currentConversationTokens: {
+    cumulative_input_tokens?: number;
+    cumulative_output_tokens?: number;
+  };
   currentContextTokens: number;
   containerStatus: any;
   containerNetRate: { down_bps: number | null; up_bps: number | null };
diff --git a/static/src/styles/components/panels/_left-panel.scss b/static/src/styles/components/panels/_left-panel.scss
index df0b098..f6774cc 100644
--- a/static/src/styles/components/panels/_left-panel.scss
+++ b/static/src/styles/components/panels/_left-panel.scss
@@ -464,6 +464,12 @@
     margin-bottom: 4px;
 }
 
+.background-command-summary {
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
 .sub-agent-tool {
     font-size: 12px;
     color: var(--claude-text-secondary);