/* =========================================================
   肥西欧派装饰 · 验房管家后台 v1.3
   双模式渲染：≥768px 桌面高密度表格 / 窄屏卡片视图（同一套代码）
   ========================================================= */
:root{
  --red:#E64545; --red-d:#C93B3B; --org:#F97316; --gold:#F59E0B;
  --grad:linear-gradient(135deg,#E64545,#F97316);
  --bg:#F5F6F8; --panel:#ffffff; --bd:#E8EAED; --bd2:#EFF1F3;
  --t1:#111827; --t2:#6B7280; --t3:#9CA3AF;
  --blue:#3B82F6; --green:#16A34A; --purple:#7C3AED; --teal:#0D9488;
  --r:12px; --r-lg:16px;
  --shadow:0 1px 3px rgba(17,24,39,.05),0 1px 2px rgba(17,24,39,.04);
  --shadow-lg:0 6px 28px rgba(17,24,39,.12);
  --tabbar-h:58px;
  --safe-b:env(safe-area-inset-bottom,0px);
}
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg); color:var(--t1); font-size:14px; line-height:1.6;
  -webkit-font-smoothing:antialiased; -webkit-tap-highlight-color:transparent;
}
.hidden{display:none !important}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
img{max-width:100%;display:block}

/* ---------- 工具类 ---------- */
.muted{color:var(--t3)} .small{font-size:12px} .strong{font-weight:600}
.nowrap{white-space:nowrap} .ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.text-right{text-align:right} .text-center{text-align:center}
.flex{display:flex;align-items:center} .between{justify-content:space-between}
.gap4{gap:4px} .gap8{gap:8px} .gap12{gap:12px}
.mt4{margin-top:4px} .mt8{margin-top:8px} .mt12{margin-top:12px} .mt16{margin-top:16px} .mt24{margin-top:24px}
.wrap{flex-wrap:wrap}

/* =========================================================
   登录页（v2.2 原型 #screen-login：顶部品牌区 + 白卡 + 底部脚注）
   ========================================================= */
