/* ============================================================
   悟空人员&设备登记 · 飞书风格主题
   参考 Lark / 飞书开放平台设计语言：
     主色 #3370FF，背景 #F5F6F7，文字 #1F2329 / #646A73
   ============================================================ */
:root{
  /* 背景 */
  --bg:        #F5F6F7;
  --panel:     #FFFFFF;
  --panel-2:   #F8F9FA;
  --panel-3:   #F2F3F5;

  /* 边框 */
  --line:      #DEE0E3;
  --line-2:    #EFF0F1;

  /* 文字 */
  --text:      #1F2329;
  --text-2:    #373C43;
  --muted:     #646A73;
  --faint:     #8F959E;

  /* 主色：飞书蓝 */
  --brand:     #3370FF;
  --brand-h:   #245BDB;
  --brand-2:   #4E83FD;
  --brand-bg:  #EFF4FF;
  --brand-line:#C9D9FF;

  /* 语义色（飞书规范） */
  --ok:        #00B365;  --ok-bg:   #EBFAF3;  --ok-line:   #B7EDD5;
  --warn:      #FF8800;  --warn-bg: #FFF7E8;  --warn-line: #FFE0B2;
  --err:       #F54A45;  --err-bg:  #FEF1F1;  --err-line:  #FBCFCD;
  --purple:    #7F3BF5;  --purple-bg:#F5EEFF; --purple-line:#DDC9FF;
  --grey:      #646A73;  --grey-bg: #F2F3F5;  --grey-line: #DEE0E3;

  /* 阴影：飞书用极轻的层叠阴影 */
  --sh-1: 0 1px 2px rgba(31,35,41,.06), 0 0 1px rgba(31,35,41,.04);
  --sh-2: 0 2px 6px rgba(31,35,41,.08), 0 0 1px rgba(31,35,41,.04);
  --sh-3: 0 6px 20px rgba(31,35,41,.10), 0 2px 6px rgba(31,35,41,.05);
  --sh-4: 0 12px 40px rgba(31,35,41,.14), 0 4px 12px rgba(31,35,41,.06);

  --r-4: 4px;
  --r-6: 6px;
  --r-8: 8px;
  --r-12: 12px;
}
*{box-sizing:border-box}
[hidden]{display:none !important}
html,body{margin:0;padding:0}
body{
  background:var(--bg);
  color:var(--text);
  font:14px/1.6 -apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB",
       "Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* ---------- 顶部导航 ---------- */
.nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;gap:32px;
  padding:0 32px;height:56px;
  background:var(--panel);
  border-bottom:1px solid var(--line);
}
.brand{
  font-size:15px;font-weight:600;color:var(--text);
  letter-spacing:0;display:flex;align-items:center;gap:8px;
}
.brand::before{
  content:'';width:20px;height:20px;border-radius:5px;
  background:linear-gradient(135deg,#4E83FD,#3370FF);
  box-shadow:inset 0 -1px 2px rgba(0,0,0,.08);
}
.nav .tabs{display:flex;gap:4px}
.nav .tab{
  padding:6px 14px;border-radius:var(--r-6);
  color:var(--muted);text-decoration:none;
  font-size:14px;font-weight:400;transition:.15s;
}
.nav .tab:hover{color:var(--text);background:var(--panel-3)}
.nav .tab.active{color:var(--brand);background:var(--brand-bg);font-weight:500}

/* ---------- 布局 ---------- */
.wrap{max-width:1440px;margin:0 auto;padding:24px 32px 16px}
.wrap.narrow{max-width:640px}

.hero{margin-bottom:20px}
.hero h1{
  margin:0 0 6px;font-size:22px;font-weight:600;
  color:var(--text);line-height:1.4;letter-spacing:0;
}
.hero p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}

