/* ── Темы: тёмная (по умолчанию) и светлая ────────────────────────────── */
:root, :root[data-theme="dark"]{
  --bg:#0f1419; --panel:#1a212b; --panel2:#222b38; --line:#2c3744;
  --text:#e6edf3; --muted:#8b97a6; --accent:#3b82f6; --accent2:#2563eb;
  --green:#22c55e; --red:#ef4444; --amber:#f59e0b;
}
:root[data-theme="light"]{
  --bg:#f4f6f9; --panel:#ffffff; --panel2:#eef1f5; --line:#dce1e8;
  --text:#1a212b; --muted:#5f6b7a; --accent:#2563eb; --accent2:#1d4ed8;
  --green:#16a34a; --red:#dc2626; --amber:#d97706;
}
:root{ --radius:12px; --sidebar:260px; }

*{box-sizing:border-box}
html{font-size:18px}                         /* базовый шрифт 18px (п.5) */
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,sans-serif;
  background:var(--bg);color:var(--text);display:flex;min-height:100vh;
  font-size:1rem;line-height:1.6;transition:background .2s,color .2s}

/* ── Sidebar ───────────────────────────────────────────────────────────── */
.sidebar{width:var(--sidebar);background:var(--panel);border-right:1px solid var(--line);
  display:flex;flex-direction:column;padding:22px 0;position:sticky;top:0;height:100vh;flex:none}
.brand{font-size:1.35rem;font-weight:700;padding:0 24px 22px;letter-spacing:.5px}
.brand span{color:var(--muted);font-weight:400;font-size:.8rem;margin-left:6px}
.sidebar nav{display:flex;flex-direction:column;gap:3px;padding:0 14px;overflow-y:auto}
.sidebar nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;
  color:var(--muted);text-decoration:none;font-weight:500;font-size:.95rem;
  transition:background .15s,color .15s}
.sidebar nav a:hover{background:var(--panel2);color:var(--text)}
.sidebar nav a.on{background:var(--accent);color:#fff}
.sidebar nav a svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;flex:none}
.foot{margin-top:auto;padding:18px 24px 0;color:var(--muted);font-size:.72rem}

/* переключатель темы */
.theme-btn{margin:14px 14px 0;display:flex;align-items:center;gap:10px;padding:11px 14px;
  border-radius:10px;background:var(--panel2);border:1px solid var(--line);color:var(--text);
  cursor:pointer;font-size:.9rem;font-weight:500;width:calc(100% - 28px)}
.theme-btn:hover{border-color:var(--accent)}
.theme-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}

/* мобильный бургер */
.burger{display:none;position:fixed;top:14px;left:14px;z-index:50;background:var(--panel);
  border:1px solid var(--line);border-radius:10px;padding:10px;cursor:pointer;color:var(--text)}
.burger svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* ── Layout (full-width, п.1) ─────────────────────────────────────────── */
.content{flex:1;min-width:0;width:100%}
.topbar{padding:26px 36px;border-bottom:1px solid var(--line)}
.topbar h1{margin:0;font-size:1.55rem;font-weight:650}
.page{padding:30px 36px;width:100%}            /* без max-width — на весь экран */

/* ── Карточки / метрики ───────────────────────────────────────────────── */
.grid{display:grid;gap:18px}
.grid.m{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px}
.metric .label{color:var(--muted);font-size:.85rem;margin-bottom:9px}
.metric .value{font-size:2.1rem;font-weight:700;line-height:1}
.metric .value.green{color:var(--green)} .metric .value.amber{color:var(--amber)}
.metric .value.blue{color:var(--accent)} .metric .value.red{color:var(--red)}
h2.sec{font-size:.9rem;font-weight:600;margin:30px 0 15px;color:var(--muted);
  text-transform:uppercase;letter-spacing:.7px}

