@import url("/assets/fonts/yacond.css");   /* узкий шрифт списков товара — один файл на всё */
/* =========================================================================
   MP-платформа · оформление "Алгоритм 5 Граней"
   Палитра из каталога Dulux (по выбору Сергея):
     тёмное меню   42BB 09/032 Darkened Storm  #494d52
     фон рабочей   45GY 55/052 Tranquil Dawn   #bfc6bc
     верхняя панель 30GY 88/014 White on White  #f0f2ef
     кнопки        50YY 51/519 Sapling (золото) #dab955
     акцент        34YR 23/538 (жжёный апельсин)#d35235
   ========================================================================= */

:root{
  --bg:#bfc6bc; --panel:#ffffff; --panel2:#eef1ea;
  --line:#c0c8bb; --line-soft:#e3e7dd;
  --ink:#26302a; --muted:#5d6a60; --soft:#7f8b7e;
  --topbar:#f0f2ef;

  --rail:#494d52; --rail2:#3d4146; --rail-ink:#d7dbdf; --rail-mut:#98a0a7; --rail-active:#5a5f66;

  --gold:#dab955; --gold-d:#c3a23f; --gold-ink:#3a2e12; --gold-soft:#f6ecd0;
  --accent:#d35235; --accent-d:#b8421f; --accent-soft:#fae4dc;

  --ok:#4f9e63; --ok-soft:#e6f3ea;
  --warn:#c98a1e; --warn-soft:#f7edd8;
  --del:#c0392b; --del-soft:#f7e2df;

  --radius:11px; --radius-s:8px;
  --shadow:0 1px 2px rgba(38,48,42,.06), 0 8px 22px rgba(38,48,42,.10);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;

  /* =======================================================================
     КРУПНОСТЬ (18.08.2026, ветка 34, слово Сергея: «я в очках +2, ноут стоит
     на столе, а мы ходим по складу и смотрим с расстояния»).

     ДВА СЛОЯ, И ОБА НУЖНЫ.
     1) ПОЛ. Вся шкала шрифтов в общих стилях поднята: мельче 12px на сайте
        больше нет вообще. Раньше подписи жили на 9–11px — это читается за
        полметра и не читается за два.
     2) РЫЧАГ. --ui-zoom масштабирует страницу целиком: буквы, кнопки, фото,
        отступы — всё пропорционально, вёрстка не рассыпается. Ступени
        100/115/130/150 % переключаются в шапке, выбор хранится В БРАУЗЕРЕ
        УСТРОЙСТВА: складскому ноуту нужно 150, рабочему монитору 115, и это
        разные машины, а не разные люди. Поэтому localStorage, а не настройка
        кабинета — иначе один экран потянет одеяло на другой.

     Печать рычага не касается: бумага своего масштаба не имеет.
     ======================================================================= */
  --ui-zoom:1;
}
html{zoom:var(--ui-zoom)}
@media print{html{zoom:1}}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:var(--font);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased}
a{color:var(--accent-d);text-decoration:none}
a:hover{text-decoration:underline}
.ico{width:1.25em;height:1.25em;flex:0 0 auto}

/* ===================== Каркас ===================== */
/* ЛЕВОЙ РЕЛЬСЫ БОЛЬШЕ НЕТ (14.08.2026, ветка 32, срез Админки): вся
   навигация — единая шапка + строка разделов из реестра lib/doors.php.
   Стили .rail-* снесены вместе с разметкой; цвета --rail в :root живут —
   их носят темы оформления и рамки подсказок. */
.app{display:block;min-height:100vh}
.main{min-width:0;display:flex;flex-direction:column;min-height:100vh}

/* ===================== Верхняя панель =====================
   ВАЖНО (Core 0.4). Раньше все кнопки панели разъезжались по ширине.
   Причина: общее правило button{width:100%} (оно нужно формам входа и
   добавления) распространялось и на кнопки панели. Теперь у панели свои
   жёсткие размеры: одна высота, ширина по содержимому, без внешних отступов.
   ========================================================================= */
.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 22px;background:var(--topbar);border-bottom:1px solid var(--line);
  position:sticky;top:0;z-index:20;flex-wrap:wrap}
.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.greet{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.greet-hi{font-size:15.5px;color:var(--muted);white-space:nowrap}
.greet-hi b{color:var(--ink)}

/* Кнопка панели — ОДИН И ТОТ ЖЕ РАЗМЕР У ВСЕХ.
   Не «по содержимому»: ширина задана жёстко (--tbtn-w), высота 38 px.
   Слева и справа кнопки выглядят одинаково. Длинная подпись не растягивает
   кнопку, а аккуратно обрезается многоточием (полный текст — в подсказке). */
:root{ --tbtn-w:132px; }
.tbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  height:38px;padding:0 10px;width:var(--tbtn-w);flex:0 0 var(--tbtn-w);margin:0;
  border:1px solid var(--line);border-radius:var(--radius-s);background:#fff;
  color:var(--ink);font-size:15.5px;font-weight:600;cursor:pointer;font-family:var(--font);
  line-height:1;white-space:nowrap;overflow:hidden;transition:background .12s,border-color .12s,color .12s}
.topbar button.tbtn{width:var(--tbtn-w);margin:0}   /* перебиваем общее правило форм */
.tbtn > span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.tbtn:hover{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-d);text-decoration:none}
.tbtn .ico{width:18px;height:18px;color:var(--accent)}
.tbtn-out .ico,.tbtn-out:hover .ico{color:var(--del)}
.tbtn-out:hover{background:var(--del-soft);border-color:var(--del);color:var(--del)}

/* Звук: кнопка вкл/выкл + стрелка, открывающая окошко громкости.
   Ползунок больше не лежит прямо в панели и ничего не растягивает. */
.snd{position:relative;display:inline-flex;align-items:center;gap:4px;flex:0 0 auto}
.snd-btn.off{color:var(--soft)}
.snd-btn .ico{color:var(--gold-d)}
.snd-btn.off .snd-on{display:none}
.snd-btn:not(.off) .snd-off{display:none}
/* Стрелка громкости — квадрат той же высоты, прижат к кнопке «Звук». */
.snd-more{width:38px;flex:0 0 38px;padding:0}
.topbar button.snd-more{width:38px}
.snd-more .ico{color:var(--soft);width:16px;height:16px}
.snd-pop{position:absolute;right:0;top:44px;z-index:40;width:190px;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius-s);
  padding:12px 14px;box-shadow:var(--shadow)}
.snd-pop label{margin:0 0 8px;display:flex;justify-content:space-between;gap:8px}
.snd-vol{width:100%;max-width:100%;accent-color:var(--gold-d);cursor:pointer;margin:0}

/* Дата: коротко и крупно. Под ней — крохотные часы, и больше в панели ничего.
   Часы нужны не для красоты: по ним на скриншоте видно, когда сделан снимок и
   сколько прошло между двумя запросами к маркетплейсу. Ширина часов заведомо
   меньше ширины даты — колонка не разъезжается. */
.today-box{display:inline-flex;flex-direction:column;align-items:center;
  line-height:1;margin-right:6px}
.today{font-size:21px;font-weight:800;letter-spacing:.5px;color:var(--ink);
  white-space:nowrap;font-variant-numeric:tabular-nums;margin-right:0}
.clock{margin-top:2px;font-size:12px;font-weight:600;letter-spacing:.2px;
  color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums}

