/* 第二大脑中控台 — 企业蓝（业主 2026-10-26 选定，金蝶式）
   白底、蓝色强调、直角或 ≤4px 圆角、表格紧凑，一屏看得多。只有浅色，不做深色模式。
   断点 900px：以上 = 顶栏搜索 + 左侧固定菜单；以下 = 底部标签栏、搜索收成图标。 */
:root{
  --primary:#1664ff; --primary-hover:#4080ff; --primary-active:#0e42d2; --primary-soft:#e8f3ff;
  --bg:#f0f2f5; --surface:#fff; --surface2:#f7f8fa;
  --ink:#1f2329; --text2:#4e5969; --muted:#86909c;
  --line:#e5e6eb; --line2:#f2f3f5;
  --ok:#00b42a; --ok-soft:#e8ffea; --crit:#f53f3f; --crit-soft:#ffece8;
  --warn:#d25f00; --warn-soft:#fff7e8; --warn-line:#ffe4ba;
  --r:4px; --r-sm:2px;
  --top-h:48px; --side-w:208px; --tab-h:56px;
  --shadow:0 4px 10px rgba(0,0,0,.08);
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;
  --mono:"SF Mono",ui-monospace,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;max-width:100%;overflow-x:hidden}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.5;
  -webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font-variant-numeric:tabular-nums}
a{color:var(--primary);text-decoration:none}
a:hover{color:var(--primary-hover)}
[hidden]{display:none!important}
.ico{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mono{font-family:var(--mono);font-size:12px}
.note{color:var(--muted);font-size:12px}
.ok{color:var(--ok)} .bad{color:var(--crit)} .dim{color:var(--muted)}

/* ---------- 顶栏 ---------- */
.topbar{position:fixed;top:0;left:0;right:0;z-index:30;height:var(--top-h);display:flex;align-items:center;gap:16px;
  padding:0 16px 0 0;background:var(--surface);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:8px;width:var(--side-w);flex:none;height:100%;padding:0 16px;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand b{font-size:16px;font-weight:600;white-space:nowrap;letter-spacing:.01em}
.mark{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex:none;border-radius:var(--r);
  background:var(--primary);color:#fff;font-size:13px;font-weight:700;line-height:1}
.search{position:relative;flex:1;max-width:360px;height:32px;display:flex;align-items:center;gap:6px;padding:0 10px;
  background:var(--surface2);border:1px solid var(--line);border-radius:var(--r);color:var(--muted);transition:border-color .15s,background .15s}
.search:focus-within{border-color:var(--primary);background:var(--surface)}
.search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:transparent;font:inherit;font-size:13px;color:var(--ink)}
.search input::placeholder{color:var(--muted)}
.search input::-webkit-search-cancel-button{display:none}
.search-close{display:none}
.search-drop{position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:60vh;overflow:auto;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);z-index:5}
.search-drop a{display:block;padding:8px 12px;color:var(--ink);border-bottom:1px solid var(--line2)}
.search-drop a:hover,.search-drop a.on{background:var(--primary-soft)}
.search-drop small{display:block;color:var(--muted);font-size:12px}
.iconbtn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border:0;
  background:transparent;color:var(--text2);border-radius:var(--r);cursor:pointer}
.iconbtn .ico{width:20px;height:20px}
.search-toggle{display:none}
.top-right{margin-left:auto;display:flex;align-items:center;gap:12px;min-width:0}
.extlinks{display:flex;gap:4px}
.extlinks a{font-size:13px;padding:4px 8px;border-radius:var(--r);color:var(--text2)}
.extlinks a:hover{background:var(--surface2);color:var(--primary)}
.userbox{display:flex;align-items:center;gap:12px}
.wallet{font-size:12px;color:var(--text2);background:var(--surface2);border:1px solid var(--line);border-radius:var(--r);
  padding:3px 8px;white-space:nowrap}
.usermenu{position:relative}
.usermenu summary{display:flex;align-items:center;gap:6px;height:40px;padding:0 4px;cursor:pointer;list-style:none;color:var(--text2);user-select:none}
.usermenu summary::-webkit-details-marker{display:none}
.usermenu summary:hover{color:var(--ink)}
.avatar{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;
  background:var(--primary-soft);color:var(--primary);font-weight:600;font-size:13px;flex:none}