.card{
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r-8);
  padding:24px;
  margin-bottom:16px;
}
.card h2{margin:0 0 16px;font-size:16px;font-weight:600;color:var(--text)}
.card h3{margin:0 0 8px;font-size:14px;font-weight:600;color:var(--text)}
.muted-card{background:var(--panel-2)}
.muted-card p{margin:0 0 6px;color:var(--muted);font-size:13px;line-height:1.7}
.muted-card .small{font-size:12px;color:var(--faint)}

/* ---------- 表单 ---------- */
.lbl{
  display:block;font-size:13px;color:var(--text-2);
  margin-bottom:8px;font-weight:500;
}
.row{display:flex;gap:8px}
.row input{flex:1}
input,select,textarea{
  width:100%;padding:8px 12px;
  border-radius:var(--r-6);
  border:1px solid var(--line);
  background:var(--panel);color:var(--text);
  font-size:14px;font-family:inherit;
  outline:none;transition:.15s;
  line-height:1.5;
}
input::placeholder,textarea::placeholder{color:var(--faint)}
input:hover,select:hover,textarea:hover{border-color:#C9CDD4}
input:focus,select:focus,textarea:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(51,112,255,.10);
}
input:disabled{background:var(--panel-3);color:var(--faint);cursor:not-allowed}
textarea{resize:vertical;min-height:64px}

