/* ILF A&A — фирменная дизайн-система (эталоны design/ilf-aa-v2/, Claude Design).
   Шрифты и иконки ЛОКАЛЬНЫЕ (static/fonts/*.woff2), без внешних CDN.
   ЗАДАНИЕ ЯДРУ (Айгерим, 28.08) — новая тёмно-синяя палитра вместо бежево-
   жёлтой: --primary/--accent и --highlight (были графит и жёлтый CTA
   соответственно) сведены в ОДНУ синюю акцент-семью (#185FA5/#0C447C) —
   команде текущая бежево-жёлтая гамма не нравилась, кнопка «Создать»
   (класс cta, был жёлтый) теперь синяя. Бордо #b4453b→#A32D2D остаётся
   danger/статус «срочно», зелёный→#0F6E56 — ok, золото→#854F0B — warn.
   Только ЦВЕТА (переменные ниже) — раскладка/компоненты/поведение те же.
   Старые имена (--accent/--line…) сохранены алиасами на фирменные, чтобы
   разметка/JS не ломались. */

/* ЗАДАНИЕ ЯДРУ (Айгерим 05.09) — анимация и плавность по кабинету: кнопки,
   модалки, переходы разделов, карточки, выпадающие списки — везде мягкий
   отклик, ничего дольше 250мс, ничего мигающего/прыгающего/вращающегося.
   Почта и документы (тело письма в iframe, doc-editor) НЕ анимируются —
   там читают текст, лишнее движение отвлекает; переходы разделов (app.html
   route()) явно пропускают mail/documents. Правило ниже — ЕДИНАЯ точка:
   системная настройка "уменьшить движение" полностью гасит анимации/
   переходы везде, а не в паре мест по отдельности (как было раньше). */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* --- локальные шрифты --- */
@font-face{font-family:"Newsreader";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/newsreader-400.woff2") format("woff2");}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/newsreader-500.woff2") format("woff2");}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/newsreader-600.woff2") format("woff2");}
@font-face{font-family:"Newsreader";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/newsreader-700.woff2") format("woff2");}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/publicsans-400.woff2") format("woff2");}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/publicsans-500.woff2") format("woff2");}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/publicsans-600.woff2") format("woff2");}
@font-face{font-family:"Public Sans";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/publicsans-700.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/plexmono-400.woff2") format("woff2");}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/plexmono-500.woff2") format("woff2");}
/* Фирменные шрифты (Б-дизайн): Golos Text (интерфейс) + Cormorant Garamond
   (заголовки/вордмарк). Self-hosted (woff2, latin/cyrillic) — БЕЗ внешних
   CDN, как требует брендбук (адвокатская тайна). Фолбэки в --sans/--serif. */
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/cormorant-500-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:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/cormorant-500-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/cormorant-500-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:"Cormorant Garamond";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/cormorant-500-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:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/cormorant-600-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:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/cormorant-600-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/cormorant-600-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:"Cormorant Garamond";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/cormorant-600-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:"Cormorant Garamond";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/cormorant-700-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:"Cormorant Garamond";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/cormorant-700-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Cormorant Garamond";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/cormorant-700-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:"Cormorant Garamond";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/cormorant-700-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:"Golos Text";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/golos-400-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:"Golos Text";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/golos-400-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/golos-400-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:"Golos Text";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/golos-400-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:"Golos Text";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/golos-500-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:"Golos Text";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/golos-500-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/golos-500-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:"Golos Text";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/golos-500-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:"Golos Text";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/golos-600-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:"Golos Text";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/golos-600-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/golos-600-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:"Golos Text";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/golos-600-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:"Golos Text";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/golos-700-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:"Golos Text";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/golos-700-cyrillic.woff2") format("woff2");unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/golos-700-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:"Golos Text";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/golos-700-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;}

