*{box-sizing:border-box}
body{margin:0;font:14px/1.6 "Microsoft YaHei","PingFang SC",Arial,sans-serif;background:#f4f6f9;color:#263238}
a{color:#1565c0;text-decoration:none}
code{font-family:Consolas,Monaco,monospace;background:#eceff1;padding:1px 5px;border-radius:4px;font-size:12.5px}
code.key{background:#fff8e1;color:#e65100;font-weight:600;letter-spacing:.5px}

.topbar{background:#17365d;color:#fff;padding:12px 22px;display:flex;align-items:center;justify-content:space-between}
.brand{font-size:18px;font-weight:700}
.brand span{font-weight:400;opacity:.75;font-size:14px;margin-left:6px}
.top-right{display:flex;align-items:center;gap:12px}

.wrap{max-width:1180px;margin:0 auto;padding:18px 20px 60px}
.wrap.narrow{max-width:760px}
.narrow-panel{max-width:420px}

.nav{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 18px}
.nav a{padding:8px 14px;border-radius:8px;background:#fff;color:#37474f;border:1px solid #dfe6ec}
.nav a.active{background:#1565c0;color:#fff;border-color:#1565c0}

h2{margin:18px 0 14px;font-size:20px;color:#17365d}
h3{margin:0 0 12px;font-size:15px;color:#37474f}

.alert{padding:11px 14px;border-radius:8px;margin-bottom:16px}
.alert-ok{background:#e8f5e9;color:#2e7d32;border:1px solid #c8e6c9}
.alert-error{background:#ffebee;color:#c62828;border:1px solid #ffcdd2}

.panel{background:#fff;border:1px solid #e3e9f0;border-radius:12px;padding:18px;margin-bottom:18px}
.panel-head{margin-bottom:12px}

.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-bottom:18px}
.stat{background:#fff;border:1px solid #e3e9f0;border-radius:12px;padding:16px;text-align:center}
.stat b{display:block;font-size:26px;color:#17365d;line-height:1.3}
.stat span{font-size:12.5px;color:#78909c}
.stat.green b{color:#2e7d32}.stat.red b{color:#c62828}
.stat.orange b{color:#ef6c00}.stat.blue b{color:#1565c0}.stat.gray b{color:#607d8b}

table.grid{width:100%;border-collapse:collapse;background:#fff;font-size:13px}
table.grid th{background:#f5f7fa;text-align:left;padding:9px 10px;border-bottom:2px solid #e3e9f0;white-space:nowrap;color:#455a64}
table.grid td{padding:8px 10px;border-bottom:1px solid #eef2f6;vertical-align:middle}
table.grid tr:hover td{background:#fafcfd}
table.kv th{width:140px;text-align:left;color:#607d8b;font-weight:400;padding:7px 0}
table.kv td{padding:7px 0}
.nowrap{white-space:nowrap}
.small{font-size:12px}
.muted{color:#90a4ae}

.tag{display:inline-block;padding:2px 8px;border-radius:20px;font-size:12px}
.tag.ok{background:#e8f5e9;color:#2e7d32}
.tag.bad{background:#ffebee;color:#c62828}
.tag.warn{background:#fff8e1;color:#ef6c00}

.btn{display:inline-block;padding:7px 14px;border:1px solid #cfd8dc;background:#fff;color:#37474f;
     border-radius:8px;cursor:pointer;font-size:13px;font-family:inherit}
.btn:hover{border-color:#90a4ae}
.btn.primary{background:#1565c0;border-color:#1565c0;color:#fff}
.btn.danger{background:#c62828;border-color:#c62828;color:#fff}
.btn.small{padding:5px 11px;font-size:12.5px}
.btn.tiny{padding:3px 9px;font-size:12px}
.btn.block{width:100%;padding:11px;font-size:15px}

.inline-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.inline-form label{display:flex;flex-direction:column;font-size:12px;color:#607d8b;gap:4px}
input,select{padding:7px 9px;border:1px solid #cfd8dc;border-radius:7px;font-family:inherit;font-size:13.5px;background:#fff}
input:focus,select:focus{outline:none;border-color:#1565c0}
form label{display:block;margin:10px 0 4px;font-size:13px;color:#546e7a;display:block}
form label+input{display:block;width:100%}
form input:not([type=checkbox]){display:block;width:100%;margin-bottom:4px}

.bulk-bar{display:flex;gap:8px;align-items:center;margin:6px 0 12px;flex-wrap:wrap}

.pager{margin-top:14px;display:flex;gap:6px;flex-wrap:wrap}
.pager a{padding:4px 10px;border:1px solid #cfd8dc;border-radius:6px;background:#fff;font-size:12.5px}
.pager a.active{background:#1565c0;color:#fff;border-color:#1565c0}

.login-box{max-width:380px;margin:70px auto;background:#fff;padding:26px;border-radius:14px;
           border:1px solid #e3e9f0;box-shadow:0 6px 24px rgba(23,54,93,.08)}
.login-box h2{margin:0 0 4px;font-size:21px}
.login-box .small{margin-top:14px}

.foot{text-align:center;color:#90a4ae;font-size:12px;padding:16px 0 26px}