/* MultiBar 1.9.0 */

/* ===== Шторка меню: заранее нарисована, открытие — только сдвиг на видеокарте ===== */
#side-drawer { will-change: transform; contain: layout paint style; }
#side-drawer.mb-warm { visibility: visible !important; }
#drawer-overlay { will-change: opacity; }

/* ===== Вкладки: скрытые вкладки сохраняют готовую раскладку (content-visibility), вход — плавный (анимация в switchTab) ===== */
.tab-content:not(.active) { display: block !important; content-visibility: hidden; contain-intrinsic-size: 0 0; height: 0 !important; min-height: 0 !important;
  padding: 0 !important; margin: 0 !important; border: 0 !important; box-shadow: none !important; overflow: hidden !important; }
.tab-content.active { animation: none !important; }
body.tabs-loading .tab-content.active { display: none !important; }

/* ===== Производительность: не держим сотни постоянных слоёв видеокарты у позиций заказов и задач
   (will-change на каждой строке давал «Layerize» > 100 мс при входе в «Заказы»). Слой появляется сам на время свайпа. ===== */
.orders-swipe-actions, .task-swipe-actions, .task-card { will-change: auto !important; }

/* ===== Остатки: заголовки категорий не накладываются (каждый «прилипает» внутри своей категории) ===== */
#res-list .res-group { position: relative; }
#res-list .res-group-title { position: sticky; top: 0; z-index: 2; margin-top: 0; background: var(--card) !important; box-shadow: 0 1px 0 var(--border); }
html[data-wallpaper]:not([data-wallpaper="none"]) #res-list .res-group-title { background: var(--card) !important; -webkit-backdrop-filter: none; }
#res-list .res-group { content-visibility: auto; contain-intrinsic-size: auto 400px; }

/* ===== Задачи: свайп — аккуратные кнопки в стиле приложения (вместо двух сплошных цветных блоков) ===== */
.task-swipe-shell { border-radius: 16px; background: transparent; }
.task-swipe-actions { width: 112px; gap: 8px; padding: 0 6px 0 0; box-sizing: border-box; align-items: center !important; justify-content: flex-end; background: transparent; }
.task-swipe-action { width: 46px !important; flex: 0 0 46px !important; height: calc(100% - 14px); min-height: 42px; max-height: 60px; border-radius: 14px; border: 1px solid transparent;
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; font-size: 0; box-shadow: 0 1px 3px rgba(0, 0, 0, .06); transition: transform .15s ease, background .2s ease; }
.task-swipe-action .mb-icon { width: 19px; height: 19px; }
.task-swipe-action:active { transform: scale(.93); filter: none; }
.task-swipe-edit { background: rgba(var(--primary-rgb), .13) !important; color: var(--primary) !important; border-color: rgba(var(--primary-rgb), .22); }
.task-swipe-delete { background: rgba(239, 68, 68, .12) !important; color: #dc2626 !important; border-color: rgba(239, 68, 68, .22); }
[data-theme^="dark"] .task-swipe-delete { color: #f87171 !important; }
.task-swipe-shell.swiped .task-card, .task-card[style*="translateX(-"] { box-shadow: 0 4px 14px rgba(0, 0, 0, .10); }

/* ===== Склад: новая карточка позиции =====
   Шапка — название и итог («2,6 л»), строка свойств — артикул · категория · «Ед», ниже — места в одной спокойной подложке.
   Без цветной полосы слева, пунктиров и сплошных рамок у каждого поля; карточка «приподнята», как задачи и заказы. */
#inv-list { display: flex; flex-direction: column; gap: 10px; padding: 2px 2px 6px; }
#inv-list .inv-item {
  display: flex; flex-direction: column; gap: 8px; position: relative; padding: 12px 12px 10px; border-radius: 18px;
  background: var(--card); border: 1.5px solid var(--i-edge, var(--border));
  box-shadow: var(--i-drop, 0 2px 6px rgba(0, 0, 0, .06)), inset 0 1px 0 var(--i-rim, transparent), inset 0 -1px 0 var(--i-base, transparent);
  content-visibility: auto; contain-intrinsic-size: auto 150px;
}
#inv-list .inv-item-top { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
/* название целиком (до 3 строк); прозрачное поле ввода лежит поверх и проявляется по нажатию */
#inv-list .inv-name { position: relative; flex: 1 1 auto; min-width: 0; }
#inv-list .inv-name-view {
  padding: 3px 0; color: var(--text); font-size: 16px; font-weight: 800; line-height: 1.3; letter-spacing: -.005em; overflow-wrap: anywhere;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;
}
#inv-list .inv-name-view:empty::before { content: 'Название позиции'; opacity: .4; }
#inv-list .inv-item-name {
  position: absolute; top: 0; bottom: 0; left: -6px; right: 0; width: calc(100% + 6px); height: auto; min-height: 0; margin: 0; padding: 0 6px; border: 0; border-radius: 9px;
  background: transparent; color: var(--text); font: inherit; font-size: 16px; font-weight: 800; letter-spacing: -.005em; opacity: 0; outline: none; cursor: text;
}
#inv-list .inv-item-name:focus { opacity: 1; background: linear-gradient(rgba(var(--primary-rgb), .07), rgba(var(--primary-rgb), .07)), var(--card); box-shadow: inset 0 0 0 1.5px rgba(var(--primary-rgb), .5); }
#inv-list .inv-name:focus-within .inv-name-view { visibility: hidden; }
#inv-list .inv-item-name:disabled { cursor: default; }
#inv-list .inv-fact-total {
  flex: 0 0 auto; margin-top: 1px; display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; white-space: nowrap;
  background: rgba(var(--primary-rgb), .12); color: var(--primary); font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; letter-spacing: .01em;
}
#inv-list .inv-fact-total:empty { display: none; }

