:root{
  --bg:#f4f6f9; --card:#fff; --ink:#12203a; --muted:#5d6b84; --line:#dfe5ee;
  --accent:#1f5fd6; --accent-dark:#17489f;
  --ok:#137a4a; --ok-bg:#e3f5eb; --warn:#8a5a00; --warn-bg:#fdf2d8;
  --bad:#a32b2b; --bad-bg:#fbe6e6; --new:#4c5a73; --new-bg:#eceff5;
  --mono:"Cascadia Mono",Consolas,"SF Mono",Menlo,monospace;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:15px/1.5 "Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
h1,h2,h3{margin:0;font-weight:650;letter-spacing:-.01em}
p{margin:0}

/* --- шапка --- */
.topbar{background:#12203a;color:#fff;padding:20px 0 22px;margin-bottom:26px}
.brand{display:flex;gap:16px;align-items:center}
.logo{
  width:46px;height:46px;border-radius:11px;background:var(--accent);
  display:grid;place-items:center;font-weight:700;font-size:16px;letter-spacing:.04em;flex:none;
}
.topbar h1{font-size:20px}
.topbar p{color:#9fb0cd;font-size:13.5px;margin-top:3px}

/* --- карточки --- */
.card{
  background:var(--card);border:1px solid var(--line);border-radius:14px;
  padding:22px 24px;margin-bottom:18px;
}
.card-head{display:flex;gap:14px;align-items:flex-start;margin-bottom:16px}
.card-head.tight{margin-bottom:12px}
.card-head>div:first-of-type{flex:1;min-width:0}
.card-head h2{font-size:16.5px}
.sub{color:var(--muted);font-size:13.5px;margin-top:4px}
.step{
  width:28px;height:28px;border-radius:8px;background:#eaf0fb;color:var(--accent);
  display:grid;place-items:center;font-weight:700;font-size:14px;flex:none;
}
.head-actions{display:flex;gap:8px;flex:none;align-items:center}

/* --- кнопки --- */
.btn{
  border:1px solid var(--line);background:#fff;color:var(--ink);
  padding:9px 16px;border-radius:9px;font:inherit;font-weight:550;cursor:pointer;
  transition:.12s background,.12s border-color,.12s transform;
}
.btn:hover:not(:disabled){background:#f2f5fa;border-color:#c6d2e4}
.btn:active:not(:disabled){transform:translateY(1px)}
.btn:disabled{opacity:.5;cursor:not-allowed}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover:not(:disabled){background:var(--accent-dark);border-color:var(--accent-dark)}
.btn.big{padding:14px 30px;font-size:16px;border-radius:11px}
.btn.small{padding:6px 12px;font-size:13px}
.btn.ghost{background:transparent}

/* --- зона загрузки --- */
.dropzone{
  border:2px dashed #c7d3e6;border-radius:12px;padding:26px;text-align:center;
  color:var(--muted);cursor:pointer;transition:.12s;background:#fbfcfe;margin-bottom:16px;
}
.dropzone:hover,.dropzone.over{border-color:var(--accent);background:#f3f7fe}
.dropzone b{color:var(--ink)}
.hint{font-size:12.5px;color:#8494ad;margin-top:5px}

/* --- таблицы --- */
.tablebox{overflow-x:auto;border:1px solid var(--line);border-radius:11px}
table{width:100%;border-collapse:collapse;font-size:13.5px}
th{
  text-align:left;font-weight:600;color:var(--muted);background:#f7f9fc;
  padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;font-size:12.5px;
}
td{padding:10px 12px;border-bottom:1px solid #eef2f7;vertical-align:top}
tr:last-child td{border-bottom:none}
tbody tr:hover{background:#fafbfe}
.num{text-align:right}
td.num{font-variant-numeric:tabular-nums}
.empty{text-align:center;color:var(--muted);padding:26px}
.fname{font-weight:550}
.fmt{
  font:11px/1 var(--mono);color:var(--muted);background:#eef2f7;
  padding:3px 6px;border-radius:4px;margin-left:7px;text-transform:uppercase;
}
.detail{color:var(--muted);font-size:12.5px}
.matched{color:var(--muted);font-size:12.5px;display:block;margin-top:2px}
.rowsum{margin-top:12px;font-size:13.5px;color:var(--muted)}
.rowsum b{color:var(--ink)}

/* --- бейджи --- */
.badge{
  display:inline-block;padding:3px 9px;border-radius:20px;
  font-size:12px;font-weight:600;white-space:nowrap;
}
.badge.ok{background:var(--ok-bg);color:var(--ok)}
.badge.warn{background:var(--warn-bg);color:var(--warn)}
.badge.bad{background:var(--bad-bg);color:var(--bad)}
.badge.new{background:var(--new-bg);color:var(--new)}
.tag{
  font-size:11px;font-weight:600;color:var(--accent);background:#eaf0fb;
  padding:2px 7px;border-radius:5px;margin-left:6px;
}

/* --- ведомость --- */
.filerow{
  display:flex;align-items:center;gap:14px;padding:14px 16px;
  border:1px solid var(--line);border-radius:11px;background:#fbfcfe;
}
.filerow .big-num{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums}

/* --- правила --- */
.rules{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.rule{
  display:flex;gap:12px;padding:15px 16px;border:1px solid var(--line);
  border-radius:11px;cursor:pointer;transition:.12s;align-items:flex-start;
}
.rule:hover{border-color:#c6d2e4;background:#fafbfe}
.rule:has(input:checked){border-color:var(--accent);background:#f3f7fe}
.rule input{margin-top:3px;accent-color:var(--accent);flex:none}
.rule b{display:block;font-size:14.5px}
.rule span{display:block;color:var(--muted);font-size:13px;margin-top:3px}
.rule select{
  margin-top:9px;padding:7px 10px;border:1px solid var(--line);border-radius:8px;
  font:inherit;font-size:13px;background:#fff;max-width:100%;
}
.templates{
  display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px;
  padding-top:14px;border-top:1px solid var(--line);
}
.templates>div{display:flex;flex-direction:column;gap:3px}
.templates span{font-size:12.5px;color:var(--muted)}
.templates b{font-size:13.5px;font-weight:550}

/* --- запуск --- */
.runbar{display:flex;align-items:center;gap:16px;margin:22px 0 18px}
.runhint{color:var(--muted);font-size:13.5px}

/* --- прогресс --- */
.pct{font-size:22px;font-weight:700;font-variant-numeric:tabular-nums;color:var(--accent)}
.bar{height:8px;background:#e8edf5;border-radius:5px;overflow:hidden;margin-bottom:14px}
.bar-fill{height:100%;width:0;background:var(--accent);border-radius:5px;transition:width .25s}
.log{
  margin:0;padding:14px 16px;background:#0f1a2e;color:#c8d6ee;border-radius:10px;
  font:12.5px/1.65 var(--mono);max-height:290px;overflow-y:auto;white-space:pre-wrap;
  word-break:break-word;
}
.log .g{color:#6ee7a8}
.log .y{color:#ffd98a}
.log .r{color:#ff9d9d}

/* --- статистика --- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:17px 19px}
.stat .k{font-size:12.5px;color:var(--muted)}
.stat .v{font-size:25px;font-weight:700;font-variant-numeric:tabular-nums;margin-top:5px;letter-spacing:-.02em}
.stat .n{font-size:12.5px;color:var(--muted);margin-top:3px}
.stat.accent .v{color:var(--accent)}
.stat.good .v{color:var(--ok)}

/* --- скачивание --- */
.downloads{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.dl{
  display:flex;align-items:center;gap:13px;padding:15px 17px;border:1px solid var(--line);
  border-radius:11px;text-decoration:none;color:inherit;transition:.12s;background:#fbfcfe;
}
.dl:hover{border-color:var(--accent);background:#f3f7fe}
.dl .ico{
  width:40px;height:40px;border-radius:9px;display:grid;place-items:center;
  font-weight:700;font-size:11px;color:#fff;flex:none;
}
.dl .ico.x{background:#1d6f42}
.dl .ico.w{background:#1f5fd6}
.dl b{display:block;font-size:14px}
.dl span{display:block;color:var(--muted);font-size:12.5px;margin-top:2px}

/* --- фильтры --- */
.filters{display:flex;gap:7px;flex:none;flex-wrap:wrap}
.chip{
  border:1px solid var(--line);background:#fff;padding:6px 13px;border-radius:20px;
  font:inherit;font-size:12.5px;font-weight:550;cursor:pointer;color:var(--muted);
}
.chip:hover{background:#f2f5fa}
.chip.on{background:#12203a;border-color:#12203a;color:#fff}

/* --- модальное окно --- */
.modal{position:fixed;inset:0;background:rgba(12,22,42,.55);display:grid;place-items:center;z-index:50;padding:24px}
.modal-box{background:#fff;border-radius:14px;max-width:760px;width:100%;max-height:82vh;display:flex;flex-direction:column}
.modal-head{display:flex;align-items:center;gap:14px;padding:18px 22px;border-bottom:1px solid var(--line)}
.modal-head h3{flex:1;font-size:16px}
.modal-body{padding:20px 22px;overflow-y:auto;font-size:13.5px}
.modal-body dt{font-size:12.5px;color:var(--muted);margin-top:14px}
.modal-body dt:first-child{margin-top:0}
.modal-body dd{margin:3px 0 0}
.modal-body .src{font:12px var(--mono);color:var(--muted)}
.offers{width:100%;margin-top:6px}
.offers td{padding:6px 8px;font-size:13px}
.link{color:var(--accent);cursor:pointer;text-decoration:underline;text-underline-offset:2px}

.foot{color:var(--muted);font-size:13px;padding:8px 24px 40px;max-width:1180px}
.hidden{display:none!important}

@media (max-width:900px){
  .stats,.rules,.downloads,.templates{grid-template-columns:1fr}
  .card-head{flex-wrap:wrap}
  .head-actions{width:100%}
}