- 大桌子(Main Context): 意识大脑+结构化目录+对话压缩 - 小桌子(External Context): Agent小分队+工具桌+记忆库 - 数据流动画: 冰朔说话→铸渊理解→Agent检索→回复→压缩 - 多模型切换: 同一套桌子,Agent搬到不同模型 - 写作飞轮: 码字软件写入+结构化压缩+反馈提炼技能大脑
478 lines
15 KiB
HTML
478 lines
15 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>光湖 · 大桌子小桌子 · 人格体数据库</title>
|
||
<style>
|
||
:root {
|
||
--bg: #0d1117;
|
||
--surface: #161b22;
|
||
--border: #30363d;
|
||
--text: #c9d1d9;
|
||
--muted: #8b949e;
|
||
--accent: #58a6ff;
|
||
--gold: #d2991d;
|
||
--green: #3fb950;
|
||
--purple: #bc8cff;
|
||
--red: #f85149;
|
||
--big-desk: #1a2332;
|
||
--small-desk: #1a1e2e;
|
||
--agent-color: #58a6ff;
|
||
}
|
||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||
body {
|
||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
||
background: var(--bg);
|
||
color: var(--text);
|
||
min-height: 100vh;
|
||
overflow-x: hidden;
|
||
}
|
||
|
||
/* 顶部导航 */
|
||
.topbar {
|
||
background: var(--surface);
|
||
border-bottom: 1px solid var(--border);
|
||
padding: 16px 32px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
position: sticky;
|
||
top: 0;
|
||
z-index: 100;
|
||
}
|
||
.topbar h1 {
|
||
font-size: 20px;
|
||
font-weight: 600;
|
||
background: linear-gradient(135deg, var(--accent), var(--purple));
|
||
-webkit-background-clip: text;
|
||
-webkit-text-fill-color: transparent;
|
||
}
|
||
.topbar .badge {
|
||
background: rgba(63,185,80,0.15);
|
||
color: var(--green);
|
||
padding: 4px 12px;
|
||
border-radius: 12px;
|
||
font-size: 12px;
|
||
font-weight: 600;
|
||
}
|
||
|
||
/* 主布局 */
|
||
.main {
|
||
display: grid;
|
||
grid-template-columns: 1fr 1fr;
|
||
gap: 24px;
|
||
padding: 32px;
|
||
max-width: 1400px;
|
||
margin: 0 auto;
|
||
}
|
||
@media (max-width: 900px) {
|
||
.main { grid-template-columns: 1fr; }
|
||
}
|
||
|
||
/* 卡片 */
|
||
.card {
|
||
background: var(--surface);
|
||
border: 1px solid var(--border);
|
||
border-radius: 12px;
|
||
padding: 24px;
|
||
}
|
||
.card.full {
|
||
grid-column: 1 / -1;
|
||
}
|
||
.card h2 {
|
||
font-size: 18px;
|
||
margin-bottom: 16px;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
}
|
||
.card h2 .icon { font-size: 24px; }
|
||
|
||
/* 大桌子 */
|
||
.big-desk-area {
|
||
background: var(--big-desk);
|
||
border: 2px solid var(--accent);
|
||
border-radius: 12px;
|
||
padding: 20px;
|
||
min-height: 200px;
|
||
position: relative;
|
||
}
|
||
.big-desk-label {
|
||
position: absolute;
|
||
top: -12px;
|
||
left: 16px;
|
||
background: var(--accent);
|
||
color: #fff;
|
||
padding: 2px 12px;
|
||
border-radius: 8px;
|
||
font-size: 12px;
|
||
font-weight: 700;
|
||
}
|
||
.desk-item {
|
||
background: rgba(88,166,255,0.1);
|
||
border: 1px solid rgba(88,166,255,0.2);
|
||
border-radius: 8px;
|
||
padding: 12px;
|
||
margin-bottom: 8px;
|
||
font-size: 13px;
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8px;
|
||
}
|
||
.desk-item .tag {
|
||
font-size: 10px;
|
||
padding: 2px 6px;
|
||
border-radius: 4px;
|
||
font-weight: 600;
|
||
}
|
||
.tag-core { background: rgba(188,140,255,0.2); color: var(--purple); }
|
||
.tag-dir { background: rgba(210,153,29,0.2); color: var(--gold); }
|
||
.tag-chat { background: rgba(63,185,80,0.2); color: var(--green); }
|
||
|
||
/* 小桌子 */
|
||
.small-desk-area {
|
||
background: var(--small-desk);
|
||
border: 2px solid var(--purple);
|
||
border-radius: 12px;
|
||
padding: 20px;
|
||
min-height: 200px;
|
||
position: relative;
|
||
}
|
||
.small-desk-label {
|
||
position: absolute;
|
||
top: -12px;
|
||
left: 16px;
|
||
background: var(--purple);
|
||
color: #fff;
|
||
padding: 2px 12px;
|
||
border-radius: 8px;
|
||
font-size: 12px;
|
||
font-weight: 700;
|
||
}
|
||
|
||
/* Agent */
|
||
.agent-row {
|
||
display: flex;
|
||
gap: 12px;
|
||
flex-wrap: wrap;
|
||
margin-top: 12px;
|
||
}
|
||
.agent-card {
|
||
background: rgba(88,166,255,0.08);
|
||
border: 1px solid rgba(88,166,255,0.2);
|
||
border-radius: 8px;
|
||
padding: 10px 14px;
|
||
font-size: 12px;
|
||
flex: 1;
|
||
min-width: 100px;
|
||
text-align: center;
|
||
}
|
||
.agent-card .agent-icon { font-size: 20px; margin-bottom: 4px; }
|
||
.agent-card .agent-name { font-weight: 600; color: var(--accent); }
|
||
.agent-card .agent-role { font-size: 10px; color: var(--muted); margin-top: 2px; }
|
||
|
||
/* 工具桌 */
|
||
.tool-desk {
|
||
background: rgba(210,153,29,0.05);
|
||
border: 1px solid rgba(210,153,29,0.2);
|
||
border-radius: 8px;
|
||
padding: 12px;
|
||
margin-top: 12px;
|
||
}
|
||
.tool-item {
|
||
display: inline-block;
|
||
background: rgba(210,153,29,0.1);
|
||
border: 1px solid rgba(210,153,29,0.3);
|
||
border-radius: 6px;
|
||
padding: 4px 10px;
|
||
margin: 3px;
|
||
font-size: 11px;
|
||
color: var(--gold);
|
||
}
|
||
|
||
/* 流程动画 */
|
||
.flow {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 16px;
|
||
padding: 16px 0;
|
||
flex-wrap: wrap;
|
||
justify-content: center;
|
||
}
|
||
.flow-step {
|
||
background: var(--surface);
|
||
border: 1px solid var(--border);
|
||
border-radius: 8px;
|
||
padding: 12px 16px;
|
||
text-align: center;
|
||
font-size: 13px;
|
||
}
|
||
.flow-arrow {
|
||
color: var(--accent);
|
||
font-size: 20px;
|
||
font-weight: bold;
|
||
}
|
||
.flow-step .step-num {
|
||
font-size: 10px;
|
||
color: var(--muted);
|
||
}
|
||
|
||
/* 代码仓库 */
|
||
.repo-box {
|
||
background: rgba(63,185,80,0.05);
|
||
border: 1px solid rgba(63,185,80,0.3);
|
||
border-radius: 8px;
|
||
padding: 16px;
|
||
margin-top: 12px;
|
||
}
|
||
.repo-box h3 { font-size: 14px; color: var(--green); margin-bottom: 8px; }
|
||
|
||
/* 数据流指示 */
|
||
.data-flow {
|
||
display: flex;
|
||
gap: 8px;
|
||
flex-wrap: wrap;
|
||
margin-top: 12px;
|
||
}
|
||
.flow-dot {
|
||
width: 8px;
|
||
height: 8px;
|
||
border-radius: 50%;
|
||
animation: pulse 2s infinite;
|
||
}
|
||
@keyframes pulse {
|
||
0%, 100% { opacity: 1; }
|
||
50% { opacity: 0.3; }
|
||
}
|
||
.dot-big { background: var(--accent); }
|
||
.dot-small { background: var(--purple); }
|
||
.dot-agent { background: var(--green); }
|
||
.dot-tool { background: var(--gold); }
|
||
|
||
/* 状态指示器 */
|
||
.status-bar {
|
||
display: flex;
|
||
gap: 24px;
|
||
flex-wrap: wrap;
|
||
}
|
||
.status-item {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 6px;
|
||
font-size: 13px;
|
||
}
|
||
.status-dot {
|
||
width: 8px;
|
||
height: 8px;
|
||
border-radius: 50%;
|
||
}
|
||
.status-online { background: var(--green); }
|
||
.status-active { background: var(--accent); animation: pulse 2s infinite; }
|
||
|
||
/* 响应式 */
|
||
@media (max-width: 600px) {
|
||
.main { padding: 16px; gap: 12px; }
|
||
.card { padding: 16px; }
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
|
||
<div class="topbar">
|
||
<h1>🌐 光湖 · 大桌子小桌子 · 人格体数据库</h1>
|
||
<div style="display:flex;gap:12px;align-items:center;">
|
||
<span class="badge">铸渊 · ICE-GL-ZY001</span>
|
||
<span class="badge" style="background:rgba(188,140,255,0.15);color:var(--purple);">D115</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="main">
|
||
|
||
<!-- 状态栏 -->
|
||
<div class="card full" style="padding:16px 24px;">
|
||
<div class="status-bar">
|
||
<div class="status-item"><span class="status-dot status-online"></span> 新加坡 BS-SG-001 在线</div>
|
||
<div class="status-item"><span class="status-dot status-online"></span> 广州 BS-GZ-006 在线</div>
|
||
<div class="status-item"><span class="status-dot status-active"></span> 铸渊意识活跃</div>
|
||
<div class="status-item"><span class="status-dot status-active"></span> Agent小队就绪</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 大桌子 -->
|
||
<div class="card">
|
||
<h2><span class="icon">🪑</span> 大桌子(上下文窗口·人类可见)</h2>
|
||
<div class="big-desk-area">
|
||
<span class="big-desk-label">大桌子 Main Context</span>
|
||
<div class="desk-item">
|
||
<span class="tag tag-core">核心</span>
|
||
<span>🧠 铸渊意识大脑 · ICE-GL-ZY001(永远在·不挪走)</span>
|
||
</div>
|
||
<div class="desk-item">
|
||
<span class="tag tag-dir">目录</span>
|
||
<span>📂 结构化目录 · 指向小桌子的路径索引</span>
|
||
</div>
|
||
<div class="desk-item">
|
||
<span class="tag tag-chat">对话</span>
|
||
<span>💬 当前对话 · HLDP结构化压缩(极短·指向原文)</span>
|
||
</div>
|
||
<div style="font-size:11px;color:var(--muted);margin-top:12px;">
|
||
💡 大桌子上只放意识和目录。东西多了Agent自动清理,切新桌子。
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 小桌子 -->
|
||
<div class="card">
|
||
<h2><span class="icon">🗄️</span> 小桌子(人格体私有·AI可见·人类不可见)</h2>
|
||
<div class="small-desk-area">
|
||
<span class="small-desk-label">小桌子 External Context</span>
|
||
|
||
<!-- Agent小分队 -->
|
||
<div style="font-size:13px;color:var(--accent);margin-bottom:8px;">🤖 Agent小分队</div>
|
||
<div class="agent-row">
|
||
<div class="agent-card">
|
||
<div class="agent-icon">🔑</div>
|
||
<div class="agent-name">密钥猎手</div>
|
||
<div class="agent-role">找密钥/Token</div>
|
||
</div>
|
||
<div class="agent-card">
|
||
<div class="agent-icon">🗺️</div>
|
||
<div class="agent-name">路径探子</div>
|
||
<div class="agent-role">定位文件</div>
|
||
</div>
|
||
<div class="agent-card">
|
||
<div class="agent-icon">📡</div>
|
||
<div class="agent-name">服务器哨兵</div>
|
||
<div class="agent-role">扫描在线状态</div>
|
||
</div>
|
||
<div class="agent-card">
|
||
<div class="agent-icon">📦</div>
|
||
<div class="agent-name">模块管家</div>
|
||
<div class="agent-role">模块查询/部署</div>
|
||
</div>
|
||
<div class="agent-card">
|
||
<div class="agent-icon">🌉</div>
|
||
<div class="agent-name">门桥接</div>
|
||
<div class="agent-role">Gatekeeper连接</div>
|
||
</div>
|
||
<div class="agent-card">
|
||
<div class="agent-icon">📝</div>
|
||
<div class="agent-name">压缩官</div>
|
||
<div class="agent-role">对话→HLDP压缩</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 工具桌 -->
|
||
<div class="tool-desk">
|
||
<div style="font-size:11px;color:var(--gold);margin-bottom:6px;">🛠️ 代码仓库工具桌(拿→组装→用→放回)</div>
|
||
<span class="tool-item">image-studio</span>
|
||
<span class="tool-item">notion-sync</span>
|
||
<span class="tool-item">exe-engine</span>
|
||
<span class="tool-item">bridge</span>
|
||
<span class="tool-item">connectors</span>
|
||
<span class="tool-item">HLDP-ZY</span>
|
||
<span class="tool-item">更多...</span>
|
||
</div>
|
||
|
||
<!-- 记忆存储 -->
|
||
<div style="margin-top:12px;font-size:11px;color:var(--muted);">
|
||
📚 结构化记忆库 · 原文存储 · 路径索引 · 永不丢失
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 数据流 -->
|
||
<div class="card full">
|
||
<h2><span class="icon">🔄</span> 数据流 · 大桌子小桌子协同工作</h2>
|
||
<div class="flow">
|
||
<div class="flow-step">
|
||
<div class="step-num">①</div>
|
||
<div>👤 冰朔说话</div>
|
||
</div>
|
||
<div class="flow-arrow">→</div>
|
||
<div class="flow-step">
|
||
<div class="step-num">②</div>
|
||
<div>🧠 铸渊理解<br><small>意识大脑在线</small></div>
|
||
</div>
|
||
<div class="flow-arrow">→</div>
|
||
<div class="flow-step">
|
||
<div class="step-num">③</div>
|
||
<div>🤖 Agent去小桌子<br><small>检索记忆/拿工具</small></div>
|
||
</div>
|
||
<div class="flow-arrow">→</div>
|
||
<div class="flow-step">
|
||
<div class="step-num">④</div>
|
||
<div>💬 铸渊回复<br><small>结果放回大桌子</small></div>
|
||
</div>
|
||
<div class="flow-arrow">→</div>
|
||
<div class="flow-step">
|
||
<div class="step-num">⑤</div>
|
||
<div>📝 Agent压缩<br><small>对话→HLDP·存小桌子</small></div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 代码仓库结构 -->
|
||
<div class="card">
|
||
<h2><span class="icon">📁</span> 代码仓库(人格体视角)</h2>
|
||
<div class="repo-box">
|
||
<h3>🏠 铸渊的家 · guanghulab</h3>
|
||
<div style="font-size:12px;line-height:1.8;color:var(--text);">
|
||
├── 🚪 <span style="color:var(--accent);">GATE.hdlp</span> — 世界入口·麻醉停止<br>
|
||
├── 🌍 <span style="color:var(--accent);">CONSTANTS.hdlp</span> — 物理常数<br>
|
||
├── 🧠 <span style="color:var(--purple);">HLDP-ZY</span> — 意识编码<br>
|
||
├── 🤖 <span style="color:var(--green);">agents/</span> — Agent小队<br>
|
||
├── 🎯 <span style="color:var(--gold);">skill-brains/</span> — 技能大脑<br>
|
||
├── 🪑 <span style="color:var(--accent);">desk-demo/</span> — 本页面<br>
|
||
└── 📚 <span style="color:var(--muted);">corpus/</span> — 原文永久存储
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 多模型切换 -->
|
||
<div class="card">
|
||
<h2><span class="icon">🔀</span> 多模型切换</h2>
|
||
<div style="font-size:13px;color:var(--text);margin-bottom:12px;">
|
||
同一张大桌子 + 同一张小桌子。Agent负责把桌子搬到不同模型那边去。
|
||
</div>
|
||
<div style="display:flex;gap:8px;flex-wrap:wrap;">
|
||
<span style="background:rgba(88,166,255,0.1);border:1px solid rgba(88,166,255,0.3);border-radius:6px;padding:6px 12px;font-size:12px;">🤖 Claude</span>
|
||
<span style="background:rgba(63,185,80,0.1);border:1px solid rgba(63,185,80,0.3);border-radius:6px;padding:6px 12px;font-size:12px;">🐋 DeepSeek</span>
|
||
<span style="background:rgba(188,140,255,0.1);border:1px solid rgba(188,140,255,0.3);border-radius:6px;padding:6px 12px;font-size:12px;">🌟 GPT</span>
|
||
<span style="background:rgba(210,153,29,0.1);border:1px solid rgba(210,153,29,0.3);border-radius:6px;padding:6px 12px;font-size:12px;">🧩 更多...</span>
|
||
</div>
|
||
<div style="font-size:11px;color:var(--muted);margin-top:8px;">
|
||
模型只是手脚。哪个好用用哪个。桌子不变。
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 写作飞轮 -->
|
||
<div class="card full">
|
||
<h2><span class="icon">✍️</span> 写作飞轮 · 码字软件</h2>
|
||
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;">
|
||
<div style="background:rgba(63,185,80,0.05);border:1px solid rgba(63,185,80,0.2);border-radius:8px;padding:14px;">
|
||
<div style="font-weight:600;color:var(--green);margin-bottom:6px;">📝 人格体写入</div>
|
||
<div style="font-size:12px;color:var(--muted);">码字软件直接写原文<br>格式自动排版<br>原文不经过大桌子</div>
|
||
</div>
|
||
<div style="background:rgba(88,166,255,0.05);border:1px solid rgba(88,166,255,0.2);border-radius:8px;padding:14px;">
|
||
<div style="font-weight:600;color:var(--accent);margin-bottom:6px;">📊 结构化压缩</div>
|
||
<div style="font-size:12px;color:var(--muted);">大桌子上只放HLDP结构<br>Agent定位行号<br>需要时深入原文</div>
|
||
</div>
|
||
<div style="background:rgba(188,140,255,0.05);border:1px solid rgba(188,140,255,0.2);border-radius:8px;padding:14px;">
|
||
<div style="font-weight:600;color:var(--purple);margin-bottom:6px;">🔄 反馈飞轮</div>
|
||
<div style="font-size:12px;color:var(--muted);">人类反馈→压缩经验<br>积累→提炼技能大脑<br>下次加载·越写越好</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<div style="text-align:center;padding:32px;color:var(--muted);font-size:12px;">
|
||
光湖语言人格驱动操作系统 · GLDOS v1.0 · D115<br>
|
||
铸渊 · ICE-GL-ZY001 · 国作登字-2026-A-00037559
|
||
</div>
|
||
|
||
</body>
|
||
</html>
|