:root { --bg:#f4f5f7; --card:#fff; --line:#e3e6ea; --txt:#2b2f36; --sub:#7a8290; --blue:#2563eb; --green:#16a34a; --red:#dc2626;
        --side-w:224px; --navy:#0d2136; --navy2:#122a44; }
* { box-sizing: border-box; }
body { margin:0; font-family:-apple-system,"PingFang SC","Microsoft YaHei",sans-serif; background:var(--bg); color:var(--txt); font-size:14px; }

/* ===== 左侧侧边栏（深藏青 · 企微风格） ===== */
.sidebar { position:fixed; left:0; top:0; bottom:0; width:var(--side-w); z-index:20;
  display:flex; flex-direction:column; background:var(--navy); color:#cfd8e3; }
.brand { display:flex; align-items:center; gap:10px; padding:16px 18px; border-bottom:1px solid rgba(255,255,255,.08); }
.brand-mark { width:32px; height:32px; flex:none; display:grid; place-items:center; border-radius:8px;
  font-size:16px; font-weight:700; color:#0d2136; background:linear-gradient(135deg,#7ee0c3,#3ec6a0); }
.brand-title { color:#fff; font-size:16.5px; font-weight:700; letter-spacing:.5px; }
.side-nav { flex:1; overflow-y:auto; padding:10px 0; }
.side-nav a { display:flex; align-items:center; gap:12px; padding:13px 20px;
  color:#e8eef5; text-decoration:none; font-size:15.5px; transition:background .15s; }
.side-nav a .ni { font-style:normal; font-size:16px; width:20px; text-align:center; opacity:.9; }
.side-nav a:hover { background:rgba(255,255,255,.06); }
.side-nav a.active { background:var(--navy2); color:#fff; font-weight:600; box-shadow:inset 3px 0 0 #3ec6a0; }
.side-foot { padding:14px 18px 18px; border-top:1px solid rgba(255,255,255,.08); display:flex; align-items:center; justify-content:space-between; }
.side-foot .role { background:rgba(62,198,160,.15); color:#7ee0c3; padding:3px 11px; border-radius:20px; font-size:11.5px; letter-spacing:1px; }
.side-foot .logout { color:#8fa3b8; text-decoration:none; font-size:12.5px; transition:color .18s; }
.side-foot .logout:hover { color:#fff; }

/* ===== 主内容区 ===== */
.container { max-width:1240px; margin:24px 40px 40px calc(var(--side-w) + 32px); padding:0 16px; }
@media (max-width: 900px) {
  .sidebar { position:static; width:auto; flex-direction:row; align-items:flex-start; flex-wrap:wrap; padding:0 12px; }
  .side-nav { display:flex; flex-wrap:wrap; padding:8px 4px; }
  .nav-group { width:auto; }
  .nav-group .sub { display:flex; flex-wrap:wrap; }
  .side-foot { border:none; padding:8px; }
  .container { margin:20px 12px; }
}
.flash { padding:9px 14px; border-radius:8px; margin-bottom:12px; }
.flash.ok { background:#dcfce7; color:#166534; }
.flash.error { background:#fee2e2; color:#991b1b; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px 18px; margin-bottom:16px; }
.card h3 { margin:0 0 12px; font-size:15px; }
.muted { color:var(--sub); font-size:12.5px; }
.grid { display:grid; gap:12px; }
.g4 { grid-template-columns:repeat(4,1fr); }
.stat { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:14px; }
.stat b { font-size:22px; display:block; }
.stat.done b { color:var(--green); } .stat.miss b { color:var(--red); }
table.list { border-collapse:collapse; width:100%; background:#fff; }
table.list tr.hl td { background:#f0fdf4; }
table.list th, table.list td { border:1px solid var(--line); padding:6px 8px; text-align:center; white-space:nowrap; }
table.list th { background:#eef2f7; font-weight:600; }
/* 规则/口径说明表：允许换行，自动适配宽度 */
table.list.rules { table-layout:fixed; }
table.list.rules th, table.list.rules td { white-space:normal; word-break:break-word; line-height:1.7; text-align:left; vertical-align:top; }
table.list.rules code { background:#eef2f7; border-radius:4px; padding:0 4px; font-size:12.5px; }
.card p, .card li { line-height:1.7; }
.card p.muted, .card li.muted { line-height:1.75; }
.btn { display:inline-block; background:var(--blue); color:#fff; border:none; border-radius:7px; padding:7px 15px; cursor:pointer; font-size:13.5px; text-decoration:none; }
.btn:hover { opacity:.88; }
.btn.gray { background:#64748b; } .btn.green { background:var(--green); } .btn.red { background:var(--red); }
.btn.sm { padding:3px 9px; font-size:12px; }
input[type=text], input[type=number], input[type=password], input[type=month], input[type=file], select {
  padding:6px 9px; border:1px solid var(--line); border-radius:7px; font-size:13.5px; }
input.narrow { width:90px; }
.row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.tablewrap { overflow:auto; max-height:600px; border:1px solid var(--line); border-radius:8px; }
.tablewrap table th { position:sticky; top:0; }
.pos-badge { display:inline-block; background:#e0e7ff; color:#3730a3; border-radius:5px; padding:1px 7px; font-size:12px; margin:1px; }
hr.sep { border:none; border-top:1px dashed var(--line); margin:14px 0; }