diff --git a/AGENTS.md b/AGENTS.md
index 653626033..5699de822 100644
--- a/AGENTS.md
+++ b/AGENTS.md
@@ -4,12 +4,12 @@
 - 本仓库的团队级项目记忆位于 [`docs/project-memory/`](docs/project-memory/)，用于在 3 名开发人员和各自本地 Agent 之间同步长期项目知识。
 - [`.hermes/`](.hermes/) 只保存 Hermes 专用的仓库级工具资源，例如 skills、plugins 和启用说明，不作为项目知识库。
 - 开始复杂开发任务前，除阅读本文件外，还应优先读取：
-  - [`.hermes/README.md`](.hermes/README.md)
   - [`docs/project-memory/README.md`](docs/project-memory/README.md)
   - [`docs/project-memory/shared-memory/project-overview.md`](docs/project-memory/shared-memory/project-overview.md)
   - [`docs/project-memory/shared-memory/team-conventions.md`](docs/project-memory/shared-memory/team-conventions.md)
   - [`docs/project-memory/shared-memory/development-workflow.md`](docs/project-memory/shared-memory/development-workflow.md)
   - 与任务相关的 [`docs/project-memory/shared-memory/decision-log.md`](docs/project-memory/shared-memory/decision-log.md) 和 [`docs/project-memory/shared-memory/pitfalls.md`](docs/project-memory/shared-memory/pitfalls.md)
+- 仅在需要使用仓库级 Hermes skills/plugins 时，再读取 [`.hermes/README.md`](.hermes/README.md)；长期项目记忆不要从 `.hermes/` 读取。
 - 如果本次任务产生长期有效的架构约定、接口变化、排障经验、开发流程或协作规则，应同步更新 `docs/project-memory/shared-memory/` 中对应文件。
 - 禁止提交个人 `~/.hermes` 配置、`.env`、API Key、Token、会话记录、认证文件和本地私密路径。
 - 若 `docs/project-memory/shared-memory/` 与当前代码或 `docs/` 最新文档冲突，以代码和最新 `docs/` 为准，并同步修正过期共享记忆。
diff --git a/docs/【编辑器】宣发素材工具演示入口设计-2026-06-17.md b/docs/【编辑器】宣发素材工具演示入口设计-2026-06-17.md
new file mode 100644
index 000000000..3b9088964
--- /dev/null
+++ b/docs/【编辑器】宣发素材工具演示入口设计-2026-06-17.md
@@ -0,0 +1,77 @@
+# 宣发素材工具入口设计
+
+## 目标
+
+在 Web 图片画布编辑器底部工具栏新增 `宣发素材` 分组入口，用于生成游戏发布物料。点击具体工作流后，不打开说明弹窗，而是在画布内创建一个可拖拽的宣发素材生成卡片；卡片包含游戏名、游戏分类、一句话描述游戏三个输入框、参考图控件、尺寸信息和生成按钮。点击生成后走图片画布现有生图 BFF，自动扣 5 泥点，生成成功后把成品图片放回画布。
+
+Prompt 输入摘要与 Prompt 约束只作为内部生成契约维护，不在 UI 中默认暴露；真实生图请求会把结构化游戏输入和对应工作流约束合并为内部 Prompt。
+
+三个工作流的输入框默认提示统一为：游戏名 `马戏团午夜惊魂`，游戏分类 `非对称对抗`，一句话描述游戏 `神奇数字马戏团里，帕姆尼失控了，找到钥匙，开门逃离马戏团，千万别被抓住了`。提示只作为占位文案，用户未填写时不进入生图 Prompt。
+
+## 入口
+
+- 页面：`/editor/canvas`
+- 位置：底部 AI 画布工具栏
+- 工具：`宣发素材`
+- 交互：点击工具后弹出独立浮层菜单，菜单项包括 `游戏首图`、`详情五图`、`运营海报`；点击菜单项后在画布中心创建对应工作流的生成占位卡片，卡片可拖拽，设置面板锚定在占位卡片下方。
+- 标题：画布占位卡片左上角使用英文功能名，例如 `Home Image Generator`、`Detail Gallery Generator`、`Promo Poster Generator`，与其它生成卡片保持一致。
+
+## 三条独立工作流
+
+1. `publication-cover-image`
+   - 名称：游戏首图
+   - 输出：单张主视觉
+   - 尺寸：`720 x 540`
+   - 适用：推荐流、作品卡和首屏传播位
+
+2. `publication-detail-gallery`
+   - 名称：详情五图
+   - 输出：单张详情图；需要五图时由用户连续生成五次，保持同一参考摘要和输入信息
+   - 尺寸：`720 x 1280`，`9:16` 竖版
+   - 适用：作品详情、应用介绍和运营分发图组
+
+3. `publication-promo-poster`
+   - 名称：运营海报
+   - 输出：单张活动海报
+   - 尺寸：`1280 x 720`，`16:9` 横版
+   - 版式：右下角保留白色二维码留白方块，并在方块内部上方加入黑色小字提示“此处换上你的游戏二维码”
+   - 适用：社群、活动、渠道投放和运营节日位
+
+## 职责边界
+
+本功能边界只负责图片编辑器里的宣发素材生成：
+
+- 可以维护：工作流框架、Prompt 约束、参考图解析约束、图片后处理验收约束。
+- 已落地：画布内生成占位卡片、游戏名 / 游戏分类 / 一句话描述游戏结构化输入、参考图上传 / 从画布选择、尺寸标识、真实生图、5 泥点扣费、成品回画布。
+- 详情五图：当前 UI 只有一个生成卡片，一次生成 1 张 `720 x 1280` 竖版详情图，单次扣 5 泥点；需要五图时连续生成并复用同一游戏输入和参考图。
+- 不在 UI 暴露：Prompt 输入摘要、Prompt 约束预览、内部提示词拼接过程。
+- 暂不实现：作品发布状态、审核、分享渠道、远程 Genarrative 接口、作品架或广场能力。
+- 不修改：SpacetimeDB schema、前端发布页、作品发布系统。
+
+## 生成与计费
+
+- 前端生成请求统一通过 `/api/editor/images/generations`。
+- 宣发素材请求携带 `kind: publication-material`，后端仅对这个 kind 扣 5 泥点。
+- `publication-detail-gallery` 不再携带 `candidateCount: 5`；后端仍兼容多候选请求，但当前宣发素材入口不主动批量生成。
+- 尺寸请求必须使用明确像素值：游戏首图 `720x540`、详情图 `720x1280`、运营海报 `1280x720`。VectorEngine 适配层对明确像素值保持原样透传；只有 `16:9`、`9:16`、`2k` 等比例 / 档位别名才走 provider 预设映射。
+- 参考图在提交 `/api/editor/images/generations` 前由前端压缩成适合生成理解的图片 Data URL，避免原图 Data URL 撑爆 JSON 请求体；后端该路由保留 `12MB` body limit 作为兼容兜底。
+- 扣费通过现有钱包资产操作封装执行；上游生成失败或未返回图片时按现有补偿逻辑退款。
+- 生成成功后，成品作为图片画布生成图层加入画布，并保留游戏输入和参考图摘要供图层信息使用。
+
+## 代码位置
+
+- 工具入口：`src/components/image-editor/ImageCanvasBottomToolbarView.tsx`
+- 菜单和生成卡片挂载：`src/components/image-editor/ImageCanvasGenerationComposerView.tsx`
+- 工作流状态：`src/components/image-editor/useImageCanvasGenerationWorkflow.ts`
+- 工作流内容模型：`src/components/image-editor/ImageCanvasPublicationMaterialsModel.ts`
+- 画布内生成卡片设置面板：`src/components/image-editor/ImageCanvasPublicationMaterialsDemoPanelView.tsx`
+
+## 验证命令
+
+```bash
+npm run test -- src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx src/components/image-editor/useImageCanvasGenerationSurface.test.tsx src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx src/services/image-editor/editorProjectClient.test.ts
+cargo test -p platform-image vector_engine --manifest-path server-rs/Cargo.toml
+cargo test -p api-server editor_image_generation_accepts_reference_body_above_default_limit --manifest-path server-rs/Cargo.toml
+cargo check -p api-server --manifest-path server-rs/Cargo.toml
+npm run check:encoding
+```
diff --git a/docs/【编辑器】画板音乐生成入口设计-2026-06-18.md b/docs/【编辑器】画板音乐生成入口设计-2026-06-18.md
index cb79578d7..c6dab26b7 100644
--- a/docs/【编辑器】画板音乐生成入口设计-2026-06-18.md
+++ b/docs/【编辑器】画板音乐生成入口设计-2026-06-18.md
@@ -110,4 +110,3 @@ POST /api/editor/audios/background-music/generations
 - 音效提交到 `/api/editor/audios/sound-effects/generations`，背景音乐提交到 `/api/editor/audios/background-music/generations`。
 - 成功后画布新增音频卡，能通过 `<audio controls>` 播放。
 - 刷新后 layout 能恢复音频生成器和音频图层。
-
diff --git a/docs/【项目基线】当前产品与工程约束-2026-05-15.md b/docs/【项目基线】当前产品与工程约束-2026-05-15.md
index 310adb1da..cfdb5b030 100644
--- a/docs/【项目基线】当前产品与工程约束-2026-05-15.md
+++ b/docs/【项目基线】当前产品与工程约束-2026-05-15.md
@@ -122,7 +122,7 @@ server-rs + Axum + SpacetimeDB
 - Issue tracker 是自托管 Gitea。可用 Gitea UI/API 或 `tea` CLI；不要用 GitHub `gh` 或 GitLab `glab`。
 - 默认 triage labels：`needs-triage`、`needs-info`、`ready-for-agent`、`ready-for-human`、`wontfix`。
 - 根 `CONTEXT.md` 是当前领域语言入口；架构决策以本文档和 `docs/project-memory/shared-memory/decision-log.md` 的最新稳定摘要为准。
-- `.hermes/` 只保存可进入 Git 的团队共享记忆、计划和可公开 skill，不提交个人 Hermes 配置、会话、密钥、Token 或本地私密路径。
+- `.hermes/` 只保存 Hermes 专用的仓库级工具资源，例如 skills、plugins 和启用说明；团队共享记忆、计划和 TODO 统一放在 `docs/project-memory/`，不提交个人 Hermes 配置、会话、密钥、Token 或本地私密路径。
 - 每次工程修改都应同步更新本目录当前文档；如果产生长期有效知识，再同步 `docs/project-memory/shared-memory/`。
 
 ## 当前文档策略
diff --git a/server-rs/crates/api-server/src/app.rs b/server-rs/crates/api-server/src/app.rs
index 082e95566..ba6db62ea 100644
--- a/server-rs/crates/api-server/src/app.rs
+++ b/server-rs/crates/api-server/src/app.rs
@@ -1516,6 +1516,50 @@ mod tests {
         assert!(!body_text.contains("length limit exceeded"));
     }
 
+    #[tokio::test]
+    async fn editor_image_generation_accepts_reference_body_above_default_limit() {
+        let state = AppState::new(AppConfig::default()).expect("state should build");
+        let seed_user = seed_phone_user_with_password(&state, "13800138028", TEST_PASSWORD).await;
+        let token = sign_test_user_token(&state, &seed_user, "sess_editor_image_reference_body");
+        let app = build_router(state);
+        let reference_image_src = format!("data:image/png;base64,{}", "A".repeat(3 * 1024 * 1024));
+        let request_body = serde_json::json!({
+            "prompt": "生成宣发素材",
+            "kind": "publication-material",
+            "size": "720x540",
+            "referenceImageSrcs": [reference_image_src],
+        })
+        .to_string();
+        assert!(request_body.len() > 2 * 1024 * 1024);
+
+        let response = app
+            .oneshot(
+                Request::builder()
+                    .method("POST")
+                    .uri("/api/editor/images/generations")
+                    .header("authorization", format!("Bearer {token}"))
+                    .header("content-type", "application/json")
+                    .body(Body::from(request_body))
+                    .expect("request should build"),
+            )
+            .await
+            .expect("request should succeed");
+
+        assert_eq!(response.status(), StatusCode::SERVICE_UNAVAILABLE);
+        let body = response
+            .into_body()
+            .collect()
+            .await
+            .expect("response body should collect")
+            .to_bytes();
+        let body_text = String::from_utf8_lossy(&body);
+        assert!(
+            body_text.contains("VECTOR_ENGINE_BASE_URL"),
+            "handler should parse the oversized editor reference before checking VectorEngine config: {body_text}"
+        );
+        assert!(!body_text.contains("length limit exceeded"));
+    }
+
     #[tokio::test]
     async fn password_entry_rejects_unknown_phone_without_registration() {
         let app = build_router(AppState::new(AppConfig::default()).expect("state should build"));
diff --git a/server-rs/crates/api-server/src/editor_generation_config.rs b/server-rs/crates/api-server/src/editor_generation_config.rs
index 1fb6ad586..e16c7deb2 100644
--- a/server-rs/crates/api-server/src/editor_generation_config.rs
+++ b/server-rs/crates/api-server/src/editor_generation_config.rs
@@ -7,6 +7,7 @@ const EDITOR_SPEC_GENERATION_MUD_POINTS: u32 = 5;
 const EDITOR_CHARACTER_IMAGE_GENERATION_MUD_POINTS: u32 = 12;
 const EDITOR_ICON_SPRITESHEET_GENERATION_MUD_POINTS: u32 = 12;
 const EDITOR_UI_DESIGN_GENERATION_MUD_POINTS: u32 = 12;
+const EDITOR_PUBLICATION_MATERIAL_GENERATION_MUD_POINTS: u32 = 5;
 
 pub(crate) const EDITOR_VIDEO_GENERATION_480P_MUD_POINTS_PER_SECOND: u32 = 10;
 pub(crate) const EDITOR_VIDEO_GENERATION_720P_MUD_POINTS_PER_SECOND: u32 = 20;
@@ -20,6 +21,7 @@ pub(crate) fn editor_image_generation_mud_points(kind: Option<&str>) -> u32 {
         Some("character") => EDITOR_CHARACTER_IMAGE_GENERATION_MUD_POINTS,
         Some("icon") => EDITOR_ICON_SPRITESHEET_GENERATION_MUD_POINTS,
         Some("ui-design") => EDITOR_UI_DESIGN_GENERATION_MUD_POINTS,
+        Some("publication-material") => EDITOR_PUBLICATION_MATERIAL_GENERATION_MUD_POINTS,
         _ => EDITOR_IMAGE_GENERATION_MUD_POINTS,
     }
 }
@@ -68,5 +70,9 @@ mod tests {
         assert_eq!(editor_image_generation_mud_points(Some("character")), 12);
         assert_eq!(editor_image_generation_mud_points(Some("icon")), 12);
         assert_eq!(editor_image_generation_mud_points(Some("ui-design")), 12);
+        assert_eq!(
+            editor_image_generation_mud_points(Some("publication-material")),
+            5
+        );
     }
 }
