/* ============== CSS Variables ============== */
/* 色值 / 字号 / 圆角均取自原站 www.yuxiaor.com/v2 实测计算样式 */
:root {
  --c-primary: #3974ff;
  --c-primary-hover: #2f66e6;
  --c-primary-light: #eef3ff;
  --c-danger: #f53f3f;
  --c-danger-light: #ffece8;
  --c-warning: #ff7d00;
  --c-success: #00b42a;

  --c-text: #040a24;
  --c-text-regular: #555555;
  --c-text-secondary: #86909c;
  --c-text-placeholder: #c0c4cc;

  --c-bg: #f7f9fa;
  --c-bg-card: #ffffff;
  --c-border: #e5e6eb;
  --c-border-light: #f2f3f5;
  --c-input-border: #d8dce6;
  --c-header-border: #dddee3;

  --c-sidebar: #f7f8fa;
  --c-sidebar-hover: #ebeef3;
  --c-sidebar-active-bg: #ebeef3;
  --c-sidebar-text: #040a24;
  --c-sidebar-text-active: #040a24;

  --r-sm: 4px;
  --r-md: 6px;
  --r-lg: 8px;

  --w-sidebar: 168px;
  --w-sidebar-collapsed: 60px;
  --h-topbar: 52px;

  --shadow-sm: 0 1px 8px rgba(0,0,0,.05);
  --shadow-md: 0 4px 16px rgba(0,0,0,.1);

  /* ---- 线性图标（与原站 yxe-icon 风格一致：24 视窗 / 1.7 描边 / 单色 mask）---- */
  --i-grid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7.5' height='7.5' rx='1.5'/%3E%3Crect x='13.5' y='3' width='7.5' height='7.5' rx='1.5'/%3E%3Crect x='3' y='13.5' width='7.5' height='7.5' rx='1.5'/%3E%3Crect x='13.5' y='13.5' width='7.5' height='7.5' rx='1.5'/%3E%3C/svg%3E");
  --i-target: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Ccircle cx='12' cy='12' r='3.5'/%3E%3Cpath d='M12 1.5v3M12 19.5v3M1.5 12h3M19.5 12h3'/%3E%3C/svg%3E");
  --i-approval: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6.5L9.5 17 4 11.5'/%3E%3Cpath d='M20 13v5.5a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 18.5v-13A1.5 1.5 0 0 1 5.5 4H15'/%3E%3C/svg%3E");
  --i-house: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 21h18'/%3E%3Cpath d='M5 21V8l7-4.5L19 8v13'/%3E%3Cpath d='M9.5 21v-6h5v6'/%3E%3C/svg%3E");
  --i-contract: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2.5H6.5A1.5 1.5 0 0 0 5 4v16a1.5 1.5 0 0 0 1.5 1.5h11A1.5 1.5 0 0 0 19 20V7.5z'/%3E%3Cpath d='M14 2.5V7.5h5'/%3E%3Cpath d='M8.5 13h7M8.5 16.5h4.5'/%3E%3C/svg%3E");
  --i-finance: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6.5 4.5L12 12l5.5-7.5'/%3E%3Cpath d='M12 12v8.5'/%3E%3Cpath d='M8.5 14.5h7M8.5 17.5h7'/%3E%3C/svg%3E");
  --i-report: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='3.5' width='17' height='17' rx='2'/%3E%3Cpath d='M8 16.5V11M12 16.5V8M16 16.5v-4'/%3E%3C/svg%3E");
  --i-device: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='5' width='14' height='14' rx='2'/%3E%3Crect x='9.5' y='9.5' width='5' height='5' rx='1'/%3E%3Cpath d='M9.5 2.5v2.5M14.5 2.5v2.5M9.5 19v2.5M14.5 19v2.5M2.5 9.5H5M2.5 14.5H5M19 9.5h2.5M19 14.5h2.5'/%3E%3C/svg%3E");
  --i-meter: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 12l4.5-3.5'/%3E%3Cpath d='M12 3.5v2M20.5 12h-2M12 20.5v-2M3.5 12h2'/%3E%3C/svg%3E");
  --i-workorder: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4.5' width='14' height='16.5' rx='2'/%3E%3Cpath d='M9.5 4.5V3h5v1.5'/%3E%3Cpath d='M9 10.5h6M9 14.5h6'/%3E%3C/svg%3E");
  --i-promote: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 10v4h3l5 3.5v-11L6.5 10z'/%3E%3Cpath d='M15 9a4 4 0 0 1 0 6'/%3E%3Cpath d='M6.5 14v4.5'/%3E%3C/svg%3E");
  --i-member: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.8'/%3E%3Cpath d='M4.5 20.5c0-3.8 3.4-6 7.5-6s7.5 2.2 7.5 6'/%3E%3C/svg%3E");
  --i-esign: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12.5 20.5h8.5'/%3E%3Cpath d='M16.8 3.7a2.1 2.1 0 0 1 3 3L8 18.5l-4 1 1-4z'/%3E%3C/svg%3E");
  --i-community: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 12a8.5 8.5 0 0 1-8.5 8.5H8l-4.5 2.5 1.2-4.4A8.5 8.5 0 1 1 20.5 12z'/%3E%3C/svg%3E");
  --i-setting: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3.2'/%3E%3Cpath d='M19.4 14.6a1.7 1.7 0 0 0 .3 1.9l.1.1a2 2 0 1 1-2.8 2.8l-.1-.1a1.7 1.7 0 0 0-2.9 1.2 2 2 0 1 1-4 0 1.7 1.7 0 0 0-2.9-1.2l-.1.1a2 2 0 1 1-2.8-2.8l.1-.1a1.7 1.7 0 0 0-1.2-2.9 2 2 0 1 1 0-4 1.7 1.7 0 0 0 1.2-2.9l-.1-.1a2 2 0 1 1 2.8-2.8l.1.1a1.7 1.7 0 0 0 2.9-1.2 2 2 0 1 1 4 0 1.7 1.7 0 0 0 2.9 1.2l.1-.1a2 2 0 1 1 2.8 2.8l-.1.1a1.7 1.7 0 0 0 1.2 2.9 2 2 0 1 1 0 4 1.7 1.7 0 0 0-1.5 1z'/%3E%3C/svg%3E");
  --i-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7.5'/%3E%3Cpath d='M20.5 20.5L16.6 16.6'/%3E%3C/svg%3E");
  --i-mail: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3.5 7l8.5 6 8.5-6'/%3E%3C/svg%3E");
  --i-wallet: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 7.5A2 2 0 0 1 5.5 5.5h11a2 2 0 0 1 2 2v1'/%3E%3Crect x='3.5' y='8.5' width='17' height='10.5' rx='2'/%3E%3Ccircle cx='16.5' cy='13.8' r='1.1'/%3E%3C/svg%3E");
  --i-bell: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8.5a6 6 0 1 0-12 0c0 6-2.5 7.5-2.5 7.5h17S18 14.5 18 8.5'/%3E%3Cpath d='M13.7 19.5a2 2 0 0 1-3.4 0'/%3E%3C/svg%3E");
  --i-help: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M9.6 9.2a2.5 2.5 0 1 1 3.2 2.6c-.7.3-1 .9-1 1.7v.3'/%3E%3Ccircle cx='12' cy='17' r='.9' fill='%23000' stroke='none'/%3E%3C/svg%3E");
  --i-support: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4.5 14v-2a7.5 7.5 0 0 1 15 0v2'/%3E%3Crect x='2.5' y='13.5' width='4' height='6' rx='1.4'/%3E%3Crect x='17.5' y='13.5' width='4' height='6' rx='1.4'/%3E%3C/svg%3E");
  --i-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
  --i-arrow-down: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
  --i-arrow-right: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 6l6 6-6 6'/%3E%3C/svg%3E");
  --i-collapse: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 6h17M3.5 12h10M3.5 18h17'/%3E%3Cpath d='M17.5 9.5l3 2.5-3 2.5'/%3E%3C/svg%3E");
  --i-logout: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9.5 20.5H6a1.5 1.5 0 0 1-1.5-1.5V5A1.5 1.5 0 0 1 6 3.5h3.5'/%3E%3Cpath d='M15.5 16.5l4.5-4.5-4.5-4.5'/%3E%3Cpath d='M20 12H9'/%3E%3C/svg%3E");
  --i-more: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23000'%3E%3Ccircle cx='5' cy='12' r='1.7'/%3E%3Ccircle cx='12' cy='12' r='1.7'/%3E%3Ccircle cx='19' cy='12' r='1.7'/%3E%3C/svg%3E");
  --i-download: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5v11'/%3E%3Cpath d='M7.5 10.5l4.5 4.5 4.5-4.5'/%3E%3Cpath d='M4.5 20.5h15'/%3E%3C/svg%3E");
  --i-sort: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 4.5v15M7 4.5L4 7.5M7 4.5l3 3'/%3E%3Cpath d='M17 19.5v-15M17 19.5l-3-3M17 19.5l3-3'/%3E%3C/svg%3E");
  --i-eye: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 6.5 12 6.5 21.5 12 21.5 12 18 17.5 12 17.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
  --i-phone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.5 16.9v2.3a1.6 1.6 0 0 1-1.7 1.6 16 16 0 0 1-7-2.5 15.7 15.7 0 0 1-4.8-4.8 16 16 0 0 1-2.5-7.1A1.6 1.6 0 0 1 6.1 4.7h2.3a1.6 1.6 0 0 1 1.6 1.4c.1.9.3 1.7.6 2.5a1.6 1.6 0 0 1-.4 1.7l-1 1a12.8 12.8 0 0 0 4.8 4.8l1-1a1.6 1.6 0 0 1 1.7-.4c.8.3 1.6.5 2.5.6a1.6 1.6 0 0 1 1.4 1.6z'/%3E%3C/svg%3E");
  --i-doc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13.5 3H7a1.5 1.5 0 0 0-1.5 1.5v15A1.5 1.5 0 0 0 7 21h10a1.5 1.5 0 0 0 1.5-1.5V8z'/%3E%3Cpath d='M13.5 3V8H18'/%3E%3C/svg%3E");
}