button{
  padding:8px 18px;border:0;border-radius:var(--r-6);
  cursor:pointer;font-size:14px;font-weight:500;
  font-family:inherit;transition:.15s;
  line-height:1.5;white-space:nowrap;
}
button.primary{
  background:var(--brand);color:#fff;
}
button.primary:hover{background:var(--brand-h)}
button.primary:active{background:#1E4DD1}
button.ghost{
  background:var(--panel);border:1px solid var(--line);color:var(--text-2);
}
button.ghost:hover{border-color:var(--brand-line);color:var(--brand);background:var(--brand-bg)}
button:disabled{opacity:.4;cursor:not-allowed;background:var(--brand)}
button.mini{
  padding:3px 10px;font-size:12px;border-radius:var(--r-4);
  background:var(--panel);border:1px solid var(--line);color:var(--text-2);
}
button.mini:hover{border-color:var(--brand-line);color:var(--brand);background:var(--brand-bg)}
button.danger{border-color:var(--err-line);color:var(--err)}
button.danger:hover{background:var(--err-bg)}
button.copy{
  display:inline-flex;align-items:center;gap:6px;
  margin-top:8px;padding:7px 16px;font-size:13px;font-weight:500;
  background:var(--brand);border:1px solid var(--brand);
  color:#fff;border-radius:var(--r-6);
  box-shadow:0 1px 2px rgba(51,112,255,.28);
}
button.copy:hover{background:var(--brand-h);border-color:var(--brand-h);
  box-shadow:0 3px 10px rgba(51,112,255,.32)}
button.copy:active{background:#1E4DD1;transform:translateY(1px)}
button.copy.is-ok{background:var(--ok);border-color:var(--ok);
  box-shadow:0 1px 2px rgba(0,179,101,.28)}
button.copy .copy-ic{display:inline-flex;width:15px;height:15px;flex-shrink:0}
button.copy .copy-ic svg{width:100%;height:100%;display:block}
button.copy .copy-ic-done{display:none}
button.copy.is-ok .copy-ic-copy{display:none}
button.copy.is-ok .copy-ic-done{display:inline-flex}

kbd{
  display:inline-block;
  background:var(--panel-3);border:1px solid var(--line);
  border-radius:var(--r-4);
  padding:0 5px;font-size:12px;font-family:inherit;
  color:var(--text-2);line-height:1.6;
}
code{
  background:var(--panel-3);border-radius:var(--r-4);
  padding:1px 5px;
  font-family:"SF Mono",Menlo,Consolas,"Cascadia Code",monospace;
  font-size:12.5px;color:var(--brand);
}
.cmd-actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap;align-items:center}
pre{
  cursor:text;
  background:#F8F9FA;border:1px solid var(--line);
  border-radius:var(--r-6);padding:14px 16px;
  overflow-x:auto;margin:8px 0 0;
  font-family:"SF Mono",Menlo,Consolas,"Cascadia Code",monospace;
  font-size:13px;line-height:1.7;color:var(--text-2);
  white-space:pre-wrap;word-break:break-all;
}

/* ---------- 提示 ---------- */
.msg{
  padding:8px 12px;border-radius:var(--r-6);
  font-size:13px;margin-top:12px;display:none;line-height:1.6;
}
.msg.show{display:block}
.msg.err{background:var(--err-bg);border:1px solid var(--err-line);color:#C93A35}
.msg.ok{background:var(--ok-bg);border:1px solid var(--ok-line);color:#00915A}
.notice{
  background:var(--warn-bg);border:1px solid var(--warn-line);
  border-radius:var(--r-6);padding:10px 12px;
  font-size:13px;color:#B36B00;margin-top:16px;line-height:1.7;
}
.notice b{color:#9A5C00;font-weight:600}

/* ---------- 安装者信息 ---------- */
.who{
  display:flex;align-items:center;gap:12px;margin-top:16px;padding:12px;
  background:var(--panel-2);border:1px solid var(--line-2);
  border-radius:var(--r-6);
}
.avatar{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-weight:600;font-size:14px;color:#fff;
  background:linear-gradient(135deg,#4E83FD,#3370FF);
}
.who-name{font-size:14px;font-weight:500;line-height:1.5;color:var(--text)}
.who-meta{color:var(--muted);font-size:12px;margin-top:1px}

/* ---------- 分段控件 ---------- */
.seg{
  display:inline-flex;background:var(--panel-3);
  border-radius:var(--r-6);padding:2px;margin-bottom:16px;gap:2px;
}
.seg-btn{
  padding:5px 14px;border-radius:var(--r-4);
  background:transparent;color:var(--muted);
  font-size:13px;font-weight:400;
  border:0;cursor:pointer;transition:.15s;
}
.seg-btn:hover{color:var(--text-2)}
.seg-btn.active{
  background:var(--panel);color:var(--text);
  font-weight:500;box-shadow:var(--sh-1);
}

/* ---------- 步骤 ---------- */
.step-list{display:flex;flex-direction:column;gap:18px}
.step{display:flex;gap:12px}
.step .no{
  flex:0 0 22px;width:22px;height:22px;border-radius:50%;
  background:var(--brand-bg);color:var(--brand);
  font-size:12px;font-weight:600;
  display:flex;align-items:center;justify-content:center;margin-top:1px;
}
.step .bd{flex:1;min-width:0}
.step .t{font-weight:500;font-size:14px;margin-bottom:3px;color:var(--text);line-height:1.5}
.step .d{color:var(--muted);font-size:13px;line-height:1.7}
.meta-line{color:var(--faint);font-size:12px;margin-top:16px}
.meta-line span{color:var(--warn);font-weight:500}

/* ---------- 表格 ---------- */
.table-wrap{
  background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r-8);overflow:hidden;
}
table{width:100%;border-collapse:collapse;font-size:13px}
thead th{
  text-align:left;padding:10px 16px;
  color:var(--muted);font-weight:500;font-size:13px;
  background:var(--panel-2);
  border-bottom:1px solid var(--line);
  white-space:nowrap;
}
tbody td{
  padding:12px 16px;
  border-bottom:1px solid var(--line-2);
  vertical-align:middle;
  color:var(--text);
  line-height:1.5;
}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:#FAFBFC}
.cell-main{font-weight:400;color:var(--text);line-height:1.5}
.cell-sub{color:var(--faint);font-size:12px;margin-top:1px;line-height:1.4}
.mono{
  font-family:"SF Mono",Menlo,Consolas,"Cascadia Code",monospace;
  font-size:12.5px;color:var(--text-2);
}

/* ---------- 徽章 ---------- */
.badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:1px 8px;border-radius:var(--r-4);
  font-size:12px;font-weight:500;white-space:nowrap;
  line-height:1.6;
}
.badge .dot{width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0}
.b-ok     {background:var(--ok-bg);     color:#00915A;}
.b-warn   {background:var(--warn-bg);   color:#B36B00;}
.b-err    {background:var(--err-bg);    color:#C93A35;}
.b-info   {background:var(--brand-bg);  color:var(--brand);}
.b-purple {background:var(--purple-bg); color:#6B2FD6;}
.b-grey   {background:var(--grey-bg);   color:var(--grey);}

/* ---------- 搜索区 ---------- */
.toolbar{
  display:flex;gap:8px;margin-bottom:16px;
  flex-wrap:wrap;align-items:center;
}
.search-box{position:relative;flex:1;min-width:260px}
.search-box input{padding-left:34px}
.search-box .icon{
  position:absolute;left:11px;top:50%;transform:translateY(-50%);
  color:var(--faint);font-size:13px;pointer-events:none;line-height:1;
}
.suggest{
  position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:30;
  background:var(--panel);border:1px solid var(--line);
  border-radius:var(--r-8);box-shadow:var(--sh-3);
  overflow:hidden;max-height:320px;overflow-y:auto;display:none;
}
.suggest.show{display:block}
.suggest .item{
  padding:8px 12px;cursor:pointer;
  display:flex;align-items:center;gap:8px;
  border-bottom:1px solid var(--line-2);
  transition:background .1s;
}
.suggest .item:last-child{border-bottom:none}
.suggest .item:hover,.suggest .item.active{background:var(--brand-bg)}
.suggest .nm{font-size:13px;font-weight:400;color:var(--text)}
.suggest .em{color:var(--faint);font-size:12px;margin-left:auto}

/* ---------- 分页 ---------- */
.pager{
  display:flex;align-items:center;gap:12px;justify-content:space-between;
  padding:12px 16px;border-top:1px solid var(--line);
  background:var(--panel);flex-wrap:wrap;
}
.pager .info{color:var(--muted);font-size:13px}
.pager .btns{display:flex;gap:4px;align-items:center}
.pager button{
  padding:4px 10px;font-size:13px;font-weight:400;
  border-radius:var(--r-4);background:var(--panel);
  border:1px solid var(--line);color:var(--text-2);
  transition:.15s;
}
.pager button:hover:not(:disabled){border-color:var(--brand-line);color:var(--brand)}
.pager button.on{
  background:var(--brand);border-color:var(--brand);color:#fff;font-weight:500;
}
.pager select{width:auto;padding:4px 8px;font-size:13px}

/* ---------- 空状态 ---------- */
.empty{text-align:center;color:var(--faint);padding:56px 20px;font-size:13px}
.empty .big{font-size:28px;margin-bottom:8px;opacity:.4;line-height:1}

/* ---------- 弹窗 ---------- */
.modal{
  position:fixed;inset:0;background:rgba(31,35,41,.45);
  z-index:200;display:none;align-items:center;justify-content:center;
  padding:20px;
}
.modal.show{display:flex;animation:fadeIn .15s ease}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal .box{
  background:var(--panel);border-radius:var(--r-12);
  padding:24px;width:100%;max-width:480px;
  max-height:88vh;overflow-y:auto;
  box-shadow:var(--sh-4);
  animation:slideUp .18s cubic-bezier(.2,.8,.3,1);
}
@keyframes slideUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.modal h3{
  margin:0 0 18px;font-size:17px;font-weight:600;color:var(--text);
}
.modal label{
  display:block;font-size:13px;color:var(--text-2);
  margin:14px 0 6px;font-weight:500;
}
.modal .actions{display:flex;gap:8px;margin-top:22px}
.modal .actions button{flex:1}
.modal .actions .primary{background:var(--brand);color:#fff}
.modal .actions .ghost{background:var(--panel);border:1px solid var(--line);color:var(--text-2)}


/* ---------- 数据缺失告警 ---------- */
.warn-dot{
  display:inline-flex;align-items:center;justify-content:center;
  width:15px;height:15px;border-radius:50%;
  font-size:10px;font-weight:700;line-height:1;
  margin-left:6px;vertical-align:middle;cursor:help;
  flex-shrink:0;
}
.warn-dot.critical{
  background:#FEF1F1;color:#F54A45;border:1px solid #FBCFCD;
  animation:pulse-danger 2s ease-in-out infinite;
}
.warn-dot.warning{
  background:#FFF7E8;color:#FF8800;border:1px solid #FFE0B2;
}
@keyframes pulse-danger{
  0%,100%{box-shadow:0 0 0 0 rgba(245,74,69,.35)}
  50%{box-shadow:0 0 0 4px rgba(245,74,69,0)}
}

.missing-tag{
  display:inline-block;
  padding:1px 7px;border-radius:4px;
  background:#FEF1F1;color:#F54A45;
  border:1px solid #FBCFCD;
  font-size:11.5px;font-weight:600;
}

/* 整行告警背景 */
tbody tr.row-critical{
  background:#FFFAFA;
  box-shadow:inset 3px 0 0 #F54A45;
}
tbody tr.row-critical:hover{background:#FFF5F5}
tbody tr.row-warning{
  background:#FFFCF7;
  box-shadow:inset 3px 0 0 #FF8800;
}
tbody tr.row-warning:hover{background:#FFF9F0}

/* 告警汇总条 */
.alert-bar{
  display:flex;align-items:center;gap:10px;
  padding:10px 14px;margin-bottom:14px;
  border-radius:var(--r-6);
  font-size:13px;
}
.alert-bar.critical{
  background:#FEF1F1;border:1px solid #FBCFCD;color:#C93A35;
}
.alert-bar.warning{
  background:#FFF7E8;border:1px solid #FFE0B2;color:#B36B00;
}
.alert-bar .icon{
  width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;flex-shrink:0;
}
.alert-bar.critical .icon{background:#F54A45;color:#fff}
.alert-bar.warning .icon{background:#FF8800;color:#fff}
.alert-bar b{font-weight:600}

/* ---------- 页脚 ---------- */
.foot{
  text-align:center;color:var(--faint);
  font-size:12px;padding:24px 0 8px;
}

/* ---------- toast ---------- */
.toast{
  position:fixed;top:70px;left:50%;
  transform:translateX(-50%) translateY(-6px);
  z-index:999;padding:9px 18px;border-radius:var(--r-6);
  font-size:13px;font-weight:400;
  box-shadow:var(--sh-3);
  opacity:0;pointer-events:none;
  transition:.2s cubic-bezier(.2,.8,.3,1);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.ok {background:var(--ok-bg);   border:1px solid var(--ok-line);   color:#00915A}
.toast.err{background:var(--err-bg);  border:1px solid var(--err-line);  color:#C93A35}

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{
  background:#D0D3D9;border-radius:4px;
}
::-webkit-scrollbar-thumb:hover{background:#B8BCC4}

/* ---------- 响应式 ---------- */
@media (max-width:1100px){
  .wrap{padding:20px}
  .nav{padding:0 20px;gap:20px}
}
@media (max-width:820px){
  .hero h1{font-size:19px}
  .card{padding:18px}
  thead th,tbody td{padding:9px 12px}
}

/* ============================================================
   帮助文档弹框
   ============================================================ */
.help-btn{
  margin-left:auto;
  display:flex;align-items:center;gap:6px;
  padding:6px 12px;height:32px;
  border:1px solid var(--line);border-radius:var(--r-6);
  background:#fff;color:var(--text-2);
  font-size:13px;cursor:pointer;
  transition:all .16s;
}
.help-btn:hover{
  border-color:var(--brand);color:var(--brand);
  background:var(--brand-soft);
}
.help-icon{
  display:flex;align-items:center;justify-content:center;
  width:16px;height:16px;border-radius:50%;
  background:var(--brand);color:#fff;
  font-size:11px;font-weight:700;line-height:1;
}

/* 弹框结构 */
.help-modal .box{max-height:86vh;display:flex;flex-direction:column;padding:0}
.help-head{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:16px;padding:22px 26px 18px;
  border-bottom:1px solid var(--line);
  flex-shrink:0;
}
.help-close{
  width:30px;height:30px;border:none;border-radius:var(--r-6);
  background:transparent;color:var(--muted);
  font-size:22px;line-height:1;cursor:pointer;
  transition:all .16s;flex-shrink:0;
}
.help-close:hover{background:var(--panel-2);color:var(--text)}
.help-body{
  padding:20px 26px;overflow-y:auto;flex:1;
}
.help-modal .actions{
  padding:16px 26px;border-top:1px solid var(--line);
  display:flex;justify-content:flex-end;gap:10px;
  flex-shrink:0;margin:0;
}

/* 章节 */
.help-sec{
  display:flex;gap:14px;
  padding:18px 0;
  border-bottom:1px solid var(--line2);
}
.help-sec:last-child{border-bottom:none;padding-bottom:4px}
.help-num{
  flex-shrink:0;width:26px;height:26px;border-radius:50%;
  background:var(--brand-soft);color:var(--brand);
  font-size:13px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
.help-content{flex:1;min-width:0}
.help-content h4{
  margin:0 0 8px;font-size:14.5px;font-weight:600;color:var(--text);
}
.help-lead{
  margin:0 0 12px;font-size:13px;color:var(--text-2);line-height:1.7;
}

/* 双列 */
.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:12px 0}
.help-col{background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-8);padding:12px 14px}
.help-col-title{font-size:12.5px;font-weight:600;color:var(--text);margin-bottom:8px}
.help-list{margin:0;padding-left:16px;font-size:12.5px;color:var(--text-2);line-height:1.9}
.help-list li{margin-bottom:1px}
.help-list code{
  background:#fff;border:1px solid var(--line);border-radius:3px;
  padding:0 4px;font-size:11.5px;color:var(--brand);
}
.help-list .help-auto{color:var(--ok)}

/* 表格 */
.help-table{
  width:100%;border-collapse:collapse;font-size:12.5px;margin:10px 0;
}
.help-table th{
  background:var(--panel-2);color:var(--text-2);font-weight:600;
  text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);
  font-size:12px;
}
.help-table td{
  padding:9px 10px;border-bottom:1px solid var(--line2);color:var(--text-2);
  vertical-align:top;line-height:1.6;
}
.help-table tr:last-child td{border-bottom:none}

.tag-auto,.tag-manual{
  display:inline-block;padding:1px 8px;border-radius:4px;
  font-size:11.5px;font-weight:600;
}
.tag-auto{background:#EBFAF3;color:#0E9F6E;border:1px solid #C6F0DF}
.tag-manual{background:#FFF7E8;color:#B36B00;border:1px solid #FFE0B2}

/* 步骤 */
.help-steps{display:flex;flex-direction:column;gap:12px;margin:12px 0}
.help-step{display:flex;gap:10px;align-items:flex-start}
.step-no{
  flex-shrink:0;width:20px;height:20px;border-radius:50%;
  background:var(--brand);color:#fff;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;margin-top:1px;
}
.help-step b{font-size:13px;color:var(--text);display:block;margin-bottom:2px}
.help-step p{margin:0;font-size:12.5px;color:var(--text-2);line-height:1.65}
.help-step code{
  background:var(--panel-2);border:1px solid var(--line);border-radius:3px;
  padding:1px 5px;font-size:11.5px;color:var(--brand);
}

/* 提示条 */
.help-tip{
  background:var(--brand-soft);border-left:3px solid var(--brand);
  border-radius:0 var(--r-6) var(--r-6) 0;
  padding:10px 14px;font-size:12.5px;color:var(--text-2);line-height:1.7;
  margin:12px 0;
}
.help-tip b{color:var(--brand)}

.help-warn{
  background:#FFF7E8;border-left:3px solid var(--warn);
  border-radius:0 var(--r-6) var(--r-6) 0;
  padding:10px 14px;font-size:12.5px;color:#8A5600;line-height:1.7;
  margin:12px 0;
}
.help-warn b{color:#B36B00}

/* 告警演示 */
.help-alert-demo{
  display:flex;gap:10px;align-items:flex-start;
  padding:10px 14px;border-radius:var(--r-6);margin-bottom:8px;
}
.help-alert-demo.critical{background:#FEF1F1;border:1px solid #FBCFCD}
.help-alert-demo.warning{background:#FFF7E8;border:1px solid #FFE0B2}
.demo-dot{
  flex-shrink:0;width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:11px;font-weight:700;margin-top:1px;
}
.help-alert-demo.critical .demo-dot{background:var(--err)}
.help-alert-demo.warning .demo-dot{background:var(--warn)}
.help-alert-demo b{font-size:12.5px;display:block;margin-bottom:2px}
.help-alert-demo.critical b{color:#C93A35}
.help-alert-demo.warning b{color:#B36B00}
.help-alert-demo p{margin:0;font-size:12px;color:var(--text-2);line-height:1.6}

/* 状态卡片 */
.help-states{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:12px 0}
.state-card{
  background:var(--panel-2);border:1px solid var(--line);
  border-radius:var(--r-8);padding:12px 14px;
}
.state-title{font-size:12.5px;font-weight:600;color:var(--text);margin-bottom:8px}
.state-vals{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:8px}
.state-card p{margin:0;font-size:11.5px;color:var(--muted);line-height:1.65}
.state-card p b{color:var(--text-2)}

/* ---------- 弹框标题栏 + 关闭按钮 ---------- */
.modal-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;margin-bottom:16px;
}
.modal-head h3{margin:0}
.modal-x{
  flex-shrink:0;
  width:30px;height:30px;
  border:none;border-radius:var(--r-6);
  background:transparent;color:var(--muted);
  font-size:22px;line-height:1;
  cursor:pointer;transition:all .16s;
  display:flex;align-items:center;justify-content:center;
}
.modal-x:hover{background:var(--panel-2);color:var(--text)}
.modal-x:active{transform:scale(.94)}

/* ---------- 弹框标题栏 + 右上角关闭 ---------- */
.modal-head{
  display:flex;align-items:center;justify-content:space-between;
  gap:14px;margin-bottom:16px;
}
.modal-head h3{margin:0}
.modal-x{
  flex-shrink:0;width:30px;height:30px;
  border:none;border-radius:var(--r-6);
  background:transparent;color:var(--muted);
  font-size:22px;line-height:1;
  cursor:pointer;transition:all .16s;
  display:flex;align-items:center;justify-content:center;
}
.modal-x:hover{background:var(--panel-2);color:var(--text)}
.modal-x:active{transform:scale(.94)}

/* ---------- 台账表格 ---------- */
.toolbar{flex-wrap:wrap;gap:8px}
.toolbar-right{margin-left:auto;display:flex;gap:8px}

.table-wrap{overflow-x:auto}
.table-wrap table{min-width:max-content}

/* 表头/单元格竖分割线：每一列的边界都可见 */
thead th{border-right:1px solid var(--line)}
thead th:last-child{border-right:none}
tbody td{border-right:1px dashed var(--line-2)}
tbody td:last-child{border-right:none}

th.th-hl{background:#FED4A4 !important;color:#8A5600}
td.td-hl{background:#FFF9F2}
td.td-idx{color:var(--muted);font-size:12px;text-align:center}
.cell-empty{color:#C9CDD4}

.pnum{
  min-width:30px;height:30px;padding:0 8px;
  border:1px solid var(--line);border-radius:var(--r-6);
  background:#fff;color:var(--text-2);font-size:13px;cursor:pointer;
  transition:all .14s;
}
.pnum:hover{border-color:var(--brand);color:var(--brand)}
.pnum.active{background:var(--brand);border-color:var(--brand);color:#fff}
.pnum:disabled{opacity:.4;cursor:not-allowed}
.pdot{color:var(--muted);padding:0 4px;align-self:center}

/* toast */
.toast{
  position:fixed;left:50%;bottom:32px;transform:translateX(-50%) translateY(12px);
  background:#1F2329;color:#fff;padding:10px 18px;border-radius:var(--r-8);
  font-size:13px;max-width:80vw;
  opacity:0;pointer-events:none;transition:all .2s;z-index:999;
  box-shadow:0 6px 24px rgba(0,0,0,.18);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast.err{background:#C93A35}

/* ---------- 语言切换 ---------- */
.nav-right{display:flex;align-items:center;gap:10px;margin-left:auto}
.lang-switch{
  display:flex;border:1px solid var(--line);border-radius:var(--r-6);
  overflow:hidden;background:#fff;
}
.lang-btn{
  padding:5px 10px;border:none;background:transparent;
  color:var(--text-2);font-size:12.5px;cursor:pointer;
  transition:all .14s;line-height:1.4;
}
.lang-btn:hover{background:var(--brand-soft);color:var(--brand)}
.lang-btn.active{background:var(--brand);color:#fff}

/* ---------- 可编辑单元格 ---------- */
td.editable-cell{
  cursor:pointer;position:relative;
  transition:background .12s;
}
td.editable-cell:hover{
  background:#EFF4FF;
  box-shadow:inset 0 0 0 1px var(--brand);
}
td.editable-cell.td-hl:hover{background:#FFE9C7}

.cell-input{
  border:1px solid var(--brand);border-radius:3px;
  padding:2px 4px;font-size:12.5px;font-family:inherit;
  outline:none;background:#fff;
  box-shadow:0 0 0 2px rgba(51,112,255,.15);
}

/* ---------- 编辑弹框表单 ---------- */
.edit-form{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:14px 16px;margin:18px 0;
  max-height:52vh;overflow-y:auto;padding-right:4px;
}
.edit-field{display:flex;flex-direction:column;gap:5px;min-width:0}
.edit-field.full{grid-column:1/-1}
.edit-field label{
  font-size:12px;color:var(--text-2);font-weight:500;
}
.edit-input{
  width:100%;height:34px;padding:0 10px;
  border:1px solid var(--line);border-radius:var(--r-6);
  background:#fff;color:var(--text);font-size:13px;font-family:inherit;
  transition:all .14s;
}
textarea.edit-input{height:auto;padding:8px 10px;line-height:1.5;resize:vertical}
.edit-input:hover{border-color:#C9CDD4}
.edit-input:focus{
  outline:none;border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(51,112,255,.12);
}
.edit-input:disabled{background:var(--panel-2);color:var(--muted);cursor:not-allowed}

@media (max-width: 900px){
  .edit-form{grid-template-columns:1fr 1fr}
}

/* ---------- 邮箱输入 ---------- */
.email-row{
  display:flex;gap:0;
  flex:1 1 auto;min-width:0;
  border:1px solid var(--line);border-radius:var(--r-8);
  overflow:hidden;background:#fff;
  transition:all .15s;
}
.email-row:focus-within{
  border-color:var(--brand);
  box-shadow:0 0 0 3px rgba(51,112,255,.12);
}
.email-row input{
  flex:1;min-width:0;
  border:none!important;border-radius:0!important;
  box-shadow:none!important;
  height:44px;padding:0 14px;
  font-size:14px;background:transparent;
}
.email-row input:focus{outline:none;box-shadow:none!important}

.email-state{
  flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  width:34px;
  font-size:13px;font-weight:700;
  color:var(--ok);
  background:transparent;
}
.email-row.is-bad{border-color:var(--err);box-shadow:0 0 0 3px rgba(201,58,53,.10)}
.email-row.is-bad .email-state{color:var(--err)}
.email-row.is-ok{border-color:var(--brand)}
.email-row.is-ok .email-state{color:var(--brand)}