/* Партнёрский кабинет SIION. Служебный финансовый экран: цифры читаются раньше всего остального.
   Шрифты и зелёный - с сайта SIION (Golos Text для текста и цифр, Roboto Condensed для заголовков
   и шапок колонок). Отрицательные суммы - обычным цветом (их большинство), цвет только у итогов. */

@font-face {
  font-family: "Golos Text";
  src: url("fonts/golostext-var.woff2") format("woff2-variations"), url("fonts/golostext-var.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto Condensed";
  src: url("fonts/robotocondensed-var.woff2") format("woff2-variations"), url("fonts/robotocondensed-var.woff2") format("woff2");
  font-weight: 300 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-text: "Golos Text", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-head: "Roboto Condensed", "Golos Text", system-ui, Arial, sans-serif;
  --font-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --text-xs:   clamp(0.75rem,  0.7rem  + 0.25vw, 0.8125rem);
  --text-sm:   clamp(0.8125rem, 0.78rem + 0.2vw, 0.9375rem);
  --text-base: clamp(0.9375rem, 0.9rem + 0.2vw, 1rem);
  --text-lg:   clamp(1.0625rem, 1rem   + 0.4vw, 1.25rem);
  --text-xl:   clamp(1.5rem,   1.3rem  + 1vw,   2rem);
  --text-2xl:  clamp(1.75rem,  1.4rem  + 1.6vw, 2.5rem);
  --text-table: clamp(0.8125rem, 0.79rem + 0.1vw, 0.875rem);

  --space-1: 0.25rem;  --space-2: 0.5rem;   --space-3: 0.75rem;
  --space-4: 1rem;     --space-5: 1.25rem;  --space-6: 1.5rem;
  --space-8: 2rem;     --space-12: 3rem;    --space-16: 4rem;

  --radius-sm: 0.375rem; --radius-md: 0.5rem; --radius-lg: 0.75rem; --radius-full: 9999px;
  --tap: 2.75rem;
  --tap-sm: 2.25rem;
  --wrap: 96rem;
  --measure: 72ch;
  --col-name: 10.5rem;
  --name-lines: 3;
  --transition: 180ms cubic-bezier(0.16, 1, 0.3, 1);

  --color-bg:          #f5f8f6;
  --color-surface:     #ffffff;
  --color-surface-2:   #f7faf8;
  --color-surface-3:   #eef3f0;
  --color-border:      #dbe3de;
  --color-border-strong: #c3cfc8;
  --color-text:        #16211b;
  --color-text-2:      #33413a;
  --color-text-muted:  #56645c;
  --color-text-faint:  #8b978f;
  --color-primary:     #00794a;
  --color-primary-hover: #005c39;
  --color-primary-active: #004a2e;
  --color-primary-hl:  #e3f3ea;
  --color-on-primary:  #ffffff;
  --color-success:     #00794a;
  --color-error:       #b3261e;
  --color-error-bg:    #fdecea;
  --color-warning:     #8a5300;
  --color-warning-bg:  #fff3d6;
  --color-focus:       #0b6bcb;
  --color-split-a:     #00a65c;
  --color-split-b:     #a9c7b7;
  --shadow-sm: 0 1px 2px oklch(0.2 0.02 160 / 0.06);
  --shadow-md: 0 4px 14px oklch(0.2 0.02 160 / 0.08);
  color-scheme: light;
}

[data-theme="dark"] {
  --color-bg:          #111613;
  --color-surface:     #171e1a;
  --color-surface-2:   #1b231f;
  --color-surface-3:   #212b26;
  --color-border:      #2b3631;
  --color-border-strong: #3c4a43;
  --color-text:        #e4ebe7;
  --color-text-2:      #c3cdc7;
  --color-text-muted:  #9aa8a1;
  --color-text-faint:  #6f7c75;
  --color-primary:     #57d29a;
  --color-primary-hover: #7fe0b4;
  --color-primary-active: #a2ebc9;
  --color-primary-hl:  #1d3a2c;
  --color-on-primary:  #08130d;
  --color-success:     #57d29a;
  --color-error:       #ff8f86;
  --color-error-bg:    #3a1d1b;
  --color-warning:     #f2c14e;
  --color-warning-bg:  #352a12;
  --color-focus:       #7cb8ff;
  --color-split-a:     #3fc487;
  --color-split-b:     #3a5446;
  --shadow-sm: 0 1px 2px oklch(0 0 0 / 0.3);
  --shadow-md: 0 4px 14px oklch(0 0 0 / 0.35);
  color-scheme: dark;
}

/* ---------------------------------------------------------------- база */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body {
  margin: 0;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-text);
  font-size: var(--text-base);
  line-height: 1.5;
}
h1, h2, h3 { font-family: var(--font-head); line-height: 1.2; margin: 0; }
p { margin: 0; }
a { color: var(--color-primary); text-underline-offset: 0.15em; }
a:hover { color: var(--color-primary-hover); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--color-focus);
  outline-offset: 2px;
}
code, .mono { font-family: var(--font-mono); font-size: 0.92em; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.muted { color: var(--color-text-muted); }
.small { font-size: var(--text-sm); }
.nowrap { white-space: nowrap; }
.strong { font-weight: 600; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.skip { position: absolute; left: var(--space-2); top: calc(-1 * var(--space-16)); z-index: 10; background: var(--color-surface); padding: var(--space-2) var(--space-3); border-radius: var(--radius-md); }
.skip:focus { top: var(--space-2); }

.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--space-4); }