.uname{max-width:140px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.caret{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.usermenu .menu{position:absolute;right:0;top:calc(100% + 4px);min-width:200px;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);box-shadow:var(--shadow);padding:4px 0;z-index:5}
.menu-hd{padding:8px 14px 10px;border-bottom:1px solid var(--line2);margin-bottom:4px}
.menu-hd b{display:block;font-weight:600}
.menu-hd small{display:block;color:var(--muted);font-size:12px}
.usermenu .menu a{display:flex;align-items:center;height:36px;padding:0 14px;color:var(--ink)}
.usermenu .menu a:hover{background:var(--surface2)}
.usermenu .menu a.danger{color:var(--crit)}

/* ---------- 左侧菜单（≥900px） ---------- */
.sidenav{position:fixed;top:var(--top-h);bottom:0;left:0;width:var(--side-w);z-index:20;overflow-y:auto;
  background:var(--surface);border-right:1px solid var(--line);padding:8px 0}
.sidenav a{display:flex;align-items:center;gap:10px;height:40px;padding:0 20px;color:var(--text2);font-size:14px}
.sidenav a:hover{color:var(--ink);background:var(--surface2)}
.sidenav a.on{color:var(--primary);background:var(--primary-soft);font-weight:600;box-shadow:inset 3px 0 0 var(--primary)}
.tabbar{display:none}

/* ---------- 版心 ---------- */
main{margin-left:var(--side-w);padding:calc(var(--top-h) + 16px) 20px 32px;min-width:0}
.hd{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;margin:0 0 12px}
.hd h2{margin:0;font-size:18px;font-weight:600;color:var(--ink)}
.hd .actions{margin-left:auto;display:flex;gap:8px;flex-wrap:wrap}
.crumb{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:0 0 12px;font-size:13px;color:var(--muted)}
.crumb a{color:var(--text2)} .crumb a:hover{color:var(--primary)}
.crumb b{color:var(--ink);font-weight:600}
.empty{padding:40px 16px;text-align:center;color:var(--muted)}
.empty .btn{margin-top:12px}
.loading{padding:32px 16px;text-align:center;color:var(--muted)}

/* ---------- 提醒条 / 指标 / 面板 ---------- */
.alert{display:flex;align-items:flex-start;gap:8px;padding:8px 12px;margin:0 0 12px;border:1px solid var(--warn-line);
  background:var(--warn-soft);color:var(--warn);border-radius:var(--r);font-size:13px}
.alert a{color:inherit;text-decoration:underline}
.alert.err{background:var(--crit-soft);border-color:#fdcdc5;color:var(--crit)}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 12px}
.kpi{background:var(--surface);border-radius:var(--r);padding:12px 16px;min-width:0}
.kpi i{display:block;font-style:normal;font-size:12px;color:var(--muted)}
.kpi b{display:block;font-size:24px;font-weight:600;line-height:1.3;color:var(--ink)}
.kpi small{color:var(--muted);font-size:12px;margin-left:2px}
.panel{background:var(--surface);border-radius:var(--r);margin:0 0 12px;min-width:0}
.panel .ph{display:flex;align-items:center;gap:8px;height:44px;padding:0 16px;border-bottom:1px solid var(--line);font-weight:600}
.panel .ph .actions{margin-left:auto;display:flex;gap:8px}
.panel .pb{padding:12px 16px}
.panel .pb.flush{padding:0}

/* ---------- 表格（紧凑） ---------- */
.tabwrap{background:var(--surface);border-radius:var(--r);overflow:auto}
.panel .tabwrap{border-radius:0}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:8px 12px;font-size:13px;vertical-align:top}
th{background:var(--surface2);color:var(--text2);font-weight:500;border-bottom:1px solid var(--line);white-space:nowrap}
td{border-bottom:1px solid var(--line2)}
tbody tr:last-child td{border-bottom:0}
tbody tr:hover{background:var(--surface2)}
tr.clickable{cursor:pointer}
td.mono{white-space:nowrap}

/* ---------- 标签 / 按钮 / 表单 ---------- */
.chip{display:inline-block;font-size:12px;line-height:20px;padding:0 6px;border-radius:var(--r-sm);white-space:nowrap;
  background:var(--surface2);color:var(--text2);border:1px solid var(--line)}
.chip.in{background:var(--primary-soft);color:var(--primary);border-color:#bedaff}
.chip.out,.chip.ok{background:var(--ok-soft);color:var(--ok);border-color:#aff0b5}
.chip.bad{background:var(--crit-soft);color:var(--crit);border-color:#fdcdc5}
.chip.warn{background:var(--warn-soft);color:var(--warn);border-color:var(--warn-line)}
.dot::before{content:"●";margin-right:4px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 15px;border:1px solid var(--primary);
  border-radius:var(--r);background:var(--primary);color:#fff;font:inherit;font-size:14px;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--primary-hover);border-color:var(--primary-hover);color:#fff}
.btn:active{background:var(--primary-active);border-color:var(--primary-active)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{background:var(--surface);color:var(--primary);border-color:var(--primary)}
.btn-sm{height:28px;padding:0 10px;font-size:13px}
.btn-block{display:flex;width:100%}
input,select,textarea{font:inherit;color:var(--ink)}
.field,.login-card input:not([type=checkbox]),.modal-card input{display:block;width:100%;height:36px;padding:0 10px;margin:0 0 14px;
  border:1px solid var(--line);border-radius:var(--r);background:var(--surface);font-size:14px;outline:0;transition:border-color .15s}
.field:hover,.login-card input:not([type=checkbox]):hover,.modal-card input:hover{border-color:#c9cdd4}
.field:focus,.login-card input:not([type=checkbox]):focus,.modal-card input:focus{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-soft)}
select.field{width:auto;display:inline-block;margin:0}

/* ---------- 消息正文（core.js 的 msgBody 产出这些 class） ---------- */
.wxpic{max-width:200px;max-height:200px;border-radius:var(--r);border:1px solid var(--line);cursor:zoom-in;display:block}
.voice .vtag{font-weight:400;font-size:12px;color:var(--muted);margin-left:4px}
.uncap{color:var(--muted);cursor:help}

/* ---------- 登录 ---------- */
#login{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:16px;overflow-y:auto;
  background:linear-gradient(180deg,var(--primary) 0,var(--primary) 36%,var(--bg) 36%)}
.login-card{width:min(400px,100%);background:var(--surface);border-radius:var(--r);padding:32px 32px 24px;box-shadow:0 8px 24px rgba(0,0,0,.12)}
.login-brand{display:flex;align-items:center;gap:10px;margin:0 0 24px}
.login-brand .mark{width:36px;height:36px;font-size:18px}
.login-brand b{display:block;font-size:18px;font-weight:600;line-height:1.3}
.login-brand small{display:block;font-size:12px;color:var(--muted)}
.login-card h2{margin:0 0 4px;font-size:20px;font-weight:600}
.login-card p{margin:0 0 20px;font-size:13px;color:var(--muted)}
.login-card label,.modal-card label{display:block;font-size:13px;color:var(--text2);margin:0 0 6px}
.login-card .btn{height:40px;font-size:15px;margin-top:4px}
.lremember{display:flex!important;align-items:center;gap:6px;margin:0 0 14px!important;cursor:pointer}
.lremember input{width:16px;height:16px;margin:0;accent-color:var(--primary)}
.login-err{color:var(--crit);min-height:20px;margin-top:8px;font-size:13px}
.login-alt{margin-top:8px;border-top:1px solid var(--line2);padding-top:12px}
.login-alt summary{cursor:pointer;color:var(--text2);font-size:13px;margin-bottom:12px;list-style:none}
.login-alt summary::-webkit-details-marker{display:none}
.login-alt summary::before{content:"▸ ";color:var(--muted)}
.login-alt[open] summary::before{content:"▾ "}
.wxqr{display:flex;justify-content:center;padding:4px 0 8px;min-height:150px}
.wxqr img,.wxqr svg{width:220px;height:220px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:var(--r);image-rendering:pixelated}
.wxstat{text-align:center;font-size:13px;color:var(--muted);min-height:20px;margin-bottom:6px}
.wxstat .mono{display:inline-block;margin-top:4px;padding:2px 8px;background:var(--surface2);border-radius:var(--r)}
.login-foot{margin-top:16px;font-size:12px;color:var(--muted);text-align:center}

/* ---------- 弹窗 ---------- */
.modal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(29,33,41,.45)}
.modal-card{width:min(400px,100%);background:var(--surface);border-radius:var(--r);padding:20px 24px 24px;box-shadow:0 8px 24px rgba(0,0,0,.16)}
.modal-card h3{margin:0 0 16px;font-size:16px;font-weight:600}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:8px}

/* ---------- 页面公共（pages-*.js） ---------- */
.only-narrow{display:none}
.hd .note{color:var(--muted)}
.panel .ph .note{margin-left:auto;font-weight:400}
.st{display:inline-flex;align-items:center;gap:5px;font-size:13px;white-space:nowrap}
.st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.st-ok{color:var(--ok)} .st-bad{color:var(--crit)} .st-warn{color:var(--warn)} .st-dim{color:var(--muted)}
td.go{text-align:right;white-space:nowrap}
.who{color:var(--text2);margin-right:6px}
.grp{display:inline-block;font-size:11px;line-height:16px;padding:0 4px;margin-right:5px;border-radius:var(--r-sm);font-weight:400;
  background:var(--surface2);border:1px solid var(--line);color:var(--text2);vertical-align:1px}
.linkbtn{border:0;background:none;padding:2px 4px;color:var(--primary);font:inherit;font-size:12px;cursor:pointer;flex:none}
.linkbtn:hover{color:var(--primary-hover)}
.danger,.linkbtn.danger,.btn-ghost.danger{color:var(--crit)}
.kv{display:flex;align-items:baseline;gap:8px;font-size:13px;padding:4px 0}
.kv>span{flex:none;width:56px;color:var(--muted)}
.kv b{font-weight:500;word-break:break-all}
.kv small{color:var(--muted);font-size:12px}
.kvs .kv{padding:8px 0;border-bottom:1px solid var(--line2)} .kvs .kv:last-child{border-bottom:0}
.clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word}
td .clamp{max-width:560px}

/* 渠道色标（业主定：微信绿、电话蓝、短信紫、WhatsApp 青、飞书蓝） */
.ch-wx{--ch:#00b42a} .ch-tel{--ch:#1664ff} .ch-sms{--ch:#722ed1} .ch-wa{--ch:#14c9c9} .ch-feishu{--ch:#3370ff}
.tag{display:inline-flex;align-items:center;height:20px;padding:0 6px;border-radius:var(--r-sm);font-size:12px;line-height:1;
  color:#fff;white-space:nowrap;background:var(--ch,var(--muted));flex:none}
.chd{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--ch,var(--muted));margin-right:6px;vertical-align:1px}

/* 首页：提醒条 / 四个数 */
.alert .ico{width:16px;height:16px;margin-top:2px}
.alert b{margin-right:10px}
.alert-items>*{display:inline}
.alert-items>*+*::before{content:"·";display:inline-block;margin:0 8px;color:var(--muted)}
.alert-items .crit{color:var(--crit)} .alert-items .warn{color:var(--warn)}
a.kpi{display:block;color:inherit} a.kpi:hover{color:inherit;box-shadow:inset 0 0 0 1px var(--primary)}
.kpi b small{font-size:13px;font-weight:400}

/* 团队：手机上的紧凑卡片 */
.tcard{display:block;padding:10px 12px;min-height:44px;border-bottom:1px solid var(--line2);color:var(--ink)}
.tcard:last-child{border-bottom:0}
.tcard:hover,.tcard:active{background:var(--surface2);color:var(--ink)}
.tcard .l1{display:flex;align-items:center;gap:8px}
.tcard .l1 b{font-size:15px;font-weight:600;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tcard .l1 .st{margin-left:auto;font-size:12px}
.tcard .l2{display:block;margin-top:2px;font-size:12px;color:var(--muted)}

/* 三栏客户页 */
.crumb-stat{margin-left:8px;color:var(--muted)}
.cols{display:grid;grid-template-columns:280px minmax(0,1fr) 272px;height:calc(100vh - var(--top-h) - 112px);min-height:420px;
  background:var(--surface);border-radius:var(--r);overflow:hidden}
.col{display:flex;flex-direction:column;min-width:0;min-height:0;border-right:1px solid var(--line)}
.col:last-child{border-right:0}
.col-hd{flex:none;padding:10px 12px;border-bottom:1px solid var(--line)}
.col-hd .field{margin:0;height:32px;font-size:13px}
.pfilters{display:flex;gap:6px;margin-top:8px}
.pfilters:empty{display:none}
.col-hd .pfilters select.field{flex:1 1 0;min-width:0;height:28px;padding:0 4px;font-size:12px;color:var(--text2)}
.col-bd{flex:1;min-height:0;overflow-y:auto}
.col-note{padding:10px 12px;font-size:12px;color:var(--muted);text-align:center}
.pitem{display:block;padding:9px 12px;border-bottom:1px solid var(--line2);color:var(--ink)}
.pitem:hover{background:var(--surface2);color:var(--ink)}
.pitem.on{background:var(--primary-soft);box-shadow:inset 3px 0 0 var(--primary)}
.pitem .l1{display:flex;align-items:baseline;gap:8px}
.pitem .l1 b{flex:1;min-width:0;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pitem time{flex:none;font-size:12px;color:var(--muted)}
.pitem .l2{display:block;margin-top:2px;font-size:12px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pitem .l3{display:block;margin-top:1px;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.empty.pick{padding-top:80px}
.tl-hd{display:flex;align-items:baseline;gap:12px;padding:11px 16px}
.tl-hd:empty{display:none}
.tl-hd b{font-size:15px;font-weight:600}
.tl-hd .tl-count{margin-left:auto}
.col-tl .col-bd{padding:12px 16px;background:var(--surface2)}
.tl-item{max-width:80%;margin:0 0 12px}
.tl-item.me{margin-left:auto}
.tl-meta{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;margin:0 0 4px;font-size:12px;color:var(--muted)}
.tl-item.me .tl-meta{justify-content:flex-end}
.tl-meta .who{margin:0}
.tl-body{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:8px 12px;word-break:break-word}
.tl-item.me .tl-body{background:var(--primary-soft);border-color:#bedaff}
.tr-line{margin:2px 0}
.spk{font-weight:600;color:var(--text2)} .spk-1{color:var(--primary)} .spk-2{color:var(--ok)}
.tr-more summary{cursor:pointer;color:var(--primary);font-size:12px;margin-top:4px;list-style:none}
.tr-more summary::-webkit-details-marker{display:none}
.tr-more[open] summary{display:none}
.info-sec{padding:14px 16px;border-bottom:1px solid var(--line2)}
.info-sec:last-child{border-bottom:0}
.info-name{font-size:16px;font-weight:600;margin:0 0 6px;word-break:break-all}
.info-sec h4{margin:0 0 6px;font-size:12px;font-weight:500;color:var(--muted)}
.info-sec .note{margin:8px 0 0}
.idents{list-style:none;margin:0;padding:0}
.idents li{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13px;border-bottom:1px dashed var(--line2)}
.idents li:last-child{border-bottom:0}
.idents .k{flex:none;width:60px;color:var(--muted);font-size:12px}
.idents .v{flex:1;min-width:0;word-break:break-all;font-family:var(--mono);font-size:12px}
#pinfoerr:empty{display:none}
.split-ask{flex:none;font-size:12px;color:var(--text2);white-space:nowrap}
.info-toggle,.info-back{display:none}
.merge-card{width:min(440px,100%);max-height:calc(100vh - 32px);display:flex;flex-direction:column}
.merge-card .note{margin:-8px 0 0}
.merge-card input.field{margin:12px 0 8px}
.merge-list{flex:1;min-height:120px;max-height:50vh;overflow-y:auto;border:1px solid var(--line);border-radius:var(--r)}
.mitem{display:flex;align-items:center;gap:10px;padding:8px 12px;min-height:44px;border-bottom:1px solid var(--line2);cursor:pointer}
.mitem:last-child{border-bottom:0}
.merge-card label.mitem{display:flex;margin:0;font-size:14px;color:var(--ink)}
.mitem:hover{background:var(--surface2)}
.merge-card .mitem input{display:inline-block;flex:none;width:16px;height:16px;margin:0;padding:0;accent-color:var(--primary)}
.mitem b{display:block;font-weight:500} .mitem small{display:block;font-size:12px;color:var(--muted)}
/* 窄电脑（900–1199px）：两栏，客户简介点「简介」才换上来 */
@media (min-width:900px) and (max-width:1199.98px){
  .cols{grid-template-columns:260px minmax(0,1fr)}
  .col-info,.ppl.show-info .col-tl{display:none}
  .ppl.show-info .col-info{display:flex}
  .info-toggle{display:inline-flex}
  .info-back{display:block;margin:10px 12px 0}
}

/* 沟通记录 / 设备 / 设置 */
.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 0 12px}
.tabs button{height:36px;padding:0 14px;margin-bottom:-1px;border:0;border-bottom:2px solid transparent;background:none;
  font:inherit;color:var(--text2);cursor:pointer}
.tabs button.on{color:var(--primary);border-bottom-color:var(--primary);font-weight:600}
.filters{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 12px}
.filters .field{margin:0;height:32px;font-size:13px}
.filters input.field{flex:1;min-width:160px;max-width:280px}
.ccard{display:block;padding:10px 12px;border-bottom:1px solid var(--line2);color:var(--ink)}
.ccard:last-child{border-bottom:0}
a.ccard:active{background:var(--surface2)}
.ccard .l1{display:flex;align-items:center;gap:8px}
.ccard .l1 b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.ccard time{flex:none;font-size:12px;color:var(--muted)}
.ccard .l2{display:-webkit-box;margin-top:4px;font-size:13px;color:var(--text2)}
.ccard .l2:not(.clamp){display:block}
.ccard .l3{display:block;margin-top:2px;font-size:12px;color:var(--muted)}
.aform{max-width:360px}
.aform label{display:block;font-size:13px;color:var(--text2);margin:0 0 6px}
.sd-empty{padding:12px;color:var(--muted);font-size:13px}
.search-drop b{font-weight:500}

/* ---------- 手机（<900px）：底部标签栏、搜索收成图标、表格变卡片 ---------- */
@media (max-width:899.98px){
  .topbar{gap:4px;padding:0 4px 0 0}
  .brand{width:auto;flex:1;min-width:0;padding:0 12px}
  .brand b{font-size:16px;overflow:hidden;text-overflow:ellipsis}
  .search{display:none}
  .search-toggle{display:inline-flex}
  .wallet,.uname,.caret,.extlinks{display:none}
  .usermenu summary{width:40px;justify-content:center;padding:0}
  .usermenu .menu{position:fixed;top:var(--top-h);right:8px;left:auto;min-width:220px}
  .usermenu .menu a{height:44px}
  /* 点了搜索：搜索框铺满顶栏，盖住品牌和按钮 */
  body.searching .top-right,body.searching .search-toggle{visibility:hidden}
  body.searching .search{display:flex;position:absolute;z-index:2;left:8px;right:8px;top:6px;max-width:none;height:36px;
    border-color:var(--primary);background:var(--surface);padding-right:0}
  body.searching .search input{font-size:16px}       /* <16px 时安卓/iOS 会自动放大页面 */
  body.searching .search-close{display:inline-flex;align-items:center;height:100%;padding:0 12px;border:0;background:transparent;
    color:var(--primary);font:inherit;font-size:14px;cursor:pointer}
  body.searching .search-drop{position:fixed;top:var(--top-h);left:0;right:0;max-height:calc(100vh - var(--top-h) - var(--tab-h));
    border-radius:0;border-width:1px 0}
  body.searching .search-drop a{padding:12px 16px}
  .sidenav{display:none}
  .tabbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--line);
    padding-bottom:env(safe-area-inset-bottom)}
  .tabbar a{flex:1;min-width:0;height:var(--tab-h);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    color:var(--muted);font-size:11px}
  .tabbar a .ico{width:22px;height:22px}
  .tabbar a.on{color:var(--primary);font-weight:600}
  main{margin-left:0;padding:calc(var(--top-h) + 12px) 12px calc(var(--tab-h) + 16px + env(safe-area-inset-bottom))}
  .hd h2{font-size:17px}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .kpi{padding:10px 12px}
  .kpi b{font-size:20px}
  .panel .ph{padding:0 12px}
  .panel .pb{padding:12px}
  .btn{height:40px}
  .btn-sm{height:36px}
  .field,.login-card input:not([type=checkbox]),.modal-card input{height:44px;font-size:16px}
  .login-card{padding:24px 20px 20px}
  .login-card .btn,.modal-actions .btn{height:44px}
  .modal-actions .btn{flex:1}
  /* 表格 → 卡片：窄屏每条记录一张卡，单元格是「列名: 值」（列名来自 tableHTML 注入的 data-label） */
  .tabwrap{overflow:visible;background:transparent}
  .tabwrap table,.tabwrap tbody,.tabwrap tr,.tabwrap td{display:block;width:auto}
  .tabwrap thead{display:none}
  .tabwrap tbody tr{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);margin:0 0 8px;padding:8px 12px}
  .tabwrap tbody tr:hover{background:var(--surface)}
  .tabwrap tbody tr:last-child td{border:0}
  .tabwrap td{border:0;padding:3px 0;display:flex;gap:10px;white-space:normal;word-break:break-word}
  .tabwrap td::before{content:attr(data-label);flex:none;width:64px;color:var(--muted);font-size:12px}
  .tabwrap td:empty{display:none}
  .wxpic{max-width:100%}
  /* 页面（pages-*.js）：只显示窄屏那份；三栏变一步一步 */
  .only-wide{display:none}
  .only-narrow{display:block}
  .pbar.only-narrow{display:flex}
  .pbar{align-items:center;gap:4px;position:sticky;top:var(--top-h);z-index:10;height:48px;margin:-12px -12px 0;padding:0 12px 0 4px;
    background:var(--surface);border-bottom:1px solid var(--line)}
  .pbar>b:first-child{padding-left:8px}
  .pbar b{flex:1;min-width:0;font-size:16px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .pbar small{color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}
  .pbar .iconbtn .ico{width:22px;height:22px}
  .pbar .btn{height:32px}
  .cols{display:block;height:auto;min-height:0;background:transparent;border-radius:0;overflow:visible}
  .col{border:0}
  .col-tl,.col-info,.ppl.has-key .col-list,.ppl.show-info .col-tl{display:none}
  .ppl.has-key .col-tl,.ppl.show-info .col-info{display:flex}
  .ppl.show-info .col-tl{display:none}
  .col-list .col-hd{padding:12px 0 8px;border:0}
  .col-hd .field{height:40px;font-size:16px}
  .col-list .col-bd,.col-info .col-bd{background:var(--surface);border-radius:var(--r);overflow:visible}
  .col-info .col-bd{margin-top:12px}
  .pitem{padding:10px 12px}
  .pitem .l1 b{font-size:15px}
  .pitem .l3{display:none}
  .col-hd .pfilters select.field{height:36px;font-size:16px}
  .col-tl .col-bd{padding:12px 0 0;background:transparent;overflow:visible}
  .tl-item{max-width:88%}
  .filters .field,.filters select.field{flex:1 1 40%;min-width:0;height:40px;font-size:16px}
  .filters input.field{flex:1 1 100%;max-width:none}
  .filters .btn{flex:1 1 100%}
  .panel>.only-narrow>.ccards,.panel .tcards{background:var(--surface)}
  .tabs button{flex:1}
  .alert-items{display:block;margin-top:2px}
  .alert-items>*{display:block}
  .alert-items>*+*::before{display:none}
  .kvs .kv{padding:10px 0}
  .aform{max-width:none}
}
