优化: 前端u-agent令牌对齐与组件拆分续批

- 全局样式类(df-sec-h/df-toast族)替换散装实现,主题token去硬编码兜底
- 拆分子组件:ai-chat/queue-panel(队列时钟与编辑随迁)、
  conversation-sidebar/ConversationList、settings/provider-panel
- 父组件死副本清理(队列编辑/时钟/键位表,TS6133清零)并补
  fill-draft父侧转发(重构半成品断链修复)
- 验收:vue-tsc EXIT 0

src/components/ai/ChatInput.vue

@@ -45,81 +45,86 @@
         @select="selectMention"
         @update:mention-index="mentionIndex = $event"
       />
-      <!-- 2026-08-06:📎 图片选择按钮(tauri 原生对话框选图 → 已配置上传端点则上传换 URL,否则本地 base64 引用) -->
-      <button
-        type="button"
-        class="ai-img-pick-btn"
-        :title="$t('aiChat.pickImage')"
-        :aria-label="$t('aiChat.pickImage')"
-        @click="onPickImage"
-      >
-        <svg aria-hidden="true" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>
-      </button>
-      <!-- I9(2026-10-05):文本/代码文件附件入口——选文件读内容以 ```<file> 块插入草稿,
-           走既有文本发送链,零协议改动;大小/行数上限防刷屏 -->
-      <button
-        type="button"
-        class="ai-img-pick-btn"
-        :title="$t('aiChat.pickFileTitle')"
-        :aria-label="$t('aiChat.pickFileTitle')"
-        @click="onPickTextFile"
-      >
-        <svg aria-hidden="true" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V9z"/><polyline points="13 2 13 9 20 9"/></svg>
-      </button>
-      <!-- 定时/待发箱入口(设计 2026-10-10 §3.4):icon-only ⏰ 开 OutboxDrawer
-           (组件内 Teleport 到 body,不占输入区布局;抽屉组件标签在模板尾部) -->
-      <button
-        type="button"
-        class="ai-img-pick-btn"
-        :title="$t('aiChat.outboxEntry')"
-        :aria-label="$t('aiChat.outboxEntry')"
-        @click="outboxOpen = true"
-      >
-        <svg aria-hidden="true" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
-      </button>
-      <!-- L2 状态机停止按钮三态(批2 1c):conv_state 派生 generating/stopping/error 三态,
-           idle(或 conv_state 未收到回退旧 streaming=false)显发送按钮。双轨过渡不强制全替旧 bool。 -->
-      <button
-        v-if="stopBtnState === 'stopping'"
-        type="button"
-        class="ai-send-btn ai-send-btn--stop ai-send-btn--stopping"
-        :title="$t('aiChat.stopping')"
-        :aria-label="$t('aiChat.stopping')"
-        disabled
-      >
-        <svg aria-hidden="true" width="12" height="12" viewBox="0 0 24 24" fill="currentColor"><rect x="6" y="6" width="12" height="12" rx="2"/></svg>
-      </button>
-      <button
-        v-else-if="stopBtnState === 'retry'"
-        type="button"
-        class="ai-send-btn ai-send-btn--stop ai-send-btn--retry"
-        :title="$t('aiChat.stopFailedRetry')"
-        :aria-label="$t('aiChat.stopFailedRetry')"
-        @click="store.stopChat"
-      >
-        <svg aria-hidden="true" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"/></svg>
-      </button>
-      <button
-        v-else-if="stopBtnState === 'stop'"
-        type="button"
-        class="ai-send-btn ai-send-btn--stop"
-        :title="$t('aiChat.stopGenerating')"
-        :aria-label="$t('aiChat.stopGenerating')"
-        @click="store.stopChat"
-      >
-        <svg aria-hidden="true" width="12" height="12" viewBox="0 0 24 24" fill="currentColor"><rect x="6" y="6" width="12" height="12" rx="2"/></svg>
-      </button>
-      <button
-        v-else
-        type="button"
-        class="ai-send-btn"
-        :class="{ 'ai-send-btn--active': canSend }"
-        :disabled="!canSend"
-        :aria-label="$t('aiChat.queueSendNow')"
-        @click="handleSend"
-      >
-        <svg aria-hidden="true" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/></svg>
-      </button>
+      <!-- 2026-10-18 wave2: 工具行(workbench .inp-row 范式)——textarea 下方分隔线,
+           左侧功能钮 + 右侧发送/停止钮;纯布局重排,按钮类名/事件/禁用判定零变化 -->
+      <div class="ai-input-row">
+        <!-- 2026-08-06:📎 图片选择按钮(tauri 原生对话框选图 → 已配置上传端点则上传换 URL,否则本地 base64 引用) -->
+        <button
+          type="button"
+          class="ai-img-pick-btn"
+          :title="$t('aiChat.pickImage')"
+          :aria-label="$t('aiChat.pickImage')"
+          @click="onPickImage"
+        >
+          <svg aria-hidden="true" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"/><circle cx="8.5" cy="8.5" r="1.5"/><polyline points="21 15 16 10 5 21"/></svg>
+        </button>
+        <!-- I9(2026-10-05):文本/代码文件附件入口——选文件读内容以 ```<file> 块插入草稿,
+             走既有文本发送链,零协议改动;大小/行数上限防刷屏 -->
+        <button
+          type="button"
+          class="ai-img-pick-btn"
+          :title="$t('aiChat.pickFileTitle')"
+          :aria-label="$t('aiChat.pickFileTitle')"
+          @click="onPickTextFile"
+        >
+          <svg aria-hidden="true" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V9z"/><polyline points="13 2 13 9 20 9"/></svg>
+        </button>
+        <!-- 定时/待发箱入口(设计 2026-10-10 §3.4):icon-only ⏰ 开 OutboxDrawer
+             (组件内 Teleport 到 body,不占输入区布局;抽屉组件标签在模板尾部) -->
+        <button
+          type="button"
+          class="ai-img-pick-btn"
+          :title="$t('aiChat.outboxEntry')"
+          :aria-label="$t('aiChat.outboxEntry')"
+          @click="outboxOpen = true"
+        >
+          <svg aria-hidden="true" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><polyline points="12 6 12 12 16 14"/></svg>
+        </button>
+        <!-- L2 状态机停止按钮三态(批2 1c):conv_state 派生 generating/stopping/error 三态,
+             idle(或 conv_state 未收到回退旧 streaming=false)显发送按钮。双轨过渡不强制全替旧 bool。 -->
+        <button
+          v-if="stopBtnState === 'stopping'"
+          type="button"
+          class="ai-send-btn ai-send-btn--stop ai-send-btn--stopping"
+          :title="$t('aiChat.stopping')"
+          :aria-label="$t('aiChat.stopping')"
+          disabled
+        >
+          <svg aria-hidden="true" width="12" height="12" viewBox="0 0 24 24" fill="currentColor"><rect x="6" y="6" width="12" height="12" rx="2"/></svg>
+        </button>
+        <button
+          v-else-if="stopBtnState === 'retry'"
+          type="button"
+          class="ai-send-btn ai-send-btn--stop ai-send-btn--retry"
+          :title="$t('aiChat.stopFailedRetry')"
+          :aria-label="$t('aiChat.stopFailedRetry')"
+          @click="store.stopChat"
+        >
+          <svg aria-hidden="true" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"/><path d="M20.49 15a9 9 0 1 1-2.12-9.36L23 10"/></svg>
+        </button>
+        <button
+          v-else-if="stopBtnState === 'stop'"
+          type="button"
+          class="ai-send-btn ai-send-btn--stop"
+          :title="$t('aiChat.stopGenerating')"
+          :aria-label="$t('aiChat.stopGenerating')"
+          @click="store.stopChat"
+        >
+          <svg aria-hidden="true" width="12" height="12" viewBox="0 0 24 24" fill="currentColor"><rect x="6" y="6" width="12" height="12" rx="2"/></svg>
+        </button>
+        <button
+          v-else
+          type="button"
+          class="ai-send-btn"
+          :class="{ 'ai-send-btn--active': canSend }"
+          :disabled="!canSend"
+          :title="$t('aiChat.send')"
+          :aria-label="$t('aiChat.send')"
+          @click="handleSend"
+        >
+          <svg aria-hidden="true" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/></svg>
+        </button>
+      </div>
     </div>
     <!-- ⑥.4 Phase 4: @项目展开摘要(提取至 EnrichmentPanel.vue) -->
     <EnrichmentPanel