/* ---------------------------------------------------------------- шапка */
.top { background: var(--color-surface); border-bottom: 1px solid var(--color-border); }
.top__bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); padding-block: var(--space-3); }
.brand { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--color-text); text-decoration: none; min-height: var(--tap); }
.brand:hover { color: var(--color-text); }
.brand__mark { color: var(--color-primary); flex: none; }
.brand__name { font-family: var(--font-head); font-weight: 700; font-size: var(--text-lg); letter-spacing: 0.04em; }
.brand__sub { color: var(--color-text-muted); font-size: var(--text-sm); display: none; }
.top__user { display: flex; align-items: center; gap: var(--space-2); }
.top__user form { margin: 0; }
.top__login { color: var(--color-text-muted); font-size: var(--text-sm); }

.top__scope { padding-bottom: var(--space-2); }
.scope { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-6); font-size: var(--text-sm); }
.scope__item, .scope__form { display: inline-flex; align-items: center; gap: var(--space-2); margin: 0; min-height: var(--tap-sm); }
.scope__label { color: var(--color-text-muted); }
.scope__value { font-weight: 600; }
.scope__select { min-height: var(--tap-sm); padding: 0 var(--space-6) 0 var(--space-2); border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: var(--color-surface); color: var(--color-text); font: inherit; font-weight: 600; }

.tabs { margin-bottom: -1px; }
.tabs__list { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--space-1); overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; }
.tabs__list::-webkit-scrollbar { display: none; }
.tabs__link {
  display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 var(--space-3);
  color: var(--color-text-2); text-decoration: none; white-space: nowrap; font-weight: 500;
  border-bottom: 3px solid transparent; transition: color var(--transition), border-color var(--transition);
}
.tabs__link:hover { color: var(--color-text); border-bottom-color: var(--color-border-strong); }
.tabs__link[aria-current="page"] { color: var(--color-primary); border-bottom-color: var(--color-primary); font-weight: 600; }

/* ---------------------------------------------------------------- страница */
.main { flex: 1; padding-block: var(--space-6) var(--space-12); display: flex; flex-direction: column; gap: var(--space-4); }
.head { display: flex; flex-direction: column; gap: var(--space-1); }
.head__title { font-size: var(--text-xl); font-weight: 700; }
.head__lead { color: var(--color-text-muted); font-size: var(--text-sm); }
.foot { padding-block: var(--space-4) var(--space-6); color: var(--color-text-faint); font-size: var(--text-xs); border-top: 1px solid var(--color-border); }