/* ============== Reset ============== */
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { min-height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB",
    Arial, sans-serif;
  font-size: 13px;
  line-height: 20px;
  color: var(--c-text-regular);
  background: var(--c-bg);
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
button { border: none; background: none; cursor: pointer; font: inherit; color: inherit; }
ul { list-style: none; }
h1, h2, h3, h4 { font-weight: 500; }

/* ============== Layout（顶栏通栏 + 侧栏在其下方，对齐原站）============== */
.sidebar {
  position: fixed; top: var(--h-topbar); left: 0; bottom: 0;
  width: var(--w-sidebar);
  background: var(--c-sidebar);
  border-right: 1px solid var(--c-border);
  color: var(--c-sidebar-text);
  display: flex; flex-direction: column;
  transition: width .2s;
  z-index: 90;
}
.sidebar.collapsed { width: var(--w-sidebar-collapsed); }
.sidebar.collapsed .nav-item span,
.sidebar.collapsed .nav-sub,
.sidebar.collapsed .arrow,
.sidebar.collapsed .nav-collapse span { display: none; }
.sidebar.collapsed .nav-item { justify-content: center; padding: 0; margin: 0 8px; }
.sidebar.collapsed .nav-item .ico:first-child { margin-right: 0; }

.main {
  margin-left: var(--w-sidebar);
  padding-top: var(--h-topbar);
  min-height: 100vh;
  display: flex; flex-direction: column;
  transition: margin-left .2s;
  min-width: 0;
}
.sidebar.collapsed ~ .main { margin-left: var(--w-sidebar-collapsed); }

/* ============== Sidebar ============== */
.sidebar-nav { flex: 1; overflow-y: auto; padding: 12px 0; }
.sidebar-nav::-webkit-scrollbar { width: 4px; }
.sidebar-nav::-webkit-scrollbar-thumb { background: #dcdfe6; border-radius: 2px; }

.nav-item {
  display: flex; align-items: center;
  height: 40px; margin: 0 12px; padding: 0 8px 0 12px;
  border-radius: var(--r-sm);
  font-size: 13px;
  color: var(--c-sidebar-text);
  cursor: pointer;
  position: relative;
  transition: background .15s, color .15s;
}
.nav-item:hover { background: var(--c-sidebar-hover); }
.nav-item.active { background: var(--c-sidebar-active-bg); font-weight: 500; }
.nav-item .ico:first-child { margin-right: 10px; color: var(--c-text-regular); }
.nav-item.active .ico:first-child,
.nav-item:hover .ico:first-child { color: var(--c-primary); }
.nav-item .arrow { margin-left: auto; width: 12px; height: 12px; color: var(--c-text-secondary); transition: transform .2s; }
.nav-item .arrow.up { transform: rotate(180deg); }

.nav-sub {
  max-height: 0; overflow: hidden;
  transition: max-height .25s ease;
}
.nav-group.open .nav-sub { max-height: 500px; }
.nav-sub a {
  display: flex; align-items: center;
  height: 40px; margin: 0 12px; padding: 0 8px 0 36px;
  border-radius: var(--r-sm);
  font-size: 13px;
  color: var(--c-sidebar-text);
  transition: background .15s;
}
.nav-sub a:hover { background: var(--c-sidebar-hover); }
.nav-sub a.active { background: var(--c-sidebar-active-bg); font-weight: 500; }

.sidebar-footer {
  border-top: 1px solid var(--c-border);
  padding: 8px 0;
  flex-shrink: 0;
}
.nav-collapse { color: var(--c-text-regular); font-size: 13px; }

/* ============== Icons (CSS ico) ============== */
.ico {
  display: inline-block;
  width: 16px; height: 16px;
  flex-shrink: 0;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  -webkit-mask-size: contain; mask-size: contain;
}
/* 线性图标（mask 取色，跟随文字颜色） */
.ico-overview  { -webkit-mask-image: var(--i-grid);      mask-image: var(--i-grid); }
.ico-lead      { -webkit-mask-image: var(--i-target);    mask-image: var(--i-target); }
.ico-approval  { -webkit-mask-image: var(--i-approval);  mask-image: var(--i-approval); }
.ico-house     { -webkit-mask-image: var(--i-house);     mask-image: var(--i-house); }
.ico-contract  { -webkit-mask-image: var(--i-contract);  mask-image: var(--i-contract); }
.ico-finance   { -webkit-mask-image: var(--i-finance);   mask-image: var(--i-finance); }
.ico-report    { -webkit-mask-image: var(--i-report);    mask-image: var(--i-report); }
.ico-device    { -webkit-mask-image: var(--i-device);    mask-image: var(--i-device); }
.ico-meter     { -webkit-mask-image: var(--i-meter);     mask-image: var(--i-meter); }
.ico-workorder { -webkit-mask-image: var(--i-workorder); mask-image: var(--i-workorder); }
.ico-promote   { -webkit-mask-image: var(--i-promote);   mask-image: var(--i-promote); }
.ico-member    { -webkit-mask-image: var(--i-member);    mask-image: var(--i-member); }
.ico-esign     { -webkit-mask-image: var(--i-esign);     mask-image: var(--i-esign); }
.ico-community { -webkit-mask-image: var(--i-community); mask-image: var(--i-community); }
.ico-setting   { -webkit-mask-image: var(--i-setting);   mask-image: var(--i-setting); }
.ico-collapse  { -webkit-mask-image: var(--i-collapse);  mask-image: var(--i-collapse); }
.ico-arrow-down  { -webkit-mask-image: var(--i-arrow-down);  mask-image: var(--i-arrow-down); width: 12px; height: 12px; color: var(--c-text-secondary); }
.ico-arrow-right { -webkit-mask-image: var(--i-arrow-right); mask-image: var(--i-arrow-right); width: 12px; height: 12px; }
.ico-search    { -webkit-mask-image: var(--i-search);    mask-image: var(--i-search); width: 18px; height: 18px; }
.ico-message   { -webkit-mask-image: var(--i-mail);      mask-image: var(--i-mail); }
.ico-wallet    { -webkit-mask-image: var(--i-wallet);    mask-image: var(--i-wallet); }
.ico-bell      { -webkit-mask-image: var(--i-bell);      mask-image: var(--i-bell); width: 18px; height: 18px; }
.ico-help      { -webkit-mask-image: var(--i-help);      mask-image: var(--i-help); width: 18px; height: 18px; }
.ico-support   { -webkit-mask-image: var(--i-support);   mask-image: var(--i-support); width: 18px; height: 18px; }
.ico-plus      { -webkit-mask-image: var(--i-plus);      mask-image: var(--i-plus); width: 14px; height: 14px; }
.ico-logout    { -webkit-mask-image: var(--i-logout);    mask-image: var(--i-logout); }
.ico-more      { -webkit-mask-image: var(--i-more);      mask-image: var(--i-more); }
.ico-download  { -webkit-mask-image: var(--i-download);  mask-image: var(--i-download); }
.ico-sort      { -webkit-mask-image: var(--i-sort);      mask-image: var(--i-sort); }
.ico-eye       { -webkit-mask-image: var(--i-eye);       mask-image: var(--i-eye); }
.ico-phone     { -webkit-mask-image: var(--i-phone);     mask-image: var(--i-phone); width: 14px; height: 14px; }
.ico-doc       { -webkit-mask-image: var(--i-doc);       mask-image: var(--i-doc); width: 14px; height: 14px; }
.ico-edit      { -webkit-mask-image: var(--i-esign);     mask-image: var(--i-esign); }
.ico-panel     { -webkit-mask-image: var(--i-report);    mask-image: var(--i-report); }

/* ============== 顶部通栏 host-header（对齐原站）============== */
.host-header {
  position: fixed; top: 0; left: 0; right: 0;
  height: var(--h-topbar);
  background: #fff;
  border-bottom: 1px solid var(--c-header-border);
  box-shadow: 0 1px 8px rgba(0,0,0,.05);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 24px 0 0;
  gap: 12px; min-width: 0;
  z-index: 100;
}
.header-left { display: flex; align-items: center; min-width: 0; height: 100%; }
.logo-area {
  display: flex; align-items: center; gap: 8px;
  width: var(--w-sidebar); padding-left: 16px;
  flex-shrink: 0; height: 100%;
}
.logo-img { width: 30px; height: 30px; display: inline-flex; flex-shrink: 0; }
.logo-img svg { width: 100%; height: 100%; }
.logo-title {
  font-size: 14px; color: var(--c-text); font-weight: 500;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.header-page-title {
  font-size: 14px; font-weight: 500; color: var(--c-text);
  margin-left: 20px; white-space: nowrap;
}
/* 顶栏二级导航（原站 topbar-sub-nav：总览页的 仪表盘/数据大屏、设置页的 常用设置/…） */
.header-subnav { display: flex; align-items: center; height: 100%; margin-left: 4px; }
.subnav-tab {
  position: relative; display: inline-flex; align-items: center;
  height: var(--h-topbar); padding: 0 14px;
  font-size: 13px; color: var(--c-text-regular); white-space: nowrap;
}
.subnav-tab:hover { color: var(--c-primary); }
.subnav-tab.active { color: var(--c-text); font-weight: 500; }
.subnav-tab.active::after {
  content: ""; position: absolute; left: 14px; right: 14px; bottom: 0;
  height: 2px; background: var(--c-primary);
}

.header-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.icon-actions { display: flex; align-items: center; gap: 2px; }
.action-icon-btn {
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm);
  color: var(--c-text-regular);
  cursor: pointer; position: relative;
  transition: background .15s, color .15s;
}
.action-icon-btn:hover { background: var(--c-bg); color: var(--c-primary); }
.red-dot {
  position: absolute; top: 9px; right: 9px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--c-danger);
}

.create-btn {
  height: 28px; padding: 0 16px;
  background: var(--c-primary); color: #fff;
  border-radius: var(--r-sm);
  font-size: 12px;
  display: inline-flex; align-items: center; gap: 4px;
  transition: background .15s;
}
.create-btn:hover { background: var(--c-primary-hover); }

.header-user {
  position: relative;
  display: flex; align-items: center; gap: 6px;
  height: 100%; padding: 0 4px 0 12px;
  cursor: pointer;
}
.user-name { font-size: 13px; color: var(--c-text); white-space: nowrap; }
.header-user .ico-arrow-down { transition: transform .2s; }
.header-user.open .ico-arrow-down { transform: rotate(180deg); }
.user-menu {
  position: absolute; top: calc(100% - 6px); right: 0;
  min-width: 184px; background: #fff;
  border: 1px solid var(--c-border); border-radius: var(--r-lg);
  box-shadow: var(--shadow-md);
  padding: 8px 0; display: none; z-index: 1000;
}
.header-user.open .user-menu { display: block; }
.um-head {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 16px 12px; margin-bottom: 6px;
  border-bottom: 1px solid var(--c-border-light);
}
.um-name { font-size: 13px; color: var(--c-text); }
.um-role { font-size: 12px; color: var(--c-text-secondary); margin-top: 2px; }
.um-item {
  display: flex; align-items: center; gap: 6px;
  padding: 8px 16px; font-size: 13px; color: var(--c-text-regular);
  transition: background .12s, color .12s;
}
.um-item:hover { background: var(--c-bg); color: var(--c-primary); }
.um-divider { height: 1px; background: var(--c-border-light); margin: 6px 0; }
.um-logout { color: var(--c-danger); }
.um-logout:hover { background: var(--c-danger-light); color: var(--c-danger); }

.btn-primary {
  background: var(--c-primary);
  color: #fff;
  border-radius: var(--r-sm);
  padding: 0 16px;
  height: 32px;
  font-size: 13px;
  display: inline-flex; align-items: center; gap: 4px;
  transition: background .15s;
}
.btn-primary:hover { background: var(--c-primary-hover); }

.avatar {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: linear-gradient(135deg,#ffd1a4,#ff9a9e);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 12px; font-weight: 500;
  cursor: pointer; flex-shrink: 0;
}

/* ============== Content area ============== */
.content {
  flex: 1; overflow-y: auto;
  padding: 16px;
  background: #fff;
}
.content::-webkit-scrollbar { width: 8px; }
.content::-webkit-scrollbar-thumb { background: #dcdfe6; border-radius: 4px; }

.row { display: grid; gap: 16px; }
.row-banner { grid-template-columns: 1fr 280px; }

.grid { display: grid; gap: 16px; }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

/* ============== Card ============== */
.card {
  background: var(--c-bg-card);
  border: 1px solid var(--c-border);
  border-radius: var(--r-lg);
  padding: 16px;
}
.card-head {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
}
.card-head-row {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px;
  gap: 8px;
}
.card-title {
  font-size: 15px; font-weight: 600;
  color: var(--c-text);
}

/* ============== 公告 + 新手 ============== */
.card-announce {
  display: flex; align-items: center; justify-content: space-between;
  background: #fff;
  height: 48px;
  padding: 0 16px;
}
.announce-body {
  display: flex; align-items: center; gap: 8px;
  font-size: 14px;
  color: var(--c-text-regular);
}
.announce-text {
  color: var(--c-text);
  font-weight: 500;
}
.link-red { color: var(--c-danger); cursor: pointer; }
.link-red:hover { text-decoration: underline; }
.link-blue { color: var(--c-primary); cursor: pointer; }
.link-blue:hover { text-decoration: underline; }
.announce-actions { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.announce-divider { color: var(--c-text-placeholder); }

.card-novice {
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 16px;
  height: 48px;
  background: #fff;
}
.novice-body {
  font-size: 13px;
  color: var(--c-text-regular);
  display: flex; gap: 6px; align-items: center;
}
.novice-body strong { color: var(--c-text); }
.novice-more { font-size: 13px; white-space: nowrap; }

/* ============== 待办提醒 ============== */
.card-todo { padding: 0; }
.card-todo .card-head { padding: 12px 16px; margin: 0; border-bottom: 1px solid var(--c-border-light); }

.todo-filters {
  display: flex; gap: 8px; align-items: center; flex-wrap: wrap;
}
.todo-total {
  margin-left: auto;
  color: var(--c-text-secondary);
  font-size: 13px;
}
.btn-link {
  color: var(--c-primary);
  font-size: 13px;
  cursor: pointer;
}
.btn-link:hover { text-decoration: underline; }

/* select 下拉 */
.select {
  position: relative;
  display: inline-flex; align-items: center;
  height: 32px;
  padding: 0 28px 0 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  background: #fff;
  font-size: 13px;
  color: var(--c-text-regular);
  cursor: pointer;
  min-width: 90px;
  user-select: none;
}
.select .ico { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); }
.select-menu {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  box-shadow: var(--shadow-md);
  padding: 4px 0;
  max-height: 280px; overflow-y: auto;
  display: none;
  z-index: 10;
}
.select.open .select-menu { display: block; }
.select-menu li {
  padding: 6px 12px;
  font-size: 13px;
  color: var(--c-text-regular);
  cursor: pointer;
}
.select-menu li:hover { background: var(--c-primary-light); color: var(--c-primary); }

.todo-body {
  display: grid; grid-template-columns: 160px minmax(0,1fr);
  max-height: 540px;
  overflow-y: auto;
}
.todo-cats { padding: 12px; border-right: 1px solid var(--c-border-light); }
.cat-card {
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  padding: 12px 14px;
  margin-bottom: 12px;
  cursor: pointer;
  transition: all .15s;
  border-left: 3px solid transparent;
}
.cat-card:last-child { margin-bottom: 0; }
.cat-card:hover { background: var(--c-bg); }
.cat-card.cat-active {
  background: var(--c-primary-light);
  border-color: var(--c-primary);
  border-left: 3px solid var(--c-primary);
}
.cat-title { font-size: 14px; font-weight: 600; margin-bottom: 8px; color: var(--c-text); }
.cat-line { font-size: 12px; color: var(--c-text-secondary); line-height: 20px; }
.cat-line b { color: var(--c-danger); font-weight: 600; margin: 0 2px; }
.cat-card.cat-active .cat-line b { color: var(--c-danger); }

.todo-list { padding: 4px 0; min-width: 0; }
.todo-item {
  display: grid;
  grid-template-columns: 100px minmax(180px, 1fr) 120px;
  align-items: center;
  padding: 10px 16px;
  border-bottom: 1px solid var(--c-border-light);
  font-size: 13px;
  gap: 10px;
  cursor: pointer;
  transition: background .15s ease;
  min-width: 0;
}
.todo-amount { min-width: 0; }
.todo-item:last-child { border-bottom: none; }
.todo-item:hover { background: var(--c-bg); }
.todo-overdue { color: var(--c-danger); }
.overdue-tag { display: block; font-weight: 600; }
.overdue-date { display: block; color: var(--c-text-secondary); font-size: 12px; margin-top: 2px; }
.house-name {
  color: var(--c-text); font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.house-sub { color: var(--c-text-secondary); font-size: 12px; margin: 2px 0; }
.house-contact {
  color: var(--c-text-secondary);
  font-size: 12px;
  margin-top: 4px;
  display: flex; align-items: center; gap: 6px;
  white-space: nowrap;
}
.todo-amount { text-align: right; }
.amount { color: var(--c-text); font-weight: 600; }
.amount-type { color: var(--c-text-secondary); font-size: 12px; margin-top: 2px; }

.todo-footer {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  border-top: 1px solid var(--c-border-light);
  font-size: 13px;
  color: var(--c-text-secondary);
}
.pager { display: flex; gap: 4px; align-items: center; }
.pg-btn, .pg-num {
  min-width: 32px; height: 28px;
  padding: 0 8px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  background: #fff;
  font-size: 12px;
  color: var(--c-text-regular);
}
.pg-btn:hover, .pg-num:hover { color: var(--c-primary); border-color: var(--c-primary); }
.pg-num.active {
  background: var(--c-primary);
  color: #fff;
  border-color: var(--c-primary);
}

/* ============== 房源出收 ============== */
.card-stat { display: flex; flex-direction: column; gap: 18px; }
.stat-block { }
.stat-label { font-size: 13px; color: var(--c-text-secondary); margin-bottom: 8px; }
.stat-cells { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.stat-cell {
  background: var(--c-bg);
  border-radius: var(--r-sm);
  padding: 10px 8px;
  text-align: center;
}
.stat-cell.highlight { background: var(--c-primary-light); }
.cell-num { font-size: 22px; font-weight: 700; color: var(--c-text); line-height: 28px; }
.stat-cell.highlight .cell-num { color: var(--c-primary); }
.cell-key { font-size: 12px; color: var(--c-text-secondary); line-height: 18px; }

/* ============== 库存管理 ============== */
.seg {
  display: inline-flex;
  background: var(--c-bg);
  border-radius: var(--r-sm);
  padding: 2px;
  gap: 2px;
}
.seg-item {
  height: 24px;
  padding: 0 10px;
  font-size: 12px;
  color: var(--c-text-regular);
  border-radius: 3px;
  transition: all .15s;
}
.seg-item.active {
  background: #fff;
  color: var(--c-primary);
  box-shadow: 0 1px 2px rgba(0,0,0,.08);
}
.seg-mini .seg-item { padding: 0 8px; font-size: 12px; height: 22px; }

.inv-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 16px; }
.inv-item { text-align: center; padding: 8px; background: var(--c-bg); border-radius: var(--r-sm); }
.inv-num { font-size: 22px; font-weight: 700; color: var(--c-text); }
.inv-num.muted { color: var(--c-text-placeholder); }
.inv-key { font-size: 12px; color: var(--c-text-secondary); }

.inv-progress { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.inv-progress-bar {
  flex: 1; height: 10px;
  background: var(--c-bg);
  border-radius: 5px; overflow: hidden;
}
.inv-progress-fill {
  height: 100%;
  background: linear-gradient(90deg, #ffd1a4, #ff9500);
  border-radius: 5px;
}
.inv-progress-text { display: flex; flex-direction: column; align-items: flex-end; }
.big-num { font-size: 22px; font-weight: 700; color: var(--c-warning); }
.big-num.primary { color: var(--c-primary); }
.muted { color: var(--c-text-secondary); font-size: 12px; }

.inv-days-title { font-size: 13px; color: var(--c-text-secondary); margin-bottom: 8px; }
.inv-days-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.inv-days-grid > div { text-align: center; padding: 6px; background: var(--c-bg); border-radius: var(--r-sm); }
.d-num { font-size: 18px; font-weight: 700; color: var(--c-text); }
.d-key { font-size: 11px; color: var(--c-text-secondary); }

/* ============== 收支情况 ============== */
.month-switch {
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 12px;
  font-size: 13px;
}
.m-arrow {
  width: 24px; height: 24px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  background: #fff;
  color: var(--c-text-regular);
}
.m-arrow:hover { color: var(--c-primary); border-color: var(--c-primary); }
.m-text { color: var(--c-text-secondary); }
.m-text.active { color: var(--c-primary); font-weight: 600; }

.balance-row {
  text-align: center; padding: 8px 0;
  background: var(--c-primary-light);
  border-radius: var(--r-sm);
  margin-bottom: 12px;
}
.balance-main { font-size: 22px; font-weight: 700; color: var(--c-primary); }
.balance-sub { font-size: 12px; color: var(--c-text-secondary); margin-top: 2px; }

.bal-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px;
  margin-bottom: 8px;
}
.bal-cell {
  display: flex; flex-direction: column; align-items: center;
  padding: 8px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
  font-size: 12px; color: var(--c-text-secondary);
}
.bal-cell b { font-size: 14px; color: var(--c-text); margin-top: 2px; }

.bal-line {
  display: flex; justify-content: space-between;
  font-size: 13px; padding: 4px 0;
  color: var(--c-text-regular);
}

.renew-line, .vacancy-line, .tenant-line {
  display: flex; align-items: center; gap: 12px;
  padding: 8px 0;
  border-top: 1px solid var(--c-border-light);
}
.renew-pct, .vac-pct, .ten-pct {
  font-size: 20px; font-weight: 700;
  width: 70px;
}
.renew-pct, .vac-pct { color: var(--c-warning); }
.ten-pct { color: var(--c-text-placeholder); }
.renew-info, .vac-info, .ten-info { flex: 1; font-size: 13px; color: var(--c-text-regular); }
.renew-info div:first-child, .vac-info div:first-child, .ten-info div:first-child { font-weight: 500; }

/* ============== 审批 / 工单 / 抄表 mini 卡片 ============== */
.card-mini { padding: 16px; }
.mini-list { display: flex; flex-direction: column; gap: 10px; }
.mini-list li {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px;
  color: var(--c-text-regular);
  padding-bottom: 8px;
  border-bottom: 1px dashed var(--c-border);
}
.mini-list li:last-child { border-bottom: none; padding-bottom: 0; }
.mini-list li b {
  font-size: 16px;
  font-weight: 700;
  color: var(--c-text);
}
.mini-list li b.num-red { color: var(--c-danger); }
.mini-list-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 16px; }
.mini-list-2col li { border-bottom: none; padding-bottom: 0; }

/* ============== 今日账务 ============== */
.ft-block { display: flex; flex-direction: column; gap: 6px; }
.ft-row {
  display: flex; align-items: center;
  font-size: 13px;
  color: var(--c-text-regular);
}
.ft-row span { color: var(--c-text-secondary); margin-right: 4px; }
.ft-row b { color: var(--c-text); font-weight: 600; margin-right: 16px; }
.ft-row .ml { margin-left: 8px; }
.ft-row.ft-accent b { color: var(--c-danger); }

/* ============== 业绩排行 ============== */
.period-tag {
  font-size: 12px;
  color: var(--c-primary);
  background: var(--c-primary-light);
  padding: 2px 8px;
  border-radius: 10px;
  margin-right: auto;
}
.rank-list { display: flex; flex-direction: column; gap: 8px; }
.rank-item {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
}
.rank-no {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: var(--c-warning);
  color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700;
  flex-shrink: 0;
}
.rank-name { flex: 1; font-size: 13px; color: var(--c-text-regular); }
.rank-num { font-size: 14px; font-weight: 700; color: var(--c-text); }

/* ============== 日程 ============== */
.btn-add {
  width: 100%;
  margin-bottom: 12px;
  justify-content: center;
}
.schedule-empty {
  text-align: center;
  color: var(--c-text-placeholder);
  padding: 32px 0;
  font-size: 13px;
}

/* ============== 客户满意度 ============== */
.month-select {
  height: 26px;
  padding: 0 24px 0 8px;
  font-size: 12px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  background: #fff;
  color: var(--c-text-regular);
  cursor: pointer;
  max-width: 140px;
}
.sat-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 12px; }
.sat-list li {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px;
  color: var(--c-text-regular);
  padding-bottom: 6px;
  border-bottom: 1px dashed var(--c-border);
}
.sat-list li:last-child { border-bottom: none; }
.sat-list li b {
  font-size: 18px; font-weight: 700;
  color: var(--c-text);
}
.sat-score {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 10px 12px;
  background: var(--c-primary-light);
  border-radius: var(--r-sm);
}
.sat-score .big-num { font-size: 24px; color: var(--c-primary); }

/* ============== Responsive ============== */
@media (max-width: 1280px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 1024px) {
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .row-banner { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 720px) {
  .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: 1fr; }
}

/* ============== Tab Pane ============== */
.tab-pane { display: none; animation: fadeIn .25s ease; }
.tab-pane.active { display: block; }
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}

/* ============== 仪表盘（panel） ============== */
.card-empty {
  display: flex; flex-direction: column; gap: 20px;
  background: linear-gradient(135deg, #f0f7ff 0%, #fff 100%);
}
.empty-head {
  display: flex; align-items: center; gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--c-border-light);
}
.empty-head .ico-panel::before { content: "📊"; font-size: 22px; }
.empty-head h2 { font-size: 18px; color: var(--c-text); }
.empty-tip {
  color: var(--c-text-secondary);
  font-size: 13px;
  line-height: 22px;
}
.kpi-grid { margin-top: 4px; }
.kpi-card {
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  padding: 18px 20px;
  display: flex; flex-direction: column; gap: 6px;
  transition: box-shadow .2s, transform .2s;
}
.kpi-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.kpi-label { color: var(--c-text-secondary); font-size: 13px; }
.kpi-value { color: var(--c-text); font-size: 26px; font-weight: 700; }
.kpi-trend { color: var(--c-text-secondary); font-size: 12px; }
.kpi-trend.up span { color: var(--c-success); margin-left: 4px; }
.kpi-trend.down span { color: var(--c-danger); margin-left: 4px; }

.chart-placeholder {
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  padding: 18px 20px;
}
.chart-cap {
  font-size: 14px; color: var(--c-text);
  margin-bottom: 12px; font-weight: 600;
}
.chart-area {
  width: 100%; height: 220px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
}
.chart-svg { width: 100%; height: 100%; display: block; }

/* ============== 数据大屏（bigscreen） ============== */
.bigscreen {
  background: linear-gradient(135deg, #f5f7fa 0%, #ecf5ff 100%);
  border-radius: var(--r-md);
  padding: 20px;
  min-height: 600px;
  color: var(--c-text);
  border: 1px solid var(--c-border);
}
.bigscreen-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 18px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--c-border-light);
}
.bigscreen-name {
  font-size: 22px; font-weight: 600;
  background: linear-gradient(90deg, #3a8ee6 0%, #67c23a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  letter-spacing: 4px;
}
.bigscreen-time {
  font-family: ui-monospace, monospace;
  font-size: 14px;
  color: var(--c-text-secondary);
  background: #fff;
  padding: 4px 12px;
  border-radius: 12px;
  border: 1px solid var(--c-border);
}
.bigscreen-grid {
  display: grid;
  grid-template-columns: 1fr 1.4fr 1fr;
  gap: 16px;
}
.bs-col { display: flex; flex-direction: column; gap: 16px; }
.bs-card {
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  padding: 14px 16px;
  box-shadow: var(--shadow-sm);
}
.bs-title {
  font-size: 14px; font-weight: 600;
  color: var(--c-text); margin-bottom: 10px;
  display: flex; align-items: center; gap: 6px;
}
.bs-title::before {
  content: ""; display: inline-block;
  width: 3px; height: 12px;
  background: var(--c-primary);
  border-radius: 2px;
}
.bs-body { color: var(--c-text-regular); font-size: 13px; }
.bs-body-flex { display: flex; align-items: center; gap: 14px; }
.bs-donut svg { width: 110px; height: 110px; }
.bs-legend { display: flex; flex-direction: column; gap: 8px; flex: 1; }
.bs-legend li {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px;
  color: var(--c-text-regular);
}
.bs-legend li i {
  width: 10px; height: 10px;
  border-radius: 2px;
}
.bs-legend li b { margin-left: auto; color: var(--c-text); }

.bs-bar-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0;
  font-size: 12px;
}
.bs-bar-row > span { width: 50px; color: var(--c-text-regular); }
.bs-bar {
  flex: 1; height: 12px;
  background: var(--c-bg);
  border-radius: 6px; overflow: hidden;
}
.bs-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #3a8ee6, #67c23a);
  border-radius: 6px;
  transition: width .6s ease;
}
.bs-bar-row > b { width: 50px; text-align: right; color: var(--c-text); font-weight: 600; }

