diff --git a/index.html b/index.html
index 9449544..2bf50df 100644
--- a/index.html
+++ b/index.html
@@ -25,15 +25,15 @@
       }
 
       html {
-        background-color: var(--bg) !important;
+        background: transparent !important;
       }
 
       body {
-        background-color: var(--bg) !important;
+        background: transparent !important;
       }
 
       #root {
-        background-color: var(--bg) !important;
+        background: transparent !important;
         visibility: hidden;
       }
 
diff --git a/src/App.tsx b/src/App.tsx
index 0f8dffe..ff2b8a4 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -66,6 +66,13 @@ const App: React.FC = () => {
               zIndex: -1
             }}
           />
+          {/* 毛玻璃蒙版层 */}
+          <div
+            className="fixed inset-0 backdrop-blur-sm bg-black/80"
+            style={{ 
+              zIndex: -1
+            }}
+          />
 
           <main className="relative flex min-h-screen flex-col gap-2 p-2 md:p-6 md:pt-4 bg-transparent">
             <RefreshToast />
diff --git a/src/index.css b/src/index.css
index ceb55a6..444f1f6 100644
--- a/src/index.css
+++ b/src/index.css
@@ -92,7 +92,8 @@
     @apply scroll-smooth;
   }
   body {
-    @apply bg-background text-foreground;
+    @apply text-foreground;
+    background: transparent !important;
     /* font-feature-settings: "rlig" 1, "calt" 1; */
     font-synthesis-weight: none;
     text-rendering: optimizeLegibility;