/* 首页：固定 MCP 顶栏 + 首屏「FeedMob 数据宇宙」。
   主角只有中间的 3D 大脑，HUD 一律克制：单色、细边、少量玻璃质感。 */
@font-face{font-family:"Archivo";src:url("/static/fonts/archivo-latin.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-display:swap}

:root{--uv-ink:#eef3ff;--uv-mut:#97a7cc;--uv-dim:#64739a;--uv-glass:rgba(8,12,28,.58);--uv-edge:rgba(167,187,238,.15);--uv-spark:#f6e0af;--uv-num:"Archivo",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}

/* ---------- 固定顶栏 ---------- */
.fm-top{position:fixed;top:0;left:0;right:0;z-index:40;height:52px;display:flex;align-items:center;gap:14px;padding:0 18px;background:rgba(4,7,18,.66);-webkit-backdrop-filter:saturate(140%) blur(14px);backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid rgba(167,187,238,.1);font-size:13px;color:var(--uv-mut)}
.fm-brand{display:flex;align-items:center;gap:10px;color:var(--uv-ink);text-decoration:none;font-weight:650;letter-spacing:.2px;white-space:nowrap}
.fm-mark{width:22px;height:22px;flex:none;border-radius:50%;background:radial-gradient(circle,#fff 0 17%,transparent 19%),conic-gradient(from 200deg,#89a6d1,#a29ae2,#c899e1,#db93a4,#c7aa7f,#b2d28b,#6eb69f,#75afbc,#89a6d1);box-shadow:0 0 10px rgba(150,165,210,.22)}
.fm-mcp{position:relative;display:flex;align-items:center;gap:8px;min-width:0;margin-left:6px;padding-left:16px;border-left:1px solid rgba(167,187,238,.12)}
.fm-badge{flex:none;padding:5px 7px;border-radius:6px;background:#46568c;color:#fff;font:700 11px/1 var(--uv-num);font-stretch:125%;letter-spacing:.06em}
.fm-mcp code{min-width:0;max-width:30vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:6px 10px;border-radius:8px;border:1px solid var(--uv-edge);background:rgba(255,255,255,.03);color:#b9ccff;font-size:12.5px}
.fm-btn{flex:none;height:30px;padding:0 12px;border-radius:8px;border:1px solid rgba(167,187,238,.2);background:rgba(255,255,255,.04);color:#dfe8ff;font:inherit;font-size:12.5px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.fm-btn:hover{background:rgba(255,255,255,.09)}
.fm-btn.pri{background:#46568c;border-color:#46568c;color:#fff}.fm-btn.pri:hover{background:#56679b}
.fm-btn svg{width:12px;height:12px;transition:transform .2s}
.fm-btn[aria-expanded="true"] svg{transform:rotate(180deg)}
.fm-steps{position:absolute;top:42px;left:16px;width:430px;max-width:calc(100vw - 32px);padding:16px 18px 14px;border-radius:12px;background:rgba(7,11,26,.97);border:1px solid rgba(167,187,238,.18);box-shadow:0 18px 50px rgba(0,0,0,.55);color:#c6d3f2;font-size:13px;line-height:1.55}
.fm-steps[hidden]{display:none}
.fm-steps ol{margin:0;padding:0;list-style:none;counter-reset:s;display:grid;gap:10px}
.fm-steps li{counter-increment:s;display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start}
.fm-steps li:before{content:counter(s);width:22px;height:22px;border-radius:50%;background:#1a2748;color:#aac0f2;display:grid;place-items:center;font:600 12px/1 var(--uv-num)}
.fm-steps a{display:inline-block;margin-top:12px;color:#aac0f2;text-decoration:none;font-size:12.5px}.fm-steps a:hover{color:#fff}
.fm-one{margin-top:14px;padding-top:12px;border-top:1px solid rgba(167,187,238,.14)}
.fm-one b{display:block;font-weight:600;color:#dbe5ff;font-size:12.5px}
.fm-one small{display:block;margin:2px 0 8px;color:#8190b5;font-size:11.5px}
.fm-one p{margin:8px 0 0;color:#8190b5;font-size:11.5px;line-height:1.55}
.fm-cmd{display:grid;grid-template-columns:86px minmax(0,1fr) auto;gap:8px;align-items:center;margin-top:6px}
.fm-cmd span{color:#8f9fc4;font-size:11.5px}
.fm-cmd code{display:block;min-width:0;overflow-x:auto;white-space:nowrap;padding:5px 8px;border-radius:6px;border:1px solid rgba(167,187,238,.14);background:rgba(18,27,52,.8);color:#cfe0ff;font:11.5px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;scrollbar-width:none}
.fm-cmd code::-webkit-scrollbar{display:none}
.fm-cmd .fm-btn{height:26px;padding:0 9px;font-size:11.5px}
.fm-right{margin-left:auto;display:flex;align-items:center;gap:10px;flex:none}
.fm-health{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}.fm-health b{font-weight:500;color:#cfdaf5}
.fm-top .lang a{padding:6px 10px}
.fm-top :focus-visible,.uv :focus-visible{outline:2px solid #a3baeb;outline-offset:2px}

/* ---------- 首屏 ---------- */
.uv{position:relative;width:100vw;margin:52px 0 30px calc(50% - 50vw);height:calc(100vh - 52px);height:calc(100svh - 52px);min-height:560px;overflow:hidden;isolation:isolate;background:radial-gradient(70% 60% at 62% 52%,#0b1430 0%,#03050d 70%);color:var(--uv-ink)}
.uv-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:grab;touch-action:pan-y}
.uv-canvas:active{cursor:grabbing}
.uv-labels{position:absolute;inset:0;z-index:2;pointer-events:none;transition:opacity .8s}
.uv-label{position:absolute;left:0;top:0;display:flex;align-items:center;gap:6px;padding:3px 9px 3px 7px;border-radius:20px;border:1px solid rgba(167,187,238,.13);background:rgba(5,9,22,.6);color:#d8e2fb;font-size:12px;white-space:nowrap;pointer-events:auto;cursor:pointer;will-change:transform;transition:opacity .35s,border-color .2s}
.uv-label:hover,.uv-label.on{border-color:var(--c)}
.uv-label i{width:7px;height:7px;border-radius:50%;background:var(--c);box-shadow:0 0 5px var(--c)}
.uv-label b{font:600 12px/1 var(--uv-num);font-stretch:110%;color:#fff;font-variant-numeric:tabular-nums}
.uv-label em{font:600 11px/1 var(--uv-num);font-style:normal;color:var(--c)}
.uv-label.portal{border-color:rgba(246,224,175,.3);color:#ffeccb;cursor:default}
.uv-hud{position:absolute;inset:0;z-index:3;pointer-events:none;padding:clamp(22px,5vh,56px) clamp(20px,3.4vw,52px) 22px}
.uv-hud>*{pointer-events:auto;transition:opacity .9s ease}
.uv-title{position:relative;max-width:min(560px,42vw);pointer-events:none}
.uv-word{margin:0;font:800 clamp(58px,8.2vw,132px)/.9 var(--uv-num);font-stretch:125%;letter-spacing:-.02em;color:#f3f7ff;text-shadow:0 0 36px rgba(150,165,210,.14)}
.uv-sub{margin:14px 0 0;font-size:clamp(15px,1.3vw,19px);line-height:1.4;color:#aebddf;letter-spacing:.04em}
.uv-say{margin:26px 0 0;max-width:30em;font-size:clamp(15px,1.12vw,17px);line-height:1.8;color:var(--uv-mut);transition:opacity .5s}
.uv-say b{margin:0 .14em;font:650 1.2em/1 var(--uv-num);font-stretch:110%;color:#fff;font-variant-numeric:tabular-nums}
.uv-live{position:absolute;right:clamp(16px,2.4vw,40px);top:50%;transform:translateY(-50%);width:262px;padding:14px 14px 10px;border-radius:14px;border:1px solid var(--uv-edge);background:var(--uv-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.uv-live-h{display:flex;align-items:center;gap:9px;color:#d6e0f8;font-size:13px;font-weight:600}
.uv-rec{width:7px;height:7px;flex:none;border-radius:50%;background:#7fa99b}
.uv-live.stale .uv-rec{background:#b49c74}

.uv-live-h span{margin-left:auto;display:flex;align-items:baseline;gap:6px;color:var(--uv-dim);font-size:11.5px;font-weight:500}
.uv-live-h b{font:700 22px/1 var(--uv-num);font-stretch:115%;color:#fff;font-variant-numeric:tabular-nums}
.uv-feed{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:1px}
.uv-feed li{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:6px 8px;border-radius:8px;font-size:12px;color:#a9b8dc}
.uv-feed time{font:500 11.5px/1 var(--uv-num);color:#6f80a8;font-variant-numeric:tabular-nums}
.uv-feed span{color:var(--k,#e8eeff)}
.uv-feed em{font:500 11.5px/1 var(--uv-num);font-style:normal;color:#8c9cc3;font-variant-numeric:tabular-nums}
.uv-feed li.new{animation:uvnew .6s ease-out}
@keyframes uvnew{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
.uv-live-note{margin:8px 2px 2px;font-size:11.5px;line-height:1.55;color:var(--uv-dim)}
.uv-live-note:empty{display:none}
.uv-legend{position:absolute;left:clamp(20px,3.4vw,52px);bottom:58px;display:flex;flex-wrap:wrap;gap:6px;max-width:min(780px,56vw)}
.uv-legend button{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border-radius:20px;border:1px solid var(--uv-edge);background:rgba(8,12,28,.5);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#cfdaf5;font:inherit;font-size:12.5px;cursor:pointer}
.uv-legend button i{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 4px var(--c)}
.uv-legend button b{font:600 12px/1 var(--uv-num);color:#fff;font-variant-numeric:tabular-nums}
.uv-legend button:hover,.uv-legend button.on{border-color:var(--c);background:rgba(255,255,255,.07)}
.uv-ctrl{position:absolute;right:clamp(16px,2.4vw,40px);bottom:58px;display:flex;gap:8px}
.uv-ctrl button{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;border:1px solid rgba(167,187,238,.2);background:var(--uv-glass);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#dfe8ff;font:inherit;font-size:13px;cursor:pointer}
.uv-ctrl button:hover{background:rgba(30,42,80,.7)}
.uv-ctrl button[aria-pressed="true"]{border-color:var(--uv-spark);color:#fff3da}
.uv-ctrl svg{width:14px;height:14px;flex:none}
.uv-foot{position:absolute;left:clamp(20px,3.4vw,52px);right:clamp(16px,2.4vw,40px);bottom:18px;display:flex;justify-content:space-between;gap:16px;color:var(--uv-dim);font-size:11.5px;pointer-events:none}
.uv-cue svg{width:10px;height:10px;margin-left:6px;vertical-align:-1px}
.uv-tl{position:absolute;left:50%;bottom:110px;transform:translateX(-50%);width:min(660px,62vw);padding:12px 16px 14px;border-radius:14px;border:1px solid var(--uv-edge);background:var(--uv-glass);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.uv-tl[hidden]{display:none}
.uv-tl-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.uv-tl-h strong{font:700 26px/1 var(--uv-num);font-stretch:118%;color:#fff;font-variant-numeric:tabular-nums}
.uv-tl-h span{color:#b6c3e3;font-size:13px}
.uv-tl-bars{display:flex;align-items:flex-end;gap:3px;height:42px;margin-top:10px}
.uv-tl-bars i{flex:1;min-height:2px;border-radius:2px;background:rgba(167,187,238,.2);transition:background .3s}
.uv-tl-bars i.past{background:rgba(167,187,238,.5)}.uv-tl-bars i.on{background:var(--uv-spark)}
.uv-cap{position:absolute;left:clamp(20px,3.4vw,52px);bottom:calc(70px + var(--uv-leg, 46px));width:min(430px,40vw);padding:16px 18px 14px;border-radius:14px;border:1px solid var(--uv-edge);border-left:3px solid var(--c);background:rgba(7,11,26,.72);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.uv-cap[hidden]{display:none}
.uv-cap h3{margin:0;display:flex;align-items:center;gap:9px;font-size:18px;color:#fff}
.uv-cap h3 i{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 6px var(--c)}
.uv-cap p{margin:8px 0 12px;color:var(--uv-mut);font-size:13px;line-height:1.6}
.uv-cap dl{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0}
.uv-cap dt{color:var(--uv-dim);font-size:11.5px}
.uv-cap dd{margin:2px 0 0;font:700 22px/1.1 var(--uv-num);font-stretch:112%;color:#fff;font-variant-numeric:tabular-nums}
.uv-cap .row{display:flex;justify-content:space-between;align-items:center;margin-top:12px;color:var(--uv-dim);font-size:11.5px}
.uv-cap button{border:0;background:none;color:#aac0f2;font:inherit;font-size:12.5px;cursor:pointer;padding:4px 0}
.uv-tip{position:absolute;z-index:6;left:0;top:0;min-width:190px;padding:10px 12px;border-radius:10px;border:1px solid rgba(167,187,238,.2);background:rgba(5,9,22,.93);color:#cfdaf5;font-size:12px;pointer-events:none;box-shadow:0 10px 30px rgba(0,0,0,.5)}
.uv-tip[hidden]{display:none}
.uv-tip h4{margin:0 0 7px;display:flex;align-items:center;gap:7px;font-size:13px;color:#fff}
.uv-tip h4 i{width:8px;height:8px;border-radius:50%;background:var(--c)}
.uv-tip dl{display:grid;grid-template-columns:auto auto;gap:4px 16px;margin:0}
.uv-tip dt{color:#7d8db5}.uv-tip dd{margin:0;text-align:right;font:600 12px/1.3 var(--uv-num);color:#fff;font-variant-numeric:tabular-nums}

/* 开场：HUD 先藏起来，光点拼出 FeedMob 并收拢成大脑之后再出现。
   没有 JS 或 3D 加载失败时不会加上 intro，HUD 照常显示。 */
.uv.intro .uv-hud>*,.uv.intro .uv-labels{opacity:0;pointer-events:none}
.uv.focus .uv-say{opacity:0}
.uv.replaying .uv-say{opacity:.35}
.uv.replaying .uv-legend{opacity:0;pointer-events:none}
.uv.uv-flat{background:radial-gradient(circle at 62% 50%,rgba(167,191,238,.5) 0,rgba(124,140,196,.18) 9%,rgba(64,76,136,.08) 20%,transparent 34%),radial-gradient(70% 60% at 62% 52%,#0b1430 0%,#03050d 70%)}
.uv.uv-flat .uv-canvas,.uv.uv-flat .uv-ctrl{display:none}
.uv.uv-flat .uv-foot span:first-child{visibility:hidden}
body.uv-present{overflow:hidden}
body.uv-present .uv-cue{visibility:hidden}

@media (max-width:1100px){
  .fm-mcp code{max-width:24vw}
  .uv-title{max-width:60vw}
  .uv-live{top:auto;bottom:112px;transform:none;width:240px}
  .uv-legend{max-width:62vw}
}
@media (max-width:760px){
  .fm-top{gap:8px;padding:0 10px}
  .fm-brand span,.fm-health b,.fm-admin,.fm-how span{display:none}
  .fm-mcp{margin-left:0;padding-left:0;border-left:0}
  .fm-mcp code{max-width:34vw;padding:5px 8px;font-size:11.5px}
  .fm-steps{position:fixed;top:56px;left:10px;right:10px;width:auto}
  .fm-cmd{grid-template-columns:minmax(0,1fr) auto}
  .fm-cmd span{grid-column:1 / -1}
  .uv{min-height:540px}
  .uv-hud{padding:22px 16px 16px}
  .uv-title{max-width:none}
  .uv-word{font-size:56px}
  .uv-say{margin-top:14px;font-size:14.5px;line-height:1.7}
  .uv-live{left:16px;right:16px;bottom:118px;width:auto;padding:10px 12px}
  .uv-feed,.uv-live-note{display:none}
  .uv-legend{left:16px;right:16px;bottom:60px;max-width:none;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
  .uv-legend button{flex:none}
  .uv-ctrl{right:16px;bottom:16px}
  .uv-ctrl #uv-present{display:none}
  .uv-foot{display:none}
  .uv-tl{width:auto;left:16px;right:16px;transform:none;bottom:168px}
  .uv-cap{left:16px;right:16px;width:auto;bottom:118px}
  .uv.focus .uv-live{opacity:0;pointer-events:none}
  .uv-label:not(.portal):not(.on){display:none}
  .uv-tip{display:none}
}
@media (prefers-reduced-motion:reduce){
  .uv-rec,.uv-feed li.new{animation:none}
  .uv-hud>*,.uv-labels{transition:none}
}