/* ---------------------------------------------------------------- кнопки и поля */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: var(--tap); padding: 0 var(--space-4); border: 1px solid var(--color-primary); border-radius: var(--radius-md);
  background: var(--color-primary); color: var(--color-on-primary); font: inherit; font-weight: 600; text-decoration: none;
  cursor: pointer; transition: background var(--transition), border-color var(--transition), color var(--transition);
}
.btn:hover { background: var(--color-primary-hover); border-color: var(--color-primary-hover); color: var(--color-on-primary); }
.btn:active { background: var(--color-primary-active); border-color: var(--color-primary-active); }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }
.btn.is-loading { opacity: 0.7; cursor: progress; }
.btn--ghost { background: transparent; color: var(--color-primary); border-color: var(--color-border-strong); }
.btn--ghost:hover { background: var(--color-primary-hl); color: var(--color-primary-hover); border-color: var(--color-primary); }
.btn--ghost:active { background: var(--color-primary-hl); color: var(--color-primary-active); }
.btn--small { min-height: var(--tap-sm); padding: 0 var(--space-3); font-size: var(--text-sm); }
.btn--wide { width: 100%; }
.icon-btn { display: inline-flex; align-items: center; justify-content: center; width: var(--tap-sm); height: var(--tap-sm); border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); background: transparent; color: var(--color-text-2); cursor: pointer; }
.icon-btn:hover { color: var(--color-text); background: var(--color-surface-3); }
.icon-btn:active { background: var(--color-border); }
.link-btn { min-height: var(--tap-sm); padding: 0 var(--space-1); border: 0; background: none; color: var(--color-primary); font: inherit; font-size: var(--text-sm); text-decoration: underline; text-underline-offset: 0.15em; cursor: pointer; }
.link-btn:hover { color: var(--color-primary-hover); }
.link-btn:active { color: var(--color-primary-active); }

.field { display: flex; flex-direction: column; gap: var(--space-1); min-width: 0; }
.field__label { font-size: var(--text-xs); color: var(--color-text-muted); }
.input {
  min-height: var(--tap); width: 100%; padding: 0 var(--space-3); border: 1px solid var(--color-border-strong); border-radius: var(--radius-md);
  background: var(--color-surface); color: var(--color-text); font: inherit; font-size: var(--text-base);
}
.input:hover { border-color: var(--color-text-faint); }
.input:focus-visible { border-color: var(--color-focus); }
.input:disabled { opacity: 0.55; }
.input.is-error, .input:user-invalid { border-color: var(--color-error); }
select.input { padding-right: var(--space-8); }
.input--num { text-align: right; font-variant-numeric: tabular-nums; min-width: 6.5rem; }
.input--date { min-width: 9.5rem; }

.flash { padding: var(--space-3) var(--space-4); border-radius: var(--radius-md); font-size: var(--text-sm); border: 1px solid transparent; }
.flash--ok { background: var(--color-primary-hl); color: var(--color-text); border-color: var(--color-primary); }
.flash--error { background: var(--color-error-bg); color: var(--color-error); border-color: var(--color-error); }

/* ---------------------------------------------------------------- панель периода */
.bar { display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); }
.bar__period { display: flex; flex-direction: column; gap: var(--space-3); }
.bar__dates { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
.bar__filters { display: grid; grid-template-columns: minmax(6rem, 2fr) minmax(0, 5fr); gap: var(--space-2); }
.bar .btn { width: 100%; }
.seg { display: flex; border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); overflow: hidden; }
.seg__item, .seg__step {
  display: inline-flex; align-items: center; justify-content: center; min-height: var(--tap); padding: 0 var(--space-3);
  color: var(--color-text-2); text-decoration: none; font-weight: 500; background: var(--color-surface);
  transition: background var(--transition), color var(--transition);
}
.seg__item { flex: 1; border-left: 1px solid var(--color-border); }
.seg__step { flex: none; width: var(--tap); padding: 0; }
.seg__step + .seg__item { border-left: 1px solid var(--color-border-strong); }
.seg__item + .seg__step { border-left: 1px solid var(--color-border-strong); }
.seg__item:hover, .seg__step:hover { background: var(--color-surface-3); color: var(--color-text); }
.seg__item:active, .seg__step:active { background: var(--color-border); }
.seg__item[aria-current="true"] { background: var(--color-primary); color: var(--color-on-primary); }