@@ -132,6 +137,12 @@
     />
     <!-- 定时/待发箱抽屉(⏰ 入口;Teleport 到 body 渲染,此处仅挂组件) -->
     <OutboxDrawer :open="outboxOpen" @close="outboxOpen = false" />
+    <!-- F2-4(走查-信息UX 面二):示例卡覆盖未发送草稿的二次确认弹层(组件自持,见 setup 注释) -->
+    <ConfirmDialog
+      :visible="confirmState.visible"
+      :msg="confirmState.msg"
+      @result="answerConfirm"
+    />
     <div class="ai-input-hint">{{ $t('aiChat.inputHint') }}</div>
   </div>
 </template>
@@ -145,7 +156,7 @@
 //   - 出错 emit('error', { msg, type }) → 父 showToast(单一 toast 源)
 //   - 示例问题卡片在父(空状态区),父调 expose sendExamplePrompt 触发本组件发送
 // store 单例共享:useAiStore(sendMessage/editMessage/stopChat)、useProjectStore(@ 联想源)
-import { ref, computed, nextTick, watch } from 'vue'
+import { ref, computed, nextTick, watch, onBeforeUnmount } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useAiStore } from '../../stores/ai'
 import { useProjectStore } from '../../stores/project'
@@ -162,6 +173,8 @@ import ImageInput from './ImageInput.vue'
 import MentionPopover from './MentionPopover.vue'
 import EnrichmentPanel from './EnrichmentPanel.vue'
 import OutboxDrawer from './OutboxDrawer.vue'
