/* ============================================================
   巡检云 SaaS · 统一设计系统
   色系：深藏蓝（工业/运维稳重感）+ 青绿（达标）+ 琥珀（预警）+ 砖红（异常）
   所有页面共用此文件，改色只改这里
   ============================================================ */

:root{
  /* 品牌蓝 */
  --brand-900:#0A1F33;
  --brand-800:#0E2A47;
  --brand-700:#123A5E;
  --brand-600:#1D5FA8;
  --brand-500:#2A78C8;
  --brand-300:#8FBBE4;
  --brand-100:#E8F1FA;
  --brand-50:#F5F9FD;

  /* 语义色 */
  --ok:#0E8F6F;      --ok-bg:#E3F5EF;
  --warn:#B0730F;    --warn-bg:#FCF0DC;
  --danger:#B9342A;  --danger-bg:#FBEAE8;
  --info:#1D5FA8;    --info-bg:#E8F1FA;

  /* 中性 */
  --ink:#1B2431;
  --ink-2:#515C6B;
  --ink-3:#8792A2;
  --ink-4:#AEB7C4;
  --line:#E4E8EE;
  --line-2:#EEF1F5;
  --bg:#F4F6F9;
  --card:#FFFFFF;

  /* 圆角 */
  --r-xs:6px; --r-sm:8px; --r:10px; --r-lg:14px; --r-xl:20px;

  /* 阴影 */
  --sh-1:0 1px 2px rgba(16,32,56,.05);
  --sh-2:0 1px 2px rgba(16,32,56,.04),0 8px 24px rgba(16,32,56,.06);
  --sh-3:0 18px 48px rgba(9,25,45,.16);
  --sh-brand:0 6px 18px rgba(29,95,168,.28);

  /* 布局 */
  --sidebar-w:216px;
  --topbar-h:58px;
}

*{margin:0;padding:0;box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",system-ui,sans-serif;
  font-size:14px;
  line-height:1.55;
  color:var(--ink);
  background:var(--bg);
  -webkit-font-smoothing:antialiased;
}

