/* Material Symbols Rounded — локальная копия (без зависимости от Google Fonts CDN).
   Полный набор иконок, один woff2 файл на все страницы. */

/* @font-face всегда unlayered — font-rules не принадлежат слоям */
@font-face {
    font-family: 'Material Symbols Rounded';
    font-style: normal;
    font-weight: 400;
    /* L-1: block — даёт браузеру 3с на загрузку шрифта перед рендером фолбэка.
       ВАЖНО: optional вызывал FOUT при Ctrl+F5 (Ctrl+Shift+F5): 100мс окно истекало раньше
       чем 357KB woff2 скачивался с нуля, браузер рисовал текст и больше не делал swap.
       FCP не страдает — loading overlay прикрывает контент пока шрифт грузится. */
    font-display: block;
    src: url(material-symbols-rounded.woff2) format('woff2');
}

/* ВАЖНО: @layer components — без этого layer base-класс (unlayered) бьёт
   любой @layer pages override в catalog/search/cart по CSS Cascade Level 5,
   даже если специфичность выше. common.css объявляет порядок слоёв:
   reset < tokens < components < pages < utilities. */
@layer components {
    .material-symbols-rounded {
        font-family: 'Material Symbols Rounded';
        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;
        font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    }
}