@musnows/scriverse 0.5.11 → 0.6.0

package/dist/public/app.js

@@ -8,10 +8,10 @@ import { buildVditorLineNumberRows } from "/vditor-line-number-layout.js?v=20260
 import { MODEL_PURPOSE_OPTIONS, isKimiModelId, modelFormValues, modelOptionLabel, modelPayload } from "/model-config.js?v=20260723-kimi-temperature";
 import { shouldSendAiPrompt } from "/ai-prompt-keyboard.js?v=20260713-enter-to-send";
 import { estimateAiMessageTokens, formatAiMessageMeta } from "/ai-message-meta.js?v=20260726-cache-hit-percent";
-import { createStreamTypewriter } from "/stream-typewriter.js?v=20260729-ai-stream-typewriter-v1";
+import { createStreamTypewriter } from "/stream-typewriter.js?v=20260730-ai-stream-typewriter-v3";
 import { buildUsageCalendar, formatCacheHitRate, formatTokenCount } from "/ai-usage.js?v=20260727-ai-usage-v1";
 import { formatAiMessageTime } from "/ai-message-time.js?v=20260713-cross-day-time";
-import { formatAiContextUsageTooltip } from "/ai-context-meter.js?v=20260718-layered-context";
+import { formatAiContextUsageTooltip, normalizeAiContextTokenDistribution } from "/ai-context-meter.js?v=20260730-token-distribution-v2";
 import { copyAiRawMarkdown } from "/ai-message-actions.js?v=20260713-copy-raw-markdown";
 import { THEME_STORAGE_KEY, nextTheme, normalizeTheme, themeToggleLabel } from "/theme.js?v=20260713-dark-mode";
 import { buildCharacterDetails, buildCharacterState, characterStateEntries, normalizeCharacterDetails, normalizeCharacterSections } from "/character-profile.js?v=20260713-character-editor";
@@ -48,6 +48,7 @@ import { resolveGlobalSearchTarget, splitGlobalSearchHighlight } from "/global-s
 import { filterCharacters, paginateCharacters } from "/character-filters.js?v=20260725-character-filters";
 import { filterRelationships } from "/relationship-filters.js?v=20260726-relationship-filters";
 import { backgroundTaskActivityCount, backgroundTaskPollDelay, collectBackgroundTaskTransitions } from "/background-task-center.js?v=20260726-background-task-center-v1";
+import { createModuleRequestCache } from "/module-request-cache.js?v=20260730-module-request-cache-v1";
 import {
   clampCropRect,
   containImageRect,
@@ -85,6 +86,12 @@ function normalizePageSizes(value) {
   ]));
 }
 
