@waterwx/dsh-novel-forge 1.7.0 → 1.7.2

package/lib/types/client/api.d.ts

@@ -100,6 +100,8 @@ export declare class NovelApi {
     /** 角色库：AI 提炼 / 采纳 / 更新 / 删除。 */
     imageTest(req: import('../protocol.ts').ImageTestRequest): Promise<import('../protocol.ts').ImageTestResponse>;
     roles(req: import('../protocol.ts').RolesRequest): Promise<import('../protocol.ts').RolesResponse>;
+    /** 漫剧角色库：从分镜提名 / 建卡 / 更新 / 删除 / 形象锚点 / 精修提示词。 */
+    mangaRoles(req: import('../protocol.ts').MangaRolesRequest): Promise<import('../protocol.ts').MangaRolesResponse>;
     /** 场景库：AI 提炼 / 采纳 / 更新 / 删除 / 图集。 */
     scenes(req: import('../protocol.ts').ScenesRequest): Promise<import('../protocol.ts').ScenesResponse>;
     /** 视觉世界观规则：提炼 / 保存。 */

package/lib/types/client/locales.d.ts

@@ -153,7 +153,6 @@ export declare const zh: {
     readonly 'settings.reasoning.max': "max · 最高思考（质检/推演）";
     readonly 'settings.theme': "主题";
     readonly 'settings.themeLiquid': "iOS 液态玻璃（绿）";
-    readonly 'settings.themeClassic': "经典毛玻璃（蓝）";
     readonly 'settings.themeNeumorph': "新拟物（双阴影）";
     readonly 'settings.themeHint': "存于浏览器本地，即时生效";
     readonly 'settings.chapterChars': "每章目标字数";

package/lib/types/client/panel/FlowGuide.d.ts

@@ -0,0 +1,21 @@
+/**
+ * 漫剧工作台·全流程步骤条（唯一导航，方案X）：
+ * ①创建方案 → ②视觉规则 → ③剧情骨架 → ④分镜表 → ⑤导入角色 → ⑥角色定妆 → ⑦视频提示词 → ⑧场景库 → ⑨导出使用。
+ * 每个步骤对应一个独立页面主体；完成度自动判定（读 project 现有字段）。
+ */
+import type { ProjectState } from '../../protocol.ts';
+/** 步骤 → 页面主体的一一对应目标。 */
+export type FlowTarget = 'plan' | 'rules' | 'skeleton' | 'table' | 'import' | 'makeup' | 'prompts' | 'scenes' | 'export';
+export interface FlowStep {
+    no: number;
+    label: string;
+    hint: string;
+    done: boolean;
+    target: FlowTarget;
+}
+/** 依据 project 数据计算 9 步完成度（与存储顺序无关，按生产顺序排列）。 */
+export declare function computeFlowSteps(project: ProjectState | null): FlowStep[];
+export declare function FlowGuide({ project, onNavigate, }: {
+    project: ProjectState | null;
+    onNavigate: (target: FlowTarget) => void;
+}): import("react").JSX.Element;

package/lib/types/client/panel/MangaRoleLibrary.d.ts

@@ -0,0 +1,18 @@
+import type { NovelApi } from '../api.ts';
+import type { ImageModelConfig, ProjectState } from '../../protocol.ts';
+export declare function MangaRoleLibrary({ api, project, refresh, styleId, filterId, imageApiEnabled, imageModels, focus, showCards, onProgress, }: {
+    api: NovelApi;
+    project: ProjectState | null;
+    refresh: () => void | Promise<void>;
+    styleId?: string;
+    filterId?: string;
+    /** 是否启用生图（豆包等出定妆图）。 */
+    imageApiEnabled?: boolean;
+    /** 生图模型库（出定妆图时可选择用哪条）。 */
+    imageModels?: ImageModelConfig[];
+    /** 步骤页聚焦：import=展开并滚动到导入区；cards=滚动到已建漫剧卡列表。 */
+    focus?: 'import' | 'cards';
+    /** 是否显示「已建漫剧卡」列表（第⑤步导入页可隐藏，只留导入区）。 */
+    showCards?: boolean;
+    onProgress?: (text: string, kind?: 'info' | 'done' | 'error') => void;
+}): import("react").JSX.Element;

package/lib/types/client/panel/MangaWorkspace.d.ts

@@ -6,9 +6,9 @@ export declare function MangaWorkspace({ api, project, chapters, onProjectChange
     chapters: ChapterPlan[];
     /** 方案/资产变更已持久化后触发（刷新项目）。 */
     onProjectChanged?: () => void | Promise<void>;
-    /** 是否启用生图。 */
+    /** 是否启用生图（漫剧卡出定妆图）。 */
     imageApiEnabled?: boolean;
-    /** 生图模型库（AI 生图可选模型）。 */
+    /** 生图模型库（出定妆图时可选择模型）。 */
     imageModels?: ImageModelConfig[];
     /** 上报到「AI进度」控制台（漫剧工作台内所有 LLM/方案操作）。 */
     onProgress?: (text: string, kind?: 'info' | 'done' | 'error') => void;

package/lib/types/client/panel/StoryboardTab.d.ts

@@ -1,6 +1,6 @@
 import type { NovelApi } from '../api.ts';
 import type { ChapterPlan, ProjectState } from '../../protocol.ts';
-export declare function StoryboardTab({ api, project, chapters, onProjectChanged, styleId, filterId, onProgress, }: {
+export declare function StoryboardTab({ api, project, chapters, onProjectChanged, styleId, filterId, mode, onGoStep, onProgress, }: {
     api: NovelApi;
     project: ProjectState | null;
     chapters: ChapterPlan[];
@@ -10,6 +10,10 @@ export declare function StoryboardTab({ api, project, chapters, onProjectChanged
     styleId?: string;
     /** 可选滤镜风格 id。 */
     filterId?: string;
+    /** 页面模式：auto=按本章实际进度显示；skeleton/table/prompts=固定显示该步骤（前置不足显示提示，不降级）。 */
+    mode?: 'auto' | 'skeleton' | 'table' | 'prompts';
+    /** 「下一步」按钮回调（1=骨架→2=分镜表→3=提示词），供外层切步骤页。 */
+    onGoStep?: (n: 1 | 2 | 3) => void;
     /** 上报到「AI进度」控制台（分镜三步生成）。 */
     onProgress?: (text: string, kind?: 'info' | 'done' | 'error') => void;
 }): import("react").JSX.Element;

package/lib/types/engine.d.ts

@@ -12,7 +12,7 @@
  */
 export declare const COMPLIANCE_REDLINES: ReadonlyArray<string>;
 import type { Context } from '@deepseek-ai/cordis';
-import type { AuditIssue, AuthorReview, BreakdownResponse, ChapterPlan, Foreshadow, NovelConfig, OutlineCandidate, Plotline, PlotlineHealthReport, PlotlinePlan, ProjectState, ReviewReport, RoleRecord, RoleStatusCard, SceneCard, StoryBible, StoryboardSkeleton, StoryboardTable, StoryboardPrompt, Volume, WorldState } from './protocol.ts';
+import type { AuditIssue, AuthorReview, BreakdownResponse, ChapterPlan, Foreshadow, NovelConfig, OutlineCandidate, Plotline, PlotlineHealthReport, PlotlinePlan, ProjectState, ReviewReport, RoleRecord, RoleStatusCard, SceneCard, StoryBible, StoryboardSkeleton, StoryboardTable, StoryboardPrompt, MangaRoleCandidate, Volume, WorldState } from './protocol.ts';
 /** Project state file name inside the output dir. */
 export declare const PROJECT_FILE = "novel-project.json";
 /** Chapter output file name, e.g. 第001章_开篇.md */
@@ -109,16 +109,20 @@ export interface RoleVisualPrompt {
     /** 四类精修提示词（立绘/四视图/表情/细节，一次提炼直接产出）。 */
     promptKit?: RoleRecord['promptKit'];
 }
-/**
- * 为单个角色提炼「动漫形象描述词」：扫描该角色出场的已写章节正文，
- * 截取含外貌描写的段落，交给 LLM 提炼中文描述 + 英文绘图标签。
- */
+/** 小说角色库：提炼单个角色的形象锚点并写回角色卡。 */
 export declare function extractRoleVisual(ctx: Context, config: NovelConfig, project: ProjectState, outputDir: string, roleName: string, styleId?: string, filterId?: string): Promise<RoleVisualPrompt>;
+/** 漫剧角色卡：提炼形象锚点并写回漫剧卡（status → anchored）。 */
+export declare function extractMangaRoleVisual(ctx: Context, config: NovelConfig, project: ProjectState, outputDir: string, cardId: string, styleId?: string, filterId?: string): Promise<RoleVisualPrompt>;
+/** 小说角色库：角色四类生图提示词精修包（写回角色卡）。 */
+export declare function generateRolePromptKit(ctx: Context, config: NovelConfig, project: ProjectState, roleName: string, styleId?: string, filterId?: string): Promise<RoleRecord['promptKit']>;
+/** 漫剧角色卡：四类生图提示词精修包（写回漫剧卡，status → anchored）。 */
+export declare function generateMangaRolePromptKit(ctx: Context, config: NovelConfig, project: ProjectState, cardId: string, styleId?: string, filterId?: string): Promise<RoleRecord['promptKit']>;
 /**
- * 角色四类生图提示词精修包（promptKit）：以锚点 + 表情清单 + 视觉规则为输入，
- * LLM 产出 立绘/四视图/表情×N/细节 四套 zh+en 提示词（比前端拼装更精炼）。
+ * 漫剧角色库·提名（两段式）：从某章分镜的 characters 提名候选角色名 →
+ * 规则过滤（精确名 + 身份/简称匹配，短名单 ≤5）→ LLM 确认（是/否 + 选哪个，不做开放检索）→
+ * 返回带漫剧卡建议的候选（未匹配时给出「回小说库补提炼 / 漫剧直接创建」判定）。
  */
-export declare function generateRolePromptKit(ctx: Context, config: NovelConfig, project: ProjectState, roleName: string, styleId?: string, filterId?: string): Promise<RoleRecord['promptKit']>;
+export declare function nominateMangaRoles(ctx: Context, config: NovelConfig, project: ProjectState, outputDir: string, chapterNo: number): Promise<MangaRoleCandidate[]>;
 /** ✨ 从道藏/红线提炼「视觉世界观规则」：生图/生视频必须遵守的设定纠偏（如"商品=人，禁止常规超市商品"）。 */
 export declare function extractVisualRules(ctx: Context, config: NovelConfig, project: ProjectState): Promise<string[]>;
 /**
@@ -143,7 +147,10 @@ export declare function testImageEndpoint(baseURL: string, apiKey: string, model
     message?: string;
     modelFound?: boolean;
 }>;
+/** 小说角色库：生成角色定妆图并写回角色卡（imageUrl）。 */
 export declare function generateRoleReferenceImage(ctx: Context, config: NovelConfig, project: ProjectState, outputDir: string, name: string, style?: string, modelId?: string): Promise<string>;
+/** 漫剧角色卡：生成定妆图并写回漫剧卡（imageUrl）。 */
+export declare function generateMangaRoleReferenceImage(ctx: Context, config: NovelConfig, project: ProjectState, outputDir: string, cardId: string, style?: string, modelId?: string): Promise<string>;
 /** 🩺 剧情健康检查：基于已写章节数/各线状态/编年录，判断是否需要新线及添加时机。 */
 export declare function analyzePlotlineHealth(ctx: Context, config: NovelConfig, project: ProjectState): Promise<PlotlineHealthReport>;
 /** ✨ AI 剧情方案：基于健康检查结果设计下一阶段方向与建议新线。 */

package/lib/types/protocol.d.ts

@@ -43,6 +43,8 @@ export declare const NOVEL_API: {
     readonly bookshelfImportTextPreview: "/api/dsh-novel-forge/bookshelf/import-text/preview";
     /** 漫剧方案管理：create/remove/activate。 */
     readonly manhuaPlans: "/api/dsh-novel-forge/manhua/plans";
+    /** 漫剧角色库：从分镜提名（规则+LLM两段式）/ 建卡 / 更新 / 删除 / 形象锚点 / 精修提示词。 */
+    readonly mangaRoles: "/api/dsh-novel-forge/manga/roles";
     /** 分镜·编剧级：单章 → 剧情骨架（节拍链）。 */
     readonly storyboardSkeleton: "/api/dsh-novel-forge/storyboard/skeleton";
     /** 分镜·导演级：骨架 → 分镜表（镜头级）。 */
@@ -220,6 +222,8 @@ export interface StoryboardSkeleton {
     arc: string;
     /** 剧情节拍链（时间顺序，因果连贯）。 */
     beats: StoryboardBeat[];
+    /** 本章全部出镜角色（正文中的确切称谓，去重；漫剧角色库提名地基）。 */
+    characters?: string[];
 }
 /** POST /storyboard/skeleton 请求：生成单章剧情骨架。 */
 export interface StoryboardSkeletonRequest {
@@ -253,6 +257,10 @@ export interface StoryboardShot {
     prevState: string;
     /** 本镜头结束状态。 */
     nextState: string;
+    /** 本镜头出镜角色（引用小说库规范名/漫剧卡名，1-4 个；漫剧角色库提名地基）。 */
+    characters?: string[];
+    /** 本镜头已绑定漫剧卡的 id（定妆图引用，供出图/生视频时按卡取参考图）。 */
+    mangaRoleIds?: string[];
 }
 /** 分镜·导演级：单章分镜表。 */
 export interface StoryboardTable {
@@ -260,6 +268,10 @@ export interface StoryboardTable {
     shots: StoryboardShot[];
     /** 生成时注入的场景卡名称（前端标注消费关系）。 */
     usedScenes?: string[];
+    /** 本章全部出镜角色（各镜头 characters 去重汇总；骨架有则兜底）。 */
+    characters?: string[];
+    /** 本章已绑定漫剧卡的 id（去重汇总，定妆图引用）。 */
+    mangaRoleIds?: string[];
 }
 /** POST /storyboard/table 请求：骨架 → 分镜表。 */
 export interface StoryboardTableRequest {
@@ -281,6 +293,8 @@ export interface StoryboardPrompt {
     shotId: string;
     /** 即梦/视频模型可粘贴的中文提示词（画面+运镜+光效+风格词块）。 */
     text: string;
+    /** 本镜头绑定的漫剧卡 id（定妆图引用：出图/生视频时按卡取 imageUrl/立绘）。 */
+    mangaRoleIds?: string[];
 }
 /** 分镜持久化：单章的分镜产出（骨架 + 分镜表 + 视频提示词，可分别存在）。 */
 export interface ChapterStoryboard {
@@ -335,6 +349,112 @@ export interface MangaPlansRequest {
 export interface MangaPlansResponse {
     plans: MangaPlan[];
 }
+/** 漫剧角色卡：制作角色（要建模/出图/锁一致性的「上镜角色」），与小说角色库弱关联。 */
+export interface MangaRoleCard {
+    /** 稳定 id。 */
+    id: string;
+    /** 来源小说角色名（只读追溯，非强外键；禁止反向写回小说库）。 */
+    sourceRoleName?: string;
+    /** 漫剧用名（可短剧化改名）。 */
+    name: string;
+    /** 身份一句话。 */
+    identity: string;
+    /** 核心功能：主角/导师/感情线/反派/搭档/线人/功能性。 */
+    coreFunction: 'protagonist' | 'mentor' | 'love_interest' | 'antagonist' | 'sidekick' | 'informant' | 'functional';
+    /** 与主角的关系。 */
+    protagonistRelation: 'enemy' | 'friend' | 'mentor' | 'lover' | 'exploit' | 'neutral';
+    /** 口头禅/说话方式（配音一致性）。 */
+    speechStyle: string;
+    /** ≤3 个极致性格标签。 */
+    traits: string[];
+    /** 1-2 个辨识度外貌点。 */
+    appearance: string;
+    /** 3-5 个关键剧情节点。 */
+    keyScenes: string[];
+    /** 上场集数（分镜提名导入时记录）。 */
+    appearsInEpisodes: number[];
+    /** 待匹配 → 待确认 → 已导入 → 已定妆 → 已归档。 */
+    status: 'pending_match' | 'pending_confirm' | 'imported' | 'anchored' | 'archived';
+    /** 形象资产（沿用小说角色库同款结构）。 */
+    imagePrompt?: RoleRecord['imagePrompt'];
+    /** 情绪表情清单（锚点提炼时产出）。 */
+    expressions?: string[];
+    /** 四类精修生图提示词（立绘/四视图/表情/细节）。 */
+    promptKit?: RoleRecord['promptKit'];
+    /** 角色参考图。 */
+    imageUrl?: string;
+    /** 图集（图像锚点）。 */
+    gallery?: RoleImage[];
+    /** 生成锚点/精修时的方案风格 id（旧风格检测用）。 */
+    promptStyleId?: string;
+    createdAt: string;
+    updatedAt: string;
+}
+/** 分镜提名 → 小说角色库匹配的一条候选。 */
+export interface MangaRoleCandidate {
+    /** 分镜里的原始称谓（正文确切用法）。 */
+    rawName: string;
+    /** matched=命中小说角色；ambiguous=多个候选待定；not_in_library=小说库没有；already_imported=已建漫剧卡（跳过）。 */
+    verdict: 'matched' | 'ambiguous' | 'not_in_library' | 'already_imported';
+    /** 规则阶段候选短名单（≤5，精确名优先 + 身份/简称匹配）。 */
+    matches: Array<{
+        roleName: string;
+        reason: string;
+    }>;
+    /** LLM/规则确认的命中角色名（ambiguous 时可能为空）。 */
+    matchedRoleName?: string;
+    /** not_in_library 时给出建议：backfill=正文有该称谓但小说库漏提炼（回小说库补）；manga_new=漫剧新增角色（直接建卡）。 */
+    novelHint?: 'backfill' | 'manga_new';
+    /** 采纳时预填的漫剧卡建议。 */
+    suggested: {
+        name: string;
+        identity: string;
+        coreFunction: MangaRoleCard['coreFunction'];
+        protagonistRelation: MangaRoleCard['protagonistRelation'];
+        speechStyle: string;
+        traits: string[];
+        appearance: string;
+        keyScenes: string[];
+    };
+}
+/** POST /manga/roles 请求：漫剧角色库操作。 */
+export interface MangaRolesRequest {
+    op: 'nominate' | 'adopt' | 'update' | 'remove' | 'visual' | 'promptKit' | 'image' | 'removeImage' | 'imageGenerate' | 'mode';
+    /** op='mode'：短剧精简模式开关。 */
+    shortDramaMode?: boolean;
+    /** op='nominate'：从哪章分镜提名角色。 */
+    chapterNo?: number;
+    /** op='adopt' / op='update'：漫剧角色卡。 */
+    card?: MangaRoleCard;
+    /** op='remove' / 'visual' / 'promptKit' / 'image' / 'removeImage' / 'imageGenerate'：漫剧卡 id。 */
+    id?: string;
+    /** op='visual' / 'promptKit'：漫剧方案基底风格 id。 */
+    styleId?: string;
+    /** 可选滤镜风格 id。 */
+    filterId?: string;
+    /** op='image'：定妆图 dataURL。 */
+    dataUrl?: string;
+    /** op='image'：图集用途标签（立绘/四视图/表情-x/场景/细节）；缺省视为角色参考图（imageUrl）。 */
+    label?: string;
+    /** op='imageGenerate'：漫画风格预设 id（可选）。 */
+    style?: string;
+    /** op='imageGenerate'：生图模型库条目 id（缺省用启用条目）。 */
+    modelId?: string;
+}
+/** POST /manga/roles 响应。 */
+export interface MangaRolesResponse {
+    cards: MangaRoleCard[];
+    /** op='nominate' 时的 AI 提名候选。 */
+    candidates?: MangaRoleCandidate[];
+    /** op='visual' 时的形象锚点（已写入漫剧卡）。 */
+    visual?: RoleRecord['imagePrompt'];
+    /** op='promptKit' 时的四类精修提示词包（已写入漫剧卡）。 */
+    promptKit?: RoleRecord['promptKit'];
+    /** op='image' / 'imageGenerate' 时的定妆图 dataURL（已写入漫剧卡）。 */
+    imageUrl?: string;
+    /** op='mode' 时的短剧精简模式状态。 */
+    shortDramaMode?: boolean;
+}
 /** Chapter lifecycle states (the writing pipeline's state machine). */
 export type ChapterStatus = 'pending' | 'generating' | 'written' | 'reviewing' | 'approved' | 'rejected' | 'error';
 /** One chapter in the plan. */
@@ -979,6 +1099,10 @@ export interface ProjectState {
     plotlines?: Plotline[];
     /** 角色库（作者维护 + AI 提炼的主表）。 */
     roles?: RoleRecord[];
+    /** 漫剧角色库（制作角色投影：从分镜提名导入，独立于小说角色库）。 */
+    mangaRoles?: MangaRoleCard[];
+    /** 短剧精简模式：漫剧角色库按 5-8 上镜角色 / 功能标签 / 关系闭环 / 人设极致化约束。 */
+    shortDramaMode?: boolean;
     /** 场景库（作者维护 + AI 提炼的主表）。 */
     scenes?: SceneCard[];
     /** 视觉世界观规则（生图/生视频必须遵守，从道藏提炼，注入所有提示词）。 */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@waterwx/dsh-novel-forge",
   "description": "AI 编译小说工作台 for the dsh web GUI: import a novel outline (docx/text), plan chapters with LLM, generate chapter by chapter (3000-4000 chars each), and save every chapter as Markdown into your chosen output folder.",
-  "version": "1.7.0",
+  "version": "1.7.2",
   "type": "module",
   "engines": {
     "node": "^22.19.0 || >=24.0.0"
@@ -94,6 +94,7 @@
     "bundle": "tsdown",
     "watch": "tsdown --watch",
     "typecheck": "tsc --noEmit",
+    "check:styles": "node scripts/check-theme-sizes.mjs",
     "test": "vitest run"
   }
 }

package/src/client/api.ts

@@ -236,6 +236,11 @@ export class NovelApi {
     return postJson<import('../protocol.ts').RolesResponse>(NOVEL_API.roles, req)
   }
 
+  /** 漫剧角色库：从分镜提名 / 建卡 / 更新 / 删除 / 形象锚点 / 精修提示词。 */
+  async mangaRoles(req: import('../protocol.ts').MangaRolesRequest): Promise<import('../protocol.ts').MangaRolesResponse> {
+    return postJson<import('../protocol.ts').MangaRolesResponse>(NOVEL_API.mangaRoles, req)
+  }
+
   /** 场景库：AI 提炼 / 采纳 / 更新 / 删除 / 图集。 */
   async scenes(req: import('../protocol.ts').ScenesRequest): Promise<import('../protocol.ts').ScenesResponse> {
     return postJson<import('../protocol.ts').ScenesResponse>(NOVEL_API.scenes, req)

package/src/client/locales.ts

@@ -154,7 +154,6 @@ export const zh = {
   'settings.reasoning.max': 'max · 最高思考（质检/推演）',
   'settings.theme': '主题',
   'settings.themeLiquid': 'iOS 液态玻璃（绿）',
-  'settings.themeClassic': '经典毛玻璃（蓝）',
   'settings.themeNeumorph': '新拟物（双阴影）',
   'settings.themeHint': '存于浏览器本地，即时生效',
   'settings.chapterChars': '每章目标字数',

package/src/client/panel/AssetsTab.tsx

@@ -19,7 +19,7 @@ export interface AssetsTabProps {
 function GenreTree({ node, selected, onSelect }: { node: GenreNode; selected: string; onSelect: (node: GenreNode) => void }) {
   return (
     <div>
-      <label style={{ display: 'flex', alignItems: 'flex-start', gap: 6, cursor: 'pointer' }}>
+      <label style={{ display: 'flex', alignItems: 'flex-start', gap: 'var(--nf-space-6)', cursor: 'pointer' }}>
         <input type="radio" name="genre" checked={selected === node.name} onChange={() => { onSelect(node) }} />
         <span>
           <b>{node.name}</b>
@@ -34,7 +34,7 @@ function GenreTree({ node, selected, onSelect }: { node: GenreNode; selected: st
         </span>
       </label>
       {node.children.length > 0 && (
-        <div style={{ marginLeft: 22, display: 'flex', flexDirection: 'column', gap: 4 }}>
+        <div style={{ marginLeft: 'var(--nf-space-24)', display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-4)' }}>
           {node.children.map(child => (
             <GenreTree key={child.name} node={child} selected={selected} onSelect={onSelect} />
           ))}
@@ -205,9 +205,9 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
   const genreLibrary = data.genreLibrary
 
   return (
-    <div style={{ display: 'flex', flexDirection: 'column', gap: 12, flex: 1, minHeight: 0 }}>
+    <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-12)', flex: 1, minHeight: 0 }}>
       <div className={css.row} style={{ justifyContent: 'space-between', flexWrap: 'wrap' }}>
-        <span className={css.cardTitle} style={{ fontSize: 17, fontWeight: 700 }}>🧰 创作资产</span>
+        <span className={css.cardTitle} style={{ fontSize: 'var(--nf-fs-16)', fontWeight: 700 }}>🧰 创作资产</span>
         <span className={css.meta}>题材基底 / 推进模式 / 笔法帖 / 文戒 / 心法</span>
       </div>
       {error !== '' && <div className={css.card} style={{ borderColor: 'var(--nf-error)' }}><span style={{ color: 'var(--nf-error)' }}>{tt('common.error')}: {error}</span></div>}
@@ -240,13 +240,13 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
       </div>
 
       {/* 子页签：题材基底 / 推进模式 / 笔法帖 / 文戒 / 心法 */}
-      <div className={css.row} style={{ flexWrap: 'wrap', gap: 6 }}>
+      <div className={css.row} style={{ flexWrap: 'wrap', gap: 'var(--nf-space-6)' }}>
         {SUB_TABS.map(t => (
           <button
             key={t.id}
             type="button"
             className={`${css.button} ${assetTab === t.id ? css.buttonPrimary : ''}`}
-            style={{ fontSize: 14, flex: 1 }}
+            style={{ fontSize: 'var(--nf-fs-14)', flex: 1 }}
             onClick={() => { setAssetTab(t.id) }}
           >
             {t.label}
@@ -260,12 +260,12 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
           <span className={css.cardTitle}>题材基底库</span>
           <span className={css.meta}>这本书属于哪个阅读市场？题材定位会注入章节生成与审稿提示词。</span>
           {assets.genre !== undefined && (
-            <div style={{ border: '1px solid var(--nf-border)', borderRadius: 6, padding: '6px 10px', fontSize: 12 }}>
+            <div style={{ border: '1px solid var(--nf-border)', borderRadius: 'var(--nf-radius-6)', padding: 'var(--nf-space-6) var(--nf-space-10)', fontSize: 'var(--nf-fs-12)' }}>
               <b>当前题材：{assets.genre.name}</b> — {assets.genre.description}
             </div>
           )}
           {/* 题材基底库：自然展开，不套内部滚动条（描述两行截断，悬停看全文） */}
-          <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
+          <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-8)' }}>
             {genreLibrary.map(root => <GenreTree key={root.name} node={root} selected={assets.genre?.name ?? ''} onSelect={handleSelectGenre} />)}
           </div>
         </div>
@@ -277,17 +277,17 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
           <span className={css.cardTitle}>推进模式库</span>
           <span className={css.meta}>读者为什么继续看下一章？主模式 + 辅助模式注入卷规划与章节生成。</span>
           {assets.primaryProgression !== undefined && (
-            <div style={{ border: '1px solid var(--nf-accent)', borderRadius: 6, padding: '6px 10px', fontSize: 12, color: 'var(--nf-accent)' }}>
+            <div style={{ border: '1px solid var(--nf-accent)', borderRadius: 'var(--nf-radius-6)', padding: 'var(--nf-space-6) var(--nf-space-10)', fontSize: 'var(--nf-fs-12)', color: 'var(--nf-accent)' }}>
               <b>主推进：{assets.primaryProgression.name}</b> — {assets.primaryProgression.driver}
             </div>
           )}
           {assets.auxiliaryProgressions.map(mode => (
-            <div key={mode.name} style={{ border: '1px solid var(--nf-border)', borderRadius: 6, padding: '6px 10px', fontSize: 12 }}>
+            <div key={mode.name} style={{ border: '1px solid var(--nf-border)', borderRadius: 'var(--nf-radius-6)', padding: 'var(--nf-space-6) var(--nf-space-10)', fontSize: 'var(--nf-fs-12)' }}>
               <b>{mode.name}</b> — {mode.driver}
             </div>
           ))}
           <span className={css.meta}>从内置推进模式库选择添加（第一个设为主推进）：</span>
-          <div style={{ display: 'flex', flexDirection: 'column', gap: 6, flex: 1, minHeight: 0, overflowY: 'auto' }}>
+          <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-6)', flex: 1, minHeight: 0, overflowY: 'auto' }}>
             {data.progressionLibrary.map(mode => {
               const alreadyPrimary = assets.primaryProgression?.name === mode.name
               const alreadyAux = assets.auxiliaryProgressions.some(m => m.name === mode.name)
@@ -307,12 +307,12 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
         <div className={css.card} style={{ flex: 1, minHeight: 0 }}>
           <span className={css.cardTitle}>笔法帖</span>
           <span className={css.meta}>从内置 8 套叙事风格模板中一键选用（来自 AI-Novel-Writing-Assistant 写法引擎），无需样本文本；绑定后生成与润色都遵循该风格。</span>
-          <div style={{ display: 'flex', flexDirection: 'column', gap: 8, flex: 1, minHeight: 0, overflowY: 'auto' }}>
+          <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-8)', flex: 1, minHeight: 0, overflowY: 'auto' }}>
             {data.styleTemplates.map(template => {
               const bound = assets.styleAssets.some(s => s.name === template.name)
               return (
-                <div key={template.key} style={{ border: `1px solid ${bound ? 'var(--nf-accent)' : 'var(--nf-border)'}`, borderRadius: 6, padding: '8px 10px', fontSize: 12 }}>
-                  <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }}>
+                <div key={template.key} style={{ border: `1px solid ${bound ? 'var(--nf-accent)' : 'var(--nf-border)'}`, borderRadius: 'var(--nf-radius-6)', padding: 'var(--nf-space-8) var(--nf-space-10)', fontSize: 'var(--nf-fs-12)' }}>
+                  <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 'var(--nf-space-8)' }}>
                     <span><b>{template.name}</b> <span className={css.badge} style={{ borderColor: 'var(--nf-text-3)', color: 'var(--nf-text-3)' }}>{template.category}</span></span>
                     <button
                       className={`${css.button} ${css.buttonSmall} ${bound ? '' : css.buttonPrimary}`}
@@ -347,12 +347,12 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
         <div className={css.card} style={{ flex: 1, minHeight: 0 }}>
         <span className={css.cardTitle}>文戒</span>
         <span className={css.meta}>写作时必须遵守的表达边界（内置全局 + 项目自定义），生成与审稿都会检查。内置规则可用「覆盖编辑」复制为自定义版本调整。</span>
-        <div style={{ display: 'flex', flexDirection: 'column', gap: 6, flex: 1, minHeight: 0, overflowY: 'auto' }}>
+        <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-6)', flex: 1, minHeight: 0, overflowY: 'auto' }}>
           {builtinRules.map(rule => {
             const overridden = customRules.some(r => r.name === rule.name)
             return (
-              <div key={rule.name} style={{ border: '1px solid var(--nf-border)', borderRadius: 6, padding: '6px 10px', fontSize: 12 }}>
-                <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }}>
+              <div key={rule.name} style={{ border: '1px solid var(--nf-border)', borderRadius: 'var(--nf-radius-6)', padding: 'var(--nf-space-6) var(--nf-space-10)', fontSize: 'var(--nf-fs-12)' }}>
+                <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 'var(--nf-space-8)' }}>
                   <span>
                     <b>{rule.name}</b>{' '}
                     <span className={css.badge} style={{ borderColor: overridden ? 'var(--nf-accent)' : 'var(--nf-text-3)', color: overridden ? 'var(--nf-accent)' : 'var(--nf-text-3)' }}>
@@ -369,13 +369,13 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
             )
           })}
           {customRules.map((rule, index) => (
-            <div key={`${rule.name}-${index}`} style={{ border: '1px solid var(--nf-accent)', borderRadius: 6, padding: '6px 10px', fontSize: 12 }}>
-              <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 8 }}>
+            <div key={`${rule.name}-${index}`} style={{ border: '1px solid var(--nf-accent)', borderRadius: 'var(--nf-radius-6)', padding: 'var(--nf-space-6) var(--nf-space-10)', fontSize: 'var(--nf-fs-12)' }}>
+              <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', gap: 'var(--nf-space-8)' }}>
                 <span>
                   <b>{rule.name}</b>{' '}
                   <span className={css.badge} style={{ borderColor: 'var(--nf-accent)', color: 'var(--nf-accent)' }}>自定义</span>
                 </span>
-                <span style={{ display: 'flex', gap: 6 }}>
+                <span style={{ display: 'flex', gap: 'var(--nf-space-6)' }}>
                   <button className={`${css.button} ${css.buttonSmall}`} disabled={busy} onClick={() => { setEditingRule({ index, name: rule.name, avoid: rule.avoid, fix: rule.fix ?? '' }) }}>
                     编辑
                   </button>
@@ -385,7 +385,7 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
                 </span>
               </div>
               {editingRule !== null && editingRule.index === index ? (
-                <div style={{ display: 'flex', flexDirection: 'column', gap: 6, marginTop: 6 }}>
+                <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-6)', marginTop: 'var(--nf-space-6)' }}>
                   <input className={css.input} placeholder="规则名" value={editingRule.name} onChange={e => { setEditingRule({ ...editingRule, name: e.target.value }) }} />
                   <input className={css.input} placeholder="避免（要杜绝的表达）" value={editingRule.avoid} onChange={e => { setEditingRule({ ...editingRule, avoid: e.target.value }) }} />
                   <input className={css.input} placeholder="修正（改写方向，可留空）" value={editingRule.fix} onChange={e => { setEditingRule({ ...editingRule, fix: e.target.value }) }} />
@@ -426,7 +426,7 @@ export function AssetsTab({ api, initialTab = 'genre' }: AssetsTabProps) {
           <span className={css.cardTitle}>心法</span>
           <span className={css.meta}>粘贴一段你喜欢的样本文本，AI 提取叙事风格规则并绑定到本书，后续章节保持同一味道。</span>
           {assets.styleAssets.map(style => (
-            <div key={style.name} style={{ border: '1px solid var(--nf-border)', borderRadius: 6, padding: '6px 10px', fontSize: 12 }}>
+            <div key={style.name} style={{ border: '1px solid var(--nf-border)', borderRadius: 'var(--nf-radius-6)', padding: 'var(--nf-space-6) var(--nf-space-10)', fontSize: 'var(--nf-fs-12)' }}>
               <b>{style.name}</b>
               <div className={css.meta}>叙述：{style.proseRules.slice(0, 3).join('；')}</div>
               {style.dialogueRules.length > 0 && <div className={css.meta}>台词：{style.dialogueRules.slice(0, 2).join('；')}</div>}

package/src/client/panel/AssistantTab.tsx

@@ -227,8 +227,8 @@ export function AssistantTab({ api }: AssistantTabProps) {
         </button>
       </div>
       <span className={css.meta}>{tt('assistant.hint')}</span>
-      {notice !== '' && <span style={{ color: 'var(--nf-success)', fontSize: 12 }}>{notice}</span>}
-      {error !== '' && <span style={{ color: 'var(--nf-error)', fontSize: 12 }}>{tt('common.error')}: {error}</span>}
+      {notice !== '' && <span style={{ color: 'var(--nf-success)', fontSize: 'var(--nf-fs-12)' }}>{notice}</span>}
+      {error !== '' && <span style={{ color: 'var(--nf-error)', fontSize: 'var(--nf-fs-12)' }}>{tt('common.error')}: {error}</span>}
       {/* 状态条：编辑老师正在做什么 */}
       <div className={`${css.assistantStatus} ${busy ? css.assistantStatusBusy : ''}`}>
         {busy
@@ -278,7 +278,7 @@ export function AssistantTab({ api }: AssistantTabProps) {
         ))}
         {busy && <span className={css.meta} style={{ color: 'var(--nf-accent)' }}>…</span>}
       </div>
-      <div className={css.row} style={{ marginTop: 8 }}>
+      <div className={css.row} style={{ marginTop: 'var(--nf-space-8)' }}>
         <textarea
           className={css.textarea}
           style={{ minHeight: 64, flex: 1 }}

package/src/client/panel/BookshelfBar.tsx

@@ -164,7 +164,7 @@ export function BookshelfBar({ api, shelf, onSwitch }: BookshelfBarProps) {
           </div>
         )}
       </div>
-      {error !== '' && <span style={{ color: 'var(--nf-error)', fontSize: 12 }}>{error}</span>}
+      {error !== '' && <span style={{ color: 'var(--nf-error)', fontSize: 'var(--nf-fs-12)' }}>{error}</span>}
     </div>
   )
 }

package/src/client/panel/CreateBookView.tsx

@@ -161,14 +161,14 @@ export function CreateBookView({
         <span className={css.meta}>把一份大纲「编译」成一本完整的小说</span>
 
         {error !== '' && (
-          <div className={css.card} style={{ borderColor: 'var(--nf-error)', padding: '8px 12px' }}>
-            <span style={{ color: 'var(--nf-error)', fontSize: 12 }}>{error}</span>
+          <div className={css.card} style={{ borderColor: 'var(--nf-error)', padding: 'var(--nf-space-8) var(--nf-space-12)' }}>
+            <span style={{ color: 'var(--nf-error)', fontSize: 'var(--nf-fs-12)' }}>{error}</span>
           </div>
         )}
 
         {fillNotice !== '' && (
-          <div className={css.card} style={{ borderColor: 'var(--nf-success)', padding: '8px 12px' }}>
-            <span style={{ color: 'var(--nf-success)', fontSize: 12 }}>✅ {fillNotice}</span>
+          <div className={css.card} style={{ borderColor: 'var(--nf-success)', padding: 'var(--nf-space-8) var(--nf-space-12)' }}>
+            <span style={{ color: 'var(--nf-success)', fontSize: 'var(--nf-fs-12)' }}>✅ {fillNotice}</span>
           </div>
         )}
 
@@ -240,7 +240,7 @@ export function CreateBookView({
             ✨ {ideaOpen ? '▾' : '▸'} 没有大纲？用一句话想法让 AI 生成
           </button>
           {ideaOpen && (
-            <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
+            <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-8)' }}>
               <textarea
                 className={css.textarea}
                 style={{ minHeight: 60 }}
@@ -268,7 +268,7 @@ export function CreateBookView({
 
               {/* 方案卡 */}
               {candidates.length > 0 && (
-                <div style={{ display: 'flex', flexDirection: 'column', gap: 8 }}>
+                <div style={{ display: 'flex', flexDirection: 'column', gap: 'var(--nf-space-8)' }}>
                   {candidates.map(candidate => {
                     const isPinned = pinned.includes(candidate.id)
                     return (
@@ -277,13 +277,13 @@ export function CreateBookView({
                         className={css.ideaCandidate}
                         style={isPinned ? { borderColor: 'var(--nf-accent)', boxShadow: '0 0 0 2px var(--nf-accent-soft)' } : undefined}
                       >
-                        <div className={css.row} style={{ justifyContent: 'space-between', flexWrap: 'wrap', gap: 6 }}>
-                          <span style={{ display: 'flex', alignItems: 'center', gap: 8, flexWrap: 'wrap' }}>
+                        <div className={css.row} style={{ justifyContent: 'space-between', flexWrap: 'wrap', gap: 'var(--nf-space-6)' }}>
+                          <span style={{ display: 'flex', alignItems: 'center', gap: 'var(--nf-space-8)', flexWrap: 'wrap' }}>
                             <b>《{candidate.bookName}》</b>
                             {candidate.genre !== '' && <span className={css.badge} style={{ borderColor: 'var(--nf-accent)', color: 'var(--nf-accent)' }}>{candidate.genre}</span>}
                             {isPinned && <span className={css.badge} style={{ borderColor: 'var(--nf-warn)', color: 'var(--nf-warn)' }}>★ 已暂留</span>}
                           </span>
-                          <span style={{ display: 'flex', gap: 6 }}>
+                          <span style={{ display: 'flex', gap: 'var(--nf-space-6)' }}>
                             <button
                               type="button"
                               className={`${css.button} ${css.buttonSmall} ${isPinned ? '' : css.buttonPrimary}`}
@@ -333,7 +333,7 @@ export function CreateBookView({
         <button
           type="button"
           className={`${css.button} ${css.buttonPrimary}`}
-          style={{ width: '100%', padding: '10px 0', fontSize: 14 }}
+          style={{ width: '100%', padding: 'var(--nf-space-10) 0', fontSize: 'var(--nf-fs-14)' }}
           disabled={busy || effectiveName === ''}
           onClick={() => { void handleCreate() }}
         >