/* ============================================================
   Дизайн-система «Сталь» — ПЛОСКАЯ сборка для пакета разработки.
   Все токены (tokens/*.css) склеены в один файл: внешних @import,
   кроме шрифтов Google, нет. Источник — styles.css + tokens/ в проекте ДС.
   ============================================================ */

/* LT-27: шрифты self-host (было @import на CSS2-эндпоинт Google Fonts — вынесено сюда, без сети в проде).
   Источник — тот же woff2 с fonts.gstatic.com, что раздаёт Google Fonts (лицензия Paratype,
   открытая раздача), файлы лежат в assets/fonts/. Правила и unicode-range — как в CSS2-ответе
   Google Fonts 1:1 (4 subset на начертание: cyrillic-ext/cyrillic/latin-ext/latin), просто
   src переписан на локальный путь. */
@font-face {
  font-family: 'PT Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-mono-400-normal-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'PT Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-mono-400-normal-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'PT Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-mono-400-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'PT Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-mono-400-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-italic-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-italic-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-italic-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-italic-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-italic-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-italic-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-normal-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-normal-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-400-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-normal-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-normal-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-700-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-400-normal-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-400-normal-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-400-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-400-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-700-normal-cyrillic-ext.woff2') format('woff2');
  unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-700-normal-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-700-normal-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('assets/fonts/pt-sans-narrow-700-normal-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ==================== tokens/fonts.css ==================== */
/* ============================================================
   Шрифты — «На контроле»
   Семейство Paratype: PT Sans (UI), PT Sans Narrow (плотные
   подписи/таблицы), PT Mono (ключи, номера, суммы).
   PT Sans даёт отличную, привычную кириллицу и читается
   крупно — это важно для аудитории 50+.

   ПРИМЕЧАНИЕ: исходно в брифе упоминался PT Root UI. Он не
   распространяется свободно через веб-CDN, поэтому в системе
   используется ближайшая родственная гарнитура того же
   издательства — PT Sans. Если у вас есть лицензия и файлы
   PT Root UI, пришлите их — заменим src ниже на self-host.
   ============================================================ */

/* ==================== tokens/colors.css ==================== */
/* ============================================================
   ЦВЕТ — «На контроле»
   Концепция «Сталь»: нейтральный серо-стальной каркас в духе
   учётных систем (1С/Битрикс24). Цвет почти отсутствует в
   хроме — он работает только в статусах сроков и в кнопках
   действия. Никаких градиентов, никакого «воздуха ради моды».
   ============================================================ */

:root {
  /* --- Сталь: нейтральная шкала каркаса --- */
  --steel-0:   #ffffff;
  --steel-50:  #f5f6f8;
  --steel-100: #eef0f3;
  --steel-150: #e6e9ed;
  --steel-200: #dadee3;
  --steel-300: #c6ccd3;
  --steel-400: #aab2bc;
  --steel-500: #8b939e;
  --steel-600: #69727e;
  --steel-700: #4a525d;
  --steel-800: #2e353f;
  --steel-900: #1c212a;

  /* --- Акцент действия: деловой стально-синий --- */
  --blue-50:  #e9f1fa;
  --blue-100: #cfe1f3;
  --blue-200: #a7c8e8;
  --blue-400: #3d83bf;
  --blue-500: #1f6fb2;   /* основной акцент */
  --blue-600: #185c95;
  --blue-700: #134b7b;

  /* --- Статусы: сдержанный «светофор» (приглушённые тона) --- */
  /* Активно — спокойный зелёный */
  --ok-bg:     #e8f1ea;
  --ok-border: #bcd6c4;
  --ok-fg:     #2f7d4f;
  --ok-solid:  #3f8f5b;

  /* Скоро истекает — приглушённый янтарь/охра */
  --warn-bg:     #faf1da;
  --warn-border: #e7d4a3;
  --warn-fg:     #936511;
  --warn-solid:  #c08a1e;

  /* Просрочено — притушенный кирпично-красный */
  --over-bg:     #f6e5e5;
  --over-border: #e2bcbc;
  --over-fg:     #ad3a3a;
  --over-solid:  #c24545;

  /* Нейтральный статус / черновик */
  --neutral-bg:     #eceef1;
  --neutral-border: #d2d7dd;
  --neutral-fg:     #5a626d;

  /* --- Полоса «окно продления» (сигнатурный элемент) --- */
  --rw-track:   #e3e6ea;          /* фон шкалы срока */
  --rw-tick:    #c6ccd3;          /* деления */
  --rw-fill-ok:   #6fae84;        /* запас по сроку */
  --rw-fill-warn: #d6a43f;        /* зона предупреждения */
  --rw-fill-over: #c66a6a;        /* просрочка */
  --rw-grace:   #cfe4d6;          /* льготное окно (заливка) */
  --rw-grace-line: #6fae84;       /* граница льготного окна */
  --rw-today:   #185c95;          /* отметка «сегодня» */
  --rw-deadline:#9aa2ac;          /* отметка дедлайна */

  /* ============================================================
     СЕМАНТИЧЕСКИЕ АЛИАСЫ — используйте их в компонентах
     ============================================================ */
  --app-bg:          var(--steel-100);
  --surface:         var(--steel-0);
  --surface-sunken:  var(--steel-50);
  --surface-header:  var(--steel-150);   /* шапки таблиц, тулбары */
  --surface-hover:   var(--steel-50);
  --surface-selected:var(--blue-50);

  --border:          var(--steel-300);
  --border-soft:     var(--steel-200);
  --border-strong:   var(--steel-400);
  --divider:         var(--steel-200);

  --text:            var(--steel-900);
  --text-secondary:  var(--steel-700);
  --text-muted:      var(--steel-500);
  --text-inverse:    var(--steel-0);
  --text-link:       var(--blue-600);

  --accent:          var(--blue-500);
  --accent-hover:    var(--blue-600);
  --accent-active:   var(--blue-700);
  --accent-soft-bg:  var(--blue-50);
  --on-accent:       var(--steel-0);

  --focus-ring:      0 0 0 2px var(--steel-0), 0 0 0 4px rgba(31,111,178,.55);

  /* --- Кнопки решений (стандарт BI, «Сталь v2») ---
     Отдельный слой от статусного светофора: только главные action-кнопки
     (uppercase, bold, radius ~20px). Статусы остаются приглушёнными. */
  --btn-go:        #2FC6F6;   /* позитив/вперёд: готово, запустить */
  --btn-go-text:   #063a4d;
  --btn-return:    #F0D980;   /* возврат/доработка: проблема, вернуть этап */
  --btn-return-text:#5C4A00;
  --btn-reject:    #FF5752;   /* отказ/брак */
  --btn-reject-text:#ffffff;
}

/* ==================== tokens/typography.css ==================== */
/* ============================================================
   ТИПОГРАФИКА — «На контроле»
   Крупно и читаемо. Базовый размер интерфейса 15px, в таблицах
   14px. Заголовки набираются тем же PT Sans Bold — без
   декоративных дисплейных гарнитур. Числа, ключи и суммы — PT Mono.
   ============================================================ */

:root {
  /* Семейства */
  --font-sans:   'PT Sans', 'Segoe UI', Tahoma, Arial, sans-serif;
  --font-narrow: 'PT Sans Narrow', 'PT Sans', 'Segoe UI', sans-serif;
  --font-mono:   'PT Mono', 'Consolas', 'Courier New', monospace;

  /* Начертания (PT Sans: 400 / 700) */
  --fw-regular: 400;  /* @kind font */
  --fw-bold:    700;  /* @kind font */

  /* Размерная шкала (px) — крупная, под 50+ */
  --fs-2xs:  12px;   /* микро-подписи, бейджи */
  --fs-xs:   13px;   /* вторичные подписи */
  --fs-sm:   14px;   /* таблицы, плотные формы */
  --fs-base: 15px;   /* базовый текст интерфейса */
  --fs-md:   16px;   /* акцентный текст, поля ввода */
  --fs-lg:   18px;   /* подзаголовки */
  --fs-xl:   21px;   /* заголовки секций */
  --fs-2xl:  26px;   /* заголовки экранов */
  --fs-3xl:  32px;   /* крупные числа дашборда */
  --fs-4xl:  40px;   /* hero-числа */

  /* Интерлиньяж */
  --lh-tight:  1.2;   /* @kind font */
  --lh-snug:   1.35;  /* @kind font */
  --lh-base:   1.5;   /* @kind font */

  /* Трекинг */
  --ls-caps:   0.04em;   /* ВЕРХНИЙ РЕГИСТР заголовков-меток */
  --ls-normal: 0;        /* @kind font */

  /* Готовые роли текста */
  --text-screen-title: var(--fw-bold) var(--fs-2xl)/var(--lh-tight) var(--font-sans);
  --text-section:      var(--fw-bold) var(--fs-xl)/var(--lh-snug) var(--font-sans);
  --text-subhead:      var(--fw-bold) var(--fs-lg)/var(--lh-snug) var(--font-sans);
  --text-body:         var(--fw-regular) var(--fs-base)/var(--lh-base) var(--font-sans);
  --text-table:        var(--fw-regular) var(--fs-sm)/var(--lh-snug) var(--font-sans);
  --text-label:        var(--fw-bold) var(--fs-xs)/var(--lh-snug) var(--font-sans);
}

/* ==================== tokens/spacing.css ==================== */
/* ============================================================
   ОТСТУПЫ, СЕТКА, РАЗМЕРЫ — «На контроле»
   Плотно, но не тесно: сетка 4px, ряды таблиц 40px (плотный
   режим 32px). Скругления маленькие (2–4px) — интерфейс
   «угловатый», деловой, узнаваемый для пользователей 1С.
   ============================================================ */

:root {
  /* Шаг сетки 4px */
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* Скругления — маленькие, почти прямые углы */
  --radius-xs: 2px;
  --radius-sm: 3px;
  --radius-md: 4px;
  --radius-lg: 6px;
  --radius-pill: 999px;

  /* Высоты управляющих элементов */
  --control-h-sm: 28px;
  --control-h:    34px;
  --control-h-lg: 40px;

  /* Ряды таблиц */
  --row-h:        40px;   /* стандартный (компромисс для 50+) */
  --row-h-dense:  32px;   /* плотный режим «как в 1С» */

  /* Толщины линий */
  --border-w:      1px;
  --border-w-strong: 2px;

  /* Геометрия макета */
  --sidebar-w:     232px;
  --topbar-h:      52px;
  --toolbar-h:     48px;
  --content-max:   1440px;
  --gutter:        var(--space-6);
}

/* ==================== tokens/elevation.css ==================== */
/* ============================================================
   ГРАНИЦЫ И ТЕНИ — «На контроле»
   Каркас держится на линиях, а не на тенях. Тени — минимальные
   и только там, где элемент реально «всплывает» над листом
   (выпадающие списки, диалоги, поповеры). Никакого мягкого
   «парящего» материал-дизайна.
   ============================================================ */

:root {
  /* Тонкая «приподнятость» карточки — почти незаметная */
  --shadow-card:   0 1px 0 rgba(28,33,42,.04), 0 1px 2px rgba(28,33,42,.06);
  /* Всплывающие элементы поверх листа */
  --shadow-pop:    0 6px 18px rgba(28,33,42,.16), 0 1px 3px rgba(28,33,42,.12);
  /* Модальные диалоги */
  --shadow-dialog: 0 18px 48px rgba(28,33,42,.28);
  /* Залипающая шапка таблицы */
  --shadow-sticky: 0 1px 0 var(--border), 0 2px 4px rgba(28,33,42,.06);

  /* Кольцо фокуса (доступность, крупное — под 50+) */
  --ring: var(--focus-ring);
}

/* ==================== tokens/themes.css ==================== */
/* ============================================================
   КОНЦЕПЦИИ ТЕМ — «На контроле»
   Три варианта одного делового каркаса для сравнения.
   База (:root в colors.css) = концепция «Сталь».
   Применяются классом на корневой контейнер экрана.
   ============================================================ */

/* ── Концепция 2 «Графит» ───────────────────────────────────
   Темная графитовая шапка таблиц и тулбаров, зебра-строки,
   тот же стально-синий акцент. Чуть строже и контрастнее. */
.theme-grafit {
  --app-bg:         var(--steel-150);
  --surface-header: var(--steel-800);
  --on-header:      var(--steel-50);
  --row-zebra:      var(--steel-50);
  --accent:         var(--blue-500);
  --accent-hover:   var(--blue-600);
}
.theme-grafit .nk-th { color: var(--steel-50); }

/* ── Концепция 3 «Ведомость» ────────────────────────────────
   Максимальная плотность «как в 1С/Excel»: полная сетка ячеек,
   спокойный сине-зелёный акцент, акцент на моноширинных числах. */
.theme-vedomost {
  --app-bg:         #eceae4;        /* чуть тёплый бумажный фон */
  --surface-header: var(--steel-200);
  --accent:         #2f6e63;        /* приглушённый сине-зелёный */
  --accent-hover:   #245649;
  --accent-active:  #1d463b;
  --accent-soft-bg: #e4efe9;
  --text-link:      #245649;
  --row-h:          var(--row-h-dense);
  --radius-md:      2px;
  --radius-lg:      3px;
}
.theme-vedomost .nk-cell { border-right: var(--border-w) solid var(--border-soft); }
.theme-vedomost .nk-num  { font-family: var(--font-mono); }

/* ==================== tokens/sed.css ==================== */
/* ============================================================
   ТОКЕНЫ «Кабинет СЭД» — расширение системы «Сталь»
   Второй продукт линейки. Цвет решений, стадии документа и
   статусы согласующего. Тона приглушённые — как в статусах
   «На контроле». Подключается из styles.css; имена в своём
   неймспейсе (--dec-, --stage-, --appr-, --wave-).
   ============================================================ */

:root {
  /* --- Цвета РЕШЕНИЙ (кнопки и исходы) --- */
  /* Согласовать (ДЕЙСТВИЕ) — синяя, контрастная (бриф §7).
     ЗЕЛЁНЫЙ в СЭД — ТОЛЬКО индикатор «пройдено/завершено»
     (галочки волн, стадии Согласован/Утверждён): см. --ok-* / --wave-done. */
  --dec-approve-bg:     var(--blue-50);
  --dec-approve-border: var(--blue-200);
  --dec-approve-fg:     var(--blue-700);
  --dec-approve-solid:  var(--blue-500);
  --dec-approve-hover:  var(--blue-600);

  /* «Пройдено/завершено» — приглушённый зелёный (индикатор, не кнопка) */
  --dec-passed-bg:     var(--ok-bg);
  --dec-passed-border: var(--ok-border);
  --dec-passed-fg:     var(--ok-fg);
  --dec-passed-solid:  var(--ok-solid);

  /* На доработку — приглушённый янтарь (= warn) */
  --dec-rework-bg:     var(--warn-bg);
  --dec-rework-border: var(--warn-border);
  --dec-rework-fg:     var(--warn-fg);
  --dec-rework-solid:  var(--warn-solid);
  --dec-rework-hover:  #a97817;

  /* Отклонить — притушенный кирпичный (= over) */
  --dec-reject-bg:     var(--over-bg);
  --dec-reject-border: var(--over-border);
  --dec-reject-fg:     var(--over-fg);
  --dec-reject-solid:  var(--over-solid);
  --dec-reject-hover:  #9a3434;

  /* Запросить уточнение — спокойный сланцево-синий (нейтральнее акцента) */
  --dec-clarify-bg:     #e7edf3;
  --dec-clarify-border: #c2cfdd;
  --dec-clarify-fg:     #3f5063;
  --dec-clarify-solid:  #5b7088;

  /* --- СТАДИИ документа (7 вех жизненного цикла) --- */
  /* Чтобы человек 50+ мгновенно читал «где документ»:
     серый — ещё не начато, синий — идёт сейчас, зелёный — пройдено/готово,
     красный — отклонён, серо-штрих — отозван. */
  --stage-draft-fg:    #5a626d;   --stage-draft-bg:    #eceef1;   /* Черновик */
  --stage-review-fg:   #185c95;   --stage-review-bg:   #e3eef8;   /* На согласовании */
  --stage-agreed-fg:   #2f7d4f;   --stage-agreed-bg:   #e8f1ea;   /* Согласован */
  --stage-signing-fg:  #185c95;   --stage-signing-bg:  #e3eef8;   /* На подписании */
  --stage-approved-fg: #1f6b41;   --stage-approved-bg: #dceee0;   /* Утверждён */
  --stage-rejected-fg: #ad3a3a;   --stage-rejected-bg: #f6e5e5;   /* Отклонён */
  --stage-withdrawn-fg:#69727e;   --stage-withdrawn-bg:#e6e9ed;   /* Отозван */

  /* --- СТАТУС СОГЛАСУЮЩЕГО по документу --- */
  --appr-new-fg:     #185c95;   --appr-new-bg:     #e3eef8;   /* Новый */
  --appr-work-fg:    #936511;   --appr-work-bg:    #faf1da;   /* В работе */
  --appr-rework-fg:  #936511;   --appr-rework-bg:  #faf1da;   /* Отправлен на доработку */
  --appr-recheck-fg: #6b4fa3;   --appr-recheck-bg: #ece8f5;   /* Повторная проверка (круг N) */
  --appr-done-fg:    #2f7d4f;   --appr-done-bg:    #e8f1ea;   /* Согласовано */
  --appr-rej-fg:     #ad3a3a;   --appr-rej-bg:     #f6e5e5;   /* Отклонено */
  --appr-wd-fg:      #69727e;   --appr-wd-bg:      #e6e9ed;   /* Отозвано */

  /* --- Маршрут по волнам --- */
  --wave-done:    var(--ok-solid);     /* волна пройдена */
  --wave-current: var(--accent);       /* волна идёт сейчас */
  --wave-wait:    var(--steel-400);    /* волна ждёт очереди */
  --wave-line:    var(--steel-300);    /* соединительная линия */
  --wave-current-bg: var(--blue-50);   /* подсветка активной волны */

  /* --- Круг доработки --- */
  --round-fg: #6b4fa3;  --round-bg: #ece8f5;  --round-border:#d6ccec;
}

/* ==================== tokens/data-mcp.css ==================== */
/* ============================================================
   Data-MCP — тема-ветка линейки Base Integrator
   Dev-tool минимализм в духе Anthropic. Переключаемая:
   .dmcp = светлая (первична), .dmcp.dark = тёмная.
   Токены-контракты (ok/stale/error, моноширь) переиспользуемы;
   палитра и плотность заданы под разработчиков и AI-агентов.
   Область действия — ТОЛЬКО .dmcp, не влияет на «Сталь».
   ============================================================ */

.dmcp {
  /* Фоны и поверхности (светлая) */
  --dm-bg:        #fbfbfa;   /* тёплая бумага, Anthropic-настроение */
  --dm-surface:   #ffffff;
  --dm-surface-2: #f5f5f3;   /* приподнятые блоки, шапки таблиц */
  --dm-code-bg:   #f5f5f3;   /* код-блоки на светлой */
  --dm-border:    #e7e6e1;
  --dm-border-2:  #d6d5cf;

  /* Текст */
  --dm-text:      #1f1e1c;
  --dm-text-2:    #5c5a54;
  --dm-text-3:    #8a877f;
  --dm-on-accent: #ffffff;

  /* Акцент — технологичный индиго */
  --dm-accent:      #4f5bd5;
  --dm-accent-2:    #3d49c0;
  --dm-accent-soft: #ecedfb;
  --dm-accent-line: #cdd0f4;

  /* Семантика свежести/статусов (сдержанная) */
  --dm-ok:      #2f8f5b;  --dm-ok-bg:   #e8f2ec;  --dm-ok-line:  #bcdcc8;
  --dm-stale:   #a9781a;  --dm-stale-bg:#f8f0dd;  --dm-stale-line:#e6d5a6;
  --dm-error:   #c0413f;  --dm-error-bg:#f7e6e5;  --dm-error-line:#e6bfbe;
  --dm-info:    #2f6ab0;  --dm-info-bg: #e7eff7;

  /* Радиусы, тени, шрифты */
  --dm-radius:    10px;
  --dm-radius-sm: 7px;
  --dm-radius-lg: 16px;
  --dm-shadow:    0 1px 2px rgba(20,19,17,.05), 0 8px 24px rgba(20,19,17,.06);
  --dm-shadow-pop:0 12px 40px rgba(20,19,17,.18);
  --dm-font:      'PT Sans','Segoe UI',-apple-system,Arial,sans-serif;
  --dm-mono:      'PT Mono','SF Mono',ui-monospace,'Consolas',monospace; /* @kind font */

  color-scheme: light;
}

.dmcp.dark {
  --dm-bg:        #17171a;   /* глубокий нейтральный, как Claude/Timeweb dark */
  --dm-surface:   #1e1e22;
  --dm-surface-2: #26262b;
  --dm-code-bg:   #101013;
  --dm-border:    #2e2e34;
  --dm-border-2:  #3b3b42;

  --dm-text:      #ececef;
  --dm-text-2:    #a9a8b0;
  --dm-text-3:    #77767e;
  --dm-on-accent: #ffffff;

  --dm-accent:      #8b96ff;
  --dm-accent-2:    #a3abff;
  --dm-accent-soft: #23243a;
  --dm-accent-line: #363861;

  --dm-ok:      #5fc98a;  --dm-ok-bg:   #16281d;  --dm-ok-line:  #274b34;
  --dm-stale:   #e0b054;  --dm-stale-bg:#2a2213;  --dm-stale-line:#4a3c1c;
  --dm-error:   #e57573;  --dm-error-bg:#2c1817;  --dm-error-line:#4d2827;
  --dm-info:    #6ea8e6;  --dm-info-bg: #15212e;

  --dm-shadow:    0 1px 2px rgba(0,0,0,.4), 0 8px 28px rgba(0,0,0,.35);
  --dm-shadow-pop:0 14px 44px rgba(0,0,0,.55);

  color-scheme: dark;
}

/* ==================== tokens/legal.css ==================== */
/* ============================================================
   ТОКЕНЫ «Юридический департамент» — строго в системе «Сталь».
   Нейтральный стальной каркас (как «На контроле» и СЭД), цвет
   только в статусах и кнопках действия, акцент — стально-синий
   линейки. Неймспейс --lx-. Тема — data-theme на <html>.
   ============================================================ */

:root {
  --lx-font-display: var(--font-sans);

  /* Каркас = шкала «Сталь» */
  --lx-bg:            var(--steel-100);
  --lx-surface:       var(--steel-0);
  --lx-surface-2:     var(--steel-50);
  --lx-surface-3:     var(--steel-150);
  --lx-hover:         var(--steel-50);
  --lx-sel:           var(--blue-50);
  --lx-border:        var(--steel-300);
  --lx-border-soft:   var(--steel-200);
  --lx-border-strong: var(--steel-400);

  --lx-text:   var(--steel-900);
  --lx-text-2: var(--steel-700);
  --lx-text-3: var(--steel-500);
  --lx-ink:    var(--steel-900);

  /* Акцент действия — стально-синий линейки */
  --lx-accent:       var(--blue-500);
  --lx-accent-hover: var(--blue-600);
  --lx-accent-active:var(--blue-700);
  --lx-accent-soft:  var(--blue-50);
  --lx-accent-line:  var(--blue-200);
  --lx-on-accent:    #ffffff;
  --lx-link:         var(--blue-600);

  /* Статусы / SLA = светофор линейки */
  --lx-ok-bg:var(--ok-bg);     --lx-ok-fg:var(--ok-fg);     --lx-ok-line:var(--ok-border);     --lx-ok-solid:var(--ok-solid);
  --lx-warn-bg:var(--warn-bg); --lx-warn-fg:var(--warn-fg); --lx-warn-line:var(--warn-border); --lx-warn-solid:var(--warn-solid);
  --lx-crit-bg:var(--over-bg); --lx-crit-fg:var(--over-fg); --lx-crit-line:var(--over-border); --lx-crit-solid:var(--over-solid);
  --lx-info-bg:#e3eef8;        --lx-info-fg:#185c95;        --lx-info-line:#b9d3ea;            --lx-info-solid:var(--blue-500);
  --lx-mute-bg:var(--neutral-bg); --lx-mute-fg:var(--neutral-fg); --lx-mute-line:var(--neutral-border);

  /* AI-слой — приглушённый аметист (как «повторная проверка» в СЭД) */
  --lx-ai:#6b4fa3; --lx-ai-bg:#ece8f5; --lx-ai-line:#d6ccec; --lx-ai-2:#8a6fc4;

  /* Геометрия «угловатая», деловая */
  --lx-r:var(--radius-md); --lx-r-lg:var(--radius-lg); --lx-r-sm:var(--radius-sm);
  --lx-shadow:0 1px 2px rgba(28,33,42,.06);
  --lx-shadow-pop:0 12px 32px rgba(28,33,42,.18);
  --lx-ring:var(--focus-ring);
}

[data-theme="dark"] {
  --lx-bg:            #14171c;
  --lx-surface:       #1b1f26;
  --lx-surface-2:     #20252d;
  --lx-surface-3:     #272d36;
  --lx-hover:         #232932;
  --lx-sel:           #1d2a3a;
  --lx-border:        #333b46;
  --lx-border-soft:   #2a313b;
  --lx-border-strong: #47505c;

  --lx-text:   #e7eaee;
  --lx-text-2: #aeb6c0;
  --lx-text-3: #7f8894;
  --lx-ink:    #e7eaee;

  --lx-accent:       #4d94d8;
  --lx-accent-hover: #64a5e0;
  --lx-accent-active:#7db5e8;
  --lx-accent-soft:  #1d2c3d;
  --lx-accent-line:  #2e4660;
  --lx-on-accent:    #0e1117;
  --lx-link:         #64a5e0;

  --lx-ok-bg:#1a2a21;   --lx-ok-fg:#7fc498;  --lx-ok-line:#2d4535;  --lx-ok-solid:#3f8f5b;
  --lx-warn-bg:#2b2418; --lx-warn-fg:#d8ab5b; --lx-warn-line:#453a24; --lx-warn-solid:#c08a1e;
  --lx-crit-bg:#2e1e1e; --lx-crit-fg:#e28a82; --lx-crit-line:#4a2e2c; --lx-crit-solid:#c24545;
  --lx-info-bg:#1b2735; --lx-info-fg:#8fb8e2; --lx-info-line:#2c3f57; --lx-info-solid:#3d83bf;
  --lx-mute-bg:#242830; --lx-mute-fg:#9ca4ae; --lx-mute-line:#333b46;

  --lx-ai:#a58ad6; --lx-ai-bg:#26203a; --lx-ai-line:#3d3457; --lx-ai-2:#b9a3e4;

  --lx-shadow:0 1px 2px rgba(0,0,0,.5);
  --lx-shadow-pop:0 14px 36px rgba(0,0,0,.6);
  --lx-ring:0 0 0 2px var(--lx-surface), 0 0 0 4px rgba(77,148,216,.55);
}

/* ==================== tokens/base.css ==================== */
/* ============================================================
   БАЗА — «На контроле»
   Лёгкий сброс и базовые правила документа. Только то, что
   нужно, чтобы экраны выглядели одинаково в карточках, китах
   и слайдах. Это НЕ компонентные стили.
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font: var(--text-body);
  color: var(--text);
  background: var(--app-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, p, figure { margin: 0; }

a { color: var(--text-link); text-decoration: none; }
a:hover { text-decoration: underline; }

button { font-family: inherit; }

/* Числа/суммы выравниваем табличными цифрами там, где это PT Sans */
.nk-tnum { font-variant-numeric: tabular-nums; }

::selection { background: var(--blue-100); }

/* Тонкая, деловая полоса прокрутки */
* {
  scrollbar-width: thin;
  scrollbar-color: var(--steel-400) transparent;
}
*::-webkit-scrollbar { width: 12px; height: 12px; }
*::-webkit-scrollbar-thumb {
  background: var(--steel-400);
  border: 3px solid var(--app-bg);
  border-radius: 8px;
}

