:root {
  --bg: #f5f6f8; --card: #fff; --text: #1f2328; --muted: #667085; --line: #d0d5dd;
  --brand: #1d4ed8; --brand-text: #fff; --warn: #b45309; --bad: #b42318; --ok: #067647;
  --formula: #f2f6ff; --mine: #fffbe6;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body { background: var(--bg); color: var(--text); font: 14px/1.5 -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif; }
.hidden { display: none !important; }
button, input, select { font: inherit; }
button { border: 1px solid var(--line); background: var(--card); border-radius: 6px; padding: 5px 12px; cursor: pointer; color: var(--text); }
button.primary { background: var(--brand); color: var(--brand-text); border-color: var(--brand); }
button.danger { background: var(--bad); color: #fff; border-color: var(--bad); }
button.link { border: 0; background: none; color: var(--brand); padding: 4px 6px; }
button:disabled { opacity: .5; cursor: default; }
input, select { border: 1px solid var(--line); border-radius: 6px; padding: 5px 8px; background: #fff; min-width: 0; }

.login { min-height: 100%; display: flex; align-items: center; justify-content: center; padding: 16px; }
.card { background: var(--card); padding: 24px; border-radius: 10px; width: 100%; max-width: 340px; display: flex; flex-direction: column; gap: 12px; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.card h1 { margin: 0 0 4px; font-size: 20px; }
.card label { display: flex; flex-direction: column; gap: 4px; color: var(--muted); }
.msg { color: var(--bad); min-height: 1.5em; margin: 0; }

#main { display: flex; flex-direction: column; height: 100vh; height: 100dvh; }
.bar { display: flex; align-items: center; gap: 10px; padding: 6px 12px; background: var(--card); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.title { font-size: 15px; }
.who { color: var(--muted); font-size: 13px; }
.tabs { display: flex; gap: 2px; flex-wrap: wrap; }
.tab { border: 0; background: none; padding: 5px 10px; border-radius: 6px; }
.tab.on { background: #e8eefc; color: var(--brand); font-weight: 600; }
.grow { flex: 1; }
.page { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: 8px 12px; overflow: auto; }
#page-sheet { overflow: hidden; }
.page:not(#page-sheet) > * { flex-shrink: 0; }  /* 设置等页面的列表不要被压扁，整页滚动 */
.tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 6px; }
.tools input[type=search] { width: 220px; max-width: 100%; }
.chk { display: inline-flex; gap: 4px; align-items: center; white-space: nowrap; }
.status { font-size: 12px; color: var(--muted); min-height: 18px; }
.status.bad { color: var(--bad); }
#grid { flex: 1; min-height: 200px; background: #fff; border: 1px solid var(--line); }
.drop { position: fixed; inset: 12px; border: 3px dashed var(--brand); background: rgba(29,78,216,.08); display: flex; align-items: center; justify-content: center; font-size: 20px; color: var(--brand); z-index: 50; pointer-events: none; border-radius: 12px; padding: 16px; text-align: center; }

.tabulator { font-size: 13px; }
.tabulator .tabulator-header .tabulator-col .tabulator-col-title { white-space: normal; line-height: 1.25; }
.tabulator-col .col-letter { color: var(--muted); font-weight: 400; font-size: 11px; display: block; }
.tabulator-cell.f { background: var(--formula); }
.tabulator-cell.num { text-align: right; }
.tabulator-cell.err { color: var(--bad); }
.tabulator-cell.flash { animation: flash 1.6s ease-out; }
@keyframes flash { from { background: #fde68a; } }
.tabulator-row .tabulator-cell.rn { color: var(--muted); cursor: pointer; text-decoration: underline dotted; }
.tabulator .tabulator-cell input { width: 100%; height: 100%; border: 0; border-radius: 0; padding: 2px 4px; }

h2 { font-size: 16px; margin: 18px 0 4px; }
.hint { color: var(--muted); margin: 0 0 8px; font-size: 13px; max-width: 900px; }
.row-form { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.row-form input:not([type=file]) { width: 160px; }
.list { background: #fff; border: 1px solid var(--line); border-radius: 8px; overflow: auto; max-width: 100%; }
.list table { border-collapse: collapse; width: 100%; font-size: 13px; }
.list th, .list td { border-bottom: 1px solid #eef0f3; padding: 5px 8px; text-align: left; vertical-align: top; white-space: nowrap; }
.list td.wrap { white-space: normal; min-width: 180px; }
.list th { background: #f8f9fb; position: sticky; top: 0; }
.list .empty { padding: 16px; color: var(--muted); }
.list:empty { display: none; }
.list td button.link { padding: 0 6px; line-height: inherit; }

.pod-sum { display: flex; gap: 12px; flex-wrap: wrap; margin: 6px 0 10px; }
.kpi { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 10px 16px; min-width: 160px; }
.kpi .k { color: var(--muted); font-size: 12px; }
.kpi .v { font-size: 24px; font-weight: 600; }
.chart { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 8px; margin-bottom: 10px; }
.chart svg { width: 100%; height: 220px; display: block; }
.chart .bar-rect { fill: #93b4f5; }
.chart .bar-rect.sel { fill: var(--brand); }
.chart text { font-size: 10px; fill: var(--muted); }

dialog { border: 0; border-radius: 10px; padding: 16px; width: min(760px, calc(100vw - 32px)); max-height: 80vh; }
dialog::backdrop { background: rgba(0,0,0,.3); }
#dlgBody { max-height: 60vh; overflow: auto; margin-bottom: 10px; }
#dlgBody h3 { margin: 10px 0 4px; font-size: 14px; }
#dlgBody ul { margin: 0; padding-left: 18px; }
#dlgBody .warn { color: var(--warn); }
#dlgBody .bad { color: var(--bad); }
#dlgBody .ok { color: var(--ok); }

@media (max-width: 640px) {
  .bar { padding: 6px 8px; gap: 6px; }
  .who { display: none; }
  .page { padding: 6px 8px; }
  .tools input[type=search] { width: 100%; }
  .row-form input:not([type=file]), .row-form select { width: 100%; }
}

/* 第 10 项：到期提醒、去官网查 */
.due-btn b{display:inline-block;min-width:1.4em;padding:0 4px;margin-left:4px;border-radius:9px;background:#c62828;color:#fff;font-weight:600}
.due-btn.on{background:#c62828;color:#fff;border-color:#c62828}
.due-btn.on b{background:#fff;color:#c62828}
.tabulator-cell.due{background:#fdecea!important;color:#b71c1c}
a.trk{float:right;margin-left:6px;padding:0 4px;border-radius:3px;font-size:12px;color:#1565c0;text-decoration:none;border:1px solid #90caf9;line-height:16px;background:#fff}
a.trk:hover{background:#e3f2fd}
.row-form input.wide{flex:1 1 320px;min-width:200px}
#noSite a{cursor:pointer;margin-right:10px;white-space:nowrap}