/* воронка */
.funnel{display:flex;flex-direction:column;gap:11px}
.funnel .step{display:flex;align-items:center;gap:14px}
.funnel .bar{height:38px;background:linear-gradient(90deg,var(--accent),var(--accent2));
  border-radius:8px;display:flex;align-items:center;padding:0 14px;color:#fff;font-weight:600;min-width:64px}
.funnel .stepname{width:150px;color:var(--muted);flex:none;font-size:.92rem}

/* источники */
.srclist{display:flex;flex-direction:column;gap:8px}
.srcrow{display:flex;align-items:center;gap:14px}
.srcrow .n{width:140px;color:var(--text);font-weight:500;font-size:.92rem}
.srcrow .track{flex:1;height:10px;background:var(--panel2);border-radius:5px;overflow:hidden}
.srcrow .fill{height:100%;background:var(--accent);border-radius:5px}
.srcrow .c{width:52px;text-align:right;color:var(--muted)}

/* таблицы */
table{width:100%;border-collapse:collapse}
table.fixed{table-layout:fixed}
th,td{text-align:left;padding:13px 15px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:600;font-size:.74rem;text-transform:uppercase;letter-spacing:.5px}
tr:hover td{background:var(--panel2)}
table.fixed td{white-space:normal;overflow-wrap:anywhere;word-break:break-word}
.cell-text{line-height:1.55} .cell-sub{margin-top:6px}
/* сортировка-заголовки */
th a.sort{color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;gap:4px;
  cursor:pointer;text-transform:uppercase;font-size:.74rem;letter-spacing:.5px;font-weight:600}
th a.sort:hover{color:var(--text)}
th a.sort.on{color:var(--accent)}
.sarr{font-size:.7rem;line-height:1} .sarr.dim{opacity:.35}
th a.sort:hover .sarr.dim{opacity:.7}
/* адаптив: на мобильном строки таблицы → карточки со столбцами один под другим */
@media (max-width:768px){
  table.respcards thead{display:none}
  table.respcards,table.respcards tbody{display:block;width:100%}
  table.respcards tr{display:block;background:var(--panel);border:1px solid var(--line);
    border-radius:11px;padding:12px 14px;margin-bottom:12px}
  table.respcards tr:hover td{background:transparent}
  table.respcards td{display:block;border:none;padding:7px 0;white-space:normal}
  table.respcards td::before{content:attr(data-label);display:block;font-size:.72rem;
    text-transform:uppercase;letter-spacing:.4px;color:var(--muted);font-weight:600;margin-bottom:3px}
  table.respcards td:empty{display:none}
}
td a{color:var(--accent);text-decoration:none} td a:hover{text-decoration:underline}
.badge{display:inline-block;padding:3px 11px;border-radius:20px;font-size:.78rem;font-weight:600}
.badge.fsu{background:rgba(34,197,94,.16);color:var(--green)}
.badge.remote{background:rgba(59,130,246,.16);color:var(--accent)}
.badge.other{background:rgba(139,151,166,.16);color:var(--muted)}
.badge.undefined{background:rgba(239,68,68,.16);color:var(--red)}
.empty{padding:54px;text-align:center;color:var(--muted)}

/* вкладки */
.tabs{display:flex;gap:9px;margin-bottom:24px;flex-wrap:wrap}
.tabs a{padding:10px 20px;border-radius:10px;background:var(--panel);border:1px solid var(--line);
  color:var(--muted);text-decoration:none;font-weight:600;cursor:pointer;font-size:.92rem}
.tabs a.on{background:var(--accent);color:#fff;border-color:var(--accent)}

/* keyword chips */
.kwgroup{margin-bottom:24px}
.kwgroup h3{font-size:.95rem;margin:0 0 12px;color:var(--text)}
.chips{display:flex;flex-wrap:wrap;gap:9px}
.chip{display:inline-flex;align-items:center;gap:8px;background:var(--panel);border:1px solid var(--line);
  border-radius:20px;padding:6px 7px 6px 15px;font-size:.88rem}
.chip.off{opacity:.45}
.chip form{display:inline;margin:0}
.chip form{display:inline-flex;align-items:center;margin:0}
.chip .x{background:none;border:none;cursor:pointer;color:var(--muted);padding:2px 6px;
  border-radius:50%;display:inline-flex;font-size:.88rem}
.chip .x:hover{background:var(--panel2);color:var(--red)}

/* toggle-переключатель (вкл/выкл слово) */
.switch{position:relative;width:38px;height:21px;border:none;border-radius:20px;
  background:#8a8f98;cursor:pointer;padding:0;transition:background .18s;flex:none}
.switch.on{background:#16d65f}                 /* яркий зелёный во включённом */
.switch .knob{position:absolute;top:2px;left:2px;width:17px;height:17px;border-radius:50%;
  background:#fff;transition:transform .18s;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.switch.on .knob{transform:translateX(17px)}
.addbar{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 22px;margin-top:26px}
.addbar form{display:flex;gap:12px;flex-wrap:wrap;align-items:end}
.addbar label{display:flex;flex-direction:column;gap:6px;font-size:.78rem;color:var(--muted)}
.addbar input,.addbar select{background:var(--bg);border:1px solid var(--line);border-radius:9px;
  padding:10px 13px;color:var(--text);font-size:.95rem;min-width:180px}
.addbar button.add{background:var(--accent);color:#fff;border:none;border-radius:9px;
  padding:11px 22px;font-weight:600;cursor:pointer;height:42px;font-size:.95rem}
.addbar button.add:hover{background:var(--accent2)}
.hint{color:var(--muted);font-size:.86rem;margin:6px 0 0}

/* алгоритм */
.algo svg{width:100%;height:auto;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:12px}
.steps{display:grid;gap:16px;margin-top:26px}
.steps .s{display:flex;gap:18px;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:20px 22px}
.steps .num{width:38px;height:38px;flex:none;border-radius:50%;background:var(--accent);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700}
.steps h3{margin:0 0 7px;font-size:1.05rem} .steps p{margin:0;color:var(--muted);line-height:1.65}
.prose{line-height:1.7}
.prose p{color:var(--text)} .prose b{font-weight:600}

/* адаптивная HTML-схема потока (на мобайле трансформируется в столбец) */
.flow{display:flex;align-items:stretch;gap:0;flex-wrap:wrap;margin:8px 0 4px}
.flow .node{flex:1;min-width:150px;background:var(--panel2);border:1px solid var(--accent);
  border-radius:11px;padding:14px 12px;text-align:center}
.flow .node.green{border-color:var(--green)}
.flow .node .t{font-weight:600;font-size:.95rem}
.flow .node .s{color:var(--muted);font-size:.8rem;margin-top:4px}
.flow .arrow{display:flex;align-items:center;color:var(--accent);font-size:1.3rem;padding:0 6px;flex:none}
@media (max-width:760px){
  .flow{flex-direction:column}
  .flow .node{width:100%}
  .flow .arrow{transform:rotate(90deg);padding:6px 0;align-self:center}
}
.examples2{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px;margin:18px 0}
pre.prompt{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:10px;padding:18px 20px;overflow-x:auto;white-space:pre-wrap;font-size:.88rem;
  line-height:1.6;color:var(--text);font-family:var(--font-mono,ui-monospace,Menlo,monospace)}
.example,.examples2{display:grid;gap:16px;margin:18px 0}
.examples2{grid-template-columns:repeat(4,1fr)}        /* 4 в ряд → 8 примеров = 2 строки */
.example{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.example .card,.examples2 .card{border-left:3px solid var(--line)}
.example .yes,.examples2 .yes{border-left-color:var(--green);background:rgba(34,197,94,.06)}
.example .no,.examples2 .no{border-left-color:var(--red);background:rgba(239,68,68,.05)}
.example .verdict,.examples2 .verdict{font-weight:700;font-size:.82rem;letter-spacing:.4px;margin-bottom:8px}
.example .yes .verdict,.examples2 .yes .verdict{color:var(--green)}
.example .no .verdict,.examples2 .no .verdict{color:var(--red)}
@media (max-width:1100px){.examples2{grid-template-columns:repeat(2,1fr)}}
@media (max-width:600px){.examples2{grid-template-columns:1fr}}

/* ── Адаптив / мобильный (п.1) ────────────────────────────────────────── */
@media (max-width:1100px){ .page{padding:24px} .topbar{padding:22px 24px} }
@media (max-width:768px){
  .burger{display:block}
  .sidebar{position:fixed;left:0;top:0;z-index:40;transform:translateX(-100%);
    transition:transform .25s;box-shadow:0 0 40px rgba(0,0,0,.4)}
  .sidebar.open{transform:translateX(0)}
  .content{width:100%}
  .topbar{padding:20px 18px 20px 64px} .page{padding:18px}
  .grid.m{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
  .srcrow .n{width:100px} .funnel .stepname{width:96px;font-size:.82rem}
  .addbar form{flex-direction:column;align-items:stretch}
  .addbar input,.addbar select{min-width:0;width:100%}
  .pgrid{grid-template-columns:1fr !important}
}
@media (min-width:769px) and (max-width:1100px){
  .pgrid{grid-template-columns:repeat(2,1fr) !important}
}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}

/* кнопки действий в строках заявок */
.btn-act{border:none;border-radius:8px;padding:7px 14px;font-weight:600;cursor:pointer;font-size:.85rem;white-space:nowrap}
.btn-reject{background:rgba(239,68,68,.15);color:var(--red)} .btn-reject:hover{background:var(--red);color:#fff}
.btn-accept{background:rgba(34,197,94,.15);color:var(--green)} .btn-accept:hover{background:var(--green);color:#fff}
.pdf-link{display:inline-flex;align-items:center;gap:5px;color:var(--accent);text-decoration:none;font-size:.85rem;font-weight:500}
.pdf-link:hover{text-decoration:underline}

/* модалка причины */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:100;
  align-items:center;justify-content:center;padding:20px}
.modal-bg.open{display:flex}
.modal{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:26px;
  max-width:500px;width:100%;max-height:90vh;overflow:auto}
.modal h3{margin:0 0 6px;font-size:1.2rem}
.modal .sub{color:var(--muted);font-size:.9rem;margin:0 0 18px}
.modal label{display:block;font-size:.85rem;color:var(--muted);margin:14px 0 6px;font-weight:600}
.modal input,.modal textarea{width:100%;background:var(--bg);border:1px solid var(--line);
  border-radius:9px;padding:11px 13px;color:var(--text);font-size:.95rem;font-family:inherit}
.modal textarea{resize:vertical;line-height:1.5}
.modal .acts{display:flex;gap:10px;margin-top:22px;justify-content:flex-end}
.modal .acts button{border:none;border-radius:9px;padding:11px 22px;font-weight:600;cursor:pointer;font-size:.95rem}
.modal .cancel{background:var(--panel2);color:var(--text);border:1px solid var(--line)}

/* ── TENDER-IT: живая схема конвейера («Логика») ─────────────────────── */
.wfblock{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:20px 22px;margin-bottom:20px}
.wfblock h3{margin:0 0 4px;font-size:1.05rem;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wfblock .cron{color:var(--muted);font-size:.8rem;font-weight:400}
.wfblock .lastrun{color:var(--muted);font-size:.85rem;margin:4px 0 14px}
.stbadge{display:inline-block;padding:2px 10px;border-radius:12px;font-size:.74rem;font-weight:700}
.stbadge.run{background:rgba(245,158,11,.18);color:var(--amber);animation:blink 1.1s infinite}
.stbadge.ok{background:rgba(34,197,94,.16);color:var(--green)}
.stbadge.err{background:rgba(239,68,68,.16);color:var(--red)}
.stbadge.idle{background:rgba(139,151,166,.16);color:var(--muted)}
@keyframes blink{50%{opacity:.45}}
.flow .node.running{border-color:var(--amber);animation:pulse 1.3s infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,.35)}50%{box-shadow:0 0 0 9px rgba(245,158,11,0)}}
.flow.sub .node{min-width:104px;padding:9px 8px}
.flow.sub .node .t{font-size:.8rem;font-weight:500}
.flow.sub .arrow{font-size:1rem;padding:0 4px}
.pipe-arrow{display:flex;justify-content:center;color:var(--accent);font-size:1.5rem;margin:-8px 0 12px}
.prose-ru{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:22px 26px;line-height:1.75;white-space:pre-wrap}
details.orig{margin-top:18px}
details.orig summary{cursor:pointer;color:var(--accent);font-weight:600;padding:8px 0}
details.orig pre{white-space:pre-wrap;background:var(--panel);border:1px solid var(--line);
  border-radius:var(--radius);padding:18px 22px;line-height:1.6;font-family:inherit;font-size:.92rem}
.note-tr{color:var(--muted);font-size:.88rem;margin:8px 0 0}

/* пояснения под счётчиками «Состояние данных» */
.grid.ex{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.grid.ex .metric .value{margin-bottom:12px}
.cnt-hint{color:var(--muted);font-size:.85rem;line-height:1.6;margin:0;
  border-top:1px solid var(--line);padding-top:12px}
.cnt-hint b{color:var(--text);font-weight:600}