v0.2.0 沉浸式 + 按手机重排版 + 去掉导航模块

三条用户反馈一次处理完。

## ① 不够沉浸：首页距顶太远 + 底部白条

根因是**重复避让 + 颜色断裂**，两处都是我自己的错：
· 早先没开全屏时，系统已把窗口推到状态栏下方，我却又加了一个等高的白色
  Column「让出安全区」⇒ 重复避让，实测顶部空出 156px；
· 状态栏底色被设成「页面底色（宣纸米）」，而顶栏是白色 ⇒ 顶部出现
  「米色状态栏 + 白色顶栏」的拼接感，看着就是"没对齐"。

改法：
· EntryAbility 调 setWindowLayoutFullScreen(true)，窗口铺满整屏；
· 状态栏底色一律取**顶栏底色**，底部手势条取**页面底色** —— 各自与紧邻元素同色；
· 页面侧用 getWindowAvoidArea 自己让位（顶栏顶部内边距 = 状态栏高度，
  底色一直画到屏幕最上沿）；
· 底部那条全宽白 Column 删掉。

避让值走**异步** window.getLastWindow + windowSizeChange 监听
（早先"Ability 取窗存 AppStorage 再同步读"的做法实测读不到值，恒为 0）；
旋转/折叠后会自动重算。

验证（像素级，非目测）：y=0..200 全为顶栏白（原先 y=0..121 是米色状态条），
底部 y=2224..2444 全为纸色、白条消失。

## ② 去掉「导航」模块

用户原话：「导航是专门为电脑端开发的，都是网站，主要用在浏览器的主页，所以不需要」。
⇒ 删掉 FbNavPage、FbNavLink 类型、FB_DEMO_NAV、fbGroupNav、图标分支与演示数据。
⚠️ 模块清单自此与 Web 端 Module::LIST **有意不等**，注释里写明了别补回去。

## ③ 排版按手机重做（不照搬电脑端）

首页：删掉 hero 招牌整块（它只重复信息面板已有的信息），信息面板升为首块
并改成**无卡片的页面头部**（问候/日期大字、天气右上、三数字贴底）——
套白卡片会在首屏就切出一块白、压缩可用高度，也破坏沉浸感。
卡片从「今天的日程」才开始用，页面层次反而更清楚。

其余按手机重排：观影两列定格（原瀑布流）、任务按状态三段（原多列看板）、
家谱圈层（原折线树）。README 里列了逐项取舍与理由。

## 编译
hvigorw assembleHap --mode module -p product=default --no-daemon
→ BUILD SUCCESSFUL，0 error / 0 warning

entry/src/main/ets/pages/Index.ets

@@ -13,6 +13,7 @@
 
 import { display, window } from '@kit.ArkUI';
 import { hilog } from '@kit.PerformanceAnalysisKit';
+import { BusinessError } from '@kit.BasicServicesKit';
 import { FbColors, FbMetric } from '../common/Theme';
 import { FbAppState, FB_WIDE_BREAKPOINT, fbAppState } from '../common/Store';
 import { FbDrawerShell } from '../components/Drawer';
@@ -27,7 +28,7 @@ import { FbResourcesPage } from './resources/FbResourcesPage';
 import { FbDaysPage } from './days/FbDaysPage';
 import { FbLedgerPage } from './ledger/FbLedgerPage';
 import { FbBooksPage } from './books/FbBooksPage';
-import { FbNavPage, FbNotesPage, FbNotificationsPage } from './misc/FbMiscPages';
+import { FbNotesPage, FbNotificationsPage } from './misc/FbMiscPages';
 import { FbSettingsPage } from './settings/FbSettingsPage';
 
 @Entry