/* ---------------------------------------------------------------- карточки */
.card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-4); display: flex; flex-direction: column; gap: var(--space-3); min-width: 0; }
.card__title { font-size: var(--text-lg); font-weight: 600; }
.card--warn { background: var(--color-warning-bg); border-color: var(--color-warning); }
.card--warn .card__title { color: var(--color-warning); }
.big { font-size: var(--text-2xl); font-weight: 700; line-height: 1.1; text-align: left; }

.note { color: var(--color-text-muted); font-size: var(--text-sm); max-width: var(--measure); }
.empty { padding: var(--space-8) var(--space-4); text-align: center; background: var(--color-surface); border: 1px dashed var(--color-border-strong); border-radius: var(--radius-lg); display: flex; flex-direction: column; gap: var(--space-2); align-items: center; }
.empty__title { font-size: var(--text-lg); }
.empty p { color: var(--color-text-muted); max-width: var(--measure); }

.flag { display: inline-block; margin-left: var(--space-2); padding: 0 var(--space-2); border-radius: var(--radius-full); background: var(--color-warning-bg); color: var(--color-warning); font-family: var(--font-text); font-size: var(--text-xs); font-weight: 600; line-height: 1.6; white-space: nowrap; vertical-align: 0.1em; }
.flag--cell { margin-left: 0; }
.prod .flag { margin: var(--space-1) 0 0; }
.prod .inline-form { margin-top: var(--space-1); }
.prod .link-btn { min-height: var(--space-6); padding: 0; font-size: var(--text-xs); }

