diff --git a/blog/build.py b/blog/build.py
index 23cbcf4..e69bc5f 100644
--- a/blog/build.py
+++ b/blog/build.py
@@ -306,8 +306,8 @@ def build():
     <div class="hero-euler" aria-hidden="true">e<sup>iπ</sup> + 1 = 0</div>
     <div class="container">
       <p class="hero-eyebrow">EASY DATA COLLECTION · SINCOS.CC</p>
-      <h1>让工程与数据，<br>更简单</h1>
-      <p class="hero-sub">工业软件集成 · 标准化管理 · 深度学习实践 —— 从标准件库、科研热榜到自研工具集，把想法持续做成可用的产品。</p>
+      <h1>数字化和人工智能研究与技术落地</h1>
+      <p class="hero-sub">工业软件集成 · 标准化管理 · 深度学习实践</p>
       <div class="hero-actions">
         <a href="/tools/" class="btn btn-light">探索工具开发</a>
         <a href="/research/" class="btn btn-outline-light">前沿技术研究</a>
@@ -377,10 +377,8 @@ def build():
             <a href="/research/neural/" class="btn btn-primary">了解 NeuralMix</a>
           </div>
         </div>
-        <div class="feature-visual" style="--v1:#5b3df5;--v2:#22c8ff">
-          <span class="visual-glyph">◈</span>
-          <span class="visual-chip chip-a">1D-CNN</span>
-          <span class="visual-chip chip-b">0.15s 采样</span>
+        <div class="feature-visual has-image">
+          <img src="/static/img/neural/stability-landscape.png" alt="NeuralMix AI 混合终点判定轨迹">
         </div>
       </div>
     </div>
