diff --git a/docs/01-product-vision.md b/docs/01-product-vision.md
new file mode 100644
index 0000000..23970e9
--- /dev/null
+++ b/docs/01-product-vision.md
@@ -0,0 +1,34 @@
+# 自动合成印花服饰效果图工具项目愿景
+
+## 项目是什么
+
+自动合成印花服饰效果图工具是一款本地桌面软件，用于把印花图片叠加到衣服底图的指定位置，生成服饰印花效果图。
+
+它面向日常打样、上架、沟通和批量制图场景，核心价值是让用户用更少步骤完成衣服底图、印花图和蒙版图之间的合成工作。
+
+## 给谁用
+
+- 服饰定制、印花和打样相关工作人员。
+- 需要批量生成 T 恤、卫衣等服饰效果图的设计、运营或生产支持人员。
+- 在局域网多台电脑上共同使用同一类制图工具的小团队。
+
+## 为什么存在
+
+手工使用图片编辑软件逐张制作印花效果图效率低、重复操作多，也容易因为坐标、尺寸和角度不一致导致效果不稳定。
+
+本项目存在的目的是把这类重复性制图流程工具化：
+
+- 降低非专业修图人员生成效果图的门槛。
+- 提高单张和批量合成效率。
+- 让印花位置、尺寸、旋转和模板参数更容易复用。
+- 减少多台电脑、多名使用者之间的操作差异。
+- 保持本地运行，适应不依赖公网服务的工作环境。
+
+## 不做什么
+
+- 不做完整的专业图片编辑软件，不替代 Photoshop 等工具。
+- 不做在线 SaaS 平台，第一阶段不依赖云端账号体系。
+- 不做复杂的组织权限、审批流或素材资产管理系统。
+- 不做智能设计生成工具，不负责自动创作印花图案。
+- 不把图像识别、自动抠图、自动识别衣服版型作为第一阶段目标。
+- 不优先支持跨平台移动端，第一阶段聚焦 Windows 桌面使用。
diff --git a/docs/02-prd.md b/docs/02-prd.md
new file mode 100644
index 0000000..800b340
--- /dev/null
+++ b/docs/02-prd.md
@@ -0,0 +1,311 @@
+# 自动合成印花服饰效果图工具 PRD
+
+## 1. 背景
+
+本项目是一款 Windows 本地桌面软件，用于把印花图片叠加到衣服底图上，生成服饰印花效果图。参考旧版工具已经具备衣服图、印花图加载，模板合成，自定义位置、尺寸、旋转，单张合成和批量合成等能力。
+
+新版需要复刻旧版核心工作流，并增强可视化编辑能力，让用户可以直接在预览区拖动、缩放、旋转印花图片。
+
+## 2. 产品目标
+
+- 用户可以快速加载衣服底图和印花图。
+- 用户可以通过模板或手动编辑决定印花在衣服上的位置、尺寸和角度。
+- 用户可以在预览区直观看到合成效果。
+- 用户可以导出单张效果图。
+- 用户可以批量生成多张效果图。
+- 用户可以保存并复用常用合成模板。
+- 软件可以在无 Python 环境的 Windows 电脑上运行。
+
+## 3. 目标用户
+
+- 服饰定制、印花和打样工作人员。
+- 需要批量生成服饰效果图的设计、运营或生产支持人员。
+- 在局域网多台电脑上共同使用工具的小团队。
+
+## 4. 使用场景
+
+### 4.1 单张效果图制作
+
+用户选择一张衣服底图和一张印花图，在预览区拖动、缩放和旋转印花，确认效果后导出一张合成图。
+
+### 4.2 批量效果图制作
+
+用户导入一个衣服图片文件夹和一个印花图片文件夹，选择模板或当前编辑参数，批量生成合成图。
+
+### 4.3 模板复用
+
+用户把常用的印花位置、尺寸和旋转角度保存为模板，下次直接选择模板完成同类衣服的合成。
+
+### 4.4 多人本地使用
+
+多台 Windows 电脑安装同一工具。不同电脑可以使用相同或不同版本，但主程序本身应保持本地可运行，不依赖公网服务。
+
+## 5. 核心概念
+
+### 5.1 衣服底图
+
+衣服底图是合成画布的基础图片。印花图会叠加到衣服底图之上。
+
+要求：
+
+- 支持常见图片格式：PNG、JPG、JPEG、WEBP。
+- 支持批量从文件夹加载。
+- 保留原图尺寸作为默认导出尺寸。
+
+### 5.2 印花图
+
+印花图是需要叠加到衣服底图上的图案。
+
+要求：
+
+- 支持透明 PNG。
+- 支持缩放、拖动和旋转。
+- 支持批量从文件夹加载。
+- 合成时保持透明区域正确。
+
+### 5.3 模板
+
+模板是一组可复用的合成参数。
+
+模板字段：
+
+```json
+{
+  "name": "左胸小号模板",
+  "x": 120,
+  "y": 180,
+  "width": 160,
+  "height": 160,
+  "rotation": 0
+}
+```
+
+## 6. 功能需求
+
+### 6.1 图片加载
+
+用户可以分别选择衣服图片文件夹和印花图片文件夹。
+
+要求：
+
+- 选择文件夹后，导入该文件夹及其所有子文件夹中的支持格式图片。
+- 加载后在对应列表中显示图片文件。
+- 支持全选、取消全选。
+- 支持单独选中或取消选中某张衣服图片。
+- 支持单独选中或取消选中某张印花图片。
+- 支持选择当前预览使用的衣服图和印花图。
+- 加载失败时显示可理解的错误信息。
+- 忽略不支持的文件格式，并在日志中记录。
+
+### 6.2 预览区
+
+预览区用于显示当前衣服底图和印花叠加效果。
+
+要求：
+
+- 衣服底图按比例适配预览区域。
+- 印花图显示在衣服底图之上。
+- 预览区操作不应改变原始素材文件。
+- 用户切换衣服图或印花图时，预览区及时刷新。
+- 预览效果应尽量接近最终导出效果。
+
+### 6.3 拖动印花
+
+用户可以用鼠标拖动印花图改变位置。
+
+要求：
+
+- 拖动过程中实时更新预览。
+- 拖动结束后更新 X/Y 坐标输入框。
+- 坐标以衣服底图原始像素坐标为准。
+- 不强制限制印花必须完全位于衣服底图内，但导出时只保留画布范围内内容。
+
+### 6.4 缩放印花
+
+用户可以调整印花尺寸。
+
+要求：
+
+- 支持通过宽度、高度输入框设置尺寸。
+- 支持在预览区通过交互方式缩放。
+- 默认保持宽高比例。
+- 可以提供解除宽高比例锁定的选项。
+- 缩放结束后更新宽度和高度输入框。
+
+### 6.5 旋转印花
+
+用户可以旋转印花。
+
+要求：
+
+- 支持角度输入。
+- 支持向左旋转和向右旋转。
+- 支持在预览区通过交互方式旋转。
+- 角度单位为度。
+- 旋转后导出结果与预览一致。
+
+### 6.6 模板选择
+
+系统提供常用预设模板。
+
+第一批内置模板：
+
+- 正方形模板。
+- 纵向长方形模板。
+- 横向长方形模板。
+- 左胸小号模板。
+
+要求：
+
+- 用户点击模板后，印花位置、尺寸、旋转参数立即应用到当前预览。
+- 模板参数应基于衣服底图尺寸计算，避免只适配单一图片分辨率。
+
+### 6.7 自定义模板
+
+用户可以保存当前参数为自定义模板。
+
+要求：
+
+- 支持新增模板。
+- 支持重命名模板。
+- 支持删除自定义模板。
+- 支持把模板保存到本地配置文件。
+- 自定义模板在下次启动后仍可使用。
+
+### 6.8 单张合成导出
+
+用户可以导出当前预览图。
+
+要求：
+
+- 输出图片尺寸默认与衣服底图一致。
+- 支持选择输出目录。
+- 支持 JPG、PNG 输出。
+- 支持输出质量设置。
+- 文件名应避免覆盖已有文件，除非用户确认。
+
+### 6.9 批量合成导出
+
+用户可以批量生成合成效果图。
+
+批量规则需要支持两种模式：
+
+- 一一匹配：第 1 张衣服图配第 1 张印花图，第 2 张衣服图配第 2 张印花图。
+- 全组合：每张衣服图分别与每张印花图合成。
+
+要求：
+
+- 用户可以选择批量模式。
+- 批量导出使用当前模板或当前编辑参数。
+- 显示合成进度。
+- 支持取消批量任务。
+- 单个文件失败不应中断整个批量任务。
+- 批量结束后显示成功数量和失败数量。
+- 失败原因写入日志。
+
+### 6.10 日志
+
+软件应记录运行日志。
+
+要求：
+
+- 记录程序启动、图片加载、模板加载、导出开始、导出完成、异常信息。
+- 日志保存到本地 `logs` 目录。
+- 日志文件按日期或启动时间区分。
+
+## 7. 非功能需求
+
+### 7.1 平台与运行环境
+
+- 第一阶段支持 Windows 桌面系统。
+- 目标系统为 Windows 10 及以上，优先适配 Windows 10 / Windows 11。
+- 开发语言为 Python。
+- 指定 Python 版本为 Python 3.7。
+- 软件应可在没有 Python 环境的电脑上运行。
+
+### 7.2 性能
+
+- 单张预览操作应保持流畅。
+- 批量合成时界面不应无响应。
+- 大图处理应避免不必要的重复加载和重复缩放。
+
+### 7.3 稳定性
+
+- 图片加载失败、路径不存在、输出目录无权限等情况应给出明确提示。
+- 批量任务中单张失败时继续处理剩余图片。
+- 程序异常时应写入日志。
+
+### 7.4 可维护性
+
+- 图片处理逻辑应与界面逻辑分离。
+- 模板、配置、日志应使用清晰的本地文件结构。
+- 核心合成逻辑应可以被单独测试。
+
+## 8. 推荐技术方案
+
+- 开发语言：Python 3.7。
+- GUI：PySide6。
+- 预览交互：QGraphicsView / QGraphicsScene。
+- 图片合成：Pillow。
+- 配置存储：JSON。
+- 打包：PyInstaller，优先使用 onedir 模式。
+
+说明：技术方案用于指导第一版实现。若后续出现明确约束，可以调整。
+
+## 9. 数据与文件结构
+
+建议本地目录结构：
+
+```text
+AutoPrint/
+  AutoPrint.exe
+  config/
+    app_config.json
+    templates.json
+  logs/
+  output/
+  resources/
+```
+
+模板配置建议：
+
+```json
+{
+  "templates": [
+    {
+      "name": "左胸小号模板",
+      "type": "builtin",
+      "x_ratio": 0.35,
+      "y_ratio": 0.28,
+      "width_ratio": 0.12,
+      "height_ratio": 0.12,
+      "rotation": 0
+    }
+  ]
+}
+```
+
+## 10. 验收标准
+
+- 可以加载衣服图片文件夹和印花图片文件夹。
+- 可以在列表中选择参与合成的图片。
+- 可以在预览区显示衣服底图和印花图。
+- 可以拖动印花并同步坐标。
+- 可以缩放印花并同步尺寸。
+- 可以旋转印花并同步角度。
+- 可以选择内置模板并应用到预览。
+- 可以保存和复用自定义模板。
+- 可以导出当前单张合成图。
+- 可以按一一匹配模式批量导出。
+- 可以按全组合模式批量导出。
+- 批量导出时显示进度，失败项写入日志。
+- 打包后的程序可在无 Python 环境的 Windows 电脑上运行。
+
+## 11. 暂不做
+
+- 不做云端账号和在线素材库。
+- 不做复杂权限和审批流。
+- 不做完整图片编辑器能力。
+- 不做 AI 自动生成印花图。
+- 不做第一阶段自动抠图和自动识别衣服区域。
+- 不做移动端应用。
diff --git a/docs/03-technical-stack.md b/docs/03-technical-stack.md
new file mode 100644
index 0000000..4c1695e
--- /dev/null
+++ b/docs/03-technical-stack.md
@@ -0,0 +1,120 @@
+# 技术栈说明
+
+## 目标运行环境
+
+- 操作系统：Windows 10 及以上，优先适配 Windows 10 / Windows 11。
+- 开发语言：Python。
+- 指定 Python 版本：Python 3.7。
+- 发布形态：打包为 Windows 桌面程序，目标电脑无需预装 Python 环境。
+
+## GUI 框架
+
+使用 PySide6 作为桌面 GUI 框架。
+
+选择原因：
+
+- PySide6 是 Qt 官方 Python 绑定。
+- 授权相对适合闭源或内部工具场景。
+- Qt 的 `QGraphicsView` / `QGraphicsScene` 适合实现图片预览、拖动、缩放和旋转。
+- 可以通过 PyInstaller 打包为 Windows 可执行程序。
+
+## PySide6 版本约束
+
+由于项目指定使用 Python 3.7，PySide6 需要锁定在仍支持 Python 3.7 的版本。
+
+推荐版本：
+
+```text
+PySide6==6.5.3
+shiboken6==6.5.3
+```
+
+原因：
+
+- `PySide6 6.5.3` 支持 `Python >=3.7, <3.12`。
+- `PySide6 6.6.0` 起要求 `Python >=3.8`，不适用于当前 Python 3.7 约束。
+- 固定 PySide6 和 shiboken6 的版本可以避免依赖解析到不兼容版本。
+
+安装时建议使用：
+
+```bash
+pip install PySide6==6.5.3
+```
+
+`shiboken6` 会作为依赖自动安装对应版本；在正式依赖文件中仍建议显式锁定。
+
+## 图片处理
+
+使用 Pillow 处理最终图片合成。
+
+用途：
+
+- 读取衣服底图和印花图。
+- 保持透明 PNG 的 alpha 通道。
+- 对印花执行缩放、旋转。
+- 将处理后的印花叠加到衣服底图。
+- 导出 PNG 或 JPG。
+
+可选使用 numpy 辅助处理图像数组，但第一阶段不应把 numpy 作为必须依赖，除非实际实现需要。
+
+## 预览交互
+
+预览区建议使用：
+
+```text
+QGraphicsView
+QGraphicsScene
+QGraphicsPixmapItem
+自定义可变换印花 Item
+```
+
+设计原则：
+
+- 衣服底图作为基础图层。
+- 印花图作为可交互图层。
+- 印花支持拖动、缩放和旋转。
+- 预览交互状态需要转换为衣服底图原始像素坐标。
+- 导出时以原始像素坐标为准，确保预览和导出结果一致。
+
+## 打包工具
+
+使用 PyInstaller 打包。
+
+推荐使用 onedir 模式：
+
+```bash
+pyinstaller --onedir --windowed main.py
+```
+
+选择 onedir 的原因：
+
+- PySide6 / Qt 依赖文件较多，onedir 更容易排查缺失插件或 DLL 问题。
+- 启动速度通常优于 onefile。
+- 后续局域网分发和增量替换更容易。
+- 配置文件、模板文件和日志目录更容易管理。
+
+## 依赖锁定
+
+精确依赖版本应放在项目根目录的 `requirements.txt` 中维护，而不是放在 PRD 中。
+
+建议初始依赖：
+
+```text
+PySide6==6.5.3
+shiboken6==6.5.3
+Pillow
+PyInstaller
+```
+
+注意：
+
+- Python 3.7 已停止官方维护，部分第三方库的新版本不再支持 Python 3.7。
+- 实际开发前需要验证 Pillow、PyInstaller 等依赖的最新可用兼容版本。
+- 一旦验证通过，应把这些依赖固定为明确版本，避免后续安装环境变化导致打包失败。
+
+## 文档分工
+
+- `docs/01-product-vision.md`：定义项目是什么、给谁用、为什么存在、不做什么。
+- `docs/02-prd.md`：定义用户需求、功能范围、交互要求和验收标准。
+- `docs/03-technical-stack.md`：定义技术选型、版本约束和工程环境。
+- `requirements.txt`：定义实际安装的精确依赖版本。
diff --git a/docs/04-development-rules.md b/docs/04-development-rules.md
new file mode 100644
index 0000000..ab42d85
--- /dev/null
+++ b/docs/04-development-rules.md
@@ -0,0 +1,202 @@
+# 开发规则
+
+## 1. 文档定位
+
+本文档用于约束 AI 和开发者在本项目中的代码修改行为。后续任何开发、重构、检查、修复任务，都必须遵守本文档。
+
+本文档优先级高于个人习惯和临时偏好。若任务说明与本文档冲突，必须先向用户确认，不能自行改变规则。
+
+## 2. 开始任务前必须阅读
+
+执行编码任务前，必须先阅读：
+
+- `docs/01-product-vision.md`
+- `docs/02-prd.md`
+- `docs/03-technical-stack.md`
+- `docs/04-development-rules.md`
+
+若任务涉及图片预览、拖动、缩放、旋转、坐标换算或导出一致性，还必须阅读后续的图像编辑器设计文档。
+
+若任务涉及打包、发布、局域网更新、多版本分发，还必须阅读后续的打包发布文档。
+
+## 3. 技术栈约束
+
+必须遵守：
+
+- 使用 Python 3.7。
+- 使用 PySide6 作为 GUI 框架。
+- PySide6 使用兼容 Python 3.7 的版本，推荐 `PySide6==6.5.3`。
+- 使用 Pillow 处理最终图片合成。
+- 使用 JSON 保存配置和模板。
+- 使用 PyInstaller 打包 Windows 桌面程序。
+- 第一阶段目标系统为 Windows 10 / Windows 11。
+
+禁止事项：
+
+- 禁止切换到 Electron、Web 前端、C#、C++、Tkinter、wxPython 或其他 GUI 技术栈。
+- 禁止将项目改造成前后端分离应用。
+- 禁止依赖公网服务完成核心功能。
+- 禁止在未说明必要性的情况下新增第三方依赖。
+- 禁止使用只支持 Python 3.8 及以上的依赖版本。
+
+## 4. 代码结构规则
+
+必须遵守：
+
+- UI 逻辑、业务逻辑、图片处理逻辑、配置逻辑应分离。
+- 图片合成逻辑必须可以脱离 GUI 单独调用。
+- 批量任务逻辑必须与单张合成逻辑复用同一套核心合成能力。
+- 模板读写必须集中在专门模块中，不能散落在 UI 事件里。
+- 日志写入必须集中管理，不能使用零散 `print` 作为正式日志。
+
+禁止事项：
+
+- 禁止把所有功能写进一个 `main.py` 或一个窗口类。
+- 禁止在按钮点击事件中直接堆叠大量图片处理代码。
+- 禁止复制粘贴两套近似的单张合成和批量合成逻辑。
+- 禁止在多个模块中重复定义同一类配置结构。
+- 禁止把临时调试代码提交为正式代码。
+
+## 5. 图片处理规则
+
+必须遵守：
+
+- 衣服底图是最终导出画布的基础。
+- 印花图叠加到衣服底图之上。
+- 导出尺寸默认与衣服底图原始尺寸一致。
+- 坐标、宽高、旋转角度应以衣服底图原始像素坐标系为准保存。
+- 预览区缩放不应改变真实合成参数。
+- 预览结果和最终导出结果必须尽量一致。
+- 透明 PNG 的 alpha 通道必须正确保留。
+- 文件路径必须兼容 Windows 中文路径。
+
+禁止事项：
+
+- 禁止修改原始衣服图片和原始印花图片。
+- 禁止只按预览控件尺寸保存合成参数。
+- 禁止把屏幕坐标直接当作最终导出坐标。
+- 禁止在未确认的情况下裁剪、拉伸或压缩原始素材。
+- 禁止忽略透明通道导致 PNG 印花出现黑底、白底或异常背景。
+
+## 6. UI 与交互规则
+
+必须遵守：
+
+- UI 应优先服务批量制图工作流，避免装饰性复杂设计。
+- 关键操作必须有明确按钮或输入入口。
+- 拖动、缩放、旋转印花后，参数输入框必须同步更新。
+- 用户通过参数输入框修改坐标、尺寸、角度后，预览必须同步更新。
+- 批量处理时界面不能长时间无响应。
+- 失败、缺文件、格式不支持、导出失败等情况必须给出用户可理解的提示。
+
+禁止事项：
+
+- 禁止为了视觉效果牺牲操作效率。
+- 禁止隐藏核心操作入口。
+- 禁止让用户只能通过拖拽完成精确定位，必须保留参数输入能力。
+- 禁止批量处理期间阻塞主界面且没有进度反馈。
+- 禁止使用含糊错误提示，例如只显示“失败”。
+
+## 7. 配置与模板规则
+
+必须遵守：
+
+- 配置文件使用 JSON。
+- 自定义模板必须保存到本地配置或模板文件中。
+- 内置模板和用户自定义模板需要能区分。
+- 配置读取失败时应使用安全默认值，并记录日志。
+- 配置写入前应尽量避免破坏已有用户配置。
+
+禁止事项：
+
+- 禁止把用户模板硬编码进业务逻辑。
+- 禁止在程序启动时无提示清空用户配置。
+- 禁止因为单个模板损坏导致整个程序无法启动。
+- 禁止将配置写入程序安装目录中不适合写入的位置，除非该目录明确可写。
+
+## 8. 日志与异常规则
+
+必须遵守：
+
+- 程序启动、图片加载、模板加载、导出开始、导出完成、异常信息都应记录日志。
+- 日志保存到本地 `logs` 目录。
+- 用户可理解的错误提示和开发者可排查的日志信息应同时存在。
+- 批量任务中单个文件失败时，应记录失败原因并继续处理剩余文件。
+
+禁止事项：
+
+- 禁止吞掉异常不记录。
+- 禁止只在控制台输出异常。
+- 禁止将完整异常堆栈直接作为普通用户提示。
+- 禁止因单张图片失败中断整个批量任务，除非是全局不可恢复错误。
+
+## 9. 文件修改规则
+
+必须遵守：
+
+- 每次任务只修改与当前任务直接相关的文件。
+- 修改已有文件前必须先理解现有结构和调用关系。
+- 新增文件应放在符合架构文档约定的位置。
+- 删除文件、移动文件、重命名文件前必须确认不会破坏引用。
+
+禁止事项：
+
+- 禁止顺手重构与当前任务无关的代码。
+- 禁止大范围格式化无关文件。
+- 禁止删除用户素材、输出图片、配置文件或日志文件。
+- 禁止把测试素材、临时输出、缓存文件混入源代码目录。
+
+## 10. 依赖管理规则
+
+必须遵守：
+
+- 依赖版本应写入 `requirements.txt`。
+- 新增依赖前必须说明原因。
+- 新增依赖必须确认支持 Python 3.7 和 Windows。
+- GUI、图片处理、打包相关依赖需要优先选择稳定版本。
+
+禁止事项：
+
+- 禁止直接使用未锁定版本的核心依赖进行正式开发。
+- 禁止引入体积巨大但只使用很小功能的依赖。
+- 禁止引入需要复杂系统安装步骤的依赖，除非用户明确同意。
+- 禁止引入与 PySide6 事件循环冲突的 GUI 依赖。
+
+## 11. 版本号规则
+
+必须遵守：
+
+- 软件名称和版本号必须从统一模块读取，例如 `src/version.py`。
+- 标题栏显示版本号、打包产物版本号、发布目录版本号必须保持一致。
+- 修改版本号时必须同步检查 UI 显示和打包发布配置。
+
+禁止事项：
+
+- 禁止在 UI、打包脚本、业务代码中重复硬编码软件名称和版本号。
+- 禁止让多个模块各自维护不同版本号。
+
+## 12. 验证规则
+
+完成开发任务后，必须根据任务范围做验证：
+
+- 文档修改：检查文件路径、标题、引用和明显格式问题。
+- 依赖修改：验证依赖是否可在 Python 3.7 环境安装。
+- GUI 修改：至少启动程序检查窗口是否能打开。
+- 图片处理修改：至少验证一张衣服图和一张印花图的合成结果。
+- 批量处理修改：至少验证成功、失败和进度反馈路径。
+- 打包修改：验证 PyInstaller 打包产物能启动。
+
+如果因为环境限制无法验证，必须在最终说明中明确说明未验证项和原因。
+
+## 13. AI 执行规则
+
+AI 执行任务时必须遵守：
+
+- 先读相关文档，再改代码。
+- 先说明将修改哪些文件，再执行修改。
+- 遇到不明确需求时，优先根据现有文档保守实现；影响范围较大时必须询问用户。
+- 不得自行扩大需求范围。
+- 不得自行替换技术栈。
+- 不得把临时方案伪装成最终方案。
+- 不得为了完成任务隐藏失败、跳过验证或省略风险说明。
+- 最终回复必须说明改了什么、验证了什么、还有什么未完成或未验证。
diff --git a/docs/05-project-architecture.md b/docs/05-project-architecture.md
new file mode 100644
index 0000000..901a591
--- /dev/null
+++ b/docs/05-project-architecture.md
@@ -0,0 +1,421 @@
+# 项目架构
+
+## 1. 文档定位
+
+本文档定义项目代码结构、模块职责和依赖方向。后续 AI 或开发者在新增功能、修复问题、重构代码时，必须遵守本文档。
+
+本文档不描述具体 UI 细节和图像编辑算法细节。拖动、缩放、旋转、坐标换算等细节应放在图像编辑器设计文档中。
+
+## 2. 架构目标
+
+- 避免所有逻辑集中在一个窗口类或一个入口文件中。
+- 让 UI、图片合成、模板、配置、批量任务、日志职责清晰分离。
+- 让核心图片合成逻辑可以脱离 GUI 单独测试。
+- 让单张合成和批量合成复用同一套核心逻辑。
+- 让后续 AI 执行小任务时能快速定位应修改的模块。
+
+## 3. 推荐目录结构
+
+```text
+src/
+  main.py
+  version.py
+  app/
+    __init__.py
+    main_window.py
+    widgets/
+      __init__.py
+      image_canvas.py
+      image_list_panel.py
+      template_panel.py
+      transform_panel.py
+      export_panel.py
+  core/
+    __init__.py
+    models.py
+    composer.py
+    batch.py
+  services/
+    __init__.py
+    config_service.py
+    template_service.py
+    file_service.py
+    log_service.py
+  resources/
+    icons/
+    styles/
+tests/
+  test_composer.py
+  test_templates.py
+docs/
+```
+
+说明：
+
+- `src/main.py` 是程序入口，只负责创建应用和主窗口。
+- `src/version.py` 统一维护软件名称和版本号。
+- `app/` 放 GUI 相关代码。
+- `core/` 放与 GUI 无关的核心模型、合成和批量处理逻辑。
+- `services/` 放配置、模板、文件扫描、日志等服务。
+- `resources/` 放图标、样式等静态资源。
+- `tests/` 放自动化测试。
+
+## 4. 模块职责
+
+### 4.1 `src/main.py`
+
+职责：
+
+- 初始化 Qt 应用。
+- 初始化日志。
+- 创建并显示主窗口。
+- 进入应用事件循环。
+
+禁止：
+
+- 禁止在入口文件中写图片合成逻辑。
+- 禁止在入口文件中写复杂 UI 布局。
+- 禁止在入口文件中直接读写模板和配置细节。
+
+### 4.2 `src/version.py`
+
+职责：
+
+- 统一定义软件名称。
+- 统一定义当前版本号。
+- 为标题栏、关于信息、打包发布配置提供版本来源。
+
+建议字段：
+
+```text
+APP_NAME
+APP_VERSION
+```
+
+禁止：
+
+- 禁止在其他模块重复硬编码软件名称和版本号。
+- 禁止让 UI 显示版本号与打包发布版本号不一致。
+
+### 4.3 `app/main_window.py`
+
+职责：
+
+- 组织主界面布局。
+- 协调各 UI 面板。
+- 连接用户操作与服务调用。
+- 管理当前选中的衣服图、印花图和模板状态。
+
+禁止：
+
+- 禁止直接实现底层图片合成算法。
+- 禁止直接写入配置文件细节。
+- 禁止堆叠大量按钮事件中的业务逻辑。
+
+### 4.4 `app/widgets/image_canvas.py`
+
+职责：
+
+- 显示衣服底图和印花图。
+- 承载印花拖动、缩放、旋转交互。
+- 将 UI 交互结果转换为统一的变换状态。
+- 通知外部坐标、尺寸、角度变化。
+
+禁止：
+
+- 禁止直接导出最终图片文件。
+- 禁止直接管理批量任务。
+- 禁止把屏幕坐标直接作为最终合成坐标。
+
+### 4.5 `app/widgets/image_list_panel.py`
+
+职责：
+
+- 显示衣服图片列表和印花图片列表。
+- 支持选择文件夹、全选、取消全选。
+- 通知主窗口当前选择变化。
+
+禁止：
+
+- 禁止直接执行图片合成。
+- 禁止直接修改图片文件。
+
+### 4.6 `app/widgets/template_panel.py`
+
+职责：
+
+- 显示内置模板和自定义模板。
+- 处理模板选择、新增、重命名、删除等 UI 操作。
+- 通过 `template_service` 读取和保存模板。
+
+禁止：
+
+- 禁止在 UI 控件中硬编码所有模板逻辑。
+- 禁止直接绕过 `template_service` 修改模板文件。
+
+### 4.7 `app/widgets/transform_panel.py`
+
+职责：
+
+- 显示和编辑印花的 X/Y 坐标、宽度、高度、旋转角度。
+- 用户修改参数后通知预览区更新。
+- 预览区交互变化后同步显示最新参数。
+
+禁止：
+
+- 禁止自己维护一套与预览区不一致的状态。
+- 禁止只更新输入框但不更新预览。
+
+### 4.8 `app/widgets/export_panel.py`
+
+职责：
+
+- 选择输出目录。
+- 设置输出格式和质量。
+- 触发单张合成和批量合成。
+- 显示合成进度和结果摘要。
+
+禁止：
+
+- 禁止直接写底层图像合成算法。
+- 禁止批量处理时阻塞主界面且没有进度反馈。
+
+### 4.9 `core/models.py`
+
+职责：
+
+- 定义核心数据模型。
+- 统一表示图片文件、印花变换参数、模板、导出选项、批量任务结果。
+
+建议模型：
+
+```text
+ImageAsset
+TransformState
+Template
+ExportOptions
+BatchOptions
+ComposeResult
+BatchResult
+```
+
+禁止：
+
+- 禁止在模型文件中引入 PySide6 UI 控件。
+- 禁止在模型文件中执行文件扫描或图片导出。
+
+### 4.10 `core/composer.py`
+
+职责：
+
+- 实现单张图片合成。
+- 根据衣服底图、印花图、变换参数和导出选项生成结果图。
+- 保证透明 PNG 正确叠加。
+- 保证导出结果与预览参数一致。
+
+禁止：
+
+- 禁止依赖 PySide6 UI 控件。
+- 禁止读取 UI 输入框。
+- 禁止处理文件夹批量遍历逻辑。
+
+### 4.11 `core/batch.py`
+
+职责：
+
+- 实现批量合成任务编排。
+- 支持一一匹配和全组合模式。
+- 复用 `core/composer.py` 的单张合成能力。
+- 汇总成功、失败和错误信息。
+
+禁止：
+
+- 禁止复制一套独立于 `composer.py` 的合成算法。
+- 禁止因单个文件失败中断整个批量任务。
+
+### 4.12 `services/config_service.py`
+
+职责：
+
+- 读取和保存应用配置。
+- 管理默认配置。
+- 在配置损坏或缺失时提供安全默认值。
+
+禁止：
+
+- 禁止在多个模块中重复解析同一个配置文件。
+- 禁止启动时无提示清空用户配置。
+
+### 4.13 `services/template_service.py`
+
+职责：
+
+- 加载内置模板。
+- 加载、保存、重命名、删除自定义模板。
+- 校验模板字段是否合法。
+
+禁止：
+
+- 禁止让 UI 直接操作模板 JSON 文件。
+- 禁止单个模板损坏导致全部模板不可用。
+
+### 4.14 `services/file_service.py`
+
+职责：
+
+- 扫描图片文件夹。
+- 过滤支持的图片格式。
+- 生成安全输出文件名。
+- 处理 Windows 中文路径。
+
+禁止：
+
+- 禁止在 UI 层重复实现文件扫描规则。
+- 禁止默认覆盖已有输出文件，除非用户确认。
+
+### 4.15 `services/log_service.py`
+
+职责：
+
+- 初始化日志系统。
+- 统一日志格式。
+- 管理日志文件路径。
+
+禁止：
+
+- 禁止业务模块各自创建不一致的日志配置。
+- 禁止用 `print` 代替正式日志。
+
+## 5. 依赖方向
+
+允许的依赖方向：
+
+```text
+main.py -> app
+app -> core
+app -> services
+core -> services 仅限必要的纯工具能力
+services -> core models 可选
+tests -> core
+tests -> services
+```
+
+推荐依赖关系：
+
+```text
+UI 层负责收集用户输入
+UI 层把输入转换为 core models
+core 层执行合成或批量任务
+services 层处理配置、模板、文件和日志
+UI 层展示结果和错误信息
+```
+
+禁止的依赖方向：
+
+```text
+core -> app
+services -> app
+models -> app
+composer -> PySide6 UI 控件
+batch -> PySide6 UI 控件
+```
+
+## 6. 状态管理
+
+主窗口维护当前工作状态：
+
+- 当前衣服图片。
+- 当前印花图片。
+- 当前印花变换参数。
+- 当前模板。
+- 当前输出配置。
+
+印花变换参数必须使用统一模型表示，例如：
+
+```text
+TransformState
+  x
+  y
+  width
+  height
+  rotation
+  keep_aspect_ratio
+```
+
+规则：
+
+- 预览区变化后更新 `TransformState`。
+- 参数面板变化后更新同一个 `TransformState`。
+- 单张导出和批量导出都读取同一个 `TransformState` 或模板转换结果。
+- 不允许 UI 面板各自维护互不一致的状态。
+
+## 7. 单张合成流程
+
+```text
+用户选择衣服图和印花图
+-> 主窗口更新当前状态
+-> 预览区显示衣服和印花
+-> 用户拖动、缩放、旋转或输入参数
+-> 更新 TransformState
+-> 用户点击单张导出
+-> export_panel 构造 ExportOptions
+-> core.composer 执行合成
+-> file_service 生成输出路径
+-> 保存结果
+-> UI 显示成功或失败
+```
+
+## 8. 批量合成流程
+
+```text
+用户选择多张衣服图和印花图
+-> 用户选择批量模式
+-> 用户选择模板或当前参数
+-> export_panel 构造 BatchOptions
+-> core.batch 生成任务列表
+-> 每个任务调用 core.composer
+-> 失败项记录错误并继续
+-> UI 显示进度
+-> 任务完成后显示成功数量和失败数量
+```
+
+## 9. 错误处理
+
+错误处理分两层：
+
+- 用户提示：简洁、可理解，说明用户可以做什么。
+- 日志信息：详细记录异常类型、文件路径、调用阶段和堆栈信息。
+
+规则：
+
+- 文件不存在、格式不支持、输出目录不可写必须提示用户。
+- 单张导出失败应提示用户并记录日志。
+- 批量任务中单个文件失败应记录失败原因并继续处理。
+- 全局不可恢复错误才允许终止批量任务。
+
+## 10. 测试边界
+
+优先测试：
+
+- `core/composer.py` 的单张合成。
+- 透明 PNG 印花叠加。
+- 坐标、尺寸、旋转参数应用。
+- 输出文件名生成。
+- 模板 JSON 读写。
+- 批量一一匹配模式。
+- 批量全组合模式。
+
+UI 测试可以后置，但核心合成逻辑必须尽量可测试。
+
+## 11. 后续扩展点
+
+架构应允许后续增加：
+
+- 图像编辑器专项模块。
+- 局域网版本分发模块。
+- 多版本启动器。
+- 更多输出格式。
+- 更多模板类型。
+- 素材目录记忆。
+
+新增扩展时必须遵守现有依赖方向，不得让核心模块依赖 UI。
diff --git a/docs/06-ui-mockup-prompt-claude.md b/docs/06-ui-mockup-prompt-claude.md
new file mode 100644
index 0000000..0cea6ac
--- /dev/null
+++ b/docs/06-ui-mockup-prompt-claude.md
@@ -0,0 +1,169 @@
+# UI 效果图生成提示词
+
+## 文档定位
+
+本文档用于向 Claude 或其他具备设计能力的 AI 生成 UI 效果图。提示词目标是产出 Windows 桌面软件的高保真 UI mockup，用于后续整理 UI 设计文档和指导 PySide6 实现。
+
+> 本文档已根据多轮设计讨论更新。原始提示词保留在「## 提示词」一节，所有经讨论确定的设计决策已并入提示词正文，并在文末「## 设计迭代记录」中分主题说明原因，便于追溯。
+
+## 提示词
+
+```text
+你是一名资深桌面软件 UI/UX 设计师，请为一个 Windows 桌面软件设计高保真 UI 效果图。
+
+软件名称：
+自动合成印花服饰效果图工具
+
+软件用途：
+用户加载衣服底图和印花图片，把印花叠加到衣服图片上，并通过拖动、缩放、旋转调整印花位置，最后导出单张或批量合成效果图。
+注意：「合成印花」只是整个业务流程中的一个环节，软件还包含「AI 穿搭」「导出上架」等其他环节，界面需要用顶部标签页在多个环节间切换。
+
+目标用户：
+服饰定制、印花打样、商品上架、批量制图人员。用户不一定是专业设计师，所以界面要清晰、直观、效率优先。
+
+设计目标：
+1. 保留旧版软件的核心工作流，但界面更现代、更清晰。
+2. 重点突出中间的大预览区，让用户能直接拖动、缩放、旋转印花。
+3. 适合 Windows 桌面端，分辨率优先按 1920x1080 设计。
+4. UI 风格专业、简洁、偏工具软件，必须是浅色 Windows 原生工具风（类似 Office / Qt 默认控件），不要做成网页落地页，也不要做成深色潮酷风。
+5. 不要使用花哨渐变、大面积插画、营销风格卡片。
+6. 布局应适合长时间批量操作。
+7. 整体外观应能较直接地对应到 PySide6 / Qt 控件，方便后续实现。
+
+视觉风格细则（浅色 Windows 原生工具风）：
+- 浅灰窗口底（约 #f0f0f0）+ 白色面板，中性灰画布。
+- 字体：Segoe UI / 微软雅黑，正文 12px 左右。
+- 控件用 1px 实线边框、小圆角（约 3px）、几乎不用阴影。
+- 单一蓝色强调色（约 #0067c0）用于选中、主按钮、激活状态。
+- 带标题的分组框（GroupBox），标题嵌在边框上。
+- 数字输入用带上下微调箭头的 SpinBox 样式。
+- 信息密度偏高、留白克制，适合长时间制图。
+
+顶部环节标签页（Tab）：
+- 顶部放一排「步骤式」标签页，标签带序号，体现推荐顺序，但每个标签都可随时点击切换（基本按顺序、允许来回跳）。
+- 标签共三个：① 添加印花、② AI 穿搭、③ 导出上架。
+- 当前演示的是「① 添加印花」环节，该标签高亮（蓝色序号 + 白底），其余标签为未激活灰色态。
+- 后两个环节（AI 穿搭、导出上架）的具体界面内容待定，本次可只搭好标签框架，内容留作占位。
+
+核心功能区（属于「① 添加印花」环节）：
+- 衣服图片列表
+- 印花图片列表
+- 合成预览区
+- 模板选择
+- 坐标参数：X、Y
+- 尺寸参数：宽度、高度，支持锁定比例
+- 旋转参数：角度、左旋、右旋
+- 输出设置：输出目录、格式、质量
+- 操作按钮：单张导出、批量导出、保存模板/另存为、重置参数
+- 合成队列与批量进度显示
+
+素材导入与勾选规则：
+- 选择衣服文件夹 / 印花文件夹后，递归导入文件夹内（含所有子文件夹）的全部图片。
+- 缩略图采用平铺展示，不做分组折叠树；文件名带上所在子文件夹（如「夏季/白T_圆领.png」）以保留来源信息。
+- 缩略图右上角用小角标显示所在子文件夹名（如「夏季」），缩略图下方显示文件名；默认按「子文件夹 + 文件名」排序，使同一子文件夹的图自然相邻。
+- 每个素材列表顶部提供一个全局「全选 / 取消全选」复选框（支持全选、未全选时的半选态），并显示「已选 N」计数。
+- 支持单张勾选 / 取消勾选。只需一个全局全选即可，不要求按子文件夹分组勾选。
+
+批量组合方式（合成队列）：
+- 用户常用两种以上的组合方式：多件衣服 × 同一个印花、一件衣服 × 多个印花，也包含全组合（勾选项两两相乘）。界面需要能灵活切换这几种组合模式。
+- 底部设「合成队列」面板：顶部一排模式切换按钮（多衣服 × 单印花 / 单衣服 × 多印花 / 全组合矩阵），下方用表格逐行显式列出每一对「衣服 × 印花」组合，而不是只显示一个总数。
+- 队列每行显示：序号、衣服、印花、来源文件夹、参数标记（模板 / 已微调）、状态（待导出 / 导出中 / 已完成 / 失败）、单项进度或输出文件名。
+- 队列顶部汇总：共 N 项 · 完成 · 进行 · 失败 · 待导出。
+- 队列操作按钮：重置全部、导出选中、开始批量导出、折叠/展开。
+
+参数与模板的关系（默认走模板、可单项微调）：
+- 所有组合默认跟随当前选中的模板参数；修改模板即对全体生效。
+- 选中队列中的某一项后，右侧参数栏只调整这一对组合，调整后该项标记为「已微调」并锁定，重跑模板时不被其参数覆盖。
+- 右侧参数栏底部提供与模板相关的操作，明确区分「应用为模板 / 重置为模板」，避免和模板区的保存功能产生混淆。
+
+建议布局：
+1. 标题栏：
+   - 左侧软件名称
+   - 右侧「设置」入口（齿轮图标）
+   - 标准的最小化 / 最大化 / 关闭按钮
+   - 不再使用传统的「文件 / 编辑 / 模板 / 帮助」菜单栏，也不再单独占一行顶部工具栏。
+2. 顶部标签页栏：① 添加印花、② AI 穿搭、③ 导出上架（步骤式 Tab，详见上文）。
+3. 左侧素材栏：
+   - 上半部分：衣服图片区。顶部为「打开衣服文件夹」按钮（紧贴衣服列表上方），其下为衣服缩略图列表（支持子文件夹角标、缩略图、勾选、全选）。
+   - 下半部分：印花图片区。顶部为「打开印花文件夹」按钮（紧贴印花列表上方），其下为印花缩略图列表（同样支持角标、缩略图、勾选、全选）。
+   - 「打开文件夹」按钮采用就近原则，放在各自列表正上方，点击后图片即出现在下方。
+4. 中间主区域：
+   - 大尺寸合成预览画布，中性灰棋盘格背景衬托衣服底图。
+   - 画布里显示衣服底图。
+   - 印花图层有选中边框、四角缩放控制点、顶部旋转控制点。
+   - 支持拖动、缩放、旋转的视觉暗示（底部可放操作提示条）。
+   - 由于衣服图多为竖向长方形，画布不宜过宽：适当加宽左侧素材栏（约为基础宽度的 1.3 倍、缩略图改 4 列），参数栏可保持原宽或仅小幅加宽，使中间画布更贴合竖图比例。
+5. 右侧参数栏：
+   - 模板选择（下拉），其下紧跟「保存 / 另存为」模板按钮。
+   - 位置：X、Y
+   - 尺寸：宽、高、锁定比例
+   - 旋转：角度输入、左旋、右旋
+   - 输出设置：目录、格式、质量
+   - 提示：当前调整仅作用于队列中选中的那一对组合，并标记为「已微调」。
+   - 底部操作按钮：导出当前单张、应用为模板、重置为模板。
+6. 底部合成队列面板：见上文「批量组合方式」。
+7. 最底部状态栏：
+   - 当前选中衣服图
+   - 当前选中印花图
+   - 当前模板
+   - 批量进度
+   - 失败项提示
+   - 日志/错误提示简要信息
+
+请输出：
+1. 一张高保真 UI 效果图设计说明。
+2. 页面布局结构。
+3. 每个区域包含哪些控件。
+4. 推荐的颜色、字体、间距、按钮样式。
+5. 交互状态说明，包括：
+   - 未加载图片
+   - 已加载衣服但未加载印花
+   - 选中印花图层
+   - 正在批量导出
+   - 导出失败
+6. 如果可以生成图片，请生成一张 1920x1080 的桌面软件 UI mockup。
+7. 不要生成网页落地页，不要生成移动端界面，不要使用营销宣传风格；必须是浅色 Windows 原生工具风。
+
+如果你支持直接生成图片，请直接生成一张 1920x1080 的高保真桌面软件 UI 效果图，界面文字使用中文。
+```
+
+## 设计迭代记录
+
+以下为在初版提示词基础上，经多轮讨论确定的设计决策与原因，已并入上方提示词。
+
+### 1. 视觉风格：改为浅色 Windows 原生工具风
+- 初版未限定深浅，容易被做成偏网页 / 深色 IDE 的风格。
+- 最终确定为浅色 Windows 原生工具风（类似 Office / Qt 默认）：浅灰窗体 + 白色面板、中性灰画布、单一蓝色强调色、带标题的分组框、SpinBox 数字框、1px 实线边框与小圆角。
+- 原因：目标用户多为批量制图人员而非专业设计师，长时间看图、批量操作更适合浅色稳妥风格；且该风格能较直接对应 PySide6 / Qt 控件，便于实现。
+
+### 2. 顶部导航：去掉菜单栏 + 工具栏，改为「步骤式标签页」
+- 去掉传统「文件 / 编辑 / 模板 / 帮助」菜单栏，因其与工具栏按钮功能重复、对非专业用户不友好。
+- 「设置」移至标题栏右上角齿轮图标，不再单独占一行工具栏，界面更干净。
+- 因为「合成印花」只是业务流程中的一个环节（共 ① 添加印花 / ② AI 穿搭 / ③ 导出上架），环节数量少（2–3 个）且「基本按顺序、可来回跳」，最终选用顶部「步骤式 Tab」：标签带序号体现顺序，但每个可随时点击切换。对应 Qt 的 QTabWidget。
+- （备选方案曾考虑左侧图标导航栏，适合环节较多的情况；步骤条 Wizard 适合强顺序流程。本场景环节少，顶部 Tab 最合适。）
+
+### 3. 素材导入与勾选
+- 选择文件夹后递归导入（含子文件夹）全部图片。
+- 缩略图平铺展示，文件名带子文件夹路径；缩略图右上角加子文件夹角标，默认按「子文件夹 + 文件名」排序，使同一子文件夹的图相邻——用排序低成本地获得分组效果，无需做折叠树。
+- 顶部一个全局「全选 / 取消全选」复选框（含半选态）+「已选 N」计数；支持单张勾选。仅需全局全选，不做按子文件夹分组勾选。
+
+### 4. 批量组合：新增「合成队列」面板
+- 初版只有一个「批量进度 38/60」的进度条，无法表达 60 是怎么来的、用了哪种组合方式、每对组合各自的参数与状态。
+- 新增底部「合成队列」面板：顶部模式切换（多衣服 × 单印花 / 单衣服 × 多印花 / 全组合矩阵），下方表格逐行列出每一对组合及其来源文件夹、参数标记、状态、单项进度。
+- 面板位置选用底部横向面板（状态栏上方、可折叠），不挤压中间画布，最适合长时间批量操作。对应 Qt 的 QTableWidget。
+
+### 5. 参数与模板：默认走模板，可单项微调
+- 所有组合默认跟随当前模板；改模板对全体生效。
+- 选中队列某一项后，右侧参数栏只调这一对，调整后标记「已微调」并锁定，重跑模板不覆盖。
+- 模板相关操作明确区分：模板区下拉框下方放「保存 / 另存为」；右侧参数栏底部放「应用为模板 / 重置为模板」，避免两处存模板造成混淆。
+
+### 6. 操作按钮就近放置
+- 「打开衣服文件夹」放在衣服列表正上方、「打开印花文件夹」放在印花列表正上方、「保存 / 另存为」模板放在模板下拉框正下方。
+- 原因：就近原则，操作按钮贴着其作用对象，点击后结果即出现在附近，符合用户心智。
+
+### 7. 画布与栏宽比例
+- 衣服图多为竖向长方形，过宽的画布两侧留白浪费。
+- 适当加宽左侧素材栏（约 1.3 倍、缩略图 4 列），让中间画布变窄、更贴合竖图；参数栏因多为小输入框，建议保持原宽或仅小幅加宽，避免拉宽后输入框两侧空旷。
+
+### 待办（后续环节）
+- 「② AI 穿搭」与「③ 导出上架」两个标签页的具体界面内容尚未确定，目前仅搭好标签框架。待明确各自的功能后再补充对应的提示词与布局。
diff --git a/docs/06-ui-mockup-prompt.md b/docs/06-ui-mockup-prompt.md
new file mode 100644
index 0000000..7d9e3c1
--- /dev/null
+++ b/docs/06-ui-mockup-prompt.md
@@ -0,0 +1,94 @@
+# UI 效果图生成提示词
+
+## 文档定位
+
+本文档用于向 Claude 或其他具备设计能力的 AI 生成 UI 效果图。提示词目标是产出 Windows 桌面软件的高保真 UI mockup，用于后续整理 UI 设计文档和指导 PySide6 实现。
+
+## 提示词
+
+```text
+你是一名资深桌面软件 UI/UX 设计师，请为一个 Windows 桌面软件设计高保真 UI 效果图。
+
+软件名称：
+自动合成印花服饰效果图工具
+
+软件用途：
+用户加载衣服底图和印花图片，把印花叠加到衣服图片上，并通过拖动、缩放、旋转调整印花位置，最后导出单张或批量合成效果图。
+
+目标用户：
+服饰定制、印花打样、商品上架、批量制图人员。用户不一定是专业设计师，所以界面要清晰、直观、效率优先。
+
+设计目标：
+1. 保留旧版软件的核心工作流，但界面更现代、更清晰。
+2. 重点突出中间的大预览区，让用户能直接拖动、缩放、旋转印花。
+3. 适合 Windows 桌面端，分辨率优先按 1920x1080 设计。
+4. UI 风格专业、简洁、偏工具软件，不要做成网页落地页。
+5. 不要使用花哨渐变、大面积插画、营销风格卡片。
+6. 布局应适合长时间批量操作。
+
+核心功能区：
+- 衣服图片列表：选择衣服文件夹后，自动导入文件夹及所有子文件夹里的图片；列表支持缩略图、全选、取消全选、单张勾选/取消勾选
+- 印花图片列表：选择印花文件夹后，自动导入文件夹及所有子文件夹里的图片；列表支持缩略图、全选、取消全选、单张勾选/取消勾选
+- 合成预览区
+- 模板选择
+- 批量合成模式：
+  - 多个衣服图片使用同一个印花图片合成
+  - 一个衣服图片轮流使用多个印花图片合成
+  - 多个衣服图片和多个印花图片一一匹配合成
+  - 多个衣服图片和多个印花图片全组合合成
+- 坐标参数：X、Y
+- 尺寸参数：宽度、高度，支持锁定比例
+- 旋转参数：角度、左旋、右旋
+- 输出设置：输出目录、格式、质量
+- 操作按钮：单张导出、批量导出、保存模板、重置参数
+- 批量进度显示
+
+建议布局：
+1. 顶部工具栏：
+   - 软件名称
+   - 当前版本号，放在软件名称右侧，例如 v1.0.0，使用低调的小字号
+   - 打开衣服文件夹
+   - 打开印花文件夹
+   - 保存模板
+   - 设置
+2. 左侧素材栏：
+   - 上半部分：衣服图片列表，包含选择文件夹、全选、取消全选、缩略图列表、单张勾选框
+   - 下半部分：印花图片列表，包含选择文件夹、全选、取消全选、缩略图列表、单张勾选框
+   - 文件夹导入需要表达“包含子文件夹图片”的能力
+3. 中间主区域：
+   - 大尺寸合成预览画布
+   - 画布里显示衣服底图
+   - 印花图层有选中边框、四角缩放控制点、顶部旋转控制点
+   - 支持拖动、缩放、旋转的视觉暗示
+4. 右侧参数栏：
+   - 模板选择
+   - 批量模式选择：同一印花应用到多件衣服、同一衣服应用多个印花、一一匹配、全组合
+   - 位置：X、Y
+   - 尺寸：宽、高、锁定比例
+   - 旋转：角度输入、左旋、右旋
+   - 输出设置：目录、格式、质量
+   - 操作按钮
+5. 底部状态栏：
+   - 当前选中衣服图
+   - 当前选中印花图
+   - 当前模板
+   - 当前批量模式
+   - 批量进度
+   - 日志/错误提示简要信息
+
+请输出：
+1. 一张高保真 UI 效果图设计说明。
+2. 页面布局结构。
+3. 每个区域包含哪些控件。
+4. 推荐的颜色、字体、间距、按钮样式。
+5. 交互状态说明，包括：
+   - 未加载图片
+   - 已加载衣服但未加载印花
+   - 选中印花图层
+   - 正在批量导出
+   - 导出失败
+6. 如果可以生成图片，请生成一张 1920x1080 的桌面软件 UI mockup。
+7. 不要生成网页落地页，不要生成移动端界面，不要使用营销宣传风格。
+
+如果你支持直接生成图片，请直接生成一张 1920x1080 的高保真桌面软件 UI 效果图，界面文字使用中文。
+```
diff --git a/docs/07-ui-design.md b/docs/07-ui-design.md
new file mode 100644
index 0000000..6d1095d
--- /dev/null
+++ b/docs/07-ui-design.md
@@ -0,0 +1,511 @@
+# UI 设计文档
+
+## 1. 文档定位
+
+本文档基于 `docs/ui-v1.html` 和 `docs/ui-v1.png` 整理，用于指导 PySide6 桌面界面实现。
+
+本文档定义界面布局、控件区域、视觉风格和交互状态，不定义底层图片合成算法。拖动、缩放、旋转和坐标换算的具体实现，应在图像编辑器设计文档中定义。
+
+## 2. 设计目标
+
+- 保持 Windows 桌面工具软件风格，清晰、稳定、效率优先。
+- 让中间合成预览区成为主要工作区域。
+- 让素材选择、参数调整、导出队列同时可见。
+- 支持长时间批量操作，减少反复切换窗口。
+- 支持衣服图片和印花图片从文件夹及子文件夹批量导入。
+- 支持多种批量合成模式。
+
+## 3. 整体布局
+
+主窗口采用固定工具型布局：
+
+```text
+标题栏
+流程页签
+主工作区：左侧素材栏 | 中间预览区 | 右侧参数栏
+底部合成队列
+底部状态栏
+```
+
+参考设计尺寸：
+
+```text
+1920 x 1080
+```
+
+推荐布局比例：
+
+```text
+左侧素材栏：约 374 px
+右侧参数栏：约 318 px
+中间预览区：占用剩余宽度
+底部合成队列：约 188 px
+状态栏：约 26 px
+```
+
+## 4. 顶部区域
+
+### 4.1 标题栏
+
+内容：
+
+- 软件图标。
+- 软件名称：`自动合成印花服饰效果图工具`。
+- 当前版本号，放在软件名称右侧，例如：`v1.0.0`。
+- 设置入口。
+- Windows 窗口按钮。
+
+要求：
+
+- 标题栏高度紧凑。
+- 版本号使用低于软件名称的视觉层级，例如浅灰小字。
+- 版本号必须常驻显示，便于用户和管理员确认当前运行版本。
+- 设置入口放在右侧。
+- 不放复杂业务按钮。
+
+### 4.2 流程页签
+
+当前设计包含三个页签：
+
+- `1 添加印花`
+- `2 AI 穿搭`
+- `3 导出上架`
+
+第一阶段只实现 `添加印花` 主流程。
+
+要求：
+
+- 未实现页签可以置灰或隐藏。
+- 若保留未实现页签，点击时应提示“暂未开放”，不能进入空白页面。
+
+## 5. 左侧素材栏
+
+左侧素材栏分为上下两块：
+
+- 衣服图片。
+- 印花图片。
+
+### 5.1 衣服图片面板
+
+控件：
+
+- `打开衣服文件夹` 按钮。
+- 图片数量说明，例如：`含子文件夹 · 共 12`。
+- 全选复选框。
+- 已选数量。
+- 排序选择，例如：`文件夹+名称`。
+- 缩略图网格。
+
+缩略图项显示：
+
+- 图片预览。
+- 勾选框。
+- 来源子文件夹标签。
+- 文件名。
+- 当前预览选中态。
+
+交互规则：
+
+- 选择文件夹后递归导入该文件夹及所有子文件夹中的支持格式图片。
+- 支持全选和取消全选。
+- 支持单张勾选和取消勾选。
+- 支持点击某张衣服图片作为当前预览底图。
+- 勾选状态表示是否参与批量合成。
+- 当前预览选中态和批量勾选态需要视觉上可区分。
+
+### 5.2 印花图片面板
+
+控件和交互与衣服图片面板一致。
+
+差异：
+
+- 按钮文案为 `打开印花文件夹`。
+- 图片项代表印花素材。
+- 点击某张印花图片后更新当前预览印花。
+
+## 6. 中间预览区
+
+中间预览区是主要编辑区域。
+
+### 6.1 预览顶部栏
+
+显示：
+
+- 当前底图文件名。
+- 当前印花文件名。
+- 预览操作模式按钮：
+  - 移动。
+  - 缩放。
+  - 旋转。
+- 缩放比例控制：
+  - 减小。
+  - 当前比例，例如 `82%`。
+  - 放大。
+
+要求：
+
+- 预览缩放只影响画布显示比例，不改变真实合成参数。
+- 当前底图和当前印花需要清晰显示。
+
+### 6.2 画布区域
+
+画布显示：
+
+- 灰色棋盘背景。
+- 衣服底图。
+- 印花图层。
+- 印花选中框。
+- 缩放控制点。
+- 旋转控制点。
+- 操作提示条。
+
+印花选中态：
+
+- 选中框使用蓝色线条。
+- 四角和边中点显示缩放控制点。
+- 顶部显示旋转控制点。
+- 印花可以显示轻微旋转状态。
+
+操作提示：
+
+```text
+拖动移动
+四角 缩放
+顶部 旋转
+Shift 锁比例
+```
+
+要求：
+
+- 画布区域应尽量大。
+- 鼠标交互反馈必须明确。
+- 未加载图片时显示空状态提示。
+- 加载衣服但未加载印花时，只显示衣服底图。
+- 加载衣服和印花后，默认显示可编辑印花图层。
+
+## 7. 右侧参数栏
+
+右侧参数栏用于模板、位置、尺寸、旋转和输出设置。
+
+### 7.1 模板区域
+
+控件：
+
+- 模板下拉框。
+- `保存` 按钮。
+- `另存为` 按钮。
+
+示例模板：
+
+```text
+标准居中印花 · T恤
+```
+
+要求：
+
+- 选择模板后更新当前印花位置、尺寸和旋转。
+- 保存用于覆盖当前自定义模板。
+- 另存为用于创建新模板。
+
+### 7.2 位置区域
+
+控件：
+
+- `X 坐标` 数字输入框。
+- `Y 坐标` 数字输入框。
+
+要求：
+
+- 单位为衣服底图原始像素。
+- 用户输入后实时或确认后更新预览。
+- 预览区拖动后同步更新输入框。
+
+### 7.3 尺寸区域
+
+控件：
+
+- `宽度` 数字输入框。
+- `高度` 数字输入框。
+- `锁定宽高比例` 复选框。
+
+要求：
+
+- 单位为像素。
+- 默认锁定宽高比例。
+- 预览区缩放后同步更新宽度和高度。
+- 输入框修改后同步更新预览。
+
+### 7.4 旋转区域
+
+控件：
+
+- `角度` 数字输入框。
+- `左旋 90°` 按钮。
+- `右旋 90°` 按钮。
+
+要求：
+
+- 角度单位为度。
+- 支持负角度。
+- 顶部旋转控制点拖动后同步角度输入框。
+- 按钮旋转后同步预览和角度输入框。
+
+### 7.5 输出设置区域
+
+控件：
+
+- 输出目录输入框。
+- 浏览目录按钮。
+- 输出格式下拉框。
+- 输出质量下拉框。
+
+要求：
+
+- 输出目录显示完整或省略路径。
+- 格式至少支持 PNG 和 JPG。
+- PNG 默认保留透明相关能力；JPG 需要处理背景。
+- 质量设置用于 JPG 或需要压缩的输出格式。
+
+### 7.6 提示信息区域
+
+用于显示当前操作影响范围。
+
+示例：
+
+```text
+当前调整将仅作用于队列中选中的「黑T_短袖 × 花卉_001」，并标记为「已微调」，重跑模板时不被覆盖。
+```
+
+要求：
+
+- 提示语需要明确说明当前参数影响的是当前单张、选中队列项还是批量模板。
+- 警告和错误信息不能只用颜色表达。
+
+### 7.7 操作按钮
+
+主要按钮：
+
+- `导出当前单张`
+- `应用为模板`
+- `重置为模板`
+
+要求：
+
+- `导出当前单张` 使用主按钮样式。
+- 其他按钮使用次级按钮样式。
+- 当前缺少衣服图或印花图时，导出按钮应禁用。
+
+## 8. 底部合成队列
+
+合成队列用于批量任务预览和导出进度。
+
+### 8.1 队列头部
+
+内容：
+
+- 标题：`合成队列`。
+- 批量模式切换。
+- 队列统计。
+- 队列操作按钮。
+
+批量模式：
+
+- `多衣服 × 单印花`
+- `单衣服 × 多印花`
+- `全组合（矩阵）`
+
+PRD 还要求支持：
+
+- 多衣服和多印花一一匹配。
+
+实现时需要在 UI 中补充 `一一匹配` 模式，或在后续 UI 版本中调整。
+
+队列统计示例：
+
+```text
+共 60 项 · 完成 12 · 进行 1 · 失败 1 · 待导出 46
+```
+
+操作按钮：
+
+- `重置全部`
+- `导出选中`
+- `开始批量导出`
+- 折叠/展开队列。
+
+### 8.2 队列表格
+
+列：
+
+- 序号。
+- 衣服。
+- 印花。
+- 来源文件夹。
+- 参数。
+- 状态。
+- 进度 / 输出文件。
+
+参数状态：
+
+- `模板`
+- `已微调`
+
+任务状态：
+
+- `已完成`
+- `待导出`
+- `导出中`
+- `失败`
+
+要求：
+
+- 当前选中的队列行需要高亮。
+- 导出中显示进度条。
+- 失败行显示具体原因。
+- 输出文件列显示最终文件名或错误说明。
+
+## 9. 底部状态栏
+
+显示：
+
+- 当前衣服。
+- 当前印花。
+- 当前模板。
+- 批量导出状态。
+- 失败数量。
+- 最近日志摘要。
+
+示例：
+
+```text
+衣服：白T_圆领.png
+印花：花卉_001.png
+模板：标准居中印花 · T恤
+批量导出中 12/60
+1 项失败
+已导出 白T_圆领_花卉_001.png
+```
+
+要求：
+
+- 状态栏保持单行。
+- 重要失败状态需要明显，但不要遮挡工作区。
+
+## 10. 视觉规范
+
+整体风格：
+
+- Windows 桌面工具软件。
+- 浅色背景。
+- 蓝色作为主操作色。
+- 边框、分隔线和面板层级清晰。
+- 不使用营销式大图、渐变背景或装饰性卡片。
+
+推荐颜色：
+
+```text
+窗口背景：#f0f0f0
+面板背景：#ffffff
+次级面板：#f7f7f7
+边框：#d6d6d6
+主色：#0067c0 / #0078d4
+成功：#107c10
+警告：#b87a00
+错误：#c42b1c
+画布背景：#9a9da3
+```
+
+字体：
+
+```text
+Segoe UI
+Microsoft YaHei
+微软雅黑
+```
+
+字号：
+
+- 普通文本：12 px。
+- 重要标签：13 px。
+- 辅助说明：11 px。
+
+圆角：
+
+- 控件圆角保持小半径，约 3 px。
+- 不使用大圆角卡片。
+
+## 11. PySide6 控件映射
+
+建议映射：
+
+```text
+主窗口：QMainWindow 或 QWidget
+整体布局：QVBoxLayout + QSplitter / QGridLayout
+左侧素材栏：QWidget + QVBoxLayout
+缩略图列表：QListWidget / QTableView + 自定义 delegate
+中间预览区：QGraphicsView + QGraphicsScene
+右侧参数栏：QScrollArea + QFormLayout / QVBoxLayout
+数字输入：QSpinBox / QDoubleSpinBox
+下拉框：QComboBox
+复选框：QCheckBox
+队列表格：QTableView
+进度条：QProgressBar
+状态栏：QStatusBar 或底部 QWidget
+```
+
+要求：
+
+- 预览区必须优先使用 `QGraphicsView / QGraphicsScene`。
+- 批量队列建议使用模型视图结构，避免后续数据多时卡顿。
+- 缩略图列表可先用 `QListWidget` 实现，后续再优化为模型视图。
+
+## 12. 状态说明
+
+### 12.1 未加载图片
+
+- 左侧列表为空。
+- 中间画布显示空状态提示。
+- 参数区禁用。
+- 导出按钮禁用。
+
+### 12.2 已加载衣服但未加载印花
+
+- 画布显示衣服底图。
+- 印花相关参数禁用。
+- 导出按钮禁用。
+
+### 12.3 已加载衣服和印花
+
+- 画布显示衣服和印花。
+- 印花默认选中。
+- 位置、尺寸、旋转参数可编辑。
+- 单张导出按钮可用。
+
+### 12.4 选中队列项
+
+- 队列行高亮。
+- 预览区显示该队列项的衣服、印花和参数。
+- 若该队列项被手动调整，参数状态显示为 `已微调`。
+
+### 12.5 正在批量导出
+
+- 显示总进度和当前任务进度。
+- `开始批量导出` 按钮应切换为停止或暂停类操作，具体行为后续定义。
+- 允许查看队列状态。
+- 不应阻塞整个界面。
+
+### 12.6 导出失败
+
+- 队列对应行显示 `失败`。
+- 输出列显示失败原因。
+- 状态栏显示失败数量。
+- 日志记录详细异常信息。
+
+## 13. 与当前设计稿的差异和待确认
+
+当前 `ui-v1` 设计稿已经覆盖主要工作流，但有以下待确认点：
+
+- 批量模式缺少 `一一匹配` 明确入口，需要补充。
+- 顶部 `AI 穿搭` 和 `导出上架` 页签不属于第一阶段范围，应确认是隐藏、置灰还是保留为未来入口。
+- 队列中单项微调和模板重跑规则需要在后续需求或交互文档中进一步明确。
+- 批量导出期间是否允许继续调整队列项，需要后续定义。
diff --git a/docs/08-image-editor-design.md b/docs/08-image-editor-design.md
new file mode 100644
index 0000000..6d2921e
--- /dev/null
+++ b/docs/08-image-editor-design.md
@@ -0,0 +1,473 @@
+# 图像编辑器设计
+
+## 1. 文档定位
+
+本文档定义合成预览区的实现规则，包括衣服底图显示、印花图层拖动、缩放、旋转、坐标换算、参数同步，以及预览和最终导出保持一致的规则。
+
+后续任何涉及 `image_canvas.py`、印花变换、坐标换算、图片预览或最终合成一致性的任务，都必须阅读本文档。
+
+## 2. 设计目标
+
+- 用户可以在预览区直接拖动、缩放、旋转印花。
+- 参数面板和预览区双向同步。
+- 预览区缩放不影响真实合成参数。
+- 所有合成参数以衣服底图原始像素坐标系保存。
+- 最终导出结果与预览中的衣服、印花位置、尺寸、角度一致。
+- 图片合成逻辑可以脱离 GUI 单独测试。
+
+## 3. 核心原则
+
+必须遵守：
+
+- Qt 预览负责交互和显示。
+- Pillow 负责最终图片合成和导出。
+- 禁止截图预览区作为最终导出图片。
+- 禁止把屏幕坐标直接保存为合成坐标。
+- 禁止把预览缩放比例写入真实合成参数。
+- `TransformState` 是唯一可信的印花变换状态。
+
+## 4. 坐标系定义
+
+图像编辑器涉及三套坐标系：
+
+### 4.1 屏幕坐标
+
+屏幕坐标是鼠标事件中的窗口坐标或控件坐标。
+
+用途：
+
+- 接收鼠标点击、拖动、滚轮事件。
+- 判断用户操作了哪个控制点。
+
+规则：
+
+- 屏幕坐标只能作为交互输入。
+- 屏幕坐标不能直接用于最终合成。
+
+### 4.2 Scene 坐标
+
+Scene 坐标是 `QGraphicsScene` 中的坐标。
+
+用途：
+
+- 显示衣服底图。
+- 显示印花图层。
+- 显示选中框、缩放手柄和旋转手柄。
+
+推荐规则：
+
+- `QGraphicsScene` 的坐标应尽量与衣服底图原始像素坐标保持一致。
+- 衣服底图左上角放在 scene 坐标 `(0, 0)`。
+- 衣服底图宽高等于原始图片像素宽高。
+- 画布缩放通过 `QGraphicsView` 的 view transform 实现，不修改 scene 中图片真实尺寸。
+
+### 4.3 原图像素坐标
+
+原图像素坐标是衣服底图原始图片的像素坐标。
+
+用途：
+
+- 保存印花位置。
+- 保存印花尺寸。
+- 执行最终 Pillow 合成。
+- 保存模板参数。
+
+规则：
+
+- `TransformState.x` 和 `TransformState.y` 使用原图像素坐标。
+- `TransformState.width` 和 `TransformState.height` 使用原图像素尺寸。
+- `TransformState.rotation` 使用角度，单位为度。
+
+## 5. 图层结构
+
+预览区使用 `QGraphicsView / QGraphicsScene`。
+
+图层顺序：
+
+```text
+背景棋盘格
+衣服底图 Item
+印花图片 Item
+印花选中框 Item
+缩放控制点 Item
+旋转控制点 Item
+操作提示 Overlay
+```
+
+说明：
+
+- 背景棋盘格可以由 view 背景或 scene 背景绘制。
+- 衣服底图不可拖动。
+- 印花图片可拖动、缩放、旋转。
+- 选中框和控制点仅用于交互，不参与最终导出。
+- 操作提示仅显示在 UI 中，不参与最终导出。
+
+## 6. 状态模型
+
+印花变换状态使用统一模型表示：
+
+```text
+TransformState
+  x: float
+  y: float
+  width: float
+  height: float
+  rotation: float
+  keep_aspect_ratio: bool
+```
+
+字段含义：
+
+- `x`：印花未旋转包围盒左上角在衣服原图中的 X 坐标。
+- `y`：印花未旋转包围盒左上角在衣服原图中的 Y 坐标。
+- `width`：印花缩放后的宽度。
+- `height`：印花缩放后的高度。
+- `rotation`：围绕印花中心旋转的角度，单位为度。
+- `keep_aspect_ratio`：是否锁定宽高比例。
+
+规则：
+
+- UI 面板、预览区和导出逻辑必须共享同一个 `TransformState`。
+- 预览区交互完成后更新 `TransformState`。
+- 参数面板输入变化后更新 `TransformState`。
+- `TransformState` 变化后统一刷新预览。
+
+## 7. 印花 Item 设计
+
+建议实现自定义印花图层：
+
+```text
+TransformablePrintItem
+```
+
+职责：
+
+- 显示印花图片。
+- 接收拖动、缩放、旋转交互。
+- 绘制或管理选中框。
+- 发出变换状态变化信号。
+
+不负责：
+
+- 不负责最终 Pillow 导出。
+- 不负责批量任务。
+- 不负责读取文件夹。
+- 不负责保存模板文件。
+
+## 8. 拖动设计
+
+### 8.1 操作行为
+
+用户按住印花主体区域并拖动，移动印花位置。
+
+要求：
+
+- 拖动过程中实时移动印花。
+- 拖动过程中可以实时更新状态，也可以拖动结束后统一提交。
+- 拖动结束后必须同步 X/Y 输入框。
+- 拖动不改变宽度、高度和旋转角度。
+
+### 8.2 坐标更新
+
+拖动位移应在 scene 坐标中计算。
+
+推荐公式：
+
+```text
+new_x = old_x + delta_scene_x
+new_y = old_y + delta_scene_y
+```
+
+由于 scene 坐标与原图像素坐标一致，`new_x` 和 `new_y` 可以直接写入 `TransformState`。
+
+规则：
+
+- 不强制限制印花必须完全在衣服底图内。
+- 导出时只保留衣服画布范围内的内容。
+- 如需边界吸附，应作为后续增强功能，不作为第一阶段必需。
+
+## 9. 缩放设计
+
+### 9.1 控制点
+
+选中印花时显示 8 个缩放控制点：
+
+```text
+左上、上中、右上、右中、右下、下中、左下、左中
+```
+
+第一阶段至少需要支持四角缩放：
+
+```text
+左上、右上、右下、左下
+```
+
+### 9.2 缩放行为
+
+要求：
+
+- 默认锁定宽高比例。
+- 勾选 `锁定宽高比例` 时，拖动四角控制点按原始比例缩放。
+- 取消锁定后，可以独立改变宽度和高度。
+- 缩放后同步宽度和高度输入框。
+- 缩放不改变旋转角度。
+
+### 9.3 最小尺寸
+
+必须设置最小尺寸，避免印花缩放为 0 或负数。
+
+建议：
+
+```text
+min_width = 10 px
+min_height = 10 px
+```
+
+### 9.4 缩放中心
+
+第一阶段推荐使用对角固定缩放：
+
+- 拖动右下角时，左上角保持不动。
+- 拖动左上角时，右下角保持不动。
+- 拖动右上角时，左下角保持不动。
+- 拖动左下角时，右上角保持不动。
+
+若实现复杂度过高，可第一阶段使用中心缩放，但必须保证参数和导出一致。
+
+### 9.5 旋转状态下缩放
+
+旋转后的缩放更复杂。第一阶段推荐规则：
+
+- 控制点跟随旋转后的选中框显示。
+- 计算缩放时先将鼠标点从 scene 坐标转换到印花本地坐标。
+- 在印花本地坐标中计算新的宽高。
+- 再更新 `TransformState`。
+
+如果第一阶段暂不实现旋转状态下的精确控制点缩放，必须在实现说明中明确限制，并保证输入框缩放和导出仍然正确。
+
+## 10. 旋转设计
+
+### 10.1 控制点
+
+旋转控制点位于印花选中框顶部中心外侧，通过一条短线连接选中框。
+
+### 10.2 旋转中心
+
+旋转中心为印花缩放后矩形的中心点。
+
+计算：
+
+```text
+center_x = x + width / 2
+center_y = y + height / 2
+```
+
+### 10.3 鼠标旋转
+
+用户拖动旋转控制点时，根据鼠标当前位置和中心点计算角度。
+
+推荐公式：
+
+```text
+angle = atan2(mouse_y - center_y, mouse_x - center_x)
+rotation = angle_to_degrees(angle) + offset
+```
+
+`offset` 用于让控制点初始方向和视觉方向一致。
+
+要求：
+
+- 拖动时实时更新预览。
+- 旋转结束后同步角度输入框。
+- 角度可以为负数。
+- 内部可以归一化到 `-180..180` 或 `0..360`，但 UI 表示要一致。
+
+### 10.4 按钮旋转
+
+右侧参数栏包含：
+
+- `左旋 90°`
+- `右旋 90°`
+
+规则：
+
+```text
+左旋 90°：rotation = rotation - 90
+右旋 90°：rotation = rotation + 90
+```
+
+更新后必须刷新预览并同步输入框。
+
+## 11. 参数面板同步
+
+参数面板包含：
+
+- X 坐标。
+- Y 坐标。
+- 宽度。
+- 高度。
+- 锁定宽高比例。
+- 角度。
+
+同步规则：
+
+```text
+预览区交互 -> 更新 TransformState -> 更新参数面板
+参数面板输入 -> 更新 TransformState -> 刷新预览区
+模板选择 -> 生成 TransformState -> 刷新预览区和参数面板
+队列项选择 -> 加载该项 TransformState -> 刷新预览区和参数面板
+```
+
+防循环规则：
+
+- 参数面板程序化更新输入框时，应避免触发重复变更。
+- 可以使用 `blockSignals(True/False)` 或内部更新标记。
+
+## 12. 预览缩放
+
+预览区支持画布缩放，例如：
+
+```text
+82%
+```
+
+规则：
+
+- 预览缩放只改变 `QGraphicsView` 的显示变换。
+- 预览缩放不改变 `TransformState.x/y/width/height`。
+- 鼠标事件需要通过 Qt 的坐标映射转换回 scene 坐标。
+
+推荐：
+
+```text
+view.mapToScene(mouse_pos)
+```
+
+## 13. 最终导出设计
+
+最终导出由 Pillow 执行，不使用 Qt 截图。
+
+### 13.1 单张合成输入
+
+```text
+garment_path
+print_path
+TransformState
+ExportOptions
+```
+
+### 13.2 合成步骤
+
+推荐流程：
+
+```text
+读取衣服底图为 RGBA
+读取印花图为 RGBA
+将印花缩放到 TransformState.width / height
+按 TransformState.rotation 围绕中心旋转
+计算旋转后图片应粘贴到衣服底图上的位置
+使用 alpha_composite 合成
+根据 ExportOptions 保存 PNG 或 JPG
+```
+
+### 13.3 旋转后粘贴位置
+
+Pillow 旋转通常会产生新的包围盒。
+
+规则：
+
+- `TransformState.x/y/width/height` 表示旋转前矩形。
+- 旋转中心为该矩形中心。
+- 旋转后图片粘贴位置应保证旋转中心仍落在同一个中心点。
+
+计算：
+
+```text
+center_x = x + width / 2
+center_y = y + height / 2
+paste_x = center_x - rotated_width / 2
+paste_y = center_y - rotated_height / 2
+```
+
+### 13.4 输出格式
+
+PNG：
+
+- 保留 RGBA 或按需求输出不透明图。
+
+JPG：
+
+- JPG 不支持透明通道。
+- 保存 JPG 前必须合成到 RGB 背景。
+- 默认背景建议使用白色，除非后续有其他需求。
+
+## 14. 预览与导出一致性
+
+必须保证：
+
+- Qt 中印花显示位置来自 `TransformState`。
+- Pillow 导出也使用同一个 `TransformState`。
+- 两边使用相同的旋转中心。
+- 两边使用相同的宽度、高度和角度定义。
+- 预览缩放比例不参与导出。
+
+允许存在的差异：
+
+- Qt 和 Pillow 的抗锯齿细节可能略有不同。
+- 字节级像素不要求完全一致。
+
+不允许存在的差异：
+
+- 印花明显偏移。
+- 印花尺寸明显不同。
+- 旋转中心不同。
+- 透明区域显示异常。
+
+## 15. 队列项微调
+
+UI 设计稿中存在 `已微调` 状态。
+
+定义：
+
+- 当用户选中队列中的某一项，并手动调整位置、尺寸或旋转后，该队列项标记为 `已微调`。
+- `已微调` 队列项应保存自己的 `TransformState`。
+- 重新应用模板时，是否覆盖 `已微调` 项需要用户确认或遵循明确规则。
+
+第一阶段推荐规则：
+
+- 当前队列项被手动调整后标记为 `已微调`。
+- 批量导出时，已微调项使用自己的 `TransformState`。
+- 未微调项使用当前模板生成的 `TransformState`。
+
+## 16. 边界情况
+
+必须处理：
+
+- 印花部分超出衣服画布。
+- 印花完全超出衣服画布。
+- 印花透明 PNG。
+- 衣服图和印花图尺寸很大。
+- 文件路径包含中文。
+- 宽度或高度输入为 0、负数或非数字。
+- 旋转角度超过 360 度。
+
+处理规则：
+
+- 部分超出画布允许导出，只保留画布内内容。
+- 完全超出画布时可以导出空印花效果，但应提示用户确认或标记风险。
+- 非法尺寸输入应阻止提交并提示。
+- 角度可以归一化显示。
+
+## 17. 测试建议
+
+核心测试：
+
+- 未旋转印花合成位置正确。
+- 缩放后导出尺寸正确。
+- 旋转 90 度后中心不偏移。
+- 旋转 -8 度后预览和导出大体一致。
+- 印花部分超出画布时不会报错。
+- 透明 PNG 不出现黑底或白底。
+- 预览缩放到 50% 或 200% 后，拖动仍能得到正确原图坐标。
+- 参数面板输入后预览同步。
+- 预览拖动后参数面板同步。
diff --git a/docs/09-packaging-release.md b/docs/09-packaging-release.md
new file mode 100644
index 0000000..30d5b0f
--- /dev/null
+++ b/docs/09-packaging-release.md
@@ -0,0 +1,262 @@
+# 打包发布设计
+
+## 1. 文档定位
+
+本文档定义第一阶段的本地打包和发布规则。当前阶段只考虑将软件打包为可在 Windows 电脑上运行的桌面程序。
+
+暂不包含：
+
+- 局域网分发。
+- 自动更新。
+- 多版本启动器。
+- 强制升级策略。
+- 远程版本策略管理。
+
+这些能力后续需要时再单独补充设计文档。
+
+## 2. 打包目标
+
+- 将 PySide6 桌面程序打包为 Windows 可运行程序。
+- 目标电脑无需预装 Python 环境。
+- 打包产物应包含运行所需依赖、资源文件、默认配置和模板。
+- 打包后的程序应能在 Windows 10 / Windows 11 上启动。
+- 打包结构应方便排查 Qt 插件、资源、配置和日志问题。
+
+## 3. 推荐打包方式
+
+使用 PyInstaller。
+
+第一阶段推荐使用 `onedir` 模式：
+
+```bash
+pyinstaller --onedir --windowed src/main.py
+```
+
+原因：
+
+- PySide6 / Qt 依赖文件较多，`onedir` 更容易排查问题。
+- 启动速度通常优于 `onefile`。
+- 资源文件、配置文件、模板文件更容易随程序目录管理。
+- 后续如需局域网分发或增量替换，目录模式更合适。
+
+不推荐第一阶段使用 `onefile`：
+
+- 启动时需要解压临时文件。
+- Qt 插件问题更难排查。
+- 日志、模板和配置路径更容易混乱。
+
+## 4. Python 与依赖要求
+
+必须遵守：
+
+- Python 版本：Python 3.7。
+- GUI 框架：PySide6。
+- 推荐 PySide6 版本：`PySide6==6.5.3`。
+- 图片处理：Pillow。
+- 打包工具：PyInstaller。
+
+依赖版本应在项目根目录的 `requirements.txt` 中锁定。
+
+打包前必须确认依赖可以在 Python 3.7 环境中安装。
+
+## 5. 发布目录结构
+
+推荐打包后的发布目录：
+
+```text
+AutoPrint/
+  AutoPrint.exe
+  _internal/
+  config/
+    app_config.json
+    templates.json
+  resources/
+    icons/
+    styles/
+  logs/
+  output/
+  README.txt
+```
+
+说明：
+
+- `AutoPrint.exe`：主程序入口。
+- `_internal/`：PyInstaller 依赖目录。
+- `config/`：默认配置和模板配置。
+- `resources/`：图标、样式等资源。
+- `logs/`：运行日志目录，程序启动时可自动创建。
+- `output/`：默认输出目录，可自动创建。
+- `README.txt`：给用户的简短使用说明。
+
+## 6. 可写目录规则
+
+程序运行时可能写入：
+
+- 日志文件。
+- 用户配置。
+- 自定义模板。
+- 导出图片。
+
+规则：
+
+- 程序必须确保 `logs/` 目录存在。
+- 程序必须确保默认 `output/` 目录存在。
+- 配置和模板写入前必须确认目录可写。
+- 如果安装目录不可写，应提示用户选择可写目录，或后续改用用户数据目录。
+
+第一阶段可以默认将配置、模板、日志和输出放在程序目录下，但必须处理目录不可写的错误。
+
+## 7. 资源文件打包
+
+需要随程序打包的资源：
+
+- 应用图标。
+- UI 样式文件。
+- 默认模板文件。
+- 默认配置文件。
+
+规则：
+
+- 资源文件路径不能写死为开发机绝对路径。
+- 程序需要通过统一的资源路径函数获取资源。
+- 打包环境和开发环境应使用同一套路径访问规则。
+
+建议提供路径辅助函数：
+
+```text
+get_app_dir()
+get_resource_path(relative_path)
+get_config_path(relative_path)
+get_log_dir()
+get_output_dir()
+```
+
+## 8. PyInstaller 配置
+
+第一阶段可以先使用命令行打包；项目稳定后应维护 `.spec` 文件。
+
+建议命令：
+
+```bash
+pyinstaller ^
+  --onedir ^
+  --windowed ^
+  --name AutoPrint ^
+  --add-data "resources;resources" ^
+  --add-data "config;config" ^
+  src/main.py
+```
+
+注意：
+
+- Windows 下 `--add-data` 的源路径和目标路径使用分号 `;` 分隔。
+- 如果在 PowerShell 中执行，换行符和引号需要按实际环境调整。
+- 打包命令应后续固化到脚本中，例如 `scripts/build.ps1`。
+
+## 9. 版本号规则
+
+软件需要有明确版本号。
+
+规则：
+
+- 当前版本号必须显示在标题栏软件名称右侧。
+- 版本号应从统一位置读取，不应在多个 UI 文件中硬编码。
+- 打包产物的版本号、窗口显示版本号和发布目录版本号应一致。
+
+建议维护：
+
+```text
+src/version.py
+```
+
+示例：
+
+```python
+APP_NAME = "自动合成印花服饰效果图工具"
+APP_VERSION = "1.0.0"
+```
+
+发布目录建议带版本号：
+
+```text
+AutoPrint-1.0.0/
+```
+
+## 10. 打包前检查
+
+打包前必须检查：
+
+- Python 版本是否为 3.7。
+- 依赖是否安装成功。
+- 程序是否可以在开发环境启动。
+- 默认配置文件是否存在。
+- 默认模板文件是否存在。
+- 资源文件路径是否正确。
+- 应用版本号是否正确。
+
+建议命令：
+
+```bash
+python --version
+pip freeze
+python src/main.py
+```
+
+## 11. 打包后验证
+
+打包后必须验证：
+
+- 双击 `AutoPrint.exe` 可以启动。
+- 标题栏显示正确版本号。
+- 可以打开衣服图片文件夹。
+- 可以打开印花图片文件夹。
+- 可以显示预览区。
+- 可以拖动、缩放、旋转印花。
+- 可以导出当前单张图片。
+- 可以生成日志文件。
+- 程序关闭后再次启动正常。
+
+若测试机器没有 Python 环境，应优先在该机器上验证。
+
+## 12. 发布产物
+
+第一阶段发布产物建议为压缩包：
+
+```text
+AutoPrint-1.0.0.zip
+```
+
+压缩包内包含：
+
+```text
+AutoPrint-1.0.0/
+  AutoPrint.exe
+  _internal/
+  config/
+  resources/
+  README.txt
+```
+
+不应包含：
+
+- 源代码。
+- 测试文件。
+- 开发环境缓存。
+- 临时输出图片。
+- 本机私人配置。
+- 打包中间目录。
+
+## 13. 暂不做
+
+第一阶段不做：
+
+- 局域网共享目录发布。
+- 自动检查新版本。
+- 自动下载更新。
+- 多版本共存启动器。
+- 按电脑名控制版本。
+- 安装程序。
+- Windows 注册表写入。
+- 开机自启动。
+
+如果后续要增加这些能力，应新增或扩展发布分发文档，不能直接混入当前第一阶段打包规则。
diff --git a/docs/ui-v1.html b/docs/ui-v1.html
new file mode 100644
index 0000000..e036e2c
--- /dev/null
+++ b/docs/ui-v1.html
@@ -0,0 +1,345 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+<meta charset="UTF-8">
+<title>自动合成印花服饰效果图工具 — 完整版</title>
+<style>
+  :root{
+    --win:#f0f0f0;--panel:#fff;--panel-2:#f7f7f7;--line:#d6d6d6;--line-2:#e3e3e3;
+    --canvas:#9a9da3;--txt:#202020;--txt-2:#555;--txt-3:#888;
+    --accent:#0067c0;--accent-2:#0078d4;--accent-soft:#cfe4f7;--accent-bg:#e8f1fb;
+    --green:#107c10;--amber:#b87a00;--red:#c42b1c;--r:3px;
+    --font:"Segoe UI","Microsoft YaHei","微软雅黑",sans-serif;
+  }
+  *{box-sizing:border-box;margin:0;padding:0}
+  body{font-family:var(--font);color:var(--txt);font-size:12px;background:#cfcfcf;display:flex;align-items:center;justify-content:center;padding:24px;min-height:100vh}
+  .app{width:1920px;height:1080px;background:var(--win);display:grid;grid-template-rows:34px 40px 1fr 188px 26px;border:1px solid #b5b5b5;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.35);transform-origin:center}
+  @media(max-width:2000px){.app{transform:scale(.92)}}
+  @media(max-width:1800px){.app{transform:scale(.78)}}
+  @media(max-width:1500px){.app{transform:scale(.62)}}
+  @media(max-width:1200px){.app{transform:scale(.48)}}
+  @media(max-width:950px){.app{transform:scale(.34)}}
+
+  .title{background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 0 0 12px;height:34px}
+  .title .ic{width:18px;height:18px;border-radius:3px;background:linear-gradient(135deg,#0078d4,#005a9e);display:grid;place-items:center;color:#fff;font-size:11px;font-weight:700;margin-right:8px}
+  .title .t{font-size:12px;color:var(--txt)}
+  .title .ver{font-size:11px;color:var(--txt-3);margin-left:8px}
+  .title .gear{margin-left:auto;display:flex;align-items:center;gap:6px;height:100%;padding:0 12px;color:var(--txt-2);border-left:1px solid var(--line-2)}
+  .title .gear:hover{background:#f0f0f0}
+  .title .win-btns{display:flex;height:34px}
+  .title .wb{width:46px;display:grid;place-items:center;color:#444;font-size:11px}
+  .title .wb.close:hover{background:#c42b1c;color:#fff}.title .wb:hover{background:#e6e6e6}
+
+  .tabs{background:var(--win);border-bottom:1px solid var(--line);display:flex;align-items:flex-end;padding:0 12px;gap:4px}
+  .tab{display:flex;align-items:center;gap:8px;height:32px;padding:0 18px;background:#e4e4e4;border:1px solid var(--line);border-bottom:none;border-radius:6px 6px 0 0;color:var(--txt-2);position:relative;top:1px}
+  .tab .num{width:18px;height:18px;border-radius:50%;background:#bcbcbc;color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center}
+  .tab .nm{font-size:13px}
+  .tab.on{background:#fff;color:var(--txt);border-color:var(--line);font-weight:600}
+  .tab.on .num{background:var(--accent)}
+  .tab:not(.on):hover{background:#ececec}
+  .tab .arw{color:var(--txt-3);margin:0 -2px 0 6px;font-size:12px}
+
+  .toolbar{background:var(--win);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 8px;gap:2px}
+  .menu{display:flex;gap:2px;margin-right:10px}
+  .menu .m{padding:4px 9px;border-radius:var(--r)}.menu .m:hover{background:#e5e5e5}
+  .tsep{width:1px;height:24px;background:var(--line);margin:0 6px}
+  .tb{display:flex;align-items:center;gap:6px;height:30px;padding:0 10px;background:#fff;border:1px solid var(--line);border-radius:var(--r)}
+  .tb:hover{background:#f3f8fd;border-color:var(--accent-soft)}.tb .g{font-size:13px}
+  .spacer{flex:1}
+
+  .body{display:grid;grid-template-columns:374px 1fr 318px;min-height:0}
+
+  .left{background:var(--panel);border-right:1px solid var(--line);display:grid;grid-template-rows:1fr 1fr;min-height:0}
+  .mat{display:flex;flex-direction:column;min-height:0}.mat+.mat{border-top:1px solid var(--line)}
+  .open-btn{display:flex;align-items:center;justify-content:center;gap:7px;height:32px;margin:8px 12px 0;background:var(--accent);color:#fff;border-radius:var(--r);font-size:12px;font-weight:600;border:1px solid var(--accent)}
+  .open-btn:hover{background:var(--accent-2)}.open-btn .g{font-size:14px}
+  .mat-h{display:flex;align-items:center;justify-content:space-between;padding:8px 12px 6px;background:var(--panel-2);border-bottom:1px solid var(--line-2)}
+  .mat-h .t{font-weight:600}.mat-h .c{color:var(--txt-3);font-size:11px}
+  .mat-bar{display:flex;align-items:center;gap:10px;padding:6px 12px;border-bottom:1px solid var(--line-2);font-size:11px;color:var(--txt-2)}
+  .ckall{display:flex;align-items:center;gap:5px}
+  .cbox{width:13px;height:13px;border:1px solid #999;border-radius:2px;background:#fff;display:inline-block;flex:none}
+  .cbox.on{background:var(--accent);border-color:var(--accent)}
+  .cbox.on::after{content:"✓";color:#fff;font-size:9px;line-height:12px;display:block;text-align:center}
+  .cbox.dash{background:var(--accent);border-color:var(--accent)}
+  .cbox.dash::after{content:"–";color:#fff;font-size:11px;line-height:11px;display:block;text-align:center}
+  .mat-bar .srt{margin-left:auto;display:flex;align-items:center;gap:4px;color:var(--txt-3)}
+  .grid{flex:1;overflow:auto;display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:10px 12px;align-content:start}
+  .th{position:relative;aspect-ratio:1/1.12;border:1px solid var(--line);border-radius:var(--r);background:#fafafa;overflow:hidden}
+  .th .im{position:absolute;inset:0}
+  .th .cap{position:absolute;left:0;right:0;bottom:0;background:rgba(255,255,255,.93);border-top:1px solid var(--line-2);font-size:10px;color:#333;padding:2px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+  .th .ck{position:absolute;top:4px;left:4px;width:14px;height:14px;border:1px solid #aaa;border-radius:2px;background:rgba(255,255,255,.92)}
+  .th .fld{position:absolute;top:4px;right:4px;background:rgba(40,40,40,.72);color:#fff;font-size:9px;line-height:1;padding:2px 5px;border-radius:8px;max-width:64px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+  .th.sel{border:2px solid var(--accent);background:var(--accent-bg)}
+  .th.sel .ck,.th.ckd .ck{background:var(--accent);border-color:var(--accent)}
+  .th.sel .ck::after,.th.ckd .ck::after{content:"✓";color:#fff;font-size:9px;line-height:12px;display:block;text-align:center}
+
+  .tee-1{background:radial-gradient(circle at 50% 36%,#fff 0 34%,#ededeb 62%,#dcdcd8 100%)}
+  .tee-2{background:radial-gradient(circle at 50% 36%,#3a3f47 0 34%,#2c3037 62%,#202329 100%)}
+  .tee-3{background:radial-gradient(circle at 50% 36%,#2f567a 0 34%,#274764 62%,#1d3950 100%)}
+  .tee-4{background:radial-gradient(circle at 50% 36%,#883535 0 34%,#6e2a2a 62%,#541f1f 100%)}
+  .tee-5{background:radial-gradient(circle at 50% 36%,#46784a 0 34%,#3a623d 62%,#2c4b2f 100%)}
+  .tee-6{background:radial-gradient(circle at 50% 36%,#cdb56e 0 34%,#bba258 62%,#a18a45 100%)}
+  .pr-1{background:conic-gradient(from 20deg,#ff6b6b,#feca57,#48dbfb,#ff9ff3,#ff6b6b)}
+  .pr-2{background:linear-gradient(135deg,#222 0 50%,#f1f1f1 50%)}
+  .pr-3{background:repeating-linear-gradient(45deg,#333 0 7px,#eee 7px 14px)}
+  .pr-4{background:radial-gradient(circle at 50% 50%,#ff7e5f,#feb47b)}
+  .pr-5{background:linear-gradient(120deg,#5f27cd,#48dbfb)}
+  .pr-6{background:radial-gradient(circle at 30% 30%,#10ac84,#222f3e)}
+
+  .center{background:var(--canvas);display:grid;grid-template-rows:34px 1fr;min-height:0}
+  .cbar{display:flex;align-items:center;gap:14px;padding:0 12px;background:#e8e8e8;border-bottom:1px solid var(--line)}
+  .cbar .f{color:#444}.cbar .f b{color:#000}
+  .vtool{display:flex;gap:2px;margin-left:6px}
+  .vtool .v{width:26px;height:24px;display:grid;place-items:center;border:1px solid transparent;border-radius:var(--r);color:#444;font-size:13px}
+  .vtool .v.on{background:#fff;border-color:var(--line);color:var(--accent)}
+  .zoom{margin-left:auto;display:flex;align-items:center;gap:2px}
+  .zoom .zb{width:24px;height:24px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);font-size:13px}
+  .zoom .zv{min-width:46px;text-align:center;color:#444}
+  .stage{position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(45deg,#90939a 25%,transparent 25%) 0 0/20px 20px,linear-gradient(-45deg,#90939a 25%,transparent 25%) 0 10px/20px 20px,linear-gradient(45deg,transparent 75%,#90939a 75%) 10px -10px/20px 20px,linear-gradient(-45deg,transparent 75%,#90939a 75%) -10px 0/20px 20px,var(--canvas)}
+  .garment{position:relative;width:470px;height:574px;filter:drop-shadow(0 10px 26px rgba(0,0,0,.32))}
+  .shirt{position:absolute;inset:0;background:#fcfcfa;clip-path:polygon(32% 0%,42% 6%,58% 6%,68% 0%,88% 12%,100% 30%,86% 42%,78% 36%,78% 100%,22% 100%,22% 36%,14% 42%,0% 30%,12% 12%);box-shadow:inset 0 0 50px rgba(0,0,0,.05)}
+  .collar{position:absolute;top:0;left:50%;transform:translateX(-50%);width:118px;height:44px;border-radius:0 0 59px 59px;background:var(--canvas)}
+  .print{position:absolute;top:170px;left:50%;transform:translateX(-50%) rotate(-8deg);width:174px;height:174px;border-radius:6px;background:conic-gradient(from 20deg,#ff6b6b,#feca57,#48dbfb,#ff9ff3,#ff6b6b);display:grid;place-items:center}
+  .print::after{content:"";width:62%;height:62%;border-radius:50%;background:rgba(255,255,255,.22);box-shadow:inset 0 0 0 6px rgba(255,255,255,.32)}
+  .selbox{position:absolute;top:158px;left:50%;transform:translateX(-50%) rotate(-8deg);width:196px;height:196px;border:1.5px solid var(--accent)}
+  .hd{position:absolute;width:10px;height:10px;background:#fff;border:1.5px solid var(--accent)}
+  .tl{top:-5px;left:-5px}.tr{top:-5px;right:-5px}.bl{bottom:-5px;left:-5px}.br{bottom:-5px;right:-5px}
+  .tt{top:-5px;left:50%;transform:translateX(-50%)}.bb{bottom:-5px;left:50%;transform:translateX(-50%)}
+  .ll{left:-5px;top:50%;transform:translateY(-50%)}.rr{right:-5px;top:50%;transform:translateY(-50%)}
+  .stem{position:absolute;top:-30px;left:50%;transform:translateX(-50%);width:1.5px;height:26px;background:var(--accent)}
+  .knob{position:absolute;top:-40px;left:50%;transform:translateX(-50%);width:15px;height:15px;border-radius:50%;background:#fff;border:1.5px solid var(--accent);display:grid;place-items:center;color:var(--accent);font-size:9px}
+  .hint{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:14px;background:rgba(255,255,255,.94);border:1px solid var(--line);padding:5px 12px;border-radius:4px;font-size:11px;color:#444}
+  .hint span{display:flex;align-items:center;gap:5px}.kbd{background:#eee;border:1px solid var(--line);border-radius:2px;padding:0 5px;font-size:10px}
+
+  .right{background:var(--win);border-left:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
+  .rscroll{flex:1;overflow:auto;padding:12px}
+  .grp{border:1px solid var(--line);border-radius:var(--r);background:#fff;margin-bottom:12px;position:relative;padding:14px 12px 12px}
+  .grp-t{position:absolute;top:-8px;left:9px;background:#fff;padding:0 6px;font-size:11px;font-weight:600;color:var(--txt-2)}
+  .row{display:flex;gap:8px;margin-bottom:8px}.row:last-child{margin-bottom:0}.fl{flex:1}
+  .fl label{display:block;color:var(--txt-2);margin-bottom:4px;font-size:11px}
+  .inp{display:flex;align-items:center;height:28px;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:0 7px}
+  .inp input{border:none;outline:none;width:100%;font:inherit;color:var(--txt);background:none}
+  .inp.spin{padding-right:0}.inp .u{color:var(--txt-3);font-size:11px}
+  .inp .stp{display:flex;flex-direction:column;border-left:1px solid var(--line-2);height:100%}
+  .inp .stp i{flex:1;width:18px;display:grid;place-items:center;font-size:8px;color:#666;font-style:normal}
+  .inp.focus{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
+  .sel{display:flex;align-items:center;justify-content:space-between;height:28px;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:0 8px}
+  .sel .car{color:#666;font-size:10px}
+  .ckline{display:flex;align-items:center;gap:6px;color:var(--txt-2);margin:8px 0 0}
+  .rotbtns{display:flex;gap:8px}
+  .ibtn{flex:1;height:28px;border:1px solid var(--line);border-radius:var(--r);background:#fff;display:flex;align-items:center;justify-content:center;gap:5px}.ibtn:hover{background:#f3f8fd}
+  .path{display:flex;align-items:center;height:28px;border:1px solid var(--line);border-radius:var(--r);background:#fff}
+  .path .p{flex:1;padding:0 7px;color:#444;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+  .path .br{width:30px;height:100%;border-left:1px solid var(--line);display:grid;place-items:center;background:var(--win)}
+  .tipbox{display:flex;gap:6px;align-items:flex-start;background:#fff8e6;border:1px solid #f0dca0;border-radius:var(--r);padding:7px 9px;font-size:11px;color:#7a5b00;margin-top:2px}
+  .actions{padding:10px 12px;border-top:1px solid var(--line);background:var(--win)}
+  .btn{width:100%;height:34px;border-radius:var(--r);display:flex;align-items:center;justify-content:center;gap:7px;font-size:12px;font-weight:600;border:1px solid var(--line)}
+  .btn.pri{background:var(--accent);border-color:var(--accent);color:#fff}.btn.pri:hover{background:var(--accent-2)}
+  .btn.sec{background:#fff}.btn.sec:hover{background:#f3f8fd}
+  .brow{display:flex;gap:8px;margin-top:8px}.brow .btn{margin-top:0}
+
+  /* ---- BOTTOM QUEUE PANEL ---- */
+  .queue{background:#fff;border-top:1px solid var(--line);display:grid;grid-template-rows:34px 1fr;min-height:0}
+  .q-head{display:flex;align-items:center;gap:12px;padding:0 12px;background:var(--panel-2);border-bottom:1px solid var(--line-2)}
+  .q-head .qt{font-weight:600}
+  .q-head .modes{display:flex;gap:0;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;margin-left:6px}
+  .q-head .mode{padding:5px 11px;color:var(--txt-2);border-right:1px solid var(--line);background:#fff}
+  .q-head .mode:last-child{border-right:none}
+  .q-head .mode.on{background:var(--accent);color:#fff}
+  .q-head .qmeta{color:var(--txt-3);font-size:11px;margin-left:4px}
+  .q-head .qbtns{margin-left:auto;display:flex;gap:8px}
+  .q-head .qb{height:26px;padding:0 12px;border:1px solid var(--line);border-radius:var(--r);background:#fff;display:flex;align-items:center;gap:6px}
+  .q-head .qb.pri{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
+  .q-head .qb.collapse{width:26px;padding:0;justify-content:center;color:var(--txt-3)}
+  .q-body{overflow:auto;padding:0}
+  table.qtbl{width:100%;border-collapse:collapse;font-size:11px}
+  table.qtbl th{position:sticky;top:0;background:#f4f4f4;border-bottom:1px solid var(--line);text-align:left;font-weight:600;color:var(--txt-2);padding:6px 10px;white-space:nowrap}
+  table.qtbl td{border-bottom:1px solid var(--line-2);padding:5px 10px;color:var(--txt);white-space:nowrap}
+  table.qtbl tr.sel td{background:var(--accent-bg)}
+  table.qtbl tr:hover td{background:#f7faff}
+  .qidx{color:var(--txt-3);width:34px}
+  .swatch{width:14px;height:14px;border-radius:3px;display:inline-block;vertical-align:-3px;margin-right:6px;border:1px solid rgba(0,0,0,.15)}
+  .pill{display:inline-block;padding:1px 8px;border-radius:9px;font-size:10px;font-weight:600}
+  .pill.tpl{background:#eef3f9;color:#2b5b8c}
+  .pill.adj{background:#fff3da;color:#8a5a00}
+  .pill.wait{background:#eee;color:#666}
+  .pill.run{background:#e0eefc;color:#15538f}
+  .pill.done{background:#e3f3e3;color:#2c7a2c}
+  .pill.err{background:#fbe4e2;color:#a3271c}
+  .qprog{display:inline-block;width:90px;height:5px;border-radius:3px;background:#eaeaea;overflow:hidden;vertical-align:middle;margin-right:8px}
+  .qprog i{display:block;height:100%;background:var(--accent)}
+
+  .status{background:#fff;border-top:1px solid var(--line);display:flex;align-items:center;padding:0 12px;gap:14px;color:var(--txt-2);font-size:11px}
+  .status .s{display:flex;align-items:center;gap:5px}.status b{color:var(--txt);font-weight:600}
+  .dot{width:7px;height:7px;border-radius:50%}.g{background:var(--green)}.a{background:var(--amber)}.r{background:var(--red)}
+  .status .sp{flex:1}.status .log{color:var(--green)}.vsep{width:1px;height:14px;background:var(--line-2)}
+</style>
+</head>
+<body>
+<div class="app">
+
+  <div class="title">
+    <div class="ic">印</div><div class="t">自动合成印花服饰效果图工具</div><div class="ver">v1.0.0</div>
+    <div class="gear"><span style="font-size:14px">⚙️</span>设置</div>
+    <div class="win-btns"><div class="wb">—</div><div class="wb">▢</div><div class="wb close">✕</div></div>
+  </div>
+
+  <div class="tabs">
+    <div class="tab on"><span class="num">1</span><span class="nm">添加印花</span></div>
+    <div class="tab"><span class="num">2</span><span class="nm">AI 穿搭</span></div>
+    <div class="tab"><span class="num">3</span><span class="nm">导出上架</span></div>
+  </div>
+
+  <div class="body">
+    <!-- LEFT -->
+    <div class="left">
+      <div class="mat">
+        <div class="open-btn"><span class="g">📁</span>打开衣服文件夹</div>
+        <div class="mat-h"><span class="t">衣服图片</span><span class="c">含子文件夹 · 共 12</span></div>
+        <div class="mat-bar">
+          <span class="ckall"><span class="cbox dash"></span>全选</span>
+          <span class="vsep"></span><span>已选 3</span>
+          <span class="srt">排序：文件夹+名称 ▾</span>
+        </div>
+        <div class="grid">
+          <div class="th sel"><div class="im tee-1"></div><div class="ck"></div><div class="fld">夏季</div><div class="cap">夏季/白T_圆领.png</div></div>
+          <div class="th ckd"><div class="im tee-2"></div><div class="ck"></div><div class="fld">夏季</div><div class="cap">夏季/黑T_短袖.png</div></div>
+          <div class="th ckd"><div class="im tee-3"></div><div class="ck"></div><div class="fld">夏季</div><div class="cap">夏季/藏青_长袖.png</div></div>
+          <div class="th"><div class="im tee-4"></div><div class="ck"></div><div class="fld">秋季</div><div class="cap">秋季/酒红_卫衣.png</div></div>
+          <div class="th"><div class="im tee-5"></div><div class="ck"></div><div class="fld">秋季</div><div class="cap">秋季/军绿_圆领.png</div></div>
+          <div class="th"><div class="im tee-6"></div><div class="ck"></div><div class="fld">秋季</div><div class="cap">秋季/卡其_POLO.png</div></div>
+          <div class="th"><div class="im tee-2"></div><div class="ck"></div><div class="fld">基础</div><div class="cap">基础/黑T_宽松.png</div></div>
+          <div class="th"><div class="im tee-1"></div><div class="ck"></div><div class="fld">基础</div><div class="cap">基础/米白_打底.png</div></div>
+          <div class="th"><div class="im tee-3"></div><div class="ck"></div><div class="fld">基础</div><div class="cap">基础/蓝灰_V领.png</div></div>
+        </div>
+      </div>
+      <div class="mat">
+        <div class="open-btn"><span class="g">🎨</span>打开印花文件夹</div>
+        <div class="mat-h"><span class="t">印花图片</span><span class="c">含子文件夹 · 共 8</span></div>
+        <div class="mat-bar">
+          <span class="ckall"><span class="cbox on"></span>全选</span>
+          <span class="vsep"></span><span>已选 8</span>
+          <span class="srt">排序：文件夹+名称 ▾</span>
+        </div>
+        <div class="grid">
+          <div class="th sel"><div class="im pr-1"></div><div class="ck"></div><div class="fld">花卉</div><div class="cap">花卉/花卉_001.png</div></div>
+          <div class="th ckd"><div class="im pr-2"></div><div class="ck"></div><div class="fld">几何</div><div class="cap">几何/几何_黑白.png</div></div>
+          <div class="th ckd"><div class="im pr-3"></div><div class="ck"></div><div class="fld">几何</div><div class="cap">几何/条纹_斜.png</div></div>
+          <div class="th ckd"><div class="im pr-4"></div><div class="ck"></div><div class="fld">风景</div><div class="cap">风景/日落_暖.png</div></div>
+          <div class="th ckd"><div class="im pr-5"></div><div class="ck"></div><div class="fld">渐变</div><div class="cap">渐变/渐变_紫.png</div></div>
+          <div class="th ckd"><div class="im pr-6"></div><div class="ck"></div><div class="fld">LOGO</div><div class="cap">LOGO/地球_logo.png</div></div>
+        </div>
+      </div>
+    </div>
+
+    <!-- CENTER -->
+    <div class="center">
+      <div class="cbar">
+        <div class="f">底图：<b>白T_圆领.png</b></div>
+        <div class="f">印花：<b>花卉_001.png</b></div>
+        <div class="vtool"><div class="v on">✥</div><div class="v">⤢</div><div class="v">↻</div></div>
+        <div class="zoom"><div class="zb">−</div><div class="zv">82%</div><div class="zb">+</div></div>
+      </div>
+      <div class="stage">
+        <div class="garment">
+          <div class="shirt"></div><div class="collar"></div>
+          <div class="print"></div>
+          <div class="selbox">
+            <span class="stem"></span><span class="knob">↻</span>
+            <span class="hd tl"></span><span class="hd tr"></span><span class="hd bl"></span><span class="hd br"></span>
+            <span class="hd tt"></span><span class="hd bb"></span><span class="hd ll"></span><span class="hd rr"></span>
+          </div>
+        </div>
+        <div class="hint"><span>🖱️ 拖动移动</span><span>四角 缩放</span><span>顶部 旋转</span><span><span class="kbd">Shift</span> 锁比例</span></div>
+      </div>
+    </div>
+
+    <!-- RIGHT -->
+    <div class="right">
+      <div class="rscroll">
+        <div class="grp"><div class="grp-t">模板</div><div class="sel"><span>标准居中印花 · T恤</span><span class="car">▼</span></div>
+          <div class="brow" style="margin-top:10px">
+            <div class="btn sec" style="height:30px">💾 保存</div>
+            <div class="btn sec" style="height:30px">📋 另存为</div>
+          </div>
+        </div>
+        <div class="grp"><div class="grp-t">位置</div>
+          <div class="row">
+            <div class="fl"><label>X 坐标</label><div class="inp spin focus"><input value="175"><span class="stp"><i>▲</i><i>▼</i></span></div></div>
+            <div class="fl"><label>Y 坐标</label><div class="inp spin"><input value="200"><span class="stp"><i>▲</i><i>▼</i></span></div></div>
+          </div>
+        </div>
+        <div class="grp"><div class="grp-t">尺寸</div>
+          <div class="row">
+            <div class="fl"><label>宽度</label><div class="inp spin"><input value="200"><span class="stp"><i>▲</i><i>▼</i></span></div></div>
+            <div class="fl"><label>高度</label><div class="inp spin"><input value="200"><span class="stp"><i>▲</i><i>▼</i></span></div></div>
+          </div>
+          <div class="ckline"><span class="cbox on"></span>锁定宽高比例（1:1）</div>
+        </div>
+        <div class="grp"><div class="grp-t">旋转</div>
+          <div class="row"><div class="fl"><label>角度</label><div class="inp spin"><input value="-8"><span class="u" style="padding-right:4px">°</span><span class="stp"><i>▲</i><i>▼</i></span></div></div></div>
+          <div class="rotbtns"><div class="ibtn">↺ 左旋 90°</div><div class="ibtn">↻ 右旋 90°</div></div>
+        </div>
+        <div class="grp"><div class="grp-t">输出设置</div>
+          <div class="fl" style="margin-bottom:8px"><label>输出目录</label><div class="path"><span class="p">D:\\印花成品\\2026春\\</span><span class="br">…</span></div></div>
+          <div class="row" style="margin-bottom:0">
+            <div class="fl"><label>格式</label><div class="sel"><span>PNG</span><span class="car">▼</span></div></div>
+            <div class="fl"><label>质量</label><div class="sel"><span>高 (100)</span><span class="car">▼</span></div></div>
+          </div>
+        </div>
+        <div class="tipbox"><span>ⓘ</span><span>当前调整将仅作用于队列中选中的「黑T_短袖 × 花卉_001」，并标记为「已微调」，重跑模板时不被覆盖。</span></div>
+      </div>
+      <div class="actions">
+        <div class="btn pri">⬇ 导出当前单张</div>
+        <div class="brow"><div class="btn sec">💾 应用为模板</div><div class="btn sec">↺ 重置为模板</div></div>
+      </div>
+    </div>
+  </div>
+
+  <!-- BOTTOM QUEUE -->
+  <div class="queue">
+    <div class="q-head">
+      <span class="qt">合成队列</span>
+      <div class="modes">
+        <span class="mode on">多衣服 × 单印花</span>
+        <span class="mode">单衣服 × 多印花</span>
+        <span class="mode">全组合（矩阵）</span>
+      </div>
+      <span class="qmeta">共 60 项 · 完成 12 · 进行 1 · 失败 1 · 待导出 46</span>
+      <div class="qbtns">
+        <div class="qb">↺ 重置全部</div>
+        <div class="qb">⬇ 导出选中</div>
+        <div class="qb pri">⬇⬇ 开始批量导出</div>
+        <div class="qb collapse">▾</div>
+      </div>
+    </div>
+    <div class="q-body">
+      <table class="qtbl">
+        <thead><tr><th class="qidx">#</th><th>衣服</th><th>印花</th><th>来源文件夹</th><th>参数</th><th>状态</th><th>进度 / 输出文件</th></tr></thead>
+        <tbody>
+          <tr><td class="qidx">1</td><td><span class="swatch" style="background:#f0f0ec"></span>白T_圆领</td><td><span class="swatch pr-1" style="display:inline-block"></span>花卉_001</td><td>夏季 / 花卉</td><td><span class="pill tpl">模板</span></td><td><span class="pill done">已完成</span></td><td>白T_圆领_花卉_001.png</td></tr>
+          <tr class="sel"><td class="qidx">2</td><td><span class="swatch" style="background:#2c3037"></span>黑T_短袖</td><td><span class="swatch pr-1" style="display:inline-block"></span>花卉_001</td><td>夏季 / 花卉</td><td><span class="pill adj">已微调</span></td><td><span class="pill wait">待导出</span></td><td>—</td></tr>
+          <tr><td class="qidx">3</td><td><span class="swatch" style="background:#274764"></span>藏青_长袖</td><td><span class="swatch pr-1" style="display:inline-block"></span>花卉_001</td><td>夏季 / 花卉</td><td><span class="pill tpl">模板</span></td><td><span class="pill run">导出中</span></td><td><span class="qprog"><i style="width:64%"></i></span>64%</td></tr>
+          <tr><td class="qidx">4</td><td><span class="swatch" style="background:#6e2a2a"></span>酒红_卫衣</td><td><span class="swatch pr-1" style="display:inline-block"></span>花卉_001</td><td>秋季 / 花卉</td><td><span class="pill tpl">模板</span></td><td><span class="pill err">失败</span></td><td>印花超出画布边界，已跳过</td></tr>
+          <tr><td class="qidx">5</td><td><span class="swatch" style="background:#3a623d"></span>军绿_圆领</td><td><span class="swatch pr-1" style="display:inline-block"></span>花卉_001</td><td>秋季 / 花卉</td><td><span class="pill tpl">模板</span></td><td><span class="pill wait">待导出</span></td><td>—</td></tr>
+          <tr><td class="qidx">6</td><td><span class="swatch" style="background:#bba258"></span>卡其_POLO</td><td><span class="swatch pr-1" style="display:inline-block"></span>花卉_001</td><td>秋季 / 花卉</td><td><span class="pill adj">已微调</span></td><td><span class="pill wait">待导出</span></td><td>—</td></tr>
+          <tr><td class="qidx">7</td><td><span class="swatch" style="background:#2c3037"></span>黑T_宽松</td><td><span class="swatch pr-1" style="display:inline-block"></span>花卉_001</td><td>基础 / 花卉</td><td><span class="pill tpl">模板</span></td><td><span class="pill wait">待导出</span></td><td>—</td></tr>
+        </tbody>
+      </table>
+    </div>
+  </div>
+
+  <!-- STATUS -->
+  <div class="status">
+    <div class="s"><span class="dot g"></span>衣服：<b>白T_圆领.png</b></div><div class="vsep"></div>
+    <div class="s">印花：<b>花卉_001.png</b></div><div class="vsep"></div>
+    <div class="s">模板：<b>标准居中印花 · T恤</b></div>
+    <div class="sp"></div>
+    <div class="s"><span class="dot a"></span>批量导出中 12/60</div><div class="vsep"></div>
+    <div class="s" style="color:#c42b1c"><span class="dot r"></span>1 项失败</div><div class="vsep"></div>
+    <div class="s log">✓ 已导出 白T_圆领_花卉_001.png</div>
+  </div>
+
+</div>
+</body>
+</html>
diff --git a/docs/ui-v1.png b/docs/ui-v1.png
new file mode 100644
index 0000000..7f65c3c
Binary files /dev/null and b/docs/ui-v1.png differ