diff --git a/docs/README.md b/docs/README.md
index e571dde87..9cfb5eead 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -20,6 +20,7 @@
 - [图片画布编辑器 MVP 接入方案](./technical/【前端架构】图片画布编辑器MVP接入方案-2026-06-11.md)
 - [图片画布编辑器前端拆分计划](./technical/【前端架构】图片画布编辑器前端拆分计划-2026-06-17.md)
 - [图片画布游戏场景生成链路](./technical/【技术方案】图片画布游戏场景生成链路-2026-08-04.md)
+- [Art Agent 多模态 Spine 序列帧动画生成](./technical/【技术方案】ArtAgent多模态Spine序列帧动画生成-2026-08-10.md)
 - [画板音乐生成入口设计](./【编辑器】画板音乐生成入口设计-2026-06-18.md)
 - [SFX 生成优化 V2.0 任务拆解](./project-memory/plans/【实施计划】SFX生成优化V2.0任务拆解-2026-08-06.md)
 - [SFX 生成优化 V2.0 T6 测试与发布门禁](./【实施记录】SFX生成优化V2.0T6测试与发布门禁-2026-08-07.md)
diff --git a/docs/project-memory/shared-memory/pitfalls.md b/docs/project-memory/shared-memory/pitfalls.md
index f3a638797..189c1a34b 100644
--- a/docs/project-memory/shared-memory/pitfalls.md
+++ b/docs/project-memory/shared-memory/pitfalls.md
@@ -472,6 +472,8 @@
 - 现象：产品要求画板 `生成角色动作` 返回后按透明序列帧播放和下载，但旧实现或旧测试可能继续把结果当作预览视频处理。
 - 原因：后端仍需要先生成 `previewVideoPath` 再抽帧、绿幕去背和落 OSS；如果前端把预览视频当主媒体，就会绕过已经扣绿幕的 PNG 帧，也无法按序列帧打包下载。
 - 处理：角色动作结果图层主 `src` 使用 `frames[0].imageSrc`，`mediaType` 固定为 `image-sequence`，`assetKind` 固定为 `character-animation`，完整帧列表写入 `imageSequenceFrames`，`previewVideoPath` 只作为来源信息保留。生成端确认每帧对象后必须把该帧 `objectKey` 与 `assetObjectId` 一起写入正式 payload 和 `generation_inputs_json.characterAnimation.frames`。单图层下载必须生成序列帧 ZIP；画布素材 ZIP 中角色动作写入 `sequences/<编号-标题>/frames/`。不得移除后端原有视频生成、抽帧、绿幕去背和帧落盘流程。
+- 拆帧：拆帧只把正式帧对象登记成独立项目资源和账号素材，必须复用每帧已有的 `assetObjectId/objectKey`，禁止重新下载再上传 PNG。批次继续复用现有 spritesheet slice 批量事务，原子写入全部帧并完成 cohort；拆帧 task/cohort 必须按 owner + `sourceResourceId` + 规范化目标目录与标签稳定隔离，不能直接复用原生成 task，否则同一素材进入多个项目后会把多套帧归入一个错误 cohort。原帧 `asset_object.source_job_id` 继续保留原生成来源，不能为了匹配拆帧 task 伪造血缘。结果只进入素材库，不自动创建几十个画布图层。
+- 多模态参考：`inputMode/referenceMediaType` 只是客户端意图，不是媒体事实。图片或视频参考必须先按 owner 解析到权威 objectKey，再在扣费和 provider 调用前使用 OSS HEAD、权威 `asset_object.content_type` 或实际媒体探测验证 `image/*` / `video/*`；不能把上游报错和退款当作后端媒体校验。
 - 验证：`ImageCanvasGenerationLayerModel` 应断言动作结果 `src` 为首帧且 `mediaType="image-sequence"`；画布集成测试应出现 `画布序列帧：角色动作` 图片播放器，不应出现角色动作 `<video>`；导出测试应断言角色动作下载和画布素材导出都包含序列帧 ZIP / frames 目录；生成测试还应断言首帧与非首帧的稳定引用都被保留。
 - 关联：`src/components/image-editor/ImageCanvasGenerationLayerModel.ts`、`src/components/image-editor/ImageCanvasWorldView.tsx`、`src/components/image-editor/ImageCanvasExportModel.ts`、`server-rs/crates/api-server/src/character_animation_assets.rs`、`docs/【编辑器】画板角色形象生成入口设计-2026-06-15.md`。
 
@@ -4129,6 +4131,13 @@
 - 处理：资源 / 素材只保存 `image_sequence_frames_json` 与 `image_sequence_duration_ms`，精选审核快照只冻结复制这两个正式字段。角色动作要求至少两帧且毫秒时长大于 0；播放器按 `时长毫秒 / 数组长度` 计算间隔，Spine 导出时再换算秒数并推导 FPS。音频 / 视频 `durationSeconds` 不映射到这两个字段。
 - 关联：`server-rs/crates/spacetime-module/src/editor_project_storage.rs`、`src/components/image-editor/ImageCanvasWorldView.tsx`、`src/components/image-editor/ImageCanvasExportModel.ts`。
 
+## 多模态角色动作参考必须绑定上传上下文并由后端读取权威规格
+
+- 现象：普通视频与 Spine 序列帧面板共用参考上传控件时，用户在异步探测或上传期间切换面板，完成结果可能串入新面板；`same` 比例若直接采用客户端宽高，还会把省略或伪造尺寸的视频错误归一化为 `1:1`。
+- 处理：图片、视频、音频参考上传必须以 generation dialog 身份和分媒体容量建立 reservation，在探测、OSS 上传、项目资源 / 素材持久化和回填各边界复验；序列帧单参考限制按 dialog 语义判断，不依赖 `activeTool`。后端在扣费和 Provider 调用前按 owner 解析稳定对象，视频用带总超时的同一 HTTP client 做 HEAD 与 50MB 有界流式 GET，再由 FFprobe 读取 2–15 秒时长、显示方向宽高；图片按 EXIF 方向后的实际解码尺寸处理。`same` 只使用这些权威尺寸重新归一化。
+- 拆帧：省略素材目录时先转换为 owner 的正式默认文件夹 ID 并做 project/folder preflight；决定 resource、asset 与 cohort 的稳定 operation ID 属于资产领域规则，放在 `module-assets`，API 只编排调用。
+- 关联：`src/components/image-editor/useImageCanvasUploadWorkflow.ts`、`server-rs/crates/api-server/src/character_animation_assets.rs`、`server-rs/crates/module-assets/src/character_animation.rs`。
+
 ## 精选角色动作显示首帧还要检查前端 renderer 与逐帧授权
 
 - 现象：精选接口已经返回 `imageSequenceFrames` 和正确的 5 / 6 秒成本，但创作主页或后台审核仍只显示首帧；接入播放器后又可能只有第一帧成功、后续帧换签返回 404。
diff --git a/docs/technical/【技术方案】ArtAgent多模态Spine序列帧动画生成-2026-08-10.md b/docs/technical/【技术方案】ArtAgent多模态Spine序列帧动画生成-2026-08-10.md
new file mode 100644
index 000000000..71e79dc82
--- /dev/null
+++ b/docs/technical/【技术方案】ArtAgent多模态Spine序列帧动画生成-2026-08-10.md
@@ -0,0 +1,829 @@
+# Art Agent 多模态 Spine 序列帧动画生成方案
+
+状态：已实施，待合并
+更新时间：`2026-08-11`
+
+## 1. 文档目的
+
+本文只讨论 Web 端 Art Agent 图片画布 `/editor/canvas` 的“Spine 序列帧动画”能力，不涉及 AI 游戏创作 Tauri Desktop App，也不新增玩法入口、公开作品、作品详情、运行态或广场 read model。
+
+目标是在现有图片画布角色动作能力上，支持：
+
+- 文本生成序列帧动画；
+- 图片 + 文本生成或改造序列帧动画；
+- 视频 + 文本转换或改造序列帧动画；
+- 在画布中播放、查看信息、改造、拆帧和下载，最终帧由生成链自动透明化；
+- 下载附件示例所示的 Spine JSON ZIP。
+
+本文所称“Spine 序列帧”不是自动拆件、骨骼绑定、mesh 权重或 IK。它是**一组等尺寸 PNG + Spine 4.2 JSON，通过单 slot attachment timeline 逐帧切换**的可导入包。
+
+## 2. 结论摘要
+
+### 2.1 推荐结论
+
+1. **不要新增平行资产体系或 SpacetimeDB 表。**继续复用 `editor_project_resource`、`editor_asset`、`asset_object`、`editor_canvas_layer`、`editor_canvas_generation_dialog` 和 `external_generation_job`。
+2. **不要新增新的序列帧媒体类型。**继续使用：
+   - `assetKind = "character-animation"`；
+   - `mediaType = "image-sequence"`；
+   - `generationInputs.action = "character-animation.generate"`。
+3. **扩展现有角色动作生成链路，而不是重写。**现有链路已经覆盖图片首帧驱动、Seedance 预览视频、抽帧、逐帧透明化、OSS、原子落库、队列恢复和失败退款。
+4. **附件 ZIP 导出已经实现。**当前 `buildSpineImageSequenceJson` 与 `useImageCanvasAssetExportWorkflow` 生成的目录、`metadata.json`、`skeleton.json`、`README.md` 和 `manifest.txt` 与附件示例一致，只需要回归验证和入口文案调整。
+5. **本期不应承诺“真正的 Spine 骨骼动画”。**UI 和文案应写“Spine 序列帧动画”或“Spine JSON 序列帧包”，避免用户误认为会自动拆件和蒙皮。
+6. **1080p 暂不开放。**当前服务端明确拒绝 `seedance2.0-fast + 1080p`；应等供应商能力、成本和逐帧处理资源验证后再开放。
+7. **关键需求口径已经冻结并完成实施。**视频模式采用“参考视频 + 文本生成新视频后抽帧”，默认 480p × 4 秒为 40 泥点，最终帧自动透明化，拆帧只进入素材库；完整决策见第 13、16 节。
+
+### 2.2 为什么不是新玩法接入
+
+本功能是现役图片画布内的素材生成工具，不具备玩法草稿、发布、公开作品码、运行态、通关统计等语义。因此不接入旧 `/api/creation-entry/config`，也不新增 `/api/creation/<play>/sessions`、作品架或公开 read model。
+
+## 3. 附件 ZIP 契约核对
+
+附件 `角色动作-SpineJSON(1).zip` 包含：
+
+```text
+frames/
+  frame-01.png ... frame-32.png
+metadata.json
+skeleton.json
+README.md
+manifest.txt
+```
+
+核对结果：
+
+- 32 张 `480 × 480` RGBA PNG；示例帧确实包含透明像素；
+- `skeleton.spine = "4.2.00"`；
+- `skeleton.images = "./frames/"`；
+- 1 个 `root` bone；
+- 1 个 `character` slot；
+- 每帧对应一个 `region` attachment；
+- `animations.animation.slots.character.attachment` 每 `0.125s` 切换一帧；
+- 32 帧、8 FPS、总时长 4 秒；
+- 时间轴在 4 秒处回到第一帧；
+- 不含 `.spine` 工程、`.atlas`、拆件、骨骼蒙皮或 mesh 权重。
+
+当前仓库下列实现已经生成相同契约：
+
+- `src/components/image-editor/ImageCanvasExportModel.ts`
+  - `buildSpineImageSequenceJson`
+  - `buildSpineImageSequenceReadme`
+- `src/components/image-editor/useImageCanvasAssetExportWorkflow.ts`
+  - `buildImageSequenceZip`
+  - 单序列 Spine ZIP 和画布集合 ZIP
+- `src/components/image-editor/ImageCanvasContextMenusView.tsx`
+  - “序列帧导出（zip）”
+  - “Spine 导出（zip）”
+
+因此本需求不需要再实现一套服务端 ZIP 生成器。浏览器端会基于已换签的稳定帧引用读取 PNG，再用 JSZip 打包。
+
+## 4. 当前代码基线
+
+### 4.1 前端现状
+
+现有角色动作能力已经包含：
+
+- 角色图片右键或浮动工具栏“生成动画”；
+- `character-animation` 生成占位框；
+- 动作描述；
+- 待机、行走、奔跑、跳跃、攻击、受击、倒下预设；
+- 480p / 720p；
+- 32 帧 4 秒、40 帧 5 秒、48 帧 6 秒；
+- Seedance 2.0 Fast；
+- 生成结果作为 `image-sequence` 图层播放；
+- 当前帧 / 总帧数、暂停 / 播放；
+- 元数据弹窗、改造恢复、素材库、项目刷新恢复；
+- 普通序列帧 ZIP 和 Spine JSON ZIP。
+
+主要文件：
+
+| 责任 | 当前文件 |
+| --- | --- |
+| 画布工具类型和状态 | `src/components/image-editor/ImageCanvasEditorTypes.ts` |
+| 底部工具栏 | `src/components/image-editor/ImageCanvasBottomToolbarView.tsx` |
+| 生成 Dialog 草稿和恢复 | `src/components/image-editor/ImageCanvasGenerationDialogModel.ts` |
+| 生成 Composer | `src/components/image-editor/ImageCanvasGenerationComposerView.tsx` |
+| 角色动作专用旧面板 | `src/components/image-editor/ImageCanvasCharacterAnimationPanelView.tsx` |
+| 提交计划与前端校验 | `src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts` |
+| 画布选取与改造恢复 | `src/components/image-editor/useImageCanvasGenerationWorkflow.ts` |
+| 上传图片/视频 | `src/components/image-editor/useImageCanvasUploadWorkflow.ts` |
+| 提交、队列和回填 | `src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts` |
+| API Client 和前端 DTO | `src/services/image-editor/editorProjectClient.ts` |
+| 序列帧播放 | `src/components/image-editor/ImageCanvasWorldView.tsx` |
+| 元数据 | `src/components/image-editor/ImageCanvasMetadataModalView.tsx` |
+| ZIP / Spine JSON | `ImageCanvasExportModel.ts`、`useImageCanvasAssetExportWorkflow.ts` |
+
+通用视频面板已经提供“参考”控件，支持：
+
+- 从画布选择图片、视频；
+- 上传图片、视频；
+- 将上传文件直传并换成稳定 OSS / asset object 引用；
+- Seedance 参考素材数量、格式、大小和时长校验。
+
+新面板应复用这套参考素材交互和上传流程，不能再写一套文件上传与预览逻辑。
+
+### 4.2 后端现状
+
+当前内部路由：
+
+```text
+POST /api/editor/character-animations/generations
+```
+
+主要实现位于：
+
+- `server-rs/crates/shared-contracts/src/assets.rs`
+- `server-rs/crates/api-server/src/editor_sequence_animation.rs`
+- `server-rs/crates/api-server/src/character_animation_assets.rs`
+- `server-rs/crates/api-server/src/editor_generation_queue.rs`
+- `server-rs/crates/api-server/src/external_generation_worker.rs`
+- `server-rs/crates/api-server/src/editor_generation_config.rs`
+- `server-rs/crates/api-server/src/editor_project.rs`
+- `server-rs/crates/spacetime-client/src/editor_project.rs`
+- `server-rs/crates/spacetime-module/src/editor_project_storage.rs`
+
+当前图片模式链路：
+
+```mermaid
+flowchart LR
+  A["角色图片 + 动作描述"] --> B["校验 owner / project / folder / 稳定引用"]
+  B --> C["预扣泥点并创建任务"]
+  C --> D["背景键色决策"]
+  D --> E["Seedance 图生视频"]
+  E --> F["预览视频写 OSS"]
+  F --> G["FFmpeg 定点抽帧"]
+  G --> H["逐帧 BgFilter / 阿里云 / 本地键色兜底"]
+  H --> I["固定画布 RGBA PNG + OSS + asset object"]
+  I --> J["原子提交预览视频、最终序列、画布和 job"]
+  J --> K["Web 回填 image-sequence 图层"]
+```
+
+关键已有能力：
+
+- `external_generation_job` 队列、lease、phase、重试、结果和通知；
+- 请求幂等、运行身份、owner 隔离；
+- 生成前项目与素材目录预检；
+- 计费闭包与失败退款；
+- Seedance 2.0 Fast 图生视频；
+- FFmpeg / FFprobe 抽帧；
+- 逐帧并发抠图和全量失败关闭；
+- 每帧稳定 `assetObjectId + objectKey`；
+- 预览视频资源和最终序列资源原子落库；
+- 最终帧集不把临时签名 URL 写入 SpacetimeDB；
+- 队列完成后以完整 project 快照恢复画布。
+
+### 4.3 当前数据库事实
+
+本功能已有数据模型，不需要新表。
+
+#### `external_generation_job`
+
+保存：
+
+- `job_kind = editor_character_animation_generation`；
+- owner、source entity、请求 payload；
+- pending / running / completed / failed / cancelled；
+- generating / processing phase；
+- 价格、退款 ledger、lease、attempt；
+- 紧凑结果 payload。
+
+#### `editor_project_resource`
+
+最终序列资源保存：
+
+- `asset_kind = character-animation`；
+- `image_src/object_key/asset_object_id` 指向首帧；
+- `width/height` 为单帧尺寸；
+- `prompt/actual_prompt/model/provider/task_id`；
+- `generation_inputs_json` 保存用户可重放输入；
+- `source_resource_id` 指向预览视频资源；
+- `image_sequence_frames_json` 保存有序稳定帧引用；
+- `image_sequence_duration_ms` 保存总时长。
+
+#### `editor_asset`
+
+账号素材库保存与项目资源相同的序列帧媒体字段。当前设计中：
+
+- 预览视频作为独立 `video` 素材，承载实际生成成本；
+- 最终 `character-animation` 是派生素材，成本为 0；
+- 最终序列通过来源链追溯预览视频和原始参考素材。
+
+#### `asset_object`
+
+预览视频和每张 PNG 都有正式对象登记。数据库只保存 object key / object id，不保存大二进制或 Data URL。
+
+#### `editor_canvas_layer` 与 `editor_canvas_generation_dialog`
+
+- layer 只保存 `resource_id` 和布局，不复制序列帧、提示词和运行结果；
+- generation dialog 保存占位框和生成状态，用于刷新恢复；
+- 正式媒体真相始终从 resource 水合。
+
+## 5. 与本次需求的差距
+
+| 需求 | 当前能力 | 结论 |
+| --- | --- | --- |
+| 工具栏在视频后新增入口 | 当前只能从角色图触发 | 需要新增底部入口 |
+| 纯文本生成 | 当前必须有角色源图 | 需要扩展后端 T2V |
+| 图片 + 文本 | 已实现角色立绘图生视频再抽帧 | 主要复用 |
+| 已有序列帧改造 | 仅有部分恢复/首帧能力，来源语义不完整 | 需要明确输入形态并补全 |
+| 视频 + 文本 | 通用视频支持参考视频，角色动作链未接入 | 需要扩展 |
+| 参考支持画布/上传图片视频 | 通用视频面板已经实现 | 复用并收窄规则 |
+| 白/绿/蓝/紫背景 | 当前角色动作使用自动安全色，不是这四个纯色 | 需要专用枚举和提示词 |
+| 动作“更多”逐行展开 | 当前只有固定 7 个预设 | 需要前端扩展 |
+| 1080p | Fast 前后端均不支持 | 暂不开放 |
+| 40 泥点/次 | 当前 480p × 4 秒恰好为 40；其他组合不同 | 需确认固定价还是按秒价 |
+| 去背景 | 当前生成链自动逐帧去背景 | 与需求中的手动动作冲突 |
+| 拆帧生成单 PNG | 帧对象已有，但没有全部登记为独立账号素材 | 可复用对象、补资产绑定 |
+| ZIP 下载 | 已完成且匹配附件 | 不重做 |
+
+## 6. 目标业务模型
+
+### 6.1 统一能力，不新增平行类型
+
+产品展示名改为“Spine 序列帧动画”，内部继续沿用兼容名称：
+
+```text
+CanvasTool: character-animation（新增底部工具 ID）
+Dialog mode: character-animation
+Generation action: character-animation.generate
+Asset kind: character-animation
+Media type: image-sequence
+Queue job kind: editor_character_animation_generation
+```
+
+这样存量角色动作项目、素材、画布图层、改造配方、元数据和导出逻辑无需迁移。
+
+### 6.2 三种输入模式
+
+建议请求显式携带 `inputMode`，不要由字段是否为空隐式猜测：
+
+```text
+text  = 无参考素材，文本生成预览视频后抽帧
+image = 一张角色图或已有序列素材作为视觉参考
+video = 一段视频作为动作/外观参考
+```
+
+建议 v2 内部请求结构：
+
+```json
+{
+  "version": 2,
+  "inputMode": "text",
+  "reference": null,
+  "promptText": "让人物朝侧面原地不断快速奔跑",
+  "actionPreset": "run",
+  "backgroundColor": "green",
+  "resolution": "480p",
+  "ratio": "1:1",
+  "frameCount": 32,
+  "durationSeconds": 4,
+  "model": "seedance2.0-fast",
+  "projectId": "...",
+  "canvasCompletion": {},
+  "generationInputs": {},
+  "assetFolderId": "project",
+  "assetLabel": "角色奔跑"
+}
+```
+
+图片或视频模式的 `reference` 只接受稳定引用：
+
+```json
+{
+  "mediaType": "image",
+  "source": "editor/uploads/.../character.png",
+  "sourceLayerId": "layer-...",
+  "sourceResourceId": "resource-...",
+  "width": 480,
+  "height": 480,
+  "durationMs": null
+}
+```
+
+规则：
+
+- v1 建议只允许一个主参考，避免“哪个视频负责动作、哪个图片负责换皮”的未定义组合；
+- 浏览器不得提交 Data URL / blob URL；
+- `sourceLayerId/sourceResourceId/assetKind/width/height/duration` 只作为候选，后端必须按 owner 重新读取权威记录；
+- 文本模式 `reference = null`；
+- 图片模式 `reference.mediaType = image`；
+- 视频模式 `reference.mediaType = video`；
+- generation inputs 中只保存稳定 resource / asset ID，不保存临时签名 URL。
+
+### 6.3 兼容策略
+
+现有 `/api/editor/character-animations/generations` 和 External v1 已使用旧的图片模式 DTO。本期推荐：
+
+1. 内部 Web 路由接受 v2，并兼容旧 flat 图片请求一个滚动发布周期；
+2. worker 同时解析 v2 和旧 payload，防止部署期间已有 pending job 无法执行；
+3. `/api/external/v1/editor/character-animations/generations` 本期仍保持旧图片模式契约，由 adapter 转成内部 `inputMode=image`；
+4. 不在本任务中对外开放文本/视频模式；若以后开放，必须同次更新 `docs/openapi/genarrative-external-v1.openapi.json` 和契约测试。
+
+## 7. 数据库设计
+
+### 7.1 推荐：零 schema 变更
+
+三模态所需事实已经能放入现有字段：
+
+| 事实 | 存放位置 |
+| --- | --- |
+| 输入模式 | `generation_inputs_json.fields[inputMode]` |
+| 用户动作描述 | `generation_inputs_json.fields[prompt]` |
+| 动作预设 | `generation_inputs_json.fields[actionPreset]` |
+| 背景色 | `generation_inputs_json.fields[backgroundColor]` |
+| 清晰度/比例/时长/帧数 | `generation_inputs_json.fields[...]` |
+| 参考素材 | `generation_inputs_json.references`（稳定 resource/asset ID） |
+| 实际模型提示词 | `actual_prompt` |
+| 模型、provider、task | 现有列 |
+| 帧顺序和对象 | `image_sequence_frames_json` |
+| 总时长 | `image_sequence_duration_ms` |
+| 单帧尺寸 | `width/height` |
+| 来源链 | `source_resource_id` |
+
+不建议给 `editor_project_resource` 或 `editor_asset` 新增 `input_mode/background_color/fps/frame_count` 列：
+
+- `frame_count = frames.length`；
+- `fps = frame_count / duration`；
+- 输入模式和背景色是生成配方，不是独立资源运行真相；
+- 新列会引入 schema migration、绑定生成和线上迁移，却没有查询收益。
+
+### 7.2 来源链
+
+建议保留当前两级来源：
+
+```text
+原始参考素材（可空） -> 预览/中间视频资源 -> 最终 character-animation 序列资源
+```
+
+- 文本模式：预览视频 `source_resource_id = null`；
+- 图片模式：预览视频指向角色图或序列素材；
+- 视频改造模式：生成后的预览视频指向上传/画布视频；
+- 最终序列始终指向实际被抽帧的视频资源；
+- generation inputs 另外保留原始用户参考，供改造恢复。
+
+如果最终确认“视频模式只做原视频直接抽帧，不调用 Seedance”，最终序列可直接指向输入视频，不要复制一份相同视频资源。
+
+### 7.3 拆帧
+
+当前每帧已经有 `asset_object`，拆帧不应重复上传 PNG。建议：
+
+- 为现有每帧对象创建独立 `editor_asset` 绑定；
+- 标签为 `<序列名>-帧-01`；
+- 使用统一 `group_task_id` 和 expected count；
+- 只有全部绑定成功后标记批次完成；
+- 默认进入素材库，不自动把几十个图层铺到画布；若产品要求铺画布，另行确认布局和移动端行为。
+
+## 8. 后端业务逻辑与代码位置
+
+### 8.1 契约层
+
+`server-rs/crates/shared-contracts/src/assets.rs` 与 `packages/shared/src/contracts/editorCharacterAnimation.ts`
+
+- Rust 契约继续承载内部 v2 `inputMode/reference/backgroundColor/actionPreset` 类型并保留 External v1 的旧图片 DTO；
+- 拆帧 request/response 与 `EditorAssetPayload` 收口到 Rust `shared-contracts`，不再由 `api-server` 私有定义；
+- Web 拆帧 request/response 与素材 payload 从 `@genarrative/shared` 导出，`editorProjectClient.ts` 只负责调用现有内部路由；
+- response 继续复用 `EditorCharacterAnimationGenerateResponse`，正式 frame DTO 不写 frame index，数组位置仍是唯一顺序；
+- 客户端继续阻止 Data URL / blob URL。
+
+### 8.2 请求归一化和提示词
+
+已新增纯规则模块：
+
+```text
+server-rs/crates/api-server/src/editor_sequence_animation.rs
+```
+
+只承载：
+
+- 三种输入模式和参考媒体类型的确定性校验；
+- 白/绿/蓝/紫键色解析；
+- 分辨率、比例、时长、帧数和目标帧尺寸校验；
+- Seedance 提示词拼装；
+- 拆帧稳定 operation ID 与素材标签生成；
+- 旧图片请求到 v2 归一化。
+
+外部调用、OSS、扣费和 SpacetimeDB 不放进该 helper。
+
+`character_animation_assets.rs` 继续承载已有编排和媒体处理，避免再造第二条资产链：
+
+- handler；
+- owner/project/folder/reference 预检；
+- 计费边界；
+- Seedance 调用；
+- 视频下载和 OSS；
+- FFmpeg 抽帧；
+- 逐帧抠图；
+- 原子结果准备。
+
+### 8.3 三模态 provider 分流
+
+归一化后进入同一 `generate preview -> extract -> persist` 主链：
+
+```mermaid
+flowchart TD
+  A["Normalized sequence request"] --> B{"inputMode"}
+  B -->|text| C["Seedance text-to-video"]
+  B -->|image| D["Seedance image-to-video"]
+  B -->|video| E["Seedance reference-video / motion transfer 或直接抽帧"]
+  C --> F["统一预览视频"]
+  D --> F
+  E --> F
+  F --> G["统一抽帧、透明化、定尺寸、OSS"]
+  G --> H["统一原子持久化"]
+```
+
+应复用通用视频已有的：
+
+- text-to-video request body；
+- reference video URL 解析；
+- Seedance 模型映射；
+- provider 轮询、超时和下载；
+- 审计与错误脱敏。
+
+不得从前端直接调用模型，也不得在 SpacetimeDB procedure 中调用外部模型。
+
+### 8.4 队列和 worker
+
+`editor_generation_queue.rs`
+
+- 继续复用 `editor_character_animation_generation`；
+- 请求 payload 增加 `version=2`；
+- 定价和稳定引用门禁必须在入队前执行。
+
+`external_generation_worker.rs`
+
+- 对同一 job kind 解析 v2；
+- 对部署前旧 payload 做兼容转换；
+- phase 继续使用 `generating -> processing`；
+- 不需要新增逐帧进度列。画布上的 `15/30` 是播放帧数，不是 worker 进度。
+
+### 8.5 计费
+
+继续使用现有 `execute_billable_asset_operation_with_cost` 和 durable billing boundary：
+
+- provider、预览视频持久化、抽帧、全部帧透明化、首帧/帧对象准备均属于一次付费操作；
+- 任一必需帧失败，整项失败，不发布残缺序列；
+- 明确失败退款；
+- 原子提交结果未知时按现有对账语义处理，不能先退款再猜提交失败；
+- 拆帧只复用已有对象，不应再次收 Seedance 生成费；若逐帧去背景改为手动动作，需要另行确定费用。
+
+## 9. 提示词策略
+
+### 9.1 不建议把需求中的长 Sprite Sheet 提示词原样发给 Seedance
+
+需求 2.3、V2、V2.2、V3 的核心输出要求是：
+
+> 生成一张规则网格的大 Sprite Sheet 图片。
+
+但当前选定模型和现有链路是：
+
+> Seedance 生成视频，再由后端逐帧抽取 PNG。
+
+如果把“单张网格 Sprite Sheet”原样发给视频模型，模型可能在视频里绘制一张网格图，而不是生成角色动作视频。这与最终按时间抽帧的实现方向冲突。
+
+### 9.2 推荐做法
+
+- 保留需求长提示词中的角色一致性、动作连续性、固定镜头、完整主体、纯色背景、禁止文字/额外角色等约束；
+- 删除“单张大图、网格行列、每格一帧、直接等宽切图”等图片模型专属条款；
+- 后端构建适用于 Seedance 视频链路的完整约束提示词，注入后端归一化后的比例、清晰度、时长、目标帧数和 FPS；提示词明确约束角色身份与造型一致、固定机位和焦距、全身完整入镜、锚点和朝向稳定、动作连续及循环首尾平滑，同时明确禁止 Sprite Sheet、网格、多格画面和分镜拼图，避免把图片模型条款错误套到视频每一帧；
+- `prompt` 保存平台模板后的标准提示词；
+- `actual_prompt` 保存实际提交 provider 的提示词；
+- generation inputs 只保存用户输入和选择，不复制整段系统模板。
+
+建议结构：
+
+```text
+目标：生成可拆分为游戏角色序列帧的固定镜头动画。
+角色：同一角色、服装、配饰、武器、比例和画风全程一致。
+镜头：正交或近似正交；禁止缩放、平移、旋转、特写和镜头抖动。
+构图：单角色全身完整、始终位于中心、脚底基线稳定、不裁切。
+动作：<动作预设 + 用户描述>；默认循环，首尾自然衔接。
+背景：<白/绿/蓝/紫的确定 hex>，纯色、无纹理、无阴影、无地面和场景。
+禁止：文字、水印、HUD、额外角色、随机道具、风格漂移、闪烁和轮廓跳变。
+```
+
+说明：Seedance 只能尽量保持角色锚点稳定，不能仅靠提示词保证像专业逐帧动画一样像素级对齐。若验收要求严格固定 root/脚底，需要后续增加主体检测和逐帧锚点归一化，不应在 v1 文案中作绝对承诺。
+
+## 10. 前端设计
+
+### 10.1 入口
+
+`ImageCanvasBottomToolbarView.tsx`：
+
+- 在“生成视频”后新增“Spine 序列帧动画”；
+- 点击后在视口中心创建独立 `character-animation` generation dialog；
+- 不在当前面板下方追加内容；
+- 移动端保持横向滚动或现有工具栏收纳规则。
+
+`CanvasTool` 增加 `character-animation`，但不新增页面路由。
+
+### 10.2 Composer
+
+优先在 `ImageCanvasGenerationComposerView.tsx` 统一实现，逐步退役只支持源角色图的专用旧面板，避免同一能力维护两套 composer。
+
+布局建议：
+
+1. **参考区**
+   - 文案统一为“参考”；
+   - 可从画布选图片/视频；
+   - 可上传图片/视频；
+   - v1 只保留一个主参考；
+   - 删除参考后自动切回 text 模式。
+2. **文本区**
+   - placeholder：`请描述人物、朝向、做什么、如何做。比如：让人物朝侧面原地不断快速奔跑。`
+3. **背景色**
+   - 白 `#FFFFFF`；
+   - 绿 `#00FF00`；
+   - 蓝色和紫色必须由产品给出确定 hex，不能只存中文颜色名。
+4. **动作预设**
+   - 固定八列；首屏为行走、待机、奔跑、跳跃、攻击、受击、倒下和“更多”，正好一行；
+   - 每次点击“更多”按八个动作追加一行，最后不足八个时展示剩余动作；未全部展开时按钮继续显示“更多”，全部展开后显示“收起”，收起回到首屏；
+   - 对需求列表去重（当前“跳跃”出现两次）；
+   - 动作选择非必填；
+   - 推荐单选并把规范动作短语写入可编辑 prompt，避免 chip 状态与文本产生两套真相。
+5. **参数**
+   - 模型固定 Seedance 2.0 Fast；
+   - 默认 1:1、480p、4 秒、32 帧、8 FPS；
+   - 保留 720p；
+   - 暂不显示 1080p；
+   - 若最终固定 40 泥点，非默认规格要么隐藏，要么明确另行定价。
+6. **提交**
+   - 显示后端定价配置计算结果；
+   - 生成时关闭 composer，保留画布占位框；
+   - 队列任务显示 generating / processing；
+   - 完成后原位替换为序列帧图层。
+
+### 10.3 参考素材规则
+
+建议规则：
+
+- 从画布选择普通图片时，必须满足 `effectiveAssetKind = character`，否则提示“请选择角色图”；
+- 从画布选择现有 `character-animation` 时，只有确认“序列帧改造”的语义后才允许；
+- 上传图片是用户在该入口内显式指定的角色参考，可直接按角色参考处理，不要求先创建一个 `character` 图层；
+- 视频必须是已登记的 `video` 媒体；
+- 继续复用现有 Seedance 文件规则：图片最大 30MB，视频 mp4/mov 最大 50MB、2–15 秒；最终上限仍需结合“全部帧”决策重新评估；
+- 服务端再次验证 owner、媒体类型和稳定对象，前端标签不是安全边界。
+
+### 10.4 生成后图层
+
+继续复用 `ImageCanvasWorldView.tsx` 的序列播放器：
+
+- 标签显示“Spine 序列帧动画”；
+- 显示播放/暂停、当前帧/总帧数；
+- 信息按钮打开现有 metadata modal；
+- metadata 自动展示类型、生成输入、Model、Resolution、Task；
+- 图层 layout 不复制帧数组。
+
+### 10.5 生成后动作
+
+#### 快速编辑
+
+需求正文写“无快速编辑”，因此不展示图片快速编辑；不要把序列第一帧当作整段序列完成普通图片编辑。
+
+#### 改造
+
+- 从 `generationInputs` 恢复原 prompt、input mode、参考、动作、背景色、规格；
+- 打开新的独立 generation dialog；
+- 生成新资源，不原地覆盖旧资源；
+- 旧图层保留，可由用户删除或撤销。
+
+#### 去背景
+
+当前后端默认已经逐帧去背景。推荐方案是：
+
+- 生成结果始终为透明 RGBA；
+- 不再展示“去背景”，或仅在检测到历史不透明序列时展示；
+- 不重复对透明帧调用抠图 provider。
+
+如果产品坚持“先保留纯色背景，用户点击后再去背景”，则必须改为派生任务：
+
+- 原始不透明序列与透明序列是两个正式 resource；
+- 去背景全帧成功后一次性发布新序列；
+- 任一帧失败不产生残缺结果；
+- 需要单独确定泥点和失败退款；
+- 该选择会改变当前成熟链路，不建议作为默认。
+
+#### 拆帧
+
+推荐解释为“把现有序列中的每帧登记成独立账号素材”，不重新从视频抽取，也不复制 OSS 二进制。完成后打开素材栏或独立结果弹窗，不在当前面板下面追加内容。
+
+#### 下载
+
+- 顶部下载按钮默认执行 Spine JSON ZIP；
+- 右键“导出为”继续保留普通序列 ZIP / Spine ZIP；
+- 文件结构严格沿用附件和现有实现；
+- 禁止只下载预览视频代替序列帧。
+
+## 11. 状态、失败与恢复
+
+### 11.1 状态机
+
+```text
+idle
+  -> queued
+  -> generating（Seedance）
+  -> processing（下载 / 抽帧 / 去背景 / OSS）
+  -> completed
+  -> failed
+```
+
+- 刷新后由 external generation job 和 project canvas 恢复；
+- 登录账号切换时清理当前账号的本地 panel 状态，重新读取新 owner 数据；
+- 同一个 request/idempotency key 不重复扣费和生成；
+- failed dialog 保留输入，可改参数后重试；
+- completed 只认后端 project/resource/asset，不由前端拼接临时序列。
+
+### 11.2 部分失败
+
+生成阶段建议继续全有或全无：
+
+- 任一目标帧无法持久化，整项失败退款；
+- 不发布缺帧 `character-animation`；
+- ZIP 的 `failedFrames` 只处理下载时个别网络读取失败，不代表生成阶段允许缺帧。
+
+## 12. 实施拆分
+
+### T0：确认契约
+
+先确认第 13 节 P0 问题，冻结：输入模式、视频语义、帧率/帧数、背景结果、价格和拆帧去向。
+
+### T1：契约和纯模型
+
+- shared-contracts v2 DTO；
+- 前端 TypeScript DTO；
+- input mode / reference / background / pricing 纯校验；
+- legacy image request adapter；
+- generation inputs v2 恢复规则；
+- 提示词 builder 单测。
+
+### T2：前端入口和 Composer
+
+- 底部工具栏入口；
+- 独立 generation dialog；
+- 复用参考素材 picker 和上传；
+- 背景色、动作更多、参数和价格；
+- 文本/图片/视频模式切换；
+- 移动端布局和键盘行为。
+
+### T3：后端三模态生成
+
+- text-to-video；
+- 现有 image-to-video；
+- video 模式按最终确认语义接入；
+- 统一预览视频、抽帧、去背景、OSS；
+- queue worker v2 + legacy；
+- 原子持久化和退款。
+
+### T4：结果动作
+
+- 改造完整恢复；
+- 拆帧绑定既有 frame asset objects；
+- 条件式去背景（若最终保留）；
+- 顶部下载默认 Spine ZIP；
+- 元数据文案。
+
+### T5：验证和发布门禁
+
+- 前端定向测试和整合测试；
+- Rust contract / normalizer / handler / worker / billing 测试；
+- ZIP 与 Spine JSON validator；
+- 编码检查、typecheck、diff check；
+- 本地 api-server `/healthz` smoke；
+- 队列模式刷新恢复和失败退款 E2E。
+
+## 13. 编码前确认问题（已冻结）
+
+### P0：会改变架构或成本
+
+1. **视频模式到底是哪一种？**
+   - A：原视频直接逐帧转 PNG，不调用 Seedance；
+   - B：用视频 + 文本生成新视频（换皮/改造），再抽新视频；
+   - C：两种都要，由用户选择“直接转换/AI 改造”。
+
+   推荐 C，但 v1 若要收敛，先做 B；A 不需要动作预设、背景色或 40 泥点生成费。
+
+2. **“抽取上传视频所有帧”是否真的是源视频原始 FPS 的每一帧？**
+
+   当前和附件都是 4 秒、32 帧、8 FPS。若 15 秒 30 FPS 全抽，会产生 450 张 PNG、450 次对象登记，并可能触发 450 次抠图，成本和时延远超当前 32/40/48 帧。推荐继续固定 8 FPS 或固定 32/40/48 帧；如果坚持全帧，需要先给出视频时长、FPS、最大帧数和资源预算。
+
+3. **背景色是中间键色还是最终可见背景？**
+
+   附件 PNG 是透明 RGBA，而“生成后去背景”又暗示初始结果保留纯色。推荐背景色只作为生成与抠图的中间键色，最终自动透明；这样与当前链路和 ZIP 一致。
+
+4. **40 泥点是固定每次，还是只指默认 480p × 4 秒？**
+
+   当前定价是按秒、按清晰度：`seedance2.0-fast 480p = 10/秒`，所以默认 4 秒正好 40；720p/4 秒为 80。若固定每次 40，就不应同时开放会显著增加 provider 和逐帧成本的其他规格。
+
+5. **1080p 是否允许换模型？**
+
+   当前 `seedance2.0-fast` 明确不支持 1080p。可选：
+   - 暂不显示（推荐）；
+   - 1080p 自动切换 Seedance 2.0 标准版并重新定价；
+   - 等 provider Fast 真正支持后再开放。
+
+### P1：会改变交互或数据语义
+
+6. **“已有 Spine 序列帧 png 图片”指什么？**
+   - 已有 `character-animation` 帧集；
+   - 一张拼好的 Sprite Sheet PNG；
+   - 任意单张角色 PNG。
+
+   三者处理不同。现有 `character-animation` 可取首帧和 generation inputs；Sprite Sheet 应先走切图；单张角色图就是普通 image mode。
+
+7. **视频换皮是否还需要一张角色图片？**
+
+   若需要“视频提供动作 + 图片提供外观”，一个参考槽不够，需要两个有明确角色的槽位：`appearanceReference` 和 `motionReference`，不能用无序 references 数组猜测。
+
+8. **动作预设单选还是多选？**
+
+   列表中“速度线、运动模糊、命中帧、冲击波、粒子爆发”更像效果，不是主动作。推荐 v1 单选一个主动作；效果先只允许用户写进文本，或以后独立成多选效果组。
+
+9. **蓝色和紫色的准确 Hex 是什么？**
+
+   需要确定值，例如纯蓝 `#0000FF`、纯紫 `#8000FF`；抠图必须用确定 RGB，不能只存“蓝色/紫色”。还要确认主体颜色与键色冲突时是阻止提交、警告，还是自动换色。
+
+10. **拆帧后去哪里？**
+    - 只进入素材库（推荐）；
+    - 自动铺到画布；
+    - 弹出独立图片集面板；
+    - 只是下载普通序列 ZIP。
+
+11. **生成结果顶部是否真的显示“快速编辑”？**
+
+    需求文字明确写“与线上生成视频保持一致，无快速编辑”，截图却出现“快速编辑”。推荐以文字为准，不显示。
+
+## 14. 验收标准
+
+在 P0/P1 决策冻结后，本功能至少满足：
+
+1. 底部工具栏最右侧出现“Spine 序列帧动画”，与前一个工具之间不增加分割线。
+2. 无参考、角色图片参考、视频参考三种合法提交都由后端权威校验。
+3. 画布选择非角色图片时提示“请选择角色图”；上传图片规则按最终确认口径执行。
+4. 请求只携带稳定对象引用，不携带 Data URL / blob URL。
+5. 生成中刷新页面后任务和占位框可恢复。
+6. 失败不产生残缺序列，且按现有 durable billing 规则退款。
+7. 完成后项目 resource 和账号 asset 均为 `character-animation`，帧顺序稳定。
+8. 序列图层可循环播放并显示当前帧/总帧数。
+9. 元数据展示类型、输入、Model、Resolution、Task。
+10. 改造可恢复原输入模式、参考、动作、背景和规格，并生成新资源。
+11. 拆帧不重复上传已有 PNG。
+12. Spine ZIP 与附件目录结构一致，`skeleton.json` 能通过现有 validator。
+13. 存量角色动作项目、External v1 图片模式和普通视频生成不回归。
+
+## 15. 验证命令建议
+
+前端定向测试：
+
+```bash
+npm test -- src/components/image-editor/ImageCanvasGenerationDialogModel.test.ts
+npm test -- src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx
+npm test -- src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts
+npm test -- src/components/image-editor/useImageCanvasGenerationWorkflow.test.tsx
+npm test -- src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx
+npm test -- src/components/image-editor/ImageCanvasEditorGenerationIntegration.test.tsx
+npm test -- src/components/image-editor/ImageCanvasExportModel.test.ts
+npm test -- src/components/image-editor/ImageCanvasEditorAssetsIntegration.test.tsx
+npm run spine-export-validator:typecheck
+```
+
+后端定向测试：
+
+```bash
+cd server-rs
+cargo test -p api-server character_animation
+cargo test -p api-server external_generation_worker
+cargo test -p shared-contracts character_animation
+```
+
+基础门禁：
+
+```bash
+npm run typecheck
+npm run check:encoding
+git diff --check
+```
+
+推荐方案没有 SpacetimeDB schema 变更，因此不要求 `npm run check:spacetime-schema`。如果最终为了逐帧进度或其他新事实新增表字段，字段必须追加在表结构末尾、设置明确默认值，并同步 migration、表目录、生成 bindings 和 schema check。
+
+## 16. 实施状态（2026-08-11）
+
+本方案已按推荐 v1 口径落地：
+
+- 底部工具栏已新增 `Spine序列帧动画` 入口；入口使用“播放器 + 帧格”图标，位于同一底栏的最右侧，与前一个工具之间不增加分割线，也不使用独立按钮容器；画布中的序列帧生成占位卡片复用同一个图标组件，不再显示旧的小人图标；底栏桌面宽度按完整内容自适应，不再因第十三个按钮出现横向滚动条，窄屏仍可横向滑动但不显示 scrollbar；
+- 文本、角色图片、参考视频三种模式统一使用 `character-animation` generation dialog；单参考限制按当前 dialog 语义判断而不是依赖工具栏 `activeTool`，上传前只接收一个文件；图片、视频、音频参考的异步探测、OSS 上传、持久化和回填均绑定发起时的 dialog 身份与分媒体容量 reservation，切换面板后不把结果写入新面板；其他多参考生成面板仍保持原能力；
+- Seedance 2.0 Fast 支持 480p / 720p，不开放 1080p；
+- 背景键色冻结为白 `#FFFFFF`、绿 `#00FF00`、蓝 `#0000FF`、紫 `#8000FF`，最终产物继续自动透明化；新独立面板使用显式键色，旧角色图层“生成动画”入口继续由后端自动配色，前端在没有显式键色时不再伪装成绿色已选；
+- Composer 主面板按设计稿只常驻参考、动作描述、背景键色、动作预设和底部参数摘要；点击“比例 · 时长 · 清晰度”摘要后通过独立浮层展示三列比例卡片、32/40/48 帧时长胶囊和 480p/720p 清晰度胶囊，不在主面板内逐行堆叠参数；桌面面板保持约 30rem 宽度和舒适的四周留白，动作预设使用八列浅灰圆角矩形按钮而不是紧贴的胶囊，颜色按钮保持独立圆角矩形；颜色、比例、时长和清晰度均提供明确的选中、悬停、键盘焦点与禁用反馈；比例和清晰度同时同步画布占位框及像素尺寸标签，例如 `16:9 + 480p = 480×270`、`16:9 + 720p = 720×405`，`same` 使用参考媒体真实宽高比，切换时保持占位框中心不漂移，最终图层沿用同一尺寸；提交按钮使用独立主操作样式，移动端浮层宽度受视口约束并保持可操作；
+- 视频模式采用“参考视频 + 文本生成新视频后抽帧”的 v1 语义，固定输出 32/40/48 帧；参考媒体类型、文件非空、50MB 上限和 2–15 秒时长由后端在扣费和调用 Seedance 前按 owner 权威对象、OSS HEAD 与 FFprobe 复验；实际 GET 复用带总超时的客户端并按 HEAD、响应头和流式累计字节三重限界，不信任客户端声明；
+- 稳定参考 `objectKey` 和原始宽高会写入 generation inputs，文本模式以及参考素材已离开当前画布的图片/视频模式仍可通过真实 `openRedrawPanel` 链路恢复；只有既无稳定来源、又无法从当前画布解析的旧配方才失败关闭；`same` 比例在扣费前以图片实际解码尺寸或视频 FFprobe 显示方向尺寸覆盖客户端候选宽高并重新归一化；
+- 最终 `generationInputs` 不再直接信任客户端快照，而是在扣费前按实际 input mode、owner-scoped `objectKey`、权威媒体宽高、用户请求的 `same` 语义、背景选择和规格重建完整 V2 配方并重建引用 provenance；客户端携带 `sourceResourceId` 时，同步在扣费前校验其属于当前 owner/project，且 objectKey 与本次参考素材一致；
+- 三模态执行链路已复核：文本走 Seedance 文生视频，角色图片走首尾帧生视频，参考视频走带 `reference_video` 的视频改造；图片真实尺寸、视频类型 / 大小 / 时长 / 显示方向尺寸和 owner 归属均在扣费前权威复验，Provider、预览持久化、抽帧、逐帧抠图、正式对象确认与最终原子提交继续由 durable billing boundary 统一退款或确认，不允许发布缺帧结果；
+- 账号素材跨项目改造时，参考已不在当前画布则只从稳定 `referenceSrc/objectKey` 恢复，不复用旧项目的 project-resource ID；账号级 asset ID 仍可作为素材来源恢复；
+- 从画布选取参考时按当前 dialog 给出语义化提示：Spine 序列帧面板提示选择“角色图或视频”，角色形象生成得到的原图和抠图结果都保持 `assetKind = character`，均可作为角色参考；画布图层指针分流显式包含 `character-animation`，避免选择态点击被普通图层选择逻辑吞掉，其他生成模式继续沿用各自限制；
+- 动作预设固定八列，首屏按需求显示行走、待机、奔跑、跳跃、攻击、受击、倒下和“更多”；更多动作完整包含移动、战斗、防御、待机细节以及速度线、运动模糊、命中帧、冲击波、粒子爆发五个特效词；每次“更多”按八个动作追加一行，最后不足八个时展示剩余动作，全部展开后才切换为“收起”；“更多/收起”始终位于所有已展示动作之后，DOM/键盘顺序与视觉顺序一致，同时通过独立 live status 播报显示数量；生成期间预设与展开按钮统一禁用；
+- 文本模式与参考模式统一按 dialog 草稿回显当前比例；移除参考素材时才将“同图尺寸”重置为 `1:1`，避免界面选中态与实际提交比例不一致；
+- 结果图层不提供普通图片快速编辑，保留改造、拆帧和下载；
+- 拆帧调用 `/api/editor/character-animations/frame-splits`，复用已有帧 `assetObjectId/objectKey`，通过现有批量事务登记独立项目资源和账号素材，不重复上传 PNG，也不自动铺到画布；省略目标目录时先归一化为 owner 的正式默认素材文件夹并执行 owner/project preflight；拆帧 task/cohort 按 owner + `sourceResourceId` + 规范化目标目录与标签稳定隔离，原帧对象继续保留原生成任务来源，避免同一账号素材进入多个项目后错误合并 cohort；
+- `character-animation` 图层只有在项目资源登记完成后才开放拆帧；`pending`、`local-resource-*`、`generation-dialog:*` 等本地临时资源在工具栏显示“资源保存中”并禁用操作，工作流提交层同时执行同一防御性校验；
+- 拆帧 request/response 和素材 payload 已收口到 Rust `shared-contracts` 与 Web `@genarrative/shared`；序列帧请求归一化、提示词、键色和规格规则位于 `editor_sequence_animation.rs`，决定正式 resource/asset/cohort 的拆帧稳定 operation ID 已下沉 `module-assets`，`character_animation_assets.rs` 只保留 handler、鉴权预检、计费、Provider、OSS、FFmpeg、抠图和持久化编排；
+- 顶部下载默认 Spine JSON ZIP，右键继续提供普通序列 ZIP 和 Spine ZIP；
+- 未新增 SpacetimeDB schema；`/api/external/v1` 继续维持既有图片模式契约，不暴露内部 text/video 扩展字段。
diff --git a/packages/shared/src/contracts/editorCharacterAnimation.ts b/packages/shared/src/contracts/editorCharacterAnimation.ts
new file mode 100644
index 000000000..567dbea23
--- /dev/null
+++ b/packages/shared/src/contracts/editorCharacterAnimation.ts
@@ -0,0 +1,12 @@
+export type EditorCharacterAnimationFrameSplitInput = {
+  projectId: string;
+  sourceLayerId: string;
+  sourceResourceId: string;
+  assetFolderId?: string | null;
+  assetLabel?: string | null;
+};
+
+export type EditorCharacterAnimationFrameSplitResult<TAsset> = {
+  frameCount: number;
+  assets: TAsset[];
+};
diff --git a/packages/shared/src/index.ts b/packages/shared/src/index.ts
index d9d8aee23..4dc4667fa 100644
--- a/packages/shared/src/index.ts
+++ b/packages/shared/src/index.ts
@@ -6,6 +6,7 @@ export type * from './contracts/creationAudio';
 export type * from './contracts/creativeAgent';
 export type * from './contracts/customWorldAgent';
 export type * from './contracts/editorAudio';
+export type * from './contracts/editorCharacterAnimation';
 export * from './contracts/editorScene';
 export * from './contracts/edutainmentBabyDrawing';
 export * from './contracts/edutainmentBabyObject';
diff --git a/server-rs/Cargo.lock b/server-rs/Cargo.lock
index 3c82d1717..d9f12ef32 100644
--- a/server-rs/Cargo.lock
+++ b/server-rs/Cargo.lock
@@ -2934,6 +2934,7 @@ dependencies = [
  "platform-oss",
  "reqwest",
  "serde",
+ "sha2",
  "shared-kernel",
  "spacetimedb",
 ]
diff --git a/server-rs/crates/api-server/src/app.rs b/server-rs/crates/api-server/src/app.rs
index 7a21ccf91..510018922 100644
--- a/server-rs/crates/api-server/src/app.rs
+++ b/server-rs/crates/api-server/src/app.rs
@@ -1823,6 +1823,31 @@ mod tests {
         assert_eq!(response.status(), StatusCode::UNAUTHORIZED);
     }
 
+    #[tokio::test]
+    async fn editor_character_animation_frame_split_requires_bearer_auth() {
+        let app = build_router(AppState::new(AppConfig::default()).expect("state should build"));
+        let request_body = serde_json::json!({
+            "projectId": "project-1",
+            "sourceLayerId": "layer-character-animation",
+            "sourceResourceId": "resource-character-animation"
+        })
+        .to_string();
+
+        let response = app
+            .oneshot(
+                Request::builder()
+                    .method("POST")
+                    .uri("/api/editor/character-animations/frame-splits")
+                    .header("content-type", "application/json")
+                    .body(Body::from(request_body))
+                    .expect("request should build"),
+            )
+            .await
+            .expect("request should succeed");
+
+        assert_eq!(response.status(), StatusCode::UNAUTHORIZED);
+    }
+
     #[tokio::test]
     async fn editor_ui_design_asset_extraction_rejects_inline_data_url_before_queueing() {
         let state = AppState::new(AppConfig {
diff --git a/server-rs/crates/api-server/src/character_animation_assets.rs b/server-rs/crates/api-server/src/character_animation_assets.rs
index a4ae3d50d..65454fc86 100644
--- a/server-rs/crates/api-server/src/character_animation_assets.rs
+++ b/server-rs/crates/api-server/src/character_animation_assets.rs
@@ -1,6 +1,7 @@
 use std::{
     collections::BTreeMap,
     fs,
+    io::Cursor,
     path::{Path, PathBuf},
     process::{Command, Stdio},
     thread,
@@ -14,8 +15,8 @@ use axum::{
     response::Response,
 };
 use image::{
-    ColorType, ImageEncoder, ImageFormat, Rgba, RgbaImage, codecs::png::PngEncoder,
-    imageops::FilterType,
+    ColorType, DynamicImage, ImageDecoder, ImageEncoder, ImageFormat, ImageReader, Rgba, RgbaImage,
+    codecs::png::PngEncoder, imageops::FilterType,
 };
 use module_ai::{
     AiStageCompletionInput, AiTaskCreateInput, AiTaskKind, AiTaskServiceError, AiTaskSnapshot,
@@ -23,7 +24,8 @@ use module_ai::{
 };
 use module_assets::{
     AssetObjectAccessPolicy, AssetObjectFieldError, AssetObjectUpsertInput,
-    build_asset_entity_binding_input, build_asset_object_upsert_input, generate_asset_binding_id,
+    build_asset_entity_binding_input, build_asset_object_upsert_input,
+    character_animation_frame_split_operation_id, generate_asset_binding_id,
     generate_asset_object_id,
 };
 use platform_oss::{
@@ -41,9 +43,10 @@ use shared_contracts::assets::{
     CharacterAssetJobStatusPayload, CharacterAssetJobStatusText, CharacterVisualDraftPayload,
     CharacterWorkflowCacheGetResponse, CharacterWorkflowCachePayload,
     CharacterWorkflowCacheSaveRequest, CharacterWorkflowCacheSaveResponse,
-    EDITOR_ASSET_LABEL_MAX_CHARS, EditorCharacterAnimationFramePayload,
-    EditorCharacterAnimationGenerateRequest, EditorCharacterAnimationGenerateResponse,
-    EditorVideoGenerateRequest, EditorVideoGenerateResponse,
+    EditorCharacterAnimationFramePayload, EditorCharacterAnimationFrameSplitRequest,
+    EditorCharacterAnimationFrameSplitResponse, EditorCharacterAnimationGenerateRequest,
+    EditorCharacterAnimationGenerateResponse, EditorVideoGenerateRequest,
+    EditorVideoGenerateResponse,
 };
 #[cfg(any())]
 use shared_contracts::assets::{
@@ -53,9 +56,12 @@ use shared_contracts::editor_generation::{
     editor_generation_request_fingerprint, editor_generation_stable_asset_id,
     editor_generation_stable_asset_object_id, editor_generation_stable_resource_id,
 };
+use spacetime_client::editor_project::{
+    EditorSpritesheetSliceBatchPersistRecordInput, EditorSpritesheetSlicePersistItemRecordInput,
+};
 use spacetime_client::{
-    EditorAssetCreateRecordInput, EditorProjectResourceCreateRecordInput,
-    ExternalGenerationJobRecord, SpacetimeClientError,
+    EditorAssetCreateRecordInput, EditorProjectGetRecordInput,
+    EditorProjectResourceCreateRecordInput, ExternalGenerationJobRecord, SpacetimeClientError,
 };
 
 use crate::{
@@ -73,17 +79,17 @@ use crate::{
         EditorGenerationQueuedResponse, editor_generation_queue_state,
         editor_generation_source_entity_id, enqueue_editor_generation_job_for_caller,
     },
-    editor_green_screen::{
-        EditorScreenBackgroundColor, editor_green_screen_character_prompt_clause,
-    },
+    editor_green_screen::EditorScreenBackgroundColor,
     editor_project::{
         EDITOR_ASSET_ID_PREFIX, EDITOR_BGFILTER_CROSS_CHECK_ENABLED,
         EDITOR_BGFILTER_DEFAULT_SEG_MODEL, EDITOR_RESOURCE_ID_PREFIX,
         EditorCanvasGeneratedLayerInput, EditorCanvasLayoutPlan, EditorGenerationCaller,
         EditorGenerationOperationContext, PreparedEditorGenerationResultItem,
         build_editor_canvas_generated_layer_item, editor_asset_payload_from_record,
-        editor_project_payload_from_record, editor_project_resource_payload_from_record,
-        persist_editor_generation_result_atomically, preflight_editor_billable_generation_target,
+        editor_media_src_from_object_key, editor_project_payload_from_record,
+        editor_project_resource_payload_from_record, map_editor_project_error,
+        normalize_editor_record_object_key, persist_editor_generation_result_atomically,
+        preflight_editor_billable_generation_target, rebuild_editor_generation_input_references,
         remove_editor_generated_screen_background_with_bgfilter,
         resolve_editor_reference_object_key_for_owner, sanitize_editor_client_generation_inputs,
         serialize_editor_generation_inputs, serialize_editor_image_sequence_frames,
@@ -93,6 +99,21 @@ use crate::{
         EditorScreenBackgroundDecisionInput, EditorScreenBackgroundDecisionKind,
         resolve_editor_screen_background_color,
     },
+    editor_sequence_animation::{
+        EDITOR_CHARACTER_ANIMATION_MODEL, EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MAX_BYTES,
+        EditorCharacterAnimationInputMode, EditorCharacterAnimationReferenceMediaKind,
+        NormalizedEditorCharacterAnimationRequest,
+        apply_editor_character_animation_authoritative_reference_dimensions,
+        build_authoritative_editor_character_animation_generation_inputs,
+        build_editor_character_animation_frame_asset_label, editor_character_animation_bad_request,
+        editor_character_animation_source_asset_label,
+        normalize_editor_character_animation_request_with_pricing,
+        parse_editor_character_animation_background_color,
+        resolve_editor_character_animation_asset_label,
+        validate_editor_character_animation_reference_content_type,
+        validate_editor_character_animation_reference_video_content_length,
+        validate_editor_character_animation_reference_video_duration,
+    },
     http_error::AppError,
     platform_errors::map_oss_error,
     prompt::character_animation::normalize_animation_prompt_text_by_key,
@@ -101,6 +122,9 @@ use crate::{
 };
 use tokio::time::sleep;
 
+#[cfg(test)]
+use crate::editor_sequence_animation::normalize_editor_character_animation_request;
+
 const CHARACTER_ANIMATION_MODEL: &str = "doubao-seedance-2-0-fast-260128";
 const SEEDANCE_2_STANDARD_MODEL: &str = "doubao-seedance-2-0-260128";
 const CHARACTER_ANIMATION_ASSET_KIND: &str = "character_animation";
@@ -126,7 +150,6 @@ const FIXED_ARK_CHARACTER_VIDEO_RATIO: &str = "1:1";
 const FIXED_ARK_CHARACTER_VIDEO_DURATION_SECONDS: u32 = 4;
 const ARK_VIDEO_TASK_POLL_INTERVAL_MS: u64 = 5_000;
 const SOURCE_IMAGE_RESOLVE_TIMEOUT_MS: u64 = 30_000;
-const EDITOR_CHARACTER_ANIMATION_MODEL: &str = "seedance2.0-fast";
 const EDITOR_CHARACTER_ANIMATION_ASSET_KIND: &str = "editor_character_animation";
 const EDITOR_CHARACTER_ANIMATION_RESOURCE_ASSET_KIND: &str = "character-animation";
 const EDITOR_CHARACTER_ANIMATION_PREVIEW_RESOURCE_ASSET_KIND: &str = "video";
@@ -134,6 +157,7 @@ const EDITOR_CHARACTER_ANIMATION_PROVIDER_SOURCE_SLOT: &str = "provider_source";
 const EDITOR_CHARACTER_ANIMATION_PREVIEW_RESULT_SLOT: &str = "animation-preview";
 const EDITOR_CHARACTER_ANIMATION_FINAL_SLOT: &str = "animation-final";
 const EDITOR_CHARACTER_ANIMATION_FRAME_SLOT_PREFIX: &str = "animation-frame-";
+const EDITOR_CHARACTER_ANIMATION_FRAME_SPLIT_KIND: &str = "editor_character_animation_frame_split";
 const EDITOR_VIDEO_ASSET_KIND: &str = "editor_video";
 const EDITOR_VIDEO_ENTITY_KIND: &str = "editor_canvas";
 const EDITOR_VIDEO_SLOT: &str = "video_preview";
@@ -143,6 +167,7 @@ const EDITOR_VIDEO_COVER_RESULT_SLOT: &str = "video-cover";
 const EDITOR_VIDEO_MODEL_SEEDANCE_2: &str = "seedance2.0";
 const EDITOR_VIDEO_MODEL_SEEDANCE_2_FAST: &str = "seedance2.0-fast";
 const EDITOR_VIDEO_MODEL_KLING_3: &str = "kling3.0";
+
 const EDITOR_VIDEO_MODEL_KLING_3_OMNI: &str = "kling3.0-omni";
 const EDITOR_VIDEO_MODEL_VEO_3_1: &str = "veo3.1";
 const EDITOR_VIDEO_MODEL_VEO_3_1_FAST: &str = "veo3.1-fast";
@@ -389,6 +414,7 @@ pub async fn generate_character_animation(
                     &http_client,
                     payload.visual_source.as_str(),
                     "visualSource",
+                    EditorCharacterAnimationReferenceMediaKind::Image,
                 )
                 .await?;
                 let last_frame_data_url = resolve_media_source_as_data_url(
@@ -399,6 +425,7 @@ pub async fn generate_character_animation(
                         .as_deref()
                         .unwrap_or(payload.visual_source.as_str()),
                     "lastFrameImageDataUrl",
+                    EditorCharacterAnimationReferenceMediaKind::Image,
                 )
                 .await?;
                 let fallback_prompt = build_fallback_moderation_safe_animation_prompt(
@@ -599,11 +626,16 @@ pub async fn generate_editor_character_animation(
         )
     })?;
     let owner_user_id = authenticated.claims().user_id().to_string();
-    if matches_inline_media_source(payload.source_image_src.as_str()) {
+    if matches_inline_media_source(payload.source_image_src.as_str())
+        || payload
+            .reference_src
+            .as_deref()
+            .is_some_and(matches_inline_media_source)
+    {
         return Err(character_animation_error_response(
             &request_context,
             editor_character_animation_bad_request(
-                "sourceImageSrc 必须先上传 OSS，并使用 objectKey 或画板资源引用。",
+                "参考素材必须先上传 OSS，并使用 objectKey 或画板资源引用。",
             ),
         ));
     }
@@ -639,6 +671,315 @@ pub async fn generate_editor_character_animation(
     .await
 }
 
+pub async fn split_editor_character_animation_frames(
+    State(state): State<AppState>,
+    Extension(request_context): Extension<RequestContext>,
+    Extension(authenticated): Extension<AuthenticatedAccessToken>,
+    Json(payload): Json<EditorCharacterAnimationFrameSplitRequest>,
+) -> Result<Json<Value>, AppError> {
+    let owner_user_id = authenticated.claims().user_id().to_string();
+    let project_id = payload.project_id.trim().to_string();
+    let source_layer_id = payload.source_layer_id.trim().to_string();
+    let source_resource_id = payload.source_resource_id.trim().to_string();
+    if project_id.is_empty() || source_layer_id.is_empty() || source_resource_id.is_empty() {
+        return Err(
+            AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "projectId、sourceLayerId 和 sourceResourceId 不能为空。",
+            })),
+        );
+    }
+
+    let project = state
+        .spacetime_client()
+        .get_editor_project(EditorProjectGetRecordInput {
+            project_id: project_id.clone(),
+            owner_user_id: owner_user_id.clone(),
+        })
+        .await
+        .map_err(map_editor_project_error)?;
+    let source_resource = project
+        .resources
+        .iter()
+        .find(|resource| resource.resource_id == source_resource_id)
+        .cloned()
+        .ok_or_else(|| {
+            AppError::from_status(StatusCode::NOT_FOUND).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "未找到要拆帧的Spine序列帧资源。",
+            }))
+        })?;
+    if project.owner_user_id != owner_user_id
+        || source_resource.owner_user_id != owner_user_id
+        || source_resource.project_id != project_id
+    {
+        return Err(
+            AppError::from_status(StatusCode::FORBIDDEN).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "序列帧资源不属于当前账号或当前项目。",
+            })),
+        );
+    }
+    if source_resource.asset_kind.as_deref() != Some(EDITOR_CHARACTER_ANIMATION_RESOURCE_ASSET_KIND)
+        || !project.layers.as_array().is_some_and(|layers| {
+            layers.iter().any(|layer| {
+                layer.get("layerId").and_then(Value::as_str) == Some(source_layer_id.as_str())
+                    && layer.get("resourceId").and_then(Value::as_str)
+                        == Some(source_resource_id.as_str())
+            })
+        })
+    {
+        return Err(
+            AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "只有当前画布中的Spine序列帧动画可以拆帧。",
+            })),
+        );
+    }
+    let frames: Vec<EditorCharacterAnimationFramePayload> = source_resource
+        .image_sequence_frames
+        .clone()
+        .and_then(|value| serde_json::from_value(value).ok())
+        .filter(|frames: &Vec<EditorCharacterAnimationFramePayload>| !frames.is_empty())
+        .ok_or_else(|| {
+            AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "序列帧资源缺少完整的正式帧列表。",
+            }))
+        })?;
+    if frames.len() > 64 {
+        return Err(
+            AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "单次最多拆分64帧。",
+            })),
+        );
+    }
+    let source_task_id = source_resource
+        .task_id
+        .clone()
+        .map(|value| value.trim().to_string())
+        .filter(|value| !value.is_empty())
+        .ok_or_else(|| {
+            AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "序列帧资源缺少可信来源任务。",
+            }))
+        })?;
+    let target = preflight_editor_billable_generation_target(
+        &state,
+        owner_user_id.as_str(),
+        Some(project_id.clone()),
+        payload
+            .asset_folder_id
+            .clone()
+            .or_else(|| Some("project".to_string())),
+    )
+    .await?;
+    let folder_id = target.asset_folder_id.ok_or_else(|| {
+        AppError::from_status(StatusCode::INTERNAL_SERVER_ERROR).with_details(json!({
+            "provider": "editor-character-animation-frame-split",
+            "message": "拆帧目标素材文件夹归一化失败。",
+        }))
+    })?;
+    let base_label = resolve_editor_character_animation_asset_label(payload.asset_label.as_deref());
+    // 同一账号素材复制进不同项目时会保留原生成 taskId，但 sourceResourceId 不同。
+    // 拆帧 operation 同时绑定规范化后的目标目录和标签：完全相同的目标保持幂等，
+    // 切换目录或重命名后的新目标获得独立 assetId/cohort，不能与首次结果发生内容冲突。
+    let split_operation_id = character_animation_frame_split_operation_id(
+        owner_user_id.as_str(),
+        source_resource_id.as_str(),
+        folder_id.as_str(),
+        base_label.as_str(),
+    );
+    let expected_asset_count = u32::try_from(frames.len()).map_err(|_| {
+        AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+            "provider": "editor-character-animation-frame-split",
+            "message": "序列帧数量超过支持范围。",
+        }))
+    })?;
+    let now_micros = current_utc_micros();
+    let mut items = Vec::with_capacity(frames.len());
+
+    for (index, frame) in frames.iter().enumerate() {
+        let frame_number = index + 1;
+        let slot = format!("frame-{frame_number:04}");
+        let asset_object_id = frame
+            .asset_object_id
+            .as_deref()
+            .map(str::trim)
+            .filter(|value| !value.is_empty())
+            .ok_or_else(|| {
+                AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+                    "provider": "editor-character-animation-frame-split",
+                    "message": format!("第{frame_number}帧缺少assetObjectId。"),
+                }))
+            })?;
+        let object_key = frame
+            .object_key
+            .as_deref()
+            .map(str::trim)
+            .filter(|value| !value.is_empty())
+            .ok_or_else(|| {
+                AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+                    "provider": "editor-character-animation-frame-split",
+                    "message": format!("第{frame_number}帧缺少objectKey。"),
+                }))
+            })?;
+        let asset_object = state
+            .spacetime_client()
+            .get_asset_object(asset_object_id.to_string())
+            .await
+            .map_err(map_editor_project_error)?
+            .ok_or_else(|| {
+                AppError::from_status(StatusCode::NOT_FOUND).with_details(json!({
+                    "provider": "editor-character-animation-frame-split",
+                    "message": format!("第{frame_number}帧的正式资产对象不存在。"),
+                }))
+            })?;
+        if asset_object.owner_user_id.as_deref() != Some(owner_user_id.as_str())
+            || asset_object.object_key != object_key
+            || asset_object.source_job_id.as_deref() != Some(source_task_id.as_str())
+        {
+            return Err(
+                AppError::from_status(StatusCode::FORBIDDEN).with_details(json!({
+                    "provider": "editor-character-animation-frame-split",
+                    "message": format!("第{frame_number}帧的资产对象归属或来源不一致。"),
+                })),
+            );
+        }
+        if !asset_object
+            .content_type
+            .as_deref()
+            .is_some_and(|content_type| content_type.starts_with("image/"))
+            || frame.width == 0
+            || frame.height == 0
+        {
+            return Err(
+                AppError::from_status(StatusCode::UNPROCESSABLE_ENTITY).with_details(json!({
+                    "provider": "editor-character-animation-frame-split",
+                    "message": format!("第{frame_number}帧不是有效的图片资产。"),
+                })),
+            );
+        }
+        let image_src = editor_media_src_from_object_key(object_key);
+        let resource_id = editor_generation_stable_resource_id(
+            owner_user_id.as_str(),
+            EDITOR_CHARACTER_ANIMATION_FRAME_SPLIT_KIND,
+            split_operation_id.as_str(),
+            slot.as_str(),
+        );
+        let label =
+            build_editor_character_animation_frame_asset_label(base_label.as_str(), frame_number);
+        items.push(EditorSpritesheetSlicePersistItemRecordInput {
+            asset_object: module_assets::AssetObjectUpsertInput {
+                asset_object_id: asset_object.asset_object_id,
+                bucket: asset_object.bucket,
+                object_key: asset_object.object_key,
+                access_policy: asset_object.access_policy,
+                content_type: asset_object.content_type,
+                content_length: asset_object.content_length,
+                content_hash: asset_object.content_hash,
+                version: asset_object.version,
+                source_job_id: asset_object.source_job_id,
+                owner_user_id: asset_object.owner_user_id,
+                profile_id: asset_object.profile_id,
+                entity_id: asset_object.entity_id,
+                asset_kind: asset_object.asset_kind,
+                updated_at_micros: now_micros,
+            },
+            project_resource: Some(EditorProjectResourceCreateRecordInput {
+                resource_id: resource_id.clone(),
+                project_id: project_id.clone(),
+                owner_user_id: owner_user_id.clone(),
+                asset_object_id: Some(asset_object_id.to_string()),
+                image_src: image_src.clone(),
+                object_key: Some(object_key.to_string()),
+                width: frame.width,
+                height: frame.height,
+                source_type: "generated".to_string(),
+                prompt: source_resource.prompt.clone(),
+                actual_prompt: source_resource.actual_prompt.clone(),
+                model: source_resource.model.clone(),
+                provider: Some("Genarrative".to_string()),
+                task_id: Some(split_operation_id.clone()),
+                source_resource_id: Some(source_resource_id.clone()),
+                asset_kind: Some("image".to_string()),
+                generation_inputs_json: None,
+                updated_at_micros: now_micros,
+                image_sequence_frames_json: None,
+                image_sequence_duration_ms: None,
+            }),
+            asset: Some(EditorAssetCreateRecordInput {
+                asset_id: editor_generation_stable_asset_id(
+                    owner_user_id.as_str(),
+                    EDITOR_CHARACTER_ANIMATION_FRAME_SPLIT_KIND,
+                    split_operation_id.as_str(),
+                    slot.as_str(),
+                ),
+                owner_user_id: owner_user_id.clone(),
+                folder_id: folder_id.clone(),
+                label,
+                asset_object_id: Some(asset_object_id.to_string()),
+                image_src: image_src.clone(),
+                object_key: Some(object_key.to_string()),
+                width: frame.width,
+                height: frame.height,
+                source_type: "generated".to_string(),
+                prompt: source_resource.prompt.clone(),
+                actual_prompt: source_resource.actual_prompt.clone(),
+                model: source_resource.model.clone(),
+                provider: Some("Genarrative".to_string()),
+                task_id: Some(split_operation_id.clone()),
+                asset_kind: Some("image".to_string()),
+                generation_inputs_json: None,
+                source_resource_id: Some(resource_id),
+                now_micros,
+                thumbnail_src: Some(image_src),
+                generation_cost_mud_points: 0,
+                group_task_id: Some(split_operation_id.clone()),
+                group_task_expected_asset_count: Some(expected_asset_count),
+                image_sequence_frames_json: None,
+                image_sequence_duration_ms: None,
+            }),
+        });
+    }
+
+    let persisted = state
+        .spacetime_client()
+        .persist_editor_spritesheet_slice_batch(EditorSpritesheetSliceBatchPersistRecordInput {
+            owner_user_id,
+            task_id: split_operation_id.clone(),
+            group_task_id: Some(split_operation_id),
+            expected_asset_count,
+            items,
+            completed_at_micros: now_micros,
+        })
+        .await
+        .map_err(map_editor_project_error)?;
+    let assets = persisted
+        .items
+        .into_iter()
+        .filter_map(|item| item.asset)
+        .map(editor_asset_payload_from_record)
+        .collect::<Vec<_>>();
+    if assets.len() != frames.len() {
+        return Err(
+            AppError::from_status(StatusCode::BAD_GATEWAY).with_details(json!({
+                "provider": "editor-character-animation-frame-split",
+                "message": "序列帧批量登记返回数量不一致。",
+            })),
+        );
+    }
+    Ok(json_success_body(
+        Some(&request_context),
+        EditorCharacterAnimationFrameSplitResponse {
+            frame_count: expected_asset_count,
+            assets,
+        },
+    ))
+}
+
 pub(crate) async fn enqueue_editor_character_animation_for_owner(
     state: &AppState,
     request_context: &RequestContext,
@@ -646,11 +987,16 @@ pub(crate) async fn enqueue_editor_character_animation_for_owner(
     mut payload: EditorCharacterAnimationGenerateRequest,
     external_idempotency_key: Option<&str>,
 ) -> Result<ExternalGenerationJobRecord, Response> {
-    if matches_inline_media_source(payload.source_image_src.as_str()) {
+    if matches_inline_media_source(payload.source_image_src.as_str())
+        || payload
+            .reference_src
+            .as_deref()
+            .is_some_and(matches_inline_media_source)
+    {
         return Err(character_animation_error_response(
             request_context,
             editor_character_animation_bad_request(
-                "sourceImageSrc 必须先上传 OSS，并使用 objectKey 或画板资源引用。",
+                "参考素材必须先上传 OSS，并使用 objectKey 或画板资源引用。",
             ),
         ));
     }
@@ -677,15 +1023,18 @@ pub(crate) async fn enqueue_editor_character_animation_for_owner(
         )
     })?;
     // 队列路径只取定价，背景色决策留到实际执行时再做，这里用默认色占位。
+    let provisional_screen_color =
+        parse_editor_character_animation_background_color(payload.background_color.as_deref())
+            .map_err(|error| character_animation_error_response(request_context, error))?;
     let normalized = normalize_editor_character_animation_request_with_pricing(
         payload.clone(),
         &pricing,
-        crate::editor_green_screen::default_editor_screen_background_color(),
+        provisional_screen_color,
     )
     .map_err(|error| character_animation_error_response(request_context, error))?;
     let source_entity_id = editor_generation_source_entity_id(
         payload.project_id.as_deref(),
-        payload.source_layer_id.as_str(),
+        normalized.source_layer_id.as_str(),
     );
     enqueue_editor_generation_job_for_caller(
         state,
@@ -731,11 +1080,16 @@ pub(crate) async fn generate_editor_character_animation_for_owner(
             editor_character_animation_bad_request("角色动作画布完成需要有效的 projectId。"),
         ));
     }
-    if matches_inline_media_source(payload.source_image_src.as_str()) {
+    if matches_inline_media_source(payload.source_image_src.as_str())
+        || payload
+            .reference_src
+            .as_deref()
+            .is_some_and(matches_inline_media_source)
+    {
         return Err(character_animation_error_response(
             &request_context,
             editor_character_animation_bad_request(
-                "sourceImageSrc 必须先上传 OSS，并使用 objectKey 或画板资源引用。",
+                "参考素材必须先上传 OSS，并使用 objectKey 或画板资源引用。",
             ),
         ));
     }
@@ -754,8 +1108,7 @@ pub(crate) async fn generate_editor_character_animation_for_owner(
     payload.asset_folder_id = target.asset_folder_id;
     let project_id = payload.project_id.clone();
     let canvas_completion = payload.canvas_completion.clone();
-    let generation_inputs = payload.generation_inputs.clone();
-    let source_resource_id = payload.source_resource_id.clone();
+    let client_generation_inputs = payload.generation_inputs.clone();
     let asset_folder_id = payload.asset_folder_id.clone();
     let asset_label =
         resolve_editor_character_animation_asset_label(payload.asset_label.as_deref());
@@ -769,37 +1122,153 @@ pub(crate) async fn generate_editor_character_animation_for_owner(
             })),
         )
     })?;
-    // 先解析源角色图：图生视频的主体颜色完全由源图决定，背景色决策必须看到这张图。
-    let source_resolve_client = build_upstream_http_client(SOURCE_IMAGE_RESOLVE_TIMEOUT_MS)
-        .map_err(|error| character_animation_error_response(&request_context, error))?;
-    let source_object_key = resolve_editor_reference_object_key_for_owner(
-        &state,
-        owner_user_id.as_str(),
-        payload.source_image_src.trim(),
-    )
-    .await
-    .map_err(|error| character_animation_error_response(&request_context, error))?;
-    let source_data_url = resolve_media_source_as_data_url(
-        &state,
-        &source_resolve_client,
-        source_object_key.as_str(),
-        "sourceImageSrc",
-    )
-    .await
-    .map_err(|error| character_animation_error_response(&request_context, error))?;
     // 定价 / 上游设置先于扣费，且都不依赖背景色：用默认色占位归一化（与队列路径一致），
     // 把背景色决策挪到预扣泥点之后，避免余额不足 / 生成注定失败时仍白发一次 gpt-5-mini 决策。
+    let provisional_screen_color =
+        parse_editor_character_animation_background_color(payload.background_color.as_deref())
+            .map_err(|error| character_animation_error_response(&request_context, error))?;
+    let provisional_normalized = normalize_editor_character_animation_request_with_pricing(
+        payload.clone(),
+        &pricing,
+        provisional_screen_color,
+    )
+    .map_err(|error| character_animation_error_response(&request_context, error))?;
+    // 在预扣前完成 owner-scoped 参考素材解析，避免文本模式误走源图逻辑，也避免跨账号
+    // objectKey 在扣费后才被拒绝。图片模式读取真实图片尺寸和 data URL；视频模式按 OSS
+    // HEAD + 有界下载 + FFprobe 读取时长与视频流尺寸。same 比例随后用权威尺寸重新归一化。
+    let source_resolve_client = build_upstream_http_client(SOURCE_IMAGE_RESOLVE_TIMEOUT_MS)
+        .map_err(|error| character_animation_error_response(&request_context, error))?;
+    let extraction_settings = resolve_backend_frame_extraction_settings(&state);
+    let (reference_object_key, source_data_url) = match provisional_normalized.input_mode {
+        EditorCharacterAnimationInputMode::Text => (None, None),
+        EditorCharacterAnimationInputMode::Image => {
+            let reference_src =
+                provisional_normalized
+                    .reference_src
+                    .as_deref()
+                    .ok_or_else(|| {
+                        character_animation_error_response(
+                            &request_context,
+                            editor_character_animation_bad_request("图片模式必须提供参考图片。"),
+                        )
+                    })?;
+            let object_key = resolve_editor_reference_object_key_for_owner(
+                &state,
+                owner_user_id.as_str(),
+                reference_src,
+            )
+            .await
+            .map_err(|error| character_animation_error_response(&request_context, error))?;
+            let resolved = resolve_editor_character_animation_reference_image(
+                &state,
+                &source_resolve_client,
+                object_key.as_str(),
+                "referenceSrc",
+            )
+            .await
+            .map_err(|error| character_animation_error_response(&request_context, error))?;
+            apply_editor_character_animation_authoritative_reference_dimensions(
+                &mut payload,
+                EditorCharacterAnimationInputMode::Image,
+                resolved.width,
+                resolved.height,
+            )
+            .map_err(|error| character_animation_error_response(&request_context, error))?;
+            (Some(object_key), Some(resolved.data_url))
+        }
+        EditorCharacterAnimationInputMode::Video => {
+            let reference_src =
+                provisional_normalized
+                    .reference_src
+                    .as_deref()
+                    .ok_or_else(|| {
+                        character_animation_error_response(
+                            &request_context,
+                            editor_character_animation_bad_request("视频模式必须提供参考视频。"),
+                        )
+                    })?;
+            let object_key = resolve_editor_reference_object_key_for_owner(
+                &state,
+                owner_user_id.as_str(),
+                reference_src,
+            )
+            .await
+            .map_err(|error| character_animation_error_response(&request_context, error))?;
+            let metadata = validate_editor_character_animation_reference_video_object(
+                &state,
+                &source_resolve_client,
+                owner_user_id.as_str(),
+                object_key.as_str(),
+                "referenceSrc",
+                &extraction_settings,
+            )
+            .await
+            .map_err(|error| character_animation_error_response(&request_context, error))?;
+            apply_editor_character_animation_authoritative_reference_dimensions(
+                &mut payload,
+                EditorCharacterAnimationInputMode::Video,
+                metadata.width,
+                metadata.height,
+            )
+            .map_err(|error| character_animation_error_response(&request_context, error))?;
+            (Some(object_key), None)
+        }
+    };
     let priced = normalize_editor_character_animation_request_with_pricing(
         payload.clone(),
         &pricing,
-        crate::editor_green_screen::default_editor_screen_background_color(),
+        provisional_screen_color,
     )
     .map_err(|error| character_animation_error_response(&request_context, error))?;
+    let source_resource_id = validate_editor_character_animation_source_resource(
+        &state,
+        owner_user_id.as_str(),
+        project_id.as_deref(),
+        priced.input_mode,
+        payload.source_resource_id.as_deref(),
+        reference_object_key.as_deref(),
+    )
+    .await
+    .map_err(|error| character_animation_error_response(&request_context, error))?;
+    let authoritative_generation_inputs =
+        build_authoritative_editor_character_animation_generation_inputs(
+            client_generation_inputs,
+            &payload,
+            priced.input_mode,
+            reference_object_key.as_deref(),
+        )
+        .map_err(|error| character_animation_error_response(&request_context, error))?;
+    let generation_reference_sources = reference_object_key
+        .as_ref()
+        .map(|object_key| {
+            (
+                match priced.input_mode {
+                    EditorCharacterAnimationInputMode::Image => "角色图片",
+                    EditorCharacterAnimationInputMode::Video => "参考视频",
+                    EditorCharacterAnimationInputMode::Text => unreachable!(),
+                }
+                .to_string(),
+                // 已通过当前项目校验时优先按正式 resource ID 重建 provenance；没有
+                // project-scoped 来源时才退回稳定 objectKey 做 owner-scoped 查找。
+                source_resource_id
+                    .clone()
+                    .unwrap_or_else(|| object_key.clone()),
+            )
+        })
+        .into_iter()
+        .collect();
+    let generation_inputs = rebuild_editor_generation_input_references(
+        &state,
+        owner_user_id.as_str(),
+        Some(authoritative_generation_inputs),
+        generation_reference_sources,
+    )
+    .await
+    .map_err(|error| character_animation_error_response(&request_context, error))?;
     let settings = require_editor_character_animation_settings(&state, &priced)
         .map_err(|error| character_animation_error_response(&request_context, error))?;
     let http_client = build_upstream_http_client(settings.ark.request_timeout_ms)
         .map_err(|error| character_animation_error_response(&request_context, error))?;
-    let extraction_settings = resolve_backend_frame_extraction_settings(&state);
     editor_generation_operation(&caller)
         .map_err(|error| character_animation_error_response(&request_context, error))?;
     let task_id = generate_ai_task_id(current_utc_micros());
@@ -818,53 +1287,84 @@ pub(crate) async fn generate_editor_character_animation_for_owner(
         task_id.as_str(),
         u64::from(priced.price_mud_points),
         async {
-            // 背景色决策：预扣泥点之后才发起（显式传入 → 视觉 LLM 按源图主体配色自动决策 → 默认色）。
-            // 决策失败会让本 future 返回 Err，走 execute_billable 的失败退款，用户不损失泥点。
-            let screen_background_decision = resolve_editor_screen_background_color(
-              state.llm_client(),
-              state.vector_engine_llm_client(),
-              EditorScreenBackgroundDecisionInput {
-                    kind: EditorScreenBackgroundDecisionKind::CharacterAnimation,
-                    screen_color: payload.screen_color.clone(),
-                    prompt: payload.prompt_text.clone(),
-                    icon_descriptions: Vec::new(),
-                    reference_count: 1,
-                    source_image_data_url: Some(source_data_url.clone()),
-                },
-              Some(&crate::editor_screen_background_decision::EditorScreenBackgroundDecisionAuditContext {
-                    state: &state,
-                    context: crate::external_api_audit::ExternalApiAuditContext {
-                        user_id: Some(owner_user_id.clone()),
-                        profile_id: project_id.clone(),
-                        request_id: Some(request_context.request_id().to_string()),
-                        external_call_deadline: request_context.external_call_deadline(),
+            // 新面板显式选择键色时直接采用，不额外调用视觉 LLM；旧图片入口仍保留自动配色。
+            // 文本 / 视频模式没有可用于主体配色判断的源图，缺省统一使用绿色。
+            let screen_color = if priced.has_explicit_background_color
+                || priced.input_mode != EditorCharacterAnimationInputMode::Image
+            {
+                priced.screen_color
+            } else {
+                resolve_editor_screen_background_color(
+                    state.llm_client(),
+                    state.vector_engine_llm_client(),
+                    EditorScreenBackgroundDecisionInput {
+                        kind: EditorScreenBackgroundDecisionKind::CharacterAnimation,
+                        screen_color: payload.screen_color.clone(),
+                        prompt: payload.prompt_text.clone(),
+                        icon_descriptions: Vec::new(),
+                        reference_count: 1,
+                        source_image_data_url: source_data_url.clone(),
                     },
-                }),
-            )
-            .await?;
+                    Some(
+                        &crate::editor_screen_background_decision::EditorScreenBackgroundDecisionAuditContext {
+                            state: &state,
+                            context: crate::external_api_audit::ExternalApiAuditContext {
+                                user_id: Some(owner_user_id.clone()),
+                                profile_id: project_id.clone(),
+                                request_id: Some(request_context.request_id().to_string()),
+                                external_call_deadline: request_context.external_call_deadline(),
+                            },
+                        },
+                    ),
+                )
+                .await?
+                .color
+            };
             // 用决策色重新归一化以拿到最终提示词（价格 / 校验已在预扣前用占位色完成）。
             let normalized = normalize_editor_character_animation_request_with_pricing(
                 payload,
                 &pricing,
-                screen_background_decision.color,
+                screen_color,
             )?;
-            // 透明源图先合成到选定背景色：让视频背景确定性地等于抠图键色，而不是赌模型服从提示词。
-            let source_data_url = composite_source_image_onto_screen_color(
-                source_data_url.as_str(),
-                screen_background_decision.color,
-            )
-            .unwrap_or(source_data_url);
-            let generated = request_editor_character_animation_preview(
-                &state,
-                &http_client,
-                &settings,
-                &caller,
-                normalized.source_layer_id.as_str(),
-                task_id.as_str(),
-                normalized.prompt.as_str(),
-                source_data_url.as_str(),
-            )
-            .await?;
+            let generated = match normalized.input_mode {
+                EditorCharacterAnimationInputMode::Image => {
+                    let source_data_url = source_data_url.ok_or_else(|| {
+                        editor_character_animation_bad_request("图片模式必须提供参考图片。")
+                    })?;
+                    // 透明源图先合成到选定背景色：让视频背景确定性地等于抠图键色，
+                    // 而不是赌模型服从提示词。
+                    let source_data_url = composite_source_image_onto_screen_color(
+                        source_data_url.as_str(),
+                        screen_color,
+                    )
+                    .unwrap_or(source_data_url);
+                    request_editor_character_animation_preview(
+                        &state,
+                        &http_client,
+                        &settings,
+                        &caller,
+                        normalized.source_layer_id.as_str(),
+                        task_id.as_str(),
+                        normalized.prompt.as_str(),
+                        source_data_url.as_str(),
+                    )
+                    .await?
+                }
+                EditorCharacterAnimationInputMode::Text
+                | EditorCharacterAnimationInputMode::Video => {
+                    request_editor_sequence_animation_text_or_video_preview(
+                        &state,
+                        &http_client,
+                        &settings,
+                        &caller,
+                        normalized.source_layer_id.as_str(),
+                        task_id.as_str(),
+                        &normalized,
+                        reference_object_key.as_deref(),
+                    )
+                    .await?
+                }
+            };
             // 扣费契约（【编辑器】画板角色形象生成入口设计-2026-06-15）：角色动作的交付物是
             // 画布可用的透明序列帧，预览视频本身不是可用结果；因此预览上传与 HEAD 校验、
             // phase 上报、抽帧、逐帧抠图、首帧上传与 HEAD 校验全部留在计费闭包内，任一步失败
@@ -1827,23 +2327,352 @@ async fn resolve_media_source_as_data_url(
     http_client: &reqwest::Client,
     source: &str,
     field: &str,
+    expected_kind: EditorCharacterAnimationReferenceMediaKind,
 ) -> Result<String, AppError> {
-    let payload = load_media_source_payload(state, source).await?;
-    if !(payload.mime_type.starts_with("image/") || payload.mime_type.starts_with("video/")) {
-        return Err(
-            AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
-                "provider": "character-animation",
-                "field": field,
-                "message": "媒体资源必须是图片或视频。",
-            })),
-        );
+    let payload = load_media_source_payload_with_client(state, http_client, source, None).await?;
+    validate_editor_character_animation_reference_content_type(
+        payload.mime_type.as_str(),
+        field,
+        expected_kind,
+    )?;
+    Ok(media_payload_as_data_url(&payload))
+}
+
+async fn validate_editor_character_animation_source_resource(
+    state: &AppState,
+    owner_user_id: &str,
+    project_id: Option<&str>,
+    input_mode: EditorCharacterAnimationInputMode,
+    source_resource_id: Option<&str>,
+    reference_object_key: Option<&str>,
+) -> Result<Option<String>, AppError> {
+    let Some(source_resource_id) = source_resource_id
+        .map(str::trim)
+        .filter(|value| !value.is_empty())
+    else {
+        return Ok(None);
+    };
+    if input_mode == EditorCharacterAnimationInputMode::Text {
+        return Err(editor_character_animation_bad_request(
+            "文本模式不能携带 sourceResourceId。",
+        ));
     }
-    let _ = http_client;
-    Ok(format!(
-        "data:{};base64,{}",
-        payload.mime_type,
-        encode_base64(payload.bytes.as_slice())
-    ))
+    let project_id = project_id
+        .map(str::trim)
+        .filter(|value| !value.is_empty())
+        .ok_or_else(|| {
+            editor_character_animation_bad_request(
+                "sourceResourceId 必须与当前 projectId 一起使用。",
+            )
+        })?;
+    let reference_object_key = reference_object_key
+        .map(str::trim)
+        .map(|value| value.trim_start_matches('/'))
+        .filter(|value| !value.is_empty())
+        .ok_or_else(|| {
+            editor_character_animation_bad_request("sourceResourceId 必须指向本次使用的参考素材。")
+        })?;
+
+    let project = state
+        .spacetime_client()
+        .get_editor_project(EditorProjectGetRecordInput {
+            project_id: project_id.to_string(),
+            owner_user_id: owner_user_id.to_string(),
+        })
+        .await
+        .map_err(map_editor_project_error)?;
+    let resource = project
+        .resources
+        .iter()
+        .find(|resource| resource.resource_id.trim() == source_resource_id)
+        .ok_or_else(|| {
+            editor_character_animation_bad_request("sourceResourceId 不属于当前画布项目。")
+        })?;
+    if project.owner_user_id.trim() != owner_user_id.trim()
+        || resource.owner_user_id.trim() != owner_user_id.trim()
+        || resource.project_id.trim() != project_id
+    {
+        return Err(editor_character_animation_bad_request(
+            "sourceResourceId 不属于当前账号或当前画布项目。",
+        ));
+    }
+    let resource_object_key = normalize_editor_record_object_key(
+        resource.object_key.as_deref(),
+        resource.image_src.as_str(),
+    )
+    .ok_or_else(|| {
+        editor_character_animation_bad_request("sourceResourceId 缺少稳定 objectKey。")
+    })?;
+    if resource_object_key != reference_object_key {
+        return Err(editor_character_animation_bad_request(
+            "sourceResourceId 与本次参考素材不一致。",
+        ));
+    }
+    Ok(Some(source_resource_id.to_string()))
+}
+
+async fn resolve_editor_character_animation_reference_image(
+    state: &AppState,
+    http_client: &reqwest::Client,
+    source: &str,
+    field: &str,
+) -> Result<ResolvedEditorCharacterAnimationReferenceImage, AppError> {
+    let payload = load_media_source_payload_with_client(state, http_client, source, None).await?;
+    validate_editor_character_animation_reference_content_type(
+        payload.mime_type.as_str(),
+        field,
+        EditorCharacterAnimationReferenceMediaKind::Image,
+    )?;
+    let reader = ImageReader::new(Cursor::new(payload.bytes.as_slice()))
+        .with_guessed_format()
+        .map_err(|error| {
+            AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+                "provider": "editor-character-animation",
+                "field": field,
+                "message": format!("参考图片格式无法识别：{error}"),
+            }))
+        })?;
+    let mut decoder = reader.into_decoder().map_err(|error| {
+        AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+            "provider": "editor-character-animation",
+            "field": field,
+            "message": format!("参考图片无法解码：{error}"),
+        }))
+    })?;
+    let orientation = decoder.orientation().map_err(|error| {
+        AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+            "provider": "editor-character-animation",
+            "field": field,
+            "message": format!("参考图片方向信息无法解析：{error}"),
+        }))
+    })?;
+    let mut decoded = DynamicImage::from_decoder(decoder).map_err(|error| {
+        AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+            "provider": "editor-character-animation",
+            "field": field,
+            "message": format!("参考图片无法解码：{error}"),
+        }))
+    })?;
+    decoded.apply_orientation(orientation);
+    if decoded.width() == 0 || decoded.height() == 0 {
+        return Err(editor_character_animation_bad_request(
+            "参考图片缺少可识别的媒体宽高。",
+        ));
+    }
+    Ok(ResolvedEditorCharacterAnimationReferenceImage {
+        data_url: media_payload_as_data_url(&payload),
+        width: decoded.width(),
+        height: decoded.height(),
+    })
+}
+
+async fn validate_editor_character_animation_reference_video_object(
+    state: &AppState,
+    http_client: &reqwest::Client,
+    owner_user_id: &str,
+    object_key: &str,
+    field: &str,
+    extraction_settings: &BackendFrameExtractionSettings,
+) -> Result<EditorCharacterAnimationReferenceVideoMetadata, AppError> {
+    let oss_client = require_oss_client(state)?;
+    let registered = state
+        .spacetime_client()
+        .get_asset_object_by_location(module_assets::AssetObjectLocationInput {
+            bucket: oss_client.config_bucket().to_string(),
+            object_key: object_key.to_string(),
+        })
+        .await
+        .map_err(map_editor_project_error)?;
+    if registered.as_ref().is_some_and(|asset_object| {
+        asset_object
+            .owner_user_id
+            .as_deref()
+            .map(str::trim)
+            .filter(|value| !value.is_empty())
+            .is_some_and(|value| value != owner_user_id.trim())
+    }) {
+        return Err(editor_character_animation_bad_request(
+            "参考素材的资产对象归属与当前账号不一致。",
+        ));
+    }
+    let head = oss_client
+        .head_object(
+            http_client,
+            OssHeadObjectRequest {
+                object_key: object_key.to_string(),
+            },
+        )
+        .await
+        .map_err(map_character_animation_oss_error)?;
+    let content_type = head
+        .content_type
+        .as_deref()
+        .map(str::trim)
+        .filter(|value| !value.is_empty())
+        .or_else(|| {
+            registered
+                .as_ref()
+                .and_then(|asset_object| asset_object.content_type.as_deref())
+                .map(str::trim)
+                .filter(|value| !value.is_empty())
+        })
+        .unwrap_or("application/octet-stream");
+    validate_editor_character_animation_reference_content_type(
+        content_type,
+        field,
+        EditorCharacterAnimationReferenceMediaKind::Video,
+    )?;
+    validate_editor_character_animation_reference_video_content_length(head.content_length)?;
+
+    let payload = load_media_source_payload_with_client(
+        state,
+        http_client,
+        object_key,
+        Some(EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MAX_BYTES),
+    )
+    .await?;
+    validate_editor_character_animation_reference_content_type(
+        payload.mime_type.as_str(),
+        field,
+        EditorCharacterAnimationReferenceMediaKind::Video,
+    )?;
+    validate_editor_character_animation_reference_video_content_length(
+        u64::try_from(payload.bytes.len()).unwrap_or(u64::MAX),
+    )?;
+    let settings = extraction_settings.clone();
+    let metadata = tokio::task::spawn_blocking(move || {
+        probe_editor_character_animation_reference_video_metadata(payload, &settings)
+    })
+    .await
+    .map_err(|error| {
+        AppError::from_status(StatusCode::INTERNAL_SERVER_ERROR).with_details(json!({
+            "provider": "editor-character-animation",
+            "message": format!("参考视频规格探测任务异常结束：{error}"),
+        }))
+    })??;
+    validate_editor_character_animation_reference_video_duration(metadata.duration_seconds)?;
+    Ok(metadata)
+}
+
+fn probe_editor_character_animation_reference_video_metadata(
+    payload: MediaPayload,
+    extraction_settings: &BackendFrameExtractionSettings,
+) -> Result<EditorCharacterAnimationReferenceVideoMetadata, AppError> {
+    let temp_dir = create_animation_temp_dir()?;
+    let input_path = temp_dir.join(format!("reference.{}", payload.extension));
+    let result = (|| {
+        fs::write(&input_path, payload.bytes).map_err(|error| {
+            AppError::from_status(StatusCode::INTERNAL_SERVER_ERROR).with_details(json!({
+                "provider": "editor-character-animation",
+                "message": format!("写入参考视频临时文件失败：{error}"),
+            }))
+        })?;
+        let output = run_process_with_timeout(
+            &extraction_settings.ffprobe_path,
+            &[
+                "-v",
+                "error",
+                "-select_streams",
+                "v:0",
+                "-show_entries",
+                "stream=width,height:stream_tags=rotate:stream_side_data=rotation:format=duration",
+                "-of",
+                "json",
+                input_path.to_string_lossy().as_ref(),
+            ],
+            extraction_settings.timeout_ms,
+            "探测参考视频规格失败",
+        )?;
+        parse_editor_character_animation_reference_video_probe(output.stdout.as_slice())
+    })();
+    let _ = fs::remove_dir_all(&temp_dir);
+    result
+}
+
+fn parse_editor_character_animation_reference_video_probe(
+    stdout: &[u8],
+) -> Result<EditorCharacterAnimationReferenceVideoMetadata, AppError> {
+    let payload: Value = serde_json::from_slice(stdout).map_err(|error| {
+        AppError::from_status(StatusCode::BAD_GATEWAY).with_details(json!({
+            "provider": "editor-character-animation",
+            "message": format!("解析参考视频 FFprobe 输出失败：{error}"),
+        }))
+    })?;
+    let duration_seconds = payload
+        .get("format")
+        .and_then(|format| format.get("duration"))
+        .and_then(parse_ffprobe_f64)
+        .ok_or_else(|| {
+            AppError::from_status(StatusCode::BAD_GATEWAY).with_details(json!({
+                "provider": "editor-character-animation",
+                "message": "参考视频 FFprobe 输出缺少有效时长。",
+            }))
+        })?;
+    let stream = payload
+        .get("streams")
+        .and_then(Value::as_array)
+        .and_then(|streams| streams.first())
+        .ok_or_else(|| {
+            AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+                "provider": "editor-character-animation",
+                "message": "参考视频缺少可识别的视频流。",
+            }))
+        })?;
+    let mut width = stream
+        .get("width")
+        .and_then(parse_ffprobe_u32)
+        .filter(|value| *value > 0)
+        .ok_or_else(|| editor_character_animation_bad_request("参考视频缺少有效宽度。"))?;
+    let mut height = stream
+        .get("height")
+        .and_then(parse_ffprobe_u32)
+        .filter(|value| *value > 0)
+        .ok_or_else(|| editor_character_animation_bad_request("参考视频缺少有效高度。"))?;
+    if editor_character_animation_video_rotation_degrees(stream)
+        .is_some_and(|rotation| matches!(rotation.rem_euclid(360), 90 | 270))
+    {
+        std::mem::swap(&mut width, &mut height);
+    }
+    Ok(EditorCharacterAnimationReferenceVideoMetadata {
+        duration_seconds,
+        width,
+        height,
+    })
+}
+
+fn editor_character_animation_video_rotation_degrees(stream: &Value) -> Option<i32> {
+    stream
+        .get("side_data_list")
+        .and_then(Value::as_array)
+        .and_then(|entries| {
+            entries.iter().find_map(|entry| {
+                entry
+                    .get("rotation")
+                    .and_then(parse_ffprobe_f64)
+                    .map(|value| value.round() as i32)
+            })
+        })
+        .or_else(|| {
+            stream
+                .get("tags")
+                .and_then(|tags| tags.get("rotate"))
+                .and_then(parse_ffprobe_f64)
+                .map(|value| value.round() as i32)
+        })
+}
+
+fn parse_ffprobe_f64(value: &Value) -> Option<f64> {
+    value
+        .as_f64()
+        .or_else(|| value.as_str()?.trim().parse::<f64>().ok())
+        .filter(|value| value.is_finite())
+}
+
+fn parse_ffprobe_u32(value: &Value) -> Option<u32> {
+    value
+        .as_u64()
+        .and_then(|value| u32::try_from(value).ok())
+        .or_else(|| value.as_str()?.trim().parse::<u32>().ok())
 }
 
 async fn request_image_to_video_preview(
@@ -2241,6 +3070,97 @@ async fn request_editor_character_animation_preview(
     })
 }
 
+async fn request_editor_sequence_animation_text_or_video_preview(
+    state: &AppState,
+    http_client: &reqwest::Client,
+    settings: &EditorCharacterAnimationSettings,
+    caller: &EditorGenerationCaller,
+    source_layer_id: &str,
+    task_id: &str,
+    request: &NormalizedEditorCharacterAnimationRequest,
+    reference_object_key: Option<&str>,
+) -> Result<GeneratedAnimationPreview, AppError> {
+    let video_request =
+        build_editor_sequence_animation_video_request(settings, request, reference_object_key)?;
+    let video_settings = EditorVideoSettings {
+        ark: settings.ark.clone(),
+    };
+    let upstream_task_id = create_editor_text_to_video_task(
+        state,
+        http_client,
+        &video_settings,
+        caller.owner_user_id.as_str(),
+        &video_request,
+    )
+    .await?;
+    let video_url =
+        wait_for_ark_content_generation_task(http_client, &settings.ark, upstream_task_id.as_str())
+            .await?;
+    let preview_payload = download_generated_video(
+        http_client,
+        video_url.as_str(),
+        "下载Spine序列帧动画预览视频失败。",
+    )
+    .await?;
+    let persisted = put_generated_editor_character_animation_preview(
+        state,
+        caller,
+        source_layer_id,
+        task_id,
+        preview_payload,
+    )
+    .await?;
+
+    Ok(GeneratedAnimationPreview {
+        preview_video_path: persisted.legacy_public_path,
+        object_key: Some(persisted.object_key),
+        asset_object_id: Some(persisted.asset_object_id),
+        thumbnail_src: None,
+        prepared_asset_objects: vec![(
+            EDITOR_CHARACTER_ANIMATION_PREVIEW_RESULT_SLOT.to_string(),
+            persisted.prepared_asset_object,
+        )],
+        upstream_task_id,
+        submitted_prompt: request.prompt.clone(),
+        moderation_fallback_applied: false,
+    })
+}
+
+fn build_editor_sequence_animation_video_request(
+    settings: &EditorCharacterAnimationSettings,
+    request: &NormalizedEditorCharacterAnimationRequest,
+    reference_object_key: Option<&str>,
+) -> Result<NormalizedEditorVideoRequest, AppError> {
+    let reference_video_srcs = match request.input_mode {
+        EditorCharacterAnimationInputMode::Text => Vec::new(),
+        EditorCharacterAnimationInputMode::Video => {
+            vec![reference_object_key.map(str::to_string).ok_or_else(|| {
+                editor_character_animation_bad_request("视频模式必须提供参考视频。")
+            })?]
+        }
+        EditorCharacterAnimationInputMode::Image => {
+            return Err(editor_character_animation_bad_request(
+                "图片模式必须使用图片首尾帧生成链路。",
+            ));
+        }
+    };
+    Ok(NormalizedEditorVideoRequest {
+        prompt: request.prompt.clone(),
+        model: EDITOR_CHARACTER_ANIMATION_MODEL.to_string(),
+        provider_model: settings.ark.model.clone(),
+        aspect_ratio: request.ratio.clone(),
+        resolution: request.resolution.clone(),
+        duration_seconds: request.duration_seconds,
+        generate_audio: false,
+        price_mud_points: request.price_mud_points,
+        width: request.frame_width,
+        height: request.frame_height,
+        reference_image_srcs: Vec::new(),
+        reference_video_srcs,
+        reference_audio_srcs: Vec::new(),
+    })
+}
+
 async fn request_editor_video_preview(
     state: &AppState,
     http_client: &reqwest::Client,
@@ -4061,84 +4981,6 @@ fn resolve_character_animation_model(payload: &CharacterAnimationGenerateRequest
     normalize_required_text(candidate, CHARACTER_ANIMATION_MODEL)
 }
 
-#[cfg(test)]
-fn normalize_editor_character_animation_request(
-    payload: EditorCharacterAnimationGenerateRequest,
-) -> Result<NormalizedEditorCharacterAnimationRequest, AppError> {
-    let pricing = crate::editor_generation_config::load_editor_generation_pricing_from_paths(None)
-        .expect("默认模型定价配置必须合法");
-    normalize_editor_character_animation_request_with_pricing(
-        payload,
-        &pricing,
-        crate::editor_green_screen::default_editor_screen_background_color(),
-    )
-}
-
-fn normalize_editor_character_animation_request_with_pricing(
-    payload: EditorCharacterAnimationGenerateRequest,
-    pricing: &EditorGenerationPricingConfig,
-    screen_color: EditorScreenBackgroundColor,
-) -> Result<NormalizedEditorCharacterAnimationRequest, AppError> {
-    let source_layer_id = normalize_required_text(payload.source_layer_id.as_str(), "");
-    if source_layer_id.is_empty() {
-        return Err(editor_character_animation_bad_request(
-            "sourceLayerId 不能为空。",
-        ));
-    }
-    // 源图在 handler 里已提前解析（决策要看图）；这里保留空值校验，队列路径入队前也走这份校验。
-    trim_optional_text(Some(payload.source_image_src.as_str()))
-        .ok_or_else(|| editor_character_animation_bad_request("sourceImageSrc 不能为空。"))?;
-    let prompt_text = payload
-        .prompt_text
-        .trim()
-        .chars()
-        .take(4000)
-        .collect::<String>();
-    if prompt_text.is_empty() {
-        return Err(editor_character_animation_bad_request("动画描述不能为空。"));
-    }
-    let resolution = normalize_editor_character_animation_resolution(payload.resolution.as_str())?;
-    let ratio = normalize_editor_character_animation_ratio(payload.ratio.as_str())?;
-    let frame_count = normalize_editor_character_animation_frame_count(payload.frame_count)?;
-    let duration_seconds =
-        normalize_editor_character_animation_duration(payload.duration_seconds, frame_count)?;
-    let expected_price = pricing.character_animation_model_mud_points(
-        Some(payload.model.as_str()),
-        resolution,
-        duration_seconds,
-    );
-    if payload.model.trim() != EDITOR_CHARACTER_ANIMATION_MODEL {
-        return Err(editor_character_animation_bad_request(
-            "model 必须固定为 seedance2.0-fast。",
-        ));
-    }
-    let (frame_width, frame_height) = resolve_editor_character_animation_frame_size(
-        payload.source_width,
-        payload.source_height,
-        ratio,
-        resolution,
-    );
-    let prompt = build_editor_character_animation_prompt(prompt_text.as_str(), screen_color);
-
-    Ok(NormalizedEditorCharacterAnimationRequest {
-        source_layer_id,
-        prompt,
-        screen_color,
-        resolution: resolution.to_string(),
-        ratio: resolve_editor_character_animation_provider_ratio(
-            ratio,
-            payload.source_width,
-            payload.source_height,
-        ),
-        frame_count,
-        duration_seconds,
-        price_mud_points: expected_price,
-        frame_width,
-        frame_height,
-        fps: (frame_count / duration_seconds).max(1),
-    })
-}
-
 fn require_editor_character_animation_settings(
     state: &AppState,
     request: &NormalizedEditorCharacterAnimationRequest,
@@ -4664,132 +5506,6 @@ fn editor_video_bad_request(message: impl Into<String>) -> AppError {
     }))
 }
 
-fn build_editor_character_animation_prompt(
-    prompt_text: &str,
-    screen_color: EditorScreenBackgroundColor,
-) -> String {
-    format!(
-        "生成游戏角色动画，参考图作为首帧和尾帧，画面中心构图，角色主体完整置于画面中央，禁止镜头透视，禁止特写。{}；禁止出现建筑、室内布景、风景、地面道具、漂浮物、烟雾叙事元素、文字或其他角色以外的场景内容。\n动作描述：\n{}",
-        editor_green_screen_character_prompt_clause(screen_color),
-        prompt_text.trim()
-    )
-}
-
-fn normalize_editor_character_animation_resolution(value: &str) -> Result<&'static str, AppError> {
-    match value.trim() {
-        "480p" => Ok("480p"),
-        "720p" => Ok("720p"),
-        _ => Err(editor_character_animation_bad_request(
-            "resolution 只支持 480p 或 720p。",
-        )),
-    }
-}
-
-fn normalize_editor_character_animation_ratio(value: &str) -> Result<&'static str, AppError> {
-    match value.trim() {
-        "same" => Ok("same"),
-        "1:1" => Ok("1:1"),
-        "4:3" => Ok("4:3"),
-        "16:9" => Ok("16:9"),
-        "9:16" => Ok("9:16"),
-        "3:4" => Ok("3:4"),
-        _ => Err(editor_character_animation_bad_request(
-            "ratio 只支持 same、1:1、4:3、16:9、9:16、3:4。",
-        )),
-    }
-}
-
-fn normalize_editor_character_animation_frame_count(value: u32) -> Result<u32, AppError> {
-    match value {
-        32 | 40 | 48 => Ok(value),
-        _ => Err(editor_character_animation_bad_request(
-            "frameCount 只支持 32、40、48。",
-        )),
-    }
-}
-
-fn normalize_editor_character_animation_duration(
-    value: u32,
-    frame_count: u32,
-) -> Result<u32, AppError> {
-    let expected = match frame_count {
-        32 => 4,
-        40 => 5,
-        48 => 6,
-        _ => 0,
-    };
-    if value == expected {
-        Ok(value)
-    } else {
-        Err(editor_character_animation_bad_request(
-            "durationSeconds 必须与帧数组合为 32/4、40/5 或 48/6。",
-        ))
-    }
-}
-
-fn resolve_editor_character_animation_provider_ratio(
-    ratio: &str,
-    source_width: u32,
-    source_height: u32,
-) -> String {
-    if ratio != "same" {
-        return ratio.to_string();
-    }
-    if source_width == 0 || source_height == 0 {
-        return "1:1".to_string();
-    }
-    let normalized = source_width as f32 / source_height as f32;
-    [
-        ("1:1", 1.0f32),
-        ("4:3", 4.0 / 3.0),
-        ("16:9", 16.0 / 9.0),
-        ("9:16", 9.0 / 16.0),
-        ("3:4", 3.0 / 4.0),
-    ]
-    .into_iter()
-    .min_by(|(_, left), (_, right)| {
-        (normalized - *left)
-            .abs()
-            .partial_cmp(&(normalized - *right).abs())
-            .unwrap_or(std::cmp::Ordering::Equal)
-    })
-    .map(|(value, _)| value.to_string())
-    .unwrap_or_else(|| "1:1".to_string())
-}
-
-fn resolve_editor_character_animation_frame_size(
-    source_width: u32,
-    source_height: u32,
-    ratio: &str,
-    resolution: &str,
-) -> (u32, u32) {
-    let long_edge = if resolution == "720p" { 720 } else { 480 };
-    let (ratio_width, ratio_height) = match ratio {
-        "same" if source_width > 0 && source_height > 0 => (source_width, source_height),
-        "4:3" => (4, 3),
-        "16:9" => (16, 9),
-        "9:16" => (9, 16),
-        "3:4" => (3, 4),
-        _ => (1, 1),
-    };
-    if ratio_width >= ratio_height {
-        let height =
-            ((long_edge as f32 * ratio_height as f32 / ratio_width as f32).round() as u32).max(1);
-        (long_edge, height)
-    } else {
-        let width =
-            ((long_edge as f32 * ratio_width as f32 / ratio_height as f32).round() as u32).max(1);
-        (width, long_edge)
-    }
-}
-
-fn editor_character_animation_bad_request(message: impl Into<String>) -> AppError {
-    AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
-        "provider": "editor-character-animation",
-        "message": message.into(),
-    }))
-}
-
 fn build_animation_generate_result_payload(generated: &CharacterAnimationGeneratedDraft) -> Value {
     match generated.preview_video_path.as_ref() {
         Some(preview_video_path) => json!({
@@ -4880,12 +5596,21 @@ async fn extract_animation_frames_from_preview_video(
     })?;
 
     let extraction_result = (|| {
-        let duration_seconds = probe_video_duration_seconds_or_known(
+        let probed_duration_seconds = probe_video_duration_seconds_or_known(
             &input_path,
             extraction_settings,
             known_duration_seconds,
         )?
         .max(0.001);
+        // 采样时间轴必须映射到请求时长（付费契约与声明 fps），不能直接用
+        // provider 实际时长。provider 返回更长视频时，若按全片均匀采样，帧会被压缩播放，
+        // 超出付费窗口的动作尾段也被带入；这里用 min(请求, 实际) 截取前段。仅当请求时长
+        // 缺失时才退回探测值。
+        let duration_seconds = known_duration_seconds
+            .filter(|value| value.is_finite() && *value > 0.0)
+            .map(|value| value.min(probed_duration_seconds))
+            .unwrap_or(probed_duration_seconds)
+            .max(0.001);
         let mut target_seconds = Vec::with_capacity(plan.frame_count as usize);
         let mut raw_frame_paths = Vec::with_capacity(plan.frame_count as usize);
         for frame_index in 0..plan.frame_count {
@@ -5396,8 +6121,19 @@ fn compute_contain_dimensions(
 async fn load_media_source_payload(
     state: &AppState,
     source: &str,
+) -> Result<MediaPayload, AppError> {
+    let http_client = build_upstream_http_client(SOURCE_IMAGE_RESOLVE_TIMEOUT_MS)?;
+    load_media_source_payload_with_client(state, &http_client, source, None).await
+}
+
+async fn load_media_source_payload_with_client(
+    state: &AppState,
+    http_client: &reqwest::Client,
+    source: &str,
+    max_bytes: Option<u64>,
 ) -> Result<MediaPayload, AppError> {
     if let Some(payload) = parse_media_data_url(source) {
+        validate_media_payload_download_size(payload.bytes.len(), max_bytes)?;
         return Ok(payload);
     }
 
@@ -5405,20 +6141,29 @@ async fn load_media_source_payload(
     let oss_client = require_oss_client(state)?;
     let head = oss_client
         .head_object(
-            &reqwest::Client::new(),
+            http_client,
             OssHeadObjectRequest {
                 object_key: object_key.clone(),
             },
         )
         .await
         .map_err(map_character_animation_oss_error)?;
+    if let Some(max_bytes) = max_bytes {
+        validate_editor_character_animation_reference_video_content_length(head.content_length)?;
+        if head.content_length > max_bytes {
+            return Err(editor_character_animation_bad_request(format!(
+                "参考媒体单个不能超过{}MB。",
+                max_bytes / 1024 / 1024
+            )));
+        }
+    }
     let signed = oss_client
         .sign_get_object_url(OssSignedGetObjectUrlRequest {
             object_key,
             expire_seconds: Some(60),
         })
         .map_err(map_character_animation_oss_error)?;
-    let bytes = reqwest::Client::new()
+    let mut response = http_client
         .get(signed.signed_url)
         .send()
         .await
@@ -5434,16 +6179,43 @@ async fn load_media_source_payload(
                 "provider": "aliyun-oss",
                 "message": format!("读取角色动作帧失败：{error}"),
             }))
-        })?
-        .bytes()
-        .await
-        .map_err(|error| {
+        })?;
+    if let (Some(max_bytes), Some(response_length)) = (max_bytes, response.content_length()) {
+        validate_editor_character_animation_reference_video_content_length(response_length)?;
+        if response_length > max_bytes {
+            return Err(editor_character_animation_bad_request(format!(
+                "参考媒体单个不能超过{}MB。",
+                max_bytes / 1024 / 1024
+            )));
+        }
+    }
+    let initial_capacity = usize::try_from(head.content_length.min(8 * 1024 * 1024)).unwrap_or(0);
+    let mut bytes = Vec::with_capacity(initial_capacity);
+    while let Some(chunk) = response.chunk().await.map_err(|error| {
+        AppError::from_status(StatusCode::BAD_GATEWAY).with_details(json!({
+            "provider": "aliyun-oss",
+            "message": format!("读取角色动作帧内容失败：{error}"),
+        }))
+    })? {
+        let next_len = bytes.len().checked_add(chunk.len()).ok_or_else(|| {
             AppError::from_status(StatusCode::BAD_GATEWAY).with_details(json!({
                 "provider": "aliyun-oss",
-                "message": format!("读取角色动作帧内容失败：{error}"),
+                "message": "读取角色动作帧内容时大小溢出。",
             }))
-        })?
-        .to_vec();
+        })?;
+        validate_media_payload_download_size(next_len, max_bytes)?;
+        bytes.extend_from_slice(chunk.as_ref());
+    }
+    if head.content_length != u64::try_from(bytes.len()).unwrap_or(u64::MAX) {
+        return Err(
+            AppError::from_status(StatusCode::BAD_GATEWAY).with_details(json!({
+                "provider": "aliyun-oss",
+                "message": "角色动作媒体对象下载长度与 OSS HEAD 不一致。",
+                "expectedContentLength": head.content_length,
+                "actualContentLength": bytes.len(),
+            })),
+        );
+    }
     let mime_type = head
         .content_type
         .unwrap_or_else(|| "application/octet-stream".to_string());
@@ -5456,6 +6228,32 @@ async fn load_media_source_payload(
     })
 }
 
+fn validate_media_payload_download_size(
+    content_length: usize,
+    max_bytes: Option<u64>,
+) -> Result<(), AppError> {
+    let Some(max_bytes) = max_bytes else {
+        return Ok(());
+    };
+    let content_length = u64::try_from(content_length).unwrap_or(u64::MAX);
+    validate_editor_character_animation_reference_video_content_length(content_length)?;
+    if content_length > max_bytes {
+        return Err(editor_character_animation_bad_request(format!(
+            "参考媒体单个不能超过{}MB。",
+            max_bytes / 1024 / 1024
+        )));
+    }
+    Ok(())
+}
+
+fn media_payload_as_data_url(payload: &MediaPayload) -> String {
+    format!(
+        "data:{};base64,{}",
+        payload.mime_type,
+        encode_base64(payload.bytes.as_slice())
+    )
+}
+
 fn parse_media_data_url(value: &str) -> Option<MediaPayload> {
     let body = value.trim().strip_prefix("data:")?;
     let (mime_type, data) = body.split_once(";base64,")?;
@@ -5893,25 +6691,6 @@ fn trim_optional_text(value: Option<&str>) -> Option<String> {
         .map(ToOwned::to_owned)
 }
 
-fn resolve_editor_character_animation_asset_label(value: Option<&str>) -> String {
-    trim_optional_text(value)
-        .unwrap_or_else(|| "角色动作".to_string())
-        .chars()
-        .take(EDITOR_ASSET_LABEL_MAX_CHARS)
-        .collect()
-}
-
-fn editor_character_animation_source_asset_label(asset_label: &str) -> String {
-    let suffix = "（原始视频）";
-    let base_char_limit = EDITOR_ASSET_LABEL_MAX_CHARS.saturating_sub(suffix.chars().count());
-    let base = asset_label
-        .trim()
-        .chars()
-        .take(base_char_limit)
-        .collect::<String>();
-    format!("{base}{suffix}")
-}
-
 fn clamp_prompt_seed_text(value: Option<&str>) -> String {
     trim_optional_text(value)
         .unwrap_or_default()
@@ -6628,6 +7407,7 @@ struct ParsedAnimationJsonPayload {
     payload: Value,
 }
 
+#[derive(Clone)]
 struct ArkVideoSettings {
     base_url: String,
     api_key: String,
@@ -6646,21 +7426,6 @@ struct EditorVideoSettings {
     ark: ArkVideoSettings,
 }
 
-#[derive(Debug)]
-struct NormalizedEditorCharacterAnimationRequest {
-    source_layer_id: String,
-    prompt: String,
-    resolution: String,
-    ratio: String,
-    frame_count: u32,
-    duration_seconds: u32,
-    price_mud_points: u32,
-    frame_width: u32,
-    frame_height: u32,
-    fps: u32,
-    screen_color: EditorScreenBackgroundColor,
-}
-
 #[derive(Debug)]
 struct NormalizedEditorVideoRequest {
     prompt: String,
@@ -6689,6 +7454,7 @@ struct GeneratedAnimationPreview {
     moderation_fallback_applied: bool,
 }
 
+#[derive(Clone)]
 struct BackendFrameExtractionSettings {
     ffmpeg_path: String,
     ffprobe_path: String,
@@ -6736,6 +7502,19 @@ struct MediaPayload {
     bytes: Vec<u8>,
 }
 
+struct ResolvedEditorCharacterAnimationReferenceImage {
+    data_url: String,
+    width: u32,
+    height: u32,
+}
+
+#[derive(Clone, Copy, Debug, PartialEq)]
+struct EditorCharacterAnimationReferenceVideoMetadata {
+    duration_seconds: f64,
+    width: u32,
+    height: u32,
+}
+
 // 发布整套动作后，当前阶段只需要把旧前端依赖的 animationMap 返回出去。
 struct PublishedAnimationSet {
     animation_map: Value,
@@ -6752,6 +7531,32 @@ mod tests {
     use super::*;
     use crate::AppConfig;
 
+    fn editor_character_animation_test_request() -> EditorCharacterAnimationGenerateRequest {
+        EditorCharacterAnimationGenerateRequest {
+            source_layer_id: "layer-hero".to_string(),
+            source_image_src: "/generated-characters/hero/master.png".to_string(),
+            source_width: 1024,
+            source_height: 1024,
+            input_mode: None,
+            reference_media_type: None,
+            reference_src: None,
+            prompt_text: "待机呼吸".to_string(),
+            background_color: None,
+            screen_color: None,
+            resolution: "480p".to_string(),
+            ratio: "same".to_string(),
+            frame_count: 32,
+            duration_seconds: 4,
+            model: EDITOR_CHARACTER_ANIMATION_MODEL.to_string(),
+            project_id: None,
+            canvas_completion: None,
+            generation_inputs: None,
+            source_resource_id: None,
+            asset_folder_id: None,
+            asset_label: None,
+        }
+    }
+
     fn editor_character_animation_test_asset_object(
         asset_object_id: &str,
         object_key: &str,
@@ -6989,65 +7794,6 @@ mod tests {
         assert_eq!(resolve_character_animation_model(&payload), "wan-move");
     }
 
-    #[test]
-    fn editor_character_animation_normalizes_seedance_request_contract() {
-        let normalized =
-            normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
-                source_layer_id: " layer-hero ".to_string(),
-                source_image_src: "/generated-characters/hero/master.png".to_string(),
-                source_width: 768,
-                source_height: 1024,
-                prompt_text: "待机呼吸，轻微摆动。".to_string(),
-                screen_color: None,
-                resolution: "720p".to_string(),
-                ratio: "same".to_string(),
-                frame_count: 48,
-                duration_seconds: 6,
-                model: EDITOR_CHARACTER_ANIMATION_MODEL.to_string(),
-                project_id: None,
-                canvas_completion: None,
-                generation_inputs: None,
-                source_resource_id: None,
-                asset_folder_id: None,
-                asset_label: Some(" 勇者待机 ".to_string()),
-            })
-            .expect("editor request should normalize");
-
-        assert_eq!(normalized.source_layer_id, "layer-hero");
-        assert_eq!(normalized.frame_count, 48);
-        assert_eq!(normalized.duration_seconds, 6);
-        assert_eq!(normalized.price_mud_points, 120);
-        assert_eq!(normalized.fps, 8);
-        assert_eq!(normalized.frame_width, 540);
-        assert_eq!(normalized.frame_height, 720);
-        assert_eq!(normalized.ratio, "3:4");
-        assert_eq!(
-            resolve_editor_character_animation_asset_label(Some(" 勇者待机 ")),
-            "勇者待机"
-        );
-        assert_eq!(
-            resolve_editor_character_animation_asset_label(Some("   ")),
-            "角色动作"
-        );
-        assert_eq!(
-            resolve_editor_character_animation_asset_label(Some("动".repeat(81).as_str()))
-                .chars()
-                .count(),
-            EDITOR_ASSET_LABEL_MAX_CHARS
-        );
-        assert_eq!(
-            editor_character_animation_source_asset_label("勇者待机"),
-            "勇者待机（原始视频）"
-        );
-        let long_source_label =
-            editor_character_animation_source_asset_label("动".repeat(80).as_str());
-        assert_eq!(
-            long_source_label.chars().count(),
-            EDITOR_ASSET_LABEL_MAX_CHARS
-        );
-        assert!(long_source_label.ends_with("（原始视频）"));
-    }
-
     #[test]
     fn editor_character_animation_uses_fast_seedance_provider_model() {
         let config = AppConfig {
@@ -7063,7 +7809,11 @@ mod tests {
                 source_image_src: "/generated-characters/hero/master.png".to_string(),
                 source_width: 1024,
                 source_height: 1024,
+                input_mode: None,
+                reference_media_type: None,
+                reference_src: None,
                 prompt_text: "待机呼吸".to_string(),
+                background_color: None,
                 screen_color: None,
                 resolution: "480p".to_string(),
                 ratio: "same".to_string(),
@@ -7086,45 +7836,81 @@ mod tests {
     }
 
     #[test]
-    fn editor_character_animation_rejects_invalid_frame_duration_pair() {
-        let error =
+    fn editor_character_animation_builds_seedance_video_reference_request() {
+        let normalized =
             normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
-                source_layer_id: "layer-hero".to_string(),
-                source_image_src: "/generated-characters/hero/master.png".to_string(),
-                source_width: 1024,
-                source_height: 1024,
-                prompt_text: "奔跑".to_string(),
-                screen_color: None,
-                resolution: "480p".to_string(),
-                ratio: "1:1".to_string(),
-                frame_count: 48,
-                duration_seconds: 4,
-                model: EDITOR_CHARACTER_ANIMATION_MODEL.to_string(),
-                project_id: None,
-                canvas_completion: None,
-                generation_inputs: None,
-                source_resource_id: None,
-                asset_folder_id: None,
-                asset_label: None,
+                source_layer_id: String::new(),
+                source_image_src: String::new(),
+                input_mode: Some("video".to_string()),
+                reference_media_type: Some("video".to_string()),
+                reference_src: Some("users/owner/reference/action.mp4".to_string()),
+                prompt_text: "复刻参考视频的奔跑节奏".to_string(),
+                background_color: Some("blue".to_string()),
+                ratio: "16:9".to_string(),
+                frame_count: 40,
+                duration_seconds: 5,
+                ..editor_character_animation_test_request()
             })
-            .expect_err("invalid frame/duration pair should fail");
+            .expect("video mode should normalize");
+        let config = AppConfig {
+            ark_character_video_base_url: "https://ark.example.com/api/v3".to_string(),
+            ark_character_video_api_key: Some("ark-key".to_string()),
+            ..AppConfig::default()
+        };
+        let state = AppState::new(config).expect("state should build");
+        let settings = require_editor_character_animation_settings(&state, &normalized)
+            .expect("settings should normalize");
+        let video_request = build_editor_sequence_animation_video_request(
+            &settings,
+            &normalized,
+            Some("users/owner/reference/action.mp4"),
+        )
+        .expect("video request should build");
 
-        assert!(error.body_text().contains("durationSeconds 必须与帧数组合"));
+        assert_eq!(
+            normalized.input_mode,
+            EditorCharacterAnimationInputMode::Video
+        );
+        assert_eq!(normalized.source_layer_id, "sequence-animation-video");
+        assert_eq!(normalized.screen_color.hex, "#0000FF");
+        assert_eq!(video_request.provider_model, CHARACTER_ANIMATION_MODEL);
+        assert_eq!(video_request.aspect_ratio, "16:9");
+        assert_eq!(video_request.duration_seconds, 5);
+        assert!(!video_request.generate_audio);
+        assert_eq!(
+            video_request.reference_video_srcs,
+            vec!["users/owner/reference/action.mp4".to_string()]
+        );
+        assert!(video_request.reference_image_srcs.is_empty());
+        assert!(video_request.reference_audio_srcs.is_empty());
     }
 
     #[test]
-    fn editor_character_animation_builds_required_screen_background_prompt() {
-        let color = crate::editor_green_screen::default_editor_screen_background_color();
-        let prompt = build_editor_character_animation_prompt("行走两步后回到站姿。", color);
+    fn editor_character_animation_frame_split_reuses_existing_asset_objects() {
+        let source = include_str!("character_animation_assets.rs");
+        let body = source
+            .split_once("pub async fn split_editor_character_animation_frames")
+            .and_then(|(_, tail)| {
+                tail.split_once("pub(crate) async fn enqueue_editor_character_animation_for_owner")
+                    .map(|(body, _)| body)
+            })
+            .expect("frame split handler should exist");
 
-        assert!(prompt.contains("生成游戏角色动画"));
-        assert!(prompt.contains("参考图作为首帧和尾帧"));
-        assert!(prompt.contains(color.hex));
-        assert!(prompt.contains("纯色背景必须平整无纹理、无渐变、无阴影"));
-        assert!(
-            prompt.contains("角色主体及其服饰、道具的颜色必须与背景色明显区分，不得带与背景色相同或相近的描边、投影或反光")
+        assert!(body.contains("get_asset_object("));
+        assert!(body.contains("persist_editor_spritesheet_slice_batch("));
+        assert!(body.contains("asset_object: module_assets::AssetObjectUpsertInput"));
+        assert!(!body.contains("put_character_animation_object("));
+        assert!(!body.contains("resolve_media_source_as_data_url("));
+        assert_function_contains_in_order(
+            source,
+            "pub async fn split_editor_character_animation_frames",
+            "pub(crate) async fn enqueue_editor_character_animation_for_owner",
+            &[
+                "preflight_editor_billable_generation_target",
+                "character_animation_frame_split_operation_id",
+                "persist_editor_spritesheet_slice_batch",
+            ],
         );
-        assert!(prompt.contains("动作描述：\n行走两步后回到站姿。"));
     }
 
     #[test]
@@ -7256,7 +8042,7 @@ mod tests {
             "pub async fn generate_editor_video",
             &[
                 "resolve_editor_reference_object_key_for_owner",
-                "resolve_media_source_as_data_url",
+                "resolve_editor_character_animation_reference_image",
             ],
         );
         assert!(matches_inline_media_source("data:image/png;base64,AAAA"));
@@ -7725,6 +8511,126 @@ mod tests {
         );
     }
 
+    #[test]
+    fn editor_character_animation_rebuilds_authoritative_inputs_before_billing() {
+        let source = include_str!("character_animation_assets.rs");
+        assert_function_contains_in_order(
+            source,
+            "pub(crate) async fn generate_editor_character_animation_for_owner",
+            "pub async fn generate_editor_video",
+            &[
+                "validate_editor_character_animation_reference_video_object",
+                "validate_editor_character_animation_source_resource",
+                "build_authoritative_editor_character_animation_generation_inputs",
+                "rebuild_editor_generation_input_references",
+                "execute_billable_asset_operation_with_cost",
+            ],
+        );
+
+        assert_function_contains_in_order(
+            source,
+            "async fn validate_editor_character_animation_reference_video_object",
+            "fn probe_editor_character_animation_reference_video_metadata",
+            &[
+                "validate_editor_character_animation_reference_video_content_length",
+                "load_media_source_payload_with_client",
+                "probe_editor_character_animation_reference_video_metadata",
+            ],
+        );
+
+        let generation_body = source
+            .split_once("pub(crate) async fn generate_editor_character_animation_for_owner")
+            .and_then(|(_, tail)| {
+                tail.split_once("pub async fn generate_editor_video")
+                    .map(|(body, _)| body)
+            })
+            .expect("character animation generation function");
+        let video_validation = generation_body
+            .find("validate_editor_character_animation_reference_video_object")
+            .expect("video validation should exist");
+        let dimension_override = generation_body[video_validation..]
+            .find("apply_editor_character_animation_authoritative_reference_dimensions")
+            .map(|offset| video_validation + offset)
+            .expect("authoritative dimension override should follow video validation");
+        let renormalization = generation_body[dimension_override..]
+            .find("normalize_editor_character_animation_request_with_pricing")
+            .map(|offset| dimension_override + offset)
+            .expect("request should be renormalized after the authoritative override");
+        let billing = generation_body
+            .find("execute_billable_asset_operation_with_cost")
+            .expect("billing boundary should exist");
+        assert!(video_validation < dimension_override);
+        assert!(dimension_override < renormalization);
+        assert!(renormalization < billing);
+    }
+
+    #[test]
+    fn editor_character_animation_reference_download_reuses_timeout_client_and_is_bounded() {
+        let source = include_str!("character_animation_assets.rs");
+        assert_function_contains(
+            source,
+            "async fn load_media_source_payload_with_client",
+            "fn validate_media_payload_download_size",
+            &[
+                "http_client",
+                ".head_object(",
+                ".get(signed.signed_url)",
+                "response.chunk()",
+                "validate_media_payload_download_size",
+            ],
+        );
+        let body = source
+            .split_once("async fn load_media_source_payload_with_client")
+            .and_then(|(_, tail)| {
+                tail.split_once("fn validate_media_payload_download_size")
+                    .map(|(body, _)| body)
+            })
+            .expect("controlled media loader should exist");
+        assert!(!body.contains("reqwest::Client::new"));
+    }
+
+    #[test]
+    fn editor_character_animation_parses_authoritative_video_probe_metadata() {
+        let metadata = parse_editor_character_animation_reference_video_probe(
+            br#"{
+                "streams": [{"width": 1080, "height": 1920}],
+                "format": {"duration": "6.250000"}
+            }"#,
+        )
+        .expect("valid ffprobe metadata should parse");
+
+        assert_eq!(
+            metadata,
+            EditorCharacterAnimationReferenceVideoMetadata {
+                duration_seconds: 6.25,
+                width: 1080,
+                height: 1920,
+            }
+        );
+
+        let rotated = parse_editor_character_animation_reference_video_probe(
+            br#"{
+                "streams": [{
+                    "width": 1920,
+                    "height": 1080,
+                    "side_data_list": [{"rotation": -90}]
+                }],
+                "format": {"duration": "4.000000"}
+            }"#,
+        )
+        .expect("display rotation should apply to authoritative dimensions");
+        assert_eq!((rotated.width, rotated.height), (1080, 1920));
+
+        let error = parse_editor_character_animation_reference_video_probe(
+            br#"{
+                "streams": [{"width": 0, "height": 1920}],
+                "format": {"duration": 6.25}
+            }"#,
+        )
+        .expect_err("zero authoritative dimensions should fail");
+        assert!(error.body_text().contains("有效宽度"));
+    }
+
     #[test]
     fn editor_character_animation_rejects_projectless_canvas_completion_before_billing() {
         let source = include_str!("character_animation_assets.rs");
diff --git a/server-rs/crates/api-server/src/editor_project.rs b/server-rs/crates/api-server/src/editor_project.rs
index b263aa632..609a325d6 100644
--- a/server-rs/crates/api-server/src/editor_project.rs
+++ b/server-rs/crates/api-server/src/editor_project.rs
@@ -26,6 +26,7 @@ use platform_oss::{
 use serde::{Deserialize, Serialize};
 use serde_json::{Value, json};
 use sha2::{Digest as _, Sha256};
+pub use shared_contracts::assets::EditorAssetPayload;
 #[cfg(test)]
 use shared_contracts::assets::EditorAudioGenerateResponse;
 use shared_contracts::assets::{
@@ -1813,43 +1814,6 @@ pub struct EditorAssetFolderPayload {
     updated_at: String,
 }
 
-#[derive(Debug, Serialize)]
-#[serde(rename_all = "camelCase")]
-pub struct EditorAssetPayload {
-    asset_id: String,
-    folder_id: String,
-    label: String,
-    image_src: String,
-    object_key: Option<String>,
-    asset_object_id: Option<String>,
-    width: u32,
-    height: u32,
-    source_type: String,
-    prompt: Option<String>,
-    actual_prompt: Option<String>,
-    #[serde(skip_serializing_if = "Option::is_none")]
-    model: Option<String>,
-    #[serde(skip_serializing_if = "Option::is_none")]
-    provider: Option<String>,
-    task_id: Option<String>,
-    asset_kind: Option<String>,
-    #[serde(skip_serializing_if = "Option::is_none")]
-    image_sequence_frames: Option<Value>,
-    #[serde(skip_serializing_if = "Option::is_none")]
-    image_sequence_duration_ms: Option<u64>,
-    generation_inputs: Option<Value>,
-    source_resource_id: Option<String>,
-    public_showcase_enabled: Option<bool>,
-    thumbnail_src: Option<String>,
-    generation_cost_mud_points: u64,
-    showcase_id: Option<String>,
-    showcase_review_status: Option<String>,
-    showcase_display_enabled: Option<bool>,
-    showcase_like_count: Option<u64>,
-    created_at: String,
-    updated_at: String,
-}
-
 pub async fn load_recent_editor_project(
     State(state): State<AppState>,
     Extension(request_context): Extension<RequestContext>,
diff --git a/server-rs/crates/api-server/src/editor_sequence_animation.rs b/server-rs/crates/api-server/src/editor_sequence_animation.rs
new file mode 100644
index 000000000..ab72ddd32
--- /dev/null
+++ b/server-rs/crates/api-server/src/editor_sequence_animation.rs
@@ -0,0 +1,1201 @@
+use axum::http::StatusCode;
+use serde_json::{Value, json};
+use shared_contracts::assets::{
+    EDITOR_ASSET_LABEL_MAX_CHARS, EditorCharacterAnimationGenerateRequest,
+};
+
+use crate::{
+    editor_generation_config::EditorGenerationPricingConfig,
+    editor_green_screen::{
+        EditorScreenBackgroundColor, editor_green_screen_character_prompt_clause,
+    },
+    http_error::AppError,
+};
+
+pub(crate) const EDITOR_CHARACTER_ANIMATION_MODEL: &str = "seedance2.0-fast";
+pub(crate) const EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MAX_BYTES: u64 = 50 * 1024 * 1024;
+const EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MIN_DURATION_SECONDS: f64 = 2.0;
+const EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MAX_DURATION_SECONDS: f64 = 15.0;
+
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
+pub(crate) enum EditorCharacterAnimationInputMode {
+    Text,
+    Image,
+    Video,
+}
+
+#[derive(Clone, Copy, Debug, PartialEq, Eq)]
+pub(crate) enum EditorCharacterAnimationReferenceMediaKind {
+    Image,
+    Video,
+}
+
+#[derive(Debug)]
+pub(crate) struct NormalizedEditorCharacterAnimationRequest {
+    pub(crate) input_mode: EditorCharacterAnimationInputMode,
+    pub(crate) source_layer_id: String,
+    pub(crate) reference_src: Option<String>,
+    pub(crate) prompt: String,
+    pub(crate) resolution: String,
+    pub(crate) ratio: String,
+    pub(crate) frame_count: u32,
+    pub(crate) duration_seconds: u32,
+    pub(crate) price_mud_points: u32,
+    pub(crate) frame_width: u32,
+    pub(crate) frame_height: u32,
+    pub(crate) fps: u32,
+    pub(crate) screen_color: EditorScreenBackgroundColor,
+    pub(crate) has_explicit_background_color: bool,
+}
+
+#[cfg(test)]
+pub(crate) fn normalize_editor_character_animation_request(
+    payload: EditorCharacterAnimationGenerateRequest,
+) -> Result<NormalizedEditorCharacterAnimationRequest, AppError> {
+    let pricing = crate::editor_generation_config::load_editor_generation_pricing_from_paths(None)
+        .expect("默认模型定价配置必须合法");
+    let screen_color =
+        parse_editor_character_animation_background_color(payload.background_color.as_deref())?;
+    normalize_editor_character_animation_request_with_pricing(payload, &pricing, screen_color)
+}
+
+pub(crate) fn normalize_editor_character_animation_request_with_pricing(
+    payload: EditorCharacterAnimationGenerateRequest,
+    pricing: &EditorGenerationPricingConfig,
+    screen_color: EditorScreenBackgroundColor,
+) -> Result<NormalizedEditorCharacterAnimationRequest, AppError> {
+    let input_mode = normalize_editor_character_animation_input_mode(
+        payload.input_mode.as_deref(),
+        payload.reference_media_type.as_deref(),
+        payload.reference_src.as_deref(),
+        payload.source_image_src.as_str(),
+    )?;
+    let source_layer_id = normalize_required_text(
+        payload.source_layer_id.as_str(),
+        match input_mode {
+            EditorCharacterAnimationInputMode::Text => "sequence-animation-text",
+            EditorCharacterAnimationInputMode::Image => "sequence-animation-image",
+            EditorCharacterAnimationInputMode::Video => "sequence-animation-video",
+        },
+    );
+    let reference_src = trim_optional_text(payload.reference_src.as_deref())
+        .or_else(|| trim_optional_text(Some(payload.source_image_src.as_str())));
+    if input_mode == EditorCharacterAnimationInputMode::Text && reference_src.is_some() {
+        return Err(editor_character_animation_bad_request(
+            "文本模式不能携带参考素材。",
+        ));
+    }
+    if input_mode != EditorCharacterAnimationInputMode::Text && reference_src.is_none() {
+        return Err(editor_character_animation_bad_request(
+            "图片或视频模式必须提供参考素材。",
+        ));
+    }
+    let prompt_text = payload
+        .prompt_text
+        .trim()
+        .chars()
+        .take(4000)
+        .collect::<String>();
+    if prompt_text.is_empty() {
+        return Err(editor_character_animation_bad_request("动画描述不能为空。"));
+    }
+    let resolution = normalize_editor_character_animation_resolution(payload.resolution.as_str())?;
+    let ratio = normalize_editor_character_animation_ratio(payload.ratio.as_str())?;
+    let frame_count = normalize_editor_character_animation_frame_count(payload.frame_count)?;
+    let duration_seconds =
+        normalize_editor_character_animation_duration(payload.duration_seconds, frame_count)?;
+    let expected_price = pricing.character_animation_model_mud_points(
+        Some(payload.model.as_str()),
+        resolution,
+        duration_seconds,
+    );
+    if payload.model.trim() != EDITOR_CHARACTER_ANIMATION_MODEL {
+        return Err(editor_character_animation_bad_request(
+            "model 必须固定为 seedance2.0-fast。",
+        ));
+    }
+    let provider_ratio = resolve_editor_character_animation_provider_ratio(
+        ratio,
+        payload.source_width,
+        payload.source_height,
+    );
+    // 帧尺寸必须与 provider 实际生成的宽高比一致。此前 'same' 比例用源图原始
+    // 宽高比计算帧尺寸，而 provider 只按最近标准比例生成，导致帧内 letterbox（角色小于
+    // 声明的 frame_width/height，画布缩放与预览不一致）。
+    let (frame_width, frame_height) = resolve_editor_character_animation_frame_size(
+        payload.source_width,
+        payload.source_height,
+        provider_ratio.as_str(),
+        resolution,
+    );
+    let fps = (frame_count / duration_seconds).max(1);
+    let prompt = build_editor_character_animation_prompt(
+        prompt_text.as_str(),
+        screen_color,
+        provider_ratio.as_str(),
+        resolution,
+        frame_count,
+        duration_seconds,
+        fps,
+    );
+    let has_explicit_background_color = payload
+        .background_color
+        .as_deref()
+        .map(str::trim)
+        .is_some_and(|value| !value.is_empty());
+
+    Ok(NormalizedEditorCharacterAnimationRequest {
+        input_mode,
+        source_layer_id,
+        reference_src,
+        prompt,
+        screen_color,
+        resolution: resolution.to_string(),
+        ratio: provider_ratio.to_string(),
+        frame_count,
+        duration_seconds,
+        price_mud_points: expected_price,
+        frame_width,
+        frame_height,
+        fps,
+        has_explicit_background_color,
+    })
+}
+
+pub(crate) fn build_editor_character_animation_frame_asset_label(
+    base_label: &str,
+    frame_number: usize,
+) -> String {
+    let suffix = format!(" 第{frame_number:03}帧");
+    let prefix_limit = EDITOR_ASSET_LABEL_MAX_CHARS.saturating_sub(suffix.chars().count());
+    let prefix = base_label
+        .trim()
+        .chars()
+        .take(prefix_limit)
+        .collect::<String>();
+    format!("{prefix}{suffix}")
+}
+
+pub(crate) fn resolve_editor_character_animation_asset_label(value: Option<&str>) -> String {
+    trim_optional_text(value)
+        .unwrap_or_else(|| "角色动作".to_string())
+        .chars()
+        .take(EDITOR_ASSET_LABEL_MAX_CHARS)
+        .collect()
+}
+
+pub(crate) fn editor_character_animation_source_asset_label(asset_label: &str) -> String {
+    let suffix = "（原始视频）";
+    let base_char_limit = EDITOR_ASSET_LABEL_MAX_CHARS.saturating_sub(suffix.chars().count());
+    let base = asset_label
+        .trim()
+        .chars()
+        .take(base_char_limit)
+        .collect::<String>();
+    format!("{base}{suffix}")
+}
+
+pub(crate) fn parse_editor_character_animation_background_color(
+    value: Option<&str>,
+) -> Result<EditorScreenBackgroundColor, AppError> {
+    let value = value.map(str::trim).filter(|value| !value.is_empty());
+    let color = match value.unwrap_or("green") {
+        "white" | "#FFFFFF" | "#ffffff" => EditorScreenBackgroundColor {
+            label: "纯白色",
+            hex: "#FFFFFF",
+            red: 255,
+            green: 255,
+            blue: 255,
+        },
+        "green" | "#00FF00" | "#00ff00" => EditorScreenBackgroundColor {
+            label: "纯绿色",
+            hex: "#00FF00",
+            red: 0,
+            green: 255,
+            blue: 0,
+        },
+        "blue" | "#0000FF" | "#0000ff" => EditorScreenBackgroundColor {
+            label: "纯蓝色",
+            hex: "#0000FF",
+            red: 0,
+            green: 0,
+            blue: 255,
+        },
+        "purple" | "#8000FF" | "#8000ff" => EditorScreenBackgroundColor {
+            label: "纯紫色",
+            hex: "#8000FF",
+            red: 128,
+            green: 0,
+            blue: 255,
+        },
+        _ => {
+            return Err(editor_character_animation_bad_request(
+                "backgroundColor 只支持 white、green、blue 或 purple。",
+            ));
+        }
+    };
+    Ok(color)
+}
+
+pub(crate) fn validate_editor_character_animation_reference_content_type(
+    content_type: &str,
+    field: &str,
+    expected_kind: EditorCharacterAnimationReferenceMediaKind,
+) -> Result<(), AppError> {
+    let normalized = content_type
+        .split(';')
+        .next()
+        .unwrap_or_default()
+        .trim()
+        .to_ascii_lowercase();
+    let matches = match expected_kind {
+        EditorCharacterAnimationReferenceMediaKind::Image => normalized.starts_with("image/"),
+        EditorCharacterAnimationReferenceMediaKind::Video => normalized.starts_with("video/"),
+    };
+    if matches {
+        return Ok(());
+    }
+    let message = match expected_kind {
+        EditorCharacterAnimationReferenceMediaKind::Image => "图片模式只能使用真实图片素材。",
+        EditorCharacterAnimationReferenceMediaKind::Video => "视频模式只能使用真实视频素材。",
+    };
+    Err(
+        AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+            "provider": "editor-character-animation",
+            "field": field,
+            "message": message,
+            "contentType": normalized,
+        })),
+    )
+}
+
+pub(crate) fn validate_editor_character_animation_reference_video_content_length(
+    content_length: u64,
+) -> Result<(), AppError> {
+    if content_length == 0 {
+        return Err(editor_character_animation_bad_request(
+            "参考视频不能为空文件。",
+        ));
+    }
+    if content_length > EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MAX_BYTES {
+        return Err(editor_character_animation_bad_request(
+            "参考视频单个不能超过 50MB。",
+        ));
+    }
+    Ok(())
+}
+
+pub(crate) fn validate_editor_character_animation_reference_video_duration(
+    duration_seconds: f64,
+) -> Result<(), AppError> {
+    if !duration_seconds.is_finite()
+        || !(EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MIN_DURATION_SECONDS
+            ..=EDITOR_CHARACTER_ANIMATION_REFERENCE_VIDEO_MAX_DURATION_SECONDS)
+            .contains(&duration_seconds)
+    {
+        return Err(editor_character_animation_bad_request(
+            "参考视频时长必须为 2-15 秒。",
+        ));
+    }
+    Ok(())
+}
+
+pub(crate) fn apply_editor_character_animation_authoritative_reference_dimensions(
+    payload: &mut EditorCharacterAnimationGenerateRequest,
+    input_mode: EditorCharacterAnimationInputMode,
+    width: u32,
+    height: u32,
+) -> Result<(), AppError> {
+    if input_mode == EditorCharacterAnimationInputMode::Text {
+        return Ok(());
+    }
+    if width == 0 || height == 0 {
+        return Err(editor_character_animation_bad_request(
+            "参考素材需要可识别的媒体宽高。",
+        ));
+    }
+    payload.source_width = width;
+    payload.source_height = height;
+    Ok(())
+}
+
+pub(crate) fn build_authoritative_editor_character_animation_generation_inputs(
+    client_generation_inputs: Option<Value>,
+    payload: &EditorCharacterAnimationGenerateRequest,
+    input_mode: EditorCharacterAnimationInputMode,
+    reference_object_key: Option<&str>,
+) -> Result<Value, AppError> {
+    const AUTHORITATIVE_FIELD_IDS: [&str; 11] = [
+        "inputMode",
+        "referenceSrc",
+        "referenceMediaType",
+        "referenceWidth",
+        "referenceHeight",
+        "prompt",
+        "backgroundColor",
+        "resolution",
+        "ratio",
+        "frameCount",
+        "durationSeconds",
+    ];
+
+    let prompt = payload
+        .prompt_text
+        .trim()
+        .chars()
+        .take(4000)
+        .collect::<String>();
+    if prompt.is_empty() {
+        return Err(editor_character_animation_bad_request("动画描述不能为空。"));
+    }
+    let resolution = normalize_editor_character_animation_resolution(payload.resolution.as_str())?;
+    // generationInputs 保存用户请求语义；same 不能被 provider 使用的具体比例覆盖。
+    let ratio = normalize_editor_character_animation_ratio(payload.ratio.as_str())?;
+    let frame_count = normalize_editor_character_animation_frame_count(payload.frame_count)?;
+    let duration_seconds =
+        normalize_editor_character_animation_duration(payload.duration_seconds, frame_count)?;
+
+    let input_mode_value = match input_mode {
+        EditorCharacterAnimationInputMode::Text => "text",
+        EditorCharacterAnimationInputMode::Image => "image",
+        EditorCharacterAnimationInputMode::Video => "video",
+    };
+    let mut fields = vec![json!({
+        "id": "inputMode",
+        "title": "输入模式",
+        "value": input_mode_value,
+    })];
+    let mut reference_slots = Vec::new();
+    if input_mode != EditorCharacterAnimationInputMode::Text {
+        let reference_object_key = reference_object_key
+            .map(str::trim)
+            .map(|value| value.trim_start_matches('/'))
+            .filter(|value| !value.is_empty())
+            .ok_or_else(|| {
+                editor_character_animation_bad_request("参考素材缺少稳定 objectKey。")
+            })?;
+        if payload.source_width == 0 || payload.source_height == 0 {
+            return Err(editor_character_animation_bad_request(
+                "参考素材需要可识别的媒体宽高。",
+            ));
+        }
+        let (reference_title, reference_media_type) = match input_mode {
+            EditorCharacterAnimationInputMode::Image => ("角色图片", "image"),
+            EditorCharacterAnimationInputMode::Video => ("参考视频", "video"),
+            EditorCharacterAnimationInputMode::Text => unreachable!(),
+        };
+        fields.extend([
+            json!({ "id": "referenceSrc", "title": "参考素材", "value": reference_object_key }),
+            json!({ "id": "referenceMediaType", "title": "参考类型", "value": reference_media_type }),
+            json!({ "id": "referenceWidth", "title": "参考宽度", "value": payload.source_width }),
+            json!({ "id": "referenceHeight", "title": "参考高度", "value": payload.source_height }),
+        ]);
+        reference_slots.push(json!({ "id": "source", "title": reference_title }));
+    }
+    fields.push(json!({ "id": "prompt", "title": "动作描述", "value": prompt }));
+
+    let has_explicit_background_color = payload
+        .background_color
+        .as_deref()
+        .map(str::trim)
+        .is_some_and(|value| !value.is_empty());
+    let background_color = if has_explicit_background_color {
+        let color =
+            parse_editor_character_animation_background_color(payload.background_color.as_deref())?;
+        Some(match color.hex {
+            "#FFFFFF" => "white",
+            "#00FF00" => "green",
+            "#0000FF" => "blue",
+            "#8000FF" => "purple",
+            _ => unreachable!("character animation parser only returns supported colors"),
+        })
+    } else if input_mode != EditorCharacterAnimationInputMode::Image {
+        // 新面板的文本 / 视频模式没有自动选色来源，默认绿色也必须可恢复。
+        Some("green")
+    } else {
+        // 旧图片入口缺省时仍为自动选色，不能把运行时决策误写成用户选择。
+        None
+    };
+    if let Some(background_color) = background_color {
+        fields.push(json!({
+            "id": "backgroundColor",
+            "title": "背景颜色",
+            "value": background_color,
+        }));
+    }
+    fields.extend([
+        json!({ "id": "resolution", "title": "清晰度", "value": resolution }),
+        json!({ "id": "ratio", "title": "比例", "value": ratio }),
+        json!({ "id": "frameCount", "title": "帧数", "value": frame_count }),
+        json!({ "id": "durationSeconds", "title": "时长", "value": duration_seconds }),
+    ]);
+
+    // 只保留客户端未来扩展字段；所有会影响本次执行与恢复的字段由服务端覆盖。
+    if let Some(client_fields) = client_generation_inputs
+        .as_ref()
+        .and_then(|value| value.get("fields"))
+        .and_then(Value::as_array)
+    {
+        fields.extend(
+            client_fields
+                .iter()
+                .filter(|field| {
+                    let Some(field) = field.as_object() else {
+                        return false;
+                    };
+                    let valid_title = field
+                        .get("title")
+                        .and_then(Value::as_str)
+                        .map(str::trim)
+                        .is_some_and(|title| !title.is_empty());
+                    let valid_value = field.get("value").is_some_and(|value| {
+                        value.is_string() || value.is_number() || value.is_boolean()
+                    });
+                    let valid_id = match field.get("id") {
+                        Some(Value::String(id)) => !id.trim().is_empty(),
+                        Some(_) => false,
+                        None => true,
+                    };
+                    let authoritative = field
+                        .get("id")
+                        .and_then(Value::as_str)
+                        .is_some_and(|id| AUTHORITATIVE_FIELD_IDS.contains(&id.trim()));
+                    valid_title && valid_value && valid_id && !authoritative
+                })
+                .cloned(),
+        );
+    }
+
+    let mut result = client_generation_inputs
+        .and_then(|value| value.as_object().cloned())
+        .unwrap_or_default();
+    result.insert("version".to_string(), json!(2));
+    result.insert("action".to_string(), json!("character-animation.generate"));
+    result.insert("fields".to_string(), Value::Array(fields));
+    result.insert("references".to_string(), Value::Array(reference_slots));
+    Ok(Value::Object(result))
+}
+
+pub(crate) fn editor_character_animation_bad_request(message: impl Into<String>) -> AppError {
+    AppError::from_status(StatusCode::BAD_REQUEST).with_details(json!({
+        "provider": "editor-character-animation",
+        "message": message.into(),
+    }))
+}
+
+fn normalize_editor_character_animation_input_mode(
+    value: Option<&str>,
+    reference_media_type: Option<&str>,
+    reference_src: Option<&str>,
+    legacy_source_image_src: &str,
+) -> Result<EditorCharacterAnimationInputMode, AppError> {
+    let reference_media_type = reference_media_type
+        .map(str::trim)
+        .filter(|value| !value.is_empty());
+    if reference_media_type.is_some_and(|value| value != "image" && value != "video") {
+        return Err(editor_character_animation_bad_request(
+            "referenceMediaType 只支持 image 或 video。",
+        ));
+    }
+    let inferred = if reference_media_type == Some("video") {
+        "video"
+    } else if reference_src.is_some_and(|value| !value.trim().is_empty())
+        || !legacy_source_image_src.trim().is_empty()
+    {
+        "image"
+    } else {
+        "text"
+    };
+    let mode = match value
+        .map(str::trim)
+        .filter(|value| !value.is_empty())
+        .unwrap_or(inferred)
+    {
+        "text" => Ok(EditorCharacterAnimationInputMode::Text),
+        "image" => Ok(EditorCharacterAnimationInputMode::Image),
+        "video" => Ok(EditorCharacterAnimationInputMode::Video),
+        _ => Err(editor_character_animation_bad_request(
+            "inputMode 只支持 text、image 或 video。",
+        )),
+    }?;
+    match (mode, reference_media_type) {
+        (EditorCharacterAnimationInputMode::Text, Some(_)) => Err(
+            editor_character_animation_bad_request("文本模式不能携带参考素材类型。"),
+        ),
+        (EditorCharacterAnimationInputMode::Image, Some("video")) => Err(
+            editor_character_animation_bad_request("图片模式必须使用图片参考素材。"),
+        ),
+        (EditorCharacterAnimationInputMode::Video, Some("image")) => Err(
+            editor_character_animation_bad_request("视频模式必须使用视频参考素材。"),
+        ),
+        _ => Ok(mode),
+    }
+}
+
+fn normalize_editor_character_animation_resolution(value: &str) -> Result<&'static str, AppError> {
+    match value.trim() {
+        "480p" => Ok("480p"),
+        "720p" => Ok("720p"),
+        _ => Err(editor_character_animation_bad_request(
+            "resolution 只支持 480p 或 720p。",
+        )),
+    }
+}
+
+fn normalize_editor_character_animation_ratio(value: &str) -> Result<&'static str, AppError> {
+    match value.trim() {
+        "same" => Ok("same"),
+        "1:1" => Ok("1:1"),
+        "4:3" => Ok("4:3"),
+        "16:9" => Ok("16:9"),
+        "9:16" => Ok("9:16"),
+        "3:4" => Ok("3:4"),
+        _ => Err(editor_character_animation_bad_request(
+            "ratio 只支持 same、1:1、4:3、16:9、9:16、3:4。",
+        )),
+    }
+}
+
+fn normalize_editor_character_animation_frame_count(value: u32) -> Result<u32, AppError> {
+    match value {
+        32 | 40 | 48 => Ok(value),
+        _ => Err(editor_character_animation_bad_request(
+            "frameCount 只支持 32、40、48。",
+        )),
+    }
+}
+
+fn normalize_editor_character_animation_duration(
+    value: u32,
+    frame_count: u32,
+) -> Result<u32, AppError> {
+    let expected = match frame_count {
+        32 => 4,
+        40 => 5,
+        48 => 6,
+        _ => 0,
+    };
+    if value == expected {
+        Ok(value)
+    } else {
+        Err(editor_character_animation_bad_request(
+            "durationSeconds 必须与帧数组合为 32/4、40/5 或 48/6。",
+        ))
+    }
+}
+
+fn resolve_editor_character_animation_provider_ratio(
+    ratio: &str,
+    source_width: u32,
+    source_height: u32,
+) -> String {
+    if ratio != "same" {
+        return ratio.to_string();
+    }
+    if source_width == 0 || source_height == 0 {
+        return "1:1".to_string();
+    }
+    let normalized = source_width as f32 / source_height as f32;
+    [
+        ("1:1", 1.0f32),
+        ("4:3", 4.0 / 3.0),
+        ("16:9", 16.0 / 9.0),
+        ("9:16", 9.0 / 16.0),
+        ("3:4", 3.0 / 4.0),
+    ]
+    .into_iter()
+    .min_by(|(_, left), (_, right)| {
+        (normalized - *left)
+            .abs()
+            .partial_cmp(&(normalized - *right).abs())
+            .unwrap_or(std::cmp::Ordering::Equal)
+    })
+    .map(|(value, _)| value.to_string())
+    .unwrap_or_else(|| "1:1".to_string())
+}
+
+fn resolve_editor_character_animation_frame_size(
+    source_width: u32,
+    source_height: u32,
+    ratio: &str,
+    resolution: &str,
+) -> (u32, u32) {
+    let long_edge = if resolution == "720p" { 720 } else { 480 };
+    let (ratio_width, ratio_height) = match ratio {
+        "same" if source_width > 0 && source_height > 0 => (source_width, source_height),
+        "4:3" => (4, 3),
+        "16:9" => (16, 9),
+        "9:16" => (9, 16),
+        "3:4" => (3, 4),
+        _ => (1, 1),
+    };
+    if ratio_width >= ratio_height {
+        let height =
+            ((long_edge as f32 * ratio_height as f32 / ratio_width as f32).round() as u32).max(1);
+        (long_edge, height)
+    } else {
+        let width =
+            ((long_edge as f32 * ratio_width as f32 / ratio_height as f32).round() as u32).max(1);
+        (width, long_edge)
+    }
+}
+
+fn build_editor_character_animation_prompt(
+    prompt_text: &str,
+    screen_color: EditorScreenBackgroundColor,
+    ratio: &str,
+    resolution: &str,
+    frame_count: u32,
+    duration_seconds: u32,
+    fps: u32,
+) -> String {
+    format!(
+        "生成可拆分为透明 PNG 序列帧的单人游戏角色动作视频。\n\
+角色一致性：保持角色身份、脸型、发型、五官、体型、身体比例、服装、鞋子、盔甲、配饰、武器、材质和颜色全程一致；不得增加、减少或替换角色特征，不得出现额外肢体、肢体缺失、关节错位、身体融合或异常变形。\n\
+镜头与构图：固定机位、固定焦距、固定视角，禁止镜头平移、旋转、推拉、缩放、抖动、透视变化和特写；角色全身始终完整入镜，锚点、构图中心、画面占比和朝向稳定，不得裁切头顶、手脚、武器或配饰。\n\
+动作连续性：动作包含清晰的起势、关键姿势、自然过渡和收势，相邻时刻连续，不得瞬移、跳变、换人或造型漂移；若动作适合循环，首尾姿态、重心和速度必须平滑衔接。\n\
+输出规格：画面比例为 {ratio}，清晰度为 {resolution}，视频时长 {duration_seconds} 秒；动作节奏须适合后续按 {fps} FPS 均匀抽取为 {frame_count} 帧。每个视频时刻只出现一个完整角色姿态，禁止生成 Sprite Sheet、网格、多格画面、分镜拼图、边框、帧编号或排版文字。\n\
+背景与内容限制：{background_clause}；禁止出现建筑、室内布景、风景、地面道具、漂浮物、烟雾叙事元素、文字、水印、标志或其他角色以外的场景内容。\n\
+动作描述：\n{prompt}",
+        ratio = ratio,
+        resolution = resolution,
+        duration_seconds = duration_seconds,
+        fps = fps,
+        frame_count = frame_count,
+        background_clause = editor_green_screen_character_prompt_clause(screen_color),
+        prompt = prompt_text.trim(),
+    )
+}
+
+fn normalize_required_text(value: &str, fallback: &str) -> String {
+    let normalized = value
+        .trim()
+        .split_whitespace()
+        .collect::<Vec<_>>()
+        .join(" ")
+        .chars()
+        .take(180)
+        .collect::<String>()
+        .trim()
+        .to_string();
+    if normalized.is_empty() {
+        fallback.to_string()
+    } else {
+        normalized
+    }
+}
+
+fn trim_optional_text(value: Option<&str>) -> Option<String> {
+    value
+        .map(str::trim)
+        .filter(|value| !value.is_empty())
+        .map(ToOwned::to_owned)
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    fn test_request() -> EditorCharacterAnimationGenerateRequest {
+        EditorCharacterAnimationGenerateRequest {
+            source_layer_id: "layer-hero".to_string(),
+            source_image_src: "/generated-characters/hero/master.png".to_string(),
+            source_width: 1024,
+            source_height: 1024,
+            input_mode: None,
+            reference_media_type: None,
+            reference_src: None,
+            prompt_text: "待机呼吸".to_string(),
+            background_color: None,
+            screen_color: None,
+            resolution: "480p".to_string(),
+            ratio: "same".to_string(),
+            frame_count: 32,
+            duration_seconds: 4,
+            model: EDITOR_CHARACTER_ANIMATION_MODEL.to_string(),
+            project_id: None,
+            canvas_completion: None,
+            generation_inputs: None,
+            source_resource_id: None,
+            asset_folder_id: None,
+            asset_label: None,
+        }
+    }
+
+    fn generation_field<'a>(inputs: &'a Value, id: &str) -> Option<&'a Value> {
+        inputs
+            .get("fields")
+            .and_then(Value::as_array)
+            .and_then(|fields| {
+                fields
+                    .iter()
+                    .find(|field| field.get("id").and_then(Value::as_str) == Some(id))
+            })
+            .and_then(|field| field.get("value"))
+    }
+
+    #[test]
+    fn character_animation_normalizes_seedance_request_contract_and_labels() {
+        let normalized =
+            normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
+                source_layer_id: " layer-hero ".to_string(),
+                source_width: 768,
+                source_height: 1024,
+                prompt_text: "待机呼吸，轻微摆动。".to_string(),
+                resolution: "720p".to_string(),
+                frame_count: 48,
+                duration_seconds: 6,
+                asset_label: Some(" 勇者待机 ".to_string()),
+                ..test_request()
+            })
+            .expect("editor request should normalize");
+
+        assert_eq!(normalized.source_layer_id, "layer-hero");
+        assert_eq!(normalized.frame_count, 48);
+        assert_eq!(normalized.duration_seconds, 6);
+        assert_eq!(normalized.price_mud_points, 120);
+        assert_eq!(normalized.fps, 8);
+        assert!(normalized.prompt.contains("画面比例为 3:4"));
+        assert!(normalized.prompt.contains("清晰度为 720p"));
+        assert!(normalized.prompt.contains("视频时长 6 秒"));
+        assert!(normalized.prompt.contains("按 8 FPS 均匀抽取为 48 帧"));
+        assert_eq!(
+            (normalized.frame_width, normalized.frame_height),
+            (540, 720)
+        );
+        assert_eq!(normalized.ratio, "3:4");
+        assert_eq!(
+            resolve_editor_character_animation_asset_label(Some(" 勇者待机 ")),
+            "勇者待机"
+        );
+        assert_eq!(
+            resolve_editor_character_animation_asset_label(Some("   ")),
+            "角色动作"
+        );
+        assert_eq!(
+            resolve_editor_character_animation_asset_label(Some("动".repeat(81).as_str()))
+                .chars()
+                .count(),
+            EDITOR_ASSET_LABEL_MAX_CHARS
+        );
+        assert_eq!(
+            editor_character_animation_source_asset_label("勇者待机"),
+            "勇者待机（原始视频）"
+        );
+        let long_source_label =
+            editor_character_animation_source_asset_label("动".repeat(80).as_str());
+        assert_eq!(
+            long_source_label.chars().count(),
+            EDITOR_ASSET_LABEL_MAX_CHARS
+        );
+        assert!(long_source_label.ends_with("（原始视频）"));
+    }
+
+    #[test]
+    fn character_animation_source_layer_id_keeps_legacy_identity_normalization() {
+        let normalized =
+            normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
+                source_layer_id: format!("  layer\t hero\n{}  ", "x".repeat(200)),
+                ..test_request()
+            })
+            .expect("source layer id should normalize");
+
+        assert!(normalized.source_layer_id.starts_with("layer hero "));
+        assert!(!normalized.source_layer_id.contains('\t'));
+        assert!(!normalized.source_layer_id.contains('\n'));
+        assert!(!normalized.source_layer_id.contains("  "));
+        assert_eq!(normalized.source_layer_id.chars().count(), 180);
+
+        let fallback =
+            normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
+                source_layer_id: " \t\n ".to_string(),
+                ..test_request()
+            })
+            .expect("blank source layer id should use the mode fallback");
+        assert_eq!(fallback.source_layer_id, "sequence-animation-image");
+    }
+
+    #[test]
+    fn character_animation_rejects_invalid_frame_duration_pair() {
+        let error =
+            normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
+                frame_count: 48,
+                duration_seconds: 4,
+                ..test_request()
+            })
+            .expect_err("invalid frame/duration pair should fail");
+
+        assert!(error.body_text().contains("durationSeconds 必须与帧数组合"));
+    }
+
+    #[test]
+    fn character_animation_normalizes_text_mode_without_reference() {
+        let normalized =
+            normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
+                source_layer_id: String::new(),
+                source_image_src: String::new(),
+                source_width: 0,
+                source_height: 0,
+                input_mode: Some("text".to_string()),
+                prompt_text: "原地快速挥手".to_string(),
+                background_color: Some("purple".to_string()),
+                ratio: "1:1".to_string(),
+                ..test_request()
+            })
+            .expect("text mode should normalize without a reference");
+
+        assert_eq!(
+            normalized.input_mode,
+            EditorCharacterAnimationInputMode::Text
+        );
+        assert_eq!(normalized.source_layer_id, "sequence-animation-text");
+        assert_eq!(normalized.reference_src, None);
+        assert_eq!(normalized.ratio, "1:1");
+        assert_eq!(normalized.screen_color.hex, "#8000FF");
+        assert!(normalized.has_explicit_background_color);
+    }
+
+    #[test]
+    fn character_animation_rejects_mismatched_reference_media_type() {
+        let error =
+            normalize_editor_character_animation_request(EditorCharacterAnimationGenerateRequest {
+                input_mode: Some("image".to_string()),
+                reference_media_type: Some("video".to_string()),
+                reference_src: Some("users/owner/reference/action.mp4".to_string()),
+                ..test_request()
+            })
+            .expect_err("image mode should reject video references");
+
+        assert!(error.body_text().contains("图片模式必须使用图片参考素材"));
+    }
+
+    #[test]
+    fn character_animation_reference_content_type_must_match_actual_input_mode() {
+        validate_editor_character_animation_reference_content_type(
+            "image/png; charset=binary",
+            "referenceSrc",
+            EditorCharacterAnimationReferenceMediaKind::Image,
+        )
+        .expect("image mode should accept an actual image payload");
+        validate_editor_character_animation_reference_content_type(
+            "VIDEO/MP4",
+            "referenceSrc",
+            EditorCharacterAnimationReferenceMediaKind::Video,
+        )
+        .expect("video mode should accept an actual video payload");
+
+        let video_error = validate_editor_character_animation_reference_content_type(
+            "image/png",
+            "referenceSrc",
+            EditorCharacterAnimationReferenceMediaKind::Video,
+        )
+        .expect_err("video mode must reject an image object");
+        assert!(
+            video_error
+                .body_text()
+                .contains("视频模式只能使用真实视频素材")
+        );
+
+        let image_error = validate_editor_character_animation_reference_content_type(
+            "video/mp4",
+            "referenceSrc",
+            EditorCharacterAnimationReferenceMediaKind::Image,
+        )
+        .expect_err("image mode must reject a video object");
+        assert!(
+            image_error
+                .body_text()
+                .contains("图片模式只能使用真实图片素材")
+        );
+    }
+
+    #[test]
+    fn character_animation_reference_video_requires_bounded_size_and_duration() {
+        validate_editor_character_animation_reference_video_content_length(50 * 1024 * 1024)
+            .expect("50MB should be accepted");
+        validate_editor_character_animation_reference_video_duration(2.0)
+            .expect("two seconds should be accepted");
+        validate_editor_character_animation_reference_video_duration(15.0)
+            .expect("fifteen seconds should be accepted");
+
+        assert!(
+            validate_editor_character_animation_reference_video_content_length(0)
+                .expect_err("empty video should fail")
+                .body_text()
+                .contains("不能为空")
+        );
+        assert!(
+            validate_editor_character_animation_reference_video_content_length(
+                50 * 1024 * 1024 + 1,
+            )
+            .expect_err("oversized video should fail")
+            .body_text()
+            .contains("50MB")
+        );
+        for duration_seconds in [f64::NAN, 1.99, 15.01] {
+            assert!(
+                validate_editor_character_animation_reference_video_duration(duration_seconds)
+                    .expect_err("out-of-range duration should fail")
+                    .body_text()
+                    .contains("2-15 秒")
+            );
+        }
+    }
+
+    #[test]
+    fn character_animation_same_ratio_uses_authoritative_reference_dimensions() {
+        let mut request = EditorCharacterAnimationGenerateRequest {
+            source_width: 1920,
+            source_height: 1080,
+            input_mode: Some("video".to_string()),
+            reference_media_type: Some("video".to_string()),
+            reference_src: Some("users/owner/reference/action.mp4".to_string()),
+            ..test_request()
+        };
+
+        apply_editor_character_animation_authoritative_reference_dimensions(
+            &mut request,
+            EditorCharacterAnimationInputMode::Video,
+            1080,
+            1920,
+        )
+        .expect("authoritative video dimensions should apply");
+        let normalized = normalize_editor_character_animation_request(request)
+            .expect("request should be renormalized with authoritative dimensions");
+
+        assert_eq!(normalized.ratio, "9:16");
+        assert_eq!(
+            (normalized.frame_width, normalized.frame_height),
+            (270, 480)
+        );
+    }
+
+    #[test]
+    fn character_animation_dimension_override_records_authoritative_reference_size() {
+        let mut explicit_ratio = EditorCharacterAnimationGenerateRequest {
+            ratio: "16:9".to_string(),
+            source_width: 640,
+            source_height: 480,
+            ..test_request()
+        };
+        apply_editor_character_animation_authoritative_reference_dimensions(
+            &mut explicit_ratio,
+            EditorCharacterAnimationInputMode::Image,
+            1080,
+            1920,
+        )
+        .expect("explicit ratios should still record authoritative dimensions");
+        assert_eq!(
+            (explicit_ratio.source_width, explicit_ratio.source_height),
+            (1080, 1920)
+        );
+
+        let mut invalid_same = test_request();
+        let error = apply_editor_character_animation_authoritative_reference_dimensions(
+            &mut invalid_same,
+            EditorCharacterAnimationInputMode::Image,
+            0,
+            1920,
+        )
+        .expect_err("reference media should reject missing authoritative dimensions");
+        assert!(error.body_text().contains("参考素材需要可识别的媒体宽高"));
+    }
+
+    #[test]
+    fn character_animation_authoritative_recipe_is_complete_without_client_snapshot() {
+        let request = EditorCharacterAnimationGenerateRequest {
+            source_image_src: String::new(),
+            source_width: 0,
+            source_height: 0,
+            input_mode: Some("text".to_string()),
+            prompt_text: "  原地挥手  ".to_string(),
+            ..test_request()
+        };
+
+        let inputs = build_authoritative_editor_character_animation_generation_inputs(
+            None,
+            &request,
+            EditorCharacterAnimationInputMode::Text,
+            None,
+        )
+        .expect("text request should always produce a recoverable recipe");
+
+        assert_eq!(inputs.get("version"), Some(&json!(2)));
+        assert_eq!(
+            inputs.get("action"),
+            Some(&json!("character-animation.generate"))
+        );
+        assert_eq!(generation_field(&inputs, "inputMode"), Some(&json!("text")));
+        assert_eq!(
+            generation_field(&inputs, "prompt"),
+            Some(&json!("原地挥手"))
+        );
+        assert_eq!(
+            generation_field(&inputs, "backgroundColor"),
+            Some(&json!("green"))
+        );
+        assert_eq!(generation_field(&inputs, "ratio"), Some(&json!("same")));
+        assert_eq!(generation_field(&inputs, "referenceSrc"), None);
+        assert_eq!(inputs.get("references"), Some(&json!([])));
+    }
+
+    #[test]
+    fn character_animation_authoritative_recipe_overrides_forged_execution_fields() {
+        let request = EditorCharacterAnimationGenerateRequest {
+            source_width: 768,
+            source_height: 1024,
+            input_mode: Some("image".to_string()),
+            reference_media_type: Some("image".to_string()),
+            reference_src: Some("users/owner/hero.png".to_string()),
+            background_color: Some("#8000FF".to_string()),
+            generation_inputs: Some(json!({
+                "version": 2,
+                "action": "video.generate",
+                "futureFlag": true,
+                "fields": [
+                    { "id": "inputMode", "title": "输入模式", "value": "video" },
+                    { "id": "referenceSrc", "title": "参考素材", "value": "users/other/forged.mp4" },
+                    { "id": "prompt", "title": "动作描述", "value": "伪造描述" },
+                    { "id": "actionPreset", "title": "动作预设", "value": "dash" }
+                ],
+                "references": [{
+                    "id": "source",
+                    "refType": "project-resource",
+                    "refId": "foreign-resource"
+                }]
+            })),
+            ..test_request()
+        };
+
+        let inputs = build_authoritative_editor_character_animation_generation_inputs(
+            request.generation_inputs.clone(),
+            &request,
+            EditorCharacterAnimationInputMode::Image,
+            Some("/users/owner/hero.png"),
+        )
+        .expect("authoritative image recipe should build");
+
+        assert_eq!(
+            inputs.get("action"),
+            Some(&json!("character-animation.generate"))
+        );
+        assert_eq!(inputs.get("futureFlag"), Some(&json!(true)));
+        assert_eq!(
+            generation_field(&inputs, "inputMode"),
+            Some(&json!("image"))
+        );
+        assert_eq!(
+            generation_field(&inputs, "referenceSrc"),
+            Some(&json!("users/owner/hero.png"))
+        );
+        assert_eq!(
+            generation_field(&inputs, "referenceWidth"),
+            Some(&json!(768))
+        );
+        assert_eq!(
+            generation_field(&inputs, "referenceHeight"),
+            Some(&json!(1024))
+        );
+        assert_eq!(
+            generation_field(&inputs, "prompt"),
+            Some(&json!("待机呼吸"))
+        );
+        assert_eq!(
+            generation_field(&inputs, "backgroundColor"),
+            Some(&json!("purple"))
+        );
+        assert_eq!(
+            generation_field(&inputs, "actionPreset"),
+            Some(&json!("dash"))
+        );
+        assert_eq!(
+            inputs.get("references"),
+            Some(&json!([{ "id": "source", "title": "角色图片" }]))
+        );
+    }
+
+    #[test]
+    fn character_animation_image_auto_background_is_not_persisted_as_green() {
+        let request = EditorCharacterAnimationGenerateRequest {
+            source_width: 800,
+            source_height: 1200,
+            input_mode: Some("image".to_string()),
+            reference_media_type: Some("image".to_string()),
+            reference_src: Some("users/owner/hero.png".to_string()),
+            background_color: None,
+            ..test_request()
+        };
+
+        let inputs = build_authoritative_editor_character_animation_generation_inputs(
+            None,
+            &request,
+            EditorCharacterAnimationInputMode::Image,
+            Some("users/owner/hero.png"),
+        )
+        .expect("legacy image recipe should preserve automatic background semantics");
+
+        assert_eq!(generation_field(&inputs, "backgroundColor"), None);
+
+        let video_request = EditorCharacterAnimationGenerateRequest {
+            source_width: 1920,
+            source_height: 1080,
+            source_image_src: String::new(),
+            input_mode: Some("video".to_string()),
+            reference_media_type: Some("video".to_string()),
+            reference_src: Some("users/owner/action.mp4".to_string()),
+            background_color: None,
+            ..test_request()
+        };
+        let video_inputs = build_authoritative_editor_character_animation_generation_inputs(
+            None,
+            &video_request,
+            EditorCharacterAnimationInputMode::Video,
+            Some("users/owner/action.mp4"),
+        )
+        .expect("video recipe should persist the default green background");
+        assert_eq!(
+            generation_field(&video_inputs, "backgroundColor"),
+            Some(&json!("green"))
+        );
+    }
+
+    #[test]
+    fn character_animation_frame_asset_label_keeps_suffix_within_limit() {
+        let label = build_editor_character_animation_frame_asset_label(
+            "动".repeat(EDITOR_ASSET_LABEL_MAX_CHARS).as_str(),
+            32,
+        );
+
+        assert_eq!(label.chars().count(), EDITOR_ASSET_LABEL_MAX_CHARS);
+        assert!(label.ends_with("第032帧"));
+    }
+
+    #[test]
+    fn character_animation_builds_required_screen_background_prompt() {
+        let color = crate::editor_green_screen::default_editor_screen_background_color();
+        let prompt = build_editor_character_animation_prompt(
+            "行走两步后回到站姿。",
+            color,
+            "16:9",
+            "720p",
+            48,
+            6,
+            8,
+        );
+
+        assert!(prompt.contains("生成可拆分为透明 PNG 序列帧的单人游戏角色动作视频"));
+        assert!(!prompt.contains("参考图作为首帧和尾帧"));
+        assert!(prompt.contains("角色身份、脸型、发型、五官、体型"));
+        assert!(prompt.contains("固定机位、固定焦距、固定视角"));
+        assert!(prompt.contains("相邻时刻连续，不得瞬移、跳变、换人或造型漂移"));
+        assert!(prompt.contains("画面比例为 16:9，清晰度为 720p，视频时长 6 秒"));
+        assert!(prompt.contains("按 8 FPS 均匀抽取为 48 帧"));
+        assert!(prompt.contains("禁止生成 Sprite Sheet、网格、多格画面、分镜拼图"));
+        assert!(prompt.contains(color.hex));
+        assert!(prompt.contains("纯色背景必须平整无纹理、无渐变、无阴影"));
+        assert!(prompt.contains(
+            "角色主体及其服饰、道具的颜色必须与背景色明显区分，不得带与背景色相同或相近的描边、投影或反光"
+        ));
+        assert!(prompt.contains("动作描述：\n行走两步后回到站姿。"));
+    }
+}
diff --git a/server-rs/crates/api-server/src/external_editor_api.rs b/server-rs/crates/api-server/src/external_editor_api.rs
index 7ce1e9bf3..ac44a43ca 100644
--- a/server-rs/crates/api-server/src/external_editor_api.rs
+++ b/server-rs/crates/api-server/src/external_editor_api.rs
@@ -118,6 +118,58 @@ pub struct ExternalEditorAssetFolderUpdateRequest {
     collapsed: Option<bool>,
 }
 
+#[derive(Debug, Deserialize)]
+#[serde(rename_all = "camelCase", deny_unknown_fields)]
+pub struct ExternalEditorCharacterAnimationGenerateRequest {
+    source_layer_id: String,
+    source_image_src: String,
+    source_width: u32,
+    source_height: u32,
+    prompt_text: String,
+    screen_color: Option<String>,
+    resolution: String,
+    ratio: String,
+    frame_count: u32,
+    duration_seconds: u32,
+    model: String,
+    project_id: Option<String>,
+    canvas_completion: Option<shared_contracts::assets::EditorCanvasGenerationCompletionPayload>,
+    generation_inputs: Option<Value>,
+    source_resource_id: Option<String>,
+    asset_folder_id: Option<String>,
+    asset_label: Option<String>,
+}
+
+impl From<ExternalEditorCharacterAnimationGenerateRequest>
+    for shared_contracts::assets::EditorCharacterAnimationGenerateRequest
+{
+    fn from(payload: ExternalEditorCharacterAnimationGenerateRequest) -> Self {
+        Self {
+            source_layer_id: payload.source_layer_id,
+            source_image_src: payload.source_image_src,
+            source_width: payload.source_width,
+            source_height: payload.source_height,
+            input_mode: None,
+            reference_media_type: None,
+            reference_src: None,
+            prompt_text: payload.prompt_text,
+            background_color: None,
+            screen_color: payload.screen_color,
+            resolution: payload.resolution,
+            ratio: payload.ratio,
+            frame_count: payload.frame_count,
+            duration_seconds: payload.duration_seconds,
+            model: payload.model,
+            project_id: payload.project_id,
+            canvas_completion: payload.canvas_completion,
+            generation_inputs: payload.generation_inputs,
+            source_resource_id: payload.source_resource_id,
+            asset_folder_id: payload.asset_folder_id,
+            asset_label: payload.asset_label,
+        }
+    }
+}
+
 #[derive(Debug, Deserialize)]
 #[serde(rename_all = "camelCase")]
 pub struct ExternalEditorAssetCreateRequest {
@@ -821,10 +873,7 @@ pub async fn generate_external_editor_character_animation(
     Extension(request_context): Extension<RequestContext>,
     Extension(principal): Extension<ExternalApiPrincipal>,
     headers: HeaderMap,
-    payload: Result<
-        Json<shared_contracts::assets::EditorCharacterAnimationGenerateRequest>,
-        JsonRejection,
-    >,
+    payload: Result<Json<ExternalEditorCharacterAnimationGenerateRequest>, JsonRejection>,
 ) -> Result<Response, Response> {
     require_scope_response(&request_context, &principal, SCOPE_EDITOR_IMAGE_GENERATE)?;
     let idempotency_key = require_idempotency_key(&headers)
@@ -834,7 +883,7 @@ pub async fn generate_external_editor_character_animation(
         &state,
         &request_context,
         principal.owner_user_id(),
-        payload,
+        payload.into(),
         Some(idempotency_key),
     )
     .await?;
@@ -1458,6 +1507,70 @@ mod tests {
         assert_eq!(request.expected_revision, 7);
     }
 
+    #[test]
+    fn external_editor_character_animation_request_keeps_legacy_image_contract() {
+        let request =
+            serde_json::from_value::<ExternalEditorCharacterAnimationGenerateRequest>(json!({
+                "sourceLayerId": "layer-character",
+                "sourceImageSrc": "editor/uploads/character.png",
+                "sourceWidth": 512,
+                "sourceHeight": 512,
+                "promptText": "原地待机",
+                "resolution": "480p",
+                "ratio": "same",
+                "frameCount": 32,
+                "durationSeconds": 4,
+                "model": "seedance2.0-fast"
+            }))
+            .expect("External v1 旧图片模式请求应继续通过反序列化");
+
+        let internal: shared_contracts::assets::EditorCharacterAnimationGenerateRequest =
+            request.into();
+        assert_eq!(internal.source_layer_id, "layer-character");
+        assert_eq!(internal.source_image_src, "editor/uploads/character.png");
+        assert_eq!(internal.input_mode, None);
+        assert_eq!(internal.reference_media_type, None);
+        assert_eq!(internal.reference_src, None);
+        assert_eq!(internal.background_color, None);
+    }
+
+    #[test]
+    fn external_editor_character_animation_request_rejects_internal_multimodal_fields() {
+        let error =
+            serde_json::from_value::<ExternalEditorCharacterAnimationGenerateRequest>(json!({
+                "sourceLayerId": "layer-character",
+                "sourceImageSrc": "editor/uploads/character.png",
+                "sourceWidth": 512,
+                "sourceHeight": 512,
+                "inputMode": "video",
+                "promptText": "原地待机",
+                "resolution": "480p",
+                "ratio": "same",
+                "frameCount": 32,
+                "durationSeconds": 4,
+                "model": "seedance2.0-fast"
+            }))
+            .expect_err("External v1 不应接收内部三模态扩展字段");
+
+        assert!(error.to_string().contains("inputMode"));
+    }
+
+    #[test]
+    fn external_editor_character_animation_request_requires_legacy_source_fields() {
+        let error =
+            serde_json::from_value::<ExternalEditorCharacterAnimationGenerateRequest>(json!({
+                "promptText": "原地待机",
+                "resolution": "480p",
+                "ratio": "1:1",
+                "frameCount": 32,
+                "durationSeconds": 4,
+                "model": "seedance2.0-fast"
+            }))
+            .expect_err("External v1 文本模式不得绕过旧图片模式必填字段");
+
+        assert!(error.to_string().contains("sourceLayerId"));
+    }
+
     #[test]
     fn external_editor_generation_inputs_sanitize_audit_fields_for_regular_assets() {
         let serialized = serialize_external_editor_generation_inputs(
diff --git a/server-rs/crates/api-server/src/main.rs b/server-rs/crates/api-server/src/main.rs
index 1d73da766..799e2ed23 100644
--- a/server-rs/crates/api-server/src/main.rs
+++ b/server-rs/crates/api-server/src/main.rs
@@ -30,6 +30,7 @@ mod editor_project;
 mod editor_project_icon;
 mod editor_screen_background_decision;
 mod editor_screen_background_filter;
+mod editor_sequence_animation;
 mod editor_sound_effect_prompt_assist;
 mod error_middleware;
 mod external_api_audit;
diff --git a/server-rs/crates/api-server/src/modules/platform_support.rs b/server-rs/crates/api-server/src/modules/platform_support.rs
index f6eda9e30..9b1d4d813 100644
--- a/server-rs/crates/api-server/src/modules/platform_support.rs
+++ b/server-rs/crates/api-server/src/modules/platform_support.rs
@@ -17,6 +17,7 @@ use crate::{
         get_character_animation_job, get_character_workflow_cache,
         import_character_animation_video, list_character_animation_templates,
         publish_character_animation, save_character_workflow_cache,
+        split_editor_character_animation_frames,
     },
     character_visual_assets::{
         generate_character_visual, get_character_visual_job, publish_character_visual,
@@ -128,6 +129,12 @@ pub fn router(state: AppState) -> Router<AppState> {
                 require_bearer_auth,
             )),
         )
+        .route(
+            "/api/editor/character-animations/frame-splits",
+            post(split_editor_character_animation_frames).route_layer(
+                middleware::from_fn_with_state(state.clone(), require_bearer_auth),
+            ),
+        )
         .route(
             "/api/editor/videos/generations",
             post(generate_editor_video).route_layer(middleware::from_fn_with_state(
diff --git a/server-rs/crates/module-assets/Cargo.toml b/server-rs/crates/module-assets/Cargo.toml
index 8522ac372..f432cdeb0 100644
--- a/server-rs/crates/module-assets/Cargo.toml
+++ b/server-rs/crates/module-assets/Cargo.toml
@@ -11,6 +11,7 @@ spacetime-types = ["dep:spacetimedb"]
 
 [dependencies]
 serde = { workspace = true }
+sha2 = { workspace = true }
 reqwest = { workspace = true, features = ["rustls-tls"], optional = true }
 spacetimedb = { workspace = true, optional = true }
 platform-oss = { workspace = true, optional = true }
diff --git a/server-rs/crates/module-assets/src/character_animation.rs b/server-rs/crates/module-assets/src/character_animation.rs
new file mode 100644
index 000000000..f02d36c5a
--- /dev/null
+++ b/server-rs/crates/module-assets/src/character_animation.rs
@@ -0,0 +1,95 @@
+//! 角色动画资产的稳定身份规则。
+//!
+//! 本模块只承载可纯测的资产领域规则；HTTP 编排与 SpacetimeDB 事务适配留在外层。
+
+use sha2::{Digest as _, Sha256};
+
+pub const CHARACTER_ANIMATION_FRAME_SPLIT_OPERATION_ID_PREFIX: &str =
+    "editor-character-animation-frame-split-";
+
+/// 为一次角色动画拆帧命令生成稳定 operation ID。
+///
+/// 输入顺序、版本盐、逐字段 NUL 分隔和摘要截断长度均属于已发布兼容合同，不能随意调整。
+pub fn character_animation_frame_split_operation_id(
+    owner_user_id: &str,
+    source_resource_id: &str,
+    folder_id: &str,
+    base_label: &str,
+) -> String {
+    let mut hasher = Sha256::new();
+    hasher.update(b"editor-character-animation-frame-split-v2\0");
+    for value in [owner_user_id, source_resource_id, folder_id, base_label] {
+        hasher.update(value.trim().as_bytes());
+        hasher.update([0]);
+    }
+    let digest = format!("{:x}", hasher.finalize());
+    format!(
+        "{CHARACTER_ANIMATION_FRAME_SPLIT_OPERATION_ID_PREFIX}{}",
+        &digest[..32]
+    )
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+
+    #[test]
+    fn frame_split_operation_id_preserves_api_server_v2_compatibility_fixture() {
+        assert_eq!(
+            character_animation_frame_split_operation_id(
+                "owner-1",
+                "source-resource-project-a",
+                "project",
+                "角色动作",
+            ),
+            "editor-character-animation-frame-split-c836606cab3125ba1984176af35f8956"
+        );
+    }
+
+    #[test]
+    fn frame_split_operation_id_is_trimmed_stable_and_target_scoped() {
+        let first = character_animation_frame_split_operation_id(
+            "owner-1",
+            "source-resource-project-a",
+            "project",
+            "角色动作",
+        );
+        assert_eq!(
+            first,
+            character_animation_frame_split_operation_id(
+                " owner-1 ",
+                " source-resource-project-a ",
+                " project ",
+                " 角色动作 ",
+            )
+        );
+        assert_ne!(
+            first,
+            character_animation_frame_split_operation_id(
+                "owner-1",
+                "source-resource-project-b",
+                "project",
+                "角色动作",
+            )
+        );
+        assert_ne!(
+            first,
+            character_animation_frame_split_operation_id(
+                "owner-1",
+                "source-resource-project-a",
+                "folder-actions",
+                "角色动作",
+            )
+        );
+        assert_ne!(
+            first,
+            character_animation_frame_split_operation_id(
+                "owner-1",
+                "source-resource-project-a",
+                "project",
+                "奔跑动作",
+            )
+        );
+        assert!(first.starts_with(CHARACTER_ANIMATION_FRAME_SPLIT_OPERATION_ID_PREFIX));
+    }
+}
diff --git a/server-rs/crates/module-assets/src/lib.rs b/server-rs/crates/module-assets/src/lib.rs
index 410967b8f..3aae5ccdf 100644
--- a/server-rs/crates/module-assets/src/lib.rs
+++ b/server-rs/crates/module-assets/src/lib.rs
@@ -1,4 +1,5 @@
 mod application;
+mod character_animation;
 mod commands;
 mod domain;
 mod errors;
@@ -17,6 +18,10 @@ pub use application::{
 pub use asset_object_service::{
     AssetObjectService, ConfirmAssetObjectError, InMemoryAssetObjectStore,
 };
+pub use character_animation::{
+    CHARACTER_ANIMATION_FRAME_SPLIT_OPERATION_ID_PREFIX,
+    character_animation_frame_split_operation_id,
+};
 pub use commands::{
     AssetEntityBindingInput, AssetHistoryListInput, AssetObjectLocationInput,
     AssetObjectUpsertInput, ConfirmAssetObjectInput,
diff --git a/server-rs/crates/shared-contracts/src/assets.rs b/server-rs/crates/shared-contracts/src/assets.rs
index f06c23d9c..99827e657 100644
--- a/server-rs/crates/shared-contracts/src/assets.rs
+++ b/server-rs/crates/shared-contracts/src/assets.rs
@@ -311,11 +311,23 @@ pub struct CharacterAnimationGenerateResponse {
 #[derive(Clone, Debug, Serialize, Deserialize, PartialEq)]
 #[serde(rename_all = "camelCase")]
 pub struct EditorCharacterAnimationGenerateRequest {
+    #[serde(default)]
     pub source_layer_id: String,
+    #[serde(default)]
     pub source_image_src: String,
+    #[serde(default)]
     pub source_width: u32,
+    #[serde(default)]
     pub source_height: u32,
+    #[serde(default, skip_serializing_if = "Option::is_none")]
+    pub input_mode: Option<String>,
+    #[serde(default, skip_serializing_if = "Option::is_none")]
+    pub reference_media_type: Option<String>,
+    #[serde(default, skip_serializing_if = "Option::is_none")]
+    pub reference_src: Option<String>,
     pub prompt_text: String,
+    #[serde(default, skip_serializing_if = "Option::is_none")]
+    pub background_color: Option<String>,
     /// 纯色抠像背景色（hex）。None/auto 走自动决策；通常继承源角色图的背景色。
     #[serde(default, skip_serializing_if = "Option::is_none")]
     pub screen_color: Option<String>,
@@ -375,6 +387,62 @@ pub struct EditorCharacterAnimationGenerateResponse {
     pub queue_state: Option<ExternalGenerationJobStatusRecord>,
 }
 
+#[derive(Clone, Debug, Serialize, Deserialize, PartialEq, Eq)]
+#[serde(rename_all = "camelCase")]
+pub struct EditorCharacterAnimationFrameSplitRequest {
+    pub project_id: String,
+    pub source_layer_id: String,
+    pub source_resource_id: String,
+    #[serde(default, skip_serializing_if = "Option::is_none")]
+    pub asset_folder_id: Option<String>,
+    #[serde(default, skip_serializing_if = "Option::is_none")]
+    pub asset_label: Option<String>,
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize, PartialEq)]
+#[serde(rename_all = "camelCase")]
+pub struct EditorCharacterAnimationFrameSplitResponse {
+    pub frame_count: u32,
+    pub assets: Vec<EditorAssetPayload>,
+}
+
+#[derive(Clone, Debug, Serialize, Deserialize, PartialEq)]
+#[serde(rename_all = "camelCase")]
+pub struct EditorAssetPayload {
+    pub asset_id: String,
+    pub folder_id: String,
+    pub label: String,
+    pub image_src: String,
+    pub object_key: Option<String>,
+    pub asset_object_id: Option<String>,
+    pub width: u32,
+    pub height: u32,
+    pub source_type: String,
+    pub prompt: Option<String>,
+    pub actual_prompt: Option<String>,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub model: Option<String>,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub provider: Option<String>,
+    pub task_id: Option<String>,
+    pub asset_kind: Option<String>,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub image_sequence_frames: Option<Value>,
+    #[serde(skip_serializing_if = "Option::is_none")]
+    pub image_sequence_duration_ms: Option<u64>,
+    pub generation_inputs: Option<Value>,
+    pub source_resource_id: Option<String>,
+    pub public_showcase_enabled: Option<bool>,
+    pub thumbnail_src: Option<String>,
+    pub generation_cost_mud_points: u64,
+    pub showcase_id: Option<String>,
+    pub showcase_review_status: Option<String>,
+    pub showcase_display_enabled: Option<bool>,
+    pub showcase_like_count: Option<u64>,
+    pub created_at: String,
+    pub updated_at: String,
+}
+
 #[derive(Clone, Debug, Serialize, Deserialize, PartialEq)]
 #[serde(rename_all = "camelCase")]
 pub struct EditorSceneGenerateRequest {
@@ -1305,7 +1373,11 @@ mod tests {
             source_image_src: "/generated-characters/hero/master.png".to_string(),
             source_width: 768,
             source_height: 1024,
+            input_mode: Some("video".to_string()),
+            reference_media_type: Some("video".to_string()),
+            reference_src: Some("generated/editor/reference.mp4".to_string()),
             prompt_text: "待机呼吸".to_string(),
+            background_color: Some("purple".to_string()),
             screen_color: None,
             resolution: "720p".to_string(),
             ratio: "same".to_string(),
@@ -1333,6 +1405,13 @@ mod tests {
         .expect("request should serialize");
 
         assert_eq!(payload["sourceLayerId"], json!("layer-1"));
+        assert_eq!(payload["inputMode"], json!("video"));
+        assert_eq!(payload["referenceMediaType"], json!("video"));
+        assert_eq!(
+            payload["referenceSrc"],
+            json!("generated/editor/reference.mp4")
+        );
+        assert_eq!(payload["backgroundColor"], json!("purple"));
         assert_eq!(
             payload["sourceImageSrc"],
             json!("/generated-characters/hero/master.png")
@@ -1346,6 +1425,24 @@ mod tests {
         assert_eq!(payload["assetLabel"], json!("勇者奔跑"));
     }
 
+    #[test]
+    fn editor_character_animation_frame_split_request_uses_shared_contract_shape() {
+        let payload = serde_json::to_value(EditorCharacterAnimationFrameSplitRequest {
+            project_id: "project-1".to_string(),
+            source_layer_id: "layer-animation".to_string(),
+            source_resource_id: "resource-animation".to_string(),
+            asset_folder_id: Some("folder-actions".to_string()),
+            asset_label: Some("奔跑动作".to_string()),
+        })
+        .expect("frame split request should serialize");
+
+        assert_eq!(payload["projectId"], json!("project-1"));
+        assert_eq!(payload["sourceLayerId"], json!("layer-animation"));
+        assert_eq!(payload["sourceResourceId"], json!("resource-animation"));
+        assert_eq!(payload["assetFolderId"], json!("folder-actions"));
+        assert_eq!(payload["assetLabel"], json!("奔跑动作"));
+    }
+
     #[test]
     fn editor_character_animation_response_includes_frames_and_preview_video() {
         let payload = serde_json::to_value(EditorCharacterAnimationGenerateResponse {
diff --git a/server-rs/crates/spacetime-module/src/editor_project_storage.rs b/server-rs/crates/spacetime-module/src/editor_project_storage.rs
index 075a62f2b..8c8e69e68 100644
--- a/server-rs/crates/spacetime-module/src/editor_project_storage.rs
+++ b/server-rs/crates/spacetime-module/src/editor_project_storage.rs
@@ -5114,6 +5114,7 @@ fn validate_editor_spritesheet_slice_batch(
     let mut object_keys = BTreeSet::new();
     let mut resource_ids = BTreeSet::new();
     let mut asset_ids = BTreeSet::new();
+    let mut source_job_id = None::<String>;
     let mut asset_count = 0usize;
     for item in &input.items {
         let asset_object_id = normalize_required(
@@ -5130,11 +5131,23 @@ fn validate_editor_spritesheet_slice_batch(
         if !object_keys.insert(object_key.clone()) {
             return Err("图集切片批次包含重复 object_key".to_string());
         }
-        if normalize_optional_ref(item.asset_object.owner_user_id.as_ref()) != Some(owner_user_id)
-            || normalize_optional_ref(item.asset_object.source_job_id.as_ref()) != Some(task_id)
-        {
-            return Err("图集切片对象的 owner 或 task 归属不一致".to_string());
+        if normalize_optional_ref(item.asset_object.owner_user_id.as_ref()) != Some(owner_user_id) {
+            return Err("图集切片对象的 owner 归属不一致".to_string());
         }
+        let item_source_job_id = normalize_optional_ref(item.asset_object.source_job_id.as_ref())
+            .ok_or_else(|| "图集切片对象缺少来源任务".to_string())?;
+        if item_source_job_id != task_id
+            && item.asset_object.asset_kind.trim() != EDITOR_CHARACTER_ANIMATION_OBJECT_KIND
+        {
+            return Err("只有角色序列帧拆分可以复用原生成任务的资产对象".to_string());
+        }
+        if source_job_id
+            .as_deref()
+            .is_some_and(|source_job_id| source_job_id != item_source_job_id)
+        {
+            return Err("图集切片对象的来源任务不一致".to_string());
+        }
+        source_job_id.get_or_insert_with(|| item_source_job_id.to_string());
 
         let resource_identity = item
             .project_resource
@@ -15672,6 +15685,64 @@ mod tests {
             .expect("complete batch should pass before transaction writes");
     }
 
+    #[test]
+    fn spritesheet_slice_batch_accepts_reused_source_objects_under_split_operation() {
+        let mut batch = spritesheet_slice_batch();
+        batch.task_id = "character-split-source-resource-a".to_string();
+        batch.group_task_id = Some(batch.task_id.clone());
+        for item in &mut batch.items {
+            item.asset_object.source_job_id = Some("character-generation-task-1".to_string());
+            item.asset_object.asset_kind = EDITOR_CHARACTER_ANIMATION_OBJECT_KIND.to_string();
+            item.project_resource.as_mut().expect("resource").task_id = Some(batch.task_id.clone());
+            let asset = item.asset.as_mut().expect("asset");
+            asset.task_id = Some(batch.task_id.clone());
+            asset.group_task_id = Some(batch.task_id.clone());
+        }
+
+        validate_editor_spritesheet_slice_batch(
+            &batch,
+            "user-1",
+            "character-split-source-resource-a",
+            Some("character-split-source-resource-a"),
+        )
+        .expect("split operation may reuse objects produced by the original generation task");
+    }
+
+    #[test]
+    fn spritesheet_slice_batch_keeps_icon_objects_bound_to_split_task() {
+        let mut batch = spritesheet_slice_batch();
+        batch.task_id = "another-split-task".to_string();
+
+        let error = validate_editor_spritesheet_slice_batch(
+            &batch,
+            "user-1",
+            "another-split-task",
+            Some("group-task-1"),
+        )
+        .expect_err("icon slices must keep their existing source_job_id equals task invariant");
+
+        assert_eq!(error, "只有角色序列帧拆分可以复用原生成任务的资产对象");
+    }
+
+    #[test]
+    fn spritesheet_slice_batch_rejects_mixed_source_object_jobs() {
+        let mut batch = spritesheet_slice_batch();
+        for item in &mut batch.items {
+            item.asset_object.asset_kind = EDITOR_CHARACTER_ANIMATION_OBJECT_KIND.to_string();
+        }
+        batch.items[1].asset_object.source_job_id = Some("other-source-job".to_string());
+
+        let error = validate_editor_spritesheet_slice_batch(
+            &batch,
+            "user-1",
+            "task-1",
+            Some("group-task-1"),
+        )
+        .expect_err("a batch must not mix objects from unrelated source jobs");
+
+        assert_eq!(error, "图集切片对象的来源任务不一致");
+    }
+
     #[test]
     fn spritesheet_slice_batch_validation_rejects_duplicate_object_key() {
         let mut batch = spritesheet_slice_batch();
diff --git a/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx b/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx
index 16403bfba..4b1edf20a 100644
--- a/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx
+++ b/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx
@@ -73,6 +73,7 @@ describe('ImageCanvasBottomToolbarView', () => {
       ['上传工具', 'upload'],
       ['生成图片', 'generate'],
       ['生成视频', 'video'],
+      ['Spine序列帧动画', 'character-animation'],
       ['生成音乐', 'music'],
       ['生成规范', 'spec'],
       ['生成角色形象', 'character'],
@@ -90,6 +91,42 @@ describe('ImageCanvasBottomToolbarView', () => {
     expect(switchTool).toHaveBeenCalledTimes(toolExpectations.length);
   });
 
+  it('keeps the sequence animation entry right after the video tool', () => {
+    const { toolbar } = renderToolbar();
+    const sequenceEntry = within(toolbar).getByRole('button', {
+      name: 'Spine序列帧动画',
+    });
+    const videoEntry = within(toolbar).getByRole('button', {
+      name: '生成视频',
+    });
+    const musicEntry = within(toolbar).getByRole('button', {
+      name: '生成音乐',
+    });
+    const toolbarButtons = within(toolbar).getAllByRole('button');
+
+    expect(toolbarButtons.indexOf(sequenceEntry)).toBe(
+      toolbarButtons.indexOf(videoEntry) + 1,
+    );
+    expect(toolbarButtons.indexOf(musicEntry)).toBe(
+      toolbarButtons.indexOf(sequenceEntry) + 1,
+    );
+    expect(
+      sequenceEntry.parentElement?.querySelector(
+        '.image-canvas-editor__bottom-toolbar-divider',
+      ),
+    ).toBeNull();
+    expect(
+      sequenceEntry.querySelector(
+        '.image-canvas-editor__sequence-animation-icon',
+      ),
+    ).toBeTruthy();
+    expect(
+      sequenceEntry.classList.contains(
+        'image-canvas-editor__sequence-animation-entry',
+      ),
+    ).toBe(true);
+  });
+
   it('only exposes persistent pressed state for navigation tools', () => {
     const { toolbar, rerender, refs } = renderToolbar({
       effectiveTool: 'select',
diff --git a/src/components/image-editor/ImageCanvasBottomToolbarView.tsx b/src/components/image-editor/ImageCanvasBottomToolbarView.tsx
index ac9c600fe..a9bed831c 100644
--- a/src/components/image-editor/ImageCanvasBottomToolbarView.tsx
+++ b/src/components/image-editor/ImageCanvasBottomToolbarView.tsx
@@ -12,10 +12,11 @@ import {
   Upload,
   UserRound,
 } from 'lucide-react';
-import type { RefObject } from 'react';
+import type { ComponentType, RefObject } from 'react';
 
 import { EditorIconButton } from './ImageCanvasEditorPrimitives';
 import type { CanvasTool } from './ImageCanvasEditorTypes';
+import { ImageCanvasSequenceAnimationIcon } from './ImageCanvasSequenceAnimationIcon';
 
 type ToolbarOptionTool = Extract<CanvasTool, 'music' | 'spec' | 'publication'>;
 
@@ -33,7 +34,7 @@ type ImageCanvasBottomToolbarViewProps = {
 const canvasTools: Array<{
   id: CanvasTool;
   label: string;
-  icon: typeof MousePointer2;
+  icon: ComponentType<{ className?: string }>;
   separatorBefore?: boolean;
 }> = [
   { id: 'select', label: '选择工具', icon: MousePointer2 },
@@ -46,6 +47,11 @@ const canvasTools: Array<{
     separatorBefore: true,
   },
   { id: 'video', label: '生成视频', icon: Clapperboard },
+  {
+    id: 'character-animation',
+    label: 'Spine序列帧动画',
+    icon: ImageCanvasSequenceAnimationIcon,
+  },
   { id: 'music', label: '生成音乐', icon: Music },
   {
     id: 'spec',
@@ -126,7 +132,9 @@ export function ImageCanvasBottomToolbarView({
                   label={label}
                   title={label}
                   icon={Icon}
-                  pressed={hasPersistentPressedState(id) && effectiveTool === id}
+                  pressed={
+                    hasPersistentPressedState(id) && effectiveTool === id
+                  }
                   onClick={() => onSwitchTool(id)}
                 />
               </span>
@@ -143,6 +151,11 @@ export function ImageCanvasBottomToolbarView({
               />
             ) : null}
             <EditorIconButton
+              className={
+                id === 'character-animation'
+                  ? 'image-canvas-editor__sequence-animation-entry'
+                  : undefined
+              }
               label={label}
               title={label}
               icon={Icon}
diff --git a/src/components/image-editor/ImageCanvasEditorGenerationIntegration.test.tsx b/src/components/image-editor/ImageCanvasEditorGenerationIntegration.test.tsx
index 7f2ef9a4c..9f28be8b8 100644
--- a/src/components/image-editor/ImageCanvasEditorGenerationIntegration.test.tsx
+++ b/src/components/image-editor/ImageCanvasEditorGenerationIntegration.test.tsx
@@ -3387,8 +3387,8 @@ describe('ImageCanvasEditorView generation integration', () => {
     });
     const animationFrames = Array.from({ length: 48 }, (_, index) => ({
       imageSrc: `/generated-character-drafts/editor/frame${index + 1}.png`,
-      width: 1024,
-      height: 1024,
+      width: 720,
+      height: 405,
     }));
     generateEditorCharacterAnimationMock.mockResolvedValueOnce({
       taskId: 'character-animation-task-1',
@@ -3403,8 +3403,8 @@ describe('ImageCanvasEditorView generation integration', () => {
         resourceId: 'resource-character-animation-final',
         projectId: 'editor-project-character-animation',
         imageSrc: animationFrames[0]!.imageSrc,
-        width: 1024,
-        height: 1024,
+        width: 720,
+        height: 405,
         sourceType: 'generated',
         sourceResourceId: 'resource-character-animation-preview',
         assetKind: 'character-animation',
@@ -3455,7 +3455,7 @@ describe('ImageCanvasEditorView generation integration', () => {
     expect(screen.getByRole('button', { name: '生成动画' })).toBeTruthy();
     expect(screen.queryByRole('dialog', { name: '重绘图片' })).toBeNull();
     expect(
-      screen.queryByRole('dialog', { name: '角色动画生成面板' }),
+      screen.queryByRole('dialog', { name: 'Spine序列帧动画生成' }),
     ).toBeNull();
     fireEvent.contextMenu(characterLayer.closest('button')!, {
       clientX: 260,
@@ -3470,19 +3470,36 @@ describe('ImageCanvasEditorView generation integration', () => {
       screen.getByRole('button', { name: '角色动作生成占位图' }),
     ).toBeTruthy();
     expect(screen.getByText('Action Generator')).toBeTruthy();
-    expect(screen.getByText('动作')).toBeTruthy();
-    const panel = screen.getByRole('dialog', { name: '角色动画生成面板' });
+    expect(screen.getByText('Spine序列帧动画')).toBeTruthy();
+    const panel = screen.getByRole('dialog', {
+      name: 'Spine序列帧动画生成',
+    });
     expect(panel.className).toContain(
       'image-canvas-editor__generation-composer--character-animation',
     );
-    expect(
+    fireEvent.click(
       within(panel).getByRole('button', {
-        name: '动画参数 同图尺寸 · 4秒 · 480p',
+        name: '序列帧参数 同图尺寸 · 4秒 · 480p',
+      }),
+    );
+    const animationParameterMenu = screen.getByRole('group', {
+      name: '序列帧参数选项',
+    });
+    expect(
+      within(animationParameterMenu).getByRole('button', { name: '同图尺寸' }),
+    ).toBeTruthy();
+    expect(
+      within(animationParameterMenu).getByRole('button', {
+        name: '32帧·4秒',
       }),
     ).toBeTruthy();
     expect(
-      within(panel).getByRole('button', { name: '生成40泥点' }),
+      within(animationParameterMenu).getByRole('button', { name: '480p' }),
     ).toBeTruthy();
+    const submitAnimationButton = within(panel).getByRole('button', {
+      name: '生成Spine序列帧动画',
+    });
+    expect(submitAnimationButton.textContent).toBe('生成40泥点');
     for (const actionLabel of [
       '待机',
       '行走',
@@ -3514,31 +3531,39 @@ describe('ImageCanvasEditorView generation integration', () => {
       within(panel).getByLabelText('动画描述'),
       precisePrompt,
     );
-    expect(
-      within(panel).getByLabelText(`生成文本：${precisePrompt}`),
-    ).toBeTruthy();
+    expect(within(panel).getByLabelText('动画描述').textContent).toBe(
+      precisePrompt,
+    );
     fireEvent.click(
       within(panel).getByRole('button', {
-        name: '动画参数 同图尺寸 · 4秒 · 480p',
+        name: '序列帧参数 同图尺寸 · 4秒 · 480p',
       }),
     );
-    const animationMenu = screen.getByRole('menu', { name: '动画参数选项' });
     fireEvent.click(
-      within(animationMenu).getByRole('button', { name: '清晰度 720p' }),
+      within(
+        screen.getByRole('group', { name: '序列帧参数选项' }),
+      ).getByRole('button', { name: '720p' }),
     );
     fireEvent.click(
-      within(animationMenu).getByRole('button', { name: '比例 16:9' }),
+      within(
+        screen.getByRole('group', { name: '序列帧参数选项' }),
+      ).getByRole('button', { name: '16:9' }),
     );
     fireEvent.click(
-      within(animationMenu).getByRole('button', { name: '时长 48帧·6秒' }),
-    );
-    expect(screen.getByRole('menu', { name: '动画参数选项' })).toBeTruthy();
-    expect(
-      within(panel).getByRole('button', {
-        name: '动画参数 16:9 · 6秒 · 720p',
+      within(
+        screen.getByRole('group', { name: '序列帧参数选项' }),
+      ).getByRole('button', {
+        name: '48帧·6秒',
       }),
-    ).toBeTruthy();
-    fireEvent.click(within(panel).getByRole('button', { name: '生成120泥点' }));
+    );
+    const resizedPlaceholder = screen.getByRole('button', {
+      name: '角色动作生成占位图',
+    });
+    expect(resizedPlaceholder.style.width).toBe('720px');
+    expect(resizedPlaceholder.style.height).toBe('405px');
+    expect(within(resizedPlaceholder).getByText('720 x 405')).toBeTruthy();
+    expect(submitAnimationButton.textContent).toBe('生成120泥点');
+    fireEvent.click(submitAnimationButton);
 
     await waitFor(() => {
       expect(generateEditorCharacterAnimationMock).toHaveBeenCalledWith(
@@ -3553,6 +3578,14 @@ describe('ImageCanvasEditorView generation integration', () => {
           frameCount: 48,
           durationSeconds: 6,
           model: 'seedance2.0-fast',
+          canvasCompletion: expect.objectContaining({
+            placeholder: expect.objectContaining({
+              width: 720,
+              height: 405,
+              originalWidth: 720,
+              originalHeight: 405,
+            }),
+          }),
         }),
       );
     });
@@ -3564,6 +3597,11 @@ describe('ImageCanvasEditorView generation integration', () => {
     });
     const actionFrame = screen.getByAltText('画布序列帧：角色动作');
     expect(actionFrame.tagName.toLowerCase()).toBe('img');
+    const actionLayerButton = screen.getByRole('button', {
+      name: '选择角色动作',
+    });
+    expect(actionLayerButton.style.width).toBe('720px');
+    expect(actionLayerButton.style.height).toBe('405px');
     await waitFor(() => {
       expect(actionFrame.getAttribute('src')).toBe(
         'https://assets.test/generated-character-drafts/editor/frame1.png',
@@ -3575,13 +3613,13 @@ describe('ImageCanvasEditorView generation integration', () => {
     // 「按序列帧播放器渲染、总帧数 48」（下一行排除视频元素），分母才是这条断言的意义。
     expect(screen.getByText(/^\d+\/48$/u)).toBeTruthy();
     expect(screen.queryByLabelText('画布视频：角色动作')).toBeNull();
-    expect(screen.getByText('动作')).toBeTruthy();
+    expect(screen.getByText('Spine序列帧动画')).toBeTruthy();
 
-    fireEvent.click(screen.getByRole('button', { name: '选择角色动作' }));
+    fireEvent.click(actionLayerButton);
     fireEvent.click(screen.getByRole('button', { name: '改造' }));
 
     const remodelPanel = screen.getByRole('dialog', {
-      name: '角色动画生成面板',
+      name: 'Spine序列帧动画生成',
     });
     expect(within(remodelPanel).getByLabelText('动画描述').textContent).toBe(
       precisePrompt,
diff --git a/src/components/image-editor/ImageCanvasEditorModel.test.ts b/src/components/image-editor/ImageCanvasEditorModel.test.ts
index 978138cba..4f160f6c4 100644
--- a/src/components/image-editor/ImageCanvasEditorModel.test.ts
+++ b/src/components/image-editor/ImageCanvasEditorModel.test.ts
@@ -1546,6 +1546,8 @@ describe('ImageCanvasEditorModel', () => {
           label: '参考图',
           src: 'data:image/png;base64,ref',
           resourceId: 'resource-reference-1',
+          width: 600,
+          height: 800,
         },
       ],
     };
@@ -1605,6 +1607,8 @@ describe('ImageCanvasEditorModel', () => {
       src: '/read/reference-1.png',
       resourceId: 'resource-reference-1',
       objectKey: 'generated/reference-1.png',
+      width: 600,
+      height: 800,
     });
   });
 
diff --git a/src/components/image-editor/ImageCanvasEditorModel.ts b/src/components/image-editor/ImageCanvasEditorModel.ts
index 9aada3a0f..d063fac44 100644
--- a/src/components/image-editor/ImageCanvasEditorModel.ts
+++ b/src/components/image-editor/ImageCanvasEditorModel.ts
@@ -677,6 +677,8 @@ function serializeGenerationReference(
     mimeType: reference.mimeType,
     sizeBytes: reference.sizeBytes,
     durationSeconds: reference.durationSeconds,
+    width: reference.width,
+    height: reference.height,
     resourceId: pointer.resourceId,
     sourceAssetId: pointer.sourceAssetId,
   };
@@ -2328,6 +2330,10 @@ function hydrateCharacterReference(
   const assetObjectId =
     stringOrUndefined(snapshot.assetObjectId) ??
     stringOrUndefined(resource?.assetObjectId);
+  const width =
+    numberFromSnapshot(snapshot.width, 0) || resource?.width || undefined;
+  const height =
+    numberFromSnapshot(snapshot.height, 0) || resource?.height || undefined;
   const resolvedSrc = resource?.imageSrc || objectKey || src;
   return id && label && resolvedSrc
     ? {
@@ -2338,6 +2344,8 @@ function hydrateCharacterReference(
         mimeType,
         sizeBytes,
         durationSeconds,
+        width,
+        height,
         objectKey,
         assetObjectId,
         resourceId,
diff --git a/src/components/image-editor/ImageCanvasEditorShellView.test.tsx b/src/components/image-editor/ImageCanvasEditorShellView.test.tsx
index a5f337aa4..3d0602a4e 100644
--- a/src/components/image-editor/ImageCanvasEditorShellView.test.tsx
+++ b/src/components/image-editor/ImageCanvasEditorShellView.test.tsx
@@ -220,6 +220,7 @@ function createStageProps(): ImageCanvasStageViewProps {
     onRemoveBackground: vi.fn(),
     onPerfectPixel: vi.fn(),
     onSplitIconSpritesheet: vi.fn(),
+    onSplitCharacterAnimation: vi.fn(),
     onExtractUiDesignAssets: vi.fn(),
     onUiAssetExtractionToolChange: vi.fn(),
     onUiAssetExtractionModelChange: vi.fn(),
diff --git a/src/components/image-editor/ImageCanvasEditorTypes.ts b/src/components/image-editor/ImageCanvasEditorTypes.ts
index 56f3937a4..77606d46e 100644
--- a/src/components/image-editor/ImageCanvasEditorTypes.ts
+++ b/src/components/image-editor/ImageCanvasEditorTypes.ts
@@ -6,6 +6,7 @@ import type {
 import type { EditorSceneStylePreset } from '../../../packages/shared/src/contracts/editorScene';
 import type {
   EditorAssetSnapshot,
+  EditorCharacterAnimationBackgroundColor,
   EditorCharacterAnimationFrameCount,
   EditorCharacterAnimationGenerationResult,
   EditorCharacterAnimationRatio,
@@ -183,6 +184,7 @@ export type CanvasTool =
   | 'upload'
   | 'generate'
   | 'video'
+  | 'character-animation'
   | 'music'
   | 'spec'
   | 'character'
@@ -219,6 +221,8 @@ export type CharacterReferenceImage = {
   mimeType?: string;
   sizeBytes?: number;
   durationSeconds?: number;
+  width?: number;
+  height?: number;
   objectKey?: string | null;
   assetObjectId?: string | null;
   resourceId?: string | null;
@@ -295,6 +299,7 @@ export type GenerateDialogState = {
   characterAnimationRatio?: EditorCharacterAnimationRatio;
   characterAnimationFrameCount?: EditorCharacterAnimationFrameCount;
   characterAnimationDurationSeconds?: 4 | 5 | 6;
+  characterAnimationBackgroundColor?: EditorCharacterAnimationBackgroundColor;
   characterAnimationResult?: EditorCharacterAnimationGenerationResult;
   soundModel?: EditorSoundEffectModel | 'audio1.0';
   soundDurationMode?: EditorSoundEffectDurationMode;
@@ -488,9 +493,11 @@ export type CropExpandResizeHandle =
   | 'bottom-right';
 
 export type CharacterAnimationPanelState = {
-  sourceLayerId: string;
+  sourceLayerId?: string;
+  references?: CharacterReferenceImage[];
   promptText: string;
   assetLabel?: string;
+  backgroundColor?: EditorCharacterAnimationBackgroundColor;
   resolution: EditorCharacterAnimationResolution;
   ratio: EditorCharacterAnimationRatio;
   frameCount: EditorCharacterAnimationFrameCount;
diff --git a/src/components/image-editor/ImageCanvasEditorView.tsx b/src/components/image-editor/ImageCanvasEditorView.tsx
index 3ff601c19..aa4403734 100644
--- a/src/components/image-editor/ImageCanvasEditorView.tsx
+++ b/src/components/image-editor/ImageCanvasEditorView.tsx
@@ -106,6 +106,7 @@ import { useImageCanvasStageController } from './useImageCanvasStageController';
 import { useImageCanvasStageInteractions } from './useImageCanvasStageInteractions';
 import {
   type ImageReferenceUploadCapacity,
+  resolveGenerationMediaReferenceUploadCapacity,
   useImageCanvasUploadWorkflow,
 } from './useImageCanvasUploadWorkflow';
 import {
@@ -230,10 +231,13 @@ function findSourceAnimationLayer(
   if (!sourceResourceId) {
     return null;
   }
+  // 与 useImageCanvasGenerationWorkflow 的同一实现保持一致——匹配
+  // resourceId 或历史落库的 layer id，且仅认定角色图层为动画来源。
   return (
     layers.find(
       (layer) =>
-        layer.resourceId === sourceResourceId || layer.id === sourceResourceId,
+        (layer.resourceId === sourceResourceId || layer.id === sourceResourceId) &&
+        layer.assetKind === 'character',
     ) ?? null
   );
 }
@@ -1404,6 +1408,7 @@ export function ImageCanvasEditorView({
     canvasSize,
     viewport,
     activeTool,
+    generateDialog,
     allocateUploadIndex: () => {
       layerCounterRef.current += 1;
       return layerCounterRef.current;
@@ -1596,6 +1601,8 @@ export function ImageCanvasEditorView({
     pendingPerfectPixelLayerIds,
     splitSelectedIconSpritesheet,
     splittingIconSpritesheetLayerIds,
+    splitSelectedCharacterAnimationFrames,
+    splittingCharacterAnimationLayerIds,
     extractUiDesignAssets,
     pickCharacterSpecFromLayer,
     pickGenerationReferenceFromLayer,
@@ -1658,6 +1665,21 @@ export function ImageCanvasEditorView({
       references.filter(
         (reference) => (reference.mediaType ?? 'image') === 'image',
       ).length;
+    const generationMediaCapacity =
+      resolveGenerationMediaReferenceUploadCapacity({
+        target,
+        dialog: generateDialog,
+      });
+    if (generationMediaCapacity) {
+      return generationMediaCapacity;
+    }
+    if (
+      target === 'video-reference-image' ||
+      target === 'video-reference-video' ||
+      target === 'video-reference-audio'
+    ) {
+      return null;
+    }
     const generateDialogContextId = generateDialog
       ? (generateDialog.id ??
         `${generateDialog.mode}:${generateDialog.sourceLayerId ?? 'draft'}`)
@@ -1874,6 +1896,9 @@ export function ImageCanvasEditorView({
         availableLayers: layersRef.current,
       });
       if (!restoredDraft) {
+        // 与 openRedrawPanel 的失败分支保持一致，避免从元信息面板改造失败时
+        // 静默无反馈。
+        showGenerationWarning('该生成配方当前无法恢复，无法改造。');
         return false;
       }
       openCanvasGenerationDialog(restoredDraft);
@@ -2572,6 +2597,7 @@ export function ImageCanvasEditorView({
     perfectPixelLayerIds,
     pendingPerfectPixelLayerIds,
     splittingIconSpritesheetLayerIds,
+    splittingCharacterAnimationLayerIds,
     uploadDropTarget,
     contextMenu,
     canvasClipboard,
@@ -2633,6 +2659,11 @@ export function ImageCanvasEditorView({
         splitSelectedIconSpritesheet(layer),
       );
     },
+    onSplitCharacterAnimation: (layer: CanvasLayer) => {
+      void flushProjectPersistence().then(() =>
+        splitSelectedCharacterAnimationFrames(layer),
+      );
+    },
     onExtractUiDesignAssets: extractUiDesignAssets,
     onUiAssetExtractionToolChange: changeUiAssetExtractionTool,
     onUiAssetExtractionModelChange: changeUiAssetExtractionModel,
diff --git a/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx b/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx
index 1ad871478..68b1bec1a 100644
--- a/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx
+++ b/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx
@@ -122,6 +122,68 @@ function createComposerProps(
   };
 }
 
+function CharacterAnimationReferenceHarness() {
+  const [dialog, setDialog] = useState<GenerateDialogState | null>({
+    id: 'dialog-character-animation-reference',
+    mode: 'character-animation',
+    prompt: '原地挥手',
+    status: 'idle',
+    composerOpen: true,
+    sourceLayerId: 'layer-character',
+    generationReferences: [
+      {
+        id: 'canvas-layer-character',
+        label: '角色图片',
+        src: 'generated/character.png',
+        mediaType: 'image',
+        resourceId: 'resource-character',
+      },
+    ],
+    characterAnimationRatio: 'same',
+    characterAnimationResolution: '480p',
+    characterAnimationFrameCount: 32,
+    characterAnimationDurationSeconds: 4,
+  });
+  if (!dialog) {
+    return null;
+  }
+
+  return (
+    <ImageCanvasGenerationComposerView
+      {...createComposerProps(dialog, { setGenerateDialog: setDialog })}
+    />
+  );
+}
+
+function CharacterAnimationParametersHarness({
+  backgroundColor,
+}: {
+  backgroundColor?: GenerateDialogState['characterAnimationBackgroundColor'];
+}) {
+  const [dialog, setDialog] = useState<GenerateDialogState | null>({
+    id: 'dialog-character-animation-parameters',
+    mode: 'character-animation',
+    prompt: '原地奔跑',
+    status: 'idle',
+    composerOpen: true,
+    generationReferences: [],
+    characterAnimationBackgroundColor: backgroundColor,
+    characterAnimationRatio: '1:1',
+    characterAnimationResolution: '480p',
+    characterAnimationFrameCount: 32,
+    characterAnimationDurationSeconds: 4,
+  });
+  if (!dialog) {
+    return null;
+  }
+
+  return (
+    <ImageCanvasGenerationComposerView
+      {...createComposerProps(dialog, { setGenerateDialog: setDialog })}
+    />
+  );
+}
+
 function SceneValidationHarness({
   initialDialog,
 }: {
@@ -1889,7 +1951,9 @@ describe('ImageCanvasGenerationComposerView', () => {
       try {
         fireEvent.keyDown(automaticDuration, { key: 'Escape' });
 
-        expect(screen.queryByRole('group', { name: '音效时长选项' })).toBeNull();
+        expect(
+          screen.queryByRole('group', { name: '音效时长选项' }),
+        ).toBeNull();
         expect(document.activeElement).toBe(trigger);
         expect(globalEscape).not.toHaveBeenCalled();
 
@@ -1927,6 +1991,347 @@ describe('ImageCanvasGenerationComposerView', () => {
     });
   });
 
+  it('序列帧动作预设每行八个且更多动作按八个逐行展开', () => {
+    renderComposer({
+      id: 'dialog-character-animation-action-presets',
+      mode: 'character-animation',
+      prompt: '',
+      status: 'idle',
+      composerOpen: true,
+      generationReferences: [],
+    });
+
+    const actionPresets = within(screen.getByLabelText('动作预设'));
+    const getActionButtons = () => actionPresets.getAllByRole('button');
+    const getMoreButton = () =>
+      actionPresets.getByRole('button', { name: '更多' });
+
+    expect(screen.getByLabelText('动作预设').style.gridTemplateColumns).toBe(
+      'repeat(8, minmax(0, 1fr))',
+    );
+    expect(getActionButtons()).toHaveLength(8);
+    expect(
+      getActionButtons()
+        .slice(0, 7)
+        .map((button) => button.textContent),
+    ).toEqual(['行走', '待机', '奔跑', '跳跃', '攻击', '受击', '倒下']);
+    expect(getActionButtons()[7]).toBe(getMoreButton());
+    expect(getMoreButton().getAttribute('aria-expanded')).toBe('false');
+    expect(actionPresets.queryByRole('button', { name: '冲刺' })).toBeNull();
+
+    fireEvent.click(getMoreButton());
+
+    expect(getActionButtons()).toHaveLength(16);
+    expect(getActionButtons().at(-1)).toBe(getMoreButton());
+    expect(
+      getActionButtons()
+        .slice(7, 15)
+        .map((button) => button.textContent),
+    ).toEqual(['冲刺', '飞行', '悬浮', '爬行', '劈砍', '突刺', '砸击', '拳击']);
+    expect(actionPresets.queryByRole('button', { name: '踢击' })).toBeNull();
+    expect(document.activeElement).toBe(
+      actionPresets.getByRole('button', { name: '冲刺' }),
+    );
+    expect(getMoreButton().getAttribute('aria-expanded')).toBe('true');
+    expect(screen.getByRole('status').textContent).toBe('已显示8个更多动作');
+
+    fireEvent.click(getMoreButton());
+
+    expect(getActionButtons()).toHaveLength(24);
+    expect(getActionButtons().at(-1)).toBe(getMoreButton());
+    expect(
+      getActionButtons()
+        .slice(15, 23)
+        .map((button) => button.textContent),
+    ).toEqual(['踢击', '射击', '施法', '格挡', '闪避', '招架', '举盾', '蹲下']);
+    expect(actionPresets.queryByRole('button', { name: '呼吸' })).toBeNull();
+    expect(document.activeElement).toBe(
+      actionPresets.getByRole('button', { name: '踢击' }),
+    );
+    expect(screen.getByRole('status').textContent).toBe('已显示16个更多动作');
+
+    fireEvent.click(getMoreButton());
+
+    expect(getActionButtons()).toHaveLength(32);
+    expect(actionPresets.getByRole('button', { name: '伸展' })).toBeTruthy();
+    expect(actionPresets.getByRole('button', { name: '速度线' })).toBeTruthy();
+    expect(
+      actionPresets.queryByRole('button', { name: '冲击波' }),
+    ).toBeTruthy();
+    expect(
+      actionPresets.queryByRole('button', { name: '粒子爆发' }),
+    ).toBeNull();
+    expect(actionPresets.queryByRole('button', { name: '更多' })).toBeTruthy();
+
+    fireEvent.click(getMoreButton());
+
+    expect(getActionButtons()).toHaveLength(33);
+    expect(
+      actionPresets.getByRole('button', { name: '粒子爆发' }),
+    ).toBeTruthy();
+    expect(actionPresets.queryByRole('button', { name: '更多' })).toBeNull();
+    const collapseButton = actionPresets.getByRole('button', { name: '收起' });
+    expect(getActionButtons().at(-1)).toBe(collapseButton);
+    expect(collapseButton.getAttribute('aria-expanded')).toBe('true');
+    expect(screen.getByRole('status').textContent).toBe(
+      '已显示全部25个更多动作',
+    );
+
+    fireEvent.click(collapseButton);
+
+    expect(getActionButtons()).toHaveLength(8);
+    expect(actionPresets.queryByRole('button', { name: '冲刺' })).toBeNull();
+    expect(getMoreButton().getAttribute('aria-expanded')).toBe('false');
+    expect(screen.getByRole('status').textContent).toBe('更多动作已收起');
+  });
+
+  it('序列帧画布选参考提示角色图或视频，其他模式保持原提示', () => {
+    renderComposer(
+      {
+        id: 'dialog-character-animation-picking',
+        mode: 'character-animation',
+        prompt: '',
+        status: 'idle',
+        composerOpen: true,
+      },
+      { isPickingGenerationReferenceFromCanvas: true },
+    );
+
+    expect(
+      screen.getByText('请选择画布中的角色图或视频作为参考，按 Esc 退出'),
+    ).toBeTruthy();
+  });
+
+  it('普通生成画布选参考仍显示图片提示', () => {
+    renderComposer(
+      {
+        id: 'dialog-image-picking',
+        mode: 'generate',
+        prompt: '',
+        status: 'idle',
+        composerOpen: true,
+      },
+      { isPickingGenerationReferenceFromCanvas: true },
+    );
+
+    expect(
+      screen.getByText('请选择画布中的图片作为参考图，按 Esc 退出'),
+    ).toBeTruthy();
+  });
+
+  it('序列帧背景、比例、帧数时长和清晰度可独立选中并保留其他参数', () => {
+    render(<CharacterAnimationParametersHarness backgroundColor="green" />);
+
+    const panel = screen.getByRole('dialog', {
+      name: 'Spine序列帧动画生成',
+    });
+    const backgroundOptions = within(panel).getByRole('group', {
+      name: '背景颜色',
+    });
+    const parameterTrigger = within(panel).getByRole('button', {
+      name: '序列帧参数 1:1 · 4秒 · 480p',
+    });
+
+    expect(screen.queryByRole('group', { name: '画面比例' })).toBeNull();
+    fireEvent.click(
+      within(backgroundOptions).getByRole('button', {
+        name: '背景颜色 蓝色',
+      }),
+    );
+    fireEvent.click(parameterTrigger);
+
+    const parameterMenu = screen.getByRole('group', {
+      name: '序列帧参数选项',
+    });
+    const ratioOptions = within(parameterMenu).getByRole('group', {
+      name: '画面比例',
+    });
+    const durationOptions = within(parameterMenu).getByRole('group', {
+      name: '帧数和时长',
+    });
+    const resolutionOptions = within(parameterMenu).getByRole('group', {
+      name: '清晰度',
+    });
+    const greenButton = within(backgroundOptions).getByRole('button', {
+      name: '背景颜色 绿色',
+    });
+    const blueButton = within(backgroundOptions).getByRole('button', {
+      name: '背景颜色 蓝色',
+    });
+    const squareButton = within(ratioOptions).getByRole('button', {
+      name: '1:1',
+    });
+    const landscapeButton = within(ratioOptions).getByRole('button', {
+      name: '16:9',
+    });
+    const defaultDurationButton = within(durationOptions).getByRole('button', {
+      name: '32帧·4秒',
+    });
+    const extendedDurationButton = within(durationOptions).getByRole('button', {
+      name: '40帧·5秒',
+    });
+    const defaultResolutionButton = within(resolutionOptions).getByRole(
+      'button',
+      { name: '480p' },
+    );
+    const highResolutionButton = within(resolutionOptions).getByRole('button', {
+      name: '720p',
+    });
+
+    expect(greenButton.getAttribute('aria-pressed')).toBe('false');
+    expect(blueButton.getAttribute('aria-pressed')).toBe('true');
+    expect(squareButton.getAttribute('aria-pressed')).toBe('true');
+    expect(defaultDurationButton.getAttribute('aria-pressed')).toBe('true');
+    expect(defaultResolutionButton.getAttribute('aria-pressed')).toBe('true');
+
+    fireEvent.click(landscapeButton);
+    fireEvent.click(extendedDurationButton);
+    fireEvent.click(highResolutionButton);
+
+    expect(
+      within(backgroundOptions)
+        .getByRole('button', { name: '背景颜色 蓝色' })
+        .getAttribute('aria-pressed'),
+    ).toBe('true');
+    expect(
+      within(backgroundOptions)
+        .getByRole('button', { name: '背景颜色 绿色' })
+        .getAttribute('aria-pressed'),
+    ).toBe('false');
+    expect(
+      screen.getByRole('button', { name: '16:9' }).getAttribute('aria-pressed'),
+    ).toBe('true');
+    expect(
+      screen.getByRole('button', { name: '1:1' }).getAttribute('aria-pressed'),
+    ).toBe('false');
+    expect(
+      screen
+        .getByRole('button', { name: '40帧·5秒' })
+        .getAttribute('aria-pressed'),
+    ).toBe('true');
+    expect(
+      screen
+        .getByRole('button', { name: '32帧·4秒' })
+        .getAttribute('aria-pressed'),
+    ).toBe('false');
+    expect(
+      screen.getByRole('button', { name: '720p' }).getAttribute('aria-pressed'),
+    ).toBe('true');
+    expect(
+      screen.getByRole('button', { name: '480p' }).getAttribute('aria-pressed'),
+    ).toBe('false');
+    expect(
+      within(panel).getByRole('button', {
+        name: '序列帧参数 16:9 · 5秒 · 720p',
+      }),
+    ).toBeTruthy();
+    expect(
+      within(panel)
+        .getByRole('button', { name: '生成Spine序列帧动画' })
+        .classList.contains('image-canvas-editor__character-animation-submit'),
+    ).toBe(true);
+  });
+
+  it('旧角色图入口未显式选键色时不伪装成绿色已选', () => {
+    render(<CharacterAnimationParametersHarness backgroundColor={undefined} />);
+
+    const backgroundOptions = screen.getByRole('group', { name: '背景颜色' });
+    expect(
+      within(backgroundOptions)
+        .getAllByRole('button')
+        .every((button) => button.getAttribute('aria-pressed') === 'false'),
+    ).toBe(true);
+  });
+
+  it('序列帧生成中禁用动作预设和更多按钮', () => {
+    renderComposer({
+      id: 'dialog-character-animation-generating-actions',
+      mode: 'character-animation',
+      prompt: '原地奔跑',
+      status: 'generating',
+      composerOpen: true,
+      generationReferences: [],
+    });
+
+    const actionPresets = within(screen.getByLabelText('动作预设'));
+    const actionButtons = actionPresets.getAllByRole('button');
+    expect(actionButtons).toHaveLength(8);
+    expect(
+      actionButtons.every((button) => (button as HTMLButtonElement).disabled),
+    ).toBe(true);
+
+    fireEvent.click(actionPresets.getByRole('button', { name: '更多' }));
+
+    expect(actionPresets.getAllByRole('button')).toHaveLength(8);
+    expect(actionPresets.queryByRole('button', { name: '冲刺' })).toBeNull();
+
+    expect(
+      within(screen.getByRole('group', { name: '背景颜色' }))
+        .getAllByRole('button')
+        .every((button) => (button as HTMLButtonElement).disabled),
+    ).toBe(true);
+    expect(
+      (
+        screen.getByRole('button', {
+          name: '序列帧参数 1:1 · 4秒 · 480p',
+        }) as HTMLButtonElement
+      ).disabled,
+    ).toBe(true);
+    expect(screen.queryByRole('group', { name: '画面比例' })).toBeNull();
+    expect(
+      (
+        screen.getByRole('button', {
+          name: '生成Spine序列帧动画',
+        }) as HTMLButtonElement
+      ).disabled,
+    ).toBe(true);
+  });
+
+  it('移除序列帧参考素材后回到文本模式并清除同图尺寸', () => {
+    render(<CharacterAnimationReferenceHarness />);
+
+    const panel = screen.getByRole('dialog', {
+      name: 'Spine序列帧动画生成',
+    });
+    fireEvent.click(
+      within(panel).getByRole('button', {
+        name: '序列帧参数 同图尺寸 · 4秒 · 480p',
+      }),
+    );
+    expect(
+      within(screen.getByRole('group', { name: '画面比例' })).getByRole(
+        'button',
+        { name: '同图尺寸' },
+      ),
+    ).toBeTruthy();
+
+    fireEvent.click(
+      within(panel).getByRole('button', { name: '删除角色图片' }),
+    );
+
+    expect(
+      within(screen.getByRole('group', { name: '画面比例' })).queryByRole(
+        'button',
+        { name: '同图尺寸' },
+      ),
+    ).toBeNull();
+    const ratioOptions = within(
+      screen.getByRole('group', { name: '画面比例' }),
+    );
+    const squareRatioButton = ratioOptions.getByRole('button', {
+      name: '1:1',
+    });
+    const landscapeRatioButton = ratioOptions.getByRole('button', {
+      name: '16:9',
+    });
+    expect(squareRatioButton.getAttribute('aria-pressed')).toBe('true');
+
+    fireEvent.click(landscapeRatioButton);
+
+    expect(landscapeRatioButton.getAttribute('aria-pressed')).toBe('true');
+    expect(squareRatioButton.getAttribute('aria-pressed')).toBe('false');
+  });
+
   it('生成规范参考图点击先弹来源菜单，不直接打开上传', () => {
     const onRequestUpload = vi.fn();
     const setIsGenerationReferenceMenuOpen = vi.fn();
diff --git a/src/components/image-editor/ImageCanvasGenerationComposerView.tsx b/src/components/image-editor/ImageCanvasGenerationComposerView.tsx
index 313160036..b6a07d5dd 100644
--- a/src/components/image-editor/ImageCanvasGenerationComposerView.tsx
+++ b/src/components/image-editor/ImageCanvasGenerationComposerView.tsx
@@ -68,9 +68,17 @@ import type {
   UploadTarget,
 } from './ImageCanvasEditorTypes';
 import {
+  calculateCharacterAnimationPrice,
   calculateEditorBackgroundMusicPrice,
   calculateEditorSoundEffectPrice,
   calculateEditorVideoPrice,
+  CHARACTER_ANIMATION_ACTION_PROMPTS,
+  CHARACTER_ANIMATION_BACKGROUND_OPTIONS,
+  CHARACTER_ANIMATION_DURATION_OPTIONS,
+  CHARACTER_ANIMATION_MODEL,
+  CHARACTER_ANIMATION_MORE_ACTION_PROMPTS,
+  CHARACTER_ANIMATION_RATIO_OPTIONS,
+  CHARACTER_ANIMATION_RESOLUTION_OPTIONS,
   DEFAULT_BACKGROUND_MUSIC_MODEL,
   DEFAULT_SOUND_EFFECT_DURATION_SECONDS,
   DEFAULT_SOUND_EFFECT_MODEL,
@@ -81,6 +89,7 @@ import {
   EDITOR_VIDEO_ASPECT_RATIO_OPTIONS,
   EDITOR_VIDEO_MODEL_OPTIONS,
   EDITOR_VIDEO_RESOLUTION_OPTIONS,
+  resizeGenerationPlaceholderToCharacterAnimationSelection,
   resizeGenerationPlaceholderToVideoSelection,
   SPEC_TYPE_LABEL,
   VIDEO_MODEL_SEEDANCE_2_FAST,
@@ -371,6 +380,432 @@ function VideoOptionChoice({
   );
 }
 
+const CHARACTER_ANIMATION_ACTIONS_PER_ROW = 8;
+
+function ImageCanvasSequenceAnimationComposerView({
+  dialog,
+  style,
+  generationReferenceButtonRef,
+  isGenerationReferenceMenuOpen,
+  setGenerateDialog,
+  setIsGenerationReferenceMenuOpen,
+  setIsPickingGenerationReferenceFromCanvas,
+  renderEditorPortal,
+  buildPortalMenuStyle,
+  onRequestUpload,
+  onSubmit,
+}: {
+  dialog: GenerateDialogState;
+  style: CSSProperties;
+  generationReferenceButtonRef: RefObject<HTMLButtonElement | null>;
+  isGenerationReferenceMenuOpen: boolean;
+  setGenerateDialog: Dispatch<SetStateAction<GenerateDialogState | null>>;
+  setIsGenerationReferenceMenuOpen: Dispatch<SetStateAction<boolean>>;
+  setIsPickingGenerationReferenceFromCanvas: Dispatch<SetStateAction<boolean>>;
+  renderEditorPortal: (node: ReactNode) => ReactNode;
+  buildPortalMenuStyle: (
+    anchor: HTMLElement | null,
+    placement: 'above' | 'below',
+  ) => CSSProperties;
+  onRequestUpload: (target: UploadTarget) => void;
+  onSubmit: () => void;
+}) {
+  const [visibleMoreActionCount, setVisibleMoreActionCount] = useState(0);
+  const [actionPresetAnnouncement, setActionPresetAnnouncement] = useState('');
+  const [isParameterMenuOpen, setIsParameterMenuOpen] = useState(false);
+  const parameterMenuButtonRef = useRef<HTMLButtonElement | null>(null);
+  const pendingActionFocusIndexRef = useRef<number | null>(null);
+  const pendingActionFocusTargetRef = useRef<HTMLButtonElement | null>(null);
+  const reference = dialog.generationReferences?.[0];
+  const isGenerating = dialog.status === 'generating';
+  const resolution = dialog.characterAnimationResolution ?? '480p';
+  const ratio = dialog.characterAnimationRatio ?? '1:1';
+  const frameCount = dialog.characterAnimationFrameCount ?? 32;
+  const durationSeconds = dialog.characterAnimationDurationSeconds ?? 4;
+  const backgroundColor = dialog.characterAnimationBackgroundColor;
+  const hasExpandedActions = visibleMoreActionCount > 0;
+  const hasExpandedAllActions =
+    visibleMoreActionCount >= CHARACTER_ANIMATION_MORE_ACTION_PROMPTS.length;
+  const visibleMoreActions = CHARACTER_ANIMATION_MORE_ACTION_PROMPTS.slice(
+    0,
+    visibleMoreActionCount,
+  );
+  const closeParameterMenu = useCallback(() => {
+    setIsParameterMenuOpen(false);
+  }, []);
+  useImageCanvasFloatingOptionDismiss({
+    isOpen: isParameterMenuOpen,
+    boundaryRefs: [parameterMenuButtonRef],
+    onDismiss: closeParameterMenu,
+    restoreFocusRef: parameterMenuButtonRef,
+  });
+  useEffect(() => {
+    if (pendingActionFocusIndexRef.current === null) {
+      return;
+    }
+    pendingActionFocusTargetRef.current?.focus();
+    pendingActionFocusIndexRef.current = null;
+  }, [visibleMoreActionCount]);
+  const price = calculateCharacterAnimationPrice(
+    CHARACTER_ANIMATION_MODEL,
+    resolution,
+    durationSeconds,
+  );
+  const updateDialog = (patch: Partial<GenerateDialogState>) => {
+    setGenerateDialog((currentDialog) =>
+      currentDialog?.mode === 'character-animation'
+        ? resizeGenerationPlaceholderToCharacterAnimationSelection({
+            ...currentDialog,
+            status:
+              currentDialog.status === 'failed' ? 'idle' : currentDialog.status,
+            errorMessage:
+              currentDialog.status === 'failed'
+                ? undefined
+                : currentDialog.errorMessage,
+            ...patch,
+          })
+        : currentDialog,
+    );
+  };
+  const applyActionPrompt = (label: string, text?: string) => {
+    updateDialog({ prompt: text ?? `${label}动作，角色完整且动作连贯。` });
+  };
+
+  return (
+    <>
+      <div
+        className="image-canvas-editor__generation-composer image-canvas-editor__generation-composer--image image-canvas-editor__generation-composer--character-animation"
+        style={style}
+        role="dialog"
+        aria-label="Spine序列帧动画生成"
+        onPointerDown={(event) => event.stopPropagation()}
+      >
+        <div className="image-canvas-editor__reference-strip">
+          {reference ? (
+            <VideoReferenceChip
+              reference={reference}
+              index={0}
+              onRemove={() => {
+                // 仅当比例是“同图尺寸”时才回落到 1:1；用户显式选过 4:3/16:9 等
+                // 比例时移除参考应保留原选择。
+                const isSameRatio = dialog.characterAnimationRatio === 'same';
+                updateDialog({
+                  sourceLayerId: undefined,
+                  generationReferences: [],
+                  ...(isSameRatio ? { characterAnimationRatio: '1:1' } : {}),
+                });
+              }}
+            />
+          ) : null}
+          <ImageCanvasReferenceSlot
+            buttonRef={generationReferenceButtonRef}
+            tone="character"
+            icon={<ImageIcon className="h-4 w-4" aria-hidden="true" />}
+            label="参考"
+            ariaLabel="添加序列帧参考素材"
+            disabled={isGenerating}
+            isAdd
+            onClick={() => {
+              closeParameterMenu();
+              setIsGenerationReferenceMenuOpen((open) => !open);
+            }}
+          />
+        </div>
+        <AutoGrowTextArea
+          aria-label="动画描述"
+          value={dialog.prompt}
+          maxLength={4000}
+          disabled={isGenerating}
+          placeholder="请描述人物、朝向、做什么、如何做。比如：让人物朝侧面原地不断快速奔跑。"
+          className="max-h-64 image-canvas-editor__generation-prompt image-canvas-editor__character-animation-textarea"
+          onValueChange={(prompt) => updateDialog({ prompt })}
+        />
+        <div
+          className="image-canvas-editor__character-animation-backgrounds"
+          role="group"
+          aria-label="背景颜色"
+        >
+          {CHARACTER_ANIMATION_BACKGROUND_OPTIONS.map((option) => (
+            <button
+              key={option.value}
+              type="button"
+              className={`image-canvas-editor__character-animation-color-button image-canvas-editor__character-animation-color-button--${option.value}`}
+              aria-label={`背景颜色 ${option.label}`}
+              aria-pressed={backgroundColor === option.value}
+              disabled={isGenerating}
+              onClick={() =>
+                updateDialog({
+                  characterAnimationBackgroundColor: option.value,
+                })
+              }
+            >
+              {option.label}
+            </button>
+          ))}
+        </div>
+        <div
+          className="image-canvas-editor__character-animation-presets"
+          aria-label="动作预设"
+          style={{
+            display: 'grid',
+            gridTemplateColumns: `repeat(${CHARACTER_ANIMATION_ACTIONS_PER_ROW}, minmax(0, 1fr))`,
+          }}
+        >
+          {CHARACTER_ANIMATION_ACTION_PROMPTS.map((preset) => (
+            <button
+              key={preset.label}
+              type="button"
+              className="image-canvas-editor__character-animation-preset image-canvas-editor__character-animation-preset--action"
+              disabled={isGenerating}
+              onClick={() => applyActionPrompt(preset.label, preset.text)}
+            >
+              {preset.label}
+            </button>
+          ))}
+          {visibleMoreActions.map((label, index) => (
+            <button
+              key={label}
+              ref={(button) => {
+                if (index === pendingActionFocusIndexRef.current) {
+                  pendingActionFocusTargetRef.current = button;
+                }
+              }}
+              type="button"
+              className="image-canvas-editor__character-animation-preset image-canvas-editor__character-animation-preset--action"
+              disabled={isGenerating}
+              onClick={() => applyActionPrompt(label)}
+            >
+              {label}
+            </button>
+          ))}
+          <button
+            type="button"
+            className="image-canvas-editor__character-animation-preset image-canvas-editor__character-animation-preset--action"
+            disabled={isGenerating}
+            aria-expanded={hasExpandedActions}
+            onClick={() => {
+              const nextCount = hasExpandedAllActions
+                ? 0
+                : Math.min(
+                    visibleMoreActionCount +
+                      CHARACTER_ANIMATION_ACTIONS_PER_ROW,
+                    CHARACTER_ANIMATION_MORE_ACTION_PROMPTS.length,
+                  );
+              pendingActionFocusIndexRef.current = hasExpandedAllActions
+                ? null
+                : visibleMoreActionCount;
+              setVisibleMoreActionCount(nextCount);
+              setActionPresetAnnouncement(
+                nextCount === 0
+                  ? '更多动作已收起'
+                  : nextCount >= CHARACTER_ANIMATION_MORE_ACTION_PROMPTS.length
+                    ? `已显示全部${nextCount}个更多动作`
+                    : `已显示${nextCount}个更多动作`,
+              );
+            }}
+          >
+            {hasExpandedAllActions ? '收起' : '更多'}
+          </button>
+          <span
+            className="sr-only"
+            role="status"
+            aria-live="polite"
+            aria-atomic="true"
+          >
+            {actionPresetAnnouncement}
+          </span>
+        </div>
+        <div className="image-canvas-editor__character-animation-footer">
+          <PlatformInlineOptionButton
+            ref={parameterMenuButtonRef}
+            className="image-canvas-editor__character-animation-parameter-trigger"
+            aria-label={`序列帧参数 ${ratio === 'same' ? '同图尺寸' : ratio} · ${durationSeconds}秒 · ${resolution}`}
+            aria-expanded={isParameterMenuOpen}
+            disabled={isGenerating}
+            trailingIcon={<ChevronDown className="h-3 w-3" />}
+            onClick={() => {
+              setIsGenerationReferenceMenuOpen(false);
+              setIsParameterMenuOpen((open) => !open);
+            }}
+          >
+            {ratio === 'same' ? '同图尺寸' : ratio} · {durationSeconds}秒 ·{' '}
+            {resolution}
+          </PlatformInlineOptionButton>
+          <PlatformActionButton
+            className="image-canvas-editor__character-animation-submit"
+            type="button"
+            tone="secondary"
+            size="xs"
+            shape="pill"
+            disabled={isGenerating || !dialog.prompt.trim()}
+            aria-label="生成Spine序列帧动画"
+            onClick={() => {
+              if (!isGenerating) {
+                onSubmit();
+              }
+            }}
+          >
+            {isGenerating ? '生成中' : `生成${price}泥点`}
+          </PlatformActionButton>
+        </div>
+        {dialog.status === 'failed' ? (
+          <PlatformStatusMessage tone="error" surface="platform" size="xs">
+            {dialog.errorMessage ?? '生成Spine序列帧动画失败'}
+          </PlatformStatusMessage>
+        ) : null}
+      </div>
+      {isParameterMenuOpen
+        ? renderEditorPortal(
+            <PlatformFloatingMenu
+              className="image-canvas-editor__character-animation-parameter-menu image-canvas-editor__portal-menu"
+              label="序列帧参数选项"
+              variant="options"
+              placement="top-start"
+              style={buildPortalMenuStyle(
+                parameterMenuButtonRef.current,
+                'above',
+              )}
+              onPointerDown={(event) => event.stopPropagation()}
+              onClick={(event) => event.stopPropagation()}
+            >
+              <section className="image-canvas-editor__character-animation-menu-section">
+                <span className="image-canvas-editor__character-animation-menu-title">
+                  比例
+                </span>
+                <div
+                  className="image-canvas-editor__character-animation-ratio-grid"
+                  role="group"
+                  aria-label="画面比例"
+                >
+                  {CHARACTER_ANIMATION_RATIO_OPTIONS.filter(
+                    (option) => reference || option.value !== 'same',
+                  ).map((option) => (
+                    <button
+                      key={option.value}
+                      type="button"
+                      className="image-canvas-editor__character-animation-ratio-choice"
+                      aria-label={
+                        option.value === 'same' ? '同图尺寸' : option.value
+                      }
+                      aria-pressed={ratio === option.value}
+                      disabled={isGenerating}
+                      onClick={() =>
+                        updateDialog({ characterAnimationRatio: option.value })
+                      }
+                    >
+                      <span
+                        className="image-canvas-editor__ratio-wireframe"
+                        data-ratio={option.value}
+                        aria-hidden="true"
+                      />
+                      <span>
+                        {option.value === 'same' ? '同图尺寸' : option.value}
+                      </span>
+                    </button>
+                  ))}
+                </div>
+              </section>
+              <section className="image-canvas-editor__character-animation-menu-section">
+                <span className="image-canvas-editor__character-animation-menu-title">
+                  时长
+                </span>
+                <div
+                  className="image-canvas-editor__character-animation-menu-options"
+                  role="group"
+                  aria-label="帧数和时长"
+                >
+                  {CHARACTER_ANIMATION_DURATION_OPTIONS.map((option) => (
+                    <button
+                      key={option.frameCount}
+                      type="button"
+                      className="image-canvas-editor__character-animation-menu-pill"
+                      aria-pressed={frameCount === option.frameCount}
+                      disabled={isGenerating}
+                      onClick={() =>
+                        updateDialog({
+                          characterAnimationFrameCount: option.frameCount,
+                          characterAnimationDurationSeconds:
+                            option.durationSeconds,
+                        })
+                      }
+                    >
+                      {option.label}
+                    </button>
+                  ))}
+                </div>
+              </section>
+              <section className="image-canvas-editor__character-animation-menu-section">
+                <span className="image-canvas-editor__character-animation-menu-title">
+                  清晰度
+                </span>
+                <div
+                  className="image-canvas-editor__character-animation-menu-options"
+                  role="group"
+                  aria-label="清晰度"
+                >
+                  {CHARACTER_ANIMATION_RESOLUTION_OPTIONS.map((value) => (
+                    <button
+                      key={value}
+                      type="button"
+                      className="image-canvas-editor__character-animation-menu-pill"
+                      aria-pressed={resolution === value}
+                      disabled={isGenerating}
+                      onClick={() =>
+                        updateDialog({ characterAnimationResolution: value })
+                      }
+                    >
+                      {value}
+                    </button>
+                  ))}
+                </div>
+              </section>
+            </PlatformFloatingMenu>,
+          )
+        : null}
+      {isGenerationReferenceMenuOpen
+        ? renderEditorPortal(
+            <PlatformFloatingMenu
+              className="image-canvas-editor__spec-menu image-canvas-editor__portal-menu"
+              label="序列帧参考素材来源"
+              placement="top-start"
+              style={buildPortalMenuStyle(
+                generationReferenceButtonRef.current,
+                'above',
+              )}
+            >
+              <PlatformFloatingMenuItem
+                onClick={() => {
+                  setIsGenerationReferenceMenuOpen(false);
+                  setIsPickingGenerationReferenceFromCanvas(true);
+                }}
+              >
+                从画布中选择
+              </PlatformFloatingMenuItem>
+              <PlatformFloatingMenuItem
+                onClick={() => {
+                  setIsGenerationReferenceMenuOpen(false);
+                  setIsPickingGenerationReferenceFromCanvas(false);
+                  onRequestUpload('video-reference-image');
+                }}
+              >
+                上传图片
+              </PlatformFloatingMenuItem>
+              <PlatformFloatingMenuItem
+                onClick={() => {
+                  setIsGenerationReferenceMenuOpen(false);
+                  setIsPickingGenerationReferenceFromCanvas(false);
+                  onRequestUpload('video-reference-video');
+                }}
+              >
+                上传视频
+              </PlatformFloatingMenuItem>
+            </PlatformFloatingMenu>,
+          )
+        : null}
+    </>
+  );
+}
+
 function ImageCanvasVideoGenerationComposerView({
   dialog,
   style,
@@ -1689,6 +2124,26 @@ export function ImageCanvasGenerationComposerView({
         />
       ) : null}
 
+      {generateDialog?.mode === 'character-animation' &&
+      generateDialog.composerOpen !== false &&
+      generationComposerStyle ? (
+        <ImageCanvasSequenceAnimationComposerView
+          dialog={generateDialog}
+          style={generationComposerStyle}
+          generationReferenceButtonRef={generationReferenceButtonRef}
+          isGenerationReferenceMenuOpen={isGenerationReferenceMenuOpen}
+          setGenerateDialog={setGenerateDialog}
+          setIsGenerationReferenceMenuOpen={setIsGenerationReferenceMenuOpen}
+          setIsPickingGenerationReferenceFromCanvas={
+            setIsPickingGenerationReferenceFromCanvas
+          }
+          renderEditorPortal={renderEditorPortal}
+          buildPortalMenuStyle={buildPortalMenuStyle}
+          onRequestUpload={onRequestUpload}
+          onSubmit={onSubmitCharacterAnimation}
+        />
+      ) : null}
+
       {(generateDialog?.mode === 'audio-sound-effect' ||
         generateDialog?.mode === 'audio-background-music') &&
       generateDialog.composerOpen !== false &&
@@ -1768,7 +2223,9 @@ export function ImageCanvasGenerationComposerView({
       ) : null}
       {isPickingGenerationReferenceFromCanvas ? (
         <div className="image-canvas-editor__canvas-pick-hint">
-          请选择画布中的图片作为参考图，按 Esc 退出
+          {generateDialog?.mode === 'character-animation'
+            ? '请选择画布中的角色图或视频作为参考，按 Esc 退出'
+            : '请选择画布中的图片作为参考图，按 Esc 退出'}
         </div>
       ) : null}
       {isPickingQuickEditReferenceFromCanvas ? (
@@ -1824,6 +2281,7 @@ export function ImageCanvasGenerationComposerView({
 
       {characterAnimationPanel &&
       characterAnimationSourceLayer &&
+      generateDialog?.mode !== 'character-animation' &&
       characterAnimationPanelStyle ? (
         <ImageCanvasCharacterAnimationPanelView
           panel={characterAnimationPanel}
diff --git a/src/components/image-editor/ImageCanvasGenerationDialogModel.test.ts b/src/components/image-editor/ImageCanvasGenerationDialogModel.test.ts
index 7782a2ba6..0b48914ab 100644
--- a/src/components/image-editor/ImageCanvasGenerationDialogModel.test.ts
+++ b/src/components/image-editor/ImageCanvasGenerationDialogModel.test.ts
@@ -487,6 +487,19 @@ describe('ImageCanvasGenerationDialogModel', () => {
     ).toMatchObject({ mode: 'generate', prompt: '原图提示' });
     expect(createCharacterAnimationPanelDraft(sourceLayer)).toEqual({
       sourceLayerId: 'layer-source',
+      references: [
+        {
+          id: 'canvas-layer-source',
+          label: '源图',
+          src: 'data:image/png;base64,source',
+          objectKey: undefined,
+          assetObjectId: undefined,
+          resourceId: 'resource-source',
+          sourceAssetId: undefined,
+          width: 1024,
+          height: 768,
+        },
+      ],
       promptText: '',
       resolution: '480p',
       ratio: 'same',
@@ -1374,6 +1387,122 @@ describe('ImageCanvasGenerationDialogModel', () => {
     });
   });
 
+  it('restores an uploaded video reference from the stable generation snapshot', () => {
+    expect(
+      createSameSourceGenerationDialogDraft({
+        sourceLayer: createLayer({
+          id: 'layer-animation-result',
+          sourceType: 'generated',
+          assetKind: 'character-animation',
+          generationInputs: {
+            version: 2,
+            action: 'character-animation.generate',
+            fields: [
+              { id: 'inputMode', title: '输入模式', value: 'video' },
+              { id: 'prompt', title: '动作描述', value: '复刻奔跑节奏' },
+              {
+                id: 'referenceSrc',
+                title: '参考素材',
+                value: 'users/user-1/action.mp4',
+              },
+              {
+                id: 'referenceMediaType',
+                title: '参考类型',
+                value: 'video',
+              },
+              { id: 'referenceWidth', title: '参考宽度', value: 1920 },
+              { id: 'referenceHeight', title: '参考高度', value: 1080 },
+              { id: 'ratio', title: '比例', value: 'same' },
+            ],
+            references: [
+              {
+                id: 'source',
+                title: '参考视频',
+                label: '奔跑动作.mp4',
+                refType: 'asset',
+                refId: 'asset-video-reference',
+              },
+            ],
+          },
+        }),
+        canvasSize: { width: 960, height: 720 },
+        viewport: { x: 0, y: 0, scale: 1 },
+        mode: 'redraw',
+        availableLayers: [],
+      }),
+    ).toMatchObject({
+      mode: 'character-animation',
+      prompt: '复刻奔跑节奏',
+      sourceLayerId: undefined,
+      characterAnimationRatio: 'same',
+      generationReferences: [
+        {
+          label: '奔跑动作.mp4',
+          src: 'users/user-1/action.mp4',
+          objectKey: 'users/user-1/action.mp4',
+          sourceAssetId: 'asset-video-reference',
+          mediaType: 'video',
+          width: 1920,
+          height: 1080,
+        },
+      ],
+    });
+  });
+
+  it('does not restore a project resource id that is unavailable in the current canvas', () => {
+    const draft = createSameSourceGenerationDialogDraft({
+      sourceLayer: createLayer({
+        id: 'layer-animation-result',
+        sourceType: 'generated',
+        assetKind: 'character-animation',
+        generationInputs: {
+          version: 2,
+          action: 'character-animation.generate',
+          fields: [
+            { id: 'inputMode', title: '输入模式', value: 'image' },
+            { id: 'prompt', title: '动作描述', value: '循环待机' },
+            {
+              id: 'referenceSrc',
+              title: '参考素材',
+              value: 'users/user-1/hero.png',
+            },
+            {
+              id: 'referenceMediaType',
+              title: '参考类型',
+              value: 'image',
+            },
+          ],
+          references: [
+            {
+              id: 'source',
+              title: '角色图片',
+              label: '旧项目角色',
+              refType: 'project-resource',
+              refId: 'resource-from-another-project',
+            },
+          ],
+        },
+      }),
+      canvasSize: { width: 960, height: 720 },
+      viewport: { x: 0, y: 0, scale: 1 },
+      mode: 'redraw',
+      availableLayers: [],
+    });
+
+    expect(draft).toMatchObject({
+      mode: 'character-animation',
+      generationReferences: [
+        {
+          label: '旧项目角色',
+          src: 'users/user-1/hero.png',
+          objectKey: 'users/user-1/hero.png',
+          mediaType: 'image',
+        },
+      ],
+    });
+    expect(draft?.generationReferences?.[0]?.resourceId).toBeUndefined();
+  });
+
   it('inherits and normalizes quick edit model parameters from the source', () => {
     expect(
       createQuickEditPanelDraft(
@@ -1416,13 +1545,12 @@ describe('ImageCanvasGenerationDialogModel', () => {
       assetKind: 'character',
     });
 
-    expect(
-      createCharacterAnimationGenerationDialogDraft({
-        canvasSize,
-        viewport,
-        layer: characterLayer,
-      }),
-    ).toMatchObject({
+    const characterLayerDraft = createCharacterAnimationGenerationDialogDraft({
+      canvasSize,
+      viewport,
+      layer: characterLayer,
+    });
+    expect(characterLayerDraft).toMatchObject({
       mode: 'character-animation',
       sourceLayerId: 'layer-character',
       status: 'idle',
@@ -1432,14 +1560,21 @@ describe('ImageCanvasGenerationDialogModel', () => {
       characterAnimationFrameCount: 32,
       characterAnimationDurationSeconds: 4,
       placeholder: {
-        x: 270,
-        y: 150,
-        width: 420,
-        height: 420,
-        originalWidth: 1024,
-        originalHeight: 1024,
+        x: 240,
+        y: 180,
+        width: 480,
+        height: 360,
+        originalWidth: 480,
+        originalHeight: 360,
       },
     });
+    expect(
+      characterLayerDraft?.characterAnimationBackgroundColor,
+    ).toBeUndefined();
+    expect(
+      createCharacterAnimationGenerationDialogDraft({ canvasSize, viewport })
+        ?.characterAnimationBackgroundColor,
+    ).toBe('green');
     expect(
       createCharacterAnimationGenerationDialogDraft({
         canvasSize,
diff --git a/src/components/image-editor/ImageCanvasGenerationDialogModel.ts b/src/components/image-editor/ImageCanvasGenerationDialogModel.ts
index 9c2bcf69e..25384baa8 100644
--- a/src/components/image-editor/ImageCanvasGenerationDialogModel.ts
+++ b/src/components/image-editor/ImageCanvasGenerationDialogModel.ts
@@ -48,6 +48,7 @@ import {
   isNormalizedCanvasGenerationInputs,
   normalizeEditorImageModel,
   PUBLICATION_FRAME_ORIGINAL_SIZE,
+  resizeGenerationPlaceholderToCharacterAnimationSelection,
   resizeGenerationPlaceholderToImageSelection,
   resizeGenerationPlaceholderToVideoSelection,
   resolveDialogExtraImageReferenceLimit,
@@ -1264,31 +1265,104 @@ function createNormalizedGenerationDialogDraft({
   }
 
   if (inputs.action === 'character-animation.generate') {
-    const animationSource = resolveNormalizedReferences(
+    const canvasReferences = resolveNormalizedReferences(
       sourceLayer,
       'source',
       availableLayers,
-    )
-      .map((reference) =>
-        (availableLayers ?? []).find(
-          (layer) => createCanvasLayerReference(layer).id === reference.id,
-        ),
-      )
-      .find((layer): layer is CanvasLayer => Boolean(layer));
-    if (!animationSource) {
+    );
+    const inputMode = getNormalizedString(sourceLayer, 'inputMode', 'image');
+    const storedReferenceSrc = getNormalizedString(
+      sourceLayer,
+      'referenceSrc',
+    ).trim();
+    const storedReferenceMediaType = getNormalizedString(
+      sourceLayer,
+      'referenceMediaType',
+      inputMode === 'video' ? 'video' : 'image',
+    );
+    const storedReferenceInput = sourceLayer.generationInputs?.references.find(
+      (reference) => reference.id === 'source',
+    );
+    const storedReferenceWidth = getNormalizedNumber(
+      sourceLayer,
+      'referenceWidth',
+      0,
+    );
+    const storedReferenceHeight = getNormalizedNumber(
+      sourceLayer,
+      'referenceHeight',
+      0,
+    );
+    const restoredReference =
+      canvasReferences[0] ??
+      (storedReferenceSrc
+        ? {
+            id: `restored-character-animation-reference:${sourceLayer.id}`,
+            label:
+              storedReferenceInput?.label ??
+              (storedReferenceMediaType === 'video' ? '参考视频' : '角色图片'),
+            src: storedReferenceSrc,
+            objectKey: storedReferenceSrc,
+            ...(storedReferenceInput?.refType === 'asset'
+              ? { sourceAssetId: storedReferenceInput.refId }
+              : {}),
+            ...(storedReferenceWidth > 0
+              ? { width: storedReferenceWidth }
+              : {}),
+            ...(storedReferenceHeight > 0
+              ? { height: storedReferenceHeight }
+              : {}),
+            mediaType:
+              storedReferenceMediaType === 'video'
+                ? ('video' as const)
+                : ('image' as const),
+          }
+        : undefined);
+    const animationSource = restoredReference
+      ? (availableLayers ?? []).find(
+          (layer) =>
+            createCanvasLayerReference(layer).id === restoredReference.id,
+        )
+      : undefined;
+    if (inputMode !== 'text' && !restoredReference) {
       return null;
     }
     const draft = createCharacterAnimationGenerationDialogDraft({
       canvasSize,
       viewport,
-      layer: animationSource,
+      ...(animationSource?.assetKind === 'character'
+        ? { layer: animationSource }
+        : {}),
     });
+    // 帧数/时长必须匹配合法配对（32/4、40/5、48/6），否则 UI 会同时高亮
+    // 冲突的选项而提交被后端拒绝。这里按合法配对校验，损坏数据回退到默认 32/4。
+    const restoredFrameCount = getNormalizedNumber(sourceLayer, 'frameCount', 32);
+    const restoredDurationSeconds = getNormalizedNumber(
+      sourceLayer,
+      'durationSeconds',
+      4,
+    );
+    const durationPairValid = CHARACTER_ANIMATION_DURATION_OPTIONS.some(
+      (option) =>
+        option.frameCount === restoredFrameCount &&
+        option.durationSeconds === restoredDurationSeconds,
+    );
+    const pairedFrameCount = durationPairValid ? restoredFrameCount : 32;
+    const pairedDurationSeconds = durationPairValid
+      ? restoredDurationSeconds
+      : 4;
     return draft
       ? placeDraftBesideSourceLayer(
-          {
+          resizeGenerationPlaceholderToCharacterAnimationSelection({
             ...draft,
             prompt,
-            sourceLayerId: animationSource.id,
+            sourceLayerId: animationSource?.id,
+            generationReferences: restoredReference ? [restoredReference] : [],
+            characterAnimationBackgroundColor: (getNormalizedString(
+              sourceLayer,
+              'backgroundColor',
+            ).trim() ||
+              undefined) as GenerateDialogState['characterAnimationBackgroundColor'],
             characterAnimationResolution: getNormalizedString(
               sourceLayer,
               'resolution',
@@ -1297,19 +1371,11 @@ function createNormalizedGenerationDialogDraft({
             characterAnimationRatio: getNormalizedString(
               sourceLayer,
               'ratio',
-              'same',
+              animationSource ? 'same' : '1:1',
             ) as GenerateDialogState['characterAnimationRatio'],
-            characterAnimationFrameCount: getNormalizedNumber(
-              sourceLayer,
-              'frameCount',
-              32,
-            ) as GenerateDialogState['characterAnimationFrameCount'],
-            characterAnimationDurationSeconds: getNormalizedNumber(
-              sourceLayer,
-              'durationSeconds',
-              4,
-            ) as GenerateDialogState['characterAnimationDurationSeconds'],
-          },
+            characterAnimationFrameCount: pairedFrameCount as GenerateDialogState['characterAnimationFrameCount'],
+            characterAnimationDurationSeconds: pairedDurationSeconds as GenerateDialogState['characterAnimationDurationSeconds'],
+          }),
           sourceLayer,
         )
       : null;
@@ -2019,6 +2085,7 @@ export function createCharacterAnimationPanelDraft(
   }
   return {
     sourceLayerId: layer.id,
+    references: [createCanvasLayerReference(layer)],
     promptText: '',
     resolution: '480p',
     ratio: 'same',
@@ -2035,20 +2102,22 @@ export function createCharacterAnimationGenerationDialogDraft({
 }: {
   canvasSize: CanvasSize;
   viewport: CanvasViewport;
-  layer: CanvasLayer;
+  layer?: CanvasLayer;
 }): Omit<CanvasGenerationDialogState, 'id'> | null {
-  if (layer.assetKind !== 'character') {
+  if (layer && layer.assetKind !== 'character') {
     return null;
   }
   const worldCenter = getViewportWorldCenter({ canvasSize, viewport });
-  return {
+  const draft: Omit<CanvasGenerationDialogState, 'id'> = {
     mode: 'character-animation',
-    sourceLayerId: layer.id,
+    ...(layer ? { sourceLayerId: layer.id } : {}),
+    generationReferences: layer ? [createCanvasLayerReference(layer)] : [],
     prompt: '',
     status: 'idle',
     composerOpen: true,
     characterAnimationResolution: '480p',
-    characterAnimationRatio: 'same',
+    characterAnimationRatio: layer ? 'same' : '1:1',
+    ...(layer ? {} : { characterAnimationBackgroundColor: 'green' as const }),
     characterAnimationFrameCount: 32,
     characterAnimationDurationSeconds: 4,
     placeholder: {
@@ -2060,6 +2129,7 @@ export function createCharacterAnimationGenerationDialogDraft({
       originalHeight: CHARACTER_ANIMATION_FRAME_ORIGINAL_SIZE.height,
     },
   };
+  return resizeGenerationPlaceholderToCharacterAnimationSelection(draft);
 }
 
 export function assignCharacterSpecReference(
@@ -2111,6 +2181,23 @@ export function appendGenerationReference(
   if (dialog?.mode === 'video' && !isSeedanceVideoModel(dialog.videoModel)) {
     return dialog;
   }
+  if (dialog?.mode === 'character-animation') {
+    const mediaType = getReferenceMediaType(layer);
+    if (
+      mediaType === 'audio' ||
+      (mediaType === 'image' &&
+        layer.assetKind !== 'character' &&
+        layer.assetKind !== 'character-animation')
+    ) {
+      return dialog;
+    }
+    return resizeGenerationPlaceholderToCharacterAnimationSelection({
+      ...resetFailedGenerationDialog(dialog),
+      sourceLayerId: layer.id,
+      generationReferences: [createCanvasLayerReference(layer)],
+      composerOpen: true,
+    });
+  }
   if (
     dialog?.mode === 'generate' ||
     dialog?.mode === 'scene' ||
diff --git a/src/components/image-editor/ImageCanvasGenerationModel.test.ts b/src/components/image-editor/ImageCanvasGenerationModel.test.ts
index c61121c36..a7e77c300 100644
--- a/src/components/image-editor/ImageCanvasGenerationModel.test.ts
+++ b/src/components/image-editor/ImageCanvasGenerationModel.test.ts
@@ -8,6 +8,7 @@ import type {
 import {
   applyEditorGenerationPricingConfig,
   BACKGROUND_MUSIC_MODEL_SUNO,
+  buildCharacterAnimationGenerationInputs,
   buildCharacterGenerationInputs,
   buildEditGenerationInputs,
   buildIconGenerationInputs,
@@ -52,6 +53,7 @@ import {
   isNormalizedCanvasGenerationInputs,
   isQuickEditUnsupportedAssetKind,
   resolveCharacterAnimationSourceImageSrc,
+  resolveEditorCharacterAnimationFramePixelSize,
   resolveEditorImageGenerationPixelSize,
   resolveImageGenerationErrorMessage,
   VIDEO_MODEL_KLING_3,
@@ -62,6 +64,59 @@ import {
 } from './ImageCanvasGenerationModel';
 
 describe('ImageCanvasGenerationModel', () => {
+  it('resolves character animation pixel and display sizes from ratio and resolution', () => {
+    expect(
+      resolveEditorCharacterAnimationFramePixelSize({
+        ratio: '16:9',
+        resolution: '480p',
+      }),
+    ).toEqual({ width: 480, height: 270 });
+    expect(
+      resolveEditorCharacterAnimationFramePixelSize({
+        ratio: '16:9',
+        resolution: '720p',
+      }),
+    ).toEqual({ width: 720, height: 405 });
+    const sameRatioSize = resolveEditorCharacterAnimationFramePixelSize({
+      ratio: 'same',
+      resolution: '720p',
+      referenceWidth: 768,
+      referenceHeight: 1024,
+    });
+    expect(sameRatioSize).toEqual({ width: 540, height: 720 });
+  });
+
+  it('persists character animation reference dimensions for same-ratio redraws', () => {
+    const inputs = buildCharacterAnimationGenerationInputs(
+      '原地待机',
+      null,
+      {
+        id: 'uploaded-character',
+        label: '竖版角色.png',
+        src: '/uploads/character.png',
+        mediaType: 'image',
+        width: 768,
+        height: 1024,
+      },
+      {
+        referenceSrc: 'users/user-1/character.png',
+        referenceMediaType: 'image',
+        ratio: 'same',
+      },
+    );
+
+    expect(inputs.fields).toEqual(
+      expect.arrayContaining([
+        { id: 'referenceWidth', title: '参考宽度', value: 768 },
+        { id: 'referenceHeight', title: '参考高度', value: 1024 },
+        { id: 'ratio', title: '比例', value: 'same' },
+      ]),
+    );
+    expect(
+      inputs.fields.find((field) => field.id === 'backgroundColor'),
+    ).toBeUndefined();
+  });
+
   afterEach(() => {
     applyEditorGenerationPricingConfig({
       models: EDITOR_MODEL_MUD_POINT_CONFIG,
diff --git a/src/components/image-editor/ImageCanvasGenerationModel.ts b/src/components/image-editor/ImageCanvasGenerationModel.ts
index a6111181f..6480ede9a 100644
--- a/src/components/image-editor/ImageCanvasGenerationModel.ts
+++ b/src/components/image-editor/ImageCanvasGenerationModel.ts
@@ -60,12 +60,12 @@ export const SPEC_FRAME_DISPLAY_SIZE = { width: 560, height: 315 };
 export const CHARACTER_FRAME_ORIGINAL_SIZE = { width: 2048, height: 2048 };
 export const CHARACTER_FRAME_DISPLAY_SIZE = { width: 420, height: 420 };
 export const CHARACTER_ANIMATION_FRAME_ORIGINAL_SIZE = {
-  width: 1024,
-  height: 1024,
+  width: 480,
+  height: 480,
 };
 export const CHARACTER_ANIMATION_FRAME_DISPLAY_SIZE = {
-  width: 420,
-  height: 420,
+  width: 480,
+  height: 480,
 };
 export const ICON_FRAME_ORIGINAL_SIZE = { width: 512, height: 512 };
 export const ICON_FRAME_DISPLAY_SIZE = { width: 360, height: 360 };
@@ -323,6 +323,80 @@ export function resizeGenerationPlaceholderToVideoSelection(
     },
   };
 }
+
+export function resolveEditorCharacterAnimationFramePixelSize({
+  ratio,
+  resolution,
+  referenceWidth,
+  referenceHeight,
+}: {
+  ratio: EditorCharacterAnimationRatio | null | undefined;
+  resolution: EditorCharacterAnimationResolution | null | undefined;
+  referenceWidth?: number | null;
+  referenceHeight?: number | null;
+}): EditorImageFrameSize {
+  const hasReferenceSize =
+    typeof referenceWidth === 'number' &&
+    Number.isFinite(referenceWidth) &&
+    referenceWidth > 0 &&
+    typeof referenceHeight === 'number' &&
+    Number.isFinite(referenceHeight) &&
+    referenceHeight > 0;
+  const resolvedRatio =
+    ratio === 'same' && hasReferenceSize
+      ? `${referenceWidth}:${referenceHeight}`
+      : ratio === 'same'
+        ? '1:1'
+        : ratio;
+  const ratioNumbers = resolveAspectRatioNumbers(resolvedRatio ?? '1:1');
+  const longEdge = resolution === '720p' ? 720 : 480;
+  if (ratioNumbers.width >= ratioNumbers.height) {
+    return {
+      width: longEdge,
+      height: Math.max(
+        1,
+        Math.round((longEdge * ratioNumbers.height) / ratioNumbers.width),
+      ),
+    };
+  }
+  return {
+    width: Math.max(
+      1,
+      Math.round((longEdge * ratioNumbers.width) / ratioNumbers.height),
+    ),
+    height: longEdge,
+  };
+}
+
+export function resizeGenerationPlaceholderToCharacterAnimationSelection<
+  T extends GenerateDialogState,
+>(dialog: T): T {
+  if (dialog.mode !== 'character-animation' || !dialog.placeholder) {
+    return dialog;
+  }
+  const reference = dialog.generationReferences?.[0];
+  const pixelSize = resolveEditorCharacterAnimationFramePixelSize({
+    ratio: dialog.characterAnimationRatio,
+    resolution: dialog.characterAnimationResolution,
+    referenceWidth: reference?.width,
+    referenceHeight: reference?.height,
+  });
+  const centerX = dialog.placeholder.x + dialog.placeholder.width / 2;
+  const centerY = dialog.placeholder.y + dialog.placeholder.height / 2;
+  return {
+    ...dialog,
+    placeholder: {
+      ...dialog.placeholder,
+      x: centerX - pixelSize.width / 2,
+      y: centerY - pixelSize.height / 2,
+      width: pixelSize.width,
+      height: pixelSize.height,
+      originalWidth: pixelSize.width,
+      originalHeight: pixelSize.height,
+    },
+  } as T;
+}
+
 export const VIDEO_MODEL_SEEDANCE_2 = 'seedance2.0';
 export const VIDEO_MODEL_SEEDANCE_2_FAST = 'seedance2.0-fast';
 export const VIDEO_MODEL_KLING_3 = 'kling3.0';
@@ -512,14 +586,47 @@ export function countDialogExtraImageReferences(dialog: GenerateDialogState) {
 }
 
 export const CHARACTER_ANIMATION_ACTION_PROMPTS = [
-  { label: '待机', text: '待机动作，轻微呼吸起伏。' },
   { label: '行走', text: '循环行走动作，步伐稳定。' },
+  { label: '待机', text: '待机动作，轻微呼吸起伏。' },
   { label: '奔跑', text: '循环奔跑动作，动作清晰有力。' },
   { label: '跳跃', text: '起跳、滞空、落地动作。' },
   { label: '攻击', text: '攻击动作，前摇、出手、收招清晰。' },
   { label: '受击', text: '受击后短暂后仰并恢复站姿。' },
   { label: '倒下', text: '倒下动作，重心下落自然。' },
 ] as const;
+export const CHARACTER_ANIMATION_MORE_ACTION_PROMPTS = [
+  '冲刺',
+  '飞行',
+  '悬浮',
+  '爬行',
+  '劈砍',
+  '突刺',
+  '砸击',
+  '拳击',
+  '踢击',
+  '射击',
+  '施法',
+  '格挡',
+  '闪避',
+  '招架',
+  '举盾',
+  '蹲下',
+  '呼吸',
+  '眨眼',
+  '环顾',
+  '伸展',
+  '速度线',
+  '运动模糊',
+  '命中帧',
+  '冲击波',
+  '粒子爆发',
+] as const;
+export const CHARACTER_ANIMATION_BACKGROUND_OPTIONS = [
+  { label: '白色', value: 'white', hex: '#FFFFFF' },
+  { label: '绿色', value: 'green', hex: '#00FF00' },
+  { label: '蓝色', value: 'blue', hex: '#0000FF' },
+  { label: '紫色', value: 'purple', hex: '#8000FF' },
+] as const;
 export const CHARACTER_ANIMATION_RATIO_OPTIONS: Array<{
   label: string;
   value: EditorCharacterAnimationRatio;
@@ -536,6 +643,10 @@ export const CHARACTER_ANIMATION_DURATION_OPTIONS = [
   { label: '40帧·5秒', frameCount: 40, durationSeconds: 5 },
   { label: '48帧·6秒', frameCount: 48, durationSeconds: 6 },
 ] as const;
+// 序列帧清晰度唯一来源。模型 seedance2.0-fast 不支持 1080p（与视频编辑器对该
+// 模型的 1080p 禁用一致），因此这里只有 480p/720p。新增档位需同时改
+// resolveEditorCharacterAnimationFramePixelSize 的 longEdge 与后端 normalize 校验。
+export const CHARACTER_ANIMATION_RESOLUTION_OPTIONS = ['480p', '720p'] as const;
 export const VIDEO_FRAME_ORIGINAL_SIZE = { width: 854, height: 480 };
 export const VIDEO_FRAME_DISPLAY_SIZE = { width: 854, height: 480 };
 export const AUDIO_FRAME_ORIGINAL_SIZE = { width: 420, height: 120 };
@@ -710,7 +821,9 @@ export function buildQuickEditModelOptions(currentModel: string) {
 }
 
 export function isQuickEditUnsupportedAssetKind(layer: CanvasLayer) {
-  return layer.assetKind === 'icon';
+  return (
+    layer.assetKind === 'icon' || layer.assetKind === 'character-animation'
+  );
 }
 
 export function buildCharacterSpecPrompt(values: SpecFormValues) {
@@ -750,7 +863,7 @@ export function getLayerKindLabel(layer: CanvasLayer) {
     return '角色';
   }
   if (layer.assetKind === 'character-animation') {
-    return '动作';
+    return 'Spine序列帧动画';
   }
   if (layer.assetKind === 'icon') {
     return '图标';
@@ -790,19 +903,78 @@ export function getLayerKindLabel(layer: CanvasLayer) {
 
 export function buildCharacterAnimationGenerationInputs(
   promptText: string,
-  sourceLayer: CanvasLayer,
+  sourceLayer: CanvasLayer | null,
+  reference: CharacterReferenceImage | null,
   options: {
     resolution?: string;
     ratio?: string;
     frameCount?: number;
     durationSeconds?: number;
+    backgroundColor?: string;
+    referenceSrc?: string;
+    referenceMediaType?: 'image' | 'video';
   } = {},
 ): CanvasGenerationInputs {
+  const inputMode =
+    reference?.mediaType === 'video'
+      ? 'video'
+      : reference || sourceLayer
+        ? 'image'
+        : 'text';
+  const referenceWidth =
+    typeof reference?.width === 'number' &&
+    Number.isFinite(reference.width) &&
+    reference.width > 0
+      ? Math.round(reference.width)
+      : sourceLayer?.originalWidth;
+  const referenceHeight =
+    typeof reference?.height === 'number' &&
+    Number.isFinite(reference.height) &&
+    reference.height > 0
+      ? Math.round(reference.height)
+      : sourceLayer?.originalHeight;
   return {
     version: 2,
     action: 'character-animation.generate',
     fields: [
+      ...createGenerationInputField('输入模式', inputMode, 'inputMode'),
+      ...(options.referenceSrc
+        ? createGenerationInputField(
+            '参考素材',
+            options.referenceSrc,
+            'referenceSrc',
+          )
+        : []),
+      ...(options.referenceSrc
+        ? createGenerationInputField(
+            '参考类型',
+            options.referenceMediaType ??
+              (inputMode === 'video' ? 'video' : 'image'),
+            'referenceMediaType',
+          )
+        : []),
+      ...(options.referenceSrc && referenceWidth
+        ? createGenerationInputField(
+            '参考宽度',
+            referenceWidth,
+            'referenceWidth',
+          )
+        : []),
+      ...(options.referenceSrc && referenceHeight
+        ? createGenerationInputField(
+            '参考高度',
+            referenceHeight,
+            'referenceHeight',
+          )
+        : []),
       ...createGenerationInputField('动作描述', promptText, 'prompt'),
+      ...(options.backgroundColor
+        ? createGenerationInputField(
+            '背景颜色',
+            options.backgroundColor,
+            'backgroundColor',
+          )
+        : []),
       ...createGenerationInputField(
         '清晰度',
         options.resolution ?? '480p',
@@ -820,12 +992,43 @@ export function buildCharacterAnimationGenerationInputs(
         'durationSeconds',
       ),
     ],
-    references: createLayerGenerationInputReference('角色图片', sourceLayer, {
-      id: 'source',
-    }),
+    references: sourceLayer
+      ? createLayerGenerationInputReference(
+          reference?.mediaType === 'video' ? '参考视频' : '角色图片',
+          sourceLayer,
+          { id: 'source' },
+        )
+      : reference
+        ? createGenerationInputReference(
+            reference.mediaType === 'video' ? '参考视频' : '角色图片',
+            reference,
+            { id: 'source' },
+          )
+        : [],
   };
 }
 
+export function canSplitCharacterAnimationFrames(layer: CanvasLayer) {
+  const resourceId = resolveRegisteredProjectResourceId(layer.resourceId);
+  return (
+    layer.assetKind === 'character-animation' &&
+    resourceId !== undefined &&
+    (layer.resourcePersistenceState === undefined ||
+      layer.resourcePersistenceState === 'registered')
+  );
+}
+
+export function resolveRegisteredProjectResourceId(
+  value: string | null | undefined,
+) {
+  const resourceId = value?.trim();
+  return resourceId &&
+    !resourceId.startsWith('local-') &&
+    !resourceId.startsWith('generation-dialog:')
+    ? resourceId
+    : undefined;
+}
+
 export function formatLayerImageType(layer: CanvasLayer) {
   if (layer.assetKind === 'spec') {
     return '规范图片';
@@ -834,7 +1037,7 @@ export function formatLayerImageType(layer: CanvasLayer) {
     return '角色图片';
   }
   if (layer.assetKind === 'character-animation') {
-    return '角色动作序列帧';
+    return 'Spine序列帧动画';
   }
   if (layer.assetKind === 'icon') {
     return '图标素材图片';
@@ -1075,6 +1278,8 @@ export function createCanvasLayerReference(
     assetObjectId: layer.assetObjectId ?? undefined,
     resourceId: layer.resourceId,
     sourceAssetId: layer.sourceAssetId ?? undefined,
+    width: layer.originalWidth,
+    height: layer.originalHeight,
   };
 }
 
@@ -1088,12 +1293,8 @@ export function createGenerationInputReference(
     id?: string;
   } = {},
 ): CanvasGenerationInputReference[] {
-  const resourceId = reference.resourceId?.trim();
-  if (
-    resourceId &&
-    !resourceId.startsWith('local-') &&
-    !resourceId.startsWith('generation-dialog:')
-  ) {
+  const resourceId = resolveRegisteredProjectResourceId(reference.resourceId);
+  if (resourceId) {
     return [
       {
         ...(options.id ? { id: options.id } : {}),
@@ -1533,7 +1734,30 @@ export function decodeCanvasGenerationInputs(
   } else if (action === 'audio.background-music.generate') {
     normalizeStringField('prompt', 'gpt_description_prompt');
   } else if (action === 'character-animation.generate') {
+    const inputMode = normalizeStringOption(
+      'inputMode',
+      '输入模式',
+      ['text', 'image', 'video'],
+      'image',
+    );
     normalizeStringField('prompt', '动作描述');
+    const referenceSrc = normalizeStringField('referenceSrc', '参考素材');
+    if (referenceSrc || inputMode !== 'text') {
+      normalizeStringOption(
+        'referenceMediaType',
+        '参考类型',
+        ['image', 'video'],
+        inputMode === 'video' ? 'video' : 'image',
+      );
+    }
+    if (findFieldIndex('backgroundColor') >= 0) {
+      normalizeStringOption(
+        'backgroundColor',
+        '背景颜色',
+        CHARACTER_ANIMATION_BACKGROUND_OPTIONS.map((option) => option.value),
+        'green',
+      );
+    }
     normalizeStringOption('resolution', '清晰度', ['480p', '720p'], '480p');
     normalizeStringOption(
       'ratio',
diff --git a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts
index 92146e35f..8e9c9e244 100644
--- a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts
+++ b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts
@@ -1091,12 +1091,14 @@ describe('ImageCanvasGenerationSubmissionModel', () => {
       promptText: '循环奔跑动作',
       resultTitle: '勇者奔跑',
       input: {
+        inputMode: 'image',
         sourceLayerId: 'character-layer',
         sourceImageSrc: 'generated/character.png',
         sourceWidth: 960,
         sourceHeight: 1280,
+        referenceMediaType: 'image',
+        referenceSrc: 'generated/character.png',
         promptText: '循环奔跑动作',
-        screenColor: 'auto',
         resolution: '720p',
         ratio: 'same',
         frameCount: 48,
@@ -1107,6 +1109,96 @@ describe('ImageCanvasGenerationSubmissionModel', () => {
     });
   });
 
+  it('keeps uploaded reference dimensions for same-ratio animation requests', () => {
+    const plan = buildCharacterAnimationSubmissionPlan({
+      panel: {
+        promptText: '保持角色比例待机',
+        backgroundColor: 'blue',
+        resolution: '480p',
+        ratio: 'same',
+        frameCount: 32,
+        durationSeconds: 4,
+        status: 'idle',
+      },
+      sourceLayer: null,
+      reference: {
+        id: 'uploaded-character',
+        label: '竖版角色.png',
+        src: '/uploads/character.png',
+        objectKey: 'users/user-1/character.png',
+        mediaType: 'image',
+        width: 768,
+        height: 1024,
+      },
+    });
+
+    expect(plan.input).toMatchObject({
+      inputMode: 'image',
+      sourceWidth: 768,
+      sourceHeight: 1024,
+      ratio: 'same',
+      backgroundColor: 'blue',
+    });
+  });
+
+  it('builds text and video character animation plans', () => {
+    expect(
+      buildCharacterAnimationSubmissionPlan({
+        panel: {
+          promptText: '原地挥手',
+          backgroundColor: 'purple',
+          resolution: '480p',
+          ratio: '1:1',
+          frameCount: 32,
+          durationSeconds: 4,
+          status: 'idle',
+        },
+        sourceLayer: null,
+      }),
+    ).toMatchObject({
+      input: {
+        inputMode: 'text',
+        promptText: '原地挥手',
+        backgroundColor: 'purple',
+      },
+    });
+
+    expect(
+      buildCharacterAnimationSubmissionPlan({
+        panel: {
+          references: [],
+          promptText: '参考视频中的奔跑节奏',
+          backgroundColor: 'green',
+          resolution: '720p',
+          ratio: '16:9',
+          frameCount: 40,
+          durationSeconds: 5,
+          status: 'idle',
+        },
+        sourceLayer: null,
+        reference: {
+          id: 'video-reference',
+          label: '动作参考.mp4',
+          src: '/uploads/action.mp4',
+          objectKey: 'users/user-1/action.mp4',
+          mediaType: 'video',
+          width: 1920,
+          height: 1080,
+        },
+      }),
+    ).toMatchObject({
+      input: {
+        inputMode: 'video',
+        referenceMediaType: 'video',
+        referenceSrc: 'users/user-1/action.mp4',
+        sourceWidth: 1920,
+        sourceHeight: 1080,
+        promptText: '参考视频中的奔跑节奏',
+        backgroundColor: 'green',
+      },
+    });
+  });
+
   it('builds seedance video plans with multimodal references', () => {
     const plan = buildImageGenerationSubmissionPlan({
       dialog: {
diff --git a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts
index 82b84b6b8..049baa77f 100644
--- a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts
+++ b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts
@@ -20,6 +20,7 @@ import type {
   CanvasGenerationInputs,
   CanvasLayer,
   CharacterAnimationPanelState,
+  CharacterReferenceImage,
   GenerateDialogState,
 } from './ImageCanvasEditorTypes';
 import {
@@ -1146,23 +1147,65 @@ export function buildIconSpritesheetGenerationSubmissionPlan(
 export function buildCharacterAnimationSubmissionPlan({
   panel,
   sourceLayer,
+  reference = null,
 }: {
   panel: CharacterAnimationPanelState;
-  sourceLayer: CanvasLayer;
+  sourceLayer: CanvasLayer | null;
+  reference?: CharacterReferenceImage | null;
 }): CharacterAnimationSubmissionPlan {
   const promptText = panel.promptText.trim();
   const resultTitle = resolveGenerationAssetLabel(panel.assetLabel, '角色动作');
+  if (!promptText) {
+    throw new Error('动画描述不能为空。');
+  }
+  const inputMode =
+    reference?.mediaType === 'video'
+      ? ('video' as const)
+      : reference || sourceLayer
+        ? ('image' as const)
+        : ('text' as const);
+  const referenceSrc = reference
+    ? reference.objectKey?.trim() || reference.src
+    : sourceLayer
+      ? resolveCharacterAnimationSourceImageSrc(sourceLayer)
+      : undefined;
+  const referenceWidth =
+    typeof reference?.width === 'number' &&
+    Number.isFinite(reference.width) &&
+    reference.width > 0
+      ? Math.round(reference.width)
+      : sourceLayer?.originalWidth;
+  const referenceHeight =
+    typeof reference?.height === 'number' &&
+    Number.isFinite(reference.height) &&
+    reference.height > 0
+      ? Math.round(reference.height)
+      : sourceLayer?.originalHeight;
   return {
     promptText,
     resultTitle,
     input: {
-      sourceLayerId: sourceLayer.id,
-      sourceImageSrc: resolveCharacterAnimationSourceImageSrc(sourceLayer),
-      sourceWidth: sourceLayer.originalWidth,
-      sourceHeight: sourceLayer.originalHeight,
+      inputMode,
+      ...(sourceLayer ? { sourceLayerId: sourceLayer.id } : {}),
+      ...(inputMode === 'image' && referenceSrc
+        ? { sourceImageSrc: referenceSrc }
+        : {}),
+      ...(referenceWidth && referenceHeight
+        ? {
+            sourceWidth: referenceWidth,
+            sourceHeight: referenceHeight,
+          }
+        : {}),
+      ...(referenceSrc
+        ? {
+            referenceMediaType: inputMode === 'video' ? 'video' : 'image',
+            referenceSrc,
+          }
+        : {}),
       promptText,
-      // 与生图入口一致：默认 auto，由后端做背景色自动决策。
-      screenColor: DEFAULT_EDITOR_GENERATION_BACKGROUND_COLOR,
+      ...(panel.backgroundColor
+        ? { backgroundColor: panel.backgroundColor }
+        : {}),
       resolution: panel.resolution,
       ratio: panel.ratio,
       frameCount: panel.frameCount,
diff --git a/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.test.tsx b/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.test.tsx
index 3172f3999..35f08ecec 100644
--- a/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.test.tsx
+++ b/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.test.tsx
@@ -53,8 +53,10 @@ function renderSelectedToolbar(
     isPerfectPixelProcessing: false,
     isPerfectPixelPendingConfirmation: false,
     isSplittingIconSpritesheet: false,
+    isSplittingCharacterAnimation: false,
     isPersistingAssetKind: false,
     onSplitIconSpritesheet: vi.fn(),
+    onSplitCharacterAnimation: vi.fn(),
     onExtractUiDesignAssets: vi.fn(),
     onOpenCharacterAnimationPanel: vi.fn(),
     onDownloadLayer: vi.fn(),
@@ -344,7 +346,7 @@ describe('ImageCanvasSelectedLayerToolbarView', () => {
   });
 
   it('hides redraw for non-generative derived and public display-only layers', () => {
-    renderSelectedToolbar({
+    const props = renderSelectedToolbar({
       selectedLayer: createLayer({
         title: '手动裁扩结果',
         generationInputs: null,
@@ -447,7 +449,7 @@ describe('ImageCanvasSelectedLayerToolbarView', () => {
     ).toEqual(['快速编辑', '改造', '下载按钮']);
 
     cleanup();
-    renderSelectedToolbar({
+    const props = renderSelectedToolbar({
       selectedLayer: createLayer({
         title: '角色动作',
         src: '/generated/action/frame-01.png',
@@ -476,7 +478,28 @@ describe('ImageCanvasSelectedLayerToolbarView', () => {
       within(actionToolbar)
         .getAllByRole('button')
         .map((button) => button.getAttribute('aria-label')),
-    ).toEqual(['快速编辑', '改造', '下载按钮']);
+    ).toEqual(['拆帧', '改造', '下载按钮']);
+    fireEvent.click(within(actionToolbar).getByRole('button', { name: '拆帧' }));
+    expect(props.onSplitCharacterAnimation).toHaveBeenCalledWith(
+      expect.objectContaining({ assetKind: 'character-animation' }),
+    );
+  });
+
+  it('disables frame splitting while a character animation resource is pending registration', () => {
+    const props = renderSelectedToolbar({
+      selectedLayer: createLayer({
+        resourceId: 'resource-character-animation-pending',
+        resourcePersistenceState: 'pending',
+        mediaType: 'image-sequence',
+        assetKind: 'character-animation',
+      }),
+    });
+
+    const splitButton = screen.getByRole('button', { name: '资源保存中' });
+    expect((splitButton as HTMLButtonElement).disabled).toBe(true);
+    expect(splitButton.getAttribute('aria-busy')).toBe('true');
+    fireEvent.click(splitButton);
+    expect(props.onSplitCharacterAnimation).not.toHaveBeenCalled();
   });
 
   it('keeps redraw visible for supported actions with a missing non-replaceable source', () => {
@@ -594,8 +617,10 @@ describe('ImageCanvasSelectedLayerToolbarView', () => {
         isPerfectPixelProcessing={false}
         isPerfectPixelPendingConfirmation={false}
         isSplittingIconSpritesheet={false}
+        isSplittingCharacterAnimation={false}
         isPersistingAssetKind={false}
         onSplitIconSpritesheet={vi.fn()}
+        onSplitCharacterAnimation={vi.fn()}
         onExtractUiDesignAssets={vi.fn()}
         onOpenCharacterAnimationPanel={vi.fn()}
         onDownloadLayer={vi.fn()}
@@ -616,8 +641,10 @@ describe('ImageCanvasSelectedLayerToolbarView', () => {
         isPerfectPixelProcessing={false}
         isPerfectPixelPendingConfirmation={false}
         isSplittingIconSpritesheet={false}
+        isSplittingCharacterAnimation={false}
         isPersistingAssetKind={false}
         onSplitIconSpritesheet={vi.fn()}
+        onSplitCharacterAnimation={vi.fn()}
         onExtractUiDesignAssets={vi.fn()}
         onOpenCharacterAnimationPanel={vi.fn()}
         onDownloadLayer={vi.fn()}
diff --git a/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.tsx b/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.tsx
index 328a96ba3..63bde75c4 100644
--- a/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.tsx
+++ b/src/components/image-editor/ImageCanvasSelectedLayerToolbarView.tsx
@@ -16,6 +16,7 @@ import { EditorIconButton } from './ImageCanvasEditorPrimitives';
 import type { CanvasLayer } from './ImageCanvasEditorTypes';
 import {
   canOpenRedrawPanel,
+  canSplitCharacterAnimationFrames,
   isQuickEditUnsupportedAssetKind,
 } from './ImageCanvasGenerationModel';
 
@@ -30,8 +31,10 @@ type ImageCanvasSelectedLayerToolbarViewProps = {
   isPerfectPixelProcessing: boolean;
   isPerfectPixelPendingConfirmation: boolean;
   isSplittingIconSpritesheet: boolean;
+  isSplittingCharacterAnimation: boolean;
   isPersistingAssetKind: boolean;
   onSplitIconSpritesheet: (layer: CanvasLayer) => void;
+  onSplitCharacterAnimation: (layer: CanvasLayer) => void;
   onExtractUiDesignAssets: (layer: CanvasLayer) => void;
   onOpenCharacterAnimationPanel: (layer: CanvasLayer) => void;
   onDownloadLayer: (layer: CanvasLayer) => void;
@@ -48,8 +51,10 @@ export function ImageCanvasSelectedLayerToolbarView({
   isPerfectPixelProcessing,
   isPerfectPixelPendingConfirmation,
   isSplittingIconSpritesheet,
+  isSplittingCharacterAnimation,
   isPersistingAssetKind,
   onSplitIconSpritesheet,
+  onSplitCharacterAnimation,
   onExtractUiDesignAssets,
   onOpenCharacterAnimationPanel,
   onDownloadLayer,
@@ -58,6 +63,14 @@ export function ImageCanvasSelectedLayerToolbarView({
     return null;
   }
   const canRedraw = canOpenRedrawPanel(selectedLayer);
+  const isCharacterAnimationResourcePending =
+    selectedLayer.assetKind === 'character-animation' &&
+    !canSplitCharacterAnimationFrames(selectedLayer);
+  const characterAnimationSplitLabel = isCharacterAnimationResourcePending
+    ? '资源保存中'
+    : isSplittingCharacterAnimation
+      ? '拆帧中'
+      : '拆帧';
 
   if (selectedLayer.mediaType === 'audio') {
     return (
@@ -234,6 +247,30 @@ export function ImageCanvasSelectedLayerToolbarView({
           <span>提取素材</span>
         </PlatformIconButton>
       ) : null}
+      {selectedLayer.assetKind === 'character-animation' ? (
+        <PlatformIconButton
+          className="image-canvas-editor__floating-toolbar-text-button"
+          label={characterAnimationSplitLabel}
+          title={characterAnimationSplitLabel}
+          icon={
+            isCharacterAnimationResourcePending ||
+            isSplittingCharacterAnimation ? (
+              <Loader2 className="h-4 w-4 animate-spin" />
+            ) : (
+              <Scissors className="h-4 w-4" />
+            )
+          }
+          disabled={
+            isCharacterAnimationResourcePending || isSplittingCharacterAnimation
+          }
+          aria-busy={
+            isCharacterAnimationResourcePending || isSplittingCharacterAnimation
+          }
+          onClick={() => onSplitCharacterAnimation(selectedLayer)}
+        >
+          <span>{characterAnimationSplitLabel}</span>
+        </PlatformIconButton>
+      ) : null}
       {selectedLayer.assetKind === 'character' ? (
         <PlatformIconButton
           className="image-canvas-editor__floating-toolbar-text-button"
diff --git a/src/components/image-editor/ImageCanvasSequenceAnimationIcon.tsx b/src/components/image-editor/ImageCanvasSequenceAnimationIcon.tsx
new file mode 100644
index 000000000..4d74748e6
--- /dev/null
+++ b/src/components/image-editor/ImageCanvasSequenceAnimationIcon.tsx
@@ -0,0 +1,34 @@
+type ImageCanvasSequenceAnimationIconProps = {
+  className?: string;
+};
+
+export function ImageCanvasSequenceAnimationIcon({
+  className,
+}: ImageCanvasSequenceAnimationIconProps) {
+  return (
+    <svg
+      aria-hidden="true"
+      className={[
+        className,
+        'image-canvas-editor__sequence-animation-icon',
+      ]
+        .filter(Boolean)
+        .join(' ')}
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      strokeWidth="1.65"
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <rect x="2.75" y="3.25" width="18.5" height="17.5" rx="2.5" />
+      <path d="M2.75 15.25H21.25" />
+      <path d="M7.25 15.25V20.75M12 15.25V20.75M16.75 15.25V20.75" />
+      <path
+        className="image-canvas-editor__sequence-animation-icon-play"
+        d="M9.25 7.15L15 10.15L9.25 13.15V7.15Z"
+      />
+    </svg>
+  );
+}
diff --git a/src/components/image-editor/ImageCanvasStageView.tsx b/src/components/image-editor/ImageCanvasStageView.tsx
index 544845781..033a77339 100644
--- a/src/components/image-editor/ImageCanvasStageView.tsx
+++ b/src/components/image-editor/ImageCanvasStageView.tsx
@@ -80,6 +80,7 @@ export type ImageCanvasStageViewProps = {
   generationComposerStyle: CSSProperties | null;
   selectedToolbarStyle: CSSProperties | null;
   splittingIconSpritesheetLayerIds?: ReadonlySet<string>;
+  splittingCharacterAnimationLayerIds?: ReadonlySet<string>;
   perfectPixelLayerIds?: ReadonlySet<string>;
   pendingPerfectPixelLayerIds?: ReadonlySet<string>;
   persistingAssetKindLayerIds?: ReadonlySet<string>;
@@ -155,6 +156,7 @@ export type ImageCanvasStageViewProps = {
   onRemoveBackground: (layer: CanvasLayer) => void;
   onPerfectPixel: (layer: CanvasLayer) => void;
   onSplitIconSpritesheet: (layer: CanvasLayer) => void;
+  onSplitCharacterAnimation: (layer: CanvasLayer) => void;
   onExtractUiDesignAssets: (layer: CanvasLayer) => void;
   onUiAssetExtractionToolChange: (tool: UiAssetExtractionTool | null) => void;
   onUiAssetExtractionModelChange: (model: string) => void;
@@ -242,6 +244,7 @@ export function ImageCanvasStageView({
   generationComposerStyle,
   selectedToolbarStyle,
   splittingIconSpritesheetLayerIds = EMPTY_LAYER_ID_SET,
+  splittingCharacterAnimationLayerIds = EMPTY_LAYER_ID_SET,
   perfectPixelLayerIds = EMPTY_LAYER_ID_SET,
   pendingPerfectPixelLayerIds = EMPTY_LAYER_ID_SET,
   persistingAssetKindLayerIds = EMPTY_LAYER_ID_SET,
@@ -296,6 +299,7 @@ export function ImageCanvasStageView({
   onRemoveBackground,
   onPerfectPixel,
   onSplitIconSpritesheet,
+  onSplitCharacterAnimation,
   onExtractUiDesignAssets,
   onUiAssetExtractionToolChange,
   onUiAssetExtractionModelChange,
@@ -416,6 +420,10 @@ export function ImageCanvasStageView({
           selectedLayer &&
             splittingIconSpritesheetLayerIds.has(selectedLayer.id),
         )}
+        isSplittingCharacterAnimation={Boolean(
+          selectedLayer &&
+            splittingCharacterAnimationLayerIds.has(selectedLayer.id),
+        )}
         isPersistingAssetKind={Boolean(
           selectedLayer && persistingAssetKindLayerIds.has(selectedLayer.id),
         )}
@@ -431,6 +439,7 @@ export function ImageCanvasStageView({
         onRemoveBackground={onRemoveBackground}
         onPerfectPixel={onPerfectPixel}
         onSplitIconSpritesheet={onSplitIconSpritesheet}
+        onSplitCharacterAnimation={onSplitCharacterAnimation}
         onExtractUiDesignAssets={onExtractUiDesignAssets}
         onOpenCharacterAnimationPanel={onOpenCharacterAnimationPanel}
         onDownloadLayer={onDownloadLayer}
diff --git a/src/components/image-editor/ImageCanvasUploadModel.test.ts b/src/components/image-editor/ImageCanvasUploadModel.test.ts
index d63aee82c..19448362d 100644
--- a/src/components/image-editor/ImageCanvasUploadModel.test.ts
+++ b/src/components/image-editor/ImageCanvasUploadModel.test.ts
@@ -482,6 +482,48 @@ describe('ImageCanvasUploadModel', () => {
     });
   });
 
+  it('resizes a same-ratio character animation placeholder for an uploaded reference', () => {
+    const dialog = createDialog({
+      mode: 'character-animation',
+      characterAnimationRatio: 'same',
+      characterAnimationResolution: '720p',
+      placeholder: {
+        x: 100,
+        y: 80,
+        width: 420,
+        height: 420,
+        originalWidth: 480,
+        originalHeight: 480,
+      },
+    });
+
+    expect(
+      applyGenerationReferenceUpload({
+        dialog,
+        target: 'video-reference-image',
+        references: [
+          {
+            id: 'uploaded-wide-character',
+            label: '横版角色',
+            src: 'users/user-1/wide-character.png',
+            width: 1600,
+            height: 900,
+          },
+        ],
+      }),
+    ).toMatchObject({
+      generationReferences: [{ id: 'uploaded-wide-character' }],
+      placeholder: {
+        x: -50,
+        y: 87.5,
+        width: 720,
+        height: 405,
+        originalWidth: 720,
+        originalHeight: 405,
+      },
+    });
+  });
+
   it('appends all uploaded scene references', () => {
     const firstReference = {
       id: 'scene-ref-first',
diff --git a/src/components/image-editor/ImageCanvasUploadModel.ts b/src/components/image-editor/ImageCanvasUploadModel.ts
index 02077fd62..3c217f643 100644
--- a/src/components/image-editor/ImageCanvasUploadModel.ts
+++ b/src/components/image-editor/ImageCanvasUploadModel.ts
@@ -14,6 +14,7 @@ import type {
 import {
   appendLimitedImageReferences,
   QUICK_EDIT_REFERENCE_LIMIT,
+  resizeGenerationPlaceholderToCharacterAnimationSelection,
   resolveDialogExtraImageReferenceLimit,
   resolveExtraImageReferenceLimit,
 } from './ImageCanvasGenerationModel';
@@ -109,6 +110,8 @@ export function createUploadedGenerationReference({
   mimeType,
   sizeBytes,
   durationSeconds,
+  width,
+  height,
   objectKey,
   assetObjectId,
   resourceId,
@@ -123,6 +126,8 @@ export function createUploadedGenerationReference({
   mimeType?: string;
   sizeBytes?: number;
   durationSeconds?: number;
+  width?: number;
+  height?: number;
   objectKey?: string | null;
   assetObjectId?: string | null;
   resourceId?: string | null;
@@ -139,6 +144,8 @@ export function createUploadedGenerationReference({
     mimeType,
     sizeBytes,
     durationSeconds,
+    width,
+    height,
     objectKey,
     assetObjectId,
     resourceId,
@@ -254,16 +261,25 @@ export function applyGenerationReferenceUpload({
         : target === 'video-reference-audio'
           ? 'audio'
           : 'image';
-    return dialog?.mode === 'video'
-      ? {
-          ...setFailedGenerationIdle(dialog),
-          generationReferences: appendLimitedVideoReferences(
-            dialog.generationReferences ?? [],
-            references,
-            mediaType,
-          ),
-          composerOpen: true,
-        }
+    return dialog?.mode === 'video' ||
+      (dialog?.mode === 'character-animation' && mediaType !== 'audio')
+      ? dialog.mode === 'character-animation'
+        ? resizeGenerationPlaceholderToCharacterAnimationSelection({
+            ...setFailedGenerationIdle(dialog),
+            sourceLayerId: undefined,
+            generationReferences: [firstReference],
+            composerOpen: true,
+          })
+        : {
+            ...setFailedGenerationIdle(dialog),
+            sourceLayerId: dialog.sourceLayerId,
+            generationReferences: appendLimitedVideoReferences(
+              dialog.generationReferences ?? [],
+              references,
+              mediaType,
+            ),
+            composerOpen: true,
+          }
       : dialog;
   }
   return dialog?.mode === 'character'
diff --git a/src/components/image-editor/ImageCanvasWorldView.test.tsx b/src/components/image-editor/ImageCanvasWorldView.test.tsx
index f97d0fb68..48eb4e353 100644
--- a/src/components/image-editor/ImageCanvasWorldView.test.tsx
+++ b/src/components/image-editor/ImageCanvasWorldView.test.tsx
@@ -503,7 +503,7 @@ describe('ImageCanvasWorldView', () => {
       mode: 'character-animation',
       ariaLabel: '角色动作生成占位图',
       generatorLabel: 'Action Generator',
-      badgeLabel: '动作',
+      badgeLabel: 'Spine序列帧动画',
       frameClassName:
         'image-canvas-editor__generation-frame--character-animation',
     },
@@ -588,6 +588,29 @@ describe('ImageCanvasWorldView', () => {
     },
   );
 
+  it('uses the bottom toolbar sequence icon for the character animation placeholder', () => {
+    const dialog = createGenerationDialog({
+      id: 'dialog-character-animation-icon',
+      mode: 'character-animation',
+    });
+
+    renderWorldView({
+      canvasGenerationDialogs: [dialog],
+      generateDialog: dialog,
+    });
+
+    const frame = screen.getByRole('button', { name: '角色动作生成占位图' });
+    const sequenceIcons = frame.querySelectorAll(
+      '.image-canvas-editor__sequence-animation-icon',
+    );
+
+    expect(sequenceIcons).toHaveLength(2);
+    expect(
+      frame.querySelector('.image-canvas-editor__generation-frame-icon svg'),
+    ).toBe(sequenceIcons[1]);
+    expect(frame.querySelector('.lucide-person-standing')).toBeNull();
+  });
+
   it.each([
     {
       mode: 'character',
@@ -599,7 +622,7 @@ describe('ImageCanvasWorldView', () => {
       mode: 'character-animation',
       ariaLabel: '角色动作生成占位图',
       generatorLabel: 'Action Generator',
-      badgeLabel: '动作',
+      badgeLabel: 'Spine序列帧动画',
     },
     {
       mode: 'publication',
@@ -677,7 +700,7 @@ describe('ImageCanvasWorldView', () => {
       mode: 'character-animation',
       ariaLabel: '角色动作生成占位图',
       generatorLabel: 'Action Generator',
-      badgeLabel: '动作',
+      badgeLabel: 'Spine序列帧动画',
     },
     {
       mode: 'publication',
@@ -1101,7 +1124,7 @@ describe('ImageCanvasWorldView', () => {
         .getByRole('menuitem', { name: '图标' })
         .hasAttribute('disabled'),
     ).toBe(false);
-    for (const label of ['动作', '视频', '音效', '背景音乐']) {
+    for (const label of ['Spine序列帧动画', '视频', '音效', '背景音乐']) {
       const item = within(menu).getByRole('menuitem', { name: label });
       expect(item.hasAttribute('disabled')).toBe(true);
       expect(item.title).toBe('该标签与素材的媒体类型不兼容');
@@ -1256,7 +1279,7 @@ describe('ImageCanvasWorldView', () => {
     expect(frame.style.opacity).toBe('1');
     expect(frame.style.transition).toBe('none');
     expect(within(layerButton).getByText('1/2')).toBeTruthy();
-    expect(within(layerButton).getByText('动作')).toBeTruthy();
+    expect(within(layerButton).getByText('Spine序列帧动画')).toBeTruthy();
 
     fireEvent.click(toggle);
     expect(
diff --git a/src/components/image-editor/ImageCanvasWorldView.tsx b/src/components/image-editor/ImageCanvasWorldView.tsx
index 6a31a76dd..5ccbcc2ed 100644
--- a/src/components/image-editor/ImageCanvasWorldView.tsx
+++ b/src/components/image-editor/ImageCanvasWorldView.tsx
@@ -9,7 +9,6 @@ import {
   Mountain,
   Music,
   Pause,
-  PersonStanding,
   Play,
   Sparkles,
   UserRound,
@@ -57,6 +56,7 @@ import {
   getCanvasMediaPreviewMarker,
 } from './ImageCanvasMediaModel';
 import { getCanvasGenerationSelectionId } from './ImageCanvasSelectionModel';
+import { ImageCanvasSequenceAnimationIcon } from './ImageCanvasSequenceAnimationIcon';
 
 function getGenerationPlaceholderMeta(dialog: CanvasGenerationDialogState) {
   switch (dialog.mode) {
@@ -73,9 +73,9 @@ function getGenerationPlaceholderMeta(dialog: CanvasGenerationDialogState) {
         frameClassName:
           'image-canvas-editor__generation-frame--character-animation',
         badgeClassName: 'character-animation',
-        badgeLabel: '动作',
-        icon: <PersonStanding className="h-8 w-8" />,
-        labelIcon: <PersonStanding className="h-4 w-4" />,
+        badgeLabel: 'Spine序列帧动画',
+        icon: <ImageCanvasSequenceAnimationIcon className="h-8 w-8" />,
+        labelIcon: <ImageCanvasSequenceAnimationIcon className="h-4 w-4" />,
       };
     case 'spec':
       return {
@@ -212,7 +212,7 @@ const CANVAS_ASSET_KIND_TAG_OPTIONS: Array<{
   { value: 'character', label: '角色', className: 'character' },
   {
     value: 'character-animation',
-    label: '动作',
+    label: 'Spine序列帧动画',
     className: 'character-animation',
   },
   { value: 'icon', label: '图标', className: 'icon' },
diff --git a/src/components/image-editor/useImageCanvasAssetExportWorkflow.test.tsx b/src/components/image-editor/useImageCanvasAssetExportWorkflow.test.tsx
index 3d714997c..1fabc3008 100644
--- a/src/components/image-editor/useImageCanvasAssetExportWorkflow.test.tsx
+++ b/src/components/image-editor/useImageCanvasAssetExportWorkflow.test.tsx
@@ -839,14 +839,14 @@ describe('useImageCanvasAssetExportWorkflow', () => {
       expect(metadata.layers[5].file).toBe(
         'sequences/005-角色动作/manifest.txt',
       );
-      expect(metadata.layers[5].visible.type).toBe('角色动作序列帧');
+      expect(metadata.layers[5].visible.type).toBe('Spine序列帧动画');
       const sequenceMetadata = JSON.parse(
         await readZipText(
           zip,
           '导出项目-画布素材/sequences/005-角色动作/metadata.json',
         ),
       );
-      expect(sequenceMetadata.visible.type).toBe('角色动作序列帧');
+      expect(sequenceMetadata.visible.type).toBe('Spine序列帧动画');
       expect(sequenceMetadata.taskId).toBeUndefined();
       expect(sequenceMetadata.previewVideoPath).toBeUndefined();
       expect(sequenceMetadata.failedFrames).toEqual([]);
@@ -1069,7 +1069,7 @@ describe('useImageCanvasAssetExportWorkflow', () => {
       });
       const metadata = JSON.parse(await readZipText(zip, 'metadata.json'));
       expect(metadata.title).toBe('角色动作/跑步');
-      expect(metadata.visible.type).toBe('角色动作序列帧');
+      expect(metadata.visible.type).toBe('Spine序列帧动画');
       expect(metadata.visible.resolution).toBe('100 x 80 px');
       expect(metadata.taskId).toBeUndefined();
       expect(metadata.previewVideoPath).toBeUndefined();
diff --git a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx
index 95f2c5ab5..a7c2620a5 100644
--- a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx
+++ b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx
@@ -1581,13 +1581,7 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
     });
   });
 
-  it('submits character action quick edits through image edits', async () => {
-    editEditorImageMock.mockResolvedValueOnce(
-      createGenerated({
-        prompt: '让当前图跳得更高',
-        imageSrc: 'data:image/png;base64,action-frame-edited',
-      }),
-    );
+  it('rejects ordinary quick edits for character animation sequences', async () => {
     render(
       <SubmissionWorkflowHarness
         initialLayers={[
@@ -1595,21 +1589,7 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
             title: '角色动作',
             src: 'generated-character-drafts/editor/actions/frame.png',
             mediaType: 'image-sequence',
-            thumbnailSrc: 'generated-character-drafts/editor/actions/frame.png',
-            imageSequenceFrames: [
-              {
-                imageSrc: 'generated-character-drafts/editor/actions/frame.png',
-                width: 1024,
-                height: 1024,
-              },
-            ],
-            previewVideoPath: 'https://assets.example.test/action-preview.mp4',
             assetKind: 'character-animation',
-            model: 'seedance2.0',
-            originalWidth: 1024,
-            originalHeight: 1024,
-            width: 420,
-            height: 420,
           }),
         ]}
         initialQuickEditPanel={{
@@ -1624,25 +1604,10 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
 
     fireEvent.click(screen.getByRole('button', { name: '提交快速编辑' }));
 
-    await waitFor(() => {
-      expect(editEditorImageMock).toHaveBeenCalledWith(
-        expect.objectContaining({
-          prompt: '让当前图跳得更高',
-          sourceImageSrc: 'resource-source',
-          model: 'gpt-image-2',
-          assetLabel: '角色动作 快速编辑',
-          targetLayerId: 'layer-source',
-        }),
-      );
-    });
-    expect(generateEditorCharacterAnimationMock).not.toHaveBeenCalled();
-    expect(generateEditorImageMock).not.toHaveBeenCalled();
-    expect(generateEditorVideoMock).not.toHaveBeenCalled();
-    await waitFor(() => {
-      expect(screen.getByTestId('layers').textContent).toContain(
-        'layer-source:角色动作 快速编辑:resource-source:character-animation:image-sequence:data:image/png;base64,action-frame-edited',
-      );
-    });
+    expect(editEditorImageMock).not.toHaveBeenCalled();
+    expect(screen.getByTestId('quick-edit').textContent).toBe(
+      'layer-source:failed:让当前图跳得更高:Spine序列帧动画不支持快速编辑',
+    );
   });
 
   it('captures a local edit fallback when the project response has no snapshot', async () => {
@@ -4482,6 +4447,8 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
         initialLayers={[
           createLayer({
             id: 'character-layer',
+            resourceId: 'local-resource-character-layer',
+            resourcePersistenceState: 'pending',
             assetKind: 'character',
             src: 'data:image/png;base64,Y2hhcmFjdGVy',
           }),
@@ -4515,6 +4482,9 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
         }),
       );
     });
+    expect(
+      generateEditorCharacterAnimationMock.mock.calls[0]?.[0].sourceResourceId,
+    ).toBeUndefined();
     await waitFor(() => {
       expect(screen.getByTestId('character-animation').textContent).toBe(
         'character-layer:completed:跑步:-:result',
@@ -4812,7 +4782,7 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
         ]}
         initialCharacterAnimationPanel={{
           sourceLayerId: 'character-layer',
-          promptText: '',
+          promptText: '挥手',
           resolution: '480p',
           ratio: 'same',
           frameCount: 32,
@@ -4828,7 +4798,7 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
 
     await waitFor(() => {
       expect(screen.getByTestId('character-animation').textContent).toBe(
-        'character-layer:failed:-:生成角色动画失败:-',
+        'character-layer:failed:挥手:生成角色动画失败:-',
       );
     });
   });
diff --git a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts
index 38fbc9b95..414600ccd 100644
--- a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts
+++ b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts
@@ -76,6 +76,7 @@ import {
   normalizeEditorImageModel,
   resolveEditorImageGenerationPixelSize,
   resolveImageGenerationErrorMessage,
+  resolveRegisteredProjectResourceId,
 } from './ImageCanvasGenerationModel';
 import { chooseGenerationPlacement } from './ImageCanvasGenerationPlacementModel';
 import {
@@ -1105,8 +1106,11 @@ export function useImageCanvasGenerationSubmissionWorkflow({
         sourceLayer: options.sourceLayer,
       });
 
+      // 结果缺少可用的正式序列帧时不能静默 return——上层已经把 dialog/面板
+      // 置为 generating，若这里不发失败分支，重试会被 generating 守卫永久阻断。抛错交给
+      // submitCharacterAnimation 的 catch 统一走 failed + composerOpen 恢复。
       if (!nextLayer) {
-        return;
+        throw new Error('角色动作生成结果缺少可用的正式序列帧，无法放置到画布。');
       }
       addGeneratedLayersToCanvas([nextLayer]);
       selectSingleLayer(nextLayer.id);
@@ -1425,7 +1429,10 @@ export function useImageCanvasGenerationSubmissionWorkflow({
       setQuickEditPanel({
         ...quickEditPanel,
         status: 'failed',
-        errorMessage: '图标类素材不支持快速编辑',
+        errorMessage:
+          quickEditSourceLayer.assetKind === 'character-animation'
+            ? 'Spine序列帧动画不支持快速编辑'
+            : '图标类素材不支持快速编辑',
       });
       return;
     }
@@ -2681,7 +2688,7 @@ export function useImageCanvasGenerationSubmissionWorkflow({
   );
 
   const submitCharacterAnimation = useCallback(async () => {
-    if (!characterAnimationPanel || !characterAnimationSourceLayer) {
+    if (!characterAnimationPanel) {
       return;
     }
     if (
@@ -2696,6 +2703,7 @@ export function useImageCanvasGenerationSubmissionWorkflow({
       const submissionPlan = buildCharacterAnimationSubmissionPlan({
         panel: characterAnimationPanel,
         sourceLayer: characterAnimationSourceLayer,
+        reference: characterAnimationPanel.references?.[0] ?? null,
       });
       if (canvasDialog?.mode === 'character-animation') {
         updateCanvasGenerationDialogById(canvasDialog.id, (currentDialog) => ({
@@ -2724,35 +2732,64 @@ export function useImageCanvasGenerationSubmissionWorkflow({
       if (!canvasDialog) {
         setCharacterAnimationPanel(nextPanel);
       }
+      const canvasCompletionPlaceholder = canvasDialog
+        ? getGeneratingDialogPlaceholder(canvasDialog)
+        : undefined;
+      const selectedReference = characterAnimationPanel.references?.[0];
+      const referenceMediaType =
+        selectedReference?.mediaType === 'video' ? 'video' : 'image';
+      const stableReferenceSrc = selectedReference
+        ? await resolveEditorGenerationMediaReference(
+            selectedReference,
+            referenceMediaType,
+            projectId,
+            {
+              allowRegisteredIds: false,
+              requireImageObjectReference: referenceMediaType === 'image',
+            },
+          )
+        : characterAnimationSourceLayer
+          ? await resolveEditorGenerationMediaReference(
+              characterAnimationSourceLayer,
+              'image',
+              projectId,
+              {
+                allowRegisteredIds: false,
+                requireImageObjectReference: true,
+              },
+            )
+          : undefined;
       const generationInputs = buildCharacterAnimationGenerationInputs(
         submissionPlan.promptText,
         characterAnimationSourceLayer,
+        selectedReference ?? null,
         {
           resolution: characterAnimationPanel.resolution,
           ratio: characterAnimationPanel.ratio,
           frameCount: characterAnimationPanel.frameCount,
           durationSeconds: characterAnimationPanel.durationSeconds,
-        },
-      );
-      const canvasCompletionPlaceholder = canvasDialog
-        ? getGeneratingDialogPlaceholder(canvasDialog)
-        : undefined;
-      const sourceImageSrc = await resolveEditorGenerationMediaReference(
-        characterAnimationSourceLayer,
-        'image',
-        projectId,
-        {
-          allowRegisteredIds: false,
-          requireImageObjectReference: true,
+          backgroundColor: characterAnimationPanel.backgroundColor,
+          referenceSrc: stableReferenceSrc,
+          referenceMediaType,
         },
       );
       const result = await runEditorGenerationWithWalletRefresh(
         generateEditorCharacterAnimation({
           ...submissionPlan.input,
-          sourceImageSrc,
+          ...(stableReferenceSrc
+            ? {
+                referenceSrc: stableReferenceSrc,
+                ...(referenceMediaType === 'image'
+                  ? { sourceImageSrc: stableReferenceSrc }
+                  : {}),
+              }
+            : {}),
           projectId,
           generationInputs,
-          sourceResourceId: characterAnimationSourceLayer.resourceId,
+          sourceResourceId: resolveRegisteredProjectResourceId(
+            selectedReference?.resourceId ??
+              characterAnimationSourceLayer?.resourceId,
+          ),
           assetFolderId,
           ...(canvasDialog && projectId && canvasCompletionPlaceholder
             ? {
@@ -2766,6 +2803,20 @@ export function useImageCanvasGenerationSubmissionWorkflow({
         }),
         onWalletBalanceMayHaveChanged,
       );
+      // 独立面板路径没有画布 dialog，队列成功 / 直接 project 快照都要把面板
+      // 收敛到终态，否则 `isGenerating` 会让面板永久禁用提交与关闭。顺带把队列路径缺的
+      // onGenerationWarning（第 6 参）与 completionDialogId（第 7 参）补上，与图片/场景路径对齐。
+      const settleStandaloneCharacterAnimationPanel = () => {
+        setCharacterAnimationPanel((currentPanel) =>
+          currentPanel
+            ? {
+                ...currentPanel,
+                status: 'completed',
+                result,
+              }
+            : currentPanel,
+        );
+      };
       if (
         await applyQueuedEditorGenerationProject(
           result,
@@ -2773,12 +2824,16 @@ export function useImageCanvasGenerationSubmissionWorkflow({
           applyProjectSnapshot,
           onQueuedGenerationTask,
           onWalletBalanceMayHaveChanged,
+          onGenerationWarning,
+          canvasDialog?.id,
         )
       ) {
+        settleStandaloneCharacterAnimationPanel();
         return;
       }
       if (result.project && applyProjectSnapshot) {
         applyProjectSnapshot(result.project);
+        settleStandaloneCharacterAnimationPanel();
         return;
       }
       if (canvasDialog) {
@@ -2795,7 +2850,9 @@ export function useImageCanvasGenerationSubmissionWorkflow({
           canvasCompletionPlaceholder,
           canvasDialog.id,
           {
-            sourceLayer: characterAnimationSourceLayer,
+            ...(characterAnimationSourceLayer
+              ? { sourceLayer: characterAnimationSourceLayer }
+              : {}),
           },
         );
         return;
@@ -2855,6 +2912,7 @@ export function useImageCanvasGenerationSubmissionWorkflow({
     updateCanvasGenerationDialogById,
     onWalletBalanceMayHaveChanged,
     onQueuedGenerationTask,
+    onGenerationWarning,
   ]);
 
   return useMemo(
diff --git a/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx b/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx
index 782e48d1c..e853cc749 100644
--- a/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx
+++ b/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx
@@ -211,6 +211,12 @@ function GenerationSurfaceHarness() {
       >
         切换视频
       </button>
+      <button
+        type="button"
+        onClick={() => surface.switchGenerationTool('character-animation')}
+      >
+        切换Spine序列帧
+      </button>
       <button
         type="button"
         onClick={() => surface.switchGenerationTool('music')}
@@ -288,6 +294,17 @@ describe('useImageCanvasGenerationSurface', () => {
       'generate:open:placeholder',
     );
     expect(screen.getByRole('dialog', { name: '生成图片' })).toBeTruthy();
+
+    fireEvent.click(screen.getByRole('button', { name: '切换Spine序列帧' }));
+    expect(screen.getByTestId('tool').textContent).toBe(
+      'character-animation',
+    );
+    expect(screen.getByTestId('dialog').textContent).toBe(
+      'character-animation:open:placeholder',
+    );
+    expect(
+      screen.getByRole('dialog', { name: 'Spine序列帧动画生成' }),
+    ).toBeTruthy();
   });
 
   it('derives composer position without rendering a standalone close button', () => {
diff --git a/src/components/image-editor/useImageCanvasGenerationSurface.tsx b/src/components/image-editor/useImageCanvasGenerationSurface.tsx
index 763d0e87d..783de49df 100644
--- a/src/components/image-editor/useImageCanvasGenerationSurface.tsx
+++ b/src/components/image-editor/useImageCanvasGenerationSurface.tsx
@@ -343,6 +343,10 @@ export function useImageCanvasGenerationSurface({
         generationWorkflow.openVideoGenerationDialog();
         return true;
       }
+      if (tool === 'character-animation') {
+        generationWorkflow.openCharacterAnimationPanel();
+        return true;
+      }
       if (tool === 'music') {
         openToolbarOptionMenu('music');
         setActiveTool('music');
diff --git a/src/components/image-editor/useImageCanvasGenerationWorkflow.test.tsx b/src/components/image-editor/useImageCanvasGenerationWorkflow.test.tsx
index 3661ce448..036b787be 100644
--- a/src/components/image-editor/useImageCanvasGenerationWorkflow.test.tsx
+++ b/src/components/image-editor/useImageCanvasGenerationWorkflow.test.tsx
@@ -51,6 +51,7 @@ const generateEditorBackgroundMusicMock = vi.hoisted(() => vi.fn());
 const editEditorImageMock = vi.hoisted(() => vi.fn());
 const createEditorProjectResourceMock = vi.hoisted(() => vi.fn());
 const splitEditorIconSpritesheetMock = vi.hoisted(() => vi.fn());
+const splitEditorCharacterAnimationFramesMock = vi.hoisted(() => vi.fn());
 const uploadEditorMediaAssetObjectFileMock = vi.hoisted(() => vi.fn());
 const uploadEditorMediaAssetFileMock = vi.hoisted(() => vi.fn());
 const renderCropExpandImageMock = vi.hoisted(() => vi.fn());
@@ -88,6 +89,8 @@ vi.mock('../../services/image-editor/editorProjectClient', async () => {
     generateEditorSoundEffect: generateEditorSoundEffectMock,
     loadEditorProject: loadEditorProjectMock,
     splitEditorIconSpritesheet: splitEditorIconSpritesheetMock,
+    splitEditorCharacterAnimationFrames:
+      splitEditorCharacterAnimationFramesMock,
   };
 });
 
@@ -603,6 +606,9 @@ function GenerationWorkflowHarness({
       <span data-testid="character-animation-price">
         {workflow.characterAnimationPrice}
       </span>
+      <span data-testid="character-animation-background">
+        {`${workflow.characterAnimationPanel?.backgroundColor ?? 'auto'}:${activeDialog?.characterAnimationBackgroundColor ?? 'auto'}`}
+      </span>
       <span data-testid="fit-count">
         {fitLayersMockRef.current.mock.calls.length}
       </span>
@@ -917,6 +923,19 @@ function GenerationWorkflowHarness({
           ? '拆图中'
           : '空闲'}
       </output>
+      <button
+        type="button"
+        onClick={() =>
+          void workflow.splitSelectedCharacterAnimationFrames(layers[0]!)
+        }
+      >
+        拆分序列帧
+      </button>
+      <output aria-label="拆帧状态">
+        {workflow.splittingCharacterAnimationLayerIds.has(layers[0]!.id)
+          ? '拆帧中'
+          : '空闲'}
+      </output>
       <button
         type="button"
         onClick={() =>
@@ -927,6 +946,40 @@ function GenerationWorkflowHarness({
       >
         打开角色动画
       </button>
+      <button
+        type="button"
+        onClick={() => workflow.openCharacterAnimationPanel()}
+      >
+        打开独立角色动画
+      </button>
+      <button
+        type="button"
+        onClick={() =>
+          workflow.pickGenerationReferenceFromLayer(
+            createLayer({
+              id: 'layer-character-source',
+              title: '角色形象原图',
+              assetKind: 'character',
+            }),
+          )
+        }
+      >
+        选择角色形象原图为动画参考
+      </button>
+      <button
+        type="button"
+        onClick={() =>
+          workflow.pickGenerationReferenceFromLayer(
+            createLayer({
+              id: 'layer-character-cutout',
+              title: '角色形象抠图结果',
+              assetKind: 'character',
+            }),
+          )
+        }
+      >
+        选择角色形象抠图为动画参考
+      </button>
       <button
         type="button"
         onClick={() => workflow.openCharacterAnimationPanel(layers[0]!)}
@@ -2024,6 +2077,27 @@ describe('useImageCanvasGenerationWorkflow', () => {
     });
   });
 
+  it('accepts both character source and cutout layers as animation references', () => {
+    render(<GenerationWorkflowHarness />);
+
+    fireEvent.click(screen.getByRole('button', { name: '打开独立角色动画' }));
+    fireEvent.click(
+      screen.getByRole('button', { name: '选择角色形象原图为动画参考' }),
+    );
+    expect(screen.getByTestId('generation-references').textContent).toBe(
+      '角色形象原图',
+    );
+    expect(screen.getByTestId('reference-pick-warning').textContent).toBe('-');
+
+    fireEvent.click(
+      screen.getByRole('button', { name: '选择角色形象抠图为动画参考' }),
+    );
+    expect(screen.getByTestId('generation-references').textContent).toBe(
+      '角色形象抠图结果',
+    );
+    expect(screen.getByTestId('reference-pick-warning').textContent).toBe('-');
+  });
+
   it('keeps canvas reference picking active and warns when the next image exceeds capacity', () => {
     render(<GenerationWorkflowHarness />);
 
@@ -2728,6 +2802,81 @@ describe('useImageCanvasGenerationWorkflow', () => {
     });
   });
 
+  it('registers character animation frames as existing account assets without changing the canvas', async () => {
+    const refreshAssetLibrary = vi.fn().mockResolvedValue(undefined);
+    splitEditorCharacterAnimationFramesMock.mockResolvedValueOnce({
+      frameCount: 32,
+      assets: [],
+    });
+    render(
+      <GenerationWorkflowHarness
+        projectId="project-1"
+        refreshAssetLibrary={refreshAssetLibrary}
+        initialLayers={[
+          createLayer({
+            title: '勇者奔跑',
+            assetKind: 'character-animation',
+            mediaType: 'image-sequence',
+          }),
+        ]}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: '拆分序列帧' }));
+
+    await waitFor(() => {
+      expect(splitEditorCharacterAnimationFramesMock).toHaveBeenCalledWith({
+        projectId: 'project-1',
+        sourceLayerId: 'layer-source',
+        sourceResourceId: 'resource-source',
+        assetFolderId: undefined,
+        assetLabel: '勇者奔跑',
+      });
+    });
+    expect(refreshAssetLibrary).toHaveBeenCalledTimes(1);
+    expect(screen.getByTestId('sidebar').textContent).toBe('assets');
+    expect(screen.getByRole('status', { name: '拆帧状态' }).textContent).toBe(
+      '空闲',
+    );
+  });
+
+  it.each([
+    ['pending resource', 'resource-character-animation-pending', 'pending'],
+    ['local resource', 'local-resource-character-animation-1', undefined],
+    [
+      'dialog placeholder',
+      'generation-dialog:character-animation-1',
+      undefined,
+    ],
+  ] as const)(
+    'does not split character animation frames before the %s is registered',
+    async (_case, resourceId, resourcePersistenceState) => {
+      render(
+        <GenerationWorkflowHarness
+          projectId="project-1"
+          initialLayers={[
+            createLayer({
+              resourceId,
+              resourcePersistenceState,
+              title: '保存中的序列帧',
+              assetKind: 'character-animation',
+              mediaType: 'image-sequence',
+            }),
+          ]}
+        />,
+      );
+
+      fireEvent.click(screen.getByRole('button', { name: '拆分序列帧' }));
+
+      await waitFor(() => {
+        expect(splitEditorCharacterAnimationFramesMock).not.toHaveBeenCalled();
+      });
+      expect(screen.getByRole('status', { name: '拆帧状态' }).textContent).toBe(
+        '空闲',
+      );
+    },
+  );
+
   it('queues background removal for private character images', async () => {
     resolveEditorImageReferenceDataUrlMock.mockResolvedValueOnce(
       'data:image/png;base64,resolved-character',
@@ -3207,8 +3356,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
       );
     });
     const firstRequest = snapImageToPerfectPixelsMock.mock.calls[0]?.[0] as
-      | EditorPixelArtSnapInput
-      | undefined;
+      EditorPixelArtSnapInput | undefined;
     const firstDialogList =
       screen.getByTestId('generation-dialogs').textContent;
     const firstOperation = JSON.parse(
@@ -3226,8 +3374,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
     });
 
     const retryRequest = snapImageToPerfectPixelsMock.mock.calls[1]?.[0] as
-      | EditorPixelArtSnapInput
-      | undefined;
+      EditorPixelArtSnapInput | undefined;
     expect(JSON.stringify(retryRequest)).toBe(firstRequestBytes);
     expect(retryRequest).toEqual(firstOperation.request);
     expect(retryRequest?.canvasCompletion.dialogId).toBe(
@@ -3363,8 +3510,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
         });
       loadEditorProjectMock.mockImplementation(async () => {
         const request = snapImageToPerfectPixelsMock.mock.calls.at(-1)?.[0] as
-          | EditorPixelArtSnapInput
-          | undefined;
+          EditorPixelArtSnapInput | undefined;
         return createConflictingPerfectPixelProject(
           request!.canvasCompletion.dialogId,
         );
@@ -3417,8 +3563,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
       expect(retried!.reconcileUntil - retried!.submittedAt).toBe(75_000);
       expect(retried?.taskId).toBe(beforeRetry.taskId);
       const firstRequest = snapImageToPerfectPixelsMock.mock.calls[0]?.[0] as
-        | EditorPixelArtSnapInput
-        | undefined;
+        EditorPixelArtSnapInput | undefined;
       expect(JSON.stringify(requestAtRetryPost)).toBe(
         JSON.stringify(firstRequest),
       );
@@ -3444,8 +3589,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
       );
     loadEditorProjectMock.mockImplementation(async () => {
       const request = snapImageToPerfectPixelsMock.mock.calls.at(-1)?.[0] as
-        | EditorPixelArtSnapInput
-        | undefined;
+        EditorPixelArtSnapInput | undefined;
       return createConflictingPerfectPixelProject(
         request!.canvasCompletion.dialogId,
       );
@@ -3472,8 +3616,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
     });
 
     const firstRequest = snapImageToPerfectPixelsMock.mock.calls[0]?.[0] as
-      | EditorPixelArtSnapInput
-      | undefined;
+      EditorPixelArtSnapInput | undefined;
     const firstRequestBytes = JSON.stringify(firstRequest);
     const operation = JSON.parse(
       screen.getByTestId('perfect-pixel-operation').textContent!,
@@ -3506,8 +3649,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
     });
 
     const retryRequest = snapImageToPerfectPixelsMock.mock.calls[1]?.[0] as
-      | EditorPixelArtSnapInput
-      | undefined;
+      EditorPixelArtSnapInput | undefined;
     expect(uploadEditorMediaAssetObjectFileMock).toHaveBeenCalledTimes(1);
     expect(JSON.stringify(retryRequest)).toBe(firstRequestBytes);
     expect(retryRequest?.canvasCompletion.dialogId).toBe(operation.operationId);
@@ -3528,8 +3670,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
       .mockImplementationOnce(() => retryResult.promise);
     loadEditorProjectMock.mockImplementation(async () => {
       const request = snapImageToPerfectPixelsMock.mock.calls[0]?.[0] as
-        | EditorPixelArtSnapInput
-        | undefined;
+        EditorPixelArtSnapInput | undefined;
       return createConflictingPerfectPixelProject(
         request!.canvasCompletion.dialogId,
       );
@@ -3566,8 +3707,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
       expect(snapImageToPerfectPixelsMock).toHaveBeenCalledTimes(2);
     });
     const retryRequest = snapImageToPerfectPixelsMock.mock.calls[1]?.[0] as
-      | EditorPixelArtSnapInput
-      | undefined;
+      EditorPixelArtSnapInput | undefined;
     expect(retryRequest).toBeDefined();
 
     rerender(
@@ -3603,8 +3743,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
     );
     loadEditorProjectMock.mockImplementation(async () => {
       const request = snapImageToPerfectPixelsMock.mock.calls[0]?.[0] as
-        | EditorPixelArtSnapInput
-        | undefined;
+        EditorPixelArtSnapInput | undefined;
       return createConflictingPerfectPixelProject(
         request!.canvasCompletion.dialogId,
       );
@@ -3678,8 +3817,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
     );
     loadEditorProjectMock.mockImplementationOnce(async () => {
       const request = snapImageToPerfectPixelsMock.mock.calls[0]?.[0] as
-        | EditorPixelArtSnapInput
-        | undefined;
+        EditorPixelArtSnapInput | undefined;
       return createConflictingPerfectPixelProject(
         request!.canvasCompletion.dialogId,
       );
@@ -3728,8 +3866,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
       `pixel-art-snap-${postedOperation.operationId}`,
     );
     const postedRequest = snapImageToPerfectPixelsMock.mock.calls[0]?.[0] as
-      | EditorPixelArtSnapInput
-      | undefined;
+      EditorPixelArtSnapInput | undefined;
     expect(JSON.stringify(postedRequest)).toBe(
       JSON.stringify(postedOperation.request),
     );
@@ -4680,8 +4817,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
       }),
     );
     const readOptions = loadEditorProjectMock.mock.calls[0]?.[1] as
-      | { deadlineAt?: number }
-      | undefined;
+      { deadlineAt?: number } | undefined;
     expect(readOptions?.deadlineAt).toBeLessThanOrEqual(Date.now() + 10_000);
     expect(readOptions?.deadlineAt).toBeLessThanOrEqual(
       hydratedDialog.perfectPixelOperation!.reconcileUntil,
@@ -4753,8 +4889,7 @@ describe('useImageCanvasGenerationWorkflow', () => {
     });
     expect(loadEditorProjectMock).toHaveBeenCalledTimes(1);
     const readOptions = loadEditorProjectMock.mock.calls[0]?.[1] as
-      | { deadlineAt?: number }
-      | undefined;
+      { deadlineAt?: number } | undefined;
     expect(readOptions?.deadlineAt).toBeGreaterThanOrEqual(readStartedAt);
     expect(readOptions?.deadlineAt).toBeLessThanOrEqual(Date.now() + 10_000);
     expect(snapImageToPerfectPixelsMock).not.toHaveBeenCalled();
@@ -5035,6 +5170,118 @@ describe('useImageCanvasGenerationWorkflow', () => {
     );
   });
 
+  it('keeps automatic background color for character layers and explicit green for the standalone entry', () => {
+    render(<GenerationWorkflowHarness />);
+
+    fireEvent.click(screen.getByRole('button', { name: '打开角色动画' }));
+    expect(
+      screen.getByTestId('character-animation-background').textContent,
+    ).toBe('auto:auto');
+
+    fireEvent.click(screen.getByRole('button', { name: '打开独立角色动画' }));
+    expect(
+      screen.getByTestId('character-animation-background').textContent,
+    ).toBe('green:green');
+  });
+
+  it('restores text-mode character animation remodeling without source references', () => {
+    render(
+      <GenerationWorkflowHarness
+        initialLayers={[
+          createLayer({
+            id: 'layer-text-animation',
+            title: '文本角色动作',
+            mediaType: 'image-sequence',
+            assetKind: 'character-animation',
+            sourceType: 'generated',
+            generationInputs: {
+              version: 2,
+              action: 'character-animation.generate',
+              fields: [
+                { id: 'inputMode', title: '输入模式', value: 'text' },
+                { id: 'prompt', title: '动作描述', value: '像素骑士原地挥手' },
+                { id: 'resolution', title: '清晰度', value: '480p' },
+                { id: 'ratio', title: '比例', value: '1:1' },
+                { id: 'frameCount', title: '帧数', value: 32 },
+                { id: 'durationSeconds', title: '时长', value: 4 },
+              ],
+              references: [],
+            },
+          }),
+        ]}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: '打开图片改造' }));
+
+    expect(screen.getByTestId('dialog').textContent).toBe(
+      'character-animation:idle:open:-:placeholder',
+    );
+    expect(screen.getByTestId('dialog-prompt').textContent).toBe(
+      '像素骑士原地挥手',
+    );
+    expect(screen.getByTestId('generation-references').textContent).toBe('');
+    expect(screen.getByTestId('reference-pick-warning').textContent).toBe('-');
+  });
+
+  it('restores an uploaded video reference from stable referenceSrc in the real remodeling workflow', () => {
+    render(
+      <GenerationWorkflowHarness
+        initialLayers={[
+          createLayer({
+            id: 'layer-video-animation',
+            title: '视频角色动作',
+            mediaType: 'image-sequence',
+            assetKind: 'character-animation',
+            sourceType: 'generated',
+            generationInputs: {
+              version: 2,
+              action: 'character-animation.generate',
+              fields: [
+                { id: 'inputMode', title: '输入模式', value: 'video' },
+                {
+                  id: 'referenceSrc',
+                  title: '参考素材',
+                  value: 'users/user-1/run.mp4',
+                },
+                { id: 'referenceMediaType', title: '参考类型', value: 'video' },
+                { id: 'referenceWidth', title: '参考宽度', value: 1920 },
+                { id: 'referenceHeight', title: '参考高度', value: 1080 },
+                { id: 'prompt', title: '动作描述', value: '复刻奔跑节奏' },
+                { id: 'resolution', title: '清晰度', value: '720p' },
+                { id: 'ratio', title: '比例', value: 'same' },
+                { id: 'frameCount', title: '帧数', value: 40 },
+                { id: 'durationSeconds', title: '时长', value: 5 },
+              ],
+              references: [
+                {
+                  id: 'source',
+                  title: '参考视频',
+                  label: '奔跑参考.mp4',
+                  refType: 'asset',
+                  refId: 'asset-run-video',
+                },
+              ],
+            },
+          }),
+        ]}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: '打开图片改造' }));
+
+    expect(screen.getByTestId('dialog').textContent).toBe(
+      'character-animation:idle:open:-:placeholder',
+    );
+    expect(screen.getByTestId('generation-references').textContent).toBe(
+      '奔跑参考.mp4',
+    );
+    expect(screen.getByTestId('reference-pick-warning').textContent).toBe('-');
+    expect(
+      screen.getByTestId('character-animation-background').textContent,
+    ).toBe('auto:auto');
+  });
+
   it('reopens character animation remodeling from an action result layer', () => {
     render(
       <GenerationWorkflowHarness
diff --git a/src/components/image-editor/useImageCanvasGenerationWorkflow.ts b/src/components/image-editor/useImageCanvasGenerationWorkflow.ts
index 8143cf448..3c35a3cc3 100644
--- a/src/components/image-editor/useImageCanvasGenerationWorkflow.ts
+++ b/src/components/image-editor/useImageCanvasGenerationWorkflow.ts
@@ -25,6 +25,7 @@ import {
   type EditorProjectResourceSnapshot,
   type EditorProjectSnapshot,
   loadEditorProject,
+  splitEditorCharacterAnimationFrames,
   splitEditorIconSpritesheet,
 } from '../../services/image-editor/editorProjectClient';
 import { resizeCropExpandFrame } from './ImageCanvasCropExpandModel';
@@ -36,6 +37,7 @@ import {
 import type {
   CanvasGenerationAction,
   CanvasGenerationDialogState,
+  CanvasGenerationInputField,
   CanvasGenerationInputReference,
   CanvasHistoryAction,
   CanvasLayer,
@@ -92,6 +94,7 @@ import {
   appendLimitedImageReferences,
   buildDeterministicGenerationInputs,
   calculateCharacterAnimationPrice,
+  canSplitCharacterAnimationFrames,
   CANVAS_GENERATION_PARAMETER_FALLBACK_WARNING,
   CHARACTER_ANIMATION_DURATION_OPTIONS,
   CHARACTER_ANIMATION_MODEL,
@@ -103,6 +106,7 @@ import {
   isCanvasGenerationDialog,
   isQuickEditUnsupportedAssetKind,
   normalizeEditorImageModel,
+  resizeGenerationPlaceholderToCharacterAnimationSelection,
   resizeGenerationPlaceholderToImageSelection,
   resolveDialogExtraImageReferenceLimit,
   resolveExtraImageReferenceLimit,
@@ -179,12 +183,31 @@ const NON_REPLACEABLE_SOURCE_WARNING_BY_ACTION: Partial<
     '原 UI 设计图不在当前画布，当前素材提取面板无法重新选择来源设计图，无法改造。',
 };
 
+function canRestoreCharacterAnimationWithoutCanvasSource(
+  action: CanvasGenerationAction,
+  fields: CanvasGenerationInputField[],
+) {
+  if (action !== 'character-animation.generate') {
+    return false;
+  }
+  const inputMode = fields.find((field) => field.id === 'inputMode')?.value;
+  const referenceSrc = fields.find(
+    (field) => field.id === 'referenceSrc',
+  )?.value;
+  return (
+    inputMode === 'text' ||
+    (typeof referenceSrc === 'string' && referenceSrc.trim().length > 0)
+  );
+}
+
 function getMissingNonReplaceableSourceWarning({
   action,
+  fields,
   references,
   unavailableReferences,
 }: {
   action: CanvasGenerationAction;
+  fields: CanvasGenerationInputField[];
   references: CanvasGenerationInputReference[];
   unavailableReferences: CanvasGenerationInputReference[];
 }) {
@@ -192,6 +215,9 @@ function getMissingNonReplaceableSourceWarning({
   if (!warning) {
     return null;
   }
+  if (canRestoreCharacterAnimationWithoutCanvasSource(action, fields)) {
+    return null;
+  }
   const unavailableSourceKeys = new Set(
     unavailableReferences
       .filter((reference) => reference.id === 'source')
@@ -702,10 +728,12 @@ function findSourceAnimationLayer(
   if (!sourceResourceId) {
     return null;
   }
+  // 与 EditorView.openLayerGenerationDialog 的同一实现保持一致，匹配
+  // resourceId 或历史落库的 layer id；仅认定角色图层为动画来源。
   return (
     layers.find(
       (layer) =>
-        layer.resourceId === sourceResourceId &&
+        (layer.resourceId === sourceResourceId || layer.id === sourceResourceId) &&
         layer.assetKind === 'character',
     ) ?? null
   );
@@ -719,7 +747,7 @@ const CANVAS_TOOL_BY_GENERATION_MODE = {
   publication: 'publication',
   'ui-design': 'ui-design',
   'quick-edit': 'generate',
-  'character-animation': 'character',
+  'character-animation': 'character-animation',
   video: 'video',
   'audio-sound-effect': 'music',
   'audio-background-music': 'music',
@@ -920,15 +948,19 @@ function writeCachedGenerationReference(
 function createCharacterAnimationPanelFromDialog(
   dialog: CanvasGenerationDialogState | null,
 ): CharacterAnimationPanelState | null {
-  if (dialog?.mode !== 'character-animation' || !dialog.sourceLayerId) {
+  if (dialog?.mode !== 'character-animation') {
     return null;
   }
   return {
     sourceLayerId: dialog.sourceLayerId,
+    references: dialog.generationReferences ?? [],
     promptText: dialog.prompt,
     assetLabel: dialog.assetLabel,
+    backgroundColor: dialog.characterAnimationBackgroundColor,
     resolution: dialog.characterAnimationResolution ?? '480p',
-    ratio: dialog.characterAnimationRatio ?? 'same',
+    // 与 composer 展示默认值保持一致（composer 用 `?? '1:1'`）。此前这里默认
+    // 'same'，缺字段的持久化 dialog 会显示 1:1 却提交 same。
+    ratio: dialog.characterAnimationRatio ?? '1:1',
     frameCount: dialog.characterAnimationFrameCount ?? 32,
     durationSeconds: dialog.characterAnimationDurationSeconds ?? 4,
     status:
@@ -957,10 +989,13 @@ function applyCharacterAnimationPanelToDialog(
       composerOpen: false,
     };
   }
-  return {
+  return resizeGenerationPlaceholderToCharacterAnimationSelection({
     ...dialog,
     prompt: panel.promptText,
     assetLabel: panel.assetLabel,
+    sourceLayerId: panel.sourceLayerId,
+    generationReferences: panel.references,
+    characterAnimationBackgroundColor: panel.backgroundColor,
     characterAnimationResolution: panel.resolution,
     characterAnimationRatio: panel.ratio,
     characterAnimationFrameCount: panel.frameCount,
@@ -973,7 +1008,7 @@ function applyCharacterAnimationPanelToDialog(
           ? 'failed'
           : 'idle',
     errorMessage: panel.errorMessage,
-  };
+  });
 }
 
 type GenerationWorkflowOptions = {
@@ -1105,6 +1140,11 @@ export function useImageCanvasGenerationWorkflow({
     splittingIconSpritesheetLayerIds,
     setSplittingIconSpritesheetLayerIds,
   ] = useState<Set<string>>(() => new Set());
+  const splittingCharacterAnimationLayerIdsRef = useRef(new Set<string>());
+  const [
+    splittingCharacterAnimationLayerIds,
+    setSplittingCharacterAnimationLayerIds,
+  ] = useState<Set<string>>(() => new Set());
   const perfectPixelLayerIdsRef = useRef(new Set<string>());
   // 中文注释：本会话仍在执行的 inline 占位 id。到期清理只该针对**别人**留下的孤儿，
   // 而它无法从 dialog 状态区分「已死会话留下的」和「本会话正在跑的」——两者都是
@@ -1439,11 +1479,13 @@ export function useImageCanvasGenerationWorkflow({
           (layer) => layer.id === quickEditSelectionState.sourceLayerId,
         ) ?? null)
       : null;
-  const characterAnimationSourceLayer = effectiveCharacterAnimationPanel
-    ? (layers.find(
-        (layer) => layer.id === effectiveCharacterAnimationPanel.sourceLayerId,
-      ) ?? null)
-    : null;
+  const characterAnimationSourceLayer =
+    effectiveCharacterAnimationPanel?.sourceLayerId
+      ? (layers.find(
+          (layer) =>
+            layer.id === effectiveCharacterAnimationPanel.sourceLayerId,
+        ) ?? null)
+      : null;
   const characterAnimationPrice = effectiveCharacterAnimationPanel
     ? calculateCharacterAnimationPrice(
         CHARACTER_ANIMATION_MODEL,
@@ -1581,7 +1623,7 @@ export function useImageCanvasGenerationWorkflow({
   );
 
   const openCharacterAnimationPanel = useCallback(
-    (layer: CanvasLayer) => {
+    (layer?: CanvasLayer) => {
       const draft = createCharacterAnimationGenerationDialogDraft({
         canvasSize,
         viewport,
@@ -1591,7 +1633,7 @@ export function useImageCanvasGenerationWorkflow({
         return;
       }
       openPlacedCanvasGenerationDialog(draft);
-      activateCanvasGenerationEntry('character');
+      activateCanvasGenerationEntry('character-animation');
     },
     [
       activateCanvasGenerationEntry,
@@ -1850,10 +1892,10 @@ export function useImageCanvasGenerationWorkflow({
       );
       const hasInvalidVersionedGenerationInputs = Boolean(
         sourceLayer.generationInputsHydrationState === 'invalid-versioned' ||
-          (sourceLayer.generationInputs &&
-            (sourceLayer.generationInputs.version !== undefined ||
-              sourceLayer.generationInputs.action !== undefined) &&
-            !decodedGenerationInputs.ok),
+        (sourceLayer.generationInputs &&
+          (sourceLayer.generationInputs.version !== undefined ||
+            sourceLayer.generationInputs.action !== undefined) &&
+          !decodedGenerationInputs.ok),
       );
       if (hasInvalidVersionedGenerationInputs) {
         showGenerationWarning(
@@ -1881,9 +1923,20 @@ export function useImageCanvasGenerationWorkflow({
             layers,
           )
         : [];
+      const unresolvedUnavailableReferences =
+        normalizedGenerationInputs &&
+        canRestoreCharacterAnimationWithoutCanvasSource(
+          normalizedGenerationInputs.action,
+          normalizedGenerationInputs.fields,
+        )
+          ? unavailableReferences.filter(
+              (reference) => reference.id !== 'source',
+            )
+          : unavailableReferences;
       const missingNonReplaceableSourceWarning = normalizedGenerationInputs
         ? getMissingNonReplaceableSourceWarning({
             action: normalizedGenerationInputs.action,
+            fields: normalizedGenerationInputs.fields,
             references: normalizedGenerationInputs.references,
             unavailableReferences,
           })
@@ -1945,7 +1998,7 @@ export function useImageCanvasGenerationWorkflow({
         setActiveTool('select');
         const redrawWarning = getCanvasGenerationRedrawWarning({
           hasParameterFallbacks,
-          unavailableReferenceCount: unavailableReferences.length,
+          unavailableReferenceCount: unresolvedUnavailableReferences.length,
           isNormalizedGenerationInputs,
         });
         if (redrawWarning) {
@@ -1977,7 +2030,7 @@ export function useImageCanvasGenerationWorkflow({
         setActiveTool(getCanvasToolForGenerationMode(sameSourceDraft.mode));
         const redrawWarning = getCanvasGenerationRedrawWarning({
           hasParameterFallbacks,
-          unavailableReferenceCount: unavailableReferences.length,
+          unavailableReferenceCount: unresolvedUnavailableReferences.length,
           isNormalizedGenerationInputs,
         });
         if (redrawWarning) {
@@ -3486,6 +3539,75 @@ export function useImageCanvasGenerationWorkflow({
     ],
   );
 
+  const splitSelectedCharacterAnimationFrames = useCallback(
+    async (sourceLayer: CanvasLayer) => {
+      if (
+        !canSplitCharacterAnimationFrames(sourceLayer) ||
+        !projectId ||
+        splittingCharacterAnimationLayerIdsRef.current.has(sourceLayer.id)
+      ) {
+        return;
+      }
+      splittingCharacterAnimationLayerIdsRef.current.add(sourceLayer.id);
+      setSplittingCharacterAnimationLayerIds((currentLayerIds) => {
+        const nextLayerIds = new Set(currentLayerIds);
+        nextLayerIds.add(sourceLayer.id);
+        return nextLayerIds;
+      });
+      closeGenerationTransientState();
+      setImageContextMenu(null);
+      setMetadataLayer(null);
+      setCropExpandPanel(null);
+      setQuickEditPanel(null);
+      try {
+        const result = await splitEditorCharacterAnimationFrames({
+          projectId,
+          sourceLayerId: sourceLayer.id,
+          sourceResourceId: sourceLayer.resourceId,
+          assetFolderId,
+          assetLabel: sourceLayer.title,
+        });
+        result.assets.forEach((asset) => upsertGeneratedAsset?.(asset));
+        try {
+          await Promise.resolve(refreshAssetLibrary?.());
+        } catch {
+          // 素材已经由服务端原子登记成功；列表刷新失败不能把成功事实伪装成拆帧失败。
+        }
+        setActiveTool('select');
+        setActiveSidebarPanel('assets');
+      } catch (error) {
+        window.alert(
+          error instanceof Error && error.message.trim()
+            ? error.message
+            : '拆分序列帧失败',
+        );
+      } finally {
+        splittingCharacterAnimationLayerIdsRef.current.delete(sourceLayer.id);
+        setSplittingCharacterAnimationLayerIds((currentLayerIds) => {
+          if (!currentLayerIds.has(sourceLayer.id)) {
+            return currentLayerIds;
+          }
+          const nextLayerIds = new Set(currentLayerIds);
+          nextLayerIds.delete(sourceLayer.id);
+          return nextLayerIds;
+        });
+      }
+    },
+    [
+      assetFolderId,
+      closeGenerationTransientState,
+      projectId,
+      refreshAssetLibrary,
+      setActiveSidebarPanel,
+      setActiveTool,
+      setCropExpandPanel,
+      setImageContextMenu,
+      setMetadataLayer,
+      setQuickEditPanel,
+      upsertGeneratedAsset,
+    ],
+  );
+
   const rejectReferenceMutationWhileUploadPending = useCallback(() => {
     if (!hasPendingImageReferenceUploads) {
       return false;
@@ -3552,7 +3674,17 @@ export function useImageCanvasGenerationWorkflow({
         return;
       }
       let rejectedLimit: number | null = null;
+      let rejectedCharacterReference = false;
       setGenerateDialog((currentDialog) => {
+        if (
+          currentDialog?.mode === 'character-animation' &&
+          layer.mediaType !== 'video' &&
+          layer.assetKind !== 'character' &&
+          layer.assetKind !== 'character-animation'
+        ) {
+          rejectedCharacterReference = true;
+          return currentDialog;
+        }
         if (
           currentDialog &&
           currentDialog.mode !== 'video' &&
@@ -3569,6 +3701,10 @@ export function useImageCanvasGenerationWorkflow({
         }
         return appendGenerationReference(currentDialog, layer);
       });
+      if (rejectedCharacterReference) {
+        showGenerationWarning('请选择角色图');
+        return;
+      }
       if (rejectedLimit !== null) {
         showGenerationWarning(`参考图最多允许 ${rejectedLimit} 张`);
         return;
@@ -4535,6 +4671,8 @@ export function useImageCanvasGenerationWorkflow({
       pendingPerfectPixelLayerIds,
       splitSelectedIconSpritesheet,
       splittingIconSpritesheetLayerIds,
+      splitSelectedCharacterAnimationFrames,
+      splittingCharacterAnimationLayerIds,
       taskListRefreshKey,
       refreshTaskList,
       isTaskSidebarOpen,
@@ -4647,6 +4785,8 @@ export function useImageCanvasGenerationWorkflow({
       pendingPerfectPixelLayerIds,
       splitSelectedIconSpritesheet,
       splittingIconSpritesheetLayerIds,
+      splitSelectedCharacterAnimationFrames,
+      splittingCharacterAnimationLayerIds,
       submitCharacterAnimation,
       submitCropExpand,
       submitIconSpritesheetGeneration,
diff --git a/src/components/image-editor/useImageCanvasStageInteractions.test.tsx b/src/components/image-editor/useImageCanvasStageInteractions.test.tsx
index 7d62ce7f7..dd084030f 100644
--- a/src/components/image-editor/useImageCanvasStageInteractions.test.tsx
+++ b/src/components/image-editor/useImageCanvasStageInteractions.test.tsx
@@ -114,6 +114,7 @@ function StageInteractionsHarness({
   pickGenerationReferenceFromLayer = vi.fn(),
   pickIconSpecFromLayer = vi.fn(),
   isPickingGenerationReferenceFromCanvas = false,
+  generationDialogMode = 'generate',
   activateCanvasGenerationDialog = vi.fn(),
   moveViewportFromMinimapPointer = vi.fn(),
   updateViewportFromMinimapDrag = vi.fn(),
@@ -126,6 +127,7 @@ function StageInteractionsHarness({
   pickGenerationReferenceFromLayer?: (layer: CanvasLayer) => void;
   pickIconSpecFromLayer?: (layer: CanvasLayer) => void;
   isPickingGenerationReferenceFromCanvas?: boolean;
+  generationDialogMode?: GenerateDialogState['mode'];
   activateCanvasGenerationDialog?: (
     dialog: CanvasGenerationDialogState,
   ) => void;
@@ -164,7 +166,7 @@ function StageInteractionsHarness({
   const [generateDialog, setGenerateDialog] =
     useState<GenerateDialogState | null>({
       id: 'dialog-1',
-      mode: 'generate',
+      mode: generationDialogMode,
       prompt: '生成',
       status: 'idle',
       composerOpen: true,
@@ -394,6 +396,21 @@ function StageInteractionsHarness({
       <button type="button" onClick={() => setActiveTool('hand')}>
         切抓手
       </button>
+      <button
+        type="button"
+        onClick={(event) =>
+          interaction.handleLayerPointerDown(
+            createPointerEvent(event.currentTarget, {
+              pointerId: 12,
+              clientX: 40,
+              clientY: 40,
+            }),
+            firstLayer,
+          )
+        }
+      >
+        直接选择第一层为生成参考
+      </button>
       <button
         type="button"
         onClick={(event) => {
@@ -806,6 +823,28 @@ function StageInteractionsHarness({
 }
 
 describe('useImageCanvasStageInteractions', () => {
+  it('routes character animation canvas reference picks through the layer pointer path', () => {
+    const pickGenerationReferenceFromLayer = vi.fn();
+    render(
+      <StageInteractionsHarness
+        generationDialogMode="character-animation"
+        isPickingGenerationReferenceFromCanvas
+        pickGenerationReferenceFromLayer={pickGenerationReferenceFromLayer}
+      />,
+    );
+
+    act(() => {
+      screen
+        .getByRole('button', { name: '直接选择第一层为生成参考' })
+        .click();
+    });
+
+    expect(pickGenerationReferenceFromLayer).toHaveBeenCalledTimes(1);
+    expect(pickGenerationReferenceFromLayer).toHaveBeenCalledWith(
+      expect.objectContaining({ id: 'first' }),
+    );
+  });
+
   it('selects and drags multiple layers from stage pointer events', () => {
     const captureCanvasHistory = vi.fn();
     render(
diff --git a/src/components/image-editor/useImageCanvasStageInteractions.ts b/src/components/image-editor/useImageCanvasStageInteractions.ts
index d1cc7fda4..7d26bbdf0 100644
--- a/src/components/image-editor/useImageCanvasStageInteractions.ts
+++ b/src/components/image-editor/useImageCanvasStageInteractions.ts
@@ -327,7 +327,8 @@ export function useImageCanvasStageInteractions({
         (generateDialog?.mode === 'generate' ||
           generateDialog?.mode === 'scene' ||
           generateDialog?.mode === 'video' ||
-          generateDialog?.mode === 'spec')
+          generateDialog?.mode === 'spec' ||
+          generateDialog?.mode === 'character-animation')
       ) {
         focusCanvasInteractionTarget(event.currentTarget);
         event.preventDefault();
diff --git a/src/components/image-editor/useImageCanvasUploadWorkflow.test.tsx b/src/components/image-editor/useImageCanvasUploadWorkflow.test.tsx
index 862cf19a6..1bfc1e227 100644
--- a/src/components/image-editor/useImageCanvasUploadWorkflow.test.tsx
+++ b/src/components/image-editor/useImageCanvasUploadWorkflow.test.tsx
@@ -23,6 +23,7 @@ import type {
 } from './ImageCanvasEditorTypes';
 import {
   type ImageReferenceUploadCapacity,
+  resolveGenerationMediaReferenceUploadCapacity,
   useImageCanvasUploadWorkflow,
 } from './useImageCanvasUploadWorkflow';
 
@@ -136,7 +137,7 @@ function UploadWorkflowHarness({
   openEditorLoginModal = vi.fn(),
   activeTool = 'select',
   projectId = 'project-1',
-  resolveImageReferenceUploadCapacity = () => null,
+  resolveImageReferenceUploadCapacity,
   refreshAssetLibrary,
 }: {
   canAccessProtectedData?: boolean;
@@ -157,6 +158,8 @@ function UploadWorkflowHarness({
     useState<NonNullable<GenerateDialogState['generationReferences']>>([]);
   const [generateDialog, setGenerateDialog] =
     useState<GenerateDialogState | null>(null);
+  const generateDialogRef = useRef(generateDialog);
+  generateDialogRef.current = generateDialog;
   const [, setQuickEditPanel] = useState<QuickEditPanelState | null>(null);
   const [activeSidebarPanel] = useState<SidebarPanel | null>('assets');
   const [selectedLayerId, setSelectedLayerId] = useState<string | null>(null);
@@ -171,6 +174,7 @@ function UploadWorkflowHarness({
     canvasSize: { width: 900, height: 640 },
     viewport: { x: 10, y: 20, scale: 2 },
     activeTool,
+    generateDialog,
     allocateUploadIndex: () => {
       uploadIndexRef.current += 1;
       return uploadIndexRef.current;
@@ -180,7 +184,12 @@ function UploadWorkflowHarness({
     setLayers,
     setGenerateDialog,
     setQuickEditPanel,
-    resolveImageReferenceUploadCapacity,
+    resolveImageReferenceUploadCapacity: (target) =>
+      resolveImageReferenceUploadCapacity?.(target) ??
+      resolveGenerationMediaReferenceUploadCapacity({
+        target,
+        dialog: generateDialogRef.current,
+      }),
     appendUiAssetExtractionReferences: (references) =>
       setUiAssetExtractionReferences((currentReferences) => [
         ...currentReferences,
@@ -349,6 +358,7 @@ function UploadWorkflowHarness({
         type="button"
         onClick={() =>
           setGenerateDialog({
+            id: 'video-dialog',
             mode: 'video',
             prompt: '',
             status: 'failed',
@@ -358,6 +368,20 @@ function UploadWorkflowHarness({
       >
         准备视频生成
       </button>
+      <button
+        type="button"
+        onClick={() =>
+          setGenerateDialog({
+            id: 'character-animation-dialog',
+            mode: 'character-animation',
+            prompt: '',
+            status: 'failed',
+            generationReferences: [],
+          })
+        }
+      >
+        准备Spine序列帧生成
+      </button>
       <button
         type="button"
         onClick={() =>
@@ -409,6 +433,12 @@ function UploadWorkflowHarness({
       >
         请求角色规范上传
       </button>
+      <button
+        type="button"
+        onClick={() => workflow.setUploadTarget('video-reference-image')}
+      >
+        选择视频参考图
+      </button>
       <button
         type="button"
         onClick={() => workflow.setUploadTarget('video-reference-video')}
@@ -1111,7 +1141,7 @@ describe('useImageCanvasUploadWorkflow', () => {
     expect(createEditorProjectResourceMock).not.toHaveBeenCalled();
   });
 
-  it('rechecks capacity after object upload and before creating project resources', async () => {
+  it('rechecks capacity before object upload and project persistence', async () => {
     const alertMock = vi.spyOn(window, 'alert').mockImplementation(() => {});
     let capacityChecks = 0;
     render(
@@ -1143,7 +1173,7 @@ describe('useImageCanvasUploadWorkflow', () => {
         '生成参考图最多允许 5 张，当前已有 0 张，本次最多还能选择 5 张',
       );
     });
-    expect(uploadEditorMediaAssetFileMock).toHaveBeenCalledTimes(6);
+    expect(uploadEditorMediaAssetFileMock).not.toHaveBeenCalled();
     expect(createEditorProjectResourceMock).not.toHaveBeenCalled();
   });
 
@@ -1328,6 +1358,370 @@ describe('useImageCanvasUploadWorkflow', () => {
     expect(createEditorProjectResourceMock).toHaveBeenCalledTimes(1);
   });
 
+  it('resolves per-media capacity and dialog identity for video and character-animation', () => {
+    const videoDialog: GenerateDialogState = {
+      id: 'video-dialog',
+      mode: 'video',
+      prompt: '',
+      status: 'idle',
+      generationReferences: [
+        { id: 'image-1', label: '图片', src: 'image.png' },
+        {
+          id: 'video-1',
+          label: '视频',
+          src: 'video.mp4',
+          mediaType: 'video',
+        },
+        {
+          id: 'audio-1',
+          label: '音频',
+          src: 'audio.mp3',
+          mediaType: 'audio',
+        },
+      ],
+    };
+
+    expect(
+      resolveGenerationMediaReferenceUploadCapacity({
+        target: 'video-reference-image',
+        dialog: videoDialog,
+      }),
+    ).toMatchObject({ currentCount: 1, limit: 9, contextId: 'video-dialog' });
+    expect(
+      resolveGenerationMediaReferenceUploadCapacity({
+        target: 'video-reference-video',
+        dialog: videoDialog,
+      }),
+    ).toMatchObject({ currentCount: 1, limit: 3, contextId: 'video-dialog' });
+    expect(
+      resolveGenerationMediaReferenceUploadCapacity({
+        target: 'video-reference-audio',
+        dialog: videoDialog,
+      }),
+    ).toMatchObject({ currentCount: 1, limit: 3, contextId: 'video-dialog' });
+
+    const characterAnimationDialog: GenerateDialogState = {
+      id: 'character-animation-dialog',
+      mode: 'character-animation',
+      prompt: '',
+      status: 'idle',
+      generationReferences: [videoDialog.generationReferences![1]!],
+    };
+    expect(
+      resolveGenerationMediaReferenceUploadCapacity({
+        target: 'video-reference-image',
+        dialog: characterAnimationDialog,
+      }),
+    ).toMatchObject({
+      currentCount: 0,
+      limit: 1,
+      contextId: 'character-animation-dialog',
+    });
+    expect(
+      resolveGenerationMediaReferenceUploadCapacity({
+        target: 'video-reference-video',
+        dialog: characterAnimationDialog,
+      }),
+    ).toMatchObject({
+      currentCount: 0,
+      limit: 1,
+      contextId: 'character-animation-dialog',
+    });
+    expect(
+      resolveGenerationMediaReferenceUploadCapacity({
+        target: 'video-reference-audio',
+        dialog: characterAnimationDialog,
+      }),
+    ).toBeNull();
+  });
+
+  it('does not persist or apply a video reference after switching from video to character-animation during upload', async () => {
+    const alertMock = vi.spyOn(window, 'alert').mockImplementation(() => {});
+    const uploadGate = createDeferred<{
+      src: string;
+      objectKey: string;
+      assetObjectId: string;
+    }>();
+    uploadEditorSeedanceReferenceFileMock.mockReturnValueOnce(
+      uploadGate.promise,
+    );
+    render(<UploadWorkflowHarness />);
+
+    fireEvent.click(screen.getByRole('button', { name: '准备视频生成' }));
+    fireEvent.click(screen.getByRole('button', { name: '选择参考视频' }));
+    fireEvent.change(screen.getByLabelText('上传图片文件'), {
+      target: {
+        files: [new File(['video'], '切换中的视频.mp4', { type: 'video/mp4' })],
+      },
+    });
+    act(() => {
+      createdMediaElements[0]?.onloadedmetadata?.(new Event('loadedmetadata'));
+    });
+    await waitFor(() => {
+      expect(uploadEditorSeedanceReferenceFileMock).toHaveBeenCalledTimes(1);
+      expect(screen.getByTestId('pending-reference-uploads').textContent).toBe(
+        '1',
+      );
+    });
+
+    fireEvent.click(
+      screen.getByRole('button', { name: '准备Spine序列帧生成' }),
+    );
+    await act(async () => {
+      uploadGate.resolve({
+        src: 'https://signed.example.com/video/switched.mp4',
+        objectKey: 'seedance/video/switched.mp4',
+        assetObjectId: 'assetobj-switched-video',
+      });
+      await uploadGate.promise;
+    });
+
+    await waitFor(() => {
+      expect(alertMock).toHaveBeenCalledWith(
+        '参考图上传目标已关闭或切换，本次结果不会添加到其他面板',
+      );
+      expect(screen.getByTestId('dialog').textContent).toContain(
+        'character-animation:failed:-:0:-:-:0',
+      );
+      expect(screen.getByTestId('pending-reference-uploads').textContent).toBe(
+        '0',
+      );
+    });
+    expect(createEditorProjectResourceMock).not.toHaveBeenCalled();
+    expect(createEditorAssetMock).not.toHaveBeenCalled();
+  });
+
+  it('does not persist or apply an image reference after switching from character-animation to video during upload', async () => {
+    const alertMock = vi.spyOn(window, 'alert').mockImplementation(() => {});
+    const uploadGate = createDeferred<{
+      src: string;
+      legacyPublicPath: string;
+      objectKey: string;
+      assetObjectId: string;
+    }>();
+    uploadEditorMediaAssetFileMock.mockReturnValueOnce(uploadGate.promise);
+    render(<UploadWorkflowHarness />);
+
+    fireEvent.click(
+      screen.getByRole('button', { name: '准备Spine序列帧生成' }),
+    );
+    fireEvent.click(screen.getByRole('button', { name: '选择视频参考图' }));
+    fireEvent.change(screen.getByLabelText('上传图片文件'), {
+      target: { files: [createTestFile('切换中的参考图.png')] },
+    });
+    await waitFor(() => {
+      expect(uploadEditorMediaAssetFileMock).toHaveBeenCalledTimes(1);
+      expect(screen.getByTestId('pending-reference-uploads').textContent).toBe(
+        '1',
+      );
+    });
+
+    fireEvent.click(screen.getByRole('button', { name: '准备视频生成' }));
+    await act(async () => {
+      uploadGate.resolve({
+        src: 'https://signed.example.com/image/switched.png',
+        legacyPublicPath: '/generated/image/switched.png',
+        objectKey: 'asset-library/image/switched.png',
+        assetObjectId: 'assetobj-switched-image',
+      });
+      await uploadGate.promise;
+    });
+
+    await waitFor(() => {
+      expect(alertMock).toHaveBeenCalledWith(
+        '参考图上传目标已关闭或切换，本次结果不会添加到其他面板',
+      );
+      expect(screen.getByTestId('dialog').textContent).toContain(
+        'video:failed:-:0:-:-:0',
+      );
+      expect(screen.getByTestId('pending-reference-uploads').textContent).toBe(
+        '0',
+      );
+    });
+    expect(createEditorProjectResourceMock).not.toHaveBeenCalled();
+    expect(createEditorAssetMock).not.toHaveBeenCalled();
+  });
+
+  it('does not persist or apply an audio reference after switching away from the video dialog during upload', async () => {
+    const alertMock = vi.spyOn(window, 'alert').mockImplementation(() => {});
+    const uploadGate = createDeferred<{
+      src: string;
+      objectKey: string;
+      assetObjectId: string;
+    }>();
+    uploadEditorSeedanceReferenceFileMock.mockReturnValueOnce(
+      uploadGate.promise,
+    );
+    render(<UploadWorkflowHarness />);
+
+    fireEvent.click(screen.getByRole('button', { name: '准备视频生成' }));
+    fireEvent.click(screen.getByRole('button', { name: '选择参考音频' }));
+    fireEvent.change(screen.getByLabelText('上传图片文件'), {
+      target: {
+        files: [
+          new File(['audio'], '切换中的音频.mp3', { type: 'audio/mpeg' }),
+        ],
+      },
+    });
+    act(() => {
+      createdMediaElements[0]?.onloadedmetadata?.(new Event('loadedmetadata'));
+    });
+    await waitFor(() => {
+      expect(uploadEditorSeedanceReferenceFileMock).toHaveBeenCalledTimes(1);
+      expect(screen.getByTestId('pending-reference-uploads').textContent).toBe(
+        '1',
+      );
+    });
+
+    fireEvent.click(
+      screen.getByRole('button', { name: '准备Spine序列帧生成' }),
+    );
+    await act(async () => {
+      uploadGate.resolve({
+        src: 'https://signed.example.com/audio/switched.mp3',
+        objectKey: 'seedance/audio/switched.mp3',
+        assetObjectId: 'assetobj-switched-audio',
+      });
+      await uploadGate.promise;
+    });
+
+    await waitFor(() => {
+      expect(alertMock).toHaveBeenCalledWith(
+        '参考图上传目标已关闭或切换，本次结果不会添加到其他面板',
+      );
+      expect(screen.getByTestId('dialog').textContent).toContain(
+        'character-animation:failed:-:0:-:-:0',
+      );
+      expect(screen.getByTestId('pending-reference-uploads').textContent).toBe(
+        '0',
+      );
+    });
+    expect(createEditorProjectResourceMock).not.toHaveBeenCalled();
+    expect(createEditorAssetMock).not.toHaveBeenCalled();
+  });
+
+  it('uploads and persists only the first selected character-animation image reference', async () => {
+    render(<UploadWorkflowHarness activeTool="select" />);
+
+    fireEvent.click(
+      screen.getByRole('button', { name: '准备Spine序列帧生成' }),
+    );
+    fireEvent.click(screen.getByRole('button', { name: '选择视频参考图' }));
+    fireEvent.change(screen.getByLabelText('上传图片文件'), {
+      target: {
+        files: [
+          createTestFile('序列帧参考一.png'),
+          createTestFile('序列帧参考二.png'),
+        ],
+      },
+    });
+
+    await waitFor(() => {
+      expect(uploadEditorMediaAssetFileMock).toHaveBeenCalledTimes(1);
+      expect(createEditorProjectResourceMock).toHaveBeenCalledTimes(1);
+      expect(screen.getByTestId('dialog').textContent).toContain(
+        'character-animation:idle:-:0:-:-:1:序列帧参考一.png',
+      );
+    });
+    expect(uploadEditorMediaAssetFileMock).toHaveBeenCalledWith(
+      expect.objectContaining({ name: '序列帧参考一.png' }),
+      'image',
+    );
+    expect(createEditorProjectResourceMock).toHaveBeenCalledWith(
+      'project-1',
+      expect.objectContaining({
+        imageSrc:
+          '/generated-character-drafts/editor/asset-library/image/序列帧参考一.png',
+      }),
+    );
+    expect(screen.getByTestId('dialog').textContent).not.toContain(
+      '序列帧参考二.png',
+    );
+  });
+
+  it('probes, uploads, and persists only the first selected character-animation video reference', async () => {
+    render(<UploadWorkflowHarness activeTool="select" />);
+
+    fireEvent.click(
+      screen.getByRole('button', { name: '准备Spine序列帧生成' }),
+    );
+    fireEvent.click(screen.getByRole('button', { name: '选择参考视频' }));
+    const mediaElementStartIndex = createdMediaElements.length;
+    fireEvent.change(screen.getByLabelText('上传图片文件'), {
+      target: {
+        files: [
+          new File(['video'], '序列帧视频一.mp4', { type: 'video/mp4' }),
+          new File(['video'], '序列帧视频二.mp4', { type: 'video/mp4' }),
+        ],
+      },
+    });
+
+    const selectedMediaElements = [
+      ...new Set(createdMediaElements.slice(mediaElementStartIndex)),
+    ];
+    expect(selectedMediaElements).toHaveLength(1);
+    setVideoElementSize(selectedMediaElements[0], 1080, 1920);
+    act(() => {
+      selectedMediaElements[0]?.onloadedmetadata?.(new Event('loadedmetadata'));
+    });
+
+    await waitFor(() => {
+      expect(uploadEditorSeedanceReferenceFileMock).toHaveBeenCalledTimes(1);
+      expect(createEditorProjectResourceMock).toHaveBeenCalledTimes(1);
+      expect(screen.getByTestId('dialog').textContent).toContain(
+        'character-animation:idle:-:0:-:-:1:序列帧视频一.mp4',
+      );
+    });
+    expect(uploadEditorSeedanceReferenceFileMock).toHaveBeenCalledWith(
+      expect.objectContaining({ name: '序列帧视频一.mp4' }),
+      'video',
+    );
+    expect(createEditorProjectResourceMock).toHaveBeenCalledWith(
+      'project-1',
+      expect.objectContaining({ width: 1080, height: 1920 }),
+    );
+    expect(screen.getByTestId('dialog').textContent).not.toContain(
+      '序列帧视频二.mp4',
+    );
+  });
+
+  it('keeps multiple reference video uploads for the video dialog', async () => {
+    render(<UploadWorkflowHarness activeTool="video" />);
+
+    fireEvent.click(screen.getByRole('button', { name: '准备视频生成' }));
+    fireEvent.click(screen.getByRole('button', { name: '选择参考视频' }));
+    const mediaElementStartIndex = createdMediaElements.length;
+    fireEvent.change(screen.getByLabelText('上传图片文件'), {
+      target: {
+        files: [
+          new File(['video'], '普通视频参考一.mp4', { type: 'video/mp4' }),
+          new File(['video'], '普通视频参考二.mp4', { type: 'video/mp4' }),
+        ],
+      },
+    });
+
+    const selectedMediaElements = [
+      ...new Set(createdMediaElements.slice(mediaElementStartIndex)),
+    ];
+    expect(selectedMediaElements).toHaveLength(2);
+    act(() => {
+      selectedMediaElements.forEach((element) => {
+        element.onloadedmetadata?.(new Event('loadedmetadata'));
+      });
+    });
+
+    await waitFor(() => {
+      expect(uploadEditorSeedanceReferenceFileMock).toHaveBeenCalledTimes(2);
+      expect(createEditorProjectResourceMock).toHaveBeenCalledTimes(2);
+      expect(screen.getByTestId('dialog').textContent).toContain(
+        'video:idle:-:0:-:-:2:普通视频参考一.mp4',
+      );
+      expect(screen.getByTestId('dialog').textContent).toContain(
+        '普通视频参考二.mp4',
+      );
+    });
+  });
+
   it('uploads Seedance reference videos through OSS and stores object keys instead of data URLs', async () => {
     render(<UploadWorkflowHarness />);
 
diff --git a/src/components/image-editor/useImageCanvasUploadWorkflow.ts b/src/components/image-editor/useImageCanvasUploadWorkflow.ts
index 65972054d..7a51d2cb7 100644
--- a/src/components/image-editor/useImageCanvasUploadWorkflow.ts
+++ b/src/components/image-editor/useImageCanvasUploadWorkflow.ts
@@ -47,6 +47,7 @@ import {
   resolveEditorAssetUploadMediaType,
   SEEDANCE_REFERENCE_FILE_LIMITS,
 } from './ImageCanvasFileModel';
+import { SEEDANCE_VIDEO_REFERENCE_LIMITS } from './ImageCanvasGenerationModel';
 import {
   applyGenerationReferenceUpload,
   applyMeasuredUploadAssetSize,
@@ -91,6 +92,84 @@ export type ImageReferenceUploadCapacity = {
   contextId?: string;
 };
 
+const GENERATION_MEDIA_REFERENCE_TARGETS = [
+  'video-reference-image',
+  'video-reference-video',
+  'video-reference-audio',
+] as const satisfies readonly UploadTarget[];
+
+type GenerationMediaReferenceTarget =
+  (typeof GENERATION_MEDIA_REFERENCE_TARGETS)[number];
+
+function isGenerationMediaReferenceTarget(
+  target: UploadTarget,
+): target is GenerationMediaReferenceTarget {
+  return GENERATION_MEDIA_REFERENCE_TARGETS.includes(
+    target as GenerationMediaReferenceTarget,
+  );
+}
+
+function countGenerationMediaReferenceFiles(
+  target: GenerationMediaReferenceTarget,
+  files: FileList | File[],
+) {
+  const isSupportedFile =
+    target === 'video-reference-video'
+      ? isSeedanceReferenceVideoFile
+      : target === 'video-reference-audio'
+        ? isSeedanceReferenceAudioFile
+        : isSeedanceReferenceImageFile;
+  return Array.from(files).filter(isSupportedFile).length;
+}
+
+export function resolveGenerationMediaReferenceUploadCapacity({
+  target,
+  dialog,
+}: {
+  target: UploadTarget;
+  dialog: GenerateDialogState | null;
+}): ImageReferenceUploadCapacity | null {
+  if (!isGenerationMediaReferenceTarget(target) || !dialog) {
+    return null;
+  }
+  const mediaType =
+    target === 'video-reference-video'
+      ? 'video'
+      : target === 'video-reference-audio'
+        ? 'audio'
+        : 'image';
+  const contextId =
+    dialog.id ?? `${dialog.mode}:${dialog.sourceLayerId ?? 'draft'}`;
+  if (dialog.mode === 'character-animation') {
+    return mediaType === 'audio'
+      ? null
+      : {
+          label: mediaType === 'video' ? '序列帧参考视频' : '序列帧参考图',
+          // 序列帧是单槽替换语义：已有参考不占用“新上传”容量；pending reservation
+          // 仍保证同一 dialog 同时最多启动一个替换上传。
+          currentCount: 0,
+          limit: 1,
+          contextId,
+        };
+  }
+  if (dialog.mode !== 'video') {
+    return null;
+  }
+  return {
+    label:
+      mediaType === 'video'
+        ? '参考视频'
+        : mediaType === 'audio'
+          ? '参考音频'
+          : '视频参考图',
+    currentCount: (dialog.generationReferences ?? []).filter(
+      (reference) => (reference.mediaType ?? 'image') === mediaType,
+    ).length,
+    limit: SEEDANCE_VIDEO_REFERENCE_LIMITS[mediaType],
+    contextId,
+  };
+}
+
 type ImageReferenceUploadReservation = {
   target: UploadTarget;
   count: number;
@@ -109,6 +188,7 @@ type UseImageCanvasUploadWorkflowOptions = {
   canvasSize: { width: number; height: number };
   viewport: CanvasViewport;
   activeTool: CanvasTool;
+  generateDialog: GenerateDialogState | null;
   allocateUploadIndex: () => number;
   setAssetFolders: Dispatch<SetStateAction<EditorAssetFolder[]>>;
   setAssets: Dispatch<SetStateAction<EditorAsset[]>>;
@@ -144,6 +224,22 @@ function resolveReferenceFallbackSize(mediaType: CanvasMediaType) {
   return { width: 420, height: 315 };
 }
 
+function resolveVideoReferenceUploadFiles({
+  files,
+  target,
+  generateDialog,
+}: {
+  files: FileList | File[];
+  target: UploadTarget;
+  generateDialog: GenerateDialogState | null;
+}) {
+  const selectedFiles = Array.from(files);
+  return generateDialog?.mode === 'character-animation' &&
+    (target === 'video-reference-image' || target === 'video-reference-video')
+    ? selectedFiles.slice(0, 1)
+    : selectedFiles;
+}
+
 export function useImageCanvasUploadWorkflow({
   canAccessProtectedData,
   openEditorLoginModal,
@@ -153,6 +249,7 @@ export function useImageCanvasUploadWorkflow({
   canvasSize,
   viewport,
   activeTool,
+  generateDialog,
   allocateUploadIndex,
   setAssetFolders,
   setAssets,
@@ -206,6 +303,10 @@ export function useImageCanvasUploadWorkflow({
   const reserveImageReferenceUpload = useCallback(
     (target: UploadTarget, count: number) => {
       const capacity = resolveImageReferenceUploadCapacity(target);
+      if (!capacity && isGenerationMediaReferenceTarget(target)) {
+        window.alert('参考媒体上传目标已关闭或切换，请重新选择');
+        return null;
+      }
       const key = `${target}\u0000${capacity?.contextId ?? ''}`;
       const pending = pendingImageReferenceUploadsRef.current[key] ?? 0;
       if (capacity) {
@@ -291,6 +392,8 @@ export function useImageCanvasUploadWorkflow({
       mimeType,
       sizeBytes,
       durationSeconds,
+      mediaWidth,
+      mediaHeight,
       objectKey,
       assetObjectId,
       reservation,
@@ -305,12 +408,20 @@ export function useImageCanvasUploadWorkflow({
       mimeType?: string;
       sizeBytes?: number;
       durationSeconds?: number;
+      mediaWidth?: number;
+      mediaHeight?: number;
       objectKey?: string | null;
       assetObjectId?: string | null;
       reservation?: ImageReferenceUploadReservation;
       authoritativeAssetKind?: CanvasAssetKind;
     }): Promise<CharacterReferenceImage> => {
       const resolvedMediaType = mediaType ?? 'image';
+      if (
+        reservation &&
+        !validateImageReferenceUploadReservation(reservation)
+      ) {
+        throw new ImageReferenceCapacityChangedError();
+      }
       let persistedImageSrc = imageSrc;
       let persistedObjectKey = objectKey;
       let persistedAssetObjectId = assetObjectId;
@@ -325,8 +436,9 @@ export function useImageCanvasUploadWorkflow({
         resolvedMediaType === 'image'
           ? await probeImageFileDimensions(file).catch(() => null)
           : null;
-      const width = imageDimensions?.width ?? fallbackSize.width;
-      const height = imageDimensions?.height ?? fallbackSize.height;
+      const width = mediaWidth ?? imageDimensions?.width ?? fallbackSize.width;
+      const height =
+        mediaHeight ?? imageDimensions?.height ?? fallbackSize.height;
       if (
         reservation &&
         !validateImageReferenceUploadReservation(reservation)
@@ -352,6 +464,12 @@ export function useImageCanvasUploadWorkflow({
           assetKind,
           generationInputs,
         });
+        if (
+          reservation &&
+          !validateImageReferenceUploadReservation(reservation)
+        ) {
+          throw new ImageReferenceCapacityChangedError();
+        }
         return createUploadedGenerationReference({
           idPrefix,
           index,
@@ -362,6 +480,8 @@ export function useImageCanvasUploadWorkflow({
           mimeType,
           sizeBytes,
           durationSeconds,
+          width,
+          height,
           objectKey: persistedObjectKey,
           assetObjectId: persistedAssetObjectId,
           resourceId: resource.resourceId,
@@ -386,6 +506,12 @@ export function useImageCanvasUploadWorkflow({
         assetKind,
         generationInputs,
       });
+      if (
+        reservation &&
+        !validateImageReferenceUploadReservation(reservation)
+      ) {
+        throw new ImageReferenceCapacityChangedError();
+      }
       return createUploadedGenerationReference({
         idPrefix,
         index,
@@ -396,6 +522,8 @@ export function useImageCanvasUploadWorkflow({
         mimeType,
         sizeBytes,
         durationSeconds,
+        width,
+        height,
         objectKey: persistedObjectKey,
         assetObjectId: persistedAssetObjectId,
         sourceAssetId: asset.assetId,
@@ -421,6 +549,8 @@ export function useImageCanvasUploadWorkflow({
         mimeType?: string;
         sizeBytes?: number;
         durationSeconds?: number;
+        mediaWidth?: number;
+        mediaHeight?: number;
         objectKey?: string | null;
         assetObjectId?: string | null;
         authoritativeAssetKind?: CanvasAssetKind;
@@ -867,7 +997,10 @@ export function useImageCanvasUploadWorkflow({
   );
 
   const addVideoReferenceImageFiles = useCallback(
-    async (files: FileList | File[]) => {
+    async (
+      files: FileList | File[],
+      reservation: ImageReferenceUploadReservation,
+    ) => {
       const imageFiles = Array.from(files).filter(isSeedanceReferenceImageFile);
       if (!imageFiles.length) {
         window.alert('请选择 Seedance 支持的图片文件');
@@ -888,6 +1021,9 @@ export function useImageCanvasUploadWorkflow({
           src: await readFileAsDataUrl(file),
         })),
       );
+      if (!validateImageReferenceUploadReservation(reservation)) {
+        return;
+      }
       const persistedReferences = await persistReferenceUploads(
         references.map(({ file, src, index }) => ({
           idPrefix: 'upload-video-reference-image',
@@ -899,23 +1035,39 @@ export function useImageCanvasUploadWorkflow({
           mimeType: file.type || undefined,
           sizeBytes: file.size,
         })),
+        reservation,
       );
-      if (persistedReferences.length === 0) {
+      if (
+        persistedReferences.length === 0 ||
+        !validateImageReferenceUploadReservation(reservation)
+      ) {
         return;
       }
       setGenerateDialog((currentDialog) =>
-        applyGenerationReferenceUpload({
-          dialog: currentDialog,
+        resolveGenerationMediaReferenceUploadCapacity({
           target: 'video-reference-image',
-          references: persistedReferences,
-        }),
+          dialog: currentDialog,
+        })?.contextId === reservation.contextId
+          ? applyGenerationReferenceUpload({
+              dialog: currentDialog,
+              target: 'video-reference-image',
+              references: persistedReferences,
+            })
+          : currentDialog,
       );
     },
-    [persistReferenceUploads, setGenerateDialog],
+    [
+      persistReferenceUploads,
+      setGenerateDialog,
+      validateImageReferenceUploadReservation,
+    ],
   );
 
   const addVideoReferenceVideoFiles = useCallback(
-    async (files: FileList | File[]) => {
+    async (
+      files: FileList | File[],
+      reservation: ImageReferenceUploadReservation,
+    ) => {
       const videoFiles = Array.from(files).filter(isSeedanceReferenceVideoFile);
       if (!videoFiles.length) {
         window.alert('请选择 mp4 或 mov 视频文件');
@@ -931,17 +1083,18 @@ export function useImageCanvasUploadWorkflow({
       }
       const references = await Promise.all(
         videoFiles.map(async (file, index) => {
-          const durationSeconds = await probeMediaDurationSeconds(
-            file,
-            'video',
-          );
+          const metadata = await probeMediaFileMetadata(file, 'video');
           return {
             file,
             index,
-            durationSeconds,
+            durationSeconds: metadata.durationSeconds,
+            dimensions: metadata.dimensions,
           };
         }),
       );
+      if (!validateImageReferenceUploadReservation(reservation)) {
+        return;
+      }
       if (
         references.some(
           ({ durationSeconds }) =>
@@ -972,29 +1125,44 @@ export function useImageCanvasUploadWorkflow({
         file: File;
         index: number;
         durationSeconds: number;
+        dimensions: { width: number; height: number } | null;
         src: string;
         objectKey: string;
         assetObjectId: string;
       }>;
       try {
         uploadedReferences = await Promise.all(
-          references.map(async ({ file, index, durationSeconds }) => {
-            const uploaded = await uploadEditorSeedanceReferenceFile(
-              file,
-              'video',
-            );
-            return {
-              file,
-              index,
-              durationSeconds,
-              src: uploaded.src,
-              objectKey: uploaded.objectKey,
-              assetObjectId: uploaded.assetObjectId,
-            };
-          }),
+          references.map(
+            async ({ file, index, durationSeconds, dimensions }) => {
+              if (!validateImageReferenceUploadReservation(reservation)) {
+                throw new ImageReferenceCapacityChangedError();
+              }
+              const uploaded = await uploadEditorSeedanceReferenceFile(
+                file,
+                'video',
+              );
+              if (!validateImageReferenceUploadReservation(reservation)) {
+                throw new ImageReferenceCapacityChangedError();
+              }
+              return {
+                file,
+                index,
+                durationSeconds,
+                dimensions,
+                src: uploaded.src,
+                objectKey: uploaded.objectKey,
+                assetObjectId: uploaded.assetObjectId,
+              };
+            },
+          ),
         );
-      } catch {
-        window.alert('参考视频上传失败，请稍后重试');
+      } catch (error) {
+        if (!(error instanceof ImageReferenceCapacityChangedError)) {
+          window.alert('参考视频上传失败，请稍后重试');
+        }
+        return;
+      }
+      if (!validateImageReferenceUploadReservation(reservation)) {
         return;
       }
       const persistedReferences = await persistReferenceUploads(
@@ -1004,6 +1172,7 @@ export function useImageCanvasUploadWorkflow({
             src,
             index,
             durationSeconds,
+            dimensions,
             objectKey,
             assetObjectId,
           }) => ({
@@ -1016,27 +1185,45 @@ export function useImageCanvasUploadWorkflow({
             mimeType: file.type || undefined,
             sizeBytes: file.size,
             durationSeconds,
+            mediaWidth: dimensions?.width,
+            mediaHeight: dimensions?.height,
             objectKey,
             assetObjectId,
           }),
         ),
+        reservation,
       );
-      if (persistedReferences.length === 0) {
+      if (
+        persistedReferences.length === 0 ||
+        !validateImageReferenceUploadReservation(reservation)
+      ) {
         return;
       }
       setGenerateDialog((currentDialog) =>
-        applyGenerationReferenceUpload({
-          dialog: currentDialog,
+        resolveGenerationMediaReferenceUploadCapacity({
           target: 'video-reference-video',
-          references: persistedReferences,
-        }),
+          dialog: currentDialog,
+        })?.contextId === reservation.contextId
+          ? applyGenerationReferenceUpload({
+              dialog: currentDialog,
+              target: 'video-reference-video',
+              references: persistedReferences,
+            })
+          : currentDialog,
       );
     },
-    [persistReferenceUploads, setGenerateDialog],
+    [
+      persistReferenceUploads,
+      setGenerateDialog,
+      validateImageReferenceUploadReservation,
+    ],
   );
 
   const addVideoReferenceAudioFiles = useCallback(
-    async (files: FileList | File[]) => {
+    async (
+      files: FileList | File[],
+      reservation: ImageReferenceUploadReservation,
+    ) => {
       const audioFiles = Array.from(files).filter(isSeedanceReferenceAudioFile);
       if (!audioFiles.length) {
         window.alert('请选择 wav 或 mp3 音频文件');
@@ -1063,6 +1250,9 @@ export function useImageCanvasUploadWorkflow({
           };
         }),
       );
+      if (!validateImageReferenceUploadReservation(reservation)) {
+        return;
+      }
       if (
         references.some(
           ({ durationSeconds }) =>
@@ -1100,10 +1290,16 @@ export function useImageCanvasUploadWorkflow({
       try {
         uploadedReferences = await Promise.all(
           references.map(async ({ file, index, durationSeconds }) => {
+            if (!validateImageReferenceUploadReservation(reservation)) {
+              throw new ImageReferenceCapacityChangedError();
+            }
             const uploaded = await uploadEditorSeedanceReferenceFile(
               file,
               'audio',
             );
+            if (!validateImageReferenceUploadReservation(reservation)) {
+              throw new ImageReferenceCapacityChangedError();
+            }
             return {
               file,
               index,
@@ -1114,8 +1310,13 @@ export function useImageCanvasUploadWorkflow({
             };
           }),
         );
-      } catch {
-        window.alert('参考音频上传失败，请稍后重试');
+      } catch (error) {
+        if (!(error instanceof ImageReferenceCapacityChangedError)) {
+          window.alert('参考音频上传失败，请稍后重试');
+        }
+        return;
+      }
+      if (!validateImageReferenceUploadReservation(reservation)) {
         return;
       }
       const persistedReferences = await persistReferenceUploads(
@@ -1141,19 +1342,32 @@ export function useImageCanvasUploadWorkflow({
             assetObjectId,
           }),
         ),
+        reservation,
       );
-      if (persistedReferences.length === 0) {
+      if (
+        persistedReferences.length === 0 ||
+        !validateImageReferenceUploadReservation(reservation)
+      ) {
         return;
       }
       setGenerateDialog((currentDialog) =>
-        applyGenerationReferenceUpload({
-          dialog: currentDialog,
+        resolveGenerationMediaReferenceUploadCapacity({
           target: 'video-reference-audio',
-          references: persistedReferences,
-        }),
+          dialog: currentDialog,
+        })?.contextId === reservation.contextId
+          ? applyGenerationReferenceUpload({
+              dialog: currentDialog,
+              target: 'video-reference-audio',
+              references: persistedReferences,
+            })
+          : currentDialog,
       );
     },
-    [persistReferenceUploads, setGenerateDialog],
+    [
+      persistReferenceUploads,
+      setGenerateDialog,
+      validateImageReferenceUploadReservation,
+    ],
   );
 
   const addIconSpecReferenceFiles = useCallback(
@@ -1547,6 +1761,27 @@ export function useImageCanvasUploadWorkflow({
     [openEditorLoginModal, openUploadPicker],
   );
 
+  const startGenerationMediaReferenceUpload = useCallback(
+    (
+      target: GenerationMediaReferenceTarget,
+      files: FileList | File[],
+      upload: (
+        selectedFiles: FileList | File[],
+        reservation: ImageReferenceUploadReservation,
+      ) => Promise<void>,
+    ) => {
+      const reservation = reserveImageReferenceUpload(
+        target,
+        countGenerationMediaReferenceFiles(target, files),
+      );
+      if (!reservation) {
+        return;
+      }
+      void upload(files, reservation).finally(reservation.release);
+    },
+    [reserveImageReferenceUpload],
+  );
+
   const handleUploadInputChange = useCallback(
     (event: ChangeEvent<HTMLInputElement>) => {
       const files = event.currentTarget.files;
@@ -1563,11 +1798,31 @@ export function useImageCanvasUploadWorkflow({
         } else if (currentUploadTarget === 'publication-reference') {
           void addPublicationReferenceFiles(files);
         } else if (currentUploadTarget === 'video-reference-image') {
-          void addVideoReferenceImageFiles(files);
+          startGenerationMediaReferenceUpload(
+            currentUploadTarget,
+            resolveVideoReferenceUploadFiles({
+              files,
+              target: currentUploadTarget,
+              generateDialog,
+            }),
+            addVideoReferenceImageFiles,
+          );
         } else if (currentUploadTarget === 'video-reference-video') {
-          void addVideoReferenceVideoFiles(files);
+          startGenerationMediaReferenceUpload(
+            currentUploadTarget,
+            resolveVideoReferenceUploadFiles({
+              files,
+              target: currentUploadTarget,
+              generateDialog,
+            }),
+            addVideoReferenceVideoFiles,
+          );
         } else if (currentUploadTarget === 'video-reference-audio') {
-          void addVideoReferenceAudioFiles(files);
+          startGenerationMediaReferenceUpload(
+            currentUploadTarget,
+            files,
+            addVideoReferenceAudioFiles,
+          );
         } else if (currentUploadTarget === 'character-spec') {
           void addCharacterSpecReferenceFiles(files);
         } else if (currentUploadTarget === 'character-reference') {
@@ -1590,6 +1845,7 @@ export function useImageCanvasUploadWorkflow({
     },
     [
       activeTool,
+      generateDialog,
       addCharacterReferenceFiles,
       addCharacterSpecReferenceFiles,
       addGenerationReferenceFiles,
@@ -1604,6 +1860,7 @@ export function useImageCanvasUploadWorkflow({
       addUiDesignSpecReferenceFiles,
       addUploadedFiles,
       setUploadTarget,
+      startGenerationMediaReferenceUpload,
     ],
   );
 
diff --git a/src/index.css b/src/index.css
index c0daebe10..1bb7bdece 100644
--- a/src/index.css
+++ b/src/index.css
@@ -6690,8 +6690,10 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
   bottom: 0.85rem;
   z-index: 18;
   display: inline-flex;
+  width: max-content;
+  min-width: 0;
+  max-width: calc(100% - 1.5rem);
   gap: 0.35rem;
-  max-width: min(calc(100% - 6.6rem), 34rem);
   overflow-x: auto;
   border: 1px solid var(--image-canvas-brand-border-soft);
   border-radius: 0.5rem;
@@ -6699,6 +6701,11 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
   padding: 0.35rem;
   box-shadow: 0 18px 38px rgba(15, 23, 42, 0.16);
   transform: translateX(-50%);
+  scrollbar-width: none;
+}
+
+.image-canvas-editor__bottom-toolbar::-webkit-scrollbar {
+  display: none;
 }
 
 .image-canvas-editor__bottom-toolbar--guided {
@@ -6708,6 +6715,24 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
     0 0 0 3px rgba(255, 79, 79, 0.24);
 }
 
+.image-canvas-editor__sequence-animation-icon {
+  stroke: currentColor;
+  stroke-width: 1.65;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+.image-canvas-editor__sequence-animation-entry
+  .image-canvas-editor__sequence-animation-icon {
+  width: 1.15rem;
+  height: 1.15rem;
+}
+
+.image-canvas-editor__sequence-animation-icon-play {
+  fill: currentColor;
+  stroke: none;
+}
+
 .image-canvas-editor__toolbar-guide {
   position: absolute;
   left: 50%;
@@ -6811,7 +6836,9 @@ html[data-mobile-keyboard-open='true'] .platform-mobile-bottom-dock {
 .image-canvas-editor__generation-composer--character-animation {
   grid-template-columns: minmax(0, 1fr);
   grid-template-rows: auto auto auto auto auto;
-  width: min(42rem, calc(100% - 1.5rem));
+  width: min(30rem, calc(100% - 1.5rem));
+  gap: 0.72rem;
+  padding: 1rem 1rem 0.78rem;
 }
 
 .image-canvas-editor__generation-ref {
@@ -8773,7 +8800,7 @@ button.image-canvas-editor__reference-chip:disabled {
 
 .image-canvas-editor__character-animation-textarea {
   grid-column: 1 / -1;
-  --auto-grow-editor-min-height: 8rem;
+  --auto-grow-editor-min-height: 4rem;
   --auto-grow-editor-max-height: 16rem;
 }
 
@@ -8781,34 +8808,269 @@ button.image-canvas-editor__reference-chip:disabled {
   display: flex;
   grid-column: 1 / -1;
   flex-wrap: wrap;
-  gap: 0.38rem;
+  gap: 0.48rem;
 }
 
 .image-canvas-editor__character-animation-preset {
-  border: 1px solid rgba(148, 163, 184, 0.28);
-  border-radius: 999px;
-  background: #f8fafc;
-  padding: 0.34rem 0.58rem;
+  display: inline-flex;
+  min-height: 2.2rem;
+  align-items: center;
+  justify-content: center;
+  border: 1px solid rgba(148, 163, 184, 0.24);
+  border-radius: 0.62rem;
+  background: #f1f2f3;
+  padding: 0.34rem 0.42rem;
   color: #334155;
-  font-size: 0.78rem;
+  font-size: 0.76rem;
+  font-weight: 760;
+  line-height: 1;
+  white-space: nowrap;
+  cursor: pointer;
+  transition:
+    transform 150ms ease,
+    border-color 150ms ease,
+    background-color 150ms ease,
+    color 150ms ease,
+    box-shadow 150ms ease;
+}
+
+.image-canvas-editor__character-animation-preset:hover:not(:disabled) {
+  border-color: rgba(100, 116, 139, 0.5);
+  background: #e8eaec;
+  color: #1f2937;
+}
+
+.image-canvas-editor__character-animation-preset[aria-pressed='true'] {
+  border-color: #334155;
+  background: #ffffff;
+  color: #111827;
+  box-shadow:
+    0 0 0 1px rgba(236, 151, 73, 0.12),
+    0 4px 12px rgba(177, 91, 35, 0.11);
+}
+
+.image-canvas-editor__character-animation-preset:focus-visible {
+  outline: 2px solid rgba(236, 151, 73, 0.72);
+  outline-offset: 2px;
+}
+
+.image-canvas-editor__character-animation-preset:disabled {
+  opacity: 0.48;
+  cursor: not-allowed;
+}
+
+.image-canvas-editor__character-animation-preset--action {
+  width: 100%;
+  border-radius: 0.62rem;
+}
+
+.image-canvas-editor__character-animation-backgrounds {
+  display: flex;
+  grid-column: 1 / -1;
+  flex-wrap: wrap;
+  gap: 0.48rem;
+}
+
+.image-canvas-editor__character-animation-color-button {
+  min-width: 3.1rem;
+  min-height: 2.2rem;
+  border: 1px solid transparent;
+  border-radius: 0.72rem;
+  padding: 0 0.72rem;
+  font-size: 0.76rem;
+  font-weight: 780;
+  cursor: pointer;
+  transition:
+    transform 150ms ease,
+    border-color 150ms ease,
+    box-shadow 150ms ease;
+}
+
+.image-canvas-editor__character-animation-color-button--white {
+  border-color: rgba(148, 163, 184, 0.35);
+  background: #ffffff;
+  color: #475569;
+}
+
+.image-canvas-editor__character-animation-color-button--green {
+  background: #58ad00;
+  color: #ffffff;
+}
+
+.image-canvas-editor__character-animation-color-button--blue {
+  background: #111fd0;
+  color: #ffffff;
+}
+
+.image-canvas-editor__character-animation-color-button--purple {
+  background: #5c00a8;
+  color: #ffffff;
+}
+
+.image-canvas-editor__character-animation-color-button:hover:not(:disabled) {
+  transform: translateY(-1px);
+}
+
+.image-canvas-editor__character-animation-color-button[aria-pressed='true'] {
+  border-color: #111827;
+  box-shadow:
+    0 0 0 2px #ffffff,
+    0 0 0 4px rgba(17, 24, 39, 0.78);
+}
+
+.image-canvas-editor__character-animation-color-button:focus-visible,
+.image-canvas-editor__character-animation-ratio-choice:focus-visible,
+.image-canvas-editor__character-animation-menu-pill:focus-visible {
+  outline: 2px solid var(--image-canvas-brand-accent);
+  outline-offset: 2px;
+}
+
+.image-canvas-editor__character-animation-color-button:disabled {
+  cursor: not-allowed;
+  opacity: 0.48;
 }
 
 .image-canvas-editor__character-animation-footer {
-  display: grid;
+  display: flex;
   grid-column: 1 / -1;
-  grid-template-columns: auto minmax(0, 1fr) auto;
   align-items: center;
-  gap: 0.46rem;
+  justify-content: space-between;
+  gap: 0.5rem;
+  padding-top: 0.04rem;
+}
+
+.image-canvas-editor__character-animation-parameter-trigger {
+  min-width: 0;
+  min-height: 2.25rem;
+  justify-content: flex-start;
+  border-color: transparent;
+  background: transparent;
+  padding: 0 0.24rem;
+  color: #475569;
+  font-size: 0.78rem;
+  font-weight: 780;
+}
+
+.image-canvas-editor__character-animation-parameter-trigger:hover:not(
+    :disabled
+  ),
+.image-canvas-editor__character-animation-parameter-trigger[aria-expanded='true'] {
+  border-color: transparent;
+  background: #f1f5f9;
+  color: #111827;
+}
+
+.image-canvas-editor__character-animation-parameter-menu {
+  display: grid;
+  width: 22rem;
+  max-width: calc(100vw - 1.5rem);
+  gap: 1rem;
+  overflow: visible;
+  border: 1px solid rgba(15, 23, 42, 0.1);
+  border-radius: 1.05rem;
+  background: #ffffff;
+  padding: 0.92rem;
+  color: #111827;
+  box-shadow: 0 22px 56px rgba(15, 23, 42, 0.16);
+}
+
+.image-canvas-editor__character-animation-menu-section {
+  display: grid;
+  gap: 0.5rem;
+}
+
+.image-canvas-editor__character-animation-menu-title {
+  color: #374151;
+  font-size: 0.82rem;
+  font-weight: 820;
+}
+
+.image-canvas-editor__character-animation-ratio-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 0.5rem;
+}
+
+.image-canvas-editor__character-animation-ratio-choice {
+  display: grid;
+  min-width: 0;
+  min-height: 4.1rem;
+  place-items: center;
+  align-content: center;
+  gap: 0.38rem;
+  border: 1px solid #e5e7eb;
+  border-radius: 0.85rem;
+  background: #ffffff;
+  color: #1f2937;
+  font-size: 0.8rem;
+  font-weight: 780;
+  cursor: pointer;
+}
+
+.image-canvas-editor__character-animation-ratio-choice:hover:not(:disabled) {
+  border-color: #9ca3af;
+  background: #f8fafc;
+}
+
+.image-canvas-editor__character-animation-ratio-choice[aria-pressed='true'] {
+  border-color: #334155;
+  box-shadow: inset 0 0 0 1px #334155;
+}
+
+.image-canvas-editor__character-animation-ratio-choice
+  .image-canvas-editor__ratio-wireframe[data-ratio='same'] {
+  width: 1.74rem;
+  height: 1.16rem;
+}
+
+.image-canvas-editor__character-animation-menu-options {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.42rem;
+}
+
+.image-canvas-editor__character-animation-menu-pill {
+  min-height: 2.05rem;
+  border: 1px solid #e5e7eb;
+  border-radius: 999px;
+  background: #ffffff;
+  padding: 0 0.78rem;
+  color: #374151;
+  font-size: 0.8rem;
+  font-weight: 780;
+  cursor: pointer;
+}
+
+.image-canvas-editor__character-animation-menu-pill:hover:not(:disabled) {
+  border-color: #9ca3af;
+  background: #f8fafc;
+}
+
+.image-canvas-editor__character-animation-menu-pill[aria-pressed='true'] {
+  border-color: #334155;
+  box-shadow: inset 0 0 0 1px #334155;
+  color: #111827;
+}
+
+.image-canvas-editor__character-animation-ratio-choice:disabled,
+.image-canvas-editor__character-animation-menu-pill:disabled {
+  cursor: not-allowed;
+  opacity: 0.48;
 }
 
 .image-canvas-editor__character-animation-submit {
-  grid-column: 3;
-  min-width: 5.45rem;
+  min-width: 6.6rem;
   height: 2.25rem;
   gap: 0.4rem;
   border: 0;
   background: var(--image-canvas-brand-fill);
   color: var(--image-canvas-brand-text-on-fill);
+  box-shadow: 0 5px 14px rgba(213, 106, 42, 0.2);
+}
+
+.image-canvas-editor__character-animation-submit:hover:not(:disabled) {
+  background: var(--image-canvas-brand-accent);
+  color: var(--image-canvas-brand-text-on-fill);
 }
 
 .image-canvas-editor__snap-guide {
@@ -9038,6 +9300,14 @@ button.image-canvas-editor__reference-chip:disabled {
     overflow-y: hidden;
   }
 
+  .image-canvas-editor__character-animation-footer {
+    align-items: stretch;
+  }
+
+  .image-canvas-editor__character-animation-presets {
+    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+  }
+
   .image-canvas-editor__quick-edit-panel,
   .image-canvas-editor__character-animation-panel {
     position: fixed;
@@ -9254,6 +9524,7 @@ button.image-canvas-editor__reference-chip:disabled {
   .image-canvas-editor__bottom-toolbar {
     left: 0.75rem;
     right: 0.75rem;
+    width: auto;
     max-width: none;
     transform: none;
   }
diff --git a/src/services/image-editor/editorProjectClient.ts b/src/services/image-editor/editorProjectClient.ts
index e62a39ed3..7e003f11f 100644
--- a/src/services/image-editor/editorProjectClient.ts
+++ b/src/services/image-editor/editorProjectClient.ts
@@ -8,6 +8,10 @@ import {
   type SoundEffectPromptOptimizeRequest,
   type SoundEffectPromptOptimizeResponse,
 } from '../../../packages/shared/src/contracts/editorAudio';
+import type {
+  EditorCharacterAnimationFrameSplitInput as SharedEditorCharacterAnimationFrameSplitInput,
+  EditorCharacterAnimationFrameSplitResult as SharedEditorCharacterAnimationFrameSplitResult,
+} from '../../../packages/shared/src/contracts/editorCharacterAnimation';
 import type { EditorSceneGenerationRequest } from '../../../packages/shared/src/contracts/editorScene';
 import type { ExternalGenerationJobStatusRecord } from '../../../packages/shared/src/contracts/externalGeneration';
 import { requestJson } from '../apiClient';
@@ -41,6 +45,8 @@ const EDITOR_UI_DESIGN_ASSET_EXTRACTION_API =
   '/api/editor/ui-designs/assets/extractions';
 const EDITOR_CHARACTER_ANIMATION_GENERATION_API =
   '/api/editor/character-animations/generations';
+const EDITOR_CHARACTER_ANIMATION_FRAME_SPLIT_API =
+  '/api/editor/character-animations/frame-splits';
 const EDITOR_VIDEO_GENERATION_API = '/api/editor/videos/generations';
 const EDITOR_SOUND_EFFECT_GENERATION_API =
   '/api/editor/audios/sound-effects/generations';
@@ -527,6 +533,14 @@ export type EditorIconSpritesheetSliceResult = {
 
 export type EditorCharacterAnimationResolution = '480p' | '720p';
 
+export type EditorCharacterAnimationInputMode = 'text' | 'image' | 'video';
+
+export type EditorCharacterAnimationBackgroundColor =
+  | 'white'
+  | 'green'
+  | 'blue'
+  | 'purple';
+
 export type EditorCharacterAnimationRatio =
   'same' | '1:1' | '4:3' | '16:9' | '9:16' | '3:4';
 
@@ -535,11 +549,15 @@ export type EditorCharacterAnimationFrameCount = 32 | 40 | 48;
 export type EditorCharacterAnimationDurationSeconds = 4 | 5 | 6;
 
 export type EditorCharacterAnimationGenerationInput = {
-  sourceLayerId: string;
-  sourceImageSrc: string;
-  sourceWidth: number;
-  sourceHeight: number;
+  inputMode?: EditorCharacterAnimationInputMode;
+  sourceLayerId?: string;
+  sourceImageSrc?: string;
+  sourceWidth?: number;
+  sourceHeight?: number;
+  referenceMediaType?: 'image' | 'video';
+  referenceSrc?: string;
   promptText: string;
+  backgroundColor?: EditorCharacterAnimationBackgroundColor;
   /** 纯色抠像背景色（hex 或 'auto'），继承生图的背景色选项行为。 */
   screenColor?: string;
   resolution: EditorCharacterAnimationResolution;
@@ -579,6 +597,12 @@ export type EditorCharacterAnimationGenerationResult = {
   queueState?: ExternalGenerationJobStatusRecord | null;
 };
 
+export type EditorCharacterAnimationFrameSplitInput =
+  SharedEditorCharacterAnimationFrameSplitInput;
+
+export type EditorCharacterAnimationFrameSplitResult =
+  SharedEditorCharacterAnimationFrameSplitResult<EditorAssetSnapshot>;
+
 export type EditorVideoModel =
   | 'seedance2.0'
   | 'seedance2.0-fast'
@@ -1472,7 +1496,12 @@ export async function snapEditorImageToPixelArt(
 export async function generateEditorCharacterAnimation(
   input: EditorCharacterAnimationGenerationInput,
 ) {
-  assertStableEditorMediaReference(input.sourceImageSrc, '角色动画源图');
+  if (input.referenceSrc) {
+    assertStableEditorMediaReference(input.referenceSrc, '序列帧参考素材');
+  }
+  if (input.sourceImageSrc) {
+    assertStableEditorMediaReference(input.sourceImageSrc, '角色动画源图');
+  }
   return requestJson<EditorCharacterAnimationGenerationResult>(
     EDITOR_CHARACTER_ANIMATION_GENERATION_API,
     jsonRequest('POST', {
@@ -1496,6 +1525,17 @@ export async function generateEditorCharacterAnimation(
   );
 }
 
+export async function splitEditorCharacterAnimationFrames(
+  input: EditorCharacterAnimationFrameSplitInput,
+) {
+  return requestJson<EditorCharacterAnimationFrameSplitResult>(
+    EDITOR_CHARACTER_ANIMATION_FRAME_SPLIT_API,
+    jsonRequest('POST', input),
+    '拆分序列帧失败',
+    { timeoutMs: 120_000 },
+  );
+}
+
 export async function generateEditorVideo(input: EditorVideoGenerationInput) {
   assertStableEditorVideoReferences(input);
   return requestJson<EditorVideoGenerationResponse>(