.badge{display:inline-block;padding:3px 11px;border-radius:20px;font-size:13.5px;
  background:var(--gold-soft);border:1px solid #e6cf92;color:#7a5e12;font-weight:600}

/* ===================== Содержимое ===================== */
.content{padding:26px 30px;width:100%;
  max-width:var(--content-max, 1180px);   /* обычная ширина для чтения; таблицы могут раздвинуть её сами */
  margin:0 auto;transition:max-width .05s linear}
/* Тянучка ширины рабочей области. Живёт справа сверху, не даёт вылезти за монитор. */
.width-grip{position:sticky;top:0;z-index:20;display:flex;justify-content:flex-end;
  align-items:center;gap:8px;height:0;pointer-events:none}
.width-grip .wg-btn{pointer-events:auto;margin-top:6px;font-size:13px;font-weight:700;
  color:var(--muted);background:var(--panel);border:1px solid var(--line);border-radius:20px;
  padding:3px 10px;cursor:pointer;user-select:none;white-space:nowrap}
.width-grip .wg-btn:hover{color:var(--ink);border-color:var(--accent)}
/* Телефон (Р152): ширина там одна — экран; кнопка налезала на заголовок и кнопки страниц («ВБ 6» на «Поставках ФБО»). */
@media (max-width:720px){ .width-grip{display:none} }
.page-title{font-size:23px;font-weight:700;margin:2px 0 18px;display:flex;align-items:center;gap:8px;color:var(--ink)}

/* Верхнее подменю модуля (вкладки внутри раздела) */
.submenu{display:flex;gap:4px;flex-wrap:wrap;padding:0 30px;background:var(--panel);border-bottom:1px solid var(--line)}
.subtab{padding:13px 16px;font-size:15.5px;font-weight:600;color:var(--muted);border-bottom:3px solid transparent;text-decoration:none;white-space:nowrap}
.subtab:hover{color:var(--ink);text-decoration:none}
.subtab.active{color:var(--accent-d);border-bottom-color:var(--accent)}
@media (max-width:640px){ .submenu{padding:0 14px;overflow-x:auto;flex-wrap:nowrap} }

/* Легенда — «фишка» самообъясняющего кабинета */
.legend{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--line-soft);border-left:4px solid var(--accent);
  border-radius:var(--radius);padding:12px 16px;margin:0 0 20px;box-shadow:var(--shadow)}
.legend-cap{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:var(--accent-d)}
.leg{display:inline-flex;align-items:center;gap:7px;font-size:14.5px;color:var(--muted)}
.leg b{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;
  border-radius:6px;background:var(--panel2);border:1px solid var(--line-soft);color:var(--ink);font-weight:700}

/* Карточки-счётчики */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;margin:6px 0 26px}
.card{background:var(--panel);border:1px solid var(--line-soft);border-radius:var(--radius);padding:16px 18px;box-shadow:var(--shadow)}
.card .num{font-size:31px;font-weight:700;line-height:1;color:var(--ink)}
.card .lbl{color:var(--muted);font-size:14.5px;margin-top:6px}
.card.alert{border-color:#e6cf92;background:linear-gradient(180deg,#fff,var(--warn-soft))}
.card.alert .num{color:var(--warn)}

/* Панель / секция */
.section{background:var(--panel);border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:18px 20px;margin-bottom:22px;box-shadow:var(--shadow)}
.section h2{margin:0 0 14px;font-size:16px;font-weight:700;color:var(--ink)}
.section h2 .sub{color:var(--muted);font-weight:400;font-size:14.5px;margin-left:8px}

/* ПЛИТКИ ДВЕРЕЙ образца ВБ (14.08.2026, ветка 32, слово Сергея 13.08:
   «как у ВБ — минимум три плитки в ряд, ряды по центру, лишние переносятся
   вниз»). Рисует doors_tiles() из lib/doors.php по единому реестру.
   Резина: плитка тянется от 210 до 340 px — на обычной ширине содержимого
   выходит 3–4 в ряд, неполный ряд стоит по центру. */
.doors-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 0 6px}
.door-tile{flex:1 1 230px;min-width:210px;max-width:340px;display:flex;flex-direction:column;gap:5px;
  background:var(--panel2);border:1px solid var(--line-soft);border-radius:var(--radius);
  padding:12px 14px;color:var(--ink);text-decoration:none;
  transition:border-color .12s,background .12s,box-shadow .12s}
.door-tile:hover{background:#fff;border-color:var(--accent);box-shadow:var(--shadow);text-decoration:none}
.door-tile b{font-size:15.5px;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.door-tile span{font-size:14px;line-height:1.45;color:var(--muted);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.door-tile .pill{font-weight:400}
@media (max-width:640px){ .door-tile{flex-basis:100%;max-width:none} }

/* Статусная строка */
.status{display:flex;align-items:center;gap:10px;font-size:15.5px}
.dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.dot.ok{background:var(--ok)} .dot.err{background:var(--del)}

/* Таблицы */
table{width:100%;border-collapse:collapse;font-size:15.5px}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line-soft)}
th{color:var(--soft);font-weight:600;font-size:13.5px;text-transform:uppercase;letter-spacing:.5px}
tbody tr:hover{background:var(--panel2)}
tr:last-child td{border-bottom:none}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums}
.muted{color:var(--muted)}

/* Значки действий в строках */
.rowact{display:inline-flex;gap:6px}
.rowact a,.rowact button{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;
  border-radius:7px;border:1px solid var(--line-soft);background:var(--panel2);cursor:pointer;color:var(--muted);padding:0;font-size:15.5px}
.rowact .edit:hover{color:var(--accent-d);border-color:var(--accent);background:var(--accent-soft)}
.rowact .del:hover{color:var(--del);border-color:var(--del);background:var(--del-soft)}
.rowact .add:hover{color:var(--ok);border-color:var(--ok);background:var(--ok-soft)}

