/* ==== src/css/00-base.css ==== */
/* ============================================================
   慧星软件官网 · 设计系统（编辑部 / 复盘手册 · 嫁接产品大图与行业矩阵）
   色：暖纸底 + 墨字 + 唯一强调色朱砂。字：HX Serif 标题 / HX Sans 正文。
   版式语法：细线分层、编号、图号图注、目录、档案表、条款。
   禁：渐变、阴影、圆角卡片、光晕、粒子、疏排小字（letter-spacing ≥ 1px）、英文小标。
   断点：1100（导航收汉堡）/ 900（单栏、表格变条目、出底栏）/ 420（小屏收字号）。
   组件用法与占位符见 DESIGN.md；各页私有样式写 src/css/pages/<page>.css。
   ============================================================ */

/* ---------- 自托管字体（tools/fonts.py 子集化，哈希由 build.py 回填） ---------- */
@font-face{font-family:"HX Sans";font-style:normal;font-weight:100 600;font-display:swap;src:url(../fonts/shs-medium.be21b3b3.woff2) format("woff2")}
@font-face{font-family:"HX Sans";font-style:normal;font-weight:700 900;font-display:swap;src:url(../fonts/shs-heavy.be21b3b3.woff2) format("woff2")}
@font-face{font-family:"HX Serif";font-style:normal;font-weight:100 700;font-display:swap;src:url(../fonts/shs-serif-bold.be21b3b3.woff2) format("woff2")}
@font-face{font-family:"HX Serif";font-style:normal;font-weight:800 900;font-display:swap;src:url(../fonts/shs-serif-heavy.be21b3b3.woff2) format("woff2")}

/* ---------- 令牌 ---------- */
:root{
  /* 色：只有纸、墨、朱砂三类 */
  --paper:#F5F1E8;            /* 纸 */
  --paper-2:#ECE6D8;          /* 纸深一号：页脚、代码底 */
  --paper-3:#FBF9F4;          /* 纸浅一号：图框内衬、缺图底 */
  --ink:#1B1A17;              /* 墨：正文、1px 节分隔线 */
  --ink-2:#4A4741;            /* 墨二：次要正文 */
  --ink-3:#6B675F;            /* 墨三：图注、表头、注脚（对纸底 ≈ 5:1） */
  --rule:rgba(27,26,23,.2);   /* 行分隔线 */
  --rule-2:rgba(27,26,23,.5); /* 链接下划线、点线 */
  --red:#B8321E;              /* 朱砂：编号、图号、链接、流星记号、少量线 */
  /* 字 */
  --serif:"HX Serif","Songti SC","STSong","Noto Serif CJK SC","Source Han Serif CN",serif;
  --sans:"HX Sans","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  --fs-body:17px;             /* 正文 */
  --fs-text:16px;             /* 段落（节内说明） */
  --fs-small:14.5px;          /* 小字 */
  --fs-meta:13.5px;           /* 图注、表头、编号：全站下限 */
  /* 间距 */
  --sp-1:8px; --sp-2:16px; --sp-3:24px; --sp-4:40px; --sp-5:64px; --sp-6:96px;
  /* 版心 */
  --w:1280px;                 /* 版心（含页边） */
  --gut:48px;                 /* 页边 */
  --bleed:calc(max(0px,(100vw - var(--w)) / 2) + var(--gut)); /* 从版心右缘出血到视口右缘的距离 */
  --nav-h:64px;
}

/* ---------- 基础 ---------- */
[hidden]{display:none!important}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 20px)}
body{margin:0;background:var(--paper);color:var(--ink);font:500 var(--fs-body)/1.8 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
h1,h2,h3,h4{margin:0;font-family:var(--serif);font-weight:700;line-height:1.35;letter-spacing:0;text-wrap:balance}
h1,h2{font-weight:900}
p,figure,blockquote{margin:0}
p,.tbl td,dd,li{text-wrap:pretty}   /* 段落、表格格子、释义、列表项：末行不留单字 */
ul,ol{margin:0;padding:0;list-style:none}
table{border-collapse:collapse;width:100%}
q{quotes:"「" "」" "『" "』"}
::selection{background:var(--ink);color:var(--paper)}
:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--gut)}
.narrow{max-width:820px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.red{color:var(--red)}
.muted{color:var(--ink-3)}
.ar{width:1em;height:1em;vertical-align:-.15em;display:inline-block}
.cv{width:.7em;height:.7em;display:inline-block}
.lab{font-family:var(--serif);font-size:15.5px;font-weight:700;line-height:1.5;color:var(--red)}
.nw{white-space:nowrap}
.seg{display:inline-block}   /* 标题分段：段内不断行，只在「，：；？！」后换行（生成器用 ctx['seg']，手写用 <span class="seg">） */
.empty{padding:28px 0;border-bottom:1px solid var(--rule);font-size:15px;color:var(--ink-3)}

/* ---------- 文字阶梯 ---------- */
.t-cover{font-size:clamp(28px,3vw,42px);line-height:1.42;font-weight:900}
.t-sec{font-size:clamp(26px,2.6vw,34px);line-height:1.35;font-weight:900}
.t-sub{font-size:clamp(20px,1.8vw,24px);line-height:1.45;font-weight:700}
.t-item{font-size:18px;line-height:1.5;font-weight:700}
.lead{font-size:17px;line-height:1.9;color:var(--ink-2)}
.lede{font-size:18px;line-height:1.9;color:var(--ink)}
.meta{font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.small{font-size:14.5px;line-height:1.7}
.note{font-size:14px;line-height:1.75;color:var(--ink-3)}

/* ---------- 链接 / 唯一的按钮 ---------- */
.lnk{border-bottom:1px solid var(--rule-2);padding-bottom:1px}
.lnk.red{color:var(--red);border-color:var(--red)}
.more{border-bottom:1px solid var(--rule-2);padding-bottom:1px}
.btn{display:inline-block;background:var(--ink);color:var(--paper);padding:13px 26px;font-size:15.5px;line-height:1.3;border:1px solid var(--ink);border-radius:0;cursor:pointer;white-space:nowrap}
.copy{display:inline-block;background:none;border:0;border-bottom:1px solid var(--rule-2);padding:0 0 1px;margin-left:12px;font-size:13.5px;color:var(--ink-3);cursor:pointer;vertical-align:baseline}
.tag-form,.tag-ind{font-size:13.5px;color:var(--ink-3)}
.tag-form + .tag-form::before,.tag-ind + .tag-form::before{content:" · "}

/* ---------- 流星记号：一线一点，全站唯一的图形 ---------- */
.comet{display:inline-block;width:38px;height:12px;vertical-align:middle}
.comet line{stroke:var(--red);stroke-width:1.3;stroke-linecap:round}
.comet circle{fill:var(--red)}
.endmark{display:flex;justify-content:flex-end;margin-top:40px}

/* ---------- 报头 + 导航 ---------- */
.wx-share{position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;opacity:.01;pointer-events:none}
.wx-share img{width:300px;height:300px}
.mast-top{border-bottom:1px solid var(--rule);font-size:13.5px;line-height:1.6;color:var(--ink-3)}
.mast-top .wrap{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding-top:8px;padding-bottom:8px}
.mast-top .wrap > span:first-child{white-space:nowrap}
.mast-top .news{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mast-top .news b{font-weight:500;color:var(--red);margin-right:8px}
.nav{position:sticky;top:0;z-index:60;background:var(--paper);border-bottom:1px solid var(--ink)}
.nav .wrap{height:var(--nav-h);display:flex;align-items:center;gap:32px}
.brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:900;font-size:22px;line-height:1;letter-spacing:.02em;white-space:nowrap}
.brand .comet{width:34px;height:12px}
.menu{display:flex;gap:28px;font-size:15px;margin-left:auto}
.menu a{display:block;padding:4px 0;border-bottom:1px solid transparent;white-space:nowrap}
.menu a.on{border-color:var(--ink)}
.nav .tel{font-size:15.5px;font-weight:700;white-space:nowrap}
.nav .tel .k{font-size:13.5px;font-weight:500;color:var(--ink-3);margin-right:8px}
.burger{display:none;flex:0 0 44px;width:44px;height:44px;border:0;background:none;cursor:pointer;padding:13px 10px;margin-right:-10px}
.burger span{display:block;height:1.5px;background:var(--ink);transition:transform .2s,opacity .2s}
.burger span + span{margin-top:6px}
.burger.on span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger.on span:nth-child(2){opacity:0}
.burger.on span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.mnav{display:none;position:fixed;left:0;right:0;bottom:0;top:var(--mnav-top,64px);z-index:55;background:var(--paper);padding:4px var(--gut) 40px;overflow:auto;overscroll-behavior:contain}
.mnav.on{display:block}
.mnav ol{max-width:640px}
.mnav li{border-bottom:1px solid var(--rule)}
.mnav li a{display:flex;align-items:baseline;gap:14px;padding:14px 0;font-family:var(--serif);font-size:22px;font-weight:700;line-height:1.4}
.mnav li a .no{flex:0 0 26px;font-family:var(--sans);font-size:13.5px;font-weight:500;color:var(--red)}
.mnav li a.on{color:var(--red)}
.mnav .mfoot{margin-top:24px;font-size:15px;line-height:2;color:var(--ink-2)}
.mnav .mfoot a{color:var(--ink);border-bottom:1px solid var(--rule-2)}
.mbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:50;background:var(--paper);border-top:1px solid var(--ink);padding-bottom:env(safe-area-inset-bottom)}
.mbar a{flex:1;display:flex;align-items:center;justify-content:center;height:48px;font-size:15px;border-left:1px solid var(--rule)}
.mbar a:first-child{border-left:0}
.mbar a.pri{color:var(--red)}

/* ---------- 节 ---------- */
main{display:block}
.sec{padding:72px 0 80px;border-top:1px solid var(--ink)}
.sec.flush{border-top:0}
.sec.clip{overflow:hidden}

/* 节头 · 写法一：朱砂大编号 + 标题 + 右栏说明（同页最多两次，不相邻） */
.sh-num{display:grid;grid-template-columns:110px minmax(0,1fr) minmax(0,460px);align-items:baseline;gap:24px;margin-bottom:40px}
.sh-num .no{font-family:var(--serif);font-size:54px;line-height:1;font-weight:900;color:var(--red)}
.sh-num h2{font-size:clamp(26px,2.6vw,34px)}
.sh-num .meta{font-size:14.5px;line-height:1.85;color:var(--ink-2)}
.sh-num + .terms{margin-top:0}

/* 节头 · 写法二：左「编号　栏名」+ 一句话标题，右一段引言，底下一条细线 */
.sh-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:end;margin-bottom:8px;padding-bottom:24px;border-bottom:1px solid var(--rule)}
.sh-split .lab{margin-bottom:12px}
.sh-split h2{font-size:clamp(28px,3vw,40px);line-height:1.35}
.sh-split p:not(.lab){font-size:16px;line-height:1.9;color:var(--ink-2)}
.sh-split + .tbl,.sh-split + .matrix-wrap{margin-top:32px}   /* 两栏节头下直接接表格时留出距离 */

/* 节头 · 写法三：流星记号 + 标题，右侧一句说明，底下一条细线 */
.sh-mark{display:flex;align-items:baseline;gap:8px 16px;padding-bottom:14px;border-bottom:1px solid var(--rule);margin-bottom:36px;flex-wrap:wrap}
.sh-mark .comet{flex:0 0 38px;position:relative;top:-3px}
.sh-mark h2{font-size:clamp(24px,2.2vw,30px)}
.sh-mark .meta{margin-left:auto;font-size:14.5px;color:var(--ink-2)}
.sh-mark + .feats > .feat:first-child{padding-top:24px}

/* 节内小标题（一行：宋体标题 + 说明） */
.sub-h{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 20px;margin:64px 0 16px}
.sub-h h3{font-size:22px}
.sub-h .meta{font-size:14px}

/* 节尾注：左说明右链接 */
.foot-note{margin-top:22px;display:flex;justify-content:space-between;align-items:baseline;gap:24px;font-size:14px;line-height:1.75;color:var(--ink-3)}
.foot-note .lnk{color:var(--ink);font-size:15.5px;white-space:nowrap}

/* ---------- 封面（首页首屏） ---------- */
.cover{padding:36px 0 64px;overflow:hidden}
.cover-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:56px;row-gap:40px;align-items:start}
.cover .claim{grid-column:1;grid-row:1}
.cover .claim h1{font-size:clamp(28px,3vw,42px);line-height:1.42;font-weight:900}
.cover .claim .deck{margin-top:22px;font-size:16.5px;line-height:1.95;color:var(--ink-2)}
.cover .claim .deck + .deck{margin-top:10px}
.cover .claim .go{margin-top:24px;font-size:16.5px}
.cover .fig{grid-column:2;grid-row:1 / span 2;margin-top:8px}
.cover .toc{grid-column:1;grid-row:2}
.bleed-r{width:calc(100% + var(--bleed));max-width:none}
.bleed-r figcaption{max-width:calc(100% - var(--bleed))}

/* 目录（点线引导，像书的目录页） */
.toc .lab{margin-bottom:8px}
.toc ol{border-top:1px solid var(--ink)}
.toc li a{display:flex;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.6}
.toc li .no{flex:0 0 24px;font-size:13.5px;color:var(--red)}
.toc li .t{font-family:var(--serif);font-weight:700;font-size:17px;white-space:nowrap}
.toc li .dots{flex:1;border-bottom:1px dotted var(--rule-2);position:relative;top:-5px;min-width:16px}
.toc li .d{font-size:13.5px;color:var(--ink-3);text-align:right;white-space:nowrap}

