/* ─── Расширения токенов прототипа ──────────────────
     tokens.css — контракт цвета, зеркало коллекции Semantic из Figma, он не
     меняется. Здесь живут значения, которые в прототипе были хардкодами внутри
     компонентов (ховеры плашек, тени, цвет разделителей ячеек, скроллбар).
     В Figma аналога у них пока нет; при переносе в прод — либо завести
     соответствующие токены, либо смапить на ближайшие из темы продукта. ─── */
  :root{
    /* surface/* */
    --surface-hover-strong:#e6eaf1;   /* ховер чипов и кружков-иконок (сильнее surface-hover) */
    --surface-glass:rgba(255,255,255,.9);   /* плашки rail поверх фона рабочей области */
    --surface-panel-collapsed:rgba(255,255,255,.85); /* свёрнутая полоска панели */
    --surface-rail-soft:rgba(255,255,255,.65);       /* мягкие кнопки и разделители rail (справка, «+N») */

    /* surface/* (продолжение) */
    --surface-ground:#ebebeb;         /* подложка страницы за рабочей областью */
    --surface-hover-head:#eef0f5;     /* ховер ячейки шапки таблицы */
    --surface-selected-hover:#e2ebf9; /* ховер/фокус выделенной строки (темнее surface-selected) */
    --surface-subtle:#fafbfd;         /* шапки мини-таблиц карточки */
    --surface-stub:#e8effc;           /* заливка заглушки контента */

    /* text/* */
    --text-disabled:#c4c9d9;          /* недоступные кнопки пейджера, ползунки */

    /* icon/* */
    --icon-disabled:#a9b0c3;          /* иконка недоступной операции */

    /* border/* */
    --border-cell:#f0f2f6;            /* разделитель колонок внутри таблицы */
    --border-tree:#d3d9e5;            /* коннекторы дерева во внутреннем меню */
    --border-stub:#a9c4ef;            /* пунктирная рамка заглушки контента */

    /* accent/* */
    --accent-pressed:#1d4ea3;         /* нажатое состояние операции (темнее accent-text) */

    /* поповеры тулбара: тень со всех сторон + волосяная кромка (shadow-menu
       уходит вниз и не очерчивает верх и бока) */
    --shadow-popover:0 0 0 1px rgba(16,24,40,.06), 0 12px 32px rgba(16,24,40,.14), 0 2px 6px rgba(16,24,40,.06);

    /* скроллбары панелей и карточки */
    --scrollbar-thumb:#c9cfdd;

    /* скелетон загрузки (стиль Skeleton/Shimmer из Figma) */
    --skeleton-base:#eceef4;
    --skeleton-sheen:#f7f8fb;

    /* тени плашек rail и кнопок поверх фона */
    --shadow-plate:0 2px 8px rgba(16,24,40,.10);
    --shadow-plate-hover:0 4px 12px rgba(16,24,40,.14);

    /* фокус-кольцо: цветной слой + белая отбивка (конвенция ДС) */
    --focus-ring:0 0 0 2px var(--surface-default),0 0 0 4px var(--border-focus);
    --focus-ring-tight:0 0 0 2px var(--surface-default),0 0 0 3px var(--border-focus);
    /* мягкое кольцо полей ввода: акцент прозрачностью, ложится на любой фон */
    --accent-ring:rgba(42,104,211,.15);
  }