/* Формы / вход */
.center{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;
  background:radial-gradient(1200px 600px at 50% -10%, #d3d9cf, var(--bg))}
.loginbox{width:100%;max-width:370px;background:var(--panel);border:1px solid var(--line-soft);
  border-radius:16px;padding:32px 30px;box-shadow:var(--shadow)}
.loginbox h1{font-size:21px;margin:0 0 4px;color:var(--ink)}
.loginbox .hint{color:var(--muted);font-size:14.5px;margin:0 0 22px;display:block;width:auto;height:auto;border:none;background:none;border-radius:0}
label{display:block;font-size:14.5px;color:var(--muted);margin:14px 0 6px}
input[type=text],input[type=password]{width:100%;padding:11px 13px;border-radius:var(--radius-s);
  border:1px solid var(--line);background:#fff;color:var(--ink);font-size:16px}
input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
/* ПРАВИЛО И ИСКЛЮЧЕНИЕ ПОМЕНЯНЫ МЕСТАМИ (14.08.2026, ветка 32, слово
   Сергея). Раньше ГОЛАЯ button была покрашена под форму входа — золотая во
   всю ширину с отступом сверху — и каждая панель сайта перебивала это
   правило у себя (.topbar, .addbar, .filters, .rowact...). Теперь правило —
   обычная компактная кнопка по мерке комнаты сотрудника (эталон .rbtn:
   высота, скругление, ширина по содержимому), а форма входа — исключение
   ниже. Старые перебивки остались на местах и никому не мешают — по местам
   ничего не перекрашено. */
button{margin:0;width:auto;height:36px;padding:0 17px;border:none;border-radius:8px;
  background:var(--gold);color:var(--gold-ink);font-size:15.5px;font-weight:600;
  cursor:pointer;font-family:var(--font)}
button:hover{background:var(--gold-d)}

/* ОБЪЁМ И НАЖИМАЕМОСТЬ (26.08.2026, ветка 38, слово Сергея: «придай кнопкам
   3D-эффект и нажимаемость»). Тень снизу = кнопка стоит НАД поверхностью;
   при нажатии она проседает на свою же тень — палец физически чувствует
   отклик, даже когда страница ещё думает. Переход короткий (60 мс): длинная
   анимация на кнопке, которую жмут сотню раз за смену, начинает раздражать. */
button, .o33go, .mp-btn3d{
  box-shadow:0 2px 0 rgba(60,50,30,.22), 0 3px 8px rgba(60,50,30,.14);
  transition:transform .06s ease, box-shadow .06s ease, background .12s ease}
button:active, .o33go:active, .mp-btn3d:active{
  transform:translateY(2px);
  box-shadow:0 0 0 rgba(60,50,30,.22), 0 1px 3px rgba(60,50,30,.16)}
button:disabled, .mp-btn3d.off{box-shadow:none;transform:none;cursor:not-allowed}
button:focus-visible, .mp-btn3d:focus-visible{outline:2px solid var(--gold-d);outline-offset:2px}

/* ТРЕУГОЛЬНИК СВОРАЧИВАНИЯ переехал в assets/fold.css (06.09.2026, в. 44).
   Причина: комната клиента подключает не этот файл, а свой room.css — и там
   треугольник рисовался голой кнопкой и не сворачивал (скрин Сергея). Вид
   едет с элементом (№232): один файл, обе оболочки берут его. */
/* Исключение: кнопка формы входа — золотая во всю ширину, как и была. */
.loginbox button{margin-top:20px;width:100%;height:auto;padding:12px;
  font-size:16px;font-weight:700}
.err-msg{background:var(--del-soft);border:1px solid #eabfba;color:#932a20;padding:10px 12px;border-radius:var(--radius-s);font-size:14.5px;margin-top:16px}
.ok-msg{background:var(--ok-soft);border:1px solid #b9e3c6;color:#1f7a41;padding:10px 12px;border-radius:var(--radius-s);font-size:14.5px;margin-top:16px}

.footnote{color:var(--soft);font-size:13.5px;text-align:center;margin:8px 0 22px}

/* Подсказки "?" */
.hint{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;
  background:var(--panel2);border:1px solid var(--line);color:var(--soft);font-size:13px;font-weight:700;
  cursor:help;position:relative;flex:0 0 auto;vertical-align:middle}
.hint:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.hint::after{content:attr(data-tip);position:absolute;left:50%;top:150%;transform:translateX(-50%);
  background:#2b2f30;color:#eef1ec;border:1px solid #40474a;border-radius:8px;padding:9px 12px;
  font-size:14px;font-weight:400;line-height:1.45;width:250px;white-space:normal;text-align:left;z-index:60;
  opacity:0;visibility:hidden;transition:opacity .12s;box-shadow:0 10px 28px rgba(20,24,26,.35);pointer-events:none}
.hint:hover::after{opacity:1;visibility:visible}

/* Формы добавления */
.addbar{background:var(--panel);border:1px solid var(--line-soft);border-radius:var(--radius);padding:16px 18px;margin-bottom:22px;box-shadow:var(--shadow)}
.addbar h3{margin:0 0 12px;font-size:15.5px;font-weight:700;display:flex;align-items:center;gap:6px}
.form-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.field{display:flex;flex-direction:column;gap:5px}
.field label{margin:0;display:flex;align-items:center;gap:5px}
.field input,.field select,.field textarea{padding:9px 11px;border-radius:var(--radius-s);border:1px solid var(--line);
  background:#fff;color:var(--ink);font-size:15.5px;min-width:160px;font-family:var(--font)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.addbar button{margin-top:0;width:auto;padding:10px 20px;font-size:15.5px}

.pill{display:inline-block;padding:2px 10px;border-radius:20px;font-size:13.5px;border:1px solid var(--line-soft);color:var(--muted)}
.pill.on{color:var(--ok);border-color:#b9e3c6;background:var(--ok-soft)}
.pill.off{color:var(--soft)}
.empty{color:var(--muted);padding:18px 4px}

/* Уровень запаса: на сколько дней хватит */
.lvl{display:inline-block;padding:2px 10px;border-radius:20px;font-size:13.5px;font-weight:700;
  border:1px solid transparent;font-variant-numeric:tabular-nums;white-space:nowrap}
.lvl-red{color:var(--del);background:var(--del-soft);border-color:#e6b3a8}
.lvl-yel{color:var(--warn);background:var(--warn-soft);border-color:#e6cf92}
.lvl-grn{color:var(--ok);background:var(--ok-soft);border-color:#b9e3c6}
.lvl-non{color:var(--soft);background:var(--panel2);border-color:var(--line-soft);font-weight:400}

/* Графики (рисуем сами, SVG) */
.chart-box{border:1px solid var(--line-soft);border-radius:var(--radius);background:var(--panel2);
  padding:12px 14px;margin:0 0 18px}
.chart-box.is-hidden{padding:8px 14px;background:transparent}
.chart-head{display:flex;align-items:center;gap:8px;margin:0 0 8px}
.chart-head b{font-size:15.5px;color:var(--ink)}
.chart-head .sub{color:var(--muted);font-size:14.5px;font-weight:400}
.chart-head .chart-toggle{margin-left:auto;height:30px;padding:0 12px;font-size:14px;width:auto}
.chart-body{overflow-x:auto}
.chart-svg{width:100%;height:auto;display:block;font-family:var(--font)}
.chart-grid{stroke:var(--line);stroke-width:1;stroke-dasharray:3 4}
.chart-axis{stroke:var(--line);stroke-width:1}
.chart-track{fill:var(--line-soft);opacity:.55}
.chart-ylab{font-size:13px;fill:var(--soft);text-anchor:end}
.chart-xlab{font-size:13px;fill:var(--muted);text-anchor:middle}
.chart-val{font-size:13px;fill:var(--muted);text-anchor:middle;font-weight:600}
.chart-cat{font-size:14px;fill:var(--ink)}
.chart-val-r{font-size:14px;fill:var(--ink);text-anchor:end;font-weight:700}

/* Быстрые группы товаров (по началу артикула) */
.groups{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px;align-items:center}
.groups .glab{font-size:13.5px;font-weight:600;color:var(--muted);margin-right:2px}
.grp{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;
  border:1px solid var(--line);background:#fff;color:var(--ink);font-size:14.5px;font-weight:600;text-decoration:none}
.grp:hover{border-color:var(--accent);color:var(--accent-d);text-decoration:none}
.grp.active{background:var(--accent);border-color:var(--accent);color:#fff}
.grp .cnt{font-size:13px;color:var(--soft);font-weight:400}
.grp.active .cnt{color:rgba(255,255,255,.75)}

/* Панель фильтров над таблицей */
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;margin:0 0 16px}
.filters .field{display:flex;flex-direction:column;gap:5px;margin:0}
.filters label{font-size:13.5px;font-weight:600;color:var(--muted);margin:0}
.filters input,.filters select{padding:9px 11px;border-radius:var(--radius-s);border:1px solid var(--line);
  background:#fff;font-family:var(--font);font-size:15.5px;width:auto;min-width:150px;color:var(--ink)}
.filters input:focus,.filters select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.filters button{margin:0;width:auto;padding:10px 20px}

/* ===================== Адаптив / мобильные ===================== */
@media (max-width:820px){
  .content{padding:18px 14px}
  .topbar{padding:9px 14px;position:static}
  .section{overflow-x:auto}
}
@media (max-width:820px){
  /* На узком экране панель встаёт в два ряда: слева действия, справа человек. */
  .topbar{flex-wrap:wrap;gap:8px}
  .toolbar,.greet{width:100%}
  .toolbar{justify-content:flex-start}
  .greet{justify-content:flex-end}
}
@media (max-width:640px){
  .toolbar .tbtn > span, .tbtn-out > span, .snd-lbl{display:none}   /* на мобильном — только иконки */
  .greet-hi{display:none}
  :root{ --tbtn-w:44px; }           /* иконки — тоже все одного размера */
  .tbtn{height:38px;padding:0}
  .snd-more{width:32px;flex:0 0 32px}
  .topbar button.snd-more{width:32px}
  .today{font-size:19px}
  .snd-pop{width:170px}
  th,td{padding:8px 8px}
  table{font-size:14.5px}
  .page-title{font-size:20px}
}

/* Доступность */
a:focus-visible,button:focus-visible,input:focus-visible,.tbtn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* =====================================================================
   ПЛАН ПОСТАВОК
   ===================================================================== */

/* Подменю в левой рельсе снесено 14.08.2026 вместе с самой рельсой:
   пункты плана живут в панели «Поставки» верхнего меню и во вкладках. */

/* Широкая таблица плана: шапка липнет сверху, товар — слева. */
.ptable-wrap{overflow:auto;max-height:78vh;border:1px solid var(--line);border-radius:var(--radius)}
.ptable{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:14.5px}
.ptable th,.ptable td{padding:6px 8px;white-space:nowrap;background:var(--panel);
  border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.ptable thead th{position:sticky;background:var(--panel2);font-size:13.5px;font-weight:700;vertical-align:bottom;z-index:3}
.ptable thead tr:first-child th{top:0;height:34px}
.ptable thead tr:nth-child(2) th{top:34px}

.ptable .stick{position:sticky;z-index:2}
.ptable thead .stick{z-index:6}
.ptable .s1{left:0;   width:44px; min-width:44px; max-width:44px;  text-align:right;color:var(--muted)}
.ptable .s2{left:44px;width:200px;min-width:200px;max-width:200px;white-space:normal;line-height:1.3}
.ptable .s3{left:244px;width:170px;min-width:170px;max-width:170px;border-right:2px solid var(--line)}
.ptable .s3 code{font-size:13px}

.ptable .cl-head{text-align:left;background:var(--soft);border-left:2px solid var(--accent);font-size:14.5px}
.cl-tog{width:20px;height:20px;padding:0;margin:0 4px 0 0;border:0;background:transparent;
  color:var(--accent);cursor:pointer;font-size:13px;line-height:1;vertical-align:middle}
.cl-tog:hover{color:var(--accent-d)}

.ptable .sum{background:var(--panel2);text-align:right;min-width:52px}
.ptable .sum.need{border-right:2px solid var(--line);color:var(--ink)}
.ptable thead .wh{text-align:right;min-width:64px;line-height:1.25}
.wh-cost{display:block;font-size:12.5px;font-weight:700;color:var(--accent-d)}
.wh-name{display:block;font-size:13.5px;font-weight:700;max-width:110px;overflow:hidden;text-overflow:ellipsis}
.wh-w{display:inline-block;margin-top:2px;padding:0 5px;border-radius:8px;font-size:12.5px;
  background:var(--gold-soft);color:var(--gold-ink);font-weight:800}

.ptable .pcell{text-align:right;min-width:60px}
.ptable .pcell .rec{font-weight:800}
.ptable .pcell.go   .rec{color:var(--ok)}
.ptable .pcell.stop .rec{color:var(--del);opacity:.6;font-weight:600}
.ptable .pcell .det{display:none}
.ptable.cells-open .pcell{min-width:76px}
.ptable.cells-open .pcell .det{display:block;margin-top:1px;font-size:12.5px;color:var(--muted);font-weight:600}
.ptable.cells-open .pcell .det .d1{color:var(--accent-d)}
.ptable.cells-open .pcell .det .d2::before{content:" · ";color:var(--line)}

.ptable .gband td{position:sticky;left:0;background:var(--gold-soft);color:var(--gold-ink);
  font-weight:800;font-size:13.5px;letter-spacing:.6px;text-transform:uppercase;padding:5px 10px}
.ptable tbody tr:hover td:not(.gband){background:var(--soft)}
.ptable tbody tr:hover .stick{background:var(--soft)}

/* =====================================================================
   ПЛАН ПОСТАВОК · НАСТРОЙКА (Админка)
   Чиним «километровые плашки»: в общих правилах input[type=text]
   растянут на 100%, из-за чего поля в таблице занимали всю ячейку.
   Здесь поля прижаты к содержимому, а шапка таблицы липнет при скролле.
   ===================================================================== */

/* Контейнер со скроллом: шапка остаётся на месте, когда листаешь список. */
.tbl-sticky{max-height:70vh;overflow:auto;border:1px solid var(--line);border-radius:var(--radius)}
.tbl-sticky .setup-tbl{margin:0}
.setup-tbl{width:100%;height:auto;border-collapse:separate;border-spacing:0;font-size:14.5px;table-layout:fixed}
.setup-tbl thead th{position:sticky;top:0;z-index:2;background:var(--panel2);
  box-shadow:inset 0 -1px 0 var(--line);white-space:nowrap;height:34px;padding:4px 9px;line-height:1.2}
.setup-tbl tbody tr{height:38px}                         /* фикс высоты: строки одинаковые и компактные */
.setup-tbl th,.setup-tbl td{padding:3px 9px;border-bottom:1px solid var(--line-soft);
  vertical-align:middle;line-height:1.25;overflow:hidden;text-overflow:ellipsis}
.setup-tbl td b{font-weight:700}
.setup-tbl tbody tr:hover td{background:var(--soft)}

/* Поля внутри настроечных таблиц — по высоте строки, а не во весь экран. */
.setup-tbl input[type=text],
.setup-tbl input[type=number]{width:100%;box-sizing:border-box;height:28px;padding:3px 8px;
  border:1px solid var(--line);border-radius:var(--radius-s);background:var(--panel);
  font-size:14.5px;font-family:var(--font);line-height:1.2}
.setup-tbl input.mini{width:100%;text-align:left}
.setup-tbl input.center{text-align:center}
.setup-tbl input::placeholder{color:var(--muted);opacity:.6}
.setup-tbl input:focus{outline:2px solid var(--accent);outline-offset:1px;border-color:var(--accent)}
.setup-tbl code{font-size:13px}
.setup-tbl .sku-cell{line-height:1.15}
.setup-tbl .sku-cell .nm{font-size:12.5px;color:var(--muted)}

/* Тарифная цифра «·авто» в шапке большой таблицы плана. */
.wh-auto{display:inline-block;margin-left:3px;font-size:12px;font-weight:700;color:var(--ok);opacity:.75}

/* Перетаскивание строк мышью: ручка, призрак места, летящая строка. */
.drag-handle{cursor:grab;color:var(--muted);user-select:none;text-align:center;width:26px;
  font-size:15.5px;line-height:1}
.drag-handle:hover{color:var(--accent)}
.drag-handle:active{cursor:grabbing}
.setup-tbl tbody tr.dnd-dragging{background:var(--panel);box-shadow:0 8px 22px rgba(20,24,26,.25);
  position:relative;z-index:30;display:table;opacity:.97}
.dnd-placeholder td{height:38px;background:repeating-linear-gradient(45deg,var(--soft),var(--soft) 6px,transparent 6px,transparent 12px);
  border:1px dashed var(--accent)}
form.dnd-dirty .dnd-save-hint{display:inline}
.dnd-save-hint{display:none;margin-left:10px;font-size:13.5px;font-weight:700;color:var(--accent-d)}

/* =====================================================================
   ПЛАН ПОСТАВОК — ИСПРАВЛЕНИЯ ПО ЗАМЕЧАНИЯМ
   (правила идут ПОСЛЕ прежних и перекрывают их)
   ===================================================================== */

/* --- Шапка таблицы плана --- */
/* Кластер — крупно и заметным цветом, а не серым «9 скл.» */
.ptable .cl-head{background:var(--accent-soft);border-left:3px solid var(--accent);
  text-align:left;padding:6px 10px;height:auto}
.ptable .cl-head .cl-name{font-size:15.5px;font-weight:800;color:var(--accent-d);
  letter-spacing:.2px;text-transform:none}
.ptable .cl-head .cl-cnt{margin-left:8px;font-size:13px;font-weight:700;color:var(--muted)}

/* Склад: тариф сверху, название чёрным жирным по центру, переносится на 2 строки.
   Все колонки складов одной ширины — таблица становится симметричной. */
.ptable thead th.wh{width:96px;min-width:96px;max-width:96px;
  text-align:center;vertical-align:top;padding:5px 4px;white-space:normal}
.ptable .wh-cost{display:block;font-size:12.5px;font-weight:700;color:var(--accent-d);
  line-height:1.1;margin-bottom:3px;white-space:nowrap}
.ptable .wh-name{display:block;font-size:13.5px;font-weight:800;color:var(--ink);
  line-height:1.2;white-space:normal;word-break:break-word;max-width:none;
  text-align:center;min-height:28px}
.ptable .wh-tags{display:block;margin-top:3px;min-height:14px}
.ptable .wh-w{display:inline-block;padding:0 5px;border-radius:8px;font-size:12.5px;
  background:var(--gold-soft);color:var(--gold-ink);font-weight:800}
.ptable .wh-new{display:inline-block;padding:0 5px;border-radius:8px;font-size:12px;
  background:var(--del-soft);color:var(--del);font-weight:800;white-space:nowrap}

/* Ячейки складов вне плана — приглушены, но остаток видно. */
.ptable td.pcell{width:96px;min-width:96px;max-width:96px}
.ptable thead th.wh-off,.ptable td.offcell{background:var(--soft)}
.ptable td.offcell .rec{color:var(--muted);font-weight:600}

/* --- Настройка: склады карточками, горизонтально --- */
.cl-block{margin:0 0 16px}
.cl-title{display:flex;align-items:center;gap:8px;font-size:15.5px;font-weight:800;
  color:var(--accent-d);padding:5px 10px;background:var(--accent-soft);
  border-left:3px solid var(--accent);border-radius:6px;margin-bottom:8px}
.cl-title .cl-n{font-size:13px;font-weight:700;color:var(--muted);
  background:var(--panel);border-radius:10px;padding:1px 7px}

.wh-strip{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 10px;align-items:stretch}
.wh-card{flex:0 0 150px;width:150px;box-sizing:border-box;background:var(--panel);
  border:1px solid var(--line);border-radius:10px;padding:8px;display:flex;
  flex-direction:column;gap:4px;box-shadow:var(--shadow)}
.wh-card.is-off{background:var(--soft);border-style:dashed;opacity:.85}
.wh-card.dnd-dragging{box-shadow:0 12px 26px rgba(20,24,26,.3);z-index:40;position:relative}
.dnd-placeholder-card{flex:0 0 auto;border:2px dashed var(--accent);border-radius:10px;
  background:var(--accent-soft);box-sizing:border-box}

.wh-card-top{display:flex;align-items:center;gap:6px;min-height:20px}
.wh-card-top .drag-handle{width:auto;font-size:15.5px;color:var(--muted);cursor:grab}
.wh-card-top .drag-handle:hover{color:var(--accent)}
.wh-chk{display:inline-flex;margin:0}
.wh-chk input{margin:0;cursor:pointer}
.wh-badge{margin-left:auto;font-size:12px;font-weight:800;color:var(--del);
  background:var(--del-soft);border-radius:8px;padding:1px 5px;white-space:nowrap}

.wh-card-name{font-size:14px;font-weight:800;color:var(--ink);text-align:center;
  line-height:1.2;min-height:30px;display:flex;align-items:center;justify-content:center;
  word-break:break-word}
.wh-card-id{font-size:12.5px;color:var(--muted);text-align:center}
.wh-card-tar{font-size:13px;font-weight:800;color:var(--accent-d);text-align:center;
  background:var(--panel2);border-radius:6px;padding:2px 0}
.wh-card-row{display:flex;align-items:center;gap:5px;font-size:13px;color:var(--muted)}
.wh-card-row span{flex:0 0 42px}
.wh-card-row input[type=text]{width:100%;box-sizing:border-box;height:24px;padding:2px 6px;
  font-size:13.5px;border:1px solid var(--line);border-radius:5px;background:var(--panel);
  font-family:var(--font)}
.wh-card-row input:focus{outline:2px solid var(--accent);outline-offset:1px}
.wh-card-foot{margin-top:2px;font-size:12.5px;color:var(--muted);text-align:center;
  border-top:1px solid var(--line-soft);padding-top:4px}

/* --- Настройка: товары строками --- */
.setup-tbl tbody tr.not-mine td{background:var(--soft)}
.setup-tbl tbody tr.not-mine td b{color:var(--muted)}
.setup-tbl .drag-handle{cursor:grab;color:var(--muted);font-size:15.5px;text-align:center}
.setup-tbl .drag-handle:hover{color:var(--accent)}
.setup-tbl .sku-cell code{display:block;font-size:13px;line-height:1.2}
.setup-tbl .sku-cell .nm{display:block;font-size:12.5px;color:var(--muted);line-height:1.2}
.setup-tbl tbody tr.dnd-dragging{background:var(--panel);box-shadow:0 8px 22px rgba(20,24,26,.28)}

.dnd-save-hint{display:none;margin-left:10px;font-size:13.5px;font-weight:800;color:var(--accent-d)}
form.dnd-dirty .dnd-save-hint{display:inline}

/* =====================================================================
   ФИНАЛЬНЫЕ ОВЕРРАЙДЫ (идут последними — перекрывают всё выше)
   ===================================================================== */

/* Плашка «сохранено ✓» — плавает справа сверху секции. */
.save-flash{position:fixed;top:70px;right:24px;z-index:80;padding:8px 14px;border-radius:20px;
  font-size:14.5px;font-weight:700;opacity:0;transform:translateY(-6px);transition:opacity .18s,transform .18s;
  pointer-events:none;box-shadow:0 8px 22px rgba(20,24,26,.25)}
.save-flash.show{opacity:1;transform:translateY(0)}
.save-flash.ok{background:var(--ok);color:#fff}
.save-flash.err{background:var(--del);color:#fff}

/* ТОВАРЫ: строго компактные строки. Никакой растяжки по высоте. */
.setup-tbl{table-layout:auto !important}
.setup-tbl tbody tr{height:auto !important}
.setup-tbl th,.setup-tbl td{padding:4px 8px !important;vertical-align:middle !important;
  line-height:1.25 !important}
.setup-tbl tbody td{white-space:nowrap}
.setup-tbl input[type=text],.setup-tbl input[type=number]{height:26px !important;
  padding:2px 7px !important;margin:0 !important;vertical-align:middle}
.setup-tbl .sku-cell{white-space:nowrap;line-height:1.15}
.setup-tbl .sku-cell code{display:inline;font-size:13px}
.setup-tbl .sku-cell .nm{display:inline-block;margin-left:6px;font-size:12.5px}
/* «Товар» и «Описание» тянутся, но не бесконечно — таблица влезает без гигантских строк. */
.setup-tbl td input[data-save="pr_title"]{min-width:180px}
.setup-tbl td input[data-save="pr_descr"]{min-width:120px}

/* =====================================================================
   ТОВАРЫ СПИСКОМ (не таблица!) — строки гарантированно компактные.
   Таблица упорно раздувала строки; список из строк-флексов такой
   болезни не подвержен в принципе.
   ===================================================================== */
.plist-head,.prow{display:flex;align-items:center;gap:8px;padding:0 10px}
.plist-head{height:30px;font-size:13px;font-weight:800;color:var(--muted);
  text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--line);
  position:sticky;top:0;background:var(--panel2);z-index:2;border-radius:8px 8px 0 0}
.plist{max-height:60vh;overflow-y:auto;overflow-x:hidden;
  border:1px solid var(--line);border-top:0;border-radius:0 0 8px 8px}
.prow{height:34px;border-bottom:1px solid var(--line-soft);background:var(--panel)}
.prow:hover{background:var(--soft)}
.prow.not-mine{background:var(--soft)}
.prow.not-mine .c-n{color:var(--muted)}
.prow.dnd-dragging{box-shadow:0 8px 22px rgba(20,24,26,.28);border-radius:6px;z-index:30}

.plist .c-h{flex:0 0 18px;text-align:center;cursor:grab;color:var(--muted);font-size:14.5px}
.plist .c-h:hover{color:var(--accent)}
.plist .c-n{flex:0 0 30px;text-align:right;font-weight:800;font-size:14px}
.plist .c-a{flex:0 0 40px;text-align:center}
.plist .c-a input{margin:0;cursor:pointer}
.plist .c-t{flex:1 1 240px;min-width:160px}
.plist .c-d{flex:1 1 150px;min-width:110px}
.plist .c-s{flex:1 1 230px;min-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plist .c-s code{font-size:13px}
.plist .c-s .nodata{margin-left:6px;font-size:12px;font-style:normal;font-weight:800;
  color:var(--gold-ink);background:var(--gold-soft);border-radius:8px;padding:1px 5px}
.plist .c-q{flex:0 0 62px;text-align:right;font-size:13.5px;font-variant-numeric:tabular-nums}
.plist input[type=text]{width:100%;box-sizing:border-box;height:24px;padding:2px 7px;
  font-size:14px;border:1px solid var(--line);border-radius:5px;background:var(--panel);
  font-family:var(--font)}
.plist input[type=text]:focus{outline:2px solid var(--accent);outline-offset:1px}
.dnd-placeholder-card{flex:0 0 auto;border:2px dashed var(--accent);border-radius:8px;
  background:var(--accent-soft);box-sizing:border-box}

/* --- Склад-двойник и своё имя --- */
.wh-merged{margin-left:auto;font-size:12px;font-weight:800;color:#fff;background:var(--ok);
  border-radius:8px;padding:1px 5px}
.wh-card-src{display:flex;flex-wrap:wrap;gap:3px;justify-content:center;min-height:14px}
.wh-card-src .src-name{font-size:12px;color:var(--muted);background:var(--panel2);
  border-radius:6px;padding:1px 4px;white-space:nowrap}
.wh-card-src .unmerge{width:auto;margin:0;padding:1px 5px;font-size:12px;font-weight:700;
  border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--del);cursor:pointer}
.wh-card-src .unmerge:hover{border-color:var(--del)}

/* --- Товар в таблице плана: одна строка, без переносов --- */
.ptable .s2{white-space:nowrap !important;overflow:hidden;text-overflow:ellipsis}
.ptable .pname{display:inline;font-size:14px}
.ptable .pdescr{display:inline;margin-left:5px;font-size:13px;color:var(--muted)}
.ptable tbody td{height:30px;padding:3px 8px}

/* --- Сворачиваемая подсказка --- */
.help-tog{width:20px;height:20px;padding:0;margin-right:6px;border:0;background:transparent;
  color:var(--accent);cursor:pointer;font-size:13px;line-height:1;vertical-align:middle}
.help-box.is-closed .help-body{display:none}

/* =====================================================================
   ЧАСТЬ A+B: переключатель стоимости и объединение складов мышью
   ===================================================================== */

/* Клик по стоимости — переключатель рубли/коэффициент. */
.cost-toggle{cursor:pointer;border-bottom:1px dotted var(--accent-d)}
.cost-toggle:hover{color:var(--accent);filter:brightness(1.1)}

/* Кнопка «Объединить» на карточке склада. */
.wh-merge-btn{width:100%;margin-top:4px;padding:3px 0;font-size:12.5px;font-weight:700;
  border:1px solid var(--line);border-radius:6px;background:var(--panel);color:var(--accent-d);cursor:pointer}
.wh-merge-btn:hover{border-color:var(--accent);background:var(--accent-soft)}

/* Карточка-цель объединения: натянуто мигает, призывая. */
@keyframes mergePulse {
  0%,100% { box-shadow:0 0 0 2px var(--accent), 0 0 10px rgba(211,82,53,.35); }
  50%     { box-shadow:0 0 0 3px var(--accent), 0 0 22px rgba(211,82,53,.65); }
}
.wh-card.merge-target{animation:mergePulse 1.4s ease-in-out infinite;position:relative;z-index:20}
.wh-card.merge-target::after{content:"перетащи сюда двойник";position:absolute;top:-9px;left:50%;
  transform:translateX(-50%);font-size:12px;font-weight:800;color:#fff;background:var(--accent);
  border-radius:8px;padding:1px 7px;white-space:nowrap}
.wh-card.merge-hover{outline:3px solid var(--ok);outline-offset:1px}
body.merge-mode .wh-card:not(.merge-target){cursor:grab}
body.merge-mode .wh-strip{background:var(--accent-soft);border-radius:10px}

/* Автоподсветка «Возможно дубль» (часть C, задел). */
@keyframes dupPulse {
  0%,100% { background:var(--panel); }
  50%     { background:var(--gold-soft); }
}
.maybe-dup{animation:dupPulse 2.4s ease-in-out infinite}
.dup-flag{position:relative;font-size:12px;font-weight:800;color:var(--gold-ink);
  background:var(--gold-soft);border:1px solid var(--gold-d);border-radius:8px;padding:1px 6px;cursor:help}

/* =====================================================================
   Регулировка ширины колонок + месячное хранение
   ===================================================================== */
/* Ухватка ширины: тонкая полоса у правого края заголовка. */
.ptable thead th{position:relative}
.col-grip{position:absolute;top:0;right:0;width:6px;height:100%;cursor:col-resize;
  z-index:8;user-select:none}
.col-grip:hover{background:var(--accent);opacity:.5}
/* Разрешаем колонкам сжиматься/растягиваться: снимаем жёсткие max-width со складов. */
.ptable thead th.wh{width:96px;min-width:60px;max-width:none}
.ptable td.pcell{min-width:60px;max-width:none}
/* Разделы «стик» тоже тянутся — но не ниже читаемого. */
.ptable .s2{min-width:120px}
.ptable .s3{min-width:110px}

/* =====================================================================
   ШАПКА ТАБЛИЦЫ ПЛАНА — ПЕРЕПИСАНО НАЧИСТО (перекрывает всё выше).
   Было: две строки шапки конфликтовали, наезжали на товар №1 и уезжали
   при вертикальном скролле. Теперь обе строки жёстко липнут сверху, а
   левые колонки (товар/артикул) липнут слева. На пересечении — высший z.
   ===================================================================== */

/* Контейнер со скроллом обеих осей. */
.ptable-wrap{overflow:auto;max-height:78vh;position:relative;
  border:1px solid var(--line);border-radius:var(--radius)}

/* Обе строки шапки липнут к верху. Первая (кластеры) на 0, вторая (склады) под ней. */
.ptable thead tr:first-child th{position:sticky;top:0;z-index:30;height:32px}
.ptable thead tr:nth-child(2) th{position:sticky;top:32px;z-index:30;height:auto}

/* Левые «замороженные» колонки — липнут влево. В теле — ниже шапки. */
.ptable .s1{position:sticky;left:0;z-index:20;background:var(--panel)}
.ptable .s2{position:sticky;z-index:20;background:var(--panel)}
.ptable .s3{position:sticky;z-index:20;background:var(--panel)}
/* Ширины left задаём переменными, чтобы двигались вместе с ресайзом (по умолчанию). */
.ptable .s1{left:0}
.ptable .s2{left:var(--s1w,44px)}
.ptable .s3{left:calc(var(--s1w,44px) + var(--s2w,200px))}

/* Углы шапки — где пересекаются липкий верх и липкий лев — ВЫШЕ всех. */
.ptable thead .s1,.ptable thead .s2,.ptable thead .s3{z-index:40;background:var(--panel2)}

/* Ширины столбцов: НИЖНЕЙ границы нет — можно ужимать сколько нужно. */
.ptable thead th.wh{width:96px;min-width:0;max-width:none}
.ptable td.pcell{width:96px;min-width:0;max-width:none}
.ptable .s1{width:44px;min-width:0}
.ptable .s2{width:200px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptable .s3{width:170px;min-width:0}

/* Полоса-разделитель товаров: серая строка, которую можно таскать. */
.ptable tr.sep-row td{background:var(--rail);height:16px;padding:0;
  border-top:2px solid var(--rail2);border-bottom:2px solid var(--rail2)}
.ptable tr.sep-row .sep-inner{display:flex;align-items:center;gap:8px;padding:0 10px;
  position:sticky;left:0;color:var(--rail-ink);font-size:12.5px;font-weight:800;
  letter-spacing:.5px;text-transform:uppercase;white-space:nowrap}
.ptable tr.sep-row .drag-handle{cursor:grab;color:var(--rail-mut);font-size:13.5px}
.ptable tr.sep-row input{background:transparent;border:0;color:var(--rail-ink);
  font-size:12.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;
  width:180px;padding:2px 4px;border-radius:4px}
.ptable tr.sep-row input:focus{outline:1px solid var(--rail-mut);background:rgba(255,255,255,.08)}
.ptable tr.sep-row.dnd-dragging td{opacity:.9}

/* Разделитель-полоса в таблице ПЛАНА (только показ). */
.ptable tr.plan-sep td{background:var(--rail);height:22px;padding:0}
.ptable tr.plan-sep .plan-sep-in{position:sticky;left:0;display:inline-block;
  padding:3px 14px;color:var(--rail-ink);font-size:13px;font-weight:800;
  letter-spacing:.6px;text-transform:uppercase;white-space:nowrap}

/* Автопорядок: полоса СВЯЗКИ карточек (уровень 2) — тонкая и светлая,
   чтобы не спорить с тёмной полосой категории. */
.ptable tr.plan-sep--l2 td{background:var(--panel2);height:17px;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ptable tr.plan-sep--l2 .plan-sep-in{color:var(--muted);font-size:12.5px;font-weight:700;
  letter-spacing:.3px;text-transform:none;padding:1px 14px 1px 26px}

/* Разделитель в АДМИНКЕ (перетаскиваемый, с названием). */
.prow.sep{background:var(--rail);border-radius:6px;margin:2px 0}
.prow.sep .c-h{color:var(--rail-mut)}
.prow.sep .c-n{color:var(--rail-mut)}
.prow.sep .sep-body{flex:1 1 auto;display:flex;align-items:center;gap:8px}
.prow.sep .sep-input{flex:1 1 auto;max-width:340px;background:rgba(255,255,255,.08);
  border:1px solid var(--rail2);color:var(--rail-ink);height:24px;padding:2px 8px;
  border-radius:5px;font-size:13px;font-weight:800;letter-spacing:.5px;text-transform:uppercase}
.prow.sep .sep-input:focus{outline:1px solid var(--accent)}
.prow.sep .sep-del{width:auto;padding:2px 8px;font-size:13px;border:1px solid var(--rail2);
  border-radius:5px;background:transparent;color:var(--del);cursor:pointer}
.prow.sep .sep-del:hover{border-color:var(--del)}

/* =====================================================================
   ВЕТКА 9 — ДВА БАГА ТАБЛИЦЫ ПЛАНА (итоговый блок, перекрывает всё выше)

   1) Столбцы не сужались. Раскладку теперь держит <colgroup> в plan/wb.php
      + table-layout:fixed: браузер слушается ширины <col>, содержимое
      ячеек столбец больше НЕ распирает. Ресайз мышью двигает <col> —
      поэтому работает в обе стороны.
   2) Шапка складов наезжала влево на «№ / Товар / Артикул». Причина:
      правило «.ptable thead tr:first-child th» (z-index:30) СИЛЬНЕЕ по
      специфичности, чем «.ptable thead .s1» (z-index:40) — сорокет не
      применялся вовсе, угловые ячейки жили на одном слое с шапкой
      складов, и побеждал порядок в DOM. Селектор ниже сильнее обоих.
   ===================================================================== */
.ptable{table-layout:fixed;width:100%;min-width:100%}

/* Ширину столбца задаёт <col> — у ячеек снимаем собственные рамки ширины. */
.ptable .s1,.ptable .s2,.ptable .s3{width:auto;min-width:0;max-width:none}
.ptable thead th.wh{width:auto;min-width:0;max-width:none}
.ptable td.pcell{width:auto;min-width:0;max-width:none}
.ptable .sum{min-width:0}

/* Узкая ячейка режет лишнее, а не распирает столбец. Шапку не трогаем:
   в ней живут всплывашки «?» — overflow:hidden их обрезал бы. */
.ptable tbody td{overflow:hidden}
.ptable tr.plan-sep td{overflow:visible} /* липкая подпись разделителя */

/* Липкие левые края s2/s3 едут за ФАКТИЧЕСКОЙ шириной соседей —
   переменные ставит скрипт ресайза в plan/wb.php. */
.ptable .s2{left:var(--s1w,44px)}
.ptable .s3{left:calc(var(--s1w,44px) + var(--s2w,200px))}

/* Угловые ячейки шапки — выше шапки складов, фон непрозрачный. */
.ptable thead tr:first-child th.s1,
.ptable thead tr:first-child th.s2,
.ptable thead tr:first-child th.s3{z-index:45;background:var(--panel2)}

/* =====================================================================
   ВЕТКА 9, КУСОК 1: сводка «Весь WB» + признак «затарен» + светлый ховер
   ===================================================================== */
/* Сводка «Весь WB» — своя, золотая колонка до первого кластера. */
.ptable .twb-head{background:var(--gold-soft);color:var(--gold-ink);
  border-left:3px solid var(--gold-d);text-align:left;padding:6px 10px;height:auto}
.ptable thead th.sum.twb{background:var(--gold-soft);color:var(--gold-ink)}
.ptable td.sum.twb{background:#faf5e6}
.ptable td.sum.twb{background:color-mix(in srgb, var(--gold-soft) 42%, var(--panel))}
.ptable .twb.need{border-right:3px solid var(--gold-d)}

/* «Затарен»: плюс есть, но это перекладка внутри кластера — гасим серым. */
.ptable .pcell.damp .rec{color:var(--soft);font-weight:600;opacity:1}
.ptable td.sum.damp b{color:var(--soft);font-weight:600}

/* Ховер строки: был тёмный шалфей (--soft #7f8b7e) — зелёные «+N» тонули.
   Теперь светлая песочная подсветка, все цвета цифр читаются. */
.ptable tbody tr:hover td:not(.gband){background:#f6efdd}
.ptable tbody tr:hover td:not(.gband){background:color-mix(in srgb, var(--gold-soft) 55%, var(--panel))}
.ptable tbody tr:hover .stick{background:#f6efdd}
.ptable tbody tr:hover .stick{background:color-mix(in srgb, var(--gold-soft) 55%, var(--panel))}

/* Карточка-подсказка ячейки плана: прямоугольник с жирной обводкой вместо
   системной строки. Красная плашка «КЛАСТЕР ПЕРЕТАРЕН!» — снизу, крупно. */
.ptip{position:fixed;z-index:200;min-width:200px;max-width:290px;background:var(--panel);
  border:2px solid var(--rail);border-radius:10px;box-shadow:0 12px 30px rgba(20,24,26,.3);
  font-size:14px;color:var(--ink);pointer-events:none;display:none;overflow:hidden}
.ptip.on{display:block}
.ptip .ptip-h{font-weight:800;padding:8px 12px 3px;font-size:14.5px}
.ptip .ptip-b{padding:0 12px 9px;line-height:1.6}
.ptip .ptip-b b{font-weight:800}
.ptip .ptip-over{display:block;padding:9px 12px;text-align:center;
  background:var(--del-soft);color:var(--del);font-weight:800;font-size:16px;
  letter-spacing:.5px;border-top:2px solid var(--del)}

/* =====================================================================
   ВЕТКА 9, КУСОК G-1: глубокая шапка, сетка, центр, столбец «Цвет»,
   резина справа, выделение строки/столбца кликом.
   ===================================================================== */

/* --- Шапка: глубокий серо-зелёный вместо розово-бежевого --- */
.ptable thead tr:first-child th{background:#3f5d66;color:#eef3f2;border-bottom:1px solid #33505a}
.ptable thead th.cl-head{background:#3f5d66;color:#f2f6f5;border-left:2px solid #2c4750;text-align:left}
.ptable thead .cl-tog{color:#f2f6f5}
.ptable thead .cl-cnt{color:#c4d3d1}
/* второй ряд: города и итоги — светло-стальной, каждая ячейка в рамке */
.ptable thead tr:nth-child(2) th{background:#d9e3e1;color:var(--ink);
  border:1px solid #a9bcb9;border-top:0}
.ptable thead th.wh{text-align:center}
.ptable thead th.wh .wh-cost{display:block;text-align:center;margin:0 auto}
.ptable thead th.wh .wh-name{text-align:center}
.ptable thead th.sum{text-align:center}
/* золото сводки «Весь ...» — поверх нового тона */
.ptable thead tr:first-child th.twb-head{background:var(--gold-soft);color:var(--gold-ink);border-left:3px solid var(--gold-d)}
.ptable thead tr:nth-child(2) th.sum.twb{background:var(--gold-soft);color:var(--gold-ink);border-color:#cbb98a}
/* угловые ячейки — в тон первого ряда, слоем выше шапки складов */
.ptable thead tr:first-child th.s1,
.ptable thead tr:first-child th.s2,
.ptable thead tr:first-child th.s2b,
.ptable thead tr:first-child th.s3{z-index:45;background:#3f5d66;color:#eef3f2}
.ptable thead tr:first-child th.s1 .hint,
.ptable thead tr:first-child th.s2b .hint,
.ptable thead tr:first-child th.s3 .hint{border-color:#c4d3d1;color:#c4d3d1}

/* --- Столбец «Цвет»: липкий, между Товаром и Артикулом --- */
.ptable .s2b{position:sticky;z-index:20;background:var(--panel);
  left:calc(var(--s1w,44px) + var(--s2w,200px));
  border-right:1px solid var(--line);min-width:0;width:auto;max-width:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ptable .s3{left:calc(var(--s1w,44px) + var(--s2w,200px) + var(--s2bw,110px))}
.ptable td.s2b .pdescr{display:inline;margin:0}

/* --- Тело: числа по центру, сетка под городами, нолики приглушённые --- */
.ptable td.pcell{text-align:center;border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)}
.ptable .pcell.zero .rec{color:var(--line);font-weight:400}
.z0{color:var(--line);font-weight:400}

/* --- Резина: за последним кластером таблица закрыта фоном страницы --- */
.ptable thead tr th.hfill{background:var(--bg);border:0}
.ptable tbody td.bfill{background:var(--bg);border:0}
.ptable tbody tr:hover td.bfill{background:var(--bg)}

/* --- Выделение кликом: строка и столбец, спокойный голубой --- */
.ptable tbody tr.hl-row td{background:#dce8ec}
.ptable tbody tr.hl-row .stick{background:#dce8ec}
.ptable tbody tr.hl-row td.bfill{background:var(--bg)}
.ptable td.pcell.hl-col{background:#dce8ec}
.ptable thead th.wh.hl-col{background:#b7ccd2}

/* --- ВЕТКА 9, K1: сигналы внимания (мёртвый остаток / тихий перекуп) --- */
.kbad{display:inline-block;margin-top:2px;padding:1px 8px;border-radius:9px;font-size:13px;
  font-weight:700;color:var(--del);background:var(--del-soft);border:1px solid #e0a89c;white-space:nowrap}
.kwarn{display:inline-block;margin-top:2px;padding:1px 8px;border-radius:9px;font-size:13px;
  font-weight:700;color:var(--warn);background:var(--warn-soft);border:1px solid #e3cf9a;white-space:nowrap}
/* бейдж встаёт второй строкой под названием — строка подрастает и КРИЧИТ */
.ptable tbody td.s2{white-space:normal;line-height:1.35}
.ptable tbody td.s2 .pname{display:block}
/* жёлтая плашка в карточке ячейки (красная ptip-over уже есть) */
.ptip .ptip-warn{display:block;padding:9px 12px;text-align:center;
  background:var(--warn-soft);color:var(--warn);font-weight:800;font-size:15.5px;
  letter-spacing:.4px;border-top:2px solid var(--warn)}

/* --- ВЕТКА 9, K2: плашка «прогрев/новичок» в карточке ячейки --- */
.ptip .ptip-note{display:block;padding:8px 12px;text-align:center;
  background:#e3ecef;color:#3f5d66;font-weight:700;font-size:14px;
  border-top:2px solid #9fb9c1}

/* --- ВЕТКА 9, K2: плашка «новичок в кластере / прогрев» в карточке ячейки --- */
.ptip .ptip-note{display:block;padding:8px 12px;text-align:center;
  background:#e3ecef;color:#3f5d66;font-weight:700;font-size:14px;
  line-height:1.45;border-top:2px solid #3f5d66}

/* ============================================================
   КОЛЕСО ОЖИДАНИЯ (28.08.2026, ветка 39a). Вид живёт здесь, а не
   в скрипте: механика и вид общего элемента — в одном месте (№175).
   Цвета берём из палитры lib/ui.php переменными, числами не пишем.
   ============================================================ */
.mp-wait{
  position:fixed; right:18px; bottom:18px; z-index:9000;
  display:none; align-items:center; gap:14px;
  padding:14px 18px; max-width:min(420px, calc(100vw - 36px));
  border-radius:14px;
  background:var(--mp-card, #fff);
  border:1px solid var(--mp-line, #e2e2e2);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
  font-size:15px; line-height:1.35;
}
.mp-wait.on{ display:flex; }
.mp-wait-ring{ flex:0 0 auto; }
@keyframes mp-wait-spin{ to{ transform:rotate(360deg); } }

/* ЖИВОЙ ЛОГОТИП — ЗНАК ОЖИДАНИЯ ПЛАТФОРМЫ (26.09.2026, в. 59, слово Сергея:
   «наш лого живой, а вокруг него круги имитируют работу на нашем сайте»).
   В середине дышат два слэша логотипа, по очереди; вокруг — три кольца-
   шестерни, каждое своим ходом и в свою сторону: работает механизм. Один
   знак на всю платформу: общее колесо (assets/wait.js) и местные ожидания
   (mpMark() в том же файле). Размер — переменная --mk. */
.mp-mark{ position:relative; display:inline-block; vertical-align:middle;
  width:var(--mk, 40px); height:var(--mk, 40px); flex:0 0 auto; }
.mp-mark i{ position:absolute; border-radius:50%; box-sizing:border-box; }
.mp-mark .mk-r1{ inset:0; border:2px dashed #5c9a17; animation:mp-wait-spin 7s linear infinite; }
.mp-mark .mk-r2{ inset:16%; border:2px solid transparent; border-top-color:#7ED214; border-bottom-color:#7ED214;
  animation:mp-wait-spin 1.6s linear infinite reverse; }
.mp-mark .mk-r3{ inset:8%; border:1.5px dotted #a5d95a; animation:mp-wait-spin 3.1s linear infinite; }
.mp-mark b{ position:absolute; top:31%; width:12%; height:38%; border-radius:2px; background:#5c9a17;
  transform:skewX(-20deg); animation:mp-mark-breath 1.3s ease-in-out infinite; }
.mp-mark b.mk-s1{ left:37%; }
.mp-mark b.mk-s2{ left:53%; animation-delay:.32s; }
@keyframes mp-mark-breath{ 0%,100%{ opacity:.35; transform:skewX(-20deg) translateY(8%); }
  50%{ opacity:1; transform:skewX(-20deg) translateY(-8%); } }
.mp-wait.long .mp-mark .mk-r1{ border-color:var(--mp-warn, #c98a12); }
.mp-wait.long .mp-mark .mk-r2{ border-top-color:var(--mp-warn, #c98a12); border-bottom-color:var(--mp-warn, #c98a12); }
.mp-mark-line{ display:inline-flex; align-items:center; gap:10px; }
.mp-wait-text{ display:flex; flex-direction:column; }
.mp-wait-title{ font-size:16px; }
.mp-wait-sec{ color:var(--mp-dim, #7a7a7a); font-size:13px; }
.mp-wait-hint{
  display:none; position:absolute; right:0; bottom:calc(100% + 10px);
  width:min(360px, calc(100vw - 36px));
  padding:12px 14px; border-radius:12px;
  background:var(--mp-card, #fff);
  border:1px solid var(--mp-line, #e2e2e2);
  box-shadow:0 10px 28px rgba(0,0,0,.18);
  font-size:14px; color:var(--mp-text, #222);
}
.mp-wait:hover .mp-wait-hint{ display:block; }
@media (prefers-reduced-motion: reduce){
  .mp-mark i, .mp-mark b{ animation-duration:4s; }
}
/* ТЕЛЕФОН — ТОНКОЙ ПОЛОСКОЙ (Р152): карточка 69 px в углу закрывала карточки и полосу «Выбрано»; на телефоне —
   бегущая полоска цвета логотипа по верхнему краю экрана, как у браузера; долго (15 с+) — цветом «внимание». */
@media (max-width:720px){
  .mp-wait{ left:0; right:0; top:0; bottom:auto; max-width:none; height:3px; padding:0; gap:0; border:0; border-radius:0;
    box-shadow:none; background:rgba(126,210,20,.22); overflow:hidden; pointer-events:none; }
  .mp-wait > *{ display:none !important; }
  .mp-wait:after{ content:""; position:absolute; top:0; bottom:0; left:-40%; width:40%; background:#7ED214;
    animation:mp-wait-run 1.1s ease-in-out infinite; }
  .mp-wait.long:after{ background:var(--mp-warn, #c98a12); }
  @keyframes mp-wait-run{ to{ left:100%; } }
}

/* ============================================================
   СИГНАЛЬНАЯ ЛЕНТА ВЛАДЕЛЬЦА (28.08.2026, ветка 39c).
   Жёлто-чёрная полоса по краю окна: пока она горит, на сайте
   суперадмин — где бы он ни находился. Гаснет только выходом.
   Ленту нельзя нажать и нельзя перекрыть: она поверх всего,
   но насквозь прозрачна для мыши (pointer-events:none).
   ============================================================ */
body.mp-su .mp-su-tape{
  position:fixed; inset:0; z-index:9500; pointer-events:none;
  border:9px solid transparent;
  border-image:repeating-linear-gradient(
      45deg,
      #f2c200 0, #f2c200 14px,
      #1a1a1a 14px, #1a1a1a 28px) 9;
}
/* ⚠ ПОЛЕ У BODY УБРАНО (29.08.2026, в. 39f). Вчера я отодвинул содержимое
   от ленты полем в 9 пикселей — и страница стала шире окна: шапка уехала
   за правый край, внизу появилась горизонтальная прокрутка (скрин Сергея
   29.08). Причина: внутренние блоки считают ширину от окна, а поле у body
   добавляется сверх неё. Лента лежит поверх страницы отдельным слоем и
   мышь пропускает — отодвигать содержимое не нужно вовсе. */
body.mp-su{ padding:0; }
body.mp-su .tb-role{ background:#1a1a1a; color:#f2c200; font-weight:700; letter-spacing:.3px; }
/* Печать: лента — служебный знак экрана, на бумаге ей делать нечего */
@media print{ body.mp-su .mp-su-tape{ display:none; } body.mp-su{ padding:0; } }

/* Лента помощника платформы (29.08.2026, в. 39h): та же сигнальная полоса,
   но сине-чёрная — на скриншоте от помощника сразу видно, что это не владелец. */
body.mp-su.mp-staff .mp-su-tape{
  border-image:repeating-linear-gradient(
      45deg,
      #2f7fa8 0, #2f7fa8 14px,
      #1a1a1a 14px, #1a1a1a 28px) 9;
}
body.mp-su.mp-staff .tb-role{ background:#2f7fa8; color:#fff; }