@musnows/scriverse 0.3.3 → 0.3.4

package/dist/public/app.js

@@ -15,6 +15,7 @@ import { buildCharacterDetails, buildCharacterSections, buildCharacterState, cha
 import { characterVersionSourceLabel, describeCharacterVersionChanges } from "/character-version.js?v=20260713-character-history";
 import { VERSIONED_ENTITY_LABELS, entityVersionSnapshotSummary, entityVersionSourceLabel } from "/entity-version.js?v=20260714-all-knowledge-history";
 import { parsePageRoute, serializePageRoute } from "/page-route.js?v=20260714-refresh-restore";
+import { splitRelationshipKeywordInput, splitRelationshipKeywords, uniqueRelationshipKeywords } from "/relationship-keywords.js?v=20260720-relationship-keyword-chips";
 import { tokenizeVisibleSpaces } from "/whitespace-visualization.js?v=20260718-visible-whitespace";
 
 const state = {
@@ -459,6 +460,8 @@ let aiMentionRange = null;
 let settingsReturnContext = null;
 let characterEditorItem = null;
 let characterEditorVersions = [];
+let characterEditorRelationships = [];
+let characterEditorRelationshipsLoading = false;
 let entityHistoryContext = null;
 
 function setModuleNavExpanded(expanded) {
@@ -1393,7 +1396,19 @@ function selectAuthMode(mode) {
   $("#login-form").classList.toggle("hidden", !login);
   $("#register-form").classList.toggle("hidden", login);
   $("#auth-error").textContent = "";
-  refreshAuthCaptcha(login ? "login" : "register").catch(() => {});
+  // 验证码默认不加载，等用户点击“点击显示验证码”按钮后再请求，避免首屏空白等待
+  resetAuthCaptcha(login ? "login" : "register");
+}
+
+function resetAuthCaptcha(target = "login") {
+  const prefix = target === "register" ? "register" : "login";
+  const image = $(`#${prefix}-captcha-image`);
+  image.hidden = true;
+  image.removeAttribute("src");
+  $(`#${prefix}-captcha-placeholder`).hidden = false;
+  $(`#${prefix}-captcha-id`).value = "";
+  const answerInput = $(`#${prefix}-form`).querySelector('input[name="captchaAnswer"]');
+  if (answerInput) answerInput.value = "";
 }
 
 async function refreshAuthCaptcha(target = "login") {
@@ -1402,7 +1417,10 @@ async function refreshAuthCaptcha(target = "login") {
   const challenge = (await response.json()).data;
   const prefix = target === "register" ? "register" : "login";
   $(`#${prefix}-captcha-id`).value = challenge.captchaId;
-  $(`#${prefix}-captcha-image`).src = challenge.imageDataUrl;
+  const image = $(`#${prefix}-captcha-image`);
+  image.src = challenge.imageDataUrl;
+  image.hidden = false;
+  $(`#${prefix}-captcha-placeholder`).hidden = true;
   const answerInput = $(`#${prefix}-form`).querySelector('input[name="captchaAnswer"]');
   if (answerInput) answerInput.value = "";
 }
@@ -1434,7 +1452,9 @@ function applyAuthenticatedUser(session) {
   $("#account-menu-name").textContent = `${session.user.displayName} · @${session.user.username}`;
   $("#account-menu-role").textContent = session.user.role === "admin" ? "系统管理员" : "普通用户";
   $("#auth-view").classList.add("hidden");
-  document.body.classList.remove("auth-pending");
+  document.documentElement.classList.remove("login-route");
+  // 注意：auth-pending 由 initializePage 路由完成后才移除，
+  // 避免会话确认后、目标视图渲染前露出无内容的编辑器外壳
 }
 
 function applyPlatformUiSettings(settings) {
@@ -1451,13 +1471,18 @@ async function loadPlatformUiSettings() {
 }
 
 async function initializeAuthentication() {
+  const route = parsePageRoute(window.location.hash);
   const response = await fetch("/api/auth/session", { headers: { Accept: "application/json" } });
   if (!response.ok) throw new Error("无法读取登录状态");
   const session = (await response.json()).data;
   if (!session.authenticated) {
+    // 未登录时一律转到登录页路由；登录页本身则保持原样
+    if (route.view !== "login") window.history.replaceState(null, "", serializePageRoute({ view: "login" }));
     showAuth(session.setupRequired, session.registrationOpen === true);
     return false;
   }
+  // 已登录却停在登录页路由时，回到书架首页
+  if (route.view === "login") window.history.replaceState(null, "", serializePageRoute({ view: "shelf" }));
   applyAuthenticatedUser(session);
   await loadPlatformUiSettings();
   return true;
@@ -1664,6 +1689,7 @@ async function initializePage() {
       settingsReturnContext = restoredSettingsReturnContext(route);
     }
   } finally {
+    document.body.classList.remove("auth-pending");
     restoringPageRoute = false;
     replacePageRoute(currentPageRoute());
     scheduleFirstUseOnboarding();
@@ -2938,6 +2964,11 @@ function field(name, label, type = "text", value = "", options = []) {
     const values = Array.isArray(value) && value.length ? value : [""];
     return `<div class="form-field item-list-field"><span>${esc(label)}</span><div class="item-list-rows" data-item-list-rows data-name="${esc(name)}" data-label="${esc(label)}">${values.map((item) => `<div class="item-list-row"><input name="${esc(name)}" value="${esc(item)}" aria-label="${esc(label)}"><button type="button" data-item-list-remove aria-label="删除此条">删除</button></div>`).join("")}</div><button class="item-list-add" type="button" data-item-list-add>添加一条</button></div>`;
   }
+  if (type === "keyword-chips") {
+    const values = uniqueRelationshipKeywords(Array.isArray(value) ? value : []);
+    const chips = values.map((keyword) => `<span class="keyword-chip" data-keyword-chip><span>${esc(keyword)}</span><input type="hidden" name="${esc(name)}" value="${esc(keyword)}" data-keyword-value><button type="button" data-keyword-chip-remove aria-label="删除关键词：${esc(keyword)}">×</button></span>`).join("");
+    return `<div class="form-field keyword-chip-field" data-keyword-chips data-name="${esc(name)}"><span>${esc(label)}</span><div class="keyword-chip-editor" role="group" aria-label="${esc(label)}">${chips}<input type="text" data-keyword-input aria-label="${esc(label)}" placeholder="输入后按回车添加，逗号可批量添加" autocomplete="off"></div><small>输入关键词后按回车添加；也可用逗号一次添加多个。</small></div>`;
+  }
   if (type === "key-value-list") {
     const config = Array.isArray(options) ? {} : options;
     const keyName = config.keyName ?? "detailLabel";
@@ -3004,6 +3035,53 @@ function bindDynamicListControls(container) {
   };
 }
 
+function appendRelationshipKeywordChips(editor, values) {
+  const input = editor.querySelector("[data-keyword-input]");
+  if (!input) return;
+  const existing = new Set([...editor.querySelectorAll("[data-keyword-value]")].map((control) => String(control.value).toLocaleLowerCase("zh-CN")));
+  const name = editor.dataset.name || "keywords";
+  for (const keyword of uniqueRelationshipKeywords(values)) {
+    const key = keyword.toLocaleLowerCase("zh-CN");
+    if (existing.has(key)) continue;
+    existing.add(key);
+    input.insertAdjacentHTML("beforebegin", `<span class="keyword-chip" data-keyword-chip><span>${esc(keyword)}</span><input type="hidden" name="${esc(name)}" value="${esc(keyword)}" data-keyword-value><button type="button" data-keyword-chip-remove aria-label="删除关键词：${esc(keyword)}">×</button></span>`);
+  }
+}
+
+function commitRelationshipKeywordInput(editor) {
+  const input = editor.querySelector("[data-keyword-input]");
+  if (!input) return;
+  appendRelationshipKeywordChips(editor, splitRelationshipKeywords(input.value));
+  input.value = "";
+}
+
+function bindRelationshipKeywordControls(container) {
+  container.querySelectorAll("[data-keyword-chips]").forEach((editor) => {
+    const input = editor.querySelector("[data-keyword-input]");
+    if (!input) return;
+    input.addEventListener("keydown", (event) => {
+      if (event.isComposing || event.key !== "Enter") return;
+      event.preventDefault();
+      commitRelationshipKeywordInput(editor);
+    });
+    input.addEventListener("input", () => {
+      const { completed, remainder } = splitRelationshipKeywordInput(input.value);
+      if (!completed.length) return;
+      appendRelationshipKeywordChips(editor, completed);
+      input.value = remainder;
+    });
+    editor.addEventListener("click", (event) => {
+      const remove = event.target.closest("[data-keyword-chip-remove]");
+      if (!remove) return;
+      remove.closest("[data-keyword-chip]")?.remove();
+    });
+  });
+}
+
+function commitRelationshipKeywordInputs(container) {
+  container.querySelectorAll("[data-keyword-chips]").forEach(commitRelationshipKeywordInput);
+}
+
 function openDialog(title, fields, onSubmit, eyebrow = "新增", options = {}) {
   $("#dialog-title").textContent = title;
   $("#dialog-eyebrow").textContent = eyebrow;
@@ -3011,6 +3089,7 @@ function openDialog(title, fields, onSubmit, eyebrow = "新增", options = {}) {
   $("#dialog-submit").textContent = options.submitLabel ?? "保存";
   $("#form-dialog").classList.toggle("wide-dialog", Boolean(options.wide));
   bindDynamicListControls($("#dialog-fields"));
+  bindRelationshipKeywordControls($("#dialog-fields"));
   const form = $("#dynamic-form");
   form.onsubmit = async (event) => {
     if (event.submitter?.value === "cancel") return;
@@ -3018,6 +3097,7 @@ function openDialog(title, fields, onSubmit, eyebrow = "新增", options = {}) {
     const submit = $("#dialog-submit");
     submit.disabled = true;
     try {
+      commitRelationshipKeywordInputs(form);
       await onSubmit(new FormData(form));
       $("#form-dialog").close();
     } catch (error) {
@@ -3192,6 +3272,83 @@ function setCharacterHistoryVisible(visible) {
   $("#character-history-button").setAttribute("aria-expanded", String(visible));
 }
 
+const relationshipCategoryLabels = {
+  family: "亲属",
+  social: "社交",
+  emotional: "情感",
+  conflict: "冲突",
+  uncertain: "未确定"
+};
+
+function renderCharacterEditorRelationships() {
+  const host = $("#character-editor-relationships");
+  if (!host) return;
+  if (!characterEditorItem?.id) {
+    host.innerHTML = '<div class="character-editor-empty-field"><b>人物关系</b><span>保存人物档案后即可添加与其他人物的关系。</span></div>';
+    return;
+  }
+  if (characterEditorRelationshipsLoading) {
+    host.innerHTML = '<p class="character-relationship-status">正在读取人物关系……</p>';
+    return;
+  }
+  const characterId = String(characterEditorItem.id);
+  const nameOf = (id) => state.characters.find((character) => character.id === id)?.name ?? "未知角色";
+  const rows = characterEditorRelationships.map((relationship) => {
+    const isSource = relationship.fromCharacterId === characterId;
+    const otherCharacterId = isSource ? relationship.toCharacterId : relationship.fromCharacterId;
+    const direction = relationship.directed ? (isSource ? "→" : "←") : "↔";
+    const category = relationshipCategoryLabels[relationship.category] ?? relationship.category;
+    const relationLabel = [category, relationship.subtype].filter(Boolean).join(" · ") || "未细分";
+    const keywords = Array.isArray(relationship.keywords) ? relationship.keywords : [];
+    return `<article class="character-relationship-row">
+      <div class="character-relationship-heading"><div><strong>${esc(nameOf(otherCharacterId))}</strong><span>${direction} ${esc(relationLabel)}</span></div>${canEditWork() ? `<button type="button" data-character-relationship-edit="${esc(relationship.id)}">编辑关系</button>` : ""}</div>
+      <div class="character-relationship-keywords"><small>关系关键词</small><div>${keywords.map((keyword) => `<span class="pill relationship-keyword">${esc(keyword)}</span>`).join("") || '<span class="character-relationship-empty-keywords">未填写关键词</span>'}</div></div>
+    </article>`;
+  }).join("");
+  host.innerHTML = `<div class="character-relationship-toolbar"><p>与 ${esc(characterEditorItem.name)} 有关的其他人物及关系关键词。</p>${canEditWork() ? '<button type="button" class="ghost-button" data-character-relationship-create>新建关系</button>' : ""}</div>${rows || '<p class="character-relationship-status">暂未记录与其他人物的关系。</p>'}`;
+  host.querySelectorAll("[data-character-relationship-edit]").forEach((button) => button.addEventListener("click", () => {
+    const relationship = characterEditorRelationships.find((item) => item.id === button.dataset.characterRelationshipEdit);
+    if (relationship) void openRelationshipDialog(relationship, { characterId });
+  }));
+  host.querySelector("[data-character-relationship-create]")?.addEventListener("click", () => void openRelationshipDialog(null, { characterId }));
+}
+
+async function loadCharacterEditorRelationships(characterId) {
+  const workId = state.work?.id;
+  if (!workId || characterEditorItem?.id !== characterId) return;
+  characterEditorRelationshipsLoading = true;
+  renderCharacterEditorRelationships();
+  let loaded = false;
+  try {
+    const [characters, relationships] = await Promise.all([
+      api(`/api/works/${workId}/characters`),
+      api(`/api/works/${workId}/relationships`)
+    ]);
+    if (state.work?.id !== workId || characterEditorItem?.id !== characterId) return;
+    state.characters = characters;
+    characterEditorRelationships = relationships.filter((relationship) => relationship.fromCharacterId === characterId || relationship.toCharacterId === characterId);
+    loaded = true;
+  } catch (error) {
+    if (state.work?.id === workId && characterEditorItem?.id === characterId) {
+      $("#character-editor-relationships").innerHTML = `<p class="character-relationship-status">关系载入失败：${esc(error.message)}</p>`;
+    }
+  } finally {
+    if (state.work?.id === workId && characterEditorItem?.id === characterId) {
+      characterEditorRelationshipsLoading = false;
+      if (loaded) renderCharacterEditorRelationships();
+    }
+  }
+}
+
+async function refreshRelationshipSurfaces(characterId = null) {
+  const tasks = [];
+  if (state.module === "relationships") tasks.push(renderRelationships());
+  if (characterId && $("#character-editor-dialog").open && characterEditorItem?.id === characterId) {
+    tasks.push(loadCharacterEditorRelationships(characterId));
+  }
+  await Promise.all(tasks);
+}
+
 function renderCharacterEditorFields(item) {
   const raceOptions = [["", "未指定"], ...state.races.map((race) => [race.id, race.name])];
   const organizationOptions = state.organizations.map((organization) => [organization.id, organization.name]);
@@ -3228,11 +3385,14 @@ function renderCharacterEditorFields(item) {
         addLabel: "添加状态"
       }) +
       '<p class="character-editor-field-help">未修改的数字、布尔值、数组和对象会保留原有数据类型；被修改的值会按文本保存。</p>' +
-      field("lockedFields", "锁定字段", "item-list", item?.lockedFields ?? []))
+      field("lockedFields", "锁定字段", "item-list", item?.lockedFields ?? [])),
+    characterEditorSection("relationships", "人物关系", "查看与其他人物的关系及关键词；编辑入口与“关系”面板共用同一份关系数据。",
+      '<div id="character-editor-relationships" class="character-editor-relationships-field"></div>')
   ].join("");
   const name = $("#character-editor-fields [name='name']");
   if (name) name.required = true;
   bindDynamicListControls($("#character-editor-fields"));
+  renderCharacterEditorRelationships();
   activateCharacterEditorTab("basic");
 }
 
@@ -3336,6 +3496,8 @@ async function openCharacterDialog(item) {
   ]);
   characterEditorItem = item ?? null;
   characterEditorVersions = [];
+  characterEditorRelationships = [];
+  characterEditorRelationshipsLoading = Boolean(item);
   $("#character-editor-eyebrow").textContent = item ? "人物主档案" : "建立人物档案";
   $("#character-editor-title").textContent = item?.name || "新建角色";
   $("#character-editor-version").textContent = item ? `v${item.versionNo}` : "新档案";
@@ -3354,6 +3516,9 @@ async function openCharacterDialog(item) {
   document.querySelectorAll("[data-character-editor-tab]").forEach((button) => {
     button.onclick = () => activateCharacterEditorTab(button.dataset.characterEditorTab);
   });
+  const relationshipTab = document.querySelector("[data-character-editor-tab='relationships']");
+  relationshipTab.disabled = !item;
+  relationshipTab.title = item ? "查看和编辑人物关系" : "创建人物档案后即可维护人物关系";
   const dialog = $("#character-editor-dialog");
   const form = $("#character-editor-form");
   form.onsubmit = async (event) => {
@@ -3378,6 +3543,7 @@ async function openCharacterDialog(item) {
     }
   };
   dialog.showModal();
+  if (item) void loadCharacterEditorRelationships(item.id);
 }
 
 async function openRaceDialog(item) {
@@ -3502,14 +3668,16 @@ function openTimelineSplitDialog(item) {
   }, "原证据同步保留");
 }
 
-async function openRelationshipDialog(item) {
+async function openRelationshipDialog(item, options = {}) {
   state.characters = await api(`/api/works/${state.work.id}/characters`);
   if (state.characters.length < 2) return toast("至少需要两个角色才能创建关系", "error");
-  const options = state.characters.map((item) => [item.id, item.name]);
-  openDialog(item ? "编辑人物关系" : "新建人物关系", field("from", "起点人物", "select", item?.fromCharacterId ?? options[0][0], options) + field("to", "终点人物", "select", item?.toCharacterId ?? options[1][0], options) + field("category", "关系大类", "select", item?.category ?? "social", [["family", "亲属"], ["social", "社交"], ["emotional", "情感"], ["conflict", "冲突"], ["uncertain", "未确定"]]) + field("subtype", "关系子类", "text", item?.subtype) + field("keywords", "关系关键词（用逗号分隔）", "text", item?.keywords?.join("、") ?? "") + field("confidence", "置信度（0-1）", "number", item?.confidence ?? "1") + field("directed", "有方向性", "checkbox", item?.directed ?? false), async (form) => {
-    const keywords = String(form.get("keywords") ?? "").split(/[,，、；;]/u).map((value) => value.trim()).filter(Boolean);
+  const characterOptions = state.characters.map((item) => [item.id, item.name]);
+  const defaultFrom = options.characterId && state.characters.some((character) => character.id === options.characterId) ? options.characterId : characterOptions[0][0];
+  const defaultTo = characterOptions.find(([id]) => id !== defaultFrom)?.[0] ?? characterOptions[1][0];
+  openDialog(item ? "编辑人物关系" : "新建人物关系", field("from", "起点人物", "select", item?.fromCharacterId ?? defaultFrom, characterOptions) + field("to", "终点人物", "select", item?.toCharacterId ?? defaultTo, characterOptions) + field("category", "关系大类", "select", item?.category ?? "social", [["family", "亲属"], ["social", "社交"], ["emotional", "情感"], ["conflict", "冲突"], ["uncertain", "未确定"]]) + field("subtype", "关系子类", "text", item?.subtype) + field("keywords", "关系关键词", "keyword-chips", item?.keywords ?? []) + field("confidence", "置信度（0-1）", "number", item?.confidence ?? "1") + field("directed", "有方向性", "checkbox", item?.directed ?? false), async (form) => {
+    const keywords = uniqueRelationshipKeywords(form.getAll("keywords").map(String));
     await api(item ? `/api/relationships/${item.id}` : `/api/works/${state.work.id}/relationships`, { method: item ? "PATCH" : "POST", body: { fromCharacterId: form.get("from"), toCharacterId: form.get("to"), category: form.get("category"), subtype: form.get("subtype"), keywords, confidence: Number(form.get("confidence")), directed: form.get("directed") === "on", confirmationStatus: item?.confirmationStatus ?? "confirmed" } });
-    await renderRelationships();
+    await refreshRelationshipSurfaces(options.characterId ?? null);
   }, item ? "关系档案" : "人工确认关系");
 }
 
@@ -4038,7 +4206,8 @@ $("#login-form").addEventListener("submit", async (event) => {
     window.location.reload();
   } catch (error) {
     $("#auth-error").textContent = error.message;
-    refreshAuthCaptcha("login").catch(() => {});
+    // 仅在验证码已显示时自动换一张，未加载过则保持默认隐藏状态
+    if (!$("#login-captcha-image").hidden) refreshAuthCaptcha("login").catch(() => {});
   }
 });
 $("#register-form").addEventListener("submit", async (event) => {
@@ -4064,7 +4233,8 @@ $("#register-form").addEventListener("submit", async (event) => {
     window.location.reload();
   } catch (error) {
     $("#auth-error").textContent = error.message;
-    refreshAuthCaptcha("register").catch(() => {});
+    // 仅在验证码已显示时自动换一张，未加载过则保持默认隐藏状态
+    if (!$("#register-captcha-image").hidden) refreshAuthCaptcha("register").catch(() => {});
   }
 });
 $("#settings-return").addEventListener("click", () => returnFromSettings().catch((error) => toast(error.message, "error")));

package/dist/public/index.html

@@ -6,13 +6,13 @@
     <meta name="description" content="面向长篇小说创作的 AI 协作工作台">
     <meta name="theme-color" content="#8b3d2c">
     <title>叙界 · 小说 AI 创作工作台</title>
-    <script src="/theme-init.js?v=20260713-dark-mode"></script>
+    <script src="/theme-init.js?v=20260720-route-skeleton"></script>
     <link rel="icon" href="/icon.svg?v=20260712" type="image/svg+xml">
     <link rel="manifest" href="/site.webmanifest">
-    <link rel="stylesheet" href="/styles.css?v=20260719-registration-disabled">
+    <link rel="stylesheet" href="/styles.css?v=20260720-captcha-lazy-load">
   </head>
   <body class="auth-pending">
-    <section id="auth-view" class="auth-view" aria-labelledby="auth-title">
+    <section id="auth-view" class="auth-view hidden" aria-labelledby="auth-title">
       <div class="auth-card">
         <div class="auth-brand"><span class="brand-mark">叙</span><div><strong>叙界</strong><small>小说 AI 创作工作台</small></div></div>
         <span class="eyebrow">账户与作品空间</span>
@@ -28,11 +28,12 @@
           <div class="auth-captcha">
             <label>验证码<input name="captchaAnswer" autocomplete="off" inputmode="text" maxlength="8" spellcheck="false" required aria-describedby="login-captcha-hint"></label>
             <button id="login-captcha-refresh" class="auth-captcha-image" type="button" aria-label="刷新验证码" title="刷新验证码">
-              <img id="login-captcha-image" alt="验证码图片">
+              <img id="login-captcha-image" alt="验证码图片" hidden>
+              <span id="login-captcha-placeholder" class="auth-captcha-placeholder">点击显示验证码</span>
             </button>
             <input id="login-captcha-id" name="captchaId" type="hidden" required>
           </div>
-          <p id="login-captcha-hint" class="auth-captcha-hint">点击图片可刷新</p>
+          <p id="login-captcha-hint" class="auth-captcha-hint">点击按钮显示验证码，显示后点击图片可刷新</p>
           <button class="primary-button" type="submit">登录</button>
         </form>
         <form id="register-form" class="auth-form hidden">
@@ -42,11 +43,12 @@
           <div class="auth-captcha">
             <label>验证码<input name="captchaAnswer" autocomplete="off" inputmode="text" maxlength="8" spellcheck="false" required aria-describedby="register-captcha-hint"></label>
             <button id="register-captcha-refresh" class="auth-captcha-image" type="button" aria-label="刷新验证码" title="刷新验证码">
-              <img id="register-captcha-image" alt="验证码图片">
+              <img id="register-captcha-image" alt="验证码图片" hidden>
+              <span id="register-captcha-placeholder" class="auth-captcha-placeholder">点击显示验证码</span>
             </button>
             <input id="register-captcha-id" name="captchaId" type="hidden" required>
           </div>
-          <p id="register-captcha-hint" class="auth-captcha-hint">点击图片可刷新</p>
+          <p id="register-captcha-hint" class="auth-captcha-hint">点击按钮显示验证码，显示后点击图片可刷新</p>
           <small>至少 10 个字符。系统中的第一个注册用户会自动成为管理员。</small>
           <button class="primary-button" type="submit">创建账户</button>
         </form>
@@ -332,6 +334,7 @@
             <button type="button" role="tab" data-character-editor-tab="profile" aria-selected="false">人物档案<small>简介、身份与动机</small></button>
             <button type="button" role="tab" data-character-editor-tab="settings" aria-selected="false">扩展设定<small>属性与长篇章节</small></button>
             <button type="button" role="tab" data-character-editor-tab="state" aria-selected="false">状态与约束<small>当前状态与锁定项</small></button>
+            <button type="button" role="tab" data-character-editor-tab="relationships" aria-selected="false">人物关系<small>关联人物与关系关键词</small></button>
           </nav>
           <main id="character-editor-fields" class="character-editor-fields"></main>
           <aside id="character-history-panel" class="character-history-panel hidden" aria-label="人物版本历史">
@@ -542,6 +545,7 @@
       </section>
     </dialog>
 
-    <script type="module" src="/app.js?v=20260719-registration-opt-in"></script>
+    <div id="auth-loading" class="auth-loading" role="status" aria-label="正在载入工作台"></div>
+    <script type="module" src="/app.js?v=20260720-captcha-lazy-load"></script>
   </body>
 </html>

package/dist/public/page-route.js

@@ -31,7 +31,9 @@ export function serializePageRoute(route = {}) {
   const view = String(route.view ?? "shelf");
   const workId = String(route.workId ?? "").trim();
 
-  if (view === "editor" && workId) {
+  if (view === "login") {
+    params.set("view", "login");
+  } else if (view === "editor" && workId) {
     params.set("view", "editor");
     params.set("work", workId);
     if (route.chapterId) params.set("chapter", String(route.chapterId));
@@ -58,6 +60,8 @@ export function parsePageRoute(hash = "") {
   const view = value(params, "view");
   const workId = value(params, "work");
 
+  if (view === "login") return { view: "login" };
+
   if (view === "editor" && workId) {
     const chapterId = value(params, "chapter");
     return { view, workId, chapterId: chapterId || null };

package/dist/public/relationship-keywords.js

@@ -0,0 +1,34 @@
+const relationshipKeywordSeparator = /[,，、；;\n]/u;
+
+function normalizeRelationshipKeyword(value) {
+  return String(value ?? "").normalize("NFKC").trim().replace(/\s+/gu, " ");
+}
+
+export function splitRelationshipKeywords(value) {
+  return String(value ?? "")
+    .split(relationshipKeywordSeparator)
+    .map(normalizeRelationshipKeyword)
+    .filter(Boolean);
+}
+
+export function uniqueRelationshipKeywords(values) {
+  const keywords = [];
+  const seen = new Set();
+  for (const value of values) {
+    for (const keyword of splitRelationshipKeywords(value)) {
+      const key = keyword.toLocaleLowerCase("zh-CN");
+      if (seen.has(key)) continue;
+      seen.add(key);
+      keywords.push(keyword);
+    }
+  }
+  return keywords;
+}
+
+export function splitRelationshipKeywordInput(value) {
+  const parts = String(value ?? "").split(relationshipKeywordSeparator);
+  return {
+    completed: uniqueRelationshipKeywords(parts.slice(0, -1)),
+    remainder: parts.at(-1) ?? ""
+  };
+}

package/dist/public/styles.css

@@ -31,7 +31,26 @@
   background: var(--paper);
 }
 
-.auth-pending .app-shell { visibility: hidden; }
+.auth-pending .app-shell { pointer-events: none; user-select: none; }
+.auth-loading { display: none; }
+.auth-pending .auth-loading { position: fixed; inset: 0; z-index: 900; display: grid; place-items: center; pointer-events: none; }
+.auth-loading::before { content: ""; width: 32px; height: 32px; border: 3px solid color-mix(in srgb, var(--accent) 25%, transparent); border-top-color: var(--accent); border-radius: 50%; animation: auth-loading-spin .8s linear infinite; }
+@keyframes auth-loading-spin { to { transform: rotate(360deg); } }
+@media (prefers-reduced-motion: reduce) { .auth-loading::before { animation-duration: 2s; } }
+.login-route .auth-view.hidden { display: grid !important; }
+.login-route .auth-loading { display: none; }
+/* 会话恢复期间按 data-pending-view 预显示目标视图的骨架（自然 display 与各视图定义一致） */
+[data-pending-view="shelf"] .auth-pending #shelf-view.hidden,
+[data-pending-view="settings"] .auth-pending #settings-hub-view.hidden,
+[data-pending-view="platform-ai"] .auth-pending #platform-ai-view.hidden,
+[data-pending-view="module"] .auth-pending #module-view.hidden { display: block !important; }
+[data-pending-view="welcome"] .auth-pending #welcome-view.hidden,
+[data-pending-view="editor"] .auth-pending #editor-view.hidden { display: grid !important; }
+/* 书架/设置/平台 AI 路由的骨架使用整宽布局，与 shelf-mode 一致 */
+.pending-shelf-mode .auth-pending .app-shell { grid-template-columns: 1fr; }
+.pending-shelf-mode .auth-pending .topbar { grid-template-columns: 280px 1fr auto; }
+.pending-shelf-mode .auth-pending .left-panel, .pending-shelf-mode .auth-pending .ai-panel { display: none; }
+.pending-shelf-mode .auth-pending .main-panel { grid-column: 1 / -1; }
 .auth-view { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; align-content: safe center; padding: 24px; overflow-y: auto; overscroll-behavior: contain; background: radial-gradient(circle at 18% 16%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 34%), var(--paper); }
 .auth-view.hidden { display: none; }
 .auth-card { box-sizing: border-box; width: min(440px, 100%); padding: 34px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: var(--shadow); }
@@ -163,6 +182,8 @@
   cursor: pointer;
 }
 .auth-captcha-image img { display: block; width: 148px; height: 48px; border-radius: 6px; }
+.auth-captcha-image img[hidden], .auth-captcha-placeholder[hidden] { display: none; }
+.auth-captcha-placeholder { color: var(--muted); font-size: 13px; padding: 0 14px; white-space: nowrap; }
 .auth-captcha-hint { margin: -8px 0 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
 .auth-error { min-height: 20px; margin: 14px 0 0 !important; color: var(--accent-dark) !important; }
 
@@ -471,6 +492,8 @@ body.work-viewer-mode #merge-events,
 body.work-viewer-mode [data-edit-foreshadow],
 body.work-viewer-mode [data-edit-outline],
 body.work-viewer-mode [data-edit-relationship],
+body.work-viewer-mode [data-character-relationship-edit],
+body.work-viewer-mode [data-character-relationship-create],
 body.work-viewer-mode [data-review-id],
 body.work-viewer-mode .task-auto-run-panel,
 body.work-viewer-mode [data-run-task],
@@ -1282,6 +1305,14 @@ select:focus, input:focus, textarea:focus { border-color: #a77768; box-shadow: 0
 .item-list-row button, .item-list-add { border: 1px solid var(--line); border-radius: 4px; background: var(--panel); color: var(--muted); font-size: 10px; }
 .item-list-row button { padding: 0 10px; }
 .item-list-add { justify-self: start; padding: 7px 11px; }
+.keyword-chip-field > small { color: var(--muted); font-size: 10px; line-height: 1.5; }
+.keyword-chip-editor { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-height: 42px; padding: 6px 8px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); }
+.keyword-chip-editor:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 14%, transparent); }
+.keyword-chip-editor > input[data-keyword-input] { flex: 1 1 160px; width: auto; min-width: 140px; padding: 6px 3px; border: 0; background: transparent; color: var(--ink); outline: none; }
+.keyword-chip-editor > input[data-keyword-input]:focus { border: 0; box-shadow: none; }
+.keyword-chip { display: inline-flex; align-items: center; gap: 5px; min-height: 28px; padding: 3px 5px 3px 10px; border: 1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); border-radius: 16px; background: var(--paper-deep); color: var(--ink); font-size: 11px; line-height: 1.3; }
+.keyword-chip button { display: inline-grid; place-items: center; width: 20px; height: 20px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--muted); font-size: 15px; line-height: 1; }
+.keyword-chip button:hover, .keyword-chip button:focus-visible { background: color-mix(in srgb, var(--accent) 14%, transparent); color: var(--accent-dark); outline: none; }
 .structured-list-field > small { color: var(--muted); font-size: 9px; line-height: 1.5; }
 .structured-list-rows { display: grid; gap: 9px; }
 .structured-list-row { display: grid; gap: 7px; padding: 10px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface-soft); }
@@ -1338,6 +1369,22 @@ select:focus, input:focus, textarea:focus { border-color: #a77768; box-shadow: 0
 .character-editor-section-fields .section-list-row textarea { min-height: 180px; }
 .character-editor-section-fields .member-chip { position: relative; display: inline-flex; width: auto; cursor: pointer; }
 .character-editor-section-fields .item-list-row button, .character-editor-section-fields .structured-list-row button { min-width: 54px; }
+.character-editor-relationships-field { display: grid; grid-column: 1 / -1; gap: 12px; }
+.character-relationship-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
+.character-relationship-toolbar p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
+.character-relationship-toolbar .ghost-button { flex: 0 0 auto; min-height: 32px; }
+.character-relationship-row { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 5px; background: var(--surface-soft); }
+.character-relationship-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
+.character-relationship-heading > div { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; min-width: 0; }
+.character-relationship-heading strong { font-size: 14px; }
+.character-relationship-heading span { color: var(--muted); font-size: 10px; }
+.character-relationship-heading button { flex: 0 0 auto; padding: 6px 9px; border: 1px solid var(--line); border-radius: 4px; background: transparent; color: var(--muted); font-size: 10px; }
+.character-relationship-heading button:hover { border-color: var(--accent); color: var(--accent-dark); }
+.character-relationship-keywords { display: grid; gap: 6px; }
+.character-relationship-keywords > small { color: var(--muted); font-size: 9px; }
+.character-relationship-keywords > div { display: flex; flex-wrap: wrap; gap: 5px; }
+.character-relationship-empty-keywords, .character-relationship-status { color: var(--muted); font-size: 10px; }
+.character-relationship-status { margin: 0; padding: 18px 12px; border: 1px dashed var(--line); border-radius: 4px; text-align: center; }
 .character-editor-empty-field { display: grid; align-content: start; gap: 7px; color: var(--muted); font-size: 11px; }
 .character-editor-empty-field span { padding: 11px; border: 1px dashed var(--line); border-radius: 4px; font-size: 10px; }
 .character-editor-field-help { margin: -8px 0 0; color: var(--muted); font-size: 9px; }

package/dist/public/theme-init.js

@@ -5,4 +5,19 @@
   const theme = storedTheme === "dark" || storedTheme === "light" ? storedTheme : prefersDark ? "dark" : "light";
   document.documentElement.dataset.theme = theme;
   document.documentElement.style.colorScheme = theme;
+  // 登录页路由首帧直接显示登录卡片，避免出现"骨架屏 → 登录页"的跳变
+  const routeParams = new URLSearchParams(window.location.hash.replace(/^#/, ""));
+  const routeView = routeParams.get("view") ?? "";
+  if (routeView === "login") {
+    document.documentElement.classList.add("login-route");
+  } else {
+    // 会话恢复期间按目标路由预显示对应视图的骨架屏
+    const pendingView = ["editor", "module", "welcome"].includes(routeView) && routeParams.get("work")
+      ? routeView
+      : ["settings", "platform-ai"].includes(routeView) ? routeView : "shelf";
+    document.documentElement.dataset.pendingView = pendingView;
+    if (["shelf", "settings", "platform-ai"].includes(pendingView)) {
+      document.documentElement.classList.add("pending-shelf-mode");
+    }
+  }
 })();

package/dist/store.js

@@ -531,7 +531,7 @@ export class Store {
             return {
                 fileVersionId: restorePointId,
                 restoredFrom: fileVersionId,
-                tree: this.getWorkTree(workId)
+                tree: this.getWorkDirectory(workId)
             };
         });
     }
@@ -539,7 +539,7 @@ export class Store {
         this.getWork(workId);
         let result = {};
         this.db.transaction(() => { result = this.importNovelInTransaction(workId, fileName, fileType, parsed); });
-        return result;
+        return { ...result, tree: this.getWorkDirectory(workId) };
     }
     createImportedWork(input, fileName, fileType, parsed) {
         return this.db.transaction(() => {
@@ -573,8 +573,7 @@ export class Store {
             fileVersionId,
             warnings: parsed.warnings,
             wordCount: parsed.wordCount,
-            paragraphCount: parsed.paragraphCount,
-            tree: this.getWorkTree(workId)
+            paragraphCount: parsed.paragraphCount
         };
     }
     createVolume(workId, input) {