/* Модуль «Спецификации»: каталог позиций и спецификации проекта (20 октября 2026),
   переверстаны 21 октября: крупное фото, правка в строке без рамок, импорт из Excel, повторы.
   Облик — токенами :root из общего styles.css и tokens.css (docs/ОБЛИК-И-ШКАЛЫ.md). */

.spc-bar { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; margin: var(--s-3) 0; }
.spc-bar .input[type="search"] { flex: 1 1 260px; max-width: 420px; }
.spc-bar .select { width: auto; max-width: 240px; }
.spc-title { font-size: var(--t-lg); margin: 0; }
.spc-count { font-size: var(--t-sm); white-space: nowrap; }
.spc-check { display: inline-flex; align-items: center; gap: var(--s-1); font-size: var(--t-sm); font-weight: 500; cursor: pointer; padding: 0 var(--s-2); }
.spc-h { font-size: var(--t-md); margin: var(--s-4) 0 var(--s-1); }
.spc-mono { font-family: var(--f-mono); font-size: var(--t-mono); white-space: nowrap; }
.spc-warn { color: var(--warn-fg); font-weight: 500; }

/* Пустые состояния: значок в круге, заголовок, пояснение, действие */
.spc-empty { display: flex; flex-direction: column; align-items: center; gap: var(--s-2); padding: var(--s-6) var(--s-4); text-align: center; }
.spc-empty h3 { margin: 0; }
.spc-empty p { max-width: 52ch; margin: 0; }
.spc-empty--card { background: var(--surface); border-radius: var(--radius-lg); margin-top: var(--s-2); }
.spc-empty__ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--radius-full); background: var(--accent-soft); color: var(--accent-fg); margin-bottom: var(--s-1); }
.spc-empty__acts { display: flex; gap: var(--s-2); flex-wrap: wrap; justify-content: center; margin-top: var(--s-2); }

/* Рамка под картинку позиции: квадрат, картинка вписана целиком */
.spc-thumb {
  display: inline-grid; place-items: center; flex: none; width: var(--sz, 40px); height: var(--sz, 40px);
  border-radius: var(--radius-sm); background: var(--surface-2); color: var(--text-faint); overflow: hidden;
  border: 0; padding: 0; vertical-align: middle;
}
.spc-thumb img { width: 100%; height: 100%; object-fit: contain; display: block; background: var(--surface); }
.spc-thumb--zoom { cursor: zoom-in; transition: box-shadow var(--fast); }
.spc-thumb--zoom:hover:where([data-hover="mouse"] *), .spc-thumb--zoom:focus-visible { box-shadow: 0 0 0 2px var(--accent); outline: none; }

/* Лупа: картинка крупно */
.spc-lupa { z-index: 60; cursor: zoom-out; }
.spc-lupa__fig { margin: 0; display: flex; flex-direction: column; align-items: center; gap: var(--s-2); max-width: 100%; }
.spc-lupa__fig img { max-width: min(1000px, 92vw); max-height: 82dvh; object-fit: contain; border-radius: var(--radius); background: var(--surface); box-shadow: var(--sh-3); }
.spc-lupa__fig figcaption { color: var(--on-scrim); font-weight: 500; text-shadow: 0 1px 2px rgba(0, 0, 0, .5); text-align: center; }

/* Таблицы: свой горизонтальный скролл, чтобы страница не ездила вбок на телефоне */
.spc-tblwrap { overflow-x: auto; background: var(--surface); border-radius: var(--radius-lg); max-width: 100%; }
.spc-tbl { min-width: 720px; }
.spc-tbl td, .spc-tbl th { padding: var(--s-2) var(--s-3); }
.spc-tbl th { white-space: nowrap; }
.spc-tbl__row { cursor: pointer; transition: background var(--fast); }
.spc-tbl__row:hover:where([data-hover="mouse"] *) { background: var(--hover); }
.spc-tbl__row:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
.spc-tbl--cat td { vertical-align: middle; }
.spc-col-pic { width: 1%; }
.spc-name { font-weight: 600; color: var(--text); text-decoration: none; }
a.spc-name:hover:where([data-hover="mouse"] *) { color: var(--accent-fg); text-decoration: underline; text-underline-offset: 2px; }
.spc-sub { font-size: var(--t-xs); line-height: 1.4; }
.spc-sub--strong { color: var(--text-dim); font-size: var(--t-sm); }
.spc-sum { font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; }
.spc-clipn { white-space: nowrap; }