.bs-center {
  align-items: stretch;
}
.bs-hero {
  flex: 1;
  background: linear-gradient(135deg, #ecf5ff 0%, #f0f9eb 100%);
  border: 1px solid #c6e2ff;
  border-radius: var(--r-md);
  padding: 28px 24px;
  text-align: center;
  display: flex; flex-direction: column; justify-content: center; gap: 10px;
}
.bs-hero-num {
  font-size: 44px;
  font-weight: 700;
  background: linear-gradient(90deg, #3a8ee6, #67c23a);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-family: ui-monospace, monospace;
  letter-spacing: 2px;
}
.bs-hero-cap { color: var(--c-text-secondary); font-size: 14px; }
.bs-hero-sub {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 8px; margin-top: 14px;
}
.bs-hero-sub > div {
  display: flex; flex-direction: column; align-items: center;
  gap: 4px;
  padding: 10px;
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
}
.bs-hero-sub > div span { color: var(--c-text-secondary); font-size: 12px; }
.bs-hero-sub > div b { color: var(--c-text); font-size: 16px; font-weight: 700; }

.bs-stream { display: flex; flex-direction: column; gap: 8px; }
.bs-stream-row {
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px;
  background: var(--c-bg);
  border-radius: var(--r-sm);
  font-size: 13px;
  color: var(--c-text-regular);
}
.bs-stream-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.bs-stream-row b { margin-left: auto; color: var(--c-text); font-weight: 700; }

.bs-pie-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0;
  font-size: 12px;
  color: var(--c-text-regular);
}
.bs-pie-row > span { width: 50px; }
.bs-gauge svg { width: 100%; height: 110px; }

@media (max-width: 1280px) {
  .bigscreen-grid { grid-template-columns: 1fr 1fr; }
  .bs-center { grid-column: span 2; }
}
@media (max-width: 768px) {
  .bigscreen-grid { grid-template-columns: 1fr; }
  .bs-center { grid-column: auto; }
}

/* ============== Modal ============== */
.modal-mask {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.4);
  display: none;
  align-items: center; justify-content: center;
  z-index: 200;
  animation: fadeIn .15s ease;
}
.modal-mask.open { display: flex; }
.modal {
  background: #fff;
  border-radius: var(--r-md);
  min-width: 480px;
  max-width: 90vw;
  max-height: 90vh;
  overflow: hidden;
  display: flex; flex-direction: column;
  animation: modalIn .2s ease;
}
@keyframes modalIn {
  from { opacity: 0; transform: scale(.96) translateY(8px); }
  to { opacity: 1; transform: none; }
}
.modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--c-border-light);
}
.modal-title { font-size: 16px; font-weight: 600; }
.modal-close {
  width: 28px; height: 28px;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 22px;
  color: var(--c-text-secondary);
  border-radius: 50%;
  cursor: pointer;
  transition: background .15s;
}
.modal-close:hover { background: var(--c-bg); color: var(--c-text); }
.modal-body { padding: 20px; overflow-y: auto; }

/* 新建弹窗 */
.modal-create { width: 720px; }
.create-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.create-item {
  display: flex; align-items: center; gap: 12px;
  padding: 14px;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  cursor: pointer;
  transition: all .15s;
}
.create-item:hover {
  border-color: var(--c-primary);
  background: var(--c-primary-light);
  transform: translateY(-2px);
  box-shadow: var(--shadow-md);
}
.create-ico {
  width: 40px; height: 40px;
  border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 24px; font-weight: 700;
  flex-shrink: 0;
}
.create-text { display: flex; flex-direction: column; gap: 2px; }
.create-name { font-size: 14px; font-weight: 600; color: var(--c-text); }
.create-desc { font-size: 12px; color: var(--c-text-secondary); }

@media (max-width: 768px) {
  .modal-create { width: 95vw; }
  .create-grid { grid-template-columns: 1fr 1fr; }
}

/* 搜索弹窗 */
.modal-search {
  width: 640px;
  padding: 0;
}
.search-box {
  display: flex; align-items: center; gap: 10px;
  padding: 16px 20px;
  border-bottom: 1px solid var(--c-border-light);
}
.search-box .ico-search::before { font-size: 18px; }
.search-box input {
  flex: 1;
  border: none; outline: none;
  font-size: 16px;
  background: transparent;
}
.search-box kbd {
  font-family: inherit;
  font-size: 11px;
  padding: 2px 8px;
  background: var(--c-bg);
  border: 1px solid var(--c-border);
  border-radius: var(--r-sm);
  color: var(--c-text-secondary);
}
.search-suggest { padding: 8px 0; max-height: 50vh; overflow-y: auto; }
.search-section {
  padding: 8px 20px;
  font-size: 12px;
  color: var(--c-text-secondary);
}
.search-row {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 20px;
  font-size: 14px;
  color: var(--c-text-regular);
  cursor: pointer;
  transition: background .15s;
}
.search-row:hover { background: var(--c-primary-light); color: var(--c-primary); }
.search-row .ico { color: var(--c-text-secondary); }

/* ============== Toast ============== */
.toast {
  position: fixed;
  top: 70px; left: 50%;
  transform: translateX(-50%) translateY(-12px);
  background: rgba(50,50,50,.92);
  color: #fff;
  padding: 10px 20px;
  border-radius: var(--r-md);
  font-size: 13px;
  pointer-events: none;
  opacity: 0;
  transition: all .25s ease;
  z-index: 300;
  box-shadow: var(--shadow-md);
}
.toast.show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ============== 房源名称 tooltip ============== */
.house-name { cursor: help; }
.todo-row-actions { margin-top: 6px; }
.btn-mini {
  background: var(--c-success); color: #fff; border: 0; padding: 3px 10px;
  border-radius: var(--r-sm); font-size: 12px; cursor: pointer;
  transition: opacity .15s ease;
}
.btn-mini:hover { opacity: .85; }
.badge-paid { color: var(--c-success); font-size: 12px; font-weight: 600; }
.todo-empty { padding: 60px 0; text-align: center; color: var(--c-text-secondary); }

/* ============== 详情弹窗 / 表单弹窗 / 子页面 ============== */
.modal-bill, .modal-form, .modal-page { max-width: 560px; }
.modal-page.wide { max-width: 1100px; }

/* ============== 整页视图（菜单点击 → 渲染到 .content 内的 #pageView） ============== */
.page-view {
  padding: 16px 20px 24px;
  min-height: 100%;
  animation: pv-fade .18s ease-out;
}
@keyframes pv-fade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.page-view .pv-bread {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: var(--c-text-secondary);
  margin-bottom: 12px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--c-border);
}
.page-view .pv-bread .pv-ico { color: var(--c-text-secondary); }
.page-view .pv-bread .pv-crumb { color: var(--c-text-regular); }
.page-view .pv-bread .pv-cur { color: var(--c-primary); font-weight: 600; }
.page-view .pv-bread .pv-sep { color: var(--c-text-placeholder); }

