/* ONKRON EIP — единственный источник токенов интерфейса.
   Правила использования: CLAUDE.md, раздел 1.
   Хардкод значений в компонентах запрещён. Нужен новый оттенок — добавь токен здесь.
   Контраст текстовых токенов держит selftest_kanon.py — ПО ОТРИСОВАННОМУ КАДРУ
   эталона (зоны: углы, свечения, стекло, полотно), не по константе: § 8 дважды
   проходил молча на константах, третьего раза не будет. */

:root{
  /* ── поверхности ── */
  --paper:        #EDF3F6;   /* полотно страницы */
  --paper-2:      #F8FBFC;   /* светлый край градиента полотна */
  --glass:        rgba(255,255,255,.84);   /* матовое стекло: ТОЛЬКО оболочка и герой-блоки */
  --glass-quiet:  rgba(255,255,255,.50);   /* панель пустого состояния */
  --solid:        #FFFFFF;   /* непрозрачная поверхность: всё, где лежат данные */

  /* ── текст ── */
  --ink:          #08191F;   /* основной */
  /* 04.09.2026, строка Андрея: тёмная заливка = «глубокий петроль» (заливка кнопки «Открыть в Решениях»); чёрных заливок нет, страж F12.5 */
  --petrol:#123B3D;
  --fill-petrol:linear-gradient(145deg,#123B3D,#08191F);
  --ink-2:        #3A4E55;   /* вторичный, пояснения */
  --grey-text:    #555458;   /* подписи 11.5–12.5px. Калибровано по кадру СО СКРОЛЛОМ:
                                фон фиксирован к вьюпорту, и при докрутке вниз строка
                                состояния ложится глубже в синее свечение (#B2CDEC,
                                L 0.592) → 4.59:1. Кадр без скролла тоже лгал. */

  /* ── не-текст ── */
  --grey:         #8B8A8F;   /* фирменный вторичный ONKRON. Значение неприкосновенно.
                                С текста снят полностью (3.06:1 на полотне — ниже § 8):
                                только заливки, разделители, неактивные состояния. */

  /* ── линии ──
     Истина — отрисовка эталона (утверждён визуально): сплошные значения,
     эквивалент прежних rgba-бленд на белом. */
  --line:         #D6E2E7;
  --line-soft:    #E7EFF2;
  --line-dashed:  rgba(10,115,112,.28);

  /* ── акценты ── */
  --signal:       #1FCFCB;   /* фирменный: машина, живое, свечение. НЕ для текста (1.94:1) */
  --signal-deep:  #0A716E;   /* тот же смысл для текста. Затемнён с #0A7370: сторож кадра
                                поймал 4.46:1 на ссылке статус-строки (низ градиента) */
  --signal-wash:  #E3F8F8;   /* заливка меток машины */
  --volt:         #1C6FD4;   /* энергия — ТОЛЬКО фон и градиенты */

  /* ── состояния данных ── */
  --alert:        #B4342A;   /* критично: 5.41:1 на полотне, 6.06:1 на белом */
  --warn:         #925D0E;   /* внимание: тон #A76B10 сохранён, затемнено до 4.56:1 против
                                худшего фактического фона плитки (сетка под стеклом, L 0.815) */

  /* ── шрифт (самохостинг: src/styles/fonts.css, src/fonts/) ── */
  --sans: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --cond: "IBM Plex Sans Condensed", "IBM Plex Sans", system-ui, sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --fs-display: 38px;  /* число в плитке, --cond 600 */
  --fs-hero:    66px;  /* число в ядре HUD, --cond 700 */
  --fs-h1:      17px;
  --fs-h2:      15px;
  --fs-body:    14px;
  --fs-small:   12.5px;
  --fs-micro:   11.5px;  /* подписи под индикаторами — цветом --grey-text */

  /* ── геометрия ── */
  --max:        1460px;
  --pad:        28px;
  --rail-w:     236px;
  --radius:     8px;
  --radius-sm:  5px;

  /* ── глубина ── */
  --blur:       blur(18px);
  --edge:       0 1px 0 rgba(10,115,112,.10);
  --lift:       0 10px 30px -20px rgba(8,25,31,.42);
  --glow:       0 0 8px rgba(31,207,203,.75);

  /* ── движение ──
     Движется машина, человек статичен. Смысл каждой строки — CLAUDE.md, раздел 6.
     Хардкод animation-duration в компоненте запрещён. */
  --spin-out:   46s;    /* внешний контур HUD, по часовой */
  --spin-mid:   74s;    /* среднее кольцо, ПРОТИВ часовой */
  --spin-orb:   22s;    /* орбитальные точки */
  --flow:        9s;    /* ток по линии фона, циан */
  --flow-alt:   13s;    /* вторая линия, синяя */
  --flow-delay: 2.4s;   /* сдвиг второй линии */
  --twinkle:     5s;    /* мерцание точек фона */
  --run:       4.8s;    /* импульс на рельсе передачи */
  --pulse:     2.6s;    /* индикатор живого цикла */

  --gate:        60%;   /* граница решения: где импульс останавливается и гаснет.
                           Сквозного прохода нет — см. CLAUDE.md 6, правило 2. */

  --ease-run:   cubic-bezier(.4,0,.5,1);
  --ease-ui:    cubic-bezier(.2,0,.2,1);   /* реакция на действие пользователя */
  --dur-ui:     .18s;                       /* наведение, раскрытие, подтверждение */
}

/* Матовое стекло — оболочка и герой-блоки, их немного.
   Под данными это НЕ поверхность: см. .panel-solid и CLAUDE.md, раздел 5. */
.panel{
  background: var(--glass);
  backdrop-filter: var(--blur);
  -webkit-backdrop-filter: var(--blur);
  border: 1px solid rgba(255,255,255,.9);
  border-radius: var(--radius);
  box-shadow: var(--edge), var(--lift);
}

/* Непрозрачная поверхность данных: таблицы, показатели, весь PL-06.
   Без blur — на тысячестрочных таблицах backdrop-filter стоит кадров,
   а фоновое свечение под цифры не заходит по определению. */
.panel-solid{
  background: var(--solid);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--edge);
}

/* Числовые показания. Моноширинный только здесь и на ID, кодах, SKU, времени. */
.num{
  font-family: var(--mono);
  font-variant-numeric: tabular-nums;
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
}