/* Шапка спецификации: название и состояние слева, действия справа */
.spc-head { display: flex; align-items: center; gap: var(--s-2) var(--s-4); flex-wrap: wrap; margin: var(--s-3) 0; }
.spc-head__title { display: flex; align-items: baseline; gap: var(--s-2) var(--s-3); flex-wrap: wrap; flex: 1 1 260px; min-width: 0; }
.spc-head__acts { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; }
.spc-state { font-size: var(--t-xs); color: var(--text-faint); min-height: 1em; }
.spc-state.is-saving { color: var(--text-dim); }
.spc-state.is-saved { color: var(--ok-fg); }
.spc-state.is-error { color: var(--late-fg); font-weight: 500; }

/* Строки спецификации: фото 80, ритм — отступ s-3 сверху и снизу, текст по верху */
.spc-tbl--spec { min-width: 860px; }
.spc-tbl--spec td { vertical-align: top; padding-top: var(--s-3); padding-bottom: var(--s-3); }
.spc-tbl--spec tbody tr:last-child td { border-bottom-color: transparent; }
.spc-tbl--spec th { font-size: var(--t-xs); color: var(--text-faint); font-weight: 500; }
.spc-tbl--spec tfoot td { border-top: 1px solid var(--border-strong); }
.spc-line { transition: background var(--fast), opacity var(--fast); }
.spc-line:hover:where([data-hover="mouse"] *) { background: var(--hover); }
.spc-line.is-drag { background: var(--accent-soft); box-shadow: var(--sh-2); position: relative; z-index: 1; }
.spc-line.is-gone { opacity: .35; pointer-events: none; }
.is-sorting .spc-line { transition: none; }
.spc-tbl--spec .spc-col-pic { padding-right: 0; }
.spc-line__name { min-width: 220px; width: 34%; }
/* Text cells start on the line of the text inside the fields next to them */
.spc-tbl--spec td.spc-line__name, .spc-tbl--spec td.spc-sum { padding-top: calc(var(--s-3) + var(--s-1)); }
.spc-col-qty, .spc-col-unit, .spc-col-price, .spc-col-mark { width: 1%; }
.spc-line__name .spc-name { font-size: var(--t-base); line-height: 1.35; }
.spc-line__name > * + * { margin-top: var(--s-05); }
.spc-total { color: var(--text-dim); font-weight: 500; }

/* Номер строки; у правящего на его месте при наведении — ручка */
.spc-line__h { width: 1%; white-space: nowrap; color: var(--text-faint); font-size: var(--t-sm); font-variant-numeric: tabular-nums; text-align: center; position: relative; }
.spc-n { display: inline-block; min-width: 20px; line-height: 32px; }
.spc-grip {
  display: none; place-items: center; width: 24px; height: 32px; margin: 0 auto; padding: 0; border: 0; border-radius: var(--radius-sm);
  background: none; color: var(--text-faint); cursor: grab; touch-action: none;
}
.spc-grip:hover:where([data-hover="mouse"] *) { color: var(--text); background: var(--hover); }
.spc-grip:focus-visible { outline: 2px solid var(--accent); outline-offset: 0; }
.spc-line.is-drag .spc-grip { cursor: grabbing; }