#inv-list .inv-meta { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; padding: 0; border: 0; font-size: 12px; line-height: 1; }
#inv-list .inv-item-article { flex: 0 0 auto; color: var(--text); opacity: .5; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
#inv-list .inv-cat {
  flex: 0 1 auto; min-width: 0; display: inline-flex; align-items: center; gap: 4px; height: 26px; margin: 0; padding: 0 4px 0 8px; border-radius: 999px;
  background: rgba(var(--primary-rgb), .06); color: var(--text); font-size: 12px; font-weight: 700; opacity: 1; cursor: text;
}
#inv-list .inv-cat .mb-icon { flex: 0 0 auto; opacity: .45; }
#inv-list .inv-cat-in {
  min-width: 0; max-width: 100%; width: auto; height: 22px; margin: 0; padding: 0 4px; border: 0; border-radius: 7px; background: transparent; box-shadow: none;
  color: inherit; font: inherit; font-size: 12px; font-weight: 700; opacity: .8; outline: none; field-sizing: content;
}
#inv-list .inv-cat:focus-within { background: rgba(var(--primary-rgb), .1); box-shadow: inset 0 0 0 1.5px rgba(var(--primary-rgb), .4); }
#inv-list .inv-cat:focus-within .inv-cat-in { opacity: 1; }
/* при вводе — 16px: на iPhone поле не приближается, текст читается */
#inv-list .inv-cat-in:focus { font-size: 16px; }
#inv-list .inv-unit { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 5px; margin-left: auto; }
#inv-list .inv-unit-lbl { opacity: .5; font-weight: 700; }
#inv-list .inv-unit-chip {
  flex: 0 0 auto; width: auto; min-width: 46px; height: 28px; padding: 0 7px 0 10px; gap: 2px; justify-content: center; border-radius: 999px;
  border: 1px solid rgba(var(--primary-rgb), .22); background: rgba(var(--primary-rgb), .08); color: var(--primary); font-size: 13px; font-weight: 800; box-shadow: none;
}
#inv-list .inv-unit-chip span { max-width: 44px; }
#inv-list .inv-unit-chip::after { width: 11px !important; height: 11px !important; flex: 0 0 11px !important; opacity: .75 !important; transition: transform .2s ease; }
#inv-list .inv-unit-chip.is-open::after { transform: rotate(180deg); }
#inv-list .inv-unit-chip:active { transform: scale(.96); }

#inv-list .inv-item-fact-block { display: flex; flex-direction: column; gap: 6px; margin: 2px 0 0; padding: 0; }
#inv-list .inv-item-fact-head { margin: 0 0 -2px 2px; font-size: 11px; font-weight: 700; letter-spacing: .02em; color: var(--text); opacity: .5; }
#inv-list .inv-fact-places { display: flex; flex-direction: column; gap: 0; margin: 0; padding: 2px 6px; border-radius: 14px; background: rgba(var(--primary-rgb), .045); box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), .07); }
#inv-list .inv-fact-places.solid-layout { flex-direction: row; flex-wrap: wrap; gap: 6px; padding: 6px; }

/* строка места: Объём [мл|л] × Кол-во  ✕ */
#inv-list .inv-tare-row { display: flex; align-items: center; gap: 6px; min-width: 0; margin: 0; padding: 6px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
#inv-list .inv-tare-row + .inv-tare-row { border-top: 1px solid rgba(var(--primary-rgb), .09); }
#inv-list .inv-tare-row input, #inv-list .inv-place-badge input {
  height: 38px; margin: 0; padding: 0 6px; border: 0; border-radius: 10px; background: var(--card); box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), .14);
  color: var(--text); font: inherit; font-size: 15px; font-weight: 700; font-variant-numeric: tabular-nums; text-align: center; outline: none; -moz-appearance: textfield;
  transition: box-shadow .15s ease;
}
#inv-list .inv-tare-row input::-webkit-outer-spin-button, #inv-list .inv-tare-row input::-webkit-inner-spin-button,
#inv-list .inv-place-badge input::-webkit-outer-spin-button, #inv-list .inv-place-badge input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
#inv-list .inv-tare-row input::placeholder, #inv-list .inv-place-badge input::placeholder { color: var(--text); opacity: .35; font-size: 13px; font-weight: 600; }
#inv-list .inv-tare-row input:focus, #inv-list .inv-place-badge input:focus { box-shadow: inset 0 0 0 1.5px var(--primary), 0 0 0 3px rgba(var(--primary-rgb), .14); }
#inv-list .inv-tare-row .vol-part { flex: 1 1 60px; width: auto; min-width: 0; }
#inv-list .inv-tare-row .qty-part { flex: 1 1 52px; width: auto; min-width: 0; }
#inv-list .inv-x { flex: 0 0 auto; color: var(--text); opacity: .4; font-size: 15px; font-weight: 600; line-height: 1; }

/* переключатель единицы строки — как сегменты iOS: светлая «таблетка» на тонированной дорожке */
#inv-list .u-seg { flex: 0 0 auto; display: inline-flex; gap: 2px; padding: 2px; border: 0; border-radius: 11px; background: rgba(var(--primary-rgb), .10); }
#inv-list .u-seg-b {
  min-width: 30px; height: 34px; padding: 0 6px; border: 0; border-radius: 9px; background: transparent; color: var(--text); opacity: .6;
  font: inherit; font-size: 12.5px; font-weight: 800; cursor: pointer; transition: background-color .18s ease, color .18s ease, box-shadow .18s ease, opacity .18s ease;
}
#inv-list .u-seg-b.on { background: var(--card); color: var(--primary); opacity: 1; box-shadow: 0 1px 3px rgba(0, 0, 0, .12), 0 0 0 .5px rgba(var(--primary-rgb), .18); }
#inv-list .u-seg-b:disabled { cursor: default; }
[data-theme^="dark"] #inv-list .u-seg-b.on { background: rgba(var(--primary-rgb), .32); color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .3); }

