@charset "UTF-8";
/* #46 этап 4 (23.09.2026): окна, разделы «Еще», вход — в общем виде макета. Только стили; подключается после style.css. */
/* Палитра и кнопки — из макета (README, WB.dc.html, States.dc.html). Разметка не менялась: где у элемента встроенный стиль
   (style="…" в index.html или style.cssText в app.js), правило здесь с !important — иначе оно не действует. */
:root{
  --rs-bg:#f4f4f1; --rs-surface:#ffffff; --rs-text:#1c1e22; --rs-muted:#6f737a; --rs-muted2:#5a5e65;
  --rs-line:#e4e4df; --rs-line2:#eeeeea; --rs-field:#d6d6d0; --rs-head:#f2f2ee;
  --rs-accent:#1f4fb8; --rs-accent-dark:#163a88; --rs-accent-soft:#eaf0fb;
  --rs-ok:#1d7a45; --rs-ok-soft:#e6f2e9; --rs-bad:#a3261c; --rs-bad-soft:#fde4e1; --rs-warn:#8a4210; --rs-warn-soft:#fbe6d4;
}

/* ───────── окна ───────── */
.modal-bg{background:rgba(20,20,19,.38)}
.modal{border:1px solid #d9d9d3;border-radius:8px;box-shadow:0 10px 30px rgba(20,20,19,.16);padding:20px 24px;font-size:13px;color:var(--rs-text)}
.modal h2{font-size:15px;font-weight:600;margin-bottom:12px;padding-right:36px;line-height:1.3}
.modal > p{font-size:12px !important;color:var(--rs-muted) !important;line-height:1.45}
.modal .grpset{border:1px solid var(--rs-line);border-radius:8px;padding:12px 14px;margin-bottom:12px;background:#fafaf8}
.modal .grpset > b{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--rs-muted);font-weight:600;margin-bottom:8px}
.modal label{font-size:11.5px;color:var(--rs-muted);margin:8px 0 4px}
.modal input:not([type=checkbox]):not([type=radio]):not([type=file]),.modal select,.modal textarea{height:30px;border:1px solid var(--rs-field) !important;
  border-radius:5px !important;padding:0 8px;font:inherit;font-size:13px;color:var(--rs-text);background:#fff}
.modal textarea{height:auto;padding:6px 8px !important;line-height:1.4}
.modal input[type=file]{font:inherit;font-size:12.5px;border:0;padding:0;width:100%}
.modal input:focus-visible,.modal select:focus-visible,.modal textarea:focus-visible{outline:2px solid var(--rs-accent);outline-offset:1px}
.modal input[type=checkbox]{accent-color:var(--rs-accent)}
.modal .ok{color:var(--rs-ok);font-size:12px}
.modal .actions{margin-top:14px;gap:8px}
/* кнопки окон — как .btn шапки; основная — синяя (.btn.primary), «Удалить» — красный текст */
.modal .actions button,#mapload,.modal .seg button{display:inline-flex;align-items:center;height:32px;padding:0 14px !important;
  border:1px solid var(--rs-field) !important;background:#fff !important;color:var(--rs-text) !important;border-radius:6px !important;
  font:inherit;font-size:13px;cursor:pointer;white-space:nowrap}
.modal .actions button:not([disabled]):not(:active):hover,#mapload:not([disabled]):not(:active):hover,.modal .seg button:not([disabled]):not(:active):hover{background:#f3f3ef !important;border-color:#c9c9c3 !important}   /* 24.09.2026 (#46, вариант Б): + рамка темнее; нажатие — в style.css */
#cv_save,#note_save,#pn_save,#ue_save,#drrsave,#utmupload{background:var(--rs-accent) !important;border-color:var(--rs-accent) !important;color:#fff !important;
  height:32px;padding:0 14px !important;border-radius:6px !important;font:inherit;font-size:13px;cursor:pointer}