/* ---------- 图版：图 + 图注（图 NN 系统名 · 谁在用 · 一句话） ---------- */
.fig > a{display:block;position:relative}
.fig img{width:100%;height:auto;border:1px solid var(--ink);background:#fff}
.fig figcaption{margin-top:10px;font-size:14px;line-height:1.75;color:var(--ink-2)}
.fig figcaption b{font-family:var(--serif);font-weight:700;color:var(--red);margin-right:10px;white-space:nowrap}
.fig figcaption .nm{color:var(--ink)}
.fig figcaption .sep,.fig figcaption .who{color:var(--ink-3)}
.fb{display:flex;align-items:center;justify-content:center;aspect-ratio:8/5;border:1px solid var(--ink);background:var(--paper-3);font-family:var(--serif);font-size:20px;font-weight:700;line-height:1.5;color:var(--ink-3);text-align:center;padding:16px}

/* 一屏一套系统：大图与文字左右交替 */
.feat{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:56px;align-items:center;padding:56px 0}
.feat + .feat{border-top:1px solid var(--rule)}
.feat.flip{grid-template-columns:minmax(0,4fr) minmax(0,8fr)}
.feat.flip .fig{order:2}
.feat .txt .who{font-size:14px;color:var(--ink-3)}
.feat .txt h3{font-size:clamp(22px,2vw,28px);line-height:1.5;margin-top:8px}
.feat .txt p:not(.who):not(.go){margin-top:16px;font-size:16px;line-height:1.95;color:var(--ink-2)}
.feat .txt .go{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:15.5px}

/* 十三格拼版（2px 墨缝） */
.mosaic{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;background:var(--ink);border:1px solid var(--ink)}
.mosaic > a{display:block;position:relative;aspect-ratio:8/5;overflow:hidden;background:var(--paper-3)}
.mosaic > a img{width:100%;height:100%;object-fit:cover;object-position:top left}
.mosaic .fb{position:absolute;inset:0;aspect-ratio:auto;border:0}
.mosaic .cap{position:absolute;left:0;bottom:0;max-width:100%;background:var(--paper);color:var(--ink);font-size:13.5px;line-height:1.45;padding:4px 10px 4px 8px;border-top:1px solid var(--ink);border-right:1px solid var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mosaic .cap b{font-family:var(--serif);font-weight:700;color:var(--red);margin-right:6px}
.mosaic .all{grid-column:span var(--sd,3);aspect-ratio:auto;background:var(--paper);display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:20px 24px;font-size:15px;line-height:1.75}
.mosaic .all p{max-width:560px;color:var(--ink-2)}
.mosaic .all .lnk{color:var(--ink);white-space:nowrap}
.mosaic-hint{display:none;margin-top:10px;font-size:13.5px;color:var(--ink-3)}

/* 图版清单（体验中心页：三栏图 + 图注，可筛选） */
.plates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 32px}
.plate > a{display:block;position:relative}
.plate img{width:100%;height:auto;border:1px solid var(--ink);background:#fff}
.plate figcaption{margin-top:12px;display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.plate figcaption b{font-family:var(--serif);font-weight:700;color:var(--red);font-size:15px}
.plate figcaption .nm{font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.5}
.plate figcaption .tg{font-size:13.5px;color:var(--ink-3)}
.plate .d{margin-top:6px;font-size:14.5px;line-height:1.8;color:var(--ink-2)}
.plate .go{margin-top:8px;display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;font-size:14.5px}
.plate .go .note{font-size:13.5px;color:var(--ink-3)}

/* 图号索引（两栏小表） */
.fig-index{columns:2;column-gap:48px;border-top:1px solid var(--ink)}
.fig-index li{display:flex;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px solid var(--rule);font-size:14.5px;break-inside:avoid}
.fig-index li b{font-family:var(--serif);font-weight:700;color:var(--red);flex:0 0 52px;white-space:nowrap}
.fig-index li span:last-child{margin-left:auto;color:var(--ink-3);font-size:13.5px;white-space:nowrap}

/* 身份阅读指引：一行（{{READING_GUIDE}}） */
.guide-line{margin-top:20px;padding-top:14px;border-top:1px solid var(--rule);font-size:15.5px;line-height:2;color:var(--ink-2)}
.guide-line .k{font-family:var(--serif);font-weight:700;color:var(--ink);margin-right:12px}
.guide-line b{font-weight:500;color:var(--ink)}
.guide-line a{color:var(--red);border-bottom:1px solid transparent;white-space:nowrap}
.guide-line a.all{color:var(--ink-2);border-bottom-color:var(--rule-2)}   /* 「共 N 套」= 体验中心按身份筛出的全集 */
/* 身份阅读指引：列表版（内页可用） */
.guide{margin-top:28px;border-top:1px solid var(--ink)}
.guide li{display:grid;grid-template-columns:200px minmax(0,1fr);gap:24px;padding:12px 0;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.8}
.guide li b{font-family:var(--serif);font-weight:700}
.guide li a{color:var(--red);border-bottom:1px solid transparent}

/* ---------- 细线表格（档案表 / 步骤表） ---------- */
.tbl{border-collapse:separate;border-spacing:0}
.tbl th{font-weight:500;font-size:13.5px;color:var(--ink-3);text-align:left;padding:0 20px 10px 0;border-bottom:1px solid var(--ink);vertical-align:bottom;white-space:nowrap}
.tbl td{padding:20px 20px 20px 0;border-bottom:1px solid var(--rule);vertical-align:top;font-size:15px;line-height:1.8;color:var(--ink-2)}
.tbl th:last-child,.tbl td:last-child{padding-right:0}
.tbl tbody tr:last-child td,.tbl tbody tr.is-last td{border-bottom-color:var(--ink)}
.tbl td.who{color:var(--ink)}
.tbl td.who .no{display:block;font-size:13.5px;line-height:1.5;color:var(--red)}
.tbl td.who b{display:block;font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.45;margin-top:3px}
.tbl td.who .sub{display:block;font-size:13.5px;line-height:1.6;color:var(--ink-3);margin-top:4px}
.tbl td.res{color:var(--ink)}
.tbl td.res a{display:table;margin-top:8px;font-size:14px;color:var(--red);border-bottom:1px solid transparent}
.tbl.cases .c-who{width:24%}.tbl.cases .c-pain{width:23%}.tbl.cases .c-how{width:31%}.tbl.cases .c-res{width:22%}

/* 四步推进表 */
.tbl.steps td{padding:14px 24px 14px 0;font-size:15px}
.tbl.steps td:first-child{font-family:var(--serif);font-weight:700;color:var(--red);font-size:15px;width:48px;white-space:nowrap}
.tbl.steps td:nth-child(2){font-family:var(--serif);font-size:17px;font-weight:700;color:var(--ink);width:130px;white-space:nowrap}
.tbl.steps td:nth-child(3){width:170px;white-space:nowrap;color:var(--ink)}
.tbl.steps td:nth-child(3) i{font-style:normal;color:var(--red);font-size:13.5px;margin-left:8px}

/* ---------- 矩阵（行业 × 形态，外层横滑） ---------- */
.matrix-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.matrix{min-width:900px;table-layout:fixed;border-collapse:separate;border-spacing:0}
.matrix th,.matrix td{text-align:left;vertical-align:top;border-bottom:1px solid var(--rule);padding:12px 8px 12px 0;font-weight:500}
.matrix thead th{border-bottom:1px solid var(--ink);vertical-align:bottom;padding-bottom:12px}
.matrix thead th b{display:block;font-family:var(--serif);font-size:16px;font-weight:700}
.matrix thead th small{display:block;font-size:13.5px;color:var(--ink-3);line-height:1.5;margin-top:3px}
.matrix th.c0{width:31%}
.matrix th.c0 .lab-s{font-size:13.5px;color:var(--ink-3)}
.matrix tbody th.c0 a{display:block}
.matrix th.c0 .no{font-size:13.5px;color:var(--red);display:inline-block;width:32px}
.matrix th.c0 b{font-family:var(--serif);font-size:16px;font-weight:700}
.matrix th.c0 small{display:block;font-size:13.5px;color:var(--ink-3);padding-left:32px;line-height:1.55;margin-top:2px}
.matrix tbody tr:last-child > *{border-bottom-color:var(--ink)}
.matrix td .n{display:inline-block;min-width:40px;text-align:center;padding:3px 0;font-size:20px;line-height:1.3;color:var(--ink)}
.matrix td .dot{display:inline-block;width:5px;height:5px;background:var(--ink-3);opacity:.55;margin:14px 0 0 18px}
.matrix .tot{width:8%;border-left:1px solid var(--ink);padding-left:14px}
.matrix td.tot .n{min-width:0;text-align:left;color:var(--ink-2)}
.matrix tfoot th,.matrix tfoot td{border-bottom:1px solid var(--ink)}
.matrix tfoot th.c0{font-size:14.5px;color:var(--ink-2)}
.matrix-hint{display:none;margin-top:10px;font-size:13.5px;color:var(--ink-3)}
.matrix-note{margin-top:14px;font-size:14px;line-height:1.75;color:var(--ink-3)}

/* 六类形态，各一句话（{{FORMS_NOTE}}） */
.forms-note{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px;border-top:1px solid var(--ink)}
.forms-note li{display:grid;grid-template-columns:140px minmax(0,1fr);gap:16px;padding:16px 0;border-bottom:1px solid var(--rule)}
.forms-note li b{font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.5}
.forms-note li b small{display:block;font-family:var(--sans);font-weight:500;font-size:13.5px;color:var(--ink-3);line-height:1.5;margin-top:4px}
.forms-note li p{font-size:15px;line-height:1.8;color:var(--ink)}
.forms-note li .ref{margin-top:4px;font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.forms-note li .ref a{color:var(--red);border-bottom:1px solid transparent}

/* 行业索引（十行，{{IND_INDEX}}） */
.ind-index{border-top:1px solid var(--ink);columns:2;column-gap:48px}
.ind-index li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:0 12px;padding:16px 0;border-bottom:1px solid var(--rule);break-inside:avoid}
.ind-index li .no{font-size:13.5px;color:var(--red);padding-top:5px}
.ind-index li b{font-family:var(--serif);font-size:18px;font-weight:700;display:block;line-height:1.4}
.ind-index li p{font-size:14.5px;color:var(--ink-2);line-height:1.75;margin-top:4px}
.ind-index li .ref{font-size:13.5px}
.ind-index li .ref a{color:var(--red)}

/* ---------- 笔记 ---------- */
.notes-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:72px;align-items:start}
.note-lead .m{display:flex;gap:4px 16px;flex-wrap:wrap;font-size:13.5px;color:var(--ink-3)}
.note-lead .m b{font-weight:500;color:var(--red)}
.note-lead h3{font-size:clamp(24px,2.3vw,32px);line-height:1.45;margin-top:12px}
.note-lead .lede{margin-top:16px;font-size:17.5px;line-height:1.9}
.note-lead .body{margin-top:18px;padding-top:6px;border-top:1px solid var(--rule)}
.note-lead .body p,.note-lead .body li{font-size:16px}
.note-lead .body h2{font-size:19px;margin:24px 0 8px}
.note-lead .go{margin-top:24px;font-size:15.5px;display:flex;gap:8px 28px;flex-wrap:wrap}
.note-side .lab{margin-bottom:8px}
.note-side .side-go{margin-top:16px;font-size:15px}
.note-index{border-top:1px solid var(--ink)}
.note-index li{padding:14px 0;border-bottom:1px solid var(--rule)}
.note-index .m{display:flex;gap:4px 14px;flex-wrap:wrap;font-size:13.5px;color:var(--ink-3)}
.note-index .m b{font-weight:500;color:var(--red)}
.note-index h4{font-family:var(--serif);font-size:17px;font-weight:700;margin-top:4px;line-height:1.55}
.note-index p{font-size:14.5px;line-height:1.75;color:var(--ink-2);margin-top:4px}

/* 正文排版 .article：首页笔记摘录与笔记正文页共用（正文页外框 .art-* 只在 notes.css 里） */
.article h2{font-size:22px;font-weight:700;margin:40px 0 12px;line-height:1.5}
.article h2::before{content:"";display:inline-block;width:18px;height:1px;background:var(--red);vertical-align:middle;margin-right:12px}
.article h3{font-size:18.5px;font-weight:700;margin:28px 0 8px}
.article p{font-size:17px;line-height:1.95;color:var(--ink-2)}
.article p + p{margin-top:16px}
.article ul,.article ol{margin:14px 0;color:var(--ink-2);font-size:17px;line-height:1.9}
.article ul li{padding-left:20px;position:relative}
.article ul li::before{content:"";position:absolute;left:0;top:.95em;width:8px;height:1px;background:var(--red)}
.article ol{list-style:cjk-decimal;padding-left:2.2em}
.article ol li::marker{color:var(--red);font-family:var(--serif);font-weight:700}
.article li + li{margin-top:8px}
.article blockquote{margin:24px 0;padding:4px 0 4px 20px;border-left:2px solid var(--ink);font-family:var(--serif);font-size:18px;line-height:1.8;color:var(--ink)}
.article strong{font-weight:500;color:var(--ink);border-bottom:1px solid var(--rule-2)}
.article code{font-family:var(--sans);font-size:.92em;background:var(--paper-2);padding:1px 6px}

/* ---------- 动态清单（{{NEWS_LIST}} / {{NEWS_BRIEF}}） ---------- */
.news-list{border-top:1px solid var(--ink)}
.news-list li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--rule)}
.news-list li .d{font-size:13.5px;color:var(--red);padding-top:3px}
.news-list li b{font-family:var(--serif);font-size:16px;font-weight:700;display:block;line-height:1.6}
.news-list li p{font-size:14.5px;color:var(--ink-2);margin-top:4px;line-height:1.75}
.news-list li small{display:block;margin-top:4px;font-size:13.5px;color:var(--ink-3)}
.news-list.brief li{padding:10px 0;gap:12px;grid-template-columns:64px minmax(0,1fr)}
.news-list.brief li b{font-size:15px}

/* ---------- 条款（{{TERMS}}：四条 + 附一 + 附二） ---------- */
.terms{border-top:1px solid var(--ink);margin-top:32px}
.term{display:grid;grid-template-columns:140px minmax(0,1fr) minmax(0,1.3fr);column-gap:40px;padding:26px 0;border-bottom:1px solid var(--rule)}
.term .k{font-family:var(--serif);font-size:21px;font-weight:900;color:var(--red);line-height:1.5}
.term h3{font-size:21px;font-weight:700;line-height:1.5}
.term p{font-size:16px;color:var(--ink-2);line-height:1.9}
.term p b{font-weight:500;color:var(--ink);border-bottom:1px solid var(--rule-2)}
.annex{margin-top:48px;display:grid;grid-template-columns:140px minmax(0,1fr);column-gap:40px}
.annex .h{font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.5}
.annex .h b{display:block;font-size:15px;color:var(--red);margin-bottom:2px}
.annex .h small{display:block;font-family:var(--sans);font-weight:500;font-size:14px;color:var(--ink-3);margin-top:8px;line-height:1.7}
.modes{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
.mode{border-top:1px solid var(--ink);padding-top:14px}
.mode b{font-family:var(--serif);font-size:19px;font-weight:700;display:flex;justify-content:space-between;align-items:baseline;gap:12px}
.mode b small{font-family:var(--sans);font-weight:500;font-size:13.5px;color:var(--ink-3)}
.mode p{margin-top:8px;font-size:15.5px;color:var(--ink-2);line-height:1.85}

/* ---------- 联系 ---------- */
.contact-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,4fr);column-gap:80px;align-items:start}
.contact-grid > div > .lab{margin-bottom:14px}
.contact-grid h2{font-size:clamp(26px,2.6vw,36px);line-height:1.45}
.contact-grid .deck{margin-top:18px;font-size:16.5px;line-height:1.95;color:var(--ink-2);max-width:620px}
.lines{margin-top:32px;border-top:1px solid var(--ink)}
.lines li{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--rule);align-items:baseline;font-size:16px}
.lines li .k{font-size:14px;color:var(--ink-3)}
.lines li .big{font-size:30px;line-height:1.2;font-weight:700}
.qr{display:flex;gap:20px;align-items:flex-start}
.qr .box{flex:0 0 150px;width:150px;border:1px solid var(--ink);padding:8px;background:#fff}
.qr .box img{width:100%;height:auto}
.qr .box .fb{aspect-ratio:1;border:0;font-family:var(--sans);font-size:13.5px;font-weight:500;padding:8px}
.qr p{font-size:14.5px;line-height:1.85;color:var(--ink-2)}
.qr p b{font-family:var(--serif);font-weight:700;color:var(--ink);display:block;font-size:17px;margin-bottom:4px}
.contact-side .write{margin-top:22px;padding-top:14px;border-top:1px solid var(--rule);font-size:15px;color:var(--ink-2)}
.contact-side .recent{margin-top:32px}
.contact-side .recent .lab{margin-bottom:8px}

/* ---------- 筛选条（通用筛选 JS：.fbtn[data-key][data-val]，.on = 选中） ---------- */
.fstrip{display:flex;flex-wrap:wrap;gap:6px 20px;padding:12px 0;border-bottom:1px solid var(--rule);align-items:baseline}
.fstrip:first-of-type{border-top:1px solid var(--ink)}
.fstrip .k{flex:0 0 auto;font-family:var(--serif);font-weight:700;font-size:15px;color:var(--ink);margin-right:6px;white-space:nowrap}
.fbtn{background:none;border:0;padding:2px 0;border-bottom:1px solid transparent;border-radius:0;font-size:15px;color:var(--ink-3);cursor:pointer;white-space:nowrap}
.fbtn.on{color:var(--red);border-color:var(--red)}
.count-note{margin-left:auto;font-size:13.5px;color:var(--ink-3)}

/* ---------- 表单（联系页需求自述） ---------- */
.form{display:grid;gap:18px}
.form .field label{display:block;font-size:14.5px;color:var(--ink-2);margin-bottom:6px}
.form input,.form select,.form textarea{width:100%;border:0;border-bottom:1px solid var(--rule-2);background:transparent;padding:8px 0;font:inherit;font-size:16px;color:var(--ink);border-radius:0}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--ink)}
.form textarea{min-height:110px;resize:vertical}
.form .hint{font-size:13.5px;color:var(--ink-3);margin-top:4px}
.form .err{font-size:13.5px;color:var(--red);display:none;margin-top:4px}
.form .has-err input,.form .has-err textarea,.form .has-err select{border-color:var(--red)}
.form .has-err .err{display:block}
.form .g2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form .out{border:1px solid var(--ink);padding:16px 18px;font-size:14.5px;white-space:pre-wrap;line-height:1.75;background:var(--paper-3)}
.toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,12px);width:max-content;max-width:calc(100vw - 40px);text-align:center;background:var(--ink);color:var(--paper);padding:11px 18px;font-size:14.5px;opacity:0;visibility:hidden;transition:.25s;z-index:2000;pointer-events:none}   /* 只看不点：不挡下面的按钮 */
.toast.on{opacity:1;visibility:visible;transform:translate(-50%,0)}

/* ---------- 问答折叠（联系页常见问题） ---------- */
.faq{border-top:1px solid var(--ink)}
.faq details{border-bottom:1px solid var(--rule)}
.faq summary{list-style:none;cursor:pointer;padding:16px 0;font-family:var(--serif);font-weight:700;font-size:17px;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"＋";color:var(--red);font-family:var(--sans);font-weight:500}
.faq details[open] summary::after{content:"－"}
.faq .a{padding:0 0 18px;font-size:15.5px;line-height:1.85;color:var(--ink-2);max-width:760px}

/* ---------- 档案信息表（关于页工商信息） ---------- */
.info th,.info td{padding:12px 16px 12px 0;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;font-size:15.5px;line-height:1.7}
.info th{width:150px;font-weight:500;color:var(--ink-3);font-size:14px}
.info tr:first-child th,.info tr:first-child td{border-top:1px solid var(--ink)}