/* Живые поля: без рамки и фона, пока не наведены и не в фокусе */
.spc-cell {
  border-color: transparent; background: transparent; box-shadow: none;
  transition: border-color var(--fast), background var(--fast);
}
.spc-cell::placeholder { color: var(--text-faint); opacity: 0; transition: opacity var(--fast); }
.spc-line:hover:where([data-hover="mouse"] *) .spc-cell::placeholder, .spc-cell:focus::placeholder, .spc-price.spc-cell::placeholder { opacity: 1; }
:root:not([data-hover="mouse"]) .spc-cell::placeholder { opacity: 1; }
.spc-line:hover:where([data-hover="mouse"] *) .spc-cell:not(:disabled) { border-color: var(--border); background: var(--surface); }
.spc-cell:focus { border-color: var(--accent); background: var(--surface); box-shadow: 0 0 0 3px var(--accent-ring); outline: none; }
.spc-cell:disabled { color: var(--text); opacity: 1; -webkit-text-fill-color: var(--text); }
.spc-tbl--spec .select--sm { border-color: transparent; background-color: transparent; }
.spc-line:hover:where([data-hover="mouse"] *) .select--sm:not(:disabled), .spc-tbl--spec .select--sm:focus { border-color: var(--border); background-color: var(--surface); }
.spc-tbl--spec .select--sm:disabled { opacity: 1; color: var(--text); background-image: none; }
td.is-saving .spc-cell, td.is-saving .select { background: var(--surface-2); }
td.is-saved .spc-cell, td.is-saved .select { border-color: var(--ok-fg); }
td.is-error .spc-cell, td.is-error .select { border-color: var(--late); background: var(--critical-soft); }

.spc-mark { width: 84px; font-weight: 600; }
.spc-qty { width: 76px; text-align: right; font-variant-numeric: tabular-nums; }
.spc-tbl--spec .spc-unit { width: 92px; min-width: 0; }
.spc-price { width: 104px; text-align: right; font-variant-numeric: tabular-nums; }
.spc-price.is-own { color: var(--accent-fg); font-weight: 600; }
.spc-note { min-width: 160px; width: 100%; resize: none; overflow: hidden; line-height: 1.4; min-height: 32px; padding-top: var(--s-1); padding-bottom: var(--s-1); }
.spc-col-note { min-width: 180px; }
.spc-col-x { width: 1%; }
.spc-x { color: var(--text-faint); }
.spc-x:hover:where([data-hover="mouse"] *) { color: var(--late-fg); }
/* Убрать строку — видно при наведении на строку и с клавиатуры; на касании — всегда */
:root[data-hover="mouse"] .spc-line:not(:hover):not(:focus-within) .spc-x { opacity: 0; }

/* Вкладки спецификаций проекта */
.spc-tabs { display: flex; gap: var(--s-1); flex-wrap: wrap; margin-bottom: var(--s-2); }
.spc-tab {
  display: inline-flex; align-items: center; gap: var(--s-1); height: 32px; padding: 0 var(--s-3);
  border: 1px solid var(--border); border-radius: var(--radius-full); background: var(--surface);
  color: var(--text-dim); font: inherit; font-size: var(--t-sm); font-weight: 500; cursor: pointer;
}
.spc-tab:hover:where([data-hover="mouse"] *) { color: var(--text); background: var(--hover-solid); }
.spc-tab.is-active { background: var(--accent-soft); border-color: transparent; color: var(--accent-fg); font-weight: 600; }
.spc-tab__n { font-size: var(--t-2xs); color: var(--text-faint); }
.spc-tab--add { padding: 0 var(--s-2); }

/* Окно позиции */
.spc-form { display: grid; grid-template-columns: 200px 1fr; gap: var(--s-4); }
.spc-form__pic { display: flex; flex-direction: column; gap: var(--s-2); }
.spc-form__picbtns { display: flex; gap: var(--s-1); flex-wrap: wrap; }
.spc-form__fields { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.spc-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-2); }
.spc-pic {
  display: grid; place-items: center; width: 200px; height: 200px; border: 1px dashed var(--border-strong);
  border-radius: var(--radius); background: var(--surface-2); overflow: hidden;
}
.spc-pic img { width: 100%; height: 100%; object-fit: contain; }
.spc-hist { font-size: var(--t-sm); }
@media (max-width: 640px) {
  .spc-form { grid-template-columns: 1fr; }
  .spc-form__row { grid-template-columns: 1fr; }
  .spc-pic { width: 100%; }
}

