/* ============================================================
   base.css —— 三种形态共用的视觉底层
   只定义「语义块长什么样」，不定义「排在哪个位置」。
   布局差异在 pc.html / h5.html / mini.html 各自的 <style> 里。
   ============================================================ */

:root{
  --blue:#165DFF; --blue-l:#EDF3FF; --blue-d:#0E42D2;
  /* 文字色阶按「在自身浅色底上仍 ≥4.5:1」定，不按「看着淡雅」定。
     旧值 #86909C 在 10~13px 只有 3.2:1 —— 截图看得见，真机上老人和
     户外屏读不出来。审计脚本 audit.py 会守住这条线。 */
  --orange:#B85100; --orange-l:#FFF4E8;
  --ok:#007A34; --ok-l:#E8FFEF;
  --warn:#A05C00; --warn-l:#FFF8E6;
  --dan:#C42B1C; --dan-l:#FFEDEC;
  --t1:#111827; --t2:#4E5969; --t3:#5F6B7C; --t4:#98A2B3;
  --line:#E5E6EB; --line2:#F2F3F5;
  --bg:#F7F8FA; --card:#FFFFFF;

  --fs:14px;          /* 基准字号，三形态各自覆盖 */
  --fs-s:12px;
  --fs-xs:11px;
  --gap:16px;
  --r:10px;
  --pad:16px;
}

*{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:var(--fs); color:var(--t1); line-height:1.6; background:var(--bg);
}
button{font-family:inherit;font-size:inherit;color:inherit;background:none;border:0;cursor:pointer}

/* 键盘焦点：全站只有输入框有 focus 样式，按钮和导航项一个都没有 ——
   用键盘 Tab 走一遍看不见自己在哪。后台是运营天天用键盘的地方，
   这一条不补，等于只有鼠标能用。
   用 :focus-visible 而不是 :focus，鼠标点完不会留一圈蓝框。 */
:focus-visible{outline:2px solid var(--blue);outline-offset:2px;border-radius:4px}
button:focus-visible,a:focus-visible,[data-act]:focus-visible,[data-p]:focus-visible,
[data-do]:focus-visible,[data-rv]:focus-visible,[data-tk]:focus-visible,
[data-pick]:focus-visible,tr[data-client]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
/* 深色底（顶栏、tabbar、品牌块）上蓝框看不见，换白框 */
.top :focus-visible,.ah-top :focus-visible,.tabbar :focus-visible,footer :focus-visible{outline-color:#fff}
input,textarea{font-family:inherit;font-size:inherit;color:inherit}
b{font-weight:600}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em}
.num{font-variant-numeric:tabular-nums}
.dan{color:var(--dan)}
.fine{font-size:var(--fs-xs);color:var(--t3)}

/* ---------------- 块间距 ---------------- */
.b{margin-bottom:var(--gap)}
.b:last-child{margin-bottom:0}

/* ---------------- hero ---------------- */
.b-hero .kicker{
  font-size:var(--fs-xs);letter-spacing:.06em;color:var(--blue-t,var(--blue));
  font-weight:600;text-transform:uppercase;margin-bottom:6px;
}
.b-hero h1{font-size:1.6em;line-height:1.32;font-weight:700;letter-spacing:-.4px}
.b-hero p{margin-top:8px;color:var(--t2);font-size:.93em;line-height:1.7}

/* ---------------- 卡片 ---------------- */
.b-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:var(--pad)}
.b-card .ch{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px}
.b-card .ch h2{font-size:.98em;font-weight:600;line-height:1.4}
.b-card.blue{border-left:3px solid var(--blue)}
.b-card.orange{border-left:3px solid var(--orange)}
.b-card.ok{border-left:3px solid var(--ok)}
.b-card.warn{border-left:3px solid var(--warn)}
.b-card.req{border-left:3px solid var(--dan)}

/* ---------------- 键值 ---------------- */
.kv-r{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px dashed var(--line2);font-size:.92em}
.kv-r:last-child{border-bottom:0}
.kv-r>span{color:var(--t3);flex:none}
.kv-r>b{font-weight:500;text-align:right;word-break:break-all}
.kv-mini .kv-r{padding:5px 0;font-size:.88em}

/* ---------------- 标签 ---------------- */
.tag{
  display:inline-flex;align-items:center;gap:3px;flex:none;
  padding:2px 7px;border-radius:5px;font-size:var(--fs-xs);font-weight:500;line-height:1.5;
  background:var(--line2);color:var(--t2);white-space:nowrap;
}
.tag.blue{background:var(--blue-l);color:var(--blue-t,var(--blue))}
.tag.ok{background:var(--ok-l);color:var(--ok)}
.tag.warn{background:var(--warn-l);color:var(--warn)}
.tag.dan{background:var(--dan-l);color:var(--dan)}
.tag.gray{background:var(--line2);color:var(--t3)}
/* 可点的标签（合同「展开全部」这类）撑到 26px 高，纯展示的标签不动 */
button.tag{cursor:pointer;min-height:26px}

