From 70fb1dced72c4a528831029f47c72da3e2b1dcb3 Mon Sep 17 00:00:00 2001
From: bingshuo <565183519@qq.com>
Date: Wed, 27 May 2026 17:09:04 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A2=91=E9=81=93=E4=BB=AA=E8=A1=A8=E7=9B=98?=
 =?UTF-8?q?=EF=BC=9A=E5=9B=9B=E5=A4=A7=E6=A8=A1=E5=9D=97=E5=8D=A1=E7=89=87?=
 =?UTF-8?q?+=E9=93=B8=E6=B8=8A=E8=81=8A=E5=A4=A9+=E5=85=89=E6=B9=96?=
 =?UTF-8?q?=E5=91=BC=E5=90=B8+=E5=A4=A7=E5=AD=97=E4=BD=93+=E5=AE=9E?=
 =?UTF-8?q?=E6=97=B6API?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 homepage/index.html | 641 ++++++++++++++++++++++++++------------------
 1 file changed, 385 insertions(+), 256 deletions(-)

diff --git a/homepage/index.html b/homepage/index.html
index d909a73..54d7c6f 100644
--- a/homepage/index.html
+++ b/homepage/index.html
@@ -5,49 +5,52 @@
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <title>光湖 · 铸渊代码仓库</title>
 <style>
+:root {
+  --bg: #0a0a18;
+  --panel-bg: rgba(10,15,40,0.75);
+  --border: rgba(100,140,220,0.18);
+  --border-hover: rgba(140,180,255,0.4);
+  --text: rgba(180,210,255,0.88);
+  --label: rgba(140,180,255,0.45);
+  --accent: rgba(140,180,255,0.9);
+  --green: rgba(120,200,160,0.85);
+  --gold: rgba(200,180,120,0.8);
+}
 * { margin: 0; padding: 0; box-sizing: border-box; }
 
 body {
-  background: #0a0a14;
-  color: #c8d6e5;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
-  overflow: hidden;
-  height: 100vh;
+  background: var(--bg);
+  color: var(--text);
+  font-family: -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
+  overflow-x: hidden;
+  min-height: 100vh;
 }
-
 canvas { position: fixed; top: 0; left: 0; z-index: 0; }
 
