:root{
  --bg:#f5f6f8; --panel:#fff; --panel-2:#fafbfc;
  --line:#e4e7ec; --line-2:#eef1f4;
  --text:#111827; --muted:#6b7280; --muted-2:#9ca3af;
  --accent:#1d4ed8; --accent-soft:#eef3ff; --accent-line:#c7d7fe;
  --up:#d92b2b; --down:#16a34a;
  --warn:#b45309; --warn-soft:#fff7ed;
  --ok:#047857; --ok-soft:#ecfdf5;
  --danger:#b91c1c; --danger-soft:#fef2f2;
  --radius:10px;
  --shadow:0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --shadow-lg:0 12px 40px rgba(16,24,40,.14);
  --sans:"PingFang SC","Microsoft YaHei","Segoe UI",-apple-system,system-ui,sans-serif;
  --mono:"JetBrains Mono",Consolas,"SF Mono",monospace;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:13.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--accent);text-decoration:none}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:#d3d8de;border-radius:6px;border:2px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:#b8bfc7}
::-webkit-scrollbar-track{background:transparent}

/* ---------- 布局 ---------- */
#app{display:flex;min-height:100vh}
.sidebar{width:206px;flex:0 0 206px;background:#fff;border-right:1px solid var(--line);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{padding:18px 18px 14px;border-bottom:1px solid var(--line-2)}
.brand h1{margin:0;font-size:15px;font-weight:700;letter-spacing:.3px;display:flex;align-items:center;gap:8px}
.brand .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.brand p{margin:4px 0 0;font-size:11px;color:var(--muted-2);letter-spacing:.5px}
.nav{padding:10px 10px;flex:1;overflow:auto}
.nav a{display:flex;align-items:center;gap:9px;padding:8px 11px;border-radius:8px;color:#374151;
  font-size:13px;margin-bottom:2px;transition:.12s;cursor:pointer}
.nav a:hover{background:#f3f4f6}
.nav a.on{background:var(--accent-soft);color:var(--accent);font-weight:600}
.nav a .ic{width:16px;text-align:center;opacity:.85}
.nav a .badge{margin-left:auto;background:#eef1f4;color:var(--muted);border-radius:20px;
  padding:0 7px;font-size:11px;font-weight:600}
.nav a.on .badge{background:#fff;color:var(--accent)}
.nav .sep{font-size:10.5px;color:var(--muted-2);padding:14px 11px 6px;letter-spacing:1px;font-weight:600}
.side-foot{padding:11px 14px;border-top:1px solid var(--line-2);font-size:11px;color:var(--muted-2)}

/* 侧边栏底部的当前用户条 —— 只有开启账号登录（DEALBOOK_AUTH=1）时才会渲染出来 */
.ubar{padding:11px 14px;border-top:1px solid var(--line-2);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.ubar-name{font-size:12.5px;font-weight:600;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ubar-role{font-size:10.5px;color:var(--muted-2);background:#f3f4f6;border-radius:20px;padding:1px 7px;white-space:nowrap}
.ubar-out{background:none;border:none;color:var(--muted-2);font-size:11px;cursor:pointer;padding:0;
  text-decoration:underline;font-family:inherit}
.ubar-out:hover{color:var(--danger)}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{height:54px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;
  gap:12px;padding:0 20px;position:sticky;top:0;z-index:20}
.topbar h2{margin:0;font-size:15.5px;font-weight:650}
.topbar .sub{font-size:12px;color:var(--muted)}
.topbar .spacer{flex:1}
.content{padding:20px;flex:1;min-width:0}

/* ---------- 通用件 ---------- */
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card-h{padding:13px 16px;border-bottom:1px solid var(--line-2);display:flex;align-items:center;gap:10px}
.card-h h3{margin:0;font-size:13.5px;font-weight:650}
.card-h .hint{font-size:11.5px;color:var(--muted-2);font-weight:400}
.card-b{padding:16px}
.grid{display:grid;gap:14px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media(max-width:1280px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.g2,.g3,.g4{grid-template-columns:1fr}}

.btn{display:inline-flex;align-items:center;gap:6px;padding:6px 13px;border-radius:7px;border:1px solid var(--line);
  background:#fff;cursor:pointer;font-size:12.5px;transition:.12s;white-space:nowrap}
.btn:hover{background:#f9fafb;border-color:#d1d5db}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:#1a44b8}
.btn.ghost{border-color:transparent;background:transparent;color:var(--muted)}
.btn.ghost:hover{background:#f3f4f6;color:var(--text)}
.btn.danger{color:var(--danger);border-color:#fecaca;background:var(--danger-soft)}
.btn.danger:hover{background:#fee2e2}
.btn.sm{padding:3px 9px;font-size:11.5px;border-radius:6px}
.btn:disabled{opacity:.5;cursor:not-allowed}

.inp,select.inp,textarea.inp{width:100%;padding:6px 10px;border:1px solid var(--line);border-radius:7px;
  background:#fff;outline:none;transition:.12s}
.inp:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
textarea.inp{resize:vertical;min-height:64px;line-height:1.65}
select.inp{cursor:pointer}
label.fl{display:block;font-size:11.5px;color:var(--muted);margin:0 0 4px;font-weight:500}
.field{margin-bottom:12px}

.tag{display:inline-flex;align-items:center;padding:1px 8px;border-radius:20px;font-size:11px;
  background:#f1f3f6;color:#4b5563;border:1px solid var(--line-2);white-space:nowrap}
.tag.b{background:var(--accent-soft);color:var(--accent);border-color:var(--accent-line)}
.tag.g{background:var(--ok-soft);color:var(--ok);border-color:#a7f3d0}
.tag.w{background:var(--warn-soft);color:var(--warn);border-color:#fed7aa}
.tag.r{background:var(--danger-soft);color:var(--danger);border-color:#fecaca}
.tag.k{background:#f3f4f6;color:#6b7280}

.kpi{padding:14px 16px}
.kpi .lb{font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:5px}
.kpi .vl{font-size:25px;font-weight:700;letter-spacing:-.5px;margin-top:3px;font-variant-numeric:tabular-nums}
.kpi .dl{font-size:11.5px;color:var(--muted-2);margin-top:2px}

/* ---------- 表格 ---------- */
.tbl-wrap{overflow:auto;border-radius:var(--radius)}
table.tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:12.5px}
table.tbl th{position:sticky;top:0;z-index:2;background:#fafbfc;text-align:left;padding:9px 11px;
  font-weight:600;color:var(--muted);border-bottom:1px solid var(--line);white-space:nowrap;font-size:11.5px}
table.tbl td{padding:9px 11px;border-bottom:1px solid var(--line-2);vertical-align:top}
table.tbl tbody tr{cursor:pointer;transition:.1s}
table.tbl tbody tr:hover{background:#f8fafc}
table.tbl tbody tr.sel{background:var(--accent-soft)}
.tnum{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.ell{max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pname{font-weight:600;color:#111827}
.pname:hover{color:var(--accent)}
.star{cursor:pointer;color:#d1d5db;font-size:14px;line-height:1}
.star.on{color:#f59e0b}

.pager{display:flex;align-items:center;gap:8px;padding:11px 14px;border-top:1px solid var(--line-2);
  font-size:12px;color:var(--muted)}

/* ---------- 筛选栏 ---------- */
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 14px;border-bottom:1px solid var(--line-2)}
.filters .inp{width:auto;min-width:110px}
.filters .search{min-width:250px;flex:1;max-width:420px}
.chips{display:flex;flex-wrap:wrap;gap:6px;padding:0 14px 12px}
.chip{padding:3px 10px;border-radius:20px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:11.5px;transition:.12s}
.chip:hover{border-color:#c9ced6}
.chip.on{background:var(--accent);border-color:var(--accent);color:#fff}

/* ---------- 抽屉 ---------- */
.mask{position:fixed;inset:0;background:rgba(17,24,39,.32);z-index:60;opacity:0;pointer-events:none;transition:.2s;backdrop-filter:blur(1px)}
.mask.on{opacity:1;pointer-events:auto}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(940px,94vw);background:var(--bg);z-index:61;
  box-shadow:var(--shadow-lg);transform:translateX(100%);transition:transform .22s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column}
.drawer.on{transform:translateX(0)}
.dhead{background:#fff;border-bottom:1px solid var(--line);padding:14px 20px;display:flex;align-items:flex-start;gap:12px}
.dhead h2{margin:0;font-size:17px;font-weight:680}
.dhead .meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.dtabs{background:#fff;border-bottom:1px solid var(--line);display:flex;gap:2px;padding:0 14px}
.dtabs button{border:0;background:0;padding:9px 13px;cursor:pointer;color:var(--muted);font-size:13px;
  border-bottom:2px solid transparent;margin-bottom:-1px}
.dtabs button.on{color:var(--accent);border-bottom-color:var(--accent);font-weight:600}
.dbody{flex:1;overflow:auto;padding:16px 20px 60px}

/* ---------- 时间线 ---------- */
.tl{position:relative;padding-left:20px}
.tl:before{content:'';position:absolute;left:5px;top:6px;bottom:6px;width:2px;background:var(--line)}
.tl-item{position:relative;margin-bottom:14px}
.tl-item:before{content:'';position:absolute;left:-19px;top:6px;width:10px;height:10px;border-radius:50%;
  background:#fff;border:2px solid var(--accent-line)}
.tl-item.hot:before{border-color:var(--accent);background:var(--accent)}
.tl-date{font-size:11.5px;color:var(--muted);font-variant-numeric:tabular-nums;font-weight:600}
.tl-body{background:#fff;border:1px solid var(--line);border-radius:8px;padding:9px 12px;margin-top:4px;font-size:12.5px}
.tl-body .cc{color:var(--muted);margin-top:5px;font-size:11.5px;border-top:1px dashed var(--line-2);padding-top:5px}

/* ---------- 上传 ---------- */
.drop{border:2px dashed var(--accent-line);border-radius:12px;padding:34px 20px;text-align:center;
  background:var(--accent-soft);cursor:pointer;transition:.15s}
.drop:hover,.drop.over{background:#e3ecff;border-color:var(--accent)}
.drop .big{font-size:15px;font-weight:600;margin-bottom:5px}
.drop .sm{font-size:12px;color:var(--muted)}

/* ---------- 图表 ---------- */
.chart{width:100%;height:250px}
.chart.tall{height:310px}

/* ---------- 其他 ---------- */
.empty{padding:40px 20px;text-align:center;color:var(--muted-2);font-size:13px}
.toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(20px);background:#111827;color:#fff;
  padding:9px 18px;border-radius:8px;font-size:12.5px;z-index:200;opacity:0;transition:.22s;pointer-events:none;max-width:70vw}
.toast.on{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{background:#991b1b}
.spin{display:inline-block;width:13px;height:13px;border:2px solid var(--accent-line);
  border-top-color:var(--accent);border-radius:50%;animation:sp .7s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}
.mut{color:var(--muted)}
.mut2{color:var(--muted-2)}
.sc{font-variant-numeric:tabular-nums;font-weight:600}
.row{display:flex;gap:10px;align-items:center}
.wrap{display:flex;flex-wrap:wrap;gap:8px}
.hr{height:1px;background:var(--line-2);margin:14px 0}
.pre{white-space:pre-wrap;font-size:12px;line-height:1.7;color:#374151;
  background:var(--panel-2);border:1px solid var(--line-2);border-radius:8px;padding:11px 13px;max-height:340px;overflow:auto}
.bar{height:6px;border-radius:4px;background:#eef1f4;overflow:hidden}
.bar>i{display:block;height:100%;background:var(--accent);border-radius:4px}
.hl{background:#fef08a;border-radius:2px}

/* ==========================================================
   移动端适配（≤768px）
   侧边栏转抽屉 · 项目列表转卡片 · 详情抽屉全屏 · 触控目标放大
   ========================================================== */
#b-menu{display:none}
.smask{position:fixed;inset:0;background:rgba(17,24,39,.32);z-index:65;opacity:0;pointer-events:none;transition:.2s}
.smask.on{opacity:1;pointer-events:auto}
.fab{display:none}

/* 卡片列表（仅移动端渲染，样式集中在此便于维护） */
.plist{display:flex;flex-direction:column;gap:10px}
.pcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px 13px;
  cursor:pointer;box-shadow:var(--shadow);transition:.1s}
.pcard:active{background:#f8fafc}
.pcard .pc-top{display:flex;align-items:flex-start;gap:8px}
.pcard .pc-name{font-weight:650;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard .pc-star{flex:none;font-size:16px;line-height:1.3;color:#d1d5db;cursor:pointer;padding:2px 4px}
.pcard .pc-star.on{color:#f59e0b}
.pcard .pc-sub{font-size:11.5px;color:var(--muted-2);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard .pc-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:7px}
.pcard .pc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:8px;font-size:11.5px;color:var(--muted)}
.pcard .pc-fu{margin-top:8px;padding-top:8px;border-top:1px dashed var(--line-2);font-size:11.5px;color:var(--muted)}
.pcard .pc-fu b{color:var(--muted)}

@media(max-width:768px){
  /* --- 侧边栏 → 抽屉 --- */
  #b-menu{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;font-size:17px;padding:0}
  .sidebar{position:fixed;left:0;top:0;bottom:0;z-index:70;width:250px;flex:none;
    transform:translateX(-100%);transition:transform .22s cubic-bezier(.4,0,.2,1);box-shadow:var(--shadow-lg)}
  .sidebar.open{transform:translateX(0)}

  .topbar{padding:0 12px;gap:8px;height:50px}
  .topbar h2{font-size:14.5px}
  .topbar .sub{display:none}          /* 手机上省空间，统计信息列表页里本来就有 */
  #pg-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px}
  #pg-actions .btn{padding:7px 10px;font-size:12px}
  .content{padding:12px}

  /* --- 详情抽屉 → 全屏 --- */
  .drawer{width:100vw}
  .dhead{padding:12px 14px}
  .dbody{padding:12px 12px 96px}
  .dtabs{padding:0 6px;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .dtabs button{padding:10px 11px;font-size:12.5px;white-space:nowrap;flex:none}

  /* --- 筛选栏 → 两列网格，搜索占满整行 --- */
  .filters{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px 12px}
  .filters .search{grid-column:1 / -1;max-width:none;min-width:0}
  .filters .inp{width:100%;min-width:0}
  .filters .chip{justify-content:center;padding:8px 10px}
  .chips{padding:0 12px 10px}

  /* 表格不再限高，横向滚动交给容器 */
  .tbl-wrap{max-height:none!important}

  /* --- 触控目标放大到 ≥40px --- */
  .btn{padding:9px 14px}
  .btn.sm{padding:7px 11px;font-size:12px}
  .pager{padding:10px 12px;flex-wrap:wrap;gap:10px}
  .chip{padding:7px 12px}
  .tag{padding:2px 9px;font-size:11.5px}
  .star{padding:4px}

  /* --- 图表降高 --- */
  .chart{height:210px}
  .chart.tall{height:250px}

  /* --- 底部浮动：记跟进（详情抽屉打开时才出现） --- */
  .fab.show{display:inline-flex;align-items:center;gap:6px;position:fixed;right:16px;bottom:20px;z-index:62;
    background:var(--accent);color:#fff;border:none;border-radius:24px;padding:13px 20px;font-size:14px;font-weight:600;
    box-shadow:0 6px 20px rgba(29,78,216,.35);cursor:pointer}
}

/* 平板竖屏别太挤 */
@media(max-width:1024px) and (min-width:769px){
  .filters .search{min-width:180px}
}
