/* ══════════════════════════════════════════════════════════════════
   移动端专用样式层 v0.7
   ──────────────────────────────────────────────────────────────────
   全部规则以 body.mobile-mode 为前缀，只有手机（App 外壳或窄屏浏览器）
   才会被加上这个类。电脑端永远不加，因此本文件对电脑端零影响。
   不依赖 @media：个别国产 ROM 会把 WebView 按桌面宽度渲染，纯媒体查询
   会整层失效，用类名分流可以兜住这种情况。
   ══════════════════════════════════════════════════════════════════ */

body.mobile-mode {
  font-size: 15px;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
}
body.mobile-mode * { -webkit-tap-highlight-color: transparent; }
body.mobile-mode [hidden] { display: none !important; }

/* ── 外壳：桌面侧栏 → 手机底部 5 格导航 ───────────────────────────── */
body.mobile-mode html, body.mobile-mode { height: auto; }
body.mobile-mode .shell {
  flex-direction: column;
  height: auto; min-height: 100vh; overflow: visible;
  padding-bottom: calc(60px + env(safe-area-inset-bottom));
}
body.mobile-mode .main { height: auto; min-height: 0; overflow: visible; width: 100%; }
body.mobile-mode .content {
  flex: 1; overflow: visible; overflow-x: hidden;
  /* 底部导航 58 + 详情页粘性操作条 ~62 + 呼吸空间，统一留白，不用 :has 兜兼容性 */
  padding: 12px 12px calc(132px + env(safe-area-inset-bottom));
  gap: 12px;
}