+import ConfirmDialog from '../ConfirmDialog.vue'
+import { useConfirm } from '../../composables/useConfirm'
 import { taskApi } from '../../api/task'
 import type { AiMessage, ContentPart, SkillInfo, ProjectRecord, TaskRecord, IdeaRecord, MentionSpan } from '../../api/types'
 import type { MentionItem } from './MentionItem'
@@ -1078,6 +1091,8 @@ async function handleSend() {
   // 生成中不再拦截：sendMessage 会把消息排入待发送队列，完成后自动续发
   // 先清输入（无论立即发还是入队）；队列满/IPC 失败时 catch 回填
   inputText.value = ''
+  // F2-2:草稿已消费,立即落盘删项(不等防抖——快速关窗 300ms 内会残留已发送稿)
+  persistDraftNow()
   pendingSkill.value = null
   pendingImages.value = []
   // Input Augmentation: 清空 mention 区间(与 inputText 清空同处,保证下条消息从空白态起步)
@@ -1113,12 +1128,20 @@ async function handleSend() {
   emit('sent')
 }
 
-/** 点击示例问题卡片:填入输入框并发送(复用 handleSend 同款发送路径,错误回退一致) */
+/** 点击示例问题卡片:填入输入框并发送(复用 handleSend 同款发送路径,错误回退一致)。
+ *  F2-4(走查-信息UX 面二):输入框已有未发送草稿(文本/图片/技能 chip 任一)时先确认,
+ *  取消则原样保留草稿——对齐父级 backfillQueued 的覆盖确认语义,不再静默替换。 */
 async function sendExamplePrompt(i18nKey: string) {
+  if (hasUnsentInput() && !(await confirmDialog(t('aiChat.exampleOverwriteConfirm')))) return
   inputText.value = t(i18nKey)
   await handleSend()
 }
 
+// ── F2-4:覆盖确认弹层(仓风格不引 window.confirm;AiChat 的 confirmDialog 状态机在父级
+//    经模板绑定,子组件复用需父接线 → 本组件自持一份 useConfirm + ConfirmDialog,
+//    行为/样式与父级 backfillQueued / clearQueue 确认同范式) ──
+const { confirmState, confirmDialog, answerConfirm } = useConfirm()
+
 // ── 父调用 expose(父 startEdit/cancelEdit/beforeunload 调用) ──
 
 /** UX-09 进入编辑态:回填末条 user 内容到输入框,聚焦,光标置末 */
@@ -1140,7 +1163,9 @@ function startEditFocus(msg: AiMessage): void {
       const len = el.value.length
       el.setSelectionRange(len, len)
       el.style.height = 'auto'
-      el.style.height = Math.min(el.scrollHeight, 120) + 'px'
+      // F2-3(走查-信息UX):编辑态回填高度复用 INPUT_MAX_HEIGHT,与 autoResize 同源;
+      // 原硬编码 120 使长草稿进编辑态首屏被压矮,任一按键才弹回 200
+      el.style.height = Math.min(el.scrollHeight, INPUT_MAX_HEIGHT) + 'px'
     }
   })
 }