diff --git a/server-rs/crates/api-server/src/editor_project.rs b/server-rs/crates/api-server/src/editor_project.rs
index 8bc4a4671..0a1fdbeee 100644
--- a/server-rs/crates/api-server/src/editor_project.rs
+++ b/server-rs/crates/api-server/src/editor_project.rs
@@ -32,6 +32,7 @@ use spacetime_client::{
 
 use crate::{
     api_response::json_success_body,
+    asset_billing::execute_billable_asset_operation_with_cost,
     auth::AuthenticatedAccessToken,
     generated_image_assets::{
         GeneratedImageAssetAdapter, GeneratedImageAssetDataUrl,
@@ -63,6 +64,7 @@ const EDITOR_ICON_DESCRIPTION_LIMIT: usize = 100;
 const EDITOR_CHARACTER_IMAGE_ASSET_KIND: &str = "editor_character_image";
 const EDITOR_CHARACTER_IMAGE_ENTITY_KIND: &str = "editor_project";
 const EDITOR_CHARACTER_IMAGE_SLOT: &str = "character";
+const EDITOR_PUBLICATION_MATERIAL_ASSET_KIND: &str = "editor_publication_material";
 
 #[derive(Debug, Deserialize)]
 #[serde(rename_all = "camelCase")]
@@ -775,10 +777,12 @@ pub async fn generate_editor_image(
         legacy_size
     };
     let normalized_kind = payload.kind.as_deref().map(str::trim);
-    let _configured_price_mud_points =
+    let configured_price_mud_points =
         crate::editor_generation_config::editor_image_generation_mud_points(normalized_kind);
     let is_character_generation = matches!(normalized_kind, Some("character"));
     let is_ui_design_generation = matches!(normalized_kind, Some("ui-design"));
+    let is_publication_material_generation =
+        matches!(normalized_kind, Some("publication-material"));
     let submitted_prompt = if is_character_generation {
         build_editor_character_image_prompt(role_setting.as_str())
     } else if is_ui_design_generation {
@@ -799,6 +803,7 @@ pub async fn generate_editor_image(
         Some("spec") => "图片画布生成规范",
         Some("quick-edit") => "图片画布快速编辑图片",
         Some("ui-design") => "图片画布生成UI设计图",
+        Some("publication-material") => "图片画布生成宣发素材",
         _ => "图片画布生成图片",
     };
     let reference_sources = payload
@@ -838,7 +843,8 @@ pub async fn generate_editor_image(
     } else {
         image_size
     };
-    let generated = if generation_options.model == EDITOR_IMAGE_MODEL_NANOBANANA2 {
+    let generate_operation = async {
+        if generation_options.model == EDITOR_IMAGE_MODEL_NANOBANANA2 {
         create_openai_nanobanana_generate_content(
             &http_client,
             &settings,
@@ -850,8 +856,8 @@ pub async fn generate_editor_image(
             reference_images.as_slice(),
             failure_context,
         )
-        .await?
-    } else if reference_images.is_empty() {
+        .await
+        } else if reference_images.is_empty() {
         create_openai_image_generation_with_model(
             &http_client,
             &settings,
@@ -863,8 +869,8 @@ pub async fn generate_editor_image(
             &[],
             failure_context,
         )
-        .await?
-    } else {
+        .await
+        } else {
         create_openai_image_edit_with_references_and_model(
             &http_client,
             &settings,
@@ -876,7 +882,21 @@ pub async fn generate_editor_image(
             reference_images.as_slice(),
             failure_context,
         )
+        .await
+        }
+    };
+    let generated = if is_publication_material_generation {
+        execute_billable_asset_operation_with_cost(
+            &state,
+            authenticated.claims().user_id(),
+            EDITOR_PUBLICATION_MATERIAL_ASSET_KIND,
+            request_context.request_id(),
+            u64::from(configured_price_mud_points),
+            generate_operation,
+        )
         .await?
+    } else {
+        generate_operation.await?
     };
     let mut image = generated.images.into_iter().next().ok_or_else(|| {
         AppError::from_status(StatusCode::BAD_GATEWAY).with_details(json!({
diff --git a/server-rs/crates/api-server/src/modules/editor_project.rs b/server-rs/crates/api-server/src/modules/editor_project.rs
index be1ca8735..f81510837 100644
--- a/server-rs/crates/api-server/src/modules/editor_project.rs
+++ b/server-rs/crates/api-server/src/modules/editor_project.rs
@@ -1,5 +1,7 @@
 use axum::{
-    Router, middleware,
+    Router,
+    extract::DefaultBodyLimit,
+    middleware,
     routing::{get, patch, post},
 };
 
@@ -16,6 +18,8 @@ use crate::{
     state::AppState,
 };
 
+const EDITOR_IMAGE_GENERATION_BODY_LIMIT_BYTES: usize = 12 * 1024 * 1024;
+
 pub fn router(state: AppState) -> Router<AppState> {
     Router::new()
         .route(
@@ -99,10 +103,15 @@ pub fn router(state: AppState) -> Router<AppState> {
         )
         .route(
             "/api/editor/images/generations",
-            post(generate_editor_image).route_layer(middleware::from_fn_with_state(
-                state.clone(),
-                require_bearer_auth,
-            )),
+            post(generate_editor_image)
+                .layer(DefaultBodyLimit::max(
+                    // 中文注释：图片画布生图仍兼容参考图 Data URL 入参，宣发素材提交前会压缩，后端保留有限兜底。
+                    EDITOR_IMAGE_GENERATION_BODY_LIMIT_BYTES,
+                ))
+                .route_layer(middleware::from_fn_with_state(
+                    state.clone(),
+                    require_bearer_auth,
+                )),
         )
         .route(
             "/api/editor/images/edits",
diff --git a/server-rs/crates/api-server/src/openai_image_generation.rs b/server-rs/crates/api-server/src/openai_image_generation.rs
index 3742350c7..6e461dfd0 100644
--- a/server-rs/crates/api-server/src/openai_image_generation.rs
+++ b/server-rs/crates/api-server/src/openai_image_generation.rs
@@ -578,7 +578,7 @@ mod tests {
         let body = build_openai_image_request_body(
             "雾海神殿",
             Some("文字，水印"),
-            "1280*720",
+            "16:9",
             2,
             &["data:image/png;base64,abcd".to_string()],
         );
diff --git a/server-rs/crates/platform-image/src/vector_engine/request.rs b/server-rs/crates/platform-image/src/vector_engine/request.rs
index 930dc159c..869f4e374 100644
--- a/server-rs/crates/platform-image/src/vector_engine/request.rs
+++ b/server-rs/crates/platform-image/src/vector_engine/request.rs
@@ -91,17 +91,28 @@ pub fn normalize_vector_engine_image_model(model: &str) -> &str {
 }
 
 pub fn normalize_image_size(size: &str) -> String {
-    match size.trim() {
-        "1024*1024" | "1024x1024" | "1:1" => "1024x1024",
-        "1280*720" | "1280x720" | "1600*900" | "1600x900" | "16:9" | "1536x1024" | "2k" => {
-            "1536x1024"
-        }
-        "1920*1080" | "1920x1080" | "2048*1152" | "2048x1152" | "2k-16:9" => "2048x1152",
-        "1024*1536" | "1024x1536" | "9:16" => "1024x1536",
-        value if !value.is_empty() => value,
-        _ => "1024x1024",
+    let size = size.trim();
+    match size {
+        "1:1" => "1024x1024".to_string(),
+        "16:9" | "2k" => "1536x1024".to_string(),
+        "2k-16:9" => "2048x1152".to_string(),
+        "9:16" => "1024x1536".to_string(),
+        value if is_explicit_pixel_size(value) => normalize_explicit_pixel_size(value),
+        value if !value.is_empty() => value.to_string(),
+        _ => "1024x1024".to_string(),
     }
-    .to_string()
+}
+
+fn is_explicit_pixel_size(value: &str) -> bool {
+    let separator = if value.contains('x') { 'x' } else { '*' };
+    let Some((width, height)) = value.split_once(separator) else {
+        return false;
+    };
+    width.parse::<u32>().is_ok() && height.parse::<u32>().is_ok()
+}
+
+fn normalize_explicit_pixel_size(value: &str) -> String {
+    value.replace('*', "x")
 }
 
 fn normalize_nanobanana_aspect_ratio(aspect_ratio: &str) -> &str {
diff --git a/server-rs/crates/platform-image/tests/vector_engine.rs b/server-rs/crates/platform-image/tests/vector_engine.rs
index ec757c685..0a10874a0 100644
--- a/server-rs/crates/platform-image/tests/vector_engine.rs
+++ b/server-rs/crates/platform-image/tests/vector_engine.rs
@@ -46,6 +46,20 @@ fn vector_engine_module_exposes_provider_protocol_helpers() {
     );
 }
 
+#[test]
+fn vector_engine_keeps_explicit_publication_material_pixel_sizes() {
+    let cover =
+        build_vector_engine_image_request_body("宣发首图", None, "720x540", 1, &[]);
+    let detail =
+        build_vector_engine_image_request_body("详情单图", None, "720x1280", 1, &[]);
+    let poster =
+        build_vector_engine_image_request_body("运营海报", None, "1280x720", 1, &[]);
+
+    assert_eq!(cover["size"], "720x540");
+    assert_eq!(detail["size"], "720x1280");
+    assert_eq!(poster["size"], "1280x720");
+}
+
 #[test]
 fn vector_engine_normalizes_2k_landscape_spec_size() {
     let body = build_vector_engine_image_request_body("生成规范图", None, "2048x1152", 1, &[]);
diff --git a/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx b/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx
index de6dc85c9..984653d16 100644
--- a/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx
+++ b/src/components/image-editor/ImageCanvasBottomToolbarView.test.tsx
@@ -11,10 +11,12 @@ describe('ImageCanvasBottomToolbarView', () => {
     const switchTool = vi.fn();
     const specToolWrapRef = createRef<HTMLSpanElement>();
     const musicToolWrapRef = createRef<HTMLSpanElement>();
+    const publicationToolWrapRef = createRef<HTMLSpanElement>();
     render(
       <ImageCanvasBottomToolbarView
         specToolWrapRef={specToolWrapRef}
         musicToolWrapRef={musicToolWrapRef}
+        publicationToolWrapRef={publicationToolWrapRef}
         effectiveTool="generate"
         onSwitchTool={switchTool}
         onOpenToolOptions={vi.fn()}
@@ -45,6 +47,7 @@ describe('ImageCanvasBottomToolbarView', () => {
     fireEvent.click(
       within(toolbar).getByRole('button', { name: '生成图标素材' }),
     );
+    fireEvent.click(within(toolbar).getByRole('button', { name: '宣发素材' }));
 
     expect(switchTool).toHaveBeenNthCalledWith(1, 'hand');
     expect(switchTool).toHaveBeenNthCalledWith(2, 'video');
@@ -52,17 +55,20 @@ describe('ImageCanvasBottomToolbarView', () => {
     expect(switchTool).toHaveBeenNthCalledWith(4, 'ui-design');
     expect(switchTool).toHaveBeenNthCalledWith(5, 'music');
     expect(switchTool).toHaveBeenNthCalledWith(6, 'icon');
+    expect(switchTool).toHaveBeenNthCalledWith(7, 'publication');
   });
 
   it('only keeps the select and hand tools visibly pressed', () => {
     const specToolWrapRef = createRef<HTMLSpanElement>();
     const musicToolWrapRef = createRef<HTMLSpanElement>();
+    const publicationToolWrapRef = createRef<HTMLSpanElement>();
     const renderToolbar = (effectiveTool: Parameters<
       typeof ImageCanvasBottomToolbarView
     >[0]['effectiveTool']) => (
       <ImageCanvasBottomToolbarView
         specToolWrapRef={specToolWrapRef}
         musicToolWrapRef={musicToolWrapRef}
+        publicationToolWrapRef={publicationToolWrapRef}
         effectiveTool={effectiveTool}
         onSwitchTool={vi.fn()}
         onOpenToolOptions={vi.fn()}
@@ -96,6 +102,7 @@ describe('ImageCanvasBottomToolbarView', () => {
       ['character', '生成角色形象'],
       ['icon', '生成图标素材'],
       ['ui-design', '生成UI设计图'],
+      ['publication', '宣发素材'],
     ] as const) {
       rerender(renderToolbar(tool[0]));
 
@@ -112,10 +119,12 @@ describe('ImageCanvasBottomToolbarView', () => {
     const closeToolOptions = vi.fn();
     const specToolWrapRef = createRef<HTMLSpanElement>();
     const musicToolWrapRef = createRef<HTMLSpanElement>();
+    const publicationToolWrapRef = createRef<HTMLSpanElement>();
     render(
       <ImageCanvasBottomToolbarView
         specToolWrapRef={specToolWrapRef}
         musicToolWrapRef={musicToolWrapRef}
+        publicationToolWrapRef={publicationToolWrapRef}
         effectiveTool="select"
         onSwitchTool={vi.fn()}
         onOpenToolOptions={openToolOptions}
@@ -127,10 +136,14 @@ describe('ImageCanvasBottomToolbarView', () => {
     fireEvent.pointerLeave(specToolWrapRef.current!);
     fireEvent.pointerEnter(musicToolWrapRef.current!);
     fireEvent.pointerLeave(musicToolWrapRef.current!);
+    fireEvent.pointerEnter(publicationToolWrapRef.current!);
+    fireEvent.pointerLeave(publicationToolWrapRef.current!);
 
     expect(openToolOptions).toHaveBeenNthCalledWith(1, 'spec');
     expect(closeToolOptions).toHaveBeenNthCalledWith(1, 'spec');
     expect(openToolOptions).toHaveBeenNthCalledWith(2, 'music');
     expect(closeToolOptions).toHaveBeenNthCalledWith(2, 'music');
+    expect(openToolOptions).toHaveBeenNthCalledWith(3, 'publication');
+    expect(closeToolOptions).toHaveBeenNthCalledWith(3, 'publication');
   });
 });
diff --git a/src/components/image-editor/ImageCanvasBottomToolbarView.tsx b/src/components/image-editor/ImageCanvasBottomToolbarView.tsx
index 06bec8a92..6dcb19b24 100644
--- a/src/components/image-editor/ImageCanvasBottomToolbarView.tsx
+++ b/src/components/image-editor/ImageCanvasBottomToolbarView.tsx
@@ -6,6 +6,7 @@ import {
   Hand,
   ImageIcon,
   ImagePlus,
+  Megaphone,
   MousePointer2,
   Music,
   UserRound,
@@ -15,11 +16,12 @@ import type { RefObject } from 'react';
 import { EditorIconButton } from './ImageCanvasEditorPrimitives';
 import type { CanvasTool } from './ImageCanvasEditorTypes';
 
-type ToolbarOptionTool = Extract<CanvasTool, 'music' | 'spec'>;
+type ToolbarOptionTool = Extract<CanvasTool, 'music' | 'spec' | 'publication'>;
 
 type ImageCanvasBottomToolbarViewProps = {
   specToolWrapRef: RefObject<HTMLSpanElement | null>;
   musicToolWrapRef: RefObject<HTMLSpanElement | null>;
+  publicationToolWrapRef: RefObject<HTMLSpanElement | null>;
   effectiveTool: CanvasTool;
   onSwitchTool: (tool: CanvasTool) => void;
   onOpenToolOptions: (tool: ToolbarOptionTool) => void;
@@ -43,6 +45,7 @@ const canvasTools: Array<{
   },
   { id: 'video', label: '生成视频', icon: Clapperboard },
   { id: 'music', label: '生成音乐', icon: Music },
+  { id: 'publication', label: '宣发素材', icon: Megaphone },
   {
     id: 'spec',
     label: '生成规范',
@@ -55,7 +58,7 @@ const canvasTools: Array<{
 ];
 
 function isToolbarOptionTool(tool: CanvasTool): tool is ToolbarOptionTool {
-  return tool === 'music' || tool === 'spec';
+  return tool === 'music' || tool === 'spec' || tool === 'publication';
 }
 
 function hasPersistentPressedState(tool: CanvasTool) {
@@ -65,6 +68,7 @@ function hasPersistentPressedState(tool: CanvasTool) {
 export function ImageCanvasBottomToolbarView({
   specToolWrapRef,
   musicToolWrapRef,
+  publicationToolWrapRef,
   effectiveTool,
   onSwitchTool,
   onOpenToolOptions,
@@ -88,10 +92,19 @@ export function ImageCanvasBottomToolbarView({
                 />
               ) : null}
               <span
-                ref={id === 'spec' ? specToolWrapRef : musicToolWrapRef}
+                ref={
+                  id === 'spec'
+                    ? specToolWrapRef
+                    : id === 'music'
+                      ? musicToolWrapRef
+                      : publicationToolWrapRef
+                }
                 className={[
                   'image-canvas-editor__bottom-toolbar-option-wrap',
                   id === 'spec' ? 'image-canvas-editor__spec-tool-wrap' : '',
+                  id === 'publication'
+                    ? 'image-canvas-editor__publication-tool-wrap'
+                    : '',
                 ]
                   .filter(Boolean)
                   .join(' ')}
diff --git a/src/components/image-editor/ImageCanvasEditorShellView.test.tsx b/src/components/image-editor/ImageCanvasEditorShellView.test.tsx
index 409bba246..607b1aea2 100644
--- a/src/components/image-editor/ImageCanvasEditorShellView.test.tsx
+++ b/src/components/image-editor/ImageCanvasEditorShellView.test.tsx
@@ -114,6 +114,7 @@ function createStageProps(): ImageCanvasStageViewProps {
     canvasViewportRef: createRef<HTMLDivElement>(),
     specToolWrapRef: createRef<HTMLSpanElement>(),
     musicToolWrapRef: createRef<HTMLSpanElement>(),
+    publicationToolWrapRef: createRef<HTMLSpanElement>(),
     isPanning: false,
     effectiveTool: 'select',
     canvasBackgroundColor: '#f8fafc',
diff --git a/src/components/image-editor/ImageCanvasEditorTypes.ts b/src/components/image-editor/ImageCanvasEditorTypes.ts
index b62443e17..2481016d0 100644
--- a/src/components/image-editor/ImageCanvasEditorTypes.ts
+++ b/src/components/image-editor/ImageCanvasEditorTypes.ts
@@ -13,6 +13,7 @@ export type CanvasAssetKind =
   | 'character'
   | 'icon'
   | 'icon-spec'
+  | 'publication-material'
   | 'ui-design'
   | 'video'
   | 'sound-effect'
@@ -107,6 +108,7 @@ export type CanvasTool =
   | 'spec'
   | 'character'
   | 'icon'
+  | 'publication'
   | 'ui-design';
 
 export type SidebarPanel = 'assets' | 'layers';
@@ -141,6 +143,17 @@ export type CharacterReferenceImage = {
   assetObjectId?: string | null;
 };
 
+export type PublicationMaterialsGameInfo = {
+  gameName: string;
+  gameCategories: string;
+  gameDescription: string;
+};
+
+export type PublicationMaterialsWorkflowId =
+  | 'publication-cover-image'
+  | 'publication-detail-gallery'
+  | 'publication-promo-poster';
+
 export type GenerateDialogState = {
   id?: string;
   mode:
@@ -149,6 +162,7 @@ export type GenerateDialogState = {
     | 'spec'
     | 'character'
     | 'icon'
+    | 'publication'
     | 'ui-design'
     | 'video'
     | 'audio-sound-effect'
@@ -166,6 +180,9 @@ export type GenerateDialogState = {
   characterReferences?: CharacterReferenceImage[];
   iconSpecReference?: CharacterReferenceImage | null;
   iconDescriptions?: string[];
+  publicationWorkflowId?: PublicationMaterialsWorkflowId;
+  publicationGameInfo?: PublicationMaterialsGameInfo;
+  publicationReferences?: CharacterReferenceImage[];
   uiDesignSpecReference?: CharacterReferenceImage | null;
   imageModel?: string;
   videoModel?: EditorVideoModel;
@@ -280,7 +297,8 @@ export type UploadTarget =
   | 'character-spec'
   | 'character-reference'
   | 'icon-spec'
-  | 'ui-design-icon-spec';
+  | 'ui-design-icon-spec'
+  | 'publication-reference';
 
 export type SnapGuide = {
   vertical?: number;
diff --git a/src/components/image-editor/ImageCanvasEditorView.tsx b/src/components/image-editor/ImageCanvasEditorView.tsx
index 9d7a9cd82..166852bfd 100644
--- a/src/components/image-editor/ImageCanvasEditorView.tsx
+++ b/src/components/image-editor/ImageCanvasEditorView.tsx
@@ -56,9 +56,11 @@ export function ImageCanvasEditorView() {
   const resetCanvasInteractionStateRef = useRef<() => void>(() => {});
   const specToolWrapRef = useRef<HTMLSpanElement | null>(null);
   const musicToolWrapRef = useRef<HTMLSpanElement | null>(null);
+  const publicationToolWrapRef = useRef<HTMLSpanElement | null>(null);
   const characterSpecButtonRef = useRef<HTMLButtonElement | null>(null);
   const characterReferenceButtonRef = useRef<HTMLButtonElement | null>(null);
   const generationReferenceButtonRef = useRef<HTMLButtonElement | null>(null);
+  const publicationReferenceButtonRef = useRef<HTMLButtonElement | null>(null);
   const iconSpecButtonRef = useRef<HTMLButtonElement | null>(null);
   const selectedLayerIdRef = useRef<string | null>(null);
   const selectedLayerIdsRef = useRef<string[]>([]);
@@ -501,9 +503,11 @@ export function ImageCanvasEditorView() {
     layerCounterRef,
     specToolWrapRef,
     musicToolWrapRef,
+    publicationToolWrapRef,
     characterSpecButtonRef,
     characterReferenceButtonRef,
     generationReferenceButtonRef,
+    publicationReferenceButtonRef,
     iconSpecButtonRef,
     generateDialog,
     setGenerateDialog,
@@ -535,6 +539,8 @@ export function ImageCanvasEditorView() {
     setIsCharacterReferenceMenuOpen,
     isPickingGenerationReferenceFromCanvas,
     setIsPickingGenerationReferenceFromCanvas,
+    isPickingPublicationReferenceFromCanvas,
+    setIsPickingPublicationReferenceFromCanvas,
     isPickingCharacterSpecFromCanvas,
     setIsPickingCharacterSpecFromCanvas,
     isPickingCharacterReferenceFromCanvas,
@@ -552,6 +558,7 @@ export function ImageCanvasEditorView() {
     removeSelectedLayerBackground,
     pickCharacterSpecFromLayer,
     pickGenerationReferenceFromLayer,
+    pickPublicationReferenceFromLayer,
     pickCharacterReferenceFromLayer,
     pickIconSpecFromLayer,
     pickUiDesignSpecFromLayer,
@@ -646,12 +653,14 @@ export function ImageCanvasEditorView() {
     setGenerateDialog,
     isPickingCharacterSpecFromCanvas,
     isPickingGenerationReferenceFromCanvas,
+    isPickingPublicationReferenceFromCanvas,
     isPickingCharacterReferenceFromCanvas,
     isPickingIconSpecFromCanvas,
     isPickingUiDesignSpecFromCanvas,
     clearCanvasFocus,
     pickCharacterSpecFromLayer,
     pickGenerationReferenceFromLayer,
+    pickPublicationReferenceFromLayer,
     pickCharacterReferenceFromLayer,
     pickIconSpecFromLayer,
     pickUiDesignSpecFromLayer,
@@ -884,6 +893,7 @@ export function ImageCanvasEditorView() {
     canvasViewportRef,
     specToolWrapRef,
     musicToolWrapRef,
+    publicationToolWrapRef,
     isPanning,
     effectiveTool,
     canvasBackgroundColor,
diff --git a/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx b/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx
index 51524b827..db69027df 100644
--- a/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx
+++ b/src/components/image-editor/ImageCanvasGenerationComposerView.test.tsx
@@ -30,17 +30,20 @@ function createComposerProps(
     characterReferenceButtonRef: createRef(),
     generationReferenceButtonRef: createRef(),
     iconSpecButtonRef: createRef(),
+    publicationReferenceButtonRef: createRef(),
     isSpecMenuOpen: false,
     isCharacterSpecMenuOpen: false,
     isCharacterReferenceMenuOpen: false,
     isGenerationReferenceMenuOpen: false,
     isIconSpecMenuOpen: false,
     isUiDesignSpecMenuOpen: false,
+    isPublicationReferenceMenuOpen: false,
     isPickingCharacterSpecFromCanvas: false,
     isPickingCharacterReferenceFromCanvas: false,
     isPickingGenerationReferenceFromCanvas: false,
     isPickingIconSpecFromCanvas: false,
     isPickingUiDesignSpecFromCanvas: false,
+    isPickingPublicationReferenceFromCanvas: false,
     generateDialog,
     generationComposerStyle: { left: 320, top: 240 },
     iconComposerStyle: { left: 320, top: 240, width: '32rem' },
@@ -80,11 +83,13 @@ function createComposerProps(
     setIsGenerationReferenceMenuOpen: mockStateSetter<boolean>(),
     setIsIconSpecMenuOpen: mockStateSetter<boolean>(),
     setIsUiDesignSpecMenuOpen: mockStateSetter<boolean>(),
+    setIsPublicationReferenceMenuOpen: mockStateSetter<boolean>(),
     setIsPickingCharacterSpecFromCanvas: mockStateSetter<boolean>(),
     setIsPickingCharacterReferenceFromCanvas: mockStateSetter<boolean>(),
     setIsPickingGenerationReferenceFromCanvas: mockStateSetter<boolean>(),
     setIsPickingIconSpecFromCanvas: mockStateSetter<boolean>(),
     setIsPickingUiDesignSpecFromCanvas: mockStateSetter<boolean>(),
+    setIsPickingPublicationReferenceFromCanvas: mockStateSetter<boolean>(),
     onOpenSpecDialog: vi.fn(),
     onRequestUpload: vi.fn(),
     onSubmitImageGeneration: vi.fn(),
diff --git a/src/components/image-editor/ImageCanvasGenerationComposerView.tsx b/src/components/image-editor/ImageCanvasGenerationComposerView.tsx
index 9e5d937f4..7d06295a2 100644
--- a/src/components/image-editor/ImageCanvasGenerationComposerView.tsx
+++ b/src/components/image-editor/ImageCanvasGenerationComposerView.tsx
@@ -24,6 +24,7 @@ import { ImageCanvasCharacterAnimationPanelView } from './ImageCanvasCharacterAn
 import { ImageCanvasCharacterGenerationComposerView } from './ImageCanvasCharacterGenerationComposerView';
 import { ImageCanvasCropExpandPanelView } from './ImageCanvasCropExpandPanelView';
 import { ImageCanvasEditGenerationModalView } from './ImageCanvasEditGenerationModalView';
+import { ImageCanvasPublicationMaterialsDemoPanelView } from './ImageCanvasPublicationMaterialsDemoPanelView';
 import type {
   CanvasLayer,
   CharacterAnimationPanelState,
@@ -42,6 +43,7 @@ import {
   SPEC_TYPE_LABEL,
 } from './ImageCanvasGenerationModel';
 import { ImageCanvasIconSpritesheetComposerView } from './ImageCanvasIconSpritesheetComposerView';
+import { getPublicationMaterialsWorkflow } from './ImageCanvasPublicationMaterialsModel';
 import { ImageCanvasQuickEditPanelView } from './ImageCanvasQuickEditPanelView';
 import { ImageCanvasReferenceSlot } from './ImageCanvasReferenceSlot';
 import { ImageCanvasSpecGenerationPanelView } from './ImageCanvasSpecGenerationPanelView';
@@ -49,17 +51,20 @@ import { useImageCanvasFloatingOptionDismiss } from './useImageCanvasFloatingOpt
 
 type ImageCanvasGenerationComposerViewProps = {
   specToolWrapRef: RefObject<HTMLSpanElement | null>;
+  publicationReferenceButtonRef: RefObject<HTMLButtonElement | null>;
   characterSpecButtonRef: RefObject<HTMLButtonElement | null>;
   characterReferenceButtonRef: RefObject<HTMLButtonElement | null>;
   generationReferenceButtonRef: RefObject<HTMLButtonElement | null>;
   iconSpecButtonRef: RefObject<HTMLButtonElement | null>;
   isSpecMenuOpen: boolean;
   isGenerationReferenceMenuOpen: boolean;
+  isPublicationReferenceMenuOpen: boolean;
   isCharacterSpecMenuOpen: boolean;
   isCharacterReferenceMenuOpen: boolean;
   isIconSpecMenuOpen: boolean;
   isUiDesignSpecMenuOpen: boolean;
   isPickingGenerationReferenceFromCanvas: boolean;
+  isPickingPublicationReferenceFromCanvas: boolean;
   isPickingCharacterSpecFromCanvas: boolean;
   isPickingCharacterReferenceFromCanvas: boolean;
   isPickingIconSpecFromCanvas: boolean;
@@ -86,11 +91,15 @@ type ImageCanvasGenerationComposerViewProps = {
     SetStateAction<CharacterAnimationPanelState | null>
   >;
   setIsGenerationReferenceMenuOpen: Dispatch<SetStateAction<boolean>>;
+  setIsPublicationReferenceMenuOpen: Dispatch<SetStateAction<boolean>>;
   setIsCharacterSpecMenuOpen: Dispatch<SetStateAction<boolean>>;
   setIsCharacterReferenceMenuOpen: Dispatch<SetStateAction<boolean>>;
   setIsIconSpecMenuOpen: Dispatch<SetStateAction<boolean>>;
   setIsUiDesignSpecMenuOpen: Dispatch<SetStateAction<boolean>>;
   setIsPickingGenerationReferenceFromCanvas: Dispatch<SetStateAction<boolean>>;
+  setIsPickingPublicationReferenceFromCanvas: Dispatch<
+    SetStateAction<boolean>
+  >;
   setIsPickingCharacterSpecFromCanvas: Dispatch<SetStateAction<boolean>>;
   setIsPickingCharacterReferenceFromCanvas: Dispatch<SetStateAction<boolean>>;
   setIsPickingIconSpecFromCanvas: Dispatch<SetStateAction<boolean>>;
@@ -841,17 +850,20 @@ function ImageCanvasAudioGenerationComposerView({
 
 export function ImageCanvasGenerationComposerView({
   specToolWrapRef,
+  publicationReferenceButtonRef,
   characterSpecButtonRef,
   characterReferenceButtonRef,
   generationReferenceButtonRef,
   iconSpecButtonRef,
   isSpecMenuOpen,
   isGenerationReferenceMenuOpen,
+  isPublicationReferenceMenuOpen,
   isCharacterSpecMenuOpen,
   isCharacterReferenceMenuOpen,
   isIconSpecMenuOpen,
   isUiDesignSpecMenuOpen,
   isPickingGenerationReferenceFromCanvas,
+  isPickingPublicationReferenceFromCanvas,
   isPickingCharacterSpecFromCanvas,
   isPickingCharacterReferenceFromCanvas,
   isPickingIconSpecFromCanvas,
@@ -876,11 +888,13 @@ export function ImageCanvasGenerationComposerView({
   setCropExpandPanel,
   setCharacterAnimationPanel,
   setIsGenerationReferenceMenuOpen,
+  setIsPublicationReferenceMenuOpen,
   setIsCharacterSpecMenuOpen,
   setIsCharacterReferenceMenuOpen,
   setIsIconSpecMenuOpen,
   setIsUiDesignSpecMenuOpen,
   setIsPickingGenerationReferenceFromCanvas,
+  setIsPickingPublicationReferenceFromCanvas,
   setIsPickingCharacterSpecFromCanvas,
   setIsPickingCharacterReferenceFromCanvas,
   setIsPickingIconSpecFromCanvas,
@@ -974,6 +988,31 @@ export function ImageCanvasGenerationComposerView({
         />
       ) : null}
 
+      {generateDialog?.mode === 'publication' &&
+      generateDialog.composerOpen !== false &&
+      generationComposerStyle ? (
+        <ImageCanvasPublicationMaterialsDemoPanelView
+          dialog={generateDialog}
+          workflow={getPublicationMaterialsWorkflow(
+            generateDialog.publicationWorkflowId ?? 'publication-cover-image',
+          )}
+          style={generationComposerStyle}
+          publicationReferenceButtonRef={publicationReferenceButtonRef}
+          isPublicationReferenceMenuOpen={isPublicationReferenceMenuOpen}
+          setGenerateDialog={setGenerateDialog}
+          setIsPublicationReferenceMenuOpen={
+            setIsPublicationReferenceMenuOpen
+          }
+          setIsPickingPublicationReferenceFromCanvas={
+            setIsPickingPublicationReferenceFromCanvas
+          }
+          renderEditorPortal={renderEditorPortal}
+          buildPortalMenuStyle={buildPortalMenuStyle}
+          onRequestUpload={onRequestUpload}
+          onSubmit={onSubmitImageGeneration}
+        />
+      ) : null}
+
       {generateDialog?.mode === 'ui-design' &&
       generateDialog.composerOpen !== false &&
       generationComposerStyle ? (
@@ -1093,6 +1132,11 @@ export function ImageCanvasGenerationComposerView({
           请选择画布中的图片作为参考图，按 Esc 退出
         </div>
       ) : null}
+      {isPickingPublicationReferenceFromCanvas ? (
+        <div className="image-canvas-editor__canvas-pick-hint">
+          请选择画布中的图片作为宣发素材参考图，按 Esc 退出
+        </div>
+      ) : null}
       {isPickingIconSpecFromCanvas ? (
         <div className="image-canvas-editor__canvas-pick-hint">
           请选择画布中的图标素材规范，按 Esc 退出
diff --git a/src/components/image-editor/ImageCanvasGenerationDialogModel.ts b/src/components/image-editor/ImageCanvasGenerationDialogModel.ts
index 194ccc54f..ee14a60f0 100644
--- a/src/components/image-editor/ImageCanvasGenerationDialogModel.ts
+++ b/src/components/image-editor/ImageCanvasGenerationDialogModel.ts
@@ -5,6 +5,7 @@ import type {
   CanvasViewport,
   CharacterAnimationPanelState,
   GenerateDialogState,
+  PublicationMaterialsWorkflowId,
   QuickEditPanelState,
   SpecFormValues,
   SpecGenerationType,
@@ -18,12 +19,15 @@ import {
   createCanvasLayerReference,
   DEFAULT_ICON_DESCRIPTIONS,
   DEFAULT_IMAGE_MODEL,
+  DEFAULT_PUBLICATION_GAME_INFO,
   DEFAULT_SPEC_FORM_VALUES,
   DEFAULT_VIDEO_MODEL,
   EDITOR_IMAGE_DIMENSION_OPTIONS,
   ICON_DESCRIPTION_LIMIT,
   ICON_FRAME_DISPLAY_SIZE,
   ICON_FRAME_ORIGINAL_SIZE,
+  PUBLICATION_FRAME_DISPLAY_SIZE,
+  PUBLICATION_FRAME_ORIGINAL_SIZE,
   SPEC_FRAME_DISPLAY_SIZE,
   SPEC_FRAME_ORIGINAL_SIZE,
   UI_DESIGN_FRAME_DISPLAY_SIZE,
@@ -233,6 +237,37 @@ export function createIconGenerationDialogDraft({
   };
 }
 
+export function createPublicationGenerationDialogDraft({
+  canvasSize,
+  viewport,
+  workflowId,
+}: {
+  canvasSize: CanvasSize;
+  viewport: CanvasViewport;
+  workflowId: PublicationMaterialsWorkflowId;
+}): Omit<CanvasGenerationDialogState, 'id'> {
+  const worldCenter = getViewportWorldCenter({ canvasSize, viewport });
+  const frameDisplaySize = PUBLICATION_FRAME_DISPLAY_SIZE[workflowId];
+  const frameOriginalSize = PUBLICATION_FRAME_ORIGINAL_SIZE[workflowId];
+  return {
+    mode: 'publication',
+    prompt: '',
+    status: 'idle',
+    composerOpen: true,
+    publicationWorkflowId: workflowId,
+    publicationGameInfo: { ...DEFAULT_PUBLICATION_GAME_INFO },
+    publicationReferences: [],
+    placeholder: {
+      x: worldCenter.x - frameDisplaySize.width / 2,
+      y: worldCenter.y - frameDisplaySize.height / 2,
+      width: frameDisplaySize.width,
+      height: frameDisplaySize.height,
+      originalWidth: frameOriginalSize.width,
+      originalHeight: frameOriginalSize.height,
+    },
+  };
+}
+
 export function createVideoGenerationDialogDraft({
   canvasSize,
   viewport,
@@ -477,6 +512,22 @@ export function appendGenerationReference(
     : dialog;
 }
 
+export function appendPublicationReference(
+  dialog: GenerateDialogState | null,
+  layer: CanvasLayer,
+): GenerateDialogState | null {
+  return dialog?.mode === 'publication' && getReferenceMediaType(layer) === 'image'
+    ? {
+        ...resetFailedGenerationDialog(dialog),
+        publicationReferences: [
+          ...(dialog.publicationReferences ?? []),
+          createCanvasLayerReference(layer),
+        ],
+        composerOpen: true,
+      }
+    : dialog;
+}
+
 export function assignIconSpecReference(
   dialog: GenerateDialogState | null,
   layer: CanvasLayer,
@@ -567,6 +618,7 @@ export function hideGeneratedLayerComposerAfterBlur(
     dialog?.mode === 'spec' ||
     dialog?.mode === 'character' ||
     dialog?.mode === 'icon' ||
+    dialog?.mode === 'publication' ||
     dialog?.mode === 'audio-sound-effect' ||
     dialog?.mode === 'audio-background-music') &&
     dialog.status !== 'generating'
@@ -581,6 +633,7 @@ export function closeGenerateComposerDialog(
   dialog: GenerateDialogState | null,
 ): GenerateDialogState | null {
   return dialog?.mode === 'generate' ||
+    dialog?.mode === 'publication' ||
     dialog?.mode === 'audio-sound-effect' ||
     dialog?.mode === 'audio-background-music'
     ? {
diff --git a/src/components/image-editor/ImageCanvasGenerationModel.ts b/src/components/image-editor/ImageCanvasGenerationModel.ts
index 6d23b01e8..0d0ba3971 100644
--- a/src/components/image-editor/ImageCanvasGenerationModel.ts
+++ b/src/components/image-editor/ImageCanvasGenerationModel.ts
@@ -11,9 +11,15 @@ import type {
   CanvasLayer,
   CharacterReferenceImage,
   GenerateDialogState,
+  PublicationMaterialsGameInfo,
+  PublicationMaterialsWorkflowId,
   SpecFormValues,
   SpecGenerationType,
 } from './ImageCanvasEditorTypes';
+import {
+  getPublicationMaterialsWorkflow,
+  type PublicationMaterialsWorkflow,
+} from './ImageCanvasPublicationMaterialsModel';
 
 // 中文注释：与 api-server/src/editor_generation_config.rs 保持同名语义，当前作为前端展示兜底。
 export const EDITOR_GENERATION_MUD_POINT_CONFIG = {
@@ -43,6 +49,22 @@ export const ICON_FRAME_ORIGINAL_SIZE = { width: 512, height: 512 };
 export const ICON_FRAME_DISPLAY_SIZE = { width: 360, height: 360 };
 export const UI_DESIGN_FRAME_ORIGINAL_SIZE = { width: 2048, height: 1152 };
 export const UI_DESIGN_FRAME_DISPLAY_SIZE = { width: 560, height: 315 };
+export const PUBLICATION_FRAME_ORIGINAL_SIZE: Record<
+  PublicationMaterialsWorkflowId,
+  { width: number; height: number }
+> = {
+  'publication-cover-image': { width: 720, height: 540 },
+  'publication-detail-gallery': { width: 720, height: 1280 },
+  'publication-promo-poster': { width: 1280, height: 720 },
+};
+export const PUBLICATION_FRAME_DISPLAY_SIZE: Record<
+  PublicationMaterialsWorkflowId,
+  { width: number; height: number }
+> = {
+  'publication-cover-image': { width: 480, height: 360 },
+  'publication-detail-gallery': { width: 360, height: 640 },
+  'publication-promo-poster': { width: 560, height: 315 },
+};
 export const IMAGE_MODEL_GPT_IMAGE_2 = 'gpt-image-2';
 export const IMAGE_MODEL_NANOBANANA2 = 'gemini-3.1-flash-image-preview';
 export const DEFAULT_IMAGE_MODEL = IMAGE_MODEL_NANOBANANA2;
@@ -50,6 +72,11 @@ export const SPEC_GENERATION_MODEL = IMAGE_MODEL_GPT_IMAGE_2;
 export const SPEC_GENERATION_ASPECT_RATIO = '16:9';
 export const SPEC_GENERATION_IMAGE_SIZE = '2K';
 export const ICON_DESCRIPTION_LIMIT = 100;
+export const DEFAULT_PUBLICATION_GAME_INFO: PublicationMaterialsGameInfo = {
+  gameName: '',
+  gameCategories: '',
+  gameDescription: '',
+};
 export const DEFAULT_ICON_DESCRIPTIONS = [
   '返回按钮',
   '设置按钮',
@@ -257,6 +284,9 @@ export function getLayerKindLabel(layer: CanvasLayer) {
   if (layer.assetKind === 'icon-spec') {
     return '图标规范';
   }
+  if (layer.assetKind === 'publication-material') {
+    return '宣发素材';
+  }
   if (layer.assetKind === 'ui-design') {
     return 'UI设计';
   }
@@ -288,6 +318,9 @@ export function formatLayerImageType(layer: CanvasLayer) {
   if (layer.assetKind === 'icon-spec') {
     return '图标素材规范图片';
   }
+  if (layer.assetKind === 'publication-material') {
+    return '宣发素材图片';
+  }
   if (layer.assetKind === 'ui-design') {
     return 'UI设计图';
   }
@@ -502,6 +535,71 @@ export function buildUiDesignGenerationInputs(
   };
 }
 
+function normalizePublicationGameInfo(
+  gameInfo: PublicationMaterialsGameInfo | null | undefined,
+): PublicationMaterialsGameInfo {
+  return {
+    gameName: gameInfo?.gameName?.trim() ?? '',
+    gameCategories: gameInfo?.gameCategories?.trim() ?? '',
+    gameDescription: gameInfo?.gameDescription?.trim() ?? '',
+  };
+}
+
+export function buildPublicationMaterialsPrompt(
+  gameInfo: PublicationMaterialsGameInfo | null | undefined,
+) {
+  const normalizedGameInfo = normalizePublicationGameInfo(gameInfo);
+  return [
+    ...createGenerationInputField('游戏名', normalizedGameInfo.gameName),
+    ...createGenerationInputField('游戏分类', normalizedGameInfo.gameCategories),
+    ...createGenerationInputField(
+      '一句话描述游戏',
+      normalizedGameInfo.gameDescription,
+    ),
+  ]
+    .map((field) => `${field.title}：${field.value}`)
+    .join('\n');
+}
+
+export function buildPublicationMaterialsGenerationPrompt({
+  gameInfo,
+  workflow,
+}: {
+  gameInfo: PublicationMaterialsGameInfo | null | undefined;
+  workflow: PublicationMaterialsWorkflow;
+}) {
+  const inputPrompt = buildPublicationMaterialsPrompt(gameInfo);
+  return [
+    `【宣发素材类型】${workflow.promptLabel ?? workflow.label}`,
+    inputPrompt ? `【游戏输入】\n${inputPrompt}` : '【游戏输入】\n请根据参考图生成宣发素材。',
+    `【生图约束】\n${workflow.promptConstraints.join('\n')}`,
+    `【参考图约束】\n${workflow.referenceConstraints.join('\n')}`,
+    `【输出检查】\n${workflow.postProcessConstraints.join('\n')}`,
+  ].join('\n\n');
+}
+
+export function buildPublicationMaterialsGenerationInputs(
+  gameInfo: PublicationMaterialsGameInfo | null | undefined,
+  references: CharacterReferenceImage[] | undefined,
+): CanvasGenerationInputs {
+  const normalizedGameInfo = normalizePublicationGameInfo(gameInfo);
+  return {
+    fields: [
+      ...createGenerationInputField('游戏名', normalizedGameInfo.gameName),
+      ...createGenerationInputField('游戏分类', normalizedGameInfo.gameCategories),
+      ...createGenerationInputField(
+        '一句话描述游戏',
+        normalizedGameInfo.gameDescription,
+      ),
+    ],
+    references: (references ?? []).map((reference, index) => ({
+      title: `宣发参考图 ${index + 1}`,
+      label: reference.label,
+      src: reference.src,
+    })),
+  };
+}
+
 export function buildIconGenerationInputs(
   iconDescriptions: string[],
   specReference: CharacterReferenceImage,
@@ -549,6 +647,7 @@ export function isCanvasGenerationDialog(
         dialog.mode === 'spec' ||
         dialog.mode === 'character' ||
         dialog.mode === 'icon' ||
+        dialog.mode === 'publication' ||
         dialog.mode === 'ui-design' ||
         dialog.mode === 'video' ||
         dialog.mode === 'audio-sound-effect' ||
@@ -568,6 +667,9 @@ export function getGenerationFrameAriaLabel(
   if (dialog.mode === 'icon') {
     return '图标素材生成占位图';
   }
+  if (dialog.mode === 'publication') {
+    return '宣发素材生成占位图';
+  }
   if (dialog.mode === 'ui-design') {
     return 'UI设计图生成占位图';
   }
@@ -593,6 +695,11 @@ export function getGenerationFrameLabel(dialog: CanvasGenerationDialogState) {
   if (dialog.mode === 'icon') {
     return 'Icon Generator';
   }
+  if (dialog.mode === 'publication') {
+    return `${getPublicationMaterialsWorkflow(
+      dialog.publicationWorkflowId ?? 'publication-cover-image',
+    ).englishName} Generator`;
+  }
   if (dialog.mode === 'ui-design') {
     return 'UI Design Generator';
   }
diff --git a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts
index 2aee4df21..6592e74cd 100644
--- a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts
+++ b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.test.ts
@@ -206,6 +206,144 @@ describe('ImageCanvasGenerationSubmissionModel', () => {
     });
   });
 
+  it('builds publication material plans with structured game fields', () => {
+    const plan = buildImageGenerationSubmissionPlan({
+      dialog: {
+        mode: 'publication',
+        prompt: '',
+        status: 'idle',
+        publicationGameInfo: {
+          gameName: ' 重庆洪崖洞火锅 ',
+          gameCategories: '抓大鹅、休闲、治愈、手绘风',
+          gameDescription: '在一堆物品里点击，找到三个一样的物品将其消除',
+        },
+        publicationReferences: [
+          {
+            id: 'ref-1',
+            label: '参考图',
+            src: 'data:image/png;base64,ref',
+          },
+        ],
+      },
+      layers: [],
+      nextGeneratedIndex: 10,
+    });
+
+    expect(plan).toEqual({
+      kind: 'image',
+      normalizedPrompt: [
+        '游戏名：重庆洪崖洞火锅',
+        '游戏分类：抓大鹅、休闲、治愈、手绘风',
+        '一句话描述游戏：在一堆物品里点击，找到三个一样的物品将其消除',
+      ].join('\n'),
+      input: {
+        prompt: expect.stringContaining('【宣发素材类型】游戏首图'),
+        size: '720x540',
+        kind: 'publication-material',
+        referenceImageSrcs: ['data:image/png;base64,ref'],
+      },
+      result: {
+        title: '10 宣发素材',
+        generationInputs: {
+          fields: [
+            { title: '游戏名', value: '重庆洪崖洞火锅' },
+            { title: '游戏分类', value: '抓大鹅、休闲、治愈、手绘风' },
+            {
+              title: '一句话描述游戏',
+              value: '在一堆物品里点击，找到三个一样的物品将其消除',
+            },
+          ],
+          references: [
+            {
+              title: '宣发参考图 1',
+              label: '参考图',
+              src: 'data:image/png;base64,ref',
+            },
+          ],
+        },
+      },
+    });
+    const prompt = plan.kind === 'image' ? plan.input.prompt : '';
+    expect(prompt).toContain('游戏名：重庆洪崖洞火锅');
+    expect(prompt).toContain('标题文字必须直接进入画面');
+    expect(prompt).toContain('输出检查：720 x 540，4:3');
+  });
+
+  it('builds detail gallery publication plans as one 720p portrait image', () => {
+    const plan = buildImageGenerationSubmissionPlan({
+      dialog: {
+        mode: 'publication',
+        prompt: '',
+        status: 'idle',
+        publicationWorkflowId: 'publication-detail-gallery',
+        publicationGameInfo: {
+          gameName: '云朵消消乐',
+          gameCategories: '',
+          gameDescription: '',
+        },
+      },
+      layers: [],
+      nextGeneratedIndex: 11,
+    });
+
+    expect(plan).toMatchObject({
+      kind: 'image',
+      input: {
+        prompt: expect.stringContaining('【宣发素材类型】详情页单图'),
+        size: '720x1280',
+        kind: 'publication-material',
+      },
+      result: {
+        title: '11 宣发素材',
+      },
+    });
+    expect(plan.kind === 'image' ? plan.input.prompt : '').toContain(
+      '本次只生成一张 720 x 1280 竖版详情图',
+    );
+    expect(plan.kind === 'image' ? plan.input.prompt : '').toContain(
+      '不是五图合集或拼贴',
+    );
+  });
+
+  it('builds promo poster publication plans as 720p landscape images', () => {
+    const plan = buildImageGenerationSubmissionPlan({
+      dialog: {
+        mode: 'publication',
+        prompt: '',
+        status: 'idle',
+        publicationWorkflowId: 'publication-promo-poster',
+        publicationGameInfo: {
+          gameName: '火锅节活动',
+          gameCategories: '',
+          gameDescription: '',
+        },
+      },
+      layers: [],
+      nextGeneratedIndex: 12,
+    });
+
+    expect(plan).toMatchObject({
+      kind: 'image',
+      input: {
+        prompt: expect.stringContaining('【宣发素材类型】运营海报'),
+        size: '1280x720',
+        kind: 'publication-material',
+      },
+      result: {
+        title: '12 宣发素材',
+      },
+    });
+    expect(plan.kind === 'image' ? plan.input.prompt : '').toContain(
+      '16:9 横版 720p，建议 1280 x 720',
+    );
+    expect(plan.kind === 'image' ? plan.input.prompt : '').toContain(
+      '此处换上你的游戏二维码',
+    );
+    expect(plan.kind === 'image' ? plan.input.prompt : '').toContain(
+      '方块内部上方用黑色小字',
+    );
+  });
+
   it('throws when edit source layer is missing', () => {
     expect(() =>
       buildImageGenerationSubmissionPlan({
diff --git a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts
index 23b357938..33c079338 100644
--- a/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts
+++ b/src/components/image-editor/ImageCanvasGenerationSubmissionModel.ts
@@ -18,6 +18,9 @@ import {
   buildEditGenerationInputs,
   buildIconGenerationInputs,
   buildImageGenerationInputs,
+  buildPublicationMaterialsGenerationInputs,
+  buildPublicationMaterialsGenerationPrompt,
+  buildPublicationMaterialsPrompt,
   buildSoundEffectGenerationInputs,
   buildSpecGenerationInputs,
   buildSpecPrompt,
@@ -40,6 +43,7 @@ import {
   SPEC_GENERATION_SIZE,
   SPEC_TYPE_LABEL,
 } from './ImageCanvasGenerationModel';
+import { getPublicationMaterialsWorkflow } from './ImageCanvasPublicationMaterialsModel';
 
 type ImageGenerationSubmissionOptions = {
   dialog: GenerateDialogState;
@@ -292,6 +296,42 @@ export function buildImageGenerationSubmissionPlan({
     };
   }
 
+  if (dialog.mode === 'publication') {
+    const workflow = getPublicationMaterialsWorkflow(
+      dialog.publicationWorkflowId ?? 'publication-cover-image',
+    );
+    const publicationPrompt =
+      buildPublicationMaterialsPrompt(dialog.publicationGameInfo) ||
+      normalizedPrompt;
+    const generationPrompt = buildPublicationMaterialsGenerationPrompt({
+      gameInfo: dialog.publicationGameInfo,
+      workflow,
+    });
+    return {
+      kind: 'image',
+      normalizedPrompt: publicationPrompt,
+      input: {
+        prompt: generationPrompt,
+        size: workflow.outputSize,
+        kind: 'publication-material',
+        ...(dialog.publicationReferences?.length
+          ? {
+              referenceImageSrcs: dialog.publicationReferences.map(
+                (reference) => reference.src,
+              ),
+            }
+          : {}),
+      },
+      result: {
+        title: `${nextGeneratedIndex} 宣发素材`,
+        generationInputs: buildPublicationMaterialsGenerationInputs(
+          dialog.publicationGameInfo,
+          dialog.publicationReferences,
+        ),
+      },
+    };
+  }
+
   if (dialog.mode === 'video') {
     const resolution = dialog.videoResolution ?? '480p';
     const durationSeconds = dialog.videoDurationSeconds ?? 4;
diff --git a/src/components/image-editor/ImageCanvasPublicationMaterialsDemoPanelView.tsx b/src/components/image-editor/ImageCanvasPublicationMaterialsDemoPanelView.tsx
new file mode 100644
index 000000000..37b1970f4
--- /dev/null
+++ b/src/components/image-editor/ImageCanvasPublicationMaterialsDemoPanelView.tsx
@@ -0,0 +1,305 @@
+import { ImagePlus } from 'lucide-react';
+import {
+  type CSSProperties,
+  type Dispatch,
+  type ReactNode,
+  type RefObject,
+  type SetStateAction,
+} from 'react';
+
+import { PlatformActionButton } from '../common/PlatformActionButton';
+import { PlatformFieldLabel } from '../common/PlatformFieldLabel';
+import {
+  PlatformFloatingMenu,
+  PlatformFloatingMenuItem,
+} from '../common/PlatformFloatingMenu';
+import { PlatformStatusMessage } from '../common/PlatformStatusMessage';
+import { PlatformTextField } from '../common/PlatformTextField';
+import type {
+  CharacterReferenceImage,
+  GenerateDialogState,
+  PublicationMaterialsGameInfo,
+  UploadTarget,
+} from './ImageCanvasEditorTypes';
+import {
+  buildPublicationMaterialsPrompt,
+  DEFAULT_PUBLICATION_GAME_INFO,
+} from './ImageCanvasGenerationModel';
+import type { PublicationMaterialsWorkflow } from './ImageCanvasPublicationMaterialsModel';
+
+type ImageCanvasPublicationMaterialsDemoPanelViewProps = {
+  dialog: GenerateDialogState;
+  workflow: PublicationMaterialsWorkflow;
+  style: CSSProperties;
+  publicationReferenceButtonRef: RefObject<HTMLButtonElement | null>;
+  isPublicationReferenceMenuOpen: boolean;
+  setGenerateDialog: Dispatch<SetStateAction<GenerateDialogState | null>>;
+  setIsPublicationReferenceMenuOpen: Dispatch<SetStateAction<boolean>>;
+  setIsPickingPublicationReferenceFromCanvas: Dispatch<SetStateAction<boolean>>;
+  renderEditorPortal: (node: ReactNode) => ReactNode;
+  buildPortalMenuStyle: (
+    anchor: HTMLElement | null,
+    placement: 'above' | 'below',
+  ) => CSSProperties;
+  onRequestUpload: (target: UploadTarget) => void;
+  onSubmit: (dialog: GenerateDialogState) => void;
+};
+
+function resetFailedDialogStatus(dialog: GenerateDialogState) {
+  return {
+    ...dialog,
+    status: dialog.status === 'failed' ? 'idle' : dialog.status,
+    errorMessage: dialog.status === 'failed' ? undefined : dialog.errorMessage,
+  };
+}
+
+function updatePublicationGameInfoField(
+  currentDialog: GenerateDialogState | null,
+  key: keyof PublicationMaterialsGameInfo,
+  value: string,
+): GenerateDialogState | null {
+  if (currentDialog?.mode !== 'publication') {
+    return currentDialog;
+  }
+  const publicationGameInfo = {
+    ...DEFAULT_PUBLICATION_GAME_INFO,
+    ...currentDialog.publicationGameInfo,
+    [key]: value,
+  };
+  return {
+    ...resetFailedDialogStatus(currentDialog),
+    publicationGameInfo,
+    prompt: buildPublicationMaterialsPrompt(publicationGameInfo),
+  };
+}
+
+function ReferenceThumb({
+  reference,
+  index,
+}: {
+  reference: CharacterReferenceImage;
+  index: number;
+}) {
+  return (
+    <span
+      className="image-canvas-editor__publication-ref-thumb"
+      title={reference.label}
+    >
+      <img src={reference.src} alt={reference.label} />
+      <span>{index + 1}</span>
+    </span>
+  );
+}
+
+export function ImageCanvasPublicationMaterialsDemoPanelView({
+  dialog,
+  workflow,
+  style,
+  publicationReferenceButtonRef,
+  isPublicationReferenceMenuOpen,
+  setGenerateDialog,
+  setIsPublicationReferenceMenuOpen,
+  setIsPickingPublicationReferenceFromCanvas,
+  renderEditorPortal,
+  buildPortalMenuStyle,
+  onRequestUpload,
+  onSubmit,
+}: ImageCanvasPublicationMaterialsDemoPanelViewProps) {
+  const references = dialog.publicationReferences ?? [];
+  const publicationGameInfo = {
+    ...DEFAULT_PUBLICATION_GAME_INFO,
+    ...dialog.publicationGameInfo,
+  };
+  return (
+    <form
+      className="image-canvas-editor__publication-composer"
+      style={style}
+      role="dialog"
+      aria-label={`${workflow.label}生成卡片`}
+      onPointerDown={(event) => event.stopPropagation()}
+      onSubmit={(event) => {
+        event.preventDefault();
+        onSubmit(dialog);
+      }}
+    >
+      <header className="image-canvas-editor__publication-composer-header">
+        <div>
+          <span>{workflow.outputLabel}</span>
+          <h2>{workflow.englishName}</h2>
+        </div>
+        <strong>{workflow.sizeLabel}</strong>
+      </header>
+
+      <div className="image-canvas-editor__publication-composer-fields">
+        <label>
+          <PlatformFieldLabel
+            variant="field"
+            className="image-canvas-editor__field-title"
+          >
+            游戏名
+          </PlatformFieldLabel>
+          <PlatformTextField
+            aria-label={`${workflow.label}游戏名`}
+            value={publicationGameInfo.gameName}
+            disabled={dialog.status === 'generating'}
+            placeholder="马戏团午夜惊魂"
+            size="sm"
+            density="compact"
+            className="image-canvas-editor__publication-input"
+            onChange={(event) =>
+              setGenerateDialog((currentDialog) =>
+                updatePublicationGameInfoField(
+                  currentDialog,
+                  'gameName',
+                  event.target.value,
+                ),
+              )
+            }
+          />
+        </label>
+        <label>
+          <PlatformFieldLabel
+            variant="field"
+            className="image-canvas-editor__field-title"
+          >
+            游戏分类
+          </PlatformFieldLabel>
+          <PlatformTextField
+            aria-label={`${workflow.label}游戏分类`}
+            value={publicationGameInfo.gameCategories}
+            disabled={dialog.status === 'generating'}
+            placeholder="非对称对抗"
+            size="sm"
+            density="compact"
+            className="image-canvas-editor__publication-input"
+            onChange={(event) =>
+              setGenerateDialog((currentDialog) =>
+                updatePublicationGameInfoField(
+                  currentDialog,
+                  'gameCategories',
+                  event.target.value,
+                ),
+              )
+            }
+          />
+        </label>
+        <label>
+          <PlatformFieldLabel
+            variant="field"
+            className="image-canvas-editor__field-title"
+          >
+            一句话描述游戏
+          </PlatformFieldLabel>
+          <PlatformTextField
+            variant="textarea"
+            aria-label={`${workflow.label}一句话描述游戏`}
+            value={publicationGameInfo.gameDescription}
+            disabled={dialog.status === 'generating'}
+            placeholder="神奇数字马戏团里，帕姆尼失控了，找到钥匙，开门逃离马戏团，千万别被抓住了"
+            size="sm"
+            density="compact"
+            className="image-canvas-editor__publication-description"
+            onChange={(event) =>
+              setGenerateDialog((currentDialog) =>
+                updatePublicationGameInfoField(
+                  currentDialog,
+                  'gameDescription',
+                  event.target.value,
+                ),
+              )
+            }
+          />
+        </label>
+        <div>
+          <PlatformFieldLabel
+            variant="field"
+            className="image-canvas-editor__field-title"
+          >
+            参考图
+          </PlatformFieldLabel>
+          <div className="image-canvas-editor__publication-reference-list">
+            {references.map((reference, index) => (
+              <ReferenceThumb
+                key={reference.id}
+                reference={reference}
+                index={index}
+              />
+            ))}
+            <button
+              ref={publicationReferenceButtonRef}
+              type="button"
+              className="image-canvas-editor__publication-reference-add image-canvas-editor__reference-tile image-canvas-editor__reference-tile--upload"
+              disabled={dialog.status === 'generating'}
+              onClick={() => setIsPublicationReferenceMenuOpen((open) => !open)}
+            >
+              <span className="image-canvas-editor__reference-tile-visual">
+                <ImagePlus className="h-4 w-4" aria-hidden="true" />
+              </span>
+              <span className="image-canvas-editor__reference-tile-copy">
+                添加参考图
+              </span>
+            </button>
+          </div>
+          {isPublicationReferenceMenuOpen
+            ? renderEditorPortal(
+                <PlatformFloatingMenu
+                  className="image-canvas-editor__publication-reference-menu image-canvas-editor__portal-menu"
+                  label="宣发素材参考图来源"
+                  placement="top-start"
+                  style={buildPortalMenuStyle(
+                    publicationReferenceButtonRef.current,
+                    'above',
+                  )}
+                >
+                  <PlatformFloatingMenuItem
+                    className="image-canvas-editor__context-menu-item"
+                    onClick={() => {
+                      setIsPickingPublicationReferenceFromCanvas(true);
+                      setIsPublicationReferenceMenuOpen(false);
+                    }}
+                  >
+                    从画布中选择
+                  </PlatformFloatingMenuItem>
+                  <PlatformFloatingMenuItem
+                    className="image-canvas-editor__context-menu-item"
+                    onClick={() => {
+                      setIsPublicationReferenceMenuOpen(false);
+                      onRequestUpload('publication-reference');
+                    }}
+                  >
+                    上传图片
+                  </PlatformFloatingMenuItem>
+                </PlatformFloatingMenu>,
+              )
+            : null}
+        </div>
+      </div>
+
+      {dialog.status === 'failed' ? (
+        <PlatformStatusMessage
+          tone="error"
+          surface="platform"
+          size="xs"
+          className="image-canvas-editor__generate-status"
+          role="alert"
+        >
+          {dialog.errorMessage}
+        </PlatformStatusMessage>
+      ) : null}
+
+      <footer className="image-canvas-editor__publication-composer-footer">
+        <span>{workflow.scenario}</span>
+        <PlatformActionButton
+          type="submit"
+          tone="secondary"
+          size="xs"
+          shape="pill"
+          className="image-canvas-editor__generation-submit"
+          disabled={dialog.status === 'generating'}
+        >
+          {dialog.status === 'generating' ? '生成中' : '消耗5泥点 · 生成'}
+        </PlatformActionButton>
+      </footer>
+    </form>
+  );
+}
diff --git a/src/components/image-editor/ImageCanvasPublicationMaterialsModel.ts b/src/components/image-editor/ImageCanvasPublicationMaterialsModel.ts
new file mode 100644
index 000000000..c757f19c8
--- /dev/null
+++ b/src/components/image-editor/ImageCanvasPublicationMaterialsModel.ts
@@ -0,0 +1,128 @@
+import type { PublicationMaterialsWorkflowId } from './ImageCanvasEditorTypes';
+
+export type PublicationMaterialsWorkflow = {
+  id: PublicationMaterialsWorkflowId;
+  label: string;
+  promptLabel?: string;
+  englishName: string;
+  outputLabel: string;
+  sizeLabel: string;
+  outputSize: string;
+  scenario: string;
+  fields: string[];
+  framework: string[];
+  promptConstraints: string[];
+  referenceConstraints: string[];
+  postProcessConstraints: string[];
+};
+
+export const PUBLICATION_MATERIALS_WORKFLOWS: PublicationMaterialsWorkflow[] = [
+  {
+    id: 'publication-cover-image',
+    label: '游戏首图',
+    englishName: 'Home Image',
+    outputLabel: '单张主视觉',
+    sizeLabel: '720 x 540',
+    outputSize: '720x540',
+    scenario: '推荐流、作品卡和首屏传播位',
+    fields: ['游戏名称', '玩法分类标签', '一句话玩法', '主视觉关键词', '必要文字'],
+    framework: [
+      '读取游戏基础信息和现有参考图',
+      '抽取核心玩法动作、主体物和城市/题材符号',
+      '生成一张带标题文字的横版主视觉',
+      '按首图尺寸、文字可读性和主体完整度验收',
+    ],
+    promptConstraints: [
+      '标题文字必须直接进入画面，优先使用游戏名称；标题应为清晰中文大字，少字、醒目、可读',
+      '画面只表达一个强主题，不拼贴多张小图，不做详情页合集，不做截图说明页',
+      '主体、玩法道具和背景层级必须清楚；核心主体适合小尺寸推荐卡，缩小后仍能一眼识别',
+      '标题与主体不能互相遮挡；主体不裁切，标题不贴边，四周保留安全边距',
+      '避免暗黑、脏污、低清、廉价拼贴、文字乱码、伪文字、英文标题、非中文标题、错误游戏名',
+    ],
+    referenceConstraints: [
+      '参考图只用于提取视觉约束：主体、玩法元素、色彩气质、画风、构图方向；不得照搬水印、边框、无关 UI、平台外壳或隐私信息',
+    ],
+    postProcessConstraints: [
+      '输出检查：720 x 540，4:3；主体完整不裁切；标题清晰可读；画面只有一个主视觉重点',
+      '输出 metadata 记录完整提示词、尺寸和参考图摘要',
+      '不做真实发布、不写作品数据，只作为画布素材候选',
+    ],
+  },
+  {
+    id: 'publication-detail-gallery',
+    label: '详情五图',
+    promptLabel: '详情页单图',
+    englishName: 'Detail Gallery',
+    outputLabel: '单张详情图',
+    sizeLabel: '720 x 1280',
+    outputSize: '720x1280',
+    scenario: '作品详情、应用介绍和运营分发图组',
+    fields: ['游戏名称', '玩法分类标签', '卖点拆解', '图组顺序', '必要文字'],
+    framework: [
+      '选择当前这张详情图要表达的单一卖点',
+      '生成一张带短标题的竖版详情页素材',
+      '让主体、玩法反馈和背景符号保持同一套游戏物料气质',
+      '按单图尺寸、标题可读性、主体完整度和非合集画面验收',
+    ],
+    promptConstraints: [
+      '本次只生成一张 720 x 1280 竖版详情图；不要把五张图合成一张长图、拼图、多分镜合集或截图说明页',
+      '每张图只承载一个卖点，短标题必须直接出现在画面中；标题用简短中文，不堆长句',
+      '画面保持与同一游戏后续详情图可组成一套：同一游戏名、同一主体物件体系、同一画风、同一色彩气质',
+      '构图要服务当前单一卖点，主体、玩法道具、反馈效果和背景层级清楚；核心信息缩小后仍能识别',
+      '短标题不能遮挡核心主体和玩法反馈；避免文字过密、小字不可读、UI 挡主体',
+      '连续生成多张详情图时，可以独立生成并允许顺序差异；同一批次复用同一份参考摘要，主动拉开角度、主体姿势和背景变化',
+      '避免五联图、分栏、多格漫画、长图合集、重复小图拼贴、文字乱码、伪文字、英文标题、非中文标题',
+    ],
+    referenceConstraints: [
+      '从参考图解析并统一：画风、主体物件、玩法道具、背景符号、地域/场景元素、色板和光影氛围',
+      '参考图只作为视觉理解来源，不照搬截图 UI、水印、边框、按钮、状态栏、弹窗或无关文字',
+    ],
+    postProcessConstraints: [
+      '输出检查：单张 720 x 1280 竖版；只表达一个卖点；标题不截断、不乱码；不是五图合集或拼贴',
+      'metadata 记录本张图的卖点、提示词和参考摘要',
+      '仅生成画布候选物料，不触发投放、分享或发布',
+    ],
+  },
+  {
+    id: 'publication-promo-poster',
+    label: '运营海报',
+    englishName: 'Promo Poster',
+    outputLabel: '单张活动海报',
+    sizeLabel: '1280 x 720',
+    outputSize: '1280x720',
+    scenario: '社群、活动、渠道投放和运营节日位',
+    fields: ['游戏名称', '活动主题', '玩法标签', '主文案', '行动指令'],
+    framework: [
+      '确认运营主题和投放场景',
+      '抽取游戏核心视觉符号和活动情绪',
+      '生成带主标题、卖点和行动指令的海报',
+      '按传播可读性、品牌一致性和尺寸验收',
+    ],
+    promptConstraints: [
+      '主标题、游戏名和行动指令必须清晰入画；三者要有明确层级，不能互相抢占',
+      '运营氛围可以更强，包括活动感、福利感、节日感、更新感，但不能脱离游戏玩法、主体物件和美术资产',
+      '版式必须预留二维码或平台标识位置，但不得生成假二维码、假平台 Logo、假按钮或不可识别图标',
+      '右下角必须保留一个干净的白色二维码留白方块，并在方块内部上方用黑色小字写“此处换上你的游戏二维码”；留白内不要生成假二维码',
+      '活动主题优先级高于普通详情介绍，但不得覆盖游戏识别；用户仍需一眼知道这是哪款游戏、什么玩法',
+      '避免夸张承诺、敏感营销词、虚假福利、价格折扣、具体日期、不可读小字、文字乱码、伪文字',
+    ],
+    referenceConstraints: [
+      '参考图用于锁定角色/主体物件、玩法道具、地域/场景符号、色彩气质和画风，不照搬参考图中的 UI、水印、边框或无关文字',
+    ],
+    postProcessConstraints: [
+      '输出检查：16:9 横版 720p，建议 1280 x 720；主标题最大，游戏名清楚，行动指令可读；右下角白色二维码留白方块干净，方块内部上方带有黑色小字“此处换上你的游戏二维码”',
+      'metadata 记录活动主题、文案、提示词和预留位说明',
+      '仅生成画布候选物料，不触发投放、分享或发布',
+    ],
+  },
+];
+
+export function getPublicationMaterialsWorkflow(
+  workflowId: PublicationMaterialsWorkflowId,
+): PublicationMaterialsWorkflow {
+  return (
+    PUBLICATION_MATERIALS_WORKFLOWS.find(
+      (workflow) => workflow.id === workflowId,
+    ) ?? PUBLICATION_MATERIALS_WORKFLOWS[0]!
+  );
+}
diff --git a/src/components/image-editor/ImageCanvasStageView.tsx b/src/components/image-editor/ImageCanvasStageView.tsx
index 43a5f0fba..fd63b6ada 100644
--- a/src/components/image-editor/ImageCanvasStageView.tsx
+++ b/src/components/image-editor/ImageCanvasStageView.tsx
@@ -32,6 +32,7 @@ export type ImageCanvasStageViewProps = {
   canvasViewportRef: RefObject<HTMLDivElement | null>;
   specToolWrapRef: RefObject<HTMLSpanElement | null>;
   musicToolWrapRef: RefObject<HTMLSpanElement | null>;
+  publicationToolWrapRef: RefObject<HTMLSpanElement | null>;
   isPanning: boolean;
   effectiveTool: CanvasTool;
   canvasBackgroundColor: string;
@@ -124,14 +125,19 @@ export type ImageCanvasStageViewProps = {
   onToggleMinimap: () => void;
   onMinimapPointerDown: (event: ReactPointerEvent<HTMLButtonElement>) => void;
   onSwitchTool: (tool: CanvasTool) => void;
-  onOpenToolOptions: (tool: Extract<CanvasTool, 'music' | 'spec'>) => void;
-  onCloseToolOptions: (tool: Extract<CanvasTool, 'music' | 'spec'>) => void;
+  onOpenToolOptions: (
+    tool: Extract<CanvasTool, 'music' | 'spec' | 'publication'>,
+  ) => void;
+  onCloseToolOptions: (
+    tool: Extract<CanvasTool, 'music' | 'spec' | 'publication'>,
+  ) => void;
 };
 
 export function ImageCanvasStageView({
   canvasViewportRef,
   specToolWrapRef,
   musicToolWrapRef,
+  publicationToolWrapRef,
   isPanning,
   effectiveTool,
   canvasBackgroundColor,
@@ -329,6 +335,7 @@ export function ImageCanvasStageView({
       <ImageCanvasBottomToolbarView
         specToolWrapRef={specToolWrapRef}
         musicToolWrapRef={musicToolWrapRef}
+        publicationToolWrapRef={publicationToolWrapRef}
         effectiveTool={effectiveTool}
         onSwitchTool={onSwitchTool}
         onOpenToolOptions={onOpenToolOptions}
diff --git a/src/components/image-editor/ImageCanvasUploadModel.ts b/src/components/image-editor/ImageCanvasUploadModel.ts
index d150f1835..3a3942f6c 100644
--- a/src/components/image-editor/ImageCanvasUploadModel.ts
+++ b/src/components/image-editor/ImageCanvasUploadModel.ts
@@ -30,7 +30,8 @@ type GenerationReferenceUploadTarget =
   | 'video-reference-audio'
   | 'icon-spec'
   | 'spec-reference'
-  | 'ui-design-icon-spec';
+  | 'ui-design-icon-spec'
+  | 'publication-reference';
 
 const VIDEO_REFERENCE_LIMITS = {
   image: 9,
@@ -152,6 +153,18 @@ export function applyGenerationReferenceUpload({
         }
       : dialog;
   }
+  if (target === 'publication-reference') {
+    return dialog?.mode === 'publication'
+      ? {
+          ...setFailedGenerationIdle(dialog),
+          publicationReferences: [
+            ...(dialog.publicationReferences ?? []),
+            ...references,
+          ],
+          composerOpen: true,
+        }
+      : dialog;
+  }
   if (target === 'generation-reference') {
     return dialog?.mode === 'generate' ||
       dialog?.mode === 'video' ||
diff --git a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx
index 87f02d44b..131bf6642 100644
--- a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx
+++ b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.test.tsx
@@ -1,6 +1,12 @@
 /* @vitest-environment jsdom */
 
-import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
+import {
+  act,
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+} from '@testing-library/react';
 import { useRef, useState } from 'react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
@@ -18,6 +24,9 @@ import { useCanvasGenerationDialogs } from './useCanvasGenerationDialogs';
 import { useImageCanvasGenerationSubmissionWorkflow } from './useImageCanvasGenerationSubmissionWorkflow';
 
 const resolveEditorImageReferenceDataUrlMock = vi.hoisted(() => vi.fn());
+const resolveEditorImageReferenceDataUrlForGenerationMock = vi.hoisted(() =>
+  vi.fn(),
+);
 const editEditorImageMock = vi.hoisted(() => vi.fn());
 const generateEditorCharacterAnimationMock = vi.hoisted(() => vi.fn());
 const generateEditorIconSpritesheetMock = vi.hoisted(() => vi.fn());
@@ -25,6 +34,8 @@ const generateEditorImageMock = vi.hoisted(() => vi.fn());
 
 vi.mock('../../services/image-editor/editorImageReference', () => ({
   resolveEditorImageReferenceDataUrl: resolveEditorImageReferenceDataUrlMock,
+  resolveEditorImageReferenceDataUrlForGeneration:
+    resolveEditorImageReferenceDataUrlForGenerationMock,
 }));
 
 vi.mock('../../services/image-editor/editorProjectClient', async () => {
@@ -216,10 +227,7 @@ function SubmissionWorkflowHarness({
       >
         填写快速编辑
       </button>
-      <button
-        type="button"
-        onClick={() => void workflow.submitQuickEdit()}
-      >
+      <button type="button" onClick={() => void workflow.submitQuickEdit()}>
         提交快速编辑
       </button>
       <button
@@ -273,6 +281,7 @@ function SubmissionWorkflowHarness({
 describe('useImageCanvasGenerationSubmissionWorkflow', () => {
   beforeEach(() => {
     resolveEditorImageReferenceDataUrlMock.mockReset();
+    resolveEditorImageReferenceDataUrlForGenerationMock.mockReset();
     editEditorImageMock.mockReset();
     generateEditorCharacterAnimationMock.mockReset();
     generateEditorIconSpritesheetMock.mockReset();
@@ -280,6 +289,9 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
     resolveEditorImageReferenceDataUrlMock.mockImplementation(
       async (src: string) => `data:image/png;base64,${src.split('/').pop()}`,
     );
+    resolveEditorImageReferenceDataUrlForGenerationMock.mockImplementation(
+      async (src: string) => src,
+    );
   });
 
   it('submits quick edits, clears the panel, and fits the source plus result', async () => {
@@ -416,6 +428,132 @@ describe('useImageCanvasGenerationSubmissionWorkflow', () => {
     );
   });
 
+  it('submits publication detail materials as one billable editor image and appends the result', async () => {
+    generateEditorImageMock.mockResolvedValueOnce(
+      createGenerated({
+        imageSrc: 'data:image/png;base64,publication',
+        width: 720,
+        height: 1280,
+        prompt: '游戏名：云朵消消乐',
+      }),
+    );
+    render(
+      <SubmissionWorkflowHarness
+        initialDialog={{
+          id: 'dialog-publication',
+          mode: 'publication',
+          prompt: '',
+          status: 'idle',
+          composerOpen: true,
+          publicationWorkflowId: 'publication-detail-gallery',
+          publicationGameInfo: {
+            gameName: '云朵消消乐',
+            gameCategories: '休闲消除',
+            gameDescription: '点击同类云朵完成消除',
+          },
+          publicationReferences: [
+            {
+              id: 'ref-1',
+              label: '主视觉参考',
+              src: 'data:image/png;base64,large-ref',
+            },
+          ],
+          placeholder: {
+            x: 180,
+            y: 120,
+            width: 360,
+            height: 640,
+            originalWidth: 720,
+            originalHeight: 1280,
+          },
+        }}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: '设置初始对话' }));
+    fireEvent.click(screen.getByRole('button', { name: '提交当前生成' }));
+
+    expect(screen.getByTestId('dialog').textContent).toBe(
+      'publication:generating:closed:-:placeholder:-',
+    );
+    await waitFor(() => {
+      expect(generateEditorImageMock).toHaveBeenCalledWith({
+        prompt: expect.stringContaining('【宣发素材类型】详情页单图'),
+        size: '720x1280',
+        kind: 'publication-material',
+        referenceImageSrcs: ['data:image/png;base64,large-ref'],
+      });
+    });
+    const prompt = generateEditorImageMock.mock.calls[0]?.[0]?.prompt ?? '';
+    expect(prompt).toContain('游戏名：云朵消消乐');
+    expect(prompt).toContain('本次只生成一张 720 x 1280 竖版详情图');
+    expect(prompt).toContain('不是五图合集或拼贴');
+    await waitFor(() => {
+      expect(screen.getByTestId('layers').textContent).toContain(
+        'layer-generated-1:1 宣发素材:-:-',
+      );
+    });
+    expect(screen.getByTestId('layers').textContent).not.toContain(
+      'layer-generated-2',
+    );
+    expect(screen.getByTestId('selected').textContent).toBe(
+      'layer-generated-1',
+    );
+  });
+
+  it('compresses publication references before submitting generation', async () => {
+    resolveEditorImageReferenceDataUrlForGenerationMock.mockResolvedValueOnce(
+      'data:image/jpeg;base64,compressed-ref',
+    );
+    generateEditorImageMock.mockResolvedValueOnce(
+      createGenerated({
+        imageSrc: 'data:image/png;base64,publication',
+        width: 720,
+        height: 540,
+        prompt: '游戏名：云朵消消乐',
+      }),
+    );
+    render(
+      <SubmissionWorkflowHarness
+        initialDialog={{
+          id: 'dialog-publication',
+          mode: 'publication',
+          prompt: '',
+          status: 'idle',
+          composerOpen: true,
+          publicationWorkflowId: 'publication-cover-image',
+          publicationGameInfo: {
+            gameName: '云朵消消乐',
+            gameCategories: '休闲消除',
+            gameDescription: '点击同类云朵完成消除',
+          },
+          publicationReferences: [
+            {
+              id: 'ref-1',
+              label: '主视觉参考',
+              src: 'data:image/png;base64,large-original-ref',
+            },
+          ],
+        }}
+      />,
+    );
+
+    fireEvent.click(screen.getByRole('button', { name: '设置初始对话' }));
+    fireEvent.click(screen.getByRole('button', { name: '提交当前生成' }));
+
+    await waitFor(() => {
+      expect(
+        resolveEditorImageReferenceDataUrlForGenerationMock,
+      ).toHaveBeenCalledWith('data:image/png;base64,large-original-ref');
+      expect(generateEditorImageMock).toHaveBeenCalledWith(
+        expect.objectContaining({
+          kind: 'publication-material',
+          referenceImageSrcs: ['data:image/jpeg;base64,compressed-ref'],
+        }),
+      );
+    });
+  });
+
   it('validates icon submission before calling the API', async () => {
     render(
       <SubmissionWorkflowHarness
diff --git a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts
index 8775ac9f8..b4865b5f1 100644
--- a/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts
+++ b/src/components/image-editor/useImageCanvasGenerationSubmissionWorkflow.ts
@@ -6,7 +6,10 @@ import {
   useMemo,
 } from 'react';
 
-import { resolveEditorImageReferenceDataUrl } from '../../services/image-editor/editorImageReference';
+import {
+  resolveEditorImageReferenceDataUrl,
+  resolveEditorImageReferenceDataUrlForGeneration,
+} from '../../services/image-editor/editorImageReference';
 import {
   editEditorImage,
   generateEditorBackgroundMusic,
@@ -82,6 +85,26 @@ type GenerationSubmissionWorkflowOptions = {
   persistGeneratedAsset?: (layer: CanvasLayer) => void;
 };
 
+async function normalizePublicationReferenceImages(
+  input: Parameters<typeof generateEditorImage>[0],
+) {
+  if (
+    input.kind !== 'publication-material' ||
+    !input.referenceImageSrcs?.length
+  ) {
+    return input;
+  }
+
+  return {
+    ...input,
+    referenceImageSrcs: await Promise.all(
+      input.referenceImageSrcs.map((referenceImageSrc) =>
+        resolveEditorImageReferenceDataUrlForGeneration(referenceImageSrc),
+      ),
+    ),
+  };
+}
+
 export function useImageCanvasGenerationSubmissionWorkflow({
   layers,
   canvasSize,
@@ -572,7 +595,9 @@ export function useImageCanvasGenerationSubmissionWorkflow({
             canvasDialog?.id,
           );
         } else {
-          const generated = await generateEditorImage(submissionPlan.input);
+          const generated = await generateEditorImage(
+            await normalizePublicationReferenceImages(submissionPlan.input),
+          );
           if (submissionPlan.rememberImageModel) {
             rememberImageModel(submissionPlan.rememberImageModel);
           }
diff --git a/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx b/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx
index c9ce1524d..21f307026 100644
--- a/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx
+++ b/src/components/image-editor/useImageCanvasGenerationSurface.test.tsx
@@ -60,10 +60,12 @@ function GenerationSurfaceHarness() {
   const layerCounterRef = useRef(0);
   const specToolWrapRef = useRef<HTMLSpanElement | null>(null);
   const musicToolWrapRef = useRef<HTMLSpanElement | null>(null);
+  const publicationToolWrapRef = useRef<HTMLSpanElement | null>(null);
   const characterSpecButtonRef = useRef<HTMLButtonElement | null>(null);
   const characterReferenceButtonRef = useRef<HTMLButtonElement | null>(null);
   const iconSpecButtonRef = useRef<HTMLButtonElement | null>(null);
   const generationReferenceButtonRef = useRef<HTMLButtonElement | null>(null);
+  const publicationReferenceButtonRef = useRef<HTMLButtonElement | null>(null);
   const [viewport, setViewport] = useState({ x: 10, y: 20, scale: 2 });
   const dialogs = useCanvasGenerationDialogs();
   const activeDialog = dialogs.generateDialog;
@@ -80,10 +82,12 @@ function GenerationSurfaceHarness() {
     layerCounterRef,
     specToolWrapRef,
     musicToolWrapRef,
+    publicationToolWrapRef,
     characterSpecButtonRef,
     characterReferenceButtonRef,
     iconSpecButtonRef,
     generationReferenceButtonRef,
+    publicationReferenceButtonRef,
     generateDialog: dialogs.generateDialog,
     setGenerateDialog: dialogs.setGenerateDialog,
     activeCanvasGenerationDialog: activeCanvasDialog,
@@ -116,6 +120,7 @@ function GenerationSurfaceHarness() {
       >
         音乐入口
       </span>
+      <span ref={publicationToolWrapRef}>宣发入口</span>
       <span data-testid="tool">{activeTool}</span>
       <span data-testid="sidebar">{activeSidebarPanel ?? '-'}</span>
       <span data-testid="dialog">
@@ -171,6 +176,12 @@ function GenerationSurfaceHarness() {
       >
         切换UI设计
       </button>
+      <button
+        type="button"
+        onClick={() => surface.switchGenerationTool('publication')}
+      >
+        切换宣发素材
+      </button>
       <button
         type="button"
         onClick={() => surface.switchGenerationTool('select')}
diff --git a/src/components/image-editor/useImageCanvasGenerationSurface.tsx b/src/components/image-editor/useImageCanvasGenerationSurface.tsx
index e31cb9f46..f51427f63 100644
--- a/src/components/image-editor/useImageCanvasGenerationSurface.tsx
+++ b/src/components/image-editor/useImageCanvasGenerationSurface.tsx
@@ -22,10 +22,12 @@ import type {
   CanvasViewport,
   GenerateDialogState,
   ImageContextMenuState,
+  PublicationMaterialsWorkflowId,
   SidebarPanel,
   UploadTarget,
 } from './ImageCanvasEditorTypes';
 import { ImageCanvasGenerationComposerView } from './ImageCanvasGenerationComposerView';
+import { PUBLICATION_MATERIALS_WORKFLOWS } from './ImageCanvasPublicationMaterialsModel';
 import {
   resolveCharacterAnimationPanelStyle,
   resolveCropExpandPanelStyle,
@@ -40,7 +42,7 @@ type CanvasGenerationDialogUpdater = (
   dialog: CanvasGenerationDialogState,
 ) => CanvasGenerationDialogState | null;
 
-type ToolbarOptionTool = Extract<CanvasTool, 'music' | 'spec'>;
+type ToolbarOptionTool = Extract<CanvasTool, 'music' | 'spec' | 'publication'>;
 
 type ImageCanvasGenerationSurfaceOptions = {
   layers: CanvasLayer[];
@@ -51,10 +53,12 @@ type ImageCanvasGenerationSurfaceOptions = {
   layerCounterRef: MutableRefObject<number>;
   specToolWrapRef: RefObject<HTMLSpanElement | null>;
   musicToolWrapRef: RefObject<HTMLSpanElement | null>;
+  publicationToolWrapRef: RefObject<HTMLSpanElement | null>;
   characterSpecButtonRef: RefObject<HTMLButtonElement | null>;
   characterReferenceButtonRef: RefObject<HTMLButtonElement | null>;
   iconSpecButtonRef: RefObject<HTMLButtonElement | null>;
   generationReferenceButtonRef: RefObject<HTMLButtonElement | null>;
+  publicationReferenceButtonRef: RefObject<HTMLButtonElement | null>;
   generateDialog: GenerateDialogState | null;
   setGenerateDialog: Dispatch<SetStateAction<GenerateDialogState | null>>;
   activeCanvasGenerationDialog: CanvasGenerationDialogState | null;
@@ -128,10 +132,12 @@ export function useImageCanvasGenerationSurface({
   layerCounterRef,
   specToolWrapRef,
   musicToolWrapRef,
+  publicationToolWrapRef,
   characterSpecButtonRef,
   characterReferenceButtonRef,
   iconSpecButtonRef,
   generationReferenceButtonRef,
+  publicationReferenceButtonRef,
   generateDialog,
   setGenerateDialog,
   activeCanvasGenerationDialog,
@@ -240,6 +246,7 @@ export function useImageCanvasGenerationSurface({
       clearToolbarOptionCloseTimer();
       generationWorkflow.setIsMusicMenuOpen(tool === 'music');
       generationWorkflow.setIsSpecMenuOpen(tool === 'spec');
+      generationWorkflow.setIsPublicationMenuOpen(tool === 'publication');
     },
     [clearToolbarOptionCloseTimer, generationWorkflow],
   );
@@ -252,6 +259,10 @@ export function useImageCanvasGenerationSurface({
           generationWorkflow.setIsMusicMenuOpen(false);
           return;
         }
+        if (tool === 'publication') {
+          generationWorkflow.setIsPublicationMenuOpen(false);
+          return;
+        }
         generationWorkflow.setIsSpecMenuOpen(false);
       }, TOOLBAR_OPTION_CLOSE_DELAY_MS);
     },
@@ -278,6 +289,11 @@ export function useImageCanvasGenerationSurface({
         setActiveTool('spec');
         return true;
       }
+      if (tool === 'publication') {
+        openToolbarOptionMenu('publication');
+        setActiveTool('publication');
+        return true;
+      }
       if (tool === 'character') {
         generationWorkflow.openCharacterGenerationDialog();
         return true;
@@ -299,10 +315,14 @@ export function useImageCanvasGenerationSurface({
     <>
       <ImageCanvasGenerationComposerView
         specToolWrapRef={specToolWrapRef}
+        publicationReferenceButtonRef={publicationReferenceButtonRef}
         characterSpecButtonRef={characterSpecButtonRef}
         characterReferenceButtonRef={characterReferenceButtonRef}
         generationReferenceButtonRef={generationReferenceButtonRef}
         iconSpecButtonRef={iconSpecButtonRef}
+        isPublicationReferenceMenuOpen={
+          generationWorkflow.isPublicationReferenceMenuOpen
+        }
         isSpecMenuOpen={generationWorkflow.isSpecMenuOpen}
         isGenerationReferenceMenuOpen={
           generationWorkflow.isGenerationReferenceMenuOpen
@@ -313,6 +333,9 @@ export function useImageCanvasGenerationSurface({
         }
         isIconSpecMenuOpen={generationWorkflow.isIconSpecMenuOpen}
         isUiDesignSpecMenuOpen={generationWorkflow.isUiDesignSpecMenuOpen}
+        isPickingPublicationReferenceFromCanvas={
+          generationWorkflow.isPickingPublicationReferenceFromCanvas
+        }
         isPickingGenerationReferenceFromCanvas={
           generationWorkflow.isPickingGenerationReferenceFromCanvas
         }
@@ -360,11 +383,17 @@ export function useImageCanvasGenerationSurface({
         setIsGenerationReferenceMenuOpen={
           generationWorkflow.setIsGenerationReferenceMenuOpen
         }
+        setIsPublicationReferenceMenuOpen={
+          generationWorkflow.setIsPublicationReferenceMenuOpen
+        }
         setIsIconSpecMenuOpen={generationWorkflow.setIsIconSpecMenuOpen}
         setIsUiDesignSpecMenuOpen={generationWorkflow.setIsUiDesignSpecMenuOpen}
         setIsPickingGenerationReferenceFromCanvas={
           generationWorkflow.setIsPickingGenerationReferenceFromCanvas
         }
+        setIsPickingPublicationReferenceFromCanvas={
+          generationWorkflow.setIsPickingPublicationReferenceFromCanvas
+        }
         setIsPickingCharacterSpecFromCanvas={
           generationWorkflow.setIsPickingCharacterSpecFromCanvas
         }
@@ -402,6 +431,35 @@ export function useImageCanvasGenerationSurface({
         onSpecMenuPointerEnter={() => openToolbarOptionMenu('spec')}
         onSpecMenuPointerLeave={() => closeToolbarOptionMenu('spec')}
       />
+      {generationWorkflow.isPublicationMenuOpen
+        ? renderEditorPortal(
+            <PlatformFloatingMenu
+              className="image-canvas-editor__spec-menu image-canvas-editor__portal-menu image-canvas-editor__publication-menu"
+              label="宣发素材类型"
+              placement="top-start"
+              style={buildToolbarPortalMenuStyle(
+                publicationToolWrapRef.current,
+              )}
+              onPointerEnter={() => openToolbarOptionMenu('publication')}
+              onPointerLeave={() => closeToolbarOptionMenu('publication')}
+              onFocus={() => openToolbarOptionMenu('publication')}
+              onBlur={() => closeToolbarOptionMenu('publication')}
+            >
+              {PUBLICATION_MATERIALS_WORKFLOWS.map((workflow) => (
+                <PlatformFloatingMenuItem
+                  key={workflow.id}
+                  onClick={() =>
+                    generationWorkflow.openPublicationGenerationDialog(
+                      workflow.id as PublicationMaterialsWorkflowId,
+                    )
+                  }
+                >
+                  {workflow.label}
+                </PlatformFloatingMenuItem>
+              ))}
+            </PlatformFloatingMenu>,
+          )
+        : null}
       {generationWorkflow.isMusicMenuOpen
         ? renderEditorPortal(
             <PlatformFloatingMenu
diff --git a/src/components/image-editor/useImageCanvasGenerationWorkflow.ts b/src/components/image-editor/useImageCanvasGenerationWorkflow.ts
index c570f405c..f8d448e85 100644
--- a/src/components/image-editor/useImageCanvasGenerationWorkflow.ts
+++ b/src/components/image-editor/useImageCanvasGenerationWorkflow.ts
@@ -16,6 +16,7 @@ import type {
   CropExpandPanelState,
   GenerateDialogState,
   ImageContextMenuState,
+  PublicationMaterialsWorkflowId,
   QuickEditPanelState,
   SidebarPanel,
   SpecFormValues,
@@ -24,6 +25,7 @@ import type {
 import {
   appendCharacterReference,
   appendGenerationReference,
+  appendPublicationReference,
   assignCharacterSpecReference,
   assignIconSpecReference,
   assignUiDesignSpecReference,
@@ -34,6 +36,7 @@ import {
   createEditDialogDraft,
   createGenerateDialogDraft,
   createIconGenerationDialogDraft,
+  createPublicationGenerationDialogDraft,
   createQuickEditPanelDraft,
   createRedrawPanelDraft,
   createSoundEffectGenerationDialogDraft,
@@ -156,6 +159,13 @@ export function useImageCanvasGenerationWorkflow({
   const [isPickingUiDesignSpecFromCanvas, setIsPickingUiDesignSpecFromCanvas] =
     useState(false);
   const [isMusicMenuOpen, setIsMusicMenuOpen] = useState(false);
+  const [isPublicationMenuOpen, setIsPublicationMenuOpen] = useState(false);
+  const [isPublicationReferenceMenuOpen, setIsPublicationReferenceMenuOpen] =
+    useState(false);
+  const [
+    isPickingPublicationReferenceFromCanvas,
+    setIsPickingPublicationReferenceFromCanvas,
+  ] = useState(false);
   const [quickEditPanel, setQuickEditPanel] =
     useState<QuickEditPanelState | null>(null);
   const [cropExpandPanel, setCropExpandPanel] =
@@ -217,6 +227,9 @@ export function useImageCanvasGenerationWorkflow({
     setIsUiDesignSpecMenuOpen(false);
     setIsPickingUiDesignSpecFromCanvas(false);
     setIsMusicMenuOpen(false);
+    setIsPublicationMenuOpen(false);
+    setIsPublicationReferenceMenuOpen(false);
+    setIsPickingPublicationReferenceFromCanvas(false);
     setImageContextMenu(null);
   }, [setImageContextMenu]);
 
@@ -345,6 +358,25 @@ export function useImageCanvasGenerationWorkflow({
     viewport,
   ]);
 
+  const openPublicationGenerationDialog = useCallback(
+    (workflowId: PublicationMaterialsWorkflowId) => {
+      openPlacedCanvasGenerationDialog(
+        createPublicationGenerationDialogDraft({
+          canvasSize,
+          viewport,
+          workflowId,
+        }),
+      );
+      activateCanvasGenerationEntry('publication');
+    },
+    [
+      activateCanvasGenerationEntry,
+      canvasSize,
+      openPlacedCanvasGenerationDialog,
+      viewport,
+    ],
+  );
+
   const openVideoGenerationDialog = useCallback(() => {
     openPlacedCanvasGenerationDialog(
       createVideoGenerationDialogDraft({ canvasSize, viewport }),
@@ -661,6 +693,18 @@ export function useImageCanvasGenerationWorkflow({
     [setGenerateDialog, setImageContextMenu],
   );
 
+  const pickPublicationReferenceFromLayer = useCallback(
+    (layer: CanvasLayer) => {
+      setGenerateDialog((currentDialog) =>
+        appendPublicationReference(currentDialog, layer),
+      );
+      setIsPickingPublicationReferenceFromCanvas(false);
+      setIsPublicationReferenceMenuOpen(false);
+      setImageContextMenu(null);
+    },
+    [setGenerateDialog, setImageContextMenu],
+  );
+
   const updateIconDescriptionsText = useCallback(
     (value: string) => {
       setGenerateDialog((currentDialog) =>
@@ -790,11 +834,18 @@ export function useImageCanvasGenerationWorkflow({
       setIsPickingUiDesignSpecFromCanvas,
       isMusicMenuOpen,
       setIsMusicMenuOpen,
+      isPublicationMenuOpen,
+      setIsPublicationMenuOpen,
+      isPublicationReferenceMenuOpen,
+      setIsPublicationReferenceMenuOpen,
+      isPickingPublicationReferenceFromCanvas,
+      setIsPickingPublicationReferenceFromCanvas,
       openGenerateDialog,
       openSpecDialog,
       openCharacterAnimationPanel,
       openCharacterGenerationDialog,
       openIconGenerationDialog,
+      openPublicationGenerationDialog,
       openVideoGenerationDialog,
       openUiDesignGenerationDialog,
       openSoundEffectGenerationDialog,
@@ -809,6 +860,7 @@ export function useImageCanvasGenerationWorkflow({
       pickCharacterReferenceFromLayer,
       pickIconSpecFromLayer,
       pickUiDesignSpecFromLayer,
+      pickPublicationReferenceFromLayer,
       submitIconSpritesheetGeneration,
       submitQuickEdit,
       submitCropExpand,
@@ -843,7 +895,10 @@ export function useImageCanvasGenerationWorkflow({
       isPickingUiDesignSpecFromCanvas,
       isUiDesignSpecMenuOpen,
       isMusicMenuOpen,
+      isPublicationMenuOpen,
+      isPublicationReferenceMenuOpen,
       isSpecMenuOpen,
+      isPickingPublicationReferenceFromCanvas,
       openBackgroundMusicGenerationDialog,
       openCharacterAnimationPanel,
       openCharacterGenerationDialog,
@@ -851,6 +906,7 @@ export function useImageCanvasGenerationWorkflow({
       openEditDialog,
       openGenerateDialog,
       openIconGenerationDialog,
+      openPublicationGenerationDialog,
       openRedrawPanel,
       openUiDesignGenerationDialog,
       openQuickEditPanel,
@@ -861,6 +917,7 @@ export function useImageCanvasGenerationWorkflow({
       pickCharacterSpecFromLayer,
       pickGenerationReferenceFromLayer,
       pickIconSpecFromLayer,
+      pickPublicationReferenceFromLayer,
       pickUiDesignSpecFromLayer,
       quickEditModelOptions,
       quickEditPanel,
diff --git a/src/components/image-editor/useImageCanvasStageInteractions.test.tsx b/src/components/image-editor/useImageCanvasStageInteractions.test.tsx
index 8b8fe15fa..aaefa0193 100644
--- a/src/components/image-editor/useImageCanvasStageInteractions.test.tsx
+++ b/src/components/image-editor/useImageCanvasStageInteractions.test.tsx
@@ -183,6 +183,7 @@ function StageInteractionsHarness({
     isPickingCharacterReferenceFromCanvas: false,
     isPickingIconSpecFromCanvas: false,
     isPickingUiDesignSpecFromCanvas: false,
+    isPickingPublicationReferenceFromCanvas: false,
     clearCanvasFocus: () => {
       setSelectedLayerId(null);
       setSelectedLayerIds([]);
@@ -193,6 +194,7 @@ function StageInteractionsHarness({
     pickCharacterReferenceFromLayer: vi.fn(),
     pickIconSpecFromLayer,
     pickUiDesignSpecFromLayer: vi.fn(),
+    pickPublicationReferenceFromLayer: vi.fn(),
     activateCanvasGenerationDialog,
     updateCanvasGenerationDialogById: (dialogId, updater) => {
       setGenerateDialog((currentDialog) => {
diff --git a/src/components/image-editor/useImageCanvasStageInteractions.ts b/src/components/image-editor/useImageCanvasStageInteractions.ts
index 6d967a6f2..7d00e3a6a 100644
--- a/src/components/image-editor/useImageCanvasStageInteractions.ts
+++ b/src/components/image-editor/useImageCanvasStageInteractions.ts
@@ -58,12 +58,14 @@ type UseImageCanvasStageInteractionsOptions = {
   isPickingCharacterReferenceFromCanvas: boolean;
   isPickingIconSpecFromCanvas: boolean;
   isPickingUiDesignSpecFromCanvas: boolean;
+  isPickingPublicationReferenceFromCanvas: boolean;
   clearCanvasFocus: () => void;
   pickCharacterSpecFromLayer: (layer: CanvasLayer) => void;
   pickGenerationReferenceFromLayer: (layer: CanvasLayer) => void;
   pickCharacterReferenceFromLayer: (layer: CanvasLayer) => void;
   pickIconSpecFromLayer: (layer: CanvasLayer) => void;
   pickUiDesignSpecFromLayer: (layer: CanvasLayer) => void;
+  pickPublicationReferenceFromLayer: (layer: CanvasLayer) => void;
   activateCanvasGenerationDialog: (
     dialog: CanvasGenerationDialogState,
   ) => void;
@@ -100,12 +102,14 @@ export function useImageCanvasStageInteractions({
   isPickingCharacterReferenceFromCanvas,
   isPickingIconSpecFromCanvas,
   isPickingUiDesignSpecFromCanvas,
+  isPickingPublicationReferenceFromCanvas,
   clearCanvasFocus,
   pickCharacterSpecFromLayer,
   pickGenerationReferenceFromLayer,
   pickCharacterReferenceFromLayer,
   pickIconSpecFromLayer,
   pickUiDesignSpecFromLayer,
+  pickPublicationReferenceFromLayer,
   activateCanvasGenerationDialog,
   updateCanvasGenerationDialogById,
   moveViewportFromMinimapPointer,
@@ -247,6 +251,16 @@ export function useImageCanvasStageInteractions({
         pickUiDesignSpecFromLayer(layer);
         return;
       }
+      if (
+        isPickingPublicationReferenceFromCanvas &&
+        generateDialog?.mode === 'publication'
+      ) {
+        event.preventDefault();
+        event.stopPropagation();
+        suppressNextLayerClickRef.current = true;
+        pickPublicationReferenceFromLayer(layer);
+        return;
+      }
 
       event.preventDefault();
       event.stopPropagation();
@@ -277,11 +291,13 @@ export function useImageCanvasStageInteractions({
       isPickingGenerationReferenceFromCanvas,
       isPickingCharacterReferenceFromCanvas,
       isPickingIconSpecFromCanvas,
+      isPickingPublicationReferenceFromCanvas,
       layers,
       pickGenerationReferenceFromLayer,
       pickCharacterReferenceFromLayer,
       pickCharacterSpecFromLayer,
       pickIconSpecFromLayer,
+      pickPublicationReferenceFromLayer,
       pickUiDesignSpecFromLayer,
       selectedLayerIds,
       setGenerateDialog,
@@ -313,6 +329,9 @@ export function useImageCanvasStageInteractions({
       if (isPickingIconSpecFromCanvas) {
         return;
       }
+      if (isPickingPublicationReferenceFromCanvas) {
+        return;
+      }
       if (event.shiftKey || isShiftPressedRef.current) {
         return;
       }
@@ -328,6 +347,7 @@ export function useImageCanvasStageInteractions({
       isPickingGenerationReferenceFromCanvas,
       isPickingCharacterReferenceFromCanvas,
       isPickingIconSpecFromCanvas,
+      isPickingPublicationReferenceFromCanvas,
       onCloseImageContextMenu,
       setGenerateDialog,
       setSelectedLayerId,
diff --git a/src/components/image-editor/useImageCanvasUploadWorkflow.ts b/src/components/image-editor/useImageCanvasUploadWorkflow.ts
index 6758ddbbc..46afffa06 100644
--- a/src/components/image-editor/useImageCanvasUploadWorkflow.ts
+++ b/src/components/image-editor/useImageCanvasUploadWorkflow.ts
@@ -237,6 +237,40 @@ export function useImageCanvasUploadWorkflow({
     [setGenerateDialog],
   );
 
+  const addPublicationReferenceFiles = useCallback(
+    async (files: FileList | File[]) => {
+      const imageFiles = Array.from(files).filter(isImageFile);
+      if (!imageFiles.length) {
+        window.alert('请选择图片文件');
+        return;
+      }
+
+      const references = await Promise.all(
+        imageFiles.map(async (file, index) => ({
+          file,
+          index,
+          imageSrc: await readImageFileAsDataUrl(file),
+        })),
+      );
+      setGenerateDialog((currentDialog) =>
+        applyGenerationReferenceUpload({
+          dialog: currentDialog,
+          target: 'publication-reference',
+          references: references.map(({ file, imageSrc, index }) =>
+            createUploadedGenerationReference({
+              idPrefix: 'upload-publication-reference',
+              index,
+              fileName: file.name,
+              fallbackLabel: `宣发参考图${index + 1}`,
+              imageSrc,
+            }),
+          ),
+        }),
+      );
+    },
+    [setGenerateDialog],
+  );
+
   const addVideoReferenceImageFiles = useCallback(
     async (files: FileList | File[]) => {
       const imageFiles = Array.from(files).filter(isSeedanceReferenceImageFile);
@@ -756,6 +790,8 @@ export function useImageCanvasUploadWorkflow({
           void addSpecReferenceFiles(files);
         } else if (currentUploadTarget === 'generation-reference') {
           void addGenerationReferenceFiles(files);
+        } else if (currentUploadTarget === 'publication-reference') {
+          void addPublicationReferenceFiles(files);
         } else if (currentUploadTarget === 'video-reference-image') {
           void addVideoReferenceImageFiles(files);
         } else if (currentUploadTarget === 'video-reference-video') {
@@ -782,6 +818,7 @@ export function useImageCanvasUploadWorkflow({
       addCharacterReferenceFiles,
       addCharacterSpecReferenceFiles,
       addGenerationReferenceFiles,
+      addPublicationReferenceFiles,
       addVideoReferenceImageFiles,
       addVideoReferenceVideoFiles,
       addVideoReferenceAudioFiles,
@@ -804,6 +841,7 @@ export function useImageCanvasUploadWorkflow({
     addCharacterSpecReferenceFiles,
     addCharacterReferenceFiles,
     addGenerationReferenceFiles,
+    addPublicationReferenceFiles,
     addVideoReferenceImageFiles,
     addVideoReferenceVideoFiles,
     addVideoReferenceAudioFiles,
diff --git a/src/services/image-editor/editorImageReference.test.ts b/src/services/image-editor/editorImageReference.test.ts
index b2d44518d..20f53954b 100644
--- a/src/services/image-editor/editorImageReference.test.ts
+++ b/src/services/image-editor/editorImageReference.test.ts
@@ -1,6 +1,9 @@
 import { afterEach, describe, expect, it, vi } from 'vitest';
 
-import { resolveEditorImageReferenceDataUrl } from './editorImageReference';
+import {
+  compressEditorImageReferenceDataUrlForGeneration,
+  resolveEditorImageReferenceDataUrl,
+} from './editorImageReference';
 
 describe('editorImageReference', () => {
   afterEach(() => {
@@ -27,7 +30,17 @@ describe('editorImageReference', () => {
     );
 
     await expect(
-      resolveEditorImageReferenceDataUrl('/creation-type-references/puzzle.webp'),
+      resolveEditorImageReferenceDataUrl(
+        '/creation-type-references/puzzle.webp',
+      ),
     ).resolves.toBe('data:image/webp;base64,aGVsbG8=');
   });
+
+  it('keeps generation references unchanged when browser canvas is unavailable', async () => {
+    await expect(
+      compressEditorImageReferenceDataUrlForGeneration(
+        'data:image/png;base64,large-reference',
+      ),
+    ).resolves.toBe('data:image/png;base64,large-reference');
+  });
 });
diff --git a/src/services/image-editor/editorImageReference.ts b/src/services/image-editor/editorImageReference.ts
index 54fb8e455..ce23faa35 100644
--- a/src/services/image-editor/editorImageReference.ts
+++ b/src/services/image-editor/editorImageReference.ts
@@ -1,5 +1,15 @@
 import { readAssetBytes } from '../assetReadUrlService';
 
+const GENERATION_REFERENCE_MAX_EDGE = 1280;
+const GENERATION_REFERENCE_QUALITY = 0.82;
+const GENERATION_REFERENCE_MIME_TYPE = 'image/jpeg';
+
+type EditorImageReferenceCompressionOptions = {
+  maxEdge?: number;
+  quality?: number;
+  mimeType?: string;
+};
+
 function normalizeImageContentType(contentType: string | null) {
   const mimeType = contentType?.split(';')[0]?.trim().toLowerCase() ?? '';
   return mimeType.startsWith('image/') ? mimeType : 'image/png';
@@ -9,7 +19,9 @@ function encodeBytesAsBase64(bytes: Uint8Array) {
   let binary = '';
   const chunkSize = 0x8000;
   for (let offset = 0; offset < bytes.length; offset += chunkSize) {
-    binary += String.fromCharCode(...bytes.subarray(offset, offset + chunkSize));
+    binary += String.fromCharCode(
+      ...bytes.subarray(offset, offset + chunkSize),
+    );
   }
   return btoa(binary);
 }
@@ -38,7 +50,9 @@ export async function resolveEditorImageReferenceDataUrl(
     signal,
     expireSeconds: 300,
   });
-  const mimeType = normalizeImageContentType(response.headers.get('Content-Type'));
+  const mimeType = normalizeImageContentType(
+    response.headers.get('Content-Type'),
+  );
   const bytes = new Uint8Array(await response.arrayBuffer());
   if (bytes.byteLength <= 0) {
     throw new Error('图片参考图为空');
@@ -46,3 +60,75 @@ export async function resolveEditorImageReferenceDataUrl(
 
   return `data:${mimeType};base64,${encodeBytesAsBase64(bytes)}`;
 }
+
+function loadImageDataUrl(dataUrl: string) {
+  return new Promise<HTMLImageElement>((resolve, reject) => {
+    if (typeof Image === 'undefined') {
+      reject(new Error('当前环境不支持图片压缩'));
+      return;
+    }
+
+    const image = new Image();
+    image.onload = () => resolve(image);
+    image.onerror = () => reject(new Error('参考图读取失败'));
+    image.src = dataUrl;
+  });
+}
+
+export async function compressEditorImageReferenceDataUrlForGeneration(
+  dataUrl: string,
+  options: EditorImageReferenceCompressionOptions = {},
+) {
+  if (!dataUrl.startsWith('data:image/') || typeof document === 'undefined') {
+    return dataUrl;
+  }
+
+  const maxEdge = Math.max(1, options.maxEdge ?? GENERATION_REFERENCE_MAX_EDGE);
+  const quality = Math.min(
+    1,
+    Math.max(0.1, options.quality ?? GENERATION_REFERENCE_QUALITY),
+  );
+  const mimeType = options.mimeType ?? GENERATION_REFERENCE_MIME_TYPE;
+
+  try {
+    const image = await loadImageDataUrl(dataUrl);
+    const sourceWidth = image.naturalWidth || image.width;
+    const sourceHeight = image.naturalHeight || image.height;
+    if (sourceWidth <= 0 || sourceHeight <= 0) {
+      return dataUrl;
+    }
+
+    const scale = Math.min(1, maxEdge / Math.max(sourceWidth, sourceHeight));
+    const targetWidth = Math.max(1, Math.round(sourceWidth * scale));
+    const targetHeight = Math.max(1, Math.round(sourceHeight * scale));
+    const canvas = document.createElement('canvas');
+    canvas.width = targetWidth;
+    canvas.height = targetHeight;
+    const context = canvas.getContext('2d');
+    if (!context) {
+      return dataUrl;
+    }
+
+    // 中文注释：参考图只用于模型理解视觉方向，提交前压缩可避免原图 Data URL 撑爆 JSON 请求体。
+    if (mimeType === 'image/jpeg') {
+      context.fillStyle = '#fff';
+      context.fillRect(0, 0, targetWidth, targetHeight);
+    }
+    context.drawImage(image, 0, 0, targetWidth, targetHeight);
+    const compressed = canvas.toDataURL(mimeType, quality);
+    return compressed.startsWith('data:image/') &&
+      compressed.length < dataUrl.length
+      ? compressed
+      : dataUrl;
+  } catch {
+    return dataUrl;
+  }
+}
+
+export async function resolveEditorImageReferenceDataUrlForGeneration(
+  source: string,
+  signal?: AbortSignal,
+) {
+  const dataUrl = await resolveEditorImageReferenceDataUrl(source, signal);
+  return compressEditorImageReferenceDataUrlForGeneration(dataUrl);
+}
diff --git a/src/services/image-editor/editorProjectClient.test.ts b/src/services/image-editor/editorProjectClient.test.ts
index db886302a..4569996d6 100644
--- a/src/services/image-editor/editorProjectClient.test.ts
+++ b/src/services/image-editor/editorProjectClient.test.ts
@@ -707,6 +707,47 @@ describe('editorProjectClient', () => {
     );
   });
 
+  it('passes publication material generation kind and size to the backend BFF', async () => {
+    requestJsonMock.mockResolvedValueOnce({
+      imageSrc: 'data:image/png;base64,publication',
+      width: 720,
+      height: 1280,
+      sourceType: 'generated',
+      prompt: '宣发素材 prompt',
+      actualPrompt: '宣发素材 prompt',
+      model: 'gpt-image-2',
+      provider: 'VectorEngine',
+      taskId: 'vector-publication-1',
+    });
+
+    const result = await generateEditorImage({
+      prompt: '宣发素材 prompt',
+      size: '720x1280',
+      kind: 'publication-material',
+      referenceImageSrcs: ['data:image/png;base64,ref'],
+    });
+
+    expect(result.height).toBe(1280);
+    expect(requestJsonMock).toHaveBeenCalledWith(
+      '/api/editor/images/generations',
+      expect.objectContaining({
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({
+          prompt: '宣发素材 prompt',
+          size: '720x1280',
+          kind: 'publication-material',
+          referenceImageSrcs: ['data:image/png;base64,ref'],
+        }),
+      }),
+      '生成图片失败',
+      expect.objectContaining({
+        timeoutMs: 1_200_000,
+        retry: { maxRetries: 0 },
+      }),
+    );
+  });
+
   it('generates editor character animations through the backend BFF', async () => {
     requestJsonMock.mockResolvedValueOnce({
       taskId: 'character-animation-1',
diff --git a/src/services/image-editor/editorProjectClient.ts b/src/services/image-editor/editorProjectClient.ts
index 62f3f47ce..93165c6bd 100644
--- a/src/services/image-editor/editorProjectClient.ts
+++ b/src/services/image-editor/editorProjectClient.ts
@@ -88,7 +88,12 @@ export type EditorAssetLibrarySnapshot = {
 export type EditorImageGenerationInput = {
   prompt: string;
   size?: string;
-  kind?: 'spec' | 'character' | 'quick-edit' | 'ui-design';
+  kind?:
+    | 'spec'
+    | 'character'
+    | 'quick-edit'
+    | 'ui-design'
+    | 'publication-material';
   model?: string;
   aspectRatio?: string;
   imageSize?: string;