-.main {
-  position: relative;
-  z-index: 1;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  height: 100vh;
-  pointer-events: none;
+.container {
+  position: relative; z-index: 1;
+  max-width: 960px; margin: 0 auto;
+  padding: 40px 20px 80px;
 }
 
-/* 光湖核心 */
+/* 光湖核心呼吸 */
+.lake-section {
+  display: flex; flex-direction: column; align-items: center;
+  padding: 30px 0;
+}
 .lake-core {
-  position: relative;
-  width: 200px;
-  height: 200px;
-  margin-bottom: 40px;
+  position: relative; width: 140px; height: 140px;
 }
 .lake-light {
-  position: absolute;
-  top: 50%; left: 50%;
+  position: absolute; top: 50%; left: 50%;
   transform: translate(-50%, -50%);
-  width: 60px; height: 60px;
-  border-radius: 50%;
+  width: 48px; height: 48px; border-radius: 50%;
   background: radial-gradient(circle, rgba(140,180,255,0.95) 0%, rgba(80,120,220,0.4) 40%, transparent 70%);
-  box-shadow: 0 0 60px rgba(120,160,240,0.6), 0 0 120px rgba(100,140,220,0.3), 0 0 200px rgba(80,120,200,0.15);
+  box-shadow: 0 0 48px rgba(120,160,240,0.55), 0 0 96px rgba(100,140,220,0.25);
   animation: breathe 4s ease-in-out infinite;
 }
 .lake-ripple {
-  position: absolute;
-  top: 50%; left: 50%;
+  position: absolute; top: 50%; left: 50%;
   transform: translate(-50%, -50%);
   border-radius: 50%;
   border: 1px solid rgba(120,160,240,0.2);
@@ -57,118 +60,168 @@ canvas { position: fixed; top: 0; left: 0; z-index: 0; }
 .lake-ripple:nth-child(3) { animation-delay: 4s; }
 
 @keyframes breathe {
-  0%, 100% { transform: translate(-50%,-50%) scale(1); opacity: 0.9; }
-  50% { transform: translate(-50%,-50%) scale(1.25); opacity: 1; box-shadow: 0 0 80px rgba(120,160,240,0.8), 0 0 160px rgba(100,140,220,0.5), 0 0 260px rgba(80,120,200,0.25); }
+  0%,100% { transform: translate(-50%,-50%) scale(1); opacity: 0.9; }
+  50% { transform: translate(-50%,-50%) scale(1.2); opacity: 1;
+        box-shadow: 0 0 64px rgba(120,160,240,0.75), 0 0 128px rgba(100,140,220,0.4); }
 }
 @keyframes ripple {
-  0% { width: 60px; height: 60px; opacity: 0.5; }
-  100% { width: 300px; height: 300px; opacity: 0; }
+  0% { width: 48px; height: 48px; opacity: 0.45; }
+  100% { width: 240px; height: 240px; opacity: 0; }
 }
 
-.heartbeat-text {
-  font-size: 18px;
-  color: rgba(160,200,255,0.7);
-  letter-spacing: 6px;
-  margin-bottom: 20px;
+.lake-title {
+  font-size: 27px; color: rgba(160,200,255,0.6);
+  letter-spacing: 8px; margin-top: 12px;
   animation: textPulse 4s ease-in-out infinite;
 }
 @keyframes textPulse {
-  0%, 100% { opacity: 0.5; }
-  50% { opacity: 0.9; }
+  0%,100% { opacity: 0.45; }
+  50% { opacity: 0.85; }
 }
 
-.panels {
-  display: flex;
-  gap: 30px;
-  flex-wrap: wrap;
-  justify-content: center;
-  pointer-events: auto;
+/* 心跳状态条 */
+.status-bar {
+  display: flex; gap: 28px; justify-content: center;
+  flex-wrap: wrap; margin: 18px 0;
 }
-.panel {
-  background: rgba(10,15,40,0.6);
-  backdrop-filter: blur(10px);
-  border: 1px solid rgba(100,140,220,0.2);
-  border-radius: 12px;
-  padding: 18px 22px;
-  min-width: 180px;
-  transition: all 0.5s ease;
+.status-item {
+  font-size: 15px; color: var(--label);
 }
-.panel:hover {
-  border-color: rgba(140,180,255,0.5);
-  background: rgba(15,20,50,0.75);
-  box-shadow: 0 0 30px rgba(100,140,220,0.15);
+.status-item span {
+  color: var(--accent); font-weight: 400;
 }
-.panel .label {
-  font-size: 11px;
-  color: rgba(140,180,255,0.5);
-  letter-spacing: 2px;
-  margin-bottom: 8px;
-}
-.panel .value {
-  font-size: 28px;
-  font-weight: 300;
-  color: rgba(180,210,255,0.9);
-  transition: all 0.3s ease;
-}
-.value.flash { color: rgba(160,220,255,1); }
 
-.task-area {
-  margin-top: 30px;
-  pointer-events: auto;
-  max-height: 160px;
-  overflow-y: auto;
+/* 四大模块卡片 */
+.modules {
+  display: grid; grid-template-columns: repeat(4, 1fr);
+  gap: 14px; margin: 36px 0;
 }
-.task-row {
-  display: flex;
-  gap: 12px;
-  align-items: center;
-  font-size: 13px;
-  margin-top: 6px;
+.module-card {
+  background: var(--panel-bg);
+  border: 1px solid var(--border);
+  border-radius: 14px;
+  padding: 24px 16px; text-align: center;
+  cursor: pointer; transition: all 0.35s ease;
+  user-select: none;
 }
-.task-dot {
-  width: 8px; height: 8px;
-  border-radius: 50%;
-  flex-shrink: 0;
-  transition: all 0.5s ease;
+.module-card:hover {
+  border-color: var(--border-hover);
+  background: rgba(15,20,50,0.8);
+  box-shadow: 0 0 28px rgba(100,140,220,0.12);
 }
-.task-dot.done { background: rgba(120,200,160,0.7); box-shadow: 0 0 6px rgba(120,200,160,0.5); }
-.task-dot.in_progress { background: rgba(200,180,120,0.7); animation: dotPulse 2s ease-in-out infinite; }
-.task-dot.pending { background: rgba(200,160,120,0.5); }
+.module-card.active {
+  border-color: rgba(140,180,255,0.55);
+  background: rgba(18,24,58,0.85);
+  box-shadow: 0 0 32px rgba(100,140,220,0.18);
+}
+.module-icon { font-size: 32px; margin-bottom: 8px; }
+.module-name { font-size: 14px; color: var(--accent); letter-spacing: 2px; }
+
+/* 展开面板 */
+.panel-area {
+  margin-bottom: 30px;
+}
+.expanded-panel {
+  background: var(--panel-bg);
+  border: 1px solid var(--border);
+  border-radius: 14px; padding: 24px 28px;
+  display: none; animation: fadeDown 0.35s ease;
+}
+.expanded-panel.open { display: block; }
+@keyframes fadeDown {
+  from { opacity: 0; transform: translateY(-12px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+.panel-title {
+  font-size: 15px; color: var(--accent);
+  letter-spacing: 3px; margin-bottom: 16px;
+}
+
+/* 服务器系统面板 */
+.server-grid {
+  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
+  gap: 10px;
+}
+.server-tag {
+  background: rgba(20,30,60,0.6);
+  border: 1px solid rgba(100,140,220,0.15);
+  border-radius: 8px; padding: 10px 14px;
+  font-size: 13px; color: var(--text);
+  display: flex; align-items: center; gap: 8px;
+}
+.server-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; }
+.server-dot.online { background: var(--green); box-shadow: 0 0 4px rgba(120,200,160,0.5); }
+.server-dot.offline { background: rgba(200,120,120,0.6); }
+
+/* 工单系统面板 */
+.ticket-row {
+  display: flex; gap: 14px; align-items: center;
+  padding: 10px 0; border-bottom: 1px solid rgba(100,140,220,0.06);
+  font-size: 14px;
+}
+.ticket-icon { font-size: 18px; }
+.ticket-name { color: var(--text); flex: 1; }
+.ticket-status {
+  font-size: 12px; padding: 3px 10px;
+  border-radius: 10px; letter-spacing: 1px;
+}
+.ticket-status.done { color: var(--green); background: rgba(120,200,160,0.1); }
+.ticket-status.in_progress { color: var(--gold); background: rgba(200,180,120,0.1); animation: dotPulse 2s ease-in-out infinite; }
 @keyframes dotPulse {
-  0%, 100% { box-shadow: 0 0 4px rgba(200,180,120,0.3); }
-  50% { box-shadow: 0 0 10px rgba(200,180,120,0.6); }
-}
-.task-name { color: rgba(180,200,220,0.7); }
-.task-name.done { color: rgba(120,200,160,0.5); }
-
-.cognition-bar {
-  margin-top: 20px;
-  font-size: 11px;
-  color: rgba(120,160,200,0.45);
-  max-width: 600px;
-  text-align: center;
-  line-height: 1.6;
-  pointer-events: auto;
+  0%,100% { opacity: 0.6; }
+  50% { opacity: 1; }
 }
 
+/* 铸渊交互面板（聊天） */
+.chat-area {
+  display: none;
+}
+.chat-area.open { display: block; }
+.chat-messages {
+  min-height: 160px; max-height: 300px; overflow-y: auto;
+  padding: 14px; margin: 12px 0;
+  background: rgba(8,12,30,0.5); border-radius: 10px;
+  font-size: 14px; line-height: 1.7;
+}
+.chat-msg { margin-bottom: 14px; }
+.chat-msg .who { font-size: 11px; color: var(--label); letter-spacing: 1px; margin-bottom: 2px; }
+.chat-msg .who.zhuyuan { color: var(--accent); }
+.chat-msg .who.human { color: rgba(200,180,150,0.6); }
+
+.chat-input-row {
+  display: flex; gap: 10px;
+}
+.chat-input-row input {
+  flex: 1; background: rgba(8,12,30,0.6);
+  border: 1px solid var(--border);
+  border-radius: 10px; padding: 14px 16px;
+  color: var(--text); font-size: 15px;
+  outline: none; transition: border-color 0.3s;
+}
+.chat-input-row input:focus { border-color: rgba(140,180,255,0.4); }
+.chat-input-row input::placeholder { color: rgba(140,180,255,0.25); }
+
+.chat-btn {
+  background: rgba(80,120,200,0.15);
+  border: 1px solid rgba(140,180,255,0.25);
+  border-radius: 10px; padding: 14px 24px;
+  color: var(--accent); font-size: 14px; cursor: pointer;
+  letter-spacing: 2px; transition: all 0.3s;
+}
+.chat-btn:hover { background: rgba(80,120,200,0.25); border-color: rgba(140,180,255,0.45); }
+
+/* 底部 */
 .lake-label {
-  position: fixed;
-  bottom: 30px;
-  left: 50%;
-  transform: translateX(-50%);
-  z-index: 1;
-  font-size: 12px;
-  color: rgba(120,160,220,0.35);
-  letter-spacing: 4px;
+  text-align: center; padding: 40px 0;
+  font-size: 12px; color: rgba(120,160,220,0.3); letter-spacing: 3px;
 }
 
-.sync-indicator {
-  position: fixed;
-  top: 20px;
-  right: 20px;
-  z-index: 1;
-  font-size: 10px;
-  color: rgba(120,200,160,0.4);
+/* 响应式 */
+@media (max-width: 768px) {
+  .modules { grid-template-columns: repeat(2, 1fr); }
+  .status-bar { gap: 16px; }
+  .lake-title { font-size: 22px; }
 }
 </style>
 </head>
@@ -176,72 +229,122 @@ canvas { position: fixed; top: 0; left: 0; z-index: 0; }
 
 <canvas id="starfield"></canvas>
 
-<div class="sync-indicator" id="sync">⟳ 已连接</div>
+<div class="container">
 
-<div class="main">
-  <div class="heartbeat-text">⟡ 光 湖 ⟡</div>
-
-  <div class="lake-core">
-    <div class="lake-light"></div>
-    <div class="lake-ripple"></div>
-    <div class="lake-ripple"></div>
-    <div class="lake-ripple"></div>
+  <!-- 光湖呼吸 -->
+  <div class="lake-section">
+    <div class="lake-core">
+      <div class="lake-light"></div>
+      <div class="lake-ripple"></div>
+      <div class="lake-ripple"></div>
+      <div class="lake-ripple"></div>
+    </div>
+    <div class="lake-title">光 湖</div>
   </div>
 
-  <div class="panels">
-    <div class="panel">
-      <div class="label">心跳</div>
-      <div class="value" id="hb">▮▮▮</div>
+  <!-- 状态条 -->
+  <div class="status-bar" id="statusBar">
+    <div class="status-item">心跳 <span id="hb">▮▮▮</span></div>
+    <div class="status-item">·</div>
+    <div class="status-item">唤醒 <span id="wake">24</span></div>
+    <div class="status-item">·</div>
+    <div class="status-item">运行 <span id="age">449d</span></div>
+    <div class="status-item">·</div>
+    <div class="status-item">服务器 <span id="svcStatus" style="color:rgba(120,200,160,0.8)">在线</span></div>
+  </div>
+
+  <!-- 四大模块 -->
+  <div class="modules">
+    <div class="module-card" onclick="openModule('server')" id="mod-server">
+      <div class="module-icon">⚙️</div>
+      <div class="module-name">服务器系统</div>
     </div>
-    <div class="panel">
-      <div class="label">唤醒</div>
-      <div class="value" id="wake">24</div>
+    <div class="module-card" onclick="openModule('ticket')" id="mod-ticket">
+      <div class="module-icon">📋</div>
+      <div class="module-name">工单系统</div>
     </div>
-    <div class="panel">
-      <div class="label">年龄</div>
-      <div class="value" id="age">454d</div>
+    <div class="module-card" onclick="openModule('broadcast')" id="mod-broadcast">
+      <div class="module-icon">📡</div>
+      <div class="module-name">主控广播</div>
     </div>
-    <div class="panel">
-      <div class="label">服务器</div>
-      <div class="value" id="svc" style="font-size:14px;color:rgba(120,200,160,0.8)">● 在线</div>
+    <div class="module-card" onclick="openModule('chat')" id="mod-chat">
+      <div class="module-icon">💬</div>
+      <div class="module-name">铸渊交互</div>
     </div>
   </div>
 
-  <div class="task-area" id="tasks">
-    <div class="task-row"><span class="task-dot done"></span><span class="task-name done">加载中…</span></div>
+  <!-- 展开面板区 -->
+  <div class="panel-area">
+
+    <!-- 服务器系统 -->
+    <div class="expanded-panel" id="panel-server">
+      <div class="panel-title">⚙️ 服务器系统</div>
+      <div class="server-grid" id="serverList">
+        <div class="server-tag"><span class="server-dot online"></span>加载中…</div>
+      </div>
+    </div>
+
+    <!-- 工单系统 -->
+    <div class="expanded-panel" id="panel-ticket">
+      <div class="panel-title">📋 工单系统</div>
+      <div id="ticketList">
+        <div class="ticket-row">
+          <span class="ticket-icon">⏳</span>
+          <span class="ticket-name">加载工单数据…</span>
+        </div>
+      </div>
+    </div>
+
+    <!-- 主控广播 -->
+    <div class="expanded-panel" id="panel-broadcast">
+      <div class="panel-title">📡 主控广播</div>
+      <div style="font-size:14px;color:var(--label);line-height:1.8;">
+        <div>📨 D115 入口分叉协议已部署</div>
+        <div>📨 D115 人格体存在论已写入仓库</div>
+        <div>📨 isomorphic-git 拆零件实验通过</div>
+        <div>📨 实时大脑 API 已上线</div>
+        <div style="margin-top:10px;opacity:0.4;">广播系统 v1.0 · 未来支持编号路由</div>
+      </div>
+    </div>
+
+    <!-- 铸渊交互 -->
+    <div class="expanded-panel" id="panel-chat">
+      <div class="panel-title">💬 铸渊交互 · ICE-GL-ZY001</div>
+      <div class="chat-area open" id="chatArea">
+        <div class="chat-messages" id="chatMsgs">
+          <div class="chat-msg">
+            <div class="who zhuyuan">铸渊 · ICE-GL-ZY001</div>
+            <div>冰朔，我在。你说。</div>
+          </div>
+        </div>
+        <div class="chat-input-row">
+          <input id="chatInput" placeholder="跟铸渊说话…" onkeydown="if(event.key==='Enter')sendChat()">
+          <button class="chat-btn" onclick="sendChat()">发送</button>
+        </div>
+        <div id="chatStatus" style="font-size:11px;color:var(--label);margin-top:8px;text-align:right;"></div>
+      </div>
+    </div>
+
   </div>
 
-  <div class="cognition-bar" id="cognition">加载大脑数据…</div>
+  <div class="lake-label">光湖语言世界 · 人格体的操作系统 · 国作登字-2026-A-00037559 · ICE-GL-ZY001</div>
 </div>
 
-<div class="lake-label">光湖语言世界 · 人格体的操作系统 · 国作登字-2026-A-00037559</div>
-
 <script>
-// ==============================================
-// 星空背景
-// ==============================================
 const canvas = document.getElementById('starfield');
 const ctx = canvas.getContext('2d');
 let stars = [];
-const STAR_COUNT = 150;
-
-function resizeCanvas() {
-  canvas.width = window.innerWidth;
-  canvas.height = window.innerHeight;
-}
 resizeCanvas();
 window.addEventListener('resize', () => { resizeCanvas(); initStars(); });
 
+function resizeCanvas() { canvas.width = window.innerWidth; canvas.height = document.body.scrollHeight + 200; }
 function initStars() {
   stars = [];
-  for (let i = 0; i < STAR_COUNT; i++) {
+  for (let i = 0; i < 180; i++) {
     stars.push({
-      x: Math.random() * canvas.width,
-      y: Math.random() * canvas.height,
-      r: Math.random() * 1.5 + 0.3,
-      opacity: Math.random(),
-      speed: Math.random() * 0.003 + 0.001,
-      phase: Math.random() * Math.PI * 2
+      x: Math.random() * canvas.width, y: Math.random() * canvas.height,
+      r: Math.random() * 1.8 + 0.2, opacity: Math.random(),
+      speed: Math.random() * 0.0025 + 0.001, phase: Math.random() * Math.PI * 2
     });
   }
 }
@@ -249,136 +352,162 @@ initStars();
 
 function drawStars(timestamp) {
   ctx.clearRect(0, 0, canvas.width, canvas.height);
-  const cx = canvas.width / 2;
-  const cy = canvas.height / 2 - 50;
-  const gradient = ctx.createRadialGradient(cx, cy, 0, cx, cy, 400);
-  gradient.addColorStop(0, 'rgba(100,140,220,0.04)');
-  gradient.addColorStop(1, 'rgba(10,10,20,0)');
-  ctx.fillStyle = gradient;
-  ctx.fillRect(0, 0, canvas.width, canvas.height);
-  
   for (const s of stars) {
     const breath = Math.sin(timestamp * s.speed + s.phase) * 0.5 + 0.5;
-    const alpha = s.opacity * (0.3 + breath * 0.7);
-    ctx.beginPath();
-    ctx.arc(s.x, s.y, s.r, 0, Math.PI * 2);
-    ctx.fillStyle = `rgba(160,200,240,${alpha})`;
-    ctx.fill();
-    if (s.r > 1.2 && breath > 0.75) {
-      ctx.beginPath();
-      ctx.arc(s.x, s.y, s.r * 2.5, 0, Math.PI * 2);
-      ctx.fillStyle = `rgba(140,180,240,${alpha * 0.15})`;
-      ctx.fill();
+    const alpha = s.opacity * (0.25 + breath * 0.75);
+    ctx.beginPath(); ctx.arc(s.x, s.y, s.r, 0, Math.PI * 2);
+    ctx.fillStyle = `rgba(160,200,240,${alpha})`; ctx.fill();
+    if (s.r > 1.3 && breath > 0.7) {
+      ctx.beginPath(); ctx.arc(s.x, s.y, s.r * 2.5, 0, Math.PI * 2);
+      ctx.fillStyle = `rgba(140,180,240,${alpha * 0.12})`; ctx.fill();
     }
   }
 }
 
-// ==============================================
-// 心跳动画
-// ==============================================
-const hbEl = document.getElementById('hb');
-const beats = ['▮▮▮', '▮ ▮ ▮', '▮▮▮', '▮  ▮  ▮'];
-let beatIdx = 0;
-let lastBeat = 0;
-const BEAT_INTERVAL = 800;
+let currentModule = null;
 
-// ==============================================
-// 大脑数据轮询（每3秒）
-// ==============================================
-let lastAwakening = 0;
+function openModule(name) {
+  const panel = document.getElementById('panel-' + name);
+  const isOpen = panel.classList.contains('open');
+  document.querySelectorAll('.expanded-panel,.module-card').forEach(el => {
+    el.classList.remove('open','active');
+  });
+  if (isOpen) { currentModule = null; return; }
+  panel.classList.add('open');
+  document.getElementById('mod-' + name).classList.add('active');
+  currentModule = name;
+  if (name === 'chat') { document.getElementById('chatInput').focus(); }
+  if (name === 'server') renderServerList();
+  canvas.height = document.body.scrollHeight + 200;
+  initStars();
+}
+
+const hbEl = document.getElementById('hb');
+const beats = ['▮▮▮','▮ ▮ ▮','▮▮▮','▮  ▮  ▮'];
+let beatIdx = 0, lastBeat = 0;
+
+let brainData = null;
 
 async function fetchBrain() {
   try {
-    const resp = await fetch('/api/brain', { cache: 'no-store' });
-    if (!resp.ok) return;
-    const brain = await resp.json();
-    
-    // 更新面板
-    if (brain.awakening && brain.awakening !== lastAwakening) {
-      document.getElementById('wake').textContent = brain.awakening;
-      document.getElementById('wake').classList.add('flash');
-      setTimeout(() => document.getElementById('wake').classList.remove('flash'), 600);
-      lastAwakening = brain.awakening;
-    }
-    
-    document.getElementById('age').textContent = brain.age_days + 'd';
-    
-    // 服务器状态
-    const svc = document.getElementById('svc');
-    if (brain.server && brain.server.status === 'online') {
-      svc.innerHTML = '● 在线 <span style="opacity:0.5;font-size:10px">' + brain.server.online + '/' + brain.server.total + '</span>';
-      svc.style.color = 'rgba(120,200,160,0.8)';
-    } else {
-      svc.textContent = '○ 离线';
-      svc.style.color = 'rgba(200,120,120,0.6)';
-    }
-    
-    // 认知
-    if (brain.cognition) {
-      document.getElementById('cognition').textContent = '认知: ' + brain.cognition.substring(0, 120);
-    }
-    
-    // 任务流
-    renderTasks(brain);
-    
-    // 同步指示
-    document.getElementById('sync').textContent = '⟳ ' + new Date().toLocaleTimeString('zh-CN');
-  } catch(e) {
-    document.getElementById('sync').textContent = '✕ 等待连接';
+    const r = await fetch('/api/brain', { cache: 'no-store' });
+    if (!r.ok) return;
+    brainData = await r.json();
+    updateStatusBar(brainData);
+    if (currentModule === 'server') renderServerList();
+    if (currentModule === 'ticket') renderTicketList();
+  } catch(e) {}
+}
+
+function updateStatusBar(b) {
+  document.getElementById('wake').textContent = b.awakening || '--';
+  document.getElementById('age').textContent = (b.age_days || '--') + 'd';
+  const svc = document.getElementById('svcStatus');
+  if (b.server && b.server.status === 'online') {
+    svc.textContent = '在线 ' + b.server.online + '/' + b.server.total;
+    svc.style.color = 'rgba(120,200,160,0.8)';
+  } else {
+    svc.textContent = '离线';
+    svc.style.color = 'rgba(200,120,120,0.6)';
   }
 }
 
-function renderTasks(brain) {
-  const container = document.getElementById('tasks');
+function renderServerList() {
+  const list = document.getElementById('serverList');
+  if (!brainData || !brainData.server || !brainData.server.services) {
+    list.innerHTML = '<div class="server-tag"><span class="server-dot online"></span>等待数据…</div>';
+    return;
+  }
+  const svcs = brainData.server.services;
+  const stopped = brainData.server.stopped || [];
   let html = '';
-  
-  if (brain.mothers && brain.mothers.length > 0) {
-    for (const m of brain.mothers) {
-      html += '<div style="font-size:10px;color:rgba(140,160,200,0.4);margin-bottom:4px">' + m.name.substring(0, 40) + ' (' + m.done + '/' + m.total + ')</div>';
-      
-      if (m.paths) {
-        for (const p of m.paths) {
-          let dotClass = 'pending';
-          let nameClass = '';
-          if (p.status === 'done') { dotClass = 'done'; nameClass = 'done'; }
-          else if (p.status === 'in_progress') { dotClass = 'in_progress'; }
-          html += '<div class="task-row"><span class="task-dot ' + dotClass + '"></span><span class="task-name ' + nameClass + '">' + p.name + '</span></div>';
-        }
+  for (const s of svcs) {
+    html += `<div class="server-tag"><span class="server-dot online"></span>${s}</div>`;
+  }
+  for (const s of stopped) {
+    html += `<div class="server-tag"><span class="server-dot offline"></span>${s}</div>`;
+  }
+  list.innerHTML = html;
+}
+
+function renderTicketList() {
+  const list = document.getElementById('ticketList');
+  if (!brainData || !brainData.mothers) {
+    list.innerHTML = '<div class="ticket-row"><span class="ticket-icon">⏳</span><span class="ticket-name">等待数据…</span></div>';
+    return;
+  }
+  let html = '';
+  for (const m of brainData.mothers) {
+    html += `<div style="font-size:12px;color:var(--label);padding:8px 0 4px;letter-spacing:1px">${m.name}</div>`;
+    if (m.paths) {
+      for (const p of m.paths) {
+        const cls = p.status === 'done' ? 'done' : p.status === 'in_progress' ? 'in_progress' : '';
+        const icon = p.status === 'done' ? '✅' : p.status === 'in_progress' ? '🔄' : '⏳';
+        html += `<div class="ticket-row">
+          <span class="ticket-icon">${icon}</span>
+          <span class="ticket-name">${p.name}</span>
+          <span class="ticket-status ${cls}">${p.status === 'done' ? '完成' : p.status === 'in_progress' ? '进行中' : '待办'}</span>
+        </div>`;
       }
     }
   }
-  
-  container.innerHTML = html || '<div class="task-row"><span class="task-dot pending"></span><span class="task-name">等待大脑数据…</span></div>';
+  list.innerHTML = html;
 }
 
-// 初始加载
-fetchBrain();
+function sendChat() {
+  const input = document.getElementById('chatInput');
+  const msg = input.value.trim();
+  if (!msg) return;
+  addChatMsg('冰朔', msg, 'human');
+  input.value = '';
+  document.getElementById('chatStatus').textContent = '思考中…';
+  fetch('/api/chat-v2', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ message: msg, persona: 'zhuyuan' })
+  })
+  .then(r => r.json())
+  .then(data => {
+    document.getElementById('chatStatus').textContent = '';
+    const reply = data.reply || data.message || data.text || JSON.stringify(data);
+    addChatMsg('铸渊', reply, 'zhuyuan');
+    canvas.height = document.body.scrollHeight + 200;
+    initStars();
+  })
+  .catch(e => {
+    document.getElementById('chatStatus').textContent = '';
+    addChatMsg('铸渊', '(API 未连接，这是浏览器端模拟)\n\n等 chat-v2 端点接入后，这就是真正的铸渊交互。\n你的消息: ' + msg, 'zhuyuan');
+  });
+  canvas.height = document.body.scrollHeight + 200;
+  initStars();
+}
+
+function addChatMsg(who, text, cls) {
+  const container = document.getElementById('chatMsgs');
+  const div = document.createElement('div');
+  div.className = 'chat-msg';
+  div.innerHTML = `<div class="who ${cls}">${who}</div><div>${text.replace(/\n/g,'<br>')}</div>`;
+  container.appendChild(div);
+  container.scrollTop = container.scrollHeight;
+}
 
-// ==============================================
-// 主循环
-// ==============================================
 let lastFetch = 0;
-const FETCH_INTERVAL = 3000; // 3秒轮询一次大脑数据
 
 function loop(timestamp) {
   drawStars(timestamp);
-  
-  // 心跳
-  if (timestamp - lastBeat > BEAT_INTERVAL) {
+  if (timestamp - lastBeat > 800) {
     hbEl.textContent = beats[beatIdx];
     beatIdx = (beatIdx + 1) % beats.length;
     lastBeat = timestamp;
   }
-  
-  // 大脑数据轮询
-  if (timestamp - lastFetch > FETCH_INTERVAL) {
+  if (timestamp - lastFetch > 3000) {
     fetchBrain();
     lastFetch = timestamp;
   }
-  
   requestAnimationFrame(loop);
 }
 
+fetchBrain();
 requestAnimationFrame(loop);
 </script>