/* ============ портал ценообразования — темы ============
   Тёмная — базовая (инструментальная), светлая — по переключателю.
   Палитры совпадают с утверждёнными мокапами design/portal-*.svg. */

:root {
  --bg: #0d1117;
  --panel: #10151f;
  --panel-soft: #5f6f88;
  --panel-heading: #e8ecf3;
  --panel-feat: #c7d1df;
  --feat-check: #5eead4;
  --card: #151b24;
  --card-border: #232b38;
  --ink: #e8ecf3;
  --sub: #9aa4b2;
  --faint: #5d6b7e;
  --accent: #4f7df9;
  --accent-soft: #1d2a44;
  /* фон колонки «заполняете вы» в окне калькулятора: в тёмной теме — тёмная панель,
     в светлой — белая карточка (см. html[data-theme="light"] ниже) */
  --kc-col-bg: #10151f;
  --field: #0d1117;
  --field-border: #30394a;
  --line: #232b38;
  --row-hover: #191f2a;
  --num: #8faeff;
  --brand-tile-bg: #4f7df9;
  --brand-tile-ink: #0b1220;
  --badge-open-t: #3dd68c; --badge-open-b: #0f2e22;
  --badge-grp-t: #93a5ff;  --badge-grp-b: #232e55;
  --badge-me-t: #e8b45a;   --badge-me-b: #33270f;
  --badge-me-hover: #403414;
  /* галка в квадратике «что считаем»: заливка яркая → тёмный знак */
  --modecheck-ink: #0b0f16;
  --danger-t: #f87171;     --danger-b: #3a1a1f;
  /* знаки сравнения с файлом тарифов («Δ, %», разница, часы): плюс — наш дороже (красный),
     минус — дешевле (зелёный). Владелец, 30.09.2026: «Цвета добавляем, так и не реализовали» —
     классы grew/fell в шаблоне были, а правил цвета в CSS не было. */
  --up-t: #f87171;         --down-t: #3dd68c;
  --shadow: transparent;
}

html[data-theme="light"] {
  --bg: #e4ecf7;
  --panel: #16336b;
  --panel-soft: #8fa6d4;
  --panel-heading: #ffffff;
  --panel-feat: #dfe7f5;
  --feat-check: #1d5bd6;
  --card: #f0f6ff;
  --card-border: #d0dded;
  --ink: #0c1527;
  --sub: #4e5d70;
  --faint: #8796ab;
  --accent: #1d5bd6;
  --accent-soft: #dfe9fc;
  /* в светлой теме --panel тёмно-синий (это сайдбар), и колонка калькулятора с ним
     вместе давала тёмные подписи на тёмном фоне и синие цифры на синем: Валера,
     11.09.2026 — «синий что-ли с синими цифрами и ничего не видно» */
  --kc-col-bg: #f0f6ff;
  --field: #f7faff;
  --field-border: #bcc9de;
  --line: #d5e0ee;
  --row-hover: #eaf1fb;
  --num: #1a52c9;
  --brand-tile-bg: #f0f6ff;
  --brand-tile-ink: #1d5bd6;
  --badge-open-t: #047857; --badge-open-b: #d1fae5;
  --badge-grp-t: #4338ca;  --badge-grp-b: #e0e7ff;
  --badge-me-t: #b45309;   --badge-me-b: #fef3c7;
  --badge-me-hover: #f9e9b3;
  /* в светлой теме заливка галочки тёмная (зелёный/синий/янтарный) → знак БЕЛЫЙ,
     иначе чёрная галка сливается с кнопкой (владелец, 27.10.2026) */
  --modecheck-ink: #ffffff;
  --danger-t: #b91c1c;     --danger-b: #fee2e2;
  --up-t: #b91c1c;         --down-t: #047857;
  --shadow: #c9d6e8;
}

/* ── ТЕМА: чего НЕ должен касаться цвет сайдбара (--panel) ──
   В светлой теме --panel — тёмно-синий: это фон САЙДБАРА и блока входа (страница login). Любая
   ШАПКА страницы, покрашенная в --panel, превращается в тёмный прямоугольник на светлом фоне и
   текст на ней не читается. Шапки берут --card: .topbar (портал) и .pub-head (страница по ссылке).
   Владелец, 30.09.2026: «у пользователя на светлом фоне что то с фоном шапке, просто тёмный
   прямоугольник» — .pub-head как раз брал --panel. */

* { box-sizing: border-box; margin: 0; padding: 0; }
/* color-scheme: без него браузер рисует родные элементы (поля поиска, скроллбар, автозаполнение)
   светлыми — на тёмной теме это то самое «белое выделение» (найдено 12.09.2026) */
html { color-scheme: dark; }
html[data-theme="light"] { color-scheme: light; }
/* hidden должен скрывать ВСЕГДА — авторский display (напр. .btn{display:inline-block})
   иначе перебивает встроенное [hidden]{display:none} браузера, и кнопка «не прячется» */
[hidden] { display: none !important; }

html, body { height: 100%; }

body {
  font-family: -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background: var(--bg);
  color: var(--ink);
  font-size: 14.5px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; }
::placeholder { color: var(--faint); }

.mono, .card-status { font-family: ui-monospace, "Cascadia Mono", "Segoe UI Mono", Consolas, "DejaVu Sans Mono", monospace; }

/* ---------- иконки ---------- */
.ic {
  width: 18px; height: 18px; flex: none;
  stroke: currentColor; fill: none;
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}

/* ---------- каркас приложения ---------- */
.app { min-height: 100vh; display: flex; flex-direction: column; }

.topbar {
  height: 64px; flex: none;
  display: flex; align-items: center; gap: 18px;
  padding: 0 20px;
  background: var(--card);
  border-bottom: 1px solid var(--line);
  position: sticky; top: 0; z-index: 20;
}

.brand { display: flex; align-items: center; gap: 11px; text-decoration: none; }
.brand-tile {
  width: 38px; height: 38px; border-radius: 9px; flex: none;
  background: var(--brand-tile-bg); color: var(--brand-tile-ink);
  font-weight: 800; font-size: 20px;
  display: grid; place-items: center;
}
/* плитка логотипа В ШАПКЕ — всегда акцентный синий с белой буквой: раньше она брала
   `--brand-tile-bg`, а в светлой теме это #f0f6ff, ровно цвет фона шапки, — квадрат пропадал,
   оставалась одна буква «T» (владелец, 30.09.2026: «Давай на синем фоне»).
   Переменные --brand-tile-* остаются для страницы входа и страниц ошибок — там плитка лежит на
   тёмно-синей панели, и светлая заливка как раз нужна. */
.topbar .brand-tile { background: var(--accent); color: #fff; }
/* Логотип ОКЦ (27.10.2026): вместо буквы «T» — знак Гормедтехники (гмт, с сайта организации).
   Знак бирюзово-тёмный, поэтому плитка логотипа всегда БЕЛАЯ — и в тёмной, и в светлой теме;
   иначе в шапке он сливается с акцентным синим (проверено кадром). */
.brand-tile img { width: 100%; height: 100%; object-fit: contain; display: block; }
.topbar .brand-tile-logo,
.brand-tile-logo { background: #fff; padding: 3px; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .10); }
.brand-text strong { display: block; font-size: 18px; line-height: 1.1; }
.brand-text small { color: var(--faint); font-size: 11px; }

.topbar-search { margin-left: auto; position: relative; }
.topbar-search .ic { position: absolute; left: 13px; top: 8px; width: 16px; height: 16px; color: var(--faint); }
.topbar-search input {
  width: 230px; height: 34px;
  padding: 0 14px 0 36px;
  border-radius: 17px;
  background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); font-size: 13px; font-family: inherit;
}
.topbar-search input:focus { outline: none; border-color: var(--accent); }

.topbar-right { display: flex; align-items: center; gap: 12px; }

.theme-toggle {
  width: 38px; height: 38px; border-radius: 10px;
  background: transparent; border: 1px solid transparent;
  color: var(--faint); cursor: pointer;
  display: grid; place-items: center;
}
.theme-toggle:hover { background: var(--row-hover); color: var(--ink); }
.ic-sun, .ic-moon { display: none; width: 19px; height: 19px; }
html[data-theme="dark"] .ic-sun { display: block; }
html[data-theme="light"] .ic-moon { display: block; }

.user-chip { display: flex; align-items: center; gap: 10px; padding-left: 4px; }
.avatar {
  width: 34px; height: 34px; border-radius: 50%; flex: none;
  background: var(--accent); color: #fff;
  font-weight: 700; font-size: 12.5px;
  display: grid; place-items: center;
}
.user-meta strong { display: block; font-size: 13.5px; line-height: 1.2; }
.user-meta small { display: block; color: var(--faint); font-size: 11px; }

.logout-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: 0; cursor: pointer;
  color: var(--faint); font-size: 12.5px; font-family: inherit;
}
.logout-btn .ic { width: 15px; height: 15px; }
.logout-btn:hover { color: var(--ink); }

/* ---------- сайдбар ---------- */
.body { flex: 1; display: grid; grid-template-columns: 244px 1fr; min-height: 0; }

.sidebar {
  background: var(--card);
  border-right: 1px solid var(--line);
  padding: 8px 10px 20px;
  display: flex; flex-direction: column; gap: 4px;
  position: sticky; top: 64px; height: calc(100vh - 64px); overflow: hidden;
}
/* меню и служебные пункты прокручиваются ВНУТРИ, погода внизу остаётся на месте */
.sb-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex;
  flex-direction: column; gap: 4px; margin-right: -4px; padding-right: 4px; }

/* ---------- погода в сайдбаре (19.10.2026) ----------
   Только токены темы: в светлой теме тот же блок читается без отдельной вёрстки.
   Мелкий текст — --sub (не --faint: на светлом --faint сливается, проверено макетом). */
.wx { flex: 0 0 auto; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--line);
  font-size: 11.5px; color: var(--sub); line-height: 1.45; }
.wx-top { font-size: 10px; letter-spacing: .4px; text-transform: uppercase; color: var(--faint);
  margin-bottom: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wx-now { display: flex; align-items: center; gap: 7px; }
.wx-ic { width: 22px; height: 22px; flex: none; color: var(--accent); fill: none;
  stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.wx-t { font-size: 21px; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.wx-txt { color: var(--sub); }
.wx-meta { margin-top: 2px; }
.wx-days { display: flex; gap: 8px; margin-top: 7px; }
.wx-day { display: flex; flex-direction: column; align-items: center; line-height: 1.25; }
.wx-day i { font-style: normal; color: var(--faint); }
.wx-day b { color: var(--ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.wx-dic { width: 16px; height: 16px; color: var(--accent); fill: none; stroke: currentColor;
  stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.wx-hrs { margin-top: 7px; }
.wx-hrs summary { cursor: pointer; color: var(--accent); font-size: 11px; }
.wx-hrs-row { display: flex; gap: 9px; margin-top: 4px; }
.wx-h { text-align: center; font-variant-numeric: tabular-nums; }
.wx-h i { font-style: normal; color: var(--faint); display: block; font-size: 10px; }
.wx-h b { color: var(--ink); font-weight: 600; }
.nav-group {
  font-size: 11px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--faint);
  padding: 12px 12px 6px;
}
.nav { display: flex; flex-direction: column; gap: 2px; }
.nav-item {
  display: flex; align-items: center; gap: 12px;
  padding: 9px 12px; border-radius: 9px;
  color: var(--sub); font-size: 14.5px; text-decoration: none;
  box-shadow: none;
}
.nav-item .ic { width: 17px; height: 17px; }
.nav-item:hover { background: var(--row-hover); color: var(--ink); }
.nav-item.active { background: var(--accent-soft); color: var(--ink); font-weight: 700; box-shadow: inset 3px 0 0 var(--accent); }
.nav-divider { margin: 8px 12px; border-top: 1px solid var(--line); }

/* ---------- контент ---------- */
/* контент занимает всю ширину экрана (Валера, 10.09.2026: широкие мониторы — без пустых полей) */
.content { padding: 28px 36px 60px; width: 100%; max-width: none; }
/* 16.10.2026 (общий сторож выравнивания, PLAN-BLOCKS-RIGHTS часть 4): страница НЕ должна
   растягиваться по содержимому. Широкая таблица реестра КП (min-width 1080px в обёртке
   с overflow-x:auto) раздвигала сетку `.body` до scrollWidth потомков — документ уезжал за
   окно (замер: 1898 px при 1600). `overflow-x: clip` на .body режет по краю грида: панель
   таблицы остаётся в окне, а широкая таблица прокручивается ВНУТРИ своей обёртки. */
.body { overflow-x: clip; }

.page-head h1 { font-size: 25px; font-weight: 700; }
.page-head p { margin-top: 5px; color: var(--sub); font-size: 14px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* карточки блоков */
.cards {
  margin-top: 24px;
  display: grid; gap: 24px;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
}
.card {
  display: flex; flex-direction: column; gap: 14px;
  background: var(--card);
  border: 1px solid var(--card-border);
  border-radius: 14px;
  padding: 22px 26px;
  text-decoration: none;
  transition: border-color .15s ease;
}
.card:hover { border-color: var(--accent); }
.card-top { display: flex; align-items: center; gap: 14px; }
.card-icon {
  width: 40px; height: 40px; border-radius: 10px; flex: none;
  background: var(--accent-soft); color: var(--accent);
  display: grid; place-items: center;
}
.card-icon .ic { width: 21px; height: 21px; }
.card h2 { font-size: 16.5px; }
.card-desc { color: var(--sub); font-size: 13.5px; line-height: 1.5; }
.card-foot {
  margin-top: auto; padding-top: 14px;
  border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px;
}
.card-open { color: var(--accent); font-weight: 700; }

.badge {
  margin-left: auto; flex: none;
  padding: 3px 12px; border-radius: 10px;
  font-size: 11.5px; font-weight: 600; white-space: nowrap;
}
.badge.b-grp { color: var(--badge-grp-t); background: var(--badge-grp-b); }
.badge.b-me  { color: var(--badge-me-t);  background: var(--badge-me-b); }
.badge.b-open{ color: var(--badge-open-t);background: var(--badge-open-b); }

/* панели и пустые состояния */
.panel {
  margin-top: 28px;
  background: var(--card);
  border: 1px solid var(--card-border);
  border-radius: 14px;
  padding: 20px 26px;
}
.panel-head { display: flex; justify-content: space-between; align-items: baseline; }
.panel-head h2 { font-size: 16px; }
.muted-link { color: var(--accent); font-size: 13px; font-weight: 600; text-decoration: none; }
.muted-link:hover { text-decoration: underline; }
.empty { padding: 26px 8px 18px; text-align: center; }
.empty p { font-size: 15px; font-weight: 600; }
.empty-sub { margin-top: 6px; color: var(--faint); font-size: 13px; font-weight: 400 !important; max-width: 560px; margin-left: auto; margin-right: auto; }
.empty .btn { margin-top: 20px; }

/* кнопки */
.btn {
  display: inline-block; padding: 12px 18px; border-radius: 9px;
  background: var(--accent); color: #fff;
  font-weight: 700; font-size: 14.5px; font-family: inherit;
  border: 0; cursor: pointer; text-decoration: none;
}
.btn:hover { filter: brightness(1.08); }
.btn-danger { background: var(--danger-t); color: #fff; }
.btn-block { width: 100%; }

/* сообщения */
.msg { margin-bottom: 16px; padding: 11px 16px; border-radius: 10px; font-size: 14px;
       animation: msgIn .3s ease-out; }
@keyframes msgIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.msg-error { background: var(--danger-b); color: var(--danger-t); }
.msg-ok { background: var(--badge-open-b); color: var(--badge-open-t); }
.msg-success { background: var(--badge-open-b); color: var(--badge-open-t); }

/* ============ страница входа ============ */
.login-page { min-height: 100vh; }
.login-wrap { min-height: 100vh; display: grid; grid-template-columns: 640px 1fr; }

.login-brand {
  background: var(--panel);
  padding: 52px 56px;
  display: flex; flex-direction: column;
  position: relative; overflow: hidden;
}
.login-brand .brand-text strong { color: var(--panel-heading); }
.login-brand h1 {
  margin-top: 150px;
  font-size: 44px; line-height: 1.14; font-weight: 700;
  color: var(--panel-heading);
}
.login-org { margin-top: 24px; color: var(--panel-soft); font-size: 16px; }
.login-feats { list-style: none; margin-top: 52px; display: flex; flex-direction: column; gap: 20px; font-size: 16.5px; color: var(--panel-feat); }
.login-feats li { display: flex; align-items: center; gap: 14px; }
.feat-check {
  width: 20px; height: 20px; border-radius: 50%; flex: none;
  border: 1.4px solid var(--panel-soft);
  color: var(--feat-check); font-size: 13px; font-weight: 700;
  display: grid; place-items: center;
}
.login-copy { position: absolute; bottom: 36px; color: var(--panel-soft); font-size: 13px; }

.login-side { position: relative; display: flex; align-items: center; justify-content: center; padding: 40px; }
.login-card {
  width: 420px;
  background: var(--card);
  border: 1px solid var(--card-border);
  border-radius: 14px;
  padding: 36px;
  box-shadow: 0 6px 24px var(--shadow);
}
.login-card h2 { font-size: 24px; }
.login-sub { margin: 6px 0 24px; color: var(--sub); font-size: 14px; }

.form-error, .field-error { border-radius: 9px; padding: 9px 14px; font-size: 13px; color: var(--danger-t); background: var(--danger-b); }
.form-error { margin-bottom: 18px; }
.field-error { margin-top: 6px; }
.field { margin-bottom: 18px; }
.field label { display: block; font-size: 12.5px; font-weight: 700; color: var(--sub); margin-bottom: 7px; }
.field input {
  width: 100%; height: 46px; padding: 0 16px;
  border-radius: 9px;
  background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); font-size: 14.5px; font-family: inherit;
}
.field input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.login-hint { margin-top: 18px; text-align: center; color: var(--faint); font-size: 12px; }
.login-foot { position: absolute; bottom: 22px; color: var(--faint); font-size: 12px; }

/* ============ Оборудование (этап 2) ============ */
.msg-run {
  background: var(--accent-soft); color: var(--num);
  border: 1px solid var(--card-border);
}
.msg-run a { color: var(--accent); font-weight: 600; }

/* верхняя панель: кнопка загрузки + последняя загрузка */
.eq-toolbar {
  display: flex; justify-content: space-between; align-items: center; gap: 18px;
  flex-wrap: wrap;
}
.eq-toolbar .btn { display: inline-flex; align-items: center; gap: 8px; }
.eq-toolbar-note {
  margin-top: 6px; color: var(--badge-me-t); font-size: 11px;
}
.eq-lastload { text-align: right; line-height: 1.35; }
.eq-ll-cap {
  display: block; font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px;
  text-transform: uppercase; color: var(--faint);
}
.eq-ll-main { color: var(--ink); font-size: 12.5px; }
.eq-ll-sub { display: block; color: var(--sub); font-size: 11.5px; }

/* обёртка: левая карточка ID + правая колонка с фильтрами и таблицей */
.eq-wrap { margin-top: 16px; }

/* строка фильтров */
.eq-filters {
  display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap;
  padding: 14px 16px; margin-bottom: 14px;
  background: var(--card); border: 1px solid var(--card-border); border-radius: 12px;
}
.eq-filters-cap {
  align-self: center; margin-right: 4px;
  font-size: 11px; font-weight: 700; letter-spacing: 1.5px;
  text-transform: uppercase; color: var(--faint);
}
.eq-filters-hint { margin-left: auto; align-self: center; color: var(--faint); font-size: 11px; }

/* кастомный дропдаун статуса (мультивыбор) */
.eq-dd-wrap { display: flex; flex-direction: column; gap: 2px; }
.eq-dd-wrap .lbl { display: flex; align-items: center; gap: 6px; }
.eq-dd-wrap .cnt {
  background: var(--accent); color: #fff; border-radius: 8px;
  font-size: 9.5px; padding: 0 6px; line-height: 14px;
}
.eq-dd { position: relative; }
.eq-dd-btn {
  display: flex; align-items: center; gap: 10px;
  min-width: 208px; height: 40px; padding: 0 12px; cursor: pointer;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-family: inherit; text-align: left;
}
.eq-dd-btn:hover { border-color: var(--accent); }
/* 18.09.2026: подпись фильтра со множественным выбором — как подписи у КЖЦ/АИП,
   иначе «СТАТУС» рисовался браузерным шрифтом 13px и слипался со значением */
.eq-dd-btn .lbl {
  display: flex; align-items: center; gap: 6px;
  font-size: 10px; letter-spacing: .7px; color: var(--faint);
  text-transform: uppercase; font-weight: 700;
}
.eq-dd-btn .cnt {
  background: var(--accent); color: #fff; border-radius: 8px;
  font-size: 9.5px; padding: 0 6px; line-height: 14px; letter-spacing: 0;
}
.eq-dd-btn .val {
  font-size: 12.5px; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eq-dd-btn::after {
  content: ""; position: absolute; right: 12px; top: 50%; margin-top: -2px;
  border: 5px solid transparent; border-top-color: var(--sub);
}
.eq-dd-panel {
  display: none; position: absolute; z-index: 40; top: calc(100% + 6px); left: 0;
  min-width: 240px; max-height: 300px; overflow-y: auto;
  background: var(--card); border: 1px solid var(--field-border); border-radius: 10px;
  padding: 8px; box-shadow: 0 10px 30px var(--shadow);
}
.eq-dd.open .eq-dd-panel { display: block; }
.eq-dd.open .eq-dd-btn::after { transform: rotate(180deg); margin-top: -4px; }
.eq-chk {
  display: flex; align-items: center; gap: 9px;
  padding: 6px 8px; border-radius: 7px; cursor: pointer; font-size: 13px;
}
.eq-chk:hover { background: var(--row-hover); }
.eq-chk input { accent-color: var(--accent); }
.eq-dd-empty { color: var(--faint); font-size: 12px; padding: 6px 8px; }
/* подсказка внутри выпадающего списка (например «можно выбрать несколько статусов») */
.eq-dd-hint {
  color: var(--faint); font-size: 11.5px; padding: 2px 8px 6px;
  border-bottom: 1px solid var(--line); margin-bottom: 4px;
}

/* одиночные селекты КЖЦ/АИП */
.eq-sel {
  display: flex; flex-direction: column; gap: 2px; min-width: 130px;
}
.eq-sel .lbl {
  font-size: 10px; font-weight: 700; letter-spacing: 1px; color: var(--faint);
  text-transform: uppercase;
}
.eq-sel select {
  height: 40px; padding: 0 10px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-size: 13px; font-family: inherit;
}
.eq-sel select:focus { outline: none; border-color: var(--accent); }
.btn-ghost {
  background: var(--accent-soft); color: var(--num);
}
.btn-ghost:hover { filter: brightness(1.15); }
.btn-sm { padding: 9px 14px; font-size: 13px; }
.eq-reset {
  align-self: center;
  color: var(--sub); font-size: 13px; font-weight: 600;
  text-decoration: none; white-space: nowrap; padding: 8px 10px; border-radius: 8px;
}
.eq-reset:hover { color: var(--ink); background: var(--row-hover); }

/* раскладка колонок: обе тянутся на высоту экрана (stretch).
   Левая карточка узкая — ID короткие, основное место таблице (Валера, 05.09) */
.eq-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 14px; align-items: stretch; }

/* левая карточка: список ID */
.eq-idcard {
  display: flex; flex-direction: column; gap: 10px;
  background: var(--card); border: 1px solid var(--card-border); border-radius: 12px;
  padding: 18px 18px 16px;
}
.eq-id-title { font-size: 14.5px; font-weight: 700; }
.eq-idta {
  width: 100%; flex: 1 1 auto; resize: vertical; min-height: 160px;
  padding: 10px 12px; font-size: 12.5px; line-height: 1.5;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
  color: var(--ink); font-family: inherit;
}
.eq-idta:focus { outline: none; border-color: var(--accent); }
/* список ID не применился: вместо ошибки 500 — красный текст и снятый фильтр
   (владелец, 13.10.2026: вставил 171 000 ID МТ и получил 500) */
.eq-ids-err { color: #e0755f; font-size: 12px; line-height: 1.4; margin: 6px 0 2px; }
.eq-id-hint { color: var(--faint); font-size: 11px; }
.eq-id-matched {
  display: flex; flex-direction: column; gap: 3px;
  color: var(--num); font-size: 12px;
}
/* разбор вставленного списка: сколько ID найдено, сколько нет (29.09.2026) */
.eq-ids-info {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--field); font-size: 12px;
}
.eq-ids-row { display: flex; justify-content: space-between; gap: 10px; color: var(--sub); }
.eq-ids-row span { min-width: 0; }              /* подпись переносится, число — нет */
.eq-ids-row b { color: var(--ink); white-space: nowrap; }
.eq-ids-row.ok b { color: var(--num); }
.eq-ids-row.bad b { color: #ef4444; }
.eq-ids-dl { color: var(--accent); font-size: 11.5px; margin-top: 2px; }
.eq-idstat {
  margin-top: auto; padding-top: 14px; border-top: 1px solid var(--line);
}
.eq-idstat-cap { font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; color: var(--faint); text-transform: uppercase; }
.eq-idstat-n { font-size: 21px; font-weight: 700; color: var(--num); margin-top: 3px; }
.eq-idstat-sub { color: var(--faint); font-size: 10.5px; }

/* правая карточка: результат — почти на весь экран по высоте */
.eq-result {
  margin-top: 0; padding: 18px 20px 12px;
  display: flex; flex-direction: column;
  height: max(440px, calc(100vh - 340px));
}
.eq-result-head {
  flex: none;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin-bottom: 12px;
}
.eq-result-head h2 { font-size: 16px; }
.eq-range { color: var(--sub); font-size: 12px; margin-left: 2px; }
/* группа справа: статус выгрузки + кнопка. Кнопка всегда в правом краю,
   статус появляется левее и кнопку не сдвигает */
.eq-result-actions {
  margin-left: auto;
  display: inline-flex; align-items: center; justify-content: flex-end;
  gap: 10px; flex-wrap: wrap;
}
.eq-result-actions .btn { margin-left: 0; }

/* таблица: фикс-шапка, скролл в окне, окно заполняет карточку */
.eq-table-wrap {
  flex: 1 1 auto; min-height: 220px;
  border: 1px solid var(--line); border-radius: 10px;
  overflow: auto; background: var(--card);
  scrollbar-width: thin;
  scrollbar-color: var(--faint) transparent;
}
/* явный ползунок — всегда виден (Chrome/Edge/Opera, не накладывается поверх) */
.eq-table-wrap::-webkit-scrollbar { width: 12px; height: 12px; }
.eq-table-wrap::-webkit-scrollbar-track { background: transparent; }
.eq-table-wrap::-webkit-scrollbar-thumb {
  background: var(--faint); border-radius: 7px;
  border: 3px solid var(--card);
}
.eq-table-wrap::-webkit-scrollbar-thumb:hover { background: var(--sub); }
.eq-table-wrap::-webkit-scrollbar-corner { background: transparent; }
.eq-table { border-collapse: separate; border-spacing: 0; width: max-content; min-width: 100%; }
.eq-table th, .eq-table td {
  padding: 7px 12px; font-size: 12.5px; line-height: 1.4;
  border-bottom: 1px solid var(--line); border-right: 1px solid var(--line);
  max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.eq-table th {
  position: sticky; top: 0; z-index: 5;
  background: var(--accent-soft); color: var(--ink);
  font-weight: 700; font-size: 11.5px; text-align: left;
}
.eq-table th:last-child, .eq-table td:last-child { border-right: none; }
.eq-table td.eq-idx, .eq-table th.eq-idx {
  position: sticky; left: 0; z-index: 4; min-width: 44px;
  color: var(--faint); text-align: right;
}
.eq-table td.eq-idx { background: var(--card); color: var(--faint); font-size: 11.5px; }
.eq-table th.eq-idx { background: var(--accent-soft); z-index: 6; }
.eq-table tbody tr:nth-child(even) td { background: var(--row-hover); }
.eq-table tbody tr:nth-child(even) td.eq-idx { background: var(--row-hover); }
.eq-table tbody tr:hover td { background: var(--accent-soft); }
.eq-table tbody tr:hover td.eq-idx { background: var(--accent-soft); }

/* бейджи статуса в колонке «Статус» */
.eq-status {
  display: inline-block; padding: 2px 9px; border-radius: 9px;
  font-size: 11.5px; font-weight: 600; white-space: nowrap;
}
.st-ok  { color: var(--badge-open-t); background: var(--badge-open-b); }
.st-bad { color: var(--badge-me-t);  background: var(--badge-me-b); }
.st-clear { color: var(--danger-t); background: var(--danger-b); }
.st-none{ color: var(--sub); background: var(--row-hover); }
.st-run { color: var(--num); background: var(--accent-soft); }

/* пейджер */
.eq-pager {
  flex: none;
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  margin-top: 12px; flex-wrap: wrap;
}
.eq-pager-info { color: var(--faint); font-size: 11.5px; }
.eq-pager-pages { display: flex; align-items: center; gap: 4px; }
.pp {
  min-width: 30px; height: 30px; padding: 0 6px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; font-size: 13px; color: var(--sub);
  background: var(--field); border: 1px solid var(--field-border);
  text-decoration: none;
}
.pp:hover { border-color: var(--accent); color: var(--ink); }
.pp.cur { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 700; }
.pd { color: var(--faint); padding: 0 4px; }

/* страница загрузки файла */
.eq-upload h2 { font-size: 16px; }
.eq-upload-sub { margin: 6px 0 18px; color: var(--sub); font-size: 13px; }
.eq-upload-form { display: flex; flex-direction: column; gap: 16px; }
.eq-drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
  padding: 30px 20px; text-align: center; cursor: pointer;
  background: var(--field); border: 1.5px dashed var(--field-border); border-radius: 12px;
  transition: border-color .15s ease, background .15s ease;
}
.eq-drop:hover, .eq-drop.drag { border-color: var(--accent); background: var(--accent-soft); }
.eq-file-input { display: none; }
.eq-drop-icon { font-size: 22px; color: var(--accent); }
.eq-drop-main { color: var(--ink); font-size: 14.5px; }
.eq-drop-main b { color: var(--accent); }
.eq-drop-main.picked b { color: inherit; }
.eq-drop-sub { color: var(--faint); font-size: 12px; }
.eq-upload-actions { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.eq-upload-actions .btn { min-width: 230px; }
.eq-upload-actions .btn:disabled { opacity: .45; cursor: not-allowed; }
.eq-warn { color: var(--badge-me-t); font-size: 12.5px; }

/* опасная зона: маленькая красная кнопка удаления в шапке карточки загрузки */
.eq-upload-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 14px; flex-wrap: wrap;
}
.eq-upload-head h2 { margin: 0; }
.eq-clear-wrap { display: inline-flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.eq-clear-wrap[hidden] { display: none; }
.eq-clear-confirm {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 10px 5px 12px;
  border: 1px solid var(--danger-t); border-radius: 9px;
  background: var(--danger-b);
}
.eq-clear-confirm[hidden] { display: none; }
.eq-clear-q { font-size: 12px; color: var(--danger-t); font-weight: 600; }

/* история загрузок */
.eq-history { width: 100%; border-collapse: collapse; margin-top: 14px; }
.eq-history th, .eq-history td {
  text-align: left; padding: 9px 12px; font-size: 13px;
  border-bottom: 1px solid var(--line);
}
.eq-history th { color: var(--faint); font-weight: 700; font-size: 11px; letter-spacing: 1px; text-transform: uppercase; }
.eq-history td { color: var(--sub); }
.eq-history a { text-decoration: none; }
.eq-h-err { color: var(--danger-t); font-size: 11.5px; margin-left: 8px; cursor: help; }

/* страница прогресса */
.eq-progress-head {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 14px; flex-wrap: wrap;
}
.eq-progress-head h2 { font-size: 16px; }
.eq-progress-num { color: var(--num); font-size: 15px; font-weight: 700; }
.eq-steps {
  margin: 22px 0 18px;
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px;
}
.eq-step {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: 6px;
  padding: 0 6px; opacity: .45; transition: opacity .2s ease;
}
.eq-step .dot {
  width: 22px; height: 22px; border-radius: 50%; flex: none;
  border: 2px solid var(--faint); background: var(--card);
  position: relative;
}
.eq-step.active { opacity: 1; }
.eq-step.active .dot { border-color: var(--accent); }
.eq-step.active .dot::after {
  content: ""; position: absolute; inset: 4px; border-radius: 50%;
  background: var(--accent); animation: pulse 1.1s ease-in-out infinite;
}
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .3; } }
.eq-step.done { opacity: .85; }
.eq-step.done .dot { border-color: var(--badge-open-t); background: var(--badge-open-b); }
.eq-step.done .dot::after {
  content: "✓"; position: absolute; inset: 0; display: grid; place-items: center;
  color: var(--badge-open-t); font-size: 12px; font-weight: 700;
}
.eq-step b { font-size: 12px; color: var(--ink); }
.eq-step small { font-size: 10.5px; color: var(--faint); line-height: 1.3; }
.eq-bar {
  height: 8px; border-radius: 4px; overflow: hidden;
  background: var(--row-hover); border: 1px solid var(--field-border);
}
.eq-bar-fill {
  height: 100%; width: 0%; border-radius: 4px;
  background: var(--accent); transition: width .5s ease;
}
.eq-progress-sub { margin-top: 10px; color: var(--sub); font-size: 12.5px; min-height: 18px; }
.eq-progress-actions { margin-top: 18px; display: flex; gap: 10px; }
.eq-progress-actions[hidden] { display: none; }
.eq-progress .msg-error { margin-top: 14px; }

/* статус фоновой выгрузки рядом с кнопкой: тонкая полоска + проценты + остаток */
.eq-expstat { display: inline-flex; flex-direction: column; gap: 4px; min-width: 190px; }
.eq-expstat[hidden] { display: none; }
.eq-expstat-bar { height: 3px; border-radius: 99px; background: var(--row-hover); overflow: hidden; }
.eq-expstat-fill {
  display: block; height: 100%; width: 0;
  background: var(--accent); border-radius: 99px;
  transition: width .4s ease;
}
.eq-expstat.indet .eq-expstat-fill { width: 30%; animation: eqindet 1.1s linear infinite; }
@keyframes eqindet {
  0% { transform: translateX(0); }
  100% { transform: translateX(320%); }
}
.eq-expstat-line { display: flex; align-items: baseline; gap: 8px; min-height: 14px; }
.eq-expstat-txt { font-size: 11.5px; color: var(--sub); white-space: nowrap; }
.eq-expstat.err .eq-expstat-txt { color: var(--danger-t); }
.eq-expstat-dl { font-size: 11.5px; color: var(--accent); font-weight: 600; text-decoration: none; white-space: nowrap; }
.eq-expstat-dl:hover { text-decoration: underline; }
.eq-exp-err { color: var(--danger-t); font-size: 12px; font-weight: 600; }

/* ============ узкие экраны ============ */
@media (max-width: 1100px) {
  .eq-layout { grid-template-columns: 1fr; }
  .eq-result { height: auto; }
  .eq-table-wrap { min-height: 320px; }
  .eq-idcard { min-height: 0; }
  .eq-idta { min-height: 220px; }
  .eq-steps { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 980px) {
  .login-wrap { grid-template-columns: 1fr; }
  .login-brand { display: none; }
  .body { grid-template-columns: 1fr; }
  .sidebar { display: none; }
  .content { padding: 20px; }
  .topbar-search { display: none; }
  .cards { grid-template-columns: 1fr; }
  .eq-filters-hint { display: none; }
}


/* ============ Пользователи и права (этап 1) ============ */
.users-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.users-head .btn { flex: none; }

.users-panel { overflow-x: auto; }
.users-table { width: 100%; border-collapse: collapse; min-width: 860px; }
.users-table th, .users-table td { padding: 10px 12px; text-align: left; vertical-align: middle; }
.users-table th {
  color: var(--faint); font-weight: 700; font-size: 11px; letter-spacing: 1px;
  text-transform: uppercase; padding-top: 4px; padding-bottom: 12px;
}
.users-table td { border-top: 1px solid var(--line); }
.users-table tr:hover td { background: var(--row-hover); }
.users-table td:first-child { padding-left: 0; }
.users-table th:last-child, .users-table td:last-child { padding-right: 0; }

.users-full { display: block; font-weight: 700; color: var(--ink); }
.users-login { display: block; color: var(--faint); font-size: 12px; margin-top: 2px; }

.users-role-admin { color: var(--badge-grp-t); background: var(--badge-grp-b); }
.users-role-staff { color: var(--badge-open-t); background: var(--badge-open-b); }

.users-access-txt { color: var(--sub); font-size: 13px; }
.users-chip {
  display: inline-block; margin: 2px 6px 2px 0; padding: 2px 10px;
  border-radius: 9px; font-size: 12px; color: var(--sub);
  background: var(--row-hover); border: 1px solid var(--line);
}
.users-access-none { color: var(--faint); font-size: 13px; }

.users-state { font-size: 13px; white-space: nowrap; }
.users-state.on { color: var(--badge-open-t); }
.users-state.off { color: var(--faint); }

.users-actions { text-align: right; white-space: nowrap; }
.users-acts { display: inline-flex; align-items: center; gap: 2px; }
.users-acts[hidden], .users-del[hidden] { display: none; }
.users-act {
  display: inline-grid; place-items: center;
  width: 30px; height: 30px; border-radius: 8px;
  background: transparent; border: 0; cursor: pointer;
  color: var(--sub); font-size: 16px; line-height: 1; text-decoration: none;
}
.users-act:hover { background: var(--row-hover); color: var(--ink); }
.users-del-btn:hover { background: var(--danger-b); color: var(--danger-t); }
.users-act-danger { color: var(--danger-t); }
.users-act-danger:hover { background: var(--danger-b); color: var(--danger-t); }
.users-act-form { display: inline-block; margin: 0; }
.users-del { display: inline-flex; align-items: center; gap: 2px; }
.users-del-q {
  margin-right: 6px; padding: 4px 10px; border-radius: 8px;
  font-size: 12px; font-weight: 600; white-space: nowrap;
  color: var(--danger-t); background: var(--danger-b);
}
.users-empty { color: var(--faint); text-align: center; padding: 30px 0 !important; }

/* форма */
.users-form-cols { display: grid; grid-template-columns: 460px 1fr; gap: 24px; align-items: start; margin-top: 16px; }
.users-left, .users-right { margin-top: 0; }
.users-left h2, .users-right h2 { font-size: 16px; margin-bottom: 16px; }
.users-right-sub { color: var(--sub); font-size: 12.5px; margin: 0 0 16px; }

.users-select {
  width: 100%; height: 46px; padding: 0 14px;
  border-radius: 9px;
  background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); font-size: 14.5px; font-family: inherit;
}
.users-select:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.users-select:disabled { opacity: .6; }
.users-field-hint { margin-top: 6px; color: var(--faint); font-size: 12px; }

.users-checkline { display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 14px; font-weight: 400; }
.users-checkline input, .users-block input { width: 17px; height: 17px; accent-color: var(--accent); cursor: pointer; }
.field .users-checkline { display: flex; align-items: center; gap: 10px; font-weight: 400; }
.users-pwline { display: flex; gap: 8px; }
.users-pwline input { flex: 1; }
.users-pwline input.mono, .users-table .mono, .users-select.mono { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; }

.users-actions { display: flex; gap: 10px; margin-top: 22px; }
.users-actions .btn-ghost { color: var(--sub); }

.users-blocks { display: flex; flex-direction: column; gap: 10px; }
.users-block {
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: 10px; cursor: pointer;
  background: var(--bg); border: 1px solid var(--line);
}
.users-block:hover { border-color: var(--field-border); }
.users-block.disabled { opacity: .55; cursor: not-allowed; }
.users-block-ic {
  width: 34px; height: 34px; border-radius: 9px; flex: none;
  display: grid; place-items: center;
  background: var(--accent-soft); color: var(--accent);
}
.users-block-name { font-weight: 700; font-size: 14px; }
.users-block .badge { margin-left: auto; }
.users-right-hint { margin-top: 14px; color: var(--faint); font-size: 12px; }

@media (max-width: 1100px) {
  .users-form-cols { grid-template-columns: 1fr; }
}

/* ============ Реестр КП (заявки на КП) ============ */
.btn-danger-outline {
  background: transparent; border: 1px solid var(--danger-t);
  color: var(--danger-t);
}
.btn-danger-outline:hover { background: var(--danger-b); }

.kp-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.kp-head-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kp-head-actions .btn { margin-top: 4px; }

/* 20.10.2026 (владелец: «надо чтобы у всех было одинаково»): группа действий в шапке страницы
   всегда у ПРАВОГО края. Раньше, когда шапка не влезала в одну строку, `space-between` ставил
   единственный элемент строки влево — у сотрудника с узким окном кнопки уезжали налево, у
   владельца с широким монитором оставались справа. `margin-left: auto` держит их справа на
   любой ширине; текст слева при этом сжимается первым (`flex: 1 1 0`). */
.kp-head > div:first-child,
.dv-head > div:first-child,
.cv-head > div:first-child,
.wt-head > h1 { flex: 1 1 0; min-width: 0; }
.kp-head-actions,
.dv-head-actions,
.cv-head-acts,
.wt-head-actions,
.svod-head-act { margin-left: auto; }

/* панель статистики + Excel (как в макете) */
.kp-toolbar {
  display: flex; justify-content: space-between; align-items: center; gap: 18px; flex-wrap: wrap;
  padding: 16px 20px; margin-top: 22px;
  background: var(--card); border: 1px solid var(--card-border); border-radius: 12px;
}
.kp-stats { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.kp-stat-total { display: flex; flex-direction: column; }
.kp-stat-cap { font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; color: var(--faint); }
.kp-stat-n { font-size: 20px; font-weight: 700; color: var(--num); }
.kp-stat { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.kp-stat .dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.kp-stat-name { color: var(--sub); font-size: 12.5px; }
.kp-stat-cnt { font-weight: 700; font-size: 13px; }
.kp-excel-btn { margin-left: auto; }
/* Кнопки «↓ Excel» и «↑ Импорт файла» — одной группой справа (Валера, 28.09.2026:
   «разъехались»). Было: у ОБЕИХ margin-left:auto — они раскидывались по краям панели,
   да ещё и разной высоты (<button> 40 px против ссылки 45 px при том же .btn). */
.kp-toolbar-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
                      margin-left: auto; }
.kp-toolbar-actions .btn { margin-left: 0; height: 40px; padding: 0 15px;
                           display: inline-flex; align-items: center; line-height: 1;
                           font-size: 13.5px; white-space: nowrap; }
/* панель статистики отдаёт место кнопкам, но переносится сама — без выезда за экран */
.kp-toolbar .kp-stats { flex: 1 1 auto; min-width: 0; row-gap: 12px; }

/* кликабельные бейджи статусов/услуг в панели статистики */
.kp-stat-tag {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  cursor: pointer; border: 1px solid transparent; border-radius: 8px;
  padding: 4px 10px; background: transparent; font: inherit; color: inherit;
  transition: border-color .15s, background .15s;
}
.kp-stat-tag:hover { background: var(--row-hover); }
.kp-stat-tag.on { border-color: var(--accent); background: var(--accent-soft); }
.kp-stat-tag.on .kp-stat-name { font-weight: 700; }
.kp-reset-btn {
  display: inline-grid; place-items: center;
  width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--line);
  background: transparent; color: var(--faint); font-size: 11px;
  cursor: pointer; transition: color .15s, border-color .15s;
}
.kp-reset-btn:hover { color: var(--danger-t); border-color: var(--danger-t); }

/* фильтры */
.kp-filters {
  display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap;
  padding: 14px 16px; margin: 14px 0;
  background: var(--card); border: 1px solid var(--card-border); border-radius: 12px;
}
.kp-filters .eq-dd-btn { min-width: 200px; }
.kp-sel-okc select { min-width: 150px; }
.kp-sel-predmet select { min-width: 160px; }
.kp-sel-year select { min-width: 108px; }
.kp-sel-q { flex: 1 1 240px; }
.kp-sel-q input {
  height: 40px; padding: 0 12px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-size: 13px; font-family: inherit; width: 100%;
}
.kp-sel-q input:focus { outline: none; border-color: var(--accent); }
.kp-found { margin-left: auto; align-self: center; color: var(--sub); font-size: 12px; }

/* таблица реестра */
.kp-reg-panel { margin-top: 0; padding: 16px 20px 10px; }
/* 16.10.2026 (общий сторож выравнивания, PLAN-BLOCKS-RIGHTS часть 4): страница НЕ должна
   растягиваться по содержимому. Пустой `<main>` в гриде `.body` шириной 244px/1fr залипал
   на ширине по содержимому (1652 px вместо ~1356 px из-за 130 реальных заявок и пустой
   колонки), и все панели реестра КП наследовали эту ширину — документ оставался 1600 px,
   но правый край панелей уезжал за окно (замер: 1860 px при 1600; «+ Новая заявка» была
   не видна). `min-width: 0` — стандартная починка грид-трека `1fr`, чтобы трек не
   растягивался по содержимому, а делил свободное место. */
.content { min-width: 0; }
.kp-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; }
.kp-table { border-collapse: collapse; width: 100%; min-width: 1080px; }
.kp-table th, .kp-table td { padding: 9px 12px; text-align: left; font-size: 12.5px; }
.kp-table th {
  color: var(--faint); font-weight: 700; font-size: 10.5px; letter-spacing: .8px;
  text-transform: uppercase; white-space: nowrap;
  background: var(--accent-soft);
  border-bottom: 1px solid var(--line);
}
.kp-table td { border-bottom: 1px solid var(--line); vertical-align: middle; }
.kp-table tbody tr:last-child td { border-bottom: none; }
.kp-table tbody tr:hover td { background: var(--row-hover); }
.kp-table .kp-idx { width: 52px; color: var(--faint); }
.kp-mo a { color: var(--ink); font-weight: 700; text-decoration: none; }
.kp-mo a:hover { color: var(--accent); }
.kp-eq { color: var(--sub); }
.kp-eq .kp-eq-t {
  display: inline-block; max-width: 240px; overflow: hidden;
  text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom;
}
.kp-eq .kp-eq-rest { color: var(--faint); font-size: 11px; white-space: nowrap; }
.kp-eq .kp-eq-none { color: var(--faint); }
.kp-okc { white-space: nowrap; }
.kp-acts { white-space: nowrap; width: 110px; text-align: right; }
.kp-acts-i { display: inline-flex; align-items: center; gap: 2px; justify-content: flex-end; }
.kp-acts-i a, .kp-del-btn {
  display: inline-grid; place-items: center;
  width: 28px; height: 28px; border-radius: 7px;
  color: var(--sub); font-size: 15px; line-height: 1; text-decoration: none;
  background: transparent; border: 0; cursor: pointer;
}
.kp-acts-i a:hover { background: var(--row-hover); color: var(--ink); }
.kp-del-btn:hover { background: var(--danger-b); color: var(--danger-t); }
.kp-del-form { display: inline-block; margin: 0; }
/* форма кнопки «⧉» (копия позиции расчёта): подтверждения удаления на неё не вешаем */
.kp-copy-form { display: inline-block; margin: 0; }
.kp-st {
  display: inline-block; padding: 2px 10px; border-radius: 9px;
  font-size: 11.5px; font-weight: 600; white-space: nowrap; line-height: 1.5;
  /* цвета статуса задаются на элементе через --kct (светлый тон) и --kcb
     (тёмный тон). Тёмная тема: светлый текст на тёмном фоне; светлая тема:
     инверсия — тёмный текст на светлом фоне того же оттенка. */
  color: var(--kct); background: var(--kcb);
}
html[data-theme="light"] .kp-st { color: var(--kcb); background: var(--kct); }
/* цветной текст статуса (счётчики статистики, пункты фильтра) — та же инверсия */
.kp-ct { color: var(--kct); }
html[data-theme="light"] .kp-ct { color: var(--kcb); }
.kp-st-lg { font-size: 13px; padding: 4px 14px; }
.kp-st-note { display: block; color: var(--faint); font-size: 10px; margin-top: 3px; white-space: nowrap; }
.kp-foot { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 10px; }
.kp-hint { color: var(--faint); font-size: 11px; }
.kp-pager { margin-top: 6px; }

/* ============ просмотр заявки ============ */
.kp-vhead { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.kp-vcols { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 16px; align-items: start; margin-top: 22px; }
.kp-vright { display: flex; flex-direction: column; gap: 16px; }
.kp-vcard { margin-top: 0; padding: 18px 22px; }
.kp-vcard h2 { font-size: 15.5px; margin-bottom: 14px; }
.kp-vgroup-cap {
  font-size: 10px; font-weight: 700; letter-spacing: 1.4px; text-transform: uppercase;
  color: var(--faint); margin: 14px 0 4px;
}
.kp-vgroup-cap:first-of-type { margin-top: 0; }
.kp-kv { margin: 0; }
.kp-kv > div { display: grid; grid-template-columns: 200px 1fr; gap: 8px; padding: 5px 0; }
.kp-kv dt { color: var(--faint); font-size: 12px; font-weight: 700; }
.kp-kv dd { color: var(--ink); font-size: 13px; }
.kp-sum { color: var(--num); font-weight: 700; }
.kp-vsep { border-top: 1px solid var(--line); margin: 14px 0; }

/* КП и оферта в карточке заявки — правка на месте (02.10.2026): поля остаются вводимыми в
   любом статусе, в том числе у закрытой заявки; вид компактнее формы заявки, поля те же. */
.kp-offer { margin: 0; }
.kp-opair { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.kp-ofld { display: block; margin-bottom: 12px; }
.kp-opair .kp-ofld { margin-bottom: 12px; }
.kp-olbl { display: block; font-size: 12px; font-weight: 700; color: var(--faint); margin-bottom: 5px; }
.kp-offer input {
  width: 100%; height: 38px; padding: 0 12px;
  border-radius: 8px; background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); font-size: 13.5px; font-family: inherit;
}
.kp-offer input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.kp-oact { display: flex; align-items: center; gap: 10px; margin-top: 4px; }
.kp-ofnote-lock { margin: -6px 0 12px; color: var(--sub); }
.kp-vcomment p { color: var(--sub); font-size: 13px; line-height: 1.5; }

/* Имя папки с документами заявки (07.10.2026): ненавязчиво, как остальные значения
   карточки — моноширинная строка + маленькая иконка копирования (квадратики). */
.kp-vfolder { margin-top: 2px; }
.kp-folder-line { display: flex; align-items: center; gap: 9px; min-height: 22px; }
.kp-folder-name { color: var(--ink); font-size: 13px; }
.kp-folder-copy { cursor: pointer; }
/* Видимая подсказка «скопировано ✓» рядом с именем папки / путём (Валера, 07.10.2026:
   «нужно, чтобы после названия всплывала подсказка, что папка скопирована»). */
.kp-copy-hint {
  color: var(--badge-open-t); font-size: 11.5px; white-space: nowrap;
}
/* Поле «Путь к папке» в форме заявки (07.10.2026): длинное, на всю колонку */
.kp-folder-path-field input { width: 100%; }
/* Путь к папке в карточке заявки — переносимая моноширинная строка */
.kp-vfold-path { margin-top: 12px; }
/* Длинный путь переносится, а кнопка копирования стоит СРАЗУ за последним символом пути
   (не у правого края: путь больше не растягивается на всю строку), подсказка всплывает
   рядом с кнопкой и НЕ сдвигает строку (Валера, 07.10.2026: «кнопка далеко с краю… надпись
   появляется вместо кнопки, а кнопка уезжает влево»). */
.kp-vfold-path .kp-folder-line-inline { display: block; }
.kp-copy-wrap { position: relative; display: inline-block; margin-left: 7px; vertical-align: middle; }
.kp-copy-hint-float {
  position: absolute; left: calc(100% + 8px); top: 50%; transform: translateY(-50%);
  color: var(--badge-open-t); font-size: 11.5px; white-space: nowrap;
}
/* в узкой колонке подсказка у правого края не помещается — всплываем НАД кнопкой */
.kp-vfold-path .kp-copy-hint-float.over-edge {
  left: auto; right: 0; top: auto; bottom: calc(100% + 6px); transform: none;
}
.kp-folder-path {
  color: var(--ink); font-size: 13px; word-break: break-all; white-space: pre-wrap;
}
/* Имя папки В ФОРМЕ заявки (07.10.2026): живое, до сохранения; появляется только
   когда заполнены оба поля (вх. ГМТ + МО). Без указателей в полях (владелец). */
.kp-folder-live { margin: 2px 0 16px; padding-top: 12px; border-top: 1px solid var(--line); }
.kp-vpredmet { margin-top: 4px; font-size: 15px; color: var(--ink); font-weight: 600; }
.kp-vpredmet-extra { margin-top: 6px; color: var(--sub); font-size: 13px; }

/* быстрая смена статуса в просмотре */
.kp-stform { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.kp-stform select {
  height: 34px; padding: 0 10px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
  color: var(--ink); font-size: 13px; font-family: inherit;
}
.kp-stform input[type=text] {
  flex: 1 1 160px; height: 34px; padding: 0 12px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
  color: var(--ink); font-size: 13px; font-family: inherit;
}

/* таймлайн истории статусов */
.kp-timeline { margin-top: 4px; }
/* «История изменений»: пока записей мало, карточка растёт как обычно; как только история
   доходит до нижнего края левой карточки «Заявка», дальше она прокручивается ВНУТРИ себя
   и НЕ тянет вниз «Предмет договора и оборудование» (Валера, 11.09.2026). Предел высоты
   считает скрипт в kp_view.html — ровно по нижнему краю левой карточки. */
.kp-timeline.kp-tl-scroll {
  overflow-y: auto; padding-right: 8px; scrollbar-width: thin;
  scrollbar-color: var(--field-border) transparent;
}
.kp-timeline.kp-tl-scroll::-webkit-scrollbar { width: 8px; }
.kp-timeline.kp-tl-scroll::-webkit-scrollbar-thumb {
  background: var(--field-border); border-radius: 8px;
}
.kp-tl-item { display: flex; gap: 12px; padding-bottom: 16px; position: relative; }
.kp-tl-item:not(:last-child)::before {
  content: ""; position: absolute; left: 5px; top: 16px; bottom: 0;
  border-left: 1.5px solid var(--line);
}
.kp-tl-dot { width: 11px; height: 11px; border-radius: 50%; flex: none; margin-top: 3px; }
/* значок события журнала «кто что правил» (макет kp-events-feed.png, 14.09.2026):
   + добавлено · ✎ изменено · ✕ удалено · ⇄ копия. Статус рисуется кружком статуса. */
.kp-tl-ic {
  width: 11px; flex: none; margin-top: 3px; text-align: center;
  font-size: 11px; font-weight: 700; line-height: 1;
}
.kp-tl-ic-add  { color: var(--badge-open-t); }
.kp-tl-ic-edit { color: var(--accent); }
.kp-tl-ic-del  { color: var(--danger-t); }
.kp-tl-ic-copy { color: var(--badge-me-t); }
.kp-tl-body { flex: 1; min-width: 0; }
.kp-tl-head { display: flex; align-items: baseline; gap: 10px; }
.kp-tl-time { color: var(--faint); font-size: 11px; flex: none; }
.kp-tl-what { font-weight: 700; font-size: 13px; color: var(--ink); flex: none; }
.kp-tl-status { font-weight: 700; font-size: 13px; color: var(--ink); }
/* подробности события — одна строка, длинное обрезаем (полный текст в подсказке) */
.kp-tl-diff {
  color: var(--sub); font-size: 12px; min-width: 0;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.kp-tl-by { margin-left: auto; color: var(--faint); font-size: 11.5px; white-space: nowrap; flex: none; }
.kp-tl-note { color: var(--sub); font-size: 12px; margin-top: 2px; line-height: 1.4; }
.kp-tl-stamp {
  margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line);
  color: var(--faint); font-size: 11.5px;
}

/* таблица оборудования в просмотре */
.kp-eqtable-wrap { border: 1px solid var(--line); border-radius: 10px; overflow-x: auto; margin-top: 12px; }
.kp-eqtable { border-collapse: collapse; width: 100%; min-width: 620px; }
.kp-eqtable th, .kp-eqtable td { padding: 8px 12px; text-align: left; font-size: 12.5px; }
.kp-eqtable th { color: var(--faint); font-size: 10.5px; letter-spacing: .6px; text-transform: uppercase; background: var(--accent-soft); border-bottom: 1px solid var(--line); }
.kp-eqtable td { border-bottom: 1px solid var(--line); }
.kp-eqtable tr:last-child td { border-bottom: none; }
.kp-src { text-align: right; white-space: nowrap; }
.kp-src-emias { color: var(--badge-open-t); font-size: 11px; font-weight: 700; }
.kp-src-manual { color: var(--badge-me-t); font-size: 11px; font-weight: 700; }

/* ============ форма заявки ============ */
.kp-fhead { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.kp-form { margin-top: 20px; }
.kp-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 32px; align-items: start; }
.kp-fh {
  font-size: 13.5px; color: var(--ink); font-weight: 700;
  border-bottom: 1px solid var(--line); padding-bottom: 8px; margin: 6px 0 16px;
}
.kp-fh:not(:first-child) { margin-top: 8px; }
.kp-fcol .field { margin-bottom: 16px; }
.kp-fcol select, .kp-fcol textarea {
  width: 100%; padding: 0 12px;
  border-radius: 9px;
  background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); font-size: 14px; font-family: inherit;
}
.kp-fcol select { height: 42px; }
.kp-fcol textarea { padding: 10px 12px; resize: vertical; line-height: 1.5; }
.kp-fcol select:focus, .kp-fcol textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.kp-fpair { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.kp-fnote { margin-top: 6px; color: var(--faint); font-size: 11.5px; }
/* сумма КП: серый стиль пока нет номера КП */
.kp-sum-gray { color: var(--faint) !important; opacity: 0.6; }
/* Сумма КП расходится с итогом расчёта — пометка и кнопка «взять из расчёта»
   (Валера, 19.10.2026: «если в заявке уже стоит сумма, а расчёт поменялся — портал молчит») */
/* Пометка — обычный поток текста (flex-разрывы давали «двойные пробелы» вокруг суммы) */
.kp-sumdiff { margin-top: 6px; font-size: 11.5px; color: var(--accent); }
.kp-sumdiff b { font-weight: 400; font-variant-numeric: tabular-nums; }
.kp-sumtake { margin-left: 8px; border: 1px solid currentColor; background: transparent;
  color: var(--accent); border-radius: 6px; padding: 2px 8px; font: inherit; line-height: 1.4;
  cursor: pointer; white-space: nowrap; }
.kp-sumtake:hover { background: var(--accent); color: #fff; }

/* приложения (файлы) в форме заявки */
.kp-attach-panel {
  margin-top: 18px; padding: 16px 18px;
  border: 1px dashed var(--line); border-radius: 12px;
  transition: border-color .15s, background .15s;
}
/* перетаскивание файла на панель */
.kp-attach-panel.drag {
  border-color: var(--accent); border-style: solid;
  background: var(--accent-soft);
}
.kp-attach-cap-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 8px; }
.kp-attach-cap {
  font-size: 10px; font-weight: 700; letter-spacing: 1.2px;
  text-transform: uppercase; color: var(--faint);
}
.kp-attach-controls { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.kp-attach-list { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.kp-attach-item {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 12px; border: 1px solid var(--line); border-radius: 9px;
  background: var(--field); min-width: 0;
}
.kp-attach-ico { color: var(--faint); font-size: 14px; }
.kp-attach-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); font-size: 13px; }
.kp-attach-size { color: var(--faint); font-size: 11.5px; white-space: nowrap; }
.kp-attach-new { color: var(--badge-open-t); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; white-space: nowrap; }
.kp-attach-del {
  width: 26px; height: 26px; border-radius: 7px; border: 0; cursor: pointer;
  background: transparent; color: var(--sub); font-size: 13px; line-height: 1;
  flex: none;
}
.kp-attach-del:hover { background: var(--danger-b); color: var(--danger-t); }
/* идущая загрузка файла: полоса «процент · МБ из МБ · МБ/с · осталось» (Валера, 28.09.2026) */
.kp-attach-item.kp-attach-up { flex-direction: column; align-items: stretch; gap: 4px;
                               background: var(--field); }
.kp-attach-up .kp-attach-upline { display: flex; align-items: center; gap: 8px; min-width: 0; }
.kp-attach-state { color: var(--accent); font-size: 11.5px; white-space: nowrap; }
.kp-attach-item.kp-attach-up.bad .kp-attach-state { color: var(--danger-t); }
.kp-attach-cancel { border: none; background: transparent; color: var(--faint); cursor: pointer;
                    font-size: 12px; padding: 0 4px; line-height: 1; }
.kp-attach-cancel:hover { color: var(--danger-t); }
.kp-attach-bar { height: 6px; border-radius: 4px; background: var(--card);
                 border: 1px solid var(--field-border); overflow: hidden; }
.kp-attach-bar i { display: block; height: 100%; width: 0; background: var(--accent);
                   transition: width .2s ease; }
.kp-attach-progtxt { color: var(--faint); font-size: 11px; }
.kp-attach-err {
  margin-top: 8px; padding: 8px 12px; border-radius: 8px;
  background: var(--danger-b); color: var(--danger-t); font-size: 12.5px;
}

/* приложенные файлы на просмотре заявки */
.kp-file-list { display: flex; flex-direction: column; gap: 8px; }
.kp-file-item { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; padding: 2px 0; }
.kp-file-link {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--ink); text-decoration: none; font-size: 13.5px; min-width: 0;
}
.kp-file-link:hover { color: var(--accent); }
.kp-file-name { max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kp-file-size { color: var(--faint); font-size: 11.5px; }
.kp-file-meta { color: var(--faint); font-size: 11.5px; }

/* авто-поле (дата принятия / ответственный) */
.kp-auto {
  display: flex; align-items: center; gap: 10px;
  height: 42px; padding: 0 14px; border-radius: 9px;
  background: var(--row-hover); border: 1px dashed var(--field-border);
  color: var(--sub); font-size: 14px;
}
.kp-badge-auto { color: var(--faint); background: var(--bg); font-size: 10px; letter-spacing: .8px; }

/* МО: автокомплит */
.kp-mo-row { display: flex; gap: 8px; }
.kp-mo-row input {
  flex: 1; height: 42px; padding: 0 12px;
  border-radius: 9px;
  background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); font-size: 14px; font-family: inherit;
}
.kp-mo-row input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
.kp-mo-drop {
  border: 1px solid var(--field-border); border-radius: 10px; margin-top: 6px;
  background: var(--card); overflow: hidden;
}
.kp-mo-opt { padding: 9px 14px; font-size: 13.5px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.kp-mo-opt:last-child { border-bottom: none; }
.kp-mo-opt .kp-mo-name { color: var(--ink); }
.kp-mo-cnt { color: var(--faint); font-size: 11px; white-space: nowrap; }
.kp-mo-contact { padding-left: 26px; font-size: 12.5px; }
.kp-mo-contact .kp-mo-name { color: var(--sub); }
.kp-mo-selectable { cursor: pointer; }
.kp-mo-selectable:hover { background: var(--accent-soft); }
.kp-mo-selectable:hover .kp-mo-name { color: var(--accent); }

.kp-ref-last {
  color: var(--badge-grp-t); background: var(--badge-grp-b);
  border-radius: 9px; padding: 2px 8px; font-size: 10.5px; font-weight: 700;
  margin-left: 6px; white-space: nowrap;
}
/* Управляющий МО: ФИО и должность из справочника (25.09.2026) */
.kp-mm {
  margin-top: 8px; padding: 10px 12px 8px;
  border: 1px solid var(--accent); border-radius: 10px;
  background: var(--accent-soft); position: relative;
}
.kp-mm-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.kp-mm-icohint { margin-left: auto; color: var(--faint); font-size: 11px; white-space: nowrap; }
.kp-mm-title { color: var(--num); font-size: 11.5px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; }
.kp-mm-hint { color: var(--sub); font-size: 11.5px; }
.kp-mm-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 7px; align-items: center; }
.kp-mm-row input {
  height: 38px; padding: 0 11px; border-radius: 8px;
  background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); font-size: 13.5px; font-family: inherit;
}
/* колонка формы ~546 px: ФИО и должность поровну, кнопка-галочка в конце строки */
.kp-mm-row input:first-child, .kp-mm-row input:nth-child(2) { flex: 1 1 0; min-width: 0; }
.kp-mm-row input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
/* кнопка «птичка»: 38×38, без текста (подпись — в title и в шапке полосы) */
.kp-mm-save {
  flex: 0 0 38px; width: 38px; height: 38px; padding: 0; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 9px; background: var(--accent); color: #fff;
  transition: transform .12s ease, filter .12s ease, background .2s ease;
}
.kp-mm-save:hover { filter: brightness(1.12); }
.kp-mm-save:active { transform: scale(.9); }          /* отклик на нажатие */
.kp-mm-save:focus-visible { outline: 2px solid var(--num); outline-offset: 2px; }
.kp-mm-save svg { display: block; }
.kp-mm-save.is-busy { pointer-events: none; background: var(--field-border); }
.kp-mm-save.is-busy svg { display: none; }
.kp-mm-spin {
  display: none; width: 15px; height: 15px; border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .3); border-top-color: #fff;
  animation: kpMmSpin .7s linear infinite;
}
.kp-mm-save.is-busy .kp-mm-spin { display: block; }
@keyframes kpMmSpin { to { transform: rotate(360deg); } }
/* после сохранения: зелёная вспышка полосы + строка «✓ …» */
.kp-mm-flash { animation: orgSaved 2.2s ease-out; }
.kp-mm-done { margin-top: 6px; color: var(--badge-open-t); font-size: 11.5px; font-weight: 700; }
.kp-mm .kp-fnote { margin-top: 6px; }
.kp-mm-drop {
  position: static; margin-top: 6px;
  border: 1px solid var(--accent); border-radius: 9px;
  background: var(--card); overflow: hidden;
}
.kp-mm-opt {
  display: flex; align-items: center; gap: 10px; padding: 7px 12px;
  font-size: 13px; border-bottom: 1px solid var(--line); cursor: pointer;
}
.kp-mm-opt:last-child { border-bottom: none; }
.kp-mm-opt:hover { background: var(--accent-soft); }
.kp-mm-fio { color: var(--ink); flex: 1 1 auto; }
.kp-mm-post { color: var(--sub); font-size: 12.5px; }
.kp-mm-last {
  color: var(--badge-grp-t); background: var(--badge-grp-b);
  border-radius: 9px; padding: 2px 8px; font-size: 10.5px; font-weight: 700;
}

/* оборудование: переключатель источника и список */
.kp-src-tabs { display: inline-flex; border: 1px solid var(--field-border); border-radius: 9px; overflow: hidden; margin-bottom: 10px; }
.kp-src-tab {
  padding: 8px 16px; font-size: 12.5px; cursor: pointer;
  background: var(--field); color: var(--sub); border: 0; font-family: inherit;
}
.kp-src-tab.active { background: var(--accent-soft); color: var(--num); font-weight: 700; }
.kp-eq-add { display: flex; gap: 8px; margin-bottom: 8px; }
.kp-eq-add input {
  flex: 1; height: 38px; padding: 0 12px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-size: 13.5px; font-family: inherit;
}
.kp-eq-add input:focus { outline: none; border-color: var(--accent); }
.kp-eq-results { border: 1px solid var(--line); border-radius: 9px; overflow: hidden; margin-bottom: 8px; }
.kp-eq-none { padding: 12px 14px; color: var(--faint); font-size: 12.5px; }
.kp-eq-hit {
  display: flex; align-items: center; gap: 10px; padding: 8px 12px;
  border-bottom: 1px solid var(--line); font-size: 12.5px;
}
.kp-eq-hit:last-child { border-bottom: none; }
.kp-eq-id { color: var(--num); font-size: 11.5px; min-width: 90px; }
.kp-eq-name { flex: 1; color: var(--ink); min-width: 0; }
/* идентификация аппарата: вид/производитель/модель — обычным, зав. и инв. — мельче */
.kp-eq-meta { color: var(--sub); font-size: 11.5px; min-width: 0; }
.kp-eq-small { color: var(--faint); font-size: 10.5px; white-space: nowrap; }
.kp-eqtable .kp-eqsmall { color: var(--faint); font-size: 10.5px; white-space: nowrap; }
.kp-eq-list { display: flex; flex-direction: column; gap: 6px; margin-top: 4px; }
.kp-eq-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px; border-radius: 9px;
  background: var(--bg); border: 1px solid var(--line);
  font-size: 12.5px;
}
.kp-eq-item .kp-eq-name { flex: 1; }
.kp-b-emias { color: var(--badge-open-t); background: var(--badge-open-b); }
.kp-b-manual { color: var(--badge-me-t); background: var(--badge-me-b); }
.kp-eq-del {
  width: 26px; height: 26px; border-radius: 7px; flex: none;
  display: inline-grid; place-items: center;
  background: transparent; border: 0; color: var(--faint); cursor: pointer; font-size: 13px;
}
.kp-eq-del:hover { background: var(--danger-b); color: var(--danger-t); }

.kp-form-actions { display: flex; gap: 10px; margin-top: 26px; padding-top: 18px; border-top: 1px solid var(--line); }
.kp-form-actions .btn-ghost { color: var(--sub); }

/* ============ справочники ============ */
.kp-refs-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.kp-refs-layout { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 16px; align-items: start; margin-top: 22px; }
.kp-refs-side { margin-top: 0; padding: 18px 16px; }
.kp-refs-side h2 { font-size: 16px; }
.kp-refs-sub { color: var(--faint); font-size: 11.5px; margin: 4px 0 14px; }
.kp-refs-nav { display: flex; flex-direction: column; gap: 2px; }
.kp-refs-nav a {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 9px;
  color: var(--sub); font-size: 13.5px; text-decoration: none;
}
.kp-refs-nav a:hover { background: var(--row-hover); color: var(--ink); }
.kp-refs-nav a.active { background: var(--accent-soft); color: var(--accent); font-weight: 700; }
.kp-refs-nav a.active .mono { color: var(--num); }
.kp-refs-note { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); color: var(--faint); font-size: 11px; line-height: 1.5; }
.kp-refs-panel { margin-top: 0; padding: 20px 24px; min-width: 0; }
.kp-refs-panel h2 { font-size: 17px; }
.kp-refs-panel-sub { color: var(--faint); font-size: 12px; margin: 5px 0 16px; }
.kp-ref-add { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; }
.kp-ref-add input[type=text] {
  height: 38px; padding: 0 12px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-size: 13.5px; font-family: inherit; flex: 0 1 260px;
}
.kp-ref-add select {
  height: 38px; padding: 0 10px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-size: 13px; font-family: inherit;
}
.kp-ref-check { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--sub); }
.kp-ref-check input { accent-color: var(--accent); }
/* поле поиска МО на экране справочников (07.10.2026): название + ФИО контакта */
.kp-org-search { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; }
.kp-org-search input[type=text] {
  height: 38px; padding: 0 12px; min-width: 280px; flex: 0 1 360px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-size: 13.5px; font-family: inherit;
}
.kp-org-search input[type=text]:focus { border-color: var(--accent); outline: none; }
.kp-org-search-count { white-space: nowrap; }
/* палитра выбора цвета статуса (вместо выпадающего списка «цвет») */
.kp-colors { display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.kp-color { display: inline-flex; margin: 0; cursor: pointer; }
.kp-color input { position: absolute; opacity: 0; pointer-events: none; }
.kp-color-chip {
  display: inline-block; padding: 3px 12px; border-radius: 9px;
  font-size: 11.5px; font-weight: 600; line-height: 1.5; white-space: nowrap;
  color: var(--kct); background: var(--kcb); border: 2px solid transparent;
}
html[data-theme="light"] .kp-color-chip { color: var(--kcb); background: var(--kct); }
.kp-color:hover .kp-color-chip { filter: brightness(1.18); }
.kp-color input:checked + .kp-color-chip { border-color: var(--num); }
.kp-color input:focus-visible + .kp-color-chip { outline: 2px solid var(--num); outline-offset: 1px; }
.kp-ref-table { border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.kp-ref-row {
  display: grid; grid-template-columns: minmax(0, 1fr) 90px 90px 70px 190px;
  gap: 10px; align-items: center;
  padding: 9px 14px; border-bottom: 1px solid var(--line); font-size: 13px;
}
.kp-ref-row:last-child { border-bottom: none; }
.kp-ref-row:nth-child(even) { background: var(--row-hover); }
.kp-ref-head {
  font-size: 10.5px; letter-spacing: .6px; text-transform: uppercase; color: var(--faint);
  font-weight: 700; background: var(--accent-soft) !important;
}
.kp-ref-row.kp-ref-head span { color: var(--faint); }
.kp-ref-off { color: var(--faint); font-size: 11px; margin-left: 8px; }
.kp-ref-swatch { display: inline-block; width: 20px; height: 12px; border-radius: 4px; border: 1px solid; }
.kp-ref-yes { color: var(--badge-open-t); font-weight: 700; }
.kp-ref-acts { display: flex; align-items: center; gap: 2px; justify-content: flex-end; }
.kp-ref-edit, .kp-ref-del {
  display: inline-grid; place-items: center;
  min-width: 28px; height: 28px; padding: 0 6px; border-radius: 7px;
  background: transparent; border: 0; cursor: pointer;
  color: var(--sub); font-size: 14px; text-decoration: none;
}
.kp-ref-edit:hover { background: var(--row-hover); color: var(--ink); }
.kp-ref-del:hover { background: var(--danger-b); color: var(--danger-t); }
.kp-ref-edit-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 10px 14px; background: var(--bg); border-bottom: 1px solid var(--line); }
.kp-ref-edit-form input[type=text] {
  height: 36px; padding: 0 12px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
  color: var(--ink); font-size: 13px; font-family: inherit; min-width: 260px;
}
.kp-ref-edit-form select { height: 36px; background: var(--field); border: 1px solid var(--field-border); border-radius: 8px; color: var(--ink); }
.kp-ref-empty { padding: 20px; color: var(--faint); text-align: center; font-size: 13px; }
.kp-ref-sub { display: block; margin-top: 3px; color: var(--faint); font-size: 11.5px; }
.kp-ref-help { margin-top: 14px; color: var(--faint); font-size: 12px; line-height: 1.7; }
.kp-ref-help b { color: var(--badge-me-t); }

.kp-org-edit { margin-top: 18px; border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px;
               /* липкая шапка 64px: без этого якорь прятал заголовок и кнопку под ней (25.09.2026) */
               scroll-margin-top: 76px; }
/* после сохранения (правка МО / контакт) панель зелёной волной отвечает — «анимация сохранения» */
.kp-org-edit-flash { animation: orgSaved 2.2s ease-out; }
@keyframes orgSaved {
  0% { background: var(--accent-soft); border-color: var(--accent); }
  100% { background: transparent; border-color: var(--line); }
}
/* правка МО открывается ПОД своей строкой (25.09.2026: раньше блок уезжал в конец списка) */
.kp-org-edit-inline { margin: 0; border-radius: 0; border-left: 0; border-right: 0; border-top: 0; background: var(--bg); }
.kp-org-edit-inline h3 .kp-refs-panel-sub { font-weight: 400; }
/* полоса загрузки файла (оборудование): проценты + отмена (25.09.2026) */
.eq-upl-prog { margin-top: 14px; }
.eq-upl-track { height: 10px; background: var(--field); border-radius: 6px; overflow: hidden; }
.eq-upl-fill { height: 100%; width: 0; background: var(--accent); border-radius: 6px;
               transition: width .25s ease-out; }
.eq-upl-row { display: flex; gap: 12px; align-items: center; justify-content: space-between;
              margin-top: 8px; font-size: 13px; color: var(--sub); }

/* группа похожих названий МО на экране справочника (сворачиваемая, 27.09.2026) */
.kp-org-simline { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin: 0 0 14px; }
.kp-sim-group { border: 1px solid var(--line); border-left: 3px solid var(--accent); border-radius: 10px; margin-bottom: 12px; }
.kp-sim-group-head { display: flex; align-items: center; gap: 8px; cursor: pointer; list-style: none;
                     padding: 10px 14px; user-select: none;
                     font-size: 10.5px; letter-spacing: .6px; text-transform: uppercase; color: var(--faint); font-weight: 700; }
.kp-sim-group-head::-webkit-details-marker { display: none; }
.kp-sim-group-head::before { content: "▸"; color: var(--accent); font-size: 12px; transition: transform .15s; }
.kp-sim-group[open] > .kp-sim-group-head::before { transform: rotate(90deg); }
.kp-sim-group-head:hover { background: var(--row-hover); border-radius: 10px 10px 0 0; }
.kp-sim-form { padding: 0 14px 12px; }
.kp-sim-hint-line { margin: 0 0 8px; font-size: 11.5px; color: var(--faint); }
.kp-sim-rows { display: flex; flex-direction: column; gap: 4px; margin-bottom: 10px; }
.kp-sim-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) 230px; gap: 10px; align-items: center; padding: 7px 8px; border-radius: 8px; cursor: pointer; }
.kp-sim-row:hover { background: var(--row-hover); }
.kp-sim-row input[type=radio] { accent-color: var(--accent); width: 15px; height: 15px; }
.kp-sim-name { font-size: 13px; }
.kp-sim-meta { color: var(--faint); font-size: 11.5px; text-align: right; }
.kp-sim-act { display: flex; flex-direction: column; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.kp-sim-line { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.kp-sim-select {
  height: 36px; padding: 0 10px; max-width: 420px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
  color: var(--ink); font-size: 13px; font-family: inherit;
}
.kp-sim-hint { text-transform: none; letter-spacing: 0; font-weight: 400; }
.kp-sim-act input[type=text] {
  height: 36px; padding: 0 12px; background: var(--field); border: 1px solid var(--field-border);
  border-radius: 8px; color: var(--ink); font-size: 13px; font-family: inherit;
}
.kp-org-edit h3 { font-size: 15px; margin-bottom: 12px; }
.kp-org-edit h4 { font-size: 13px; color: var(--sub); margin: 16px 0 10px; }
.kp-org-rename { display: flex; gap: 8px; flex-wrap: wrap; }

/* ================= Черновики заявок КП ================= */
/* счётчик «Черновики» в панели статистики (ссылка на фильтр) */
.kp-stat-drafts { text-decoration: none; cursor: pointer; }
.kp-stat-drafts:hover .kp-stat-name { color: var(--badge-me-t); }
.kp-stat-drafts.on .kp-stat-name { color: var(--badge-me-t); font-weight: 700; }

/* чекбокс «только мои черновики» в фильтрах */
.kp-chk-drafts {
  display: inline-flex; align-items: baseline; gap: 8px;
  height: 40px; padding: 9px 13px 0; cursor: pointer;
  background: var(--field); border: 1px solid var(--badge-me-t); border-radius: 9px;
  box-sizing: border-box;
}
.kp-chk-drafts input { accent-color: var(--badge-me-t); margin: 0; }
.kp-chk-t { font-weight: 700; font-size: 12.5px; color: var(--badge-me-t); white-space: nowrap; }
.kp-chk-s { font-size: 10.5px; color: var(--faint); white-space: nowrap; }

/* фильтр «с расчётом» — компактная галочка, автосабмит */
.kp-chk-calc {
  display: inline-flex; align-items: center; gap: 5px;
  height: 40px; padding: 0 10px; cursor: pointer;
  background: var(--field); border: 1px solid var(--accent); border-radius: 9px;
}
.kp-chk-calc input { accent-color: var(--accent); margin: 0; width: 14px; height: 14px; }
.kp-chk-calc .kp-chk-t { font-weight: 700; font-size: 11.5px; color: var(--accent); white-space: nowrap; }

/* Колонка «Расчёт» в реестре КП: посчитана ли по заявке услуга калькулятором.
   Валера, 10.09.2026: «в реестре КП нет признака, что там применён калькулятор расчётов».
   13.09.2026: три колонки «Без НДС · НДС · С НДС» пробовали показывать в реестре — Валера
   попросил убрать («не нужно их визуально в реестре отображать»), поэтому здесь снова одна
   сумма с НДС; тройка колонок осталась только в выгрузке Excel. */
.kp-table .kp-calc { width: 116px; }
.kp-calc-m { display: block; font-size: 11.5px; color: var(--accent); white-space: nowrap; }
.kp-calc-sum { display: block; font-size: 11px; color: var(--num); white-space: nowrap; margin-top: 2px; }
.kp-calc-none { color: var(--faint); }

/* жёлтые строки-черновики в таблице реестра (отдельный tbody сверху) */
.kp-draft-dim { color: var(--faint); }
.kp-draft-tbody tr td {
  background: var(--badge-me-b);
  border-bottom: 1px solid var(--line);
}
.kp-draft-tbody tr td:first-child { box-shadow: inset 3px 0 0 var(--badge-me-t); }
.kp-draft-tbody tr:hover td { background: var(--badge-me-hover); }
.kp-draft-tbody td a { color: var(--ink); }

/* плашка автосохранения в форме (режимы новая/черновик) */
.kp-draft-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 10px 16px; margin: 0 0 16px;
  background: var(--badge-me-b); border: 1px solid var(--badge-me-t); border-radius: 10px;
}
.kp-draft-bar-dot {
  width: 9px; height: 9px; border-radius: 50%; background: var(--badge-me-t);
  box-shadow: 0 0 0 3px var(--badge-me-hover);
}
.kp-draft-bar-t { font-weight: 700; color: var(--badge-me-t); font-size: 13.5px; }
.kp-draft-bar-s { color: var(--sub); font-size: 12px; }
.kp-draft-bar-ok { margin-left: auto; color: var(--badge-me-t); font-size: 12px; font-weight: 600; white-space: nowrap; }

/* низ формы черновика: удалить слева, действия справа */
.kp-form-actions-grow { flex: 1; }
.kp-draft-del-form { margin: 0; }

/* экран «+ Новая заявка» при наличии черновика */
.kp-draft-prompt { padding: 22px; }
.kp-draft-hero {
  display: flex; align-items: center; gap: 18px; flex-wrap: wrap;
  padding: 18px 20px;
  background: var(--badge-me-b); border: 1px solid var(--badge-me-t); border-radius: 12px;
}
.kp-draft-hero-ico {
  width: 44px; height: 44px; flex: 0 0 44px; border-radius: 11px; display: grid; place-items: center;
  background: var(--badge-me-hover); font-size: 19px; color: var(--badge-me-t);
}
.kp-draft-hero-main { flex: 1 1 300px; min-width: 0; }
.kp-draft-hero-row { display: flex; align-items: center; gap: 10px; margin-bottom: 7px; }
.kp-draft-hero-time { font-size: 11px; color: var(--sub); }
.kp-draft-hero-t { font-size: 16px; font-weight: 700; color: var(--ink); }
.kp-draft-hero-s { margin-top: 4px; font-size: 12.5px; color: var(--sub); }
.kp-draft-hero-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.kp-draft-more { margin-top: 14px; font-size: 12.5px; color: var(--sub); }
.kp-draft-prompt-note {
  margin-top: 22px; padding-top: 14px; border-top: 1px solid var(--line);
  color: var(--faint); font-size: 12.5px; line-height: 1.7;
}
.kp-draft-prompt-note p { margin: 0 0 6px; }
.kp-draft-prompt-note b { color: var(--sub); }

/* заблокированные заявки: «Закрыта» или «Возврат» — серый стиль, без редактирования */
.kp-locked {
  opacity: .55;
  pointer-events: none;
  user-select: none;
}
.kp-locked-head {
  opacity: .75;
}
.kp-lock-badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  color: var(--faint);
  background: var(--row-hover);
  border: 1px solid var(--line);
  border-radius: 6px;
  padding: 2px 8px;
  margin-left: 4px;
}
.kp-row-locked {
  opacity: .55;
}
.kp-row-locked:hover td {
  background: transparent;
}
.kp-row-locked a { pointer-events: none; }

@media (max-width: 1200px) {
  .kp-form-grid, .kp-vcols { grid-template-columns: 1fr; }
  .kp-refs-layout { grid-template-columns: 1fr; }
}
@media (max-width: 1100px) {
  .kp-ref-row { grid-template-columns: 1fr 70px 120px; }
  .kp-ref-row .kp-ref-acts { grid-column: 1 / -1; justify-content: flex-start; }
}

/* ============ рабочий стол: блок «Последние расчёты» ============ */
.ds-wrap {
  margin-top: 16px; overflow-x: auto;
  border: 1px solid var(--line); border-radius: 10px;
}
.ds-table { border-collapse: collapse; width: 100%; min-width: 860px; }
.ds-table th, .ds-table td { padding: 9px 12px; text-align: left; font-size: 12.5px; }
.ds-table th {
  color: var(--faint); font-weight: 700; font-size: 10.5px; letter-spacing: .8px;
  text-transform: uppercase; white-space: nowrap;
  background: var(--accent-soft); border-bottom: 1px solid var(--line);
}
.ds-table td { border-bottom: 1px solid var(--line); vertical-align: middle; }
.ds-table tbody tr:last-child td { border-bottom: none; }
.ds-table tbody tr:hover td { background: var(--row-hover); }
.ds-table .ds-date { white-space: nowrap; color: var(--sub); width: 86px; }
.ds-table th.ds-date { width: 86px; }
.ds-mo a { color: var(--ink); font-weight: 700; text-decoration: none; }
.ds-mo a:hover { color: var(--accent); }
.ds-okc { white-space: nowrap; color: var(--ink); }
.ds-dim { color: var(--faint); }
.ds-note { display: block; color: var(--badge-me-t); font-size: 10px; margin-top: 3px; white-space: nowrap; }
.ds-acts { width: 96px; text-align: right; white-space: nowrap; }
.ds-open { color: var(--accent); font-weight: 600; font-size: 11.5px; }
.ds-hint { margin-top: 10px; color: var(--faint); font-size: 11px; }

/* жёлтые строки-черновики (свои, сверху) — как в реестре КП */
.ds-draft-tbody tr td {
  background: var(--badge-me-b);
  border-bottom: 1px solid var(--line);
}
.ds-draft-tbody tr td:first-child { box-shadow: inset 3px 0 0 var(--badge-me-t); }
.ds-draft-tbody tr:hover td { background: var(--badge-me-hover); }
.ds-draft-tbody td a { color: var(--ink); }
.ds-draft-tbody .ds-mo a { font-weight: 700; }

/* рабочий стол: растянуть панель «Последние расчёты» на всё свободное место */
.desktop-page { display: flex; flex-direction: column; min-height: calc(100vh - 56px); }
.desktop-page > .panel:last-of-type { flex: 1 1 auto; display: flex; flex-direction: column; }
.desktop-page > .panel:last-of-type > .ds-wrap { flex: 1; overflow-y: auto; }

/* ============ конструктор справочников (админ-раздел «Справочники») ============ */
.dc-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; flex-wrap: wrap; }
.dc-head .btn { flex: none; }
.dc-meta-inline { color: var(--faint); font-size: 12px; }

.dc-summary { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.dc-sum-item { display: flex; flex-direction: column; gap: 4px; min-width: 190px; }
.dc-sum-cap { color: var(--faint); font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.dc-sum-num { font-size: 20px; font-weight: 700; color: var(--num); }
.dc-sum-hint { border-left: 1px solid var(--line); padding-left: 22px; color: var(--sub); font-size: 12.5px; }
.dc-sum-hint div + div { margin-top: 3px; }

.dc-panel { overflow-x: auto; padding: 0; }
.dc-table { width: 100%; border-collapse: collapse; min-width: 1020px; }
.dc-table th, .dc-table td { padding: 12px 14px; text-align: left; vertical-align: top; }
.dc-table th {
  color: var(--faint); font-size: 10px; font-weight: 700; letter-spacing: .8px;
  text-transform: uppercase; background: var(--bg); white-space: nowrap;
}
.dc-table td { border-top: 1px solid var(--line); }
.dc-table tbody tr:hover td { background: var(--row-hover); }
.dc-table td:first-child, .dc-table th:first-child { padding-left: 22px; }
.dc-table td:last-child, .dc-table th:last-child { padding-right: 22px; }
.dc-act-col { text-align: right; }

.dc-cell-name { width: 250px; }
.dc-name { display: block; font-weight: 700; color: var(--ink); }
.dc-meta { display: block; color: var(--faint); font-size: 11px; margin-top: 3px; }
.dc-cell-fields { max-width: 330px; }
.dc-chip {
  display: inline-flex; align-items: center; gap: 6px; margin: 0 5px 5px 0;
  padding: 4px 10px; border: 1px solid var(--line); border-radius: 11px;
  background: var(--bg); font-size: 11.5px; color: var(--ink); white-space: nowrap;
}
.dc-chip em { color: var(--faint); font-style: normal; }
.dc-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--faint); flex: none; }
.dc-t-number .dc-dot { background: var(--num); }
.dc-t-date .dc-dot { background: var(--badge-open-t); }
.dc-t-bool .dc-dot { background: var(--badge-me-t); }
.dc-t-choice .dc-dot { background: var(--accent); }
.dc-none { color: var(--faint); font-size: 12.5px; }
.dc-vis { color: var(--sub); font-size: 13px; }
.dc-count { color: var(--num); font-weight: 700; font-size: 13.5px; }

.dc-actions { text-align: right; white-space: nowrap; }
.dc-acts { display: inline-flex; align-items: center; gap: 2px; }
.dc-acts[hidden], .dc-del[hidden] { display: none; }
.dc-act {
  display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 28px; border: 0; border-radius: 7px; background: transparent;
  color: var(--faint); font-size: 15px; line-height: 1; cursor: pointer; text-decoration: none;
}
.dc-act:hover { background: var(--row-hover); color: var(--ink); }
.dc-del-btn:hover { background: var(--danger-b); color: var(--danger-t); }
.dc-act-danger { color: var(--danger-t); }
.dc-act-danger:hover { background: var(--danger-b); color: var(--danger-t); }
.dc-del { display: inline-flex; align-items: center; gap: 4px; }
.dc-del-q { color: var(--danger-t); font-size: 11.5px; }
.dc-del-form { display: inline-block; margin: 0; }
.dc-empty { color: var(--faint); padding: 20px 22px; }
.dc-foot { margin-top: 12px; color: var(--faint); font-size: 11.5px; line-height: 1.6; }
.dc-foot b { color: var(--sub); }

/* форма конструктора */
.dc-card { margin-bottom: 18px; }
.dc-card h2 { font-size: 15px; }
.dc-card-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.dc-card-head h2 { flex: none; }
.dc-card-sub { color: var(--faint); font-size: 11px; }
.dc-card-head .btn { margin-left: auto; }
.dc-card-body { margin-top: 16px; }
.dc-name-field input { max-width: 420px; }
.dc-hint { color: var(--faint); font-size: 11.5px; margin-top: 6px; }
.dc-group { margin-top: 16px; }
.dc-group-cap {
  display: block; color: var(--faint); font-size: 10px; font-weight: 700;
  letter-spacing: .8px; text-transform: uppercase; margin-bottom: 8px;
}
.dc-radios { display: flex; gap: 14px; flex-wrap: wrap; }
.dc-radio {
  display: flex; flex-direction: column; gap: 2px; min-width: 250px; cursor: pointer;
  border: 1.2px solid var(--field-border); border-radius: 9px; padding: 9px 14px 9px 36px;
  position: relative; background: var(--field);
}
.dc-radio input { position: absolute; left: 12px; top: 12px; accent-color: var(--accent); }
.dc-radio.on { border-color: var(--accent); background: var(--accent-soft); }
.dc-radio-t { font-size: 12.5px; font-weight: 700; color: var(--ink); }
.dc-radio-s { font-size: 10.5px; color: var(--faint); }
.dc-vis-group { max-width: 420px; }
.dc-checkline { display: flex; align-items: center; gap: 9px; font-size: 12.5px; padding: 5px 0; cursor: pointer; }
.dc-checkline input { accent-color: var(--accent); width: 15px; height: 15px; }
.dc-checkline.disabled { color: var(--faint); cursor: default; }

.dc-fields-head {
  display: grid; grid-template-columns: 18px 26px 1fr 210px 240px 108px;
  gap: 10px; margin: 18px 0 6px; padding: 0 12px;
  color: var(--faint); font-size: 9.5px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase;
}
.dc-rows { display: flex; flex-direction: column; gap: 8px; }
.dc-fieldrow {
  display: grid; grid-template-columns: 18px 26px 1fr 210px 240px 108px;
  gap: 10px; align-items: center; padding: 7px 12px;
  border: 1px solid var(--line); border-radius: 9px; background: var(--bg);
}
.dc-fieldrow-new { border-style: dashed; border-color: var(--field-border); background: transparent; }
.dc-grip { width: 14px; height: 12px; opacity: .55;
  background-image: linear-gradient(var(--faint), var(--faint)), linear-gradient(var(--faint), var(--faint)), linear-gradient(var(--faint), var(--faint));
  background-size: 100% 1.4px; background-position: 0 0, 0 5px, 0 10px; background-repeat: no-repeat; }
.dc-fnum { color: var(--faint); font-size: 11px; text-align: right; }
.dc-fname, .dc-ftype, .dc-fopts {
  width: 100%; padding: 9px 11px; border: 1.2px solid var(--field-border); border-radius: 8px;
  background: var(--field); color: var(--ink); font-size: 12.5px; font-family: inherit;
}
.dc-fname:focus, .dc-ftype:focus, .dc-fopts:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft);
}
.dc-fname.numfield { border-color: var(--num); }
.dc-fopts.off { opacity: .45; }
.dc-fbtns { display: inline-flex; gap: 3px; justify-content: flex-end; }
.dc-fbtn {
  width: 30px; height: 30px; border: 1px solid var(--field-border); border-radius: 7px;
  background: var(--field); color: var(--sub); font-size: 13px; cursor: pointer;
}
.dc-fbtn:hover:not(:disabled) { border-color: var(--accent); color: var(--ink); }
.dc-fbtn:disabled { opacity: .35; cursor: default; }
.dc-fdel:hover { border-color: var(--danger-t); color: var(--danger-t); }

.dc-tip {
  margin-top: 16px; padding: 12px 16px; border-radius: 9px; background: var(--bg);
  color: var(--sub); font-size: 11.5px; line-height: 1.7;
}
.dc-tip-warn { color: var(--badge-me-t); }

.dc-actions-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.dc-bar-hint { color: var(--faint); font-size: 11.5px; }

@media (max-width: 1150px) {
  .dc-fields-head { display: none; }
  .dc-fieldrow { grid-template-columns: 18px 26px 1fr; grid-auto-rows: auto; }
  .dc-fieldrow .dc-ftype, .dc-fieldrow .dc-fopts { grid-column: 3; }
  .dc-fieldrow .dc-fbtns { grid-column: 3; }
}


/* ================= Значения справочника (этап 1, сессия 1.3) ================= */
.dv-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.dv-crumbs { font-size: 12px; color: var(--faint); margin-bottom: 6px; }
.dv-crumbs a { color: var(--faint); text-decoration: none; }
.dv-crumbs a:hover { color: var(--ink); }
.dv-crumbs span { margin: 0 4px; }
.dv-sub { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dv-sub-txt { color: var(--sub); font-size: 13.5px; }
.dv-head-actions { display: flex; gap: 8px; flex: none; }

.dv-summary { display: flex; align-items: center; gap: 22px; flex-wrap: wrap; }
.dv-sum-item { display: flex; flex-direction: column; gap: 4px; min-width: 190px; }
.dv-sum-cap { color: var(--faint); font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.dv-sum-num { font-size: 20px; font-weight: 700; color: var(--num); }
.dv-sum-fields { display: flex; gap: 8px; flex-wrap: wrap; flex: 1 1 420px; }
.dv-chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 3px 11px; border-radius: 11px;
  background: var(--bg); border: 1px solid var(--line);
  color: var(--ink); font-size: 11.5px;
}
.dv-chip em { color: var(--faint); font-style: normal; }
.dv-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--faint); flex: none; }
.dv-t-number .dv-dot { background: var(--num); }
.dv-t-date .dv-dot { background: var(--badge-open-t); }
.dv-t-bool .dv-dot { background: var(--badge-me-t); }
.dv-t-choice .dv-dot { background: var(--accent); }
/* тип «Файл» (Валера, 15.09.2026): документ в ячейке — своим цветом, чтобы отличать от выбора */
.dv-t-file .dv-dot { background: var(--badge-me-t); }
.dv-sum-hint { flex: 1 1 100%; color: var(--sub); font-size: 12.5px; border-top: 1px solid var(--line); padding-top: 10px; }

.dv-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 12px 0 10px; }
.dv-search { display: flex; align-items: center; gap: 8px; margin: 0; }
.dv-search input[type=search] {
  height: 38px; padding: 0 12px; min-width: 280px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 9px;
  color: var(--ink); font-size: 13.5px; font-family: inherit;
}
.dv-clear { color: var(--faint); font-size: 12px; text-decoration: none; }
.dv-clear:hover { color: var(--ink); }
.dv-bar-cap { color: var(--faint); font-size: 10px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.dv-sort { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.dv-sort-btn {
  padding: 8px 14px; border-radius: 9px; border: 1px solid var(--field-border);
  background: var(--field); color: var(--sub); font-size: 12.5px; text-decoration: none;
}
.dv-sort-btn:hover { color: var(--ink); }
.dv-sort-btn.on { background: var(--accent-soft); border-color: var(--accent); color: var(--ink); font-weight: 700; }
.dv-found { margin-left: auto; color: var(--faint); font-size: 12px; }

.dv-panel { padding: 0; overflow-x: auto; display: inline-block; max-width: 100%; }
.dv-table { border-collapse: collapse; table-layout: auto; }
/* выравнивание значений: текст — слева, числа — справа (Валера, 28.09.2026:
   «поле с текстом пусть выравнивается по левому краю»). Раньше весь текст стоял по центру */
.dv-table th, .dv-table td { padding: 6px 10px; text-align: left; vertical-align: middle; }
.dv-table th.dv-num-col, .dv-table td.dv-num { text-align: center; }
/* колонка значения — одинаковая и узкая: поля стоят рядом друг с другом, а не разъезжаются */
.dv-table th.dv-vcol, .dv-table td.dv-vcol { width: 142px; }
/* тонкие разделители колонок: шапка и значения стоят столбиками, ничего не разъезжается */
.dv-table th + th, .dv-table td + td { border-left: 1px solid var(--line); }
.dv-table th {
  color: var(--sub); font-size: 10.5px; font-weight: 700; letter-spacing: .6px;
  text-transform: uppercase; background: var(--bg); white-space: nowrap;
}
.dv-table td { border-top: 1px solid var(--line); font-size: 13px; color: var(--ink); line-height: 1.3; }
.dv-table tbody tr:hover td { background: var(--row-hover); }
.dv-num-col { width: 40px; min-width: 40px; }
.dv-num { color: var(--faint); font-size: 12px; }
.dv-cell.dv-c-number { text-align: right; font-family: var(--mono, monospace); font-weight: 600; color: var(--num); padding-right: 12px; }
.dv-act-col { width: 150px; min-width: 150px; }
/* колонка действий — у правого края: правило выше (`.dv-table th/td`) сильнее одиночного класса,
   поэтому пишем селекторы с той же силой, иначе кнопки ✎ ✕ уезжают в середину/влево */
.dv-table th.dv-act-col, .dv-table td.dv-actions { text-align: right; }
.dv-actions { white-space: nowrap; display: flex; align-items: center; gap: 2px; justify-content: flex-end; }
.dv-table tbody tr:hover td.dv-actions { background: var(--row-hover); }
.dv-acts { display: inline-flex; align-items: center; gap: 2px; }
.dv-acts[hidden], .dv-del[hidden] { display: none; }
.dv-act {
  display: inline-grid; place-items: center;
  min-width: 24px; height: 24px; padding: 0 5px; border-radius: 6px;
  background: transparent; border: 0; cursor: pointer;
  color: var(--sub); font-size: 14px; text-decoration: none;
}
.dv-act:hover { background: var(--row-hover); color: var(--ink); }
.dv-del-btn:hover { background: var(--danger-b); color: var(--danger-t); }
.dv-act-danger { color: var(--danger-t); }
.dv-act-danger:hover { background: var(--danger-b); }
.dv-del { display: inline-flex; align-items: center; gap: 4px; }
.dv-del-q { color: var(--danger-t); font-size: 11.5px; }
.dv-del-form { display: inline-block; margin: 0; }
.dv-ro { color: var(--faint); font-size: 11.5px; }
.dv-empty { color: var(--faint); padding: 22px; text-align: center; }

.dv-row-edit td { background: var(--accent-soft) !important; padding: 4px 10px; }
.dv-new-row td { border-top: 1px dashed var(--field-border); background: var(--bg); padding: 4px 10px; }
.dv-new-row .dv-num { color: var(--accent); font-weight: 700; }
.dv-in {
  width: 100%; height: 28px; padding: 0 8px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 6px;
  color: var(--ink); font-size: 13px; font-family: inherit;
  text-align: center; box-sizing: border-box; max-width: 220px;
}
.dv-c-text .dv-in { max-width: 100%; text-align: left; }
.dv-c-number .dv-in { max-width: 100%; text-align: right; }
.dv-c-date .dv-in { max-width: 130px; }
.dv-c-choice .dv-in { max-width: 162px; }
.dv-c-bool .dv-in { width: auto; max-width: none; }
.dv-c-file .dv-drop { max-width: 142px; }
.dv-in.mono { font-family: var(--mono, monospace); }
.dv-check { display: inline-flex; align-items: center; gap: 6px; color: var(--sub); font-size: 12.5px; }
.dv-check input { accent-color: var(--accent); }
.dv-inline-form { display: inline-block; margin: 0 6px 0 0; }
.dv-pager { display: flex; align-items: center; gap: 12px; margin-top: 12px; }
.dv-page { color: var(--faint); font-size: 12.5px; }
.dv-foot { margin-top: 12px; color: var(--faint); font-size: 11.5px; line-height: 1.6; }

/* ─────────── 💬 комментарий к строке и 📎 вложение (тип «Файл») — 15.09.2026 ─────────── */
/* кнопка 💬 живёт в группе «Действия» вместе с ↑↓ ✎ ✕ (Валера, 28.09.2026) */
.dv-mv-form { display: inline-flex; margin: 0; }
.dv-cmt-btn {
  background: none; border: none; border-radius: 6px; cursor: pointer;
  font-size: 14px; line-height: 1; padding: 2px 4px; filter: grayscale(1); opacity: .55;
}
.dv-cmt-btn:hover { background: var(--row-hover); opacity: 1; }
.dv-cmt-btn.on { filter: none; opacity: 1; }
/* блок комментария идёт ВТОРОЙ строкой таблицы: у него нет верхней границы, чтобы читался
   как «подстроку» основной строки (как в макете design/dict-values-comment-file.png) */
.dv-cmt-row td.dv-cmt-td {
  border-top: none; padding: 0 16px 12px 16px; background: transparent; text-align: left;
}
.dv-table tbody tr.dv-cmt-row:hover td { background: transparent; }
.dv-cmt-row[hidden] { display: none; }
.dv-cmt-box {
  background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px;
  max-width: 820px;
}
.dv-cmt-ta {
  width: 100%; box-sizing: border-box; min-height: 46px; resize: vertical;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 6px;
  color: var(--ink); font: inherit; font-size: 12.5px; padding: 8px 10px;
}
.dv-cmt-ta:focus { outline: none; border-color: var(--accent); }
.dv-cmt-hint {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  color: var(--faint); font-size: 11.5px; margin-top: 6px;
}
.dv-cmt-form { margin: 0; }
.dv-cmt-view { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.dv-cmt-view[hidden], .dv-cmt-form[hidden] { display: none; }
.dv-cmt-edit, .dv-cmt-cancel, .dv-cmt-add {
  background: none; border: none; cursor: pointer; padding: 0; font: inherit;
  font-size: 11.5px; color: var(--accent); border-bottom: 1px dotted var(--accent);
}
.dv-cmt-cancel { color: var(--faint); border-bottom-color: var(--faint); }
.dv-cmt-add { color: var(--faint); border-bottom-style: dashed; }
.dv-cmt-add:hover, .dv-cmt-edit:hover { color: var(--ink); }
/* пустой комментарий: блок тише, но ВИДЕН — по нему понятно, что тут можно писать */
.dv-cmt-box.dv-cmt-empty { background: transparent; border-style: dashed; padding: 7px 12px; }
.dv-cmt-text { color: var(--sub); font-size: 12.5px; white-space: pre-wrap; }
/* вложение */
.dv-file { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; }
.dv-file-badge {
  display: inline-flex; align-items: center; gap: 6px; max-width: 220px;
  background: var(--accent-soft); border: 1px solid var(--accent); border-radius: 6px;
  padding: 4px 8px; color: var(--ink); font-size: 11.5px; text-decoration: none;
}
.dv-file-badge:hover { background: var(--row-hover); }
.dv-file-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-file-badge em { color: var(--faint); font-style: normal; flex: none; }
.dv-paperclip {
  width: 8px; height: 12px; flex: none; border: 1.4px solid var(--accent);
  border-radius: 4px 4px 5px 5px; border-left-color: var(--accent);
}
.dv-file-x {
  background: none; border: none; cursor: pointer; color: var(--faint); font-size: 11px;
  padding: 2px 4px; border-radius: 5px;
}
.dv-file-x:hover { color: var(--danger-t); background: var(--danger-b); }
.dv-file-del, .dv-drop-form { display: inline; margin: 0; }
.dv-file-gone { display: block; color: var(--danger-t); font-size: 11px; font-style: normal; }
.dv-file-empty { color: var(--faint); }
.dv-drop {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  width: 100%; min-height: 34px; box-sizing: border-box; cursor: pointer;
  border: 1.2px dashed var(--field-border); border-radius: 6px; padding: 4px 10px;
  color: var(--faint); font-size: 11px;
}
.dv-drop:hover { border-color: var(--accent); color: var(--sub); }
.dv-drop.over { border-color: var(--accent); background: var(--accent-soft); color: var(--ink); }
.dv-drop-in { position: absolute; width: 1px; height: 1px; opacity: 0; }
.dv-drop-cap {
  border-bottom: 1px dotted var(--faint); white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.dv-drop-cap::before { content: "📄 "; }

/* ---------- конструктор расчётов (сессия 1.4) ---------- */
.msg-warning { background: var(--badge-me-b); color: var(--badge-me-t); }

.cv-head { align-items: flex-start; }
.cv-crumb { color: var(--faint); font-size: 12px; margin-bottom: 6px; }
.cv-crumb a { color: var(--sub); }
.cv-head h1 { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cv-head-acts { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.cv-new { display: flex; gap: 10px; align-items: center; }
.cv-new input { width: 300px; }

.cv-cap { display: block; font-size: 9.5px; letter-spacing: .8px; color: var(--faint); font-weight: 700; text-transform: uppercase; }
.cv-hint { color: var(--faint); font-size: 11.5px; }
.cv-none { color: var(--faint); font-size: 12.5px; }
.cv-foot { margin-top: 14px; color: var(--faint); font-size: 11.5px; line-height: 1.7; }

/* верхняя сводка списка расчётов */
.cv-summary { display: flex; gap: 34px; align-items: center; flex-wrap: wrap; }
.cv-sum-item { display: flex; flex-direction: column; gap: 2px; }
.cv-sum-cap { font-size: 10.5px; letter-spacing: .7px; color: var(--faint); text-transform: uppercase; font-weight: 700; }
.cv-sum-num { font-size: 22px; color: var(--num); font-weight: 600; }
.cv-sum-hint { color: var(--sub); font-size: 12.5px; line-height: 1.7; max-width: 780px; }

/* таблица списка расчётов */
.cv-panel { margin-top: 14px; }
.cv-table { width: 100%; border-collapse: collapse; }
.cv-table th {
  text-align: left; font-size: 9.5px; letter-spacing: .8px; color: var(--faint);
  text-transform: uppercase; padding: 10px 12px; border-bottom: 1px solid var(--line);
}
.cv-table td { padding: 12px; border-bottom: 1px solid var(--line); vertical-align: top; font-size: 13px; }
.cv-table tr:hover td { background: var(--row-hover); }
.cv-act-col { width: 130px; text-align: right; }
.cv-cell-name { display: flex; flex-direction: column; gap: 3px; }
.cv-name { color: var(--ink); font-weight: 600; text-decoration: none; }
.cv-name:hover { color: var(--accent); }
.cv-meta { color: var(--faint); font-size: 11.5px; }
.cv-inline-badge { margin-left: 6px; }
.cv-cell-cubes { max-width: none; }
.cv-chip {
  display: inline-flex; align-items: baseline; gap: 5px; margin: 0 6px 6px 0;
  padding: 4px 9px; border: 1px solid var(--field-border); border-radius: 8px;
  background: var(--field); font-size: 12px;
}
.cv-chip em { color: var(--faint); font-style: normal; font-size: 10.5px; }
.cv-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--faint); align-self: center; }
.cv-src-manual .cv-dot { background: var(--sub); }
.cv-src-list .cv-dot { background: var(--badge-grp-t); }
.cv-src-table .cv-dot { background: var(--badge-me-t); }
.cv-src-expense .cv-dot { background: var(--num); }
.cv-src-dict .cv-dot { background: var(--badge-open-t); }
.cv-src-formula .cv-dot { background: var(--accent); }
.cv-total-chip {
  display: inline-block; margin-right: 6px; padding: 3px 9px; border-radius: 8px;
  background: var(--accent-soft); color: var(--num); font-size: 11.5px;
}
.cv-state { font-size: 12px; padding: 3px 9px; border-radius: 8px; }
.cv-state-ok { background: var(--badge-open-b); color: var(--badge-open-t); }
.cv-state-bad { background: var(--danger-b); color: var(--danger-t); }
.cv-actions { position: relative; text-align: right; }
.cv-acts { display: inline-flex; gap: 6px; align-items: center; }
.cv-inline-form { display: inline; }
.cv-act {
  display: inline-flex; align-items: center; justify-content: center; min-width: 26px; height: 24px;
  padding: 0 7px; border: 1px solid var(--field-border); border-radius: 7px; background: var(--field);
  color: var(--sub); font-size: 12px; cursor: pointer; text-decoration: none;
}
.cv-act:hover { border-color: var(--accent); color: var(--ink); }
.cv-act-ok { color: var(--badge-open-t); border-color: var(--badge-open-t); }
.cv-act-danger { color: var(--danger-t); border-color: var(--danger-t); }
.cv-del { display: inline-flex; gap: 6px; align-items: center; }
.cv-del-q { color: var(--sub); font-size: 11.5px; }
.cv-del-form { display: inline; }
.cv-empty { color: var(--faint); text-align: center; padding: 26px 12px; }

/* проверка шаблона */
.cv-check { margin-top: 14px; }
.cv-check-ok { border-left: 3px solid var(--badge-open-t); }
.cv-check-bad { border-left: 3px solid var(--danger-t); }
/* макет v3: «Проверка услуги» — заголовок слева, тихая подсказка справа (как у остальных панелей) */
.cv-check-head {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
  justify-content: space-between; font-weight: 700; font-size: 14px; margin-bottom: 8px;
}
.cv-check-head .cv-hint { font-weight: 400; }
.cv-check-ok .cv-check-head { color: var(--badge-open-t); }
.cv-check-bad .cv-check-head { color: var(--danger-t); }
.cv-check-list { margin: 0 0 8px 18px; color: var(--sub); font-size: 13px; line-height: 1.8; }
.cv-check-foot { color: var(--faint); font-size: 11.5px; }

/* шапка шаблона */
.cv-panel-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.cv-panel-head h2 { font-size: 16px; }
.cv-grid { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(280px, 1.6fr) 150px; gap: 14px; }
.cv-field { display: flex; flex-direction: column; gap: 5px; }
.cv-field-wide { min-width: 0; }
.cv-field-narrow input { width: 100%; }
.cv-checks { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; margin-top: 14px; }
.cv-check-cap { font-size: 9.5px; letter-spacing: .8px; color: var(--faint); font-weight: 700; text-transform: uppercase; display: flex; align-items: center; gap: 8px; }
.cv-cb { display: inline-flex; gap: 7px; align-items: center; color: var(--sub); font-size: 12.5px; }
.cv-cb-mini { font-size: 11.5px; margin-top: 6px; }
.cv-form-foot { display: flex; gap: 14px; align-items: center; margin-top: 18px; }

/* таблица кубиков */
.cv-cubes { width: 100%; border-collapse: collapse; }
.cv-cubes th {
  text-align: left; font-size: 9.5px; letter-spacing: .8px; color: var(--faint);
  text-transform: uppercase; padding: 9px 10px; border-bottom: 1px solid var(--line);
}
.cv-cubes td { padding: 9px 10px; border-bottom: 1px solid var(--line); vertical-align: top; font-size: 12.5px; }
.cv-col-num { width: 36px; color: var(--faint); }
.cv-col-type { width: 150px; }
.cv-col-src { width: 200px; }
.cv-col-acts { width: 140px; }
.cv-row-add td { background: var(--bg); }
/* строка статьи не должна прятаться под липкой шапкой, когда браузер прыгает к ней
   по якорю #cvrow… из кнопки ✎ (иначе правимая статья встаёт ровно под шапкой) */
.cv-row[data-cube] { scroll-margin-top: 76px; }
.cv-cube-name { font-weight: 600; color: var(--ink); }
.cv-src { font-size: 12px; }
.cv-src-tag-manual { color: var(--sub); }
.cv-src-tag-list { color: var(--badge-grp-t); }
.cv-src-tag-table { color: var(--badge-me-t); }
/* «Статья расходов» — тот же вид «вводит сотрудник», но с полем «Ед. изм.» в строках */
.cv-src-tag-expense { color: var(--num); }
.cv-src-tag-dict { color: var(--badge-open-t); }
.cv-src-tag-formula { color: var(--num); }
.cv-formula { color: var(--num); }
.cv-src-cell { min-width: 260px; }
.cv-src-row { display: flex; gap: 8px; flex-wrap: wrap; }
.cv-src-grp { display: flex; flex-direction: column; gap: 6px; }
/* ВАЖНО: у .cv-src-grp display:flex, который перебивает атрибут hidden —
   без этого правила у статьи видны ВСЕ источники сразу («всё в кучу») */
.cv-src-grp[hidden] { display: none !important; }

/* реквизиты статьи — рядом с названием: «итоговая статья» и «единица измерения».
   Место одно и то же у всех статей (любой источник) — настройка источника их не двигает */
.cv-rowprops { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 6px; }
.cv-unit-mini { display: inline-flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--faint); }
.cv-unit-mini .cv-unit { width: 92px; }

/* отклик на ✓ у строки: подсветка этой строки и подпись прямо в ней */
.cv-rowmsg { display: block; margin-top: 6px; font-size: 11.5px; }
.cv-rowmsg-ok { color: var(--badge-open-t); }
.cv-rowmsg-err { color: var(--danger-t); }
@keyframes cvSaved { 0% { background: var(--accent-soft); } 100% { background: transparent; } }
.cv-row.cv-row-flash-ok td { animation: cvSaved 1.8s ease-out; }
@keyframes cvFailed { 0% { background: var(--danger-b); } 100% { background: transparent; } }
.cv-row.cv-row-flash-err td { animation: cvFailed 1.8s ease-out; }

/* группы статей: «Исходные данные» и «Расчёт» */
.cv-group { margin-top: 20px; }
.cv-group:first-child { margin-top: 0; }
.cv-group-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.cv-group-head h3 { font-size: 13.5px; color: var(--ink); }
.cv-group[data-cv-group="portal"] .cv-group-head h3 { color: var(--num); }
.cv-group .cv-cubes { border-top: 1px solid var(--line); }

/* заготовки услуг (список) */
.cv-kit-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; }
.cv-kit-card {
  display: flex; flex-direction: column; gap: 8px; padding: 14px;
  border: 1px solid var(--field-border); border-radius: 12px; background: var(--field);
}
.cv-kit-title { font-size: 13.5px; font-weight: 600; color: var(--ink); }
.cv-kit-hint { font-size: 11.5px; color: var(--faint); line-height: 1.6; flex: 1; }
.cv-kit-card .btn { align-self: flex-start; }

/* быстрая сборка расчёта и готовые блоки */
.cv-build .cv-quick { display: flex; gap: 10px; align-items: center; }
.cv-build .cv-quick input { flex: 1; min-width: 240px; }
/* «Собрать расчёт» свёрнут по умолчанию (Валера, 11.09.2026): раскрывается щелчком по шапке.
   Маркер details убран — вместо него своя подпись «развернуть/свернуть». */
.cv-buildbox > summary { cursor: pointer; list-style: none; margin-bottom: 0; }
.cv-buildbox > summary::-webkit-details-marker { display: none; }
.cv-buildbox[open] > summary { margin-bottom: 14px; }
.cv-build-toggle { margin-left: auto; font-size: 11.5px; color: var(--accent); white-space: nowrap; }
.cv-build-toggle::after { content: "развернуть ▾"; }
.cv-buildbox[open] .cv-build-toggle::after { content: "свернуть ▴"; }
.cv-quick-hints { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 10px; }
.cv-components { margin-top: 18px; display: flex; flex-direction: column; gap: 8px; }
.cv-kit-row { display: flex; gap: 8px; flex-wrap: wrap; }
.cv-kit-btn {
  border: 1px dashed var(--field-border); background: transparent; color: var(--sub);
  border-radius: 9px; padding: 7px 12px; font-size: 12.5px; cursor: pointer;
}
.cv-kit-btn:hover { border-color: var(--accent); color: var(--ink); border-style: solid; }
.cv-refs { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.cv-ref {
  border: 1px dashed var(--field-border); background: transparent; color: var(--sub);
  border-radius: 7px; padding: 3px 8px; font-size: 11.5px; cursor: pointer;
}
.cv-ref:hover { border-color: var(--accent); color: var(--ink); }
.cv-ref-pct { border-style: solid; color: var(--badge-me-t); }

/* строка знаков: + − × ÷ ( ) % — вставляются в поле формулы по клику */
.cv-ops-row { margin-top: 6px; }
.cv-op {
  min-width: 26px; padding: 3px 7px; text-align: center;
  font-family: var(--mono, monospace); font-size: 13px; line-height: 1.2;
  color: var(--ink); border-style: solid;
}
.cv-op:hover { border-color: var(--accent); background: var(--accent-soft); }

/* стрелки ↑/↓: на краю группы неактивны, перемещённая строка подсвечивается */
.cv-act:disabled { opacity: .35; cursor: default; }
.cv-act:disabled:hover { color: var(--sub); border-color: var(--field-border); }
@keyframes cvMoved {
  0% { background: var(--accent-soft); }
  100% { background: transparent; }
}
.cv-row.is-moved td { animation: cvMoved 1.4s ease-out; }
/* клик по стрелке столбца принят, ответ ещё в пути: строка ждёт своей очереди (28.09.2026) */
.cv-colrow.kc-queued { opacity: .5; }

/* единая кнопка «Сохранить шаблон» — прилипает к низу экрана, чтобы не искать её */
.cv-save-bar {
  position: sticky; bottom: 0; z-index: 5;
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin-top: 16px; padding: 12px 16px;
  background: var(--card); border: 1px solid var(--card-border);
  border-radius: 12px; box-shadow: 0 -6px 18px var(--shadow);
}
.cv-save-bar .btn { padding: 9px 20px; }

/* карта расчёта: что на что умножается и складывается */
.cv-map { display: flex; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.cv-map-col { display: flex; flex-direction: column; gap: 10px; flex: 1 1 210px; min-width: 200px; }
.cv-map-col-cap {
  font-size: 9.5px; letter-spacing: .8px; text-transform: uppercase;
  color: var(--faint); font-weight: 700;
}
.cv-map-node {
  display: flex; flex-direction: column; gap: 5px; padding: 10px 12px;
  border: 1px solid var(--field-border); border-radius: 10px; background: var(--field);
}
.cv-map-name {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  font-size: 12.5px; font-weight: 600; color: var(--ink);
}
.cv-map-unit { font-weight: 400; font-size: 11px; color: var(--faint); }
.cv-map-sub { font-size: 10.5px; color: var(--faint); line-height: 1.5; }
.cv-map-manual { border-color: var(--sub); }
.cv-map-list { border-color: var(--badge-grp-t); }
.cv-map-dict { border-color: var(--badge-open-t); }
.cv-map-table { border-color: var(--badge-me-t); }
.cv-map-formula { border-color: var(--accent); }
.cv-map-total { background: var(--accent-soft); }
.cv-map-total-badge { font-size: 9.5px; }
.cv-map-in { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 2px; }
.cv-map-chip {
  display: inline-flex; align-items: center; gap: 5px; padding: 2px 7px;
  border: 1px solid var(--line); border-radius: 7px; background: var(--bg);
  font-size: 11px; color: var(--sub);
}
.cv-map-chip b { color: var(--num); font-weight: 700; }
.cv-map-chip-bad { border-color: var(--danger-t); color: var(--danger-t); }
.cv-map-chip-bad b { color: var(--danger-t); }
.cv-map-gap { align-self: center; padding-top: 34px; color: var(--faint); font-size: 16px; }
.cv-empty-cap { display: block; margin-bottom: 6px; font-size: 13.5px; font-weight: 600; color: var(--sub); }
.cv-row-none td { background: var(--bg); }
.cv-row-none .cv-hint { display: block; line-height: 1.7; }
.cv-auto-type { font-size: 11px; color: var(--badge-me-t); }
.cv-chain-total { margin-top: 14px; color: var(--sub); font-size: 12.5px; }

/* предпросмотр */
.cv-preview { scroll-margin-top: 20px; }
.cv-test-form { display: flex; gap: 16px; align-items: flex-end; flex-wrap: wrap; }
.cv-test-form input { width: 130px; }
.cv-dict-sample { color: var(--sub); font-size: 12.5px; padding: 9px 0; }
.cv-preview-line {
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap; margin-top: 18px;
  padding: 12px 16px; border: 1px solid var(--card-border); border-radius: 10px; background: var(--bg);
  font-size: 12.5px; color: var(--sub);
}
.cv-preview-total { color: var(--num); font-weight: 700; font-size: 15px; }
.cv-preview-empty { color: var(--faint); }
.cv-preview-table { width: 100%; border-collapse: collapse; margin-top: 16px; }
.cv-preview-table th {
  text-align: left; font-size: 9.5px; letter-spacing: .8px; color: var(--faint);
  text-transform: uppercase; padding: 8px 10px; border-bottom: 1px solid var(--line);
}
.cv-preview-table td { padding: 8px 10px; border-bottom: 1px solid var(--line); font-size: 12.5px; }
.cv-preview-table .cv-num { text-align: right; color: var(--ink); }
.cv-why { color: var(--sub); font-size: 11.5px; }
.cv-reason { display: block; color: var(--faint); }

/* ============ калькулятор услуги в заявке КП ============ */

/* мелкая кнопка «Калькулятор» в действиях строки реестра — как 👁 ✎ 🗑 */
.kp-calc-ico {
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  font-size: 15px; line-height: 1; opacity: .85;
}
.kp-calc-ico:hover { opacity: 1; }

/* оверлей и окно */
.kc-overlay {
  position: fixed; inset: 0; z-index: 70; padding: 34px 16px 40px;
  background: rgba(5, 7, 11, .66); overflow: auto;
  display: flex; align-items: flex-start; justify-content: center;
}
.kc-overlay[hidden] { display: none; }
body.kc-lock { overflow: hidden; }
.kc-dialog {
  width: min(1480px, 100%); background: var(--card);
  border: 1px solid var(--card-border); border-radius: 14px;
  box-shadow: 0 22px 60px rgba(0, 0, 0, .5);
}

.kc { display: flex; flex-direction: column; }
.kc-head {
  display: flex; align-items: flex-start; gap: 14px;
  padding: 18px 22px 14px; border-bottom: 1px solid var(--line);
}
.kc-hleft h3 { margin: 0; font-size: 18px; color: var(--ink); }
.kc-hsub { margin: 3px 0 0; font-size: 12.5px; color: var(--faint); }
.kc-hnote { margin-left: auto; text-align: right; max-width: 380px; }
.kc-x {
  background: none; border: 0; color: var(--faint); font-size: 22px;
  line-height: 1; cursor: pointer; padding: 0 2px;
}
.kc-x:hover { color: var(--ink); }

.kc-form { padding: 16px 22px 20px; }
.kc-top { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.kc-cap { font-size: 10px; letter-spacing: .8px; color: var(--faint); font-weight: 700; }
.kc-pick {
  min-width: 320px; padding: 8px 10px; border-radius: 8px;
  background: var(--field); color: var(--ink);
  border: 1px solid var(--field-border); font-size: 13.5px;
}
.kc-hint { font-size: 11.5px; color: var(--faint); }
.kc-empty {
  border: 1px dashed var(--card-border); border-radius: 10px;
  padding: 18px; color: var(--sub); font-size: 13.5px; margin: 4px 0 0;
}
.kc-errbox {
  border: 1px solid var(--badge-me-t); background: var(--badge-me-b);
  border-radius: 10px; padding: 12px 14px; color: var(--badge-me-t); font-size: 12.5px;
  margin-bottom: 12px;
}
.kc-errbox ul { margin: 6px 0 0 16px; padding: 0; }
.kc-err {
  border: 1px solid var(--danger-t); background: var(--danger-b);
  color: var(--danger-t); border-radius: 9px; padding: 10px 12px;
  font-size: 12.5px; margin-bottom: 12px;
}

/* две колонки: исходные данные / расчёт */
.kc-cols { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; }
.kc-col {
  border: 1px solid var(--card-border); border-radius: 12px;
  padding: 14px 16px 16px; background: var(--kc-col-bg);
}
.kc-out { background: var(--bg); border-color: var(--accent); }
.kc-colhead {
  display: flex; align-items: center; gap: 10px;
  font-size: 12px; font-weight: 700; color: var(--ink); margin-bottom: 12px;
}
.kc-badge {
  font-size: 10px; padding: 2px 8px; border-radius: 999px;
  background: var(--badge-open-b); color: var(--badge-open-t); font-weight: 600;
}
.kc-badge-a { background: var(--accent-soft); color: var(--accent); }

.kc-field { padding: 10px 0 12px; border-bottom: 1px solid var(--line); }
.kc-field:last-child { border-bottom: 0; padding-bottom: 0; }
.kc-flabel { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font-size: 13px; color: var(--ink); margin-bottom: 8px; }
.kc-src { font-size: 11px; color: var(--faint); }
.kc-inrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kc-in {
  background: var(--field); color: var(--ink); border: 1px solid var(--field-border);
  border-radius: 8px; padding: 8px 10px; font-size: 13px; min-width: 150px; flex: 0 1 320px;
  /* поля поиска (type=search) браузеры умеют рисовать «своим» белым полем — выключаем */
  appearance: none; -webkit-appearance: none; font-family: inherit;
}
.kc-in-sm { flex: 0 0 160px; min-width: 120px; }
.kc-sel { flex: 0 1 260px; }
.kc-val { font-size: 12px; color: var(--num); margin-top: 7px; min-height: 15px; }
.kc-eqres { margin-top: 8px; display: flex; flex-direction: column; gap: 4px; max-height: 190px; overflow: auto; }
.kc-eqhit {
  text-align: left; background: var(--card); color: var(--ink); cursor: pointer;
  border: 1px solid var(--card-border); border-radius: 8px; padding: 7px 10px; font-size: 12px;
  display: flex; justify-content: space-between; gap: 10px;
}
.kc-eqhit:hover { border-color: var(--accent); }
.kc-eqid { color: var(--faint); font-size: 11px; }
.kc-eqnone { font-size: 11.5px; color: var(--faint); }

/* Оборудование: единиц в расчёте может быть НЕСКОЛЬКО — услуга считается на парк
   (Валера, 12.09.2026). Строки — как строки таблиц: «+ ещё оборудование», ✕ убирает. */
.kc-eqrows { display: flex; flex-direction: column; gap: 6px; }
.kc-eqrow { display: flex; align-items: center; gap: 8px; }
.kc-eqrow .kc-in { flex: 1 1 auto; min-width: 0; }
.kc-eqrow-dup { outline: 2px solid var(--badge-me-t); outline-offset: 2px; border-radius: 9px; }
.kc-eqfoot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 8px; }

/* Оборудование, уже введённое в ЗАЯВКЕ, — предлагается к вводу ПЕРВЫМ:
   клик по строке подставляет единицу в расчёт (в реестре искать заново не нужно). */
.kc-eqsug {
  background: var(--kc-col-bg); border: 1px solid var(--card-border); border-radius: 9px;
  padding: 8px 10px; margin-bottom: 10px;
}
.kc-eqsug-h { font-size: 11.5px; color: var(--badge-open-t); margin-bottom: 8px; }
.kc-eqsug-list { display: flex; flex-direction: column; gap: 5px; }
.kc-eqchip {
  display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; cursor: pointer;
  background: var(--card); color: var(--ink); border: 1px solid var(--accent);
  border-radius: 7px; padding: 6px 10px; font-size: 12px;
  /* родное оформление кнопки выключаем: у браузеров своя белая «buttonface»-заливка и
     чёрный текст — из-за неё строка подстановки выглядела белым выделением (12.09.2026) */
  appearance: none; -webkit-appearance: none; font-family: inherit;
}
.kc-eqchip:hover { background: var(--accent-soft); }
.kc-eqchip-plus { color: var(--accent); font-weight: 700; }
.kc-eqchip-name { flex: 1 1 auto; }
.kc-eqsug-done { font-size: 11.5px; color: var(--faint); }

/* таблица запчастей — свёрнута по умолчанию */
.kc-parts { border: 1px solid var(--card-border); border-radius: 10px; background: var(--bg); }
.kc-parts summary {
  cursor: pointer; padding: 10px 12px; font-size: 11px; font-weight: 700;
  letter-spacing: .6px; color: var(--faint); list-style: none;
}
.kc-parts summary::-webkit-details-marker { display: none; }
.kc-parts[open] summary { border-bottom: 1px solid var(--line); color: var(--ink); }
.kc-ptable { width: 100%; border-collapse: collapse; font-size: 12px; table-layout: fixed; }
.kc-ptable th {
  text-align: left; padding: 8px 8px 6px; font-size: 9.5px; letter-spacing: .6px;
  color: var(--faint); font-weight: 700;
}
/* ширины колонок: «Наименование» — самое широкое (в нём пишут текстом), служебные узкие;
   Валера, 10.09.2026: «это поле узковато» — раньше все колонки делили ширину поровну */
.kc-ptable th:nth-child(1), .kc-ptable td:nth-child(1) { width: 38%; }
.kc-ptable th:nth-child(2), .kc-ptable td:nth-child(2) { width: 16%; }
.kc-ptable th:nth-child(3), .kc-ptable td:nth-child(3) { width: 16%; }
.kc-ptable th:nth-child(4), .kc-ptable td:nth-child(4) { width: 11%; }
.kc-ptable th:nth-child(5), .kc-ptable td:nth-child(5) { width: 15%; }
.kc-ptable th:nth-child(6), .kc-ptable td:nth-child(6) { width: 34px; }
.kc-ptable td { padding: 4px 8px; }
.kc-ptable input {
  width: 100%; background: var(--field); color: var(--ink);
  border: 1px solid var(--field-border); border-radius: 7px; padding: 6px 8px; font-size: 12px;
}
.kc-psum { color: var(--num); text-align: right; }
/* «Статья расходов»: в строке есть колонка «Ед. изм.» — колонок 7, ширины свои.
   Правила идут ПОСЛЕ общих .kc-ptable (у них та же специфичность — важно порядком). */
.kc-ptable-units th:nth-child(1), .kc-ptable-units td:nth-child(1) { width: 30%; }
.kc-ptable-units th:nth-child(2), .kc-ptable-units td:nth-child(2) { width: 14%; }
.kc-ptable-units th:nth-child(3), .kc-ptable-units td:nth-child(3) { width: 9%; }
.kc-ptable-units th:nth-child(4), .kc-ptable-units td:nth-child(4) { width: 17%; }
.kc-ptable-units th:nth-child(5), .kc-ptable-units td:nth-child(5) { width: 10%; }
.kc-ptable-units th:nth-child(6), .kc-ptable-units td:nth-child(6) { width: 16%; }
.kc-ptable-units th:nth-child(7), .kc-ptable-units td:nth-child(7) { width: 34px; }
.kc-punit { text-align: center; }
.kc-pdel { background: none; border: 0; color: var(--faint); cursor: pointer; font-size: 12px; }
.kc-pdel:hover { color: var(--danger-t); }
.kc-partsfoot { display: flex; align-items: center; gap: 12px; padding: 8px 12px 12px; }

/* правая колонка: Расчёт */
.kc-outrow {
  border: 1px solid var(--card-border); border-radius: 10px; background: var(--card);
  padding: 9px 12px; margin-bottom: 8px;
}
.kc-totalrow { border-color: var(--accent); background: var(--accent-soft); }
/* «свой пункт» — строка, которой нет в шаблоне: её завёл сотрудник.
   Валера, 11.09.2026: «сильно выделяется» — раньше вся строка шла пунктиром и выбивалась
   из списка статей. Теперь вид обычной статьи, а метка — в её названии (::after ниже). */
.kc-outrow.kc-outcustom { border-left: 3px solid var(--accent); }
.kc-outrow.kc-outcustom .kc-oname::after {
  content: " · свой пункт"; color: var(--faint); font-weight: 500;
}
.kc-oname { font-size: 12px; color: var(--ink); font-weight: 600; }
.kc-of { font-size: 10.5px; color: var(--faint); margin-top: 2px; }
.kc-oval { font-size: 14px; color: var(--num); font-weight: 700; margin-top: 4px; }
.kc-or { font-size: 11px; color: var(--faint); margin-top: 3px; }

.kc-total {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  border: 1px solid var(--card-border); border-radius: 10px;
  background: var(--bg); padding: 12px 16px; margin-top: 14px;
}
.kc-tlabel { font-size: 10px; letter-spacing: .8px; color: var(--faint); font-weight: 700; }
.kc-chain { font-size: 12px; color: var(--sub); flex: 1 1 320px; }
.kc-tval { font-size: 17px; color: var(--num); margin-left: auto; }

.kc-foot { display: flex; align-items: flex-start; gap: 12px; flex-wrap: wrap; margin-top: 14px; }
.kc-custom { flex: 1 1 420px; border: 1px dashed var(--card-border); border-radius: 10px; padding: 8px 12px; }
.kc-custom summary { cursor: pointer; font-size: 12px; color: var(--sub); }
/* «свой пункт» — строкой таблицей: Название · Цена без НДС · Количество · Сумма.
   Валера, 11.09.2026: «когда нажимаю добавить свой пункт, поля слишком высокие стали» —
   раньше подпись стояла НАД полем и блок тянулся вниз; теперь по строке, как в запчастях.
   Сумма — расчётная (цена × количество), поля ввода у неё нет. */
.kc-ctable { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 8px 0 2px; }
.kc-ctable th {
  text-align: left; padding: 4px 8px; font-size: 9.5px; font-weight: 700;
  letter-spacing: .6px; color: var(--faint);
}
.kc-ctable td { padding: 3px 8px; vertical-align: middle; }
.kc-ctable th:nth-child(1), .kc-ctable td:nth-child(1) { width: 40%; }
.kc-ctable th:nth-child(2), .kc-ctable td:nth-child(2) { width: 21%; }
.kc-ctable th:nth-child(3), .kc-ctable td:nth-child(3) { width: 16%; }
.kc-ctable th:nth-child(4), .kc-ctable td:nth-child(4) { width: 23%; }
.kc-ctable input {
  width: 100%; background: var(--field); color: var(--ink);
  border: 1px solid var(--field-border); border-radius: 7px; padding: 6px 8px; font-size: 12px;
}
.kc-csum { color: var(--num); text-align: right; font-weight: 700; }
.kc-cfoot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 6px; }
.kc-page { padding: 6px 0; }

/* позиции расчёта в карточке заявки */
.kc-poshead { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.kc-poshead h2 { margin: 0; }
.kc-poshead .btn { margin-left: auto; }
/* Две кнопки справа в шапке расчёта — «⤓ Отчёт в Excel» и «🧮 Калькулятор» (13.09.2026):
   отступ-авто ставим на обёртку, иначе флекс разносит кнопки по всей ширине. */
.kc-poshead-btns { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; }
.kc-poshead .kc-poshead-btns .btn { margin-left: 0; }
.kc-poshint { margin: 6px 0 12px; font-size: 12px; color: var(--faint); }
.kc-postable td { vertical-align: middle; }
.kc-pidx { width: 58px; white-space: nowrap; }
/* Одна позиция в заявке — галочки нет вовсе (снимать нечего, сравнивать не с чем):
   колонка «№» возвращается к обычной ширине (Валера, 14.10.2026). */
.kc-postable.kc-single .kc-pidx { width: 34px; }
/* Признак «в расчёте» у позиции — галочка у номера (Валера, 14.10.2026). Позиция без галочки
   остаётся в заявке справочной: бледная строка, серые суммы, в итог/КП/Excel не входит. */
.kc-tickform { display: inline; margin: 0; }
.kc-tick { width: 13px; height: 13px; margin: 0 0 0 6px; vertical-align: -1px;
           accent-color: var(--accent); cursor: pointer; }
.kc-tick:disabled { cursor: default; opacity: .6; }
.kc-posrow.kc-ref td { color: var(--faint); }
.kc-posrow.kc-ref .kc-ptotal, .kc-posrow.kc-ref .kc-pnum { color: var(--faint); }
.kc-posrow.kc-ref .kp-acts-i a, .kc-posrow.kc-ref .kp-del-btn { opacity: .55; }
.kc-refmark { color: var(--faint); font-size: 12px; }
.kc-refrow { margin-top: 4px; }
.kc-pnum { text-align: right; white-space: nowrap; }
.kc-ptotal { color: var(--num); font-weight: 700; }
.kc-psub { color: var(--faint); font-size: 12px; }
/* Перечень оборудования в «что считали»: единицы — своим строкам, а не через «; »
   (Валера, 12.09.2026). Одиночное значение по-прежнему просто строка в ячейке. */
.kc-psub-list { margin: 0; padding-left: 14px; list-style: disc; }
.kc-psub-list li { margin: 1px 0; }
.kc-postotals {
  display: flex; gap: 18px; flex-wrap: wrap; align-items: baseline;
  margin-top: 10px; font-size: 12.5px; color: var(--sub);
}
.kc-postotals b { color: var(--num); }
.kc-postot b { font-size: 15px; }

/* Полоса успеха в окне калькулятора: окно после «Добавить» не закрывается, отклик —
   там, где нажали (Валера, 10.09.2026: «снова просто закрывается поле Калькулятор услуги»). */
.kc-done {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 0 0 14px; padding: 10px 14px; border-radius: 10px;
  background: var(--badge-open-b); border: 1px solid var(--badge-open-t);
}
.kc-done-ico { color: var(--badge-open-t); font-size: 17px; font-weight: 700; line-height: 1; }
.kc-done-text { color: var(--ink); font-size: 13px; }
.kc-done-btns { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto; }

/* Состав позиции в заявке: клик по строке (или ?pos=<pk> — без JS) раскрывает
   «исходные данные / расчёт». */
.kc-posrow { cursor: pointer; }
.kc-posrow:hover td { background: var(--row-hover); }
.kc-posopen { color: var(--accent); text-decoration: none; font-size: 13px; margin-right: 6px; }
.kc-posopen:hover { color: var(--ink); }
/* ✎ — правка позиции расчёта: такая же мелкая кнопка, как ▸ и в соседних строках */
.kc-posedit { color: var(--sub); text-decoration: none; font-size: 14px; line-height: 1; }
.kc-posedit:hover { color: var(--accent); }
/* ⧉ — копия позиции расчёта: такая же мелкая кнопка, как ✎ рядом (Валера, 11.09.2026) */
.kc-poscopy {
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  color: var(--sub); font-size: 14px; line-height: 1; font-family: inherit;
}
.kc-poscopy:hover { color: var(--accent); }
.kc-composerow[hidden] { display: none; }
/* возврат к правленой позиции после сохранения: липкая шапка 64px — строку ставим ниже неё
   (?pos=<pk>#calc-pos-<pk>, Валера 11.09.2026: «страница уезжала вверх») */
.kc-posrow { scroll-margin-top: 76px; }
.kc-composerow > td { padding: 0 12px 12px; }
.kc-compose {
  background: var(--bg); border: 1px solid var(--card-border); border-radius: 10px;
  padding: 12px 16px;
}
.kc-cmp-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; padding-bottom: 8px; border-bottom: 1px solid var(--line); }
.kc-cmp-cap { font-size: 10px; letter-spacing: .8px; color: var(--faint); font-weight: 700; }
.kc-cmp-meta { margin-left: auto; font-size: 11px; color: var(--faint); }
.kc-cmp-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; margin-top: 12px; }
.kc-cmp-col .kc-cmp-cap { margin-bottom: 6px; }
.kc-cmp-row { display: flex; align-items: baseline; gap: 12px; padding: 2px 0; font-size: 12px; }
.kc-cmp-name { color: var(--sub); flex: 1 1 auto; }
.kc-cmp-val { color: var(--num); white-space: nowrap; }
/* Перечень оборудования в составе позиции: каждая единица — своей строкой
   (Валера, 12.09.2026 «списком красиво отобразить перечень оборудования»). */
.kc-cmp-list { margin: 1px 0 4px; padding-left: 15px; list-style: disc; font-size: 12px; color: var(--num); }
.kc-cmp-list li { margin: 1px 0; }
.kc-cmp-row.kc-cmp-total .kc-cmp-name, .kc-cmp-row.kc-cmp-total .kc-cmp-val { color: var(--ink); font-weight: 700; }
.kc-cmp-none { font-size: 11.5px; color: var(--faint); }
.kc-cmp-parts { margin-top: 12px; border-top: 1px solid var(--line); padding-top: 10px; }
.kc-cmp-parts table { width: 100%; border-collapse: collapse; font-size: 11.5px; }
.kc-cmp-parts th { padding: 2px 10px 4px 0; text-align: left; color: var(--faint); font-size: 10px; letter-spacing: .6px; text-transform: uppercase; }
.kc-cmp-parts td { padding: 3px 10px 3px 0; color: var(--sub); border-top: 1px solid var(--line); }
.kc-cmp-parts .kc-cmp-num { text-align: right; color: var(--num); white-space: nowrap; }
.kc-cmp-grp { color: var(--faint); font-size: 11px; }
.kc-cmp-foot { display: flex; gap: 18px; flex-wrap: wrap; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--line); font-size: 11.5px; color: var(--faint); }
.kc-cmp-custom { color: var(--badge-me-t); }

/* состав позиции ПО БЛОКАМ (часть 4 плана, 17.09.2026): свой блок на каждую секцию.
   Печатаем то же, что сотрудник видит карточкой в окне, — строки, НР/НЦ, итог без НДС,
   НДС по блоку и стоимость с НДС (решение Валеры: НДС невидимо по каждой строке). */
.kc-cmp-blocks { display: grid; gap: 10px; margin-top: 12px; }
.kc-cmp-block { border: 1px solid var(--line); border-radius: 8px; background: var(--card); padding: 8px 12px 10px; }
.kc-cmp-block.kc-cmp-boff { display: none; }
.kc-cmp-bhead { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; padding-bottom: 4px; }
.kc-cmp-bnum { min-width: 18px; height: 18px; border-radius: 50%; background: var(--accent-soft); color: var(--num);
  font-size: 10.5px; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.kc-cmp-bname { font-size: 13px; color: var(--ink); }
.kc-cmp-bkind { font-size: 10px; color: var(--faint); letter-spacing: .6px; text-transform: uppercase; }
.kc-cmp-bflag { font-size: 10.5px; color: var(--danger-t); }
.kc-cmp-btot { margin-left: auto; font-size: 12px; color: var(--num); white-space: nowrap; }
.kc-cmp-btable { width: 100%; border-collapse: collapse; font-size: 12px; }
.kc-cmp-btable td { padding: 3px 0; border-top: 1px solid var(--line); color: var(--sub); vertical-align: top; }
.kc-cmp-btable td.kc-cmp-num { text-align: right; color: var(--num); white-space: nowrap; padding-left: 12px; }
.kc-cmp-btable-grid { width: 100%; border-collapse: collapse; font-size: 12px; margin: 4px 0 6px; table-layout: auto; }
.kc-cmp-btable-grid th { padding: 3px 8px; text-align: left; color: var(--faint); font-size: 10px; letter-spacing: .5px; text-transform: uppercase; background: var(--accent-soft); border-bottom: 1px solid var(--line); white-space: nowrap; }
.kc-cmp-btable-grid td { padding: 3px 8px; border-top: 1px solid var(--line); color: var(--sub); vertical-align: top; }
.kc-cmp-btable-grid td.kc-cmp-num { text-align: right; color: var(--num); font-weight: 600; }
/* Наименование — уже, с переносом текста */
.kc-cmp-btable-grid th[data-col*="наименов"], .kc-cmp-btable-grid td[data-col*="наименов"] { max-width: 220px; word-wrap: break-word; overflow-wrap: break-word; white-space: normal; }
/* Комментарии — шире */
.kc-cmp-btable-grid th[data-col*="коммент"], .kc-cmp-btable-grid td[data-col*="коммент"] { min-width: 120px; }
.kc-cmp-ldetail { color: var(--faint); font-size: 11px; margin-left: 6px; }
.kc-cmp-bcomment { margin-top: 6px; font-size: 11.5px; color: var(--sub); }
.kc-cmp-bsum { display: flex; gap: 14px; flex-wrap: wrap; justify-content: flex-end; margin-top: 6px;
  padding-top: 6px; border-top: 1px dashed var(--line); font-size: 11.5px; color: var(--faint); }
.kc-cmp-bline b, .kc-cmp-bpart b { color: var(--num); font-weight: 600; }
.kc-cmp-bfinal { color: var(--ink); font-weight: 700; }
.kc-cmp-bfoot { color: var(--num); }

/* ─────────── галочка «дополнительно» у статьи (Валера, 14.09.2026) ───────────
   Блок «ДОПОЛНИТЕЛЬНО» окна услуги: статья шаблона с галочкой «дополнительно» включается
   и выключается НА ЭТУ ПОЗИЦИЮ. Снятая галочка = статья 0: поля и строка расчёта прячутся. */
.kc-extra { margin: 12px 0 2px; border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; }
.kc-extra-cap { font-size: 11px; letter-spacing: .06em; color: var(--faint); margin-bottom: 6px; }
.kc-extra-cap b { color: var(--ink); letter-spacing: 0; font-size: 12px; font-weight: 600; }
.kc-exrow { display: flex; align-items: baseline; gap: 10px; padding: 6px 0; border-top: 1px dashed var(--line); cursor: pointer; }
.kc-exrow:first-of-type { border-top: 0; }
.kc-exname { color: var(--ink); font-size: 13px; }
.kc-exnote { color: var(--faint); font-size: 11.5px; }
.kc-exval { margin-left: auto; color: var(--num); font-size: 13px; white-space: nowrap; }
.kc-exrow-off .kc-exname, .kc-exrow-off .kc-exval { color: var(--faint); text-decoration: line-through; }
.kc-extra-foot { color: var(--faint); font-size: 11.5px; margin-top: 8px; }
/* `hidden` должен побеждать display из правил выше («поле» и «строка расчёта» прячутся) */
.kc-field[hidden], .kc-outrow[hidden] { display: none !important; }


/* ============ журнал удалений (шаг B, 14.09.2026) ============
   Раздел «Журнал»: список записей об удалениях и карточка записи со снимком
   данных до удаления. Раскладка — по согласованному макету design/journal-section.png. */

/* число записей рядом с пунктом меню «Журнал» */
.nav-cnt { margin-left: auto; color: var(--faint); font-size: 11.5px; }

.jr-only-admin {
  display: inline-block; padding: 1px 8px; border-radius: 8px;
  background: var(--badge-me-b); color: var(--badge-me-t);
  font-size: 11px; font-weight: 700;
}

/* ---- панель отбора ---- */
.jr-filters .jr-sel-who { min-width: 168px; }
.jr-filters .jr-sel-kind { min-width: 186px; }
.jr-filters .jr-sel-day { min-width: 138px; }
.jr-filters .jr-sel-q { flex: 1 1 210px; min-width: 180px; }
.jr-filters .jr-sel-q input { width: 100%; }
/* кнопки действий одной группой: Excel · выбранные · всё отобранное (порядок не ломается переносом) */
.jr-filters .jr-actions { display: flex; gap: 8px; align-items: center; margin-left: auto; flex-wrap: wrap; }
.jr-found { align-self: center; color: var(--faint); font-size: 11.5px; }

/* ---- список записей ---- */
.jr-panel { padding: 0; overflow-x: auto; }
.jr-table { width: 100%; border-collapse: collapse; min-width: 1020px; }
.jr-table th, .jr-table td { padding: 9px 12px; text-align: left; vertical-align: middle; }
.jr-table th {
  font-size: 10.5px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;
  color: var(--faint); border-bottom: 1px solid var(--line); white-space: nowrap;
}
.jr-table td { border-top: 1px solid var(--line); font-size: 12.5px; }
.jr-table tr.jr-row { cursor: pointer; }
.jr-table tr.jr-row:hover td { background: var(--row-hover); }
/* колонка галочек удаления (25.09.2026) */
.jr-table th.jr-c-chk, .jr-table td.jr-c-chk { width: 34px; padding-left: 14px; padding-right: 0; }
.jr-table input.jr-chk, .jr-table input.jr-chk-all { cursor: pointer; accent-color: var(--danger-t); }
.jr-when { color: var(--faint); white-space: nowrap; font-size: 11.5px; }
.jr-who { color: var(--ink); white-space: nowrap; }
.jr-kind { color: var(--sub); white-space: nowrap; }
.jr-name { color: var(--ink); font-weight: 600; }
/* краткая строка правки под названием объекта: «сумма КП · 1 000,00 ₽ → 2 000,00 ₽» */
.jr-chg { margin-top: 3px; color: var(--sub); font-weight: 400; font-size: 11.5px; }
.jr-place { color: var(--sub); }
.jr-act { font-weight: 700; white-space: nowrap; }
.jr-act-create { color: var(--ok-t, #2f9e6b); }
.jr-act-update { color: var(--accent); }
.jr-act-del { color: var(--danger-t); }
.jr-act-clear { color: var(--badge-me-t); }
.jr-look { width: 52px; text-align: right; }
.jr-eye {
  display: inline-flex; align-items: center; justify-content: center;
  padding: 4px; border-radius: 7px; color: var(--sub);
  background: var(--field); border: 1px solid var(--field-border);
}
.jr-eye:hover { border-color: var(--accent); color: var(--ink); }
.jr-eye .ic { width: 14px; height: 14px; }
.jr-foot {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  padding: 10px 16px; flex-wrap: wrap;
}
.jr-hint { color: var(--faint); font-size: 11px; }
.jr-pager { padding: 0 16px 14px; }

/* ---- карточка записи ---- */
.jr-back { color: var(--accent); text-decoration: none; font-size: 13px; margin-right: 10px; }
.jr-card { padding: 18px 20px; }
.jr-card-head {
  display: flex; justify-content: space-between; align-items: flex-start; gap: 16px;
  flex-wrap: wrap;
}
.jr-card-head h2 { font-size: 16px; }
.jr-card-sub { margin-top: 5px; color: var(--sub); font-size: 12.5px; }
.jr-card-badges { display: flex; gap: 8px; flex-wrap: wrap; }
.jr-badge-del { color: var(--danger-t); background: var(--danger-b); }
.jr-badge-create { color: var(--ok-t, #2f9e6b); background: var(--ok-b, rgba(47,158,107,.14)); }
.jr-badge-clear { color: var(--badge-me-t); background: var(--badge-me-b); }
.jr-badge-guard { color: var(--badge-grp-t); background: var(--badge-grp-b); }

.jr-cols { display: flex; gap: 14px; margin-top: 16px; flex-wrap: wrap; align-items: flex-start; }
.jr-block {
  background: var(--field); border: 1px solid var(--field-border);
  border-radius: 10px; padding: 14px 16px;
}
.jr-block-inside { flex: 1 1 380px; min-width: 300px; }
.jr-block-positions { flex: 1 1 430px; min-width: 340px; }
.jr-block-cap {
  font-size: 10.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase;
  color: var(--faint); margin-bottom: 10px;
}
.jr-part { padding: 8px 0; border-top: 1px dashed var(--line); }
.jr-part:first-of-type { border-top: none; padding-top: 0; }
.jr-part-head { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.jr-part-name { font-weight: 700; font-size: 12.5px; color: var(--ink); }
.jr-part-note { color: var(--faint); font-size: 11px; text-align: right; }
.jr-kv { display: flex; gap: 10px; padding: 2px 0; font-size: 12px; }
.jr-k { color: var(--faint); flex: 0 0 168px; }
.jr-v { color: var(--ink); overflow-wrap: anywhere; }
.jr-list { margin: 6px 0 2px; padding-left: 16px; color: var(--sub); font-size: 12px; }
.jr-list li { padding: 1px 0; }
.jr-none { color: var(--faint); font-size: 12.5px; }

.jr-ptable { width: 100%; border-collapse: collapse; }
.jr-ptable th, .jr-ptable td { padding: 7px 8px; text-align: left; font-size: 12px; }
.jr-ptable th {
  font-size: 10px; letter-spacing: .8px; text-transform: uppercase;
  color: var(--faint); border-bottom: 1px solid var(--line); white-space: nowrap;
}
.jr-ptable td { border-top: 1px solid var(--line); }
.jr-pt-money { text-align: right; white-space: nowrap; }
.jr-pt-num { width: 34px; color: var(--faint); }
.jr-pt-note { color: var(--faint); white-space: nowrap; }
.jr-pt-name { color: var(--ink); }
.jr-pt-total td { font-weight: 700; color: var(--ink); border-top: 2px solid var(--line); }

.jr-card-foot {
  display: flex; justify-content: space-between; align-items: center; gap: 14px;
  margin-top: 16px; flex-wrap: wrap;
}
.jr-dl { display: inline-flex; align-items: center; gap: 8px; }
.jr-dl .ic { width: 15px; height: 15px; }

/* ============ дашборд КП ============ */
.db-row { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 28px; }
.db-card {
  background: var(--card); border: 1px solid var(--card-border);
  border-radius: 10px; padding: 18px 22px; min-width: 140px; flex: 1;
}
.db-card-h {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; color: var(--faint); margin-bottom: 6px;
}
.db-big { font-size: 28px; font-weight: 700; color: var(--num); }
.db-big .db-unit { font-size: 14px; color: var(--sub); font-weight: 400; }
.db-sub { font-size: 12px; color: var(--sub); margin-top: 4px; }

.db-section { margin-bottom: 28px; }
.db-section h2 {
  font-size: 13px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 1px; color: var(--faint); margin-bottom: 12px;
}

/* статусы */
.db-status-row { display: flex; gap: 10px; flex-wrap: wrap; }
.db-status-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 14px; border-radius: 20px; font-size: 13px;
  font-weight: 600; text-decoration: none; transition: opacity .15s;
}
.db-status-chip:hover { opacity: .8; }
.db-status-n { font-size: 15px; font-weight: 800; }

/* полосы */
.db-bars { display: flex; flex-direction: column; gap: 6px; }
.db-bar-row { display: flex; align-items: center; gap: 10px; }
.db-bar-label { width: 70px; font-size: 12px; color: var(--sub); text-align: right; flex-shrink: 0; }
.db-bar-track {
  flex: 1; height: 20px; background: var(--line); border-radius: 4px; overflow: hidden;
}
.db-bar-fill {
  height: 100%; background: var(--accent); border-radius: 4px;
  transition: width .3s ease;
}
.db-bar-cur { background: var(--feat-check); }
.db-bar-n { width: 28px; font-size: 12px; font-weight: 700; color: var(--num); }

/* списки */
.db-list { display: flex; flex-direction: column; gap: 2px; }
.db-list-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 8px 14px; background: var(--card); border-radius: 6px;
  border: 1px solid var(--card-border);
}
.db-list-name { font-size: 13px; color: var(--ink); }
.db-list-n { font-size: 14px; font-weight: 700; color: var(--num); }

@media (max-width: 600px) {
  .db-row { flex-direction: column; }
  .db-card { min-width: auto; }
  .db-bar-label { width: 50px; font-size: 11px; }
}

/* ─────────────────────────────────────────────────────────── БЛОКИ ПОЗИЦИИ (16.09.2026)
   Позиция — набор блоков: «Свои работы» (ставка из справочника × трудоёмкость) и таблицы
   строк (субподряд, запчасти, РМ) со своими НР и НЦ. Карточка блока идёт ПЕРВОЙ в окне
   калькулятора — до колонок «исходные данные» / «расчёт». */
.kc-blocks { display: flex; flex-direction: column; gap: 10px; margin: 12px 0 4px; }
/* ручка-захват для перетаскивания блока (владелец, 09.10.2026) */
.kc-bgrip {
  flex: 0 0 auto; width: 16px; color: var(--faint); font-size: 12px; line-height: 1;
  cursor: grab; user-select: none; -webkit-user-select: none; text-align: center;
}
.kc-bgrip:hover { color: var(--accent); }
.kc-block.dragging, .kc-blrow.dragging { opacity: .55; }
.kc-block.drag-over, .kc-blrow.drag-over { outline: 2px dashed var(--accent); outline-offset: -2px; }
.kc-block {
  border: 1px solid var(--card-border); border-radius: 12px; background: var(--card);
  overflow: hidden;
}
.kc-block-off { opacity: .55; }
/* ── компактность блоков (Валера, 22.09.2026: «в целом чтобы блоки были компактнее») ──
   шапка 36 px вместо 42, поля строк 24 px вместо 28, отступы тела 7/9 вместо 10/12. */
.kc-bhead {
  position: relative; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 6px 12px; background: var(--bg); border-bottom: 1px solid var(--line);
}
.kc-bnum {
  width: 20px; height: 20px; border-radius: 50%; background: var(--accent-soft);
  color: var(--accent); font-size: 11px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
}
.kc-btitle { color: var(--ink); font-size: 13px; }
.kc-bkind { color: var(--faint); font-size: 11px; }
.kc-bwhy { color: var(--badge-me-t); font-size: 11px; }
.kc-btog { color: var(--sub); font-size: 11px; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.kc-btotal { color: var(--num); font-size: 13px; font-weight: 600; }
/* стрелка сворачивания */
.kc-barrow { margin-left: 4px; color: var(--faint); font-size: 11px; cursor: pointer; transition: transform .15s; user-select: none; }
/* свёрнутый блок — скрываем body, комментарий, НР/НЦ и подсказку */
.kc-block.kc-collapsed .kc-bbody { display: none; }
.kc-block.kc-collapsed .kc-comment-section { display: none; }
.kc-block.kc-collapsed .kc-bpercents { display: none; }
.kc-block.kc-collapsed .kc-bpercents + .kc-hint { display: none; }
.kc-block.kc-collapsed .kc-bhead { background: var(--row-hover); }
.kc-block.kc-collapsed .kc-brow-compact { background: var(--row-hover); }
.kc-block.kc-collapsed .kc-barrow { transform: rotate(-90deg); }
/* переключатель «в расчёте» — ТУМБЛЕР в ПРАВОЙ части строки (Валера, 20.09.2026, вариант 3
   макета `design/shots/block-switch-v3.png`). Раньше кнопка ◉ стояла в ЛЕВОМ углу сразу за
   стрелкой раскрытия (между ними 15 px) — целились в стрелку, попадали в переключатель.
   Теперь в левом углу только № и стрелка, а состояние видно по полосе `.kc-bonbar`. */
.kc-bswitch {
  position: relative; flex: 0 0 auto; width: 34px; height: 18px; padding: 0;
  border: none; border-radius: 9px; background: var(--line); cursor: pointer;
  transition: background .12s ease;
}
.kc-bswitch:hover { background: var(--field-border); }
.kc-bswitch .kc-bknob {
  position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%;
  background: var(--faint); transition: left .12s ease, background .12s ease;
}
.kc-bswitch.on { background: var(--badge-open-b); }
.kc-bswitch.on .kc-bknob { left: 18px; background: var(--badge-open-t); }
.kc-bswitch.on:hover { background: #14432a; }
/* полоса состояния у номера: в расчёте блок (акцент) или выключен (серая) */
.kc-bonbar {
  position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px;
  border-radius: 0 3px 3px 0; background: var(--accent);
}
.kc-block.kc-block-off .kc-bonbar { background: var(--line); }
/* ПРАВАЯ ГРУППА — ОДНА колонка для всех строк: тумблер · итог · ✎ · ✕ стоят друг под другом,
   каким бы ни был состав полей слева (Валера, 20.09.2026: «ровно как на макете, при любых
   статьях чтобы было выравнивание кнопок»). Раньше группа «плавала» по строке, а при широком
   содержимом уезжала за край и обрезалась (`overflow: hidden`) — ✎ и ✕ не были видны. */
.kc-btail {
  margin-left: auto; display: inline-flex; align-items: center; gap: 8px; flex: 0 0 auto;
}
/* итог — фиксированное место: суммы разной длины не двигают тумблер. Ширина ОДНА для компактной
   строки и шапок (112 px): иначе слот шапки выходил шире на 4 px и тумблер таблицы/оборудования
   вставал на 4 px левее, чем у строк-работ */
.kc-brow-compact .kc-total-compact,
.kc-bhead .kc-btotal { margin-left: 0; width: 112px; text-align: right; }
/* середина УЖИМАЕТСЯ (имя, подпись уточнения, ставка/цена), а не выталкивает кнопки */
.kc-brow-compact .kc-bscope,
.kc-brow-compact .kc-bname,
.kc-brow-compact .kc-hint-compact,
.kc-brow-compact .kc-rate-compact,
.kc-bhead .kc-btitle,
.kc-bhead .kc-bwhy,
.kc-bhead .kc-bkind { min-width: 0; flex-shrink: 1; }
.kc-brow-compact .kc-bscope .kc-sel { min-width: 84px; }
.kc-brow-compact .kc-rate-compact,
.kc-brow-compact .kc-hint-compact { overflow: hidden; text-overflow: ellipsis; }
.kc-bhead .kc-bwhy, .kc-bhead .kc-bkind { overflow: hidden; text-overflow: ellipsis;
  white-space: nowrap; }
/* отключённый блок — приглушён, КРОМЕ переключателя: им блок возвращают в расчёт */
.kc-block.kc-block-off > .kc-brow-compact > *:not(.kc-btail),
.kc-block.kc-block-off > .kc-bhead > *:not(.kc-btail),
.kc-block.kc-block-off .kc-btail > *:not(.kc-bswitch) { opacity: .45; }
.kc-block.kc-block-off > .kc-brow-compact .kc-total-compact,
.kc-block.kc-block-off > .kc-bhead .kc-btotal { text-decoration: line-through; }
/* анимация после перемещения стрелкой ↑↓ */
@keyframes kc-moved { 0% { background: var(--badge-open-b); } 100% { background: transparent; } }
.kc-block.kc-moved { animation: kc-moved 1.2s ease-out; }
.cv-bcard.kc-moved { animation: kc-moved 1.2s ease-out; }
/* галочка столбца в конструкторе: подсветка самого столбца, чьё поле включили или выключили
   (задача 22.09.2026 — «должна подсветиться, без мерцания»; сервер ставит data-moved на блок) */
.cv-colrow.kc-moved { animation: kc-moved 1.2s ease-out; }
.kc-bbody { padding: 7px 12px 9px; display: flex; flex-direction: column; gap: 6px; }
.kc-brow { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.kc-bfield { color: var(--sub); font-size: 11.5px; display: inline-flex; align-items: center; gap: 6px; }
.kc-bfield .kc-in { width: 110px; }
.kc-bcalc { color: var(--sub); font-size: 11.5px; }
.kc-bcalc b { color: var(--ink); }

/* таблица строк блока: ширины как у таблиц запчастей, последняя колонка — сумма и ✕ */
.kc-btable { width: 100%; border-collapse: collapse; font-size: 12px; }
/* блок со следящими столбцами (22.09.2026): узкие служебные столбцы в пользу
   «Наименования» и «Комментариев». Ширины — ПО РОЛЯМ и в ПРОЦЕНТАХ (столбцы можно менять
   местами, а проценты держат пропорцию на любой ширине окна: с px-ширинами на 1024–1280 px
   «Наименование» схлопывалось в 0 — замер `tools/_diag_articles_compact.py`).
   При ширине таблицы 1212 px это: Наименование 252 · Ед.изм/Кол-во 78 · Цена 127 ·
   НР/НЦ 62 · Комментарии 422 · Вложение 96 · ✕ 34. */
   Ширины колонок приходят ИЗ ШАБЛОНА (`style="width:…%"`, считает `block_calc.column_widths`
   по ФАКТИЧЕСКОМУ набору колонок блока): набор у каждого блока свой — админ заводит «＋ свой
   столбец», и жёсткие проценты под 8 ролей такую колонку схлопывали до 2 px (подпись налезала
   на «Вложение», 09.10.2026). Здесь остаётся только раскладка. */
.kc-btable-roles { table-layout: fixed; }
.kc-btable th {
  text-align: left; padding: 4px 8px 3px; font-size: 9.5px; letter-spacing: .6px;
  color: var(--faint); font-weight: 700;
  /* подпись НЕ переносится и не налезает на соседнюю колонку: длинное имя обрезается,
     полное видно в подсказке (title у th) */
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.kc-btable td { padding: 2px 6px; }
.kc-btable input {
  width: 100%; background: var(--field); color: var(--ink);
  border: 1px solid var(--field-border); border-radius: 6px; padding: 4px 8px; font-size: 12px;
}
.kc-bsumcol { color: var(--num); }
.kc-browsum { color: var(--num); text-align: right; }
/* служебные колонки («Сумма строки», «Вложение», ✕) ширину получают ИЗ ШАБЛОНА вместе с
   остальными — иначе они забирали px у колонок блока и ломалась раскладка. В старых
   не-ролевых таблицах пустой th под «Сумму» обязателен: без него в строках на одну ячейку
   больше, чем в шапке, и колонки съезжают (наложение «Каталожный номер» → «Вложение»,
   07.10.2026) */
.kc-browsum-th { }
.kc-bdel { }
.kc-browfoot { display: flex; align-items: center; gap: 10px; }
/* «+ добавить строку» / «+ добавить единицу» — маленькая кнопка (Валера, 22.09.2026:
   «кнопку надо поменьше, крупная очень — во всех услугах»); .btn-sm = 9px 14px / 13px. */
.kc-browfoot .btn-sm,
.kc-partsfoot .btn-sm { padding: 5px 10px; font-size: 11.5px; border-radius: 7px; }
/* ── «Следящие» столбцы (этап А, 21.09.2026): панель «ИТОГИ БЛОКА» под таблицей ──
   Шесть величин считает движок, в строках их нет — там только ввод сотрудника.
   Макет: design/articles-block-rows.png. ОДНОЙ СТРОКОЙ (Валера, 22.09.2026: «давай вариант B,
   но очень компактно») — 23 px вместо 83: подписи и числа в строку, подписи приглушены. */
.kc-brtot {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 3px 14px;
  margin: 3px 0 0; padding: 4px 10px; line-height: 1.2;
  background: var(--bg); border: 1px solid var(--line); border-radius: 8px;
}
.kc-brtot-head { flex: 0 0 auto; white-space: nowrap;
  color: var(--faint); font-size: 9px; font-weight: 700; letter-spacing: .4px; }
.kc-brtot-note { font-weight: 400; letter-spacing: 0; }
.kc-brtot-item { display: flex; flex-direction: row; align-items: baseline; gap: 4px; min-width: 0; }
.kc-brtot-label { color: var(--sub); font-size: 10px; white-space: nowrap; }
.kc-brtot-value { color: var(--num); font-size: 11.5px; white-space: nowrap; }
.kc-brtot-main .kc-brtot-value { color: var(--ink); font-size: 12.5px; font-weight: 700; }
.kc-bpercents {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  border-top: 1px dashed var(--line); padding-top: 6px;
}
.kc-bplabel { color: var(--sub); font-size: 11.5px; }
.kc-bpct { width: 62px; background: var(--field); color: var(--ink); border: 1px solid var(--field-border); border-radius: 7px; padding: 5px 7px; font-size: 12px; text-align: right; }
.kc-bplbl { width: 190px; background: var(--field); color: var(--sub); border: 1px solid var(--field-border); border-radius: 7px; padding: 5px 7px; font-size: 12px; }
.kc-bpctsum { color: var(--num); font-size: 12px; min-width: 96px; }
/* комментарий блока (17.09.2026): видно всегда, пусто — пунктир «+ добавить комментарий» */
.kc-bcomment { display: flex; align-items: center; gap: 8px; border-top: 1px dashed var(--line); padding: 8px 12px 10px; }
.kc-bclabel { color: var(--sub); font-size: 11.5px; white-space: nowrap; }
.kc-bctext { flex: 1; background: var(--field); color: var(--ink); border: 1px dashed var(--field-border); border-radius: 7px; padding: 5px 8px; font-size: 12px; }
.kc-bctext:not(:placeholder-shown) { border-style: solid; }
.kc-beqlink { min-width: 280px; background: var(--accent-soft); border-color: var(--accent); }
.kc-eq-all-bound { font-size: 11px; color: var(--faint); font-style: italic; margin-bottom: 4px; }

/* ── часть 3 плана (17.09.2026): компактное окно — тираж, «＋ ещё», оборудование в двух режимах ──
   «Свои работы» и статья идут ОДНОЙ строкой (имя, уточнения, ввод, ставка, сумма), таблицы —
   плотными строками, НР/НЦ — одной строкой с галочками, итог — одной строкой внизу блоков. */
.kc-brow-own { gap: 10px; align-items: center; }
.kc-bwname { color: var(--ink); font-size: 12px; font-weight: 600; min-width: 96px; }
.kc-bscope { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.kc-bscope .kc-sel { min-width: 128px; }
.kc-bunit { color: var(--faint); font-size: 11px; }
.kc-bqty { width: 96px; }
.kc-bdel { background: none; border: none; color: var(--bad, #ef4444); cursor: pointer; font-size: 12px; padding: 0 4px; margin-left: 4px; }
.kc-bdel:hover { color: #fff; background: var(--bad, #ef4444); border-radius: 5px; }
.kc-bptotal { margin-left: auto; color: var(--sub); font-size: 11.5px; }
.kc-bptotal b { color: var(--num); }
.kc-bmodes { display: inline-flex; gap: 0; border: 1px solid var(--field-border); border-radius: 8px; overflow: hidden; }
.kc-bmode { background: none; border: none; color: var(--sub); font-size: 11.5px; padding: 5px 10px; cursor: pointer; }
.kc-bmode.on { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.kc-beqlist { display: flex; flex-direction: column; gap: 6px; }
.kc-beqlist .kc-eqrow { display: flex; gap: 6px; align-items: center; }
.kc-beqcount { display: flex; align-items: center; gap: 10px; }
.kc-browcnt { display: none; }

/* ── Часть 1 плана (18.09.2026): компактная строка 46 px для own_work и article ──
   Шапка и тело сливаются в одну строку: имя | уточнения | ввод | ставка/цена | итог | ✕.
   Комментарий — значок ✎, раскрывается по клику. Таблицы и оборудование — без изменений. */
.kc-brow-compact {
  position: relative; display: flex; align-items: center; gap: 8px; flex-wrap: nowrap;
  padding: 0 12px; min-height: 46px; background: var(--bg);
  border-bottom: 1px solid var(--line); overflow: hidden;
}
.kc-brow-compact .kc-bnum { flex-shrink: 0; }
.kc-brow-compact .kc-barrow { flex-shrink: 0; margin-left: 0; }
/* Имя блока — обрезается «…», полное — в подсказке */
.kc-brow-compact .kc-bname {
  flex: 0 1 160px; min-width: 60px; max-width: 160px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/* Уточнения (scope selects) — компактные */
.kc-brow-compact .kc-bscope { flex-shrink: 0; display: inline-flex; gap: 4px; }
.kc-brow-compact .kc-bscope .kc-sel {
  min-width: 100px; max-width: 150px; height: 26px; font-size: 11.5px;
  padding: 2px 6px; background: var(--field); color: var(--ink);
  border: 1px solid var(--field-border); border-radius: 6px;
}
/* Ввод (трудоёмкость / количество) — компактный */
.kc-brow-compact .kc-in-compact {
  width: 56px; height: 26px; font-size: 12px; flex: none; min-width: 0;
  background: var(--field); color: var(--ink);
  border: 1px solid var(--field-border); border-radius: 6px;
  padding: 2px 6px; text-align: right;
}
/* Подпись перед вводом */
.kc-brow-compact .kc-cap-compact {
  color: var(--sub); font-size: 11px; white-space: nowrap; flex-shrink: 0;
}
/* Ставка / цена — компактно */
.kc-brow-compact .kc-rate-compact {
  color: var(--sub); font-size: 11px; white-space: nowrap; flex-shrink: 0;
}
.kc-brow-compact .kc-rate-compact b { color: var(--ink); }
/* Итог — в общей правой группе `.kc-btail` (выравнивание кнопок, 20.09.2026) */
.kc-brow-compact .kc-total-compact {
  color: var(--num); font-size: 12px; font-weight: 600;
  white-space: nowrap; flex-shrink: 0;
}
/* Значок комментария — компактный (ширина ФИКСИРОВАННАЯ: в шапках таблиц и «Оборудования»
   значка нет, там стоит такой же по ширине распор `.kc-bslot` — иначе тумблер у этих строк
   встаёт на 29 px правее, и колонка кнопок разъезжается) */
.kc-brow-compact .kc-comment-toggle {
  flex-shrink: 0; width: 26px; box-sizing: border-box; text-align: center;
  background: none; border: 1px dashed var(--field-border);
  border-radius: 6px; color: var(--faint); cursor: pointer;
  font-size: 14px; padding: 2px 0; line-height: 1;
}
.kc-bslot { flex: 0 0 auto; width: 26px; }
/* зазор между иконками даёт `gap` правой группы: у базового `.kc-bdel` был ещё margin-left: 4 px,
   из-за него крестик в шапках стоял на 4 px правее и колонка кнопок разъезжалась */
.kc-btail .kc-bdel { margin-left: 0; }
/* пустой слот суммы у «Оборудования»: ширина как у колонки «итог», чтобы тумблер и ✕
   у всех строк стояли в ОДНОЙ колонке (Валера, 20.09.2026) */
.kc-btsum { flex: 0 0 auto; width: 112px; }
.kc-brow-compact .kc-comment-toggle:hover { color: var(--ink); border-color: var(--ink); }
/* Есть комментарий — иконка сплошная */
.kc-brow-compact .kc-comment-toggle[data-has-text="true"] {
  border-style: solid; color: var(--accent);
}
/* Кнопка удаления */
.kc-brow-compact .kc-bdel { flex-shrink: 0; margin-left: 0; }
/* Секция комментария (раскрывается) */
.kc-comment-section { padding: 4px 12px 6px; display: flex; align-items: center; gap: 8px; }
/* у таблиц и «Оборудования» компактной строки с ✎ нет — комментарий виден сразу,
   отделён от тела блока пунктиром (как было до компактной укладки) */
.kc-comment-plain { border-top: 1px dashed var(--line); padding-top: 6px; }
.kc-comment-section .kc-bclabel { color: var(--sub); font-size: 11px; white-space: nowrap; }
.kc-comment-section .kc-bctext { flex: 1; }
/* Пустые уточнения (scope_fixed) — маленькая подсказка в строке */
.kc-brow-compact .kc-hint-compact {
  color: var(--faint); font-size: 10px; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis; max-width: 180px;
}
/* Оборудование: компактная шапка (режим-тогл + «…») */
.kc-brow-equip { gap: 8px; }
.kc-brow-equip .kc-hint { margin-left: auto; }
.kc-baddbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 9px 12px; border: 1px dashed var(--accent); border-radius: 10px; }
.kc-baddcap { color: var(--sub); font-size: 11.5px; }
.kc-badd { background: none; border: 1px solid var(--field-border); border-radius: 8px; color: var(--accent); font-size: 11.5px; padding: 5px 10px; cursor: pointer; }
.kc-badd:hover { background: var(--accent-soft); }
.kc-bsum { border: 1px solid var(--card-border); border-radius: 12px; background: var(--card); padding: 10px 12px; display: flex; flex-direction: column; gap: 6px; }
.kc-bsum-line { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.kc-bsum-name { color: var(--sub); font-size: 11px; font-weight: 700; letter-spacing: .5px; }
.kc-bsum-groups { color: var(--sub); font-size: 12px; }
.kc-bsum-groups b { color: var(--num); }
.kc-bsum-tot { color: var(--ink); font-size: 12.5px; }

/* ── Часть 2 плана (18.09.2026): режимы «строками» / «списком» (макет `blocks-compact-c.png`) ──
   Переключатель «Строками · Списком» — у подписи «БЛОКИ ПОЗИЦИИ». Видимость решает КОРНЕВОЙ
   атрибут `data-kc-vb`: разметка списка есть в окне всегда, поэтому переключение в браузере
   мгновенное (без перерисовки окна сервером), а без JavaScript тот же вид отдаёт сервер.
   Строка списка — 26 px: № · блок · вид · что вводит сотрудник · подытог · ✕. */
.kc-vbbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kc-vbcap { color: var(--sub); font-size: 11px; font-weight: 700; letter-spacing: .5px; }
.kc-vbcap b { color: var(--ink); }
.kc-vbseg { display: inline-flex; border: 1px solid var(--field-border); border-radius: 8px; overflow: hidden; }
.kc-vbtn { background: none; border: none; color: var(--sub); font-size: 11.5px; padding: 4px 12px; cursor: pointer; }
.kc-vbtn + .kc-vbtn { border-left: 1px solid var(--field-border); }
.kc-vbtn.on { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.kc-vbhint { color: var(--faint); font-size: 11px; }

.kc-blist { border: 1px solid var(--card-border); border-radius: 12px; background: var(--card); overflow: hidden; }
.kc-blhead, .kc-blrow { display: flex; align-items: center; gap: 10px; padding: 0 12px; min-height: 26px; font-size: 12px; }
.kc-blhead {
  color: var(--faint); font-size: 9.5px; letter-spacing: .6px; font-weight: 700;
  background: var(--bg); border-bottom: 1px solid var(--line);
}
.kc-blrow { border-bottom: 1px solid var(--line); }
.kc-blrow:last-child { border-bottom: none; }
.kc-blrow:hover { background: var(--row-hover); }
.kc-blrow.on { background: var(--accent-soft); }
.kc-bl-n { flex: 0 0 22px; color: var(--faint); font-size: 11px; }
.kc-bl-name { flex: 0 1 210px; min-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--ink); }
button.kc-bl-go { background: none; border: none; padding: 0; font: inherit; text-align: left; cursor: pointer; }
button.kc-bl-go:hover { text-decoration: underline; }
.kc-blrow.on .kc-bl-go { color: var(--accent); font-weight: 600; }
.kc-blrow.on .kc-bl-sum::after { content: 'правим ↓'; margin-left: 6px; font-size: 10px; font-weight: 400; color: var(--accent); }
.kc-bl-kind { flex: 0 0 104px; color: var(--faint); font-size: 11px; }
.kc-bl-what { flex: 1 1 auto; min-width: 120px; color: var(--sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kc-bl-why { color: var(--badge-me-t); }
.kc-bl-sum { flex: 0 0 120px; text-align: right; color: var(--num); font-weight: 600; }
.kc-bl-x { flex: 0 0 26px; }
.kc-blist .kc-bdel { flex-shrink: 0; margin-left: 0; }
/* раскрытая карточка выбранного блока — акцентной рамкой (в макете — «правим ↓») */
.kc-blocks[data-kc-vb="list"] .kc-block.kc-lactive { border-color: var(--accent); }
.kc-blocks[data-kc-vb="list"] .kc-block.kc-lactive .kc-brow-compact,
.kc-blocks[data-kc-vb="list"] .kc-block.kc-lactive .kc-bhead { background: var(--row-hover); }
/* что видно в каком режиме */
.kc-blocks[data-kc-vb="rows"] .kc-blist { display: none; }
.kc-blocks[data-kc-vb="rows"] .kc-block.kc-lhide { display: block; }
.kc-blocks[data-kc-vb="list"] .kc-block.kc-lhide { display: none; }

/* ── конструктор услуги после части 2 (17.09.2026): только блоки и их настройки ──
   Со страницы ушли «Собрать расчёт», заготовки и таблица статей: статьи стали видами
   блоков. Здесь — мелочи разметки, которых раньше не было. */
.cv-comment-line { display: block; margin-top: 8px; }
.cv-comment-line .cv-cap { display: block; margin-bottom: 4px; }
.cv-comment-line input { width: 100%; }
.cv-unit-input { max-width: 160px; }
.cv-save-foot { display: flex; align-items: center; gap: 14px; margin: 18px 0 6px; }
.cv-example-table { margin-top: 4px; }
.cv-example-table tfoot td { border-top: 1px solid var(--line); border-bottom: none; padding-top: 10px; }
.cv-example-table .mono { white-space: nowrap; }

/* Название блока в окне позиции — правит сотрудник: в одной услуге работы бывают разные
   («Монтаж УЗИ», «Монтаж ИВЛ»), и это имя идёт в состав позиции и в отчёт (17.09.2026). */
.kc-bname {
  background: var(--panel); border: 1px solid var(--line); border-radius: 6px;
  padding: 3px 8px; min-width: 170px; max-width: 340px; color: var(--ink);
  font-size: 13px; font-weight: 600;
}
.kc-bname:focus { border-color: var(--accent); outline: none; }
.kc-bname::placeholder { font-weight: 400; }

/* Объяснения блоков в конструкторе.
   ВНИМАНИЕ: здесь стояли переменные --panel-bg/--border/--text, которых в темах НЕТ
   (есть --panel/--line/--ink) — браузер выбрасывал и рамку, и заливку, и цвет текста,
   поэтому серые пояснения рисовались голым текстом. Исправлено 17.09.2026 при переходе
   на карточки: тот же промах был у .kc-bname выше. */
.cv-explain { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 10px 12px; margin: 8px 0; }
.cv-explain-title { font-weight: 600; color: var(--ink); margin: 0 0 4px; font-size: 12px; }
.cv-explain-formula { font-family: monospace; color: var(--accent); margin: 4px 0; font-size: 13px; }
.cv-explain-text { color: var(--ink); margin: 4px 0; font-size: 12px; }
.cv-explain-example { color: var(--faint); font-style: italic; margin: 4px 0; font-size: 11px; }

/* ── БЛОКИ УСЛУГИ КАРТОЧКАМИ (макет v3, согласован 17.09.2026) ──
   Было: таблица «№ / Блок услуги / Как считается / Действия» — настройка блока жила в одной
   ячейке и читалась как анкета. Стало: один блок = одна карточка. Поля конструктора
   до этого рисовал браузер (своих правил у них не было) — здесь они одеты в тему.

   Шаг 2 (17.09.2026, вечер): Валера — «оформление приближенное к реальности, а то снова далеко
   от макета». Геометрия сверена ЗАМЕРОМ (`tools/_diag_ctor_layout.py`), не глазами:
   · шапка карточки: имя блока и вид идут ОДНОЙ строкой (было: рамка поля + имя вида),
     управление — тихие значки ✓ ↑ ↓ ✕ + подпись «убрать блок» справа (макет);
   · строка настроек — одна линия: подпись, компактные поля, пояснение справа от поля
     (было: поля во всю ширину, пояснение уезжало на вторую строку);
   · тёмные плашки «Закреплённое значение» и «Как считается таблица» заменены тихой строкой
     пояснения (в макете их нет);
   · поля 28px/r6 — как в макете; «＋ ДОБАВИТЬ БЛОК» — пунктирная плашка, как в макете. */
.cv-bcards { display: flex; flex-direction: column; gap: 12px; }
.cv-bcard {
  background: var(--card);
  border: 1px solid var(--card-border);
  border-radius: 10px;
  overflow: hidden;
  scroll-margin-top: 76px;
}
.cv-bcard-head {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  padding: 0 12px; min-height: 38px;
  background: var(--panel);
  border-bottom: 1px solid var(--line);
}
/* имя блока — «как текст» в макете; сами правила стоят НИЖЕ общих полей страницы, иначе
   `.cv-bcard input[type=text]` перебивает их по специфичности (грабли 17.09.2026: имя блока
   рисовалось полем 12px в рамке) */
.cv-bcard-kind {
  font-size: 11px; color: var(--faint);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
}
.cv-bcard-head .badge { margin-left: 0; }
.cv-bcard-head .cv-actions { margin-left: auto; }
/* управление блоком — тихие значки: рамка только на наведении (макет: «↑ ↓ ✕ убрать блок») */
.cv-bcard-head .cv-act {
  min-width: 24px; height: 24px; padding: 0 4px;
  border-color: transparent; background: transparent; color: var(--faint);
}
.cv-bcard-head .cv-act:hover { border-color: var(--field-border); background: var(--row-hover); }
/* ✓ и ✕ карточки — ЦВЕТОМ, а не только глифом (Валера, 18.09.2026: «убрать блок крестик
   красненьким может выделить, а галочку зелёные… не понимаю когда галочка активна»).
   Специфичность: правило идёт ПОСЛЕ `.cv-bcard-head .cv-act`, иначе тихий серый цвет
   перебивал бы зелёный/красный (у `.cv-act-ok` выше специфичность ниже). */
.cv-bcard-head .cv-act-ok { color: var(--badge-open-t); }
.cv-bcard-head .cv-act-ok:hover {
  border-color: var(--badge-open-t); background: var(--badge-open-b); color: var(--badge-open-t);
}
.cv-bcard-head .cv-act-del { color: var(--danger-t); }
.cv-bcard-head .cv-act-del:hover {
  border-color: var(--danger-t); background: var(--danger-b); color: var(--danger-t);
}
/* ЕСТЬ НЕСОХРАНЁННЫЕ ПРАВКИ: рамка карточки янтарная, ✓ горит зелёным, рядом подпись.
   Считает JS (`cv-dirty` ставится сравнением полей с тем, что нарисовал сервер). */
.cv-bcard.cv-dirty { border-color: var(--badge-me-t); }
.cv-bcard.cv-dirty .cv-bcard-head { box-shadow: inset 3px 0 0 var(--badge-me-t); }
.cv-bcard.cv-dirty .cv-act-ok {
  background: var(--badge-open-b); border-color: var(--badge-open-t); color: var(--badge-open-t);
  box-shadow: 0 0 0 2px var(--badge-open-b);
}
/* СОХРАНЕНО: карточка коротко (2 сек) зелёная — видно, что портал принял именно это */
.cv-bcard.cv-saved { border-color: var(--badge-open-t); box-shadow: 0 0 0 2px var(--badge-open-b); }
.cv-bstate {
  font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 10px;
  white-space: nowrap; margin-right: 8px;
}
.cv-bstate-dirty { background: var(--badge-me-b); color: var(--badge-me-t); }
.cv-bstate-saved { background: var(--badge-open-b); color: var(--badge-open-t); }
.cv-act-cap { font-size: 11px; color: var(--faint); }
.cv-bcard-body { padding: 12px; display: flex; flex-direction: column; gap: 10px; }
/* Свёрнутый блок в конструкторе: тело скрыто */
.cv-bcard.cv-collapsed .cv-bcard-body { display: none; }
.cv-bcard-toggle {
  background: none; border: none; color: var(--faint); cursor: pointer;
  font-size: 14px; padding: 0 4px; transition: transform 0.15s;
  flex-shrink: 0;
}
.cv-bcard-toggle:hover { color: var(--ink); }
.cv-brow { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
/* пояснение в строке держим НА ТОЙ ЖЕ линии, что поля: flex-basis (а не auto) делает его
   условную ширину 160px — строка не переносится, а длинный текст доворачивается ВНУТРИ
   своего места (грабли 17.09.2026: с `auto` пояснение уезжало на вторую строку). */
.cv-brow > .cv-hint { flex: 1 1 160px; min-width: 0; }
.cv-brow-cap { font-size: 11px; color: var(--faint); }
.cv-arrow { color: var(--faint); font-size: 13px; }
.cv-brow-input { flex: 1 1 300px; min-width: 200px; }
.cv-formula-input { width: 240px; color: var(--num); font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; }
.cv-bcard .cv-hint { font-size: 11px; }
.cv-bcard-note { margin: 0; color: var(--faint); font-size: 11px; line-height: 1.6; }
.cv-hr { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--faint); }
.cv-hrpct { width: 56px; }
.cv-hrlbl { width: 96px; }
/* второе уточнение статьи — свёрнуто, пока не нужно (макет v3: в строке одна пара
   «колонка = значение»; второе уточнение открывается щелчком или само, если оно уже задано) */
.cv-scope2 { display: inline-flex; align-items: center; gap: 6px; }
.cv-scope2 > summary { cursor: pointer; list-style: none; font-size: 11px; color: var(--faint); }
.cv-scope2 > summary::-webkit-details-marker { display: none; }
.cv-scope2[open] > summary { color: var(--faint); }
/* строка «Столбцы таблицы» — галочки столбцов ЭТОГО блока (17.09.2026: вид «Таблица строк»
   один на всё, что в таблице — решает админ у блока). Держим одной линией, как в макете:
   компактные подписи и перенос только между галочками, если строка совсем длинная. */
.cv-brow-cols { row-gap: 4px; }
.cv-colticks { display: inline-flex; align-items: center; gap: 2px 10px; flex-wrap: wrap; }
.cv-coltick {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11.5px; color: var(--sub); white-space: nowrap; cursor: pointer;
}
.cv-coltick input[type=checkbox] { width: 13px; height: 13px; margin: 0; accent-color: var(--accent); }
/* ── Столбцы БЛОКА (21.09.2026): имя правится, роль выбирается (макет
   design/articles-block-own-column-constructor.png). «＋ свой столбец» и ✕ — как у блоков */
.cv-cols { display: flex; flex-direction: column; gap: 4px; margin: 2px 0 8px; }
.cv-colrow {
  display: flex; align-items: center; gap: 6px;
  padding: 3px 6px 3px 8px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--field-soft, rgba(255,255,255,.02));
}
/* галочка «включить или выключить поле» (21.09.2026): снятая — строка приглушена, столбца нет
   в строках позиции и в отчёте (остаётся в наборе блока и в этой карточке) */
.cv-colon { width: 14px; height: 14px; margin: 0; accent-color: var(--accent); cursor: pointer; }
.cv-colrow-off { opacity: .55; }
.cv-colrow-off .cv-colname, .cv-colrow-off .cv-colrole { color: var(--faint); }
.cv-colnum { width: 16px; color: var(--faint); font-size: 10.5px; text-align: right; }
.cv-colname {
  flex: 0 1 300px; min-width: 140px; height: 26px; padding: 0 8px;
  background: var(--field); border: 1px dashed var(--field-border); border-radius: 6px;
  color: var(--ink); font-size: 12px; font-family: inherit;
}
.cv-colname:focus, .cv-colname:not(:placeholder-shown) { border-style: solid; }
/* «по умолчанию» (22.09.2026, макет `design/defaults-mockup-a2.png`): подпись + поле 160 px в
   свободной части строки столбца — между ролью и галочкой. Пунктирная рамка = умолчания нет,
   сплошная = задано (то же правило, что у имени столбца). */
.cv-coldef-wrap { display: flex; align-items: center; gap: 6px; flex: 0 1 auto; min-width: 0; }
.cv-coldeflbl { color: var(--faint); font-size: 10.5px; white-space: nowrap; }
.cv-coldef {
  flex: 0 1 160px; width: 160px; min-width: 88px; height: 26px; padding: 0 8px;
  background: var(--field); border: 1px dashed var(--field-border); border-radius: 6px;
  color: var(--ink); font-size: 12px; font-family: inherit;
}
.cv-coldef:focus, .cv-coldef:not(:placeholder-shown) { border-style: solid; }
.cv-coldefhint {
  align-self: flex-start; margin-top: 3px; color: var(--faint);
  font-size: 10.5px; font-style: italic;
}
.cv-colrole {
  flex: 0 0 auto; width: 236px; height: 26px; padding: 0 6px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 6px;
  color: var(--accent); font-size: 11.5px; font-family: inherit;
}
.cv-colnote { color: var(--faint); font-size: 10.5px; font-style: italic; }
.cv-coladd {
  align-self: flex-start; margin-top: 2px; padding: 5px 12px;
  background: none; border: 1px dashed var(--accent); border-radius: 8px;
  color: var(--accent); font-size: 11.5px; font-weight: 600; cursor: pointer;
}
.cv-coladd:hover { background: var(--accent-soft, rgba(96,165,250,.12)); }
.cv-blocks-panel .cv-brow .cv-hint { line-height: 1.5; }

/* поля страницы услуги: шапка, карточки блоков, «добавить блок» */
.cv-bcard input[type=text], .cv-bcard select,
.cv-addblock input[type=text], .cv-addblock select,
.cv-head-form input[type=text] {
  height: 28px; padding: 0 8px;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 6px;
  color: var(--ink); font-size: 12px; font-family: inherit;
}
/* Ширина полей — как в макете (≈150/190/170px): из-за полей «во всю ширину» строка настроек
   не влезала в одну линию и пояснения уезжали вниз (замер 17.09.2026: «Инженер 1» — 2 строки,
   «НР и НЦ» — 2 строки). Порядок правил важен: `block_dict_field_` начинается с `block_dict_`. */
.cv-bcard-body select[name^="block_dict_field_"] { max-width: 190px; }
.cv-bcard-body select[name^="block_dict_"] { max-width: 150px; }
.cv-bcard-body select[name^="block_scope"] { max-width: 170px; }
.cv-unit-input { width: 90px; }
/* имя блока в шапке карточки — «как текст» (макет v3): ширина по содержимому, рамка только
   на наведении и в фокусе. Селектор `input.cv-bcard-title` + это место в файле — нарочно:
   так правило перебивает общее поле выше. */
.cv-bcard input.cv-bcard-title {
  flex: 0 1 auto; width: auto; min-width: 7ch; max-width: 30ch;
  padding: 0 4px; border-color: transparent; background: transparent;
  font-size: 14px; font-weight: 600; color: var(--ink);
  field-sizing: content;
}
.cv-bcard input.cv-bcard-title:hover { border-color: var(--field-border); background: var(--field); }
.cv-bcard input.cv-bcard-title:focus { border-color: var(--accent); background: var(--field); }
.cv-bcard input[type=text]:focus, .cv-bcard select:focus,
.cv-addblock input[type=text]:focus, .cv-addblock select:focus,
.cv-head-form input[type=text]:focus {
  outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft);
}
/* пустое поле комментария — пунктиром, как в макете (там же placeholder «+ добавить комментарий») */
.cv-brow-input:placeholder-shown { border-style: dashed; }
.cv-bcard select:disabled, .cv-addblock select:disabled { opacity: .55; }
/* «＋ ДОБАВИТЬ БЛОК» — пунктирная плашка внизу панели (макет v3) */
.cv-addblock {
  display: flex; flex-direction: column; gap: 8px; margin-top: 16px; padding: 12px;
  border: 1px dashed var(--field-border); border-radius: 10px; background: var(--panel);
}
.cv-addblock-cap { font-size: 12px; font-weight: 700; letter-spacing: .5px; color: var(--accent); }
.cv-addblock-form { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cv-addblock-form input[type=text] { min-width: 260px; }
/* шапка панели: подсказка — справа, как в макете («услуга задаёт ВИДЫ блоков; …») */
.cv-blocks-panel .cv-panel-head { justify-content: space-between; }
.cv-blocks-panel .cv-panel-head .cv-hint { margin-left: auto; text-align: right; }
/* СВЕТЛАЯ ТЕМА: в ней --panel — это тёмно-синий сайдбар, а не подложка карточки, поэтому
   шапка карточки и плашка «добавить блок» в светлой теме светлые (иначе имя блока чёрным
   по тёмно-синему — не читается; грабли 17.09.2026). */
html[data-theme="light"] .cv-bcard-head { background: var(--card); }
html[data-theme="light"] .cv-addblock { background: var(--card); }
html[data-theme="light"] .cv-explain { background: var(--card); }
html[data-theme="light"] .kc-bname { background: var(--card); }
/* «Сохранить услугу» — в шапке услуги справа (макет v3), а не отдельной строкой внизу */
.cv-head-save { margin-left: auto; }

/* ── Часть 3 плана (18.09.2026): вложения строк блоков («КП приложили тут же») ─────────
   Колонка «Вложение» у блоков-таблиц (Запчасти, Субподряд) и плашка у «Статьи»:
   бейдж файла (имя · размер), зона «＋ файл» и drag&drop прямо в строку. */
.kc-bfilecol { }
.kc-bfilecell {
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
  border-radius: 4px; padding: 2px 4px; min-height: 26px;
}
.kc-bfilecell.on { outline: 1px dashed var(--accent); background: var(--accent-soft); }
.kc-bfiles-compact { flex: 0 1 auto; max-width: 260px; }
.kc-bfdrop {
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 7px;
  border: 1px dashed var(--line); border-radius: 4px; cursor: pointer;
  color: var(--sub); font-size: 12px; white-space: nowrap;
}
.kc-bfdrop:hover { border-color: var(--accent); color: var(--accent); }
.kc-bfbadge {
  display: inline-flex; align-items: center; gap: 5px; padding: 1px 6px;
  border: 1px solid var(--line); border-radius: 4px; font-size: 12px; max-width: 190px;
}
.kc-bfname {
  color: var(--ink); text-decoration: none; max-width: 118px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.kc-bfname:hover { color: var(--accent); text-decoration: underline; }
.kc-bfsize { color: var(--faint); font-size: 11px; }
.kc-bfdel { color: var(--faint); text-decoration: none; font-size: 11px; }
.kc-bfdel:hover { color: #e05555; }
.kc-bfmsg { color: var(--sub); font-size: 11px; }
.kc-bfmsg.bad { color: #e0755f; }
/* подпись у файла, который уедет на услугу только при сохранении (13.10.2026):
   раньше это была та же метка `.kc-bfmsg`, и очистка сообщения гасила подпись в бейдже */
.kc-bfwait { color: var(--sub); font-size: 11px; }
/* полоса загрузки вложения строки блока (Валера, 28.09.2026: видно только «загружаю…») */
.kc-bfbar { display: none; width: 100%; height: 5px; border-radius: 3px; margin-top: 4px;
            background: var(--field); border: 1px solid var(--field-border); overflow: hidden; }
.kc-bfbar.on { display: block; }
.kc-bfbar i { display: block; height: 100%; width: 0; background: var(--accent);
              transition: width .2s ease; }

/* Меню без Bootstrap (22.09.2026). В портале подключены только portal.css/portal.js, а на
   кнопках стоял `data-bs-toggle="dropdown"` с `.dropdown-menu`: список с именем шаблона
   рисовался прямо на странице («маркер всплыл»), сама кнопка не открывалась
   (Валера: «кнопка Word кривая, там рядом ещё и маркер всплыл, сама кнопка не работает»).
   Своё меню на <details> работает без JS и без Bootstrap. */
.kp-menu { position: relative; display: inline-block; }
.kp-menu > summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px;
}
.kp-menu > summary::-webkit-details-marker { display: none; }
.kp-menu > summary::marker { content: ""; }
.kp-menu[open] > summary { filter: brightness(1.12); }
.kp-menu-list {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 220px;
  background: var(--card); border: 1px solid var(--card-border); border-radius: 8px;
  padding: 6px; box-shadow: 0 10px 26px rgba(0, 0, 0, .28); text-align: left;
}
/* Закрытое меню не должно рисоваться (Валера, 23.09.2026: «нажимаю по выбору, он скачивается,
   но выбор не закрывается»): список спозиционирован абсолютно, и закрытие <details> его НЕ
   прятало — он оставался висеть поверх заявки, хотя `open` уже снят. */
details:not([open]) > .kp-menu-list { display: none; }
.kp-menu-left .kp-menu-list { left: 0; right: auto; }
.kp-menu-list a {
  display: block; padding: 7px 10px; border-radius: 6px; font-size: 13px;
  color: var(--ink); text-decoration: none; white-space: nowrap;
}
.kp-menu-list a:hover { background: var(--row-hover); color: var(--accent); }


/* ============ Word-шаблоны: экран «Список шаблонов» и «Новый шаблон» (вариант C, 22.09.2026) ============
   Числа — из генератора макетов design/build_word_variants_mockup.py (word-var-c-hybrid.png,
   word-var-b-own-docx.png): контент 960 px, карточка — радиус 10, рамка 1.2; шапка карточки 34 px
   (синий #2563eb · фиолетовый #7c3aed · зелёный #059669), текст 11 px bold белым; строка таблицы
   48 px; шапка таблицы 9 px bold, letter-spacing .7, --faint; чётные строки — --row-hover;
   чипс 20 px (тег 18), поле 24–26 px, кнопка 38 px радиус 8, бейдж 20 px.
   Только переменные портала (--card, --ink, --accent…), никакого Bootstrap. */

.wt-wrap { max-width: 960px; }

.wt-crumbs { font-size: 12px; color: var(--faint); margin-bottom: 6px; }
.wt-crumbs a { color: var(--faint); text-decoration: none; }
.wt-crumbs a:hover { color: var(--ink); }
.wt-crumbs span { margin: 0 4px; }

.wt-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 14px; flex-wrap: wrap; }
.wt-head h1 { font-size: 25px; font-weight: 700; }
.wt-head-actions { display: flex; gap: 8px; flex: none; align-items: center; }

/* кнопки: акцентная 38 px, «призрачная» — поле с рамкой */
.wt-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 38px; padding: 0 18px; border-radius: 8px; border: 0; cursor: pointer;
  background: var(--accent); color: #fff;
  font-family: inherit; font-size: 12.5px; font-weight: 700; text-decoration: none; white-space: nowrap;
}
.wt-btn:hover { filter: brightness(1.08); }
.wt-btn-ghost { background: var(--field); border: 1px solid var(--field-border); color: var(--sub); }
.wt-btn-ghost:hover { border-color: var(--accent); color: var(--accent); filter: none; }
.wt-btn-sm { height: 26px; padding: 0 12px; font-size: 11.5px; border-radius: 6px; }
.wt-btn[disabled], .wt-btn.is-off { opacity: .5; cursor: default; pointer-events: none; }

/* синяя подсказка под заголовком */
.wt-hint { margin-top: 24px; background: var(--accent-soft); border: 1px solid var(--accent); border-radius: 10px; padding: 13px 18px; }
.wt-hint b { display: block; font-size: 11.5px; font-weight: 700; color: var(--ink); }
.wt-hint span { display: block; margin-top: 5px; font-size: 10.5px; color: var(--sub); }

/* карточка с цветной шапкой */
/* 22.09.2026: `overflow: hidden` у карточки РЕЗАЛ выпадающие меню. Валера: «нажал +услуга и мне
   не видно что всплывает, заезжает за оформление» — список услуг позиционируется абсолютно и
   обрезался по границе карточки (живая проба: точка внутри списка попадала в сайдбар).
   Скругление шапки делаем ЕЙ САМОЙ — карточке обрезать содержимое больше не нужно. */
.wt-card { margin-top: 22px; background: var(--card); border: 1.2px solid var(--card-border); border-radius: 10px; }
.wt-card-head {
  height: 34px; display: flex; align-items: center; padding: 0 14px;
  font-size: 11px; font-weight: 700; letter-spacing: .5px; color: #fff; background: var(--accent);
  border-radius: 9px 9px 0 0;
}
.wt-h-blue { background: #2563eb; }
.wt-h-violet { background: #7c3aed; }
.wt-h-green { background: #059669; }
.wt-card-body { padding: 14px; }
.wt-card-note { padding: 0 14px 14px; font-size: 10.5px; color: var(--sub); line-height: 1.5; }
.wt-card-note .wt-faint { color: var(--faint); font-size: 10px; }

/* список шаблонов */
.wt-table { width: 100%; border-collapse: collapse; }
.wt-table th {
  padding: 0 8px 8px; text-align: left; font-size: 9px; font-weight: 700;
  letter-spacing: .7px; text-transform: uppercase; color: var(--faint);
  border-bottom: 1px solid var(--line);
}
.wt-table td { padding: 14px 8px; font-size: 12px; color: var(--sub); vertical-align: middle; }
.wt-table tbody tr:hover td { background: var(--row-hover); }
.wt-table tbody tr:nth-child(odd) td { background: var(--row-hover); }
.wt-table tbody tr:nth-child(odd) td:first-child { border-radius: 6px 0 0 6px; }
.wt-table tbody tr:nth-child(odd) td:last-child { border-radius: 0 6px 6px 0; }
.wt-name { font-size: 12px; font-weight: 700; color: var(--ink); }
.wt-name-off { color: var(--faint); font-weight: 600; }
.wt-svc-text { font-size: 11px; color: var(--sub); }
.wt-svc-text.common { color: var(--badge-me-t); }
.wt-svc-warn { font-size: 11px; color: var(--badge-me-t); }
.wt-act { text-align: right; white-space: nowrap; }
.wt-icon { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px;
  border-radius: 6px; color: var(--faint); text-decoration: none; font-size: 14px; }
.wt-icon:hover { background: var(--accent-soft); color: var(--accent); }

/* бейджи (как в макете: 20 px, радиус 10) */
.wt-badge {
  display: inline-flex; align-items: center; height: 20px; padding: 0 10px; border-radius: 10px;
  font-size: 10.5px; font-weight: 600; white-space: nowrap;
}
.wt-badge-builder { color: var(--badge-open-t); background: var(--badge-open-b); }
.wt-badge-file { color: var(--badge-me-t); background: var(--badge-me-b); }
.wt-badge-off { margin-left: 8px; color: var(--sub); background: var(--row-hover); }

/* чипсы: тег (моноширинный) и услуга */
.wt-chip {
  display: inline-flex; align-items: center; height: 20px; padding: 0 7px; border-radius: 4px;
  background: var(--accent-soft); color: var(--accent); font-size: 10px; white-space: nowrap;
}
.wt-chip.mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.wt-chip-tag { height: 18px; font-size: 9.5px; }
.wt-chip-group { display: flex; flex-wrap: wrap; gap: 5px; }
.wt-svc {
  display: inline-flex; align-items: center; gap: 8px; height: 24px; padding: 0 12px; border-radius: 12px;
  background: var(--card); border: 1px solid var(--field-border); color: var(--ink); font-size: 11px;
}
.wt-svc button { background: none; border: 0; padding: 0; color: var(--faint); font-size: 12px; line-height: 1; cursor: pointer; }
.wt-svc button:hover { color: var(--danger-t); }
.wt-chips-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

/* поля ввода */
.wt-label { display: block; margin-bottom: 6px; font-size: 9px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; color: var(--faint); }
.wt-input {
  width: 100%; height: 26px; padding: 0 8px; border-radius: 5px;
  background: var(--field); border: 1px solid var(--field-border); color: var(--ink);
  font-family: inherit; font-size: 12px;
}
.wt-input:focus { outline: none; border-color: var(--accent); }

/* переключатель способа сборки */
.wt-switch { display: flex; gap: 8px; margin-top: 20px; }
.wt-tab {
  height: 36px; padding: 0 18px; border-radius: 8px; cursor: pointer;
  background: var(--field); border: 1px solid var(--field-border); color: var(--faint);
  font-family: inherit; font-size: 12.5px; font-weight: 600;
}
.wt-tab.on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); font-weight: 700; }

/* две колонки экрана «Новый шаблон»: 560 + 376, зазор 24 */
.wt-cols { display: grid; grid-template-columns: 560px 376px; gap: 24px; margin-top: 18px; align-items: start; }
.wt-col { min-width: 0; }
.wt-col .wt-card:first-child { margin-top: 0; }
@media (max-width: 1200px) { .wt-cols { grid-template-columns: 1fr; } }

/* загрузка файла */
.wt-drop {
  display: flex; flex-direction: column; justify-content: center; gap: 3px;
  min-height: 46px; padding: 9px 20px; border-radius: 8px; cursor: pointer;
  background: var(--field); border: 1.4px dashed var(--field-border);
}
.wt-drop:hover, .wt-drop.over { border-color: var(--accent); }
.wt-drop input[type="file"] { display: none; }
.wt-drop-main { font-size: 11.5px; color: var(--sub); }
.wt-drop-sub { font-size: 9.5px; color: var(--faint); }
.wt-file-row { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-top: 12px; }
.wt-file-name { font-size: 10.5px; color: var(--sub); }
.wt-link { background: none; border: 0; padding: 0; cursor: pointer; font-family: inherit;
  font-size: 10.5px; font-weight: 700; color: var(--accent); }
.wt-link:hover { text-decoration: underline; }

/* карта подстановки */
.wt-ph { display: grid; grid-template-columns: 16px 200px 1fr; align-items: center; gap: 6px; min-height: 30px; }
.wt-ph .wt-chip { justify-self: start; }
.wt-ph-desc { font-size: 10.5px; color: var(--sub); }
.wt-ph-desc.warn { color: var(--badge-me-t); }
.wt-dot { width: 10px; height: 10px; border-radius: 50%; background: var(--badge-open-t); }
.wt-dot.warn { background: var(--badge-me-t); }
.wt-note { margin-top: 12px; font-size: 10px; color: var(--faint); line-height: 1.5; }

/* инструкция шагами */
.wt-step { display: flex; gap: 12px; padding: 6px 0; }
.wt-step-num {
  flex: none; width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center;
  background: var(--accent-soft); color: var(--accent); font-size: 10px; font-weight: 700;
}
.wt-step-txt { font-size: 10.5px; color: var(--sub); line-height: 1.35; }

/* «Реестр полей — четыре использования» и «Как это работает» */
.wt-reg { display: grid; grid-template-columns: 268px 28px 1fr; align-items: center; }
.wt-inner { background: var(--row-hover); border: 1px solid var(--card-border); border-radius: 8px; padding: 14px; }
.wt-reg-title { font-size: 11px; font-weight: 700; color: var(--ink); }
.wt-reg-sub { margin-top: 6px; font-size: 10px; color: var(--sub); }
.wt-reg-faint { margin-top: 8px; font-size: 10px; color: var(--faint); }
.wt-reg-mid { height: 1.3px; background: var(--accent); }
.wt-reg-boxes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.wt-reg-box { position: relative; background: var(--card); border: 1.2px solid var(--card-border); border-radius: 8px; padding: 12px; min-height: 88px; }
.wt-reg-box::before { content: ""; position: absolute; left: -13px; top: 50%; width: 13px; height: 1.3px; background: var(--accent); }
.wt-reg-box b { font-size: 10.5px; color: var(--ink); }
.wt-reg-box span { display: block; margin-top: 6px; font-size: 9.5px; color: var(--sub); line-height: 1.35; }

.wt-how { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.wt-how-item { background: var(--row-hover); border: 1px solid var(--card-border); border-radius: 8px; padding: 14px; min-height: 148px; }
.wt-how-title { font-size: 11.5px; font-weight: 700; color: var(--accent); }
.wt-how-item ul { margin: 10px 0 0; padding: 0; list-style: none; }
.wt-how-item li { font-size: 10.5px; color: var(--sub); line-height: 1.45; }
.wt-how-item li::before { content: "•  "; }
@media (max-width: 900px) {
  .wt-reg { grid-template-columns: 1fr; gap: 14px; }
  .wt-reg-mid, .wt-reg-box::before { display: none; }
  .wt-reg-boxes, .wt-how { grid-template-columns: 1fr 1fr; }
}

/* меню «＋ услуга» — подсказка со списком услуг (details, без Bootstrap) */
.wt-svc-menu { display: inline-block; }
.wt-svc-menu > summary {
  list-style: none; cursor: pointer; display: inline-flex; align-items: center;
  height: 24px; padding: 0 12px; border-radius: 6px; background: var(--field);
  border: 1px solid var(--field-border); color: var(--faint); font-size: 11.5px; font-weight: 600;
}
.wt-svc-menu > summary::-webkit-details-marker { display: none; }
.wt-svc-menu > summary:hover { border-color: var(--accent); color: var(--accent); }
.wt-svc-menu .kp-menu-list { background: var(--card); border: 1px solid var(--card-border); max-height: 260px; overflow-y: auto; }
.wt-svc-opt { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 6px; font-size: 12.5px; color: var(--ink); cursor: pointer; }
.wt-svc-opt:hover { background: var(--row-hover); }
.wt-svc-opt input { accent-color: var(--accent); }
.wt-svc-opt span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* пустое состояние */
.wt-empty { padding: 26px 8px 22px; text-align: center; }
.wt-empty p { font-size: 15px; font-weight: 600; color: var(--ink); }
.wt-empty span { display: block; margin: 6px auto 0; max-width: 560px; font-size: 13px; color: var(--faint); }



/* ─────────── Конструктор Word-шаблона (макет A): блоки и реестр полей ───────────
   Числа — из design/build_word_variants_mockup.py (var_a): карточки 560/376 с зазором 24,
   поле 24 px радиус 5, кнопка-призрак 26 px, чипс 18–20 px, подписи 9–10.5 px,
   цветные шапки блоков — синий/фиолетовый/зелёный. Только переменные портала. */

/* строка «Услуги шаблона» + «Общий» */
.wt-svc-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 16px; }
.wt-svc-line .wt-btn-sm { height: 24px; padding: 0 10px; }
.wt-svc-note { width: 100%; margin-top: 4px; font-size: 10.5px; color: var(--faint); }
.wt-common { display: flex; align-items: center; gap: 8px; margin-left: auto; font-size: 11px; color: var(--sub); cursor: pointer; }
.wt-common input { width: 16px; height: 16px; accent-color: var(--accent); }

/* блок конструктора: цветная шапка 34 px с номером и кнопками */
.wt-blk { margin-top: 22px; }
.wt-blk-head { justify-content: space-between; padding-right: 8px; cursor: default; }
.wt-blk-title { font-size: 11px; font-weight: 700; color: #fff; }
.wt-blk-actions { display: flex; gap: 2px; }
.wt-blk-actions button {
  width: 22px; height: 22px; border: 0; border-radius: 4px; background: none; cursor: pointer;
  color: #fff; opacity: .85; font-size: 12px; line-height: 1;
}
.wt-blk-actions button:hover { background: rgba(255, 255, 255, .2); opacity: 1; }
.wt-blk-body { padding: 14px; }

/* абзац: поле с тегами моноширинным шрифтом (как в макете — акцентный цвет) */
.wt-pbox {
  display: block; width: 100%; min-height: 52px; padding: 5px 7px; resize: vertical;
  background: var(--field); border: 1px solid var(--field-border); border-radius: 5px;
  color: var(--accent); font-family: ui-monospace, SFMono-Regular, Consolas, monospace;
  font-size: 10.5px; line-height: 1.6;
}
.wt-pbox:focus { outline: none; border-color: var(--accent); }
.wt-inserted { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.wt-inserted-label { font-size: 10.5px; color: var(--faint); }
.wt-blk-btns { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 14px; }
.wt-blk-btns .wt-btn-sm { height: 26px; padding: 0 12px; }
.wt-blk-btns .wt-btn.is-on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.wt-sel {
  height: 26px; padding: 0 6px; border-radius: 6px; font-family: inherit; font-size: 11.5px;
  background: var(--field); border: 1px solid var(--field-border); color: var(--sub);
}
.wt-sel:focus { outline: none; border-color: var(--accent); }

/* таблица-конструктор: ЗАГОЛОВОК 180 · ПОЛЕ 160 · ФОРМАТ 80 · ШИРИНА 44 · хвост */
.wt-colhead { display: grid; grid-template-columns: 180px 160px 80px 44px 1fr; gap: 6px; padding: 0 6px 6px; }
.wt-colhead span { font-size: 9px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; color: var(--faint); }
.wt-colrow { display: grid; grid-template-columns: 180px 160px 80px 44px 1fr; gap: 6px; align-items: center; padding: 4px 6px; border-radius: 6px; }
.wt-colrow:nth-child(odd) { background: var(--row-hover); }
.wt-colrow .wt-input, .wt-colrow .wt-sel { height: 24px; font-size: 10.5px; }
.wt-colrow .wt-input.mono, .wt-field-text { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; }
.wt-colrow .wt-input.mono { color: var(--accent); }
.wt-colrow .wt-input.own { color: var(--faint); }
.wt-coltail { display: flex; align-items: center; gap: 6px; }
.wt-cm { font-size: 10px; color: var(--faint); }
.wt-colacts { display: flex; gap: 2px; }
.wt-colacts button { width: 20px; height: 20px; border: 0; border-radius: 4px; background: none; color: var(--faint); font-size: 11px; cursor: pointer; line-height: 1; }
.wt-colacts button:hover { background: var(--accent-soft); color: var(--accent); }
.wt-rows-source { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.wt-rows-source .wt-sel { height: 26px; font-size: 11px; }
.wt-cols-hint { margin-top: 10px; font-size: 10.5px; color: var(--sub); }
.wt-addblk-menu { display: block; }
.wt-addblk-menu > summary.wt-addblk {
  display: flex; align-items: center; justify-content: center; width: 100%; height: 34px;
  margin-top: 22px; color: var(--accent); font-size: 12.5px; font-weight: 700;
}
.wt-addblk-menu > summary.wt-addblk::after { content: ""; }

/* реестр полей — правая колонка конструктора */
.wt-fieldreg { margin-top: 14px; }
.wt-fieldreg:first-child { margin-top: 0; }
.wt-fieldgroup { margin-bottom: 6px; font-size: 9px; font-weight: 700; letter-spacing: .7px; text-transform: uppercase; color: var(--faint); }
.wt-chip-btn { cursor: pointer; background: none; border: 1px solid transparent; font-family: inherit; }
.wt-chip-btn:hover { background: var(--accent); color: #fff; }
.wt-reg-note { margin-top: 14px; font-size: 10px; color: var(--sub); }
.wt-reg-note.faint { margin-top: 4px; color: var(--faint); }

/* ── карточка-подсказка «что получится в КП» (правая колонка правки шаблона, 376 px) ──
   Таблица внутри — как лист документа: белая, Times New Roman, мелкий кегль, длинные
   ячейки обрезаны до двух строк (полный текст — в подсказке при наведении). */
.kph-picked { font-size: 11.5px; color: var(--sub); }
.kph-picked b { color: var(--ink); }
.kph-shot { margin-top: 8px; padding: 5px; border-radius: 6px; background: #fff; }
table.kp-mini { width: 100%; border-collapse: collapse; table-layout: fixed;
  font-family: "Times New Roman", serif; font-size: 10.5px; line-height: 1.25; color: #000; }
table.kp-mini th, table.kp-mini td { border: 1px solid #000; padding: 2px 4px; vertical-align: top;
  overflow-wrap: anywhere; }
table.kp-mini th { font-weight: 700; text-align: center; }
table.kp-mini td.num { text-align: center; }
table.kp-mini td.sum { text-align: right; }
table.kp-mini .clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; }
table.kp-mini tr.mark td { background: #fff2a8; }
table.kp-mini .blk { margin-top: 2px; font-family: "Liberation Sans", sans-serif; font-size: 9.5px;
  line-height: 1.25; color: #6b7280; }
.kph-note { margin-top: 5px; font-size: 10px; color: var(--faint); }
/* Пояснение под примером (Валера, 01.10.2026: «примеры не поясняют, как и что делать»):
   что даёт выбранный источник строк и откуда берётся пометка «работы / материалы и ЗЧ». */
.kph-why { margin-top: 8px; padding-top: 7px; border-top: 1px dashed var(--line);
  font-size: 10.5px; line-height: 1.45; color: var(--sub); }
.kph-others-head { margin-top: 12px; font-size: 9.5px; font-weight: 700; letter-spacing: .6px;
  text-transform: uppercase; color: var(--faint); }
ul.kph-others { margin: 6px 0 0; padding: 0; list-style: none; font-size: 11px; line-height: 1.35;
  color: var(--sub); }
ul.kph-others li { margin-bottom: 6px; }
ul.kph-others b { color: var(--ink); }
ul.kph-others .ex { color: var(--faint); }
ul.kph-others .kph-pick { cursor: pointer; }
ul.kph-others .kph-pick:hover b { color: var(--accent); }

/* ответ сервера: ошибки проверки блока и подсказки */
.wt-status { margin-top: 10px; font-size: 10.5px; color: var(--badge-open-t); min-height: 14px; }
.wt-blk .wt-status { padding: 0 14px 10px; }
.wt-blk .wt-status:empty { padding: 0; }
.wt-colrow .wt-sel.mono { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; color: var(--accent); }
.wt-status.err { color: var(--danger-t); }

/* ОТКЛИК СОХРАНЕНИЯ (Валера, 23.09.2026: «сохраняю конструктор word — не понятно, сохранилось
   или нет, 0 признаков»): плашка рядом с кнопкой «Сохранить» + крупная строка в самом блоке,
   куда смотрит человек. Успех виден 6 секунд и подсвечивает карточку блока, ошибка — висит. */
.wt-save-chip { display: none; font-size: 12px; font-weight: 700; padding: 5px 10px;
  border-radius: 8px; white-space: nowrap; }
.wt-save-chip.ok { display: inline-block; color: var(--badge-open-t);
  background: var(--badge-open-b); border: 1px solid var(--badge-open-t); }
.wt-save-chip.err { display: inline-block; color: var(--danger-t);
  background: var(--danger-b); border: 1px solid var(--danger-t); }
.wt-save-chip.wait { display: inline-block; color: var(--sub); }
.wt-blk .wt-status { font-size: 12px; font-weight: 700; min-height: 18px; }
.wt-card.wt-saved { border-color: var(--badge-open-t); }
.wt-card.wt-failed { border-color: var(--danger-t); }

/* ══════════════ ПРЕДПРОСМОТР ШАБЛОНА WORD СТРАНИЦЕЙ (часть 3, §3.6) ══════════════
   Лист — пропорция А4 (210×297) при колонке 560 px (2,667 px/мм); поля листа 2 см = 53 px,
   поэтому текст идёт в размерах документа (14 pt ≈ 13 px). Лист ВСЕГДА белый — как в Word. */
.wp-bar {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-top: 18px; padding: 12px 14px; border-radius: 10px;
  background: var(--card); border: 1.2px solid var(--card-border);
}
.wp-bar-label { font-size: 11.5px; font-weight: 700; color: var(--sub); }
.wp-select { min-width: 220px; max-width: 320px; }
.wp-bar-note { font-size: 10.5px; color: var(--faint); }

.wp-paper { margin-top: 14px; }
.wp-sheet {
  width: 100%; min-height: 792px; padding: 53px; border-radius: 6px;
  background: #ffffff; border: 1px solid var(--line); color: #1a1a1a;
  font-size: 13px; line-height: 1.35;
}
.wp-p { margin: 0 0 8px; }
.wp-table { width: 100%; border-collapse: collapse; margin: 6px 0 10px; table-layout: fixed; }
.wp-table th, .wp-table td { border: 1px solid #c9c9c9; padding: 3px 6px; vertical-align: top; }
.wp-table th { background: #efefef; font-size: 10px; font-weight: 700; text-align: center; }
.wp-table td { font-size: 11px; }
.wp-tot-l { text-align: right; font-weight: 700; font-size: 11px; }
.wp-tot-v { text-align: center; font-weight: 700; font-size: 11px; }
.wp-total, .wp-sign { display: flex; justify-content: space-between; gap: 10px; margin: 10px 0 8px; font-weight: 700; }
.wp-total span:last-child { text-align: center; min-width: 120px; }
.wp-foot, .wp-filehead { margin-top: 16px; padding: 6px 0; border-top: 1px solid #dddddd; color: #555555; font-size: 10px; }
.wp-filehead { margin: 0 0 12px; border-top: 0; border-bottom: 1px solid #dddddd; }
.wp-empty { color: #777777; font-size: 11px; }
.wp-error {
  margin-top: 14px; padding: 10px 14px; border-radius: 8px; font-size: 11px;
  color: var(--danger-t); background: var(--danger-b); border: 1px solid var(--danger-t);
}
.wp-kv { display: flex; justify-content: space-between; gap: 10px; padding: 4px 0; font-size: 10.5px; }
.wp-kv span { flex: none; color: var(--faint); }
.wp-kv b { font-weight: 600; color: var(--ink); text-align: right; }


/* ============ блок «Данные»: отчёты с тэгами (28.09.2026) ============
   Подблок «Отчёты»: вкладки, реестр с тэгом, форма загрузки с полосой
   процентов и страница разбора с этапами. Все цвета — из переменных темы,
   чтобы светлая тема не разъезжалась. */

.dt-tabs { display: flex; gap: 10px; margin: 0 0 18px; flex-wrap: wrap; }
/* Ссылка «Сравнение двух моделей» под вкладками свода — бывшая кнопка в строке
   поиска, вынесена владельцем 07.10.2026: обычная ссылка, не кнопка. */
.svod-cmp-link { margin: -8px 0 14px; font-size: 14px; }
.svod-cmp-link a { color: var(--accent); text-decoration: none; font-weight: 600; }
.svod-cmp-link a:hover { text-decoration: underline; }
.dt-tab {
  display: inline-block; padding: 9px 16px; border-radius: 9px; font-size: 14px;
  color: var(--sub); text-decoration: none; border: 1px solid var(--field-border);
  background: transparent; transition: background .15s, color .15s;
}
.dt-tab:hover { color: var(--ink); }
/* Вкладки «ТО | Метрология» — одинакового размера (владелец, 21.10.2026: «размер вкладок
   оставить чтобы были в едином формате»): после переименования «ТО и ТО12+» → «ТО» короткое
   название не должно сжимать свою вкладку. */
.dt-tabs.calc-tabs .dt-tab { min-width: 150px; display: inline-flex; align-items: center;
  justify-content: center; text-align: center; }
.dt-tab.on {
  color: var(--ink); font-weight: 600; background: var(--accent-soft);
  border-color: transparent; box-shadow: inset 3px 0 0 var(--accent);
}

.dt-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.dt-stats { display: flex; gap: 22px; flex-wrap: wrap; }
.dt-stat { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--sub); }
.dt-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; background: var(--faint); }
.dt-dot.ok { background: var(--badge-open-t); }
.dt-dot.run { background: var(--accent); }
.dt-dot.bad { background: var(--danger-t); }
.dt-dot.all { background: var(--num); }

.dt-table { width: 100%; border-collapse: collapse; }
.dt-table th {
  text-align: left; font-size: 11.5px; letter-spacing: .5px; text-transform: uppercase;
  color: var(--faint); font-weight: 600; padding: 0 10px 10px 0;
  border-bottom: 1px solid var(--line); white-space: nowrap;
}
.dt-table td { padding: 11px 10px 11px 0; border-bottom: 1px solid var(--line); font-size: 13.5px; vertical-align: middle; }
.dt-table tbody tr:last-child td { border-bottom: none; }
.dt-table tbody tr:hover { background: var(--row-hover); }
.dt-num { text-align: right; padding-right: 14px !important; }
.dt-tag { color: var(--accent); font-weight: 600; text-decoration: none; }
.dt-tag:hover { text-decoration: underline; }
.dt-file b { display: block; font-weight: 600; }
.dt-size, .dt-date { color: var(--faint); font-size: 12px; }
.dt-date { white-space: nowrap; }

.dt-st { display: inline-block; padding: 3px 10px; border-radius: 20px; font-size: 12px; white-space: nowrap; }
.dt-st.parsing { color: var(--badge-grp-t); background: var(--badge-grp-b); }
.dt-st.parsed { color: var(--badge-open-t); background: var(--badge-open-b); }
.dt-st.problems { color: var(--danger-t); background: var(--danger-b); }
.dt-table tr.dt-live .dt-st.parsing { animation: dtPulse 1.4s ease-in-out infinite; }
@keyframes dtPulse { 0%,100% { opacity: 1; } 50% { opacity: .45; } }

.dt-act { white-space: nowrap; text-align: right; }
.dt-act a, .dt-act .dt-del {
  color: var(--sub); text-decoration: none; font-size: 15px; padding: 2px 6px;
  background: none; border: 0; cursor: pointer;
}
.dt-act a:hover { color: var(--accent); }
.dt-act .dt-del:hover { color: var(--danger-t); }
.dt-act form { display: inline; }
.dt-empty { color: var(--faint); text-align: center; padding: 26px 10px; font-size: 13.5px; }
.dt-note { color: var(--faint); font-size: 12px; margin-top: 14px; line-height: 1.5; }

/* ---------- форма загрузки ---------- */
.dt-back { display: inline-block; margin-bottom: 8px; color: var(--accent); text-decoration: none; font-size: 13px; font-weight: 600; }
.dt-back:hover { text-decoration: underline; }
.dt-grid { display: grid; grid-template-columns: 320px 220px 260px; gap: 18px; margin-bottom: 18px; }
.dt-grid-tag { grid-template-columns: 320px 1fr; align-items: start; }
/* форма загрузки отчёта: «Группа» убрана, тэг — третья колонка первого ряда */
.dt-grid-upload { grid-template-columns: 320px 220px minmax(320px, 1fr); }
.dt-field { display: block; }
.dt-field > span {
  display: block; font-size: 11.5px; letter-spacing: .6px; text-transform: uppercase;
  color: var(--faint); font-weight: 600; margin-bottom: 7px;
}
.dt-field select, .dt-field input[type="text"] {
  width: 100%; padding: 9px 12px; border-radius: 8px; font-size: 13.5px;
  background: var(--field); color: var(--ink); border: 1px solid var(--field-border);
  font-family: inherit;
}
.dt-field select:focus, .dt-field input[type="text"]:focus { outline: none; border-color: var(--accent); }
.dt-readonly { color: var(--sub) !important; }
.dt-taginfo { display: flex; flex-direction: column; gap: 8px; padding-top: 24px; margin-bottom: 18px; }
.dt-hint { color: var(--faint); font-size: 12px; line-height: 1.45; }
.dt-badge { display: inline-block; align-self: flex-start; padding: 3px 10px; border-radius: 20px; font-size: 12px; }
.dt-badge.ok { color: var(--badge-open-t); background: var(--badge-open-b); }
.dt-badge.bad { color: var(--danger-t); background: var(--danger-b); }
.dt-badge.warn { color: var(--badge-me-t); background: var(--badge-me-b); }
/* СП — синяя плашка, как `.b-grp` в таблице свода (сравнение двух моделей, 19.10.2026) */
.dt-badge.grp { color: var(--badge-grp-t); background: var(--badge-grp-b); }

.dt-drop {
  display: flex; flex-direction: column; gap: 6px; align-items: center; justify-content: center;
  min-height: 118px; border: 1.4px dashed var(--field-border); border-radius: 12px;
  background: var(--panel); cursor: pointer; padding: 18px; text-align: center;
}
.dt-drop:hover, .dt-drop.drag { border-color: var(--accent); background: var(--accent-soft); }
.dt-drop.picked { border-style: solid; border-color: var(--accent); }
.dt-drop-main { font-size: 14.5px; color: var(--ink); }
.dt-drop-sub { font-size: 12.5px; color: var(--faint); }
.dt-file-input { display: none; }

.dt-progress { margin: 6px 0 18px; }
.dt-bar { height: 10px; border-radius: 6px; background: var(--field); border: 1px solid var(--field-border); overflow: hidden; }
.dt-bar.big { height: 14px; margin: 18px 0 10px; }
.dt-bar-fill { height: 100%; width: 0; background: var(--accent); transition: width .25s ease; }
.dt-prog-sub { margin-top: 8px; font-size: 12.5px; color: var(--sub); }
.dt-actions { display: flex; gap: 10px; align-items: center; margin-top: 20px; flex-wrap: wrap; }

/* ---------- страница разбора ---------- */
.dt-progress-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.dt-progress-head h2 { font-size: 17px; color: var(--ink); }
.dt-prog-file { color: var(--faint); font-size: 12.5px; margin-top: 4px; }
.dt-prog-num { color: var(--num); font-size: 14px; }
.dt-steps { display: flex; flex-wrap: wrap; gap: 14px 26px; margin: 20px 0 14px; }
.dt-step { display: flex; gap: 10px; align-items: flex-start; opacity: .5; }
.dt-step b { display: block; font-size: 13.5px; color: var(--ink); font-weight: 600; }
.dt-step small { display: block; font-size: 11.5px; color: var(--faint); }
.dt-step .dot {
  width: 10px; height: 10px; border-radius: 50%; margin-top: 5px; flex: 0 0 auto;
  background: var(--field-border);
}
.dt-step.active { opacity: 1; }
.dt-step.active .dot { background: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); animation: dtPulse 1.4s ease-in-out infinite; }
.dt-step.done { opacity: 1; }
.dt-step.done .dot { background: var(--badge-open-t); }

.dt-headers { margin: 18px 0 4px; }
.dt-headers-cap { font-size: 12.5px; color: var(--sub); margin-bottom: 8px; }
.dt-headers-cap .dt-hint { margin-left: 8px; }
.dt-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.dt-chip {
  display: inline-block; padding: 3px 9px; border-radius: 6px; font-size: 11.5px;
  color: var(--sub); background: var(--panel); border: 1px solid var(--card-border);
}

/* подпись колонок шапки отчёта — отдельной строкой, иначе читается как одна фраза */
.dt-headers-cap .dt-hint { display: inline; margin-left: 4px; }

/* ─────────────── справочник «Расходные материалы и инструменты» (28.09.2026, часть 2)
   Вкладки подблока, список позиций, окошко деталей и полоса приложения файла. ─────────── */
.dt-subtabs { display: flex; gap: 10px; flex-wrap: wrap; }
.dt-subtab {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 8px;
  border: 1px solid var(--field-border); color: var(--sub); text-decoration: none;
  font-size: 13px; background: var(--field);
}
.dt-subtab:hover { color: var(--ink); }
.dt-subtab.on { color: var(--ink); font-weight: 600; border-color: var(--accent);
                background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
.dt-subtab-n { color: var(--faint); font-size: 11.5px; }

.dt-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dt-search input[type="search"] {
  background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
  color: var(--ink); padding: 8px 12px; font-size: 13px; min-width: 240px;
}
.dt-search input[type="search"]:focus { outline: none; border-color: var(--accent); }

.dt-item-cell { min-width: 0; }
.dt-item-name { color: var(--ink); font-weight: 600; text-decoration: none; }
.dt-item-name:hover { color: var(--accent); text-decoration: underline; }
.dt-chip {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 10px;
  font-size: 11px; color: var(--badge-grp-t); background: var(--badge-grp-b); white-space: nowrap;
}
.dt-chip.soft { color: var(--faint); background: var(--field); }

/* ── окошко поверх списка ── */
.dt-overlay {
  position: fixed; inset: 0; background: rgba(5, 7, 12, .62); z-index: 60;
  display: flex; align-items: flex-start; justify-content: center; padding: 40px 18px;
  overflow: auto;
}
.dt-overlay[hidden] { display: none; }
.dt-noscroll { overflow: hidden; }
.dt-loading { color: var(--sub); background: var(--card); border: 1px solid var(--card-border);
              border-radius: 14px; padding: 22px 26px; font-size: 13.5px; }

/* ── карточка позиции ── */
.dt-card {
  background: var(--card); border: 1px solid var(--card-border); border-radius: 16px;
  width: 100%; max-width: 980px; padding: 20px 24px 22px;
}
.dt-card-head { display: flex; align-items: flex-start; justify-content: space-between;
                gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.dt-card-title h2 { margin: 0 0 4px; font-size: 19px; color: var(--ink); }
.dt-card-sub { margin: 0; color: var(--faint); font-size: 12.5px; }
.dt-card-tools { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.dt-card-x { background: transparent; border: none; color: var(--faint); font-size: 18px;
             cursor: pointer; line-height: 1; padding: 2px 6px; }
.dt-card-x:hover { color: var(--ink); }
.dt-card-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 16px; }
.dt-card-col { min-width: 0; }
.dt-card-h3 { margin: 0 0 4px; font-size: 12px; letter-spacing: .6px; text-transform: uppercase;
              color: var(--faint); display: flex; align-items: center; gap: 10px; }
.dt-h3-gap { margin-top: 20px; }
.dt-count { color: var(--num); font-size: 11.5px; }
.dt-badge.src { color: var(--badge-grp-t); background: var(--badge-grp-b); }
.dt-inline-empty { color: var(--faint); font-size: 12px; line-height: 1.5; margin: 6px 0 0; }

.dt-chars { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; margin-top: 8px; }
.dt-char { display: flex; align-items: baseline; justify-content: space-between; gap: 10px;
           background: var(--field); border: 1px solid var(--field-border); border-radius: 7px;
           padding: 6px 10px; min-width: 0; }
.dt-char .k { color: var(--faint); font-size: 11.5px; }
.dt-char .v { color: var(--ink); font-weight: 600; font-size: 11.5px; text-align: right; }

.dt-files { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.dt-file { display: flex; align-items: center; gap: 8px; background: var(--field);
           border: 1px solid var(--field-border); border-radius: 8px; padding: 7px 10px; }
.dt-file-link { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0;
                text-decoration: none; color: var(--ink); }
.dt-file-ext { color: var(--faint); font-size: 10px; font-weight: 700; letter-spacing: .4px; }
.dt-file-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis;
                white-space: nowrap; font-size: 12.5px; }
.dt-file-name:hover { color: var(--accent); }
.dt-file-size { color: var(--faint); font-size: 11px; }
.dt-file-del { background: transparent; border: none; color: var(--faint); cursor: pointer;
               font-size: 12px; padding: 0 4px; }
.dt-file-del:hover { color: var(--danger-t); }

.dt-drop { display: block; margin-top: 10px; border: 1.5px dashed var(--field-border);
           border-radius: 10px; background: var(--field); padding: 12px; text-align: center;
           cursor: pointer; }
.dt-drop:hover, .dt-drop.drag { border-color: var(--accent); background: var(--accent-soft); }
.dt-drop-main { display: block; font-size: 12.5px; color: var(--ink); }
.dt-drop-sub { display: block; font-size: 11.5px; color: var(--faint); margin-top: 2px; }
.dt-up { margin-top: 10px; }
.dt-up-txt { color: var(--faint); font-size: 11px; margin-top: 4px; }
.dt-up-state { color: var(--accent); font-size: 12px; margin-top: 2px; }
.dt-up-state.bad { color: var(--danger-t); }
.dt-bar { height: 8px; border-radius: 5px; background: var(--field);
          border: 1px solid var(--field-border); overflow: hidden; }
.dt-bar i { display: block; height: 100%; width: 0; background: var(--accent);
            transition: width .2s ease; }

.dt-fld { margin-bottom: 14px; }
.dt-fld-cap { display: block; color: var(--faint); font-size: 11.5px; font-weight: 700;
              letter-spacing: .6px; margin-bottom: 6px; }
.dt-fld-val { background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
              padding: 8px 12px; font-size: 12.5px; color: var(--ink); }
.dt-fld-comment { background: var(--field); border: 1px solid var(--field-border); border-radius: 8px;
                  padding: 10px 12px; font-size: 12.5px; color: var(--sub);
                  white-space: pre-wrap; line-height: 1.5; }

.dt-links { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.dt-link { display: flex; align-items: center; gap: 10px; background: var(--field);
           border: 1px solid var(--field-border); border-radius: 9px; padding: 8px 12px; }
.dt-link.on { border-color: var(--accent-soft); }
.dt-link-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--faint);
               flex-shrink: 0; }
.dt-link.on .dt-link-dot { background: var(--badge-open-t); }
.dt-link-t { flex: 1; min-width: 0; }
.dt-link-t b { display: block; font-size: 12.5px; color: var(--ink); }
.dt-link-t span { display: block; font-size: 11px; color: var(--faint);
                  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dt-link-go { color: var(--accent); text-decoration: none; font-size: 14px; }
.dt-card-del { margin-top: 16px; }

/* ── форма позиции ── */
.dt-wide2 { grid-column: span 2; }
.dt-wide { display: block; margin-bottom: 16px; }
.dt-field textarea { width: 100%; background: var(--field); border: 1px solid var(--field-border);
                     border-radius: 8px; color: var(--ink); padding: 9px 12px; font-size: 13.5px;
                     font-family: inherit; resize: vertical; }
.dt-field textarea:focus { outline: none; border-color: var(--accent); }
.dt-block { margin: 4px 0 18px; }
.dt-block-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap;
                 margin-bottom: 8px; }
.dt-char-row { display: flex; gap: 10px; margin-bottom: 6px; }
.dt-char-row input { flex: 1; min-width: 0; background: var(--field);
                     border: 1px solid var(--field-border); border-radius: 8px; color: var(--ink);
                     padding: 8px 12px; font-size: 13px; }
.dt-char-row input:focus { outline: none; border-color: var(--accent); }
.dt-char-del { background: transparent; border: none; color: var(--faint); cursor: pointer;
               font-size: 13px; padding: 0 6px; }
.dt-char-del:hover { color: var(--danger-t); }
.dt-hidden-form { display: none; }
.dt-back-line { margin: 0 0 14px; }
.dt-file-input-visible {
  margin-top: 10px; background: var(--field); border: 1px dashed var(--field-border);
  border-radius: 8px; color: var(--sub); padding: 10px 12px; font-size: 12.5px; width: 100%;
}


/* ─── Слепок отчёта (мета) — блок на странице разбора, вариант A (29.09.2026) ─── */
.rm-meta { margin-top: 18px; }
.rm-meta-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 10px; }
.rm-meta-title { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.rm-meta-title h2 { margin: 0; font-size: 15px; }
.rm-badge { color: var(--accent); background: var(--badge-open-b); }
.rm-badge.rm-ok { color: var(--badge-open-t); background: var(--badge-open-b); }
.rm-meta-line { margin: 0 0 4px; font-size: 13px; color: var(--ink); }
.rm-cols { margin-top: 12px; }
.rm-cols td { vertical-align: top; }
.rm-type { display: inline-block; padding: 2px 8px; border-radius: 12px; font-size: 12px;
  color: var(--badge-grp-t); background: var(--badge-grp-b); white-space: nowrap; }
.rm-note { color: var(--sub); font-size: 12.5px; }
.rm-traps { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--danger-t);
  border-radius: 8px; background: var(--danger-b); font-size: 13px; color: var(--ink);
  display: flex; gap: 8px 18px; flex-wrap: wrap; align-items: baseline; }
.rm-traps b { color: var(--danger-t); font-weight: 600; }
.rm-trap::before { content: "• "; color: var(--danger-t); }

/* ============ Свод расчёта из файла (часть 3 плана CALC-SVOD-PLAN, макеты D1/D2) ============ */
.svod-sub { align-items: center; gap: 10px; flex-wrap: wrap; }

/* 27.10.2026, владелец: «нажимаю ТО и Метрологию — кнопки прыгают». Подпись под заголовком
   переносилась на вторую строку на ТО и НЕ переносилась в Метрологии: шапки были 116 и 90 px,
   вкладки прыгали на 39 px. Теперь подпись всегда одна строка, длинный файл — с многоточием
   (полное имя — в подсказке при наведении). */
.page-head .svod-sub { flex-wrap: nowrap; }   /* `.page-head p` (0,1,1) иначе перебивает */
.svod-sub > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.svod-sub > .dt-hint { flex: 0 1 auto; }

.cmp-bars { min-width: 190px; }
.cmp-row { display: flex; align-items: center; gap: 8px; margin: 3px 0; }
.cmp-cap { width: 78px; font-size: 11px; color: var(--sub); text-transform: uppercase; }
.cmp-bar { flex: 1; height: 9px; background: rgba(255, 255, 255, .07); border-radius: 5px;
  overflow: hidden; }
.cmp-fill { height: 100%; border-radius: 5px; }
.cmp-fill.ours { background: #4f7df9; }
.cmp-fill.theirs { background: #93a5ff; }
/* выбор файла сравнения кнопками по годам (calc_models.html) */
.cmp-pick { gap: 10px; }
.cmp-pick .svod-tabs { flex-wrap: wrap; }
/* переключатель «ТО + ППР вместе · только ТО · только ППР» в шапке таблицы сравнения: он первый
   элемент панели, лишний отступ сверху (18 px у .svod-bar) там не нужен (01.10.2026) */
.svod-bar-modes { margin-top: 0; }
.svod-drop { background: transparent; color: var(--sub); border-color: transparent; }
.svod-bar input[type="file"] { background: var(--card); color: var(--ink); border: 1px solid
  var(--card-border); border-radius: 8px; padding: 5px 8px; font-size: 12px; max-width: 320px; }
.svod-bar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 18px; }
/* Закладки фильтров: не сжимаются и не рвут подпись — при тесной строке переносятся
   (владелец, 02.10.2026 — та же жалоба на выезжающий текст кнопок) */
.svod-tabs { display: flex; gap: 6px; flex-wrap: wrap; }
.svod-tab { display: inline-block; padding: 8px 15px; border-radius: 9px;
  border: 1px solid var(--card-border); color: var(--sub); font-size: 13.5px;
  text-decoration: none; background: var(--card); white-space: nowrap; flex: 0 0 auto; }
.svod-tab:hover { border-color: var(--accent); color: var(--ink); }
.svod-tab.on { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
.svod-bar-right { margin-left: auto; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.svod-pick { color: var(--sub); font-size: 12.5px; display: inline-flex; align-items: center; gap: 7px; }
.svod-pick select { background: var(--field); border: 1px solid var(--field-border); color: var(--ink);
  border-radius: 8px; padding: 7px 9px; font-size: 13px; max-width: 260px; }

/* Поиск по позициям свода (владелец, 29.09.2026: в файле 2445 позиций).
   Поле широкое — в него влезает ИД модели целиком, рядом «Найти» и (при активном поиске) «Сбросить». */
.svod-find { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.svod-find label { color: var(--sub); font-size: 13px; display: inline-flex; align-items: center; gap: 8px; }
.svod-find input[type="search"] { background: var(--field); border: 1px solid var(--field-border);
  color: var(--ink); border-radius: 8px; padding: 8px 10px; font-size: 13.5px;
  /* поле поиска — ЕДИНСТВЕННОЕ, что ужимается, когда строке тесно: пара кнопок сравнения и
     «Показать» не переносятся на другую строку (владелец, 02.10.2026) */
  /* 300 px: строка поиска, фильтры, «Показать», «Сбросить фильтры» и пара кнопок сравнения
     укладываются в одну строку при любом режиме (владелец, 02.10.2026: «кнопки уезжают
     на другую строчку») */
  width: 300px; flex: 0 1 300px; min-width: 170px; }
.svod-find > label:first-child { min-width: 0; }
/* На широком экране строка поиска НЕ переносится: место освобождает поле поиска, а пара
   «Сравнение моделей · Анализ ABC» остаётся на своей строке (владелец, 02.10.2026: «кнопки
   уезжают на другую строчку»). На узком экране перенос остаётся — там ужимать нечего. */
@media (min-width: 1840px) { .calc-page .svod-find { flex-wrap: nowrap; } }
/* неактивная «Сбросить фильтры»: место занято, вид приглушённый, нажать нельзя */
/* «Сбросить фильтры» живёт в строке ВСЕГДА (одна и та же разметка и ширина во всех режимах),
   поэтому строка поиска и пара кнопок сравнения не переезжают при смене режима ТО / ППР / вместе */
.svod-find .svod-reset { flex: 0 0 auto; }
.svod-find input[type="search"]:focus { border-color: var(--accent); outline: none; }
/* список «куда перейти» на странице модели (владелец, 30.09.2026): узкая таблица, а не на всю
   панель — переход это короткая строка «id модели / модель · регламентов» */
.svod-find-panel { max-width: 980px; }
/* ПОИСК ПО ТЕХКАРТЕ на своде Метрологии: стоит под плашками и РОВНО их длины
   (владелец, 07.10.2026: «поле поиска прям под плашками, длина двух плашек»).
   Ширину задаёт ряд плашек по содержимому, поле растягивается на неё — совпадает в пиксель
   на любом экране, в том числе после переключения темы/окна. */
.svod-tk-block { width: fit-content; max-width: min(100%, 1680px); }
.svod-tk-block .svod-tiles { margin-top: 0; width: 100%; }
.svod-find-tk { display: block; margin-top: 14px; }
/* поле = ширина ряда плашек: форму не «поджимаем» по содержимому (общее правило `.calc-page
   .svod-find`), она занимает ровно блок с плашками */
.svod-find-tk, .calc-page .svod-find.svod-find-tk { width: 100%; }
.svod-find-tk .svod-tk-label { display: block; color: var(--sub); font-size: 13px; margin-bottom: 6px; }
.svod-find-tk input[type="search"] { display: block; width: 100%; }
.svod-find-models { table-layout: fixed; max-width: 980px; }
.svod-find-models td, .svod-find-models th { vertical-align: middle; }
.svod-find-models th:last-child, .svod-find-models td:last-child { width: 96px; }
.svod-find-models th:nth-child(2), .svod-find-models td:nth-child(2) { width: 130px; }

.svod-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px; margin-top: 18px; }
.svod-tile { background: var(--card); border: 1px solid var(--card-border);
  border-radius: 12px; padding: 12px 14px; }
.svod-tile-l { font-size: 11px; text-transform: uppercase; letter-spacing: .7px;
  color: var(--faint); line-height: 1.35; }
.svod-tile-v { font-size: 20px; font-weight: 700; margin-top: 6px; color: var(--num); }
.svod-tile-s { font-size: 12px; color: var(--sub); margin-top: 4px; }

/* всплывающая подсказка графика: цвета — из ТЕМЫ, а не хардкод (30.09.2026 владелец: «при
   наведении на график на светлом фоне — просто чёрный прямоугольник»: фон был жёстко тёмный
   #0d1421, а цвет текста брался из несуществующей переменной --text и наследовался тёмным) */
.tip-live { position: fixed; z-index: 80; padding: 7px 10px; background: var(--card);
  border: 1px solid var(--line); border-radius: 8px; font-size: 12.5px; color: var(--ink);
  pointer-events: none; box-shadow: 0 8px 22px rgba(0, 0, 0, .35); white-space: nowrap; }
.tip-live[hidden] { display: none; }
.svod-wf { display: flex; height: 26px; border-radius: 7px; overflow: hidden;
  background: var(--row-hover); }
.svod-wf span { display: block; height: 100%; }
.svod-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px;
  font-size: 12.5px; color: var(--sub); }
.svod-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px;
  margin-right: 6px; }

.svod-scroll { overflow-x: auto; }
.svod-table { min-width: 1080px; }
.svod-table th { font-size: 10.5px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .4px; color: var(--faint); white-space: nowrap; }
.svod-c { text-align: center; }
.svod-total td { border-top: 2px solid var(--line); font-weight: 700;
  background: var(--accent-soft); }
/* строки «в том числе ТО / ППР» на странице модели (30.09.2026) */
.svod-part td { border-top: 1px dashed var(--line); font-weight: 600; color: var(--sub); }
.svod-part td:last-child { color: var(--ink); }
/* заголовок группы регламентов в списке страницы модели: ТО отдельно, ППР отдельно */
.svod-grp td { background: var(--card); border-top: 1px solid var(--line);
  padding-top: 8px; padding-bottom: 8px; }
.svod-grp-cap { display: inline-block; min-width: 42px; font-weight: 700; font-size: 13.5px;
  letter-spacing: .06em; color: var(--accent); text-transform: uppercase; }
.svod-warn { color: var(--danger-t); font-size: 11.5px; margin-top: 3px; }
/* пометки о полноте данных («нет расходных материалов» и т.п.) — СПРАВОЧНЫЕ, не тревога:
   владелец, 27.10.2026: «немного пугающая, давай более информативно… скорее справочный
   характер». Красный ⚠ остаётся только у настоящих сигналов («мало КП»). */
.svod-note { color: var(--sub); font-size: 11.5px; margin-top: 3px; }
.svod-note-i { color: var(--faint); margin-right: 4px; }
.svod-foot { margin-top: 10px; }

@media (max-width: 1280px) { .svod-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ── страница ПОЗИЦИИ «Расчёта из файла» (часть 4 плана CALC-SVOD-PLAN, макеты calc-C1..C4) ──
   Подсказки «из чего число» — карточка при наведении: только CSS, без библиотек (макет C). */
.cpos-warns { margin-top: 12px; display: flex; flex-direction: column; gap: 4px; }
.cpos-dual { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.cpos-big { background: var(--card); border: 1px solid var(--card-border); border-radius: 12px;
  padding: 13px 16px; }
.cpos-big-l { font-size: 11px; text-transform: uppercase; letter-spacing: .9px; color: var(--sub); }
.cpos-big-v { font-size: 25px; font-weight: 700; margin-top: 5px; color: var(--num); }
.cpos-big-s { font-size: 12px; color: var(--sub); margin-top: 5px; }
.cpos-grid3 { display: grid; grid-template-columns: 1fr 1fr 1.15fr; gap: 12px; margin-top: 12px; }
.cpos-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 12px; }
.cpos-mini { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.cpos-mini td, .cpos-mini th { padding: 5px 0; text-align: left; }
.cpos-mini td { border-top: 1px solid var(--line); }
.cpos-mini td:last-child { text-align: right; padding-left: 10px; }
.cpos-mini tr:first-child td { border-top: 0; }
.cpos-mini h3, .cpos-acc h3 { font-size: 13px; font-weight: 600; margin: 12px 0 7px; color: var(--accent); }
.cpos-sum td { font-weight: 700; }
.cpos-donut { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.cpos-legend { display: flex; flex-direction: column; gap: 5px; font-size: 12px; color: var(--sub); }
.cpos-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; }
.cpos-legend b { color: var(--ink); }
.cpos-hbs { display: flex; flex-direction: column; gap: 7px; }
.cpos-hb { display: grid; grid-template-columns: 200px 1fr 140px; align-items: center; gap: 10px;
  font-size: 12.5px; }
.cpos-hb-n { color: var(--sub); }
.cpos-hb-b { display: block; height: 12px; border-radius: 6px; background: var(--field); }
.cpos-hb-b i { display: block; height: 12px; border-radius: 6px; }
.cpos-hb-v { text-align: right; color: var(--num); }
.cpos-table-wrap { overflow-x: auto; }
.cpos-table { min-width: 560px; }
.cpos-table th { font-size: 10.5px; text-transform: uppercase; letter-spacing: .4px;
  color: var(--sub); border-bottom: 1px solid var(--line); }
.cpos-total td { border-top: 2px solid var(--line); font-weight: 700; }
.cpos-pager { display: flex; align-items: center; gap: 12px; margin-top: 10px; flex-wrap: wrap; }
.cpos-pager-info { color: var(--sub); font-size: 12px; }
.cpos-acc { background: var(--card); border: 1px solid var(--card-border); border-radius: 12px;
  padding: 11px 15px; margin-top: 12px; }
.cpos-acc > summary { cursor: pointer; font-weight: 600; font-size: 13.5px; color: var(--ink); }
.cpos-acc[open] > summary { margin-bottom: 10px; }
.cpos-hint { position: relative; display: inline-block; border-bottom: 1px dotted var(--accent);
  cursor: help; }
.cpos-tip { display: none; position: absolute; z-index: 40; top: calc(100% + 8px); left: 0;
  width: 380px; max-width: 74vw; background: var(--card); border: 1px solid var(--card-border);
  border-radius: 12px; padding: 12px 14px; box-shadow: 0 18px 40px rgba(0, 0, 0, .35);
  font-size: 12.5px; color: var(--ink); text-align: left; font-weight: 400; }
.cpos-hint:hover .cpos-tip, .cpos-hint:focus-within .cpos-tip { display: block; }
.cpos-tip-h { display: block; font-weight: 700; margin-bottom: 8px; color: var(--accent); }
.cpos-tip-r { display: flex; justify-content: space-between; gap: 12px; padding: 2.5px 0; }
.cpos-tip-r b { font-variant-numeric: tabular-nums; }
.cpos-tip-r.sum { border-top: 1px dashed var(--line); margin-top: 4px; padding-top: 5px;
  font-weight: 600; }
.cpos-tip-total { display: block; margin-top: 9px; padding-top: 8px;
  border-top: 1px solid var(--line); font-weight: 700; }
.cpos-tip.wide { width: 470px; }
.cpos-tip-parts { display: block; margin-top: 8px; padding-top: 8px;
  border-top: 1px dashed var(--line); }
/* раскладка ФОТ в двух периодах: «за регламент» и «в год» (владелец, 29.09.2026) */
.cpos-tip-tbl { display: block; margin-top: 8px; padding-top: 8px;
  border-top: 1px dashed var(--line); }
.cpos-tip-th, .cpos-tip-tr { display: grid; grid-template-columns: 1fr 92px 108px; gap: 8px;
  align-items: baseline; padding: 3px 0; }
.cpos-tip-th { color: var(--sub); font-size: 10.5px; text-transform: uppercase; letter-spacing: .4px; }
.cpos-tip-th i { font-style: normal; text-align: right; }
.cpos-tip-th i:first-child { text-align: left; }
.cpos-tip-tr span { display: flex; flex-direction: column; }
.cpos-tip-tr em { font-style: normal; color: var(--sub); font-size: 10.5px; }
.cpos-tip-tr b { text-align: right; font-weight: 400; font-variant-numeric: tabular-nums; }
.cpos-tip-tr.sum { border-top: 1px solid var(--line); margin-top: 4px; padding-top: 5px; }
.cpos-tip-tr.sum b, .cpos-tip-tr.sum span { font-weight: 600; }
.cpos-tip-note { display: block; margin-top: 8px; color: var(--sub); font-size: 11px; }
.cpos-tip-part { display: block; padding: 2px 0; }
.cpos-tip-part em { display: block; font-style: normal; color: var(--sub); font-size: 11.5px; }
.cpos-tip-sum { display: block; margin-top: 6px; font-weight: 600; }
.cpos-tip-foot { display: block; margin-top: 8px; color: var(--sub); font-size: 11.5px; }
.svod-link { color: inherit; text-decoration: none; border-bottom: 1px dotted var(--accent); }
.svod-link:hover { color: var(--accent); }

/* четыре числа страницы расчёта (часть 8, макет F1) и её мелкие блоки */
.cpos-big4 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 16px; }
.cpos-bigbox { background: var(--card); border: 1px solid var(--card-border); border-radius: 12px;
               padding: 13px 15px; }
.cpos-bigbox.hl { border-color: var(--accent); }
.cpos-big-l { font-size: 11px; text-transform: uppercase; letter-spacing: .9px; color: var(--sub); }
.cpos-big-v { font-size: 26px; font-weight: 700; margin-top: 5px; color: var(--num); }
.cpos-big-s { font-size: 12px; color: var(--sub); margin-top: 5px; }
.cpos-two { display: grid; grid-template-columns: 1.15fr 1fr; gap: 14px; margin-top: 12px; }
.cpos-road { font-size: 16px; margin: 6px 0 4px; }
/* 19.10.2026: под часами дороги — короткая строка «откуда» (котёл / адреса модели) */
.cpos-src { font-size: 12px; color: var(--sub); margin-bottom: 4px; }
.cpos-comp td { vertical-align: top; }
/* страница расчёта: деньги — в одну строку, таблицы не расползаются на широком экране */
.cpos-comp { max-width: 1300px; }
.cpos-comp td.dt-num { white-space: nowrap; }
.cpos-big4 { max-width: 1680px; }
.cpos-hb { max-width: 1680px; }
.cpos-big-v, .cpos-road { white-space: nowrap; }
/* журнал фонового разбора заливки (страница разбора файла расчёта) */
.dt-log { white-space: pre-wrap; font-size: 11.5px; line-height: 1.45; color: var(--sub);
          background: var(--field); border: 1px solid var(--line); border-radius: 9px;
          padding: 10px 12px; margin: 6px 0 4px; max-height: 320px; overflow: auto; }

/* ============ часть 8: перечень расчётов, подсказка на строку, аналитика ============
   Согласовано с владельцем по макетам E1/E2/G2 (29.09.2026): плиток три и они равны
   сумме строк; вместо колонки «Доля» — исполнитель и пометка о проблеме; наведение на
   строку показывает 2×2 периода и состав цены одной единицы. */

.svod-tiles.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
/* пять плиток на странице «Анализ ABC»: зоны A, B и C рядом с «моделями» и «бюджетом»
   (владелец, 02.10.2026: «есть плашка 80 %, есть 5 %, а где 15 %?») */
.svod-tiles.five { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1500px) { .svod-tiles.five { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 1100px) { .svod-tiles.five { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.svod-tiles.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Метрология, карточка ТК (13.10.2026): ряд из четырёх плиток — тип, трудоёмкость и две
   денежные («одна единица» и «весь объём»), как в ТО, но без «за регламент».
   Здесь же — свод по моделям со включённым сравнением с тарифами: плитка «Сопоставлено
   моделей» продолжает ряд из трёх (владелец, 14.10.2026: «продолжением других плашек, а не
   переносилась на новую строку, место есть»), поэтому четыре плитки в ряд, а на узком
   экране — по две (четыре колонки там уже нечитаемы). */
.svod-tiles.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1280px) { .svod-tiles.four { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* одна плитка (плитки различий убраны, 30.09.2026): не растягиваем её на всю ширину */
.svod-tiles.one { grid-template-columns: minmax(0, 420px); }
/* сетка перечня расчётов: ширины заданы жёстко — при фильтре колонки не пересчитываются
   от содержимого и шапка не «уезжает» относительно значений (жалоба владельца 29.09.2026) */
.svod-list { table-layout: fixed; max-width: 1680px; }
/* шапка перечня переносится по словам: у .dt-table th стоит nowrap, и длинные подписи
   («одна единица, за регламент, ₽») вылезали в соседнюю колонку — «колонки поехали» */
.svod-list th { white-space: normal; overflow-wrap: anywhere; }
/* деньги печатаются с обычными пробелами между разрядами — в одну строку и без переноса */
.svod-list td.dt-num { white-space: nowrap; }
.svod-list td.dt-num.dt-hint { white-space: normal; }
.svod-col-no { width: 52px; }
.svod-col-type { width: 70px; }
.svod-col-mt { width: 80px; }
.svod-col-per { width: 128px; }
/* денежные колонки — в пикселях: столько нужно самому длинному числу («9 999 999,99») */
.svod-col-hours { width: 96px; }
.svod-col-one { width: 152px; }
.svod-col-year { width: 176px; }
/* «модель и регламент» и «исполнитель» делят остаток */
.svod-fold { margin-top: 12px; }
.svod-fold > summary { cursor: pointer; font-weight: 600; font-size: 14.5px; color: var(--ink);
  /* график «что тянет год» уехал наверх и свёрнут по умолчанию (владелец, 30.09.2026) */
  display: flex; align-items: center; gap: 10px; }
.svod-fold-hint { margin-left: auto; color: var(--faint); font-size: 12.5px; font-weight: 400; }
.svod-fold[open] > summary { margin-bottom: 10px; }
.svod-list { width: 100%; }
/* «что есть у модели в файле» и другие короткие таблицы: без растягивания на всю панель */
.svod-wide { max-width: 1680px; }
/* центрирование цифр в таблицах расчёта: при выравнивании вправо числа «уезжали к правому краю»
   и отрывались от подписи (владелец, 29.09.2026) */
.svod-list th.dt-num, .svod-list td.dt-num,
.svod-wide th.dt-num, .svod-wide td.dt-num,
.svod-facts th.dt-num, .svod-facts td.dt-num,
.cpos-comp th.dt-num, .cpos-comp td.dt-num,
.svod-mats th.dt-num, .svod-mats td.dt-num { text-align: center; }
.svod-list td.dt-num.dt-hint, .svod-wide td.dt-num.dt-hint { text-align: center; }
/* материалы: цена и два расхода — колонкам нужна ширина, иначе числа переносятся */
.svod-mats { max-width: 1680px; }
/* свод по моделям: одна таблица (наши числа и сравнение), жёсткая сетка */
.svod-models { table-layout: fixed; max-width: 1680px; }
.svod-models th { white-space: normal; overflow-wrap: anywhere; }
.svod-models .svod-col-mt { width: 84px; }
/* знак сравнения окрашивается: grew (наш дороже файла) — красный, fell (дешевле) — зелёный.
   Владелец, 30.09.2026: «Цвета добавляем, так и не реализовали» — классы в шаблоне стояли
   (calc_models.html: разница, «Δ, %», трудоёмкость), а правил цвета не было ни одного. */
.svod-models td.grew, .svod-wide td.grew { color: var(--up-t); }
.svod-models td.fell, .svod-wide td.fell { color: var(--down-t); }
/* жёсткие сетки таблиц расчёта: иначе колонки «плывут» от содержимого строки
   (владелец, 29.09.2026 — амортизация, операции, состав цены) */
.calc-ops { table-layout: fixed; max-width: 1680px; }
.calc-ops th { white-space: normal; overflow-wrap: anywhere; }
.calc-ops .svod-col-equip { width: 300px; }
.cpos-comp { table-layout: fixed; }
.calc-narrow { table-layout: fixed; max-width: 980px; }
/* статьи затрат модели: две денежные колонки (1 единица и все единицы) + полоса веса —
   жёсткая сетка; 1320 вместо 1100 — прибавилась колонка «Вес статьи» (~210 px) */
.calc-articles { table-layout: fixed; max-width: 1320px; }
.svod-mats .svod-col-unit { width: 74px; }
.svod-mats .dt-num { white-space: nowrap; }
/* предупреждение на странице модели: под одной ИД лежат разные наименования */
.svod-note { margin: 14px 0 0; padding: 10px 14px; font-size: 13px; line-height: 1.5;
  background: rgba(232, 180, 90, .12); border: 1px solid rgba(232, 180, 90, .45);
  border-radius: 10px; max-width: 1680px; }
.svod-wide td.dt-num { white-space: nowrap; }
/* справка ВНУТРИ «денежной» ячейки: сами числа держим в одну строку, а справку переносим —
   иначе «справка 2027: с дорогой и надбавками … ч» уезжала одной строкой (278 px в колонке
   152 px) и накладывалась на соседнюю колонку «Наглядно» (владелец, 30.09.2026) */
.svod-wide td.dt-num > .dt-hint, .svod-list td.dt-num > .dt-hint,
.svod-models td.dt-num > .dt-hint, .svod-mats td.dt-num > .dt-hint { white-space: normal; }
.svod-facts { max-width: 980px; }
.svod-facts th:first-child, .svod-facts td:first-child { width: 220px; }
.svod-facts th:last-child, .svod-facts td:last-child { width: auto; }
.svod-col-dir { width: 18%; }

/* на нешироких окнах числа чуть компактнее — колонке «модель и регламент» остаётся больше места */
@media (max-width: 1400px) {
  .svod-col-one { width: 134px; }
  .svod-col-year { width: 154px; }
  .svod-col-per { width: 112px; }
  .svod-col-dir { width: 15%; }
}
.svod-list td { vertical-align: top; }
.svod-type { display: inline-block; font-size: 11px; border-radius: 7px; padding: 2px 7px;
             background: var(--accent-soft); color: var(--num); font-weight: 600; }
.svod-type.ppr { background: #33270f; color: #e8b45a; }

.svod-row-hint { border-bottom: 1px dotted var(--accent); font-weight: 600; }

.chint { position: relative; display: inline-block; }
.chint-tip { display: none; position: absolute; z-index: 60; top: calc(100% + 6px); left: 0;
             width: 660px; padding: 12px 14px; border-radius: 12px;
             background: var(--card); border: 1px solid var(--card-border);
             box-shadow: 0 18px 40px rgba(0, 0, 0, .45); font-size: 12px; font-weight: 400;
             text-align: left; line-height: 1.35; }
.chint:hover > .chint-tip, .chint:focus-within > .chint-tip { display: block; }
.chint-h { display: block; font-weight: 700; color: var(--accent); margin-bottom: 7px;
           font-size: 13px; }
.chint-line { display: block; margin-top: 5px; color: var(--sub); font-size: 11.5px; }
.chint-sec { display: block; margin-top: 9px; padding-top: 8px; border-top: 1px dashed var(--line);
             font-weight: 600; }
.chint-tbl { width: 100%; border-collapse: collapse; font-size: 12px; margin-top: 4px; }
.chint-tbl th { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px;
                color: var(--faint); text-align: left; padding: 4px 5px;
                border-bottom: 1px solid var(--line); }
.chint-tbl th.r, .chint-tbl td.r { text-align: right; }
.chint-tbl td { padding: 4px 5px; border-top: 1px solid var(--line); }
.chint-tbl tr.sum td { font-weight: 600; border-top: 1px solid var(--line); }
.chint-tbl td.sub { color: var(--sub); }
.chint-art { display: block; }
.chint-how { display: block; font-style: normal; color: var(--sub); font-size: 10.5px; }
.chint-barcell { width: 60px; }
.chint-bar { display: block; height: 6px; border-radius: 3px; background: var(--accent); }
.chint-note { display: block; margin-top: 8px; color: var(--sub); font-size: 11px; line-height: 1.35; }
.chint-foot { display: block; margin-top: 6px; color: var(--faint); font-size: 11px; }

.svod-an-modes { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.svod-an-note { margin-left: auto; }
/* воздух между числами и полосой (владелец, 02.10.2026: «цифры прилетают к графику»):
   у самой длинной полосы её конец был в 10 px от столбца со значением */
.svod-bar-row { display: flex; align-items: center; gap: 18px; padding: 3px 0; font-size: 12.5px; }
.svod-bar-name { width: 340px; flex: none; }
.svod-bar-track { flex: 1; height: 16px; border-radius: 5px; overflow: hidden;
                  display: flex;   /* две части одной полосы: ТО и ППР стоят рядом */
                  background: var(--field); border: 1px solid var(--line); }
.svod-bar-fill { display: block; height: 100%; flex: 0 0 auto; background: var(--accent); min-width: 2px; }
.svod-bar-fill.ppr { background: #e8b45a; }
.svod-bar-val { width: 200px; flex: none; text-align: right; }
/* количество единиц МТ между названием модели и полосой (страница «Анализ ABC») */
.svod-bar-mt { width: 92px; flex: none; color: var(--sub); font-size: 11.5px; text-align: right; }
.svod-warnbox { border-color: var(--danger-t); }
.svod-warnrow { display: flex; justify-content: space-between; gap: 14px; font-size: 12.5px;
                padding: 3px 0; }
.svod-warnrow b { font-weight: 600; }
.mono { font-variant-numeric: tabular-nums; }
.strong { font-weight: 600; }

@media (max-width: 1280px) {
  .svod-tiles.three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .svod-bar-name { width: 240px; }
  .chint-tip { width: 560px; }
}
@media (max-width: 1280px) {
  .cpos-dual, .cpos-grid2, .cpos-grid3 { grid-template-columns: 1fr; }
  .cpos-hb { grid-template-columns: 140px 1fr 110px; }
}

/* ── ссылка на свод без входа (30.09.2026): каркас публичной страницы и панель владельца ──
   По ссылке отдаётся тот же экран свода, но без меню портала и без имени пользователя
   (шаблон `portal/public_base.html`), и без выгрузки xlsx — её маршрута по ключу нет. */
.pub-app { display: block; }
.pub-head { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: 14px;
  height: 64px; padding: 0 28px; background: var(--card); border-bottom: 1px solid var(--line); }
.pub-brand { display: flex; align-items: center; gap: 10px; font-weight: 700; font-size: 15px; color: var(--ink); }
.pub-dot { width: 22px; height: 22px; border-radius: 7px; background: var(--accent); display: inline-block; }
.pub-sub { color: var(--sub); font-size: 13px; }
.pub-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.pub-read { font-size: 11.5px; font-weight: 600; color: var(--badge-me-t); background: var(--badge-me-b);
  border-radius: 10px; padding: 3px 9px; }
.pub-line { padding: 10px 28px; color: var(--sub); font-size: 12.5px; background: var(--bg);
  border-bottom: 1px solid var(--line); }
.pub-content { padding: 28px 36px; }

.share-card { margin-top: 14px; border: 1px solid var(--card-border); border-radius: 14px;
  background: var(--card); }
/* панель ссылок — сворачиваемая: в свёрнутом виде одна строка, а не пол-экрана
   (владелец, 30.09.2026: «блок с ссылками надо как-то спрятать, а то место занимает») */
.share-card > .share-sum { display: flex; align-items: center; gap: 10px; cursor: pointer;
  padding: 12px 20px; list-style: none; }
.share-card > .share-sum::-webkit-details-marker { display: none; }
.share-sum-t { font-size: 15px; font-weight: 600; color: var(--ink); }
.share-sum-hint { margin-left: auto; color: var(--faint); font-size: 12.5px; }
.share-card[open] > .share-sum { border-bottom: 1px solid var(--line); }
.share-body { padding: 16px 20px 18px; }
.share-empty { margin: 0 0 10px; color: var(--sub); font-size: 13px; }
.share-new { margin-top: 14px; display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.share-revoked { margin-top: 12px; }
.share-revoked > summary { cursor: pointer; color: var(--sub); font-size: 12.5px; }
.share-revoked > .share-table { margin-top: 8px; }
.share-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.share-head h2 { margin: 0; font-size: 16px; font-weight: 600; color: var(--ink); }
.share-badge { font-size: 11.5px; font-weight: 600; color: var(--badge-open-t); background: var(--badge-open-b);
  border-radius: 10px; padding: 3px 9px; }
/* блоки «Замечания» — сворачиваемые и ЗАКРЫТЫЕ по умолчанию, везде где есть
   (владелец, 30.09.2026: «нужно дать возможность скрывать/раскрывать и скрыть по умолчанию») */
.warn-fold > .warn-sum { display: flex; align-items: center; gap: 10px; cursor: pointer;
  list-style: none; }
.warn-fold > .warn-sum::-webkit-details-marker { display: none; }
.warn-sum > h2 { margin: 0; font-size: 15px; }
.warn-badge { font-size: 11.5px; font-weight: 600; color: var(--danger-t); background: var(--danger-b);
  border-radius: 10px; padding: 3px 9px; white-space: nowrap; }
.warn-badge.off { color: var(--badge-open-t); background: var(--badge-open-b); }
.warn-sum-hint { margin-left: auto; color: var(--faint); font-size: 12.5px; }
.warn-fold[open] > .warn-sum { border-bottom: 1px solid var(--line); padding-bottom: 10px;
  margin-bottom: 12px; }
.warn-body { display: flex; flex-direction: column; gap: 4px; }
.warn-sum-t { font-size: 15px; font-weight: 600; color: var(--ink); }
.share-badge.off { color: var(--sub); background: var(--row-hover); }
.share-addr { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: 13px;
  color: var(--sub); border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.share-addr form { display: inline-flex; align-items: center; gap: 8px; }
.share-addr input[type=text] { width: 260px; height: 32px; padding: 0 10px; font-size: 13px; }
.share-table { width: 100%; border-collapse: collapse; }
.share-table th { font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .5px;
  color: var(--faint); text-align: left; padding: 0 0 8px; }
.share-table td { padding: 10px 0; border-top: 1px solid var(--line); vertical-align: middle; font-size: 14px; }
.share-url { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px;
  color: var(--num); word-break: break-all; }
.share-when { color: var(--sub); font-size: 12.5px; white-space: nowrap; }
.share-act { white-space: nowrap; text-align: right; }
.share-act form { display: inline; }
.share-act .btn-sm { margin-left: 8px; }
.share-note { margin: 12px 0 0; color: var(--sub); font-size: 12.5px; line-height: 1.5; }
.share-note b { color: var(--ink); font-weight: 600; }

/* Точка «ведут сюда» (02.10.2026) и панель ссылок — стили живут В ШАБЛОНАХ
   (`calc_home.html` → `extra_head`, `calc_svod.html` → `extra_head`): `portal.css` отдаёт
   WhiteNoise по манифесту, и правка файла доезжает только после `collectstatic`, которого на
   рабочем ПК владельца нет. Здесь оставлено только это пояснение — искать в шаблонах. */
.share-warn { margin: 12px 0 0; color: var(--danger-t); background: var(--danger-b); border-radius: 9px;
  padding: 9px 12px; font-size: 12.5px; }
.btn-add { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; font-size: 13px;
  font-weight: 700; color: var(--accent); background: none; border: 1px dashed var(--field-border);
  border-radius: 9px; padding: 8px 14px; cursor: pointer; }
.btn-add:hover { border-color: var(--accent); }


/* ============ ширина объектов вкладки «Калькулятор тарифа» (владелец, 30.09.2026) ============
   Правило: объект занимает СТОЛЬКО, СКОЛЬКО НУЖНО СОДЕРЖИМОМУ, а не всю ширину экрана;
   потолок — как вчера (большие таблицы 1680 px, короткие 980 px). На стандартном экране,
   если объекту ширины не хватает, он растягивается до доступного (ползунка нет), и только
   когда монитор объект не вмещает — остаётся горизонтальный ползунок. */
.calc-page > *,
.calc-page .panel,
.calc-page .svod-tiles,
.calc-page .share-card,
.calc-page .cpos-acc,
.calc-page .svod-warnbox,
.calc-page .svod-find,
.calc-page .svod-bar,
.calc-page form { width: fit-content; max-width: min(100%, 1680px); }
/* шапки таблиц калькулятора переносятся: сейчас у .dt-table th стоит nowrap, из-за этого
   таблица «Статьи затрат» требует минимум 1813 px и раздвигала страницу до 2183 при 1920
   (ползунок у всей страницы); с переносом шапок таблица влезает и ползунка нет */
.calc-page .dt-table th { white-space: normal; overflow-wrap: anywhere; }
/* «сколько нужно» у таблиц: тянется до своего содержимого, но не больше потолка */
.calc-page table.dt-table { max-width: min(100%, 1680px); }


/* ============ срез стоимости за год (провал по плитке свода, 30.09.2026) ============ */
/* плитка свода — теперь ссылка: тот же вид, но кликабельная */
a.svod-tile { display: block; text-decoration: none; color: inherit; }
a.svod-tile:hover { border-color: var(--accent); }
a.svod-tile:hover .svod-tile-l { color: var(--sub); }
.svod-tile-go { display: block; margin-top: 5px; color: var(--accent); font-size: 12px; }
.srez-bar-col { width: 210px; }
/* ── Полоса «сколько бюджета на Основное, а сколько на Факультатив» (29.10.2026) ──
   Владелец: «чтобы на глаз сразу было понятно». Цвета — из темы: основное акцентом,
   факультатив тем же янтарным, что ТО12+ (.ppr), чтобы один цвет значил одно и то же. */
.budget-split { margin: 10px 0 16px; padding: 12px 14px; border: 1px solid var(--card-border);
  border-radius: 12px; background: var(--card); }
.budget-split-h { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.budget-split-l { font-size: 11px; letter-spacing: .7px; text-transform: uppercase; color: var(--faint); }
.budget-split-v { font-size: 20px; color: var(--num); }
.budget-split-track { display: flex; height: 14px; margin: 10px 0 8px; border-radius: 7px;
  overflow: hidden; background: var(--field); border: 1px solid var(--line); }
.budget-split-osn { background: var(--accent); height: 100%; }
.budget-split-fak { background: #e8b45a; height: 100%; }
.budget-split-leg { display: flex; gap: 26px; flex-wrap: wrap; font-size: 12.5px; color: var(--sub); }
.budget-split-i i { display: inline-block; width: 9px; height: 9px; border-radius: 2px;
  margin-right: 6px; }
.budget-split-i.osn i { background: var(--accent); }
.budget-split-i.fak i { background: #e8b45a; }
.budget-split-i b { color: var(--ink); font-weight: 600; }

/* ── Срез стоимости за год: графы количества в таблице статей (29.10.2026) ──
   Владелец: «Вот тут просил разбивать Основное и Факультатив, очень аккуратно и наглядно».
   Два денежных столбца стоят рядом и отделены от остальных тонкой линией — чтобы пара читалась
   как одно целое, а не как ещё два независимых числа. Цвета — только темой (никаких --panel:
   в светлой теме это тёмно-синий фон сайдбара). */
.srez-arts .split-osn { border-left: 1px solid var(--card-border); }
.srez-arts .split-fak { border-right: 1px solid var(--card-border); }
.srez-arts th.split-osn, .srez-arts th.split-fak { color: var(--sub); }
.srez-arts td.split-fak { color: var(--ink); }
/* пара столбцов читается как одно целое: у «Факультатива» чуть больше воздуха слева */
.srez-arts td.split-fak, .srez-arts th.split-fak { padding-left: 14px; }

.srez-bar { display: block; width: 190px; }
/* полоса доли в таблице статей: две части рядом (Основное · Факультатив). display:flex —
   иначе второй `svod-bar-fill` (он display:block) уходил ВНИЗ и янтарной половины не было видно
   (владелец, 29.10.2026: «доля цветами должна выделяться, а у тебя всё синее») */
.srez-bar .svod-bar-track { display: flex; width: 100%; height: 9px; }
.srez-note { color: var(--sub); font-size: 12.5px; line-height: 1.55; margin: 14px 0 2px; }

/* ── Фон (задник) для всех КП: блок на экране «Шаблоны Word» (01.10.2026) ── */
.wt-backing { display: flex; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.wt-backing-img { width: 240px; max-height: 120px; object-fit: contain; padding: 6px;
                  background: #fff; border: 1px solid var(--line); border-radius: 8px; }
.wt-backing-meta { display: flex; flex-direction: column; gap: 4px; font-size: 12px;
                   color: var(--sub); max-width: 520px; }
.wt-backing-meta b { color: var(--ink); font-size: 12.5px; }
.wt-backing-act { margin-left: auto; display: flex; flex-direction: column; gap: 8px;
                  align-items: flex-end; }
.wt-backing-act form { display: flex; align-items: center; gap: 8px; margin: 0; }
.wt-btn-file { position: relative; overflow: hidden; max-width: 280px; }
.wt-btn-file input[type=file] { position: absolute; inset: 0; width: 100%; opacity: 0;
                                cursor: pointer; }

/* ── ДВЕ кнопки сравнения в строке поиска свода (01.10.2026) ──
   Владелец: «не ссылку, а тоже плашку/кнопку… рядом с кнопкой Показать, немного другим
   цветом и длиной до конца плашки (которая снизу)». 01.10.2026 (вечер) — кнопка стала
   ВДВОЕ меньше, рядом встала вторая, «Сравнение Парето»: две по 179 px с зазором 8 = прежние
   365 px, правый край тот же, строка поиска остаётся в ОДНУ линию (строка 1600 px,
   «Показать» 87 px, было 365 px — замер живого экрана). */
.calc-page .svod-find { width: min(100%, 1680px); }
.svod-find .btn { height: 44px; }
/* Кнопки сравнения НЕ сжимаются: при нехватке места пара переносится на свою строку, а не рвёт
   подпись (владелец, 02.10.2026: «текст в кнопках постоянно выезжает или кнопки сужаются»).
   Раньше у пары и у кнопок стояло `flex: 1 1 0; min-width: 0` — при тесной строке кнопка
   становилась уже подписи, и текст вылезал наружу. */
.svod-find .cmp-pair { flex: 0 0 auto; display: flex; gap: 8px; }
.svod-find .cmp-btn {
  flex: 0 0 auto; min-width: 150px; height: 44px; padding: 0 14px; border-radius: 8px;
  background: #5b5bd6; color: #fff; font-size: 12.5px; font-weight: 700;
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none; white-space: nowrap;
}
.svod-find .cmp-btn-pareto { background: #2f9e6e; }
.svod-find .cmp-btn:hover { filter: brightness(1.08); }

/* ── Страница «Сравнение Парето» v2 (ABC по моделям, план PLAN-PARETO-V2-ABC.md, 01.10.2026) ──
   Открывается второй кнопкой строки поиска свода. Единица анализа — МОДЕЛЬ МТ; диаграмма —
   КРИВАЯ накопления (SVG, строится в Python `calc_svod.pareto_curve`), зоны фоном с чипами,
   полосы — только топ-15. Цвета — классами отсюда, поэтому всё живёт в ОБЕИХ темах.
   Контент во всю ширину страницы (как свод), БЕЗ центрирования. */
.pt-bar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 12px;
  width: 100%; }
.pt-bar .svod-tabs { margin: 0; }
.pt-bar .svod-bar-right { margin-left: auto; display: flex; align-items: center; gap: 10px; }
/* ── Переключатель РЕЖИМА («что считаем»): поле с точками, а не ряд кнопок (02.10.2026) ──────────
   Владелец: «кнопки сливаются с другими не связанными кнопками, например с Выводы или Показать» —
   режим это не действие, а выбор того, что показывать, поэтому оформлен как ОБЫЧНОЕ ПОЛЕ портала
   (рамка + заливка поля + точки-переключатели). Разметка — ссылки, без JS. */
/* шапка блока, в которой справа живёт переключатель режима (страница модели) */
.svod-block-head { display: flex; justify-content: space-between; align-items: center; gap: 12px;
  flex-wrap: wrap; margin-bottom: 12px; }
.svod-block-head h2 { margin: 0; }
.modefield { display: inline-flex; align-items: center; gap: 9px; }
.modefield-l { color: var(--faint); font-size: 10.5px; letter-spacing: .7px; text-transform: uppercase;
  /* 29.10.2026, владелец: «и тут некрасиво, давай выравнивать» — подпись занимает СВОЮ колонку
     фиксированной ширины, иначе «ЧТО СЧИТАЕМ» и «ТИП» ставили галочки на разной оси (сдвиг 58 px) */
  flex: 0 0 auto; min-width: 92px; white-space: nowrap; }
.modefield-box { display: inline-flex; align-items: center; gap: 16px; min-height: 38px; padding: 0 14px;
  border-radius: 9px; background: var(--field); border: 1px solid var(--field-border); }
.modefield-box a.modeopt { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px;
  color: var(--sub); text-decoration: none; }
.modefield-box a.modeopt:hover { color: var(--ink); }
.modefield-box a.modeopt.on { color: var(--ink); font-weight: 700; }
.modeopt-dot { position: relative; flex: none; width: 15px; height: 15px; border-radius: 50%;
  border: 1.6px solid var(--field-border); }
.modefield-box a.modeopt.on .modeopt-dot { border-color: var(--accent); }
.modefield-box a.modeopt.on .modeopt-dot::after { content: ""; position: absolute; inset: 2.6px;
  border-radius: 50%; background: var(--accent); }
.pt-pdf { background: #2f9e6e; border-color: #2f9e6e; color: #fff; }
.pt-pdf:hover { filter: brightness(1.08); }
.pt-tiles { margin-top: 14px; width: 100%; }
.pt-panel { width: 100%; margin-top: 14px; max-width: 100%; }
.calc-page .pt-panel { width: 100%; }
.calc-page .pt-tiles { width: 100%; }
.pt-page .page-head, .pt-bar, .pt-panel, .pt-tiles { width: 100%; max-width: none; }
/* Сетка «кривая + зоны в одну строку» (`.pt-grid`) убрана 02.10.2026 вместе с перестановкой
   блоков: кривая и «Зоны» теперь идут ВЕРТИКАЛЬНО во всю ширину (классы `pt-panel-curve` /
   `pt-panel-zones` остались маркерами блоков в шаблоне и в проверках). */
/* Кривая ABC тянется по ширине колонки: высота — из пропорции листа (viewBox 980×560), а не
   фиксированные 420 px. С фиксированной высотой на широком экране рисунок упирался в неё и
   оставлял пустые поля по бокам — график выглядел маленьким (владелец, 02.10.2026: «сам график
   можно покрупнее сделать, а то если экран больше, то он никак не тянется и маленький»). */
.pt-svg { display: block; width: 100%; height: auto; }
.pt-chart { margin-top: 10px; overflow-x: auto; max-width: 1240px; }
.pt-h { font-size: 13px; }
.pt-tag { display: inline-block; font-size: 10.5px; letter-spacing: .6px; padding: 2px 8px;
  border-radius: 4px; background: var(--accent-soft); color: var(--accent); font-weight: 700;
  text-transform: uppercase; margin-left: 8px; vertical-align: 2px; }
/* ── кривая ABC ── */
.pt-svg .pt-grid { stroke: var(--line); stroke-width: 1; }
.pt-svg .pt-axis-line { stroke: var(--line); stroke-width: 1.2; }
.pt-svg .pt-axis { font-size: 10.5px; fill: var(--sub); }
.pt-svg .pt-axis-unit { fill: var(--faint); font-variant-numeric: tabular-nums; }
.pt-svg .pt-limit { stroke: var(--faint); stroke-width: 1.2; stroke-dasharray: 7 5; }
.pt-svg .pt-limit-label { font-size: 10.5px; fill: var(--faint); }
.pt-svg .pt-axis-y { font-size: 10.5px; fill: var(--sub); }
.pt-svg .pt-cum { fill: none; stroke: var(--accent); stroke-width: 2.6; }
.pt-svg .pt-zone-a { fill: rgba(79, 125, 249, .13); }
.pt-svg .pt-zone-b { fill: rgba(47, 158, 110, .11); }
.pt-svg .pt-zone-c { fill: rgba(122, 135, 152, .09); }
.pt-svg .pt-zone-label { font-size: 12.5px; font-weight: 700; letter-spacing: .5px;
  text-anchor: middle; }
.pt-svg .pt-zone-label-a { fill: var(--accent); }
.pt-svg .pt-zone-label-b { fill: #6fd3a4; }   /* был токен ФОНА (тёмно-коричневый) —
                                          подпись зоны B тонула в фоне */
.pt-svg .pt-zone-label-c { fill: var(--sub); }
.pt-svg .pt-mark { stroke-dasharray: 5 5; stroke-width: 1.6; }
.pt-svg .pt-mark-a { stroke: var(--accent); }
.pt-svg .pt-mark-b { stroke: var(--badge-me-b); }
.pt-svg .pt-dot { r: 5; }
.pt-svg .pt-dot-a { fill: var(--accent); }
.pt-svg .pt-dot-b { fill: var(--badge-me-b); }
.pt-svg .pt-mlabel { font-size: 12px; fill: var(--ink); font-weight: 600; }
/* ── зоны (полосы бюджета против моделей) ── */
/* Блок «Зоны» — во всю ширину ПОД кривой (владелец, 02.10.2026: «вместо „Моделей с наибольшим
   влиянием“ ставим график Зоны, полоски внутри сделать толще по высоте»). Было 22 и 14 px. */
.pt-zonebar { display: flex; flex-direction: column; gap: 8px; margin-bottom: 22px; }
.pt-zonebar-name { font-size: 14px; font-weight: 700; letter-spacing: .4px; }
.pt-zonebar-line { display: flex; align-items: center; gap: 10px; }
.pt-zonebar-val { flex: 0 0 150px; font-size: 13px; color: var(--sub); white-space: nowrap; }
.pt-zonebar-val.thinv { color: var(--faint); }
.pt-zonebar-track { flex: 1 1 0; height: 34px; border-radius: 10px; background: var(--bg);
  overflow: hidden; }
.pt-zonebar-track.thin { height: 22px; }
.pt-zonebar-fill { display: block; height: 34px; background: var(--accent); border-radius: 10px; }
.pt-zonebar-fill2 { display: block; height: 22px; background: var(--faint); border-radius: 8px; }
/* ── легенда, таблицы, выводы ── */
.pt-legend { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 10px; font-size: 11.5px;
  color: var(--sub); align-items: center; }
.pt-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px;
  margin-right: 6px; vertical-align: -1px; }
.pt-legend-zones { flex-direction: column; gap: 4px; align-items: flex-start; }
.pt-legend-zones .pt-zone-row { display: block; }
.pt-legend-zones b { color: var(--ink); font-weight: 600; }
.pt-i-a { background: var(--accent); }
.pt-i-b { background: var(--badge-me-b); }
.pt-i-c { background: var(--sub); }
.pt-table { table-layout: fixed; max-width: 100%; }
.pt-col-no { width: 56px; }
.pt-col-id { width: 120px; }
.pt-num { font-weight: 600; }            /* id модели: виден, но не спорит с названием */
.pt-col-zone { width: 62px; }
.pt-col-money { width: 160px; }
.pt-col-pct { width: 92px; }
.pt-col-num { width: 96px; }
.pt-row-a td { background: rgba(79, 125, 249, .07); }
.pt-row-b td { background: rgba(47, 158, 110, .05); }
.pt-row-c td { background: rgba(122, 135, 152, .05); }
.pt-badge { display: inline-block; min-width: 22px; text-align: center; font-size: 11px;
  font-weight: 700; border-radius: 5px; padding: 1px 5px; }
.pt-badge-a { background: var(--accent-soft); color: var(--accent); border: 1px solid var(--accent); }
.pt-badge-b { background: var(--badge-me-b); color: var(--badge-me-t); border: 1px solid var(--badge-me-t); }
.pt-badge-c { background: var(--row-hover); color: var(--sub); border: 1px solid var(--field-border); }
.pt-pager { display: flex; align-items: center; gap: 12px; margin-top: 12px; flex-wrap: wrap; }
/* `.pt-switch` (переключатель «по исполнителю / по видам регламента») убран 02.10.2026
   вместе с блоком «Итоги по группам». */
.pt-verdicts { display: flex; flex-direction: column; gap: 8px; }
.pt-verdict { display: flex; gap: 10px; align-items: flex-start; font-size: 12.5px;
  background: var(--card); border: 1px solid var(--card-border); border-radius: 8px;
  padding: 9px 12px; }
.pt-verdict b { color: var(--num); }
.pt-verdict-num { flex: none; min-width: 18px; font-size: 12.5px; font-weight: 800;
  color: var(--accent); font-variant-numeric: tabular-nums; }
.pt-fill-rest { background: var(--sub); }
/* светлая тема: контраст кривой и зон выше */
html[data-theme="light"] .pt-svg .pt-zone-a { fill: rgba(29, 91, 214, .10); }
html[data-theme="light"] .pt-svg .pt-zone-b { fill: rgba(47, 158, 110, .08); }
html[data-theme="light"] .pt-svg .pt-zone-c { fill: rgba(120, 134, 155, .07); }
html[data-theme="light"] .pt-svg .pt-cum { stroke: #1d5bd6; }
html[data-theme="light"] .pt-svg .pt-mlabel { fill: #1d2a44; }
html[data-theme="light"] .pt-svg .pt-zone-label-b { fill: #1c7a55; }
/* Полосы подготовки PDF (`.pt-pdf-prog*`, `.pt-pdf-done`, `.pt-pdf.busy`, `@keyframes
   pt-pdf-run`) убраны 02.10.2026: PDF печатает сам портал (reportlab, ~50 мс), кнопка —
   обычная ссылка на файл, полоса подготовки больше не нужна. Кнопка остаётся зелёной
   (`.pt-pdf` выше). */


/* ============ СРАВНЕНИЕ ДВУХ МОДЕЛЕЙ (/calc/<заливка>/compare/, 06.10.2026) ============
   Порт из утверждённого макета `docs/plans/assets_compare/mock_v4a-c.html` (вариант 4):
   две колонки 50/50, строки моделей стоят НАПРОТИВ по общему ключу, у строки без пары —
   подсветка и прочерк «—». Числа и разметка клеток — из `core/calc_compare.py`. */

.cmp-form { display: block; }
.cmp-top { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 14px; align-items: start; }
.cmp-in { background: var(--field); border: 1px solid var(--field-border); color: var(--ink);
  border-radius: 8px; padding: 9px 12px; font-size: 13.5px; width: 100%; box-sizing: border-box; }
.cmp-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.mode-row { margin-top: 12px; }
.cmp-sec { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--sub);
  margin: 18px 0 6px; }
.cmp-cnt { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--faint); }
.cmp-hint { margin-top: 6px; }

/* таблица «строка напротив»: 50/50, разделитель по центру */
table.pair { table-layout: fixed; width: 100%; }
.pair th { white-space: normal; }
.pair td { vertical-align: top; padding: 10px 14px 10px 0; font-size: 13px;
  overflow-wrap: anywhere; }
.pair .pair-l { width: 50%; border-right: 2px solid var(--line); padding-right: 18px; }
.pair .pair-r { width: 50%; padding-left: 18px; }
.pair-k { font-weight: 700; font-size: 13px; margin-bottom: 3px; }
.pair-v { font-size: 13px; }
.pair-s { color: var(--sub); font-size: 11.5px; margin-top: 2px; }
.pair-none { color: var(--faint); font-size: 15px; }
/* ПОДСВЕТКА РАСХОЖДЕНИЙ (владелец, 06.10.2026): подсвечиваем ТОЛЬКО те значения, где поле
   совпадает, а число разное — «Лучше разницу похожих полей, но разных значений подсветить,
   остальное не подсвечивать и так понятно отличие». Одну клетку выделяет не фон строки,
   а рамка вокруг самого значения. Строка с прочерком (есть только у одной модели) — без
   подсветки: .pair-only в правилах не участвует. */
.cmp-mark { background: rgba(255, 176, 32, .30); border: 1px solid rgba(255, 176, 32, .85);
  border-radius: 4px; padding: 0 4px; color: #ffd68a; font-weight: 600; }
.pair tr.pair-diff .pair-l, .pair tr.pair-diff .pair-r { background: none; }
.cmp-opfot { margin-top: 3px; font-size: 11.5px; color: var(--sub); }
.pair tr.cmp-subrow .pair-k { font-weight: 600; }
.pair tr.cmp-subrow td { padding-top: 4px; padding-bottom: 4px; }
/* сводка «что именно разное» под плитками */
.cmp-diffs { display: grid; gap: 6px; margin-top: 4px; }
.cmp-dline { display: flex; align-items: baseline; gap: 8px; font-size: 13px; }
.cmp-dline .dt-badge { flex: none; min-width: 96px; text-align: center; }
.cmp-dtext { line-height: 1.5; }
.cmp-sub { color: var(--sub); font-size: 11.5px; }

/* СРАВНЕНИЕ ОПЕРАЦИЙ «КАК В ТО» (владелец, 06.10.2026: «по аналогии как у нас операции в ТО
   сделать отдельно сравнение этих пунктов»): две таблицы с колонками и подвалом страницы
   позиции, строки выровнены по операции. Половина панели ~608 px, поэтому шрифт мельче и
   колонки фиксированной ширины: длинные подписи шапки переносятся, ничего не обрезается. */
.cmp-ops-wrap { display: flex; gap: 14px; align-items: flex-start; }
.cmp-ops-col { flex: 1 1 50%; min-width: 0; }
.cmp-ops-title { margin: 0 0 6px; font-size: 13px; font-weight: 600; }
.cmp-ops { width: 100%; table-layout: fixed; }
.cmp-ops th, .cmp-ops td { font-size: 11px; padding: 5px 4px 5px 0; vertical-align: top;
  overflow-wrap: break-word; }
.cmp-ops th { line-height: 1.25; }
/* ширины подобраны так, чтобы сумма не превышала половину панели: проценты + фиксированные
   столбцы чисел; замер в браузере держит проверка (страница не должна выезжать по горизонтали).
   Столбцам денег ширины хватает на «1 234,56 ₽» и «нет ставки» — иначе текст рвётся по слогам */
.cmp-ops th:nth-child(1), .cmp-ops td:nth-child(1) { width: 26px; }
.cmp-ops th:nth-child(2), .cmp-ops td:nth-child(2) { width: 24%; }
.cmp-ops th:nth-child(3), .cmp-ops td:nth-child(3) { width: 14%; }
.cmp-ops th:nth-child(4), .cmp-ops td:nth-child(4) { width: 56px; }
.cmp-ops th:nth-child(5), .cmp-ops td:nth-child(5) { width: 14%; }
.cmp-ops th:nth-child(6), .cmp-ops td:nth-child(6) { width: 72px; }
.cmp-ops th:nth-child(7), .cmp-ops td:nth-child(7) { width: 76px; }
.cmp-ops tfoot td { color: var(--sub); border-top: 1px solid var(--line); }
.cmp-ops tr.svod-total td { color: inherit; }
/* «зебра» по строкам: таблицы идут в одном порядке, поэтому подсветка строки помогает вести
   взглядом одну операцию слева направо, когда между таблицами полтора десятка строк */
.cmp-ops tbody tr:nth-child(odd) { background: rgba(255, 255, 255, .022); }

/* у плиток сравнения своя ширина колонки: две плитки в половине панели */
.cmp-top .svod-tiles { margin-top: 0; }

/* Форма выбора моделей на странице сравнения — ВО ВСЮ ШИРИНУ панели: поле слева стоит ровно над
   левым блоком, поле справа — над правым (владелец, 06.10.2026: «одно поле слева, другое справа,
   прям над блоками»). Общее правило `.calc-page form { width: fit-content }` сжимало форму до
   495 px, и оба поля уезжали в левый край. */
.calc-page form.cmp-form { width: 100%; }
.cmp-top.cmp-sides { margin-top: 16px; }
/* Плитки моделей в сравнении — СТОЛБИКОМ внутри своей половины: в верхней строке «тариф» обеих
   моделей, во второй — «видов регламентов» каждой (владелец, 06.10.2026: «плашки тариф слева,
   тариф справа, далее кол-во регламентов под первой и кол-во регламентов под второй»). */
.cmp-sides .svod-tiles { grid-template-columns: minmax(0, 1fr); margin-top: 0; }


/* ============ СВОД ТО: ПОРЯДОК И ОФОРМЛЕНИЕ (07.10.2026 — «делаем А + оформление 3») ============
   Согласовано с владельцем по кадрам `design/shots/svod-lay-actA.png` (место — ВАРИАНТ A:
   зона аналитики под плитками) и `svod-lay-az.png` (вид — оформление 3: две плашки-карточки
   с пояснением). Порядок страницы: шапка с действиями → полоса «что показываем» → панель
   «как ищем» → плитки → зона аналитики → график → таблица → замечания.
   Единые правила (лист `svod-lay-rules.png`): высота контролов 40, радиус 10, зазоры 12 внутри
   блока и 24 между блоками, кегли 13 (подписи полей и кнопок) и 12 (пояснения). Цвета кнопок
   НЕ трогаем: аналитика остаётся цветной — владелец, 07.10.2026: «Анализ ABC и сравнение куда
   то пропали и стали почти незаметны».
   ВНИМАНИЕ: этот блок ПРОДУБЛИРОВАН в `calc_svod.html` (`extra_head`) — на рабочем ПК владельца
   `portal.css` доезжает только после `collectstatic`, а его там нет. Правишь здесь — поправь там. */
.svod-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px;
  flex-wrap: wrap; width: min(100%, 1680px); }
.svod-head-l { flex: 1 1 0; min-width: 0; }
/* 27.10.2026, владелец: «нажимаю ТО и Метрологию — кнопки прыгают». Левая часть шапки
   распирала flex-wrap своей длинной подписью, и блок действий уезжал ВТОРЫМ рядом:
   шапка ТО была 161 px, у Метрологии 90 — вкладки прыгали на 84 px. Теперь левая часть
   сжимается, действие всегда справа на той же строке. */
.svod-head-act { flex: 0 0 auto; }
.svod-head-act { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-top: 4px; }
.svod-head-act .share-card { margin: 0; }
.svod-head-act .share-card > .share-sum { padding: 9px 16px; }
/* кнопка действий: высота 40 + ТЕКСТ ПО ЦЕНТРУ — `.btn` в портале `inline-block` с отступами
   12/18 px, и от одной высоты текст уезжал к верхнему краю (владелец, 07.10.2026: «что с кнопкой?») */
.svod-head-act .btn { display: inline-flex; align-items: center; justify-content: center;
  height: 40px; border-radius: 10px; padding: 0 16px; }
.svod-head-act .svod-pick { font-size: 12.5px; }
/* 02.11.2026: выбор файла/группы уехал из полосы галочек в шапку (справа, только админу) —
   высота та же, что у кнопки-панели в шапке, иначе строка шапки прыгает */
.svod-head-act .svod-pick select { height: 40px; border-radius: 10px; padding: 0 9px; }
/* одна полоса «что показываем»: вкладки + режим + выбор файла + ссылка сравнения двумя моделями */
/* 23.10.2026: зазор 20→18 px и легенда 330→300 px — на 1600 в полосу встала кнопка
   выгрузки (было занято 1440 + 118 > 1528). */
.svod-line { display: flex; align-items: flex-start; gap: 18px; flex-wrap: wrap; margin-top: 20px;
  width: min(100%, 1680px); }
/* 27.10.2026: `align-items: center` выравнивал вкладки по самому высокому соседу — на своде ТО это
   легенда (54 px), и строка вкладок стояла на 7 px ниже, чем в Метрологии (там полоса только из
   вкладок). Владелец: «нажимаю ТО и Метрологию — кнопки прыгают». Теперь всё по верхнему краю. */
.svod-line .dt-tabs { margin: 0; }
.svod-line .dt-tab { border-radius: 10px; min-height: 40px; display: inline-flex; align-items: center; }
.svod-line .modefield-box { height: 40px; border-radius: 10px; }
.svod-line .svod-pick select { height: 40px; border-radius: 10px; padding: 0 9px; }
.svod-line .svod-cmp-link { margin: 0; font-size: 13px; }
/* 02.11.2026: кнопка выгрузки — у ПРАВОГО края полосы «что показываем», а не в середине:
   полоса flex с переносом, поэтому `margin-left: auto` держит её у правого края своей строки
   (точную подпись кнопки в комментарий не пишем — она печатается текстом на странице) */
.svod-line .svod-export { margin-left: auto; }
/* панель «как ищем»: ОДНА рамка вокруг поиска и фильтров (было — просто строка на странице) */
.svod-controls { display: flex; align-items: center; margin-top: 24px; background: var(--card);
  border: 1px solid var(--card-border); border-radius: 12px; padding: 12px 16px;
  width: min(100%, 1680px); }
.svod-controls .svod-find { margin-top: 0; flex-wrap: nowrap; width: 100%; }
.svod-controls .svod-find label { font-size: 13px; }
.svod-controls .svod-find input[type="search"],
.svod-controls .svod-find select { height: 40px; border-radius: 10px; padding-block: 0; }
/* «Показать»: та же грабля, что у кнопки в шапке — `height` без центрирования текста оставлял
   подпись у верхнего края */
.svod-controls .svod-find .btn { display: inline-flex; align-items: center; justify-content: center;
  height: 40px; border-radius: 10px; padding: 0 16px; font-size: 13px; }
/* на узком экране панель переносится: сжимать до нечитаемого нечего */
@media (max-width: 1280px) { .svod-controls .svod-find { flex-wrap: wrap; } }
/* «×» внутри поля поиска: свой, обычной ссылкой (родной «×» Chromium только стирает текст
   и экран НЕ пересчитывает — владелец, 07.10.2026: согласованная форма сброса 2 + 5) */
.svod-find-wrap { position: relative; display: inline-flex; align-items: center; }
.svod-find-wrap input[type="search"] { padding-right: 30px; }
/* родной «×» Chromium прячем ТОЛЬКО на своде ТО: он стирает текст, но экран не пересчитывает.
   На своде Метрологии поле остаётся как было — там своя строка поиска (`.svod-find-tk`) */
.svod-page .svod-find input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none;
  appearance: none; }
.svod-find-clear { position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; border-radius: 50%; display: inline-flex; align-items: center;
  justify-content: center; font-size: 13px; line-height: 1; text-decoration: none;
  background: var(--field-border); color: var(--ink); }
.svod-find-clear:hover { background: var(--accent); color: #fff; }
.svod-find-clear.off { visibility: hidden; }
/* маленький сброс фильтров — согласованная форма 2: иконка 32 px вместо слова-подписи,
   место в строке занято всегда (владелец, 02.10.2026: при её появлении/исчезновении строка ехала) */
.svod-reset { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  width: 32px; height: 32px; border-radius: 10px; color: var(--sub); text-decoration: none;
  background: transparent; border: 0; }
.svod-reset:hover { background: var(--field); color: var(--ink); }
.svod-reset .ic { width: 16px; height: 16px; }
.svod-reset.off { opacity: .45; }
/* зона аналитики под плитками — ОФОРМЛЕНИЕ 3: две плашки-карточки 330 px с пояснением */
.svod-actzone { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 24px;
  width: min(100%, 1680px); }
.svod-actzone-l { color: var(--sub); font-size: 13px; }
/* 21.10.2026: шапка зоны аналитики одной строкой — «Сравнение двух моделей» стоит ВПЛОТНУЮ за
   заголовком (владелец: «прям справа от заголовка, не очень далеко — справа никто не увидит»),
   карточки начинаются со следующей строки. */
.svod-actzone-head { flex: 1 1 100%; display: flex; align-items: baseline; gap: 14px; }
.svod-actzone-head .svod-cmp-link { margin: 0; font-size: 13px; }
/* карточки аналитики — РАВНЫЕ колонки одной сетки (18.10.2026: «сделай плашки аккуратные,
   ровные, выровнять все»): 3 при наличии СП-данных, 2 без них, и всегда по одной линии */
.svod-azcards { display: grid; gap: 14px; align-items: stretch;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); width: min(100%, 1680px); }
.svod-azcard { display: flex; flex-direction: column; height: 100%; text-decoration: none;
  background: var(--card); border: 1px solid var(--card-border); border-radius: 10px;
  padding: 12px 14px; }
.svod-azcard:hover { border-color: var(--accent); }
.svod-azcard-t { display: block; font-size: 14px; font-weight: 700; color: var(--num); }
.svod-azcard-s { display: block; margin-top: 4px; font-size: 12px; color: var(--sub);
  line-height: 1.45; }
/* «модели, где КП мало» — тот же вид карточки, акцент только рамкой (не ошибкой) */
.svod-azcard-warn { border-color: #c98a3c; }
/* карточка без перехода (у сотрудника нет доступа к блоку «СП») — вид тот же, но не ссылка */
.svod-azcard-off { opacity: .82; }
.svod-azcard-off:hover { border-color: var(--card-border); }
.svod-azcard-pareto .svod-azcard-t { color: #5fd39a; }
html[data-theme="light"] .svod-azcard-pareto .svod-azcard-t { color: #1c7a55; }
/* зона признака СП (15.10.2026) УБРАНА 18.10.2026: сумма СП стоит плиткой и строкой таблицы,
   а «модели, где КП мало» — третьей карточкой аналитики (одна сетка с остальными) */
/* столбец признака СП в перечне расчётов */
.svod-col-sp { width: 150px; }
/* панель СП на странице модели: строка фактов и таблица КП под ней */
.svod-spfacts { display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin: 2px 0 12px;
  font-size: 12.5px; color: var(--sub); }
.svod-spfact b { color: var(--ink); }
.svod-sp-panel .panel-head { align-items: baseline; }
.svod-narrow { max-width: 1180px; }
.svod-narrow th:first-child { width: auto; }
/* ============ галочки «что считаем»: ТО · ТО12+ · СП (18.10.2026) ============
   Отметок может быть несколько (ТО/ТО12+ — свои силы, СП — субподряд); цвета галочек и подписей
   те же, что у плашек типа в таблице: `.b-open` зелёный, `.b-me` янтарный, `.b-grp` синий.
   Это ССЫЛКИ с нарисованной галочкой (без JS), поэтому состояние живёт в адресе. */
.modefield-box a.modecheck .modeopt-box { position: relative; flex: none; width: 15px; height: 15px;
  border-radius: 4px; border: 1.5px solid currentColor; background: transparent; }
.modefield-box a.modecheck .modeopt-box.b-open { color: var(--badge-open-t); }
.modefield-box a.modecheck .modeopt-box.b-me { color: var(--badge-me-t); }
.modefield-box a.modecheck .modeopt-box.b-grp { color: var(--badge-grp-t); }
.modefield-box a.modecheck .modeopt-t { font-weight: 600; }
.modefield-box a.modecheck.on .modeopt-box::after { content: "✓"; position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700;
  color: var(--modecheck-ink); }
.modefield-box a.modecheck.on .modeopt-box.b-open { background: var(--badge-open-t);
  border-color: var(--badge-open-t); }
.modefield-box a.modecheck.on .modeopt-box.b-me { background: var(--badge-me-t);
  border-color: var(--badge-me-t); }
.modefield-box a.modecheck.on .modeopt-box.b-grp { background: var(--badge-grp-t);
  border-color: var(--badge-grp-t); }
.modefield-box a.modecheck .modeopt-t.b-open { color: var(--badge-open-t); }
.modefield-box a.modecheck .modeopt-t.b-me { color: var(--badge-me-t); }
.modefield-box a.modecheck .modeopt-t.b-grp { color: var(--badge-grp-t); }
.modefield-box a.modecheck:not(.on) .modeopt-t { color: var(--sub); }
/* 02.11.2026, владелец: «сейчас не информативно, не понятно, стоит галочка или нет». У неотмеченного
   пункта клетка была янтарным контуром 1.5 px — он читался как цветной маркер, а не как «не
   отмечено». Пустая клетка теперь нейтральная серая рамка 2 px: состояние видно по цвету заливки. */
.modefield-box a.modecheck:not(.on) .modeopt-box { color: var(--sub); border-color: var(--sub);
  border-width: 2px; background: transparent; }
/* 02.11.2026: в колонке «Единиц» под числом — разбивка по графам файла теми же цветами,
   что у галочек «Тип» (зелёный — Основное, янтарный — Факультатив). Колонка не новая: владелец —
   «количество уже есть, слева от периодичности», поэтому разбивка живёт ВНУТРИ её клетки. */
.qty-split { font-size: 11px; line-height: 1.35; color: var(--sub); font-weight: 400;
  margin-top: 3px; }
.qty-split i { font-style: normal; }
.qty-split i.osn { color: var(--badge-open-t); }
.qty-split i.fak { color: var(--badge-me-t); }
/* легенда под полосой: подписи галочек короткие, расшифровка — одной припиской */
.svod-legend { margin: 10px 0 0; font-size: 11.5px; line-height: 1.55; color: var(--sub);
  width: min(100%, 1680px); }
.svod-legend-i { font-weight: 700; }
.svod-legend-i.b-open { color: var(--badge-open-t); }
.svod-legend-i.b-me { color: var(--badge-me-t); }
.svod-legend-i.b-grp { color: var(--badge-grp-t); }
.svod-legend-s { color: var(--faint); }
/* 23.10.2026, владелец: «легенда с ТО, ТО12+ и СП почему-то под дорогой и очень сильно растянута».
   Расшифровка галочек стоит УЗКОЙ КОЛОНКОЙ в самой полосе, сразу за полем «что считаем», и
   привязана к `.svod-line`: класс `.svod-legend` носят ещё легенды состава цены (позиция, свод
   Метрологии) — их правило не задеваем. Было: отдельной строкой под «дорогой» во всю ширину. */
.svod-line .svod-legend.svod-legend-kinds { margin: 0; width: 300px; font-size: 11.5px;
  line-height: 1.5; display: flex; flex-direction: column; gap: 1px; }
.svod-line .svod-legend-kinds > span { display: block; }
/* плашка типа в таблице свода: «.badge» в портале тянется вправо (margin-left:auto) — в клетке
   по центру это сдвигало её к границе */
.svod-list td .badge { margin-left: 0; }
/* плитки и таблица — тот же радиус, что у остальных блоков страницы */
.svod-page .svod-tile { border-radius: 10px; }
/* плитки — одинаковые по высоте, подпись прижата к низу: ряды карточек не «пляшут»
   (18.10.2026: «аккуратные, ровные, выровнять все») */
.svod-page .svod-tiles { align-items: stretch; }
.svod-page .svod-tile { display: flex; flex-direction: column; height: 100%; min-height: 120px; }
/* подпись начинается на ОДНОЙ линии во всех плитках (число и заголовок — фиксированной высоты):
   прижимать подпись к низу нельзя — у трёх карточек разное число строк и середина «рвётся» */
.svod-page .svod-tile-l { min-height: 32px; }
/* третья часть полосы аналитики — СП (18.10.2026); синяя ТО и жёлтая ТО12+ не трогаем */
.svod-bar-fill.sp { background: #a78bfa; }
/* раскрытая панель ссылок владельца занимает всю ширину шапки, а не сжимает заголовок */
.svod-head:has(.share-card[open]) .svod-head-act { flex: 1 1 100%; justify-content: flex-start; }
/* ============ конец блока «свод ТО: порядок и оформление» ============ */

/* 30.10.2026, владелец: «принять по умолчанию расчётный котёл и убрать выбор» — вариантов дележа
   (В1 · В2 · «в расчёте») больше нет: расчёт всегда идёт по В3 (общий котёл). На «Дороге» вместо
   них — выбор источника дороги в расчёте: «Расчётный (котёл)» / «Из файла (колонка M)». */
/* подпись источника дороги на своде — мелкая, в конце полосы фильтров (30.10.2026) */
.road-src-mini { margin-left: auto; color: var(--faint); font-size: 11.5px; opacity: .9;
                 cursor: help; white-space: nowrap; }
.road-src { display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
             margin: 0 0 12px; padding: 8px 12px; border: 1px solid var(--card-border);
             /* фон/рамка — «карточные» переменные: в светлой теме --panel тёмно-синий (сайдбар),
                и блок выглядел чужой тёмной плашкой (владелец, 30.10.2026: «цвет поплыл») */
             border-radius: 8px; background: var(--card); font-size: 13px; color: var(--sub); }
.road-src-l { color: var(--ink); font-weight: 600; }
.road-src-hint { color: var(--sub); }
.road-src-note { font-size: 12.5px; color: var(--badge-me-t); margin: -6px 0 12px; }
.road-var-pick { display: flex; flex-wrap: wrap; gap: 10px; align-items: center;
                 margin: 2px 0 10px; font-size: 12.5px; color: var(--sub); }
.road-var-l { color: var(--sub); }
.road-var-seg { display: inline-flex; border: 1px solid var(--field-border); border-radius: 6px;
                overflow: hidden; background: var(--field); }
.road-var-seg button { padding: 3px 10px; font: inherit; font-size: 12.5px; line-height: 1.5;
                       color: var(--sub); background: transparent; border: 0;
                       border-left: 1px solid var(--field-border); cursor: pointer; }
.road-var-seg button:first-child { border-left: 0; }
.road-var-seg button:hover { color: var(--ink); }
.road-var-seg button.road-var-on { background: var(--accent-soft); color: var(--accent);
                                   font-weight: 600; }
.road-var-hint { color: var(--sub); }
.road-var-note { font-size: 12px; color: var(--badge-me-t); margin: -4px 0 10px; }

/* 29.10.2026, владелец: «В Сводной ТО галочки можно добавить где сейчас „Дорога“ и легенда — это
   убираем» + «как в Метрологии добавить Тип галочки и % Исполнения». Строка на месте блока
   «Дорога»: галочки количества МТ и поле процента исполнения заливки. */
.svod-qtybar { display: flex; align-items: center; gap: 18px; margin-top: 12px;
  width: min(100%, 1680px); flex-wrap: wrap; }
/* одна высота у всех полос фильтров: 40 px у «Типа» против 38 px у «что считаем» давало
   разъезд по вертикали (29.10.2026) */
.svod-qtybar .modefield-box { height: 38px; border-radius: 10px; }
.svod-exec-box { gap: 6px; padding: 0 12px; }
.svod-exec-box input { width: 58px; height: 26px; background: transparent; border: 0;
  color: var(--ink); font: 600 14px/1 ui-monospace, SFMono-Regular, Menlo, monospace;
  text-align: center; }
.svod-exec-box input:focus { outline: none; }
.svod-exec-pct { color: var(--sub); font-size: 12.5px; }
.svod-exec-ro { display: inline-flex; align-items: center; gap: 4px; padding: 0 12px; color: var(--ink);
  font: 600 14px/1 ui-monospace, SFMono-Regular, Menlo, monospace; }
.svod-qty-hint { font-size: 11.5px; }

/* 29.10.2026: повторное добавление оборудования — строка уже в заявке подсвечивается,
   и появляется подсказка (владелец: «оборудование дублируется и не удаляется»). */
.kp-eq-dup { outline: 2px solid var(--accent); outline-offset: 1px; border-radius: 8px; }
.kp-dup-hint { margin: 6px 0 2px; font-size: 12px; color: var(--accent); }

/* СП → «Загрузка»: выбор файла количества — обычное поле (29.10.2026, без JS) */
.sp-qty-pick { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 2px; }
.sp-qty-file { color: var(--ink); font-size: 13.5px; background: var(--panel); border: 1px solid var(--line);
  border-radius: 10px; padding: 10px 12px; max-width: 620px; }
.sp-qty-file::file-selector-button { margin-right: 12px; padding: 6px 14px; border-radius: 8px;
  border: 1px solid var(--line); background: var(--accent); color: #fff; font-size: 13px; cursor: pointer; }

/* история заливок СП: колонка «убрать запись» (29.10.2026) */
.sp-up-delcol { width: 44px; text-align: right; }
.sp-up-delcol form { display: inline; }
.sp-up-delcol .btn { padding: 2px 8px; }

/* СП → «Загрузка»: панель итога загрузки количества (29.10.2026) */
.sp-qty-result { margin: 10px 0 4px; padding: 10px 14px; border: 1px solid var(--line);
  border-left: 3px solid #3fa76a; border-radius: 10px; background: var(--panel); }
.sp-qty-result-h { color: var(--ink); font-size: 13.5px; font-weight: 600; margin-bottom: 4px; }
.sp-qty-result-row { color: var(--sub); font-size: 12.5px; }
.sp-qty-result-row b { color: var(--ink); }