diff --git a/blog/posts/2026-09-29-website-redesign.md b/blog/posts/2026-09-29-website-redesign.md
new file mode 100644
index 0000000..10d3dbf
--- /dev/null
+++ b/blog/posts/2026-09-29-website-redesign.md
@@ -0,0 +1,80 @@
+---
+title: 站点改版记录：从博客到产品矩阵
+date: 2026-09-29
+tags: 网站改版, 产品矩阵, 设计
+---
+
+今天把 sincos.cc 做了一次完整改版：从「一个博客 + 几个子页」升级成「科技首页 + 前沿技术研究 + 工具开发产品矩阵 + License 中心 + 资源中心」的聚合站。这篇文章把这次更新的内容完整记录下来。
+
+## 一、品牌更名
+
+全站品牌由 **Easy Data Collector** 统一改为 **Easy Data Collection**，与 Lite ERP 等产品的英文全称保持一致，站点定位也从「数据采集」扩展为「数据与工程工具集合」。
+
+## 二、导航重构
+
+导航从原来 7 个平铺入口，重构为 5 个一级入口，其中研究、工具、License 带下拉菜单：
+
+- **前沿技术研究**：Research Digest（国际顶尖科研热榜）、Neural Research（NeuralMix AI）、ResLib（资源中心管理器）
+- **工具开发**：Sequence-Diagram、Uni-Viewer、Engineer Craft、The Five Phases Observer、UniTouch Interface、EDC Lite ERP
+- **资源中心**：私有服务器与服务入口
+- **License**：申请 / 查询下载 / 资源包获取
+- **博客**：本站
+
+## 三、新增页面
+
+这次一口气新增了 10 个页面：
+
+| 页面 | 路径 | 说明 |
+| --- | --- | --- |
+| 前沿技术研究 | `/research/` | 三个研究平台的聚合入口 |
+| 工具开发 | `/tools/` | 产品矩阵总览 + 界面实录 |
+| Sequence-Diagram | `/tools/sequence-diagram/` | 时序图设计器独立介绍页 |
+| Uni-Viewer | `/tools/uni-viewer/` | 文件预览组件独立介绍页 |
+| Engineer Craft | `/tools/engineer-craft/` | 工程设计平台独立介绍页 |
+| The Five Phases Observer | `/tools/five-phases-observer/` | GAP 公理协议独立介绍页 |
+| UniTouch Interface | `/tools/unitouch/` | 工控交互平台独立介绍页 |
+| EDC Lite ERP | `/tools/edc-lite-erp/` | 轻量资源计划系统独立介绍页 |
+| License 中心 | `/license/` | 申请、查询、资源包统一入口 |
+| 资源中心 | `/resources/` | 代码托管与私有服务入口 |
+
+每个工具都有独立的产品页，从 Gitea 仓库的 README 与文档中整理了功能、架构与技术细节；License 的申请、查询下载、资源包获取则合并成一个中心，但保留了三个功能子页。旧路径 `/reslib/*`、`/neural/`、`/links.html` 全部保留兼容。
+
+## 四、首页与全站视觉升级
+
+首页改成科技产品风（参考 Apple 产品页与 Wise 的排版思路）：
+
+- 深色 Hero 区，标题定为「数字化和人工智能研究与技术落地」
+- 研究平台特性区：Research Digest / ResLib / NeuralMix 交替大区块展示
+- 工具开发产品矩阵：6 个产品卡片直达独立页
+- 最新文章、License 与资源中心入口
+- 统一设计系统：大圆角、玻璃拟态导航、渐变按钮、卡片阴影与更克制的中文字体层级
+
+## 五、NeuralMix AI 页面更新到 v2.0
+
+NeuralMix 是更新最频繁的项目，介绍页这次同步到 **v2.0（Redis 高速缓冲 + 实时/静态参数融合 + 边缘计算）**：
+
+- 架构更新：ModbusRTU 0.15s 采集 → Redis 高速缓冲（5 万条 / 保留 7 天，满 500 条或 5s 批量转储）→ TimescaleDB 主库 + MySQL 备库自动回退
+- 特征体系：13 项实时参数（新增贴壁噪音 ZaoYin）+ 12 项批次静态工艺参数融合
+- 开放 API 一览：采集控制、判定配置、批次管理、训练与自动停机接口
+- 支持 Windows / Ubuntu / NVIDIA Jetson (TX2) 边缘部署
+
+并且把仓库里实际运行输出的图表全部用上了，真正做到「有图有真相」：
+
+![模型收敛分析](/static/img/neural/convergence-analysis.png)
+
+![混合终点判定轨迹](/static/img/neural/stability-landscape.png)
+
+还有参数场演化、电压/电流异常检测、运行段聚类、GTU-CNN 训练曲线与混淆矩阵，全部收录在 Neural Research 页面。
+
+## 六、其他更新
+
+- 工具页面全部配上实际界面截图（时序图双视图、文件预览工作台、工控 HMI、工程计算模型）
+- 博客构建脚本同步新导航与新版首页
+- 管理后台密码已更新（不在此记录）
+- 本地预览服务地址：`http://127.0.0.1:8003`
+
+## 小结
+
+这次改版的核心思路是：**把散落的能力收拢成产品矩阵**。研究和工具不再是一个个孤立页面，而是有导航、有分类、有详情、有截图的完整站点。
+
+下一步计划：补充 ResLib 与 EDC Lite ERP 的界面截图，继续跟进各项目的版本更新。
diff --git a/website/static/blog/2026-09-29-website-redesign/index.html b/website/static/blog/2026-09-29-website-redesign/index.html
new file mode 100644
index 0000000..8e62734
--- /dev/null
+++ b/website/static/blog/2026-09-29-website-redesign/index.html
@@ -0,0 +1,195 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
+<title>站点改版记录：从博客到产品矩阵 - 江北的渔夫的空间</title>
+<meta name="description" content="江北的渔夫的空间 —— 工业软件、标准件库与数字化实践分享">
+<meta name="keywords" content="江北的渔夫的空间, Easy Data Collection, ResLib, 资源中心管理器, Creo, 标准零部件库, 数字孪生, 深度学习">
+<link rel="stylesheet" href="/static/css/style.css">
+<link rel="icon" href="/static/img/logo.svg" type="image/svg+xml">
+<script src="/static/js/nav.js"></script>
+</head>
+<body>
+
+<header class="site-header">
+  <div class="container header-inner">
+    <a class="brand" href="/">
+      <img src="/static/img/logo.svg" alt="Easy Data Collection">
+      <span class="brand-name">Easy Data Collection</span>
+    </a>
+    <nav class="main-nav" id="mainNav">
+      <div class="nav-item has-dropdown">
+        <a class="nav-link" href="/research/">前沿技术研究</a>
+        <button class="nav-caret" type="button" aria-label="展开前沿技术研究">▾</button>
+        <div class="dropdown">
+          <a href="http://124.220.63.9:25000">Research Digest</a>
+          <a href="/research/neural/">Neural Research</a>
+          <a href="/research/reslib/">ResLib</a>
+        </div>
+      </div>
+      <div class="nav-item has-dropdown">
+        <a class="nav-link" href="/tools/">工具开发</a>
+        <button class="nav-caret" type="button" aria-label="展开工具开发">▾</button>
+        <div class="dropdown">
+          <a href="/tools/sequence-diagram/">Sequence-Diagram</a>
+          <a href="/tools/uni-viewer/">Uni-Viewer</a>
+          <a href="/tools/engineer-craft/">Engineer Craft</a>
+          <a href="/tools/five-phases-observer/">The Five Phases Observer</a>
+          <a href="/tools/unitouch/">UniTouch Interface</a>
+          <a href="/tools/edc-lite-erp/">EDC Lite ERP</a>
+        </div>
+      </div>
+      <a class="nav-link" href="/resources/">资源中心</a>
+      <div class="nav-item has-dropdown">
+        <a class="nav-link" href="/license/">License</a>
+        <button class="nav-caret" type="button" aria-label="展开License">▾</button>
+        <div class="dropdown">
+          <a href="/license/apply">申请 License</a>
+          <a href="/license/status">查询 / 下载</a>
+          <a href="/license/package">资源包获取</a>
+        </div>
+      </div>
+      <a class="nav-link active" href="/blog/">博客</a>
+    </nav>
+    <button class="nav-toggle" id="navToggle" aria-label="菜单">☰</button>
+  </div>
+</header>
+
+<main>
+  <section class="section">
+    <div class="container narrow">
+      <nav class="breadcrumb"><a href="/">首页</a> / <a href="/blog/">博客</a></nav>
+      <h2 class="section-title">站点改版记录：从博客到产品矩阵</h2>
+      <div class="post-meta"><span class="post-date">2026年09月29日</span><span class="tag">网站改版</span><span class="tag">产品矩阵</span><span class="tag">设计</span></div>
+      <article class="article">
+<p>今天把 sincos.cc 做了一次完整改版：从「一个博客 + 几个子页」升级成「科技首页 + 前沿技术研究 + 工具开发产品矩阵 + License 中心 + 资源中心」的聚合站。这篇文章把这次更新的内容完整记录下来。</p>
+<h2 id="_1">一、品牌更名</h2>
+<p>全站品牌由 <strong>Easy Data Collector</strong> 统一改为 <strong>Easy Data Collection</strong>，与 Lite ERP 等产品的英文全称保持一致，站点定位也从「数据采集」扩展为「数据与工程工具集合」。</p>
+<h2 id="_2">二、导航重构</h2>
+<p>导航从原来 7 个平铺入口，重构为 5 个一级入口，其中研究、工具、License 带下拉菜单：</p>
+<ul>
+<li><strong>前沿技术研究</strong>：Research Digest（国际顶尖科研热榜）、Neural Research（NeuralMix AI）、ResLib（资源中心管理器）</li>
+<li><strong>工具开发</strong>：Sequence-Diagram、Uni-Viewer、Engineer Craft、The Five Phases Observer、UniTouch Interface、EDC Lite ERP</li>
+<li><strong>资源中心</strong>：私有服务器与服务入口</li>
+<li><strong>License</strong>：申请 / 查询下载 / 资源包获取</li>
+<li><strong>博客</strong>：本站</li>
+</ul>
+<h2 id="_3">三、新增页面</h2>
+<p>这次一口气新增了 10 个页面：</p>
+<table>
+<thead>
+<tr>
+<th>页面</th>
+<th>路径</th>
+<th>说明</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td>前沿技术研究</td>
+<td><code>/research/</code></td>
+<td>三个研究平台的聚合入口</td>
+</tr>
+<tr>
+<td>工具开发</td>
+<td><code>/tools/</code></td>
+<td>产品矩阵总览 + 界面实录</td>
+</tr>
+<tr>
+<td>Sequence-Diagram</td>
+<td><code>/tools/sequence-diagram/</code></td>
+<td>时序图设计器独立介绍页</td>
+</tr>
+<tr>
+<td>Uni-Viewer</td>
+<td><code>/tools/uni-viewer/</code></td>
+<td>文件预览组件独立介绍页</td>
+</tr>
+<tr>
+<td>Engineer Craft</td>
+<td><code>/tools/engineer-craft/</code></td>
+<td>工程设计平台独立介绍页</td>
+</tr>
+<tr>
+<td>The Five Phases Observer</td>
+<td><code>/tools/five-phases-observer/</code></td>
+<td>GAP 公理协议独立介绍页</td>
+</tr>
+<tr>
+<td>UniTouch Interface</td>
+<td><code>/tools/unitouch/</code></td>
+<td>工控交互平台独立介绍页</td>
+</tr>
+<tr>
+<td>EDC Lite ERP</td>
+<td><code>/tools/edc-lite-erp/</code></td>
+<td>轻量资源计划系统独立介绍页</td>
+</tr>
+<tr>
+<td>License 中心</td>
+<td><code>/license/</code></td>
+<td>申请、查询、资源包统一入口</td>
+</tr>
+<tr>
+<td>资源中心</td>
+<td><code>/resources/</code></td>
+<td>代码托管与私有服务入口</td>
+</tr>
+</tbody>
+</table>
+<p>每个工具都有独立的产品页，从 Gitea 仓库的 README 与文档中整理了功能、架构与技术细节；License 的申请、查询下载、资源包获取则合并成一个中心，但保留了三个功能子页。旧路径 <code>/reslib/*</code>、<code>/neural/</code>、<code>/links.html</code> 全部保留兼容。</p>
+<h2 id="_4">四、首页与全站视觉升级</h2>
+<p>首页改成科技产品风（参考 Apple 产品页与 Wise 的排版思路）：</p>
+<ul>
+<li>深色 Hero 区，标题定为「数字化和人工智能研究与技术落地」</li>
+<li>研究平台特性区：Research Digest / ResLib / NeuralMix 交替大区块展示</li>
+<li>工具开发产品矩阵：6 个产品卡片直达独立页</li>
+<li>最新文章、License 与资源中心入口</li>
+<li>统一设计系统：大圆角、玻璃拟态导航、渐变按钮、卡片阴影与更克制的中文字体层级</li>
+</ul>
+<h2 id="neuralmix-ai-v20">五、NeuralMix AI 页面更新到 v2.0</h2>
+<p>NeuralMix 是更新最频繁的项目，介绍页这次同步到 <strong>v2.0（Redis 高速缓冲 + 实时/静态参数融合 + 边缘计算）</strong>：</p>
+<ul>
+<li>架构更新：ModbusRTU 0.15s 采集 → Redis 高速缓冲（5 万条 / 保留 7 天，满 500 条或 5s 批量转储）→ TimescaleDB 主库 + MySQL 备库自动回退</li>
+<li>特征体系：13 项实时参数（新增贴壁噪音 ZaoYin）+ 12 项批次静态工艺参数融合</li>
+<li>开放 API 一览：采集控制、判定配置、批次管理、训练与自动停机接口</li>
+<li>支持 Windows / Ubuntu / NVIDIA Jetson (TX2) 边缘部署</li>
+</ul>
+<p>并且把仓库里实际运行输出的图表全部用上了，真正做到「有图有真相」：</p>
+<p><img alt="模型收敛分析" src="/static/img/neural/convergence-analysis.png" /></p>
+<p><img alt="混合终点判定轨迹" src="/static/img/neural/stability-landscape.png" /></p>
+<p>还有参数场演化、电压/电流异常检测、运行段聚类、GTU-CNN 训练曲线与混淆矩阵，全部收录在 Neural Research 页面。</p>
+<h2 id="_5">六、其他更新</h2>
+<ul>
+<li>工具页面全部配上实际界面截图（时序图双视图、文件预览工作台、工控 HMI、工程计算模型）</li>
+<li>博客构建脚本同步新导航与新版首页</li>
+<li>管理后台密码已更新（不在此记录）</li>
+<li>本地预览服务地址：<code>http://127.0.0.1:8003</code></li>
+</ul>
+<h2 id="_6">小结</h2>
+<p>这次改版的核心思路是：<strong>把散落的能力收拢成产品矩阵</strong>。研究和工具不再是一个个孤立页面，而是有导航、有分类、有详情、有截图的完整站点。</p>
+<p>下一步计划：补充 ResLib 与 EDC Lite ERP 的界面截图，继续跟进各项目的版本更新。</p>
+      </article>
+    </div>
+  </section>
+</main>
+
+<footer class="site-footer">
+  <div class="container footer-inner">
+    <div class="footer-brand">
+      <img src="/static/img/logo.svg" alt="">
+      <span>Easy Data Collection</span>
+    </div>
+    <span>Copyright &copy; 2026 Easy Data Collection. All rights reserved.</span>
+    <span class="footer-links">
+      <a href="/resources/">资源中心</a><span class="sep">·</span>
+      <a href="/license/">License</a><span class="sep">·</span>
+      <a href="/admin">管理页面</a><span class="sep">·</span>
+      <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">苏ICP备2026056863号</a>
+    </span>
+  </div>
+</footer>
+
+</body>
+</html>
\ No newline at end of file
diff --git a/website/static/blog/index.html b/website/static/blog/index.html
index a7eadc2..b789969 100644
--- a/website/static/blog/index.html
+++ b/website/static/blog/index.html
@@ -68,6 +68,11 @@
     <div class="container">
       <div class="post-list">
 
+      <a class="post-card" href="/blog/2026-09-29-website-redesign/">
+        <div class="post-meta"><span class="post-date">2026年09月29日</span><span class="tag">网站改版</span><span class="tag">产品矩阵</span><span class="tag">设计</span></div>
+        <h3 class="post-title">站点改版记录：从博客到产品矩阵</h3>
+        <p class="post-excerpt">今天把 sincos.cc 做了一次完整改版：从「一个博客 + 几个子页」升级成「科技首页 + 前沿技术研究 + 工具开发产品矩阵 + License 中心 + 资源中心」的聚合站。这篇文章把这次更新的内容完整记录下来。 一、品牌更名 全站…</p>
+      </a>
       <a class="post-card" href="/blog/2026-08-13-welcome/">
         <div class="post-meta"><span class="post-date">2026年08月13日</span><span class="tag">公告</span><span class="tag">ResLib</span><span class="tag">数字孪生</span></div>
         <h3 class="post-title">博客开张</h3>
diff --git a/website/static/css/style.css b/website/static/css/style.css
index 83ca875..4b852c1 100644
--- a/website/static/css/style.css
+++ b/website/static/css/style.css
@@ -158,7 +158,9 @@ a:hover { color: var(--brand-dark); }
 .hero {
   position: relative; overflow: hidden; color: #fff;
   background: var(--bg-dark);
-  padding: 108px 0 116px;
+  max-width: 1360px; width: calc(100% - 56px);
+  margin: 28px auto 0; border-radius: 26px;
+  padding: 60px 0 68px;
 }
 .hero::before {
   content: ""; position: absolute; inset: 0;
@@ -176,8 +178,8 @@ a:hover { color: var(--brand-dark); }
 }
 .hero .container { position: relative; z-index: 1; }
 .hero h1 {
-  font-size: clamp(2.3rem, 5.2vw, 3.8rem);
-  font-weight: 700; line-height: 1.12; letter-spacing: -0.02em;
+  font-size: clamp(1.7rem, 3vw, 2.5rem);
+  font-weight: 700; line-height: 1.2; letter-spacing: -0.02em;
 }
 .hero-eyebrow {
   display: inline-block; font-size: 0.82rem; font-weight: 600;
@@ -206,14 +208,17 @@ a:hover { color: var(--brand-dark); }
 /* Page hero (sub pages, compact dark) */
 .page-hero {
   position: relative; overflow: hidden; color: #fff;
-  background: var(--grad-dark); padding: 72px 0 76px;
+  background: var(--grad-dark);
+  max-width: 1360px; width: calc(100% - 56px);
+  margin: 28px auto 0; border-radius: 26px;
+  padding: 56px 0 60px;
 }
 .page-hero::after {
   content: ""; position: absolute; width: 640px; height: 640px; right: -220px; top: -320px;
   background: radial-gradient(circle, rgba(34, 200, 255, 0.22) 0%, transparent 68%);
 }
 .page-hero .container { position: relative; z-index: 1; }
