聊天框区域设为半透明

css/chat.css

@@ -3,11 +3,13 @@
     bottom: 50px;
     left: 0;
     width: 100%;
-    background: #fff;
+    background: rgba(255, 255, 255, 0.05); /* 几乎全透明 */
-    box-shadow: 0 -2px 5px #fff;
+    backdrop-filter: blur(4px);            /* 模糊背景 */
+    -webkit-backdrop-filter: blur(4px);
     display: flex;
     flex-direction: column;
     align-items: center;
+    z-index: 5;
 }
 
 .chat-box {
@@ -15,7 +17,9 @@
     min-height: 20px;
     max-height: 50vh;
     overflow-y: auto;
-    background: #f5f5f5;
+    background: rgba(200, 200, 200, 0.1);   /* 淡灰半透明 */
+    backdrop-filter: blur(8px);            /* 背景模糊 */
+    -webkit-backdrop-filter: blur(8px);    /* Safari 兼容 */
     margin-bottom: 10px;
     padding: 10px;
     border-radius: 8px;