.login-page{
  position:fixed;inset:0;z-index:300;overflow-y:auto;
  background:var(--grad);display:flex;flex-direction:column;align-items:center;
  padding:0 28px 40px;
}
.lg-hero{flex:0 0 auto;width:100%;max-width:420px;padding:86px 4px 12px;color:#fff}
.lg-hero h1{font-size:26px;letter-spacing:1px;margin-top:26px;font-weight:700}
.lg-hero p{margin-top:8px;font-size:13px;opacity:.85}
.lg-card{
  width:100%;max-width:420px;flex:0 0 auto;
  background:#fff;border-radius:20px;padding:26px 22px;
  box-shadow:0 18px 50px rgba(120,20,20,.25);
}
.lg-card h2{font-size:17px;margin-bottom:18px;font-weight:700}
.lg-field{margin-bottom:14px}
.lg-field label{display:block;font-size:12px;color:var(--t2);margin-bottom:6px}
.lg-field input{
  width:100%;height:46px;border:1.5px solid var(--bd);border-radius:12px;
  padding:0 14px;font-size:15px;background:#FAFBFC;
  transition:border-color .15s,background .15s;
}
.lg-field input:focus{outline:none;border-color:#E64545;background:#fff}
.lg-btn{
  width:100%;height:48px;border:none;border-radius:12px;cursor:pointer;
  background:var(--grad);color:#fff;font-size:16px;font-weight:600;letter-spacing:2px;
  margin-top:6px;box-shadow:0 6px 18px rgba(230,69,69,.35);
}
.lg-btn:active{transform:scale(.98)}
.login-error{color:#E64545;font-size:12px;margin-top:8px;min-height:16px;text-align:center}
.lg-foot{text-align:center;color:rgba(255,255,255,.75);font-size:11px;margin-top:auto;padding-top:18px;width:100%;max-width:420px}

/* =========================================================
   按钮
   ========================================================= */
.btn-primary,.btn-ghost,.btn-danger,.btn-mini{
  border:none;border-radius:10px;font-size:14px;font-weight:600;
  padding:0 18px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  transition:opacity .15s,transform .05s;white-space:nowrap;
}
.btn-primary{background:var(--grad);color:#fff}
.btn-ghost{background:#f3f4f6;color:var(--t2)}
.btn-danger{background:#fee2e2;color:var(--red)}
.btn-mini{height:32px;padding:0 12px;font-size:13px;border-radius:8px}
.btn-block{width:100%}
.btn-primary:active,.btn-ghost:active,.btn-danger:active,.btn-mini:active{transform:scale(.98)}
.btn-primary:disabled{opacity:.6}
.btn-link{background:none;border:none;color:var(--red);font-size:13px;font-weight:600;padding:6px 4px}

/* =========================================================
   主布局
   ========================================================= */
.app{display:flex;min-height:100vh}

/* ---------- 侧边栏 ---------- */
.sidebar{
  width:224px;flex:0 0 224px;background:#fff;border-right:1px solid var(--bd);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.sidebar-brand{display:flex;align-items:center;gap:10px;padding:18px 18px 14px;border-bottom:1px solid var(--bd2)}
.sb-logo{width:38px;height:38px;border-radius:11px;background:var(--grad);color:#fff;font-size:19px;font-weight:800;display:flex;align-items:center;justify-content:center}
.sb-title{font-size:14px;font-weight:700}
.sb-sub{font-size:11px;color:var(--t3)}
.menu{flex:1;padding:10px 10px;overflow-y:auto}
.nav-item{
  display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:10px;
  font-size:14px;color:var(--t2);margin-bottom:2px;cursor:pointer;
}
.nav-item:hover{background:#f9fafb}
.nav-item.active{background:#fef2f2;color:var(--red);font-weight:600}
.sidebar-footer{padding:12px 14px;border-top:1px solid var(--bd2)}
.user-info{margin-bottom:8px}
.user-name{font-size:13.5px;font-weight:600}
.user-role{font-size:11.5px;color:var(--t3)}
.sidebar-actions{display:flex;flex-direction:column;gap:2px}
.nav-item-link{font-size:12.5px;color:var(--t2);padding:6px 8px;border-radius:8px;cursor:pointer}
.nav-item-link:hover{background:#f9fafb;color:var(--red)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}

/* ---------- 顶栏 ---------- */
.topbar{
  position:sticky;top:0;z-index:30;background:rgba(255,255,255,.94);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--bd);height:56px;display:flex;align-items:center;gap:12px;padding:0 20px;
}
.topbar h2{font-size:16px;font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topbar-right{display:flex;align-items:center;gap:14px}
.topbar-link{font-size:13px;color:var(--t2);cursor:pointer}
.topbar-user{font-size:13px;font-weight:600}
.tb-avatar{
  display:none;width:32px;height:32px;border-radius:50%;background:var(--grad);color:#fff;
  font-size:13px;font-weight:700;border:none;align-items:center;justify-content:center;cursor:pointer;
}
.hamburger{display:none;width:36px;height:36px;border:none;background:none;flex-direction:column;justify-content:center;gap:4px;padding:0}
.hamburger span{display:block;height:2px;background:var(--t1);border-radius:2px;width:20px}

/* --cp 历史上同时被用作「内容内边距」和 v2.2 紫色令牌(#7C3AED)，在 .cust-page 作用域内会被紫色覆盖。
   这里补一个不会被覆盖的别名 --cpad 供需要读取真实内边距的规则使用（如 .cust-page 的负边距抵消）。 */
.content{padding:var(--cpad,var(--cp,20px));flex:1}

/* =========================================================
   卡片 / 通用块
   ========================================================= */
.card{background:var(--panel);border-radius:var(--r);box-shadow:var(--shadow);padding:18px 20px;margin-bottom:14px}
.card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.card-title{font-size:15px;font-weight:600}
.card-sub{font-size:12px;color:var(--t3)}
.empty{padding:44px 16px;text-align:center;color:var(--t3);font-size:14px}
.loading{padding:50px 16px;text-align:center;color:var(--t3);font-size:14px}
.alert-danger{background:#fef2f2;border:1px solid #fecaca;border-radius:10px;padding:14px 16px;color:var(--red);font-size:14px;line-height:1.6}
.confirm-msg{font-size:14px;color:var(--t2);line-height:1.7}
.divider{height:1px;background:var(--bd2);margin:14px 0}

/* ---------- 统计条 ---------- */
.kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:14px}
.kpi{background:#fff;border-radius:var(--r-lg);padding:13px 14px;box-shadow:var(--shadow)}
.kpi.red .kpi-v{color:var(--red)} .kpi.blue .kpi-v{color:var(--blue)}
.kpi.green .kpi-v{color:var(--green)} .kpi.org .kpi-v{color:var(--org)}
.kpi.purple .kpi-v{color:var(--purple)} .kpi.gray .kpi-v{color:var(--t3)}
.kpi.hot .kpi-v{color:var(--red)}
.kpi-v{font-size:22px;font-weight:700;line-height:1.2}
.kpi-l{font-size:11px;color:var(--t3);margin-top:2px}

/* ---------- 筛选 chips ---------- */
.fchips{display:flex;gap:8px;overflow-x:auto;padding:2px 0 8px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.fchips::-webkit-scrollbar{display:none}
.fchip{
  flex:0 0 auto;border:1px solid var(--bd);background:#fff;color:var(--t2);
  border-radius:16px;padding:6px 14px;font-size:13px;white-space:nowrap;
}
.fchip.on{background:var(--grad);color:#fff;border-color:transparent;font-weight:600}
.fchip i{font-style:normal;margin-left:5px;opacity:.75;font-size:12px}

/* ---------- 搜索栏 ---------- */
.searchbar{display:flex;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.searchbar input[type=text],.searchbar input[type=search]{
  flex:1;min-width:180px;height:42px;border:1px solid var(--bd);border-radius:10px;padding:0 14px;font-size:14px;background:#fff;
}
.searchbar input:focus{outline:none;border-color:var(--red)}
.searchbar select,.field select,.field input,.field textarea{
  height:42px;border:1px solid var(--bd);border-radius:10px;padding:0 12px;font-size:14px;background:#fff;width:100%;
}
.field textarea{height:auto;padding:10px 12px;min-height:84px;resize:vertical;line-height:1.6}
.field select:focus,.field input:focus,.field textarea:focus{outline:none;border-color:var(--red)}
.field{margin-bottom:14px}
.field-label{display:block;font-size:13px;color:var(--t2);margin-bottom:6px;font-weight:500}
.field-label .req{color:var(--red)}

/* =========================================================
   列表「双模式渲染」
   ========================================================= */
.dual-cards{display:none}
.data-table{width:100%;border-collapse:collapse;font-size:13.5px;background:#fff;border-radius:var(--r);overflow:hidden}
.data-table th{
  background:#fbfbfc;text-align:left;padding:11px 12px;font-size:12.5px;color:var(--t2);
  font-weight:600;border-bottom:1px solid var(--bd);white-space:nowrap;
}
.data-table td{padding:11px 12px;border-bottom:1px solid var(--bd2);vertical-align:middle}
.data-table tbody tr:last-child td{border-bottom:none}
.data-table tbody tr:hover{background:#fcfcfd}
.data-table .row-actions{display:flex;gap:6px;flex-wrap:wrap}

/* ---------- 手机卡片 ---------- */
.m-card{
  background:#fff;border-radius:var(--r);box-shadow:var(--shadow);
  padding:14px;margin-bottom:10px;position:relative;
}
.m-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}
.m-card-name{font-size:15px;font-weight:600;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.m-card-phone{font-size:13px;color:var(--t2);margin-top:2px}
.m-card-meta{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:12.5px;color:var(--t3);margin-bottom:10px}
.m-card-meta b{color:var(--t2);font-weight:500}
.m-card-actions{display:flex;gap:8px;border-top:1px solid var(--bd2);padding-top:10px}
.m-card-actions button{flex:1;height:38px;border-radius:9px;border:none;font-size:13.5px;font-weight:600}
.act-call{background:#ecfdf5;color:#047857}
.act-follow{background:var(--grad);color:#fff}
.act-more{background:#f3f4f6;color:var(--t2);flex:0 0 72px !important}

/* ---------- 标签 / 徽章 ---------- */
.chip{display:inline-block;border-radius:9px;padding:2px 9px;font-size:11.5px;font-weight:600;white-space:nowrap}
.badge{display:inline-block;border-radius:8px;padding:2px 8px;font-size:11.5px;background:#f3f4f6;color:var(--t2);white-space:nowrap}
.badge-red{background:#fef2f2;color:var(--red)}
.badge-org{background:#fff7ed;color:#c2410c}
.badge-blue{background:#e0f2fe;color:#0369a1}
.badge-green{background:#d1fae5;color:#047857}
.badge-gray{background:#f3f4f6;color:#64748b}
.urgent-flag{color:var(--red);font-weight:700}
.overdue-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--org);margin-right:4px;vertical-align:middle}

/* ---------- 进度条 ---------- */
.progress{height:6px;border-radius:4px;background:#f1f2f4;overflow:hidden}
.progress > i{display:block;height:100%;background:var(--grad);border-radius:4px}

/* ---------- 提示条 ---------- */
.tip-bar{background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:10px 14px;font-size:13px;color:#92400e;margin-bottom:12px}
.info-bar{background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px;padding:10px 14px;font-size:13px;color:#1d4ed8;margin-bottom:12px}

/* ---------- 活动窗口（首页横滑卡，原型 cpg-card 风格） ---------- */
.camp-scroll{display:flex;gap:10px;overflow-x:auto;padding:2px 0 10px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.camp-scroll::-webkit-scrollbar{display:none}
.camp-card{
  flex:0 0 172px;background:linear-gradient(150deg,#374151,#4B5563);color:#fff;
  border-radius:var(--r-lg);box-shadow:var(--shadow);
  padding:13px 14px;cursor:pointer;border:none;position:relative;
}
.camp-card.on{background:linear-gradient(150deg,#7C2D2D,#E64545 55%,#F97316)}
.camp-card.pre{background:linear-gradient(150deg,#374151,#4B5563)}
.camp-card.end,.camp-card.off{background:linear-gradient(150deg,#374151,#4B5563);opacity:.75}
.camp-bar{display:none}
.camp-name{font-size:13.5px;font-weight:700;display:block;line-height:1.4;margin-bottom:2px}
.camp-name .badge{background:rgba(255,255,255,.2);color:#fff;font-size:10px}
.camp-sub{font-size:10px;opacity:.78;margin-bottom:8px;min-height:14px;color:#fff}
.camp-funnel{display:flex;gap:10px;font-size:9.5px;opacity:.85;border-top:1px solid rgba(255,255,255,.22);padding-top:8px}
.camp-funnel b{display:block;font-size:15px;opacity:1;color:#fff}
.camp-card.camp-new{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  background:#fff;color:var(--t3);border:1.5px dashed var(--bd);font-size:24px;box-shadow:none;
}

/* =========================================================
   弹层：桌面居中弹窗 / 手机底部抽屉
   ========================================================= */
.modal{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center}
.modal.hidden{display:none}
.modal-mask{position:absolute;inset:0;background:rgba(17,24,39,.45)}
.modal-card{
  position:relative;background:#fff;border-radius:var(--r-lg);width:100%;max-width:520px;
  max-height:86vh;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);overflow:hidden;
}
.modal-card.modal-wide{max-width:760px}
.modal-handle{display:none}
.modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px;border-bottom:1px solid var(--bd2);flex:0 0 auto}
.modal-header h3{font-size:15.5px;font-weight:600}
.modal-close{border:none;background:none;font-size:24px;line-height:1;color:var(--t3);padding:0 4px}
.modal-body{padding:18px 20px;overflow-y:auto;flex:1 1 auto;-webkit-overflow-scrolling:touch}
.modal-footer{padding:12px 20px;border-top:1px solid var(--bd2);display:flex;gap:10px;justify-content:flex-end;flex:0 0 auto}
.modal-footer button{flex:0 0 auto}

/* 详情行 */
.detail-row{display:flex;gap:12px;padding:8px 0;border-bottom:1px solid var(--bd2);font-size:14px}
.detail-row:last-child{border-bottom:none}
.detail-row .k{flex:0 0 92px;color:var(--t3);font-size:13px}
.detail-row .v{flex:1;word-break:break-all}

/* 时间线 */
.timeline{position:relative;padding-left:18px}
.timeline::before{content:'';position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:var(--bd)}
.tl-item{position:relative;padding-bottom:14px}
.tl-item::before{content:'';position:absolute;left:-17px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--red);border:2px solid #fff}
.tl-head{font-size:13px;font-weight:600}
.tl-time{font-size:11.5px;color:var(--t3)}
.tl-body{font-size:13.5px;color:var(--t2);margin-top:3px;white-space:pre-wrap;word-break:break-word}

/* =========================================================
   Toast
   ========================================================= */
.toast{
  position:fixed;left:50%;bottom:calc(80px + var(--safe-b));transform:translateX(-50%);
  background:rgba(17,24,39,.92);color:#fff;font-size:13.5px;padding:10px 20px;border-radius:22px;
  z-index:200;max-width:82vw;text-align:center;transition:opacity .2s;
}
.toast-success{background:rgba(5,150,105,.94)}
.toast-error{background:rgba(220,38,38,.94)}

/* =========================================================
   底部 Tab + 抽屉（默认隐藏，窄屏启用）
   ========================================================= */
.tabbar{display:none}
.drawer-mask{display:none}

/* =========================================================
   二维码
   ========================================================= */
.qr-box{text-align:center;padding:10px 0}
.qr-box canvas,.qr-box img,.qr-box svg{margin:0 auto;border-radius:12px;border:1px solid var(--bd)}
.qr-name{font-size:14px;font-weight:600;margin-top:12px}
.qr-tip{font-size:12.5px;color:var(--t3);margin-top:4px}
.link-box{display:flex;gap:8px;margin-top:12px}
.link-box input{flex:1;height:40px;border:1px solid var(--bd);border-radius:9px;padding:0 12px;font-size:12.5px;background:#fbfbfc;color:var(--t2)}

/* =========================================================
   图片 / Banner
   ========================================================= */
.thumb{width:100%;height:120px;object-fit:cover;border-radius:10px;background:#f3f4f6}
.banner-card{border:1px solid var(--bd);border-radius:var(--r);padding:12px;margin-bottom:12px}
.file-drop{
  border:1.5px dashed var(--bd);border-radius:10px;padding:18px;text-align:center;color:var(--t3);
  font-size:13px;cursor:pointer;background:#fbfbfc;
}
.file-drop:hover{border-color:var(--red);color:var(--red)}
.img-preview{max-width:180px;border-radius:10px;border:1px solid var(--bd);margin-top:10px}

/* =========================================================
   专题编辑器页签
   ========================================================= */
.tab-strip{display:flex;gap:4px;background:#f3f4f6;border-radius:12px;padding:4px;margin-bottom:16px;overflow-x:auto;scrollbar-width:none}
.tab-strip::-webkit-scrollbar{display:none}
.tab-btn{
  flex:1;min-width:82px;border:none;background:none;border-radius:9px;padding:9px 10px;
  font-size:13.5px;color:var(--t2);white-space:nowrap;
}
.tab-btn.on{background:#fff;color:var(--red);font-weight:600;box-shadow:var(--shadow)}

/* 漏斗步骤 */
.funnel-steps{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.funnel-steps::-webkit-scrollbar{display:none}
.fstep{flex:0 0 auto;background:#f9fafb;border-radius:10px;padding:8px 14px;text-align:center;min-width:74px}
.fstep b{display:block;font-size:16px}
.fstep span{font-size:11.5px;color:var(--t3)}

/* =========================================================
   派单批量操作栏（固定在底部 Tab 之上）
   ========================================================= */
.batch-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:80;background:#fff;
  border-top:1px solid var(--bd);box-shadow:0 -4px 18px rgba(17,24,39,.08);
  padding:10px 16px calc(10px + var(--safe-b));display:none;align-items:center;gap:10px;
}
/* 勾选后才出现（对齐 v2.2 原型 .batchbar / .batchbar.show） */
.has-batch .batch-bar{display:flex}
.batch-bar .batch-count{font-size:13.5px;color:var(--t2);flex:1}
.batch-bar .batch-count b{color:var(--red);font-size:16px}
/* 下列三条对齐原型 预览-派单管理.html:337-339 */
.batch-bar .cnt{font-size:12px;color:var(--pt2);white-space:nowrap}
.batch-bar select{
  flex:1;min-width:0;height:40px;border:1.5px solid var(--pbd);border-radius:var(--r-md);
  padding:0 10px;font-size:13px;background:#fff;color:var(--pt1);
}
.batch-bar button{height:40px;padding:0 20px;font-size:14px;flex:0 0 auto}

/* 勾选框 */
.row-check{width:18px;height:18px;accent-color:var(--red);vertical-align:middle}
.m-card.picked{outline:2px solid var(--red);outline-offset:-2px;background:#fffafa}

/* 排行榜 */
.rank-item{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--bd2);font-size:13.5px}
.rank-item:last-child{border-bottom:none}
.rank-no{flex:0 0 22px;height:22px;border-radius:6px;background:#f3f4f6;color:var(--t2);font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}
.rank-no.top{background:var(--grad);color:#fff}
.rank-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rank-val{font-weight:700;color:var(--red)}

/* =========================================================
   更多九宫格面板（手机端「更多」Tab）
   ========================================================= */
.more-mask{display:none}
.more-sheet{
  display:none;position:fixed;left:0;right:0;bottom:calc(var(--tabbar-h) + var(--safe-b));z-index:95;
  background:#fff;border-radius:20px 20px 0 0;padding:14px 16px calc(18px + var(--safe-b));
  max-height:62%;overflow-y:auto;box-shadow:0 -8px 30px rgba(17,24,39,.14);
}
.more-sheet.show{display:block;animation:sheetUp .22s ease}
.more-title{text-align:center;font-size:13px;font-weight:700;padding-bottom:10px;margin-bottom:12px;border-bottom:1px solid var(--bd2)}
.more-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 8px}
.more-item{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:11px;color:var(--t2);cursor:pointer;border:none;background:none;padding:0}
.more-item .mi{width:48px;height:48px;border-radius:14px;background:var(--bg);display:flex;align-items:center;justify-content:center;font-size:22px;transition:transform .12s}
.more-item:active .mi{transform:scale(.9);background:#FEF2F2}

/* =========================================================
   首页渐变头部（原型 home-hero）
   ========================================================= */
.home-hero{background:var(--grad);margin:calc(-1 * var(--cp,20px)) calc(-1 * var(--cp,20px)) 0;padding:18px 16px 30px;color:#fff;border-radius:0 0 22px 22px}
.home-hero .hi{display:flex;justify-content:space-between;align-items:center;gap:10px}
.home-hero .hi b{font-size:18px;display:block}
.home-hero .hi span{font-size:12px;opacity:.88;display:block;margin-top:3px}
.home-hero .date{font-size:11px;background:rgba(255,255,255,.18);border-radius:12px;padding:4px 10px;white-space:nowrap}
.home-hero + .kpi-strip{margin-top:-16px}

/* =========================================================
   我的页（原型 me-card + menu-card）
   ========================================================= */
.me-card{background:var(--grad);margin:calc(-1 * var(--cpad,var(--cp,20px))) calc(-1 * var(--cpad,var(--cp,20px))) 0;padding:22px 18px 30px;color:#fff;display:flex;align-items:center;gap:14px;border-radius:0 0 22px 22px}
.me-card .av{width:58px;height:58px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700;flex:0 0 auto}
.me-card b{font-size:18px}
.me-card p{font-size:12px;opacity:.88;margin-top:3px}
.menu-card{background:#fff;border-radius:var(--r-lg);margin:12px 0;box-shadow:var(--shadow);overflow:hidden}
.menu-item{display:flex;align-items:center;gap:12px;padding:14px 15px;border-bottom:1px solid var(--bd2);font-size:14px;cursor:pointer}
.menu-item:last-child{border-bottom:none}
.menu-item .mi{width:34px;height:34px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:16px;flex:0 0 auto}
.menu-item .arr{margin-left:auto;color:#D1D5DB}
.menu-item small{margin-left:auto;color:var(--t3);font-size:12px}
.menu-item small + .arr{margin-left:6px}

/* =========================================================
   我的活动码（原型 promo-card）
   ========================================================= */
.promo-card{background:#fff;border-radius:var(--r-lg);padding:14px;box-shadow:var(--shadow);display:flex;gap:13px;margin-bottom:12px}
.promo-qr{flex:0 0 92px;text-align:center}
.promo-qr canvas,.promo-qr img{width:92px;height:92px;border-radius:8px;border:1px solid var(--bd)}
.promo-qr small{display:block;font-size:9px;color:var(--t3);margin-top:4px}
.promo-main{flex:1;min-width:0}
.promo-main .ttl{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.promo-main .ttl b{font-size:14px}
.promo-link{margin-top:7px;background:var(--bg);border-radius:7px;padding:6px 9px;font-size:10.5px;color:var(--t2);word-break:break-all;line-height:1.5}
.promo-nums{display:flex;gap:12px;margin-top:8px;font-size:10.5px;color:var(--t3);flex-wrap:wrap}
.promo-nums b{color:var(--t1);font-size:13px}
.promo-acts{display:flex;gap:8px;margin-top:10px}
.promo-acts .btn-mini{flex:1;height:32px;font-size:12px}
.poster-wrap{text-align:center}
.poster-wrap img{width:100%;max-width:300px;border-radius:14px;box-shadow:0 10px 34px rgba(0,0,0,.22);display:block;margin:0 auto}
.poster-wrap p{font-size:11px;color:var(--t3);margin-top:10px}

/* =========================================================
   响应式：< 768px 切换为手机形态
   ========================================================= */
@media (max-width:767px){
  /* 侧边栏变抽屉 */
  .sidebar{
    position:fixed;left:0;top:0;bottom:0;z-index:120;width:250px;flex:none;
    transform:translateX(-100%);transition:transform .22s ease;height:100vh;
    box-shadow:var(--shadow-lg);
  }
  .sidebar.open{transform:translateX(0)}
  .drawer-mask{position:fixed;inset:0;background:rgba(17,24,39,.45);z-index:110}
  .drawer-mask.show{display:block}

  .hamburger{display:flex}
  .topbar{height:52px;padding:0 14px;gap:8px}
  .topbar h2{font-size:16px}
  .topbar-right .topbar-user,.topbar-right .topbar-link{display:none}
  .topbar-right{gap:0}
  .tb-avatar{display:flex}

  .content{--cp:12px;--cpad:12px;padding:12px 12px calc(var(--tabbar-h) + var(--safe-b) + 18px)}
  .content.has-batch{padding-bottom:calc(var(--tabbar-h) + var(--safe-b) + 78px)}

  /* 底部 Tab */
  .tabbar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;
    background:rgba(255,255,255,.98);backdrop-filter:blur(10px);
    border-top:1px solid var(--bd);
    padding-bottom:var(--safe-b);
    height:calc(var(--tabbar-h) + var(--safe-b));
  }
  .tab{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
    font-size:10.5px;color:var(--t3);cursor:pointer;padding-top:4px;
  }
  .tab i{font-style:normal;font-size:20px;line-height:1.1}
  .tab.active{color:var(--red);font-weight:600}

  /* 列表：隐藏表格，显示卡片 */
  .dual-table{display:none}
  .dual-cards{display:block}

  .card{padding:14px;border-radius:var(--r);margin-bottom:12px}
  .card-head{margin-bottom:10px}
  .card-title{font-size:14.5px}

  .kpi-strip{grid-template-columns:repeat(2,1fr);gap:8px}
  .kpi{padding:12px 12px}
  .kpi-v{font-size:19px}

  /* 弹层底部化 */
  .modal{align-items:flex-end}
  .modal-card{
    max-width:100%;width:100%;border-radius:18px 18px 0 0;
    max-height:88vh;
    animation:sheetUp .22s ease;
    padding-bottom:var(--safe-b);
  }
  @keyframes sheetUp{from{transform:translateY(30px);opacity:.6}to{transform:translateY(0);opacity:1}}
  .modal-handle{display:block;width:38px;height:4px;border-radius:3px;background:#e0e2e6;margin:8px auto 0;flex:0 0 auto}
  .modal-header{padding:10px 16px 12px}
  .modal-header h3{font-size:16px}
  .modal-body{padding:14px 16px}
  .modal-footer{padding:10px 16px 14px;gap:10px}
  .modal-footer button{flex:1;height:46px;font-size:15px}

  .grid2,.grid3{grid-template-columns:1fr}
  .searchbar input[type=text],.searchbar input[type=search]{min-width:0;flex:1 1 100%}
  .searchbar select{flex:1 1 100%}

  .fchip{padding:8px 16px;font-size:13.5px}
  .detail-row .k{flex:0 0 80px;font-size:12.5px}

  /* 批量栏落到 Tab 之上 */
  .batch-bar{bottom:calc(var(--tabbar-h) + var(--safe-b));padding-bottom:10px;border-radius:14px 14px 0 0}
  .batch-bar button{height:40px;padding:0 14px;font-size:13.5px}

  .toast{bottom:calc(var(--tabbar-h) + var(--safe-b) + 18px)}

  .tab-strip{position:sticky;top:52px;z-index:20}
}

@media (max-width:360px){
  .kpi-strip{grid-template-columns:1fr 1fr}
  .tab span{font-size:10px}
}

/* =========================================================
   v2.1 追加组件层（客户池 / 派单管理 / 数据分析）
   命名：小写中划线，仅新增不覆盖；其他页面可直接复用
   ========================================================= */
:root{ --r-md:12px; --r-sm:8px; }

/* ---------- 补两个此前缺失但已被多处引用的栅格/徽章 ---------- */
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.badge-purple{background:#ede9fe;color:#6d28d9}
.badge-gold{background:#fffbeb;color:#b45309}

/* ---------- 区块小标题（原型 sec-title） ---------- */
.sec-title{display:flex;align-items:center;gap:6px;font-size:14.5px;font-weight:700;margin:0 0 10px}
.sec-title span{font-size:11.5px;color:var(--t3);font-weight:500}

/* ---------- 引导型空态：图标 + 主文案 + 副文案 ---------- */
.empty-ico{font-size:30px;line-height:1;margin-bottom:8px}
.empty-t{font-size:14.5px;font-weight:600;color:var(--t2)}
.empty-s{font-size:12px;color:var(--t3);margin-top:4px;line-height:1.7}
.empty .btn-mini{margin-top:14px}

/* ---------- 列表工具条：共 N 条 + 右侧操作 ---------- */
.list-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.list-bar .list-total{font-size:12.5px;color:var(--t3)}
.searchbar .btn-mini{height:42px;padding:0 16px;font-size:13.5px}

/* ---------- 语义文字色 ---------- */
.txt-warn{color:var(--org)}
.txt-danger{color:var(--red)}
.txt-ok{color:var(--green)}

/* ---------- 卡片头：姓名 / 标签 / 编号 ---------- */
.c-head{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.c-name{font-size:16px;font-weight:700;color:var(--t1)}
.c-id{margin-left:auto;font-size:11px;color:var(--t3);background:var(--bg);border-radius:6px;padding:1px 6px;font-family:ui-monospace,Consolas,monospace;flex:0 0 auto}
.c-phone{font-size:13.5px;color:var(--t2);font-weight:500;margin-bottom:4px}
.c-time{margin-left:auto;flex:0 0 auto;font-size:11.5px;color:var(--t3)}

/* ---------- 卡片信息行：图标 + 值 ---------- */
.v-row{display:flex;align-items:flex-start;gap:6px;font-size:12.5px;color:var(--t2);margin:5px 0}
.v-lb{flex:0 0 auto;color:var(--t3)}
.v-vl{flex:1;min-width:0;color:var(--t1);font-weight:500;overflow-wrap:anywhere}
.v-vl b.wait{color:var(--org);font-weight:700}

/* ---------- 卡片内警示条 ---------- */
.c-warn{margin-top:8px;background:#fff7ed;border:1px solid #fed7aa;border-radius:var(--r-sm);padding:6px 10px;font-size:12px;color:#b45309}

/* ---------- 卡片操作区：可换行，点击区 ≥38px ---------- */
.c-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px;padding-top:10px;border-top:1px dashed var(--bd)}
.c-acts .btn-mini{flex:1 1 auto;min-width:74px;height:38px;border-radius:var(--r-sm);font-size:13px}
.btn-call{background:var(--grad);color:#fff}

/* ---------- 派单卡片 ----------
   注：v1.x 的「左勾选圈 + 右内容」版本这里曾是 .dp-card{display:flex;gap:10px} + .dp-ck + .dp-main，
   该结构与标记已被 v2.2（.mc-card.dp-card > .dp-row > .dp-body）取代且无任何 JS 再引用。
   残留的 display:flex 会让 .dp-row 收缩为内容宽度，导致卡内右侧元素无法贴到卡片右缘——
   已于 2026-09-11 删除。整卡可点选的样式见下方 .disp-page .dp-card。 */

/* ---------- 派单页：专题待派统计行 ---------- */
.dp-stat-row{padding:9px 0;border-bottom:1px solid var(--bd2)}
.dp-stat-row:last-child{border-bottom:none}
.dsr-top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:13.5px;margin-bottom:6px}
.dsr-top b{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dsr-sub{font-size:11.5px;color:var(--t3);margin-top:5px}

/* ---------- 数据分析：通用分析卡 ---------- */
.an-card{border:1px solid var(--bd);border-radius:var(--r-md);padding:12px 13px;margin-bottom:10px;background:#fff}
.an-card:last-child{margin-bottom:0}
.an-card-hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.an-card-ttl{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:14px;font-weight:700;min-width:0}
.an-card-val{font-size:20px;font-weight:800;color:var(--red);flex:0 0 auto;line-height:1.2}
.an-card-val i{font-style:normal;font-size:11px;font-weight:600;color:var(--t3);margin-left:2px}
.an-card-sub{font-size:11.5px;color:var(--t3);margin-top:6px}

/* ---------- 数据分析：趋势柱状图（纯 div，不引图表库） ---------- */
.an-trend{display:flex;align-items:flex-end;gap:4px;height:132px;padding:4px 2px 0}
.an-bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;cursor:pointer;min-width:0}
.an-bar-v{font-size:10px;color:var(--t2);font-weight:700;margin-bottom:2px;white-space:nowrap}
.an-bar{width:70%;max-width:26px;border-radius:4px 4px 0 0;min-height:2px;background:linear-gradient(180deg,var(--org),var(--red));transition:filter .15s}
.an-bar-col:hover .an-bar{filter:brightness(1.12)}
.an-bar-d{font-size:9px;color:var(--t3);margin-top:4px;white-space:nowrap}
.an-trend-tip{font-size:11.5px;color:var(--t3);text-align:center;margin-top:8px}
.an-trend-tip b{color:var(--t1)}

/* ---------- 详情弹层英雄头 ---------- */
.dt-hero{background:var(--bg);border-radius:var(--r-md);padding:13px 14px;margin-bottom:14px}
.dt-hero-top{display:flex;align-items:center;gap:8px}
.dt-hero-top b{font-size:17px;font-weight:700}
.dt-hero-id{font-size:11.5px;color:var(--t3);background:#fff;border-radius:6px;padding:1px 7px;font-family:ui-monospace,Consolas,monospace}
.dt-hero-sub{font-size:13.5px;color:var(--t2);margin-top:3px}
.dt-hero-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}

/* ---------- 表单勾选行 ---------- */
.check-row{display:flex;align-items:center;gap:8px;font-size:13.5px;color:var(--t2);cursor:pointer;padding:2px 0}

/* ---------- 筛选 chips 里的下拉（替代原内联样式） ---------- */
.fchips .fsel{
  flex:0 0 auto;height:34px;border:1px solid var(--bd);border-radius:16px;
  padding:0 12px;font-size:13px;background:#fff;color:var(--t2);
}
.fchips .fsel:focus{outline:none;border-color:var(--red)}

/* ---------- 手机端微调（v2.1：卡片间距 ≥12 / 圆角 16 / 可点区 ≥38） ---------- */
@media (max-width:767px){
  .m-card{border-radius:16px;padding:14px;margin-bottom:12px}
  .c-acts .btn-mini{min-width:0;flex:1 1 calc(50% - 4px)}
  .fchips .fsel{height:36px;padding:0 14px}
  .an-trend{height:120px}
  .grid2,.grid3{grid-template-columns:1fr}
  .sec-title{font-size:14px}
  .empty{padding:34px 12px}
}

/* =========================================================
   v2.2 组件层（按「验房H5后台-全界面整合原型-v2.2」对齐）
   策略：保留 v2.1 token，桥接 v2.2 别名，仅新增/作用域化，不覆盖已有类
   ========================================================= */
:root{
  --c-red:var(--red); --c-orange:var(--org); --c-blue:var(--blue);
  --c-green:var(--green); --c-teal:var(--teal); --c-gold:var(--gold);
  --card:#ffffff; --border:var(--bd); --sh-card:var(--shadow);
  --tab-h:var(--tabbar-h); --safe:var(--safe-b);
}

/* 派单页顶部统计（v2.2 新增，无冲突） */
.dp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.dp-stat{background:#fff;border-radius:var(--r-md);padding:11px 6px;text-align:center;box-shadow:var(--sh-card)}
.dp-stat b{font-size:19px;display:block}
.dp-stat span{font-size:10.5px;color:var(--t3)}
.dp-stat.warn b{color:var(--c-orange)}
.dp-stat.hot b{color:var(--c-red)}

/* 派单：跟进提示条 */
.dp-ff{margin-top:7px;background:#FFFBEB;border:1px solid #FDE68A;border-radius:9px;padding:7px 10px;font-size:11.5px;color:#92400E;line-height:1.6}
.dp-ff p{margin-top:2px;color:#78350F;font-size:12px}
.dp-ff.none{background:var(--bg);border-color:var(--bd);color:var(--t3)}

/* ==========================================================================
   v2.2 客户模块重制：样式与呈现 100% 对齐「客户列表-手机端优化预览」
   作用域 .cust-page（页面内容）+ .mc-overlay（筛选抽屉，挂在 #app 下）
   ========================================================================== */
.cust-page,.mc-overlay{
  --cr:#DC2626; --co:#F97316; --cg:#10B981; --cb:#0EA5E9; --cp:#7C3AED;
  --pb:#F7F8FA; --pt1:#1A1A1A; --pt2:#555555; --pt3:#999999;
  --pbd:#E5E7EB; --phint:#9CA3AF; --psm:0 2px 6px rgba(0,0,0,.04);
}
.cust-page{background:var(--pb);min-height:100%;padding-bottom:10px;-webkit-tap-highlight-color:transparent}

/* ---------- 吸顶头部：搜索 / 筛选 / chips / 工具条 ---------- */
.cust-page .mc-top{
  position:sticky;top:0;z-index:50;background:#fff;
  padding:10px 14px 8px;border-bottom:.5px solid var(--pbd);
  margin:0;
}
.cust-page .mc-searchbar{display:flex;gap:8px}
.cust-page .mc-search{
  flex:1;min-width:0;background:var(--pb);border-radius:20px;
  padding:9px 12px;display:flex;align-items:center;gap:6px;
}
.cust-page .mc-search input{border:none;background:transparent;outline:none;font-size:14px;width:100%;color:var(--pt1)}
.cust-page .mc-search input::placeholder{color:var(--phint)}
.cust-page .mc-filter-btn{
  position:relative;flex-shrink:0;display:flex;align-items:center;
  background:var(--pb);border-radius:20px;padding:9px 14px;
  font-size:14px;color:var(--pt1);cursor:pointer;white-space:nowrap;
}
.cust-page .mc-filter-dot{
  position:absolute;top:5px;right:6px;width:7px;height:7px;border-radius:50%;background:var(--cr);
}
.cust-page .mc-chips{display:flex;gap:8px;overflow-x:auto;padding:10px 0 2px;scrollbar-width:none}
.cust-page .mc-chips+.mc-chips{padding-top:6px}
.cust-page .mc-chips::-webkit-scrollbar{display:none}
.cust-page .mc-chip{
  flex-shrink:0;padding:5px 14px;border-radius:14px;font-size:13px;
  background:var(--pb);color:var(--pt2);cursor:pointer;white-space:nowrap;border:none;
}
.cust-page .mc-chip.active{background:var(--cr);color:#fff;font-weight:600}
.cust-page .mc-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-top:8px}
.cust-page .mc-tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.cust-page .mc-total{font-size:12px;color:var(--pt3);white-space:nowrap}
.cust-page .mc-tag{
  border:none;cursor:pointer;white-space:nowrap;
  font-size:11px;padding:2px 8px;border-radius:10px;
  background:rgba(220,38,38,.08);color:var(--cr);
}
.cust-page .mc-export{
  border:1px solid var(--pbd);background:#fff;border-radius:14px;
  padding:4px 12px;font-size:12px;color:var(--pt2);cursor:pointer;white-space:nowrap;
}
.cust-page .mc-export.pri{
  border-color:transparent;background:linear-gradient(135deg,var(--cr),var(--co));
  color:#fff;font-weight:600;box-shadow:0 2px 6px rgba(220,38,38,.25);
}

/* ---------- 卡片列表：与吸顶头部共用 14px 左右基线 ---------- */
.cust-page .mc-list{
  display:flex;flex-direction:column;gap:10px;
  padding:12px 14px 20px;
}
.cust-page .mc-card{
  background:#fff;border-radius:14px;padding:13px 14px;
  border:1px solid var(--pbd);box-shadow:var(--psm);cursor:pointer;
}
.cust-page .mc-card:active{transform:scale(.99)}
.cust-page .mc-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding-bottom:9px;border-bottom:1px solid #F1F2F4;margin-bottom:9px}
.cust-page .mc-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.cust-page .mc-name{font-size:16px;font-weight:700;color:var(--pt1)}
.cust-page .mc-badge-urgent{
  font-size:10px;padding:2px 6px;border-radius:4px;background:#FFF7ED;color:#C2410C;
  font-weight:600;border:1px solid #FED7AA;
}
.cust-page .mc-phone{font-size:14px;color:var(--pt1)}
.cust-page .mc-status{flex-shrink:0;font-size:12px;padding:3px 10px;border-radius:12px;font-weight:600;white-space:nowrap}
.cust-page .mc-status.s-0{background:rgba(220,38,38,.1);color:var(--cr)}
.cust-page .mc-status.s-1{background:rgba(249,115,22,.12);color:var(--co)}
.cust-page .mc-status.s-2{background:rgba(14,165,233,.12);color:var(--cb)}
.cust-page .mc-status.s-3{background:rgba(16,185,129,.12);color:var(--cg)}
.cust-page .mc-status.s-4{background:rgba(124,58,237,.12);color:var(--cp)}
.cust-page .mc-status.s-5{background:#F3F4F6;color:var(--pt2)}
.cust-page .mc-line{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--pt2);margin-bottom:5px;gap:8px}
.cust-page .mc-addr{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cust-page .mc-addr b{color:var(--pt1);font-weight:500}
.cust-page .mc-area{flex-shrink:0;color:var(--pt1);font-weight:600}
.cust-page .mc-expect{font-size:13px;margin:0 0 8px;color:var(--pt1)}
.cust-page .mc-expect .lb{color:var(--pt3);margin-right:6px}
.cust-page .mc-svcs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 9px}
.cust-page .mc-svc{font-size:11px;padding:3px 9px;border-radius:10px;background:rgba(220,38,38,.06);color:var(--cr)}
.cust-page .mc-more-svc{font-size:11px;padding:3px 8px;border-radius:10px;background:#F3F4F6;color:var(--pt2)}
.cust-page .mc-foot{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--pt3);margin-top:auto;gap:8px}
.cust-page .mc-foot .mc-id{font-family:ui-monospace,Consolas,monospace;background:var(--pb);padding:1px 6px;border-radius:4px}
.cust-page .mc-actions{
  display:flex;gap:8px;margin-top:10px;padding-top:10px;
  border-top:1px dashed var(--pbd);align-items:stretch;
}
.cust-page .mc-btn-group .mc-btn{padding:9px 0}
.cust-page .mc-btn-group{display:flex;gap:8px;flex:1;min-width:0}
.cust-page .mc-btn{
  flex:1;display:flex;align-items:center;justify-content:center;
  padding:8px 0;border-radius:8px;font-size:12px;cursor:pointer;white-space:nowrap;border:none;
}
.cust-page a.mc-btn.call{
  flex:0 0 auto;padding:8px 14px;text-decoration:none;
  background:linear-gradient(135deg,var(--cr),var(--co));
  color:#fff;font-weight:600;box-shadow:0 2px 6px rgba(220,38,38,.25);
}
.cust-page .mc-btn.detail{background:#EFF6FF;color:#1D4ED8}
.cust-page .mc-btn.follow{background:#ECFDF5;color:#059669}
.cust-page .mc-btn.assign{background:#FFFBEB;color:#B45309}
.cust-page .mc-btn.del{background:#FEF2F2;color:var(--cr)}
.cust-page .mc-btn.copy{background:#F5F3FF;color:#6D28D9}
.cust-page .mc-btn:active{opacity:.7}
.cust-page .mc-listend{text-align:center;font-size:11px;color:var(--pt3);padding:6px 0 2px}

/* ---------- 派单页：复用客户列表语言，整卡点击选中（无勾选圈） ---------- */
.disp-page .dp-row{display:block}
.disp-page .dp-body{min-width:0}
.disp-page .dp-card{display:block;cursor:pointer;position:relative;transition:background .15s,border-color .15s,box-shadow .15s}
.disp-page .dp-card:active{transform:scale(.995)}
.disp-page .dp-card.sel{background:#FEF2F2;border-color:#FCA5A5;box-shadow:0 0 0 1.5px var(--cr)}
.disp-page .dp-card.sel .mc-name{color:var(--cr)}
.disp-page .dp-pick{font-size:12px;white-space:nowrap;transition:color .15s}
.disp-page .dp-card.sel .dp-pick{color:var(--cr);font-weight:600}
.disp-page .dp-assign{
  display:flex;justify-content:space-between;align-items:center;gap:8px;
  margin-top:9px;padding-top:9px;border-top:1px dashed var(--pbd);
  font-size:12px;color:var(--pt2);
}
.disp-page .dp-assign .who{font-weight:600;color:var(--pt1)}
.disp-page .dp-assign .un{color:#F97316;font-weight:600}
/* ---------- 数据分析（v2.2 .ana-page）：原型 4 板块 + .ana-extra 附加段 ----------
   作用域 .ana-page；等价令牌：--r-lg=16px / --t1=#111827 / --t3=#9CA3AF /
   --sh-card=0 1px 3px rgba(17,24,39,.05),0 1px 2px rgba(17,24,39,.04) / --c-orange=#F97316 */
.ana-page{padding-bottom:16px}
.ana-page .kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0;margin-top:0}
.ana-page .kpis > .kpi{background:#fff;border-radius:var(--r-lg);padding:13px 14px;box-shadow:var(--sh-card)}
.ana-page .kpis > .kpi b{font-size:22px}
.ana-page .kpis > .kpi.warn b{color:var(--c-orange)}
.ana-page .kpis > .kpi p{font-size:11px;color:var(--t3);margin-top:2px}
.ana-page .sec-title{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700;padding:18px 0 10px;margin:0}
.ana-page .sec-title span{font-size:11px;color:var(--t3);font-weight:400}
.ana-page .chart-card{background:#fff;border-radius:var(--r-lg);padding:14px;box-shadow:var(--sh-card);margin:0}
.ana-page .ana-rows{display:flex;flex-direction:column;gap:14px}
.ana-page .ana-row-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.ana-page .ana-row-head b{font-size:13px;color:var(--t1)}
.ana-page .ana-row-head span{font-size:11.5px;color:var(--t3);white-space:nowrap}
.ana-page .ana-row-sub{font-size:10.5px;color:var(--t3);margin-top:4px}
.ana-page .ana-tip{font-size:11px;color:var(--t3);border-top:1px dashed var(--border);padding-top:9px;margin-top:13px}
.ana-page .rank-list{display:flex;flex-direction:column;gap:10px}
/* .mc-list/.mc-card 全局规则（.mc-list 有 12px 14px 内边距、.mc-card 有边框+14px 圆角）服务客户池页，
   这里按原型规格用 .ana-page 作用域覆盖，不动全局 */
.ana-page .mc-list{display:flex;flex-direction:column;gap:10px;padding:0}
.ana-page .mc-card{background:#fff;border-radius:var(--r-lg);padding:14px;box-shadow:var(--sh-card);border:none}
.ana-page .mc-id{font-size:10px;color:var(--t3);flex:0 0 auto}
.ana-page .mc-foot{display:flex;justify-content:space-between;font-size:10.5px;color:var(--t3);margin-top:9px}
.cust-page .mc-empty{text-align:center;padding:50px 20px;color:var(--pt3);font-size:13px;line-height:2}
.cust-page .mc-empty b{font-size:30px;display:block;font-weight:400}
.cust-page .mc-more{text-align:center;padding:6px 0 10px}
/* 原型 .mc-more button（预览-派单管理.html:180）——分页「加载更多」按此样式 */
.cust-page .mc-more button{
  height:38px;padding:0 26px;border-radius:19px;background:#fff;
  border:1px solid var(--pbd);font-size:13px;color:var(--pt2);cursor:pointer;
}

/* 详情抽屉内的信息行（沿用同一套语言） */
.cust-page .dl-item::before{border-color:var(--cr)}
.cust-page .dl-item.gray::before{border-color:#CBD2DC}
.cpv-row{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:9px 0;border-bottom:1px solid #F1F2F4}
.cpv-row:last-child{border-bottom:none}
.cpv-row .k{color:#999;flex:0 0 auto}
.cpv-row .v{color:#1A1A1A;text-align:right;word-break:break-all}
.cpv-box{background:#F7F8FA;border-radius:12px;padding:4px 13px;margin-bottom:14px}

/* ---------- 筛选抽屉（右侧滑出） ---------- */
.mc-overlay{
  position:fixed;inset:0;z-index:230;background:rgba(0,0,0,.4);
  display:none;justify-content:flex-end;
}
.mc-overlay.show{display:flex}
.mc-panel{
  width:80%;max-width:330px;height:100%;background:#fff;
  padding:20px 16px;overflow-y:auto;
  transform:translateX(100%);transition:transform .25s ease;
  display:flex;flex-direction:column;
}
.mc-overlay.show .mc-panel{transform:translateX(0)}
.mc-panel-title{font-size:18px;font-weight:700;margin-bottom:18px;color:#1A1A1A}
.mc-section{margin-bottom:18px}
.mc-label{font-size:13px;font-weight:600;margin-bottom:10px;color:#1A1A1A}
.mc-opts{display:flex;flex-wrap:wrap;gap:8px}
.mc-opt{padding:7px 14px;border-radius:16px;background:#F7F8FA;color:#555;font-size:13px;cursor:pointer}
.mc-opt.active{background:rgba(220,38,38,.08);color:var(--cr);font-weight:600}
.mc-panel-actions{display:flex;gap:10px;margin-top:auto;padding-top:20px;position:sticky;bottom:0;background:#fff}
.mc-panel-actions button{flex:1;padding:12px;border-radius:22px;border:none;font-size:15px;font-weight:600;cursor:pointer}
.mc-btn-reset{background:#F7F8FA;color:#1A1A1A}
.mc-btn-ok{background:linear-gradient(135deg,var(--cr),var(--co));color:#fff}

/* =========================================================
   v2.2 共享组件层（严格对齐「验房H5后台-全界面整合原型-v2.2」）
   说明：保留 v2.1 通用类（.card/.m-card/.field/.btn-* 等）不动；
   以下为 v2.2 新增的全局组件类，命名与令牌均按原型，避免回归。
   ========================================================= */
:root{
  /* 客户模块令牌（v2.2 全局可用，原型定义在 .cust-page 作用域内，这里上提到根） */
  --cr:#DC2626; --co:#F97316; --cg:#10B981; --cb:#0EA5E9; --cp:#7C3AED;
  --pb:#F7F8FA; --pt1:#1A1A1A; --pt2:#555555; --pt3:#999999;
  --pbd:#E5E7EB; --phint:#9CA3AF; --psm:0 2px 6px rgba(0,0,0,.04);
}

/* ---------- 客户卡语言（全局，所有页通用） ---------- */
.mc-card{background:#fff;border-radius:14px;padding:13px 14px;border:1px solid var(--pbd);box-shadow:var(--psm)}
.mc-card:active{transform:scale(.99)}
.mc-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding-bottom:9px;border-bottom:1px solid #F1F2F4;margin-bottom:9px}
.mc-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.mc-name{font-size:15px;font-weight:700;color:var(--pt1);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.mc-badge-urgent{font-size:10px;padding:2px 6px;border-radius:4px;background:#FFF7ED;color:#C2410C;font-weight:600;border:1px solid #FED7AA}
.mc-phone{font-size:14px;color:var(--pt1)}
.mc-status{flex-shrink:0;font-size:12px;padding:3px 10px;border-radius:12px;font-weight:600;white-space:nowrap}
.mc-status.s-0{background:rgba(220,38,38,.1);color:var(--cr)}
.mc-status.s-1{background:rgba(249,115,22,.12);color:var(--co)}
.mc-status.s-2{background:rgba(14,165,233,.12);color:var(--cb)}
.mc-status.s-3{background:rgba(16,185,129,.12);color:var(--cg)}
.mc-status.s-4{background:rgba(124,58,237,.12);color:var(--cp)}
.mc-status.s-5{background:#F3F4F6;color:var(--pt2)}
.mc-line{display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--pt2);margin-bottom:5px;gap:8px}
.mc-addr{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mc-addr b{color:var(--pt1);font-weight:500}
.mc-area{flex-shrink:0;color:var(--pt1);font-weight:600}
.mc-expect{margin-top:8px;background:var(--bg);border-radius:8px;padding:7px 10px;font-size:12px;color:var(--t2)}
.mc-expect .lb{color:var(--cr);font-weight:600;margin-right:6px}
.mc-svcs{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 9px}
.mc-svc{font-size:11px;padding:3px 9px;border-radius:10px;background:rgba(220,38,38,.06);color:var(--cr)}
.mc-more-svc{font-size:11px;padding:3px 8px;border-radius:10px;background:#F3F4F6;color:var(--pt2)}
.mc-foot{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--pt3);margin-top:auto;gap:8px}
.mc-foot .mc-id{font-family:ui-monospace,Consolas,monospace;background:var(--pb);padding:1px 6px;border-radius:4px}
.mc-actions{display:flex;gap:8px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--pbd);align-items:stretch}
.mc-btn-group{display:flex;gap:8px;flex:1;min-width:0}
.mc-btn-group .mc-btn{padding:9px 0}
.mc-btn{flex:1;display:flex;align-items:center;justify-content:center;padding:8px 0;border-radius:8px;font-size:12px;cursor:pointer;white-space:nowrap;border:none}
a.mc-btn.call{flex:0 0 auto;padding:8px 14px;text-decoration:none;background:linear-gradient(135deg,var(--cr),var(--co));color:#fff;font-weight:600;box-shadow:0 2px 6px rgba(220,38,38,.25)}
.mc-btn.detail{background:#EFF6FF;color:#1D4ED8}
.mc-btn.follow{background:#ECFDF5;color:#059669}
.mc-btn.assign{background:#FFFBEB;color:#B45309}
.mc-btn.del{background:#FEF2F2;color:var(--cr)}
.mc-btn.copy{background:#F5F3FF;color:#6D28D9}
.mc-btn:active{opacity:.7}
.mc-list{display:flex;flex-direction:column;gap:10px;padding:12px 14px 20px}
.mc-listend{text-align:center;font-size:11px;color:var(--pt3);padding:6px 0 2px}
.mc-empty{text-align:center;padding:50px 20px;color:var(--pt3);font-size:13px;line-height:2}
.mc-empty b{font-size:30px;display:block;font-weight:400}
.mc-more{text-align:center;padding:6px 0 10px}
.mc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.mc-kv{display:flex;justify-content:space-between;font-size:12.5px;margin-top:7px}
.mc-kv .k{color:var(--t3)} .mc-kv .v{color:var(--t1);text-align:right;max-width:70%}
.mc-total{font-size:12px;color:var(--pt3);white-space:nowrap}
.mc-tags{display:flex;align-items:center;gap:6px;flex-wrap:wrap;min-width:0}
.mc-tag{border:none;cursor:pointer;white-space:nowrap;font-size:11px;padding:2px 8px;border-radius:10px;background:rgba(220,38,38,.08);color:var(--cr)}
.mc-export{border:1px solid var(--pbd);background:#fff;border-radius:14px;padding:4px 12px;font-size:12px;color:var(--pt2);cursor:pointer;white-space:nowrap}
.mc-export.pri{border-color:transparent;background:linear-gradient(135deg,var(--cr),var(--co));color:#fff;font-weight:600;box-shadow:0 2px 6px rgba(220,38,38,.25)}

/* 详情抽屉信息行（沿用 v2.2 语言） */
.cust-page .dl-item::before{border-color:var(--cr)}
.cust-page .dl-item.gray::before{border-color:#CBD2DC}
.cpv-row{display:flex;justify-content:space-between;gap:10px;font-size:13px;padding:9px 0;border-bottom:1px solid #F1F2F4}
.cpv-row:last-child{border-bottom:none}
.cpv-row .k{color:#999;flex:0 0 auto}
.cpv-row .v{color:#1A1A1A;text-align:right;word-break:break-all}
.cpv-box{background:#F7F8FA;border-radius:12px;padding:4px 13px;margin-bottom:14px}
.dl{position:relative;padding-left:18px}
.dl::before{content:'';position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--border)}
.dl-item{position:relative;padding-bottom:16px}
.dl-item::before{content:'';position:absolute;left:-17px;top:5px;width:10px;height:10px;border-radius:50%;background:#fff;border:2.5px solid var(--cr)}
.dl-item.gray::before{border-color:#CBD2DC}
.dl-item b{font-size:13px}
.dl-item p{font-size:12.5px;color:var(--t2);margin-top:3px;line-height:1.6}
.dl-item small{font-size:10.5px;color:var(--t3)}

/* ---------- 页面作用域包装（仅提供背景/定位，组件类已全局） ---------- */
.cust-page{background:var(--pb);min-height:100%;padding-bottom:10px;-webkit-tap-highlight-color:transparent}
.disp-page .dp-card{display:block;cursor:pointer;position:relative;transition:background .15s,border-color .15s,box-shadow .15s}
.disp-page .dp-card:active{transform:scale(.995)}
.disp-page .dp-card.sel{background:#FEF2F2;border-color:#FCA5A5;box-shadow:0 0 0 1.5px var(--cr)}
.disp-page .dp-card.sel .mc-name{color:var(--cr)}
.disp-page .dp-pick{font-size:12px;white-space:nowrap;transition:color .15s}
.disp-page .dp-card.sel .dp-pick{color:var(--cr);font-weight:600}
.disp-page .dp-assign{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:9px;padding-top:9px;border-top:1px dashed var(--pbd);font-size:12px;color:var(--pt2)}
.disp-page .dp-assign .who{font-weight:600;color:var(--pt1)}
.disp-page .dp-assign .un{color:#F97316;font-weight:600}
/* （旧的重复 .ana-page 规则块已删除，统一收敛到上方 v2.2 .ana-page 作用域块） */

/* ---------- 首页活动卡（v2.2 .cpg-card） ---------- */
.cpg-card{flex:0 0 168px;border-radius:var(--r-lg);padding:13px 14px;background:linear-gradient(150deg,#7C2D2D,#E64545 55%,#F97316);color:#fff;box-shadow:var(--sh-card);cursor:pointer;border:none;position:relative}
.cpg-card:not(.hot){background:linear-gradient(150deg,#374151,#4B5563)}
.cpg-card b{font-size:13.5px;display:block;line-height:1.4}
.cpg-card .tag{background:rgba(255,255,255,.2);color:#fff}
.cpg-time{font-size:10px;opacity:.75;margin-top:3px}
.cpg-nums{display:flex;gap:12px;margin-top:9px;padding-top:8px;border-top:1px solid rgba(255,255,255,.2)}
.cpg-nums span{font-size:9.5px;opacity:.8}
.cpg-new{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;background:#fff;color:var(--t3);border:1.5px dashed var(--border);font-size:24px}
.cpg-new span{font-size:11px}
.cpg-funnel{display:flex;align-items:center;gap:4px;margin-top:10px}
.cpg-funnel .seg{flex:1;text-align:center;padding:6px 2px;border-radius:6px;font-size:9.5px;color:var(--t3);background:var(--bg)}
.cpg-funnel .seg b{display:block;font-size:13px;color:var(--t1)}
.cpg-funnel .seg.hotseg{background:#FEF2F2}
.cpg-funnel .seg.hotseg b{color:var(--c-red)}
.cpg-funnel .arr{color:#D1D5DB;font-size:10px;flex:0 0 auto}

/* ---------- 行动按钮（v2.2 弹层底部条） ---------- */
.btn-g{flex:1;height:46px;border-radius:var(--r-md);background:var(--bg);color:var(--t1);font-size:15px;font-weight:500;border:none;cursor:pointer}
.btn-p{flex:1;height:46px;border-radius:var(--r-md);background:var(--grad);color:#fff;font-size:15px;font-weight:600;box-shadow:0 4px 14px rgba(230,69,69,.3);border:none;cursor:pointer}
.btn-sm{height:34px;padding:0 14px;border-radius:17px;background:var(--bg);font-size:13px;color:var(--t1);font-weight:500;border:none;cursor:pointer}
.btn-sm.pri{background:var(--grad);color:#fff}

/* ---------- 账号 / 小区 行内操作按钮（v2.2 .abtn） ---------- */
.abtn{flex:1;height:34px;border-radius:9px;font-size:12.5px;display:flex;align-items:center;justify-content:center;gap:3px;font-weight:500;border:none;cursor:pointer}
.abtn.pri{background:var(--grad);color:#fff}
.abtn.sec{background:var(--bg);color:var(--t1)}
.abtn.warn{background:#FFF7ED;color:#EA580C}
.abtn.dgr{background:#FEF2F2;color:#DC2626}

/* ---------- 表单行 / 开关 / 服务多选（v2.2） ---------- */
.f-row{margin-bottom:14px}
.f-row label{display:block;font-size:12px;color:var(--t2);margin-bottom:6px}
.f-row label em{color:var(--c-red);font-style:normal;margin-left:2px}
.f-row input,.f-row select,.f-row textarea{width:100%;height:44px;border:1.5px solid var(--border);border-radius:var(--r-md);padding:0 13px;background:#FAFBFC;transition:border .15s;outline:none;font-size:14px;box-sizing:border-box}
.f-row textarea{height:auto;min-height:80px;padding:11px 13px;resize:none}
.f-row input:focus,.f-row select:focus,.f-row textarea:focus{border-color:var(--c-red);background:#fff}
.f-grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.srv-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.srv{border:1.5px solid var(--border);border-radius:var(--r-md);padding:10px 12px;font-size:13px;color:var(--t2);text-align:center;cursor:pointer}
.srv.on{border-color:var(--c-red);color:var(--c-red);background:#FEF2F2;font-weight:600}
.switch-row{display:flex;align-items:center;justify-content:space-between;background:var(--bg);border-radius:var(--r-md);padding:11px 13px}
.switch-row span{font-size:13.5px}
.sw{width:46px;height:26px;border-radius:13px;background:#D9DCE1;position:relative;transition:.2s;border:none;cursor:pointer;flex:0 0 auto}
.sw::after{content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.sw.on{background:var(--c-red)}
.sw.on::after{left:23px}

/* ---------- 排行卡（v2.2 .rank-card） ---------- */
.rank-card{background:#fff;border-radius:var(--r-lg);padding:13px 14px;box-shadow:var(--sh-card);display:flex;align-items:center;gap:12px}
.rank-num{width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;background:var(--bg);color:var(--t3);flex:0 0 auto}
.rank-num.g1{background:linear-gradient(135deg,#FDE68A,#F59E0B);color:#fff}
.rank-num.g2{background:linear-gradient(135deg,#E5E7EB,#9CA3AF);color:#fff}
.rank-num.g3{background:linear-gradient(135deg,#FDBA74,#EA580C);color:#fff}
.rank-main{flex:1;min-width:0}
.rank-main b{font-size:14px}
.rank-main small{color:var(--t3);font-size:11px;margin-left:6px}
.rank-nums{display:flex;gap:14px;margin-top:5px}
.rank-nums span{font-size:10.5px;color:var(--t3)}
.rank-nums b{font-size:13px;color:var(--t1);margin-right:2px}

/* ---------- 通用标签（v2.2 .tag） ---------- */
.tag{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:10px;font-size:10.5px;font-weight:600}
.tag.gray{background:#F3F4F6;color:#6B7280}
.tag.blue{background:#EFF6FF;color:#2563EB}
.tag.orange{background:#FFF7ED;color:#EA580C}
.tag.green{background:#F0FDF4;color:#16A34A}
.tag.teal{background:#F0FDFA;color:#0D9488}
.tag.red{background:#FEF2F2;color:#DC2626}
.tag.gold{background:#FFFBEB;color:#D97706}

/* ---------- 底部 Tab 支持 SVG 图标（v2.2） ---------- */
.tab svg{width:21px;height:21px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.tab .tab-emoji{font-size:20px;line-height:1.1}

/* 手机端：当 UI.dualList 的卡片内部已是 v2.2 .mc-card 时，剥离外层 .m-card 样式，避免双层边框。
   用 .cust-page 作用域限定（而非 :has()）——只有派单/客户池这两个 v2.2 页面才走这套卡片语言，
   同时避免旧版微信内核不支持 :has() 时规则静默失效。 */
@media (max-width:767px){
  .cust-page .dual-cards > .m-card{padding:0;background:transparent;border:none;box-shadow:none;margin-bottom:0}

  /* 客户池列表 14px 基线：卡片经 UI.dualList 渲染在 #cusList > .dual-cards 里（无 .mc-list 包装），
     .cust-page 负边距抵消 .content 12px 后必须由 #cusList 自身补回原型 .pad 的 14px 左右内边距，
     否则卡片全出血贴屏边（360/390/414 实测 left=0）。空态(emptyMc)也在 #cusList 内，一并覆盖。 */
  .cust-page #cusList{padding-left:14px;padding-right:14px}

  /* 「加载更多」条：客户池 #cusMore / 派单 #dsMore 都在列表容器外，同样补 14px 侧边距 */
  .cust-page .mc-more{padding-left:14px;padding-right:14px}

  /* 单边 14px 基线：原型由 .pad(14px) 单独提供，这里的 .content 另有 12px 内边距，
     叠加会变成 26px，且卡片比顶部吸顶条窄一圈。用负边距抵消，保证整页左右基线统一。 */
  .cust-page{margin-left:calc(-1 * var(--cpad,12px));margin-right:calc(-1 * var(--cpad,12px))}

  /* 数据分析（v2.2 .ana-page）：同样负边距抵消 .content 的 12px 内边距，
     再以原型 .pad 同款 14px 左右内边距重建基线（390 视口下卡片 left=14 / right=376）。
     附加段 .ana-extra 与 loadDaily 的 .info-bar 仅桌面展示，手机端隐藏。 */
  .ana-page{margin-left:calc(-1 * var(--cpad,12px));margin-right:calc(-1 * var(--cpad,12px));padding-left:14px;padding-right:14px}
  .ana-page .ana-extra,.ana-page .info-bar{display:none}
}

/* ---------- 手机端隐藏、桌面保留的附加段（v2.2 原型没有的模块） ----------
   例：客户池顶部 KPI 概览条(#cusStats)。原型客户列表 = 搜索/chips/工具条 + 卡片流，无 KPI。 */
@media (max-width:767px){
  .desk-only{display:none !important}
}

/* ---------- 数据概览（v2.2 .home-page，原型 预览-更多面板.html RENDER.home） ----------
   作用域限定：全局 .sec-title 另有它用（专题编辑器等），不能动。
   原型节奏：hero 全宽出血，各区块自带 14px 侧边距（.kpis/.sec-title/.qa-grid padding、
   .todo-card/.chart-card margin 与 .cpg-scroll padding），hero 下方 KPI 上提 -14px 压圆角。 */
.home-page{padding-bottom:0}
.home-page .sec-title{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:700;padding:18px 14px 10px;margin:0}
.home-page .sec-title span{font-size:11px;color:var(--t3);font-weight:400}
.home-page .kpis{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:-14px;padding:0 14px}
.home-page .kpis > .kpi{background:#fff;border-radius:var(--r-lg);padding:13px 14px;box-shadow:var(--sh-card)}
.home-page .kpis > .kpi b{font-size:22px}
.home-page .kpis > .kpi.hot b{color:#E64545}
.home-page .kpis > .kpi.warn b{color:#F97316}
.home-page .kpis > .kpi p{font-size:11px;color:var(--t3);margin-top:2px}
.home-page .qa-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:0 14px}
.home-page .qa{background:#fff;border-radius:12px;padding:12px 4px;text-align:center;font-size:11px;color:var(--t2,#6B7280);box-shadow:var(--sh-card);border:none;cursor:pointer}
.home-page .qa .ico{width:40px;height:40px;margin:0 auto 6px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:19px}
.home-page .todo-card{background:#fff;border-radius:var(--r-lg);margin:0 14px;box-shadow:var(--sh-card);overflow:hidden}
.home-page .todo-item{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--bd);font-size:13px;cursor:pointer}
.home-page .todo-item:last-child{border:none}
.home-page .todo-item .dot{width:8px;height:8px;border-radius:50%;flex:0 0 auto}
.home-page .todo-item .t{flex:1;min-width:0}
.home-page .todo-item .t small{display:block;color:var(--t3);font-size:11px;margin-top:2px}
.home-page .chart-card{background:#fff;border-radius:var(--r-lg);margin:0 14px;padding:14px;box-shadow:var(--sh-card)}
.home-page .legend{display:flex;gap:12px;font-size:10px;color:var(--t3);margin-bottom:8px}
.home-page .legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:3px}
.home-page .bars{display:flex;align-items:flex-end;gap:8px;height:110px;padding-top:6px}
.home-page .bar-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%;justify-content:flex-end;cursor:pointer;min-width:0}
.home-page .bar-col .stack{width:70%;border-radius:5px 5px 0 0;overflow:hidden;display:flex;flex-direction:column-reverse;transition:filter .15s}
.home-page .bar-col .s1{background:#FCA5A5}
.home-page .bar-col .s2{background:#EF4444}
.home-page .bar-col span{font-size:9.5px;color:var(--t3);white-space:nowrap}
.home-page .cpg-scroll{display:flex;gap:10px;overflow-x:auto;padding:2px 14px 4px;scrollbar-width:none}
.home-page .cpg-scroll::-webkit-scrollbar{display:none}
/* 手机端：.home-page 负边距抵消 .content 12px 后即达屏幕边缘；
   与原型一致，页面本身不再加横向 padding（各板块自带 14px），
   hero 天然全宽（home-hero 基础规则里的负 margin 需清零，否则会溢出屏幕）。 */
@media (max-width:767px){
  .home-page{margin-left:calc(-1 * var(--cpad,12px));margin-right:calc(-1 * var(--cpad,12px));margin-top:calc(-1 * var(--cpad,12px))}
  .home-page .home-hero{margin:0}
}