/* /liby/demo —— 演示中心的共享外壳（配色 + 水印 + 声明条 + 顶栏栈 + 基础组件）。 * * 为什么是一个文件而不是每页各抄一份：这套演示由多个页面拼成（成品原型 / 知识库工场 / * AI 评估台 / 巡检回放 / UI 原型走廊），它们由不同的人先后写。**水印与「演示原型 · 数据为 * 合成样例」的声明条是硬约束**（合成数据被读成客户真实数据是这次最贵的失败）， * 各抄一份就会漏；放这里，新页面 link 一行就自带。 * * 三条纪律，加页面前先读： * ① 每张页面都要 ``（**绝对路径**—— * 入口 URL 是无尾斜杠的 /liby/demo，相对路径会按 /liby/ 解析然后 404）； * ② 每张页面开头照抄 `.wm` 平铺水印 + `.topstack > .ribbon`（模板见本文件末尾注释）； * ③ 零外部请求：不引 webfont、不引 CDN、不发接口调用。讲标现场的网络不由我方控制。 */ :root{ /* 存量系统 chrome：冷色，示意「贵方现有的合同管理系统」 */ --sys:#2B3A4A; --sys-2:#3A4C60; --sys-line:#DDE3EA; --sys-ink:#EAF0F6; /* 我方建设的部分：品牌青，与存量系统在视觉上分得开 */ --teal:#20B898; --teal-dark:#158A72; --teal-soft:#E9F8F5; --teal-line:#A6E4D5; --ink:#232629; --body:#5A6068; --muted:#8B9198; --line:#E7EAEE; --sunken:#F4F6F9; --card:#FFFFFF; --hi:#C0392B; --hi-soft:#FDECEA; --hi-line:#F3B5AC; --md:#B7791F; --md-soft:#FDF5E6; --md-line:#EDD9A8; --lo:#5B6B7C; --lo-soft:#EEF2F6; --lo-line:#CBD6E0; --ok:#1E8E5A; --ok-soft:#E8F6EE; --ok-line:#A9DCC1; --font:'Helvetica Neue',Helvetica,'PingFang SC','Hiragino Sans GB','Microsoft YaHei',Arial,sans-serif; --mono:ui-monospace,Menlo,Consolas,monospace; } *,*::before,*::after{box-sizing:border-box} html{-webkit-text-size-adjust:100%} /* ★ 别给 `html` 与 `body` **同时**设非 visible 的 overflow / overflow-x —— 那个组合会让 body 真的成为滚动容器，页内所有 position:sticky（声明条、系统导航、侧边栏）**当场全部失效且不报错**。也别给包住整页内容的**高祖先元素**设 overflow-x:hidden（要裁就用 `clip`）。横向溢出靠量（document.documentElement.scrollWidth === clientWidth），不靠这一行盖住。 ⚠️ `:root` **就是** `html` —— 而本文件上面正好有一个 `:root{...}` 块，是最顺手会被续写的地方：往它加一句 overflow，就与某张页内联的 `body{...}` 跨文件凑齐了危险组合。守卫认得这一格（它把 `:root` 归到 html），但读这段警告的人未必，所以在这里点名。实测对照（同一页同一元素，滚动约一屏后量 `.topstack` 的 `top`，issue #2694/#2693）：注入的 CSS top sticky `body{overflow-x:hidden}` 单写 0 ✅ 活 `html{overflow-x:hidden}` 单写 0 ✅ 活 `body{overflow:hidden}` 双轴单写 0 ✅ 活 `html,body{overflow-x:hidden}` −900 ❌ 死高祖先 div `{overflow-x:hidden}` −900 ❌ 死高祖先 div `{overflow-x:clip}` 0 ✅ 活机制：`html` 的 overflow 为 `visible` 时，`body` 的 overflow **传播到视口**，body 自己不成为滚动容器，其内的 sticky 照常对视口生效；只有 `html` 也被设成非 visible，传播链才断掉。另一条真凶与 body 无关：任何**高祖先元素**的 overflow 非 visible（`clip` 除外）都会把 sticky 的粘附范围钳在那个盒子里。 ⚠ 复现时别只把 `.topstack` 包进一个 div —— 那个 div 的高度就等于 topstack 高度，sticky 本就无处可粘，`top` 直接 −900 看着像 overflow 干的。必须把 body 的**全部子元素**包进去。守卫：`ai-site/app/lib/liby-demo.test.ts` 的「演示页 sticky 承重 · html/body overflow」 —— 按页合并「`` 的每个 css + 页内**全部** `