/* Общие части дашборда «Пульт · Лампа»: токены (три блока — светлая, [data-theme=dark], prefers-color-scheme; hex только в них), база, каркас, таблицы, пилюли, фильтры, окна, формы, шапка страницы.
   Правила отдельных страниц и окон записей — в pages.css (подключается после этого файла). Без префикса и без веса: победу правилу даёт порядок и узкий селектор, не :root/html/!important (tests/test_web_css.py). */
/* ===== Общее, часть 1: токены, база, кнопки, таблицы, пилюли, фильтры, окна, формы ===== */
/* Визуальная система: спецификация дашборда, раздел 2.1 */
@font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-display: swap; src: url(/static/fonts/ibm-plex-sans-cyrillic-400-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Sans"; font-weight: 400; font-display: swap; src: url(/static/fonts/ibm-plex-sans-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
@font-face { font-family: "IBM Plex Sans"; font-weight: 500; font-display: swap; src: url(/static/fonts/ibm-plex-sans-cyrillic-500-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Sans"; font-weight: 500; font-display: swap; src: url(/static/fonts/ibm-plex-sans-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
@font-face { font-family: "IBM Plex Sans"; font-weight: 600; font-display: swap; src: url(/static/fonts/ibm-plex-sans-cyrillic-600-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "IBM Plex Sans"; font-weight: 600; font-display: swap; src: url(/static/fonts/ibm-plex-sans-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
:root { color-scheme: light; --ink: #1c1a16; --fog: #f3f1ec; --sheet: #faf9f6; --line: #ddd6c8; --muted: #6a655c; --cobalt: #1f5f8b; --cobalt-soft: #e4eef5; --amber: #7a5e0a; --plus: #2f6b4f; --minus: #b42318; --on-accent: #ffffff; --row-alt: #f6f4ef; --drr-bad: #f6dcd8; --drr-good: #dcebe2; --grid: #e6e0d3; --chart-1: #1f5f8b; --chart-2: #1a7f7a; --chart-3: #b8860b; --chart-4: #7b3f8c; --chart-5: #8a8478; --mp-ozon: #005BFF; --mp-wb: #CB11AB; --mp-ym: #FFCC00; --mp-ozon-ink: #0047C7; --mp-wb-ink: #9B0B83; --mp-ym-ink: #5E4800; --accent: #1f5f8b; --accent-soft: #e4eef5; --accent-ink: #163e5c; --lamp: #c9a227; --rail: #17191d; --rail-on: #23262c; --rail-ink: #ece7dc; --rail-mute: #9a958a; --ctx: #ebe7df; --rail-w: 224px; --rail-w-min: 56px; --rail-col: var(--rail-w-min); --ctx-w: 268px; --q-w: 312px; --radius-s: 6px; --radius-m: 10px; --ctl-h: 36px; --sel: rgba(31, 95, 139, .14); --sel-edge: rgba(31, 95, 139, .45); --edge-sh: rgba(28, 26, 22, .20); --gap: 16px; --tabbar: 0px; --rt-display: "Golos Text", system-ui, sans-serif; --rt-mono: "JetBrains Mono", ui-monospace, Menlo, monospace; }
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #efe8d8; --fog: #161410; --sheet: #1a1814; --line: #3a362e; --muted: #9a9284;
  --cobalt: #7eb0d0; --cobalt-soft: #2a3138; --amber: #d4ad3a; --plus: #7dba98; --minus: #ec7e74;
  --on-accent: #0f0e0c; --row-alt: #262219; --drr-bad: #4a2824; --drr-good: #1f3a2c; --grid: #2a2720;
  --chart-1: #7eb0d0; --chart-2: #4fc2b8; --chart-3: #d4ad3a; --chart-4: #c792db; --chart-5: #a39b8c;
  --mp-ozon: #005BFF; --mp-wb: #CB11AB; --mp-ym: #FFCC00; --mp-ozon-ink: #8DB2FF; --mp-wb-ink: #EE8EDD; --mp-ym-ink: #FFD84D;
  --accent: #7eb0d0; --accent-soft: #2a3138; --accent-ink: #d7eaf4; --sel: rgba(126, 176, 208, .18); --sel-edge: rgba(126, 176, 208, .4);
  --lamp: #d4ad3a; --rail: #100f0d; --rail-on: #1c1a16; --rail-ink: #efe8d8; --rail-mute: #8f8778; --ctx: #262219;
  --edge-sh: rgba(0, 0, 0, .55);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --ink: #efe8d8; --fog: #161410; --sheet: #1a1814; --line: #3a362e; --muted: #9a9284;
    --cobalt: #7eb0d0; --cobalt-soft: #2a3138; --amber: #d4ad3a; --plus: #7dba98; --minus: #ec7e74;
    --on-accent: #0f0e0c; --row-alt: #262219; --drr-bad: #4a2824; --drr-good: #1f3a2c; --grid: #2a2720;
    --chart-1: #7eb0d0; --chart-2: #4fc2b8; --chart-3: #d4ad3a; --chart-4: #c792db; --chart-5: #a39b8c;
    --mp-ozon: #005BFF; --mp-wb: #CB11AB; --mp-ym: #FFCC00; --mp-ozon-ink: #8DB2FF; --mp-wb-ink: #EE8EDD; --mp-ym-ink: #FFD84D;
    --accent: #7eb0d0; --accent-soft: #2a3138; --accent-ink: #d7eaf4; --sel: rgba(126, 176, 208, .18); --sel-edge: rgba(126, 176, 208, .4);
    --lamp: #d4ad3a; --rail: #100f0d; --rail-on: #1c1a16; --rail-ink: #efe8d8; --rail-mute: #8f8778; --ctx: #262219;
    --edge-sh: rgba(0, 0, 0, .55);
  }
}
/* План 6.2c: прокрутки, простые таблицы, панель действий */
* { box-sizing: border-box; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 15px/1.5 "IBM Plex Sans", system-ui, sans-serif; background: var(--fog); color: var(--ink); font-variant-numeric: tabular-nums; padding-bottom: var(--tabbar); font-family: "Golos Text", system-ui, sans-serif; }
a { color: var(--cobalt); }
a.cc-st-link { text-underline-offset: 3px; text-decoration-skip-ink: none; }   /* подчёркивание не прячет «_» в «Склад_1» */
:focus-visible { outline: 2px solid var(--cobalt); outline-offset: 2px; outline-color: var(--accent); }
h1 { font-size: 24px; line-height: 1.25; font-weight: 600; margin: 0 0 12px; }
h2 { font-size: 18px; line-height: 1.3; font-weight: 600; margin: 20px 0 8px; }
h3 { font-size: 15px; font-weight: 600; margin: 0 0 8px; }
small, .muted { color: var(--muted); font-size: 13px; }
button.icon { padding: 6px 10px; line-height: 1; min-width: 40px; }
a.back { display: inline-block; }
.theme-icon { display: inline-block; width: 18px; height: 18px; border: 2px solid currentColor; border-radius: 50%; vertical-align: -3px;
              background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
main { padding: 20px 24px 32px; max-width: 1920px; margin: 0 auto; }
button:not(:where(.rail-item)):hover { border-color: var(--cobalt); }   /* :where не меняет вес; кнопки рейки держат свой цвет рамки */
a.button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font: inherit; padding: 6px 10px; border: 1px solid var(--line); border-radius: var(--radius-s);
  background: var(--sheet); color: inherit; text-decoration: none; }
a.button:hover { border-color: var(--cobalt); }
/* лёгкая красная кнопка (отмена запуска): токены есть в обоих видах и всех темах, hex не нужен */
button.danger-soft, a.button.danger-soft { background: var(--drr-bad); border-color: color-mix(in srgb, var(--minus) 40%, var(--line)); color: var(--minus); }
button.danger-soft:hover, a.button.danger-soft:hover { border-color: var(--minus); }
button.ok-soft, a.button.ok-soft { background: var(--drr-good); border-color: color-mix(in srgb, var(--plus) 40%, var(--line)); color: var(--plus); }
button.ok-soft:hover, a.button.ok-soft:hover { border-color: var(--plus); }
.link-button { border: 0; background: none; color: var(--cobalt); padding: 4px 0; text-decoration: underline; text-underline-offset: 2px; }
.segmented { display: inline-flex; gap: 0; align-self: flex-start; max-width: 100%; }
.segmented button { border-radius: 0; margin-left: -1px; }
.period .chips button { border-radius: 0; margin-left: -1px; white-space: nowrap; }
.period .chips button:first-child, .segmented button:first-child { border-radius: var(--radius-s) 0 0 var(--radius-s); margin-left: 0; }
.period .chips button:last-child, .segmented button:last-child { border-radius: 0 var(--radius-s) var(--radius-s) 0; }
.card-head { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.card-head h2 { margin: 0; }
.card-head .link-button { margin-left: auto; }
.chip-row { display: flex; gap: 12px; align-items: baseline; margin-bottom: 12px; }
ul.list li .reason { display: block; color: var(--muted); font-size: 13px; }
.checklist { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 4px 16px; margin-bottom: 12px; }
.facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 8px 0 12px; }
.facts > div { border: 1px solid var(--line); border-radius: var(--radius-m); padding: 10px 12px; display: flex; flex-direction: column; }
.fact { font-size: 20px; font-weight: 600; }
.links { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.links a { padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px; text-decoration: none; }
.links a:hover { border-color: var(--cobalt); }
h4 { font-size: 15px; font-weight: 600; margin: 12px 0 6px; }
.description { white-space: pre-wrap; max-height: 40vh; overflow: auto; border: 1px solid var(--line); border-radius: var(--radius-m); padding: 12px; margin-top: 8px; }
.description.desc-fmt { white-space: normal; }   /* текст с <br>/<ul> (descriptionHtml): переводы строк в исходнике дали бы лишние пустые строки */
.description.desc-fmt ul { margin: 4px 0; padding-left: 22px; }
.chart.small { height: 220px; }
.toolbar { display: flex; gap: 8px 12px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.period { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.period .chips { display: flex; gap: 6px; overflow-x: auto; }
.period details.dates summary { cursor: pointer; color: var(--cobalt); padding: 6px 4px; }
.period details.dates[open] { display: flex; gap: 6px; align-items: center; }
.headline { font-size: 32px; line-height: 1.25; font-weight: 500; max-width: 36ch; min-height: 2.5em; margin: 4px 0 24px; text-wrap: balance; }
.tile-label { color: var(--muted); font-size: 13px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.banner { display: flex; gap: 12px; align-items: center; padding: 12px 16px; border-radius: var(--radius-m); border: 1px solid var(--minus); background: var(--drr-bad); margin-bottom: 16px; }
.banner[hidden] { display: none; }
.banner .grow { flex: 1; min-width: 0; }
@media (max-width: 720px) {
  .banner { flex-wrap: wrap; }
  .banner .grow { flex-basis: 200px; }
}
#watch h3 { font-size: 13px; font-weight: 500; color: var(--muted); margin: 12px 0 4px; }
#watch h3:first-child { margin-top: 0; }
.state { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; min-height: 40vh; padding: 32px 16px; text-align: center; color: var(--muted); border: 1px solid transparent; border-radius: var(--radius-m); }
.state-text { margin: 0; font-size: 16px; max-width: 48ch; overflow-wrap: anywhere; }
.state-error { color: var(--ink); border-color: var(--minus); }
.state-error .state-text { color: var(--minus); }
.good { color: var(--plus); }
.bad { color: var(--minus); }
.error { color: var(--minus); }
.warn { color: var(--amber); }
section.card > h2:first-child { margin-top: 0; }
.cols { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gap); align-items: start; }
.cols > * { min-width: 0; }
ul.list { list-style: none; padding: 0; margin: 0; }
ul.list li { padding: 8px 0; border-bottom: 1px solid var(--line); }
ul.list li:last-child { border-bottom: 0; }
ul.list a { text-decoration: none; }
ul.list a:hover { text-decoration: underline; }
table.plain { border-collapse: collapse; width: 100%; }
table.plain td { padding: 6px 8px; border-bottom: 1px solid var(--line); text-align: right; vertical-align: top; }
table.plain td:first-child, table.plain th:first-child { text-align: left; }
table.plain th { padding: 6px 8px; border-bottom: 1px solid var(--line); text-align: right; vertical-align: top; font-weight: 500; color: var(--muted); font-size: 13px; background: var(--sheet); position: sticky; top: 0; }
.chart { position: relative; height: 300px; background: var(--sheet); border: 1px solid var(--line); border-radius: var(--radius-m); padding: 8px; margin-bottom: 16px; }
/* выключатель флажков над графиком и подсказка вымпела (lineChart, opts.flags) */
.chart-flags-row { display: flex; justify-content: flex-end; margin: 0 0 4px; }
.chart-flags-toggle { flex: none; width: auto; margin: 0; min-height: 0; border: 1px solid var(--line); background: var(--sheet); color: var(--muted); cursor: pointer; }
.chart-flags-toggle[aria-pressed="true"] { background: var(--sel); border-color: var(--sel-edge); color: var(--accent-ink); }
.chart-flag-tip { position: absolute; z-index: 5; max-width: min(360px, 90%); padding: 6px 8px; background: var(--ink); color: var(--sheet); border-radius: var(--radius-s); font-size: 12px; line-height: 1.35; pointer-events: none; }
.chart-flag-tip[hidden] { display: none; }
.chart-flag-tip div + div { margin-top: 3px; }
/* 7.11 §1: таблицы, пилюли, фильтры, окна, выравнивание */
/* таблицы — на подложке карточки: шапка мелкими прописными (как группы списка 7.10), строки без чередования и вертикальных линий */
.tabulator { border: 1px solid var(--line); border-radius: var(--radius-m); font-size: 14px; max-width: 100%; overflow: hidden; background: var(--sheet); color: var(--ink); }
.tabulator-row.tabulator-row-even { background: var(--sheet); }
.tabulator-row:hover { background: var(--cobalt-soft) !important; cursor: pointer; }
.swatch.drr-bad { background: var(--drr-bad); }
.swatch.drr-good { background: var(--drr-good); }
.tabulator-row.drr-bad .tabulator-cell:first-child { box-shadow: inset 4px 0 0 var(--minus); }
.tabulator-row.drr-good .tabulator-cell:first-child { box-shadow: inset 4px 0 0 var(--plus); }
.tabulator-row.thr-bad .tabulator-cell { background: var(--drr-bad); }
.tabulator-row.thr-bad .tabulator-cell:first-child { box-shadow: inset 4px 0 0 var(--minus); }
/* строка кликабельна: при наведении заливка ячеек уступает общей подсветке строки, красная полоса слева остаётся */
.tabulator-row.thr-bad:hover .tabulator-cell { background: var(--cobalt-soft); }
.tabulator .thr { margin-left: 4px; padding: 0 4px; font-size: 0.85em; font-weight: normal; }
.tabulator .thr.on { color: var(--minus); }
.tabulator-row.drr-bad .tabulator-cell[tabulator-field="drr"] { background: var(--drr-bad); }
.tabulator-row.drr-good .tabulator-cell[tabulator-field="drr"] { background: var(--drr-good); }
.swatch { display: inline-block; width: 14px; height: 14px; border: 1px solid var(--line); border-radius: 3px; vertical-align: -2px; margin-right: 4px; }
/* Строка поиска таблицы (makeTable): поле над таблицей и подсказка «как понято»; предупреждение — отдельной строкой */
.tsearch { margin: 0 0 6px; }
.tsearch-input { width: 100%; max-width: 520px; box-sizing: border-box; border-radius: var(--radius-s); min-height: var(--ctl-h); }
.tsearch-hint { font-size: 12.5px; margin: 0 0 8px; min-height: 0; color: var(--muted); }
.tsearch-hint:empty { display: none; }
.tsearch-warn { display: block; color: var(--amber); }
/* ----- окна товаров и вложенные страницы (2.6): .pw-win, .modal, .cw-*; раскладка прежняя, только токены Лампы/Ночи ----- */
.modal { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 50; background: color-mix(in srgb, var(--ink) 40%, transparent); }
/* окна: × всегда в правом верхнем углу, кнопки шапки — своей группой с переносом; шапка прилипает при прокрутке */
.modal .dialog { background: var(--sheet); padding: 16px 20px 20px; border-radius: var(--radius-m); max-height: 88vh; overflow: auto; width: min(520px, 94vw); position: relative; border: 1px solid var(--line); box-shadow: 0 16px 40px color-mix(in srgb, var(--ink) 16%, transparent); }
.modal .dialog.form { width: 480px; max-width: 96vw; }
/* три ширины окна (guide §2.4): форма / таблица / объект; wide: true = table */
.win-form { display: grid; gap: 10px; min-width: 0; }
/* форма в окне size: 'form': подпись над полем, поле на всю ширину */
.win-form label { display: grid; gap: 4px; min-width: 0; }
.win-form input:not([type=checkbox]):not([type=radio]), .win-form select, .win-form textarea { width: 100%; box-sizing: border-box; min-width: 0; }
.win-form p { margin: 0; }
.modal .dialog.table { width: 880px; max-width: 96vw; }
.modal .dialog.object { width: 1200px; max-width: 96vw; }
.dialog-head { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; position: sticky; top: -16px; z-index: 2; background: var(--sheet); padding: 4px 44px 8px 0; flex-wrap: wrap; }
.dialog-head h3 { margin: 0; font-size: 18px; flex: 1; }
.dialog-head .close { border: 0; background: none; font-size: 24px; line-height: 1; padding: 4px 8px; color: var(--muted); position: absolute; top: 2px; right: -6px; }
.dialog-head .close:hover { color: var(--ink); }
form.inline { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
nav.tabbar { display: none; }
.scroll-x { overflow-x: auto; }
section.card { background: var(--sheet); border: 1px solid var(--line); border-radius: var(--radius-m); padding: 14px 16px; margin-bottom: 16px; overflow-x: auto; }
table.plain td:not(:first-child), table.plain th:not(:first-child) { white-space: nowrap; }
/* Тема для Tabulator и полей ввода: цвета из переменных (у Tabulator свои светлые в tabulator.min.css) */
.tabulator .tabulator-tableholder, .tabulator .tabulator-tableholder .tabulator-table { background: var(--sheet); color: var(--ink); }
.tabulator-row { background: var(--sheet); color: var(--ink); border-bottom: 1px solid var(--grid); }
.tabulator .tabulator-footer { background: var(--sheet); color: var(--ink); border-top-color: var(--line); }
.tabulator .tabulator-header { border-bottom: 1px solid var(--line); background: var(--row-alt); color: var(--ink); border-color: var(--line); }
.tabulator .tabulator-header .tabulator-col { background: var(--row-alt); color: var(--ink); border-color: var(--line); border-right: 0; }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable:hover { background: var(--cobalt-soft); }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-sorter .tabulator-arrow { border-bottom-color: var(--muted); border-top-color: var(--muted); }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="ascending"] .tabulator-col-sorter .tabulator-arrow { border-bottom-color: var(--cobalt); }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable[aria-sort="descending"] .tabulator-col-sorter .tabulator-arrow { border-top-color: var(--cobalt); }
.tabulator .tabulator-placeholder .tabulator-placeholder-contents { color: var(--muted); }
.tabulator .tabulator-footer .tabulator-page { background: var(--sheet); color: var(--ink); border-color: var(--line); }
.tabulator .tabulator-footer .tabulator-page:not(.disabled):hover { background: var(--cobalt-soft); color: var(--cobalt); }
.tabulator .tabulator-footer .tabulator-page.active { background: var(--cobalt); border-color: var(--cobalt); color: var(--on-accent); }
.tabulator .tabulator-footer .tabulator-page.disabled { color: var(--muted); opacity: .6; }
.tabulator .tabulator-footer .tabulator-page-size { background: var(--sheet); color: var(--ink); border-color: var(--line); }
button { font: inherit; padding: 6px 10px; border: 1px solid var(--line); border-radius: var(--radius-s); cursor: pointer; background: var(--sheet); color: var(--ink); border-color: var(--line); }
select, input { font: inherit; padding: 6px 10px; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--sheet); color: var(--ink); border-color: var(--line); }
textarea { width: 100%; min-height: 160px; font: inherit; padding: 8px; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--sheet); color: var(--ink); border-color: var(--line); }
button[aria-pressed="true"] { background: var(--cobalt); border-color: var(--cobalt); color: var(--on-accent); }
button.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
input::placeholder, textarea::placeholder { color: var(--muted); }
/* План 6.1: карточки, ключи, рынок */
.tabulator .tabulator-header .tabulator-col .tabulator-col-content .tabulator-col-title { white-space: normal; }
/* шапка makeTable: слово подписи не рвётся по буквам (ширину столбца по самому длинному слову задаёт headerMinWidth, app.js),
   между словом и стрелкой сортировки зазор (стрелка у правого края, ~10 px); старый вид — как был (app.css, 14 px) */
.tabulator .tabulator-header .tabulator-col .tabulator-col-title { font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; overflow-wrap: normal; word-break: normal; }
/* прописные шире строчных: место под стрелку сортировки — по её ширине (у Tabulator 25px), иначе слова заголовков обрезаются */
.tabulator .tabulator-header .tabulator-col.tabulator-sortable .tabulator-col-title { padding-right: 18px; }
.panel.is-hidden { display: none; }
input.short { width: 5em; }
.badge { display: inline-block; padding: 0 8px; border-radius: 999px; background: var(--cobalt-soft); color: var(--cobalt); font-size: 13px; }
.status-text { color: var(--plus); }
.status-attributes, .status-partial { color: var(--amber); }
.status-none { color: var(--minus); }
table.plain td .reason { display: block; color: var(--muted); font-size: 13px; white-space: normal; }
table.plain td.wrap { white-space: normal; min-width: 16em; }
@media (max-width: 900px) {
  .cols { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  :root { --tabbar: 64px; --ctl-h: 44px; }
  body { font-size: 15px; padding-bottom: calc(var(--tabbar) + 8px); }
  main { padding: 12px 16px 24px; }
  h1 { font-size: 20px; }
  .headline { font-size: 20px; max-width: none; min-height: 3.75em; }
  .tile-label { white-space: normal; }
  .tsearch-input { max-width: none; }
  .facts { grid-template-columns: 1fr 1fr; }
}
/* любое окно на весь экран, подвал прилипает к низу (шаблон окна, п. 6) */
@media (max-width: 720px) {
  .modal { align-items: stretch; }
  .chart { height: 220px; }
  button, a.button, select, input:not([type=checkbox]):not([type=radio]), .period details.dates summary { min-height: 44px; }
  button.icon { min-width: 44px; }
  ul.list li a, a.back { display: inline-flex; align-items: center; min-height: 44px; }
  .period .chips { flex-wrap: nowrap; max-width: 100%; }
}
/* период в фильтрах — не шире экрана, чипы прокручиваются внутри (иначе страница шире 390 px и при is_mobile
     масштабируется — щелчки ui_audit промахиваются) */
@media (max-width: 720px) {
  .filters > .period { flex: 1 1 100%; min-width: 0; max-width: 100%; }
  .period details.dates[open] { flex-wrap: wrap; }
  .period details.dates input { min-width: 0; max-width: 100%; }
}
/* подпись загрузки (api() в app.js): по центру под шапкой, клики не перехватывает */
/* пункты рейки — однострочные, высота жёсткая (их собственный padding+строка дают 40) */
/* ----- подпись загрузки: шапки больше нет ----- */
#loading-note { position: fixed; left: 50%; transform: translateX(-50%); z-index: 45; pointer-events: none; display: flex; align-items: center; gap: 8px; max-width: calc(100vw - 32px); padding: 6px 14px; background: var(--sheet); color: var(--ink); border: 1px solid var(--line); border-radius: 999px; box-shadow: 0 2px 8px color-mix(in srgb, var(--ink) 15%, transparent); font-size: 13px; white-space: nowrap; top: 12px; }
#loading-note::before { content: ""; width: 12px; height: 12px; flex: none; border-radius: 50%;
                        border: 2px solid var(--cobalt-soft); border-top-color: var(--cobalt); animation: loading-spin .8s linear infinite; }
@keyframes loading-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
/* План 6.2: исследование и конкуренты */
button.link { background: none; border: 0; padding: 0; color: var(--cobalt); text-decoration: underline;
  cursor: pointer; min-height: 44px; text-align: left; }
/* Заголовки-кнопки сортировки в простых таблицах: выглядят как заголовок, нажимаются целиком */
table.plain th button.sort { background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer;
  width: 100%; text-align: inherit; min-height: 32px; }
table.plain th button.sort:hover { color: var(--ink); }
@media (max-width: 720px) {
  table.plain th button.sort { min-height: 44px; }
}
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--line); border-radius: 999px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background-color: var(--muted); }
table.plain tr:nth-child(even) td { background: var(--row-alt); }
table.plain tr:hover td { background: var(--cobalt-soft); }
table.plain tr.key-row td { font-weight: 600; background: var(--cobalt-soft); }
.toolbar label { display: inline-flex; align-items: center; gap: 6px; }
.toolbar input[type=checkbox] { margin: 0; width: 18px; height: 18px; }
details.tool-more { display: inline-flex; }
details.tool-more > summary { display: none; }
details.tool-more > div { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; }
@media (max-width: 720px) {
  details.tool-more { position: relative; }
  details.tool-more > summary { display: flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px;
    border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--sheet); cursor: pointer; list-style: none; font-size: 20px; }
  details.tool-more > summary::-webkit-details-marker { display: none; }
  details.tool-more[open] > div { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; flex-direction: column;
    align-items: stretch; min-width: 220px; padding: 8px; background: var(--sheet); border: 1px solid var(--line);
    border-radius: var(--radius-m); box-shadow: 0 8px 24px color-mix(in srgb, var(--ink) 18%, transparent); }
}
/* Шапка таблиц: наведение — цветом строк */
/* шапка таблицы: фильтров под подписями больше нет, а высоту шапки задаёт самая длинная подпись — короткие подписи прижаты книзу, к строкам (раньше под ними оставалась пустота) */
.tabulator .tabulator-header .tabulator-col .tabulator-col-content { flex: 1; display: flex; flex-direction: column; padding: 6px 4px 6px 10px; justify-content: flex-end; }
.tabulator .tabulator-header .tabulator-col.tabulator-sortable.tabulator-col-sorter-element:hover { background-color: var(--cobalt-soft); }
.list.compact { margin: 4px 0 0; }
.list.compact li { padding: 4px 0; }
.pre-line { white-space: pre-line; }
table.plain td.nowrap { white-space: nowrap; }
@media (max-width: 720px) {
  .segmented { flex-wrap: wrap; gap: 6px; }
  .segmented button, .segmented button:first-child, .segmented button:last-child { border-radius: var(--radius-s); margin-left: 0; }
}
.segmented[aria-label="Вид ТЗ"] { margin-top: 12px; }
/* список + карточка в две колонки (Личное, Администрирование «Люди»/«Роли»); на ≤ 900 px — одной колонкой, карточка не липкая */
.ws-split { display: grid; grid-template-columns: minmax(260px, 380px) minmax(0, 1fr); gap: var(--gap); align-items: start; }
.ws-split > .tz-list { border-radius: var(--radius-m); }
.ws-split > .tz-card { margin: 0; position: sticky; top: 12px; }
@media (max-width: 900px) {
  .ws-split { grid-template-columns: minmax(0, 1fr); }
  .ws-split > .tz-card { position: static; }
}
.tabulator-row .tabulator-cell { border-right: 0; padding: 8px 10px; }
/* заголовок — по левому краю текста ячеек; справа место у стрелки */
.tabulator .tabulator-header .tabulator-frozen.tabulator-frozen-left, .tabulator-row .tabulator-cell.tabulator-frozen.tabulator-frozen-left { border-right: 1px solid var(--grid); }
/* граница закреплённого столбца — цветом сетки */
/* галочки строк и закреплённые сверху строки (makeTable, опция pick) */
.tabulator .tabulator-header .pick-cell .tabulator-col-content { padding: 8px 0; cursor: pointer; }
.tabulator .tabulator-row .pick-cell { padding: 8px 0; cursor: pointer; padding-top: 9px; padding-bottom: 9px; }
.tabulator .pick-cell input { width: 18px; height: 18px; cursor: pointer; vertical-align: middle; accent-color: var(--cobalt); display: block; margin: 0 auto; }
.tabulator .tabulator-frozen-rows-holder { border-top: 1px solid var(--line); box-shadow: 0 2px 0 var(--line);
}
.tabulator .tabulator-frozen-rows-holder .tabulator-row { background: var(--sheet); font-weight: normal; }
/* холдер — в шапке, она жирная */
/* пилюли счётчиков и статусов */
.pill { display: inline-block; font-size: 12px; line-height: 18px; padding: 0 8px; border-radius: 999px; white-space: nowrap; background: var(--fog); color: var(--muted); }
.pill.ok { background: var(--drr-good); color: var(--plus); }
.pill.bad { background: var(--drr-bad); color: var(--minus); }
.pill.warn { background: color-mix(in srgb, var(--amber) 14%, var(--sheet)); color: var(--amber); }
.pill.mute { background: var(--fog); color: var(--muted); }
/* Площадка пилюлей в фирменном цвете (как в системе склада): квадратик — цвет площадки, фон — его оттенок, текст — `--mp-*-ink` */
.pill.mp { --mp: var(--mp-ozon); background: color-mix(in srgb, var(--mp) 12%, var(--sheet)); color: var(--mp-ozon-ink); font-weight: 600; }
.pill.mp::before { content: ''; display: inline-block; width: 7px; height: 7px; border-radius: 2px; margin-right: 5px; vertical-align: 1px; background: var(--mp); }
.pill.mp-wb { --mp: var(--mp-wb); color: var(--mp-wb-ink); }
.pill.mp-ym { --mp: var(--mp-ym); color: var(--mp-ym-ink); background: color-mix(in srgb, var(--mp) 20%, var(--sheet)); }
/* списки строк с кнопкой (Главная): текст слева, кнопка/пилюля справа; на телефоне кнопка уходит под текст */
.stack { display: flex; flex-direction: column; min-width: 0; }
.stack > section.card[hidden] { display: none; }
.card-act { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.card-act h2 { margin: 0 auto 0 0; }
.card-act a { text-decoration: none; }
.list-group { font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; margin: 12px 0 2px; }
.list-group:first-child { margin-top: 4px; }
ul.list.rows li { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
ul.list.rows li > a.row-link { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex: 1; min-width: 0; color: inherit; }
.row-main { display: flex; flex-direction: column; min-width: 0; }
.row-sub { color: var(--muted); font-size: 13px; }
.row-end { display: flex; align-items: center; gap: 10px; flex: none; font-size: 13px; }
@media (max-width: 600px) {
  ul.list.rows li:has(.button) { flex-wrap: wrap; }
  .row-end { flex-wrap: wrap; }
}
/* фильтры — одной строкой на подложке; на телефоне поля во всю ширину */
.filters { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; padding: 10px 12px; margin-bottom: 12px; background: var(--sheet);
  border: 1px solid var(--line); border-radius: var(--radius-m); }
.filters input[type=search] { flex: 1 1 220px; min-width: 0; }
/* строка с периодом и двумя флажками («Юнит-экономика»): поиск уступает место, чтобы «Excel» не уходил на вторую строку на 1440 */
.filters-tight input[type=search] { flex-basis: 120px; }
.filters label { display: inline-flex; align-items: center; gap: 6px; }
/* действие строки фильтров (форма добавления, «Пересчитать») — справа; на телефоне — с левого края, форма — своей строкой
   во всю ширину, её поля — тоже (вкладки «Карточек», 2.89 §5; в «Проверке товаров» то же делает .ck-add) */
.filters > .filters-act { margin-left: auto; }
/* сегменты не растягиваются на ширину блока */
/* плашки-фильтры по рядам («Частые ошибки» проверки, «Что поправить» карточек): подпись ряда слева, плашки с числом;
   нажатая плашка — фильтр, справа — «Фильтр: … · N сбросить» */
.fchips { display: flex; flex-direction: column; gap: 10px; }
.fchips-cap { margin: 0 auto 0 0; font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.fchips-active { display: inline-flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.fchips-active .link-button { padding: 0; }
.fchips-lv { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 4px 12px; align-items: start; }
.fchips-h { font-size: 12px; font-weight: 600; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; padding-top: 5px; }
button.fchips-h { justify-self: start; min-height: 0; padding: 5px 6px 3px; margin-left: -6px; border: 0; text-align: left;
  border-radius: var(--radius-s); text-decoration: underline dotted; text-underline-offset: 3px; }
button.fchips-h:not([aria-pressed="true"]) { background: none; }
button.fchips-h[aria-pressed="true"] { text-decoration: none; color: var(--accent-ink); }
.fchips-row { display: flex; flex-wrap: wrap; gap: 6px; min-width: 0; }
.fchips-row .link-button { align-self: center; padding: 0; }
.fchip { display: inline-flex; align-items: center; gap: 6px; max-width: 260px; padding: 3px 10px; border-radius: 999px; font-size: 13px; }
.fchip .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.fchip .n { color: var(--muted); }
.fchip .fl { color: var(--minus); }
.fchip[aria-pressed="true"] .fl { color: inherit; }
.fchips-tail { align-self: center; font-size: 12.5px; color: var(--muted); white-space: nowrap; }
/* выбор строк «Цен и РРЦ»: полоса вместо счётчика над таблицей */
/* Радиусы: контролы — --radius-s, панели и карточки — --radius-m, чипы — 999px; жёсткие значения app.css на токены */
.selbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 6px 6px 6px 12px; background: var(--cobalt-soft); border-radius: var(--radius-s); }
.selbar[hidden] { display: none; }
.selbar b { margin-right: 4px; font-weight: 600; color: var(--cobalt); }
.fchip[aria-pressed="true"] .n { color: inherit; }
.dot { display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--muted); }
.dot.bad { background: var(--minus); }
.dot.warn { background: var(--amber); }
/* зелёного нет: «хорошо» — серая точка (guide.md §1.0 п. 6) */
.dot.good { background: var(--muted); }
.dialog-acts { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.dialog-acts > button.icon { align-self: stretch; display: inline-flex; align-items: center; justify-content: center; }
/* «Сообщить» в шапке окна — в высоту соседних кнопок */
.modal .dialog.xl { width: min(1440px, 96vw); height: 92vh; max-height: 92vh; display: flex; flex-direction: column; overflow: hidden; padding: 0; background: var(--fog); }
.dialog.xl .dialog-head { position: static; padding: 10px 60px 10px 16px; margin: 0; background: var(--sheet); border-bottom: 1px solid var(--line); }
.dialog.xl .dialog-head .close { top: 8px; right: 12px; }
.dialog.xl .dialog-body { flex: 1 1 auto; min-height: 0; overflow: auto; padding: 14px 18px; }
/* подвал окна: итог слева, кнопки группой; на телефоне главная кнопка — первой во всю ширину */
.dialog-foot { position: sticky; bottom: -20px; display: flex; gap: 8px 12px; align-items: center; flex-wrap: wrap; margin: 16px -20px -20px;
  padding: 12px 20px; border-top: 1px solid var(--line); background: var(--sheet); }
.dialog-foot .sum { margin-right: auto; min-width: 0; }
.dialog-foot .acts { display: flex; gap: 8px; flex-wrap: wrap; }
.dialog.xl .dialog-foot { position: static; margin: 0; }
/* подсветка поля после перехода из «Готовности» или списка */
.ws-flash { animation: ws-flash 1.6s ease-out; border-radius: var(--radius-s); }
@keyframes ws-flash { from { box-shadow: 0 0 0 3px var(--amber); } to { box-shadow: 0 0 0 3px transparent; } }
@media (max-width: 720px) {
  .filters > select, .filters > input, .filters > details { flex: 1 1 100%; width: 100%; }
  .filters > .filters-act { margin-left: 0; }
  .filters > form.filters-act { flex: 1 1 100%; }
  .filters > form.filters-act > input, .filters > form.filters-act > select { flex: 1 1 100%; min-width: 0; }
  .fchips-lv { grid-template-columns: minmax(0, 1fr); }
  .fchip { max-width: 100%; }
  .fchips-tail { white-space: normal; }
  .selbar { flex-basis: 100%; }
  .fchips-active { flex-basis: 100%; }
  .modal .dialog.xl { width: 100vw; height: 100dvh; max-height: none; border-radius: 0; }
  .modal .dialog, .modal .dialog.form, .modal .dialog.table, .modal .dialog.object { width: 100vw; max-width: none; height: 100dvh; max-height: none; border-radius: 0; display: flex; flex-direction: column; box-sizing: border-box; }
  .modal .dialog:not(.xl) > .dialog-body { flex: 1 0 auto; }
  .dialog:not(.xl) .dialog-foot { position: sticky; bottom: -20px; margin-top: auto; padding-bottom: calc(12px + env(safe-area-inset-bottom)); }
  .dialog-foot { flex-direction: column; align-items: stretch; }
  .dialog-foot .acts { flex-direction: column; }
  .dialog-foot .acts > * { width: 100%; }
  .dialog-foot .acts .primary { order: -1; }
}
/* 7.11 §2: большое окно со страницей (iframe с ?embed=1); встроенная страница — без шапки, меню и нижней панели */
:root[data-embed] { --tabbar: 0px; }
[data-embed] main { padding-top: 12px; }
[data-embed] .back-list { display: none; }
/* пустой первый блок шапки запуска (h1 скрыт) не даёт отступ над рядом кнопок */
[data-embed] main h1 { display: none; }
/* заголовок окна — .pw-title рамки; h1 остаётся в DOM: openPage читает его текст */
[data-embed] p:has(> .back-list:only-child) { display: none; }
/* пустой абзац ссылки «к списку» не оставляет отступ */
html.pw-open { overflow: hidden; }
.modal.pw { padding: 18px 24px; align-items: stretch; }
.pw-win { width: 100%; max-width: 1600px; margin: 0 auto; display: flex; flex-direction: column; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--fog); box-shadow: 0 16px 40px color-mix(in srgb, var(--ink) 16%, transparent); }
/* тёплая тень от --ink, без холодной синевы */
.pw-head { position: relative; display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; padding: 10px 60px 10px 16px; margin: 0 0 4px; background: var(--sheet); border-bottom: 1px solid var(--line); }
.pw-title { flex: 1 1 260px; min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
.pw-head .close { position: absolute; top: 8px; right: 12px; border: 0; background: none; font-size: 24px; line-height: 1; padding: 4px 8px; color: var(--muted); }
.pw-frame { flex: 1 1 auto; width: 100%; border: 0; background: var(--fog); }
/* перебить --tabbar: 64px телефона */
@media (max-width: 720px) {
  .modal.pw { padding: 0; }
  .pw-win { height: 100dvh; border: 0; border-radius: 0; box-shadow: none; }
  .pw-title { flex-basis: 100%; }
}
/* 2.89: Готовность, предложения, карточки — общие части WS.ready (пилюли) и WS.proposal (предложение пунктиром) */
.ws-ready-pills { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.ws-prop { border: 1px dashed var(--cobalt); padding: 8px 10px; display: flex; flex-wrap: wrap; gap: 6px 12px; align-items: center; margin-top: 6px; border-radius: var(--radius-s); }
.ws-prop-q { font-weight: 500; flex: 0 0 16em; min-width: 0; overflow-wrap: anywhere; }
/* одна ширина: «почему» соседних предложений — с одной позиции */
.ws-prop-why { flex: 1 1 300px; color: var(--muted); min-width: 0; overflow-wrap: anywhere; }
.ws-prop-acts { margin-left: auto; display: flex; flex-wrap: wrap; gap: 8px; }
.ws-prop > input[type=checkbox] { flex: none; width: 18px; height: 18px; margin: 0; }
@media (max-width: 720px) {
  .ws-prop-q { flex: 1 1 auto; }
  .ws-prop > input[type=checkbox] + .ws-prop-q { flex: 1 1 0; }
}
/* галочка — в строке с вопросом */
/* листание окна-объекта — в подвале: «← Предыдущий · N из M · Следующий →» (Ц1.1, §2.4); крайние кнопки выключены */
.pw-nav { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; white-space: nowrap; }
.pw-nav[hidden] { display: none; }
.pw-nav button:disabled { color: var(--muted); opacity: .5; cursor: default; }
.pw-foot { flex: none; display: flex; padding: 10px 16px; border-top: 1px solid var(--line); background: var(--sheet); }
.pw-pos { display: inline-flex; align-items: center; padding: 0 10px; font-size: 13px; }
/* 2.89 §2: список «Товары» — даты данных под строкой фильтров, число товаров в сегментах групп, колонка «Что сделать»
   (пункты одного уровня — группой за точкой, группы переносятся) */
.filters > .filters-note { flex: 1 1 100%; margin: 0; font-size: 13px; }
.segmented .n { margin-left: 4px; color: var(--muted); }
.segmented button[aria-pressed="true"] .n { color: inherit; opacity: .8; }
/* строка над таблицей: счётчик слева, легенда и кнопки справа; на странице с рядами плашек и сводкой — тот же зазор между блоками */
.toolbar-legend { display: inline-flex; gap: 10px; align-items: center; font-size: 12.5px; color: var(--muted); white-space: nowrap; }
.toolbar > .grow { flex: 1 1 auto; min-width: 0; }
.toolbar input[type=search] { flex: 0 1 280px; min-width: 0; }
/* поиск рядом со «Столбцами» (окно кампании, макет CampaignWindow) */
.stack-gap { display: flex; flex-direction: column; gap: 12px; margin-bottom: 12px; }
.stack-gap > .card { margin: 0; }
@media (max-width: 720px) {
  .toolbar-legend { flex-wrap: wrap; white-space: normal; }
  .toolbar input[type=search] { flex: 1 1 100%; }
}
/* Поля дат (dateField в app.js): видимое «дд.мм.гггг» + кнопка календаря; настоящий input[type=date] невидим и несёт ISO */
.date-field { position: relative; display: inline-flex; align-items: center; gap: 2px; }
.date-field[hidden] { display: none; }
.date-field .date-text { width: 8.6em; min-width: 0; }
.date-field .date-pick { padding: 2px 6px; background: none; border: 0; cursor: pointer; min-height: 0; }
input.date-native { position: absolute; left: 0; top: 0; width: 1px; height: 1px; opacity: 0; pointer-events: none; padding: 0; border: 0; }
#sync-banner .sync-more { margin-top: 4px; font-size: 13px; }
#sync-banner .sync-more summary { cursor: pointer; color: var(--cobalt); }
#sync-banner .sync-more ul { margin: 4px 0 0; padding-left: 18px; max-height: 40vh; overflow: auto; }
/* Скриншоты обращений (Ц2.1): миниатюры формы и вкладки «Обращения»; data: URL, ряд с переносом */
.fb-thumbs { display: flex; flex-wrap: wrap; gap: 8px; }
.fb-thumbs:empty { display: none; }
.fb-thumb { position: relative; width: 96px; height: 72px; border: 1px solid var(--line); border-radius: var(--radius-s); overflow: hidden; background: var(--sheet); }
.fb-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.fb-thumb .fb-x { position: absolute; top: 2px; right: 2px; min-width: 24px; min-height: 24px; padding: 0 6px; line-height: 1; border-radius: 12px; }
@media (max-width: 700px) {
  .fb-thumb .fb-x { min-width: 32px; min-height: 32px; }
}
/* ===== Общее, часть 2: шрифты, каркас (рейка, колонка, холст), колонка фильтров, шапка страницы, окна ===== */
/* «Пульт · Лампа» — второй вид дашборда (спецификация 2026-10-18-pulpit-redesign-design.md, план 1.2).
   Всё под :root, app.css и returns.css не меняются: токены Лампы/Ночи — новые значения прежних имён
   (--ink, --fog, --sheet, --cobalt, …), поэтому правила app.css получают новый вид сами. Макет — docs/ui/proposals/2026-10-18-fresh-look/;
   hex — только в трёх блоках токенов (tests/test_web_pulpit_theme.py). В окне (?embed=1) работают токены и шрифт, высота контролов .filters, button.primary, вид выбранного (button[aria-pressed]) и :focus-visible (так задумано), оболочка — только под body[data-shell].
   Шрифты — @fontsource 5.2.8, OFL (static/fonts/OFL-*.txt). Порог навигации — 860 px (K15). */
@font-face { font-family: "Golos Text"; font-weight: 400; font-display: swap; src: url(/static/fonts/golos-text-cyrillic-400-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 400; font-display: swap; src: url(/static/fonts/golos-text-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
@font-face { font-family: "Golos Text"; font-weight: 500; font-display: swap; src: url(/static/fonts/golos-text-cyrillic-500-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 500; font-display: swap; src: url(/static/fonts/golos-text-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
@font-face { font-family: "Golos Text"; font-weight: 600; font-display: swap; src: url(/static/fonts/golos-text-cyrillic-600-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "Golos Text"; font-weight: 600; font-display: swap; src: url(/static/fonts/golos-text-latin-600-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
@font-face { font-family: "JetBrains Mono"; font-weight: 400; font-display: swap; src: url(/static/fonts/jetbrains-mono-cyrillic-400-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "JetBrains Mono"; font-weight: 400; font-display: swap; src: url(/static/fonts/jetbrains-mono-latin-400-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
@font-face { font-family: "JetBrains Mono"; font-weight: 500; font-display: swap; src: url(/static/fonts/jetbrains-mono-cyrillic-500-normal.woff2) format("woff2"); unicode-range: U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: "JetBrains Mono"; font-weight: 500; font-display: swap; src: url(/static/fonts/jetbrains-mono-latin-500-normal.woff2) format("woff2"); unicode-range: U+0000-00FF, U+2000-206F, U+20AC, U+20BD, U+2212; }
.num, td.num { font-family: "JetBrains Mono", ui-monospace, monospace; }
a.button.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
/* Выбранное в новом виде — приглушённый голубой, не сплошная заливка (button.primary остаётся сплошным) */
button[aria-pressed="true"]:not(.primary) { background: var(--sel); border-color: var(--sel-edge); color: var(--accent-ink); }
/* Переключатель над содержимым страницы — отступ до следующего блока (админка «Люди / Роли / Данные») */
main > .segmented { margin-bottom: 16px; }
/* ----- оболочка: рейка + колонка + холст (<main>) ----- */
body[data-shell="pulpit"] {
  display: grid; grid-template-columns: var(--rail-col) minmax(0, 1fr); align-items: start; min-height: 100vh; padding-bottom: 0;
}
body[data-shell="pulpit"][data-slot="tools"] { grid-template-columns: var(--rail-col) var(--ctx-w) minmax(0, 1fr); }
body[data-shell="pulpit"][data-slot="queue"] { grid-template-columns: var(--rail-col) var(--q-w) minmax(0, 1fr); }
:root[data-tools="collapsed"] body[data-shell="pulpit"][data-slot="tools"] { grid-template-columns: var(--rail-col) minmax(0, 1fr); }
body[data-shell="pulpit"] > nav.rail { grid-column: 1; grid-row: 1; }
body[data-shell="pulpit"] > aside { grid-row: 1; grid-column: 2; display: none; position: sticky; top: 0; height: 100vh; overflow-y: auto; padding: 18px 16px; background: var(--ctx); border-right: 1px solid var(--line); box-shadow: inset 0 3px 0 var(--lamp); }
body[data-shell="pulpit"][data-slot="tools"] > aside.context { display: block; }
body[data-shell="pulpit"][data-slot="queue"] > aside.queue { display: block; }
:root[data-tools="collapsed"] body[data-shell="pulpit"] > aside.context { display: none; }
body[data-shell="pulpit"] > main { grid-row: 1; grid-column: -2; min-width: 0; max-width: none; margin: 0; width: 100%; padding: 24px 28px 32px; background: var(--sheet); min-height: 100vh; }
body[data-shell="pulpit"] > aside:empty { padding: 0; }
/* ----- рейка: список прокручивается внутри, блок пользователя закреплён ----- */
nav.rail { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; background: var(--rail); color: var(--rail-ink); }
nav.rail a, nav.rail button { color: var(--rail-ink); text-decoration: none; }
.rail-brand { flex: none; padding: 18px 18px 14px; font-weight: 600; font-size: 17px; letter-spacing: .01em; }
.rail-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 4px 8px 12px; display: flex; flex-direction: column; gap: 2px; }
.rail-item { position: relative; display: flex; align-items: center; gap: 12px; width: 100%; padding: 8px 10px; min-height: var(--ctl-h);
  border: 0; border-radius: var(--radius-s); background: none; font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
.rail-item:hover, .rail-item:focus-visible { background: var(--rail-on); }
.rail-item .ico { flex: none; width: 24px; height: 24px; color: var(--rail-mute); }
.rail-item.active .ico, .rail-group.active > .rail-item .ico { color: var(--lamp); }
.rail-item.active, .rail-group.active > .rail-item { background: var(--rail-on); font-weight: 500; }
.rail-item.active::before, .rail-group.active > .rail-item::before { content: ""; position: absolute; left: -8px; top: 6px; bottom: 6px; width: 3px; border-radius: 2px; background: var(--lamp); }
.rail-label { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rail-caret::after { content: "▾"; font-size: 11px; color: var(--rail-mute); }
.rail-item[aria-expanded="true"] .rail-caret::after { content: "▴"; }
.rail-group > ul { list-style: none; margin: 0 0 4px; padding: 0 0 0 14px; }
.rail-item[aria-expanded="false"] + ul { display: none; }
.rail-group > ul a { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-radius: var(--radius-s); font-size: 14px; color: var(--rail-mute); }
.rail-group > ul a:hover, .rail-group > ul a:focus-visible { background: var(--rail-on); color: var(--rail-ink); }
.rail-group > ul a.active { color: var(--lamp); font-weight: 500; }
nav.rail .badge { padding: 0 6px; font-size: 12px; line-height: 18px; background: var(--lamp); color: var(--rail); }
.rail-me { flex: none; padding: 10px 12px 14px; border-top: 1px solid var(--rail-on); display: grid; gap: 8px; }
.rail-user { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rail-acts { display: flex; flex-wrap: wrap; gap: 6px; }
.rail-acts button { padding: 4px 10px; font-size: 13px; background: var(--rail-on); border: 1px solid var(--rail-on); border-radius: var(--radius-s); cursor: pointer; }
.rail-acts button:hover { border-color: var(--rail-mute); }
.rail-acts .theme-icon { width: 14px; height: 14px; vertical-align: -2px; }
.rail-acts [data-feedback] .ico { width: 16px; height: 16px; }
nav.rail :focus-visible { outline-color: var(--lamp); }
/* ----- сворачиваемая рейка (2.148, В3; решение 23.10): в сетке — колонка иконок --rail-w-min. Раскрывает только ярлык-стрелка (наведение и Tab — нет).
   ≥1280 раскрытая рейка в сетке (--rail-w, сдвигает холст): html[data-rail="open"] — сервер из ui.rail, pulpit.js; 861–1279 лежит поверх холста
   на nav.rail[data-open] (не запоминается). Одна копия правил раскрытия — на оба атрибута (:is). z-index 20 ниже выпадающих (30),
   нижней панели (40), подписи загрузки (45) и окон .modal (50). ----- */
@media (min-width: 861px) {
  nav.rail { z-index: 20; justify-self: start; width: var(--rail-w-min); transition: width .15s ease, box-shadow .15s ease; }
  .rail-top { display: flex; align-items: center; justify-content: center; flex: none; padding: 14px 6px 8px; overflow: hidden; }
  .rail-me { overflow: hidden; padding: 10px 6px 14px; }
}
/* ярлык со стрелкой на правой границе рейки: наполовину на холсте, по центру экрана; рейка не обрезает (overflow у .rail-top / .rail-me), едет с краем при анимации ширины */
@media (min-width: 861px) {
  .rail-toggle { position: absolute; z-index: 1; top: 50%; right: -7px; transform: translateY(-50%); width: 14px; height: 48px; padding: 0; display: flex; align-items: center; justify-content: center;
    color: var(--rail-mute); background: var(--rail); border: 1px solid var(--rail-on); border-radius: var(--radius-s); cursor: pointer; }
  .rail-toggle::before { content: ""; position: absolute; inset: 0 -9px; }
}
/* зона нажатия 32×48 */
@media (min-width: 861px) {
  .rail-toggle:hover { color: var(--rail-ink); background: var(--rail-on); border-color: var(--rail-mute); }
  .rail-toggle svg { display: block; transition: transform .15s ease; }
  .rail-toggle[aria-expanded="true"] svg { transform: scaleX(-1); }
  .rail-brand { display: block; padding: 0; width: 100%; text-align: center; line-height: var(--ctl-h); }
  .rail-brand-rest { display: none; }
  .rail-list { padding: 4px 6px 12px; overflow-x: hidden; }
  .rail-item.active::before, .rail-group.active > .rail-item::before { left: -6px; }
  .rail-label, .rail-caret, .rail-group > ul, .rail-user { display: none; }
}
/* бейдж заявок на свёрнутой рейке — точка на иконке (K14a) */
@media (min-width: 861px) {
  nav.rail .badge { position: absolute; top: 6px; right: 6px; width: 9px; height: 9px; padding: 0; font-size: 0; line-height: 0; border-radius: 50%; border: 2px solid var(--rail); box-sizing: content-box; }
  .rail-acts { flex-direction: column; align-items: center; }
  .rail-acts > :not([data-theme-toggle]):not([data-feedback]) { display: none; }
  .rail-acts [data-theme-toggle] { font-size: 0; width: var(--ctl-h); padding: 0; display: flex; align-items: center; justify-content: center; }
  .rail-acts .theme-icon { width: 16px; height: 16px; vertical-align: baseline; }
  .rail-acts [data-feedback] { width: var(--ctl-h); padding: 0; display: flex; align-items: center; justify-content: center; }
  .rail-acts [data-feedback] span { display: none; }
}
/* раскрытая */
@media (min-width: 861px) {
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) { width: var(--rail-w); }
  nav.rail[data-open] { box-shadow: 6px 0 24px color-mix(in srgb, var(--rail) 45%, transparent); }
}
/* тень — только у рейки поверх холста */
@media (min-width: 861px) {
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-top { justify-content: flex-start; padding-left: 8px; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-brand { text-align: left; padding: 0 8px; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-brand-rest { display: inline; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-list { padding: 4px 8px 12px; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-item.active::before, :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-group.active > .rail-item::before { left: -8px; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) :is(.rail-label, .rail-user, .rail-caret) { display: block; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .badge { position: static; width: auto; height: auto; padding: 0 6px; font-size: 12px; line-height: 18px; border: 0; border-radius: var(--radius-s); box-sizing: border-box; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-group > ul { display: block; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-item[aria-expanded="false"] + ul { display: none; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-me { padding: 10px 12px 14px; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-acts { flex-direction: row; align-items: stretch; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-acts > :not([data-theme-toggle]):not([data-feedback]) { display: inline-block; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-acts [data-theme-toggle] { font-size: 13px; width: auto; padding: 4px 10px; display: inline-block; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-acts .theme-icon { width: 14px; height: 14px; vertical-align: -2px; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-acts [data-feedback] { width: auto; padding: 4px 10px; display: inline-flex; gap: 4px; }
  :is(nav.rail[data-open], :root[data-rail="open"] nav.rail) .rail-acts [data-feedback] span { display: inline; }
}
/* ≥1280: раскрытая рейка входит в сетку (первая колонка --rail-w), без тени «поверх»; ниже — лежит поверх холста */
@media (min-width: 1280px) {
  :root[data-rail="open"] { --rail-col: var(--rail-w); }
}
@media (prefers-reduced-motion: reduce) {
  nav.rail { transition: none; }
}
@media (max-width: 860px) {
  .rail-toggle { display: none; }
}
/* ----- контролы фильтров: одна высота (R5) ----- */
/* Одна высота контролов на всех панелях (2.148, В5): кнопки, списки и поля; чипы .fchip — метки, остаются мельче; строки очереди .tz-item-b — карточки списка. Проверка — PULPIT_PROBE в tools/ui_audit.py. */
:is(.rail, .context, #queue, .canvas-bar, main .toolbar, main .filters) :is(button, select, input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=file])):not(.fchip):not(.tz-item-b) { min-height: var(--ctl-h); box-sizing: border-box; }
.rail .rail-item { height: var(--ctl-h); }
/* ----- ≤860: рейки и колонки нет, нижняя панель ----- */
@media (max-width: 860px) {
  :root { --tabbar: 64px; }
  nav.tabbar details.more > div [data-feedback] .ico { width: 18px; height: 18px; flex: none; margin-right: 8px; }
}
/* фон body = лист холста: на короткой странице (приёмка, /password) под <main> не видно полосы другого цвета */
@media (max-width: 860px) {
  body[data-shell="pulpit"], body[data-shell="pulpit"][data-slot] { display: block; padding-bottom: calc(var(--tabbar) + 8px); background: var(--sheet); }
  body[data-shell="pulpit"] > nav.rail, body[data-shell="pulpit"] > aside { display: none !important; }
  body[data-shell="pulpit"] > main { padding: 16px; min-height: 0; }
  nav.tabbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; height: var(--tabbar); background: var(--sheet);
    border-top: 1px solid var(--line); z-index: 40; padding-bottom: env(safe-area-inset-bottom); }
  nav.tabbar > a, nav.tabbar summary { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center;
    color: var(--ink); text-decoration: none; font-size: 13px; padding: 4px; list-style: none; cursor: pointer; }
  nav.tabbar > a[aria-current="page"] { color: var(--accent); font-weight: 600; background: var(--accent-soft); }
  nav.tabbar details.more > summary[aria-current="page"] { color: var(--accent); font-weight: 600; background: var(--accent-soft); }
  nav.tabbar details.more { flex: 1; display: flex; }
  nav.tabbar details.more > div { position: fixed; bottom: var(--tabbar); left: 0; right: 0; background: var(--sheet);
    border-top: 1px solid var(--line); display: flex; flex-direction: column; padding: 8px 16px; max-height: calc(100vh - var(--tabbar)); overflow-y: auto; }
  nav.tabbar details.more > div a, nav.tabbar details.more > div button { display: flex; align-items: center; padding: 12px 8px; text-align: left; border: 0;
    border-bottom: 1px solid var(--line); border-radius: 0; background: none; min-height: 44px; color: var(--ink); text-decoration: none; font-size: 15px; }
  nav.tabbar details.more > div a[aria-current="page"] { color: var(--accent); font-weight: 600; background: var(--accent-soft); }
  :root[data-embed] { --tabbar: 0px; }
  :root[data-embed] body { padding-bottom: 0; }
  #loading-note { top: 12px; }
}
/* ----- колонка фильтров: кнопки и строка-сводка (1.3); логика — pulpit.js ----- */
.canvas-bar { display: none; align-items: center; gap: 12px; margin: 0 0 12px; min-width: 0; }
body[data-slot="tools"] .canvas-bar { display: flex; }
.canvas-bar .tools-open { display: none; }
:root[data-tools="collapsed"] .canvas-bar .tools-open { display: inline-block; }
.tools-summary { display: none; color: var(--muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
:root[data-tools="collapsed"] .tools-summary:not(:empty) { display: block; }
.ctx-close { display: block; margin: 0 0 8px auto; }
/* значок «‹» без слова — своя строка над содержимым колонки, не обтекается */
.money-nav { display: flex; flex-direction: column; align-items: stretch; gap: 2px; }
.money-nav a { display: flex; align-items: center; min-height: var(--ctl-h); box-sizing: border-box; padding: 0 10px; border: 1px solid transparent; border-radius: var(--radius-s); color: var(--ink); text-decoration: none; }
.money-nav a:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.money-nav a[aria-current="page"] { background: var(--sel); border-color: var(--sel-edge); color: var(--accent-ink); }
.money-nav a[aria-current="page"]::after { content: "✓"; margin-left: auto; padding-left: 8px; font-size: 12px; color: var(--accent); }
[data-for][hidden] { display: none; }
body[data-shell="pulpit"][data-mode="queue"] > aside.queue { display: block; }
body[data-shell="pulpit"][data-mode="queue"] > aside.context { display: none; }
/* Страница с очередью и вкладками (возвраты, 3.2): data-slot="queue" от сервера, сетку и колонку дальше задаёт режим
   видимой вкладки (data-mode из pulpit.js): queue — список, tools — фильтры (сворачиваются), none — вкладка без колонки */
body[data-shell="pulpit"][data-mode="queue"] { grid-template-columns: var(--rail-col) var(--q-w) minmax(0, 1fr); }
body[data-shell="pulpit"][data-mode="tools"] { grid-template-columns: var(--rail-col) var(--ctx-w) minmax(0, 1fr); }
:root[data-tools="collapsed"] body[data-shell="pulpit"][data-mode="tools"], body[data-shell="pulpit"][data-mode="none"] { grid-template-columns: var(--rail-col) minmax(0, 1fr); }
:root:not([data-tools="collapsed"]) body[data-shell="pulpit"][data-mode="tools"] > aside.context { display: block; }
body[data-shell="pulpit"][data-mode="tools"] > aside.queue, body[data-shell="pulpit"][data-mode="none"] > aside.queue, body[data-shell="pulpit"][data-mode="none"] > aside.context { display: none; }
body[data-mode="tools"] .canvas-bar { display: flex; }
body[data-mode="queue"] .canvas-bar, body[data-mode="none"] .canvas-bar { display: none; }
@media (max-width: 860px) {
  body[data-slot="tools"] .canvas-bar .tools-open { display: inline-block; }
  .tools-summary:not(:empty) { display: block; }
  :root[data-tools-open] body[data-shell="pulpit"][data-slot="tools"] > aside.context { display: block !important; position: static; height: auto; width: auto; border-right: 0; border-bottom: 1px solid var(--line); }
  .ctx-close { display: none; }
  :root[data-tools-open] .ctx-close { display: block; }
  body[data-mode="tools"] .canvas-bar .tools-open { display: inline-block; }
  :root[data-tools-open] body[data-shell="pulpit"][data-mode="tools"] > aside.context { display: block !important; position: static; height: auto; width: auto; border-right: 0; border-bottom: 1px solid var(--line); }
}
/* очередь на узком — список во всю ширину под заголовком и вкладками холста (карточка — окном, NARROW страницы) */
@media (max-width: 860px) {
  body[data-shell="pulpit"][data-slot="queue"] { display: flex; flex-direction: column; align-items: stretch; }
  body[data-shell="pulpit"][data-slot="queue"] > aside.queue { order: -1; }
}
/* действия и поиск колонки — над содержимым холста (ошибки, карточка) */
@media (max-width: 860px) {
  body[data-shell="pulpit"][data-slot="queue"]:not([data-mode="tools"]):not([data-mode="none"]) > aside.queue {
    display: block !important; position: static; height: auto; width: auto; overflow: visible; border-right: 0; box-shadow: none; padding: 0 16px 16px; background: none; }
}
/* 2.148 В7: на ≤860 заголовок на холсте, а очередь стоит над холстом (order:-1) — поднимаем над ней заголовок и вкладки:
     <main> растворяется, его дети — элементы колонки body (поля 16 px вместо padding main; фон body у холста тот же) */
@media (max-width: 860px) {
  body[data-shell="pulpit"][data-slot="queue"] > main { display: contents; }
  body[data-shell="pulpit"][data-slot="queue"] > main > * { margin-left: 16px; margin-right: 16px; min-width: 0; max-width: calc(100% - 32px); }
  body[data-shell="pulpit"][data-slot="queue"] > main > :is(h1, .page-head) { order: -3; margin-top: 16px; }
  body[data-shell="pulpit"][data-slot="queue"] > main > .filters-tight, body[data-shell="pulpit"][data-slot="queue"] > main > .segmented { order: -2; }
  body[data-shell="pulpit"][data-slot="queue"] > main > :last-child:not(script) { margin-bottom: 16px; }
}
/* Ц1.1: заголовок всегда на холсте (guide §1.0); пока колонка открыта, шапка холста пуста (кнопка «Фильтры» и сводка скрыты) — не занимает строку */
@media (min-width: 861px) {
  :root:not([data-tools="collapsed"]) body[data-mode="tools"] > main > .canvas-bar, :root:not([data-tools="collapsed"]) body[data-slot="tools"]:not([data-mode]) > main > .canvas-bar { display: none; }
}
.rail-group > ul .ico { width: 18px; height: 18px; flex: none; }
/* ----- Главная (1.4): доска «работа слева, аномалии и новости справа», новости в <details> ----- */
.tool-group .list.rows > li { flex-wrap: wrap; }
/* 2.148 В3: общие правила app.css «≤900 — одна колонка» в новом виде включаются на ≤860 (порог навигации): на 861–900 возвращаем двухколонную раскладку.
   «≤1240: Готовность под карточкой» (pages.css) оставлена: она считает от ширины холста, а не окна (холст = окно − рейка − колонка) */
@media (min-width: 861px) and (max-width: 900px) {
  .cols { grid-template-columns: 1fr 1fr; }
  .ws-split { grid-template-columns: minmax(260px, 380px) minmax(0, 1fr); }
  .ws-split > .tz-card { position: sticky; }
}
.modal .sk-card-h h2 { display: none; }
#context #period-bar .filters { display: flex; flex-direction: column; align-items: stretch; gap: 10px; min-width: 0; }
/* ----- колонка фильтров: группы «заголовок — варианты» (fb1.2, правило колонки): макрос tool_group в _tools.html ----- */
.context .tool-group { margin: 0 0 18px; min-width: 0; }
.context .tool-group > .tg-title { margin: 0 0 6px; padding-left: 2px; font-size: 11px; line-height: inherit; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--muted); }
.context .tool-group > button, .context .tool-group > select { width: 100%; max-width: 100%; }
.context select { width: 100%; max-width: 100%; min-width: 0; }
.context .tool-group + .tool-group > .tg-title { margin-top: 0; }
.context .segmented { display: flex; flex-direction: column; gap: 2px; width: 100%; max-width: 100%; overflow: visible; }
.context .segmented button { display: flex; align-items: center; width: 100%; margin: 0; padding: 0 10px; border: 1px solid transparent; border-radius: var(--radius-s); background: transparent; text-align: left; white-space: normal; box-shadow: none; }
.context .segmented button:hover:not(:disabled) { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.context .segmented button[aria-pressed="true"]:not(.primary) { background: var(--sel); border-color: var(--sel-edge); color: var(--accent-ink); }
.context .segmented button[aria-pressed="true"]::after { content: "✓"; margin-left: auto; padding-left: 8px; font-size: 12px; color: var(--accent); }
.context .segmented button:disabled { opacity: .5; cursor: default; }
.context .period { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; align-items: stretch; max-width: 100%; min-width: 0; }
.context .period .chips { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; overflow: visible; max-width: 100%; }
.context .period .chips button { margin: 0; padding: 0; justify-content: center; border: 1px solid transparent; border-radius: var(--radius-s); background: transparent; font-variant-numeric: tabular-nums; }
.context .period .chips button:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.context .period .chips button[aria-pressed="true"]:not(.primary), .context .period .chips button.on { background: var(--sel); border-color: var(--sel-edge); color: var(--accent-ink); }
.context .period .chips .d-sfx { display: none; }
.context .period details.dates { display: block; min-width: 0; }
.context .period details.dates[open] { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 4px; font-size: 0; }
.context .period details.dates > * { font-size: 14px; }
.context .period details.dates summary { display: flex; align-items: center; min-height: var(--ctl-h); box-sizing: border-box; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--radius-s); background: var(--sheet); color: var(--muted); cursor: pointer; list-style: none; }
.context .period details.dates summary::-webkit-details-marker { display: none; }
.context .period details.dates summary::before { content: "▸"; margin-right: 6px; }
.context .period details.dates[open] summary { flex: 1 0 100%; color: var(--accent-ink); }
.context .period details.dates[open] summary::before { content: "▾"; }
.context .period details.dates input { flex: 1 0 100%; min-width: 0; max-width: 100%; }
.context label { display: flex; gap: 8px; align-items: center; min-height: var(--ctl-h); padding: 0 8px; border-radius: var(--radius-s); cursor: pointer; }
.context label:hover { background: color-mix(in srgb, var(--ink) 6%, transparent); }
.context .toolbar-legend { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; white-space: normal; padding: 0 2px 8px; }
.context .filters-note { margin: 0; padding: 0 2px; font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
.context .tool-group > .filters-note { margin-top: 8px; }
/* ЮЭ / «Цены и РРЦ», галочки строк (makeTable pick): без рамки вокруг столбца и шапки, чекбокс по центру строки */
.tabulator-row .tabulator-cell.pick-cell { border: 0; }
.tabulator .tabulator-header .pick-cell { border: 0; }
/* чекбокс — по строке текста: ячейка 9+18+9 = 36, строка с границей 37, без выравнивания по базовой линии */
/* закреплённые строки: голубой фон (--sel поверх непрозрачного --sheet: замороженные ячейки наследуют фон строки, полупрозрачный лёг бы дважды) и цветная полоса слева */
.tabulator .tabulator-frozen-rows-holder .tabulator-row .tabulator-cell { background-image: linear-gradient(var(--sel), var(--sel)); }
.tabulator .tabulator-frozen-rows-holder .tabulator-row .tabulator-cell:first-child { box-shadow: inset 3px 0 0 var(--accent); }
/* step7-fix (замечания 1-4, 8-10): правки только нового вида */
/* «Рынок» на узком: «Выгрузка» + select не шире экрана (select раздвигал всю страницу до 434 px) */
@media (max-width: 720px) {
  .toolbar > label:has(> select) { display: flex; align-items: center; gap: 8px; min-width: 0; max-width: 100%; }
  .toolbar > label > select { min-width: 0; flex: 1 1 auto; max-width: 100%; }
}
/* пагинатор на телефоне: Tabulator сам прячет номера страниц, если ряд не влез (оставались «Вперёд» без «2»); «Первая»/«Последняя» убираем, номера помещаются */
@media (max-width: 720px) {
  .tabulator .tabulator-footer .tabulator-page[data-page="first"], .tabulator .tabulator-footer .tabulator-page[data-page="last"] { display: none; }
}
/* InSales на телефоне: вкладки — одна прокручиваемая строка (были три); пояснение очереди — над списком, а не под ним */
@media (max-width: 860px) {
  .segmented.ins-tabs { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 6px; scrollbar-width: thin; padding-bottom: 4px; max-width: 100%; }
  .segmented.ins-tabs > * { flex: 0 0 auto; white-space: nowrap; }
}
.strip { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); margin-bottom: 16px;
  border: 1px solid var(--line); border-radius: var(--radius-m); background: var(--sheet); overflow: hidden; }
.strip .cell { min-width: 0; padding: 12px 16px; border-left: 1px solid var(--grid); }
.strip .cell:first-child { border-left: 0; }
.strip .k { display: block; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 11px; letter-spacing: .06em; text-transform: uppercase; font-weight: 600; color: var(--muted); }
.strip .v { display: block; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "JetBrains Mono", ui-monospace, monospace; font-variant-numeric: tabular-nums; font-size: 22px; font-weight: 600; }
.strip .cap { display: block; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; color: var(--muted); }
.strip .cell.is-empty .v { color: var(--muted); }
.strip .is-loading .k { background: var(--fog); border-radius: 3px; color: transparent; width: 60%; }
.strip .is-loading .v { background: var(--fog); border-radius: 3px; color: transparent; width: 75%; }
.strip .is-loading .cap { background: var(--fog); border-radius: 3px; color: transparent; width: 45%; }
@media (max-width: 1180px) {
  .strip .cell { padding: 10px 12px; }
  .strip .v { font-size: 18px; }
}
/* по две в ряд */
@media (max-width: 720px) {
  .strip { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .strip .cell:nth-child(odd) { border-left: 0; }
  .strip .cell:nth-child(n+3) { border-top: 1px solid var(--grid); }
}
/* Форма «Сообщить» (Ц2.1, feedback.js): окно поверх, зона скриншотов, подсветка при перетаскивании */
.fb-form { display: flex; flex-direction: column; gap: 12px; }
.fb-l { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--muted); }
.fb-text { min-height: 120px; resize: vertical; color: var(--ink); font-size: 15px; }
.fb-zone { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 12px; border: 1px dashed var(--line); border-radius: var(--radius-s); }
.fb-hint { font-size: 13px; color: var(--muted); }
.dialog.fb-drop .fb-zone { border-color: var(--accent); background: var(--accent-soft); }
.fb-err:empty { display: none; }
.fb-fails ul { margin: 4px 0 8px; padding-left: 20px; }
.fb-acts { display: flex; flex-wrap: wrap; gap: 8px; }
.dialog-acts [data-feedback] .ico { width: 16px; height: 16px; }
@media (max-width: 700px) {
  .fb-acts .primary { flex: 1 1 100%; }
}
/* «← Юнит-экономика» на «Акциях»: тихая ссылка возврата, не синяя подчёркнутая (разбор impeccable, 24.10) */
a.back:not(.back-list) { color: var(--muted); text-decoration: none; font-size: 14px; }
a.back:not(.back-list):hover, a.back:not(.back-list):focus-visible { color: var(--ink); text-decoration: underline; }
/* тень у края широкой таблицы (makeTable и «P&L по месяцам»): есть продолжение справа/слева — край затенён; JS (edgeShadow, app.js) только
   ставит класс .on, сама тень — чистый CSS поверх таблицы и не ловит клики (pointer-events: none) */
.sh-host { position: relative; }
.edge-sh { position: absolute; top: 0; bottom: 0; width: 22px; z-index: 5; pointer-events: none; opacity: 0; transition: opacity .15s; }
.edge-sh.on { opacity: 1; }
.edge-sh.r { right: 0; background: linear-gradient(to left, var(--edge-sh), transparent); border-radius: 0 var(--radius-m) var(--radius-m) 0; }
.edge-sh.l { left: 0; background: linear-gradient(to right, var(--edge-sh), transparent); border-radius: var(--radius-m) 0 0 var(--radius-m); }
.edge-sh.l.past-frozen { border-radius: 0; }
/* левая тень — от правого края закреплённых столбцов (left ставит edgeShadow) */
@media (prefers-reduced-motion: reduce) {
  .edge-sh { transition: none; }
}
/* окно запуска на телефоне: кнопки шапки компактной строкой с переносом, «Отменить запуск» — отдельно и последней (guide §7) */
@media (max-width: 700px) {
  #ln-acts { gap: 6px; }
  #ln-acts > button, #ln-acts > a.button { flex: 0 1 auto; min-height: 36px; padding: 6px 12px; font-size: 14px; }
  #ln-acts > label { flex: 1 1 100%; }
  #ln-acts > #l-cancel { flex: 0 0 auto; order: 99; margin-top: 4px; }
}
/* Ц1.1: шапка страницы (макрос page_head, T/_parts.html) и строка над таблицей (.tbar, makeTable bar) */
.page-head { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin: 0 0 12px; }
.page-head h1 { margin: 0; margin-right: auto; font-size: 24px; line-height: 1.25; font-weight: 600; letter-spacing: -.01em; }
.page-head .ph-meta { margin-right: auto; color: var(--muted); font-size: 13px; }
.page-head h1:has(+ .ph-meta) { margin-right: 0; }
.page-head .ph-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; min-width: 0; }
/* не помещаются — вся полоса второй строкой (flex-wrap), без прокрутки вбок */
.page-head .ph-tabs a { color: var(--muted); text-decoration: none; padding: 4px 0; }
.page-head .ph-tabs a[aria-current], .page-head .ph-tabs a.active { color: var(--accent-ink); font-weight: 600; }
.page-head .ph-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.page-head .ph-secondary { display: inline-flex; gap: 8px; }
.page-head .ph-more-sec { display: none; }
.page-head details.ph-more-only-sec { display: none; }
/* «Ещё» без своих пунктов нужно только на телефоне */
.page-head a.button { display: inline-flex; align-items: center; min-height: var(--ctl-h); box-sizing: border-box; text-decoration: none; }
.tbar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 12px; margin: 0 0 8px; }
.tbar .tbar-count { margin-right: auto; color: var(--muted, inherit); }
.tbar .tbar-acts { display: flex; align-items: center; gap: 8px; }
.tbar a.button { display: inline-flex; align-items: center; min-height: var(--ctl-h); box-sizing: border-box; text-decoration: none; }
/* ----- телефон: шапка окна семейства, сводка ЮЭ, окно записи в акцию (правки владельца после Ц1.1) ----- */
/* окно «Семейство»: подпись и название — на всю ширину шапки, «Исследовать вручную…» — строкой ниже; × остаётся справа сверху */
@media (max-width: 720px) {
  .dialog-head:has(#manual-research) h3 { flex: 1 1 100%; min-width: 0; }
  .dialog-head:has(#manual-research) .dialog-acts { flex: 1 1 100%; }
  main h1 { font-size: 24px; }
}
/* guide §1.0: 24 px и на телефоне, у всех страниц (перебивает h1 { 20px } старого вида) */
@media (max-width: 720px) {
  .page-head .ph-secondary { display: none; }
  .page-head .ph-more-sec { display: block; }
  .page-head details.ph-more-only-sec { display: inline-flex; }
  .page-head .ph-actions { order: 2; margin-left: auto; }
  /* «Ещё» всегда у правого края, даже перенесённая на свою строку: меню right:0 иначе уходит за левый край */
  .page-head .ph-actions > details.tool-more { margin-left: auto; }
  .page-head .ph-tabs { order: 3; flex-basis: 100%; }
}
.context .segmented button:has(.n)[aria-pressed="true"]::after { margin-left: 0; }
.strip .cell.cell-note { align-self: center; }
.strip .cell.cell-note .cap { white-space: normal; overflow: visible; }
/* Ц1.1 Деньги, правка по ревью: поиск и чипы — без отдельной карточки (guide §1.0 п. 5); поиск живёт в .tbar (tbarSetup, bar.search) */
.tbar input[type="search"] { flex: 0 1 280px; min-width: 140px; }
section.fchips:not(.card) { padding: 0; }
.stack-gap > .sumbar { padding-inline: 8px; }

/* Плашка «ДЕМО» (З2.11): только при OZON_DEMO_STAND=1, разметка — templates/_demo_banner.html */
.demo-banner { position: fixed; top: 0; left: 0; right: 0; z-index: 45; padding: 4px 12px; background: var(--lamp); color: var(--rail); font-size: 13px; font-weight: 600; line-height: 1.4; text-align: center; }
/* высота плашки — --demo-h (мерит скрипт в _demo_banner.html; запас — на случай без JS): сдвигает холст, рейку и колонки; окна (.modal, z 50) плашка не перекрывает */
html[data-demo] { --demo-h: 28px; }
@media (max-width: 720px) { html[data-demo] { --demo-h: 48px; } }
html[data-demo] body { padding-top: var(--demo-h); }
html[data-demo] body[data-shell="pulpit"] > aside { top: var(--demo-h); height: calc(100vh - var(--demo-h)); }
@media (min-width: 861px) { html[data-demo] nav.rail { top: var(--demo-h); height: calc(100vh - var(--demo-h)); } }