/* Подбор из каталога */
.spc-pick { max-height: min(52vh, 480px); overflow: auto; border-radius: var(--radius); background: var(--surface-2); }
.spc-pick__row { display: grid; grid-template-columns: auto auto 1fr auto auto auto; align-items: center; gap: var(--s-3); padding: var(--s-2) var(--s-3); border-bottom: 1px solid var(--border); cursor: pointer; }
.spc-pick__row:last-child { border-bottom: 0; }
.spc-pick__row:hover:where([data-hover="mouse"] *) { background: var(--hover); }
.spc-pick__row.is-on { background: var(--accent-soft); }
.spc-pick__main { display: flex; flex-direction: column; min-width: 0; }
@media (max-width: 640px) { .spc-pick__row { grid-template-columns: auto auto 1fr; } .spc-pick__row > :nth-child(n+4) { display: none; } }

/* Категории */
.spc-cats { display: flex; flex-direction: column; gap: var(--s-1); max-height: 46vh; overflow: auto; margin-bottom: var(--s-3); }
.spc-cats__row { display: grid; grid-template-columns: 1fr 110px auto; gap: var(--s-2); align-items: center; }

/* Поставщики позиции в окне */
.spc-sups { display: flex; flex-direction: column; gap: var(--s-1); margin-bottom: var(--s-2); }
.spc-sups__row { display: grid; grid-template-columns: minmax(120px, 220px) 1fr auto; gap: var(--s-2); align-items: center; }
.spc-sups__name { font-weight: 600; font-size: var(--t-sm); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 640px) { .spc-sups__row { grid-template-columns: 1fr auto; } .spc-sups__row .input { grid-column: 1 / -1; order: 3; } }

/* Технички позиции */
.spc-files { display: flex; flex-direction: column; gap: var(--s-1); margin-bottom: var(--s-2); }
.spc-files__row { display: grid; grid-template-columns: auto 1fr auto auto auto; gap: var(--s-2); align-items: center; font-size: var(--t-sm); }
.spc-files__name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); }
a.spc-files__name:hover:where([data-hover="mouse"] *) { color: var(--accent-fg); }
.spc-clips { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-2); }
.spc-clip { display: inline-flex; align-items: center; gap: var(--s-05); max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--accent-fg); text-decoration: none; }
.spc-clip:hover:where([data-hover="mouse"] *) { text-decoration: underline; }

/* Окна импорта и повторов — шире обычного */
.modal.spc-imp-modal, .modal.spc-dups-modal { max-width: 1120px; width: min(1120px, calc(100vw - 32px)); max-height: 92dvh; }
.modal.spc-dups-modal { max-width: 860px; }
.spc-imp-modal .modal__foot { padding-top: var(--s-3); }
.spc-imp__foot { display: flex; align-items: center; gap: var(--s-2) var(--s-3); flex: 1; flex-wrap: wrap; min-width: 0; }

.spc-steps { display: flex; gap: var(--s-1); list-style: none; margin: 0 0 var(--s-3); padding: 0; counter-reset: шаг; flex-wrap: wrap; }
.spc-steps li { counter-increment: шаг; display: inline-flex; align-items: center; gap: var(--s-1); font-size: var(--t-sm); color: var(--text-faint); padding: var(--s-1) var(--s-3) var(--s-1) var(--s-1); border-radius: var(--radius-full); }
.spc-steps li::before { content: counter(шаг); display: grid; place-items: center; width: 22px; height: 22px; border-radius: var(--radius-full); background: var(--surface-2); font-size: var(--t-xs); font-weight: 600; }
.spc-steps li.is-on { color: var(--text); font-weight: 600; background: var(--accent-soft); }
.spc-steps li.is-on::before { background: var(--accent); color: var(--accent-ink); }
.spc-steps li.is-done { color: var(--text-dim); }
.spc-steps li.is-done::before { background: var(--ok-soft); color: var(--ok-fg); }