body.mobile-mode .sidebar {
  position: fixed; left: 0; right: 0; bottom: 0; top: auto; z-index: 60;
  width: auto; height: auto; flex: 0 0 auto;
  flex-direction: row; align-items: stretch;
  padding-bottom: env(safe-area-inset-bottom);
  box-shadow: 0 -2px 16px rgba(14, 27, 46, .2);
  background: var(--navy);
}
body.mobile-mode .side-logo,
body.mobile-mode .side-user { display: none !important; }
body.mobile-mode .nav {
  flex: 1; flex-direction: row; padding: 0; gap: 0; margin: 0;
  overflow: visible;
}
body.mobile-mode .nav-item,
body.mobile-mode .m-nav-more {
  flex: 1 1 0; min-width: 0; height: 58px; margin: 0; padding: 5px 2px;
  border-radius: 0; flex-direction: column; justify-content: center;
  align-items: center; gap: 3px;
  background: transparent; border: 0; color: #C9D6EC;
  font: inherit; cursor: pointer; text-decoration: none;
}
body.mobile-mode .nav-item span,
body.mobile-mode .m-nav-more span { font-size: 11px; line-height: 1.1; white-space: nowrap; }
body.mobile-mode .nav-item svg,
body.mobile-mode .m-nav-more svg { width: 20px; height: 20px; flex: 0 0 20px; opacity: .9; }
body.mobile-mode .nav-item.on { background: var(--blue); color: #fff; border-radius: 10px; }
body.mobile-mode .nav-item.on svg { opacity: 1; }
body.mobile-mode .nav-item .nc-count,
body.mobile-mode .nav-item [style*="margin-left:auto"] { position: absolute; margin-left: 26px; margin-top: -20px; }

/* ── 顶栏收成一行：长说明不再占两行 ──────────────────────────────── */
body.mobile-mode .topbar {
  height: auto; min-height: 0; flex-wrap: nowrap; align-items: center;
  padding: 9px 12px; gap: 8px; position: sticky; top: 0; z-index: 40;
  background: #fff;
}
body.mobile-mode .topbar > div:first-child { width: auto; flex: 1; min-width: 0; }
body.mobile-mode .topbar h1 {
  font-size: 17px; margin: 0; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
body.mobile-mode .topbar .sub { display: none; }
body.mobile-mode .topbar .right {
  margin-left: 0; position: static; gap: 6px; flex: 0 0 auto;
}
body.mobile-mode .topbar .right .badge { display: none; }
body.mobile-mode .topbar .right .btn { min-height: 38px; padding: 0 10px; font-size: 12px; }

/* ── 通用控件：触控目标与字号 ─────────────────────────────────────── */
body.mobile-mode .btn {
  height: 44px; min-height: 44px; padding: 0 14px; font-size: 14px;
  border-radius: 9px; font-weight: 500;
}
body.mobile-mode .btn-sm { height: 38px; min-height: 38px; padding: 0 10px; font-size: 13px; }
body.mobile-mode .btn-text { font-size: 14px; min-height: 38px; display: inline-flex; align-items: center; }
body.mobile-mode .input,
body.mobile-mode .select {
  height: 44px; min-height: 44px; font-size: 15px; border-radius: 9px;
}
body.mobile-mode textarea.input { height: auto; min-height: 92px; padding: 10px 12px; line-height: 1.6; }
body.mobile-mode .card { padding: 12px; border-radius: 12px; overflow-x: auto; }
body.mobile-mode .card-head { flex-wrap: wrap; gap: 6px; min-height: 0; }
body.mobile-mode .card-title { font-size: 15px; }
body.mobile-mode .card-note { display: none; }
body.mobile-mode .row { flex-wrap: wrap; gap: 8px; }
body.mobile-mode .small { font-size: 12px; }
body.mobile-mode .badge { font-size: 11px; padding: 3px 7px; }
body.mobile-mode .mchip { font-size: 11px; }

/* 内联 3 列 KPI：桌面写法绕开了媒体查询，这里强制收紧 */
body.mobile-mode [style*="repeat(3,1fr)"] {
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 8px !important;
}
body.mobile-mode .kpi { padding: 10px 8px; gap: 2px; border-radius: 10px; }
body.mobile-mode .kpi .k-label { font-size: 11px; line-height: 1.3; }
body.mobile-mode .kpi .k-value { font-size: 19px !important; line-height: 1.25; }
body.mobile-mode .kpi .k-note { display: none; }
body.mobile-mode .grid-kpi { grid-template-columns: repeat(2, 1fr); gap: 8px; }
body.mobile-mode .grid-2,
body.mobile-mode .grid-3,
body.mobile-mode .grid-4 { grid-template-columns: 1fr !important; }
body.mobile-mode .form-grid { grid-template-columns: 1fr; }
body.mobile-mode .form-grid .form-field[style*="span 2"] { grid-column: span 1 !important; }

/* ── 卡片流：一户一卡，主操作长在卡片底部 ────────────────────────── */
body.mobile-mode .m-list { display: flex; flex-direction: column; gap: 8px; }
body.mobile-mode .m-card {
  background: #fff; border: 1px solid var(--line); border-radius: 12px;
  padding: 10px 11px; display: flex; flex-direction: column; gap: 6px;
  box-shadow: 0 1px 3px rgba(16, 24, 40, .04);
}
body.mobile-mode .m-card.is-overdue { border-left: 3px solid var(--red); }
body.mobile-mode .m-card-top { display: flex; align-items: center; gap: 6px; }
body.mobile-mode .m-card-name {
  flex: 1; min-width: 0; font-size: 15.5px; font-weight: 700;
  color: var(--text); line-height: 1.3;
  /* 企业名最多两行，超出省略：一屏能多放半张卡 */
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  overflow: hidden;
}
body.mobile-mode .m-card-top .badge,
body.mobile-mode .m-card-top .mchip { flex: 0 0 auto; }
body.mobile-mode .m-card-sub {
  font-size: 12px; color: var(--text-3); line-height: 1.4;
  /* v0.8：只占一行，长标签省略，不再把卡片撑高三行 */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body.mobile-mode .m-fields {
  display: grid; grid-template-columns: 1fr 1fr; gap: 3px 10px;
}
body.mobile-mode .m-field { display: flex; flex-direction: row; align-items: baseline; gap: 4px; min-width: 0; }
body.mobile-mode .m-field.wide { grid-column: span 2; }
body.mobile-mode .m-field i {
  flex: 0 0 auto; font-style: normal; font-size: 11px; color: var(--text-4); line-height: 1.3;
}
body.mobile-mode .m-field b {
  flex: 1; min-width: 0; font-size: 12.5px; font-weight: 600; color: var(--text);
  line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body.mobile-mode .m-field b.danger { color: var(--red); }
body.mobile-mode .m-field b.warn { color: var(--orange); }
body.mobile-mode .m-field b.muted { color: var(--text-3); font-weight: 400; }
body.mobile-mode .m-ops { display: flex; gap: 6px; padding-top: 2px; }
body.mobile-mode .m-btn {
  flex: 1; min-width: 0; min-height: 42px; height: 42px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; font-family: inherit; font-size: 14.5px; font-weight: 600;
  text-decoration: none; cursor: pointer; border: 1px solid var(--line-3);
  background: #fff; color: var(--text-2); padding: 0 8px;
  white-space: nowrap;
}
body.mobile-mode .m-btn-primary { background: var(--blue); color: #fff; border-color: var(--blue); }
body.mobile-mode .m-btn-danger { color: var(--red); border-color: #F5C6C6; }
body.mobile-mode .m-btn:active { opacity: .8; }
body.mobile-mode .m-empty {
  padding: 32px 16px; text-align: center; display: flex;
  flex-direction: column; gap: 6px; color: var(--text-3);
}
body.mobile-mode .m-empty b { font-size: 15px; color: var(--text-2); font-weight: 600; }
body.mobile-mode .m-empty span { font-size: 12px; line-height: 1.6; }

/* ── 「更多」抽屉与筛选抽屉 ───────────────────────────────────────── */
body.mobile-mode .m-drawer-mask {
  position: fixed; inset: 0; z-index: 80; background: rgba(12, 22, 40, .48);
}
body.mobile-mode .m-drawer {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 81;
  background: #fff; border-radius: 16px 16px 0 0;
  padding: 16px 14px calc(20px + env(safe-area-inset-bottom));
  max-height: 82vh; overflow-y: auto;
  box-shadow: 0 -8px 30px rgba(12, 22, 40, .22);
}
body.mobile-mode .m-drawer-head {
  display: flex; align-items: center; justify-content: space-between;
  font-size: 16px; font-weight: 700; margin-bottom: 14px;
}
body.mobile-mode .m-drawer-close {
  border: 0; background: #F2F4F8; color: var(--text-2);
  border-radius: 8px; min-height: 36px; padding: 0 14px; font-size: 13px;
}
body.mobile-mode .m-drawer-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
body.mobile-mode .m-drawer-grid a,
body.mobile-mode .m-drawer-grid button {
  display: flex; align-items: center; gap: 8px; min-height: 48px;
  padding: 0 12px; border: 1px solid var(--line); border-radius: 10px;
  background: #fff; color: var(--text); font: inherit; font-size: 14px;
  text-decoration: none; cursor: pointer; text-align: left;
}
body.mobile-mode .m-drawer-grid svg { width: 17px; height: 17px; flex: 0 0 17px; opacity: .65; }
body.mobile-mode .m-drawer-foot {
  margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line);
  font-size: 12px; color: var(--text-4); line-height: 1.6;
}
body.mobile-mode .m-filter-bar {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 10px 12px; background: #fff; border: 1px solid var(--line);
  border-radius: 12px;
}
body.mobile-mode .m-filter-bar .m-filter-btn { flex: 0 0 auto; }
body.mobile-mode .m-filter-summary {
  flex: 1; min-width: 0; font-size: 12px; color: var(--text-3);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body.mobile-mode .m-filter-form { display: flex; flex-direction: column; gap: 10px; }
body.mobile-mode .m-filter-form label { font-size: 12px; color: var(--text-3); font-weight: 600; }
body.mobile-mode .m-filter-form .input,
body.mobile-mode .m-filter-form .select { width: 100% !important; }
body.mobile-mode .m-filter-actions { display: flex; gap: 8px; margin-top: 6px; }
body.mobile-mode .m-filter-actions .btn { flex: 1; }

/* ── 客户详情：信息网格 + 粘性底部主操作 ──────────────────────────── */
body.mobile-mode .detail-head {
  display: grid !important; grid-template-columns: 1fr 1fr; gap: 8px; align-items: center;
}
body.mobile-mode .detail-head .co { grid-column: 1 / -1; font-size: 19px; }
body.mobile-mode .detail-head .phone { grid-column: 1 / -1; font-size: 13px; max-width: 100%; }
body.mobile-mode .detail-head .st { grid-column: 1 / -1; font-size: 13px; }
body.mobile-mode .detail-head .btn { height: 42px; min-height: 42px; }
body.mobile-mode .detail-head .btn-dial,
body.mobile-mode .detail-head #btn-follow { display: none; }
body.mobile-mode .meta-4 { grid-template-columns: 1fr 1fr !important; }
body.mobile-mode .intent-bar .small.muted { display: none; }
body.mobile-mode .m-sticky {
  position: fixed; left: 0; right: 0;
  bottom: calc(58px + env(safe-area-inset-bottom)); z-index: 55;
  display: flex; gap: 10px; padding: 10px 12px;
  background: rgba(255, 255, 255, .97); border-top: 1px solid var(--line);
  box-shadow: 0 -4px 18px rgba(16, 24, 40, .1);
}
body.mobile-mode .m-sticky .m-btn { flex: 1; }

/* ── 通话统计：KPI 两列、明细卡片、台账表保留横滑 ─────────────────── */
body.mobile-mode .cs-page { gap: 12px; }
body.mobile-mode .cs-kpis { grid-template-columns: repeat(2, 1fr); gap: 8px; }
body.mobile-mode .cs-kpi { padding: 10px; }
body.mobile-mode .cs-kpi-value { font-size: 19px; }
body.mobile-mode .cs-kpi-note { font-size: 11px; }
body.mobile-mode .cs-notice {
  font-size: 11px; line-height: 1.6; max-height: 46px; overflow: hidden;
  position: relative;
}
body.mobile-mode .cs-notice:active { max-height: none; }
body.mobile-mode .cs-trend { overflow-x: auto; }
body.mobile-mode .cs-table-wrap { overflow-x: auto; }
body.mobile-mode .cs-table { min-width: 640px; }
body.mobile-mode .cs-toolbar .row > label { display: none; }
body.mobile-mode .cs-toolbar .input { width: 100% !important; }
body.mobile-mode .cs-toolbar .row { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
body.mobile-mode .cs-toolbar .row > .btn { width: 100%; }

/* ── 弹层：底部全屏化，头部与底部操作常驻 ────────────────────────── */
body.mobile-mode .modal-mask { align-items: flex-end; padding: 0; }
body.mobile-mode .modal {
  width: 100% !important; max-width: 100%;
  max-height: 92vh; border-radius: 14px 14px 0 0;
  padding: 18px 16px calc(16px + env(safe-area-inset-bottom));
}
body.mobile-mode .modal .m-head {
  position: sticky; top: -18px; z-index: 5;
  margin: -18px -16px 0; padding: 14px 16px 10px;
  background: #fff; border-bottom: 1px solid var(--line-3);
}
body.mobile-mode .modal .m-head > div:first-child { flex: 1; min-width: 0; }
body.mobile-mode .modal .m-foot { position: sticky; bottom: 0; background: #fff; padding-top: 10px; }
body.mobile-mode .modal-mask--center { align-items: center; justify-content: center; padding: 16px; }
body.mobile-mode .modal-mask--center .modal {
  width: calc(100% - 32px) !important; max-width: 420px;
  max-height: 78vh; border-radius: 14px; padding: 18px 16px;
}
body.mobile-mode .modal-mask--center .modal .m-head {
  position: static; margin: 0; padding: 0 0 10px; border: 0; background: transparent;
}
body.mobile-mode .modal-mask--center .modal .m-foot { position: static; background: transparent; }

/* ── 旧表格视图（管理员/未改造页）：兜住横向溢出，不撑破页面 ──────── */
body.mobile-mode .tr { min-width: 620px; }
body.mobile-mode .tr.head { display: none; }
body.mobile-mode .tbl { overflow-x: auto; }

/* ── 登录页 ──────────────────────────────────────────────────────── */
body.mobile-mode .login { flex-direction: column; height: 100vh; }
body.mobile-mode .login-brand { display: none; }
body.mobile-mode .login-side { padding: 24px 18px; width: 100%; }
body.mobile-mode .login-card { width: 100%; max-width: 380px; }
body.mobile-mode .btn-login { height: 48px; }
body.mobile-mode .force-pwd { padding: 16px; }
body.mobile-mode .force-pwd-card { padding: 24px 20px; }

/* ── 时间轴 / 提醒 ───────────────────────────────────────────────── */
body.mobile-mode .timeline { padding: 0; }
body.mobile-mode .tl-body { min-width: 0; }
body.mobile-mode .tl-text { word-break: break-word; font-size: 14px; }
body.mobile-mode .live-remind { flex-wrap: wrap; padding: 10px 12px; }
body.mobile-mode .live-remind .t { min-width: 0; font-size: 13px; }
body.mobile-mode .live-chips { max-width: 100%; }
body.mobile-mode .pager { flex-wrap: wrap; }

/* ── 电脑端：手机专用节点一律隐藏（本文件无条件加载，靠类名分流） ── */
body:not(.mobile-mode) .m-only { display: none !important; }

/* 管理员 / 内勤：本轮仍用完整菜单，保留横向滚动 */
body.mobile-mode .nav.is-scrolling {
  overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none;
}
body.mobile-mode .nav.is-scrolling::-webkit-scrollbar { display: none; }
body.mobile-mode .nav.is-scrolling .nav-item { flex: 1 0 auto; min-width: 66px; }

/* ── 公海：额度条换行、筛选抽屉 ──────────────────────────────────── */
body.mobile-mode .quota-bar { flex-wrap: wrap; gap: 10px; }
body.mobile-mode .quota-bar .q-mid { flex-wrap: wrap; width: 100%; }
body.mobile-mode .quota-bar .q-mid .progress { width: 100% !important; }
body.mobile-mode .quota-bar .q-mid .btn { width: 100%; }
body.mobile-mode #pool-filter {
  position: fixed; left: 0; right: 0; bottom: 58px; z-index: 81;
  display: none; flex-direction: column !important; align-items: stretch !important;
  max-height: 82vh; overflow-y: auto;
  padding: 14px 14px calc(16px + env(safe-area-inset-bottom)) !important;
  border-radius: 16px 16px 0 0; border: 1px solid var(--line);
  box-shadow: 0 -8px 30px rgba(12, 22, 40, .22);
  background: #fff;
}
body.mobile-mode #pool-filter.m-open { display: flex; }
body.mobile-mode #pool-filter .search-box,
body.mobile-mode #pool-filter .input,
body.mobile-mode #pool-filter .select { width: 100% !important; }
body.mobile-mode #pool-filter .spacer,
body.mobile-mode #pool-filter #result-count { display: none; }
body.mobile-mode #pool-filter .btn { width: 100%; }
body.mobile-mode #pool-filter .m-drawer-head { display: flex; margin-bottom: 4px; }

/* ── 我的客户：筛选按钮组收进底部抽屉 ──────────────────────────── */
body.mobile-mode #mine-filters {
  position: fixed; left: 0; right: 0; bottom: 58px; z-index: 81;
  display: none; flex-direction: column; align-items: stretch;
  max-height: 82vh; overflow-y: auto;
  padding: 14px 14px calc(16px + env(safe-area-inset-bottom));
  border-radius: 16px 16px 0 0; border: 1px solid var(--line);
  box-shadow: 0 -8px 30px rgba(12, 22, 40, .22); background: #fff;
}
body.mobile-mode #mine-filters.m-open { display: flex; }
body.mobile-mode #mine-filters .btn,
body.mobile-mode #mine-filters .select { width: 100% !important; margin-left: 0 !important; }
body.mobile-mode #mine-filters .card-note { display: none; }
body.mobile-mode #mine-filters .m-drawer-head { display: flex; margin-bottom: 4px; }

/* ── 详情页意向标签：手机上做成真正的按钮，而不是一排蓝色链接 ──── */
body.mobile-mode .intent-bar { display: flex; flex-wrap: wrap; gap: 8px; }
body.mobile-mode .intent-chip {
  flex: 1 1 42%; min-width: 0; min-height: 42px; height: 42px;
  border: 1px solid var(--line-3); background: #fff; color: var(--text-2);
  border-radius: 9px; font-size: 13px;
}
body.mobile-mode .intent-chip.on {
  background: var(--blue); color: #fff; border-color: var(--blue); font-weight: 600;
}

/* ── 详情页意向标签：手机上做成真正的按钮，而不是一排蓝色链接 ──── */
body.mobile-mode .intent-bar { display: flex; flex-wrap: wrap; gap: 8px; }
body.mobile-mode .intent-chip {
  flex: 1 1 42%; min-width: 0; min-height: 42px; height: 42px;
  border: 1px solid var(--line-3); background: #fff; color: var(--text-2);
  border-radius: 9px; font-size: 13px;
}
body.mobile-mode .intent-chip.on {
  background: var(--blue); color: #fff; border-color: var(--blue); font-weight: 600;
}

/* ══════════════════════════════════════════════════════════════════
   v0.8 号码选择弹窗：一企多号时先选号，单号直接呼出
   ──────────────────────────────────────────────────────────────────
   法人名下一串号码用 ; 分隔，直接拿第一个拨出去经常拨错人。
   这里做成底部弹窗，号码整行大字、可点整块热区（≥48px）。
   ══════════════════════════════════════════════════════════════════ */
.m-sheet-mask {
  position: fixed; inset: 0; z-index: 90;
  background: rgba(12, 22, 40, .5);
  display: flex; align-items: flex-end;
  animation: m-sheet-in .16s ease-out;
}
.m-sheet-mask[hidden] { display: none !important; }
@keyframes m-sheet-in { from { opacity: 0 } to { opacity: 1 } }
.m-sheet {
  width: 100%; background: #fff; border-radius: 16px 16px 0 0;
  padding: 14px 12px calc(12px + env(safe-area-inset-bottom));
  box-shadow: 0 -8px 30px rgba(12, 22, 40, .22);
}
.m-sheet-head {
  font-size: 15px; font-weight: 700; color: var(--text);
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px;
  padding: 0 4px 8px;
}
.m-sheet-head span {
  font-size: 12px; font-weight: 400; color: var(--text-3);
  max-width: 62%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.m-sheet-item {
  width: 100%; min-height: 52px; margin-bottom: 8px;
  display: flex; align-items: center; gap: 10px;
  padding: 0 12px; border: 1px solid var(--line); border-radius: 11px;
  background: #F7F9FC; font-family: inherit; cursor: pointer; text-align: left;
}
.m-sheet-item:active { background: #EDF2FA; }
.m-sheet-item b {
  flex: 1; min-width: 0; font-size: 17px; font-weight: 700; color: var(--text);
  letter-spacing: .3px; font-variant-numeric: tabular-nums;
}
.m-sheet-item em {
  flex: 0 0 auto; font-style: normal; font-size: 11px; color: #fff;
  background: var(--blue); border-radius: 6px; padding: 2px 6px;
}
.m-sheet-item em.gray { background: #9AA6B8; }
.m-sheet-item i {
  flex: 0 0 auto; font-style: normal; font-size: 12px; color: var(--text-3);
}
.m-sheet-cancel {
  width: 100%; min-height: 46px; margin-top: 2px;
  border: 0; border-radius: 11px; background: #F2F4F8; color: var(--text-2);
  font-family: inherit; font-size: 15px; font-weight: 600; cursor: pointer;
}

/* ══════════════════════════════════════════════════════════════════
   v0.9 今日待办「实时提醒」：手机端独立紧凑卡
   ──────────────────────────────────────────────────────────────────
   桌面 .live-remind 是「图标 + flex:1 文案 + nowrap 客户链接」横向排布；
   手机上 360px 宽时链接把文案挤到 ~40px，中文被压成一字一行、整卡半屏高。
   这里改成竖向三段：标题整行 → 说明整行 → 客户链接换行铺开。
   ══════════════════════════════════════════════════════════════════ */
body.mobile-mode .m-live {
  width: 100%; box-sizing: border-box; flex: 0 0 auto;
  display: flex; flex-direction: column; gap: 5px;
  padding: 9px 12px; margin-bottom: 2px;
  border: 1px solid #C3D6F5; border-radius: 10px;
  background: #F2F7FF; color: var(--blue);
}
body.mobile-mode .m-live.has-overdue {
  border-color: #F5C6C6; background: #FFF5F5; color: var(--red);
}
body.mobile-mode .m-live-top {
  display: flex; align-items: center; gap: 7px;
  font-size: 13.5px; line-height: 1.45; min-width: 0;
}
body.mobile-mode .m-live-ico { flex: 0 0 auto; display: inline-flex; align-items: center; }
body.mobile-mode .m-live-top b {
  flex: 1; min-width: 0; font-weight: 700; word-break: break-word;
}
body.mobile-mode .m-live-sub {
  font-size: 11.5px; line-height: 1.5; color: var(--text-3);
}
body.mobile-mode .m-live-chips {
  display: flex; flex-wrap: wrap; gap: 2px 10px; min-width: 0;
}
body.mobile-mode .m-live-chips a {
  display: inline-flex; align-items: center; min-height: 30px;
  font-size: 12.5px; color: var(--blue); text-decoration: none;
  white-space: normal; word-break: break-all;
}
body.mobile-mode .m-live-chips span { font-size: 11.5px; color: var(--text-3); }

/* ══════════════════════════════════════════════════════════════════
   第 19 轮：管理员 / 内勤页面手机适配
   根因（390px 真浏览器实测）：
   · rules / dashboard / import 用内联 display:flex 做左右两列，右侧固定
     400px 的卡片把左侧挤到 24px，card-title 逐字竖排、正文被裁；
   · staff / customers / commissions 的 620px 表格列被 flex 压缩，
     操作链接、分页按钮被挤到 18~25px 竖排。
   处理：两列改单列（!important 覆盖内联）+ 表格列不收缩、整表横滑。
   ══════════════════════════════════════════════════════════════════ */
body.mobile-mode .r19-cols {
  flex-direction: column !important;
  flex: 0 0 auto !important;
  min-height: 0 !important;
}
body.mobile-mode .r19-cols > * {
  flex: 0 0 auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: none !important;
}
body.mobile-mode .card,
body.mobile-mode .card.grow { min-width: 0; overflow-x: auto; }
body.mobile-mode .card-title {
  min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body.mobile-mode #view > div { min-width: 0; max-width: 100%; }

/* 旧表格：列保持声明宽度，整表左右滑动，不再逐字竖排。
   弹性列（内联 flex:1 / flex:1.4）的 basis 是 0，固定列占满后它会塌成 0 宽，
   企业名被挤成一字一行 —— 必须给足 basis 并禁止收缩。 */
body.mobile-mode .tr > .td { flex-shrink: 0 !important; }
body.mobile-mode .tr > .td[style*="flex:"],
body.mobile-mode .tr > .td.col {
  flex: 1 0 180px !important;
  min-width: 180px !important;
}
body.mobile-mode .btn-text { white-space: nowrap; }
/* 规则页「label + 数字控件」横向行改成上下两行，长标签不再折成三行 */
body.mobile-mode .form-row { flex-direction: column; align-items: stretch; }
body.mobile-mode .form-row .f-ctrl { margin-left: 0; justify-content: flex-start; }
body.mobile-mode .pager .pg {
  white-space: nowrap; min-width: 42px; text-align: center;
}

/* 我的客户搜索条：搜索框与筛选按钮同行，汇总换行到第二行 */
body.mobile-mode .mine-toolbar { flex-wrap: wrap; gap: 8px; padding: 10px; }
body.mobile-mode .mine-search-box { flex: 1 1 auto; min-width: 190px; }
body.mobile-mode .mine-search-box .input { max-width: none; flex: 1 1 100px; }
body.mobile-mode .mine-search-box .btn { flex: 0 0 auto; }
body.mobile-mode .mine-toolbar .m-filter-btn { flex: 0 0 auto; }
body.mobile-mode .mine-toolbar .m-filter-summary { flex: 1 1 100%; max-width: 100%; }

/* 选号抽屉：每个号码右侧一个明确的呼叫按钮 */
.m-sheet-item i.m-sheet-call {
  flex: 0 0 auto; font-style: normal; font-size: 12px; font-weight: 600;
  color: #fff; background: var(--blue); border-radius: 8px;
  padding: 6px 10px; min-width: 58px; text-align: center;
}
body.mobile-mode .detail-head .phone { white-space: normal; }
body.mobile-mode .dial-more-btn { min-height: 34px; padding: 4px 10px; }

/* 第 20 轮：通话明细分页与列头筛选在手机上的收纳 */
body.mobile-mode #cs-detail-card .cs-card-title { gap: 8px; }
body.mobile-mode .cs-filter-m { grid-template-columns: 1fr 1fr; }
body.mobile-mode .cs-filter-m .cs-filter-field.is-wide,
body.mobile-mode .cs-filter-m .cs-filter-actions { grid-column: 1 / -1; }
body.mobile-mode .cs-filter-m .cs-f { width: 100%; max-width: none; }
body.mobile-mode .cs-dur select.cs-f { width: 40%; }
body.mobile-mode .cs-dur input.cs-f { width: 26%; }
body.mobile-mode .cs-pager { gap: 8px; }
body.mobile-mode .cs-pager-btns { margin-left: 0; width: 100%; flex-wrap: wrap; }
body.mobile-mode .cs-pager-btns .btn { flex: 1 0 auto; }
body.mobile-mode .cs-help { font-size: 11.5px; }