#inv-list .inv-fact-del {
  flex: 0 0 auto; width: 32px; height: 32px; margin: 0 -2px 0 0; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--text); opacity: .4;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: background-color .15s ease, color .15s ease, opacity .15s ease;
}
#inv-list .inv-fact-del:active:not(:disabled) { background: rgba(239, 68, 68, .12); color: #ef4444; opacity: 1; }
@media (hover: hover) { #inv-list .inv-fact-del:hover:not(:disabled) { background: rgba(239, 68, 68, .10); color: #ef4444; opacity: 1; } }
#inv-list .inv-fact-del:disabled { opacity: .18; cursor: default; }

/* штучные позиции: компактные «таблетки» */
#inv-list .inv-place-badge { display: inline-flex; align-items: center; gap: 2px; padding: 3px 3px 3px 3px; border: 0; border-radius: 12px; background: var(--card); box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), .12); overflow: visible; }
#inv-list .inv-place-badge input { width: 70px; height: 34px; box-shadow: none; background: transparent; }
#inv-list .inv-place-badge input:focus { box-shadow: inset 0 0 0 1.5px var(--primary); }
#inv-list .inv-place-badge .inv-fact-del { width: 28px; height: 28px; border-left: 0; }

#inv-list .inv-fact-footer { display: flex; align-items: center; justify-content: flex-start; gap: 8px; margin: 0; width: auto; }
#inv-list .inv-fact-add {
  display: inline-flex; align-items: center; gap: 5px; height: 32px; padding: 0 12px 0 9px; border: 0; border-radius: 10px;
  background: rgba(var(--primary-rgb), .10); color: var(--primary); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; -webkit-appearance: none;
  transition: background-color .15s ease, transform .12s ease;
}
#inv-list .inv-fact-add:active:not(:disabled) { transform: scale(.96); background: rgba(var(--primary-rgb), .16); }
#inv-list .inv-fact-add[hidden] { display: none; }
#inv-list .inv-fact-add:disabled { opacity: .45; cursor: default; }

/* только просмотр: поля без подложки, чтобы не казались доступными */
#inv-list .inv-item[data-readonly="true"] .inv-cat { background: transparent; padding-left: 0; }
#inv-list .inv-item input:disabled { opacity: .8; -webkit-text-fill-color: var(--text); }
#inv-list .inv-item[data-readonly="true"] .inv-unit-chip { opacity: .7; }

