Unify glass theme backdrop filters

src/styles/themes/glass.scss

@@ -37,9 +37,9 @@ html[data-theme='glass'] {
     0 0 0 2px rgba(var(--v-theme-primary), 16%), inset 0 1px 0 rgba(255, 255, 255, 24%),
     inset 0 -1px 0 rgba(2, 6, 16, 16%);
   --glass-surface-backdrop-filter: none;
-  --glass-raised-backdrop-filter: blur(var(--glass-blur-raised)) saturate(var(--glass-saturate));
+  --glass-raised-backdrop-filter: none;
   --glass-control-backdrop-filter: none;
-  --glass-control-prominent-backdrop-filter: blur(20px) saturate(var(--glass-saturate));
+  --glass-control-prominent-backdrop-filter: none;
   --glass-control-icon-color: rgba(242, 245, 250, 70%);
   --glass-control-placeholder-color: rgba(242, 245, 250, 54%);
   --glass-control-shortcut-background: rgba(255, 255, 255, 8%);
@@ -78,7 +78,7 @@ html[data-theme='glass'] {
   --app-card-light-border: 1px solid var(--glass-border);
   --app-overlay-border: 1px solid var(--glass-border);
   --app-grouped-list-background: var(--glass-surface);
-  --app-grouped-list-backdrop-filter: none;
+  --app-grouped-list-backdrop-filter: var(--glass-surface-backdrop-filter);
   --app-grouped-list-border: 1px solid var(--glass-border);
   --app-grouped-list-separator-color: rgba(255, 255, 255, 10%);
   --app-grouped-list-header-color: rgba(242, 245, 250, 68%);
@@ -150,6 +150,8 @@ html[data-theme='glass'] {
     --glass-control-prominent-focus-shadow:
       0 0 0 2px rgba(var(--v-theme-primary), 17%), inset 0 1px 0 rgba(255, 255, 255, 34%),
       inset 0 -1px 0 rgba(2, 6, 16, 18%);
+    --glass-surface-backdrop-filter: blur(var(--glass-blur-surface)) saturate(var(--glass-saturate));
+    --glass-raised-backdrop-filter: blur(var(--glass-blur-raised)) saturate(var(--glass-saturate));
     --glass-control-prominent-backdrop-filter: blur(24px) saturate(150%);
     --glass-blur-surface: 28px;
     --glass-saturate: 150%;
@@ -377,8 +379,8 @@ html[data-theme='glass'] {
   .layout-wrapper.window-scrolled.layout-navbar-fixed .layout-navbar,
   .layout-wrapper.layout-horizontal-nav-active.layout-horizontal-nav-scrolled.layout-navbar-fixed .layout-navbar {
     border-color: var(--glass-border) !important;
-    -webkit-backdrop-filter: blur(var(--glass-blur-raised)) saturate(var(--glass-saturate)) !important;
+    -webkit-backdrop-filter: var(--glass-raised-backdrop-filter) !important;
-    backdrop-filter: blur(var(--glass-blur-raised)) saturate(var(--glass-saturate)) !important;
+    backdrop-filter: var(--glass-raised-backdrop-filter) !important;
     background-color: var(--glass-surface-raised) !important;
     background-image: var(--glass-sheen) !important;
     box-shadow: var(--glass-navbar-shadow) !important;
@@ -473,8 +475,8 @@ html[data-theme='glass'] {
   }
 
   .v-overlay__scrim {
-    -webkit-backdrop-filter: blur(12px) saturate(120%);
+    -webkit-backdrop-filter: var(--glass-surface-backdrop-filter);
-    backdrop-filter: blur(12px) saturate(120%);
+    backdrop-filter: var(--glass-surface-backdrop-filter);
     background: rgba(3, 7, 18, 48%);
   }
 
@@ -486,8 +488,8 @@ html[data-theme='glass'] {
     border-radius: var(--app-overlay-radius);
 
     > :where(.v-card, .v-sheet, .v-list) {
-      -webkit-backdrop-filter: var(--glass-raised-backdrop-filter);
+      -webkit-backdrop-filter: var(--glass-raised-backdrop-filter) !important;
-      backdrop-filter: var(--glass-raised-backdrop-filter);
+      backdrop-filter: var(--glass-raised-backdrop-filter) !important;
       background-color: var(--glass-surface-raised) !important;
       background-image: var(--glass-sheen) !important;
       box-shadow: var(--glass-shadow-raised) !important;
@@ -497,8 +499,8 @@ html[data-theme='glass'] {
   .v-tooltip > .v-overlay__content,
   .v-snackbar__wrapper {
     border: 1px solid var(--glass-border);
-    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
+    -webkit-backdrop-filter: var(--glass-raised-backdrop-filter);
-    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
+    backdrop-filter: var(--glass-raised-backdrop-filter);
     background: rgba(11, 19, 34, 76%) !important;
     box-shadow: var(--glass-shadow);
   }
@@ -629,24 +631,30 @@ html[data-theme='glass'] {
     --app-card-stripe-opacity: 0.12;
     --app-card-surface-opacity: 0.08;
 
-    -webkit-backdrop-filter: none;
+    -webkit-backdrop-filter: var(--glass-surface-backdrop-filter);
-    backdrop-filter: none;
+    backdrop-filter: var(--glass-surface-backdrop-filter);
   }
 
-  // 移动端文件整理和日历使用自定义容器，需要显式接入玻璃表面材质。
+  // 文件整理、日历和缓存使用自定义容器，需要同时覆盖桌面与移动端表面。
   .transfer-history-mobile-page {
     --transfer-history-mobile-search-bg: var(--glass-surface-soft);
     --transfer-history-mobile-muted-bg: var(--glass-surface-soft);
     --transfer-history-mobile-border: var(--glass-border);
-    --transfer-history-mobile-surface-blur: none;
+    --transfer-history-mobile-surface-blur: var(--glass-surface-backdrop-filter);
   }
 
   .transfer-history-mobile-record,
+  .calendar-event-card,
   .mobile-calendar-filter-card,
-  .mobile-calendar-event-card {
+  .mobile-calendar-event-card,
+  .cache-desktop-stat,
+  .cache-mobile-stat,
+  .cache-mobile-card,
+  .cache-panel-stat,
+  .recognition-cache-mobile-item {
     border: 1px solid var(--glass-border);
-    -webkit-backdrop-filter: none;
+    -webkit-backdrop-filter: var(--glass-surface-backdrop-filter);
-    backdrop-filter: none;
+    backdrop-filter: var(--glass-surface-backdrop-filter);
     background: var(--glass-surface);
   }
 
@@ -657,12 +665,12 @@ html[data-theme='glass'] {
     --logging-record-bg-even: rgba(255, 255, 255, 6%);
     --logging-record-bg-odd: rgba(255, 255, 255, 3%);
     --logging-shadow: inset 0 1px 0 rgba(255, 255, 255, 10%);
-    --logging-shell-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate));
+    --logging-shell-backdrop-filter: var(--glass-surface-backdrop-filter);
     --logging-shell-background: var(--glass-surface-soft);
   }
 
   .mobile-scheduler-view {
-    --mobile-scheduler-card-backdrop-filter: none;
+    --mobile-scheduler-card-backdrop-filter: var(--glass-surface-backdrop-filter);
     --mobile-scheduler-card-background: var(--glass-surface);
     --mobile-scheduler-card-border: 1px solid var(--glass-border);
     --mobile-scheduler-card-shadow: var(--glass-shadow);
@@ -671,7 +679,14 @@ html[data-theme='glass'] {
   .mobile-subscribe-calendar {
     --mobile-calendar-control-bg: var(--glass-surface-soft);
     --mobile-calendar-placeholder-bg: var(--glass-surface-soft);
-    --mobile-calendar-surface-blur: none;
+    --mobile-calendar-surface-blur: var(--glass-surface-backdrop-filter);
+  }
+
+  // 磨砂卡片不参与仪表板整体透明度入场，避免合成层切换造成先透明后模糊的闪变。
+  &[data-glass-appearance='frosted'] .dashboard-grid {
+    opacity: 1;
+    transform: none;
+    transition: none;
   }
 
   // 用户权限编辑器由普通容器构成，通过主题变量接入玻璃表面材质。
@@ -689,8 +704,8 @@ html[data-theme='glass'] {
   // 智能助手折叠区使用均匀的玻璃描边，替换普通主题渐变产生的顶部黑边。
   .ai-agent-settings-card {
     border: 1px solid rgba(255, 255, 255, 10%) !important;
-    -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate)) !important;
+    -webkit-backdrop-filter: var(--glass-surface-backdrop-filter) !important;
-    backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-saturate)) !important;
+    backdrop-filter: var(--glass-surface-backdrop-filter) !important;
     background: var(--glass-surface-soft) !important;
     box-shadow: none !important;
   }
@@ -773,11 +788,6 @@ html[data-theme='glass'] {
       background: transparent !important;
       box-shadow: none !important;
     }
-
-    // 设置页卡片与视口边缘保持阴影缓冲，避免页面横向裁切边界截断投影。
-    .settings-content-window {
-      padding-inline: 24px;
-    }
   }
 
   @supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
@@ -855,13 +865,13 @@ html:is([data-glass-quality='balanced'], [data-glass-quality='high'])[data-glass
   body[data-theme='glass'] {
   .layout-vertical-nav::before,
   .layout-navbar {
-    -webkit-backdrop-filter: blur(10px) saturate(140%) !important;
+    -webkit-backdrop-filter: var(--glass-surface-backdrop-filter) !important;
-    backdrop-filter: blur(10px) saturate(140%) !important;
+    backdrop-filter: var(--glass-surface-backdrop-filter) !important;
   }
 
   .v-overlay__content > :where(.v-card, .v-sheet, .v-list) {
-    -webkit-backdrop-filter: blur(12px) saturate(140%) !important;
+    -webkit-backdrop-filter: var(--glass-surface-backdrop-filter) !important;
-    backdrop-filter: blur(12px) saturate(140%) !important;
+    backdrop-filter: var(--glass-surface-backdrop-filter) !important;
   }
 
   .dashboard-grid-item-content > .dashboard-grid-auto-size > .dashboard-grid-content-measure > .v-card,
@@ -901,8 +911,8 @@ html[data-theme='glass'] body[data-theme='glass'] {
   }
 
   .login-card__glass {
-    -webkit-backdrop-filter: blur(14px) saturate(162%) contrast(108%) !important;
+    -webkit-backdrop-filter: var(--glass-surface-backdrop-filter) !important;
-    backdrop-filter: blur(14px) saturate(162%) contrast(108%) !important;
+    backdrop-filter: var(--glass-surface-backdrop-filter) !important;
     background:
       radial-gradient(
         220px 190px at var(--login-card-light-x) var(--login-card-light-y),
@@ -944,8 +954,8 @@ html[data-theme='glass'] body[data-theme='glass'] {
   .native-login-field {
     border-color: rgba(255, 255, 255, 0.15);
     background: rgba(7, 16, 28, 0.2);
-    -webkit-backdrop-filter: blur(10px) saturate(132%);
+    -webkit-backdrop-filter: var(--glass-control-backdrop-filter);
-    backdrop-filter: blur(10px) saturate(132%);
+    backdrop-filter: var(--glass-control-backdrop-filter);
   }
 }