/* ---------- 版权页（页脚） ---------- */
.colophon{border-top:1px solid var(--ink);background:var(--paper-2);padding:36px 0 32px}
.colophon .top{display:flex;justify-content:space-between;align-items:baseline;gap:14px 32px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--ink)}
.colophon .top .brand{font-size:20px}
.colophon .links{display:flex;gap:6px 22px;flex-wrap:wrap;font-size:14.5px}
.colophon .info-lines{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px}
.colophon .info-lines li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;padding:9px 0;border-bottom:1px solid var(--rule);font-size:14.5px;line-height:1.7}
.colophon .info-lines li .k{color:var(--ink-3);font-size:13.5px;padding-top:1px}
.pg-about ~ .colophon .f-facts{display:none}   /* 关于页首屏已写公司级数字，页脚不再重复 */
.pg-about ~ .colophon .info-lines li:last-child{grid-column:1 / -1}   /* 少了一行后补成通栏，免得右栏空一格 */
.colophon .bot{margin-top:18px;display:flex;justify-content:space-between;gap:6px 24px;flex-wrap:wrap;font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.colophon .bot a{border-bottom:1px solid var(--rule-2);white-space:nowrap}

/* ---------- 悬停：只给有鼠标的设备（触屏点完不会粘在悬停色上）；新加的 :hover 也写进这里 ---------- */
@media (hover:hover){
  .lnk:hover{color:var(--red);border-color:var(--red)}
  .lnk.red:hover{color:var(--ink);border-color:var(--ink)}
  .more:hover{color:var(--red);border-color:var(--red)}
  .btn:hover{background:var(--red);border-color:var(--red);color:var(--paper)}
  .copy:hover{color:var(--red);border-color:var(--red)}
  .mast-top .news:hover{color:var(--ink)}
  .menu a:hover{border-color:var(--rule-2)}
  .nav .tel:hover{color:var(--red)}
  .toc li a:hover .t{color:var(--red)}
  .fig > a:hover img{border-color:var(--red)}
  .mosaic > a:hover img{opacity:.85}
  .mosaic .all:hover{background:var(--paper-2)}
  .plate > a:hover img{border-color:var(--red)}
  .fig-index li a:hover{color:var(--red)}
  .guide-line a:hover{border-color:var(--red)}
  .guide li a:hover{border-color:var(--red)}
  .tbl td.res a:hover{border-color:var(--red)}
  .matrix thead th a:hover b{color:var(--red)}
  .matrix tbody th.c0 a:hover b{color:var(--red)}
  .matrix td a.n:hover{background:var(--ink);color:var(--paper)}
  .forms-note li .ref a:hover{border-color:var(--red)}
  .ind-index li a:hover b{color:var(--red)}
  .note-lead h3 a:hover{color:var(--red)}
  .note-index li a:hover h4{color:var(--red)}
  .lines li .big:hover{color:var(--red)}
  .fbtn:hover{color:var(--ink)}
  .colophon .links a:hover{color:var(--red)}
  .colophon .info-lines li a:hover{color:var(--red)}
  .colophon .bot a:hover{color:var(--red);border-color:var(--red)}
  .guide-line a.all:hover{color:var(--red);border-color:var(--red)}
}

/* ---------- 响应式 ---------- */
@media (max-width:1280px){
  .nav .tel .k{display:none}
}
@media (max-width:1100px){
  :root{--gut:36px}
  .menu{display:none}
  .burger{display:block}
  .nav .wrap{gap:16px}
  .nav .tel{margin-left:auto}
  .cover-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
  .feat,.feat.flip{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  .notes-grid{column-gap:48px}
  .contact-grid{column-gap:48px}
  .sh-num{grid-template-columns:90px minmax(0,1fr)}
  .sh-num .meta{grid-column:2}
  .sh-num .no{font-size:44px}
  .term{grid-template-columns:110px minmax(0,1fr) minmax(0,1.2fr);column-gap:28px}
  .annex{grid-template-columns:110px minmax(0,1fr);column-gap:28px}
  .plates{grid-template-columns:repeat(2,minmax(0,1fr))}
  .forms-note li{grid-template-columns:120px minmax(0,1fr)}
}
@media (max-width:900px){
  :root{--gut:24px;--bleed:0px;--nav-h:56px}
  body{font-size:16.5px;padding-bottom:49px}
  .sec{padding:36px 0 44px}
  .mast-top{font-size:13px}
  .mast-top .wrap{padding-top:6px;padding-bottom:6px}
  .mast-top .news{display:none}
  .brand{font-size:21px}
  /* 首屏：主张 → 图 01 → 目录 */
  .cover{padding:24px 0 32px}
  .cover-grid{grid-template-columns:minmax(0,1fr);row-gap:28px}
  .cover .claim,.cover .fig,.cover .toc{grid-column:1;grid-row:auto}
  .cover .fig{margin-top:0}
  .cover .claim h1{font-size:28px}
  .cover .claim .deck{font-size:16px;margin-top:16px}
  .cover .claim .go{margin-top:16px}
  .toc ol{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:20px}
  .toc li a{padding:7px 0;gap:8px}
  .toc li .t{font-size:16px}
  .toc li .d,.toc li .dots{display:none}
  /* 节头 */
  .sh-num{grid-template-columns:auto minmax(0,1fr);row-gap:8px;column-gap:16px;margin-bottom:24px}
  .sh-num .no{font-size:36px}
  .sh-num .meta{grid-column:1 / -1;font-size:14px}
  .sh-split{grid-template-columns:minmax(0,1fr);gap:10px;padding-bottom:18px}
  .sh-split p:not(.lab){font-size:15px}
  .sh-mark{margin-bottom:24px}
  .sh-mark .meta{margin-left:0;flex-basis:100%;font-size:14px}
  .sub-h{margin:40px 0 12px}
  .sub-h h3{font-size:20px}
  .foot-note{flex-direction:column;gap:8px}
  .sh-split + .tbl,.sh-split + .matrix-wrap{margin-top:20px}
  /* 档案表 → 条目（仍无边框，只有细线） */
  .tbl.cases thead,.tbl.cases colgroup{display:none}
  .tbl.cases,.tbl.cases tbody,.tbl.cases tr,.tbl.cases td{display:block;width:auto}
  .tbl.cases tr{padding:16px 0;border-bottom:1px solid var(--rule)}
  .tbl.cases tbody tr:first-child{border-top:1px solid var(--ink)}
  .tbl.cases tbody tr:last-child,.tbl.cases tbody tr.is-last{border-bottom-color:var(--ink)}
  .tbl.cases td{padding:0;border:0!important;font-size:15px;line-height:1.75}
  .tbl.cases td.who{margin-bottom:2px}
  .tbl.cases td[data-l]{margin-top:6px}
  .tbl.cases td[data-l]::before{content:attr(data-l);display:inline-block;font-size:13.5px;color:var(--ink-3);margin-right:10px}
  .tbl.cases.brief td.how{display:none}
  .tbl.cases td.res a{display:inline;margin:0 0 0 8px;white-space:nowrap}
  .tbl.steps thead{display:none}
  .tbl.steps,.tbl.steps tbody{display:block}
  .tbl.steps tr{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--rule)}
  .tbl.steps tbody tr:first-child{border-top:1px solid var(--ink)}
  .tbl.steps tbody tr:last-child{border-bottom-color:var(--ink)}
  .tbl.steps td{display:block;padding:0;border:0!important;width:auto!important;font-size:15px;line-height:1.75}
  .tbl.steps td:first-child{display:none}
  .tbl.steps td:nth-child(2){font-size:16px}
  .tbl.steps td:nth-child(3){white-space:nowrap;font-size:14.5px}
  .tbl.steps td:nth-child(4){grid-column:1 / -1;margin-top:4px}
  /* 图版 */
  .feat,.feat.flip{grid-template-columns:minmax(0,1fr);gap:16px;padding:32px 0}
  .feat.flip .fig{order:0}
  .feat .txt h3{font-size:21px}
  .feat .txt p:not(.who):not(.go){display:none}
  .feat .txt .go{margin-top:14px}
  /* 拼版在手机上改成一条横滑的图带（外层自己滚，页面不横向溢出） */
  .mosaic{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;overscroll-behavior-x:contain}
  .mosaic > a{flex:0 0 64%;scroll-snap-align:start}
  .mosaic .all{flex:0 0 44%;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:6px;padding:12px 14px;font-size:14px;line-height:1.6}
  .mosaic .all p{display:none}
  .mosaic-hint{display:block}
  .mosaic .cap{font-size:13px;padding:3px 7px 3px 6px}
  .plates{gap:32px 20px}
  .fig-index{columns:1}
  .guide-line{font-size:15px;line-height:1.95}
  .guide li{grid-template-columns:minmax(0,1fr);gap:2px;padding:10px 0}
  /* 矩阵：首列吸附，收掉小字 */
  .matrix{min-width:620px}
  .matrix th.c0{width:118px;position:sticky;left:0;z-index:1;background:var(--paper)}
  .matrix th.c0 small,.matrix thead th small{display:none}
  .matrix th.c0 .no{width:24px}
  .matrix th,.matrix td{padding:8px 6px 8px 0}
  .matrix thead th b,.matrix th.c0 b{font-size:15px}
  .matrix td .n{font-size:17px;min-width:32px}
  .matrix td .dot{margin:11px 0 0 14px}
  .matrix .tot{width:52px;padding-left:10px}
  .matrix-hint{display:block}
  .forms-note{grid-template-columns:minmax(0,1fr)}
  .forms-note li{grid-template-columns:96px minmax(0,1fr);gap:12px;padding:12px 0}
  .forms-note li b small,.forms-note li .ref{display:none}
  .forms-note li p{font-size:14.5px;line-height:1.75}
  .ind-index{columns:1}
  /* 笔记 */
  .notes-grid{grid-template-columns:minmax(0,1fr);row-gap:32px}
  .note-lead h3{font-size:23px}
  .note-side .note-index p{display:none}
  .note-side .note-index li{padding:10px 0}
  .note-side .note-index h4{font-size:16px}
  .note-lead .lede{font-size:16px;margin-top:10px}
  .note-lead .go{margin-top:14px}
  .article p,.article ul,.article ol{font-size:16.5px}
  /* 条款 */
  .terms{margin-top:24px}
  .term{grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:6px;padding:16px 0;align-items:baseline}
  .term .k{font-size:16px}
  .term h3{font-size:18px}
  .term p{grid-column:1 / -1}
  .term p{font-size:15.5px}
  .annex{grid-template-columns:minmax(0,1fr);row-gap:12px;margin-top:32px}
  .a-steps .h small{display:none}
  .cover .claim .deck,.contact-grid .deck,.sh-split p:not(.lab),.sh-num .meta,.term p,.mode p,.note-lead .lede,.guide-line{line-height:1.8}
  .modes{grid-template-columns:minmax(0,1fr);gap:20px}
  /* 联系 */
  .contact-grid{grid-template-columns:minmax(0,1fr);row-gap:32px}
  .lines li{grid-template-columns:56px minmax(0,1fr);gap:10px;padding:12px 0}
  .lines li .big{font-size:26px}
  .contact-side .recent{margin-top:24px}
  .news-list li{grid-template-columns:64px minmax(0,1fr);gap:10px}
  .colophon{padding:28px 0 24px}
  .colophon .links{display:none}
  .colophon .top{padding-bottom:14px}
  .colophon .info-lines{grid-template-columns:minmax(0,1fr)}
  .colophon .info-lines li{padding:7px 0}
  .colophon .bot{flex-direction:column;gap:6px}
  /* 筛选条：每条一行、条内左右滑，栏名吸在左边（案例、体验中心、笔记三页同一种表现；页面本身不横向溢出） */
  .fstrip{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:none;padding:9px 0}
  .fstrip::-webkit-scrollbar{display:none}
  .fstrip .k{position:sticky;left:0;z-index:1;background:var(--paper);margin-right:0;padding-right:14px}
  .count-note{padding-left:8px;white-space:nowrap}
  .form .g2{grid-template-columns:1fr}
  /* 提示条抬到底部联系条（48px + 1px 线）上面 */
  .toast{top:calc(var(--nav-h) + 12px);bottom:auto;transform:translate(-50%,-12px)}   /* 手机上放顶部：不压住刚点的按钮、也不盖底部联系条 */
  .mbar{display:flex}
  .m-hide,.m-cut{display:none!important}
}
@media (max-width:420px){
  :root{--gut:20px}
  body{font-size:16px}
  .brand{font-size:20px}
  .brand .comet{width:28px}
  .nav .tel{font-size:14.5px}
  .cover .claim h1{font-size:25px}
  .sh-num h2,.sh-split h2{font-size:24px}
  .sh-mark h2{font-size:22px}
  .mnav li a{font-size:20px}
  .lines li .big{font-size:24px}
  .qr .box{flex-basis:120px;width:120px}
  .fstrip{gap:6px 16px}
  .fbtn{font-size:14.5px}
  .plates{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}
  .plate .d{display:none}
  .plate figcaption .nm{font-size:15px}
}
@media (max-width:360px){
  .mast-top .wrap > span:first-child{white-space:normal}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.burger span,.toast{transition:none}}
@media print{
  .mast-top,.nav,.mnav,.mbar,.wx-share{display:none!important}
  body{padding:0;background:#fff}
  .cover{overflow:visible}
  .bleed-r{width:100%}
}

/* ---------- 页脚「平台店铺」一行（{{SHOPS_ROW}}，tools/gen/shops.py） ---------- */
.colophon .f-shops{display:grid;grid-template-columns:56px minmax(0,1fr);gap:12px;margin:0;padding:9px 0;border-bottom:1px solid var(--rule);font-size:14.5px;line-height:1.7}
.colophon .f-shops .k{color:var(--ink-3);font-size:13.5px;padding-top:1px}
.colophon .f-shops a{border-bottom:1px solid var(--rule-2)}
@media (max-width:900px){.colophon .f-shops{padding:7px 0}}
@media (hover:hover){.colophon .f-shops a:hover{color:var(--red);border-color:var(--red)}}

/* ==== src/css/pages/404.css ==== */
/* ============================================================
   页面不存在（404.html）· 页内样式，选择器一律以 .pg-404 开头
   首屏：「这一页不在目录里。」+ 请求的地址 + 电话 | 全站目录（.toc 放大一号）
   图版目录：图号索引（左）+ 图 01 出血到右缘（右）
   笔记目录：篇目（左，篇号 · 标题 · 点线 · 日期）+ 按主题（右）
   ============================================================ */

/* ---------- 首屏 ---------- */
.pg-404 .p4-head{padding:44px 0 64px}
.pg-404 .p4-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);grid-template-areas:"claim toc" "call toc";column-gap:96px;align-items:start}
.pg-404 .p4-claim{grid-area:claim}
.pg-404 .p4-claim .lab{margin-bottom:14px}
.pg-404 .p4-req{margin-top:14px;font-size:14.5px;line-height:1.8;color:var(--ink-3);overflow-wrap:anywhere}
.pg-404 .p4-req code{font-family:var(--sans);font-size:14.5px;color:var(--ink);background:var(--paper-2);padding:2px 8px;margin-left:10px}
.pg-404 .p4-claim .deck{margin-top:18px;max-width:34em;font-size:16.5px;line-height:1.95;color:var(--ink-2)}

/* 全站目录：比首页的「本页目录」大一号，表尾补墨线 */
.pg-404 .p4-toc{grid-area:toc}
.pg-404 .p4-toc .lab{margin-bottom:14px}
.pg-404 .p4-toc li a{padding:13px 0;gap:14px}
.pg-404 .p4-toc li .no{font-size:14px}
.pg-404 .p4-toc li .t{font-size:19px}
.pg-404 .p4-toc li .d{font-size:14px}
.pg-404 .p4-toc li:last-child a{border-bottom-color:var(--ink)}

/* 电话 */
.pg-404 .p4-call{grid-area:call;margin-top:40px}
.pg-404 .p4-call-h{font-family:var(--serif);font-weight:700;font-size:18px;line-height:1.6}
.pg-404 .p4-call .lines{margin-top:12px}

/* ---------- 图版目录 ---------- */
.pg-404 .p4-figs{padding-top:56px}
.pg-404 .p4-plates{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:56px;align-items:start;margin-top:28px}
.pg-404 .p4-plates .fig-index{grid-column:1;grid-row:1;columns:1}
.pg-404 .p4-plates .fig-index li:last-child{border-bottom-color:var(--ink)}
.pg-404 .p4-plates .fig{grid-column:2;grid-row:1}
.pg-404 .p4-figs .foot-note{margin-top:28px}

