:root{
  --bg:#f5f6f8; --card:#fff; --ink:#1c2530; --muted:#6b7785; --line:#e3e7ec;
  --brand:#1f5fa6; --brand-d:#174a82; --ok:#1c8a5a; --ok-bg:#e7f6ee;
  --warn:#b9770a; --warn-bg:#fdf3e0; --pri:#7a3fb0; --pri-bg:#f1e9f8;
}
*{box-sizing:border-box}
body{margin:0;font:14px/1.45 -apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:var(--bg);color:var(--ink)}
header.top{background:var(--brand);color:#fff;padding:12px 20px;display:flex;align-items:center;gap:20px}
header.top h1{font-size:16px;margin:0;font-weight:600}
header.top nav a{color:#dce8f5;text-decoration:none;margin-right:16px;font-weight:500}
header.top nav a.active,header.top nav a:hover{color:#fff;text-decoration:underline}
.wrap{max-width:1280px;margin:0 auto;padding:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:18px;margin-bottom:18px}
h2{font-size:18px;margin:0 0 4px}
.sub{color:var(--muted);margin:0 0 16px}
table{border-collapse:collapse;width:100%}
th,td{text-align:left;padding:7px 9px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-weight:600}
tr:hover td{background:#fafbfc}
input,select{font:inherit;padding:5px 7px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink)}
input[type=number]{width:78px}
input.s{width:64px}
button{font:inherit;font-weight:600;border:0;border-radius:6px;padding:6px 12px;cursor:pointer;background:var(--brand);color:#fff}
button:hover{background:var(--brand-d)}
button.ghost{background:#eef1f4;color:var(--ink)}
button.ghost:hover{background:#e3e7ec}
button.sm{padding:4px 9px;font-size:13px}
.badge{display:inline-block;padding:2px 8px;border-radius:20px;font-size:12px;font-weight:600}
.badge.pri{background:var(--pri-bg);color:var(--pri)}
.badge.ok{background:var(--ok-bg);color:var(--ok)}
.badge.warn{background:var(--warn-bg);color:var(--warn)}
.muted{color:var(--muted)}
.row{display:flex;gap:18px;align-items:flex-start}
.col-list{flex:0 0 420px;max-height:74vh;overflow:auto}
.col-detail{flex:1}
.serie{padding:9px 11px;border:1px solid var(--line);border-radius:8px;margin-bottom:7px;cursor:pointer;background:#fff}
.serie:hover{border-color:var(--brand)}
.serie.sel{border-color:var(--brand);box-shadow:0 0 0 2px #dce8f5}
.serie .k{font-weight:600}
.serie .meta{font-size:12px;color:var(--muted);margin-top:2px}
.toolbar{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.toast{position:fixed;bottom:20px;right:20px;background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px;opacity:0;transition:.2s;pointer-events:none}
.toast.show{opacity:1}
.dirty{outline:2px solid var(--warn)}
.right{text-align:right}
.nowrap{white-space:nowrap}