:root{
  /* кабинет только светлый (дизайн-система тёмной темы не имеет) — явно
     просим браузер рендерить нативный хром форм (в т.ч. попап <select>)
     в светлом варианте, даже если у пользователя тёмная тема ОС; иначе
     некоторые браузеры красят попап select нативной тёмной палитрой,
     а наш явный color на закрытом select остаётся тёмным — плохо читается
     то в открытом, то в закрытом состоянии в зависимости от темы ОС. */
  color-scheme: light;
  /* ЗАДАНИЕ ЯДРУ (Айгерим, 28.08) — тёмно-синяя палитра вместо бежево-жёлтой
     (команде текущая гамма не нравилась). Исходный Брендбук ILF A&A.dc.html
     (Графит #231F20, фон #FAF9F7, Жёлтый #FFE600 CTA) — историческая основа
     структуры токенов ниже, но их ЗНАЧЕНИЯ здесь заменены на новую гамму. */
  --bg:#F7F9FB; --surface:#ffffff;
  --border:#DDE5ED; --border-soft:#d9e2eb;
  --ink:#042C53; --text:#5A6B7D; --muted:#8A9AAA;
  --primary:#185FA5; --primary-2:#0C447C; --primary-bg:#E6F1FB;
  --highlight:#185FA5; --highlight-2:#0C447C;   /* было жёлтое CTA — теперь тот же синий акцент */
  /* ТИКЕТ Айгерим 28.08 (доп., «вернуть цветовые сигналы») — состояния
     стали заметно ярче/насыщеннее, синяя основа (bg/border/primary/text
     выше) не тронута. --ok/--warn/--danger/--info ниже — ТЕКСТ-БЕЗОПАСНЫЕ
     версии (подобраны на ≥4.5:1 контраста на белом — это САМОЕ частое
     употребление токена: обычный цветной текст/бейджи по всему кабинету).
     Для точек на канбане / цветных полос слева / декоративных акцентов
     БЕЗ текста внутри — где WCAG для текста не действует — используется
     отдельная, более яркая *-vivid пара: это буквальные значения из
     тикета, без урезания под контраст. */
  --ok:#177e5e; --ok-bg:#e8f9f3; --ok-2:#c7ece1;
  --danger:#d82423; --danger-2:#eebdbd; --danger-bg:#fdf4f4;
  --warn:#9c620c; --warn-bg:#fcf4e7;
  --ok-vivid:#1D9E75; --warn-vivid:#EF9F27; --danger-vivid:#E24B4A; --info-vivid:#378ADD;
  /* «На проверке» / review — статус, которого не было в исходной палитре:
     не опасность, не успех, не ожидание/предупреждение и не «информация»
     (та уже занята info) — отдельный смысл «на рассмотрении у другого
     человека», фиолетовый, по просьбе тикета. */
  --review:#8a4cdf; --review-2:#d2c0ed; --review-bg:#f7f4fb; --review-vivid:#8d52e0;
  /* границы при наведении интерактивных элементов — новая роль палитры,
     сама по себе нигде компонентами пока не потребляется (не переписываем
     компоненты по этому же тикету) — токен готов к подключению отдельно. */
  --border-hover:#B5D4F4;

  /* yadro-36 — доп. токены: цвета app.html/doc-editor.css с 5+ употреблений
     (плюс 2 акцента виджета «Рабочий день», участвующие в будущей палитре 1b),
     не входившие в исходные 24 токена. Значения обновлены под новую гамму 28.08. */
  /* мьютед-варианты (текст/иконки чуть темнее --muted) */
  --muted-2:#7c8ea0; --muted-3:#9aa7b5; --muted-4:#95a3b2; --muted-5:#7a8c9f;
  /* границы — доп. оттенки, встречающиеся 5+ раз */
  --border-4:#cedae5; --border-5:#d3dee8; --border-6:#cbd7e2; --border-7:#b0c2d3; --border-8:#afc1d3; --border-9:#b9c9da; --border-10:#a6bace;
  /* фон — доп. оттенки */
  --bg-alt:#eaeff4; --bg-3:#dce4ed; --bg-4:#e6ecf2; --bg-5:#e5ebf1; --bg-6:#eff3f7; --bg-7:#dbe4ee;
  /* «инфо» — своя, отдельная от --primary синяя (тикет 28.08, доп.):
     --primary/--accent остаются интерфейсным синим (кнопки/ссылки, «не
     трогать»), --info — это ТЕПЕРЬ состояние («новое», см. FB_ST ниже
     по app.html), заметно светлее/ярче, чтобы отличаться от кнопок. */
  --info:#2171c1; --info-2:#25476a; --info-3:#1b69b8; --info-bg:#f0f6fe; --info-bg-2:#edf3f9; --info-bg-3:#d5e5f5;
  /* danger/warn/ok — доп. оттенки (hover/бейджи/бордеры) */
  --danger-3:#eaa6a6; --danger-4:#b50e0d; --danger-5:#e00d0b; --warn-2:#965f0e; --warn-3:#eacea5; --warn-4:#edd1a7; --warn-bg-2:#f1dbba; --warn-bg-3:#f9ead3; --warn-bg-4:#fdf5e8; --ok-3:#147e5d;
  /* текст усиленного контраста / текст на цветном фоне (--highlight-text —
     теперь белый: он же «текст на кнопке» из тикета — сама кнопка --highlight
     стала тёмно-синей, тёмный текст на ней читался бы плохо) */
  --ink-2:#234b74; --warn-text:#965e0a; --highlight-text:#FFFFFF;
  /* виджет «Рабочий день» (yadro-35) — не входят в общую палитру бренда,
     отдельные акценты; тикет 28.08 их не касается — оставлены как были */
  --accent-emerald:#0e7c5a; --accent-gold:#c89b3c;
  /* нейтральный серый (редкий, без строгой роли в бренд-палитре) */
  --gray-light:#eeeeee;
  /* размеры каркаса */
  --side-w:236px; --header-h:60px;
  /* совместимость со старой разметкой/JS (алиасы на фирменные) */
  --card:var(--surface); --card-2:#e4ebf1; --card-3:#ebf0f5; --bg-2:#e1e8ef;
  --line:var(--border); --border-2:var(--border-soft); --border-3:#b7c7d7;
  --text-2:#5A6B7D; --text-3:#566676;
  --accent:var(--primary); --accent-2:var(--primary-2); --accent-bg:var(--primary-bg); --accent-bg-2:#e4ebf1;
  --agent:var(--primary); --agent-bg:var(--primary-bg);
  /* шрифты (локальные) */
  --serif:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans:"Golos Text", -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, Menlo, Consolas, monospace;
  /* радиусы 8–20, тени */
  --r-sm:9px; --r:12px; --r-lg:16px; --r-xl:20px;
  /* тени — точные значения из эталона v3 */
  --shadow:0 1px 2px rgba(28,27,25,.03); --shadow-md:0 1px 2px rgba(28,27,25,.08);
  --shadow-lg:0 1px 3px rgba(28,27,25,.05), 0 10px 30px rgba(28,27,25,.08);
  --shadow-accent:0 2px 8px rgba(24,95,165,.22);
}
*{box-sizing:border-box}
body{background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:14px; line-height:1.55; margin:0; -webkit-font-smoothing:antialiased;}
h1,h2,h3,h4,.serif,.ilf-brand{font-family:var(--serif); font-weight:500; letter-spacing:.005em; color:var(--ink);}
.mono,.num,.eyebrow{font-family:var(--mono); font-variant-numeric:tabular-nums;}
.eyebrow{font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted);}
a{color:var(--accent);}
::-webkit-scrollbar{width:10px; height:10px}
::-webkit-scrollbar-thumb{background:var(--border-2); border-radius:6px; border:3px solid var(--bg)}
::-webkit-scrollbar-thumb:hover{background:#b3c4d5}

/* --- карточки --- */
.card{background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:16px; box-shadow:var(--shadow-md); transition:box-shadow .15s ease, transform .15s ease}
.grid-cards{display:grid; gap:14px}

/* --- кнопки — точные размеры эталона v3 (высота 36/32, радиус 9, 13px/600) --- */
.btn{font:inherit; font-size:13px; cursor:pointer; border-radius:9px; height:36px; padding:0 15px; border:1px solid var(--accent); background:var(--accent); color:#fff; font-weight:600; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; gap:7px; transition:background .12s, box-shadow .12s, transform .1s ease}
.btn:hover{background:var(--accent-2); box-shadow:var(--shadow-accent); transform:translateY(-1px)}
/* ЗАДАНИЕ ЯДРУ (Айгерим 05.09) — плавность по кабинету: лёгкий подъём при
   наведении (:hover выше), вдавливание при нажатии. ≤120мс — заметно, но
   не тормозит клик. Почта/документы не используют .btn иначе, чем сам
   кабинет вокруг них — эта правка ниже намеренно не различает разделы,
   т.к. кнопки — не то же самое, что «читаемый контент», который просили
   не трогать (см. app.html — там же исключены только рендер письма/
   секция-переход для mail/documents). */
.btn:active{transform:translateY(0) scale(.97); transition-duration:.05s}
.btn .ti{font-size:16px}
.btn.ghost{background:transparent; color:var(--accent); border-color:var(--border-2)}
.btn.ghost:hover{background:var(--accent-bg); box-shadow:none; border-color:var(--accent)}
.btn.sm{height:32px; padding:0 12px; font-size:13px}
.btn.neutral{background:var(--text); border-color:var(--text)}
.btn.danger{background:var(--danger); border-color:var(--danger)}
.btn.danger:hover{background:#bf1c1b; box-shadow:none}
/* согласование (эталон v5): одобрить — зелёный, отклонить — бордо-обводка */
.btn.appr{background:var(--ok); border-color:var(--ok)}
.btn.appr:hover{background:#12644b; box-shadow:0 2px 8px rgba(23,126,94,.22)}
.btn.rej{background:transparent; color:var(--danger); border-color:var(--danger-3)}
.btn.rej:hover{background:var(--danger-bg); box-shadow:none; border-color:var(--danger)}
.btn:disabled{opacity:.55; cursor:default; box-shadow:none}
/* Б5 — ключевой CTA (напр. «Создать»): было жёлтый #FFE600 с тёмным текстом.
   ЗАДАНИЕ ЯДРУ 28.08 — тёмно-синий #185FA5 с белым текстом (--highlight-text
   теперь белый именно под эту пару). Плавный ховер + видимое кольцо фокуса. */
.btn.cta{background:var(--highlight); border-color:var(--highlight); color:var(--highlight-text); font-weight:600}
.btn.cta:hover{background:var(--highlight-2); border-color:var(--highlight-2); box-shadow:0 2px 8px rgba(24,95,165,.28)}
.btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.btn.cta:focus-visible{outline-color:var(--ink)}
/* Б6 — доступность: видимое кольцо фокуса на интерактивных элементах (клавиатура).
   Тёмный текст на светлом уже даёт контраст AA; жёлтый — только фон/акцент под
   тёмным текстом, не как текст. */
a:focus-visible,button:focus-visible,[role="button"]:focus-visible,[tabindex]:focus-visible,summary:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:5px}

/* --- метрики / статы --- */
.ilf-metrics{display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:14px;}
.ilf-metric{background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:16px; box-shadow:var(--shadow-md);}
.ilf-metric .v{font-family:var(--mono); font-size:30px; font-weight:600; font-variant-numeric:tabular-nums;}
.ilf-metric .l{color:var(--muted); font-size:13px; margin-top:2px;}
.stat{background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:18px; box-shadow:var(--shadow-md); display:flex; flex-direction:column; gap:10px}
.stat .ic{width:36px; height:36px; border-radius:var(--r-sm); background:var(--accent-bg); display:flex; align-items:center; justify-content:center; color:var(--accent); font-size:20px}
.stat .v{font-family:var(--mono); font-size:34px; font-weight:600; font-variant-numeric:tabular-nums; line-height:1; color:var(--text)}
.stat .l{color:var(--muted); font-family:var(--mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase}
.stat.dev .v{color:var(--muted); font-size:15px; font-family:var(--mono); letter-spacing:.06em; text-transform:uppercase}
.stat.dev .ic{background:var(--card-2); color:var(--muted)}

/* --- карточка «требует решения» с цветной полосой --- */
.actioncard{position:relative; background:var(--card); border:1px solid var(--border); border-left:4px solid var(--border-2); border-radius:var(--r); padding:16px 16px 16px 18px; box-shadow:var(--shadow-md); display:flex; flex-direction:column; gap:10px}
.actioncard .ic{width:34px; height:34px; border-radius:var(--r-sm); display:flex; align-items:center; justify-content:center; font-size:19px}
.actioncard .ttl{font-family:var(--serif); font-size:16px; font-weight:600; flex:1}
.actioncard.warn{border-left-color:var(--warn-vivid)} .actioncard.warn .ic{background:var(--warn-bg); color:var(--warn)}
.actioncard.bad{border-left-color:var(--danger-vivid)} .actioncard.bad .ic{background:var(--danger-bg); color:var(--danger)}
.actioncard.ok{border-left-color:var(--ok-vivid)} .actioncard.ok .ic{background:var(--ok-bg); color:var(--ok)}
.actioncard.agent{border-left-color:var(--accent)} .actioncard.agent .ic{background:var(--accent-bg); color:var(--accent)}

/* --- таблицы --- */
table.grid{width:100%; border-collapse:collapse; font-size:14px}
/* на узком экране широкие таблицы скроллятся, а не ломают вёрстку */
@media(max-width:640px){ table.grid{display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:nowrap} }
table.grid th{text-align:left; color:var(--muted); font-family:var(--mono); font-weight:500; font-size:10px; text-transform:uppercase; letter-spacing:.1em; padding:9px 10px; border-bottom:1px solid var(--border)}
table.grid td{padding:11px 10px; border-bottom:1px solid var(--border)}
table.grid tr.clk{cursor:pointer}
table.grid tr.clk:hover td{background:var(--card-3)}

/* --- бейджи / пилюли: моно, статусные цвета --- */
.badge{display:inline-flex; align-items:center; gap:5px; font-family:var(--mono); font-size:11px; letter-spacing:.03em; padding:3px 9px; border-radius:999px; background:var(--card-2); border:1px solid var(--border-2); font-weight:500; color:var(--text-2)}
.tag{display:inline-flex; align-items:center; gap:5px; font-family:var(--mono); font-size:11px; letter-spacing:.04em; text-transform:uppercase; font-weight:500; padding:3px 9px; border-radius:999px; border:1px solid var(--border-2); background:var(--card-2); color:var(--text-2)}
.tag .ti{font-size:13px}
.pill{display:inline-flex; align-items:center; gap:5px; font-family:var(--mono); font-size:11px; letter-spacing:.03em; padding:3px 10px; border-radius:999px; border:1px solid var(--border-2); background:var(--card-2); font-weight:500; color:var(--text-2)}
.pill .ti{font-size:13px}
.pill.ok,.tag.ok{background:var(--ok-bg); border-color:var(--ok-2); color:var(--ok)}
.pill.warn,.tag.warn{background:var(--warn-bg); border-color:var(--warn-3); color:var(--warn)}
.pill.bad,.tag.bad{background:var(--danger-bg); border-color:var(--danger-2); color:var(--danger)}
.pill.agent,.tag.agent{background:var(--accent-bg); border-color:var(--border-soft); color:var(--accent)}
.pill.review,.tag.review{background:var(--review-bg); border-color:var(--review-2); color:var(--review)}
.pill.mut,.tag.mut{color:var(--muted)}
/* Б3 — выделение ЦВЕТОМ, не жирным (просьба Айгерим). Значения/числа/акценты
   красятся статусным цветом бренда: бордо = внимание/просрочено/срочно;
   зелёный = позитив/оплачено/успех; золото = предупреждение; жёлтый = бренд-акцент. */
.attn,.stat .v.attn,.num.attn,.val-bad,.stat .v.bad,.num.bad{color:var(--danger)}
.pos,.stat .v.pos,.num.pos,.val-ok,.stat .v.ok,.num.ok{color:var(--ok)}
.stat .v.warn,.num.warn,.val-warn{color:var(--warn)}
.accent-y{background:var(--highlight); color:var(--highlight-text); border-radius:6px; padding:1px 6px}
/* Б4 — ключевые заголовки: короткая жёлтая черта-акцент снизу (как в брендбуке) */
.h-accent{position:relative; padding-bottom:10px}
.h-accent::after{content:""; position:absolute; left:0; bottom:0; width:44px; height:3px; background:var(--highlight); border-radius:2px}

/* --- пустые состояния --- */
.empty{color:var(--muted); font-size:14px; padding:14px 0}
.emptybox{display:flex; flex-direction:column; align-items:center; gap:8px; text-align:center; color:var(--muted); background:var(--card); border:1px solid var(--border); border-radius:var(--r); padding:34px 20px}
.emptybox .ti{font-size:30px; color:var(--border-3)}
.emptybox b{color:var(--text-2); font-weight:600; font-family:var(--serif)}
.devbanner{display:flex; align-items:center; gap:14px; background:var(--card); border:1px dashed var(--border-2); border-radius:var(--r); padding:24px; color:var(--muted)}
.devbanner .ti{font-size:28px; color:var(--accent)}

/* --- формы / инпуты --- */
input,select,textarea{font:inherit; color:var(--text)}
/* поля ввода — точные значения эталона v3 (h36, r9, 12.5px, var(--ink-2), pad 0 10) */
input.fld,select.fld{height:36px; padding:0 10px; border:1px solid var(--border-soft); border-radius:9px; background:#fff; font-size:12.5px; color:var(--ink-2)}
textarea.fld,.fld{padding:9px 10px; border:1px solid var(--border-soft); border-radius:9px; background:#fff; font-size:12.5px; color:var(--ink-2)}
.fld:focus,input.fld:focus,select.fld:focus,textarea.fld:focus{outline:2px solid var(--accent); outline-offset:-1px; border-color:var(--accent)}

/* --- топ-бар (страницы без сайдбара) --- */
#ilf-topbar{display:flex; align-items:center; gap:18px; flex-wrap:wrap; padding:12px 24px; border-bottom:1px solid var(--border); background:var(--card);}
.ilf-brand{font-size:20px; font-weight:700; color:var(--text);}
.ilf-brand span{color:var(--accent);}

/* --- уведомления (тост) --- */
.toast{position:fixed; bottom:26px; left:50%; transform:translateX(-50%); background:var(--primary); color:var(--bg); font:600 13px var(--sans); padding:11px 17px; border-radius:11px; box-shadow:0 10px 34px rgba(0,0,0,.28); opacity:0; transition:opacity .2s; pointer-events:none; z-index:2000; display:flex; align-items:center; gap:9px; max-width:80vw}
.toast.show{opacity:1}