/* ---------- 笔记目录 ---------- */
.pg-404 .p4-notes-grid{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);column-gap:72px;align-items:start}
.pg-404 .p4-notes{border-top:1px solid var(--ink)}
.pg-404 .p4-notes li a{display:flex;align-items:baseline;gap:16px;padding:13px 0;border-bottom:1px solid var(--rule)}
.pg-404 .p4-notes li:last-child a{border-bottom-color:var(--ink)}
.pg-404 .p4-notes .no{flex:0 0 auto;min-width:52px;font-size:13.5px;color:var(--red);white-space:nowrap}
.pg-404 .p4-notes .t{min-width:0;font-family:var(--serif);font-weight:700;font-size:18px;line-height:1.55;text-wrap:balance;word-break:keep-all;overflow-wrap:anywhere}
.pg-404 .p4-notes .dots{flex:1;min-width:24px;border-bottom:1px dotted var(--rule-2);position:relative;top:-6px}
.pg-404 .p4-notes time{font-size:13.5px;color:var(--ink-3);white-space:nowrap}
@media (hover:hover){.pg-404 .p4-notes li a:hover .t{color:var(--red)}}
/* 两栏各有一个小栏名（按时间 / 按主题），两条表头墨线对齐 */
.pg-404 .p4-notes-grid .lab{margin-bottom:8px}
.pg-404 .p4-notes-grid .lab .muted{font-family:var(--sans);font-weight:500;font-size:13.5px}
/* 按主题：标签 + 篇数，链到笔记页的主题筛选（?tag=） */
.pg-404 .p4-tags{border-top:1px solid var(--ink)}
.pg-404 .p4-tags li a{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.6}
.pg-404 .p4-tags li a span{font-size:13.5px;color:var(--ink-3);white-space:nowrap}
@media (hover:hover){.pg-404 .p4-tags li a:hover{color:var(--red)}}
.pg-404 .p4-tags li:last-child a{border-bottom-color:var(--ink)}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .pg-404 .p4-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px}
  .pg-404 .p4-plates{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
  /* 平板上篇目占满一栏（长标题不折行），按主题排到下面分三栏 */
  .pg-404 .p4-notes-grid{grid-template-columns:minmax(0,1fr);row-gap:40px}
  .pg-404 .p4-tags{columns:3;column-gap:40px}
  .pg-404 .p4-tags li{break-inside:avoid}
  .pg-404 .p4-tags li:last-child a{border-bottom-color:var(--rule)}
}
@media (max-width:900px){
  .pg-404 .p4-head{padding:28px 0 40px}
  .pg-404 .p4-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"claim" "toc" "call";row-gap:32px}
  .pg-404 .p4-claim .deck{margin-top:14px;font-size:16px;line-height:1.8}
  /* 目录在手机上仍排一栏，保留每栏那句说明（这张目录就是 404 页的正文） */
  .pg-404 .p4-toc ol{display:block}
  .pg-404 .p4-toc .lab{margin-bottom:8px}
  .pg-404 .p4-toc li a{padding:10px 0;gap:10px}
  .pg-404 .p4-toc li .t{font-size:17px}
  .pg-404 .p4-toc li .d{display:block;margin-left:auto;min-width:0;white-space:normal;text-align:right;font-size:13.5px}
  .pg-404 .p4-call{margin-top:0}
  .pg-404 .p4-call-h{font-size:17px}
  .pg-404 .p4-figs{padding-top:36px}
  .pg-404 .p4-plates{grid-template-columns:minmax(0,1fr);row-gap:24px;margin-top:24px}
  .pg-404 .p4-plates .fig{grid-column:1;grid-row:1}
  .pg-404 .p4-plates .fig-index{grid-column:1;grid-row:2}
  .pg-404 .p4-figs .foot-note{margin-top:18px}
  .pg-404 .p4-notes-grid{grid-template-columns:minmax(0,1fr)}
  .pg-404 .p4-notes li a{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;row-gap:2px;padding:12px 0}
  .pg-404 .p4-notes .dots{display:none}
  .pg-404 .p4-notes .no{grid-column:1;grid-row:1}
  .pg-404 .p4-notes time{grid-column:2;grid-row:1}
  .pg-404 .p4-notes .t{grid-column:1 / -1;grid-row:2;font-size:16.5px}
}
@media (max-width:420px){
  .pg-404 .p4-toc li .t{font-size:16.5px}
  /* 小屏上图号索引只留「图号 + 系统名」，免得长名字被右边的「行业 · 形态」挤得单字折行 */
  .pg-404 .p4-plates .fig-index li span:last-child{display:none}
}

/* 出血只有首页一处：404 的图 01 停在版心右缘 */
.pg-404 .p4-plates .bleed-r{width:100%}
.pg-404 .p4-plates .bleed-r figcaption{max-width:none}

/* ==== src/css/pages/about.css ==== */
/* ============================================================
   关于慧星（about.html）· 页内样式，选择器一律以 .pg-about 开头
   首屏：主张 + 工商信息细线表（左）/ 截图（停在版心右缘，图号由 about.py 算）+ 本页目录（右）
   01 工程铁律：条款体（条号 / 条文与说明 / 照这条做的演示）；条文由 about.py 过 seg()，只在逗号后换行
   02 能力与交付：两张细线表 + 「每次交付都附上」一行
   03 近况：{{NEWS_LIST}} 排成按月归组的年表 + 右栏说明
   ============================================================ */

/* ---------- 首屏 ---------- */
.pg-about .ab-cover{padding:40px 0 72px;overflow:hidden}
.pg-about .ab-cover > .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:56px;align-items:stretch}
.pg-about .ab-l,.pg-about .ab-r{display:flex;flex-direction:column;min-width:0}
.pg-about .ab-claim .lab{margin-bottom:12px}
.pg-about .ab-claim h1{font-size:clamp(28px,3vw,42px);line-height:1.42;font-weight:900}
.pg-about .ab-claim .deck{margin-top:22px;font-size:16.5px;line-height:1.95;color:var(--ink-2)}
.pg-about .ab-claim .deck + .deck{margin-top:10px}
.pg-about .ab-facts{margin-top:22px;padding-top:12px;border-top:1px solid var(--rule);font-size:16px;line-height:1.85;color:var(--ink)}
.pg-about .ab-facts .k{display:block;font-size:13.5px;line-height:1.6;color:var(--ink-3)}

/* 工商信息：细线信息表（首行墨线、表尾墨线） */
.pg-about .ab-co{margin-top:44px}
.pg-about .ab-co .hd{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:8px}
.pg-about .ab-co .info th{width:1%;padding-right:28px;padding-top:13px;white-space:nowrap}
.pg-about .ab-co .info td{color:var(--ink)}
@media (hover:hover){.pg-about .ab-co .info td a:hover{color:var(--red)}}
.pg-about .ab-co .info tr:last-child > *{border-bottom-color:var(--ink)}
.pg-about .ab-co .info .copy{margin-left:10px}
.pg-about .ab-co .note{margin-top:12px;font-size:14px;line-height:1.85;color:var(--ink-3)}

/* 右栏：图 + 本页目录 */
.pg-about .ab-fig{margin-top:6px}
.pg-about .ab-r .toc{margin-top:48px}

/* ---------- 01 工程铁律：条款体 ---------- */
.pg-about .ab-rules{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.pg-about .ab-rules > li{display:grid;grid-template-columns:110px minmax(0,1fr) minmax(0,340px);column-gap:48px;padding:28px 0}
.pg-about .ab-rules > li + li{border-top:1px solid var(--rule)}
.pg-about .ab-rules .k{font-family:var(--serif);font-size:21px;font-weight:900;line-height:1.5;color:var(--red);white-space:nowrap}
.pg-about .ab-rules .b h3{font-size:22px;font-weight:700;line-height:1.5}
.pg-about .ab-rules .b p{margin-top:10px;max-width:640px;font-size:16px;line-height:1.9;color:var(--ink-2)}
.pg-about .ab-rules .ref{padding-top:4px}
.pg-about .ab-rules .ref .h{font-size:13.5px;line-height:1.6;color:var(--ink-3)}
.pg-about .ab-rules .ref li{padding:7px 0 0}
.pg-about .ab-rules .ref li + li{margin-top:6px;border-top:1px dotted var(--rule-2)}
.pg-about .ab-rules .ref a{display:block;font-family:var(--serif);font-weight:700;font-size:16px;line-height:1.55;color:var(--ink)}
.pg-about .ab-rules .ref a b{font-weight:700;color:var(--red);margin-right:10px}
@media (hover:hover){.pg-about .ab-rules .ref a:hover{color:var(--red)}}
.pg-about .ab-rules .ref span{display:block;margin-top:2px;font-size:14px;line-height:1.7;color:var(--ink-2);text-wrap:pretty}

/* ---------- 02 能力与交付 ---------- */
.pg-about .ab-two{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px;margin-top:36px}
.pg-about .ab-col h3{font-size:22px;font-weight:700;margin-bottom:12px}
.pg-about .ab-tbl{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.pg-about .ab-tbl th,.pg-about .ab-tbl td{padding:14px 0;text-align:left;vertical-align:baseline;line-height:1.75}
.pg-about .ab-tbl tr + tr > *{border-top:1px solid var(--rule)}
.pg-about .ab-tbl th{width:150px;padding-right:20px;font-family:var(--serif);font-size:16.5px;font-weight:700;color:var(--ink);white-space:nowrap}
.pg-about .ab-tbl td{font-size:15px;color:var(--ink-2);text-wrap:pretty}
.pg-about .ab-deliv th{width:196px}
.pg-about .ab-deliv th .no{display:inline-block;width:32px;font-family:var(--sans);font-size:13.5px;font-weight:500;color:var(--red)}
.pg-about .ab-kit{display:grid;grid-template-columns:auto auto minmax(0,1fr);align-items:baseline;column-gap:40px;margin-top:48px;padding:16px 0;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule)}
.pg-about .ab-kit .k{font-family:var(--serif);font-weight:700;font-size:17px;white-space:nowrap}
.pg-about .ab-kit ul{display:flex;flex-wrap:wrap;gap:4px 0;font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.6}
.pg-about .ab-kit li{white-space:nowrap}
.pg-about .ab-kit li + li::before{content:"·";margin:0 12px;color:var(--ink-3);font-family:var(--sans);font-weight:500}
.pg-about .ab-kit .t{font-size:15px;line-height:1.8;color:var(--ink-2);text-align:right}

/* ---------- 03 近况：年表（同月只在第一条标月份，JS 加 .grouped / .head / .same） ---------- */
.pg-about .ab-news{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);column-gap:72px;align-items:start}
.pg-about .ab-news .news-list{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.pg-about .ab-news .news-list li{grid-template-columns:120px minmax(0,1fr);gap:24px;padding:18px 0}
.pg-about .ab-news .news-list li:last-child{border-bottom:0}
.pg-about .ab-news .news-list li .d{padding-top:0;font-family:var(--serif);font-weight:700;font-size:19px;line-height:1.45;white-space:nowrap}
.pg-about .ab-news .news-list li > div{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:24px;align-items:baseline}
.pg-about .ab-news .news-list li b{grid-column:1;font-size:17.5px;line-height:1.55}
.pg-about .ab-news .news-list li small{grid-column:2;grid-row:1;margin-top:0;white-space:nowrap}
.pg-about .ab-news .news-list li p{grid-column:1 / -1;max-width:640px;margin-top:6px;font-size:15px;line-height:1.8}
/* 归组以后：月与月之间整行细线，同月条目只在右侧内容栏画线 */
.pg-about .ab-news .news-list.grouped li{padding:0;border-bottom:0}
.pg-about .ab-news .news-list.grouped li > *{padding-top:18px;padding-bottom:18px}
.pg-about .ab-news .news-list.grouped li.head + li.head,
.pg-about .ab-news .news-list.grouped li.same + li.head{border-top:1px solid var(--rule)}
.pg-about .ab-news .news-list.grouped li.same > div{border-top:1px dotted var(--rule-2)}
.pg-about .ab-news .news-list.grouped li.same .d{visibility:hidden}
.pg-about .ab-side .blk + .blk{margin-top:32px;padding-top:20px;border-top:1px solid var(--rule)}
.pg-about .ab-side .lab{margin-bottom:6px}
.pg-about .ab-side p:not(.lab):not(.go){font-size:15px;line-height:1.85;color:var(--ink-2)}
.pg-about .ab-side .tel{color:var(--ink);font-weight:700;white-space:nowrap}
@media (hover:hover){.pg-about .ab-side .tel:hover{color:var(--red)}}
.pg-about .ab-side .go{margin-top:12px;font-size:15.5px}
.pg-about .ab-side .go + .go{margin-top:8px}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .pg-about .ab-cover > .wrap{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
  .pg-about .ab-rules > li{grid-template-columns:84px minmax(0,1fr) minmax(0,260px);column-gap:28px}
  .pg-about .ab-rules .k{font-size:19px}
  .pg-about .ab-rules .b h3{font-size:20px}
  .pg-about .ab-two{column-gap:40px}
  .pg-about .ab-tbl th{width:124px}
  .pg-about .ab-deliv th{width:170px}
  .pg-about .ab-kit{grid-template-columns:auto minmax(0,1fr);row-gap:6px}
  .pg-about .ab-kit .t{grid-column:1 / -1;text-align:left}
  .pg-about .ab-news{column-gap:40px}
  .pg-about .ab-news .news-list li{grid-template-columns:96px minmax(0,1fr);gap:16px}
  .pg-about .ab-news .news-list li > div{grid-template-columns:minmax(0,1fr)}
  .pg-about .ab-news .news-list li small{grid-column:1;grid-row:auto;margin-top:4px;white-space:normal}
}
@media (max-width:900px){
  .pg-about .ab-cover{padding:24px 0 40px}
  .pg-about .ab-cover > .wrap{grid-template-columns:minmax(0,1fr);row-gap:28px}
  /* 手机：主张 → 截图 → 工商信息 → 目录 */
  .pg-about .ab-l,.pg-about .ab-r{display:contents}
  .pg-about .ab-claim{order:1}
  .pg-about .ab-fig{order:2;margin-top:0}
  .pg-about .ab-co{order:3;margin-top:4px}
  .pg-about .ab-r .toc{order:4;margin-top:0;padding-top:0}
  .pg-about .ab-claim h1{font-size:28px}
  .pg-about .ab-claim .deck{margin-top:14px;font-size:16px;line-height:1.8}
  .pg-about .ab-facts{margin-top:16px;padding-top:10px;font-size:15px}
  .pg-about .ab-co .info th{padding-right:14px;font-size:13.5px;line-height:1.6}
  .pg-about .ab-co .info td{padding-right:0;font-size:15px}
  .pg-about .ab-co .note{font-size:14px;line-height:1.8}
  /* 条款：条号一行、条文一行、说明、演示 */
  .pg-about .ab-rules > li{display:block;padding:18px 0}
  .pg-about .ab-rules .k{font-size:16px;line-height:1.5}
  .pg-about .ab-rules .b h3{margin-top:2px;font-size:18.5px}
  .pg-about .ab-rules .b p{margin-top:6px;font-size:15.5px;line-height:1.8}
  .pg-about .ab-rules .ref{margin-top:10px;padding-top:0}
  .pg-about .ab-rules .ref .h{display:none}
  .pg-about .ab-rules .ref li{padding:0}
  .pg-about .ab-rules .ref li + li{margin-top:4px;padding-top:4px}
  .pg-about .ab-rules .ref a{font-size:15px}
  .pg-about .ab-rules .ref span{font-size:14px}
  /* 两张表上下排 */
  .pg-about .ab-two{grid-template-columns:minmax(0,1fr);row-gap:32px;margin-top:24px}
  .pg-about .ab-col h3{font-size:20px;margin-bottom:8px}
  .pg-about .ab-tbl th,.pg-about .ab-tbl td{padding:11px 0}
  .pg-about .ab-tbl th{width:1%;padding-right:20px;font-size:15.5px}
  .pg-about .ab-deliv th{width:1%}
  .pg-about .ab-deliv th .no{width:26px}
  .pg-about .ab-tbl td{font-size:14.5px}
  .pg-about .ab-kit{grid-template-columns:minmax(0,1fr);margin-top:32px;padding:14px 0}
  .pg-about .ab-kit .k{font-size:16px}
  .pg-about .ab-kit ul{font-size:16px}
  .pg-about .ab-kit ul{gap:2px 20px}
  .pg-about .ab-kit li + li::before{content:none}
  .pg-about .ab-kit .t{font-size:14.5px}
  /* 年表 */
  .pg-about .ab-news{grid-template-columns:minmax(0,1fr);row-gap:32px}
  .pg-about .ab-news .news-list li{grid-template-columns:72px minmax(0,1fr);gap:10px}
  .pg-about .ab-news .news-list li .d{font-size:15px;line-height:1.7}
  .pg-about .ab-news .news-list li b{font-size:16px}
  .pg-about .ab-news .news-list li p{font-size:14.5px;line-height:1.75}
  .pg-about .ab-news .news-list.grouped li > *{padding-top:14px;padding-bottom:14px}
  .pg-about .ab-side .blk + .blk{margin-top:24px;padding-top:16px}
}
@media (max-width:420px){
  .pg-about .ab-claim h1{font-size:25px}
  /* 两张表：名目一行、说明一行 */
  .pg-about .ab-tbl,.pg-about .ab-tbl tbody{display:block}
  .pg-about .ab-tbl tr{display:block;padding:10px 0}
  .pg-about .ab-tbl tr + tr{border-top:1px solid var(--rule)}
  .pg-about .ab-tbl th,.pg-about .ab-tbl td{display:block;width:auto;padding:0;border:0!important}
  .pg-about .ab-tbl td{margin-top:2px}
  .pg-about .ab-deliv td{padding-left:26px}
}

/* ==== src/css/pages/cases.css ==== */
/* ============================================================
   交付案例（cases.html）· 页内样式，选择器一律以 .pg-cases 开头
   首屏：左 7 栏（栏名 + 一句话 + 说明 + 按身份先看一行）/ 右 5 栏图 NN + 图注，照首页封面的格子排（不出血）
   全部档案：小标题一行 + 筛选条 + 按行业分组的四栏档案表
             组头 = 行业编号 · 行业 · 做过的事 · 条数，组头下墨线；整张表最后一行墨线（.cs-tail 由 JS 标）
             桌面表头吸在导航下；≤900 变条目，手机先列 10 条（.cs-fold / .cs-pager 由 cases.js 控制）
   末节：表里没有你那一行（流星节头 + 两段话 + 电话微信）
   ============================================================ */

/* ---------- 首屏 ---------- */
.pg-cases .cs-head{padding:40px 0 48px}
.pg-cases .cs-head > .wrap{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);grid-template-rows:auto 1fr;column-gap:56px;row-gap:32px;align-items:start}
.pg-cases .cs-intro{grid-column:1;grid-row:1}
.pg-cases .cs-intro .lab{margin-bottom:12px}
.pg-cases .cs-intro h1{font-size:clamp(28px,3vw,42px);line-height:1.42;font-weight:900}
.pg-cases .cs-intro .deck{margin-top:20px;max-width:640px;font-size:16.5px;line-height:1.95;color:var(--ink-2)}
.pg-cases .cs-head .fig{grid-column:2;grid-row:1 / span 2;margin-top:8px}
.pg-cases .cs-head .fig .nt{display:block;margin-top:8px;padding-top:8px;border-top:1px solid var(--rule);font-size:13.5px;line-height:1.75;color:var(--ink-3)}