/* pageView 内的子元素继承原页面宽度，不被 max-width 限制 */
.page-view .h-page, .page-view .modal-page, .page-view .modal-bill {
  max-width: none !important;
  width: 100%;
}
.modal-foot {
  padding: 12px 20px; border-top: 1px solid var(--c-border);
  display: flex; justify-content: flex-end; gap: 10px;
}
.btn-ghost {
  background: #fff; color: var(--c-text-regular); border: 1px solid var(--c-border);
  padding: 6px 16px; border-radius: var(--r-md); cursor: pointer;
  transition: all .15s ease;
}
.btn-ghost:hover { color: var(--c-primary); border-color: var(--c-primary); }
.btn-primary {
  background: var(--c-primary); color: #fff; border: 0;
  padding: 6px 16px; border-radius: var(--r-md); cursor: pointer;
  transition: opacity .15s ease;
}
.btn-primary:hover { opacity: .9; }
.btn-primary:disabled { background: #c0c4cc; cursor: not-allowed; }

.bill-detail-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; }
.bill-house { font-size: 16px; font-weight: 600; color: var(--c-text); }
.bill-status { font-size: 12px; padding: 3px 10px; border-radius: 12px; }
.bill-status.paid { background: var(--c-success); color: #fff; }
.bill-status.unpaid { background: var(--c-danger-light); color: var(--c-danger); }
.bill-detail-amount { font-size: 28px; font-weight: 700; color: var(--c-danger); margin-bottom: 16px; }
.bill-detail-meta {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px;
  background: var(--c-bg); padding: 14px; border-radius: var(--r-md); margin-bottom: 14px;
}
.bill-detail-meta > div { display: flex; justify-content: space-between; font-size: 13px; }
.bill-detail-meta span { color: var(--c-text-secondary); }
.bill-detail-meta b { color: var(--c-text); font-weight: 600; }
.bill-detail-meta .red { color: var(--c-danger); }
.bill-detail-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.dyn-form { display: grid; gap: 14px; }
.dyn-field { display: flex; flex-direction: column; gap: 6px; }
.dyn-field label { font-size: 13px; color: var(--c-text-regular); }
.dyn-field .req { color: var(--c-danger); margin-right: 2px; }
.dyn-field input, .dyn-field select, .dyn-field textarea {
  border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 7px 10px;
  font-size: 13px; outline: none; transition: border-color .15s ease;
}
.dyn-field input:focus, .dyn-field select:focus, .dyn-field textarea:focus { border-color: var(--c-primary); }
.dyn-field .invalid { border-color: var(--c-danger); }

/* ============== 动态表格 ============== */
.dyn-table { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: auto; }
.dyn-table th, .dyn-table td {
  padding: 9px 10px; border-bottom: 1px solid var(--c-border); text-align: left;
  white-space: nowrap;
}
.dyn-table th { background: var(--c-bg); color: var(--c-text-regular); font-weight: 600; }
.dyn-table tr:hover td { background: var(--c-bg); }

/* 表格外层（包装在审批/线索/巡房等页面的表格区域）：允许横向滚动 */
.rev-table, .be-table, .bp-table, .cp-table, .pt-table, .lead-table, .approval-table {
  overflow-x: auto;
  background: #fff;
  border-radius: var(--r-md);
  border: 1px solid var(--c-border-light);
}
.rev-table .dyn-table, .be-table .dyn-table, .bp-table .dyn-table,
.cp-table .dyn-table, .pt-table .dyn-table, .lead-table .dyn-table,
.approval-table .dyn-table { min-width: 900px; }

/* 收房管理表格（11 列，原网站真实结构） */
.rev-tbl th, .rev-tbl td { padding: 9px 8px; font-size: 13px; }
.rev-tbl td:nth-child(2) { min-width: 260px; color: var(--c-text-regular); }
.rev-house-status { padding: 4px 8px; font-size: 12px; border-radius: 4px; border: 1px solid var(--c-border); background: #fff; color: var(--c-text-regular); }

/* 批量编辑表格（12 列，原网站真实结构） */
.be-tbl th, .be-tbl td { padding: 7px 6px; font-size: 12px; }
.be-input { padding: 4px 6px; font-size: 12px; border: 1px solid var(--c-border); border-radius: 4px; }
.be-mini { padding: 3px 6px; font-size: 12px; border: 1px solid var(--c-border); border-radius: 4px; background: #fff; }
.be-edit-btn { padding: 4px 12px; font-size: 12px; background: var(--c-primary); color: #fff; border: 0; border-radius: 4px; cursor: pointer; }
.be-toggle { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; color: var(--c-text-regular); }

/* 行内编辑输入框（批量编辑 / 批量定价共用） */
.be-tbl .be-in, .bp-tbl .bp-in {
  width: 100%; min-width: 56px; max-width: 120px;
  padding: 4px 6px; font-size: 12px;
  border: 1px solid var(--c-border); border-radius: 4px;
  background: #fff; color: var(--c-text-regular);
}
.bp-tbl .bp-in { max-width: 90px; }
.be-tbl .be-in:focus, .bp-tbl .bp-in:focus { border-color: var(--c-primary); outline: none; }
/* 有未保存改动的行 */
tr.be-dirty { background: #fff8e6 !important; }
tr.be-dirty td:first-child { box-shadow: inset 3px 0 0 var(--c-primary); }
.be-tbl .be-save-one, .bp-tbl .bp-save { white-space: nowrap; }
.be-tbl td:first-child, .bp-tbl td:first-child { text-align: center; }

/* 批量定价表格（11 列，原网站真实结构） */
.bp-tbl th, .bp-tbl td { padding: 7px 6px; font-size: 12px; }
.bp-in { width: 70px; padding: 4px 6px; font-size: 12px; border: 1px solid var(--c-border); border-radius: 4px; background: #fff; }
.bp-save { padding: 4px 12px; font-size: 12px; background: var(--c-primary); color: #fff; border: 0; border-radius: 4px; cursor: pointer; }

/* 包房管理 + 巡房管理 */
.cp-stats-row { display: flex; gap: 14px; padding: 14px 20px 6px; flex-wrap: wrap; }
.cp-stat-card { background: #fff; border: 1px solid var(--c-border); border-radius: 8px; padding: 14px 18px; min-width: 140px; }
.cp-stat-num { font-size: 22px; font-weight: 700; color: var(--c-primary); }
.cp-stat-suf { font-size: 13px; color: var(--c-text-secondary); margin-left: 4px; font-weight: 400; }
.cp-stat-label { font-size: 12px; color: var(--c-text-secondary); margin-top: 4px; }
.cp-tbl th, .cp-tbl td { padding: 9px 8px; font-size: 13px; }
.cp-detail, .cp-renew, .pt-detail { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.cp-detail:hover, .cp-renew:hover, .pt-detail:hover { color: var(--c-primary); border-color: var(--c-primary); }

.pt-tbl th, .pt-tbl td { padding: 9px 8px; font-size: 13px; }
.pt-tbl td:nth-child(2) { min-width: 220px; }

.badge { display: inline-block; padding: 2px 8px; border-radius: 10px; font-size: 12px; }
.badge.ok { background: var(--c-primary-light); color: var(--c-primary); }
.badge.warn { background: var(--c-danger-light); color: var(--c-danger); }
.badge.info { background: #ecf5ff; color: #409eff; }

/* ============== 审批中心（1:1 复刻原网站 approval）============== */
.ap-tbl th, .ap-tbl td { padding: 9px 8px; font-size: 13px; }
.ap-tbl td:nth-child(3) { min-width: 320px; color: var(--c-text-regular); }
.ap-tbl td:nth-child(5), .ap-tbl td:nth-child(6) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }

.ap-pass, .ap-reject, .ap-detail { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.ap-pass { color: var(--c-success); border-color: var(--c-success); }
.ap-pass:hover { background: var(--c-success); color: #fff; }
.ap-reject { color: var(--c-danger); border-color: var(--c-danger); }
.ap-reject:hover { background: var(--c-danger); color: #fff; }
.ap-detail:hover { color: var(--c-primary); border-color: var(--c-primary); }

.ap-feature { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 28px 32px; }
.ap-feature h3 { font-size: 18px; color: var(--c-text); margin-bottom: 14px; }
.ap-feature p { color: var(--c-text-regular); line-height: 1.8; margin-bottom: 10px; }
.ap-feature ul { list-style: none; padding: 0; }
.ap-feature li { padding: 10px 0; border-bottom: 1px dashed var(--c-border-light); color: var(--c-text-regular); line-height: 1.7; }
.ap-feature li b { color: var(--c-primary); margin-right: 6px; }

/* ============== 线索（租客/业主）1:1 复刻 ============== */
.lead-tbl th, .lead-tbl td { padding: 9px 8px; font-size: 13px; }
.lead-tbl td:nth-child(2) { font-family: 'SFMono-Regular', Consolas, monospace; }
.lead-tbl td:nth-child(10), .lead-tbl td:nth-child(11) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }

.lead-detail, .lead-follow { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.lead-detail:hover, .lead-follow:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* ============== 合同模块 4 页面（1:1 复刻原网站 contract/manage/*）============== */
.ct-table, .cr-table, .co-table, .cp-table { overflow-x: auto; background: #fff; border-radius: var(--r-md); border: 1px solid var(--c-border-light); }
.ct-table .dyn-table, .cr-table .dyn-table, .co-table .dyn-table, .cp-table .dyn-table { min-width: 960px; }

.ct-tbl th, .ct-tbl td, .cr-tbl th, .cr-tbl td, .co-tbl th, .co-tbl td, .cp-tbl th, .cp-tbl td { padding: 9px 8px; font-size: 13px; }
/* 注意：租客/业主合同表已加「勾选」列（第 1 列），因此下面 nth-child 均 +1 */
.ct-tbl td:nth-child(4), .co-tbl td:nth-child(4), .cp-tbl td:nth-child(1) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }
.cr-tbl td:nth-child(3), .cr-tbl td:nth-child(4), .cr-tbl td:nth-child(5), .cr-tbl td:nth-child(6) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }
.ct-tbl td:nth-child(6), .ct-tbl td:nth-child(7), .co-tbl td:nth-child(6), .co-tbl td:nth-child(7), .cp-tbl td:nth-child(5) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }

/* 合同勾选列 + 批量操作条 */
.ct-tbl th.ct-ck, .ct-tbl td.ct-ck, .co-tbl th.ct-ck, .co-tbl td.ct-ck { width: 34px; text-align: center; padding-left: 6px; padding-right: 4px; }
.ct-tbl td.ct-ck input, .co-tbl td.ct-ck input { cursor: pointer; }
.ct-batch {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 8px 14px; margin-bottom: 10px;
  background: var(--c-primary-light); border: 1px solid #c9d8ff; border-radius: 8px;
}
.ct-batch-info { font-size: 13px; color: var(--c-text-regular); }
.ct-batch-info b { color: var(--c-primary); font-size: 15px; }
.ct-batch .btn-ghost, .ct-batch .btn-primary { height: 30px !important; padding: 0 14px !important; font-size: 13px; }

.ct-detail, .ct-edit, .cr-detail, .cr-sign, .co-detail, .co-renew, .cp-detail, .cp-renew {
  padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px;
}
.ct-detail:hover, .ct-edit:hover, .cr-detail:hover, .cr-sign:hover, .co-detail:hover, .co-renew:hover, .cp-detail:hover, .cp-renew:hover {
  color: var(--c-primary); border-color: var(--c-primary);
}

.h-dash { padding: 0 4px; color: var(--c-text-secondary); font-size: 12px; align-self: center; }

/* ============== 公告列表 ============== */
.ann-list { display: grid; gap: 12px; }
.ann-item { padding: 12px; border: 1px solid var(--c-border); border-radius: var(--r-md); }
.ann-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.ann-head b { color: var(--c-text); font-size: 14px; }
.ann-head span { color: var(--c-text-secondary); font-size: 12px; }
.ann-body { color: var(--c-text-regular); font-size: 13px; line-height: 1.7; }
.ann-foot { margin-top: 6px; color: var(--c-text-secondary); font-size: 12px; }

/* ============== 日程列表 ============== */
.schedule-list { display: grid; gap: 8px; }
.schedule-row {
  display: grid; grid-template-columns: 60px 1fr 60px; align-items: center; gap: 8px;
  padding: 8px; background: var(--c-bg); border-radius: var(--r-md);
}
.s-time { font-weight: 600; color: var(--c-primary); }
.s-title { color: var(--c-text); }
.s-tag {
  font-size: 12px; padding: 2px 8px; border-radius: 10px;
  background: var(--c-primary-light); color: var(--c-primary); text-align: center;
}

/* ============== 搜索结果 ============== */
.search-row-body { display: flex; flex-direction: column; }
.search-row-title { color: var(--c-text); font-size: 13px; }
.search-row-sub { color: var(--c-text-secondary); font-size: 12px; margin-top: 2px; }

/* ============== Toast 增强 ============== */
.toast-success { background: var(--c-success) !important; }
.toast-error { background: var(--c-danger) !important; }

/* ============== 出房管理 / 空房快查（1:1 复刻原网站）============== */
.h-page { padding: 0; }
.h-toolbar { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--c-border-light); margin-bottom: 12px; flex-wrap: wrap; }
.h-tabs { display: flex; gap: 4px; flex-shrink: 0; flex-wrap: nowrap; }
.h-tab { background: transparent; border: 1px solid var(--c-border); padding: 6px 14px; border-radius: var(--r-sm); cursor: pointer; font-size: 13px; color: var(--c-text-regular); transition: all .15s; white-space: nowrap; flex-shrink: 0; }
.h-tab:hover { border-color: var(--c-primary); color: var(--c-primary); }
.h-tab.active { background: var(--c-primary); color: #fff; border-color: var(--c-primary); }
.h-search { flex: 1; display: flex; gap: 8px; max-width: 460px; }
.h-select, .h-input { border: 1px solid var(--c-border); padding: 6px 10px; border-radius: var(--r-sm); font-size: 13px; outline: none; background: #fff; }
.h-input { flex: 1; }
.h-tools { display: flex; gap: 6px; margin-left: auto; flex-shrink: 0; flex-wrap: nowrap; }
.h-tool { background: transparent; border: 1px solid var(--c-border); width: 32px; height: 32px; border-radius: var(--r-sm); cursor: pointer; color: var(--c-text-regular); font-size: 14px; flex-shrink: 0; }
.h-tool:hover { border-color: var(--c-primary); color: var(--c-primary); }
.h-tool.h-tool-text { width: auto; padding: 0 14px; white-space: nowrap; flex-shrink: 0; }
.h-tools .h-select { height: 32px; padding: 0 10px; }

.h-main { display: grid; grid-template-columns: 1fr 256px; gap: 12px; align-items: start; }
.h-list { min-height: 480px; padding-right: 8px; }

/* ---- 房屋卡片（1:1 复刻原站 .panel.card：188x100 / 左 3px 状态色条 / 整块浅色底）---- */
.h-card-group { margin-bottom: 14px; }
.h-card-group-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 8px; height: 20px;
}
.h-card-group-title { font-size: 13px; color: var(--c-text); }
.h-card-group-actions { display: flex; align-items: center; gap: 6px; }
.h-more-btn {
  display: inline-flex; align-items: center; gap: 2px;
  height: 20px; padding: 0 4px;
  border: 1px solid #eeeeee; border-radius: 2px;
  background: #fff; color: var(--c-text-regular);
  font-size: 12px; line-height: 18px;
}
.h-more-btn:hover { border-color: var(--c-primary); color: var(--c-primary); }
.h-more-btn .ico { width: 10px; height: 10px; }
.h-eye-btn {
  width: 20px; height: 20px; display: inline-flex;
  align-items: center; justify-content: center;
  border: 0; background: none; color: #999; cursor: pointer;
}
.h-eye-btn:hover { color: var(--c-primary); }
.h-eye-btn .ico { width: 15px; height: 15px; }

.h-cards { display: grid; grid-template-columns: repeat(auto-fill, 188px); gap: 12px 10px; }
.h-card {
  position: relative; height: 100px;
  border-radius: 2px; border-left: 3px solid #909399;
  background: #f2f3f5; padding-left: 2px;
  overflow: hidden; cursor: pointer;
  transition: box-shadow .15s;
}
.h-card:hover { box-shadow: 0 2px 8px rgba(0,0,0,.12); }
.h-card.living-house  { background: #d1f2f2; border-left-color: #00aaaa; }
.h-card.reserve-house { background: #fff4ec; border-left-color: #ff963c; }
.h-card.empty-house   { background: #feefef; border-left-color: #d72332; }
.h-card.gray-house    { background: #f2f3f5; border-left-color: #909399; }
.h-card-head { display: flex; align-items: center; height: 33px; padding: 0 8px 0 5px; }
.h-card-status-ico { width: 16px; height: 16px; color: #555; }
.h-card-name {
  margin-left: 6px; font-size: 12px; font-weight: 700; color: #555;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 118px;
}
.h-card-avatar {
  margin-left: auto; width: 18px; height: 18px; border-radius: 50%;
  background: #c9cdd4; color: #fff; font-size: 11px; line-height: 18px; text-align: center;
  flex-shrink: 0;
}
.h-card-body { padding: 0 8px 0 5px; }
.h-card-price {
  font-size: 12px; color: #555; line-height: 18px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.h-card-meta { font-size: 11px; color: #555; line-height: 18px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.h-card-foot { display: flex; align-items: center; justify-content: space-between; height: 20px; font-size: 12px; color: #555; }
.h-card-tags { display: flex; gap: 2px; }
.h-card-tag { width: 14px; height: 14px; border-radius: 2px; color: #fff; font-size: 10px; line-height: 14px; text-align: center; }
.cell-sub { font-size: 12px; color: var(--c-text-secondary); }
.meter-off { color: var(--c-text-placeholder); font-size: 12px; }

.h-count-chip {
  position: sticky; bottom: 0; margin: 12px auto 0; width: fit-content;
  background: #000; color: #fff; font-size: 12px;
  border-radius: 4px; padding: 2px 8px;
}
/* 出房管理：加载更多 / 已到底 */
.h-list { max-height: calc(100vh - 190px); overflow-y: auto; }
.h-loadmore-wrap { text-align: center; padding: 14px 0 6px; }
.h-loadmore {
  border: 1px solid var(--c-border); background: #fff; color: var(--c-primary);
  font-size: 12.5px; padding: 6px 22px; border-radius: 16px; cursor: pointer;
}
.h-loadmore:hover { border-color: var(--c-primary); background: #f2f6ff; }
.h-nomore { font-size: 12px; color: var(--c-text-placeholder); }
.h-cards-flat { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 10px; margin-bottom: 10px; }
.f-check .f-cnt { color: var(--c-text-secondary); margin-left: auto; }

/* 右侧筛选面板 */
.h-filter { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 0; height: fit-content; }
.f-section { padding: 10px 12px; border-bottom: 1px solid var(--c-border-light); }
.f-section:last-child { border-bottom: none; }
.f-title { font-weight: 600; font-size: 13px; margin-bottom: 8px; display: flex; justify-content: space-between; align-items: center; }
.f-clear { color: var(--c-primary); font-size: 12px; cursor: pointer; font-weight: normal; }
.f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-bottom: 6px; }
.f-sel { border: 1px solid var(--c-border); padding: 5px 8px; border-radius: var(--r-sm); font-size: 12px; background: #fff; }
.f-radio, .f-check { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--c-text-regular); margin-bottom: 4px; cursor: pointer; line-height: 20px; }
.f-radio input, .f-check input { margin: 0; }
.f-radio .f-cnt { color: var(--c-text-secondary); margin-left: auto; }
.f-ico { display: inline-flex; align-items: center; gap: 4px; }
.f-tag { display: inline-block; width: 16px; height: 16px; line-height: 16px; text-align: center; border-radius: 3px; font-size: 11px; margin-right: 4px; }

/* 空房快查 */
.h-quick-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 12px; }
.h-quick-stat { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 12px; }
.h-quick-stat-label { font-size: 12px; color: var(--c-text-secondary); }
.h-quick-stat-num { font-size: 22px; font-weight: 700; color: var(--c-primary); margin-top: 4px; }
.h-quick-table { background: #fff; border-radius: var(--r-md); overflow: hidden; }

/* 响应式 */
@media (max-width: 1100px) {
  .h-main { grid-template-columns: 1fr; }
  .h-filter { max-height: 320px; }
}

/* ============== 推广模块 / 会员 / 网签 / 社群 / 设置 1:1 复刻 ============== */

/* KPI 卡片（推广-流量顶部） */
.kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 14px; }
.kpi-card { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 18px 20px; }
.kpi-card .kpi-label { font-size: 13px; color: var(--c-text-secondary); margin-bottom: 8px; }
.kpi-card .kpi-num { font-size: 26px; font-weight: 700; color: var(--c-text); line-height: 1.2; }
.kpi-card .kpi-unit { font-size: 13px; color: var(--c-text-secondary); margin-left: 4px; font-weight: 400; }
.kpi-card .kpi-extra { font-size: 12px; color: var(--c-text-secondary); margin-top: 6px; }
.kpi-card.kpi-blue .kpi-num { color: var(--c-primary); }
.kpi-card.kpi-green .kpi-num { color: var(--c-success); }
.kpi-card.kpi-orange .kpi-num { color: #ff9500; }
.kpi-card.kpi-red .kpi-num { color: var(--c-danger); }

/* 通用表格外层 */
.pf-table, .pm-table, .ps-table, .pd-table, .mt-table, .ns-table, .cf-table, .cu-table {
  overflow-x: auto;
  background: #fff;
  border-radius: var(--r-md);
  border: 1px solid var(--c-border-light);
}
.pf-table .dyn-table, .pm-table .dyn-table, .ps-table .dyn-table,
.pd-table .dyn-table, .mt-table .dyn-table, .ns-table .dyn-table,
.cf-table .dyn-table, .cu-table .dyn-table { min-width: 920px; }

/* 推广-流量 */
.pf-tbl th, .pf-tbl td { padding: 9px 8px; font-size: 13px; }
.pf-tbl td:nth-child(4), .pf-tbl td:nth-child(5),
.pf-tbl td:nth-child(6), .pf-tbl td:nth-child(7),
.pf-tbl td:nth-child(8) { font-family: 'SFMono-Regular', Consolas, monospace; text-align: right; }

/* 推广-营销 */
.pm-tbl th, .pm-tbl td { padding: 9px 8px; font-size: 13px; }
.pm-tbl td:nth-child(1) { min-width: 200px; color: var(--c-text); font-weight: 600; }
.pm-tbl td:nth-child(4), .pm-tbl td:nth-child(5) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }
.pm-act-btn { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.pm-act-btn:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* 推广-试住结算 */
.ps-tbl th, .ps-tbl td { padding: 9px 8px; font-size: 13px; }
.ps-tbl td:nth-child(1) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }
.ps-tbl td:nth-child(5), .ps-tbl td:nth-child(6), .ps-tbl td:nth-child(7) { font-family: 'SFMono-Regular', Consolas, monospace; text-align: right; }

/* 推广-分销 */
.pd-tbl th, .pd-tbl td { padding: 9px 8px; font-size: 13px; }
.pd-tbl td:nth-child(5), .pd-tbl td:nth-child(6), .pd-tbl td:nth-child(7) { font-family: 'SFMono-Regular', Consolas, monospace; text-align: right; }
.pd-act-btn { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.pd-act-btn:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* 会员-人才轮候 */
.mt-tbl th, .mt-tbl td { padding: 9px 8px; font-size: 13px; }
.mt-tbl td:nth-child(2) { font-family: 'SFMono-Regular', Consolas, monospace; }
.mt-tbl td:nth-child(7), .mt-tbl td:nth-child(8) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }
.mt-act-btn { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.mt-act-btn:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* 网签-合同管理 */
.ns-tbl th, .ns-tbl td { padding: 9px 8px; font-size: 13px; }
.ns-tbl td:nth-child(1), .ns-tbl td:nth-child(6) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; color: var(--c-text-secondary); }
.ns-act-btn { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.ns-act-btn:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* 社群-租客评价 */
.cf-tbl th, .cf-tbl td { padding: 9px 8px; font-size: 13px; }
.cf-rating { color: #ff9500; font-size: 14px; letter-spacing: 1px; }
.cf-content { color: var(--c-text-regular); max-width: 360px; overflow: hidden; text-overflow: ellipsis; }
.cf-act-btn { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.cf-act-btn:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* 社群-活动 */
.cu-tbl th, .cu-tbl td { padding: 9px 8px; font-size: 13px; }
.cu-tbl td:nth-child(1) { min-width: 180px; color: var(--c-text); font-weight: 600; }
.cu-act-btn { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.cu-act-btn:hover { color: var(--c-primary); border-color: var(--c-primary); }

/* 设置-账号设置 多 Tab 表单 */
.st-form { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 24px 28px; }
.st-form h3 { font-size: 16px; color: var(--c-text); margin-bottom: 18px; padding-bottom: 12px; border-bottom: 1px solid var(--c-border-light); }
.st-form-row { display: grid; grid-template-columns: 140px 1fr; gap: 16px; margin-bottom: 14px; align-items: center; }
.st-form-row label { font-size: 13px; color: var(--c-text-regular); text-align: right; }
.st-form-row input, .st-form-row select, .st-form-row textarea {
  border: 1px solid var(--c-border); padding: 8px 12px; border-radius: var(--r-sm); font-size: 13px; outline: none; background: #fff; color: var(--c-text); max-width: 420px;
}
.st-form-row input:focus, .st-form-row select:focus, .st-form-row textarea:focus { border-color: var(--c-primary); }
.st-form-row textarea { min-height: 80px; resize: vertical; }
.st-form-row .st-tip { color: var(--c-text-secondary); font-size: 12px; margin-left: 8px; }
.st-form-actions { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--c-border-light); display: flex; gap: 10px; align-items: center; }
.st-form-save { padding: 8px 22px; background: var(--c-primary); color: #fff; border: 0; border-radius: var(--r-sm); cursor: pointer; font-size: 13px; }
.st-form-save:hover { background: var(--c-primary-hover); }

/* ============== 顶部「+ 新建」下拉菜单（1:1 复刻原网站）============== */
.topbar-create { position: relative; display: inline-block; }
.btn-create-arrow { margin-left: 4px; font-size: 10px; transition: transform .15s; display: inline-block; }
.topbar-create.open .btn-create-arrow { transform: rotate(180deg); }

/* 一级面板（紧贴按钮下方） */
.create-dropdown {
  position: absolute; top: calc(100% + 6px); right: 0;
  min-width: 180px; background: #fff; border-radius: var(--r-md);
  box-shadow: 0 8px 24px rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.06);
  border: 1px solid var(--c-border-light);
  padding: 6px 0; z-index: 999; display: none;
}
.topbar-create.open .create-dropdown { display: block; }

/* 单个菜单项 */
.cd-item {
  position: relative;
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 18px; font-size: 14px; color: var(--c-text-regular);
  cursor: pointer; transition: background .12s; white-space: nowrap;
}
.cd-item:hover { background: var(--c-bg); color: var(--c-primary); }
.cd-item .cd-arrow { color: var(--c-text-secondary); font-size: 10px; margin-left: 12px; }
.cd-item:hover .cd-arrow { color: var(--c-primary); }

/* 二级子菜单（hover 向右展开） */
.cd-sub {
  position: absolute; top: -7px; left: 100%;
  min-width: 180px; background: #fff; border-radius: var(--r-md);
  box-shadow: 0 8px 24px rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.06);
  border: 1px solid var(--c-border-light);
  padding: 6px 0;
  display: none;
}
.cd-item:hover > .cd-sub { display: block; }
.cd-sub .cd-item { padding: 8px 18px; font-size: 13px; }

/* 工具栏 / 区域下拉细节 */
.h-search { flex: 1; display: flex; gap: 8px; max-width: 560px; }

/* ============== 财务模块 5 页面（1:1 复刻）============== */
.bm-tbl th, .bm-tbl td { padding: 9px 8px; font-size: 13px; }
.bm-tbl td:nth-child(2) { min-width: 200px; color: var(--c-text-regular); }
.bm-tbl td:nth-child(5), .bm-tbl td:nth-child(6), .bm-tbl td:nth-child(7) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; }
.bm-mark, .bm-detail, .bm-print { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.bm-mark { color: var(--c-success); border-color: var(--c-success); }
.bm-mark:hover { background: var(--c-success); color: #fff; }
.bm-detail:hover, .bm-print:hover { color: var(--c-primary); border-color: var(--c-primary); }

.bl-tbl th, .bl-tbl td { padding: 9px 8px; font-size: 13px; }
.bl-tbl td:nth-child(3) { min-width: 200px; color: var(--c-text-regular); }
.bl-tbl td:nth-child(5), .bl-tbl td:nth-child(7) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; }

.pa-tbl th, .pa-tbl td { padding: 9px 8px; font-size: 13px; }
.pa-tbl td:nth-child(2) { min-width: 200px; color: var(--c-text-regular); }
.pa-tbl td:nth-child(3), .pa-tbl td:nth-child(5) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; }
.pa-pass, .pa-reject, .pa-detail { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.pa-pass { color: var(--c-success); border-color: var(--c-success); }
.pa-pass:hover { background: var(--c-success); color: #fff; }
.pa-reject { color: var(--c-danger); border-color: var(--c-danger); }
.pa-reject:hover { background: var(--c-danger); color: #fff; }
.pa-detail:hover { color: var(--c-primary); border-color: var(--c-primary); }

.bi-tbl th, .bi-tbl td { padding: 9px 8px; font-size: 13px; }
.bi-tbl td:nth-child(4), .bi-tbl td:nth-child(6) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; }
.bi-issue, .bi-detail, .bi-download { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.bi-issue { color: var(--c-primary); border-color: var(--c-primary); }
.bi-issue:hover { background: var(--c-primary); color: #fff; }
.bi-detail:hover, .bi-download:hover { color: var(--c-primary); border-color: var(--c-primary); }

.bs-tbl th, .bs-tbl td { padding: 9px 8px; font-size: 13px; }
.bs-tbl td:nth-child(1) { min-width: 240px; }
.bs-tbl td:nth-child(4) { font-family: 'SFMono-Regular', Consolas, monospace; }
.bs-detail, .bs-pay { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.bs-detail:hover, .bs-pay:hover { color: var(--c-primary); border-color: var(--c-primary); }


/* ============== 报表 / 设备 / 抄表 / 工单 9 页面样式（1:1 复刻）============== */
/* 报表通用：KPI 卡片 */
.rp-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.rp-kpis:has(.rp-kpi:nth-child(6)) { grid-template-columns: repeat(6, 1fr); }
.rp-kpi { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 14px 18px; }
.rp-kpi-label { font-size: 12px; color: var(--c-text-secondary); margin-bottom: 6px; }
.rp-kpi-num { font-size: 22px; font-weight: 700; line-height: 1.2; }
.rp-kpi-suf { font-size: 12px; color: var(--c-text-secondary); margin-top: 4px; }

/* 报表通用：图表占位 */
.rp-charts { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px; margin-bottom: 14px; }
.rp-chart { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 16px 18px; }
.rp-chart-title { font-weight: 600; font-size: 13px; color: var(--c-text); margin-bottom: 14px; }

/* 柱状图占位 */
.rp-bars { display: flex; align-items: flex-end; justify-content: space-between; height: 160px; gap: 8px; padding-top: 10px; border-bottom: 1px solid var(--c-border-light); }
.rp-bar { flex: 1; background: linear-gradient(180deg, #5fa8ed 0%, #3a8ee6 100%); border-radius: 4px 4px 0 0; position: relative; min-height: 8px; transition: opacity .15s; }
.rp-bar:hover { opacity: .8; }
.rp-bar span { position: absolute; bottom: -22px; left: 50%; transform: translateX(-50%); font-size: 11px; color: var(--c-text-secondary); white-space: nowrap; }
.rp-bar-active { background: linear-gradient(180deg, #ffb84d 0%, #ff9500 100%); }

/* 饼图占位（用 CSS conic-gradient 模拟） */
.rp-pie-wrap { display: flex; align-items: center; gap: 18px; }
.rp-pie {
  width: 140px; height: 140px; border-radius: 50%; flex-shrink: 0;
  background: conic-gradient(
    #3a8ee6 0% 72%,
    #67c23a 72% 84%,
    #e6a23c 84% 92%,
    #909399 92% 97%,
    #ee5252 97% 100%
  );
  position: relative;
}
.rp-pie::after {
  content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 70px; height: 70px; background: #fff; border-radius: 50%;
}
.rp-pie-legend { display: flex; flex-direction: column; gap: 6px; font-size: 12px; color: var(--c-text-regular); }
.rp-pie-legend div { display: flex; align-items: center; gap: 6px; }
.rp-pie-legend i { display: inline-block; width: 12px; height: 12px; border-radius: 2px; }

/* 报表：自适应 KPI 栅格（数量不定时用） */
.rp-kpis-auto { grid-template-columns: repeat(auto-fit, minmax(148px, 1fr)) !important; }

/* 报表：期间说明 */
.rp-period-note { font-size: 12px; color: var(--c-text-secondary); margin: 2px 0 10px; }

/* 报表：工具栏右侧按钮不被压缩 */
.h-page .h-tools { flex-shrink: 0; }
/* 报表：实时快照徽标 */
.rp-live-badge { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #67C23A; background: rgba(103, 194, 58, .1); border: 1px solid rgba(103, 194, 58, .3); border-radius: 999px; padding: 5px 12px; }
/* 报表：分页条 */
.rp-pager { display: flex; align-items: center; gap: 10px; justify-content: flex-end; padding: 12px 6px 4px; font-size: 12px; color: var(--c-text-secondary); }
.rp-pager .h-tool[disabled] { opacity: .45; cursor: not-allowed; }

/* 报表：图表单列（环形图页） */
.rp-charts-1 { grid-template-columns: 1fr; }

/* 报表：SVG 图表容器 */
.rp-svg-chart { width: 100%; }
.rp-svg-chart svg { width: 100%; height: 190px; display: block; }
.rp-bar-legend { display: flex; gap: 16px; justify-content: center; margin-top: 6px; font-size: 12px; color: var(--c-text-regular); }
.rp-bar-lg { display: inline-flex; align-items: center; gap: 6px; }
.rp-bar-lg i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }

/* 报表：环形图 */
.rp-donut-wrap { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.rp-donut { position: relative; flex-shrink: 0; }
.rp-donut svg { display: block; }
.rp-donut-center { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; pointer-events: none; }
.rp-donut-total { font-size: 15px; font-weight: 700; color: var(--c-text); }
.rp-donut-cap { font-size: 11px; color: var(--c-text-secondary); margin-top: 2px; }
.rp-legend { display: flex; flex-direction: column; gap: 8px; font-size: 12px; flex: 1; min-width: 180px; }
.rp-lg-row { display: flex; align-items: center; gap: 8px; color: var(--c-text-regular); }
.rp-lg-row i { width: 10px; height: 10px; border-radius: 2px; flex-shrink: 0; }
.rp-lg-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rp-lg-val { font-family: 'SFMono-Regular', Consolas, monospace; color: var(--c-text); }
.rp-lg-share { width: 46px; text-align: right; color: var(--c-text-secondary); font-family: 'SFMono-Regular', Consolas, monospace; }
.rp-empty { color: var(--c-text-secondary); font-size: 12px; padding: 30px 0; text-align: center; }

/* 房态报表：矩阵与汇总 */
.rhc-matrix-wrap { background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 14px 16px; margin-bottom: 14px; }
.rhc-matrix-title { font-weight: 600; font-size: 13px; color: var(--c-text); margin-bottom: 12px; }
.rhc-tbl { min-width: 640px; }
.rhc-b-tbl { min-width: 760px; }
.rhc-b-tbl td:nth-child(1) { min-width: 180px; }
.rhc-b-tbl td:nth-child(3), .rhc-b-tbl td:nth-child(4), .rhc-b-tbl td:nth-child(5), .rhc-b-tbl td:nth-child(6) { text-align: center; font-family: 'SFMono-Regular', Consolas, monospace; }
.rhc-b-tbl td:nth-child(8) { font-family: 'SFMono-Regular', Consolas, monospace; }

/* 报表通用：表格外层 */
.rp-table { overflow-x: auto; background: #fff; border-radius: var(--r-md); border: 1px solid var(--c-border-light); padding: 4px; }

/* 报表 4 表格 */
.rp-tbl th, .rp-tbl td, .rpf-tbl th, .rpf-tbl td, .rhc-tbl th, .rhc-tbl td, .rrc-tbl th, .rrc-tbl td { padding: 9px 10px; font-size: 13px; }
.rp-tbl .dyn-table, .rpf-tbl .dyn-table, .rhc-tbl .dyn-table, .rrc-tbl .dyn-table { min-width: 900px; }
.rp-tbl td:nth-child(2), .rpf-tbl td:nth-child(1), .rhc-tbl td:nth-child(1), .rrc-tbl td:nth-child(1) { min-width: 180px; color: var(--c-text-regular); }
.rp-tbl td:nth-child(4), .rp-tbl td:nth-child(5), .rp-tbl td:nth-child(6) { font-family: 'SFMono-Regular', Consolas, monospace; }
.rpf-tbl td { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; }
.rhc-tbl td:nth-child(2), .rhc-tbl td:nth-child(3), .rhc-tbl td:nth-child(4) { text-align: center; font-family: 'SFMono-Regular', Consolas, monospace; }

/* 设备 / 抄表 / 工单 通用：表格外层 */
.dv-table, .cl-table, .cs-table, .wk-table { overflow-x: auto; background: #fff; border-radius: var(--r-md); border: 1px solid var(--c-border-light); padding: 4px; }
.dv-table .dyn-table, .cl-table .dyn-table, .cs-table .dyn-table, .wk-table .dyn-table { min-width: 980px; }

/* 设备 / 抄表 / 工单 表格 */
.dv-tbl th, .dv-tbl td, .da-tbl th, .da-tbl td, .cl-tbl th, .cl-tbl td, .cs-tbl th, .cs-tbl td, .wk-tbl th, .wk-tbl td { padding: 9px 8px; font-size: 13px; }
.dv-tbl td:nth-child(4), .da-tbl td:nth-child(1), .cl-tbl td:nth-child(1), .cs-tbl td:nth-child(1), .wk-tbl td:nth-child(3) { min-width: 200px; color: var(--c-text-regular); }
.dv-tbl td:nth-child(9) { font-size: 12px; color: var(--c-text-secondary); }
.cl-tbl td:nth-child(3), .cl-tbl td:nth-child(4), .cl-tbl td:nth-child(5), .cl-tbl td:nth-child(6) { font-family: 'SFMono-Regular', Consolas, monospace; }
.cs-tbl td:nth-child(3), .cs-tbl td:nth-child(4), .cs-tbl td:nth-child(5) { font-family: 'SFMono-Regular', Consolas, monospace; }
.wk-tbl td:nth-child(5) { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wk-tbl td:nth-child(9), .wk-tbl td:nth-child(10) { font-size: 12px; color: var(--c-text-secondary); }

/* 报表 6 卡 KPI 自适应 */
@media (max-width: 1100px) {
  .rp-charts { grid-template-columns: 1fr; }
  .rp-kpis { grid-template-columns: repeat(2, 1fr) !important; }
}

/* ============== 新手上路（dashboard/tasks）============== */
.task-head {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md);
  padding: 18px 22px; margin-bottom: 14px;
}
.task-head-title { font-size: 18px; color: var(--c-text); margin-bottom: 6px; font-weight: 600; }
.task-head-sub { font-size: 13px; color: var(--c-text-secondary); }
.task-head-right { min-width: 240px; }
.task-progress-text { font-size: 13px; color: var(--c-text-regular); margin-bottom: 6px; text-align: right; }
.task-progress-text b { color: var(--c-primary); font-size: 15px; }
.task-progress { height: 8px; background: var(--c-border); border-radius: 99px; overflow: hidden; }
.task-progress span { display: block; height: 100%; background: var(--c-primary); border-radius: 99px; transition: width .3s; }
.task-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.task-card {
  display: flex; align-items: center; gap: 14px;
  background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md);
  padding: 16px 18px; transition: box-shadow .15s;
}
.task-card:hover { box-shadow: var(--shadow-md); }
.task-card.is-done { opacity: .72; }
.task-ico {
  width: 40px; height: 40px; flex: 0 0 40px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 18px;
}
.task-ico.task-blue { background: #ecf5ff; }
.task-ico.task-red { background: #fef0f0; }
.task-ico.task-orange { background: #fff4e6; }
.task-ico.task-green { background: #f0f9eb; }
.task-ico.task-cyan { background: #e8f8f8; }
.task-body { flex: 1; min-width: 0; }
.task-title { font-size: 14px; color: var(--c-text); margin-bottom: 4px; }
.task-desc { font-size: 12px; color: var(--c-text-secondary); }
.task-action { flex-shrink: 0; }
.task-go-btn {
  padding: 5px 14px; border: 1px solid var(--c-primary); color: var(--c-primary);
  background: #fff; border-radius: 99px; font-size: 12px; cursor: pointer;
}
.task-go-btn:hover { background: var(--c-primary); color: #fff; }
.task-done-text { font-size: 12px; color: var(--c-text-secondary); }
.task-done-text.muted { color: var(--c-text-placeholder); }
@media (max-width: 1100px) { .task-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 720px) { .task-grid { grid-template-columns: 1fr; } }

/* ============== 短信（sms/manage）============== */
.sms-wrap { display: flex; gap: 24px; align-items: flex-start; }
.sms-form {
  flex: 1; min-width: 0;
  background: #fff; border: 1px solid var(--c-border); border-radius: var(--r-md);
  padding: 20px 24px;
}
.sms-row { display: grid; grid-template-columns: 96px 1fr; gap: 14px; align-items: center; margin-bottom: 16px; }
.sms-row-top { align-items: flex-start; }
.sms-row > label { font-size: 13px; color: var(--c-text-regular); text-align: right; }
.sms-req { color: var(--c-danger); font-style: normal; margin-left: 4px; }
.sms-radios { display: flex; gap: 18px; align-items: center; }
.sms-radio, .sms-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--c-text-regular); cursor: pointer; }
.sms-picked { font-size: 13px; color: var(--c-text-secondary); margin-top: 8px; }
.sms-picked b { color: var(--c-primary); }
.sms-link-btn { color: var(--c-primary); font-size: 13px; background: none; border: 0; cursor: pointer; padding: 0; margin-top: 8px; }
.sms-editor { border: 1px solid var(--c-border); border-radius: var(--r-sm); padding: 10px 12px; background: #fff; }
.sms-sign { font-size: 13px; color: var(--c-text); margin-bottom: 6px; }
.sms-edit-sign { color: var(--c-primary); font-size: 12px; margin-left: 6px; }
.sms-editor textarea {
  width: 100%; min-height: 130px; border: 0; outline: none; resize: vertical;
  font-size: 13px; color: var(--c-text); font-family: inherit;
}
.sms-counter { display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--c-text-secondary); }
.sms-submit { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.sms-send-btn { padding: 8px 32px; background: var(--c-primary); color: #fff; border: 0; border-radius: var(--r-sm); font-size: 13px; cursor: pointer; }
.sms-send-btn:hover { background: var(--c-primary-hover); }
.sms-preview { flex: 0 0 260px; }
.sms-phone {
  width: 260px; height: 460px; background: #fff; border: 1px solid var(--c-border);
  border-radius: 22px; box-shadow: var(--shadow-md); padding: 18px 14px; overflow: hidden;
}
.sms-phone-bar { text-align: center; font-size: 12px; color: var(--c-text-secondary); margin-bottom: 20px; }
.sms-phone-msg {
  background: var(--c-bg); border-radius: 8px; padding: 10px 12px;
  font-size: 13px; color: var(--c-text-regular); line-height: 1.6; word-break: break-all;
}
.sms-preview-tip { text-align: center; font-size: 12px; color: var(--c-text-secondary); margin-top: 10px; }

/* ============== 钱包（company-sua-wallets/manage）============== */
.wallet-notice {
  background: #fff4e6; border: 1px solid #ffe0b2; color: #b26a00;
  font-size: 13px; padding: 10px 16px; border-radius: var(--r-sm); margin-bottom: 14px;
}
.wallet-notice .link-blue { margin-left: 6px; }

/* ============== 消息中心（message/core）============== */
.msg-list { border: 1px solid var(--c-border); border-radius: var(--r-lg); overflow: hidden; }
.msg-row {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 14px 16px; border-bottom: 1px solid var(--c-border-light); cursor: pointer;
}
.msg-row:last-child { border-bottom: none; }
.msg-row:hover { background: var(--c-bg); }
.msg-icon {
  width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0;
  background: var(--c-primary-light); color: var(--c-primary);
  display: flex; align-items: center; justify-content: center;
}
.msg-body { flex: 1; min-width: 0; }
.msg-title { font-size: 13px; color: var(--c-text); margin-bottom: 4px; }
.msg-row.unread .msg-title::before {
  content: ''; display: inline-block; width: 6px; height: 6px;
  border-radius: 50%; background: var(--c-danger);
  margin-right: 6px; vertical-align: middle;
}
.msg-text { font-size: 12px; color: var(--c-text-secondary); }
.msg-time { font-size: 12px; color: var(--c-text-secondary); white-space: nowrap; }
.msg-empty {
  padding: 60px; text-align: center; color: var(--c-text-secondary);
  border: 1px solid var(--c-border); border-radius: var(--r-lg);
}
.msg-pager {
  display: flex; align-items: center; justify-content: flex-end; gap: 8px;
  margin-top: 14px; font-size: 12px; color: var(--c-text-regular);
}
.msg-total { margin-right: auto; }
.msg-pager .pg-prev, .msg-pager .pg-next, .msg-pager .pg-num {
  min-width: 28px; height: 28px; border: 1px solid var(--c-border);
  background: #fff; border-radius: var(--r-sm);
  font-size: 12px; color: var(--c-text-regular);
}
.msg-pager .pg-num.active { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.msg-pager button[disabled] { color: var(--c-text-placeholder); cursor: not-allowed; }

/* ============== 帮助中心（help）============== */
.help-faq { margin-top: 16px; border: 1px solid var(--c-border); border-radius: var(--r-lg); padding: 16px 20px; }
.help-faq-title { font-size: 14px; font-weight: 600; color: var(--c-text); margin-bottom: 12px; }
.help-q { padding: 10px 0; border-bottom: 1px dashed var(--c-border-light); }
.help-q:last-child { border-bottom: none; }
.help-q-title { font-size: 13px; color: var(--c-text); margin-bottom: 4px; }
.help-q-body { font-size: 12px; color: var(--c-text-secondary); line-height: 20px; }

/* ============== 设置页（常用/个性/签约/子账号/企业设置）============== */
.set-page { display: grid; grid-template-columns: 300px 1fr; gap: 0; padding: 8px 0 0 48px; }
.set-menu { padding-top: 6px; }
.set-menu-item { display: block; padding: 9px 0; font-size: 13px; color: var(--c-text-regular); }
.set-menu-item:hover { color: var(--c-primary); }
.set-menu-item.active { color: var(--c-text); font-weight: 600; }
.set-content { min-width: 0; }
.set-card-head {
  display: flex; align-items: center; justify-content: space-between;
  background: #f2f3f5; border-radius: 2px;
  padding: 0 16px; height: 56px; margin-bottom: 10px;
}
.set-card-title { font-size: 15px; font-weight: 500; color: var(--c-text); }
.set-card-btn { height: 32px; padding: 0 16px; background: var(--c-primary); color: #fff; border-radius: var(--r-sm); font-size: 13px; }
.set-card-btn:hover { background: var(--c-primary-hover); }
.set-tbl { background: #fff; }
.set-tbl th { height: 46px; font-size: 13px; font-weight: 700; background: #fff; border-bottom: 1px solid var(--c-border); }
.set-tbl td { height: 46px; font-size: 13px; }
.set-status-off { display: inline-block; background: var(--c-bg); color: var(--c-text-regular); padding: 2px 8px; border-radius: 2px; font-size: 12px; }
.set-ops a { margin-right: 12px; font-size: 13px; }
.set-form { padding: 6px 0; }
.set-row { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; font-size: 13px; color: var(--c-text-regular); }
.set-row > label:first-child { width: 140px; text-align: right; }
.set-row input[type=text] {
  height: 32px; width: 220px; padding: 0 10px;
  border: 1px solid var(--c-input-border); border-radius: var(--r-sm); font-size: 13px;
}
.set-tip { font-size: 12px; color: var(--c-text-secondary); }

/* ============== 数据大屏（深色全屏）============== */
.bigscreen {
  position: fixed; inset: 0; z-index: 2000;
  background: #0b1021; color: #e6f1ff;
  padding: 24px 32px; overflow: auto; display: none;
}
.bigscreen.open { display: block; }
.bs-head { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.bs-title {
  font-size: 20px; font-weight: 600; letter-spacing: 1px;
  background: linear-gradient(90deg,#4facfe,#00f2fe);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.bs-clock { font-size: 13px; color: #7f96c0; }
.bs-close {
  margin-left: auto; height: 30px; padding: 0 16px;
  border: 1px solid #2b3a5c; border-radius: var(--r-sm);
  background: transparent; color: #cfe1ff; font-size: 13px;
}
.bs-close:hover { border-color: #4facfe; color: #4facfe; }
.bs-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.bs-card { background: rgba(20,32,60,.85); border: 1px solid #1e2d4d; border-radius: 8px; padding: 18px 20px; }
.bs-card-title { font-size: 14px; color: #8fb3ff; margin-bottom: 16px; }
.bs-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.bs-kpis div { text-align: center; }
.bs-kpis b { display: block; font-size: 22px; color: #4facfe; }
.bs-kpis span { font-size: 12px; color: #7f96c0; }
.bs-bar { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; font-size: 12px; color: #a8c0e8; }
.bs-bar-label { width: 72px; }
.bs-bar-track { flex: 1; height: 8px; background: #16233d; border-radius: 4px; overflow: hidden; }
.bs-bar-track i { display: block; height: 100%; }
.bs-feed li { font-size: 13px; color: #a8c0e8; padding: 8px 0; border-bottom: 1px dashed #1e2d4d; }
.bs-feed li:last-child { border-bottom: none; }
.bs-feed b { color: #4facfe; margin-right: 8px; }

/* ==================================================================
 * 居小易 · 后台管理端 设计升级层 v2（2026-09-28）
 * ------------------------------------------------------------------
 * 说明：这一层只做「视觉重绘」，不改任何结构与业务逻辑。
 *      放在 style.css 末尾，用同名 token 覆盖旧值 + 组件级细化，
 *      所以 44 个页面一次性换脸；如需回滚，删掉这一段即可。
 * ================================================================== */
:root{
  --c-primary:#2F6BFF;
  --c-primary-hover:#1E57E8;
  --c-primary-light:#EEF3FF;
  --c-primary-soft:#F5F8FF;
  --c-danger:#EF4444;
  --c-danger-light:#FEF2F2;
  --c-warning:#F59E0B;
  --c-warning-light:#FFFBEB;
  --c-success:#12B886;
  --c-success-light:#ECFDF5;

  --c-text:#0F172A;
  --c-text-regular:#475467;
  --c-text-secondary:#8B95A7;
  --c-text-placeholder:#AEB6C4;

  --c-bg:#F4F6FB;
  --c-bg-card:#FFFFFF;
  --c-border:#E9EDF5;
  --c-border-light:#F1F4F9;
  --c-input-border:#DFE5EF;
  --c-header-border:#E9EDF5;

  --c-sidebar:#FFFFFF;
  --c-sidebar-hover:#F5F8FF;
  --c-sidebar-active-bg:#EEF3FF;
  --c-sidebar-text:#475467;
  --c-sidebar-text-active:#2F6BFF;

  --r-sm:6px;
  --r-md:8px;
  --r-lg:12px;
  --r-xl:16px;

  --shadow-sm:0 1px 2px rgba(16,24,40,.05), 0 1px 3px rgba(16,24,40,.06);
  --shadow-md:0 4px 12px rgba(16,24,40,.08), 0 2px 4px rgba(16,24,40,.04);
  --shadow-lg:0 12px 32px rgba(16,24,40,.12), 0 4px 10px rgba(16,24,40,.05);
  --shadow-focus:0 0 0 4px rgba(47,107,255,.12);
}
body{
  font-size:13.5px; line-height:21px; color:var(--c-text-regular);
  background:
    radial-gradient(1200px 600px at 100% -10%, #EEF3FF 0%, rgba(238,243,255,0) 60%),
    var(--c-bg);
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-weight:600;color:var(--c-text);letter-spacing:-.1px}

/* ---------- 顶部栏 ---------- */
.host-header,.topbar{
  background:rgba(255,255,255,.86); backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--c-border);
}
.host-header{box-shadow:0 1px 0 rgba(16,24,40,.02)}

/* ---------- 侧边栏 ---------- */
.sidebar{
  background:var(--c-sidebar); border-right:1px solid var(--c-border);
  padding-top:6px;
}
.sidebar .nav-group,.sidebar .group-title{
  font-size:11px; font-weight:600; letter-spacing:.6px; text-transform:uppercase;
  color:var(--c-text-secondary); padding:14px 16px 6px;
}
.sidebar a,.sidebar .nav-item,.sidebar li>a{
  border-radius:10px; margin:2px 10px; padding:9px 12px;
  color:var(--c-sidebar-text); transition:background .16s,color .16s,transform .16s;
}
.sidebar a:hover,.sidebar .nav-item:hover{background:var(--c-sidebar-hover); color:var(--c-primary)}
.sidebar a.active,.sidebar .nav-item.active,.sidebar li>a.active{
  background:var(--c-sidebar-active-bg); color:var(--c-sidebar-text-active); font-weight:600;
  box-shadow:inset 3px 0 0 var(--c-primary);
}
.sidebar .ico,.sidebar i{opacity:.9}

/* ---------- 页面容器 / 标题 ---------- */
.page-view{padding:22px 24px 32px}
.h-page{background:transparent}
.h-title,.page-title{font-size:19px; font-weight:700; color:var(--c-text)}
.h-sub,.page-sub{color:var(--c-text-secondary); font-size:12.5px}
.h-toolbar{background:#fff; border:1px solid var(--c-border); border-radius:var(--r-lg);
  padding:12px 14px; box-shadow:var(--shadow-sm); margin-bottom:14px}
.h-tools{gap:8px}

/* ---------- 按钮 ---------- */
button,.btn,.h-tool,.h-btn{
  transition:background .16s,border-color .16s,box-shadow .16s,transform .16s,color .16s;
}
.h-tool,.h-btn,.btn-mini,.ap-detail,.ap-pass,.pd-act-btn,.st-form-save,.bi-issue,.bi-detail,.bi-download{
  border-radius:8px !important;
}
.h-tool{
  background:#fff; border:1px solid var(--c-input-border); padding:7px 13px; font-weight:500;
}
.h-tool:hover{border-color:var(--c-primary); color:var(--c-primary); background:var(--c-primary-soft)}
.btn-primary,.st-form-save,.bi-issue{
  background:linear-gradient(135deg,var(--c-primary),#5B8CFF) !important; color:#fff !important;
  border:none !important; box-shadow:0 6px 16px rgba(47,107,255,.26);
}
.btn-primary:hover,.st-form-save:hover,.bi-issue:hover{transform:translateY(-1px); box-shadow:0 10px 22px rgba(47,107,255,.32)}
.ap-detail,.btn-mini,.ap-pass{
  background:transparent; color:var(--c-primary); border:none; padding:4px 8px; font-weight:500;
}
.ap-detail:hover,.btn-mini:hover{background:var(--c-primary-light); border-radius:8px}
.pg-num,.pg-prev,.pg-next{border-radius:8px !important; border:1px solid var(--c-border) !important; background:#fff}
.pg-num.active{background:var(--c-primary) !important; color:#fff !important; border-color:var(--c-primary) !important}

/* ---------- 表格 ---------- */
.dyn-table,table.dyn-table,.table-wrap table{
  border-collapse:separate; border-spacing:0; width:100%;
  background:#fff; border:1px solid var(--c-border); border-radius:var(--r-lg); overflow:hidden;
}
.dyn-table thead th{
  background:#F8FAFD; color:var(--c-text-secondary); font-weight:600; font-size:12px;
  letter-spacing:.3px; padding:11px 14px; border-bottom:1px solid var(--c-border); white-space:nowrap;
}
.dyn-table tbody td{padding:12px 14px; border-bottom:1px solid var(--c-border-light); color:var(--c-text-regular)}
.dyn-table tbody tr:last-child td{border-bottom:none}
.dyn-table tbody tr:hover td{background:#FAFCFF}
.cell-sub{color:var(--c-text-secondary); font-size:11.5px}
.empty,.no-data{padding:44px 16px; text-align:center; color:var(--c-text-secondary); font-size:13px}

/* ---------- 卡片 / KPI ---------- */
.card,.panel,.kpi-card,.st-card{
  background:var(--c-bg-card); border:1px solid var(--c-border); border-radius:var(--r-lg);
  box-shadow:var(--shadow-sm); transition:box-shadow .2s,transform .2s
}
.card:hover,.kpi-card:hover{box-shadow:var(--shadow-md); transform:translateY(-2px)}
.kpi-card{border-radius:var(--r-xl); padding:18px 20px}
.kpi-label{color:var(--c-text-secondary); font-size:12.5px}
.kpi-num{font-size:24px; font-weight:700; color:var(--c-text); letter-spacing:-.4px}
.kpi-extra{color:var(--c-text-secondary); font-size:12px}
.kpi-red{border-left:3px solid var(--c-danger)}
.kpi-green{border-left:3px solid var(--c-success)}
.kpi-blue{border-left:3px solid var(--c-primary)}

/* ---------- 标签 / 状态 ---------- */
.badge,.tag,.pill,.st-badge{
  display:inline-flex; align-items:center; gap:4px; border-radius:999px;
  padding:2px 9px; font-size:11.5px; font-weight:600; line-height:18px
}
.badge.ok,.tag.ok{background:var(--c-success-light); color:var(--c-success)}
.badge.warn,.tag.warn{background:var(--c-warning-light); color:#B45309}
.badge.info,.tag.info{background:var(--c-primary-light); color:var(--c-primary)}
.badge.danger,.tag.danger{background:var(--c-danger-light); color:var(--c-danger)}

/* ---------- 表单 ---------- */
input[type=text],input[type=number],input[type=password],input[type=tel],select,textarea{
  border:1px solid var(--c-input-border); border-radius:9px; padding:8px 11px; font-size:13px;
  color:var(--c-text); background:#fff; outline:none; transition:border-color .16s,box-shadow .16s;
  font-family:inherit;
}
input:focus,select:focus,textarea:focus{border-color:var(--c-primary); box-shadow:var(--shadow-focus)}
.h-search input,.h-search .inp{border-radius:9px}
.st-form-row label{color:var(--c-text-regular); font-weight:500; font-size:12.5px}
.st-tip{color:var(--c-text-secondary); font-size:12px}
.st-card{border-radius:var(--r-lg); padding:16px 18px; margin-bottom:14px}

/* ---------- 选项卡 ---------- */
.h-tab{border-radius:999px !important; padding:7px 15px !important; border:1px solid transparent !important;
  color:var(--c-text-regular); background:transparent; font-weight:500}
.h-tab:hover{background:#F1F4F9}
.h-tab.active{background:var(--c-primary-light) !important; color:var(--c-primary) !important; font-weight:600; border-color:transparent !important}
.h-tabs{gap:6px; flex-wrap:wrap}
/* ---------- 弹窗 ---------- */
.modal-mask{background:rgba(15,23,42,.42); backdrop-filter:blur(3px)}
.modal{border-radius:var(--r-xl); box-shadow:var(--shadow-lg); border:1px solid rgba(255,255,255,.6); overflow:hidden}
.modal-head{padding:16px 20px; border-bottom:1px solid var(--c-border); background:#fff}
.modal-title{font-size:15.5px; font-weight:700; color:var(--c-text)}
.modal-close{width:30px; height:30px; border-radius:8px; display:flex; align-items:center; justify-content:center;
  color:var(--c-text-secondary); font-size:18px; transition:.16s}
.modal-close:hover{background:#F1F4F9; color:var(--c-text)}
.modal-body{padding:18px 20px; background:#fff}
.st-form-actions{border-top:1px solid var(--c-border); padding-top:14px; margin-top:12px}
.st-form-save{border-radius:9px !important; padding:9px 18px !important; font-weight:600 !important}

/* ---------- 提示条 / 消息 ---------- */
.toast{border-radius:12px; box-shadow:var(--shadow-lg); font-size:13px; padding:11px 16px; border:none}
.msg-row{border-radius:12px; border:1px solid var(--c-border); background:#fff; margin-bottom:8px; padding:12px 14px; transition:.16s}
.msg-row:hover{border-color:#D5E0FB; box-shadow:var(--shadow-sm)}
.msg-row.unread{background:linear-gradient(90deg,#F7FAFF,#FFFFFF); border-color:#D9E5FF}
.msg-title{font-weight:600; color:var(--c-text)}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar{width:10px; height:10px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#D7DEEA; border-radius:99px; border:2px solid transparent; background-clip:padding-box}
::-webkit-scrollbar-thumb:hover{background:#C3CCDC; background-clip:padding-box}

/* ---------- 细节修饰 ---------- */
.h-quick-table,.dv-table,.bill-manage-table{border-radius:var(--r-lg); overflow:hidden}
.h-select{border-radius:9px !important}
.breadcrumb,.crumb{color:var(--c-text-secondary); font-size:12.5px}
.divider,.h-line{background:var(--c-border)}
[data-role="table-action"] button{font-weight:500}
.sidebar::-webkit-scrollbar{width:8px}

/* ============== 数据体检（设置 / 数据体检） ============== */
.dh-wrap { padding: 4px 2px 24px; }
.dh-loading { padding: 60px 0; text-align: center; color: var(--c-text-secondary); font-size: 13px; }
.dh-head {
  display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
  background: var(--c-bg-card); border: 1px solid var(--c-border);
  border-radius: 12px; padding: 18px 22px; margin-bottom: 16px;
}
.dh-score {
  width: 92px; height: 92px; border: 3px solid var(--c-border); border-radius: 50%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 0 0 auto;
}
.dh-score b { font-size: 30px; line-height: 1; font-weight: 700; }
.dh-score span { font-size: 12px; color: var(--c-text-secondary); margin-top: 4px; }
.dh-kpis { display: flex; gap: 28px; flex: 1 1 auto; flex-wrap: wrap; }
.dh-kpi { display: flex; flex-direction: column; align-items: center; min-width: 56px; }
.dh-kpi b { font-size: 22px; line-height: 1.1; font-weight: 700; color: var(--c-text); }
.dh-kpi span { font-size: 12px; color: var(--c-text-secondary); margin-top: 4px; }
.dh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.dh-card {
  background: var(--c-bg-card); border: 1px solid var(--c-border); border-left: 3px solid var(--c-border);
  border-radius: 10px; padding: 14px 16px; display: flex; flex-direction: column;
}
.dh-c-err { border-left-color: var(--c-danger); }
.dh-c-warn { border-left-color: var(--c-warning); }
.dh-c-info { border-left-color: var(--c-primary); }
.dh-c-ok { border-left-color: var(--c-success); }
.dh-c-unknown { border-left-color: var(--c-text-placeholder); }
.dh-card-head { display: flex; align-items: center; gap: 8px; }
.dh-badge { font-size: 11px; line-height: 18px; padding: 0 7px; border-radius: 4px; flex: 0 0 auto; }
.dh-b-err { background: var(--c-danger-light); color: var(--c-danger); }
.dh-b-warn { background: #fff7e8; color: var(--c-warning); }
.dh-b-info { background: var(--c-primary-light); color: var(--c-primary); }
.dh-b-ok { background: #e8ffea; color: var(--c-success); }
.dh-b-unknown { background: var(--c-border-light); color: var(--c-text-secondary); }
.dh-card-title { font-size: 14px; font-weight: 600; color: var(--c-text); flex: 1 1 auto; }
.dh-count { font-size: 18px; font-weight: 700; color: var(--c-text); }
.dh-desc { font-size: 12.5px; color: var(--c-text-secondary); line-height: 20px; margin-top: 8px; }
.dh-samples { list-style: none; margin: 10px 0 0; padding: 0; }
.dh-samples li {
  display: flex; justify-content: space-between; gap: 10px; padding: 5px 0;
  border-top: 1px dashed var(--c-border-light); font-size: 12.5px;
}
.dh-samples li b { color: var(--c-text-regular); font-weight: 500; }
.dh-samples li span { color: var(--c-text-secondary); flex: 0 0 auto; }
.dh-card-foot { margin-top: 12px; }
.dh-jump {
  border: 1px solid var(--c-primary); background: #fff; color: var(--c-primary);
  border-radius: 6px; padding: 5px 12px; font-size: 12.5px; cursor: pointer;
}
.dh-jump:hover { background: var(--c-primary-light); }
.dh-foot { margin-top: 16px; text-align: center; font-size: 12px; color: var(--c-text-placeholder); }

/* ============================================================
 * 批次14：工单中心（真实全流程）+ 催收管理
 * ============================================================ */
/* ---- 工单 ---- */
.wo-page .h-toolbar { align-items: center; }
/* ⚠ .h-tool 原本是 32×32 的图标按钮（style.css:1423），文字按钮会被挤成竖排单字。
   工单/催收页用的是带文字的工具按钮，必须放开宽度。 */
.wo-page .h-tool, .urge-page .h-tool {
  width: auto; min-width: 32px; padding: 0 12px; white-space: nowrap; font-size: 13px;
}
.wo-page .h-tools, .urge-page .h-tools { flex-shrink: 0; }
/* .h-search 默认 max-width 560px 且不换行；工单/催收的筛选条件多，必须放开并允许换行 */
.wo-page .h-search, .urge-page .h-search { max-width: none; flex: 1 1 auto; min-width: 0; flex-wrap: wrap; }
.h-tab .wo-cnt {
  font-style: normal; font-size: 11px; color: var(--c-text-secondary);
  background: var(--c-border-light); border-radius: 8px; padding: 0 6px; margin-left: 4px;
}
.h-tab.active .wo-cnt { background: var(--c-primary-light); color: var(--c-primary); }
.wo-empty { padding: 40px 0; text-align: center; color: var(--c-text-secondary); font-size: 13px; }
.wo-acts { white-space: nowrap; }
.wo-acts .ap-pass, .wo-acts .ap-detail, .wo-acts .ap-reject { margin-right: 6px; }
.wk-desc { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wo-pager { display: flex; align-items: center; gap: 8px; justify-content: flex-end; padding: 12px 4px 0; }
.wo-pager-info { font-size: 13px; color: var(--c-text-secondary); margin-right: auto; }
.wo-pager .btn-ghost { height: 30px; padding: 0 12px; }
.badge.muted { background: var(--c-border-light); color: var(--c-text-secondary); }
.wo-detail-acts .btn-primary { height: 32px; padding: 0 14px; }

/* ---- 催收 ---- */
.urge-kpis { display: grid; grid-template-columns: repeat(5, 1fr); gap: 12px; margin-bottom: 14px; }
.urge-kpi { background: var(--c-bg-card); border: 1px solid var(--c-border); border-radius: 10px; padding: 14px 16px; }
.urge-kpi-v { font-size: 22px; font-weight: 600; color: var(--c-text); line-height: 1.3; }
.urge-kpi-l { font-size: 12px; color: var(--c-text-secondary); margin-top: 4px; }
.urge-kpi.warn .urge-kpi-v { color: var(--c-danger); }
.urge-kpi.info .urge-kpi-v { color: var(--c-warning); }
.urge-rule-card { background: var(--c-bg-card); border: 1px solid var(--c-border); border-radius: 10px; padding: 14px 16px; }
.urge-rule-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.urge-rule-head h3 { margin: 0; font-size: 15px; font-weight: 600; color: var(--c-text); }
.urge-switch { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--c-text-regular); cursor: pointer; }
.urge-rule-body { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.urge-field { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--c-text-regular); }
.urge-field label { color: var(--c-text-secondary); }
.urge-field input, .urge-field select {
  height: 32px; border: 1px solid var(--c-input-border); border-radius: 6px; padding: 0 8px; font-size: 13px;
}
.urge-field input[type="number"] { width: 92px; }
.urge-rule-body .btn-primary { height: 32px; padding: 0 16px; }
.urge-rule-tip { margin-top: 10px; font-size: 12px; color: var(--c-text-secondary); line-height: 1.6; }
.urge-tbl td { font-size: 13px; }

/* ---- 批次19：催收记录子页 ---- */
.urge-view-tabs { display: flex; gap: 4px; margin-top: 14px; border-bottom: 1px solid var(--c-border); }
.urge-vtab { background: transparent; border: none; padding: 10px 4px; margin-right: 20px; font-size: 14px; color: var(--c-text-secondary); cursor: pointer; position: relative; }
.urge-vtab.active { color: var(--c-primary); font-weight: 600; }
.urge-vtab.active::after { content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--c-primary); border-radius: 2px; }
.urge-rec-sums { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; margin: 12px 0; }
.urge-rec-sum { background: var(--c-bg-card); border: 1px solid var(--c-border); border-radius: 8px; padding: 10px 12px; text-align: center; }
.urge-rec-sum b { display: block; font-size: 17px; font-weight: 600; color: var(--c-text); line-height: 1.3; }
.urge-rec-sum span { font-size: 11px; color: var(--c-text-secondary); }
.urge-rec-tbl td { font-size: 13px; }

/* ============================================================
 * 批次16：操作日志审计 + 站内消息发送/会话 + 智能设备（真实数据）
 * ============================================================ */

/* ---- 通用：口径卡（设备 / 操作日志共用） ---- */
.dv-kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 14px; }
.dv-kpi { background: var(--c-bg-card); border: 1px solid var(--c-border); border-radius: 10px; padding: 14px 16px; }
.dv-kpi-n { font-size: 22px; font-weight: 600; color: var(--c-text); line-height: 1.3; }
.dv-kpi-l { font-size: 12px; color: var(--c-text-secondary); margin-top: 4px; }

/* ---- 操作日志 ---- */
.audit-page .h-tool { width: auto; min-width: 32px; padding: 0 12px; white-space: nowrap; font-size: 13px; }
.audit-page .h-tools { flex-shrink: 0; }
.audit-page .h-search { max-width: none; flex: 1 1 auto; min-width: 0; flex-wrap: wrap; }
.audit-page .h-search .h-input[type="date"] { width: 148px; }
.audit-page .audit-toolbar { align-items: center; }
.au-tbl { width: 100%; }
.au-tbl td { font-size: 13px; vertical-align: top; }
.au-tbl .au-detail {
  max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--c-text-secondary); font-size: 12px;
}

/* ---- 智能设备 ---- */
.dv-page .h-tool { width: auto; min-width: 32px; padding: 0 12px; white-space: nowrap; font-size: 13px; }
.dv-page .h-tools { flex-shrink: 0; }
.dv-page .h-search { max-width: none; flex: 1 1 auto; min-width: 0; flex-wrap: wrap; }
.dv-tbl td { font-size: 13px; vertical-align: middle; }
.dv-ops { white-space: nowrap; }
.dv-ops .ap-detail { margin-right: 6px; }
.dv-ops .link-red { color: var(--c-danger); }

/* ---- 消息中心：租客会话 ---- */
.msg-page .h-tool { width: auto; min-width: 32px; padding: 0 12px; white-space: nowrap; font-size: 13px; }
.msg-page .h-tools { flex-shrink: 0; }
.chat-list { max-height: 52vh; overflow-y: auto; padding: 12px 4px; background: var(--c-bg-page); border-radius: 10px; }
.chat-item { display: flex; flex-direction: column; align-items: flex-start; margin-bottom: 12px; }
.chat-item.mine { align-items: flex-end; }
.chat-bubble {
  max-width: 74%; padding: 9px 12px; border-radius: 10px; font-size: 13px; line-height: 1.6;
  background: var(--c-bg-card); border: 1px solid var(--c-border); color: var(--c-text); word-break: break-word;
}
.chat-item.mine .chat-bubble { background: var(--c-primary-light); border-color: var(--c-primary-light); }
.chat-time { font-size: 11px; color: var(--c-text-secondary); margin-top: 4px; }
.chat-reply { display: flex; gap: 10px; margin-top: 12px; align-items: flex-end; }
.chat-reply textarea {
  flex: 1; min-height: 64px; border: 1px solid var(--c-input-border); border-radius: 8px;
  padding: 8px 10px; font-size: 13px; resize: vertical; font-family: inherit; outline: none;
}
.chat-reply .st-form-save { height: 40px; padding: 0 22px; }

/* ================= 批次17：账单管理（真实分页 + 计数 + 汇总 + 批量） ================= */
.bm-page .bm-cnt { font-style: normal; font-size: 12px; color: var(--c-text-secondary); margin-left: 3px; }
.bm-page .h-tab.active .bm-cnt { color: var(--c-primary); }
/* ⚠ .h-tool 是原站的 32×32 图标按钮，放文字按钮必须覆盖宽度 */
.bm-page .h-tool { width: auto; padding: 0 12px; white-space: nowrap; }
.bm-sums { display: flex; flex-wrap: wrap; gap: 10px; padding: 10px 0 12px; align-items: center; }
.bm-sum { background: #fff; border: 1px solid var(--c-border); border-radius: 10px; padding: 8px 14px; font-size: 13px; color: var(--c-text-secondary); }
.bm-sum b { margin-left: 8px; font-size: 15px; color: var(--c-text-primary); }
.bm-sum-sel { display: flex; align-items: center; border-color: var(--c-primary); }
/* 表格新增勾选列 → 所有 nth-child 同步 +1（原 2/5/6/7 现为 3/6/7/8） */
.bm-tbl .bm-ck { width: 38px; text-align: center; }
.bm-tbl th:nth-child(2), .bm-tbl td:nth-child(2) { min-width: 150px; }
.bm-tbl td:nth-child(3) { min-width: 200px; color: var(--c-text-regular); }
.bm-tbl td:nth-child(6), .bm-tbl td:nth-child(7), .bm-tbl td:nth-child(8) { font-family: 'SFMono-Regular', Consolas, monospace; font-size: 12px; }
.bm-pager { display: flex; align-items: center; justify-content: flex-end; gap: 6px; padding: 14px 0 4px; }
.bm-pg-info { margin-right: auto; font-size: 13px; color: var(--c-text-secondary); }
.bm-pager .pg-prev, .bm-pager .pg-next, .bm-pager .pg-num {
  height: 30px; min-width: 30px; padding: 0 10px; border: 1px solid var(--c-border);
  background: #fff; border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--c-text-regular);
}
.bm-pager .pg-num.active { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.bm-pager button[disabled] { opacity: .45; cursor: not-allowed; }
/* 批次17：账单管理工具栏换行（.h-search 默认 max-width:560px 且不换行，必须覆盖） */
.bm-page .h-toolbar { row-gap: 10px; }
.bm-page .h-search { flex: 1 1 620px; max-width: none; flex-wrap: wrap; }
.bm-page .h-tools { flex-shrink: 0; display: flex; align-items: center; gap: 6px; }
.bm-page .h-search .h-input[type="date"] { width: 148px; }
.bm-void { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-danger); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-danger); margin-right: 4px; }
.bm-void:hover { background: var(--c-danger); color: #fff; }

/* 批次18：收款记录 / 退款 / 流水页 */
.bm-rec { padding: 3px 10px; font-size: 12px; border: 1px solid var(--c-border); background: #fff; border-radius: 4px; cursor: pointer; color: var(--c-text-regular); margin-right: 4px; }
.bm-rec:hover { color: var(--c-primary); border-color: var(--c-primary); }
.bm-refund { padding: 3px 10px; font-size: 12px; border: 1px solid #fa8c16; background: #fff; border-radius: 4px; cursor: pointer; color: #fa8c16; margin-right: 4px; }
.bm-refund:hover { background: #fa8c16; color: #fff; }
.bl-tbl td, .bl-tbl th { white-space: nowrap; }
.bl-tbl td:nth-child(3) { white-space: normal; }
#blPager { display: flex; align-items: center; justify-content: flex-end; gap: 6px; padding: 14px 0 4px; }
#blPager .bm-pg-info { font-size: 13px; color: var(--c-text-secondary); margin-right: auto; }

/* ===== 批次21：第三方接入配置 - 支付接入向导 ===== */
.tp-guide { background: linear-gradient(135deg, #F0F6FF 0%, #F7FAFF 100%); border: 1px solid #D6E4FF; border-radius: 10px; padding: 16px 18px; margin-bottom: 6px; }
.tp-guide-head { font-size: 15px; font-weight: 600; color: #1A1A1A; margin-bottom: 10px; }
.tp-guide-status { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.tp-chip { font-size: 12px; padding: 3px 10px; border-radius: 12px; font-weight: 500; }
.tp-chip.ok { background: #E5F8F2; color: #16A37A; }
.tp-chip.off { background: #FFF1F0; color: #E5533D; }
.tp-guide-status .tp-tip { font-size: 12px; color: #8A94A6; }
.tp-steps { margin: 0; padding-left: 20px; }
.tp-steps li { font-size: 13px; line-height: 1.9; color: #334; }
.tp-steps li b { color: #1A1A1A; }
.tp-steps code { background: #EEF3FB; color: #2A5BD7; padding: 1px 6px; border-radius: 4px; font-size: 12px; font-family: SFMono-Regular, Consolas, monospace; word-break: break-all; }

/* ============================================================
 * 退租结算（批次31）
 * ============================================================ */
.ck-kpis { display: flex; gap: 12px; flex-wrap: wrap; padding: 0 0 12px; }
.ck-kpis .rp-kpi { flex: 1 1 150px; min-width: 140px; background: #fff; border: 1px solid #EDEFF3; border-radius: 8px; padding: 12px 14px; }
.ck-kpis .rp-kpi-label { font-size: 12px; color: #8A94A6; margin-bottom: 6px; }
.ck-kpis .rp-kpi-num { font-weight: 700; }
.ck-detail { font-size: 13px; }
.ck-sec { border: 1px solid #EDEFF3; border-radius: 8px; padding: 12px 14px; margin-bottom: 12px; background: #fff; }
.ck-sec-t { font-size: 14px; font-weight: 600; color: #1A1A1A; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px dashed #EDEFF3; }
.ck-kv { display: flex; justify-content: space-between; align-items: center; padding: 6px 0; font-size: 13px; color: #4E5969; }
.ck-kv b { color: #1A1A1A; font-weight: 600; }
.ck-kv.ck-total { border-top: 1px dashed #EDEFF3; margin-top: 6px; padding-top: 10px; }
.ck-sub { font-size: 12px; color: #8A94A6; margin-top: 6px; line-height: 1.7; }
.ck-warn { background: #FFF7E6; border: 1px solid #FFE0A3; color: #AD6800; border-radius: 6px; padding: 8px 10px; font-size: 12px; line-height: 1.7; margin-top: 8px; }
.ck-form { display: flex; align-items: center; gap: 10px; padding: 6px 0; }
.ck-form > label { width: 90px; flex: 0 0 90px; font-size: 13px; color: #4E5969; }
.ck-form > .h-input, .ck-form > .h-select { flex: 1 1 auto; min-width: 0; }
.cp-pager { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 10px 4px; }
.cp-pager .muted { font-size: 12px; color: #8A94A6; }
.link-red { color: #F53F3F; }
.link-red:hover { text-decoration: underline; }

/* ===== 批次32：出账中心（账期引擎） ===== */
.h-sec-title { font-size: 13px; color: var(--c-text-primary, #1f2329); }
.bl-periods { color: var(--c-primary, #3478F6); text-decoration: none; font-size: 12px; cursor: pointer; }
.bl-periods:hover { text-decoration: underline; }
#blBody .cp-table { max-height: none; }
#blBody .cp-table table { font-size: 12px; }
#blBody .empty-tip { padding: 18px 0; }
#blKpis .rp-kpi-num { white-space: nowrap; }