/* ===== «Инвентаризация / Посуда»: ползунок едет за пальцем; подпись белеет, когда ползунок под ней ===== */
.inv-seg.has-seg-ind button.seg-hot { color: #fff !important; opacity: 1 !important; }
.inv-seg.has-seg-ind button.on.seg-cold { color: var(--text) !important; opacity: .75 !important; }

/* ===== Графики / Табель: удаление месяцев — сетка месяцев по годам ===== */
.mr-sheet { max-height: min(86vh, 720px); max-height: min(86dvh, 720px); display: flex; flex-direction: column; }
.mr-years { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; margin: 4px -4px 0; padding: 0 4px 4px; display: flex; flex-direction: column; gap: 12px; }
.mr-yt { margin: 0 0 6px 2px; font-size: 12px; font-weight: 800; letter-spacing: .04em; opacity: .55; }
.mr-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.mr-m {
  position: relative; height: 40px; border: 1px solid var(--border); border-radius: 12px; background: var(--card); color: var(--text);
  font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .12s ease;
}
.mr-m:active { transform: scale(.96); }
.mr-m.now { border-color: rgba(var(--primary-rgb), .55); }
.mr-m i { position: absolute; left: 50%; bottom: 5px; width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%; background: transparent; }
.mr-m.has i { background: var(--primary); }
.mr-m.sel { background: rgba(239, 68, 68, .10); border-color: rgba(239, 68, 68, .35); color: #dc2626; }
.mr-m.sel.end { background: #ef4444; border-color: #ef4444; color: #fff; }
.mr-m.sel.has i { background: currentColor; }
[data-theme^="dark"] .mr-m.sel:not(.end) { color: #fca5a5; }
.mr-sum { margin: 10px 2px 2px; min-height: 36px; font-size: 13px; line-height: 1.35; display: flex; flex-direction: column; justify-content: center; opacity: .9; }
.mr-sum b { font-weight: 800; }
.mr-sum span { opacity: .7; font-size: 12px; }
.mr-ok:not(:disabled) { background: #ef4444 !important; border-color: #ef4444 !important; color: #fff !important; }

/* месяц без своего документа: показан состав прошлого месяца */
.sch-inh { position: sticky; left: 0; z-index: 3; display: flex; align-items: flex-start; gap: 8px; margin: 0 0 8px; padding: 9px 12px; border-radius: 12px;
  background: rgba(var(--primary-rgb), .08); border: 1px solid rgba(var(--primary-rgb), .18); color: var(--text); font-size: 12.5px; line-height: 1.35; box-sizing: border-box; width: 100%; max-width: calc(100vw - 24px); }
.sch-inh .mb-icon { flex: 0 0 auto; margin-top: 1px; color: var(--primary); }

/* ===== Списания: аккуратные карточки без сплошных цветных полос =====
   Месяц — карточка с мягкой шапкой; недели — тонкие разделители и счётчик; день — приподнятая карточка (как задачи и заказы)
   со счётчиком позиций; позиция — светлая плитка без полосок по краям. */
#writeoffs .wo-month-block { border: 1px solid var(--i-edge, var(--border)); border-radius: 18px; background: var(--card); box-shadow: var(--i-drop, none); overflow: hidden; }
#writeoffs .wo-month-title { padding: 12px 16px 10px; font-size: 15px; font-weight: 800; letter-spacing: -.005em; color: var(--primary); border-bottom: 1px solid rgba(var(--primary-rgb), .10);
  background: linear-gradient(180deg, rgba(var(--primary-rgb), .08), rgba(var(--primary-rgb), .03)); }
#writeoffs .wo-week-block { border-top: 1px solid rgba(var(--primary-rgb), .08); }
#writeoffs .wo-week-block:first-of-type { border-top: 0; }
#writeoffs .wo-week-head { padding: 12px 14px 12px 16px; gap: 10px; font-size: 14px; font-weight: 700; }
#writeoffs .wo-week-label { flex: 1 1 auto; min-width: 0; }
.wo-week-n, .wo-day-n {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 7px; border-radius: 999px;
  background: rgba(var(--primary-rgb), .10); color: var(--primary); font-size: 11.5px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1;
}
#writeoffs .wo-week-body { padding: 4px 12px 14px; gap: 10px; scroll-padding-left: 12px; }
#writeoffs .wo-day-block {
  border: 1px solid var(--i-edge, var(--border)) !important; border-radius: 16px !important; background: var(--card) !important;
  box-shadow: var(--i-drop, 0 2px 6px rgba(0, 0, 0, .06)), inset 0 1px 0 var(--i-rim, transparent) !important; width: min(60vw, 220px);
}
#writeoffs .wo-day-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 10px 6px 12px; font-size: 12.5px; font-weight: 800;
  letter-spacing: .01em; color: var(--text); background: transparent !important; border-bottom: 0 !important; }
#writeoffs .wo-day-title > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
#writeoffs .wo-day-n { height: 18px; min-width: 20px; font-size: 11px; padding: 0 6px; }
#writeoffs .wo-day-items { display: flex; flex-direction: column; gap: 6px; padding: 2px 8px 8px; background: transparent; }
#writeoffs .wo-day-block .wo-item {
  padding: 8px 4px 8px 10px !important; border: 0 !important; border-radius: 12px !important;
  background: rgba(var(--primary-rgb), .05) !important; box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), .08) !important;
}
#writeoffs .wo-day-block .wo-item.editing { box-shadow: inset 0 0 0 1.5px var(--primary) !important; background: rgba(var(--primary-rgb), .09) !important; }
#writeoffs .wo-day-block .wo-item-name { font-size: 12.5px; font-weight: 700; line-height: 1.3; white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; overflow-wrap: anywhere; }
#writeoffs .wo-day-block .wo-item-meta { margin-top: 5px; gap: 4px; font-size: 10.5px; }
#writeoffs .wo-day-block .task-chip { font-size: 10.5px; padding: 2px 7px; border-radius: 999px; border: 0; background: var(--card); box-shadow: inset 0 0 0 1px rgba(var(--primary-rgb), .12); color: var(--text); opacity: .85; }
#writeoffs .wo-day-block .wo-item-note { margin-top: 5px; font-size: 11px; line-height: 1.3; opacity: .7; }
#writeoffs .wo-day-block .wo-item-actions { min-width: 0 !important; }
#writeoffs .wo-day-block .wo-item-more { width: 30px; height: 30px; min-width: 30px; flex: 0 0 30px; border: 0; border-radius: 50%; background: transparent; color: var(--text); opacity: .55; }
#writeoffs .wo-day-block .wo-item-more:active { background: rgba(var(--primary-rgb), .14); opacity: 1; }
@media (min-width: 900px) { #writeoffs .wo-day-block { width: 260px; } }

/* ===== Сворачиваемые карточки («Шаблоны», «Новое списание», «Сессия инвентаризации»): стрелка поворачивается сразу ===== */
.collapsible-card.is-closing .collapsible-card-chevron { transform: rotate(-90deg); }
.collapsible-card-toggle .collapsible-card-chevron { transition: transform .24s cubic-bezier(.4, 0, .2, 1); }

/* ===== Шрифт приложения: один стандарт =====
   Семейство задаётся одной переменной --mb-font (html[data-font] выставляет скрипт в <head> до первой отрисовки).
   Кнопки, поля ввода, списки и таблицы наследуют его — по умолчанию браузер рисует их своим шрифтом (например, Arial). */
:root { --mb-font-sys: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif; --mb-font: var(--mb-font-sys); }
html[data-font="inter"] { --mb-font: 'MB Inter', var(--mb-font-sys); }
html[data-font="golos"] { --mb-font: 'MB Golos', var(--mb-font-sys); }
html[data-font="onest"] { --mb-font: 'MB Onest', var(--mb-font-sys); }
html[data-font="manrope"] { --mb-font: 'MB Manrope', var(--mb-font-sys); }
html[data-font="montserrat"] { --mb-font: 'MB Montserrat', var(--mb-font-sys); }
html[data-font="nunito"] { --mb-font: 'MB Nunito', var(--mb-font-sys); }
html[data-font="rubik"] { --mb-font: 'MB Rubik', var(--mb-font-sys); }
html, body { font-family: var(--mb-font); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
button, input, select, textarea, optgroup, .btn-main, .custom-select-trigger, .custom-select-option, .mb-sheet-item, table { font-family: inherit; }
input::placeholder, textarea::placeholder { font-family: inherit; }

/* выбор шрифта во «Внешнем виде» */
.appearance-fonts { display: flex; flex-direction: column; gap: 10px; }
.font-preview { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border-radius: 14px; background: rgba(var(--primary-rgb), .06); border: 1px solid rgba(var(--primary-rgb), .14); }
.font-preview b { font-size: 16px; font-weight: 800; letter-spacing: -.005em; }
.font-preview span { font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.font-preview small { font-size: 12px; opacity: .6; font-weight: 500; }
.font-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.font-opt {
  position: relative; display: grid; grid-template-columns: auto 1fr; grid-template-rows: auto auto; column-gap: 10px; row-gap: 1px; align-items: center; text-align: left;
  min-height: 58px; padding: 9px 12px; border-radius: 14px; border: 1.5px solid var(--border); background: var(--card); color: var(--text); cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.font-opt:active { transform: scale(.98); }
.font-opt.active { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .16); }
.font-opt-aa { grid-row: 1 / span 2; font-size: 24px; font-weight: 700; line-height: 1; color: var(--primary); min-width: 34px; }
.font-opt-name { font-size: 14px; font-weight: 800; line-height: 1.2; align-self: end; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.font-opt small { font-size: 11px; opacity: .6; font-weight: 600; align-self: start; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.font-opt.active::after { content: ''; position: absolute; top: 8px; right: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--primary); }
#appearance-font-value { margin-left: auto; font-size: 12px; font-weight: 800; color: var(--primary); }

/* ===== Учётные записи: отдельный экран на весь экран, права — следующий экран, шаблоны ролей ===== */
#account-admin-overlay { z-index: 12500; }
#account-permission-overlay { z-index: 12600; }
.acc-screen { display: flex; flex-direction: column; }
.acc-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; padding: 12px 14px calc(20px + env(safe-area-inset-bottom)); }
.acc-actions { flex: 0 0 auto; display: flex; gap: 10px; padding: 10px 14px calc(10px + env(safe-area-inset-bottom)); border-top: 1px solid var(--border); background: var(--card); }
.acc-actions .btn-main { flex: 1 1 0; min-width: 0; margin: 0; }
#account-permission-editor.overlay-body { max-height: none !important; overflow: visible !important; padding: 0 !important; }
.acc-note { display: flex; align-items: flex-start; gap: 8px; margin: 0 0 12px; padding: 10px 12px; border-radius: 14px; background: rgba(var(--primary-rgb), .07); border: 1px solid rgba(var(--primary-rgb), .16); font-size: 12.5px; line-height: 1.4; }
.acc-note .mb-icon { flex: 0 0 auto; margin-top: 1px; color: var(--primary); }
#account-admin-overlay .acc-tools { background: var(--bg); top: -12px; padding-top: 8px; margin-top: -8px; }
#account-admin-overlay .acc-search { background: var(--card); }
#account-admin-overlay .acc-row { background: var(--card); border: 1px solid var(--i-edge, var(--border)); box-shadow: var(--i-drop, none); padding: 10px 12px; }
.acc-go { display: inline-flex; align-items: center; }
.acc-chip.own { background: rgba(var(--primary-rgb), .14); color: var(--primary); }
.acc-role { display: inline-flex; align-items: center; gap: 3px; padding: 1px 7px 1px 5px; border-radius: 999px; background: rgba(var(--primary-rgb), .12); color: var(--primary); font-weight: 800; font-size: 10.5px; }
.acc-role .mb-icon { width: 11px; height: 11px; }
/* шаблоны ролей */
.acc-roles { margin: 18px 0 0; padding: 14px; border-radius: 18px; background: var(--card); border: 1px solid var(--i-edge, var(--border)); box-shadow: var(--i-drop, none); }
.acc-roles-head { display: flex; align-items: flex-start; gap: 12px; }
.acc-roles-head > div { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.acc-roles-head b { font-size: 15px; font-weight: 800; }
.acc-roles-head small { font-size: 12px; line-height: 1.35; opacity: .65; }
.acc-roles-add { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 4px; height: 34px; padding: 0 12px 0 9px; border: 0; border-radius: 11px; background: rgba(var(--primary-rgb), .12); color: var(--primary); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.acc-roles-add:active, .acc-preset:active, .acc-role-row:active { transform: scale(.97); }
.acc-roles-empty { margin: 12px 0 8px; font-size: 13px; opacity: .75; }
.acc-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.acc-preset { display: inline-flex; align-items: center; gap: 4px; height: 34px; padding: 0 12px 0 9px; border-radius: 999px; border: 1.5px dashed rgba(var(--primary-rgb), .45); background: transparent; color: var(--primary); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; }
.acc-role-list { display: flex; flex-direction: column; gap: 6px; margin-top: 12px; }
.acc-role-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 10px 10px 12px; border-radius: 14px; border: 1px solid var(--border); background: var(--bg); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.acc-role-ico { flex: 0 0 auto; width: 34px; height: 34px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: rgba(var(--primary-rgb), .12); color: var(--primary); }
.acc-role-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.acc-role-main b { font-size: 14px; font-weight: 800; }
.acc-role-main small { font-size: 11.5px; opacity: .6; }
/* выбор роли в правах учётной записи */
.ap-role { margin: 12px 0 4px; padding: 12px; border-radius: 16px; background: rgba(var(--primary-rgb), .06); border: 1px solid rgba(var(--primary-rgb), .16); }
.ap-role-title { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; }
.ap-role-title b { font-size: 14px; font-weight: 800; }
.ap-role-title small { font-size: 12px; opacity: .65; line-height: 1.35; }
.ap-role-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.ap-role-chip { display: inline-flex; align-items: center; gap: 5px; height: 36px; padding: 0 13px; border-radius: 999px; border: 1.5px solid var(--border); background: var(--card); color: var(--text); font: inherit; font-size: 13px; font-weight: 800; cursor: pointer; transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
.ap-role-chip .mb-icon { width: 14px; height: 14px; opacity: .8; }
.ap-role-chip.on { background: var(--primary); border-color: var(--primary); color: #fff; }
.ap-role-name { display: flex; flex-direction: column; gap: 6px; margin: 4px 0 6px; font-size: 13px; font-weight: 800; }
.ap-role-name input { height: 46px; padding: 0 14px; border-radius: 14px; border: 1.5px solid var(--border); background: var(--card); color: var(--text); font: inherit; font-size: 16px; font-weight: 700; outline: none; }
.ap-role-name input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .14); }
.chat-head-btn.ap-del { color: #ef4444; }
.chat-head-btn.ap-del[hidden] { display: none; }

/* ===== Кнопка «Фото» в шапке и шторка «Что сделать с фото?» ===== */
#header-photo-btn svg { width: 22px; height: 22px; stroke: var(--primary); }
.ph-sheet { max-height: min(90vh, 760px); max-height: min(90dvh, 760px); display: flex; flex-direction: column; }
.ph-preview { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; margin: -2px 0 12px; border-radius: 16px; overflow: hidden; background: rgba(var(--primary-rgb), .06); min-height: 120px; }
.ph-preview img { display: block; width: 100%; max-height: 32vh; max-height: 32dvh; object-fit: cover; }
.ph-list { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.ph-act, .ph-pick { display: flex; align-items: center; gap: 12px; width: 100%; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--border); background: var(--card); color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: transform .12s ease, background-color .15s ease; }
.ph-act:active, .ph-pick:active { transform: scale(.98); background: rgba(var(--primary-rgb), .08); }
.ph-pick[hidden] { display: none; }
.ph-pick-ico { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: rgba(var(--primary-rgb), .12); color: var(--primary); }
.ph-pick-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ph-pick-t b { font-size: 14.5px; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ph-pick-t small { font-size: 12px; opacity: .62; line-height: 1.3; }
.ph-search { width: 100%; box-sizing: border-box; height: 42px; margin: 8px 0 0; padding: 0 14px; border-radius: 12px; border: 1.5px solid var(--border); background: var(--bg); color: var(--text); font: inherit; font-size: 16px; outline: none; }
.ph-empty { padding: 18px 4px; text-align: center; opacity: .6; font-size: 13px; }
.ph-sheet .sch-sheet-a .btn-main { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
/* в узкой шапке с кнопкой «Фото» имя аккаунта не помещается — оставляем значок сохранения и часы (имя — в меню) */
@media (max-width: 430px) { body:has(#header-photo-btn:not([hidden])) .header-status-user { display: none !important; } }

/* ===== Поддержка: понятно, куда приходит сообщение; способ связи и ссылка — прямо на экране ===== */
.sp-info { display: flex; align-items: flex-start; gap: 8px; margin: 10px 14px 0; padding: 10px 12px; border-radius: 14px; background: rgba(var(--primary-rgb), .07); border: 1px solid rgba(var(--primary-rgb), .16); font-size: 13px; line-height: 1.4; }
.sp-info[hidden] { display: none; }
.sp-info .mb-icon { flex: 0 0 auto; margin-top: 1px; color: var(--primary); }
.sp-link a { gap: 8px !important; }
.sp-link a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp-setup { margin: 0 0 14px; border-radius: 18px; background: var(--card); border: 1px solid var(--i-edge, var(--border)); box-shadow: var(--i-drop, none); overflow: hidden; }
.sp-setup-head { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px 14px; border: 0; background: transparent; color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.sp-setup-ico { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; background: rgba(var(--primary-rgb), .12); color: var(--primary); }
.sp-setup-t { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sp-setup-t b { font-size: 15px; font-weight: 800; }
.sp-setup-t small { font-size: 12px; opacity: .65; line-height: 1.3; }
.sp-setup-chev { flex: 0 0 auto; opacity: .5; transition: transform .2s ease; display: inline-flex; }
.sp-setup.open .sp-setup-chev { transform: rotate(180deg); }
.sp-setup-body { padding: 0 14px 14px; display: flex; flex-direction: column; gap: 10px; }
.sp-modes { display: flex; flex-direction: column; gap: 6px; }
.sp-mode { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 10px 12px; border-radius: 14px; border: 1.5px solid var(--border); background: var(--bg); color: var(--text); font: inherit; text-align: left; cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
.sp-mode i { flex: 0 0 auto; width: 18px; height: 18px; margin-top: 1px; border-radius: 50%; border: 2px solid var(--border); box-sizing: border-box; transition: border-color .15s ease, box-shadow .15s ease; }
.sp-mode span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.sp-mode b { font-size: 14px; font-weight: 800; }
.sp-mode small { font-size: 12px; opacity: .65; line-height: 1.35; }
.sp-mode.on { border-color: var(--primary); background: rgba(var(--primary-rgb), .07); }
.sp-mode.on i { border-color: var(--primary); box-shadow: inset 0 0 0 3.5px var(--card), inset 0 0 0 10px var(--primary); }
.sp-link-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 800; }
.sp-link-field[hidden] { display: none; }
.sp-link-field input { height: 46px; padding: 0 14px; border-radius: 14px; border: 1.5px solid var(--border); background: var(--bg); color: var(--text); font: inherit; font-size: 16px; font-weight: 600; outline: none; }
.sp-link-field input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .14); }
.sp-link-field small { font-size: 11.5px; font-weight: 600; opacity: .6; }
.sp-preview { display: flex; flex-direction: column; gap: 6px; padding: 10px 12px; border-radius: 14px; background: rgba(var(--primary-rgb), .04); border: 1px dashed rgba(var(--primary-rgb), .3); }
.sp-preview > small { font-size: 11.5px; font-weight: 800; opacity: .6; }
.sp-pv-row { display: flex; align-items: center; gap: 8px; font-size: 12.5px; opacity: .85; }
.sp-pv-row.warn { color: #d97706; opacity: 1; }
.sp-pv-link { padding: 0 !important; }
.sp-setup-a .btn-main { width: 100%; margin: 0; }
.sp-sec-title { margin: 4px 2px 8px; font-size: 12px; font-weight: 800; letter-spacing: .02em; opacity: .6; text-transform: uppercase; }
.sp-empty { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border-radius: 14px; border: 1px dashed var(--border); font-size: 13px; line-height: 1.4; opacity: .8; }
.sp-empty .mb-icon { flex: 0 0 auto; opacity: .6; }
.sp-compose[hidden], .sp-link[hidden] { display: none !important; }

/* поиск в истории списаний — как остальные поля ввода (16px) */
#writeoffs .tasks-toolbar input { font-size: 16px; }
#confirm-message{white-space:pre-line;overflow-wrap:anywhere}

/* 1.9.2: при открытой шторке меню приложение на фоне почти не видно (раньше просвечивали шапка, поиск и вкладки) */
#drawer-overlay { background: rgba(7, 9, 18, .88); }

/* 1.9.2: переименование поставщика в каталоге заказов */
.oa-name-edit { display: flex; align-items: center; gap: 8px; margin: 2px 0 10px; }
.oa-name-edit input { flex: 1 1 auto; min-width: 0; font-size: 16px; padding: 9px 12px; border-radius: 12px; border: 1px solid var(--border); background: var(--input-bg, var(--card)); color: var(--text); }
.oa-name-edit .oa-name-ok { flex: 0 0 auto; border: 0; border-radius: 12px; padding: 10px 14px; font: inherit; font-size: 13px; font-weight: 700; background: var(--primary); color: #fff; }
.oa-name-edit .oa-name-ok[hidden] { display: none; }

/* 1.9.2: кнопка «Чаты» в шапке + компактная шапка на узких экранах */
#header-chat-btn{position:relative}
.header-chat-badge{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:#e53935;color:#fff;font-size:10px;font-weight:700;line-height:16px;text-align:center;box-sizing:border-box;pointer-events:none}
.header-chat-badge[hidden]{display:none}
.header-title-row h1{flex:0 1 auto;min-width:0;overflow:hidden}
.header-title-row .header-history-btn{flex:0 1 auto;min-width:28px}
@media (max-width:430px){
  .header-title-row{gap:5px!important}
  .header-title-row .header-history-btn{width:34px!important;height:32px}
  .header-title-row h1{font-size:15px}
  .header-status-cluster{max-width:none;flex:0 0 auto;overflow:visible;gap:4px!important}
  .header-status-user{display:none!important}
}
@media (max-width:350px){
  .header-title-row{gap:4px!important}
  .header-title-row .header-history-btn{width:30px!important}
  .header-title-row h1{font-size:13px}
}

/* 1.9.2: сворачиваемые карточки настроек */
.settings-card[data-collapsible] > .settings-card-title.sc-head{position:relative;cursor:pointer;padding-right:30px;margin-bottom:0;-webkit-tap-highlight-color:transparent}
.settings-card[data-collapsible] > .sc-body{margin-top:10px}
.settings-card[data-collapsible].is-collapsed > .sc-body{display:none}
.sc-chev{position:absolute;right:0;top:50%;margin-top:-9px;display:inline-flex;transition:transform .22s ease;opacity:.7}
.settings-card[data-collapsible].is-collapsed > .sc-head .sc-chev{transform:rotate(-90deg)}
.settings-card[data-collapsible].is-closing > .sc-head .sc-chev{transform:rotate(-90deg)}
/* Использование Firebase */
.fb-meters{display:grid;gap:12px}
.fb-top{display:flex;justify-content:space-between;gap:10px;align-items:baseline;font-size:13px}
.fb-top span{opacity:.75;font-variant-numeric:tabular-nums;font-size:12px}
.fb-bar{height:8px;border-radius:6px;background:rgba(127,127,127,.2);margin:6px 0 4px;overflow:hidden}
.fb-bar i{display:block;height:100%;border-radius:6px;background:#2ea05a;transition:width .3s ease}
.fb-meter.warn .fb-bar i{background:#e0a020}.fb-meter.bad .fb-bar i{background:#e04646}
.fb-meter small{font-size:12px;opacity:.8}.fb-meter.bad small{color:#e04646;opacity:1}
.fb-hist{margin-top:12px;font-size:12px;font-variant-numeric:tabular-nums}
.fb-hist > div{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:6px;padding:4px 0;border-top:1px solid var(--border)}
.fb-hist .fb-hist-h{opacity:.6;border-top:0}
.fb-note{font-size:12px;opacity:.7;line-height:1.4;margin:12px 0 8px}
.fb-actions{display:flex;gap:8px;flex-wrap:wrap}.fb-actions .settings-wide-btn{flex:1 1 130px;justify-content:center}

/* 1.9.2: «Уведомления и разрешения» — группы, одинаковые переключатели и строки проверки */
#notify-card-body .np-group{margin-bottom:14px}#notify-card-body .np-group:last-child{margin-bottom:0}
#notify-card-body .np-h{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:.55;margin:0 0 6px}
#notify-card-body .np-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 2px;border-top:1px solid var(--border)}
#notify-card-body .np-h + .np-row{border-top:0}
#notify-card-body .np-row > span{display:flex;flex-direction:column;gap:3px;min-width:0}
#notify-card-body .np-row b{font-size:14px}#notify-card-body .np-row small{font-size:12px;opacity:.65}
#notify-card-body .np-chip{font-style:normal;font-size:12px;opacity:.65}#notify-card-body .np-chip.ok{color:#2ea05a;opacity:1}#notify-card-body .np-chip.bad{color:#e04646;opacity:1}
#notify-card-body .np-btn{flex:0 0 auto;border:1px solid var(--border);background:var(--card);color:inherit;border-radius:10px;padding:8px 14px;font:inherit;font-size:13px;font-weight:600}
#notify-card-body .np-btn:disabled{opacity:.5}
#notify-card-body .mb-switch-row{border-top:1px solid var(--border)}#notify-card-body .np-h + .mb-switch-row{border-top:0}

/* 1.9.2: шрифты — одна кнопка, список по нажатию */
.font-toggle{display:flex;align-items:center;gap:10px;width:100%;margin:10px 0 0;padding:12px 14px;border-radius:14px;border:1px solid var(--border);background:var(--card);color:inherit;font:inherit;text-align:left}
.font-toggle > span{opacity:.65;font-size:13px}.font-toggle > b{flex:1 1 auto;font-size:15px;text-align:right;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.font-toggle > i{display:inline-flex;transition:transform .2s ease;opacity:.7}.font-toggle.open > i{transform:rotate(180deg)}
.font-grid[hidden]{display:none}
.font-grid{margin-top:10px}

/* 1.9.2: недели списаний — анимация без перерисовки всего списка и с изоляцией слоя */
.wo-week-body.wo-anim{contain:layout paint style;will-change:height,opacity}
#chat-list .chat-support-row{border:1px solid var(--border);border-radius:16px;margin:0 0 8px;background:rgb(var(--card-rgb));overflow:hidden;box-shadow:0 1px 4px rgba(0,0,0,.12)}
#chat-list .chat-support-row .chat-li{background-color:rgb(var(--card-rgb))!important;border-radius:0;margin:0!important}

/* 1.9.3: панель поставщика — два блока друг под другом (раньше подпись «Минимальная сумма» сжималась в столбик) */
.oa-row.oa-row-sup .oa-row-panel-in.oa-col{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:12px}
.oa-row.oa-row-sup .oa-blk{display:flex;flex-direction:column;gap:6px;min-width:0;width:100%}
.oa-row.oa-row-sup .oa-blk-min{flex-direction:row;align-items:center;justify-content:space-between;gap:12px}
.oa-row.oa-row-sup .oa-blk .oa-row-cap{flex:0 0 auto;font-size:12px;opacity:.65;white-space:normal;writing-mode:horizontal-tb}
.oa-row.oa-row-sup .oa-blk-min .oa-row-cap{flex:1 1 auto;font-size:13px}
.oa-row.oa-row-sup .oa-name-edit{margin:0;width:100%}
.oa-row.oa-row-sup .oa-name-edit input{width:100%;box-sizing:border-box;height:42px}
.oa-row.oa-row-sup .oa-money{flex:0 0 136px;width:136px!important}

/* ===== 1.9.3: редактор этикеток ===== */
.lbe-overlay{z-index:9470}
.lbe-head .lbe-save{flex:0 0 auto;border:0;border-radius:12px;padding:9px 14px;margin-left:4px;font:inherit;font-size:14px;font-weight:700;background:var(--primary);color:#fff}
.lbe-head .chat-head-btn:disabled{opacity:.35}
.lbe-body{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:12px 14px calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:12px}
.lbe-stage-wrap{position:sticky;top:-12px;z-index:3;margin:0 -14px;padding:8px 14px;background:var(--bg);border-bottom:1px solid var(--border)}
.lbe-stage{position:relative;width:100%;max-width:520px;margin:0 auto;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.28);touch-action:none;user-select:none;-webkit-user-select:none;max-height:46vh; max-height:46dvh}
.lbe-stage canvas{display:block;width:100%;height:100%;image-rendering:pixelated;pointer-events:none}
.lbe-ov{position:absolute;inset:0;pointer-events:none}
.lbe-box{position:absolute;box-sizing:border-box;border:1px dashed rgba(37,99,235,.45);pointer-events:none}
.lbe-box.empty{border-color:rgba(220,70,70,.5)}
.lbe-box.sel{border:1.5px solid #2563eb;background:rgba(37,99,235,.08)}
.lbe-h{position:absolute;right:-9px;bottom:-9px;width:22px;height:22px;border-radius:50%;background:#2563eb;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.4);pointer-events:auto;touch-action:none}
.lbe-guide{position:absolute;background:rgba(236,72,153,.85);pointer-events:none}
.lbe-guide.v{top:0;bottom:0;width:1px}.lbe-guide.h{left:0;right:0;height:1px}
.lbe-hint{font-size:12px;opacity:.6;text-align:center;margin-top:-4px}
.lbe-add{display:flex;flex-wrap:wrap;gap:8px}
.lbe-add .lb-addb{display:inline-flex;align-items:center;gap:6px}
.lbe-layers{display:flex;gap:6px;overflow-x:auto;padding-bottom:2px;-webkit-overflow-scrolling:touch}
.lbe-layers:empty{display:none}
.lbe-lay{flex:0 0 auto;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:6px 12px;border-radius:999px;border:1px solid var(--border);background:var(--card);color:inherit;font:inherit;font-size:13px}
.lbe-lay.on{background:var(--primary);border-color:var(--primary);color:#fff}
.lbe-panel{display:flex;flex-direction:column;gap:10px;padding:12px;border-radius:16px;border:1px solid var(--border);background:var(--card)}
.lbe-empty{font-size:13px;opacity:.65;text-align:center;padding:10px 4px}
.lbe-ptitle{font-size:14px}
.lbe-panel textarea,.lbe-panel input[type=text]{width:100%;box-sizing:border-box;padding:10px 12px;border-radius:12px;border:1px solid var(--border);background:var(--bg);color:inherit;font:inherit;font-size:16px;resize:vertical}
.lbe-row{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.lbe-n{display:flex;flex-direction:column;gap:4px;flex:1 1 90px;min-width:0;font-size:12px}
.lbe-n > span:first-child{opacity:.65}
.lbe-n input,.lbe-n select{width:100%;box-sizing:border-box;height:40px;padding:0 10px;border-radius:10px;border:1px solid var(--border);background:var(--bg);color:inherit;font:inherit;font-size:15px}
.lbe-step{display:flex;gap:4px}.lbe-step input{text-align:center;flex:1 1 auto;min-width:0}
.lbe-step button{flex:0 0 40px;height:40px;border-radius:10px;border:1px solid var(--border);background:var(--card);color:inherit;font-size:20px;line-height:1}
.lbe-tgs{align-items:center}
.lbe-tg{min-width:40px;height:40px;padding:0 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg);color:inherit;font:inherit;font-size:14px;display:inline-flex;align-items:center;justify-content:center}
.lbe-tg.on{background:var(--primary);border-color:var(--primary);color:#fff}
.lbe-sep{flex:1 1 auto}
.lbe-vars{display:flex;flex-wrap:wrap;gap:6px}
.lbe-vars button{padding:5px 10px;border-radius:999px;border:1px dashed var(--border);background:transparent;color:inherit;font:inherit;font-size:12px}
.lbe-acts{display:flex;flex-wrap:wrap;gap:8px}
.lbe-acts button{display:inline-flex;align-items:center;gap:5px;padding:9px 12px;border-radius:10px;border:1px solid var(--border);background:var(--bg);color:inherit;font:inherit;font-size:13px}
.lbe-acts button.danger{color:#e04646;border-color:rgba(224,70,70,.4)}

/* ===== 1.9.3: вторая страница вкладок ===== */
.tabs-drawer-btn.tabs-p2-btn{margin-top:2px}
/* экран страницы 2 между шапкой и нижней панелью */
.nkl-overlay.mb-as-tab{z-index:7500!important;border-radius:0}
.nkl-overlay.mb-as-tab.open{height:var(--p2h)!important}
.nkl-overlay.mb-as-tab .nkl-header > .chat-head-btn:first-child{display:none}
.nkl-overlay.mb-as-tab .nkl-header{padding-left:16px}
body.mb-p2-open .container{display:none}
.tabs .tab-btn[hidden]{display:none!important}