/* 按身份先看：一行指引（公共 .guide-line），行业名直接筛下面的表 */
.pg-cases .cs-who{grid-column:1;grid-row:2;margin-top:0;max-width:640px}
.pg-cases .cs-head .fig .nt .lnk{display:table;margin-top:4px;color:var(--ink);white-space:nowrap}

/* ---------- 全部档案 ---------- */
.pg-cases .cs-list{padding-top:8px}
.pg-cases .cs-bar{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 20px;margin-bottom:14px}
.pg-cases .cs-bar h2{font-size:24px;font-weight:900}
.pg-cases .cs-bar .meta{font-size:14px}
.pg-cases .cs-clear{margin-left:auto;background:none;border:0;border-bottom:1px solid var(--red);border-radius:0;padding:0 0 1px;font-size:14.5px;color:var(--red);cursor:pointer;white-space:nowrap}
.pg-cases .tbl.cases{margin-top:28px}
/* 表头吸在导航下面：五十多行往下翻也知道哪栏是哪栏 */
.pg-cases .tbl.cases thead th{position:sticky;top:calc(var(--nav-h) + 1px);z-index:3;background:var(--paper);padding-top:10px}
.pg-cases .tbl.cases tr[id]{scroll-margin-top:48px}
/* 组头：行业编号 + 行业 + 做过的事 + 条数，下面一条墨线 */
.pg-cases .tbl.cases tr.cs-g th{padding:44px 0 10px;border-bottom:1px solid var(--ink);white-space:normal;vertical-align:bottom;font-size:inherit;color:var(--ink)}
.pg-cases .tbl.cases tbody.cs-first tr.cs-g th{padding-top:18px}
.pg-cases .cs-gh{display:flex;align-items:baseline;gap:4px 16px}
.pg-cases .cs-gh .no{flex:0 0 auto;font-size:13.5px;line-height:1.5;color:var(--red)}
.pg-cases .cs-gh b{flex:0 0 auto;font-family:var(--serif);font-size:20px;font-weight:700;line-height:1.4}
.pg-cases .cs-gh .ln{min-width:0;font-size:14px;line-height:1.6;color:var(--ink-3)}
.pg-cases .cs-gh .n{flex:0 0 auto;margin-left:auto;font-size:13.5px;line-height:1.5;color:var(--ink-3);white-space:nowrap}
/* 组内最后一行只画细线；整张表最后一行画墨线（无 JS 时取最后一组的最后一行） */
.pg-cases .tbl.cases tbody tr:last-child td{border-bottom-color:var(--rule)}
.pg-cases .tbl.cases tbody:last-child tr:last-child td,
.pg-cases .tbl.cases tbody tr.cs-tail td{border-bottom-color:var(--ink)}
.pg-cases .tbl.cases .cs-fold{display:none}

/* 手机端分批列出（桌面不出现） */
.pg-cases .cs-pager{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 28px;padding:14px 0 2px}
.pg-cases .cs-pager .t{flex:0 0 100%;font-size:14.5px;line-height:1.7;color:var(--ink-3)}
.pg-cases .cs-pager button{background:none;border:0;border-bottom:1px solid var(--rule-2);border-radius:0;padding:10px 0 2px;font-size:16px;line-height:1.5;color:var(--ink);cursor:pointer}
.pg-cases .cs-pager button.more{color:var(--red);border-color:var(--red)}
.pg-cases .cs-list .foot-note{margin-top:26px}

/* ---------- 末节：表里没有你那一行 ---------- */
.pg-cases .cs-more{max-width:780px}
.pg-cases .cs-more-t p{max-width:640px;font-size:16.5px;line-height:1.95;color:var(--ink-2)}
.pg-cases .cs-more-t p + p{margin-top:14px}
.pg-cases .cs-more-t p .lnk{color:var(--ink)}
.pg-cases .cs-more-t .go{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:15.5px}

/* 悬停只给有鼠标的设备（照 00-base.css 末尾的写法），触屏点完不粘色 */
@media (hover:hover){
  .pg-cases .cs-clear:hover{color:var(--ink);border-color:var(--ink)}
  .pg-cases .cs-pager button:hover{color:var(--red);border-color:var(--red)}
}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .pg-cases .cs-head > .wrap{column-gap:40px}
  .pg-cases .cs-gh .ln{display:none}
}
@media (max-width:900px){
  .pg-cases .cs-head{padding:24px 0 36px}
  .pg-cases .cs-head > .wrap{grid-template-columns:minmax(0,1fr);grid-template-rows:none;row-gap:24px}
  .pg-cases .cs-intro,.pg-cases .cs-head .fig,.pg-cases .cs-who{grid-column:1;grid-row:auto}
  .pg-cases .cs-head .fig{margin-top:0}
  .pg-cases .cs-intro h1{font-size:28px}
  .pg-cases .cs-intro .deck{margin-top:14px;font-size:16px;line-height:1.8}
  .pg-cases .cs-list{padding-top:4px}
  .pg-cases .cs-bar{margin-bottom:10px}
  .pg-cases .cs-bar h2{font-size:22px}
  .pg-cases .tbl.cases{margin-top:16px}
  /* 条目：组头是「编号 行业 …… N 条」+ 墨线；组内细线；整表最后一条墨线 */
  .pg-cases .tbl.cases tbody tr:first-child{border-top:0}
  .pg-cases .tbl.cases tr.cs-g{padding:28px 0 8px;border-bottom:1px solid var(--ink)}
  .pg-cases .tbl.cases tbody.cs-first tr.cs-g{padding-top:6px}
  .pg-cases .tbl.cases tr.cs-g th{display:block;padding:0;border:0}
  .pg-cases .cs-gh b{font-size:18px}
  .pg-cases .tbl.cases tbody tr:last-child{border-bottom-color:var(--rule)}
  .pg-cases .tbl.cases tbody:last-child tr:last-child,
  .pg-cases .tbl.cases tbody tr.cs-tail{border-bottom-color:var(--ink)}
  .pg-cases .cs-more-t p{font-size:16px;line-height:1.8}
  .pg-cases .cs-more-t .go{margin-top:16px}
}
@media (max-width:420px){
  /* 390 起步正好 25px；更窄的安卓机（360）跟着收，「每一条都是真做过的项目。」十二个字仍排一行，不甩出末尾两字 */
  .pg-cases .cs-intro h1{font-size:min(25px,6.6vw)}
}

/* ==== src/css/pages/contact.css ==== */
/* ============================================================
   联系我们（contact.html）· 页内样式，选择器一律以 .pg-contact 开头
   首屏：桌面两行两栏 —— 一句话 | 微信二维码（#ways）；联系方式细线表 | 本页目录（两边都有栏名，顶线对齐）
         手机：一句话 → 二维码（图字并排）→ 联系方式 → 目录
   01 需求自述：填表说明（左上）+ 编号细线登记表（右）+ 发过来以后（左下）；手机按 说明 → 表 → 以后 排
   02 合作条款：{{TERMS}}
   03 常见问题：两栏编号 details
   ============================================================ */

/* ---------- 首屏 ---------- */
.pg-contact .c-head{padding:44px 0 80px}
.pg-contact .c-head > .wrap{display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);grid-template-areas:"intro qr" "ways toc";column-gap:80px;row-gap:44px;align-items:start}
.pg-contact .c-intro{grid-area:intro}
.pg-contact .c-qr{grid-area:qr}
.pg-contact .c-ways-w{grid-area:ways}
.pg-contact .c-toc{grid-area:toc}
.pg-contact .c-intro .lab{margin-bottom:12px}
.pg-contact .c-intro h1{font-size:clamp(28px,3vw,42px);line-height:1.42;font-weight:900}
.pg-contact .c-intro .deck{margin-top:22px;max-width:700px;font-size:16.5px;line-height:1.95;color:var(--ink-2)}
.pg-contact .c-intro .deck + .deck{margin-top:10px}

/* 微信二维码：桌面图在上、字在下；手机图字并排 */
.pg-contact .c-qr{flex-direction:column;gap:14px;padding-top:6px}
.pg-contact .c-qr .box{flex:none;width:196px;padding:10px}
.pg-contact .c-qr p{font-size:14.5px;line-height:1.85}
.pg-contact .c-qr .c-wx{margin-top:6px}
.pg-contact .c-qr .c-wx .copy{margin-left:8px;white-space:nowrap}

/* 联系方式：三栏细线表（项 / 内容 / 说明），上面一行栏名与右栏「本页目录」对齐 */
.pg-contact .c-ways-w > .lab,.pg-contact .c-toc .lab{margin-bottom:8px}
.pg-contact .c-ways{border-top:1px solid var(--ink);border-bottom:1px solid var(--ink)}
.pg-contact .c-ways th,.pg-contact .c-ways td{padding:16px 24px 16px 0;text-align:left;vertical-align:baseline;line-height:1.7}
.pg-contact .c-ways tr + tr > *{border-top:1px solid var(--rule)}
.pg-contact .c-ways th{width:76px;font-weight:500;font-size:14px;color:var(--ink-3);white-space:nowrap}
.pg-contact .c-ways td.v{font-size:16.5px;color:var(--ink)}
.pg-contact .c-ways td.n{width:36%;padding-right:0;font-size:14.5px;color:var(--ink-3)}
.pg-contact .c-ways .big{font-size:34px;line-height:1.15;font-weight:700;white-space:nowrap}
@media (hover:hover){.pg-contact .c-ways .big:hover{color:var(--red)}}

/* ---------- 01 需求自述 ---------- */
.pg-contact .c-need{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);grid-template-areas:"how sheet" "after sheet";grid-template-rows:auto 1fr;column-gap:80px;row-gap:36px;align-items:start}
.pg-contact .c-how{grid-area:how}
.pg-contact .c-sheet{grid-area:sheet}
.pg-contact .c-after{grid-area:after}
.pg-contact .c-how > .lab,.pg-contact .c-sheet > .lab{margin-bottom:10px}
.pg-contact .c-lab-n{margin-left:14px;font-family:var(--sans);font-weight:500;font-size:13.5px;color:var(--ink-3)}

/* 登记表：每栏一条细线当书写线，栏号朱砂 */
.pg-contact .c-form{gap:0;counter-reset:fld;border-top:1px solid var(--ink)}
.pg-contact .c-form .g2{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 40px}
.pg-contact .c-form .field{padding:16px 0 10px;border-bottom:1px solid var(--rule);transition:border-color .15s}
.pg-contact .c-form .field:focus-within{border-bottom-color:var(--ink)}
.pg-contact .c-form .field.has-err{border-bottom-color:var(--red)}
.pg-contact .c-form .field label{display:flex;align-items:baseline;gap:10px;margin:0;font-size:15px;line-height:1.6;color:var(--ink)}
.pg-contact .c-form .field label::before{counter-increment:fld;content:counter(fld,decimal-leading-zero);flex:0 0 22px;font-size:13.5px;color:var(--red)}
.pg-contact .c-form .req{font-style:normal;color:var(--ink-3);margin-left:-6px}
.pg-contact .c-form input,.pg-contact .c-form select,.pg-contact .c-form textarea{border-bottom:0;padding:6px 0 4px 32px;font-size:16px;line-height:1.7}
.pg-contact .c-form textarea{display:block;min-height:120px}
.pg-contact .c-form ::placeholder{color:var(--ink-3);opacity:.8}
.pg-contact .c-form select{-webkit-appearance:none;appearance:none;cursor:pointer;padding-right:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%236B675F' stroke-width='1.3'/%3E%3C/svg%3E") no-repeat right 2px center}
.pg-contact .c-form .err{padding-left:32px}
.pg-contact .c-form .act{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding-top:24px}
.pg-contact .c-form .act .hint{margin:0;font-size:14px;line-height:1.7}
.pg-contact .c-out{margin-top:32px;padding-top:18px;border-top:1px solid var(--ink)}
.pg-contact .c-out-h{margin-bottom:12px;font-family:var(--serif);font-weight:700;font-size:17px}
.pg-contact .c-out .act{padding-top:16px}

/* 填表说明 */
.pg-contact .c-tips{border-top:1px solid var(--ink)}
.pg-contact .c-tips li{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;padding:13px 0;border-bottom:1px solid var(--rule);font-size:15px;line-height:1.8;color:var(--ink-2)}
.pg-contact .c-tips .no{font-family:var(--serif);font-weight:700;font-size:15px;color:var(--red)}
.pg-contact .c-tips b{display:block;margin-bottom:2px;font-family:var(--serif);font-weight:700;font-size:16.5px;line-height:1.6;color:var(--ink)}

/* 发过来以后 + 同类演示指引 */
.pg-contact .c-after-h{font-size:15px;line-height:1.85;color:var(--ink-2)}
.pg-contact .c-after-h b{display:block;margin-bottom:4px;font-family:var(--serif);font-weight:700;font-size:16.5px;color:var(--ink)}
.pg-contact .c-demo{margin-top:24px;padding-top:16px;border-top:1px solid var(--rule);font-size:15px;line-height:1.85;color:var(--ink-2)}
.pg-contact .c-after .guide-line{margin-top:6px;padding-top:0;border-top:0;font-size:15px}

/* ---------- 03 常见问题：两栏，各自展开互不牵连 ---------- */
.pg-contact .c-faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px;align-items:start;margin-top:36px}
.pg-contact .c-faq summary{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:0 6px;align-items:baseline;line-height:1.6}
.pg-contact .c-faq summary .no{font-family:var(--sans);font-weight:500;font-size:13.5px;color:var(--red)}
@media (hover:hover){.pg-contact .c-faq summary:hover{color:var(--red)}}
.pg-contact .c-faq .a{padding-left:40px}
.pg-contact .c-faq .a .lnk{white-space:nowrap}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .pg-contact .c-head > .wrap,.pg-contact .c-need{column-gap:48px}
  .pg-contact .c-faq{column-gap:40px}
  .pg-contact .c-qr .box{width:172px}
  /* 联系方式表：说明栏折到内容下面（td.n 的 36% 宽度一并清掉，否则会被挤成窄条） */
  .pg-contact .c-ways,.pg-contact .c-ways tbody{display:block}
  .pg-contact .c-ways tr{display:grid;grid-template-columns:64px minmax(0,1fr);column-gap:12px;align-items:baseline;padding:14px 0}
  .pg-contact .c-ways tr + tr{border-top:1px solid var(--rule)}
  .pg-contact .c-ways th,.pg-contact .c-ways td,.pg-contact .c-ways td.n{display:block;width:auto;padding:0;border:0!important}
  .pg-contact .c-ways td.v,.pg-contact .c-ways td.n{grid-column:2}
  .pg-contact .c-ways td.n{margin-top:2px}
}
@media (max-width:900px){
  .pg-contact .c-head{padding:24px 0 40px}
  .pg-contact .c-head > .wrap{grid-template-columns:minmax(0,1fr);grid-template-areas:"intro" "qr" "ways" "toc";row-gap:26px}
  .pg-contact .c-intro h1{font-size:28px}
  .pg-contact .c-intro .deck{margin-top:14px;font-size:16px;line-height:1.8}
  .pg-contact .c-qr{flex-direction:row;align-items:center;gap:18px;padding-top:0}
  .pg-contact .c-qr .box{width:128px;padding:7px}
  .pg-contact .c-qr p{line-height:1.8}
  .pg-contact .c-qr .c-wx{margin-top:4px}
  .pg-contact .c-qr .c-wx .copy{display:table;margin:6px 0 0}
  .pg-contact .c-ways tr{grid-template-columns:52px minmax(0,1fr);column-gap:10px;padding:12px 0}
  .pg-contact .c-ways th{font-size:13.5px}
  .pg-contact .c-ways td.v{font-size:16px}
  .pg-contact .c-ways td.n{font-size:14px}
  .pg-contact .c-ways .big{font-size:26px}
  .pg-contact .c-need{grid-template-columns:minmax(0,1fr);grid-template-areas:"how" "sheet" "after";grid-template-rows:auto;row-gap:32px}
  .pg-contact .c-tips li{padding:11px 0}
  .pg-contact .c-form .g2{grid-template-columns:minmax(0,1fr)}
  .pg-contact .c-form .field{padding:14px 0 8px}
  .pg-contact .c-form textarea{min-height:104px}
  .pg-contact .c-faq{grid-template-columns:minmax(0,1fr);margin-top:24px}
  .pg-contact .c-faq .faq + .faq{border-top:0}
  .pg-contact .c-faq summary{font-size:16.5px;padding:14px 0}
  .pg-contact .c-faq .a{padding-left:0}
}
@media (max-width:420px){
  .pg-contact .c-intro h1{font-size:25px}
  .pg-contact .c-ways .big{font-size:24px}
  .pg-contact .c-qr{gap:16px}
  .pg-contact .c-qr .box{width:116px}
  .pg-contact .c-lab-n{margin-left:10px}
}

