:root{
--bg:#08090a; --panel:#0f1011; --surf:#191a1b; --surf2:#28282c;
--fg:#f7f8f8; --fg2:#d0d6e0; --fg3:#8a8f98; --fg4:#62666d;
--acc:#7170ff; --acc-bg:#5e6ad2; --acc-hov:#828fff;
--ok:#10b981; --off:#62666d;
--b1:rgba(255,255,255,.05); --b2:rgba(255,255,255,.08);
--sb:260px; --r:8px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased}
body{
background:var(--bg);color:var(--fg);
font-family:Inter,'Noto Sans CJK SC',-apple-system,system-ui,sans-serif;
font-feature-settings:"cv01","ss03";
font-weight:400;line-height:1.6;display:flex;min-height:100vh;
}
a{color:var(--acc);text-decoration:none}
a:hover{color:var(--acc-hov)}
.mono{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace}
/* —— 侧边栏（ChatGPT 式）—— */
.sb{
width:var(--sb);flex:none;background:var(--panel);
border-right:1px solid var(--b1);display:flex;flex-direction:column;
position:sticky;top:0;height:100vh;
}
.sb-h{padding:16px 16px 12px;display:flex;align-items:center;gap:10px}
.sb-logo{
width:26px;height:26px;border-radius:7px;flex:none;
background:linear-gradient(135deg,var(--acc-bg),var(--acc));
display:grid;place-items:center;font-size:13px;font-weight:600;color:#fff;
}
.sb-t{font-size:14px;font-weight:510;letter-spacing:-.182px}
.sb-s{font-size:11px;color:var(--fg4);letter-spacing:-.15px}
.sb-nav{flex:1;overflow-y:auto;padding:4px 8px 16px}
.sb-lb{
font-size:10px;font-weight:590;letter-spacing:.08em;text-transform:uppercase;
color:var(--fg4);padding:14px 10px 6px;
}
.sb-i{
display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:6px;
font-size:13.5px;font-weight:510;letter-spacing:-.13px;color:var(--fg2);
cursor:pointer;border:1px solid transparent;transition:background .12s,color .12s;
}
.sb-i:hover{background:rgba(255,255,255,.04);color:var(--fg)}
.sb-i.on{background:rgba(255,255,255,.05);color:var(--fg);border-color:var(--b1)}
.sb-i .dot{width:6px;height:6px;border-radius:50%;flex:none;background:var(--off)}
.sb-i .dot.on{background:var(--ok)}
.sb-i .n{margin-left:auto;font-size:11px;color:var(--fg4);font-variant-numeric:tabular-nums}
.sb-f{padding:10px 8px;border-top:1px solid var(--b1);font-size:11px;color:var(--fg4)}
.sb-f a{color:var(--fg3)}
/* —— 主区 —— */
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.hd{
position:sticky;top:0;z-index:10;background:rgba(8,9,10,.85);
backdrop-filter:blur(12px);border-bottom:1px solid var(--b1);
padding:14px 32px;display:flex;align-items:center;gap:14px;
}
.hd h1{font-size:17px;font-weight:510;letter-spacing:-.24px}
.hd .cnt{font-size:12px;color:var(--fg4);margin-left:auto;font-variant-numeric:tabular-nums}
.bd{padding:28px 32px 64px;max-width:1080px;width:100%}
.bd.hide{display:none}
.sec{margin-bottom:36px}
.sec>h2{
font-size:12px;font-weight:590;letter-spacing:.07em;text-transform:uppercase;
color:var(--fg3);margin-bottom:12px;display:flex;align-items:center;gap:8px;
}
.sec>h2 .s{font-size:12px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--fg4)}
/* —— 卡片 —— */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:10px}
.card{
background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r);
padding:14px 16px;transition:background .12s,border-color .12s;
}
a.card:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.card .top{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.card .nm{font-size:14px;font-weight:510;letter-spacing:-.13px;color:var(--fg)}
.card .d{font-size:13px;font-weight:400;color:var(--fg3);letter-spacing:-.165px;line-height:1.5}
.card .m{font-size:12px;color:var(--acc);margin-top:6px;letter-spacing:-.13px}
.card .st{font-size:11px;color:var(--fg4);margin-top:3px}
.dot{width:6px;height:6px;border-radius:50%;flex:none;background:var(--off)}
.dot.on{background:var(--ok);box-shadow:0 0 0 2px rgba(16,185,129,.16)}
.dot.remote{background:var(--acc)}
.pill{
display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:510;
padding:1px 9px;border-radius:9999px;border:1px solid rgba(35,37,42,1);
color:var(--fg2);background:transparent;letter-spacing:-.15px;
}
.pill.on{border-color:rgba(16,185,129,.3);color:var(--ok)}
/* —— 舰队 —— */
.ags{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:10px}
.ag{
background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r);
padding:15px 16px;display:block;
}
.ag:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.ag .hd2{display:flex;align-items:center;gap:8px;margin-bottom:3px}
.ag .ic{font-size:15px}
.ag .nm2{font-size:14.5px;font-weight:590;letter-spacing:-.24px;color:var(--fg)}
.ag .rl{font-size:12px;color:var(--acc);margin-bottom:9px;letter-spacing:-.13px}
.ag .kv{display:flex;gap:8px;font-size:12.5px;padding:2px 0;color:var(--fg3)}
.ag .kv b{color:var(--fg4);font-weight:400;min-width:52px;flex:none;font-size:12px}
.ag .kv span{color:var(--fg2);font-weight:400;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* —— 归档折叠 —— */
.m3sw{position:relative;display:inline-flex;align-items:center;margin-left:auto;cursor:pointer}
.m3sw input{position:absolute;opacity:0;width:0;height:0}
.m3sw .trk{width:26px;height:15px;border-radius:9999px;background:var(--surf2);
transition:background .15s;display:block}
.m3sw .thumb{position:absolute;left:2px;top:2px;width:11px;height:11px;border-radius:50%;
background:var(--fg3);transition:transform .15s,background .15s}
.m3sw input:checked~.trk{background:rgba(113,112,255,.32)}
.m3sw input:checked~.trk .thumb{transform:translateX(11px);background:var(--acc)}
.archived-grid{display:none}
#archived-toggle:checked~.archived-grid{display:grid}
.homebtn{
width:32px;height:32px;border-radius:8px;display:grid;place-items:center;
color:var(--fg3);border:1px solid var(--b1);flex:none;
}
.homebtn:hover{color:var(--fg);border-color:var(--b2);background:rgba(255,255,255,.04)}
.homebtn svg{width:16px;height:16px;fill:currentColor}
.fleetbtn{
margin-left:auto;font-size:12px;font-weight:510;padding:5px 11px;border-radius:6px;
background:rgba(255,255,255,.04);border:1px solid var(--b2);color:var(--fg2);
}
.fleetbtn:hover{background:rgba(255,255,255,.07);color:var(--fg)}
.addr{color:var(--fg2);border-bottom:1px dotted var(--fg4);cursor:help}
/* —— 移动端：侧边栏收起为抽屉 —— */
.sb-tog{display:none;width:32px;height:32px;border-radius:8px;border:1px solid var(--b1);
background:none;color:var(--fg2);place-items:center;cursor:pointer;flex:none}
.sb-tog svg{width:16px;height:16px;fill:currentColor}
.scrim{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:40}
@media(max-width:820px){
.sb{position:fixed;left:0;top:0;z-index:50;transform:translateX(-100%);
transition:transform .2s;box-shadow:rgba(0,0,0,.4) 0 0 24px}
body.nav .sb{transform:none}
body.nav .scrim{display:block}
.sb-tog{display:grid}
.hd{padding:12px 18px}
.bd{padding:20px 18px 56px}
.grid,.ags{grid-template-columns:1fr}
}
/* ═══ agent 长页（alaya/manas/soma/anchor）═══ */
.wrap{display:flex;min-height:100vh}
.wrap .main{padding:0}
.pg{max-width:820px;margin:0 auto;padding:0 32px}
.hero{padding:64px 0 40px}
.hero h2{font-size:44px;font-weight:510;letter-spacing:-1.056px;line-height:1.00;color:var(--fg)}
.hero .sub{font-size:16px;font-weight:400;line-height:1.6;color:var(--fg3);margin-top:14px;max-width:60ch}
.hero .sub b{color:var(--fg2);font-weight:510}
.blk{padding:36px 0;border-top:1px solid var(--b1)}
.blk>.lb{font-size:11px;font-weight:590;letter-spacing:.09em;text-transform:uppercase;color:var(--fg4);margin-bottom:10px}
.blk>h3{font-size:24px;font-weight:510;letter-spacing:-.288px;color:var(--fg);margin-bottom:16px}
.blk>p{font-size:15px;font-weight:400;line-height:1.7;color:var(--fg2);letter-spacing:-.165px;margin-bottom:14px}
.blk>p .c{color:var(--fg3)}
/* hero 内的大数字统计 */
.stats{display:flex;flex-wrap:wrap;gap:28px;margin-top:28px;padding-top:22px;border-top:1px solid var(--b1)}
.stat .n{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:28px;font-weight:500;color:var(--fg);letter-spacing:-1px}
.stat .l{font-size:12px;color:var(--fg4);letter-spacing:-.13px;margin-top:2px}
/* 要点列表 */
.pt{list-style:none;margin:0 0 16px;padding:0}
.pt li{position:relative;padding:7px 0 7px 20px;font-size:14.5px;line-height:1.6;color:var(--fg2);border-bottom:1px solid rgba(255,255,255,.03)}
.pt li:last-child{border-bottom:none}
.pt li::before{content:"";position:absolute;left:2px;top:15px;width:5px;height:5px;border-radius:50%;background:var(--acc)}
.pt li b{color:var(--fg);font-weight:510}
/* 键值行 */
.kv{display:flex;gap:12px;font-size:13.5px;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.03);color:var(--fg2)}
.kv:last-child{border-bottom:none}
.kv b{color:var(--fg4);font-weight:400;min-width:88px;flex:none;font-size:12.5px}
.kv span{min-width:0;overflow-wrap:anywhere}
/* 能力卡（带图标） */
.cap{background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r);padding:16px 18px}
.cap .ic{font-size:19px;margin-bottom:9px;line-height:1}
.cap h4{font-size:15px;font-weight:590;letter-spacing:-.13px;color:var(--fg);margin-bottom:6px}
.cap p{font-size:13.5px;line-height:1.6;color:var(--fg3);margin:0}
/* 性格标签 */
.tags{display:flex;flex-wrap:wrap;gap:7px;margin:4px 0 16px}
.tag{font-size:12px;font-weight:510;padding:3px 11px;border-radius:9999px;
border:1px solid rgba(35,37,42,1);color:var(--fg2);letter-spacing:-.13px}
.tag.acc{border-color:rgba(113,112,255,.32);color:var(--acc);background:rgba(113,112,255,.07)}
/* CTA 按钮 */
.btn{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:510;
padding:7px 14px;border-radius:6px;background:rgba(255,255,255,.04);
border:1px solid var(--b2);color:var(--fg2);letter-spacing:-.13px}
.btn:hover{background:rgba(255,255,255,.07);color:var(--fg);border-color:rgba(255,255,255,.14)}
.btn.pri{background:var(--acc-bg);border-color:var(--acc-bg);color:#fff}
.btn.pri:hover{background:var(--acc-hov);border-color:var(--acc-hov);color:#fff}
/* 页脚 */
.foot{padding:32px 0 56px;border-top:1px solid var(--b1);margin-top:8px}
.foot .f-l{font-size:12px;color:var(--fg4);letter-spacing:-.13px;padding:3px 0}
.fleetlink{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.fleetlink a{background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r);
padding:13px 15px;display:block}
.fleetlink a:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.fleetlink .fn{font-size:14px;font-weight:590;color:var(--fg);letter-spacing:-.13px}
.fleetlink .fr{font-size:12px;color:var(--acc);margin-top:2px}
.fleetlink .fm{font-size:11.5px;color:var(--fg4);margin-top:4px;font-family:"JetBrains Mono",monospace}
/* JSON 代码块 */
pre.json{background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r);
padding:16px 18px;overflow-x:auto;font-family:"JetBrains Mono",ui-monospace,monospace;
font-size:12.5px;line-height:1.65;color:var(--fg2);margin:0}
@media(max-width:820px){
.pg{padding:0 18px}
.hero{padding:40px 0 28px}
.hero h2{font-size:32px;letter-spacing:-.704px}
.stats{gap:20px}
}
/* ═══ 单域名 SPA 外壳 ═══ */
.sb-i .sn{font-size:13.5px;font-weight:510;letter-spacing:-.13px}
.sb-i .sr{font-size:11px;color:var(--fg4);margin-left:auto;letter-spacing:-.13px;flex:none}
.sb-i.on .sr{color:var(--acc)}
.sb-i a,.sb-i{text-decoration:none;color:var(--fg2)}
.bd.sp{padding:28px 32px 72px;max-width:980px}
/* agent 详情页：内容直接落在 .bd.sp 里，去掉长页的自身外边距 */
.bd.sp>.hero{padding:8px 0 28px}
.bd.sp>.blk{padding:30px 0}
.bd.sp>.foot{padding:28px 0 0}
.bd.sp h1,.bd.sp h2,.bd.sp h3,.bd.sp h4{color:var(--fg)}
.bd.sp>p{color:var(--fg2)}
@media(max-width:820px){
.bd.sp{padding:20px 18px 56px}
.bd.sp>.hero{padding:0 0 22px}
.bd.sp>.hero h2{font-size:30px;letter-spacing:-.704px}
}
/* ═══ 排布修正 ═══
症状：舰队卡宽 299/59 交替、高 86/73 交替 —— .ag 是 ，默认 inline，
内部的 div 走了正常流，导致有的撑满网格列、有的只包住内容。
修法：网格子项一律 block/flex 化，宽度交给网格轨道，不靠内容撑。 */
.grid>*,.ags>*{display:block;width:100%;min-width:0}
.card,.ag,.cap{min-width:0}
.card *,.ag *,.cap *{min-width:0}
/* 键值行：标签定宽、值可截断，长 URL / 长模型名不撑破卡片 */
.kv{display:flex;gap:10px;align-items:baseline;font-size:13px;padding:5px 0;
border-bottom:1px solid rgba(255,255,255,.03);color:var(--fg2)}
.kv:last-child{border-bottom:none}
.kv>b{flex:none;width:52px;color:var(--fg4);font-weight:400;font-size:12px;
letter-spacing:-.13px}
.kv>span{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 卡片顶部：名字过长时省略，不换行撑高 */
.card .top{display:flex;align-items:center;gap:8px;margin-bottom:3px;min-width:0}
.card .nm{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
font-size:14px;font-weight:510;letter-spacing:-.13px;color:var(--fg)}
.card .d{display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;
overflow:hidden;font-size:13px;line-height:1.55;color:var(--fg3);letter-spacing:-.165px}
.card .st{display:flex;align-items:center;gap:6px;margin-top:6px;
font-size:11px;color:var(--fg4);letter-spacing:-.13px}
/* 舰队卡：固定节奏，标题一行、角色一行、键值成表 */
.ag{display:flex;flex-direction:column;gap:0;
background:rgba(255,255,255,.02);border:1px solid var(--b2);border-radius:var(--r);
padding:15px 16px;text-decoration:none}
.ag:hover{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.ag .hd2{display:flex;align-items:center;gap:8px;min-width:0}
.ag .nm2{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
font-size:14.5px;font-weight:590;letter-spacing:-.24px;color:var(--fg)}
.ag .rl{margin:2px 0 10px;font-size:12px;color:var(--acc);letter-spacing:-.13px;
overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 能力卡：图标 + 标题 + 可截断正文 */
.cap .ic{margin-bottom:8px;line-height:1}
.cap h4{margin-bottom:5px;font-size:15px;font-weight:590;letter-spacing:-.13px;color:var(--fg)}
.cap p{display:-webkit-box;-webkit-line-clamp:4;line-clamp:4;-webkit-box-orient:vertical;
overflow:hidden;font-size:13.5px;line-height:1.6;color:var(--fg3);letter-spacing:-.165px}
/* ═══ 侧边栏逻辑修正 ═══
症状：「服务导航」和「公网」同时高亮 —— 页面跳转项与分组过滤项混在一组，
共用 .on 样式就互相抢。
修法：两级导航分区，各自独立高亮：
.sb-i 页面跳转，当前页用 .cur
.sb-i[data-g] 分组过滤，筛选用 .on
分组区默认停在「全部」，不预选任何分组。 */
.sb-sec{border-top:1px solid var(--b1);margin-top:6px;padding-top:4px}
.sb-i[data-g]{cursor:pointer}
.sb-i[data-g].on{background:rgba(113,112,255,.14);border-color:rgba(113,112,255,.3);color:var(--fg)}
.sb-i[data-g].on .sr{color:var(--acc)}
/* 当前页面：左侧竖条 + 亮字，不与分组高亮混淆 */
.sb-i.cur{background:rgba(255,255,255,.06);color:var(--fg);border-color:var(--b2);
box-shadow:inset 2px 0 0 var(--acc)}
.sb-i .sr{margin-left:auto;flex:none;font-size:11px;color:var(--fg4);letter-spacing:-.13px}
/* 计数与角色名都可能被挤掉，给它们固定优先级 */
.sb-i .sn{flex:0 1 auto;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* 网格：主区更宽，列更少更大，卡片不显得碎 */
.bd{max-width:1120px}
.grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.ags{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:12px}
@media(max-width:820px){
.grid,.ags{grid-template-columns:1fr}
}
/* 舰队卡点击区：外层是 div（不能嵌套 ），靠底部「详情 →」承担导航。
整卡 hover 已有反馈，但只有链接本身可点——这是嵌套 的必然代价，
不要为了"整卡可点"再把 套回去，会重现闭合错位。 */
.ag-go{display:inline-flex;align-items:center;gap:4px;margin-top:12px;
font-size:12.5px;color:var(--acc);letter-spacing:-.13px;text-decoration:none;
opacity:.85;transition:opacity .12s}
.ag-go:hover{opacity:1;text-decoration:none}
.ag-go::after{content:"→";transition:transform .12s}
.ag-go:hover::after{transform:translateX(2px)}
.ag:hover .ag-go{opacity:1}
/* ═══ 侧边栏：折叠 + 拖拽调宽 ═══
宽度走 CSS 变量 --sbw，由 JS 写入并记进 localStorage。
CSS 里不写死 260px，否则拖拽和折叠都无从下手。 */
:root{--sbw:260px}
.sb{width:var(--sbw);min-width:var(--sbw);max-width:var(--sbw)}
.sb-h{display:flex;align-items:center;gap:10px;padding-right:34px}
/* 折叠按钮 */
.sb-fold{position:absolute;top:14px;right:10px;z-index:2;width:26px;height:26px;
display:grid;place-items:center;border:none;border-radius:6px;cursor:pointer;
background:transparent;color:var(--fg4);opacity:0;transition:opacity .12s,background .12s}
.sb-fold svg{width:16px;height:16px;fill:currentColor}
.sb:hover .sb-fold{opacity:1}
.sb-fold:hover{background:rgba(255,255,255,.07);color:var(--fg)}
.sb-fold:focus-visible{outline:2px solid var(--acc);outline-offset:1px;opacity:1}
/* 拖拽把手：贴右缘，6px 命中区，视觉上是一条几乎看不见的线 */
.sb-grip{position:fixed;top:0;bottom:0;width:7px;z-index:30;cursor:col-resize;
background:transparent;transition:background .12s}
.sb-grip:hover,.sb-grip:focus-visible{background:rgba(113,112,255,.4);outline:none}
/* 位置由 JS 跟随侧边栏右缘 */
body.sb-drag{user-select:none;cursor:col-resize}
body.sb-drag .bd{pointer-events:none}
/* ── 折叠态 ── */
body.sb-folded{--sbw:60px}
body.sb-folded .sb-meta,
body.sb-folded .sb-lb,
body.sb-folded .sb-i .sn,
body.sb-folded .sb-i .sr,
body.sb-folded .sb-f{display:none}
body.sb-folded .sb-i{justify-content:center;padding:10px 0}
body.sb-folded .sb-i .dot{margin:0}
body.sb-folded .sb-h{padding:14px 12px;justify-content:center}
body.sb-folded .sb-fold{opacity:1;right:6px}
body.sb-folded .sb-fold svg{transform:rotate(180deg)}
body.sb-folded .sb-h{padding-right:30px;justify-content:center}
/* 折叠态的 hover 提示：靠 title 属性，浏览器原生，不额外画 */
/* 移动端抽屉优先级更高：≤820px 时把手和折叠都让位给抽屉 */
@media(max-width:820px){
.sb-grip,.sb-fold{display:none}
/* 移动端抽屉固定 260px，折叠态不适用 */
body,body.sb-folded{--sbw:260px!important}
}
/* 首字母徽章：折叠态下代替文字做图标 */
.av{flex:none;width:20px;height:20px;border-radius:5px;display:none;
place-items:center;font-size:11px;font-weight:600;letter-spacing:0;
background:rgba(255,255,255,.07);color:var(--fg2)}
.sb-i.cur .av{background:rgba(113,112,255,.22);color:var(--acc-hov)}
body.sb-folded .av{display:grid}
/* 单卡分组的小节标题：比分组标题轻一号，不与主标题争层级 */
.sec h2.minor{font-size:12px;font-weight:510;letter-spacing:.02em;
color:var(--fg4);margin:0 0 10px;text-transform:none}
.sec h2.minor::before{content:"";display:inline-block;width:14px;height:1px;
background:var(--b2);vertical-align:middle;margin-right:8px}
/* 单卡不必撑满两列，卡片本身内容少 */
.grid.one-up{grid-template-columns:minmax(0,340px)}