/* 云快充运营平台 · 后台样式（无第三方依赖，纯 CSS） */
:root{
  --nav:#12263f; --nav2:#0d1b2e; --primary:#1677ff; --primary-d:#0e5fd8;
  --bg:#f4f6fa; --card:#fff; --line:#e6eaf0; --text:#1f2937; --muted:#8a94a6;
  --green:#16a34a; --blue:#2563eb; --orange:#ea8a00; --red:#dc2626; --gray:#6b7280;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei","PingFang SC",sans-serif;
  background:var(--bg);color:var(--text);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
code{font-family:ui-monospace,SFMono-Regular,Consolas,"Courier New",monospace;font-size:12px}
.muted{color:var(--muted);font-weight:400;font-size:12px}
.tip{color:var(--muted);font-size:12.5px;line-height:1.7;margin:10px 0 0}
.price{color:var(--red)}

/* 布局 */
.shell{display:flex;min-height:100vh}
.side{width:212px;flex:0 0 212px;background:linear-gradient(180deg,var(--nav),var(--nav2));color:#c9d3e3;
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.brand{display:flex;align-items:center;gap:10px;padding:18px 16px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
.brand .logo{width:36px;height:36px;border-radius:10px;object-fit:contain;display:block;flex:0 0 36px;
  box-shadow:0 8px 18px rgba(0,0,0,.28)}
.bname{font-size:15px;font-weight:600;color:#fff;letter-spacing:.5px}
.bsub{font-size:11px;color:#7d8ba3;margin-top:2px}
.nav{list-style:none;margin:8px 0 0;padding:0;flex:1;overflow:auto}
.navitem{display:flex;align-items:center;gap:10px;padding:10px 16px;color:#c2ccdb;font-size:13.5px;border-left:3px solid transparent}
.navitem:hover{background:rgba(255,255,255,.06);color:#fff;text-decoration:none}
.navitem.active{background:rgba(22,119,255,.16);color:#fff;border-left-color:#3f9bff;font-weight:600}
.navitem .ico{width:20px;text-align:center;opacity:.9}
.sidefoot{padding:12px 16px;font-size:11px;color:#66738a;border-top:1px solid rgba(255,255,255,.08)}
.main{flex:1;min-width:0;display:flex;flex-direction:column}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:12px 22px;background:#fff;
  border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.crumb{font-weight:600;display:flex;align-items:center;gap:8px}
.crumb .dot{width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,#1677ff,#00d0b0)}
.userbox{display:flex;align-items:center;gap:10px;font-size:13px}
.uname{font-weight:600}
.urole{background:#eef4ff;color:#1677ff;border-radius:20px;padding:2px 10px;font-size:12px}
.logout{color:var(--muted);font-size:12.5px}
.content{padding:18px 22px 40px}

/* 卡片 */
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;margin-bottom:16px;
  box-shadow:0 1px 2px rgba(16,24,40,.04)}
.cardhd{display:flex;justify-content:space-between;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line)}
.cardhd h3{margin:0;font-size:14.5px;font-weight:600}
.cardbd{padding:14px 16px}
.tools{display:flex;gap:8px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media(max-width:1100px){.two{grid-template-columns:1fr}}
.divider{height:1px;background:var(--line);margin:14px 0}

/* 指标 */
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:12px}
.stat{background:#fbfcfe;border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.slabel{font-size:12.5px;color:var(--muted)}
.svalue{font-size:24px;font-weight:700;margin-top:6px;letter-spacing:-.5px}
.svalue .unit{font-size:12px;font-weight:400;color:var(--muted);margin-left:4px}
.shint{font-size:12px;color:var(--muted);margin-top:6px}

/* 表格 */
.tablewrap{overflow:auto;border:1px solid var(--line);border-radius:10px}
.tbl{width:100%;border-collapse:collapse;font-size:13px}
.tbl th{background:#f7f9fc;text-align:left;font-weight:600;color:#475467;padding:10px 12px;
  border-bottom:1px solid var(--line);white-space:nowrap;font-size:12.5px}
.tbl td{padding:9px 12px;border-bottom:1px solid #f1f4f8;vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:#fafcff}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tbl .nowrap{white-space:nowrap}
.tbl.mini{font-size:12.5px}
.tbl.mini th,.tbl.mini td{padding:7px 10px}
.empty{padding:34px;text-align:center;color:var(--muted);background:#fbfcfe;border:1px dashed var(--line);border-radius:10px}
code.hex{color:#475467;word-break:break-all;font-size:11.5px}

/* 徽标 */
.badge{display:inline-block;padding:2px 9px;border-radius:20px;font-size:12px;line-height:1.7;white-space:nowrap}
.b-green{background:#e8f7ee;color:var(--green)}
.b-blue{background:#e8f0ff;color:var(--blue)}
.b-orange{background:#fff3e0;color:var(--orange)}
.b-red{background:#fdeaea;color:var(--red)}
.b-gray{background:#f0f2f5;color:var(--gray)}

/* 按钮 / 表单 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:34px;padding:0 14px;
  border-radius:8px;border:1px solid #d5dbe5;background:#fff;color:#344054;font-size:13px;cursor:pointer;
  transition:.15s;white-space:nowrap}
.btn:hover{border-color:#b9c3d4;background:#fafbfd;text-decoration:none}
.btn.primary{background:var(--primary);border-color:var(--primary);color:#fff}
.btn.primary:hover{background:var(--primary-d);border-color:var(--primary-d)}
.btn.warn{background:#fff;border-color:#f0b8b8;color:var(--red)}
.btn.block{width:100%;height:42px;font-size:15px}
.btn:disabled{opacity:.55;cursor:not-allowed}
.mini{font-size:12.5px;margin-right:8px}
.searchbar{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px}
.searchbar input,.searchbar select{height:34px;border:1px solid #d5dbe5;border-radius:8px;padding:0 10px;
  font-size:13px;color:#344054;background:#fff;min-width:120px}
.searchbar input[name="kw"]{min-width:220px}
.formgrid{margin-top:4px}
.fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px 16px}
.field{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:#475467}
.field span{font-weight:500}
.field input,.field select,.field textarea{height:36px;border:1px solid #d5dbe5;border-radius:8px;padding:0 10px;
  font-size:13.5px;color:var(--text);background:#fff;outline:none;font-family:inherit}
.field textarea{height:auto;padding:8px 10px;line-height:1.6}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#8ab7ff;box-shadow:0 0 0 3px rgba(22,119,255,.1)}
.field em{font-style:normal;color:var(--muted);font-size:11.5px}
.field.wide{grid-column:1/-1}
.factions{margin-top:14px;display:flex;gap:10px}
.cmdbar{display:flex;flex-wrap:wrap;gap:8px}
.alert{padding:10px 14px;border-radius:9px;margin-bottom:12px;font-size:13px;border:1px solid transparent}
.alert.ok{background:#eafaf1;border-color:#bfebd0;color:#116632}
.alert.err{background:#fdecec;border-color:#f6c9c9;color:#9b1c1c}
.pager{margin-top:12px;font-size:12.5px;color:var(--muted);display:flex;gap:12px;align-items:center;justify-content:flex-end}

/* 键值对 */
.kv{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px 18px}
.kv.compact{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.kv>div{display:flex;flex-direction:column;gap:3px;border-bottom:1px dashed #eef1f6;padding-bottom:8px}
.kv span{font-size:12px;color:var(--muted)}
.kv b{font-weight:600;font-size:13.5px;word-break:break-all}
.moneybox{background:#fbfcfe;border:1px solid var(--line);border-radius:10px;padding:12px 14px}
.mline{display:flex;justify-content:space-between;padding:6px 0;font-size:13px;border-bottom:1px dashed #eef1f6}
.mline:last-child{border:none}
.mline.total{font-size:15px;padding-top:10px}
.mline.total b{color:var(--red);font-size:19px}
.docbox h4{margin:16px 0 6px;font-size:13.5px}
.docbox pre{background:#f7f9fc;border:1px solid var(--line);border-radius:8px;padding:10px 12px;
  overflow:auto;font-size:12px;line-height:1.7}
.docbox p{margin:6px 0;line-height:1.75}

/* 登录页：左品牌 / 右表单 */
body.loginpg{margin:0;min-height:100vh;padding:28px;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(1200px 700px at 12% 6%,#1c4d80 0,#0d2035 52%,#07111c 100%);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei","PingFang SC",sans-serif;
  color:var(--text);font-size:14px;line-height:1.55;-webkit-font-smoothing:antialiased}
.loginwrap{display:flex;width:100%;max-width:980px;min-height:556px;background:#fff;border-radius:22px;
  overflow:hidden;box-shadow:0 34px 90px rgba(2,14,28,.6)}
.loginbrand{position:relative;flex:0 0 44%;padding:32px 34px;color:#eaf6ff;overflow:hidden;
  background:linear-gradient(155deg,#08243f 0,#0b4c86 46%,#0a8fa6 100%);display:flex;flex-direction:column}
.loginbrand:before{content:"";position:absolute;right:-90px;bottom:-140px;width:360px;height:360px;
  border-radius:50%;background:radial-gradient(circle,rgba(0,231,201,.34),rgba(0,231,201,0) 66%)}
.loginbrand:after{content:"";position:absolute;left:-70px;top:-90px;width:260px;height:260px;
  border-radius:50%;background:radial-gradient(circle,rgba(80,170,255,.28),rgba(80,170,255,0) 68%)}
.lb-top{position:relative;display:flex;align-items:center;gap:11px;font-size:16px;font-weight:600;
  letter-spacing:.6px;z-index:1}
.lb-top img{width:36px;height:36px;border-radius:10px;box-shadow:0 10px 22px rgba(0,0,0,.32)}
.lb-card{position:relative;z-index:1;margin:26px 0 18px;background:#fff;border-radius:14px;padding:14px 16px;
  max-width:208px;box-shadow:0 20px 44px rgba(3,22,42,.4)}
.lb-card img{display:block;width:100%;height:auto}
.lb-points{position:relative;z-index:1;list-style:none;margin:0;padding:0;font-size:12.5px;line-height:1.95;
  color:#cbe3f6;max-width:330px}
.lb-points li{display:flex;gap:9px}
.lb-points li:before{content:"•";color:#3fe3c8;font-weight:700}
.lb-foot{position:relative;z-index:1;margin-top:auto;padding-top:26px;font-size:10.5px;letter-spacing:2.4px;
  color:rgba(203,227,246,.52)}
.loginmain{flex:1;display:flex;align-items:center;justify-content:center;padding:44px 46px}
.loginform{width:100%;max-width:336px}
.loginform h1{margin:0 0 6px;font-size:23px;letter-spacing:-.3px}
.lsub{margin:0 0 24px;color:var(--muted);font-size:12.5px}
.loginpg .field{margin-bottom:14px}
.loginpg .field label{display:block;font-size:12.5px;color:var(--muted);margin-bottom:6px}
.loginpg .field input{width:100%;height:44px;border:1px solid var(--line);border-radius:10px;padding:0 13px;
  font-size:14px;background:#fafbfd;transition:border-color .15s,box-shadow .15s}
.loginpg .field input:focus{outline:none;border-color:#2f8cff;background:#fff;
  box-shadow:0 0 0 3px rgba(47,140,255,.14)}
.loginpg .btn.block{width:100%;height:45px;margin-top:8px;border-radius:10px;font-size:15px;letter-spacing:2px;
  background:linear-gradient(135deg,#1f7cf0,#0fb9b0);border:0;box-shadow:0 12px 26px rgba(24,124,240,.32)}
.loginpg .btn.block:hover{filter:brightness(1.05)}
.loginpg .alert{margin-bottom:14px}
.lhint{margin-top:18px;font-size:11px;color:var(--muted);line-height:1.85;text-align:center;
  padding-top:16px;border-top:1px dashed var(--line)}
.loginbox{width:100%;max-width:392px;background:#fff;border-radius:16px;padding:30px 30px 24px;
  box-shadow:0 20px 60px rgba(0,0,0,.4)}
.lhead{text-align:center;margin-bottom:20px}
@media(max-width:820px){
  body.loginpg{padding:16px}
  .loginwrap{flex-direction:column;max-width:430px;min-height:0}
  .loginbrand{flex:none;padding:22px 24px}
  .lb-card{display:none}
  .lb-points{display:none}
  .lb-foot{margin-top:16px;padding-top:12px}
  .loginmain{padding:28px 24px 34px}
}