/* Eyal Medical — единый файл стилей системы (жёсткий канон §0 DESIGN_SYSTEM).
   Весь CSS панели, входа, инсталлятора и страниц ошибок — только здесь; в шаблонах — только классы.
   Токены фирменного цвета — в theme.css (генерируется системой из Настройки → עיצוב). */

/* ═══ Дизайн-токены — единственная точка правды (П.3 ТЗ, §0 канона) ═══ */
:root{
    --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
    --em-block-gap: 8px;       /* зазор между блоками страницы: карточки, ряды плиток, колонки */
    --em-gap-row: 6px;         /* зазор внутри ряда: кнопки, действия, элементы одной строки */
    --em-gap-row-lg: 10px;     /* крупный зазор ряда: шапки модалок, заголовок страницы, строки проверки */
    --em-card-pad: 1rem;       /* поле внутри карточки (на телефоне переопределяется) */
    --em-card-head-h: 2.25rem; /* высота шапки блока (название карточки) */
    --em-control-h: 34px;      /* единая высота полей, выпадашек и кнопок в одной строке */
    --em-tab-h: 30px;          /* высота вкладки раздела — свой смысл, отдельно от --em-control-h */
    --em-tab-pad: 5px;         /* внутреннее поле полосы-подложки вкладок */
    --em-tab-pad-x: 12px;      /* боковое поле вкладки */
    --em-tab-font: .82rem;     /* шрифт вкладки */
    --em-tab-badge-h: 18px;    /* счётчик на вкладке: помещается в 30 − 2×5 = 20px */
    --em-page-pad: 1rem;       /* поле контента страницы от краёв (на телефоне переопределяется) */
    --em-radius: 2px;
    --em-tile-height: 85px;
    --em-header-h: 60px;
    --em-sidebar-w: 340px;
    --em-sidebar-w-collapsed: 80px;
    /* Боковое меню — графитовый нейтрал, от фирменного цвета намеренно не зависит (§1.5, §2.2) */
    /* Фон бокового меню считается от краски системы и живёт в файле темы: --em-sidebar-bg */
    --em-menu-text: rgba(221, 223, 238, .72);      /* Blue Sky 72% — пункты */
    --em-menu-text-full: #dddfee;                  /* Blue Sky — наведение и активный */
    --em-menu-heading: rgba(221, 223, 238, .45);   /* Blue Sky 45% — заголовки групп */
    --em-menu-line: rgba(221, 223, 238, .2);       /* линия-декор заголовка */
    --em-menu-hover-bg: rgba(221, 223, 238, .08);  /* подложка наведения */

    /* Мята — вторая краска панели (решение владельца 02.09.2026): полоса активного пункта меню,
       значок пункта при наведении и у активного, кольцо раскрытой выпадашки шапки.
       От краски системы НЕ считается: при смене краски в Настройки → עיצוב мята остаётся прежней. */
    --em-brand-blue: #00457a;       /* синий бренда: витрина и экран входа. От краски настроек НЕ зависит */
    --em-brand-deep: #003760;        /* глубокий синий бренда: переход панели входа и кнопки входа */
    --em-accent: #39cabb;

    /* Знак раздела у заголовка страницы — свой тон каждому из тринадцати разделов
       (решение владельца 02.09.2026; отменяет снятие цветов от 20.08.2026).
       Тона подобраны под контраст: белый значок на середине плитки не ниже 4,5,
       на светлом крае не ниже 3,0. От краски системы не считаются. */
    --em-grad-sec-dashboard: linear-gradient(135deg, #0063ae 0%, #008bf6 100%);  /* לוח בקרה — белый 4.60 / 3.49 */
    --em-grad-sec-documents: linear-gradient(135deg, #6246d1 0%, #927fdf 100%);  /* מסמכים — белый 4.60 / 3.32 */
    --em-grad-sec-clients: linear-gradient(135deg, #3659ca 0%, #6f87d9 100%);  /* לקוחות — белый 4.56 / 3.42 */
    --em-grad-sec-leads: linear-gradient(135deg, #ac4121 0%, #da603b 100%);  /* לידים — белый 4.56 / 3.67 */
    --em-grad-sec-extradocs: linear-gradient(135deg, #9a3ea8 0%, #ba67c7 100%);  /* מסמכים נלווים — белый 4.57 / 3.59 */
    --em-grad-sec-catalog: linear-gradient(135deg, #146849 0%, #1fa473 100%);  /* קטלוג ומלאי — белый 4.55 / 3.17 */
    --em-grad-sec-purchases: linear-gradient(135deg, #71580d 0%, #b18a14 100%);  /* רכש — белый 4.59 / 3.22 */
    --em-grad-sec-importcost: linear-gradient(135deg, #3b681e 0%, #5b9f2e 100%);  /* חישוב עלות יבוא — белый 4.59 / 3.26 */
    --em-grad-sec-reports: linear-gradient(135deg, #ab3688 0%, #cc5dab 100%);  /* דוחות — белый 4.59 / 3.67 */
    --em-grad-sec-users: linear-gradient(135deg, #ba315f 0%, #d45f86 100%);  /* משתמשים והרשאות — белый 4.55 / 3.63 */
    --em-grad-sec-settings: linear-gradient(135deg, #47678b 0%, #688ab1 100%);  /* הגדרות — белый 4.58 / 3.58 */
    --em-grad-sec-site: linear-gradient(135deg, #0c656f 0%, #13a0af 100%);  /* אתר — белый 4.55 / 3.15 */
    --em-grad-sec-system: linear-gradient(135deg, #494949 0%, #6c6c6c 100%);  /* עדכון מערכת — белый 6.79 / 5.25 */

    /* Кнопки: цвет роли — свой токен (§0.2 п.4). Правка цвета кнопки = правка токена */
    --em-grad-action: linear-gradient(135deg, #22c55e, #10b981);
    --em-grad-action-hover: linear-gradient(135deg, #16a34a, #059669);  /* наведение на зелёные «добавить/сохранить» */
    --em-grad-muted: linear-gradient(135deg, #94a3b8, #64748b);
    --em-grad-muted-dark: linear-gradient(135deg, #64748b, #475569);  /* тёмный слейт: наведение на слейт-кнопки и серая плитка цифр */
    --em-muted-rgb: 100, 116, 139;  /* слейт в rgb — для теней и полупрозрачных подложек */
    --em-grad-danger-btn: linear-gradient(135deg, #ef4444, #dc2626);
    --em-grad-whatsapp: linear-gradient(135deg, #25d366, #128c7e);
    --em-grad-amber: linear-gradient(135deg, #f59e0b, #d97706);       /* янтарь: плитка цифр и счётчик сигнала */
    --em-grad-sky: linear-gradient(135deg, #0ea5e9, #0284c7);         /* голубой: кнопка печати и счётчик сигнала */
    --em-grad-sky-hover: linear-gradient(135deg, #0284c7, #0369a1);
    --em-grad-danger-btn-hover: linear-gradient(135deg, #dc2626, #b91c1c);
    --em-grad-whatsapp-hover: linear-gradient(135deg, #128c7e, #075e54);
    --em-grad-back: linear-gradient(135deg, var(--em-primary), var(--em-primary-soft));
    --em-grad-back-hover: linear-gradient(135deg, var(--em-primary-hover), var(--em-primary));
    --em-grad-edit: linear-gradient(135deg, #f59e0b, #f97316);
    --em-grad-edit-hover: linear-gradient(135deg, #d97706, #ea580c);
    --em-grad-view: linear-gradient(135deg, #0ea5e9, #06b6d4);
    --em-grad-view-hover: linear-gradient(135deg, #0284c7, #0891b2);
    --em-grad-restore: linear-gradient(135deg, #22c55e, #16a34a);
    --em-grad-restore-hover: linear-gradient(135deg, #16a34a, #15803d);
    --em-grad-download: linear-gradient(135deg, #14b8a6, #0d9488);
    --em-grad-download-hover: linear-gradient(135deg, #0d9488, #0f766e);
    /* Палитра плиток цифр — вне фирменной семьи (§1.2, §3.3) */
    --em-grad-cyan: linear-gradient(135deg, #06b6d4, #0891b2);
    --em-grad-green: linear-gradient(135deg, #10b981, #059669);
    --em-grad-fuchsia: linear-gradient(135deg, #d946ef, #a21caf);
    /* Блик шапок модалок, выпадашек и календаря */
    --em-glare: radial-gradient(circle at 80% 20%, rgba(255,255,255,.22), transparent 60%);

    /* Активная вкладка раздела — плоская заливка тоном своего раздела (Сборка 83).
       Глубже насыщенного конца гаммы иконки: белый текст на самой гамме даёт 1.4–2.5:1
       при пороге 4.5:1. Тон тот же, связь «иконка = вкладка» читается. */
    /* семантика */
    --em-success-bg:#dcfce7; --em-success-text:#166534; --em-success-border:#bbf7d0; --em-success:#16a34a;
    --em-warn-bg:#fef3c7;    --em-warn-text:#92400e;    --em-warn-border:#fde68a;
    --em-danger-bg:#fee2e2;  --em-danger-text:#991b1b;  --em-danger-border:#fecaca;  --em-danger:#dc2626;
    --em-info-bg:#dbeafe;    --em-info-text:#1e40af;
    --em-neutral-bg:var(--em-subtle); --em-neutral-text:var(--em-text-2); --em-neutral-border:var(--em-border);
    /* Плотная заливка бейджей статусов (§5.2) — белый текст на каждом из этих тонов */
    --em-pill-success:#3f9e51; --em-pill-warn:#e5a532; --em-pill-danger:#b81f3c;
    --em-pill-info:#2e9bd6;   --em-pill-neutral:#748296;
    --em-pill-warn-text:#4a2d00;  /* на янтаре тёмный текст читается, белый — нет */
    /* поверхности и текст */
    --em-page-bg:#f1f4f6; --em-card-bg:#ffffff; --em-subtle:#f1f5f9; --em-row-hover:#e0f3ff;
    --em-surface-2:#f8fafc;   /* светлая подложка: шапка таблицы, подвал модалки, ховер строки сигнала */
    --em-hover-soft:#e6e8f3;  /* наведение: пагинация и чипы диапазонов */
    --em-install-bg:#fafbff; --em-install-border:#eef0f5;  /* шаги и заметка инсталлятора */
    --em-shadow-card:0 .46875rem 2.1875rem rgba(4,9,20,.03), 0 .9375rem 1.40625rem rgba(4,9,20,.03), 0 .25rem .53125rem rgba(4,9,20,.05), 0 .125rem .1875rem rgba(4,9,20,.03);
    --em-shadow-title:0 .46875rem 2.1875rem rgba(4,9,20,.03), 0 .25rem .53125rem rgba(4,9,20,.05);
    --em-shadow-drop:0 .46875rem 2.1875rem rgba(8,10,37,.03), 0 .9375rem 1.40625rem rgba(8,10,37,.03), 0 .25rem .53125rem rgba(8,10,37,.05), 0 .125rem .1875rem rgba(8,10,37,.03), 0 16px 56px rgba(8,10,37,.18);
    --em-text:#1e293b; --em-text-2:#475569; --em-text-3:#64748b; --em-placeholder:#94a3b8; --em-faint:#cbd5e1;
    --em-text-body:#495057;   /* базовый текст: body, поля ввода, пункты выпадашки */
    --em-danger-deep:#b91c1c; /* насыщенный красный: значок сигнала и пункт выхода */
    --em-slate-deep:#334155;  /* тёмный слейт: текст ячейки таблицы */
    --em-skel-mid:#edf1f7;    /* светлая середина бегущего блика скелетона */
    --em-border:#e2e8f0; --em-border-input:#ced4da; --em-border-subtle:var(--em-subtle);
    --em-input-font: 0.9rem;
    /* Белый на фирменном фоне: подложка значка, рамка кнопки-иконки, приглушённый текст шапки.
       Значения жили числами в трёх правилах — теперь каждое написано один раз (Сборка 104) */
    --em-on-brand-veil: rgba(255,255,255,.18);
    --em-on-brand-border: rgba(255,255,255,.45);
    --em-on-brand-dim: rgba(255,255,255,.85);
    /* Окно просмотра документа: ширина окна и полоса просмотрщика PDF (Сборка 106).
       Высота листа считается от ширины по пропорции альбомного A4 — воздуха под листом нет */
    --em-doc-side-w: 380px;    /* колонка «פרטי מסמך» на экране документа (§8.3) */
    --em-doc-w: min(1080px, calc(100vw - 2rem));
    --em-pdf-bar: 40px;
    /* Кольцо фокуса и выбора — четвёртая тень системы. Было написано числами дважды
       (поле в фокусе и выпадашка в фокусе); теперь значение живёт здесь (Сборка 108) */
    --em-ring-focus: 0 0 0 .2rem rgba(var(--em-primary-rgb),.25);
}

*{box-sizing:border-box; margin:0; padding:0;}

/* Атрибут скрытия сильнее любого правила вида. Единственное !important вне блоков
   сброса анимации и подчинения библиотеки выпадашек: у элемента со своим display
   (плашка ошибки входа — display:flex) атрибут hidden без него молча не работал и
   на /login висела пустая красная полоса. Записано в канон §0.2 как исключение.
   Точечные правила [hidden] у отдельных классов сняты — это одна точка правки. */
[hidden]{display:none !important;}

/* Плавные переходы страниц; браузеры без поддержки игнорируют */
@view-transition { navigation: auto; }
::view-transition-old(root),
::view-transition-new(root){animation-duration:.22s; animation-timing-function:ease-out;}
.app-header{view-transition-name:em-header;}
.app-sidebar{view-transition-name:em-sidebar;}
html,body{height:100vh; overflow:hidden;}
body{
    font-family:'Assistant', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size:.88rem;
    color:var(--em-text-body);
    background:var(--em-page-bg);
    -webkit-text-size-adjust:100%;
}

/* Самостоятельные страницы (вход, инсталлятор, ошибки): класс standalone на <html> и <body> */
html.standalone, html.standalone body{height:auto; min-height:100vh; overflow:auto;}
body.standalone{
    display:flex; align-items:center; justify-content:center;
    padding:1rem; background:var(--em-sidebar-bg);
}
body.standalone-light{background:var(--em-page-bg);}

/* Фокус-кольца — канон §4: только :focus-visible */
:focus-visible{
    outline:2px solid var(--em-primary);
    outline-offset:2px;
    border-radius:var(--em-radius);
}
.abtn:focus-visible{
    outline:2px solid #fff;
    outline-offset:-4px;
    box-shadow:0 0 0 2px var(--em-primary);
}

/* ═══ Шапка (§4.1) ═══ */
.app-header{
    position:fixed; top:0; left:0; right:0;
    height:var(--em-header-h);
    display:flex; align-items:center;
    z-index:12;
    background:var(--em-grad-header);
    box-shadow:0 .46875rem 2.1875rem rgba(0,0,0,.03), 0 .25rem .53125rem rgba(0,0,0,.05);
}
.app-header__logo{
    width:var(--em-sidebar-w); height:60px; padding:0 1.5rem;
    display:flex; align-items:center; flex-shrink:0;
    transition:width .3s ease, padding .3s ease;
}
/* Гамбургер — канон шапки: 48×48 без плашки, палочки 26×2 (ряды 15/23/31),
   скрытие меню: кнопка поворачивается на 90°, крайние палочки складываются в ✕, средняя схлопывается */
.hb{
    width:48px; height:48px; background:transparent; border:none; cursor:pointer;
    position:relative; padding:0;
    transition:transform .4s cubic-bezier(0,0,0,1);
}
.hb-bar{
    width:26px; height:2px; background:#fff; border-radius:0;
    display:block; position:absolute; left:11px;
    transition:transform .4s cubic-bezier(0,0,0,1);
}
.hb-bar:nth-child(1){top:15px;}
.hb-bar:nth-child(2){top:23px;}
.hb-bar:nth-child(3){top:31px;}
/* Скрытое меню: десктоп — при свёрнутом; мобайл — при открытом поверх контента */
body.sidebar-collapsed .hb, body.sidebar-open .hb{transform:rotate(90deg);}
body.sidebar-collapsed .hb .hb-bar:nth-child(1), body.sidebar-open .hb .hb-bar:nth-child(1){transform:rotate(45deg) translate(5.65px,5.65px);}
body.sidebar-collapsed .hb .hb-bar:nth-child(2), body.sidebar-open .hb .hb-bar:nth-child(2){transform:scaleX(0);}
body.sidebar-collapsed .hb .hb-bar:nth-child(3), body.sidebar-open .hb .hb-bar:nth-child(3){transform:rotate(-45deg) translate(5.65px,-5.65px);}
.hb:active{transform:scale(.93);}
body.sidebar-collapsed .hb:active, body.sidebar-open .hb:active{transform:rotate(90deg) scale(.93);}
/* Логотип прозрачный: круглая обрезка срезала бы концы рогов — рамки нет вовсе.
   Размер 26, а не 36: прежний файл был кружком, знак занимал в нём 67% высоты
   и читался как 24 точки. Новый обрезан вплотную по рогам и заполняет бокс целиком,
   поэтому при тех же 36 выглядел в полтора раза крупнее прежнего */
.app-header__logo .logo-mark-img{width:26px; height:26px; flex-shrink:0; object-fit:contain; margin-inline-end:var(--em-gap-row-lg);}
.app-header__logo .logo-src{font-size:20px; font-weight:800; color:#fff; letter-spacing:-.5px; white-space:nowrap; display:flex; align-items:baseline; gap:var(--em-gap-row);}
.app-header__logo .logo-sub{font-size:10px; color:rgba(255,255,255,.75); font-weight:400;}
.app-header__logo .header__pane{margin-inline-start:auto;}
.app-header__content{flex:1; display:flex; align-items:center; padding:0 1.5rem;}
.app-header-left{display:flex; align-items:center; gap:var(--em-gap-row);}
.app-header-right{margin-inline-start:auto; display:flex; align-items:center; gap:var(--em-gap-row);}
.hd-btn{
    width:38px; height:38px; border-radius:50%;
    border:none; background:transparent; color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:1rem; cursor:pointer; position:relative; flex-shrink:0;
    transition:background .12s var(--ease-out), transform .1s var(--ease-out), box-shadow .15s var(--ease-out);
}
.hd-btn:hover{background:rgba(255,255,255,.12);}
.hd-btn:active{transform:scale(0.93);}
.header-btn-lg{position:relative; padding:0; display:flex; align-items:center;}
.user-box{display:flex; align-items:center; gap:var(--em-gap-row); position:relative;}
.user-toggle{display:flex; align-items:center; gap:var(--em-gap-row); background:transparent; border:none; cursor:pointer; padding:4px; border-radius:var(--em-radius); transition:background .2s, box-shadow .15s var(--ease-out);}
.user-toggle:hover{background:rgba(255,255,255,.08);}
/* Кольцо мятой = «эта выпадашка сейчас раскрыта». Признак берётся из aria-expanded,
   который кнопки шапки уже объявляют сами — состояние и вид не могут разойтись */
.hd-btn[aria-expanded="true"], .user-toggle[aria-expanded="true"]{box-shadow:inset 0 0 0 1px var(--em-accent);}
.user-toggle .fa-angle-down{color:var(--em-on-brand-dim); font-size:12px; transition:transform .2s;}
.header-user-info{text-align:right; line-height:1.2;}
.header-user-info .widget-heading{font-size:.82rem; font-weight:700; color:#fff; white-space:nowrap;}
.header-user-info .widget-subheading{font-size:.68rem; color:rgba(255,255,255,.7); white-space:nowrap;}
.em-nb-badge{
    position:absolute; top:-2px; left:-2px;
    min-width:18px; height:18px; padding:0 5px; border-radius:9px;
    background:var(--em-grad-danger-btn); color:#fff;
    font-size:10px; font-weight:800; line-height:1; direction:ltr;
    display:none; align-items:center; justify-content:center;
    box-shadow:0 0 0 2px var(--em-primary);
}
.em-nb-badge.show{display:inline-flex;}
.avatar-icon{
    width:38px; height:38px; border-radius:50%;
    background:rgba(255,255,255,.25); border:2px solid rgba(255,255,255,.35);
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-weight:700; font-size:14px; flex-shrink:0;
}
.inline-form{display:inline;}
/* Глобальный поиск (§4.1, механика референса оболочки): кружок-лупа → пилюля 360px,
   текст влетает снизу, лупа поворачивается, отдельный ✕ появляется с задержкой */
.search-wrapper{position:relative; width:42px; transition:width .3s ease;}
.search-wrapper.active{width:380px;}
.search-wrapper .input-holder{
    height:42px; width:42px; overflow:hidden; position:relative;
    border-radius:50px;
    transition:width .3s ease-in-out, background .3s ease-in-out;
}
.search-wrapper.active .input-holder{
    width:340px; background:rgba(255,255,255,.15);
    transition:width .5s cubic-bezier(0, .105, .035, 1.57), background .5s cubic-bezier(0, .105, .035, 1.57);
}
.search-wrapper .search-input{
    width:100%; position:absolute; top:0; inset-inline-start:0; height:42px;
    padding-block:0; padding-inline-start:20px; padding-inline-end:60px;
    background:transparent; border:none; outline:none; box-sizing:border-box;
    color:#fff; font-family:'Assistant', sans-serif; font-size:.9rem; font-weight:500;
    opacity:0; transform:translate(0, 60px);
    transition:opacity .3s cubic-bezier(0, .105, .035, 1.57), transform .3s cubic-bezier(0, .105, .035, 1.57); transition-delay:.3s;
}
/* Конечное положение поля — ровно в рамке: прежние 11 точек сдвига остались от анимации
   и опускали строку ниже середины, а низ поля уходил под обрезку рамки */
.search-wrapper.active .search-input{opacity:1; transform:translate(0, 0);}
.search-wrapper .search-input::placeholder{color:rgba(255,255,255,.7);}
.search-wrapper .search-icon{
    width:42px; height:42px; border:none; padding:0; outline:none;
    position:relative; z-index:2; float:inline-end; cursor:pointer;
    background:rgba(255,255,255,.09); border-radius:30px;
    transition:background .3s ease-in-out;
}
.search-wrapper .search-icon span{
    width:22px; height:22px; display:inline-block; vertical-align:middle;
    position:relative; transform:rotate(-45deg);
    transition:transform .4s cubic-bezier(.65, -0.6, .24, 1.65);
}
.search-wrapper .search-icon span::before, .search-wrapper .search-icon span::after{
    position:absolute; content:'';
}
.search-wrapper .search-icon span::before{
    width:4px; height:11px; left:9px; top:13px; border-radius:var(--em-radius); background:#fff;
}
.search-wrapper .search-icon span::after{
    width:14px; height:14px; left:4px; top:0; border-radius:16px; border:2px solid #fff;
}
.search-wrapper.active .search-icon{background:transparent;}
.search-wrapper.active .search-icon span{transform:rotate(45deg);}
/* Повёрнута на 45°: без поворота две полоски складываются в плюс,
   а плюс рядом с поиском читается как «добавить», а не «закрыть» */
.search-wrapper .btn-close-search{
    position:absolute; z-index:1; top:50%; inset-inline-start:0;
    width:20px; height:20px; margin-top:-10px; padding:0; transform:rotate(45deg);
    border:none; background:transparent; cursor:pointer;
    opacity:0; pointer-events:none;
    transition:opacity .2s cubic-bezier(.285, -0.45, .935, .11), inset-inline-start .2s cubic-bezier(.285, -0.45, .935, .11); transition-delay:.1s;
}
.search-wrapper .btn-close-search::before, .search-wrapper .btn-close-search::after{
    position:absolute; content:''; background:#fff; border-radius:var(--em-radius);
}
.search-wrapper .btn-close-search::before{width:2px; height:20px; left:9px; top:0;}
.search-wrapper .btn-close-search::after{width:20px; height:2px; left:0; top:9px;}
.search-wrapper.active .btn-close-search{
    inset-inline-start:350px; opacity:.6; pointer-events:auto;
    transition:opacity .6s cubic-bezier(0, .105, .035, 1.57), inset-inline-start .6s cubic-bezier(0, .105, .035, 1.57); transition-delay:.5s;
}
.search-wrapper.active .btn-close-search:hover{opacity:1;}

/* Узкие экраны: ступени ширины раскрытого поиска (канон шапки) */
@media (max-width:1200px){
    .search-wrapper.active{width:260px;}
    .search-wrapper.active .input-holder{width:220px;}
    .search-wrapper.active .btn-close-search{inset-inline-start:230px;}
}
@media (max-width:992px){
    .search-wrapper.active{width:230px;}
    .search-wrapper.active .input-holder{width:190px;}
    .search-wrapper.active .btn-close-search{inset-inline-start:200px;}
}

/* ═══ Сайдбар (§4.2) ═══ */
.app-sidebar{
    width:var(--em-sidebar-w);
    position:fixed; top:var(--em-header-h); right:0; bottom:0;
    z-index:11;
    display:flex; flex-direction:column;
    background:var(--em-sidebar-bg);
    box-shadow:7px 0 60px rgba(0,0,0,.05);
    transition:transform .3s ease, width .25s ease;
    overflow:hidden;
}
.app-sidebar__inner{overflow-y:auto; padding:12px 1.5rem 1.5rem; flex:1; -webkit-overflow-scrolling:touch;}
.app-sidebar__heading{
    display:flex; align-items:center; gap:var(--em-gap-row);
    padding:12px 0 6px;
    font-size:.65rem; font-weight:800; letter-spacing:1.5px;
    color:var(--em-menu-heading); text-transform:uppercase;
}
.app-sidebar__heading::before{content:''; width:16px; height:1px; background:var(--em-menu-line);}
.vertical-nav-menu{list-style:none; display:flex; flex-direction:column; gap:2px;}
.vertical-nav-menu a{
    display:flex; align-items:center; gap:var(--em-gap-row);
    padding:9px 16px; margin:2px 0; border-radius:var(--em-radius);
    color:var(--em-menu-text); text-decoration:none;
    font-size:.88rem; font-weight:600;
    position:relative;
    transition:background-color .15s var(--ease-out), color .15s var(--ease-out), padding .2s var(--ease-out);
}
.vertical-nav-menu a i{width:20px; text-align:center; font-size:15px; opacity:.6; transition:opacity .2s, color .2s var(--ease-out);}
.vertical-nav-menu a:hover{background:var(--em-menu-hover-bg); color:var(--em-menu-text-full);}
.vertical-nav-menu a:hover i{opacity:1; color:var(--em-accent);}
.vertical-nav-menu a.mm-active{
    background:linear-gradient(90deg, rgba(var(--em-primary-rgb),.9), rgba(var(--em-primary-rgb),.45));
    box-shadow:inset 3px 0 0 var(--em-accent), 0 2px 8px rgba(var(--em-primary-rgb),.2);
    color:var(--em-menu-text-full); font-weight:700;
}
.vertical-nav-menu a.mm-active i{opacity:1; color:var(--em-accent);}
.sidebar-overlay{
    display:none; position:fixed; inset:0; top:var(--em-header-h);
    background:rgba(0,0,0,.4); z-index:10; border:none;
}

/* ═══ Контент (§4.3, scroll model §0) ═══ */
.app-main{
    margin-right:var(--em-sidebar-w);
    margin-top:var(--em-header-h);
    height:calc(100vh - var(--em-header-h));
    overflow:auto;
    transition:margin .3s ease;
}
.app-main__inner{padding:var(--em-page-pad);}

/* Свёрнутое меню (десктоп): полоска 80px; наведение временно раскрывает (канон); память в localStorage */
@media (min-width:769px){
    body.sidebar-collapsed .app-sidebar{width:var(--em-sidebar-w-collapsed);}
    body.sidebar-collapsed .app-sidebar__inner{padding:12px 0;}
    body.sidebar-collapsed .app-sidebar__heading{text-indent:-9999px; padding:8px 0; margin:var(--em-gap-row) var(--em-block-gap); position:relative; height:1px; overflow:hidden;}
    body.sidebar-collapsed .app-sidebar__heading::before{display:none;}
    body.sidebar-collapsed .app-sidebar__heading::after{content:''; position:absolute; top:50%; left:10%; right:10%; height:1px; background:var(--em-menu-line);}
    body.sidebar-collapsed .vertical-nav-menu a{justify-content:center; padding:11px 0; margin:3px var(--em-block-gap); font-size:0; border-radius:var(--em-radius); transition:background-color .15s, color .15s;}
    body.sidebar-collapsed .vertical-nav-menu a span{display:none;}
    body.sidebar-collapsed .vertical-nav-menu a i{font-size:16px; width:auto; margin:0; opacity:.85; transition:opacity .15s, color .2s var(--ease-out);}
    body.sidebar-collapsed .vertical-nav-menu a.mm-active::before{display:none;}
    body.sidebar-collapsed .app-main{margin-right:var(--em-sidebar-w-collapsed);}
    body.sidebar-collapsed .app-header__logo{width:var(--em-sidebar-w-collapsed); padding:0; justify-content:center;}
    body.sidebar-collapsed .app-header__logo .logo-src, body.sidebar-collapsed .app-header__logo .logo-sub{display:none;}
    /* В свёрнутом виде на логотип места нет: гамбургер 48 + знак 36 не влезают
       в 80 точек, и знак вылезал за правый край экрана */
    body.sidebar-collapsed .app-header__logo .logo-mark-img{display:none;}
    body.sidebar-collapsed .app-header__logo .header__pane{margin-inline-start:0;}
    body.sidebar-collapsed .app-header__content{padding-right:0;}
    body.sidebar-collapsed .app-sidebar:hover{width:var(--em-sidebar-w); box-shadow:7px 0 60px rgba(0,0,0,.25);}
    body.sidebar-collapsed .app-sidebar:hover .app-sidebar__inner{padding:12px 1.5rem 1.5rem;}
    body.sidebar-collapsed .app-sidebar:hover .app-sidebar__heading{text-indent:0; padding:12px 0 6px; margin:0; height:auto; overflow:visible;}
    body.sidebar-collapsed .app-sidebar:hover .app-sidebar__heading::after{display:none;}
    body.sidebar-collapsed .app-sidebar:hover .app-sidebar__heading::before{display:inline-block;}
    body.sidebar-collapsed .app-sidebar:hover .vertical-nav-menu a{justify-content:flex-start; padding:9px 16px; margin:2px 0; font-size:.88rem;}
    body.sidebar-collapsed .app-sidebar:hover .vertical-nav-menu a span{display:inline;}
    body.sidebar-collapsed .app-sidebar:hover .vertical-nav-menu a i{width:20px; font-size:16px;}
    body.sidebar-collapsed .app-sidebar:hover .vertical-nav-menu a.mm-active::before{display:block;}
}

/* На время первичной отрисовки — без анимаций (анти-мигание при восстановлении состояния) */
body.preload .app-sidebar, body.preload .app-main, body.preload .app-header__logo,
body.preload .hb, body.preload .hb-bar{transition:none !important;}

/* ═══ Заголовок страницы (§5.1 + канон высоты) ═══ */
.app-page-title{
    background:var(--em-card-bg);
    height:var(--em-tile-height); min-height:var(--em-tile-height);
    padding:0 var(--em-card-pad);
    display:flex; align-items:center;
    border-radius:var(--em-radius);
    box-shadow:var(--em-shadow-title);
    margin-bottom:var(--em-block-gap);
}
.page-title-wrapper{display:flex; align-items:center; flex-wrap:wrap; width:100%; gap:var(--em-gap-row-lg);}
.page-title-heading{display:flex; align-items:center; gap:var(--em-gap-row-lg);}
.page-title-icon{
    width:60px; height:60px; border-radius:var(--em-radius); flex-shrink:0;
    background:var(--em-grad-primary);
    box-shadow:var(--em-shadow-title);
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-size:2rem;
}
/* Знак раздела у заголовка — свой тон каждому разделу (§3, решение владельца 02.09.2026).
   Классы pti-* уже стоят в разметке всех экранов; правка тона раздела — одна строка выше. */
.page-title-icon.pti-dashboard{background:var(--em-grad-sec-dashboard);}
.page-title-icon.pti-documents{background:var(--em-grad-sec-documents);}
.page-title-icon.pti-clients{background:var(--em-grad-sec-clients);}
.page-title-icon.pti-leads{background:var(--em-grad-sec-leads);}
.page-title-icon.pti-extradocs{background:var(--em-grad-sec-extradocs);}
.page-title-icon.pti-catalog{background:var(--em-grad-sec-catalog);}
.page-title-icon.pti-purchases{background:var(--em-grad-sec-purchases);}
.page-title-icon.pti-importcost{background:var(--em-grad-sec-importcost);}
.page-title-icon.pti-reports{background:var(--em-grad-sec-reports);}
.page-title-icon.pti-users{background:var(--em-grad-sec-users);}
.page-title-icon.pti-settings{background:var(--em-grad-sec-settings);}
.page-title-icon.pti-site{background:var(--em-grad-sec-site);}
.page-title-icon.pti-system{background:var(--em-grad-sec-system);}
.page-title-text{font-size:1.1rem; font-weight:400; color:#343a40; line-height:1.2;}
.page-title-subheading{font-size:.88rem; opacity:.6; padding:0; line-height:1.2;}
.page-title-actions{margin-inline-start:auto; display:flex; gap:var(--em-gap-row); flex-wrap:wrap; justify-content:flex-end;}

/* ═══ Карточки (§5.3 + Rule 4) ═══ */
.card{
    background:var(--em-card-bg);
    border-radius:var(--em-radius);
    border:0;
    box-shadow:var(--em-shadow-card);
    margin-bottom:var(--em-block-gap);
}
.card > .card-header:first-child{
    border-top-left-radius:var(--em-radius);
    border-top-right-radius:var(--em-radius);
}
.card > .card-body:last-child, .card > .card-footer:last-child{
    border-bottom-left-radius:var(--em-radius);
    border-bottom-right-radius:var(--em-radius);
}
.card-header{
    display:flex; align-items:center; flex-wrap:wrap; gap:var(--em-gap-row);
    padding-block:.375rem; padding-inline-start:.625rem; padding-inline-end:var(--em-card-pad);
    min-height:var(--em-card-head-h); line-height:1.2;
    font-size:.88rem; font-weight:700;
    text-transform:uppercase;
    color:rgba(43,37,100,.7);
    background:var(--em-card-bg);
    border-bottom:1px solid rgba(32,39,140,.125);
}
/* Ведущая иконка шапки карточки — всегда индиго; исключения — модификаторы ниже */
.card-header > i:first-child{color:var(--em-primary);}
.card-header-ok > i:first-child{color:var(--em-success);}
.card-header-danger{color:var(--em-danger-text);}
.card-header-danger > i:first-child{color:var(--em-danger-text);}
.card-body{padding:var(--em-card-pad); background:var(--em-card-bg);}
.card-footer{padding:var(--em-card-pad); border-top:1px solid var(--em-border-subtle); background:var(--em-card-bg);}
.card-footer-actions{display:flex; gap:var(--em-gap-row);}
.card-note{color:var(--em-text-3); font-size:.88rem; margin-bottom:14px;}

/* ═══ Кнопки .abtn (§5.5 A/B) ═══ */
.abtn{
    display:inline-flex; align-items:center; justify-content:center; gap:var(--em-gap-row);
    padding:8px 16px; border-radius:var(--em-radius);
    font-family:'Assistant', sans-serif; font-size:13px; font-weight:600;
    text-decoration:none; border:none; cursor:pointer;
    transition:background .2s var(--ease-out), transform .15s var(--ease-out),
               box-shadow .2s var(--ease-out), color .15s var(--ease-out);
    box-shadow:0 2px 4px rgba(0,0,0,.1);
    white-space:nowrap; line-height:1.2; min-height:var(--em-control-h);
}
.abtn:hover{transform:translateY(-1px); box-shadow:0 4px 8px rgba(0,0,0,.15); color:#fff;}
.abtn:active{transform:translateY(-1px) scale(0.97); transition:transform 100ms var(--ease-out);}
.abtn:disabled{opacity:.5; cursor:not-allowed; transform:none; box-shadow:none;}
.abtn-add{background:var(--em-grad-action); color:#fff;}
.abtn-add:hover{background:var(--em-grad-action-hover);}
.abtn-save{background:var(--em-grad-action); color:#fff;}
.abtn-save:hover{background:var(--em-grad-action-hover);}
.abtn-back{background:var(--em-grad-back); color:#fff;}
.abtn-back:hover{background:var(--em-grad-back-hover);}
.abtn-cancel{background:var(--em-grad-muted); color:#fff;}
.abtn-cancel:hover{background:var(--em-grad-muted-dark);}
.abtn-delete{background:var(--em-grad-danger-btn); color:#fff;}
.abtn-delete:hover{background:var(--em-grad-danger-btn-hover);}
.abtn-whatsapp{background:var(--em-grad-whatsapp); color:#fff;}
.abtn-whatsapp:hover{background:var(--em-grad-whatsapp-hover);}
.abtn-sm{padding:5px 8px !important; min-height:28px !important; font-size:11px !important;}
.abtn-edit{background:var(--em-grad-edit); color:#fff;}
.abtn-edit:hover{background:var(--em-grad-edit-hover);}
.abtn-view{background:var(--em-grad-view); color:#fff;}
.abtn-view:hover{background:var(--em-grad-view-hover);}
.abtn-restore{background:var(--em-grad-restore); color:#fff;}
.abtn-restore:hover{background:var(--em-grad-restore-hover);}
.abtn-download{background:var(--em-grad-download); color:#fff;}
.abtn-download:hover{background:var(--em-grad-download-hover);}
.btn-row{display:flex; flex-wrap:wrap; gap:var(--em-gap-row);}
.btn-row-top{margin-top:12px;}

/* ═══ Пилюли (.em-pill §5.2) ═══ */
.em-pill{
    display:inline-flex; align-items:center; gap:5px;
    border-radius:var(--em-radius); font-size:.72rem; font-weight:800; line-height:1.4;
    letter-spacing:.3px; padding:3px 9px; border:none; color:#fff; white-space:nowrap;
}
.em-pill i{font-size:.65rem;}
.em-pill-success{background:var(--em-pill-success);}
.em-pill-warn{background:var(--em-pill-warn); color:var(--em-pill-warn-text);}
.em-pill-danger{background:var(--em-pill-danger);}
.em-pill-info{background:var(--em-pill-info);}
.em-pill-neutral{background:var(--em-pill-neutral);}
.em-pill-note{margin-bottom:12px;}

/* ═══ Формы (§5.7 B + токен --em-input-font A) ═══ */
.form-group{margin-bottom:1rem;}
/* 🔴 Подпись поля — мелкая надпись НАД полем (решение владельца 25.08.2026).
   Без заливки, без рамки, приглушённым цветом. Прежняя светлая плашка сбоку
   (15.08.2026) отменена: она забирала 200 точек в каждой клетке формы.
   Одно устройство на все формы системы: разметка не меняется, вид задаёт этот блок. */
.form-group > label{
    display:block; font-size:.78rem; font-weight:600;
    color:var(--em-text-3); margin-bottom:4px; line-height:1.3;
}
.form-control{
    width:100%; padding:.375rem .75rem;
    border:1px solid var(--em-border-input); border-radius:var(--em-radius);
    font-family:'Assistant', sans-serif; font-size:.88rem;
    color:var(--em-text-body); background:#fff;
    height:var(--em-control-h); line-height:1.2;
    transition:border-color .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
/* Многострочное поле и список живут своей высотой */
textarea.form-control{height:auto; min-height:calc(var(--em-control-h) * 2); padding-block:.5rem;}
select[multiple].form-control{height:auto;}
input[type="file"].form-control{height:auto;}
.form-control::placeholder{color:var(--em-placeholder);}
.form-control:focus{
    outline:none; border-color:var(--em-primary-soft);
    box-shadow:var(--em-ring-focus);
}
/* Поле с ошибкой — один класс на всю систему. Стоит ПОСЛЕ :focus, у правил равный вес:
   пока значение неверное, рамка остаётся красной и во время набора (Сборка 108) */
.form-control.is-invalid{
    border-color:var(--em-danger); background:var(--em-danger-bg);
    box-shadow:none;
}
/* Общие элементы форм — один класс на всю систему */
.f-hint{font-size:.74rem; color:var(--em-text-3); margin-top:4px;}
.f-err{font-size:.74rem; color:var(--em-danger-text); margin-top:4px;}
.f-req{color:var(--em-danger); font-weight:700;}
.f-vat{font-size:.78rem; color:var(--em-text-2); margin-top:4px;}
.f-ro{background:var(--em-subtle); color:var(--em-text-2);}
.f-grid{display:grid; grid-template-columns:1fr 1fr; gap:var(--em-gap-row-lg);}
.f-grid .f-full{grid-column:1 / -1;}
.f-grid-narrow{max-width:560px;}
.f-check{display:flex; align-items:center; gap:var(--em-gap-row); font-size:.85rem; color:var(--em-text-2);}
.f-check input{width:18px; height:18px; accent-color:var(--em-primary); flex-shrink:0;}
.f-check label{margin:0;}
.f-check-pad{padding-top:8px;}

/* Ограничение ширины относится к полю, а не ко всей группе: узкая группа сжала бы
   и подпись, и та переносилась бы в две строки. Блок стоит ПОСЛЕ правил сетки формы
   намеренно — у `.f-grid` и `.f-grid-narrow` одинаковый вес, побеждает записанное ниже
   (урок 15.08.2026). */
@media (min-width:769px){
    .form-group.w-max-120, .form-group.w-max-360{max-width:none;}
    .form-group.w-max-120 > .form-control{max-width:120px;}
    .form-group.w-max-360 > .form-control{max-width:360px;}
}
/* Ноутбук: форма идёт одной колонкой. Правило осталось с прежней плашечной раскладки;
   пересмотр — отдельным решением владельца. */
@media (min-width:769px) and (max-width:1279px){
    .f-grid{grid-template-columns:minmax(0, 1fr);}
}
.chk{width:18px; height:18px; accent-color:var(--em-primary);}
.chk-sm{width:16px; height:16px; accent-color:var(--em-primary);}
.lbl-chk-inline{display:inline-flex; align-items:center; gap:4px; margin-inline-end:var(--em-gap-row-lg); font-size:.8rem;}
.form-actions{display:flex; gap:var(--em-gap-row); margin-top:16px; padding-top:16px; border-top:1px solid var(--em-border-subtle);}
.w-max-120{max-width:120px;}
.w-max-360{max-width:360px;}

/* ═══ Таблицы-списки (§5.6 B + §5.11 A: stagger) ═══ */
.table{width:100%; border-collapse:collapse;}
.table thead th{
    text-align:start; padding:10px 12px;
    background:var(--em-surface-2);
    font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.4px;
    color:var(--em-text-3); border-bottom:2px solid var(--em-border);
    white-space:nowrap;
}
.table tbody td{
    padding:11px 12px; font-size:.85rem; color:var(--em-slate-deep);
    border-bottom:1px solid var(--em-border-subtle);
    vertical-align:middle;
}
.table-hover tbody tr{transition:background .12s var(--ease-out); cursor:pointer;}
.table-hover tbody tr:hover{background:var(--em-row-hover);}
.td-c{text-align:center;}
.txt-faint{color:var(--em-faint);}
.txt-strong{font-weight:700;}
.num-ltr{direction:ltr; text-align:right;}
@keyframes emRowFadeIn{from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:none;}}
.main-card tbody tr{opacity:0; animation:emRowFadeIn .25s var(--ease-out) forwards;}
.main-card tbody tr:nth-child(1){animation-delay:0ms;}
.main-card tbody tr:nth-child(2){animation-delay:25ms;}
.main-card tbody tr:nth-child(3){animation-delay:50ms;}

/* ═══ Пустое состояние (.em-empty-state §5.3) ═══ */
.em-empty-state{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    padding:48px 24px; text-align:center;
}
.em-empty-state-icon{
    width:56px; height:56px; border-radius:50%;
    background:linear-gradient(135deg, var(--em-neutral-bg), var(--em-neutral-border));
    color:var(--em-placeholder); font-size:22px;
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 14px;
}
.em-empty-state-title{font-weight:700; color:var(--em-text); font-size:.98rem; margin:0 0 var(--em-gap-row);}
.em-empty-state-text{color:var(--em-text-3); font-size:.82rem; margin:0 auto 14px; max-width:360px;}

/* ═══ Тост (§5.6 A + §10.6 B) ═══ */
@keyframes emSlideIn{from{opacity:0; transform:translateY(-8px) scale(.98);} to{opacity:1; transform:none;}}
@keyframes emToastIn{from{opacity:0; transform:translateX(-20px);} to{opacity:1; transform:none;}}
.em-toast-container{
    position:fixed; top:calc(78px + env(safe-area-inset-top, 0px)); inset-inline-end:16px; z-index:10055;
    display:flex; flex-direction:column; align-items:flex-end; gap:var(--em-gap-row);
    max-width:380px; pointer-events:none;
}
.em-toast{
    pointer-events:auto; position:relative; overflow:hidden;
    display:flex; align-items:flex-start; gap:var(--em-gap-row);
    background:#fff; border:1px solid var(--em-border); border-radius:var(--em-radius);
    box-shadow:0 10px 32px rgba(8,10,37,.12), 0 4px 12px rgba(8,10,37,.08);
    padding:12px 14px; font-size:.85rem; color:var(--em-text);
    min-width:260px;
    opacity:0; transform:translateX(20px);
    transition:opacity .2s var(--ease-out), transform .2s var(--ease-out);
}
.em-toast.show{opacity:1; transform:translateX(0);}
.em-toast.hide{opacity:0; transform:translateX(20px);}
.em-toast::before{content:''; position:absolute; inset-inline-start:0; top:0; bottom:0; width:4px;}
.em-toast-success::before{background:var(--em-success);}
.em-toast-error::before{background:var(--em-danger);}
.em-toast-icon{
    width:28px; height:28px; flex-shrink:0; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    font-size:.85rem; margin-inline-start:4px;
}
.em-toast-success .em-toast-icon{background:var(--em-success-bg); color:var(--em-success-text);}
.em-toast-error .em-toast-icon{background:var(--em-danger-bg); color:var(--em-danger-text);}
.em-toast-msg{flex:1; padding-top:5px; font-weight:600;}
.em-toast-close{
    border:none; background:transparent; cursor:pointer;
    color:var(--em-placeholder); font-size:.75rem;
    padding:4px; margin-top:2px; border-radius:var(--em-radius);
    display:flex; align-items:center; justify-content:center;
    transition:background .12s var(--ease-out), color .12s var(--ease-out);
}
.em-toast-close:hover{background:var(--em-subtle); color:var(--em-text);}
.em-toast-close:active{transform:scale(0.92);}

/* Утилита скрытия (управляется из JS вместо инлайн-стилей) */
.is-hidden{display:none !important;}

/* ═══ Колауты ═══ */
.em-callout-warn{
    margin-top:12px; font-size:.82rem; color:var(--em-warn-text);
    background:var(--em-warn-bg); border:1px solid var(--em-warn-border);
    border-radius:var(--em-radius); padding:9px 12px;
}
.em-list-title{font-weight:700; margin-bottom:var(--em-block-gap);}
.em-checklist{padding-inline-start:20px; line-height:1.9;}

/* ═══ Модалка подтверждения (канон §5.7) ═══ */
.em-modal-overlay{position:fixed; inset:0; z-index:10050; background:rgba(15,23,42,.55); display:flex; align-items:center; justify-content:center; padding:1rem;}
.em-modal-card{background:var(--em-card-bg); border-radius:var(--em-radius); box-shadow:0 25px 80px rgba(0,0,0,.35); width:100%; max-width:440px; overflow:hidden; position:relative; animation:emSlideIn .2s ease-out;}
.em-modal-head{display:flex; align-items:center; justify-content:flex-start; gap:var(--em-gap-row-lg); padding:1rem 1.25rem; padding-inline-end:3rem; background:var(--em-grad-primary); color:#fff; font-weight:700; position:relative; overflow:hidden;}
.em-modal-head::before{content:''; position:absolute; inset:0; background:var(--em-glare); pointer-events:none;}
.em-modal-head > *{position:relative;}
.em-modal-x{position:absolute; top:8px; inset-inline-end:8px; z-index:2; border:none; background:transparent; color:var(--em-on-brand-dim); cursor:pointer; width:32px; height:32px; border-radius:var(--em-radius); display:inline-flex; align-items:center; justify-content:center; font-size:14px; transition:background .12s var(--ease-out), color .12s var(--ease-out);}
.em-modal-x:hover{background:var(--em-on-brand-veil); color:#fff;}
.em-modal-icon{width:42px; height:42px; border-radius:50%; background:var(--em-on-brand-veil); display:flex; align-items:center; justify-content:center; font-size:18px; flex-shrink:0;}
.em-modal-title{font-size:1rem; font-weight:800; color:#fff; margin:0; text-align:start; min-width:0; overflow-wrap:anywhere;}
.em-modal-x:active{transform:scale(.92);}
.em-modal-body{padding:1.1rem 1.25rem; color:var(--em-text-2); font-size:.92rem; line-height:1.5; white-space:pre-line;}
.em-modal-card-lg{max-width:640px;}
.em-modal-body-rich{white-space:normal; max-height:calc(100vh - 16rem); overflow:auto;}
.em-modal-foot{display:flex; justify-content:flex-end; gap:var(--em-gap-row); padding:.85rem 1.25rem; background:var(--em-surface-2); border-top:1px solid var(--em-border);}
.em-modal-foot .em-btn-cancel{background:var(--em-neutral-border); color:var(--em-neutral-text);}
.em-modal-foot .em-btn-cancel:hover{background:var(--em-faint);}
.em-modal-foot .em-btn-ok{background:var(--em-grad-muted); color:#fff; box-shadow:0 2px 6px rgba(var(--em-muted-rgb),.3);}
.em-modal-foot .em-btn-ok:hover{background:var(--em-grad-muted-dark);}

/* ═══ Окно просмотра документа (§3.28, Сборка 104) ═══
   PDF открывается окном канона, а не вкладкой браузера. Действия — иконками
   в шапке, каждая в цвете своей роли; подпись действия даёт своя подсказка. */
.em-modal-card-doc{width:var(--em-doc-w); max-width:var(--em-doc-w); max-height:calc(100vh - 2rem); display:flex; flex-direction:column;}
.em-doc-head{
    display:flex; align-items:center; gap:var(--em-gap-row-lg);
    padding:var(--em-gap-row-lg) 1.25rem;
    background:var(--em-grad-primary); color:#fff; position:relative; flex-shrink:0;
}
.em-doc-head::before{content:''; position:absolute; inset:0; background:var(--em-glare); pointer-events:none;}
.em-doc-head > *{position:relative;}
.em-doc-head-icon{width:42px; height:42px; border-radius:50%; background:var(--em-on-brand-veil); display:flex; align-items:center; justify-content:center; font-size:17px; flex-shrink:0;}
.em-doc-head-text{min-width:0;}
.em-doc-head-title{font-size:1rem; font-weight:800; color:#fff; margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.em-doc-head-sub{font-size:.8rem; font-weight:600; color:var(--em-on-brand-dim); line-height:1.5; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.em-doc-head-actions{margin-inline-start:auto; display:flex; align-items:center; gap:var(--em-gap-row); flex-shrink:0;}
.em-doc-head-sep{width:1px; height:22px; background:var(--em-on-brand-border);}
.em-doc-body{flex:0 1 auto; min-height:0; padding:0; background:var(--em-card-bg);
    /* лист альбомного A4 по ширине окна плюс полоса просмотрщика; на низком экране блок сжимается */
    height:calc(var(--em-doc-w) * 210 / 297 + var(--em-pdf-bar));}
.em-doc-frame{width:100%; height:100%; border:none; background:var(--em-card-bg); display:block;}

/* Кнопка-иконка: тот же .abtn и та же роль-гамма, только квадрат по высоте элемента */
.abtn-icon{width:var(--em-control-h); padding:0;}
/* Печать (роль отсутствовала в файле, хотя класс использовался — Сборка 104) */
.abtn-print{background:var(--em-grad-sky); color:#fff;}
.abtn-print:hover{background:var(--em-grad-sky-hover);}
/* Оригинал для подшивки — та же семья, тон глубже: две родственные операции печати */
.abtn-print-original{background:var(--em-grad-sky-hover); color:#fff;}
.abtn-print-original:hover{background:var(--em-grad-sky);}

/* Подсказка системы: имя действия на иврите рисует система, окна ОС нет */
.em-tip{position:relative;}
.em-tip::after{
    content:attr(data-em-tip); position:absolute; top:calc(100% + var(--em-gap-row)); inset-inline-end:50%;
    transform:translateX(50%);
    background:var(--em-slate-deep); color:#fff; font-size:11px; font-weight:600; line-height:1;
    padding:var(--em-gap-row) var(--em-block-gap); border-radius:var(--em-radius); white-space:nowrap;
    opacity:0; pointer-events:none; box-shadow:var(--em-shadow-title); z-index:5;
    transition:opacity .12s var(--ease-out);
}
.em-tip:hover::after, .em-tip:focus-visible::after{opacity:1;}
.em-btn-ok, .em-btn-cancel{display:inline-flex; align-items:center; gap:var(--em-gap-row); padding:8px 16px; border:none; border-radius:var(--em-radius); font-family:'Assistant',sans-serif; font-size:13px; font-weight:600; cursor:pointer; min-height:var(--em-control-h); transition:background .2s var(--ease-out), transform .15s var(--ease-out);}
.em-btn-ok:active, .em-btn-cancel:active{transform:scale(.97);}

/* ═══ Пагинация ═══ */
.em-pagination{display:flex; flex-wrap:wrap; gap:4px; align-items:center; justify-content:center; padding:4px;}
.em-pagination a, .em-pagination span{min-width:var(--em-control-h); height:var(--em-control-h); padding:0 10px; display:inline-flex; align-items:center; justify-content:center; border-radius:var(--em-radius); font-size:.85rem; font-weight:600; text-decoration:none; color:var(--em-text-2); background:var(--em-subtle);}
.em-pagination a:hover{background:var(--em-hover-soft);}
.em-pagination .em-page-active{background:var(--em-grad-primary); color:#fff;}
.em-pagination .em-page-disabled{opacity:.45;}

/* ═══ Фильтры и действия строк ═══ */
.filter-bar{display:flex; flex-wrap:nowrap; gap:var(--em-gap-row); align-items:flex-end; margin:0;}
.filter-bar .filter-field{display:flex; flex-direction:column; gap:4px; flex:1 1 0; min-width:0;}
.filter-bar .filter-field label{font-size:.7rem; font-weight:700; color:var(--em-text-3); text-transform:uppercase; letter-spacing:.4px;}
.filter-bar .filter-actions{display:flex; gap:var(--em-gap-row); align-items:flex-end; flex:0 0 auto; flex-direction:row; justify-content:flex-end;}
.row-actions{display:flex; align-items:center; gap:4px; direction:ltr; flex-wrap:wrap; justify-content:flex-start;}  /* блок действий занимает всю ячейку и прижимается к концу строки (в RTL — к левому краю страницы) */

/* ═══ Общие элементы списков (имя · цена · подпись) — используются во всех разделах ═══ */
.list-name{font-weight:700;}
.list-name + .em-pill{margin-inline-start:var(--em-gap-row);}
.price-main{font-weight:700; direction:ltr; text-align:right;}
.price-vat{font-size:.72rem; color:var(--em-text-3); direction:ltr; text-align:right;}
.meta-sub{display:block; font-size:.72rem; color:var(--em-text-3);}

/* ═══ Светофор остатка ═══ */
.sti-stk{display:inline-flex; align-items:center; gap:5px; padding:3px 10px; border-radius:999px; font-size:.72rem; font-weight:700; line-height:1.4;}
.sti-stk-ok{background:var(--em-success-bg); color:var(--em-success-text);}
.sti-stk-low{background:var(--em-warn-bg); color:var(--em-warn-text);}
.sti-stk-out{background:var(--em-danger-bg); color:var(--em-danger-text);}

/* ═══ Живой отбор списков (§3.23) ═══ */
/* Пока идёт запрос — прежние строки бледнеют и остаются на месте.
   Скелетон здесь не используется: при быстром ответе он успевает только мигнуть. */
.em-list-body{transition:opacity .15s var(--ease-out);}
.em-list-wait .em-list-body{opacity:.5; pointer-events:none;}

/* ═══ Вкладки раздела ═══ */
/* Полоса-подложка вкладок раздела (§3.14). Активная вкладка — краска системы;
   шесть цветов по разделам сняты 20.08.2026, счётчик берёт ту же краску. */
.cat-tabs{display:flex; gap:var(--em-gap-row); flex-wrap:wrap; background:var(--em-card-bg); border:1px solid var(--em-border); border-radius:var(--em-radius); padding:var(--em-tab-pad); margin-bottom:var(--em-block-gap);}
.cat-tab{display:inline-flex; align-items:center; gap:5px; height:var(--em-tab-h); padding:0 var(--em-tab-pad-x); border-radius:var(--em-radius); text-decoration:none; font-weight:600; font-size:var(--em-tab-font); color:var(--em-text-2); background:var(--em-card-bg); border:1px solid var(--em-border-subtle); transition:background .15s var(--ease-out), color .15s var(--ease-out);}
.cat-tab:hover{background:var(--em-subtle);}
.cat-tab-active{background:var(--em-primary); color:#fff; border-color:transparent;}
.cat-tab-active:hover{background:var(--em-primary);}
.cat-tab-badge{display:inline-flex; align-items:center; justify-content:center; min-width:var(--em-tab-badge-h); height:var(--em-tab-badge-h); padding:0 5px; border-radius:999px; background:var(--em-danger); color:#fff; font-size:.62rem; font-weight:800;}
.cat-tab-active .cat-tab-badge{background:#fff; color:var(--em-primary);}

/* ═══ Каталог: список товаров ═══ */
.cat-thumb{width:44px; height:44px; border-radius:var(--em-radius); object-fit:cover; background:var(--em-subtle);}
.cat-thumb-ph{width:44px; height:44px; border-radius:var(--em-radius); background:var(--em-subtle); display:flex; align-items:center; justify-content:center; color:var(--em-placeholder);}
.cat-sn{display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:999px; font-size:.66rem; font-weight:700; background:var(--em-info-bg); color:var(--em-info-text); margin-inline-start:var(--em-gap-row);}
.cat-catname{color:var(--em-text-2);}
.cat-catname-none{color:var(--em-placeholder);}

/* ═══ Каталог: форма товара — галерея и файлы ═══ */
.pf-gal{display:flex; flex-wrap:wrap; gap:var(--em-gap-row);}
.pf-gal-item{position:relative; width:104px;}
.pf-gal-item img{width:104px; height:104px; object-fit:cover; border-radius:var(--em-radius); border:1px solid var(--em-border); background:var(--em-subtle); cursor:grab;}
.pf-gal-item.dragging{opacity:.4;}
.pf-gal-cover{position:absolute; inset-block-start:4px; inset-inline-start:4px; background:var(--em-primary); color:#fff; font-size:.62rem; font-weight:700; padding:2px 7px; border-radius:999px;}
.pf-gal-del{position:absolute; inset-block-start:4px; inset-inline-end:4px; width:24px; height:24px; border-radius:50%; border:none; background:var(--em-danger); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:.7rem;}
.pf-gal-empty{color:var(--em-placeholder); font-size:.85rem;}
.pf-files{display:flex; flex-direction:column; gap:var(--em-gap-row);}
.pf-file{display:flex; align-items:center; gap:var(--em-gap-row); padding:8px 10px; border:1px solid var(--em-border); border-radius:var(--em-radius);}
.pf-file i.pf-file-ic{color:var(--em-primary);}
.pf-file .pf-file-name{flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.pf-file-del{width:26px; height:26px; border-radius:50%; border:none; background:var(--em-danger-bg); color:var(--em-danger-text); cursor:pointer;}
.pf-uploader{margin-top:var(--em-gap-row-lg);}

/* ═══ Страница товара: плитки и сведения ═══ */
.st-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:var(--em-gap-row); margin-bottom:var(--em-block-gap);}
.st-tile{background:var(--em-card-bg); border:1px solid var(--em-border-subtle); border-radius:var(--em-radius); padding:12px 14px;}
.st-tile-label{font-size:.72rem; font-weight:700; color:var(--em-text-3);}
.st-tile-val{font-size:1.25rem; font-weight:800; color:var(--em-text); margin-top:2px; direction:ltr; text-align:right;}
.st-tile-sub{font-size:.72rem; color:var(--em-text-3); direction:ltr; text-align:right;}
a.st-tile{display:block; text-decoration:none; color:inherit; transition:border-color .15s var(--ease-out), transform .15s var(--ease-out);}
a.st-tile:hover{border-color:var(--em-primary); transform:translateY(-1px);}
.pv-head{display:flex; gap:var(--em-gap-row-lg); align-items:flex-start; flex-wrap:wrap;}
.pv-cover{width:120px; height:120px; border-radius:var(--em-radius); object-fit:cover; background:var(--em-subtle);}
.pv-cover-ph{width:120px; height:120px; border-radius:var(--em-radius); background:var(--em-subtle); display:flex; align-items:center; justify-content:center; color:var(--em-placeholder); font-size:1.6rem;}
.pv-meta{flex:1; min-width:220px; display:grid; grid-template-columns:auto 1fr; gap:var(--em-gap-row) 14px; align-items:baseline;}
.pv-meta dt{font-size:.78rem; font-weight:700; color:var(--em-text-3);}
.pv-meta dd{font-size:.9rem; color:var(--em-text); margin:0;}
.pv-desc{margin-top:12px; white-space:pre-line; color:var(--em-text-2); font-size:.9rem;}

/* ═══ Журнал движений ═══ */
.mv-change-pos{color:var(--em-success); font-weight:700; direction:ltr;}
.mv-change-neg{color:var(--em-danger); font-weight:700; direction:ltr;}
.mv-prod{font-weight:700;}

/* ═══ Приёмка: серийные номера ═══ */
.rc-serials{margin-top:var(--em-gap-row); display:flex; flex-direction:column; gap:var(--em-gap-row);}
.rc-serial-row{display:flex; align-items:center; gap:var(--em-gap-row);}
.rc-serial-row .rc-idx{width:28px; text-align:center; font-weight:700; color:var(--em-text-3);}

/* ═══ Приёмка: אצוות ותאריכי תפוגה (ТЗ 25.2) ═══ */
.rc-batches{margin-top:var(--em-gap-row); display:flex; flex-direction:column; gap:var(--em-gap-row);}
.rc-batch-row{display:grid; grid-template-columns:2fr 2fr 1fr auto; gap:var(--em-gap-row); align-items:center;}

/* ═══ Подпись клиента (ТЗ 27.4) ═══ */
.em-signpage{max-width:760px; margin:0 auto; padding:var(--em-page-pad); text-align:center;}
.em-signpage .card{text-align:start;}
.em-sign-box{border:1px dashed var(--em-border-input); border-radius:var(--em-radius); padding:var(--em-card-pad); margin-top:var(--em-block-gap);}
.em-sign-label{font-size:.78rem; font-weight:700; color:var(--em-text-3); margin-bottom:var(--em-gap-row);}
.em-sign-pad{width:100%; height:200px; background:var(--em-card-bg); border:1px solid var(--em-border-input); border-radius:var(--em-radius); touch-action:none; cursor:crosshair;}
.em-sign-image{max-width:280px; margin-top:var(--em-block-gap); border:1px solid var(--em-border); border-radius:var(--em-radius);}

/* ═══ Выбор единиц (ניפוק · תיקון מלאי) ═══ */
.sn-pick-bar{display:flex; align-items:center; gap:var(--em-gap-row); flex-wrap:wrap; margin:var(--em-block-gap) 0;}
.sn-pick-count{font-size:.8rem; font-weight:700; color:var(--em-text-3);}
.sn-pick{display:grid; grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:var(--em-gap-row);}
.sn-pick-row{display:flex; align-items:center; gap:var(--em-gap-row); padding:8px 10px; border:1px solid var(--em-border); border-radius:var(--em-radius); background:var(--em-card-bg); cursor:pointer; transition:background .15s var(--ease-out), border-color .15s var(--ease-out);}
.sn-pick-row:hover{background:var(--em-subtle);}
.sn-pick-row input{width:18px; height:18px; accent-color:var(--em-primary); flex-shrink:0;}
.sn-pick-row:has(input:checked){border-color:var(--em-primary); background:var(--em-primary-pastel);}
.sn-pick-serial{font-weight:600; direction:ltr; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}

/* ═══ Корректировка: разница ═══ */
.adj-diff{font-size:1.25rem; font-weight:800; color:var(--em-text-3); direction:ltr; text-align:right; padding:7px 0;}
.adj-diff-pos{color:var(--em-success);}
.adj-diff-neg{color:var(--em-danger);}

/* ═══ Вкладка «להזמין» ═══ */
.rq-lack{font-weight:800; color:var(--em-danger); direction:ltr; text-align:right;}

/* ═══ Строка-форма добавления (общая: категории, מחירים מיוחדים …) ═══ */
.inline-add{display:flex; gap:var(--em-gap-row); align-items:end; flex-wrap:wrap;}
.inline-add .form-group{flex:1; min-width:220px; margin:0;}

/* ═══ Категории ═══ */
.ct-name{font-weight:600;}
.ct-rename{display:flex; gap:var(--em-gap-row); align-items:center; flex-wrap:wrap;}
.ct-rename input{max-width:260px;}
.ct-count{color:var(--em-text-3); font-size:.85rem;}
.ct-hidden{display:none;}

/* ═══ Клиенты ═══ */
.cl-rows{display:flex; flex-direction:column; gap:var(--em-gap-row);}
.cl-row{display:flex; flex-wrap:wrap; gap:var(--em-gap-row); align-items:flex-end; padding:10px; border:1px solid var(--em-border); border-radius:var(--em-radius); background:var(--em-card-bg);}
.cl-row .form-group{flex:1; min-width:150px; margin:0;}
.cl-row-primary{display:inline-flex; align-items:center; gap:var(--em-gap-row); white-space:nowrap; font-size:.8rem; font-weight:700; color:var(--em-text-2); padding-bottom:9px;}
.cl-row-primary input{width:16px; height:16px; accent-color:var(--em-primary);}
.cl-row-del{width:32px; height:32px; margin-bottom:2px; border-radius:50%; border:none; background:var(--em-danger-bg); color:var(--em-danger-text); cursor:pointer;}
.cl-rows-empty{color:var(--em-placeholder); font-size:.85rem;}
.cl-dup-list{margin:var(--em-block-gap) 0 12px; padding-inline-start:18px; display:flex; flex-direction:column; gap:4px;}
.cl-dup-list a{color:var(--em-primary); font-weight:700;}
.cl-link{display:flex; gap:var(--em-gap-row); align-items:center; flex-wrap:wrap;}
.cl-link .form-control{flex:1; min-width:240px;}
.cl-match{display:block; font-size:.72rem; color:var(--em-text-3);}
.cl-match a{color:var(--em-primary); font-weight:700;}
.cl-hp{position:absolute; inset-inline-start:-9999px; width:1px; height:1px; overflow:hidden;}
.login-card.cl-reg-card{max-width:460px;}
.cl-reg-done{display:flex; gap:var(--em-gap-row-lg); align-items:center; color:var(--em-text-2); font-size:.95rem;}
.cl-reg-done-ic{flex-shrink:0; width:44px; height:44px; border-radius:50%; background:var(--em-success-bg); color:var(--em-success-text); display:flex; align-items:center; justify-content:center; font-size:1.2rem;}

/* ═══ Документы ═══ */
.dl-search{display:flex; gap:var(--em-gap-row); align-items:end; flex-wrap:wrap; position:relative; margin-bottom:14px;}
.dl-search .form-group{flex:1; min-width:240px; margin:0; position:relative;}
.dl-results{position:absolute; z-index:60; inset-inline:0; top:100%; margin-top:4px; max-height:280px; overflow:auto; background:var(--em-card-bg); border:1px solid var(--em-border); border-radius:var(--em-radius); box-shadow:0 12px 32px rgba(8,10,37,.16);}
.dl-result{display:flex; flex-direction:column; gap:2px; width:100%; padding:8px 12px; border:none; background:transparent; text-align:start; cursor:pointer; border-bottom:1px solid var(--em-border-subtle);}
.dl-result:last-child{border-bottom:none;}
.dl-result:hover{background:var(--em-primary-pastel);}
.dl-result-name{font-weight:700; color:var(--em-text);}
.dl-result-meta{font-size:.74rem; color:var(--em-text-3); direction:ltr; text-align:start;}
/* 🔴 Экран документа — две зоны (решение владельца 25.08.2026): узкая колонка
   реквизитов сбоку, вся остальная ширина — строкам и счёту. Реквизиты заполняют
   один раз, со строками работают весь сеанс, и строкам нужно место под три
   величины себестоимости. До 1279px колонки не помещаются рядом — идут одна под другой. */
.doc-form{display:grid; grid-template-columns:var(--em-doc-side-w) minmax(0, 1fr); gap:var(--em-block-gap); align-items:start;}
@media (max-width:1279px){
    .doc-form{grid-template-columns:minmax(0, 1fr);}
}
.dl-head, .dl-row{display:grid; grid-template-columns:minmax(160px,2.5fr) 70px 110px 120px 110px 90px 90px 70px 44px; gap:var(--em-gap-row); align-items:center;}
/* 🔴 Шапка стоит на тех же отступах, что строка: у строки есть поле и рамка,
   и без них подписи колонок разъезжались с содержимым. Прозрачная рамка держит
   геометрию точно, а гибкая колонка названия иначе съедала бы разницу. */
.dl-head{padding:0 var(--em-block-gap) var(--em-gap-row); border:1px solid transparent; font-size:.72rem; font-weight:700; color:var(--em-text-3);}
.dl-rows{display:flex; flex-direction:column; gap:var(--em-gap-row);}
.dl-row{padding:var(--em-block-gap); border:1px solid var(--em-border); border-radius:var(--em-radius); background:var(--em-card-bg);}
.dl-cell{min-width:0;}
/* 🔴 Узкие колонки идут по одной оси (решение владельца 25.08.2026): подпись,
   поле ввода и вычисленное число выравниваются по центру клетки. Причина числом:
   у поля ввода своё внутреннее поле 12 точек, у подписи и у готового текста его
   нет — при выравнивании по краю подпись и значение расходились на эти 12 точек,
   и колонка переставала читаться сверху вниз. Первая колонка — описание строки,
   она текстовая и остаётся у начала строки. */
.dl-head > span, .dl-row .dl-cell{text-align:center;}
.dl-head > span:first-child, .dl-row .dl-cell-name{text-align:start;}
.dl-row .dl-cell .form-control{text-align:center;}
.dl-row .dl-cell-name .form-control{text-align:start;}
.dl-cell-name{display:flex; flex-direction:column; gap:5px;}
.dl-desc{font-size:.8rem;}
/* Цифры моноширинные: разряд встаёт под разрядом и суммы сверяются взглядом */
.dl-cell-total{font-weight:800; direction:ltr; font-variant-numeric:tabular-nums;}
/* Себестоимость, заработок и наценка — только для глаз владельца: в документ,
   в PDF и на публичную страницу эти величины не уходят. Пусто там, где
   себестоимость неизвестна: ноль показал бы прибыль, которой нет. */
.dl-cell-cost{font-size:.82rem; font-weight:700; color:var(--em-text-2); direction:ltr; font-variant-numeric:tabular-nums;}
.dl-loss{color:var(--em-danger-text);}
/* 🔴 Скидка строки задаётся процентом или шекелями (решение владельца 25.08.2026):
   знак стоит вплотную к полю и переключается кликом. Знак залит краской, потому
   что показывает действующее состояние, а не предлагает действие. */
.dl-disc{display:flex; align-items:stretch;}
.dl-disc > .form-control{flex:1 1 0; min-width:0; border-start-end-radius:0; border-end-end-radius:0;}
.dl-disc-toggle{flex:0 0 auto; width:30px; height:var(--em-control-h); border:1px solid var(--em-primary); border-inline-start:none;
    border-start-start-radius:0; border-end-start-radius:0; border-start-end-radius:var(--em-radius); border-end-end-radius:var(--em-radius);
    background:var(--em-primary); color:#fff; font-size:.9rem; font-weight:800; cursor:pointer;}
.dl-del{width:32px; height:32px; border-radius:50%; border:none; background:var(--em-danger-bg); color:var(--em-danger-text); cursor:pointer;}
.dl-empty{color:var(--em-placeholder); font-size:.85rem; padding-top:6px;}
/* Счёт справа столбцом, плитка скидки — слева от него */
.dl-sum{display:flex; gap:var(--em-gap-row-lg); justify-content:space-between; flex-wrap:wrap; align-items:flex-start;}
.dl-totals{display:grid; grid-template-columns:auto auto; gap:var(--em-gap-row) 0; align-items:baseline; margin-inline-start:auto; min-width:260px;}
.dl-totals dt{font-size:.82rem; color:var(--em-text-3); font-weight:600; padding-inline-end:var(--em-card-pad);}
/* Разряд под разрядом: суммы счёта сверяются взглядом */
.dl-totals dd{margin:0; font-weight:700; direction:ltr; text-align:end; font-variant-numeric:tabular-nums;}
/* 🔴 «Итого к оплате» — своя плитка в краске системы (решение владельца 25.08.2026):
   остальные строки счёта остаются обычным текстом без подложки */
.dl-totals .dl-total-main{font-size:1.1rem; font-weight:800; color:#fff; background:var(--em-primary); padding-block:var(--em-gap-row);}
.dl-totals dt.dl-total-main{padding-inline-start:var(--em-card-pad); border-start-start-radius:var(--em-radius); border-end-start-radius:var(--em-radius);}
.dl-totals dd.dl-total-main{padding-inline-end:var(--em-card-pad); border-start-end-radius:var(--em-radius); border-end-end-radius:var(--em-radius);}
.dl-totals-view{margin-top:14px;}

/* 🔴 Скидка на итог — плитка действия (решение владельца 25.08.2026).
   Скидку владелец даёт осознанно, поэтому она читается как действие, а не как
   ещё одно поле формы: подпись на краске, поле вплотную к ней, рамка вокруг всего. */
.em-disc-tile{border:1px solid var(--em-border-input); border-radius:var(--em-radius); overflow:hidden; min-width:260px;}
.em-disc-tile-head{background:var(--em-primary); padding:var(--em-gap-row) var(--em-card-pad);}
.em-disc-tile-head label{display:block; margin:0; color:#fff; font-size:.82rem; font-weight:700;}
.em-disc-tile-body{display:flex; align-items:stretch; gap:var(--em-gap-row); padding:var(--em-gap-row-lg) var(--em-card-pad);}
.em-disc-input{height:auto; min-height:calc(var(--em-control-h) * 1.5); font-size:1.4rem; font-weight:800; text-align:center; flex:1 1 0;}
.em-disc-switch{display:flex; flex-direction:column;}
.em-disc-opt{flex:1; min-width:38px; border:1px solid var(--em-border-input); border-radius:var(--em-radius); background:var(--em-card-bg); color:var(--em-text-2); font-size:.88rem; font-weight:800; cursor:pointer;}
.em-disc-opt.is-on{background:var(--em-primary); border-color:var(--em-primary); color:#fff;}

/* ═══ Документы: выпуск и цепочка ═══ */
.iss-facts{list-style:none; display:flex; flex-direction:column; gap:var(--em-gap-row);}
.iss-facts li{display:flex; gap:var(--em-gap-row); align-items:flex-start; color:var(--em-text-2); font-size:.9rem;}
.iss-facts i{color:var(--em-primary); width:18px; text-align:center; margin-top:2px;}
.iss-problems{margin:var(--em-block-gap) 0 12px; padding-inline-start:18px; display:flex; flex-direction:column; gap:4px;}
.iss-serial-block{padding:10px; border:1px solid var(--em-border); border-radius:var(--em-radius); margin-bottom:var(--em-gap-row-lg);}
.iss-serial-head{display:flex; gap:var(--em-gap-row); align-items:baseline; justify-content:space-between; flex-wrap:wrap; margin-bottom:var(--em-block-gap);}
.doc-chain{display:flex; gap:var(--em-gap-row); align-items:center; flex-wrap:wrap; margin-bottom:14px;}
.doc-chain-item{display:flex; flex-direction:column; gap:2px; padding:8px 14px; border-radius:var(--em-radius); border:1px solid var(--em-border); background:var(--em-card-bg); text-decoration:none; color:var(--em-text);}
.doc-chain-item:hover{background:var(--em-subtle);}
.doc-chain-current{border-color:var(--em-primary); background:var(--em-primary-pastel);}
.doc-chain-type{font-weight:700; font-size:.86rem;}
.doc-chain-arrow{color:var(--em-faint);}

/* ═══ Документы: аמצעי תשלום ═══ */
.pm-rows{display:flex; flex-direction:column; gap:var(--em-gap-row); margin-bottom:12px;}
.pm-row{display:flex; flex-wrap:wrap; gap:var(--em-gap-row); align-items:flex-end; padding:10px; border:1px solid var(--em-border); border-radius:var(--em-radius); background:var(--em-card-bg);}
.pm-row .form-group{flex:1; min-width:150px; margin:0;}
.pm-del{width:32px; height:32px; margin-bottom:2px; border-radius:50%; border:none; background:var(--em-danger-bg); color:var(--em-danger-text); cursor:pointer;}

/* ═══ תעודת זיכוי: строки возврата ═══ */
.cn-head, .cn-row{display:grid; grid-template-columns:minmax(200px,3fr) 80px 110px 110px 110px; gap:var(--em-gap-row); align-items:center;}
.cn-head{padding:0 4px 6px; font-size:.72rem; font-weight:700; color:var(--em-text-3);}
.cn-row{padding:8px; border:1px solid var(--em-border); border-radius:var(--em-radius); margin-bottom:var(--em-block-gap);}

/* ═══ Закупки: строки заказа ═══ */
.po-head, .po-row{display:grid; grid-template-columns:minmax(200px,3fr) 80px 90px 120px 110px 44px; gap:var(--em-gap-row); align-items:center;}
.po-head{padding:0 4px 6px; font-size:.72rem; font-weight:700; color:var(--em-text-3);}
.po-row{padding:8px; border:1px solid var(--em-border); border-radius:var(--em-radius); background:var(--em-card-bg); margin-bottom:var(--em-block-gap);}
.po-cell{min-width:0;}
.po-cell-name{display:flex; flex-direction:column; gap:2px;}
.po-cell-total{font-weight:800; direction:ltr; text-align:start;}

/* ═══ Закупки: приёмка ═══ */
.pr-head, .pr-row{display:grid; grid-template-columns:minmax(180px,3fr) 70px 70px 110px 110px 110px 100px; gap:var(--em-gap-row); align-items:center;}
.pr-head{padding:0 4px 6px; font-size:.72rem; font-weight:700; color:var(--em-text-3);}
.pr-row{padding:8px; border:1px solid var(--em-border); border-radius:var(--em-radius); background:var(--em-card-bg); margin-bottom:var(--em-block-gap);}
.pr-cell-name{display:flex; flex-direction:column; gap:2px;}
.pr-cost{font-weight:800;}
.pr-serials{grid-column:1 / -1; padding-top:8px; border-top:1px solid var(--em-border-subtle);}
.pr-serial-list{display:grid; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr)); gap:var(--em-gap-row); margin-top:var(--em-gap-row);}
.pr-receipt{padding:10px; border:1px solid var(--em-border); border-radius:var(--em-radius); margin-bottom:12px;}
.pr-receipt-head{display:flex; gap:var(--em-gap-row); align-items:baseline; justify-content:space-between; flex-wrap:wrap; margin-bottom:var(--em-block-gap);}

/* ═══ Расчёт себестоимости поставки: строки товаров ═══ */
.ic-head, .ic-row{display:grid; grid-template-columns:minmax(180px,3fr) 70px 100px 110px 110px 110px 90px 44px; gap:var(--em-gap-row); align-items:center;}
.ic-head{padding:0 4px var(--em-gap-row); font-size:.72rem; font-weight:700; color:var(--em-text-3);}
.ic-rows{display:flex; flex-direction:column; gap:var(--em-gap-row);}
.ic-row{padding:var(--em-block-gap); border:1px solid var(--em-border); border-radius:var(--em-radius); background:var(--em-card-bg);}
.ic-cell{min-width:0;}
.ic-cell-name{display:flex; flex-direction:column; gap:2px;}
.ic-out{display:flex; align-items:center; font-weight:800;}
.ic-real{display:flex; align-items:center;}
.ic-loss{color:var(--em-danger-text); font-weight:800;}

/* ═══ Строка действия (.em-act-row): пояснение и кнопка в одной строке ═══ */
/* Пояснение под кнопкой читается как подпись к пустому месту и растягивает карточку.
   Один класс на всю систему: текст занимает остаток строки, кнопка стоит у её конца. */
.em-act-row{display:flex; align-items:center; gap:var(--em-gap-row-lg); flex-wrap:wrap;}
.em-act-row > .card-note, .em-act-row > .f-hint{margin:0; flex:1 1 240px; min-width:0;}
.em-act-row form{margin:0;}
.em-act-row .abtn, .em-act-row .btn-row{flex:0 0 auto;}

/* ═══ Поле и кнопка в одной строке (.em-field-row) ═══ */
/* Кнопка, относящаяся к полю, стоит рядом с ним, а не в подписи под ним. */
.em-field-row{display:flex; align-items:center; gap:var(--em-gap-row); flex-wrap:wrap;}
.em-field-row > .form-control{flex:1 1 140px; min-width:0; width:auto;}
.em-field-row > .abtn{flex:0 0 auto;}

/* ═══ Ряды обслуживания (.em-maint-row) — карточка «ניקוי ותחזוקה» ═══ */
.em-maint-row{
    display:flex; align-items:center; gap:var(--em-gap-row-lg);
    padding:14px 0; border-top:1px solid var(--em-border-subtle);
}
.em-maint-row:first-of-type{border-top:0; padding-top:4px;}
.em-maint-icon{
    width:40px; height:40px; border-radius:var(--em-radius); flex-shrink:0;
    display:flex; align-items:center; justify-content:center; font-size:1rem;
}
.em-maint-icon-green{background:var(--em-success-bg); color:var(--em-success);}
.em-maint-icon-red{background:var(--em-danger-bg); color:var(--em-danger);}
.em-maint-info{flex:1 1 auto; min-width:0;}
.em-maint-title{font-weight:800; font-size:.86rem; color:var(--em-text);}
.em-maint-sub{font-size:.78rem; color:var(--em-text-3); margin-top:1px;}
.em-maint-row .abtn{flex-shrink:0;}
@media (max-width:768px){
    .rc-batch-row{grid-template-columns:1fr;}

    .em-maint-row{flex-wrap:wrap;}
    .em-maint-row .abtn{width:100%; justify-content:center; min-height:44px;}
}

/* ═══ Строки проверки системы (.em-check-row) — экран обновления ═══ */
.em-check-list{display:flex; flex-direction:column; gap:var(--em-gap-row); margin-top:12px;}
.em-check-row{
    display:flex; align-items:center; gap:var(--em-gap-row-lg);
    border:1px solid; border-radius:var(--em-radius); padding:10px 14px;
}
.em-check-ok{background:var(--em-success-bg); border-color:var(--em-success-border);}
.em-check-fail{background:var(--em-danger-bg); border-color:var(--em-danger-border);}
.em-check-row i{font-size:1rem; flex-shrink:0;}
.em-check-ok i{color:var(--em-success);}
.em-check-fail i{color:var(--em-danger);}
.em-check-title{font-weight:800; font-size:.86rem; color:var(--em-text);}
.em-check-sub{font-size:.78rem; color:var(--em-text-3);}

/* ═══ Зона перетаскивания файла (.em-dropzone) — экран обновления ═══ */
.em-dropzone{
    border:2px dashed var(--em-border-input); border-radius:var(--em-radius);
    padding:28px 16px; text-align:center; cursor:pointer;
    transition:border-color .2s var(--ease-out), background-color .2s var(--ease-out);
}
.em-dropzone:hover, .em-dropzone.em-drag{border-color:var(--em-primary-soft); background:var(--em-primary-pastel);}
.em-dropzone-icon{
    width:56px; height:56px; margin:0 auto var(--em-gap-row-lg); border-radius:var(--em-radius);
    background:var(--em-primary-pastel); color:var(--em-primary-soft);
    display:flex; align-items:center; justify-content:center; font-size:1.5rem;
}
.em-dropzone.em-drag .em-dropzone-icon, .em-dropzone:hover .em-dropzone-icon{background:#fff;}
.em-dropzone-title{font-weight:800; font-size:.95rem; color:var(--em-text);}
.em-dropzone-sub{font-size:.78rem; color:var(--em-text-3); margin-top:2px;}
.em-dropzone-file{margin-top:var(--em-block-gap); font-size:.82rem; font-weight:700; color:var(--em-success); display:none; line-height:1.5; overflow-wrap:anywhere;}
.em-dropzone.em-has-file .em-dropzone-file{display:block;}

/* ═══ Две колонки карточек (общий класс: дашборд, обновление системы) ═══ */
.em-cols{display:grid; grid-template-columns:1fr 1fr; gap:var(--em-block-gap); align-items:stretch;}
.em-cols > .card{margin-bottom:0;}
.em-col{display:flex; flex-direction:column; gap:var(--em-block-gap); min-width:0;}
.em-col > .card{margin-bottom:0;}
@media (max-width:991px){
    .em-cols{grid-template-columns:1fr;}
    .stats-row{grid-template-columns:1fr 1fr;}
    .widget-chart{padding:14px 18px;}
    .wc-value{font-size:1.6rem;}
    .icon-bg{font-size:2.5rem;}
}
@media (max-width:480px){
    .stats-row{grid-template-columns:1fr;}
    .wc-value{font-size:1.5rem;}
    .wc-label{font-size:.72rem;}
}

/* ═══ Отчёты ═══ */
.rp-total td{font-weight:800; background:var(--em-primary-pastel); color:var(--em-primary-pastel-text); border-top:2px solid var(--em-border); border-bottom:none;}

/* ═══ Настройки: дизайн ═══ */
.dz-num{width:74px; display:inline-block;}
.dz-items{list-style:none; display:flex; flex-direction:column; gap:var(--em-gap-row);}
.dz-items li{display:flex; align-items:center; gap:var(--em-gap-row);}
/* Поле кода не тянется на всю строку: правило .em-field-row > .form-control сильнее
   имени класса, поэтому ширина задаётся селектором с большим весом */
.em-field-row > .form-control.dz-hex{flex:0 0 auto; width:140px; text-transform:uppercase;}
.dz-sample{width:var(--em-control-h); height:var(--em-control-h); flex:0 0 auto;
    border:1px solid var(--em-border-input); border-radius:var(--em-radius);
    background:var(--em-picked, var(--em-primary));}
.dz-presets{display:flex; flex-wrap:wrap; gap:var(--em-gap-row);}
.dz-preset{width:var(--em-control-h); height:var(--em-control-h); padding:0; cursor:pointer;
    border:1px solid var(--em-border-input); border-radius:var(--em-radius);
    background:var(--em-picked, var(--em-subtle));}
.dz-preset.is-on{border-color:var(--em-primary-soft); box-shadow:var(--em-ring-focus);}
.dz-swatches{display:flex; flex-wrap:wrap; gap:var(--em-gap-row-lg); margin-top:12px;}
.dz-swatch{display:flex; align-items:center; gap:var(--em-gap-row); font-size:.8rem; color:var(--em-text-3);}
.dz-chip{width:22px; height:22px; border-radius:var(--em-radius); border:1px solid var(--em-border);}
.dz-chip-primary{background:var(--em-primary);}
.dz-chip-hover{background:var(--em-primary-hover);}
.dz-chip-soft{background:var(--em-primary-soft);}
.dz-chip-pastel{background:var(--em-primary-pastel);}

/* ═══ Полоса «в системе демо-данные» ═══ */
.demo-bar{display:flex; align-items:center; gap:var(--em-gap-row); flex-wrap:wrap; margin-bottom:var(--em-block-gap);
    padding:9px 14px; border-radius:var(--em-radius); font-size:.84rem; font-weight:600;
    color:var(--em-warn-text); background:var(--em-warn-bg); border:1px solid var(--em-warn-border);}
.demo-bar a{color:inherit; font-weight:800;}

/* ═══ Лиды ═══ */
.ld-msg{max-width:320px; white-space:pre-line; color:var(--em-text-2); font-size:.84rem;}

/* ═══ Глобальный поиск: подсказки ═══ */
.hd-sug{position:absolute; top:calc(100% + 8px); inset-inline-start:0; width:360px; max-width:86vw; max-height:60vh; overflow:auto; background:var(--em-card-bg); border:1px solid var(--em-border); border-radius:var(--em-radius); box-shadow:0 12px 32px rgba(8,10,37,.18); z-index:120;}
.hd-sug-group{display:flex; align-items:center; gap:var(--em-gap-row); padding:7px 12px; font-size:.7rem; font-weight:800; color:var(--em-text-3); background:var(--em-subtle);}
.hd-sug-item{display:block; padding:9px 12px; text-decoration:none; color:var(--em-text); border-bottom:1px solid var(--em-border-subtle);}
.hd-sug-item:last-child{border-bottom:none;}
.hd-sug-item:hover{background:var(--em-primary-pastel);}
.hd-sug-empty{padding:12px; text-align:center; color:var(--em-placeholder); font-size:.85rem;}

/* ═══ Колокольчик сигналов ═══ */
.hd-bell{position:relative;}
/* Общий канон выпадашек шапки: вырастание из кнопки (opacity + scale .96→1) */
.hd-menu{
    position:absolute; top:calc(100% + 14px); left:0; min-width:230px;
    background:var(--em-card-bg); border:1px solid var(--em-border); border-radius:var(--em-radius);
    box-shadow:var(--em-shadow-drop); z-index:120; overflow:hidden;
    visibility:hidden; opacity:0; transform:translateY(-4px) scale(.96); transform-origin:top;
    transition:opacity .15s var(--ease-out), transform .15s var(--ease-out), visibility .15s var(--ease-out);
}
.hd-menu.open{visibility:visible; opacity:1; transform:translateY(0) scale(1);}
.em-nb-item{display:flex; align-items:center; gap:var(--em-gap-row); padding:11px 14px; border-bottom:1px solid var(--em-border-subtle); text-decoration:none; color:inherit; cursor:pointer; transition:background .12s;}
.em-nb-item:last-child{border-bottom:none;}
.em-nb-item:hover{background:var(--em-surface-2);}
.em-nb-item-icon{width:38px; height:38px; border-radius:var(--em-radius); display:flex; align-items:center; justify-content:center; font-size:15px; flex-shrink:0;}
.em-nb-high .em-nb-item-icon{background:var(--em-danger-bg); color:var(--em-danger-deep);}
.em-nb-medium .em-nb-item-icon{background:var(--em-warn-bg); color:var(--em-warn-text);}
.em-nb-info .em-nb-item-icon{background:#e0f2fe; color:#075985;}
.em-nb-item-info{flex:1; min-width:0;}
.em-nb-item-info strong{display:block; font-size:.86rem; color:var(--em-text); font-weight:700; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.em-nb-item-info span{display:block; font-size:.75rem; color:var(--em-text-3); line-height:1.3; margin-top:2px;}
.em-nb-item-count{background:var(--em-grad-muted); color:#fff; font-size:.72rem; font-weight:800; padding:3px 9px; border-radius:10px; min-width:22px; text-align:center; direction:ltr; flex-shrink:0;}
.em-nb-high .em-nb-item-count{background:var(--em-grad-danger-btn);}
.em-nb-medium .em-nb-item-count{background:var(--em-grad-amber);}
.em-nb-info .em-nb-item-count{background:var(--em-grad-sky);}
.em-nb-head{padding:1rem; background:var(--em-grad-primary); color:#fff; position:relative; overflow:hidden; display:flex; align-items:center; gap:var(--em-gap-row); font-weight:700;}
.em-nb-head::before{content:''; position:absolute; inset:0; background:var(--em-glare); pointer-events:none;}
.em-nb-head > *{position:relative;}
.hd-bell-empty{padding:12px; color:var(--em-placeholder); font-size:.85rem; text-align:center;}

/* ═══ Меню пользователя (аватар в шапке) ═══ */
.hd-user{position:relative;}
.user-menu{min-width:300px;}
.dropdown-menu-header{padding:1.25rem 1rem; background:var(--em-grad-primary); color:#fff; position:relative; overflow:hidden;}
.dropdown-menu-header::before{content:''; position:absolute; inset:0; background:var(--em-glare); pointer-events:none;}
.menu-header-content{position:relative; display:flex; align-items:center; gap:var(--em-gap-row-lg);}
.menu-header-content .big-avatar{width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.25); border:2px solid rgba(255,255,255,.5); display:flex; align-items:center; justify-content:center; font-weight:700; font-size:18px; color:#fff; flex-shrink:0;}
.menu-header-content .user-name{font-size:1rem; font-weight:700; line-height:1.2;}
.menu-header-content .user-role{font-size:.75rem; opacity:.9; margin-top:2px;}
.dropdown-list{list-style:none; margin:0; padding:.5rem 0;}
.dropdown-list .dropdown-form{margin:0;}
.dropdown-list .dropdown-form button{display:flex; align-items:center; gap:var(--em-gap-row); width:100%; padding:.65rem 1.25rem; font-family:'Assistant',sans-serif; font-size:.85rem; font-weight:600; color:var(--em-text-body); background:transparent; border:none; text-align:right; cursor:pointer; transition:background .15s, color .15s;}
.dropdown-list .dropdown-form button:hover{background:#f0f4ff; color:var(--em-primary-hover);}
.dropdown-list .dropdown-form button i{width:18px; text-align:center; color:#6c757d; font-size:14px; transition:color .15s;}
.dropdown-list .dropdown-form button:hover i{color:var(--em-primary-hover);}
.dropdown-list .logout-btn, .dropdown-list .logout-btn i{color:var(--em-danger);}
.dropdown-list .logout-btn:hover{background:#fef2f2; color:var(--em-danger-deep);}
.dropdown-list .logout-btn:hover i{color:var(--em-danger-deep);}
#hdBellMenu{width:380px; max-width:calc(100vw - 20px);}

/* ═══ Кнопка-ссылка в неактивном состоянии ═══ */
.is-disabled{pointer-events:none; opacity:.5;}

/* ═══ Настройки ═══ */
.set-logo{display:flex; gap:var(--em-gap-row-lg); align-items:center; flex-wrap:wrap; margin-bottom:14px;}
.set-logo-img{max-width:220px; max-height:90px; object-fit:contain; padding:8px; border:1px solid var(--em-border); border-radius:var(--em-radius); background:#fff;}
.set-logo-remove{display:inline-flex; align-items:center; gap:var(--em-gap-row); font-size:.85rem; color:var(--em-text-2);}
.set-logo-remove input{width:16px; height:16px; accent-color:var(--em-primary);}
.set-series-head, .set-series-row{display:grid; grid-template-columns:minmax(140px,2fr) 120px 140px minmax(120px,1fr); gap:var(--em-gap-row); align-items:center;}
.set-series-head{padding:0 4px 6px; font-size:.72rem; font-weight:700; color:var(--em-text-3);}
.set-series-row{padding:8px; border:1px solid var(--em-border); border-radius:var(--em-radius); margin-bottom:var(--em-block-gap);}

/* ═══ Экран обновления: версия + оверлей установки ═══ */
.sys-ver{display:flex; align-items:center; gap:var(--em-gap-row-lg);}
.sys-ver-icon{width:44px; height:44px; border-radius:var(--em-radius); background:var(--em-info-bg); color:var(--em-info-text); display:flex; align-items:center; justify-content:center; font-size:1.1rem;}
.sys-ver-label{font-size:.74rem; font-weight:700; color:var(--em-text-3);}
.sys-ver-val{font-size:1rem; font-weight:700; color:var(--em-text);}
.sys-ver-date{font-weight:500; color:var(--em-text-3); font-size:.85rem;}
.em-loading-overlay{position:fixed; inset:0; z-index:10060; background:rgba(15,23,42,.55); display:flex; align-items:center; justify-content:center; padding:16px;}
.em-loading-box{background:var(--em-card-bg); border-radius:var(--em-radius); box-shadow:0 25px 80px rgba(0,0,0,.35); padding:28px 34px; text-align:center; min-width:260px; animation:emToastIn .2s var(--ease-out);}
.em-spinner{width:46px; height:46px; margin:0 auto 14px; border-radius:50%; border:4px solid var(--em-subtle); border-top-color:var(--em-primary); animation:emSpin .8s linear infinite;}
.em-loading-title{font-weight:700; font-size:1.05rem; color:var(--em-text);}
.em-loading-sub{margin-top:4px; font-size:.85rem; color:var(--em-text-3);}
@keyframes emSpin{to{transform:rotate(360deg);}}

/* ═══ Вход в систему (standalone) ═══ */
.login-card{
    background:#fff; border-radius:var(--em-radius);
    box-shadow:0 10px 40px rgba(8,10,37,.25);
    width:100%; max-width:400px; padding:40px 36px;
}
.login-brand{display:flex; align-items:center; gap:var(--em-gap-row-lg); justify-content:center; margin-bottom:var(--em-block-gap);}
.login-mark{
    width:48px; height:48px; border-radius:50%;
    background:var(--em-grad-primary); color:#fff;
    display:flex; align-items:center; justify-content:center; font-size:1.3rem;
}
.login-mark-img{width:52px; height:52px; object-fit:contain; border-radius:50%; flex-shrink:0;}
.login-word{font-size:22px; font-weight:800; line-height:1.1;}
.login-tag{font-size:11px; color:var(--em-text-3); font-weight:600;}
.login-title{text-align:center; font-size:1rem; font-weight:600; color:var(--em-text-3); margin:18px 0 22px;}
.login-card .form-group{margin-bottom:16px;}
.login-card .form-group label{font-size:.85rem; margin-bottom:var(--em-gap-row);}
.input-wrap{position:relative;}
.input-wrap i{
    position:absolute; inset-inline-start:12px; top:50%; transform:translateY(-50%);
    color:var(--em-placeholder); font-size:.9rem;
}
.login-card .form-control{padding:10px 12px 10px 38px; font-size:.95rem; height:42px;}
.login-card .f-check{margin-bottom:20px; color:var(--em-text-3);}
.login-card .f-check input{width:16px; height:16px;}
.login-btn{
    width:100%; padding:11px; border:none; border-radius:var(--em-radius);
    background:var(--em-grad-action); color:#fff;
    font-family:'Assistant', sans-serif; font-size:15px; font-weight:700; cursor:pointer;
    transition:transform .15s var(--ease-out), box-shadow .2s var(--ease-out);
    box-shadow:0 2px 4px rgba(0,0,0,.1);
}
.login-btn:hover{transform:translateY(-1px); box-shadow:0 4px 8px rgba(0,0,0,.15);}
.login-btn:active{transform:translateY(-1px) scale(0.98);}
.alert-danger{display:flex; align-items:center; gap:var(--em-gap-row); background:#f8d7da; border:1px solid #f5c6cb; color:#721c24; border-radius:var(--em-radius); padding:10px 14px; font-size:.85rem; font-weight:600; margin-bottom:18px;}

/* ═══ Публичная страница документа (standalone) ═══ */
.em-pubdoc{
    background:#fff; border-radius:var(--em-radius);
    box-shadow:0 10px 40px rgba(8,10,37,.25);
    width:100%; max-width:400px; padding:40px 36px;
    display:flex; flex-direction:column; align-items:center; gap:var(--em-gap-row); text-align:center;
}
.em-pubdoc-logo{width:64px; height:64px; object-fit:contain; border-radius:50%;}
.em-pubdoc-title{font-size:1.05rem; font-weight:800; color:var(--em-text);}
.em-pubdoc-sub{font-size:.85rem; font-weight:600; color:var(--em-text-3); margin-bottom:var(--em-block-gap);}

/* ═══ Страницы ошибок (standalone-light) ═══ */
.err-card{background:#fff; border-radius:var(--em-radius); box-shadow:0 1px 3px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.04); padding:48px 40px; text-align:center; max-width:420px; width:100%;}
.err-code{font-size:3.5rem; font-weight:800; color:var(--em-primary); line-height:1; margin-bottom:12px;}
.err-title{font-size:1.2rem; font-weight:700; margin-bottom:var(--em-gap-row);}
.err-text{font-size:.9rem; color:var(--em-text-3); margin-bottom:24px; line-height:1.5;}
.err-btn{display:inline-flex; align-items:center; gap:var(--em-gap-row); padding:10px 22px; border-radius:var(--em-radius); background:var(--em-grad-action); color:#fff; text-decoration:none; font-weight:600; font-size:14px; transition:transform .15s var(--ease-out), box-shadow .2s var(--ease-out); box-shadow:0 2px 4px rgba(0,0,0,.1);}
.err-btn:hover{transform:translateY(-1px); box-shadow:0 4px 8px rgba(0,0,0,.15);}

/* ═══ Инсталлятор (standalone) ═══ */
.wiz{background:#fff; border-radius:var(--em-radius); box-shadow:0 10px 40px rgba(8,10,37,.25); width:100%; max-width:560px; overflow:hidden;}
.wiz-head{background:var(--em-grad-primary); color:#fff; padding:22px 28px; display:flex; align-items:center; gap:var(--em-gap-row-lg);}
.wiz-mark{width:44px; height:44px; border-radius:50%; background:var(--em-on-brand-veil); display:flex; align-items:center; justify-content:center; font-size:1.2rem;}
.wiz-word{font-size:19px; font-weight:800; line-height:1.1;}
.wiz-tag{font-size:11px; color:rgba(255,255,255,.8); font-weight:600;}
.wiz-steps{display:flex; border-bottom:1px solid var(--em-install-border); background:var(--em-install-bg);}
.wiz-step{flex:1; text-align:center; padding:12px 4px; font-size:.75rem; font-weight:700; color:var(--em-placeholder); position:relative;}
.wiz-step.active{color:var(--em-primary);}
.wiz-step.done{color:var(--em-success);}
.wiz-step .n{display:inline-flex; width:22px; height:22px; border-radius:50%; background:var(--em-neutral-border); color:var(--em-text-3); align-items:center; justify-content:center; font-size:.72rem; margin-inline-end:5px;}
.wiz-step.active .n{background:var(--em-primary); color:#fff;}
.wiz-step.done .n{background:var(--em-success); color:#fff;}
.wiz-body{padding:28px;}
.wiz-title{font-size:1.15rem; font-weight:700; margin-bottom:4px;}
.wiz-sub{font-size:.88rem; color:var(--em-text-3); margin-bottom:20px;}
.wiz .form-group{margin-bottom:15px;}
.wiz .form-group label{font-size:.83rem; margin-bottom:5px;}
.wiz .form-control{padding:9px 12px; font-size:.92rem; height:40px;}
.wiz .abtn{padding:10px 20px; font-size:14px; font-weight:700;}
.wiz .abtn:hover{box-shadow:0 4px 8px rgba(0,0,0,.15);}
.row2{display:flex; gap:var(--em-gap-row-lg);}
.row2 .form-group{flex:1;}
.check-row{display:flex; align-items:center; gap:var(--em-gap-row-lg); padding:11px 0; border-bottom:1px solid var(--em-border-subtle);}
.check-row:last-child{border-bottom:none;}
.check-ico{width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:.8rem; flex-shrink:0;}
.check-ok{background:var(--em-success-bg); color:var(--em-success);}
.check-bad{background:var(--em-danger-bg); color:var(--em-danger);}
.check-txt{flex:1;}
.check-label{font-weight:600; font-size:.9rem;}
.check-hint{font-size:.78rem; color:var(--em-text-3);}
.wiz-actions{margin-top:22px; display:flex; justify-content:flex-start;}
.wiz-done{text-align:center; padding:10px 0 4px;}
.wiz-done-ic{width:64px; height:64px; border-radius:50%; background:var(--em-grad-primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.7rem; margin:0 auto 16px;}
.wiz-note{background:var(--em-install-bg); border:1px solid var(--em-install-border); border-radius:var(--em-radius); padding:14px; text-align:right; font-size:.83rem; color:var(--em-text-3); margin-bottom:20px;}


/* ═══ Плитки цифр .widget-chart (канон §5.12): цветные градиентные, 85px, «один акцент в ряду» ═══ */
.stats-row{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--em-block-gap); margin-bottom:var(--em-block-gap);}
.widget-chart{
    border-radius:var(--em-radius); padding:18px 22px; color:#fff;
    position:relative; overflow:hidden; cursor:pointer; text-decoration:none;
    transition:transform .18s var(--ease-out), box-shadow .18s var(--ease-out);
    box-shadow:0 1px 3px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.04);
    height:var(--em-tile-height); min-height:var(--em-tile-height); max-height:var(--em-tile-height);
    display:flex; flex-direction:column; justify-content:center;
}
.widget-chart:hover{transform:translateY(-3px); box-shadow:0 8px 20px rgba(0,0,0,.12), 0 3px 6px rgba(0,0,0,.06); color:#fff;}
.widget-chart:active{transform:translateY(-2px) scale(0.985); transition:transform 100ms var(--ease-out);}
.wc-label{font-size:.9rem; font-weight:600; opacity:.92;}
.wc-value{font-size:2rem; font-weight:800; line-height:1.15; direction:ltr; text-align:right;}
.wc-caption, .wc-sub{font-size:.7rem; font-weight:600; opacity:.85;}
.icon-bg{position:absolute; top:50%; inset-inline-end:16px; transform:translateY(-50%); font-size:3.5rem; opacity:.15;}
/* Цвета плиток — вне фирменной семьи (§1.2, §3.3); акцентная в ряду одна и всегда бирюзовая */
.bg-em-cyan{background:var(--em-grad-cyan);}
.bg-em-green{background:var(--em-grad-green);}
.bg-em-amber{background:var(--em-grad-amber);}
.bg-em-red{background:var(--em-grad-danger-btn);}
.bg-em-fuchsia{background:var(--em-grad-fuchsia);}
.bg-em-grey{background:var(--em-grad-muted-dark);}

/* ═══ Скелетоны загрузки .em-skel (канон §5.4) ═══ */
@keyframes emSkelPulse{0%{opacity:.6;} 50%{opacity:1;} 100%{opacity:.6;}}
.em-skel{display:inline-block; border-radius:var(--em-radius); background:linear-gradient(90deg,var(--em-neutral-border) 0%,var(--em-skel-mid) 50%,var(--em-neutral-border) 100%); background-size:200% 100%; animation:emSkelPulse 1.4s var(--ease-in-out) infinite;}
.em-skel-line{height:14px; margin-bottom:var(--em-block-gap);}
.em-skel-line.short{width:40%;}
.em-skel-line.medium{width:65%;}
.em-skel-line.long{width:90%;}
.em-sug-skel{padding:12px;}
.em-sug-skel .em-skel-line:last-child{margin-bottom:0;}

/* ═══ Ховер-карточка .em-hovercard (канон §5.5): подробности при наведении, без запросов ═══ */
.em-hovercard{
    position:fixed; z-index:10040; min-width:220px; max-width:300px;
    background:var(--em-card-bg); border:1px solid var(--em-border); border-radius:var(--em-radius);
    box-shadow:0 10px 32px rgba(8,10,37,.12); padding:12px 14px;
    opacity:0; transform:translateY(4px); pointer-events:none;
    transition:opacity .15s var(--ease-out), transform .15s var(--ease-out);
}
.em-hovercard.show{opacity:1; transform:none; pointer-events:auto;}
.em-hovercard-content{display:none;}
[data-em-hovercard] .list-name{border-bottom:1px dashed var(--em-faint); cursor:default;}
.hc-name{display:block; font-weight:700; margin-bottom:var(--em-gap-row);}
.hc-row{display:flex; align-items:center; gap:var(--em-gap-row); font-size:.85rem; color:var(--em-text-2); margin-bottom:4px;}
.hc-row i{color:var(--em-primary); width:14px; text-align:center;}
.hc-actions{display:flex; gap:var(--em-gap-row); margin-top:var(--em-block-gap); padding-top:8px; border-top:1px solid var(--em-border-subtle);}

/* ═══ Чипы быстрых диапазонов (канон §5.13): своя компактная карточка перед фильтром ═══ */
.act-range-body{padding:12px 16px;}
.chip-row{display:flex; gap:var(--em-gap-row); flex-wrap:wrap;}
.chip{
    display:inline-flex; align-items:center; padding:6px 14px; border-radius:999px;
    font-size:.8rem; font-weight:700; text-decoration:none;
    color:var(--em-text-2); background:var(--em-subtle);
    transition:background .12s var(--ease-out), color .12s var(--ease-out);
}
.chip:hover{background:var(--em-hover-soft);}
.chip.active{background:var(--em-grad-primary); color:#fff;}
.chip.active:hover{background:var(--em-grad-primary);}

/* ═══ Кнопка копирования .em-copy-btn (канон) ═══ */
.em-copy-btn{
    display:inline-flex; align-items:center; justify-content:center;
    width:24px; height:24px; padding:0; margin:0 var(--em-gap-row); flex-shrink:0; vertical-align:middle;
    border:1px solid var(--em-border); border-radius:var(--em-radius); cursor:pointer;
    background:#fff; color:var(--em-placeholder); font-size:11px;
    transition:background .15s, color .15s, border-color .15s;
}
.em-copy-btn:hover{background:#eef0ff; border-color:#c7d2fe; color:var(--em-primary);}
.em-copy-btn:active{transform:scale(.97);}
.em-copy-btn.copied{background:#f0fdf4; border-color:var(--em-success-border); color:var(--em-success);}

/* ═══ Выпадашки с поиском (библиотека в public/vendor): вид по канону полей ═══ */
/* Обёртка библиотеки наследует классы исходного поля: гасим «поле внутри поля» */
.ts-wrapper.form-control{padding:0; border:0; height:auto; min-height:0; background:transparent; box-shadow:none;}
.ts-wrapper.single .ts-control, .ts-wrapper.multi .ts-control{
    border:1px solid var(--em-border-input); border-radius:var(--em-radius);
    font-family:'Assistant', sans-serif; font-size:var(--em-input-font); font-weight:500;
    color:var(--em-text-body); background:#fff; box-shadow:none;
    min-height:var(--em-control-h); line-height:normal;
    display:flex; flex-wrap:nowrap; align-items:center;
    padding-block:0 !important; padding-inline:.75rem 1.75rem !important;
}
/* Одна строка: выбранное значение с многоточием, поле поиска занимает остаток */
.ts-wrapper.single .ts-control{height:var(--em-control-h);}
.ts-wrapper.single .ts-control > .item{flex:0 1 auto; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.ts-wrapper .ts-control > input{flex:1 1 0; min-width:0 !important; height:auto; font-size:var(--em-input-font);}
/* Своя стрелка у конца строки — библиотека её не рисует, а обычное поле её имеет */
.ts-wrapper.single .ts-control::after{
    content:''; position:absolute; inset-inline-end:.7rem; top:50%; transform:translateY(-2px);
    width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent;
    border-top:5px solid var(--em-text-3); pointer-events:none;
}
.ts-wrapper.focus .ts-control{border-color:var(--em-primary-soft); box-shadow:var(--em-ring-focus);}
.ts-dropdown.ts-dropdown{border:1px solid var(--em-border); border-radius:var(--em-radius); box-shadow:0 12px 32px rgba(8,10,37,.16); font-family:'Assistant', sans-serif;}
.ts-dropdown .option{padding:8px 12px; border-radius:var(--em-radius);}
.ts-dropdown .option.active{position:relative; background:var(--em-primary-pastel); color:var(--em-primary-pastel-text);}
.ts-dropdown .option.active::before{content:''; position:absolute; inset-inline-start:0; top:0; bottom:0; width:3px; background:var(--em-primary); border-radius:var(--em-radius);}
.ts-dropdown .option:active{transform:scale(.985);}
.ts-dropdown .no-results{padding:10px 12px; color:var(--em-placeholder);}
.ts-dropdown-input{border:1px solid var(--em-border-input) !important; border-radius:var(--em-radius); font-family:'Assistant', sans-serif;}

/* ═══ Поле даты и календарь системы (канон §3.20) ═══
   Системное окно выбора даты показывает месяцы и кнопки на языке компьютера — вместо него
   свой календарь на иврите. Видимое поле текстовое, значение для сервера — в скрытом поле. */
.em-date-field{position:relative; display:block;}
.em-date-field .em-date{padding-inline-end:34px;}
.em-date-btn{
    position:absolute; inset-inline-end:6px; top:50%; transform:translateY(-50%);
    width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center;
    border:none; background:transparent; color:var(--em-text-3); cursor:pointer; font-size:14px;
    border-radius:var(--em-radius); transition:color .15s var(--ease-out), background .15s var(--ease-out);
}
.em-date-btn:hover{color:var(--em-primary); background:var(--em-primary-pastel);}
.em-date-btn:active{transform:translateY(-50%) scale(.92);}

.em-datepicker{
    position:fixed; z-index:130; width:262px; background:var(--em-card-bg);
    border:1px solid var(--em-border); border-radius:var(--em-radius);
    box-shadow:var(--em-shadow-drop); overflow:hidden; direction:rtl;
    opacity:0; transform:translateY(-4px) scale(.98); pointer-events:none;
    transition:opacity .15s var(--ease-out), transform .15s var(--ease-out);
}
.em-datepicker.em-dp-open{opacity:1; transform:none; pointer-events:auto;}
.em-dp-head{
    display:flex; align-items:center; justify-content:space-between; gap:var(--em-gap-row);
    padding:8px 10px; background:var(--em-grad-primary); color:#fff; position:relative; overflow:hidden;
}
.em-dp-head::before{content:''; position:absolute; inset:0; background:var(--em-glare); pointer-events:none;}
.em-dp-head > *{position:relative;}
.em-dp-title{font-size:.86rem; font-weight:800;}
.em-dp-nav{
    width:26px; height:26px; display:inline-flex; align-items:center; justify-content:center;
    border:none; background:rgba(255,255,255,.16); color:#fff; cursor:pointer; font-size:12px;
    border-radius:var(--em-radius); transition:background .15s var(--ease-out);
}
.em-dp-nav:hover{background:rgba(255,255,255,.3);}
.em-dp-nav:active{transform:scale(.93);}
.em-dp-body{padding:8px;}
.em-dp-grid{display:grid; grid-template-columns:repeat(7, 1fr); gap:2px;}
.em-dp-dow{
    text-align:center; font-size:.68rem; font-weight:800; color:var(--em-text-3);
    text-transform:none; padding-bottom:4px;
}
.em-dp-day{
    height:30px; display:inline-flex; align-items:center; justify-content:center;
    border:none; background:transparent; cursor:pointer; direction:ltr;
    font-family:'Assistant', sans-serif; font-size:.8rem; font-weight:600; color:var(--em-text);
    border-radius:var(--em-radius); transition:background .12s var(--ease-out), color .12s var(--ease-out);
}
.em-dp-day:hover{background:var(--em-row-hover);}
.em-dp-day:active{transform:scale(.93);}
.em-dp-day.em-dp-out{color:var(--em-faint); font-weight:500;}
.em-dp-day.em-dp-today{background:var(--em-primary-pastel); color:var(--em-primary-pastel-text); font-weight:800;}
.em-dp-day.em-dp-sel{background:var(--em-grad-primary); color:#fff; font-weight:800;}
.em-dp-foot{
    display:flex; align-items:center; justify-content:space-between; gap:var(--em-gap-row);
    padding:8px; border-top:1px solid var(--em-border-subtle); background:var(--em-surface-2);
}
.em-dp-link{
    border:none; background:transparent; cursor:pointer; padding:4px 8px;
    font-family:'Assistant', sans-serif; font-size:.78rem; font-weight:700; color:var(--em-primary);
    border-radius:var(--em-radius); transition:background .12s var(--ease-out);
}
.em-dp-link:hover{background:var(--em-primary-pastel);}
.em-dp-link.em-dp-clear{color:var(--em-text-3);}
.em-dp-link.em-dp-clear:hover{background:var(--em-neutral-bg);}
@media (max-width:768px){
    .em-datepicker{width:min(300px, 92vw);}
    .em-dp-day{height:36px; font-size:.86rem;}
}
@media (hover: none){
    .em-dp-day:hover{background:transparent;}
    .em-date-btn:hover{background:transparent; color:var(--em-text-3);}
}

/* ═══ Выбор файла (канон): кнопка на иврите вместо системной, имя файла рядом ═══ */
.em-file{position:absolute; width:1px; height:1px; opacity:0; pointer-events:none;}
.em-file-picker{
    display:inline-flex; align-items:center; gap:var(--em-gap-row); padding:7px 12px;
    background:#fff; border:1px solid var(--em-border); border-radius:var(--em-radius);
    font-size:.82rem; color:var(--em-text-3); cursor:pointer; transition:border-color .1s, color .1s, transform .1s;
}
.em-file-picker:hover{border-color:var(--em-primary); color:var(--em-text);}
.em-file-picker i{color:var(--em-primary);}
.em-file-picker:active{transform:scale(.97);}
.em-filename{
    font-size:.78rem; color:var(--em-text-3); font-style:italic; padding:7px 10px;
    background:#fff; border:1px solid var(--em-border); border-radius:var(--em-radius);
    max-width:220px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; display:inline-block;
}
.em-file-row{display:flex; gap:var(--em-gap-row); flex-wrap:wrap; align-items:center;}

/* ═══ Мобайл (§4.5 / §13.4) ═══ */
@media (max-width:768px){
    /* Мобильная шапка канона: 54px, лого-зона остаётся, тот же гамбургер */
    .app-header{height:calc(54px + env(safe-area-inset-top, 0px)); padding-top:env(safe-area-inset-top, 0px);}
    .app-header__logo{padding:0 .75rem; height:54px; width:auto;}
    .app-header__logo .logo-src{font-size:17px;}
    .app-header__logo .logo-sub{font-size:9px;}
    .app-header__content{padding:0 .75rem; height:54px; gap:var(--em-gap-row);}
    .header-user-info{display:none;}
    .search-wrapper.active{width:190px;}
    .search-wrapper.active .input-holder{width:150px;}
    .search-wrapper.active .btn-close-search{inset-inline-start:160px;}
    .app-sidebar{transform:translateX(100%); width:min(var(--em-sidebar-w), 85vw); top:calc(54px + env(safe-area-inset-top, 0px));}
    body.sidebar-open .app-sidebar{transform:translateX(0);}
    body.sidebar-open .sidebar-overlay{display:block;}
    .sidebar-overlay{top:calc(54px + env(safe-area-inset-top, 0px));}
    .app-main{margin-right:0; margin-top:calc(54px + env(safe-area-inset-top, 0px)); height:calc(100vh - 54px - env(safe-area-inset-top, 0px));}
    :root{--em-card-pad:.625rem; --em-page-pad:.625rem; --em-tab-h:44px;}
    .app-page-title{height:auto; min-height:var(--em-tile-height); padding:.7rem var(--em-card-pad); box-shadow:none; border-bottom:2px solid var(--em-primary);}
    .page-title-icon{width:48px; height:48px; font-size:1.5rem;}
    .page-title-wrapper{flex-wrap:wrap;}
    .page-title-actions{width:100%; margin-inline-start:0;}
    .em-empty-state{padding:32px 16px;}
    .em-empty-state-icon{width:48px; height:48px;}
    .em-toast-container{inset-inline:8px; align-items:stretch; max-width:none;}
    .hd-menu{position:fixed; top:62px; inset-inline:8px; left:auto; width:auto; min-width:0; max-width:none; transform:translateY(-4px) scale(1); transform-origin:top center;}
    .hd-menu.open{transform:translateY(0) scale(1);}
    #hdBellMenu{width:auto;}
    .f-grid{grid-template-columns:1fr;}
    /* Документы: строки становятся карточками */
    .dl-head{display:none;}
    .dl-row{grid-template-columns:1fr 1fr; gap:var(--em-gap-row);}
    .dl-row .dl-cell-name{grid-column:1 / -1;}
    .dl-row .dl-cell-total{grid-column:1 / -1; text-align:end;}
    /* Три величины себестоимости прячутся не молча: на телефоне они идут одной
       строкой с подписями — на узком экране девять колонок не читаются */
    .dl-row .dl-cell-cost{display:flex; gap:4px; align-items:baseline; justify-content:flex-start; direction:rtl;}
    .dl-cell-cost:empty{display:none;}
    .dl-cell-cost::before{content:attr(data-em-label) ':'; font-weight:600; color:var(--em-text-3); font-size:.72rem;}
    .dl-totals{min-width:100%;}
    .em-disc-tile{min-width:100%;}
    /* Настройки: сдвоенные строки серий */
    .set-series-head{display:none;}
    .set-series-row{grid-template-columns:1fr 1fr;}
    .set-series-row .list-name{grid-column:1 / -1;}
    /* Возврат: строки в две колонки */
    .cn-head{display:none;}
    .cn-row{grid-template-columns:1fr 1fr;}
    .cn-row > span:first-child{grid-column:1 / -1;}
    /* Закупки: строки заказа в две колонки */
    .po-head{display:none;}
    .po-row{grid-template-columns:1fr 1fr;}
    .po-cell-name{grid-column:1 / -1;}
    .po-cell-total{grid-column:1 / -1; text-align:end;}
    /* Приёмка: строки в две колонки */
    .pr-head{display:none;}
    .pr-row{grid-template-columns:1fr 1fr;}
    .pr-cell-name{grid-column:1 / -1;}
    .pr-serial-list{grid-template-columns:1fr;}
    .em-act-row > .card-note, .em-act-row > .f-hint{flex:1 1 100%;}
    /* Расчёт себестоимости: строки в две колонки */
    .ic-head{display:none;}
    .ic-row{grid-template-columns:1fr 1fr;}
    .ic-cell-name{grid-column:1 / -1;}
    /* Канон списков на телефоне: строка-карточка — главное поле жирным (1rem) без подписи,
       значок круглится до 40px, второстепенные поля мелким с подписью, кнопки действий 44px */
    .table thead{display:none;}
    .table tbody tr{display:block; margin-bottom:var(--em-gap-row-lg); padding:10px 12px; border:1px solid var(--em-border-subtle); border-radius:var(--em-radius);}
    .table tbody td{display:flex; justify-content:space-between; align-items:center; gap:var(--em-gap-row-lg); padding:6px 0; font-size:.82rem; border-bottom:1px solid var(--em-border-subtle);}
    .table tbody td:last-child{border-bottom:none;}
    .table tbody td::before{content:attr(data-label); font-weight:700; color:var(--em-text-2); font-size:.78rem;}
    .table tbody td[data-label=""]::before{content:none;}
    /* главное поле строки — ячейка с .list-name */
    .table tbody td:has(.list-name){display:block; font-size:1rem; padding-bottom:8px;}
    .table tbody td:has(.list-name)::before{content:none;}
    /* круглый значок строки — по канону 40px */
    .table tbody td .cat-thumb, .table tbody td .cat-thumb-ph{width:40px; height:40px; border-radius:50%;}
    /* кнопки действий — высота 44px, «просмотр» первым уже в разметке */
    .table tbody td:has(.row-actions){display:block; padding-top:8px;}
    .table tbody td:has(.row-actions)::before{content:none;}
    .table tbody td .row-actions{justify-content:flex-end;}
    .table tbody td .row-actions .abtn{min-height:44px; padding:10px 14px; font-size:12px;}
    /* плитки-счётчики — две в ряд */
    .st-row{grid-template-columns:1fr 1fr;}
    .abtn{padding:7px 13px; font-size:12px;}
}
@media (max-width:480px){
    .app-page-title{padding:.7rem var(--em-card-pad);}
    .abtn{padding:6px 11px; font-size:11px;}
}

/* Гард наведения для тач-устройств (§4 A) */
@media (hover: none){
    .abtn:hover{transform:none; box-shadow:0 2px 4px rgba(0,0,0,.1);}
    .hd-btn:hover{background:transparent;}
    .vertical-nav-menu a:hover{background:transparent; color:var(--em-menu-text);}
    .vertical-nav-menu a:hover:not(.mm-active) i{color:inherit;}
    .table-hover tbody tr:hover{background:transparent;}
    .widget-chart:hover{transform:none; box-shadow:0 1px 3px rgba(0,0,0,.05), 0 1px 2px rgba(0,0,0,.04);}
    .chip:hover{background:var(--em-subtle);}
    .em-hovercard{display:none;}
    .login-btn:hover, .err-btn:hover{transform:none;}
}

/* Сниженная анимация (§4 A) */
@media (prefers-reduced-motion: reduce){
    *{transition-duration:.01ms !important; animation-duration:.01ms !important;}
    .abtn:hover, .abtn:active, .hd-btn:active, .em-toast-close:active, .login-btn:hover, .err-btn:hover{transform:none !important;}
    .main-card tbody tr{opacity:1; animation:none !important;}
    .em-skel{animation:none !important;}
    .em-list-body{transition:none !important;}
    .widget-chart:hover, .widget-chart:active{transform:none !important;}
}

/* ═══════════════════════════════════════════════════════════════════════════
   ВИТРИНА (П.31, Сборка 125) — публичный сайт на корне домена. Макет 4.6 (утверждён 01.09.2026):
   герой-слайдер категорий (образец №3) → строка поиска (№1) → магазинный низ (№6).
   Все цвета и геометрия — токены :root ниже; в разметке витрины ни одного числа.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
    --em-site-dark: #001f38;        /* глубокий синий бренда: подвал, полосы, градиенты героя (белый на нём 16,76) */
    --em-site-primary: var(--em-brand-blue);  /* краска бренда: кнопки, ссылки, מק״ט (контраст на белом 9,85) */
    --em-site-primary-hover: #00355f;
    --em-site-dark-2: #002e51;      /* середина градиента пустого героя */
    --em-site-accent: var(--em-accent);  /* мята бренда — значение написано один раз, в --em-accent (таймер, прогресс, бейдж «חדש», акценты на тёмном: 8,25 на подвале) */
    --em-site-card: #f2f3f5;        /* подложка фото товара — замер демо ShopMartio (#F2F3F5) */
    --em-site-btn-face: #fcfcfd;    /* фон вкладок-фильтров и светлой кнопки — замер демо */
    --em-site-flash: rgba(255,255,255,.7);  /* вспышка баннера при наведении — замер демо */
    --em-site-soft: #f3f6f8;        /* блок обращения, полоса заголовка */
    --em-site-light: #f2f6fb;       /* светлый промо-баннер */
    --em-site-line: #e8e8ee;
    --em-site-text: #6a6a72;
    --em-site-muted: #9a9aa2;
    --em-site-badge: var(--em-site-accent);  /* бейдж «חדש» — мята бренда; розовый образца снят: белый на нём давал 2,94 */
    --em-site-radius: 6px;          /* радиус блоков витрины (решение владельца 01.09.2026: 6px) */
    --em-site-radius-sm: 4px;
    --em-site-wrap: 1170px;
    --em-site-nav-h: 82px;
    --em-site-card-w: 207px;        /* карточка героя */
    --em-site-card-h: 325px;
    --em-site-card-gap: 33px;
    --em-site-hero-expand: .8s;     /* раскрытие кадра карусели — одно место, скрипт читает его отсюда */
    /* Блок обращения — размеры сняты замером с живого образца (карточка 635×504
       в контейнере 1140, поле 40/40/50, поле ввода 50, кнопка 56, фотография 565×662,
       зазор 45) и приведены к нашему контейнеру 1170. Тон подложки снят пикселями
       с фонового снимка образца: среднее #D4F6F5. */
    --em-site-contact-bg: #d4f6f5;
    --em-site-contact-pad-y: 104px;     /* поле секции: (712 − 504) / 2 у образца */
    --em-site-contact-card: 635px;
    --em-site-contact-pad: 40px;
    --em-site-contact-btn: 56px;
    --em-site-contact-photo: 565px;
    --em-site-contact-gap: 45px;
    --em-site-promo-h: 333px;       /* высота промо-блока: снята с образца 576×342 и приведена к контейнеру 1170 */
    --em-site-promo-gap: 48px;      /* зазор между блоками — с образца (два жёлоба по 24) */
    --em-site-promo-pad: 40px;      /* поле текстовой половины */
    --em-site-hair: 2px;            /* тонкая цветная линия витрины: верх панели категорий */
    --em-site-catpanel-cols: 3;     /* колонок в панели категорий; на узком экране переопределяется */
    --em-site-catpanel-pad: 26px;   /* поле панели категорий */
    --em-site-font: 'Karantina', 'Assistant', sans-serif;
    --em-site-shadow-lg: 0 20px 44px rgba(0,31,56,.2);
    --em-site-shadow-btn: 0 8px 20px rgba(0,69,122,.3);
    --em-site-shadow-hero: 0 20px 40px rgba(0,0,0,.25);
    --em-site-shadow-drop: 0 24px 50px rgba(0,31,56,.14);
    --em-site-grad-hero: linear-gradient(to bottom, rgba(0,31,56,.45) 0%, rgba(0,31,56,0) 30%, rgba(0,31,56,0) 55%, rgba(0,31,56,.7) 100%), linear-gradient(to left, rgba(0,31,56,.45) 0%, rgba(0,31,56,0) 45%);
    --em-site-grad-hero-empty: linear-gradient(135deg, var(--em-site-dark) 0%, var(--em-site-dark-2) 55%, var(--em-site-primary) 100%);
    --em-site-grad-card: linear-gradient(to top, rgba(0,31,56,.78) 0%, rgba(0,31,56,.2) 45%, rgba(0,31,56,0) 70%);
    --em-site-white-92: rgba(255,255,255,.92);
    --em-site-white-45: rgba(255,255,255,.45);
    --em-site-white-28: rgba(255,255,255,.28);
    --em-site-white-20: rgba(255,255,255,.2);
    --em-site-white-85: rgba(255,255,255,.85);
    --em-site-overlay: rgba(0,31,56,.92);
    /* Полноэкранный поиск — размеры сняты замером с живого образца */
    --em-site-field-h: 50px;         /* высота поля ввода на витрине: окно поиска и карточка обращения */
    --em-site-search-pad: 55px;      /* отступ под лупу в конце строки */
    --em-site-search-max: 960px;     /* ограничение ширины на широком экране */
    --em-site-search-min: 260px;     /* ограничение ширины на узком */
    --em-site-touch: 44px;           /* область касания на витрине: кнопка поиска, крестик, кнопка промо-блока — норма доступности */
    --em-site-urgent-pattern: url('../img/branding/urgent-pattern.svg');   /* водяной знак полосы: пульс, кресты, лапы, лампы — белым 7% */
    --em-site-subs-bg: #002c5d;      /* полоса подписки над подвалом — тон образца */
    --em-site-field-face: #ebfaf8;   /* заливка поля ввода на витрине: полоса подписки и карточка обращения — тон образца */
    --em-site-ring: rgba(0,69,122,.18);
}
html.em-site-html{scroll-behavior:smooth; overflow-x:hidden;}
body.em-site{font-family:'Assistant', sans-serif; font-size:16px; line-height:1.6; color:var(--em-site-text); background:#fff; overflow-x:hidden; display:block; padding:0; min-height:100svh;}
.em-site a{color:inherit; text-decoration:none;}
.em-site img{display:block; max-width:100%;}
/* :where() обнуляет вес селектора: сброс остаётся, но любое правило с классом
   теперь выигрывает у него, как и задумано. Раньше сброс перебивал заголовок
   карусели, кнопку подвала и кнопку «наверх». */
:where(.em-site h1, .em-site h2, .em-site h3, .em-site h4){color:var(--em-site-dark); line-height:1.2; margin:0;}
.em-site p{margin:0;}
:where(.em-site button){font-family:inherit; font-size:inherit; color:inherit; background:none; border:0; cursor:pointer;}
.em-site-wrap{width:var(--em-site-wrap); max-width:calc(100% - 40px); margin-inline:auto; position:relative;}
.em-site-ltr{direction:ltr; unicode-bidi:isolate;}
.em-site-muted{color:var(--em-site-muted);}
.em-site-skip{position:absolute; inset-inline-start:-999px; top:8px; z-index:100; background:var(--em-site-dark); color:#fff; padding:8px 14px; border-radius:var(--em-site-radius-sm);}
.em-site-skip:focus{inset-inline-start:8px;}
.em-site-fade{opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out);}
.em-site-fade.is-in{opacity:1; transform:none;}
.em-site-hp{position:absolute; inset-inline-start:-9999px; width:1px; height:1px; overflow:hidden;}

/* кнопки витрины */
.em-site-btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; height:50px; padding:0 30px; color:#fff; font-size:14px; font-weight:500; white-space:nowrap; position:relative; overflow:hidden; z-index:0; background:transparent; border-radius:var(--em-site-radius-sm); transition:color .3s var(--ease-out);}
.em-site-btn::after, .em-site-btn::before{content:''; position:absolute; inset:0; border-radius:inherit; transition:transform .3s var(--ease-out), opacity .3s var(--ease-out); z-index:-1;}
.em-site-btn::after{background:var(--em-site-primary);}
.em-site-btn::before{border:1px solid var(--em-site-primary); opacity:0; transform:scale(.1, .1);}
.em-site-btn:hover{color:var(--em-site-primary);}
.em-site-btn:hover::after{transform:scale(0, 0); opacity:0;}
.em-site-btn:hover::before{opacity:1; transform:scale(1, 1);}
.em-site-btn:active{transform:scale(.98);}
.em-site-btn.is-accent{color:var(--em-site-dark);}
.em-site-btn.is-accent::after{background:var(--em-site-accent);}
.em-site-btn.is-accent::before{border-color:var(--em-site-accent);}
.em-site-btn.is-accent:hover{color:var(--em-site-accent);}
.em-site-btn.is-light{color:var(--em-site-text); background:var(--em-site-btn-face);}
.em-site-btn.is-light::after{background:var(--em-site-primary); transform:scale(0, 0); opacity:0;}
.em-site-btn.is-light::before{border-color:var(--em-site-line); opacity:1; transform:scale(1, 1);}
.em-site-btn.is-light:hover{color:#fff;}
.em-site-btn.is-light:hover::after{transform:scale(1, 1); opacity:1;}
.em-site-btn.is-light:hover::before{opacity:0; transform:scale(0, 0);}

/* верхняя полоса */
/* шапка: по ширине контейнера, прозрачная над героем; is-dark — статичная тёмная на внутренних страницах; is-sticky — прилипшая */
.em-site-nav{position:absolute; z-index:8; inset-inline:0; top:0; height:var(--em-site-nav-h); display:flex; align-items:center; width:var(--em-site-wrap); max-width:calc(100% - 40px); margin-inline:auto; color:#fff;}
.em-site-nav > .em-site-wrap{display:flex; align-items:center; width:100%; max-width:none;}
.em-site-nav.is-dark{position:relative; background:var(--em-brand-blue); width:100%; max-width:none; padding:0 calc((100% - var(--em-site-wrap)) / 2);}
.em-site-nav.is-sticky{position:fixed; top:0; inset-inline:0; width:100%; max-width:none; height:66px; padding:0 calc((100% - var(--em-site-wrap)) / 2); background:var(--em-brand-blue); box-shadow:var(--em-site-shadow-lg); z-index:50; animation:em-site-slide .4s var(--ease-out);}
@keyframes em-site-slide{from{transform:translateY(-100%);} to{transform:none;}}
.em-site-logo{display:flex; align-items:center; gap:12px; font-size:13px; font-weight:600; letter-spacing:.28em; color:inherit;}
.em-site-logo img{height:32px; width:auto;}
.em-site-logo.is-dark{color:var(--em-site-dark);}
/* подвал стал тёмным — логотип и название на нём белые; размеры логотипа с образца */
.em-site-footer .em-site-logo.is-dark{color:#fff; gap:14px; font-size:20px; letter-spacing:.04em;}
.em-site-footer .em-site-logo.is-dark img{height:48px;}
.em-site-menu{display:flex; gap:46px; margin-inline-start:auto; margin-inline-end:40px; font-size:16px; font-weight:500; letter-spacing:normal;}
.em-site-menu a{position:relative; padding:6px 0; color:#fff;}
/* Черта одна на оба состояния: у наведения и у активного пункта она рисуется
   одним правилом, поэтому правится в одной точке. Мята на синем бренда — 4,85. */
.em-site-menu a::after{content:''; position:absolute; inset-inline:0; bottom:-2px; height:2px; background:var(--em-site-accent); opacity:0; transition:opacity .2s var(--ease-out);}
.em-site-menu a:hover::after, .em-site-menu a.is-active::after{opacity:1;}
.em-site-nav-tools{display:flex; gap:22px; align-items:center;}
/* ── Панель категорий у пункта «קטלוג» ──
   Лежит под шапкой во всю её ширину, содержимое — по контейнеру витрины.
   Открывается классом is-cat на самой шапке: и пункт, и панель — её потомки,
   поэтому переход курсора между ними не закрывает панель. */
.em-site-catpanel{position:absolute; top:100%; inset-inline:0; background:#fff; color:var(--em-site-dark); border-top:var(--em-site-hair) solid var(--em-site-accent); border-radius:0 0 var(--em-site-radius) var(--em-site-radius); box-shadow:var(--em-site-shadow-drop); padding:var(--em-site-catpanel-pad) 0; opacity:0; visibility:hidden; transform:translateY(-8px); transition:opacity .2s var(--ease-out), transform .2s var(--ease-out), visibility .2s; z-index:8;}
.em-site-nav.is-cat .em-site-catpanel{opacity:1; visibility:visible; transform:none;}
.em-site-catpanel-grid{display:grid; grid-template-columns:repeat(var(--em-site-catpanel-cols), 1fr); column-gap:var(--em-site-catpanel-pad);}
.em-site-catpanel-grid a{display:flex; align-items:center; gap:var(--em-site-card-gap); padding-block:var(--em-gap-row); font-size:15px; color:var(--em-site-dark); transition:color .2s var(--ease-out);}
/* Число товаров — тоном подписей витрины (5,36 на белом), а не приглушённым:
   приглушённый #9A9AA2 даёт 2,79 при норме 4,5 — это текст, а не украшение. */
.em-site-catpanel-grid a small{margin-inline-start:auto; color:var(--em-site-text); font-size:13px;}
/* Наведение — синим бренда (9,85 на белом), не мятой: мята на белом даёт 2,03
   и при норме 4,5 для текста и 3,0 для графики не проходит ни там, ни там.
   Три места мяты на белом уже снимались по этой же причине (Сборка 134). */
.em-site-catpanel-grid a:hover{color:var(--em-site-primary);}
.em-site-catpanel-all{display:inline-flex; align-items:center; gap:var(--em-gap-row); margin-top:var(--em-site-catpanel-pad); padding-top:var(--em-site-catpanel-pad); border-top:1px solid var(--em-site-line); font-size:15px; font-weight:700; color:var(--em-site-primary);}
.em-site-catpanel-all:hover{color:var(--em-site-dark);}
.em-site-mobile-cat{display:none;}
.em-site-mobile-catlist{display:none;}
.em-site-search-btn, .em-site-burger{color:inherit; font-size:18px; display:grid; place-items:center; width:36px; height:36px;}
.em-site-burger{display:none;}
.em-site-mobile-menu{display:none;}

/* герой */
.em-site-hero{position:relative; width:100%; height:100svh; min-height:720px; overflow:hidden; color:#fff; background:var(--em-site-grad-hero-empty);}
.em-site-hero-bg{position:absolute; inset:0; z-index:0;}
.em-site-hero-bg img{width:100%; height:100%; object-fit:cover;}
.em-site-hero-bg img.is-empty{display:none;}
.em-site-hero-bg::after{content:''; position:absolute; inset:0; background:var(--em-site-grad-hero);}
/* Раскрытие идёт преобразованием, а не шириной и высотой: раскладочные свойства
   заставляли браузер каждый кадр пересчитывать раскладку и заново растрировать
   полноэкранный снимок — замер показал провал в 158 мс без единого кадра и прыжок
   слоя с 245 до 1552 точек. Преобразование считает видеокарта, раскладки нет.
   Слой лежит на весь экран и сжимается до рамки карточки; снимок внутри получает
   встречное преобразование, поэтому стоит на месте и не искажается ни в одном кадре —
   растёт только окно. Радиуса нет: при неравном сжатии углы вытянулись бы. */
.em-site-hero-expander{position:absolute; inset:0; z-index:1; overflow:hidden; background:var(--em-site-grad-hero-empty); transform-origin:0 0; will-change:transform; transition:transform var(--em-site-hero-expand) var(--ease-in-out);}
.em-site-hero-expander img{width:100%; height:100%; object-fit:cover; transform-origin:0 0; will-change:transform; transition:transform var(--em-site-hero-expand) var(--ease-in-out);}
.em-site-hero-timer{position:absolute; top:0; inset-inline-start:0; height:3px; width:0; background:var(--em-site-accent); z-index:9;}
.em-site-hero-timer.is-run{animation:em-site-timer 3750ms linear forwards;}
@keyframes em-site-timer{from{width:0;} to{width:100%;}}
.em-site-hero-wrap{height:100%; z-index:2;}
.em-site-hero-text{position:absolute; z-index:5; inset-inline-start:0; top:285px; width:440px;}
.em-site-hero-line{width:33px; height:2px; background:var(--em-site-accent); margin-bottom:22px;}
.em-site-hero-sub{font-size:22px; font-weight:300; margin-bottom:12px; line-height:1.2;}
/* Две строки резервируются всегда: у части категорий заголовок в одну строку,
   и без запаса описание с кнопками прыгало на 117 точек при каждом переключении */
/* Два класса в селекторе: правило «.em-site h1…h4» весит больше одного класса
   и перебивало и цвет, и межстрочный интервал — заголовок выходил тёмным
   и разреженным (1,2 вместо 1,02). */
.em-site .em-site-hero-title{font-family:var(--em-site-font); font-weight:700; font-size:112px; line-height:.84; letter-spacing:.01em; margin-bottom:24px; color:#fff; min-height:calc(112px * .84 * 2);}
.em-site-hero-title span{display:block; overflow:hidden;}
.em-site-hero-title span i{display:block; font-style:normal;}
.em-site-hero-desc{font-size:14px; line-height:1.8; max-width:400px; margin-bottom:28px; color:var(--em-site-white-92);}
.em-site-hero-actions{display:flex; align-items:center; gap:18px;}
.em-site-hero-round{width:44px; height:44px; border-radius:50%; background:var(--em-site-accent); color:var(--em-site-dark); display:grid; place-items:center; font-size:16px; transition:transform .2s var(--ease-out);}
.em-site-hero-round:hover{transform:scale(1.08);}
.em-site-hero-pill{height:39px; padding:0 30px; border:1px solid var(--em-site-white-85); border-radius:999px; font-size:12px; letter-spacing:.08em; font-weight:600; display:inline-flex; align-items:center; transition:background .25s var(--ease-out), color .25s var(--ease-out);}
.em-site-hero-pill:hover{background:#fff; color:var(--em-site-dark);}
.em-site-hero-line, .em-site-hero-sub, .em-site-hero-title span i, .em-site-hero-desc, .em-site-hero-actions{opacity:0; transform:translateY(24px);}
.em-site-hero-title span i{transform:translateY(110%);}
.em-site-hero-text.is-in .em-site-hero-line{animation:em-site-up .45s var(--ease-out) forwards;}
.em-site-hero-text.is-in .em-site-hero-sub{animation:em-site-up .45s var(--ease-out) .05s forwards;}
.em-site-hero-text.is-in .em-site-hero-title span:nth-child(1) i{animation:em-site-up .5s var(--ease-out) .1s forwards;}
.em-site-hero-text.is-in .em-site-hero-title span:nth-child(2) i{animation:em-site-up .5s var(--ease-out) .18s forwards;}
.em-site-hero-text.is-in .em-site-hero-desc{animation:em-site-up .45s var(--ease-out) .16s forwards;}
.em-site-hero-text.is-in .em-site-hero-actions{animation:em-site-up .45s var(--ease-out) .22s forwards;}
.em-site-hero-text.is-out .em-site-hero-line, .em-site-hero-text.is-out .em-site-hero-sub, .em-site-hero-text.is-out .em-site-hero-title span i, .em-site-hero-text.is-out .em-site-hero-desc, .em-site-hero-text.is-out .em-site-hero-actions{animation:em-site-out .27s var(--ease-in-out) forwards;}
@keyframes em-site-up{from{opacity:0; transform:translateY(24px);} to{opacity:1; transform:none;}}
@keyframes em-site-out{from{opacity:1; transform:none;} to{opacity:0; transform:translateY(-18px);}}
.em-site-hero-cards{position:absolute; z-index:4; top:344px; inset-inline-start:594px; height:var(--em-site-card-h); display:flex; gap:var(--em-site-card-gap); transition:transform .5s var(--ease-in-out);}
.em-site-hero-cards.no-anim{transition:none;}
.em-site-hero-card{position:relative; flex:none; width:var(--em-site-card-w); height:var(--em-site-card-h); border-radius:var(--em-site-radius); overflow:hidden; cursor:pointer; background:var(--em-site-grad-hero-empty); box-shadow:var(--em-site-shadow-hero); transition:transform .35s var(--ease-out), opacity .35s var(--ease-out);}
.em-site-hero-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.em-site-hero-card::after{content:''; position:absolute; inset:0; background:var(--em-site-grad-card);}
.em-site-hero-card:hover{transform:translateY(-6px);}
.em-site-hero-card.is-ghost{opacity:0;}
.em-site-hero-card-body{position:absolute; z-index:1; inset-inline:22px; bottom:22px;}
.em-site-hero-card-body small{display:block; font-size:12px; margin-bottom:8px; color:var(--em-site-white-92);}
.em-site-hero-card-body small::before{content:''; display:inline-block; width:14px; height:1px; background:var(--em-site-accent); vertical-align:middle; margin-inline-end:8px;}
.em-site-hero-card-body h3{font-family:var(--em-site-font); font-weight:700; font-size:26px; line-height:1.02; color:#fff;}
.em-site-hero-card.is-hidden{opacity:0; transform:translateY(20px); transition:none;}
/* backwards, а не forwards: конечный кадр закреплял transform навсегда,
   и у только что въехавшей карточки переставал работать подъём при наведении */
.em-site-hero-card.is-enter{animation:em-site-card-in .45s var(--ease-out) backwards;}
@keyframes em-site-card-in{from{opacity:0; transform:translateY(20px);}}
/* Одна строка: стрелки, пауза, линия и счётчик стоят рядом и по одной оси.
   Раньше три блока висели на разной высоте (703 / 740 / 712) и счётчик уезжал к краю. */
.em-site-hero-ctrl{position:absolute; z-index:5; top:703px; inset-inline-start:594px; inset-inline-end:45px; display:flex; align-items:center; gap:13px;}
.em-site-hero-arrow{width:74px; height:74px; border:1px solid var(--em-site-white-45); border-radius:50%; display:grid; place-items:center; color:#fff; font-size:16px; transition:background .25s var(--ease-out), color .25s var(--ease-out), border-color .25s var(--ease-out);}
.em-site-hero-arrow:hover{background:#fff; color:var(--em-site-dark); border-color:#fff;}
.em-site-hero-pause{width:44px; height:44px; border:1px solid var(--em-site-white-28); border-radius:50%; display:grid; place-items:center; margin-inline-start:10px; color:#fff; font-size:13px; transition:background .25s var(--ease-out), color .25s var(--ease-out);}
.em-site-hero-pause .is-play{display:none;}
.em-site-hero-pause.is-paused .is-play{display:block;}
.em-site-hero-pause.is-paused .is-pause{display:none;}
.em-site-hero-pause:hover{background:#fff; color:var(--em-site-dark);}
.em-site-hero-progress{flex:1; position:relative; height:1px; margin-inline-start:12px; background:var(--em-site-white-28);}
.em-site-hero-progress i{position:absolute; inset-inline-start:0; top:0; height:100%; width:0; background:var(--em-site-accent); transition:width .8s var(--ease-in-out);}
.em-site-hero-counter{flex:none; font-family:var(--em-site-font); font-weight:700; font-size:48px; line-height:1; height:52px; overflow:hidden; direction:ltr; color:#fff;}
.em-site-hero-counter span{display:block;}
.em-site-hero-counter.is-flip span{animation:em-site-flip .5s var(--ease-in-out);}
@keyframes em-site-flip{0%{transform:translateY(0);} 45%{transform:translateY(-110%); opacity:0;} 55%{transform:translateY(110%); opacity:0;} 100%{transform:translateY(0); opacity:1;}}
.em-site-hero.is-empty .em-site-hero-cards, .em-site-hero.is-empty .em-site-hero-ctrl, .em-site-hero.is-empty .em-site-hero-progress, .em-site-hero.is-empty .em-site-hero-counter{display:none;}

/* строка поиска — перекрывает низ героя на 55px */
.em-site-suggest{position:absolute; top:100%; inset-inline:0; background:#fff; border-radius:var(--em-site-radius); box-shadow:var(--em-site-shadow-drop); display:none; z-index:7; overflow:hidden;}
.em-site-suggest.is-open{display:block;}
.em-site-suggest-item{display:flex; align-items:center; gap:12px; padding:8px 12px; font-size:14px; color:var(--em-site-dark);}
.em-site-suggest-item:hover{background:var(--em-site-soft);}
.em-site-suggest-item img{width:40px; height:40px; object-fit:contain; background:var(--em-site-card); border-radius:var(--em-site-radius-sm); flex:none;}
.em-site-suggest-item img.is-empty{visibility:hidden;}
.em-site-suggest-item span{flex:1;}
.em-site-suggest-item small{color:var(--em-site-muted);}
.em-site-searchlay .em-site-suggest{background:#fff; color:var(--em-site-dark);}

/* рекламные баннеры (объявления) */
/* ярлык объявления — используется двумя промо-блоками середины страницы */
.em-site-ad-tag{display:inline-block; border:1px solid var(--em-site-white-85); color:#fff; font-size:11px; letter-spacing:.3em; padding:6px 12px; margin-bottom:14px;}
.em-site-ad-tag.is-fill{border:0; background:var(--em-site-badge); color:var(--em-site-dark); letter-spacing:.2em;}

/* заголовок раздела, бейджи-вкладки, сетка товаров */
.em-site-section{padding:64px 0;}
.em-site-sec-head{text-align:center; margin-bottom:40px;}
.em-site-sec-head h2{font-family:var(--em-site-font); font-weight:700; font-size:42px; letter-spacing:.03em;}
.em-site-sec-head p{font-size:15px; color:var(--em-site-muted); margin-top:8px;}
.em-site-filter{display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin:-10px 0 40px;}
.em-site-filter button, .em-site-filter a{height:40px; padding:0 20px; border:1px solid var(--em-site-line); border-radius:var(--em-site-radius-sm); font-size:14px; font-weight:500; color:var(--em-site-text); background:var(--em-site-btn-face); display:inline-flex; align-items:center; transition:background .3s linear, color .3s linear, border-color .3s linear;}
.em-site-filter button.is-on, .em-site-filter a.is-on, .em-site-filter button:hover, .em-site-filter a:hover{background:var(--em-site-accent); border-color:var(--em-site-accent); color:#fff;}
.em-site-grid{display:grid; grid-template-columns:repeat(4, 1fr); gap:38px 27px;}
.em-site-prod{position:relative; display:block;}
.em-site-prod.is-hid{display:none;}
.em-site-prod-img{display:block; position:relative; height:341px; background:var(--em-site-card); border-radius:var(--em-site-radius); overflow:hidden;}
.em-site-prod-img img{position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:30px 20px 60px; mix-blend-mode:multiply; transition:opacity .3s linear, visibility .3s linear;}
.em-site-prod-img img.is-alt{opacity:0;}
.em-site-prod:hover .em-site-prod-img img.is-main{opacity:0;}
.em-site-prod:hover .em-site-prod-img img.is-alt{opacity:1;}
.em-site-prod:hover .em-site-prod-img img.is-main:only-of-type{opacity:1;}
.em-site-prod-empty{position:absolute; inset:0; display:grid; place-items:center; font-size:44px; color:var(--em-site-line);}
.em-site-prod-cat{position:absolute; inset-inline:0; bottom:16px; text-align:center; font-size:12px; color:var(--em-site-dark); font-weight:500;}
.em-site-badge{position:absolute; top:14px; inset-inline-end:14px; background:var(--em-site-badge); color:var(--em-site-dark); font-size:12px; font-weight:600; padding:4px 12px; z-index:2; border-radius:var(--em-site-radius-sm);}
.em-site-acts{position:absolute; top:14px; inset-inline-start:14px; display:flex; flex-direction:column; gap:9px; z-index:2;}
.em-site-acts button, .em-site-acts-view{width:40px; height:40px; border-radius:50%; background:var(--em-brand-blue); color:#fff; display:grid; place-items:center; font-size:15px; opacity:0; visibility:hidden; transform:translateX(-20px); transition:opacity .3s ease-in-out, visibility .3s ease-in-out, transform .3s ease-in-out, background .3s linear;}
.em-site-acts-view{transition-delay:.1s;}
.em-site-prod:hover .em-site-acts button, .em-site-prod:hover .em-site-acts-view{opacity:1; visibility:visible; transform:translateX(0);}
.em-site-acts button:hover, .em-site-acts-view:hover{background:var(--em-site-accent); color:#fff;}
.em-site-acts button.is-on{background:var(--em-site-accent); color:#fff;}
.em-site-prod-body{display:block; text-align:center; padding-top:18px;}
.em-site-prod-body h3{font-family:var(--em-site-font); font-size:16px; font-weight:500; transition:color .3s linear; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;}
.em-site-prod:hover .em-site-prod-body h3{color:var(--em-site-primary);}
.em-site-sku{display:block; margin-top:6px; font-size:19px; font-weight:600; color:var(--em-site-primary);}
.em-site-sku small{font-size:12px; font-weight:400; color:var(--em-site-muted); margin-inline-end:6px;}
.em-site-more{display:flex; justify-content:center; margin-top:44px;}

/* срочный сервис */
/* Полоса срочного обращения по образцу: ровный фирменный синий с еле заметным
   водяным знаком поверх — у образца ровно так же, фотографии там нет. */
.em-site-urgent{background:var(--em-site-urgent-pattern) 0 0 repeat, var(--em-brand-blue); background-size:420px 420px, auto; color:#fff; padding:100px 0;}
.em-site-urgent .em-site-wrap{display:flex; align-items:center; gap:26px;}
.em-site-urgent-icon{width:88px; height:88px; background:var(--em-site-accent); color:var(--em-site-dark); display:grid; place-items:center; flex:none; border-radius:var(--em-site-radius); font-size:38px;}
.em-site-urgent small{display:block; font-family:var(--em-site-font); font-size:26px; line-height:1.2; color:var(--em-site-white-92);}
.em-site-urgent b{display:block; font-family:var(--em-site-font); font-size:44px; line-height:1.2; text-align:right;}
.em-site-urgent .em-site-btn{margin-inline-start:auto;}

/* промо-баннеры середины */
/* ── Два промо-блока середины ──
   Устройство образца: два блока равной ширины, каждый на две половины —
   текст с одной стороны, фотография во всю высоту с другой. Ширина, высота
   и зазор сняты замером с живого образца (блок 576×342 в контейнере 1200,
   жёлоба по 24) и приведены к нашему контейнеру 1170: блок 561×333, зазор 48.
   Половины выложены сеткой, поэтому в RTL они меняются местами сами —
   фотография оказывается со стороны, зеркальной образцу, как просит ТЗ. */
.em-site-darkrow{padding:20px 0 10px;}
.em-site-darkrow .em-site-wrap{display:grid; grid-template-columns:1fr 1fr; gap:var(--em-site-promo-gap);}
.em-site-dark{position:relative; height:var(--em-site-promo-h); background:var(--em-site-dark); color:#fff; overflow:hidden; display:grid; grid-template-columns:1fr 1fr; align-items:center; border-radius:var(--em-site-radius); transition:transform .5s linear;}
.em-site-dark::after{content:''; position:absolute; inset-inline:0; bottom:0; width:150%; height:0; background:var(--em-site-flash); transform:rotate(10deg) translate(-30px, 80px); pointer-events:none; z-index:2;}
.em-site-dark:hover{transform:translateY(-5px);}
.em-site-dark:hover::after{height:100%; opacity:0; transform:rotate(0deg) translate(0, 0); transition:height .5s ease-out, opacity .5s ease-out, transform .5s ease-out;}
.em-site-dark img{grid-column:2; width:100%; height:var(--em-site-promo-h); object-fit:cover; display:block;}
.em-site-dark.is-light{background:var(--em-site-light); color:var(--em-site-dark);}
.em-site-dark > div{grid-column:1; padding:0 var(--em-site-promo-pad);}
.em-site-dark .em-site-ad-tag{margin-bottom:16px;}
.em-site-dark.is-light .em-site-ad-tag{border-color:var(--em-site-dark); color:var(--em-site-dark);}
.em-site-dark.is-light .em-site-ad-tag.is-fill{color:#fff; border:0;}
.em-site-dark b{font-family:var(--em-site-font); font-size:42px; font-weight:700; line-height:1.05; display:block; margin-bottom:14px; color:#fff;}
.em-site-dark.is-light b{color:var(--em-site-dark);}
.em-site-dark b em{font-style:normal; color:var(--em-site-accent);}
.em-site-dark.is-light b em{color:var(--em-site-primary);}
.em-site-dark-from{display:block; font-size:15px; margin-bottom:16px;}
/* Кнопка вместо прежней строки капслоком: то же правило наведения, что у кнопок
   на синих плитках (§J.4) — заливка мятой, надпись глубоким синим, 6,03. */
.em-site-dark-btn{display:inline-flex; align-items:center; gap:var(--em-gap-row); margin-top:18px; height:var(--em-site-touch); padding:0 22px; border:1px solid var(--em-site-white-85); border-radius:var(--em-site-radius); font-size:14px; font-weight:700; color:#fff; transition:background .3s var(--ease-out), color .3s var(--ease-out), border-color .3s var(--ease-out);}
.em-site-dark:hover .em-site-dark-btn{background:var(--em-site-accent); border-color:var(--em-site-accent); color:var(--em-brand-deep);}
/* Рамка тоном подписей витрины: --em-site-line на светлом блоке давала 1,12
   при норме 3,0 для графики — кнопка теряла край. Тон подписей даёт 4,94. */
.em-site-dark.is-light .em-site-dark-btn{border-color:var(--em-site-text); color:var(--em-site-dark);}

/* карусель ведущих */
.em-site-carousel{position:relative;}
.em-site-car-clip{overflow:hidden;}
.em-site-car-track{display:flex; gap:27px; transition:transform .55s var(--ease-out);}
.em-site-car-track .em-site-prod{flex:none; width:calc((100% - 81px) / 4);}
.em-site-car-arrow{position:absolute; top:170px; width:60px; height:60px; border-radius:50%; background:var(--em-site-primary); color:#fff; display:grid; place-items:center; z-index:4; font-size:16px; box-shadow:var(--em-site-shadow-btn); opacity:0; visibility:hidden; transition:background .3s linear, opacity .3s linear, visibility .3s linear;}
.em-site-carousel:hover .em-site-car-arrow{opacity:1; visibility:visible;}
.em-site-car-arrow:hover{background:var(--em-site-primary-hover);}
.em-site-car-arrow.is-prev{inset-inline-start:-78px;}
.em-site-car-arrow.is-next{inset-inline-end:-78px;}

/* обращение */
/* ── Блок обращения по образцу ──
   Светлое мятное поле во всю ширину; внутри контейнера — вырезанная фотография
   ближе к краю и белая карточка ближе к центру. Раскладка сеткой, поэтому в RTL
   стороны меняются сами: фотография оказывается зеркально образцу. */
.em-site-contact{position:relative; background:var(--em-site-contact-bg); padding:var(--em-site-contact-pad-y) 0;}
.em-site-contact .em-site-wrap{display:grid; grid-template-columns:1fr var(--em-site-contact-card); gap:var(--em-site-contact-gap); align-items:center;}
.em-site-contact-photo{width:100%; max-width:var(--em-site-contact-photo); height:auto; justify-self:center; display:block;}
.em-site-contact-card{background:#fff; border-radius:var(--em-site-radius); padding:var(--em-site-contact-pad) var(--em-site-contact-pad) 50px;}
.em-site-contact h2{font-family:var(--em-site-font); font-size:40px; font-weight:700; letter-spacing:.03em; margin-bottom:10px;}
.em-site-contact p{font-size:15px; color:var(--em-site-text); margin-bottom:26px;}
.em-site-contact-form{position:relative;}
.em-site-contact-form input{display:block; width:100%; height:var(--em-site-field-h); margin-bottom:14px; border:0; background:var(--em-site-field-face); padding:0 15px; font-family:inherit; font-size:16px; color:var(--em-site-dark); outline:none; border-radius:var(--em-site-radius); transition:box-shadow .2s var(--ease-out);}
/* Подсказка несёт название поля — видимых подписей у полей нет, поэтому она
   задаётся токеном, а не оставляется на умолчание браузера. 4,99 на заливке. */
.em-site-contact-form input::placeholder{color:var(--em-site-text); opacity:1;}
.em-site-contact-form input:focus{box-shadow:0 0 0 3px var(--em-site-ring);}
/* Кнопка во всю ширину карточки. Надпись глубоким синим на мяте — 6,03;
   то же правило, что у кнопок на синих плитках (§J.4) и на экране входа. */
.em-site-contact-send{width:100%; height:var(--em-site-contact-btn); margin-top:6px; border:0; border-radius:var(--em-site-radius); background:var(--em-site-accent); color:var(--em-brand-deep); font-family:inherit; font-size:16px; font-weight:700; cursor:pointer; transition:background .3s var(--ease-out);}
.em-site-contact-send:hover{background:var(--em-site-primary); color:#fff;}
.em-site-lead-done{display:none; margin-top:12px; color:var(--em-site-primary); font-weight:600;}
.em-site-contact-form.is-done input, .em-site-contact-form.is-done .em-site-contact-send{display:none;}
.em-site-contact-form.is-done .em-site-lead-done, .em-site-lead-form.is-done .em-site-lead-done{display:block;}
.em-site-lead-form.is-done .em-site-fld, .em-site-lead-form.is-done .em-site-btn{display:none;}

/* подвал */
/* ═══ Полоса подписки и подвал — по размерам образца (замер 02.09.2026) ═══ */
.em-site-subs{background:var(--em-site-subs-bg); padding:50px 0;}
/* row-reverse: в RTL обычный порядок поставил бы соцсети справа, а форму слева.
   Владелец выбрал расположение образца — соцсети слева, форма справа. */
.em-site-subs .em-site-wrap{display:flex; flex-direction:row-reverse; align-items:center; justify-content:space-between; gap:26px; flex-wrap:wrap;}
.em-site-subs-soc{display:flex; gap:16px;}
.em-site-subs-soc a{width:50px; height:50px; border-radius:50%; background:var(--em-site-accent); color:#fff; display:grid; place-items:center; font-size:16px; transition:background .5s var(--ease-out), color .5s var(--ease-out);}
.em-site-subs-soc a:hover{background:var(--em-site-subs-bg); color:#fff;}   /* образец: кружок уходит в цвет полосы, значок остаётся белым */
.em-site-subs-form{display:flex; flex-direction:row-reverse; min-width:min(420px, 100%);}
.em-site-subs-form input{flex:1; height:62px; border:0; outline:none; background:var(--em-site-field-face); color:var(--em-site-dark); font-family:inherit; font-size:16px; padding:0 18px; border-start-end-radius:var(--em-site-radius); border-end-end-radius:var(--em-site-radius);}   /* поле слева — скругление с левого края */
.em-site-subs-form button{flex:none; width:152px; height:62px; border:0; background:var(--em-site-accent); color:#fff; font-family:inherit; font-size:16px; font-weight:600; cursor:pointer; border-start-start-radius:var(--em-site-radius); border-end-start-radius:var(--em-site-radius); transition:background .5s var(--ease-out), box-shadow .5s var(--ease-out);}   /* кнопка справа — скругление с правого края */
.em-site-subs-form button:hover{background:var(--em-site-subs-bg); box-shadow:inset 0 0 0 1px var(--em-site-accent); color:#fff;}

.em-site-footer{background:var(--em-site-urgent-pattern) 0 0 repeat, var(--em-site-dark); background-size:760px 760px, auto; color:#fff; padding:100px 0 60px; opacity:1;}
.em-site-footer-btn{display:inline-flex; align-items:center; margin-top:26px; height:58px; padding:0 26px; border:0; border-radius:var(--em-site-radius); background:var(--em-site-accent); color:#fff; font-family:inherit; font-size:16px; font-weight:600; cursor:pointer; transition:background .3s var(--ease-out);}
.em-site-footer-btn:hover{background:var(--em-brand-blue);}
.em-site-footer-links li{display:flex; align-items:center; height:48px;}   /* шаг строк ссылок как в образце */
.em-site-footer-links a{display:flex; align-items:center; gap:10px; font-weight:500; line-height:1.5;}
.em-site-footer-links a::before{content:'\00BB'; color:#fff; font-size:16px; line-height:1;}   /* в образце стрелка белая, не мятная */
.em-site-footer-new{display:flex; align-items:center; gap:14px; margin-bottom:30px;}
.em-site-footer-new img{width:69px; height:69px; flex:none; object-fit:cover; border-radius:var(--em-site-radius); background:var(--em-site-card);}
.em-site-footer-new b{display:block; font-size:16px; font-weight:600; line-height:1.4; color:#fff;}
.em-site-footer-new small{display:block; margin-top:6px; font-size:16px; color:var(--em-site-accent);}
.em-site-footer-new:hover b{color:var(--em-site-accent);}
.em-site-footer-grid{display:grid; grid-template-columns:1.2fr 1fr 1fr 1.2fr; gap:44px;}
.em-site-footer h4{font-family:var(--em-site-font); font-size:24px; font-weight:700; color:#fff; margin-bottom:20px;}
.em-site-footer-about{font-size:16px; line-height:1.7; margin:24px 0 10px; max-width:285px; color:#fff;}
.em-site-footer ul{list-style:none; margin:0; padding:0;}
.em-site-footer li{font-size:16px; color:#fff;}
.em-site-footer li a{display:inline-flex; align-items:center; gap:10px; color:#fff; transition:color .25s var(--ease-out), padding .25s var(--ease-out);}
.em-site-footer li a:hover{color:var(--em-site-accent); padding-inline-start:4px;}
.em-site-footer-contact li{display:flex; gap:10px; align-items:center; padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid var(--em-site-white-28);}
.em-site-footer-contact li:last-child{border-bottom:0; margin-bottom:0; padding-bottom:0;}
.em-site-footer-contact i{color:var(--em-site-accent); width:20px; font-size:20px; text-align:center;}
.em-site-copy{background:var(--em-site-dark); color:var(--em-site-white-85); text-align:center; padding:38px 0; font-size:16px; border-top:1px solid var(--em-site-white-28);}   /* 45% белого дало бы 4,34 при норме 4,5 */
.em-site-top{position:fixed; bottom:26px; inset-inline-end:26px; width:52px; height:52px; border-radius:50%; background:var(--em-site-accent); color:#fff; display:grid; place-items:center; box-shadow:var(--em-site-shadow-btn); opacity:0; visibility:hidden; transition:opacity .3s var(--ease-out), visibility .3s; z-index:60; font-size:18px;}
.em-site-top.is-show{opacity:1; visibility:visible;}

/* полноэкранный поиск и окно обращения */
.em-site-searchlay{position:fixed; inset:0; background:var(--em-site-overlay); z-index:90; display:grid; place-items:center; opacity:0; visibility:hidden; transition:opacity .35s var(--ease-out), visibility .35s;}
.em-site-searchlay.is-open{opacity:1; visibility:visible;}
/* Ширина, высота поля, размер подсказки, линия и отступ под лупу сняты замером
   с живого образца: 50 % экрана на компьютере, 80 % на телефоне, поле 50 точек,
   подсказка 16, линия 2 точки сплошным белым, отступ под значок 55. */
.em-site-searchlay-form{width:50%; max-width:var(--em-site-search-max); min-width:var(--em-site-search-min); position:relative;}
/* Отступ резервируется с той же стороны, где стоит значок поиска — в конце строки
   по направлению письма (в иврите слева). Логические свойства держат обе стороны. */
.em-site-searchlay-form input{width:100%; height:var(--em-site-field-h); background:transparent; border:0; border-bottom:2px solid #fff; color:#fff; font-family:inherit; font-size:16px; padding-block:12px; padding-inline-start:0; padding-inline-end:var(--em-site-search-pad); outline:none;}
.em-site-searchlay-form input::placeholder{color:#fff; opacity:1;}
.em-site-searchlay-form button{position:absolute; inset-inline-end:0; inset-inline-start:auto; top:0; bottom:auto; width:var(--em-site-touch); height:var(--em-site-field-h); display:grid; place-items:center; color:#fff; font-size:18px;}
/* Селектор с двумя классами: правило «.em-site button» весит больше одного класса
   и перебивало цвет и размер — крестик рисовался серым 16px на тёмном слое.
   Крестик один и стоит у ПРАВОГО края экрана физически, независимо от направления
   письма, — поэтому right/left, а не логические свойства. По высоте — над полем. */
.em-site-searchlay .em-site-searchlay-close{position:fixed; top:calc(50% - var(--em-site-field-h) / 2 - var(--em-site-touch)); inset-inline:auto; right:28px; left:auto; width:var(--em-site-touch); height:var(--em-site-touch); display:grid; place-items:center; color:#fff; font-size:26px; z-index:2;}
.em-site-modal{position:fixed; inset:0; background:var(--em-site-overlay); z-index:95; display:grid; place-items:center; padding:20px; opacity:0; visibility:hidden; transition:opacity .3s var(--ease-out), visibility .3s;}
.em-site-modal.is-open{opacity:1; visibility:visible;}
.em-site-modal-card{position:relative; width:520px; max-width:100%; background:#fff; border-radius:var(--em-site-radius); padding:36px 34px 30px; box-shadow:var(--em-site-shadow-lg); transform:translateY(16px); transition:transform .3s var(--ease-out);}
.em-site-modal.is-open .em-site-modal-card{transform:none;}
.em-site-modal-card h3{font-family:var(--em-site-font); font-size:24px; font-weight:700;}
.em-site-modal-sub{font-size:14px; color:var(--em-site-muted); margin:6px 0 20px;}
.em-site-modal-close{position:absolute; top:14px; inset-inline-end:14px; font-size:20px; color:var(--em-site-muted);}
.em-site-fld{display:block; margin-bottom:14px;}
.em-site-fld span{display:block; font-size:13px; font-weight:600; color:var(--em-site-dark); margin-bottom:6px;}
.em-site-fld input, .em-site-fld textarea{width:100%; border:1px solid var(--em-site-line); border-radius:var(--em-site-radius-sm); padding:10px 12px; font-family:inherit; font-size:14px; color:var(--em-site-dark); outline:none; transition:border-color .2s var(--ease-out), box-shadow .2s var(--ease-out);}
.em-site-fld input{height:40px;}
.em-site-fld input:focus, .em-site-fld textarea:focus{border-color:var(--em-site-primary); box-shadow:0 0 0 3px var(--em-site-ring);}

/* внутренние страницы: полоса заголовка, категория, товар */
.em-site-band{background:var(--em-site-soft); padding:44px 0; text-align:center;}
.em-site-band h1{font-family:var(--em-site-font); font-size:40px; font-weight:700; color:var(--em-site-primary); letter-spacing:.04em;}
.em-site-crumbs{font-size:14px; color:var(--em-site-text); margin-top:10px;}
.em-site-crumbs a:hover{color:var(--em-site-primary);}
.em-site-cat-page{padding:50px 0 70px;}
.em-site-cat-tools{display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; margin-bottom:30px;}
.em-site-cat-tools .em-site-filter{margin:0; justify-content:flex-start;}
.em-site-cat-search{display:flex; align-items:center; gap:10px; height:44px; padding:0 16px; border:1px solid var(--em-site-line); border-radius:999px; background:#fff; color:var(--em-site-muted);}
.em-site-cat-search input{border:0; outline:none; font-family:inherit; font-size:14px; color:var(--em-site-dark); background:transparent; width:200px;}
.em-site-pagination{display:flex; justify-content:center; margin-top:40px;}
.em-site-empty{text-align:center; padding:60px 0; color:var(--em-site-muted);}
.em-site-empty i{font-size:48px; margin-bottom:14px;}
.em-site-text-page{padding:50px 0 80px; font-size:16px; line-height:1.8; max-width:860px;}
.em-site-pd{padding:70px 0 40px;}
.em-site-pd-grid{display:grid; grid-template-columns:127px 435px 1fr; gap:26px; align-items:start;}
.em-site-pd-thumbs{display:grid; gap:14px;}
.em-site-pd-thumbs button{height:127px; background:var(--em-site-card); border:1px solid transparent; border-radius:var(--em-site-radius-sm); display:grid; place-items:center; padding:10px; overflow:hidden;}
.em-site-pd-thumbs button.is-on{border-color:var(--em-site-primary);}
.em-site-pd-thumbs img{max-height:100%; object-fit:contain; mix-blend-mode:multiply;}
.em-site-pd-main{position:relative; height:445px; background:var(--em-site-card); border-radius:var(--em-site-radius); display:grid; place-items:center; padding:28px;}
.em-site-pd-main img{max-height:100%; object-fit:contain; mix-blend-mode:multiply; transition:opacity .3s var(--ease-out);}
.em-site-pd-main img.is-fade{opacity:0;}
.em-site-pd-info h2{font-size:30px; font-weight:600;}
.em-site-pd-cat{display:inline-block; color:var(--em-site-primary); font-size:14px; margin:8px 0 10px;}
.em-site-pd-sku{font-size:26px; font-weight:700; color:var(--em-site-primary); display:flex; align-items:baseline; gap:12px; margin-bottom:22px;}
.em-site-pd-sku small{font-size:14px; font-weight:400; color:var(--em-site-muted);}
.em-site-pd-box{background:var(--em-site-card); padding:26px 28px; border-radius:var(--em-site-radius);}
.em-site-pd-row{display:flex; align-items:center; gap:20px; margin-bottom:18px; font-size:14px;}
.em-site-pd-row:last-child{margin-bottom:0;}
.em-site-pd-row > label{width:110px; color:var(--em-site-dark); font-weight:500; flex:none;}
.em-site-pd-row.is-actions{gap:12px; margin-top:6px;}
.em-site-pd-call{width:48px; height:48px; border:1px solid var(--em-site-line); background:#fff; display:grid; place-items:center; color:var(--em-site-dark); border-radius:50%;}
.em-site-pd-call:hover{color:var(--em-site-primary);}
.em-site-tabs{display:flex; gap:34px; border-bottom:1px solid var(--em-site-line); margin:40px 0 22px; font-size:16px; font-weight:500; color:var(--em-site-muted);}
.em-site-tabs button{padding:0 2px 14px; border-bottom:2px solid transparent; transition:color .25s var(--ease-out), border-color .25s var(--ease-out);}
.em-site-tabs button.is-on{color:var(--em-site-dark); border-color:var(--em-site-primary);}
.em-site-tabpane{font-size:15px; line-height:1.8; max-width:900px;}
.em-site-closed{max-width:520px; margin:80px auto; text-align:center; padding:0 20px;}
.em-site-closed .abtn{margin-top:20px;}

/* раздел «אתר» в панели: строки слайдов и баннеров */
.em-site-set-row{display:flex; gap:var(--em-gap-row-lg); align-items:flex-start; padding:12px 0; border-top:1px solid var(--em-border-subtle);}
.em-site-set-row:first-of-type{border-top:0;}
.em-site-set-num{width:28px; height:28px; border-radius:50%; background:var(--em-primary-pastel); color:var(--em-primary-pastel-text); display:grid; place-items:center; font-weight:700; font-size:.8rem; flex:none;}
.em-site-set-fields{flex:1;}
.em-site-set-fields .form-group{margin-bottom:6px;}
.em-site-set-thumb{width:96px; height:64px; object-fit:cover; border-radius:var(--em-radius); flex:none;}
.em-site-set-remove{margin-top:6px; border:0; padding:0; font-size:.8rem;}

/* витрина — планшет и телефон */
@media (max-width:1240px){
    :root{--em-site-wrap: calc(100% - 40px);}
    .em-site-hero-cards{inset-inline-start:520px;}
    .em-site-hero-ctrl{inset-inline-start:520px;}
    .em-site-hero-text{inset-inline-start:0; width:420px;}
    .em-site-hero-title{font-size:84px;}
    .em-site-hero-progress{inset-inline-start:760px; inset-inline-end:100px;}
    .em-site-menu{gap:28px; margin-inline-end:24px;}
    :root{--em-site-catpanel-cols: 2;}   /* две колонки: контейнер сузился */
    .em-site-car-arrow.is-prev{inset-inline-start:-10px;}
    .em-site-car-arrow.is-next{inset-inline-end:-10px;}
    .em-site-grid{grid-template-columns:repeat(3, 1fr);}
    .em-site-pd-grid{grid-template-columns:100px 1fr; gap:20px;}
    .em-site-pd-info{grid-column:1 / -1;}
}
@media (max-width:900px){
    :root{--em-site-card-w: 150px; --em-site-card-h: 230px; --em-site-card-gap: 16px;}
    .em-site-menu{display:none;}
    .em-site-burger{display:grid; margin-inline-start:4px;}
    .em-site-nav.is-open .em-site-mobile-menu{display:flex; flex-direction:column; position:absolute; top:100%; inset-inline:0; background:var(--em-site-dark); padding:10px 20px 16px;}
    .em-site-mobile-menu a{padding:12px 0; border-bottom:1px solid var(--em-site-white-20); color:#fff; font-size:16px;}
    /* Панель под шапкой на телефоне не показывается: её место — аккордеон в меню */
    .em-site-catpanel{display:none;}
    .em-site-mobile-cat{display:flex; align-items:center; justify-content:space-between; width:100%; padding:12px 0; border-bottom:1px solid var(--em-site-white-20); color:#fff; font-size:16px; text-align:start;}
    .em-site-mobile-cat i{transition:transform .2s var(--ease-out);}
    .em-site-mobile-cat[aria-expanded="true"] i{transform:rotate(180deg);}
    .em-site-mobile-cat[aria-expanded="true"] + .em-site-mobile-catlist{display:flex;}
    .em-site-mobile-catlist{flex-direction:column; padding-inline-start:var(--em-site-catpanel-pad);}
    .em-site-mobile-catlist a{display:flex; align-items:center; justify-content:space-between; padding:var(--em-gap-row-lg) 0; border-bottom:1px solid var(--em-site-white-20); color:#fff; font-size:15px;}
    .em-site-mobile-catlist a small{color:var(--em-site-white-92);}   /* 45% белого давал 4,34 при норме 4,5 */
    .em-site-searchlay-form{width:80%;}   /* доля образца на узком экране */
    .em-site-searchlay .em-site-searchlay-close{right:16px;}
    .em-site-nav.is-sticky, .em-site-nav.is-dark{padding:0 20px;}
    .em-site-hero{height:auto; min-height:100svh;}   /* svh, а не vh: адресная строка телефона меняет vh прямо во время прокрутки */
    .em-site-hero-wrap{display:flex; flex-direction:column;}
    .em-site-hero-text{position:relative; top:auto; inset-inline-start:auto; width:auto; padding:110px 4px 0;}
    .em-site-hero-title{font-size:64px;}
    .em-site-hero-desc{max-width:none;}
    .em-site-hero-cards{position:relative; top:auto; inset-inline-start:auto; margin:36px 4px 0;}
    .em-site-hero-ctrl{position:relative; top:auto; inset-inline:auto; margin:28px 4px 90px;}
    .em-site-hero-progress{margin-inline-start:8px;}
    .em-site-hero-counter{padding:0; height:auto;}
    .em-site-quad{grid-template-columns:1fr; margin-top:0;}
    .em-site-quad-cell{aspect-ratio:auto; min-height:0; padding:28px var(--em-page-pad);}
    .em-site-hero-expander{position:fixed;}
    .em-site-quad{grid-template-columns:1fr 1fr; margin-top:-40px;}
    .em-site-quad-cell{aspect-ratio:auto; min-height:290px;}
    .em-site-section{padding:44px 0;}
    .em-site-sec-head h2{font-size:34px;}
    .em-site-grid{grid-template-columns:repeat(2, 1fr); gap:24px 14px;}
    .em-site-prod-img{height:250px;}
    .em-site-car-track .em-site-prod{width:calc((100% - 27px) / 2);}
    .em-site-car-arrow{display:none;}
    .em-site-urgent .em-site-wrap{flex-wrap:wrap;}
    .em-site-urgent .em-site-btn{margin-inline-start:0;}
    .em-site-urgent{padding:52px 0;}
    .em-site-urgent small{font-size:18px;}
    .em-site-urgent b{font-size:28px;}
    /* Телефон: фотография сверху, карточка на всю ширину */
    .em-site-contact{padding:44px 0;}
    .em-site-contact .em-site-wrap{grid-template-columns:1fr; gap:20px;}
    .em-site-contact-photo{max-width:280px;}
    .em-site-contact-card{padding:26px 22px 30px;}
    .em-site-contact h2{font-size:30px;}
    .em-site-darkrow .em-site-wrap{grid-template-columns:1fr;}
    /* Телефон: блоки в столбец, фотография сверху — половины становятся строками */
    .em-site-dark{grid-template-columns:1fr; grid-template-rows:auto auto; height:auto; align-items:stretch;}
    .em-site-dark img{grid-column:1; grid-row:1; height:200px;}
    .em-site-dark > div{grid-column:1; grid-row:2; padding:26px var(--em-site-promo-pad) 30px;}
    .em-site-dark b{font-size:30px;}
    .em-site-footer-grid{grid-template-columns:1fr; gap:30px;}
    .em-site-pd-grid{grid-template-columns:1fr;}
    .em-site-pd-thumbs{grid-template-columns:repeat(3, 1fr); order:2;}
    .em-site-pd-main{height:320px;}
    .em-site-cat-tools{flex-direction:column; align-items:stretch;}
    .em-site-set-row{flex-wrap:wrap;}
}
@media (max-width:480px){
    .em-site-grid{grid-template-columns:1fr;}
    .em-site-prod-img{height:300px;}
}
@media (hover: none){
    .em-site-acts button, .em-site-acts-view{opacity:1; transform:none;}
    .em-site-prod:hover .em-site-prod-img img.is-main{opacity:1;}
    .em-site-prod:hover .em-site-prod-img img.is-alt{opacity:0;}
    .em-site-hero-card:hover{transform:none;}
}
@media (prefers-reduced-motion: reduce){
    .em-site-fade{opacity:1; transform:none;}
    .em-site-hero-timer{display:none;}
    .em-site-acts button, .em-site-acts-view{opacity:1; transform:none;}
}

/* ═══════════════════════════════════════════════════════════════════════════
   ВХОД (П.34, Сборка 131) — экран входа в панель. Самостоятельная страница.
   Все цвета и размеры — токены :root ниже; в разметке ни одного числа.
   Прежний блок «Вход в систему» выше не тронут: его классы использует
   публичная заявка регистрации клиента (.login-card.cl-reg-card).
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
    --em-login-panel-w: 46%;
    --em-login-panel-w-md: 40%;
    --em-login-card-w: 420px;
    --em-login-mark: 150px;
    --em-login-mark-md: 120px;
    --em-login-mark-sm: 52px;
    --em-login-field-h: 46px;
    --em-login-btn-h: 50px;
    --em-login-icon: 46px;
    --em-login-dot-area: 150px;
    --em-login-grad-panel: linear-gradient(160deg, var(--em-brand-blue) 0%, var(--em-brand-deep) 100%);
    --em-login-grad-btn: linear-gradient(135deg, var(--em-brand-blue) 0%, var(--em-brand-deep) 100%);
    /* Плёнка поверх фото: плотнее в зоне знака и текста, чтобы белый держал 4,5 даже над светлым кадром */
    --em-login-film: linear-gradient(160deg, rgba(0,69,122,.55) 0%, rgba(0,55,96,.82) 45%, rgba(0,55,96,.75) 100%);
    --em-login-dots: radial-gradient(rgba(255,255,255,.35) 1.5px, transparent 1.5px);
    --em-login-wave-1: rgba(255,255,255,.07);
    --em-login-wave-2: rgba(255,255,255,.05);
    --em-login-glass: rgba(255,255,255,.14);
    --em-login-glass-line: rgba(255,255,255,.22);
    --em-login-page-off: rgba(255,255,255,.75);  /* непройденные номера пейджера и версия: 55% из ТЗ давали 3,41 над светлым кадром, 75% дают 4,89 */
    --em-login-ink: #0b2a44;
    --em-login-gray: #5c6b78;
    --em-login-line: var(--em-border-input);  /* рамка поля — та же, что у всех полей панели: тон #dce7e5 из ТЗ давал на белом 1,26 */
    --em-login-ring: rgba(0,69,122,.14);
    --em-login-shadow-card: 0 24px 64px rgba(0,69,122,.14);
    --em-login-shadow-btn-hi: 0 12px 26px rgba(0,69,122,.4);
}

.em-lp{margin:0; min-height:100vh; display:flex; background:#fff; font-family:'Assistant', sans-serif; color:var(--em-login-ink);}

/* ── Правая половина: карточка входа ── */
.em-lp-side{flex:1; display:flex; align-items:center; justify-content:center; padding:32px 24px;}
.em-lp-card{width:100%; max-width:var(--em-login-card-w); background:#fff; border-radius:var(--em-site-radius); box-shadow:var(--em-login-shadow-card); padding:40px 36px;}
.em-lp-title{font-size:24px; font-weight:800; line-height:1.2; color:var(--em-login-ink);}
.em-lp-sub{font-size:13.5px; color:var(--em-login-gray); margin-top:4px; margin-bottom:22px;}
.em-lp-group{margin-bottom:14px;}
.em-lp-group label{display:block; font-size:13px; font-weight:700; color:var(--em-login-gray); margin-bottom:var(--em-gap-row);}
.em-lp-field{position:relative; display:flex; align-items:center;}
.em-lp-field > i{position:absolute; inset-inline-start:14px; color:var(--em-login-gray); font-size:14px; pointer-events:none;}
.em-lp-field input{
    width:100%; height:var(--em-login-field-h);
    padding-inline-start:40px; padding-inline-end:44px;
    border:1px solid var(--em-login-line); border-radius:var(--em-site-radius);
    background:#fff; color:var(--em-login-ink);
    font-family:inherit; font-size:15px; outline:none;
    transition:border-color .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
.em-lp-field input:focus{border-color:var(--em-brand-blue); box-shadow:0 0 0 3px var(--em-login-ring);}
.em-lp-eye{
    position:absolute; inset-inline-end:8px; width:32px; height:32px;
    display:flex; align-items:center; justify-content:center;
    border:0; background:transparent; color:var(--em-login-gray);
    font-size:14px; cursor:pointer; border-radius:var(--em-site-radius);
    transition:color .15s var(--ease-out);
}
.em-lp-eye:hover{color:var(--em-brand-blue);}
.em-lp-row{display:flex; align-items:center; justify-content:space-between; gap:var(--em-gap-row); margin:14px 0 18px; flex-wrap:wrap;}
.em-lp-check{display:flex; align-items:center; gap:var(--em-gap-row); font-size:13px; color:var(--em-login-gray); cursor:pointer;}
.em-lp-check input{width:16px; height:16px; accent-color:var(--em-brand-blue);}
.em-lp-forgot{border:0; background:transparent; font-family:inherit; font-size:13px; font-weight:700; color:var(--em-brand-blue); cursor:pointer; padding:0;}
.em-lp-hint{font-size:12.5px; color:var(--em-login-gray); background:var(--em-subtle); border-radius:var(--em-site-radius); padding:10px 12px; margin-bottom:16px; line-height:1.5;}
.em-lp-btn{
    width:100%; height:var(--em-login-btn-h);
    display:flex; align-items:center; justify-content:center; gap:var(--em-gap-row);
    /* рамка прозрачная, а не 0: при наведении она красится мятой, и при box-sizing:border-box
       высота и положение надписи не сдвигаются ни на точку */
    border:1px solid transparent; border-radius:var(--em-site-radius);
    background:var(--em-login-grad-btn); color:#fff;
    font-family:inherit; font-size:15px; font-weight:700; cursor:pointer;
    box-shadow:var(--em-site-shadow-btn);   /* та же тень фирменной кнопки, что на витрине — значение написано один раз */
    transition:transform .15s var(--ease-out), box-shadow .2s var(--ease-out), background .3s var(--ease-out), color .3s var(--ease-out), border-color .3s var(--ease-out);
}
/* То же правило, что у кнопок на синих плитках витрины (§J.4): заливка мятой,
   надпись глубоким синим. Глубокий синий на мяте — 6,03 при норме 4,5. */
.em-lp-btn:hover{transform:translateY(-1px); box-shadow:var(--em-login-shadow-btn-hi); background:var(--em-accent); border-color:var(--em-accent); color:var(--em-brand-deep);}
.em-lp-btn:active{transform:translateY(-1px) scale(.99);}
.em-lp-btn-spin{width:16px; height:16px; border-radius:50%; border:2px solid var(--em-on-brand-border); border-top-color:#fff; animation:emSpin .8s linear infinite;}
.em-lp-note{text-align:center; font-size:11.5px; color:var(--em-login-gray); margin-top:14px;}
.em-lp-ver-sm{display:none; text-align:center; font-size:11px; color:var(--em-login-gray); margin-top:12px;}

/* ── Левая половина: фирменная панель ── */
.em-lp-panel{
    position:relative; overflow:hidden; flex:0 0 var(--em-login-panel-w);
    background:var(--em-login-grad-panel);
    display:flex; align-items:center; justify-content:center;
    color:#fff; padding:40px 32px;
}
.em-lp-photo{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.78; transition:opacity 1.2s var(--ease-out);}
.em-lp-photo.is-out{opacity:0;}
.em-lp-film{position:absolute; inset:0; background:var(--em-login-film);}
.em-lp-wave{position:absolute; border-radius:50%; pointer-events:none;}
.em-lp-wave-1{width:150%; padding-top:150%; inset-inline-start:-30%; bottom:-95%; background:var(--em-login-wave-1);}
.em-lp-wave-2{width:110%; padding-top:110%; inset-inline-end:-25%; bottom:-70%; background:var(--em-login-wave-2);}
.em-lp-dots{position:absolute; top:0; inset-inline-end:0; width:var(--em-login-dot-area); height:var(--em-login-dot-area); background:var(--em-login-dots); background-size:16px 16px;}
.em-lp-inner{position:relative; width:100%; max-width:var(--em-login-card-w); text-align:center;}
.em-lp-mark{
    width:var(--em-login-mark); height:var(--em-login-mark); margin:0 auto;
    background:var(--em-accent);
    -webkit-mask:var(--em-logo-mask) center/contain no-repeat;
    mask:var(--em-logo-mask) center/contain no-repeat;
    animation:emLpBreathe 6s var(--ease-in-out) infinite;
}
@keyframes emLpBreathe{
    0%, 100%{transform:translateY(0) scale(1);}
    50%{transform:translateY(-6px) scale(1.03);}
}
.em-lp-word{font-size:30px; font-weight:800; line-height:1.15; margin-top:14px;}
.em-lp-tag{display:none; font-size:12px; color:var(--em-on-brand-dim);}
.em-lp-slider{position:relative; margin-top:18px; min-height:74px;}
.em-lp-slide{position:absolute; inset:0; font-size:15.5px; line-height:1.6; color:var(--em-on-brand-dim); opacity:0; transform:translateY(6px); transition:opacity .6s var(--ease-out), transform .6s var(--ease-out);}
.em-lp-slide.is-on{opacity:1; transform:translateY(0);}
.em-lp-pager{display:flex; align-items:center; justify-content:center; gap:var(--em-gap-row-lg); margin-top:var(--em-block-gap);}
.em-lp-page{display:flex; align-items:center; gap:var(--em-gap-row); border:0; background:transparent; padding:0; cursor:pointer;}
.em-lp-page-n{font-size:13px; font-weight:700; color:var(--em-login-page-off); transition:color .3s var(--ease-out), transform .3s var(--ease-out);}
.em-lp-page.is-on .em-lp-page-n{color:#fff; transform:scale(1.12);}
.em-lp-page-line{position:relative; width:44px; height:2px; background:var(--em-login-glass-line); overflow:hidden;}
.em-lp-page-line span{position:absolute; inset:0; inset-inline-end:auto; width:0; background:#fff;}
.em-lp-page.is-done .em-lp-page-line span{width:100%;}
.em-lp-page.is-on .em-lp-page-line span{width:100%; transition:width 4.5s linear;}
.em-lp-icons{display:flex; align-items:flex-start; justify-content:center; gap:var(--em-block-gap); margin-top:26px;}
.em-lp-ico{flex:1; max-width:110px;}
.em-lp-ico i{
    width:var(--em-login-icon); height:var(--em-login-icon); margin:0 auto var(--em-gap-row);
    display:flex; align-items:center; justify-content:center;
    background:var(--em-login-glass); border:1px solid var(--em-login-glass-line);
    border-radius:var(--em-site-radius); font-size:16px;
}
.em-lp-ico span{display:block; font-size:12px; color:var(--em-on-brand-dim); line-height:1.3;}
.em-lp-ver{position:absolute; bottom:16px; inset-inline-start:20px; font-size:11px; color:var(--em-login-page-off);}

/* ── Занавес при входе (§5 ТЗ): карточка уходит, панель раздвигается, знак гаснет ── */
.em-lp-go .em-lp-card{transform:translateY(18px) scale(.96); opacity:0; transition:transform .55s var(--ease-out), opacity .55s var(--ease-out);}
.em-lp-go .em-lp-panel{flex-basis:100%; transition:flex-basis .8s var(--ease-in-out) .35s;}
.em-lp-go .em-lp-word, .em-lp-go .em-lp-slider, .em-lp-go .em-lp-pager,
.em-lp-go .em-lp-icons, .em-lp-go .em-lp-ver, .em-lp-go .em-lp-photo,
.em-lp-go .em-lp-wave, .em-lp-go .em-lp-dots{opacity:0; transition:opacity .35s var(--ease-out);}
.em-lp-go .em-lp-mark{animation:emLpPulse .9s var(--ease-out) .4s forwards;}
@keyframes emLpPulse{
    0%{transform:scale(1); opacity:1;}
    25%{transform:scale(1.18); opacity:1;}
    100%{transform:scale(1.18); opacity:0;}
}

/* ── Планшет ── */
@media (max-width:979px){
    .em-lp-panel{flex-basis:var(--em-login-panel-w-md); padding:32px 20px;}
    .em-lp-mark{width:var(--em-login-mark-md); height:var(--em-login-mark-md);}
    .em-lp-word{font-size:26px;}
    .em-lp-card{padding:28px 26px;}
    .em-lp-icons{gap:var(--em-gap-row);}
}

/* ── Телефон: панель становится шапкой, фото и слайдер не показываются ── */
@media (max-width:759px){
    .em-lp{flex-direction:column;}
    .em-lp-panel{order:-1; flex:none; padding:16px var(--em-page-pad); justify-content:flex-start;}
    .em-lp-inner{display:flex; align-items:center; gap:var(--em-gap-row-lg); text-align:start; max-width:none;}
    .em-lp-mark{width:var(--em-login-mark-sm); height:var(--em-login-mark-sm); margin:0; animation:none;}
    .em-lp-word{font-size:19px; margin-top:0;}
    .em-lp-tag{display:block;}
    .em-lp-photo, .em-lp-slider, .em-lp-pager, .em-lp-icons, .em-lp-ver, .em-lp-dots, .em-lp-wave{display:none;}
    .em-lp-side{padding:20px var(--em-page-pad) 28px;}
    .em-lp-card{max-width:none; box-shadow:none; padding:24px 0 0;}
    .em-lp-ver-sm{display:block;}
    .em-lp-go .em-lp-panel{flex:1 1 auto; min-height:100vh; transition:min-height .8s var(--ease-in-out) .35s;}
}

/* ── Сниженная анимация: занавеса нет, дыхание знака выключено ── */
@media (prefers-reduced-motion: reduce){
    .em-lp-mark{animation:none !important;}
    .em-lp-go .em-lp-card, .em-lp-go .em-lp-panel{transition:none !important;}
}

/* ═══════════════════════════════════════════════════════════════════════════
   ЗАНАВЕС ПАНЕЛИ (П.34.6, Сборка 132) — первый показ после входа.
   Слой рисуется в первой отрисовке: файл темы со знаком и этот файл подключены
   блокирующими ссылками в <head> (канон §0.1), поэтому строк стиля в шаблоне нет.
   ═══════════════════════════════════════════════════════════════════════════ */
:root{
    --em-dh-z: 2000;
}
.em-dh-veil{
    position:fixed; inset:0; z-index:var(--em-dh-z);
    background:var(--em-login-grad-panel);
    display:flex; align-items:center; justify-content:center;
    pointer-events:none;
    animation:emDhVeil .7s var(--ease-out) .5s forwards;
}
.em-dh-mark{
    width:var(--em-login-mark); height:var(--em-login-mark);   /* тот же знак, что на экране входа — размер написан один раз */
    background:var(--em-accent);
    -webkit-mask:var(--em-logo-mask) center/contain no-repeat;
    mask:var(--em-logo-mask) center/contain no-repeat;
    animation:emDhMark .5s var(--ease-out) .3s forwards;
}
@keyframes emDhVeil{to{opacity:0; visibility:hidden;}}
@keyframes emDhMark{to{transform:scale(.9); opacity:0;}}

/* Плитки показателей дашборда входят волной справа налево */
.em-dh-enter .stats-row .widget-chart{animation:emDhTile .5s var(--ease-out) backwards;}
.em-dh-enter .stats-row .widget-chart:nth-child(1){animation-delay:.6s;}
.em-dh-enter .stats-row .widget-chart:nth-child(2){animation-delay:.68s;}
.em-dh-enter .stats-row .widget-chart:nth-child(3){animation-delay:.76s;}
.em-dh-enter .stats-row .widget-chart:nth-child(4){animation-delay:.84s;}
.em-dh-enter .stats-row .widget-chart:nth-child(5){animation-delay:.92s;}
/* Заливка backwards, а не forwards: иначе конечный кадр закрепил бы transform
   на плитке навсегда и подъём при наведении перестал бы работать */
@keyframes emDhTile{from{opacity:0; transform:translateY(14px);}}

/* Телефон: слой уходит сверху вниз */
@media (max-width:759px){
    .em-dh-veil{animation:emDhVeilSm .7s var(--ease-in-out) .5s forwards;}
    @keyframes emDhVeilSm{to{clip-path:inset(100% 0 0 0);}}
}

/* Сниженная анимация: слоя нет, плитки на месте */
@media (prefers-reduced-motion: reduce){
    .em-dh-veil{display:none;}
    .em-dh-enter .stats-row .widget-chart{animation:none !important;}
}

/* ═══ Четыре плитки под каруселью (П.31.1): срочное · каталог · часы · связь ═══ */
/* Ряд по ширине сайта; наползание на карусель −85, как на образце. */
.em-site-quad{width:var(--em-site-wrap); max-width:calc(100% - 40px); margin:-85px auto 0; display:grid; grid-template-columns:repeat(4,1fr); position:relative; z-index:6;}
.em-site-quad-cell{position:relative; overflow:hidden; display:flex; flex-direction:column; aspect-ratio:285 / 329; min-height:329px; padding:36px; transition:transform .35s var(--ease-out);}
/* Белый на мяте — решение владельца 02.09.2026, как в образце. Контраст 2,03
   при норме 4,5; отступление внесено в 03_DESIGN_SYSTEM. Значки, рамки кнопок
   и линии расписания берут цвет отсюда, поэтому белеют вместе с текстом. */
.em-site-quad-cell.is-mint{background:var(--em-site-accent); color:#fff;}
.em-site-quad-cell.is-deep{background:var(--em-brand-blue); color:#fff;}
/* блик при наведении — тот же приём, что у тёмных промо-блоков витрины */
.em-site-quad-cell::after{content:''; position:absolute; inset-inline:0; bottom:0; width:150%; height:0; background:var(--em-site-flash); transform:rotate(10deg) translate(-30px, 80px); pointer-events:none; z-index:0;}
.em-site-quad-cell:hover::after{height:100%; opacity:0; transform:rotate(0deg) translate(0, 0); transition:height .5s ease-out, opacity .5s ease-out, transform .5s ease-out;}
.em-site-quad-cell > *{position:relative; z-index:1;}
/* Значки контурные, как на образце. Один файл на значок: цвет даёт сама плитка
   через маску, поэтому светлой и тёмной копии не нужно. */
.em-site-quad-ic{width:50px; height:50px; margin-bottom:20px; background:currentColor;
    -webkit-mask:var(--em-quad-ic) center/contain no-repeat; mask:var(--em-quad-ic) center/contain no-repeat;}
.em-site-quad-ic.is-urgent{--em-quad-ic:url('../img/branding/quad/urgent.svg');}
.em-site-quad-ic.is-catalog{--em-quad-ic:url('../img/branding/quad/catalog.svg');}
.em-site-quad-ic.is-hours{--em-quad-ic:url('../img/branding/quad/hours.svg');}
.em-site-quad-ic.is-lead{--em-quad-ic:url('../img/branding/quad/lead.svg');}
.em-site-quad-cell h3{font-family:var(--em-site-font); font-size:22px; font-weight:700; margin-bottom:20px; color:inherit;}
.em-site-quad-cell p{font-size:15px; line-height:1.5; opacity:.9;}
.em-site-quad-btn{align-self:flex-start; display:inline-flex; align-items:center; margin-top:auto; height:42px; padding:0 18px; border:1px solid currentColor; border-radius:var(--em-site-radius); font-size:16px; font-weight:600; color:inherit; opacity:.85; transition:background .3s var(--ease-out), color .3s var(--ease-out), border-color .3s var(--ease-out), opacity .3s var(--ease-out);}
/* Наведение красит кнопку в цвет соседней плитки: на мятной — фирменный синий,
   на синей — мята. Подпись берётся под заливку: белая на синем (9,85),
   синяя на мяте (8,89) — на мятной заливке белая подпись дала бы 2,03. */
.em-site-quad-btn:hover{opacity:1;}
.em-site-quad-cell.is-mint .em-site-quad-btn:hover{background:var(--em-brand-blue); border-color:var(--em-brand-blue); color:#fff;}
.em-site-quad-cell.is-deep .em-site-quad-btn:hover{background:var(--em-site-accent); border-color:var(--em-site-accent); color:var(--em-brand-blue);}
.em-site-quad-hours{list-style:none; margin:0 0 20px; padding:0; width:100%;}
.em-site-quad-hours li{display:flex; justify-content:space-between; gap:12px; padding:10px 0; font-size:15px; border-bottom:1px solid var(--em-site-flash);}
.em-site-quad-hours li:last-child{border-bottom:0;}
.em-site-quad-hours b{font-weight:700;}