-.page-hero h1 { font-size: clamp(1.9rem, 3.6vw, 2.8rem); font-weight: 700; line-height: 1.18; letter-spacing: -0.02em; }
+.page-hero h1 { font-size: clamp(1.6rem, 2.8vw, 2.2rem); font-weight: 700; line-height: 1.22; letter-spacing: -0.02em; }
 .page-hero-sub { max-width: 720px; margin: 16px 0 0; color: rgba(235, 244, 255, 0.8); font-size: 1rem; }
 .page-hero .hero-actions { margin-top: 28px; }
 .page-hero .hero-eyebrow { margin-bottom: 14px; }
@@ -330,6 +335,19 @@ a:hover { color: var(--brand-dark); }
 .product-card .product-link { font-size: 0.9rem; font-weight: 600; color: var(--brand); }
 .product-card .product-meta { font-size: 0.78rem; color: var(--ink-3); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
 
+/* Screenshots & figures */
+.gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 22px; margin-top: 32px; }
+.shot {
+  background: #071022; border: 1px solid var(--line); border-radius: var(--radius);
+  overflow: hidden; box-shadow: var(--shadow); margin: 0;
+}
+.shot img { display: block; width: 100%; height: auto; }
+.shot figcaption { padding: 13px 18px; font-size: 0.86rem; color: var(--ink-2); background: #fff; border-top: 1px solid var(--line); }
+.shot.wide { grid-column: 1 / -1; }
+.shot.contain img { background: #fff; }
+.feature-visual.has-image { padding: 0; background: #071022; }
+.feature-visual.has-image img { width: 100%; height: 100%; min-height: 340px; object-fit: cover; display: block; }
+
 /* Steps */
 .steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 20px; margin-top: 34px; counter-reset: step; }
 .step {
@@ -495,8 +513,8 @@ table.admin .actions { white-space: nowrap; }
 @media (max-width: 720px) {
   .container { padding: 0 18px; }
   .form-row { grid-template-columns: 1fr; }
-  .hero { padding: 76px 0 84px; }
-  .page-hero { padding: 56px 0 60px; }
+  .hero { padding: 44px 0 52px; width: calc(100% - 24px); margin-top: 14px; border-radius: 20px; }
+  .page-hero { padding: 42px 0 46px; width: calc(100% - 24px); margin-top: 14px; border-radius: 20px; }
   .section { padding: 52px 0; }
   .hero-actions .btn { width: 100%; }
   .feature { padding: 44px 0; }
diff --git a/website/static/home.html b/website/static/home.html
index 92e9fb1..8970b17 100644
--- a/website/static/home.html
+++ b/website/static/home.html
@@ -61,8 +61,8 @@
     <div class="hero-euler" aria-hidden="true">e<sup>iπ</sup> + 1 = 0</div>
     <div class="container">
       <p class="hero-eyebrow">EASY DATA COLLECTION · SINCOS.CC</p>
-      <h1>让工程与数据，<br>更简单</h1>
-      <p class="hero-sub">工业软件集成 · 标准化管理 · 深度学习实践 —— 从标准件库、科研热榜到自研工具集，把想法持续做成可用的产品。</p>
+      <h1>数字化和人工智能研究与技术落地</h1>
+      <p class="hero-sub">工业软件集成 · 标准化管理 · 深度学习实践</p>
       <div class="hero-actions">
         <a href="/tools/" class="btn btn-light">探索工具开发</a>
         <a href="/research/" class="btn btn-outline-light">前沿技术研究</a>
@@ -132,10 +132,8 @@
             <a href="/research/neural/" class="btn btn-primary">了解 NeuralMix</a>
           </div>
         </div>
-        <div class="feature-visual" style="--v1:#5b3df5;--v2:#22c8ff">
-          <span class="visual-glyph">◈</span>
-          <span class="visual-chip chip-a">1D-CNN</span>
-          <span class="visual-chip chip-b">0.15s 采样</span>
+        <div class="feature-visual has-image">
+          <img src="/static/img/neural/stability-landscape.png" alt="NeuralMix AI 混合终点判定轨迹">
         </div>
       </div>
     </div>
@@ -202,6 +200,11 @@
       <h2 class="section-title">最新文章</h2>
       <div class="post-list">
 
+      <a class="post-card" href="/blog/2026-09-29-website-redesign/">
+        <div class="post-meta"><span class="post-date">2026年09月29日</span></div>
+        <h3 class="post-title">站点改版记录：从博客到产品矩阵</h3>
+        <p class="post-excerpt">今天把 sincos.cc 做了一次完整改版：从「一个博客 + 几个子页」升级成「科技首页 + 前沿技术研究 + 工具开发产品矩阵 + License 中心 + 资源中心」的聚合站…</p>
+      </a>
       <a class="post-card" href="/blog/2026-08-13-welcome/">
         <div class="post-meta"><span class="post-date">2026年08月13日</span></div>
         <h3 class="post-title">博客开张</h3>
diff --git a/website/static/img/engineer/xf.png b/website/static/img/engineer/xf.png
new file mode 100644
index 0000000..4099f95
Binary files /dev/null and b/website/static/img/engineer/xf.png differ
diff --git a/website/static/img/engineer/zcxl.png b/website/static/img/engineer/zcxl.png
new file mode 100644
index 0000000..debf821
Binary files /dev/null and b/website/static/img/engineer/zcxl.png differ
diff --git a/website/static/img/neural/anomaly-detection.png b/website/static/img/neural/anomaly-detection.png
new file mode 100644
index 0000000..10c7c77
Binary files /dev/null and b/website/static/img/neural/anomaly-detection.png differ
diff --git a/website/static/img/neural/cluster-analysis.png b/website/static/img/neural/cluster-analysis.png
new file mode 100644
index 0000000..9375e5d
Binary files /dev/null and b/website/static/img/neural/cluster-analysis.png differ
diff --git a/website/static/img/neural/convergence-analysis.png b/website/static/img/neural/convergence-analysis.png
new file mode 100644
index 0000000..6d8dd3e
Binary files /dev/null and b/website/static/img/neural/convergence-analysis.png differ
diff --git a/website/static/img/neural/gtu-confusion.png b/website/static/img/neural/gtu-confusion.png
new file mode 100644
index 0000000..f02ca25
Binary files /dev/null and b/website/static/img/neural/gtu-confusion.png differ
diff --git a/website/static/img/neural/gtu-training.png b/website/static/img/neural/gtu-training.png
new file mode 100644
index 0000000..a70b9b4
Binary files /dev/null and b/website/static/img/neural/gtu-training.png differ
diff --git a/website/static/img/neural/parameter-field.png b/website/static/img/neural/parameter-field.png
new file mode 100644
index 0000000..8214a58
Binary files /dev/null and b/website/static/img/neural/parameter-field.png differ
diff --git a/website/static/img/neural/stability-landscape.png b/website/static/img/neural/stability-landscape.png
new file mode 100644
index 0000000..b484784
Binary files /dev/null and b/website/static/img/neural/stability-landscape.png differ
diff --git a/website/static/img/sequence/bar-timing-light.png b/website/static/img/sequence/bar-timing-light.png
new file mode 100644
index 0000000..22c8ca1
Binary files /dev/null and b/website/static/img/sequence/bar-timing-light.png differ
diff --git a/website/static/img/sequence/bar-timing.png b/website/static/img/sequence/bar-timing.png
new file mode 100644
index 0000000..71af7a2
Binary files /dev/null and b/website/static/img/sequence/bar-timing.png differ
diff --git a/website/static/img/sequence/circular-timing.png b/website/static/img/sequence/circular-timing.png
new file mode 100644
index 0000000..9254276
Binary files /dev/null and b/website/static/img/sequence/circular-timing.png differ
diff --git a/website/static/img/sequence/unit-settings.png b/website/static/img/sequence/unit-settings.png
new file mode 100644
index 0000000..1f01c95
Binary files /dev/null and b/website/static/img/sequence/unit-settings.png differ
diff --git a/website/static/img/uni-viewer/cad.webp b/website/static/img/uni-viewer/cad.webp
new file mode 100644
index 0000000..1a9ed86
Binary files /dev/null and b/website/static/img/uni-viewer/cad.webp differ
diff --git a/website/static/img/uni-viewer/demo-desktop.webp b/website/static/img/uni-viewer/demo-desktop.webp
new file mode 100644
index 0000000..92ed324
Binary files /dev/null and b/website/static/img/uni-viewer/demo-desktop.webp differ
diff --git a/website/static/img/uni-viewer/demo-mobile.webp b/website/static/img/uni-viewer/demo-mobile.webp
new file mode 100644
index 0000000..29e3348
Binary files /dev/null and b/website/static/img/uni-viewer/demo-mobile.webp differ
diff --git a/website/static/img/uni-viewer/presentation.webp b/website/static/img/uni-viewer/presentation.webp
new file mode 100644
index 0000000..0e92ed8
Binary files /dev/null and b/website/static/img/uni-viewer/presentation.webp differ
diff --git a/website/static/img/uni-viewer/spreadsheet.webp b/website/static/img/uni-viewer/spreadsheet.webp
new file mode 100644
index 0000000..c611f2b
Binary files /dev/null and b/website/static/img/uni-viewer/spreadsheet.webp differ
diff --git a/website/static/img/uni-viewer/word.webp b/website/static/img/uni-viewer/word.webp
new file mode 100644
index 0000000..0b1223b
Binary files /dev/null and b/website/static/img/uni-viewer/word.webp differ
diff --git a/website/static/img/unitouch/hmi-dark.png b/website/static/img/unitouch/hmi-dark.png
new file mode 100644
index 0000000..1bd6fd6
Binary files /dev/null and b/website/static/img/unitouch/hmi-dark.png differ
diff --git a/website/static/img/unitouch/hmi-light.png b/website/static/img/unitouch/hmi-light.png
new file mode 100644
index 0000000..6e246e0
Binary files /dev/null and b/website/static/img/unitouch/hmi-light.png differ
diff --git a/website/static/neural.html b/website/static/neural.html
index f7989d9..3d90b30 100644
--- a/website/static/neural.html
+++ b/website/static/neural.html
@@ -3,9 +3,9 @@
 <head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
-<title>Neural Research - NeuralMix AI | Easy Data Collection</title>
-<meta name="description" content="NeuralMix AI —— 面向工业混合机的智能终点判定系统：ModbusRTU 高速采集、TimescaleDB 时序存储、1D-CNN 深度学习实时评估混合均匀度，参数持续稳定即判定混合完成。">
-<meta name="keywords" content="NeuralMix, 混合终点判定, 1D CNN, TimescaleDB, ModbusRTU, 深度学习, 工业智能">
+<title>Neural Research - NeuralMix AI v2.0 | Easy Data Collection</title>
+<meta name="description" content="NeuralMix AI v2.0 —— 面向工业混合机的智能终点判定系统：ModbusRTU 高速采集、Redis 高速缓冲、TimescaleDB 时序存储、实时 + 静态工艺参数融合的 1D-CNN 模型，支持 Windows / Ubuntu / NVIDIA Jetson 边缘部署。">
+<meta name="keywords" content="NeuralMix, 混合终点判定, 1D CNN, Redis, TimescaleDB, ModbusRTU, 深度学习, 边缘计算, Jetson">
 <link rel="stylesheet" href="/static/css/style.css">
 <link rel="icon" href="/static/img/logo.svg" type="image/svg+xml">
 <script src="/static/js/nav.js"></script>
@@ -59,16 +59,17 @@
 <main>
   <section class="page-hero">
     <div class="container">
-      <p class="hero-eyebrow">前沿技术研究 · DEEP LEARNING</p>
+      <p class="hero-eyebrow">前沿技术研究 · DEEP LEARNING · V2.0</p>
       <h1>NeuralMix AI<br>混合终点卷积判断引擎</h1>
-      <p class="page-hero-sub">面向工业混合机（搅拌机）的智能终点判定系统：ModbusRTU 高速采集 → Redis 高速缓冲 → TimescaleDB 时序存储 → 1D-CNN 深度学习实时评估混合均匀度，参数持续稳定即判定混合完成（提示 / 自动停机）。</p>
+      <p class="page-hero-sub">面向工业混合机（搅拌机）的智能终点判定系统：ModbusRTU 高速采集 → Redis 高速缓冲 → TimescaleDB 时序存储 → 实时特征 + 静态工艺参数融合的 1D-CNN 模型实时评估混合均匀度，参数持续稳定即判定混合完成（提示 / 自动停机）。</p>
       <div class="hero-actions">
         <a href="http://124.220.63.9:30000/admin/NeuralMix" class="btn btn-light">项目主页（Gitea）</a>
         <a href="/research/" class="btn btn-outline-light">返回前沿技术研究</a>
       </div>
       <div class="hero-stats">
         <div class="hero-stat"><b>0.15s</b><span>ModbusRTU 采样周期</span></div>
-        <div class="hero-stat"><b>1D-CNN</b><span>实时 + 静态参数融合</span></div>
+        <div class="hero-stat"><b>13 + 12</b><span>实时参数 + 静态工艺参数</span></div>
+        <div class="hero-stat"><b>v2.0</b><span>Redis 缓冲 · 边缘计算架构</span></div>
         <div class="hero-stat"><b>3</b><span>Windows / Ubuntu / Jetson</span></div>
       </div>
     </div>
@@ -77,34 +78,74 @@
   <section class="section">
     <div class="container">
       <h2 class="section-title">系统架构</h2>
+      <p class="section-desc">采集、缓冲、存储、判定、控制构成完整数据闭环，部署在 Windows / Ubuntu / NVIDIA Jetson 边缘计算机上。</p>
       <div class="grid">
-        <div class="card"><div class="icon">⇅</div><h3>数据采集</h3><p>ModbusRTU 串口 0.15s 高速采样变频器 / 电机运行数据，切片先进 Redis 再批量转储 SQL，防高频写库崩溃。</p></div>
+        <div class="card"><div class="icon">⇅</div><h3>高速采集</h3><p>ModbusRTU 串口 0.15s 轮询变频器 / 电机，13 项实时参数（新增贴壁噪音 ZaoYin）；采集规则可配置（如 SuDu &gt; 0 才采集），支持串口扫描与自动探测。</p></div>
+        <div class="card"><div class="icon">⚡</div><h3>Redis 高速缓冲</h3><p>切片先进 Redis（List，上限 5 万条 / 保留 7 天）防高频直写 SQL 崩溃；满 500 条或 5s 批量转储，成功才清缓冲；Redis 不可用自动回退内存缓冲直写。</p></div>
         <div class="card"><div class="icon">▤</div><h3>时序存储</h3><p>TimescaleDB 超表按天分块、自动保留 2 年、可压缩；MySQL 备份库与主库失败自动回退，数据双保险。</p></div>
-        <div class="card"><div class="icon">◈</div><h3>深度学习判定</h3><p>StabilityPredictor（1D-CNN 回归，50 点滑窗 + 批次静态工艺参数融合）输出稳定度分数，参数持续稳定即判定混合完成。</p></div>
-        <div class="card"><div class="icon">⌥</div><h3>本地视窗</h3><p>NeuralMix AI.exe 免安装运行，局域网连接采集端实时监控、在线重训练、数据库管理一应俱全。</p></div>
+        <div class="card"><div class="icon">◈</div><h3>实时判定</h3><p>MixingMonitor 以卷积 8 项实时特征 + 12 项批次静态参数推理稳定度分数；阈值 + 连续稳定（收敛制）双条件判定，STOP 可联动 Modbus 自动停机。</p></div>
+        <div class="card"><div class="icon">◍</div><h3>边缘部署</h3><p>Windows / Ubuntu / NVIDIA Jetson (TX2) 均可作采集端；GPU 优先（CUDA / MPS），无 GPU 自动回退 CPU，Jetson 可只做采集 + 推理。</p></div>
+        <div class="card"><div class="icon">⌥</div><h3>本地视窗</h3><p>NeuralMix AI.exe 免安装运行，7+1 页签（采集控制 / 实时监控 / 混合判定 / 模型训练 / 数据概览 / 数据库管理 / 反馈记录 + 启动屏），局域网 HTTP 远程控制。</p></div>
       </div>
     </div>
   </section>
 
   <section class="section section-alt">
     <div class="container">
-      <h2 class="section-title">核心模型</h2>
-      <div class="grid">
-        <div class="card"><div class="icon">◉</div><h3>StabilityPredictor</h3><p>1D-CNN 回归模型，50 点滑窗输入，输出混合稳定度分数；阈值 + 最短稳定时间双条件判定，支持在线重训练与 A/B 对比。</p></div>
-        <div class="card"><div class="icon">✧</div><h3>GTUCNN1D</h3><p>门控 tanh 单元 + CNN 结构，运行状态分类（正转 / 反转 / 待机 / 空闲），实测 F1 分数约 0.958。</p></div>
-        <div class="card"><div class="icon">◈</div><h3>异常检测与聚类</h3><p>IsolationForest 异常检测 + KMeans / DBSCAN 运行段聚类，辅助分析混合过程异常工况。</p></div>
-        <div class="card"><div class="icon">⌕</div><h3>反馈闭环</h3><p>操作工停机反馈采集 → 阈值自动建议，数据驱动模型持续优化，让判定越来越准。</p></div>
+      <h2 class="section-title">运行图表实录</h2>
+      <p class="section-desc">以下均为系统实际输出的模型分析与判定图表。</p>
+      <div class="gallery">
+        <figure class="shot wide">
+          <img src="/static/img/neural/convergence-analysis.png" alt="NeuralMix AI 模型收敛分析">
+          <figcaption>模型收敛分析 —— 损失函数收敛、平均绝对误差（MAE 0.044）、对数尺度收敛、收敛加速度、训练-验证差距（过拟合风险）与判定分数分布。</figcaption>
+        </figure>
+        <figure class="shot wide">
+          <img src="/static/img/neural/stability-landscape.png" alt="混合终点判定轨迹 - 稳定度收敛分析">
+          <figcaption>混合终点判定轨迹 —— 稳定度分数实时曲线、判定阈值 0.85 与 STOP 触发点（样本 88）。</figcaption>
+        </figure>
+        <figure class="shot">
+          <img src="/static/img/neural/parameter-field.png" alt="运行段参数场演化">
+          <figcaption>运行段参数场演化 —— 转速 / 电流 / 转矩 / 功率 / 频率 / 电压的 z-score 归一化时序场（±3σ 截断）。</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/neural/anomaly-detection.png" alt="异常检测 - 直流母线电压与电流分布">
+          <figcaption>异常检测 —— 直流母线电压 / 运行电流分布与尖峰阈值（IsolationForest 辅助分析）。</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/neural/cluster-analysis.png" alt="运行段聚类分析">
+          <figcaption>运行段聚类 —— K-Means（K=3）与 DBSCAN（eps=1.5）在 PCA / t-SNE 上的混合工况划分。</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/neural/gtu-training.png" alt="GTU-CNN 训练曲线">
+          <figcaption>GTU-CNN 训练曲线 —— 运行状态分类（正转 / 反转 / 待机 / 空闲）的 Loss / Accuracy / F1。</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/neural/gtu-confusion.png" alt="GTU-CNN 混淆矩阵">
+          <figcaption>GTU-CNN 混淆矩阵 —— 四类运行状态分类结果，实测 F1 分数约 0.958。</figcaption>
+        </figure>
       </div>
     </div>
   </section>
 
   <section class="section">
     <div class="container">
-      <h2 class="section-title">功能特性</h2>
+      <h2 class="section-title">核心模型</h2>
+      <div class="grid">
+        <div class="card"><div class="icon">◉</div><h3>StabilityPredictor</h3><p>1D-CNN 回归模型，50 点滑窗 + 批次静态参数常量通道融合，输出混合稳定度分数；阈值 + 最短稳定时间双条件判定，支持在线重训练与 A/B 对比。</p></div>
+        <div class="card"><div class="icon">✧</div><h3>GTUCNN1D</h3><p>门控 tanh 单元 + CNN 结构，运行状态分类（正转 / 反转 / 待机 / 空闲），实测 F1 分数约 0.958。</p></div>
+        <div class="card"><div class="icon">◈</div><h3>异常检测与聚类</h3><p>IsolationForest 异常检测 + KMeans / DBSCAN 运行段聚类，辅助分析混合过程异常工况。</p></div>
+        <div class="card"><div class="icon">⌕</div><h3>反馈闭环</h3><p>操作工停机反馈写入 feedback.db → 阈值自动建议，数据驱动模型持续优化，让判定越来越准。</p></div>
+      </div>
+    </div>
+  </section>
+
+  <section class="section section-alt">
+    <div class="container">
+      <h2 class="section-title">工程化特性</h2>
       <div class="grid">
         <div class="card"><h3>自动停机（可选）</h3><p>判定 STOP 时通过 Modbus 写控制寄存器真正停机；默认仅提示不动作，实机验证后方可启用。</p></div>
-        <div class="card"><h3>远程控制</h3><p>采集端内置 HTTP API（:8000），局域网任意电脑可连接控制采集启停、修改判定阈值。</p></div>
-        <div class="card"><h3>数据库管理</h3><p>Navicat 式内置管理器：建库 / 建表 / 表结构 / 数据编辑 / 用户管理 / SQL 控制台。</p></div>
+        <div class="card"><h3>远程控制</h3><p>采集端内置 HTTP API，局域网任意电脑可连接控制采集启停、修改判定阈值与批次参数。</p></div>
+        <div class="card"><h3>数据库管理</h3><p>Navicat 式内置管理器：建库 / 建表 / 表结构 / 数据编辑 / 用户管理 / SQL 控制台，并可一键设为主库。</p></div>
         <div class="card"><h3>可视化</h3><p>实时速度 / 电流 / 转矩 / 稳定度滚动曲线，COMSOL 风格收敛分析、参数场、判定轨迹图。</p></div>
         <div class="card"><h3>数据迁移</h3><p>MySQL 旧库一键迁移至 TimescaleDB，支持试跑预览，生产数据平滑过渡。</p></div>
         <div class="card"><h3>安全设计</h3><p>数据库操作全参数化 + 标识符白名单防注入，Token 鉴权控制远程访问。</p></div>
@@ -112,10 +153,23 @@
     </div>
   </section>
 
+  <section class="section">
+    <div class="container">
+      <h2 class="section-title">开放 API</h2>
+      <p class="section-desc">采集端提供 HTTP 接口，采集控制、判定配置、批次管理与训练全部可远程调用。</p>
+      <div class="grid">
+        <div class="card"><h3>状态与串口</h3><p><span class="mono">GET /api/status</span> · <span class="mono">GET /api/ports</span> · <span class="mono">POST /api/config/port</span> · <span class="mono">GET/POST /api/rule</span></p></div>
+        <div class="card"><h3>判定与缓冲</h3><p><span class="mono">GET /api/monitor</span> · <span class="mono">POST /api/monitor/config</span> · <span class="mono">GET /api/redis/status</span> · <span class="mono">POST /api/flush</span></p></div>
+        <div class="card"><h3>批次管理</h3><p><span class="mono">POST /api/batch/start</span> · <span class="mono">POST /api/batch/params</span> · <span class="mono">POST /api/batch/end</span> · <span class="mono">GET /api/batch/status</span></p></div>
+        <div class="card"><h3>训练与控制</h3><p><span class="mono">POST /api/train</span> · <span class="mono">GET /api/train/status</span> · <span class="mono">POST /api/autostop</span> · <span class="mono">GET /api/db_stats</span></p></div>
+      </div>
+    </div>
+  </section>
+
   <section class="section section-alt">
     <div class="container narrow">
       <h2 class="section-title">技术栈</h2>
-      <p class="section-desc">Python · PyTorch（1D-CNN / GTU-CNN）· Redis · TimescaleDB / PostgreSQL · ModbusRTU · PyInstaller（轻量打包）· Tkinter 工程化 GUI</p>
+      <p class="section-desc">Python · PyTorch（1D-CNN / GTU-CNN）· Redis · TimescaleDB / PostgreSQL · MySQL · ModbusRTU · PyInstaller（13.9MB 轻量打包）· Tkinter 工程化 GUI · NVIDIA Jetson</p>
       <div class="pill-row">
         <span class="pill">Python</span>
         <span class="pill">PyTorch</span>
diff --git a/website/static/research.html b/website/static/research.html
index b3250d4..72bdc9f 100644
--- a/website/static/research.html
+++ b/website/static/research.html
@@ -109,10 +109,8 @@
             <a href="/research/neural/" class="btn btn-primary">了解 NeuralMix</a>
           </div>
         </div>
-        <div class="feature-visual" style="--v1:#5b3df5;--v2:#22c8ff">
-          <span class="visual-glyph">◈</span>
-          <span class="visual-chip chip-a">1D-CNN</span>
-          <span class="visual-chip chip-b">0.15s 高速采样</span>
+        <div class="feature-visual has-image">
+          <img src="/static/img/neural/convergence-analysis.png" alt="NeuralMix AI 模型收敛分析">
         </div>
       </div>
 
diff --git a/website/static/tool-engineer-craft.html b/website/static/tool-engineer-craft.html
index b636af1..6fa3ca2 100644
--- a/website/static/tool-engineer-craft.html
+++ b/website/static/tool-engineer-craft.html
@@ -94,6 +94,23 @@
     </div>
   </section>
 
+  <section class="section">
+    <div class="container">
+      <h2 class="section-title">工程模型实录</h2>
+      <p class="section-desc">由工程计算引擎输出的设备模型与尺寸标注示意。</p>
+      <div class="gallery">
+        <figure class="shot contain">
+          <img src="/static/img/engineer/xf.png" alt="旋风分离器计算模型">
+          <figcaption>旋风分离器计算模型 —— 结构尺寸与气流速度路径示意</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/engineer/zcxl.png" alt="螺旋输送机计算模型">
+          <figcaption>螺旋输送机计算模型 —— 壳体、螺旋体与驱动参数标注</figcaption>
+        </figure>
+      </div>
+    </div>
+  </section>
+
   <section class="section section-alt">
     <div class="container narrow">
       <h2 class="section-title">技术栈</h2>
diff --git a/website/static/tool-sequence-diagram.html b/website/static/tool-sequence-diagram.html
index 3dd8cf6..bfeafa1 100644
--- a/website/static/tool-sequence-diagram.html
+++ b/website/static/tool-sequence-diagram.html
@@ -94,6 +94,31 @@
     </div>
   </section>
 
+  <section class="section">
+    <div class="container">
+      <h2 class="section-title">界面实录</h2>
+      <p class="section-desc">以下均为软件实际运行界面（2560 × 1440）。</p>
+      <div class="gallery">
+        <figure class="shot wide">
+          <img src="/static/img/sequence/bar-timing.png" alt="条形节拍视图 - 深色主题">
+          <figcaption>条形节拍视图（甘特 / 流程图 + FS/SS 依赖箭头 + 关键路径）—— 深色主题</figcaption>
+        </figure>
+        <figure class="shot wide">
+          <img src="/static/img/sequence/circular-timing.png" alt="圆周节拍视图 - 深色主题">
+          <figcaption>圆周节拍视图（同心圆 · 12 点钟起始 · 顺时针）—— 深色主题</figcaption>
+        </figure>
+        <figure class="shot wide">
+          <img src="/static/img/sequence/unit-settings.png" alt="工艺参数面板">
+          <figcaption>工艺参数面板（F2）—— 单位与精度 / 循环与相位 / 换算表 / 编辑辅助</figcaption>
+        </figure>
+        <figure class="shot wide">
+          <img src="/static/img/sequence/bar-timing-light.png" alt="条形节拍视图 - 浅色主题">
+          <figcaption>条形节拍视图 —— 浅色主题</figcaption>
+        </figure>
+      </div>
+    </div>
+  </section>
+
   <section class="section section-alt">
     <div class="container narrow">
       <h2 class="section-title">技术栈</h2>
diff --git a/website/static/tool-uni-viewer.html b/website/static/tool-uni-viewer.html
index 568ea51..6489dbd 100644
--- a/website/static/tool-uni-viewer.html
+++ b/website/static/tool-uni-viewer.html
@@ -95,6 +95,39 @@
     </div>
   </section>
 
+  <section class="section">
+    <div class="container">
+      <h2 class="section-title">界面实录</h2>
+      <p class="section-desc">同一套 API，覆盖办公文档、工程图纸与移动端。</p>
+      <div class="gallery">
+        <figure class="shot wide">
+          <img src="/static/img/uni-viewer/demo-desktop.webp" alt="Uni-Viewer 桌面工作台 DOCX 预览">
+          <figcaption>桌面工作台 —— 浏览器原生 DOCX 预览（固定玻璃工具栏 / 最近打开 / 沉浸画布）</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/uni-viewer/word.webp" alt="Word 文档预览">
+          <figcaption>Office · Word</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/uni-viewer/spreadsheet.webp" alt="Excel 表格预览">
+          <figcaption>Office · Excel</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/uni-viewer/presentation.webp" alt="PPT 演示文稿预览">
+          <figcaption>Office · PPT</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/uni-viewer/cad.webp" alt="CAD 图纸预览">
+          <figcaption>CAD · DWG 图纸（图层 / 结构 / 下载打印）</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/uni-viewer/demo-mobile.webp" alt="Uni-Viewer 移动端预览">
+          <figcaption>移动端预览 —— 单一「更多」入口，适配小屏</figcaption>
+        </figure>
+      </div>
+    </div>
+  </section>
+
   <section class="section section-alt">
     <div class="container narrow">
       <h2 class="section-title">技术栈</h2>
diff --git a/website/static/tool-unitouch.html b/website/static/tool-unitouch.html
index 088493b..b02cf5b 100644
--- a/website/static/tool-unitouch.html
+++ b/website/static/tool-unitouch.html
@@ -93,6 +93,23 @@
     </div>
   </section>
 
+  <section class="section">
+    <div class="container">
+      <h2 class="section-title">界面实录</h2>
+      <p class="section-desc">深色与浅色两套主题，同一控制台。</p>
+      <div class="gallery">
+        <figure class="shot wide">
+          <img src="/static/img/unitouch/hmi-dark.png" alt="UniTouch 设备控制台 - 深色主题">
+          <figcaption>设备控制台（深色）—— 药品发酵生产线 · A 区：关键参数仪表、实时趋势、报警事件与数据审计</figcaption>
+        </figure>
+        <figure class="shot wide">
+          <img src="/static/img/unitouch/hmi-light.png" alt="UniTouch 设备控制台 - 浅色主题">
+          <figcaption>设备控制台（浅色）—— 同一套组态界面，适配不同现场光照环境</figcaption>
+        </figure>
+      </div>
+    </div>
+  </section>
+
   <section class="section section-alt">
     <div class="container narrow">
       <h2 class="section-title">状态与规划</h2>
diff --git a/website/static/tools.html b/website/static/tools.html
index af7ac7b..d8a6ca8 100644
--- a/website/static/tools.html
+++ b/website/static/tools.html
@@ -123,6 +123,33 @@
     </div>
   </section>
 
+  <section class="section">
+    <div class="container">
+      <div class="section-head">
+        <h2 class="section-title">界面实录</h2>
+        <p class="section-desc">来自实际运行的软件界面与工程输出。</p>
+      </div>
+      <div class="gallery">
+        <figure class="shot wide">
+          <img src="/static/img/sequence/bar-timing.png" alt="Sequence-Diagram 条形节拍视图">
+          <figcaption>Sequence-Diagram —— 条形节拍视图（甘特 / 流程图 + FS/SS 依赖箭头 + 关键路径）</figcaption>
+        </figure>
+        <figure class="shot wide">
+          <img src="/static/img/uni-viewer/demo-desktop.webp" alt="Uni-Viewer 桌面预览工作区">
+          <figcaption>Uni-Viewer —— 浏览器原生 DOCX 预览工作区（纯前端渲染，文件不出内网）</figcaption>
+        </figure>
+        <figure class="shot wide">
+          <img src="/static/img/unitouch/hmi-dark.png" alt="UniTouch 设备控制台">
+          <figcaption>UniTouch Interface —— 设备控制台（药品发酵生产线 · A 区）</figcaption>
+        </figure>
+        <figure class="shot contain">
+          <img src="/static/img/engineer/xf.png" alt="Engineer Craft 旋风分离器计算模型">
+          <figcaption>Engineer Craft —— 旋风分离器计算模型示意</figcaption>
+        </figure>
+      </div>
+    </div>
+  </section>
+
   <section class="section section-alt">
     <div class="container">
       <div class="cta-band">