📝 docs(prd): update financial dashboard popup design documentation

- add detailed popup layer structure description with four components: Overlay, Dialog Container, Dialog Content, Action Controls
- add specific Figma links for each popup layer component
- update popup reference in story 2 to use the new layer structure description
- update file description for VariationModal.tsx to reflect the new layer structure

docs/prd/epic-006-financial-dashboard.md

@@ -19,7 +19,23 @@
   - API接口规范：`/mnt/code/182-169-template-6/docs/战略步署api.md` - 包含财务数据API的完整接口定义和数据结构
   - UI设计原型：
     - 主页面：`https://www.figma.com/design/mTu6gamzMFEybbSb8WssKK/可视化素材2-25?node-id=1715-121572&m=dev` - 财务数据可视化大屏主页面设计，包含四个数据模块
-    - 弹窗页面：`https://www.figma.com/design/mTu6gamzMFEybbSb8WssKK/可视化素材2-25?node-id=1819-154497&m=dev` - 点击变动幅度按钮后弹出的弹窗设计
+    - 弹窗层构成：
+
+      **弹窗由四个层次组合构成**：
+
+      1. **遮罩层** (Overlay) - 背景遮罩，提供视觉隔离和点击外部关闭功能
+         @https://www.figma.com/design/mTu6gamzMFEybbSb8WssKK/%E5%8F%AF%E8%A7%86%E5%8C%96%E7%B4%A0%E6%9D%902-25?node-id=1949-81702&m=dev
+
+      2. **弹出框** (Dialog Container) - 弹窗主体容器，包含边框、阴影和圆角样式
+         @https://www.figma.com/design/mTu6gamzMFEybbSb8WssKK/%E5%8F%AF%E8%A7%86%E5%8C%96%E7%B4%A0%E6%9D%902-25?node-id=1949-81703&m=dev
+
+      3. **弹出框数据** (Dialog Content) - 弹窗内容区域，展示财务数据详情
+         @https://www.figma.com/design/mTu6gamzMFEybbSb8WssKK/%E5%8F%AF%E8%A7%86%E5%8C%96%E7%B4%A0%E6%9D%902-25?node-id=1949-81714&m=dev
+
+      4. **返回按钮** (Action Controls) - 弹窗操作控件，包含关闭按钮和交互元素
+         @https://www.figma.com/design/mTu6gamzMFEybbSb8WssKK/%E5%8F%AF%E8%A7%86%E5%8C%96%E7%B4%A0%E6%9D%902-25?node-id=1949-82235&m=dev
+
+      - 点击变动幅度按钮后弹出的弹窗设计，基于上述四个层次构成实现
 
 ### 增强详情
 
@@ -44,7 +60,7 @@
 1. **Story 1：创建财务数据API接口** - 在 `src/server/api/dash/outlook` 下创建GET接口，实现财务数据返回逻辑，包含四个数据模块：资产总额与资产净额、利润总额与净利润、收入、资产负债率
 2. **Story 2：实现财务数据可视化大屏页面** - 在 `src/client/home/pages/FinancialDashboard/` 下创建财务数据可视化大屏组件，包括：
    - 主页面（参考：`node-id=1715-121572`）- 包含四个数据模块的可视化展示
-   - 变动幅度弹窗（参考：`node-id=1819-154497`）- 点击右下角浮动按钮后显示
+   - 变动幅度弹窗（参考四个层次构成：遮罩层、弹出框、弹出框数据、返回按钮）- 点击右下角浮动按钮后显示
 3. **Story 3：集成API与前端数据展示** - 实现前端API调用、数据状态管理和可视化图表展示，使用Recharts组件库实现柱状图可视化
 
 ## 兼容性要求
@@ -89,7 +105,7 @@ src/client/home/pages/FinancialDashboard/
 │   ├── ProfitMetrics.tsx         # 利润总额与净利润模块
 │   ├── IncomeMetrics.tsx         # 收入模块
 │   ├── DebtRatioMetrics.tsx      # 资产负债率（百分比）模块
-│   └── VariationModal.tsx        # 变动幅度弹窗组件
+│   └── VariationModal.tsx        # 变动幅度弹窗组件（基于四个层次构成：遮罩层、弹出框、弹出框数据、返回按钮）
 └── __tests__/
 ```