fix: 优化界面

app/templates/index.html

@@ -10,27 +10,22 @@
     <header class="topbar">
       <div class="brand">
         <h1>{{ app_name }}</h1>
-        <p class="muted">粘贴原文 → 洗成约 <strong>5 段、500 字内</strong> 的短文（无小标题）→ 右侧预览 → 满意后发布。</p>
-        <p id="backendConfig" class="backend-config muted small" aria-live="polite"></p>
+        <p class="muted">从原文到公众号草稿，一页完成改写、封面和发布。</p>
       </div>
-      <div class="badge">Beta</div>
+      <div class="badge">Studio</div>
     </header>
 
     <main class="layout">
       <section class="panel input-panel">
-        <h2>输入与改写策略</h2>
-        <ol class="flow-hint muted">
-          <li>粘贴原文并设置语气/读者</li>
-          <li>点击改写 → 右侧为短标题、摘要与<strong>五段正文</strong>（段落间空一行）</li>
-          <li>看「运行追踪」：<strong>模式为 AI</strong> 且模型名正确，即千问/接口已生效</li>
-          <li>人工改好后 →「发布到公众号草稿箱」（需配置 WECHAT_*）</li>
-        </ol>
+        <div class="panel-head">
+          <h2>内容输入</h2>
+        </div>
 
         <div class="field-head">
-          <label>原始内容</label>
+          <label>内容</label>
           <span id="sourceCount" class="meta">0 字</span>
         </div>
-        <textarea id="sourceText" rows="14" placeholder="粘贴原文（长帖、线程、摘录均可），洗稿会围绕原文主题展开…"></textarea>
+        <textarea id="sourceText" rows="9" placeholder="粘贴原文（长帖、线程、摘录均可），洗稿会围绕原文主题展开…"></textarea>
 
         <div class="grid2">
           <div>
@@ -62,8 +57,9 @@
       </section>
 
       <section class="panel output-panel">
-        <h2>发布内容</h2>
-        <p class="muted small">下方「运行追踪」会显示本次请求 ID、耗时、质检项与是否降级，便于与容器日志对照。</p>
+        <div class="panel-head">
+          <h2>发布内容</h2>
+        </div>
 
         <label>标题</label>
         <input id="title" type="text" />
@@ -72,12 +68,12 @@
           <label>摘要</label>
           <span id="summaryCount" class="meta">0 字</span>
         </div>
-        <textarea id="summary" rows="3"></textarea>
+        <textarea id="summary" rows="2"></textarea>
 
         <label>公众号封面（可选上传）</label>
         <div class="cover-tools">
           <input id="coverFile" type="file" accept="image/png,image/jpeg,image/jpg,image/webp" />
-          <button id="coverUploadBtn" type="button">上传封面并绑定</button>
+          <button id="coverUploadBtn" class="subtle-btn" type="button">上传封面并绑定</button>
         </div>
         <input id="thumbMediaId" type="text" placeholder="thumb_media_id（上传后自动填充，也可手动粘贴）" />
         <p id="coverHint" class="muted small">未上传时将使用后端默认封面策略。</p>
@@ -87,24 +83,19 @@
           <span id="bodyCount" class="meta">0 字</span>
         </div>
         <div class="body-split">
-          <textarea id="body" rows="10" placeholder="五段之间空一行；无需 # 标题"></textarea>
+          <textarea id="body" rows="7" placeholder="五段之间空一行；无需 # 标题"></textarea>
           <div class="preview-panel">
             <div class="field-head">
               <label>排版预览</label>
-              <span class="meta">与公众号 HTML 渲染接近</span>
+              <span class="meta">实时同步</span>
             </div>
             <div id="bodyPreview" class="markdown-preview"></div>
           </div>
         </div>
 
-        <details id="traceWrap" class="trace-wrap">
-          <summary>运行追踪 <span id="traceBadge" class="trace-badge"></span></summary>
-          <pre id="traceJson" class="trace-json"></pre>
-        </details>
-
         <div class="actions">
-          <button id="wechatBtn">发布到公众号草稿箱</button>
-          <button id="imBtn">发送到 IM</button>
+          <button id="wechatBtn" class="primary">发布到公众号草稿箱</button>
+          <button id="imBtn" class="secondary">发送到 IM</button>
         </div>
       </section>
     </main>