:root{
  --brand:#1f5fd6; --brand-dark:#17499f; --ink:#1a2230; --muted:#6b7787;
  --line:#e3e8ef; --bg:#f4f6fa; --card:#ffffff; --err:#c0392b; --ok:#1f8a4c;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; color:var(--ink); background:var(--bg);
  font:15px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.center{
  min-height:100%; display:grid; place-items:center; padding:24px;
  background:
    radial-gradient(1200px 600px at 12% -12%, #e8efff 0%, rgba(232,239,255,0) 60%),
    radial-gradient(900px 500px at 112% 112%, #e6f4ec 0%, rgba(230,244,236,0) 55%),
    var(--bg);
}
.card{
  width:min(100%,380px); background:var(--card); border:1px solid var(--line);
  border-radius:16px; padding:30px 28px 24px;
  box-shadow:0 12px 32px rgba(20,35,70,.08), 0 2px 6px rgba(20,35,70,.04);
}
.brand{display:flex; align-items:center; gap:12px; margin-bottom:22px}
.brand img{width:42px; height:42px; display:block; border-radius:11px}
.brand h1{margin:0; font-size:19px; letter-spacing:.5px}
.brand .sub{margin:2px 0 0; font-size:12.5px; color:var(--muted)}
.field{margin-bottom:14px}
label{display:block; font-size:13px; color:var(--muted); margin:0 0 6px}
/* ⚠ 只作用于登录页的 .card。原来写成全局 input，把租赁表单也撑成满宽了 —— 踩过 */
.card input{
  width:100%; padding:11px 12px; font-size:15px; color:var(--ink);
  border:1px solid var(--line); border-radius:10px; background:#fbfcfe; outline:none;
  font-family:inherit;
}
.card input:focus{border-color:var(--brand); background:#fff; box-shadow:0 0 0 3px rgba(31,95,214,.13)}
.pw{position:relative}
.pw input{padding-right:64px}
.pw button{
  position:absolute; right:6px; top:50%; transform:translateY(-50%);
  border:0; background:transparent; color:var(--brand); font-size:13px;
  cursor:pointer; padding:6px 8px; border-radius:8px; font-family:inherit;
}
.pw button:hover{background:#eef3ff}
.err{
  margin:2px 0 12px; color:var(--err); font-size:13.5px;
  background:#fdf1ef; border:1px solid #f6d9d4; padding:9px 11px; border-radius:9px;
}
.btn{
  width:100%; padding:12px; font-size:15.5px; font-weight:600; letter-spacing:2px;
  color:#fff; background:var(--brand); border:0; border-radius:10px;
  cursor:pointer; font-family:inherit;
}
.btn:hover{background:var(--brand-dark)}
.btn:disabled{background:#9db4e0; cursor:default}
.hint{margin:16px 0 0; font-size:12px; color:var(--muted); text-align:center; line-height:1.7}

/* ── 登录之后的占位页 ── */
.shell{min-height:100%; display:flex; flex-direction:column}
.top{display:flex; align-items:center; gap:10px; padding:11px 20px; background:#fff; border-bottom:1px solid var(--line)}
.top img{width:28px; height:28px; border-radius:8px}
.top .t1{font-weight:600}
.top .t2{color:var(--muted); font-size:12.5px}
.top .who{margin-left:auto; color:var(--muted); font-size:13px; display:flex; align-items:center; gap:10px}
.top .who b{color:var(--ink); font-weight:600}
.linkbtn{border:1px solid var(--line); background:#fff; border-radius:8px; padding:6px 12px; font-size:13px; cursor:pointer; color:var(--ink); font-family:inherit}
.linkbtn:hover{background:#f2f5fa}
.body{flex:1; display:grid; place-items:center; padding:28px}
.panel{width:min(100%,560px); background:#fff; border:1px solid var(--line); border-radius:16px; padding:26px}
.panel h2{margin:0 0 10px; font-size:17px}
.panel p{margin:6px 0; color:var(--muted); font-size:14px}
.panel .fine{margin-top:16px; color:#8a94a3; font-size:13px}
.pill{display:inline-block; font-size:12px; color:var(--ok); background:#eaf7ef; border:1px solid #cfe9da; padding:2px 9px; border-radius:999px; vertical-align:2px}
code{background:#f2f5fa; border:1px solid var(--line); border-radius:6px; padding:1px 5px; font-size:13px}

/* ── 首页：业务板块 ── */
.home{width:min(100%,860px)}
.h2{margin:0 0 16px;font-size:15px;color:var(--muted);font-weight:600;letter-spacing:1px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.mod{display:block;background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px;text-decoration:none;color:var(--ink);transition:.15s}
.mod:hover{border-color:var(--brand);box-shadow:0 10px 24px rgba(20,35,70,.10);transform:translateY(-1px)}
.mod.off{opacity:.45;cursor:default}
.mod.off:hover{border-color:var(--line);box-shadow:none;transform:none}
.mod-t{font-size:22px;font-weight:700;letter-spacing:4px}
.mod-d{margin-top:8px;font-size:13px;color:var(--muted);line-height:1.7}
.mod-go{margin-top:16px;font-size:13px;color:var(--brand);font-weight:600}
.mod.off .mod-go{color:var(--muted)}
.home-link{color:var(--muted);text-decoration:none;font-size:14px}
.home-link:hover{color:var(--brand)}

/* ── 子模块导航 ── */
.subnav{display:flex;gap:4px;padding:0 20px;background:#fff;border-bottom:1px solid var(--line);overflow-x:auto}
.subnav a,.subnav span{padding:11px 12px;font-size:14px;white-space:nowrap;border-bottom:2px solid transparent;color:var(--muted);text-decoration:none}
.subnav a.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.subnav .off{color:#b6bec9}
.subnav i{font-style:normal;font-size:11px;margin-left:4px;background:#f0f2f6;border-radius:4px;padding:1px 4px}

/* ── 看板 ── */
.panel.wide{width:min(100%,1080px)}
.filters{display:flex;flex-direction:column;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--line);margin-bottom:16px}
.frow{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.flab{font-size:13px;color:var(--muted);min-width:56px}
.flab.mid{margin-left:12px;min-width:auto}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{border:1px solid var(--line);background:#fff;border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer;color:var(--muted);font-family:inherit}
.chip:hover{border-color:var(--brand);color:var(--brand)}
.chip.on{background:#eef3ff;border-color:#bcd0f7;color:var(--brand-dark);font-weight:600}
.chip.floor.on{background:#eaf7ef;border-color:#cfe9da;color:var(--ok)}
input[type=date],input.yr{padding:7px 10px;border:1px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;color:var(--ink)}
input.yr{width:90px}
.mini{border:1px solid var(--line);background:#fff;border-radius:9px;padding:7px 14px;font-size:13px;cursor:pointer;font-family:inherit}
.mini:hover{background:#f2f5fa}
.tablewrap{overflow-x:auto}
table.grid{width:100%;border-collapse:collapse;font-size:14px}
table.grid th,table.grid td{padding:9px 10px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
table.grid th{font-size:12.5px;color:var(--muted);font-weight:600;background:#fafbfd}
table.grid th em{font-style:normal;font-size:11px;color:#a8b0bb}
table.grid .r{text-align:right;font-variant-numeric:tabular-nums}
table.grid tbody tr:hover{background:#fafbfd}
table.grid tfoot td{font-weight:700;background:#f7f9fc;border-top:2px solid var(--line)}
.rate{font-weight:600}
.rate.hi{color:var(--ok)}
.rate.lo{color:var(--err)}
.msg{margin:0 0 12px;padding:9px 11px;border-radius:9px;background:#fdf1ef;border:1px solid #f6d9d4;color:var(--err);font-size:13.5px}
.warn{margin-top:16px;padding:12px 14px;border-radius:10px;background:#fff8e8;border:1px solid #f0dfb8;font-size:13.5px;line-height:1.8}
.warn b{color:#a06a00}
.src{margin:14px 0 0;font-size:12px;color:#9aa3ae;line-height:1.8}

/* ── 查询方式开关 ── */
.seg{display:inline-flex;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff}
.seg button{border:0;background:transparent;padding:7px 16px;font-size:13.5px;color:var(--muted);cursor:pointer;font-family:inherit;border-right:1px solid var(--line)}
.seg button:last-child{border-right:0}
.seg button:hover{background:#f6f8fc;color:var(--brand)}
.seg button.on{background:var(--brand);color:#fff;font-weight:600}
.seg button.on:hover{background:var(--brand-dark);color:#fff}
.src b{color:var(--ink);font-weight:600}

.stale{margin:0 0 12px;padding:10px 12px;border-radius:9px;background:#fdf1ef;border:1px solid #f6d9d4;color:#8a2b1f;font-size:13.5px;line-height:1.8}
.stale b{color:var(--err)}
.stale code{background:#fff;border:1px solid #f0cdc7;border-radius:5px;padding:1px 5px;font-size:12.5px}

/* ── 子导航改成按钮 ── */
.subnav button{border:0;background:transparent;padding:11px 12px;font-size:14px;white-space:nowrap;border-bottom:2px solid transparent;color:var(--muted);cursor:pointer;font-family:inherit}
.subnav button:hover{color:var(--brand)}
.subnav button.on{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
/* ── 欠费明细 ── */
.sel{padding:7px 10px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;color:var(--ink);background:#fff}
.search{padding:8px 11px;border:1px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;min-width:190px;color:var(--ink)}
.chk{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;color:var(--muted);cursor:pointer}
.chip i{font-style:normal;margin-left:5px;font-size:11px;opacity:.65}
.chip.on i{opacity:.9}
.chip.b0.on{background:#eaf7ef;border-color:#cfe9da;color:var(--ok)}
.chip.b1.on,.chip.b2.on{background:#fff6e5;border-color:#f0dfb8;color:#a06a00}
.chip.b3.on,.chip.b4.on{background:#fdf1ef;border-color:#f6d9d4;color:var(--err)}
.chip.b5.on{background:#f2f5fa;border-color:#d8dee7;color:var(--ink)}
.stats{display:flex;gap:22px;flex-wrap:wrap;margin:0 0 14px;font-size:13.5px;color:var(--muted)}
.stats b{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
td.strong{font-weight:700}
td.note{max-width:260px;white-space:normal;color:var(--muted);font-size:12.5px;line-height:1.6}
.tag{display:inline-block;font-size:11.5px;border-radius:5px;padding:2px 6px;background:#f2f5fa;border:1px solid var(--line);color:var(--muted);white-space:nowrap}
.tag.b0{background:#eaf7ef;border-color:#cfe9da;color:var(--ok)}
.tag.b1,.tag.b2{background:#fff6e5;border-color:#f0dfb8;color:#a06a00}
.tag.b3,.tag.b4{background:#fdf1ef;border-color:#f6d9d4;color:var(--err)}

/* ── 欠费明细：列表宽，让它用满窗口；窄屏自动收次要列 ── */
#panel-arrears{width:100%;max-width:none;padding:22px 18px}
#panel-arrears table.grid{font-size:13.5px}
#panel-arrears table.grid th,#panel-arrears table.grid td{padding:8px 7px}
#panel-arrears .nw{white-space:nowrap}
#panel-arrears .ell{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#panel-arrears .ell-sm{max-width:118px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#panel-arrears td.note{max-width:150px}
@media (max-width:1300px){#panel-arrears .hide-md{display:none}}
@media (max-width:1000px){#panel-arrears .hide-sm{display:none}}

#panel-arrears .ell{max-width:180px}

/* ── 汇总看板：板块汇总 ── */
.sec{margin:0 0 10px;font-size:14px;font-weight:700;color:var(--ink)}
.sec em{font-style:normal;font-weight:400;font-size:12px;color:var(--muted);margin-left:6px}
.sec:not(:first-child){margin-top:26px}
table.grid.mk{margin-bottom:4px}
table.grid.mk th,table.grid.mk td{padding:8px 10px}
table.grid.mk tr.sum td{font-weight:700;background:#f7f9fc;border-top:2px solid var(--line)}
table.grid.mk td.strong{font-weight:700;color:var(--err)}

/* ── 空余房源明细浮窗 ── */
.modal{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;padding:24px}
.modal-mask{position:absolute;inset:0;background:rgba(16,24,40,.45)}
.modal-box{position:relative;background:#fff;border-radius:16px;width:min(760px,100%);max-height:82vh;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(16,24,40,.28);overflow:hidden}
.modal-head{display:flex;align-items:center;justify-content:space-between;padding:15px 20px;border-bottom:1px solid var(--line)}
.modal-head b{font-size:15px}
.modal-box .stats{padding:14px 20px 0;margin:0}
.modal-box .tablewrap{overflow:auto;padding:12px 20px 20px}
.modal-box table.grid th{position:sticky;top:0}
.dim{color:var(--muted);font-size:12px}
.openvac{padding:5px 12px}

/* ── 全局兜底：hidden 必须永远管用 ──
   踩过的坑：给浮窗写了 .modal{display:flex}，把 hidden 的 display:none 盖掉了
   → 浮窗一进页面就弹出来，而且关不掉。以后谁都别再踩。 */
[hidden]{display:none !important}

/* ── 合同录入 ── */
.form{display:flex;flex-direction:column;gap:14px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.form .frow{align-items:center}
.form .frow.top{align-items:flex-start}
.txt{padding:8px 11px;border:1px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;color:var(--ink);background:#fff}
.txt.sm{width:120px}
.txt.wide{min-width:260px;flex:0 1 300px}
.dash{color:var(--muted);font-size:13px}
.btn-inline{border:0;background:var(--brand);color:#fff;border-radius:9px;padding:9px 20px;font-size:14px;font-weight:600;cursor:pointer;font-family:inherit}
.btn-inline:hover{background:var(--brand-dark)}
.btn-inline:disabled{background:#9db4e0;cursor:default}
.picker{border:1px solid var(--line);border-radius:10px;max-width:640px;width:100%;background:#fff}
.picker-head{display:flex;gap:10px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line)}
.picker-list{max-height:190px;overflow:auto;padding:8px;display:flex;flex-wrap:wrap;gap:6px}
.picker-list label{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;border:1px solid var(--line);border-radius:999px;padding:3px 10px;cursor:pointer;white-space:nowrap}
.picker-list label:hover{border-color:var(--brand)}
.picker-list label.on{background:#eef3ff;border-color:#bcd0f7;color:var(--brand-dark);font-weight:600}
.picker-list label .t{color:var(--muted);font-size:11px}
.charges{display:flex;flex-wrap:wrap;gap:10px}
.charges .chg{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:9px;padding:5px 9px;background:#fff}
.charges .chg span{font-size:13px;color:var(--muted)}
.charges .chg input{width:110px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;font-size:13.5px;font-family:inherit;text-align:right;font-variant-numeric:tabular-nums}

/* ── 房源选择器（按钮式）── */
.picker-list .uchip{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12.5px;cursor:pointer;background:#fff;color:var(--ink);font-family:inherit}
.picker-list .uchip:hover{border-color:var(--brand);color:var(--brand)}
.picker-list .uchip.on{background:#eef3ff;border-color:#bcd0f7;color:var(--brand-dark);font-weight:600}
.picker-list .uchip .t{color:var(--muted);font-size:11px;font-weight:400}
.msg.ok{background:#eaf7ef;border-color:#cfe9da;color:var(--ok)}

/* ── 合同录入表单：控件宽度写清楚，别再靠全局样式 ── */
.form .sel{width:auto}
.form input[type=date]{width:160px}
.form .txt{width:180px}
.form .txt.sm{width:120px}
.form .txt.wide{width:280px}
.form .search{flex:1;min-width:160px}
.picker-head .search{flex:1}
.charges .chg input{width:110px}

/* ── 已选房源（房号 + 面积成对录入）── */
.picked{border:1px solid var(--line);border-radius:10px;background:#fff;max-width:640px;width:100%;padding:4px 10px 8px}
.mini-table{width:100%;border-collapse:collapse;font-size:13px}
.mini-table th{text-align:left;font-weight:600;color:var(--muted);font-size:12px;padding:7px 6px;border-bottom:1px solid var(--line)}
.mini-table th.r{text-align:right}
.mini-table td{padding:5px 6px;border-bottom:1px solid #f1f4f9}
.mini-table tr:last-child td{border-bottom:0}
.mini-table input{width:110px;padding:6px 8px;border:1px solid var(--line);border-radius:7px;font-size:13px;font-family:inherit;text-align:right;font-variant-numeric:tabular-nums}
.mini-table input.bad{border-color:var(--err);background:#fff5f5}
.mini-table .x{border:0;background:none;color:var(--muted);cursor:pointer;font-size:15px;padding:0 4px}
.mini-table .x:hover{color:var(--err)}
.picked .empty{color:var(--muted);font-size:12.5px;padding:10px 6px}
.picked .tot{color:var(--muted);font-size:12px;padding:6px}

.avail{font-size:12px;font-variant-numeric:tabular-nums}
.avail.ok{color:var(--ok)}
.avail.low{color:#b7791f}
.avail.none{color:var(--err);font-weight:600}
.avail small{display:block;color:var(--muted);font-weight:400;font-size:11px;margin-top:1px}

/* ── 费用项：逐项加，不是八个框全摆着 ── */
.chg-wrap{display:flex;flex-direction:column;gap:9px;max-width:560px;width:100%}
.chg-row{display:flex;align-items:center;gap:8px}
.chg-row select{padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;background:#fff;width:130px;color:var(--ink)}
.chg-row .chg-amt{width:150px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;text-align:right;font-variant-numeric:tabular-nums}
.chg-row .chg-amt.bad{border-color:var(--err);background:#fff5f5}
.chg-row .chg-unit{color:var(--muted);font-size:12.5px}
.chg-row .x{border:0;background:none;color:var(--muted);cursor:pointer;font-size:17px;line-height:1;padding:0 5px}
.chg-row .x:hover{color:var(--err)}
.chg-empty{color:var(--muted);font-size:12.5px}
.chg-foot{display:flex;align-items:center;gap:12px}

.modal-box.big{width:min(1100px,100%)}
.modal-box .tablewrap table.grid{width:100%}

/* ── 合同台账的搜索栏 ── */
.ledger-bar{display:flex;align-items:center;gap:10px;padding:12px 20px 0;flex-wrap:wrap}
.ledger-bar .search{flex:1;min-width:220px;padding:8px 11px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);outline:none}
.ledger-bar .search:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(31,95,214,.12)}
.ledger-bar .sel{padding:8px 10px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);width:auto}

/* ── 客户信息页 ── */
.cust-bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:16px}
.cust-bar .search{flex:1;min-width:220px;padding:9px 12px;border:1px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;background:#fff;color:var(--ink);outline:none}
.cust-bar .search:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(31,95,214,.12)}
.cust-bar .sel{padding:9px 10px;border:1px solid var(--line);border-radius:9px;font-size:14px;font-family:inherit;background:#fff;color:var(--ink);width:auto}
.stage{display:inline-block;padding:2px 9px;border-radius:999px;font-size:12px;font-weight:600}
.stage.s0{background:#eef1f6;color:#5b6b82}
.stage.s1{background:#e8f1ff;color:#1f5fd6}
.stage.s2{background:#fff4e0;color:#b7791f}
.stage.s3{background:#eaf7ef;color:var(--ok)}
.stage.s4{background:#fdeaea;color:var(--err)}

/* ── 客户 / 联系人 头像 ── */
.avatars{align-items:center}
.av-box{display:flex;flex-direction:column;align-items:center;gap:4px}
.av{width:72px;height:72px;border-radius:50%;border:1px dashed #c6d2e3;background:#f4f7fb no-repeat center/cover;cursor:pointer;padding:0;position:relative;overflow:hidden;font-size:22px;color:#9db0c8}
.av:hover{border-color:var(--brand)}
.av.has{border-style:solid;border-color:var(--line)}
.av-del{position:absolute;right:0;top:0;width:20px;height:20px;border-radius:50%;border:0;background:rgba(20,30,45,.55);color:#fff;font-size:13px;line-height:1;cursor:pointer;padding:0}
.av-del:hover{background:var(--err)}
.av-cap{font-size:11.5px;color:var(--muted)}
.av-sm{display:inline-block;width:26px;height:26px;border-radius:50%;background:#eef1f6 no-repeat center/cover;vertical-align:middle;margin-right:7px;font-size:12px;line-height:26px;text-align:center;color:#7b8ba3;font-weight:600}
.av-sm.contact{background-color:#e8f1ff;color:#1f5fd6}

/* ── 客户档案：左边头像、右边分组字段 ── */
.cu-card{display:grid;grid-template-columns:118px 1fr;gap:26px;padding:20px 22px}
.cu-avs{display:flex;flex-direction:column;gap:22px;align-items:center;padding-top:4px}
.cu-fields{display:flex;flex-direction:column;gap:18px;min-width:0}
.cu-sec h4{margin:0 0 12px;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.8px}
.cu-sec + .cu-sec{border-top:1px solid var(--line);padding-top:16px}
.fld{display:grid;grid-template-columns:78px 1fr;align-items:center;gap:12px;margin-bottom:11px}
.fld:last-child{margin-bottom:0}
.fld label{font-size:13px;color:var(--muted);text-align:right;white-space:nowrap}
.fld input,.fld select{width:100%;padding:8px 11px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);outline:none;min-width:0}
.fld input:focus,.fld select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(31,95,214,.12)}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fld-row .fld{grid-template-columns:78px 1fr}
.cu-actions{display:flex;align-items:center;gap:12px;padding-top:6px}
.cu-card .msg{margin:0}
@media (max-width:760px){
  .cu-card{grid-template-columns:1fr}
  .cu-avs{flex-direction:row;justify-content:center}
  .fld-row{grid-template-columns:1fr}
}

/* 客户类型：分段按钮 */
.seg{display:inline-flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:#fff}
.seg button{border:0;background:none;padding:8px 20px;font-size:13.5px;font-family:inherit;color:var(--muted);cursor:pointer}
.seg button + button{border-left:1px solid var(--line)}
.seg button.on{background:var(--brand);color:#fff;font-weight:600}
.tag-comp{display:inline-block;margin-left:6px;padding:1px 6px;border-radius:5px;background:#eef1f6;color:#5b6b82;font-size:11px;font-weight:600;vertical-align:middle}

/* ── 弹窗：头固定，内容区自己滚动（不然内容一高就被裁掉，合同表看不见 —— 踩过） ── */
.modal{align-items:center}
.modal-box{max-height:88vh;min-height:0}
.modal-box .modal-head{flex:0 0 auto}
.modal-body{flex:1 1 auto;overflow:auto;min-height:0;display:flex;flex-direction:column}
.modal-body > .tablewrap{overflow:visible;flex:0 0 auto}
.modal-body > .stats{flex:0 0 auto}
.modal-body > .ledger-bar{flex:0 0 auto}
.modal-body > .cu-card{flex:0 0 auto}
.modal-body > #cuContractsWrap{flex:0 0 auto}

/* ── 跟单记录 ── */
.follow-add{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:0 22px 12px}
.follow-add input,.follow-add select{padding:8px 10px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);outline:none}
.follow-add input[type=date]{width:150px}
.follow-add select{width:auto}
.follow-add #foContent{flex:1;min-width:220px}
.follow-add input:focus,.follow-add select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(31,95,214,.12)}
.follow-add .btn-inline{padding:8px 18px;font-size:13.5px;white-space:nowrap}
.chip-ch{display:inline-block;padding:2px 8px;border-radius:6px;background:#eef1f6;color:#5b6b82;font-size:12px}
.overdue-next{color:var(--err);font-weight:600}

/* ── 跟单提醒条 ── */
.fu-alert{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 18px;padding:11px 14px;border-radius:10px;font-size:13.5px;line-height:1.5}
.fu-alert.hot{background:#fdeaea;border:1px solid #f6c9c9;color:#9b1c1c}
.fu-alert.warn{background:#fff7e6;border:1px solid #f5e0b3;color:#8a5a00}
.fu-alert b{font-weight:700}
.fu-alert .fu-link{margin-left:auto;border:0;background:none;color:inherit;text-decoration:underline;cursor:pointer;font-size:13px;font-family:inherit;font-weight:600;white-space:nowrap}
.fu-alert .fu-names{opacity:.85}
.fu-badge{display:inline-block;padding:1px 6px;border-radius:5px;font-size:11px;font-weight:700;margin-top:2px}
.fu-badge.overdue{background:#fdeaea;color:#9b1c1c}
.fu-badge.soon{background:#fff4e0;color:#8a5a00}

/* ── 客户详情：三个小页面（tab） ── */
.cu-tabs{display:flex;gap:6px;padding:12px 22px 0;border-bottom:1px solid var(--line);flex:0 0 auto;position:sticky;top:0;background:#fff;z-index:2}
.cu-tabs button{border:0;background:none;padding:9px 16px 11px;font-size:14px;font-family:inherit;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px}
.cu-tabs button:hover{color:var(--brand)}
.cu-tabs button.on{color:var(--brand);font-weight:700;border-bottom-color:var(--brand)}
.cu-tabs button i{font-style:normal;font-size:11.5px;background:#eef1f6;color:#5b6b82;border-radius:999px;padding:1px 7px;margin-left:4px}
.cu-tabs button.on i{background:#e8f1ff;color:#1f5fd6}
.cu-tabs button:disabled{opacity:.4;cursor:not-allowed}
.cu-tabpage{flex:0 0 auto}

/* ── 房源信息页 ── */
.un-code{font-size:15px;font-weight:700;color:var(--ink);text-align:center;line-height:1.3;word-break:break-all;padding:10px 4px}
.fld .ro{padding:8px 11px;font-size:13.5px;color:var(--ink);background:#f7f9fc;border:1px solid transparent;border-radius:9px;min-height:35px}
.st-rented{display:inline-block;padding:2px 9px;border-radius:999px;background:#eaf7ef;color:var(--ok);font-size:12px;font-weight:700}
.st-vacant{display:inline-block;padding:2px 9px;border-radius:999px;background:#eef1f6;color:#5b6b82;font-size:12px;font-weight:700}

.st-future{display:inline-block;padding:2px 9px;border-radius:999px;background:#e8f1ff;color:#1f5fd6;font-size:12px;font-weight:700}
.st-dead{display:inline-block;padding:2px 9px;border-radius:999px;background:#fdeaea;color:var(--err);font-size:12px;font-weight:700}

/* ── 类型小标签（仓库 / 北大棚 / 商铺 …），点一下只看那一类 ── */
.u-types{display:flex;flex-wrap:wrap;gap:7px;padding:10px 10px 2px}
.u-types:empty{display:none}
.u-types button{border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:999px;padding:4px 11px;font-size:12.5px;font-family:inherit;cursor:pointer;display:inline-flex;align-items:center;gap:5px}
.u-types button:hover{border-color:var(--brand);color:var(--brand)}
.u-types button.on{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.u-types button i{font-style:normal;font-size:11px;opacity:.75}
.u-types .u-all{border-style:dashed}

/* ── 合同录入表单：统一 4 列网格，行行对齐 ── */
.cform{display:flex;flex-direction:column;gap:20px;padding:20px 22px 24px}
.csec h4{margin:0 0 14px;font-size:12px;color:var(--muted);font-weight:700;letter-spacing:.8px}
.csec + .csec{border-top:1px solid var(--line);padding-top:18px}
.fgrid{display:grid;grid-template-columns:76px minmax(0,1fr) 84px minmax(0,1fr);gap:13px 16px;align-items:center}
.fgrid > label{text-align:right;color:var(--muted);font-size:13px;white-space:nowrap}
.fgrid > input,.fgrid > select{width:100%;padding:8px 11px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);outline:none;min-width:0;height:36px}
.fgrid > input:focus,.fgrid > select:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(31,95,214,.12)}
.fgrid > input[readonly]{background:#f7f9fc;color:var(--muted)}
.fgrid .dates{display:flex;align-items:center;gap:8px}
.fgrid .dates input{flex:1;min-width:0;padding:8px 11px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);outline:none;height:36px}
.fgrid .dates input:focus{border-color:var(--brand);box-shadow:0 0 0 3px rgba(31,95,214,.12)}
.fgrid .dates .dash{color:var(--muted);font-size:13px;flex:0 0 auto}
.fgrid .span3{grid-column:span 3}
.chint{margin:10px 0 0;padding-left:92px;font-size:12px}
.sub-h{margin:16px 0 8px;font-size:12px;color:var(--muted);font-weight:600;letter-spacing:.5px}
.cactions{display:flex;gap:12px;align-items:center;padding-top:2px}
.cform .picker,.cform .picked{max-width:none;width:100%}
.cform .chg-wrap{max-width:none;width:100%}
.cform .chg-foot{margin-top:8px}

/* ── 费用项：计价方式 + 单价 × 数量 − 优惠 ── */
.chg-row{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.chg-row select.chg-item{padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);width:104px}
.chg-row select.chg-mode{padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);width:86px}
.chg-row .chg-price{width:110px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;text-align:right;font-variant-numeric:tabular-nums}
.chg-row .chg-price.bad{border-color:var(--err);background:#fff5f5}
.chg-row .chg-discount{width:100px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;font-size:13.5px;font-family:inherit;text-align:right;font-variant-numeric:tabular-nums;background:#fffaf0}
.chg-row .chg-x,.chg-row .chg-eq{color:var(--muted);font-size:13px}
.chg-row .chg-qty{min-width:64px;text-align:right;font-variant-numeric:tabular-nums;color:var(--muted);font-size:13px}
.chg-row .chg-disc{border:1px dashed var(--line);background:#fff;color:var(--muted);border-radius:8px;padding:5px 9px;font-size:12px;font-family:inherit;cursor:pointer}
.chg-row .chg-disc:hover{border-color:var(--brand);color:var(--brand)}
.chg-row .chg-disc.on{border-color:#e8c98a;color:#8a5a00;background:#fff7e6}
.chg-row .chg-amount{min-width:96px;text-align:right;font-weight:700;font-variant-numeric:tabular-nums}
.chg-row .chg-amount.neg{color:var(--err)}
.chg-row .x{border:0;background:none;color:var(--muted);cursor:pointer;font-size:17px;line-height:1;padding:0 5px}
.chg-row .x:hover{color:var(--err)}

/* ── 新库浏览页 ── */
.dbhead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.dbhead b{font-size:15px}
.dbhead .search{flex:1;min-width:200px;padding:8px 11px;border:1px solid var(--line);border-radius:9px;font-size:13.5px;font-family:inherit;background:#fff;color:var(--ink);outline:none}
.dblayout{display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:start}
.dbside{border:1px solid var(--line);border-radius:10px;padding:10px;background:#fff;max-height:70vh;overflow:auto}
.dbside-h{font-size:11.5px;font-weight:700;color:var(--muted);letter-spacing:.8px;margin:6px 6px 8px}
.dbside button{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;background:none;padding:6px 8px;border-radius:7px;font-size:13px;font-family:inherit;color:var(--ink);cursor:pointer;text-align:left}
.dbside button:hover{background:#f4f7fb}
.dbside button.on{background:#eef3ff;color:var(--brand-dark);font-weight:700}
.dbside button i{font-style:normal;font-size:11.5px;color:var(--muted)}
.dbmain{min-width:0}
.dbmain-h{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.dbmain-h .dbpager{margin-left:auto;display:flex;gap:8px}
.dbmain .tablewrap{border:1px solid var(--line);border-radius:10px;max-height:70vh;overflow:auto}
.dbmain table.grid{font-size:12.5px}
.dbmain table.grid th,.dbmain table.grid td{padding:6px 8px;white-space:nowrap;max-width:280px;overflow:hidden;text-overflow:ellipsis}
.dbmain table.grid td.null{color:#b6c0cf;font-style:italic}

/* 台账行整行可点 */
.grid tr.clickable{cursor:pointer}
.grid tr.clickable:hover td{background:#f6f9ff}
