docs(ai-outfit): relayout AI panel mockup (3-col settings, model on right)

- 生成设置 -> 3 cols x 2 rows; AI 模型 dropdown moved under it on the right.
- 数据源/输出 become inline label+path rows; bigger 通用话术 + 最终提示词预览
  (preview now shows the appended output requirements). Right column widened
  to ~400 (left ~360). Update §10 and re-render ui-ai-outfit.png.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

docs/11-ai-outfit.md

@@ -145,9 +145,9 @@ Excel 行 → `OutfitTask` 列表的转换由 `excel_service` 完成；核心只
 
 三栏布局：
 
-- **左栏（数据源 + 话术创作）**：选择 Excel 文件、输出目录（记住上次，存 `app_config.json`）；数据源概览（共 N 行 / 完成 / 待处理 / 失败）；AI 模型下拉（来自 AI 模型配置）；通用话术编辑 +「保存话术」+「插入标题」；下方常驻**最终提示词预览**（内嵌、实时、带样本行下拉，见 §7）。
+- **左栏（数据源 + 话术创作，~360px）**：`Excel` / `输出` 各为**行内一行**（标签 + 路径 + 浏览，省纵向空间）；数据源概览（共 N 行 / 完成 / 待处理 / 失败）；**加大的**通用话术编辑 +「保存话术」+「插入标题」；下方常驻**加大的最终提示词预览**（内嵌、实时、带样本行下拉，含 §7.1 自动附加的输出要求）。AI 模型下拉不在此（见右栏）。
 - **中栏（结果 + 明细）**：顶部「最近结果」缩略图条——**只展示已完成的人物效果图**，新图自动加到最左、首图标「最新」，单击看大图、右键开所在文件夹；下方「处理明细」表（行 / 标题 / 货号 / 衣服图 / 状态 / 结果或原因），按 Excel 行顺序，状态用 完成 / 失败 / 生成中 / 待处理 / 跳过 徽章。
-- **右栏（设置 + 运行）**：生成设置（重试失败行、并发数、新请求间隔、单任务冷却、失败重试、分辨率、JPG 质量；窄栏 2 列）；本次进度 + 统计（完成 / 失败 / 待处理）；开始生成 / 停止生成；导出失败清单 / 打开输出目录；实时日志（含 §8 心跳行）。
+- **右栏（设置 + 运行，~400px）**：生成设置（重试失败行 + 并发数 / 新请求间隔 / 单任务冷却 / 失败重试 / 分辨率 / JPG 质量，**3 列 × 2 行**）；其下 **AI 模型下拉**（来自 AI 模型配置）；本次进度 + 统计（完成 / 失败 / 待处理）；开始生成 / 停止生成；导出失败清单 / 打开输出目录；实时日志（含 §8 心跳行）。
 
 > **设计取舍：不做"实时单图大预览"。** 这是"开了走人、回头抽查"的批量工具；单图实时预览在并发时会产生"该显示哪一行"的歧义。改为「最近结果缩略图条」——只展示已落地成品，既保留"早发现话术/模型不对、及时停掉改话术"的价值，又因只显示成品而消除并发歧义。
 

docs/ui-ai-outfit.html

