---
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>