:root{
  --bg:#0d1117; --panel:#151b23; --panel2:#1b232d; --line:#252d38;
  --fg:#e6edf3; --dim:#8b98a5; --accent:#4cc9f0; --accent2:#f72585;
  --ok:#06d6a0; --warn:#ffd166; --bad:#ef476f; --violet:#7c5cff;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);
  font:14px/1.55 "Inter","Segoe UI","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.topbar{display:flex;align-items:center;gap:24px;padding:0 22px;height:56px;
  background:linear-gradient(180deg,#141a22,#10161d);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:20}
.brand{font-weight:700;letter-spacing:.3px}
.brand .logo{color:var(--accent);margin-right:4px}
.brand .sub{color:var(--dim);font-weight:400;font-size:12px;margin-left:6px}
.topbar nav{display:flex;gap:4px;flex:1}
.topbar nav a{padding:6px 13px;border-radius:7px;color:var(--dim);font-size:13px;transition:.15s}
.topbar nav a:hover{background:#1c2530;color:var(--fg)}
.topbar nav a.on{background:#1d2836;color:var(--accent)}
.topbar nav a.dim{margin-left:auto;opacity:.6}
main{max-width:1440px;margin:0 auto;padding:22px}
.foot{text-align:center;color:#4d5a67;font-size:12px;padding:26px}

/* KPI */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:20px}
.kpi{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px;position:relative;overflow:hidden}
.kpi::after{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:var(--accent);opacity:.7}
.kpi.k2::after{background:var(--accent2)} .kpi.k3::after{background:var(--ok)}
.kpi.k4::after{background:var(--warn)} .kpi.k5::after{background:var(--violet)}
.kpi .lb{color:var(--dim);font-size:12px;letter-spacing:.4px}
.kpi .v{font-size:25px;font-weight:650;margin-top:6px;font-variant-numeric:tabular-nums;letter-spacing:-.5px}
.kpi .v small{font-size:13px;color:var(--dim);font-weight:400;margin-left:3px}
.kpi .x{color:#5f6d7a;font-size:11.5px;margin-top:4px}

/* panels */
.grid{display:grid;gap:16px;margin-bottom:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(420px,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px 18px 18px}
.card h3{margin:0 0 14px;font-size:13.5px;font-weight:600;color:#cbd5e1;letter-spacing:.3px;
  display:flex;align-items:center;gap:8px}
.card h3 .tag{font-size:11px;color:var(--dim);font-weight:400;background:#1e2732;padding:2px 8px;border-radius:20px}
.chart{position:relative;width:100%}
.h220{height:220px}.h260{height:260px}.h300{height:300px}.h360{height:360px}

/* table */
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;color:var(--dim);font-weight:500;font-size:11.5px;text-transform:uppercase;
  letter-spacing:.5px;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:8px 10px;border-bottom:1px solid #1c232c;vertical-align:middle}
tbody tr:hover{background:#182028}
.num{font-variant-numeric:tabular-nums;text-align:right}
.mono{font-family:"JetBrains Mono","Consolas",monospace;font-variant-numeric:tabular-nums}
.scroll{max-height:430px;overflow:auto;border-radius:8px}
.scroll::-webkit-scrollbar{width:9px;height:9px}
.scroll::-webkit-scrollbar-thumb{background:#2b3542;border-radius:9px}
tr.rank1 td:first-child{color:var(--warn);font-weight:700}
tr.rank2 td:first-child{color:#d9dee4;font-weight:700}
tr.rank3 td:first-child{color:#c98f5f;font-weight:700}

/* misc */
.bar{height:6px;border-radius:4px;background:#222b36;overflow:hidden;min-width:60px}
.bar>i{display:block;height:100%;background:linear-gradient(90deg,var(--accent),#3a86ff);border-radius:4px}
.pill{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11.5px;background:#1e2732;color:var(--dim)}
.empty{color:#5a6672;text-align:center;padding:46px 0}
.note{background:#1a2130;border:1px solid #26303e;border-left:3px solid var(--accent);
  border-radius:8px;padding:11px 14px;font-size:12.5px;color:#a9b6c2;margin-bottom:16px}

/* forms / import */
label.f{display:block;color:var(--dim);font-size:12px;margin:12px 0 5px}
input[type=text],input[type=password],select{bg:var(--panel2);background:#131a22;border:1px solid var(--line);
  color:var(--fg);padding:9px 12px;border-radius:8px;font-size:13px;outline:none;width:100%}
input:focus,select:focus{border-color:var(--accent)}
.btn{display:inline-block;background:var(--accent);color:#06202b;font-weight:650;border:none;
  padding:10px 20px;border-radius:8px;cursor:pointer;font-size:13.5px;transition:.15s}
.btn:hover{filter:brightness(1.1)}
.btn.ghost{background:transparent;color:var(--dim);border:1px solid var(--line)}
.btn.ghost:hover{color:var(--fg);border-color:#3a4653}
.drop{border:1.6px dashed #33404f;border-radius:12px;padding:34px;text-align:center;color:var(--dim);
  background:#12181f;cursor:pointer;transition:.15s}
.drop:hover,.drop.over{border-color:var(--accent);background:#141d26;color:var(--fg)}
.drop b{color:var(--fg);display:block;font-size:15px;margin-bottom:5px}
.hint{font-size:11.5px;color:#5f6d7a;margin-top:7px;line-height:1.7}
.ok-msg{background:#10261f;border:1px solid #1d4b3a;color:var(--ok);padding:11px 15px;border-radius:8px;margin-bottom:14px}
.err-msg{background:#2a1620;border:1px solid #5d2233;color:#ff8fa8;padding:11px 15px;border-radius:8px;margin-bottom:14px}
.inline-fmt{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.inline-fmt .sep{color:#3d4956}
@media(max-width:640px){
  .topbar{padding:0 12px;gap:10px}.topbar nav a{padding:6px 9px;font-size:12px}
  .kpi .v{font-size:21px}
}

/* ===== 映射工作台 ===== */
.toolbar{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin:14px 0 12px}
.toolbar input[type=text]{width:auto;max-width:320px;flex:1}
.toolbar select{width:auto;min-width:150px}
.toolbar .btn, .toolbar a.btn{padding:8px 14px;font-size:12.5px}
.pill.ok{background:#10261f;color:#4ade80}
.pill.warn{background:#2a2416;color:#fbbf24}
.pill.bad{background:#2a1620;color:#ff8fa8}
.dim{color:var(--dim)}
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{text-align:left;color:var(--dim);font-weight:600;font-size:11.5px;
  padding:9px 10px;border-bottom:1px solid var(--line);background:#10161d;position:sticky;top:0;z-index:2}
.tbl td{padding:7px 10px;border-bottom:1px solid #191f27;vertical-align:middle}
.tbl tbody tr:hover{background:#131a22}
.tbl td.num{text-align:right;font-variant-numeric:tabular-nums}
.tbl select.sel{min-width:300px;font-size:12px;padding:6px 9px}
.tbl .btn{padding:3px 9px;font-size:11.5px}

/* ===== 映射覆盖率 ===== */
.cov{margin:12px 0 10px}
.covbar{height:14px;border-radius:8px;background:#1b2129;overflow:hidden}
.covfill{height:100%;background:var(--ok);border-radius:8px;transition:width .3s}
.covtxt{font-size:12.5px;color:var(--dim);margin-top:7px;line-height:1.7}
.covtxt b{color:#e6dcc8}
.reasonwrap{display:flex;gap:9px;flex-wrap:wrap;margin:10px 0 12px}
.rcard{flex:1;min-width:150px;background:#10151c;border:1px solid var(--line);
  border-radius:10px;padding:9px 12px;cursor:pointer}
.rcard:hover{border-color:#3a4655}
.rlabel{font-size:11.5px;color:var(--dim)}
.rnum{font-size:17px;font-weight:600;margin-top:2px}
.rnum small{font-size:11px;font-weight:400;color:var(--dim)}
.ramt{font-size:11.5px;color:var(--dim);font-variant-numeric:tabular-nums}