@@ -42,7 +42,7 @@
   .tab:not(.on):hover{background:#ececec}
 
   /* ---- BODY GRID ---- */
-  .body{display:grid;grid-template-columns:426px 1fr 344px;min-height:0}
+  .body{display:grid;grid-template-columns:360px 1fr 400px;min-height:0}
 
   /* ---- LEFT : data source + settings ---- */
   .left{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0}
@@ -73,7 +73,7 @@
   .chipmeta.err{background:#fbe4e2;color:#a3271c}
 
   /* prompt editor */
-  .ta{width:100%;height:128px;overflow:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:8px 9px;font:12px/1.7 var(--font);color:var(--txt)}
+  .ta{width:100%;height:230px;overflow:auto;border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:8px 9px;font:12px/1.7 var(--font);color:var(--txt)}
   .ph{color:var(--info);font-weight:600}
   .promptbar{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
   .pchip{display:flex;align-items:center;gap:5px;height:26px;padding:0 9px;border:1px solid var(--line);border-radius:13px;background:#fff;color:var(--txt-2);font-size:11px}
@@ -81,15 +81,19 @@
   .pchip:hover{background:#f3f8fd;border-color:var(--accent-soft)}
   .pchip.act{margin-left:auto;border-color:var(--accent-soft);color:var(--accent)}
 
-  /* compact settings grid (now in the right run column) */
+  /* compact settings grid (right run column, 3 per row) */
-  .sgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px 10px}
+  .sgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px 10px}
   .sgrid .fl{margin:0}
 
+  /* inline labelled rows (数据源 / 输出): label + path on one line */
+  .frow{display:flex;align-items:center;gap:8px;margin-bottom:8px}
+  .frow .flbl{flex:none;width:40px;color:var(--txt-2);font-size:12px}
+
   /* inline final-prompt preview (replaces the dialog) */
   .prevrow{display:flex;align-items:center;gap:8px;margin-bottom:8px}
   .prevrow .prevlbl{font-size:11px;color:var(--txt-2);flex:none}
   .preview{border:1px solid var(--line);border-radius:var(--r);background:#f7f9fc;
-    padding:8px 9px;font:12px/1.7 var(--font);color:var(--txt);min-height:150px}
+    padding:8px 9px;font:12px/1.7 var(--font);color:var(--txt);min-height:300px}
   .preview b{color:var(--accent);font-weight:600;background:#eaf3fc;border-radius:2px;padding:0 2px}
 
   /* ---- CENTER : the transformation thesis + batch table ---- */
@@ -214,26 +218,18 @@
     <!-- LEFT : data source + settings -->
     <div class="left">
       <div class="lscroll">
-        <div class="grp"><div class="grp-t">数据源（Excel）</div>
+        <div class="frow"><span class="flbl">Excel</span>
-          <div class="fl" style="margin-bottom:8px"><label>Excel 文件</label>
           <div class="path"><span class="p">D:\\电商\\2026春\\商品表.xlsx</span><span class="br">…</span></div>
         </div>
-          <div class="xlmeta">
+        <div class="xlmeta" style="margin:-2px 0 10px">
           <span class="chipmeta">共 60 行</span>
           <span class="chipmeta done">已完成 12</span>
           <span class="chipmeta wait">待处理 45</span>
           <span class="chipmeta err">失败 3</span>
         </div>
-        </div>
+        <div class="frow"><span class="flbl">输出</span>
-
-        <div class="grp"><div class="grp-t">输出</div>
-          <div class="fl" style="margin-bottom:8px"><label>输出目录</label>
           <div class="path"><span class="p">D:\\CMBot\\合并后的图片</span><span class="br">…</span></div>
         </div>
-          <div class="fl"><label>AI 模型</label>
-            <div class="sel"><span>Nano Banana 2 · 中转</span><span class="car">▼</span></div>
-          </div>
-        </div>
 
         <div class="grp"><div class="grp-t">通用话术</div>
           <div class="ta">为商品「<span class="ph">{title}</span>」生成人物上身实穿效果图：真人模特正面穿着这件衣服，完整保留款式、版型、颜色与印花图案，自然光、纯色棚拍背景，电商主图风格，不加文字与促销标签。</div>
@@ -248,7 +244,13 @@
             <span class="prevlbl">样本行</span>
             <div class="sel" style="flex:1"><span>第 13 行 · TY030 · 碎花连衣裙夏季新款</span><span class="car">▼</span></div>
           </div>
-          <div class="preview">为商品「<b>碎花连衣裙夏季新款</b>」生成人物上身实穿效果图：真人模特正面穿着这件衣服，完整保留款式、版型、颜色与印花图案，自然光、纯色棚拍背景，电商主图风格，不加文字与促销标签。</div>
+          <div class="preview">为商品「<b>碎花连衣裙夏季新款</b>」生成人物上身实穿效果图：真人模特正面穿着这件衣服，完整保留款式、版型、颜色与印花图案，自然光、纯色棚拍背景，电商主图风格，不加文字与促销标签。
+
+批量生成输出要求：
+- 参考解析度：1K
+- 固定 1:1 正方形主图
+- 必须结合商品标题与参考商品图片
+- 服装本身、版型、颜色与图案不可跑版</div>
         </div>
       </div>
     </div>
@@ -345,6 +347,9 @@
           <div class="fl"><label>分辨率</label><div class="sel"><span>1K</span><span class="car">▼</span></div></div>
           <div class="fl"><label>JPG 质量</label><div class="sel"><span>均衡 85</span><span class="car">▼</span></div></div>
         </div>
+        <div class="fl" style="margin-top:10px"><label>AI 模型</label>
+          <div class="sel"><span>Nano Banana 2 · 中转</span><span class="car">▼</span></div>
+        </div>
       </div>
       <div class="runtop">
         <div class="rt">本次进度</div>