@@ -1155,6 +1180,8 @@ function clearInput(): void {
   mentionOpen.value = false
   mentionStart.value = -1
   if (inputEl.value) inputEl.value.style.height = 'auto'
+  // F2-2:清空即落盘(取消编辑不应残留旧稿到下次重启)
+  persistDraftNow()
 }
 
 /** I4 队列回填:父把取出的队列项文本填回输入框重新编辑。
@@ -1184,12 +1211,78 @@ function focus(): void {
 }
 
 // ── V8 per-conv 草稿:切会话保存/恢复,防 A 会话未发送草稿串到 B 输入框 ──
-// 草稿真相源在 aiShared.convDrafts(内存 Map,不落 localStorage)。父组件 AiChat 的
+// 会话内真相源在 aiShared.convDrafts(内存 Map);F2-2(走查-信息UX 面二)追加落盘镜像:
+// 键入过程防抖写 localStorage,重启/换装后经回退链恢复。父组件 AiChat 的
 // activeConversationId watcher 注册更早先执行:编辑态切换时父先 cancelEdit 清输入,
 // 本 watcher 后执行,旧会话保存到的是清空后的空串,与既有「切会话丢弃编辑缓冲」语义一致。
+
+// F2-2:per-conv 草稿 localStorage 镜像(df-ai-* 键约定;单 JSON 对象,LRU 限 20 条,
+// 空串收敛删项——与内存 Map 同语义)。读写全程 try/catch:持久化是尽力而为,
+// 解析失败/配额满不阻断输入主链。
+const DRAFTS_KEY = 'df-ai-conv-drafts'
+const DRAFTS_MAX = 20
+
+function readDraftsStore(): Record<string, string> {
+  try {
+    const parsed: unknown = JSON.parse(localStorage.getItem(DRAFTS_KEY) || '{}')
+    return parsed && typeof parsed === 'object' ? (parsed as Record<string, string>) : {}
+  } catch {
+    return {}
+  }
+}
+
+function persistDraft(convId: string, text: string): void {
+  const all = readDraftsStore()
+  if (text) {
+    // 删后重插把该会话挪到键序末尾,Object 键序=写入序,溢出时从头淘汰即 LRU
+    delete all[convId]
+    all[convId] = text
+    const keys = Object.keys(all)
+    for (let i = 0; i < keys.length - DRAFTS_MAX; i++) delete all[keys[i]]
+  } else {
+    delete all[convId]
+  }
+  try {
+    localStorage.setItem(DRAFTS_KEY, JSON.stringify(all))
+  } catch {
+    // 配额满等:放弃本次落盘,内存草稿不受影响
+  }
+}
+
+// 防抖落盘:逐键写盘不必要,300ms 静默期合并;发送/清空/切会话/卸载走立即落盘收口
+let draftPersistTimer: ReturnType<typeof setTimeout> | null = null
+
+function persistDraftNow(): void {
+  if (draftPersistTimer) {
+    clearTimeout(draftPersistTimer)
+    draftPersistTimer = null
+  }
+  const convId = store.state.activeConversationId
+  if (convId) persistDraft(convId, inputText.value)
+}
+
+watch(inputText, () => {
+  if (draftPersistTimer) clearTimeout(draftPersistTimer)
+  draftPersistTimer = setTimeout(persistDraftNow, 300)
+})
+
+// F2-2:卸载(面板收起/关窗)前冲刷在途防抖,防最后 300ms 键入的草稿丢失
+onBeforeUnmount(() => {
+  if (draftPersistTimer) persistDraftNow()
+})
+
 watch(() => store.state.activeConversationId, (nv, ov) => {
-  if (ov) setConvDraft(ov, inputText.value)
+  // immediate:挂载时活跃会话已就位(分离窗/恢复会话直开)也走恢复链,不只在切换时
+  if (ov) {
+    setConvDraft(ov, inputText.value)
+    persistDraft(ov, inputText.value)
+  }
   inputText.value = getConvDraft(nv)
+  // 内存 Map 无记录时回退落盘稿(重启后 Map 为空;同会话内 Map 恒比落盘新,优先)
+  if (!inputText.value && nv) {
+    const persisted = readDraftsStore()[nv]
+    if (typeof persisted === 'string') inputText.value = persisted
+  }
   // 随输入框的临时态不跨会话携带:mention 区间偏移只对旧文本有效,照搬到恢复的文本会渲染错位
   // chip;技能 chip 与待发图片同理,残留到新会话会静默混入下一条消息
   pendingMentionSpans.value = []
@@ -1205,7 +1298,7 @@ watch(() => store.state.activeConversationId, (nv, ov) => {
     mentionStart.value = -1
     autoResize()
   })
-})
+}, { immediate: true })
 
 // ── 脉络卡「带入上下文」外部投递:以输入框实时内容为基底追加(草稿 Map 不含键入
 //    过程,直接写 Map 会丢当前输入),一次性消费防重放;追加后聚焦输入框由用户决断 ──
@@ -1259,32 +1352,33 @@ defineExpose({
      零视觉变更。原 AiChat scoped 不渗透子组件根,输入框/技能联想/发送按钮元素失配 → 本组件自持。
      CSS 变量(--df-*)由根级 global.css 提供,共享同一份。.ai-input-area 容器留父级 AiChat scoped。) ═══ -->
 <style scoped>
+/* 2026-10-18 wave2: 输入盒迁移 workbench .inp-box 范式——bg-card 底+0.5px 边框+9px 圆角,
+   focus-within 边框转 info;纵向布局让全宽图片预览行自然换行(替代原 flex-wrap 手法) */
 .ai-input-wrap {
   position: relative;
   display: flex;
-  /* F-260614-05 Phase 2b: flex-wrap 让全宽的图片预览行强制 textarea+按钮换行到下一行 */
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 6px;
+  flex-direction: column;
   background: var(--df-bg-card);
   border: 0.5px solid var(--df-border);
-  border-radius: var(--df-radius-lg);
-  padding: 6px 8px;
+  border-radius: 9px;
+  padding: 9px 12px;
   transition: border-color 0.15s;
 }
 
 /* F-260614-05 Phase 2b: 图片预览样式已提取到 styles/components.css 全局(ImageInput.vue 共享) */
 
 .ai-input-wrap:focus-within {
-  border-color: color-mix(in srgb, var(--df-accent) 40%, transparent);
+  border-color: var(--df-info);
 }
 
 /* ── 技能 chip / 联想浮层样式已提取到 styles/components.css 全局(SkillMention.vue + MentionPopover.vue 共享)── */
 
 /* ── UX-10 §1.4: @ 实体引用浮层样式已随 MentionPopover.vue 提取 ── */
 