+function isSelectableModel(model) {
+  return Boolean(model?.enabled)
+    && model?.providerStatus === "enabled"
+    && model?.providerConnectionStatus === "success";
+}
+
 const state = {
   user: null,
   csrfToken: null,
@@ -117,6 +124,21 @@ const state = {
   contextChapterId: null
 };
 
+const moduleRequestCache = createModuleRequestCache();
+const cachedWorkModules = new Set([
+  "drafts",
+  "settings",
+  "characters",
+  "races",
+  "organizations",
+  "timeline",
+  "outlines",
+  "relationships",
+  "reviews",
+  "tasks",
+  "ai-settings"
+]);
+
 function createPresenceClientId() {
   if (typeof crypto.randomUUID === "function") return crypto.randomUUID();
   const bytes = crypto.getRandomValues(new Uint8Array(16));
@@ -371,6 +393,9 @@ let aiReferencesLoadWorkId = null;
 let aiConversationsLoadPromise = null;
 let aiConversationsLoadWorkId = null;
 let workScopedUiGeneration = 0;
+const loadedVolumeChapterIds = new Set();
+const volumeChapterLoadingIds = new Set();
+const volumeChapterRequests = new Map();
 let raceHierarchyLoadPromise = null;
 let raceHierarchyLoadWorkId = null;
 let loadedRaceHierarchyWorkId = null;
@@ -874,6 +899,7 @@ let chapterEditorReadOnly = true;
 let characterListPage = 1;
 let taskListPage = 1;
 let draftTypeFilter = "all";
+let draftFiltersPanelOpen = false;
 const moduleListPages = {
   drafts: 1,
   settings: 1,
@@ -1592,6 +1618,14 @@ function renderAiConversationHistory() {
   }
 }
 
+function applyAiConversationTitle(title) {
+  if (!title || !state.aiConversationId) return;
+  const current = state.aiConversations.find((conversation) => conversation.id === state.aiConversationId);
+  if (current) current.title = title;
+  $("#ai-conversation-title").textContent = title;
+  renderAiConversationHistory();
+}
+
 async function loadAiConversations(openLatest = true) {
   const workId = state.work?.id;
   if (!workId) return;
@@ -2126,17 +2160,46 @@ async function api(path, options = {}) {
     if (response.status === 401 && !path.startsWith("/api/auth/") && !path.includes("/presence")) {
       state.user = null;
       state.csrfToken = null;
+      moduleRequestCache.clear();
       showAuth(false);
     }
-    const error = new Error(payload.error?.message ?? `请求失败：${response.status}`);
-    error.code = payload.error?.code;
-    throw error;
+    throw createClientError(payload.error, `请求失败：${response.status}`, response.status);
+  }
+  if (response.status === 204) {
+    invalidateModuleRequestsAfterMutation(path, method);
+    return null;
   }
-  if (response.status === 204) return null;
   const payload = await response.json();
+  invalidateModuleRequestsAfterMutation(path, method);
   return payload.data;
 }
 
+function createClientError(payload, fallbackMessage, fallbackStatus = null) {
+  const source = payload && typeof payload === "object" && !Array.isArray(payload) ? payload : {};
+  const error = new Error(typeof source.message === "string" ? source.message : fallbackMessage);
+  error.code = typeof source.code === "string" ? source.code : undefined;
+  error.status = Number.isInteger(source.status) ? source.status : fallbackStatus;
+  error.details = source.details;
+  error.failure = typeof source.failure === "string" ? source.failure : undefined;
+  error.callId = typeof source.callId === "string" ? source.callId : undefined;
+  return error;
+}
+
+function formatAiFailureMessage(error) {
+  const message = error instanceof Error ? error.message : String(error ?? "未知错误");
+  const lines = [`调用失败：${message}`];
+  const code = typeof error?.code === "string" ? error.code : "";
+  const status = Number.isInteger(error?.status) ? error.status : null;
+  const details = error?.details && typeof error.details === "object" && !Array.isArray(error.details) ? error.details : {};
+  const failure = typeof error?.failure === "string" ? error.failure : typeof details.failure === "string" ? details.failure : "";
+  const callId = typeof error?.callId === "string" ? error.callId : typeof details.callId === "string" ? details.callId : "";
+  if (code) lines.push(`错误码：${code}`);
+  if (status) lines.push(`服务端状态：HTTP ${status}`);
+  if (failure && failure !== message) lines.push(`详细原因：${failure}`);
+  if (callId) lines.push(`调用 ID：${callId}`);
+  return lines.join("\n\n");
+}
+
 async function apiPage(path, page = 1, limit = 30) {
   const separator = path.includes("?") ? "&" : "?";
   const result = await api(`${path}${separator}page=${page}&limit=${limit}`);
@@ -2155,6 +2218,63 @@ async function apiAllPages(path, limit = 100) {
   }
 }
 
+function cachedModuleRequest(module, requestKey, loader, options = {}) {
+  const workId = state.work?.id;
+  if (!workId) return Promise.resolve().then(loader);
+  return moduleRequestCache.request(workId, module, requestKey, loader, options);
+}
+
+function moduleApi(module, path, options = {}) {
+  return cachedModuleRequest(module, `api:${path}`, () => api(path), options);
+}
+
+function moduleApiPage(module, path, page = 1, limit = 30, options = {}) {
+  return cachedModuleRequest(module, `page:${path}:${page}:${limit}`, () => apiPage(path, page, limit), options);
+}
+
+function moduleApiAllPages(module, path, limit = 100, options = {}) {
+  return cachedModuleRequest(module, `all:${path}:${limit}`, () => apiAllPages(path, limit), options);
+}
+
+function invalidateModuleRequestsAfterMutation(path, method) {
+  if (["GET", "HEAD", "OPTIONS"].includes(method) || !state.work) return;
+  if (
+    path.startsWith("/api/auth/")
+    || path.includes("/presence")
+    || path.includes("/context/prepare")
+    || path.includes("/ai-context-usage")
+    || path.includes("/chat/stream")
+  ) return;
+
+  const affected = new Set();
+  if (path.includes("/ai-settings") || path.includes("/task-defaults") || path.includes("/providers") || path.includes("/models")) {
+    affected.add("ai-settings");
+  }
+  if (path.includes("/tasks")) affected.add("tasks");
+  if (path.includes("/drafts")) affected.add("drafts");
+  if (path.includes("/settings") && !path.includes("/ai-settings")) affected.add("settings");
+  if (path.includes("/characters") || path.includes("/character-sections")) affected.add("characters");
+  if (path.includes("/races")) affected.add("races");
+  if (path.includes("/organizations")) affected.add("organizations");
+  if (path.includes("/timeline")) affected.add("timeline");
+  if (path.includes("/outlines") || path.includes("/foreshadows")) affected.add("outlines");
+  if (path.includes("/relationships")) affected.add("relationships");
+  if (path.includes("/reviews")) affected.add("reviews");
+  if (path.includes("/entity-versions/")) {
+    if (path.includes("/draft/")) affected.add("drafts");
+    if (path.includes("/setting/")) affected.add("settings");
+    if (path.includes("/character/")) affected.add("characters");
+    if (path.includes("/race/")) affected.add("races");
+    if (path.includes("/organization/")) affected.add("organizations");
+    if (path.includes("/timeline-event/") || path.includes("/timeline-track/")) affected.add("timeline");
+    if (path.includes("/chapter-outline/") || path.includes("/foreshadow/")) affected.add("outlines");
+    if (path.includes("/relationship/")) affected.add("relationships");
+    if (path.includes("/review/")) affected.add("reviews");
+  }
+  if (cachedWorkModules.has(state.module)) affected.add(state.module);
+  affected.forEach((module) => moduleRequestCache.invalidate(state.work.id, module));
+}
+
 async function initializeProductFooters() {
   const year = String(new Date().getFullYear());
   document.querySelectorAll("[data-product-footer-year]").forEach((element) => { element.textContent = year; });
@@ -3345,11 +3465,15 @@ function resetWorkScopedUiCaches() {
   state.races = [];
   characterListPage = 1;
   draftTypeFilter = "all";
+  draftFiltersPanelOpen = false;
   Object.keys(moduleListPages).forEach((key) => { moduleListPages[key] = 1; });
   relationshipFilters.fromCharacterIds = [];
   relationshipFilters.toCharacterIds = [];
   taskListPage = 1;
   state.collapsedVolumeIds.clear();
+  loadedVolumeChapterIds.clear();
+  volumeChapterLoadingIds.clear();
+  volumeChapterRequests.clear();
   state.collapsedRaceIds.clear();
   lastSavedChapterSnapshot = null;
   if (aiContextUsageTimer !== null) clearTimeout(aiContextUsageTimer);
@@ -3373,7 +3497,13 @@ function resetWorkScopedUiCaches() {
 async function selectWork(workId, preferredChapterId = null) {
   const discarding = state.work?.id !== workId && state.dirty;
   if (discarding && !(await confirmDiscardChanges())) return false;
-  const nextWork = await api(`/api/works/${workId}`);
+  if (state.work?.id === workId) {
+    workScopedUiGeneration += 1;
+    loadedVolumeChapterIds.clear();
+    volumeChapterLoadingIds.clear();
+    volumeChapterRequests.clear();
+  }
+  const nextWork = await api(`/api/works/${workId}?directory=volumes`);
   if (state.work?.id !== nextWork.id) resetWorkScopedUiCaches();
   if (discarding) setSaveState("就绪");
   $("#app").classList.remove("shelf-mode");
@@ -3384,6 +3514,8 @@ async function selectWork(workId, preferredChapterId = null) {
   $("#settings-button").removeAttribute("aria-current");
   settingsReturnContext = null;
   state.work = nextWork;
+  state.work.volumes = state.work.volumes.map((volume) => ({ ...volume, chapters: Array.isArray(volume.chapters) ? volume.chapters : [] }));
+  state.collapsedVolumeIds = new Set(state.work.volumes.map((volume) => volume.id));
   state.chapter = null;
   chapterEditorReadOnly = true;
   if (!canReadModule(state.module)) state.module = firstReadableUiModule(state.work) ?? "editor";
@@ -3393,40 +3525,121 @@ async function selectWork(workId, preferredChapterId = null) {
   $("#work-meta").textContent = `${state.work.title}${state.work.author ? ` · ${state.work.author}` : ""} · ${Number(state.work.wordCount ?? 0).toLocaleString("zh-CN")} 字`;
   $("#top-search-button").disabled = !canReadAggregateContent();
   renderTree();
-  const chapters = state.work.volumes.flatMap((volume) => volume.chapters);
-  const targetChapter = chapters.find((chapter) => chapter.id === preferredChapterId) ?? chapters[0];
+  void loadAllVolumeChapters(nextWork.id);
   if (state.module === "editor" && preferredChapterId) await selectChapter(preferredChapterId);
-  else if (state.module === "editor" && targetChapter) await selectChapter(targetChapter.id);
   else if (state.module === "editor" && canReadModule("editor")) showWelcome(true);
   else if (!canReadModule(state.module)) showWelcome(true);
   else await showModule(state.module);
   return true;
 }
 
+async function loadVolumeChapters(volumeId) {
+  if (!state.work || loadedVolumeChapterIds.has(volumeId)) return;
+  const existingRequest = volumeChapterRequests.get(volumeId);
+  if (existingRequest) return existingRequest;
+  const workId = state.work.id;
+  const generation = workScopedUiGeneration;
+  volumeChapterLoadingIds.add(volumeId);
+  renderTree();
+  const request = (async () => {
+    try {
+      const chapters = await apiAllPages(`/api/volumes/${encodeURIComponent(volumeId)}/chapters`, 100);
+      if (state.work?.id !== workId || generation !== workScopedUiGeneration) return;
+      const volume = state.work.volumes.find((item) => item.id === volumeId);
+      if (!volume) return;
+      volume.chapters = chapters;
+      volume.chapterCount = chapters.length;
+      loadedVolumeChapterIds.add(volumeId);
+      renderTree();
+    } catch (error) {
+      if (state.work?.id === workId && generation === workScopedUiGeneration) {
+        toast(`加载分卷章节失败：${error.message}`, "error");
+        renderTree();
+      }
+    } finally {
+      volumeChapterLoadingIds.delete(volumeId);
+      volumeChapterRequests.delete(volumeId);
+      if (state.work?.id === workId && generation === workScopedUiGeneration) renderTree();
+    }
+  })();
+  volumeChapterRequests.set(volumeId, request);
+  return request;
+}
+
+async function loadAllVolumeChapters(workId) {
+  const volumeIds = state.work?.id === workId ? state.work.volumes.map((volume) => volume.id) : [];
+  for (const volumeId of volumeIds) {
+    if (state.work?.id !== workId) return;
+    await loadVolumeChapters(volumeId);
+  }
+}
+
+function mergeChapterDirectoryEntry(chapter) {
+  if (!state.work || !chapter?.volumeId) return;
+  const volume = state.work.volumes.find((item) => item.id === chapter.volumeId);
+  if (!volume) return;
+  const directoryEntry = {
+    id: chapter.id,
+    workId: chapter.workId,
+    volumeId: chapter.volumeId,
+    title: chapter.title,
+    chapterType: chapter.chapterType,
+    sortOrder: chapter.sortOrder,
+    wordCount: chapter.wordCount,
+    versionNo: chapter.versionNo,
+    analysisStatus: chapter.analysisStatus,
+    excludedFromAnalysis: chapter.excludedFromAnalysis,
+    createdAt: chapter.createdAt,
+    updatedAt: chapter.updatedAt
+  };
+  const chapters = Array.isArray(volume.chapters) ? volume.chapters : [];
+  const existingIndex = chapters.findIndex((item) => item.id === chapter.id);
+  if (existingIndex >= 0) chapters[existingIndex] = directoryEntry;
+  else chapters.push(directoryEntry);
+  chapters.sort((left, right) => Number(left.sortOrder) - Number(right.sortOrder));
+  volume.chapters = chapters;
+  volume.chapterCount = Math.max(Number(volume.chapterCount ?? 0), chapters.length);
+}
+
 function renderTree() {
   if (!state.work) return;
-  const count = state.work.volumes.reduce((total, volume) => total + volume.chapters.length, 0);
+  const count = state.work.volumes.reduce((total, volume) => total + Number(volume.chapterCount ?? volume.chapters?.length ?? 0), 0);
   const proseEditable = canEditProse();
   $("#chapter-count").textContent = `${count} 章`;
   $("#novel-tree").classList.remove("empty-copy");
-  $("#novel-tree").innerHTML = state.work.volumes.map((volume) => `
-    <div class="volume-node ${state.collapsedVolumeIds.has(volume.id) ? "is-collapsed" : ""}" data-volume-id="${esc(volume.id)}">
+  $("#novel-tree").innerHTML = state.work.volumes.map((volume) => {
+    const collapsed = state.collapsedVolumeIds.has(volume.id);
+    const chapters = Array.isArray(volume.chapters) ? volume.chapters : [];
+    const chapterContent = collapsed
+      ? ""
+      : volumeChapterLoadingIds.has(volume.id)
+        ? '<p class="entity-history-empty">正在加载章节……</p>'
+        : !loadedVolumeChapterIds.has(volume.id)
+          ? '<p class="entity-history-empty">展开后加载章节。</p>'
+          : chapters.length
+            ? chapters.map((chapter) => `
+        <button class="chapter-node ${state.chapter?.id === chapter.id ? "active" : ""}" type="button" data-chapter-id="${esc(chapter.id)}" draggable="${proseEditable ? "true" : "false"}" title="${proseEditable ? "拖拽排序；Alt+方向键排序，Alt+Shift+方向键跨卷" : ""}">
+          <span>${esc(chapter.title)}</span><span class="chapter-node-meta">${chapter.chapterType && chapter.chapterType !== "正文" ? `<em class="chapter-type-badge">${esc(chapter.chapterType)}</em>` : ""}<small>${Number(chapter.wordCount ?? 0).toLocaleString("zh-CN")}</small></span>
+        </button>`).join("")
+            : '<p class="entity-history-empty">本卷还没有章节。</p>';
+    return `
+    <div class="volume-node ${collapsed ? "is-collapsed" : ""}" data-volume-id="${esc(volume.id)}">
       <div class="volume-title">
-        <button class="volume-toggle" type="button" data-volume-toggle="${esc(volume.id)}" aria-expanded="${state.collapsedVolumeIds.has(volume.id) ? "false" : "true"}" title="左键折叠，右键设置分卷；可将章节拖到这里追加"><span>${esc(volume.title)}</span><span>${volume.chapters.length} 章</span></button>
+        <button class="volume-toggle" type="button" data-volume-toggle="${esc(volume.id)}" aria-expanded="${collapsed ? "false" : "true"}" title="左键展开或折叠；右键设置分卷；可将章节拖到这里追加"><span>${esc(volume.title)}</span><span>${Number(volume.chapterCount ?? chapters.length)} 章</span></button>
         ${proseEditable ? `<button class="add-button chapter-add-button" type="button" data-new-chapter-volume="${esc(volume.id)}" aria-label="在“${esc(volume.title)}”中新建章节" title="在“${esc(volume.title)}”中新建章节">+</button>` : ""}
       </div>
       <div class="volume-chapters">
-      ${volume.chapters.map((chapter) => `
-        <button class="chapter-node ${state.chapter?.id === chapter.id ? "active" : ""}" type="button" data-chapter-id="${esc(chapter.id)}" draggable="${proseEditable ? "true" : "false"}" title="${proseEditable ? "拖拽排序；Alt+方向键排序，Alt+Shift+方向键跨卷" : ""}">
-          <span>${esc(chapter.title)}</span><span class="chapter-node-meta">${chapter.chapterType && chapter.chapterType !== "正文" ? `<em class="chapter-type-badge">${esc(chapter.chapterType)}</em>` : ""}<small>${Number(chapter.wordCount ?? 0).toLocaleString("zh-CN")}</small></span>
-        </button>`).join("")}
+      ${chapterContent}
       </div>
-    </div>`).join("");
+    </div>`;
+  }).join("");
   $("#novel-tree").querySelectorAll("[data-volume-toggle]").forEach((button) => {
     button.addEventListener("click", () => {
       const volumeId = button.dataset.volumeToggle;
-      if (state.collapsedVolumeIds.has(volumeId)) state.collapsedVolumeIds.delete(volumeId);
-      else state.collapsedVolumeIds.add(volumeId);
+      if (state.collapsedVolumeIds.has(volumeId)) {
+        state.collapsedVolumeIds.delete(volumeId);
+        void loadVolumeChapters(volumeId);
+      } else state.collapsedVolumeIds.add(volumeId);
       renderTree();
     });
     button.addEventListener("contextmenu", (event) => {
@@ -3446,7 +3659,7 @@ function renderTree() {
         button.closest(".volume-node")?.classList.remove("is-drag-target");
         const chapterId = event.dataTransfer?.getData("text/plain");
         const volume = state.work?.volumes.find((item) => item.id === button.dataset.volumeToggle);
-        if (chapterId && volume) await moveChapterInTree(chapterId, volume.id, volume.chapters.length);
+        if (chapterId && volume) await moveChapterInTree(chapterId, volume.id, Number(volume.chapterCount ?? volume.chapters.length));
       });
     }
   });
@@ -3715,7 +3928,11 @@ async function deleteChapter(chapterId) {
 async function selectChapter(chapterId, { editMode = false } = {}) {
   if (state.chapter?.id !== chapterId && !(await confirmDiscardChanges("当前章节有未保存修改，仍要切换吗？"))) return;
   cancelChapterAutoSave();
-  state.chapter = await api(`/api/chapters/${chapterId}`);
+  if (state.chapter?.id !== chapterId) {
+    state.chapter = await api(`/api/chapters/${chapterId}`);
+    mergeChapterDirectoryEntry(state.chapter);
+  }
+  state.collapsedVolumeIds.delete(state.chapter.volumeId);
   lastSavedChapterSnapshot = { chapterId: state.chapter.id, title: state.chapter.title, content: state.chapter.content };
   chapterEditorReadOnly = !canEditProse() || !editMode;
   state.module = "editor";
@@ -4152,6 +4369,15 @@ function mountRelationshipFilterToggle() {
   });
 }
 
+function mountDraftFilterToggle() {
+  $("#module-header-actions").querySelector('[data-module-header-action="draft-filter-toggle"]')?.remove();
+  $("#module-header-actions").insertAdjacentHTML("afterbegin", `<button type="button" class="module-filter-toggle" data-module-header-action="draft-filter-toggle" aria-label="筛选草稿" aria-controls="draft-filter-panel" aria-expanded="${draftFiltersPanelOpen}" title="筛选草稿"><svg viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M4 5h16l-6.5 7.2v5.3l-3 1.5v-6.8L4 5Z"></path></svg></button>`);
+  $("#module-header-actions").querySelector('[data-module-header-action="draft-filter-toggle"]')?.addEventListener("click", async () => {
+    draftFiltersPanelOpen = !draftFiltersPanelOpen;
+    await renderDrafts(moduleListPages.drafts);
+  });
+}
+
 function bindRecordPreview(selector, open) {
   $("#module-content").querySelectorAll(selector).forEach((card) => {
     const id = card.dataset.openSetting ?? card.dataset.openCharacter ?? card.dataset.openRace ?? card.dataset.openOrganization ?? card.dataset.openReview;
@@ -4246,28 +4472,42 @@ function draftTypeLabel(draftType) {
 
 async function deleteDraft(item) {
   if (!item || !canEditModule("drafts")) return;
+  const dialog = $("#form-dialog");
+  dialog.close();
   if (!await confirmToast(`确认删除草稿“${item.title}”吗？草稿将从当前列表移除。`, {
     title: "删除草稿",
     confirmLabel: "确认删除"
-  })) return;
+  })) {
+    openDraftDialog(item);
+    return;
+  }
   try {
     await api(`/api/drafts/${encodeURIComponent(item.id)}`, { method: "DELETE", body: { expectedVersionNo: item.versionNo } });
     await renderDrafts(moduleListPages.drafts);
     toast("草稿已删除");
   } catch (error) {
     toast(error.message, "error");
+    try {
+      openDraftDialog(await api(`/api/drafts/${encodeURIComponent(item.id)}`));
+    } catch (reloadError) {
+      toast(reloadError.message, "error");
+    }
   }
 }
 
 function openDraftDialog(item = null, { readOnly = false } = {}) {
   const viewOnly = readOnly || !canEditModule("drafts");
+  const management = item && !viewOnly ? `<section class="entity-dialog-management" aria-label="草稿操作">
+    <div><strong>草稿操作</strong><small>删除后将从草稿列表移除，版本历史仍会保留。</small></div>
+    <div class="entity-dialog-management-actions"><button class="danger-button" type="button" data-dialog-draft-delete>删除草稿</button></div>
+  </section>` : "";
   const fields = `<p class="form-field-note">草稿只记录未确认的临时想法，可能采用，也可能永远不会写入正文或正式设定。</p>`
     + field("draftType", "草稿类型", "select", item?.draftType ?? "prose", [["prose", "正文草稿"], ["setting", "设定草稿"]])
     + field("title", "标题", "text", item?.title ?? "")
     + field("content", "内容", "markdown", item?.content ?? "", {
       placeholder: "记录尚未定稿的片段、方向或设定想法……",
       readOnly: viewOnly
-    });
+    }) + management;
   openDialog(item ? viewOnly ? "查看草稿" : "编辑草稿" : "新建草稿", fields, async (form) => {
     if (viewOnly) return;
     const title = String(form.get("title") ?? "").trim();
@@ -4287,7 +4527,7 @@ function openDraftDialog(item = null, { readOnly = false } = {}) {
   }, item ? draftTypeLabel(item.draftType) : "未确认想法", {
     submitLabel: viewOnly ? "关闭" : "保存草稿",
     hideCancel: viewOnly,
-    wide: true,
+    editor: true,
     errorPrefix: "草稿保存失败："
   });
   if (viewOnly) {
@@ -4296,10 +4536,13 @@ function openDraftDialog(item = null, { readOnly = false } = {}) {
       else control.readOnly = true;
     });
   }
+  $("#dialog-fields").querySelector("[data-dialog-draft-delete]")?.addEventListener("click", () => {
+    void deleteDraft(item);
+  });
 }
 
 async function renderDrafts(page = moduleListPages.drafts) {
-  const allDrafts = await apiAllPages(`/api/works/${state.work.id}/drafts`);
+  const allDrafts = await moduleApiAllPages("drafts", `/api/works/${state.work.id}/drafts`);
   const drafts = draftTypeFilter === "all"
     ? allDrafts
     : allDrafts.filter((draft) => draft.draftType === draftTypeFilter);
@@ -4309,7 +4552,8 @@ async function renderDrafts(page = moduleListPages.drafts) {
   const layout = readModuleLayout();
   if (drafts.length) mountModuleLayoutToggle(layout, "草稿列表样式");
   else $("#module-header-actions").querySelector('[data-module-header-action="layout-toggle"]')?.remove();
-  const filterToolbar = `<section class="draft-filter-toolbar" aria-label="草稿筛选">
+  mountDraftFilterToggle();
+  const filterToolbar = `<section id="draft-filter-panel" class="draft-filter-toolbar${draftFiltersPanelOpen ? "" : " hidden"}" aria-label="草稿筛选">
     <label for="draft-type-filter">草稿类型</label>
     <select id="draft-type-filter" aria-label="按草稿类型筛选">
       <option value="all" ${draftTypeFilter === "all" ? "selected" : ""}>全部草稿</option>
@@ -4319,7 +4563,7 @@ async function renderDrafts(page = moduleListPages.drafts) {
     ${draftTypeFilter === "all" ? "" : `<span aria-live="polite">筛选后剩余 ${drafts.length} 篇草稿</span>`}
   </section>`;
   const actions = (item) => canEditModule("drafts")
-    ? `${recordCardEditButton("edit-draft", item.id, `草稿“${item.title}”`)}<button type="button" data-delete-draft="${esc(item.id)}">删除</button>${recordHistoryButton("draft", item.id, item.title)}`
+    ? `${recordCardEditButton("edit-draft", item.id, `草稿“${item.title}”`)}${recordHistoryButton("draft", item.id, item.title)}`
     : recordHistoryButton("draft", item.id, item.title);
   const cards = `<div class="card-grid">${pageResult.items.map((item) => `
     <article class="record-card preview-record-card" data-open-draft="${esc(item.id)}" role="button" tabindex="0" aria-label="查看草稿 ${esc(item.title)}">
@@ -4344,12 +4588,12 @@ async function renderDrafts(page = moduleListPages.drafts) {
     : emptyDrafts);
   $("#draft-type-filter").addEventListener("change", async (event) => {
     draftTypeFilter = ["prose", "setting"].includes(event.currentTarget.value) ? event.currentTarget.value : "all";
+    draftFiltersPanelOpen = true;
     moduleListPages.drafts = 1;
     await renderDrafts(1);
   });
   bindModuleLayoutToggle(() => renderDrafts(pageResult.page));
   bindModulePagination("drafts", renderDrafts);
-  const draftById = (draftId) => drafts.find((draft) => draft.id === draftId);
   $("#module-content").querySelectorAll("[data-open-draft]").forEach((card) => {
     const open = async () => openDraftDialog(await api(`/api/drafts/${encodeURIComponent(card.dataset.openDraft)}`), { readOnly: true });
     card.addEventListener("click", (event) => { if (!event.target.closest("button, a")) void open(); });
@@ -4363,9 +4607,6 @@ async function renderDrafts(page = moduleListPages.drafts) {
   $("#module-content").querySelectorAll("[data-edit-draft]").forEach((button) => button.addEventListener("click", async () => {
     openDraftDialog(await api(`/api/drafts/${encodeURIComponent(button.dataset.editDraft)}`));
   }));
-  $("#module-content").querySelectorAll("[data-delete-draft]").forEach((button) => button.addEventListener("click", () => {
-    void deleteDraft(draftById(button.dataset.deleteDraft));
-  }));
   bindEntityHistoryButtons(() => renderDrafts(pageResult.page));
 }
 
@@ -4387,7 +4628,7 @@ function renderSettingRows(records) {
 }
 
 async function renderSettings(page = moduleListPages.settings) {
-  const records = await apiAllPages(`/api/works/${state.work.id}/settings`);
+  const records = await moduleApiAllPages("settings", `/api/works/${state.work.id}/settings`);
   state.settings = records;
   mountModuleCount(records.length);
   const pageResult = paginateModuleItems(records, page, "settings");
@@ -4408,9 +4649,11 @@ async function renderCharacters(page = characterListPage) {
   const hasCharacterFilters = characterFilters.raceIds.length > 0 || characterFilters.organizationIds.length > 0;
   const pageSize = pageSizeFor("characters");
   const [characterSource, races, organizations] = await Promise.all([
-    hasCharacterFilters ? apiAllPages(`/api/works/${state.work.id}/characters`) : apiPage(`/api/works/${state.work.id}/characters`, page, pageSize),
-    canReadModule("races") ? api(`/api/works/${state.work.id}/races`) : Promise.resolve([]),
-    canReadModule("organizations") ? apiAllPages(`/api/works/${state.work.id}/organizations`) : Promise.resolve([])
+    hasCharacterFilters
+      ? moduleApiAllPages("characters", `/api/works/${state.work.id}/characters`)
+      : moduleApiPage("characters", `/api/works/${state.work.id}/characters`, page, pageSize),
+    canReadModule("races") ? moduleApi("characters", `/api/works/${state.work.id}/races`) : Promise.resolve([]),
+    canReadModule("organizations") ? moduleApiAllPages("characters", `/api/works/${state.work.id}/organizations`) : Promise.resolve([])
   ]);
   const characterPage = hasCharacterFilters
     ? paginateCharacters(filterCharacters(characterSource, characterFilters), page, pageSize)
@@ -4586,7 +4829,7 @@ async function renderRaces() {
   const workId = state.work.id;
   const generation = workScopedUiGeneration;
   const requestId = ++raceListRequestId;
-  const roots = await api(`/api/works/${workId}/races?scope=roots`);
+  const roots = await moduleApi("races", `/api/works/${workId}/races?scope=roots`);
   if (state.work?.id !== workId || generation !== workScopedUiGeneration || requestId !== raceListRequestId) return;
   state.races = roots.items;
   loadedRaceHierarchyWorkId = roots.items.length === roots.total ? workId : null;
@@ -4594,7 +4837,7 @@ async function renderRaces() {
   if (loadedRaceHierarchyWorkId === workId) return;
 
   const dismissLoadingToast = persistentToast("正在加载子种族……");
-  const loadPromise = api(`/api/works/${workId}/races?scope=descendants`).then((descendants) => {
+  const loadPromise = moduleApi("races", `/api/works/${workId}/races?scope=descendants`).then((descendants) => {
     if (state.work?.id !== workId || generation !== workScopedUiGeneration || requestId !== raceListRequestId) return;
     state.races = [...roots.items, ...descendants];
     loadedRaceHierarchyWorkId = workId;
@@ -4618,8 +4861,8 @@ async function renderRaces() {
 
 async function renderOrganizations(page = moduleListPages.organizations) {
   [state.organizations, state.characters] = await Promise.all([
-    apiAllPages(`/api/works/${state.work.id}/organizations`),
-    canReadModule("characters") ? apiAllPages(`/api/works/${state.work.id}/characters`) : Promise.resolve([])
+    moduleApiAllPages("organizations", `/api/works/${state.work.id}/organizations`),
+    canReadModule("characters") ? moduleApiAllPages("organizations", `/api/works/${state.work.id}/characters`) : Promise.resolve([])
   ]);
   mountModuleCount(state.organizations.length);
   const pageResult = paginateModuleItems(state.organizations, page, "organizations");
@@ -4685,8 +4928,8 @@ function setTimelineMultiSelectMode(enabled) {
 
 async function renderTimeline(page = moduleListPages.timeline) {
   const [events, tracks] = await Promise.all([
-    apiAllPages(`/api/works/${state.work.id}/timeline`),
-    apiAllPages(`/api/works/${state.work.id}/timeline-tracks`)
+    moduleApiAllPages("timeline", `/api/works/${state.work.id}/timeline`),
+    moduleApiAllPages("timeline", `/api/works/${state.work.id}/timeline-tracks`)
   ]);
   mountModuleCount(events.length);
   const pageResult = paginateModuleItems(events, page, "timeline");
@@ -4729,8 +4972,8 @@ async function renderTimeline(page = moduleListPages.timeline) {
 async function renderOutlines(outlinePage = moduleListPages.outlinePlans, foreshadowPage = moduleListPages.foreshadows) {
   const currentChapterId = state.chapter?.id;
   const [outlines, foreshadows] = await Promise.all([
-    apiAllPages(`/api/works/${state.work.id}/outlines`),
-    apiAllPages(`/api/works/${state.work.id}/foreshadows?status=all${currentChapterId ? `&currentChapterId=${encodeURIComponent(currentChapterId)}` : ""}`)
+    moduleApiAllPages("outlines", `/api/works/${state.work.id}/outlines`),
+    moduleApiAllPages("outlines", `/api/works/${state.work.id}/foreshadows?status=all${currentChapterId ? `&currentChapterId=${encodeURIComponent(currentChapterId)}` : ""}`)
   ]);
   mountModuleCount(outlines.length + foreshadows.length);
   const outlinePageResult = paginateModuleItems(outlines, outlinePage, "outlines");
@@ -4783,8 +5026,8 @@ async function renderOutlines(outlinePage = moduleListPages.outlinePlans, foresh
 }
 
 async function renderRelationships(page = moduleListPages.relationships) {
-  state.characters = canReadModule("characters") ? await apiAllPages(`/api/works/${state.work.id}/characters`) : [];
-  const relationships = await apiAllPages(`/api/works/${state.work.id}/relationships`);
+  state.characters = canReadModule("characters") ? await moduleApiAllPages("relationships", `/api/works/${state.work.id}/characters`) : [];
+  const relationships = await moduleApiAllPages("relationships", `/api/works/${state.work.id}/relationships`);
   const filteredRelationships = filterRelationships(relationships, relationshipFilters);
   const pageResult = paginateModuleItems(filteredRelationships, page, "relationships");
   moduleListPages.relationships = pageResult.page;
@@ -4858,8 +5101,8 @@ async function renderReviews(page = moduleListPages.reviews) {
   const canMergeCharacters = canResolveReview
     && ["characters", "races", "organizations", "timeline", "relationships"].every((module) => canEditModule(module));
   const [reviews, characters] = await Promise.all([
-    apiAllPages(`/api/works/${state.work.id}/reviews`),
-    canReadCharacters ? apiAllPages(`/api/works/${state.work.id}/characters?includeMerged=1`) : Promise.resolve([])
+    moduleApiAllPages("reviews", `/api/works/${state.work.id}/reviews`),
+    canReadCharacters ? moduleApiAllPages("reviews", `/api/works/${state.work.id}/characters?includeMerged=1`) : Promise.resolve([])
   ]);
   mountModuleCount(reviews.length);
   const pageResult = paginateModuleItems(reviews, page, "reviews");
@@ -4947,16 +5190,16 @@ async function renderReviews(page = moduleListPages.reviews) {
   }));
 }
 
-async function renderTasks(page = taskListPage) {
+async function renderTasks(page = taskListPage, { refresh = false } = {}) {
   stopTaskProgressRefresh();
   const pageSize = pageSizeFor("analysisTasks");
   const [taskPage, settings] = await Promise.all([
-    apiPage(`/api/works/${state.work.id}/tasks`, page, pageSize),
+    moduleApiPage("tasks", `/api/works/${state.work.id}/tasks`, page, pageSize, { refresh }),
     canReadModule("ai-settings")
-      ? api(`/api/works/${state.work.id}/ai-settings`)
+      ? moduleApi("tasks", `/api/works/${state.work.id}/ai-settings`, { refresh })
       : Promise.resolve({ autoRunEnabled: false, autoRunConcurrency: 2, autoRunDailyTaskLimit: 0, autoRunFailureThreshold: 3, autoRunPaused: false })
   ]);
-  if (!taskPage.items.length && page > 1) return renderTasks(page - 1);
+  if (!taskPage.items.length && page > 1) return renderTasks(page - 1, { refresh });
   taskListPage = taskPage.page;
   const tasks = taskPage.items;
   const taskTotal = Number(taskPage.total ?? taskPage.stats?.total ?? tasks.length);
@@ -5067,7 +5310,7 @@ async function renderTasks(page = taskListPage) {
         : "自动执行已关闭");
       taskAutoRunEditing = false;
       taskAutoRunEditingWorkId = null;
-      await renderTasks();
+      await renderTasks(taskListPage, { refresh: true });
     } catch (error) {
       toast(error.message, "error");
       button.disabled = false;
@@ -5171,12 +5414,7 @@ async function rerunAnalysisTaskWithModel(task, button) {
   try {
     const models = await api(`/api/works/${encodeURIComponent(task.workId)}/models`);
     const currentModelId = String(task.model?.id ?? "");
-    const availableModels = models.filter((model) =>
-      model.id !== currentModelId
-      && model.enabled
-      && model.providerStatus === "enabled"
-      && model.providerConnectionStatus === "success"
-    );
+    const availableModels = models.filter((model) => model.id !== currentModelId && isSelectableModel(model));
     if (!availableModels.length) throw new Error("当前没有其他可用模型，请先配置并测试模型");
     $("#form-dialog").close();
     const currentModelLabel = task.model?.displayName || "运行时默认模型";
@@ -5226,7 +5464,7 @@ function scheduleTaskProgressRefresh(workId, runningCount) {
       return;
     }
     try {
-      await renderTasks();
+      await renderTasks(taskListPage, { refresh: true });
     } catch (error) {
       console.error("Failed to refresh task progress", error);
       scheduleTaskProgressRefresh(workId, runningCount);
@@ -5687,11 +5925,28 @@ function openTaskDetailDialog(task, trace) {
 }
 
 function renderProviderCards(providers, models) {
-  return providers.length ? `<div class="card-grid provider-card-grid">${providers.map((provider) => `
-    <article class="record-card provider-card"><small>平台级 · ${esc(providerProtocolLabel(provider.protocol))} · ${esc(providerStatusLabel(provider.status))} · ${esc(providerConnectionLabel(provider.connectionStatus))}</small><h3>${esc(provider.name)}</h3>
-    <p>${esc(provider.baseUrl)}\n密钥：${esc(provider.apiKey)}\n并发：${provider.concurrencyLimit} · 每分钟请求：${provider.rpmLimit} · 最大输出：${provider.maxTokens ?? 32000}${provider.lastError ? `\n错误：${esc(provider.lastError)}` : ""}</p>
-    <div class="provider-models">${models.filter((model) => model.providerId === provider.id).map((model) => `<button class="pill model-pill" type="button" data-edit-model="${esc(model.id)}" aria-label="编辑模型 ${esc(model.displayName)}">${esc(model.displayName)} · ${model.enabled ? "启用" : "停用"} · 思考模式 ${model.thinkingEnabled ? "开启" : "关闭"} · 上下文 ${Number(model.contextWindow ?? 128000).toLocaleString("zh-CN")} 令牌 · 最大输出 ${Number(model.preset?.max_tokens ?? 32000).toLocaleString("zh-CN")}</button>`).join("")}</div>
-    <div class="card-actions"><button data-edit-provider="${esc(provider.id)}">编辑配置</button><button data-test-provider="${esc(provider.id)}">测试连接</button><button data-add-model="${esc(provider.id)}">添加模型</button></div></article>`).join("")}</div>`
+  return providers.length ? `<div class="card-grid provider-card-grid">${providers.map((provider) => {
+    const providerModels = models.filter((model) => model.providerId === provider.id);
+    const providerStatusClass = provider.status === "disabled" ? "is-disabled" : provider.status === "error" ? "is-error" : "is-enabled";
+    const disabledNotice = provider.status === "disabled"
+      ? `<div class="provider-disabled-notice" role="status"><strong>已停用</strong><span>不会出现在新任务的模型列表中，历史任务仍可查看。</span></div>`
+      : "";
+    return `
+    <article class="record-card provider-card ${provider.status === "disabled" ? "is-disabled" : ""}"><div class="provider-card-meta"><small>平台级 · ${esc(providerProtocolLabel(provider.protocol))} · ${esc(providerConnectionLabel(provider.connectionStatus))}</small><span class="provider-status-badge ${providerStatusClass}">${esc(providerStatusLabel(provider.status))}</span></div><h3>${esc(provider.name)}</h3>
+    ${disabledNotice}<p>${esc(provider.baseUrl)}\n密钥：${esc(provider.apiKey)}\n并发：${provider.concurrencyLimit} · 每分钟请求：${provider.rpmLimit}${provider.lastError ? `\n错误：${esc(provider.lastError)}` : ""}</p>
+    <div class="provider-models">${providerModels.map((model) => {
+      const modelUnavailable = !isSelectableModel({ ...model, providerStatus: provider.status, providerConnectionStatus: provider.connectionStatus });
+      const modelStatus = !model.enabled
+        ? `<span class="model-status-badge is-disabled">模型已停用</span>`
+        : provider.status !== "enabled"
+          ? `<span class="model-status-badge is-disabled">供应商已停用</span>`
+          : provider.connectionStatus !== "success"
+            ? `<span class="model-status-badge is-unavailable">连接不可用</span>`
+            : "";
+      return `<div class="provider-model-row${modelUnavailable ? " is-unavailable" : ""}"><button class="pill model-pill" type="button" data-edit-model="${esc(model.id)}" aria-label="编辑模型 ${esc(model.displayName)}">${esc(model.displayName)} · ${model.enabled ? "启用" : "停用"} · 思考模式 ${model.thinkingEnabled ? "开启" : "关闭"} · 上下文 ${Number(model.contextWindow ?? 128000).toLocaleString("zh-CN")} 令牌 · 最大输出 ${Number(model.preset?.max_tokens ?? 32000).toLocaleString("zh-CN")}</button>${modelStatus}<button class="ghost-button model-test-button" type="button" data-test-model="${esc(model.id)}" aria-label="测试模型 ${esc(model.displayName)}">测试连接</button></div>`;
+    }).join("")}</div>
+    <div class="card-actions"><button data-edit-provider="${esc(provider.id)}">编辑配置</button><button data-test-provider="${esc(provider.id)}" ${providerModels.length ? "" : "disabled aria-disabled=\"true\" title=\"请先添加模型\""}>测试连接</button><button data-add-model="${esc(provider.id)}">添加模型</button></div></article>`;
+  }).join("")}</div>`
     : emptyModule("尚未配置 AI 供应商", "添加 OpenAI 或 Anthropic 兼容接口地址和密钥，测试成功后再添加模型。");
 }
 
@@ -5704,28 +5959,50 @@ function bindPlatformProviderActions(host, providers, models) {
     await renderPlatformAiConfig();
     await loadModels();
   }));
+  host.querySelectorAll("[data-test-model]").forEach((button) => button.addEventListener("click", async () => {
+    button.disabled = true;
+    button.textContent = "测试中";
+    const result = await api(`/api/models/${button.dataset.testModel}/test`, { method: "POST", body: {} });
+    toast(result.ok ? "模型连接测试成功" : `模型连接失败：${result.error}`, result.ok ? "info" : "error");
+    await renderPlatformAiConfig();
+    await loadModels();
+  }));
   host.querySelectorAll("[data-add-model]").forEach((button) => button.addEventListener("click", () => openModelDialog(button.dataset.addModel)));
   host.querySelectorAll("[data-edit-model]").forEach((button) => button.addEventListener("click", () => openModelDialog(undefined, models.find((model) => model.id === button.dataset.editModel))));
   host.querySelectorAll("[data-edit-provider]").forEach((button) => button.addEventListener("click", () => openProviderDialog(providers.find((provider) => provider.id === button.dataset.editProvider))));
 }
 
-function renderTaskDefaults(models, providers, taskDefaults) {
+function renderTaskDefaults(models, providers, taskDefaults, settings) {
   const providerById = new Map(providers.map((provider) => [provider.id, provider]));
   const defaultModelByTask = new Map(taskDefaults.map((item) => [item.taskType, item.model.id]));
-  return models.length ? `<section class="config-section">
+  const availableModels = models.filter((model) => isSelectableModel(model));
+  const availableModelIds = new Set(availableModels.map((model) => model.id));
+  const currentDefaultModels = taskDefaults
+    .map((item) => item.model)
+    .filter((model) => model && !availableModelIds.has(model.id));
+  const optionModels = [...availableModels, ...currentDefaultModels];
+  return optionModels.length ? `<section class="config-section">
     <div class="config-section-header"><div><h2>本书任务默认模型</h2><p>选择平台模型作为当前作品的默认模型；所有请求都会携带最大输出令牌数，默认值为 32000。</p></div></div>
-    <table class="table-list"><thead><tr><th>任务能力</th><th>默认模型</th></tr></thead><tbody>${taskTypeLabels.map(([taskType, label]) => {
+    <table class="table-list"><thead><tr><th>任务能力</th><th>默认模型</th></tr></thead><tbody><tr><td>创作助手对话标题生成</td><td><select class="default-model-select" data-title-generation-default aria-label="创作助手对话标题生成">
+      <option value="" ${settings.titleGenerationModelId ? "" : "selected"}>使用提示词前 15 个字</option>
+      ${models.map((model) => {
+        const provider = providerById.get(model.providerId);
+        const available = model.enabled && provider?.status === "enabled" && provider?.connectionStatus === "success";
+        return `<option value="${esc(model.id)}" ${model.id === settings.titleGenerationModelId ? "selected" : ""} ${available || model.id === settings.titleGenerationModelId ? "" : "disabled"}>${esc(modelOptionLabel({ ...model, providerName: model.providerName || provider?.name }))}</option>`;
+      }).join("")}
+    </select></td></tr>${taskTypeLabels.map(([taskType, label]) => {
       const currentModelId = defaultModelByTask.get(taskType) ?? "";
       return `<tr><td>${esc(label)}</td><td><select class="default-model-select" data-task-default="${esc(taskType)}">
         <option value="" disabled ${currentModelId ? "" : "selected"}>请选择模型</option>
-        ${models.map((model) => {
+        ${optionModels.map((model) => {
           const provider = providerById.get(model.providerId);
-          const available = model.enabled && provider?.status === "enabled" && provider?.connectionStatus === "success";
-          return `<option value="${esc(model.id)}" ${model.id === currentModelId ? "selected" : ""} ${available || model.id === currentModelId ? "" : "disabled"}>${esc(modelOptionLabel({ ...model, providerName: model.providerName || provider?.name }))}</option>`;
+          const available = isSelectableModel({ ...model, providerStatus: model.providerStatus ?? provider?.status, providerConnectionStatus: model.providerConnectionStatus ?? provider?.connectionStatus });
+          const unavailableLabel = !model.enabled ? "模型已停用 · " : provider?.status !== "enabled" ? "供应商已停用 · " : "连接不可用 · ";
+          return `<option value="${esc(model.id)}" ${model.id === currentModelId ? "selected" : ""} ${available ? "" : "disabled"}>${esc(`${available ? "" : unavailableLabel}${modelOptionLabel({ ...model, providerName: model.providerName || provider?.name })}`)}</option>`;
         }).join("")}
       </select></td></tr>`;
     }).join("")}</tbody></table>
-  </section>` : emptyModule("尚未配置平台模型", "请先在平台 AI 管理中添加并测试供应商模型。");
+  </section>` : emptyModule("尚未配置可用模型", "请先启用并测试供应商模型，已停用模型不会出现在新任务选择中。");
 }
 
 const relationshipIndexStatusLabels = Object.freeze({
@@ -6106,12 +6383,12 @@ async function renderBookAiSettings() {
     relationshipSearchIndexRefreshTimer = null;
   }
   const [settings, providers, models, taskDefaults, relationshipIndex, usage] = await Promise.all([
-    api(`/api/works/${state.work.id}/ai-settings`),
-    api("/api/platform/ai/providers"),
-    api(`/api/works/${state.work.id}/models`),
-    api(`/api/works/${state.work.id}/task-defaults`),
-    api(`/api/works/${state.work.id}/ai-settings/relationship-search-index`),
-    api(`/api/works/${state.work.id}/ai-settings/usage?timezoneOffset=${-new Date().getTimezoneOffset()}`)
+    moduleApi("ai-settings", `/api/works/${state.work.id}/ai-settings`),
+    moduleApi("ai-settings", "/api/platform/ai/providers"),
+    moduleApi("ai-settings", `/api/works/${state.work.id}/models`),
+    moduleApi("ai-settings", `/api/works/${state.work.id}/task-defaults`),
+    moduleApi("ai-settings", `/api/works/${state.work.id}/ai-settings/relationship-search-index`),
+    moduleApi("ai-settings", `/api/works/${state.work.id}/ai-settings/usage?timezoneOffset=${-new Date().getTimezoneOffset()}`)
   ]);
   const host = $("#module-content");
   const workId = String(state.work.id);
@@ -6119,7 +6396,7 @@ async function renderBookAiSettings() {
   host.innerHTML = `<section class="config-section">${tokenUsageOverviewMarkup(usage, {
     title: "本书 Token 用量",
     description: `仅统计《${state.work.title}》迄今产生的 AI Token 消耗与缓存命中情况。`
-  })}</section><section class="config-section"><div class="config-section-header"><div><h2>本书系统提示词</h2><p>会追加在内置系统提示词和平台全局系统提示词之后，只影响《${esc(state.work.title)}》的 AI 请求。</p></div></div><div class="field-label"><textarea id="work-system-prompt" rows="8" aria-label="本书系统提示词" placeholder="例如：叙事使用第三人称，哥斯拉不得离开地球。">${esc(settings.systemPrompt)}</textarea></div><div class="card-actions"><button id="save-work-system-prompt" class="ghost-button config-save-button" type="button">保存本书提示词</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>人物关系拼音索引</h2><p>平时由系统记录增量任务；“同步增量队列”只处理发生变化的来源，“完整重建索引”会将本书全部正文和设定来源重新排队。</p></div></div><div id="relationship-search-index-status" role="status" aria-live="polite">${relationshipIndexStatusMarkup(relationshipIndex)}</div><div class="relationship-index-actions"><button id="sync-relationship-search-index" class="primary-button config-save-button" type="button">同步增量队列</button><button id="refresh-relationship-search-index" class="ghost-button" type="button">刷新状态</button><button id="rebuild-relationship-search-index" class="ghost-button config-save-button" type="button">完整重建索引</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>全书概要引用配额</h2><p>引用全书概要时按分卷保留覆盖，并优先加入与当前问题相关的章节概要；该比例控制概要可使用的上下文预算。</p></div></div><div class="config-inline-save"><label class="book-summary-context-percent-field">上下文占比（%）<input id="book-summary-context-percent" type="number" min="1" max="90" value="${esc(String(settings.bookSummaryContextPercent ?? 50))}" aria-label="全书概要引用上下文占比"></label><button id="save-book-summary-context-percent" class="ghost-button config-save-button" type="button">保存</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>对话上下文 Compact</h2><p>对话 context 使用独立预算。达到该百分比阈值时先提醒；继续发送会对较早消息执行 compact，压缩上下文占用，并尽量保留最近八条原文。</p></div></div><div class="config-inline-save"><label class="context-compact-threshold-field">Compact 阈值（%）<input id="context-compact-threshold" type="number" min="50" max="90" value="${esc(String(settings.contextCompactThreshold ?? 85))}" aria-label="对话上下文 compact 阈值"></label><button id="save-context-compact-threshold" class="ghost-button config-save-button" type="button">保存</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>AI 查询工具</h2><p>工具默认可用，作为已有上下文的补充。关闭后模型不会看到对应能力；所有工具只读且有数量、篇幅与调用轮次限制。</p></div></div><div class="ai-agent-tools"><label><input name="agent-tool" type="checkbox" value="story_index" ${agentTools.has("story_index") ? "checked" : ""}><span><strong>作品目录与章节概要</strong><small>分页获取卷章、章节 ID 和当前概要，不返回正文。</small></span></label><label><input name="agent-tool" type="checkbox" value="read_chapters" ${agentTools.has("read_chapters") ? "checked" : ""}><span><strong>读取章节</strong><small>按章节 ID 获取概要或正文，每次最多 3 章。</small></span></label><label><input name="agent-tool" type="checkbox" value="search_story_entities" ${agentTools.has("search_story_entities") ? "checked" : ""}><span><strong>搜索作品实体</strong><small>按实体名、拼音或短关键词混合检索设定、人物、组织、时间线、关系、大纲和伏笔；非语义问答。</small></span></label></div><div class="card-actions"><button id="save-agent-tools" class="ghost-button config-save-button" type="button">保存工具设置</button></div></section>${renderTaskDefaults(models, providers, taskDefaults)}`;
+  })}</section><section class="config-section"><div class="config-section-header"><div><h2>本书系统提示词</h2><p>会追加在内置系统提示词和平台全局系统提示词之后，只影响《${esc(state.work.title)}》的 AI 请求。</p></div></div><div class="field-label"><textarea id="work-system-prompt" rows="8" aria-label="本书系统提示词" placeholder="例如：叙事使用第三人称，哥斯拉不得离开地球。">${esc(settings.systemPrompt)}</textarea></div><div class="card-actions"><button id="save-work-system-prompt" class="ghost-button config-save-button" type="button">保存本书提示词</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>人物关系拼音索引</h2><p>平时由系统记录增量任务；“同步增量队列”只处理发生变化的来源，“完整重建索引”会将本书全部正文和设定来源重新排队。</p></div></div><div id="relationship-search-index-status" role="status" aria-live="polite">${relationshipIndexStatusMarkup(relationshipIndex)}</div><div class="relationship-index-actions"><button id="sync-relationship-search-index" class="primary-button config-save-button" type="button">同步增量队列</button><button id="refresh-relationship-search-index" class="ghost-button" type="button">刷新状态</button><button id="rebuild-relationship-search-index" class="ghost-button config-save-button" type="button">完整重建索引</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>全书概要引用配额</h2><p>引用全书概要时按分卷保留覆盖，并优先加入与当前问题相关的章节概要；该比例控制概要可使用的上下文预算。</p></div></div><div class="config-inline-save"><label class="book-summary-context-percent-field">上下文占比（%）<input id="book-summary-context-percent" type="number" min="1" max="90" value="${esc(String(settings.bookSummaryContextPercent ?? 50))}" aria-label="全书概要引用上下文占比"></label><button id="save-book-summary-context-percent" class="ghost-button config-save-button" type="button">保存</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>对话上下文 Compact</h2><p>对话 context 使用独立预算。达到该百分比阈值时先提醒；继续发送会对较早消息执行 compact，压缩上下文占用，并尽量保留最近八条原文。</p></div></div><div class="config-inline-save"><label class="context-compact-threshold-field">Compact 阈值（%）<input id="context-compact-threshold" type="number" min="50" max="90" value="${esc(String(settings.contextCompactThreshold ?? 85))}" aria-label="对话上下文 compact 阈值"></label><button id="save-context-compact-threshold" class="ghost-button config-save-button" type="button">保存</button></div></section><section class="config-section"><div class="config-section-header"><div><h2>AI 查询工具</h2><p>工具默认可用，作为已有上下文的补充。关闭后模型不会看到对应能力；所有工具只读且有数量、篇幅与调用轮次限制。</p></div></div><div class="ai-agent-tools"><label><input name="agent-tool" type="checkbox" value="story_index" ${agentTools.has("story_index") ? "checked" : ""}><span><strong>作品目录与章节概要</strong><small>分页获取卷章、章节 ID 和当前概要，不返回正文。</small></span></label><label><input name="agent-tool" type="checkbox" value="read_chapters" ${agentTools.has("read_chapters") ? "checked" : ""}><span><strong>读取章节</strong><small>按章节 ID 获取概要或正文，每次最多 3 章。</small></span></label><label><input name="agent-tool" type="checkbox" value="search_story_entities" ${agentTools.has("search_story_entities") ? "checked" : ""}><span><strong>搜索作品实体</strong><small>按实体名、拼音或短关键词混合检索设定、人物、组织、时间线、关系、大纲和伏笔；非语义问答。</small></span></label></div><div class="card-actions"><button id="save-agent-tools" class="ghost-button config-save-button" type="button">保存工具设置</button></div></section>${renderTaskDefaults(models, providers, taskDefaults, settings)}`;
   scrollUsageCalendarsToLatest(host);
   host.querySelector('input[name="agent-tool"][value="search_story_entities"]').closest("label").insertAdjacentHTML(
     "beforebegin",
@@ -6256,6 +6533,18 @@ async function renderBookAiSettings() {
       button.disabled = false;
     }
   });
+  host.querySelector("[data-title-generation-default]")?.addEventListener("change", async (event) => {
+    const select = event.currentTarget;
+    select.disabled = true;
+    try {
+      await api(`/api/works/${state.work.id}/ai-settings`, { method: "PATCH", body: { titleGenerationModelId: select.value } });
+      toast("创作助手对话标题生成模型已更新");
+    } catch (error) {
+      toast(error.message, "error");
+    }
+    await renderBookAiSettings();
+    await loadModels();
+  });
   host.querySelectorAll("[data-task-default]").forEach((select) => select.addEventListener("change", async () => {
     select.disabled = true;
     try {
@@ -6275,11 +6564,11 @@ async function loadModels() {
   const generation = workScopedUiGeneration;
   const models = await api(`/api/works/${workId}/models`);
   if (state.work?.id !== workId || generation !== workScopedUiGeneration) return;
-  state.models = models;
+  state.models = models.filter((model) => isSelectableModel(model));
   loadedAiModelsWorkId = workId;
   const select = $("#ai-model");
   select.innerHTML = state.models.length
-    ? state.models.map((model) => `<option value="${esc(model.id)}" ${model.enabled ? "" : "disabled"}>${esc(modelOptionLabel(model))}</option>`).join("")
+    ? state.models.map((model) => `<option value="${esc(model.id)}">${esc(modelOptionLabel(model))}</option>`).join("")
     : '<option value="">请先配置模型</option>';
   scheduleAiContextUsage();
 }
@@ -6327,9 +6616,50 @@ function currentAiRequestScope() {
   return { taskType, scope, selection };
 }
 
+function renderAiContextDistribution(usage) {
+  const popover = $("#ai-context-popover");
+  const host = $("#ai-context-distribution");
+  const distribution = normalizeAiContextTokenDistribution(usage);
+  const contextWindow = distribution.contextWindow.toLocaleString("zh-CN");
+  $("#ai-context-popover-description").textContent = usage
+    ? `已占用 ${distribution.occupiedTokens.toLocaleString("zh-CN")} / ${contextWindow} tok`
+    : "选择可用模型后显示当前上下文用量";
+  host.replaceChildren(...distribution.items.map((item) => {
+    const row = document.createElement("div");
+    row.className = "ai-context-distribution-row";
+    row.dataset.key = item.key;
+    row.setAttribute("role", "listitem");
+    row.setAttribute("aria-label", `${item.label}：${item.tokens.toLocaleString("zh-CN")} tok，占 ${item.percent}%`);
+
+    const label = document.createElement("div");
+    label.className = "ai-context-distribution-label";
+    const title = document.createElement("span");
+    title.textContent = item.label;
+    if (item.key === "context") {
+      const description = document.createElement("small");
+      description.textContent = "用户和 agent 的交互";
+      title.append(" ", description);
+    }
+    const value = document.createElement("strong");
+    value.textContent = `${item.tokens.toLocaleString("zh-CN")} tok · ${item.percent}%`;
+    label.append(title, value);
+
+    const track = document.createElement("div");
+    track.className = "ai-context-distribution-track";
+    track.setAttribute("aria-hidden", "true");
+    const bar = document.createElement("span");
+    bar.style.setProperty("--distribution-percent", String(item.percent));
+    track.append(bar);
+    row.append(label, track);
+    return row;
+  }));
+  popover.dataset.hasUsage = String(Boolean(usage));
+}
+
 function setAiContextMeter(usage) {
   const meter = $("#ai-context-meter");
   const value = meter.querySelector("b");
+  renderAiContextDistribution(usage);
   if (!usage) {
     meter.classList.add("is-empty");
     meter.classList.remove("is-warning", "is-danger");
@@ -6351,6 +6681,14 @@ function setAiContextMeter(usage) {
   meter.setAttribute("aria-label", `当前上下文用量：${tooltip}`);
 }
 
+function setAiContextDistributionVisible(visible) {
+  const meter = $("#ai-context-meter");
+  const popover = $("#ai-context-popover");
+  popover.classList.toggle("hidden", !visible);
+  meter.setAttribute("aria-expanded", String(visible));
+  if (!visible && document.activeElement === $("#ai-context-popover-close")) meter.focus();
+}
+
 function showAiContextWarning(usage = null) {
   const percent = Math.max(0, Math.round(Number(usage?.conversationUsagePercent) || 0));
   const threshold = Math.max(50, Math.min(90, Number(usage?.compactThreshold) || 85));
@@ -6641,6 +6979,7 @@ function openDialog(title, fields, onSubmit, eyebrow = "新增", options = {}) {
   dialog.classList.toggle("wide-dialog", Boolean(options.wide));
   dialog.classList.toggle("trace-dialog", Boolean(options.trace));
   dialog.classList.toggle("large-dialog", Boolean(options.large));
+  dialog.classList.toggle("editor-dialog", Boolean(options.editor));
   bindDynamicListControls($("#dialog-fields"));
   bindRelationshipKeywordControls($("#dialog-fields"));
   formDialogVditors = bindVditorEditors($("#dialog-fields"));
@@ -8361,11 +8700,7 @@ async function openTaskDialog() {
     return;
   }
   const defaultModelByTask = new Map(taskDefaults.map((item) => [item.taskType, item.model.id]));
-  const availableTaskModels = taskModels.filter((model) =>
-    model.enabled
-    && model.providerStatus === "enabled"
-    && model.providerConnectionStatus === "success"
-  );
+  const availableTaskModels = taskModels.filter((model) => isSelectableModel(model));
   const characterOptions = relationshipCharacters.map((character) => [character.id, character.name]);
   const relationshipCharacterPicker = `<div class="form-field relationship-character-field">
     <span id="relationship-character-label">被分析角色（可多选）</span>
@@ -8671,8 +9006,8 @@ async function openTaskDialog() {
 function openProviderDialog(item) {
   const protocol = item?.protocol ?? "openai-chat-completions";
   const defaultBaseUrl = protocol === "anthropic-messages" ? "https://api.anthropic.com" : "https://api.openai.com/v1";
-  openDialog(item ? "编辑 AI 供应商" : "新建 AI 供应商", field("name", "显示名称", "text", item?.name) + field("protocol", "接口协议", "select", protocol, [["openai-chat-completions", "OpenAI Chat Completions"], ["anthropic-messages", "Anthropic Messages"]]) + field("baseUrl", "API 基础地址", "url", item?.baseUrl ?? defaultBaseUrl) + field("apiKey", item ? "替换 API 密钥（留空则不变）" : "API 密钥", "password") + field("concurrencyLimit", "最大并发请求数", "number", item?.concurrencyLimit ?? 10) + field("rpmLimit", "每分钟请求上限", "number", item?.rpmLimit ?? 10) + field("maxTokens", "最大输出令牌数", "number", item?.maxTokens ?? 32000) + field("note", "用途备注", "textarea", item?.note) + field("enabled", item ? "启用供应商" : "立即启用", "checkbox", item ? item.status === "enabled" : true), async (form) => {
-    const body = { name: form.get("name"), protocol: form.get("protocol"), baseUrl: form.get("baseUrl"), concurrencyLimit: Number(form.get("concurrencyLimit")), rpmLimit: Number(form.get("rpmLimit")), maxTokens: Number(form.get("maxTokens")), note: form.get("note"), status: form.get("enabled") === "on" ? "enabled" : "disabled" };
+  openDialog(item ? "编辑 AI 供应商" : "新建 AI 供应商", field("name", "显示名称", "text", item?.name) + field("protocol", "接口协议", "select", protocol, [["openai-chat-completions", "OpenAI Chat Completions"], ["anthropic-messages", "Anthropic Messages"]]) + field("baseUrl", "API 基础地址", "url", item?.baseUrl ?? defaultBaseUrl) + field("apiKey", item ? "替换 API 密钥（留空则不变）" : "API 密钥", "password") + field("concurrencyLimit", "最大并发请求数", "number", item?.concurrencyLimit ?? 10) + field("rpmLimit", "每分钟请求上限", "number", item?.rpmLimit ?? 10) + field("note", "用途备注", "textarea", item?.note) + field("enabled", item ? "启用供应商" : "立即启用", "checkbox", item ? item.status === "enabled" : true), async (form) => {
+    const body = { name: form.get("name"), protocol: form.get("protocol"), baseUrl: form.get("baseUrl"), concurrencyLimit: Number(form.get("concurrencyLimit")), rpmLimit: Number(form.get("rpmLimit")), note: form.get("note"), status: form.get("enabled") === "on" ? "enabled" : "disabled" };
     if (!item || String(form.get("apiKey") ?? "").trim()) body.apiKey = form.get("apiKey");
     await api(item ? `/api/providers/${item.id}` : "/api/platform/ai/providers", { method: item ? "PATCH" : "POST", body });
     await renderPlatformAiConfig();
@@ -8758,29 +9093,37 @@ async function sendAi() {
     let assistantContent = "";
     let assistantMessage;
     let assistantMetadata = {};
+    let persistedStreamMessage = null;
     let suggestion = null;
     if (taskType === "chat") {
       const streamed = await streamChat({ instruction, scope, modelId, citations, conversationId: state.aiConversationId, currentMessageId: persistedUserMessage.id });
       assistantContent = streamed.content;
       assistantMessage = streamed.message;
       assistantMetadata = streamed.metadata;
+      persistedStreamMessage = streamed.messageId ? { id: streamed.messageId, createdAt: streamed.createdAt } : null;
+      applyAiConversationTitle(streamed.conversationTitle);
     } else {
       suggestion = await api(`/api/works/${state.work.id}/suggestions`, { method: "POST", body: { taskType, instruction, scope, modelId, citations } });
       assistantContent = suggestion.content;
       assistantMetadata = { modelDisplayName: suggestion.model?.displayName, outputTokens: suggestion.outputTokens, cacheHitPercent: suggestion.cacheHitPercent };
     }
     try {
-      const persistedAssistantMessage = await persistAiConversationMessage("assistant", assistantContent, [], assistantMetadata);
-      if (assistantMessage) {
-        updateMessageCreatedAt(assistantMessage, persistedAssistantMessage.createdAt);
-        attachMessageIdentity(assistantMessage, persistedAssistantMessage.id);
-      } else if (suggestion) appendSuggestion(suggestion, persistedAssistantMessage.createdAt, persistedAssistantMessage.id);
+      if (persistedStreamMessage) {
+        updateMessageCreatedAt(assistantMessage, persistedStreamMessage.createdAt);
+        attachMessageIdentity(assistantMessage, persistedStreamMessage.id);
+      } else {
+        const persistedAssistantMessage = await persistAiConversationMessage("assistant", assistantContent, [], assistantMetadata);
+        if (assistantMessage) {
+          updateMessageCreatedAt(assistantMessage, persistedAssistantMessage.createdAt);
+          attachMessageIdentity(assistantMessage, persistedAssistantMessage.id);
+        } else if (suggestion) appendSuggestion(suggestion, persistedAssistantMessage.createdAt, persistedAssistantMessage.id);
+      }
     } catch (error) {
       if (suggestion) appendSuggestion(suggestion);
       toast(`AI 回复已生成，但历史记录保存失败：${error.message}`, "error");
     }
   } catch (error) {
-    const failureMessage = `调用失败：${error.message}`;
+    const failureMessage = formatAiFailureMessage(error);
     let persistedFailureMessage = null;
     try { persistedFailureMessage = await persistAiConversationMessage("assistant", failureMessage); } catch { /* 主请求错误已显示，历史记录保存失败不覆盖原始错误 */ }
     appendMessage("assistant", failureMessage, [], persistedFailureMessage?.createdAt, {}, persistedFailureMessage?.id);
@@ -8814,6 +9157,9 @@ async function streamChat(body) {
   let generatedMetadata = {};
   let toolCalls = [];
   let processSteps = [];
+  let persistedMessageId = null;
+  let persistedMessageCreatedAt = null;
+  let conversationTitle = null;
   let finalAnswerStarted = false;
   const processStartedAt = Date.now();
   const elapsedProcessTime = () => Math.max(0, Date.now() - processStartedAt);
@@ -8825,7 +9171,7 @@ async function streamChat(body) {
     });
     if (!response.ok || !response.body) {
       const payload = await response.json().catch(() => ({ error: { message: `请求失败：${response.status}` } }));
-      throw new Error(payload.error?.message ?? `请求失败：${response.status}`);
+      throw createClientError(payload.error, `请求失败：${response.status}`, response.status);
     }
     const reader = response.body.getReader();
     const decoder = new TextDecoder();
@@ -8868,6 +9214,9 @@ async function streamChat(body) {
         meta.textContent = `已调用 ${toolCalls.length} 个工具，正在等待模型处理结果`;
         scrollAiFeedToBottom();
       } else if (eventName === "complete") {
+        persistedMessageId = typeof payload.messageId === "string" ? payload.messageId : null;
+        persistedMessageCreatedAt = typeof payload.messageCreatedAt === "string" ? payload.messageCreatedAt : null;
+        conversationTitle = typeof payload.conversationTitle === "string" ? payload.conversationTitle : null;
         await typewriter.finish();
         message.classList.remove("is-streaming");
         content.setAttribute("aria-busy", "false");
@@ -8881,7 +9230,7 @@ async function streamChat(body) {
         attachAssistantCopyAction(message, streamedText);
         scrollAiFeedToBottom();
       } else if (eventName === "error") {
-        streamError = new Error(payload.message ?? "AI 流式调用失败");
+        streamError = createClientError(payload, "AI 流式调用失败", response.status);
       }
     };
     while (true) {
@@ -8895,7 +9244,7 @@ async function streamChat(body) {
     if (buffer.trim()) await consume(buffer);
     await typewriter.finish();
     if (streamError) throw streamError;
-    return { content: streamedText, message, metadata: generatedMetadata };
+    return { content: streamedText, message, metadata: generatedMetadata, messageId: persistedMessageId, createdAt: persistedMessageCreatedAt, conversationTitle };
   } catch (error) {
     typewriter.reveal();
     message.classList.remove("is-streaming");
@@ -8910,8 +9259,12 @@ async function streamChat(body) {
 
 function appendMessage(role, text, citations = [], createdAt = null, metadata = {}, messageId = null) {
   const message = document.createElement("div");
-  message.className = role === "user" ? "user-message" : "assistant-message";
-  message.innerHTML = `<div class="message-body">${renderMarkdown(text)}</div>`;
+  const isFailure = role === "assistant" && text.startsWith("调用失败：");
+  message.className = `${role === "user" ? "user-message" : "assistant-message"}${isFailure ? " is-error" : ""}`;
+  const messageBody = isFailure
+    ? `<p class="ai-error-text">${esc(text)}</p>`
+    : renderMarkdown(text);
+  message.innerHTML = `<div class="message-body">${messageBody}</div>`;
   attachMessageHeading(message, role === "user" ? "作者" : "助手", createdAt ?? undefined);
   if (citations.length) {
     const references = document.createElement("div");
@@ -10270,6 +10623,7 @@ document.addEventListener("pointerdown", (event) => {
   if (!event.target.closest("#line-citation-menu")) closeLineCitationMenu();
   if (!event.target.closest("#markdown-table-menu")) closeMarkdownTableMenu();
   if (!event.target.closest(".prompt-composer")) hideAiMentionMenu();
+  if (!event.target.closest("#ai-context-meter") && !event.target.closest("#ai-context-popover")) setAiContextDistributionVisible(false);
   if (!event.target.closest("#account-button") && !event.target.closest("#account-menu")) {
     $("#account-menu").classList.add("hidden");
     $("#account-button").setAttribute("aria-expanded", "false");
@@ -10291,6 +10645,7 @@ document.addEventListener("keydown", (event) => {
     closeLineCitationMenu();
     closeMarkdownTableMenu(true);
     hideAiMentionMenu();
+    setAiContextDistributionVisible(false);
   }
 });
 document.addEventListener("keydown", (event) => {
@@ -10300,6 +10655,10 @@ document.addEventListener("keydown", (event) => {
   if (event.repeat) return;
   openSearchDialog().catch((error) => toast(error.message, "error"));
 }, { capture: true });
+$("#ai-context-meter").addEventListener("click", () => {
+  setAiContextDistributionVisible($("#ai-context-popover").classList.contains("hidden"));
+});
+$("#ai-context-popover-close").addEventListener("click", () => setAiContextDistributionVisible(false));
 $("#ai-send").addEventListener("click", sendAi);
 $("#ai-new-conversation").addEventListener("click", async () => {
   const button = $("#ai-new-conversation");