.spc-drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--s-2); text-align: center;
  min-height: 220px; padding: var(--s-6) var(--s-4); border: 2px dashed var(--border-strong); border-radius: var(--radius-lg);
  background: var(--surface-2); cursor: pointer; transition: border-color var(--fast), background var(--fast);
}
.spc-drop .muted { max-width: 54ch; font-size: var(--t-sm); }
.spc-drop__ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: var(--radius-full); background: var(--accent-soft); color: var(--accent-fg); }
.spc-drop:hover:where([data-hover="mouse"] *), .spc-drop.is-over, .spc-drop:focus-visible { border-color: var(--accent); background: var(--accent-soft); outline: none; }
.spc-drop.is-busy { cursor: progress; opacity: .7; }

.spc-imp__bar { display: flex; align-items: center; gap: var(--s-2) var(--s-3); flex-wrap: wrap; margin-bottom: var(--s-2); }
.spc-imp__file { display: inline-flex; align-items: center; gap: var(--s-1); font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.spc-imp__lbl { display: inline-flex; align-items: center; gap: var(--s-1); font-size: var(--t-sm); color: var(--text-dim); }
.spc-imp__hdr { width: 72px; }
.spc-imp__sum { display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-3); font-size: var(--t-sm); color: var(--text-dim); margin: var(--s-2) 0 0; }
.spc-imp__sum b { color: var(--text); font-variant-numeric: tabular-nums; }
.spc-imp__foot .spc-imp__sum { margin: 0; }
.spc-imp__prev { border: 1px solid var(--border); max-height: 46dvh; overflow: auto; }
.spc-tbl--prev { min-width: 0; font-size: var(--t-sm); }
.spc-tbl--prev td, .spc-tbl--prev th { padding: var(--s-1) var(--s-2); max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spc-tbl--prev thead th { position: sticky; top: 0; background: var(--surface); z-index: 1; }
.spc-tbl--prev thead tr + tr th { top: 40px; color: var(--text-dim); font-weight: 600; border-bottom: 1px solid var(--border); }
.spc-tbl--prev th.is-set { color: var(--text); }
.spc-map { min-width: 128px; }
.spc-map.is-set { border-color: var(--accent); background-color: var(--accent-soft); color: var(--accent-fg); font-weight: 500; }

/* Сопоставление: слева строка файла, справа решение */
.spc-match { display: flex; flex-direction: column; border-radius: var(--radius); background: var(--surface-2); max-height: 58dvh; overflow: auto; }
.spc-match__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: var(--s-3) var(--s-4); padding: var(--s-3); border-bottom: 1px solid var(--border); align-items: start; }
.spc-match__row:last-child { border-bottom: 0; }
.spc-match__row.is-skip, .spc-match__row.is-merged { opacity: .62; }
.spc-match__sec { padding: var(--s-2) var(--s-3); font-size: var(--t-xs); font-weight: 600; color: var(--text-dim); text-transform: uppercase; letter-spacing: .04em; background: var(--surface-3); }
.spc-match__file, .spc-match__cand { display: flex; gap: var(--s-2); align-items: flex-start; min-width: 0; }
.spc-match__main { display: flex; flex-direction: column; gap: var(--s-05); min-width: 0; flex: 1; overflow-wrap: anywhere; }
.spc-match__n { flex: none; min-width: 28px; font-size: var(--t-xs); color: var(--text-faint); font-variant-numeric: tabular-nums; padding-top: var(--s-05); }
.spc-match__mark { margin-right: var(--s-2); }
.spc-match__dec { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.spc-match__pick { width: 100%; }
.spc-match__cand { padding: var(--s-2); border-radius: var(--radius-sm); background: var(--surface); font-size: var(--t-sm); align-items: center; }
.spc-match__cand--new { color: var(--accent-fg); font-weight: 500; }
.spc-match__note { display: flex; align-items: center; gap: var(--s-1) var(--s-2); flex-wrap: wrap; font-size: var(--t-xs); color: var(--text-dim); }
.spc-match__note.is-dup { color: var(--text); cursor: pointer; }
.spc-match__note.is-have { color: var(--warn-fg); }
.spc-match__note .select { width: auto; }
@media (max-width: 760px) { .spc-match__row { grid-template-columns: 1fr; } }

/* Повторы каталога */
.spc-dups { display: flex; flex-direction: column; gap: var(--s-3); }
.spc-dups__sum { margin: 0; font-weight: 600; }
.spc-dupgrp { border-radius: var(--radius); background: var(--surface-2); padding: var(--s-2); display: flex; flex-direction: column; gap: var(--s-1); }
.spc-dupgrp__head { display: flex; align-items: center; gap: var(--s-2); padding: var(--s-1) var(--s-1) var(--s-2); }
.spc-dup { display: grid; grid-template-columns: auto auto auto minmax(0, 1fr) auto; gap: var(--s-3); align-items: center; padding: var(--s-2); border-radius: var(--radius-sm); background: var(--surface); }
.spc-dup.is-keep { box-shadow: inset 0 0 0 2px var(--accent); }
.spc-dup__keep, .spc-dup__merge { display: flex; flex-direction: column; align-items: center; gap: var(--s-05); cursor: pointer; }
.spc-dup__lbl { font-size: var(--t-2xs); color: var(--text-faint); }
.spc-dup__main { display: flex; flex-direction: column; gap: var(--s-05); min-width: 0; overflow-wrap: anywhere; }
.spc-dup__used { font-size: var(--t-xs); white-space: nowrap; }
@media (max-width: 640px) {
  .spc-dup { grid-template-columns: auto auto auto minmax(0, 1fr); }
  .spc-dup__used { grid-column: 4; }
}

/* ── Спецификация таблицей (владелец, 22.10.2026: «более табличный вид», строка не дёргается) ──
   Сетка ячеек, шапка на подложке, поля — сами ячейки (без рамок и пилюль: рамка — только у
   поля в фокусе, внутрь ячейки). Номер и ручка лежат друг на друге в одной ячейке постоянной
   ширины: при наведении номер гаснет, ручка проявляется — ничего не сдвигается. */
.spc-tbl.spc-tbl--spec { border-collapse: separate; border-spacing: 0; }
.spc-tbl--spec th, .spc-tbl--spec td { border-bottom: 1px solid var(--border); border-right: 1px solid var(--border); }
.spc-tbl--spec th:last-child, .spc-tbl--spec td:last-child { border-right: none; }
.spc-tbl.spc-tbl--spec th {
  position: sticky; top: 0; z-index: 2; background: var(--well);
  padding: var(--s-2) var(--s-3); vertical-align: middle;
}
.spc-tbl.spc-tbl--spec td { padding: var(--s-2) var(--s-3); vertical-align: top; }
.spc-tbl--spec tbody tr:last-child td { border-bottom-color: var(--border); }
.spc-tbl--spec td.spc-line__name, .spc-tbl--spec td.spc-sum { padding-top: var(--s-2); }
.spc-tbl--spec .spc-line:hover:where([data-hover="mouse"] *) { background: none; }
.spc-tbl--spec .spc-line:hover:where([data-hover="mouse"] *) td { background: color-mix(in oklab, var(--ink) 2.5%, var(--surface)); }
.spc-tbl--spec .spc-line.is-drag td { background: var(--accent-soft); }

/* Ячейки-поля: поле во всю ячейку */
.spc-tbl.spc-tbl--spec td.spc-c { padding: 0; height: 1px; }
.spc-tbl--spec td.spc-c > .input, .spc-tbl--spec td.spc-c > .select {
  display: block; width: 100%; height: 36px; min-height: 36px; min-width: 0; margin: 0;
  border: 0; border-radius: 0; background-color: transparent; box-shadow: none;
  padding: var(--s-2) var(--s-3); font: inherit; font-size: var(--t-sm); line-height: 1.4;
}
.spc-tbl--spec td.spc-c > .select { padding-right: var(--s-6); background-position: right var(--s-2) top 12px; }
.spc-tbl--spec td.spc-c > .input:focus, .spc-tbl--spec td.spc-c > .select:focus {
  outline: none; background-color: var(--surface); box-shadow: inset 0 0 0 2px var(--accent);
}
.spc-tbl--spec td.spc-c > .input::placeholder { color: var(--text-faint); opacity: 0; transition: opacity var(--fast); }
.spc-tbl--spec .spc-line:hover:where([data-hover="mouse"] *) td.spc-c > .input::placeholder,
.spc-tbl--spec td.spc-c > .input:focus::placeholder { opacity: 1; }
:root:not([data-hover="mouse"]) .spc-tbl--spec td.spc-c > .input::placeholder { opacity: 1; }
.spc-tbl--spec td.spc-c > :disabled { color: var(--text); -webkit-text-fill-color: var(--text); opacity: 1; background-image: none; }
.spc-tbl--spec td.spc-c > .spc-note { resize: none; overflow: hidden; }
.spc-tbl--spec td.spc-c > .spc-qty, .spc-tbl--spec td.spc-c > .spc-price { text-align: right; }
.spc-tbl--spec td.is-saving.spc-c > * { background-color: var(--surface-2); }
.spc-tbl--spec td.is-saved.spc-c > * { box-shadow: inset 0 0 0 1px var(--ok-fg); }
.spc-tbl--spec td.is-error.spc-c > * { box-shadow: inset 0 0 0 1px var(--late); background-color: var(--critical-soft); }
.spc-tbl--spec .spc-col-mark { width: 96px; }
.spc-tbl--spec .spc-col-qty { width: 84px; }
.spc-tbl--spec .spc-col-unit { width: 92px; }
.spc-tbl--spec .spc-col-price { width: 110px; }

/* Номер и ручка — одна ячейка, одно место */
.spc-tbl--spec td.spc-line__h { width: 44px; min-width: 44px; padding: 0; position: relative; vertical-align: top; }
.spc-tbl--spec .spc-n { display: block; line-height: 40px; min-width: 0; text-align: center; transition: opacity var(--fast); }
.spc-tbl--spec .spc-grip {
  display: grid; position: absolute; left: 50%; top: 4px; transform: translateX(-50%);
  opacity: 0; transition: opacity var(--fast);
}
.is-edit .spc-line:hover:where([data-hover="mouse"] *) .spc-grip, .is-edit .spc-line:focus-within .spc-grip, .is-edit .spc-line.is-drag .spc-grip { opacity: 1; }
.is-edit .spc-line:hover:where([data-hover="mouse"] *) .spc-n, .is-edit .spc-line:focus-within .spc-n, .is-edit .spc-line.is-drag .spc-n { opacity: 0; }
/* Касание: наведения нет — ручка видна всегда, номер под ней не нужен */
:root:not([data-hover="mouse"]) .is-edit .spc-grip { opacity: 1; }
:root:not([data-hover="mouse"]) .is-edit .spc-n { opacity: 0; }
.spc-tbl--spec td.spc-col-pic { padding: var(--s-1); width: 1%; }
.spc-tbl--spec td.spc-col-x { padding: var(--s-1); vertical-align: top; }
.spc-tbl--spec tfoot td { background: var(--well); }

/* Таблица во всю ширину рабочего поля: без скругления и боковых полей (как график закупок и стройки) */
.spc-tblwrap { border-radius: 0; border-top: 1px solid var(--border); }
/* Поле — по верху ячейки, на линии первой строки наименования; примечание растёт вниз */
.spc-tbl--spec td.spc-c > .spc-note { height: 100%; }
.spc-tbl--spec td.spc-c > .input:not(:focus):hover, .spc-tbl--spec td.spc-c > .select:not(:focus):hover { background-color: transparent; border: 0; box-shadow: none; }
.spc-tbl--spec td.spc-c > .select { background-position: right var(--s-2) center; }
.spc-tbl--spec .spc-n { line-height: 36px; }