优化故事版生成

core/frontend/src/routes/pipeline.tsx

@@ -3157,10 +3157,13 @@ export function PipelinePage(props: {
                     </div>
                     <div className="chat-attach-row" id="chat-attach-row" hidden={chatAttachments.length === 0}>
                       {chatAttachments.map((att, index) => (
-                        <span className="chip" key={`${att.name}-${index}`} style={{ marginRight: 6 }}>
-                          <svg width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" style={{ marginRight: 4 }}><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" /><path d="M14 2v6h6" /></svg>
-                          {att.name} · {att.chars} 字
-                          <button type="button" aria-label="移除附件" style={{ marginLeft: 4, background: "none", border: 0, cursor: "pointer", color: "inherit" }} onClick={() => setChatAttachments((list) => list.filter((_, i) => i !== index))}>×</button>
+                        <span className="chat-file" key={`${att.name}-${index}`}>
+                          <svg className="chat-file-ico" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1.6" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" /><path d="M14 2v6h6" /></svg>
+                          <span className="chat-file-meta">
+                            <span className="chat-file-name" title={att.name}>{att.name}</span>
+                            <span className="chat-file-sub">{att.chars} 字</span>
+                          </span>
+                          <button className="chat-file-x" type="button" aria-label="移除附件" onClick={() => setChatAttachments((list) => list.filter((_, i) => i !== index))}>×</button>
                         </span>
                       ))}
                     </div>