:root {
  --primary: #667eea;
  --primary-dark: #5568d3;
  --success: #27ae60;
  --warning: #f39c12;
  --danger: #e74c3c;
  --info: #3498db;
  --bg: #f0f2f5;
  --card-bg: #fff;
  --text: #333;
  --text-light: #888;
  --border: #e8e8e8;
  --sidebar-w: 220px;
}
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:-apple-system,BlinkMacSystemFont,'Segoe UI','PingFang SC','Microsoft YaHei',sans-serif; background:var(--bg); color:var(--text); }

/* ===== Login Page ===== */
.login-page { position:fixed; inset:0; background:radial-gradient(900px 520px at 14% 12%, rgba(255,255,255,0.16), transparent 55%), radial-gradient(720px 520px at 86% 88%, rgba(0,0,0,0.18), transparent 55%), linear-gradient(135deg,#5b6cf0 0%,#764ba2 55%,#9d50bb 100%); display:flex; flex-direction:column; justify-content:center; align-items:center; gap:18px; padding:24px; overflow:auto; z-index:9999; }
.login-box { background:#fff; border-radius:16px; padding:40px; width:100%; max-width:380px; box-shadow:0 20px 60px rgba(0,0,0,0.3); box-sizing:border-box; }
.login-box .logo { text-align:center; margin-bottom:26px; }
.login-box .logo .brand-badge { width:70px; height:70px; border-radius:20px; margin:0 auto 14px; display:flex; align-items:center; justify-content:center; font-size:38px; background:linear-gradient(135deg,#667eea,#764ba2); box-shadow:0 12px 26px rgba(102,126,234,0.45); }
.login-box .logo h1 { font-size:30px; color:var(--primary); letter-spacing:1px; }
.login-box .logo p { font-size:13px; color:var(--text-light); margin-top:8px; }
.login-box .form-group { margin-bottom:16px; }
.login-box .form-group label { display:block; font-size:13px; color:var(--text-light); margin-bottom:6px; }
.login-box .form-group input { width:100%; padding:12px 14px; border:2px solid #e0e0e0; border-radius:8px; font-size:15px; outline:none; transition:border 0.2s; }
.login-box .form-group input:focus { border-color:var(--primary); }
.login-box .oneid-login { margin-top:8px; }
.login-box .btn-oneid { width:100%; padding:12px; background:linear-gradient(135deg,#06b6d4,#3b82f6); color:#fff; border:none; border-radius:8px; font-size:15px; cursor:pointer; transition:all 0.2s; font-weight:600; }
.login-box .btn-oneid:hover { transform:translateY(-1px); box-shadow:0 4px 12px rgba(59,130,246,0.4); }
.login-box .btn-oneid:disabled { opacity:0.6; cursor:not-allowed; }
.login-box .oneid-hint { text-align:center; font-size:12px; color:var(--text-light); margin-top:8px; }
.login-box .oneid-hint code { background:#eef2ff; color:#3b82f6; padding:2px 6px; border-radius:4px; font-weight:600; }
.login-box .pwd-login { margin-top:8px; }
.login-box .btn-login { width:100%; padding:12px; border:none; border-radius:9px; background:linear-gradient(135deg,#667eea,#764ba2); color:#fff; font-size:15px; font-weight:600; cursor:pointer; transition:all .2s; display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; box-sizing:border-box; }
.login-box .btn-login:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(102,126,234,0.35); }
.login-box .btn-login:disabled { opacity:.75; cursor:not-allowed; transform:none; box-shadow:none; }
.login-box .pwd-login .oneid-hint { color:#94a3b8; margin-top:10px; word-break:break-word; line-height:1.5; }
  .login-box .pwd-hint { text-align:center; font-size:12px; color:var(--text-light); margin-top:12px; }
.login-box .login-row { display:flex; align-items:center; justify-content:space-between; margin-top:12px; font-size:13px; }
.login-box .login-row label.remember { display:flex; align-items:center; gap:6px; color:var(--text-light); cursor:pointer; user-select:none; }
.login-box .login-row label.remember input { width:15px; height:15px; accent-color:var(--primary); cursor:pointer; }
.login-box .login-row a.forgot { color:var(--primary); text-decoration:none; font-weight:600; }
.login-box .login-row a.forgot:hover { text-decoration:underline; }
.login-divider { display:flex; align-items:center; color:#bbb; font-size:12px; margin:18px 0; }
.login-divider::before, .login-divider::after { content:''; flex:1; height:1px; background:#eee; }
.login-divider span { padding:0 12px; }
.login-quickref { background:rgba(255,255,255,0.97); border-radius:14px; padding:16px 20px; width:100%; max-width:380px; box-shadow:0 20px 60px rgba(0,0,0,0.3); box-sizing:border-box; }
.login-quickref .qr-title { font-size:15px; font-weight:700; color:var(--primary); margin-bottom:10px; display:flex; align-items:center; gap:6px; }
.login-quickref .qr-item { display:flex; flex-direction:column; padding:8px 10px; border-radius:8px; text-decoration:none; color:#1f2937; transition:background 0.15s; border:1px solid #eef0f5; margin-bottom:7px; }
.login-quickref .qr-item:hover { background:#f1f5ff; border-color:#c7d2fe; }
.login-quickref .qr-item .qr-label { font-size:14px; font-weight:600; }
.login-quickref .qr-item .qr-url { font-size:11px; color:#6b7280; margin-top:2px; word-break:break-all; }
.login-quickref .qr-hotline { margin-top:4px; padding:9px 10px; background:linear-gradient(135deg,#fff7ed,#fef3c7); border-radius:8px; font-size:13px; color:#92400e; text-align:center; }
.login-quickref .qr-hotline a { color:#b45309; font-weight:700; text-decoration:none; }
.login-error { color:var(--danger); font-size:13px; text-align:center; margin-bottom:12px; display:none; }
@media (max-width:420px){ .login-box { padding:28px 22px; border-radius:14px; } .login-box .logo h1 { font-size:24px; } .login-box .btn-login { font-size:14px; min-height:42px; } .login-quickref { padding:14px 16px; } }

/* ===== Sidebar ===== */
.sidebar { position:fixed; left:0; top:0; width:var(--sidebar-w); height:100vh; background:linear-gradient(180deg,#2c3e50,#1a252f); color:#fff; z-index:1000; display:flex; flex-direction:column; }
.sidebar .logo { padding:20px; text-align:center; border-bottom:1px solid rgba(255,255,255,0.1); }
.sidebar .logo h1 { font-size:18px; margin-bottom:4px; }
.sidebar .logo p { font-size:11px; opacity:0.6; }
.sidebar .nav { flex:1; padding:12px 0; overflow-y:auto; }
.sidebar .nav-item { display:flex; align-items:center; gap:10px; padding:12px 20px; cursor:pointer; transition:all 0.2s; font-size:14px; color:rgba(255,255,255,0.7); }
.sidebar .nav-item:hover { background:rgba(255,255,255,0.08); color:#fff; }
.sidebar .nav-item.active { background:var(--primary); color:#fff; }
.sidebar .nav-item .icon { font-size:18px; width:24px; text-align:center; }
.sidebar .nav-item .badge { margin-left:auto; background:var(--danger); color:#fff; font-size:11px; padding:1px 7px; border-radius:10px; }
.sidebar .nav-item .badge.green { background:var(--success); }
.sidebar .nav-item.role-tag { font-size:11px; opacity:0.5; cursor:default; padding:6px 20px; }
.sidebar .nav-item.role-tag:hover { background:none; }

/* ===== Sidebar Collapsible Groups ===== */
.sidebar .nav-group { border-bottom:1px solid rgba(255,255,255,0.06); }
.sidebar .nav-group-header { display:flex; align-items:center; gap:10px; padding:11px 18px 11px 20px; cursor:pointer; transition:all 0.2s; font-size:13px; color:rgba(255,255,255,0.75); font-weight:600; user-select:none; }
.sidebar .nav-group-header:hover { background:rgba(255,255,255,0.08); color:#fff; }
.sidebar .nav-group-header .icon { font-size:16px; width:22px; text-align:center; opacity:0.9; }
.sidebar .nav-group-header .arrow { margin-left:auto; font-size:10px; opacity:0.6; transition:transform 0.2s; transform:rotate(0deg); }
.sidebar .nav-group.open .nav-group-header .arrow { transform:rotate(90deg); }
.sidebar .nav-group-body { max-height:0; overflow:hidden; transition:max-height 0.25s ease; }
.sidebar .nav-group.open .nav-group-body { max-height:600px; }
.sidebar .nav-group-body .nav-item { padding:9px 14px 9px 36px; font-size:13px; }
.sidebar .footer { padding:12px 20px; font-size:11px; opacity:0.4; border-top:1px solid rgba(255,255,255,0.1); }
.sidebar .user-info { padding:12px 20px; border-top:1px solid rgba(255,255,255,0.1); font-size:13px; }
.sidebar .user-info .name { font-weight:600; }
.sidebar .user-info .role-badge { display:inline-block; padding:1px 8px; border-radius:3px; font-size:10px; margin-left:6px; }
.sidebar .user-info .role-super_admin { background:#e74c3c; color:#fff; }
.sidebar .user-info .role-manager { background:#f39c12; color:#fff; }
.sidebar .user-info .role-sales { background:#3498db; color:#fff; }
.sidebar .user-info .role-hr { background:#8e44ad; color:#fff; }
.sidebar .user-info .role-employee { background:#7f8c8d; color:#fff; }
.sidebar .user-info .logout { color:rgba(255,255,255,0.5); font-size:12px; cursor:pointer; margin-top:6px; display:inline-block; }
.sidebar .user-info .logout:hover { color:#fff; }

/* ===== Main ===== */
.main { margin-left:var(--sidebar-w); padding:20px; min-height:100vh; }
.page-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.page-header h2 { font-size:20px; }
.page-header .actions { display:flex; gap:10px; }

/* ===== Cards ===== */
.card { background:var(--card-bg); border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.06); padding:20px; margin-bottom:16px; }
.ep-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media(max-width:860px){ .ep-grid{ grid-template-columns:1fr; } }
.ep-card h3 { margin:0 0 14px; font-size:16px; color:var(--text); border-left:3px solid #3b82f6; padding-left:8px; }
.ep-row { display:flex; justify-content:space-between; padding:8px 0; border-bottom:1px dashed #eee; font-size:14px; }
.ep-row span { color:var(--text-light); }
.ep-card label { display:block; font-size:12px; color:var(--text-light); margin:10px 0 4px; }
.ep-card input, .ep-card textarea { width:100%; padding:9px 10px; border:1px solid var(--border); border-radius:7px; font-size:14px; box-sizing:border-box; font-family:inherit; }
.ep-card textarea { resize:vertical; }
.ep-card input:disabled, .ep-card textarea:disabled { background:#f5f5f5; color:#888; }
.ep-tip { background:#fff7e6; color:#b26a00; padding:8px 10px; border-radius:6px; font-size:12px; margin-bottom:8px; }
.ep-msg { margin-top:10px; font-size:13px; color:#27ae60; font-weight:600; }
.ep-chips { display:flex; flex-wrap:wrap; gap:10px; }
.ep-chip { background:#eef4ff; color:#1d4ed8; padding:7px 12px; border-radius:20px; font-size:13px; border:1px solid #d6e4ff; }
.cn-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:12px; }
.cn-card { border:1px solid #e5e7eb; border-radius:10px; padding:14px; background:#fafbfc; }
.cn-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.cn-name { font-weight:700; font-size:15px; color:#1f2937; }
.cn-status { color:#fff; font-size:12px; padding:4px 10px; border-radius:14px; font-weight:600; }
.cn-desc { font-size:13px; color:#4b5563; margin-bottom:8px; line-height:1.5; }
.cn-meta { font-size:12px; color:#374151; padding:3px 0; border-top:1px dashed #eee; }
.cn-meta span { color:#9ca3af; display:inline-block; width:110px; }
.cn-meta code { background:#f3f4f6; padding:2px 6px; border-radius:4px; word-break:break-all; font-size:11px; }
.cn-meta a { color:#2563eb; font-size:11px; word-break:break-all; }
.btn-mini { background:#2563eb; color:#fff; border:none; border-radius:6px; padding:5px 10px; font-size:12px; cursor:pointer; margin-top:6px; }
.btn-primary { background:linear-gradient(135deg,#3b82f6,#2563eb); color:#fff; border:none; border-radius:8px; padding:11px 18px; font-size:14px; cursor:pointer; font-weight:600; margin-top:12px; }

/* ===== Map (选址地图) ===== */
.map-toolbar { display:flex; align-items:center; gap:10px; margin-bottom:14px; flex-wrap:wrap; }
.map-toolbar label { font-size:14px; color:var(--text-light); }
.map-toolbar select, .map-toolbar input { padding:7px 10px; border:1px solid #d1d5db; border-radius:6px; font-size:13px; }
.map-wrap { display:grid; grid-template-columns:1fr 300px; gap:14px; }
.leaflet-map { height:560px; border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.08); background:#eef2f7; }
.site-list { background:var(--card-bg); border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.06); padding:14px; max-height:560px; overflow:auto; }
.sl-title { font-weight:700; font-size:14px; margin-bottom:10px; color:#1f2937; }
.sl-item { display:flex; gap:10px; align-items:flex-start; padding:9px 6px; border-bottom:1px dashed #eee; cursor:pointer; border-radius:6px; }
.sl-item:hover { background:#f3f6fb; }
.sl-dot { width:22px; height:22px; border-radius:50%; margin-top:2px; flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:12px; color:#fff; }
.sl-item b { font-size:13px; color:#1f2937; }
.sl-sub { font-size:11px; color:#6b7280; margin-top:2px; }
.map-filter { display:flex; align-items:center; gap:14px; margin-bottom:12px; flex-wrap:wrap; }
.mf-item { display:flex; align-items:center; gap:5px; font-size:13px; color:#374151; cursor:pointer; }
.mf-dot { width:12px; height:12px; border-radius:50%; display:inline-block; }
.map-legend { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:12px; padding:10px 14px; background:var(--card-bg); border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.06); font-size:12px; color:#374151; }
.lg-item { display:flex; align-items:center; gap:6px; }
.lg-dot { width:12px; height:12px; border-radius:50%; display:inline-block; }
@media (max-width:900px){ .map-wrap { grid-template-columns:1fr; } .leaflet-map { height:380px; } .site-list { max-height:none; } }

/* ===== Stats ===== */
.stats-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); gap:14px; margin-bottom:20px; }
.stat-card { background:var(--card-bg); border-radius:10px; padding:18px; box-shadow:0 2px 8px rgba(0,0,0,0.06); position:relative; overflow:hidden; }
.stat-card .icon { position:absolute; right:14px; top:14px; font-size:28px; opacity:0.15; }
.stat-card .num { font-size:28px; font-weight:700; line-height:1.2; }
.stat-card .label { font-size:13px; color:var(--text-light); margin-top:4px; }
.stat-card .sub { font-size:11px; color:var(--text-light); margin-top:3px; }
.stat-card.clickable { cursor:pointer; transition:transform 0.15s, box-shadow 0.15s; }
.stat-card.clickable:hover { transform:translateY(-2px); box-shadow:0 6px 16px rgba(0,0,0,0.12); }
.stat-card.clickable:active { transform:translateY(0); }
.clickable-bar { cursor:pointer; }
.clickable-bar:hover .bar-fill { filter:brightness(1.08); }
.clickable-pill { cursor:pointer; }
.clickable-pill:hover { filter:brightness(0.95); }

/* ===== Tables ===== */
.table-wrap { background:var(--card-bg); border-radius:10px; box-shadow:0 2px 8px rgba(0,0,0,0.06); overflow:auto; }
table { width:100%; border-collapse:collapse; font-size:13px; }
th { background:#f8f8f8; padding:10px 12px; text-align:left; color:var(--text-light); font-weight:600; white-space:nowrap; border-bottom:2px solid var(--border); }
td { padding:9px 12px; border-bottom:1px solid #f5f5f5; vertical-align:middle; }
tr:hover { background:#fafafa; }

/* ===== Badges ===== */
.badge { display:inline-block; padding:2px 8px; border-radius:4px; font-size:11px; font-weight:600; white-space:nowrap; }
.badge-new { background:#e8f4fd; color:#1890ff; }
.badge-contacted { background:#fff7e6; color:#fa8c16; }
.badge-interested { background:#f6ffed; color:#52c41a; }
.badge-negotiating { background:#f9f0ff; color:#722ed1; }
.badge-signed { background:#f0f9eb; color:#67c23a; }
.badge-lost { background:#fff1f0; color:#f5222d; }
.badge-high { background:#fff1f0; color:#e74c3c; }
.badge-mid { background:#fff7e6; color:#f39c12; }
.badge-low { background:#f0f9eb; color:#27ae60; }
.badge-blank { background:#e8f8e8; color:#27ae60; }
.badge-medium { background:#fff7e6; color:#f39c12; }
.badge-near { background:#fff1f0; color:#e74c3c; }
.badge-has { background:#fce4e4; color:#e74c3c; }
.cat-badge { display:inline-block; padding:2px 6px; border-radius:3px; font-size:11px; color:#fff; }
.badge-active { background:#f6ffed; color:#52c41a; }
.badge-disabled { background:#fff1f0; color:#f5222d; }

/* ===== Filter bar ===== */
.filter-bar { background:var(--card-bg); border-radius:10px; padding:14px 16px; margin-bottom:16px; box-shadow:0 2px 8px rgba(0,0,0,0.06); display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.filter-bar select, .filter-bar input { padding:7px 11px; border:1px solid #ddd; border-radius:6px; font-size:13px; outline:none; }
.filter-bar input { flex:1; min-width:150px; }
.filter-bar select:focus, .filter-bar input:focus { border-color:var(--primary); }
.filter-bar label { font-size:12px; color:var(--text-light); white-space:nowrap; }

/* ===== Buttons ===== */
.btn { padding:8px 16px; border:none; border-radius:6px; font-size:13px; cursor:pointer; transition:all 0.2s; display:inline-flex; align-items:center; gap:6px; }
.btn-primary { background:var(--primary); color:#fff; }
.btn-primary:hover { background:var(--primary-dark); }
.btn-success { background:var(--success); color:#fff; }
.btn-outline { background:#fff; border:1px solid #ddd; color:var(--text); }
.btn-outline:hover { border-color:var(--primary); color:var(--primary); }
.btn-sm { padding:4px 10px; font-size:12px; }
.btn-danger { background:var(--danger); color:#fff; }
.btn:disabled { opacity:0.4; cursor:not-allowed; }

/* 通知目标单选 */
.nt-radio { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border:1px solid #d1d5db; border-radius:20px; font-size:13px; cursor:pointer; color:#374151; background:#f9fafb; }
.nt-radio.active { background:linear-gradient(135deg,#3b82f6,#2563eb); color:#fff; border-color:transparent; }
.nt-radio input { accent-color:#2563eb; }

/* ===== Pagination ===== */
.pagination { display:flex; gap:6px; justify-content:center; align-items:center; padding:16px; }
.pagination button { padding:6px 12px; border:1px solid #ddd; background:#fff; border-radius:4px; cursor:pointer; font-size:13px; }
.pagination button.active { background:var(--primary); color:#fff; border-color:var(--primary); }
.pagination button:disabled { opacity:0.4; cursor:not-allowed; }
.pagination .info { font-size:13px; color:var(--text-light); margin:0 10px; }

/* ===== Modal ===== */
.modal-overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); z-index:2000; display:none; justify-content:center; align-items:flex-start; padding:40px 20px; overflow-y:auto; }
.modal-overlay.show { display:flex; }
.modal { background:#fff; border-radius:12px; width:100%; max-width:680px; box-shadow:0 8px 32px rgba(0,0,0,0.2); }
.modal-header { padding:16px 20px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; }
.modal-header h3 { font-size:17px; }
.modal-body { padding:20px; max-height:65vh; overflow-y:auto; }
.modal-footer { padding:12px 20px; border-top:1px solid var(--border); display:flex; justify-content:flex-end; gap:10px; }
.close-btn { background:none; border:none; font-size:24px; cursor:pointer; color:var(--text-light); padding:0 8px; }

/* ===== Form ===== */
.form-group { margin-bottom:14px; }
.form-group label { display:block; font-size:13px; color:var(--text-light); margin-bottom:4px; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:8px 12px; border:1px solid #ddd; border-radius:6px; font-size:14px; outline:none; }
.form-group textarea { resize:vertical; min-height:60px; }
.form-row { display:flex; gap:14px; }
.form-row .form-group { flex:1; }

/* ===== Radio group ===== */
.radio-group { display:flex; flex-wrap:wrap; gap:8px; }
.radio-item { display:flex; align-items:center; gap:4px; padding:6px 12px; border:2px solid #e0e0e0; border-radius:8px; cursor:pointer; font-size:13px; transition:all 0.2s; }
.radio-item:hover { border-color:var(--primary); }
.radio-item.selected { border-color:var(--primary); background:#f0f3ff; color:var(--primary); font-weight:600; }
.radio-item input { display:none; }

/* ===== Lead detail ===== */
.lead-detail .info-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px 20px; margin-bottom:16px; }
.lead-detail .info-item .key { font-size:12px; color:var(--text-light); margin-bottom:2px; }
.lead-detail .info-item .val { font-size:14px; font-weight:500; }
.lead-detail .call-log { background:#f9f9f9; border-radius:8px; padding:12px; margin-top:12px; }
.lead-detail .call-log-entry { padding:8px 0; border-bottom:1px solid #eee; font-size:13px; }
.lead-detail .call-log-entry:last-child { border-bottom:none; }
.lead-detail .call-log-entry .date { color:var(--text-light); font-size:12px; }

/* ===== Timeline ===== */
.timeline { position:relative; padding-left:24px; }
.timeline::before { content:''; position:absolute; left:7px; top:4px; bottom:4px; width:2px; background:#e0e0e0; }
.timeline-item { position:relative; padding-bottom:16px; }
.timeline-item::before { content:''; position:absolute; left:-22px; top:4px; width:12px; height:12px; border-radius:50%; background:#fff; border:3px solid var(--primary); }
.timeline-item.visit::before { border-color:var(--danger); }
.timeline-item.wechat::before { border-color:var(--success); }
.timeline-item.email::before { border-color:var(--info); }
.timeline-item.signed::before { border-color:var(--success); background:var(--success); }
.timeline-item .tl-date { font-size:12px; color:var(--text-light); }
.timeline-item .tl-type { font-size:12px; font-weight:600; padding:1px 6px; border-radius:3px; margin-left:6px; }
.timeline-item .tl-note { font-size:13px; margin-top:4px; color:#555; }
.timeline-item .tl-next { font-size:12px; color:var(--warning); margin-top:2px; }

/* ===== Charts ===== */
.chart-container { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-bottom:16px; }
.chart-card { background:var(--card-bg); border-radius:10px; padding:20px; box-shadow:0 2px 8px rgba(0,0,0,0.06); }
.chart-card h3 { font-size:15px; margin-bottom:16px; }
.chart-card.full { grid-column:1/-1; }
.bar-chart { display:flex; flex-direction:column; gap:8px; }
.bar-row { display:flex; align-items:center; gap:10px; font-size:13px; }
.bar-row .label { width:80px; text-align:right; color:var(--text-light); }
.bar-row .bar-track { flex:1; height:22px; background:#f0f0f0; border-radius:4px; overflow:hidden; }
.bar-row .bar-fill { height:100%; border-radius:4px; display:flex; align-items:center; padding:0 8px; color:#fff; font-size:11px; font-weight:600; min-width:30px; }

/* ===== Funnel ===== */
.funnel { display:flex; flex-direction:column; gap:4px; }
.funnel-row { display:flex; align-items:center; gap:12px; }
.funnel-row .f-label { width:80px; text-align:right; font-size:13px; color:var(--text-light); }
.funnel-row .f-bar { flex:1; height:32px; border-radius:4px; display:flex; align-items:center; padding:0 12px; color:#fff; font-size:13px; font-weight:600; position:relative; }
.funnel-row .f-pct { font-size:12px; color:var(--text-light); width:60px; text-align:right; }

/* ===== KPI Cards ===== */
.kpi-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:20px; }
.kpi-card { background:var(--card-bg); border-radius:10px; padding:18px; box-shadow:0 2px 8px rgba(0,0,0,0.06); border-left:4px solid var(--primary); }
.kpi-card.green { border-left-color:var(--success); }
.kpi-card.orange { border-left-color:var(--warning); }
.kpi-card.red { border-left-color:var(--danger); }
.kpi-card .kpi-label { font-size:12px; color:var(--text-light); margin-bottom:4px; }
.kpi-card .kpi-value { font-size:30px; font-weight:700; line-height:1; }
.kpi-card .kpi-sub { font-size:11px; color:var(--text-light); margin-top:4px; }

/* ===== Ranking table ===== */
.rank-table th { background:#f8f8f8; }
.rank-table .rank-num { font-weight:700; font-size:16px; }
.rank-table .rank-1 { color:#e74c3c; }
.rank-table .rank-2 { color:#f39c12; }
.rank-table .rank-3 { color:#f39c12; }

/* ===== Pending list ===== */
.pending-item { display:flex; align-items:center; gap:12px; padding:10px 14px; border-bottom:1px solid #f0f0f0; }
.pending-item:last-child { border-bottom:none; }
.pending-item.overdue { background:#fff1f0; }
.pending-item.today { background:#fff7e6; }
.pending-item.tomorrow { background:#f6ffed; }
.pending-item .p-status { font-size:11px; font-weight:600; padding:2px 8px; border-radius:3px; }
.pending-item.overdue .p-status { background:#e74c3c; color:#fff; }
.pending-item.today .p-status { background:#f39c12; color:#fff; }
.pending-item.tomorrow .p-status { background:#27ae60; color:#fff; }

/* ===== Checkbox ===== */
input[type="checkbox"] { width:16px; height:16px; cursor:pointer; }

/* ===== Team card ===== */
.team-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:16px; }
.team-card { background:var(--card-bg); border-radius:10px; padding:20px; box-shadow:0 2px 8px rgba(0,0,0,0.06); }
.team-card .avatar { width:50px; height:50px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:700; margin-bottom:12px; }
.team-card .name { font-size:16px; font-weight:600; margin-bottom:4px; }
.team-card .role { font-size:13px; color:var(--text-light); margin-bottom:8px; }
.team-card .stats { display:flex; gap:16px; margin-top:12px; }
.team-card .stat { text-align:center; }
.team-card .stat .num { font-size:20px; font-weight:700; }
.team-card .stat .label { font-size:11px; color:var(--text-light); }

/* ===== User management ===== */
.user-table th, .user-table td { text-align:left; }

/* ===== Task item ===== */
.task-item { display:flex; align-items:center; gap:12px; padding:10px 0; border-bottom:1px solid #f0f0f0; }
.task-item:last-child { border-bottom:none; }
.task-item input[type="checkbox"] { flex-shrink:0; }
.task-item .info { flex:1; }
.task-item .info .title { font-size:14px; }
.task-item .info .meta { font-size:12px; color:var(--text-light); }
.task-item.done .title { text-decoration:line-through; color:var(--text-light); }

/* ===== Toast ===== */
.toast { position:fixed; top:20px; right:20px; background:var(--success); color:#fff; padding:12px 20px; border-radius:8px; box-shadow:0 4px 16px rgba(0,0,0,0.2); z-index:3000; font-size:14px; display:none; }
.toast.show { display:block; animation:slideIn 0.3s; }
@keyframes slideIn { from{transform:translateX(100%);opacity:0} to{transform:translateX(0);opacity:1} }

/* ===== Hidden ===== */
.hidden { display:none !important; }

/* ===== Tel link ===== */
.tel-link { color:var(--success); text-decoration:none; font-weight:600; }
.tel-link:hover { text-decoration:underline; }

/* ===== 电话号码悬停即显拨号按钮（平时显示纯号码，光标移上去滑出📞，移动端常显） ===== */
.phone-hover { display:inline-flex; align-items:center; gap:0; white-space:nowrap; }
.phone-hover .phone-num { color:var(--success); font-weight:600; cursor:pointer; }
.phone-hover .dial-btn {
  display:inline-block; text-decoration:none; color:var(--primary); font-size:13px;
  opacity:0; max-width:0; overflow:hidden; vertical-align:middle; margin-left:0;
  transition:opacity .15s ease, max-width .18s ease, margin-left .18s ease;
}
.phone-hover:hover .dial-btn,
.phone-hover:focus-within .dial-btn { opacity:1; max-width:3.2em; margin-left:6px; }
/* 无悬停设备（手机/触屏）：拨号按钮常显，避免点不到 */
@media (hover:none){ .phone-hover .dial-btn{ opacity:1; max-width:3.2em; margin-left:6px; } }

/* ===== Permission banner ===== */
.perm-banner { background:#fff7e6; border:1px solid #ffe58f; border-radius:8px; padding:10px 16px; margin-bottom:16px; font-size:13px; color:#ad6800; display:flex; align-items:center; gap:8px; }

/* ===== Tabs ===== */
.tab-bar { display:flex; gap:8px; margin-bottom:16px; }
.tab-btn { padding:8px 16px; border:none; background:#fff; border-radius:6px; font-size:13px; cursor:pointer; border:1px solid #e0e0e0; color:var(--text-light); }
.tab-btn.active { background:var(--primary); color:#fff; border-color:var(--primary); }

/* ===== Field Check-in Slots ===== */
.checkin-slot { width:40px; height:40px; border-radius:8px; background:#f0f0f0; display:flex; align-items:center; justify-content:center; font-size:16px; color:#999; font-weight:600; border:2px solid #e0e0e0; }
.checkin-slot.done { background:linear-gradient(135deg,#27ae60,#2ecc71); color:#fff; border-color:#27ae60; }
.filter-row { display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.filter-row input, .filter-row select { padding:6px 10px; border:1px solid #e0e0e0; border-radius:6px; font-size:13px; }

/* ===== Cooperation Panel ===== */
.coop-section { margin-top:16px; border-top:2px solid var(--primary); padding-top:16px; }
.coop-section h4 { font-size:15px; margin-bottom:12px; color:var(--primary); display:flex; align-items:center; gap:6px; }
.coop-type-card { border:2px solid #e0e0e0; border-radius:10px; padding:14px; margin-bottom:10px; cursor:pointer; transition:all 0.2s; }
.coop-type-card:hover { border-color:var(--primary); background:#f8f9ff; }
.coop-type-card.selected { border-color:var(--primary); background:#f0f3ff; }
.coop-type-card .type-title { font-weight:600; font-size:14px; margin-bottom:4px; }
.coop-type-card .type-desc { font-size:12px; color:var(--text-light); }
.coop-type-card .type-rate { font-size:13px; color:var(--danger); font-weight:600; margin-top:4px; }
.mat-item { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid #f5f5f5; }
.mat-item:last-child { border-bottom:none; }
.mat-item .mat-name { flex:1; font-size:13px; }
.mat-item select { width:90px; padding:4px 8px; border:1px solid #ddd; border-radius:4px; font-size:12px; }
.mat-item .mat-note { flex:1; min-width:80px; padding:4px 8px; border:1px solid #ddd; border-radius:4px; font-size:12px; }
.mat-status-none { color:#ccc; }
.mat-status-requested { color:#f39c12; }
.mat-status-submitted { color:#3498db; }
.mat-status-verified { color:#27ae60; }
.mat-status-rejected { color:#e74c3c; }
.coop-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.coop-box { border:1px solid #e8e8e8; border-radius:8px; padding:12px; }
.coop-box h5 { font-size:13px; margin-bottom:8px; color:var(--text); }
.transformer-box { background:#fff8f0; border:1px solid #ffe0b2; border-radius:8px; padding:12px; margin-top:10px; }
.transformer-box h5 { color:#e65100; }

/* ===== Permission Matrix ===== */
.perm-matrix { overflow-x:auto; }
.perm-matrix table { font-size:12px; }
.perm-matrix th { padding:8px 10px; text-align:center; white-space:nowrap; }
.perm-matrix td { padding:6px 10px; text-align:center; }
.perm-matrix td.perm-name { text-align:left; font-weight:500; }
.perm-matrix .perm-group-header { background:#f0f0f5; font-weight:700; text-align:left; padding:6px 10px; }
.perm-checkbox { width:18px; height:18px; cursor:pointer; }
.perm-checkbox:disabled { cursor:not-allowed; opacity:0.4; }
.role-header { font-weight:700; padding:4px 8px; border-radius:4px; color:#fff; font-size:12px; display:inline-block; }

/* 线索标签 */
.lead-tags { display:block; margin-top:4px; }
.lead-tag-pill { display:inline-block; padding:1px 7px; border-radius:10px; font-size:11px; line-height:1.6; margin:1px 3px 1px 0; vertical-align:middle; }
.lead-tag-pill .lead-tag-x { cursor:pointer; font-weight:700; margin-left:2px; opacity:0.7; }
.lead-tag-pill .lead-tag-x:hover { opacity:1; }
.lead-tag-box { display:flex; flex-wrap:wrap; gap:5px; min-height:26px; padding:6px 8px; background:#fafafa; border:1px solid #eee; border-radius:6px; }
.lead-tag-chip { display:inline-block; padding:3px 10px; border-radius:14px; font-size:12px; cursor:pointer; user-select:none; transition:all .12s; }
.lead-tag-chip:hover { filter:brightness(0.95); transform:translateY(-1px); }
.lead-tag-box .lead-tag-pill .lead-tag-x { font-size:12px; }
/* 团队最近客户 */
.tc-summary { display:flex; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.tc-sum-card { background:#fff; border:1px solid #eee; border-radius:8px; padding:10px 16px; min-width:120px; }
.tc-sum-card b { font-size:22px; display:block; line-height:1.2; }
.tc-sum-card span { font-size:12px; color:#888; }
.tc-note { font-size:12px; color:#999; margin:0 0 16px; }
.tc-member { background:#fff; border:1px solid #eee; border-radius:10px; margin-bottom:16px; overflow:hidden; }
.tc-member-head { display:flex; justify-content:space-between; align-items:center; padding:12px 16px; background:#fafbfc; border-bottom:1px solid #f0f0f0; flex-wrap:wrap; gap:6px; }
.tc-avatar { display:inline-flex; width:28px; height:28px; border-radius:50%; background:var(--primary); color:#fff; align-items:center; justify-content:center; margin-right:8px; font-weight:700; vertical-align:middle; }
.tc-role { font-size:12px; color:#888; background:#eee; padding:1px 8px; border-radius:10px; margin-left:6px; }
.tc-member-stat { font-size:12px; color:#666; }
.tc-empty { padding:20px; text-align:center; color:#999; }
.tc-row { display:flex; align-items:center; gap:12px; padding:10px 16px; border-bottom:1px solid #f5f5f5; cursor:pointer; }
.tc-row:hover { background:#f8fbff; }
.tc-rank { width:22px; height:22px; border-radius:50%; background:#eef2f7; color:#667eea; font-weight:700; font-size:12px; display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.tc-name { flex:1 1 auto; min-width:0; }
.tc-name-t { font-weight:600; font-size:14px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tc-name-s { font-size:11px; color:#999; margin-top:2px; }
.tc-meters { flex:0 0 210px; display:flex; flex-direction:column; gap:5px; }
.tc-meter { display:flex; align-items:center; gap:6px; font-size:11px; color:#666; }
.tc-meter-l { width:24px; flex:0 0 auto; }
.tc-bar { flex:1 1 auto; height:7px; background:#eee; border-radius:4px; overflow:hidden; }
.tc-bar i { display:block; height:100%; }
.tc-meter b { width:22px; text-align:right; flex:0 0 auto; font-size:12px; }
.tc-importance { flex:0 0 auto; text-align:center; width:74px; }
.tc-badge { display:inline-block; color:#fff; font-size:11px; padding:2px 9px; border-radius:10px; font-weight:600; }
.tc-date { font-size:11px; color:#999; margin-top:3px; }
@media(max-width:760px){ .tc-meters{ flex-basis:140px; } .tc-importance{ width:60px; } }

/* ===== 移动端 H5 适配（全站响应式） ===== */
#menuToggle { display:none; position:fixed; top:10px; left:10px; z-index:1700; width:44px; height:44px; border-radius:12px; border:none; background:var(--primary); color:#fff; font-size:22px; line-height:1; box-shadow:0 4px 14px rgba(0,0,0,.28); cursor:pointer; align-items:center; justify-content:center; }
#sidebarBackdrop { display:none; }

@media (max-width: 820px) {
  /* 侧边栏改为抽屉式（手机/H5） */
  .sidebar { width:82vw; max-width:300px; transform:translateX(-100%); transition:transform .25s ease; z-index:1600; box-shadow:4px 0 24px rgba(0,0,0,.3); }
  .sidebar.open { transform:translateX(0); }
  #sidebarBackdrop { display:block; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1500; opacity:0; pointer-events:none; transition:opacity .25s ease; }
  #sidebarBackdrop.show { opacity:1; pointer-events:auto; }
  #menuToggle { display:flex; }

  /* 主内容占满屏宽，并给顶部悬浮按钮让位 */
  .main { margin-left:0; padding:12px; padding-top:64px; }
  .page-header { flex-direction:column; align-items:flex-start; gap:10px; }
  .page-header .actions { flex-wrap:wrap; width:100%; }

  /* 多列网格塌缩为单列/双列，杜绝横向溢出 */
  .kpi-grid { grid-template-columns:repeat(2,1fr); }
  .stats-grid { grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
  .chart-container { grid-template-columns:1fr; }
  .lead-detail .info-grid { grid-template-columns:1fr; }
  .ep-grid { grid-template-columns:1fr; }

  /* 卡片/表格紧凑化 */
  .card { padding:14px; }
  .table th, .table td { padding:8px 10px; }

  /* 弹窗在手机上留边距、避免贴边溢出 */
  .modal-overlay { padding:16px 10px; }
}

@media (max-width: 480px) {
  .kpi-grid { grid-template-columns:1fr; }
  .stats-grid { grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); }
  .main { padding:10px; padding-top:60px; }
  .page-header h2 { font-size:18px; }
}