:root{
  --bg:#f4f5f7;--panel:#fff;--line:#dfe2e6;--line2:#eceef1;--ink:#1d232b;--ink2:#5b6470;--ink3:#8a929c;
  --brand:#b4232a;--brand2:#8f1a20;--acc:#1f5fa8;--ok:#1e7b48;--warn:#b26a00;--bad:#b4232a;
  --chip:#eef1f5;--hl:#fff7e0;--r:6px;--fs:13px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--ink);font:var(--fs)/1.45 -apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",Roboto,Arial,sans-serif}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--acc);text-decoration:none}
.boot{padding:40px;color:var(--ink3)}
/* 布局 */
.shell{display:grid;grid-template-columns:196px 1fr;height:100vh}
.side{background:#1c2128;color:#cfd5dc;display:flex;flex-direction:column;overflow:auto}
.logo{padding:14px 16px 12px;border-bottom:1px solid #2b323b}
.logo b{display:block;color:#fff;font-size:15px;letter-spacing:.5px}
.logo span{font-size:11px;color:#8a95a3}
.nav{padding:8px 0;flex:1}
.nav .grp{font-size:11px;color:#7d8896;padding:10px 16px 4px;text-transform:uppercase;letter-spacing:.6px}
.nav a{display:flex;align-items:center;gap:8px;padding:7px 16px;color:#cfd5dc;border-left:3px solid transparent}
.nav a:hover{background:#252b33}
.nav a.on{background:#2a313a;color:#fff;border-left-color:var(--brand)}
.nav a .n{margin-left:auto;background:var(--brand);color:#fff;border-radius:9px;font-size:11px;padding:0 6px}
.side .me{padding:10px 16px;border-top:1px solid #2b323b;font-size:12px}
.side .me a{color:#9fb0c3;margin-right:10px;cursor:pointer}
.main{overflow:auto;display:flex;flex-direction:column;min-width:0}
.top{display:flex;align-items:center;gap:10px;padding:10px 18px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:5}
.top h1{font-size:16px;margin:0;font-weight:600}
.top .sp{flex:1}
.body{padding:14px 18px 40px}
.menu-btn{display:none}
/* 控件 */
.btn{border:1px solid var(--line);background:#fff;border-radius:var(--r);padding:5px 11px;cursor:pointer;white-space:nowrap}
.btn:hover{border-color:#b9c0c8}
.btn.p{background:var(--brand);border-color:var(--brand);color:#fff}
.btn.p:hover{background:var(--brand2)}
.btn.s{padding:2px 8px;font-size:12px}
.btn.l{border-color:transparent;background:none;color:var(--acc);padding:2px 4px}
.btn.d{color:var(--bad)}
.btn:disabled{opacity:.5;cursor:default}
input.i,select.i,textarea.i{border:1px solid var(--line);border-radius:var(--r);padding:5px 8px;background:#fff;min-width:0}
input.i:focus,select.i:focus,textarea.i:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 2px #1f5fa822}
textarea.i{resize:vertical;min-height:58px}
.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.bar .sp{flex:1}
.bar input.q{width:220px}
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-bottom:12px;flex-wrap:wrap}
.tabs a{padding:7px 14px;color:var(--ink2);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer}
.tabs a.on{color:var(--ink);border-bottom-color:var(--brand);font-weight:600}
/* 表格 */
.tw{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:auto;max-height:calc(100vh - 170px)}
table.t{border-collapse:collapse;width:100%;font-size:12.5px}
.t th{position:sticky;top:0;background:#f7f8fa;color:var(--ink2);font-weight:600;text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap;z-index:1}
.t td{padding:5px 8px;border-bottom:1px solid var(--line2);vertical-align:top}
.t tr:hover td{background:#fafbfc}
.t tr.click{cursor:pointer}
.t td.num,.t th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.t td.nw{white-space:nowrap}
.t td.wrap{white-space:pre-wrap;min-width:180px;max-width:420px}
.t td.mono{font-family:ui-monospace,Consolas,monospace;font-size:12px;white-space:nowrap}
.t tfoot td{font-weight:600;background:#f7f8fa;position:sticky;bottom:0}
.t .muted{color:var(--ink3)}
.empty{padding:28px;text-align:center;color:var(--ink3)}
/* 标签 */
.tag{display:inline-block;padding:0 7px;border-radius:9px;font-size:11.5px;background:var(--chip);color:var(--ink2);white-space:nowrap}
.tag.ok{background:#e3f3ea;color:var(--ok)}
.tag.warn{background:#fdf0dc;color:var(--warn)}
.tag.bad{background:#fbe5e6;color:var(--bad)}
.tag.acc{background:#e4edf8;color:var(--acc)}
.tag.must{background:#b4232a;color:#fff}
.tag.int{background:#1f5fa8;color:#fff}
.tag.pot{background:#8a929c;color:#fff}
/* 卡片 */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:10px;margin-bottom:14px}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px}
.card .k{color:var(--ink2);font-size:12px}
.card .v{font-size:22px;font-weight:600;margin-top:2px;font-variant-numeric:tabular-nums}
.card .s{color:var(--ink3);font-size:12px;margin-top:2px}
.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin-bottom:12px}
.panel h3{margin:0 0 8px;font-size:13.5px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* 漏斗 */
.funnel{display:grid;grid-template-columns:repeat(9,1fr);gap:4px;margin-bottom:12px}
.funnel .st{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:8px;cursor:pointer;min-width:0}
.funnel .st.on{border-color:var(--brand);box-shadow:inset 0 -3px 0 var(--brand)}
.funnel .st .nm{font-size:11.5px;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.funnel .st .c{font-size:18px;font-weight:600}
.funnel .st .a{font-size:11.5px;color:var(--ink3)}
.bars .row{display:grid;grid-template-columns:70px 1fr 120px;gap:8px;align-items:center;margin:5px 0;font-size:12px}
.bars .track{height:10px;background:var(--line2);border-radius:5px;overflow:hidden}
.bars .fill{height:100%;background:var(--brand)}
/* 弹窗 */
.mask{position:fixed;inset:0;background:#0006;display:flex;align-items:flex-start;justify-content:center;z-index:50;overflow:auto;padding:40px 12px}
.dlg{background:#fff;border-radius:8px;width:min(860px,100%);box-shadow:0 10px 40px #0004}
.dlg.w{width:min(1180px,100%)}
.dlg .hd{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line)}
.dlg .hd b{font-size:14.5px}
.dlg .hd .sp{flex:1}
.dlg .bd{padding:14px 16px}
.dlg .ft{display:flex;gap:8px;justify-content:flex-end;padding:10px 16px;border-top:1px solid var(--line);background:#fafbfc;border-radius:0 0 8px 8px}
.form{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 14px}
.form .f{display:flex;flex-direction:column;gap:3px;min-width:0}
.form .f.full{grid-column:1/-1}
.form label{font-size:12px;color:var(--ink2)}
.form label em{color:var(--bad);font-style:normal}
.form .hint{font-size:11.5px;color:var(--ink3)}
.toast{position:fixed;right:18px;bottom:18px;background:#1c2128;color:#fff;padding:9px 14px;border-radius:var(--r);z-index:99;max-width:420px;box-shadow:0 4px 18px #0004}
.toast.err{background:var(--bad)}
/* 登录 */
.login{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#1c2128,#2c3540)}
.login .box{background:#fff;border-radius:10px;padding:26px 28px;width:340px}
.login h2{margin:0 0 4px;font-size:18px}
.login p{margin:0 0 16px;color:var(--ink3);font-size:12px}
.login .i{width:100%;margin-bottom:10px;padding:8px 10px}
.login .btn{width:100%;padding:8px}
.login .lang{text-align:right;margin-top:10px;font-size:12px}
/* 日历 */
.due-over td{background:#fff3f3}
.chk{width:16px;height:16px;cursor:pointer}
.note{color:var(--ink3);font-size:12px;margin:6px 0}
.kv{display:grid;grid-template-columns:110px 1fr;gap:4px 10px;font-size:12.5px}
.kv div:nth-child(odd){color:var(--ink2)}
.sum{font-weight:600}
@media (max-width:900px){
  .shell{grid-template-columns:1fr}
  .side{position:fixed;inset:0 30% 0 0;z-index:40;transform:translateX(-100%);transition:transform .2s}
  .side.open{transform:none}
  .menu-btn{display:inline-block}
  .form{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
  .funnel{grid-template-columns:repeat(3,1fr)}
  .body{padding:12px}
  .bar input.q{width:100%}
}
@media print{.side,.top,.bar{display:none}.shell{display:block}}