/* ---------- 平台店铺（#shops，tools/gen/shops.py 生成）：两栏细线条目，右侧二维码只在电脑上显示 ---------- */
.pg-contact .shops{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;margin-top:20px;border-top:1px solid var(--ink)}
.pg-contact .shop{display:grid;grid-template-columns:minmax(0,1fr) 124px;column-gap:24px;padding:22px 0;border-bottom:1px solid var(--rule)}
.pg-contact .shop .plat{font-size:13.5px;color:var(--red)}
.pg-contact .shop h3{margin-top:4px;font-size:20px;font-weight:700;line-height:1.4}
.pg-contact .shop h3 .sub{display:block;margin-top:4px;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink-3)}
.pg-contact .shop .d{margin-top:10px;font-size:15.5px;line-height:1.8;color:var(--ink-2)}
.pg-contact .shop .go{margin-top:12px;font-size:15.5px;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px}
.pg-contact .shop .go .copy{font-size:14.5px}
.pg-contact .qr-s{margin:0;align-self:start}
.pg-contact .qr-s .qr-svg{display:block;width:124px;height:124px;border:1px solid var(--rule-2)}
.pg-contact .qr-s figcaption{margin-top:6px;font-size:13px;color:var(--ink-3);text-align:center}
@media (max-width:900px){
  .pg-contact .shops{grid-template-columns:minmax(0,1fr);margin-top:14px}
  .pg-contact .shop{grid-template-columns:minmax(0,1fr);padding:18px 0}
  .pg-contact .shop h3{font-size:19px}
}

/* ==== src/css/pages/demos.css ==== */
/* ============================================================
   体验中心（demos.html）私有样式。所有选择器以 .pg-demos 开头。
   顺序：页头一句话 → 筛选 → 十三格拼版（图 01 占 2×2，每格下有图号与名称）→ 按身份先看
         → 01 一屏一套（图 8 栏 + 字 4 栏，左右交替；字栏是一张小档案条）
         → 02 演示与真系统（细线对照表）→ 03 收尾（目录式去处）
   ============================================================ */

/* ---------- 页头 ---------- */
.pg-demos .dm-head{padding:32px 0 72px}
.pg-demos .dm-intro{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:56px;align-items:end;padding-bottom:24px}
.pg-demos .dm-intro .lab{margin-bottom:12px}
.pg-demos .dm-intro h1{font-size:clamp(28px,3vw,42px);line-height:1.42}
.pg-demos .dm-intro .deck{font-size:16px;line-height:1.95;color:var(--ink-2)}
.pg-demos .dm-intro .deck + .deck{margin-top:8px}
.pg-demos .dm-filter{margin-bottom:24px}

/* ---------- 十三格拼版：2px 墨缝；大格占左上 2×2；图下一行图号与名称 ---------- */
.pg-demos .dm-sheet{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;background:var(--ink);border:1px solid var(--ink)}
.pg-demos .dm-sheet .t{display:flex;flex-direction:column;min-width:0;background:var(--paper)}
.pg-demos .dm-sheet .t.big{grid-column:span 2;grid-row:span 2}
.pg-demos .dm-sheet .im{display:block;position:relative;aspect-ratio:8/5;overflow:hidden;background:var(--paper-3)}
.pg-demos .dm-sheet .im img{width:100%;height:100%;object-fit:cover;object-position:top left;transition:opacity .2s}
.pg-demos .dm-sheet .im .fb{position:absolute;inset:0;aspect-ratio:auto;border:0}
.pg-demos .dm-sheet .cap{flex:1 1 auto;display:block;padding:7px 12px 9px;border-top:1px solid var(--rule);font-size:14px;line-height:1.55;color:var(--ink)}
.pg-demos .dm-sheet .cap b{font-family:var(--serif);font-weight:700;color:var(--red);margin-right:8px;white-space:nowrap}
.pg-demos .dm-sheet .big .cap{padding:10px 16px 12px}
.pg-demos .dm-sheet .big .cap b{font-size:16px}
.pg-demos .dm-sheet .big .nm{font-family:var(--serif);font-weight:700;font-size:18px}
.pg-demos .dm-sheet .big .d{display:block;margin-top:2px;font-size:14px;line-height:1.7;color:var(--ink-3)}
@media (hover:hover){.pg-demos .dm-sheet .t:hover .cap{background:var(--paper-2)}}
@media (hover:hover){.pg-demos .dm-sheet .t:hover .nm{color:var(--red)}}
/* 筛选时对不上的格子变淡（由 demos.js 照列表的 hidden 同步） */
.pg-demos .dm-sheet .t.off .im img{opacity:.22}
.pg-demos .dm-sheet .t.off .cap,.pg-demos .dm-sheet .t.off .cap b,.pg-demos .dm-sheet .t.off .d{color:var(--ink-3)}
.pg-demos .dm-sheet-note{margin-top:10px;font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.pg-demos .dm-sheet-note .dm-swipe{display:none}
.pg-demos .dm-head .guide-line{margin-top:28px}

/* ---------- 01 一屏一套 ---------- */
.pg-demos .sh-num{margin-bottom:24px}
.pg-demos .dm-state{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 20px;margin:-4px 0 20px;font-size:15px;color:var(--ink-2)}
.pg-demos .dm-state b{font-weight:500;color:var(--red)}
.pg-demos .dm-state button{background:none;border:0;border-bottom:1px solid var(--rule-2);padding:0 0 1px;border-radius:0;font-size:15px;color:var(--ink);cursor:pointer}
@media (hover:hover){.pg-demos .dm-state button:hover{color:var(--red);border-color:var(--red)}}
.pg-demos .dm-plate{border-top:1px solid var(--rule)}
.pg-demos .dm-plates > .dm-plate:first-child{border-top-color:var(--ink)}
.pg-demos .dm-plate.is-last{border-bottom:1px solid var(--ink)}
.pg-demos .dm-plate .fig figcaption .tl{color:var(--ink-2)}
.pg-demos .dm-plate .txt h3{font-size:clamp(20px,1.66vw,24px);line-height:1.55}
.pg-demos .dm-facts{margin-top:20px;border-top:1px solid var(--ink)}
.pg-demos .dm-facts > div{display:grid;grid-template-columns:78px minmax(0,1fr);column-gap:14px;padding:11px 0;border-bottom:1px solid var(--rule)}
.pg-demos .dm-facts dt{padding-top:2px;font-size:13.5px;line-height:1.7;color:var(--ink-3);white-space:nowrap}
.pg-demos .dm-facts dd{margin:0;font-size:15px;line-height:1.8;color:var(--ink-2)}
.pg-demos .dm-facts dd a{color:var(--red);border-bottom:1px solid transparent;white-space:nowrap}
@media (hover:hover){.pg-demos .dm-facts dd a:hover{border-color:var(--red)}}
.pg-demos .dm-facts dd .arc{display:block}
.pg-demos .dm-facts dd .arc + .arc{margin-top:2px}
.pg-demos .dm-facts dd .ct{margin-left:8px;color:var(--ink)}
.pg-demos .dm-plate .txt .go{margin-top:18px;align-items:baseline}
.pg-demos .dm-plate .go .tip{font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.pg-demos .dm-more{display:none}
.pg-demos #list .empty .lnk{margin:0 2px}

/* ---------- 02 演示与真系统：细线对照表 ---------- */
.pg-demos .dm-diff{margin-top:28px}
.pg-demos .dm-diff .c-k{width:17%}.pg-demos .dm-diff .c-a{width:41.5%}.pg-demos .dm-diff .c-b{width:41.5%}
.pg-demos .dm-diff tbody th{padding:20px 20px 20px 0;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top;font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.6;color:var(--ink);white-space:nowrap}
.pg-demos .dm-diff tbody tr:last-child th{border-bottom-color:var(--ink)}
.pg-demos .dm-diff td{font-size:15.5px}
.pg-demos .dm-diff td:last-child{color:var(--ink)}

/* ---------- 03 收尾 ---------- */
.pg-demos .dm-close{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);column-gap:72px;align-items:start}
.pg-demos .dm-close .lede{max-width:600px}
.pg-demos .dm-close .toc li .no{flex-basis:20px}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .pg-demos .dm-intro{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
  .pg-demos .feat.dm-plate{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:36px;padding:48px 0}
  .pg-demos .feat.dm-plate.flip{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
  .pg-demos .dm-sheet .cap{padding:6px 10px 8px}
  .pg-demos .dm-close{column-gap:48px}
}
@media (max-width:900px){
  .pg-demos .dm-head{padding:24px 0 40px}
  .pg-demos .dm-intro{grid-template-columns:minmax(0,1fr);row-gap:12px;padding-bottom:20px}
  .pg-demos .dm-intro h1{font-size:28px}
  .pg-demos .dm-intro .deck{font-size:15.5px;line-height:1.8}
  /* 筛选条在手机上每条一行、条内左右滑（页面本身不横向溢出） */
  .pg-demos .dm-filter{margin-bottom:20px}
  .pg-demos .dm-filter .count-note{padding-left:8px;white-space:nowrap}
  /* 拼版在手机上改成一条横滑的图带 */
  .pg-demos .dm-sheet{display:flex;overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;overscroll-behavior-x:contain}
  .pg-demos .dm-sheet .t,.pg-demos .dm-sheet .t.big{flex:0 0 64%;scroll-snap-align:start}
  .pg-demos .dm-sheet .cap,.pg-demos .dm-sheet .big .cap{padding:5px 8px 6px;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .pg-demos .dm-sheet .big .cap b{font-size:13px}
  .pg-demos .dm-sheet .big .nm{font-family:var(--sans);font-weight:500;font-size:13px}
  .pg-demos .dm-sheet .big .d{display:none}
  .pg-demos .dm-sheet-note .dm-swipe{display:inline}
  .pg-demos .dm-head .guide-line{margin-top:20px}
  /* 一屏一套 → 图 + 图注 + 标题 + 解决了什么 + 打开链接；「打开先试」「对应档案」收起（.m-hide） */
  .pg-demos .feat.dm-plate,.pg-demos .feat.dm-plate.flip{grid-template-columns:minmax(0,1fr);gap:12px;padding:24px 0 26px}
  .pg-demos .dm-plate .fig figcaption{margin-top:8px;font-size:14px;line-height:1.7}
  .pg-demos .dm-plate .txt .who{display:none}
  .pg-demos .dm-plate .txt h3{font-size:18px;line-height:1.6;margin-top:0}
  .pg-demos .dm-facts{margin-top:12px}
  .pg-demos .dm-facts > div{grid-template-columns:minmax(0,1fr);padding:10px 0 12px}
  .pg-demos .dm-facts dt{display:none}
  .pg-demos .dm-facts dd{font-size:15px;line-height:1.75}
  .pg-demos .dm-plate .txt .go{margin-top:12px;gap:4px 16px}
  /* 没筛选时只展开前几套，其余收起，尾行「展开其余 N 套」（demos.js 控制 .is-folded） */
  .pg-demos .dm-plates.is-folded > .dm-f{display:none}
  .pg-demos .dm-more{display:flex;justify-content:space-between;align-items:baseline;gap:12px;width:100%;padding:14px 0;background:none;border:0;border-top:1px solid var(--rule);border-bottom:1px solid var(--ink);border-radius:0;font-family:var(--serif);font-size:17px;font-weight:700;color:var(--ink);text-align:left;cursor:pointer}
  .pg-demos .dm-more span{font-family:var(--sans);font-size:14.5px;font-weight:500;color:var(--red);white-space:nowrap}
  .pg-demos .dm-state{font-size:14.5px;margin:0 0 14px}
  .pg-demos .dm-state button{font-size:14.5px}
  /* 对照表 → 每行一条：标题一行，演示版与交付的系统左右并排（仍只有细线） */
  .pg-demos .dm-diff thead,.pg-demos .dm-diff colgroup{display:none}
  .pg-demos .dm-diff,.pg-demos .dm-diff tbody{display:block;width:auto}
  .pg-demos .dm-diff{margin-top:20px}
  .pg-demos .dm-diff tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:18px;padding:14px 0 16px;border-bottom:1px solid var(--rule)}
  .pg-demos .dm-diff tbody tr:first-child{border-top:1px solid var(--ink)}
  .pg-demos .dm-diff tbody tr:last-child{border-bottom-color:var(--ink)}
  .pg-demos .dm-diff tbody th,.pg-demos .dm-diff td{display:block;width:auto;padding:0;border:0!important;white-space:normal}
  .pg-demos .dm-diff tbody th{grid-column:1 / -1;font-size:17px;line-height:1.5;margin-bottom:6px}
  .pg-demos .dm-diff td{font-size:14.5px;line-height:1.75}
  .pg-demos .dm-diff td::before{content:attr(data-l);display:block;font-size:13.5px;line-height:1.6;color:var(--ink-3);margin-bottom:2px}
  /* 收尾 */
  .pg-demos .dm-close{grid-template-columns:minmax(0,1fr);row-gap:20px}
  .pg-demos .dm-close .lede{font-size:16px;line-height:1.85}
  .pg-demos .dm-close .toc ol{display:block}
  .pg-demos .dm-close .toc li a{padding:10px 0}
  .pg-demos .dm-close .toc li .d{display:block;margin-left:auto}
}
@media (max-width:420px){
  .pg-demos .dm-intro h1{font-size:25px}
  .pg-demos .dm-sheet .t,.pg-demos .dm-sheet .t.big{flex-basis:70%}
  .pg-demos .dm-plate .txt h3{font-size:17px}
  .pg-demos .dm-diff tr{column-gap:14px}
  .pg-demos .dm-close .toc li .d{font-size:13.5px}
}
@media (prefers-reduced-motion:reduce){.pg-demos .dm-sheet .im img{transition:none}}

/* ==== src/css/pages/notes.css ==== */
/* ============================================================
   实战笔记：索引页 notes.html（main.pg-notes）+ 正文页 note-*.html（main.pg-notes.art-page，模板 src/partials/article.html）
   只用设计系统里的纸、墨、朱砂与细线；朱砂只给篇号、档案号、图号、链接。
   ============================================================ */

/* 标题按全角标点分段：段内不拆行，换行只落在「，：；」之后 */
.pg-notes .seg{display:inline-block}

/* ---------- 首屏：栏目说明 + 图版 ---------- */
.pg-notes .n-head{padding:36px 0 64px}
.pg-notes .n-head-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);column-gap:64px;align-items:start}
.pg-notes .n-claim .lab{margin-bottom:12px}
.pg-notes .n-claim h1{font-size:clamp(28px,3vw,42px);line-height:1.42}
.pg-notes .n-claim .deck{margin-top:22px;font-size:16.5px;line-height:1.95;color:var(--ink-2)}
.pg-notes .n-claim .deck + .deck{margin-top:10px}
.pg-notes .n-stat{margin-top:22px;padding-top:12px;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;font-size:14px;line-height:1.7;color:var(--ink-3)}
.pg-notes .n-stat span + span::before{content:"·";margin:0 10px}
.pg-notes .n-claim .go{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:16.5px}
.pg-notes .n-fig{margin-top:8px}
.pg-notes .n-fig figcaption a{color:var(--red);border-bottom:1px solid var(--red)}
@media (hover:hover){.pg-notes .n-fig figcaption a:hover{color:var(--ink);border-color:var(--ink)}}