+/* textarea 透明无边框占满输入盒首行(workbench .inp-box textarea 范式);
+   autosize 高度参数(min/height/max-height)为行为契约,禁动 */
 .ai-input {
-  flex: 1;
+  width: 100%;
   background: transparent;
   border: none;
   outline: none;
@@ -1301,6 +1395,19 @@ defineExpose({
 .ai-input::placeholder {
   color: var(--df-text-dim);
 }
+
+/* 工具行(workbench .inp-row 范式):textarea 下方 --df-border 分隔线,左功能钮+右发送钮 */
+.ai-input-row {
+  display: flex;
+  align-items: center;
+  gap: 6px;
+  margin-top: 6px;
+  padding-top: 6px;
+  border-top: 0.5px solid var(--df-border);
+}
+
+/* 发送钮(workbench .isend 范式):info→accent 135° 渐变+深色 icon+600 字重;
+   禁用态 opacity .4(禁用判定逻辑不动)。原 --active 实心紫规则并入基类,类名绑定保留无害 */
 .ai-send-btn {
   display: flex;
   align-items: center;
@@ -1309,38 +1416,37 @@ defineExpose({
   height: 28px;
   border: none;
   border-radius: var(--df-radius);
-  background: var(--df-bg-raised);
-  color: var(--df-text-dim);
+  background: linear-gradient(135deg, var(--df-info), var(--df-accent));
+  color: color-mix(in srgb, var(--df-bg) 70%, #000);
+  font-weight: 600;
   cursor: pointer;
-  transition: background 0.15s, color 0.15s;
+  transition: filter 0.15s, opacity 0.15s;
   flex-shrink: 0;
+  margin-left: auto;
 }
+.ai-send-btn:not(:disabled):hover {
+  filter: brightness(1.1);
+}
+/* 功能钮统一 28px 高 bg-card 边框钮(workbench 工具行左侧范式),hover 边框亮 */
 .ai-img-pick-btn {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 28px;
   height: 28px;
-  border: none;
+  border: 0.5px solid var(--df-border);
   border-radius: var(--df-radius);
-  background: transparent;
+  background: var(--df-bg-card);
   color: var(--df-text-dim);
   cursor: pointer;
-  transition: background 0.15s, color 0.15s;
+  transition: background 0.15s, color 0.15s, border-color 0.15s;
   flex-shrink: 0;
-  margin-right: 4px;
 }
 .ai-img-pick-btn:hover {
-  background: var(--df-bg-raised);
+  background: var(--df-bg-card-hover);
+  border-color: var(--df-border-strong);
   color: var(--df-text);
 }
-.ai-send-btn--active {
-  background: var(--df-accent);
-  color: #fff;
-}
-.ai-send-btn--active:hover {
-  background: var(--df-accent-hover);
-}
 .ai-send-btn:disabled {
   opacity: 0.4;
   cursor: not-allowed;
@@ -1364,20 +1470,34 @@ defineExpose({
 .ai-send-btn--retry:hover {
   background: #d63a3f;
 }
+/* 命令提示 chip(workbench .icmd 范式):mono 10px --df-text-dim */
 .ai-input-hint {
+  font-family: var(--df-font-mono);
   font-size: 10px;
   color: var(--df-text-dim);
   text-align: right;
   margin-top: 4px;
-  opacity: 0.6;
 }
 
 /* ── ⑥.4 Phase 4: @项目展开摘要样式已随 EnrichmentPanel.vue 提取 ── */
 
 /* B1: 非视觉模型贴图警示条(待发送图片预览行下方,warning 色轻量提示,不抢输入框注意力) */
 .ai-img-warn-chip {
-  font-size: 10.5px;
+  font-size: 10px;
   color: var(--df-warning);
   padding: 1px 4px;
 }
+
+/* ── 2026-10-18 wave2: 草稿/mention 弹层对齐 workbench 弹层范式 ──
+   SkillMention/MentionPopover 共用 styles/components.css 的 .ai-skill-* 全局基类(禁碰),
+   经 :deep 在此集中覆写一份(两子组件弹层同源,避免各自 scoped 重复):
+   8px 圆角+浅阴影;选中项 bg-card-hover+左 2px 强调边(inset 阴影实现,零布局位移) */
+.ai-input-wrap :deep(.ai-skill-popover) {
+  border-radius: var(--df-radius-md);
+  box-shadow: var(--df-shadow-sm);
+}
+.ai-input-wrap :deep(.ai-skill-item--active) {
+  background: var(--df-bg-card-hover);
+  box-shadow: inset 2px 0 0 var(--df-accent);
+}
 </style>