Update app.py

app.py

@@ -212,10 +212,10 @@ with gr.Blocks(css="""
   cursor: pointer;
 }
 #chatbox .avatar-container {
-    width: 64px !important;
-    height: 64px !important;
-    min-width: 64px !important;
-    min-height: 64px !important;
+    width: 54px !important;
+    height: 54px !important;
+    min-width: 54px !important;
+    min-height: 54px !important;
     background-size: 100% 100% !important;
     background-position: center center !important;
     border-radius: 50% !important;
@@ -226,6 +226,27 @@ with gr.Blocks(css="""
     background-color: transparent !important;
 }
 #chatbox .message.user { background-color: #DCF8C6 !important; }
+#chatbox .message {
+  display: inline-block !important;
+  font-size: 16px !important;
+  line-height: 1.3em !important;
+  min-width: 7ch !important;
+  max-width: 60ch !important;
+  padding: 2px 3px !important;
+  border-radius: 8px !important;
+  word-break: break-word !important;
+  white-space: normal !important;
+}
+@media screen and (max-width: 768px) {
+  #chatbox .message.user {
+    max-width: 90vw !important;
+  }
+}
+#chatbox .message.user {
+  background-color: #DCF8C6 !important;
+  min-width: 60px !important;         /* ✅ 至少能装下一个短单词 */
+  max-width: fit-content !important;  /* ✅ 自动根据内容长度调整宽度 */
+}
 #chatbox .message.assistant { background-color: #ffffff !important; }
 footer { display: none !important; }
 .svelte-1ipelgc { display: none !important; }
@@ -253,6 +274,7 @@ label.svelte-1to105q {
     </script>
     """)
 
+
     chatbot = gr.Chatbot(
         elem_id="chatbox",
         label="",