complete card height change and new page about RoRd overall and weight assignment

2025-10-05 20:40:16 +08:00
parent 8a0276c3ce
commit 76efb30b7f
15 changed files with 2734 additions and 1446 deletions
--- a/src/components/navigation/NavigationCard.astro
+++ b/src/components/navigation/NavigationCard.astro
@@ -126,6 +126,8 @@ const revealAttributes = reveal
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+    min-height: 280px;
+    height: 100%;
  }
  
  .nav-card:hover {
@@ -196,7 +198,6 @@ const revealAttributes = reveal
  
  /* 尺寸变体 */
  .nav-card-small {
-    min-height: 150px;
    padding: 1.5rem;
  }
  
@@ -209,12 +210,10 @@ const revealAttributes = reveal
  }
  
  .nav-card-medium {
-    min-height: 200px;
    padding: 2rem;
  }
  
  .nav-card-large {
-    min-height: 280px;
    padding: 2.5rem;
  }
  
--- a/src/components/navigation/NavigationGrid.astro
+++ b/src/components/navigation/NavigationGrid.astro
@@ -71,6 +71,8 @@ const gapClasses = {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    width: 100%;
+    align-items: stretch;
+    grid-auto-rows: minmax(280px, auto);
  }
  
  /* 响应式列数 */