#cv_save:not([disabled]):not(:active):hover,#note_save:not([disabled]):not(:active):hover,#pn_save:not([disabled]):not(:active):hover,#ue_save:not([disabled]):not(:active):hover,#drrsave:not([disabled]):not(:active):hover,#utmupload:not([disabled]):not(:active):hover{background:#2f61cc !important;border-color:#2f61cc !important}   /* 24.09.2026 (#46, вариант Б): светлее, было темнее #163a88 */
#ue_del{color:#a8231b !important;border-color:#e8c4bf !important}
#ue_del:hover{background:var(--rs-bad-soft) !important}
.modal .seg{margin:0 0 10px}
/* крестик */
.modal-x{top:12px;right:12px;width:30px;height:30px;font-size:22px;color:var(--rs-muted);border-radius:6px}
.modal-x:hover{background:#f0f0ec;color:var(--rs-text)}
/* таблицы в окнах: без закрепления первого столбца и без обрезки «…» (это правила таблицы листа), строки — по макету */
.modal table{table-layout:auto;border-collapse:collapse;font-size:12.5px}
.modal th,.modal td,.modal tbody td:first-child,.modal thead th:first-child{position:static;width:auto;min-width:0;max-width:none;height:auto;
  border:0;border-bottom:1px solid var(--rs-line2);padding:5px 8px;font-size:12.5px;font-weight:400;background:none;white-space:normal;
  overflow:visible;text-overflow:clip;vertical-align:top}
.modal thead th,.modal thead th:first-child{background:var(--rs-head);color:#33373d;font-weight:600;font-size:11.5px;border-bottom:1px solid var(--rs-line)}
/* «Видимость столбцов»: шапка блока — цвет блока из данных (встроенный стиль), рамки и строки — палитра макета */
#cv_list{font-size:12.5px}
.cvgrp{border:1px solid var(--rs-line);border-radius:8px}
.cvgrp-h{padding:5px 10px;font-size:12px;border-bottom:1px solid rgba(0,0,0,.08)}
.cvgrp-h b{font-weight:600}
.cvcol{padding:3px 10px 3px 26px;line-height:1.35}
.cvcol:hover{background:#f6f6f2}
/* «Описание колонок» */
dl.docs{font-size:12.5px}
dl.docs dt{font-weight:600;margin-top:12px;color:var(--rs-text)}
dl.docs dd{color:var(--rs-muted2);line-height:1.45;margin-top:3px}
/* «История правок» */
#hist_list{font-size:12.5px !important}
#hist_list tr.undone td{color:#a3a7ad}
/* «Лог сверки»: тип 1 — желтый (ручная сохранена), тип 2 — синий (изменено синхронизацией), согласовано — серо-зеленый */
table.conf{font-size:12px}
table.conf th,table.conf td{border:0;border-bottom:1px solid var(--rs-line2)}
table.conf th{background:var(--rs-head)}
table.conf td:first-child{white-space:nowrap}
table.conf tr.k1 td{background:#fff3cd}
table.conf tr.k2 td{background:var(--rs-accent-soft)}
table.conf tr.ack td{background:#f1f5ee;color:#8a8e95}
#conf_ack_wrap{font-size:12px}
#conf_ack{height:30px;padding:0 12px !important;border-radius:6px !important;background:var(--rs-ok) !important;border-color:var(--rs-ok) !important;font:inherit;font-size:12.5px}
/* «Настройки»: списки привязки — поля и выпадающие списки по макету */
#maparea{font-size:12px !important}
#maparea > b{display:block;margin:10px 0 4px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--rs-muted);font-weight:600}
#maparea select,#maparea input{height:28px;font-size:12.5px}
/* столбец с номером и именем кампании WB — шире (без прежних 168 px первого столбца поле имени сжималось) */
#maparea table td:first-child{width:46%}

/* ───────── вход ───────── */
#loginbox{background:var(--rs-bg)}
#loginform{border:1px solid var(--rs-line);border-radius:8px;box-shadow:0 10px 30px rgba(20,20,19,.16);padding:28px 30px 24px;width:340px;gap:10px}
/* логотип — картинкой над подписью (из того же каталога, что и стили); сама подпись в разметке — текстом с эмодзи */
#loginform .li-logo::before{content:"";display:block;height:30px;margin-bottom:14px;background:url(logo.png) no-repeat left center/contain}
#loginform .li-logo{font-size:17px;font-weight:600}
#loginform .li-sub{font-size:12.5px;color:var(--rs-muted);margin-bottom:8px}
#loginform input{height:36px;padding:0 10px;border:1px solid var(--rs-field);border-radius:6px;font:inherit;font-size:13.5px;color:var(--rs-text)}
#loginform input:focus-visible{outline:2px solid var(--rs-accent);outline-offset:1px}
#loginform button{height:36px;padding:0;margin-top:4px;background:var(--rs-accent);border-radius:6px;font:inherit;font-size:14px;font-weight:600}
#loginform button:not([disabled]):not(:active):hover{background:#2f61cc}   /* 24.09.2026 (#46, вариант Б): светлее, было темнее #163a88 */
#loginform .li-err{color:var(--rs-bad)}

/* ───────── разделы «Еще» (в #content, блок .placeholder) ───────── */
.placeholder{padding:24px 28px;font-size:13px;color:var(--rs-text)}
.placeholder h2{font-size:18px;font-weight:600;margin-bottom:6px}
.placeholder h3{font-weight:600}
.placeholder > p{color:var(--rs-muted) !important}
/* таблицы разделов: шрифт страницы (у таблицы листа до этапа 2 — прежний), линии и шапка по макету */
.placeholder table{font-family:inherit;border-collapse:separate;border-spacing:0;background:#fff}
.placeholder th,.placeholder td{border-right:1px solid var(--rs-line2);border-bottom:1px solid var(--rs-line2);font-size:12.5px;height:26px;
  font-variant-numeric:tabular-nums}
.placeholder thead th{background:var(--rs-head);color:#33373d;font-weight:600;font-size:11.5px;height:auto;padding:6px 10px;
  border-bottom:1px solid var(--rs-line)}
.placeholder thead tr.grp th{height:30px;font-size:12.5px;top:0}
.placeholder thead tr.met:first-child th{top:0}
.placeholder thead tr.grp + tr.met th{top:30px}
/* строка подписей столбцов — по высоте текста (у таблицы листа 56 px), угол — не желтый, как у таблицы листа */
.placeholder thead tr.met th{height:auto;font-size:11.5px}
.placeholder thead tr.met th:first-child{background:var(--rs-head)}
.placeholder tbody td:first-child,.placeholder thead th:first-child{border-right:1px solid var(--rs-line);font-weight:500}
.placeholder tbody tr:hover td{box-shadow:inset 0 0 0 9999px rgba(31,79,184,.05)}
/* 26.10.2026 (#191): значки типа столбца в заголовках таблиц разделов («Повторные покупатели») — как у листов (grid.css .gt .r-head .col-ic) */
.placeholder thead .col-ic{display:inline-block;vertical-align:-2px;margin-right:3px;color:#6f737a;opacity:.5}
/* 26.10.2026 (#191): «Повторные покупатели» — первый столбец по ширине «Сентябрь 2026 · неполный» (у таблиц листов он 168 px с многоточием,
   style.css), пустой угол над «Месяц» — цвета шапки, а не желтый угол листа */
.placeholder.rpt tbody td:first-child,.placeholder.rpt thead th:first-child{width:auto;max-width:none}
.placeholder.rpt thead tr.grp th:first-child{background:var(--rs-head)}
/* «Посевы»: карточки показателей и столбики расхода */
.kpi{border:1px solid var(--rs-line);border-radius:8px;box-shadow:none;padding:12px 14px}
.kpi-v{font-size:20px;font-weight:600;font-variant-numeric:tabular-nums}
.kpi-l{font-size:10.5px;color:var(--rs-muted);letter-spacing:.07em;font-weight:600}
.kpi.good .kpi-v{color:var(--rs-ok)}
.kpi.bad .kpi-v{color:var(--rs-bad)}
.seedchart{border-bottom:1px solid var(--rs-line)}
.seedchart .sbar{background:var(--rs-accent);border-radius:2px 2px 0 0}
.seedchart .sbar:hover{filter:none;background:var(--rs-accent-dark)}
table.mini tr.best td{background:var(--rs-ok-soft);font-weight:600}
/* «Баннеры»: переключатель «Контекст / Таргет» — сегмент, как «Группировка» в шапке */
.placeholder .seg{display:inline-flex;padding:2px;background:#ebebe6;border-radius:7px;gap:2px;margin:6px 0 12px}
.placeholder .seg button{height:28px;padding:0 12px;border:0;background:transparent;border-radius:5px;font:inherit;font-size:13px;color:#4a4e55;cursor:pointer}
.placeholder .seg button:hover{color:var(--rs-text)}
.placeholder .seg button.on{background:#fff;color:var(--rs-text);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.14);border:0}
/* «Карта меток»: строки ссылок, «Копировать», формы добавления и конструктора */
table.utm td{border-color:var(--rs-line2)}
.utm-url-in{color:var(--rs-accent)}
tr.utm-row:hover td{background:#f5f8fd}
button.copy{height:26px;padding:0 10px;border:1px solid var(--rs-field);background:#fff;border-radius:5px;font:inherit;font-size:12px;color:var(--rs-text)}
button.copy:not([disabled]):not(:active):hover{background:#f3f3ef;border-color:#c9c9c3}   /* 24.09.2026 (#46, вариант Б): + рамка темнее */
.utmgen{border:1px solid var(--rs-line);border-radius:8px;padding:14px;background:#fafaf8;gap:8px}
.utmgen label{font-size:11.5px;color:var(--rs-muted)}
.utmgen input{height:30px;padding:0 8px;border:1px solid var(--rs-field);border-radius:5px;font:inherit;font-size:13px;margin-top:4px}
.utmgen button:not(.copy){height:32px;padding:0 16px;border:1px solid var(--rs-accent);background:var(--rs-accent);border-radius:6px;font:inherit;font-size:13px}
.utmgen button:not(.copy):not([disabled]):not(:active):hover{background:#2f61cc;border-color:#2f61cc}   /* 24.09.2026 (#46, вариант Б): светлее */
/* «Сравнение периодов» */
.cmpbar{gap:8px;font-size:13px}
.cmpbar input{height:30px;padding:0 8px;border:1px solid var(--rs-field);border-radius:5px;font:inherit;font-size:13px}
.cmpbar button{height:32px;padding:0 16px;border:1px solid var(--rs-accent);background:var(--rs-accent);border-radius:6px;font:inherit;font-size:13px}
.cmpbar button:not([disabled]):not(:active):hover{background:#2f61cc;border-color:#2f61cc}   /* 24.09.2026 (#46, вариант Б): светлее */
table.cmp tr.grp-top td{border-top:2px solid #c9c9c3}
table.cmp td[rowspan]{white-space:normal;vertical-align:top;padding-top:8px}
.up{color:var(--rs-ok);font-weight:600}
.down{color:var(--rs-bad);font-weight:600}
/* «АВ-тесты» */
.abcard{border:1px solid var(--rs-line);border-radius:8px;padding:10px 12px}
.abcard .abdate{font-weight:600;color:#33373d}

/* ───────── плашки под шапкой (#46, новая версия макета: HeaderStates.dc.html, раздел 2) ─────────
   Область #banners (app.js, renderBanners): плашка 36 px, значок слева, текст в одну строку с «…», действия справа.
   Цвета — из README: красная — сбой сбора и «не прочитана настройка столбцов», янтарная — подписи недель, светло-желтая — нет блока. */
#banners{flex-shrink:0;position:relative;z-index:3}
.ban{display:flex;align-items:center;gap:10px;height:36px;padding:0 16px;font-size:13px;border-bottom:1px solid;min-width:0;cursor:default}
.ban .ic{display:flex;flex-shrink:0}
.ban .txt{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ban .txt b{font-weight:600}
.ban .lnk,.stack-more .lnk,.ban-why .lnk{flex-shrink:0;border:0;background:transparent;padding:0;font:inherit;font-weight:500;white-space:nowrap;color:inherit;
  text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.ban .x{flex-shrink:0;width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;border:0;background:transparent;
  border-radius:4px;cursor:pointer;opacity:.7;color:inherit;padding:0}
.ban .x:hover{opacity:1;background:rgba(0,0,0,.06)}
.ban .lnk:focus-visible,.ban .x:focus-visible,.stack-more .lnk:focus-visible,.ban-why .lnk:focus-visible{outline:2px solid #1f4fb8;outline-offset:1px}
.ban-red{background:#fdecea;border-color:#f3c7c2;color:#8c1d15}
.ban-amb{background:#fff1d6;border-color:#f0d49a;color:#6f4300}
.ban-yel{background:#fffbe6;border-color:#eee2a4;color:#5a4700}
.ban .more,.ban-why .more{flex-shrink:0;font-size:12px;font-weight:600;background:rgba(0,0,0,.07);border-radius:9px;padding:0 7px;line-height:18px;white-space:nowrap}   /* 12.10.2026 (#122): + список причин */
/* список под плашкой: две колонки сверху вниз (число строк задает app.js), до 8 строк на экране — дальше прокрутка */
.ban-list{display:grid;grid-auto-flow:column;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:32px;padding:8px 16px 10px 42px;
  font-size:12.5px;line-height:1.7;max-height:188px;overflow-y:auto;border-bottom:1px solid}
.ban-list > div{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ban-list.red{background:#fdecea;border-color:#f3c7c2;color:#8c1d15}
.ban-list.amb{background:#fff1d6;border-color:#f0d49a;color:#6f4300}
.ban-list.yel{background:#fffbe6;border-color:#eee2a4;color:#5a4700}
.stack-more{display:flex;align-items:center;gap:6px;height:26px;padding:0 16px 0 42px;font-size:12px;color:#5a5e65;background:#fafaf8;
  border-bottom:1px solid #e4e4df}
.stack-more .lnk{color:#1f4fb8;font-weight:400}
/* 12.10.2026 (change-set 2026-10-12_02, #122, владелец: «давай реализуем чтобы в плашке сбора отобралась причина, HTTP код ответа и тд»):
   причины сбоя списком под красной плашкой (README дизайнера «Синхронизация: сбой — причины списком под плашкой», п. 1, 2, 9; снимки 53).
   Поведение .ban-list (12,5 px, межстрочный 1,7, слева 42 px), фон и линия — как у .ban-red; строка — две колонки «шаг | причина»,
   точка списка 5 px в поле слева; «…» и data-tip — только у обрезанной колонки (app.js whyTips); курсор обычный (решение владельца).
   «Подробнее» — сразу после текста, только у плашки сбоя (у остальных плашек действия справа, как было). */
#syncbanner .txt{flex:0 1 auto}
#sheeterr .txt{flex:0 1 auto}   /* 23.10.2026 (README «Загрузка таблицы: каркас с бликом» п. 5): «Повторить» — сразу после текста, как «Подробнее» */
/* 12.10.2026 (владелец: «кнопку скрыть … там где раньше была кнопка подробнее» → «Крестик до след. сбора»): крестик плашки сбоя — у правого
   края (текст не растягивается — без отступа auto крестик встал бы сразу за «Подробнее») */
#syncbanner .x{margin-left:auto}
/* 12.10.2026 (владелец: «почему так много "воздуха" между плашкой сбоя и перечислением того где сбой?»): строка плашки по макету — 36 px с
   текстом по центру, под текстом ≈ 9 px пустоты, у списка еще 4 px сверху — от текста до первой причины было 15,3 px против 5,3 px между
   причинами. Когда под плашкой список — строка по содержимому (сверху 6 px: текст на прежнем месте), у списка сверху 1 px: 6,8 px */
#syncbanner:has(+ .ban-why){height:auto;padding-top:6px;padding-bottom:0}
#syncbanner + .ban-why{padding-top:1px}
/* 12.10.2026 (владелец: «кнопку "Обновить сейчас" можно также перенести ближе к концу предложения как в сбое синхронизации кнопка
   подробнее»): у плашки «Вышла новая версия дашборда» действие — тоже сразу после текста */
#verbanner .txt{flex:0 1 auto}
.ban-why{padding:4px 16px 8px 42px;margin-top:-1px;background:#fdecea;border-bottom:1px solid #f3c7c2;color:#8c1d15;font-size:12.5px;
  line-height:1.7;cursor:default}
.ban-why.open{max-height:188px;overflow-y:auto}
.ban-why [data-tip]{cursor:default}
.why-grid{display:grid;grid-template-columns:fit-content(240px) minmax(0,1fr);column-gap:14px}
.why-st{font-weight:600;white-space:nowrap;position:relative;min-width:0}   /* min-width:0 — иначе fit-content(240px) не ужимает длинный шаг */
.why-st > span{display:block;overflow:hidden;text-overflow:ellipsis}
.why-st::before{content:"";position:absolute;left:-14px;top:calc(50% - 2.5px);width:5px;height:5px;border-radius:50%;background:currentColor}
.why-tx{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.why-tx .wh{font-weight:500}
.why-tx .ex{opacity:.75}
.why-more{display:flex;align-items:center;gap:8px}
@media (max-width:759px){
  .ban-why{padding-bottom:10px;line-height:1.45}
  .why-grid{display:block}
  .why-st{white-space:normal;margin-top:6px}
  .why-st::before{top:7px}
  .why-tx{white-space:normal;overflow:visible}
  .why-more{margin-top:6px}
  .ban-why.open{max-height:none}
}

/* ───────── статус «Обновлено…» в шапке (#46, новая версия макета: HeaderStates.dc.html, раздел 1) ─────────
   Классы ставит setSyncBadge (app.js): ok / run / old / bad / none. Полный текст — #synctext.full, короткий — .short (скрыт;
   на узком экране стили шапки показывают .short вместо .full и прячут #syncstatus). Полный текст всегда в подсказке (title). */
.bar1 .sync{min-width:0;max-width:280px;color:#5a5e65;font-weight:400}
.bar1 .sync .full{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar1 .sync .short{display:none;white-space:nowrap}
.bar1 .sync i,.bar1 .sync.ok i{background:#2e9e5b}
.bar1 .sync.run i{background:#e0a100;animation:syncPulse 1.4s ease-in-out infinite}
@keyframes syncPulse{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion: reduce){.bar1 .sync.run i{animation:none}}
.bar1 .sync.old i{background:#d9730d}
.bar1 .sync.old{color:#8a4b0a}
.bar1 .sync.bad i{background:#c0392b}
.bar1 .sync.bad{color:#a3261c;font-weight:500}
.bar1 .sync.none i{background:#a3a7ad}
/* ход сбора — справа от значка: текущий шаг, не шире 230 px */
.bar1 .syncstatus{max-width:230px;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar1 .syncstatus.run{color:#8a6d1a}
.bar1 .syncstatus.ok{color:#1d7a45}
.bar1 .syncstatus.err{color:#a3261c}

/* ───────── подсказки ───────── */
/* всплывающая подсказка — темная, как .tip в States.dc.html */
#tip{background:var(--rs-text);font-size:12px;line-height:1.4;padding:6px 9px;border-radius:5px;max-width:320px;box-shadow:0 8px 24px rgba(20,20,19,.2)}
/* строка под полем ввода в ячейке — как в макете «Ввод в ячейке» (светло-синяя); предупреждение — янтарная, ошибка — красная */
.cell-hint{background:var(--rs-accent-soft);color:#173c8c;border:1px solid #c9d6f0;border-radius:5px;box-shadow:0 4px 12px rgba(20,20,19,.12);
  font-size:11.5px;padding:3px 8px}
.cell-hint.warn{background:var(--rs-warn-soft);color:var(--rs-warn);border-color:#f1cfb0}
.cell-hint.err{background:var(--rs-bad-soft);color:var(--rs-bad);border-color:#f3c4bd;font-weight:500}

/* ───────── значки Lucide вместо эмодзи (#46, порция 3; README «Иконки в интерфейсе»): 16 px, stroke-width 2 (с 24.09, было 1.5), цвет — от текста ───────── */
svg.lu{display:inline-block;vertical-align:-3px;flex-shrink:0;margin-right:4px}
button.copy svg.lu,#conf_ack svg.lu{margin-right:5px}
table.mini tr.best svg.lu{color:#1d7a45;margin:0 0 0 2px}

/* ───────── окно «Обновить данные» и ↻ во время сбора (24.09.2026, #46, вторая версия макета: WB.dc.html «refresh»/«running»,
   README «Кнопка „Обновить данные“ и окно подтверждения») ─────────
   Вместо браузерного confirm(). Разметка — #refreshdlg в index.html, открывает и закрывает app.js (initRefresh). Появление — как у
   меню: конечный кадр = обычный стиль (translateY(0), не none — иначе текст «прыгает»), закрытие мгновенное (hidden), при
   «уменьшить движение» — без анимации. Кнопки окна — классы страницы: .btn, .btn.primary, крестик .btn.ghost.ib. */
#refreshdlg,#wbfundlg,#notedlg,#pnotedlg{position:fixed;inset:0;z-index:60;background:rgba(28,30,34,.32);display:flex;align-items:center;justify-content:center;
  padding:16px;animation:rfOvlIn .16s ease-out both}   /* 24.09.2026: ровно по центру по высоте (владелец; у дизайнера — 168 px сверху) */
#refreshdlg[hidden],#wbfundlg[hidden],#notedlg[hidden],#pnotedlg[hidden]{display:none}
@keyframes rfOvlIn{from{opacity:0}to{opacity:1}}
#refreshdlg .rf-dlg,#wbfundlg .rf-dlg,#notedlg .rf-dlg,#pnotedlg .rf-dlg{width:440px;background:#ffffff;border-radius:10px;box-shadow:0 24px 60px rgba(20,20,19,.24),0 0 0 1px rgba(20,20,19,.06);
  transform:translateY(0);animation:rfDlgIn .18s cubic-bezier(.2,.8,.3,1) both;color:#1c1e22;outline:none}
@keyframes rfDlgIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
/* 29.09.2026 (владелец: «окно закрывается резко а не плавно как остальные»): закрытие — как «Показать все столбцы?» (columns.css
   #colalldlg.closing; README «Окна: появление и закрытие»): затемнение 0,12 с, карточка 0,14 с вниз на 8 px. Класс .closing ставит и
   снимает app.js (initRefresh closeDlg), через 140 мс окно скрывается. */
#refreshdlg.closing,#wbfundlg.closing,#notedlg.closing,#pnotedlg.closing{animation:rfOvlOut .12s ease-in both}
#refreshdlg.closing .rf-dlg,#wbfundlg.closing .rf-dlg,#notedlg.closing .rf-dlg,#pnotedlg.closing .rf-dlg{animation:rfDlgOut .14s cubic-bezier(.4,0,1,1) both}
@keyframes rfOvlOut{from{opacity:1}to{opacity:0}}
@keyframes rfDlgOut{from{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(8px)}}
/* 01.10.2026 (владелец: «почему ты не переиспользуешь код?»): окна старого вида (.modal-bg — Настройки, Описание колонок, Показы WB, История
   правок, Заметки, Редактирование ссылки, Лог сверки) закрываются так же, как «Обновить»: те же кадры; класс ставит app.js animClose */
.modal-bg.closing{animation:rfOvlOut .12s ease-in both;pointer-events:none}
.modal-bg.closing .modal{animation:rfDlgOut .14s cubic-bezier(.4,0,1,1) both}
/* 02.10.2026 (TODO #83, владелец: окно заметок «появляется резко без анимации»): окна старого вида и появляются, как «Обновить» —
   кадры rfOvlIn / rfDlgIn с теми же сроками; запускает их переход display:none → flex (app.js modalShow); правила .closing выше
   сильнее (класс + класс) — закрытие прежнее. «Меньше движения» — сразу, без анимации. */
.modal-bg{animation:rfOvlIn .16s ease-out both}
.modal-bg .modal{animation:rfDlgIn .18s cubic-bezier(.2,.8,.3,1) both}
@media (prefers-reduced-motion: reduce){.modal-bg,.modal-bg .modal{animation:none}}
/* 02.10.2026 (TODO #83): кнопка-карандаш заметки (app.js notePenHTML) — как стрелка «Товаров» (products.css .tgb): без рамки, 20×20,
   скругление 4, серый фон при наведении; значок — карандаш строки «Правка» шапки, цвет #8a8e95. Пока мышь не над ячейкой — прозрачная
   (место и показ при наведении — grid.css, products.css); с клавиатуры (фокус) видна всегда. */
.npen{width:20px;height:20px;border:0;background:transparent;border-radius:4px;display:flex;align-items:center;justify-content:center;
  color:#8a8e95;cursor:pointer;flex-shrink:0;padding:0;font:inherit;opacity:0;transition:opacity .12s ease-out,background-color .14s ease-out,color .14s ease-out}
/* 02.10.2026 (TODO #83, макет «Заметки» п. 1): наведение на карандаш — фон #f0f0ec и значок #33373d, нажатие — #ebebe6 без перехода; место у
   даты — 8 px от правого края (замер 02.10, 1536 и 1366: при 6 px сайта карандаш на 1 px заходил на уголок заметки; при 10 px макета —
   в 1 px от дня недели: ячейка даты на сайте уже, чем в макете; при 8 px уголок не перекрыт, до текста 3 px). Место в «Заметках» (2 px,
   белая подложка) и у названия «Товаров» (перед точками площадок, после артикула) — как было. */
.npen:hover{background:#f0f0ec;color:#33373d}
.npen:active{background:#ebebe6;transition-duration:0s}
.npen:focus-visible{opacity:1;outline:2px solid #1f4fb8;outline-offset:1px}
.gt .r > .fc > .npen{right:8px}
.gt .r > .c-note > .npen:hover{background:#f0f0ec}
.gt .r > .c-note > .npen:active{background:#ebebe6}
@media (prefers-reduced-motion: reduce){.npen{transition:none}}
:where(#refreshdlg,#wbfundlg,#notedlg,#pnotedlg) button{font:inherit}
#refreshdlg button:focus-visible,#wbfundlg button:focus-visible,#notedlg button:focus-visible,#pnotedlg button:focus-visible{outline:2px solid #1f4fb8;outline-offset:2px}
#refreshdlg .rf-dlg-h,#wbfundlg .rf-dlg-h,#notedlg .rf-dlg-h,#pnotedlg .rf-dlg-h{display:flex;align-items:flex-start;gap:12px;padding:20px 20px 0 24px}
#refreshdlg .rf-dlg-h h2,#wbfundlg .rf-dlg-h h2,#notedlg .rf-dlg-h h2,#pnotedlg .rf-dlg-h h2{margin:0;font-size:16px;font-weight:600;line-height:24px;flex-grow:1}
#refreshdlg .rf-dlg-h .btn,#wbfundlg .rf-dlg-h .btn,#notedlg .rf-dlg-h .btn,#pnotedlg .rf-dlg-h .btn{margin:-4px -4px 0 0;color:#6f737a;flex-shrink:0}
#refreshdlg .rf-dlg-b{padding:8px 24px 20px;font-size:13px;line-height:20px;color:#3c4046}
#refreshdlg .rf-dlg-b p{margin:0 0 14px}
#refreshdlg .rf-facts{display:flex;flex-direction:column;gap:8px;margin:0;padding:12px 14px;list-style:none;background:#f7f7f4;border-radius:8px}
#refreshdlg .rf-facts li{display:flex;align-items:center;gap:10px}
#refreshdlg .rf-facts svg{color:#6f737a;flex-shrink:0}
#refreshdlg .rf-facts .muted{color:#6f737a}
#refreshdlg .rf-dlg-f,#wbfundlg .rf-dlg-f,#notedlg .rf-dlg-f,#pnotedlg .rf-dlg-f{display:flex;justify-content:flex-end;gap:8px;padding:14px 20px;border-top:1px solid #ebebe6}
#refreshdlg .btn.primary,#wbfundlg .btn.primary,#notedlg .btn.primary,#pnotedlg .btn.primary{align-self:auto;font-weight:500;padding:0 14px}
/* «Последний сбор … с ошибкой: …» (третья версия макета, снимок 17b): circle-alert вместо history, иконка и текст #a3261c; длинный
   список площадок переносится на вторую строку */
#refreshdlg .rf-last .i-err{display:none}
#refreshdlg .rf-last.err .i-ok{display:none}
#refreshdlg .rf-last.err .i-err{display:block}
#refreshdlg .rf-last.err svg,#refreshdlg .rf-last.err .muted{color:#a3261c}
/* ↻ во время сбора: заблокирована (значок серый — .btn[disabled]), фон белый, рамка #e2e2dc; иконка крутится 360° за 1 с линейно.
   Класс spin и подсказку «Сбор уже идет» ставит app.js (initRefresh, setBusy). */
#refreshbtn[disabled],#wbfunbtn[disabled]{border-color:#e2e2dc;background:#ffffff}
#refreshbtn.spin svg{animation:rfSpin 1s linear infinite}
@keyframes rfSpin{to{transform:rotate(360deg)}}
/* 12.10.2026 (владелец: «вместо вращающейся стрелки сделаем эту анимацию: import/tube-spinner.svg только чтобы крутилась по часовой… и цвет
   под наш проект»): во время сбора вместо стрелки — спиннер «трубка» (index.html, .rf-tube): по часовой (rfSpin — к 360°), оборот за 2 с, как
   в образце; цвет — акцент проекта (у неактивной кнопки серый только значок-стрелка). «Меньше движения» — правило ниже (svg без анимации). */
#refreshbtn .rf-tube{display:none}
#refreshbtn.spin .rf-ico{display:none}
#refreshbtn.spin .rf-tube{display:block;animation-duration:2s}
#refreshbtn .rf-tube stop{stop-color:var(--rs-accent)}
#refreshbtn .rf-tube-trk{stroke:var(--rs-accent)}
/* итог сбора, запущенного не кнопкой (ночной, догон): «сбор завершен» — нейтральным, успех или сбой показывает статус слева */
.bar1 .syncstatus.done{color:#5a5e65}
/* счетчик шагов «6 из 11» между «Обновляю…» и шагом (третья версия макета: #6f737a, tabular-nums; элемент создает app.js). Отступы
   -4px — чтобы между «Обновляю…», счетчиком и шагом было 8 px, как в макете (у шапки промежуток 12 px). На узком экране (≤1439,
   компактный статус) счетчик прячется вместе с шагом — шаг и номер остаются в подсказке статуса. */
.bar1 .syncnum{color:#6f737a;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap;margin:0 -4px;flex-shrink:0}
.bar1 .syncnum[hidden]{display:none}
@media (prefers-reduced-motion: reduce){#refreshdlg,#refreshdlg .rf-dlg,#refreshdlg.closing,#refreshdlg.closing .rf-dlg,#refreshbtn.spin svg{animation:none}}

/* ───────── 01.10.2026: «Показы WB» — кнопка и окно итога загрузки (макет WBShows.dc.html / WBShowsStates.dc.html, README «Показы WB» §1–5;
   поправки docs/wb-shows/DESIGN_REVIEW.md; договор docs/wb-shows/CONTRACT.md) ─────────
   Кнопка — обычная .btn шапки (style.css; только значок — шаг «шапки 06.10» там же). Идет загрузка — disabled + .busy: upload спрятан,
   loader-circle крутится (кадры rfSpin, как ↻ во время сбора), подпись остается — ширина та же; неактивная — тот вид, что у ↻ во время
   сбора (#refreshbtn[disabled] выше). Точка «за вчера показы не загружены» — как у «Помощника» (ai.css #aibtn .ai-new), оранжевая; у
   неактивной (идет загрузка, зритель) — не видна. Классы wbf-busy / wbf-dot ставит app.js wbfBtnUpdate (имена .busy / .dot макета на сайте заняты: .bar1 .dot — 9 px). */
#wbfunbtn{position:relative}
#wbfunbtn .wbf-ld{display:none}
#wbfunbtn.wbf-busy .wbf-up{display:none}
#wbfunbtn.wbf-busy .wbf-ld{display:block;animation:rfSpin 1s linear infinite}
#wbfunbtn .wbf-mark{position:absolute;top:-3px;right:-3px;width:9px;height:9px;border-radius:50%;background:#d9730d;box-shadow:0 0 0 2px #ffffff;display:none}
#wbfunbtn.wbf-dot .wbf-mark{display:block}
#wbfunbtn[disabled] .wbf-mark{display:none}
/* окно: общее с «Обновить» — выше (#refreshdlg,#wbfundlg); свое — 520 px, ровно по центру с полями 24 px (max-height: 100vh − 48 px),
   тело прокручивается (шапка и низ на месте; прокрутка не уходит на страницу — overscroll-behavior), смена высоты — app.js (WAAPI 0,2 с) */
#wbfundlg,#notedlg,#pnotedlg{padding:24px}
#wbfundlg .rf-dlg,#notedlg .rf-dlg,#pnotedlg .rf-dlg{width:520px;max-width:100%;max-height:100%;display:flex;flex-direction:column;overflow:hidden}
#wbfundlg .rf-dlg-h,#wbfundlg .rf-dlg-f,#notedlg .rf-dlg-h,#notedlg .rf-dlg-f,#pnotedlg .rf-dlg-h,#pnotedlg .rf-dlg-f{flex-shrink:0}
#wbfundlg .rf-dlg-b,#notedlg .rf-dlg-b,#pnotedlg .rf-dlg-b{padding:6px 24px 20px;overflow:auto;min-height:0;flex:1 1 auto;overscroll-behavior:contain}
#wbfundlg .wbf-lead{margin:0 0 14px;font-size:13px;line-height:20px;color:#3c4046;display:flex;gap:8px;align-items:flex-start}
#wbfundlg .wbf-lead .ld{color:#6f737a;margin-top:2px;flex-shrink:0;animation:rfSpin 1s linear infinite}
#wbfundlg .wbf-fl{border:1px solid #e4e4df;border-radius:8px;overflow:hidden}
#wbfundlg .wbf-fr{display:grid;grid-template-columns:16px minmax(0,1fr);column-gap:10px;padding:10px 12px 11px;border-top:1px solid #ebebe6}
#wbfundlg .wbf-fr:first-child{border-top:0}
#wbfundlg .wbf-fr.bad{background:#fdecea;border-top-color:#f3c7c2}
#wbfundlg .wbf-fr.bad + .wbf-fr{border-top-color:#f3c7c2}
#wbfundlg .wbf-fr.wait,#wbfundlg .wbf-fr.plain{padding:8px 12px}
#wbfundlg .wbf-c{min-width:0}
#wbfundlg .fi{height:20px;display:flex;align-items:center}
#wbfundlg .fi svg{display:block}
#wbfundlg .fi .ok{color:#2e9e5b}
#wbfundlg .fi .bad{color:#c0392b}
#wbfundlg .fi .gray{color:#8a8e95}
#wbfundlg .fi .q{width:15px;height:15px;border-radius:50%;background:#d9730d;color:#ffffff;font-size:10.5px;font-weight:700;line-height:15px;text-align:center;display:block;margin-left:.5px;font-style:normal}
#wbfundlg .fh{display:flex;align-items:baseline;gap:6px;min-width:0;line-height:20px;font-size:13px;color:#1c1e22}
#wbfundlg .fh .fn{font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums}
#wbfundlg .fh .fn.fname{font-weight:500;overflow:hidden;text-overflow:ellipsis;min-width:0}
#wbfundlg .wbf-fr.wait .fn.fname,#wbfundlg .wbf-fr.plain .fn.fname{font-weight:400;color:#33373d}
#wbfundlg .fh .wd{font-size:11px;color:#8a8e95}
#wbfundlg .fh .wd.we{color:#b4473f}
#wbfundlg .fh .fm{margin-left:auto;padding-left:12px;font-size:12px;color:#6f737a;white-space:nowrap;font-variant-numeric:tabular-nums}
#wbfundlg .fh .fm.bad{color:#a3261c;font-weight:500}
#wbfundlg .kv{display:grid;grid-template-columns:92px minmax(0,1fr);column-gap:10px;row-gap:3px;margin-top:4px;font-size:12.5px;line-height:18px}
#wbfundlg .kv .k{color:#8a8e95}
#wbfundlg .kv .k.warn{color:#8a4b0a}
#wbfundlg .kv .v{color:#33373d;font-variant-numeric:tabular-nums;min-width:0;overflow-wrap:anywhere}
#wbfundlg .kv .warn{color:#8a4b0a}
#wbfundlg .kv .v.bad{color:#a3261c;font-weight:500}
#wbfundlg .ff{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:11.5px;line-height:16px;color:#8a8e95;min-width:0}
#wbfundlg .ff span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
#wbfundlg .wbf-note{margin:12px 0 0;display:flex;gap:8px;align-items:flex-start;font-size:12px;line-height:17px;color:#6f737a}
#wbfundlg .wbf-note[hidden]{display:none}
#wbfundlg .wbf-note svg{margin-top:1px;flex-shrink:0}
#wbfundlg .rf-dlg-f .btn.primary svg{color:#ffffff}
@media (prefers-reduced-motion: reduce){#wbfundlg,#wbfundlg .rf-dlg,#wbfundlg.closing,#wbfundlg.closing .rf-dlg,#wbfunbtn.wbf-busy .wbf-ld,#wbfundlg .wbf-lead .ld{animation:none}}
/* 02.10.2026 (TODO #83, макет «Заметки» п. 2; владелец 02.10: «белая карточка … с плавной анимацией появления и исчезновения»): одна белая
   карточка заметок — у даты дня (250 px, текст до 10 строк) и у названия товара / строки площадки (300 px, .wide: серая строка с артикулом и
   номерами, до 3 заметок, «и еще N»). Ставит app.js ncShow; появление 0,12 с, исчезновение — те же 0,12 с (.closing); «меньше движения» — сразу.
   До 02.10 у даты — .gt-notecard (grid.css), у товара — темная подсказка. */
.nd-card{position:fixed;z-index:60;box-sizing:border-box;width:250px;max-width:calc(100vw - 16px);background:#ffffff;border:1px solid #d9d9d3;border-radius:7px;
  box-shadow:0 8px 24px rgba(20,20,19,.14);padding:9px 12px 10px;font:12.5px/1.4 'IBM Plex Sans',system-ui,sans-serif;color:#1c1e22;pointer-events:none;
  animation:ncIn .12s ease-out both}
.nd-card[hidden]{display:none}
.nd-card.wide{width:300px}
.nd-card.closing{animation:ncOut .12s ease-in both}
@keyframes ncIn{from{opacity:0}to{opacity:1}}
@keyframes ncOut{from{opacity:1}to{opacity:0}}
.nd-card .nc-t{white-space:pre-wrap;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:10;overflow:hidden}
.nd-card .nc-id{font-size:11.5px;line-height:16px;color:#8a8e95;padding-bottom:7px;margin-bottom:2px;border-bottom:1px solid #ebebe6;overflow-wrap:anywhere}
.nd-card .nc-it{padding:6px 0 0}
.nd-card .nc-it + .nc-it{margin-top:6px;border-top:1px solid #ebebe6}
.nd-card .nc-d{display:flex;align-items:center;gap:6px;font-size:11.5px;line-height:16px;color:#6f737a;font-weight:500;margin-bottom:2px;font-variant-numeric:tabular-nums}
.nd-card .nc-d .wd{font-weight:400}
.nd-card .nc-d .wd.we{color:#b4473f}
.nd-card .nc-it .nc-t{-webkit-line-clamp:3}
.nd-card .nc-more{margin-top:7px;padding-top:6px;border-top:1px solid #ebebe6;font-size:11.5px;line-height:16px;color:#8a8e95}
@media (prefers-reduced-motion: reduce){.nd-card,.nd-card.closing{animation:none}}
/* ───────── 02.10.2026 (TODO #83): окна заметок по макету (README «Заметки» п. 3–7, CSS п. 9; доски Notes.dc.html, NotesProducts.dc.html) ─────────
   Устройство — окна «Обновить» и «Показы WB» (общие правила выше: #notedlg — заметка ко дню, 440 px; #pnotedlg — заметки к товару, 560 px).
   Разметку тела и низа рисуют app.js (noteDayOpen) и products.js (prodNoteOpen). Классы макета (.ta, .rot, .meta, .note, .sec, .tag …)
   на сайте заняты (.fc.note — уголок даты, .prow.sec — раздел «Товаров») — здесь те же правила с приставкой nd-. Новых цветов нет. */
#notedlg .rf-dlg{width:440px}
#notedlg.closing,#pnotedlg.closing{pointer-events:none}   /* уходящее окно щелчки пропускает (как окна старого вида): открыть снова сразу */
#notedlg .rf-dlg [hidden],#pnotedlg .rf-dlg [hidden]{display:none}   /* строки ошибки, «Изменено …», подсказки — скрытые (display:flex ниже сильнее [hidden] браузера) */
#pnotedlg .rf-dlg{width:560px}
.nd-ovl .nd-ht{flex-grow:1;min-width:0}
.nd-ovl .rf-dlg-h h2{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nd-ovl .nd-hwd{font-size:13px;font-weight:400;color:#8a8e95;margin-left:6px}
.nd-ovl .nd-hwd.we{color:#b4473f}
.nd-ovl .nd-sub{margin:1px 0 0;font-size:12.5px;line-height:18px;color:#6f737a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:400}
#notedlg .rf-dlg-b,#pnotedlg .rf-dlg-b{padding-top:14px;font-size:13px;line-height:20px;color:#1c1e22}   /* сверху 14, а не 6, как у «Показов»: над телом подзаголовок */
/* поле заметки: высота сама по тексту — от 4 строк (98 px) до 10 (218 px), дальше прокрутка (app.js ndFit); уголка растягивания нет */
.nd-ovl .nd-ta{display:block;box-sizing:border-box;width:100%;min-height:98px;max-height:218px;resize:none;border:1px solid #d6d6d0;border-radius:6px;padding:8px 10px;
  margin:0;font:inherit;font-size:13px;line-height:20px;color:#1c1e22;background:#ffffff;outline:none;transition:border-color .14s ease-out,box-shadow .14s ease-out}
.nd-ovl .nd-ta::placeholder{color:#9a9ea5}
.nd-ovl .nd-ta:hover{border-color:#c9c9c3}
.nd-ovl .nd-ta:focus{border-color:#1f4fb8;box-shadow:0 0 0 2px rgba(31,79,184,.15)}
.nd-ovl .nd-ta.err,.nd-ovl .nd-ta.err:focus{border-color:#c0392b;box-shadow:0 0 0 .5px #c0392b}
.nd-ovl .nd-ta[readonly]{cursor:default}
/* только чтение: не поле, а текст на сером */
.nd-ovl .nd-rot{margin:0;padding:8px 10px;background:#fafaf8;border:1px solid #ebebe6;border-radius:6px;font-size:13px;line-height:20px;color:#1c1e22;white-space:pre-wrap;
  overflow-wrap:anywhere;max-height:218px;overflow:auto;outline:none}
.nd-ovl .nd-rot:focus-visible{outline:2px solid #1f4fb8;outline-offset:1px}
.nd-ovl .nd-meta{margin:6px 0 0;font-size:11.5px;line-height:16px;color:#8a8e95;font-variant-numeric:tabular-nums}
.nd-ovl .nd-hint{margin:6px 0 0;font-size:12px;line-height:17px;color:#6f737a}
.nd-ovl .nd-hint.warn{color:#8a4b0a}
.nd-ovl .nd-err{margin:8px 0 0;display:flex;gap:6px;align-items:flex-start;font-size:12.5px;line-height:18px;color:#a3261c}
.nd-ovl .nd-err svg{margin-top:2px;flex-shrink:0}
.nd-ovl .nd-note{margin:12px 0 0;display:flex;gap:8px;align-items:flex-start;font-size:12px;line-height:17px;color:#6f737a}
.nd-ovl .nd-note svg{margin-top:1px;flex-shrink:0}
/* низ окна: «Удалить» слева, «Отмена» / «Закрыть» и основная «Сохранить» справа */
.nd-ovl .rf-dlg-f{align-items:center}
.nd-ovl .nd-sp{flex-grow:1}
.nd-ovl .btn.primary[disabled]{background:#c9d3ea;border-color:#c9d3ea;color:#ffffff;cursor:default}
.nd-ovl .btn.nd-save{min-width:112px;justify-content:center}
.nd-ovl .btn .nd-ld{display:none}
.nd-ovl .btn.busy .nd-ld{display:block;animation:rfSpin 1s linear infinite}
.nd-ovl .btn.busy .nd-tr{display:none}
.nd-ovl .btn.ghost.nd-del{color:#a3261c;padding:0 10px 0 8px}
.nd-ovl .btn.ghost.nd-del:not([disabled]):hover{background:#fdecea;color:#8c1d15}
.nd-ovl .btn.ghost.nd-del[disabled]{color:#d9a7a1}
/* окно товара: список заметок за период (строки — как строки файлов «Показов WB»), форма «Площадка / День» */
#pnotedlg .nd-sec{display:flex;align-items:center;gap:8px;margin:18px 0 8px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:#6f737a;font-weight:600;height:24px}
#pnotedlg .nd-sec:first-child{margin-top:0}
#pnotedlg .nd-lnk{margin-left:auto;display:inline-flex;align-items:center;gap:4px;height:24px;padding:0 6px;border:0;border-radius:5px;background:transparent;color:#1f4fb8;
  font-size:12.5px;font-weight:500;text-transform:none;letter-spacing:0;cursor:pointer;transition:background-color .14s ease-out}
#pnotedlg .nd-lnk:not([disabled]):hover{background:#eaf0fb}
#pnotedlg .nd-lnk[disabled]{color:#b3b5b9;cursor:default}
#pnotedlg .nd-nl{border:1px solid #e4e4df;border-radius:8px;max-height:254px;overflow:auto;overscroll-behavior:contain}
#pnotedlg .nd-nr{display:grid;grid-template-columns:minmax(0,1fr) 28px;column-gap:8px;padding:9px 8px 10px 12px;border-top:1px solid #ebebe6;transition:background-color .14s ease-out}
#pnotedlg .nd-nr:first-child{border-top:0}
#pnotedlg .nd-nr.ro{grid-template-columns:minmax(0,1fr);padding-right:12px}
#pnotedlg .nd-nr.sel{background:#eaf0fb;border-top-color:#c9d6f0}
#pnotedlg .nd-nr.sel + .nd-nr{border-top-color:#c9d6f0}
#pnotedlg .nd-nr.fresh{animation:ndFresh 1.6s ease-out both}
@keyframes ndFresh{0%{background-color:#dfe8fa}100%{background-color:#eaf0fb}}
#pnotedlg .nd-nr-h{display:flex;align-items:center;gap:6px;line-height:20px;min-width:0}
#pnotedlg .nd-nr-h .nd-d{font-weight:600;font-variant-numeric:tabular-nums}
.nd-ovl .nd-wd{font-size:11px;color:#8a8e95;font-weight:400}
.nd-ovl .nd-wd.we{color:#b4473f}
#pnotedlg .nd-pl{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;color:#33373d;margin-left:6px}
#pnotedlg .nd-tag{margin-left:auto;font-size:12px;color:#1f4fb8;font-weight:500;white-space:nowrap}
#pnotedlg .nd-nr-t{font-size:13px;line-height:20px;white-space:pre-wrap;overflow-wrap:anywhere}
#pnotedlg .nd-nr-m{font-size:11.5px;line-height:16px;color:#8a8e95;margin-top:2px;font-variant-numeric:tabular-nums}
#pnotedlg .nd-nr .btn.ib.nd-ed{width:28px;height:28px;color:#8a8e95}
#pnotedlg .nd-nr .btn.ib.nd-ed:not([disabled]):hover{color:#33373d}
#pnotedlg .nd-empty{margin:0;padding:12px 14px;background:#f7f7f4;border-radius:8px;font-size:13px;line-height:20px;color:#6f737a}
#pnotedlg .nd-frow{display:flex;align-items:center;gap:20px;margin-bottom:10px}
#pnotedlg .nd-fg{display:flex;align-items:center;gap:8px}
#pnotedlg .nd-flb{font-size:12.5px;color:#6f737a}
#pnotedlg .seg{display:flex;padding:2px;background:#ebebe6;border-radius:7px;gap:2px;position:relative}
#pnotedlg .seg-b[disabled]{color:#b3b5b9;cursor:default}
#pnotedlg .seg-b:focus-visible{outline:2px solid #1f4fb8;outline-offset:1px}
#pnotedlg .btn.nd-dayb{font-variant-numeric:tabular-nums;padding:0 8px 0 10px}
#pnotedlg .btn.nd-dayb svg{color:#6f737a;flex-shrink:0}
#pnotedlg .btn.nd-dayb[disabled] svg{color:#b3b5b9}
/* меню дней — обычное меню сайта (.menu / .mh / .mi), в окне — position: fixed (ставит products.js: под кнопкой «День» или над ней) */
#pnotedlg .menu.nd-dm{position:fixed;top:auto;left:auto;width:236px;min-width:0;z-index:2}
#pnotedlg .menu.nd-dm.closing{animation:menuOut .12s cubic-bezier(.4,0,1,1) both;pointer-events:none}
#pnotedlg .nd-dml{max-height:320px;overflow:auto;overscroll-behavior:contain}
#pnotedlg .mi.kb{background:#f2f2ee}
#pnotedlg .mi.on.kb{background:#eaf0fb}
#pnotedlg .mi .tn{font-variant-numeric:tabular-nums}
#pnotedlg .mi .nd-has{margin-left:auto;display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#8a8e95;font-weight:400}
#pnotedlg .mi .nd-has i{width:0;height:0;border-style:solid;border-width:0 7px 7px 0;border-color:transparent #d9730d transparent transparent}
@media (prefers-reduced-motion: reduce){#notedlg,#notedlg .rf-dlg,#notedlg.closing,#notedlg.closing .rf-dlg,#pnotedlg,#pnotedlg .rf-dlg,#pnotedlg.closing,
  #pnotedlg.closing .rf-dlg,.nd-ovl .btn.busy .nd-ld,#pnotedlg .nd-nr.fresh,#pnotedlg .menu.nd-dm,#pnotedlg .menu.nd-dm.closing{animation:none}
  .nd-ovl .nd-ta,#pnotedlg .nd-nr,#pnotedlg .nd-lnk{transition:none}}
/* 01.10.2026 (владелец: «у тех у кого нет доступа кнопку можно не скрывать, а просто сделать задизейбленной и серой»): у зрителя пункт
   «История правок» в меню аккаунта — виден и неактивен. Неактивных пунктов меню на сайте не было — цвета неактивной кнопки (.btn[disabled]:
   текст и значок #b3b5b9), наведение не подсвечивает. */
.mi[disabled]{color:#b3b5b9;cursor:default}
.mi[disabled]:hover{background:transparent}
.mi[disabled] svg{color:#b3b5b9}

/* ───────── 24.09.2026 (макет SyncStatus.dc.html, вариант А; README «Статус в шапке: площадки и ручные правки») ─────────
   Статус — кнопка (#sync.ss) с двумя строками 11,5 / 15 px, ~220 px: «Площадки …» (точка — состояние сбора) и «Правка …» (pencil).
   Цвет состояния — только у верхней строки (прежние правила .bar1 .sync.* красили весь статус). Узкий экран (body.hw2) — вариант В.
   По щелчку — окошко #syncpop 340 px (меню шапки: появление 0,16 с, Esc, щелчок мимо). */
.bar1 #syncdd{min-width:0;flex-shrink:1}
.bar1 #sync.ss{display:flex;align-items:center;border:0;background:transparent;border-radius:6px;cursor:pointer;padding:3px 8px;margin:0 -2px;
  text-align:left;font:inherit;color:inherit;font-weight:400;max-width:none;min-width:0;transition:background-color .14s ease-out}
.bar1 #sync.ss:hover,.bar1 #syncdd.open > #sync.ss{background:#f3f3ef}
.bar1 #syncdd.open > #sync.ss{box-shadow:0 0 0 2px rgba(31,79,184,.15)}
#sync .two{display:grid;grid-template-columns:12px auto;column-gap:6px;row-gap:1px;align-items:center;font-size:11.5px;line-height:15px;white-space:nowrap}
#sync .ic{display:flex;justify-content:center;color:#8a8e95}
#sync .r1,#sync .r2{display:flex;align-items:center;min-width:0;max-width:230px;overflow:hidden}
#sync .k{color:#8a8e95;margin-right:4px;flex-shrink:0}
#sync .k[hidden]{display:none}
#sync .v{color:#33373d;font-variant-numeric:tabular-nums;min-width:0;overflow:hidden;text-overflow:ellipsis}
#sync.run .r1,#sync.run .r1 .v{color:#8a6d1a}
#sync.bad .r1 .v{color:#a3261c;font-weight:500}
#sync.old .r1 .v{color:#8a4b0a}
#sync.none .r1 .v{color:#8a8e95}
#sync .syncnum{margin:0 0 0 4px;color:#8a6d1a;font-size:inherit}
#sync .syncstatus{margin-left:4px;max-width:none;font-size:11.5px;min-width:0;overflow:hidden;text-overflow:ellipsis}
#sync .syncstatus.run::before{content:'· '}
#sync .syncstatus.ok,#sync .syncstatus.done{display:none}   /* итог ручного сбора — новым временем «Площадки»; сбой — красной строкой */
#sync.noedit .two > .ic:nth-child(3),#sync.noedit .r2,#sync.noedit #editico{display:none}
#sync .ico{display:none;align-items:center;gap:12px;font-size:12.5px;white-space:nowrap;color:#33373d;font-variant-numeric:tabular-nums}
#sync .ico > span{display:flex;align-items:center;gap:5px}
#sync .ico svg{color:#8a8e95}
/* узкое окно — короткий вид: шаг «шапки 06.10» в style.css (@media) */
@media (prefers-reduced-motion: reduce){.bar1 #sync.ss{transition:none}}
/* окошко */
.menu.syncpop{width:340px;padding:0;left:auto;right:0;font-size:12.5px;color:#1c1e22}
.syncpop section{padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.syncpop section + section{border-top:1px solid #ebebe6}
.syncpop h4{margin:0 0 2px;font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:#6f737a;font-weight:600;display:flex;align-items:center;gap:6px}
.syncpop h4 .dot{width:7px;height:7px;border-radius:50%;display:block;flex-shrink:0;background:#2e9e5b}
.syncpop h4 .dot.run{background:#e0a100}.syncpop h4 .dot.bad{background:#c0392b}.syncpop h4 .dot.old{background:#d9730d}.syncpop h4 .dot.none{background:#a3a7ad}
.syncpop h4 svg{color:#8a8e95}
.syncpop .r{display:flex;justify-content:space-between;gap:12px;line-height:18px}
.syncpop .r > span:first-child{color:#6f737a;flex-shrink:0}
.syncpop .r > span:last-child{text-align:right;font-variant-numeric:tabular-nums;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.syncpop .r .ok{color:#1d6b3f}
.syncpop .r .bad{color:#a3261c}
.syncpop .r .run{color:#8a6d1a}
.syncpop section.f{padding:9px 14px;background:#fafaf8;border-radius:0 0 8px 8px}
.syncpop .hlink{display:inline-flex;align-items:center;gap:6px;height:20px;line-height:20px;border:0;background:transparent;padding:0;
  color:#1f4fb8;font-size:12.5px;font-weight:500;cursor:pointer}
.syncpop .hlink span{display:block;line-height:20px}
.syncpop .hlink svg{position:relative;top:.5px}
.syncpop .hlink:hover span{text-decoration:underline;text-underline-offset:2px}

/* 02.10.2026 (владелец: «по юнитке вариант "б"»; TODO #85): «Юнит-экономика» в сегменте листов — неактивная серая, как #prodseg .seg-b[disabled]
   (подсказка — data-tip сайта); значок калькулятора — только страховка body.hwux (style.css «шапка 06.10») (Lucide calculator) */
.bar1 #unitbtn[disabled],.bar1 #unitbtn[disabled]:hover{color:#b3b5b9;cursor:default}
#unitbtn .un-ico{display:none}
/* 06.10.2026 «шапка 06.10»: подпись — на всех ширинах; значок (body.hwux, style.css) — только страховка для необычно длинного имени учетки */