/*
 * Material Symbols Outlined — локальная (vendored) копия для оффлайн-работы.
 *
 * История проблемы (см. фикс «обрезается строка вкладок» в FF/Docker):
 *   В каталоге material-symbols/ лежат 5 ttf-файлов outlined-1..5.ttf.
 *   Это НЕ unicode-range шарды одного шрифта, а 5 разных оптических
 *   вариантов (opsz 20/24/28/36/48 pt) ОДНОГО и того же набора иконок —
 *   каждый из них самодостаточен (4203 лигатуры, 4272 непустых глифа).
 *
 *   Раньше CSS объявлял 5 одинаковых @font-face с одинаковыми
 *   font-family/weight/style и БЕЗ unicode-range. Это приводило к двум
 *   проблемам, особенно заметным в Firefox на медленных deployments
 *   (Docker, удалённые сети):
 *     1) FF по спецификации оставлял только последний @font-face
 *        (outlined-5.ttf = 48pt), что для UI-иконок 14–18 px выглядит
 *        хуже и грузится дольше нужного.
 *     2) Без font-display пока ttf загружается, глифы временно
 *        рендерились системным шрифтом — лигатуры (`dashboard`,
 *        `windows-updates`, `admin_panel_settings`) показывались сырым
 *        ASCII-текстом в font-size: 24px (см. правило ниже), вздували
 *        кнопки .main-tab выше min-height: 40px, и шапка с вкладками
 *        визуально «обрезалась».
 *
 *   Решение: оставляем один @font-face с outlined-2.ttf (opsz 24pt —
 *   оптимально для размеров иконок в UI), и принудительно требуем
 *   font-display: block, чтобы fallback-текст вообще не показывался
 *   до подгрузки шрифта.
 *
 *   Остальные ttf (1, 3, 4, 5) намеренно оставлены в репозитории как
 *   опциональные исходники для будущей вариативности — но не подключены.
 */
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/static/vendor/material-symbols/outlined-2.ttf') format('truetype');
}

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  /*
   * Material Symbols использует обязательные лигатуры (rlig), которые
   * включены по умолчанию во всех современных браузерах. Не задаём
   * font-feature-settings: 'liga', т.к. явное переопределение в FF
   * может повлиять на дефолтное состояние других фич; rlig этого не
   * требует и без переопределения корректно срабатывает на ASCII-имени
   * иконки (`dashboard`, `dns`, `policy`, ...).
   */
}