/* ---------------- 列表 ---------------- */
.b-list{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.b-list .li{display:flex;gap:10px;padding:12px var(--pad);border-bottom:1px solid var(--line2);align-items:flex-start}
.b-list .li:last-child{border-bottom:0}
.b-list .li-b{flex:1;min-width:0}
.b-list .li-n{font-size:.93em;font-weight:500;line-height:1.55}
.b-list .li-s{margin-top:3px;font-size:var(--fs-s);color:var(--t3);line-height:1.6}
.b-list .li-a{margin-top:6px;display:flex;gap:12px}
.b-list .li-r{flex:none;font-size:var(--fs-xs);color:var(--t3);text-align:right;max-width:34%}

/* ---------------- 提示条 ---------------- */
.b-alert{display:flex;gap:9px;padding:12px var(--pad);border-radius:var(--r);font-size:.9em;line-height:1.65}
.b-alert .al-i{
  flex:none;width:17px;height:17px;border-radius:50%;margin-top:2px;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;color:#fff;background:var(--t3);
}
.b-alert b{display:block;margin-bottom:2px;font-size:.98em}
.b-alert p{color:var(--t2)}
.b-alert.info{background:var(--blue-l)} .b-alert.info .al-i{background:var(--blue)}
.b-alert.ok{background:var(--ok-l)} .b-alert.ok .al-i{background:var(--ok)}
.b-alert.warn{background:var(--warn-l)} .b-alert.warn .al-i{background:var(--warn)}
.b-alert.dan{background:var(--dan-l)} .b-alert.dan .al-i{background:var(--dan)}

/* ---------------- 数字组 ---------------- */
.b-metrics{display:grid;gap:8px}
.b-metrics .mt{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.b-metrics .mt-v{font-size:1.45em;font-weight:700;letter-spacing:-.6px;font-variant-numeric:tabular-nums;line-height:1.2}
.b-metrics .mt-k{font-size:var(--fs-xs);color:var(--t3);margin-top:3px}
.b-metrics .mt-s{font-size:var(--fs-xs);color:var(--t3);margin-top:2px;opacity:.8}

/* ---------------- 金额 ---------------- */
.b-money{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px var(--pad);text-align:center}
.b-money .mo-l{font-size:var(--fs-xs);color:var(--t3)}
.b-money .mo-v{font-size:1.8em;font-weight:700;letter-spacing:-1px;font-variant-numeric:tabular-nums;margin:3px 0}
.b-money .mo-s{font-size:var(--fs-xs);color:var(--t3)}
.big-money{font-size:1.85em;font-weight:700;letter-spacing:-1px;font-variant-numeric:tabular-nums;line-height:1.2;color:var(--blue-t,var(--blue))}
.big-money.orange{color:var(--orange)}

/* ---------------- 拆分（两张纸） ---------------- */
.b-split{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px var(--pad)}
.b-split .sp-l{font-size:var(--fs-xs);color:var(--t3);margin-bottom:9px}
.b-split .sp-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.b-split .sp{padding:10px 12px;border-radius:8px;background:var(--bg)}
.b-split .sp span{display:block;font-size:var(--fs-xs);color:var(--t3)}
.b-split .sp b{display:block;font-size:1.25em;font-weight:700;letter-spacing:-.5px;margin-top:2px;font-variant-numeric:tabular-nums}
.b-split .sp.blue{background:var(--blue-l)} .b-split .sp.blue b{color:var(--blue-t,var(--blue))}
.b-split .sp.orange{background:var(--orange-l)} .b-split .sp.orange b{color:var(--orange)}
.b-split .sp.gray b{color:var(--t2)}
.b-split .sp-t{display:flex;justify-content:space-between;align-items:baseline;margin-top:10px;padding-top:9px;border-top:1px solid var(--line)}
.b-split .sp-t span{font-size:var(--fs-xs);color:var(--t3)}
.b-split .sp-t b{font-size:1.2em;font-weight:700;color:var(--blue-t,var(--blue));font-variant-numeric:tabular-nums}

/* ---------------- 表格（宽屏） ---------------- */
.b-table{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.b-table table{width:100%;border-collapse:collapse;font-size:.9em}
.b-table th{
  text-align:left;padding:10px 12px;background:#FAFBFC;border-bottom:1px solid var(--line);
  font-weight:600;color:var(--t2);font-size:var(--fs-s);white-space:nowrap;
}
.b-table td{padding:11px 12px;border-bottom:1px solid var(--line2);vertical-align:middle}
.b-table tr:last-child td{border-bottom:0}
.b-table .ta-r{text-align:right;white-space:nowrap}
.b-table td .tag{margin:0}

/* ---------------- 卡片列表（窄屏替代表格） ---------------- */
.b-cards{display:grid;gap:8px}
.b-cards .rc{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px var(--pad)}
.b-cards .rc-h{font-weight:600;font-size:.95em;line-height:1.5;margin-bottom:8px;padding-bottom:7px;border-bottom:1px dashed var(--line2)}
.b-cards .rc-h .tag{margin-right:5px;vertical-align:1px}
.b-cards .rc-b{display:grid;gap:5px}
.b-cards .rc-r{display:flex;justify-content:space-between;gap:12px;font-size:var(--fs-s);align-items:baseline}
.b-cards .rc-r>span{color:var(--t3);flex:none}
.b-cards .rc-r>b{font-weight:500;text-align:right;word-break:break-word;max-width:62%}
.b-cards .rc-f{margin-top:9px;padding-top:8px;border-top:1px dashed var(--line2);display:flex;justify-content:flex-end;gap:12px;font-size:var(--fs-s)}

/* ---------------- 图表 ---------------- */
.b-chart{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:12px}
.did-svg{display:block;width:100%;height:auto}
.chart-cap{margin-top:6px;text-align:center;font-size:var(--fs-xs);color:var(--t3)}

/* ---------------- 按钮 ---------------- */
.b-act .btn-row{display:flex;gap:9px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:11px 18px;border-radius:8px;font-weight:600;font-size:.97em;
  background:var(--blue);color:#fff;transition:.15s;white-space:nowrap;
}
.btn:hover:not(:disabled){background:var(--blue-d)}
.btn:disabled{background:#D8DCE3;color:#fff;cursor:not-allowed}
.btn.ghost{background:transparent;color:var(--t2);border:1px solid var(--line)}
.btn.ghost:hover:not(:disabled){background:var(--line2);color:var(--t1)}
.btn.pri{flex:1}
.btn.w100{width:100%}
.btn-row{display:flex;gap:9px}
.act-note{margin-top:9px;font-size:var(--fs-xs);color:var(--t3);text-align:center;line-height:1.6}

/* ---------------- 输入 ---------------- */
.ipt-wrap{position:relative}
.ipt{
  width:100%;padding:12px 13px;border:1px solid var(--line);border-radius:8px;
  background:#FCFCFD;outline:none;transition:.15s;font-size:.97em;
}
.ipt:focus{border-color:var(--blue-t,var(--blue));background:#fff;box-shadow:0 0 0 3px rgba(22,93,255,.09)}
.ipt.ta{resize:vertical;line-height:1.7;min-height:76px}
.ipt-hint{margin-top:6px;font-size:var(--fs-xs);color:var(--t3);line-height:1.65}
.ipt-ok{
  margin-top:7px;padding:9px 11px;border-radius:7px;background:var(--ok-l);color:var(--ok);
  font-size:var(--fs-s);font-weight:600;display:flex;justify-content:space-between;gap:10px;
}
.ipt-ok span{font-weight:400;color:var(--t3);font-family:ui-monospace,Menlo,monospace;font-size:.92em}

/* 联想下拉 */
.sug{display:grid;gap:0;margin:0 -4px}
.sug:empty{display:none}
.sug .sg{
  padding:10px 11px;border-radius:7px;cursor:pointer;display:flex;justify-content:space-between;
  gap:10px;align-items:center;font-size:.92em;transition:.12s;
}
.sug .sg:hover{background:var(--blue-l)}
.sug .sg b{font-weight:500}
.sug .sg span{font-size:var(--fs-xs);color:var(--t3)}

/* ---------------- 小构件 ---------------- */
.chip{
  display:inline-block;padding:3px 8px;border-radius:5px;background:var(--bg);
  font-size:var(--fs-xs);color:var(--t2);margin:3px 4px 0 0;border:1px solid var(--line2);
}
.cl-row{padding:9px 0;border-bottom:1px dashed var(--line2)}
.cl-row:last-child{border-bottom:0;padding-bottom:0}
.cl-h{display:flex;justify-content:space-between;font-size:.92em}
.cl-h span{font-size:var(--fs-xs);color:var(--t3)}
.cl-ex{margin-top:4px}

.ch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(88px,1fr));gap:7px}
.ch-grid .ch{background:var(--bg);border-radius:8px;padding:9px 10px;display:grid;gap:1px}
.ch-grid .ch b{font-size:.9em}
.ch-grid .ch span{font-size:var(--fs-xs);color:var(--t3)}
.ch-grid .ch i{font-size:var(--fs-xs);color:var(--blue-t,var(--blue));font-style:normal}

.own{font-size:var(--fs-xs);font-weight:600;white-space:nowrap}
.own.blue{color:var(--blue-t,var(--blue))}
.own.orange{color:var(--orange)}
.lock{font-size:var(--fs-xs);color:var(--t3);white-space:nowrap}

/* 行内操作按钮（看原文 / 溯源 / 移出 / 不要这行）之前只有 16px 高，
   鼠标要瞄、手指点不准 —— 尤其「移出」「不要这行」这类做错要重来的动作。
   用 padding 撑到 26px 再用负 margin 抵掉，行高不变，点击区变大。 */
.lnk{
  color:var(--blue-t,var(--blue));font-size:var(--fs-s);text-decoration:none;cursor:pointer;white-space:nowrap;
  display:inline-flex;align-items:center;min-height:26px;padding:0 4px;margin:-5px -4px;
  border-radius:4px;
}
.lnk:hover{text-decoration:underline;background:var(--blue-l)}
.lnk.dan{color:var(--dan)}
.lnk.dan:hover{background:var(--dan-l)}

.url{font-family:ui-monospace,Menlo,monospace;font-size:var(--fs-xs);color:var(--t3);word-break:break-all}

.gate-mini{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.gate-mini .g{padding:3px 9px;border-radius:5px;background:var(--ok-l);color:var(--ok);font-size:var(--fs-xs);font-weight:500}

.cover-txt{margin-top:9px;font-size:var(--fs-s);color:var(--t2);line-height:1.7}
.renew-line{margin-top:7px;font-size:var(--fs-xs);color:var(--t3)}
.annex-line{
  font-size:var(--fs-xs);font-weight:700;color:var(--orange);letter-spacing:.02em;
  margin-bottom:7px;padding:6px 9px;background:var(--orange-l);border-radius:6px;display:inline-block;
}

/* 条款 */
.clauses{list-style:none;display:grid;gap:1px}
.clauses li{padding:9px 0;border-bottom:1px dashed var(--line2);cursor:pointer;font-size:.9em;line-height:1.7}
.clauses li:last-child{border-bottom:0}
.clauses li b{display:block;font-weight:600;color:var(--t1)}
.clauses li i{font-style:normal;font-size:var(--fs-xs);color:var(--t3)}
.clauses li.open b{margin-bottom:3px}
.clauses li.open span{color:var(--t2);font-size:.96em}

/* 签名 */
/* 签名区：「清除重签」原来是一整行 722×16 的宽按钮，就横在签名框正下方。
   客户刚签完名，往下一划就点到它 —— 而签名不可恢复。
   改成靠右的小按钮，宽度自适应文字，离签名框远一点。 */
.sign-area{display:grid;gap:8px;grid-template-columns:minmax(0,1fr);padding-bottom:2px}
.sign-area>.lnk{justify-self:end;font-size:var(--fs-xs)}
.sign-box{
  position:relative;border:1px dashed #C9CDD4;border-radius:8px;background:#FCFCFD;
  overflow:hidden;
}
.sign-box canvas{display:block;width:100%;height:auto;touch-action:none}
.sign-ph{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:var(--t3);font-size:.94em;pointer-events:none;
}
.sign-ph.hide{display:none}
/* 「我已阅读并同意」是签字前最后一道自己点的闸，20px 高太挤 ——
   撑到 28px，勾选框也跟着上移对齐 */
.agree-row{
  display:flex;gap:8px;align-items:flex-start;margin-top:7px;padding:4px 0;
  min-height:28px;font-size:var(--fs-s);color:var(--t2);line-height:1.65;cursor:pointer;
}
.cbx{
  flex:none;width:16px;height:16px;border:1.5px solid #C9CDD4;border-radius:4px;margin-top:1px;
  display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff;font-weight:700;
}
.cbx.on{background:var(--blue);border-color:var(--blue-t,var(--blue))}

/* 收款 */
.pay-opts{display:grid;gap:7px}
.pay-opts .po{
  padding:11px 13px;border:1px solid var(--line);border-radius:8px;cursor:pointer;
  font-size:.93em;transition:.12s;position:relative;
}
.pay-opts .po:hover{border-color:#B8C6E8}
.pay-opts .po.on{border-color:var(--blue-t,var(--blue));background:var(--blue-l);font-weight:600}
.pay-opts .po.on::after{content:'✓';position:absolute;right:13px;color:var(--blue-t,var(--blue));font-weight:700}
.done-line{padding:9px 11px;border-radius:7px;font-size:var(--fs-s);font-weight:500}
.done-line.ok{background:var(--ok-l);color:var(--ok)}

/* 方案 */
.plan-goal{font-size:.95em;font-weight:600;margin-bottom:7px}
.plan-kpi{font-size:var(--fs-s);background:var(--blue-l);color:var(--blue-t,var(--blue));padding:7px 10px;border-radius:6px;line-height:1.6}
.plan-kpi b{display:block;font-size:var(--fs-xs);opacity:.75;margin-bottom:1px}
.plan-ul{margin:9px 0 0;padding-left:16px;font-size:var(--fs-s);color:var(--t2);line-height:1.85}
.plan-accept{margin-top:9px;padding-top:8px;border-top:1px dashed var(--line2);font-size:var(--fs-s);color:var(--t2);line-height:1.65}
.plan-accept b{display:block;font-size:var(--fs-xs);color:var(--ok);margin-bottom:1px}

/* 假设 */
.asum{list-style:none;display:grid;gap:6px}
.asum li{display:flex;gap:7px;font-size:var(--fs-s);color:var(--t2);align-items:flex-start}
.cbx-mini{
  flex:none;width:15px;height:15px;border-radius:4px;font-size:10px;font-weight:700;
  display:flex;align-items:center;justify-content:center;color:#fff;margin-top:1px;
}
.asum li.ok .cbx-mini{background:var(--ok)}
.asum li.no .cbx-mini{background:var(--dan)}

.empty{padding:22px;text-align:center;color:var(--t3);font-size:.9em}
.b-note{font-size:var(--fs-s);color:var(--t3);line-height:1.7}

/* ============================================================
   语音输入（三种形态共用同一套组件）
   规则：凡是能打字的地方，右边就必须有一个能说话的按钮。
   ============================================================ */
.ipt.has-mic{padding-right:52px}
.ipt-wrap .mic-btn{
  position:absolute;right:7px;top:50%;transform:translateY(-50%);
  width:34px;height:34px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  background:var(--blue-l);color:var(--blue-t,var(--blue));transition:.15s;cursor:pointer;flex:none;
}
.ipt-wrap .mic-btn:hover{background:#D9E6FF}
.ipt-wrap .mic-btn:active{transform:translateY(-50%) scale(.93)}
.ipt-wrap .mic-btn svg{width:17px;height:17px;display:block}

/* 多行输入：按钮落到右下角，带「语音」两字 */
.ipt-wrap.ta-wrap .ipt{padding-bottom:42px;resize:none;min-height:96px}
.ipt-wrap.ta-wrap .mic-btn{
  top:auto;bottom:9px;transform:none;width:auto;height:28px;padding:0 10px;gap:5px;border-radius:7px;
}
.ipt-wrap.ta-wrap .mic-btn:active{transform:scale(.95)}
.ipt-wrap.ta-wrap .mic-btn .lb{font-size:11.5px;font-weight:600;line-height:1}
.ipt-wrap.ta-wrap .mic-btn svg{width:14px;height:14px}

/* ---- 语音面板 ---- */
.vc-mask{
  position:fixed;inset:0;z-index:9000;background:rgba(15,20,25,.34);
  -webkit-backdrop-filter:blur(1.6px);backdrop-filter:blur(1.6px);
  display:flex;align-items:center;justify-content:center;padding:22px;
  opacity:0;pointer-events:none;transition:opacity .2s;
}
.vc-mask.on{opacity:1;pointer-events:auto}
.vc{
  width:100%;max-width:408px;background:#fff;border-radius:18px;padding:20px 20px 16px;
  box-shadow:0 26px 64px rgba(0,0,0,.32);
  transform:translateY(12px) scale(.975);transition:transform .26s cubic-bezier(.2,.9,.3,1);
}
.vc-mask.on .vc{transform:none}
/* 移动端的两个壳有手机外框：面板要挂在框里，不能跑出屏幕 */
.vc-mask.inphone{position:absolute;inset:0}
.vc-mask.inphone .vc{max-width:none;border-radius:20px 20px 0 0}
/* 移动端：从底部升起来 */
.vc-mask.sheet{align-items:flex-end;padding:0}
.vc-mask.sheet .vc{
  max-width:none;border-radius:20px 20px 0 0;
  padding-bottom:calc(16px + env(safe-area-inset-bottom));
  transform:translateY(100%);
}
.vc-mask.sheet.on .vc{transform:translateY(0)}

.vc-h{display:flex;align-items:center;justify-content:space-between;gap:10px}
.vc-h b{font-size:15px;font-weight:600;display:flex;align-items:center;gap:6px}
.vc-h .tm{font-size:12px;color:var(--t3);font-variant-numeric:tabular-nums}
.vc-dot{width:7px;height:7px;border-radius:50%;background:var(--dan);display:inline-block;
  animation:vcPulse 1.1s infinite}
@keyframes vcPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.8)}}
.vc-sub{font-size:12px;color:var(--t3);margin-top:4px;line-height:1.6}

/* 波形：竖条高度各不同，靠 --h / --d 内联控制。
   用 scaleY 而不是 height —— 静止时也高低错落，不会压成一条线。 */
.vc-wave{display:flex;align-items:center;justify-content:center;gap:3px;height:58px;margin:12px 0}
.vc-wave i{
  display:block;width:3px;height:var(--h,10px);border-radius:2px;background:var(--blue);
  opacity:.55;transform:scaleY(.55);transform-origin:center;transition:transform .2s;
}
.vc-wave.on i{animation:vcWv .86s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
.vc-wave.done i{animation:none;height:5px;transform:none;opacity:.3;background:var(--ok)}
@keyframes vcWv{from{transform:scaleY(.45);opacity:.5}to{transform:scaleY(1);opacity:1}}

/* 实时转写 */
.vc-txt{
  min-height:56px;max-height:132px;overflow:auto;background:var(--bg);border-radius:10px;
  padding:11px 13px;font-size:14.5px;line-height:1.72;color:var(--t1);word-break:break-word;
}
.vc-txt:empty::before{content:'这里会实时显示你说的话';color:var(--t3);font-size:13px}
.vc-txt .cur{display:inline-block;width:1.5px;height:15px;background:var(--blue);
  vertical-align:-2px;margin-left:1px;animation:vcCur .9s steps(2) infinite}
@keyframes vcCur{0%,49%{opacity:1}50%,100%{opacity:0}}
.vc-txt.done{background:var(--ok-l)}
.vc-meta{display:flex;justify-content:space-between;gap:10px;margin-top:7px;font-size:11px;color:var(--t3)}
.vc-btns{display:flex;gap:9px;margin-top:13px}
.vc-btns .btn{flex:1;padding:11px 14px}
.btn.rec{background:var(--dan)}
.btn.rec:hover:not(:disabled){background:#B42318}
.vc-close{position:absolute;right:14px;top:12px;display:none}

/* ---------------- 轻提示（三形态共用） ---------------- */
.sh-toast{
  position:fixed;left:50%;bottom:64px;transform:translate(-50%,14px);
  background:rgba(17,24,39,.94);color:#fff;padding:11px 18px;border-radius:9px;
  font-size:13px;line-height:1.5;max-width:78vw;text-align:center;z-index:9999;
  opacity:0;pointer-events:none;transition:.22s;backdrop-filter:blur(8px);
  box-shadow:0 8px 26px rgba(0,0,0,.28);
}
.sh-toast.on{opacity:1;transform:translate(-50%,0)}

/* ============================================================
   首页 Agent 会话（三形态共用同一套组件）
   ------------------------------------------------------------
   一处实现三端共用：PC 是一条居中窄列，手机上就是全屏聊天。
   差别只在 .ch-dock 吸底时的偏移（要避开 tabbar），
   由各端的 --dock-bottom 给值，组件本身不知道自己在哪个端。
   ============================================================ */
.ch-wrap{display:flex;flex-direction:column;min-height:0;max-width:680px;margin:0 auto;width:100%}

/* 空态：一个大问题 + 三个例子。不留表单，一个字段都不留 */
.ch-hero{flex:1;display:flex;flex-direction:column;justify-content:center;padding:6px 0 30px}
.ch-kicker{font-size:11px;letter-spacing:.06em;color:var(--blue-t,var(--blue));font-weight:600;margin-bottom:8px}
.ch-hero h1{font-size:1.72em;line-height:1.28;font-weight:700;letter-spacing:-.5px}
.ch-hero p{margin-top:10px;color:var(--t2);font-size:.94em;line-height:1.78;max-width:34em}
.ch-ex{display:flex;flex-direction:column;gap:8px;margin-top:17px}
.ch-ex button{
  text-align:left;padding:11px 13px;border:1px solid var(--line);border-radius:9px;background:var(--bg);
  font-size:.9em;color:var(--t2);line-height:1.55;transition:.14s;
}
.ch-ex button:hover{border-color:#B8C6E8;background:var(--blue-l);color:var(--t1)}

/* 消息流 */
.ch-flow{
  flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  display:flex;flex-direction:column;gap:16px;padding:2px 2px 16px;
}
.ch-flow:empty{display:none}
.ch-flow::-webkit-scrollbar{width:0}
.ch-flow{scrollbar-width:none}
.ch-row{display:flex;gap:9px;align-items:flex-start}
.ch-row.me{justify-content:flex-end}
.ch-av{
  flex:none;width:26px;height:26px;border-radius:8px;background:var(--blue);color:#fff;
  font-size:10.5px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:2px;
}
.ch-row.me .ch-bub{
  background:var(--blue);color:#fff;border-radius:14px 14px 3px 14px;
  max-width:78%;padding:10px 14px;font-size:.94em;line-height:1.68;word-break:break-word;
}
.ch-row.ag .ch-bub{
  flex:1;min-width:0;background:#fff;border:1px solid var(--line);
  border-radius:3px 14px 14px 14px;padding:12px 14px;
}
.ch-lead{font-size:.94em;line-height:1.75;color:var(--t1);white-space:pre-wrap;word-break:break-word}
.ch-cur{
  display:inline-block;width:1.5px;height:14px;background:var(--blue);
  vertical-align:-2px;margin-left:2px;animation:chCur .85s steps(2) infinite;
}
@keyframes chCur{0%,49%{opacity:1}50%,100%{opacity:0}}

/* 气泡里的卡：复用白底，靠 1px 分隔线分块，不用再加一层卡片边框 */
.ch-card{margin-top:11px}
.ch-card:first-child{margin-top:0}
.ch-card-h{display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:var(--fs-s);color:var(--t3);margin-bottom:7px}
.ch-kv{display:grid;gap:1px;background:var(--line2);border-radius:8px;overflow:hidden}
.ch-kv .r{display:flex;justify-content:space-between;gap:12px;padding:9px 11px;background:#fff;font-size:var(--fs-s)}
.ch-kv .r>span{color:var(--t3);flex:none;max-width:40%}
.ch-kv .r>b{flex:0 1 auto;min-width:54%;font-weight:500;text-align:right;line-height:1.55;word-break:break-word}
.ch-kv .r>b i{display:block;font-style:normal;font-size:var(--fs-xs);color:var(--t3);font-weight:400;margin-top:1px;white-space:nowrap}
.ch-kv .r.warn{background:var(--warn-l)}
.ch-kv.tight .r{padding:7px 11px}
/* 手机形态：键值行改成上下两行。
   原来左右两列，label 占 40%、右值占 54%，在 300px 的内容宽里两边都不够 ——
   「医疗机构执业许可证」被挤成「…许可 / 证」，右值「只有你口述，没有任何书面凭证 / 待补」
   也跟着右对齐断成三行，读起来要来回跳。

   ★ 这里用 body.ph 而不是 @media(max-width:520px)，是个必须记住的坑：
   APP / 小程序在原型里是「桌面视口里的手机框」——截图脚本用 740px 视口截 390px 的框。
   媒体查询看的是**视口** 740，不是框内 300，所以 max-width 永远不触发，
   本地看着「改了没效果」，真机上又是另一套。凡是按「屏幕窄」写的样式，
   在模拟框里都得换成端级类名，否则测的和你改的不是一回事。 */
body.ph .ch-kv .r{flex-direction:column;align-items:flex-start;gap:2px;padding:8px 11px}
body.ph .ch-kv .r>span{max-width:100%;flex:none;font-size:var(--fs-xs)}
body.ph .ch-kv .r>b{min-width:0;text-align:left;flex:none;width:100%}
body.ph .ch-kv .r>b i{white-space:normal}

.ch-foot{margin-top:9px;font-size:var(--fs-xs);color:var(--t3);line-height:1.68}
.ch-sec{font-size:var(--fs-s);font-weight:600;margin:13px 0 7px;display:flex;align-items:center;gap:5px}
.ch-sec:first-child{margin-top:0}
.ch-sec.ok{color:var(--ok)}
.ch-sec.warn{color:var(--warn)}

/* 采集进度：逐源打勾。转圈糊弄 40 秒是这个行业最招人烦的做法 */
.ch-src{display:grid;gap:1px;background:var(--line2);border-radius:8px;overflow:hidden}
.ch-src .sr{display:flex;align-items:center;gap:9px;padding:8px 11px;background:#fff;font-size:var(--fs-s)}
.ch-src .sr i{flex:none;width:15px;height:15px;border-radius:50%;border:1.4px solid var(--line);
  display:flex;align-items:center;justify-content:center;font-size:9px;font-weight:700;color:#fff;
  font-style:normal;transition:.2s}
.ch-src .sr span{flex:1;color:var(--t2);transition:.2s}
.ch-src .sr b{font-weight:500;font-size:var(--fs-xs);color:var(--t3);font-variant-numeric:tabular-nums}
.ch-src .sr.ok i{background:var(--ok);border-color:var(--ok)}
.ch-src .sr.ok b{color:var(--ok)}
.ch-src .sr.fail i{background:var(--dan);border-color:var(--dan)}
.ch-src .sr.fail b{color:var(--dan)}
.ch-src .sr.wait{opacity:.45}

/* 缺口：每项都说清为什么缺 / 怎么补 / 不补会怎样 */
.ch-gap{padding:11px 12px;border:1px solid var(--line);border-radius:9px;margin-bottom:8px;background:#FCFCFD}
.ch-gap.done{background:var(--ok-l);border-color:transparent}
.ch-gap.skip{background:var(--bg);border-color:transparent;opacity:.72}
.ch-gap .g-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}
.ch-gap .g-h b{font-size:var(--fs-s)}
.ch-gap .g-l{font-size:var(--fs-xs);color:var(--t3);line-height:1.72;margin-top:3px}
.ch-gap .g-l em{font-style:normal;color:var(--t2);font-weight:600;margin-right:5px}
.ch-gap .g-a{display:flex;gap:14px;margin-top:8px}

/* ready：把「接下来发生什么」提前说，别让客户签完不知道等着什么 */
.ch-next-h{font-size:var(--fs-s);color:var(--t2);margin:13px 0 7px;font-weight:600}
.ch-next{list-style:none;display:grid;gap:6px;counter-reset:cn}
.ch-next li{display:flex;gap:9px;align-items:baseline;font-size:var(--fs-s);counter-increment:cn}
.ch-next li::before{
  content:counter(cn);flex:none;width:16px;height:16px;border-radius:5px;background:var(--blue-l);
  color:var(--blue-t,var(--blue));font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;
}
.ch-next li b{flex:none}
.ch-next li span{color:var(--t3)}

.ch-btns{display:flex;gap:8px;margin-top:12px}
.ch-btns .btn{flex:1;padding:10px 14px;font-size:.9em}

/* 输入区：常驻在流末尾。不做 sticky ——
   sticky 会让它浮在消息上面，最后一条永远看不全。
   现在 .ch-wrap 高度由 fitChat 量死，.ch-flow 自己滚，dock 就不动了。 */
.ch-dock{flex:none;padding:8px 0 0}
.ch-in-wrap{
  display:flex;align-items:flex-end;gap:7px;background:#fff;border:1px solid var(--line);
  border-radius:14px;padding:7px 7px 7px 13px;box-shadow:0 4px 16px rgba(17,24,39,.06);transition:.15s;
}
.ch-in-wrap:focus-within{border-color:var(--blue-t,var(--blue));box-shadow:0 0 0 3px rgba(22,93,255,.09)}
.ch-in{
  flex:1;min-width:0;border:0;outline:none;background:none;resize:none;
  font-size:.95em;line-height:1.6;padding:5px 2px 5px 3px;max-height:118px;
  overflow-y:auto;overflow-x:hidden;text-indent:0;
}
.ch-in::placeholder{color:var(--t3)}
.ch-mic{
  flex:none;width:34px;height:34px;border-radius:10px;background:var(--blue-l);color:var(--blue-t,var(--blue));
  display:flex;align-items:center;justify-content:center;transition:.14s;cursor:pointer;
}
.ch-mic:hover{background:#D9E6FF}
.ch-mic svg{width:17px;height:17px;display:block}
.ch-send{
  flex:none;width:34px;height:34px;border-radius:10px;background:var(--blue);color:#fff;
  display:flex;align-items:center;justify-content:center;transition:.14s;cursor:pointer;
}
.ch-send:hover:not(:disabled){background:var(--blue-d)}
.ch-send:disabled{background:#D8DCE3;cursor:not-allowed}
.ch-send svg{width:17px;height:17px;display:block}
.ch-tip{margin-top:7px;font-size:10.5px;color:var(--t3);text-align:center}

/* 语音面板里的演示态标注：一句话说清「这是我们画的，不是必须画的」 */
.vc-demo{
  margin-top:6px;padding:5px 9px;background:var(--bg);border-radius:6px;
  font-size:10.5px;color:var(--t3);line-height:1.55;
}