/* ---------- 01 全部笔记：三栏索引（篇号 · 标题摘要 · 对应档案） ---------- */
.pg-notes .n-thead,.pg-notes .n-list > li{display:grid;grid-template-columns:130px minmax(0,1fr) 290px;column-gap:40px}
.pg-notes .n-thead{margin-top:28px;padding-bottom:10px;border-bottom:1px solid var(--ink);font-size:13.5px;line-height:1.6;color:var(--ink-3)}
.pg-notes .n-thead span:last-child{padding-left:25px}
.pg-notes .n-list > li{padding:26px 0 28px;border-bottom:1px solid var(--rule)}
.pg-notes .n-list > li:last-child,.pg-notes .n-list > li.is-last{border-bottom-color:var(--ink)}
.pg-notes .n-no b{display:block;font-family:var(--serif);font-weight:700;font-size:19px;line-height:1.45;color:var(--red);white-space:nowrap}
.pg-notes .n-no time{display:block;margin-top:4px;font-size:13.5px;color:var(--ink-3)}
.pg-notes .n-main h3{font-size:22px;line-height:1.5}
@media (hover:hover){.pg-notes .n-main h3 a:hover{color:var(--red)}}
.pg-notes .n-sum{margin-top:8px;max-width:40em;font-size:15.5px;line-height:1.85;color:var(--ink-2)}
.pg-notes .n-tags{margin-top:10px;font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.pg-notes .n-tags .k{margin-right:10px}
.pg-notes .n-tags a{color:var(--ink-2);border-bottom:1px solid var(--rule-2)}
@media (hover:hover){.pg-notes .n-tags a:hover{color:var(--red);border-color:var(--red)}}
.pg-notes .n-len{margin-left:18px}
.pg-notes .n-src{padding-left:24px;border-left:1px solid var(--rule);font-size:14.5px;line-height:1.7}
.pg-notes .n-src .k{display:none}   /* 表头已写「对应档案」，逐行不再重复 */
.pg-notes .n-src .none{font-size:13.5px;line-height:1.6;color:var(--ink-3)}
.pg-notes .n-src .case{display:block}
.pg-notes .n-src .case .no{display:block;font-size:13.5px;line-height:1.5;color:var(--red)}
.pg-notes .n-src .case b{display:block;font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.5;color:var(--ink)}
@media (hover:hover){.pg-notes .n-src .case:hover b{color:var(--red)}}
.pg-notes .n-src .sub{display:block;font-size:13.5px;line-height:1.6;color:var(--ink-3)}
.pg-notes .n-src .fig-ref{display:inline-block;margin-top:8px;font-size:14px;color:var(--red);border-bottom:1px solid transparent}
@media (hover:hover){.pg-notes .n-src .fig-ref:hover{border-color:var(--red)}}

/* ---------- 02 规矩：两栏，篇号 + 一句话 ---------- */
.pg-notes .n-rules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:56px}
.pg-notes .n-rules li{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:16px;padding:22px 0 20px;border-bottom:1px solid var(--rule)}
.pg-notes .n-rules .no{font-family:var(--serif);font-weight:700;font-size:15.5px;line-height:1.8;color:var(--red);white-space:nowrap}
.pg-notes .n-rules p{font-family:var(--serif);font-weight:700;font-size:18px;line-height:1.8;color:var(--ink)}
.pg-notes .n-rules .go{display:inline-block;margin-top:8px;font-size:14px;line-height:1.6;color:var(--ink-3);border-bottom:1px solid var(--rule-2)}
@media (hover:hover){.pg-notes .n-rules .go:hover{color:var(--red);border-color:var(--red)}}

/* ---------- 03 免费诊断 ---------- */
.pg-notes .n-ask{max-width:780px}
.pg-notes .n-ask .lede{max-width:36em}
.pg-notes .n-ask .more-txt{margin-top:12px;max-width:40em;font-size:16px;line-height:1.9;color:var(--ink-2)}
.pg-notes .n-ask .go{margin-top:22px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:16px}

/* ============================================================
   正文页：左栏（篇号、日期、主题、篇幅、档案、本篇目录）+ 正文栏
   ============================================================ */
.pg-notes .art-grid{display:grid;grid-template-columns:220px minmax(0,720px);column-gap:80px;align-items:start;padding-top:52px;padding-bottom:80px}
.pg-notes .art-rail{position:sticky;top:calc(var(--nav-h) + 28px);padding-top:4px}
.pg-notes .r-lab a{font-family:var(--serif);font-weight:700;font-size:15.5px;line-height:1.5;color:var(--red);border-bottom:1px solid transparent}
@media (hover:hover){.pg-notes .r-lab a:hover{border-color:var(--red)}}
.pg-notes .r-no{margin-top:4px;font-family:var(--serif);font-weight:900;font-size:34px;line-height:1.3;color:var(--red);white-space:nowrap}
.pg-notes .r-meta{margin:18px 0 0;border-top:1px solid var(--ink);display:grid;grid-template-columns:40px minmax(0,1fr)}
.pg-notes .r-meta dt,.pg-notes .r-meta dd{margin:0;padding:8px 0;border-bottom:1px solid var(--rule);line-height:1.65}
.pg-notes .r-meta dt{font-size:13.5px;color:var(--ink-3);padding-top:9px}
.pg-notes .r-meta dd{font-size:14.5px;color:var(--ink)}
.pg-notes .r-meta dd a{color:var(--red);border-bottom:1px solid transparent;white-space:nowrap}
@media (hover:hover){.pg-notes .r-meta dd a:hover{border-color:var(--red)}}
.pg-notes .r-meta dd .nm{display:block;font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.pg-notes .r-toc{margin-top:28px}
.pg-notes .r-toc .k{padding-bottom:8px;border-bottom:1px solid var(--ink);font-family:var(--serif);font-weight:700;font-size:15.5px;line-height:1.5}
.pg-notes .r-toc li a{display:flex;align-items:baseline;gap:10px;padding:8px 0;border-bottom:1px solid var(--rule);font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.pg-notes .r-toc li .no{flex:0 0 20px;font-size:13.5px;color:var(--red)}
@media (hover:hover){.pg-notes .r-toc li a:hover{color:var(--red)}}

.pg-notes .art-crumb{display:none;flex-wrap:wrap;align-items:baseline;gap:2px 14px;margin-bottom:12px;font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.pg-notes .art-crumb a{color:var(--red)}
.pg-notes .art-crumb b{font-weight:500;color:var(--ink)}
.pg-notes .art-head{max-width:none;padding:0 0 28px;border-bottom:1px solid var(--ink)}
.pg-notes .art-head h1{margin-top:0;font-size:clamp(30px,3vw,42px);line-height:1.4}
.pg-notes .art-head .summary{margin-top:18px;font-size:18px;line-height:1.9;color:var(--ink-2)}

/* 正文排版：17px / 1.9；引用块只用左侧一条细墨线 */
.pg-notes .art-body{max-width:none;padding:30px 0 0}
.pg-notes .article p,.pg-notes .article ul,.pg-notes .article ol{font-size:17px;line-height:1.9}
.pg-notes .article p + p{margin-top:14px}
.pg-notes .article h2{margin:44px 0 12px;font-size:22px}
.pg-notes .article h2 + p{margin-top:0}
.pg-notes .article blockquote{margin:32px 0 6px;padding:2px 0 2px 22px;border-left:1px solid var(--ink);font-size:20px;line-height:1.75}

/* 文末：对应档案 + 同类演示图版 */
.pg-notes .art-src{margin-top:52px;padding-top:18px;border-top:1px solid var(--ink)}
.pg-notes .art-src .lab{margin-bottom:8px}
.pg-notes .s-case{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px}
.pg-notes .s-case .no{font-size:13.5px;color:var(--red)}
.pg-notes .s-case b{font-family:var(--serif);font-weight:700;font-size:20px;line-height:1.5}
.pg-notes .s-case .sub{font-size:13.5px;color:var(--ink-3)}
.pg-notes .s-how{margin-top:6px;font-size:15.5px;line-height:1.85;color:var(--ink-2)}
.pg-notes .art-src .fig{margin-top:20px}
.pg-notes .art-src .go{margin-top:16px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:15.5px}

/* 免费诊断文字链（不做色块） */
.pg-notes .art-cta{max-width:none;margin-top:48px;padding:20px 0 22px;border-top:1px solid var(--ink);border-bottom:1px solid var(--rule);font-family:var(--sans);font-weight:500;font-size:16px;line-height:1.85;color:var(--ink-2)}
.pg-notes .art-cta .q{margin-bottom:4px;font-family:var(--serif);font-weight:700;font-size:21px;line-height:1.6;color:var(--ink)}
.pg-notes .art-cta .go{margin-top:12px;display:flex;flex-wrap:wrap;gap:8px 28px}
.pg-notes .art-cta .lnk{margin-left:0;font-size:15.5px}

/* 上一篇 / 下一篇（带篇号） */
.pg-notes .art-nav{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px;padding:22px 0 0}
.pg-notes .art-nav > *{min-width:0}
.pg-notes .art-nav .next{text-align:right}
.pg-notes.art-page .art-nav a::before{content:none;display:none}
.pg-notes .art-nav .k{display:block;margin-bottom:4px;font-family:var(--sans);font-weight:500;font-size:13.5px;line-height:1.6;color:var(--ink-3)}
.pg-notes .art-nav b{display:block;font-family:var(--serif);font-weight:700;font-size:17px;line-height:1.6;color:var(--ink)}
@media (hover:hover){.pg-notes .art-nav a:hover b{color:var(--red)}}
.pg-notes .art-nav .none b{color:var(--ink-3)}
.pg-notes .art-all{margin-top:28px;padding-top:14px;border-top:1px solid var(--rule);display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 20px;font-size:14px;line-height:1.7;color:var(--ink-3)}
.pg-notes .art-all .lnk{font-size:15.5px;color:var(--ink)}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .pg-notes .n-head-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:40px}
  .pg-notes .n-thead,.pg-notes .n-list > li{grid-template-columns:96px minmax(0,1fr) 230px;column-gap:28px}
  .pg-notes .n-thead span:last-child{padding-left:21px}
  .pg-notes .n-src{padding-left:20px}
  .pg-notes .n-rules{column-gap:40px}
  .pg-notes .art-grid{grid-template-columns:200px minmax(0,1fr);column-gap:44px}
  .pg-notes .r-meta{grid-template-columns:36px minmax(0,1fr)}
  .pg-notes .r-no{font-size:30px}
}
@media (max-width:900px){
  /* 首屏：说明 → 图版 */
  .pg-notes .n-head{padding:24px 0 36px}
  .pg-notes .n-head-grid{grid-template-columns:minmax(0,1fr);row-gap:24px}
  .pg-notes .n-claim h1{font-size:28px}
  .pg-notes .n-claim .deck{margin-top:14px;font-size:16px;line-height:1.8}
  .pg-notes .n-stat{margin-top:14px;padding-top:10px}
  .pg-notes .n-claim .go{margin-top:12px;font-size:16px}
  .pg-notes .n-fig{margin-top:0}
  /* 索引 → 条目（仍然只有细线） */
  .pg-notes .n-thead{display:none}
  .pg-notes .n-list{margin-top:0}   /* 筛选条底线就是第一条分隔线，不再叠一条墨线 */
  .pg-notes .n-list > li{display:block;padding:18px 0 20px}
  .pg-notes .n-no{display:flex;align-items:baseline;gap:12px}
  .pg-notes .n-no b{font-size:16px}
  .pg-notes .n-no time{margin-top:0}
  .pg-notes .n-main h3{margin-top:4px;font-size:19px}
  .pg-notes .n-sum{margin-top:6px;font-size:15px;line-height:1.8}
  .pg-notes .n-tags{margin-top:8px}
  .pg-notes .n-src{margin-top:10px;padding:8px 0 0;border-left:0;border-top:1px dotted var(--rule-2);display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
  .pg-notes .n-src .case{display:inline;margin:0}
  .pg-notes .n-src .case .no{display:inline;margin-right:6px}
  .pg-notes .n-src .case b{display:inline;font-size:15.5px}
  .pg-notes .n-src .sub{display:none}
  .pg-notes .n-src .fig-ref{margin-top:0}
  /* 规矩 → 单栏 */
  .pg-notes .n-rules{grid-template-columns:minmax(0,1fr)}
  .pg-notes .n-rules li{grid-template-columns:60px minmax(0,1fr);column-gap:12px;padding:16px 0}
  .pg-notes .n-rules .no{font-size:14.5px}
  .pg-notes .n-rules p{font-size:16.5px;line-height:1.75}
  .pg-notes .n-ask .lede{font-size:16.5px;line-height:1.8}
  .pg-notes .n-ask .more-txt{font-size:15.5px;line-height:1.8}
  .pg-notes .n-ask .go{margin-top:16px}
  /* 正文页：左栏收起，信息并进标题上方一行 */
  .pg-notes .art-grid{grid-template-columns:minmax(0,1fr);padding-top:26px;padding-bottom:44px}
  .pg-notes .art-rail{display:none}
  .pg-notes .art-crumb{display:flex}
  .pg-notes .art-head{padding-bottom:22px}
  .pg-notes .art-head h1{font-size:26px}
  .pg-notes .art-head .summary{margin-top:12px;font-size:16.5px;line-height:1.8}
  .pg-notes .art-body{padding-top:20px}
  .pg-notes .article p,.pg-notes .article ul,.pg-notes .article ol{font-size:16.5px;line-height:1.85}
  .pg-notes .article h2{margin:34px 0 10px;font-size:20px}
  .pg-notes .article blockquote{margin-top:26px;font-size:18px}
  .pg-notes .art-src{margin-top:40px}
  .pg-notes .s-case b{font-size:18px}
  .pg-notes .s-how{font-size:15px;line-height:1.8}
  .pg-notes .art-src .fig{margin-top:14px}
  .pg-notes .art-cta{margin-top:36px}
  .pg-notes .art-cta .q{font-size:18px}
  .pg-notes .art-cta p{font-size:15.5px;line-height:1.8}
  .pg-notes .art-nav{grid-template-columns:minmax(0,1fr);gap:0;padding-top:4px}
  .pg-notes .art-nav > *{padding:14px 0;border-bottom:1px solid var(--rule)}
  .pg-notes .art-nav .next{text-align:left}
  .pg-notes .art-nav b{font-size:16px}
  .pg-notes .art-all{margin-top:14px;border-top:0;padding-top:0}
}
@media (max-width:420px){
  .pg-notes .n-claim h1{font-size:25px}
  .pg-notes .art-head h1{font-size:24px}
  .pg-notes .article p,.pg-notes .article ul,.pg-notes .article ol{font-size:16px}
  .pg-notes .n-rules li{grid-template-columns:minmax(0,1fr);row-gap:2px}
  .pg-notes .n-rules .no{line-height:1.5}
}
@media print{
  .pg-notes .art-rail{position:static}
}

/* ---------- 手机分批（notes.js 控制）：≤900 先列 8 篇、规矩先列 6 条，免得整页拉到一万多像素 ---------- */
.pg-notes .n-list > li.n-fold{display:none}
.pg-notes .n-pager{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 28px;padding:14px 0 2px}
.pg-notes .n-pager .t{flex:0 0 100%;font-size:14.5px;line-height:1.7;color:var(--ink-3)}
.pg-notes .n-pager button,.pg-notes .n-rules-more button{background:none;border:0;border-bottom:1px solid var(--rule-2);border-radius:0;padding:10px 0 2px;font-size:16px;line-height:1.5;color:var(--ink);cursor:pointer}
.pg-notes .n-pager button.more,.pg-notes .n-rules-more button{color:var(--red);border-color:var(--red)}
.pg-notes .n-rules-more{margin-top:8px}
@media (max-width:900px){.pg-notes .n-rules.m-short > li:nth-child(n+7){display:none}}
@media (hover:hover){.pg-notes .n-pager button:hover{color:var(--red);border-color:var(--red)}}

/* ==== src/css/pages/solutions.css ==== */
/* ============================================================
   解决方案（solutions.html）· 页内样式，选择器一律以 .pg-solutions 开头
   首屏：主张 + 本页目录 → 行业 × 形态矩阵（主视觉，{{MATRIX}}）
   01 六类形态：词条体（第一类…第六类，{{SOL_FORMS}}），右栏配同类演示截图
   02 十个行业：双栏索引，纵向排（左 01–05 右 06–10），行线左右对齐（{{SOL_INDS}}）；手机只列前 6 行 + 节尾其余行业名
   03 按身份找：两栏，每条一段宋体引语（{{SOL_WHO}}）
   04 交付的样子：细线表，≤900 变条目（{{SOL_SHAPES}}）+ 收尾一行
   ============================================================ */

/* ---------- 首屏 ---------- */
.pg-solutions .s-cover{padding:44px 0 80px}
.pg-solutions .s-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:80px;align-items:start}
.pg-solutions .s-claim .lab{margin-bottom:12px}
.pg-solutions .s-claim h1{font-size:clamp(28px,3vw,42px);line-height:1.42;font-weight:900}
.pg-solutions .s-claim .deck{margin-top:22px;max-width:660px;font-size:16.5px;line-height:1.95;color:var(--ink-2)}
.pg-solutions .s-claim .deck + .deck{margin-top:10px}
.pg-solutions .s-claim .go{margin-top:24px;display:flex;flex-wrap:wrap;gap:8px 32px;font-size:16.5px}
.pg-solutions .s-side{padding-top:6px}
.pg-solutions .s-note{margin-top:22px;font-size:15px;line-height:1.9;color:var(--ink-2)}

/* 矩阵：表题一行（上墨线），下接 {{MATRIX}} */
.pg-solutions .s-mx-h{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 20px;margin:56px 0 22px;padding-top:18px;border-top:1px solid var(--ink)}
.pg-solutions .s-mx-h h2{font-size:22px;font-weight:900;line-height:1.4}
.pg-solutions .s-mx-h .meta{font-size:14px;color:var(--ink-2)}

/* ---------- 01 六类形态：词条（词头 / 释义 / 同类截图） ---------- */
.pg-solutions .sol-forms{border-top:1px solid var(--ink)}
.pg-solutions .sf{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,5fr) minmax(0,4fr);column-gap:48px;align-items:start;padding:34px 0 38px;border-bottom:1px solid var(--rule)}
.pg-solutions .sf:last-child{border-bottom-color:var(--ink)}
.pg-solutions .sf .hd .k{display:block;font-family:var(--serif);font-size:15.5px;font-weight:700;line-height:1.5;color:var(--red)}
.pg-solutions .sf .hd h3{margin-top:4px;font-size:clamp(22px,1.9vw,26px);font-weight:700;line-height:1.35}
.pg-solutions .sf .hd .sub{margin-top:10px;font-size:14.5px;line-height:1.7;color:var(--ink-3)}
.pg-solutions .sf:target .hd h3{color:var(--red)}
.pg-solutions .sf dl{margin:0}
.pg-solutions .sf dl > div{display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:14px;align-items:baseline;padding:10px 0;border-top:1px solid var(--rule)}
.pg-solutions .sf dl > div:first-child{padding-top:0;border-top:0}
.pg-solutions .sf dt{font-size:13.5px;line-height:1.7;color:var(--ink-3)}
.pg-solutions .sf dd{margin:0;font-size:15.5px;line-height:1.85;color:var(--ink-2)}
.pg-solutions .sf .r-when dd{font-family:var(--serif);font-size:17.5px;font-weight:700;line-height:1.75;color:var(--ink)}
.pg-solutions .sf .r-case dd .lnk{color:var(--ink);white-space:nowrap}
.pg-solutions .sf .r-case dd .m-hide{margin-right:12px}
.pg-solutions .sf .fl{display:block;width:fit-content;line-height:1.85}
.pg-solutions .sf .fl b,.pg-solutions .sol-inds .fl b,.pg-solutions .sol-who .fl b{font-family:var(--serif);font-weight:700;color:var(--red);white-space:nowrap}
.pg-solutions .sf .fl b{margin-right:10px}
.pg-solutions .sf .fl .nm{color:var(--ink);border-bottom:1px solid transparent}
@media (hover:hover){.pg-solutions .sf .fl:hover .nm{color:var(--red);border-color:var(--red)}}
.pg-solutions .sf .fig{margin-top:4px}

