Update app.py

app.py

@@ -199,6 +199,7 @@ async def respond(user_input, history, step, language, questions, followup_mode)
 def init():
     return [{"role": "assistant", "content": WELCOME_MESSAGE_EN}], 0, "", [], False
 
+
 with gr.Blocks(css="""
 .send-btn {
   background-color: #25D366 !important;
@@ -211,72 +212,54 @@ with gr.Blocks(css="""
   width: 60px;
   margin-left: 8px;
   cursor: pointer;
-  flex-shrink: 0 !important;
 }
-
 #chatbox .avatar-container {
-  width: 54px !important;
-  height: 54px !important;
-  min-width: 54px !important;
-  min-height: 54px !important;
-  background-size: cover !important;
-  background-position: center center !important;
-  border-radius: 50% !important;
-  padding: 0 !important;
-  margin: 0 !important;
-  border: none !important;
-  background-color: transparent !important;
-  box-shadow: none !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;
+    padding: 0 !important;
+    margin: 0 !important;
+    border: none !important;
+    box-shadow: none !important;
+    background-color: transparent !important;
 }
-
+#chatbox .message.user { background-color: #DCF8C6 !important; }
 #chatbox .message {
   display: inline-block !important;
   font-size: 16px !important;
-  line-height: 1.4em !important;
-  min-width: 5ch !important;
-  max-width: 85% !important;         /* ✅ 适配桌面和移动宽度 */
-  padding: 6px 10px !important;
-  border-radius: 10px !important;
+  line-height: 1.3em !important;
+  min-width: 6ch !important;
+  max-width: 96% !important;
+  padding: 2px 3px !important;
+  border-radius: 8px !important;
   word-break: break-word !important;
-  white-space: pre-wrap !important;
-  overflow-wrap: anywhere !important;  /* ✅ 关键修复：允许单词智能断行 */
+  word-wrap: 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.user {
-  background-color: #DCF8C6 !important;
-}
-#chatbox .message.assistant {
-  background-color: #FFFFFF !important;
+#chatbox .message.assistant { background-color: #ffffff !important; }
+footer { display: none !important; }
+.svelte-1ipelgc { display: none !important; }
+.icon-button-wrapper {
+  display: none !important;
 }
-
-/* ✅ 移除 Gradio 默认残留区域 */
-footer,
-.svelte-1ipelgc,
-.icon-button-wrapper,
 label.svelte-1to105q {
   display: none !important;
 }
-
-/* ✅ 移动端优化 */
-@media screen and (max-width: 768px) {
-  #chatbox .message {
-    font-size: 15px !important;
-    max-width: 94vw !important;
-  }
-}
-
-/* ✅ 防止全局横向滚动 */
-html, body {
-  overflow-x: hidden !important;
-}
-
 """) as demo:
     gr.HTML("""
     <script>