--- a/src/pages/report/20250722/index.astro
+++ b/src/pages/report/20250722/index.astro
@@ -767,9 +767,10 @@ const proofImages = {
  
  /* 报告布局样式 */
  .report-layout {
+    --report-sidebar-width: clamp(var(--report-sidebar-min-width), 22vw, var(--report-sidebar-max-width));
    display: flex;
    flex-direction: column;
-    gap: 2.5rem;
+    gap: var(--report-sidebar-gap);
    position: relative;
    width: 100%;
  }
@@ -781,6 +782,11 @@ const proofImages = {
    margin: 0 auto;
  }
  
+  .container {
+    max-width: 1200px;
+    width: 100%;
+  }
+  
  .mx-auto {
    margin-left: auto;
    margin-right: auto;
@@ -830,8 +836,13 @@ const proofImages = {
   * - 1200px (当前设置，平衡)
   * - 1400px (较宽，适合表格)
   */
-  :root {
+  :global(:root) {
    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
  }
  
  /* 统一宽度类 - 所有内容区域使用相同的最大宽度 */
@@ -847,6 +858,34 @@ const proofImages = {
    max-width: var(--max-content-width);
    margin: 0 auto;
  }
-  
+
+  @media (min-width: 1280px) {
+    .report-main {
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
+    }
+    .report-layout {
+      max-width: var(--max-content-width);
+      margin: 0 auto;
+      position: relative;
+    }
+    .report-content {
+      max-width: 100%;
+      width: 100%;
+      margin-left: 0;
+    }
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
+    }
+  }

 </style>
--- a/src/pages/report/20250912/index.astro
+++ b/src/pages/report/20250912/index.astro
@@ -349,9 +349,10 @@ const images = {
 <style>
  /* 报告布局样式 */
  .report-layout {
+    --report-sidebar-width: clamp(var(--report-sidebar-min-width), 22vw, var(--report-sidebar-max-width));
    display: flex;
    flex-direction: column;
-    gap: 2.5rem;
+    gap: var(--report-sidebar-gap);
    position: relative;
    width: 100%;
  }
@@ -363,6 +364,11 @@ const images = {
    margin: 0 auto;
  }
  
+  .container {
+    max-width: 1200px;
+    width: 100%;
+  }
+  
  .mx-auto {
    margin-left: auto;
    margin-right: auto;
@@ -385,10 +391,48 @@ const images = {
    font-size: 0.9em;
  }

+  :global(:root) {
+    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
+  }
+
  /* 响应式网格 */
  @media (max-width: 768px) {
    .grid-cols-1.md\\:grid-cols-2 {
      grid-template-columns: 1fr;
    }
  }
+
+  @media (min-width: 1280px) {
+    .report-main {
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
+    }
+    .report-layout {
+      max-width: var(--max-content-width);
+      margin: 0 auto;
+      position: relative;
+    }
+    .report-content {
+      max-width: 100%;
+      width: 100%;
+      margin-left: 0;
+    }
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
+    }
+  }
 </style>
--- a/src/pages/report/20250928/index.astro
+++ b/src/pages/report/20250928/index.astro
@@ -650,7 +650,7 @@ const timeEstimation = [
  .report-layout {
    display: flex;
    flex-direction: column;
-    gap: 2.5rem;
+    gap: var(--report-sidebar-gap);
    position: relative;
    width: 100%;
  }
@@ -661,6 +661,11 @@ const timeEstimation = [
    min-width: 0;
    margin: 0 auto;
  }
+  
+  .container {
+    max-width: 1200px;
+    width: 100%;
+  }

  /* 莫兰蒂蓝色系高亮 */
  :global(.morandi-highlight) {
@@ -768,6 +773,15 @@ const timeEstimation = [
    width: 100%;
  }

+  :global(:root) {
+    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
+  }
+
  .task-item:hover {
    background: rgba(255, 255, 255, 0.8);
    border-color: rgba(44, 74, 107, 0.3);
@@ -815,4 +829,33 @@ const timeEstimation = [
      grid-template-columns: 1fr;
    }
  }
+
+  @media (min-width: 1280px) {
+    .report-main {
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
+    }
+    .report-layout {
+      max-width: var(--max-content-width);
+      margin: 0 auto;
+      position: relative;
+    }
+    .report-content {
+      max-width: 100%;
+      width: 100%;
+      margin-left: 0;
+    }
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
+    }
+  }
 </style>
--- a/src/pages/report/Geo-Layout-Transformer/index.astro
+++ b/src/pages/report/Geo-Layout-Transformer/index.astro
@@ -512,7 +512,7 @@ const reportConfig = {
  .report-layout {
    display: flex;
    flex-direction: column;
-    gap: 2.5rem;
+    gap: var(--report-sidebar-gap);
    position: relative;
    width: 100%;
  }
@@ -523,6 +523,20 @@ const reportConfig = {
    min-width: 0;
    margin: 0 auto;
  }
+  
+  .container {
+    max-width: 1200px;
+    width: 100%;
+  }
+
+  :global(:root) {
+    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
+  }

  .mx-auto {
    margin-left: auto;
@@ -595,6 +609,35 @@ const reportConfig = {
      grid-column: span 1;
    }
  }
+
+  @media (min-width: 1280px) {
+    .report-main {
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
+    }
+    .report-layout {
+      max-width: var(--max-content-width);
+      margin: 0 auto;
+      position: relative;
+    }
+    .report-content {
+      max-width: 100%;
+      width: 100%;
+      margin-left: 0;
+    }
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
+    }
+  }
 </style>

 <script>
--- a/src/pages/report/RoRD-overall/RoRD-overall.md
+++ b/src/pages/report/RoRD-overall/RoRD-overall.md
@@ -0,0 +1,428 @@
+# RoRD-Layout-Recognation 项目综合技术报告
+
+版本: 1.3 (完整版)
+
+日期: 2025年10月5日
+
+摘要: 本报告旨在全面、系统地阐述 RoRD-Layout-Recognation 项目自2025年6月启动以来的完整开发历程、核心技术实现、当前成果及未来展望。报告整合了项目各个阶段的进展，详细描述了如何针对集成电路（IC）版图的独有特性（如几何多变性、结构重复性、数据稀缺性）深度优化并实现 RoRD (Rotation-Robust Descriptors) 模型，最终构建了一套高效、鲁棒的版图识别与匹配系统。
+
+## 目录
+
+1. [项目概述](https://www.google.com/search?q=%231-项目概述)
+   - [1.1. 项目目标](https://www.google.com/search?q=%2311-项目目标)
+   - [1.2. 主要困难与挑战](https://www.google.com/search?q=%2312-主要困难与挑战)
+2. [项目历程与当前状态](https://www.google.com/search?q=%232-项目历程与当前状态)
+   - [2.1. 第一阶段 (2025年6月)：开题与技术选型](https://www.google.com/search?q=%2321-第一阶段-2025年6月开题与技术选型)
+   - [2.2. 第二阶段 (2025年7月)：模型适配与几何感知损失函数设计](https://www.google.com/search?q=%2322-第二阶段-2025年7月模型适配与几何感知损失函数设计)
+   - [2.3. 第三阶段 (2025年9月)：架构现代化与性能飞跃](https://www.google.com/search?q=%2323-第三阶段-2025年9月架构现代化与性能飞跃)
+   - [2.4. 当前状态 (2025年10月)](https://www.google.com/search?q=%2324-当前状态-2025年10月)
+3. [技术实现与创新点](https://www.google.com/search?q=%233-技术实现与创新点)
+   - [3.1. 模型架构：从 VGG 到 FPN](https://www.google.com/search?q=%2331-模型架构从-vgg-到-fpn)
+   - [3.2. 核心创新：几何感知损失函数](https://www.google.com/search?q=%2332-核心创新几何感知损失函数)
+   - [3.3. 训练策略：自监督与稳定性](https://www.google.com/search?q=%2333-训练策略自监督与稳定性)
+   - [3.4. 推理与匹配：高效的多实例检测](https://www.google.com/search?q=%2334-推理与匹配高效的多实例检测)
+   - [3.5. 工程化：配置驱动与实验追踪](https://www.google.com/search?q=%2335-工程化配置驱动与实验追踪)
+4. [项目成果与预期效果](https://www.google.com/search?q=%234-项目成果与预期效果)
+5. [未来工作与展望](https://www.google.com/search?q=%235-未来工作与展望)
+   - [5.1. 技术优化路线图](https://www.google.com/search?q=%2351-技术优化路线图)
+   - [5.2. 学术产出与论文计划](https://www.google.com/search?q=%2352-学术产出与论文计划)
+6. [附录](https://www.google.com/search?q=%236-附录)
+   - [A. 项目结构](https://www.google.com/search?q=%23a-项目结构)
+   - [B. 快速使用指南](https://www.google.com/search?q=%23b-快速使用指南)
+   - [C. 数据集要求](https://www.google.com/search?q=%23c-数据集要求)
+
+## 1. 项目概述
+
+`RoRD-Layout-Recognation` 是一个专注于集成电路（IC）版图自动化识别的深度学习项目。其核心是利用并深度改造 **RoRD (Rotation-Robust Descriptors)** 模型，构建一套能够快速、精准且鲁棒地识别IC版图中标准单元、IP核等模板的系统。
+
+### 1.1. 项目目标
+
+本项目的核心目标是赋能**设计-工艺协同优化（DTCO）**，通过AI技术实现对IC版图的高效分析。具体分解为以下几点：
+
+1. **实现高精度的模板匹配**：在复杂的IC版图中，准确识别出所有给定模板实例的位置、方向（8种可能）和尺度。
+2. **保证高效率的识别速度**：优化模型与算法，特别是针对大尺寸版图（GDSII），实现近实时的匹配速度，满足工业应用需求。
+3. **具备强大的零/少样本能力**：模型应能识别新的、未在训练中见过的模板，避免对大规模标注数据的依赖，适应快速迭代的IP库。
+4. **构建标准化的实验流程**：建立一套从数据准备、模型训练、参数调优到性能评估的完整、可复现的研发管线。
+
+### 1.2. 主要困难与挑战
+
+传统计算机视觉和通用深度学习模型在应用于IC版图分析时，面临四大核心挑战：
+
+1. **数据稀缺性**：高质量、已标注的IC版图数据获取成本极高，难以获得大规模训练集。
+2. **几何多变性**：版图中的单元（cell）普遍存在8个基本方向（0/90/180/270度旋转及其水平/垂直镜像）的变化，要求模型具备高度的旋转和镜像不变性。
+3. **结构复杂性**：版图通常是二值化的、特征稀疏，且包含大量高度相似或完全相同的重复结构（如标准单元阵列），同时遵循严格的“曼哈顿”网格布局，这些特性与自然图像差异巨大。
+4. **动态扩展性**：半导体工艺不断演进，标准单元和IP核库庞大且持续更新。模型必须能够快速适应新模板的识别，即具备良好的零样本/少样本泛化能力。
+
+## 2. 项目历程与当前状态
+
+### 2.1. 第一阶段 (2025年6月)：开题与技术选型
+
+项目初期，我们明确了服务于**设计-工艺协同优化（DTCO）**的最终目标。在对U-Net、YOLO、ViT、SuperPoint等多种主流AI技术进行调研后，最终选定 **RoRD** 作为核心技术。
+
+- **关键决策**：RoRD通过自监督学习旋转鲁棒描述子的机制，天然契合了IC版图识别中最重要的**旋转不变性**和**数据稀缺性**两大痛点，使其成为最理想的技术选型。
+- **主要成果**：完成项目开题，确立技术路线，并对版图识别的核心挑战进行了深入分析。
+
+### 2.2. 第二阶段 (2025年7月)：模型适配与几何感知损失函数设计
+
+此阶段的核心工作是将通用RoRD模型适配到IC版图这一特定领域，关键在于让模型学会“看懂”几何而非纹理。
+
+- **模型初步调整**：
+  - 移除了对版图数据无意义的**正交视图生成**组件。
+  - 设计了基于**滑动窗口**（针对大版图）和**图像金字塔**（针对模板）的多尺度匹配策略，初步解决了尺寸差异问题。
+- **核心创新：几何感知损失函数**：
+  - 针对版图的二值化、稀疏性和曼哈顿几何特性，设计了一套全新的复合损失函数。该损失函数强制模型学习**几何结构描述子**，而非传统的纹理描述子，为项目成功奠定了理论基础。
+- **初步验证**：实验成功验证了模型在IC版图上的多实例、多方向匹配能力，证明了技术路线的正确性。
+
+### 2.3. 第三阶段 (2025年9月)：架构现代化与性能飞跃
+
+为提升开发效率、实验可复现性和模型性能，我们对项目进行了彻底的现代化重构。
+
+- **工程化升级**：
+  - **配置与代码解耦**：所有参数迁移至 **YAML 文件** (`configs/base_config.yaml`)，由 `OmegaConf` 统一管理，实现了实验的灵活配置与一键复现。
+  - **代码模块化**：将数据集、损失函数等核心逻辑解耦为独立模块 (`data/`, `losses.py`)，提升了代码的可维护性。
+- **性能与效率提升**：
+  - **引入特征金字塔网络 (FPN)**：重构模型，通过单次前向推理生成多尺度特征，将匹配速度提升了一个数量级。
+  - **增加非极大值抑制 (NMS)**：在关键点提取后引入半径NMS去重，显著降低了后续RANSAC的计算量，提升了匹配的效率和稳定性。
+- **实验追踪体系**：
+  - 全面集成 **TensorBoard**，实现了对训练、评估、匹配全流程关键指标的可视化监控与对比分析。
+
+### 2.4. 当前状态 (2025年10月)
+
+项目已完成核心架构的现代化升级。FPN、NMS、YAML配置、模块化代码和TensorBoard实验追踪等关键功能均已稳定运行。项目当前处于技术成熟、可随时开展大规模实验的阶段，为后续的深度优化和学术产出奠定了坚实基础。
+
+## 3. 技术实现与创新点
+
+### 3.1. 模型架构：从 VGG 到 FPN
+
+模型采用 **RESNET** 作为骨干网络，并在其上并联两个头部：一个用于关键点检测，一个用于描述子生成。为了实现高效的多尺度匹配，我们引入了**特征金字塔网络 (FPN)**。
+
+- **FPN 实现**：在推理时，模型从VGG的 `relu2_2`, `relu3_3`, `relu4_3` 层提取特征图（C2, C3, C4），通过横向连接与自顶向下上采样构建出特征金字塔（P2, P3, P4）。检测头与描述子头在金字塔的每一层上共享，从而实现**单次推理，多尺度检测**。
+
+  ```python
+      def forward(self, x: torch.Tensor, return_pyramid: bool = False):
+          if not return_pyramid:
+              # 向后兼容的单尺度路径（relu4_3）
+              features = self.backbone(x)
+              detection_map = self.detection_head(features)
+              descriptors = self.descriptor_head(features)
+              return detection_map, descriptors
+  
+          # --- FPN 路径：提取 C2/C3/C4 ---
+          c2, c3, c4 = self._extract_c234(x)
+          p4 = self.lateral_c4(c4)
+          p3 = self.lateral_c3(c3) + F.interpolate(p4, size=c3.shape[-2:], mode="nearest")
+          p2 = self.lateral_c2(c2) + F.interpolate(p3, size=c2.shape[-2:], mode="nearest")
+  
+          p4 = self.smooth_p4(p4)
+          p3 = self.smooth_p3(p3)
+          p2 = self.smooth_p2(p2)
+  
+          pyramid = {}
+          if 4 in self.fpn_levels:
+              pyramid["P4"] = (self.det_head_fpn(p4), self.desc_head_fpn(p4), 8)
+          if 3 in self.fpn_levels:
+              pyramid["P3"] = (self.det_head_fpn(p3), self.desc_head_fpn(p3), 4)
+          if 2 in self.fpn_levels:
+              pyramid["P2"] = (self.det_head_fpn(p2), self.desc_head_fpn(p2), 2)
+          return pyramid
+  
+  
+  ```
+
+  
+
+### 3.2. 核心创新：几何感知损失函数
+
+为了让模型学习IC版图的几何特性而非无效的纹理，我们设计了专用的复合损失函数 `$L_{total} = L_{det} + L_{desc}$`。这是本项目的**最主要创新点**。
+
+- 检测损失 ($L_{det}$):
+
+  $$ L_{\text{det}} = \text{BCE}(\text{det}{\text{original}}, \text{warp}(\text{det}{\text{rotated}}, H^{-1})) + 0.1 \times \text{SmoothL1}(\text{det}{\text{original}}, \text{warp}(\text{det}{\text{rotated}}, H^{-1})) $$
+
+  该损失结合了BCE（适合二值边界）和SmoothL1（增强边缘定位鲁棒性），确保了关键点检测的准确性。
+
+- 几何感知描述子损失 ($L_{desc}$):
+
+  $$ L_{\text{desc}} = L_{\text{triplet}} + 0.1 L_{\text{manhattan}} + 0.01 L_{\text{sparse}} + 0.05 L_{\text{binary}} $$
+
+  它由四个针对IC版图特性专门设计的组件构成，迫使模型关注几何结构：
+
+  1. **Ltriplet**: 使用**曼哈顿距离(L1)**的Triplet Loss，更适合网格状的版图。
+  2. **Lmanhattan**: 强制描述子对90度旋转保持一致性，以区分高度重复的结构。
+  3. **Lsparse**: 稀疏性正则化，鼓励描述子稀疏，抑制在空白区域的无效特征。
+  4. **Lbinary**: 在描述子的符号级别计算距离，强化对几何边界的学习。
+
+  ```python
+  def compute_description_loss(
+      desc_original: torch.Tensor,
+      desc_rotated: torch.Tensor,
+      h: torch.Tensor,
+      margin: float = 1.0,
+  ) -> torch.Tensor:
+      """Triplet-style descriptor loss with Manhattan-aware sampling."""
+      # ... (采样 anchor 和 positive 点) ...
+  
+      # 困难负样本挖掘：通过旋转生成几何上相似但方向不同的负样本
+      negative_list = []
+      if manhattan_coords.size(1) > 0:
+          angles = [90, 180, 270] # 仅使用非0度旋转作为负样本
+          for angle in angles:
+              # ... (计算旋转后的坐标) ...
+              negative_list.append(rotated_coords)
+  
+      # ... (选择最难的负样本) ...
+  
+      # 几何 Triplet 损失 (使用L1范数)
+      triplet_loss = nn.TripletMarginLoss(margin=margin, p=1, reduction='mean')
+      geometric_triplet = triplet_loss(anchor, positive, negative)
+  
+      # 曼哈顿一致性损失 (余弦相似度)
+      manhattan_loss = 0.0
+      for i in range(anchor.size(1)):
+          anchor_norm = F.normalize(anchor[:, i], p=2, dim=1)
+          positive_norm = F.normalize(positive[:, i], p=2, dim=1)
+          cos_sim = torch.sum(anchor_norm * positive_norm, dim=1)
+          manhattan_loss += torch.mean(1 - cos_sim)
+      manhattan_loss /= max(anchor.size(1), 1)
+  
+      # 稀疏性和二值化损失
+      sparsity_loss = torch.mean(torch.abs(anchor)) + torch.mean(torch.abs(positive))
+      binary_loss = torch.mean(torch.abs(torch.sign(anchor) - torch.sign(positive)))
+  
+      return geometric_triplet + 0.1 * manhattan_loss + 0.01 * sparsity_loss + 0.05 * binary_loss
+  
+  
+  ```
+
+  
+
+### 3.3. 训练策略：自监督与稳定性
+
+- **自监督学习**：通过对输入图像进行随机几何变换（旋转、镜像）来自动生成训练对 `(original, rotated, H)`，无需人工标注。
+
+- **数据增强**：除了几何变换，还应用了尺度抖动、Sobel边缘增强、亮度/对比度调整和高斯噪声，提升模型泛化能力。
+
+- **稳定性措施**：训练中采用**梯度裁剪**防止梯度爆炸，并设置**早停机制**（patience=10）和**学习率动态调整** (`ReduceLROnPlateau`)，确保训练过程稳定高效。
+
+  ```python
+      for epoch in range(epochs):
+          model.train()
+          for i, (original, rotated, H) in enumerate(train_dataloader):
+              original, rotated, H = original.cuda(), rotated.cuda(), H.cuda()
+              
+              det_original, desc_original = model(original)
+              det_rotated, desc_rotated = model(rotated)
+              
+              det_loss = compute_detection_loss(det_original, det_rotated, H)
+              desc_loss = compute_description_loss(desc_original, desc_rotated, H)
+              loss = det_loss + desc_loss
+              
+              optimizer.zero_grad()
+              loss.backward()
+              
+              # 梯度裁剪，防止梯度爆炸
+              torch.nn.utils.clip_grad_norm_(model.parameters(), max_norm=1.0)
+              
+              optimizer.step()
+          
+          # ... (验证、保存模型、学习率调度和早停逻辑) ...
+  
+  
+  ```
+
+  
+
+### 3.4. 推理与匹配：高效的多实例检测
+
+推理流程利用FPN和NMS实现了速度和精度的双重提升。
+
+- **特征提取**：通过`extract_from_pyramid`函数，一次性从FPN的多层级提取关键点和描述子。
+
+- **关键点去重**：使用自定义的`radius_nms`函数，根据关键点分数和空间距离进行筛选，去除重叠区域的冗余点。
+
+- **匹配与验证**：采用**互最近邻（MNN）算法进行初步匹配，再由RANSAC**算法估计单应性矩阵并滤除外点。
+
+- **多实例检测**：在一个循环中迭代检测。每当一个实例被成功匹配，就将其区域内的关键点屏蔽，然后在剩余点中继续寻找下一个实例。
+
+  ```python
+  def extract_from_pyramid(model, image_tensor, kp_thresh, nms_cfg):
+      with torch.no_grad():
+          pyramid = model(image_tensor, return_pyramid=True)
+      all_kps, all_desc = [], []
+      for level_name, (det, desc, stride) in pyramid.items():
+          # ... (提取特征) ...
+          kps = coords.flip(1) * float(stride) # 映射回原图坐标
+  
+          # NMS
+          if nms_cfg and nms_cfg.get('enabled', False):
+              keep = radius_nms(kps, scores, float(nms_cfg.get('radius', 4)))
+              if len(keep) > 0:
+                  kps, descs = kps[keep], descs[keep]
+          all_kps.append(kps)
+          all_desc.append(descs)
+      # ...
+      return torch.cat(all_kps, dim=0), torch.cat(all_desc, dim=0)
+  
+  def radius_nms(kps: torch.Tensor, scores: torch.Tensor, radius: float) -> torch.Tensor:
+      if kps.numel() == 0: return torch.empty((0,), dtype=torch.long)
+      idx = torch.argsort(scores, descending=True)
+      keep, taken = [], torch.zeros(len(kps), dtype=torch.bool)
+      for i in idx:
+          if taken[i]: continue
+          keep.append(i.item())
+          dist2 = torch.sum((kps - kps[i])**2, dim=1)
+          taken |= dist2 <= (radius * radius)
+      return torch.tensor(keep, dtype=torch.long)
+  
+  
+  ```
+
+  
+
+### 3.5. 工程化：配置驱动与实验追踪
+
+- **YAML配置**：所有参数均在`configs/base_config.yaml`中集中管理，实现了代码与配置的完全分离。
+
+- **TensorBoard集成**：通过在`train.py`, `evaluate.py`, `match.py`中调用`SummaryWriter`，实现了对整个实验流程的端到端可视化监控。
+
+  ```yaml
+  model:
+    fpn:
+      enabled: true
+      out_channels: 256
+      levels: [2, 3, 4]
+  
+  matching:
+    keypoint_threshold: 0.5
+    min_inliers: 15
+    use_fpn: true
+    nms:
+      enabled: true
+      radius: 4
+  
+  logging:
+    use_tensorboard: true
+    log_dir: "runs"
+    experiment_name: "baseline"
+  ```
+
+  
+
+## 4. 项目成果与预期效果
+
+- **当前核心能力**：
+  - **多实例检测**：已能在一张大版图中找出同一模板的多个不同实例。
+  - **旋转不变性**：已能准确匹配经过8个方向变换的模板。
+  - **高效率**：FPN的引入使得匹配速度相较于传统的图像金字塔方案有显著提升。
+- **评估流程**：
+  - `evaluate.py`脚本通过计算预测边界框与真实标注框的**IoU (Intersection over Union)**来评估性能。
+  - 最终输出**精确率（Precision）、召回率（Recall）和F1分数**，并记录到TensorBoard中，便于不同实验间的横向对比。
+- **项目预期效果**：
+  1. **精度**：在标准验证集上，对于已训练或相似风格的模板，F1分数达到 **95%** 以上。
+  2. **速度**：对于百万门级规模的版图，在单张V100/A100 GPU上，单模板的全局匹配时间控制在 **1分钟** 以内。
+  3. **鲁棒性**：模型对一定范围内的工艺制造偏差（如轻微的线宽变化、金属填充密度差异）保持稳定的识别能力。
+  4. **可扩展性**：在不重新训练的情况下，能够直接对新的、从未见过的标准单元库进行匹配，并保持 **85%** 以上的F1分数。
+
+## 5. 未来工作与展望
+
+### 5.1. 技术优化路线图
+
+- **[高优先级] 数据策略**：
+  - 引入**弹性变形**，模拟芯片制造中的物理形变。
+  - 创建**合成版图数据生成器**，利用`gdstk`等工具程序化生成海量训练数据。
+- **[高优先级] 训练优化**：
+  - 实现**损失函数自动加权**，通过不确定性加权自动平衡多任务学习。
+- **[中优先级] 模型架构**：
+  - 实验**现代骨干网络**（如ResNet, EfficientNet）以提升效率。
+  - 集成**注意力机制**，引导模型关注关键几何结构。
+
+### 5.2. 学术产出与论文计划
+
+项目已具备坚实的技术基础和明确的创新点，计划将研究成果整理成学术论文，并制定了清晰的投稿路线图，目标是冲击电子设计自动化（EDA）领域的顶级会议。
+
+- **论文核心贡献点**：
+
+  1. 首次将旋转鲁棒的局部特征描述子（RoRD）应用于IC版图识别，并验证其有效性。
+  2. 提出一套专为IC版图设计的**几何感知损失函数**，显著提升了模型在二值化、稀疏、重复和曼哈顿结构上的特征表达能力。
+  3. 将FPN和NMS等先进技术与RoRD结合，大幅提升了在大尺寸版图上的匹配效率和多实例检测能力。
+
+- 分阶段投稿策略：
+
+  | 目标会议 | 投稿截止 (预计) | 结果通知 (预计) | 会议召开 (预计) | 策略说明 |
+
+  | :--- | :--- | :--- | :--- | :--- |
+
+  | ICCAD 2026 | 2026年5月中下旬 | 2026年8月上旬 | 2026年10月底 | 首要目标，时间窗口合适，会议主题契合。|
+
+  | DATE 2027 | 2026年9月中旬 | 2026年12月中旬 | 2027年3-4月 | Plan A，若ICCAD未中，根据审稿意见快速修改后投递。 |
+
+  | DAC 2027 | 2026年11月中下旬 | 2027年2月底 | 2027年6-7月 | Plan B，时间更充裕，可进行更深入的实验和优化。 |
+
+  | ASP-DAC 2028 | 2027年7月中旬 | 2027年10月中旬 | 2028年1月下旬 | 若前序会议均未成功，可作为进一步打磨后的投稿选择。 |
+
+  | IEEE TCAD | 滚动 | - | - | 最终计划，若多轮会议未果，将整理成更完整的期刊文章。|
+
+## 6. 附录
+
+### A. 项目结构
+
+```tex
+RoRD-Layout-Recognation/
+├── configs/
+│   └── base_config.yaml      # YAML 配置中心
+├── data/
+│   └── ic_dataset.py         # 数据集定义
+├── docs/                     # 文档
+├── models/
+│   └── rord.py               # RoRD 模型 (含FPN)
+├── utils/                    # 辅助工具
+├── losses.py                 # 几何感知损失函数
+├── train.py                  # 训练脚本
+├── evaluate.py               # 评估脚本
+├── match.py                  # 模板匹配脚本
+├── pyproject.toml            # 项目与依赖管理
+└── README.md
+```
+
+### B. 快速使用指南
+
+所有操作均推荐通过 `uv` 在虚拟环境中执行。
+
+- **安装依赖**:
+
+  ```bash
+  uv sync
+  ```
+
+- **训练模型**:
+
+  ```bash
+  uv run python train.py --config configs/your_exp_config.yaml
+  ```
+
+- **执行匹配**:
+
+  ```bash
+  uv run python match.py --config configs/your_exp_config.yaml --model_path path/to/model.pth --layout path/to/layout.png --template path/to/template.png
+  ```
+
+- **启动TensorBoard**:
+
+  ```bash
+  uv run tensorboard --logdir runs
+  ```
+
+### C. 数据集要求
+
+- **训练数据**：仅需提供大量无标注的PNG格式版图图像。
+
+- **验证数据**：需提供验证用的大版图、模板图以及描述模板位置的JSON标注文件。JSON格式如下：
+
+  ```json
+  {
+      "boxes": [
+          {"template": "template1.png", "x": 100, "y": 200, "width": 50, "height": 50},
+          {"template": "template2.png", "x": 300, "y": 400, "width": 60, "height": 60}
+      ]
+  }
+  ```
--- a/src/pages/report/RoRD-overall/index.astro
+++ b/src/pages/report/RoRD-overall/index.astro
@@ -0,0 +1,792 @@
+---
+import BaseLayout from '../../../layouts/BaseLayout.astro';
+import Header from '../../../components/Header.astro';
+import Footer from '../../../components/Footer.astro';
+import ReportSection from '../../../components/report/ReportSection.astro';
+import GlassTable from '../../../components/common/GlassTable.astro';
+import MathFormula from '../../../components/common/MathFormula.astro';
+import CodeBlock from '../../../components/common/CodeBlock.astro';
+import Container from '../../../components/Container.astro';
+import AnimatedElement from '../../../components/AnimatedElement.astro';
+import ReportSidebar from '../../../components/report/ReportSidebar.astro';
+
+import {
+  getSectionBaseDelay,
+  getChildDelay
+} from '../../../scripts/animation-timing';
+
+const SECTION_DELAYS = {
+  HERO: 200,
+  OVERVIEW: getSectionBaseDelay(0),
+  JOURNEY: getSectionBaseDelay(1),
+  TECHNOLOGY: getSectionBaseDelay(2),
+  OUTCOMES: getSectionBaseDelay(3),
+  FUTURE: getSectionBaseDelay(4),
+  APPENDIX: getSectionBaseDelay(5)
+};
+
+const reportConfig = {
+  title: 'RoRD-Layout-Recognation 项目综合技术报告',
+  subtitle: '围绕旋转鲁棒局部特征的 IC 版图识别解决方案，从历程、架构、创新到未来规划的全景梳理。',
+  description: 'RoRD-Layout-Recognation 项目的完整历程、核心技术方案、当前成果与未来规划。',
+  version: '版本 1.3 (完整版)',
+  date: '2025年10月5日',
+  type: '综合技术报告'
+};
+
+const journeyPhases = [
+  {
+    id: 'phase-1',
+    title: '第一阶段：开题与技术选型',
+    period: '2025年6月',
+    summary: '锁定服务设计-工艺协同优化 (DTCO) 的最终目标，完成 RoRD 技术路线的调研与论证。',
+    highlights: [
+      '对 U-Net、YOLO、ViT、SuperPoint、RoRD 等方案开展比选，聚焦版图识别的旋转鲁棒与数据稀缺两大核心痛点。',
+      '确立 “RoRD + 自监督 + 几何约束” 的总体策略，为后续工作奠定方向。'
+    ]
+  },
+  {
+    id: 'phase-2',
+    title: '第二阶段：模型适配与损失函数设计',
+    period: '2025年7月',
+    summary: '针对 IC 版图的几何特性，裁剪 RoRD 模块并构建几何感知损失体系。',
+    highlights: [
+      '移除正交视图生成模块，结合滑动窗口与图像金字塔实现多尺度匹配。',
+      '设计复合损失函数，引导模型学习几何描述子而非纹理特征。'
+    ]
+  },
+  {
+    id: 'phase-3',
+    title: '第三阶段：架构现代化与性能提升',
+    period: '2025年9月',
+    summary: '全面工程化改造，提升项目可维护性、实验效率与推理速度。',
+    highlights: [
+      '引入 FPN 与 NMS，大幅度提升多尺度匹配效率。',
+      '采用 YAML 配置 + 模块解耦策略，结合 TensorBoard 构建实验追踪闭环。'
+    ]
+  },
+  {
+    id: 'phase-4',
+    title: '当前状态：技术成熟与可扩展性',
+    period: '2025年10月',
+    summary: '核心组件稳定运行，具备大规模实验与快速应用的工程能力。',
+    highlights: [
+      'FPN、NMS、配置中心、模块化代码、实验追踪等特性均已落地。',
+      '进入持续优化与学术成果产出的关键阶段。'
+    ]
+  }
+];
+
+const publicationPlan = {
+  headers: ['目标会议', '投稿截止 (预计)', '结果通知 (预计)', '会议召开 (预计)', '策略说明'],
+  rows: [
+    ['ICCAD 2026', '2026年5月中下旬', '2026年8月上旬', '2026年10月底', '首要目标，窗口合适，聚焦旋转鲁棒识别创新。'],
+    ['DATE 2027', '2026年9月中旬', '2026年12月中旬', '2027年3-4月', 'Plan A：若 ICCAD 未中，依据评审意见快速迭代。'],
+    ['DAC 2027', '2026年11月中下旬', '2027年2月底', '2027年6-7月', 'Plan B：留出 3 个月强化实验与对比。'],
+    ['ASP-DAC 2028', '2027年7月中旬', '2027年10月中旬', '2028年1月下旬', '进一步打磨模型与工业验证的备选路径。'],
+    ['IEEE TCAD', '滚动', '-', '-', '最终方案：若多轮会议未果，汇总为期刊稿件。']
+  ]
+};
+
+const futureRoadmap = [
+  {
+    title: '数据策略 (高优先级)',
+    items: [
+      '引入弹性变形与版图缺陷模拟，真实再现制造侧形变。',
+      '实现程序化版图生成器 (gdstk)，构造大规模合成数据集。'
+    ]
+  },
+  {
+    title: '训练策略 (高优先级)',
+    items: [
+      '引入基于不确定度的损失权重自动加权，动态平衡多任务目标。',
+      '强化困难样本采样策略，提升描述子学习效率。'
+    ]
+  },
+  {
+    title: '模型架构 (中优先级)',
+    items: [
+      '尝试 ResNet / EfficientNet 等现代骨干网络替代 VGG。',
+      '探索注意力机制，引导模型聚焦关键几何结构。'
+    ]
+  }
+];
+
+const resourceGuidance = {
+  headers: ['资源类型', '需求规格', '说明'],
+  rows: [
+    ['数据集（启动阶段）', '100-200 张', '高分辨率版图，完成功能验证。'],
+    ['数据集（初步可用）', '1,000-2,000 张', '学习稳定的几何描述子。'],
+    ['数据集（生产级）', '5,000-10,000+ 张', '覆盖多工艺、多设计风格。'],
+    ['GPU（入门级）', 'RTX 3060 / 4060', '小规模试验、功能验证。'],
+    ['GPU（主流级）', 'RTX 3080 / 4070', '推荐配置，兼顾效率与成本。'],
+    ['GPU（专业级）', 'RTX 3090 / 4090 / A6000', '大规模实验或生产部署。'],
+    ['显存需求', '≥ 12 GB', 'Batch Size = 8，Patch = 256×256。'],
+    ['CPU / 内存', '8 核 / 32 GB', '确保数据预处理不成瓶颈。']
+  ]
+};
+
+const timeEstimation = {
+  headers: ['训练阶段', '时间估算', '说明'],
+  rows: [
+    ['单个 Epoch', '15-25 分钟', 'RTX 3080，2000 张图像。'],
+    ['总训练时间', '约 16.7 小时', '50 Epoch @ 20 分钟 / Epoch。'],
+    ['实际收敛时间', '10-20 小时', '启用早停 (patience = 10)。'],
+    ['数据增强调优', '1-2 周', '调节尺度、亮度、噪声参数。'],
+    ['损失函数权重', '1-2 周', '平衡 BCE / Triplet / Manhattan 等。'],
+    ['超参数搜索', '2-4 周', '学习率、批大小、优化器。'],
+    ['模型架构微调', '2-4 周', '测试不同骨干与注意力模块。'],
+    ['总调优时间', '1.5-3 个月', '达到生产级部署标准。']
+  ]
+};
+
+// 代码示例静态对象
+const codeExamples = {
+  fpnForward: {
+    title: "FPN 前向推理",
+    language: "python",
+    showLineNumbers: true,
+    code: `def forward(self, x: torch.Tensor, return_pyramid: bool = False):
+  if not return_pyramid:
+    features = self.backbone(x)
+    detection_map = self.detection_head(features)
+    descriptors = self.descriptor_head(features)
+    return detection_map, descriptors
+
+  c2, c3, c4 = self._extract_c234(x)
+  p4 = self.lateral_c4(c4)
+  p3 = self.lateral_c3(c3) + F.interpolate(p4, size=c3.shape[-2:], mode="nearest")
+  p2 = self.lateral_c2(c2) + F.interpolate(p3, size=c2.shape[-2:], mode="nearest")
+
+  p4 = self.smooth_p4(p4)
+  p3 = self.smooth_p3(p3)
+  p2 = self.smooth_p2(p2)
+
+  pyramid = {}
+  if 4 in self.fpn_levels:
+    pyramid['P4'] = (self.det_head_fpn(p4), self.desc_head_fpn(p4), 8)
+  if 3 in self.fpn_levels:
+    pyramid['P3'] = (self.det_head_fpn(p3), self.desc_head_fpn(p3), 4)
+  if 2 in self.fpn_levels:
+    pyramid['P2'] = (self.det_head_fpn(p2), self.desc_head_fpn(p2), 2)
+  return pyramid`
+  },
+  geometricLoss: {
+    title: "几何感知损失实现",
+    language: "python",
+    showLineNumbers: true,
+    code: `def compute_description_loss(desc_original, desc_rotated, H, margin=1.0):
+  # 旋转一致性与困难负样本挖掘
+  negative_list = []
+  for angle in [90, 180, 270]:
+    rotated_coords = rotate_coords(manhattan_coords, angle)
+    negative_list.append(rotated_coords)
+
+  geometric_triplet = triplet_loss(anchor, positive, hardest_negative)
+  manhattan_loss = compute_manhattan_alignment(anchor, positive)
+  sparsity_loss = torch.mean(torch.abs(anchor)) + torch.mean(torch.abs(positive))
+  binary_loss = torch.mean(torch.abs(torch.sign(anchor) - torch.sign(positive)))
+
+  return geometric_triplet + 0.1 * manhattan_loss + 0.01 * sparsity_loss + 0.05 * binary_loss`
+  },
+  trainingLoop: {
+    title: "自监督训练循环",
+    language: "python",
+    showLineNumbers: true,
+    code: `for epoch in range(epochs):
+  model.train()
+  for original, rotated, H in train_dataloader:
+    original, rotated, H = original.cuda(), rotated.cuda(), H.cuda()
+    det_o, desc_o = model(original)
+    det_r, desc_r = model(rotated)
+
+    det_loss = compute_detection_loss(det_o, det_r, H)
+    desc_loss = compute_description_loss(desc_o, desc_r, H)
+    loss = det_loss + desc_loss
+
+    optimizer.zero_grad()
+    loss.backward()
+    torch.nn.utils.clip_grad_norm_(model.parameters(), max_norm=1.0)
+    optimizer.step()
+
+  scheduler.step(validation_metric)
+  if early_stopper.should_stop():
+    break`
+  },
+  pyramidExtraction: {
+    title: "多尺度推理提取",
+    language: "python",
+    showLineNumbers: true,
+    code: `def extract_from_pyramid(model, image_tensor, kp_thresh, nms_cfg):
+  with torch.no_grad():
+    pyramid = model(image_tensor, return_pyramid=True)
+  keypoints, descriptors = [], []
+  for level_name, (det, desc, stride) in pyramid.items():
+    kps, descs = decode_level(det, desc, stride, kp_thresh)
+    if nms_cfg.get('enabled', False):
+      keep = radius_nms(kps, det['scores'], nms_cfg['radius'])
+      kps, descs = kps[keep], descs[keep]
+    keypoints.append(kps)
+    descriptors.append(descs)
+  return torch.cat(keypoints, dim=0), torch.cat(descriptors, dim=0)`
+  },
+  yamlConfig: {
+    title: "configs/base_config.yaml",
+    language: "yaml",
+    showLineNumbers: true,
+    code: `model:
+  backbone: resnet34
+  fpn:
+    enabled: true
+    out_channels: 256
+    levels: [2, 3, 4]
+
+matching:
+  keypoint_threshold: 0.5
+  nms:
+    enabled: true
+    radius: 4
+  min_inliers: 15
+
+logging:
+  use_tensorboard: true
+  log_dir: runs
+  experiment_name: baseline`
+  },
+  projectStructure: {
+    title: "项目目录结构",
+    language: "text",
+    showLineNumbers: false,
+    code: `RoRD-Layout-Recognation/
+├── configs/
+│   └── base_config.yaml      # YAML 配置中心
+├── data/
+│   └── ic_dataset.py         # 数据集定义
+├── docs/                     # 文档目录
+├── models/
+│   └── rord.py               # RoRD 模型 (含 FPN)
+├── utils/                    # 通用工具
+├── losses.py                 # 几何感知损失函数
+├── train.py                  # 训练脚本
+├── evaluate.py               # 评估脚本
+├── match.py                  # 模板匹配脚本
+├── pyproject.toml            # 依赖定义
+└── README.md`
+  },
+  uvWorkflow: {
+    title: "uv 工程流程",
+    language: "bash",
+    showLineNumbers: false,
+    code: `# 安装全部依赖
+uv sync
+
+# 训练管线
+uv run python train.py --config configs/your_exp_config.yaml
+
+# 版图模板匹配
+uv run python match.py \\
+  --config configs/your_exp_config.yaml \\
+  --model_path path/to/model.pth \\
+  --layout path/to/layout.png \\
+  --template path/to/template.png
+
+# 启动 TensorBoard
+uv run tensorboard --logdir runs`
+  },
+  jsonAnnotation: {
+    title: "验证集 JSON 标注",
+    language: "json",
+    showLineNumbers: true,
+    code: `{
+  "boxes": [
+    {"template": "template1.png", "x": 100, "y": 200, "width": 50, "height": 50},
+    {"template": "template2.png", "x": 300, "y": 400, "width": 60, "height": 60}
+  ]
+}`
+  }
+};
+---
+
+<BaseLayout
+  title={`${reportConfig.title} - Jiao77`}
+  description={reportConfig.description}
+  type="report"
+>
+  <Header
+    pageTitle={reportConfig.title}
+    showPageTitle={true}
+    description={reportConfig.subtitle}
+  />
+
+  <main class="report-main">
+    <div class="report-layout container mx-auto px-4">
+      <ReportSidebar title="报告目录" toggleLabel="目录" />
+      <div class="report-content" data-report-content>
+
+        <!-- 报告标题区域 -->
+        <section id="intro" class="report-header scroll-mt-16">
+          <AnimatedElement animation="fadeInUp" delay={SECTION_DELAYS.HERO} trigger="load">
+            <Container
+              variant="glass"
+              size="full"
+              padding="xl"
+              className="text-center mb-12 mt-24"
+            >
+              <p class="text-sm font-medium text-gray-500 mb-3">{reportConfig.version}</p>
+              <h1 class="text-4xl md:text-5xl font-extrabold mb-4 text-[#3d5366]">
+                {reportConfig.title}
+              </h1>
+              <p class="text-lg text-[#4a5f75] max-w-3xl mx-auto mb-6">
+                {reportConfig.subtitle}
+              </p>
+              <div class="flex flex-wrap items-center justify-center gap-4 text-sm text-[#5a7186]">
+                <span class="flex items-center gap-2">
+                  <i class="fas fa-calendar-alt"></i>
+                  {reportConfig.date}
+                </span>
+                <span class="flex items-center gap-2">
+                  <i class="fas fa-file-alt"></i>
+                  {reportConfig.type}
+                </span>
+              </div>
+            </Container>
+          </AnimatedElement>
+        </section>
+
+        <!-- 项目概述 -->
+        <AnimatedElement animation="fadeInUp" delay={SECTION_DELAYS.OVERVIEW} trigger="scroll">
+          <section id="overview">
+            <ReportSection
+              title="1. 项目概述"
+              subtitle="RoRD-Layout-Recognation：面向 IC 版图识别的旋转鲁棒方案"
+              level={2}
+            >
+              <div class="space-y-10 text-[#4a5f75] leading-relaxed">
+                <div>
+                  <p class="mb-4">
+                    <strong>RoRD-Layout-Recognation</strong> 致力于通过深度改造 RoRD (Rotation-Robust Descriptors) 模型，构建一套对 IC 版图模板具备高精度、低延迟、零/少样本能力的识别系统，为设计-工艺协同优化 (DTCO) 提供自动化支撑。
+                  </p>
+                </div>
+
+                <div>
+                  <h3 class="section-subtitle">1.1 项目目标</h3>
+                  <ul class="space-y-3">
+                    <li><strong>高精度模板匹配：</strong> 在复杂版图中准确定位所有模板实例及其 8 种方向与尺度。</li>
+                    <li><strong>高效率推理能力：</strong> 针对大尺寸 GDSII 版图实现近实时匹配，加速工业落地。</li>
+                    <li><strong>零/少样本泛化：</strong> 支持新模板的快速识别，减少大规模标注依赖。</li>
+                    <li><strong>标准化研发流程：</strong> 构建数据准备、训练、调参与评估的完整可复现实验管线。</li>
+                  </ul>
+                </div>
+
+                <div>
+                  <h3 class="section-subtitle">1.2 主要困难与挑战</h3>
+                  <ul class="space-y-3">
+                    <li><strong>数据稀缺：</strong> 高质量标注版图昂贵且难获取，限制了监督式方法。</li>
+                    <li><strong>几何多变：</strong> 模板存在旋转与镜像的全方向变化，要求描述子具备高度鲁棒性。</li>
+                    <li><strong>结构复杂：</strong> 版图呈现曼哈顿网格、二值稀疏特征与大量重复结构，区别于自然图像。</li>
+                    <li><strong>快速演进：</strong> 工艺与 IP 库持续更新，模型需具备持续适配能力。</li>
+                  </ul>
+                </div>
+              </div>
+            </ReportSection>
+          </section>
+        </AnimatedElement>
+
+        <!-- 项目历程 -->
+        <AnimatedElement animation="fadeInUp" delay={SECTION_DELAYS.JOURNEY} trigger="scroll">
+          <section id="journey">
+            <ReportSection
+              title="2. 项目历程与当前状态"
+              subtitle="从选型破题到工程化落地的完整路径"
+              level={2}
+            >
+              <div class="grid md:grid-cols-2 gap-6">
+                {journeyPhases.map((phase, index) => (
+                  <AnimatedElement
+                    animation="fadeInUp"
+                    delay={getChildDelay(SECTION_DELAYS.JOURNEY, index)}
+                    trigger="scroll"
+                  >
+                    <Container variant="glass" padding="lg" className="journey-card">
+                      <div class="flex items-start justify-between gap-4 mb-3">
+                        <h3 class="text-xl font-bold text-[#526b83]">{phase.title}</h3>
+                        <span class="text-sm font-medium text-gray-500">{phase.period}</span>
+                      </div>
+                      <p class="text-[#4a5f75] mb-3">{phase.summary}</p>
+                      <ul class="space-y-2 text-[#5a7186]">
+                        {phase.highlights.map(point => (
+                          <li class="flex gap-2">
+                            <span class="text-[#6b88a5] font-semibold">•</span>
+                            <span>{point}</span>
+                          </li>
+                        ))}
+                      </ul>
+                    </Container>
+                  </AnimatedElement>
+                ))}
+              </div>
+            </ReportSection>
+          </section>
+        </AnimatedElement>
+
+        <!-- 技术实现 -->
+        <AnimatedElement animation="fadeInUp" delay={SECTION_DELAYS.TECHNOLOGY} trigger="scroll">
+          <section id="technology">
+            <ReportSection
+              title="3. 技术实现与创新点"
+              subtitle="旋转鲁棒、多尺度特征与几何约束的深度融合"
+              level={2}
+            >
+              <div class="space-y-12 text-[#4a5f75] leading-relaxed">
+                <Container variant="glass" padding="lg" className="tech-block">
+                  <h3 class="block-title">3.1 模型架构：从 VGG 到 FPN</h3>
+                  <p class="mb-4">模型采用残差网络骨干，并行关键点检测头与描述子生成头。通过引入特征金字塔网络 (FPN)，实现单次前向即可获得多尺度特征 (P2 / P3 / P4)。</p>
+                  <ul class="space-y-2 mb-4">
+                    <li><strong>横向连接：</strong> 将 backbone 的 C2 / C3 / C4 特征映射至统一通道数。</li>
+                    <li><strong>自顶向下融合：</strong> 通过上采样与逐层平滑构建金字塔，避免尺度偏移。</li>
+                    <li><strong>共享头部：</strong> 在各层共享检测头与描述子头，提升效率与一致性。</li>
+                  </ul>
+          <CodeBlock
+            title={codeExamples.fpnForward.title}
+            language={codeExamples.fpnForward.language}
+            showLineNumbers={codeExamples.fpnForward.showLineNumbers}
+            code={codeExamples.fpnForward.code}
+          />
+                </Container>
+
+                <Container variant="glass" padding="lg" className="tech-block">
+                  <h3 class="block-title">3.2 核心创新：几何感知损失函数</h3>
+                  <p class="mb-3">为了引导模型学习几何结构而非纹理，我们构建了检测损失与描述子损失的复合体系：</p>
+                  <div class="space-y-3">
+                    <MathFormula formula="L_{\text{total}} = L_{\text{det}} + L_{\text{desc}}" />
+                    <MathFormula formula="L_{\text{det}} = \operatorname{BCE}(D_{\text{o}}, \mathcal{W}(D_{\text{r}}, H^{-1})) + 0.1\,\operatorname{SmoothL1}(D_{\text{o}}, \mathcal{W}(D_{\text{r}}, H^{-1}))" />
+                    <MathFormula formula="L_{\text{desc}} = L_{\text{triplet}} + 0.1L_{\text{manhattan}} + 0.01L_{\text{sparse}} + 0.05L_{\text{binary}}" />
+                  </div>
+                  <ul class="space-y-2 mt-4">
+                    <li><strong>L<sub>triplet</sub>：</strong> 采用 L1 范数的几何 Triplet Loss，突出旋转一致性。</li>
+                    <li><strong>L<sub>manhattan</sub>：</strong> 约束 90° 旋转后的描述子一致，解决重复结构混淆。</li>
+                    <li><strong>L<sub>sparse</sub>：</strong> 稀疏化正则抑制空白区域噪声。</li>
+                    <li><strong>L<sub>binary</sub>：</strong> 基于符号的一致性，强化几何边界表达。</li>
+                  </ul>
+          <CodeBlock
+            className="mt-4"
+            title={codeExamples.geometricLoss.title}
+            language={codeExamples.geometricLoss.language}
+            showLineNumbers={codeExamples.geometricLoss.showLineNumbers}
+            code={codeExamples.geometricLoss.code}
+          />
+                </Container>
+
+                <Container variant="glass" padding="lg" className="tech-block">
+                  <h3 class="block-title">3.3 训练策略：自监督与稳定性</h3>
+                  <ul class="space-y-2 mb-4">
+                    <li><strong>自监督框架：</strong> 通过随机几何变换自动生成 (original, rotated, H) 训练对，完全摆脱人工标注。</li>
+                    <li><strong>数据增强：</strong> 组合尺度抖动、Sobel 边缘增强、亮度对比度调整、高斯噪声等策略。</li>
+                    <li><strong>稳定性机制：</strong> 采用梯度裁剪、早停与 ReduceLROnPlateau 学习率调度，确保训练可控。</li>
+                  </ul>
+          <CodeBlock
+            title={codeExamples.trainingLoop.title}
+            language={codeExamples.trainingLoop.language}
+            showLineNumbers={codeExamples.trainingLoop.showLineNumbers}
+            code={codeExamples.trainingLoop.code}
+          />
+                </Container>
+
+                <Container variant="glass" padding="lg" className="tech-block">
+                  <h3 class="block-title">3.4 推理与匹配：高效的多实例检测</h3>
+                  <p class="mb-4">推理阶段利用 FPN、多尺度关键点提取、半径 NMS 与 RANSAC，实现快速稳定的多实例匹配。</p>
+                  <ul class="space-y-2 mb-4">
+                    <li><strong>extract_from_pyramid：</strong> 一次性提取所有尺度的关键点与描述子。</li>
+                    <li><strong>radius_nms：</strong> 基于关键点分数与空间距离过滤重复点。</li>
+                    <li><strong>MNN + RANSAC：</strong> 先进行互最近邻匹配，再利用 RANSAC 估计单应矩阵并剔除外点。</li>
+                    <li><strong>多实例循环：</strong> 针对每个模板实例迭代匹配，逐步屏蔽已检测区域。</li>
+                  </ul>
+          <CodeBlock
+            title={codeExamples.pyramidExtraction.title}
+            language={codeExamples.pyramidExtraction.language}
+            showLineNumbers={codeExamples.pyramidExtraction.showLineNumbers}
+            code={codeExamples.pyramidExtraction.code}
+          />
+                </Container>
+
+                <Container variant="glass" padding="lg" className="tech-block">
+                  <h3 class="block-title">3.5 工程化：配置驱动与实验追踪</h3>
+                  <ul class="space-y-2 mb-4">
+                    <li><strong>YAML 配置中心：</strong> 使用 <code>OmegaConf</code> 统一管理 <code>configs/base_config.yaml</code>，实现参数解耦与一键复现实验。</li>
+                    <li><strong>模块化代码：</strong> 数据集 (<code>data/</code>)、损失函数 (<code>losses.py</code>)、模型 (<code>models/</code>) 与工具 (<code>utils/</code>) 独立维护。</li>
+                    <li><strong>TensorBoard 集成：</strong> 训练、评估、匹配脚本均写入关键指标，支持端到端可视化与对比分析。</li>
+                  </ul>
+                  <CodeBlock
+                    title={codeExamples.yamlConfig.title}
+                    language={codeExamples.yamlConfig.language}
+                    showLineNumbers={codeExamples.yamlConfig.showLineNumbers}
+                    code={codeExamples.yamlConfig.code}
+                  />
+                </Container>
+              </div>
+            </ReportSection>
+          </section>
+        </AnimatedElement>
+
+        <!-- 项目成果 -->
+        <AnimatedElement animation="fadeInUp" delay={SECTION_DELAYS.OUTCOMES} trigger="scroll">
+          <section id="outcomes">
+            <ReportSection
+              title="4. 项目成果与预期效果"
+              subtitle="精度、效率、鲁棒性与可扩展性的综合提升"
+              level={2}
+            >
+              <div class="space-y-6 text-[#4a5f75] leading-relaxed">
+                <Container variant="glass" padding="lg">
+                  <h3 class="block-title">当前核心能力</h3>
+                  <ul class="space-y-2">
+                    <li><strong>多实例检测：</strong> 可在大型版图中准确定位同一模板的多个实例。</li>
+                    <li><strong>旋转鲁棒性：</strong> 对 0°-360° 旋转和镜像变换具备稳定识别能力。</li>
+                    <li><strong>高效推理：</strong> FPN 将传统图像金字塔的多次推理精简为单次前向。</li>
+                    <li><strong>可视化评估：</strong> Precision / Recall / F1 指标及调参记录全部纳入 TensorBoard。</li>
+                  </ul>
+                </Container>
+
+                <Container variant="glass" padding="lg">
+                  <h3 class="block-title">预期量化目标</h3>
+                  <ul class="space-y-2">
+                    <li><strong>精度：</strong> 已训练模板或相似风格验证集 F1 ≥ 95%。</li>
+                    <li><strong>速度：</strong> 百万门级版图、单模板匹配时间控制在 1 分钟内 (V100 / A100)。</li>
+                    <li><strong>鲁棒性：</strong> 对轻微线宽变化、金属填充差异保持稳定识别效果。</li>
+                    <li><strong>可扩展性：</strong> 直接匹配新模板时仍保持 ≥ 85% F1，无需重新训练。</li>
+                  </ul>
+                </Container>
+              </div>
+            </ReportSection>
+          </section>
+        </AnimatedElement>
+
+        <!-- 未来规划 -->
+        <AnimatedElement animation="fadeInUp" delay={SECTION_DELAYS.FUTURE} trigger="scroll">
+          <section id="future">
+            <ReportSection
+              title="5. 未来工作与展望"
+              subtitle="技术优化路线与学术产出计划"
+              level={2}
+            >
+              <div class="space-y-10 text-[#4a5f75] leading-relaxed">
+                <div>
+                  <h3 class="section-subtitle">5.1 技术优化路线图</h3>
+                  <div class="grid md:grid-cols-2 gap-6">
+                    {futureRoadmap.map((block, index) => (
+                      <AnimatedElement
+                        animation="fadeInUp"
+                        delay={getChildDelay(SECTION_DELAYS.FUTURE, index)}
+                        trigger="scroll"
+                      >
+                        <Container variant="glass" padding="lg" className="roadmap-card">
+                          <h4 class="text-lg font-semibold text-[#526b83] mb-3">{block.title}</h4>
+                          <ul class="space-y-2">
+                            {block.items.map(item => (
+                              <li class="flex gap-2">
+                                <span class="text-[#6b88a5] font-semibold">•</span>
+                                <span>{item}</span>
+                              </li>
+                            ))}
+                          </ul>
+                        </Container>
+                      </AnimatedElement>
+                    ))}
+                  </div>
+                </div>
+
+                <div>
+                  <h3 class="section-subtitle">5.2 学术产出与论文计划</h3>
+                  <Container variant="glass" padding="lg" className="mb-6">
+                    <h4 class="text-lg font-semibold text-[#526b83] mb-3">论文核心贡献点</h4>
+                    <ol class="list-decimal list-inside space-y-2">
+                      <li>首次将旋转鲁棒局部特征 (RoRD) 引入 IC 版图识别，并验证其在工业场景下的有效性。</li>
+                      <li>提出面向版图几何的复合损失体系，显著提升二值稀疏、重复结构的描述能力。</li>
+                      <li>融合 FPN + NMS 等现代技术，将匹配效率与多实例检测性能提升到实用级别。</li>
+                    </ol>
+                  </Container>
+
+                  <GlassTable
+                    headers={publicationPlan.headers}
+                    rows={publicationPlan.rows}
+                    caption="EDA 领域主要会议投稿计划"
+                  />
+                </div>
+              </div>
+            </ReportSection>
+          </section>
+        </AnimatedElement>
+
+        <!-- 附录 -->
+        <AnimatedElement animation="fadeInUp" delay={SECTION_DELAYS.APPENDIX} trigger="scroll">
+          <section id="appendix">
+            <ReportSection
+              title="6. 附录"
+              subtitle="项目结构、使用指南与数据要求"
+              level={2}
+            >
+              <div class="space-y-10 text-[#4a5f75] leading-relaxed">
+                <div>
+                  <h3 class="section-subtitle">A. 项目结构</h3>
+                  <CodeBlock
+                    title={codeExamples.projectStructure.title}
+                    language={codeExamples.projectStructure.language}
+                    showLineNumbers={codeExamples.projectStructure.showLineNumbers}
+                    code={codeExamples.projectStructure.code}
+                  />
+                </div>
+
+                <div>
+                  <h3 class="section-subtitle">B. 快速使用指南</h3>
+                  <p class="mb-4">推荐使用 <code>uv</code> 管理虚拟环境，按以下步骤启用训练与推理:</p>
+                  <CodeBlock
+                    title={codeExamples.uvWorkflow.title}
+                    language={codeExamples.uvWorkflow.language}
+                    showLineNumbers={codeExamples.uvWorkflow.showLineNumbers}
+                    code={codeExamples.uvWorkflow.code}
+                  />
+                </div>
+
+                <div>
+                  <h3 class="section-subtitle">C. 数据集要求</h3>
+                  <ul class="space-y-2 mb-4">
+                    <li><strong>训练数据：</strong> 仅需大量无标注 PNG 版图，依靠自监督生成训练对。</li>
+                    <li><strong>验证数据：</strong> 提供模板图、版图图与描述模板位置的 JSON 标注。</li>
+                  </ul>
+                  <p class="mb-2">JSON 标注示例：</p>
+                  <CodeBlock
+                    title={codeExamples.jsonAnnotation.title}
+                    language={codeExamples.jsonAnnotation.language}
+                    showLineNumbers={codeExamples.jsonAnnotation.showLineNumbers}
+                    code={codeExamples.jsonAnnotation.code}
+                  />
+                </div>
+
+                <div>
+                  <h3 class="section-subtitle">D. 资源规划建议</h3>
+                  <GlassTable
+                    headers={resourceGuidance.headers}
+                    rows={resourceGuidance.rows}
+                    caption="实验资源配置建议"
+                  />
+                </div>
+
+                <div>
+                  <h3 class="section-subtitle">E. 训练时间评估</h3>
+                  <GlassTable
+                    headers={timeEstimation.headers}
+                    rows={timeEstimation.rows}
+                    caption="关键阶段时间估算"
+                  />
+                </div>
+              </div>
+            </ReportSection>
+          </section>
+        </AnimatedElement>
+
+      </div>
+    </div>
+  </main>
+
+  <Footer />
+</BaseLayout>
+
+<style>
+  .report-layout {
+    display: flex;
+    flex-direction: column;
+    gap: var(--report-sidebar-gap);
+    position: relative;
+    width: 100%;
+  }
+
+  .report-content {
+    position: relative;
+    width: 100%;
+    min-width: 0;
+    margin: 0 auto;
+  }
+
+  .container {
+    max-width: 1200px;
+    width: 100%;
+  }
+
+  .report-header {
+    padding: 4rem 0 2rem 0;
+    text-align: center;
+  }
+
+  .section-subtitle {
+    font-size: 1.25rem;
+    font-weight: 700;
+    color: #526b83;
+    margin-bottom: 1rem;
+  }
+
+  .block-title {
+    font-size: 1.35rem;
+    font-weight: 700;
+    color: #526b83;
+    margin-bottom: 1rem;
+  }
+
+  .tech-block {
+    backdrop-filter: blur(16px);
+  }
+
+  .journey-card {
+    min-height: 220px;
+  }
+
+  .roadmap-card {
+    min-height: 180px;
+  }
+
+  :global(:root) {
+    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
+  }
+
+  @media (min-width: 1280px) {
+    .report-main {
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
+    }
+
+    .report-layout {
+      max-width: var(--max-content-width);
+      margin: 0 auto;
+      position: relative;
+    }
+
+    .report-content {
+      max-width: 100%;
+      width: 100%;
+      margin-left: 0;
+    }
+
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
+    }
+  }
+
+  @media (max-width: 768px) {
+    .section-subtitle {
+      font-size: 1.1rem;
+    }
+  }
+</style>
--- a/src/pages/report/Siemens-EDA-Forum/index.astro
+++ b/src/pages/report/Siemens-EDA-Forum/index.astro
@@ -409,7 +409,7 @@ const images = {
  .report-layout {
    display: flex;
    flex-direction: column;
-    gap: 2.5rem;
+    gap: var(--report-sidebar-gap);
    position: relative;
    width: 100%;
  }
@@ -421,6 +421,20 @@ const images = {
    margin: 0 auto;
  }
  
+  .container {
+    max-width: 1200px;
+    width: 100%;
+  }
+
+  :global(:root) {
+    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
+  }
+  
  .mx-auto {
    margin-left: auto;
    margin-right: auto;
@@ -460,4 +474,33 @@ const images = {
      grid-template-columns: 1fr;
    }
  }
+
+  @media (min-width: 1280px) {
+    .report-main {
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
+    }
+    .report-layout {
+      max-width: var(--max-content-width);
+      margin: 0 auto;
+      position: relative;
+    }
+    .report-content {
+      max-width: 100%;
+      width: 100%;
+      margin-left: 0;
+    }
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
+    }
+  }
 </style>
--- a/src/pages/report/index.astro
+++ b/src/pages/report/index.astro
@@ -113,8 +113,19 @@ import AnimatedElement from '../../components/AnimatedElement.astro';
            size="medium"
          />
        </AnimatedElement>
-        
+
        <AnimatedElement animation="fadeInUp" delay={1300} trigger="scroll">
+          <NavigationCard
+            title="RoRD 综合技术报告"
+            description="RoRD-Layout-Recognation 项目的全景技术综述，覆盖历程、架构创新与未来规划。"
+            href="/report/RoRD-overall/"
+            icon="fas fa-project-diagram"
+            color="secondary"
+            size="large"
+          />
+        </AnimatedElement>
+        
+        <AnimatedElement animation="fadeInUp" delay={1400} trigger="scroll">
          <NavigationCard
            title="📄 报告模板"
            description="技术报告标准模板，包含统一宽度配置、代码展示、数学公式等完整组件支持。快速创建专业报告！"
--- a/src/pages/report/template/index.astro
+++ b/src/pages/report/template/index.astro
@@ -492,10 +492,10 @@ print(quick_sort([3, 6, 8, 10, 1, 2, 1]))`

  /* === 布局样式 === */
  .report-layout {
-    --report-sidebar-width: clamp(260px, 22vw, 320px);
+    --report-sidebar-width: clamp(var(--report-sidebar-min-width), 22vw, var(--report-sidebar-max-width));
    display: flex;
    flex-direction: column;
-    gap: 2.5rem;
+    gap: var(--report-sidebar-gap);
    position: relative;
    width: 100%;
  }
@@ -782,8 +782,13 @@ print(quick_sort([3, 6, 8, 10, 1, 2, 1]))`
   * - 1200px (当前设置，平衡)
   * - 1400px (较宽，适合表格)
   */
-  :root {
+  :global(:root) {
    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
  }
  
  /* 统一宽度类 - 所有内容区域使用相同的最大宽度 */
@@ -802,11 +807,31 @@ print(quick_sort([3, 6, 8, 10, 1, 2, 1]))`

  @media (min-width: 1280px) {
    .report-main {
-      padding-left: clamp(calc(300px + 2.5rem), calc((100vw - 1200px) / 2 + 1rem), calc(320px + 3rem));
-      padding-right: clamp(1rem, calc((100vw - 1200px) / 2 + 1rem), 2rem);
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
+    }
+    .report-layout {
+      max-width: var(--max-content-width);
+      margin: 0 auto;
+      position: relative;
+    }
+    .report-content {
+      max-width: 100%;
+      width: 100%;
+      margin-left: 0;
+    }
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
    }
-    .report-layout { max-width: var(--max-content-width); margin: 0 auto; position: relative; }
-    .report-content { max-width: 100%; width: 100%; margin-left: 0; }
  }

  /* === 工具样式类 === */
--- a/src/pages/report/template/simple.astro
+++ b/src/pages/report/template/simple.astro
@@ -199,9 +199,10 @@ const reportConfig = {

  /* 布局 */
  .report-layout {
+    --report-sidebar-width: clamp(var(--report-sidebar-min-width), 22vw, var(--report-sidebar-max-width));
    display: flex;
    flex-direction: column;
-    gap: 2.5rem;
+    gap: var(--report-sidebar-gap);
    position: relative;
    width: 100%;
  }
@@ -218,6 +219,20 @@ const reportConfig = {
    width: 100%;
  }
  
+  .container {
+    max-width: var(--max-content-width);
+    width: 100%;
+  }
+
+  :global(:root) {
+    --max-content-width: 1200px;
+    --report-sidebar-min-width: 260px;
+    --report-sidebar-base-width: 300px;
+    --report-sidebar-max-width: 320px;
+    --report-sidebar-gap: 2.5rem;
+    --report-content-padding: 1rem;
+  }
+  
  .mx-auto { margin: 0 auto; }
  .px-4 { padding: 0 1rem; }

@@ -414,12 +429,23 @@ const reportConfig = {

  @media (min-width: 1280px) {
    .report-main {
-      padding-left: clamp(calc(300px + 2.5rem), calc((100vw - 1200px) / 2 + 1rem), calc(320px + 3rem));
-      padding-right: clamp(1rem, calc((100vw - 1200px) / 2 + 1rem), 2rem);
+      padding-left: clamp(
+        calc(var(--report-sidebar-base-width) + var(--report-sidebar-gap)),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        calc(var(--report-sidebar-max-width) + 3rem)
+      );
+      padding-right: clamp(
+        var(--report-content-padding),
+        calc((100vw - var(--max-content-width)) / 2 + var(--report-content-padding)),
+        2rem
+      );
    }
-    .report-layout { max-width: 1200px; margin: 0 auto; }
+    .report-layout { max-width: var(--max-content-width); margin: 0 auto; }
    .report-content { max-width: 100%; width: 100%; }
-    .container { padding: 0 1rem; }
+    .container {
+      padding-left: var(--report-content-padding);
+      padding-right: var(--report-content-padding);
+    }
  }

  /* 工具类 */