/* ---------- 02 十个行业：双栏索引 ---------- */
.pg-solutions .sol-inds{margin-top:32px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:repeat(var(--rows,5),auto);grid-auto-flow:column;column-gap:64px;border-top:1px solid var(--ink)}
.pg-solutions .sol-inds li{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:12px;align-items:baseline;padding:20px 0 22px;border-bottom:1px solid var(--rule)}
.pg-solutions .sol-inds li.e{border-bottom-color:var(--ink)}
.pg-solutions .sol-inds .no{font-size:14.5px;color:var(--red)}
.pg-solutions .sol-inds h3{font-size:20px;font-weight:700;line-height:1.45}
.pg-solutions .sol-inds li:target h3 a{color:var(--red)}
@media (hover:hover){.pg-solutions .sol-inds h3 a:hover{color:var(--red)}}
.pg-solutions .sol-inds .ln{margin-top:6px;font-size:15px;line-height:1.8;color:var(--ink)}
.pg-solutions .sol-inds .done{margin-top:6px;font-size:14.5px;line-height:1.8;color:var(--ink-2)}
.pg-solutions .sol-inds .done .k{margin-right:10px;font-size:13.5px;color:var(--ink-3)}
.pg-solutions .sol-inds .ref{margin-top:10px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 20px;font-size:14.5px;line-height:1.8}
.pg-solutions .sol-inds .dm{color:var(--ink-3)}
@media (hover:hover){.pg-solutions .sol-inds .dm .fl:hover b,.pg-solutions .sol-who .fl:hover b{border-bottom:1px solid var(--red)}}
.pg-solutions .sol-inds .ref .lnk{color:var(--ink);white-space:nowrap}
/* 手机端节尾：被截掉的几行留名字 +「全部十个行业 →」；桌面十行全列，不需要 */
.pg-solutions .sol-inds-more{display:none}
.pg-solutions .sol-inds-more span a{color:var(--ink);border-bottom:1px solid var(--rule-2);white-space:nowrap}   /* 行业名整个换行，别断成「物流 / · 供应链」 */

/* ---------- 03 按身份找：两栏引语 ---------- */
.pg-solutions .sol-who{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:64px}
.pg-solutions .sol-who li{padding:20px 0 30px;border-top:1px solid var(--ink)}
.pg-solutions .sol-who .nm{display:block;font-family:var(--serif);font-size:20px;font-weight:700;line-height:1.45}
.pg-solutions .sol-who .say{margin-top:12px;padding-left:18px;border-left:2px solid var(--ink);font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.8;color:var(--ink-2)}
.pg-solutions .sol-who .ref{margin-top:14px;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 24px;font-size:15px;line-height:1.8;color:var(--ink-2)}
.pg-solutions .sol-who .ref .lnk{color:var(--ink);white-space:nowrap}

/* ---------- 04 交付的样子：细线表 + 收尾 ---------- */
.pg-solutions .s-shapes{margin-top:8px}
.pg-solutions .s-shapes td,.pg-solutions .sf dd{text-wrap:pretty}   /* 表格格子与释义也避免末行只剩一个字 */
.pg-solutions .s-shapes .c-nm{width:16%}
.pg-solutions .s-shapes .c-where{width:38%}
.pg-solutions .s-shapes .c-fit{width:22%}
.pg-solutions .s-shapes .c-ex{width:24%}
.pg-solutions .s-shapes td.nm{font-family:var(--serif);font-size:18px;font-weight:700;line-height:1.5;color:var(--ink)}
.pg-solutions .s-shapes td.where{color:var(--ink)}
.pg-solutions .s-shapes td.ex a{display:block;width:fit-content;font-size:14.5px;line-height:1.75;color:var(--ink);border-bottom:1px solid transparent}
.pg-solutions .s-shapes td.ex a + a{margin-top:4px}
.pg-solutions .s-shapes td.ex a b{font-weight:500;color:var(--red);margin-right:8px;white-space:nowrap}
@media (hover:hover){.pg-solutions .s-shapes td.ex a:hover{color:var(--red);border-color:var(--red)}}
.pg-solutions .s-end{margin-top:44px;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);column-gap:80px;align-items:baseline}
.pg-solutions .s-end .t{font-family:var(--serif);font-size:20px;font-weight:700;line-height:1.75}
.pg-solutions .s-end .go{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 24px;font-size:15.5px}
.pg-solutions .s-end .tel{font-size:22px;font-weight:700;line-height:1.3;white-space:nowrap}
@media (hover:hover){.pg-solutions .s-end .tel:hover{color:var(--red)}}
.pg-solutions .s-end .k{margin-left:-12px;font-size:14px;color:var(--ink-3)}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .pg-solutions .s-head{column-gap:48px}
  /* 词条：左栏词头 + 截图，右栏释义 */
  .pg-solutions .sf{grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto 1fr;column-gap:40px}
  .pg-solutions .sf .hd{grid-column:1;grid-row:1}
  .pg-solutions .sf .fig{grid-column:1;grid-row:2;margin-top:20px}
  .pg-solutions .sf dl{grid-column:2;grid-row:1 / span 2}
  .pg-solutions .sol-inds,.pg-solutions .sol-who{column-gap:40px}
  .pg-solutions .s-end{column-gap:48px}
}
@media (max-width:900px){
  .pg-solutions .s-cover{padding:24px 0 36px}
  .pg-solutions .s-head{grid-template-columns:minmax(0,1fr)}
  .pg-solutions .s-claim h1{font-size:28px}
  .pg-solutions .s-claim .deck{margin-top:14px;font-size:16px;line-height:1.8}
  .pg-solutions .s-claim .go{margin-top:14px;gap:6px 24px;font-size:15.5px}
  .pg-solutions .s-mx-h{margin:28px 0 12px;padding-top:12px}
  .pg-solutions .s-mx-h h2{font-size:20px}
  /* 01 词条：词头与缩略图并排，释义通栏 */
  .pg-solutions .sf{grid-template-columns:minmax(0,1fr) 132px;grid-template-rows:auto;column-gap:16px;padding:20px 0}
  .pg-solutions .sf .hd{grid-column:1;grid-row:1}
  .pg-solutions .sf .fig{grid-column:2;grid-row:1;margin:4px 0 0}
  .pg-solutions .sf dl{grid-column:1 / -1;grid-row:2;margin-top:12px}
  .pg-solutions .sf .hd .k{font-size:15px}
  .pg-solutions .sf .hd h3{font-size:22px}
  .pg-solutions .sf .hd .sub{margin-top:4px;font-size:14px}
  .pg-solutions .sf .fig figcaption{margin-top:4px;font-size:13.5px;line-height:1.5}
  .pg-solutions .sf .fig figcaption .nm,.pg-solutions .sf .fig figcaption .sep,.pg-solutions .sf .fig figcaption .who{display:none}
  .pg-solutions .sf dl > div{grid-template-columns:36px minmax(0,1fr);column-gap:10px;padding:8px 0}
  .pg-solutions .sf dd{font-size:15px;line-height:1.75}
  .pg-solutions .sf .r-when dd{font-size:16px}
  .pg-solutions .sf .fl{display:inline-block;margin-right:14px}
  .pg-solutions .sf .fl .nm{display:none}
  /* 演示与档案并一行（两格相邻，顶线连成一条）：左图号，右「N 条 →」 */
  .pg-solutions .sf dl{display:grid;grid-template-columns:minmax(0,1fr) auto}
  .pg-solutions .sf dl > div{grid-column:1 / -1}
  .pg-solutions .sf dl > .r-demo{grid-column:1}
  .pg-solutions .sf dl > .r-case{grid-column:2;display:block;padding-left:12px;text-align:right}
  .pg-solutions .sf .r-case dt{display:none}
  /* 02 行业：单栏 */
  .pg-solutions .sol-inds{margin-top:20px;grid-template-columns:minmax(0,1fr);grid-template-rows:none;grid-auto-flow:row}
  .pg-solutions .sol-inds li{grid-template-columns:30px minmax(0,1fr);column-gap:8px;padding:14px 0 16px}
  .pg-solutions .sol-inds li.e{border-bottom-color:var(--rule)}
  .pg-solutions .sol-inds li:last-child,.pg-solutions .sol-inds li.me{border-bottom-color:var(--ink)}
  .pg-solutions .sol-inds-more{display:flex}
  /* 从别处带 #ind-<key> 跳进来、目标恰好在截掉的几行里：十行全放出来，节尾那句收掉 */
  .pg-solutions .sol-inds:has(li:target) li.m-cut{display:grid!important}
  .pg-solutions .sol-inds:has(li:target) li.me{border-bottom-color:var(--rule)}
  .pg-solutions #industries:has(li:target) .sol-inds-more{display:none}
  .pg-solutions .sol-inds .no{font-size:13.5px}
  .pg-solutions .sol-inds h3{font-size:18px}
  .pg-solutions .sol-inds .ln{margin-top:4px;font-size:14.5px;line-height:1.75}
  .pg-solutions .sol-inds .done{margin-top:4px;font-size:14px;line-height:1.75}
  .pg-solutions .sol-inds .ref{margin-top:6px;font-size:14px}
  /* 03 身份：单栏 */
  .pg-solutions .sol-who{grid-template-columns:minmax(0,1fr)}
  .pg-solutions .sol-who li{padding:14px 0 18px}
  .pg-solutions .sol-who li:last-child{border-bottom:1px solid var(--ink)}
  .pg-solutions .sol-who .nm{font-size:18px}
  .pg-solutions .sol-who .say{margin-top:8px;padding-left:14px;font-size:16px;line-height:1.75}
  .pg-solutions .sol-who .ref{margin-top:10px;font-size:14.5px}
  /* 04 交付：表 → 条目（仍只有细线） */
  .pg-solutions .s-shapes thead,.pg-solutions .s-shapes colgroup{display:none}
  .pg-solutions .s-shapes,.pg-solutions .s-shapes tbody,.pg-solutions .s-shapes tr,.pg-solutions .s-shapes td{display:block;width:auto}
  .pg-solutions .s-shapes tr{padding:14px 0;border-bottom:1px solid var(--rule)}
  .pg-solutions .s-shapes tbody tr:first-child{border-top:1px solid var(--ink)}
  .pg-solutions .s-shapes tbody tr:last-child{border-bottom-color:var(--ink)}
  .pg-solutions .s-shapes td{padding:0;border:0!important;font-size:15px;line-height:1.75}
  .pg-solutions .s-shapes td.nm{font-size:17px;margin-bottom:2px}
  /* 「做过」悬挂缩进：左标签，右一条一行 */
  .pg-solutions .s-shapes td.ex{margin-top:6px;display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:10px;align-items:baseline}
  .pg-solutions .s-shapes td.ex::before{content:attr(data-l);grid-column:1;grid-row:1;font-size:13.5px;color:var(--ink-3)}
  .pg-solutions .s-shapes td.ex a{grid-column:2;width:auto;font-size:14.5px}
  .pg-solutions .s-shapes td.ex a + a{margin-top:2px}
  .pg-solutions .s-end{grid-template-columns:minmax(0,1fr);row-gap:12px;margin-top:28px}
  .pg-solutions .s-end .t{font-size:17px}
  .pg-solutions .s-end .tel{font-size:20px}
}
@media (max-width:420px){
  .pg-solutions .s-claim h1{font-size:25px}
  .pg-solutions .sf{grid-template-columns:minmax(0,1fr) 116px;column-gap:14px}
  .pg-solutions .sf .hd h3{font-size:20px}
}
@media (hover:hover){
  .pg-solutions .sol-inds-more span a:hover{color:var(--red);border-color:var(--red)}
}
