fix(ui): 首屏背景提前设置 + 页面淡入过渡

- App 首帧前同步主题窗口背景，减少深浅色下系统底色闪烁
- 页面根容器增加 0.24s 淡入动画，Tab 切换/进入更平滑

src/app.scss

@@ -10,12 +10,19 @@
   min-height: 100vh;
   background-color: var(--bg-page, #ffffff);
   box-sizing: border-box;
+  animation: page-fade-in 0.24s ease both;
 }
 
 .theme-dark {
   min-height: 100vh;
   background-color: var(--bg-page, #191919);
   box-sizing: border-box;
+  animation: page-fade-in 0.24s ease both;
+}
+
+@keyframes page-fade-in {
+  from { opacity: 0; }
+  to { opacity: 1; }
 }
 
 /* 变量定义 */

src/app.tsx

@@ -7,6 +7,11 @@ import { refreshSession, ensureSessionFresh } from './utils/session'
 import './app.scss'
 
 class App extends Component<PropsWithChildren> {
+  componentWillMount() {
+    // 首帧前先把原生窗口背景切成当前主题，避免深色/浅色下先闪系统默认色
+    applyPageBackground(resolveTheme(getTheme()))
+  }
+
   componentDidMount() {
     // 启动最早时机同步页面背景，避免自定义导航区在深色模式下闪白
     applyPageBackground(resolveTheme(getTheme()))

tools/liquid-glass.test.mjs

@@ -35,3 +35,11 @@ test('scroll top back button matches the global liquid-glass back style', () =>
   assert.match(css, /background: linear-gradient\(\s*135deg/)
   assert.match(css, /backdrop-filter: blur\(24px\) saturate\(1\.7\) brightness\(1\.05\)/)
 })
+
+test('app sets page background before first render and fades pages in', () => {
+  const appSource = read('src/app.tsx')
+  const appCss = read('src/app.scss')
+  assert.match(appSource, /componentWillMount/)
+  assert.match(appCss, /@keyframes page-fade-in/)
+  assert.match(appCss, /animation: page-fade-in/)
+})