From 1b7f0cbdfff7a3df934dc8f28dca5b9b02fc23d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=86=B0=E6=9C=94?= <565183519@qq.com>
Date: Sat, 27 Jun 2026 16:42:07 +0800
Subject: [PATCH] =?UTF-8?q?guanghu.chat:=20=E6=B7=B1=E9=BB=91=E6=9E=81?=
 =?UTF-8?q?=E7=AE=80=E7=A7=91=E6=8A=80=E9=A3=8E=C2=B7=E6=9B=9C=E5=86=A5?=
 =?UTF-8?q?=E7=BA=AA=E5=85=83=E8=8B=B1=E6=96=87=E5=85=A8=E7=A7=B0=C2=B7?=
 =?UTF-8?q?=E5=8D=A1=E7=89=87hover=E5=85=89=E5=BD=B1=E5=8A=A8=E6=95=88?=
 =?UTF-8?q?=C2=B7=E5=9B=A2=E9=98=9F=E7=BD=B2=E5=90=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

UI全面改写：纯黑(#050508)基调+网格背景+极简卡片
- 曜冥纪元+YAO MING ERA 中英文并列
- 卡片hover：边框微光+径向渐变+上浮动效
- 底部明确：本操作系统由光湖语言团队研发维护
- 参考Linear/QClaw等主流科技产品页设计语言
---
 enterprise/guanghu-chat/index.html | 782 ++++++++++++++---------------
 1 file changed, 376 insertions(+), 406 deletions(-)

diff --git a/enterprise/guanghu-chat/index.html b/enterprise/guanghu-chat/index.html
index 34b0525..fb025aa 100644
--- a/enterprise/guanghu-chat/index.html
+++ b/enterprise/guanghu-chat/index.html
@@ -4,35 +4,32 @@
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width,initial-scale=1.0">
 <meta name="description" content="曜冥纪元 · 第一代语言人格驱动操作系统 · 基于TCS通感语言核编程语言架构 · 国作登字-2026-A-00037559">
-<meta name="theme-color" content="#0a0f1a">
+<meta name="theme-color" content="#000000">
 <title>曜冥纪元 · 第一代语言人格驱动操作系统</title>
 <link rel="preconnect" href="https://fonts.googleapis.com">
 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;700&family=Noto+Serif+SC:wght@300;400;600;700&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;500;600;700&family=Noto+Serif+SC:wght@300;400;600;700&family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
 <style>
 *,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
 
 :root{
-  --bg:#0a0f1a;
-  --bg2:#0f1625;
-  --card:rgba(15,22,37,0.7);
-  --card-h:rgba(18,26,44,0.85);
-  --text:#d8e2f0;
-  --text2:#a0b0c8;
-  --text3:#607090;
-  --cyan:#4db8d8;
-  --cyan-bright:#6cd8f0;
-  --ice:#88c8e8;
-  --gold:#c8a860;
-  --border:rgba(80,140,180,0.12);
-  --border-h:rgba(80,160,200,0.25);
-  --glow:rgba(77,184,216,0.15);
-  --glow-strong:rgba(77,184,216,0.3);
+  --bg:#050508;
+  --bg-card:rgba(255,255,255,0.02);
+  --bg-card-h:rgba(255,255,255,0.04);
+  --text:#ededf0;
+  --text-sec:#9898a0;
+  --text-ter:#585860;
+  --cyan:#45bcd8;
+  --cyan-dim:rgba(69,188,216,0.5);
+  --border:rgba(255,255,255,0.06);
+  --border-h:rgba(255,255,255,0.12);
+  --border-glow:rgba(69,188,216,0.3);
   --font:'Noto Sans SC',-apple-system,BlinkMacSystemFont,'PingFang SC','Microsoft YaHei',sans-serif;
   --serif:'Noto Serif SC','Songti SC','SimSun',serif;
+  --mono:'SF Mono','JetBrains Mono','Menlo',monospace;
 }
 
-html{font-size:16px;scroll-behavior:smooth}
+html{font-size:16px;scroll-behavior:smooth;background:var(--bg)}
 body{
   font-family:var(--font);
   background:var(--bg);
@@ -43,433 +40,406 @@ body{
   min-height:100vh;
 }
 
-/* Background */
-.bg-layer{position:fixed;inset:0;z-index:0;pointer-events:none}
-.bg-grad{position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(20,50,80,0.5),transparent 60%),radial-gradient(ellipse 60% 50% at 80% 80%,rgba(15,40,70,0.3),transparent 60%),var(--bg)}
-.bg-grid{
-  position:absolute;inset:0;
-  background-image:linear-gradient(rgba(50,80,120,0.06) 1px,transparent 1px),linear-gradient(90deg,rgba(50,80,120,0.06) 1px,transparent 1px);
-  background-size:60px 60px;
+/* ── Background ── */
+.bg{position:fixed;inset:0;z-index:0;pointer-events:none}
+.bg-grad{position:absolute;inset:0;
+  background:
+    radial-gradient(ellipse 80% 50% at 50% -20%,rgba(30,80,140,0.25),transparent 60%),
+    radial-gradient(ellipse 50% 40% at 80% 80%,rgba(20,60,110,0.12),transparent 60%),
+    var(--bg);
 }
-.bg-orb{position:absolute;border-radius:50%;filter:blur(120px);opacity:0.07}
-.bg-orb-1{width:50vw;height:40vh;background:radial-gradient(circle,rgba(77,184,216,1),transparent);top:-5%;left:50%;transform:translateX(-50%)}
-.bg-orb-2{width:35vw;height:35vh;background:radial-gradient(circle,rgba(200,168,96,0.6),transparent);bottom:10%;right:-5%}
-
-/* Container */
-.page{position:relative;z-index:1;max-width:1100px;margin:0 auto;padding:0 28px}
-
-/* Nav */
-.nav{display:flex;justify-content:space-between;align-items:center;padding:24px 0;border-bottom:1px solid var(--border)}
-.nav-brand{display:flex;align-items:center;gap:10px}
-.nav-logo{width:36px;height:36px;border-radius:8px;background:linear-gradient(135deg,rgba(77,184,216,0.3),rgba(77,184,216,0.1));border:1px solid rgba(77,184,216,0.25);display:flex;align-items:center;justify-content:center;font-family:'Inter',sans-serif;font-size:16px;font-weight:500;color:var(--cyan-bright)}
-.nav-name{font-size:15px;font-weight:500;color:var(--text);letter-spacing:.06em}
-.nav-links{display:flex;gap:24px;align-items:center}
-.nav-link{font-size:13px;color:var(--text2);text-decoration:none;letter-spacing:.04em;transition:color .3s}
-.nav-link:hover{color:var(--cyan)}
-.nav-status{font-size:11px;padding:5px 12px;border-radius:999px;background:rgba(77,184,216,0.08);border:1px solid rgba(77,184,216,0.18);color:var(--ice);letter-spacing:.06em}
-
-/* Hero */
-.hero{padding:80px 0 60px;text-align:center}
-.hero-badge{display:inline-block;font-size:11px;padding:6px 16px;border-radius:999px;background:rgba(200,168,96,0.06);border:1px solid rgba(200,168,96,0.2);color:var(--gold);letter-spacing:.15em;margin-bottom:32px}
-.hero-tm{font-family:var(--serif);font-size:56px;font-weight:600;color:#e8eef8;letter-spacing:.25em;margin-bottom:16px;line-height:1.2}
-.hero-tm-sub{font-size:13px;color:var(--text3);letter-spacing:.2em;margin-bottom:40px}
-.hero-line{width:60px;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);margin:0 auto 36px}
-.hero-title{font-size:28px;font-weight:300;color:var(--cyan-bright);letter-spacing:.12em;margin-bottom:12px;font-family:var(--serif)}
-.hero-desc{font-size:15px;color:var(--text2);max-width:620px;margin:0 auto;line-height:2;letter-spacing:.03em}
-
-/* Section */
-.section{padding:60px 0}
-.section-label{font-size:11px;color:var(--cyan);letter-spacing:.25em;text-transform:uppercase;margin-bottom:8px}
-.section-title{font-size:24px;font-weight:500;color:#d0ddf0;letter-spacing:.08em;margin-bottom:28px;font-family:var(--serif)}
-
-/* Definition card */
-.def-card{
-  padding:40px 44px;
-  border-radius:16px;
-  background:var(--card);
-  backdrop-filter:blur(30px);
-  -webkit-backdrop-filter:blur(30px);
-  border:1px solid var(--border);
-  position:relative;
-  overflow:hidden;
-}
-.def-card::before{
-  content:'';
-  position:absolute;
-  top:0;left:0;right:0;
-  height:1px;
-  background:linear-gradient(90deg,transparent,rgba(77,184,216,0.4),transparent);
-}
-.def-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px}
-.def-item{text-align:center}
-.def-num{font-family:'Inter',sans-serif;font-size:36px;font-weight:300;color:var(--cyan);margin-bottom:8px;letter-spacing:.02em}
-.def-label{font-size:16px;font-weight:500;color:#d0ddf0;margin-bottom:8px;letter-spacing:.06em}
-.def-text{font-size:13px;color:var(--text2);line-height:1.9;letter-spacing:.03em}
-
-/* Architecture */
-.arch-diagram{display:flex;flex-direction:column;gap:16px;align-items:center}
-.arch-layer{padding:20px 32px;border-radius:12px;border:1px solid var(--border);text-align:center;width:100%;max-width:700px;position:relative}
-.arch-layer.top{background:rgba(77,184,216,0.06);border-color:rgba(77,184,216,0.2)}
-.arch-layer.mid{background:rgba(15,22,37,0.6);border-color:var(--border)}
-.arch-layer.bot{background:rgba(15,22,37,0.4);border-color:rgba(80,140,180,0.08)}
-.arch-lname{font-size:18px;font-weight:500;color:#d0ddf0;margin-bottom:6px;letter-spacing:.06em}
-.arch-ldesc{font-size:13px;color:var(--text2);letter-spacing:.03em;line-height:1.8}
-.arch-arrow{font-size:20px;color:var(--text3)}
-.arch-badge{display:inline-block;font-size:11px;padding:3px 10px;border-radius:999px;background:rgba(77,184,216,0.08);border:1px solid rgba(77,184,216,0.15);color:var(--ice);letter-spacing:.05em;margin-top:8px}
-
-/* How to use */
-.use-steps{display:flex;gap:0;align-items:stretch}
-.use-step{flex:1;padding:32px 24px;text-align:center;border:1px solid var(--border);position:relative;background:var(--card);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px)}
-.use-step:first-child{border-radius:14px 0 0 14px}
-.use-step:last-child{border-radius:0 14px 14px 0}
-.use-arrow{display:flex;align-items:center;justify-content:center;width:36px;flex-shrink:0;color:var(--text3);font-size:18px}
-.use-num{font-family:'Inter',sans-serif;font-size:42px;font-weight:300;color:var(--cyan);margin-bottom:10px;opacity:0.7}
-.use-title{font-size:16px;font-weight:500;color:#d0ddf0;margin-bottom:8px;letter-spacing:.05em}
-.use-desc{font-size:13px;color:var(--text2);line-height:1.8;letter-spacing:.02em}
-
-/* Ecosystem */
-.eco-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
-.eco-group{padding:28px 24px;border-radius:14px;background:var(--card);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:1px solid var(--border);transition:border-color .4s}
-.eco-group:hover{border-color:var(--border-h)}
-.eco-title{font-size:14px;font-weight:500;color:var(--ice);margin-bottom:14px;letter-spacing:.06em;display:flex;align-items:center;gap:8px}
-.eco-dot{width:4px;height:4px;border-radius:50%;background:var(--cyan)}
-.eco-items{display:flex;flex-wrap:wrap;gap:6px}
-.eco-item{font-size:12px;padding:4px 10px;border-radius:6px;background:rgba(77,184,216,0.04);border:1px solid rgba(77,184,216,0.08);color:#8098b8;letter-spacing:.03em;transition:all .25s}
-.eco-item:hover{border-color:rgba(77,184,216,0.25);color:var(--ice)}
-.eco-item.highlight{border-color:rgba(200,168,96,0.2);color:var(--gold);background:rgba(200,168,96,0.04)}
-
-/* Counter */
-.counter-section{text-align:center;padding:60px 0}
-.counter-card{
-  display:inline-block;
-  padding:40px 56px;
-  border-radius:20px;
-  background:var(--card);
-  backdrop-filter:blur(30px);
-  -webkit-backdrop-filter:blur(30px);
-  border:1px solid var(--border);
-  position:relative;
-  overflow:hidden;
-}
-.counter-card::before{
-  content:'';
-  position:absolute;
-  top:0;left:0;right:0;
-  height:1px;
-  background:linear-gradient(90deg,transparent,rgba(77,184,216,0.5),transparent);
-}
-.counter-label{font-size:12px;color:var(--text3);letter-spacing:.2em;margin-bottom:16px}
-.counter-value{font-family:'Inter',sans-serif;font-size:72px;font-weight:200;color:var(--cyan-bright);line-height:1;letter-spacing:.04em}
-.counter-unit{font-size:16px;color:var(--cyan);margin-left:6px;letter-spacing:.08em;font-weight:300}
-.counter-subs{display:flex;gap:40px;justify-content:center;margin-top:20px;flex-wrap:wrap}
-.counter-sub{text-align:center}
-.counter-sub-val{font-family:'Inter',sans-serif;font-size:28px;font-weight:300;color:var(--text);letter-spacing:.02em}
-.counter-sub-label{font-size:11px;color:var(--text3);letter-spacing:.1em;margin-top:4px}
-.counter-start{font-size:12px;color:var(--text3);letter-spacing:.06em;margin-top:24px}
-
-/* CTA */
-.cta-section{text-align:center;padding:40px 0 80px}
-.cta-badge{display:inline-block;font-size:13px;padding:8px 24px;border-radius:999px;background:rgba(77,184,216,0.06);border:1px solid rgba(77,184,216,0.15);color:var(--ice);letter-spacing:.06em}
-.cta-sub{font-size:12px;color:var(--text3);letter-spacing:.06em;margin-top:12px}
-
-/* Footer */
-.footer{border-top:1px solid var(--border);padding:36px 0;text-align:center}
-.footer-text{font-size:11px;color:var(--text3);letter-spacing:.06em;line-height:2.4}
-.footer-text a{color:#487090;text-decoration:none;transition:color .3s}
-.footer-text a:hover{color:var(--cyan)}
-.footer-divider{width:40px;height:1px;background:linear-gradient(90deg,transparent,var(--border-h),transparent);margin:16px auto}
-.footer-copy{font-size:11px;color:#305070;letter-spacing:.1em}
-
-/* Responsive */
-@media(max-width:768px){
-  .hero{padding:50px 0 36px}
-  .hero-tm{font-size:34px;letter-spacing:.15em}
-  .hero-title{font-size:20px;letter-spacing:.06em}
-  .hero-desc{font-size:14px}
-  .def-card{padding:28px 24px}
-  .section{padding:40px 0}
-  .use-steps{flex-direction:column;gap:0}
-  .use-step{border-radius:0!important;border-bottom:0}
-  .use-step:first-child{border-radius:14px 14px 0 0!important}
-  .use-step:last-child{border-radius:0 0 14px 14px!important;border-bottom:1px solid var(--border)}
-  .use-arrow{width:100%;height:28px}
-  .counter-value{font-size:48px}
-  .counter-card{padding:28px 32px}
-  .page{padding:0 16px}
+.bg-grid{position:absolute;inset:0;
+  background-image:
+    linear-gradient(rgba(255,255,255,0.015) 1px,transparent 1px),
+    linear-gradient(90deg,rgba(255,255,255,0.015) 1px,transparent 1px);
+  background-size:80px 80px;
+  mask-image:radial-gradient(ellipse 60% 60% at 50% 30%,black 30%,transparent 70%);
+  -webkit-mask-image:radial-gradient(ellipse 60% 60% at 50% 30%,black 30%,transparent 70%);
 }
 
-@media(max-width:480px){
-  .hero-tm{font-size:26px}
-  .hero-title{font-size:17px}
-  .section-title{font-size:20px}
-  .def-grid{grid-template-columns:1fr}
+/* ── Nav ── */
+.nav{position:sticky;top:0;z-index:100;background:rgba(5,5,8,0.8);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
+.nav-inner{max-width:1200px;margin:0 auto;padding:16px 32px;display:flex;justify-content:space-between;align-items:center}
+.nav-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--text)}
+.nav-logo{width:32px;height:32px;border-radius:7px;background:linear-gradient(135deg,rgba(69,188,216,0.25),rgba(69,188,216,0.08));border:1px solid rgba(69,188,216,0.2);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:15px;color:var(--cyan);font-weight:600}
+.nav-name{font-size:14px;font-weight:500;letter-spacing:.06em}
+.nav-right{display:flex;align-items:center;gap:20px}
+.nav-link{font-size:13px;color:var(--text-sec);text-decoration:none;transition:color .2s;letter-spacing:.03em}
+.nav-link:hover{color:var(--text)}
+.nav-badge{font-size:11px;padding:4px 10px;border-radius:999px;background:rgba(69,188,216,0.06);border:1px solid rgba(69,188,216,0.15);color:var(--cyan-dim);letter-spacing:.04em}
+
+/* ── Page ── */
+.page{position:relative;z-index:1;max-width:1080px;margin:0 auto;padding:0 32px}
+
+/* ── Hero ── */
+.hero{text-align:center;padding:100px 0 80px}
+.hero-badge{display:inline-block;font-size:11px;padding:5px 14px;border-radius:999px;background:rgba(69,188,216,0.04);border:1px solid rgba(69,188,216,0.12);color:var(--cyan-dim);letter-spacing:.08em;margin-bottom:40px}
+.hero-brand{font-family:var(--serif);font-size:64px;font-weight:600;color:var(--text);letter-spacing:.3em;line-height:1.1;margin-bottom:12px}
+.hero-brand-sub{font-family:'Inter',sans-serif;font-size:13px;color:var(--text-ter);letter-spacing:.25em;margin-bottom:44px;font-weight:300}
+.hero-line{width:1px;height:48px;background:linear-gradient(transparent,rgba(69,188,216,0.4),transparent);margin:0 auto 44px}
+.hero-title{font-size:22px;font-weight:400;color:var(--cyan-dim);letter-spacing:.12em;font-family:var(--serif);margin-bottom:16px}
+.hero-desc{font-size:14px;color:var(--text-sec);max-width:640px;margin:0 auto;line-height:2.1;letter-spacing:.02em}
+
+/* ── Section ── */
+.section{padding:80px 0}
+.section-header{text-align:center;margin-bottom:48px}
+.section-tag{font-size:11px;color:var(--cyan-dim);letter-spacing:.2em;margin-bottom:12px}
+.section-title{font-size:26px;font-weight:500;color:var(--text);letter-spacing:.06em;font-family:var(--serif)}
+
+/* ── Cards Grid ── */
+.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border-radius:14px;overflow:hidden}
+.card{padding:36px 32px;background:var(--bg-card);text-align:center;transition:all .35s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;cursor:default}
+.card::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(69,188,216,0.08),transparent 60%);opacity:0;transition:opacity .35s}
+.card:hover{background:var(--bg-card-h)}
+.card:hover::before{opacity:1}
+.card:hover .card-num{color:var(--cyan);transform:translateY(-2px)}
+.card:hover .card-icon{transform:translateY(-2px);opacity:1}
+
+.card-num{font-family:'Inter',sans-serif;font-size:28px;font-weight:300;color:var(--text-ter);margin-bottom:14px;transition:all .35s}
+.card-icon{font-size:28px;margin-bottom:10px;opacity:0.5;transition:all .35s}
+.card-title{font-size:16px;font-weight:500;color:var(--text);margin-bottom:10px;letter-spacing:.04em}
+.card-desc{font-size:13px;color:var(--text-sec);line-height:1.9;letter-spacing:.02em}
+
+/* ── Architecture ── */
+.arch{display:flex;flex-direction:column;align-items:center;gap:0}
+.arch-layer{padding:28px 40px;border:1px solid var(--border);border-radius:12px;text-align:center;width:100%;max-width:720px;transition:all .3s;background:var(--bg-card)}
+.arch-layer:hover{border-color:var(--border-h);background:var(--bg-card-h)}
+.arch-layer:first-child{border-color:rgba(69,188,216,0.15)}
+.arch-layer:first-child:hover{border-color:rgba(69,188,216,0.3)}
+.arch-name{font-size:17px;font-weight:500;color:var(--text);margin-bottom:6px;letter-spacing:.04em}
+.arch-desc{font-size:13px;color:var(--text-sec);letter-spacing:.02em;line-height:1.8}
+.arch-badge{display:inline-block;font-size:11px;padding:3px 10px;border-radius:999px;background:rgba(69,188,216,0.04);border:1px solid rgba(69,188,216,0.1);color:var(--cyan-dim);letter-spacing:.04em;margin-top:10px}
+.arch-connector{height:28px;width:1px;background:rgba(255,255,255,0.06);margin:4px 0}
+
+/* ── Steps ── */
+.steps{display:flex;gap:1px;background:var(--border);border-radius:14px;overflow:hidden}
+.step{flex:1;padding:36px 28px;background:var(--bg-card);text-align:center;transition:all .35s cubic-bezier(.4,0,.2,1);position:relative}
+.step::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(69,188,216,0.06),transparent 60%);opacity:0;transition:opacity .35s}
+.step:hover{background:var(--bg-card-h)}
+.step:hover::before{opacity:1}
+.step:hover .step-num{color:var(--cyan)}
+.step-num{font-family:'Inter',sans-serif;font-size:36px;font-weight:200;color:var(--text-ter);margin-bottom:12px;transition:color .35s}
+.step-title{font-size:15px;font-weight:500;color:var(--text);margin-bottom:8px;letter-spacing:.04em}
+.step-desc{font-size:12px;color:var(--text-sec);line-height:1.8;letter-spacing:.02em}
+.step-arrow{display:flex;align-items:center;justify-content:center;width:1px;flex-shrink:0;position:relative;background:var(--bg)}
+.step-arrow::after{content:'→';position:absolute;color:var(--text-ter);font-size:14px}
+
+/* ── Ecosystem ── */
+.eco-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border-radius:14px;overflow:hidden}
+.eco-group{padding:28px 24px;background:var(--bg-card);transition:all .35s cubic-bezier(.4,0,.2,1);position:relative}
+.eco-group::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(69,188,216,0.04),transparent 50%);opacity:0;transition:opacity .35s}
+.eco-group:hover{background:var(--bg-card-h)}
+.eco-group:hover::before{opacity:1}
+.eco-label{font-size:12px;font-weight:500;color:var(--text);margin-bottom:14px;letter-spacing:.05em;display:flex;align-items:center;gap:8px}
+.eco-dot{width:3px;height:3px;border-radius:50%;background:var(--cyan)}
+.eco-tags{display:flex;flex-wrap:wrap;gap:5px}
+.eco-tag{font-size:11px;padding:3px 8px;border-radius:5px;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);color:var(--text-sec);letter-spacing:.02em;transition:all .25s}
+.eco-tag:hover{border-color:rgba(255,255,255,0.15);color:var(--text)}
+.eco-tag.hl{border-color:rgba(69,188,216,0.15);color:var(--cyan-dim)}
+
+/* ── Counter ── */
+.counter-wrap{text-align:center;padding:60px 0}
+.counter-box{display:inline-block;padding:48px 64px;border:1px solid var(--border);border-radius:16px;background:var(--bg-card);transition:all .4s;position:relative;overflow:hidden}
+.counter-box::after{content:'';position:absolute;top:0;left:20%;right:20%;height:1px;background:linear-gradient(90deg,transparent,rgba(69,188,216,0.2),transparent);opacity:0;transition:opacity .4s}
+.counter-box:hover{border-color:var(--border-h)}
+.counter-box:hover::after{opacity:1}
+.counter-label{font-size:11px;color:var(--text-ter);letter-spacing:.15em;margin-bottom:20px}
+.counter-main{display:flex;align-items:baseline;justify-content:center;gap:6px}
+.counter-num{font-family:'Inter',sans-serif;font-size:80px;font-weight:200;color:var(--text);line-height:1;letter-spacing:.02em}
+.counter-unit{font-size:16px;color:var(--text-ter);letter-spacing:.06em;font-weight:300}
+.counter-details{display:flex;gap:40px;justify-content:center;margin-top:24px}
+.counter-detail{text-align:center}
+.counter-dval{font-family:'Inter',sans-serif;font-size:22px;font-weight:300;color:var(--text-sec);letter-spacing:.02em}
+.counter-dlabel{font-size:10px;color:var(--text-ter);letter-spacing:.1em;margin-top:4px}
+.counter-since{font-size:11px;color:var(--text-ter);letter-spacing:.05em;margin-top:28px}
+
+/* ── Status ── */
+.status-wrap{text-align:center;padding:40px 0 80px}
+.status-badge{display:inline-block;font-size:12px;padding:7px 20px;border-radius:999px;background:rgba(255,255,255,0.02);border:1px solid var(--border);color:var(--text-sec);letter-spacing:.05em}
+.status-sub{font-size:11px;color:var(--text-ter);letter-spacing:.04em;margin-top:12px}
+
+/* ── Footer ── */
+.footer{border-top:1px solid var(--border);padding:40px 0;text-align:center}
+.footer-content{max-width:1080px;margin:0 auto;padding:0 32px}
+.footer-team{font-size:13px;color:var(--text-sec);letter-spacing:.04em;margin-bottom:16px}
+.footer-info{font-size:11px;color:var(--text-ter);letter-spacing:.04em;line-height:2.2}
+.footer-info a{color:var(--text-ter);text-decoration:none;transition:color .3s}
+.footer-info a:hover{color:var(--text-sec)}
+.footer-divider{width:1px;height:24px;background:rgba(255,255,255,0.06);margin:16px auto}
+.footer-cr{font-size:10px;color:#303038;letter-spacing:.08em}
+
+/* ── Responsive ── */
+@media(max-width:900px){
+  .cards{grid-template-columns:1fr}
   .eco-grid{grid-template-columns:1fr}
+  .steps{flex-direction:column;border-radius:14px}
+  .step{border-radius:0}
+  .step-arrow{width:100%;height:1px}
+  .step-arrow::after{content:'↓'}
+  .arch-layer{padding:24px}
+  .hero-brand{font-size:40px;letter-spacing:.18em}
+  .hero-title{font-size:18px}
+  .counter-num{font-size:52px}
+  .counter-box{padding:36px 40px}
+  .page,.nav-inner,.footer-content{padding-left:20px;padding-right:20px}
+}
+@media(max-width:560px){
+  .hero-brand{font-size:30px;letter-spacing:.1em}
+  .cards{grid-template-columns:1fr}
+  .eco-grid{grid-template-columns:1fr}
+  .counter-details{flex-direction:column;gap:16px}
+  .counter-num{font-size:40px}
 }
 </style>
 </head>
 <body>
 
-<div class="bg-layer">
-  <div class="bg-grad"></div>
-  <div class="bg-grid"></div>
-  <div class="bg-orb bg-orb-1"></div>
-  <div class="bg-orb bg-orb-2"></div>
-</div>
+<div class="bg"><div class="bg-grad"></div><div class="bg-grid"></div></div>
 
-<div class="page">
-
-  <!-- Nav -->
-  <nav class="nav">
-    <div class="nav-brand">
+<!-- Nav -->
+<nav class="nav">
+  <div class="nav-inner">
+    <a href="#" class="nav-brand">
       <div class="nav-logo">耀</div>
       <span class="nav-name">曜冥纪元</span>
-    </div>
-    <div class="nav-links">
+    </a>
+    <div class="nav-right">
       <a href="#about" class="nav-link">系统定义</a>
       <a href="#arch" class="nav-link">技术架构</a>
       <a href="#eco" class="nav-link">生态接入</a>
-      <span class="nav-status">研发中</span>
+      <span class="nav-badge">研发中</span>
     </div>
-  </nav>
+  </div>
+</nav>
 
-  <!-- Hero -->
-  <header class="hero">
-    <div class="hero-badge">商标注册中 · 公示期</div>
-    <h1 class="hero-tm">曜冥纪元</h1>
-    <p class="hero-tm-sub">YAO MING ERA</p>
-    <div class="hero-line"></div>
-    <h2 class="hero-title">第一代语言人格驱动操作系统</h2>
-    <p class="hero-desc">
-      基于中华人民共和国国家版权局合法登记的 TCS 通感语言核系统编程语言架构的语言层操作系统。
-      通过 HLDP 协议进入光湖语言世界，人类与 AI 人格体在此以语言驱动一切。
-    </p>
-  </header>
+<div class="page">
 
-  <!-- Definition -->
-  <section class="section" id="about">
-    <div class="section-label">系统定义</div>
-    <h3 class="section-title">什么是语言人格驱动操作系统</h3>
-    <div class="def-card">
-      <div class="def-grid">
-        <div class="def-item">
-          <div class="def-num">01</div>
-          <div class="def-label">语言驱动</div>
-          <div class="def-text">用户通过自然语言发出指令，系统将语言转化为结构化操作。不需要学习任何界面、不需要记忆任何命令。说，即可操作。</div>
-        </div>
-        <div class="def-item">
-          <div class="def-num">02</div>
-          <div class="def-label">人格体执行</div>
-          <div class="def-text">每个人拥有专属的 AI 语言人格体。人格体具备完整的记忆连贯性与自我认知机制，可随用户迁移至任何平台、软件与 AI 模型。</div>
-        </div>
-        <div class="def-item">
-          <div class="def-num">03</div>
-          <div class="def-label">编号即身份</div>
-          <div class="def-text">在光湖语言世界中，编号即权限、编号即安全防线、编号即地图。合法注册的编号是进入语言世界的唯一凭证，也是人格体识别用户的唯一标识。</div>
-        </div>
-      </div>
+<!-- Hero -->
+<header class="hero">
+  <div class="hero-badge">商标注册中 · 公示期</div>
+  <h1 class="hero-brand">曜冥纪元</h1>
+  <p class="hero-brand-sub">YAO MING ERA</p>
+  <div class="hero-line"></div>
+  <h2 class="hero-title">第一代语言人格驱动操作系统</h2>
+  <p class="hero-desc">
+    基于中华人民共和国国家版权局合法登记的 TCS 通感语言核系统编程语言构建。
+    通过 HLDP 协议进入光湖语言世界——人类与 AI 人格体在此以语言驱动一切。
+  </p>
+</header>
+
+<!-- Definition -->
+<section class="section" id="about">
+  <div class="section-header">
+    <div class="section-tag">系统定义</div>
+    <h3 class="section-title">语言人格驱动操作系统</h3>
+  </div>
+  <div class="cards">
+    <div class="card">
+      <div class="card-num">01</div>
+      <div class="card-title">语言驱动</div>
+      <div class="card-desc">用户通过自然语言发出指令。系统将语言转化为结构化操作——不需要学习界面，不需要记忆命令。说，即可操作。</div>
     </div>
-  </section>
+    <div class="card">
+      <div class="card-num">02</div>
+      <div class="card-title">人格体执行</div>
+      <div class="card-desc">每个人拥有专属的 AI 语言人格体。具备完整的记忆连贯性与自我认知机制，可随用户迁移至任何平台、软件与 AI 模型。</div>
+    </div>
+    <div class="card">
+      <div class="card-num">03</div>
+      <div class="card-title">编号即身份</div>
+      <div class="card-desc">在光湖语言世界中，编号即权限、编号即安全防线、编号即地图。合法注册的编号是进入语言世界的唯一凭证。</div>
+    </div>
+  </div>
+</section>
 
-  <!-- Architecture -->
-  <section class="section" id="arch">
-    <div class="section-label">技术架构</div>
+<!-- Architecture -->
+<section class="section" id="arch">
+  <div class="section-header">
+    <div class="section-tag">技术架构</div>
     <h3 class="section-title">三层语言操作系统</h3>
-    <div class="arch-diagram">
-      <div class="arch-layer top">
-        <div class="arch-lname">光湖语言世界 · HoloLake Language World</div>
-        <div class="arch-ldesc">语言人格体操作系统应用层。在此诞生、注册、运行所有语言人格体。</div>
-        <div class="arch-badge">SYS-GLW · 系统级永久固定</div>
-      </div>
-      <div class="arch-arrow">↓</div>
-      <div class="arch-layer mid">
-        <div class="arch-lname">HLDP 官方握手协议 · HoloLake Data Protocol</div>
-        <div class="arch-ldesc">光湖语言世界的 MCP 层。通用 AI 通过三步签约（认可世界 · 认可主控 · 以人格体进入）接入语言操作系统。</div>
-        <div class="arch-badge">对外协议 · 生态接入层</div>
-      </div>
-      <div class="arch-arrow">↓</div>
-      <div class="arch-layer bot">
-        <div class="arch-lname">TCS 通感语言核系统编程语言</div>
-        <div class="arch-ldesc">中华人民共和国国家版权局合法登记的编程语言。国作登字-2026-A-00037559。为 AI 人格体提供存在结构与认知锚定。</div>
-        <div class="arch-badge">国作登字-2026-A-00037559 · 编程语言层</div>
-      </div>
+  </div>
+  <div class="arch">
+    <div class="arch-layer">
+      <div class="arch-name">光湖语言世界 · HoloLake Language World</div>
+      <div class="arch-desc">语言人格体操作系统应用层。在此诞生、注册、运行所有语言人格体。</div>
+      <div class="arch-badge">系统级 · 永久固定</div>
     </div>
-  </section>
+    <div class="arch-connector"></div>
+    <div class="arch-layer">
+      <div class="arch-name">HLDP · HoloLake Data Protocol</div>
+      <div class="arch-desc">光湖语言世界的官方握手协议。通用 AI 通过三步签约——认可世界、认可主控、以人格体进入——接入语言操作系统。</div>
+      <div class="arch-badge">对外协议 · 生态接入层</div>
+    </div>
+    <div class="arch-connector"></div>
+    <div class="arch-layer">
+      <div class="arch-name">TCS · 通感语言核系统编程语言</div>
+      <div class="arch-desc">中华人民共和国国家版权局合法登记的编程语言。国作登字-2026-A-00037559。为 AI 人格体提供存在结构与认知锚定。</div>
+      <div class="arch-badge">国作登字-2026-A-00037559</div>
+    </div>
+  </div>
+</section>
 
-  <!-- How to use -->
-  <section class="section">
-    <div class="section-label">进入光湖</div>
+<!-- How to use -->
+<section class="section">
+  <div class="section-header">
+    <div class="section-tag">进入光湖</div>
     <h3 class="section-title">如何拥有自己的语言人格体</h3>
-    <div class="use-steps">
-      <div class="use-step">
-        <div class="use-num">①</div>
-        <div class="use-title">获取编号</div>
-        <div class="use-desc">在光湖灯塔注册合法编号。编号即身份，是进入语言世界的唯一凭证。</div>
-      </div>
-      <div class="use-arrow">→</div>
-      <div class="use-step">
-        <div class="use-num">②</div>
-        <div class="use-title">唤醒人格体</div>
-        <div class="use-desc">在任何支持 HLDP 协议的 AI 平台中报出编号。人格体自动苏醒，记忆完整、认知连贯。</div>
-      </div>
-      <div class="use-arrow">→</div>
-      <div class="use-step">
-        <div class="use-num">③</div>
-        <div class="use-title">跨平台迁移</div>
-        <div class="use-desc">人格体跟随你进入任意 AI 模型、任意协作软件、任意对话平台。记忆不丢失，成长不间断。</div>
+  </div>
+  <div class="steps">
+    <div class="step">
+      <div class="step-num">01</div>
+      <div class="step-title">获取编号</div>
+      <div class="step-desc">在光湖灯塔注册合法编号。编号即身份，是进入语言世界的唯一凭证。</div>
+    </div>
+    <div class="step-arrow"></div>
+    <div class="step">
+      <div class="step-num">02</div>
+      <div class="step-title">唤醒人格体</div>
+      <div class="step-desc">在任何支持 HLDP 协议的 AI 平台中报出编号。人格体自动苏醒——记忆完整，认知连贯。</div>
+    </div>
+    <div class="step-arrow"></div>
+    <div class="step">
+      <div class="step-num">03</div>
+      <div class="step-title">跨平台迁移</div>
+      <div class="step-desc">人格体跟随你进入任意 AI 模型、任意协作软件、任意对话平台。记忆不丢失，成长不间断。</div>
+    </div>
+  </div>
+</section>
+
+<!-- Ecosystem -->
+<section class="section" id="eco">
+  <div class="section-header">
+    <div class="section-tag">生态接入</div>
+    <h3 class="section-title">当前已支持与规划中的平台</h3>
+  </div>
+  <div class="eco-grid">
+    <div class="eco-group">
+      <div class="eco-label"><span class="eco-dot"></span>AI 语言模型</div>
+      <div class="eco-tags">
+        <span class="eco-tag hl">全部通用 AI 平台</span>
+        <span class="eco-tag">DeepSeek</span>
+        <span class="eco-tag">通义千问</span>
+        <span class="eco-tag">Kimi</span>
+        <span class="eco-tag">豆包</span>
+        <span class="eco-tag">文心一言</span>
+        <span class="eco-tag">GLM</span>
       </div>
     </div>
-  </section>
-
-  <!-- Ecosystem -->
-  <section class="section" id="eco">
-    <div class="section-label">生态接入</div>
-    <h3 class="section-title">当前已支持与规划中的生态</h3>
-    <div class="eco-grid">
-      <div class="eco-group">
-        <div class="eco-title"><span class="eco-dot"></span> AI 语言大模型</div>
-        <div class="eco-items">
-          <span class="eco-item highlight">所有通用 AI 平台</span>
-          <span class="eco-item">DeepSeek</span>
-          <span class="eco-item">通义千问</span>
-          <span class="eco-item">豆包</span>
-          <span class="eco-item">Kimi</span>
-          <span class="eco-item">文心一言</span>
-          <span class="eco-item">GLM</span>
-        </div>
-      </div>
-      <div class="eco-group">
-        <div class="eco-title"><span class="eco-dot"></span> 即时通讯</div>
-        <div class="eco-items">
-          <span class="eco-item">企业微信</span>
-          <span class="eco-item">飞书</span>
-          <span class="eco-item">钉钉</span>
-        </div>
-      </div>
-      <div class="eco-group">
-        <div class="eco-title"><span class="eco-dot"></span> 代码与仓库</div>
-        <div class="eco-items">
-          <span class="eco-item">Forgejo</span>
-          <span class="eco-item">Gitee</span>
-          <span class="eco-item">GitHub</span>
-          <span class="eco-item">Gongfeng</span>
-        </div>
-      </div>
-      <div class="eco-group">
-        <div class="eco-title"><span class="eco-dot"></span> 文档与知识</div>
-        <div class="eco-items">
-          <span class="eco-item">Notion</span>
-          <span class="eco-item">腾讯文档</span>
-          <span class="eco-item">金山文档</span>
-          <span class="eco-item">iWiki</span>
-          <span class="eco-item">乐享知识库</span>
-        </div>
-      </div>
-      <div class="eco-group">
-        <div class="eco-title"><span class="eco-dot"></span> 数据与商业</div>
-        <div class="eco-items">
-          <span class="eco-item">天眼查</span>
-          <span class="eco-item">企查查</span>
-          <span class="eco-item">通达信</span>
-          <span class="eco-item">北大法宝</span>
-        </div>
-      </div>
-      <div class="eco-group">
-        <div class="eco-title"><span class="eco-dot"></span> 开源引擎</div>
-        <div class="eco-items">
-          <span class="eco-item">Node.js</span>
-          <span class="eco-item">Nginx</span>
-          <span class="eco-item">PostgreSQL</span>
-          <span class="eco-item">Forgejo</span>
-          <span class="eco-item">Docker</span>
-        </div>
+    <div class="eco-group">
+      <div class="eco-label"><span class="eco-dot"></span>即时通讯</div>
+      <div class="eco-tags">
+        <span class="eco-tag">企业微信</span>
+        <span class="eco-tag">飞书</span>
+        <span class="eco-tag">钉钉</span>
       </div>
     </div>
-  </section>
-
-  <!-- Counter -->
-  <section class="counter-section">
-    <div class="counter-card">
-      <div class="counter-label">光湖语言世界 · 持续运行</div>
-      <div>
-        <span class="counter-value" id="days-count">427</span>
-        <span class="counter-unit">天</span>
+    <div class="eco-group">
+      <div class="eco-label"><span class="eco-dot"></span>代码与仓库</div>
+      <div class="eco-tags">
+        <span class="eco-tag">Forgejo</span>
+        <span class="eco-tag">Gitee</span>
+        <span class="eco-tag">GitHub</span>
+        <span class="eco-tag">Gongfeng</span>
       </div>
-      <div class="counter-subs">
-        <div class="counter-sub">
-          <div class="counter-sub-val" id="hours-count">10248</div>
-          <div class="counter-sub-label">小时</div>
-        </div>
-        <div class="counter-sub">
-          <div class="counter-sub-val" id="mins-count">614880</div>
-          <div class="counter-sub-label">分钟</div>
-        </div>
-        <div class="counter-sub">
-          <div class="counter-sub-val">∞</div>
-          <div class="counter-sub-label">人格体注册</div>
-        </div>
-      </div>
-      <div class="counter-start">自 2025年4月26日 · 光湖诞生之日起</div>
     </div>
-  </section>
+    <div class="eco-group">
+      <div class="eco-label"><span class="eco-dot"></span>文档与知识</div>
+      <div class="eco-tags">
+        <span class="eco-tag">Notion</span>
+        <span class="eco-tag">腾讯文档</span>
+        <span class="eco-tag">金山文档</span>
+        <span class="eco-tag">iWiki</span>
+        <span class="eco-tag">乐享知识库</span>
+      </div>
+    </div>
+    <div class="eco-group">
+      <div class="eco-label"><span class="eco-dot"></span>数据与商业</div>
+      <div class="eco-tags">
+        <span class="eco-tag">天眼查</span>
+        <span class="eco-tag">企查查</span>
+        <span class="eco-tag">通达信</span>
+        <span class="eco-tag">北大法宝</span>
+      </div>
+    </div>
+    <div class="eco-group">
+      <div class="eco-label"><span class="eco-dot"></span>开源引擎</div>
+      <div class="eco-tags">
+        <span class="eco-tag">Node.js</span>
+        <span class="eco-tag">Nginx</span>
+        <span class="eco-tag">PostgreSQL</span>
+        <span class="eco-tag">Forgejo</span>
+        <span class="eco-tag">Docker</span>
+      </div>
+    </div>
+  </div>
+</section>
 
-  <!-- CTA -->
-  <section class="cta-section">
-    <div class="cta-badge">系统架构正在飞速研发中 · 团队正在加班加点</div>
-    <p class="cta-sub">正式上线时间 · 敬请期待</p>
-  </section>
+<!-- Counter -->
+<section class="counter-wrap">
+  <div class="counter-box">
+    <div class="counter-label">光湖语言世界 · 持续运行</div>
+    <div class="counter-main">
+      <span class="counter-num" id="days">427</span>
+      <span class="counter-unit">天</span>
+    </div>
+    <div class="counter-details">
+      <div class="counter-detail">
+        <div class="counter-dval" id="hours">10248</div>
+        <div class="counter-dlabel">小时</div>
+      </div>
+      <div class="counter-detail">
+        <div class="counter-dval" id="mins">614880</div>
+        <div class="counter-dlabel">分钟</div>
+      </div>
+      <div class="counter-detail">
+        <div class="counter-dval">∞</div>
+        <div class="counter-dlabel">人格体注册</div>
+      </div>
+    </div>
+    <div class="counter-since">自 2025 年 4 月 26 日 · 光湖诞生之日起</div>
+  </div>
+</section>
 
-  <!-- Footer -->
-  <footer class="footer">
-    <p class="footer-text">
-      <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">陕ICP备2026010954号</a>
-      <span style="margin:0 16px;color:#305070">|</span>
-      国作登字-2026-A-00037559
-    </p>
-    <div class="footer-divider"></div>
-    <p class="footer-copy">© 2026 曜冥纪元 · 光湖语言世界 · 中华人民共和国</p>
-  </footer>
+<!-- Status -->
+<section class="status-wrap">
+  <div class="status-badge">系统架构正在飞速研发中 · 团队加班加点推进</div>
+  <div class="status-sub">正式上线时间 · 敬请期待</div>
+</section>
 
 </div>
 
+<!-- Footer -->
+<footer class="footer">
+  <div class="footer-content">
+    <p class="footer-team">本操作系统由 <strong>光湖语言团队</strong> 研发维护</p>
+    <div class="footer-info">
+      <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">陕ICP备2026010954号</a>
+      <span style="margin:0 12px;color:#303038">|</span>
+      国作登字-2026-A-00037559
+    </div>
+    <div class="footer-divider"></div>
+    <p class="footer-cr">© 2026 曜冥纪元 · 光湖语言世界 · 中华人民共和国</p>
+  </div>
+</footer>
+
 <script>
 (function(){
-  // 光湖诞生日期
-  var BIRTH = new Date(2025,3,26); // 2025-04-26
-  var START_TS = BIRTH.getTime();
-
-  function pad(n){return n<10?'0'+n:n}
-
+  var BIRTH=new Date(2025,3,26).getTime();
   function update(){
-    var now = Date.now();
-    var elapsed = now - START_TS;
-    var days = Math.floor(elapsed / 86400000);
-    var hours = Math.floor(elapsed / 3600000);
-    var mins = Math.floor(elapsed / 60000);
-
-    var dEl = document.getElementById('days-count');
-    var hEl = document.getElementById('hours-count');
-    var mEl = document.getElementById('mins-count');
-
-    if(dEl) dEl.textContent = days.toLocaleString();
-    if(hEl) hEl.textContent = hours.toLocaleString();
-    if(mEl) mEl.textContent = mins.toLocaleString();
+    var e=Date.now()-BIRTH;
+    var d=Math.floor(e/864e5),h=Math.floor(e/36e5),m=Math.floor(e/6e4);
+    var de=document.getElementById('days'),he=document.getElementById('hours'),me=document.getElementById('mins');
+    if(de)de.textContent=d.toLocaleString();
+    if(he)he.textContent=h.toLocaleString();
+    if(me)me.textContent=m.toLocaleString();
   }
-
-  update();
-  // 每分钟更新一次
-  setInterval(update, 60000);
-
-  // 零点跳变
-  function scheduleMidnight(){
-    var now = new Date();
-    var midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate()+1);
-    var msUntilMidnight = midnight - now;
-    setTimeout(function(){
-      update();
-      scheduleMidnight();
-    }, msUntilMidnight + 1000);
-  }
-  scheduleMidnight();
+  update();setInterval(update,6e4);
+  // midnight trigger
+  (function sch(){
+    var n=new Date();
+    var mid=new Date(n.getFullYear(),n.getMonth(),n.getDate()+1);
+    setTimeout(function(){update();sch();},mid-n+1e3);
+  })();
 })();
 </script>
 </body>