/* Глобальные стили, перекрывающие/дополняющие Tailwind */

/* Базовые UI-токены — одна точка правды для повторяемых элементов системы.
   Нейтральная заливка и границы взяты из шапки «Претензии → Нарушители →
   Каталог магазинов», чтобы новые списки не собирали собственные оттенки. */
:root {
  --ui-surface: #ffffff;
  --ui-surface-subtle: #f8fafc;
  --ui-surface-muted: #f0f2f7;
  --ui-border: #e3e7ef;
  --ui-border-strong: #d3d9e4;
  --ui-text: #334155;
  --ui-text-muted: #59616f;
  --ui-text-soft: #8b93a2;
  --ui-accent: #4f46e5;
  --ui-accent-hover: #4338ca;
  --ui-accent-soft: #edeefc;
  --ui-accent-line: #c9caf6;
  --ui-filter-active: #4a5567;
  --ui-table-text-size: .8125rem;
  --ui-table-head-size: .6875rem;
  --ui-table-cell-x: .5rem;
  --ui-table-cell-y: .375rem;
  --ui-control-height-compact: 1.5rem;
  --ui-control-height-regular: 2.25rem;
  --ui-control-radius-compact: .45rem;
  --ui-control-radius-regular: .6rem;
}

/* Спокойная рабочая карточка — тот же визуальный принцип, что у основных
   панелей «Претензий»: нейтральная рамка и едва заметное отделение от фона.
   Общий селектор охватывает стандартные белые панели и оболочки таблиц по всему
   Moxar, но не поля, меню, модальные окна, пунктирные пустые состояния и цветные
   служебные блоки. */
.ui-work-panel,
main :where(div, section, article, form, details).bg-white.border.border-slate-200.rounded-xl:not(.border-dashed) {
  border: 1px solid var(--ui-border-strong);
  border-radius: 12px;
  background: var(--ui-surface);
  box-shadow: 0 2px 8px rgba(15, 23, 42, .05);
}

/* FBS · «Закрыта»: итоговая статистика — отдельная компактная карточка, а не
   ещё одна строка служебного текста над таблицей. */
/* ⭐ «Не взяты в поставку» — раскрытие тем же общим механизмом, что у соседних
   реестров (`wms-registry-toggle.js` переключает `.is-open`). Скрываем КЛАССОМ, а не
   атрибутом `hidden`: скрипт `hidden` не трогает, и такая панель не открылась бы
   никогда (поймано живой пробой 15.09). */
.fbs-not-taken-panel { display: none; }
.fbs-not-taken-panel.is-open { display: block; }

.fbs-history-summary {
  display: none;
  position: relative;
  margin-bottom: .55rem;
  padding: .48rem .75rem;
  overflow: hidden;
  border: 1px solid #e1e4f4;
  border-radius: 1rem;
  background:
    radial-gradient(circle at 100% 0, rgba(79, 70, 229, .1), transparent 34%),
    #fff;
  box-shadow: 0 6px 20px rgba(42, 50, 84, .06);
}
.fbs-history-summary.is-open {
  display: block;
}
.fbs-history-summary::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, #6366f1, #a78bfa);
}
.fbs-history-summary__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.fbs-history-summary__eyebrow {
  display: none;
}
.fbs-history-summary__title {
  margin: 0;
  color: #27324a;
  font-size: .86rem;
  font-weight: 700;
  line-height: 1.35;
}
.fbs-history-summary__rate {
  display: flex;
  align-items: baseline;
  gap: .25rem;
  flex: 0 0 auto;
  color: #697386;
  font-size: .67rem;
  white-space: nowrap;
}
.fbs-history-summary__rate b {
  color: #4f46e5;
  font-size: .96rem;
  line-height: 1;
}
.fbs-history-summary__metrics {
  display: grid;
  grid-template-columns: max-content max-content minmax(8rem, 1fr);
  align-items: center;
  gap: .3rem .85rem;
  margin-top: .28rem;
}
.fbs-history-summary__metric {
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  color: #697386;
  font-size: .67rem;
  white-space: nowrap;
}
.fbs-history-summary__metric b {
  color: #27324a;
  font-size: .82rem;
}
.fbs-history-summary__dot {
  width: .4rem;
  height: .4rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #94a3b8;
  box-shadow: 0 0 0 2px rgba(148, 163, 184, .13);
}
.fbs-history-summary__metric.is-success .fbs-history-summary__dot {
  background: #10b981;
  box-shadow: 0 0 0 2px rgba(16, 185, 129, .13);
}
.fbs-history-summary__metric.is-cancelled .fbs-history-summary__dot {
  background: #f43f5e;
  box-shadow: 0 0 0 2px rgba(244, 63, 94, .11);
}
.fbs-history-summary__bar {
  display: block;
  width: 100%;
  height: .38rem;
  padding: 0;
  overflow: hidden;
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: #f1dfe4;
}
.fbs-history-summary__bar::-webkit-progress-bar {
  border-radius: inherit;
  background: #f1dfe4;
}
.fbs-history-summary__bar::-webkit-progress-value {
  border-radius: inherit;
  background: linear-gradient(90deg, #34d399, #10b981);
}
.fbs-history-summary__bar::-moz-progress-bar {
  border-radius: inherit;
  background: linear-gradient(90deg, #34d399, #10b981);
}
.fbs-history-summary__reasons {
  display: flex;
  align-items: baseline;
  gap: .6rem;
  margin-top: .3rem;
  padding-top: .28rem;
  border-top: 1px solid #eef0f6;
}
.fbs-history-summary__reasons-label {
  padding-top: 0;
  color: #8b93a8;
  font-size: .63rem;
  font-weight: 400;
  line-height: 1.25;
  white-space: nowrap;
}
.fbs-history-summary__reason-list {
  display: block;
  min-width: 0;
  line-height: 1.25;
}
.fbs-history-summary__reason {
  display: inline-block;
  max-width: 100%;
  margin-right: .35rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #626b7c;
  font-size: .64rem;
  line-height: 1.25;
  white-space: nowrap;
}
.fbs-history-summary__reason b {
  color: #8b5c74;
  font-size: inherit;
  line-height: inherit;
  vertical-align: baseline;
}
.fbs-history-summary__note {
  margin-top: .6rem;
  color: #a16207;
  font-size: .63rem;
  line-height: 1.35;
}

@media (max-width: 640px) {
  .fbs-history-summary__reasons {
    display: none;
  }
  .fbs-history-summary {
    padding: .46rem .65rem .5rem;
    border-radius: .85rem;
  }
  .fbs-history-summary__head {
    align-items: center;
    gap: .55rem;
  }
  .fbs-history-summary__eyebrow {
    font-size: .58rem;
  }
  .fbs-history-summary__title {
    font-size: .8rem;
  }
  .fbs-history-summary__rate {
    gap: .2rem;
    font-size: .61rem;
  }
  .fbs-history-summary__rate b {
    font-size: .9rem;
  }
  .fbs-history-summary__metrics {
    grid-template-columns: max-content max-content 1fr;
    gap: .28rem .62rem;
    margin-top: .26rem;
  }
  .fbs-history-summary__metric {
    gap: .3rem;
    font-size: .68rem;
  }
  .fbs-history-summary__metric b {
    font-size: .76rem;
  }
}

/* ПОСТАВКИ = FBM + FBS. У всех вложенных таблиц одна спокойная шапка:
   белый фон вместо серой плашки, разделение — заметной светло-фиолетовой линией.
   Селектор начинается с tbody > .ship-detail, поэтому внешние реестры документов
   сохраняют системную серую шапку. */
:is(#ship-list, #fbs-supply-list)
  > tbody > tr.ship-detail:not(.hidden) table > thead,
:is(#ship-list, #fbs-supply-list)
  > tbody > tr.ship-detail:not(.hidden) table > thead > tr,
:is(#ship-list, #fbs-supply-list)
  > tbody > tr.ship-detail:not(.hidden) table > thead > tr > th {
  background: #fff;
}
:is(#ship-list, #fbs-supply-list)
  > tbody > tr.ship-detail:not(.hidden) table > thead > tr {
  border-bottom: 2px solid #ddd6fe;
  box-shadow: inset 0 -1px 0 rgb(79 70 229 / 8%);
}
:is(#ship-list, #fbs-supply-list)
  > tbody > tr.ship-detail:not(.hidden) table > thead > tr > th {
  border-top-color: transparent;
  border-bottom-color: transparent;
  color: #667085;
  font-weight: 650;
  letter-spacing: .035em;
}

@media (max-width: 640px) {
  /* ШК — отдельная строка ВНУТРИ блока артикула. Поздние уплотняющие правила
     обнуляли отступ и line-height, из-за чего цифры визуально ложились на артикул. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-article,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pack-product {
    min-width: 0;
    overflow: hidden;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-article > .fbs-pick-barcode-inline {
    display: flex !important;
    position: static !important;
    width: 100%;
    margin-top: .14rem !important;
    line-height: 1.2 !important;
    justify-content: flex-end;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pack-product > .fbs-pack-barcode {
    display: block !important;
    position: static !important;
    width: 100%;
    margin-top: .14rem !important;
    line-height: 1.2 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (min-width: 641px) {
  /* ⛔ Внешнему FBS-реестру нельзя `overflow-x: auto`: по CSS-контракту при
     горизонтальном `auto` вертикальный `visible` вычисляется как `auto`.
     Именно этот предок, а не сама внутренняя таблица, обрезал панель
     `путь · N` у последних заказов. Сам реестр `table-layout: fixed; width: 100%`,
     поэтому desktop-прокрутка ему не нужна; mobile ниже сам становится карточками. */
  .fbs-supply-list-wrap {
    overflow: visible !important;
  }

  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    min-width: 2rem;
    padding: .35rem !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception > span:not(.ui-system-icon) {
    display: none;
  }
}

@media (min-width: 641px) {
  /* Внутренние FBS-таблицы обязаны выглядеть одним реестром независимо от вида.
     `fbs-pack-table` отделена от мобильной экспериментальной сетки, но на desktop
     получает ровно ту же типографику, что поартикульная таблица. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table:is(.fbs-pick-table, .fbs-pack-table) > thead th {
    padding: .52rem .72rem;
    border-bottom: 1px solid #ececf3;
    background: var(--ui-surface-muted);
    color: #77798b;
    font-size: .62rem;
    font-weight: 600;
    line-height: 1.2;
    letter-spacing: .045em;
    text-transform: uppercase;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table:is(.fbs-pick-table, .fbs-pack-table) > tbody > tr > td {
    padding: .43rem .72rem;
    border-bottom: 0;
    color: #596579;
    font-size: .7rem;
    font-weight: 400;
    line-height: 1.25;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table:is(.fbs-pick-table, .fbs-pack-table) > tbody > tr + tr > td {
    border-top: 1px solid #f0f1f5;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table:is(.fbs-pick-table, .fbs-pack-table) > tbody > tr > td :is(span, b):not(.help) {
    font-size: inherit;
    line-height: inherit;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table:is(.fbs-pick-table, .fbs-pack-table) .fbs-pack-barcode,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table:is(.fbs-pick-table, .fbs-pack-table) .fbs-pick-barcode-inline {
    margin-top: .14rem;
    color: #94a3b8;
    font-family: inherit;
    font-size: .65rem;
    font-weight: 400;
    line-height: 1.2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table:is(.fbs-pick-table, .fbs-pack-table) td[data-label="Этикетка"] :is(span, b) {
    color: #596579;
    font-size: inherit;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table {
    table-layout: fixed;
    overflow: visible;
  }
  #fbs-supply-list table.fbs-pack-table :is(th, td):nth-child(1) { width: 12%; }
  #fbs-supply-list table.fbs-pack-table :is(th, td):nth-child(2) { width: 14%; }
  #fbs-supply-list table.fbs-pack-table :is(th, td):nth-child(3) { width: 14%; }
  #fbs-supply-list table.fbs-pack-table :is(th, td):nth-child(4) { width: 4%; }
  #fbs-supply-list table.fbs-pack-table :is(th, td):nth-child(5) { width: 14%; }
  #fbs-supply-list table.fbs-pack-table :is(th, td):nth-child(6) { width: 18%; }
  #fbs-supply-list table.fbs-pack-table :is(th, td):nth-child(7) { width: 24%; }
  #fbs-supply-list table.fbs-pack-table .fbs-pack-status {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  #fbs-supply-list table.fbs-pack-table--archive .fbs-pack-status .ui-status-dot {
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    white-space: normal;
  }
  #fbs-supply-list table.fbs-pack-table--archive .fbs-pack-status .ui-status-dot::before {
    /* Центр первой строки текста: при переносе align-items:center поставил бы точку
       посередине всего абзаца, а без сдвига она висела над «В доставке OZON». */
    margin-top: calc((1.2em - .38rem) / 2);
  }
  #fbs-supply-list table.fbs-pack-table--archive .fbs-order-status-text {
    min-width: 0;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  #fbs-supply-list table.fbs-pack-table--bypack
    td.fbs-order-state-cell > .ui-status-dot {
    display: flex;
  }
  /* История заказа раскрывается поверх реестра, не меняя геометрию строки.
     Иначе высокая ячейка статуса пересчитывает baseline всей таблицы: номер,
     артикул, количество и действия визуально «едут» при каждом раскрытии. */
  #fbs-supply-list table.fbs-pack-table .fbs-order-path {
    position: relative;
    width: max-content;
    max-width: 100%;
    /* Убираем утилитный mt-1: после блочного статуса естественный межстрочный
       просвет уже совпадает с компактной парой «артикул → ШК». */
    margin-top: 0 !important;
  }
  #fbs-supply-list table.fbs-pack-table .fbs-order-path[open] {
    z-index: 12;
  }
  #fbs-supply-list table.fbs-pack-table .fbs-order-path-panel {
    position: absolute;
    z-index: 12;
    top: 100%;
    right: 0;
    width: max-content;
    min-width: 13rem;
    max-width: 20rem;
    margin-top: .28rem !important;
    padding: .5rem .62rem !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: .5rem;
    background: #fff;
    box-shadow: 0 8px 22px rgb(15 23 42 / 12%);
  }
  #fbs-supply-list table.fbs-pack-table td.fbs-order-actions {
    display: table-cell !important;
    min-width: 0;
    vertical-align: middle;
    text-align: right;
    white-space: nowrap;
  }
}

/* Нативные controls используют тот же акцент, что кнопки и активная навигация,
   а не браузерный синий по умолчанию. */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--ui-accent);
}

/* Главная: единый визуальный слой для уже доступных пользователю разделов.
   Состав карточек по-прежнему определяют существующие права в шаблоне. */
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
}
.dashboard-card {
  --dashboard-tone: var(--ui-accent);
  --dashboard-tone-soft: var(--ui-accent-soft);
  --dashboard-tone-line: var(--ui-accent-line);
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 8.5rem;
  flex-direction: column;
  overflow: hidden;
  padding: .9rem;
  border: 1px solid var(--ui-border);
  border-radius: .9rem;
  background: linear-gradient(135deg, #fff 0%, var(--dashboard-tone-soft) 100%);
  box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
  color: var(--ui-text);
  text-decoration: none;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.dashboard-card:hover {
  transform: translateY(-2px);
  border-color: var(--dashboard-tone-line);
  box-shadow: 0 8px 22px rgb(15 23 42 / 8%);
}
.dashboard-card:focus-visible {
  outline: 2px solid var(--dashboard-tone);
  outline-offset: 2px;
}
.dashboard-card-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
}
.dashboard-card-icon {
  display: inline-flex;
  width: 2.25rem;
  height: 2.25rem;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border-radius: .7rem;
  background: var(--dashboard-tone-soft);
  color: var(--dashboard-tone);
}
.dashboard-card-icon svg {
  width: 1.2rem;
  height: 1.2rem;
}
.dashboard-card-arrow {
  display: inline-flex;
  width: 1.8rem;
  height: 1.8rem;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  border: 1px solid #e8ecf2;
  border-radius: 999px;
  background: #fff;
  color: #94a3b8;
  transition: color .16s ease, border-color .16s ease, transform .16s ease;
}
.dashboard-card-arrow svg {
  width: .95rem;
  height: .95rem;
}
.dashboard-card:hover .dashboard-card-arrow {
  transform: translateX(2px);
  border-color: var(--dashboard-tone-line);
  color: var(--dashboard-tone);
}
.dashboard-card-kicker {
  margin-top: .7rem;
  color: #7c8798;
  font-size: .65rem;
  font-weight: 600;
  letter-spacing: .045em;
  line-height: 1.2;
  text-transform: uppercase;
}
.dashboard-card-value {
  margin-top: .2rem;
  color: #1e293b;
  font-size: 1.55rem;
  font-weight: 550;
  letter-spacing: -.025em;
  line-height: 1.1;
}
.dashboard-card-value > span {
  margin-left: .28rem;
  color: #94a3b8;
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: 0;
}
.dashboard-card.is-action .dashboard-card-value {
  font-size: 1.12rem;
  font-weight: 600;
  letter-spacing: -.015em;
}
.dashboard-card-note {
  margin-top: auto;
  padding-top: .5rem;
  color: #9aa6b5;
  font-size: .68rem;
  line-height: 1.25;
}
.dashboard-card--purchases {
  --dashboard-tone: #a16207;
  --dashboard-tone-soft: #fff8e8;
  --dashboard-tone-line: #ead3a4;
}
.dashboard-card--subsort {
  --dashboard-tone: #0f766e;
  --dashboard-tone-soft: #ecfdf9;
  --dashboard-tone-line: #a7ded5;
}
.dashboard-card--refs {
  --dashboard-tone: #526174;
  --dashboard-tone-soft: #f1f5f9;
  --dashboard-tone-line: #cbd5e1;
}
.dashboard-card--reports {
  --dashboard-tone: #7c3aed;
  --dashboard-tone-soft: #f5f3ff;
  --dashboard-tone-line: #d8ccfb;
}

@media (max-width: 359px) {
  .dashboard-grid { grid-template-columns: 1fr; }
}
@media (min-width: 640px) {
  .dashboard-grid { gap: 1rem; }
  .dashboard-card {
    min-height: 9rem;
    padding: 1rem 1.05rem;
  }
}
@media (min-width: 900px) {
  .dashboard-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Системный accent — индиго из кнопки «Добавить нарушителя». Старые шаблоны
   используют собранные Tailwind-классы blue-*; переопределяем их здесь один раз,
   чтобы кнопки, ссылки, выбранные страницы и focus-состояния не перекрашивать
   вручную в сотне шаблонов. Брендовые цвета маркетплейсов задаются отдельными
   mp-классами и в эту палитру не входят. */
.bg-blue-600 { background-color: var(--ui-accent); }
.hover\:bg-blue-700:hover { background-color: var(--ui-accent-hover); }
.text-blue-600 { color: var(--ui-accent); }
.hover\:text-blue-600:hover { color: var(--ui-accent); }
.text-blue-700,
.hover\:text-blue-700:hover { color: var(--ui-accent-hover); }
.text-blue-800 { color: #3730a3; }
.text-blue-900 { color: #312e81; }
.bg-blue-50 { background-color: var(--ui-accent-soft); }
.bg-blue-100 { background-color: #e0e1fa; }
.bg-blue-50\/50 { background-color: rgb(237 238 252 / .5); }
.bg-blue-50\/40 { background-color: rgb(237 238 252 / .4); }
.hover\:bg-blue-50:hover { background-color: var(--ui-accent-soft); }
.hover\:bg-blue-100:hover { background-color: #e0e1fa; }
.border-blue-600,
.border-blue-500,
.border-blue-400,
.border-blue-300,
.border-blue-200 { border-color: var(--ui-accent-line); }
.hover\:border-blue-400:hover,
.hover\:border-blue-300:hover { border-color: var(--ui-accent); }
.focus\:border-blue-400:focus { border-color: var(--ui-accent); }
.focus\:ring-blue-200:focus,
.focus\:ring-blue-400:focus { --tw-ring-color: var(--ui-accent-line); }

/* ⚠️ `text-rose-900` — в собранном `app.css` класса НЕТ (сборка статическая, последняя —
   11.07.2026), а четыре шаблона склада красят им текст тревожной плашки: закрытие приёмки
   (`wms/_receiving_closing_ask.html`), поставка Ozon, FBS, список инвентаризаций. Без
   правила текст выходил обычным тёмно-серым. Значение — rose-900 палитры Tailwind.
   ⛔ Полная пересборка `app.css` здесь не лечение: она разом включает около ста «спящих»
   классов по всей системе (замер 12.10.2026: +99 / −59) — это отдельное решение о виде
   многих экранов, а не правка одного цвета. */
.text-rose-900 { color: #881337; }

html { scrollbar-gutter: stable; }

#topnav {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 40;
}

/* Верхняя строка одинаково компактна на desktop и mobile. Логотип и зоны нажатия
   аккаунта не уменьшаем: высоту снимаем только с лишнего вертикального воздуха. */
#topnav > header {
  min-height: 3.75rem;
  padding-top: .375rem;
  padding-bottom: .375rem;
}
.topnav-page-title { display: none; }

/* Desktop: основные разделы читаются как одна спокойная панель навигации,
   а не как строка разрозненных ссылок. Ссылки и dropdown-механика не меняются. */
@media (min-width: 768px) {
  /* Desktop: бренд, рабочие разделы и аккаунт живут в одной верхней полосе.
     `display: contents` раскрывает детей header в общий flex-контейнер, не меняя
     мобильную DOM-структуру и единый partial компании/пользователя. */
  #topnav {
    display: flex;
    min-height: 3.75rem;
    align-items: center;
    gap: .75rem;
    padding: 0 1.5rem;
    border-bottom: 1px solid var(--ui-border);
    background: #fff;
  }
  #topnav > header { display: contents; }
  .topnav-brand {
    order: 1;
    flex: 0 0 auto;
  }
  .topnav-account-desktop {
    order: 3;
    flex: 0 0 auto;
  }
  #mnav {
    order: 2;
    min-width: 0;
    flex: 1 1 auto;
    padding: .35rem 0;
    border-bottom: 0;
    background: transparent;
  }
  #mnav [data-mobile-modules] {
    column-gap: .18rem;
    row-gap: .25rem;
  }
  #mnav [data-mobile-modules] > a[data-mobile-module],
  #mnav [data-mobile-modules] > details[data-mobile-module] > summary {
    display: inline-flex;
    min-height: 2rem;
    align-items: center;
    justify-content: center;
    gap: .28rem;
    padding: 0 .64rem;
    border: 1px solid transparent;
    border-radius: .62rem;
    color: var(--ui-text-muted);
    font-size: .8125rem;
    font-weight: 500;
    line-height: 1;
    transition: background-color .16s ease, border-color .16s ease, color .16s ease;
  }
  #mnav [data-mobile-modules] > a[data-mobile-module]:hover,
  #mnav [data-mobile-modules] > details[data-mobile-module] > summary:hover,
  #mnav [data-mobile-modules] > details[data-mobile-module][open] > summary {
    border-color: #edf0f5;
    background: #f8fafc;
    color: var(--ui-accent);
  }
  #mnav [data-mobile-modules] > a[data-mobile-active="true"],
  #mnav [data-mobile-modules] > details[data-mobile-active="true"] > summary {
    border-color: var(--ui-accent-line);
    background: linear-gradient(135deg, #fff 0%, var(--ui-accent-soft) 100%);
    color: var(--ui-accent);
    font-weight: 600;
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > summary > svg:last-child {
    width: .65rem;
    height: .65rem;
    margin-top: 0;
    opacity: .42;
    transition: transform .16s ease, opacity .16s ease;
  }
  #mnav [data-mobile-modules] > details[data-mobile-module][open] > summary > svg:last-child {
    opacity: .7;
  }
  #mnav [data-mobile-modules] > details[data-mobile-key="settings"] > summary > svg {
    width: .92rem;
    height: .92rem;
    opacity: .72;
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > div,
  #mnav .nav-sub {
    margin-top: .4rem;
    padding: .38rem;
    max-height: calc(100dvh - var(--topnav-h, 0px) - .75rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
    border-color: var(--ui-border);
    border-radius: .82rem;
    background: #fff;
    box-shadow: 0 12px 28px rgb(15 23 42 / 10%), 0 2px 7px rgb(15 23 42 / 5%);
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > div > a,
  #mnav [data-mobile-modules] > details[data-mobile-module] > div > span[aria-disabled],
  #mnav [data-mobile-modules] > details[data-mobile-module] > div .nav-group-title,
  #mnav .nav-sub > a {
    min-height: 2.15rem;
    padding: .48rem .65rem;
    border-radius: .5rem;
    color: var(--ui-text);
    font-size: .8125rem;
    font-weight: 450;
    line-height: 1.15;
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > div > a:hover,
  #mnav [data-mobile-modules] > details[data-mobile-module] > div .nav-group-title:hover,
  #mnav .nav-sub > a:hover {
    background: var(--ui-surface-subtle);
    color: var(--ui-accent);
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > div > span[aria-disabled] {
    color: var(--ui-text-soft);
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > div > div.border-t {
    margin: .3rem .35rem;
    border-color: var(--ui-border);
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > div > div.text-xs {
    padding: .5rem .65rem .22rem;
    color: var(--ui-text-soft);
    font-size: .62rem;
    font-weight: 650;
    letter-spacing: .055em;
  }
  #mnav [data-mobile-modules] > details[data-mobile-module] > div .nav-group-title > svg {
    width: .6rem;
    height: .6rem;
    opacity: .4;
  }
}

/* Компания и пользователь — ОДНИ и те же элементы шапки на desktop/mobile. */
.mobile-tenant > summary,
.mobile-user > summary { list-style: none; }
.mobile-tenant > summary::-webkit-details-marker,
.mobile-user > summary::-webkit-details-marker { display: none; }
.mobile-tenant-summary { min-height: 2.5rem; }
.mobile-tenant-summary:hover,
.mobile-user-summary:hover { background: #f8fafc; }
.mobile-tenant-name {
  max-width: 5.75rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mobile-user-summary { width: 2.5rem; height: 2.5rem; }
.mobile-popover-panel {
  position: absolute;
  top: calc(100% + .5rem);
  z-index: 50;
  max-height: calc(100dvh - 5rem);
  overflow-y: auto;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .12), 0 2px 7px rgba(15, 23, 42, .07);
}
.mobile-tenant-panel,
.mobile-user-panel { right: 0; width: min(13.75rem, calc(100vw - 1rem)); }
.mobile-add-company:disabled { cursor: not-allowed; opacity: .65; }
.mobile-dropdown-arrow { transition: transform .16s ease; }
.mobile-tenant[open] .mobile-dropdown-arrow { transform: rotate(180deg); }

/* Общий flash после POST: плавает поверх страницы и не меняет её геометрию. */
.ui-flash-toast {
  position: fixed;
  top: calc(var(--topnav-h, 0px) + .75rem);
  left: 50%;
  z-index: 70;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: .625rem;
  width: fit-content;
  max-width: min(25rem, calc(100vw - 2rem));
  min-height: 3rem;
  padding: .625rem .625rem .625rem .75rem;
  border: 1px solid;
  border-radius: .75rem;
  font-size: .8125rem;
  line-height: 1.35;
  box-shadow: 0 14px 36px rgba(15, 23, 42, .14), 0 2px 8px rgba(15, 23, 42, .07);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  opacity: 1;
  transform: translateX(-50%) translateY(0);
  transition: opacity .24s ease, transform .24s ease;
}
.ui-flash-toast.is-success {
  border-color: rgba(203, 213, 225, .8);
  background: rgba(255, 255, 255, .72);
  color: #334155;
}
.ui-flash-toast.is-error {
  border-color: rgba(203, 213, 225, .8);
  background: rgba(255, 255, 255, .72);
  color: #334155;
}
.ui-flash-icon {
  display: grid;
  width: 1.25rem;
  height: 1.25rem;
  place-items: center;
  border-radius: 999px;
}
.ui-flash-icon::before {
  content: "";
  width: .75rem;
  height: .75rem;
  background: #fff;
  -webkit-mask: center / contain no-repeat;
  mask: center / contain no-repeat;
}
.ui-flash-toast.is-success .ui-flash-icon { background: #10b981; }
.ui-flash-toast.is-success .ui-flash-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='black' d='M7.7 14.3 3.4 10l1.4-1.4 2.9 2.9 7.5-7.5 1.4 1.4z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='black' d='M7.7 14.3 3.4 10l1.4-1.4 2.9 2.9 7.5-7.5 1.4 1.4z'/%3E%3C/svg%3E");
}
.ui-flash-toast.is-error .ui-flash-icon { background: #ef4444; }
.ui-flash-toast.is-error .ui-flash-icon::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='black' d='M9 4h2v8H9zm0 10h2v2H9z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='black' d='M9 4h2v8H9zm0 10h2v2H9z'/%3E%3C/svg%3E");
}
.ui-flash-text {
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: pre-line;
}
.ui-close-icon {
  position: relative;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border: 0;
  border-radius: .5rem;
  background: transparent;
  color: currentColor;
  cursor: pointer;
  opacity: .58;
}
.ui-close-icon:hover { background: rgba(15, 23, 42, .06); opacity: .9; }
.ui-close-icon:focus-visible {
  outline: 2px solid var(--ui-accent);
  outline-offset: 1px;
}
.ui-close-icon::before,
.ui-close-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: .75rem;
  height: 1.5px;
  border-radius: 999px;
  background: currentColor;
}
.ui-close-icon::before { transform: translate(-50%, -50%) rotate(45deg); }
.ui-close-icon::after { transform: translate(-50%, -50%) rotate(-45deg); }
[data-flash].flash-dismissing {
  opacity: 0;
  transform: translateX(-50%) translateY(-.5rem);
  pointer-events: none;
}
[data-flash].flash-dismissed { display: none; }

@media (max-width: 480px) {
  .ui-flash-toast {
    top: calc(var(--topnav-h, 0px) + .5rem);
    align-items: start;
    width: calc(100vw - 1rem);
    max-width: calc(100vw - 1rem);
  }
}

[data-nm-row].duplicate-main-row-removing {
  opacity: 0;
  transition: opacity 0.2s ease;
}

/* Приёмка: жёлтый буфер — компактная оперативная сводка с собственной
   двухуровневой компоновкой вместо мобильных карточек из табличных строк. */
.receiving-buffer {
  margin-bottom: 1rem;
  padding: .75rem;
}
.receiving-buffer-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .75rem;
  margin-bottom: .5rem;
}
.receiving-buffer-heading {
  display: flex;
  min-width: 0;
  align-items: center;
  flex-wrap: wrap;
  gap: .25rem .5rem;
}
.receiving-buffer-title {
  color: #92400e;
  font-size: .8125rem;
  font-weight: 650;
  line-height: 1.25;
}
.receiving-buffer-note {
  color: #a16207;
  font-size: .6875rem;
  line-height: 1.25;
}
.receiving-buffer-action { flex: 0 0 auto; }
.receiving-buffer-list { border-top: 1px solid #fcd34d; }
.receiving-buffer-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(7rem, 12rem) auto;
  align-items: center;
  gap: .5rem .75rem;
  padding: .4rem 0;
  border-bottom: 1px solid rgba(252, 211, 77, .65);
}
.receiving-buffer-row:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.receiving-buffer-identity {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: .6rem;
}
.receiving-buffer-sku {
  flex: 0 0 auto;
  color: #78350f;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: .75rem;
  font-weight: 650;
  line-height: 1.2;
}
.receiving-buffer-category,
.receiving-buffer-warehouse {
  min-width: 0;
  color: #92400e;
  font-size: .7rem;
  line-height: 1.2;
}
.receiving-buffer-warehouse { color: #a16207; }
.receiving-buffer-place { display: contents; }
.receiving-buffer-qty {
  padding: .1rem .4rem;
  border-radius: 999px;
  background: #fde68a;
  color: #78350f;
  font-size: .75rem;
  font-weight: 650;
  line-height: 1.2;
  white-space: nowrap;
}
.receiving-mobile-break,
.party-arrival-mobile-break { display: none; }
.party-arrival-label-mobile { display: none; }
#sum-fact {
  display: inline-block;
  margin-left: .25rem;
}
.rcv-summary-detail { flex-basis: 100%; }
#rcv-summary { color: #64748b; }
#rcv-summary :is(#sum-plan, #sum-fact) { color: #475569 !important; }
#rcv-summary #sum-detail { opacity: .84; }

@media (min-width: 768px) {
  [data-wms-receiving] #rcv-drop {
    min-height: 0;
    flex-direction: row;
    justify-content: center;
    gap: .5rem;
    padding: .55rem .75rem;
  }
  [data-wms-receiving] #rcv-drop .receiving-import-note::before {
    content: "· ";
  }
  .receiving-form-heading-row {
    display: flex;
    min-width: 0;
    align-items: baseline;
    gap: 1rem;
  }
  .receiving-form-title {
    flex: 0 0 auto;
    margin-top: 0;
    white-space: nowrap;
  }
  .receiving-form-meta {
    min-width: 0;
    margin-top: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .receiving-location-bar {
    flex-wrap: nowrap;
    align-items: center;
    padding: .65rem .75rem;
  }
  .receiving-location-field {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .5rem;
  }
  .receiving-location-field + .receiving-location-field {
    margin-left: .75rem;
  }
  .receiving-location-field > label {
    flex: 0 0 auto;
    margin-bottom: 0;
    white-space: nowrap;
  }
  #rcv-summary {
    flex-wrap: nowrap;
    column-gap: 1rem;
  }
  #rcv-summary > span:not(#sum-detail) {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  #rcv-summary #sum-detail {
    min-width: 0;
    flex: 1 1 0%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  [data-wms-receiving] .item-block {
    display: grid;
    grid-template-columns: minmax(14rem, 16rem) minmax(0, 1fr);
    align-items: start;
    gap: .75rem;
    padding: .65rem .75rem;
  }
  [data-wms-receiving] .item-block + .item-block { margin-top: .5rem !important; }
  /* ⛔ На ПК подписи полей НЕ нужны — их роль играет шапка колонок; показанные, они
     дублировали бы её (см. `.rcv-field-label` в мобильном блоке ниже). */
  [data-wms-receiving] .rcv-field-label { display: none; }
  /* ⚠️ Обёртка «подпись + поле» на ПК не должна менять раскладку: подписи скрыты, и она
     обязана вести себя как само поле — иначе строка мест разъедется там, где вчера была
     выверена под колонки шапки. */
  [data-wms-receiving] .placement-row > .rcv-field { display: contents; }
  [data-wms-receiving] .item-head {
    align-self: stretch;
    gap: .5rem;
    cursor: default;
  }
  [data-wms-receiving] .item-head > .min-w-0 {
    display: flex;
    min-height: 100%;
    flex-direction: column;
    align-self: stretch;
  }
  [data-wms-receiving] .item-head .font-mono { font-size: .8125rem; }
  [data-wms-receiving] .item-head .text-sm {
    font-size: .75rem;
    line-height: 1.2;
  }
  [data-wms-receiving] .item-head .text-xs {
    font-size: .6875rem;
    line-height: 1.2;
  }
  [data-wms-receiving] .item-head .receiving-item-plan {
    margin-top: auto !important;
    padding-top: .5rem;
    font-family: inherit;
    font-weight: 400;
  }
  [data-wms-receiving] .item-head .receiving-item-plan b {
    font-weight: 400;
  }
  [data-wms-receiving] .item-head .item-chev { display: none; }
  /* ⭐⭐ ПОСЛЕ ПЕРЕХОДА НА ВВОД В ШТУКАХ СЕТКА ОДНОКОЛОНОЧНАЯ (владелец 01.09).
     ⛔ Прежде первая колонка (128 px) держала переключатель «штучно / коробами». Его больше
     нет, и колонка осталась бы пустой дырой, в которую живая проверка 01.09 уронила сводку
     «уже принято»: 128 px из 938, адрес места ломался на семь строк. */
  [data-wms-receiving] .item-body {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    min-width: 0;
    margin-top: 0;
    font-size: .75rem;
  }
  [data-wms-receiving] .receiving-item-hint {
    margin-top: .3rem;
    font-size: .6875rem;
    line-height: 1.25;
  }
  /* Порядок строк задаёт сама разметка: сводка «уже принято» → места → итог → брак.
     ⛔ Явные `grid-row` убраны намеренно: с ними два блока садились в одну строку и
     накладывались друг на друга (живая проверка 01.09). */
  [data-wms-receiving] .item-body .placements { margin-top: 0; }
  [data-wms-receiving] .item-body .receiving-item-done { margin: 0 0 .4rem; }
  [data-wms-receiving] .item-body .placements > .text-xs { margin-bottom: .2rem; }
  [data-wms-receiving] .item-body .placements > .text-xs > :first-child {
    flex: 0 0 14rem;
  }
  [data-wms-receiving] .item-body .placements > .text-xs > .unit-head {
    width: 6rem !important;
    flex: 0 0 6rem;
    white-space: nowrap;
  }
  [data-wms-receiving] .item-body .placement-row {
    gap: .5rem;
    margin-bottom: .35rem;
  }
  /* ⛔ Правила `.is-box-method` и `.carton-sel` удалены вместе с режимом «коробами» и
     селектом типа короба (владелец 01.09: ввод всегда в штуках). Оставленные, они были бы
     мёртвым каскадом, который однажды переопределит живую раскладку. */
  [data-wms-receiving] .placement-row > .ss-wrap:has(> .loc-sel) {
    width: 14rem !important;
    max-width: 14rem;
    flex: 0 0 14rem !important;
  }
  [data-wms-receiving] .placement-row > .flex:last-child {
    flex: 0 0 8rem;
  }
  [data-wms-receiving] .item-body :is(select, input:not([type="radio"]):not([type="checkbox"])) {
    height: 2.25rem;
    min-height: 2.25rem;
    padding: .45rem .65rem;
    border-color: #cfd6e2;
    border-radius: .6rem;
    font-size: .78rem;
  }
  [data-wms-receiving] .item-body select:not([multiple]):not([size]),
  [data-wms-receiving] .item-body .ss-field {
    height: var(--ui-dropdown-height);
    min-height: var(--ui-dropdown-height);
    padding: .35rem .65rem;
    font-size: .78rem;
  }
  [data-wms-receiving] .receiving-item-footer {
    margin-top: .25rem;
    font-size: .75rem;
  }
  .receiving-tools-row {
    display: block;
  }
  .receiving-tools-row.has-buffer {
    display: grid;
    grid-template-columns: minmax(0, 38rem) minmax(20rem, 1fr);
    align-items: end;
    gap: .75rem;
  }
  .receiving-buffer {
    width: min(100%, 38rem);
    min-width: 0;
    flex: 0 1 38rem;
  }
  .receiving-tools-row > form {
    width: 100%;
    max-width: 20rem;
    align-self: end;
    justify-self: end;
    margin-right: 0;
    margin-bottom: 1rem;
    margin-left: auto;
  }
  .receiving-tools-row.has-buffer > form { grid-column: 2; }
  .receiving-party-heading {
    display: flex;
    min-width: 0;
    align-items: baseline;
    gap: .75rem;
    margin-bottom: .4rem;
    white-space: nowrap;
  }
  .receiving-party-code,
  .receiving-party-owner { flex: 0 0 auto; }
  .receiving-party-supplier { min-width: 0; }
  .receiving-party-meta-line {
    display: flex;
    align-items: baseline;
    gap: 1.5rem;
    margin-bottom: .4rem;
    white-space: nowrap;
  }
  .receiving-party-audit { margin-top: 0; }
}

@media (max-width: 767px) {
  .receiving-form-customs {
    display: block;
    margin-top: .15rem;
    margin-left: 0 !important;
    color: #94a3b8;
    font-size: .625rem;
    font-weight: 400;
    line-height: 1.2;
  }
  .receiving-form-customs b {
    color: inherit;
    font-weight: 400;
  }
  .receiving-location-bar {
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    align-items: end;
    gap: .5rem;
    padding: .55rem .6rem;
  }
  .receiving-location-field { min-width: 0; }
  .receiving-location-field > label {
    overflow: hidden;
    margin-bottom: .2rem;
    font-size: .58rem;
    line-height: 1.15;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .receiving-location-note,
  .receiving-import-note { display: none; }
  .receiving-import-card {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: .35rem;
    padding: .5rem .6rem;
  }
  .receiving-import-head { display: contents; }
  .receiving-import-copy { display: none; }
  .receiving-template-download {
    min-width: 0;
    flex: 0 1 auto;
    font-size: .7rem;
  }
  .receiving-import-form {
    min-width: 0;
    flex: 0 0 auto;
    margin-top: 0 !important;
  }
  [data-wms-receiving] #rcv-drop {
    min-height: 1.875rem;
    flex-direction: row;
    padding: 0;
    border: 0;
    background: transparent;
    white-space: nowrap;
  }
  [data-wms-receiving] #rcv-drop > .text-sm { font-size: .7rem; }
  .receiving-drop-desktop { display: none; }
  [data-wms-receiving] .item-block {
    padding: .55rem .6rem;
    border-radius: .65rem;
  }
  [data-wms-receiving] .item-block + .item-block { margin-top: .4rem !important; }
  [data-wms-receiving] .item-head { gap: .4rem; }
  /* ⭐⭐ АРТИКУЛ И СТАТУС — РАЗНЫМИ СТРОКАМИ НА ТЕЛЕФОНЕ (владелец 02.09: «наезжает»).
     ⛔ Статус лежит ВНУТРИ строки артикула (`ml-1`), и на узком экране длинный артикул с
     ним не помещается: живой замер 02.09 — артикул занимал 19–330 px, статус «135 из 30
     (+105)» 113–214 px, то есть статус ложился ПОВЕРХ артикула. Уменьшать кегль здесь
     нельзя (артикул — рабочий номер, его читают глазами у полки), поэтому разводим их по
     строкам: `display:block` у статуса и своя строка вместо приклейки. */
  [data-wms-receiving] .item-head .font-mono {
    font-size: .8rem;
    line-height: 1.2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .1rem;
  }
  [data-wms-receiving] .item-head .item-status {
    margin-left: 0 !important;
    font-size: .68rem;
  }
  [data-wms-receiving] .item-head .text-sm {
    font-size: .72rem;
    line-height: 1.2;
  }
  [data-wms-receiving] .item-head .receiving-item-plan {
    margin-top: .18rem !important;
    font-size: .65rem;
    line-height: 1.2;
  }
  [data-wms-receiving] .item-body { margin-top: .45rem; }
  [data-wms-receiving] .item-body .placements { margin-top: .35rem; }
  /* ⭐⭐⭐ ПОДПИСИ ПОЛЕЙ — ТОЛЬКО НА ТЕЛЕФОНЕ (владелец 02.09: «где указать кратность
     короба?»). Шапка колонок скрыта на узком экране, а плейсхолдер у ЗАПОЛНЕННОГО поля не
     виден — человек видит два безымянных числа подряд и не знает, какое из них что.
     ⛔ Своим классом, а не утилитами Tailwind: `sm:hidden`, `-mb-1` и `text-[.65rem]` в
     статической сборке ОТСУТСТВУЮТ (проверено grep-ом), и подпись вылезла бы на ПК рядом с
     колонками — то есть дважды. Тот же капкан, что ловился десятки раз. */
  /* ⚠️ Точек перелома в этой форме ДВЕ, и это ловушка проекта: шапка колонок скрывается на
     640 px (`hidden sm:flex`), а мобильные правила начинаются с 767. В зазоре 640–767
     подпись обязана быть видна — там шапки уже нет. Поэтому показываем её во всём этом
     медиа-блоке, а прячем ТОЛЬКО на ПК (правило выше, min-width: 768). */
  /* ⛔⛔ СТРОКА МЕСТА — GRID ИЗ ДВУХ КОЛОНОК, и подпись без явной ячейки садится СОСЕДОМ
     поля, а не над ним (живая проверка 02.09: «КРАТНОСТЬ КОРОБА, ШТ» встала справа от
     своего поля, «ПРИНЯТО, ШТ» — слева от чужого). Прижимаем каждую подпись к своей
     колонке и к своей строке: кратность и её поле — слева, количество и его — справа. */
  [data-wms-receiving] .rcv-field-label {
    display: block;
    /* ⚠️ Подпись прижата к СВОЕМУ полю (владелец 02.09: «отступы после кратность короба и
       принято до полей ввода не красивые»). Сетка строки уже даёт `gap`, и он складывался
       с зазором подписи — та висела посередине между своим полем и предыдущим рядом,
       читаясь как подпись к чужой строке. */
    margin: 0 0 .1rem .15rem;
    font-size: .65rem;
    line-height: 1.1;
    text-transform: uppercase;
    color: #94a3b8;
  }
  /* Пара «подпись + поле» — единый блок: своего зазора внутри у неё нет. */
  [data-wms-receiving] .placement-row > .rcv-field {
    display: flex;
    flex-direction: column;
  }
  [data-wms-receiving] .item-body .placement-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 7.25rem;
    align-items: center;
    gap: .35rem;
    margin-bottom: .4rem;
  }
  [data-wms-receiving] .placement-row > :is(.loc-sel, .ss-wrap:has(> .loc-sel)) {
    grid-column: 1;
    grid-row: 1;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none;
  }
  [data-wms-receiving] .placement-row > .party-inp {
    grid-column: 2;
    grid-row: 1;
    width: 100% !important;
  }
  /* ⚠️ Поля второго ряда лежат ВНУТРИ `.rcv-field` (обёртка «подпись + поле», см. шаблон):
     ячейку сетки занимает она, а не само поле. Целиться прямым потомком `> .piece-upb`
     больше нельзя — правило молча перестало бы работать. */
  [data-wms-receiving] .placement-row > .rcv-field:first-of-type {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
  }
  [data-wms-receiving] .placement-row > .rcv-field:last-of-type {
    grid-column: 2;
    grid-row: 2;
    min-width: 0;
  }
  [data-wms-receiving] .placement-row .piece-upb {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none;
  }
  [data-wms-receiving] .placement-row .rcv-field > .flex {
    width: 100%;
    gap: .3rem;
  }
  [data-wms-receiving] .placement-row .qty-inp {
    width: 100% !important;
    min-width: 0;
  }
  [data-wms-receiving] .receiving-item-footer {
    flex-wrap: nowrap;
    gap: .5rem;
    margin-top: .25rem;
    font-size: .7rem;
  }
  [data-wms-receiving] .receiving-item-footer > .flex { gap: .8rem; }
  .receiving-location-field > :is(select, .ss-wrap) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  .receiving-location-field .ss-field {
    width: 100% !important;
    min-width: 0 !important;
  }
  #rcv-summary {
    padding: .55rem .6rem;
    column-gap: .65rem;
    row-gap: .18rem;
    font-size: .68rem;
    line-height: 1.2;
  }
  #rcv-summary > .uppercase,
  #rcv-summary #sum-detail {
    font-size: .6rem;
  }
  #rcv-summary #sum-detail {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .receiving-party-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: .28rem .5rem;
    padding: .55rem .6rem;
  }
  .receiving-party-main,
  .receiving-party-heading { display: contents; }
  .receiving-party-code {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    font-size: .8125rem;
    line-height: 1.2;
  }
  .receiving-party-supplier {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
    font-size: .75rem;
    line-height: 1.25;
    white-space: nowrap;
  }
  .receiving-party-owner {
    grid-column: 2;
    grid-row: 2;
    align-self: baseline;
    text-align: right;
    font-size: .65rem;
    line-height: 1.2;
    white-space: nowrap;
  }
  .receiving-party-owner-label { display: none; }
  .receiving-party-meta-line {
    grid-column: 1 / -1;
    grid-row: 3;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: .35rem;
    margin-top: .2rem;
  }
  .receiving-party-customs {
    margin-top: 0;
    font-size: .625rem;
    line-height: 1.3;
  }
  .receiving-party-customs-number,
  .receiving-party-customs-release { display: inline; }
  .receiving-party-customs-number { white-space: nowrap; }
  .receiving-party-customs-separator { display: none; }
  .receiving-mobile-break { display: initial; }
  .party-arrival-mobile-break { display: none; }
  .party-arrival-label-desktop { display: none; }
  .party-arrival-label-mobile { display: inline; }
  .receiving-party-arrival {
    display: grid;
    grid-template-columns: auto auto;
    justify-content: end;
    align-items: baseline;
    gap: .08rem .25rem;
    margin-top: 0;
    font-size: .625rem;
    line-height: 1.25;
    text-align: right;
  }
  .receiving-party-arrival > .party-arrival-relative {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .receiving-party-arrival > .party-arrival-label {
    grid-column: 1;
    grid-row: 2;
  }
  .receiving-party-arrival > b {
    grid-column: 2;
    grid-row: 2;
    white-space: nowrap;
  }
  .receiving-party-audit {
    grid-column: 1 / -1;
    grid-row: 4;
    margin-top: .15rem;
  }
  .receiving-party-audit > div {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: .35rem;
    font-size: .58rem;
    line-height: 1.2;
    white-space: nowrap;
  }
  .receiving-party-actions {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    margin-left: 0;
    gap: .35rem;
  }
  .receiving-buffer {
    margin-bottom: .75rem;
    padding: .55rem .6rem;
  }
  .receiving-buffer-head {
    gap: .5rem;
    margin-bottom: .4rem;
  }
  .receiving-buffer-heading { gap: .2rem .4rem; }
  .receiving-buffer-note {
    flex-basis: 100%;
    font-size: .625rem;
  }
  .receiving-buffer-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .18rem .5rem;
    padding: .35rem 0;
  }
  .receiving-buffer-identity {
    flex-direction: column;
    gap: .08rem;
  }
  .receiving-buffer-place {
    display: flex;
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    align-items: flex-end;
    justify-content: flex-end;
    flex-direction: column;
    gap: .08rem;
  }
  .receiving-buffer-qty {
    order: 1;
  }
  .receiving-buffer-warehouse {
    order: 2;
    font-size: .65rem;
  }
}

/* Разбор дублей: компактная рабочая карточка без потери реквизитов и действий. */
.duplicates-pair-list {
  display: grid;
  gap: .5rem;
}
.duplicate-pair-card { padding: .75rem; }
.duplicate-barcode { margin-bottom: .4rem; }
.duplicate-sides { gap: .5rem; }
.duplicate-side { padding: .5rem; }
.duplicate-side-sku {
  font-size: .8rem;
  line-height: 1.2;
}
.duplicate-side-name {
  font-size: .75rem;
  line-height: 1.25;
}
.duplicate-side-meta {
  margin-top: .18rem;
  font-size: .65rem;
  line-height: 1.2;
}
.duplicate-actions {
  gap: .4rem;
  margin-top: .55rem;
}
.duplicate-action {
  min-height: 1.875rem;
  padding: .3rem .55rem;
  font-size: .72rem;
  line-height: 1.1;
}
.duplicate-main-row {
  gap: .5rem;
  padding: .55rem .65rem;
}
.duplicate-main-identity {
  display: inline-flex;
  align-items: baseline;
  gap: .5rem;
}
@media (max-width: 767px) {
  .duplicate-pair-card { padding: .5rem; }
  .duplicate-side { padding: .4rem .45rem; }
  .duplicate-actions { margin-top: .45rem; }
  .duplicate-main-heading {
    margin-bottom: .25rem;
    font-size: .875rem;
    line-height: 1.3;
  }
  .duplicate-main-heading-meta { font-size: .75rem; }
  .duplicate-main-hint {
    display: block;
    width: 100%;
    max-width: none;
    margin-bottom: .5rem !important;
  }
  .duplicate-main-row {
    padding: .45rem .5rem;
    align-items: flex-start;
    flex-wrap: nowrap;
  }
  .duplicate-main-identity {
    min-width: 0;
    max-width: none;
    flex: 1 1 0;
    flex-direction: column;
    align-items: flex-start;
    gap: .08rem;
  }
  .duplicate-main-identity > a {
    display: block;
    max-width: 100%;
    font-size: .8125rem;
    line-height: 1.2;
    overflow-wrap: anywhere;
  }
  .duplicate-main-row [data-nm-form] {
    min-width: 0;
    max-width: 100%;
    flex: 0 0 auto;
    align-self: flex-start;
    justify-content: flex-end;
    flex-wrap: nowrap;
    margin-top: 0;
  }
  .duplicate-main-row [data-nm-form] > :is(select, .ss-wrap) {
    min-width: 0 !important;
    width: 7.5rem !important;
    max-width: 7.5rem;
    flex: 0 1 7.5rem;
  }
  .duplicate-main-row [data-nm-form] > .ss-wrap > .ss-field {
    min-width: 0 !important;
    width: 100% !important;
  }
  .duplicate-main-row [data-nm-form] > .duplicate-action {
    flex: 0 0 auto;
  }
}

/* Явные режимы рабочей области вместо автоматического измерения таблиц.
   standard (xs–7xl) = 1240px для форм, карточек и обычных списков;
   wide (full или .ui-page-wide) = доступна вся рабочая ширина;
   split ниже оставляет на этой ширине только явно отмеченные большие реестры.
   Вложенные формы, карточки, меню и модальные окна не затрагиваются: селекторы
   работают только для прямого потомка <main>. */
main > .ui-page-standard,
main > .max-w-xs,
main > .max-w-sm,
main > .max-w-md,
main > .max-w-lg,
main > .max-w-xl,
main > .max-w-2xl,
main > .max-w-3xl,
main > .max-w-4xl,
main > .max-w-5xl,
main > .max-w-6xl,
main > .max-w-7xl { max-width: 1240px !important; width: 100%; }

main > .ui-page-wide,
main > .max-w-full { max-width: none !important; }

/* Компактные числовые сводки: это быстрый взгляд на итоги, а не отдельные
   рабочие панели. Один размер для списаний, остатков, инвентаризации и закупки. */
.ui-stat-grid {
  gap: .5rem !important;
  margin-bottom: .75rem !important;
}
.ui-stat-card {
  min-height: 0;
  padding: .65rem .8rem !important;
  border-radius: .65rem;
}
.ui-stat-card > .text-xs.uppercase {
  font-size: .625rem;
  line-height: 1.2;
}
.ui-stat-card > .text-2xl {
  margin-top: .12rem !important;
  font-size: 1.125rem;
  line-height: 1.2;
}
.ui-stat-card > .text-sm {
  margin-top: .12rem !important;
  font-size: .75rem;
  line-height: 1.2;
}
@media (min-width: 641px) {
  .ui-stat-grid:not(.stock-network-grid) {
    display: flex !important;
    flex-wrap: wrap;
    align-items: stretch;
  }
  .ui-stat-grid:not(.stock-network-grid) > .ui-stat-card {
    flex: 0 1 18rem !important;
    width: 18rem;
    max-width: 18rem;
  }
}

/* Инвентаризация: цена простоя слева, две числовые карточки справа — одна
   строка на рабочем экране; на узком экране блоки возвращаются в колонку. */
.wms-inventory-back-link {
  display: inline-flex;
  margin-bottom: 8px;
}
.wms-inventory-intro {
  margin: 0 0 16px;
}
.wms-inventory-intro .ui-page-lead {
  margin: 0 !important;
}
@media (min-width: 1024px) {
  .wms-inventory-intro-row {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: start;
    gap: 24px;
    margin-bottom: 16px;
  }
  .wms-inventory-intro-row .wms-inventory-back-link,
  .wms-inventory-intro-row .wms-inventory-intro {
    margin-bottom: 0;
  }
  .wms-inventory-intro-row .wms-inventory-intro {
    justify-self: end;
    width: max-content;
    max-width: 100%;
  }
  .wms-inventory-intro-row .ui-page-lead,
  .wms-inventory-freeze-desktop {
    font-size: 13px;
    line-height: 18px;
  }
  .wms-inventory-intro-second-line {
    display: block;
    text-align: right;
  }
}
.wms-inventory-freeze-mobile {
  display: none !important;
}
.wms-inventory-row--done {
  background: rgba(226, 232, 240, .25);
}
.wms-inventory-row:not(.wms-inventory-row--done):hover {
  background: #f5f3ff;
}
.wms-inventory-state-row {
  display: flex;
  min-height: 18px;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.wms-inventory-state-result {
  line-height: 1.2;
}
.wms-inventory-state-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  text-decoration: none;
  transition: filter .15s ease, box-shadow .15s ease;
}
.wms-inventory-state-link:hover {
  filter: saturate(1.08) brightness(.98);
  box-shadow: inset 0 0 0 1px rgb(100 116 139 / 18%);
}
.wms-inventory-state-arrow {
  display: inline-flex;
  align-items: center;
  color: currentColor;
  opacity: .55;
}
.wms-inventory-state-arrow .ui-action-icon {
  width: 8px;
  height: 8px;
  transform: rotate(-90deg);
  stroke-width: 2;
}
.wms-inventory-overview {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}
.ui-stat-grid.wms-inventory-stats {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px !important;
  margin-bottom: 0 !important;
}
.ui-stat-grid.wms-inventory-stats > .ui-stat-card {
  flex: none !important;
  width: auto !important;
  max-width: none !important;
}
.wms-inventory-cycle-action-row {
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap;
}
.wms-inventory-cycle-form {
  margin-top: 0 !important;
}
.wms-inventory-cycle-submit {
  display: inline-flex;
  box-sizing: border-box;
  width: auto;
  height: var(--ui-control-height-compact);
  min-height: var(--ui-control-height-compact);
  align-items: center;
  justify-content: center;
  padding: 0 10px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
@media (max-width: 640px) {
  .wms-inventory-intro {
    display: none !important;
  }
  .wms-inventory-freeze {
    flex: 1 1 auto;
    min-width: 0;
    padding: 6px !important;
    border-radius: 10px;
  }
  .wms-inventory-freeze-desktop {
    display: none !important;
  }
  .wms-inventory-freeze-mobile {
    display: flex !important;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1px;
    overflow: visible;
    font-size: 10px;
    line-height: 13px;
    white-space: nowrap;
  }
  .wms-inventory-freeze-mobile-primary,
  .wms-inventory-freeze-mobile-meta {
    display: inline-flex;
    align-items: center;
    gap: 3px;
  }
  .wms-inventory-freeze-mobile .help {
    width: 11px;
    height: 11px;
    min-width: 11px;
    margin-left: 2px;
    font-size: 8px;
  }
  .wms-inventory-freeze-mobile-detail {
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .wms-inventory-freeze-mobile-detail .ui-action-icon {
    width: 11px;
    height: 11px;
  }
  .wms-inventory-overview {
    display: flex;
    width: 100%;
    align-items: stretch;
    gap: 6px;
    margin-bottom: 12px;
    overflow: visible;
  }
  .ui-stat-grid.wms-inventory-stats {
    display: contents !important;
  }
  .ui-stat-grid.wms-inventory-stats > .ui-stat-card {
    display: flex !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
    padding: 6px !important;
    border-radius: 10px;
    white-space: nowrap;
  }
  .wms-inventory-stats .text-xs.uppercase {
    font-size: 8px;
    line-height: 10px;
    letter-spacing: 0;
  }
  .wms-inventory-stats .text-2xl {
    flex: 0 0 auto;
    font-size: 11px;
    line-height: 14px;
  }
  .wms-inventory-stats .help {
    width: 11px;
    height: 11px;
    min-width: 11px;
    margin-left: 3px;
    font-size: 8px;
  }
  .wms-inventory-stats .wms-inventory-stat-note {
    display: none;
  }
  .wms-inventory-accuracy-title {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
  }
  .wms-inventory-accuracy-title-line {
    display: inline-flex;
    align-items: center;
  }
  .wms-inventory-cycle-card {
    display: flex !important;
  }
  .wms-inventory-cycle-card > .text-xs {
    overflow: visible;
    text-overflow: clip;
  }
  .wms-inventory-cycle-action-row {
    min-width: 0;
    gap: 4px;
  }
  .wms-inventory-cycle-action-row > .text-2xl {
    white-space: nowrap;
  }
  .wms-inventory-cycle-action-row > .text-2xl > .text-sm {
    font-size: 9px;
    line-height: 12px;
  }
  .wms-inventory-cycle-submit {
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    padding: 0 5px !important;
    border-radius: 6px;
    font-size: 9px !important;
    line-height: 1 !important;
  }
  .wms-inventory-list-frame {
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  #wms-inventory-list,
  #wms-inventory-list > tbody {
    display: block !important;
    width: 100% !important;
  }
  #wms-inventory-list > thead,
  #wms-inventory-list > colgroup {
    display: none !important;
  }
  #wms-inventory-list > tbody > tr.wms-inventory-row {
    display: grid !important;
    position: relative;
    box-sizing: border-box;
    grid-template-columns: max-content minmax(0, 1fr) 156px;
    grid-template-areas:
      "document document age"
      "location location location"
      "warehouse created state";
    column-gap: 6px;
    row-gap: 2px;
    width: 100% !important;
    margin: 0 0 .35rem !important;
    padding: 6px 8px !important;
    overflow: visible;
    border: 1px solid #cbd5e1 !important;
    border-radius: .8rem !important;
    background: #fff;
    box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
  }
  #wms-inventory-list > tbody > tr.wms-inventory-row--done {
    background: rgba(248, 250, 252, .9);
  }
  #wms-inventory-list > tbody > tr.wms-inventory-row--done > .wms-inventory-list-age {
    display: none !important;
  }
  #wms-inventory-list > tbody > tr.wms-inventory-row > td {
    display: block !important;
    box-sizing: border-box;
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
  }
  #wms-inventory-list > tbody > tr.wms-inventory-row > td::before {
    display: none !important;
  }
  #wms-inventory-list .wms-inventory-list-doc {
    grid-area: document;
    align-self: center;
    font-size: 12px;
    font-weight: 400;
    line-height: 16px;
  }
  #wms-inventory-list .wms-inventory-list-age {
    grid-area: age;
    align-self: center;
    justify-self: end;
    font-size: 11px;
    line-height: 16px;
  }
  #wms-inventory-list .wms-inventory-list-location {
    grid-area: location;
    overflow: visible;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
  }
  #wms-inventory-list .wms-inventory-list-location .wms-pick-location {
    max-width: 100%;
    white-space: normal;
  }
  #wms-inventory-list .wms-inventory-list-location .wms-pick-location-value {
    overflow: visible;
    text-overflow: clip;
    white-space: normal;
  }
  #wms-inventory-list .wms-inventory-list-location .ui-location-icon,
  #wms-inventory-list .wms-inventory-list-location .ui-action-icon {
    width: 12px;
    height: 12px;
  }
  #wms-inventory-list .wms-inventory-list-warehouse {
    grid-area: warehouse;
    align-self: center;
    font-size: 10px;
    line-height: 14px;
  }
  #wms-inventory-list .wms-inventory-list-created {
    grid-area: created;
    align-self: center;
    color: #94a3b8;
    font-size: 10px;
    line-height: 14px;
  }
  #wms-inventory-list .wms-inventory-list-created::before {
    content: "·";
    display: inline !important;
    margin-right: 6px;
  }
  #wms-inventory-list .wms-inventory-list-state {
    position: absolute;
    right: 8px;
    bottom: 6px;
    grid-area: auto;
    max-width: 156px;
  }
  #wms-inventory-list .wms-inventory-state-row {
    min-height: 16px;
    justify-content: flex-end;
    gap: 5px;
  }
  #wms-inventory-list .wms-inventory-state-result {
    white-space: normal;
    text-align: right;
  }
  #wms-inventory-list .wms-inventory-row--done .wms-inventory-state-row {
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 1px;
  }
  #wms-inventory-list .wms-inventory-row--done .wms-inventory-state-result {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-end;
    gap: 0;
    font-size: 10px;
    line-height: 12px;
  }
  #wms-inventory-list .wms-inventory-row--done .wms-inventory-state-separator {
    display: none;
  }
}
/* Метки «Нужен пересчёт»: та же компактная карточная геометрия, что у заданий
   инвентаризации, без пяти отдельных подписанных этажей общей responsive-таблицы. */
@media (min-width: 1024px) {
  main header.wms-count-flags-intro {
    clear: both;
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: start;
    gap: 24px;
    margin-top: 0;
    padding-top: 12px;
  }
  main header.wms-count-flags-intro .ui-page-title {
    min-height: 0;
    padding-top: 0;
    white-space: nowrap;
  }
  main header.wms-count-flags-intro .ui-page-lead {
    min-width: 0;
    margin: 0;
    font-size: 13px;
    line-height: 18px;
  }
}
.wms-count-flags-warehouse-mobile {
  display: none;
}
/* Ссылка из Telegram приходит на exact id метки: :target выделяет именно строку, без JS
   и без второго правила выбора. scroll-margin оставляет её ниже закреплённой навигации. */
#wms-count-flags-table > tbody > tr.wms-count-flags-row:target {
  scroll-margin-top: 5rem;
  outline: 2px solid #f59e0b;
  outline-offset: -2px;
  background: #fffbeb;
}
#wms-count-flags-table > tbody > tr.wms-count-flags-row:target > td {
  background: #fffbeb;
}
@media (max-width: 640px) {
  main header.wms-count-flags-intro {
    padding-top: 12px;
  }
  .wms-count-flags-frame {
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  #wms-count-flags-table,
  #wms-count-flags-table > tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  #wms-count-flags-table > thead {
    display: none !important;
  }
  #wms-count-flags-table > tbody > tr.wms-count-flags-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) max-content;
    grid-template-areas:
      "check times"
      "location seen";
    column-gap: 8px;
    row-gap: 2px;
    width: 100% !important;
    margin: 0 0 6px !important;
    padding: 6px 8px !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: .8rem !important;
    background: #fff;
    box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
  }
  #wms-count-flags-table > tbody > tr.wms-count-flags-row:last-child {
    margin-bottom: 0 !important;
  }
  #wms-count-flags-table > tbody > tr.wms-count-flags-row:target {
    background: #fffbeb !important;
  }
  #wms-count-flags-table > tbody > tr.wms-count-flags-row > td {
    display: block !important;
    box-sizing: border-box;
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    text-align: left !important;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  #wms-count-flags-table > tbody > tr.wms-count-flags-row > td::before {
    display: none !important;
  }
  #wms-count-flags-table .wms-count-flags-check {
    grid-area: check;
    font-size: 12px;
    line-height: 16px;
  }
  #wms-count-flags-table .wms-count-flags-detail {
    display: block;
    font-size: 10px;
    line-height: 14px;
  }
  #wms-count-flags-table .wms-count-flags-times {
    grid-area: times;
    justify-self: end;
    font-size: 11px;
    line-height: 16px;
  }
  #wms-count-flags-table .wms-count-flags-times::before {
    content: "×";
    display: inline !important;
  }
  #wms-count-flags-table .wms-count-flags-location {
    grid-area: location;
    font-size: 12px;
    font-weight: 600;
    line-height: 16px;
  }
  #wms-count-flags-table .wms-count-flags-location .wms-pick-location {
    max-width: 100%;
    white-space: normal;
  }
  #wms-count-flags-table .wms-count-flags-location .wms-pick-location-value {
    white-space: normal;
    overflow-wrap: break-word;
  }
  #wms-count-flags-table .wms-count-flags-warehouse-mobile {
    display: inline;
    color: #475569;
    font-size: 10px;
    font-weight: 400;
    line-height: 14px;
    white-space: nowrap;
  }
  #wms-count-flags-table .wms-count-flags-location .ui-location-icon .ui-action-icon {
    width: 12px;
    height: 12px;
  }
  #wms-count-flags-table .wms-count-flags-warehouse,
  #wms-count-flags-table .wms-count-flags-seen {
    font-size: 10px;
    line-height: 14px;
  }
  #wms-count-flags-table > tbody > tr.wms-count-flags-row > td.wms-count-flags-warehouse {
    display: none !important;
  }
  #wms-count-flags-table .wms-count-flags-seen {
    grid-area: seen;
    align-self: start;
    justify-self: end;
    color: #94a3b8;
    line-height: 16px;
    white-space: nowrap;
  }
  #wms-count-flags-table .wms-count-flags-seen-time {
    display: none;
  }
}
@media (min-width: 1024px) {
  .wms-inventory-overview {
    grid-template-columns: minmax(0, 1fr) 450px;
    align-items: stretch;
    gap: 10px;
  }
  .wms-inventory-overview:not(.has-freeze) .wms-inventory-stats {
    grid-column: 2;
  }
  .ui-stat-grid.wms-inventory-stats {
    grid-template-columns: 200px 240px;
    gap: 10px !important;
  }
  .wms-inventory-overview > .wms-inventory-freeze,
  .ui-stat-grid.wms-inventory-stats > .ui-stat-card {
    padding: 8px 12px !important;
  }
}

/* Ручной пересчёт места: отдельная строка между сводкой и таблицей.
   От 1024 px заголовок остаётся вне select, но стоит с полями в одном ряду. */
.wms-inventory-manual {
  margin-bottom: 16px;
}
.wms-inventory-manual-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 8px;
  margin-top: 8px;
}
@media (min-width: 768px) {
  .wms-inventory-manual-fields {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) max-content;
    align-items: center;
  }
}
.wms-inventory-manual-submit {
  white-space: nowrap;
}
.wms-inventory-manual-place-row {
  min-width: 0;
}
.help.wms-inventory-manual-help-mobile {
  display: none !important;
}
@media (min-width: 1024px) {
  .wms-inventory-manual {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: center;
    gap: 12px;
  }
  .wms-inventory-manual-title {
    white-space: nowrap;
  }
  .wms-inventory-manual-fields {
    min-width: 0;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.5fr) max-content;
    margin-top: 0;
  }
}
@media (max-width: 640px) {
  .wms-inventory-manual-title {
    display: none;
  }
  .wms-inventory-manual-fields {
    margin-top: 0;
  }
  .wms-inventory-manual-place-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: center;
    gap: 8px;
  }
  .wms-inventory-manual-place-row > :is(
    .wms-inventory-manual-place,
    .ss-wrap:has(> .wms-inventory-manual-place)
  ) {
    grid-column: 1;
    min-width: 0;
    width: 100%;
  }
  .help.wms-inventory-manual-help-mobile {
    display: inline-flex !important;
    grid-column: 2;
    align-self: center;
  }
  .wms-inventory-manual-place-row > .ss-wrap:has(> .wms-inventory-manual-place:invalid)
    > .ss-field > .truncate {
    font-size: 0;
  }
  .wms-inventory-manual-place-row > .ss-wrap:has(> .wms-inventory-manual-place:invalid)
    > .ss-field > .truncate::before {
    content: "Пересчитать место — выберите место —";
    font-size: .78rem;
  }
}
@media (max-width: 640px) {
  .wms-inventory-manual {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .wms-inventory-manual-fields {
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: stretch;
  }
  .wms-inventory-manual-place-row {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .wms-inventory-manual-reason {
    min-width: 0;
  }
}
/* «вручную» у номера задания: признак повода, текст причины — только админу в карточке. */
.wms-inventory-manual-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 0 6px;
  border-radius: 9999px;
  background: #f1f5f9;
  color: #64748b;
  font-family: inherit;
  font-size: 11px;
  line-height: 16px;
  vertical-align: middle;
}
.wms-inventory-card-reason {
  margin: 4px 0 0;
  color: #64748b;
  font-size: 12px;
  line-height: 16px;
  overflow-wrap: anywhere;
}

/* Карточка пересчёта: адрес важнее внутреннего номера документа; инструкция
   стоит справа, а не отдельным этажом под шапкой. */
.wms-inventory-card-page {
  --wms-inventory-side-width: 400px;
}
.wms-inventory-card-top {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}
.wms-inventory-card-identity {
  min-width: 0;
  text-align: center;
}
.wms-inventory-card-back {
  display: inline-flex;
  align-self: center;
  margin: 0;
  white-space: nowrap;
}
.wms-inventory-card-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  font-size: 13px;
  line-height: 20px;
  white-space: nowrap;
}
.wms-inventory-card-breadcrumb-separator,
.wms-inventory-card-breadcrumb-current {
  color: #94a3b8;
}
.wms-inventory-card-header {
  margin: 0;
}
.wms-inventory-card-code.ui-page-title {
  min-height: 0;
  margin: 0;
  padding: 0;
  color: #94a3b8;
  font-size: 11px;
  font-weight: 600;
  line-height: 14px;
  letter-spacing: .04em;
}
.wms-inventory-card-location-row {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px;
  margin: 3px 0 0;
}
.wms-inventory-card-location {
  min-width: 0;
  color: #334155;
  font-size: 18px;
  font-weight: 620;
  line-height: 23px;
}
.wms-inventory-card-location .ui-location-icon .ui-action-icon {
  width: 14px;
  height: 14px;
  fill: currentColor;
  stroke: none;
}
.wms-inventory-card-warehouse {
  color: #64748b;
  font-size: 13px;
  line-height: 18px;
}
.wms-inventory-count-guide {
  align-self: center;
  margin: 0;
  padding: 10px 12px !important;
  border-color: #f6d38a !important;
  background: rgba(255, 251, 235, .72) !important;
  font-size: 13px;
  line-height: 19px;
}
.wms-inventory-count-guide.wms-inventory-approval-guide {
  border-color: #fda4af !important;
  background: rgba(255, 241, 242, .82) !important;
  color: #881337;
}
.wms-inventory-count-guide.wms-inventory-closed-guide {
  border-color: #cbd5e1 !important;
  background: rgba(248, 250, 252, .82) !important;
  color: #475569;
}
@media (max-width: 640px) {
  .wms-inventory-card-top {
    gap: 0;
    margin-bottom: 8px;
  }
  .wms-inventory-card-breadcrumb {
    gap: 4px;
    margin-bottom: 4px;
    font-size: 11px;
    line-height: 16px;
  }
  .wms-inventory-card-identity {
    text-align: left;
  }
  .wms-inventory-card-page .wms-inventory-card-header {
    margin-bottom: 0 !important;
    row-gap: 0 !important;
  }
  .wms-inventory-card-code.ui-page-title {
    display: none;
  }
  .wms-inventory-card-location-row {
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 3px;
    margin-top: 0;
  }
  .wms-inventory-card-location {
    max-width: 100%;
    font-size: 18px;
    line-height: 23px;
  }
  .wms-inventory-card-location .wms-pick-location {
    max-width: 100%;
    white-space: normal;
  }
  .wms-inventory-card-location .wms-pick-location-value {
    overflow-wrap: anywhere;
  }
  .wms-inventory-card-location .ui-location-icon .ui-action-icon {
    width: 14px;
    height: 14px;
  }
  .wms-inventory-card-warehouse {
    flex: 0 0 auto;
    font-size: 11px;
    line-height: 15px;
  }
  .wms-inventory-count-guide {
    margin-top: 0;
    padding: 7px 9px !important;
    border-radius: 10px;
    font-size: 11px;
    line-height: 16px;
  }
  .wms-inventory-card-page .wms-inventory-workspace {
    row-gap: 24px;
  }
}
@media (min-width: 768px) {
  .wms-inventory-card-top {
    grid-template-columns: max-content minmax(0, 1fr);
    gap: 16px;
    align-items: center;
  }
  .wms-inventory-card-top.has-guide {
    grid-template-columns: max-content minmax(0, 1fr) var(--wms-inventory-side-width);
  }
}
.wms-inventory-workspace {
  display: grid;
  grid-template-columns: minmax(0, 680px);
  align-items: start;
  gap: 16px;
  margin-top: 0;
}
.wms-inventory-count-table {
  min-width: 640px;
}
.wms-inventory-count-form {
  width: 100%;
  margin: 0;
}
.wms-inventory-count-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 16px;
}
.wms-inventory-count-actions > p {
  min-width: 0;
  margin: 0;
}
.wms-inventory-count-sku {
  width: 1%;
}
.wms-inventory-count-barcode {
  width: 160px;
}
.wms-inventory-count-fact {
  width: 144px;
}
#wms-inventory-count-table .wms-inventory-count-hints-label {
  display: none;
}
@media (max-width: 640px) {
  .wms-inventory-count-table-wrap,
  .wms-inventory-review-shell {
    overflow: visible !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .wms-inventory-count-table,
  .wms-inventory-count-table > tbody,
  .wms-inventory-review-table,
  .wms-inventory-review-table > tbody {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
  }
  .wms-inventory-count-table > thead,
  .wms-inventory-review-table > thead,
  .wms-inventory-review-table > colgroup {
    display: none !important;
  }
  .wms-inventory-count-table > tbody > tr,
  .wms-inventory-review-table > tbody > tr {
    display: grid !important;
    align-items: start;
    margin-bottom: 8px;
    padding: 6px 8px;
    border: 1px solid #cbd5e1 !important;
    border-radius: 10px;
    background: #fff;
  }
  #wms-inventory-count-table > tbody > tr {
    grid-template-columns: minmax(0, 1fr) 112px;
    grid-template-areas:
      "sku fact"
      "barcode fact";
    grid-template-rows: max-content auto;
    column-gap: 10px;
  }
  #wms-inventory-count-table.has-place-hints > tbody > tr {
    grid-template-areas:
      "sku fact"
      "barcode fact"
      "hint-label fact"
      "hints hints";
    grid-template-rows: max-content max-content auto auto;
  }
  .wms-inventory-review-table > tbody > tr {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-areas:
      "sku sku diff"
      "barcode barcode barcode"
      "holders holders holders"
      "expected count1 count2";
    column-gap: 8px;
  }
  .wms-inventory-count-table > tbody > tr:last-child,
  .wms-inventory-review-table > tbody > tr:last-child {
    margin-bottom: 0;
  }
  .wms-inventory-card-page .wms-inventory-count-actions {
    margin-top: 6px;
  }
  #wms-inventory-count-table > tbody > tr.wms-inventory-count-row--rolls {
    grid-template-columns: minmax(0, 1fr) 150px;
  }
  .wms-inventory-count-table > tbody > tr > td,
  .wms-inventory-review-table > tbody > tr > td {
    display: block !important;
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0;
    padding: 0 !important;
    border: 0;
    text-align: left;
    white-space: normal;
    overflow-wrap: anywhere;
    overflow: visible;
    text-overflow: clip;
  }
  #wms-inventory-count-table .wms-inventory-count-sku {
    grid-area: sku;
    font-size: 13px;
    line-height: 18px;
  }
  #wms-inventory-count-table .wms-inventory-count-barcode { grid-area: barcode; }
  #wms-inventory-count-table > tbody > tr > .wms-inventory-count-places {
    display: contents !important;
  }
  #wms-inventory-count-table .wms-inventory-count-hints {
    display: contents;
  }
  #wms-inventory-count-table .wms-inventory-count-hints-body {
    grid-area: hints;
    min-width: 0;
    margin-top: 2px;
  }
  #wms-inventory-count-table .wms-inventory-count-hints-label {
    display: block;
    grid-area: hint-label;
    margin-top: 2px;
    color: #94a3b8;
    font-size: 10px;
    line-height: 14px;
  }
  #wms-inventory-count-table .wms-inventory-count-barcode {
    margin-top: 1px;
    font-size: 11px;
    line-height: 15px;
  }
  #wms-inventory-count-table .wms-inventory-count-barcode::before,
  #wms-inventory-count-table .wms-inventory-count-fact::before {
    color: #94a3b8;
    font-family: ui-sans-serif, system-ui, sans-serif;
    font-size: 10px;
    font-weight: 500;
  }
  #wms-inventory-count-table .wms-inventory-count-barcode::before { content: "ШК · "; }
  #wms-inventory-count-table .wms-inventory-count-places .wms-pick-location {
    max-width: 100%;
    white-space: normal;
  }
  #wms-inventory-count-table .wms-inventory-count-places .wms-pick-location-value {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  #wms-inventory-count-table .wms-inventory-count-fact {
    display: flex !important;
    grid-area: fact;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    margin-top: 0;
    padding-top: 0 !important;
    border-top: 0;
  }
  #wms-inventory-count-table .wms-inventory-count-fact::before {
    content: "Факт";
    align-self: flex-end;
    color: #475569;
  }
  #wms-inventory-count-table .wms-inventory-count-fact > input {
    box-sizing: border-box;
    width: 100%;
    min-height: 36px;
    font-size: 12px;
    line-height: 16px;
  }
  #wms-inventory-count-table .wms-inventory-count-fact > div {
    margin-top: 0;
  }
  .wms-inventory-review-table > tbody > tr > .wms-inventory-review-sku {
    display: contents !important;
  }
  .wms-inventory-review-table .wms-inventory-review-sku-value {
    display: block;
    grid-area: sku;
    min-width: 0;
    color: #1e293b;
    font-size: 13px;
    line-height: 18px;
  }
  .wms-inventory-review-table .wms-inventory-review-holders {
    grid-area: holders;
    min-width: 0;
    margin-top: 4px;
    font-size: 11px;
    line-height: 15px;
  }
  .wms-inventory-review-table .wms-inventory-review-barcode {
    grid-area: barcode;
    margin-top: 1px;
    font-size: 11px;
    line-height: 15px;
  }
  .wms-inventory-review-table .wms-inventory-review-barcode::before {
    content: "ШК · ";
    color: #94a3b8;
    font-family: ui-sans-serif, system-ui, sans-serif;
    font-size: 10px;
    font-weight: 500;
  }
  .wms-inventory-review-table .wms-inventory-review-unit {
    display: none !important;
  }
  .wms-inventory-review-table .wms-inventory-review-mobile-rolls {
    display: inline;
    color: #94a3b8;
    font-family: ui-sans-serif, system-ui, sans-serif;
    font-size: 11px;
    font-weight: 400;
    line-height: 15px;
  }
  .wms-inventory-review-table .wms-inventory-review-diff {
    grid-area: diff;
    font-size: 13px;
    line-height: 18px;
    text-align: right;
  }
  .wms-inventory-review-table .wms-inventory-review-expected { grid-area: expected; }
  .wms-inventory-review-table .wms-inventory-review-count-1 { grid-area: count1; }
  .wms-inventory-review-table .wms-inventory-review-count-2 { grid-area: count2; }
  .wms-inventory-review-table .wms-inventory-review-number {
    display: flex !important;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    margin-top: 6px;
    padding-top: 4px !important;
    border-top: 1px solid #e2e8f0;
    font-size: 12px;
    line-height: 16px;
  }
  .wms-inventory-review-table .wms-inventory-review-metric-label {
    display: block;
    color: #94a3b8;
    font-family: ui-sans-serif, system-ui, sans-serif;
    font-size: 10px;
    font-weight: 500;
    line-height: 14px;
  }
}
.wms-inventory-reserved-note,
.wms-inventory-other-place-note {
  display: grid;
  grid-template-columns: 14px minmax(0, 1fr);
  align-items: start;
  column-gap: 4px;
}
.wms-inventory-reserved-note > :first-child,
.wms-inventory-other-place-note > :first-child {
  grid-column: 1;
  grid-row: 1;
  order: 0;
}
.wms-inventory-reserved-note > span:last-child,
.wms-inventory-other-place-note > span:last-child {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
}
.wms-inventory-reserved-note .ui-action-icon {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  margin-top: 1px;
  color: #64748b;
}
.wms-inventory-other-place-note .ui-location-icon .ui-action-icon {
  width: 14px;
  height: 14px;
}
.wms-inventory-other-place-name {
  color: #475569;
}
.wms-inventory-found-note-help.help {
  display: none !important;
}
@media (max-width: 640px) {
  .wms-inventory-found-note-help.help {
    display: inline-flex !important;
  }
}
.wms-inventory-found-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 12px;
  min-width: 0;
}
.wms-inventory-found-card {
  min-width: 0;
  margin: 0;
  background: rgba(255, 255, 255, .25) !important;
}
.wms-inventory-found-card--move {
  border-color: var(--ui-border-strong) !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .05);
}
.wms-inventory-found-heading {
  display: flex;
  gap: 6px;
}
.wms-inventory-found-heading {
  align-items: flex-start;
}
.wms-inventory-found-copy {
  display: block;
  min-width: 0;
}
.wms-inventory-found-title {
  display: block;
  font-size: 14px;
  line-height: 20px;
}
.wms-inventory-found-note {
  display: block;
  margin-top: 2px;
  color: #64748b;
  font-size: 12px;
  line-height: 16px;
}
@media (max-width: 640px) {
  .wms-inventory-found-card .wms-inventory-found-heading {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr);
    column-gap: 6px;
    row-gap: 0;
  }
  .wms-inventory-found-card--move .wms-inventory-found-copy {
    display: contents;
  }
  .wms-inventory-found-card--move .wms-inventory-found-title {
    grid-column: 2;
  }
  .wms-inventory-found-card--move .wms-inventory-found-note {
    grid-column: 2;
    margin-top: 0;
  }
  .wms-inventory-found-card--move .wms-inventory-found-note-detail {
    display: none;
  }
}
.wms-inventory-box-icon {
  margin-top: 3px;
}
.wms-inventory-box-icon,
.wms-inventory-found-surprised {
  color: #64748b;
}
.wms-inventory-found-move-btn {
  margin-left: auto;
}
.wms-inventory-found-move-form {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr) 64px;
  align-items: end;
  gap: 8px;
}
.wms-inventory-found-product {
  grid-column: 1;
  grid-row: 1;
  width: 150px;
  min-width: 0;
}
.wms-inventory-found-location,
.wms-inventory-found-move-form > .ss-wrap {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  min-width: 0;
}
.wms-inventory-found-qty {
  grid-column: 3;
  grid-row: 1;
}
.wms-inventory-found-move-btn {
  grid-column: 2 / 4;
  grid-row: 2;
  justify-self: end;
}
.wms-inventory-secondary-action {
  display: inline-flex;
  width: auto;
  min-height: 36px;
  align-items: center;
  justify-content: center;
  padding: 8px 16px;
  border: 0;
  border-radius: var(--ui-control-radius-regular);
  background: #334155;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
}
.wms-inventory-secondary-action:hover {
  background: #1e293b;
}
@media (max-width: 640px) {
  .wms-inventory-card-page .wms-inventory-secondary-action {
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    padding: .2rem .55rem;
    border-radius: var(--ui-control-radius-compact);
    font-size: .7rem;
    line-height: 1;
  }
}
.wms-inventory-approval-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: 16px;
  margin-top: 16px;
}
.wms-inventory-approval-summary {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 12px;
}
.wms-inventory-review-pane {
  min-width: 0;
  max-width: none;
}
.wms-inventory-reopen-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
}
.wms-inventory-reopen-copy {
  min-width: 0;
  line-height: 16px;
}
.wms-inventory-reopen-form {
  justify-self: end;
}
.wms-inventory-review-table {
  min-width: 0;
  table-layout: fixed;
}
.wms-inventory-review-metric-label {
  display: none;
}
.wms-inventory-review-mobile-rolls {
  display: none;
}
.wms-inventory-review-table th,
.wms-inventory-review-table td {
  overflow: hidden;
  padding-left: 8px !important;
  padding-right: 8px !important;
  text-overflow: ellipsis;
}
@media (min-width: 641px) {
  .wms-inventory-review-table th.wms-inventory-review-expected-heading {
    overflow: visible;
    white-space: normal;
    text-overflow: clip;
  }
}
.wms-inventory-review-sku {
  width: 40%;
}
.wms-inventory-review-barcode {
  width: 15%;
}
.wms-inventory-review-unit {
  width: 6%;
}
.wms-inventory-review-number {
  width: 8%;
}
.wms-inventory-review-diff {
  width: 15%;
}
/* Перемещение со сверкой (`wms/move_check.html`): колонки «Артикул» и «ШК» заменены одной
   «Место» — она берёт их общую ширину, остальные колонки те же, сумма 100%. Правило стоит
   ПОСЛЕ `.wms-inventory-review-sku` той же силы, поэтому ширина места побеждает. */
.wms-inventory-review-place {
  width: 55%;
}
@media (max-width: 640px) {
  .wms-inventory-approval-workspace {
    gap: 8px;
    margin-top: 0;
  }
  .wms-inventory-approval-workspace.is-closed {
    row-gap: 24px;
  }
  .wms-inventory-approval-workspace.has-review-followup > .wms-inventory-review-pane {
    order: 1;
  }
  .wms-inventory-approval-workspace.has-review-followup > .wms-inventory-approval-summary {
    order: 2;
  }
  .wms-inventory-reopen-card {
    gap: 4px;
    padding: 7px 9px;
  }
  .wms-inventory-card-page .wms-inventory-approve-form {
    margin-top: 8px;
  }
}
@media (min-width: 1100px) {
  .wms-inventory-approval-workspace:not(.is-single) {
    grid-template-columns: minmax(0, 1fr) var(--wms-inventory-side-width);
  }
  .wms-inventory-approval-workspace:not(.is-single) .wms-inventory-review-pane {
    grid-column: 1;
    grid-row: 1;
  }
  .wms-inventory-approval-workspace:not(.is-single) .wms-inventory-approval-summary {
    grid-column: 2;
    grid-row: 1;
  }
}
.wms-inventory-found-surprised {
  display: inline-flex;
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
  align-items: center;
  justify-content: center;
  line-height: 16px;
}
.wms-inventory-found-surprised .ui-action-icon {
  width: 18px;
  height: 18px;
}
@media (min-width: 1100px) {
  .wms-inventory-workspace:not(.is-single) {
    grid-template-columns: minmax(0, 1fr) var(--wms-inventory-side-width);
  }
}

/* Смешанная страница: служебная часть держит спокойную ось 1240px, а явно
   помеченная большая таблица/аналитика использует всю доступную ширину.
   Ширину содержимого не измеряем: исключения задаются только классами. */
@media (min-width: 768px) {
  main > .ui-page-split > :where(div, section, article, header, footer, nav, form, details, p):not(.fixed):not(.absolute) {
    width: 100%;
    max-width: 1240px;
    margin-inline: auto;
  }
  main > .ui-page-split > :where(.ui-content-wide, .ui-table-breakout),
  main > .ui-page-split > :where(div, section, article, header, footer, nav, form, details, p):not(.fixed):not(.absolute):has(.ui-content-wide, .ui-table-breakout) {
    max-width: none !important;
  }
}

.mobile-nav-face,
.mobile-nav-backdrop,
.mobile-more-nav { display: none; }

/* Мобильная навигация — нижняя панель из доступных по правам разделов. До шести
   разделов показываются сразу; для owner/admin первые пять остаются в панели, а
   остальные открываются через «Ещё». Desktop использует ту же исходную разметку как
   верхнее меню — права, ссылки и счётчики не дублируются. */
@media (max-width: 767px),
       (orientation: landscape) and (max-width: 1366px) and (hover: none),
       (orientation: landscape) and (max-width: 1366px) and (any-pointer: coarse) {
  body.has-mobile-bottom-nav {
    min-height: 0;
    padding-bottom: calc(4rem + env(safe-area-inset-bottom));
  }
  body.mobile-nav-sheet-open { overflow: hidden; }

  /* iOS Safari привязывает fixed-потомка sticky-шапки к старой координате при
     прокрутке. JS переносит единственный #mnav в body, а это правило страхует
     кадр до переноса и старый кэш JS: пока nav остаётся внутри, sticky отключён. */
  #topnav:has(> #mnav) { position: static; }
  #topnav {
    display: block;
    min-height: 0;
    max-height: none;
  }
  #topnav > header.topnav-header {
    display: flex;
    min-height: 3rem;
    gap: .35rem;
    padding-right: .25rem;
    padding-left: .625rem;
    padding-top: .25rem;
    padding-bottom: .25rem;
  }
  .topnav-brand { flex: 0 0 auto; }
  .topnav-account-desktop { display: none !important; }
  .topnav-account-mobile { display: flex !important; }
  .topnav-brand img:first-child { height: 1.25rem; }
  .topnav-brand img:nth-child(2) { display: none; }
  .topnav-page-title {
    display: block;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    color: var(--ui-text);
    font-size: .9375rem;
    font-weight: 600;
    line-height: 1.15;
    text-align: left;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .topnav-account-mobile {
    flex: 0 0 auto;
    gap: 0;
    margin-left: auto;
  }
  .topnav-account-mobile .mobile-tenant-summary {
    min-height: 2.25rem;
    padding-right: .35rem;
    padding-left: .35rem;
  }
  .topnav-account-mobile .mobile-tenant-name {
    max-width: 4.25rem;
    font-size: .6875rem;
  }
  .topnav-account-mobile .mobile-user-summary {
    width: 2.25rem;
    height: 2.25rem;
  }
  /* На телефоне название страницы уже находится в общей шапке. Второй крупный h1
     внутри контента не повторяем; пояснение и соседние действия сохраняются. */
  main.flex-1 { padding-top: .5rem; }
  main .ui-page-title { display: none; }
  main .ui-page-context-title,
  main .wms-context-title { display: none; }
  main .ui-page-context-head:has(> .ui-page-context-title:only-child),
  main .wms-context-heading:has(> .wms-context-title:only-child) { display: none; }
  /* Старый каркас «Претензий» не использует общий класс заголовка. На телефоне
     убираем и этот дубль; если рядом есть действие, оно остаётся на месте. */
  main .claim-page-title { display: none; }
  main .claim-page-head { min-height: 0; }
  main .claim-page-head:has(> .claim-page-title:only-child) { display: none; }
  main header:has(.ui-page-title) {
    margin-top: 0;
    margin-bottom: .5rem;
    row-gap: .5rem !important;
  }
  main .ui-page-lead {
    margin: 0 0 .5rem !important;
    padding: 0;
    font-size: .75rem;
    line-height: 1.35;
  }
  main header:has(.ui-page-title) .ui-page-lead {
    margin-bottom: 0 !important;
  }
  #mnav {
    display: block !important;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 60;
    padding: 0 0 env(safe-area-inset-bottom);
    border-top: 1px solid #e2e8f0;
    border-bottom: 0;
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 -4px 18px rgba(15, 23, 42, .08);
    backdrop-filter: blur(12px);
  }

  #mnav [data-mobile-modules] {
    display: grid !important;
    grid-template-columns: repeat(var(--mobile-nav-count, 4), minmax(0, 1fr));
    align-items: stretch;
    gap: 0;
  }
  #mnav [data-mobile-modules] > span { display: none !important; }
  #mnav [data-mobile-module],
  #mnav .mobile-more-nav {
    display: block;
    margin-left: 0 !important;
    min-width: 0;
    width: 100%;
  }
  /* `display: block` выше сильнее браузерного `[hidden] { display: none; }`.
     Без явного возврата скрытый «Ещё» становился пустой шестой grid-ячейкой и
     переносился во второй ряд у ролей ровно с пятью доступными разделами. */
  #mnav .mobile-more-nav[hidden] { display: none !important; }

  #mnav [data-mobile-modules] > a[data-mobile-module],
  #mnav [data-mobile-modules] > details[data-mobile-module] > summary,
  #mnav .mobile-more-nav > summary {
    display: flex;
    align-items: stretch;
    justify-content: center;
    height: 4rem;
    min-width: 0;
    padding: .25rem .125rem;
    color: #64748b;
    font-size: 0;
    line-height: 1;
    list-style: none;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  #mnav [data-mobile-module] > summary::-webkit-details-marker,
  #mnav .mobile-more-nav > summary::-webkit-details-marker { display: none; }
  #mnav [data-mobile-modules] > a[data-mobile-module] > :not(.mobile-nav-face),
  #mnav [data-mobile-modules] > details[data-mobile-module] > summary > :not(.mobile-nav-face) {
    display: none !important;
  }

  #mnav .mobile-nav-face {
    display: flex;
    width: 100%;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .25rem;
    border-radius: .55rem;
    font-size: .625rem;
    font-weight: 500;
    line-height: 1;
  }
  #mnav .mobile-nav-icon {
    display: block;
    width: 1.35rem;
    height: 1.35rem;
    flex: 0 0 auto;
  }
  #mnav .mobile-nav-label {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #mnav [data-mobile-active="true"] > summary,
  #mnav a[data-mobile-active="true"],
  #mnav .mobile-more-nav[data-mobile-active="true"] > summary { color: var(--ui-accent); }
  #mnav [data-mobile-active="true"] > summary .mobile-nav-face,
  #mnav a[data-mobile-active="true"] .mobile-nav-face,
  #mnav .mobile-more-nav[data-mobile-active="true"] > summary .mobile-nav-face {
    font-weight: 600;
  }

  .mobile-nav-backdrop:not([hidden]) {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 39;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(15, 23, 42, .34);
  }

  #mnav details[data-mobile-module] > div,
  #mnav .mobile-more-panel {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    top: auto !important;
    bottom: calc(4rem + env(safe-area-inset-bottom)) !important;
    z-index: 55;
    width: 100% !important;
    min-width: 0 !important;
    max-height: min(72vh, 36rem);
    max-height: min(72dvh, 36rem);
    margin: 0 !important;
    padding: .35rem 0 .75rem;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border: 1px solid #e2e8f0;
    border-bottom: 0;
    border-radius: 1rem 1rem 0 0;
    background: #fff;
    box-shadow: 0 -12px 32px rgba(15, 23, 42, .14);
  }
  /* В «Ещё» модули становятся обычными строками, а их прежние dropdown-панели —
     вложенными аккордеонами внутри общей прокручиваемой шторки. */
  #mnav .mobile-more-panel > [data-mobile-module] {
    width: auto;
    margin: 0 !important;
  }
  #mnav .mobile-more-panel > a[data-mobile-module],
  #mnav .mobile-more-panel > details[data-mobile-module] > summary {
    height: 3.25rem;
    align-items: center;
    justify-content: flex-start;
    padding: 0 .875rem;
    border-bottom: 1px solid #e2e8f0;
    border-radius: 0;
    color: #0f172a;
  }
  #mnav .mobile-more-panel > a[data-mobile-module]:last-child,
  #mnav .mobile-more-panel > details[data-mobile-module]:last-child:not([open]) > summary {
    border-bottom: 0;
  }
  #mnav .mobile-more-panel .mobile-nav-face {
    width: auto;
    flex: 1 1 auto;
    flex-direction: row;
    justify-content: flex-start;
    gap: .7rem;
    padding: 0;
    font-size: .9rem;
    font-weight: 600;
  }
  #mnav .mobile-more-panel .mobile-nav-label { flex: 1 1 auto; }
  #mnav .mobile-more-panel > details[data-mobile-module] .mobile-nav-label {
    display: inline-flex;
    flex: 0 1 auto;
    align-items: center;
    gap: .35rem;
  }
  #mnav .mobile-more-panel .mobile-nav-icon {
    width: 1.25rem;
    height: 1.25rem;
  }
  #mnav .mobile-more-panel > details[data-mobile-module] .mobile-nav-label::after {
    content: "›";
    display: inline-block;
    color: #94a3b8;
    font-size: 1.25rem;
    line-height: 1;
    transition: transform .16s ease;
  }
  #mnav .mobile-more-panel > details[data-mobile-module][open] .mobile-nav-label::after {
    transform: rotate(90deg);
  }
  #mnav .mobile-more-panel > details[data-mobile-module] > summary::after {
    content: "";
    display: inline-flex;
    width: 2rem;
    height: 2rem;
    margin-left: .6rem;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    border-radius: .6rem;
    background-color: #f1f5f9;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M4 6l4 4 4-4' stroke='%2394a3b8' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: .875rem .875rem;
    transform-origin: center;
    transition: transform .16s ease;
  }
  #mnav .mobile-more-panel > details[data-mobile-module][open] > summary::after {
    transform: rotate(180deg);
  }
  #mnav .mobile-more-panel details[data-mobile-module] > div {
    position: static !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0;
    overflow: visible !important;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
  }
  #mnav details[data-mobile-module] > div > a {
    min-height: 2.75rem;
    padding: .68rem .875rem .68rem 2.95rem;
    border-bottom: 1px solid #f1f5f9;
    background: transparent;
  }
  #mnav details[data-mobile-module] > div > a:last-child {
    border-bottom: 0;
  }
  #mnav details[data-mobile-module] > div > div.border-t {
    display: none;
  }
  #mnav details[data-mobile-module] > div .nav-group-title {
    min-height: 2.75rem;
    padding: .68rem .875rem .68rem 2.95rem;
    border-bottom: 1px solid #f1f5f9;
    justify-content: flex-start;
    gap: .35rem;
  }
  #mnav details[data-mobile-module] > div .nav-group-title > span:first-child {
    order: 1;
  }
  #mnav details[data-mobile-module] > div .nav-group-title > svg {
    order: 2;
    margin-right: auto;
  }
  #mnav details[data-mobile-module] > div .nav-group-title > span:not(:first-child) {
    order: 3;
  }
  #mnav details[data-mobile-module] > div .nav-sub > a {
    min-height: 2.75rem;
    padding: .68rem .875rem .68rem 4rem;
    border-bottom: 1px solid #f1f5f9;
  }
  #mnav details[data-mobile-module] > div .nav-sub > a:last-child {
    border-bottom: 0;
  }
  #mnav .mobile-more-panel details[data-mobile-module] > div > a.bg-blue-50 {
    background: transparent !important;
    color: var(--ui-accent) !important;
  }
  #mnav .mobile-more-panel [data-mobile-active="true"] > summary .mobile-nav-face,
  #mnav .mobile-more-panel a[data-mobile-active="true"] .mobile-nav-face {
    background: transparent;
    box-shadow: none;
  }
}

/* Альбомный телефон: освобождаем высоту, сохраняя все разделы в нижней панели. */
@media (orientation: landscape) and (max-width: 1366px) and (hover: none),
       (orientation: landscape) and (max-width: 1366px) and (any-pointer: coarse) {
  #topnav > header.topnav-header {
    height: 3rem;
    min-height: 3rem;
  }
  #topnav .topnav-brand { order: 0; }
  #topnav .topnav-page-title { order: 1; }
  #topnav .topnav-account-mobile { order: 2; }
  body.has-mobile-bottom-nav {
    padding-bottom: calc(3rem + env(safe-area-inset-bottom));
  }
  #mnav [data-mobile-modules] > a[data-mobile-module],
  #mnav [data-mobile-modules] > details[data-mobile-module] > summary,
  #mnav .mobile-more-nav > summary {
    height: 3rem;
  }
  #mnav .mobile-nav-face {
    flex-direction: row;
    gap: .25rem;
  }
  #mnav .mobile-nav-icon {
    width: 1.1rem;
    height: 1.1rem;
  }
  .repricer-price-bar.stick-under-top {
    position: static;
    top: auto;
    bottom: auto;
  }
}

/* Общий контекст страницы: заголовок раздела, действия и вкладки соседних экранов.
   Классы `ui-*` — публичный переиспользуемый контракт. Старые `wms-*` оставлены
   алиасами, чтобы переносить остальные разделы постепенно и без изменения логики. */
.ui-page-lead {
  margin-top: .15rem;
  margin-bottom: .75rem;
  color: var(--ui-text-muted);
  font-size: .8rem;
  line-height: 1.4;
}
.ui-page-context,
.wms-context-tabs-wrap {
  position: sticky;
  top: var(--topnav-h, 0px);
  z-index: 25;
  width: 100%;
  max-width: none;
  margin: -1rem 0 1rem;
  background: var(--ui-surface-subtle);
}
.ui-content-standard,
.ui-page-context-inner,
.wms-context-inner {
  width: 100%;
  max-width: 1240px;
  margin-inline: auto;
}
.ui-table-breakout {
  width: 100%;
  margin-top: .25rem;
}
.ui-page-context-head,
.wms-context-heading {
  display: flex;
  min-height: 2.3rem;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  padding-bottom: .25rem;
}
.ui-page-title,
.ui-page-context-title,
.wms-context-title {
  padding: 0;
  color: var(--ui-text);
  font-size: 1.32rem;
  font-weight: 650;
  line-height: 1.25;
}
/* Системное пояснение page_title_hint из _macros.html.
   11.5px / 14.375px, цвет ui-text-soft, отступ от заголовка 12px.
   Автоматический баланс без ручных br; резерв 32px в конце слегка удлиняет
   первую строку. До 680px вторичное пояснение скрывается; --mobile сохраняет
   пояснения со ссылками/инструкциями отдельной строкой с отступом 8px. */
.ui-page-title-with-hint {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  min-width: 0;
}
/* Обёртка отдельного h1 и пояснения: заголовок остаётся самостоятельным. */
.ui-page-heading { flex: 1 1 auto; margin-bottom: 12px; }
.ui-page-heading > .ui-page-title { margin: 0; min-width: 0; padding-top: 0; }
/* Пояснение не сжимает название; длинный заголовок ограничен самим экраном. */
.ui-page-title-with-hint > :not(.ui-page-title-sub) {
  flex-shrink: 0;
  max-width: 100%;
}
.ui-page-title-sub {
  display: inline-block;
  /* При нехватке 320px рядом с названием переносим пояснение целиком,
     а не сжимаем текст в узкую вертикальную полосу. */
  flex: 1 1 320px;
  min-width: 0;
  color: var(--ui-text-soft);
  font-size: 11.5px;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 0;
  text-wrap: balance;
}
.ui-page-title-sub--compact { max-width: 180px; }
.ui-page-title-sub::after {
  content: "";
  display: inline-block;
  width: 32px;
}
@media (max-width: 680px) {
  .ui-page-title-sub { display: none; }
  .ui-page-title-with-hint:has(> .ui-page-title-sub--mobile) { flex-wrap: wrap; gap: 8px; }
  .ui-page-title-with-hint > .ui-page-title-sub--mobile {
    display: block;
    flex: 1 0 100%;
  }
}

.ui-page-title {
  min-height: 2.3rem;
  margin-top: 0;
  padding-top: .325rem;
}
@media (min-width: 768px) {
  .ui-page-context,
  .wms-context-tabs-wrap {
    margin-top: 0;
  }
}
.ui-page-context-tools,
.wms-context-tools {
  display: flex;
  align-items: center;
  gap: .4rem;
}
.wms-context-actions-disclosure {
  display: flex;
  min-width: 0;
  flex: 1 1 auto;
  justify-content: flex-end;
}
.wms-context-actions-toggle { display: none; }
@media (min-width: 768px) {
  .wms-context-actions-disclosure:not([open]) > .wms-context-tools { display: flex; }
}
.ui-page-context-search input,
.wms-context-search input {
  width: 7rem;
  min-height: 2rem;
  padding: .35rem .55rem;
  border: 1px solid #cbd5e1;
  border-radius: .55rem;
  background: var(--ui-surface);
  color: var(--ui-text);
  font-size: .78rem;
  outline: 0;
}
.ui-page-context-search input:focus,
.wms-context-search input:focus {
  border-color: var(--ui-accent);
  box-shadow: 0 0 0 2px var(--ui-accent-soft);
}
.ui-page-context-action,
.wms-context-action {
  display: inline-flex;
  min-height: 2rem;
  align-items: center;
  justify-content: center;
  padding: .35rem .7rem;
  border-radius: .55rem;
  border: 1px solid transparent;
  background: var(--ui-accent);
  color: #fff;
  font-size: .78rem;
  font-weight: 400;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(20, 26, 40, .05);
}
.ui-page-context-action:hover,
.wms-context-action:hover { background: var(--ui-accent-hover); }
.ui-page-context-action.is-secondary,
.wms-context-action.is-secondary {
  border: 1px solid var(--ui-border-strong);
  background: var(--ui-surface);
  color: #475569;
}
.ui-page-context-action.is-secondary:hover,
.wms-context-action.is-secondary:hover {
  border-color: #94a3b8;
  background: #f8fafc;
  color: #334155;
}
.wms-context-fbs-actions form { display: flex; }
.wms-context-fbs-actions { flex-wrap: nowrap; }
.wms-context-fbs-actions .wms-context-action {
  box-sizing: border-box;
  height: 2.25rem;
  min-height: 2.25rem;
}
.ui-page-tabs,
.wms-context-tabs {
  display: flex;
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  border-bottom: 1px solid var(--ui-border);
  -webkit-overflow-scrolling: touch;
}
.ui-page-tabs::-webkit-scrollbar,
.wms-context-tabs::-webkit-scrollbar { display: none; }
.ui-page-tabs > a,
.wms-context-tabs > a {
  flex: 1 0 7.5rem;
  min-height: 2.85rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .62rem .95rem .52rem;
  border-bottom: 3px solid transparent;
  color: #64748b;
  font-size: .92rem;
  font-weight: 600;
  line-height: 1.15;
  text-align: center;
  white-space: nowrap;
  gap: .4rem;
}
.ui-page-tabs > a.is-compact,
.wms-context-tabs > a.is-compact {
  flex-grow: .65;
  flex-basis: 5.5rem;
}
.ui-page-tabs > a:hover,
.wms-context-tabs > a:hover { color: var(--ui-accent); }
.ui-page-tabs > a.is-active,
.wms-context-tabs > a.is-active {
  border-bottom-color: var(--ui-accent);
  color: var(--ui-accent);
}
.ui-page-tab-count,
.wms-context-count {
  display: inline-flex;
  min-width: 1.15rem;
  height: 1.15rem;
  align-items: center;
  justify-content: center;
  padding: 0 .28rem;
  border-radius: 999px;
  background: #e2e8f0;
  color: #475569;
  font-size: .66rem;
  line-height: 1;
}
.ui-page-tab-count.hidden,
.wms-context-count.hidden { display: none; }
.wms-menu-counter {
  display: inline-flex;
  align-items: baseline;
  gap: .2rem;
  color: #94a3b8;
  font-size: .68rem;
  line-height: 1;
  white-space: nowrap;
}
.wms-menu-counter.hidden { display: none; }
.wms-menu-counter-value {
  color: #64748b;
  font-size: .72rem;
  font-weight: 700;
}
.wms-menu-counter-value.is-alert { color: #e11d48; }

/* Количество в заголовках WB/Ozon/ЯМ не наследует серый uppercase-цвет summary. */
.returns-pickup-count {
  color: #0f172a !important;
  font-weight: 700 !important;
}
.returns-pickup-reason {
  display: block;
  max-width: 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Пик поставки в общей шапке: 8px внутри, 32px до поиска с учётом
   gap 6.4px у wms-context-tools. Сообщение занимает отдельный полный ряд. */
.supply-scan--context {
  display: grid;
  grid-template-columns: auto minmax(100px, 240px) auto;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0 25.6px 0 0;
}
.supply-scan--context label { white-space: nowrap; }
.supply-scan--context [data-supply-scan-input] { width: 100%; }
.supply-scan--context [data-supply-scan-msg] { grid-column: 1 / -1; }
.supply-scan--context [data-supply-scan-msg]:empty { display: none; }
@media (max-width: 767px) {
  .supply-scan.supply-scan--context {
    display: flex;
    flex-wrap: wrap;
    /* Как от линии вкладок до блока: симметричный интервал 16px. */
    margin: 0 0 16px;
  }
  .supply-scan--context [data-supply-scan-input] { width: auto; }
}
.shipments-controls {
  display: block;
}
@media (max-width: 767px),
       (orientation: landscape) and (max-width: 1366px) and (hover: none),
       (orientation: landscape) and (max-width: 1366px) and (any-pointer: coarse) {
  .supply-scan { margin-bottom: .5rem; }
  .supply-scan [data-supply-scan-msg]:empty { display: none; }
}
.ui-filter-row,
.shipments-statuses,
.wms-filter-row {
  display: flex;
  width: 100%;
  align-items: center;
  flex-wrap: nowrap;
  gap: .3rem;
  min-width: 0;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.ui-filter-row::-webkit-scrollbar,
.shipments-statuses::-webkit-scrollbar,
.wms-filter-row::-webkit-scrollbar { display: none; }
.ui-filter-row > *,
.wms-filter-row > * { flex: 0 0 auto; }
.ui-filter-chip,
.shipments-status,
.wms-filter-chip,
.pick-view-btn {
  flex: 0 0 auto;
  padding: .34rem .68rem;
  border: 1px solid var(--ui-border);
  border-radius: 999px;
  background: var(--ui-surface-subtle);
  color: #475569;
  font-size: .75rem;
  font-weight: 400;
  line-height: 1.1;
  white-space: nowrap;
}
.ui-filter-chip:hover,
.shipments-status:hover,
.wms-filter-chip:hover,
.pick-view-btn:hover {
  border-color: #cbd5e1;
  background: #f1f5f9;
  color: var(--ui-filter-active);
}
.ui-filter-chip.is-active,
.shipments-status.is-active,
.wms-filter-chip.is-active,
.pick-view-btn.bg-blue-600 {
  border-color: var(--ui-filter-active);
  background: var(--ui-filter-active);
  color: #fff;
}
.ui-filter-chip > .ui-filter-count,
.shipments-status > .ui-filter-count,
.wms-filter-chip > .ui-filter-count {
  margin-left: .18rem;
  padding: 0 .28rem;
  border-radius: 999px;
  color: inherit;
  font-size: .68rem;
  font-weight: 400;
}
.ui-filter-chip.is-active > .ui-filter-count,
.shipments-status.is-active > .ui-filter-count,
.wms-filter-chip.is-active > .ui-filter-count {
  background: rgba(255, 255, 255, .18);
  color: #fff;
}
.ui-filter-label,
.wms-filter-label {
  color: var(--ui-text-soft);
  font-size: .72rem;
  white-space: nowrap;
}
.ui-filter-row--neutral .ui-filter-chip.is-active {
  border-color: var(--ui-filter-active);
  background: var(--ui-filter-active);
  color: #fff;
}
.ui-filter-row--neutral .ui-filter-chip:hover {
  border-color: var(--ui-border-strong);
  background: var(--ui-surface-muted);
  color: var(--ui-text-muted);
}
.ui-filter-row--neutral .ui-filter-chip.is-active:hover {
  border-color: var(--ui-filter-active);
  background: var(--ui-filter-active);
  color: #fff;
}
.ui-filter-row--neutral .ui-filter-chip.is-active > .ui-filter-count {
  background: rgba(255, 255, 255, .18);
  color: #fff;
}
.ui-segmented {
  box-sizing: border-box;
  display: inline-flex;
  height: 2.25rem;
  overflow: hidden;
  border: 0 !important;
  border-radius: .5rem;
  background: #fff;
  box-shadow: inset 0 0 0 1px #cbd5e1;
  font-size: .875rem;
}
.ui-segmented-item {
  position: relative;
  box-sizing: border-box;
  display: inline-flex;
  height: 2.25rem;
  padding: 0 .75rem;
  align-items: center;
  justify-content: center;
  color: #475569;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.ui-segmented-item.is-active {
  z-index: 1;
  background: var(--ui-accent);
  color: #fff;
  box-shadow: 0 0 0 1px var(--ui-accent);
}
.ui-segmented-item:not(.is-active):hover {
  background: #f8fafc;
  color: #334155;
  box-shadow: inset 0 1px 0 #cbd5e1, inset 0 -1px 0 #cbd5e1;
}
.ui-segmented-item:first-child:not(.is-active):hover {
  box-shadow: inset 1px 0 0 #cbd5e1, inset 0 1px 0 #cbd5e1, inset 0 -1px 0 #cbd5e1;
}
.ui-segmented-item:last-child:not(.is-active):hover {
  box-shadow: inset -1px 0 0 #cbd5e1, inset 0 1px 0 #cbd5e1, inset 0 -1px 0 #cbd5e1;
}
.wms-org-filter .wms-filter-chip,
.fbs-stage-filter .wms-filter-chip,
.wms-stage-filter .ui-filter-chip {
  padding: 5px 10px;
  border-color: transparent;
  background: #f0f2f7;
  color: #59616f;
  font-size: 12px;
  font-weight: 550;
}
.wms-org-filter .wms-filter-chip:hover {
  border-color: transparent;
  background: #e7eaf1;
  color: var(--ui-filter-active);
}
.wms-org-filter .wms-filter-chip {
  color: var(--ui-filter-active);
}
.fbs-stage-filter .wms-filter-chip:hover,
.wms-stage-filter .ui-filter-chip:hover {
  border-color: transparent;
  background: #e7eaf1;
  color: var(--ui-filter-active);
}
.wms-org-filter .wms-filter-chip.is-active,
.wms-org-filter .wms-filter-chip.is-active:hover {
  border-color: var(--ui-filter-active);
  background: var(--ui-filter-active);
  color: #fff;
  font-weight: 550;
  box-shadow: none;
}
.fbs-stage-filter .wms-filter-chip.is-active,
.fbs-stage-filter .wms-filter-chip.is-active:hover,
.wms-stage-filter .ui-filter-chip.is-active,
.wms-stage-filter .ui-filter-chip.is-active:hover {
  border-color: var(--ui-filter-active);
  background: var(--ui-filter-active);
  color: #fff;
  font-weight: 550;
  box-shadow: none;
}
.wms-org-filter .wms-filter-chip.is-active > .ui-filter-count,
.fbs-stage-filter .wms-filter-chip.is-active > .ui-filter-count,
.wms-stage-filter .ui-filter-chip.is-active > .ui-filter-count {
  border-color: rgba(255, 255, 255, .45);
  background: rgba(255, 255, 255, .18);
  color: #fff;
}

/* FBS: организация — последняя группа общего ряда фильтров, прижатая вправо.
   Стадии и организация используют единый нейтральный системный выбор.
   Фиксированные размеры чипов остаются общими: 30px. */
.fbs-stage-filter > .fbs-stage-org-filter {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .3rem;
  margin-left: auto;
}
.fbs-stage-filter > .fbs-stage-org-filter .wms-filter-chip:hover {
  border-color: transparent;
  background: #e7eaf1;
  color: var(--ui-filter-active);
}
.fbs-stage-filter > .fbs-stage-org-filter .wms-filter-chip.is-active,
.fbs-stage-filter > .fbs-stage-org-filter .wms-filter-chip.is-active:hover {
  border-color: var(--ui-filter-active);
  background: var(--ui-filter-active);
  color: #fff;
  box-shadow: none;
}
.fbs-stage-filter > .fbs-stage-org-filter .wms-filter-chip.is-active > .ui-filter-count {
  border-color: rgba(255, 255, 255, .45);
  background: rgba(255, 255, 255, .18);
  color: #fff;
}

/* Вложенный ряд стадий не меняет прежнюю серую палитру организаций. Отдельный
   класс фиксирует этот контракт и не даёт индиго-стилю стадии победить каскадом. */
.fbs-stage-org-filter .fbs-org-chip {
  border-color: transparent;
  background: #f0f2f7;
  color: var(--ui-filter-active);
}
.fbs-stage-org-filter .fbs-org-chip.is-active,
.fbs-stage-org-filter .fbs-org-chip.is-active:hover {
  border-color: var(--ui-filter-active);
  background: var(--ui-filter-active);
  color: #fff;
}

/* Универсальная шапка табличного списка. Цвет совпадает с «Каталогом магазинов»;
   конкретная страница отвечает только за ширины и состав колонок. */
main table > thead,
main table > thead > tr,
main table > thead > tr > th,
.ui-table-head {
  background-color: var(--ui-surface-muted);
}
.ui-table-head {
  color: var(--ui-text-muted);
}
.ui-table-head > tr {
  border-bottom-color: var(--ui-border);
  background: var(--ui-surface-muted);
}
.ui-table-head > tr > th {
  background: var(--ui-surface-muted);
  color: inherit;
}

/* Единая компактная плотность больших таблиц на desktop. Работа с таблицей остаётся
   на всю ширину, но типографика и внутренние отступы больше не раздувают строки.
   Короткие числовые/центрированные колонки забирают ширину по содержимому, а свободное
   место остаётся основным текстовым колонкам. `text-xs` и специальные плотные таблицы
   не увеличиваем; мобильная карточная адаптация ниже сохраняет свои размеры. */
@media (min-width: 768px) {
  main table.text-sm {
    font-size: var(--ui-table-text-size);
    line-height: 1.35;
  }
  main table.text-sm > :is(thead, tbody, tfoot) > tr > :is(th, td) {
    padding: var(--ui-table-cell-y) var(--ui-table-cell-x);
  }
  main table.text-sm > thead > tr > th {
    font-size: var(--ui-table-head-size);
    line-height: 1.25;
  }
  main table.text-sm > thead > tr > th:is(.text-right, .text-center, [data-sort="num"]) {
    width: 1%;
    white-space: nowrap;
  }
}
/* Мобильные широкие таблицы остаются таблицами с горизонтальным свайпом, но
   используют более плотную типографику. Карточные `.responsive` уплотняются
   отдельно в своём блоке ниже. */
@media (max-width: 767px) {
  #products-table { min-width: 1700px; }
  main table.text-sm:not(.responsive) {
    font-size: .75rem;
    line-height: 1.2;
  }
  main table.text-sm:not(.responsive) > :is(thead, tbody, tfoot) > tr > :is(th, td) {
    padding: .25rem .375rem;
  }
  main table.text-sm:not(.responsive) > thead > tr > th {
    font-size: .625rem;
    line-height: 1.15;
  }
}
.ui-notification-shortcut,
.fbs-critical-action,
.wms-registry-shortcut {
  display: inline-flex;
  width: auto;
  min-height: 0;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-start;
  gap: .28rem;
  padding: .15rem .1rem;
  border: 0;
  border-bottom: 1px dashed #fda4af;
  border-radius: 0;
  background: transparent;
  color: #be123c;
  font-size: .78rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}
.ui-notification-shortcut:hover,
.fbs-critical-action:hover,
.wms-registry-shortcut:hover {
  border-bottom-color: #e11d48;
  background: transparent;
  color: #9f1239;
}
.ui-notification-shortcut b,
.fbs-critical-action b,
.wms-registry-shortcut b {
  min-width: 1.15rem;
  padding: .05rem .28rem;
  border-radius: 999px;
  background: #ffe4e6;
  color: inherit;
  font-size: .68rem;
  line-height: 1.2;
  text-align: center;
}
.fbs-adopt-warning {
  margin-bottom: .75rem;
  padding: .75rem;
}
.fbs-adopt-warning-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem .65rem;
  margin-bottom: .45rem;
}
.fbs-adopt-warning-head > b {
  font-size: .88rem;
  line-height: 1.25;
}
.fbs-adopt-warning-head .help { flex: 0 0 auto; }
.fbs-future-note {
  margin-bottom: .75rem;
  padding: .5rem .7rem;
  border: 1px solid #a5b4fc;
  border-radius: .55rem;
  background: #f8fafc;
}
.fbs-future-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .35rem;
  color: #475569;
  font-size: .78rem;
  line-height: 1.25;
}
.fbs-future-title {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: .35rem;
}
.fbs-future-head b {
  color: #4f46e5;
  font-weight: 600;
  white-space: nowrap;
}
.fbs-future-days-block { min-width: 0; }
/* ⭐⭐⭐ «ДО СКОЛЬКИ СЕГОДНЯ» (владелец 29.08): пометка сборщику рядом со счётчиком
   ждущих. Час у каждой площадки свой, поэтому идут отдельными кусочками, а источник
   («по заказам» / «наш склад») подписан мелким — сборщик обязан видеть, откуда число.
   ⚠️ Своими классами, а не утилитами Tailwind: сборка статическая, класса нет в
   `static/app.css` → правило молча не сработает. */
.fbs-cutoff-note {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: .3rem .45rem;
  margin-left: .15rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.fbs-cutoff-note::-webkit-scrollbar { display: none; }
.fbs-cutoff-item {
  display: inline-flex;
  align-items: baseline;
  gap: .32rem;
  padding: .1rem .4rem;
  border: 1px solid #cbd5e1;
  border-radius: .35rem;
  background: transparent;
  color: #475569;
  font-size: .72rem;
  line-height: 1.3;
  white-space: nowrap;
}
.fbs-cutoff-item:hover { background: var(--ui-accent-soft, #eef2ff); }
/* ⭐⭐⭐ ВЫБРАННЫЙ КАНАЛ ЗАЛИТ, КАК ОСТАЛЬНЫЕ ФИЛЬТРЫ СТРАНИЦЫ (владелец 05.09: «должен
   выделяться заливкой, как и остальные фильтры на странице»). Палитра — та же, что у
   `.ui-filter-chip.is-active` (ui-choice.css): фильтр обязан выглядеть одинаково везде,
   иначе человек не узнаёт в нём фильтр. Своих цветов здесь не заводим. */
.fbs-cutoff-item.is-active {
  border-color: var(--ui-filter-active, #4a5567);
  background: var(--ui-filter-active, #4a5567);
  color: #fff;
  font-weight: 550;
}
.fbs-cutoff-item.is-active:hover {
  border-color: var(--ui-filter-active, #4a5567);
  background: var(--ui-filter-active, #4a5567);
}
.fbs-cutoff-item.is-active b,
.fbs-cutoff-item.is-active .fbs-cutoff-count { color: #fff; }
.fbs-cutoff-count { color: #94a3b8; font-size: .66rem; }
.fbs-cutoff-item b { color: #1e293b; font-weight: 600; }
.fbs-cutoff-src { color: #94a3b8; font-size: .66rem; }
.fbs-future-days {
  display: flex;
  align-items: center;
  gap: .3rem;
  margin-top: .4rem;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}
.fbs-future-days::-webkit-scrollbar { display: none; }
.fbs-future-label {
  flex: 0 0 auto;
  color: #64748b;
  font-size: .75rem;
  white-space: nowrap;
}
@media (max-width: 767px) {
  .fbs-future-label { font-size: .68rem; }
}
.fbs-future-cancelled {
  max-width: 10rem;
  color: #94a3b8;
  font-size: .61rem;
  line-height: 1.18;
  text-align: right;
}
.fbs-future-cancelled-mobile {
  display: block;
  white-space: nowrap;
}
.fbs-future-cancelled-desktop { display: none; }
.fbs-future-cancelled-inline { display: none; }
.fbs-future-corner { display: none; }
.fbs-future-open-warning {
  grid-column: 1 / -1;
  max-width: none;
  margin-top: .2rem;
  color: #b45309;
  font-size: .67rem;
  line-height: 1.25;
  text-align: left;
}
.fbs-future-open-warning-mobile {
  min-width: 0;
  flex: 1 1 11rem;
  color: #b45309;
  font-size: .61rem;
  font-weight: 400;
  line-height: 1.18;
}
.fbs-future-open-warning-desktop { display: none; }
.fbs-future-day {
  flex: 0 0 auto;
  padding: .25rem .55rem;
  border: 1px solid #cbd5e1;
  border-radius: 999px;
  background: #fff;
  color: #475569;
  font-size: .7rem;
  line-height: 1.1;
  white-space: nowrap;
}
.fbs-future-day:hover { background: #f1f5f9; }
.fbs-future-day-date { font-weight: 700; }
.fbs-future-day.is-open {
  border-color: #f59e0b;
  background: #f59e0b;
  color: #fff;
}
.fbs-future-day.is-disabled {
  cursor: default;
  color: #64748b;
}
/* «Сейчас · N» — заказы сегодняшней сдачи и просрочки. Не кнопка: открывать этот день
   не нужно, он и так открыт, а взятие живёт в панели «В работу целиком» ниже. Стоит в
   ряду дней только затем, чтобы сумма чипов сходилась с чипом «Новый» (вопрос владельца
   05.09). Поэтому вид спокойный — подпись, а не действие: без hover и без указателя. */
.fbs-future-day.is-now {
  cursor: default;
  border-color: var(--ui-accent, #4f46e5);
  color: var(--ui-accent, #4f46e5);
  background: var(--ui-accent-soft, #eef2ff);
  font-weight: 500;
}
.fbs-future-day.is-now:hover { background: var(--ui-accent-soft, #eef2ff); }
.fbs-orders-table {
  width: 100%;
  max-width: 100%;
  table-layout: auto;
}
/* Цвет, граница и типографика шапки приходят из общего `.ui-table-head`.
   FBS здесь сохраняет только предметное исключение колонки «Поставка». */
.fbs-orders-table thead .fbs-order-col-supply { color: inherit; }
.fbs-orders-table th,
.fbs-orders-table td {
  min-width: 0;
  vertical-align: top;
}
.fbs-orders-table tbody tr { transition: background-color .12s ease; }
.fbs-orders-table tbody tr:hover { background: #f8fafc; }
.fbs-order-select { width: 2.75rem; }
.fbs-orders-table:not(.has-select) .fbs-order-select { display: none; }
table.fbs-orders-table td.fbs-order-col-actions.is-empty { display: none !important; }
.fbs-orders-table:not(.has-actions) .fbs-order-col-actions { display: none; }
.fbs-order-id {
  display: flex;
  align-items: center;
  gap: .35rem;
  color: #1e293b;
  font-size: .82rem;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.fbs-order-id > span:last-child {
  flex: 0 0 auto;
  font-size: .75rem;
  line-height: 1.15;
  white-space: nowrap;
}
.fbs-order-id > span:first-child { flex: 0 0 auto; }
.fbs-order-number,
.fbs-order-number:any-link,
.fbs-order-number a {
  color: inherit !important;
  font-family: inherit !important;
  font-size: .73rem !important;
  font-style: normal !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  text-decoration: none !important;
  -webkit-text-decoration: none !important;
}
.fbs-order-created,
.fbs-order-rid,
.fbs-order-warehouse,
.fbs-order-place {
  margin-top: .18rem;
  color: #94a3b8;
  font-size: .68rem;
  line-height: 1.25;
}
.fbs-order-rid {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.fbs-order-schedule-values,
.fbs-order-context-values,
.fbs-order-state-values,
.fbs-order-product-values { min-width: 0; }
.fbs-order-handover {
  display: flex;
  align-items: center;
  gap: .3rem;
  margin-top: .25rem;
  color: #94a3b8;
  font-size: .68rem;
}
.fbs-order-handover strong {
  color: #475569;
  font-size: .72rem;
  font-weight: 600;
}
.fbs-order-handover strong.is-later {
  padding: .08rem .3rem;
  border-radius: .3rem;
  background: #f1f5f9;
  font-weight: 500;
}
.ui-lock {
  position: relative;
  display: inline-block;
  width: .68rem;
  height: .52rem;
  margin-inline: .02rem;
  border: 1.35px solid currentColor;
  border-radius: .18rem;
  color: #94a3b8 !important;
  vertical-align: -.04rem;
}
.ui-lock::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -.39rem;
  width: .38rem;
  height: .36rem;
  border: 1.35px solid currentColor;
  border-bottom: 0;
  border-radius: .4rem .4rem 0 0;
  transform: translateX(-50%);
}
.ui-lock::after {
  content: "";
  position: absolute;
  left: 50%;
  top: .15rem;
  width: .1rem;
  height: .16rem;
  border-radius: 999px;
  background: currentColor;
  transform: translateX(-50%);
}
.fbs-order-product-values > b {
  display: block;
  overflow-wrap: anywhere;
  color: #1e293b;
  font-size: .82rem;
  line-height: 1.25;
}
.fbs-order-context-values > div:first-child {
  color: #475569;
  font-size: .78rem;
}
.fbs-order-place { color: #64748b; }
.fbs-order-state-values > span:first-child { display: inline-flex; }
.fbs-order-col-supply {
  color: #475569;
  font-size: .72rem;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.fbs-mobile-inline-label { display: none; }
table.fbs-orders-table td.fbs-order-mobile-meta { display: none; }
.stock-upload-history {
  width: 100%;
  flex: 0 0 100%;
  order: 3;
}
.stock-history-label-mobile { display: none; }
.stock-lead-line:not(:last-child)::after { content: " "; }
.stock-mobile-export { display: none; }
.stock-heading-compact { display: none; }
.stock-toolbar-select {
  box-sizing: border-box;
  min-width: 10rem;
  max-width: 15rem;
  min-height: 2.25rem;
  padding: .45rem 2rem .45rem .7rem;
  border: 1px solid #cfd6e2;
  border-radius: .6rem;
  appearance: none;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236b7280' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right .65rem center;
  background-size: .8rem;
  color: #334155;
  font-size: .78rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
  cursor: pointer;
}
.stock-toolbar-select:hover { border-color: #aeb8c8; }
.stock-toolbar-select:focus {
  border-color: #6366f1;
  outline: 2px solid rgba(99, 102, 241, .16);
  outline-offset: 1px;
}
.stock-toolbar-select optgroup {
  color: #475569;
  font-size: .75rem;
  font-weight: 650;
}
.stock-toolbar-select option {
  color: #334155;
  font-size: .78rem;
  font-weight: 400;
}
.stock-toolbar-place { max-width: 13rem; }
.stock-toolbar .ss-wrap {
  min-width: 10rem;
  max-width: 15rem;
  flex: 0 1 15rem;
}
.stock-toolbar .ss-wrap:has(> .stock-toolbar-place) {
  max-width: 13rem;
  flex-basis: 13rem;
}
.stock-toolbar .ss-caret {
  display: inline-flex;
  width: .8rem;
  height: .8rem;
  align-items: center;
  justify-content: center;
}
.stock-toolbar .ss-caret svg { width: 100%; height: 100%; }
.stock-toolbar .ss-panel {
  right: auto;
  width: max(100%, 18rem);
  max-width: min(20rem, calc(100vw - 1rem));
}
.stock-toolbar .ss-search {
  box-sizing: border-box;
  height: 2rem;
  margin-bottom: .25rem;
  padding: .35rem .5rem;
  border: 1px solid #e2e8f0;
  border-radius: .45rem;
  background: #f8fafc;
  color: #334155;
  font-size: .75rem;
}
.stock-toolbar .ss-list { max-height: 15rem; }
.stock-toolbar .ss-group {
  padding: .48rem .5rem .25rem;
  background: #fff;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .035em;
  line-height: 1.2;
  text-transform: uppercase;
}
.stock-toolbar .ss-group:not(:first-child) {
  margin-top: .2rem;
  border-top: 1px solid #edf0f5;
}
.stock-toolbar .ss-opt-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
@media (min-width: 481px) {
  .stock-service-controls,
  .stock-service-disclosure,
  .stock-service-content {
    display: contents;
  }
  .stock-service-summary { display: none; }
  details.stock-service-disclosure:not([open]) > .stock-service-content { display: contents; }
}
@media (min-width: 768px) {
  /* На desktop оболочка только группирует DOM для мобильного инлайна: её дети
     остаются самостоятельными элементами общей flex-шапки. */
  .stock-page-intro { display: contents; }
  /* На desktop контекстная шапка не прыгает из потока в sticky-состояние при первом
     скролле; места достаточно, а закреплённая копия ещё и перекрывала заголовок таблицы. */
  .ui-page-context,
  .wms-context-tabs-wrap {
    position: static;
    margin-top: 0;
    padding-top: .25rem;
  }
  .ui-page-context-head,
  .wms-context-heading {
    height: 2.5rem;
    min-height: 2.5rem;
    padding-bottom: .5rem;
  }
  .ui-page-tabs > a,
  .wms-context-tabs > a {
    flex: 0 0 auto;
    min-width: 7.25rem;
    min-height: 2.65rem;
    padding: .55rem 1rem .48rem;
  }
  .ui-page-tabs > a.is-compact,
  .wms-context-tabs > a.is-compact {
    flex: 0 0 auto;
    min-width: 5.25rem;
  }
  .wms-context-search input { width: 13rem; }
  .fbs-future-note {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    min-width: 0;
    align-items: center;
    gap: .45rem 1rem;
  }
  .fbs-future-head { display: contents; }
  .fbs-future-title {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  /* На стадиях после «Новых» нет ряда будущих дат: отсечка и её
     общая подсказка занимают один grid-ряд, а не резервируют пустую
     вторую строку. */
  .fbs-future-note--cutoff-only .fbs-future-title {
    grid-column: 1;
  }
  .fbs-future-days-block {
    grid-column: 1;
    grid-row: 2;
    min-width: 0;
  }
  .fbs-future-days {
    margin-top: 0;
  }
  .fbs-future-note:has(.fbs-future-open-warning-desktop) .fbs-future-days {
    gap: .2rem;
  }
  .fbs-future-note:has(.fbs-future-open-warning-desktop) .fbs-future-day {
    padding: .2rem .38rem;
    font-size: .66rem;
  }
  .fbs-future-corner {
    display: flex;
    grid-column: 2;
    grid-row: 2;
    align-self: end;
    align-items: center;
    justify-content: flex-end;
    gap: .65rem;
  }
  .fbs-future-note--cutoff-only .fbs-future-corner {
    grid-row: 1;
    align-self: center;
  }
  .fbs-future-corner > .help { order: 2; }
  .fbs-future-cancelled {
    max-width: none;
    margin-left: 0;
    font-size: .72rem;
    line-height: 1.25;
    white-space: nowrap;
  }
  .fbs-future-open-warning {
    width: 22rem;
    max-width: 34%;
    margin: 0 0 0 auto;
    flex: 0 0 22rem;
    color: #b45309;
    font-size: .61rem;
    line-height: 1.2;
    text-align: right;
    white-space: normal;
  }
  .fbs-future-open-warning-mobile { display: none; }
  .fbs-future-open-warning-desktop { display: block; }
  .fbs-future-cancelled-mobile { display: none; }
  .fbs-future-cancelled-desktop {
    display: inline;
    flex: 0 0 auto;
    margin-left: auto;
  }

  /* Одна строка заказа держит единый вертикальный ритм: между основным значением и
     уточнением всегда 4px. Раньше срок, товар, склад и статус имели каждый свой
     margin (0–4px), поэтому даже внутри одной строки подписи визуально «прыгали». */
  .fbs-order-created,
  .fbs-order-rid { margin-top: .25rem; }
  .fbs-order-schedule-values,
  .fbs-order-product-values,
  .fbs-order-context-values,
  .fbs-order-state-values {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: .25rem;
  }
  /* В колонке «Статус» flex-column по умолчанию растягивал короткую плашку
     «Новый» на всю ширину ячейки. Фон должен заканчиваться вместе с текстом. */
  table.fbs-orders-table .fbs-order-state-values {
    align-items: flex-start;
  }
  table.fbs-orders-table .fbs-order-state-values > span:first-child {
    width: fit-content;
    max-width: 100%;
  }
  .fbs-order-schedule-values { line-height: 1.25; }
  .fbs-order-schedule-values .fbs-dl-ok { padding-left: 0; }
  .fbs-order-handover,
  .fbs-order-product-values > div,
  .fbs-order-warehouse,
  .fbs-order-place,
  .fbs-order-state-values > div {
    margin-top: 0 !important;
  }
}
@media (max-width: 767px) {
  .ui-page-context,
  .wms-context-tabs-wrap {
    width: auto;
    margin-left: -.5rem;
    margin-right: -.5rem;
    padding: 0 .5rem;
  }
  /* На mobile верхние действия FBMP/FBS свёрнуты в общий плюс справа от
     вкладок. Весь ряд остаётся sticky, а раскрытая панель не меняет его высоту. */
  .wms-context-tabs-wrap.is-supplies {
    display: block;
    position: sticky;
    top: var(--topnav-h, 0px);
    z-index: 25;
    margin-top: -.5rem;
    margin-bottom: 1rem;
  }
  .wms-context-tabs-wrap.is-supplies > .wms-context-inner {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 46px;
    align-items: stretch;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-heading {
    display: contents;
    min-height: 0;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-disclosure {
    position: relative;
    display: block;
    grid-column: 2;
    grid-row: 1;
    border-bottom: 1px solid var(--ui-border);
  }
  .wms-context-tabs-wrap.is-supplies > .wms-context-inner:not(:has(.wms-context-action)) {
    grid-template-columns: minmax(0, 1fr);
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-disclosure:not(:has(.wms-context-action)) {
    display: none;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-toggle {
    box-sizing: border-box;
    display: flex;
    width: 32px;
    height: 32px;
    margin: 7px;
    align-items: center;
    justify-content: center;
    list-style: none;
    border: 1px solid var(--ui-border-strong);
    border-radius: .5rem;
    background: transparent;
    color: var(--ui-accent);
    cursor: pointer;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-toggle::-webkit-details-marker {
    display: none;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-toggle .ui-action-icon {
    width: 18px;
    height: 18px;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-toggle:focus-visible {
    outline: 2px solid var(--ui-accent-line);
    outline-offset: -2px;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-disclosure[open] > .wms-context-actions-toggle {
    border-color: var(--ui-accent-line);
    background: transparent;
    color: var(--ui-accent-hover);
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-disclosure:not([open]) > .wms-context-tools {
    display: none;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-disclosure[open] > .wms-context-tools {
    box-sizing: border-box;
    position: absolute;
    z-index: 35;
    top: calc(100% + .25rem);
    right: 0;
    display: flex;
    width: min(15rem, calc(100vw - 1rem));
    min-width: 0;
    max-width: calc(100vw - 1rem);
    align-items: stretch;
    flex-direction: column;
    gap: .25rem;
    padding: .5rem;
    border: 1px solid var(--ui-border);
    border-radius: .65rem;
    background: #fff;
    box-shadow: 0 10px 28px rgb(15 23 42 / 14%);
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-disclosure[open] :is(.wms-context-action, .wms-context-search, .wms-context-search input) {
    width: 100%;
    max-width: none;
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-actions-disclosure[open] .wms-context-search {
    display: block;
    flex: 0 0 auto;
    margin: 0;
  }
  .wms-context-tabs-wrap.is-supplies > .wms-context-inner > .wms-context-tabs {
    position: static;
    grid-column: 1;
    grid-row: 1;
    width: auto;
    margin-left: -.5rem;
    margin-right: 0;
    margin-bottom: 0;
    padding-right: .5rem;
    padding-left: .5rem;
    overflow-x: hidden;
    background: var(--ui-surface-subtle);
  }
  .wms-context-tabs-wrap.is-supplies .wms-context-tabs > a {
    min-width: 0;
    flex-shrink: 1;
    padding-right: .5rem;
    padding-left: .5rem;
  }
  .ui-page-context-tools,
  .wms-context-tools {
    margin-left: auto;
    justify-content: flex-end;
  }
  .shipments-statuses {
    width: 100%;
  }
  .shipments-status,
  .wms-filter-chip {
    padding-inline: .62rem;
  }
  .wms-context-fbs-actions {
    gap: .25rem;
  }
}
@media (max-width: 480px) {
  /* FBM: название раздела, поиск и главное действие — одна строка. Поиск получает
     остаток ширины и сжимается, поэтому кнопка остаётся справа, а не падает вниз. */
  .ui-page-context-head,
  .wms-context-heading {
    flex-wrap: nowrap;
    gap: .35rem;
  }
  .ui-page-title {
    font-size: 1rem;
  }
  .ui-page-context-title,
  .wms-context-title {
    flex: 0 0 auto;
    font-size: 1rem;
  }
  .ui-page-context-tools,
  .wms-context-tools {
    width: auto;
    min-width: 0;
    margin-left: auto;
    flex: 1 1 auto;
  }
  .ui-page-context-search,
  .wms-context-search {
    min-width: 0;
    flex: 1 1 auto;
  }
  .ui-page-context-search input,
  .wms-context-search input {
    width: 100%;
    min-width: 0;
  }
  .wms-context-search input,
  .wms-context-search + .wms-context-action,
  .wms-context-action.is-mobile-compact {
    min-height: 1.75rem;
    padding: .28rem .45rem;
    font-size: .68rem;
  }
  .wms-context-search {
    max-width: 8.125rem;
    flex: 0 1 8.125rem;
  }
  .wms-mobile-lead {
    font-size: .75rem;
    line-height: 1.35;
  }
  .ui-page-lead {
    margin-top: .1rem;
    margin-bottom: .625rem;
    font-size: .75rem;
    line-height: 1.35;
  }
  /* «Остатки → На складе»: desktop-флекс ниже заголовка превращаем в компактный
     мобильный экран. Таблицу сохраняем таблицей со свайпом — карточки строк здесь
     уже были отвергнуты как слишком длинные и лишённые понятных колонок. */
  .stock-page-head {
    gap: .45rem;
    margin-bottom: .75rem;
  }
  .stock-service-controls {
    position: relative;
    display: block;
    width: 100%;
  }
  .stock-service-disclosure {
    display: block;
    width: 100%;
  }
  .stock-service-summary {
    display: flex;
    width: calc(100% - 7.25rem);
    min-height: 1.75rem;
    align-items: center;
    justify-content: space-between;
    padding: .3rem .55rem;
    border: 1px solid #dbe1ea;
    border-radius: .55rem;
    background: #fff;
    color: #59616f;
    font-size: .72rem;
    font-weight: 550;
    line-height: 1;
    list-style: none;
    cursor: pointer;
  }
  .stock-service-summary::-webkit-details-marker { display: none; }
  .stock-service-chevron {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #818898;
    transition: transform .15s ease;
  }
  .stock-service-chevron .ui-action-icon {
    width: .8rem;
    height: .8rem;
  }
  .stock-service-disclosure[open] .stock-service-chevron { transform: rotate(180deg); }
  .stock-service-content {
    display: flex;
    width: 100%;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: .45rem;
    padding-top: .45rem;
  }
  .stock-service-content > .stock-page-intro,
  .stock-service-content > .stock-upload-actions {
    width: 100%;
    flex: 0 0 100%;
  }
  .stock-mobile-export {
    display: block;
    position: absolute;
    top: 0;
    right: 0;
  }
  .stock-mobile-export > a {
    display: flex;
    box-sizing: border-box;
    height: 1.75rem;
    align-items: center;
    padding: 0 .65rem;
    font-size: .7rem;
  }
  .stock-mobile-export .ui-action-icon {
    width: .78rem;
    height: .78rem;
  }
  .stock-page-intro {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    align-items: start;
    column-gap: .4rem;
    row-gap: 0;
    order: 0;
  }
  .stock-page-intro > p {
    display: contents;
  }
  .stock-lead-line {
    min-width: 0;
  }
  .stock-lead-line:not(:last-child)::after { content: none; }
  .stock-lead-line-1 {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  .stock-lead-line-2 {
    grid-column: 1 / -1;
    grid-row: 2;
  }
  .stock-lead-line-3 {
    grid-column: 1;
    grid-row: 3;
  }
  .stock-upload-history {
    display: contents;
    margin-bottom: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .stock-upload-history summary {
    grid-column: 2;
    grid-row: 3;
    justify-self: end;
    padding: 0;
    gap: .3rem;
    font-size: .68rem;
    line-height: 1rem;
  }
  .stock-upload-history summary .ui-action-icon {
    width: .75rem;
    height: .75rem;
  }
  .stock-history-label-desktop { display: none; }
  .stock-history-label-mobile { display: inline; }
  .stock-history-count { display: none; }
  .stock-upload-history > div {
    grid-column: 1 / -1;
    grid-row: 4;
    padding-right: .5rem;
    padding-bottom: .5rem;
    padding-left: .5rem;
    gap: .5rem;
  }
  .stock-upload-actions { order: 2; }
  .stock-network-grid {
    display: flex;
    align-items: stretch;
    flex-wrap: nowrap;
    gap: .4rem;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    margin-bottom: .75rem;
    -webkit-overflow-scrolling: touch;
  }
  .stock-network-grid::-webkit-scrollbar { display: none; }
  .stock-network-card {
    min-width: 8.75rem;
    flex: 0 0 8.75rem;
    padding: .62rem;
    border-radius: .7rem;
  }
  .stock-network-card--wide {
    min-width: 14rem;
    flex-basis: 14rem;
  }
  .stock-network-card .text-xs.uppercase {
    font-size: .58rem;
    line-height: 1.2;
  }
  .stock-network-card .text-2xl {
    margin-top: .12rem;
    font-size: 1.05rem;
    line-height: 1.2;
  }
  .stock-network-card .text-sm { font-size: .68rem; }
  .stock-toolbar {
    display: grid;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    gap: .4rem;
    margin-bottom: .75rem;
  }
  .stock-toolbar > * {
    grid-column: 1 / -1;
  }
  .stock-toolbar > .stock-toolbar-select:first-of-type {
    grid-column: 1;
    grid-row: 1;
  }
  .stock-toolbar > .ss-wrap:first-of-type {
    grid-column: 1;
    grid-row: 1;
  }
  .stock-toolbar > .stock-toolbar-search {
    grid-column: 2;
    grid-row: 1;
  }
  .stock-toolbar:has(> .ss-wrap > .stock-toolbar-place) {
    grid-template-columns: minmax(0, .9fr) minmax(0, .75fr) minmax(0, 1.1fr);
    column-gap: .3rem;
  }
  .stock-toolbar > .stock-toolbar-place {
    grid-column: 2;
    grid-row: 1;
  }
  .stock-toolbar > .ss-wrap:has(> .stock-toolbar-place) {
    grid-column: 2;
    grid-row: 1;
  }
  .stock-toolbar:has(> .ss-wrap > .stock-toolbar-place) > .stock-toolbar-search {
    grid-column: 3;
  }
  .stock-toolbar > *,
  .stock-toolbar-select,
  .stock-toolbar-search {
    width: 100%;
    min-width: 0;
    max-width: none;
  }
  .stock-toolbar select,
  .stock-toolbar input[type="search"] {
    box-sizing: border-box;
    height: 1.75rem;
    min-height: 1.75rem;
    padding: .25rem .5rem;
    font-size: .75rem;
    line-height: 1;
  }
  .stock-toolbar select.stock-toolbar-select {
    padding-right: 1.55rem;
    padding-left: .5rem;
    background-position: right .42rem center;
    background-size: .7rem;
  }
  .stock-toolbar .ss-wrap,
  .stock-toolbar .ss-wrap:has(> .stock-toolbar-place) {
    width: 100%;
    min-width: 0;
    max-width: none;
  }
  .stock-toolbar .ss-field {
    height: var(--ui-dropdown-height);
    min-height: var(--ui-dropdown-height);
    padding: .35rem .5rem;
    font-size: .7rem;
  }
  .stock-toolbar .ss-panel {
    width: max(100%, 16rem);
    max-width: calc(100vw - 1rem);
  }
  .stock-toolbar > .ss-wrap:first-of-type .ss-panel {
    right: auto;
    left: 0;
    width: min(20rem, calc(100vw - 1rem));
  }
  .stock-toolbar > .ss-wrap:has(> .stock-toolbar-place) .ss-panel {
    right: 0;
    left: auto;
    width: min(16rem, calc(100vw - 1rem));
  }
  .stock-toolbar-switch {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 0;
    font-size: .68rem;
  }
  .stock-toolbar-switch > a {
    box-sizing: border-box;
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: center;
    text-align: center;
  }
  .stock-toolbar-export > a {
    display: flex;
    min-height: 2rem;
    align-items: center;
    justify-content: center;
    padding: .35rem .6rem;
    font-size: .72rem;
  }
  .stock-toolbar > .stock-toolbar-export { display: none; }
  .stock-table-wrap {
    margin-right: -.5rem;
    margin-left: -.5rem;
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }
  .stock-articles-wrap {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    -webkit-overflow-scrolling: touch;
    background: #fff;
  }
  .stock-articles-table {
    width: 70.5rem;
    min-width: 70.5rem;
    table-layout: fixed;
    font-size: .75rem;
  }
  .stock-articles-table > thead > tr > th:nth-child(2),
  .stock-articles-table > thead > tr > th:nth-child(3),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(2),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(3) {
    display: none;
  }
  #stock-table.stock-articles-table > thead > tr > th,
  #stock-table.stock-articles-table > tbody > tr:not([data-detail-for]) > td {
    padding: .45rem .35rem;
    overflow: hidden;
    vertical-align: top;
  }
  .stock-articles-table > thead > tr > th {
    overflow: hidden;
    overflow-wrap: normal;
    white-space: nowrap;
    font-size: .64rem;
    line-height: 1.2;
  }
  #stock-table.stock-articles-table > thead > tr > th .help { display: none !important; }
  #stock-table.stock-articles-table > thead > tr > th a {
    max-width: 100%;
    flex-wrap: nowrap;
    justify-content: flex-end;
    white-space: nowrap;
  }
  #stock-table.stock-articles-table > thead > tr > th:first-child a {
    justify-content: flex-start;
  }
  #stock-table.stock-articles-table > thead > tr > th:nth-child(n + 5),
  #stock-table.stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(n + 5) {
    text-align: center;
  }
  #stock-table.stock-articles-table > thead > tr > th:nth-child(n + 5) a {
    justify-content: center;
  }
  .stock-articles-table > thead > tr > th:nth-child(1),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(1) { width: 9rem; }
  .stock-articles-table > thead > tr > th:nth-child(2),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(2) { width: 8rem; }
  .stock-articles-table > thead > tr > th:nth-child(3),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(3) { width: 8rem; }
  .stock-articles-table > thead > tr > th:nth-child(4),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(4) { width: 8.5rem; }
  .stock-articles-table > thead > tr > th:nth-child(5),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(5) { width: 7.5rem; }
  .stock-articles-table > thead > tr > th:nth-child(6),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(6) { width: 5.5rem; }
  .stock-articles-table > thead > tr > th:nth-child(7),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(7) { width: 6.5rem; }
  .stock-articles-table > thead > tr > th:nth-child(8),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(8),
  .stock-articles-table > thead > tr > th:nth-child(9),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(9) { width: 8rem; }
  .stock-articles-table > thead > tr > th:nth-child(10),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(10),
  .stock-articles-table > thead > tr > th:nth-child(11),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(11) { width: 4.5rem; }
  .stock-articles-table > thead > tr > th:nth-child(12),
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:nth-child(12) { width: 8.5rem; }
  #stock-table.stock-articles-table > tbody > tr:not([data-detail-for]) {
    border-top-color: #e2e8f0;
  }
  .stock-heading-wide { display: none; }
  .stock-heading-compact { display: inline; }
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td:first-child {
    overflow-wrap: anywhere;
    white-space: normal;
  }
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td > div,
  .stock-articles-table > tbody > tr:not([data-detail-for]) > td .help-inline {
    max-width: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  #stock-table.stock-articles-table > tbody > tr:not([data-detail-for]) > td .stock-boxes-note {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .stock-articles-table .stock-reserve-note,
  .stock-articles-table .stock-frozen-note,
  .stock-articles-table .stock-cuttable-note {
    font-size: .62rem;
    line-height: 1.25;
  }
  .stock-mobile-meta {
    display: -webkit-box;
    margin-top: .15rem;
    overflow: hidden;
    color: #94a3b8;
    font-family: inherit;
    font-size: .58rem;
    font-weight: 400;
    line-height: 1.2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .stock-page-head > .flex {
    display: grid;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    gap: .4rem;
  }
  .stock-page-head [data-dropzone] {
    width: 100%;
    padding: .5rem .6rem;
  }
  .stock-page-head [data-dropzone] > .flex {
    flex-wrap: wrap;
    gap: .35rem;
    white-space: normal;
  }
  .stock-page-head [data-dropzone] form {
    min-width: 0;
    flex: 1 1 auto;
    gap: .35rem;
  }
  .stock-page-head [data-dropzone] form button,
  .stock-page-head [data-dropzone] label > span {
    padding: .32rem .5rem;
    font-size: .68rem;
  }
  .upload-drop-hint { display: none; }
  /* FBS-команды достаточно короткие для одной строки даже на телефоне. Размер
     берётся из общего `is-mobile-compact`, как у кнопок FBMP. */
  .wms-context-tabs-wrap.is-fbs .wms-context-heading {
    flex-wrap: nowrap;
    gap: .3rem;
  }
  .wms-context-tabs-wrap.is-fbs .wms-context-fbs-actions {
    width: auto;
    min-width: 0;
    margin-left: auto;
    flex: 1 1 auto;
    gap: .2rem;
  }
}
.fbs-mobile-select-all { display: none; }

/* Массовые действия в товарах и сырье используют ту же светлую фиолетовую
   палитру, что остальные управляющие панели. Раньше здесь одновременно были
   чёрный фон, голубая ссылка, бирюзовая и зелёная кнопки. */
#prod-bulk-bar {
  position: fixed;
  bottom: 1rem;
  left: 50%;
  z-index: 50;
  display: flex;
  width: max-content;
  max-width: calc(100vw - 2rem);
  padding: .65rem .75rem;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .45rem .65rem;
  transform: translateX(-50%);
  border: 1px solid rgb(99 102 241 / 34%);
  border-radius: 1rem;
  background: rgb(255 255 255 / 96%);
  color: #334155;
  box-shadow: 0 14px 34px rgb(30 41 59 / 18%), 0 2px 8px rgb(79 70 229 / 10%);
  backdrop-filter: blur(14px);
}
#prod-bulk-bar.hidden { display: none; }
.product-bulk-count {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  color: #475569;
  font-size: .82rem;
  font-weight: 600;
  white-space: nowrap;
}
.product-bulk-count > span {
  display: inline-flex;
  min-width: 1.65rem;
  height: 1.65rem;
  padding: 0 .35rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca;
  font-size: .78rem;
  font-weight: 700;
}
.product-bulk-link {
  min-height: 1.875rem;
  padding: .3rem .45rem;
  border: 0;
  border-radius: .5rem;
  background: transparent;
  color: #64748b;
  font-size: .75rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
.product-bulk-link:hover { background: #f1f5f9; color: #334155; }
.product-bulk-link--all { color: #4f46e5; }
.product-bulk-link--all:hover { background: #eef2ff; color: #4338ca; }
.product-bulk-separator { color: #cbd5e1; }
.product-bulk-label {
  color: #64748b;
  font-size: .75rem;
  white-space: nowrap;
}
.product-bulk-edit,
.product-bulk-apply {
  min-height: 2rem;
  padding: .42rem .7rem;
  border-radius: .6rem;
  font-size: .75rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
.product-bulk-edit {
  border: 1px solid #c7d2fe;
  background: #eef2ff;
  color: #4338ca;
}
.product-bulk-edit:hover { border-color: #a5b4fc; background: #e0e7ff; }
.product-bulk-apply {
  border: 1px solid #4f46e5;
  background: #4f46e5;
  color: #fff;
  box-shadow: 0 2px 6px rgb(79 70 229 / 18%);
}
.product-bulk-apply:hover { border-color: #4338ca; background: #4338ca; }

@media (max-width: 767px) {
  #prod-bulk-bar {
    right: .5rem;
    bottom: calc(4rem + env(safe-area-inset-bottom) + .55rem);
    left: .5rem;
    width: auto;
    max-width: none;
    padding: .55rem;
    justify-content: flex-start;
    gap: .35rem .45rem;
    transform: none;
  }
  .product-bulk-separator { display: none; }
}

/* Массовое действие FBS — самостоятельная плавающая панель, а не незаметная
   строка под таблицей. Она остаётся компактной, но счётчик и главное действие
   читаются с первого взгляда на desktop и mobile. */
.fbs-bulk-bar {
  position: fixed !important;
  right: auto;
  bottom: 1.25rem !important;
  left: 50%;
  z-index: 50;
  display: flex;
  width: max-content;
  min-width: 32rem;
  max-width: calc(100vw - 2rem);
  margin: 0 !important;
  padding: .72rem .75rem .72rem 1rem !important;
  flex-wrap: nowrap !important;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  transform: translateX(-50%);
  border: 1px solid rgb(99 102 241 / 42%) !important;
  border-radius: 1rem !important;
  background: rgb(255 255 255 / 98%) !important;
  box-shadow: 0 14px 34px rgb(30 41 59 / 20%), 0 2px 8px rgb(79 70 229 / 12%) !important;
  backdrop-filter: blur(14px);
}
.fbs-bulk-bar.hidden { display: none !important; }
.fbs-bulk-count {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  color: #475569;
  font-size: .88rem;
  font-weight: 600;
  white-space: nowrap;
}
.fbs-bulk-count > b {
  display: inline-flex;
  min-width: 1.75rem;
  height: 1.75rem;
  padding: 0 .38rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca;
  font-size: .82rem;
  font-weight: 700;
}
.fbs-bulk-arrow {
  display: flex;
  width: 6rem;
  min-width: 6rem;
  flex: 0 0 6rem;
  align-items: center;
  justify-content: center;
}
.fbs-bulk-arrow > svg {
  display: block;
  width: 100%;
  height: 1.35rem;
  overflow: visible;
  filter: drop-shadow(0 1px 1px rgb(99 102 241 / 16%));
}
.fbs-bulk-arrow circle {
  fill: #c7d2fe;
}
.fbs-bulk-arrow-line,
.fbs-bulk-arrow-head {
  fill: none;
  stroke: url(#fbs-bulk-arrow-gradient);
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.fbs-confirm-action {
  border-radius: .45rem;
}
.fbs-bulk-submit {
  min-height: 2.35rem;
  padding: .55rem 1.1rem;
  border: 1px solid #4f46e5;
  border-radius: .65rem;
  background: #4f46e5;
  color: #fff;
  font-size: .86rem;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
  box-shadow: 0 3px 8px rgb(79 70 229 / 24%);
}
.fbs-bulk-submit:hover:not(:disabled) {
  border-color: #4338ca;
  background: #4338ca;
}

@media (max-width: 767px) {
  .fbs-bulk-bar {
    right: .5rem;
    bottom: calc(4rem + env(safe-area-inset-bottom) + .55rem) !important;
    left: .5rem;
    width: auto;
    min-width: 0;
    max-width: none;
    padding: .48rem .5rem .48rem .7rem !important;
    gap: .55rem;
    transform: none;
  }
  .fbs-bulk-count {
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: wrap;
    gap: 0 .45rem;
    font-size: .78rem;
  }
  .fbs-bulk-remainder { display: contents; }
  .fbs-bulk-next {
    flex: 0 0 100%;
    font-size: .66rem;
    line-height: 12px;
    white-space: nowrap;
  }
  .fbs-bulk-next-dash { display: none; }
  .fbs-bulk-count > b {
    min-width: 1.55rem;
    height: 1.55rem;
    font-size: .75rem;
  }
  .fbs-bulk-arrow {
    display: none;
  }
  .fbs-bulk-submit {
    min-height: 2rem;
    padding: .42rem .85rem;
    border-radius: .55rem;
    font-size: .78rem;
  }
}

/* «Отменены после сборки» — служебный аварийный реестр: плотнее основных рабочих
   таблиц, чтобы десяток отмен не занимал несколько экранов. */
.wms-context-registry {
  display: none;
}
.wms-context-registry.is-open {
  display: block;
  box-shadow: none;
}
#fbs-cancelled.is-open {
  border-color: #e11d48;
}
.fbm-orphan-registry.is-open {
  border-color: #f59e0b;
}
.fbm-orphan-registry table > thead,
.fbm-orphan-registry table > thead > tr,
.fbm-orphan-registry table > thead > tr > th {
  background: #fff;
}
.wms-registry-shortcut-arrow {
  color: #e11d48;
  font-size: .7rem;
}
.ui-notification-shortcut-icon,
.wms-registry-shortcut-icon {
  width: 10px;
  height: 10px;
  flex-basis: 10px;
}
.wms-registry-shortcut[aria-expanded="true"] .wms-registry-shortcut-arrow {
  transform: rotate(180deg);
}
.ui-notification-shortcut--warning,
.fbm-orphan-shortcut {
  border-bottom-color: #fbbf24;
  color: #b45309;
}
.ui-notification-shortcut--warning:hover,
.fbm-orphan-shortcut:hover {
  border-bottom-color: #f59e0b;
  color: #92400e;
}
.ui-notification-with-help {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: .25rem;
}
.ui-notification-shortcut--warning b,
.fbm-orphan-shortcut b { background: #fef3c7; }
.fbm-orphan-shortcut .wms-registry-shortcut-arrow { color: #d97706; }
@media (max-width: 767px) {
  :is(.ui-notification-shortcut, .fbs-critical-action, .wms-registry-shortcut) {
    gap: 3px;
    padding: 1px 0;
    font-size: 10px;
    line-height: 1.15;
  }
  :is(.ui-notification-shortcut, .fbs-critical-action, .wms-registry-shortcut) b {
    min-width: 16px;
    padding: 1px 3px;
    font-size: 9px;
    line-height: 1.15;
  }
  :is(.ui-notification-shortcut-icon, .wms-registry-shortcut-icon) {
    width: 8px;
    height: 8px;
    flex-basis: 8px;
  }
  .wms-registry-shortcut-arrow { font-size: 9px; }
  .ui-notification-with-help { gap: 3px; }
  .ui-notification-with-help > .help {
    width: 12px;
    height: 12px;
    min-width: 12px;
    margin-left: 0;
    font-size: 8px;
  }
}
.wms-context-registry-slot {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  margin-left: auto;
  padding-left: .7rem;
}
.fbs-context-shortcuts {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .75rem;
  margin-left: auto;
  padding-left: .7rem;
}
.fbs-context-shortcuts > :is(.fbs-alarm-summary, .fbs-burning-summary) {
  box-sizing: border-box;
  height: 1.25rem;
  min-height: 1.25rem;
  gap: .2rem;
  padding: 0 .5rem;
  border-radius: 9999px;
  font-size: .75rem;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
}
.fbs-burning-summary {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  background: #fef3c7;
  color: #92400e;
}
.fbs-burning-summary-icon {
  width: 12px;
  height: 12px;
  flex-basis: 12px;
}
.fbs-undelivered-notice--context {
  display: inline-flex;
  box-sizing: border-box;
  height: 20px;
  flex: 0 0 auto;
  align-items: center;
  gap: 3px;
  padding: 0 8px;
  border: 0;
  border-radius: 9999px;
  background: #e11d48;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
.fbs-undelivered-notice--context .fbs-undelivered-notice-icon {
  width: 12px;
  height: 12px;
  flex-basis: 12px;
}
.fbs-cancelled-context-slot {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
}
.fbs-history-shortcut {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  padding: .15rem .1rem;
  border-bottom: 1px dashed #cbd5e1;
  color: #64748b;
  font-size: .78rem;
  font-weight: 400;
  line-height: 1.2;
  cursor: pointer;
}
.fbs-history-shortcut:hover {
  border-bottom-color: #94a3b8;
  color: #475569;
}
.fbs-history-shortcut b {
  color: inherit;
  font-size: inherit;
  font-weight: 400;
}
.fbs-history-shortcut-arrow {
  color: #94a3b8;
  font-size: .7rem;
}
.fbs-history-shortcut[aria-expanded="true"] .fbs-history-shortcut-arrow {
  transform: rotate(180deg);
}
.wms-context-filter-slot,
.fbs-cancelled-filter-slot {
  align-items: center;
  gap: 8px;
  margin: -4px 0 12px;
}
.wms-context-filter-slot { display: none; }
.fbs-cancelled-filter-slot { display: none; }
.fbs-cancelled-head {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: start;
  gap: .65rem;
}
.fbs-cancelled-help {
  margin-left: 0;
}
.fbs-cancelled-help > span { display: block; }
#fbs-cancelled table.responsive.responsive-compact {
  font-size: .74rem;
  line-height: 1.18;
}
#fbs-cancelled table.responsive.responsive-compact thead {
  background: #fff;
  font-size: .6rem;
  line-height: 1.1;
}
#fbs-cancelled table.responsive.responsive-compact thead th {
  background: #fff;
}
#fbs-cancelled table.responsive.responsive-compact th,
#fbs-cancelled table.responsive.responsive-compact td {
  padding: .25rem .45rem;
}
#fbs-cancelled table.responsive.responsive-compact .ui-action--compact {
  min-height: var(--ui-control-height-compact);
  padding: .2rem .42rem;
  font-size: .64rem;
}

@media (max-width: 640px) {
  /* «Ждут дня отгрузки» — единый полноширинный информер. Правая служебная
     колонка раньше съедала половину карточки, поэтому отсечки площадок
     складывались в высокий узкий столбик. */
  .fbs-future-note {
    position: relative;
    padding: .55rem .65rem;
  }
  .fbs-future-head {
    display: block;
  }
  .fbs-future-title {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: .28rem .38rem;
  }
  .fbs-future-title > b {
    grid-column: 1;
    font-size: .76rem;
  }
  .fbs-future-cancelled-inline {
    display: block;
    grid-column: 2;
    grid-row: 1;
    color: #94a3b8;
    font-size: .58rem;
    line-height: 1.15;
    padding-right: 1.5rem;
    text-align: right;
    white-space: nowrap;
  }
  .fbs-future-corner {
    display: block;
    position: absolute;
    top: .55rem;
    right: .65rem;
  }
  .fbs-cutoff-note {
    display: flex;
    grid-column: 1 / -1;
    width: 100%;
    margin-left: 0;
    gap: .25rem;
  }
  .fbs-cutoff-item {
    flex: 0 0 auto;
    justify-content: center;
    gap: .16rem;
    padding: .22rem .28rem;
    font-size: .61rem;
    text-align: center;
  }
  .fbs-cutoff-src {
    display: none;
  }
  .fbs-future-cancelled {
    max-width: none;
    margin-top: .32rem;
    font-size: .58rem;
    text-align: left;
  }
  .fbs-future-cancelled:not(.fbs-future-open-warning) {
    display: none;
  }
  .fbs-future-days {
    margin-top: .45rem;
    padding-top: 0;
  }
  .fbs-future-open-warning-mobile {
    display: block;
    grid-column: 1 / -1;
    flex: 0 0 100%;
    margin-top: .08rem;
    font-size: .58rem;
    line-height: 1.16;
  }
  .fbs-mobile-select-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin: 0 .3rem;
    padding: .55rem .3rem;
    border-bottom: 1px solid #e2e8f0;
    color: #475569;
    font-size: .75rem;
    font-weight: 600;
  }
  .fbs-mobile-select-label {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: .5rem;
    cursor: pointer;
  }
  .fbs-mobile-select-label.fbs-reassign-check {
    margin: 0 0 0 2px;
    gap: .5rem;
  }
  .fbs-cancelled-context-slot { display: none; }
  .fbs-context-shortcuts,
  .wms-context-registry-slot { display: none; }
  .wms-context-filter-slot,
  .fbs-cancelled-filter-slot {
    display: flex;
  }
  :is(.wms-context-filter-slot, .fbs-cancelled-filter-slot) .fbs-burning-summary {
    box-sizing: border-box;
    height: 16px;
    min-height: 16px;
    gap: 2px;
    padding: 0 5px;
    border-radius: 9999px;
    font-size: 10px;
    font-weight: 500;
    line-height: 1;
  }
  :is(.wms-context-filter-slot, .fbs-cancelled-filter-slot) .fbs-burning-summary-icon {
    width: 10px;
    height: 10px;
    flex-basis: 10px;
  }
  :is(.wms-context-filter-slot, .fbs-cancelled-filter-slot) .fbs-undelivered-notice--context {
    height: 16px;
    gap: 2px;
    padding: 0 5px;
    font-size: 10px;
  }
  :is(.wms-context-filter-slot, .fbs-cancelled-filter-slot) .fbs-undelivered-notice--context .fbs-undelivered-notice-icon {
    width: 10px;
    height: 10px;
    flex-basis: 10px;
  }
  /* «Отменены после сборки» — аварийный список, а не пятиэтажная анкета заказа.
     На телефоне одна строка занимает три компактных ряда: заказ+дата,
     артикул+количество, поставка. */
  #fbs-cancelled { padding: .65rem; }
  #fbs-cancelled > div:first-child {
    gap: .3rem;
    margin-bottom: .45rem;
  }
  .fbs-cancelled-head {
    display: block;
  }
  .fbs-cancelled-help {
    display: block;
    max-width: none;
    margin-top: .35rem;
    margin-left: 0;
  }
  #fbs-cancelled table.responsive.responsive-compact > tbody > tr,
  #fbs-cancelled table.responsive.responsive-compact tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .12rem .45rem;
    margin-bottom: .22rem;
    padding: .34rem .45rem;
    border-color: #fecdd3;
    border-radius: .55rem;
  }
  #fbs-cancelled table.responsive.responsive-compact td {
    display: flex !important;
    min-width: 0;
    align-items: center;
    justify-content: flex-start;
    gap: .28rem;
    padding: 0;
    margin: 0;
    border: 0;
    font-size: .65rem;
    line-height: 1.16;
  }
  #fbs-cancelled table.responsive.responsive-compact td::before {
    display: inline !important;
    margin: 0;
    font-size: .5rem;
    line-height: 1;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(1) {
    grid-column: 1;
    grid-row: 1;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(3) {
    grid-column: 2;
    grid-row: 2;
    justify-content: flex-end;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(4) {
    grid-column: 1 / -1;
    grid-row: 3;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(5) {
    grid-column: 2;
    grid-row: 1;
    justify-content: flex-end;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(6) {
    grid-column: 1;
    grid-row: 4;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(7) {
    grid-column: 2;
    grid-row: 4;
    justify-content: flex-end;
  }
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(1),
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(2),
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(4),
  #fbs-cancelled table.responsive.responsive-compact td:nth-child(6) {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fbs-adopt-warning { padding: .65rem; }
  .fbs-adopt-warning-head {
    gap: 0;
    margin-bottom: .35rem;
  }
  .fbs-adopt-warning table.responsive.responsive-compact > tbody > tr,
  .fbs-adopt-warning table.responsive.responsive-compact tr {
    margin-bottom: 0;
    padding: 6px 10px;
    border-radius: .65rem;
  }
  .fbs-adopt-warning table.responsive.responsive-compact td {
    padding: 2px 0;
    font-size: .8rem;
  }
  .fbs-adopt-warning table.responsive.responsive-compact td::before {
    font-size: 10px;
  }
  .fbs-adopt-warning table.responsive.responsive-compact td:last-child {
    padding: 2px 0;
    margin-top: 0;
    border-top: 0;
  }
  .fbs-adopt-warning table.responsive.responsive-compact td:last-child::before {
    display: inline !important;
  }
  .fbs-orders-wrap {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  table.fbs-orders-table.responsive.responsive-compact > tbody > tr,
  table.fbs-orders-table.responsive.responsive-compact tr {
    position: relative;
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    row-gap: 0;
    column-gap: .4rem;
    margin-bottom: 0;
    padding: .3rem;
    border: 0;
    border-bottom: 1px solid #e2e8f0;
    border-radius: 0;
    box-shadow: none;
  }
  table.fbs-orders-table.responsive.responsive-compact td {
    display: block !important;
    min-width: 0;
    padding: 0;
    font-size: .75rem;
    line-height: 1.2;
  }
  table.fbs-orders-table.responsive.responsive-compact td::before {
    content: none !important;
    display: none !important;
    margin: 0 !important;
  }
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-select {
    /* Кликабельная область 28×28 не должна раздувать первый ряд высотой
       16.8px: галочка лежит поверх зарезервированного слева места. */
    position: absolute;
    z-index: 3;
    top: -1px;
    left: .3rem;
    display: flex !important;
    width: 28px !important;
    height: 28px;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 0;
  }
  table.fbs-orders-table .fbs-order-select-control {
    display: inline-flex;
    box-sizing: border-box;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    align-items: center;
    justify-content: center;
    gap: 0;
    margin: 0;
    cursor: pointer;
    touch-action: manipulation;
  }
  table.fbs-orders-table .fbs-order-select-control:has(input:disabled) {
    cursor: default;
    opacity: .5;
  }
  table.fbs-orders-table td.fbs-order-select::before { display: none !important; }
  table.fbs-orders-table td.fbs-order-col-main {
    grid-column: 1 / 4;
    grid-row: 1;
    order: 1;
    display: block !important;
    padding: 0;
    border-bottom: 0;
  }
  table.fbs-orders-table td.fbs-order-select:not(.has-control) { display: none !important; }
  table.fbs-orders-table tr:has(td.fbs-order-select.has-control) td.fbs-order-col-main {
    padding-left: 1.65rem;
  }
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-col-main::before,
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-col-product::before,
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-col-actions::before {
    content: none !important;
    display: none !important;
    margin: 0 !important;
  }
  .fbs-order-created { display: none; }
  table.fbs-orders-table td.fbs-order-col-product {
    grid-column: 4 / 7;
    grid-row: 1;
    order: 2;
    display: block !important;
    padding: 0;
    background: transparent;
    text-align: right;
  }
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-mobile-meta {
    display: grid !important;
    grid-column: 1 / 7;
    grid-row: 2;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
    padding: 0;
    color: #a0aaba;
    font-size: .68rem;
    font-weight: 400;
    line-height: 1.25;
    white-space: nowrap;
  }
  .fbs-order-channel-mobile {
    display: block;
    min-width: 0;
    overflow: hidden;
    font-size: .64rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fbs-order-mobile-barcode { text-align: right; }
  .fbs-order-rid { margin-top: .18rem; }
  table.fbs-orders-table td.fbs-order-col-schedule {
    grid-column: 1 / 3;
    grid-row: 3 / span 2;
    order: 3;
  }
  table.fbs-orders-table td.fbs-order-col-context {
    grid-column: 3 / 5;
    grid-row: 4;
    order: 4;
    align-self: center;
  }
  table.fbs-orders-table td.fbs-order-col-state {
    grid-column: 3 / 5;
    grid-row: 3;
    order: 5;
  }
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-col-supply {
    display: none !important;
  }
  .fbs-order-product-values,
  .fbs-order-schedule-values,
  .fbs-order-context-values,
  .fbs-order-state-values {
    max-width: none;
    text-align: left;
  }
  .fbs-order-product-values { text-align: right; }
  .fbs-order-product-values > div { display: none; }
  .fbs-order-context-values {
    display: flex;
    min-width: 0;
    align-items: baseline;
    justify-content: flex-start;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 4px;
    overflow: hidden;
    text-align: left;
    white-space: nowrap;
  }
  .fbs-order-context-values > div {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fbs-order-context-values > div:first-child {
    font-size: .68rem;
    line-height: 1.25;
  }
  .fbs-order-schedule-values {
    display: grid;
    grid-template-rows: 20px 13.6px;
    align-items: center;
    gap: 0;
  }
  .fbs-order-state-values {
    display: flex;
    justify-content: flex-start;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 2px;
  }
  .fbs-order-schedule-values > div:first-child {
    display: flex;
    width: 100%;
    min-width: 0;
    flex-wrap: wrap;
    align-items: baseline;
    gap: .1rem .2rem;
  }
  .fbs-order-schedule-values .fbs-dl {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .fbs-order-state-values {
    align-items: flex-start;
    text-align: left;
  }
  .fbs-order-state-values > .text-slate-400 {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .fbs-order-channel-status { display: none !important; }
  .fbs-order-handover,
  .fbs-order-warehouse,
  .fbs-order-place,
  .fbs-order-state-values > div {
    margin-top: 0 !important;
  }
  .fbs-order-handover { align-self: center; }
  .fbs-order-context-values > .fbs-order-warehouse::before,
  .fbs-order-context-values > .fbs-order-place::before {
    content: "·";
    margin-right: .2rem;
  }
  .fbs-order-product-values > b {
    overflow: hidden;
    font-size: .76rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  /* Иерархия мобильной карточки «Новые»: номер и артикул — главные, сроки —
     рабочий второй уровень, технический контекст не спорит с ними за внимание.
     Цветные предупреждения не входят в эти селекторы и сохраняют приоритет. */
  .fbs-order-created,
  .fbs-order-rid,
  .fbs-order-product-values > div,
  .fbs-order-warehouse,
  .fbs-order-state-values > .text-slate-400,
  table.fbs-orders-table td.fbs-order-col-supply {
    color: #a0aaba;
    font-weight: 400;
  }
  .fbs-order-context-values > div:first-child,
  .fbs-dl-ok,
  .fbs-order-handover strong {
    color: #64748b;
    font-weight: 600;
  }
  .fbs-dl-ok,
  .fbs-order-handover strong {
    font-size: .72rem;
    line-height: 1.2;
  }
  .fbs-order-handover > span {
    color: #aab3bf;
    font-size: .64rem;
    font-weight: 400;
  }
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-col-actions {
    grid-column: 5 / 7;
    grid-row: 3 / span 2;
    order: 7;
    display: flex !important;
    justify-content: flex-end;
    align-items: flex-end;
    gap: .35rem;
    padding-top: 0;
    margin-top: 0;
    border-top: 0;
    text-align: left;
  }
  table.fbs-orders-table.responsive.responsive-compact td.fbs-order-col-actions form {
    display: inline-flex;
  }
  table.fbs-orders-table.responsive.responsive-compact .fbs-confirm-action {
    min-height: 1.7rem;
    padding: .28rem .58rem;
    border: 1px solid #4f46e5;
    background: #4f46e5;
    color: #fff;
    font-size: .68rem;
    font-weight: 600;
    line-height: 1;
    box-shadow: 0 2px 5px rgb(79 70 229 / 22%);
  }
  table.fbs-orders-table.responsive.responsive-compact .fbs-confirm-action:hover {
    border-color: #4338ca;
    background: #4338ca;
  }
  .fbs-order-wait-action { display: none !important; }
  .fbs-mobile-inline-label {
    display: inline;
    margin-right: .24rem;
    color: #aab3bf;
    font-size: .64rem;
    font-weight: 400;
  }
  .fbs-order-handover { justify-content: flex-start; }
  .fbs-order-state-values > span:first-child { justify-content: flex-start; }
  table.fbs-orders-table td.fbs-order-col-actions > span {
    padding: .18rem .4rem;
    border-radius: .4rem;
    background: #f8fafc;
  }
  table.fbs-orders-table td.fbs-order-col-actions:not(:has(button, a, form)) {
    display: none !important;
  }
  table.fbs-orders-table td.fbs-order-col-actions.is-wait-only {
    display: none !important;
  }
}

/* Инлайн-автосейв (inline-save.js) — статусы поля БЕЗ перезагрузки страницы. */
[data-inline].inline-saving { outline: 2px solid #fcd34d; outline-offset: -1px; }
[data-inline].inline-error {
  outline: 2px solid #f87171;
  outline-offset: -1px;
  background-color: #fef2f2;
}
[data-inline].inline-saved,
.inline-patched { animation: inlineFlash 0.9s ease-out; }
@keyframes inlineFlash {
  0% { background-color: #a7f3d0; }
  100% { background-color: transparent; }
}

/* Подсветка раскрытой поставки (чтобы её блок не сливался со списком) —
   мягкая голубая заливка строки-шапки и блока состава. Без левой полосы
   (inset box-shadow давал «висящую» вертикальную линию — выглядело как артефакт). */
tr.ship-row.ship-open > td,
tr.ship-detail.ship-open > td { background: var(--ui-accent-soft); }
#fbs-supply-list tr.ship-open.fbs-supply-mp-ozon > td { background: #f4f8ff; }
#fbs-supply-list tr.ship-open.fbs-supply-mp-wb > td { background: #faf7ff; }
#fbs-supply-list tr.ship-open.fbs-supply-mp-ym > td { background: #fffbeb; }
/* FBM использует ту же палитру раскрытых поставок, что FBS. Суффикс класса
   приходит из общего mp_color, поэтому новый маркетплейс не создаёт второй список. */
.doc-list :is(
  tr.ship-open.fbm-shipment-mp-ozon,
  tr.ship-row.ship-open + tr.fbm-cabinet-fix-row.fbm-shipment-mp-ozon,
  tr.ship-row:hover + tr.fbm-cabinet-fix-row.fbm-shipment-mp-ozon,
  tr.fbm-cabinet-fix-row.fbm-shipment-mp-ozon:hover
) > td { background: #f4f8ff; }
.doc-list :is(
  tr.ship-open.fbm-shipment-mp-wb,
  tr.ship-row.ship-open + tr.fbm-cabinet-fix-row.fbm-shipment-mp-wb,
  tr.ship-row:hover + tr.fbm-cabinet-fix-row.fbm-shipment-mp-wb,
  tr.fbm-cabinet-fix-row.fbm-shipment-mp-wb:hover
) > td { background: #faf7ff; }
.doc-list :is(
  tr.ship-open.fbm-shipment-mp-ym,
  tr.ship-row.ship-open + tr.fbm-cabinet-fix-row.fbm-shipment-mp-ym,
  tr.ship-row:hover + tr.fbm-cabinet-fix-row.fbm-shipment-mp-ym,
  tr.fbm-cabinet-fix-row.fbm-shipment-mp-ym:hover
) > td { background: #fffbeb; }
.doc-list :is(
  tr.ship-open.fbm-shipment-mp-mvideo,
  tr.ship-row.ship-open + tr.fbm-cabinet-fix-row.fbm-shipment-mp-mvideo,
  tr.ship-row:hover + tr.fbm-cabinet-fix-row.fbm-shipment-mp-mvideo,
  tr.fbm-cabinet-fix-row.fbm-shipment-mp-mvideo:hover
) > td { background: #fff7f7; }
@media (min-width: 641px) {
  .doc-list > tbody > tr.ship-row.ship-open .doc-owner-people .fbs-owner-role {
    background: transparent;
    box-shadow: none;
  }
}

/* Внешние реестры FBS и FBM — единая скруглённая таблица. Обычно фон обрезает
   контейнер; когда overflow временно/постоянно открыт ради выпадающих панелей, фон
   `thead`/`tr` не должен прямоугольником проступать за скруглённой крайней `th`. */
.doc-list-frame {
  --doc-list-radius: .75rem;
  overflow: hidden;
  border-radius: var(--doc-list-radius);
}
.doc-list > thead,
.doc-list > thead > tr {
  background: transparent;
}
/* У внешнего списка FBS шапка примыкает к первой поставке без белого шва.
   Граница общего макроса нужна другим таблицам, поэтому снимаем её здесь,
   в единственной точке оформления именно FBS-реестра. */
#fbs-supply-list {
  border-spacing: 0;
}
#fbs-supply-list > thead,
#fbs-supply-list > thead > tr,
#fbs-supply-list > thead > tr > th {
  border-bottom: 0 !important;
}
#fbs-supply-list > tbody > tr.fbs-supply-row:first-child > td {
  border-top: 0 !important;
}

/* Одна иконка раскрытия для FBS и FBM: компактная системная кнопка с векторным
   шевроном. Текстовые ▸/▾ остаются доступным состоянием в DOM, но визуально их заменяет
   CSS-вектор; `ship-open` разворачивает его тем же общим аккордеоном. */
.doc-list > tbody > tr.ship-row .acc-caret {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  margin-right: .08rem;
  border: 1px solid #cbd5e1;
  border-radius: .45rem;
  background: #f1f5f9;
  color: #334155;
  font-size: 0;
  line-height: 1;
  vertical-align: middle;
  transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}
.doc-list > tbody > tr.ship-row .acc-caret::before {
  content: "";
  width: .42rem;
  height: .42rem;
  border-right: 1.7px solid currentColor;
  border-bottom: 1.7px solid currentColor;
  transform: translateY(-.12rem) rotate(45deg);
  transition: transform .15s ease;
}
.doc-list > tbody > tr.ship-row.ship-open .acc-caret {
  border-color: var(--ui-accent-line);
  background: var(--ui-accent-soft);
  color: var(--ui-accent);
}
.doc-list > tbody > tr.ship-row.ship-open .acc-caret::before {
  transform: translateY(.12rem) rotate(225deg);
}
.doc-caret-indent {
  margin-left: 2rem;
}
.wms-document-status-items {
  column-gap: .375rem;
}

/* Desktop-шапка FBM/FBS использует тот же Jinja-компонент, что mobile.
   Первая строка компактнее каретки: каретка выступает вниз рядом с безопасным отступом
   второй строки; служебные строки получают `doc-caret-indent` 2rem. */
@media (min-width: 768px) {
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header {
    display: grid !important;
    box-sizing: border-box;
    grid-template-rows: 1.25rem 1rem 1rem;
    width: 100%;
    height: 3.25rem;
    min-height: 3.25rem;
    margin: 0;
    overflow: hidden;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header.wms-document-header--four-lines {
    grid-template-rows: 1.25rem 1rem 1rem 1rem;
    height: 4.25rem;
    min-height: 4.25rem;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header :is(.wms-document-heading, .wms-document-line) {
    box-sizing: border-box;
    min-width: 0;
    white-space: nowrap;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header .wms-document-heading {
    display: flex;
    align-items: flex-start;
    gap: .28rem;
    height: 1.25rem;
    min-height: 1.25rem;
    font-size: .875rem;
    line-height: 1.25rem;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header .wms-document-line {
    height: 1rem;
    min-height: 1rem;
    overflow: hidden;
    line-height: 1rem;
    text-overflow: ellipsis;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header .wms-mobile-document-code {
    color: #64748b !important;
    font-size: 11px;
    font-weight: 400;
    line-height: 1rem;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header .wms-mobile-document-created {
    color: #94a3b8 !important;
    font-size: 10px;
    font-weight: 400;
    line-height: 1rem;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header .wms-document-heading-text {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  :is(#ship-list, #fbs-supply-list) .wms-desktop-document-header .wms-mobile-document-caret-spacer {
    display: inline-flex;
    flex: 0 0 1.65rem;
    width: 1.65rem;
    height: 1.65rem;
  }
}

.wms-document-date-form { margin: 0; }
.doc-note-field {
  display: block;
  box-sizing: border-box;
  min-height: 4rem;
  max-height: 9rem;
  field-sizing: content;
  resize: vertical;
  overflow-y: auto;
  font-size: .6875rem;
  line-height: 1.15;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.doc-note-readonly {
  font-size: .6875rem;
  line-height: 1.15;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.fbm-supply-id-field {
  position: relative;
  min-width: 0;
}
.wms-supply-external-id-value {
  color: #64748b;
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
}
.fbm-supply-id-field > input {
  box-sizing: border-box;
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  block-size: 18px !important;
  min-block-size: 18px !important;
  max-block-size: 18px !important;
  padding-top: 0 !important;
  padding-right: 1.4rem;
  padding-bottom: 0 !important;
  appearance: none;
  line-height: 16px;
}
.fbm-supply-id-warning {
  position: absolute;
  z-index: 1;
  top: .2rem;
  right: .25rem;
  font-size: .7rem;
  line-height: 1;
}
.wms-context-tools--with-lead { position: relative; }

/* Раскрытая раскладка коробов: общий макрос и все его действия сохраняются,
   компактность задаёт только оболочка карточки (К5 10.09: прежний раздел FF снят). */
#ship-list .box-layout-compact-section[open] {
  padding: .46rem .75rem;
}
#ship-list .box-layout-compact-section[open] > summary {
  line-height: 1.15;
}
#ship-list .box-layout-compact-section[open] .box-layout-compact-warning {
  margin-top: .35rem;
  line-height: 1.2;
}
#ship-list .box-layout-compact-table {
  margin-top: .36rem;
  table-layout: fixed;
  font-size: .75rem;
}
#ship-list .box-layout-compact-table :is(th, td) {
  padding: .27rem .45rem;
  vertical-align: middle;
  line-height: 1.16;
}
#ship-list .box-layout-compact-table th:nth-child(1) { width: 5.2rem; }
#ship-list .box-layout-compact-table th:nth-child(2) { width: auto; }
#ship-list .fbm-box-layout-table th:nth-child(2) { width: 15rem; }
#ship-list .box-layout-compact-table th:nth-child(3),
#ship-list .box-layout-compact-table th:nth-child(4) { width: 4.7rem; }
#ship-list .box-layout-compact-table th:nth-child(5) { width: 6.4rem; }
#ship-list .box-layout-compact-table th:nth-child(6) { width: 4.5rem; }
#ship-list .box-layout-compact-table th:nth-child(7) { width: 7.5rem; }
#ship-list .box-layout-compact-table input[type="text"] {
  box-sizing: border-box;
  width: 48px;
  min-width: 48px;
  max-width: 48px;
  height: var(--ui-control-height-compact);
  min-height: var(--ui-control-height-compact);
  max-height: var(--ui-control-height-compact);
  padding-top: 0;
  padding-bottom: 0;
  line-height: 22px;
}
#ship-list .box-layout-compact-table button {
  box-sizing: border-box;
  width: 24px;
  min-width: 24px;
  max-width: 24px;
  height: var(--ui-control-height-compact);
  min-height: var(--ui-control-height-compact);
  max-height: var(--ui-control-height-compact);
  padding: 0;
  border-radius: .42rem;
  line-height: 22px;
}
#ship-list .fbm-box-layout-section[open] {
  margin-top: .5rem;
}
@media (min-width: 768px) {
  #ship-list .fbm-box-layout-section[open],
  #ship-list .fbm-box-layout-section:not([open]) {
    margin-top: 1rem;
  }
}
#ship-list .fbm-box-layout-section:not([open]) > summary {
  padding-right: .75rem;
  padding-left: .75rem;
}
#ship-list .fbm-box-layout-summary {
  list-style: none;
}
#ship-list .fbm-box-layout-summary::-webkit-details-marker {
  display: none;
}
#ship-list .fbm-box-layout-summary::before {
  box-sizing: border-box;
  display: inline-block;
  width: 12px;
  height: 8px;
  margin-right: 6px;
  background: currentColor;
  clip-path: polygon(0 0, 100% 0, 50% 100%);
  content: "";
  transform: rotate(0deg);
  transform-origin: center;
  vertical-align: 1px;
}
#ship-list .fbm-box-layout-summary-icon {
  width: 12px;
  height: 12px;
  margin-right: 4px;
  vertical-align: -2px;
}
#ship-list .fbm-box-layout-section:not([open]) > .fbm-box-layout-summary::before {
  transform: rotate(-90deg);
}
#ship-list .fbm-box-layout-workspace {
  display: grid;
  width: calc(100% + 1.5rem);
  grid-template-columns: minmax(0, 1fr);
  align-items: start;
  gap: .65rem;
  margin-top: .36rem;
  margin-right: -.75rem;
  margin-left: -.75rem;
}
#ship-list .fbm-box-layout-workspace > .fbm-box-layout-table {
  width: 100%;
  min-width: 0;
  margin-top: 0;
}
/* Черновик FBM: две рабочие таблицы занимают только нужную ширину. Состав стоит
   у левого края, раскладка коробов — у правого; форма добавления не раздвигает её. */
@media (min-width: 641px) {
  #ship-list .fbm-draft-tables-grid > table.byart-pick-table {
    width: 525px;
    max-width: 100%;
    justify-self: start;
  }
  #ship-list .fbm-draft-tables-grid > table.byart-pick-table :is(th, td):last-child {
    width: 15rem;
  }
  #ship-list .fbm-draft-tables-grid > table.byart-pick-table td:last-child > div {
    gap: 4px;
  }
  #ship-list .fbm-draft-tables-grid > table.byart-pick-table .qty-notes {
    width: 56px;
    flex-basis: 56px;
  }
  #ship-list .fbm-draft-tables-grid > table.byart-pick-table input[data-inline-field="qty"] {
    width: 48px;
  }
  #ship-list .fbm-draft-tables-grid > .fbm-box-layout-section {
    box-sizing: border-box;
    width: 600px;
    max-width: 100%;
    margin-left: auto;
    padding-right: 0;
    padding-left: 0;
  }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-summary {
    display: block;
    box-sizing: border-box;
    width: 100%;
    margin: 0 0 4px;
    padding: 0;
  }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-workspace {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    margin-top: 0;
    margin-right: 0;
    margin-left: 0;
  }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-table {
    overflow: hidden;
    border-radius: 10.52px 10.52px 0 0;
    clip-path: inset(0 round 10.52px 10.52px 0 0);
  }
  #ship-list .fbm-draft-tables-grid :is(.fbm-box-layout-warning, .fbm-box-pallet-summary) {
    padding-right: 12px;
    padding-left: 12px;
  }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-table th:nth-child(1) { width: 7.5rem; }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-table th:nth-child(2) { width: 6.5rem; }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-table th:nth-child(3) { width: 11.25rem; }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-table th:nth-child(4) { width: 3.5rem; }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-table :is(th, td):nth-child(5) {
    width: 60px;
    padding-right: 6px;
    padding-left: 6px;
  }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-table :is(th, td):nth-child(6) {
    width: 36px;
    padding-right: 6px;
    padding-left: 6px;
  }
  #ship-list .fbm-draft-tables-grid .fbmp-box-add-panel {
    width: 20rem;
    justify-self: end;
    margin-top: 8px;
    margin-right: 0;
    margin-left: auto;
  }
}
@media (min-width: 1360px) {
  #ship-list .fbm-draft-tables-grid {
    display: grid;
    grid-template-columns: minmax(0, 525px) minmax(16px, 1fr) minmax(0, 600px);
    align-items: start;
  }
  #ship-list .fbm-draft-tables-grid > table.byart-pick-table {
    grid-column: 1;
    grid-row: 1;
  }
  #ship-list .fbm-draft-tables-grid > .fbm-box-layout-section {
    position: relative;
    grid-column: 3;
    grid-row: 1;
    margin-top: 16px;
    padding-top: 0;
    border-top: 0;
  }
  #ship-list .fbm-draft-tables-grid > .fbm-draft-left-actions {
    display: flex;
    grid-column: 1 / -1;
    grid-row: 2;
    align-items: flex-start;
    gap: 24px;
    margin-top: 8px;
    justify-self: start;
  }
  #ship-list .fbm-draft-tables-grid .fbm-draft-left-actions > .fbm-draft-bulk-actions {
    display: inline-grid;
    grid-template-columns: max-content;
    row-gap: 4px;
    box-sizing: border-box;
    width: max-content;
    max-width: 525px;
    margin-top: 0;
    padding: 0;
    border-top: 0;
  }
  #ship-list .fbm-draft-tables-grid .fbm-draft-bulk-control-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px;
    white-space: nowrap;
  }
  /* ⛔⛔ ШИРИНА ПО СОДЕРЖИМОМУ, А НЕ 600px (менеджер 18.09: «добавить товар в черновике не
     даёт — не работает кнопка»). Форма делит ячейку сетки (строка 2, все колонки) с
     панелью «Добавить в состав» и рисуется ПОВЕРХ неё (позже в DOM). Поля назначения
     занимают ~440px у правого края, а при ширине 600px пустые ~160px слева прозрачно
     накрывали кнопку «Добавить в состав»: клик уходил в эту форму, запрос не отправлялся
     вовсе. Замер 1360/1440: max-content оставляет поля на месте, зазор с панелью 13px.
     Страж — `tests/wms/test_box_add_button_not_covered.py`. */
  #ship-list .fbm-draft-tables-grid > .fbm-draft-destination {
    grid-column: 1 / -1;
    grid-row: 2;
    box-sizing: border-box;
    width: max-content;
    max-width: 100%;
    margin-top: 8px;
    padding: 0;
    border-top: 0;
    justify-self: end;
    align-self: start;
  }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-summary {
    position: absolute;
    right: 0;
    bottom: calc(100% + 4px);
    left: 0;
    margin: 0;
    background: transparent;
  }
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-section:not([open]) > .fbm-box-layout-summary {
    padding-right: 0;
    padding-left: 0;
  }
  #ship-list .fbm-draft-tables-grid .fbm-draft-left-actions > .fbmp-box-add-panel {
    flex: 0 0 525px;
    width: 525px;
    max-width: 525px;
    margin: 0;
  }
  #ship-list .fbm-draft-tables-grid .fbm-draft-left-actions .fbm-draft-bulk-note {
    display: block;
    width: 0;
    min-width: 100%;
    max-width: none;
  }
}
@media (min-width: 641px) and (max-width: 1359px) {
  #ship-list .fbm-draft-tables-grid .fbm-box-layout-summary {
    padding-right: 12px;
    padding-left: 12px;
  }
}
#ship-list .fbm-box-pallet-summary {
  margin-top: .4rem;
  padding-top: .4rem;
  line-height: 1.2;
}
#ship-list .fbm-box-pallet-toolbar {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem .65rem;
}
#ship-list .fbm-box-pallet-title {
  flex: 0 0 auto;
}
#ship-list .fbm-box-pallet-values {
  flex: 0 1 auto;
  min-width: 0;
}
#ship-list .fbmp-box-add-panel {
  box-sizing: border-box;
  width: auto;
  min-width: 0;
  justify-self: stretch;
  padding: .55rem .65rem;
  border: 1px solid #e2e8f0;
  background: #fff;
}
#ship-list .fbmp-box-add-form {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  align-items: stretch;
  gap: .4rem;
  margin: 0;
  padding: 0;
}
#ship-list .fbmp-box-add-title { display: block; }
#ship-list .fbmp-box-add-entry {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: .4rem;
}
#ship-list .fbmp-box-add-form [data-box-rows] {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  gap: .3rem;
}
#ship-list .fbmp-box-add-form [data-box-rows] > :not([hidden]) ~ :not([hidden]) {
  margin-top: 0;
}
#ship-list .fbmp-box-add-actions {
  flex-wrap: wrap;
  margin: 0;
}
#ship-list :is(.fbmp-box-add-note, .fbm-draft-bulk-note) {
  display: block;
  font-size: 11px;
  line-height: 13px;
  text-align: left;
}
#ship-list .fbmp-box-add-form [data-box-row] {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) 56px;
  align-items: end;
  column-gap: 6px;
  row-gap: 4px;
}
#ship-list .fbmp-box-add-form [data-box-row] > input {
  box-sizing: border-box;
  min-width: 0;
  width: 100% !important;
  max-width: none !important;
  justify-self: stretch;
}
#ship-list .fbmp-box-add-form [data-box-row] > div {
  min-width: 0;
  width: 100%;
}
#ship-list .fbmp-box-add-form .fbmp-box-add-sku {
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  grid-column: 1;
}
#ship-list .fbmp-box-add-form .fbmp-box-add-qty { grid-column: 2; }
#ship-list .fbmp-box-add-form [data-box-row-hint] {
  grid-column: 1 / -1;
}
@media (min-width: 1360px) {
  #ship-list .fbmp-box-add-entry {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 104px 136px;
    align-items: start;
    column-gap: 6px;
  }
  #ship-list .fbmp-box-add-entry > [data-box-row-add] {
    box-sizing: border-box;
    width: 104px;
  }
  #ship-list .fbmp-box-add-entry > button:last-child {
    box-sizing: border-box;
    width: 136px;
  }
}
#ship-list .fbm-draft-destination,
#ship-list .fbm-draft-bulk-actions {
  padding-right: .75rem;
  padding-left: .75rem;
}
@media (min-width: 641px) {
  #ship-list .fbm-draft-destination {
    display: grid !important;
    grid-template-columns: 180px 224px;
    align-items: start;
    justify-content: end;
    column-gap: 12px;
    row-gap: 4px;
  }
  #ship-list .fbm-draft-destination-field {
    display: contents;
  }
  #ship-list .fbm-draft-destination-field--channel > :first-child {
    grid-column: 1;
    grid-row: 1;
    margin-bottom: 0;
  }
  #ship-list .fbm-draft-destination-field--channel > :last-child {
    grid-column: 1;
    grid-row: 2;
  }
  #ship-list .fbm-draft-destination-field--place > :first-child {
    grid-column: 2;
    grid-row: 1;
    margin-bottom: 0;
  }
  #ship-list .fbm-draft-destination-field--place > :last-child {
    grid-column: 2;
    grid-row: 2;
  }
  #ship-list .fbm-draft-destination > button {
    grid-column: 1 / -1;
    grid-row: 3;
    justify-self: end;
    margin-top: 4px;
  }
  #ship-list .fbm-draft-destination > .basis-full {
    grid-column: 1 / -1;
  }
}
#ship-list .fbm-draft-bulk-actions {
  padding-bottom: .75rem;
}
/* Нижний текст/действие «По-артикульно» не прилипает к рамке состава на сборке,
   приёмке и фиксации факта. Один класс держит одинаковый воздух снизу и по бокам
   у всех стадийных подвалов. */
#ship-list .fbm-byart-footer {
  margin-bottom: .75rem;
  padding-right: .75rem;
  padding-left: .75rem;
}
#ship-list .fbm-draft-bulk-note {
  min-width: 0;
  flex: 1 1 36rem;
  max-width: 42rem;
  line-height: 1.25;
}
.draft-reserve-badge .ui-action-icon {
  width: .72rem;
  height: .72rem;
  flex: 0 0 .72rem;
}
#ship-list .fbmp-box-add-panel {
  margin-right: .4rem;
  border-radius: .55rem;
  box-shadow: 0 1px 2px rgb(15 23 42 / 5%), 0 3px 8px rgb(15 23 42 / 4%);
}
@media (max-width: 1100px) {
  #ship-list .fbm-box-layout-workspace {
    grid-template-columns: minmax(0, 1fr);
  }
  }

/* Действия документа FBM/FBS рисует один Jinja-компонент. Значения повторяют
   прежний `flex flex-wrap items-center gap-1.5`: промежуток остаётся ровно 6px. */
.wms-document-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .375rem;
}
.wms-document-action.oz-open {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  line-height: 1;
}
.wms-document-action-form { display: inline; }
.wms-document-actions-secondary { display: contents; }
.wms-document-action-notice {
  flex: 0 0 100%;
  margin-bottom: .25rem;
  padding: .25rem .5rem;
  border: 1px solid #7dd3fc;
  border-radius: .25rem;
  background: #f0f9ff;
  color: #075985;
  font-size: .625rem;
  line-height: 1.2;
}

/* Список отгрузок на телефоне: фиксируем раскладку колонок, чтобы ширина шапки
   строки была ОДИНАКОВОЙ в свёрнутом и раскрытом виде (иначе широкий блок состава
   в раскрытой строке через auto-layout пере-раскидывал ширины 2 видимых колонок). */
/* ⭐⭐⭐ РАСКЛАДКА «ДЕЙСТВИЕ» — ЛЮБОМУ СПИСКУ ДОКУМЕНТОВ, а не только отгрузкам
   (владелец 22.08: «на телефоне неудобный интерфейс — невозможно скачать документы,
   распечатать ярлыки/этикетки»). Правила ниже оплачены четырьмя боевыми жалобами подряд
   (12.07, 29.07, 01.08, 07.08), но целились в `#ship-list` — и список поставок FBS, где
   та же структура `tr.ship-row > td.ship-actions`, обходился стороной: кнопки так же
   вылезали за ячейку и обрезались по краю.
   ⚠️ Класс, а не второй id: страж `test_shipments_fit_width` прямо требует целиться
   классом — иначе третий такой список снова окажется непокрытым. Класс вешается на
   таблицу рядом с её id (`shipments_list.html`, `wms/fbs.html`).
   ⚠️ Десктопные ширины колонок ниже (блок 1024px) остаются на `#ship-list`: там проценты
   рассчитаны под ЕГО набор колонок, у FBS он другой. */
@media (max-width: 767px) {
  .doc-list { table-layout: fixed; }
  .doc-list > thead > tr > th:first-child,
  .doc-list > tbody > tr.ship-row > td:first-child { width: 58%; }
  /* Колонке «Действие» — тоже явная ширина. Иначе table-layout:fixed делит
     оставшиеся 42% между ВСЕМИ прочими колонками, включая скрытые
     (hidden md:table-cell), и «Действие» получает ~1/8 (~19px): кнопки вылезают
     за узкую голубую заливку раскрытой строки → «кривая заливка».
     ⚠️⚠️ «Действие» — ДЕВЯТАЯ колонка из десяти, НЕ последняя (:last-child — это
     скрытый на телефоне «Ответственный»). Фикс 12.07 прибил ширину к :last-child,
     то есть к НЕВИДИМОЙ ячейке — на десктопе сходило с рук, а телефон владельца
     продолжал рисовать «белый квадрат» (вернувшаяся жалоба 29.07): контент действий
     шире своей безразмерной ячейки и вылезал на белый фон контейнера, мимо голубой
     заливки раскрытой строки. Ширина обязана стоять на РЕАЛЬНОЙ колонке. */
  .doc-list > thead > tr > th.ship-actions,
  .doc-list > tbody > tr.ship-row > td.ship-actions { width: 42%; }
              /* Кнопкам действий на телефоне разрешаем перенос текста: с nowrap широкая
     «В сформированную» (~200px) шире своей ячейки (~150px) и вылезала на белый
     фон контейнера мимо голубой заливки (замерено: +79px за край ячейки). */
  .doc-list > tbody > tr.ship-row > td.ship-actions button,
  .doc-list > tbody > tr.ship-row > td.ship-actions a {
    white-space: normal; max-width: 100%; overflow-wrap: anywhere;
  }
  /* …и их обёрткам («неразрывная пара» кнопка+✕, формы) — тоже нельзя быть шире
     ячейки: вылезала именно обёртка span.inline-flex (замерено: +79px). Пару на
     телефоне кладём в столбик — иначе flex-wrap отрывал ✕ от кнопки и он наезжал
     на метрики строки. Кнопкам — 12px: «↺ В сформированную» переносится по словам,
     а не рвётся посреди слова. */
  .doc-list > tbody > tr.ship-row > td.ship-actions form,
  .doc-list > tbody > tr.ship-row > td.ship-actions span {
    max-width: 100%; min-width: 0; flex-wrap: wrap;
  }
  /* ⭐ Мелкие действия (перебронь · шаг назад · отмена) — В ОДНУ СТРОКУ
     (владелец 01.08: «топорно»).
     Колонкой их ставили, пока это были широкие текстовые кнопки («↺ В сформированную»);
     теперь это иконки 40×40, и столбик давал по этажу на каждую. */
  .doc-list > tbody > tr.ship-row > td.ship-actions span.inline-flex {
    flex-direction: row; align-items: center; flex-wrap: wrap;
  }
  /* Сама ячейка — поток с переносом: главное действие своей строкой, а мелкие кнопки
     и иконки документов собираются в общий ряд, а не в отдельные этажи. */
  .doc-list > tbody > tr.ship-row > td.ship-actions > div:first-child {
    display: flex; flex-wrap: wrap; align-items: center; gap: .375rem;
  }
  .doc-list > tbody > tr.ship-row > td.ship-actions button {
    font-size: 12px; overflow-wrap: normal;
  }
  /* Иконки документов на телефоне не сжимаются: в узкой ячейке flex ужимал их до
     19px («убогие иконки непонятной ширины», жалоба 01.08). */
  .doc-list > tbody > tr.ship-row > td.ship-actions .doc-icon { flex: 0 0 auto; }
}

/* Иконка-документ (короб · скачать · этикетка · скрепка · удалить) — ОДИН размер на все иконки строки поставки.
   ⚠️ Раньше размер задавали утилитами «w-10 h-10», но класса .h-10 в собранной
   сборке Tailwind НЕТ (как и sm:/md:-вариантов — тот же капкан, что 31.07):
   ширина применялась, высота нет, и в узкой ячейке иконки выходили 20×30 —
   «убогие, непонятной ширины». Свой класс не зависит от состава сборки. */
.doc-icon {
  width: 2.5rem; height: 2.5rem; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.125rem; line-height: 1;
}
.wms-document-utility-action {
  width: 28px;
  height: 28px;
  min-height: 28px;
}
@media (max-width: 767px) {
  /* Обёртка нужна desktop-переносу, но на телефоне сохраняет прежний единый ряд
     служебных иконок. */
  .wms-document-actions-secondary-row {
    display: flex;
    max-width: 100%;
    min-width: 0;
    align-items: center;
    flex-wrap: wrap;
    gap: .375rem;
  }
}
@media (min-width: 768px) {
  .doc-icon { width: 1.75rem; height: 1.75rem; font-size: .875rem; }
  .wms-document-utility-action { width: 1.5rem; height: var(--ui-control-height-compact); min-height: var(--ui-control-height-compact); }
  /* FBM · «Сформирована» / «Собрана»: главный шаг живёт в первом
     ряду, а служебные действия — единым вторым рядом. */
  .wms-document-actions-secondary-row {
    display: flex;
    flex: 0 0 100%;
    align-items: center;
    gap: .375rem;
  }
  /* FBM · «Собрана» и «Упакована»: второй ряд «Шаг назад» остаётся под главным
     действием, но больше не делает строку выше соседних. Было: 28 + 6 + 24 + 16 = 74px;
     стало: 28 + 0 + 24 + 12 = 64px. Размеры самих кнопок не меняются.
     ⚠️ 627: «Упакована» добавлена сюда же (аудит 13.09) — у неё та же пара «главное
     действие + шаг назад», и без класса строка была бы выше соседних. */
  #ship-list > tbody > tr.ship-row:is(.fbm-shipment-status-picked, .fbm-shipment-status-packed) > td.ship-actions {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
  #ship-list > tbody > tr.ship-row:is(.fbm-shipment-status-picked, .fbm-shipment-status-packed) > td.ship-actions > div:first-child {
    row-gap: 0;
  }
}

/* ─────────────────────────────────────────────────────────────────────────
   ЕДИНЫЙ ШРИФТ ВСЕЙ СИСТЕМЫ (одна точка правды).
   Раньше по интерфейсу шёл «компот»: моно-шрифт (font-mono) на кодах/датах/ID
   мешался с sans на подписях — это било по глазам. Здесь фиксируем ОДНО
   семейство на всё приложение и включаем табличные цифры (одинаковая ширина
   цифр → числа/коды/даты выровнены по колонкам без моноширинного шрифта).
   Меняя шрифт здесь — меняем его во всей системе. */
:root {
  --app-font: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
              Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
}
html, body {
  font-family: var(--app-font);
  font-variant-numeric: tabular-nums;
}
/* Утилита font-mono больше НЕ переключает семейство — только сохраняет
   табличные цифры (выравнивание). Так весь UI в одном шрифте. */
.font-mono {
  font-family: var(--app-font) !important;
  font-variant-numeric: tabular-nums;
}

/* Карточка товара: название экрана и SKU образуют один заголовочный ряд. */
.product-form-title {
  display: flex;
  min-width: 0;
  min-height: 0;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: .5rem;
  padding-top: 0;
  white-space: nowrap;
}
.product-form-title-sku {
  min-width: 0;
  overflow: hidden;
  color: #64748b;
  font-size: .875rem;
  font-weight: 400;
  text-overflow: ellipsis;
}
.product-main-fields {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}
.product-form-section { padding-top: 1rem; }
.product-section-heading { column-gap: .25rem; }
.product-heading-detail { letter-spacing: 0; }
.product-form-actions { gap: 2.25rem; }
.product-channel-form input[type="text"] {
  width: 20rem;
  max-width: 100%;
}
.product-channel-form input.product-channel-id-field[type="text"] { width: 10rem; }
.product-channel-form input[name="external_vendor_code"][type="text"] { width: 11.25rem; }
.product-channel-form input[name="external_barcodes"][type="text"] { width: 13.75rem; }
.product-channel-primary-fields,
.product-channel-description-fields {
  display: grid;
  align-items: end;
  gap: .75rem;
}
.product-channel-primary-fields {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .5rem;
}
.product-channel-form .product-channel-primary-fields input[type="text"] { width: 100%; }
.product-channel-description-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-channel-description-fields input[type="text"] { width: 100%; }
@media (max-width: 1023px) {
  .product-channel-primary-fields,
  .product-channel-description-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .product-channel-primary-fields,
  .product-channel-description-fields { grid-template-columns: minmax(0, 1fr); }
}
.product-break-even-input {
  width: 7rem;
  max-width: 100%;
}
#barcodes_list input[name="barcode"] {
  flex: 0 0 20rem;
  width: 20rem;
  min-width: 0;
}
@media (max-width: 639px) {
  #barcodes_list input[name="barcode"] {
    flex: 1 1 auto;
    width: auto;
  }
}
[data-product-form] [data-barcode-add] {
  display: inline-flex;
  min-height: 2.625rem;
  align-items: center;
}
.packaging-seven-fields-grid {
  display: grid;
  grid-template-columns: 5.375rem 9rem 5.75rem repeat(4, 5.125rem);
  gap: .5rem;
}
.packaging-unit-fields-grid {
  display: grid;
  grid-template-columns: repeat(5, 8.25rem);
  gap: .5rem;
}
@media (max-width: 767px) {
  .packaging-seven-fields-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .packaging-unit-fields-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 639px) {
  .packaging-seven-fields-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .packaging-unit-fields-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.product-main-fields > div { min-width: 0; }
.product-classification-fields {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}
.product-classification-fields > div { min-width: 0; }
/* Мигр.897 (#1580): ОКПД 2 и документы соответствия — свой ряд под классификацией. */
.product-conformity-fields {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}
.product-conformity-fields > div { min-width: 0; }
/* Мигр.928 (#1694): ряд «GTIN · вид · маркировка» карточки товара — свой ряд, как у документов. */
.product-marking-fields {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr);
  gap: 1rem;
}
.product-marking-fields > div { min-width: 0; }
.product-marking-status { overflow-wrap: anywhere; }
/* Мигр.930 (#1694): подсказки площадок под полем реквизита — мелко, не спорят с полем. */
.product-mp-hint {
  margin-top: .375rem;
  font-size: .75rem;
  color: #64748b;
  overflow-wrap: anywhere;
}
.product-mp-hint-take {
  margin-left: .25rem;
  padding: 0 .375rem;
  border: 1px solid #94a3b8;
  border-radius: .25rem;
  color: #1d4ed8;
  background: #fff;
}
.product-mp-hint-take:hover { background: #eff6ff; }
.product-marking-exempt {
  display: flex;
  align-items: center;
  gap: .375rem;
  margin-top: .375rem;
  font-size: .8125rem;
  color: #475569;
  cursor: pointer;
}
.product-conformity-list {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding: .5rem .75rem;
  border: 1px solid #e2e8f0;
  border-radius: .5rem;
  max-height: 12rem;
  overflow-y: auto;
}
.product-conformity-item {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: .25rem .5rem;
  font-size: .875rem;
  cursor: pointer;
  overflow-wrap: anywhere;
}
/* Экран «Документы соответствия» (мигр.897): форма добавления и ширина номера в строке. */
.conformity-doc-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .75rem;
  align-items: end;
}
.conformity-doc-fields > div { min-width: 0; }
@media (min-width: 768px) {
  .conformity-doc-fields { grid-template-columns: 9rem minmax(0, 1fr) 9.5rem 9.5rem auto; }
}
.conformity-doc-number { width: 100%; min-width: 16rem; }
/* #1955: категории документа — галочки справочника (форма добавления и правка в строке). */
.conformity-doc-cats { display: flex; flex-wrap: wrap; gap: .25rem .75rem; }
.conformity-doc-cats label {
  display: inline-flex; align-items: center; gap: .25rem;
  font-size: .875rem; cursor: pointer; white-space: nowrap;
}
.conformity-doc-cats-pick { min-width: 12rem; }
.conformity-doc-cats-pick > summary { cursor: pointer; list-style: none; font-size: .875rem; }
.conformity-doc-cats-pick > summary::-webkit-details-marker { display: none; }
.conformity-doc-cats-pick[open] > .conformity-doc-cats {
  flex-direction: column; flex-wrap: nowrap; margin-top: .375rem; padding: .5rem;
  border: 1px solid #e2e8f0; border-radius: .5rem; background: #fff;
  max-height: 14rem; overflow-y: auto;
}
.conformity-doc-no-cat { color: #b45309; }
/* Мигр.928 (#1694): справочник маркировки по коду ТН ВЭД — форма добавления и правка в строке. */
.marking-ref-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .75rem;
  align-items: end;
}
.marking-ref-fields > div { min-width: 0; }
@media (min-width: 768px) {
  .marking-ref-fields { grid-template-columns: 10rem 9.5rem minmax(0, 1fr) auto; }
}
.marking-ref-code { width: 8.5rem; }
.marking-ref-basis { width: 100%; min-width: 14rem; }
.product-segmentation-fields {
  display: grid;
  min-width: 0;
  gap: 1rem;
}
.product-segmentation-panel,
.product-segmentation-status { min-width: 0; }
.product-segmentation-panel > div {
  border-color: #e2e8f0;
  border-radius: .375rem;
}
.product-segmentation-panel table.text-sm {
  min-width: 20rem;
  font-size: .625rem;
  line-height: 1;
}
.product-segmentation-panel table.text-sm > thead {
  color: #94a3b8;
  font-size: .5625rem;
}
.product-segmentation-panel--org table > thead,
.product-segmentation-panel--org table > thead > tr,
.product-segmentation-panel--org table > thead > tr > th { background-color: #eff6ff; }
.product-segmentation-panel--channel table > thead,
.product-segmentation-panel--channel table > thead > tr,
.product-segmentation-panel--channel table > thead > tr > th { background-color: #f8fafc; }
.product-segmentation-panel table.text-sm > :is(thead, tbody, tfoot) > tr > :is(th, td) {
  height: 1rem;
  padding: .0625rem .25rem;
  line-height: 1;
}
.product-segmentation-panel table.text-sm > thead > tr > th {
  font-size: .5625rem;
  line-height: 1;
}
.product-segmentation-panel tbody > tr { border-color: #f1f5f9; }
.product-recipe-heading {
  display: flex;
  min-width: 0;
  align-items: baseline;
  gap: .5rem;
  margin-bottom: .5rem;
}
.product-recipe-title {
  flex: 0 0 auto;
  color: #334155;
  font-size: .875rem;
  font-weight: 500;
}
.product-recipe-note {
  min-width: 0;
  color: #64748b;
  font-size: .75rem;
}
.product-recipe-lines {
  display: grid;
  min-width: 0;
  gap: .5rem;
}
#recipe-rows {
  display: grid;
  min-width: 0;
  gap: .5rem;
}
.recipe-row {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(220px, 1fr) 8rem 1.5rem max-content;
  align-items: center;
  gap: .5rem;
}
.recipe-material-field,
.recipe-quantity-field { min-width: 0; }
.recipe-primary-tag {
  color: #2563eb;
  font-size: .625rem;
  white-space: nowrap;
}
.recipe-del {
  width: 1.5rem;
  height: 2.25rem;
  padding: 0;
  color: #cbd5e1;
  font-size: 1.125rem;
  line-height: 1;
}
.recipe-del:hover { color: #f43f5e; }
#recipe-add {
  color: #2563eb;
  font-size: .875rem;
  white-space: nowrap;
}
#recipe-add:hover { text-decoration: underline; }
@media (min-width: 1024px) {
  .product-main-fields {
    grid-template-columns: 220px minmax(9rem, 1fr) 14.5rem 13.5rem;
    align-items: end;
    gap: .5rem;
  }
  .product-main-fields > div > label {
    font-size: .7rem;
    white-space: nowrap;
  }
  .product-classification-fields {
    grid-template-columns: 1.7fr 1.2fr 3fr 2.1fr 2fr;
    align-items: end;
    gap: .5rem;
  }
  /* Мигр.901: третья колонка — «Группа вариантов» между ОКПД 2 и документами. */
  .product-conformity-fields {
    grid-template-columns: 1.2fr 1.8fr 6fr;
    gap: .5rem;
  }
  .product-conformity-fields > div > label { font-size: .7rem; white-space: nowrap; }
  .product-marking-fields {
    grid-template-columns: 1.4fr 1.6fr 6fr;
    gap: .5rem;
  }
  .product-marking-fields > div > label.block { font-size: .7rem; white-space: nowrap; }
  .product-classification-fields > div > label {
    font-size: .7rem;
    white-space: nowrap;
  }
  .product-segmentation-fields {
    display: flex;
    align-items: flex-start;
    gap: .5rem;
  }
  .product-segmentation-panel { flex: 1 1 0; }
  .product-segmentation-status { flex: 0 0 14rem; }
  .product-segmentation-fields > div > label {
    font-size: .7rem;
    white-space: nowrap;
  }
  .product-recipe-heading { white-space: nowrap; }
  .product-recipe-lines {
    grid-template-columns: minmax(0, 1fr) max-content;
    align-items: start;
  }
  #recipe-add {
    min-height: 2.25rem;
    padding: 0 .25rem;
  }
}
@media (max-width: 767px) {
  .recipe-row { grid-template-columns: minmax(0, 1fr) 7rem 1.5rem; }
  .recipe-primary-tag { grid-column: 1 / -1; }
}
@media (max-width: 1023px) {
  .product-recipe-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: .25rem;
  }
  .product-recipe-note { width: 100%; }
}
@media (max-width: 639px) {
  [data-product-form] p,
  #pkg-modal p { line-height: 1.2; }
  .product-recipe-heading { gap: .125rem; }
  .product-barcodes-heading {
    display: grid;
    align-items: start;
    gap: .125rem;
  }
  .product-barcodes-heading-main {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    column-gap: .25rem;
    line-height: 1.2;
  }
  .product-barcodes-heading-note {
    margin-left: 0;
    text-align: left;
    line-height: 1.2;
  }
}

/* Товары: тяжёлая форма импорта не занимает место в шапке до запроса человека. */
.products-head-actions {
  display: flex;
  width: auto;
  min-width: 0;
  flex: 1 1 auto;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  gap: .4rem;
}
.products-file-actions {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: .4rem;
  flex-wrap: nowrap;
  white-space: nowrap;
}
.products-control-with-help {
  position: relative;
  display: inline-flex;
  min-width: 0;
  align-items: center;
}
.products-control-with-help > .help {
  position: absolute;
  z-index: 2;
  top: 50%;
  margin: 0;
  transform: translateY(-50%);
}
.products-control-with-help--select > .help {
  right: 1.95rem;
}
.products-control-with-help--select :is(.ms-caret, .ss-caret) {
  margin-left: .75rem;
}
.products-export-action > .help {
  margin-left: 0;
}
.products-file-actions #export-template {
  width: 160px;
  min-width: 160px;
  max-width: 160px;
  height: 36px;
  flex: 0 0 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.products-search-actions {
  display: flex;
  width: auto;
  min-width: 0;
  flex: 1 1 24rem;
  align-items: center;
  gap: .4rem;
  flex-wrap: nowrap;
}
.products-search-actions > input[type="search"] {
  min-width: 0;
  flex: 1 1 auto;
}
.products-search-actions > form,
.products-search-actions > form > button,
.products-search-actions > button {
  flex: 0 0 auto;
  margin: 0;
}
@media (min-width: 1024px) {
  .products-search-actions {
    flex: 0 0 auto;
    margin-left: 1.1rem;
  }
  .products-search-actions > input[type="search"] {
    width: 12rem;
    flex: 0 0 12rem;
  }
}
.products-add-action {
  box-sizing: border-box;
  height: 36px;
  min-height: 36px;
}
.ms-mobile-placeholder {
  display: none;
}
.products-import-menu {
  position: relative;
  z-index: 30;
}
.products-import-trigger {
  box-sizing: border-box;
  display: inline-flex;
  height: 36px;
  min-height: 36px;
  align-items: center;
  padding: .4rem .8rem;
  border: 1px solid #c4b5fd;
  border-radius: .6rem;
  background: #ede9fe;
  color: #6d28d9;
  cursor: pointer;
  font-family: inherit;
  font-size: .78rem;
  font-weight: 500;
  line-height: 1.2;
  list-style: none;
  white-space: nowrap;
}
.products-import-trigger::-webkit-details-marker { display: none; }
.products-import-trigger:hover {
  border-color: #a78bfa;
  background: #ddd6fe;
  color: #5b21b6;
}
.products-import-trigger:focus-visible {
  border-color: #8b5cf6;
  outline: none;
}
.products-import-menu[open] > .products-import-trigger {
  border-color: #a78bfa;
  background: #ddd6fe;
  color: #5b21b6;
}
.products-import-panel {
  box-sizing: border-box;
  position: absolute;
  top: calc(100% + .45rem);
  left: 0;
  width: min(28rem, calc(100vw - 2rem));
  padding: .6rem;
  border: 1px solid #e2e8f0;
  border-radius: .75rem;
  background: #fff;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .14);
  overflow: hidden;
  overflow-wrap: anywhere;
  white-space: normal;
}
.products-import-note {
  margin: 0 0 .45rem;
  color: #64748b;
  font-size: .7rem;
  line-height: 1.35;
}
.products-import-template-link {
  display: inline-flex;
  margin-left: .35rem;
  color: #2563eb;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
}
.products-import-template-link:hover { text-decoration: underline; }
.products-import-panel [data-dropzone] {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.products-import-panel [data-dropzone] > .flex {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .35rem .5rem;
  white-space: nowrap;
}
.products-import-panel [data-dropzone] form {
  display: grid;
  width: 100%;
  min-width: 0;
  grid-column: 1 / -1;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: .5rem;
}
.products-import-panel [data-dropzone-label] {
  min-width: 0;
  max-width: none;
}
.products-import-panel [data-dropzone] details > div,
.products-import-panel [data-dropzone] details a {
  min-width: 0;
}
.products-import-history {
  grid-column: 2;
  width: max-content;
  max-width: 100%;
  margin-left: 0;
  justify-self: end;
}
.products-import-history > summary {
  text-align: right;
}
.products-import-panel .upload-drop-hint {
  display: block;
  grid-column: 1;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-wrap: anywhere;
  white-space: normal !important;
}
.products-filter-reset-short { display: none; }
@media (max-width: 1023px) {
  .products-file-actions > .help.products-export-help {
    display: none !important;
  }
}
@media (max-width: 1023px) {
  .products-head-actions {
    width: 100%;
    flex-basis: 100%;
    flex-direction: column;
    align-items: stretch;
  }
  .products-file-actions {
    display: grid;
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: .3rem;
  }
  .products-file-actions > .products-import-menu {
    min-width: 0;
  }
  .products-file-actions .products-import-trigger {
    height: 30px;
    min-height: 30px;
    padding: .32rem .45rem;
    font-size: .7rem;
  }
  .products-file-actions > .ss-wrap {
    width: 100%;
    min-width: 0;
  }
  .products-file-actions > .ss-wrap > .ss-field {
    gap: .35rem;
    padding-right: .45rem;
    padding-left: .45rem;
    font-size: .7rem;
  }
  .products-file-actions #export-template {
    width: auto;
    min-width: 0;
    max-width: none;
    height: 30px;
    flex: 1 1 auto;
    padding-right: .35rem;
    padding-left: .45rem;
    font-size: .7rem;
  }
  .products-file-actions .ui-export-action {
    flex: 0 0 auto;
  }
  .products-export-action {
    gap: .35rem;
    padding-right: .55rem;
    padding-left: .55rem;
    font-size: .7rem;
  }
  .products-export-action::before {
    width: .8rem;
    height: .8rem;
    flex-basis: .8rem;
  }
  .products-export-action > .help {
    width: 12px;
    height: 12px;
    min-width: 12px;
    font-size: 8px;
  }
  .products-file-actions > .help {
    display: none;
  }
  .products-search-actions {
    width: 100%;
    flex: 0 0 auto;
    gap: .3rem;
  }
  .products-search-actions > input[type="search"] {
    width: auto;
  }
  .products-filter-bar {
    padding-top: .35rem;
    margin-bottom: .65rem;
    gap: .3rem !important;
  }
  .products-filter-form {
    width: 100%;
    gap: .3rem !important;
  }
  .products-filter-label {
    display: none;
  }
  .products-filter-form > .ui-segmented {
    margin-right: 0;
  }
  .products-filter-form details.ms > .ms-summary {
    width: max-content !important;
    min-width: 0 !important;
    max-width: min(18rem, calc(100vw - 1rem));
    padding-right: .5rem;
    padding-left: .55rem;
    gap: .35rem;
  }
  .products-filter-form .ms-desktop-placeholder {
    display: none;
  }
  .products-filter-form .ms-mobile-placeholder {
    display: inline;
  }
  .products-filter-form > .inline-flex {
    gap: .15rem;
  }
  .products-filter-form .help {
    margin-left: .1rem;
  }
  .products-filter-form select[name="on_channels"] {
    width: auto;
    min-width: 0;
    max-width: min(14rem, calc(100vw - 1rem));
    field-sizing: content;
  }
  .products-filter-form .products-listing-filter > .ss-wrap {
    width: max-content !important;
    min-width: 0 !important;
    max-width: min(14rem, calc(100vw - 1rem));
  }
  .products-filter-form .products-listing-filter > .ss-wrap > .ss-field {
    width: max-content !important;
    min-width: 0 !important;
    max-width: 100%;
  }
  .products-filter-form > a {
    padding-right: .45rem;
    padding-left: .45rem;
    font-size: .7rem;
  }
  .products-filter-reset {
    box-sizing: border-box;
    display: inline-flex;
    width: 1.5rem;
    height: 1.5rem;
    min-width: 1.5rem;
    flex: 0 0 1.5rem;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border: 0;
    border-radius: 999px;
    background: #eef1f6;
    color: #64748b;
    line-height: 1;
  }
  .products-filter-reset:hover {
    background: #e2e8f0;
    color: #475569;
  }
  .products-filter-reset-full { display: none; }
  .products-filter-reset-short { display: inline; }
  .products-import-trigger {
    height: 30px;
    min-height: 30px;
    padding: .32rem .55rem;
    font-size: .75rem;
  }
  .products-import-panel {
    right: auto;
    left: 0;
    width: min(22rem, calc(100vw - 1.5rem));
    max-width: calc(100vw - 1.5rem);
    overflow: hidden;
  }
}

/* Контрагенты: поиск и создание — одна управляющая строка. На телефоне поиск
   занимает остаток ширины, а кнопка сохраняет читаемую подпись и не падает вниз. */
.suppliers-toolbar { flex-wrap: nowrap; }
.suppliers-search { width: 18rem; }
@media (max-width: 640px) {
  .suppliers-toolbar {
    width: 100%;
    min-width: 0;
    gap: .4rem !important;
  }
  .suppliers-search {
    width: auto;
    min-width: 0;
    flex: 1 1 auto;
  }
  .suppliers-add-action {
    flex: 0 0 auto;
    padding-right: .65rem !important;
    padding-left: .65rem !important;
    font-size: .75rem !important;
  }

  /* Карточка контрагента — не восемь вертикальных строк, а компактная сетка.
     Все реквизиты остаются видимыми; действия стоят одной строкой справа внизу. */
  #suppliers-list.responsive.responsive-compact > tbody > tr,
  #suppliers-list.responsive.responsive-compact tr {
    position: relative;
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .28rem .45rem;
    margin-bottom: .35rem;
    padding: .48rem .55rem;
    border-radius: .65rem;
  }
  #suppliers-list.responsive.responsive-compact td {
    display: flex !important;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: .06rem;
    padding: 0;
    margin: 0;
    border: 0;
    font-size: .7rem;
    line-height: 1.15;
  }
  #suppliers-list.responsive.responsive-compact td::before {
    display: block;
    margin: 0;
    color: #94a3b8;
    font-size: .5rem;
    line-height: 1;
  }
  #suppliers-list td:nth-child(1) {
    grid-column: 1 / -1;
    grid-row: 1;
    font-size: .78rem;
  }
  #suppliers-list td:nth-child(1)::before { display: none; }
  #suppliers-list td:nth-child(2) {
    grid-column: 1;
    grid-row: 2;
    flex-direction: row;
    flex-wrap: wrap;
    gap: .2rem;
  }
  #suppliers-list td:nth-child(2) > span { white-space: nowrap; }
  #suppliers-list td:nth-child(3) { grid-column: 2; grid-row: 2; }
  #suppliers-list td:nth-child(4) { grid-column: 3; grid-row: 2; }
  #suppliers-list td:nth-child(5) { grid-column: 1; grid-row: 3; }
  #suppliers-list td:nth-child(6) {
    grid-column: 2;
    grid-row: 3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #suppliers-list td:nth-child(7) { grid-column: 3; grid-row: 3; }
  #suppliers-list td:nth-child(8) {
    grid-column: 1 / -1;
    grid-row: 4;
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    align-self: end;
    justify-self: end;
    min-width: max-content;
    white-space: nowrap;
    gap: .35rem;
    padding: 0;
    margin: 0;
    border: 0;
    font-size: .65rem;
  }
  #suppliers-list .supplier-card-actions {
    display: inline-flex !important;
    flex-flow: row nowrap !important;
    align-items: center;
    justify-content: flex-end;
    gap: .35rem;
    width: max-content;
    white-space: nowrap;
  }
  #suppliers-list .supplier-card-actions > button,
  #suppliers-list .supplier-card-actions > form,
  #suppliers-list .supplier-card-actions > form > button {
    display: inline-block;
    flex: 0 0 auto;
    margin: 0;
    white-space: nowrap;
  }
  #suppliers-list td:nth-child(8)::before { display: none !important; }
  #suppliers-list td[colspan] {
    grid-column: 1 / -1;
    align-items: center;
    text-align: center;
  }
}

/* Карточка возврата: на desktop таблица имеет точную сетку 1310px без переносов.
   Страница не превышает 1312px: сетка таблицы + две рамки контейнера по 1px. */
.return-card-page { max-width: 1312px; }
.ret-cost-warning-mobile { display: none; }
.ui-action.return-card-defect-action {
  border-color: #fda4af;
  background: #fff;
  color: #e11d48;
}
.ui-action.return-card-defect-action:hover:not(:disabled) {
  border-color: #fb7185;
  background: #fff1f2;
  color: #be123c;
}
@media (min-width: 641px) {
  table.ret-lines {
    min-width: 1310px;
    table-layout: fixed;
  }
  table.ret-lines th,
  table.ret-lines td { white-space: nowrap; }
  table.ret-lines .ret-col-index { width: 28px; }
  table.ret-lines .ret-col-sku { width: 170px; }
  table.ret-lines .ret-col-category { width: 170px; }
  table.ret-lines .ret-col-org { width: 116px; }
  /* Номер возврата площадки (15.10) — отдельной строкой под строкой товара: переносится,
     а не режется, как прочие ячейки. */
  table.ret-lines td.ret-mpcode { white-space: normal; }
  table.ret-lines .ret-col-accepted { width: 78px; }
  table.ret-lines .ret-col-sale { width: 94px; }
  table.ret-lines .ret-col-defect { width: 52px; }
  table.ret-lines .ret-col-quarantine { width: 112px; }
  table.ret-lines .ret-col-action { width: 490px; }
  table.ret-lines td[data-label="Категория"] {
    overflow: hidden;
    text-overflow: ellipsis;
  }
  table.ret-lines .ret-form { flex-wrap: nowrap; }
  table.ret-lines .ret-form > .ret-place {
    width: 240px;
    max-width: 240px;
  }
}

/* Mobile карточки для responsive-таблиц.
   На мобиле каждая строка становится карточкой:
     LABEL мелкой меткой сверху, значение под ней.
   Колонка "Действия" (последняя) — горизонтальный ряд иконок. */
@media (max-width: 640px) {
  /* Контейнер таблицы (overflow-x-auto, рамка) — на мобиле прозрачный,
     рамка идёт уже на каждой строке-карточке.
     :has() — для современных браузеров. Класс .responsive-wrap — fallback. */
  div.overflow-x-auto:has(> table.responsive),
  div.overflow-hidden:has(> table.responsive),
  .responsive-wrap {
    overflow-x: visible !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  /* Сама таблица + tbody становятся блоками */
  table.responsive,
  table.responsive > tbody {
    display: block !important;
    min-width: 0 !important;
    width: 100% !important;
    table-layout: auto !important;
  }
  /* Скрытие thead/colgroup ОБЯЗАТЕЛЬНО с !important, иначе перебиваются
     общим display:block выше */
  table.responsive > thead,
  table.responsive > colgroup,
  table.responsive thead,
  table.responsive colgroup {
    display: none !important;
  }

  table.responsive > tbody > tr,
  table.responsive tr {
    display: block !important;
    margin-bottom: 8px;
    padding: 10px 12px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    width: auto;
  }

  table.responsive td {
    display: block !important;
    padding: 5px 0;
    border: none;
    border-bottom: 1px solid #f1f5f9;
    width: auto !important;
    word-break: break-word;
  }
  table.responsive td:last-child { border-bottom: none; }

  table.responsive td::before {
    content: attr(data-label);
    display: block;
    font-weight: 600;
    color: #64748b;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 2px;
  }

  /* Последняя ячейка (обычно «Действия» с иконками) — иконки в ряд справа,
     без подписи метки. */
  table.responsive td:last-child {
    display: flex !important;
    justify-content: flex-end;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    padding-top: 8px;
    margin-top: 5px;
    border-top: 1px solid #e2e8f0;
  }
  table.responsive td:last-child::before { display: none !important; }

  /* Sticky-пины на мобиле не нужны — таблица в карточном режиме */
  table.responsive .col-pinned {
    position: static !important;
    left: auto !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  /* Компактный вариант карточек (.responsive-compact): подпись и значение В ОДНУ
     строку (label слева, значение справа). Для длинных рабочих списков — обычные
     карточки на телефоне слишком высокие (одна строка = целый экран). */
  table.responsive.responsive-compact > tbody > tr,
  table.responsive.responsive-compact tr {
    padding: 7px 10px;
    margin-bottom: 6px;
  }
  table.responsive.responsive-compact td {
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    padding: 2px 0;
    border-bottom: none;
  }
  table.responsive.responsive-compact td::before {
    display: inline;
    margin-bottom: 0;
    flex-shrink: 0;
  }
  table.responsive.responsive-compact td:last-child {
    padding-top: 4px;
    margin-top: 2px;
  }

  /* ⭐⭐⭐ КОЛОНКА, КОТОРОЙ НА ТЕЛЕФОНЕ НЕ МЕСТО (.phone-hide) — владелец 28.08:
     «ужасно неудобный и перегруженный интерфейс на мобильных у FBS».
     ⛔ Перегруз идёт НЕ от механики карточек (она и так по строке на ячейку), а от
     ЧИСЛА КОЛОНОК: у состава поставки FBS их семь, и каждая на телефоне становится
     отдельной строкой — 13 заказов превращаются в простыню на несколько экранов.
     ⚠️ Это НЕ то же, что `hidden md:table-cell`: там колонки нет и на телефоне ДО НЕЁ
     НЕ ДОБРАТЬСЯ вовсе (боевая жалоба 22.08 про документы). Здесь наоборот — данные
     остаются на ПК, а с телефона убирается ровно то, что сборщику у полки не нужно.
     ⚠️⚠️ Селектор ОБЯЗАН быть с `td`: правило карточек выше идёт с `!important` и
     специфичностью (0,2,2), короткий `.phone-hide` ей проигрывает — на этом уже
     обожглись в разборе возвратов 09.08 («правило было, эффекта не было»).
     ⚠️ Класс ОБЩИЙ, а не третья копия приёма: рядом уже жил узкий `.ret-hide-phone`
     только для возвратов. */
  table.responsive td.phone-hide,
  table.responsive th.phone-hide { display: none !important; }

  /* Строка-заголовок группы (tr.group-row, напр. организация над своими строками):
     на мобиле это НЕ карточка, а компактная подпись над группой карточек. */
  table.responsive tr.group-row {
    background: transparent !important;
    border: none !important;
    padding: 2px 4px !important;
    margin-bottom: 4px;
  }
  table.responsive tr.group-row > td,
  table.responsive tr.group-row > td:last-child {
    display: block !important;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    text-align: left;
    justify-content: flex-start;
  }
  table.responsive tr.group-row > td::before { display: none !important; }

  /* ⭐ Ячейка со ЗНАЧЕНИЕМ, которая оказалась последней в строке.
     Общее правило выше прячет подпись у последней ячейки — там обычно иконки действий.
     Но когда колонка действий условная (её нет у закрытого документа), последней
     становится обычная колонка с числом, и на телефоне остаётся голая цифра без слова.
     Класс возвращает ей вид обычной ячейки. Переиспользуемый — не для одной страницы. */
  table.responsive td.cell-keep-label {
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    border-top: none;
    margin-top: 0;
    padding-top: 3px;
  }
  table.responsive td.cell-keep-label::before { display: inline !important; }

  /* ─── Разбор возврата на телефоне (владелец 2026-08-09) ──────────────────
     «На телефоне возвраты неудобно возвращать в продажу». Замер на стенде с настоящим
     CSS (375 px): карточка позиции 411 px — восемь строк справки ради одного действия,
     кнопка отрывалась от своего поля и вставала отдельной строкой слева, адрес полки
     обрезался. Правила живут в общем медиа-блоке карточек (до 640 px): на ПК и планшете
     раскладка не меняется. */
  /* ⚠️⚠️ Селектор ОБЯЗАН быть с `td`: правило карточек выше стоит с `!important` и
     специфичностью (0,2,2) — короткий `.ret-hide-phone` (0,2,1) ему проигрывает, и
     ячейки продолжали показываться. Поймано на стенде: правило было, эффекта не было.
     Второй селектор — для подсказки внутри блока действий, это `div`, а не ячейка. */
  table.ret-lines td.ret-hide-phone,
  table.ret-lines .ret-act .ret-hide-phone { display: none !important; }

  /* Категория — строкой под артикулом, без подписи: слово «КАТЕГОРИЯ» забирает треть
     ширины, из-за чего текст рвался посередине («самоклеящ / аяся»), а бейдж
     «нет себест.» выдавливало в столбик. Что это категория — видно и так. */
  table.ret-lines td[data-label="Категория"] {
    display: block !important;
    padding: 0 0 4px;
  }
  table.ret-lines td[data-label="Категория"]::before { display: none !important; }

  /* Блок действий: НЕ прижимать вправо, как иконки, — это форма, а не ряд кнопок. */
  table.ret-lines td.ret-act {
    display: block !important;
    padding-top: 10px;
    margin-top: 6px;
    border-top: 1px solid #e2e8f0;
  }

  /* Базовый mobile fallback: поле и место стоят в первой строке, действие переносится.
     Специфичное правило карточки возврата ниже уплотняет все четыре элемента в один ряд. */
  table.ret-lines .ret-form > .ret-qty { width: 72px; flex: 0 0 72px; }
  /* ⚠️⚠️ Базис ИМЕННО 0, а не `auto`: у select своя ширина по самому длинному адресу
     («Линия 1 · Стеллаж 12 · Ярус 3 · Возвраты в продаже»), и с `auto` он не влезал
     рядом с полем и уезжал на свою строку — поле с числом оставалось висеть одно. */
  table.ret-lines .ret-form > .ret-place {
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
  }
  /* ⚠️ Палец, а не курсор: 44 px — минимальная цель нажатия (Apple HIG / Material). */
  table.ret-lines .ret-form > .ret-go {
    flex: 1 0 100%;
    min-height: 44px;
  }

  /* Карточка возврата: рабочая мобильная компоновка без горизонтального скролла
     в шапке и без двух полноширинных кнопок друг под другом. */
  #return-card .return-card-back {
    margin-bottom: 4px;
    font-size: 12px;
    line-height: 16px;
  }
  #return-card .return-card-title-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 8px;
    margin-bottom: 12px;
    overflow: visible;
    white-space: normal;
  }
  #return-card .return-card-title-line .ui-page-title {
    display: block;
    min-width: 0;
    min-height: 0;
    padding-top: 0;
    overflow: hidden;
    font-size: 18px;
    line-height: 22px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #return-card .return-card-title-meta {
    grid-column: 1 / -1;
    font-size: 12px;
    line-height: 16px;
  }
  #return-card .return-card-title-separator,
  #return-card .return-card-bulk-note,
  #return-card .return-card-help {
    display: none;
  }
  #return-card .return-card-bulk .ui-action {
    width: 100%;
    min-height: 36px;
    white-space: normal;
  }
  #return-card table.ret-lines.responsive.responsive-compact > tbody > tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto;
    column-gap: 8px;
    padding: 5px 8px;
    margin-bottom: 6px;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .05);
  }
  #return-card table.ret-lines td[data-label="Категория"] {
    display: none !important;
  }
  #return-card table.ret-lines td[data-label="Артикул"] {
    grid-column: 1;
    grid-row: 1;
    justify-content: flex-start;
    text-align: left;
  }
  #return-card table.ret-lines td[data-label="Артикул"]::before {
    display: none !important;
  }
  #return-card .ret-cost-warning-mobile {
    display: inline-block;
  }
  #return-card table.ret-lines td[data-label="Принято"],
  #return-card table.ret-lines td[data-label="В карантине"] {
    display: inline-flex !important;
    grid-row: 1;
    align-items: baseline;
    justify-content: flex-start;
    gap: 3px;
    padding: 2px 0;
    margin: 0;
    border: 0;
    text-align: left;
    white-space: nowrap;
  }
  #return-card table.ret-lines td[data-label="Принято"] {
    grid-column: 2;
  }
  #return-card table.ret-lines td[data-label="В карантине"] {
    grid-column: 3;
  }
  #return-card table.ret-lines td[data-label="Принято"]::before,
  #return-card table.ret-lines td[data-label="В карантине"]::before {
    display: inline !important;
    margin: 0;
    font-size: 10px;
    letter-spacing: 0;
    text-transform: none;
  }
  #return-card table.ret-lines td.ret-act {
    grid-column: 1 / -1;
    padding-top: 8px;
    padding-bottom: 0;
    margin-top: 4px;
  }
  #return-card table.ret-lines .ret-form {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: 30px 30px;
    gap: 4px;
    width: 100%;
    margin-right: 0;
  }
  #return-card table.ret-lines .ret-form > .ret-qty {
    grid-column: 1;
    grid-row: 1;
    width: 40px;
    height: 30px;
    font-size: 12px;
  }
  #return-card table.ret-lines .ret-form > .ret-place {
    grid-column: 2 / 4;
    grid-row: 1;
    width: 100%;
    height: 30px;
    font-size: 12px;
  }
  #return-card table.ret-lines .ret-form > .ret-go {
    flex: 0 0 auto;
    min-width: 0;
    height: 30px;
    min-height: 30px;
    padding-right: 6px;
    padding-left: 6px;
    font-size: 10px;
  }
  #return-card table.ret-lines .ret-form > .ret-go.ui-action--primary {
    grid-column: 1 / 3;
    grid-row: 2;
    width: 100%;
  }
  #return-card table.ret-lines .ret-form > .ret-go.return-card-defect-action {
    grid-column: 3;
    grid-row: 2;
    width: 100%;
  }
  /* Закрытая строка возврата: артикул и четыре фактических количества стоят одним
     рядом. После фиксированной колонки артикула четыре равные колонки удерживают
     подписи и числа на одних позициях при любых значениях. Рамки + padding входят
     в точную высоту 34px. */
  #return-card table.ret-lines.responsive.responsive-compact > tbody > tr.return-line--closed {
    grid-template-columns: 72px repeat(4, minmax(0, 1fr));
    grid-template-rows: 24px;
    column-gap: 0;
    row-gap: 0;
    box-sizing: border-box;
    height: 34px;
    padding: 4px 8px;
    margin-bottom: 0;
  }
  #return-card table.ret-lines > tbody > tr.return-line--closed > td[data-label="Артикул"] {
    grid-column: 1;
    grid-row: 1;
    padding: 0;
    font-size: 12px;
    line-height: 16px;
  }
  #return-card table.ret-lines > tbody > tr.return-line--closed > td:is(
    [data-label="Принято"],
    [data-label="В продажу"]:not(.ret-hide-phone),
    [data-label="Брак"]:not(.ret-hide-phone),
    [data-label="В карантине"]
  ) {
    display: inline-flex !important;
    grid-row: 1;
    align-items: baseline;
    justify-content: center;
    gap: 2px;
    margin: 0;
    padding: 0;
    border: 0;
    color: #334155;
    font-size: 10px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    line-height: 16px;
    text-align: center;
    white-space: nowrap;
  }
  #return-card table.ret-lines > tbody > tr.return-line--closed > td:is(
    [data-label="Принято"],
    [data-label="В продажу"],
    [data-label="Брак"],
    [data-label="В карантине"]
  )::before {
    margin: 0;
    color: #64748b;
    font-size: 8px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
  }
  #return-card table.ret-lines > tbody > tr.return-line--closed > td[data-label="Принято"] { grid-column: 2; }
  #return-card table.ret-lines > tbody > tr.return-line--closed > td[data-label="В продажу"] { grid-column: 3; }
  #return-card table.ret-lines > tbody > tr.return-line--closed > td[data-label="Брак"] { grid-column: 4; }
  #return-card table.ret-lines > tbody > tr.return-line--closed > td[data-label="В карантине"] { grid-column: 5; }
  /* Если у закрытой позиции есть обратимое списание, кнопке нужен собственный ряд.
     Обычная закрытая позиция остаётся 34px; вариант с действием — ровно 66px. */
  #return-card table.ret-lines.responsive.responsive-compact > tbody > tr.return-line--closed.return-line--undo {
    grid-template-rows: 24px 30px;
    row-gap: 2px;
    height: 66px;
  }
  #return-card table.ret-lines > tbody > tr.return-line--closed:not(.return-line--undo) > td.ret-act {
    display: none !important;
  }
  #return-card table.ret-lines > tbody > tr.return-line--closed.return-line--undo > td.ret-act {
    display: flex !important;
    grid-column: 1 / -1;
    grid-row: 2;
    align-items: center;
    justify-content: flex-start;
    padding: 2px 0 0;
    margin: 0;
    border: 0;
  }
  #return-card .return-card-footer {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  #return-card .return-card-cancel,
  #return-card .return-card-cancel .ui-action,
  #return-card .return-card-audit {
    width: 100%;
  }
  #return-card .return-card-cancel .ui-action {
    min-height: 44px;
  }
  #return-card .return-card-audit {
    margin-left: 0;
  }
}

/* Inline-editable ячейка — общий стиль для всех справочников */
.cell-edit { padding: 4px 6px; border-radius: 4px; cursor: pointer; }
.cell-edit:hover { background: #f1f5f9; }

/* ─── Help tooltip (?) ─────────────────────────────────────────────
   Использование:
     <span class="help" tabindex="0" data-tip="Текст подсказки">?</span>
   Внутри тега обязательно символ «?». Hover на десктопе, focus/tap на мобиле. */
.help {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  min-width: 14px;
  margin-left: 6px;
  background: #cbd5e1;
  color: #475569;
  border-radius: 50%;
  font-size: 10px;
  font-weight: 600;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  cursor: help;
  position: relative;
  vertical-align: 1px;
  user-select: none;
  line-height: 1;
  transition: background 0.15s, color 0.15s;
}
.help:hover, .help:focus, .help.open {
  background: var(--ui-accent);
  color: #ffffff;
  outline: none;
}

.help::after {
  content: attr(data-tip);
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%);
  background: #1e293b;
  color: #ffffff;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
  white-space: pre-line;
  width: max-content;
  max-width: 320px;
  pointer-events: none;
  opacity: 0;
  /* ⚠️ scale:0 (отдельное свойство, НЕ transform — его переопределяют варианты
     tip-left/right/fixed): невидимый тултип у «?» возле правого края создавал
     ФАНТОМНУЮ прокрутку у любого overflow-x-auto контейнера — opacity прячет, но
     геометрия блока (до 320px) оставалась и расширяла область скролла. Поймано на
     «Поставках» при подгонке под 1280px: шапка держала +35px из-за тултипа
     «Ответственный». scale:0 убирает бокс из геометрии, opacity-анимация цела. */
  scale: 0;
  transition: opacity .15s ease;
  z-index: 100;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .2);
  text-align: left;
}
.help::before {
  content: "";
  position: absolute;
  bottom: calc(100% + 2px);
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-top-color: #1e293b;
  pointer-events: none;
  opacity: 0;
  transition: opacity .15s ease;
  z-index: 100;
  scale: 0;
}
/* Текстовый носитель того же тултипа: не кружок «?», а сам текст («в т.ч.
   резерв: 27») — пунктирное подчёркивание сигналит «наведи/нажми». Это НЕ второй
   механизм подсказок, а вариант носителя единого .help (::after/::before общие). */
.help.help-inline {
  width: auto !important;
  min-width: 0;
  height: auto;
  margin-left: 0;
  background: none;
  border-radius: 0;
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
  cursor: help;
}
/* ⭐ Отметка «склад выбыл» (пожар/остановка), мигр.476. Носитель подсказки — тот же
   общий `.help`, и обязательно с `help-inline`: внутри не один символ, а значок И ДАТА
   (вопрос владельца был «КОГДА был пожар» — ответ обязан читаться глазами, без наведения
   мыши), а голый кружок 14px любой текст уродует (контракт
   `tests/test_help_badge_contract.py`). Здесь только окраска: красная пилюля вместо
   пунктирного подчёркивания. Селектор из трёх классов — чтобы перебить `.help.help-inline`. */
.help.help-inline.wh-inc {
  padding: 1px 5px;
  margin-left: 5px;
  border-radius: 4px;
  background: #fee2e2;
  color: #b91c1c;
  font-size: 11px;
  text-decoration: none;
  gap: 3px;
}
.help.help-inline.wh-inc:hover,
.help.help-inline.wh-inc:focus,
.help.help-inline.wh-inc.open {
  background: #fecaca;
  color: #7f1d1d;
}
.wh-inc-date {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
/* Подсказка у правого края (последние колонки таблиц, правая колонка попапов) —
   открывать влево, чтобы не уезжала за край экрана/диалога. */
.help.tip-left::after { left: auto; right: 0; transform: none; }
.help.tip-left::before { left: auto; right: 6px; transform: none; }
/* Подсказка у левого края (левая колонка попапов) — открывать вправо. */
.help.tip-right::after { left: 0; right: auto; transform: none; }
.help.tip-right::before { left: 6px; right: auto; transform: none; }
/* Подсказка в шапке таблицы (внутри overflow-x-auto) — открывать ВНИЗ, иначе
   верхний край скролл-контейнера её обрезает. Стрелка смотрит вверх. */
.help.tip-down::after { top: calc(100% + 8px); bottom: auto; }
.help.tip-down::before {
  top: calc(100% + 2px); bottom: auto;
  border-top-color: transparent; border-bottom-color: #1e293b;
}
/* ─── Drag-and-drop зона загрузки (file-dropzone.js) ───
   Любой [data-dropzone] с <input type=file> внутри принимает перетаскивание. */
[data-dropzone] { transition: background .15s, box-shadow .15s; border-radius: 8px; }
[data-dropzone].dropzone-over {
  background: #ecfdf5;
  box-shadow: inset 0 0 0 2px #10b981;
}

/* Вспышка-подсветка строки документа при переходе по скрепке из платежа/расхода */
@keyframes doc-flash { 0%, 100% { background: transparent; } 25% { background: #fde68a; } }  /* amber-300 */
tr.doc-flash > td { animation: doc-flash 0.9s ease-in-out 2; }
.help:hover::after, .help:focus::after, .help.open::after,
.help:hover::before, .help:focus::before, .help.open::before {
  opacity: 1;
  scale: 1;
}

/* JS переносит раскрытую подсказку прямым ребёнком body. Это единый слой для всех
   `.help`: он не обрезается `overflow` широкой таблицы и не остаётся под sticky-th.
   Псевдоэлемент выше — только безопасный fallback до загрузки JS. */
.help-tooltip-ready .help::after,
.help-tooltip-ready .help::before {
  display: none !important;
}
.help-tooltip-portal {
  box-sizing: border-box;
  position: fixed;
  z-index: 1000;
  width: max-content;
  max-width: 320px;
  max-height: calc(100vh - 16px);
  padding: 8px 12px;
  border-radius: 8px;
  background: #1e293b;
  color: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .2);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
  text-align: left;
  white-space: pre-line;
  overflow-y: auto;
  pointer-events: auto;
}
.help-tooltip-portal[hidden] { display: none; }
/* Строка «Подробнее в справке →» у подсказки метрики (макрос `metric_help`): своей строкой
   под текстом, цвет — читаемый на тёмном слое подсказки. */
.help-tooltip-link {
  display: block;
  margin-top: 4px;
  color: #5eead4;
  text-decoration: underline;
}
.help-tooltip-link:hover { color: #99f6e4; }

/* Мобильные: подсказка не должна вылезать за край экрана. Якорим её влево
   от «?» (растёт вправо, к центру) и ограничиваем шириной вьюпорта. Для «?»
   у правого края — tip-left уводит влево. */
@media (max-width: 640px) {
  /* Страница НИКОГДА не скроллится вбок (защита от тултипа/широкого элемента).
     Внутренние контейнеры со своим overflow-x-auto (широкие таблицы) скроллятся
     сами — это правило их не трогает.
     ⚠️ overflow-x:CLIP, а не hidden: hidden создаёт скролл-контейнер на html/body и
     ЛОМАЕТ position:sticky (шапка не фиксируется на телефоне). clip режет горизонталь
     без скролл-контейнера → sticky работает. */
  html, body { overflow-x: clip; max-width: 100%; }
  /* Подсказки «?» на узком экране нельзя позиционировать относительно значка —
     у «?» справа текст вылезает за край. Делаем фикс-баннер внизу во всю ширину:
     всегда полностью читаем, никогда не обрезается. Стрелка не нужна. */
  .help::after, .help.tip-left::after, .help.tip-right::after,
  .help.tip-down::after {
    position: fixed !important;
    left: 8px !important; right: 8px !important;
    bottom: 12px !important; top: auto !important;
    width: auto !important; max-width: none !important;
    transform: none !important;
  }
  .help::before, .help.tip-left::before, .help.tip-right::before,
  .help.tip-down::before { display: none !important; }
  .help-tooltip-portal {
    left: 8px !important;
    right: 8px !important;
    top: auto !important;
    bottom: 12px !important;
    width: auto !important;
    max-width: none;
  }
}

/* ─── Pin column (произвольное закрепление любой колонки) ─────────
   Реализация: на <table data-pinnable="table-id"> JS добавляет
   иконку 📌 в каждый <th>. Клик → колонка становится sticky-left.
   Состояние хранится в localStorage по data-pinnable id.

   Класс .col-pinned ставится JS-ом на <th> и <td> закреплённой колонки. */
.col-pinned {
  position: sticky;
  left: 0;
  background: white;
  z-index: 1;
  box-shadow: 1px 0 0 #e2e8f0;
}
thead .col-pinned { background: var(--ui-surface-muted); z-index: 2; }
tbody tr:hover .col-pinned { background: #f8fafc; }

/* ─── Слайд-тумблер (переиспользуемый): внешний вид взят из «Претензий».
   Поддерживает checkbox внутри обёртки и самостоятельную кнопку с role="switch". ─── */
.switch { position: relative; display: inline-block; box-sizing: border-box; width: 36px; height: 20px; flex: none; padding: 0; border: 0; background: transparent; vertical-align: middle; }
.switch input { position: absolute; inset: 0; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; z-index: 2; }
.switch[role="switch"] { cursor: pointer; }
.switch .track { position: absolute; inset: 0; background: var(--ui-text-soft); border-radius: 9999px; transition: background .18s ease; }
.switch .knob { position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; background: #fff; border-radius: 50%; transition: transform .18s ease; box-shadow: 0 1px 2px rgba(0,0,0,.3), 0 0 1px rgba(0,0,0,.2); }
.switch input:checked + .track,
.switch[aria-checked="true"] .track { background: var(--ui-accent); }
.switch input:checked ~ .knob,
.switch[aria-checked="true"] .knob { transform: translateX(16px); }
/* Компактный вариант (для выбора строк в таблицах) */
.switch-sm { width: 26px; height: 15px; }
.switch-sm .knob { width: 11px; height: 11px; }
.switch-sm input:checked ~ .knob,
.switch-sm[aria-checked="true"] .knob { transform: translateX(11px); }

/* ─── sticky-first: первая колонка (PK/Артикул) всегда залипает слева ─── */
table.sticky-first th:first-child,
table.sticky-first td:first-child {
  position: sticky;
  left: 0;
  background: #fff;
  z-index: 1;
  box-shadow: 1px 0 0 #e2e8f0;
}
table.sticky-first thead th:first-child { background: var(--ui-surface-muted); z-index: 2; }
table.sticky-first tbody tr:hover td:first-child { background: #f8fafc; }
/* ⭐ СТРОКА С ЗАЛИВКОЙ ЗАЛИТА ЦЕЛИКОМ, ВКЛЮЧАЯ ЛИПКУЮ ПЕРВУЮ ЯЧЕЙКУ (владелец 21.09 на
   боевой: «заливки строк магазинов нет»). Липкой ячейке нужен непрозрачный фон — иначе под
   ней просвечивают уехавшие влево числа, — и белый из правила выше перекрывал фон строки.
   На телефоне видна почти одна первая колонка, поэтому `bg-slate-100` строки магазина
   репрайсера (и «Итого канал» над ним) пропадала целиком: заливка была только у чисел.
   ⭐ `inherit` берёт фон СВОЕЙ строки (он непрозрачен) и при наведении тоже: оттенок
   задаёт класс строки в шаблоне, своего цвета здесь нет.
   ⚠️ Вес (0,3,4) равен правилу наведения выше — решает порядок, поэтому стоит после него.
   Страж — `tests/repricer/test_org_groups.py` (правило разобрано по весу и порядку). */
table.sticky-first > tbody > tr.repricer-org > td:first-child,
table.sticky-first > tbody.repricer-total-body > tr.repricer-total > td:first-child { background-color: inherit; }
/* ⭐ ЧЕРЕДОВАНИЕ СТРОК — ЕДВА ЗАМЕТНОЕ (владелец 21.09, репрайсер: «аккуратную и едва
   заметную заливку строк с чередованием»). Включается `data-zebra` на таблице, чётную строку
   отмечает СЕРВЕР классом `row-alt`, а не `:nth-child`: между строками товара стоят скрытые
   строки разбора, и счёт по детям красил бы через раз.
   ⚠️ Вес снижен `:where` — подсветка колонки перекрестия (`.cx-col`) обязана перекрывать
   полосу. Липкой первой ячейке полоса дана вторым селектором: иначе её перекрасит белый
   `sticky-first`. Страж — `tests/repricer/test_org_groups.py`. */
:where(table[data-zebra] > tbody > tr.row-alt) > td,
table.sticky-first[data-zebra] > tbody > tr.row-alt > td:first-child {
  background-color: var(--ui-surface-subtle);
}
/* ⚠️⚠️ ДВУХРЯДНАЯ ШАПКА: липнет только ПЕРВАЯ КОЛОНКА, а не первая ЯЧЕЙКА каждого ряда.
   `th:first-child` во втором ряду — это НЕ «Артикул», а первая подколонка группы («П1»
   у Репрайсера): она приклеивалась к левому краю и наезжала на «Артикул», который стоит
   там же по `rowspan=2` (жалоба владельца 12.08 со скриншотом). Второй и последующие
   ряды шапки от липкости освобождаем целиком — вместе с тенью-разделителем, иначе от
   неё осталась бы вертикальная полоска посреди группы. Правило общее: так же ведут себя
   «Массовая правка товаров», «Сводка поставки» и разбор расчёта закупки. */
table.sticky-first > thead > tr:not(:first-child) > th:first-child {
  position: static;
  box-shadow: none;
  background: transparent;
}

/* Товары: длинные размерные артикулы ковриков не должны растягивать первую
   колонку. Короткие остаются одной строкой, длинные переносятся максимум по
   доступной ширине кода. */
#products-table > :is(thead, tbody) > tr > :first-child {
  width: 195px;
  min-width: 195px;
  max-width: 195px;
}
#products-table .products-sku-link {
  display: inline-block;
  max-width: 150px;
  overflow-wrap: anywhere;
  white-space: normal;
  line-height: 1.15;
  vertical-align: top;
}
@media (max-width: 767px) {
  #products-table > :is(thead, tbody) > tr > :first-child {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
  }
  #products-table .products-sku-link {
    max-width: 110px;
  }
  #products-table > :is(thead, tbody) > tr > :nth-child(3) {
    width: 180px;
    min-width: 180px;
    max-width: 180px;
  }
  #products-table > tbody > tr > :nth-child(3) > a {
    display: block;
    max-width: 168px;
    overflow-wrap: anywhere;
    white-space: normal;
  }
}

/* Кнопка «закрепить колонку» (pinnable-tables.js рисует внутрь SVG-иконку).
   Незакреплённая — бледная и почти незаметная, проявляется при наведении на заголовок;
   закреплённая — синяя и всегда видна (это состояние, а не украшение). */
.pin-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 4px;
  padding: 2px;
  border: none;
  border-radius: 4px;
  background: none;
  color: #94a3b8;
  opacity: 0;
  cursor: pointer;
  vertical-align: middle;
  transition: opacity 0.12s, color 0.12s, background-color 0.12s;
}
.pin-btn svg { display: block; }
th:hover .pin-btn { opacity: 0.55; }          /* проявляем только на нужном заголовке */
.pin-btn:hover { opacity: 1; color: #475569; background: #e2e8f0; }
.pin-btn:focus-visible { opacity: 1; outline: 2px solid var(--ui-accent); outline-offset: 1px; }
.pin-btn.active,
th:hover .pin-btn.active { opacity: 1; color: var(--ui-accent); }
.pin-btn.active:hover { background: var(--ui-accent-soft); }

/* Заголовки пинабельных таблиц — не переносим текст на новую строку,
   чтобы иконка 📌 не оказывалась под заголовком на узких колонках (ABC, XYZ).
   На мобиле эта таблица всё равно превращается в карточки (responsive). */
table[data-pinnable] thead th { white-space: nowrap; }

/* Стрелка серверной сортировки всегда занимает одинаковое место: ▲, ▼ и ⇅
   больше не двигают подпись колонки при переключении состояния. */
.ui-sort-link {
  display: inline-grid;
  grid-template-columns: minmax(0, auto) .75rem;
  align-items: center;
  column-gap: .125rem;
}
.ui-sort-indicator {
  display: inline-flex;
  width: .75rem;
  align-items: center;
  justify-content: center;
}

/* На мобиле таблицы коллапсируются в карточки → пин не нужен */
@media (max-width: 640px) {
  .pin-btn { display: none; }
}

/* ─── Action-icons (Изменить/Отключить/Активировать на иконки) ─── */
.action-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  margin: 0 2px;
  padding: 0;
  border-radius: 6px;
  color: #64748b;
  background: none;
  border: none;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.action-icon:hover { background: #f1f5f9; }
.action-icon.icon-edit:hover    { color: var(--ui-accent); background: var(--ui-accent-soft); }
.action-icon.icon-disable:hover { color: #dc2626; background: #fef2f2; }
.action-icon.icon-enable:hover  { color: #059669; background: #ecfdf5; }
.action-icon.icon-delete:hover  { color: #b91c1c; background: #fef2f2; }
.action-icon svg,
.action-icon .ui-system-icon { width: 16px; height: 16px; flex-basis: 16px; pointer-events: none; }

/* Кликабельные строки (row-click.js) — наведение слегка подсвечивает, курсор-указатель */
[data-href] { cursor: pointer; }
tr[data-href]:hover { background-color: #f8fafc; }   /* slate-50 */
[data-href].card:hover, [data-search-row][data-href]:hover { background-color: #f8fafc; }
/* внутри кликабельной строки текстовые ссылки не подсвечиваем отдельным фоном */
tr[data-href] a:hover { background: transparent; }

/* Data dashboard: all presentation stays in same-origin CSS for strict CSP.
   Заморозку шапки/первой колонки/высоты даёт ЕДИНЫЙ .frozen-pane (см. ниже) — здесь
   только специфика дашборда: липкая панель фильтров + подсветка pivot-ячеек + loading. */
#dash-filter-form { top: var(--nav-h, 0px); }
#dash-table td.dash-pivot-up { background-color: #dcfce7; }
#dash-table td.dash-pivot-down { background-color: #fee2e2; }
.dash-loading { opacity: 0.45; }

/* Пульс → Остатки сводка → Канал: таблица остаётся на всю рабочую ширину,
   но две служебные колонки не забирают пространство у площадок. Через colgroup
   фиксированный алгоритм соблюдает ширины буквально; auto-layout отдавал артикулу
   1410px из 1714px и сжимал остальные колонки до 37–92px. */
@media (min-width: 768px) {
  #dash-table[data-pinnable="pulse-stock_places-channel"] {
    min-width: 1500px;
    table-layout: fixed;
  }
  #dash-table[data-pinnable="pulse-stock_places-channel"] col.dash-stock-article-col,
  #dash-table[data-pinnable="pulse-stock_places-channel"] col.dash-stock-wms-col {
    width: 9%;
  }
  #dash-table[data-stock-channel-cols="1"] col.dash-stock-market-col { width: 82%; }
  #dash-table[data-stock-channel-cols="2"] col.dash-stock-market-col { width: 41%; }
  #dash-table[data-stock-channel-cols="3"] col.dash-stock-market-col { width: 27.3333%; }
  #dash-table[data-stock-channel-cols="4"] col.dash-stock-market-col { width: 20.5%; }
  #dash-table[data-stock-channel-cols="5"] col.dash-stock-market-col { width: 16.4%; }
  #dash-table[data-stock-channel-cols="6"] col.dash-stock-market-col { width: 13.6667%; }
  #dash-table[data-stock-channel-cols="7"] col.dash-stock-market-col { width: 11.7143%; }
  #dash-table[data-stock-channel-cols="8"] col.dash-stock-market-col { width: 10.25%; }
}

/* Category map and packaging inline-save states use classes for strict CSP. */
.category-map-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .45rem 1rem;
}
.category-map-title { grid-column: 1; grid-row: 1; }
.category-map-actions { grid-column: 2; grid-row: 1; }
.category-map-lead { grid-column: 1 / -1; grid-row: 2; }
.category-map-search {
  width: 15rem;
  min-width: 15rem;
  flex: 0 0 15rem;
}
@media (max-width: 767px) {
  .category-map-intro {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    gap: .5rem;
  }
  .category-map-title { grid-column: 1; grid-row: 1; }
  .category-map-lead {
    grid-column: 1;
    grid-row: 1;
    margin-bottom: 0 !important;
  }
  .category-map-actions {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    min-width: 0;
    flex-wrap: nowrap;
    gap: .35rem !important;
  }
  .category-map-actions > form {
    min-width: 0;
    flex: 1 1 0;
  }
  .category-map-actions .ui-action {
    width: 100%;
    min-width: 0;
    padding-right: .35rem;
    padding-left: .35rem;
    font-size: .65rem;
    white-space: nowrap;
  }
  .category-map-stats {
    width: 100%;
    flex-wrap: nowrap;
    gap: .25rem !important;
    overflow-x: auto;
    scrollbar-width: none;
  }
  .category-map-stats::-webkit-scrollbar { display: none; }
  .category-map-stats > span {
    flex: 0 0 auto;
    padding: .25rem .35rem;
    font-size: .6rem;
    line-height: 1.15;
    white-space: nowrap;
  }
  .category-map-section-title {
    font-size: .8125rem;
    line-height: 1.25;
  }
  .category-map-search {
    width: 9rem;
    min-width: 9rem;
    flex-basis: 9rem;
  }
  #art-table > :is(thead, tbody) > tr > :first-child {
    width: 120px;
    min-width: 120px;
    max-width: 120px;
    overflow-wrap: anywhere;
    white-space: normal;
  }
}
.category-map-flash-ok,
.category-map-row-saved {
  background-color: #d1fae5;
  transition: background-color 0.4s;
}
.category-map-flash-error { background-color: #fee2e2; }

/* «Забрать возвраты» — общий каркас колонок на все площадки (задание владельца 31.08).
   ⛔ Ширины классами, а не инлайновым style: инлайн запрещён CSP.
   Все три площадки используют восемь колонок: платное хранение отдельно от
   утилизации. Колонка кнопки «→ в приёмку» снята 19.10 (#1745: вход строки приёмки —
   только скан), её ширина отдана адресу. Старый набор `.rtn-col-*` (без «2») оставлен
   для совместимых таблиц. */
.rtn-col-num  { width: 15%; }
.rtn-col-sku  { width: 12%; }
.rtn-col-qty  { width: 6%;  }
.rtn-col-addr { width: 25%; }
.rtn-col-why  { width: 14%; }
.rtn-col-days { width: 8%;  }
.rtn-col-term { width: 12%; }
.rtn-col-act  { width: 8%;  }
.rtn-col-num2   { width: 10%; }
.rtn-col-sku2   { width: 11%; }
.rtn-col-qty2   { width: 5%;  }
.rtn-col-addr2  { width: 31%; }
.rtn-col-why2   { width: 12%; }
.rtn-col-days2  { width: 9%;  }
.rtn-col-term2  { width: 11%; }
.rtn-col-term2b { width: 11%; }

/* Отчёт по утилизации: фильтры слева, живое хранение справа; ниже 1024px — друг под
   другом. Итоговые карточки уплотнены без фиксированной ширины или высоты. */
.disposal-report-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}
.disposal-report-heading > a { flex: 0 0 auto; }
.disposal-report-heading > p { flex: 1 1 auto; }
.disposal-toolbar {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  margin-bottom: 12px;
}
.disposal-filter-card { margin-bottom: 0; }
.disposal-date-field {
  display: block;
}
.disposal-date-label {
  display: block;
  margin-bottom: 4px;
  line-height: 1;
}
.disposal-date-label-mobile { display: none; }
.disposal-filter-actions {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  align-self: flex-end;
  gap: 6px;
}
.disposal-live-storage {
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.disposal-summary-grid {
  gap: 6px;
  margin-bottom: 12px;
}
.disposal-summary-card { padding: 8px; }
.disposal-summary-value {
  font-size: 18px;
  line-height: 24px;
}
.disposal-summary-meta {
  font-size: 11px;
  line-height: 14px;
}
.disposal-summary-total-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  column-gap: 8px;
}
.disposal-summary-total-title { grid-area: 1 / 1; }
.disposal-summary-total-card > .disposal-summary-value { grid-area: 2 / 1; }
.disposal-summary-total-meta { grid-area: 3 / 1; }
.disposal-summary-breakdown {
  grid-area: 1 / 2 / 4 / 3;
  align-self: start;
  text-align: right;
  font-size: 11px;
  line-height: 14px;
  white-space: nowrap;
}
@media (min-width: 768px) {
  .disposal-return-code-col {
    width: 112px;
    max-width: 112px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
@media (max-width: 1023px) {
  .disposal-toolbar { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
  .disposal-date-label-desktop { display: none; }
  .disposal-date-label-mobile { display: inline; }
  .disposal-report-heading {
    margin-bottom: 8px;
  }
  .disposal-report-description {
    display: none;
  }
  .disposal-toolbar {
    gap: 8px;
    margin-bottom: 8px;
  }
  .disposal-filter-card {
    gap: 8px;
    padding: 8px;
  }
  .disposal-date-field {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 4px;
    width: auto;
  }
  .disposal-date-label {
    display: inline;
    margin-bottom: 0;
  }
  .disposal-live-storage {
    gap: 2px;
    padding: 8px !important;
    font-size: 12px;
    line-height: 16px;
  }
  .disposal-live-storage-title {
    align-items: flex-start;
    font-size: 12px;
    line-height: 16px;
  }
  .disposal-live-storage-note,
  .disposal-live-storage-detail {
    font-size: 11px;
    line-height: 14px;
  }
  .disposal-live-storage-detail {
    margin-top: 0;
  }
  .disposal-data-table-wrap {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }
  .disposal-data-table {
    width: 1320px;
    min-width: 1320px;
    table-layout: auto;
  }
}

/* Приёмка возврата: компактные desktop-ширины владельца 03.09;
   на узком экране остаются две гибкие колонки. */
.returns-receive-filters {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.returns-receive-scan {
  grid-column: 1 / -1;
}
.returns-receive-action-outline {
  box-shadow: inset 0 0 0 1px var(--ui-accent-line);
}
/* Плашка шага (#1791, живой рендер 26.10): `flex-1` (база 0) не давал ей уйти на свою
   строку — на телефоне она сжималась до 33px, и текст наезжал на кнопки. База 16rem: на
   компьютере плашка и кнопки в одну строку, на телефоне кнопки переносятся под плашку. */
.returns-receive-open-step { flex: 1 1 16rem; }
/* «Нет ШК» включён — поле сканера в режиме артикула (#1791); состояние несёт aria-pressed. */
.returns-receive-action-outline[aria-pressed="true"] {
  background: #eff6ff;
  box-shadow: inset 0 0 0 2px var(--ui-accent-line);
}
.returns-section-heading { align-items: center; }
.returns-mobile-risk-badge {
  flex: 0 0 auto;
  padding: 2px 8px;
  font-size: 10px;
  line-height: 16px;
}
.returns-mobile-risk-badge .ui-icon { width: 12px; height: 12px; }
.returns-risk-summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}
@media (max-width: 767px) {
  /* ⭐ Одна копия плашек и ссылки (#1791): на телефоне заголовки блоков прячутся, а у
     блока «Забрать» остаётся его пара действий — ссылка строкой, плашки строкой под ней. */
  #returns-list .returns-section-heading:not(.returns-section-heading--pickup) {
    display: none !important;
  }
  #returns-list .returns-section-heading--pickup { padding-bottom: 0; }
  #returns-list .returns-section-heading--pickup > h2,
  #returns-list .returns-mobile-hidden {
    display: none !important;
  }
  #returns-list .returns-pickup-heading-actions {
    width: 100%;
    margin-left: 0;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  #returns-list .returns-disposal-link { order: -1; }
  #returns-list .returns-risk-summary {
    display: flex;
    flex-wrap: nowrap;
    max-width: 100%;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
  }
  #returns-list .returns-risk-summary::-webkit-scrollbar { display: none; }
  #returns-list .returns-mobile-risk-badge {
    padding: 2px 6px;
    font-size: 10px;
    line-height: 1.2;
  }
}
/* Таблица строк приёмки выходит из внутреннего padding карточки ровно на 16px
   с каждой стороны; у реестра документов снимаем пустой правый scrollbar-gutter. */
.returns-receive-lines-wrap {
  width: calc(100% + 32px);
  max-width: none;
  margin-left: -16px;
  margin-right: -16px;
}
.returns-documents-table-wrap.frozen-pane {
  scrollbar-gutter: auto;
}
.returns-document-row--closed { background-color: rgb(226 232 240 / 25%); }
/* Возвраты: единая плотность всех таблиц на телефоне и desktop. Обычная однострочная
   ячейка получается высотой около 24px; строки с кнопкой, полем или подписью растут по
   содержимому, поэтому рабочие элементы не теряют свою удобную высоту. */
#returns-list table.returns-compact-table > thead > tr > th,
#returns-list table.returns-compact-table > tbody > tr > td {
  padding-top: 3px;
  padding-bottom: 3px;
  line-height: 18px;
}
/* Раскрытая таблица площадки плотнее общего реестра: однострочная шапка не
   раздувается узким «Кол-во», а адрес Ozon занимает 31px вместо почти 60px. */
#returns-list .returns-pickup-data-table > thead > tr > th {
  padding-top: 2px;
  padding-bottom: 2px;
  line-height: 14px;
  vertical-align: middle;
  white-space: nowrap;
}
#returns-list .returns-pickup-data-table > tbody > tr:not(.returns-pickup-group-row) > td {
  padding-top: 2px;
  padding-bottom: 2px;
  line-height: 16px;
  vertical-align: middle;
}
#returns-list .returns-pickup-data-table td[data-label="Адрес — где забрать"] > span.block:first-child {
  line-height: 16px;
}
#returns-list .returns-pickup-data-table td[data-label="Адрес — где забрать"] > span.block + span.block {
  line-height: 11px;
}
@media (min-width: 1024px) {
  .returns-receive-filters {
    /* Источник · Площадка · Организация · Склад · сканер (#1791): «Яндекс Маркет» — самое
       длинное имя площадки, ему 140px. */
    grid-template-columns: 170px 140px 130px 130px minmax(0, 1fr);
    align-items: start;
  }
  .returns-receive-scan {
    grid-column: auto;
  }
}

/* «Забрать возвраты»: внешний блок прозрачен. Три белые карточки площадок
   остаются первым рядом и при раскрытии; таблица выбранной площадки появляется
   отдельным полным рядом под ними. */
.returns-pickup-shell {
  background: transparent;
  border: 2px solid #fcd34d;
}
.returns-pickup-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 16px;
  row-gap: 0;
  align-items: stretch;
}
.returns-pickup-transit-summary { gap: 4px 16px; }
.returns-pickup-transit-summary > span { white-space: nowrap; }
.returns-pickup-transit-summary,
.returns-pickup-transit-summary > span {
  color: #aab4c2;
}
.returns-pickup-help { flex: 0 0 auto; }

/* ⭐⭐ ПРОСРОЧЕННЫЙ ВОЗВРАТ — ЗАМЕТНЫЙ, НО НЕ АВАРИЙНЫЙ (09.09). Товар ещё можно забрать,
   поэтому это предупреждение, а не отказ: тот же rose-регистр, что «не сдано» у FBS —
   светлый фон, тёмный текст, компактная высота. Красным заливать нельзя, иначе строка
   кричит громче, чем настоящая потеря товара. */
.returns-stuck-flag {
  height: 22px;
  padding: 2px 8px;
  border: 1px solid #fecdd3;
  border-radius: 6px;
  background: #fff1f2;
  color: #9f1239;
  font-size: 11px;
  font-weight: 600;
  line-height: 16px;
  white-space: nowrap;
}
.returns-stuck-flag .ui-system-icon { width: 12px; height: 12px; }

/* Строка просроченного возврата внутри таблицы: фон + левая метка. Значения не
   затемняем — по ним сборщик опознаёт возврат.
   ⚠️ Цвет проверен ГЛАЗАМИ на живой странице: первая редакция `#fff5f6` на белой таблице
   была практически неразличима, то есть главный сигнал раздела не работал. Взят более
   заметный `#ffe4e6` (rose-100) плюс полоса слева — она читается даже боковым зрением
   при быстром просмотре списка. */
.returns-row-stuck { background: #ffe4e6; }

/* ⭐⭐ «Приняли ДД.ММ» — пометка под кодом выдачи (599). Товар у нас, а площадка держит
   возврат готовым: это не тревога и не успех, а РАСХОЖДЕНИЕ, с которым идут в поддержку
   площадки. Поэтому спокойный сине-серый (тот же slate, что у служебных подписей), а не
   зелёный «всё хорошо» и не красный «беда» — оба соврали бы о смысле. */
.returns-taken-flag {
  display: block;
  margin-top: 2px;
  font-size: 10px;
  line-height: 14px;
  font-weight: 500;
  color: #475569;
  white-space: nowrap;
  cursor: help;
}
.returns-taken-flag::before { content: "✓ "; color: #64748b; }
.returns-row-stuck > td:first-child { box-shadow: inset 3px 0 0 #e11d48; }

.returns-pickup-card {
  min-width: 0;
  min-height: 52px;
  box-sizing: border-box;
  overflow: hidden;
  position: relative;
  cursor: pointer;
  background: var(--ui-surface);
  border: 1px solid var(--ui-border-strong);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(15, 23, 42, .05);
}
.returns-pickup-card[open] {
  overflow: visible;
  z-index: 1;
  background: var(--ui-accent-soft);
  border: 1px solid var(--ui-accent);
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  box-shadow: none;
}
.returns-pickup-card[open] > .returns-pickup-card-summary {
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
  border-radius: 7px 7px 0 0;
}
.returns-pickup-card[open] > .returns-pickup-card-summary .returns-pickup-count {
  color: var(--ui-accent-hover) !important;
}
.returns-pickup-card[open] > .returns-pickup-card-summary .help {
  background: var(--ui-accent-line);
  color: var(--ui-accent-hover);
}
.returns-pickup-grid > .returns-pickup-table::before {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0 0 auto;
  height: 1px;
  background: var(--ui-accent);
  pointer-events: none;
}
.returns-pickup-grid:has(> [data-fold="wb-pickup"][open]) > .returns-pickup-table:not([hidden])::before {
  background: linear-gradient(to right,
    transparent 0 calc(33.333333% - 11.666667px),
    var(--ui-accent) calc(33.333333% - 11.666667px) 100%);
}
.returns-pickup-grid:has(> [data-fold="ozon-pickup"][open]) > .returns-pickup-table:not([hidden])::before {
  background: linear-gradient(to right,
    var(--ui-accent) 0 calc(33.333333% + 6.333333px),
    transparent calc(33.333333% + 6.333333px) calc(66.666667% - 6.333333px),
    var(--ui-accent) calc(66.666667% - 6.333333px) 100%);
}
.returns-pickup-grid:has(> [data-fold="ym-pickup"][open]) > .returns-pickup-table:not([hidden])::before {
  background: linear-gradient(to right,
    var(--ui-accent) 0 calc(66.666667% + 11.666667px),
    transparent calc(66.666667% + 11.666667px) 100%);
}
.returns-pickup-grid > .returns-pickup-table {
  grid-column: 1 / -1;
  width: 100%;
  position: relative;
  overflow: hidden;
  margin-top: 0;
  border: 1px solid var(--ui-accent);
  border-top: 0;
  border-radius: 0 0 8px 8px;
}
@media (max-width: 1023px) {
  .returns-pickup-grid { grid-template-columns: minmax(0, 1fr); }
  .returns-pickup-card[open] {
    border-bottom: 1px solid var(--ui-accent);
    border-radius: 8px;
  }
  .returns-pickup-card[open] > .returns-pickup-card-summary { border-radius: 7px; }
  .returns-pickup-grid > .returns-pickup-table {
    border-top: 1px solid var(--ui-accent);
    border-radius: 8px;
  }
  .returns-pickup-grid > .returns-pickup-table::before { content: none; }
}
@media (max-width: 640px) {
  #returns-list .returns-pickup-grid {
    row-gap: 8px;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  .returns-pickup-grid > .returns-pickup-table {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }
  #returns-list .returns-pickup-card[open] {
    border-bottom: 0;
    border-radius: 8px 8px 0 0;
  }
  #returns-list .returns-pickup-card[open] > .returns-pickup-card-summary {
    border-radius: 7px 7px 0 0;
  }
  #returns-list .returns-pickup-grid > .returns-pickup-table:not([hidden]) {
    margin-top: -8px;
    border-top: 0;
    border-radius: 0 0 8px 8px;
  }
  .returns-pickup-data-table {
    width: 1008px;
    min-width: 1008px;
    table-layout: fixed;
  }
  .returns-pickup-data-table .rtn-col-num2 { width: 144px; }
  .returns-pickup-data-table .rtn-col-sku2 { width: 112px; }
  .returns-pickup-data-table .rtn-col-qty2 { width: 52px; }
  .returns-pickup-data-table .rtn-col-addr2 { width: 238px; }
  .returns-pickup-data-table .rtn-col-why2 { width: 108px; }
  .returns-pickup-data-table .rtn-col-days2 { width: 92px; }
  .returns-pickup-data-table .rtn-col-term2 { width: 126px; }
  .returns-pickup-data-table .rtn-col-term2b { width: 136px; }
  .returns-pickup-data-table td { overflow: hidden; }
  .returns-pickup-data-table td:is([data-label="Пришёл"], [data-label="Бесплатно до"], [data-label="Утилизация"]) {
    white-space: nowrap;
  }
  /* ⭐ WB после срока (11.10, #1219): подпись «срок вышел N дн назад» шире колонки, а
     ячейка режет лишнее (`overflow: hidden` выше) — в одну строку хвост пропадал. Перенос
     разрешён; рвётся только между двумя частями — внутри них пробелы неразрывные. */
  .returns-pickup-data-table td[data-label="Утилизация"][data-overdue] { white-space: normal; }
  /* «платно с 27.10 ≈ 40 ₽» (#1791) — тот же приём: перенос только между датой и суммой. */
  .returns-pickup-data-table td[data-label="Бесплатно до"][data-paid] { white-space: normal; }
  .returns-pickup-data-table td > :is(span, a) { max-width: 100%; }
  .returns-pickup-data-table td[data-label="Адрес — где забрать"] > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #returns-list table.returns-receive-lines-table.responsive.responsive-compact > tbody > tr {
    padding: 4px 8px;
    margin-bottom: 4px;
    border-radius: 8px;
  }
  #returns-list table.returns-receive-lines-table.responsive.responsive-compact td {
    padding: 1px 0;
  }
  #returns-list table.returns-receive-lines-table.responsive.responsive-compact td[data-label="Категория"] {
    display: none !important;
  }
  #returns-list table.returns-receive-lines-table.responsive.responsive-compact td:last-child {
    padding-top: 2px;
    margin-top: 1px;
  }
  #returns-list #r-sugg {
    max-height: 160px;
    border-radius: 6px;
    font-size: 12px;
    line-height: 16px;
  }
  #returns-list #r-sugg > div {
    overflow: hidden;
    padding: 4px 8px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}
input.no-spin::-webkit-inner-spin-button,
input.no-spin::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input.no-spin[type="number"] { -moz-appearance: textfield; }

/* Кнопки «Собрать из места»/«отменить»: на телефоне — во всю ширину (крупная цель
   для пальца, w-full в шаблоне), на ПК — компактно у правого края строки места
   (правка владельца 31.07, скрин «кнопки для пк аккуратно справа»). base.css
   грузится ПОСЛЕ app.css, поэтому перекрывает w-full без !important. */
@media (min-width: 768px) {
  .pick-place-btn { width: auto; margin-left: auto; flex: 0 0 auto; }
  /* ⚠️ Пара «Собрать + камера» на ПК не растягивается: обёртка получила w-full ради
     телефона, и без этого кнопка тянулась во всю строку («опять гигантские кнопки»,
     владелец 01.08). На телефоне полная ширина остаётся — это крупная цель для пальца. */
  .pick-actions { width: auto; margin-left: auto; }
  /* ⭐ Камера — ТОЛЬКО на мобильных (решение владельца 01.08): на ПК нечем сканировать,
     и кнопка лишь занимает место. Скрываем показ, а не право: гейт остаётся серверный. */
  .scan-check-btn { display: none !important; }
}

/* Скрытый вид сборки. Отдельный класс с !important одинаково переключает табличный
   «По-артикульно» и загружаемый «По упаковке» без инлайнового style, запрещённого CSP. */
.pick-off { display: none !important; }

/* FBM: короткая инструкция продолжает переключатель справа двумя строками.
   На телефоне оставляем только сам переключатель: порядок набора уже выражен
   названиями видов, а две строки пояснения отнимают высоту рабочей карточки. */
.pick-view-switch__guidance {
  display: flex;
  flex: 1 1 34rem;
  min-width: 18rem;
  flex-direction: column;
  gap: .08rem;
  margin-left: .45rem;
  color: #94a3b8;
  font-size: .68rem;
  font-weight: 400;
  line-height: 1.25;
}
.pick-view-switch__guidance > :first-child {
  color: #7f8fa6;
}
.pick-view-switch__layout-editor {
  flex: 0 0 auto;
  min-width: 0;
  margin-left: auto;
}
.pick-view-switch__layout-editor:empty {
  display: none;
}
.pick-view-switch__layout-editor > .box-layout-editor:not([open]) {
  margin-bottom: 0 !important;
}
.pick-view-switch__layout-editor > .box-layout-editor[open] {
  margin-bottom: 0 !important;
}
.pick-view-switch__layout-editor:has(> .box-layout-editor[open]) {
  flex: 1 0 100%;
  margin-left: 0;
}
@media (max-width: 640px) {
  .pick-view-switch__guidance {
    display: none;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden) [data-ozon-slot]:empty {
    display: none;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden) > td:has(> .pick-view-switch) {
    padding-top: 4px !important;
  }
}

/* Печать: скрываем интерактив/навигацию, оставляем документ (упаковочный лист и т.п.) */
@media print {
  .no-print { display: none !important; }
  /* убираем шапку приложения, меню и подвал — печатаем только документ */
  body > header, body > nav, header, nav, footer, .site-nav { display: none !important; }
  body { background: #fff !important; }
  main { padding: 0 !important; }
  /* документ во всю ширину, без теней/рамок-обрезки */
  main > div { max-width: 100% !important; }
  .print\:break-inside-avoid, table, tr, td, th { break-inside: avoid; }
  * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ─── Замороженные панели (frozen panes), десктоп ───────────────────────────
   Большая таблица прокручивается ВНУТРИ контейнера `.frozen-pane`; шапка колонок
   (thead) липнет к верху контейнера, первая колонка — слева (со `sticky-first`).
   Высоту контейнера (остаток вьюпорта) ставит JS `MoxarInitFrozenPanes` (base.html).
   На мобиле НЕ применяем: там таблицы превращаются в карточки (`data-responsive`). */
@media (min-width: 768px) {
  /* ⚠️ Полоса прокрутки НЕ должна закрывать данные (поймано владельцем на
     «Пульс → Остатки сводка»: колонка последнего склада уходила под ползунок).

     На macOS (Safari/Chrome/Arc) полосы по умолчанию ОВЕРЛЕЙНЫЕ — рисуются ПОВЕРХ
     содержимого и занимают 0px, поэтому правый столбец физически оказывается под ними.
     `scrollbar-gutter: stable` тут НЕ помогает: по спецификации он не влияет на
     оверлейные полосы (проверено замером — контейнер отъедал 0px даже со stable).

     Лечение: задать полосе явную ширину через ::-webkit-scrollbar — в WebKit/Blink это
     переключает её из оверлейной в ОБЫЧНУЮ, занимающую место, и содержимое под неё уже
     не попадает. `scrollbar-gutter: stable` оставляем для платформ с классическими
     полосами (Windows/Linux) и для Firefox — там он резервирует место заранее, чтобы
     таблицу не «дёргало» при появлении полосы.
     Правка в общем .frozen-pane → чинится сразу на всех больших таблицах системы. */
  .frozen-pane { overflow: auto; scrollbar-gutter: stable; }
  /* ТОЛЬКО прямая таблица контейнера (не вложенные таблицы раскрытых строк — их шапку
     замораживать нельзя): thead > tr > th этой таблицы липнут к верху. */
  .frozen-pane > table > thead th {
    position: -webkit-sticky; position: sticky; top: 0; z-index: 3;
    background: var(--ui-surface-muted);
  }
  /* Общая шапка списка сохраняет системный цвет и в sticky-режиме. Иначе старый
     фон frozen-pane перекрашивал FBM/FF обратно в slate-50. */
  .frozen-pane > table > thead.ui-table-head th {
    background: var(--ui-surface-muted);
  }
  /* угол (верх+лево) поверх всех, если у таблицы включена липкая первая колонка */
  .frozen-pane > table.sticky-first > thead th:first-child { z-index: 4; }
  /* Закреплённая кнопкой колонка (pinnable-tables.js) в шапке должна быть ВЫШЕ обычных
     заголовков: у них здесь z-index 3, и при равенстве побеждал бы тот, что правее в
     разметке — уезжающий заголовок наезжал бы на закреплённый. */
  .frozen-pane > table > thead th.col-pinned { z-index: 5; }
  /* ⚠️ Здесь ЖИЛИ правила «второй ряд шапки Репрайсера липнет под первым»
     (`#repricer-table`, 15.07). Они мертвы дважды и потому убраны: таблицу
     разнесли по каналам (id стал `repricer-table-1`, `-2`, … — по старому id
     не совпадает ни одна), а сам `frozen-pane` с дашборда снят осознанно 31.07
     («страница не до низа» внутри `<details>`). Мёртвое правило хуже
     отсутствующего: оно выглядит рабочим при разборе. Если липкую шапку туда
     когда-нибудь вернут, высоту первого ряда надо МЕРИТЬ (как это делает
     `frozen-panes.js` для высоты панели), а не зашивать константой. */
}
/* ─── Подсветка «перекрестием» (table-crosshair.js) ─────────────────────────
   Наводишь на ячейку — подсвечиваются её СТРОКА и её КОЛОНКА. В «Пульсе» два
   десятка колонок-складов: без ориентира легко прочитать чужую цифру.
   Цвета намеренно бледные: подсветка помогает вести глаз, а не перебивает данные.
   Пересечение (сама ячейка под курсором) чуть темнее — видно точку отсчёта.
   ⚠️ Фон задаётся и липким ячейкам тоже: у .frozen-pane шапка и первая колонка
   имеют СВОЙ фон, и без этого правила перекрестие под ними «пропадало». */
/* ⚠️ ВТОРОЙ СЕЛЕКТОР КАЖДОГО ПРАВИЛА — ЛИПКАЯ ПЕРВАЯ КОЛОНКА `sticky-first` (репрайсер,
   21.09): её белый фон и фон наведения весят (0,2,2)/(0,3,4) и перебивали перекрестие —
   строка подсвечивалась без имени товара. Цвет тот же, объявлен один раз. */
table[data-crosshair] tbody tr.cx-row > td,
table.sticky-first[data-crosshair] > tbody > tr.cx-row > td:first-child { background-color: var(--table-crosshair-soft, #f1f5f9); }
table[data-crosshair] .cx-col,
table.sticky-first[data-crosshair] > tbody > tr > td.cx-col:first-child { background-color: var(--table-crosshair-soft, #f1f5f9); }
table[data-crosshair] thead th.cx-col,
table.sticky-first[data-crosshair][data-sticky-thead] > thead > tr > th.cx-col:first-child { background-color: var(--table-crosshair-head, #e2e8f0); }
table[data-crosshair] tbody tr.cx-row > td.cx-col,
table.sticky-first[data-crosshair] > tbody > tr.cx-row > td.cx-col:first-child { background-color: var(--table-crosshair-focus, var(--ui-accent-soft)); }

/* Репрайсер: спокойная фиолетовая палитра перекрестия поверх плотной числовой сетки. */
.repricer-head-wrap {
  --table-crosshair-soft: #f5f3ff;
  --table-crosshair-head: #ede9fe;
  --table-crosshair-focus: #ddd6fe;
}
.repricer-head-wrap.repricer-head-wb {
  --repricer-head-bg: #faf7ff;
  --repricer-head-border: #e4d8f1;
}
.repricer-head-wrap.repricer-head-ozon {
  --repricer-head-bg: #f4f8ff;
  --repricer-head-border: #cbdcff;
}
.repricer-head-wrap.repricer-head-ym {
  --repricer-head-bg: #fffbeb;
  --repricer-head-border: #f0dfa0;
}
.repricer-head-wrap.repricer-head-mvideo {
  --repricer-head-bg: #fff7f7;
  --repricer-head-border: #efcaca;
}

/* ─── Полоса прокрутки больших таблиц: НЕ должна закрывать данные ───────────
   На macOS (Safari/Chrome/Arc) полосы по умолчанию ОВЕРЛЕЙНЫЕ: занимают 0px и
   рисуются ПОВЕРХ содержимого — правая колонка уезжает под ползунок (поймано
   владельцем на «Пульс → Остатки сводка»). `scrollbar-gutter: stable` тут НЕ
   помогает: по спецификации он не влияет на оверлейные полосы (замерено — контейнер
   отъедал 0px даже со stable).
   Лечение: задать явную ширину через ::-webkit-scrollbar — в WebKit/Blink это
   переключает полосу из оверлейной в ОБЫЧНУЮ, занимающую место (замерено: 0px → 12px).
   ⚠️ ВНЕ @media: внутри медиа-запроса правило не применялось (проверено — идентичное
   правило инлайном работало, из медиа-блока нет). Мобиле не мешает: там большие
   таблицы превращаются в карточки и своей прокрутки не имеют. */
/* ⭐ `.tidy-scroll` — тот же приём для ОБЫЧНОЙ горизонтальной прокрутки без заморозки
   панелей (владелец 09.08: «прокрутка закрывает долю в процентах» — оверлейная полоса
   легла на вторую строку ячейки ИТОГО в составе партии, где стоят проценты).
   ⚠️ Правило ОБЩЕЕ с `.frozen-pane`: второй механизм разъехался бы с первым, а лечение
   здесь неочевидное и выстрадано замерами (см. комментарий выше). */
.tidy-scroll { overflow-x: auto; scrollbar-gutter: stable; }
.frozen-pane::-webkit-scrollbar,
.tidy-scroll::-webkit-scrollbar { width: 12px; height: 12px; }
.frozen-pane::-webkit-scrollbar-track,
.tidy-scroll::-webkit-scrollbar-track { background: #f1f5f9; }
.frozen-pane::-webkit-scrollbar-thumb,
.tidy-scroll::-webkit-scrollbar-thumb {
  background: #cbd5e1; border-radius: 8px; border: 3px solid #f1f5f9;
}
.frozen-pane::-webkit-scrollbar-thumb:hover,
.tidy-scroll::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
.frozen-pane::-webkit-scrollbar-corner,
.tidy-scroll::-webkit-scrollbar-corner { background: #f1f5f9; }
/* ⚠️ НЕ добавлять сюда `scrollbar-width`/`scrollbar-color`: в Chromium стандартное
   `scrollbar-width` ОТКЛЮЧАЕТ стилизацию ::-webkit-scrollbar целиком, и полоса
   возвращается в оверлейный режим. Замерено: только webkit → 12px; webkit+scrollbar-width
   → 0px. Firefox в этом и не нуждается — там полосы и так классические, место занимают. */

/* ⭐ Панель выбранных мест карты склада (`#wms-bulk-bar`): этикетки, тип места, удаление.
   С третьим действием — «Назначить тип» (мигр.867, #1466) — она шире прежнего.
   ⚠️ Прежнее `left: 50%` + сдвиг назад оставляло плавающему блоку только ПОЛОВИНУ экрана,
   и панель переносилась в две строки уже на настольной ширине. Прижимаем к обоим краям
   и центрируем отступами: ширина — по содержимому, но не шире экрана.
   ⚠️ Телефон: нижнее меню занимает 4rem плюс вырез экрана (`body.has-mobile-bottom-nav`
   выше) — панель стоит НАД ним, иначе её нижние кнопки уходили бы под меню. Условия
   перехода — те же, что у самого меню. */
.wms-bulk-bar {
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  width: fit-content;
  max-width: calc(100vw - 2rem);
  margin-inline: auto;
}
@media (max-width: 767px),
       (orientation: landscape) and (max-width: 1366px) and (hover: none),
       (orientation: landscape) and (max-width: 1366px) and (any-pointer: coarse) {
  body.has-mobile-bottom-nav .wms-bulk-bar {
    bottom: calc(4.75rem + env(safe-area-inset-bottom));
  }
}

/* Warehouse location tree indentation without CSP-blocked inline styles. */
.wms-tree-summary-depth-0 { padding-left: 12px; padding-right: 16px; }
.wms-tree-summary-depth-1 { padding-left: 36px; padding-right: 16px; }
.wms-tree-summary-depth-2 { padding-left: 60px; padding-right: 16px; }
.wms-tree-summary-depth-3 { padding-left: 84px; padding-right: 16px; }
.wms-tree-summary-depth-4 { padding-left: 108px; padding-right: 16px; }
.wms-tree-summary-depth-5 { padding-left: 132px; padding-right: 16px; }
.wms-tree-summary-depth-6 { padding-left: 156px; padding-right: 16px; }
.wms-tree-summary-depth-7 { padding-left: 180px; padding-right: 16px; }
.wms-tree-summary-depth-8 { padding-left: 204px; padding-right: 16px; }
.wms-tree-summary-depth-9 { padding-left: 228px; padding-right: 16px; }
.wms-tree-children-depth-0 { padding-left: 36px; padding-right: 16px; }
.wms-tree-children-depth-1 { padding-left: 60px; padding-right: 16px; }
.wms-tree-children-depth-2 { padding-left: 84px; padding-right: 16px; }
.wms-tree-children-depth-3 { padding-left: 108px; padding-right: 16px; }
.wms-tree-children-depth-4 { padding-left: 132px; padding-right: 16px; }
.wms-tree-children-depth-5 { padding-left: 156px; padding-right: 16px; }
.wms-tree-children-depth-6 { padding-left: 180px; padding-right: 16px; }
.wms-tree-children-depth-7 { padding-left: 204px; padding-right: 16px; }
.wms-tree-children-depth-8 { padding-left: 228px; padding-right: 16px; }
.wms-tree-children-depth-9 { padding-left: 252px; padding-right: 16px; }

dialog.mx-store-modal { border: none; max-height: 90vh; overflow: auto; }
dialog.mx-store-modal[open] { animation: mxModalIn .18s ease-out; }
dialog.mx-store-modal[open]::backdrop { animation: mxFadeIn .18s ease-out; }
@keyframes mxModalIn {
  from { opacity: 0; transform: translateY(8px) scale(.98); }
  to { opacity: 1; transform: none; }
}
@keyframes mxFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.calc-toast-leaving { opacity: 0; transition: opacity .4s; }
.csp-table-fixed { table-layout: fixed; }
.csp-min-w-1100 { min-width: 1100px; }
.csp-w-110 { width: 110px; }
.csp-w-140 { width: 140px; }
.csp-w-150 { width: 150px; }
.csp-w-180 { width: 180px; }
.csp-w-200 { width: 200px; }
.csp-w-220 { width: 220px; }
/* Шапка карточки партии: слева документ/поставщик, справа две колонки — ОВХ и этап.
   ⚠️ Две колонки по 210px + отступы + padding ≈ 476px, поэтому на телефоне (375px)
   они не помещались, а первая колонка (1fr) схлопывалась почти в ноль: имя поставщика
   переносилось по одному слову, числа налезали друг на друга. Колонки фиксируем только
   когда для них есть место; ниже 768 — складываем в одну колонку.
   Порог 768 — уже принятый в этом файле для «широких» раскладок: на нём же переключаются
   .frozen-pane, навигация и #ship-list. ⚠️ НЕ путать с 640: там живёт карточный режим
   таблиц (table.responsive) и защита страницы от горизонтальной прокрутки — это другой
   порог и другая задача. */
@media (min-width: 768px) {
  .party-row-summary { grid-template-columns: minmax(0, 1fr) 210px 210px; }
}
@media (max-width: 767px) {
  /* одна колонка: блоки идут друг под другом на всю ширину и переносятся нормально */
  .party-row-summary { grid-template-columns: minmax(0, 1fr); }
  /* правый блок ОВХ на мобиле — не «колонка справа», а строка под шапкой:
     вертикальная линейка-разделитель и левый отступ здесь только мешают */
  .party-row-summary > div:nth-child(2) { border-left: 0; padding-left: 0; }
  /* этап + «Быстрый просмотр» — прижимаем влево, как остальной текст карточки */
  .party-row-summary > div:last-child { justify-content: flex-start; }
}
.csp-min-w-900 { min-width: 900px; }
/* колонка «Фазы года» в справочнике сезонности: график должен быть читаемым, но не
   расталкивать 12 колонок месяцев */
.csp-w-260 { width: 260px; min-width: 260px; }
/* График фаз сезона (макрос season_chart): размеры задаются атрибутами SVG — инлайн-стили
   запрещены CSP, — а шрифт подписей наследуем страницей.
   ⚠️ Пропорции держим честными (без preserveAspectRatio="none"): неравномерное растяжение
   плющило и кривую, и буквы — правка владельца 10.08 «он не должен быть приплющенным».
   Строка графика в справочнике сезонности не должна ловить наведение как обычная строка. */
.season-chart { display: block; width: 100%; }
.season-chart text { font-family: inherit; }
/* Блок категории = строка коэффициентов + строка графика. Между блоками — полоса фона,
   иначе кривые соседних категорий сливаются в одну простыню (правка владельца 10.08). */
.season-row td { border-top: 0; padding-bottom: 6px; }
.season-row + tr td { border-top: 10px solid #eef2f7; }
.csp-min-w-1500 { min-width: 1500px; }
.csp-min-w-1040 { min-width: 1040px; }
.csp-min-w-1160 { min-width: 1160px; }
.csp-min-w-1420 { min-width: 1420px; }
tr.pty-row-sel > td { background-color: var(--ui-accent-soft); }
.csp-w-10p { width: 10%; }
.csp-w-12p { width: 12%; }
.csp-w-15p { width: 15%; }
.csp-w-18p { width: 18%; }
.csp-w-20p { width: 20%; }
.csp-w-25p { width: 25%; }
.csp-w-28p { width: 28%; }
.csp-w-32p { width: 32%; }
.csp-w-40p { width: 40%; }
/* ⭐⭐ Липкая полоса «Создать партии» калькулятора закупки — НЕПРОЗРАЧНАЯ и шириной
   таблицы (владелец 28.09, «едет вёрстка»): под ней прокручиваются строки, и прозрачные
   края / скруглённые углы панели показывали их слева и справа, над закреплённой шапкой.
   Фон — тот же, что у страницы (`bg-slate-50` на body), поэтому полоса не видна как
   отдельный блок. Разбор — комментарий у `#calc-panel` в `purchases/calculator.html`.
   ⚠️ z-index 20 обязан быть ВЫШЕ сдвинутой шапки таблицы (`table[data-sticky-thead] > thead`,
   5): шапку двигает `sticky-thead.js`, и в его запасном пути (браузер без анимации от
   прокрутки) отставшая на кадр шапка уходит ПОД непрозрачную полосу, а не рисуется поверх
   неё (запись владельца 29.09). */
.calc-toolbar { position: sticky; top: var(--nav-h, 56px); z-index: 20; background-color: #f8fafc; }
.calc-trace-panel { width: calc(100vw - 3rem); max-width: calc(100vw - 3rem); }
.calc-trace-scroll { max-height: calc(100vh - 170px); }
.location-tree-depth-1 { margin-left: 12px; }
.location-tree-depth-2 { margin-left: 24px; }
.location-tree-depth-3 { margin-left: 36px; }
.location-tree-depth-4 { margin-left: 48px; }
.location-tree-depth-5 { margin-left: 60px; }
.location-tree-depth-6 { margin-left: 72px; }
.location-tree-depth-7 { margin-left: 84px; }
.location-tree-depth-8 { margin-left: 96px; }
.location-tree-depth-9 { margin-left: 108px; }

/* HTMX's built-in indicator stylesheet is disabled by the strict-CSP config. */
.htmx-indicator { opacity: 0; }
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
  opacity: 1;
  transition: opacity 200ms ease-in;
}

/* ── Тепловая карта потребности («Подсорт → Потребность») ──────────────────────
   Формат биржевой карты рынка: ПЛОЩАДЬ плитки пропорциональна тому, сколько нужно
   везти на это место, цвет — «жар» относительно самого нагруженного места канала.
   Одинаковые плитки такого не давали: чтобы сравнить два склада, приходилось читать
   и сопоставлять числа.
   Раскладку считает сервер (app/subsort/treemap.py), расставляет static/treemap.js.
   ⚠️ Классы, а не inline-style: прод-CSP содержит `style-src-attr 'none'` — атрибут
   style браузер молча отбрасывает. ⚠️ И не утилиты Tailwind: собранный app.css
   вычищен, bg-rose-300/orange-200 в нём просто нет (проверено). */
/* ⭐ Каналы РЯДОМ, деление между ними вертикальное (владелец 2026-07-21).
   ⚠️ Свой класс, а НЕ утилита Tailwind: сборка `app.css` статическая, и `lg:grid-cols-2`
   в ней ОТСУТСТВУЕТ — карты молча вставали друг под друга. Побочный эффект был неочевидным:
   две широкие карты съедали высоту экрана, и таблица «Потребность» под ними сжималась до
   нескольких строк (её высота = остаток вьюпорта, см. frozen-panes.js). */
.heat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  align-items: start;
}
@media (max-width: 900px) { .heat-grid { grid-template-columns: 1fr; } }

.heat-map {
  position: relative;
  /* ⭐ КВАДРАТ, а не полоса (владелец): в вытянутом прямоугольнике плитки вырождались
     в горизонтальные ленты и площадь переставала читаться как доля.
     ⚠️ Потолок стороны обязателен и подобран ЗАМЕРОМ: без него половина широкого экрана
     даёт квадрат под 800px, а при 560px таблица «Потребность» под картами сжималась до
     236px (её высота = остаток вьюпорта, frozen-panes.js). При 330px таблице остаётся
     рабочая высота, и карта читается. */
  width: 100%;
  max-width: 330px;
  aspect-ratio: 1 / 1;
  max-height: 330px;
  margin-inline: auto;
  border-radius: 0.5rem;
  overflow: hidden;
  background-color: #0f172a;   /* тёмная подложка: щели между плитками читаются как сетка */
}
@media (max-width: 640px) { .heat-map { max-width: 100%; } }
/* Много мест (режим «показать все места» — у WB это 130+ складов): квадрат сохраняем,
   но даём больше стороны, иначе хвост мелких плиток превращается в кашу. */
.heat-map.heat-map-tall { max-width: 400px; max-height: 400px; }

.heat-tile {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 1px solid rgba(15, 23, 42, .55);
  padding: 1px 3px;
  line-height: 1.15;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
}
.heat-tile:hover { filter: brightness(1.08); z-index: 2; }
.heat-tile .heat-loc   { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.heat-tile .heat-qty   { font-weight: 700; }
.heat-tile .heat-alloc { font-size: 10px; opacity: .8; }

/* Пять ступеней «жара» — от «нужно немного» к «нужно больше всего». */
/* ⭐ Шкала ЗЕЛЁНЫЙ → КРАСНЫЙ (владелец 2026-07-21): зелёный «всё хорошо», красный
   «срочно везти». Прежняя начиналась с серого — он читался как «нет данных», хотя означал
   наименьшую потребность. */
.heat-1 { background-color: #86efac; color: #14532d; }
.heat-2 { background-color: #d9f99d; color: #365314; }
.heat-3 { background-color: #fde047; color: #713f12; }
.heat-4 { background-color: #fb923c; color: #7c2d12; }
.heat-5 { background-color: #dc2626; color: #fff; }

/* Место БЕЗ отметки «возим сюда»: видно в режиме «показать все места». Туда ничего не
   уедет («выделено» 0), но потребность там реальная — это ответ на вопрос «что мы
   упускаем». Штриховка, а не цвет: цвет уже занят смыслом «сколько нужно». */
.heat-tile.heat-off {
  background-image: repeating-linear-gradient(
    135deg, rgba(15, 23, 42, .22) 0 4px, transparent 4px 9px);
  border-style: dashed;
  border-color: rgba(15, 23, 42, .5);
}

/* Выбранное место (в таблице стоит фильтр по нему) — обводкой, не цветом:
   цвет здесь уже занят смыслом «сколько нужно». */
.heat-tile.heat-on { outline: 2px solid var(--ui-accent); outline-offset: -2px; z-index: 3; }

/* ── Поставки (WMS): таблица ОБЯЗАНА умещаться в ширину экрана ─────────────────────
   Жалоба сотрудника 2026-07-23 (ноутбук 1280×720): 12 колонок с естественными ширинами давали
   ~1900px и горизонтальную прокрутку. Две колонки слиты (статус → под номер документа,
   печать → в «Действие»), а оставшимся десяти ширины задаёт ЭТОТ блок: fixed-раскладка
   подчиняет колонки нам, а не самому длинному содержимому. Доли в сумме = 100%.
   ⚠️ style="width:…" на <col> нельзя — CSP style-src-attr 'none'; поэтому nth-child здесь.
   ⚠️ Только md+: на телефоне почти все ячейки скрыты (карточный режим), и фиксированные
   доли душили бы две оставшиеся колонки. */
@media (min-width: 768px) {
  #ship-list { table-layout: fixed; width: 100%; }
  /* длинные коды/имена переносятся внутри своей колонки, а не распирают её */
  #ship-list > tbody > tr.ship-row > td,
  #ship-list > thead th { overflow-wrap: break-word; }
  /* ⚠️ .frozen-pane даёт th nowrap — «Организация / склад» и «Статус на площадке» в
     одну строку распирали таблицу до 1370px (найдено замером: без шапки ровно 100%).
     Этой таблице заголовки разрешено переносить: id-селектор перебивает класс. */
  #ship-list > thead th { white-space: normal; overflow-wrap: anywhere; }
  /* ⚠️ именно anywhere, не break-word: break-word ломает слово при отрисовке, но НЕ
     уменьшает минимальную ширину — «Ответственный» (шире своих 12%) продолжал распирать
     обёртку на 35px (найдено поштучным замером th). */
  /* ⚠️ «Действию» — 14%: главное действие и ряд компактных векторных кнопок обязаны
     влезать в колонку ЦЕЛИКОМ. При 11% содержимое НАЕЗЖАЛО на «Ответственный»
     (жалоба владельца 23.07). */
  /* 01.09: количественная сводка — второй столбец в обоих реестрах;
     статус документа живёт вместе с ID поставки в третьем. */
  #ship-list > colgroup > col:nth-child(1) { width: 18%; }  /* Документ: направление, вывоз, внутренний номер */
  #ship-list > colgroup > col:nth-child(2) { width: 12%; }  /* Состав */
  #ship-list > colgroup > col:nth-child(3) { width: 18%; }  /* ID поставки + статусы */
  #ship-list > colgroup > col:nth-child(4) { width: 12%; }  /* Документы: четыре иконки, остальные переносятся */
  #ship-list > colgroup > col:nth-child(5) { width: 11%; }  /* Сдача: точка кросс-дока, дата, слот */
  #ship-list > colgroup > col:nth-child(6) { width: 7%; }  /* Заметка */
  #ship-list > colgroup > col:nth-child(7) { width: 12%; }  /* Действие (+печать на мобиле) */
  #ship-list > colgroup > col:nth-child(8) { width: 10%; }  /* Ответственный: две компактные роли + история */

  /* В черновике внешний ID ещё обычно не назначен, зато «Состав» содержит состояние
     брони и проверку доступного остатка. Переносим 3 п.п. из третьей колонки во вторую;
     сумма сетки остаётся 100%, остальные стадии не меняются. */
  #ship-list.ship-status-draft > colgroup > col:nth-child(2) { width: 15%; }
  #ship-list.ship-status-draft > colgroup > col:nth-child(3) { width: 15%; }

  /* В архивных «Закрыта» и «Отменена» действий уже нет: освободившееся место отдаём
     «Заметке», а «Ответственный» становится седьмым столбцом. */
  #ship-list:is(.ship-status-closed, .ship-status-cancelled) > colgroup > col:nth-child(1) { width: 18%; }
  #ship-list:is(.ship-status-closed, .ship-status-cancelled) > colgroup > col:nth-child(2) { width: 14%; }
  #ship-list:is(.ship-status-closed, .ship-status-cancelled) > colgroup > col:nth-child(3) { width: 18%; }
  #ship-list:is(.ship-status-closed, .ship-status-cancelled) > colgroup > col:nth-child(4) { width: 13%; }
  #ship-list:is(.ship-status-closed, .ship-status-cancelled) > colgroup > col:nth-child(5) { width: 11%; }
  #ship-list:is(.ship-status-closed, .ship-status-cancelled) > colgroup > col:nth-child(6) { width: 15%; }
  #ship-list:is(.ship-status-closed, .ship-status-cancelled) > colgroup > col:nth-child(7) { width: 11%; }

  /* FBS повторяет тот же порядок: документ, состав, ID+статус, документы, сдача,
     действие и ответственный. */
  #fbs-supply-list { table-layout: fixed; width: 100%; }
  #fbs-supply-list > colgroup > col:nth-child(1) { width: 18%; }
  #fbs-supply-list > colgroup > col:nth-child(2) { width: 14%; }
  #fbs-supply-list > colgroup > col:nth-child(3) { width: 21%; }
  #fbs-supply-list > colgroup > col:nth-child(4) { width: 13%; }
  #fbs-supply-list > colgroup > col:nth-child(5) { width: 11%; }
  #fbs-supply-list > colgroup > col:nth-child(6) { width: 13%; }
  #fbs-supply-list > colgroup > col:nth-child(7) { width: 10%; }
  /* На закрытых этапах колонки действий нет. Её доля распределяется между всеми
     шестью оставшимися столбцами, а не целиком отдаётся первому: прежние 32% у
     «Поставки» визуально сжимали «Состав», ID и ответственного. */
  #fbs-supply-list:is(.fbs-stage-closed, .fbs-stage-cancelled) > colgroup > col:nth-child(1) { width: 20%; }
  #fbs-supply-list:is(.fbs-stage-closed, .fbs-stage-cancelled) > colgroup > col:nth-child(2) { width: 16%; }
  #fbs-supply-list:is(.fbs-stage-closed, .fbs-stage-cancelled) > colgroup > col:nth-child(3) { width: 22%; }
  #fbs-supply-list:is(.fbs-stage-closed, .fbs-stage-cancelled) > colgroup > col:nth-child(4) { width: 15%; }
  #fbs-supply-list:is(.fbs-stage-closed, .fbs-stage-cancelled) > colgroup > col:nth-child(5) { width: 15%; }
  #fbs-supply-list:is(.fbs-stage-closed, .fbs-stage-cancelled) > colgroup > col:nth-child(6) { width: 12%; }
}

@media (min-width: 1024px) {
  /* На рабочем десктопе все названия шапки помещаются целиком. Перенос одного
     «Ответственного» делал заголовки визуально ступенчатыми, хотя строка данных
     под ним уже достаточно широкая. На планшете перенос остаётся разрешённым. */
  #ship-list > thead th {
    white-space: nowrap;
    overflow-wrap: normal;
  }
}

/* ── Цвета-фильтры ЯМ: выбор кликом по чипу (страница /ym/colors) ────────────────────
   Просьба владельца 2026-07-26: «нужно чтобы я мог руками сменить предложенные цвета».
   Ctrl-клик в <select multiple> был неудобен и опасен (промах менял цвет молча).
   ⚠️ Список НЕ удалён — он источник правды для inline-save и работает без JS; скрипт
   лишь прячет его и показывает чипы. Поэтому по умолчанию видно СПИСОК, а класс
   `ymc-js` ставит САМ скрипт при загрузке: без него (JS выключен/файл не доехал)
   человек видит рабочий список, а не пустую ячейку. */
.ymc-chips { display: none; }
.ymc-chip {
  font-size: 12px; line-height: 1.1; padding: 3px 7px; border-radius: 6px;
  border: 1px solid #cbd5e1; background: #fff; color: #475569; cursor: pointer;
}
.ymc-chip:hover { border-color: #94a3b8; background: #f8fafc; }
/* предложенное правилом — обведено синим, но НЕ выбрано: решает человек */
.ymc-chip.ymc-suggest { border-color: var(--ui-accent-line); color: var(--ui-accent-hover); background: var(--ui-accent-soft); }
/* выбранное — залито целиком: полутон читался бы как «не нажато» (урок фильтр-чипов
   в списке магазинов: отличие в 1% фона человек не видит) */
.ymc-chip.ymc-on {
  background: var(--ui-accent); border-color: var(--ui-accent); color: #fff; font-weight: 500;
}
.ymc-chip.ymc-on:hover { background: var(--ui-accent-hover); }
html.ymc-js .ymc-chips { display: flex; }
html.ymc-js .ymc-fallback { display: none; }
/* «Уйдёт на ЯМ» — что реально поедет на площадку по этому коду (предложенное не едет). */
.ymc-final { margin-top: 4px; font-size: 11px; color: #64748b; }

/* ── Цвета ЯМ на телефоне (владелец 26.07: «сделай, чтобы на телефоне было удобно») ──
   Карточки даёт общий `data-responsive`; здесь только то, что для ЭТОЙ страницы иначе:
   последняя ячейка — не «строка иконок», а поле ввода имени, ей нужны подпись и вся
   ширина (общее правило `td:last-child` жмёт её вправо и прячет метку). */
@media (max-width: 640px) {
  #ym-colors.responsive td:last-child {
    display: block !important;
    justify-content: flex-start;
  }
  #ym-colors.responsive td:last-child::before { display: block !important; }
  /* Чипы цвета — крупнее и на всю ширину: палец, а не курсор (44px — минимум Apple HIG,
     иначе промахи, из-за которых мы и ушли от ctrl-клика в списке). */
  #ym-colors .ymc-chip { font-size: 13px; padding: 8px 10px; min-height: 40px; }
  #ym-colors .ymc-final { font-size: 12px; }
  /* Артикулы группы — в столбик читаются хуже; оставляем перенос, но без разрыва кода */
  #ym-colors .font-mono { white-space: nowrap; }
}

/* ── Рабочие списки на телефоне: ТАБЛИЦА, а не карточки (владелец 29.07, дважды:
   need-table «полный ужас», остатки «всё равно не удобно» — карточка на строку
   занимает экран, а подпись последней ячейки прячется правилом колонок-действий,
   отсюда «непонятные цифры» без ярлыка). Нужна «таблица как была, но удобная»:
   закреплённая первая колонка (sticky-first работает на любой ширине) +
   горизонтальный свайп внутри контейнера + компактные размеры, чтобы в кадр
   влезало 3-4 колонки. Эти таблицы сознательно НЕ data-responsive. */
@media (max-width: 640px) {
  #need-table, #need-table-own, #stock-table { font-size: 11px; }
  #stock-table.stock-articles-table { font-size: 12px; }
  #need-table > thead th, #need-table > tbody td,
  #need-table-own > thead th, #need-table-own > tbody td,
  #stock-table > thead th, #stock-table > tbody td { padding: 6px 6px; }
  #stock-table.stock-batches-table > thead th {
    padding: 4px 3px;
  }
  #stock-table.stock-batches-table > tbody td {
    padding: 2px 3px;
    line-height: 1.2;
  }
  #stock-table.stock-batches-table > thead th:nth-child(2),
  #stock-table.stock-batches-table > tbody td:nth-child(2) {
    width: 6rem;
    max-width: 6rem;
  }
  #stock-table.stock-locations-table > thead th {
    padding: 4px 3px;
  }
  #stock-table.stock-locations-table > tbody td {
    padding: 2px 3px;
    line-height: 1.2;
  }
  #stock-table.stock-locations-table > thead th:nth-child(3),
  #stock-table.stock-locations-table > tbody td:nth-child(3) {
    width: 6rem;
    max-width: 6rem;
  }
  #stock-table.stock-locations-table > thead th:nth-child(4),
  #stock-table.stock-locations-table > tbody td:nth-child(4) {
    width: 6rem;
    max-width: 6rem;
  }
  #stock-table.stock-locations-table > thead th:nth-child(5),
  #stock-table.stock-locations-table > tbody td:nth-child(5) {
    width: 6.5rem;
    max-width: 6.5rem;
  }
  #stock-table.stock-locations-table .stock-location-boxes-note {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #stock-table.stock-locations-table > thead th:nth-child(n + 5),
  #stock-table.stock-locations-table > tbody td:nth-child(n + 5) {
    text-align: center;
  }
  #stock-table.stock-locations-table > thead th:nth-child(n + 5) a {
    justify-content: center;
  }
  /* «?»-подсказки в шапке на телефоне съедают ширину колонок — прячем; сами
     объяснения остаются доступными с десктопа (конвенция «?» не нарушена). */
  #need-table > thead .help, #need-table-own > thead .help,
  #stock-table > thead .help { display: none; }
}

/* ⭐ «Расчёт поставки»: направление, по которому уже создана поставка ПОСЛЕ снятия расчёта
   (владелец 03.08). Гасим, а не прячем: человек должен видеть, ЧТО туда уже везётся и
   почему строки нет в работе. Возврат документа в черновик/отмена снимают гашение сами —
   признак читается из живого статуса. */
.calc-covered { opacity: .55; }
.calc-covered:hover, .calc-covered:focus-within { opacity: 1; }

/* ── «Расчёт поставки» на телефоне (владелец 07.08: «слишком размазано») ──────
 *
 * ЗАЧЕМ. Шапка направления — флекс «имя + метрики | действия», где блок действий
 * НЕ сжимается (`shrink-0`): без этого кнопка «В черновик» рвалась на две строки
 * и читалась как поломка (правка 03.08). На телефоне те же кнопки забирают ~280 px
 * из 390, левой части остаётся ~90 — и метрики ломались по одному слову в столбик
 * на восемь строк (боевой скрин владельца).
 *
 * ЛЕЧЕНИЕ: на узком экране шапка становится КОЛОНКОЙ — имя, метрики и метки во всю
 * ширину, действия отдельной строкой снизу. На широком экране ничего не меняется:
 * там места хватает, и вертикаль только растянула бы список.
 *
 * ⚠️ Свой класс, а НЕ `sm:flex-col`/`sm:w-full`: сборка Tailwind статическая, этих
 * вариантов в `app.css` нет — правило молча не сработало бы. Тот же капкан уже
 * ловили на `sm:hidden`, `md:table-header-group`, `right-4` и `group-open/setup`.
 */
@media (max-width: 767px) {
  .calc-head { flex-direction: column; align-items: stretch; gap: .4rem; }
  /* ⚠️ Действия тянутся на всю ширину и переносятся: три контрола (галка + две
     кнопки) в 390 px одной строкой не помещаются. */
  .calc-act { width: 100%; flex-wrap: wrap; }
}

/* ── Компактная строка полей формы (.form-row) ────────────────────────────────
 *
 * Владелец 04.08: «очень большие и неудобные поля для заполнения выпадашек —
 * сделай удобно и компактно».
 *
 * ЗАЧЕМ. Поля формы стояли в сетке `grid-cols-2`: на широком экране выпадашка
 * «— выберите склад —» растягивалась на пол-экрана (≈480 px), а форма занимала
 * два ряда. Значения в этих полях короткие, ширина им не нужна — нужна ОДНА
 * компактная строка.
 *
 * ⚠️⚠️ ПОЧЕМУ СВОЙ КЛАСС, А НЕ УТИЛИТЫ TAILWIND. Сборка `static/app.css`
 * статическая: `sm:w-52`, `sm:w-56`, `sm:w-64` в ней ОТСУТСТВУЮТ (проверено), и
 * поля молча остались бы полноширинными — тот же капкан, что уже ловили с
 * `sm:hidden` в сборке и `right-4` у всплывающей плашки.
 *
 * Правило: на телефоне поля идут в столбик (гибкая база 100%), с 640 px каждое
 * берёт свою ширину по роли. Тянется остатком строки только `.fr-grow`, поэтому
 * свободное место достаётся свободному тексту, а не выпадашкам.
 */
.form-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; }
.form-row > * { flex: 1 1 100%; min-width: 0; }
/* ⛔⛔ ПОДСКАЗКА-«?» НЕ РАСТЯГИВАЕТСЯ (боевой случай 17.08: владелец увидел вместо
 * кружка серый эллипс во всю ширину поля). `.form-row > *` раздаёт КАЖДОМУ ребёнку
 * `flex-basis: 100%`, и `width: 14px` у `.help` проигрывает — кружок превращается в
 * полосу с закруглением 9999px. Лечим ЗДЕСЬ, а не в каждом шаблоне: иначе тот же
 * эллипс вылезет в следующей форме, где кто-то поставит «?» рядом с полем. */
.form-row > .help { flex: 0 0 auto; }

/* ⚠️⚠️ ПРИМЕЧАНИЕ ПОД ПОЛЕМ СДВИГАЕТ ВЕСЬ РЯД (владелец 09.08: «немного едет»).
 * Ряд выравнивается по НИЗУ, поэтому подпись, добавленная ПОД одним полем («Список
 * пуст: отметьте контрагента…»), поднимает это поле относительно соседей — рамки
 * встают на разной высоте. Общий `align-items` менять нельзя: по нижнему краю ряд
 * выравнивается ради полей БЕЗ подписи сверху (ряд тарифа хранения), и flex-start
 * поставил бы их вровень с чужим лейблом.
 * Лечение — вынести примечание из поля: `.fr-note` занимает всю ширину и переносится
 * своей строкой под ряд. Тот же приём, что у метки направления в «Расчёте поставки». */
.form-row > .fr-note { flex: 1 1 100%; margin-top: -.25rem; }

@media (min-width: 640px) {
  .form-row > .fr-sm   { flex: 0 0 11rem; }   /* короткий выбор (канал) */
  .form-row > .fr-md   { flex: 0 0 15rem; }   /* обычный выбор (склад, организация) */
  .form-row > .fr-grow { flex: 1 1 12rem; }   /* свободный текст — забирает остаток */
}

/* Перемещение и пересорт используют ОДИН двухстрочный каркас: склад → артикул →
 * источник; под ним — левое пояснение/причина и цель → количество → действие. */
.wms-recent-operations {
  margin-top: 1rem;
  padding-top: .75rem;
  border-top: 1px solid #f1f5f9;
}
.wms-operation-panel {
  padding: 0;
  overflow: hidden;
  background: transparent;
}
.wms-operation-panel > .wms-operation-fields {
  padding: 1rem;
  background: var(--ui-surface);
}
.wms-operation-panel > .wms-recent-operations {
  margin-top: 0;
  padding: .75rem 1rem 1rem;
  border-top-color: var(--ui-border-strong);
  background: rgba(255, 255, 255, .25);
}
.wms-operation-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .75rem;
}
.wms-operation-secondary-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .75rem;
}
.wms-adjust-hint {
  line-height: 13px;
}
.wms-operation-left-second {
  width: 0;
  min-width: 100%;
}
p.wms-operation-left-second {
  overflow-wrap: anywhere;
  overflow-x: clip;
  line-height: 13px;
}
.wms-move-to-sizer,
.wms-operation-sku-sizer { display: none; }
.wms-operation-submit { justify-self: start; }
@media (min-width: 768px) {
  .wms-operation-fields {
    grid-template-columns: 130px max-content minmax(0, 1fr);
    grid-template-areas:
      "warehouse sku from"
      "note note destination";
    align-items: end;
  }
  .wms-operation-field--warehouse { grid-area: warehouse; }
  .wms-operation-field--sku { grid-area: sku; }
  .wms-operation-field--source {
    grid-area: from;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    width: 100%;
  }
  .wms-operation-left-second {
    grid-area: note;
    align-self: start;
  }
  .wms-operation-left-second > input {
    width: 100%;
    min-width: 0;
  }
  .wms-operation-secondary-row {
    grid-area: destination;
    grid-template-columns: max-content max-content max-content;
    align-items: end;
    align-self: start;
    justify-self: start;
  }
  /* ⭐⭐ ЧЕТВЁРТАЯ КОЛОНКА ПОЯВЛЯЕТСЯ ВМЕСТЕ С ПОЛЕМ, А НЕ ЗАРАНЕЕ (правка 08.09,
     перемещение между своими складами). Поле «Куда (склад)» рисуется, только когда
     своих складов больше одного; на боевой он пока ОДИН, и пустой зарезервированный
     трек дал бы видимый провал `.75rem` там, где поля нет.
     ⛔ Пустые треки не резервируем — тем же правилом живут служебные ряды карточек
     FBS: grid-gap создаёт дыру даже у нулевого трека. */
  .wms-operation-secondary-row:has(> .wms-operation-field--target-wh) {
    grid-template-columns: max-content max-content max-content max-content;
  }
  .wms-resort-secondary-row {
    grid-template-columns: max-content max-content minmax(12rem, 1fr) max-content;
    width: 100%;
    justify-self: stretch;
  }
  .wms-resort-reason {
    min-width: 0;
  }
  .wms-resort-reason > input {
    width: 100%;
    min-width: 0;
  }
  .wms-adjust-fields {
    grid-template-areas:
      "warehouse sku from"
      "controls controls controls"
      "hint hint hint";
  }
  .wms-adjust-secondary-row {
    grid-area: controls;
    grid-template-columns: max-content 130px max-content max-content minmax(8rem, 1fr) max-content;
    grid-template-areas: "kind organization quantity cost reason submit";
    width: 100%;
    align-items: end;
    justify-self: stretch;
  }
  .wms-adjust-kind { grid-area: kind; }
  .wms-adjust-organization { grid-area: organization; }
  .wms-adjust-secondary-row > .wms-operation-field--qty { grid-area: quantity; }
  .wms-adjust-cost { grid-area: cost; }
  .wms-adjust-reason { grid-area: reason; }
  .wms-adjust-submit { grid-area: submit; }
  .wms-adjust-organization,
  .wms-adjust-reason,
  .wms-adjust-cost {
    min-width: 0;
  }
  .wms-adjust-organization > select,
  .wms-adjust-reason > input,
  .wms-adjust-cost > input {
    width: 100%;
    min-width: 0;
  }
  .wms-adjust-hint {
    grid-area: hint;
    width: 0;
    min-width: 100%;
    overflow-wrap: anywhere;
  }
  .wms-operation-field--sku,
  .wms-operation-field--target {
    display: grid;
    grid-template-columns: max-content;
    grid-template-rows: auto auto;
  }
  .wms-operation-field--sku > label,
  .wms-operation-field--source > label,
  .wms-operation-field--target > label { grid-area: 1 / 1; }
  .wms-operation-field--sku > label,
  .wms-operation-field--target > label {
    width: 0;
    min-width: 100%;
  }
  .wms-operation-field--sku > :is(input, .wms-operation-sku-sizer),
  .wms-operation-field--source > :is(select, .ss-wrap),
  .wms-operation-field--target > :is(input, select, .ss-wrap, .wms-operation-sku-sizer, .wms-move-to-sizer) { grid-area: 2 / 1; }
  /* Сам контрол не участвует в max-content: длинная текущая подпись «адрес · орг ·
   * остаток · бронь» у источника не имеет права раздвигать колонку шире SKU-sizer. */
  .wms-operation-field--sku > input,
  .wms-operation-field--source > :is(select, .ss-wrap),
  .wms-operation-field--target > :is(input, select, .ss-wrap) {
    width: 0;
    min-width: 100%;
  }
  .wms-operation-sku-sizer,
  .wms-move-to-sizer {
    display: block;
    box-sizing: content-box;
    height: 0;
    visibility: hidden;
    font-size: .78rem;
    pointer-events: none;
  }
  .wms-operation-sku-sizer {
    padding-right: 1.3rem;
    white-space: nowrap;
  }
  .wms-move-to-sizer { padding-right: 44px; }
  .wms-move-to-sizer > span {
    display: block;
    white-space: nowrap;
  }
  /* ⚠️ Ширина склада — ровно та же 130px, что у поля «Склад» в верхнем ряду
     (CLAUDE.md, раздел «Операции склада → Перемещение»): одна сущность на экране
     обязана иметь одну ширину, иначе два одинаковых списка выглядят разными полями. */
  .wms-operation-field--target-wh {
    display: grid;
    grid-template-columns: 130px;
    grid-template-rows: auto auto;
  }
  .wms-operation-field--target-wh > label { white-space: nowrap; }
  .wms-operation-field--target-wh > select {
    width: 130px;
    min-width: 0;
  }
  .wms-operation-field--qty {
    display: grid;
    grid-template-columns: max-content;
  }
  .wms-operation-field--qty > label { white-space: nowrap; }
  .wms-operation-field--qty > input {
    width: 0;
    min-width: 100%;
  }
  .wms-move-submit {
    width: 115px;
    height: 36px;
  }
  .wms-resort-submit {
    width: 145px;
    height: 36px;
  }
  .wms-adjust-submit {
    width: 100px;
    height: 36px;
  }
}

/* ── FBM · новая отгрузка ─────────────────────────────────────────────────
 * Шапка и две стартовые карточки используют ширину рабочего экрана. Селекты
 * стоят на собственной верхней строке: пояснение назначения больше не меняет
 * их базовую линию и не сталкивает часть полей вниз. */
.shipment-new-page {
  width: 100%;
  max-width: 1240px;
  margin-inline: auto;
}
.shipment-new-title-row {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: .75rem;
  margin: .25rem 0 .75rem;
}
.shipment-new-title-row .ui-page-lead {
  max-width: 48rem;
  margin: 0;
  text-align: left;
}
.shipment-new-setup {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 250px;
  align-items: start;
  gap: .75rem;
  margin-bottom: .75rem;
}
.shipment-new-fields {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.shipment-new-field-row {
  display: grid;
  grid-template-columns: 140px 155px 130px 195px minmax(0, 1fr);
  align-items: end;
  gap: .75rem;
}
.shipment-new-field-row > * { min-width: 0; }
.shipment-new-note { margin-top: .75rem; }
.shipment-new-compose,
.shipment-new-compose > [data-dropzone] { min-width: 0; }
.shipment-new-compose {
  width: 250px;
  max-width: 100%;
  justify-self: end;
}
.shipment-new-compose > [data-dropzone] > .flex {
  flex-wrap: wrap;
  white-space: normal;
}
#stock-container tbody tr > td {
  transition: background-color .14s ease;
}
#stock-container tbody tr:hover > td {
  background: var(--ui-accent-soft);
}
.shipment-compose-card,
.shipment-stock-card {
  overflow-x: auto;
  border: 1px solid #e2e8f0;
  border-radius: .75rem;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 23, 42, .08);
}
.shipment-compose-card {
  margin-bottom: .75rem;
}
/* Специфичность выше общего desktop-правила `main table.text-sm`: прежний короткий
 * селектор проигрывал ему, поэтому визуально строки почти не менялись. */
main :is(.shipment-compose-card, .shipment-stock-card) table.text-sm
  > :is(thead, tbody, tfoot) > tr > :is(th, td) {
  padding-top: .125rem;
  padding-bottom: .125rem;
  line-height: 1.15;
}
.shipment-compose-card input[name^="ship_"],
.shipment-stock-card input[name^="ship_"] {
  height: 1.65rem;
  padding-top: 0;
  padding-bottom: 0;
}
.shipment-new-submit-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: .75rem;
  margin-top: 1rem;
}
.shipment-new-submit-row p { margin: 0; }
#compose-totals {
  width: fit-content;
  max-width: 100%;
  border-color: #c4b5fd;
}

@media (max-width: 1050px) {
  .shipment-new-setup { grid-template-columns: minmax(0, 1fr); }
  .shipment-new-fields { width: 100%; }
  .shipment-new-field-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 639px) {
  .shipment-new-title-row {
    display: block;
    margin-bottom: .65rem;
  }
  .shipment-new-title-row .ui-page-lead {
    margin-top: .25rem;
    text-align: left;
  }
  .shipment-new-field-row { grid-template-columns: minmax(0, 1fr); }
}

/* ─── Группа пунктов в выпадающем меню (.nav-group) ──────────────────────────
 *
 * Владелец 06.08: «подвкладки писать такими же размерами, а вложенные в них пункты
 * показывать при наведении курсора с правой части». До этого группа была плоским
 * списком (мелкий серый заголовок + пункты с отступом), и выпадашка WMS выросла до
 * 13 строк — искать в ней стало труднее, чем в коротком списке.
 *
 * ⚠️ Классы СВОИ, не Tailwind: в статической сборке нет ни `left-full`, ни
 * `group-hover:block` — правило молча не сработало бы (тот же капкан, что с
 * `md:table-header-group` и `sm:hidden`).
 *
 * ⚠️ `:focus-within` рядом с `:hover` — ради клавиатуры: заголовок группы имеет
 * tabindex, и подменю обязано открываться без мыши.
 */
.nav-group { position: relative; }
.nav-group-title:hover { background: #f8fafc; }

.nav-sub > a { padding-left: 1.5rem; }

/* ⭐⭐ ТЕЛЕФОН: ГРУППА СВЁРНУТА, РАСКРЫВАЕТСЯ КАСАНИЕМ (жалоба владельца 17.08 «меню
 * раскрыто и занимает всю прокрутку»). Выезд вправо на узком экране некуда, и раньше
 * все группы стояли раскрытыми ВСЕГДА — меню WMS занимало экран целиком ещё до того,
 * как человек до него добирался. Теперь на мобиле работает тот же принцип, что у самих
 * выпадашек: закрыто, пока не нажали.
 * ⚠️ Открытость метит атрибут `data-open` (его ставит base-navigation.js), а не
 * `:hover`/`:focus-within`: на тач-экране наведения нет, а фокус на `div[tabindex]`
 * тачем ставится не во всех браузерах — меню открывалось бы через раз.
 * ⚠️ Карточный вид подменю (тень, скругление, min-width) на мобиле снимаем: панель
 * родителя уже приведена в поток выше, и всплывающая карточка внутри неё читалась как
 * оторвавшийся от меню кусок (её и видно на скриншоте владельца). */
@media (max-width: 767px) {
  .nav-sub { display: none; }
  .nav-group[data-open] > .nav-sub { display: block; }
  /* ⭐⭐⭐ КАСАНИЕ ПО ЗАГОЛОВКУ ОБЯЗАНО СРАБАТЫВАТЬ С ПЕРВОГО РАЗА (владелец 28.08: «не
   * кликаются подменю на мобильной версии»). Механика (`data-open`) и правила выше были
   * верны — проверено исполнением (`tests/js/test_nav_group_tap.js`), и код в проде
   * байт в байт совпадал с исходником. Мешало САМО КАСАНИЕ:
   * ⛔ `#mnav` — прокручиваемая панель (`overflow-y: auto`), и без `touch-action` браузер
   *   держит палец как возможное начало скролла: `click` откладывается, а при малейшем
   *   сдвиге пальца по вертикали ГЛОТАЕТСЯ вовсе. На коротких пунктах это незаметно, а
   *   заголовок группы — единственное место меню, где нажатие не ведёт по ссылке, и
   *   проглоченное касание выглядит как «кнопка не работает».
   * ⛔ `touch-action: manipulation` заодно снимает ожидание двойного тапа (~300 мс) —
   *   именно оно давало «нажал, ничего не произошло, нажал ещё раз».
   * ⚠️ Область нажатия увеличена до 44 px — палец шире строки текста; в макете это
   *   ровно та высота, которую занимают соседние пункты-ссылки. */
  .nav-group-title {
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(37, 99, 235, 0.12);
    min-height: 44px;
  }
  .nav-group-title:active { background: var(--ui-accent-soft); }
  .nav-group[data-open] > .nav-group-title { font-weight: 600; }
  .nav-group[data-open] > .nav-group-title svg { transform: rotate(90deg); }
  #mnav .nav-sub {
    min-width: 0;
    box-shadow: none;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
}

@media (min-width: 768px) {
  /* Flyout и scroll-container несовместимы: `overflow-y:auto` превращает видимую
     ось X в auto, и Windows рисует полосы прокрутки вокруг правого подменю. */
  #mnav [data-mobile-modules] > details[data-mobile-module] > div:has(.nav-group) {
    max-height: none;
    overflow: visible;
    overscroll-behavior: auto;
  }
  .nav-sub {
    display: none;
    position: absolute;
    left: 100%;
    top: -0.25rem;
    margin-left: 1px;         /* стык с родительской панелью, без зазора-разрыва наведения */
  }
  .nav-sub > a { padding-left: 1rem; }
  .nav-group:hover > .nav-sub,
  .nav-group:focus-within > .nav-sub { display: block; }
}

/* ─── Шапка таблицы: видна на ПК, скрыта на телефоне (.tbl-head) ─────────────
 *
 * ⚠️⚠️ ЗАЧЕМ СВОЙ КЛАСС. Разметка писалась как `hidden md:table-header-group`, но
 * `md:table-header-group` в СТАТИЧЕСКОЙ сборке Tailwind ОТСУТСТВУЕТ (проверено:
 * в app.css есть `.table-header-group` без префикса и `.md\:table-cell`, а варианта
 * с префиксом для header-group нет). Значит срабатывал только `hidden`, и шапка
 * колонок не показывалась НИКОГДА — владелец 06.08 попросил её «добавить», хотя
 * заголовки в разметке всё это время были. Тот же капкан уже ловили с `sm:hidden`
 * и `right-4`: класса нет в сборке — правило молча не работает.
 *
 * На телефоне шапка не нужна: там таблицы превращаются в карточки (`.responsive`),
 * а подпись поля печатается у самого значения.
 *
 * Липкость даёт общий `.frozen-pane` (шапка липнет к верху прокручиваемой панели) —
 * второй механизм заводить не надо. */
.tbl-head { display: none; }
@media (min-width: 768px) {
  .tbl-head { display: table-header-group; }
}

/* ── Липкая панель ПОД шапкой сайта (.stick-under-top) ────────────────────────
 *
 * Владелец 05.08: «плашка при прокрутке должна приклеиваться к шапке, чтобы было
 * видно объём выбранных поставок и все количественные характеристики».
 *
 * ⚠️⚠️ ПОЧЕМУ НЕ `sticky top-0`. Шапка сайта (#topnav) сама липкая с `top:0; z-40` —
 * панель с `top-0 z-10` честно липла, но ПОД НЕЁ: уезжала под шапку и исчезала.
 * Липнуть надо на ВЫСОТЕ шапки, а высота у неё плавающая (две строки, переносы на
 * узких экранах) — захардкоженные пиксели сломались бы при первом переносе меню.
 * Высоту меряет крошечный скрипт в base.html и кладёт в --topnav-h (тот же принцип
 * «мерить фактом», что у .frozen-pane).
 *
 * z-30: НИЖЕ шапки (40) — выпадающие меню обязаны накрывать панель; ВЫШЕ контента.
 */
.stick-under-top {
  position: -webkit-sticky;
  position: sticky;
  top: var(--topnav-h, 0px);
  z-index: 30;
}

/* ── Звезда приоритетного ШК в карточке товара (владелец 05.08) ──────────────
 * Радио спрятано, горит символ: серый = обычный, янтарный = приоритетный.
 * Свой класс: peer-checked-вариантов Tailwind в статической сборке нет. */
.bc-star { cursor: pointer; line-height: 1; }
.bc-star input { position: absolute; opacity: 0; pointer-events: none; }
.bc-star .bc-star-i { font-size: 1.25rem; color: #cbd5e1; transition: color .12s; }
.bc-star:hover .bc-star-i { color: #f59e0b; }
.bc-star input:checked ~ .bc-star-i { color: #f59e0b; }

/* ── Системная этикетка ТОВАРА. Один barcode-вектор на всех четырёх поверхностях
   сборки (плитки «По упаковке», россыпь, по-артикульно, мобильные карточки).
   SVG работает маской, поэтому цвет и hover остаются системными, а не зашитыми в файл. */
.unit-print-btn { display: inline-flex; width: 1.65rem; height: var(--ui-control-height-compact); padding: 3px .28rem;
  align-items: center; justify-content: center; flex: 0 0 auto;
  border: 1px solid #a5b4fc; border-radius: 8px; background: transparent; color: #4338ca;
  text-decoration: none; vertical-align: middle; line-height: 1; }
.ui-product-label-icon,
.unit-print-btn::before { display: block; width: 1rem; height: 1rem;
  background: currentColor; -webkit-mask: url("/static/barcodegeo.svg?v=1") center / contain no-repeat;
  mask: url("/static/barcodegeo.svg?v=1") center / contain no-repeat; }
.unit-print-btn::before { content: ""; }
.unit-print-btn:hover { background: var(--ui-accent-soft); }

/* Файл заявки — плоский круг точного брендового цвета. Emoji удалены: ОС рисовала
   их объёмными и меняла оттенок от браузера к браузеру. */
.mpfile-dot {
  display: block;
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #94a3b8;
  box-shadow: none;
}
.mpfile-dot--wb { background: #cb11ab; }
.mpfile-dot--ozon { background: #005bff; }
.mpfile-dot--ym { background: #fc0; }
.mpfile-dot--mvideo { background: #e30611; }

/* ── Список товаров: цена безубытка свёрнута в одну колонку (владелец 06.08).
   .be-sum — сводные колонки (видны по умолчанию), .be-col — по-канальные (видны в
   развёрнутом виде, класс products-be-open на <table>). На телефоне обе скрыты:
   таблица там рисуется карточками, как и остальные md:table-cell колонки. */
.be-col { display: none; }
@media (min-width: 768px) {
  .products-be-open .be-col { display: table-cell; }
  .products-be-open .be-sum { display: none; }
}

/* ── Бейдж маркетплейса (владелец 06.08: «одно обозначение канала рядом с номером
   поставки, идеально иконка типа ВБ или Озон — так заметнее»). Свои классы, а не
   утилиты Tailwind: сборка статическая, произвольных брендовых цветов в ней нет. */
.mpb { display:inline-flex; align-items:center; padding:0 .35rem; height:1.05rem;
       border-radius:.28rem; font-size:10px; font-weight:700; letter-spacing:.03em;
       vertical-align:middle; line-height:1; font-family:ui-sans-serif,system-ui,sans-serif; }
/* ⚠️⚠️ ЦВЕТ ТЕКСТА ЗАДАЁТСЯ ТОЛЬКО ЗДЕСЬ, ВМЕСТЕ С ФОНОМ (владелец 07.08: «дату логичнее
   писать чёрным»). Раньше базовые `.mpb`/`.ship-date` ставили `color:#fff`, а тёмный текст
   для светлых фонов жил в `.mpb-ym`/`.mpb-avito` — и МОЛЧА не работал: специфичность
   одинаковая, а объявлены они ВЫШЕ, поэтому побеждал белый. Замер контраста: жёлтый ЯМ
   1.51, салатовый Avito 1.86 при норме 4.5 — то есть цифры на плашке почти не читались.
   Фон и текст — одна пара, разносить их по разным правилам нельзя. */
.mpb-wb     { --mp-bg:#cb11ab; --mp-fg:#fff; background:#cb11ab; color:#fff; }     /* фирменный пурпур Wildberries */
.mpb-ozon   { --mp-bg:#005bff; --mp-fg:#fff; background:#005bff; color:#fff; }     /* синий Ozon */
.mpb-mvideo { --mp-bg:#e30611; --mp-fg:#fff; background:#e30611; color:#fff; }     /* красный М.Видео */
.mpb-ym     { --mp-bg:#fc0; --mp-fg:#111827; background:#fc0; color:#111827; }     /* жёлтый Яндекс — текст почти чёрный */
.mpb-avito  { --mp-bg:#97cf26; --mp-fg:#14310a; background:#97cf26; color:#14310a; } /* салатовый Avito — тёмно-зелёный */
.mpb-other  { --mp-bg:#64748b; --mp-fg:#fff; background:#64748b; color:#fff; }     /* незнакомый код — честный серый */
/* ⭐ 601: поставка ХРАНИТЕЛЮ (фулфилмент) — та же светло-зелёная пара, что была у раздела
   FF: людям она знакома как «едет на наш склад у партнёра», а не на площадку. Фон и текст —
   одной парой (правило выше). */
.mpb-keeper { --mp-bg:#b6d053; --mp-fg:#1f2937; background:#b6d053; color:#1f2937; }

/* ⭐⭐⭐ ЧИПЫ РАБОЧИХ ДНЕЙ (владелец 30.08: «названия дней недели — пн / вт / ср / чт / пт /
   сб / вс — и при клике на день он меняет цвет на синий (цвет канала) и это включает день,
   если серым цветом — то это выходной»). Разметка — макрос `work_days_chips`.
   ⚠️ Чекбокс СКРЫТ, но остаётся в потоке фокуса: `appearance:none` + нулевой размер вместо
   `display:none`, иначе поле выпадает из табуляции и с клавиатуры день не переключить.
   ⚠️ Раскраска — соседним селектором `:checked + span`: состояние живёт в чекбоксе, JS не
   нужен вовсе (CSP запрещает инлайн-обработчики, а лишний скрипт пришлось бы ещё и
   переинициализировать после каждой подмены DOM).
   ⚠️⚠️ ЦВЕТ ТЕКСТА И ФОН — ОДНОЙ ПАРОЙ в каждом правиле: тот же капкан каскада, что
   разобран выше у `.mpb-*` (светлый фон ЯМ с белым текстом давал контраст 1.51). */
/* ⚠️⚠️ ПОДПИСЬ ОТСЕЧКИ НЕ ИМЕЕТ ПРАВА РАСТАЛКИВАТЬ РЯД (живой замер 31.08). Текст ЯМ
   «настройки живут в кабинете Яндекс Маркета, по API их не отдают» занял 932 px внутри
   `flex-wrap` и налез И на чипы дней, И на кнопку «Сохранить» — тем же способом, каким
   подпись «ждём приёмки каналом» накрывала «Ответственного» 30.08. Режем многоточием:
   полный текст лежит в `title`, а «что делать» — в «?» рядом.
   ⛔ Свой класс, а не утилита Tailwind: сборка статическая, и `max-w-[22rem]` в
   `static/app.css` может не оказаться — правило молча не сработает. */
.cutoff-note { max-width:22rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* ⚠️ «?» внутри обрезаемой подписи обязан остаться видимым: он несёт объяснение. */
.cutoff-note .help { flex:none; }
.wd-chips { display:inline-flex; flex-wrap:wrap; gap:.25rem; align-items:center; }
.wd-chip { position:relative; display:inline-flex; cursor:pointer; user-select:none; }
.wd-chip input { position:absolute; width:0; height:0; opacity:0; appearance:none; margin:0; }
.wd-chip span {
  display:inline-flex; align-items:center; justify-content:center;
  min-width:2.25rem; padding:.25rem .5rem; border-radius:.375rem;
  font-size:.75rem; font-weight:600; line-height:1;
  background:#f1f5f9; color:#94a3b8;          /* выходной — приглушённый серый */
  border:1px solid #e2e8f0; transition:background-color .12s, color .12s, border-color .12s;
}
.wd-chip:hover span { border-color:#cbd5e1; }
/* Включённый день — синий по умолчанию; цвет площадки перебивает его ниже. */
.wd-chip input:checked + span { background:#2563eb; color:#fff; border-color:#2563eb; }
/* ⭐ Цвет КАНАЛА, ровно та же палитра, что у бейджей: список площадок один на систему. */
.wd-chip.mpb-wb     input:checked + span { background:#cb11ab; color:#fff; border-color:#cb11ab; }
.wd-chip.mpb-ozon   input:checked + span { background:#005bff; color:#fff; border-color:#005bff; }
.wd-chip.mpb-mvideo input:checked + span { background:#e30611; color:#fff; border-color:#e30611; }
.wd-chip.mpb-ym     input:checked + span { background:#fc0;    color:#111827; border-color:#e6b800; }
.wd-chip.mpb-avito  input:checked + span { background:#97cf26; color:#14310a; border-color:#86ba22; }
.wd-chip.mpb-other  input:checked + span { background:#64748b; color:#fff; border-color:#64748b; }
/* ⚠️ Фокус виден ВСЕГДА (клавиатура): скрытый чекбокс сам обводки не даёт. */
.wd-chip input:focus-visible + span { outline:2px solid #2563eb; outline-offset:2px; }
/* ⚠️ Недоступный чип не притворяется нажимаемым — курсор и прозрачность меняются вместе. */
.wd-chip input:disabled + span { opacity:.55; cursor:not-allowed; }
.wd-chip:has(input:disabled) { cursor:not-allowed; }
/* ⭐⭐ ТЕЛЕФОН — РАБОЧЕЕ МЕСТО СКЛАДА, а не урезанная версия (правило проекта 22.08):
   на десктопе чип 36×22 попадается мышью, пальцем — нет. Ниже 640px (та же точка
   перелома, что у карточных списков) чип растёт до 40px по высоте — минимум под палец,
   тем же числом, что у `.doc-icon`. ⚠️ Ряд остаётся в одну строку: семь чипов по 44px
   с зазорами укладываются в 340px, то есть в любой телефон от 360px шириной. */
@media (max-width: 639px) {
  .wd-chip span { min-height:2.5rem; min-width:2.5rem; font-size:.8125rem; }
}
.fbs-mp-badge {
  width: 1.8rem;
  justify-content: center;
  padding-inline: 0;
}

/* ⭐ Плашка ДАТЫ СДАЧИ (владелец 07.08: «дату сделай на фоне цвета маркетплейса, чтобы
   сразу бросалось в глаза»). Цвет даёт общий класс `.mpb-*` — тот же, что у бейджа
   канала; здесь только форма и размер. Крупнее бейджа: дату читают, а не опознают. */
.ship-date { display:inline-block; box-sizing:border-box; height:25px; padding:.15rem .5rem; border-radius:.375rem;
  font-weight:600; font-size:.875rem; line-height:1.25rem; white-space:nowrap; }
.wms-inline-date {
  display: inline-block;
  box-sizing: border-box;
  width: 8.5rem;
  max-width: 100%;
}
.supply-date-input {
  width: auto;
  height: 25px;
  min-width: 0;
  max-width: none;
  field-sizing: content;
  margin: 0;
  border: 0;
  appearance: none;
  -webkit-appearance: none;
  font-size: .875rem;
  line-height: 1.25rem;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
.supply-date-input::-webkit-datetime-edit {
  min-width: 0;
  padding: 0;
}
.supply-date-input::-webkit-calendar-picker-indicator {
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
  opacity: 0;
}
.wms-document-date-editor {
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  margin: 0;
  cursor: pointer;
}
.wms-document-date-readonly {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  white-space: nowrap;
}
.wms-document-date-calendar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 1.25rem;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: .3rem;
  color: #64748b;
  cursor: pointer;
}
.wms-document-date-calendar:hover { background: #f1f5f9; color: #334155; }
.wms-document-date-calendar .ui-system-icon {
  width: .85rem;
  height: .85rem;
  flex-basis: .85rem;
}
.wms-document-date-badge.bg-blue-600 {
  --mp-bg: var(--ui-accent);
  --mp-fg: #fff;
}
.wms-document-date-badge.bg-rose-600 {
  --mp-bg: #e11d48;
  --mp-fg: #fff;
}
.wms-document-date-short { display: none; }
.fbs-supply-date-main {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  max-width: 100%;
  min-width: 0;
  gap: .3rem;
  white-space: nowrap;
}
.wms-document-date-weekday {
  flex: 0 0 auto;
  margin: 0;
  white-space: nowrap;
}
.fbs-supply-market-state-source { display: inline; }
#fbs-supply-list .fbs-supply-composition-alert {
  display: inline-flex;
  box-sizing: border-box;
  height: 20px;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  max-width: none;
  padding: 0 8px;
  border-radius: 9999px;
  background: #ffe4e6;
  color: #be123c;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}
#fbs-supply-list .fbs-supply-composition-alert-icon {
  width: 10px;
  height: 10px;
  flex-basis: 10px;
}
#fbs-supply-list .fbs-after-print-notice {
  display: inline-flex;
  box-sizing: border-box;
  height: 20px;
  flex: 0 0 auto;
  align-items: center;
  gap: 4px;
  padding: 0 8px;
  border-radius: 9999px;
  background: #fef3c7;
  color: #92400e;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}
#fbs-supply-list .fbs-after-print-notice:hover {
  background: #fde68a;
  color: #78350f;
}
#fbs-supply-list .fbs-after-print-notice-icon {
  width: 10px;
  height: 10px;
  flex: 0 0 10px;
}
#fbs-supply-list .fbs-after-print-notice-copy {
  white-space: nowrap;
}
#fbs-supply-list .fbs-supply-fact {
  display: inline-flex;
  align-items: baseline;
  gap: .16rem;
  color: #475569;
  font-size: 11px;
  line-height: 1.15;
  white-space: nowrap;
}
#fbs-supply-list .fbs-supply-fact-row {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  white-space: nowrap;
}
#fbs-supply-list .fbs-supply-cancelled-during-pick {
  box-sizing: border-box;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  height: 18px;
  min-height: 18px;
  padding: 0 8px;
  border-radius: 9999px;
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
}
#fbs-supply-list .fbs-supply-fact-separator {
  color: #94a3b8;
  font-size: 11px;
  line-height: 1.15;
}
#fbs-supply-list .fbs-undelivered-order {
  display: flex;
  align-items: center;
  gap: 3px;
  color: #e11d48;
}
#fbs-supply-list .fbs-undelivered-order-icon {
  width: 10px;
  height: 10px;
  flex-basis: 10px;
}
/* #1845: несданный заказ склада партнёра — «не сдан · N дн.», склад, просьба площадки
   строками; иконка у первой строки. */
#fbs-supply-list .fbs-undelivered-order--partner { align-items: flex-start; }
#fbs-supply-list .fbs-undelivered-order--partner .fbs-undelivered-order-icon { margin-top: 2px; }
#fbs-supply-list .fbs-undelivered-order--partner .fbs-undelivered-order-copy {
  display: flex;
  flex-direction: column;
  min-width: 0;
  line-height: 1.2;
}
#fbs-supply-list .fbs-supply-handover-notice--desktop,
#fbs-supply-list .fbs-supply-alert-row { display: none; }
#fbs-supply-list .fbs-supply-cancelled-mobile { display: none; }
#fbs-supply-list .fbs-supply-undelivered {
  display: inline-flex;
  box-sizing: border-box;
  width: max-content;
  min-width: 16px;
  max-width: 100%;
  height: 16px;
  min-height: 16px;
  align-items: center;
  margin-top: 0;
  padding: 0 5px;
  gap: 2px;
  border: 1px solid #be123c;
  border-radius: 999px;
  background: #e11d48;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}
#fbs-supply-list a.fbs-supply-undelivered:hover {
  border-color: #be123c;
  background: #be123c;
  color: #fff;
}
#fbs-supply-list .fbs-undelivered-notice-icon {
  width: 10px;
  height: 10px;
  flex-basis: 10px;
}
@media (min-width: 641px) {
  #fbs-supply-list .fbs-supply-metrics {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .18rem;
  }
}
@media (min-width: 768px) {
  #fbs-supply-list .fbs-supply-handover-notice--desktop { display: block; }
}
@media (max-width: 767px) {
  #fbs-supply-list .fbs-supply-stock-alert-desktop { display: none !important; }
  #fbs-supply-list .fbs-supply-cancelled-mobile {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-end;
    margin-top: 2px;
    margin-bottom: 4px;
  }
  #fbs-supply-list .fbs-supply-alert-row {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    align-items: center;
    gap: 4px;
    flex-wrap: nowrap;
  }
  #fbs-supply-list .fbs-supply-alert-row > .fbs-after-print-notice {
    order: 10;
    margin-left: auto;
  }
  #fbs-supply-list .fbs-supply-alert-row > :is(
    .fbs-supply-undelivered,
    .fbs-supply-scanning,
    .fbs-supply-stock-alert
  ) {
    flex: 0 0 auto;
    margin-top: 0 !important;
    white-space: nowrap;
  }
}
@media (max-width: 640px) {
  /* Сигнал отмены после сборки обязан оставаться в мобильной строке поставки.
     Базовый desktop-гейт скрывает сам контейнер; здесь выпускаем его явно. */
  #fbs-supply-list .fbs-supply-alert-row {
    display: flex !important;
    justify-content: flex-end;
  }
  /* Служебные сигналы карточки образуют один компактный правый ряд. Desktop
     сохраняет прежние 20px; на mobile обе плашки имеют один ритм 10/16px. */
  #fbs-supply-list .fbs-supply-alert-row > .fbs-after-print-notice {
    height: 16px;
    min-height: 16px;
    margin-left: 0;
    padding: 0 5px;
    font-size: 10px;
    line-height: 10px;
  }
  #fbs-supply-list .fbs-supply-cancelled-mobile > .fbs-supply-composition-alert {
    display: inline-flex !important;
    height: 16px;
    min-height: 16px;
    gap: 2px;
    padding: 0 5px;
    font-size: 10px;
  }
  #fbs-supply-list .fbs-supply-cancelled-mobile > .fbs-supply-composition-alert .fbs-supply-composition-alert-icon {
    width: 10px;
    height: 10px;
    flex-basis: 10px;
  }
  /* Fallback для уже отданного локалкой DOM до Jinja auto-reload: если новой
     настоящей mobile-ячейки ещё нет, выпускаем каноническую плашку из desktop-
     состава. После появления нового узла `:not(:has(...))` сам гасит этот путь. */
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(.fbs-supply-cancelled-mobile))
    .fbs-supply-alert-row > .fbs-supply-composition-alert {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(.fbs-supply-cancelled-mobile))
    > td.fbs-supply-composition:has(.fbs-supply-composition-alert) {
    display: block !important;
    grid-column: 1 / -1;
    grid-row: 3;
    width: 100% !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(.fbs-supply-cancelled-mobile))
    > td.fbs-supply-composition:has(.fbs-supply-composition-alert) .fbs-supply-metrics {
    display: block !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(.fbs-supply-cancelled-mobile))
    > td.fbs-supply-composition:has(.fbs-supply-composition-alert) .fbs-supply-metrics > :not(.fbs-supply-composition-alert) {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(.fbs-supply-cancelled-mobile))
    > td.fbs-supply-composition:has(.fbs-supply-composition-alert) .fbs-supply-composition-alert {
    display: inline-flex !important;
    height: 16px;
    gap: 2px;
    padding: 0 5px;
    font-size: 10px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(.fbs-supply-cancelled-mobile))
    > td.fbs-supply-composition:has(.fbs-supply-composition-alert) .fbs-supply-composition-alert-icon {
    width: 10px;
    height: 10px;
    flex-basis: 10px;
  }
}
@media (min-width: 641px) and (max-width: 767px) {
  /* В промежуточной табличной раскладке сигнал остаётся видимым у времён:
     mobile-перенос не должен создавать немую зону между двумя breakpoint. */
  #fbs-supply-list .fbs-supply-tracking > .fbs-supply-stock-alert {
    display: inline-flex !important;
  }
}

/* ⭐ БЛЕДНАЯ фирменная подсветка БЛОКА канала (владелец 12.08: «блоки мп подсветить
   бледными фирменными цветами каналов, как это сделано в поставках»). Цвета — ТЕ ЖЕ
   фирменные, что у `.mpb-*` (один список площадок на систему), но лёгкой заливкой:
   блок опознаётся цветом, а текст остаётся обычным тёмным. Суффикс класса выводится
   из общего `mp_color` заменой префикса — своего списка каналов шаблон не заводит.
   ⚠️ Фон и рамка — одной парой (каскадное правило проекта). */
.mp-pane        { border-width:1px; }
.mp-pane-wb     { background:#faf7ff; border-color:#e4d8f1; }
.mp-pane-ozon   { background:rgba(0,91,255,.06);    border-color:rgba(0,91,255,.28); }
.mp-pane-mvideo { background:rgba(227,6,17,.05);    border-color:rgba(227,6,17,.25); }
.mp-pane-ym     { background:rgba(255,204,0,.10);   border-color:rgba(214,158,0,.45); }
.mp-pane-avito  { background:rgba(151,207,38,.10);  border-color:rgba(151,207,38,.45); }
.mp-pane-other  { background:rgba(100,116,139,.06); border-color:rgba(100,116,139,.28); }
.mp-pane-caret {
  display: inline-block;
  transform: rotate(-90deg);
  transition: transform .15s ease;
}
details[open] > summary .mp-pane-caret { transform: rotate(0); }

.repricer-channel-actions {
  display: flex;
  align-items: stretch;
  gap: 8px;
  margin-left: auto;
}
.repricer-channel-actions > a,
.repricer-channel-actions > button {
  flex: 0 0 auto;
}
.repricer-action-label-mobile { display: none; }
@media (max-width: 767px) {
  .repricer-ym-explanation {
    flex: 1 1 0;
    min-width: 0;
    line-height: 16px;
  }
  .repricer-channel-summary {
    flex-wrap: nowrap;
    gap: 4px;
    padding-right: 8px;
    padding-left: 8px;
  }
  .repricer-channel-model-prefix,
  .repricer-channel-count { display: none; }
  .repricer-channel-actions {
    flex: 0 0 auto;
    min-width: 0;
    width: auto;
    margin-left: auto;
  }
  .repricer-channel-actions--full {
    display: flex;
    gap: 4px;
  }
  .repricer-channel-actions--full > a,
  .repricer-channel-actions--full > button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 4px 8px;
    text-align: center;
    white-space: normal;
  }
  .repricer-channel-actions--full > button[data-be-btn] { font-size: 0; }
  .repricer-channel-actions--full > button[data-be-btn]::after {
    content: "БУ " attr(data-be-btn) "%";
    font-size: 11px;
    line-height: 1rem;
    white-space: nowrap;
  }
  .repricer-channel-actions--full > button[data-price-send-group] { font-size: 11px; }
  .repricer-action-label-wide { display: none; }
  .repricer-action-label-mobile {
    display: inline;
    white-space: nowrap;
  }
}

/* Перенесённое значение в пивотах цены клиента и СПП: наблюдение бывает только в дни
   с заказами, остальное — последнее известное. Приглушаем, чтобы факт и перенос не
   выглядели одинаково (курсив + бледнее, ячейка остаётся читаемой). */
.pcell-est { color:#94a3b8; font-style:italic; }

/* ── Смена цен на дашборде репрайсера (владелец 06.08.2026) ──
   Своими классами, а не утилитами Tailwind: сборка статическая, и класса, которого
   нет в app.css, браузер просто не увидит (грабли ловили трижды).
   Цена ниже безубытка ПОДСВЕЧИВАЕТСЯ, но не запрещается — на распродаже она
   осмысленна, решение за человеком. */
/* Направление предложенной цены (владелец 07.08): растёт — зелёное, падает — красное.
   ⚠️⚠️ Объявлены ПЕРЕД .px-below-be НАМЕРЕННО: специфичность одинаковая, поэтому
   побеждает то правило, что ниже. Убыток важнее направления — «цена ниже безубытка»
   должна краснеть даже у выросшей цены. Дописать их в конец файла = погасить подсветку
   убытка (тот же каскадный капкан, что уже гасил кнопку удаления и плашку [hidden]). */
.px-up   { border-color: #10b981; color: #047857; font-weight: 600; }
.px-down { border-color: #f43f5e; color: #be123c; font-weight: 600; }
.px-below-be {
  border-color: #f43f5e;
  background: #fff1f2;
  color: #be123c;
  font-weight: 600;
}
.px-sent {
  border-color: #34d399;
  background: #ecfdf5;
}
input[data-price-new].repricer-price-input {
  display: inline-block;
  width: 56px;
  min-width: 56px;
  height: 22px;
  min-height: 22px;
  padding: 1px 4px;
  border-radius: 5px;
  font-size: 11px;
  line-height: 12px;
  vertical-align: middle;
}
/* Кнопка «Поставить цены БУ» после нажатия: режим включён, и отправка канала пойдёт
   рабочей нижней границей, а не советом. Состояние обязано быть видно — иначе человек
   не отличит «поставил границу всем» от «отправляю советы» (владелец 13.08). */
.be-mode-on {
  border-color: #f59e0b;
  background: #fffbeb;
  color: #b45309;
  font-weight: 600;
}

/* ⭐⭐ Кликабельные цены «БУ РР 0%» / «БУ РР 10%» (владелец 25.08): нажатие ставит цену
   в поле строки. Кнопка обязана выглядеть как ЧИСЛО, а не как кнопка — иначе колонка
   цифр превратится в частокол рамок; поэтому фон и рамки нет, а «нажимаемость»
   показывает курсор и подчёркивание под наведением.
   ⚠️ `color: inherit` несущий: цвет ячейке задаёт колонка (у «БУ РР 10%» он красный,
   у «БУ РР 0%» серый), и своим цветом кнопка стёрла бы это различие — а оно значит
   «рабочая граница» против «справки». */
.be-pick {
  font: inherit;
  color: inherit;
  background: none;
  border: 0;
  padding: 0;
  cursor: pointer;
  text-decoration-line: underline;
  text-decoration-style: dotted;
  text-underline-offset: 2px;
  text-decoration-color: rgba(100, 116, 139, 0.45);
}
.be-pick:hover,
.be-pick:focus-visible {
  text-decoration-style: solid;
  text-decoration-color: currentColor;
}

/* ⭐⭐ Чипы-переключатели фильтров репрайсера: организация (по одной) и вариант тактик
   (владелец 25.08). Своим классом, а не утилитами: сборка Tailwind статическая.
   ⚠️ Сам radio скрыт `appearance:none` + нулевым размером, а НЕ `display:none`: скрытый
   через display элемент выпадает из последовательности фокуса, и фильтр переставал
   переключаться с клавиатуры. Обводку фокуса поэтому рисует сам чип (`:focus-within`). */
.org-chip {
  display: inline-flex; align-items: center;
  font-size: 12px; line-height: 1.1; padding: 4px 9px; border-radius: 6px;
  border: 1px solid #cbd5e1; background: #fff; color: #475569; cursor: pointer;
  user-select: none;
}
.org-chip:hover { border-color: #94a3b8; background: #f8fafc; }
.org-chip input { appearance: none; -webkit-appearance: none;
                  width: 0; height: 0; margin: 0; border: 0; outline: 0; }
.org-chip:focus-within { outline: 2px solid var(--ui-accent-line); outline-offset: 1px; }
/* выбранное — залито целиком: полутон читался бы как «не нажато» (урок фильтр-чипов
   в списке магазинов: отличие в 1% фона человек не видит) */
.org-chip-on {
  background: var(--ui-filter-active); border-color: var(--ui-filter-active); color: #fff; font-weight: 500;
}
.org-chip-on:hover { background: var(--ui-filter-active); border-color: var(--ui-filter-active); }
/* недоступный вариант (чужой вариант анализа у тактик): виден, но не нажимается —
   человек обязан понимать, ЧТО есть, а не гадать, куда делись тактики */
.org-chip-off { opacity: .55; cursor: not-allowed; }
.org-chip-off:hover { border-color: #cbd5e1; background: #fff; }

/* Репрайсер: тактики, канал и организация держат одну верхнюю ось. Плашка тактик
   следует содержимому; два коротких фильтра справа не переносятся на следующий ряд. */
.repricer-header-search {
  width: 18rem;
  flex: 0 0 18rem;
}
.ui-action.repricer-tactics-action {
  height: 36px;
  min-height: 36px;
  padding: 7px 12px;
  border-color: #cbd5e1;
  border-radius: 10px;
  background: #fff;
  color: #475569;
  font-size: 12.5px;
  line-height: 1.2;
}
.ui-action.repricer-tactics-action:hover {
  border-color: #94a3b8;
  background: #fff;
}
@media (max-width: 767px) {
  .repricer-header-actions { width: 100%; }
  .repricer-header-search {
    width: auto;
    min-width: 72px;
    max-width: 180px;
    flex: 1 1 72px;
    padding-right: 6px;
  }
  .repricer-header-actions :is(.repricer-calc-action, .ui-refresh-action, .repricer-tactics-action) {
    flex: 0 0 auto;
    height: 30px;
    min-height: 30px;
    padding: 0 8px;
    border-radius: 6px;
    font-size: 11px;
  }
  .repricer-header-actions .ui-refresh-action::before { display: none; }
  .repricer-header-actions .repricer-tactics-icon { display: none; }
}
.repricer-filter-row { align-items: flex-start; }
.repricer-tactics-filter {
  min-width: 0;
  flex: 0 1 auto;
}
.repricer-tactics-scroll {
  width: max-content;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
}
.repricer-tactics-list {
  box-sizing: border-box;
  width: max-content;
  height: var(--ui-dropdown-height);
  min-height: var(--ui-dropdown-height);
  flex-wrap: nowrap;
  padding-top: 0;
  padding-bottom: 0;
  font-size: .75rem;
  line-height: 1.25;
}
.repricer-tactics-list > label {
  flex: 0 0 auto;
  white-space: nowrap;
}
.repricer-tactics-filter > [data-tactic-variants] > .repricer-tactics-title {
  flex: 0 0 100%;
}
.repricer-tactics-filter > [data-tactic-variants] {
  row-gap: 0;
}
.repricer-fixed-filter { flex: 0 0 auto; }
@media (min-width: 768px) {
  .repricer-filter-row { flex-wrap: nowrap; }
  .repricer-period-summary { flex-wrap: nowrap; }
  .repricer-period-coverage { display: flex; min-width: 0; white-space: nowrap; }
  .repricer-period-coverage-count { flex: 0 0 auto; }
  .repricer-period-examples { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}
@media (max-width: 767px) {
  .repricer-tactics-filter { width: 100%; }
  /* Пустая строка `::after` делит варианты; row-gap дал бы вокруг неё ДВА зазора. */
  .repricer-tactics-filter > [data-tactic-variants] {
    column-gap: 8px;
    row-gap: 0;
    margin-bottom: -4px;
  }
  .repricer-tactics-filter > [data-tactic-variants] > button {
    margin-bottom: 4px;
  }
  .repricer-tactics-filter > [data-tactic-variants] > .repricer-tactics-title {
    order: 1;
    flex: 0 0 auto;
    margin-bottom: 4px;
  }
  .repricer-tactics-filter > [data-tactic-variants] > button[data-variant-window="3"] {
    order: 1;
  }
  .repricer-tactics-filter > [data-tactic-variants]::after {
    content: "";
    order: 2;
    height: 0;
    flex-basis: 100%;
  }
  .repricer-tactics-filter > [data-tactic-variants]
    > button:not([data-variant-window="3"]) {
    order: 3;
  }
  .repricer-tactics-scroll {
    width: 100%;
    margin-top: 4px;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
  }
  .repricer-tactics-scroll::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }
  .repricer-tactics-list {
    min-width: calc(100% + 24px);
  }
  .repricer-filter-row {
    margin-bottom: 4px;
  }
  .repricer-period-summary {
    column-gap: 8px;
    row-gap: 2px;
    padding: 4px 8px;
    line-height: 16px;
  }
  .repricer-period-main { width: 100%; gap: 4px; }
  .repricer-period-label { font-size: 11px; line-height: 16px; }
  .repricer-period-dates { font-size: 12px; line-height: 16px; }
  .repricer-period-main > .help {
    width: 12px;
    height: 12px;
    min-width: 12px;
    margin-left: 0;
    font-size: 9px;
  }
}

/* Альбомный телефон: подробное описание уже доступно в `?` верхней шапки, а
   короткий ряд фаз помещается целиком — не тратим высоту и не создаём ложный свайп. */
@media (orientation: landscape) and (max-width: 1366px) and (hover: none),
       (orientation: landscape) and (max-width: 1366px) and (any-pointer: coarse) {
  .repricer-page-title,
  .repricer-intro {
    display: none !important;
  }
  .repricer-tactics-filter {
    flex: 1 1 auto;
  }
  .repricer-tactics-scroll {
    width: 100%;
    max-width: none;
    overflow-x: visible;
  }
  .repricer-tactics-list {
    width: 100%;
    min-width: 0;
  }
}

.repricer-price-bar[hidden] { display: none; }
.repricer-price-bar {
  width: max-content;
  max-width: 100%;
  margin-inline: auto;
  flex-wrap: nowrap;
  gap: 12px;
  padding: 8px 12px;
}
.repricer-price-bar__hint {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 2px;
  font-size: 11px;
  line-height: 13px;
}
.repricer-price-bar__hint > span {
  display: block;
  white-space: nowrap;
}
.repricer-price-bar > [data-price-send] {
  flex: 0 0 auto;
  white-space: nowrap;
}
.repricer-price-bar > [data-price-count]:empty,
.repricer-price-bar > [data-price-note]:empty {
  display: none;
}
@media (max-width: 767px) {
  .repricer-price-bar {
    width: 100%;
    flex-wrap: nowrap;
  }
  /* На телефоне блок отправки цен прокручивается вместе со страницей. */
  .repricer-price-bar.stick-under-top {
    position: static;
    top: auto;
    bottom: auto;
  }
  .repricer-price-bar__hint > span { white-space: normal; }
}

/* Разбор решения репрайсера: две колонки «что → значение», раскрывается кликом
   по скидке. Свой класс, а не grid-cols-* Tailwind: сборка статическая. */
.why-grid {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: .35rem 1rem;
  max-width: 60rem;
}
/* ⭐ Разбор живёт ПОД своей строкой товара и без неё не показывается (владелец 29.09:
   «развернул подсказку и свернул кабинет — она остаётся развёрнутой ниже»). Товар прячет
   аккордеон магазина КЛАССОМ `hidden` (row-accordion.js), а разбор открыт АТРИБУТОМ
   (repricer-prices.js): знаки разные, и аккордеон о разборе не знает — ему и не надо,
   механизм общий. ⭐ Правило по соседству, а не скриптом: верно при ЛЮБОМ пути
   сворачивания (клик, восстановление после перезагрузки, фильтр), а раскрыли магазин
   снова — разбор стоит там, где его оставили. Пару «товар → разбор» держат и сортировка,
   и фильтры (`table-sort.js`, `row-filter.js`), поэтому соседство надёжно. */
.repricer-head-wrap > tbody > tr.hidden + tr.why-row { display: none; }
/* ── Скрепки вложений поставки (владелец 07.08) ──────────────────────────────
   Клик по скрепке сразу СКАЧИВАЕТ документ (вниз не мотаем); скрепки различаются
   номером (бейдж снизу-справа) и цветом по циклу из 6; ✕ сверху-справа — удаление
   (только can_manage). Кнопка «Загрузить» — компактная, без лишнего текста;
   перетаскивание файлов на неё работает (общий data-dropzone).
   ⚠️ Классы СВОИ: произвольных цветовых утилит нет в статической сборке Tailwind. */
/* ⭐ Ряд значков документов — С ПЕРЕНОСОМ (владелец 21.08, боевой скрин строки
   SH-FBW-2026-00050: четыре скрепки не помещались и вылезали из колонки — ✕ удаления
   налезал на поле даты соседней ячейки и обрезался её краем).
   ⚠️ `min-width:0` обязателен: без него flex-элемент не даёт колонке сжаться и ряд
   снова растягивает её вширь вместо переноса. Отступ строки-строке — `row-gap`. */
.doc-row { display: flex; flex-wrap: wrap; align-items: center;
  gap: .3rem .25rem; min-width: 0; }
/* Мобильный экземпляр документов рендерится рядом с действиями FBM/FBS, но на
   desktop обязан исчезать. Семантический класс сильнее случайного порядка
   `.doc-row {display:flex}` и утилиты `md:hidden` из загруженного раньше app.css. */
@media (min-width: 768px) {
  .wms-document-icons--mobile { display: none !important; }
}

/* В строках «Документы» крупнее только внутренний знак; desktop-рамки сохраняют
   28×28px, а mobile-рамки FBM/FBS ниже сведены к единым 34×34px. */
.wms-document-icons .ui-icon,
.wms-document-icons .ui-product-label-icon {
  width: 20px;
  height: 20px;
}
.wms-document-icons .mpfile-dot {
  width: 13px;
  height: 13px;
}
.wms-document-icons .att-clip-icon {
  width: 18px;
  height: 18px;
  flex-basis: 18px;
}

/* ⚠️ Скрепка держит СВОЙ бейдж и ✕ ВНУТРИ габарита (21.08). Раньше номер висел на
   -0.3rem снизу-справа, а ✕ на -0.4rem сверху-справа: у крайнего значка оба выходили
   за границу ячейки, при переносе — наезжали на соседний ряд, и колонка «Документы»
   читалась как облепленная точками. Внутренние углы ничего не режут и не наезжают. */
.att-clip { position: relative; display: inline-flex; align-items: center;
  justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: .375rem;
  border: 1px solid; font-size: .875rem; flex: 0 0 auto; text-decoration: none; }
.att-clip.att-lg { width: 2.5rem; height: 2.5rem; font-size: 1.125rem; }
.att-clip-icon { width: 14px; height: 14px; flex-basis: 14px; }
.att-clip.att-lg .att-clip-icon { width: 18px; height: 18px; flex-basis: 18px; }
.party-inline-clip-link { display: inline-flex; align-items: center; gap: 2px; }
.party-inline-clip-icon { width: 12px; height: 12px; flex-basis: 12px; }
.att-no { position: absolute; bottom: -1px; right: -1px; min-width: 13px;
  height: 13px; padding: 0 2px; border-radius: 9999px; color: #fff; font-size: 9px;
  line-height: 13px; text-align: center;
  box-shadow: 0 0 0 1.5px #fff; }
.att-c0 { border-color: #cbd5e1; background: #f8fafc; } .att-c0 .att-no { background: #64748b; }
.att-c1 { border-color: #a5b4fc; background: #eef2ff; } .att-c1 .att-no { background: #6366f1; }
.att-c2 { border-color: #7dd3fc; background: #f0f9ff; } .att-c2 .att-no { background: #0ea5e9; }
.att-c3 { border-color: #fcd34d; background: #fffbeb; } .att-c3 .att-no { background: #f59e0b; }
.att-c4 { border-color: #6ee7b7; background: #ecfdf5; } .att-c4 .att-no { background: #10b981; }
.att-c5 { border-color: #fda4af; background: #fff1f2; } .att-c5 .att-no { background: #f43f5e; }
.att-clip:hover { filter: brightness(0.96); }
/* ✕ удаления — В ВЕРХНЕМ УГЛУ СКРЕПКИ, не снаружи (21.08). Он же появляется только
   при наведении на скрепку: в спокойном списке ряд читается значками и номерами, а не
   гроздью красных точек (боевой скрин 21.08 — четыре ✕ рядом с четырьмя номерами).
   ⚠️ На тач-экране hover не наступает — там ✕ виден всегда (`@media (hover: none)`),
   иначе документ с телефона стало бы нечем удалить. */
.att-del-form { position: absolute; top: -1px; right: -1px; margin: 0; line-height: 0;
  opacity: 0; transition: opacity .12s; pointer-events: none; }
.att-clip-wrap:hover .att-del-form,
.att-del-form:focus-within { opacity: 1; pointer-events: auto; }
@media (hover: none) { .att-del-form { opacity: 1; pointer-events: auto; } }
.att-del { width: 14px; height: 14px; border-radius: 9999px; background: #f43f5e;
  color: #fff; font-size: 10px; line-height: 13px; text-align: center; display: block;
  padding: 0; border: 0; cursor: pointer; box-shadow: 0 0 0 1.5px #fff; }
.att-del:hover { background: #e11d48; }
.att-upload-form { display: inline-flex; margin: 0; }
.att-upload { display: inline-flex; align-items: center; height: 1.75rem; padding: 0 .5rem;
  border: 1px dashed var(--ui-accent); border-radius: .375rem; font-size: .75rem; color: #475569;
  cursor: pointer; background: #fff; white-space: nowrap; }
.att-upload.att-lg { height: 2.5rem; }
/* В списке поставок загрузка документов одинакова на ПК и телефоне. */
#ship-list .att-upload {
  box-sizing: border-box;
  height: 1.125rem;
  min-height: 1.125rem;
  max-height: 1.125rem;
}
/* ⭐ Кнопка загрузки — своей строкой под иконками документов (владелец 07.08). В одном
   ряду со значками она тянула колонку вширь: значков до шести, а она шириной с три.
   `flex` (не inline-flex) + отступ сверху; ширина по содержимому, не на всю ячейку. */
/* ⚠️ `flex-basis:100%` — чтобы кнопка встала своей строкой и ВНУТРИ ряда значков
   (мобильная ячейка «Действие»): там форма сама является флекс-элементом, и без этого
   она вклинивалась между скрепками. У ПК-варианта родитель не флекс — свойство там
   попросту игнорируется, поведение не меняется. */
.att-upload-row { display: flex; margin-top: .25rem; flex-basis: 100%; }
.att-upload-row .att-upload { flex: 0 0 auto; }
.att-upload:hover, .att-upload-form.dropzone-over .att-upload { background: #f1f5f9; border-color: var(--ui-accent-hover); }

/* ── Вторичная кнопка панели Ozon (владелец 07.08: «почему кнопки еле заметны, и
   вообще не кнопки, а текст???»). Действия «обновить грузоместа», «перевыпустить
   этикетки», смена типа грузомест были подчёркнутым мелким серым текстом — человек
   дважды не находил их и просил «сделать чётко».
   ⚠️ Класс СВОЙ: сборка Tailwind статическая, и набор нужных утилит там неполон
   (тот же капкан, что уже ловили с md:table-header-group и sm:hidden). */
.oz-sec {
  display: inline-flex; align-items: center; gap: .25rem;
  padding: .25rem .625rem; border-radius: .375rem;
  border: 1px solid #cbd5e1; background: #fff; color: #334155;
  font-size: .75rem; line-height: 1.1; white-space: nowrap; cursor: pointer;
}
.oz-sec:hover { background: #f1f5f9; border-color: #94a3b8; color: #0f172a; }
.oz-sec:disabled { opacity: .5; cursor: default; }

/* ── Вкладки СКЛАДА ОТГРУЗКИ в разделе FBS (владелец 2026-08-07) ──────────────
 *
 * «Вкладка маркетплейса, вкладка склада и только потом чипы со статусами» +
 * «названия склада отгрузки должны быть заметнее и крупнее».
 *
 * ЗАЧЕМ. Склад — это ГДЕ кладовщик стоит; он важнее площадки, к которой человек уже
 * пришёл, и тем более важнее стадии. Раньше это был мелкий ряд чипов ПОД стадиями
 * (11px подпись «СКЛАД:», 12px значения) — читалось как второстепенный фильтр.
 *
 * ⚠️⚠️ Свои классы, а НЕ утилиты: сборка Tailwind статическая, `border-b-4` и `-mb-0.5`
 * в `app.css` отсутствуют — вкладка молча осталась бы плоской. Пятый случай капкана.
 */
.wh-tabs { display:flex; gap:.125rem; margin-bottom:.5rem; overflow-x:auto;
  border-bottom:1px solid #e2e8f0; }
.wh-tab { display:inline-flex; align-items:center; gap:.35rem; white-space:nowrap;
  padding:.45rem .65rem .4rem; font-size:.82rem; font-weight:400; color:#64748b;
  border-bottom:2px solid transparent; margin-bottom:-1px; text-decoration:none; }
.wh-tab:hover { background:#f8fafc; }
/* Активная остаётся вкладкой, а не конкурирующей с действиями крупной кнопкой. */
.wh-tab-on, .wh-tab-on:hover { color:var(--ui-accent); font-weight:500; background:transparent;
  border-bottom-color:var(--ui-accent); }
.wh-tab-n { color:#94a3b8; font-weight:400; }
.wh-tab-on .wh-tab-n { color:var(--ui-accent); }
/* ⭐ Кнопки правки количества в «Расчёте поставки» (владелец 08.08).
   ⚠️ СВОЙ класс, а не утилиты Tailwind: сборка статическая, и нужных размерных
   вариантов в app.css попросту нет — правило молча не сработало бы (капкан, уже
   стоивший нам `sm:hidden`, `md:table-header-group` и `right-4`). */
.qe-btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 20px; height: 21px; padding: 0 3px;
  border: 1px solid #cbd5e1; border-radius: 5px;
  background: #fff; color: #475569;
  font-size: 10px; line-height: 1; white-space: nowrap; cursor: pointer;
}
.qe-btn:hover { background: #f1f5f9; border-color: #94a3b8; color: #0f172a; }
.qe-btn:disabled { opacity: .4; cursor: default; }

/* ⭐⭐ РОВНЫЙ СТОЛБИК полей количества в черновике поставки (владелец 08.08: «сделай ровный
   столбик»). Подписи «было N» и «Ozon: N» имеют РАЗНУЮ ширину («было 149» против «было 5»,
   а у части строк их нет вовсе) — стоя между кнопками, они сдвигали поле ввода на каждой
   строке по-своему. Фиксированная ширина слева от кнопок ставит их в одну вертикаль.
   ⚠️ СВОЙ класс, а не утилиты: сборка Tailwind статическая, и нужного набора там нет —
   правило молча не сработало бы (капкан `sm:hidden`, `md:table-header-group`, `right-4`). */
.qty-notes {
  display: inline-flex; flex-direction: column; align-items: flex-end;
  justify-content: center; gap: 1px; width: 120px; flex: 0 0 120px;
  overflow: hidden; white-space: nowrap; line-height: 1.25;
}
@media (max-width: 767px) {            /* на телефоне колонок нет — место дороже вертикали */
  .qty-notes { width: auto; flex: 0 1 auto; }
}

/* ⭐ Срок сборки FBS-задания (владелец 08.08: «знать протухание или опоздания»).
   Свои классы, а не утилиты Tailwind: сборка статическая, и нужных сочетаний в
   app.css нет — правило молча не сработало бы (капкан ловили пять раз). */
.fbs-dl { display:inline-flex; box-sizing:border-box; align-items:center;
          height:1.25rem; min-height:1.25rem; padding:0 .5rem; border-radius:9999px;
          font-size:.75rem; font-weight:500; line-height:1; white-space:nowrap; }
.fbs-dl-ok   { height:auto; min-height:0; padding:0; border-radius:0; color:#475569; } /* времени достаточно */
.fbs-dl-soon { background:#fef3c7; color:#92400e; }    /* меньше 4 часов */
.fbs-dl-late { background:#fee2e2; color:#b91c1c; }    /* уже опоздали */

@media (max-width: 767px) {
  /* Финальное правило стоит после общего `.fbs-dl`: иначе его поздний размер
     снова делал «Срок» крупнее «Сдачи» на одной и той же карточке. */
  table.fbs-orders-table.responsive.responsive-compact
    .fbs-order-schedule-values .fbs-dl-value {
    font-size: 10px;
  }
  table.fbs-orders-table.responsive.responsive-compact
    .fbs-order-schedule-values .fbs-dl-ok,
  table.fbs-orders-table.responsive.responsive-compact
    .fbs-order-handover strong {
    color: #64748b;
    font-size: .72rem;
    font-weight: 600;
    line-height: 1.2;
  }

}

/* ⭐⭐ «ИДЁТ ЗАПРОС» У ПАНЕЛИ ПОСТАВКИ OZON (владелец 10.08: «не видно, грузит или нет»).
   Панель ходит к площадке и по кнопке, и сама (автоопрос раз в 3 секунды). Крутящийся
   кружок в разметке при этом выглядит ОДИНАКОВО — и когда запрос летит, и когда всё
   встало. Полоска бежит поверх панели РОВНО пока открыт fetch, поэтому по ней видно
   правду, а не намерение.
   ⚠️ Свой класс, а не утилиты Tailwind: сборка статическая, нужного набора в app.css нет —
   правило молча не сработало бы (капкан ловился многократно). */
.oz-busy { position: relative; }
.oz-busy::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px;
  border-radius: 2px; z-index: 5;
  background: linear-gradient(90deg, transparent, #4f46e5 45%, #4f46e5 55%, transparent);
  background-size: 40% 100%; background-repeat: no-repeat;
  animation: oz-busy-run 1.1s linear infinite;
}
@keyframes oz-busy-run {
  from { background-position: -40% 0; }
  to   { background-position: 140% 0; }
}

/* ⭐⭐ ТРИ СПОСОБА ОТПРАВКИ КРОСС-ДОКА — РАЗДЕЛЕНЫ ЦВЕТОМ (владелец 11.08: «сделай так,
   чтобы было наглядно, чтобы они были разделены цветами»). Раньше все три цены сидели
   одной строкой через «·», победитель — жирным: чтобы сравнить, приходилось вчитываться.

   Правило чтения: ЦВЕТ говорит про СПОСОБ (он закреплён навсегда и совпадает со значком),
   РАМКА и галочка — про ВЫБОР системы. Порядок способов на экране фиксированный
   (`crossdock.СПОСОБЫ`), поэтому цена каждого всегда стоит на своём месте.

   ⚠️ Свои классы, а не утилиты Tailwind: сборка статическая, нужных сочетаний (ring-*
   выбранных оттенков) в app.css нет — правило молча не сработало бы. */
.xdock { display:flex; flex-wrap:wrap; align-items:center; gap:.25rem; }
.xdock-way {
  display:inline-flex; align-items:baseline; gap:.3rem; white-space:nowrap;
  padding:.15rem .45rem; border-radius:.375rem; border:1px solid transparent;
  font-size:11px; line-height:1.4;
}
.xdock-boxes  { background:#e0f2fe; color:#075985; }   /* короба        — голубой */
.xdock-pallet { background:#fef3c7; color:#92400e; }   /* палета        — янтарный */
.xdock-bop    { background:#e0e7ff; color:#3730a3; }   /* короба на палете — индиго */
/* выбранный способ: тот же цвет, но в рамке и жирный; отвергнутые приглушены, чтобы
   выбор читался мгновенно, а цены отвергнутых всё равно оставались на виду */
.xdock-best { border-color:currentColor; font-weight:700; }
.xdock-way:not(.xdock-best) { opacity:.65; }
.xdock-save { color:#047857; font-weight:600; }

/* ⭐⭐ ВМЕСТИМОСТЬ ПАЛЕТЫ ПО КАНАЛАМ — СТРОКА НА КАНАЛ (владелец 11.08: «нужно писать в
   столбик — в строке слева направо один канал, количество (назначаем), далее штук/вес/
   объём считается»). Прежняя сетка из пяти полей рвала каналы на два ряда, и сравнить их
   между собой было нельзя.
   Колонки: канал · ввод · три расчётных числа. Числа выровнены по правому краю — так
   разряды стоят друг под другом и разница видна без чтения.
   ⚠️ Свой класс, а не утилиты Tailwind: нужной раскладки колонок в статической сборке
   app.css нет — правило молча не сработало бы (капкан ловился многократно). */
.pkg-pallet-grid {
  display:grid; align-items:center; gap:.5rem;
  grid-template-columns:minmax(72px,1fr) minmax(96px,150px) repeat(3, minmax(56px,.8fr));
}
.pkg-pallet-head {
  font-size:11px; color:#94a3b8; text-transform:uppercase; letter-spacing:.02em;
  padding-bottom:.25rem; border-bottom:1px solid #e2e8f0; margin-bottom:.35rem;
}
.pkg-pallet-row { padding:.15rem 0; }
.pkg-pallet-row + .pkg-pallet-row { border-top:1px solid #f1f5f9; }
.pkg-pallet-mp { font-size:13px; font-weight:600; color:#334155; }
.pkg-pallet-num { font-size:12px; color:#64748b; text-align:right; font-variant-numeric:tabular-nums; }
/* На узком экране таблица не помещается: канал и ввод в первой строке, числа под ними. */
@media (max-width: 640px) {
  .pkg-pallet-grid { grid-template-columns:minmax(72px,1fr) minmax(96px,1fr) repeat(3, 1fr); }
  .pkg-pallet-head span:nth-child(n+3) { font-size:10px; }
}

/* ── Липкая шапка канала на дашборде репрайсера (владелец 17.08) ──────────────
 * «Эту часть приклеивать к шапке при прокрутке, чтобы видеть названия колонок»:
 * <summary> блока канала липнет под #topnav (высота из --topnav-h, тот же принцип,
 * что .stick-under-top), под неё JS (sticky-thead.js) подвозит заголовки таблицы.
 * ⚠️ Фирменная заливка mp-pane-* полупрозрачная (rgba) — прилипшая шапка просвечивала
 * бы строками. Подкладываем белый, а тот же оттенок кладём градиентом ПОВЕРХ:
 * background-image переживает шорткат `background:` в mp-pane-*, потому что эти
 * правила стоят ниже по файлу и специфичнее. z-25: ниже #topnav (40) и выпадашек,
 * выше сдвинутого thead и липкой первой колонки таблиц. */
summary.mp-pane-sticky {
  position: -webkit-sticky;
  position: sticky;
  top: var(--topnav-h, 0px);
  z-index: 25;
  background-color: #fff;
}
@media (max-width: 767px),
       (orientation: landscape) and (max-width: 1366px) and (hover: none),
       (orientation: landscape) and (max-width: 1366px) and (any-pointer: coarse) {
  summary.mp-pane-sticky {
    position: static;
  }
}
summary.mp-pane-sticky.mp-pane-wb     { background-image: linear-gradient(#faf7ff, #faf7ff); }
summary.mp-pane-sticky.mp-pane-ozon   { background-image: linear-gradient(rgba(0,91,255,.06),    rgba(0,91,255,.06)); }
summary.mp-pane-sticky.mp-pane-mvideo { background-image: linear-gradient(rgba(227,6,17,.05),    rgba(227,6,17,.05)); }
summary.mp-pane-sticky.mp-pane-ym     { background-image: linear-gradient(rgba(255,204,0,.10),   rgba(255,204,0,.10)); }
summary.mp-pane-sticky.mp-pane-avito  { background-image: linear-gradient(rgba(151,207,38,.10),  rgba(151,207,38,.10)); }
summary.mp-pane-sticky.mp-pane-other  { background-image: linear-gradient(rgba(100,116,139,.06), rgba(100,116,139,.06)); }

/* Сдвинутый thead обязан ПЕРЕКРЫВАТЬ строки и их липкую первую колонку (z-index 1):
 * transform уже даёт stacking context, position нужен только ради z-index. */
table[data-sticky-thead] > thead { position: relative; z-index: 5; }
/* ⭐⭐⭐ Шапку двигает АНИМАЦИЯ ОТ ПРОКРУТКИ страницы — в том же кадре, что и сама прокрутка
 * (владелец 29.09: «мерцание»; сдвиг из обработчика `scroll` отстаёт на кадр). Ход
 * размечает sticky-thead.js переменными: `from`/`to` — прокрутка документа, на которой
 * шапка поехала и доехала до низа таблицы, `max` — сколько она проехала. Анимация
 * линейная, `to − from = max` — шапка идёт 1:1 со строками. Класс ставит скрипт только
 * там, где браузер это умеет; иначе — прежний сдвиг присваиванием. Разбор — шапка
 * sticky-thead.js. */
@keyframes sticky-thead-pin {
  from { transform: translateY(0); }
  to { transform: translateY(var(--sticky-thead-max, 0px)); }
}
table[data-sticky-thead] > thead.sticky-thead-scroll-driven {
  animation: sticky-thead-pin auto linear both;
  animation-timeline: scroll(root block);
  animation-range: var(--sticky-thead-from, 0px) var(--sticky-thead-to, 1px);
}
/* ⭐ Липкая строка группы (магазин репрайсера, владелец 21.09) — её сдвигает тот же
 * sticky-thead.js. Она обязана ПЕРЕКРЫВАТЬ товары, по которым едет: свой слой выше строк
 * и липкой первой колонки (1), но ниже шапки (5), и непрозрачный фон у КАЖДОЙ ячейки —
 * фон самой строки при transform под ячейками не рисуется (капкан шапки 27.08, ниже). */
table[data-sticky-thead] > tbody > tr[data-sticky-group] { position: relative; z-index: 3; }
table[data-sticky-thead] > tbody > tr[data-sticky-group] > td { background-color: inherit; }

/* ⭐⭐⭐ ФОН — НА САМИХ ЯЧЕЙКАХ ШАПКИ, А НЕ НА `thead` (боевая жалоба владельца 27.08:
   «при прокрутке вверх шапка с заголовками не фиксируется» + «числа БУ не кликаются»).
   ⛔⛔ ЭТО ОДИН ДЕФЕКТ, А НЕ ДВА. Фон стоял утилитой `bg-slate-50` на `<thead>`, но при
   `transform` фон группы строк НЕ рисуется под ячейками: шапка ехала ПРОЗРАЧНОЙ и
   накладывалась на строки — на скриншоте владельца заголовки и цифры слиплись. Человек
   читал это как «шапка не фиксируется», а клик по цене под ней попадал в `<th>`
   (проба стендом 27.08: `elementFromPoint` возвращал TH, кнопка `data-be-pick` до
   обработчика не доходила). Непрозрачный фон ячеек чинит и вид, и клики разом.
   ⚠️ `!important` не нужен: утилита `bg-slate-50` висит на `thead`, а не на `th`.
   ⚠️ Первая колонка красится своим правилом `sticky-first` (та же серая заливка) —
   здесь только остальные ячейки. */
table[data-sticky-thead] > thead th { background-color: var(--repricer-head-bg, var(--ui-surface-muted)); }
table[data-sticky-thead] > thead.ui-table-head th {
  background-color: var(--ui-surface-muted);
}

/* ⛔⛔⛔ ТРЕТИЙ ЗАХОД НА ОДНУ ЖАЛОБУ (владелец 27.08 и снова 28.08: «шапка всё равно
   просвечивает»). Разбор 28.08 показал, что ВТОРАЯ правка была основана на неверной
   посылке и не работала вовсе:
   ⛔ Написано было «действует браузерное умолчание `border-collapse: separate`». Это
     НЕВЕРНО: Tailwind в своём preflight ставит `table { border-collapse: collapse }`
     (проверено в собранном `static/app.css`), а `separate` включается только классом
     `.border-separate`, которого у этих таблиц нет. При `collapse` свойство
     `border-spacing` игнорируется ЦЕЛИКОМ — то есть строка ниже ничего не делала.
   ⚠️ Урок общий: правило, объяснённое «браузерным умолчанием», надо сверять с
     СОБРАННЫМ css — preflight фреймворка умолчания и переписывает.

   ⭐⭐⭐ ЛЕЧИМ НЕ ЩЕЛЬ, А САМ КЛАСС ПРОБЛЕМЫ. Точную дырку без браузера не измерить, а
   гадать по скриншоту третий раз нельзя. Поэтому вместо охоты за конкретным просветом
   даём шапке СПЛОШНУЮ непрозрачную подложку своим слоем: `::before` растянут на всю
   ячейку с запасом в 1px по кругу и закрывает и стыки границ при `collapse`, и любые
   субпиксельные щели от дробного `translateY`.
   ⛔⛔ ПОДЛОЖКОЙ `::before` ПОВЕРХ ЯЧЕЙКИ ЧИНИТЬ НЕЛЬЗЯ, хотя это первое, что просится:
   часть заголовков — ГОЛЫЙ ТЕКСТ прямо в `th` («Скорость, шт/день», «Орг · канал»), а
   текстовый узел нельзя поднять над слоем правилом `> *`. Он ушёл бы ПОД подложку, и
   шапка стала бы пустой серой полосой. Отрицательный `z-index` тоже не годится: слой
   уходит за фон ПРЕДКОВ, то есть за саму розовую панель канала.

   ⭐ Правильное лечение — закрыть щели ГРАНИЦАМИ ТОГО ЖЕ ЦВЕТА, что фон ячейки. При
   `collapse` соседние границы схлопываются в одну линию, и просвета между ячейками не
   остаётся вовсе; ширину колонок это не двигает (граница уже была, менялся только цвет
   у части ячеек).
   ⚠️ Вертикальные разделители групп (`border-l border-slate-200`) сохраняются: они
   объявлены утилитой на конкретных `th` и специфичнее этого правила.
   ⛔ Красим ТОЛЬКО верхнюю кромку: нижнюю границу шапки (`border-b border-slate-200`
   на `<tr>`) трогать нельзя — это видимая линия, отделяющая заголовки от данных, и
   съев её, мы починили бы просвет ценой слипшейся шапки. */
table[data-sticky-thead] > thead th { border-top: 1px solid var(--repricer-head-bg, var(--ui-surface-muted)); }

/* `sticky-first` по умолчанию красит угол серым. У репрайсера первая ячейка должна
   продолжать цвет площадки и в исходной таблице, и в мобильной копии шапки (у копии
   намеренно нет `data-sticky-thead`, поэтому признак здесь — общий класс таблицы). */
table.sticky-first.repricer-head-wrap > thead > tr:not(:first-child) > th:first-child {
  background-color: var(--repricer-head-bg, var(--ui-surface-muted));
}
table.sticky-first.repricer-head-wrap > thead > tr:first-child > th:first-child {
  background-color: var(--repricer-head-bg, var(--ui-surface-muted));
}

/* ⭐⭐⭐ ОБЩИЕ ДИАЛОГИ СИСТЕМЫ — ВЫШЕ ЛЮБОГО ОКНА РАЗДЕЛА (владелец 19.08: «подтверждение
   на заднем фоне появляется»).

   Боевой случай: окно «Товар уехал, а склад не списан» (раздел FBS) и общий
   `appConfirm` объявлены с ОДНИМ z-50, но диалоги системы лежат в `base.html` ВЫШЕ
   блока content — то есть РАНЬШЕ в DOM. При равном z-index побеждает тот, кто позже,
   и подтверждение уходило под затемнение окна раздела: человек видел серую плашку,
   на которую нельзя нажать.

   ⛔ Чиним в ОБЩЕМ каркасе, а не в окне FBS: та же беда ждала любую пару «модалка
   раздела + data-confirm внутри неё» (у поставок это `#rep-modal`, тоже z-50).
   ⚠️ 70 — выше и модалок разделов (50), и тостов (60); подсказки `.help` (100)
   остаются сверху намеренно: они не перекрывают кнопки, а объясняют их.
   ⚠️ Своим классом, а не утилитой Tailwind: сборка статическая, и класса `z-[70]`
   в ней нет вовсе — правило молча не применилось бы. */
.dialog-top { z-index: 70; }

/* ── Компактная диагностическая «Сверка» контент-монитора (владелец 22.08) ────
 * 133+ замера одной обычной таблицей превращали страницу в длинную простыню: 14px текст,
 * вертикальные padding и перенос «не нарушитель» удваивали высоту части строк.
 * Один общий класс держит все таблицы страницы в одинаковом плотном ритме; длинные ленты
 * прокручиваются внутри ограниченной области с липкой шапкой, строки при этом не скрыты.
 * Свой CSS нужен потому, что статическая Tailwind-сборка не содержит max-height для этого
 * экрана, а inline-style запрещён CSP.
 */
.hash-eval-table {
  font-size: 11px;
  line-height: 1.15;
  font-variant-numeric: tabular-nums;
}
.hash-eval-table th,
.hash-eval-table td {
  padding: .15rem .45rem;
  vertical-align: middle;
  white-space: nowrap;
}
.hash-eval-scroll {
  max-height: 32rem;
  overflow: auto;
  border: 1px solid #e2e8f0;
  border-radius: .25rem;
  overscroll-behavior: contain;
}
.hash-eval-scroll > .hash-eval-table { min-width: 100%; border: 0; }
.hash-eval-scroll > .hash-eval-table > thead {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--ui-surface-muted);
}
.hash-eval-thumb { width: 2rem; height: 2rem; }
@media (max-width: 640px) {
  .hash-eval-table { font-size: 10px; }
  .hash-eval-table th,
  .hash-eval-table td { padding: .125rem .35rem; }
  .hash-eval-scroll { max-height: 26rem; }
}

/* ── Плашки/плитки каналов «Просмотра данных» (владелец 23.08).
   Палитра площадок — та же, что у бейджей .mpb-*; классы вместо inline style,
   потому что CSP запрещает style-атрибуты (страж test_security_headers). ── */
.mp-tile-wb     { background-color: #fbeaf5; border-color: #e3c3da; }
.mp-tile-ozon   { background-color: #e8f0ff; border-color: #bdd2f7; }
.mp-tile-ym     { background-color: #fff8e1; border-color: #f0dfa0; }
.mp-tile-mvideo { background-color: #ffecec; border-color: #f2bcbc; }
.mp-tile-other  { background-color: #ffffff; border-color: #e2e8f0; }
.mp-ink-wb      { color: #8a0c74; }
.mp-ink-ozon    { color: #003d99; }
.mp-ink-ym      { color: #7a5a00; }
.mp-ink-mvideo  { color: #9b1c1c; }
.mp-ink-other   { color: #1e293b; }

/* ── DATA-витрины на страницах каналов (ПКТ-5): три оттенка разреза на палитре
   площадки — канал темнее, кластер базовый, склад светлее. Классы вместо inline
   style: CSP запрещает style-атрибуты (и прежняя секция обходила стража скрыто). ── */
.mv-tile-wb-channel     { background-color: #f3c8de; border-color: #dca5c4; }
.mv-tile-wb-cluster     { background-color: #fbeaf5; border-color: #e3c3da; }
.mv-tile-wb-warehouse   { background-color: #fdf3f9; border-color: #eedce6; }
.mv-tile-ozon-channel   { background-color: #cfdcff; border-color: #92b2f0; }
.mv-tile-ozon-cluster   { background-color: #e8f0ff; border-color: #bdd2f7; }
.mv-tile-ozon-warehouse { background-color: #f4f8ff; border-color: #dae5f8; }
.mv-tile-ym-channel     { background-color: #f7e8b3; border-color: #dfc372; }
.mv-tile-ym-cluster     { background-color: #fff8e1; border-color: #f0dfa0; }
.mv-tile-ym-warehouse   { background-color: #fffcf0; border-color: #f4ead0; }
.mv-tile--cluster       { background-color: #ffffff; border-color: #e2e8f0; }

/* Общие компактные UI-компоненты для рабочих экранов. Они не зависят от структуры
   конкретной страницы: документы, действия, статус и выбор сотрудника должны
   выглядеть одинаково в FBS, поставках, остатках и следующих разделах WMS. */
.ui-icon-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border: 1px solid var(--ui-accent-line);
  border-radius: .55rem;
  background: #fff;
  color: var(--ui-accent);
  box-shadow: 0 1px 1px rgb(15 23 42 / 3%);
  transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}
.ui-icon-button:hover {
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
}
.ui-icon-button.is-disabled {
  border-color: #e8edf3;
  background: #f8fafc;
  color: #cbd5e1;
  box-shadow: none;
  cursor: default;
}
.ui-icon-button.is-disabled:hover {
  border-color: #e8edf3;
  background: #f8fafc;
  color: #cbd5e1;
}
.ui-icon-button--compact {
  width: 1.75rem;
  height: 1.75rem;
  border-radius: .42rem;
}
.ui-icon-button.is-print-loading { position: relative; }
.ui-icon-button.is-print-loading > * { visibility: hidden; }
.ui-icon-button.is-print-loading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  box-sizing: border-box;
  width: 12px;
  height: 12px;
  margin: -6px 0 0 -6px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: ui-print-spin .7s linear infinite;
}
@keyframes ui-print-spin { to { transform: rotate(360deg); } }
.ui-icon {
  width: 1rem;
  height: 1rem;
  pointer-events: none;
}
.ui-doc-icon {
  display: inline-block;
  flex: 0 0 auto;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
}
.ui-doc-icon--pick-list {
  -webkit-mask-image: url("/static/checklist.svg?v=1");
  mask-image: url("/static/checklist.svg?v=1");
}
.ui-doc-icon--order-labels {
  -webkit-mask-image: url("/static/qrsquare.svg?v=1");
  mask-image: url("/static/qrsquare.svg?v=1");
}
.ui-doc-icon--supply-barcode {
  -webkit-mask-image: url("/static/barcodescan.svg?v=1");
  mask-image: url("/static/barcodescan.svg?v=1");
}
.ui-doc-icon--pallet-labels {
  -webkit-mask-image: url("/static/palletlabel.svg?v=1");
  mask-image: url("/static/palletlabel.svg?v=1");
}
.ui-doc-icon--cargo-labels {
  -webkit-mask-image: url("/static/labelbox.svg?v=1");
  mask-image: url("/static/labelbox.svg?v=1");
}
.ui-action-icon {
  display: inline-block;
  width: .95rem;
  height: .95rem;
  flex: 0 0 auto;
  vertical-align: -.16rem;
  pointer-events: none;
}
.ui-action-icon.ui-check-icon--compact {
  width: .72rem;
  height: .72rem;
  vertical-align: -.12rem;
}
.ui-check-mark,
.ui-check-before::before {
  display: inline-block;
  width: .72rem;
  height: .72rem;
  flex: 0 0 .72rem;
  background-color: currentColor;
  -webkit-mask: url("/static/check.svg?v=1") center / contain no-repeat;
  mask: url("/static/check.svg?v=1") center / contain no-repeat;
  vertical-align: -.1rem;
}
.ui-check-before::before {
  content: "";
  margin-right: .28rem;
}
.ui-system-icon {
  display: inline-block;
  width: .95rem;
  height: .95rem;
  flex: 0 0 .95rem;
  background-color: currentColor;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  pointer-events: none;
}
.ui-system-icon--box {
  -webkit-mask-image: url("/static/boxclean.svg?v=1");
  mask-image: url("/static/boxclean.svg?v=1");
}
.ui-system-icon--camera {
  -webkit-mask-image: url("/static/photo-camera.svg?v=1");
  mask-image: url("/static/photo-camera.svg?v=1");
}
.ui-system-icon--money {
  -webkit-mask-image: url("/static/coin.svg?v=1");
  mask-image: url("/static/coin.svg?v=1");
}
.ui-system-icon--fire {
  -webkit-mask-image: url("/static/fire.svg?v=1");
  mask-image: url("/static/fire.svg?v=1");
}
.ui-system-icon--alarm {
  -webkit-mask-image: url("/static/alarm.svg?v=1");
  mask-image: url("/static/alarm.svg?v=1");
}
.ui-system-icon--clip {
  background-color: #4f46e5;
  -webkit-mask-image: url("/static/paperclip1.svg?v=1");
  mask-image: url("/static/paperclip1.svg?v=1");
}
.ui-system-icon--edit {
  -webkit-mask-image: url("/static/pencil.svg?v=1");
  mask-image: url("/static/pencil.svg?v=1");
}
.ui-system-icon--search {
  -webkit-mask-image: url("/static/search.svg?v=1");
  mask-image: url("/static/search.svg?v=1");
}
.ui-system-icon--refresh {
  -webkit-mask-image: url("/static/refresh.svg?v=1");
  mask-image: url("/static/refresh.svg?v=1");
}
.ui-system-icon--delete {
  -webkit-mask-image: url("/static/bin.svg?v=1");
  mask-image: url("/static/bin.svg?v=1");
  -webkit-mask-size: 82% 82%;
  mask-size: 82% 82%;
}
.ui-system-icon--check {
  -webkit-mask-image: url("/static/check.svg?v=1");
  mask-image: url("/static/check.svg?v=1");
}
.ui-system-icon--arrow {
  -webkit-mask-image: url("/static/right-arrow.svg?v=1");
  mask-image: url("/static/right-arrow.svg?v=1");
}
.ui-system-icon--calendar {
  -webkit-mask-image: url("/static/calendar.svg?v=1");
  mask-image: url("/static/calendar.svg?v=1");
}
.ui-system-icon--issue {
  -webkit-mask-image: url("/static/exclamation-mark.svg?v=1");
  mask-image: url("/static/exclamation-mark.svg?v=1");
}
.ui-system-icon--delivery {
  -webkit-mask-image: url("/static/express-delivery.svg?v=1");
  mask-image: url("/static/express-delivery.svg?v=1");
}
.ui-system-icon--scissors {
  -webkit-mask-image: url("/static/scissors.svg?v=1");
  mask-image: url("/static/scissors.svg?v=1");
}
.ui-system-icon--tactics {
  -webkit-mask-image: url("/static/tactics.svg?v=1");
  mask-image: url("/static/tactics.svg?v=1");
}
.ui-system-icon--no-sale {
  -webkit-mask-image: url("/static/no-sale.svg?v=1");
  mask-image: url("/static/no-sale.svg?v=1");
}
.ui-system-icon.returns-inline-money-icon {
  width: .75rem;
  height: .75rem;
  flex-basis: .75rem;
  vertical-align: -.1rem;
}
.ui-system-icon.returns-inline-fire-icon {
  width: .7rem;
  height: .7rem;
  flex-basis: .7rem;
  vertical-align: -.05rem;
}
.returns-parenthetical { opacity: .5; }
.giveout-btn {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
}
.returns-ozon-summary-main,
.returns-ozon-summary-shops,
.returns-ozon-summary-shop,
.returns-giveout-scope {
  display: inline-flex;
  align-items: center;
}
.returns-ozon-summary-main { gap: .25rem; }
.returns-ozon-summary-shops {
  gap: .75rem;
  margin-left: .75rem;
  text-transform: none;
}
.returns-ozon-summary-shop { gap: .35rem; }
.returns-giveout-scope {
  position: relative;
  gap: .3rem;
}
.returns-giveout-compact {
  width: 28px;
  height: 24px;
  padding: 0;
  justify-content: center;
  color: #7c3aed;
  border-color: #c4b5fd;
}
.returns-giveout-compact:hover {
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
  border-color: var(--ui-accent);
}
.returns-pickup-card:has(.returns-giveout-result--compact) {
  overflow: visible;
  z-index: 5;
}
.returns-giveout-result--compact {
  position: absolute;
  z-index: 20;
  top: calc(100% + 6px);
  left: 50%;
  display: flex;
  width: 216px;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 10px 11px 8px;
  transform: translateX(-50%);
  border: 1px solid var(--ui-border-strong);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .14);
  color: var(--ui-text);
  text-align: left;
  text-transform: none;
}
.returns-ozon-summary-shop:first-child .returns-giveout-result--compact {
  left: 0;
  transform: none;
}
.returns-ozon-summary-shop:last-child .returns-giveout-result--compact {
  right: 0;
  left: auto;
  transform: none;
}
.returns-giveout-result--compact > img {
  width: 192px;
  height: 52px;
  object-fit: contain;
}
.returns-giveout-result-footer {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 2px;
}
.returns-giveout-result-footer > .font-mono { font-size: 12px; }
.returns-giveout-result-footer > a { font-size: 11px; }
.returns-giveout-result--loading {
  align-items: flex-start;
  color: var(--ui-text-soft);
  font-size: 11px;
}
.returns-giveout-result--bad { color: #e11d48; }
details[data-fold="ozon-pickup"][open] .returns-ozon-summary-shops { display: none; }
.ui-location-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  color: #7c3aed;
}
.box-pick-location-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
}
.ui-location-icon .ui-action-icon {
  width: .9rem;
  height: .9rem;
  fill: currentColor;
  stroke: none;
  vertical-align: 0;
}
.ui-location-icon .ui-action-icon circle {
  fill: #fff;
  stroke: none;
}
.wms-pick-location {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: .22rem;
  color: #475569;
  white-space: nowrap;
}
.wms-pick-location-check {
  color: #94a3b8;
  font-size: .78rem;
  font-weight: 700;
  line-height: 1;
}
/* В FBM факт сбора уже показан количеством и действиями строки: дополнительная
   галочка перед геометкой только отнимает ширину в обоих видах сборки. */
#ship-list .wms-pick-location-check { display: none; }
.wms-pick-location-pin { order: 2; }
.wms-pick-location-value {
  order: 3;
  min-width: 0;
}
:is(#ship-list, #fbs-supply-list) .wms-pick-location-qty {
  color: #7c3aed;
}
.ui-barcode {
  color: #94a3b8;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: .65rem;
  font-weight: 400;
  line-height: 1.2;
}
.unit-barcode-column {
  width: 8.5rem;
  text-align: left !important;
  white-space: nowrap;
}
.unit-barcode-content {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.unit-barcode-label {
  display: none;
  color: #94a3b8;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
}
@media (max-width: 767px) {
  #ship-list .unit-barcode-label {
    display: inline;
  }
}
.fbs-order-status-hold {
  color: #b45309;
  font-weight: 650;
}
.fbs-pick-btn,
#fbs-supply-list td[data-label="Действия"] button {
  align-items: center;
  gap: .3rem;
}
.fbs-pick-btn {
  display: inline-flex;
}
.fbs-pack-workflow {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  gap: .35rem;
}
.fbs-pack-actions-spacer {
  flex: 0 0 1.75rem;
  width: 1.75rem;
}
.fbs-pick-exception {
  border-color: var(--ui-accent-line);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
  box-shadow: none;
}
.fbs-pack-order-label {
  align-self: center;
}
.fbs-unpick-workflow {
  order: 3;
}
.fbs-pick-exception + .fbs-pack-direct {
  margin-left: 0 !important;
}
#fbs-supply-list td[data-label="Действия"] button:has(.ui-action-icon),
#fbs-supply-list td[data-label="Действия"] button:has(.ui-system-icon) {
  display: inline-flex;
}
.ui-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  border: 1px solid transparent;
  font-weight: 500;
  line-height: 1;
  white-space: nowrap;
  transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}
.ui-action--regular {
  gap: .42rem;
  height: var(--ui-control-height-regular);
  min-height: var(--ui-control-height-regular);
  padding: .38rem .62rem;
  border-radius: var(--ui-control-radius-regular);
  font-size: .78rem;
  font-weight: 500;
  line-height: 1.1;
}
.ui-action--compact {
  height: var(--ui-control-height-compact);
  min-height: var(--ui-control-height-compact);
  padding: .2rem .55rem;
  border-radius: var(--ui-control-radius-compact);
  font-size: .7rem;
}
.ui-action--outline {
  border-color: var(--ui-accent);
  background: #fff;
  color: var(--ui-accent-hover);
  box-shadow: 0 1px 2px rgb(55 48 163 / 10%);
}
.ui-action--outline:hover:not(:disabled) {
  border-color: var(--ui-accent-hover);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
}
.ui-action--emphasis {
  border-color: var(--ui-accent-line);
  background: #e4e5fb;
  color: var(--ui-accent-hover);
  box-shadow: 0 1px 2px rgb(55 48 163 / 10%);
}
.ui-action--emphasis:hover:not(:disabled) {
  border-color: #aaaef0;
  background: #d9dbf8;
  color: #3730a3;
}
.ui-action--outline:disabled {
  color: #6862a9;
  opacity: .78;
  cursor: not-allowed;
}
.ui-action-count {
  min-width: 1.15rem;
  padding-left: .42rem;
  border-left: 1px solid rgb(79 70 229 / 28%);
  color: inherit;
  font-size: .72rem;
  font-weight: 700;
  text-align: center;
}
.ui-action--primary {
  border-color: var(--ui-accent);
  background: var(--ui-accent);
  color: #fff;
  box-shadow: 0 1px 2px rgb(55 48 163 / 18%);
}
.ui-action--primary:hover:not(:disabled) {
  border-color: var(--ui-accent-hover);
  background: var(--ui-accent-hover);
}
.box-merge-action {
  border-color: #334155;
  background: #334155;
  box-shadow: 0 1px 2px rgb(15 23 42 / 18%);
}
.box-merge-action:hover:not(:disabled) {
  border-color: #1e293b;
  background: #1e293b;
}
.box-layout-editor-title .ui-action-icon {
  width: 1.08rem;
  height: 1.08rem;
}
.box-layout-editor-summary-row {
  display: inline-flex;
  width: calc(100% - 1.1rem);
  min-width: 0;
  align-items: flex-start;
  gap: .7rem;
  vertical-align: top;
}
.box-layout-editor-title {
  flex: 0 0 auto;
  white-space: nowrap;
}
.box-layout-editor[open] .box-layout-editor-title {
  align-items: flex-start;
  font-size: .75rem;
  line-height: 1.15;
}
.box-layout-editor[open] .box-layout-editor-title-text {
  line-height: 1.15;
}
.box-layout-editor[open] .box-layout-editor-title-text > span {
  display: block;
}
.box-layout-editor-hint {
  display: block;
  min-width: 0;
  flex: 1 1 auto;
  align-self: center;
  color: #8b95a7;
  font-size: .68rem;
  font-weight: 400;
  line-height: 1.3;
}
.box-layout-editor:not([open]) {
  display: inline-block;
  width: fit-content;
  max-width: 100%;
  margin-bottom: .5rem !important;
  border-radius: .5rem;
}
.box-layout-editor:not([open]) > summary {
  padding: .3rem .55rem !important;
  font-size: .7rem;
  line-height: 1.1;
}
.box-layout-editor:not([open]) .box-layout-editor-summary-row {
  width: auto;
  align-items: center;
  gap: .35rem;
}
.box-layout-editor:not([open]) .box-layout-editor-title .ui-action-icon {
  width: .88rem;
  height: .88rem;
}
.box-layout-editor,
.box-layout-editor > summary,
.box-layout-editor-body {
  box-sizing: border-box;
  width: 100%;
}
.box-layout-editor {
  display: block;
}
.box-layout-editor > summary {
  display: list-item;
}
.box-layout-editor-body {
  display: flex;
  clear: both;
  align-items: flex-end;
  gap: .75rem;
  flex-wrap: wrap;
}
.box-layout-editor-form {
  display: flex;
  flex: 0 0 auto;
  flex-wrap: nowrap;
  align-items: center;
  gap: .375rem;
}
.box-layout-editor-form label {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  white-space: nowrap;
}
.box-layout-editor-form input[type="number"] {
  box-sizing: border-box;
  width: 3rem;
  margin: 0;
}
.box-layout-editor-reset {
  flex: 0 0 100%;
}
@media (min-width: 768px) {
  .box-layout-editor[open] {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: start;
  }
  .box-layout-editor[open] > summary {
    grid-column: 1;
    grid-row: 1;
    width: auto;
    padding-right: 1.25rem !important;
  }
  .box-layout-editor[open] > summary .box-layout-editor-summary-row {
    width: auto;
  }
  .box-layout-editor[open] > .box-layout-editor-body {
    display: grid;
    grid-column: 2;
    grid-row: 1;
    grid-template-columns: max-content minmax(0, 1fr);
    width: auto;
    align-items: end;
    column-gap: 2rem;
    row-gap: 0;
    padding-top: .5rem !important;
    padding-left: 0 !important;
    border-top: 0;
  }
  .box-layout-editor[open] > .box-layout-editor-body > .box-layout-editor-form {
    grid-column: 1;
  }
  .box-layout-editor[open] > .box-layout-editor-body > .box-layout-editor-hint {
    grid-column: 2;
  }
  .box-layout-editor[open] > .box-layout-editor-body > .box-layout-editor-reset {
    grid-column: 1 / -1;
  }
}
@media (max-width: 767px) {
  .pick-view-switch:has(.pick-view-switch__layout-editor) {
    flex-wrap: nowrap !important;
    gap: .25rem !important;
  }
  .pick-view-switch:has(.pick-view-switch__layout-editor) .pick-view-label-long {
    display: none;
  }
  .pick-view-switch:has(.pick-view-switch__layout-editor) .pick-view-switch__guidance {
    display: none;
  }
  .pick-view-switch:has(.pick-view-switch__layout-editor) .pick-view-switch__layout-editor {
    margin-left: auto;
  }
  .pick-view-switch:has(.box-layout-editor[open]) {
    flex-wrap: wrap !important;
  }
  .box-layout-editor-title-layout-word {
    display: none;
  }
  .box-layout-editor[open] .box-layout-editor-title {
    align-items: center;
  }
  .box-layout-editor[open] .box-layout-editor-title-text {
    line-height: inherit;
  }
  .box-layout-editor[open] .box-layout-editor-title-text > span {
    display: inline;
  }
  .box-layout-editor[open] > summary {
    padding-bottom: .25rem !important;
  }
  .box-layout-editor[open] > .box-layout-editor-body {
    padding-top: 0 !important;
    border-top: 0;
  }
}
.box-clean-icon {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  object-fit: contain;
  opacity: .62;
}
.box-pick-table-wrap {
  width: 100%;
  max-width: none;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: .65rem;
  background: #fff;
}
.box-pick-cabinet-warning {
  box-sizing: border-box;
  display: block;
  min-width: 0;
  width: 100%;
  max-width: 100%;
  padding: 8px 12px;
  border: 1px solid #fda4af;
  border-radius: 8px;
  background: #fff1f2;
  color: #9f1239;
  font-size: 14px;
  line-height: 20px;
  overflow-wrap: anywhere;
  white-space: normal;
}
.box-pick-cabinet-warning--compact {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  column-gap: 8px;
  padding: 6px 8px;
  font-size: 12px;
  line-height: 16px;
  cursor: pointer;
}
.box-pick-cabinet-warning--compact > .wms-cabinet-fix-heading {
  display: flex;
  grid-column: 1 / -1;
  min-width: 0;
  align-items: baseline;
  gap: 4px;
  font-weight: 700;
  list-style: none;
  cursor: pointer;
}
.box-pick-cabinet-warning--compact > .wms-cabinet-fix-heading::-webkit-details-marker {
  display: none;
}
.wms-cabinet-fix-toggle {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 3px;
  white-space: nowrap;
}
.wms-cabinet-fix-chevron {
  display: inline-flex;
  width: 16px;
  height: 16px;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  line-height: 16px;
  transform-origin: center;
  transition: transform .15s ease;
}
.box-pick-cabinet-warning--compact[open] .wms-cabinet-fix-chevron {
  transform: rotate(90deg);
}
.box-pick-cabinet-warning--compact:not([open]) > :is(
  .wms-cabinet-fix-body,
  .wms-cabinet-fix-footer
) {
  display: none;
}
.box-pick-cabinet-warning--compact[open] > .wms-cabinet-fix-body {
  display: block;
  grid-column: 1 / -1;
  box-sizing: border-box;
  min-width: 0;
  width: 100%;
}
.wms-cabinet-fix-list {
  display: grid;
  gap: 2px;
  margin-top: 4px;
}
.wms-cabinet-fix-item {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 2px 8px;
  padding-top: 2px;
  border-top: 1px solid rgb(253 164 175 / 45%);
}
.wms-cabinet-fix-target {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: baseline;
  gap: 5px;
  white-space: nowrap;
}
.wms-cabinet-fix-target > b { color: #334155; }
.wms-cabinet-fix-count { color: #475569; }
.wms-cabinet-fix-cargo {
  color: #64748b;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 11px;
}
.wms-cabinet-fix-ops {
  display: inline-flex;
  min-width: 0;
  flex: 1 1 320px;
  flex-wrap: wrap;
  gap: 2px 10px;
}
.wms-cabinet-fix-op {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0 4px;
}
.wms-cabinet-fix-op > b { font-size: 14px; }
.wms-cabinet-fix-op strong {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-weight: 650;
}
.wms-cabinet-fix-op--remove { color: #be123c; }
.wms-cabinet-fix-op--add { color: #047857; }
.wms-cabinet-fix-footer {
  display: flex;
  grid-column: 1 / -1;
  grid-row: 3;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  margin-top: 4px;
  color: #64748b;
  font-size: 10px;
  line-height: 14px;
  text-align: right;
  white-space: nowrap;
}
.wms-cabinet-fix-confirm {
  box-sizing: border-box;
  height: var(--ui-control-height-compact);
  flex: 0 0 auto;
  padding: 0 8px;
  font: inherit;
  line-height: var(--ui-control-height-compact);
  white-space: nowrap;
}
.box-pick-unresolved-heading {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: .2rem .35rem;
  padding: 4px 8px;
  font-size: 11px;
  line-height: 13px;
}
.box-pick-unresolved-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
.box-pick-unresolved-count {
  flex: 0 0 auto;
  white-space: nowrap;
}
.box-pick-unresolved-boxes {
  width: auto;
}
.box-pick-unresolved-table {
  width: 100%;
  table-layout: fixed;
}
.box-pick-unresolved-col-article {
  width: 190px;
}
.box-pick-unresolved-col-boxes {
  width: 170px;
}
.box-pick-unresolved-col-actions {
  width: 330px;
}
.box-pick-unresolved-actions {
  overflow: visible;
}
.box-pick-unresolved-table td {
  padding-top: 4px;
  padding-bottom: 4px;
  font-size: 12px;
  line-height: 16px;
}
@media (min-width: 641px) {
  .box-pick-unresolved-deficit > div {
    display: inline;
    margin-left: 4px;
    font-size: inherit;
    line-height: inherit;
  }
  .box-pick-unresolved-deficit > div::before { content: "· "; }
}
@media (max-width: 640px) {
  #ship-list .fbm-shipment-card:has(.box-pick-unresolved-panel) {
    padding-bottom: 0 !important;
  }
  .fbm-shipment-card .box-pick-unresolved-panel {
    box-sizing: border-box;
    width: calc(100% + 1.5rem);
    max-width: none;
    margin-right: -.75rem;
    margin-left: -.75rem;
  }
  .box-pick-unresolved-heading {
    flex-wrap: nowrap;
    gap: 3px;
    font-size: 10px;
    line-height: 12px;
    white-space: nowrap;
  }
  .box-pick-unresolved-heading > .box-pick-unresolved-label {
    flex: 0 1 auto;
    white-space: nowrap;
  }
  .box-pick-unresolved-heading > .help {
    margin-left: 0;
  }
  .box-pick-unresolved-table,
  .box-pick-unresolved-table > tbody {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
  }
  .box-pick-unresolved-table > colgroup {
    display: none;
  }
  .box-pick-unresolved-table > tbody > tr {
    display: grid;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr) 120px;
    column-gap: 8px;
    row-gap: 2px;
    padding: 6px 8px 2px;
  }
  .box-pick-unresolved-table > tbody > tr > td {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding: 0 !important;
    text-align: left !important;
    white-space: normal !important;
  }
  .box-pick-unresolved-article {
    grid-column: 1;
    grid-row: 1;
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .box-pick-unresolved-table td.box-pick-unresolved-deficit {
    grid-column: 1;
    grid-row: 2;
    font-size: 10px;
    line-height: 10px;
  }
  .box-pick-unresolved-table td.box-pick-unresolved-deficit > div {
    font-size: inherit;
    line-height: inherit;
  }
  .box-pick-unresolved-table td.box-pick-unresolved-boxes {
    grid-column: 1;
    grid-row: 3;
    font-size: 10px;
    line-height: 10px;
  }
  .box-pick-unresolved-actions {
    grid-column: 2;
    grid-row: 1 / 4;
    align-self: center;
  }
  .box-pick-unresolved-actions .wms-shortage-controls {
    display: grid;
    width: 100%;
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
    gap: 4px;
  }
  .box-pick-unresolved-actions .wms-shortage-controls > :is(button, form),
  .box-pick-unresolved-actions .wms-shortage-controls > form > button {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    margin: 0;
  }
  .box-pick-unresolved-actions .wms-shortage-controls > button,
  .box-pick-unresolved-actions .wms-shortage-controls > form > button {
    border-radius: .45rem;
  }
  .box-pick-unresolved-actions .wms-shortage-action {
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    max-height: var(--ui-control-height-compact);
    padding: 0 6px;
    font-size: 10px;
    line-height: 1;
    white-space: nowrap;
  }
  .box-pick-unresolved-actions .wms-shortage-controls > form .wms-shortage-action {
    font-size: 9px;
  }
}
.fbm-shipment-card .box-pick-flow--flush-top > .box-pick-table-wrap:first-child {
  margin-top: -.75rem;
  border-top: 0;
}
.fbm-shipment-card .box-pick-flow--flush-bottom > .box-pick-table-wrap:last-child {
  margin-bottom: -.75rem;
}
@media (min-width: 768px) {
  .fbm-shipment-card .box-pick-flow--desktop-flush-bottom > .box-pick-table-wrap {
    margin-bottom: -.75rem;
  }
}
.fbm-shipment-card .box-pick-table-wrap {
  width: calc(100% + 1.5rem);
  margin-right: -.75rem;
  margin-left: -.75rem;
  border-right: 0;
  border-left: 0;
  border-radius: .65rem;
}
.box-pick-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}
.box-pick-table col.box-pick-col-box { width: 12%; }
.box-pick-table col.box-pick-col-product { width: 20%; }
.box-pick-table col.box-pick-col-location { width: 20%; }
.box-pick-table col.box-pick-col-take { width: 8%; }
.box-pick-table col.box-pick-col-label { width: 12%; }
.box-pick-table col.box-pick-col-action { width: 28%; }
.box-pick-table th {
  padding: .3rem .55rem;
  border-bottom: 1px solid #e5e7eb;
  background: #f8fafc;
  color: #8b95a7;
  font-size: .58rem;
  font-weight: 650;
  line-height: 1.15;
  letter-spacing: .045em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}
.box-pick-table td {
  min-width: 0;
  padding: .34rem .55rem;
  border-bottom: 1px solid #eef0f4;
  color: #596579;
  font-size: .72rem;
  line-height: 1.28;
  vertical-align: middle;
  overflow-wrap: anywhere;
}
.box-pick-loose-box-cell {
  vertical-align: top !important;
}
.box-pick-loose-identity {
  color: #475569;
  font-size: 11px;
  font-weight: 700;
  line-height: 14px;
}
.box-pick-loose-identity .help {
  display: inline-flex;
  width: 14px;
  height: 14px;
  margin-left: 3px;
  padding: 0;
  font-size: 9px;
  vertical-align: middle;
}
.box-pick-table tbody tr:last-child td {
  border-bottom: 0;
}
@media (min-width: 641px) {
  .box-pick-table-wrap {
    border-bottom: 0;
  }
  .box-pick-table tbody tr:last-child td {
    border-bottom: 1px solid #e2e8f0;
  }
}
.box-pick-take-head,
.box-pick-take-cell {
  text-align: left !important;
}
.box-pick-label-head,
.box-pick-label-cell {
  text-align: center !important;
}
.box-pick-label-cell .unit-print-btn {
  border-color: #e2e8f0;
  color: #9ca3af;
}
.box-pick-label-cell .unit-print-btn:hover {
  border-color: var(--ui-accent);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
}
.box-pick-action-head,
.box-pick-action-cell {
  text-align: right !important;
}
.box-pick-group-row td {
  padding: .28rem .55rem;
  border-bottom-color: #e2e8f0;
  background: #f8fafc;
  color: #475569;
  font-size: .68rem;
  text-align: center;
}
.box-pick-group-row b,
.box-pick-group-meta,
.box-pick-group-warning {
  margin-right: 0;
}
.box-pick-group-content {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .2rem .45rem;
  line-height: 1.2;
}
.box-pick-group-title {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  line-height: 1.2;
}
.box-pick-pallet-icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  background: currentColor;
  -webkit-mask: url('/static/pallet.svg') center / contain no-repeat;
  mask: url('/static/pallet.svg') center / contain no-repeat;
}
.box-pick-group-meta {
  display: inline-flex;
  align-items: center;
  color: #94a3b8;
  line-height: 1.2;
}
.box-pick-group-warning {
  display: inline-flex;
  align-items: center;
  color: #d97706;
  line-height: 1.2;
}
/* FBM: строка палеты — единая читаемая нейтральная шапка, а не бледный набор
   подписей. Оба экрана используют один шаблон и обязаны выглядеть одинаково. */
#ship-list .box-pick-group-row td {
  vertical-align: middle;
  border-top: 1px solid #cbd5e1;
  border-bottom-color: #cbd5e1;
  background: #edf1f5;
  color: #334155;
}
.returns-pickup-group-row > td {
  vertical-align: middle;
  border-top: 1px solid var(--ui-border);
  border-bottom-color: var(--ui-border);
  background: var(--ui-surface-subtle);
  color: var(--ui-text);
}
.returns-pickup-group-layout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: .75rem;
}
.returns-pickup-group-today {
  display: inline-flex;
  flex: 0 0 auto;
  margin-left: auto;
  color: #0f172a;
  font-weight: 400;
  white-space: nowrap;
}
#ship-list .box-pick-group-content,
.returns-pickup-group-row .box-pick-group-content {
  align-items: center;
}
#ship-list .box-pick-group-content > :is(.box-pick-group-title, .box-table-label-pair, .box-table-badge, .box-pick-group-meta, .box-pick-group-warning),
.returns-pickup-group-row .box-pick-group-content > :is(.box-pick-group-title, .box-table-badge, .box-pick-group-meta, .box-pick-group-warning) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
#ship-list .box-pick-group-content .box-pick-group-title,
.returns-pickup-group-row .box-pick-group-title {
  color: #334155;
}
#ship-list .box-pick-group-content .box-pick-group-meta,
.returns-pickup-group-row .box-pick-group-meta {
  color: #64748b;
  font-weight: 500;
}
#ship-list .box-pick-group-content .box-table-badge--violet {
  background: #e2e8f0;
  color: #475569;
  box-shadow: inset 0 0 0 1px #cbd5e1;
}
.box-pick-row--box-start td {
  border-top: 1px solid #cbd5e1;
}
:is(.box-pick-table, .fbm-box-layout-table)
  .box-pick-row + .box-pick-row:not(.box-pick-row--box-start) td {
  border-top: 1px solid #eef0f4;
}
@media (min-width: 641px) {
  .box-pick-table .box-pick-box-cell {
    padding-bottom: .34rem;
  }
  .box-pick-table .box-table-box__picker-row {
    width: 100%;
  }
  .box-pick-table .box-pick-box-cell--has-next {
    border-bottom: 1px solid #94a3b8;
  }
  :is(.box-pick-table, .fbm-box-layout-table)
    .box-pick-row:has(+ .box-pick-row--box-start) td {
    border-bottom: 1px solid #94a3b8;
  }
  :is(.box-pick-table, .fbm-box-layout-table)
    .box-pick-row + .box-pick-row--box-start td {
    border-top: 1px solid #94a3b8;
  }
  .box-pick-table .box-pick-box-card--has-next > .box-pick-row:last-child td {
    border-bottom: 1px solid #94a3b8;
  }
  .box-pick-table .box-pick-box-card--has-next + .box-pick-box-card
    > .box-pick-row--box-start td {
    border-top: 1px solid #94a3b8;
  }
  .box-pick-table .box-pick-box-card:has(> .box-pick-missing-row)
    .box-pick-box-cell {
    border-bottom-color: #94a3b8;
  }
  .box-pick-table .box-pick-box-card > .box-pick-missing-row:last-child td {
    border-bottom: 1px solid #94a3b8;
  }
}
:is(.fbm-shipment-status-picking, .fbs-supply-status-picking)
  :is(
    .box-pick-row--done td:not(.box-pick-box-cell),
    .box-pick-box-cell:has(.box-table-box--done)
  ) {
  background: #fbfaff;
}
.box-pick-row--pending td {
  padding-top: .12rem;
  padding-bottom: .12rem;
}
.box-table-box {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: .12rem;
}
.box-table-box__heading {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: .3rem;
  white-space: nowrap;
}
.box-table-box__title {
  display: inline-flex;
  min-width: 0;
  align-items: center;
  gap: .3rem;
  color: #334155;
  font-size: .78rem;
  line-height: 1.15;
}
.box-table-box__meta {
  padding-left: 0;
  color: #b7bfca;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}
.box-table-box__meta,
.fbm-box-layout-quantum {
  font-size: .65rem;
  line-height: 1.15;
}
/* ⭐⭐ 04.09: чей это короб. Короб — единица ответственности (назначается целиком),
   поэтому имя стоит прямо в его шапке, а не только общим списком у документа.
   Кегль как у метрик рядом: подпись справочная, номер короба остаётся главным. */
.box-table-box__picker {
  padding-left: 0;
  color: #64748b;
  font-size: .65rem;
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.box-table-box__badges {
  display: flex;
  flex-wrap: wrap;
  gap: .12rem;
  padding-left: 1.3rem;
}
.box-table-label-pair {
  display: inline-flex;
  align-items: center;
  gap: .12rem;
  white-space: nowrap;
}
.box-table-box__traits {
  display: inline-flex;
  flex: 0 0 100%;
  align-items: center;
  gap: 2px;
  white-space: nowrap;
}
.box-table-badge {
  padding: .08rem .26rem;
  border-radius: .25rem;
  background: #f1f5f9;
  color: #64748b;
  font-size: .56rem;
  line-height: 1.2;
  white-space: nowrap;
}
.box-table-badge--violet { background: #f3f0ff; color: #6d28d9; }
.box-table-badge--dark { background: #334155; color: #fff; }
.box-table-badge--amber { background: #fffbeb; color: #b45309; }
.box-table-badge--danger { background: #fff1f2; color: #be123c; }
.box-pick-table .scan-check-btn {
  display: inline-flex;
  width: 24px;
  height: var(--ui-control-height-compact);
  flex: 0 0 24px;
  padding: 0;
  align-items: center;
  justify-content: center;
  border: 1px solid #cbd5e1;
  border-radius: .45rem;
  background: #fff;
  color: #64748b;
  line-height: 1;
  vertical-align: middle;
}
.box-table-box__action { margin-top: .08rem; }
.box-pick-action-cell .pick-actions {
  display: inline-flex;
  align-items: stretch;
  gap: .25rem;
}
.box-pick-action-cell .pick-actions.hidden { display: none; }
.pick-inline-source { display: none !important; }
/* После переноса камеры к ШК эта обёртка хранит только скрытый источник данных
   для JS и не должна создавать пустую строку ни на одной ширине. */
.box-pick-action-cell .pick-actions--inline-source { display: none; }
.box-pick-box-card .place-unpick-btn,
.fbm-mobile-pick-card .wms-return-pick-action {
  width: auto;
  height: 20px;
  min-height: 20px;
  max-height: 20px;
  gap: 3px;
  padding: 0 6px;
  font-size: 10px;
}
.pick-inline-editor {
  display: flex;
  width: 100%;
  min-width: 0;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: .28rem;
}
.pick-inline-editor.hidden { display: none; }
.pick-inline-qty-line,
.pick-inline-choices {
  display: flex;
  max-width: 100%;
  align-items: center;
  justify-content: flex-end;
  gap: .25rem;
}
.pick-inline-qty-line {
  color: #8b95a7;
  font-size: .62rem;
  white-space: nowrap;
}
.pick-inline-fact-label {
  color: #8b95a7;
  font-size: .62rem;
  line-height: 1.28;
}
.pick-inline-stepper {
  display: inline-flex;
  align-items: center;
  gap: .375rem;
}
#ship-list .pick-inline-stepper > :is(.wms-qty-step-btn, .pick-inline-qty),
#ship-list .wms-shortage-action {
  box-sizing: border-box !important;
  height: var(--ui-control-height-compact) !important;
  min-height: var(--ui-control-height-compact) !important;
  max-height: var(--ui-control-height-compact) !important;
}
.wms-qty-step-btn {
  display: inline-flex;
  width: 24px;
  flex: 0 0 24px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid #cbd5e1;
  border-radius: .375rem;
  color: #475569;
  font-size: .875rem;
  font-weight: 600;
  line-height: 1;
}
.wms-qty-step-control,
.wms-qty-step-control:hover {
  background: transparent;
  color: #94a3b8;
}
.pick-inline-qty {
  width: 3.25rem;
  padding: .1rem .18rem .1rem .3rem;
  border: 1px solid #c7c9f0;
  border-radius: 6px !important;
  background: #fff;
  color: #312e81;
  font-size: .72rem;
  font-weight: 650;
  line-height: 1;
  text-align: center;
  -moz-appearance: textfield;
  -webkit-appearance: none;
  appearance: none;
}
.pick-inline-qty::-webkit-inner-spin-button,
.pick-inline-qty::-webkit-outer-spin-button {
  margin: 0;
  -webkit-appearance: none;
}
#ship-list .pick-inline-qty:focus {
  border-color: var(--ui-accent);
  outline: 0 !important;
  box-shadow: none !important;
}
.pick-inline-choices { flex-wrap: nowrap; }
.pick-inline-exceptions {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
}
.pick-inline-exceptions.hidden,
.pick-inline-complete.hidden,
[data-pick-short].hidden,
[data-pick-full].hidden { display: none; }
.pick-inline-choices .ui-action { padding-right: .42rem; padding-left: .42rem; }
#ship-list .pick-inline-choices :is(
  .pick-inline-complete,
  .pick-inline-nothere,
  .pick-inline-damaged
) {
  box-sizing: border-box;
  height: var(--ui-control-height-compact);
  min-height: var(--ui-control-height-compact);
  max-height: var(--ui-control-height-compact);
  padding-top: 0;
  padding-bottom: 0;
}
.wms-shortage-action {
  padding-top: 0;
  padding-bottom: 0;
  line-height: 1;
}
.wms-shortage-replace { border-radius: .45rem; }
#rep-modal {
  padding: 10px;
}
#rep-modal .wms-line-replace-dialog {
  box-sizing: border-box;
  width: min(320px, calc(100vw - 20px));
  max-width: 320px;
  max-height: calc(100dvh - 20px);
  overflow-y: auto;
  padding: 10px;
  border-radius: 10px;
}
#rep-modal .wms-line-replace-head {
  margin-bottom: 4px;
}
#rep-modal .wms-line-replace-head h3 {
  font-size: 14px;
  line-height: 20px;
}
#rep-modal .wms-line-replace-close {
  display: inline-flex;
  width: 24px;
  height: var(--ui-control-height-compact);
  align-items: center;
  justify-content: center;
  padding: 0;
  font-size: 18px;
}
#rep-modal .wms-line-replace-copy {
  margin-bottom: 6px;
  color: #94a3b8;
  font-size: 10px;
  line-height: 14px;
}
#rep-modal :is(#rep-cands, #rep-cands-empty) {
  margin-bottom: 6px;
}
#rep-modal #rep-cands > :first-child,
#rep-modal #rep-cands-empty {
  font-size: 10px;
  line-height: 14px;
}
#rep-modal #rep-cands > :first-child {
  margin-bottom: 2px;
}
#rep-modal #rep-cands-list {
  max-height: none;
  overflow-y: visible;
}
#rep-modal #rep-cands-list > button {
  height: 22px;
  min-height: 22px;
  max-height: 22px;
  gap: 4px;
  padding: 0 6px;
}
#rep-modal #rep-cands-list > button > .text-sm {
  font-size: 11px;
  line-height: 1;
}
#rep-modal #rep-cands-list > button > .text-xs {
  font-size: 10px;
  line-height: 1;
}
#rep-modal #rep-cands-list > button > .text-\[10px\] {
  font-size: 9px;
  line-height: 13px;
}
#rep-modal .wms-line-replace-fields {
  display: flex;
  min-width: 0;
  align-items: flex-end;
  gap: 6px;
  margin-bottom: 8px;
}
#rep-modal .wms-line-replace-field {
  display: grid;
  min-width: 0;
  flex: 1 1 auto;
  gap: 2px;
  color: #94a3b8;
  font-size: 10px;
  line-height: 14px;
  text-transform: uppercase;
}
#rep-modal .wms-line-replace-field--qty {
  width: 72px;
  flex: 0 0 72px;
}
#rep-modal .wms-line-replace-input {
  display: block;
  box-sizing: border-box !important;
  width: 100%;
  height: 26px !important;
  min-height: 26px !important;
  max-height: 26px !important;
  block-size: 26px !important;
  min-block-size: 26px !important;
  max-block-size: 26px !important;
  margin: 0;
  padding: 0 8px !important;
  border: 1px solid #cbd5e1;
  border-radius: .45rem;
  background: #fff;
  color: #334155;
  font-family: inherit;
  font-size: 12px;
  line-height: 24px !important;
  appearance: none;
  -webkit-appearance: none;
}
#rep-modal .wms-line-replace-input--qty { text-align: right; }
#rep-modal .wms-line-replace-actions {
  gap: 6px;
}
#rep-modal .wms-line-replace-actions > button {
  box-sizing: border-box;
  height: 28px;
  padding: 0 10px;
  font-size: 12px;
  line-height: 1;
}
#ship-list :is(.fbm-byart-table--picking, .fbm-mobile-pick-card)
  .wms-shortage-controls :is(.wms-shortage-replace, .ui-action--quiet-danger) {
  box-sizing: border-box;
  display: inline-flex;
  height: var(--ui-control-height-compact);
  min-height: var(--ui-control-height-compact);
  max-height: var(--ui-control-height-compact);
  align-items: center;
  justify-content: center;
  gap: .3rem;
  padding: 0 .45rem;
  font-size: .7rem;
  line-height: 1;
}
.pick-inline-close {
  width: 1.15rem;
  height: 1.75rem;
  border: 0;
  border-radius: .42rem;
  background: transparent;
  color: #94a3b8;
  font-size: .78rem;
  line-height: 1;
}
.pick-inline-close:hover { background: #f1f5f9; color: #64748b; }
.pick-inline-error {
  flex-basis: 100%;
  color: #be4455;
  font-size: .58rem;
  line-height: 1.2;
  text-align: right;
}
.box-pick-location,
.box-pick-take,
.box-pick-product {
  display: inline-flex;
  min-width: 0;
  align-items: center;
}
.box-pick-location {
  gap: .22rem;
}
.wms-cut-roll-location {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #475569;
}
.wms-cut-roll-icon.ui-system-icon {
  width: 12px;
  height: 12px;
  flex-basis: 12px;
  color: #6d28d9;
}
.wms-cut-roll-location__meta {
  color: #64748b;
}
.wms-cut-roll-location__meters {
  color: #8b5cf6;
}
.fbm-byart-location-row,
.fbm-byart-pick-controls,
.fbm-byart-pick-action-row {
  display: flex;
  height: var(--ui-control-height-compact);
}
.fbm-byart-location-row { width: 100%; }
.fbm-byart-action-stack { gap: 2px; }
.fbm-byart-action-cell { text-align: right; }
.fbm-byart-row > td { vertical-align: middle; }
.fbm-byart-picked-col > .text-xs { line-height: 12px; }
.fbm-byart-pick-controls :is(input[type="text"], .ui-action) {
  box-sizing: border-box;
  height: var(--ui-control-height-compact);
  min-height: var(--ui-control-height-compact);
  max-height: var(--ui-control-height-compact);
  padding-top: 0;
  padding-bottom: 0;
}
.fbm-byart-deficit {
  margin: 0;
  padding: 0;
  font-size: 11px;
  line-height: 13px;
}
/* FBM «Сформирована» / «По местам»: узкие служебные колонки имеют размер
   содержимого, артикул ограничен разумным коридором, а адрес брони получает остаток. */
@media (min-width: 768px) {
  #ship-list .byart-pick-table.fbm-byart-table--reserved {
    table-layout: fixed;
  }
  #ship-list .byart-pick-table.fbm-byart-table--picking :is(th, td):nth-child(2) {
    width: clamp(140px, 14vw, 220px);
  }
  #ship-list .byart-pick-table.fbm-byart-table--picking :is(th, td):nth-child(4) {
    width: 260px;
    min-width: 260px;
  }
  #ship-list .byart-pick-table.fbm-byart-table--picking :is(th, td):last-child {
    width: 320px;
    min-width: 320px;
  }
  #ship-list .byart-pick-table col.fbm-byart-col-no { width: 32px; }
  #ship-list .byart-pick-table col.fbm-byart-col-article {
    width: clamp(260px, 26vw, 480px);
  }
  #ship-list .byart-pick-table col.fbm-byart-col-barcode { width: 144px; }
  #ship-list .byart-pick-table col.fbm-byart-col-plan { width: 72px; }
  #ship-list .byart-pick-table .box-pick-label-cell.unit-barcode-column {
    text-align: left !important;
  }
}
/* Раскрытый состав FBM: одна плотность для двух видов. Размеры текста и рабочих
   контролов не уменьшаем — высоту снимают только пустые вертикальные поля ячеек. */
@media (min-width: 641px) {
  #ship-list > tbody > tr.ship-detail:not(.hidden)
    :is(.box-pick-table, .byart-pick-table, .fbm-box-layout-table) :is(th, td) {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden)
    .fbm-box-layout-table .box-pick-row > td {
    height: 28px;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden)
    .byart-pick-table input[data-inline-field="qty"] {
    box-sizing: border-box;
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    max-height: var(--ui-control-height-compact);
    padding-top: 0;
    padding-bottom: 0;
    line-height: 22px;
  }
}
.fbm-byart-picked-col {
  width: 7rem;
  min-width: 7rem;
  white-space: nowrap;
}
.fbm-byart-accepted-col {
  width: 7.5rem;
  min-width: 7.5rem;
}
.fbm-byart-accepted-source {
  white-space: nowrap;
}
.box-pick-take {
  gap: .2rem;
  flex-wrap: wrap;
  white-space: nowrap;
}
.box-pick-take b {
  color: #334155;
  font-size: inherit;
  line-height: inherit;
}
.box-pick-product {
  align-items: flex-start;
  flex-direction: column;
  gap: .12rem;
  font-size: .68rem;
}
.box-pick-product-line {
  display: inline-flex;
  min-width: 0;
  align-items: baseline;
  gap: 4px;
}
.box-pick-product-main {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
}
#ship-list .box-pick-qty-mobile { display: none !important; }
.box-pick-barcode-mobile { display: none; }
.box-pick-barcode-prefix { display: none; }
.box-pick-product > b,
.box-pick-product-line > b,
.box-pick-product-main > b {
  color: #1e293b;
  font-size: .8rem;
}
.box-pick-barcode {
  white-space: nowrap;
}
@media (min-width: 641px) {
  .box-pick-barcode--mobile { display: none; }
}
.box-pick-empty-cell,
.box-pick-missing-row td {
  background: #fff7f7;
  color: #be123c;
}
.box-pick-missing-notice,
.box-pick-missing-items,
.box-pick-missing-item {
  display: flex;
  align-items: baseline;
}
.box-pick-missing-notice {
  flex-wrap: wrap;
  gap: 4px 8px;
}
.box-pick-missing-items,
.box-pick-missing-item {
  flex-wrap: wrap;
  gap: 3px 8px;
}
@media (min-width: 641px) {
  .box-pick-missing-row > td,
  .box-pick-empty-cell:has(> .box-pick-missing-notice) {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
  .box-pick-missing-notice {
    display: grid;
    width: 100%;
    grid-template-columns: 20fr 12fr 20fr 8fr;
    align-items: baseline;
    gap: 0;
  }
  .box-pick-missing-notice:has(> .box-drop-btn) {
    grid-template-columns: 20fr 12fr 20fr 8fr 28fr;
  }
  .box-pick-missing-items,
  .box-pick-missing-item {
    display: contents;
  }
  .box-pick-missing-article {
    grid-column: 1;
    margin-left: .55rem;
  }
  .box-pick-missing-title {
    grid-column: 3;
    grid-row: 1;
    margin-left: .55rem;
  }
  .box-pick-missing-qty-desktop {
    grid-column: 4;
    margin-left: .55rem;
  }
  .box-pick-missing-notice > .box-drop-btn {
    grid-column: 5;
    grid-row: 1;
    justify-self: end;
    margin-right: .55rem;
  }
}
.box-pick-empty-cell .box-drop-btn,
.box-pick-missing-row .box-drop-btn {
  margin-left: 0;
  padding: .25rem .45rem;
  border: 1px solid #fecdd3;
  border-radius: .35rem;
  background: #fff;
  color: #be123c;
  font-size: .64rem;
}
@media (max-width: 640px) {
  #ship-list > tbody > tr.ship-detail:not(.hidden) .fbm-shipment-card {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .fbm-shipment-card .box-pick-table-wrap {
    box-sizing: border-box;
    padding: 0;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  .box-pick-table,
  .box-pick-table tbody {
    display: block;
    width: 100%;
  }
  .box-pick-table colgroup,
  .box-pick-table thead {
    display: none;
  }
  .box-pick-table .box-pick-box-card {
    box-sizing: border-box;
    position: relative;
    width: 100%;
    min-height: 76px;
    margin-top: 8px;
    padding-left: 96px;
    overflow: hidden;
    border-radius: 10px;
    background: #fff;
  }
  .box-pick-table > .box-pick-box-card:first-of-type {
    margin-top: 0;
  }
  .box-pick-table .box-pick-row {
    box-sizing: border-box;
    position: static;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 1px 8px;
    padding: .23rem 8px 2px;
    background: transparent;
  }
  .box-pick-table .box-pick-box-card > .box-pick-row:only-child {
    min-height: 74px;
    grid-template-rows: auto auto auto 1fr;
  }
  .box-pick-table .box-pick-box-card .box-pick-row + .box-pick-row {
    border-top: 1px solid #d8dee9;
  }
  .box-pick-table .box-pick-box-card .box-pick-row--missing {
    background: #fff7f7;
  }
  :is(.fbm-shipment-status-picking, .fbs-supply-status-picking)
    .box-pick-box-card .box-pick-row--done {
    background: #fbfaff;
  }
  :is(.fbm-shipment-status-picking, .fbs-supply-status-picking)
    .box-pick-box-card .box-pick-row--done > td:not(.box-pick-box-cell) {
    background: transparent;
  }
.box-pick-table td {
    display: block;
    width: auto;
    border: 0;
    padding: 0;
    text-align: left !important;
  }
  .box-pick-table .box-pick-box-card .box-pick-row > td {
    border: 0 !important;
  }
  .box-pick-table .box-pick-box-card .box-pick-row > td.box-pick-box-cell {
    box-sizing: border-box;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 96px !important;
    padding: 4px 8px 8px !important;
    border-right: 1px solid #eef0f4 !important;
    border-bottom: 0 !important;
    background: #fff;
  }
  .box-pick-table .box-pick-box-cell:has(.box-table-box__picker-row) {
    padding-bottom: 24px !important;
  }
  .box-pick-box-card .box-table-box {
    display: grid;
    width: 100%;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 1px 3px;
  }
  .box-pick-box-card .box-table-box__title {
    grid-column: 1 / -1;
    order: 1;
    gap: 4px;
    margin-top: 2px;
    font-size: 11px;
  }
  .box-pick-box-card .box-clean-icon {
    width: 12px;
    height: 12px;
    flex-basis: 12px;
  }
  .box-pick-box-card .box-table-box
    > .box-table-box__heading:not(.box-table-box__picker-row) {
    display: contents;
  }
  .box-pick-box-card .box-table-box__meta {
    grid-column: 1;
    order: 2;
  }
  .box-pick-box-card .box-table-box__badges {
    display: contents;
    padding-left: 0;
  }
  .box-pick-box-card .box-table-label-pair {
    display: contents;
  }
  .box-pick-box-card .box-table-label-pair > .box-table-badge--violet {
    grid-column: 1 / -1;
    order: 3;
    justify-self: start;
  }
  .box-pick-box-card .box-table-label-pair > .box-table-badge--dark {
    grid-column: 2;
    order: 2;
    justify-self: start;
  }
  .box-pick-box-card .box-table-box__badges > .box-table-badge {
    grid-column: 1 / -1;
    order: 4;
    justify-self: start;
  }
  .box-pick-box-card .box-table-box__traits {
    grid-column: 1 / -1;
    order: 4;
    flex: 0 0 auto;
    flex-direction: row;
    align-items: center;
    gap: 2px;
  }
  .box-pick-box-card .box-table-box:not(:has(.box-table-label-pair))
    .box-table-box__traits {
    display: contents;
  }
  .box-pick-box-card .box-table-box:not(:has(.box-table-label-pair))
    .box-table-box__traits > .box-table-badge--amber {
    grid-column: 2;
    order: 2;
    justify-self: start;
  }
  .box-pick-box-card .box-table-box:not(:has(.box-table-label-pair))
    .box-table-box__traits > .box-table-badge--places {
    grid-column: 1 / -1;
    order: 4;
    justify-self: start;
  }
  .box-pick-box-card .box-table-box__picker-row {
    position: absolute;
    right: 8px;
    bottom: 4px;
    left: 8px;
    grid-column: 1 / -1;
    order: 5;
    width: auto;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 3px;
  }
  .box-pick-box-card .box-table-box__picker {
    overflow: visible;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.1;
    text-overflow: clip;
    white-space: normal;
  }
  .box-pick-product-cell {
    position: relative;
    grid-column: 1 / -1;
    grid-row: 1;
    padding-right: 0 !important;
    container-type: inline-size;
  }
  .box-pick-box-card .box-pick-product {
    width: 100%;
    align-items: flex-end;
    font-family: inherit;
  }
  .box-pick-box-card .box-pick-product-line {
    display: flex;
    flex-flow: row-reverse wrap;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    max-width: 100%;
    gap: 1px 4px;
  }
  .box-pick-box-card .box-pick-product-main > b {
    flex: 0 0 auto;
    color: #334155;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.015em;
    white-space: nowrap;
  }
  #ship-list .box-pick-box-card .box-pick-qty-mobile {
    display: inline-flex !important;
    position: static;
  }
  #ship-list .box-pick-box-card .box-pick-barcode-mobile {
    display: inline-flex;
    order: 2;
    flex: 0 0 auto;
    margin-right: auto;
  }
  .box-pick-box-card .box-pick-product-main {
    order: 1;
    flex: 0 0 auto;
  }
  .box-pick-take-cell {
    display: none !important;
  }
  .box-pick-box-card .box-pick-label-cell {
    display: none;
    grid-column: 1 / -1;
    grid-row: 2;
    align-items: center;
    align-self: center;
    justify-self: start;
    gap: 3px;
    color: #94a3b8;
    font-family: inherit;
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    margin-top: -3px;
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .unit-barcode-content {
    gap: 3px;
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .unit-barcode-value {
    color: #94a3b8;
    font-family: inherit;
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .unit-print-btn {
    order: -1;
    box-sizing: border-box;
    width: 18px;
    height: 18px;
    padding: 2px;
    border-color: #e2e8f0;
    border-radius: 5px;
    background: transparent;
    color: #9ca3af;
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .unit-print-btn:hover {
    border-color: var(--ui-accent);
    background: var(--ui-accent-soft);
    color: var(--ui-accent-hover);
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .unit-print-btn::before {
    width: 12px;
    height: 12px;
  }
  .box-pick-location-cell {
    grid-column: 1 / -1;
    grid-row: 3;
    align-self: center;
    justify-self: end;
  }
  .box-pick-box-card .box-pick-location {
    gap: .24rem;
    color: #475569;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.2;
  }
  .box-pick-action-cell {
    grid-column: 1 / -1;
    grid-row: 4;
    align-self: end;
    padding-top: 0 !important;
    padding-bottom: 4px !important;
  }
  .box-pick-box-card .pick-inline-editor {
    justify-content: flex-end;
    gap: 4px;
  }
  .box-pick-box-card .pick-inline-fact-label {
    display: none;
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .pick-inline-stepper {
    gap: 2px;
  }
  #ship-list :is(.box-pick-box-card, .fbm-mobile-pick-card) .pick-inline-stepper > :is(
    .wms-qty-step-btn,
    .pick-inline-qty
  ) {
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .wms-qty-step-btn {
    width: 20px;
    flex-basis: 20px;
    font-size: 12px;
  }
  :is(.box-pick-box-card, .fbm-mobile-pick-card) .pick-inline-qty {
    width: 34px;
    padding: 0 2px;
    font-size: 11px;
  }
  .box-pick-group-row,
  .box-pick-missing-row { display: block; }
  .box-pick-group-row td,
  .box-pick-missing-row td { padding: .45rem .55rem; }
  /* Палета — разделитель всей группы, поэтому на телефоне её фон доходит до
     цветных боковин раскрытой поставки, а не обрывается по внутренней карточке. */
  #ship-list .fbm-shipment-card .box-pick-group-row {
    box-sizing: border-box;
    width: calc(100% + 2rem);
    margin-top: 8px;
    margin-right: -1rem;
    margin-left: -1rem;
  }
  #ship-list .fbm-shipment-card .box-pick-group-row > td {
    box-sizing: border-box;
    width: 100%;
    padding: .5rem 1rem;
    background: color-mix(
      in srgb,
      #fff 80%,
      var(--wms-mobile-card-open, var(--ui-accent-soft)) 20%
    );
  }
  #ship-list .fbm-shipment-card .box-pick-group-content {
    display: flex;
    width: 100%;
    justify-content: flex-start;
    gap: .28rem;
    text-align: left;
  }
  #ship-list .fbm-shipment-card .box-pick-group-meta::before {
    content: "·";
    margin-right: .28rem;
    color: #94a3b8;
  }
  .box-pick-missing-notice,
  .box-pick-missing-items {
    display: grid;
    justify-items: start;
  }
  .box-pick-missing-notice { gap: 4px; }
  .box-pick-missing-items { width: 100%; gap: 2px; }
  .box-pick-missing-item {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
  }
  .box-pick-missing-title {
    font-size: 10px;
    font-weight: 400;
    line-height: 12px;
  }
  .box-pick-missing-article {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #334155;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.015em;
  }
  .box-pick-missing-qty-desktop { display: none; }
  .box-pick-missing-notice .box-drop-btn {
    box-sizing: border-box;
    min-height: var(--ui-control-height-compact);
    padding: 0 7px;
    border-radius: 6px;
    font-size: 10px;
  }
  /* Не скрываем служебные данные короба на телефоне: это та же единая строка
     грузоместа/этикетки и строка признаков, что и на широком экране. */
  .box-table-box__badges { display: flex; }
  .box-pick-action-cell .pick-place-btn:not(.place-unpick-btn) {
    width: 100%;
    min-height: 1.75rem;
  }
  .box-pick-box-card .box-pick-action-cell:has(> .place-unpick-btn) {
    display: flex;
    justify-content: flex-end;
  }
  .box-pick-action-cell .pick-actions { width: 100%; }
  .box-pick-row--missing .box-pick-empty-cell {
    grid-column: 1 / -1;
    grid-row: 1 / -1;
    background: transparent;
  }
}
.ui-action:disabled {
  opacity: .72;
  cursor: not-allowed;
}
.ui-action.is-design-preview:disabled {
  opacity: 1;
  cursor: default;
}

/* В локальном UI-предпросмотре FBS кнопка видна как на боевой, но остаётся disabled:
   можно проверять композицию без риска отправить POST в макетные данные. */
[data-fbs-bar][data-design-preview="true"] [data-fbs-act="bulk-confirm"]:disabled {
  opacity: 1;
  cursor: default;
}
.ui-action--soft {
  border-color: var(--ui-accent-line);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
}
.ui-action--soft:hover:not(:disabled) {
  border-color: #aaaef0;
  background: #e1e3fb;
}
.fbs-pick-exception.ui-action--soft {
  border-color: var(--ui-accent-line);
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
}
.fbs-pick-exception.ui-action--soft:hover:not(:disabled) {
  border-color: #aaaef0;
  background: #e1e3fb;
  color: var(--ui-accent-hover);
}
.ui-action--quiet-danger {
  background: transparent;
  color: #7c8798;
}
.ui-action--quiet-danger:hover:not(:disabled) {
  background: #fff1f2;
  color: #be4455;
}
.ui-status-dot {
  display: inline-flex;
  align-items: center;
  gap: .34rem;
  padding: 0;
  background: transparent;
  color: #64748b;
  font-size: .72rem;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
}
.ui-status-dot::before {
  content: "";
  flex: 0 0 auto;
  width: .38rem;
  height: .38rem;
  border-radius: 999px;
  background: #cbd5e1;
}
.ui-status-dot.is-warning::before { background: #d6a43a; }
.ui-status-dot.is-success::before { background: #36a273; }
.fbs-order-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: .35rem;
  min-width: 9.25rem;
  opacity: 1;
  visibility: visible;
}
.fbs-order-actions > form,
.fbs-order-actions > a,
.fbs-order-actions > button,
.fbs-order-actions .ui-action {
  display: inline-flex !important;
}
.fbs-mobile-org,
.fbs-mobile-org-separator { display: inline; }
.fbs-supply-channel { display: none; }
.fbs-supply-warehouse { font-weight: 400; }
#fbs-supply-list .fbs-supply-state { column-gap: .35rem; }
.fbs-owner-people {
  display: grid;
  gap: .3rem;
}
.fbs-owner-role {
  display: flex;
  align-items: center;
  gap: .18rem;
  min-width: 0;
  padding: .35rem .45rem;
  border-radius: .45rem;
  background: #f8fafc;
  color: #475569;
  font-size: .68rem;
  line-height: 1.25;
  white-space: nowrap;
}
.fbs-owner-label {
  display: inline;
  flex: 0 0 auto;
  margin: 0;
  color: #94a3b8;
  font-size: .56rem;
  font-weight: 600;
  letter-spacing: .025em;
  text-transform: uppercase;
}
.fbs-owner-label-icon { display: none; }
.doc-owner-icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 1rem;
  height: 1rem;
  background: currentColor;
  -webkit-mask-position: center;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
  mask-size: contain;
}
.doc-owner-icon--manager {
  -webkit-mask-image: url('/static/responsible.svg');
  mask-image: url('/static/responsible.svg');
}
.doc-owner-icon--picker {
  -webkit-mask-image: url('/static/picker.svg');
  mask-image: url('/static/picker.svg');
}
/* На мобильном FBS обе роли — одна нейтральная служебная группа: ответственный
   и сборщик используют одинаковый серый знак. Desktop сохраняет свои оттенки. */
@media (max-width: 640px) {
  #fbs-supply-list .doc-owner-icon { color: #64748b; }
}
.doc-owner-cell {
  position: relative;
  overflow: visible;
}
.doc-owner-heading {
  position: relative;
  padding-right: 1.35rem !important;
}
.doc-owner-heading > .help {
  position: absolute;
  top: 50%;
  right: .28rem;
  margin-left: 0;
  transform: translateY(-50%);
}
.doc-owner-history {
  position: relative;
  margin-top: .22rem;
  color: #94a3b8;
}
.doc-owner-history > summary {
  display: inline-flex;
  align-items: center;
  gap: .24rem;
  padding: .08rem .18rem;
  border-radius: .3rem;
  font-size: .62rem;
  line-height: 1.2;
  list-style: none;
  white-space: nowrap;
  cursor: pointer;
}
.doc-owner-history > summary::-webkit-details-marker { display: none; }
.doc-owner-history > summary:hover,
.doc-owner-history > summary:focus-visible {
  background: #f1f5f9;
  color: #64748b;
}
.doc-owner-history-arrow {
  display: inline-block;
  width: 0;
  height: 0;
  border-top: .22rem solid transparent;
  border-bottom: .22rem solid transparent;
  border-left: .3rem solid currentColor;
  transform-origin: 42% 50%;
  transition: transform .15s ease;
}
.doc-owner-history[open] > summary .doc-owner-history-arrow { transform: rotate(90deg); }
.doc-owner-history-panel {
  position: absolute;
  z-index: 35;
  top: calc(100% + .25rem);
  right: 0;
  display: grid;
  gap: .22rem;
  width: min(21rem, calc(100vw - 2rem));
  max-height: 13rem;
  padding: .45rem;
  overflow-y: auto;
  border: 1px solid #e2e8f0;
  border-radius: .55rem;
  background: #fff;
  color: #475569;
  box-shadow: 0 10px 28px rgb(15 23 42 / 12%);
  font-size: .68rem;
  line-height: 1.25;
}
.doc-owner-history-row {
  display: flex;
  align-items: baseline;
  gap: .3rem;
  min-width: 0;
  padding: .2rem .25rem;
  border-radius: .3rem;
}
.doc-owner-history-row:hover { background: #f8fafc; }
.doc-owner-history-time {
  flex: 0 0 auto;
  color: #94a3b8;
  font-variant-numeric: tabular-nums;
}
.doc-owner-history-user { color: #94a3b8; }
.doc-owner-history-empty { padding: .3rem; color: #94a3b8; }
/* ⚠️ Меню «Переназначить» (`reassign-picks-panel`) — в том же списке: у нижней поставки
   реестра оно открывается за низ рамки, и `overflow: hidden` срезал список сборщиков
   целиком (владелец 01.10). */
.doc-list-frame:has(.doc-owner-history[open], .doc-owner-people .ui-picker[open],
                    .reassign-picks-panel__select-control[open]) {
  overflow: visible;
}
.doc-owner-mobile .doc-owner-people {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .22rem;
}
.doc-owner-mobile .doc-owner-people--without-pickers {
  grid-template-columns: minmax(0, 1fr);
}
.doc-owner-mobile .fbs-owner-role {
  min-height: 1.78rem;
  padding: .25rem 1rem .25rem .35rem;
  overflow: hidden;
}
.doc-owner-mobile .doc-owner-history { margin-top: .18rem; }
.doc-owner-mobile .doc-owner-history-panel {
  right: auto;
  left: 0;
}
.fbs-owner-static { display: none; }
.fbs-owner-name-full { display: none; }
.fbs-owner-name-compact {
  display: inline;
  min-width: 0;
  overflow: hidden;
  font-weight: 400;
  text-overflow: ellipsis;
}
.fbs-owner-unassigned {
  min-width: 0;
  overflow: hidden;
  font-size: .62rem;
  font-weight: 400;
  letter-spacing: -.01em;
  text-overflow: ellipsis;
}
.fbs-pick-label { white-space: nowrap; }
.fbs-pick-metrics {
  display: inline-flex;
  align-items: center;
  gap: .22rem;
}
.fbs-pick-metrics > span { white-space: nowrap; }
.fbs-pick-metrics > span + span::before {
  content: "·";
  margin-right: .22rem;
}
.ui-picker {
  position: relative;
  min-width: 0;
}
.ui-picker > summary {
  position: relative;
  padding-right: 1.65rem;
  cursor: pointer;
  list-style: none;
  border: 1px solid transparent;
  transition: border-color .15s ease, background-color .15s ease;
}
.ui-picker > summary::-webkit-details-marker { display: none; }
.ui-picker > summary::after {
  content: "";
  position: absolute;
  top: 50%;
  right: .55rem;
  width: .34rem;
  height: .34rem;
  border-right: 1.35px solid currentColor;
  border-bottom: 1.35px solid currentColor;
  color: #94a3b8;
  transform: translateY(-65%) rotate(45deg);
  transition: color .15s ease, transform .15s ease;
}
.ui-picker > summary:hover,
.ui-picker > summary:focus-visible {
  border-color: var(--ui-accent-line);
  background: var(--ui-accent-soft);
}
.ui-picker[open] > summary {
  border-color: #dbe3ee;
  background: #fff;
  box-shadow: 0 1px 2px rgb(15 23 42 / 5%);
}
.ui-picker[open] > summary::after {
  color: var(--ui-accent);
  transform: translateY(-30%) rotate(225deg);
}
.ui-picker-menu {
  position: absolute;
  z-index: 30;
  top: calc(100% + .3rem);
  left: 0;
  display: grid;
  gap: .15rem;
  width: 13rem;
  max-width: min(13rem, calc(100vw - 2.5rem));
  max-height: 11rem;
  padding: .25rem;
  overflow-y: auto;
  border: 1px solid #e2e8f0;
  border-radius: .55rem;
  background: #fff;
  box-shadow: 0 8px 22px rgb(15 23 42 / 10%);
}
.ui-picker-menu form { margin: 0; }
/* Пометка fail-open выпадашки сборщиков (мигр.554): по фильтру навыка/склада никого
   не нашлось — показаны все, и об этом сказано словами, а не молча. */
.ui-picker-note {
  padding: .4rem .6rem;
  font-size: .68rem;
  line-height: 1.25;
  color: #92400e;
  background: #fffbeb;
  border-bottom: 1px solid #fde68a;
}
.ui-picker-option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  width: 100%;
  min-height: 2rem;
  padding: .38rem .5rem;
  border: 0;
  border-radius: .38rem;
  background: transparent;
  color: #334155;
  font-size: .72rem;
  line-height: 1.2;
  text-align: left;
  cursor: pointer;
}
.ui-picker-option:hover { background: #f1f5f9; }
.ui-picker-option.is-current {
  background: var(--ui-accent-soft);
  color: var(--ui-accent-hover);
  font-weight: 600;
}
.ui-picker-check {
  flex: 0 0 auto;
  width: .9rem;
  height: .9rem;
}

/* Отменённый после сборки заказ имеет один статус на desktop и mobile:
   нейтральная точка у первой строки и две фиксированные строки подписи. */
#fbs-supply-list table.fbs-pack-table .fbs-order-status-text--cancelled {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
}
#fbs-supply-list table.fbs-pack-table .fbs-order-status-text--cancelled > span {
  white-space: nowrap;
}
#fbs-supply-list table.fbs-pack-table .ui-status-dot:has(.fbs-order-status-text--cancelled) {
  align-items: flex-start;
}
#fbs-supply-list table.fbs-pack-table .ui-status-dot:has(.fbs-order-status-text--cancelled)::before {
  margin-top: calc((1.2em - .38rem) / 2);
}

@media (min-width: 641px) {
  /* Раскрытая поставка получает цвет площадки; плашки сотрудников продолжают этот
     же фон, а не превращаются в белые островки внутри строки. */
  #fbs-supply-list > tbody > tr.fbs-supply-row.ship-open .fbs-owner-role,
  #fbs-supply-list > tbody > tr.fbs-supply-row.ship-open .ui-picker[open] > summary {
    background: transparent;
    box-shadow: none;
  }
}

@media (min-width: 641px) {
  /* Внешний реестр FBS нельзя полагать только на clipping обёртки: на мобильном
     overflow остаётся visible ради истории «путь · N». Скругляем геометрию самой
     таблицы и её крайних видимых ячеек — независимо от режима обёртки. */
  #fbs-supply-list {
    border-collapse: separate;
    border-spacing: 0;
  }
  #fbs-supply-list > thead > tr:first-child > th:first-child {
    border-top-left-radius: .72rem;
  }
  #fbs-supply-list > thead > tr:first-child > th:last-child {
    border-top-right-radius: .72rem;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(~ tr.fbs-supply-row)):not(.ship-open) > td:first-child {
    border-bottom-left-radius: .72rem;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:not(:has(~ tr.fbs-supply-row)):not(.ship-open) > td:last-child {
    border-bottom-right-radius: .72rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(:has(~ tr.fbs-supply-row)) > td {
    border-bottom-right-radius: .72rem;
    border-bottom-left-radius: .72rem;
  }

  /* Цельная строка-разделитель не ломается на стыках табличных колонок.
     Один приём для документов FBS и FBM. */
  :is(#fbs-supply-list, #ship-list) > tbody > tr.document-separator > td {
    height: .42rem;
    padding: 0 !important;
    border: 0 !important;
    background: #edf0f5;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table > thead {
    background: var(--ui-surface-muted);
    color: var(--ui-text-muted);
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table > thead th {
    padding-top: .52rem;
    padding-bottom: .52rem;
    border-top: 1px solid var(--ui-border);
    border-bottom: 1px solid var(--ui-border);
    background: var(--ui-surface-muted);
    font-size: .68rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  /* Состав FBS — рабочая карточка внутри цветной поставки, а не ещё одна тяжёлая
     системная таблица. Мягкий контур и спокойная типографика сохраняют плотность,
     но визуально отделяют позиции от внешнего реестра документов. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table {
    /* ⛔ Не обрезать плавающий «путь · N» у последних заказов. Это
       позднее desktop-правило раньше перебивало верный `overflow: visible`
       и панель пропадала ровно на нижней границе таблицы. */
    overflow: visible;
    border: 0 !important;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: .72rem;
    background: #fff;
    box-shadow: 0 1px 2px rgb(15 23 42 / 4%), 0 0 0 1px rgb(148 163 184 / 16%);
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > thead,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > thead > tr {
    background: var(--ui-surface-muted);
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > thead th {
    padding: .52rem .72rem;
    border-top: 0;
    border-bottom: 1px solid #ececf3;
    background: var(--ui-surface-muted);
    color: #77798b;
    font-size: .62rem;
    font-weight: 600;
    letter-spacing: .045em;
    text-transform: uppercase;
  }
  /* У FBS overflow обязан оставаться visible ради плавающего «путь · N», поэтому
     обрезка контейнером здесь невозможна. Скругляем сами крайние ячейки: фон шапки
     и последней строки повторяет контур таблицы, а всплывающая история не режется. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > thead > tr:first-child > th:first-child {
    border-top-left-radius: .72rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > thead > tr:first-child > th:last-child {
    border-top-right-radius: .72rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr:last-child > td:first-child {
    border-bottom-left-radius: .72rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr:last-child > td:last-child {
    border-bottom-right-radius: .72rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr {
    border: 0;
    background: #fff;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr:hover {
    background: #fcfcff;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr + tr > td {
    border-top: 1px solid #f0f1f5;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr > td {
    padding: .43rem .72rem;
    border-bottom: 0;
    color: #596579;
    font-size: .7rem;
    font-weight: 400;
    line-height: 1.25;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr > td b,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr > td span:not(.help) {
    font-size: inherit;
    line-height: inherit;
  }
  /* Desktop FBS: одно значение артикула и один стиль для «По заказам» / «По местам». */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden)
    table.fbs-pack-table .fbs-pick-article-value {
    color: #334155;
    font-size: 13px;
    font-weight: 600;
    line-height: 14px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden)
    table.fbs-pack-table .fbs-pack-assignment-desktop {
    display: flex;
    align-items: center;
    gap: 4px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table td[data-label="Взять, шт"] {
    color: var(--ui-accent-hover);
    font-weight: 600;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-barcode-inline {
    display: flex;
    align-items: baseline;
    gap: .25rem;
    margin-top: .14rem;
    color: #94a3b8;
    font-family: inherit;
    font-size: .65rem;
    font-weight: 400;
    line-height: 1.2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-barcode-inline > span,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-barcode-inline > b {
    color: #94a3b8;
    font-size: inherit;
    font-weight: 400;
  }
  /* Desktop FBS: номер этикетки имеет одну типографику в «По заказам» и «По местам».
     Двухколоночная сетка «По местам» ниже отвечает только за раскладку номеров. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-value b {
    color: #0f172a;
    font-size: inherit;
    font-weight: 600;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-value .text-\[11px\] {
    color: #94a3b8;
    font-size: .68rem;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart {
    table-layout: fixed;
  }
  #fbs-supply-list table.fbs-pick-table--bypack :is(th, td):nth-child(1) { width: 13%; }
  #fbs-supply-list table.fbs-pick-table--bypack :is(th, td):nth-child(2) {
    width: 19%;
    overflow-wrap: normal;
    white-space: nowrap;
  }
  #fbs-supply-list table.fbs-pick-table--bypack :is(th, td):nth-child(3) { width: 18%; }
  #fbs-supply-list table.fbs-pick-table--bypack :is(th, td):nth-child(4) { width: 6%; }
  #fbs-supply-list table.fbs-pick-table--bypack :is(th, td):nth-child(5) { width: 14%; }
  #fbs-supply-list table.fbs-pick-table--bypack :is(th, td):nth-child(6) { width: 12%; }
  #fbs-supply-list table.fbs-pick-table--bypack :is(th, td):nth-child(7) { width: 18%; }
  /* Статус не имеет права выходить в соседнюю «Этикетку»: общий `.ui-status-dot`
     по умолчанию не переносится, что при 14% вытесняло текст за границу ячейки. */
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-pack-status,
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-pack-status .ui-status-dot,
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-status-text,
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-return-to-shelf {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    white-space: normal;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-pack-status .ui-status-dot {
    align-items: flex-start;
    width: 100%;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-pack-status .ui-status-dot::before {
    /* Точка центрируется по первой строке статуса, даже если длинный статус перенёсся. */
    margin-top: calc((1.2em - .38rem) / 2);
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary {
    display: inline-flex;
    width: max-content;
    max-width: none;
    align-items: center;
    gap: 8px;
    min-width: 0;
    overflow: visible;
    white-space: nowrap;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary > .ui-status-dot {
    flex: 0 0 auto;
    width: auto;
    max-width: none;
    overflow-wrap: normal;
    white-space: nowrap;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary .fbs-order-status-text {
    max-width: none;
    overflow-wrap: normal;
    white-space: nowrap;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary > .fbs-return-to-shelf {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 3px;
    min-width: max-content;
    max-width: none;
    margin-top: 0 !important;
    font-size: 10px;
    line-height: 12px;
    overflow-wrap: normal;
    white-space: nowrap;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-return-to-shelf-icon {
    flex: 0 0 10px;
    width: 10px;
    height: 10px;
    margin-top: 0;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary:has(.fbs-return-to-shelf) {
    display: grid;
    width: 100%;
    max-width: 100%;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    row-gap: 2px;
    overflow: hidden;
    white-space: normal;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-return-to-shelf-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-return-to-shelf-copy > span {
    white-space: nowrap;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary:has(.fbs-return-to-shelf) > .ui-status-dot,
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary:has(.fbs-return-to-shelf) > .fbs-return-to-shelf {
    align-items: flex-start;
  }
  #fbs-supply-list table.fbs-pick-table--bypack .fbs-order-state-primary:has(.fbs-return-to-shelf) .fbs-return-to-shelf-icon {
    margin-top: 1px;
  }
  /* Начиная с «Отгружена» складских мутаций нет. Без доступной
     печати внутренняя таблица содержит шесть колонок; освободившаяся ширина отдана
     статусу. Если QR доступен, он возвращает седьмую узкую колонку. */
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive :is(th, td):nth-child(1) { width: 16%; }
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive :is(th, td):nth-child(2) { width: 19%; }
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive :is(th, td):nth-child(3) { width: 18%; }
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive :is(th, td):nth-child(4) { width: 5%; }
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive :is(th, td):nth-child(5) { width: 12%; }
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive :is(th, td):nth-child(6) { width: 30%; }
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive-labels :is(th, td):nth-child(6) { width: 24%; }
  #fbs-supply-list table.fbs-pick-table--bypack.fbs-pack-table--archive-labels :is(th, td):nth-child(7) { width: 6%; }
  #fbs-supply-list table.fbs-pick-table--byart :is(th, td):nth-child(1) { width: 18%; }
  #fbs-supply-list table.fbs-pick-table--byart :is(th, td):nth-child(2) { width: 22%; }
  #fbs-supply-list table.fbs-pick-table--byart :is(th, td):nth-child(3) { width: 8%; text-align: center; }
  /* Два длинных номера этикеток физически не помещаются в прежние 14%: каждая
     внутренняя колонка получала лишь 7% и значения накладывались. Забираем ширину
     у избыточного столбца заказов; сумма пяти колонок остаётся ровно 100%. */
  #fbs-supply-list table.fbs-pick-table--byart :is(th, td):nth-child(4) { width: 24%; }
  #fbs-supply-list table.fbs-pick-table--byart :is(th, td):nth-child(5) { width: 28%; }
  #fbs-supply-list table.fbs-pick-table--byart .fbs-pick-sticker {
    white-space: normal;
  }
  #fbs-supply-list table.fbs-pick-table--byart .fbs-pick-orders {
    color: #7c8798;
    font-size: .66rem;
    line-height: 1.3;
  }
  #fbs-supply-list .fbs-pick-article,
  #fbs-supply-list .fbs-pick-barcode-inline,
  #fbs-supply-list .fbs-pick-place,
  #fbs-supply-list .fbs-pick-qty {
    vertical-align: middle;
  }
  #fbs-supply-list .fbs-pick-place {
    color: #475569;
    font-weight: 500;
  }
  #fbs-supply-list .fbs-pick-qty {
    color: var(--ui-accent-hover);
    font-weight: 700;
  }
  #fbs-supply-list .fbs-pick-status {
    font-size: .66rem;
    line-height: 1.2;
  }
  /* Все значения внешних колонок начинают строку от одного верхнего края. У WB
     первая ячейка выше из-за ряда грузомест; vertical-align: middle центрировал
     соседние ID, документы, сдачу, действие и ответственного и уводил их вниз. */
  #fbs-supply-list > tbody > tr.fbs-supply-row > td {
    vertical-align: top !important;
  }
  #fbs-supply-list th.fbs-supply-external-heading,
  #fbs-supply-list td.fbs-supply-external {
    padding-left: 1rem !important;
  }
  #fbs-supply-list td.fbs-supply-external { width: 8.5rem; }
  /* Desktop-статус площадки закреплён за ячейкой ID поставки. Значения здесь
     намеренно важнее общих и responsive-правил состояния FBS ниже по файлу. */
  #fbs-supply-list td.fbs-supply-external .fbs-supply-market-state--body {
    color: #94a3b8 !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 16px !important;
  }
  #fbs-supply-list td.fbs-supply-docs-desktop { width: 8rem; }
  #fbs-supply-list td.fbs-supply-owner {
    width: 10rem;
    max-width: 10rem;
  }
}

.fbs-supply-overdue-mobile { display: none; }
.fbs-pick-place-icon { display: none; }

/* ── FBS: документы «В сборке» на телефоне ────────────────────────────────
   Общий responsive-каркас полезен для простых таблиц, но у строки поставки семь
   разнородных колонок. На 390 px он принудительно показывал даже desktop-only
   ячейки и складывал их в узкий столбик: название распадалось по буквам, дата и
   документы уезжали вправо, а скрытый состав выглядел второй самостоятельной
   карточкой. Здесь одна поставка становится одной понятной мобильной карточкой;
   ссылки и формы остаются прежними. */
@media (max-width: 640px) {
  #fbs-supply-list > tbody > tr.fbs-supply-separator {
    display: none !important;
  }
  #fbs-supply-list .fbs-pick-metrics {
    flex-direction: column;
    align-items: flex-start;
    gap: .08rem;
    line-height: 1.2;
  }
  #fbs-supply-list .fbs-pick-metrics > span + span::before {
    display: none;
  }
  #fbs-supply-list .fbs-pick-toolbar {
    display: grid;
    grid-template-columns: auto auto auto minmax(0, 1fr);
    gap: .25rem;
    align-items: center;
    margin-top: .3rem;
    padding: .05rem .45rem 0;
  }
  #fbs-supply-list .fbs-pick-toolbar .fbs-pick-label {
    display: inline;
    grid-column: 1;
    grid-row: 1;
  }
  #fbs-supply-list .fbs-pick-toolbar .fbs-pick-metrics {
    grid-column: 4;
    grid-row: 1;
    margin-left: 0 !important;
    align-items: flex-end;
    color: #94a3b8;
    font-size: .64rem;
    line-height: 1.12;
    text-align: right;
  }
  #fbs-supply-list .fbs-pick-toolbar .fbs-pick-metrics b {
    color: #64748b;
    font-size: inherit;
    font-weight: 600;
  }
  #fbs-supply-list .fbs-pick-toolbar .pick-view-btn {
    grid-row: 1;
    width: auto;
    min-height: 1.42rem;
    padding: .18rem .36rem;
    border-radius: .35rem;
    font-size: .65rem;
    font-weight: 500;
    line-height: 1.1;
  }
  #fbs-supply-list .fbs-pick-toolbar .pick-view-btn[data-view="bypack"] { grid-column: 2; }
  #fbs-supply-list .fbs-pick-toolbar .pick-view-btn[data-view="byart"] { grid-column: 3; }
  #fbs-supply-list > tbody > tr.fbs-supply-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto;
    column-gap: 6px;
    row-gap: .16rem;
    position: relative;
    width: 100% !important;
    padding: 8px !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td {
    width: auto !important;
    min-width: 0;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td::before {
    display: none !important;
  }

  /* Документы на телефоне повторены в блоке действий. ID скрыт, но лежащий в его
     ячейке статус выпускаем в сетку карточки через `display: contents`. */
  #fbs-supply-list td.fbs-supply-docs-desktop {
    display: none !important;
  }

  #fbs-supply-list td.fbs-supply-external {
    display: contents !important;
  }
  #fbs-supply-list td.fbs-supply-composition {
    display: none !important;
  }

  #fbs-supply-list .fbs-supply-external-id {
    display: none !important;
  }

  #fbs-supply-list td.fbs-supply-summary { display: contents !important; }
  #fbs-supply-list td.fbs-supply-summary > .fbs-mobile-document-header {
    grid-column: 1 / -1;
    grid-row: 1;
    min-width: 0;
  }
  #fbs-supply-list .fbs-supply-progress {
    display: contents;
  }
  #fbs-supply-list .fbs-supply-state {
    display: inline-flex;
    grid-column: 2;
    grid-row: 3;
    flex: 0 1 auto;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-content: center;
    justify-self: end;
    align-self: center;
    text-align: center;
    min-height: 0;
    margin-top: 0 !important;
    padding: 0;
    gap: 2px;
    border: 0;
    background: transparent;
    font-size: .61rem;
    font-weight: 500;
    line-height: 1.15;
  }
  #fbs-supply-list .fbs-supply-state .fbs-supply-market-state {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
  }
  #fbs-supply-list .fbs-supply-state-platform { display: none; }
  #fbs-supply-list .fbs-supply-market-state-source { display: none; }
  #fbs-supply-list .fbs-supply-market-state::before {
    display: none;
  }
  #fbs-supply-list .fbs-supply-market-state {
    overflow: hidden;
    max-width: 80px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #fbs-supply-list .fbs-supply-cancelled-during-pick {
    margin-right: .25rem;
  }
  #fbs-supply-list .fbs-supply-metrics {
    display: inline-flex;
    grid-column: 3;
    grid-row: 3;
    flex: 0 0 auto;
    justify-self: end;
    align-self: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .15rem .25rem;
    margin-top: 0 !important;
    text-align: right;
  }
  #fbs-supply-list .fbs-supply-counts {
    display: inline-flex;
    align-items: baseline;
    gap: .1rem;
    color: #64748b;
    font-size: .61rem;
    line-height: 1.15;
    white-space: nowrap;
  }
  #fbs-supply-list .fbs-supply-fact {
    padding: 0;
    line-height: 1.15;
    white-space: nowrap;
  }
  #fbs-supply-list .fbs-supply-fact-separator { display: none; }
  #fbs-supply-list .fbs-supply-progress ~ div { grid-column: 1 / -1; }

  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-date {
    min-width: 0;
    padding: 0 !important;
    border-top: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-date::before {
    content: "Сдача";
    display: inline !important;
    margin: 0;
    color: #94a3b8;
    font-size: .61rem;
    font-weight: 400;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  #fbs-supply-list .wms-document-date-full { display: none; }
  #fbs-supply-list .wms-document-date-short { display: inline; }
  #fbs-supply-list td.fbs-supply-date > .text-xs {
    margin: 0 !important;
    font-size: .61rem;
  }
  #fbs-supply-list .fbs-supply-overdue-desktop {
    display: none;
  }
  #fbs-supply-list .fbs-supply-overdue-mobile {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    flex: 0 0 auto;
    color: #be123c;
    font-weight: 600;
    line-height: 1.15;
    white-space: nowrap;
  }

  #fbs-supply-list td.fbs-supply-actions {
    display: grid !important;
    align-self: start;
    width: 100% !important;
    padding: 0 0 .4rem .65rem !important;
    text-align: right;
  }
  #fbs-supply-list td.fbs-supply-actions > div:first-child {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: .25rem;
    margin: 0 !important;
  }
  #fbs-supply-list .fbs-trbx-mobile-doc-row {
    display: flex;
    width: 100%;
    flex: 0 0 100%;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    margin-top: 4px;
  }
  #fbs-supply-list td.fbs-supply-actions .doc-icon {
    width: 2.15rem;
    height: 2.15rem;
    border-radius: .42rem;
    font-size: .875rem;
  }
  #fbs-supply-list td.fbs-supply-actions .ui-icon {
    width: 20px;
    height: 20px;
    stroke-width: 1.7;
  }
  #fbs-supply-list td.fbs-supply-actions > .wms-document-actions > .wms-document-action-form {
    display: block;
    width: auto;
  }
  #fbs-supply-list td.fbs-supply-actions:has(> .wms-document-actions > :is(.wms-document-action-form, .wms-document-action, .wms-document-action-slot)) {
    display: grid !important;
    position: static;
    top: auto;
    right: auto;
    grid-column: 3;
    grid-row: 4;
    justify-self: end;
    align-self: center;
    padding: 0 !important;
    border-top: 0;
    text-align: right;
  }
  #fbs-supply-list td.fbs-supply-actions:has(> .wms-document-actions > :is(.wms-document-action-form, .wms-document-action, .wms-document-action-slot)) > .wms-document-actions > :is(.wms-document-action-form, .wms-document-action) {
    display: inline-flex;
  }
  #fbs-supply-list td.fbs-supply-actions > .wms-document-actions > .wms-document-action-form > .wms-document-action,
  #fbs-supply-list td.fbs-supply-actions > .wms-document-actions > .wms-document-action {
    width: auto;
    min-height: 1.85rem;
    padding: .32rem .6rem;
    font-size: .72rem;
    white-space: nowrap;
  }

  #fbs-supply-list td.fbs-supply-owner {
    display: none !important;
    grid-column: 1 / -1;
    grid-row: 4;
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    align-items: center;
    margin-top: 0 !important;
    padding: 0 !important;
    border-top: 0 !important;
    border-radius: 0;
    background: transparent;
    color: #64748b;
    font-size: .68rem;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.ship-open > td.fbs-supply-owner {
    display: none !important;
  }
  #fbs-supply-list td.fbs-supply-owner > div {
    margin: 0 !important;
  }
  #fbs-supply-list .fbs-owner-people {
    grid-column: 1;
    grid-row: 1;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: .22rem;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  #fbs-supply-list .fbs-owner-people > .ui-picker,
  #fbs-supply-list .fbs-owner-people > .fbs-owner-role {
    width: 100%;
    min-width: 0;
  }
  #fbs-supply-list .fbs-owner-role {
    box-sizing: border-box;
    align-items: center;
    width: 100%;
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    padding: 2px .92rem 2px .3rem;
    overflow: hidden;
    border: 1px solid #e3e7ed;
    border-radius: .48rem;
    background: rgb(255 255 255 / 78%);
    box-shadow: none;
    font-size: .64rem;
    line-height: 1.15;
  }
  #fbs-supply-list .fbs-owner-role:hover,
  #fbs-supply-list .fbs-owner-role:focus-visible {
    border-color: #cbd5e1;
    background: #fff;
  }
  #fbs-supply-list .fbs-owner-label {
    display: inline-flex;
    align-items: center;
    width: 1.18rem;
    color: #777487;
  }
  #fbs-supply-list .fbs-owner-label-text { display: none; }
  #fbs-supply-list .fbs-owner-label-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  #fbs-supply-list .fbs-owner-label-icon .ui-action-icon {
    width: 1.08rem;
    height: 1.08rem;
    stroke-width: 1.35;
  }
  #fbs-supply-list .fbs-owner-people > :nth-child(2) .fbs-owner-label {
    color: #6f8588;
  }
  #fbs-supply-list .fbs-owner-name-compact,
  #fbs-supply-list .fbs-owner-unassigned {
    min-width: 0;
    overflow: hidden;
    line-height: 1;
    text-overflow: ellipsis;
    color: #475569;
    font-size: .62rem;
    font-weight: 400;
  }
  #fbs-supply-list .fbs-owner-unassigned {
    color: #d97706;
  }
  #fbs-supply-list .fbs-owner-people .ui-picker > summary::after {
    right: .2rem;
  }
  #fbs-supply-list .fbs-owner-name-full { display: none; }
  #fbs-supply-list .fbs-owner-name-compact { display: inline; }
  #fbs-supply-list .ui-picker-menu {
    grid-template-columns: 1fr;
    width: 13rem;
    max-height: 10rem;
    padding: .3rem;
  }
  #fbs-supply-list .ui-picker:nth-child(2) .ui-picker-menu {
    right: 0;
    left: auto;
  }
  #fbs-supply-list .ui-picker-option {
    min-height: 2.15rem;
    font-size: .68rem;
  }
  #fbs-supply-list .fbs-owner-created {
    display: none;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:has(td.fbs-supply-actions > .wms-document-actions > :is(.wms-document-action-form, .wms-document-action, .wms-document-action-slot)) > td.fbs-supply-summary {
    grid-column: 1 / -1;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:has(td.fbs-supply-actions > .wms-document-actions > :is(.wms-document-action-form, .wms-document-action, .wms-document-action-slot)) > td.fbs-supply-owner {
    grid-row: 4;
    grid-column: 1 / 3;
  }

  /* Общий карточный стиль не должен раскрывать строки состава сам по себе. */
  #fbs-supply-list > tbody > tr.ship-detail.hidden {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) > td {
    display: block !important;
    width: 100% !important;
    padding: .5rem 0 0 !important;
    margin: 0 !important;
    border: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) > td.fbs-supply-detail-cell {
    padding-top: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) > td::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.responsive {
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.responsive > tbody > tr {
    margin: 0 .45rem .32rem;
    padding: .42rem .65rem;
    border: 1px solid rgb(148 163 184 / 22%);
    border-radius: .48rem;
    background: #fff;
    box-shadow: 0 1px 2px rgb(15 23 42 / 3%);
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.responsive > tbody > tr:last-child {
    margin-bottom: .45rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.responsive.responsive-compact td {
    padding: .12rem 0;
    font-size: .72rem;
    line-height: 1.15;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.responsive.responsive-compact td::before {
    font-size: .59rem;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.responsive.responsive-compact td:last-child {
    margin-top: .18rem;
    padding-top: .25rem;
  }
  /* ШК — рабочая пара артикула. Бледная служебная подпись выглядела как отсутствие
     данных, поэтому на телефоне он остаётся компактным, но читается сразу под товаром. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-cell {
    color: #475569;
    font-size: .7rem;
    font-weight: 500;
    letter-spacing: .012em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-cell::before {
    color: #7c6f9f;
    font-weight: 700;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-inline {
    display: flex;
    align-items: baseline;
    gap: .28rem;
    margin-top: .16rem;
    color: #64748b;
    font-family: inherit;
    font-size: .68rem;
    line-height: 1.2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-inline > span {
    color: #7c6f9f;
    font-size: .58rem;
    font-weight: 700;
    letter-spacing: .045em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-inline > b {
    color: #475569;
    font-weight: 500;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-order-actions {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    gap: .28rem;
    min-width: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-order-actions::before {
    margin-right: auto;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .ui-action--compact {
    min-height: 1.8rem;
    padding: .32rem .52rem;
  }

  /* На телефоне строка идёт спокойным маршрутом:
     артикул+ШК и количество → место → полная этикетка. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr.fbs-pick-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 3.15rem;
    grid-auto-rows: min-content;
    column-gap: .55rem;
    row-gap: .16rem;
    padding: .55rem .62rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table td {
    min-width: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-article {
    display: block !important;
    grid-column: 1;
    grid-row: 1;
    padding: 0 !important;
    color: #273449;
    font-size: .74rem;
    font-weight: 700;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-article::before,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-place::before,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-qty::before {
    display: block;
    margin: 0 0 .16rem;
    color: #8b95a7;
    font-size: .55rem;
    font-weight: 650;
    line-height: 1;
    letter-spacing: .045em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-inline {
    display: flex !important;
    align-items: baseline;
    justify-content: flex-start;
    gap: .22rem;
    padding: .08rem 0 0 !important;
    color: #64748b;
    font-size: .68rem;
    font-weight: 400;
    letter-spacing: 0;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-inline > span,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-inline > b {
    color: #64748b;
    font-size: inherit;
    font-weight: 400;
    letter-spacing: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-barcode-inline > span {
    color: #94a3b8;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-mobile-order {
    margin-top: .12rem;
    color: #9aa4b4;
    font-size: .58rem;
    font-weight: 400;
    line-height: 1.1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-place {
    display: block !important;
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: .18rem;
    padding: .34rem 0 0 !important;
    border-top: 1px solid #edf0f5;
    color: #475569;
    font-size: .68rem;
    font-weight: 500;
    line-height: 1.25;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-qty {
    display: flex !important;
    grid-column: 2;
    grid-row: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 2.55rem;
    padding: .25rem .18rem !important;
    border: 1px solid #dddafa;
    border-radius: .45rem;
    background: #f5f3ff;
    color: #4338ca;
    font-size: .86rem;
    font-weight: 700;
    line-height: 1;
    text-align: center;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-qty::before {
    content: "ШТ";
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-qty > span {
    font-size: .52rem;
    line-height: 1.05;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-order {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-sticker {
    display: block !important;
    grid-column: 1 / -1;
    grid-row: 3;
    margin: .2rem 0 0 !important;
    padding: .28rem 0 0 !important;
    border-top: 1px solid #f0f2f6;
    color: #475569;
    font-size: .72rem;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-sticker::before {
    display: block;
    margin: 0 0 .18rem;
    color: #8b95a7;
    font-size: .59rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-sticker .text-\[11px\],
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-sticker b {
    color: #475569;
    font-size: .72rem !important;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-orders {
    display: block !important;
    grid-column: 1 / -1;
    grid-row: 4;
    margin: .2rem 0 0 !important;
    padding: .28rem 0 0 !important;
    border-top: 1px solid #f0f2f6;
    color: #7a8494;
    font-size: .62rem;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-orders::before {
    display: inline;
    margin: 0 .25rem 0 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-status {
    display: block !important;
    grid-column: 1 / -1;
    grid-row: 4;
    margin: .12rem 0 0 !important;
    padding: .3rem 0 0 !important;
    border-top: 1px solid #f0f2f6;
    font-size: .61rem;
    line-height: 1.2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-pick-status::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-order-actions {
    display: flex !important;
    grid-column: 1 / -1;
    grid-row: 5 !important;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    min-height: 2.2rem;
    margin: .08rem 0 0 !important;
    padding: .3rem 0 0 !important;
    overflow: visible !important;
    border-top: 1px solid #f0f2f6;
    opacity: 1 !important;
    visibility: visible !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-order-actions > form,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-order-actions > a,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-order-actions > button {
    display: inline-flex !important;
    flex: 0 0 auto;
  }

  /* ОТКАТ мобильной экспериментальной сетки раскрытых заказов. Строка снова живёт
     обычной карточкой responsive-таблицы; последняя ячейка действий не участвует
     в ручном grid-размещении и поэтому не может исчезнуть за пределами строки. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr.fbs-pick-row {
    display: block !important;
    padding: .45rem .65rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr.fbs-pick-row > td {
    display: block !important;
    width: 100% !important;
    min-height: 0;
    margin: 0 !important;
    padding: .14rem 0 !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0;
    background: transparent;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table > tbody > tr.fbs-pick-row > td::before {
    display: block;
    margin: 0 0 .12rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-barcode-inline {
    color: #64748b;
    font-family: inherit;
    font-size: .68rem;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-barcode-inline > span,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-barcode-inline > b {
    color: #64748b;
    font-size: inherit;
    font-weight: 400;
    letter-spacing: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-barcode-inline > span {
    color: #94a3b8;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-qty {
    color: #475569;
    font-size: .72rem;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-qty::before {
    content: attr(data-label);
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-sticker,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-status {
    color: #475569;
    font-size: .72rem;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-pick-status::before {
    display: block !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-order-actions {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    width: 100% !important;
    min-height: 2.2rem;
    margin-top: .25rem !important;
    padding-top: .35rem !important;
    border-top: 1px solid #e2e8f0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table .fbs-order-actions::before {
    display: none !important;
  }

  /* «По-артикульно»: рабочая иерархия сборщика — товар и количество наверху,
     место следующим уровнем, этикетки и заказы спокойным справочным хвостом. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 3.2rem;
    column-gap: .55rem;
    row-gap: 0;
    padding: .5rem .65rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td {
    display: block !important;
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    padding: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-article {
    grid-column: 1;
    grid-row: 1;
    color: #273449;
    font-size: .78rem;
    font-weight: 650;
    line-height: 1.25;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-article::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline {
    margin-top: .12rem;
    padding: 0 !important;
    color: #94a3b8;
    font-size: .64rem;
    line-height: 1.15;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline > span,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline > b {
    color: #94a3b8;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty {
    display: flex !important;
    grid-column: 2;
    grid-row: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: start;
    min-height: 2.35rem;
    padding: .22rem .16rem !important;
    border: 1px solid #cfc7f7 !important;
    border-radius: .42rem;
    color: #6756bd;
    font-size: .8rem;
    font-weight: 650;
    line-height: 1;
    text-align: center;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty::before {
    content: "ШТ";
    display: block;
    margin: 0 0 .16rem;
    color: #8a7bc8;
    font-size: .5rem;
    font-weight: 600;
    letter-spacing: .04em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty > span {
    margin-top: .1rem;
    font-size: .5rem;
    line-height: 1.1;
    text-align: center;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-place {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: .38rem !important;
    padding-top: .34rem !important;
    border-top: 1px solid #edf0f5 !important;
    color: #475569;
    font-size: .7rem;
    font-weight: 500;
    line-height: 1.25;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-place::before {
    display: inline;
    margin: 0 .3rem 0 0;
    color: #9aa3b2;
    font-size: .52rem;
    font-weight: 600;
    letter-spacing: .04em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-orders {
    grid-column: 1 / -1;
    margin-top: .28rem !important;
    padding-top: .28rem !important;
    border-top: 1px solid #f0f2f6 !important;
    color: #7c8798;
    font-size: .64rem;
    font-weight: 400;
    line-height: 1.25;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker { grid-row: 3; }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-orders { grid-row: 4; }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker::before,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-orders::before {
    display: inline;
    margin: 0 .3rem 0 0;
    color: #9aa3b2;
    font-size: .52rem;
    font-weight: 600;
    letter-spacing: .04em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker .text-\[11px\],
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker b {
    color: #64748b;
    font-size: inherit !important;
    font-weight: 400;
  }

  /* Та же мобильная сетка, что «По упаковке»:
     номера слева, товар справа, затем место, этикетка и количество. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    column-gap: .65rem;
    row-gap: .08rem;
    padding: .3rem .55rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-orders {
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    color: #475569;
    font-size: .72rem;
    line-height: 1.2;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-orders::before {
    content: "№";
    display: inline;
    margin: 0 .24rem 0 0;
    color: #8b95a7;
    font-size: .56rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-article {
    display: flex !important;
    grid-column: 2;
    grid-row: 1;
    flex-direction: column;
    align-items: flex-end;
    align-self: start;
    justify-self: end;
    width: 100%;
    color: #334155;
    font-size: .76rem;
    font-weight: 600;
    line-height: 1.2;
    text-align: right !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline {
    justify-content: flex-end;
    margin-top: .08rem;
    color: #94a3b8;
    font-size: .66rem;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline > span,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline > b {
    color: #94a3b8;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-place {
    display: flex !important;
    grid-column: 1 / -1;
    grid-row: 2;
    align-items: baseline;
    justify-content: space-between;
    gap: .35rem;
    margin: 0 !important;
    padding: .12rem 0 0 !important;
    border: 0 !important;
    color: #475569;
    font-size: .72rem;
    font-weight: 400;
    line-height: 1.2;
    text-align: left !important;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-place::before {
    flex: 0 0 auto;
    margin: 0;
    color: #8b95a7;
    font-size: .56rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-place-value {
    min-width: 0;
    margin-left: auto;
    overflow: hidden;
    color: #475569;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker {
    display: grid !important;
    grid-column: 1 / -1;
    grid-row: 3;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: .1rem;
    min-width: 0;
    margin: 0 !important;
    padding: 0 3.35rem 0 0 !important;
    overflow: hidden !important;
    border: 0 !important;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker-label {
    display: inline !important;
    color: #8b95a7;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker-label .ui-action-icon {
    width: 1.08rem;
    height: .72rem;
    stroke-width: 1.5;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-sticker-value {
    display: inline-flex;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty {
    display: inline-flex !important;
    grid-column: 2;
    grid-row: 3;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    justify-self: end;
    align-self: center;
    z-index: 1;
    gap: .22rem;
    width: auto !important;
    min-width: 2.9rem;
    min-height: 1.3rem;
    margin: 0 !important;
    padding: .13rem .34rem !important;
    border: 1px solid #8b82df !important;
    border-radius: .34rem;
    background: #fff;
    color: #5147aa;
    font-size: .72rem;
    font-weight: 650;
    line-height: 1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty::before {
    content: "ШТ";
    display: inline;
    margin: 0;
    color: #655ab9;
    font-size: .56rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty > span {
    margin: 0;
    font-size: .5rem;
    line-height: 1.05;
  }

  /* «По упаковке»: в верхней строке карточки заказ слева, товар справа.
     ШК остаётся второй строкой того же правого блока. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr.fbs-pack-row {
    display: grid !important;
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    column-gap: .65rem;
    row-gap: 0;
    padding: .48rem .65rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr.fbs-pack-row > td {
    grid-column: 1 / -1;
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
    padding: .18rem 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-order {
    display: block !important;
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    color: #475569;
    font-family: inherit;
    font-size: .72rem;
    font-weight: 400;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-product {
    display: block !important;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    color: #334155;
    font-size: .76rem;
    text-align: right;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-product::before {
    display: block;
    margin: 0 0 .14rem;
    color: #8b95a7;
    font-size: .56rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-product::before {
    display: none;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-barcode {
    margin-top: .14rem;
    color: #64748b;
    font-family: inherit;
    font-size: .66rem;
    font-weight: 400;
    line-height: 1.15;
    text-align: right;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-place {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: .18rem !important;
    padding-top: .34rem !important;
    border-top: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker {
    display: grid !important;
    grid-column: 1 / -1;
    grid-row: 3;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    min-width: 0;
    gap: .08rem;
    padding: .34rem 0 0 !important;
    overflow: hidden !important;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker .text-\[11px\] {
    color: #64748b;
    font-size: .68rem !important;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker b {
    color: #334155;
    font-size: .75rem !important;
    font-weight: 600;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-label {
    display: inline !important;
    flex: 0 0 auto;
    color: #8b95a7;
    font-size: .56rem !important;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-label .ui-action-icon {
    width: 1.08rem;
    height: .72rem;
    stroke-width: 1.5;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-value {
    display: inline-flex;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty-mobile {
    display: inline-flex !important;
    align-items: center;
    gap: .22rem;
    margin-left: .4rem;
    padding: .18rem .34rem;
    border: 1px solid #c7c5f2;
    border-radius: .34rem;
    background: transparent;
    color: #6258b5;
    font-size: .54rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty-mobile > b {
    color: #4f46e5;
    font-size: .74rem !important;
    font-weight: 700;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty {
    display: none !important;
    grid-column: 1 / -1;
    grid-row: 3;
    align-items: center;
    justify-self: end;
    position: relative;
    z-index: 1;
    gap: .22rem;
    width: auto !important;
    margin-top: .2rem !important;
    padding: .24rem .42rem !important;
    border: 1px solid #dddafa !important;
    border-radius: .42rem;
    background: #f5f3ff;
    color: #4338ca;
    font-size: .74rem;
    font-weight: 700;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty::before {
    display: inline;
    margin: 0;
    color: #7c75b8;
    font-size: .54rem;
    font-weight: 600;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status {
    display: block !important;
    grid-column: 1;
    grid-row: 4;
    align-self: center;
    width: auto !important;
    padding-top: .3rem !important;
    text-align: left !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status .ui-status-dot {
    justify-content: flex-start;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-order-actions {
    display: flex !important;
    grid-column: 2;
    grid-row: 4 !important;
    align-items: center;
    justify-content: flex-end;
    align-self: center;
    width: auto !important;
    min-height: 0;
    margin: 0 !important;
    padding: .24rem 0 0 !important;
    border-top: 0 !important;
  }

  /* Единая мобильная типографика и ритм карточки «По упаковке». */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr.fbs-pack-row {
    row-gap: .08rem;
    padding: .3rem .55rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr.fbs-pack-row > td {
    color: #475569;
    font-family: inherit;
    font-size: .72rem;
    font-weight: 400;
    line-height: 1.2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr.fbs-pack-row > td::before,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-label,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty-mobile > span {
    color: #8b95a7;
    font-size: .56rem !important;
    font-weight: 600;
    line-height: 1;
    letter-spacing: .035em;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-order,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-product {
    padding: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-product {
    color: #334155;
    font-size: .76rem;
    font-weight: 600;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-barcode {
    margin-top: .08rem;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.15;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-place {
    display: flex !important;
    align-items: baseline;
    gap: .3rem;
    margin: 0 !important;
    padding: .12rem 0 0 !important;
    border-top: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-place::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-place-icon {
    display: inline-flex;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker {
    gap: .1rem;
    padding: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-value .text-\[11px\],
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-sticker-value b {
    color: #94a3b8;
    font-size: 10px !important;
    font-weight: 400;
    line-height: 1.2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty-mobile {
    align-items: baseline;
    justify-content: center;
    justify-self: end;
    min-width: 2.9rem;
    margin-left: .42rem;
    padding: .13rem .34rem;
    border-color: #8b82df;
    color: #5147aa;
    line-height: 1;
    text-align: center;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty-mobile > span {
    color: #655ab9 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-qty-mobile > b {
    color: #4f46b8;
    font-size: .72rem !important;
    font-weight: 600;
    line-height: 1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table--archive .fbs-pack-status {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table--archive-labels .fbs-pack-status {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status .ui-status-dot {
    margin: 0;
    font-size: .7rem;
    font-weight: 400;
    line-height: 1.15;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-mobile-state {
    display: block !important;
    grid-column: 1 / -1;
    grid-row: 4;
    align-self: center;
    min-width: 0;
    margin: 0;
    padding: .22rem 0 0 !important;
    border: 0 !important;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table tr:has(> .fbs-order-actions) > .fbs-pack-mobile-state {
    grid-column: 1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-order-actions {
    grid-column: 2;
    grid-row: 4 !important;
    gap: .28rem;
    width: auto !important;
    margin-top: 0 !important;
    padding: .22rem 0 0 !important;
    border-top: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-order-actions > form {
    align-items: center;
    gap: .3rem;
    min-width: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception {
    flex: 0 0 1.8rem;
    justify-content: center;
    width: 1.8rem;
    min-width: 1.8rem;
    padding: .3rem !important;
    border-color: var(--ui-accent-line);
    background: var(--ui-accent-soft);
    color: var(--ui-accent-hover);
    box-shadow: none;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception :is(.ui-action-icon,.ui-system-icon) {
    width: 1.12rem;
    height: 1.12rem;
    stroke-width: 1.4;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception > span:not(.ui-system-icon) {
    display: none;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception + .fbs-pack-direct {
    margin-left: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-direct {
    flex: 0 0 auto;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status-mobile {
    display: inline-flex !important;
    align-items: center;
    margin-right: auto;
    color: #475569;
    font-size: .7rem;
    font-weight: 400;
    line-height: 1.15;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status-mobile:has(.fbs-return-to-shelf--mobile) {
    flex: 1 1 0;
    min-width: 0;
    flex-direction: row;
    align-items: flex-start;
    gap: 8px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status-mobile:has(.fbs-return-to-shelf--mobile) > .ui-status-dot,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-status-mobile:has(.fbs-return-to-shelf--mobile) > .fbs-return-to-shelf--mobile {
    flex: 0 0 auto;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    .fbs-pack-status-mobile:has(.fbs-undelivered-order--mobile) {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    .fbs-undelivered-order--mobile {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pack-table tr:has(.fbs-return-to-shelf--mobile) > .fbs-pack-mobile-state {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  /* У отменённого после сборки заказа статус и физическое действие занимают
     отдельный верхний ряд. Рабочие реквизиты сдвигаются ниже той же сеткой и
     больше не пересекаются с двухстрочным красным предупреждением. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pick-table--bypack tr:has(.fbs-return-to-shelf--mobile) .fbs-pack-status-mobile {
    display: grid !important;
    width: 100%;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: start;
    column-gap: 8px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pick-table--bypack tr:has(.fbs-return-to-shelf--mobile) .fbs-return-to-shelf-copy {
    flex-direction: row;
    gap: 3px;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pick-table--bypack tr:has(.fbs-return-to-shelf--mobile) .fbs-return-to-shelf--mobile {
    justify-self: end;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pick-table--bypack tr:has(.fbs-return-to-shelf--mobile) .fbs-pack-product-line {
    grid-row: 2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pick-table--bypack tr:has(.fbs-return-to-shelf--mobile) :is(.fbs-pack-order-number, .fbs-pack-barcode) {
    grid-row: 3;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pick-table--bypack tr:has(.fbs-return-to-shelf--mobile) :is(.fbs-pack-sticker-label, .fbs-pack-sticker-value, .fbs-pack-place) {
    grid-row: 4;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pick-table--bypack tr:has(.fbs-return-to-shelf--mobile) > .fbs-pack-assignment-mobile {
    grid-row: 5;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):not(.fbs-supply-status-picking)
    table.fbs-pack-table tr:has(.fbs-return-to-shelf--mobile) > .fbs-order-actions {
    grid-column: 2;
    grid-row: 5 !important;
    justify-self: end;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-return-to-shelf--mobile {
    display: inline-flex;
    min-width: 0;
    align-items: flex-start;
    gap: 3px;
    color: #be123c;
    font-size: 10px;
    font-weight: 600;
    line-height: 12px;
    white-space: normal;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-return-to-shelf--mobile .fbs-return-to-shelf-icon {
    flex: 0 0 10px;
    width: 10px;
    height: 10px;
    margin-top: 1px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-return-to-shelf--mobile .fbs-return-to-shelf-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-start;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-return-to-shelf--mobile .fbs-return-to-shelf-copy > span {
    white-space: nowrap;
  }
  /* Тот же fallback для лениво открытого состава, который сервер успел отдать до
     правки Jinja: в старом DOM mobile-state на `packed` нет, но каноническая
     desktop-ячейка уже содержит оба нужных текста. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    tr.fbs-pack-row:not(:has(.fbs-pack-mobile-state)):has(.fbs-return-to-shelf) > .fbs-pack-status {
    display: block !important;
    grid-column: 1 / -1;
    grid-row: 4;
    width: 100% !important;
    padding: .22rem 0 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    tr.fbs-pack-row:not(:has(.fbs-pack-mobile-state)):has(.fbs-return-to-shelf) > .fbs-order-actions {
    grid-column: 1 / -1;
    grid-row: 5 !important;
    justify-self: end;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    tr.fbs-pack-row:not(:has(.fbs-pack-mobile-state)):has(.fbs-return-to-shelf) .fbs-order-state-primary {
    display: grid;
    width: 100%;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: start;
    gap: 8px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    tr.fbs-pack-row:not(:has(.fbs-pack-mobile-state)):has(.fbs-return-to-shelf) .fbs-return-to-shelf {
    display: inline-flex;
    min-width: 0;
    align-items: flex-start;
    gap: 3px;
    color: #be123c;
    font-size: 10px;
    font-weight: 600;
    line-height: 12px;
    white-space: normal;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    tr.fbs-pack-row:not(:has(.fbs-pack-mobile-state)):has(.fbs-return-to-shelf) .fbs-return-to-shelf-icon {
    flex: 0 0 10px;
    width: 10px;
    height: 10px;
    margin-top: 1px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-order-actions .ui-action--compact {
    min-height: 1.8rem;
    padding: .3rem .48rem;
    font-size: .68rem;
    line-height: 1;
  }
  /* «По заказам»: одна карточная сетка от «В работе» до архива. Статус поставки
     меняет доступные действия в Jinja, но не геометрию одних и тех же данных. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack > tbody > tr.fbs-pack-row {
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-order {
    display: contents !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-order::before {
    display: none !important;
    content: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-order-number {
    grid-column: 1;
    grid-row: 2;
    align-self: start;
    color: #475569;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-order-number::before {
    content: "№";
    display: inline-flex;
    width: .72rem;
    height: .72rem;
    align-items: center;
    justify-content: flex-start;
    margin-right: .08rem;
    color: #94a3b8;
    font-size: .56rem;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .035em;
    vertical-align: middle;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-product,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-sticker {
    display: contents !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-product-line {
    display: flex;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    align-items: baseline;
    justify-content: flex-end;
    gap: .28rem;
    min-width: 0;
    width: max-content;
    max-width: none;
    text-align: right;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-product-line > b {
    flex: 0 0 auto;
    min-width: 0;
    font-size: 11px;
    line-height: 1.1;
    letter-spacing: -.015em;
    white-space: nowrap;
  }
  .wms-mobile-qty-pill {
    display: inline-flex !important;
    box-sizing: border-box;
    flex: 0 0 auto;
    align-items: baseline;
    justify-content: flex-end;
    gap: .22rem;
    min-width: 0;
    height: 18px;
    margin: 0;
    padding: 2px 5px;
    border: 1px solid #8b82df;
    border-radius: 5px;
    background: transparent;
    color: #655ab9;
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    font-size: 8px;
    line-height: 1;
    letter-spacing: .02em;
    white-space: nowrap;
  }
  .wms-mobile-qty-pill > b {
    color: #4f46b8;
    font-size: 12px !important;
    font-weight: 600;
    line-height: 1;
  }
  .wms-mobile-qty-pill > span {
    font-size: 8px !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-barcode {
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    justify-self: end;
    margin: 0;
    text-align: right;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-sticker-label {
    display: inline-flex !important;
    grid-column: 1;
    grid-row: 3;
    align-self: center;
    justify-self: start;
    width: .72rem;
    height: .72rem;
    align-items: center;
    justify-content: flex-start;
    color: #94a3b8;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-sticker-label .ui-action-icon {
    width: .72rem;
    height: .62rem;
    stroke-width: 1.4;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-sticker-value {
    grid-column: 1;
    grid-row: 3;
    align-self: center;
    justify-self: start;
    max-width: 100%;
    padding-left: .8rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-reassign-check--desktop {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-assignment-mobile {
    display: flex !important;
    grid-column: 1;
    grid-row: 4;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    align-self: end;
    justify-self: start;
    position: relative;
    z-index: 2;
    min-width: 0;
    margin: 0;
    padding: 0 !important;
    border: 0 !important;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-picker-desktop {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-mobile-state {
    display: block !important;
    grid-column: 1;
    grid-row: 1;
    align-self: start;
    min-width: 0;
    padding: 0 !important;
    border: 0 !important;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-mobile-state .fbs-pack-status-mobile {
    display: inline-flex !important;
    margin: 0;
    color: #475569;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.15;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-mobile-state .fbs-pack-status-mobile .ui-status-dot {
    display: inline-grid;
    grid-template-columns: .72rem max-content;
    align-items: center;
    column-gap: .08rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-mobile-state .fbs-pack-status-mobile .ui-status-dot::before {
    justify-self: start;
  }
  /* #1845: у склада партнёра слов три строки — метка встаёт ПОД статус и переносится по
     ширине ячейки; в строку со статусом она сжималась до столбика в одну букву. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    .fbs-pack-mobile-state .fbs-pack-status-mobile:has(.fbs-undelivered-order--partner) {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    white-space: normal;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    .fbs-pack-mobile-state .fbs-undelivered-order--mobile.fbs-undelivered-order--partner {
    flex: 0 0 auto;
    max-width: 100%;
    white-space: normal;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-assignment-mobile .fbs-pack-picker-mobile {
    display: block !important;
    flex: 0 0 auto;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-assignment-mobile .fbs-pack-picker-mobile.fbs-pack-picker--missing {
    color: #d97706;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-reassign-check--mobile {
    flex: 0 0 auto;
    gap: 0;
    box-sizing: border-box;
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    margin: -7px !important;
    touch-action: manipulation;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-pack-place {
    grid-column: 2;
    grid-row: 3;
    justify-self: end;
    text-align: right;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--bypack .fbs-order-actions {
    grid-row: 4 !important;
    position: relative;
    z-index: 1;
  }
  .wms-return-pick-action:hover:not(:disabled) {
    border-color: transparent;
    background: transparent;
    color: #7c8798;
  }
  .wms-return-pick-action {
    box-sizing: border-box;
    direction: ltr;
    flex-direction: row !important;
    justify-content: flex-end;
    width: auto;
    height: auto;
    min-height: 1.8rem;
    max-height: none;
    gap: .12rem;
    padding: .3rem 0 .3rem .48rem !important;
    border-color: transparent;
    background: transparent;
    color: #7c8798;
    font-size: .68rem;
    font-weight: 400;
    line-height: 1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-unpack-cancel > .ui-action-icon {
    order: -1 !important;
    flex: 0 0 auto;
    margin: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-unpack-cancel > span:last-child {
    order: 0 !important;
    flex: 0 0 auto;
    margin-left: 0;
    padding-left: 0;
    text-align: right;
  }
}

/* FBS / «По-артикульно»: мобильная карточка повторяет проверенную структуру
   «По упаковке». Блок стоит после прежних адаптивных правил намеренно: старые
   селекторы таблицы были специфичнее общих `.fbs-pack-*` и снова разбивали
   место отбора, этикетку и количество на отдельные строки. */
.fbs-pick-ref-trigger { display: none; }
.fbs-pick-ref-dropdown { display: inline; }
.fbs-pick-ref-values { display: inline; }
@media (min-width: 641px) {
  /* Desktop FBS / «По местам»: полные номера остаются в таблице, но внутри каждой
     ячейки идут двумя ровными колонками. Это вдвое сокращает высоту длинной строки,
     не превращая desktop в набор счётчиков и выпадашек. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown {
    display: block;
    width: 100%;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-values {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: baseline;
    gap: .18rem .7rem;
    min-width: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-values > .pick-ref-separator {
    display: none;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-values > .pick-order-number,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-values > .pick-sticker-number {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: .15rem;
    white-space: nowrap;
  }
  /* Количество и пояснение — два уровня, а не одна жирная фраза. Узкая колонка
     больше не переносит «1 из 2 · собрано 1» в случайном месте. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty {
    color: #475569;
    font-weight: 600;
    line-height: 1;
    text-align: center;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty > b {
    display: inline;
    color: #475569;
    font-size: .8rem;
    font-weight: 650;
    line-height: 1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty > .pick-qty-total {
    display: inline;
    color: #94a3b8;
    font-size: .56rem;
    font-weight: 400;
    line-height: 1.15;
    vertical-align: baseline;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-qty > .pick-qty-note {
    display: block;
    margin-top: .16rem;
    color: #94a3b8;
    font-size: .56rem;
    font-weight: 400;
    line-height: 1.15;
    white-space: nowrap;
  }
}
@media (max-width: 640px) {
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row {
    display: grid !important;
    position: relative;
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
    column-gap: .65rem;
    row-gap: .03rem;
    padding: .23rem .5rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td {
    width: auto !important;
    min-width: 0;
    margin: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-values {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown {
    display: inline-block;
    position: relative;
    min-width: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row:has(.fbs-pick-ref-dropdown.is-open) {
    z-index: 30;
  }
  /* Внутреннего z-index недостаточно: следующая поставка — сосед внешней строки
     `ship-detail` и раньше закрашивала хвост длинного списка. Пока список открыт,
     поднимаем вместе с ним всю строку состава. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):has(.fbs-pick-ref-dropdown.is-open) {
    position: relative;
    z-index: 50;
    overflow: visible !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-orders {
    display: contents !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-orders > .fbs-pick-ref-dropdown {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    justify-self: start;
    overflow: visible;
    color: #475569;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-orders > .fbs-pack-picker {
    display: block !important;
    grid-column: 1;
    grid-row: 3;
    align-self: end;
    justify-self: start;
    margin: 0;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 400;
    line-height: 11px;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-orders::before {
    display: none !important;
    content: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-article {
    display: contents !important;
    padding: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-product-line {
    display: flex;
    grid-column: 2;
    grid-row: 1;
    align-self: start;
    justify-self: end;
    align-items: baseline;
    justify-content: flex-end;
    gap: .28rem;
    min-width: 0;
    width: max-content;
    max-width: none;
    color: #334155;
    text-align: right;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-product-line > .fbs-pick-article-value {
    flex: 0 0 auto;
    min-width: 0;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.015em;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline {
    display: block;
    grid-column: 2;
    grid-row: 2;
    align-self: center;
    justify-self: end;
    margin-top: 0;
    color: #94a3b8;
    font-size: 10px;
    font-weight: 400;
    line-height: 1;
    text-align: right;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline > span,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-barcode-inline > b {
    color: #94a3b8;
    font-size: inherit;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-place {
    display: flex !important;
    grid-column: 2;
    grid-row: 3;
    align-items: center;
    justify-content: flex-end;
    justify-self: end;
    gap: .24rem;
    padding: .06rem 0 0 !important;
    border: 0 !important;
    color: #475569;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.2;
    text-align: right !important;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-place::before {
    display: none !important;
    content: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-place-value {
    min-width: 0;
    margin-left: 0;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-sticker {
    display: contents !important;
    padding: 0 !important;
    border: 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-trigger {
    display: inline-flex !important;
    align-items: baseline;
    gap: .18rem;
    width: max-content;
    max-width: 100%;
    padding: 0 0 .02rem;
    border-bottom: 1px dashed #cbd5e1;
    color: #64748b;
    font-size: 10px;
    font-weight: 400;
    line-height: 1.2;
    text-align: left;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-trigger:hover,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-trigger:focus-visible {
    border-bottom-color: #8b82df;
    color: #655ab9;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-trigger:focus-visible {
    border-radius: .18rem;
    outline: 2px solid rgb(139 130 223 / 35%);
    outline-offset: 2px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-trigger:focus:not(:focus-visible) {
    outline: none;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-count {
    color: #94a3b8;
    font-variant-numeric: tabular-nums;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-sticker > .fbs-pick-ref-dropdown {
    grid-column: 1;
    grid-row: 2;
    align-self: center;
    justify-self: start;
  }
  /* Выпадашка остаётся привязана к нажатому тексту внутри карточки: без затемнения
     страницы и центрального диалога. Размер берётся из самого списка; внутренних
     прокруток нет, даже когда номеров 50+. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown.is-open {
    z-index: 40;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown.is-open > .fbs-pick-ref-values {
    display: grid !important;
    position: absolute;
    z-index: 40;
    top: calc(100% + .28rem);
    left: 0;
    grid-template-columns: repeat(2, max-content);
    gap: .28rem .55rem;
    box-sizing: border-box;
    width: max-content;
    max-width: calc(100vw - 1rem) !important;
    max-height: none;
    overflow: visible !important;
    padding: .5rem .55rem;
    border: 1px solid #dbe1ea;
    border-radius: .55rem;
    background: #fff;
    box-shadow: 0 10px 24px rgb(15 23 42 / 16%);
    color: #475569;
    font-size: 10px;
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown.is-open > .fbs-pick-ref-values > .pick-ref-separator {
    display: none;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown.is-open > .fbs-pick-ref-values > .pick-order-number,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown.is-open > .fbs-pick-ref-values > .pick-sticker-number {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: .15rem;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown.is-open > .fbs-pick-ref-values .text-\[11px\],
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-ref-dropdown.is-open > .fbs-pick-ref-values b {
    color: inherit;
    font-size: 10px !important;
    font-weight: 500;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-product-line > .fbs-pack-qty-mobile {
    display: inline-flex !important;
    flex: 0 0 auto;
    align-items: baseline;
    justify-content: flex-end;
    min-width: 0;
    margin: 0;
    padding: .13rem .34rem;
    border: 1px solid #8b82df;
    border-radius: .34rem;
    background: transparent;
    color: #655ab9;
    font-size: 8px;
    line-height: 1;
    letter-spacing: .02em;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-product-line > .fbs-pack-qty-mobile > b {
    color: #4f46b8;
    font-size: 12px !important;
    font-weight: 600;
    line-height: 1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-product-line > .fbs-pack-qty-mobile > span:first-child {
    font-size: 8px !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-product-line > .fbs-pack-qty-mobile > span:not(:first-child) {
    display: none;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart > tbody > tr.fbs-pick-row > td.fbs-pick-qty {
    display: none !important;
  }

  /* «По упаковке»: тот же плотный ритм, но кнопки сохраняют удобную высоту. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) > tbody > tr.fbs-pack-row {
    row-gap: .03rem;
    padding: .23rem .5rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pack-product {
    padding: 0 !important;
    line-height: 1.1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pack-barcode {
    margin-top: 0;
    line-height: 1;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pack-place {
    margin-top: 0 !important;
    padding: .06rem 0 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pack-sticker {
    padding: .06rem 0 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-order-actions {
    padding: .14rem 0 0 !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pack-order-label {
    order: 1;
    width: 1.8rem;
    min-width: 1.8rem;
    height: 1.8rem;
    min-height: 1.8rem;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pack-actions-spacer {
    order: 2;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pick-exception {
    order: 3;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table:not(.fbs-pick-table--byart) .fbs-pack-direct {
    order: 4;
  }

  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-metrics {
    grid-column: 2;
    grid-row: 3;
    align-self: start;
    justify-self: end;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-state {
    grid-column: 1 / -1;
    grid-row: 4;
    justify-self: start;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) > td.fbs-supply-owner {
    grid-column: 1;
    grid-row: 5 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) > td.fbs-supply-actions:has(> .wms-document-actions > :is(.wms-document-action-form, .wms-document-action, .wms-document-action-slot)) {
    grid-column: 2;
    grid-row: 5;
  }
}

/* ⭐⭐ РОВНЫЕ СТРОКИ КАЛЬКУЛЯТОРА ПРОИЗВОДСТВА (владелец 29.08: «нужно сделать, чтобы
   строки не прыгали»). У товара с нулевым остатком ячейка действий ПУСТА, у остального
   в ней стоят поле и две кнопки — замер живой страницы 29.08: 33 px против 43 px через
   строку, и таблица «дрожала» сверху донизу.
   ⚠️ Высоту держит ЯЧЕЙКА, а не строка: `min-height` на <tr>/<td> браузер игнорирует,
   поэтому распорку задаёт внутренний блок. Утилитой это не сделать — класса `min-h-*` в
   статической сборке Tailwind нет (тот же капкан, что с `h-10` у .doc-icon выше). */
.prd-act { display: block; min-height: 1.875rem; }  /* = высота формы с кнопкой (30 px, замер 29.08) */

/* Начиная с «Собрана» роли в обоих реестрах — компактная справочная подпись,
   как в FBS: без серой плашки, рамки и лишних внутренних отступов. */
:is(#fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled), #ship-list > tbody > tr.ship-row:is(.fbm-shipment-status-picked, .fbm-shipment-status-packed, .fbm-shipment-status-shipped, .fbm-shipment-status-accepted, .fbm-shipment-status-closed, .fbm-shipment-status-cancelled)) .fbs-owner-role {
  min-height: 0;
  padding: .08rem 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* FBS во всех стадиях: сборщик — справочная подпись, а не отдельная плашка.
   Ответственный остаётся интерактивным контролом, но без стрелки внутри контейнера. */
#fbs-supply-list
  > tbody > tr.fbs-supply-row
  .fbs-owner-people > .ui-picker > summary.fbs-owner-role {
  padding-right: .45rem;
}
#fbs-supply-list
  > tbody > tr.fbs-supply-row
  .fbs-owner-people > .ui-picker > summary.fbs-owner-role::after {
  display: none;
  content: none;
}
@media (min-width: 641px) {
  #fbs-supply-list.fbs-stage-picking
    > tbody > tr.fbs-supply-row.fbs-supply-status-picking
    .fbs-owner-people > .ui-picker > summary.fbs-owner-role {
    border-color: #e3e7ed;
  }
  :is(
    #fbs-supply-list > tbody > tr.fbs-supply-row .doc-owner-pickers,
    #ship-list.ship-status-picking > tbody > tr.ship-row.fbm-shipment-status-picking .doc-owner-pickers
  ) {
    min-height: 0;
    padding: .08rem 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  #fbs-supply-list
    > tbody > tr.fbs-supply-row
    .doc-owner-pickers .fbs-owner-unassigned {
    color: #d97706;
  }
}

@media (max-width: 640px) {
  #fbs-supply-list
    > tbody > tr.fbs-supply-row
    .wms-mobile-owner-panel {
    grid-template-rows: minmax(24px, auto);
    height: auto;
  }
  #fbs-supply-list
    > tbody > tr.fbs-supply-row
    .wms-mobile-owner-panel .doc-owner-pickers {
    height: auto;
    min-height: 24px;
    align-items: flex-start;
    overflow: visible;
    padding: 2px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  #fbs-supply-list
    > tbody > tr.fbs-supply-row
    .wms-mobile-owner-panel .doc-owner-pickers .fbs-owner-name-compact {
    overflow: visible;
    line-height: 1.2;
    white-space: normal;
  }
}

/* Ячейка раскрытого состава обязана продолжать цвет площадки. Фон строки таблицы
   через прозрачную td не просвечивает стабильно: браузер подставляет белый фон
   таблицы, и над «Тип» появляется длинная белая полоса. */
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) > td.fbs-supply-detail-cell {
  padding-top: 0 !important;
  background: #f8fbff !important;
}
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden).fbs-supply-mp-ozon > td.fbs-supply-detail-cell {
  background: #f4f8ff !important;
}
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden).fbs-supply-mp-wb > td.fbs-supply-detail-cell {
  background: #faf7ff !important;
}
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden).fbs-supply-mp-ym > td.fbs-supply-detail-cell {
  background: #fffbeb !important;
}
/* M.Видео использует ту же красную палитру, что общий реестр FBM. Токены
   обслуживают mobile-контур, а этот же блок закрывает desktop-шапку и состав:
   без него FBS проваливался в общий фиолетово-голубой fallback. */
#fbs-supply-list > tbody > tr.fbs-supply-mp-mvideo {
  --wms-mobile-card-line: #efcaca;
  --wms-mobile-card-open: #fff7f7;
}
#fbs-supply-list > tbody > tr.fbs-supply-row.ship-open.fbs-supply-mp-mvideo,
#fbs-supply-list > tbody > tr.fbs-supply-row.ship-open.fbs-supply-mp-mvideo > td,
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden).fbs-supply-mp-mvideo > td.fbs-supply-detail-cell {
  background: #fff7f7 !important;
}

/* Первая ячейка шапки поставки на desktop — grid внутри табличной строки и может
   быть на несколько пикселей ниже остальных ячеек. Фон нужен самой строке, иначе
   в оставшемся участке просвечивает белая подложка таблицы прямо над «Тип». */
#fbs-supply-list > tbody > tr.fbs-supply-row.ship-open {
  background: #f8fbff !important;
}
#fbs-supply-list > tbody > tr.fbs-supply-row.ship-open.fbs-supply-mp-ozon {
  background: #f4f8ff !important;
}
#fbs-supply-list > tbody > tr.fbs-supply-row.ship-open.fbs-supply-mp-wb {
  background: #faf7ff !important;
}
#fbs-supply-list > tbody > tr.fbs-supply-row.ship-open.fbs-supply-mp-ym {
  background: #fffbeb !important;
}

/* FBS раньше принудительно возвращал серую шапку через !important и тем самым
   перебивал общий стиль всех вложенных таблиц поставок. Верхнюю лишнюю линию
   по-прежнему снимаем здесь, а фон теперь тот же белый, что у FF и FBM. */
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > thead,
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > thead > tr,
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > thead th {
  border-top: 0 !important;
  background: #fff !important;
}

/* Наш статус документа и наблюдаемый статус площадки — разные источники.
   На закрытых этапах они читаются двумя строками, а не одной фразой. */
#fbs-supply-list .fbs-supply-state:has(.fbs-supply-own-state) {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: .08rem;
  text-align: left;
}
:is(#ship-list, #fbs-supply-list) .wms-supply-platform-state {
  display: block;
  margin-top: 2px;
}
#ship-list .fbm-market-details {
  font-size: 10px;
  font-weight: 400;
  line-height: 16px;
}
#ship-list .fbm-market-state--body .fbm-market-state-label {
  display: block;
  font-size: 11px;
  font-weight: 400;
  line-height: 16px;
}
#ship-list .fbm-market-state--body .fbm-market-state-timing {
  display: block;
  font-size: 10px;
  font-weight: 400;
  line-height: 16px;
}

#fbs-supply-list .fbs-supply-own-state-stack { display: contents; }
#fbs-supply-list .fbs-supply-state-platform-mobile { display: none; }
#fbs-supply-list .fbs-supply-counts-desktop { display: none; }
#fbs-supply-list .fbs-mobile-summary-line { display: none; }
#fbs-supply-list .fbs-mobile-date-layout,
#fbs-supply-list .fbs-supply-tracking--mobile { display: none; }
#fbs-supply-list .fbs-supply-waiting {
  font-size: 11px;
}
#fbs-supply-list .fbs-supply-tracking { font-size: 10px; }
#fbs-supply-list .fbs-supply-tracking > .fbs-supply-stock-alert { display: none; }
#fbs-supply-list .fbs-supply-tracking-separator { display: none; }
#fbs-supply-list .fbs-mobile-utility-stack { display: none; }
#fbs-supply-list .fbs-trbx-control {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
}
.wms-document-location-label {
  display: inline-flex;
  box-sizing: border-box;
  width: max-content;
  max-width: 100%;
  height: 14px;
  min-height: 14px;
  align-items: center;
  gap: 3px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #64748b;
  font-size: 10px;
  font-weight: 400;
  line-height: 14px;
  white-space: nowrap;
}
.wms-document-location-label .ui-action-icon {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  vertical-align: 0;
}
.wms-document-location-label .ui-location-icon {
  order: 0;
  color: inherit;
}
#ship-list .fbm-drop-off-location {
  display: block;
  position: relative;
  height: auto;
  margin-top: 4px;
  padding-bottom: 4px;
  overflow-wrap: anywhere;
  line-height: 12px;
  text-indent: 15px;
  white-space: normal;
}
#ship-list .fbm-drop-off-location .ui-location-icon {
  position: absolute;
  top: 1px;
  left: 0;
}
#ship-list {
  /* ОДНА ширина даты и строк времени FBM: пустая/заполненная дата больше не меняет
     геометрию и не требует независимо подгонять select. */
  --fbm-handover-control-width: 80px;
}
#ship-list .fbm-handover-time-range {
  display: grid;
  /* Вся строка «с/до + время» заканчивается ровно по правому краю плашки даты;
     календарь остаётся отдельным элементом правее. */
  width: var(--fbm-handover-control-width);
  justify-items: start;
  gap: 2px;
  margin-top: 4px;
  color: #64748b;
  font-size: 11px;
  line-height: 14px;
  white-space: nowrap;
}
#ship-list .fbm-handover-time-point {
  display: grid;
  width: 100%;
  grid-template-columns: 14px minmax(0, 1fr);
  align-items: center;
  gap: 4px;
}
#ship-list .fbm-handover-time-label {
  flex: 0 0 14px;
  width: 14px;
  text-align: right;
}
#ship-list .fbm-handover-time-point > .wms-inline-time-select {
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
}
@media (min-width: 768px) {
  #ship-list .wms-document-date-editor {
    display: grid;
    width: calc(var(--fbm-handover-control-width) + 1.45rem);
    max-width: calc(var(--fbm-handover-control-width) + 1.45rem);
    grid-template-columns: var(--fbm-handover-control-width) 1.25rem;
    gap: .2rem;
  }
  #ship-list .wms-document-date-editor > :is(
    .wms-document-date-input,
    .moxar-calendar-input
  ) {
    box-sizing: border-box;
    width: var(--fbm-handover-control-width) !important;
    min-width: var(--fbm-handover-control-width) !important;
    max-width: var(--fbm-handover-control-width) !important;
    field-sizing: fixed !important;
  }
}
.fbs-alarm-summary {
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.fbs-alarm-icon {
  width: 12px;
  height: 12px;
  flex-basis: 12px;
  vertical-align: 0;
}
#fbs-supply-list :is(.fbs-supply-overdue-mobile, .fbs-supply-overdue-desktop) {
  font-size: 10px;
}
#fbs-supply-list :is(.fbs-supply-overdue-mobile, .fbs-supply-overdue-desktop) .fbs-alarm-icon {
  width: 10px;
  height: 10px;
  flex-basis: 10px;
}
@media (min-width: 641px) {
  #fbs-supply-list .fbs-supply-overdue-desktop {
    display: flex;
    align-items: center;
    gap: 3px;
  }
}
#fbs-supply-list :is(
  .fbs-supply-scanning,
  .fbs-supply-undelivered,
  .fbs-trbx-warning
) {
  border: 0;
}
#fbs-supply-list .fbs-trbx-warning {
  background: #f1f5f9;
  color: #475569;
  white-space: nowrap;
}
:is(#ship-list, #fbs-supply-list) .fbs-qty-pill {
  display: inline-flex;
  box-sizing: border-box;
  align-items: baseline;
  justify-content: center;
  gap: .22rem;
  padding: .13rem .34rem;
  border: 1px solid #8b82df;
  border-radius: .34rem;
  background: transparent;
  color: #655ab9;
  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 8px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: .02em;
  white-space: nowrap;
}
:is(#ship-list, #fbs-supply-list) .fbs-qty-pill > b {
  color: #4f46b8;
  font-size: 12px;
  font-weight: 600;
  line-height: 1;
}
#fbs-supply-list .fbs-trbx-warning-desktop {
  box-sizing: border-box;
  height: 18px;
  min-height: 18px;
  padding-top: 0;
  padding-bottom: 0;
  border-radius: 5px;
  line-height: 18px;
}
#fbs-supply-list .fbs-trbx-warning-desktop { display: none; }
#fbs-supply-list .fbs-handover-mobile { display: inline-flex; }
#fbs-supply-list .fbs-handover-desktop,
#fbs-supply-list .fbs-supply-routing-desktop { display: none; }
#fbs-supply-list .fbs-supply-routing-mobile {
  display: flex;
  flex: 0 0 100%;
  flex-wrap: wrap;
  align-items: center;
  gap: .35rem;
  margin-top: .08rem;
}
#fbs-supply-list .fbs-trbx-control .ui-action-icon {
  width: .9rem;
  height: .9rem;
  flex: 0 0 auto;
}
#fbs-supply-list .fbs-trbx-doc-controls {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
}
#fbs-supply-list .fbs-trbx-doc-group {
  display: flex;
  flex: 0 0 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: .2rem;
  min-width: 0;
}
#fbs-supply-list .fbs-trbx-box-action {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  padding: .15rem .4rem;
  border: 1px solid #cbd5e1;
  border-radius: .4rem;
  background: #fff;
  color: #475569;
  font-size: 11px;
  line-height: 1;
  white-space: nowrap;
}
#fbs-supply-list .fbs-trbx-box-action:hover {
  background: #f8fafc;
}
#fbs-supply-list .fbs-trbx-box-action--add {
  border-color: #334155;
  background: #334155;
  color: #fff;
}
#fbs-supply-list .fbs-trbx-box-action--add:hover {
  background: #1e293b;
}
#fbs-supply-list .fbs-trbx-box-action--icon {
  justify-content: center;
  gap: 2px;
  width: 28px;
  height: 28px;
  min-height: 28px;
  padding: 0;
}
#fbs-supply-list .fbs-trbx-box-action--icon :is(.ui-action-icon, .ui-system-icon) {
  width: 14px;
  height: 14px;
}
#fbs-supply-list .fbs-trbx-add-plus {
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
}
#fbs-supply-list .fbs-trbx-count-desktop {
  display: none;
}

@media (max-width: 767px) {
  #fbs-supply-list.fbs-stage-picking .fbs-office-badge.fbs-handover-mobile {
    display: none;
  }
}

@media (min-width: 768px) {
  /* На desktop каждый элемент живёт в смысловой колонке: ШК и управление коробами —
     вместе с числом грузомест в «Документах», маршрут — в «Сдаче». Мобильный общий ряд здесь
     скрыт явно: он больше не должен растягивать первую ячейку через несколько колонок. */
  #fbs-supply-list .fbs-trbx-row {
    display: none !important;
  }
  #fbs-supply-list td.fbs-supply-date {
    min-width: 0;
    overflow: hidden;
  }
  .doc-list td.doc-owner-cell > .doc-owner-history {
    margin-top: 0;
    text-align: right;
  }
  .doc-list td.doc-owner-cell > .doc-owner-history > .doc-owner-history-panel {
    text-align: left;
  }
  #fbs-supply-list .fbs-trbx-count-desktop {
    display: flex;
    width: max-content;
    max-width: 100%;
    align-items: baseline;
    gap: .2rem;
    margin: 0;
    color: #64748b;
    font-size: 11px;
    line-height: 1.15;
    white-space: nowrap;
  }
  #fbs-supply-list .fbs-supply-routing-desktop {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .25rem;
    margin-top: .35rem;
  }
  #fbs-supply-list .fbs-supply-routing-desktop > .fbs-trbx-control,
  #fbs-supply-list .fbs-supply-routing-desktop > .fbs-trbx-warning {
    box-sizing: border-box;
    width: max-content;
    max-width: 100%;
    height: 18px;
    min-height: 18px;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    overflow: hidden;
    white-space: nowrap;
  }
  #fbs-supply-list .fbs-trbx-warning-desktop,
  #fbs-supply-list .fbs-handover-desktop {
    display: inline-flex;
  }
  :is(#fbs-supply-list, #ship-list) .ship-date {
    box-sizing: border-box;
    height: 22px;
    padding: 0 6px;
    border-radius: 5px;
    font-size: 12px;
    line-height: 22px;
  }
  /* В колонке 172 px и конкретный пункт, и запасной тип сдачи — одна простая
     подпись 10/14 px сразу под датой. Полный адрес — в подсказке. */
  #fbs-supply-list td.fbs-supply-date > .fbs-office-under-date {
    display: flex;
    margin-top: 2px;
    max-width: 100%;
  }
  #fbs-supply-list td.fbs-supply-date > .fbs-office-under-date > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #fbs-supply-list td.fbs-supply-date > .fbs-supply-tracking:has(> .fbs-supply-closed-at) {
    margin-top: 2px;
  }

  /* Desktop FBM/FBS: общие канал и дата имеют одну геометрию. Типовые цветные
     плашки сведены в финальный контракт ниже; предметные цвета остаются своими. */
  :is(#fbs-supply-list, #ship-list) .mpb {
    width: 1.8rem;
    min-width: 1.8rem;
    max-width: 1.8rem;
    flex: 0 0 1.8rem;
    justify-content: center;
    padding-inline: 0;
    border-radius: 5px;
  }
  :is(#ship-list, #fbs-supply-list) .fbs-qty-pill {
    height: 18px;
    min-height: 18px;
    padding: 2px 5px;
    border-radius: 5px;
  }
}

@media (min-width: 641px) {
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-shipped .fbs-supply-waiting {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 4px;
    min-height: 1.45rem;
    line-height: 1.2;
    /* ⚠️ ПЕРЕНОС РАЗРЕШЁН (30.08, после снятия колонки «Заметка»). Колонка «Действие»
       стала уже, а подпись «ждём приёмки каналом» — 141 px: с `nowrap` она вылезала на
       «Ответственного» и накладывалась на имя (поймано живым прогоном). Двух строк
       здесь достаточно, высоту строки это не ломает — рядом стоят двухэтажные поля
       ответственного и сборщика. */
    white-space: normal;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-shipped .fbs-supply-waiting > span {
    white-space: nowrap;
  }
  /* Внутри нашего состояния первым читается статус документа, затем его отметки.
     Статус площадки теперь живёт отдельно — непосредственно под внешним ID. */
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted) .fbs-supply-state > * {
    order: 3;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted) .fbs-supply-own-state {
    order: 1;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted) .fbs-supply-counts-desktop {
    display: inline-flex;
    order: 3;
    align-items: baseline;
    gap: .18rem;
    font-size: .75rem;
    line-height: 1.25;
    white-space: nowrap;
  }
  /* Оболочка и шапка продолжают фон площадки — поэтому над «Тип» не возвращается
     белая полоса. Само тело состава остаётся белой рабочей таблицей. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table {
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody {
    background: #fff !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr:hover {
    background: #fff !important;
  }
}

@media (max-width: 640px) {
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .wms-document-date-weekday {
    margin-right: .24rem;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) > td.fbs-supply-date > .fbs-supply-tracking > div {
    margin: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-state {
    display: contents !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-own-state {
    grid-column: 2;
    grid-row: 3;
    align-self: center;
    justify-self: end;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-market-state {
    display: block;
    grid-column: 1;
    grid-row: 4;
    justify-self: start;
    max-width: 100%;
    overflow: hidden;
    color: #64748b;
    font-size: .61rem;
    font-weight: 400 !important;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-state-platform {
    display: none;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-state-platform-mobile {
    display: inline;
    font-weight: 400;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-metrics {
    grid-column: 2;
    grid-row: 4;
    justify-self: end;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) > td.fbs-supply-owner {
    grid-row: 5 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-shipped > td.fbs-supply-owner {
    grid-row: 6 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) > td.fbs-supply-actions:has(> .wms-document-actions > :is(.wms-document-action-form, .wms-document-action, .wms-document-action-slot)) {
    grid-row: 5;
  }
}

/* FBS mobile: финальная сетка внешней карточки. Верхние документы стоят в углу,
   но все остальные блоки резервируют собственные строки и не могут перекрываться. */
@media (max-width: 640px) {
  #fbs-supply-list > tbody > tr.fbs-supply-row {
    row-gap: 4px;
  }
  /* После сборки часть служебных grid-рядов закономерно пуста. Обычный gap всё равно
     добавлялся между каждым таким треком: один лишний интервал появлялся перед «СДАЧА»,
     а перед аварийными плашками складывались сразу несколько. Оставляем только тонкий
     ритм между видимыми строками; активную сборку с её полной сеткой не меняем. */
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) {
    row-gap: 1px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-actions,
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-actions:has(> .wms-document-actions > :is(.wms-document-action-form, .wms-document-action, .wms-document-action-slot)) {
    position: static !important;
    padding: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-summary > .fbs-mobile-utility-stack {
    display: flex;
    z-index: 2;
    grid-column: 1 / -1;
    grid-row: 1;
    width: 148px;
    flex-direction: column;
    align-items: stretch;
    align-self: start;
    justify-self: end;
    gap: 4px;
    margin: 0;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-utility-stack > .fbs-mobile-documents {
    position: static;
    width: 100%;
    justify-content: flex-end;
    align-content: flex-start;
    margin: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-utility-status {
    display: flex !important;
    width: 100%;
    align-items: flex-end;
    justify-content: flex-end;
    margin: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-utility-status .wms-mobile-document-status {
    position: static;
    z-index: auto;
    align-self: flex-end !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-trbx-mobile-doc-row {
    display: flex;
    position: static;
    width: 100%;
    flex: none;
    justify-content: flex-end;
    gap: 4px;
    margin: 0;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-state {
    grid-row: 4;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-metrics {
    grid-column: 3;
    grid-row: 4;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking {
    grid-template-columns: 110px minmax(0, 1fr) auto;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking .fbs-supply-state {
    grid-column: 1;
    grid-row: 5;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: flex-start;
    justify-self: start;
    align-self: start;
    gap: 2px;
    text-align: left;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-routing-mobile {
    width: 100%;
    margin-top: 0;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-alert-row {
    grid-column: 1 / -1;
    grid-row: 7;
    align-self: start;
    justify-self: start;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-owner {
    grid-column: 1 / 3;
    grid-row: 8 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking > td.fbs-supply-owner {
    grid-column: 1 / 3 !important;
    grid-row: 6 !important;
    align-self: start;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking > td.fbs-supply-actions > .wms-document-actions {
    grid-column: 3;
    grid-row: 6;
    align-self: end;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking .fbs-supply-metrics {
    grid-column: 3;
    grid-row: 4;
    justify-self: end;
    justify-content: flex-end;
    text-align: right;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking .fbs-supply-alert-row {
    grid-row: 8;
  }
  /* У WB конкретный пункт и запасной способ сдачи сохраняют внутренний порядок,
     но весь блок теперь расположен между датой и временем закрытия. */
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-mp-wb .fbs-supply-routing-mobile {
    display: flex;
    width: auto;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking.fbs-supply-mp-wb .fbs-supply-metrics {
    grid-column: 3;
    grid-row: 4;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking.fbs-supply-mp-wb .fbs-supply-state {
    grid-row: 5;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking.fbs-supply-mp-wb > td.fbs-supply-owner {
    grid-row: 6 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking.fbs-supply-mp-wb > td.fbs-supply-actions > .wms-document-actions {
    grid-row: 6;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-picking.fbs-supply-mp-wb .fbs-supply-alert-row {
    grid-row: 7;
  }
  /* Mobile-статус заказа теперь живёт в первой строке карточки; форма действия
     использует всю ширину своей нижней строки. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-order-actions:has(.fbs-pack-direct) > .fbs-pack-workflow {
    min-width: 0;
    width: 100%;
    gap: 4px;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-order-actions:has(.fbs-pack-direct) .fbs-pack-actions-spacer {
    display: none !important;
  }
  /* Сиреневая отметка собранной позиции нужна только в активной работе.
     Начиная с «Собрано» обе раскладки становятся нейтрально-белыми: это уже
     история документа, а не подсветка выполняемого шага сборщика. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden).fbs-supply-status-picking table.fbs-pack-table > tbody > tr.fbs-pack-row.box-pick-row--done,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden).fbs-supply-status-picking table.fbs-pack-table > tbody > tr.fbs-pack-row.box-pick-row--done:hover {
    background: #fbfaff !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) table.fbs-pack-table > tbody > tr.fbs-pack-row.box-pick-row--done,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden):is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) table.fbs-pack-table > tbody > tr.fbs-pack-row.box-pick-row--done:hover {
    background: #fff !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table > tbody > tr.fbs-pack-row.box-pick-row--done > td {
    background: transparent !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-actions > .wms-document-actions {
    grid-column: 3;
    grid-row: 8;
    align-self: center;
    justify-self: end;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) > td.fbs-supply-date > .fbs-supply-tracking {
    display: flex;
    width: 100%;
    grid-column: 1 / -1;
    align-items: baseline;
    gap: 3px;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    line-height: 1.15;
    white-space: nowrap;
  }
  /* Итоговая недосдача — часть строки фактической передачи, а не отдельный ряд
     карточки. Сама плашка остаётся единым fbs_undelivered_notice без изменения. */
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-date
    > .fbs-supply-tracking > .fbs-supply-undelivered-mobile {
    display: inline-flex;
    flex: 0 0 auto;
    align-self: center;
    margin-left: auto;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-date
    > .fbs-supply-tracking > .fbs-supply-undelivered-mobile + .fbs-supply-stock-alert {
    margin-left: 4px !important;
  }
  /* «Склад не списан» относится к тому же временному факту, что `закрыли`:
     одна строка, правый край, без отдельного grid-ряда. Размер совпадает с
     мобильной плашкой «после печати» — 10px текста при высоте 16px. */
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) > td.fbs-supply-date > .fbs-supply-tracking > .fbs-supply-stock-alert {
    display: inline-flex !important;
    box-sizing: border-box;
    width: max-content;
    max-width: 100%;
    height: 16px;
    min-height: 16px;
    align-items: center;
    align-self: center;
    gap: 2px;
    margin: 0 0 0 auto !important;
    padding: 0 5px;
    font-size: 10px;
    line-height: 10px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) > td.fbs-supply-date > .fbs-supply-tracking > .fbs-supply-scan {
    display: inline-flex;
    align-items: baseline;
    gap: 3px;
    margin: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) .fbs-supply-tracking-separator {
    display: inline;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) .fbs-supply-own-state {
    grid-column: 2;
    grid-row: 4;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) .fbs-supply-market-state {
    grid-column: 1 / 3;
    grid-row: 6;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) .fbs-supply-metrics {
    grid-column: 3;
    grid-row: 7;
    justify-self: end;
    justify-content: flex-end;
    text-align: right;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) > td.fbs-supply-owner,
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-shipped > td.fbs-supply-owner {
    grid-row: 8 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) > td.fbs-supply-actions > .wms-document-actions {
    grid-column: 3;
    grid-row: 8;
    align-self: end;
    justify-self: end;
  }
}

/* FBS mobile: место отбора — один компактный адрес, без отдельной подписи слева.
   Финальное правило намеренно стоит последним: старые мобильные сетки обоих видов
   («По упаковке» / «По-артикульно») имели более поздние взаимоисключающие настройки.
   Геометка залитая и фиолетовая; единая группа прижата к правому краю карточки, при
   этом значок остаётся непосредственно перед «Линия · Стеллаж · Ярус». */
@media (max-width: 640px) {
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-place {
    justify-content: flex-end !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pack-place::before,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table--byart .fbs-pick-place::before {
    display: none !important;
    content: none !important;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-place-inline {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    gap: .24rem;
    margin-left: 0;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-place-icon {
    display: inline-flex;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-place-value {
    min-width: 0;
    margin-left: 0 !important;
    text-align: right !important;
  }
}

/* FBM: рабочие таблицы используют один карточный контур. В черновике состав и
   раскладка — две самостоятельные карточки; их общая обёртка отвечает только
   за сетку. В остальных стадиях карточкой остаётся внешняя обёртка вида. */
#ship-list > tbody > tr.ship-detail:not(.hidden) :is(
  .fbm-shipment-card,
  .fbm-inner-table-card:not(.fbm-draft-tables-grid),
  .fbm-draft-tables-grid > .fbm-draft-table-card
) {
  box-sizing: border-box;
  position: relative;
  overflow: visible;
  border: 1px solid rgb(148 163 184 / 32%);
  border-radius: .72rem;
  background: #fff;
  box-shadow: 0 3px 10px rgb(15 23 42 / 8%);
}
#ship-list > tbody > tr.ship-detail:not(.hidden)
  .fbm-draft-tables-grid > table.fbm-draft-table-card {
  overflow: hidden;
  border-collapse: separate;
  border-spacing: 0;
}
#ship-list > tbody > tr.ship-detail:not(.hidden)
  .fbm-inner-table-card:not(.fbm-draft-tables-grid) > table.byart-pick-table {
  border: 0 !important;
}
@media (min-width: 768px) {
  /* «По местам»: таблица остаётся overflow-visible ради подсказок, поэтому её фон
     может перекрыть родительскую рамку на скруглениях. Контур поверх содержимого
     возвращает цельные углы, не превращая карточку в обрезающий контейнер. */
  #ship-list > tbody > tr.ship-detail:not(.hidden)
    .fbm-inner-table-card:not(.fbm-draft-tables-grid)::after {
    content: "";
    position: absolute;
    inset: -1px;
    z-index: 1;
    border: 1px solid rgb(148 163 184 / 32%);
    border-radius: inherit;
    pointer-events: none;
  }
}
@media (max-width: 640px) {
  /* FBM сохраняет настоящий табличный состав и прокручивает только его. Внешняя
     карточка документа неподвижна; 42rem оставляют рабочие колонки читаемыми. */
  #ship-list > tbody > tr.ship-detail:not(.hidden) .fbm-inner-table-card {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden) .fbm-inner-table-card > table.byart-pick-table {
    min-width: 42rem;
  }

  /* Черновик редактируют и с телефона: широкая рабочая таблица 42rem относится
     только к стадийным видам. В черновике строка складывается внутри ширины карточки:
     номер + артикул, затем ШК и отдельная полноширинная строка действий. */
  #ship-list > tbody > tr.ship-detail:not(.hidden)
    .fbm-inner-table-card:has(> table.fbm-byart-table--draft) {
    overflow: visible;
  }
  #ship-list .fbm-byart-table--draft {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-width: 0 !important;
    table-layout: auto;
  }
  #ship-list .fbm-byart-table--draft > thead {
    display: none;
  }
  #ship-list .fbm-byart-table--draft > tbody {
    display: block;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr {
    display: grid;
    box-sizing: border-box;
    grid-template-columns: 16px minmax(0, 1fr) auto;
    width: 100%;
    padding: 3px 8px;
    column-gap: 4px;
    row-gap: 0;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr:first-child {
    border-top: 0;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td {
    display: block;
    min-width: 0;
    padding: 0 !important;
    border: 0 !important;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:first-child {
    grid-column: 1;
    grid-row: 1;
    text-align: left !important;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:nth-child(2) {
    grid-column: 2 / -1;
    grid-row: 1;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:nth-child(n + 3) {
    grid-column: 2;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:last-child {
    grid-column: 3;
    grid-row: 1 / 3;
    align-self: center;
    margin-top: 0;
  }
  #ship-list .fbm-byart-table--draft .unit-barcode-column {
    grid-column: 2;
    grid-row: 2;
    width: auto;
    text-align: left !important;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:last-child > div {
    flex-wrap: nowrap;
    gap: 4px;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:last-child
    :is(.wms-qty-step-control, input[data-inline-field="qty"], form > button) {
    box-sizing: border-box;
    height: var(--ui-control-height-compact) !important;
    min-height: var(--ui-control-height-compact) !important;
    max-height: var(--ui-control-height-compact) !important;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:last-child
    input[data-inline-field="qty"] {
    width: 48px;
  }
  #ship-list .fbm-byart-table--draft > tbody > tr > td:last-child
    :is(.wms-qty-step-control, form > button) {
    width: var(--ui-control-height-compact);
    min-width: var(--ui-control-height-compact);
    padding: 0;
  }

  #ship-list .fbm-draft-bulk-actions {
    display: grid;
    grid-template-columns: max-content minmax(0, 1fr);
    align-items: start;
    margin-top: 4px;
    padding-top: 4px;
    column-gap: 12px;
    row-gap: 0;
  }
  #ship-list .fbm-draft-bulk-control-row {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    white-space: nowrap;
  }
  #ship-list .fbm-draft-bulk-note {
    grid-column: 2;
    grid-row: 1;
  }
  #ship-list .fbm-draft-bulk-note-detail {
    display: none;
  }

  #ship-list .fbmp-box-add-entry {
    display: grid;
    width: 100%;
    grid-template-columns: 104px 136px;
    align-items: start;
    column-gap: 6px;
    row-gap: 6px;
  }
  #ship-list .fbmp-box-add-entry > [data-box-rows] {
    grid-column: 1 / -1;
  }
  #ship-list .fbmp-box-add-entry > [data-box-row-add] {
    box-sizing: border-box;
    width: 104px;
  }
  #ship-list .fbmp-box-add-entry > button:last-child {
    box-sizing: border-box;
    width: 136px;
  }
  #ship-list .fbmp-box-add-form {
    display: grid;
    grid-template-columns: 246px minmax(0, 1fr);
    align-items: start;
    column-gap: 12px;
    row-gap: 6px;
  }
  #ship-list .fbmp-box-add-title {
    grid-column: 1;
    grid-row: 1;
  }
  #ship-list .fbmp-box-add-entry {
    grid-column: 1;
    grid-row: 2;
  }
  #ship-list .fbmp-box-add-note {
    grid-column: 2;
    grid-row: 1 / span 2;
  }
  #ship-list .fbmp-box-add-note-detail {
    display: none;
  }

  #ship-list .fbm-draft-destination {
    display: grid !important;
    grid-template-columns: 44% minmax(0, 1fr);
    align-items: start;
    padding-bottom: 12px;
    column-gap: 12px;
    row-gap: 4px;
  }
  #ship-list .fbm-draft-destination-field {
    min-width: 0;
  }
  #ship-list .fbm-draft-destination-field--channel {
    grid-column: 1;
    grid-row: 1;
  }
  #ship-list .fbm-draft-destination-field--place {
    grid-column: 2;
    grid-row: 1;
  }
  #ship-list .fbm-draft-destination-field > :last-child {
    width: 100%;
    max-width: 100%;
  }
  #ship-list .fbm-draft-destination > button {
    grid-column: 1 / -1;
    justify-self: end;
    margin-top: 4px;
  }
  #ship-list .fbm-draft-destination > .basis-full {
    grid-column: 1 / -1;
  }

  /* Мобильная раскладка коробов не наследует desktop-ширину кванта 15rem:
     шесть колонок делят фактическую ширину таблицы без взаимных наложений. */
  #ship-list .fbm-box-layout-table .box-pick-group-row {
    display: table-row;
  }
  #ship-list .fbm-box-layout-table .box-pick-group-row > td {
    width: auto;
    padding: .45rem .55rem !important;
    text-align: left;
  }
  #ship-list .fbm-box-layout-table .box-pick-group-content {
    display: flex;
    width: 100%;
    justify-content: flex-start;
  }
  #ship-list .fbm-box-layout-table :is(th, td) {
    box-sizing: border-box;
    padding-right: 3px !important;
    padding-left: 3px !important;
  }
  #ship-list .fbm-box-layout-table .box-clean-icon {
    display: none;
  }
  #ship-list .fbm-box-layout-table .box-table-box__heading {
    width: 100%;
    flex-wrap: wrap;
    gap: 0 2px;
    white-space: normal;
  }
  #ship-list .fbm-box-layout-table :is(.box-table-box__title, .box-table-box__meta) {
    flex: 0 0 auto;
    white-space: nowrap;
  }
  #ship-list .fbm-box-layout-table input[data-inline-field="pallet"] {
    width: 28px;
    min-width: 28px;
    max-width: 28px;
  }
  #ship-list .fbm-box-layout-table .fbm-box-layout-article {
    overflow-wrap: normal;
    white-space: nowrap;
    line-height: 1.05;
  }
  #ship-list .fbm-box-layout-table .fbm-box-layout-article--long {
    overflow-wrap: normal;
    word-break: normal;
    white-space: normal;
  }
  #ship-list .fbm-box-layout-table :is(
    .fbm-box-layout-head > tr > th,
    .box-pick-row--box-start > td
  ):nth-child(1) { width: 20%; }
  #ship-list .fbm-box-layout-table :is(
    .fbm-box-layout-head > tr > th,
    .box-pick-row--box-start > td
  ):nth-child(2) { width: 17%; }
  #ship-list .fbm-box-layout-table :is(
    .fbm-box-layout-head > tr > th,
    .box-pick-row--box-start > td
  ):nth-child(3) { width: 36%; }
  #ship-list .fbm-box-layout-table :is(
    .fbm-box-layout-head > tr > th,
    .box-pick-row--box-start > td
  ):nth-child(4) { width: 8%; }
  #ship-list .fbm-box-layout-table :is(
    .fbm-box-layout-head > tr > th,
    .box-pick-row--box-start > td
  ):nth-child(5) { width: 10%; }
  #ship-list .fbm-box-layout-table :is(
    .fbm-box-layout-head > tr > th,
    .box-pick-row--box-start > td
  ):nth-child(6) { width: 9%; }

  #ship-list .fbm-box-layout-summary-note {
    display: block;
    margin-left: 34px;
  }
  #ship-list .fbm-box-layout-section:not([open]) {
    margin-top: .5rem;
    padding: .46rem .75rem;
  }
  #ship-list .fbm-box-layout-section:not([open]) > .fbm-box-layout-summary {
    padding: 0;
    line-height: 1.15;
  }

  /* FBM «По местам»: та же мобильная композиция позиции, что «По упаковке» —
     ШК слева, товар с количеством справа, ниже гео и компактные действия. */
  #ship-list .fbm-mobile-pick-list {
    display: grid;
    width: 100%;
    max-width: none;
    gap: 8px;
  }
  #ship-list .fbm-mobile-pick-card {
    box-sizing: border-box;
    container-type: inline-size;
    overflow: hidden;
    padding: .23rem 8px 5px;
    border-radius: 10px;
    background: #fff;
    color: #475569;
    opacity: 1;
  }
  /* Одна линия для мобильных карточек: короб, россыпь и место отбора. */
  #ship-list :is(.box-pick-table .box-pick-box-card, .fbm-mobile-pick-card) {
    border: 1px solid #cbd5e1;
  }
  #ship-list > tbody > tr.ship-detail.fbm-shipment-status-picking
    .fbm-mobile-pick-card--done {
    background: #fbfaff;
  }
  #ship-list .fbm-mobile-pick-card--cancelled {
    background: #f8fafc;
    opacity: .7;
  }
  #ship-list .fbm-mobile-pick-top {
    display: grid;
    grid-template-columns: max-content max-content;
    align-items: center;
    justify-content: space-between;
    gap: 1px 4px;
    width: 100%;
  }
  #ship-list .fbm-mobile-pick-barcode {
    display: inline-flex;
    justify-self: start;
  }
  #ship-list .fbm-mobile-pick-product {
    display: inline-flex;
    min-width: 0;
    align-items: baseline;
    justify-self: end;
    gap: 4px;
  }
  #ship-list .fbm-mobile-pick-product > b {
    min-width: 0;
    overflow-wrap: anywhere;
    color: #334155;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.015em;
  }
  #ship-list .fbm-mobile-pick-state {
    display: flex;
    justify-content: flex-end;
    gap: 4px;
    margin-top: 1px;
    color: #94a3b8;
    font-size: 10px;
    line-height: 12px;
  }
  #ship-list .fbm-mobile-pick-summary { display: none; }
  #ship-list .fbm-mobile-pick-places {
    display: grid;
    margin-top: 1px;
  }
  #ship-list .fbm-mobile-pick-place {
    padding: 2px 0 4px;
    border: 0;
    border-radius: 0;
    background: transparent;
  }
  #ship-list .fbm-mobile-pick-places > .fbm-mobile-pick-place:last-child {
    padding-bottom: 0;
  }
  #ship-list .fbm-mobile-pick-place--assigned {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 4px;
  }
  #ship-list .fbm-mobile-pick-place + .fbm-mobile-pick-place {
    border-top: 1px solid #d8dee9;
  }
  #ship-list .fbm-mobile-pick-location {
    display: flex;
    min-width: 0;
    justify-content: flex-end;
    margin-bottom: 0;
    color: #475569;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.2;
  }
  #ship-list .fbm-mobile-pick-location > span {
    display: inline-flex;
    min-width: 0;
    align-items: center;
  }
  #ship-list .fbm-mobile-pick-place--assigned .fbm-mobile-pick-actions {
    flex: 0 0 auto;
  }
  #ship-list .fbm-mobile-pick-result {
    display: flex;
    min-height: 20px;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
    font-size: 11px;
    line-height: 16px;
  }
  #ship-list .fbm-mobile-pick-result > span {
    display: inline-flex;
    width: auto;
    height: 16px;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    line-height: 16px;
  }
  #ship-list .fbm-mobile-pick-result.is-short {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    row-gap: 0;
  }
  #ship-list .fbm-mobile-pick-result.is-short > span:first-child {
    grid-column: 1;
    grid-row: 1;
  }
  #ship-list .fbm-mobile-pick-result.is-short > form {
    grid-column: 2;
    grid-row: 1;
  }
  #ship-list .fbm-mobile-pick-result > .fbm-mobile-pick-result-short {
    grid-column: 1 / -1;
    grid-row: 2;
    justify-self: end;
    height: 14px;
    color: #f43f5e;
    font-size: 10px;
    line-height: 14px;
  }
  #ship-list .fbm-mobile-pick-result > form {
    flex: 0 0 auto;
    margin: 0;
  }
  #ship-list .fbm-mobile-pick-resolution-actions {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: nowrap;
    gap: 4px;
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }
  #ship-list .fbm-mobile-pick-resolution-actions .wms-shortage-controls > form {
    flex: 0 0 auto;
    margin: 0;
  }
  #ship-list .fbm-mobile-pick-resolution-actions .wms-shortage-controls {
    display: contents;
  }
  #ship-list .fbm-mobile-pick-resolution-actions
    :is(.place-unpick-btn, .wms-shortage-replace, .wms-shortage-controls .ui-action--quiet-danger) {
    box-sizing: border-box !important;
    height: 20px !important;
    min-height: 20px !important;
    max-height: 20px !important;
    padding: 0 6px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    white-space: nowrap;
  }
  #ship-list .fbm-mobile-pick-actions,
  #ship-list .fbm-mobile-pick-editor,
  #ship-list .fbm-mobile-pick-cut-editor {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: flex-end;
    gap: 4px;
  }
  /* Состав карточками показывается на всех стадиях, но складские действия существуют
     только во «В работе». Статусный селектор также гасит уже загруженный фрагмент при
     переходе документа назад в «Сформирована» или вперёд после завершения сборки. */
  #ship-list > tbody > tr.ship-detail:not(.fbm-shipment-status-picking) :is(
    .fbm-mobile-pick-actions,
    .fbm-mobile-pick-editor,
    .fbm-mobile-pick-cut-editor,
    .wms-return-pick-action,
    .fbm-mobile-pick-resolution-actions
  ) {
    display: none !important;
  }
  #ship-list :is(.box-pick-box-card, .fbm-mobile-pick-card) .wms-cut-pick-form {
    display: flex;
    width: fit-content;
    max-width: 100%;
    margin-left: auto;
    justify-content: flex-end;
  }
  #ship-list .wms-cut-pick-form > .pick-inline-fact-label {
    display: none;
  }
  #ship-list .fbm-mobile-pick-actions > form { margin: 0; }
  #ship-list .fbm-mobile-pick-complete,
  #ship-list .fbm-mobile-pick-nothere,
  #ship-list .fbm-mobile-pick-damaged,
  #ship-list :is(.box-pick-box-card, .fbm-mobile-pick-card) .wms-cut-pick-submit {
    box-sizing: border-box;
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    max-height: var(--ui-control-height-compact);
    padding: 0 7px;
    font-size: 11px;
    line-height: 1;
    white-space: nowrap;
  }
  #ship-list .fbm-mobile-pick-place--cut {
    display: flex;
    min-width: 0;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    column-gap: 8px;
    row-gap: 4px;
  }
  #ship-list > tbody > tr.ship-detail:not(.fbm-shipment-status-picking)
    .fbm-mobile-pick-place--cut {
    justify-content: flex-end;
    text-align: right;
  }
  #ship-list .fbm-mobile-pick-list .fbm-byart-footer { display: none; }

  @container (max-width: 216px) {
    #ship-list .fbm-mobile-pick-top {
      grid-template-columns: minmax(0, 1fr);
    }
    #ship-list .fbm-mobile-pick-product {
      grid-column: 1;
      grid-row: 1;
    }
    #ship-list .fbm-mobile-pick-barcode {
      grid-column: 1;
      grid-row: 2;
    }
  }
  @container (max-width: 340px) {
    #ship-list .fbm-mobile-pick-place--assigned {
      display: grid;
      grid-template-columns: minmax(0, 1fr);
      gap: 1px;
    }
    #ship-list .fbm-mobile-pick-place--assigned .fbm-mobile-pick-location,
    #ship-list .fbm-mobile-pick-place--assigned .fbm-mobile-pick-actions {
      justify-self: end;
    }
  }
}

/* Карточный контур внутренних таблиц FBS живёт на их реальной обёртке, а не на
   <table>: таблица вплотную заполняет цветной блок раскрытия, поэтому её собственная
   тень визуально терялась. Обёртка даёт явный контур и лёгкую карточную тень обоим
   видам сборки. overflow:visible сохраняет раскрывающийся «путь · N». */
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-inner-table-card {
  box-sizing: border-box;
  position: relative;
  overflow: visible;
  border: 1px solid rgb(148 163 184 / 32%);
  border-radius: .72rem;
  background: #fff;
  box-shadow: 0 3px 10px rgb(15 23 42 / 8%);
}
@media (max-width: 640px) {
  /* На телефоне карточками уже являются сами строки заказов. Общая белая оболочка
     под ними создавала ложную вторую карточку с рамкой и тенью. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) .fbs-inner-table-card {
    overflow: visible;
    border: 0 !important;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
}
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pick-table {
  overflow: visible;
  border: 0 !important;
  border-radius: .72rem;
  background: #fff;
  box-shadow: none;
}
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden)
  table.fbs-pick-table > thead > tr > th {
  border-bottom: 2px solid #ddd6fe !important;
}

/* Внутренние рабочие таблицы FBM и FBS читаются как один интерфейс.
   Разметку `.wms-pick-table` / `.wms-pick-table-head` создают общие Jinja-макросы;
   высота, фон и типографика шапки меняются здесь сразу для обоих видов сборки. */
@media (min-width: 641px) {
  .wms-pick-table-head > tr > th {
    box-sizing: border-box;
    height: 2rem;
    padding: .4rem .62rem !important;
    border-top: 0 !important;
    border-bottom: 2px solid #ddd6fe !important;
    background: #fff !important;
    color: #667085 !important;
    font-size: .62rem !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    letter-spacing: .035em !important;
    vertical-align: middle;
    text-transform: uppercase;
    white-space: nowrap;
  }
}

/* Сводка «Состав» у FBM и FBS — один визуальный компонент: одинаковые числа,
   единицы и разделитель независимо от источника документа. */
:is(#ship-list, #fbs-supply-list) .doc-composition {
  display: inline-flex;
  align-items: baseline;
  gap: .2rem;
  margin: 0;
  color: #64748b;
  font-size: .7rem;
  font-weight: 400;
  line-height: 1.2;
  white-space: nowrap;
}
:is(#ship-list, #fbs-supply-list) .doc-composition > b {
  color: #334155;
  font-size: inherit;
  font-weight: 650;
  line-height: inherit;
}
:is(#ship-list, #fbs-supply-list) .doc-composition-separator {
  color: #cbd5e1;
}
:is(#ship-list, #fbs-supply-list) .doc-composition--empty {
  color: #94a3b8;
}

/* FBM: mobile-сводка существует в общей Jinja-разметке рядом с desktop-ячейкой,
   но показывается только ниже desktop-границы 768 px. ID-специфичность здесь
   намеренна: общее `display:inline-flex` у `.doc-composition` не должно перебивать
   скрытие мобильного дубля на desktop. */
#ship-list :is(.doc-composition-mobile, .doc-composition-mobile-alert) {
  display: none;
}
@media (max-width: 767px) {
  #ship-list .doc-composition-mobile { display: inline-flex; }
  #ship-list .doc-composition-mobile-alert { display: inline-flex; }
}

.doc-no-box-badge {
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  width: max-content;
  min-height: 20px;
  padding: 0 8px;
  border-radius: 9999px;
  background: #fff1f2;
  color: #be123c;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  white-space: nowrap;
}

/* Статус документа в FBM, FBS, FF и возвратах — одна овальная плашка по геометрии FF.
   Цвет остаётся смысловым для конкретной стадии, форма и типографика едины. */
.doc-status-badge {
  box-sizing: border-box;
  flex: 0 0 auto;
  align-items: center;
  height: 1.25rem;
  min-height: 1.25rem;
  padding: 0 .5rem;
  overflow: visible;
  border-radius: 9999px;
  font-size: .75rem;
  font-weight: 500;
  line-height: 1;
  vertical-align: middle;
  white-space: nowrap;
}
.doc-status--transit { background-color: #ecfdfa; }
.doc-status-label,
.doc-status-progress {
  position: relative;
  top: -1px;
}
:is(#ship-list, #fbs-supply-list) .doc-status-progress {
  margin-left: .32rem;
  font-weight: 650;
}
#ship-list .doc-composition--secondary {
  flex-wrap: wrap;
  row-gap: .12rem;
  margin-top: .2rem;
  padding-top: .28rem;
  background-image: linear-gradient(#cbd5e1, #cbd5e1);
  background-position: left top;
  background-repeat: no-repeat;
  background-size: 5rem 1px;
}
#ship-list .doc-composition-break {
  flex-basis: 100%;
  width: 0;
  height: 0;
}
.doc-composition-discrepancy {
  font-size: .7rem;
  line-height: 1.2;
}

/* Двухстрочный «Состав» не должен опускать начало документа по базовой линии:
   каретка и всё содержимое первой ячейки всегда начинаются от верхнего края. */
#ship-list > tbody > tr.ship-row > td:first-child {
  vertical-align: top;
}

/* ⭐⭐⭐ «Взять день целиком» — набор задаёт СЕРВЕР, а не галочки страницы (владелец
   02.09). Стоит НАД лентой, потому что это действие над всей волной дня, а не над
   отмеченными строками; ряд горизонтально прокручивается — дней бывает несколько. */
.fbs-take-day-block {
  display: flex;
  align-items: center;
  gap: .4rem;
  margin: 0 0 .5rem;
  padding: .4rem .6rem;
  overflow-x: auto;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: .6rem;
}
.fbs-take-day-label {
  flex: 0 0 auto;
  color: #64748b;
  font-size: .75rem;
  white-space: nowrap;
}
.fbs-take-day-btn { white-space: nowrap; }
.fbs-take-day-actions { display: contents; }
.fbs-take-day-actions > .help {
  flex: 0 0 auto;
  margin-left: 0;
}
@media (max-width: 640px) {
  .fbs-take-day-block {
    display: flex;
    gap: 8px;
    padding: 4px 6px;
    overflow: visible;
  }
  .fbs-take-day-label {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: flex-start;
    font-size: .68rem;
    line-height: 12px;
  }
  .fbs-take-day-actions {
    display: flex;
    flex: 1 1 auto;
    min-width: 0;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
  }
}

/* ═══ ОСТАТКИ НА ВИТРИНАХ FBS — МОБИЛЬНАЯ КАРТОЧКА (владелец 03.09) ═══
   ⛔⛔ ЧТО БЫЛО. Таблица идёт под общим `responsive`, который делает КАЖДУЮ ячейку
   отдельной строкой «метка → значение». Колонок здесь 6 общих плюс по одной на канал
   организации, поэтому карточка вырастала в 12–15 строк, поле «Моя квота» терялось
   между ними, а числа каналов читались как список без смысла (боевой скрин владельца).
   ⭐ Раскладка: артикул шапкой → четыре числа в ряд (доступно · каналов · потолок ·
   предложение) → КВОТА отдельным заметным полем → каналы компактной сеткой.
   ⚠️ Правила целятся классом `.fbs-stocks-table`, а не id: тот же приём, что у
   `.doc-list` — id висит на конкретном списке, а раскладка нужна таблице. */
@media (max-width: 640px) {
  table.fbs-stocks-table > tbody > tr {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px 8px;
    padding: 10px 12px;
  }
  /* Артикул — шапка карточки во всю ширину */
  table.fbs-stocks-table td[data-label="Артикул"] {
    grid-column: 1 / -1;
    display: block !important;
    padding: 0 0 6px;
    border-bottom: 1px solid #e2e8f0;
  }
  table.fbs-stocks-table td[data-label="Артикул"]::before { display: none !important; }
  table.fbs-stocks-table td[data-label="Артикул"] > b { font-size: .9375rem; }
  table.fbs-stocks-table td[data-label="Артикул"] .truncate {
    max-width: 100% !important;
    white-space: normal;
  }
  /* Четыре числа в ряд: метка сверху мелким, значение под ней */
  table.fbs-stocks-table td[data-label^="Доступно"],
  table.fbs-stocks-table td[data-label="Каналов"],
  table.fbs-stocks-table td[data-label="Потолок"],
  table.fbs-stocks-table td[data-label="Предложение"] {
    display: block !important;
    text-align: left;
    padding: 2px 0;
    border-bottom: none;
    min-width: 0;
  }
  /* ⛔ Метка ОБЯЗАНА быть блоком: общий `responsive` даёт ей `display:block`, но
     `white-space: nowrap` + узкая колонка складывали метку и число в одну строку
     («доступно33 20») — поймано живым рендером, а не тестом. */
  table.fbs-stocks-table td[data-label^="Доступно"]::before,
  table.fbs-stocks-table td[data-label="Каналов"]::before,
  table.fbs-stocks-table td[data-label="Потолок"]::before,
  table.fbs-stocks-table td[data-label="Предложение"]::before {
    display: block !important;
    font-size: 9px;
    line-height: 1.2;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  /* Значение — своей строкой под меткой, крупнее метки */
  table.fbs-stocks-table td[data-label^="Доступно"],
  table.fbs-stocks-table td[data-label="Каналов"],
  table.fbs-stocks-table td[data-label="Потолок"],
  table.fbs-stocks-table td[data-label="Предложение"] {
    font-size: .9375rem;
    line-height: 1.25;
    white-space: nowrap;
  }
  /* «?» рядом с потолком не должен уводить число на вторую строку */
  table.fbs-stocks-table td[data-label="Потолок"] .help {
    margin-left: 3px;
    vertical-align: baseline;
  }
  /* ⭐ КВОТА — главное действие карточки: своя строка, поле во всю ширину.
     Прежде она стояла девятой строкой подряд и не читалась как ввод. */
  table.fbs-stocks-table td[data-label="Моя квота"] {
    grid-column: 1 / -1;
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 8px 0 0;
    margin-top: 4px;
    border-top: 1px solid #e2e8f0;
    border-bottom: none;
  }
  table.fbs-stocks-table td[data-label="Моя квота"]::before {
    margin-bottom: 0;
    font-size: 10px;
    flex: 0 0 auto;
  }
  table.fbs-stocks-table td[data-label="Моя квота"] input {
    flex: 1 1 auto;
    width: auto !important;
    min-height: 2.25rem;
    text-align: left;
  }
  /* Каналы — компактной сеткой по два в ряд, без раздувания карточки */
  table.fbs-stocks-table td[data-label]:not([data-label="Артикул"]):not([data-label^="Доступно"]):not([data-label="Каналов"]):not([data-label="Потолок"]):not([data-label="Предложение"]):not([data-label="Моя квота"]):not([data-label="Осталось"]) {
    /* ⚠️ ВО ВСЮ ШИРИНУ, а не «по два в ряд»: каналов у организации бывает 2, 3 или 4,
       и при нечётном числе `span 2` оставлял последний висеть в полстроки (живой рендер
       03.09: OZON и WB рядом, YM один под ними). Ровный список читается сразу. */
    grid-column: 1 / -1;
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    gap: 6px;
    padding: 3px 0;
    border-bottom: none;
    text-align: right;
    font-size: .875rem;
    min-width: 0;
  }
  table.fbs-stocks-table td[data-label]:not([data-label="Артикул"]):not([data-label^="Доступно"]):not([data-label="Каналов"]):not([data-label="Потолок"]):not([data-label="Предложение"]):not([data-label="Моя квота"]):not([data-label="Осталось"])::before {
    margin-bottom: 0;
    font-size: 10px;
  }
  /* «Осталось квоты» — последняя ячейка; общий `responsive` делает её флексом
     без метки, а здесь метка нужна: числа два и без подписи их не различить. */
  table.fbs-stocks-table td[data-label="Осталось"] {
    grid-column: 1 / -1;
    display: flex !important;
    justify-content: space-between;
    align-items: baseline;
    padding: 6px 0 0;
    margin-top: 2px;
    border-top: 1px solid #f1f5f9;
  }
  table.fbs-stocks-table td[data-label="Осталось"]::before {
    display: block !important;
    margin-bottom: 0;
    font-size: 10px;
  }
}

/* Mobile-системные документы в обоих реестрах имеют одну рамку 34×34px.
   Вложения со скрепкой остаются компактными 28×28px; внутренние основные знаки —
   20×20px, desktop-кнопки этим правилом не затронуты. */
@media (max-width: 767px) {
  .wms-document-icons .mpfile-dot {
    width: 16px;
    height: 16px;
  }
  #ship-list .wms-document-icons .doc-icon {
    width: 34px;
    height: 34px;
  }
}
@media (max-width: 640px) {
  #fbs-supply-list td.fbs-supply-actions .fbs-mobile-documents .doc-icon {
    width: 34px;
    height: 34px;
  }

  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-closed {
    grid-template-columns: minmax(0, 1fr) 67px 91px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) .fbs-supply-own-state-stack {
    display: flex;
    grid-column: 2;
    grid-row: 4;
    flex-direction: column;
    align-items: flex-end;
    justify-self: end;
    gap: 1px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(
    .fbs-supply-status-packed,
    .fbs-supply-status-shipped,
    .fbs-supply-status-accepted,
    .fbs-supply-status-closed,
    .fbs-supply-status-cancelled
  ) .fbs-supply-own-state-stack > .fbs-supply-own-state {
    grid-column: auto;
    grid-row: auto;
    align-self: flex-end;
    justify-self: auto;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-closed .fbs-supply-own-state-stack {
    width: 67px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-closed .fbs-supply-metrics {
    width: 91px;
    max-width: 91px;
  }
}

/* FBM / FF · mobile: шапка документа больше не делится на узкие табличные
   колонки. Данные поставки занимают всю ширину карточки, а рабочие элементы
   собраны в самостоятельный нижний ряд и не наезжают на маршрут или статус. */
@media (max-width: 640px) {
  #ship-list,
  #ship-list > tbody {
    display: block;
    width: 100%;
  }
  #ship-list > colgroup,
  #ship-list > thead {
    display: none;
  }
  #ship-list > tbody > tr.ship-row {
    display: grid !important;
    box-sizing: border-box;
    width: 100% !important;
  }
  :is(#ship-list, #fbs-supply-list) .wms-document-actions {
    align-self: end;
    justify-self: end;
    justify-content: flex-end;
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr.document-separator {
    display: none !important;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden) {
    display: block;
    width: 100%;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden) > td {
    display: block;
    box-sizing: border-box;
    width: 100%;
  }
  #ship-list > tbody > tr.ship-row > :is(.fbm-mobile-card-main, td.ship-actions) {
    width: auto !important;
    min-width: 0;
  }

  /* FBM / FBS / FF: поставка на телефоне всегда отдельная карточка. Раскрытая
     пара строк выглядит одним блоком: шапка рисует верх и боковины, состав
     продолжает цветные боковины и замыкает рамку снизу. */
  .doc-list-frame:has(> :is(#ship-list, #fbs-supply-list)) {
    margin-bottom: .6rem !important;
    overflow: visible !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  :is(#ship-list > tbody > tr.ship-row, #fbs-supply-list > tbody > tr.fbs-supply-row) {
    box-sizing: border-box;
    width: 100% !important;
    margin: 0 0 .45rem !important;
    overflow: visible;
    border: 1px solid #cbd5e1 !important;
    border-radius: .8rem !important;
    background: #fff;
    box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr.ship-row ~ tr.ship-row {
    margin-top: .32rem !important;
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr.ship-row.ship-open {
    margin-bottom: 0 !important;
    border-color: var(--wms-mobile-card-line, var(--ui-accent-line)) !important;
    border-bottom: 0 !important;
    border-radius: .8rem .8rem 0 0 !important;
    background: var(--wms-mobile-card-open, var(--ui-accent-soft)) !important;
    box-shadow: none !important;
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr.ship-row.ship-open > td {
    border-bottom: 0 !important;
    background: transparent !important;
  }
  /* Предупреждение Ozon — нижняя секция ТОЙ ЖЕ мобильной карточки поставки.
     Пока состав закрыт, секция замыкает карточку; при раскрытом составе становится
     средней и передаёт нижнюю рамку строке detail. */
  #ship-list > tbody > tr.ship-row:has(+ tr.fbm-cabinet-fix-row) {
    margin-bottom: 0 !important;
    border-bottom: 0 !important;
    border-radius: .8rem .8rem 0 0 !important;
    box-shadow: none !important;
  }
  #ship-list > tbody > tr.fbm-cabinet-fix-row {
    display: block !important;
    box-sizing: border-box;
    width: 100% !important;
    margin: 0 0 .45rem !important;
  }
  #ship-list > tbody > tr.fbm-cabinet-fix-row > td {
    display: block !important;
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0;
    max-width: 100%;
    padding: 0 8px 8px !important;
    border: 1px solid #cbd5e1 !important;
    border-top: 0 !important;
    border-radius: 0 0 .8rem .8rem !important;
    background: #fff !important;
    box-shadow: 0 1px 2px rgb(15 23 42 / 4%);
  }
  #ship-list .box-pick-cabinet-warning--compact > .wms-cabinet-fix-heading {
    display: block;
    width: 100%;
    max-width: 100%;
  }
  #ship-list .box-pick-cabinet-warning--compact > .wms-cabinet-fix-heading > :first-child {
    display: inline;
  overflow-wrap: anywhere;
}
  #ship-list .box-pick-cabinet-warning--compact .wms-cabinet-fix-toggle {
    display: inline-flex;
    max-width: 100%;
    margin-left: 4px;
  }
  #ship-list .box-pick-cabinet-warning--compact .wms-cabinet-fix-footer {
    max-width: 100%;
    flex-wrap: wrap;
    justify-content: flex-start;
    text-align: left;
    white-space: normal;
  }
  #ship-list .box-pick-cabinet-warning--compact .wms-cabinet-fix-footer > span {
    min-width: 0;
    flex: 1 1 220px;
  }
  #ship-list .box-pick-cabinet-warning--compact .wms-cabinet-fix-footer > form,
  #ship-list .box-pick-cabinet-warning--compact .wms-cabinet-fix-confirm {
    max-width: 100%;
  }
  #ship-list .box-pick-cabinet-warning--compact .wms-cabinet-fix-op > span {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  #ship-list > tbody > :is(
    tr.ship-row.ship-open + tr.fbm-cabinet-fix-row,
    tr.ship-row:hover + tr.fbm-cabinet-fix-row,
    tr.fbm-cabinet-fix-row:hover
  ) > td {
    border-color: var(--wms-mobile-card-line, var(--ui-accent-line)) !important;
    background: var(--wms-mobile-card-open, var(--ui-accent-soft)) !important;
  }
  #ship-list > tbody > tr.fbm-cabinet-fix-row:has(+ tr.ship-detail:not(.hidden)) {
    margin-bottom: 0 !important;
  }
  #ship-list > tbody > tr.fbm-cabinet-fix-row:has(+ tr.ship-detail:not(.hidden)) > td {
    border-bottom: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr.ship-detail:not(.hidden) {
    display: block !important;
    box-sizing: border-box;
    width: 100% !important;
    margin: 0 0 .65rem !important;
    overflow: hidden;
    border: 1px solid var(--wms-mobile-card-line, var(--ui-accent-line)) !important;
    border-top: 0 !important;
    border-radius: 0 0 .8rem .8rem !important;
    background: var(--wms-mobile-card-open, var(--ui-accent-soft)) !important;
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr.ship-detail:not(.hidden) > td {
    border-top: 0 !important;
  }
  :is(
    #fbs-supply-list > tbody > tr.fbs-supply-mp-ozon,
    #ship-list > tbody > tr.fbm-shipment-mp-ozon
  ) {
    --wms-mobile-card-line: #cbdcff;
    --wms-mobile-card-open: #f4f8ff;
  }
  :is(
    #fbs-supply-list > tbody > tr.fbs-supply-mp-wb,
    #ship-list > tbody > tr.fbm-shipment-mp-wb
  ) {
    --wms-mobile-card-line: #e4d8f1;
    --wms-mobile-card-open: #faf7ff;
  }
  :is(
    #fbs-supply-list > tbody > tr.fbs-supply-mp-ym,
    #ship-list > tbody > tr.fbm-shipment-mp-ym
  ) {
    --wms-mobile-card-line: #f0dfa0;
    --wms-mobile-card-open: #fffbeb;
  }
  #ship-list > tbody > tr.fbm-shipment-mp-mvideo {
    --wms-mobile-card-line: #efcaca;
    --wms-mobile-card-open: #fff7f7;
  }
  
  /* FBM / FF: позиции, штуки и ОВХ — одна компактная mobile-строка. Числа
     позиций и штук наследуют то же выделение `.doc-composition > b`, что FBS. */
  #ship-list .doc-composition-mobile {
    max-width: 100%;
    gap: .12rem;
    overflow: visible;
    font-size: .68rem;
    line-height: 1.2;
    white-space: nowrap;
  }
  #ship-list .doc-composition-mobile-alert {
    margin-top: 2px;
  }
  #ship-list .doc-composition-discrepancy--mobile {
    display: flex;
    align-items: baseline;
    gap: 3px;
    margin-top: 2px;
    font-size: .65rem;
    line-height: 1.2;
    white-space: nowrap;
  }

  /* FBM: карточка в один столбец. При полной ширине главное и три служебных
     действия помещаются одной строкой; документы с загрузкой закреплены сверху
     справа и не растягивают нижний рабочий ряд. */
  #ship-list > tbody > tr.ship-row {
    position: relative;
    grid-template-columns: minmax(0, 1fr);
  }
  #ship-list > tbody > tr.ship-row > .fbm-mobile-card-main {
    display: block !important;
    grid-column: 1;
    grid-row: 1;
    padding: 8px 8px 0 !important;
  }
  #ship-list > tbody > tr.ship-row > td.ship-actions {
    display: grid !important;
    grid-column: 1;
    grid-row: 2;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 4px;
    align-items: end;
    padding: 8px !important;
    border-top: 0 !important;
  }
  #ship-list > tbody > tr.ship-row > td.ship-actions > div:first-child {
    justify-content: flex-end;
  }
  #ship-list > tbody > tr.ship-row > td.ship-actions > .wms-document-icons {
    position: absolute;
    z-index: 2;
    top: 8px;
    right: 8px;
    align-content: flex-start;
    justify-content: flex-end;
    width: 148px;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
  }
  /* FBM / FBS / FF: дата использует одну mobile-типографику. Редактор — та же
     цветная плашка, только с внешним календариком вместо дня недели. */
  #ship-list .wms-mobile-handover {
    display: flex;
    align-items: center;
    gap: .2rem;
    margin-top: 4px;
    white-space: nowrap;
  }
  #ship-list .wms-mobile-handover-label {
    color: #94a3b8;
    font-size: .61rem;
    font-weight: 400;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  #ship-list .wms-document-date-editor,
  #fbs-supply-list td.fbs-supply-date .wms-document-date-readonly { gap: .2rem; }
  #ship-list .wms-document-date-calendar {
    flex-basis: 1rem;
    width: 1rem;
    height: 1rem;
  }
  #ship-list .wms-document-date-calendar .ui-system-icon {
    width: .75rem;
    height: .75rem;
    flex-basis: .75rem;
  }
  #ship-list .wms-mobile-handover-empty {
    color: #94a3b8;
    font-size: .61rem;
  }
  .wms-document-date-form.wms-mobile-handover-form {
    display: inline-flex;
    margin: 0;
  }
  #ship-list > tbody > tr.ship-row > td.ship-actions > .wms-document-icons .att-upload-row {
    flex: 0 0 58px;
    width: 58px;
    margin: 0;
  }
  #ship-list > tbody > tr.ship-row > td.ship-actions > .wms-document-icons .att-upload {
    justify-content: center;
    width: 58px;
    padding: 0 6px;
    font-size: 10px;
  }

              /* Mobile-карточки FBM/FBS используют один правый верхний стек:
     статус 20px, затем зазор 4px и ряд документов 34px. */
  :is(#ship-list, #fbs-supply-list) > tbody > tr.ship-row .wms-mobile-document-status {
    position: absolute;
    z-index: 3;
    top: 8px;
    right: 8px;
    grid-column: auto !important;
    grid-row: auto !important;
    align-self: auto !important;
    justify-self: auto !important;
  }
  :is(#ship-list > tbody > tr.ship-row > td.ship-actions > .wms-document-icons, #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-actions > .fbs-mobile-documents) {
    top: 32px;
  }
  #ship-list > tbody > tr.ship-row:has(.wms-document-icons) .wms-mobile-document-header {
    margin-bottom: 6px !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:has(.wms-document-icons) .wms-mobile-document-header {
    margin-bottom: 0 !important;
  }
    /* Шапка mobile-документа — один реальный компонент из трёх базовых строк, а не три
     совпавших CSS-объявления в разной разметке. Дополнительные строки внешнего номера,
     создания и статуса включаются тем же компонентом по данным раздела. */
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-header {
    display: grid !important;
    box-sizing: border-box;
    grid-template-rows: 20px 16px 16px;
    width: 100%;
    height: 52px;
    min-height: 52px;
    margin: 0 !important;
    padding-right: 156px;
    overflow: hidden;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-header.wms-document-header--four-lines {
    grid-template-rows: 20px 16px 16px 16px;
    height: 68px;
    min-height: 68px;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-header.wms-document-header--five-lines {
    grid-template-rows: 20px 16px 16px 16px 16px;
    height: 84px;
    min-height: 84px;
  }
  /* FBM: пятый ряд появляется уже ниже правого стека документов, поэтому статус
     площадки вместе со временем может занимать всю ширину карточки. Первые четыре
     ряда по-прежнему резервируют справа 156px под документы. */
  #ship-list .fbm-mobile-document-header.wms-document-header--five-lines {
    padding-right: 0;
  }
  #ship-list .fbm-mobile-document-header.wms-document-header--five-lines > :not(.wms-document-fifth-line) {
    padding-right: 156px;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-heading,
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-line {
    box-sizing: border-box;
    min-width: 0;
    margin-top: 0 !important;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-heading {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: .3rem;
    min-width: 0;
    height: 20px;
    min-height: 20px;
    font-size: .875rem;
    line-height: 20px;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-line {
    display: flex;
    align-items: center;
    height: 16px;
    min-height: 16px;
    line-height: 16px;
  }
  :is(#ship-list, #fbs-supply-list) :is(.wms-mobile-document-code, .wms-mobile-document-external) {
    color: #64748b !important;
    font-size: 11px;
    font-weight: 400;
    line-height: 16px;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-created {
    color: #94a3b8 !important;
    font-size: 10px;
    font-weight: 400;
    line-height: 16px;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-channel {
    display: block;
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    color: #94a3b8 !important;
    font-size: 10px;
    font-weight: 400;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #ship-list .fbm-mobile-document-channel {
    display: flex;
    align-items: center;
    gap: 3px;
  }
  #ship-list .fbm-mobile-document-channel > :is(.fbm-market-state-label, .fbm-market-state-timing) {
    display: inline-flex;
    min-width: 0;
    align-items: center;
    white-space: nowrap;
  }
  #ship-list .fbm-mobile-document-channel > .fbm-market-state-label {
    flex: 0 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  #ship-list .fbm-mobile-document-channel > .fbm-market-state-timing {
    flex: 0 0 auto;
    gap: 3px;
  }
  #fbs-supply-list .fbs-mobile-document-channel .fbs-supply-state-platform {
    display: none !important;
  }
  #fbs-supply-list .fbs-mobile-document-channel .fbs-supply-state-platform-mobile {
    display: inline !important;
  }
  #fbs-supply-list .fbs-supply-market-state--body,
  #ship-list .fbm-market-state--body {
    display: none !important;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-heading-text {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  :is(#ship-list, #fbs-supply-list) .wms-mobile-document-heading > :is(.acc-caret, .wms-mobile-document-caret-spacer) {
    display: inline-flex;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
  }
  #fbs-supply-list .fbs-mobile-document-header {
    grid-column: 1 / -1;
    grid-row: 1;
  }

  /* FBM / FBS / FF: единый однострочный mobile-блок ответственных.
     Слева компактный треугольник истории, затем ответственный и сборщик. */
  .wms-mobile-owner-panel {
    grid-template-columns: 12px minmax(0, 1fr);
    grid-template-rows: var(--ui-control-height-compact);
    width: 100%;
    max-width: 240px;
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    column-gap: 3px;
    align-items: center;
    align-self: end;
    justify-self: start;
    overflow: visible;
  }
  .doc-owner-mobile.wms-mobile-owner-panel {
    display: grid;
    margin-top: 0;
  }
  .wms-mobile-owner-panel > .fbs-owner-people {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: grid;
    grid-template-columns: 96px minmax(0, 1fr);
    width: 100% !important;
    gap: .22rem;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .wms-mobile-owner-panel > .fbs-owner-people > :is(.ui-picker, .fbs-owner-role) {
    width: 100% !important;
    min-width: 0;
  }
  .wms-mobile-owner-panel .fbs-owner-role {
    box-sizing: border-box;
    align-items: center;
    width: 100% !important;
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    padding: 2px .92rem 2px .3rem;
    overflow: hidden;
    border: 1px solid #e3e7ed;
    border-radius: .48rem;
    background: rgb(255 255 255 / 78%);
    box-shadow: none;
    font-size: .64rem;
    line-height: 1.15;
  }
  .wms-mobile-owner-panel .fbs-owner-role:hover,
  .wms-mobile-owner-panel .fbs-owner-role:focus-visible {
    border-color: #cbd5e1;
    background: #fff;
  }
  .wms-mobile-owner-panel .doc-owner-pickers,
  .wms-mobile-owner-panel .doc-owner-pickers:hover,
  .wms-mobile-owner-panel .doc-owner-pickers:focus-visible {
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }
  .wms-mobile-owner-panel .fbs-owner-label {
    display: inline-flex;
    align-items: center;
    width: 1.18rem;
    color: #64748b;
  }
  .wms-mobile-owner-panel :is(.fbs-owner-name-compact, .fbs-owner-unassigned) {
    min-width: 0;
    overflow: hidden;
    color: #475569;
    font-size: .62rem;
    font-weight: 400;
    line-height: 1;
    text-overflow: ellipsis;
  }
  .wms-mobile-owner-panel .fbs-owner-unassigned { color: #d97706; }
  .wms-mobile-owner-panel .ui-picker > summary::after { right: .2rem; }
  .wms-mobile-owner-panel .ui-picker-menu {
    grid-template-columns: 1fr;
    width: 13rem;
    max-height: 10rem;
    padding: .3rem;
  }
  .wms-mobile-owner-panel .ui-picker:nth-child(2) .ui-picker-menu {
    right: 0;
    left: auto;
  }
  .wms-mobile-owner-panel .ui-picker-option {
    min-height: 2.15rem;
    font-size: .68rem;
  }
  .wms-mobile-owner-panel > .doc-owner-history {
    grid-column: 1;
    grid-row: 1;
    align-self: center;
    justify-self: start;
    margin-top: 0;
  }
  .wms-mobile-owner-panel > .doc-owner-history > summary {
    width: 12px;
    height: var(--ui-control-height-compact);
    justify-content: center;
    gap: 0;
    padding: 0;
    border-radius: 0;
    background: transparent;
    color: #94a3b8;
    font-size: 0;
    line-height: 0;
  }
  .wms-mobile-owner-panel > .doc-owner-history > summary:hover,
  .wms-mobile-owner-panel > .doc-owner-history > summary:focus-visible {
    background: transparent;
    color: #64748b;
  }
  .wms-mobile-owner-panel > .doc-owner-history > summary > span:last-child {
    display: none;
  }
  .wms-mobile-owner-panel > .doc-owner-history > .doc-owner-history-panel {
    right: auto;
    left: 0;
  }
    
  #ship-list > tbody > tr.ship-row > td.wms-mobile-action-row .ui-refresh-action--idle-text {
    width: 28px;
    min-width: 28px;
    height: 28px;
    min-height: 28px;
    gap: 0;
    padding: 0;
    font-size: 0;
  }
  #ship-list > tbody > tr.ship-row > td.wms-mobile-action-row .ui-refresh-action--idle-text::before {
    position: static;
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    visibility: visible;
  }
  #ship-list > tbody > tr.ship-row > td.wms-mobile-action-row .ui-refresh-action--idle-text:is(.is-refreshing, [aria-busy="true"]) {
    padding: 0;
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr > td.wms-mobile-action-row {
    display: grid !important;
    box-sizing: border-box;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: minmax(24px, auto);
    column-gap: 4px;
    align-items: center;
    align-self: end !important;
    justify-self: stretch !important;
    width: 100% !important;
    border-top: 0 !important;
    background: transparent !important;
  }

  #fbs-supply-list > tbody > tr.fbs-supply-row {
    --fbs-mobile-action-row: 3;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:has(.fbs-supply-alert-row) {
    --fbs-mobile-action-row: 4;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-alert-row {
    grid-row: 3 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-date {
    display: flex !important;
    grid-column: 1 / -1;
    grid-row: 2 !important;
    width: 100% !important;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    row-gap: 2px;
    justify-self: stretch;
    align-self: start;
    overflow: visible;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-date::before {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-summary-line {
    display: flex;
    align-items: center;
    gap: 4px;
    width: max-content;
    max-width: 100%;
    min-height: 0;
    line-height: 16px;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100%;
    column-gap: 8px;
    align-items: start;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-left,
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-right {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 2px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-left {
    align-items: flex-start;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-right {
    align-items: flex-end;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-left
    > :is(.fbs-supply-routing-mobile, .fbs-supply-tracking--mobile),
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-right
    > :is(.fbs-mobile-summary-composition, .fbs-after-print-notice, .fbs-supply-cancelled-mobile, .fbs-supply-undelivered-mobile, .fbs-supply-stock-alert) {
    margin: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-tracking--mobile {
    display: flex;
    width: auto;
    align-items: baseline;
    gap: 3px;
    padding: 0 !important;
    border: 0 !important;
    line-height: 1.15;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-tracking--mobile
    > .fbs-supply-refusal {
    margin: 0 !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-supply-tracking--desktop {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-right
    > .fbs-supply-cancelled-mobile {
    width: auto;
    align-items: center;
    justify-content: flex-end;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-right
    > .fbs-supply-undelivered-mobile {
    display: inline-flex;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-date-right
    > .fbs-supply-stock-alert {
    display: inline-flex !important;
    box-sizing: border-box;
    width: max-content;
    max-width: 100%;
    height: 16px;
    min-height: 16px;
    align-items: center;
    gap: 2px;
    padding: 0 5px;
    font-size: 10px;
    line-height: 10px;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-summary-line .fbs-supply-overdue-mobile {
    min-height: 0;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-date > :is(
    .fbs-supply-date-main--desktop,
    .fbs-supply-date-empty-desktop
  ) {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-summary-label {
    display: inline;
    color: #94a3b8;
    font-size: .61rem;
    font-weight: 400;
    letter-spacing: .04em;
    text-transform: uppercase;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-summary-composition {
    display: inline-flex;
    min-width: 0;
    flex-direction: column;
    align-items: flex-end;
    gap: 1px;
    text-align: right;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-summary-composition .fbs-supply-cancelled-during-pick {
    margin-right: 0;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row .fbs-mobile-summary-composition .fbs-supply-counts {
    flex-wrap: nowrap;
    white-space: nowrap;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.fbs-supply-owner {
    display: none !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row > td.wms-mobile-action-row {
    grid-column: 1 / -1 !important;
    grid-row: var(--fbs-mobile-action-row) !important;
    justify-self: stretch !important;
  }
  /* Единый настоящий action-row: роли слева, свободный промежуток в центре,
     действия справа. FBS больше не выпускает детей через display: contents. */
  :is(#ship-list, #fbs-supply-list) > tbody > tr > td.wms-mobile-action-row > .wms-mobile-owner-panel {
    display: grid !important;
    position: static !important;
    z-index: auto;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    grid-column: 1;
    grid-row: 1 !important;
    width: 100% !important;
    min-width: 0;
    margin: 0;
    align-self: center !important;
    justify-self: start;
    justify-content: stretch;
  }
  :is(#ship-list, #fbs-supply-list) > tbody > tr > td.wms-mobile-action-row > .wms-document-actions {
    grid-column: 2;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: end;
  }
  /* FBM · черновик Ozon: создание заявки — отдельный верхний шаг справа,
     а проверка остатка, формирование и удаление остаются единым нижним рядом.
     Ответственные выравниваются именно с нижним рабочим рядом. */
  #ship-list > tbody > tr.fbm-shipment-status-draft > td.wms-mobile-action-row > .wms-document-actions:has(> .oz-open) {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    justify-content: end;
    row-gap: 4px;
  }
  #ship-list > tbody > tr.fbm-shipment-status-draft > td.wms-mobile-action-row > .wms-document-actions:has(> .oz-open) > .oz-open {
    grid-column: 1 / -1;
    grid-row: 1;
    justify-self: end;
  }
  #ship-list > tbody > tr.fbm-shipment-status-draft > td.wms-mobile-action-row:has(> .wms-document-actions > .oz-open) > .wms-mobile-owner-panel {
    align-self: end !important;
  }
  /* #1552 · «Привести состав к наличию» — тоже отдельный шаг над рабочим рядом (под
     «Создать в Ozon», если он есть). В общем ряду длинная надпись забирала колонку
     ответственных целиком: на 375 px ей оставалось 0 px при нужных 96, и значок
     ответственного ложился поверх кнопки. */
  #ship-list > tbody > tr.fbm-shipment-status-draft > td.wms-mobile-action-row > .wms-document-actions:has(> .wms-fit-to-stock) {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    justify-content: end;
    row-gap: 4px;
  }
  #ship-list > tbody > tr.fbm-shipment-status-draft > td.wms-mobile-action-row > .wms-document-actions > .wms-fit-to-stock {
    grid-column: 1 / -1;
    grid-row: 1;
    justify-self: end;
  }
  #ship-list > tbody > tr.fbm-shipment-status-draft > td.wms-mobile-action-row > .wms-document-actions:has(> .oz-open) > .wms-fit-to-stock {
    grid-row: 2;
  }
  #ship-list > tbody > tr.fbm-shipment-status-draft > td.wms-mobile-action-row:has(> .wms-document-actions > .wms-fit-to-stock) > .wms-mobile-owner-panel {
    align-self: end !important;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row.fbs-supply-status-shipped > td.wms-mobile-action-row > .wms-document-actions > .fbs-supply-waiting {
    display: inline-flex;
    width: auto;
    min-height: 24px;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 0;
    padding: 0;
    font-size: 11px;
    font-weight: 400;
    line-height: 12px;
    text-align: right;
    white-space: nowrap;
  }
}

/* Происхождение строки черновика — на ПК под номером; копия у ✕ живёт только на телефоне. */
.returns-receive-line-origin-phone { display: none; }
/* Возвраты · mobile: строка черновика приёмки — самостоятельная компактная карточка.
   Слева № и под ним удаление; справа артикул и под ним ШК без повторных подписей;
   организация и количество находятся в одном ряду; ниже — заказ во всю ширину, затем
   причина слева и площадка справа.
   ⚠️ Каждой ячейке строки — СВОЁ место в сетке: ячейка без места уходит в неявный ряд за
   фиксированную высоту и наползает на следующую карточку (#1759: «Площадка», «Причина»,
   «Заказ» с 26.09 стояли под карточкой). */
@media (max-width: 640px) {
  #returns-list .returns-receive-lines-wrap {
    width: 100%;
    margin-right: 0;
    margin-left: 0;
  }
  #returns-list table.returns-receive-lines-table.responsive.responsive-compact > tbody > tr {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-rows: 20px 24px 24px 16px 16px;
    column-gap: 8px;
    row-gap: 0;
    box-sizing: border-box;
    height: 110px;
    padding: 4px 8px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, .05);
  }
  #returns-list table.returns-receive-lines-table.responsive.responsive-compact td {
    min-width: 0;
    padding: 0;
    margin: 0;
  }
  #returns-list .returns-receive-line-posting {
    grid-column: 1;
    grid-row: 1;
    justify-content: flex-start !important;
    gap: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #returns-list .returns-receive-line-posting::before {
    content: "№";
    display: inline !important;
    margin: 0;
  }
  #returns-list .returns-receive-line-delete-cell {
    display: flex !important;
    grid-column: 1;
    grid-row: 2;
    align-items: center;
    justify-content: flex-start;
    padding: 0 !important;
    border: 0;
  }
  #returns-list .returns-receive-line-delete {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
  }
  /* ⭐ Происхождение строки (#1745): в первой строке карточки рядом с длинным номером Ozon
     (17 знаков) метке места нет — она встаёт во вторую строку рядом с ✕. */
  #returns-list .returns-receive-line-posting .returns-receive-line-origin { display: none; }
  #returns-list .returns-receive-line-origin-phone {
    display: inline;
    margin-left: 6px;
    white-space: nowrap;
  }
  #returns-list .returns-receive-line-sku {
    grid-column: 2;
    grid-row: 1;
    justify-content: flex-end !important;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #returns-list .returns-receive-line-barcode {
    grid-column: 2;
    grid-row: 2;
    justify-content: flex-end !important;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #returns-list :is(.returns-receive-line-sku, .returns-receive-line-barcode)::before {
    display: none !important;
  }
  #returns-list .returns-receive-line-category { display: none !important; }
  #returns-list .returns-receive-line-org {
    grid-column: 1;
    grid-row: 3;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 4px;
  }
  #returns-list .returns-receive-line-qty {
    grid-column: 2;
    grid-row: 3;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 4px;
  }
  #returns-list :is(.returns-receive-line-org select, .returns-receive-line-qty input) {
    box-sizing: border-box;
    height: 24px;
    padding-top: 0;
    padding-bottom: 0;
  }
  /* Заказ, причина, площадка — одной строкой каждая; длинное режется многоточием, а не
     переносится: высота карточки постоянная. `block` вместо общего `flex`: у flex-ячейки
     текст — анонимный элемент, и многоточие на нём не работает. */
  #returns-list :is(.returns-receive-line-order, .returns-receive-line-reason, .returns-receive-line-mp) {
    display: block !important;
    overflow: hidden;
    line-height: 16px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  #returns-list :is(.returns-receive-line-order, .returns-receive-line-reason)::before {
    margin-right: 4px;
  }
  #returns-list .returns-receive-line-order {
    grid-column: 1 / -1;
    grid-row: 4;
  }
  #returns-list .returns-receive-line-reason {
    grid-column: 1;
    grid-row: 5;
  }
  #returns-list .returns-receive-line-mp {
    grid-column: 2;
    grid-row: 5;
    text-align: right;
  }
  #returns-list .returns-receive-line-mp::before { display: none !important; }
}
/* ─── 560: сборщик на задании — «собирают: …», панель переназначения, галки ─── */
/* Прогресс сборщика в панели ролей («Роза Г. 40/60»): тише имени, одной строкой. */
.doc-owner-progress { margin-left: .2rem; font-size: .65rem; color: #94a3b8; font-variant-numeric: tabular-nums; white-space: nowrap; }
.doc-owner-pickers .fbs-owner-name-compact { white-space: normal; }
.doc-owner-picker-line { white-space: nowrap; }
@media (max-width: 640px) {
  #fbs-supply-list .wms-mobile-owner-panel .doc-owner-picker-line {
    display: block;
    line-height: 12px;
  }
  #fbs-supply-list .wms-mobile-owner-panel .doc-owner-picker-line .doc-owner-progress {
    line-height: inherit;
  }
  #fbs-supply-list .wms-mobile-owner-panel .doc-owner-picker-separator { display: none; }
}
/* Общая панель переназначения FBM/FBS: нейтральный рабочий блок вместо
   пунктирной служебной плашки. Desktop и mobile используют один компонент. */
/* ⭐⭐⭐ ПАНЕЛЬ ПЕРЕНОСИТСЯ, А НЕ УЕЗЖАЕТ ЗА КРАЙ (владелец 12.09: «невозможно сменить
   сборщика — не видно за экраном»). Ей нужно 543px непрерывной ширины (замер в браузере
   12.09: заголовок 112 + `?` 14 + селект 140 + галка 105 + кнопка 108 + gap/padding),
   а `flex-wrap: nowrap` с фиксированными ширинами не давал ни перенести, ни сжать —
   в узком окне ПК кнопка «Переназначить» просто оказывалась за правым краем и нажать её
   было нечем. ⛔ Мобильная ветка (≤640px) это НЕ закрывала: дефект живёт ровно в зазоре
   641…~860px, где её уже нет, а перенос ещё запрещён.
   ⚠️ Правится в ЯДРЕ (`reassign_picks_panel` в `_macros.html`) — панель одна на FBM, FBS
   и FF, поэтому чинится во всех разделах сразу. */
.reassign-picks-panel {
  box-sizing: border-box;
  display: flex !important;
  position: relative;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 8px !important;
  margin-top: 8px;
  padding: 6px 8px !important;
  border: 0;
  border-radius: 0 0 var(--doc-list-radius, .75rem) var(--doc-list-radius, .75rem);
  background: #f7f8fa;
  color: #475569;
  box-shadow: none;
}
/* FBM detail-ячейка имеет px-4/pb-3, а загруженный вид «По упаковке» ещё mb-3.
   Панель остаётся общей с FBS, но в FBM отделяется от последней строки небольшим
   рабочим зазором: без него она читалась как продолжение таблицы. */
#ship-list > tbody > tr.ship-detail:not(.hidden) > td:has(> .reassign-picks-panel) {
  padding-bottom: 0 !important;
}
#ship-list > tbody > tr.ship-detail:not(.hidden) > td:has(> .reassign-picks-panel)
  > .fbm-shipment-card {
  margin-bottom: 0 !important;
}
#ship-list > tbody > tr.ship-detail:not(.hidden) > td > .reassign-picks-panel {
  width: calc(100% + 2rem);
  margin-top: 8px;
  margin-right: -1rem;
  margin-bottom: 0;
  margin-left: -1rem;
  padding-right: calc(1rem + 8px) !important;
  padding-left: calc(1rem + 8px) !important;
}
.reassign-picks-panel__head,
.reassign-picks-panel__controls {
  display: contents;
}
.reassign-picks-panel__help { order: 5; }
.reassign-picks-panel__title {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: #64748b;
  font-size: 11px;
  font-weight: 600;
  line-height: 14px;
  white-space: nowrap;
}
.reassign-picks-panel__picker-icon {
  width: 14px;
  height: 14px;
  color: currentColor;
}
.reassign-picks-panel__select-control {
  position: relative;
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  width: 140px;
  min-width: 104px;
  max-width: 140px;
  /* ⚠️ Сжимается до 104px — той же ширины, что на телефоне: имя сборщика там уже
     проверено на читаемость, и ниже опускаться нельзя. */
  flex: 0 1 140px;
  height: 28px;
  border: 1px solid #cfd5df;
  border-radius: 6px;
  background: #fff;
}
.reassign-picks-panel__select-trigger {
  display: block;
  width: 100%;
  height: 100%;
  list-style: none;
  cursor: pointer;
}
.reassign-picks-panel__select-trigger::-webkit-details-marker { display: none; }
.reassign-picks-panel__select-value {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: 0 20px 0 8px;
  overflow: hidden;
  color: #475569;
  font-size: 11px;
  font-weight: 400;
  line-height: 26px;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2364748b' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4 6 4 4 4-4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 6px center;
  background-size: 8px;
}
.reassign-picks-panel__select-menu {
  display: none;
  position: absolute;
  z-index: 80;
  top: calc(100% + 4px);
  left: 0;
  box-sizing: border-box;
  min-width: 100%;
  max-height: 160px;
  padding: 3px;
  overflow-y: auto;
  border: 1px solid #cfd5df;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 8px 20px rgb(15 23 42 / 14%);
}
.reassign-picks-panel__select-control[open] > .reassign-picks-panel__select-menu {
  display: grid;
}
.reassign-picks-panel__select-option {
  width: 100%;
  padding: 4px 6px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: #475569;
  font-size: 11px;
  line-height: 14px;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
}
.reassign-picks-panel__select-option:hover,
.reassign-picks-panel__select-option:focus-visible {
  background: #eef1f5;
  outline: none;
}
.reassign-picks-panel .fbs-reassign-check--all {
  color: #64748b;
  font-size: 10px;
  line-height: 14px;
  white-space: nowrap;
}
.reassign-picks-panel__submit.ui-action--compact {
  min-height: 28px;
  padding: 0 10px;
  border-color: #d7dce5;
  border-radius: 6px;
  background: #e9ecf1;
  color: #7c8798;
  font-size: 11px;
}
.reassign-picks-panel__submit.ui-action--compact:hover:not(:disabled) {
  border-color: #c7cdd7;
  background: #e1e5eb;
  color: #5f6b7b;
}
.reassign-picks-panel.has-selection.has-picker .reassign-picks-panel__submit.ui-action--compact {
  border-color: #4b5563;
  background: #4b5563;
  color: #fff;
}
.reassign-picks-panel.has-selection.has-picker .reassign-picks-panel__submit.ui-action--compact:hover:not(:disabled) {
  border-color: #374151;
  background: #374151;
  color: #fff;
}
@media (max-width: 640px) {
  .reassign-picks-panel {
    display: block !important;
    padding: 6px !important;
    border-radius: 0;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden) > td > .reassign-picks-panel {
    margin-top: 10px;
    padding-right: calc(1rem + 6px) !important;
    padding-left: calc(1rem + 6px) !important;
  }
  #ship-list > tbody > tr.ship-detail:not(.hidden) > td:has(> .reassign-picks-panel)
    > .fbm-shipment-card {
    padding-bottom: 0 !important;
  }
  .reassign-picks-panel__head {
    display: flex;
    width: 100%;
    align-items: center;
  }
  .reassign-picks-panel__controls {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    margin-top: 4px;
  }
  .reassign-picks-panel__title {
    gap: 2px;
    font-size: 10px;
    line-height: 12px;
  }
  .reassign-picks-panel__picker-icon {
    width: 12px;
    height: 12px;
  }
  .reassign-picks-panel__select-control {
    width: 104px;
    min-width: 104px;
    max-width: 104px;
    flex-basis: 104px;
    height: var(--ui-control-height-compact);
    min-height: var(--ui-control-height-compact);
    max-height: var(--ui-control-height-compact);
    border-radius: 5px;
  }
  :is(#ship-list, #fbs-supply-list)
    > tbody > tr.ship-detail:not(.hidden):has(.reassign-picks-panel__select-control[open]) {
    position: relative;
    z-index: 90;
    overflow: visible !important;
  }
  .reassign-picks-panel:has(.reassign-picks-panel__select-control[open]),
  .reassign-picks-panel__select-control[open] {
    z-index: 91;
    overflow: visible;
  }
  .reassign-picks-panel__select-value {
    padding: 0 18px 0 6px;
    font-size: 10px;
    line-height: 22px;
    background-position: right 5px center;
  }
  .reassign-picks-panel__select-control:focus-within {
    border-color: #94a3b8;
    box-shadow: 0 0 0 1px rgb(148 163 184 / 20%);
  }
  .reassign-picks-panel .fbs-reassign-check--all {
    flex: 0 0 auto;
    font-size: 9px;
  }
  .reassign-picks-panel__submit.ui-action--compact {
    flex: 0 0 auto;
    box-sizing: border-box;
    height: var(--ui-control-height-compact) !important;
    min-height: var(--ui-control-height-compact) !important;
    max-height: var(--ui-control-height-compact);
    padding: 0 6px !important;
    font-size: 10px;
    line-height: 1;
  }
  .reassign-picks-panel__help {
    position: static;
    order: 0;
    display: inline-flex;
    width: 14px;
    height: 14px;
    flex: 0 0 14px;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 9px;
    margin-left: auto;
  }
}
/* Имя сборщика заказа под номером в составе FBS. */
.fbs-pack-picker { line-height: 1.1; }
.fbs-pack-picker__icon {
  width: 10px;
  height: 10px;
  margin-right: 2px;
  vertical-align: -1px;
}
.fbs-pack-picker-mobile { display: none; }
.fbs-pack-picker--missing,
.fbs-owner-picker-missing,
.fbs-owner-not-assigned { color: #d97706; }

/* Кнопка «первые N» рядом с «отметить все» в ленте FBS: порция сборщика (настройка
   склада). Тихая текстовая команда, а не вторая основная кнопка. */
.fbs-first-n { padding: 0 .15rem; background: none; border: 0; cursor: pointer; }
.fbs-first-n:hover { text-decoration: underline; }

/* Галка переназначения у заказа FBS идёт сразу после имени сборщика. Видимой подписи
   нет ни на desktop, ни на mobile; полное имя действия остаётся доступным скрытым текстом. */
.fbs-reassign-check { display: inline-flex; align-items: center; gap: .2rem; margin-right: .3rem; cursor: pointer; }
.fbs-reassign-check--all { margin: 0; }
/* Системный checkbox один для таблиц FBM и выбора переназначения FBS. */
.ui-checkbox {
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  cursor: pointer;
}
.ui-checkbox--bulk-item {
  padding-left: 4px;
  border-left: 1px solid #e2e8f0;
}
.ui-checkbox--with-label {
  gap: 6px;
  color: #64748b;
  font-size: 12px;
}
:is(.fbs-reassign-check, .ui-checkbox) > input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}
:is(.fbs-reassign-check__box, .ui-checkbox__box) {
  display: inline-flex;
  box-sizing: border-box;
  flex: 0 0 14px;
  width: 14px !important;
  min-width: 14px;
  max-width: 14px;
  height: 14px !important;
  min-height: 14px;
  max-height: 14px;
  align-items: center;
  justify-content: center;
  border: 1px solid #94a3b8;
  border-radius: 3px;
  background: #fff;
}
:is(.fbs-reassign-check__box, .ui-checkbox__box)::after {
  content: "";
  width: 4px;
  height: 7px;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  opacity: 0;
  transform: translateY(-1px) rotate(45deg);
}
:is(.fbs-reassign-check, .ui-checkbox) > input:checked + :is(.fbs-reassign-check__box, .ui-checkbox__box),
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
  > tbody > tr.fbs-pack-row:has(.fbs-reassign-check--mobile input:checked)
  .fbs-reassign-check__box {
  border-color: var(--ui-accent);
  background: var(--ui-accent);
}
:is(.fbs-reassign-check, .ui-checkbox) > input:checked + :is(.fbs-reassign-check__box, .ui-checkbox__box)::after,
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
  > tbody > tr.fbs-pack-row:has(.fbs-reassign-check--mobile input:checked)
  .fbs-reassign-check__box::after {
  opacity: 1;
}
:is(.fbs-reassign-check, .ui-checkbox) > input:focus-visible + :is(.fbs-reassign-check__box, .ui-checkbox__box) {
  outline: 2px solid var(--ui-accent-line);
  outline-offset: 2px;
}

/* ══ Экран «Данные» (звезда, кусок 3, 07.09): канал → ряд на предмет
   бронза → сильвер → голд → витрина; расчётные полосой; справочники пунктиром.
   ⚠️ Стили ЗДЕСЬ, а не в шаблоне: инлайновый <style> запрещён политикой безопасности.
   ⭐ Требование владельца 04.09: поток рисуется СТРЕЛКОЙ, связь со справочником
   ПУНКТИРОМ, у витрины видна пометка вида; разрез — подпись, а не плитка. */
.dl-row{background:#fff;border:1px solid var(--ui-border);border-radius:10px;
        padding:10px 12px;margin-bottom:10px;display:grid;
        grid-template-columns:var(--dl-subject) minmax(0,1fr);gap:12px;
        box-shadow:0 2px 8px rgba(15,23,42,.05)}
  /* ⭐⭐ ЭТАПЫ — КОЛОНКИ, А НЕ ПОТОК ПЛИТОК (требование владельца 17.09: «этапы визуально
     должны быть разделены по вертикали, для удобства чтения»). Ширины заданы ОДНИМИ
     переменными и для шапки, и для рядов — иначе колонки разъезжались бы построчно, и
     глаз терял, где кончается Silver и начинается Gold. Раньше ряд был flex-потоком с
     `flex:1 1 150px`, и у ряда с двумя плитками Silver столбцы съезжали относительно
     соседнего ряда. */
  .dl{--dl-subject:200px;--dl-sep:22px}
  .dl-head{display:grid;grid-template-columns:var(--dl-subject) minmax(0,1fr);
           gap:12px;padding:0 12px;margin-bottom:4px}
  .dl-head-cols{display:grid;
                grid-template-columns:minmax(0,1fr) var(--dl-sep) minmax(0,1fr)
                                      var(--dl-sep) minmax(0,1fr) var(--dl-sep) minmax(0,1.3fr);
                font-size:9px;letter-spacing:.06em;text-transform:uppercase;color:#94a3b8}
  .dl-head-cols b{font-weight:600;color:#64748b}
  .dl-subject-name{font-size:14px;font-weight:600;color:var(--ui-text)}
  .dl-subject-cap{font-size:11px;line-height:14px;color:#64748b;margin-top:2px}
  .dl-links{margin-top:6px;display:flex;flex-wrap:wrap;gap:4px}
  /* ⭐ ПУНКТИР = связь со справочником: рисуется ИНАЧЕ, чем поток. */
  .dl-link{border:1px dashed #94a3b8;border-radius:5px;padding:0 6px;
           font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;
           color:#475569}
  .dl-more{display:inline-block;margin-top:6px;font-size:11px;color:#4338ca}
  .dl-more:hover{text-decoration:underline}
  /* ⭐ Поток — сетка КОЛОНОК со стрелками-разделителями между слоями. */
  .dl-flow{display:grid;align-items:start;
           grid-template-columns:minmax(0,1fr) var(--dl-sep) minmax(0,1fr)
                                 var(--dl-sep) minmax(0,1fr) var(--dl-sep) minmax(0,1.3fr)}
  .dl-cell{display:flex;flex-direction:column;gap:6px;min-width:0}
  /* ⚠️ Отсутствующее звено занимает ВСЮ ширину ряда — иначе оно село бы в колонку сырья
     и выглядело бы как пропавшая плитка Bronze, а не как «контура нет вовсе». */
  .dl-flow > .dl-missing, .dl-flow > .dl-derived{grid-column:1 / -1}
  /* ⭐ У ряда есть витрина — звено занимает только сырьё…чистое, а витрина стоит в СВОЕЙ
     колонке (#1580). Во всю ширину она переезжала строкой ниже в узкую колонку сырья, и
     имя таблицы шло по букве в столбик — так выглядели все ряды Avito «нет» с витриной. */
  .dl-flow > .dl-missing--with-data, .dl-flow > .dl-derived--with-data{grid-column:1 / 6}
  /* ⭐ Разделитель этапов: вертикальная линия во всю высоту ряда, стрелка сидит НА ней.
     Линия выходит за отступ карточки вверх и вниз, чтобы колонки читались сплошными. */
  .dl-sep{align-self:stretch;position:relative;display:flex;align-items:center;
          justify-content:center;color:var(--ui-accent);font-size:15px;user-select:none}
  .dl-sep::before{content:"";position:absolute;top:-11px;bottom:-11px;left:50%;width:1px;
                  background:var(--ui-border)}
  .dl-sep i{position:relative;background:#fff;font-style:normal;line-height:1;padding:3px 0}
  /* Стрелка в ЛЕГЕНДЕ — просто значок «поток данных», не разделитель колонки. */
  .dl-arrow{color:var(--ui-accent);font-size:15px;user-select:none}
  .dl-layer{display:block;font-size:9px;letter-spacing:.04em;text-transform:uppercase;
            color:#94a3b8;margin-bottom:2px}
  .dl-tile{border:1px solid var(--ui-border);border-radius:8px;padding:6px 8px;
           background:#f8fafc;min-width:0}
  .dl-tile--bronze{background:#fffbeb;border-color:#fcd9a0}
  .dl-tile--data{background:#f5f3ff;border-color:var(--ui-accent)}
  .dl-tile--calc{background:#fff7ed;border-color:#fdba74}
  .dl-tile--off{opacity:.5;border-style:dashed}
  .dl-tbl{display:block;font-size:11px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
          color:#3730a3;word-break:break-all}
  a.dl-tbl:hover{text-decoration:underline}
  .dl-cap{font-size:10px;line-height:13px;color:#64748b;white-space:nowrap;
          overflow:hidden;text-overflow:ellipsis}
  .dl-num{font-size:14px;font-weight:600;color:#1e293b;font-variant-numeric:tabular-nums;
          margin-top:2px;line-height:18px}
  .dl-num span{font-size:10px;font-weight:400;color:#94a3b8}
  .dl-meta{font-size:10px;line-height:13px;color:#64748b;margin-top:2px}
  .dl-grain{color:#94a3b8}
  .dl-why{color:#b45309}
  .dl-hist{color:#be123c;text-decoration:underline;margin-left:4px}
  /* ⭐ Пометка ВИДА витрины — прямое требование владельца. */
  .dl-kind{display:inline-block;font-size:10px;padding:0 6px;border-radius:4px;
           text-transform:none;letter-spacing:0}
  .dl-kind--reduced{background:#e0e7ff;color:#3730a3}
  .dl-kind--computed{background:#fef3c7;color:#92400e}
  /* ⚠️ Отсутствующее / производное звено — приглушённо и словами, не выдуманной плиткой. */
  .dl-missing,.dl-derived{flex:1 1 100%;border:1px dashed #cbd5e1;border-radius:8px;
                          padding:8px 10px;font-size:11px;line-height:14px;background:#fff}
  .dl-missing{color:#b45309}
  .dl-derived{color:#475569}
  .dl-legend{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin:2px 0 12px;
             font-size:11px;color:#64748b}
  .dl-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px}
  .dl-refs{border:1px dashed #94a3b8;border-radius:10px;padding:10px 12px;
           margin-bottom:16px;background:#fff}
  /* ⛔⛔ ВКЛАДКИ КАНАЛОВ. Здесь стояли классы `ui-chip`/`ui-chip--on`, которых НЕТ НИ В
     ОДНОМ css проекта — ни в `base.css`, ни в собранном `static/app.css`. Вкладки
     рисовались обычным текстом, и выбранный канал не отличался от прочих (жалоба
     владельца 17.09 «должно быть видно, какой канал выбран»). Ровно тот капкан, что
     записан в правилах: Tailwind собран СТАТИЧЕСКИ, класса нет — правило молча не
     работает. Свои классы живут здесь. */
  .dl-mp{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:8px;
         border:1px solid var(--ui-border);background:#fff;font-size:13px;color:#475569;
         line-height:18px}
  .dl-mp:hover{border-color:var(--ui-accent);color:var(--ui-accent)}
  .dl-mp--on{background:var(--ui-accent);border-color:var(--ui-accent);color:#fff;
             font-weight:600;box-shadow:0 1px 4px rgba(67,56,202,.28)}
  .dl-mp--on:hover{color:#fff}
  /* Пометка «витрина общая для всех каналов» и список источников — мелочью под плиткой. */
  .dl-common{display:inline-block;font-size:9px;letter-spacing:.02em;padding:0 5px;
             border-radius:4px;background:#ecfdf5;color:#047857;margin-top:3px}
  .dl-src{font-size:10px;line-height:14px;color:#64748b;margin-top:3px}
  .dl-src a{color:#4338ca}
  .dl-src a:hover{text-decoration:underline}
  /* ⚠️ Чтение мимо слоя витрин — ЖЁЛТЫМ, а не как все: цель владельца «данные берутся из
     витрин и ниоткуда больше», и пока это не так, экран обязан это показывать. */
  .dl-src--gold{color:#b45309}
  @media (max-width:767px){
    .dl-row{grid-template-columns:1fr;gap:8px}
    /* На узком колонки складываются в столбик: разделители-стрелки становятся
       горизонтальными подсказками направления, линия между колонками не нужна. */
    .dl-flow{grid-template-columns:1fr}
    .dl-flow > .dl-missing--with-data, .dl-flow > .dl-derived--with-data{grid-column:1 / -1}
    .dl-sep{align-self:auto;padding:2px 0}
    .dl-sep::before{display:none}
    .dl-sep i{transform:rotate(90deg);display:inline-block}
    .dl-head{display:none}
  }

/* ⚠️ Наши правила разделов FBS/FF, потерянные при взятии base.css от main (свод 05.09). Возвращены дословно: разметку они держат, а в main их нет. */
.fbs-date-mobile { display: none; }

.fbs-supply-code { padding-left: 2.01rem; }

.fbs-supply-created {
  padding-left: 2.01rem;
  color: #b8c3d1;
  font-size: .68rem;
  line-height: 1.2;
}

.fbs-supply-weekday {
  flex: 0 0 auto;
  margin: 0;
  white-space: nowrap;
}

.ui-flash-close {
  position: relative;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  border: 0;
  border-radius: .5rem;
  background: transparent;
  color: currentColor;
  cursor: pointer;
  opacity: .58;
}

.ui-flash-close:hover { background: rgba(15, 23, 42, .06); opacity: .9; }

.ui-flash-close:focus-visible {
  outline: 2px solid var(--ui-accent);
  outline-offset: 1px;
}

.ui-flash-close::before,
.ui-flash-close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: .75rem;
  height: 1.5px;
  border-radius: 999px;
  background: currentColor;
}

.ui-flash-close::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: .75rem;
  height: 1.5px;
  border-radius: 999px;
  background: currentColor;
}

.ui-flash-close::before { transform: translate(-50%, -50%) rotate(45deg); }

.ui-flash-close::after { transform: translate(-50%, -50%) rotate(-45deg); }

/* ═══ Наши правила разделов FBS/FBM/FF, потерянные при взятии base.css от main
   (свод 05.09). ⛔⛔ ВОЗВРАЩАЯ ПРАВИЛО, ВОЗВРАЩАЙ И ЕГО @media: при первом своде
   все 44 были приклеены В КОНЕЦ ФАЙЛА ПЛОСКО, и мобильные среди них начали
   действовать на ПК. Цена, боевой день 05.09: `.is-fbs .wms-context-heading
   { display:none }` — правило телефона (≤640px) — на десктопе снесло всю шапку
   FBS вместе с кнопками «Остатки на витринах» и «Обновить заказы».
   ⚠️ Мерка правильности — не «есть ли селектор», а «в той ли он @media»: плоский
   файл проходит любой поиск по подстроке. ═══ */

.wms-context-tabs-wrap.is-fbs { margin-bottom: 5px; }
@media (max-width: 767px) {
  .wms-context-tabs-wrap.is-fbs { margin-bottom: 2px; }
}
.fbs-cutoff-item:hover { background: #e7eaf1; border-color: var(--ui-filter-active); }
.fbs-cutoff-item.is-active { background: var(--ui-filter-active); border-color: var(--ui-filter-active); color: #fff; }
.fbs-cutoff-item.is-active b { color: #fff; }
.fbs-date-mobile { display: none; }
#fbs-supply-list .fbs-trbx-box-action--icon .ui-action-icon {
  width: 14px;
  height: 14px;
}
#ship-list .fbm-destination-text {
  display: -webkit-box;
  min-width: 0;
  overflow: hidden;
  overflow-wrap: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (max-width: 640px) {
  .fbs-mobile-refresh-form {
    margin-left: auto;
    flex: 0 0 auto;
  }
  .fbs-mobile-select-all .fbs-mobile-refresh {
    height: 1.75rem;
    min-height: 1.75rem;
    padding: .28rem .45rem;
    font-size: .68rem;
  }
  /* ⛔⛔ ЗДЕСЬ БЫЛО СКРЫТИЕ ШАПКИ FBS ЦЕЛИКОМ (боевой дефект 06.09, скрины владельца).
     `.wms-context-heading` — РОДИТЕЛЬ `<details>` с плюсом, под которым живут действия
     раздела; погасив родителя, правило убирало и плюс, и обе кнопки FBS, тогда как у
     соседних FBMP и FF (класса `is-fbs` на них нет) плюс стоял на месте. Разница на
     одном и том же экране телефона и выдала дефект.
     ⛔ Специфичность потомка тут НЕ ЛЕЧИТ: `display:none` у родителя гасит поддерево
     независимо от веса правил внутри — на это я и попался, посчитав вес только второй
     половины селектора.
     ⭐ Показом действий с 06.09 управляет `wms-context-actions-disclosure` (плюс на
     ≤767px, раскрыто на ПК) — отдельное скрытие для FBS стало лишним и вредным.
     ⚠️ Заголовок раздела на телефоне по-прежнему скрыт общим `main .wms-context-title`,
     так что видимой становится РОВНО кнопка плюса, как у FBMP и FF. */
  #fbs-supply-list tr.fbs-supply-row .fbs-supply-title,
  #fbs-supply-list tr.fbs-supply-row .fbs-supply-channel,
  #fbs-supply-list tr.fbs-supply-row .fbs-supply-code {
    padding-right: 7.65rem;
  }
  #fbs-supply-list .fbs-supply-channel {
    display: none;
  }
  #fbs-supply-list .fbs-mobile-org,
  #fbs-supply-list .fbs-mobile-org-separator {
    display: inline;
  }
  #fbs-supply-list .fbs-mobile-org {
    margin-left: .05rem;
  }
  #fbs-supply-list .fbs-mobile-org-separator {
    color: #94a3b8;
    font-weight: 400;
    margin-right: -.17rem;
    margin-left: -.17rem;
  }
  #fbs-supply-list .fbs-supply-title > .fbs-mp-badge,
  #fbs-supply-list .fbs-supply-title > .fbs-mobile-org,
  #fbs-supply-list .fbs-supply-title > .fbs-mobile-org-separator,
  #fbs-supply-list .fbs-supply-title > .fbs-supply-warehouse {
    position: relative;
    top: -.06rem;
  }
  #fbs-supply-list .fbs-supply-code {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-top: 0 !important;
    padding-left: 2.01rem;
    color: #94a3b8;
    font-size: .68rem;
  }
  #fbs-supply-list td.fbs-supply-summary > .fbs-supply-code:nth-child(3) {
    margin-top: -.5rem !important;
    pointer-events: none;
  }
  #fbs-supply-list .fbs-supply-state .fbs-supply-percent,
  #fbs-supply-list .fbs-supply-state .fbs-supply-market-state {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
  }
  #fbs-supply-list .fbs-date-desktop { display: none; }
  #fbs-supply-list .fbs-date-mobile { display: inline; }
  #fbs-supply-list .fbs-supply-created { display: none; }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception :is(.ui-action-icon, .ui-system-icon) {
    width: 1.12rem;
    height: 1.12rem;
    stroke-width: 1.4;
  }
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table .fbs-pick-exception > span:not(.ui-system-icon) {
    display: none;
  }
  #fbs-supply-list > tbody > tr.fbs-supply-row:is(.fbs-supply-status-packed, .fbs-supply-status-shipped, .fbs-supply-status-accepted, .fbs-supply-status-closed, .fbs-supply-status-cancelled) .fbs-supply-weekday {
    margin-right: .24rem;
  }
}

@media (max-width: 480px) {
  .wms-context-tabs-wrap.is-fbs .wms-context-fbs-actions .wms-context-action {
    min-height: 1.75rem;
    padding: .28rem .4rem;
    font-size: .66rem;
  }
}

@media (min-width: 768px) {
  .doc-icon-sm-desktop { width: 1.5rem; height: 1.5rem; }
}

@media (min-width: 641px) {
  .wms-inner-table-head > tr > th {
    box-sizing: border-box;
    height: 2rem;
    padding: .4rem .62rem !important;
    border-top: 0 !important;
    border-bottom: 2px solid #ddd6fe !important;
    background: #fff !important;
    color: #667085 !important;
    font-size: .62rem !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    letter-spacing: .035em !important;
    vertical-align: middle;
    text-transform: uppercase;
    white-space: nowrap;
  }

  /* Несданный заказ: поздняя desktop-раскладка задаёт собственные цвета номеру
     и артикулу, поэтому состояние строки обязано стоять после неё в каскаде. */
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    > tbody > tr.fbs-pack-row--undelivered > td.fbs-pack-order,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    > tbody > tr.fbs-pack-row--undelivered > td.fbs-pack-order > span:not(.fbs-pack-picker),
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    > tbody > tr.fbs-pack-row--undelivered > td.fbs-pack-product > b,
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    > tbody > tr.fbs-pack-row--undelivered > td.fbs-pack-qty > b {
    color: #e11d48;
  }
}

/* Несданный заказ остаётся одной семантической строкой на обеих ширинах. */
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden):is(
  .fbs-supply-status-packed,
  .fbs-supply-status-shipped,
  .fbs-supply-status-accepted,
  .fbs-supply-status-closed,
  .fbs-supply-status-cancelled
) table.fbs-pack-table
  > tbody > tr.fbs-pack-row.fbs-pack-row--undelivered,
#fbs-supply-list > tbody > tr.ship-detail:not(.hidden):is(
  .fbs-supply-status-packed,
  .fbs-supply-status-shipped,
  .fbs-supply-status-accepted,
  .fbs-supply-status-closed,
  .fbs-supply-status-cancelled
) table.fbs-pack-table
  > tbody > tr.fbs-pack-row.fbs-pack-row--undelivered:hover {
  background: #fff1f2 !important;
}
/* Mobile-карточка — единая плоскость: фон внутренних grid-ячеек не должен
   превращать состояние в отдельные розовые прямоугольники. */
@media (max-width: 640px) {
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    > tbody > tr.fbs-pack-row.fbs-pack-row--undelivered > td {
    background: transparent !important;
  }
}
/* На desktop строка снова таблица, и непрозрачные ячейки обязаны продолжать
   тот же фон — иначе белые клетки перекрывают заливку tr. */
@media (min-width: 641px) {
  #fbs-supply-list > tbody > tr.ship-detail:not(.hidden) table.fbs-pack-table
    > tbody > tr.fbs-pack-row.fbs-pack-row--undelivered > td {
    background: #fff1f2 !important;
  }
}

/* Таблица точек FBS (состояние + график) — широкая, прокручивается ВНУТРИ СЕБЯ.
   ⛔⛔ Живой замер 06.09 на 375 px: с колонками состояния таблица выросла до 816 px, а
   блок настроек несёт `overflow-x: hidden` — правые колонки «час · дни · кабинет»
   обрезались БЕЗ прокрутки, то есть на телефоне были недостижимы вовсе. Правило проекта
   прямое: широкое содержимое скроллится в своём контейнере, страница по горизонтали не
   едет.
   ⚠️ Своим классом, а не утилитой `min-w-[52rem]`: произвольных `min-w-[…]` в
   статической сборке `static/app.css` НЕТ (проверено grep), и правило молча не работало
   бы — тот самый капкан «класса нет в сборке». */
.fbs-points-scroller { overflow-x: auto; }
.fbs-points-table { min-width: 52rem; }

/* ─── Репрайсер: подписи второй строки шапки не налезают друг на друга ──────
   ⛔ У таблицы дашборда стоит `whitespace-nowrap` (числа строк не должны рваться),
   и он же запрещал перенос ПОДПИСЯМ КОЛОНОК. Живой замер 07.09 (канал Ozon, 200
   строк, ширина 1600): «Без скидки» просило 83 px в ячейке 48, «Для клиента» — 92
   в 50, «Новая цена» — 139 в 117; семь подписей вылезали за свои ячейки и ложились
   на соседние — ровно то, что видно на скриншоте владельца.
   ⚠️ Перенос разрешаем ТОЛЬКО в шапке: в теле нерушимость строки несущая (цена и
   штуки не должны разрываться посреди числа).
   ⚠️ Целимся классом, а не `#repricer-table`: таблица разнесена по каналам, id у неё
   пронумерованный (`repricer-table-1`, `-2`, …) — по старому id не совпадает ни одна
   (тот же капкан уже похоронил здесь правила липкой шапки 15.07).
   ⛔⛔ ЦЕЛИТЬСЯ В `th` ОДНОГО МАЛО: подпись лежит внутри обёртки сортировки, и `nowrap`
   стоит на НЕЙ — правило на `th` матчилось, давало `normal`, а вычисленное значение
   оставалось `nowrap` (замер `getComputedStyle` 07.09). Дефект тихий: селектор
   выглядит рабочим.
   ⭐⭐ 24.09 НОСИТЕЛЬ СМЕНИЛСЯ: сортировка переехала в браузер, и обёртку рисует
   `table-sort.js` (`.ts-trigger` с подписью `.ts-text` и стрелками `.ts-arrows`) вместо
   серверной ссылки `.ui-sort-link`. Геометрия та же — сменились только имена узлов;
   оставь правила на старом классе, и шапка вернулась бы к «текст налезает на соседа».
   ⛔ Сами `.ts-trigger`/`.ts-arrows` вне `.repricer-head-wrap` НЕ трогаем — это общий
   компонент на всю систему; перенос там сломал бы выравнивание в остальных таблицах. */
.repricer-head-wrap > thead > tr > th,
.repricer-head-wrap > thead > tr > th .ts-trigger,
.repricer-head-wrap > thead > tr > th .ts-text { white-space: normal; }
/* Одинаковая геометрия двухъярусной шапки на desktop и mobile. Подписи стоят на
   нижней линии ячейки. Ссылка сортировки переносится `wrap-reverse`: пока места
   хватает, стрелка остаётся справа от названия; в узкой колонке она поднимается
   строкой выше. Так длинная подпись не выталкивает соседние колонки. */
.repricer-head-wrap > thead > tr > th .ts-trigger {
  display: inline-flex;
  max-width: 100%;
  flex-wrap: wrap-reverse;
  align-items: flex-end;
  justify-content: center;
  column-gap: .125rem;
  row-gap: 1px;
}
.repricer-head-wrap > thead > tr > th .ts-text {
  min-width: 0;
}
.repricer-head-wrap > thead > tr > th .ts-arrows {
  flex: 0 0 .75rem;
  margin-left: 0;
}
/* В двух подписях держим стрелку справа от последней строки «МП» / «сети»:
   текст переносится внутри своего span, а стрелка не уходит отдельной строкой. */
.repricer-head-wrap > thead > tr > th.repricer-head-inline-sort .ts-trigger {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: flex-end;
}
.repricer-head-wrap > thead > tr > th {
  padding-top: 2px;
  padding-bottom: 2px;
  line-height: 12px;
  text-align: center;
  vertical-align: bottom;
}
.repricer-head-wrap > thead > tr:first-child > th:first-child { text-align: left; }
.repricer-head-wrap > thead > tr:first-child > th:first-child .ts-trigger {
  justify-content: flex-start;
}
/* `?`, стрелка и подпись образуют компактный стек у нижней линии. Значок больше
   не привязан к верху высокой rowspan-ячейки и остаётся рядом с содержимым. */
.repricer-head-wrap > thead .repricer-head-stack {
  display: inline-flex;
  max-width: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 1px;
  vertical-align: bottom;
}
.repricer-head-wrap > thead .repricer-head-stack > .help {
  flex: 0 0 auto;
  margin: 0;
}
.repricer-head-wrap > thead .help {
  width: 12px;
  height: 12px;
  min-width: 12px;
  font-size: 9px;
}
/* Только групповые заголовки верхнего ряда держат `?` справа. Ячейки с rowspan
   визуально принадлежат нижней линии и сохраняют вертикальный стек. */
.repricer-head-wrap > thead > tr:first-child > th:not([rowspan]) .repricer-head-stack {
  flex-direction: row;
  align-items: flex-end;
  gap: 6px;
}
.repricer-head-wrap > thead > tr:first-child > th:not([rowspan]) .repricer-head-stack > .help {
  order: 2;
  margin-bottom: 0;
}

/* Обёртка таблицы репрайсера носит общий `.tidy-scroll` (полоса под таблицей, а не на ней).
   Его `scrollbar-gutter: stable` резервирует место под ВЕРТИКАЛЬНУЮ полосу (свойство
   действует только на неё), а вертикальной прокрутки у этой обёртки не бывает: замер
   29.09 — пустая полоса 12px у правого края, последняя колонка обрезалась раньше рамки.
   Снимаем ровно это; горизонтальная полоса остаётся 12px и места не отдаёт. */
.repricer-table-scroll.tidy-scroll { scrollbar-gutter: auto; }

/* Плотное тело репрайсера: поле новой цены уже имеет высоту 22px, поэтому прежние
   `py-1.5` добавляли к каждой строке ещё 12px. Оставляем по 2px сверху и снизу —
   числа, чекбоксы и поле остаются читаемыми, а длинная таблица показывает больше
   товаров. Раскрытая строка объяснения сохраняет собственную геометрию. */
.repricer-head-wrap > tbody > tr:not(.why-row) > td {
  padding-top: 2px;
  padding-bottom: 2px;
  line-height: 16px;
  vertical-align: middle;
}
/* Длинный артикул не должен вылезать из закреплённой первой колонки. Короткие
   остаются однострочными, длинные переносятся внутри слова (в том числе у `_`). */
.repricer-head-wrap > tbody > tr[data-acc-group]:not(.why-row) > td:first-child {
  white-space: normal;
}
.repricer-head-wrap > tbody > tr[data-acc-group]:not(.why-row) > td:first-child > a {
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 14px;
}
/* Строка магазина — визуальный разделитель групп, а не товарная строка. */
.repricer-head-wrap > tbody > tr.repricer-org > td {
  height: 26px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.repricer-no-sales {
  display: inline-flex;
  align-items: center;
  margin-left: 4px;
  line-height: 1;
  vertical-align: -2px;
}
.repricer-no-sales-text { display: none; }
.repricer-no-sales-icon {
  display: block;
  width: 14px;
  height: 14px;
  flex-basis: 14px;
}
.repricer-history-table {
  width: 100%;
  max-width: 900px;
  margin: .25rem auto 0;
}
.repricer-history-table > table > tbody > tr > td {
  height: 26px;
  padding-top: 5px;
  padding-bottom: 5px;
  line-height: 16px;
}

/* На телефоне длинные подписи строк «Итого канал» и магазина не должны раздувать
   липкий «Артикул» до половины экрана: фиксируем рабочую ширину, а служебным строкам
   разрешаем перенос внутри неё. Строки самих артикулов остаются однострочными. */
@media (max-width: 767px),
       (orientation: landscape) and (max-width: 1366px) and (hover: none),
       (orientation: landscape) and (max-width: 1366px) and (any-pointer: coarse) {
  .repricer-head-wrap > thead > tr > th.repricer-head-inline-sort {
    padding-right: 2px;
    padding-left: 2px;
  }
  .repricer-head-wrap > thead > tr:first-child > th[colspan] {
    vertical-align: middle;
  }
  .repricer-table-scroll {
    position: relative;
  }
  .repricer-sticky-head-clone {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 30;
    margin: 0;
    border-bottom: 2px solid var(--repricer-head-border, var(--ui-border-strong));
    background: var(--repricer-head-bg, var(--ui-surface-muted));
    table-layout: fixed;
  }
  .repricer-table-scroll.has-mobile-sticky-head > table[data-sticky-thead] > thead {
    visibility: hidden;
  }
  .repricer-head-wrap {
    border-collapse: separate;
    border-spacing: 0;
  }
  .repricer-head-wrap > thead,
  .repricer-head-wrap > thead > tr,
  .repricer-head-wrap > thead > tr > th {
    background: var(--repricer-head-bg, var(--ui-surface-muted));
    opacity: 1;
    position: relative;
    z-index: 6;
  }
  .repricer-head-wrap > colgroup > .repricer-col-sku,
  .repricer-head-wrap > thead > tr:first-child > th:first-child,
  .repricer-head-wrap > tbody.repricer-total-body > tr.repricer-total > td:first-child,
  .repricer-head-wrap > tbody > tr:not(.why-row) > td:first-child {
    width: 144px;
    min-width: 144px;
    max-width: 144px;
  }
  .repricer-head-wrap > tbody.repricer-total-body > tr.repricer-total > td:first-child,
  .repricer-head-wrap > tbody > tr.repricer-org > td:first-child {
    white-space: nowrap;
    line-height: 16px;
  }
  .repricer-count-unit { display: none; }
}

/* На широком экране auto-layout отдавал всё свободное место «Артикулу», а 23
   числовые колонки оставлял сжатыми. Фиксированная сетка распределяет всю ширину
   таблицы по смысловым группам; на узком экране сохраняется прежний auto-layout. */
@media (min-width: 1280px) {
  .repricer-head-wrap { table-layout: fixed; }
  /* ⭐⭐ ШИРИНЫ — В ПИКСЕЛЯХ ПО НУЖДЕ СОДЕРЖИМОГО, А НЕ В ПРОЦЕНТАХ (владелец 06.10: «что за
     белое пятно справа у Новой цены?», «знаки вопроса всё перекрывают»). Замер на боевой 06.10
     (1512 px, WB, 26 колонок): содержимому нужно 1659 px, а таблице давали 1462 — браузер
     ужимал колонки, текст наезжал на соседей, а последняя ячейка («Новая цена», которой в
     сетке не хватало `<col>` — см. colgroup шаблона) получала 5 px, и поле ввода вылезало на
     белый фон обёртки. В fixed-раскладке таблица шириной 100 проц. НЕ УЖЕ суммы колонок:
     когда экран у́же, она растёт до суммы и прокручивается в обёртке; когда шире — лишнее
     делится пропорционально. Нужда колонок (px, боевая 06.10): артикул 179, П1/П2 44–51,
     Δ 89–107, «сейчас» 51–55, сеть 50, OOS 36, цена 47–66, совет 61–69, новая цена 117.
     Нужда мерилась ПО СОДЕРЖИМОМУ ячеек (Range), с полями шапки 4 px: артикул 179, П1/П2 60,
     Δ 116, «сейчас» 64, сеть 73, OOS 49, цена 74, совет 78, новая цена 116. Сумма с Δ — 2060,
     без Δ — 1712: на экране владельца (~2000 px) без Δ таблица помещается целиком — ради
     этого он Δ и прячет; на ноутбуке 1512 px прокручивается вбок в обоих случаях, но без
     наездов. Страж — `tests/repricer/test_delta_columns_toggle.py`. */
  .repricer-head-wrap > colgroup > .repricer-col-sku { width: 180px; }
  .repricer-head-wrap > colgroup > .repricer-col-period { width: 60px; }
  .repricer-head-wrap > colgroup > .repricer-col-delta { width: 116px; }
  .repricer-head-wrap > colgroup > .repricer-col-now { width: 64px; }
  .repricer-head-wrap > colgroup > .repricer-col-net { width: 74px; }
  .repricer-head-wrap > colgroup > .repricer-col-oos { width: 50px; }
  .repricer-head-wrap > colgroup > .repricer-col-price { width: 74px; }
  .repricer-head-wrap > colgroup > .repricer-col-advice { width: 78px; }
  .repricer-head-wrap > colgroup > .repricer-col-new-price { width: 118px; }
  /* Поля ячеек шапки у́же (4 px вместо 8): в узкой колонке «ТЕКУЩАЯ» не влезала в своё место;
     подписи второго ряда и rowspan-ячеек («На сайте», «До скидки МП», «Запас сети») переносятся
     по словам, а не наезжают на соседнюю колонку. */
  .repricer-head-wrap > thead > tr > th { padding-left: 4px; padding-right: 4px; }
  .repricer-head-wrap > thead > tr:not(:first-child) > th,
  .repricer-head-wrap > thead > tr:first-child > th[rowspan] { white-space: normal; }
  /* Без Δ группа «П1 · П2» у́же своей подписи («Оборачиваемость, дней») — подпись переносится,
     а не наезжает на соседнюю. */
  .repricer-no-delta .repricer-head-wrap > thead > tr:first-child > th[data-delta-group] { white-space: normal; }
  /* ⭐ «?» СПРАВА ОТ ПОДПИСИ В ОДНУ СТРОКУ и во втором ряду шапки (владелец 06.10: «знаки
     вопроса ужасно расположены — все перекрывают»): столбик «?» над подписью растил ряд до
     72 px с пустой полосой между рядами. Стопка остаётся только телефону (узкий экран). */
  .repricer-head-wrap > thead .repricer-head-stack {
    flex-direction: row;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 4px;
  }
  .repricer-head-wrap > thead .repricer-head-stack > .help { order: 2; }
}
/* ⭐ Первая колонка НЕ НАЕЗЖАЕТ на П1 (та же жалоба 06.10): «Express · 53 из 60 арт. ?» шире
   своей ячейки на 34 px и ложился поверх чисел. Лишнее режется многоточием внутри ячейки;
   подсказка «?» при этом живёт в portal (`help-tooltips.js`) и обрезке не подлежит.
   `why-row` не трогаем: у неё одна широкая ячейка с переносом строк. */
.repricer-head-wrap > tbody > tr:not(.why-row) > td:first-child,
.repricer-head-wrap > tbody.repricer-total-body > tr.repricer-total > td:first-child {
  overflow: hidden;
  text-overflow: ellipsis;
}
/* ⭐ Колонки Δ скрываются тумблером (владелец 06.10, #1364): ячейки гаснут классом на обёртке,
   а <col> снимает `repricer-delta-columns.js` — в fixed-сетке колонка без ячеек всё равно
   держала бы место. Тумблер стоит у правого края полосы периодов. */
.repricer-table-scroll.repricer-no-delta .repricer-delta { display: none; }
.repricer-delta-toggle { margin-left: auto; order: 99; }

/* ⭐⭐ ОКНО КАРТОЧКИ КОНТРАГЕНТА НЕ ВЫШЕ ЭКРАНА (правка 08.09 по замечанию владельца:
   форма растянулась в бесконечную колонку, до «Сохранить» было не долистать).
   ⛔ У `<dialog>` нет своей прокрутки: он растёт по содержимому и просто уезжает за
   нижний край. Полей у контрагента много (роли, площадка, реквизиты, банк, счета), и
   после добавления кода и имени площадки форма перестала помещаться.
   ⭐ Устройство как у окон системы: шапка и кнопки закреплены, прокручивается только
   середина — человек всегда видит, что он правит и чем это сохранить. */
.cp-dialog {
  max-height: min(88vh, 900px);
  overflow: hidden;
}
/* ⛔⛔ `display:flex` — ТОЛЬКО У ОТКРЫТОГО (#2029). Авторское `.cp-dialog { display:flex }`
   перебивало браузерное `dialog:not([open]) { display:none }`: все закрытые карточки
   контрагентов стояли друг на друге под таблицей, и сверху висела последняя
   («Контрагент: ООО «Яндекс Маркет»»). Страж — `tests/refs/test_cp_dialog_closed_hidden.py`. */
.cp-dialog[open] {
  display: flex;
  flex-direction: column;
}
.cp-dialog__form {
  display: flex;
  flex-direction: column;
  min-height: 0;          /* иначе flex не даёт середине сжаться и прокрутка не включается */
  max-height: inherit;
}
.cp-dialog__head {
  flex: 0 0 auto;
  padding: 1.25rem 1.25rem .75rem;
  border-bottom: 1px solid var(--ui-border, #e3e7ef);
}
.cp-dialog__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 1rem 1.25rem;
  overscroll-behavior: contain;   /* прокрутка окна не листает страницу под ним */
}
.cp-dialog__foot {
  flex: 0 0 auto;
  padding: .75rem 1.25rem 1.25rem;
  border-top: 1px solid var(--ui-border, #e3e7ef);
  background: #fff;
}

/* ⭐ ЕДИНЫЙ КОНТРАКТ ГЕОМЕТРИИ ТИПОВЫХ ПЛАШЕК ТАБЛИЦ ПОСТАВОК.
   Цвета остаются у предметных компонентов; размеры desktop/mobile меняются только
   здесь. Так FBM/FBS/FF, лента новых заказов и карточки документов не расходятся. */
.wms-table-pill {
  display: inline-flex;
  box-sizing: border-box;
  align-items: center;
  white-space: nowrap;
}
@media (min-width: 768px) {
  #fbs-supply-list .wms-supply-external-id-value {
    font-size: 11px;
  }
  :is(#fbs-supply-list, table.fbs-orders-table) .fbs-mp-badge {
    width: 28.8px;
    height: 16.8px;
    padding-inline: 0;
    border-radius: 5px;
    font-size: 10px;
  }
  :is(#ship-list, #fbs-supply-list, #wms-inventory-list, table.fbs-orders-table) .doc-status-badge,
  :is(#ship-list, #fbs-supply-list) .wms-table-pill,
  table.fbs-orders-table :is(.fbs-dl-soon, .fbs-dl-late),
  #fbs-supply-list :is(
    .fbs-after-print-notice,
    .fbs-supply-composition-alert,
    .fbs-supply-cancelled-during-pick,
    .fbs-supply-undelivered,
    .fbs-supply-scanning,
    .fbs-supply-stock-alert,
    .fbs-trbx-warning-desktop
  ) {
    box-sizing: border-box;
    height: 18px;
    min-height: 18px;
    align-items: center;
    padding: 0 8px;
    border-radius: 9999px;
    font-size: 10px;
    line-height: 1;
  }
  :is(#ship-list, #fbs-supply-list) .fbs-qty-pill {
    height: 18px;
    min-height: 18px;
    padding: 2px 5px;
    border-radius: 5px;
  }
}

@media (max-width: 640px) {
  /* Финальная типографика поставок: общие плашки и дата совпадают у FBM/FBS/FF;
     специфичные метаданные и грузоместа FBS остаются в той же группе каскада. */
  #fbs-supply-list .wms-mobile-document-created {
    font-size: 10px;
    line-height: 14px;
  }
  #fbs-supply-list .fbs-mobile-document-cabinet {
    color: #94a3b8 !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 14px !important;
  }
  #fbs-supply-list .fbs-trbx-control {
    font-size: 10px;
    font-weight: 400;
    line-height: 20px;
  }
  #fbs-supply-list .fbs-trbx-control b {
    font-size: 11px;
    font-weight: 700;
  }
  #fbs-supply-list .fbs-mobile-summary-label {
    color: #1e293b !important;
    font-size: 10px !important;
    line-height: 14px !important;
  }
  :is(
    #ship-list .wms-mobile-handover-weekday,
    #fbs-supply-list td.fbs-supply-date .wms-document-date-weekday
  ) {
    color: #1e293b;
    font-size: 10px;
    line-height: 14px;
    text-transform: uppercase;
  }
  :is(#fbs-supply-list, table.fbs-orders-table) .fbs-mp-badge {
    width: 28.8px;
    height: 16.8px;
    padding-inline: 0;
    border-radius: 5px;
    font-size: 10px;
  }
  :is(#ship-list, #fbs-supply-list, #wms-inventory-list, table.fbs-orders-table) .doc-status-badge,
  :is(#ship-list, #fbs-supply-list) .wms-table-pill,
  table.fbs-orders-table :is(.fbs-dl-soon, .fbs-dl-late),
  #fbs-supply-list :is(
    .fbs-after-print-notice,
    .fbs-supply-composition-alert,
    .fbs-supply-cancelled-during-pick,
    .fbs-supply-undelivered,
    .fbs-supply-scanning,
    .fbs-supply-stock-alert
  ) {
    box-sizing: border-box;
    height: 16px !important;
    min-height: 16px !important;
    align-items: center;
    padding: 0 6px !important;
    border-radius: 9999px !important;
    font-size: 10px !important;
    line-height: 1 !important;
  }
  :is(
    #ship-list .wms-mobile-handover,
    #fbs-supply-list td.fbs-supply-date
  ) .ship-date {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    height: 16.8px !important;
    min-height: 16.8px !important;
    min-width: 0;
    padding: 0 3.5px !important;
    border-radius: 5px;
    font-size: 10px;
    font-weight: 600;
    line-height: 14px !important;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
  }
  :is(#ship-list, #fbs-supply-list) .fbs-qty-pill,
  #fbs-supply-list .fbs-pack-qty-mobile {
    height: auto;
    min-height: 0;
    padding: 2px 5px !important;
    border-radius: 5px !important;
  }
}

/* ── Окно подтверждения отправки цен: план по каждому артикулу (владелец 18.09:
   «выходит попап… какие цены для каких полей будут отправлены… если цена ниже
   БУ 10%, то она красная»). Своими классами — сборка Tailwind статическая.
   `.app-confirm-wide` ставит общий appConfirm по опции `wide`. */
.app-confirm-wide { max-width: 72rem; }
.push-plan {
  margin-top: 0.75rem;
  max-height: 55vh;
  overflow: auto;
  white-space: normal;
  border: 1px solid #e2e8f0;
  border-radius: 0.5rem;
}
.push-plan table { width: 100%; border-collapse: collapse; font-size: 12px; color: #334155; background: #fff; }
.push-plan th, .push-plan td {
  padding: 3px 8px;
  text-align: right;
  white-space: nowrap;
  border-bottom: 1px solid #f1f5f9;
}
.push-plan th {
  position: sticky;
  top: 0;
  background: #f8fafc;
  color: #64748b;
  font-weight: 500;
}
.push-plan .pp-left { text-align: left; }
.push-plan .pp-muted { color: #94a3b8; }
.push-plan .pp-change { color: #1d4ed8; font-weight: 600; }
.push-plan .pp-below { color: #be123c; background: #fff1f2; font-weight: 600; }
/* Не встаёт под цену до скидки (владелец 21.09): строка не уйдёт, галка — согласие
   поднять коэффициент товара. Подпись не переносится: «поднять коэф. 2.50 → 2.85». */
.push-plan tr.pp-blocked td { background: #fff7f7; }
.push-plan .pp-raise { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.push-plan .pp-raise input { margin: 0; }

/* ⭐⭐ ЛИСТ СТРАНИЦЫ ПРЯЧЕТ СТРОКУ СВОИМ КЛАССОМ, А НЕ `hidden` (`group-pager.js`).
   `hidden` принадлежит аккордеону («раскрыта группа или нет»), и если бы листалка
   трогала его, раскрытие и листание стирали бы решения друг друга: перелистнул — и
   раскрытые группы схлопнулись, свернул группу — и чужие строки всплыли с другого листа.
   Строка артикула видна, когда группа раскрыта И её лист текущий. */
.pg-off { display: none !important; }
/* ⭐ ТРЕТИЙ СЛОЙ ВИДИМОСТИ СТРОКИ — ФИЛЬТР (`row-filter.js`, владелец 23.09:
   «ввожу артикул — и у меня перезагрузка страницы»). Слоёв ровно три и у
   каждого свой знак: `hidden` — раскрытие группы (аккордеон), `pg-off` — лист
   листалки, `flt-off` — не подошёл под фильтр. Общий знак стирал бы решения
   соседних слоёв (тот же разбор — в шапке `group-pager.js`). */
.flt-off { display: none !important; }
/* ⭐ ТОТ ЖЕ ПРИНЦИП У РАСЧЁТА ЗАКУПКИ (29.09, группы организаций как в репрайсере):
   тумблеры «Скрыть без потребности / не отмеченные» — свой знак `calc-off`, иначе они
   разворачивали бы свёрнутые организации (`purchases-calculator.js`, `видимость_строк`). */
.calc-off { display: none !important; }
/* Раскрытый по-дневной расчёт едет за своей строкой: строка спрятана (организация
   свёрнута, тумблер, поиск) — спрятан и он. */
#calc-table > tbody > tr:is(.hidden, .calc-off, .flt-off) + tr.trace-row { display: none; }

/* ⛔ КЛАСС РАСКЛАДКИ СИЛЬНЕЕ БРАУЗЕРНОГО `[hidden]` — поймано живой проверкой 20.09:
   листалка с `class="flex"` оставалась на экране с единственной кнопкой «1», хотя
   скрипт уже поставил ей `hidden` (страница-то одна). Тот же капкан, что у мобильного
   меню выше: `display` из класса перебивает правило браузера. */
[data-client-pager][hidden] { display: none !important; }

/* ── Экран направлений подсорта («Поставка», вариант Б, владелец 25–26.09.2026) ──
   ⚠️ Tailwind собран СТАТИЧЕСКИ (`static/app.css`), и произвольных значений вроде
   `w-[11rem]` в сборке нет — правило с таким классом молча не работает (капкан фронта из
   CLAUDE.md; на нём уже молча не работал `max-h-[28rem]` у этого дерева). Поэтому ширины
   колонок дерева живут ЗДЕСЬ, своими классами.
   ⭐ Шапка и строка берут ОДИН И ТОТ ЖЕ класс на колонку: разъехаться им нечем. */
/* ⚠️ ПОЛОСА ПРОКРУТКИ НЕ ИМЕЕТ ПРАВА ЛЕЧЬ НА КОЛОНКУ ★ (владелец 26.09: «прокрутка
   закрывает рабочую область»). На macOS полоса рисуется ПОВЕРХ содержимого и своего места
   не занимает — `scrollbar-gutter` её не отодвигает, поэтому место под неё оставляем
   отступом справа: полоса ложится на пустое поле, а не на звёзды. */
.dir-tree      { max-height: 32rem; overflow-y: auto; padding-right: 0.875rem; }
.dir-col-num   { width: 5rem;   flex: 0 0 5rem; }
.dir-col-lead  { width: 3.5rem; flex: 0 0 3.5rem; }
.dir-col-fact  { width: 3.5rem; flex: 0 0 3.5rem; }
.dir-col-with  { width: 11rem;  flex: 0 0 11rem; }
/* Шире знака: в шапке колонка названа словами «Возим сюда» — одна ★ не объясняла себя. */
.dir-col-star  { width: 5.5rem; flex: 0 0 5.5rem; }
/* ⚠️ ИМЯ КЛАСТЕРА УСТУПАТЬ НЕ ИМЕЕТ ПРАВА. Плашка склейки («+ Южный — одной поставкой»)
   не переносится, и на узком экране она съедала всю строку целиком: имя усыхало до нуля,
   и человек видел плашку без кластера, к которому она относится (поймано рендером на 800 px).
   Теперь первой ужимается плашка, а имени гарантирован минимум. */
.dir-name      { min-width: 6rem; }
.dir-chip      { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
/* ⚠️ На узком экране остаются ЧИСЛА и ★ — то, ради чего экран открывают с телефона
   («сколько надо и повезём ли»). Настройка (срок, «везём вместе с») уходит: править её
   на 375 px всё равно нечем, а строка иначе не помещается и режет имя кластера. */
@media (max-width: 640px) {
  .dir-col-lead, .dir-col-fact, .dir-col-with { display: none !important; }
  .dir-col-num { width: 3.5rem; flex: 0 0 3.5rem; }
  .dir-col-star { width: 2rem; flex: 0 0 2rem; }
  /* ⛔ ИМЯ НЕ ВЫЛЕЗАЕТ НА КОЛОНКУ ЧИСЕЛ. На 375 px колонке имени остаётся ~60 px, а минимум
     6rem клал имя на «Потребн.», и плашка склейки ложилась прямо на цифры (поймано рендером
     29.10: все 36 строк «Моих направлений»). Плашки (склейка, покупатели, плановая дата)
     уходят — как ушли срок и «везём вместе с», — и имя ужимается многоточием в СВОЕЙ
     колонке: соперников у него на телефоне больше нет. */
  .dir-name { min-width: 0; }
  .dir-chip { display: none !important; }
}
/* ⭐ «ВОЗИМ СЮДА» — ЗВЕЗДА, А НЕ ГАЛКА (владелец 26.09: «не понятно, что галочка — это
   отметка „Возим сюда“, лучше звёздочка»). ⛔ ОТМЕНЯЕТ прежнее «своего цвета у ★ нет»:
   галка системного акцента читалась как «выбрать склад для расчёта» — ровно так же, как
   соседние флажки выбора. Цвет — тот же янтарный, что у вкладки «★ Мои направления»:
   одна отметка — один цвет на экране.
   ⚠️ Кликается САМ флажок, прозрачный и растянутый на всю звезду: так сохраняются его
   `change` (автосохранение), фокус с клавиатуры и то, что клик в строке не сворачивает
   её. Знак — соседний узел без событий. */
.dir-star        { position: relative; display: inline-flex; align-items: center;
                   justify-content: center; width: 1.5rem; height: 1.5rem; }
.dir-star-input  { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0;
                   opacity: 0; cursor: pointer; }
.dir-star-input:disabled { cursor: not-allowed; }
.dir-star-glyph  { pointer-events: none; font-size: 1.125rem; line-height: 1; color: #cbd5e1; }
.dir-star-input:checked + .dir-star-glyph { color: #f59e0b; }
.dir-star-input:not(:disabled):hover + .dir-star-glyph { color: #fbbf24; }
.dir-star-input:disabled + .dir-star-glyph { opacity: 0.45; }
.dir-star-input:focus-visible + .dir-star-glyph { outline: 2px solid #6366f1; outline-offset: 2px;
                                                   border-radius: 2px; }

/* Кнопка расчёта под замком (нет плана срока у направления). ⚠️ Свой класс, а не
   `bg-slate-300`: Tailwind собран СТАТИЧЕСКИ, и этого оттенка в сборке нет — правило
   молча не сработало бы, а кнопка осталась бы зелёной при живом `disabled`. */
.btn-blocked { background: #94a3b8; cursor: not-allowed; }

/* ⭐ Вид «Расхождения» (29.09): строка плашки — короткими классами. У хранителя плашка
   показывает ВСЕ строки поставки (ввод его счёта, кусок 2), и цепочки Tailwind на каждой из
   десятков строк стоили +24 КБ ответа и ~+10% к p95 раскрытия (замер 29.09). Значения —
   те же, что у прежних классов: py-1 · border-slate-100 · gap-2 · w-12/w-16 · slate-300. */
.dv-row { padding: .25rem 0; border-top: 1px solid #f1f5f9; }
.dv-top { display: flex; align-items: baseline; gap: .5rem; }
.dv-name { min-width: 0; flex: 1 1 0%; }
.dv-n { width: 3rem; flex-shrink: 0; text-align: right; }
.dv-a { width: 4rem; flex-shrink: 0; text-align: right; }
.dv-in { width: 4rem; padding: .125rem .25rem; border: 1px solid #cbd5e1; border-radius: .25rem; text-align: right; }

/* ── «Разбор складов» (`templates/data/wh_review.html`, `_wh_table.html`) ─────────────────
 * ⭐ Владелец 01.10: «видимые границы у сворачиваний каналов, внутри каналов понятное
 * разделение по кластерам и складам; плашки не должны увеличивать высоту страницы».
 * Шапка канала — общая фирменная плашка `mp-pane` (как у репрайсера и поставок); здесь
 * только то, чего у неё нет: рамка всего блока канала, заголовок кластера, отступ складов,
 * плашка сомнения в одну строку и ширины колонок.
 * ⚠️ У блока канала НЕТ `overflow: hidden`: липкая шапка (`mp-pane-sticky`) внутри такого
 * предка прилипала бы к нему, а не к экрану, — то есть не липла бы вовсе. */
.wh-channels { display: flex; flex-direction: column; gap: 1rem; }
.wh-channel { border: 1px solid #cbd5e1; border-radius: .875rem; background: #fff;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .06); }
.wh-channel:not([open]) { box-shadow: none; }
.wh-channel > summary { border-radius: .8rem; }
.wh-channel[open] > summary { border-bottom-left-radius: 0; border-bottom-right-radius: 0;
  border-bottom: 1px solid #e2e8f0; }
.wh-channel-body { padding: 0 0 .25rem; }

/* Колонки: служебные — узкие, всё остальное достаётся «Что приклеил человек». */
/* ⚠️ Замер 01.10 (локалка, рендер в браузере): на экране 1680 px «Что приклеил человек»
   получает ≈ 670 px и плашка сомнения стоит в ОДНУ строку (18 px); на ноутбуке 1366 px —
   ≈ 360 px и две строки (37 px). До правки — до восьми этажей на плашку. */
.wh-dest-table .wh-col-n      { width: 2.75rem; }
.wh-dest-table .wh-col-id     { width: 5.5rem; }
.wh-dest-table .wh-col-name   { width: 13rem; }
.wh-dest-table .wh-col-kind   { width: 4.75rem; }
.wh-dest-table .wh-col-scheme { width: 4.75rem; }
.wh-dest-table .wh-col-act    { width: 7.5rem; }
.wh-dest-table .wh-col-auto   { width: 14rem; }

/* «На разбор» — секциями по площадкам (владелец 01.10): таблиц несколько, ширины общие,
   иначе колонки секций разъехались бы. Код — под 16-значный номер Ozon в моноширинном;
   «Приклеить» — под список точек (min-w-64) и кнопку; остальное — названию. «Спрос» ширины
   не задаёт: числовую колонку ужимает по содержимому общее правило таблиц (`width: 1%`). */
.wh-unres-table .wh-col-code   { width: 10rem; }
.wh-unres-table .wh-col-glue   { width: 25rem; }

/* Заголовок кластера: черта сверху и заливка — граница группы видна с первого взгляда. */
.wh-dest-table tr.wh-cluster-row > td { padding: .5rem .75rem .4rem; background: #f1f5f9;
  border-top: 2px solid #94a3b8; }
.wh-dest-table tbody tr.wh-cluster-row:first-child > td { border-top: 0; }
.wh-cluster-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em;
  color: #64748b; margin-right: .35rem; }
.wh-cluster-name  { font-weight: 600; color: #1e293b; }
.wh-cluster-count { font-size: .75rem; color: #64748b; margin-left: .25rem; }
/* Склад внутри кластера — с отступом и тонкой линией слева: «это часть группы выше». */
.wh-in-cluster { padding-left: .75rem; border-left: 2px solid #cbd5e1; }
.wh-dest-table tr.wh-fbs-row > td { background: #f8fafc; }

/* Привязанное имя — в строку, плашки идут подряд. Части плашки не рвутся посередине;
   если плашка шире колонки (узкий экран), она переносится по частям, а не вылезает. */
.wh-link { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .1rem .3rem;
  margin: 0 .6rem .25rem 0; vertical-align: middle; }
.wh-link > * { white-space: nowrap; }
.wh-link-doubt { background: #fffbeb; box-shadow: inset 0 0 0 1px #fcd34d; border-radius: .3rem;
  padding: 0 .35rem; }
/* Значок сомнения — носитель общей подсказки `.help` (`help-inline`), как «склад выбыл». */
.help.help-inline.wh-doubt { padding: 0 4px; border-radius: 4px; background: #fef3c7;
  color: #92400e; font-size: 11px; text-decoration: none; }
.help.help-inline.wh-doubt:hover,
.help.help-inline.wh-doubt:focus,
.help.help-inline.wh-doubt.open { background: #fde68a; color: #78350f; }

/* ⭐ «Оборачиваемость» (подсорт/отчёты): таблица мест и раскрытие по артикулам — ОДНА сетка
   (владелец 06.10: «при раскрытии колонки смещаются… чтобы были друг под другом»). Обе
   таблицы fixed с одним `colgroup` (`templates/data/_turnover_cols.html`); проценты в сумме 100:
   место 22 + канал 8 + семь чисел по 10. Страж — `tests/test_turnover_view.py`. */
.turnover-grid { table-layout: fixed; }
.turnover-grid > colgroup > .tv-c-place { width: 22%; }
.turnover-grid > colgroup > .tv-c-mp { width: 8%; }
.turnover-grid > colgroup > .tv-c-num { width: 10%; }

/* «Довнести» по акту доприёмки (вид «Расхождения», кусок 4): поля количества и номера акта
   стоят сразу за выпадашкой решения и видны, только когда выбрано это решение.
   ⚠️ Два селектора: `searchable-select.js` оборачивает выпадашку в `.ss-wrap` и прячет её
   саму — в браузере сосед полей уже обёртка, а не <select> (поймано живым рендером 11.10:
   правило по одному `select + …` не срабатывало никогда). Первый — на случай без скрипта. */
[data-diff-topup] { display: none; }
select[data-diff-choice]:has(option[value="topup"]:checked) + [data-diff-topup],
.ss-wrap:has(> select[data-diff-choice] option[value="topup"]:checked) + [data-diff-topup] { display: flex; }

/* ⭐ «Сотрудники и права»: галка «заведующий» гаснет, пока склад не отмечен (мигр.882,
   владелец 14.10) — заведовать можно только своим складом, сервер такую отметку отбрасывает.
   Без скрипта: соседство в одной обёртке `.wh-pair`. */
.wh-pair:has(input[name="warehouse"]:not(:checked)) .wh-head { opacity: .4; pointer-events: none; }

/* Номер возврата площадки в строке документа возврата (15.10). Номер не того канала либо
   неизвестный витрине — подсвечен, рядом форма исправления (`returns.return_pickup_fix`). */
.ret-mpcode-item { display: inline-block; vertical-align: top; margin-right: 16px; }
.ret-mpcode-row td { border-top: 0; }
/* Поле верного номера: на телефоне — во всю ширину карточки, на ПК — не шире 224px. */
.ret-mpcode-input { width: 100%; max-width: 224px; min-width: 0; }
.ret-mpcode-item--bad {
  border-left: 2px solid #f43f5e;
  padding-left: 6px;
}

/* ⭐ Полоска заполненности клетки «линия × ярус» на карточке склада (#1466, владелец
   19.10). `<progress>`, а не div с шириной: CSP (`style-src 'self'`) инлайн-стиль
   выбрасывает. Цвет — класс от ядра (`location_types.сетка`): зелёный, жёлтый — занято
   выше порога, красный — занято больше, чем вмещает. */
.loc-fill-bar {
  display: block;
  width: 100%;
  min-width: 3rem;
  height: .3rem;
  margin-top: .2rem;
  padding: 0;
  overflow: hidden;
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: #e2e8f0;
}
.loc-fill-bar::-webkit-progress-bar { border-radius: inherit; background: #e2e8f0; }
.loc-fill-bar::-webkit-progress-value { border-radius: inherit; background: #10b981; }
.loc-fill-bar::-moz-progress-bar { border-radius: inherit; background: #10b981; }
.loc-fill-bar.is-warn::-webkit-progress-value { background: #f59e0b; }
.loc-fill-bar.is-warn::-moz-progress-bar { background: #f59e0b; }
.loc-fill-bar.is-over::-webkit-progress-value { background: #ef4444; }
.loc-fill-bar.is-over::-moz-progress-bar { background: #ef4444; }

/* ── «Недостачи и излишки» на телефоне (#2108) ──
   Последняя ячейка обеих таблиц — данные («Сальдо», «Срок «ищем»»), а не строка иконок:
   общее правило `td:last-child` прятало бы их подпись (тот же приём, что у `#ym-colors`). */
@media (max-width: 640px) {
  [data-count-book-month] table.responsive td:last-child,
  [data-count-book-rows] table.responsive td:last-child {
    display: block !important;
  }
  [data-count-book-month] table.responsive td:last-child::before,
  [data-count-book-rows] table.responsive td:last-child::before { display: block !important; }
}

/* ── Перетаскивание строк списка (`static/drag-order.js`) ─────────────────────────────
   Ручка: курсор «взять» и `touch-action: none` — без него палец прокручивает страницу
   вместо перетаскивания. Переносимая строка подсвечена, пока её держат. */
[data-drag-handle] { cursor: grab; touch-action: none; user-select: none; }
[data-drag-handle]:active { cursor: grabbing; }
[data-drag-item].drag-moving { background: #eef2ff; opacity: .85; }