  /* ─── Атом «Кнопка» ─────────────────────────────────
     Figma: 07 – Button. Один класс .btn вместо семи ad-hoc реализаций
     прототипа (.hdr-ic · .sb-toggle · .tbl-tool · .page-act · .pg-btn ·
     .t-close · .f-x). Форма задаётся размером (--20…--48), поведение — тоном
     (ghost · chip · plate · soft · primary · secondary · pager), состояние — .is-active,
     [disabled] и фокус-кольцом из токенов.
     Контекстные отличия (позиция, отступы соседей) живут в организме,
     который кнопку использует, — не здесь. ─── */
  /* cursor задан явно: кнопкой бывает и <label> (переключатели на чекбоксах),
     а у него курсор-стрелка по умолчанию */
  .btn{position:relative;display:grid;place-items:center;flex:none;border-radius:8px;cursor:pointer;
    color:var(--icon-muted);transition:background .15s,color .15s,border-color .15s,box-shadow .15s}
  .btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}

  /* ─ размеры (квадрат со скруглением; 48 — круглая плашка rail) ─ */
  .btn--20{width:20px;height:20px;border-radius:6px}
  .btn--24{width:24px;height:24px;border-radius:6px}
  .btn--28{width:28px;height:28px}
  .btn--32{width:32px;height:32px}
  .btn--40{width:40px;height:40px}
  .btn--48{width:48px;height:48px;border-radius:50%}

  /* ─ тон: ghost — прозрачная, проявляется ховером ─ */
  .btn--ghost:hover{background:var(--surface-hover);color:var(--text-primary)}

  /* ─ тон: chip — постоянная светлая подложка (действия шапки страницы) ─ */
  .btn--chip{background:var(--border-subtle)}
  .btn--chip:hover{background:var(--surface-hover-strong);color:var(--text-primary)}
  .btn--chip:active{background:var(--accent-surface);color:var(--accent-text)}

  /* ─ тон: plate — белая плашка поверх фона рабочей области (rail) ─ */
  .btn--plate{background:var(--surface-glass);box-shadow:var(--shadow-plate)}
  .btn--plate:hover{background:var(--surface-default);color:var(--text-primary);box-shadow:var(--shadow-plate-hover)}

  /* ─ тон: soft — полупрозрачная плашка поверх фона рабочей области, тише plate
       (переключатель «+N» и справка в rail) ─ */
  .btn--soft{background:var(--surface-rail-soft);color:var(--text-secondary)}
  .btn--soft:hover{background:var(--surface-default);color:var(--text-primary)}

  /* ─ тон: primary — акцентная заливка (Figma: 07 – Button · Primary; accent/solid =
       accent-text, ховер — accent-pressed: отдельного solid-hover в tokens.css нет) ─ */
  .btn--primary{background:var(--accent-text);color:var(--surface-default)}
  .btn--primary:hover{background:var(--accent-pressed);color:var(--surface-default)}

  /* ─ тон: danger — деструктивное действие (сброс фильтров) ─ */
  .btn--danger{color:var(--text-tertiary)}
  .btn--danger:hover{background:var(--status-danger-surface);color:var(--status-danger-accent)}

  /* ─ активное состояние: фильтры включены, текущая страница пейджера ─ */
  .btn.is-active{background:var(--accent-surface);color:var(--accent-text)}

  /* ─ тон: pager — номер страницы, ширина растёт с числом разрядов ─ */
  .btn--pager{min-width:28px;height:28px;width:auto;padding:0 6px;
    font-size:13px;font-variant-numeric:tabular-nums;color:var(--text-secondary)}
  .btn--pager:hover{background:var(--surface-hover);color:var(--text-primary)}
  .btn--pager.is-active{font-weight:600}

  /* ─ тон: secondary — текстовая кнопка с рамкой (пустые состояния, заглушка) ─ */
  .btn--secondary{display:inline-flex;align-items:center;gap:8px;width:auto;height:auto;
    padding:8px 14px;border:1px solid var(--border-default);background:var(--surface-default);
    font-size:14px;color:var(--text-primary)}
  .btn--secondary:hover{border-color:var(--accent-text);color:var(--accent-text);background:var(--surface-default)}
  .btn--secondary.btn--sm{padding:7px 14px;font-size:13.5px}

  /* ─ тон: link — действие без фона (сброс поиска, «Показать все») ─ */
  .btn--link{width:auto;height:auto;display:inline;border-radius:4px;padding:2px 4px;margin:-2px -4px;
    font-size:13.5px;font-weight:500;color:var(--accent-text)}
  .btn--link:hover{text-decoration:underline}

  .btn:disabled{color:var(--text-disabled);cursor:default;background:none;box-shadow:none}
  /* выключенный чип не теряет подложку — просто гаснет (пара «Назад»/«Обновить»
     в шапке страницы остаётся парой, как в прототипе) */
  .btn--chip:disabled{background:var(--border-subtle);color:var(--icon-muted);
    opacity:.4;pointer-events:none}

  /* счётчик-пузырёк на кнопке (сколько фильтров/скрытых колонок) */
  .btn .btn-cnt{position:absolute;top:-3px;right:-3px;min-width:16px;height:16px;border-radius:999px;
    background:var(--accent-text);color:var(--surface-default);
    font-size:10.5px;line-height:16px;font-weight:600;padding:0 4px;
    display:flex;align-items:center;justify-content:center;pointer-events:none}