@@ -35,37 +36,120 @@ import { FbSettingsPage } from './settings/FbSettingsPage';
 struct Index {
   /** 全局状态（抽屉 / 当前模块 / 宽窄屏） */
   @Local app: FbAppState = fbAppState();
-  /** 顶部安全区高度（状态栏），由窗口避让信息算出 */
-  @Local topInset: number = 0;
-  /** 底部安全区高度（手势条） */
-  @Local bottomInset: number = 0;
+  /**
+   * 状态栏高度（vp）。
+   *
+   * 🔴 为什么需要它：EntryAbility 调了 `setWindowLayoutFullScreen(true)`，窗口**铺满整屏**
+   *    （顶栏背景色一直画到屏幕最上沿，这才是"沉浸"）。
+   *    代价是内容会钻到状态栏底下，所以顶栏必须自己让出这一段高度。
+   *
+   * ⚠️ 曾经这里踩过一个错：那时没开全屏，系统**已经把窗口推到状态栏下方**了，
+   *    我却又加了一个等高的白色 Column「让出安全区」⇒ 重复避让 156px，
+   *    用户看到的就是「首页距离上面那么远」。开全屏之后这一段才真正必要。
+   */
+  @Local statusBarH: number = 0;
+  /** 底部手势条高度（vp）——同理，全屏后内容会压到手势条上，需要留出 */
+  @Local bottomBarH: number = 0;
 
   aboutToAppear(): void {
-    this.measureInsets();
+    this.measureScreen();
+    this.loadWindowInsets();
+  }
+
+  /**
+   * 量屏幕断点（同步，首帧就能用）。
+   */
+  private measureScreen(): void {
+    try {
+      const d: display.Display = display.getDefaultDisplaySync();
+      const density: number = d.densityPixels;
+      if (density <= 0) {
+        return;
+      }
+      // 宽窄屏：按窗口短边（短边旋转时不变，故比例接近 1:1 的设备横竖屏布局天然一致）
+      const shortSide: number = Math.min(d.width, d.height) / density;
+      this.app.wideLayout = shortSide >= FB_WIDE_BREAKPOINT;
+    } catch (err) {
+      hilog.warn(0x0000, 'FamilyBook', 'measureScreen failed: %{public}s', JSON.stringify(err));
+    }
+  }
+
+  /**
+   * 取窗口避让区（状态栏 / 手势条高度）。
+   *
+   * ⚠️ 这里走**异步** `window.getLastWindow(ctx)`。
+   *    早先试过「EntryAbility 用 getMainWindowSync 取窗存进 AppStorage，页面侧同步读」——
+   *    实测**读不到**（Store 里存 Window 对象再取回来是不可靠的），结果 statusBarH 恒为 0。
+   *    代价是第一帧还没有避让值（顶栏按 0 让位），拿到后会自动重绘补上，
+   *    视觉上是"顶栏内容往下挪一点点"，可接受。
+   *
+   * ⚠️ 避让值随**旋转 / 折叠**变化，所以同时监听 windowSizeChange 重算。
+   */
+  private loadWindowInsets(): void {
+    try {
+      const ctx = this.getUIContext().getHostContext();
+      if (ctx === undefined) {
+        return;
+      }
+      window.getLastWindow(ctx)
+        .then((win: window.Window) => {
+          this.applyAvoidAreas(win);
+          // 尺寸变化（旋转、折叠展开/合上、分屏）后重算避让区
+          win.on('windowSizeChange', () => {
+            this.applyAvoidAreas(win);
+          });
+        })
+        .catch((err: BusinessError) => {
+          hilog.warn(0x0000, 'FamilyBook', 'getLastWindow failed: %{public}s',
+            JSON.stringify(err));
+        });
+    } catch (err) {
+      hilog.warn(0x0000, 'FamilyBook', 'loadWindowInsets failed: %{public}s',
+        JSON.stringify(err));
+    }
+  }
+
+  /** 从窗口读出避让区并换算成 vp（两个区各自 try —— 一个失败不该带下水另一个） */
+  private applyAvoidAreas(win: window.Window): void {
+    let density: number = 0;
+    try {
+      density = display.getDefaultDisplaySync().densityPixels;
+    } catch (err) {
+      hilog.warn(0x0000, 'FamilyBook', 'read density failed: %{public}s', JSON.stringify(err));
+      return;
+    }
+    if (density <= 0) {
+      return;
+    }
+    try {
+      const top: window.AvoidArea = win.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM);
+      this.statusBarH = top.topRect.height / density;
+    } catch (err) {
+      hilog.warn(0x0000, 'FamilyBook', 'status bar inset failed: %{public}s',
+        JSON.stringify(err));
+    }
+    try {
+      const bottom: window.AvoidArea =
+        win.getWindowAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR);
+      this.bottomBarH = bottom.bottomRect.height / density;
+    } catch (err) {
+      hilog.warn(0x0000, 'FamilyBook', 'nav bar inset failed: %{public}s',
+        JSON.stringify(err));
+    }
   }
 
   build() {
+    // 根容器铺满整屏；顶栏/内容各自让出状态栏与手势条 —— 这样顶栏的底色能一直
+    // 顶到屏幕最上沿，状态栏看起来就是「融合」在顶栏里的。
     Column() {
-      // 顶部安全区：把内容推到状态栏下方（状态栏底色由 EntryAbility 设成页面底色）
-      Column()
-        .width('100%')
-        .height(this.topInset)
-        .backgroundColor(FbColors.surface)
-
-      // 主骨架：抽屉 + 内容
+      // 主骨架：抽屉 + 内容（内部已含状态栏留白，见 mainArea）
       Column() {
-        FbDrawerShell({ app: this.app }) {
+        FbDrawerShell({ app: this.app, statusBarH: this.statusBarH }) {
           this.mainArea()
         }
       }
       .layoutWeight(1)
       .width('100%')
-
-      // 底部安全区
-      Column()
-        .width('100%')
-        .height(this.bottomInset)
-        .backgroundColor(FbColors.surface)
     }
     .width('100%')
     .height('100%')
@@ -76,9 +160,8 @@ struct Index {
   @Builder
   mainArea() {
     Column() {
-      // ---- 顶栏（右侧插槽由各模块页填充；这里统一留空，
-      //      因为「新建/搜索」这类操作已经放进各页自己的操作条里了）----
-      FbTopBar({ app: this.app }) {
+      // ---- 顶栏：自身含状态栏留白（底色一直画到屏幕顶），所以这里不再单独加间隔 ----
+      FbTopBar({ app: this.app, statusBarH: this.statusBarH }) {
       }
 
       // ---- 模块页 ----
@@ -87,6 +170,16 @@ struct Index {
       }
       .layoutWeight(1)
       .width('100%')
+
+      // ---- 底部手势条留白：保证内容不被手势条压住 ----
+      // ⚠️ 用页面底色而不是白色 —— 之前用一个白 Column 顶在这儿，
+      //    用户看到的就是「下面也有一条白色的东西」。
+      if (this.bottomBarH > 0) {
+        Column()
+          .width('100%')
+          .height(this.bottomBarH)
+          .backgroundColor(FbColors.paper)
+      }
     }
     .width('100%')
     .height('100%')
@@ -117,8 +210,6 @@ struct Index {
       FbLedgerPage({ app: this.app })
     } else if (this.app.activeModule === 'books') {
       FbBooksPage({ app: this.app })
-    } else if (this.app.activeModule === 'nav') {
-      FbNavPage({ app: this.app })
     } else if (this.app.activeModule === 'notes') {
       FbNotesPage({ app: this.app })
     } else if (this.app.activeModule === '__notifications') {
@@ -141,43 +232,4 @@ struct Index {
       .alignItems(HorizontalAlign.Center)
     }
   }
-
-  /**
-   * 量安全区与宽窄屏。
-   *
-   * ⚠️ 状态栏高度**不写死数字**：不同机型（刘海、挖孔、无手势条）差很多，
-   *    写死必然在某些机型上错位。这里按窗口避让信息取真实值。
-   *
-   * ⚠️ 窗口引用从 EntryAbility 放进 AppStorage（`fbMainWindow`）后再取 ——
-   *    `window.getLastWindow()` 只有异步版，在 aboutToAppear 里 await 会把
-   *    首帧的布局延后一帧；而 `windowStage.getMainWindowSync()` 是同步的，
-   *    由 Ability 侧取一次存下来最省事。
-   */
-  private measureInsets(): void {
-    try {
-      const d: display.Display = display.getDefaultDisplaySync();
-      const density: number = d.densityPixels;
-      if (density <= 0) {
-        return;
-      }
-
-      // 宽窄屏：按窗口短边（短边旋转时不变，故比例接近 1:1 的设备横竖屏布局天然一致）
-      const shortSide: number = Math.min(d.width, d.height) / density;
-      this.app.wideLayout = shortSide >= FB_WIDE_BREAKPOINT;
-
-      // 安全区：取窗口的真实避让矩形
-      const win: window.Window | undefined =
-        AppStorage.get<window.Window>('fbMainWindow');
-      if (win !== undefined) {
-        const top: window.AvoidArea = win.getWindowAvoidArea(window.AvoidAreaType.TYPE_SYSTEM);
-        this.topInset = top.topRect.height / density;
-        const bottom: window.AvoidArea =
-          win.getWindowAvoidArea(window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR);
-        this.bottomInset = bottom.bottomRect.height / density;
-      }
-    } catch (err) {
-      // 取不到就退到「只判宽窄屏、安全区按 0」—— 页面自带 12vp 顶部留白，不会贴边
-      hilog.warn(0x0000, 'FamilyBook', 'measureInsets failed: %{public}s', JSON.stringify(err));
-    }
-  }
-}
+}