/* 页面基底：极淡渐变 + 光斑，避免大面积死白 */
body.app-bg{
  background:
    radial-gradient(900px 420px at 12% -8%, #E9F1FB 0%, rgba(233,241,251,0) 62%),
    radial-gradient(760px 380px at 96% 4%, #EAF6F2 0%, rgba(234,246,242,0) 58%),
    linear-gradient(180deg,#F7F9FC 0%, var(--bg) 46%, #F2F4F8 100%);
  background-attachment:fixed;
}

/* 数字统一等宽，表格不抖动 */
.kpi .n, td, .num, .stat-v{font-variant-numeric:tabular-nums}

h1,h2,h3,h4{font-weight:600;line-height:1.35}
a{color:var(--brand-600)}

/* ---------------- 按钮 ---------------- */
button,.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  padding:7px 14px;min-height:34px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  background:#fff;
  color:var(--ink-2);
  font-size:13px;font-weight:500;font-family:inherit;
  cursor:pointer;
  transition:background .16s,border-color .16s,color .16s,box-shadow .16s,transform .08s;
  white-space:nowrap;
}
button:hover,.btn:hover{border-color:#C9D2DE;color:var(--ink);background:#FBFCFE;box-shadow:var(--sh-1)}
button:active,.btn:active{transform:translateY(1px)}
button:focus-visible,.btn:focus-visible{outline:2px solid var(--brand-300);outline-offset:1px}

button.primary,.btn-primary{
  background:linear-gradient(180deg,var(--brand-500) 0%,var(--brand-600) 100%);
  border-color:var(--brand-600);color:#fff;box-shadow:var(--sh-brand);
}
button.primary:hover,.btn-primary:hover{
  background:linear-gradient(180deg,#3184D8 0%,#1A569B 100%);
  border-color:#1A569B;color:#fff;
}
button.danger,.btn-danger{background:#fff;border-color:#E9C3BE;color:var(--danger)}
button.danger:hover,.btn-danger:hover{background:var(--danger-bg);border-color:#DFA79F;color:var(--danger)}
button.ghost,.btn-ghost{background:transparent;border-color:transparent;color:var(--ink-2)}
button.ghost:hover{background:rgba(28,36,48,.05);border-color:transparent;box-shadow:none}
button.sm,.btn-sm{padding:4px 10px;min-height:27px;font-size:12px;border-radius:var(--r-xs)}
button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none}

/* ---------------- 表单 ---------------- */
input,select,textarea{
  padding:8px 11px;
  border:1px solid var(--line);
  border-radius:var(--r-sm);
  font-size:13px;
  font-family:inherit;
  color:var(--ink);
  background:#fff;
  transition:border-color .16s,box-shadow .16s;
  max-width:100%;
}
input::placeholder,textarea::placeholder{color:var(--ink-4)}
input:hover,select:hover,textarea:hover{border-color:#C9D2DE}
input:focus,select:focus,textarea:focus{
  outline:none;border-color:var(--brand-500);
  box-shadow:0 0 0 3px rgba(42,120,200,.14);
}
select{appearance:none;padding-right:28px;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238792A2' stroke-width='2.4' stroke-linecap='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat;background-position:right 9px center;
}
input[type=checkbox],input[type=radio]{width:15px;height:15px;accent-color:var(--brand-600);cursor:pointer;vertical-align:-2px}
input[type=date]{font-variant-numeric:tabular-nums}
textarea{width:100%;min-height:110px;font-size:12.5px;line-height:1.7;resize:vertical}

label{font-size:12.5px;color:var(--ink-2)}
.err{color:var(--danger);font-size:12.5px;min-height:17px;margin:2px 0 8px}

/* ---------------- 卡片 ---------------- */
.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:16px 18px;
  box-shadow:var(--sh-1);
  margin-bottom:14px;
  overflow-x:auto;              /* 表格列多时横向滚动，不撑破页面 */
}
.card>h3,.card-h{
  font-size:13.5px;font-weight:600;color:var(--ink);
  margin-bottom:12px;display:flex;align-items:center;gap:7px;
}
.card>h3::before,.card-h::before{
  content:"";width:3px;height:13px;border-radius:2px;
  background:linear-gradient(180deg,var(--brand-500),var(--brand-700));
}
.card.pad0{padding:0;overflow:hidden}
.card.bad{border-color:#EFC9C4;background:var(--danger-bg);color:var(--danger)}

/* ---------------- KPI ---------------- */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(178px,1fr));gap:12px;margin-bottom:14px}
.kpis.k8{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi{
  position:relative;overflow:hidden;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:15px 17px 14px;
  box-shadow:var(--sh-1);
  transition:box-shadow .18s,transform .18s,border-color .18s;
}
.kpi:hover{box-shadow:var(--sh-2);transform:translateY(-1px);border-color:#D6DEE9}
.kpi::before{
  content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;
  background:linear-gradient(180deg,var(--brand-500),var(--brand-700));
}
.kpi::after{
  content:"";position:absolute;right:-34px;top:-40px;width:104px;height:104px;border-radius:50%;
  border:15px solid rgba(42,120,200,.055);
  pointer-events:none;
}
.kpi .n{font-size:27px;font-weight:600;color:var(--brand-700);letter-spacing:-.3px;line-height:1.2}
.kpi .n.red{color:var(--danger)}
.kpi .n.green{color:var(--ok)}
.kpi .n .muted{font-size:14px;font-weight:400;color:var(--ink-3)}
.kpi .l{color:var(--ink-3);font-size:12px;margin-top:5px;line-height:1.4}
.kpi.red::before{background:linear-gradient(180deg,#DA6A5E,var(--danger))}
.kpi.green::before{background:linear-gradient(180deg,#3FBFA0,var(--ok))}
.kpi.amber::before{background:linear-gradient(180deg,#E7A63F,var(--warn))}

/* ---------------- 工具栏 ---------------- */
.toolbar{
  display:flex;gap:8px;flex-wrap:wrap;align-items:center;
  margin-bottom:14px;padding:10px 12px;
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-1);
}
.toolbar>span.mini{margin-left:auto}

/* ---------------- 表格 ---------------- */
.table-wrap{overflow:auto;border-radius:var(--r-lg)}
table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;font-size:13px}
thead th{
  position:sticky;top:0;z-index:2;
  background:#F7F9FC;color:#647085;
  font-size:12px;font-weight:600;letter-spacing:.2px;
  padding:10px 12px;text-align:left;white-space:nowrap;
  border-bottom:1px solid var(--line);
}
tbody td{
  padding:10px 12px;text-align:left;
  border-bottom:1px solid var(--line-2);
  color:var(--ink-2);vertical-align:middle;
  white-space:nowrap;
}
tbody td.wrap{white-space:normal;min-width:160px}
tbody td:first-child{color:var(--ink);font-weight:500}
tbody tr{transition:background .13s}
tbody tr:hover{background:var(--brand-50)}
tbody tr:last-child td{border-bottom:none}
table .mini{font-weight:400}
td.actions{white-space:nowrap}

/* ---------------- 标签 ---------------- */
.tag{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 9px;border-radius:20px;
  font-size:11.5px;font-weight:500;line-height:1.7;white-space:nowrap;
  background:#F1F3F7;color:var(--ink-2);
}
.tag::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.75}
.tag.plain::before{display:none}
.tag.ok,.tag.green{background:var(--ok-bg);color:var(--ok)}
.tag.bad,.tag.red{background:var(--danger-bg);color:var(--danger)}
.tag.wait,.tag.amber{background:var(--warn-bg);color:var(--warn)}
.tag.info,.tag.blue{background:var(--info-bg);color:var(--info)}
.tag.gray{background:#F1F3F7;color:var(--ink-3)}

/* ---------------- 文本 ---------------- */
.muted{color:var(--ink-3)}
.mini{font-size:12px;color:var(--ink-3);font-weight:400;line-height:1.5}
.strong{font-weight:600;color:var(--ink)}
a.link{color:var(--brand-600);text-decoration:none;cursor:pointer;margin-right:10px;font-weight:500;font-size:12.5px}
a.link:hover{color:var(--brand-500);text-decoration:underline}
a.link.danger{color:var(--danger)}
a.link.mute{color:var(--ink-3)}
.ellip{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------------- 模态 ---------------- */
.modal-mask{
  position:fixed;inset:0;z-index:99;
  background:rgba(8,22,40,.46);
  backdrop-filter:blur(4px) saturate(120%);
  display:none;align-items:flex-start;justify-content:center;
  padding:52px 16px 30px;overflow:auto;
  animation:fadeIn .18s ease;
}
.modal{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border-radius:16px;
  width:100%;max-width:660px;
  max-height:calc(100vh - 88px);
  box-shadow:0 30px 74px -14px rgba(8,25,48,.42),0 0 0 1px rgba(9,30,60,.05);
  overflow:hidden;
  animation:popIn .24s cubic-bezier(.2,.9,.28,1.02);
}
/* 顶部品牌渐变条 */
.modal::before{
  content:"";position:absolute;inset:0 0 auto 0;height:3px;z-index:2;
  background:linear-gradient(90deg,#123A5E 0%,#1D5FA8 26%,#2A78C8 56%,#17A98A 100%);
}
/* 头部 */
.modal-hd{
  display:flex;align-items:center;gap:12px;
  padding:17px 20px 15px;
  background:linear-gradient(180deg,#F6FAFE 0%,#FFFFFF 92%);
  border-bottom:1px solid var(--line-2);
}
.mh-ic{
  width:35px;height:35px;flex:none;border-radius:11px;display:grid;place-items:center;
  background:linear-gradient(150deg,#E9F2FB,#D6E7F8);
  border:1px solid #D3E3F4;color:var(--brand-600);
}
.mh-ic svg{width:17px;height:17px}
.mh-tx{flex:1;min-width:0}
.mh-tx h3,.mh-tx .mh-t{
  font-size:15px;font-weight:600;color:var(--ink);letter-spacing:.2px;
  margin:0;padding:0;border:0;line-height:1.35;
}
.mh-tx p{font-size:11.5px;color:var(--ink-3);margin-top:3px;line-height:1.5}
.mh-close{
  width:30px;height:30px;min-height:0;padding:0;flex:none;
  border:1px solid transparent;border-radius:9px;
  background:transparent;color:var(--ink-3);
  font-size:15px;line-height:1;
}
.mh-close:hover{background:#EAF0F7;border-color:#DCE5EE;color:var(--ink);box-shadow:none}

/* 内容区 */
.modal-bd{
  flex:1;min-height:0;overflow-y:auto;
  padding:17px 20px 15px;
  background:linear-gradient(180deg,#FFFFFF 0%,#FCFDFF 100%);
}
.modal-bd::-webkit-scrollbar{width:8px}
.modal-bd::-webkit-scrollbar-thumb{background:#D8DFE8;border-radius:4px}
.modal-bd::-webkit-scrollbar-thumb:hover{background:#C4CDDA}

/* 底部操作区 */
.modal-ft{
  display:flex;justify-content:flex-end;align-items:center;gap:9px;
  padding:12px 20px;
  background:#F7FAFD;border-top:1px solid var(--line-2);
}
.modal-ft .err{flex:1;margin:0;text-align:left}
.modal-ft .err:empty{min-height:0}
.modal-ft button{min-width:78px}

/* ---- 表单栅格 ---- */
.mf-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:13px 14px}
.fg{min-width:0}
.fg.wide{grid-column:1/-1}
.fg>label{
  display:flex;align-items:center;gap:4px;
  font-size:12.5px;font-weight:500;color:var(--ink-2);margin-bottom:6px;
}
.fg>label .req{color:#C0473B;font-weight:700;font-size:12px;line-height:1}
.fg input,.fg select,.fg textarea{
  width:100%;background-color:#F6F9FD;border-color:#DFE7F1;
}
.fg input::placeholder,.fg textarea::placeholder{color:#B6BFCC}
.fg input:hover,.fg select:hover,.fg textarea:hover{background-color:#fff;border-color:#CBD6E3}
.fg input:focus,.fg select:focus,.fg textarea:focus{
  background-color:#fff;border-color:var(--brand-500);
  box-shadow:0 0 0 3px rgba(42,120,200,.13),0 1px 2px rgba(16,32,56,.05);
}
.fg textarea{min-height:96px;resize:vertical}
.fg .hint{font-size:11.5px;color:#97A2B2;margin-top:5px;line-height:1.5}

/* 分区标题 */
.mf-sec{
  grid-column:1/-1;display:flex;align-items:center;gap:8px;
  font-size:11.5px;font-weight:600;color:var(--brand-700);letter-spacing:.7px;
  margin:4px 0 -2px;
}
.mf-sec::before{
  content:"";width:3px;height:11px;border-radius:2px;flex:none;
  background:linear-gradient(180deg,var(--brand-500),#17A98A);
}
.mf-sec::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)}

/* 多选胶囊 */
.chk-wrap{
  display:flex;flex-wrap:wrap;gap:7px;
  border:1px solid #DFE7F1;background:#F6F9FD;border-radius:10px;
  padding:9px;max-height:158px;overflow:auto;
}
.chk{
  display:inline-flex;align-items:center;gap:5px;
  font-size:12px;color:var(--ink-2);cursor:pointer;
  padding:4px 9px;border-radius:8px;
  border:1px solid #E6EBF2;background:#fff;
  transition:background .14s,border-color .14s,color .14s;
}
.chk:hover{border-color:#C7D8EA;background:#FCFEFF}
.chk input{width:13px;height:13px;margin:0;accent-color:var(--brand-600);vertical-align:0}
.chk.on{background:#E9F2FB;border-color:#B9D4EE;color:#155A9C;font-weight:500}
.chk.on input{accent-color:var(--brand-600)}

/* 单选卡片（指定管理员等） */
.pick{
  display:flex;gap:9px;align-items:center;cursor:pointer;
  padding:9px 11px;border:1px solid var(--line);border-radius:9px;margin-bottom:7px;
  background:#fff;transition:background .14s,border-color .14s,box-shadow .14s;
}
.pick:hover{border-color:#C7D8EA;background:#FBFDFF}
.pick input{width:15px;height:15px;flex:none;accent-color:var(--brand-600)}
.pick:has(input:checked),.pick.on{background:#EFF6FD;border-color:#A8CBEA;box-shadow:0 0 0 2px rgba(42,120,200,.09)}
.pick .pk-t{font-size:12.5px;color:var(--ink);font-weight:500}
.pick .pk-s{font-size:11.5px;color:var(--ink-3);margin-left:2px}

/* 兼容旧的行布局（弹窗内详情展示） */
.modal .row{display:flex;gap:12px;margin-bottom:12px;flex-wrap:wrap}
.modal .row>*{flex:1;min-width:150px}
.modal .row label{display:block;font-size:12px;color:var(--ink-3);margin-bottom:5px}
.modal .actions{display:flex;justify-content:flex-end;gap:8px}
.modal textarea{min-height:110px}

/* 说明条 */
.imp-tip{
  font-size:12px;line-height:1.8;color:var(--ink-2);
  background:linear-gradient(135deg,#F6FAFE,#F1F7FD);
  border:1px solid #DDEAF7;border-left:3px solid var(--brand-500);
  border-radius:9px;padding:10px 13px;margin-bottom:14px;
}
.imp-tip b{color:var(--brand-700);font-weight:600}
.imp-tip code{
  background:#fff;border:1px solid #DCE7F3;border-radius:4px;
  padding:0 4px;font-size:11.5px;color:#1D5FA8;font-family:Consolas,Menlo,monospace;
}

/* 检查项编辑行 */
.item-list{display:flex;flex-direction:column;gap:8px}
.item-row{
  display:grid;grid-template-columns:22px minmax(0,1.05fr) minmax(0,1.45fr) auto 28px;
  gap:8px;align-items:center;
  background:#F5F9FE;border:1px solid #DDE7F2;border-radius:9px;padding:7px 9px;
  transition:background .14s,border-color .14s,box-shadow .14s;
}
.item-row:focus-within{background:#fff;border-color:#B9D4EE;box-shadow:0 0 0 3px rgba(42,120,200,.09)}
.item-row .idx{font-size:11.5px;color:var(--ink-4);text-align:center;font-variant-numeric:tabular-nums}
.item-row input[type=text],.item-row input:not([type]){background-color:#fff;min-width:0;padding:6px 9px;font-size:12.5px}
.item-row .chk{padding:2px 7px;font-size:11.5px;gap:4px}
.ico-del{
  width:26px;height:26px;min-height:0;padding:0;border-radius:7px;
  color:var(--ink-3);background:transparent;border-color:transparent;font-size:12px;
}
.ico-del:hover{background:#FBEAE8;color:var(--danger);border-color:#EFCFCA;box-shadow:none}
@media (max-width:700px){
  .item-row{
    grid-template-columns:22px minmax(0,1fr) 28px;
    grid-template-areas:"idx name del" ". std std" ". chk chk";row-gap:6px;
  }
  .item-row .idx{grid-area:idx}
  .item-row .i-name{grid-area:name}
  .item-row .i-std{grid-area:std}
  .item-row .chk{grid-area:chk;justify-self:start}
  .ico-del{grid-area:del}
}

/* 二维码卡片 */
.qr-flex{display:grid;grid-template-columns:1fr 1fr;gap:13px;text-align:center}
.qr-col{
  border:1px solid #E0EAF6;border-radius:12px;padding:14px 10px 12px;
  background:linear-gradient(180deg,#FBFCFF 0%,#F4F9FE 100%);
}
.qr-col.green{border-color:#D5EBE4;background:linear-gradient(180deg,#FBFEFD 0%,#F2FAF7 100%)}
.qr-col img{border:1px solid #E6EDF5;border-radius:8px;padding:6px;background:#fff}
.qr-col .cap{display:block;font-size:12.5px;font-weight:600;color:var(--ink);margin:9px 0 3px}
.qr-col .sub{font-size:11.5px;color:var(--ink-3);margin-bottom:8px}
/* 门牌图自带背景框，弹窗里不再套第二层边框，只留投影 */
.qr-col img.qr-card-img{
  width:100%;max-width:284px;height:auto;display:block;margin:0 auto;
  padding:0;border:0;background:transparent;border-radius:14px;
  box-shadow:0 10px 24px -12px rgba(8,25,48,.45);
}
@media (max-width:520px){.qr-flex{grid-template-columns:1fr}}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes popIn{from{opacity:0;transform:translateY(10px) scale(.986)}to{opacity:1;transform:none}}
@keyframes shake{
  10%,90%{transform:translateX(-1px)}
  20%,80%{transform:translateX(2px)}
  30%,50%,70%{transform:translateX(-4px)}
  40%,60%{transform:translateX(4px)}
}

/* ---------------- 通用布局块 ---------------- */
.charts{display:grid;grid-template-columns:1.85fr 1fr;gap:14px}
.chart{height:262px;width:100%}
.split{display:grid;grid-template-columns:268px 1fr;gap:14px;align-items:stretch;
  min-height:calc(100vh - var(--topbar-h) - 58px)}
.split>.card{margin-bottom:0;display:flex;flex-direction:column;overflow:visible}
.split>.card .tree{flex:1;overflow-y:auto}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

/* 左树 + 右列表 双栏（组织架构 / 员工管理） */
.duo{display:grid;grid-template-columns:268px minmax(0,1fr);gap:14px;align-items:start}
.duo>.card{margin-bottom:0;overflow:visible}
.pane-hd{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding-bottom:9px;margin-bottom:9px;border-bottom:1px solid var(--line-2);
  font-size:12px;font-weight:600;color:var(--ink-2);letter-spacing:.4px;
}
.pane-hd .mini{font-weight:400;letter-spacing:0;display:flex;align-items:center;gap:5px}
.tree-scroll{max-height:calc(100vh - var(--topbar-h) - 200px);overflow-y:auto;padding-right:2px}
.tree li.pin{font-weight:500}
.tree li .mini{margin-left:6px;font-size:11px;color:var(--ink-4);background:#F4F6F9;border-radius:9px;padding:1px 6px}
.tree li.on .mini{background:#CFE7FA;color:#14528F}
.tree .hint{font-size:11.5px;color:var(--ink-4);padding:8px 10px 4px;line-height:1.6}

/* 首次使用引导卡 */
.guide{position:relative;overflow:hidden;border-color:#CFE4F7;
  background:linear-gradient(135deg,#F7FBFF 0%,#FFFFFF 64%)}
.guide::after{content:"";position:absolute;right:-60px;top:-70px;width:180px;height:180px;border-radius:50%;
  background:radial-gradient(circle,rgba(42,120,200,.10),transparent 68%);pointer-events:none}
.guide h3{font-size:14px;margin-bottom:5px}
.guide .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px;position:relative;z-index:1}
.guide .step{border:1px solid var(--line);background:#fff;border-radius:var(--r);padding:12px 14px;position:relative}
.guide .step b{display:block;font-size:12.5px;color:var(--ink);margin-bottom:4px;padding-right:16px}
.guide .step .mini{display:block;margin-bottom:10px;line-height:1.55}
.guide .step i{position:absolute;right:12px;top:10px;font-size:11px;font-weight:600;color:#A9CBE8;font-style:normal}
.guide .step.done{border-color:#C6EBDD;background:#F7FDFB}
.guide .step.done i{color:var(--ok)}
@media (max-width:980px){.guide .steps{grid-template-columns:1fr}}

/* 部门树 */
.tree,.tree ul{list-style:none}
.tree li{
  position:relative;padding:7px 10px 7px 24px;border-radius:var(--r-sm);
  cursor:pointer;font-size:13px;color:var(--ink-2);transition:background .13s,color .13s;
}
.tree li::before{
  content:"";position:absolute;left:10px;top:15px;
  width:5px;height:5px;border-radius:2px;background:#C3CDDA;transition:background .13s;
}
.tree li .mini{
  margin-left:6px;font-size:11px;color:var(--ink-4);
  background:#F4F6F9;border-radius:9px;padding:1px 6px;
}
.tree li:hover{background:var(--brand-50)}
.tree li:hover::before{background:var(--brand-300)}
.tree li.on{background:var(--brand-100);color:var(--brand-600);font-weight:500}
.tree li.on::before{background:var(--brand-500)}
.tree .children{margin-left:14px;border-left:1px dashed var(--line);padding-left:6px}
.tree .children li{padding-left:20px}
.tree .children li::before{left:6px}
/* 节点一行：名称省略 + 人数徽标右对齐，避免长部门名把徽标挤到下一行 */
.tree li .nd{display:flex;align-items:center;gap:6px;min-width:0}
.tree li .nm{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tree li .nd .mini{flex:0 0 auto;margin-left:0}

/* 二维码 */

/* 角色权限卡 */
.role-card{border:1px solid var(--line);border-radius:var(--r-lg);padding:16px 18px;margin-bottom:12px;background:#fff;box-shadow:var(--sh-1)}
.role-card h4{font-size:13.5px;font-weight:600;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.role-card h4 .mini{font-weight:400}
.perms{display:flex;flex-wrap:wrap;gap:8px}
.perms label{
  display:flex;align-items:center;gap:6px;
  padding:5px 11px;border:1px solid var(--line);border-radius:20px;
  font-size:12.5px;cursor:pointer;transition:all .14s;background:#fff;
  user-select:none;
}
.perms label:hover{border-color:var(--brand-300);background:var(--brand-50)}
.perms label.on{
  background:#DCEDFB;border-color:#8FBBE4;color:#14528F;font-weight:600;
}
.perms label.on:hover{background:#CFE7FA}
/* 平台管理员：权限固定，用「已授权」中性蓝，别让禁用态看起来像没勾 */
.perms label.fixed{background:#EAF1F8;border-color:#C9DCEF;color:#20527F;cursor:default;opacity:1}
.perms label.fixed:hover{background:#EAF1F8;border-color:#C9DCEF}
.perms label.fixed input{opacity:.65}
/* 权限分组 + 常用角色模板 */
.perms.grouped{display:block}
.perm-grp{margin-bottom:11px}
.perm-grp:last-child{margin-bottom:0}
.perm-grp-hd,.chk-grp-hd{
  display:flex;align-items:center;gap:8px;
  font-size:11.5px;font-weight:600;color:var(--brand-700);letter-spacing:.5px;
  margin:0 0 7px;
}
.perm-grp-hd::after,.chk-grp-hd::after{content:"";flex:1;height:1px;background:var(--line)}
.perm-grp-bd{display:flex;flex-wrap:wrap;gap:8px}
.role-cnt{margin-left:auto;font-size:11.5px;font-weight:500;color:var(--ink-3);letter-spacing:0}
.role-ft{display:flex;align-items:center;gap:8px;margin-top:13px;padding-top:11px;border-top:1px solid var(--line)}
.role-ft .mini{flex:none}
.tpl-sel{min-width:190px;max-width:290px;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:12.5px;color:var(--ink-2)}
.chk-wrap.grouped{display:block;max-height:250px}
.chk-grp{margin-bottom:9px}
.chk-grp:last-child{margin-bottom:0}
.chk-row{display:flex;flex-wrap:wrap;gap:7px}

/* 空状态 */
.empty{text-align:center;padding:44px 16px;color:var(--ink-3);font-size:13px}

/* 加载态 */
.loading{display:flex;align-items:center;gap:9px;padding:30px 18px;color:var(--ink-3);font-size:13px}
.loading::before{
  content:"";width:16px;height:16px;border-radius:50%;
  border:2px solid var(--brand-100);border-top-color:var(--brand-500);
  animation:spin .7s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg)}}

/* 滚动条 */
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:#CFD6E0;border-radius:6px;border:2px solid transparent;background-clip:content-box}
::-webkit-scrollbar-thumb:hover{background:#B4BDCB;background-clip:content-box}

/* toast */
.toast{
  position:fixed;top:20px;left:50%;transform:translateX(-50%);
  background:var(--brand-800);color:#fff;
  padding:10px 20px;border-radius:var(--r);
  font-size:13px;z-index:300;box-shadow:var(--sh-3);
  animation:toastIn .22s ease;
  max-width:min(90vw,760px);text-align:center;line-height:1.55;
}
.toast.ok{background:linear-gradient(135deg,#0E8F6F,#0B7A5E)}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,-10px)}to{opacity:1;transform:translate(-50%,0)}}

/* 窄屏弹窗 */
@media (max-width:600px){
  .modal-mask{padding:14px 10px 18px}
  .modal{max-height:calc(100vh - 32px);border-radius:14px;
    box-shadow:0 18px 44px -16px rgba(8,25,48,.34),0 0 0 1px rgba(9,30,60,.05)}
  .modal-hd{padding:14px 15px 12px;gap:10px}
  .mh-ic{width:31px;height:31px;border-radius:9px}
  .modal-bd{padding:14px 15px 12px}
  .modal-ft{padding:10px 15px;gap:10px}
  .modal-ft button{flex:1;min-width:0}
  .mf-grid{grid-template-columns:1fr;gap:12px}
  .mh-tx h3{font-size:14.5px}
}

/* ============================================================
   多项目对比（工作台 / 统计分析）
   ============================================================ */
.cmp{display:block}
.cmp-tb{margin:0}
.cmp-tb th{font-size:12px;font-weight:500;color:var(--ink-3);white-space:nowrap}
.cmp-tb td{font-size:13px;padding:9px 10px;vertical-align:middle}
.cmp-tb td:first-child{font-weight:500}
.cmp-tb .bar{width:100%;height:6px;border-radius:4px;background:var(--line-2);overflow:hidden;display:block;margin-bottom:3px}
.cmp-tb .bar i{display:block;height:100%;border-radius:4px;transition:width .4s ease}
.cmp-tb td.red{color:var(--danger);font-weight:600}
.cmp-tb a.link{text-decoration:none}
.cmp-tb a.link:hover{text-decoration:underline}
/* 进度条列自适应，避免挤压其它列 */
.cmp-tb td:nth-child(2){min-width:120px}
.cmp-tb tr:hover td{background:var(--brand-50)}

/* ============================================================
   用户管理：项目 → 部门 树状展示
   ============================================================ */
.usr-kw{
  width:280px;padding:7px 11px;font-size:13px;color:var(--ink);
  border:1px solid var(--line);border-radius:var(--r-sm);background:#fff;
  outline:none;transition:border-color .15s,box-shadow .15s;
}
.usr-kw:focus{border-color:var(--brand-300);box-shadow:0 0 0 3px var(--brand-100)}
.usr-kw::placeholder{color:var(--ink-4)}

tbody tr.uPrj>td{
  background:var(--brand-100);color:var(--brand-700);
  font-weight:600;font-size:12.5px;border-bottom:1px solid var(--line);
}
tbody tr.uPrj>td .mini{font-weight:400;color:var(--brand-600);opacity:.75;margin-left:8px}
tbody tr.uDept>td{
  background:#F7F9FC;color:var(--ink);font-weight:500;font-size:12.5px;
  border-bottom:1px solid var(--line-2);
}
tbody tr.uDept>td:first-child{padding-top:7px;padding-bottom:7px}
tbody tr.uDept>td .nm:before{content:"▸ ";color:var(--ink-4)}
tbody tr.uDept>td .mini{font-weight:400;color:var(--ink-3);margin-left:8px}
tbody tr.uPrj:hover>td,tbody tr.uDept:hover>td{background:inherit}

/* ============================================================
   人员管理：左侧项目组织架构 + 右侧原有部门分组表格
   ============================================================ */
.ppl-layout{display:grid;grid-template-columns:282px minmax(0,1fr);gap:14px;align-items:start}
.ppl-layout>.ppl-left{
  position:sticky;top:calc(var(--topbar-h) + 12px);
  margin:0;overflow:visible;display:flex;flex-direction:column;
  height:calc(100vh - var(--topbar-h) - 128px);min-height:360px;
}
.ppl-left .tree-scroll{flex:1 1 auto;min-height:0;max-height:none;overflow-y:auto}
.ppl-left .pane-ft{
  flex:0 0 auto;margin-top:9px;padding-top:9px;
  border-top:1px solid var(--line-2);
  font-size:11.5px;line-height:1.6;color:var(--ink-4);
}
.ppl-right{min-width:0}
.ppl-right>.card:last-child{margin-bottom:0}
.ppl-right table{min-width:720px}
.ppl-layout .ppl-tree li{padding:6px 8px 6px 22px;font-size:12.5px}
.ppl-layout .ppl-tree li.pj{
  font-weight:600;color:var(--ink);background:#F7F9FC;
  margin-top:5px;border:1px solid var(--line-2);
}
.ppl-layout .ppl-tree li.pj.on{background:var(--brand-100);border-color:var(--brand-300)}
.ppl-layout .ppl-tree li.pj.ancestor{background:var(--brand-50);border-color:var(--brand-300)}
.ppl-layout .ppl-tree li.all,.ppl-layout .ppl-tree li.sys{color:var(--ink-2)}
.ppl-layout .ppl-tree li .mini{font-size:10.5px;padding:1px 5px}
.ppl-layout .ppl-tree li.empty>.nd .nm{color:var(--ink-4)}
.ppl-layout .ppl-tree li.hit>.nd .nm{color:var(--brand-600);font-weight:600}
.ppl-layout .ppl-tree .hint{padding:10px 4px 2px}
.ppl-filter{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  padding:9px 13px;margin-bottom:12px;
  border:1px solid var(--line);border-radius:var(--r);
  background:#fff;box-shadow:var(--sh-1);
  font-size:12.5px;color:var(--ink-2);
}
.ppl-filter b{font-weight:600;color:var(--brand-700)}
.ppl-filter .mini{margin-left:auto}
@media (max-width:1180px){
  /* 窄屏省掉「创建」列，尽量让操作列留在首屏可见 */
  .ppl-right thead th:nth-child(6),
  .ppl-right tbody tr:not(.uPrj):not(.uDept) td:nth-child(6){display:none}
  .ppl-right table{min-width:640px}
}
@media (max-width:1100px){
  .ppl-layout{grid-template-columns:216px minmax(0,1fr)}
  /* 窄栏把宽度让给部门名（悬停 title 可看全称），人数在右侧项目行里也有 */
  .ppl-layout .ppl-tree li .nd .mini{display:none}
}
@media (max-width:900px){
  .ppl-layout{grid-template-columns:1fr}
  .ppl-layout>.ppl-left{position:static;height:auto;min-height:0;max-height:300px}
  .ppl-right thead th:nth-child(6),
  .ppl-right tbody tr:not(.uPrj):not(.uDept) td:nth-child(6){display:table-cell}
  .ppl-right table{min-width:720px}
}

/* 项目删除：数据检查弹窗 */
.dl-box{padding:10px 12px;border-radius:10px;border:1px solid var(--line);margin-bottom:12px;font-size:13px;line-height:1.6}
.dl-box.bad{background:var(--danger-bg);border-color:#EFC9C4;color:var(--danger)}
.dl-box.ok{background:var(--ok-bg);border-color:#C7E9DC;color:var(--ok)}
.dl-box.warn{background:var(--warn-bg);border-color:#F0DCB8;color:var(--warn);margin:10px 0 0}
.dl-title{font-size:12.5px;font-weight:600;color:var(--ink-2);margin:0 0 5px}
.dl-list{border:1px solid var(--line);border-radius:10px;overflow:hidden}
.dl-row{display:grid;grid-template-columns:100px 60px 1fr;align-items:center;gap:8px;padding:7px 12px;font-size:13px;border-bottom:1px solid var(--line-2)}
.dl-row:last-child{border-bottom:0}
.dl-row:nth-child(odd){background:var(--brand-50)}
.dl-row b{font-size:14px;text-align:center;color:var(--ink-3)}
.dl-row b.bad{color:var(--danger)}
.dl-refs{font-size:12px;color:var(--ink-3);margin:8px 0 4px;line-height:1.6}
.dl-confirm{margin-top:12px}
.dl-confirm label{display:block;font-size:12.5px;color:var(--ink-2);margin-bottom:6px}
.dl-confirm input{width:100%}
@media (max-width:520px){.dl-row{grid-template-columns:86px 42px 1fr;padding:7px 8px;font-size:12px}}