Update app.py

app.py

@@ -196,10 +196,14 @@ html_template = '''
     }
     {background_css}
     .gr-chatbot {
-        background: rgba(255, 255, 255, 0.5) !important;
-        border-radius: 16px;
-        padding: 10px;
+    background: rgba(255, 255, 255, 0.3) !important; /* 更轻的透明白 */
+    border-radius: 16px;
+    padding: 10px;
+    backdrop-filter: blur(12px); /* 毛玻璃核心效果 */
+    -webkit-backdrop-filter: blur(12px); /* 兼容 Safari */
+    border: 1px solid rgba(255, 255, 255, 0.4); /* 边框更精致 */
     }
+
     .gr-textbox textarea {
         font-family: monospace;
         font-size: 1.1em;
@@ -293,33 +297,38 @@ html_template = '''
     height: 80px;
     background-size: contain;
     background-repeat: no-repeat;
-    z-index: 9999;
+    z-index: 10000;  /* 使气球位于对话框之上 */
     animation: floatUp 12s linear infinite;
     }
 
     #balloon1 { 
     background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/balloon1.png"); 
     left: 10%; 
+    top: 0;  /* 确保气球从页面顶部开始 */
     animation-delay: 0s; 
     }
     #balloon2 { 
-    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/balloon2.png"); 
+    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/ballon2.png"); 
     left: 30%; 
+    top: 0;  /* 确保气球从页面顶部开始 */
     animation-delay: 2s; 
     }
     #balloon3 { 
-    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/balloon3.png"); 
+    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/ballon3.png"); 
     left: 50%; 
+    top: 0;  /* 确保气球从页面顶部开始 */
     animation-delay: 4s; 
     }
     #balloon4 { 
-    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/balloon4.png"); 
+    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/ballon4.png"); 
     left: 70%; 
+    top: 0;  /* 确保气球从页面顶部开始 */
     animation-delay: 6s; 
     }
     #balloon5 { 
-    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/balloon5.png"); 
+    background-image: url("https://huggingface.co/spaces/Ronaldo1111/Sophia/resolve/main/ballon5.png"); 
     left: 90%; 
+    top: 0;  /* 确保气球从页面顶部开始 */
     animation-delay: 8s; 
     }
 
@@ -328,6 +337,7 @@ html_template = '''
     100% { transform: translateY(-120vh); }
     }
 
+
     #music-toggle, #next-track {
         position: fixed;
         padding: 8px 12px;