/* ---------------------------------------------------------------- 1. Итоги */
.sum { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.side { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }
.casc { width: 100%; border-collapse: collapse; font-size: var(--text-sm); }
.casc thead th { font-family: var(--font-head); font-weight: 500; color: var(--color-text-muted); font-size: var(--text-xs); padding: 0 0 var(--space-2); border-bottom: 1px solid var(--color-border); }
.casc th, .casc td { padding: var(--space-2) 0; vertical-align: baseline; }
.casc td.num { padding-left: var(--space-2); }
.casc__label { text-align: left; font-weight: 400; overflow-wrap: anywhere; }
.casc__hint { display: block; color: var(--color-text-muted); font-size: var(--text-xs); font-weight: 400; }
.casc__pct { color: var(--color-text-muted); font-size: var(--text-xs); width: 3.75rem; }
.casc .casc__pct { padding-left: var(--space-2); }
.casc__row { border-top: 1px solid var(--color-surface-3); }
.casc__part th, .casc__part td { padding-block: var(--space-1); font-size: var(--text-xs); color: var(--color-text-muted); }
.casc__part .casc__label { padding-left: var(--space-4); }
.casc__section th { padding: var(--space-4) 0 var(--space-1); text-align: left; font-family: var(--font-head); font-size: var(--text-sm); font-weight: 600; color: var(--color-text-2); letter-spacing: 0.02em; }
tbody:first-of-type .casc__section th { padding-top: var(--space-2); }
.casc__base th, .casc__base td { font-weight: 600; }
.casc__sub { border-top: 1px solid var(--color-border-strong); }
.casc__sub th, .casc__sub td { font-weight: 700; padding-block: var(--space-2) var(--space-3); }
.casc__sub .is-neg, .casc__total .is-neg { color: var(--color-error); }
.casc__sub .is-pos, .casc__total .is-pos { color: var(--color-success); }
.casc__total { border-top: 3px double var(--color-border-strong); }
.casc__total th, .casc__total td { font-weight: 700; font-size: var(--text-lg); padding-top: var(--space-3); }
.casc__total .casc__pct { font-size: var(--text-xs); font-weight: 500; }
.casc .is-warn th, .casc .is-warn td { background: var(--color-warning-bg); }
.casc .is-zero { color: var(--color-text-faint); }

.kv { margin: 0; display: flex; flex-direction: column; }
.kv__row { display: flex; justify-content: space-between; align-items: baseline; gap: var(--space-3); padding-block: var(--space-2); border-top: 1px solid var(--color-surface-3); }
.kv__row:first-child { border-top: 0; }
.kv dt { color: var(--color-text-muted); font-size: var(--text-sm); }
.kv dd { margin: 0; font-weight: 600; }
.split { display: block; width: 100%; height: var(--space-2); border-radius: var(--radius-full); overflow: hidden; }
.split__a { fill: var(--color-split-a); }
.split__b { fill: var(--color-split-b); }
.split__legend { font-size: var(--text-xs); color: var(--color-text-muted); display: flex; align-items: center; gap: var(--space-1); flex-wrap: wrap; }
.dot { display: inline-block; width: var(--space-2); height: var(--space-2); border-radius: var(--radius-full); margin-left: var(--space-2); }
.dot:first-child { margin-left: 0; }
.dot--a { background: var(--color-split-a); }
.dot--b { background: var(--color-split-b); }

/* ---------------------------------------------------------------- таблицы */
.tablehead { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--space-3); }
.tablewrap { position: relative; overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); max-width: 100%; }
.tablewrap--plain { background: none; border: 0; border-radius: 0; }
.grid { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--text-table); }
.grid th, .grid td { padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--color-surface-3); vertical-align: baseline; text-align: left; }
.grid thead th { font-family: var(--font-head); font-weight: 500; color: var(--color-text-muted); background: var(--color-surface-2); border-bottom: 1px solid var(--color-border); vertical-align: bottom; line-height: 1.25; }
.grid .num { text-align: right; }
.grid thead th.num { white-space: normal; }
.grid tbody th { font-weight: 400; }
.grid tbody tr:hover > * { background: var(--color-surface-2); }
.grid tfoot th, .grid tfoot td { font-weight: 700; background: var(--color-surface-2); border-top: 1px solid var(--color-border-strong); border-bottom: 0; }
.grid .sticky { position: sticky; left: 0; z-index: 1; background: var(--color-surface); box-shadow: 1px 0 0 var(--color-border); }
.grid thead .sticky, .grid tfoot .sticky { background: var(--color-surface-2); z-index: 2; }
.grid tbody tr:hover > .sticky { background: var(--color-surface-2); }
.grid .is-zero { color: var(--color-text-faint); }
.grid .strong.is-neg { color: var(--color-error); }
.grid .strong.is-pos { color: var(--color-success); }
.grid td.is-warn { background: var(--color-warning-bg); }
.grid tr.is-hidden > * { color: var(--color-text-faint); }
.grid tr.is-saved > * { background: var(--color-primary-hl); }
.prod { min-width: var(--col-name); max-width: var(--col-name); white-space: normal; }
.prod__name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--name-lines); line-clamp: var(--name-lines); overflow: hidden; font-weight: 500; color: var(--color-text); text-decoration: none; }
a.prod__name { min-height: var(--space-6); }
a.prod__name:hover { color: var(--color-primary); text-decoration: underline; }
.prod__meta { display: block; color: var(--color-text-muted); font-size: var(--text-xs); }
.prodcell { min-width: 12rem; max-width: 16rem; }
.clamp { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; overflow: hidden; }
.detail { min-width: 18rem; color: var(--color-text-2); }
.sort { color: inherit; text-decoration: none; display: inline-flex; gap: var(--space-1); align-items: flex-end; min-height: var(--space-6); min-width: var(--space-6); }
.cell-link { display: inline-flex; align-items: center; min-height: var(--space-6); }
.sort:hover { color: var(--color-text); text-decoration: underline; }
.sort.is-active { color: var(--color-text); font-weight: 600; }
.sort__arrow { font-family: var(--font-text); }
.inline-form { margin: 0; }
.grid--costs td { vertical-align: middle; }
.grid--costs .input--num { width: 100%; }
/* себестоимость на телефоне - карточка на товар: таблица с полями ввода в горизонтальной прокрутке неудобна */
@media (max-width: 39.99em) {
  .grid--costs, .grid--costs tbody { display: block; }
  .grid--costs thead { display: none; }
  .grid--costs tr { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2) var(--space-3); padding: var(--space-3); border-bottom: 1px solid var(--color-border); }
  .grid--costs th, .grid--costs td { display: flex; flex-direction: column; gap: var(--space-1); padding: 0; border: 0; }
  .grid--costs th { align-items: flex-start; }
  .grid--costs .sticky { position: static; grid-column: 1 / -1; max-width: none; min-width: 0; box-shadow: none; background: none; }
  .grid--costs td[data-label]::before { content: attr(data-label); font-size: var(--text-xs); color: var(--color-text-muted); }
  .grid--costs .input--num, .grid--costs .input--date { max-width: none; min-width: 0; min-height: var(--tap); }
  .grid--costs td.costs__save { justify-content: flex-end; }
  .grid--costs td.costs__save .btn { width: 100%; min-height: var(--tap); }
  .grid--costs tbody tr:hover > * { background: none; }
}
.grid--costs .input { min-height: var(--tap-sm); font-size: var(--text-table); }
.grid--costs .input--num { min-width: 5.5rem; max-width: 7rem; }
.grid--costs .input--date { min-width: 9rem; max-width: 10rem; }
.more { display: flex; flex-direction: column; gap: var(--space-3); }
.more__summary { cursor: pointer; min-height: var(--tap); display: flex; align-items: center; padding: 0 var(--space-4); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); color: var(--color-primary); font-weight: 600; }
.more__summary:hover { border-color: var(--color-primary); }
.more[open] > .more__summary { margin-bottom: var(--space-3); }
.more__summary::-webkit-details-marker { display: none; }
.more__summary::after { content: "показать"; margin-left: auto; padding-left: var(--space-3); font-weight: 400; font-size: var(--text-sm); color: var(--color-text-muted); }
.more[open] > .more__summary::after { content: "свернуть"; }
.hist summary { cursor: pointer; color: var(--color-primary); font-size: var(--text-xs); min-height: var(--space-6); }
.hist ul { margin: var(--space-1) 0 0; padding-left: var(--space-4); font-size: var(--text-xs); color: var(--color-text-muted); }

