fix: 调整聊天窗口样式 - 名字更浅更小，AGENT气泡白底，修正AGENT用户布局位置

src/pages/chat/components/ChatBody.tsx

@@ -94,9 +94,9 @@ export default function ChatBody(props: {
                             marginBottom: 6
                           }}>
                             <span style={{
-                              fontSize: 13,
+                              fontSize: 12,
-                              fontWeight: 500,
+                              fontWeight: 400,
-                              color: 'var(--color-text)'
+                              color: 'var(--color-text-secondary)'
                             }}>
                               {streamingAgent.name}
                             </span>

src/pages/chat/components/messages/MessageItem.tsx

@@ -50,9 +50,39 @@ export default function MessageItem(props: {
         transition: 'background 0.4s, padding 0.4s'
       }}
     >
-      {message.role === 'assistant' ? (
+      {message.role === 'user' ? (
+        <div style={{ display: 'flex', gap: 12, alignItems: 'flex-start', justifyContent: 'flex-end' }}>
+          {/* 用户: 头像在右侧，内容在左侧（靠右对齐） */}
+          <div style={{ flex: 1, minWidth: 0, maxWidth: '78%', display: 'flex', flexDirection: 'column', alignItems: 'flex-end' }}>
+            <div style={{
+              display: 'flex',
+              alignItems: 'center',
+              gap: 8,
+              marginBottom: 6
+            }}>
+              <span style={{
+                fontSize: 12,
+                fontWeight: 400,
+                color: 'var(--color-text-secondary)'
+              }}>
+                我
+              </span>
+            </div>
+            <div className={`bubble ${message.role}`}>
+              {message.content.includes('![image](') ? (
+                <Markdown>{message.content}</Markdown>
+              ) : (
+                <span dangerouslySetInnerHTML={{
+                  __html: message.content.replace(/@([^\s]+)/g, '<span class="mention">@$1</span>')
+                }} />
+              )}
+            </div>
+          </div>
+          <Avatar style={{ flexShrink: 0, marginTop: 2, backgroundColor: '#1890ff' }} size={36}>我</Avatar>
+        </div>
+      ) : (
         <div style={{ display: 'flex', gap: 12, alignItems: 'flex-start' }}>
-          {/* AGENT: 头像在左侧 */}
+          {/* AGENT: 头像在左侧，内容在右侧（靠左对齐） */}
           {hasAnswerAgent && (
             <Avatar src={answerAgent!.avatar} size={36} style={{ flexShrink: 0, marginTop: 2 }} />
           )}
@@ -65,9 +95,9 @@ export default function MessageItem(props: {
                 marginBottom: 6
               }}>
                 <span style={{
-                  fontSize: 13,
+                  fontSize: 12,
-                  fontWeight: 500,
+                  fontWeight: 400,
-                  color: 'var(--color-text)'
+                  color: 'var(--color-text-secondary)'
                 }}>
                   {answerAgent!.name}
                 </span>
@@ -121,36 +151,6 @@ export default function MessageItem(props: {
             )}
           </div>
         </div>
-      ) : (
-        <div style={{ display: 'flex', gap: 12, alignItems: 'flex-start', justifyContent: 'flex-end' }}>
-          <div style={{ flex: 1, minWidth: 0, maxWidth: '78%', display: 'flex', flexDirection: 'column', alignItems: 'flex-end' }}>
-            <div style={{
-              display: 'flex',
-              alignItems: 'center',
-              gap: 8,
-              marginBottom: 6
-            }}>
-              <span style={{
-                fontSize: 13,
-                fontWeight: 500,
-                color: 'var(--color-text)'
-              }}>
-                我
-              </span>
-            </div>
-            <div className={`bubble ${message.role}`}>
-              {message.content.includes('![image](') ? (
-                <Markdown>{message.content}</Markdown>
-              ) : (
-                <span dangerouslySetInnerHTML={{
-                  __html: message.content.replace(/@([^\s]+)/g, '<span class="mention">@$1</span>')
-                }} />
-              )}
-            </div>
-          </div>
-          {/* 用户: 头像在右侧 */}
-          <Avatar style={{ flexShrink: 0, marginTop: 2, backgroundColor: '#1890ff' }} size={36}>我</Avatar>
-        </div>
       )}
     </div>
   );

src/styles.css

@@ -645,7 +645,7 @@ body {
 }
 
 .bubble.assistant {
-  background: var(--color-surface);
+  background: #ffffff;
   color: var(--color-text);
   border: 1px solid var(--color-border);
   border-bottom-left-radius: 5px;