.search { display: flex; align-items: flex-end; gap: var(--space-2); margin: 0; flex: 1 1 18rem; max-width: 32rem; }
.search .field { flex: 1; }
.pager { display: flex; align-items: center; justify-content: center; gap: var(--space-3); font-size: var(--text-sm); }
.pager__link { display: inline-flex; align-items: center; min-height: var(--tap); padding: 0 var(--space-4); border: 1px solid var(--color-border-strong); border-radius: var(--radius-md); text-decoration: none; background: var(--color-surface); }
.pager__link:hover { background: var(--color-primary-hl); }
.pager__link.is-off { color: var(--color-text-faint); background: transparent; }
.pager__info { color: var(--color-text-muted); }

/* ---------------------------------------------------------------- 4. Подозрительное */
.anom-sum { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
.anom-chip { display: grid; grid-template-columns: 1fr auto; gap: 0 var(--space-3); padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius-lg); background: var(--color-surface); color: var(--color-text); text-decoration: none; min-height: var(--tap); }
.anom-chip:hover { border-color: var(--color-primary); color: var(--color-text); }
.anom-chip:active { background: var(--color-primary-hl); }
.anom-chip.is-active { border-color: var(--color-primary); box-shadow: inset 0 0 0 1px var(--color-primary); background: var(--color-primary-hl); }
.anom-chip.is-empty { color: var(--color-text-muted); }
.anom-chip__label { font-weight: 600; font-size: var(--text-sm); grid-column: 1 / -1; }
.anom-chip__n { font-size: var(--text-sm); color: var(--color-text-muted); text-align: left; }
.anom-chip__label { align-self: start; }
.anom-chip__sum { font-weight: 600; font-size: var(--text-sm); }
.anom__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: var(--space-1) var(--space-4); }
.anom__total { font-size: var(--text-sm); color: var(--color-text-muted); }
.anom__what { font-size: var(--text-sm); max-width: var(--measure); }
.anom__todo { color: var(--color-text-muted); }

/* ---------------------------------------------------------------- 6. Кабинеты */
.two { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); align-items: start; }
.stack { display: flex; flex-direction: column; gap: var(--space-3); margin: 0; }
.row2 { display: grid; grid-template-columns: 1fr; gap: var(--space-3); }
.code { margin: 0; padding: var(--space-3); background: var(--color-surface-3); border-radius: var(--radius-md); font-family: var(--font-mono); font-size: var(--text-xs); overflow-x: auto; white-space: pre; }
.status { display: inline-flex; align-items: center; gap: var(--space-2); white-space: nowrap; }
.status::before { content: ""; width: var(--space-2); height: var(--space-2); border-radius: var(--radius-full); background: var(--color-text-faint); flex: none; }
.status.is-ok::before { background: var(--color-split-a); }
.status.is-late::before { background: var(--color-warning); }

/* ---------------------------------------------------------------- вход и ошибки */
.auth { justify-content: center; align-items: center; padding: var(--space-4); }
.auth__box { width: 100%; max-width: 26rem; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-6); display: flex; flex-direction: column; gap: var(--space-4); box-shadow: var(--shadow-md); }
.brand--auth { min-height: 0; }
.auth__title { font-size: var(--text-xl); font-weight: 700; }
.auth__lead { color: var(--color-text-muted); font-size: var(--text-sm); }
.auth__code { font-family: var(--font-head); font-size: var(--text-2xl); font-weight: 700; color: var(--color-text-faint); text-align: left; }
.auth__foot { border-top: 1px solid var(--color-border); padding-top: var(--space-3); }

/* самые узкие телефоны (меньше 360): доля от выручки уступает место сумме */
@media (max-width: 22.4em) {
  .casc .casc__pct { display: none; }
}

/* ---------------------------------------------------------------- шире телефона */
@media (min-width: 40em) {
  .wrap { padding-inline: var(--space-6); }
  .brand__sub { display: inline; }
  .bar__filters { grid-template-columns: minmax(8rem, 12rem) minmax(0, 1fr); }
  .row2 { grid-template-columns: 1fr 1fr; }
  .anom-sum { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 64em) {
  .wrap { padding-inline: var(--space-8); }
  .bar { flex-direction: row; flex-wrap: wrap; align-items: flex-end; }
  .bar__period { flex-direction: row; align-items: flex-end; }
  .seg { width: auto; }
  .seg__item { flex: none; padding: 0 var(--space-4); }
  .bar__dates { grid-template-columns: auto auto; }
  .bar__filters { flex: 1; grid-template-columns: minmax(8rem, 10rem) minmax(12rem, 1fr); }
  .bar .btn { width: auto; }
  .sum { grid-template-columns: minmax(0, 1fr) minmax(17rem, 22rem); }
  .side { position: sticky; top: var(--space-4); }
  .casc-card { padding: var(--space-6); }
  .two { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .grid th, .grid td { padding-inline: var(--space-2); }
  .grid .sticky { padding-left: var(--space-3); }
  :root { --col-name: 12rem; --name-lines: 2; --text-table: 0.8125rem; }
}
@media (min-width: 80em) {
  .anom-sum { grid-template-columns: repeat(6, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
@media print {
  .top, .bar, .foot, .inline-form, .tablehead form, .pager { display: none !important; }
  body { background: #fff; }
  .tablewrap { overflow: visible; border: 0; }
}