/* ======================================================================
   Стиль клиентского кабинета «Атлас» (ПАКЕТ 9, вариант A «Светлый»).

   Цвета — токены --atlas-* из файла цветов «Атлас» (_tokeny_atlas.css,
   решение руководителя 24.10.2026): своей палитры этот файл не заводит.
   Кабинет ВСЕГДА светлый — тему телефона и Telegram не наследует (у
   токенов «Атлас» тёмной подмены нет). Шрифт системный: внешних шрифтов
   в кабинете нет (и политика содержимого их не пустит).
   Экран телефонный: крупные цели нажатия, читаемый шрифт, спокойный фон.
   ====================================================================== */

/* ======================================================================
   «АТЛАС» — ЦВЕТА КЛИЕНТСКОГО КАБИНЕТА (ПАКЕТ 9, решение руководителя
   24.10.2026). ОДИН источник на кабинет (kabinet.css) и на знак brand/.
   ======================================================================
   Вариант A «Светлый». Кабинет ВСЕГДА светлый: тему телефона и Telegram
   не наследует, поэтому тёмной подмены у этих токенов НЕТ и не будет.
   Панели сотрудников живут на своих токенах (_tokeny.css) и этот файл не
   подключают — их вид этим пакетом не меняется. Исключение — «Атлас ·
   Пульт» (ПАКЕТ 14, макеты владельца): тело как в кабинете, эти же
   токены, плюс тёмная шапка в _pult.css.
     акцент (кнопки, активная вкладка) — оранжевый знака «Атлас»;
     три метки статуса — «Едет в Бишкек» / «В Бишкеке» / «Бронь»;
     плюс — только поступления в истории операций.

   ВНИМАНИЕ: файл проходит через Jinja. Не пиши здесь фигурные скобки с
   процентом и решёткой — они выполнятся как команда шаблона.
   ====================================================================== */

:root {
  color-scheme: light;
  --atlas-fon:#F4F5F7; --atlas-karta:#FFFFFF;
  --atlas-tekst:#111318; --atlas-tekst-2:#5B6472;
  --atlas-liniya:#EEF0F3; --atlas-liniya-2:#DCE0E6;
  --atlas-akcent:#C2410C; --atlas-akcent-tyomnyy:#9A3412;
  --atlas-na-akcente:#FFFFFF;
  --atlas-put:#B4440A; --atlas-put-fon:#FFF1E6;
  --atlas-bishkek:#15803D; --atlas-bishkek-fon:#E6F6EC;
  --atlas-bron:#92400E; --atlas-bron-fon:#FEF3C7;
  --atlas-plyus:#15803D; --atlas-opasno:#B42318;
  --atlas-shrift: -apple-system, system-ui, "Segoe UI", Roboto, sans-serif;
  /* «Атлас · Панель» (ПАКЕТ 15, макеты владельца): метки статусов
     в панели сотрудников; с 31.10.2026 — и полоска карточки кабинета. */
  --atlas-metka-put:#1A6FB5; --atlas-metka-put-fon:#E7F2FB;
  --atlas-metka-pribyl:#15803D; --atlas-metka-pribyl-fon:#E6F6EC;
  --atlas-metka-bron:#92400E; --atlas-metka-bron-fon:#FEF3C7;
  --atlas-metka-srochno:#B4440A; --atlas-metka-srochno-fon:#FFF1E6;
  --atlas-metka-ploho:#B91C1C; --atlas-metka-ploho-fon:#FEE2E2;
  --atlas-shrift-nomera: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  /* ПАКЕТ 16: полоска статуса карточки «Мои заказы» — жёлтая (бронь ждёт
     оплаты) и серая (выдан); зелёная и оранжевая — bishkek и put. */
  --atlas-zhyolt:#CA8A04; --atlas-sery:#A3AAB5;
  /* «Карточки как в кабинете» (31.10.2026): полоска карточки — ОДНИ цвета
     у кабинета и панели. Жёлтый и серый — те же, что выше; остальные —
     метки панели. */
  --atlas-metka-zhyolt:#CA8A04; --atlas-metka-sery:#A3AAB5;
  /* ПАКЕТ 21, PR4 (руководитель): бронь в сетке витрины — янтарная. */
  --atlas-yantar:#D97706;
  /* ПАКЕТ 22, PR1 (макет «N_A»): плашка номера поверх снимка в сетке. */
  --atlas-na-foto-fon:rgba(17, 19, 24, .78); --atlas-na-foto-tekst:#FFFFFF;
}
/* ======================================================================
   AUTOLAND — ЦВЕТА КАБИНЕТА ВИТРИНЫ AUTOLAND (ПАКЕТ 30, PR3; макеты
   утверждены владельцем 09.11.2026 — МАКЕТЫ_AUTOLAND.md).
   ======================================================================
   Тот же кабинет и та же разметка, что у «Атласа»: здесь только ПОДМЕНА
   токенов --atlas-* на странице с data-brend="autoland" (страницу
   витрины решает адрес — kabinet.autoland.kg). Своей палитры сверх
   логотипа не заводим:
     основной синий #2044A5 — кнопки, активная вкладка, цена, шапка;
     тёмный #13204F — текст;
     салатовый #B9DB4B — акцент («LAND» в логотипе), «доставка включена»;
     фон #F2F4FA.
   Статусы (в пути / в магазине / бронь) — как у «Атласа», по смыслу.

   ВНИМАНИЕ: файл проходит через Jinja. Не пиши здесь фигурные скобки с
   процентом и решёткой — они выполнятся как команда шаблона.
   ====================================================================== */

html[data-brend="autoland"] {
  --atlas-fon:#F2F4FA; --atlas-karta:#FFFFFF;
  --atlas-tekst:#13204F; --atlas-tekst-2:#5A6485;
  --atlas-liniya:#E8ECF5; --atlas-liniya-2:#D5DBEA;
  --atlas-akcent:#2044A5; --atlas-akcent-tyomnyy:#17337E;
  --atlas-na-akcente:#FFFFFF;
  --atlas-put:#2044A5; --atlas-put-fon:#E8EEFB;
  --atlas-metka-put:#2044A5; --atlas-metka-put-fon:#E8EEFB;
  /* «В пути» в кабинете — оранжевая полоса «Атласа»; у AUTOLAND по
     макету — синяя. */
  --atlas-metka-srochno:#2044A5; --atlas-metka-srochno-fon:#E8EEFB;
  --al-siniy:#2044A5; --al-tyomnyy:#13204F;
  --al-lime:#B9DB4B; --al-lime-fon:#EEF6D6; --al-na-lime:#13204F;
}

/* Шапка — синяя, логотип магазина (белое AUTO, салатовое LAND). */
html[data-brend="autoland"] .kab-shapka {
  background: var(--al-siniy);
  margin: -12px -16px 4px;
  padding: 12px 16px 12px;
  border-radius: 0 0 14px 14px;
}
html[data-brend="autoland"] .kab-logo-al {
  display: block;
  width: 120px;
  height: auto;
  flex: none;
}
html[data-brend="autoland"] .kab-podpis { color: #DCE4F7; }
html[data-brend="autoland"] .kab-tolko-chtenie {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
html[data-brend="autoland"] .kab-shapka .kab-yazyk {
  background: var(--al-lime); color: var(--al-na-lime); border-color: transparent;
}
/* Рисунки «Установите на телефон» — синим, а не оранжевым знака «Атлас». */
html[data-brend="autoland"] svg [stroke="#C2410C"] { stroke: var(--al-siniy); }
html[data-brend="autoland"] svg [fill="#C2410C"] { fill: var(--al-siniy); }

/* Акцентная кнопка (макет: «➕ Пополнить») — салатовая с тёмным текстом. */
html[data-brend="autoland"] .kab-al-akcent {
  background: var(--al-lime); color: var(--al-na-lime); border-color: var(--al-lime);
}
/* «✓ доставка до Бишкека включена» — салатовая плашка. */
.kab-al-plashka {
  display: inline-block;
  align-self: flex-start;
  width: fit-content;
  margin: 6px 0 2px;
  padding: 3px 9px;
  border-radius: 8px;
  background: var(--al-lime, #B9DB4B);
  color: var(--al-na-lime, #13204F);
  font-size: 13px;
  font-weight: 700;
}

/* «Деньги» (макет): «➕ Пополнить» — салатовая, «Вывести» — контурная. */
html[data-brend="autoland"] #knopka-popolnit {
  background: var(--al-lime); color: var(--al-na-lime);
  border-color: var(--al-lime);
}
/* «Деньги» (макет): карточка баланса — синяя, цифры белые. */
html[data-brend="autoland"] #dengi-karta {
  background: var(--al-siniy); border-color: transparent; color: #FFFFFF;
}
html[data-brend="autoland"] #dengi-karta * {
  color: inherit; border-color: rgba(255, 255, 255, .25);
}
/* «Я» (макет): три кнопки в ряд — 2ГИС · Google Maps · WhatsApp. */
html[data-brend="autoland"] .kab-ya-punkt-knopki {
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
}
html[data-brend="autoland"] .kab-ya-punkt-knopki .kab-knopka {
  white-space: normal; font-size: 15px;
}
/* «Закуп из Дубая» (макет): голубая подсказка под папками. */
.kab-al-podskazka {
  margin: 0;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--atlas-metka-put-fon, #E8EEFB);
  color: var(--atlas-tekst, #13204F);
  font-size: 14px;
  line-height: 1.4;
}
/* Карточка товара (макет): цена крупно синим. */
html[data-brend="autoland"] .kab-tv-cena { color: var(--al-siniy); }
.kab-al-podskazka[hidden] { display: none; }
/* ПАКЕТ 30, PR4b: плашка «Заказ из Дубая» под подсказкой — белая с синей
   рамкой (второстепенная кнопка по макету); кнопка справа, не влезает —
   строкой ниже. */
.kab-al-zd {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin: 8px 0 0;
  padding: 10px 12px;
  border: 1px solid var(--al-siniy, #2044A5);
  border-radius: 12px;
  background: #FFFFFF;
  color: var(--atlas-tekst, #13204F);
}
.kab-al-zd[hidden] { display: none; }
.kab-al-zd-tekst {
  margin: 0;
  flex: 1 1 200px;
  font-size: 14px;
  line-height: 1.4;
}
.kab-al-zd-tekst b { display: block; }
.kab-al-zd .kab-al-zd-knopka {
  flex: 0 0 auto;
  margin: 0;
  background: var(--al-siniy, #2044A5);
  color: #FFFFFF;
  border-color: var(--al-siniy, #2044A5);
}
/* Форма заявки: марка, модель и год — в ряд (год уже). */
.kab-zd-ryad {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 76px;
  gap: 8px;
}
.kab-zd-pod {
  margin: 0;
  font-size: 13px;
  color: var(--atlas-tekst-2);
  text-align: center;
}
/* ПАКЕТ 30, PR4b-2: предложение по заявке «Заказ из Дубая». */
.kab-predlozhenie {
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 12px;
  background: var(--atlas-karta);
  border: 1px solid var(--atlas-ramka, rgba(19, 32, 79, 0.12));
}
.kab-predl-h { margin: 0; font-weight: 600; }
.kab-predl-cena { margin: 4px 0; font-size: 22px; font-weight: 700;
  color: var(--atlas-akcent, #2044A5); }
.kab-predl-usl, .kab-predl-srok, .kab-predl-itog { margin: 4px 0;
  font-size: 14px; color: var(--atlas-tekst-2); }
.kab-predl-beru { display: block; width: 100%; margin-top: 8px; }
.kab-predlozhenie[data-sostoyanie="isteklo"] .kab-predl-cena {
  color: var(--atlas-tekst-2); }

.kab-vopros-zayavka { margin: 4px 0 0; font-weight: 600; }
/* Внутренние экраны (макет, замечание владельца 09.11): синяя шапка с
   названием экрана и строкой под ним вместо логотипа. */
html[data-brend="autoland"] .kab-al-zag { flex: 1 1 auto; min-width: 0; }
.kab-al-zag-h {
  margin: 0; font-size: 22px; line-height: 1.15; font-weight: 800;
  color: #FFFFFF; text-wrap: balance;
}
.kab-al-zag-p { margin: 2px 0 0; font-size: 13px; color: #DCE4F7; }
html[data-brend="autoland"] .kab-al-zag[hidden],
html[data-brend="autoland"] .kab-logo-al[hidden],
html[data-brend="autoland"] #al-logo-slova[hidden],
html[data-brend="autoland"] .kab-al-zag-p[hidden] { display: none; }
/* Карточка товара: «✈️ Закуп из Дубая» уже в шапке — без повтора. */
html[data-brend="autoland"] #kab-pole[data-al-kartochka="da"] .kab-vt-shapka {
  display: none;
}
/* «Мои заказы · N» и «N ждут…» — уже в шапке. */
html[data-brend="autoland"] #zakazy-karta > h2,
html[data-brend="autoland"] #zakazy-zhdut { display: none; }
/* Сетка (макет): под снимком салатовая плашка «с доставкой»; в «Мелко ·
   3 в ряд» — короткая. */
.kab-kb-al {
  display: block; width: fit-content; max-width: 100%;
  margin: 6px 0 0; padding: 2px 5px; border-radius: 6px;
  background: var(--al-lime, #B9DB4B); color: var(--al-na-lime, #13204F);
  font-size: 11px; font-weight: 700; line-height: 1.35;
  letter-spacing: -0.1px;
}
/* 360 и уже: «✓ с доставкой» — в одну строку. */
@media (max-width: 374px) {
  .kab-kb-al { font-size: 10px; padding: 2px 4px; }
}
/* «Мелко · 3 в ряд» — вид по умолчанию (атрибута колонок может не быть). */
.kab-kb-al-dl { display: none; }
.kab-setka[data-kolonok="1"] .kab-kb-al-dl,
.kab-setka[data-kolonok="2"] .kab-kb-al-dl { display: inline; }
.kab-setka[data-kolonok="1"] .kab-kb-al-kr,
.kab-setka[data-kolonok="2"] .kab-kb-al-kr { display: none; }
/* PR5: видео внешнего осмотра в карточке мотора («Мои заказы») — кадр с
   «▶», нажатие ставит проигрыватель на его место. */
.kab-motor-video {
  margin: 10px 0 4px; border-radius: 12px; overflow: hidden;
  background: var(--al-siniy, #2044A5); aspect-ratio: 16 / 9;
}
.kab-motor-video-knopka {
  position: relative; display: block; width: 100%; height: 100%;
  padding: 0; border: 0; background: transparent; cursor: pointer;
}
.kab-motor-video-knopka:focus-visible { outline: 3px solid var(--al-lime, #B9DB4B); outline-offset: -3px; }
.kab-motor-video-img { display: block; width: 100%; height: 100%; object-fit: cover; }
.kab-motor-video-metka {
  position: absolute; left: 10px; bottom: 10px; padding: 6px 10px;
  border-radius: 8px; background: var(--al-lime, #B9DB4B);
  color: var(--al-na-lime, #13204F); font-size: 14px; font-weight: 700;
}
.kab-motor-pleer { display: block; width: 100%; height: 100%; background: #000; }

/* ── Экран входа AUTOLAND (ПАКЕТ 30, PR4; макет 5) ─────────────────────
   Синий верх с крупным логотипом, RU/KG справа; карточка «Вход в
   кабинет»; внизу — строка магазина. */
html[data-brend="autoland"] .kab-shapka-al-vhod {
  position: relative;
  justify-content: center;
  padding: 22px 16px 20px;
}
html[data-brend="autoland"] .kab-logo-al-vhod {
  width: 200px;
  max-width: 62vw;
  margin: 0 auto;
}
html[data-brend="autoland"] .kab-shapka-al-vhod .kab-yazyk {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 40px;
  height: 40px;
}
html[data-brend="autoland"] .kab-shapka-al-vhod .kab-yazyk[disabled] {
  opacity: .45;
}
html[data-brend="autoland"] .kab-al-vpervye {
  text-align: center;
  font-size: 13px;
  margin: 4px 0 0;
}
html[data-brend="autoland"] .kab-al-magazin {
  text-align: center;
  font-size: 12px;
  color: var(--atlas-tekst-2);
  border-top: 1px solid var(--atlas-liniya);
  padding-top: 10px;
  margin: 4px 0 0;
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  background: var(--atlas-fon);
}

body {
  color: var(--atlas-tekst);
  font: 16px/1.45 var(--atlas-shrift);
  -webkit-text-size-adjust: 100%;
  /* Вырезы и «домик» айфона: содержимое не должно уезжать под них. */
  padding: max(12px, env(safe-area-inset-top)) 16px
           calc(84px + env(safe-area-inset-bottom)) 16px;
  display: flex;
  justify-content: center;
}

.kab {
  width: 100%;
  max-width: 520px;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* ── шапка: знак «Атлас», слово, язык ─────────────────────────────── */
.kab-shapka {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 4px 0 2px;
}

.kab-znak {
  width: 32px;
  height: 32px;
  flex: none;
}

.kab-shapka-slova { min-width: 0; flex: 1 1 auto; }

.kab-imya {
  margin: 0;
  font-size: 22px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: -0.2px;
  color: var(--atlas-tekst);
}

.kab-podpis {
  margin: 1px 0 0;
  font-size: 13px;
  color: var(--atlas-tekst-2);
}

/* Круглая кнопка языка. Цель нажатия 44 точки — палец, а не мышка. */
.kab-yazyk {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 1.5px solid var(--atlas-liniya-2);
  background: var(--atlas-karta);
  color: var(--atlas-tekst);
  font: 700 13px/1 var(--atlas-shrift);
  letter-spacing: 0.04em;
  cursor: pointer;
}

.kab-yazyk:active { background: var(--atlas-liniya); }
.kab-yazyk[disabled] { opacity: .5; cursor: default; }

/* ── карточка ─────────────────────────────────────────────────────── */
.kab-karta {
  background: var(--atlas-karta);
  border-radius: 18px;
  padding: 16px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.kab-karta h2 {
  margin: 0 0 8px;
  font-size: 17px;
  font-weight: 700;
  text-wrap: balance;
}

/* Только прямые абзацы карточки: у строк списков внутри свои классы. */
.kab-karta > p {
  margin: 0 0 8px;
  color: var(--atlas-tekst-2);
  font-size: 15px;
}

.kab-karta > p:last-child { margin-bottom: 0; }

/* Заголовок только для озвучки: на экране его роль играет вид карточки. */
.kab-skryto {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

/* ── связь ────────────────────────────────────────────────────────────
   На экране входа это строка состояния ссылки — видна всегда. В самом
   кабинете (ПАКЕТ 9, 1.4) «Связь есть» не показываем: видна только
   беда — «Нет связи». */
/* ВХОД_АТЛАСА_001: «Загрузка…» до первого ответа сервера о входе. */
.kab-zagruzka {
  margin: 0;
  padding: 48px 16px;
  text-align: center;
  font-size: 15px;
  color: var(--atlas-tekst-2);
}
.kab-zagruzka[hidden] { display: none; }

.kab-svyaz {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 10px 14px;
  border-radius: 14px;
  background: var(--atlas-karta);
  color: var(--atlas-tekst-2);
  font-weight: 600;
  font-size: 15px;
}

.kab-tochka {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  flex: none;
  background: var(--atlas-liniya-2);
}

.kab-svyaz[data-svyaz="est"] { color: var(--atlas-bishkek); }
.kab-svyaz[data-svyaz="est"] .kab-tochka { background: var(--atlas-bishkek); }
.kab-svyaz[data-svyaz="net"] { color: var(--atlas-opasno); }
.kab-svyaz[data-svyaz="net"] .kab-tochka { background: var(--atlas-opasno); }
/* ПАКЕТ 23, PR1: экран входа по номеру — пока сказать нечего, строки нет. */
.kab-svyaz[data-svyaz="pusto"] { display: none; }

#svyaz:not([data-svyaz="net"]) { display: none; }

/* ── кнопки ───────────────────────────────────────────────────────── */
.kab-knopka {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  min-width: 48px;
  padding: 12px 18px;
  border: 0;
  border-radius: 14px;
  background: var(--atlas-akcent);
  color: var(--atlas-na-akcente);
  font: 600 16px/1.2 var(--atlas-shrift);
  cursor: pointer;
  width: 100%;
  text-align: center;
}

.kab-knopka:active { background: var(--atlas-akcent-tyomnyy); }
.kab-knopka[disabled] { opacity: .5; cursor: default; }
/* Кнопка-ссылка («Войти через Telegram») выглядит как кнопка; и
   спрятанная кнопка обязана пропасть — свой display у класса иначе
   перебивает hidden. */
a.kab-knopka { text-decoration: none; box-sizing: border-box; }
.kab-knopka[hidden] { display: none; }

/* Вторичная: белая с оранжевой рамкой. */
.kab-knopka-tihaya {
  margin-top: 12px;
  background: var(--atlas-karta);
  color: var(--atlas-akcent);
  border: 1.5px solid var(--atlas-akcent);
}

.kab-knopka-tihaya:active { background: var(--atlas-put-fon); }
.kab-knopka-tihaya[disabled] { opacity: .55; cursor: default; }

/* «Обновить» (ПАКЕТ 9, 1.4): кнопок на экране больше нет — данные
   обновляются при открытии и при смене вкладки. Узел остаётся в
   разметке: через него идёт то же бережное переспрашивание. */
.kab-obnovit,
#oplaty-obnovit,
#dostavka-obnovit { display: none !important; }

/* Опасное действие — красной строкой, без заливки. */
.kab-knopka-opasno {
  background: transparent;
  color: var(--atlas-opasno);
  border: 0;
  justify-content: flex-start;
  padding-left: 0;
  padding-right: 0;
}

.kab-knopka-opasno:active { background: transparent; opacity: .7; }

.kab-knopka-ryad {
  background: transparent;
  color: var(--atlas-tekst);
  border: 0;
  justify-content: flex-start;
  padding-left: 0;
  padding-right: 0;
  font-weight: 600;
}

.kab-knopka-ryad:active { background: transparent; opacity: .7; }

/* ── анкета в кабинете (KABINET_ANKETA_001) ─────────────────────────── */
.kab-anketa-vopros { white-space: pre-line; }
.kab-anketa-oshibka { color: var(--atlas-opasno); margin: 8px 0 0; }
.kab-anketa-oshibka[hidden] { display: none; }
.kab-anketa-knopki { display: flex; flex-direction: column; gap: 10px;
                     margin-top: 12px; }
.kab-anketa-knopki:empty { display: none; }
.kab-anketa-mesto { display: flex; flex-direction: column; gap: 10px; }
.kab-anketa-forma { display: flex; flex-direction: column; gap: 10px;
                    margin-top: 12px; }
.kab-anketa-forma[hidden] { display: none; }

/* ── вход по номеру: два экрана (ПАКЕТ 23, PR2b) ───────────────────── */
/* Страна — как в анкете регистратора; выбранная — оранжевой рамкой. */
.kab-strany {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  gap: 8px;
}
.kab-strany .kab-okno-podpis { grid-column: 1 / -1; }
.kab-strana {
  min-height: 44px;
  padding: 8px 6px;
  white-space: nowrap;
  border: 1.5px solid var(--atlas-liniya-2);
  border-radius: 12px;
  background: var(--atlas-karta);
  color: var(--atlas-tekst);
  font: 600 15px/1.2 var(--atlas-shrift);
  cursor: pointer;
}
.kab-strana[aria-pressed="true"] {
  border-color: var(--atlas-akcent);
  background: var(--atlas-put-fon);
  color: var(--atlas-akcent-tyomnyy);
}
/* Код страны — рядом с полем, не в нём: человек пишет только свои цифры. */
.kab-nomer-ryad { display: flex; align-items: stretch; gap: 8px; }
.kab-nomer-ryad .kab-okno-vvod { flex: 1 1 auto; min-width: 0; }
.kab-nomer-prefiks {
  display: flex;
  flex: none;
  align-items: center;
  white-space: nowrap;
  padding: 0 12px;
  border: 1.5px solid var(--atlas-liniya-2);
  border-radius: 12px;
  background: var(--atlas-fon);
  color: var(--atlas-tekst);
  font: 600 17px/1.3 var(--atlas-shrift);
  font-variant-numeric: tabular-nums;
}
.kab-nomer-prefiks[hidden] { display: none; }
/* Экран 2: куда ушёл код — крупно; 5 цифр — крупно и по центру. */
.kab-nomer-kuda {
  margin: 0;
  color: var(--atlas-tekst);
  font: 700 18px/1.35 var(--atlas-shrift);
  text-wrap: balance;
}
/* Два класса — сильнее общего вида поля (.kab-okno-vvod ниже по файлу). */
.kab-okno-vvod.kab-kod-vvod {
  padding: 14px 10px;
  font: 700 30px/1.2 var(--atlas-shrift-nomera);
  letter-spacing: .4em;
  text-indent: .4em;
  text-align: center;
  font-variant-numeric: tabular-nums;
}
#pro-nomer .kab-knopka-tihaya { margin-top: 0; }
/* «Отправить ещё раз» — тихая строка со счётчиком, а не третья рамка. */
#pro-nomer .kab-esche { border-color: transparent; background: transparent; }
/* «← Назад» — заметная: контурная во всю ширину под главной кнопкой,
   отбита от кнопок выбора чуть большим отступом. */
.kab-knopka-nazad,
#pro-nomer .kab-knopka-nazad { margin-top: 8px; }

/* Видимый фокус для клавиатуры и озвучки. */
a:focus-visible,
button:focus-visible,
.kab-knopka:focus-visible {
  outline: 3px solid var(--atlas-akcent);
  outline-offset: 2px;
}

.kab-niz {
  color: var(--atlas-tekst-2);
  font-size: 12px;
  text-align: center;
  margin: 4px 0 0;
}

/* ── карточка баланса (ПАКЕТ 9, 1.2) ──────────────────────────────── */
.kab-balans-glavnoe {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.kab-balans-podpis {
  color: var(--atlas-tekst-2);
  font-size: 14px;
}

.kab-balans-summa {
  font-size: 32px;
  line-height: 1.15;
  font-weight: 800;
  letter-spacing: -0.5px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.kab-balans-ryad {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--atlas-liniya);
}

.kab-balans-yacheyka {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.kab-balans-yacheyka-summa {
  font-weight: 700;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.kab-balans-yacheyka-podpis {
  color: var(--atlas-tekst-2);
  font-size: 12.5px;
}

.kab-balans-yacheyka[data-vid="k-oplate"][data-est="da"]
  .kab-balans-yacheyka-summa,
.kab-balans-yacheyka[data-vid="k-oplate"][data-est="da"]
  .kab-balans-yacheyka-podpis { color: var(--atlas-put); }

/* Строки под карточкой: заявка на вывод, доставка, долг — только если
   они есть. Подпись и сумма по краям, перенос разрешён. */
.kab-dengi { min-width: 0; }

.kab-dengi-dop {
  margin-top: 12px;
  padding-top: 4px;
  border-top: 1px solid var(--atlas-liniya);
}

.kab-dengi-stroka {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 2px 12px;
  padding: 8px 0;
}

.kab-dengi-podpis { color: var(--atlas-tekst-2); font-size: 14px; }

.kab-dengi-summa {
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* ── заказы (шаг C1) и выданные (шаг C2) ──────────────────────────── */
.kab-svodka { margin: 0; }

.kab-tiho { color: var(--atlas-tekst-2); }

.kab-zakazy {
  list-style: none;
  margin: 0;
  padding: 0;
}

.kab-zakaz {
  padding: 12px 0;
  border-top: 1px solid var(--atlas-liniya);
}

.kab-zakaz:first-child { border-top: 0; }
/* ПАКЕТ 16: выданный — серая полоска слева. */
.kab-zakaz[data-polosa="sery"] { border-left: 6px solid var(--atlas-sery);
                                 padding-left: 10px; }

.kab-zakaz p { margin: 0 0 4px; }

.kab-zakaz-imya { font-weight: 700; color: var(--atlas-tekst); }

.kab-zakaz-shtuk { color: var(--atlas-tekst-2); font-size: 14px; }

.kab-zakaz-sostoyanie { color: var(--atlas-put); font-weight: 600; }

.kab-zakaz-shag { color: var(--atlas-tekst-2); font-size: 14px; }

.kab-zakaz-data { color: var(--atlas-tekst-2); font-size: 14px; }

.kab-istoriya .kab-zakaz-sostoyanie { color: var(--atlas-tekst-2); }

/* ── оплаты и операции (шаг D2b) ──────────────────────────────────── */
.kab-oplaty-mesto { display: block; }
.kab-oplaty-montazh { display: block; }

.kab-oplaty { list-style: none; margin: 4px 0 0; padding: 0; }

.kab-oplata {
  padding: 12px 0;
  border-top: 1px solid var(--atlas-liniya);
}

.kab-oplata:first-child { border-top: 0; }

.kab-oplata p { margin: 0 0 2px; }

.kab-oplata-summa {
  font-size: 17px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
  color: var(--atlas-tekst);
}

/* Поступления — зелёным, списания — цветом текста. Знак виден всегда:
   цвет только подсказка. */
.kab-oplata-summa[data-znak="plyus"] { color: var(--atlas-plyus); }

.kab-oplata-vid { font-weight: 600; color: var(--atlas-tekst); }

.kab-oplata-za, .kab-oplata-kogda, .kab-oplata-kto {
  color: var(--atlas-tekst-2);
  font-size: 13.5px;
}

.kab-oplata-hvost {
  margin-top: 12px;
  color: var(--atlas-tekst-2);
  font-size: 13.5px;
}

/* ── доставка (шаг D3b) ───────────────────────────────────────────── */
.kab-dostavka-mesto { display: block; }
.kab-dostavka-montazh { display: block; }

.kab-dostavka-media { margin-bottom: 10px; font-size: 14px; }

.kab-dostavka-dolg {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--atlas-liniya);
}

.kab-dostavka { list-style: none; margin: 4px 0 0; padding: 0; }

.kab-korobka {
  padding: 12px 0;
  border-top: 1px solid var(--atlas-liniya);
}

.kab-korobka:first-child { border-top: 0; }

.kab-korobka p { margin: 0 0 4px; }

.kab-korobka-imya { font-weight: 700; color: var(--atlas-tekst); }

.kab-korobka-sostoyanie { font-weight: 600; color: var(--atlas-put); }

.kab-korobka-sposob,
.kab-korobka-ves,
.kab-korobka-stoimost,
.kab-korobka-oplata,
.kab-korobka-srok {
  color: var(--atlas-tekst-2);
  font-size: 14px;
}

.kab-korobka-oplata[data-oplachena="net"] { font-weight: 600; }

/* ── ваши данные (шаг E1b) ────────────────────────────────────────── */
.kab-vy {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 8px;
  margin: 0 0 4px;
}

.kab-vy-imya { font-size: 18px; font-weight: 700; color: var(--atlas-tekst); }

.kab-vy-kod { color: var(--atlas-tekst-2); font-size: 14px; }

.kab-profil-tekushchee { margin: 0 0 12px; }

.kab-profil-tekushchee p { margin: 0 0 4px; }

.kab-profil-tek-imya { font-weight: 700; color: var(--atlas-tekst); }

.kab-profil-tek-kod { color: var(--atlas-tekst-2); font-size: 14px; }

#profil-karta .kab-profil-forma { border: 0; padding: 0; margin: 0; }

.kab-profil-forma {
  border: 1px solid var(--atlas-liniya-2);
  border-radius: 14px;
  margin: 0 0 12px;
  padding: 12px;
  min-width: 0;
}

.kab-profil-legenda {
  font-weight: 700;
  margin: 0 0 10px;
}

.kab-profil-podpis {
  display: block;
  font-weight: 600;
  margin: 8px 0 4px;
}

/* ⛔ ВЫСОТА НЕ МЕНЬШЕ 48 ТОЧЕК И РАЗМЕР ШРИФТА НЕ МЕНЬШЕ 16.
   Меньше 16 — и телефон сам приближает страницу, как только палец
   касается поля. */
.kab-profil-pole,
.kab-profil-vybor {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  font: inherit;
  font-size: 16px;
  color: var(--atlas-tekst);
  background: var(--atlas-karta);
  border: 1.5px solid var(--atlas-liniya-2);
  border-radius: 12px;
}

.kab-profil-pole:disabled,
.kab-profil-vybor:disabled { opacity: .6; }

.kab-profil-pole:focus-visible,
.kab-profil-vybor:focus-visible {
  outline: 3px solid var(--atlas-akcent);
  outline-offset: 2px;
}

.kab-profil-podskazka {
  color: var(--atlas-tekst-2);
  font-size: 14px;
  margin: 6px 0 10px;
}

.kab-profil-status { margin: 8px 0 0; }

.kab-profil-montazh[aria-busy="true"] .kab-profil-forma { opacity: .75; }

/* Выход: «вы вошли как …» и две двери выхода. */
.kab-vyhod .kab-knopka { margin-top: 4px; }

/* ── нижняя панель вкладок (ПАКЕТ 9, 1.3) ────────────────────────────
   Видна только вместе с закрытой частью: пока вход не подтверждён,
   вкладкам показывать нечего. */
.kab-vkladki {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10;
  display: flex;
  justify-content: center;
  background: var(--atlas-karta);
  border-top: 1px solid var(--atlas-liniya-2);
  padding: 4px 8px env(safe-area-inset-bottom);
}

#sessiya[hidden] ~ .kab-vkladki,
#sessiya[data-sessiya="net"] ~ .kab-vkladki { display: none; }

.kab-vkladka {
  flex: 1 1 0;
  max-width: 172px;
  min-height: 56px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  border: 0;
  background: transparent;
  color: var(--atlas-tekst-2);
  font: 600 12px/1.1 var(--atlas-shrift);
  cursor: pointer;
}

.kab-vkladka svg { width: 24px; height: 24px; }

.kab-vkladka[aria-pressed="true"] { color: var(--atlas-akcent); }

/* Четыре вкладки. Чужая группа прячется ПОВЕРХ `hidden`: скрипт
   по-прежнему сам решает, показана ли карточка вообще. Карточка может
   жить на нескольких вкладках сразу («zakazy dengi»). */
.kab[data-ekran="vitrina"] [data-ekran-gruppa]:not([data-ekran-gruppa~="vitrina"]),
.kab[data-ekran="zakazy"] [data-ekran-gruppa]:not([data-ekran-gruppa~="zakazy"]),
.kab[data-ekran="dengi"] [data-ekran-gruppa]:not([data-ekran-gruppa~="dengi"]),
.kab[data-ekran="ya"] [data-ekran-gruppa]:not([data-ekran-gruppa~="ya"]) {
  display: none !important;
}

/* ── ПАКЕТ 9, PR2: содержимое вкладок ─────────────────────────────── */

/* Порядок вкладки «Я»: «Мои данные» и «Где забирать товар», список,
   подсказка «на экран», имя для обращения; ВНИЗУ — язык и выход
   (ПАКЕТ 22, PR3), под ними версия. Другие вкладки — в порядке разметки
   (у их карточек порядок 0). */
#ya-karta { order: 1; }
#ya-spisok { order: 2; }
#na-ekran { order: 3; }
#profil-karta { order: 4; }
#yazyk-karta { order: 5; }
#sessiya { order: 6; }
.kab-niz { order: 7; }

/* Язык и список «Я» — только вместе с закрытой частью (как вкладки). */
#sessiya[hidden] ~ #yazyk-karta,
#sessiya[hidden] ~ #ya-spisok,
#sessiya[data-sessiya="net"] ~ #yazyk-karta,
#sessiya[data-sessiya="net"] ~ #ya-spisok { display: none; }

/* Имя во вкладке «Я» — в карточке клиента; в двери выхода его не
   повторяем. */
#vy { display: none !important; }

/* ПАКЕТ 13 (п.10): «Я» — один экран. Имя — карандашом ✏️ в карточке
   (поле открывается только по нему); дверь выхода — одна, «на всех
   устройствах». Язык — кнопкой в шапке и (ПАКЕТ 22, PR3) карточкой
   внизу «Я». */
#vyyti { display: none !important; }
#profil-karta:not([data-pravka="da"]) { display: none !important; }
.kab-ya-imya { display: flex; align-items: center; gap: 8px; }
.kab-ya-imya-tekst { overflow-wrap: anywhere; }
.kab-ya-kod { color: var(--atlas-tekst-2); font-size: 13px; font-weight: 600; }
/* ПАКЕТ 13 (п.11): 🔔 в шапке со счётчиком непрочитанных. */
.kab-kolokol {
  position: relative; flex: none; border: 0; background: transparent;
  font-size: 20px; line-height: 1; padding: 6px; cursor: pointer;
  border-radius: 10px;
}
.kab-kolokol:focus-visible { outline: 2px solid var(--atlas-sinii); }
.kab-kolokol-chislo {
  position: absolute; top: 0; right: 0; min-width: 16px; height: 16px;
  /* ПАКЕТ 22, PR2: непрочитанные — красная цифра (задание руководителя). */
  padding: 0 4px; border-radius: 8px; background: var(--atlas-metka-ploho);
  color: #fff; font: 700 11px/16px var(--atlas-shrift); text-align: center;
}
.kab-uved { list-style: none; margin: 0; padding: 0; display: flex;
            flex-direction: column; gap: 2px; }
.kab-uved-stroka { display: flex; flex-direction: column; gap: 2px; width: 100%;
                   text-align: left; border: 0; background: transparent;
                   padding: 10px 4px; border-top: 1px solid var(--atlas-liniya);
                   cursor: pointer; font: inherit; color: var(--atlas-tekst); }
.kab-uved-stroka[data-novoe="da"] .kab-uved-chto { font-weight: 700; }
.kab-uved-meta { color: var(--atlas-tekst-2); font-size: 12.5px; }
/* ПАКЕТ 22, PR2: значок и заголовок по виду письма, точка «новое»,
   суть — две строки; раскрытое письмо — целиком, с переносами. */
.kab-uved-verh { display: flex; align-items: center; gap: 6px; min-width: 0; }
.kab-uved-znak { flex: none; width: 20px; text-align: center; }
.kab-uved-chto { min-width: 0; font-weight: 600; }
.kab-uved-tochka { flex: none; width: 8px; height: 8px; margin-left: auto;
                   border-radius: 50%; background: var(--atlas-metka-ploho); }
.kab-uved-sut { display: -webkit-box; -webkit-line-clamp: 2;
                -webkit-box-orient: vertical; overflow: hidden;
                padding-left: 26px; font-size: 14px; line-height: 1.35;
                overflow-wrap: anywhere; }
.kab-uved-stroka[data-celikom="da"] .kab-uved-sut {
  display: block; -webkit-line-clamp: unset; white-space: pre-line; }
.kab-uved-stroka .kab-uved-meta { padding-left: 26px; }
/* ПАКЕТ 13 (п.13): страница заказа — шапка карточки нажимается. */
.kab-poz-verh[role="button"] { cursor: pointer; }
.kab-st-prevyu { display: block; width: 120px; height: 120px;
  object-fit: cover; border-radius: 12px; background: var(--atlas-liniya); }
.kab-st-nazvanie { margin: 0; font-weight: 800; font-size: 17px;
                   overflow-wrap: anywhere; }
.kab-st-dengi { display: flex; flex-direction: column; gap: 2px; }
.kab-st-summa { display: flex; justify-content: space-between; gap: 12px;
                margin: 0; padding: 4px 0; font-size: 14.5px;
                border-top: 1px solid var(--atlas-liniya); }
.kab-st-podpis { color: var(--atlas-tekst-2); }
.kab-st-chislo { font-variant-numeric: tabular-nums; font-weight: 600; }
.kab-st-put { list-style: none; margin: 0; padding: 0; display: flex;
              flex-direction: column; gap: 4px; }
.kab-st-shag { display: flex; justify-content: space-between; gap: 8px;
               font-size: 14px; color: var(--atlas-tekst-2); }
.kab-st-shag[data-sostoyanie="proyden"] { color: var(--atlas-tekst); }
.kab-st-shag[data-sostoyanie="tekushchiy"] { color: var(--atlas-tekst);
                                              font-weight: 800; }
.kab-st-shag-data { font-variant-numeric: tabular-nums; flex: none; }
.kab-ya-karandash {
  flex: none; border: 0; background: transparent; padding: 4px 6px;
  font-size: 16px; line-height: 1; cursor: pointer; border-radius: 8px;
}
.kab-ya-karandash:focus-visible { outline: 2px solid var(--atlas-sinii); }

/* Карточка «как к вам обращаться»: только поле имени. Язык меняется
   переключателем выше — та же запись, та же дверь. */
#profil-karta .kab-profil-tekushchee,
#profil-karta .kab-profil-legenda,
#profil-forma-yazyk,
#na-ekran-tg { display: none !important; }
/* Правка после выката ПАКЕТА 9: блока «Доставка» на экране нет —
   сведения о доставке одной строкой в карточке позиции. Сам блок
   остаётся в разметке спрятанным: через него идут запрос, проверка и
   бережное обновление этих сведений. */
#dostavka-karta { display: none !important; }
/* ── ПАКЕТ 16: «Мои заказы» — отдельные карточки, полоска статуса ──
   Макет «вариант 2 · полоска статуса» + превью 64×64 (вариант 1) +
   группы с заголовками (вариант 3). Карточка белая, радиус 16, между
   карточками 12px серого фона; слева полоска 6px по статусу; над
   названием статус мелкими заглавными цветом полоски; номер «#52»
   крупно справа; строка «деньги · доставка»; кнопка внизу карточки. */
#zakazy-karta { background: transparent; padding: 0; }
#zakazy-karta > h2, #zakazy-karta > p { padding: 0 4px; }
.kab-zhdut { margin: -4px 0 8px; font-size: 14px; font-weight: 600;
             color: var(--atlas-put); }
.kab-zhdut[hidden] { display: none; }

/* Сама карточка (полоска, группы, шапка, статус, номер, кнопка) — в
   общем файле с «Атлас · Панелью» (31.10.2026): ОДНА разметка на оба
   интерфейса. */
/* ── ОБЩАЯ КАРТОЧКА «АТЛАС» — кабинет клиента и «Атлас · Панель» ──────
   «Карточки как в кабинете» (решение владельца 31.10.2026): ОДНА разметка
   и ОДИН файл стилей на оба интерфейса, чтобы не расходились. Кабинет
   собирает карточку скриптом (kabinet.js), панель — макросом
   `_kartochka.html`; классы и атрибуты одни и те же:

     <li class="kab-poz" data-polosa="oranzh" data-gruppa-zag="… · N">
       <div class="kab-poz-verh">
         <span class="kab-poz-marka"><span class="kab-poz-marka-tekst">…</span></span>
         <span class="kab-poz-nomer">#52</span>
         <span class="kab-metka">СТАТУС</span>
         <img class="kab-poz-prevyu"> (или без превью: .kab-poz-verh-bez)
         <span class="kab-poz-detal">…</span>
       </div>
       <p class="kab-poz-sut">…</p>
       <кнопка class="… kab-poz-knopka">
     </li>

   Белая карточка, радиус 16, между карточками 12px; слева полоска 6px по
   статусу; статус мелкими заглавными цветом полоски над названием; номер
   крупно справа; заголовок группы «название · N» — над первой карточкой
   группы. Цвета — токены --atlas-metka-* (_tokeny_atlas.css). */

/* Цвет полоски — переменная, её берут и карточка, и строка таблицы. */
[data-polosa] { --polosa: var(--atlas-metka-srochno); }
[data-polosa="oranzh"] { --polosa: var(--atlas-metka-srochno); }
[data-polosa="zhyolt"] { --polosa: var(--atlas-metka-zhyolt); }
[data-polosa="siniy"] { --polosa: var(--atlas-metka-put); }
[data-polosa="zelyon"] { --polosa: var(--atlas-metka-pribyl); }
[data-polosa="sery"] { --polosa: var(--atlas-metka-sery); }
[data-polosa="krasn"] { --polosa: var(--atlas-metka-ploho); }

.kab-pozicii { margin: 4px 0 0; padding: 0; list-style: none;
               display: flex; flex-direction: column; gap: 12px; }
.kab-pozicii + .kab-pozicii { margin-top: 12px; }

.kab-poz {
  position: relative;
  /* Полоска 6px — ровная, внутри скругления карточки. */
  background: linear-gradient(to right,
                              var(--polosa, var(--atlas-metka-srochno)) 0 6px,
                              var(--atlas-karta) 6px);
  border-radius: 16px;
  padding: 14px 14px 14px 18px;
  display: block;
}
/* Заголовок группы — над первой её карточкой. */
.kab-poz[data-gruppa-zag]:not([data-gruppa-zag=""]) { margin-top: 30px; }
.kab-poz[data-gruppa-zag]:not([data-gruppa-zag=""])::before {
  content: attr(data-gruppa-zag);
  position: absolute; left: 2px; top: -26px;
  font-size: 15px; font-weight: 800; color: var(--atlas-tekst);
  white-space: nowrap;
}
.kab-pozicii > .kab-poz:first-child[data-gruppa-zag]:not([data-gruppa-zag=""]) {
  margin-top: 26px;
}

.kab-poz-verh {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) auto;
  grid-template-areas: "prevyu status nomer" "prevyu nazvanie nomer"
                       "prevyu detal nomer";
  grid-template-rows: auto auto 1fr;
  column-gap: 12px;
  align-items: start;
}
/* Без превью (у большинства списков панели картинки нет). */
.kab-poz-verh.kab-poz-verh-bez {
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "status nomer" "nazvanie nomer" "detal nomer";
}
.kab-poz-prevyu { grid-area: prevyu; width: 64px; height: 64px;
  border-radius: 12px; object-fit: cover; display: block;
  background: var(--atlas-liniya); }
.kab-poz-prevyu-pusto { display: flex; align-items: center;
  justify-content: center; color: var(--atlas-tekst-2);
  font-size: 26px; font-weight: 800; }
.kab-poz-verh .kab-metka { grid-area: status; }
.kab-poz-marka { grid-area: nazvanie; }
.kab-poz-verh .kab-poz-detal { grid-area: detal; }
.kab-poz-verh .kab-poz-nomer { grid-area: nomer; }

.kab-poz-marka {
  font-weight: 800;
  font-size: 17px;
  line-height: 1.25;
  color: var(--atlas-tekst);
  min-width: 0;
  overflow-wrap: anywhere;
}
.kab-poz-marka a { color: inherit; text-decoration: none; }

.kab-poz-detal {
  margin: 2px 0 0;
  font-size: 14px;
  color: var(--atlas-tekst-2);
  overflow-wrap: anywhere;
}

/* Номер «#52» — крупно справа, серым. */
.kab-poz-nomer { color: var(--atlas-tekst-2); font-size: 20px; font-weight: 800;
                 white-space: nowrap; font-variant-numeric: tabular-nums; }

/* «деньги · доставка» — одной строкой под шапкой. */
.kab-poz-sut, .kab-poz-dostavka {
  display: inline;
  margin: 0;
  font-size: 14px;
}
.kab-poz-sut { color: var(--atlas-tekst); }
.kab-poz-sut::before { content: ""; display: block; height: 10px; }
.kab-poz-dostavka { color: var(--atlas-tekst-2); }
.kab-poz-dostavka:not([hidden])::before { content: " · "; }
.kab-poz-dostavka[hidden] { display: none; }

.kab-poz-knopka { display: flex; width: 100%; margin-top: 12px;
                  min-height: 44px; }

/* Статус в карточке — мелкими заглавными цветом полоски, без плашки. */
.kab-poz .kab-metka, .kab-poz .kab-metka[data-vid] {
  padding: 0; background: transparent; border-radius: 0;
  font-size: 11.5px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; white-space: normal;
  color: var(--polosa);
}
.kab-poz[data-polosa="zhyolt"] .kab-metka { color: var(--atlas-metka-bron); }

/* ПАКЕТ 12, PR3: брони, ждущие предоплату. */
.kab-broni[hidden] { display: none; }
.kab-dengi-zhdut { margin: 8px 0 0; }
.kab-dengi-zhdut[hidden] { display: none; }

.kab-poz-kod-blok {
  margin-top: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--atlas-bishkek-fon);
}

.kab-poz-kod-cifry {
  margin: 0;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: 0.18em;
  color: var(--atlas-tekst);
  font-variant-numeric: tabular-nums;
}

.kab-poz-kod-vest {
  margin: 6px 0 0;
  font-size: 13.5px;
  color: var(--atlas-tekst-2);
}


/* Метки статуса — словом и цветом (цвет только подсказка). */
.kab-metka {
  flex: none;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12.5px;
  font-weight: 700;
  white-space: nowrap;
  background: var(--atlas-liniya);
  color: var(--atlas-tekst-2);
}

.kab-metka[data-vid="v_puti"] {
  background: var(--atlas-put-fon);
  color: var(--atlas-put);
}

.kab-metka[data-vid="v_bishkeke"] {
  background: var(--atlas-bishkek-fon);
  color: var(--atlas-bishkek);
}

.kab-metka[data-vid="bron"] {
  background: var(--atlas-bron-fon);
  color: var(--atlas-bron);
}

/* ПАКЕТ 12, PR3: бронь ждёт предоплату — тот же цвет брони. */
.kab-metka[data-vid="zhdyot"] {
  background: var(--atlas-bron-fon);
  color: var(--atlas-bron);
}

/* ПАКЕТ 20, PR1d A: «Отменено вами» — серая метка, карточка бледнее. */
.kab-metka[data-vid="otmenena"] {
  background: var(--atlas-liniya);
  color: var(--atlas-tekst-2);
}

.kab-poz[data-vid="otmenena"] {
  opacity: 0.7;
}

/* «Пополнить» и «Вывести» — две кнопки в ряд. */
.kab-dengi-knopki {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.kab-dengi-knopki[hidden] { display: none; }
.kab-dengi-knopki .kab-knopka { margin-top: 0; }

/* Операции — одна строка: слева «что · машина» и мелко дата и кто,
   справа сумма. */
.kab-op {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid var(--atlas-liniya);
}

.kab-op:first-child { border-top: 0; }

.kab-op-levo { min-width: 0; }

.kab-op-chto {
  margin: 0;
  font-weight: 700;
  font-size: 15px;
  color: var(--atlas-tekst);
  overflow-wrap: anywhere;
}

.kab-op-meta {
  margin: 2px 0 0;
  font-size: 13px;
  color: var(--atlas-tekst-2);
}

.kab-op-summa {
  margin: 0;
  flex: none;
  font-weight: 700;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  color: var(--atlas-tekst);
}

.kab-op-summa[data-znak="plyus"] { color: var(--atlas-plyus); }
/* Отменённая заявка на вывод: деньги не уходили — без знака, зачёркнуто. */
.kab-op-summa[data-znak="net"] { text-decoration: line-through; opacity: 0.6; }
/* ПАКЕТ 12, п.13: чеки на проверке — отдельный серый блок, без знака. */
.kab-oplaty-zhdut-h { margin: 8px 0 0; font: 600 15px/1.3 var(--atlas-shrift);
                      color: var(--atlas-tekst-2); }
.kab-op-zhdyot .kab-op-chto, .kab-op-zhdyot .kab-op-summa,
.kab-op-summa[data-znak="zhdyot"] { color: var(--atlas-tekst-2); }

/* Вкладка «Я»: карточка клиента. */
.kab-ya-imya {
  margin: 0 0 8px;
  font-size: 19px;
  font-weight: 800;
  color: var(--atlas-tekst);
  overflow-wrap: anywhere;
}

/* ПАКЕТ 20, PR1e: «Сменить номер — через менеджера» под маской номера. */
.kab-ya-podskazka {
  margin: 0;
  font-size: 13px;
  color: var(--atlas-tekst-2);
}

.kab-ya-stroka {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-top: 1px solid var(--atlas-liniya);
  font-size: 14.5px;
}

.kab-ya-podpis { color: var(--atlas-tekst-2); flex: none; }

.kab-ya-znachenie {
  margin-left: auto;
  color: var(--atlas-tekst);
  text-align: right;
  overflow-wrap: anywhere;
  min-width: 0;
}

/* ПАКЕТ 22, PR3: «Мои данные» и «Где забирать товар». */
.kab-ya-h {
  margin: 0 0 10px;
  font: 800 12.5px/1.3 var(--atlas-shrift);
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--atlas-tekst-2);
  text-wrap: balance;
}
.kab-ya-h-punkt {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid var(--atlas-liniya);
}
.kab-ya-stroka:has(> .kab-ya-izmenit) { align-items: center; }
.kab-ya-izmenit {
  flex: none;
  min-height: 32px;
  padding: 0 2px;
  border: 0;
  background: none;
  color: var(--atlas-akcent);
  font: 600 14px/1.2 var(--atlas-shrift);
  cursor: pointer;
}
.kab-ya-izmenit:focus-visible { outline: 2px solid var(--atlas-akcent);
                                outline-offset: 2px; }
.kab-ya-smena { margin: 2px 0 6px; }
.kab-ya-punkt-adres {
  margin: 0 0 4px;
  font-size: 15.5px;
  font-weight: 700;
  color: var(--atlas-tekst);
  overflow-wrap: anywhere;
}
.kab-ya-punkt-chasy {
  margin: 0 0 12px;
  font-size: 14px;
  color: var(--atlas-tekst-2);
}
.kab-ya-punkt-knopki {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 8px;
}
.kab-ya-punkt-knopki .kab-knopka { min-width: 0; padding-left: 8px;
                                    padding-right: 8px; white-space: nowrap; }
.kab-ya-pozvonit { width: 100%; }

/* Переключатель языка «Русский | Кыргызча». */
.kab-pereklyuchatel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px;
  padding: 4px;
  border-radius: 14px;
  background: var(--atlas-fon);
}

.kab-pereklyuchatel button {
  min-height: 44px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--atlas-tekst-2);
  font: 600 15px/1.2 var(--atlas-shrift);
  cursor: pointer;
}

.kab-pereklyuchatel button[aria-pressed="true"] {
  background: var(--atlas-karta);
  color: var(--atlas-akcent);
  box-shadow: 0 1px 2px rgba(17, 19, 24, .08);
}

/* Список со стрелками. */
.kab-ya-spisok { padding-top: 4px; padding-bottom: 4px; }

.kab-ryad {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  padding: 0;
  border: 0;
  border-top: 1px solid var(--atlas-liniya);
  background: transparent;
  color: var(--atlas-tekst);
  font: 500 15.5px/1.3 var(--atlas-shrift);
  text-align: left;
  cursor: pointer;
}

.kab-ryad:first-child { border-top: 0; }
.kab-ryad[hidden] { display: none; }

.kab-ryad-strelka {
  color: var(--atlas-tekst-2);
  font-size: 22px;
  line-height: 1;
}

@media all and (display-mode: standalone) {
  #ya-domoy { display: none; }
}

/* ── подсказка «на экран Домой» (ПАКЕТ 3, PR3 3г) ─────────────────── */
.kab-na-ekran-dva {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 16px;
  margin: 12px 0;
}
.kab-na-ekran-shag {
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
  color: var(--atlas-tekst-2);
}
.kab-na-ekran-shag figcaption { font-size: 0.92em; }
/* ПАКЕТ 23, PR2: «Установите «Атлас» на телефон» — экран поверх кабинета
   (выше вкладок, ниже окон действий и щита приватности). */
.kab-na-ekran:not([hidden]) {
  position: fixed;
  inset: 0;
  z-index: 30;
  margin: 0;
  border-radius: 0;
  overflow-y: auto;
  background: var(--atlas-fon);
  padding: 20px 16px calc(24px + env(safe-area-inset-bottom));
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.kab-na-ekran-blok {
  background: var(--atlas-karta);
  border-radius: 14px;
  padding: 14px 14px 6px;
}
.kab-na-ekran-blok[hidden] { display: none; }
.kab-na-ekran-h3 { margin: 0 0 4px; font-size: 17px; }
.kab-na-ekran-kod {
  margin: 4px 0 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--atlas-bron-fon);
  color: var(--atlas-bron);
  font-weight: 600;
}
.kab-tihiy { font-size: 0.9em; color: var(--atlas-tekst-2); }
@media all and (display-mode: standalone) {
  .kab-na-ekran,
  .kab-na-ekran:not([hidden]) { display: none; }
}

/* ПАКЕТ 5, PR3 3б → ВХОД_ВНЕ_TELEGRAM_001: плашка «открылось внутри
   Telegram» — слова, кнопка перехода во всю ширину, крестик справа. */
.kab-v-telegram {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px 8px;
  background: var(--atlas-bron-fon);
  border-radius: 14px;
  padding: 12px 10px 12px 16px;
  color: var(--atlas-bron);
  font-weight: 600;
  font-size: 15px;
  margin: 0;
}
.kab-v-telegram[hidden] { display: none; }
.kab-v-telegram-tekst { margin: 2px 0 0; }
.kab-v-telegram-skryt {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.kab-v-telegram-skryt:focus-visible { outline: 2px solid currentColor; }
.kab-v-telegram-knopka,
.kab-v-telegram-podskazka { grid-column: 1 / -1; }
.kab-v-telegram-knopka { margin: 0; }
.kab-v-telegram-knopka[hidden],
.kab-v-telegram-podskazka[hidden] { display: none; }
.kab-v-telegram-podskazka {
  margin: 0;
  font-weight: 400;
  font-size: 14px;
}
@media all and (display-mode: standalone) {
  .kab-v-telegram { display: none; }
}

/* ВХОД_ВНЕ_TELEGRAM_001: «Откройте в браузере» на экране входа, когда он
   открыт во встроенном браузере Telegram. Картинка подсказки — строка
   адреса с обведённым «⋯» и пункт меню под ним. */
.kab-vne-tg[hidden] { display: none; }
.kab-vne-tg .kab-knopka { margin-top: 4px; }
.kab-vne-tg-podskazka {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.kab-vne-tg-podskazka[hidden] { display: none; }
.kab-vne-tg-podskazka > p { margin: 0; }
.kab-vne-tg-kartinka {
  border: 1px solid var(--atlas-liniya);
  border-radius: 14px;
  background: var(--atlas-fon);
  overflow: hidden;
}
.kab-vne-tg-stroka {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  background: var(--atlas-karta);
  border-bottom: 1px solid var(--atlas-liniya);
}
.kab-vne-tg-adres {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  color: var(--atlas-tekst-2);
}
.kab-vne-tg-menyu {
  flex: none;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 3px solid var(--atlas-akcent);
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  color: var(--atlas-tekst);
}
.kab-vne-tg-spisok {
  display: flex;
  justify-content: flex-end;
  padding: 10px 10px 12px;
}
.kab-vne-tg-punkt {
  padding: 8px 12px;
  border-radius: 10px;
  background: var(--atlas-karta);
  border: 2px solid var(--atlas-akcent);
  font-size: 14px;
  font-weight: 600;
  color: var(--atlas-tekst);
}
.kab-vne-tg-ssylka { font-size: 13px; }

/* ПАКЕТ 7: мини-приложение Telegram — подсказки про Safari и «на экран
   Домой» (свои) не нужны: у Telegram своя кнопка. */
[data-miniapp="da"] .kab-na-ekran,
[data-miniapp="da"] .kab-v-telegram,
[data-miniapp="da"] #voyti-telegram { display: none; }

/* ПЕРЕЕЗД_ЭКРАН_002 (11.11.2026): при переезде мини-приложение — ТОЛЬКО
   экран «Атлас теперь отдельное приложение»: ни витрины, ни вкладок, ни
   🔔 — ни сразу, ни после подгрузки (что бы скрипт ни дорисовал). Шапка
   остаётся (знак и язык). Инструкция «Как поставить на телефон» — поверх
   экрана переезда; прежнее правило мини-приложения её прятало, и кнопка
   «ничего не делала». */
[data-pereezd="da"] #kab-pole > :not(.kab-shapka):not(#miniapp-otkaz):not(#na-ekran) {
  display: none !important;
}
[data-pereezd="da"] #kolokol { display: none !important; }
[data-pereezd="da"] #miniapp-otkaz:not([hidden]) { display: block; }
[data-miniapp="da"][data-pereezd="da"] .kab-na-ekran:not([hidden]) {
  display: flex;
}

/* Спокойное появление — и полное его отключение для тех, кому движение
   мешает. */
.kab-karta { transition: opacity .2s ease; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

/* ⛔ ЩИТ ПРИВАТНОСТИ (IPHONE-SWITCHER-PRIVACY-001).
   Непрозрачный экран поверх ВСЕГО кабинета. Включается синхронно, когда
   страница уходит с глаз, и снимается только после того, как сервер
   заново подтвердил сессию и пришли свежие данные.
     • position: fixed + inset: 0 — накрывает и шапку, и вкладки, и
       области под вырезом экрана;
     • z-index заведомо выше всего в кабинете (у вкладок — 10), но БЕЗ
       десятизначного «предельного» числа: приёмка PWA справедливо
       принимает такое за номер телефона в кешируемом ответе;
     • фон СПЛОШНОЙ, без прозрачности: полупрозрачный оставил бы имя и
       номер клиента читаемыми на снимке системы.
   ⛔ ЩИТ ЖИВЁТ НА ЭКРАНЕ ВСЕГДА, ПРОСТО ПРОЗРАЧНЫЙ: слой создан и
   растеризован заранее, а уход меняет одну лишь `opacity` (проверено на
   iPhone — щит без слоя не успевал на снимок системы). */
.kab-shchit {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--atlas-fon, #F4F5F7);
  color: var(--atlas-tekst, #111318);
  opacity: 0;
  pointer-events: none;
  /* Просим свой слой заранее и держим его растеризованным. */
  will-change: opacity;
  transform: translateZ(0);
}

/* Поднятое состояние — одна строка и одно свойство. */
.kab-shchit[data-shchit="podnyat"] {
  opacity: 1;
  pointer-events: auto;
}

.kab-shchit-slova {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.kab-shchit-nutro { text-align: center; padding: 0 24px; }

.kab-shchit-podpis {
  margin: 10px 0 0;
  font-size: .95rem;
  color: var(--atlas-tekst-2, #5B6472);
}

.kab-shchit-knopka {
  margin-top: 16px;
  min-height: 48px;
  padding: 10px 18px;
  border: 1.5px solid var(--atlas-akcent, #C2410C);
  border-radius: 14px;
  background: var(--atlas-karta, #FFFFFF);
  color: var(--atlas-akcent, #C2410C);
  font: inherit;
  font-weight: 600;
  cursor: pointer;
}

.kab-shchit-knopka[hidden] { display: none; }

/* ПАКЕТ 23, PR4: застрявший щит — «🔄 Обновить» и под ней «На витрину»
   (тише). */
.kab-shchit-nutro .kab-shchit-knopka { display: block; width: 100%;
                                       max-width: 280px; margin: 16px auto 0; }
.kab-shchit-nutro .kab-shchit-knopka[hidden] { display: none; }
.kab-shchit-nutro .kab-shchit-knopka-tihaya { margin-top: 10px;
  border-color: var(--atlas-liniya-2, #D5DAE1);
  color: var(--atlas-tekst, #111318); }

/* ⛔ ПАКЕТ 23, PR4: запасной экран «Не удалось загрузить». Показывает его
   САМ СТИЛЬ через 8 с — на случай, если скрипт кабинета не доехал или
   упал; живой скрипт прячет его раньше (hidden, data-zhivoy). Поверх
   всего, включая щит. */
.kab-sboy {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  background: var(--atlas-fon, #F4F5F7);
  color: var(--atlas-tekst, #111318);
  visibility: hidden;
  opacity: 0;
  animation: kab-sboy-pokaz .25s ease-out 8s forwards;
}
.kab-sboy[hidden], html[data-zhivoy="da"] .kab-sboy { display: none; }
@keyframes kab-sboy-pokaz { to { visibility: visible; opacity: 1; } }
.kab-sboy-nutro { display: flex; flex-direction: column; gap: 10px;
                  width: 100%; max-width: 320px; text-align: center; }
.kab-sboy-h { margin: 0; font-size: 1.15rem; font-weight: 700; }
.kab-sboy-kg { margin: 0 0 8px; color: var(--atlas-tekst-2, #5B6472); }
.kab-sboy .kab-knopka { text-decoration: none; }

/* ── ДЕЙСТВИЕ ПОСЛЕ БРОНИ (ПАКЕТ 10, PR2) ──────────────────────────────
   Окно подтверждения снизу, поверх вкладок: сумма, кнопка «Списать …»
   и «Закрыть». Цвета — только из токенов «Атлас». */
.kab-deystvie {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: rgba(17, 19, 24, .38);
  padding: 16px;
  box-sizing: border-box;
}
.kab-deystvie[hidden] { display: none; }

/* ПАКЕТ 23, PR4b: «Не открылось приложение …» — строка внизу экрана,
   выше окон действий (40), ниже щита приватности. Цвета — токены «Атлас». */
.kab-ne-otkrylos {
  position: fixed;
  left: 12px;
  right: 12px;
  bottom: calc(12px + env(safe-area-inset-bottom));
  z-index: 50;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  padding: 12px 44px 12px 14px;
  border-radius: 14px;
  background: var(--atlas-karta);
  color: var(--atlas-tekst);
  box-shadow: 0 6px 24px rgba(17, 19, 24, .18);
  box-sizing: border-box;
}
.kab-ne-otkrylos[hidden] { display: none; }
.kab-ne-otkrylos-p { margin: 0; flex: 1 1 100%; }
.kab-ne-otkrylos-knopka { margin: 0; }
.kab-ne-otkrylos-x {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--atlas-tekst-2);
  font-size: 18px;
  cursor: pointer;
}
.kab-okno {
  width: 100%;
  max-width: 480px;
  max-height: 86vh;
  overflow-y: auto;
  background: var(--atlas-karta);
  color: var(--atlas-tekst);
  border-radius: 20px;
  padding: 20px 18px 14px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.kab-okno-h { margin: 0; font: 700 19px/1.25 var(--atlas-shrift); }
.kab-okno-p { margin: 0; font-size: 16px; line-height: 1.4; }
.kab-okno-melko { margin: 0; font-size: 14px; color: var(--atlas-tekst-2); }
/* ПАКЕТ 16: окно оплаты — «нужно оплатить» крупно, наличные — мелко. */
.kab-okno-k-oplate { margin: 0; font-size: 20px; font-weight: 800;
                     font-variant-numeric: tabular-nums; }
.kab-okno-nalichnymi { margin-top: 4px; }
.kab-okno-vest { margin: 0; font-size: 14px; color: var(--atlas-opasno); }
.kab-okno-vest:empty { display: none; }
.kab-okno-rekv {
  background: var(--atlas-put-fon);
  border-radius: 12px;
  padding: 10px 12px;
}
.kab-okno-rekv-stroka { margin: 0; font: 600 15px/1.4 var(--atlas-shrift); }
.kab-okno-pole { display: flex; flex-direction: column; gap: 6px; }
.kab-okno-podpis { font-size: 14px; color: var(--atlas-tekst-2); }
.kab-okno-vvod {
  font: 500 17px/1.3 var(--atlas-shrift);
  padding: 12px 14px;
  border: 1.5px solid var(--atlas-liniya-2);
  border-radius: 12px;
  background: var(--atlas-karta);
  color: var(--atlas-tekst);
  width: 100%;
  box-sizing: border-box;
}
.kab-okno-vvod[hidden] { display: none; }
.kab-okno-fayl { font-size: 15px; }
/* ПАКЕТ 12: «📷 Прикрепить чек» — большая кнопка-подпись к полю файла;
   само поле спрятано, но остаётся в странице (iPhone открывает выбор
   только у поля в документе). */
.kab-knopka-bolshaya { position: relative; display: flex; align-items: center;
                       justify-content: center; min-height: 56px;
                       font-size: 18px; cursor: pointer; }
.kab-knopka-bolshaya[aria-disabled="true"] { opacity: .6; }
.kab-okno-fayl-skryt { position: absolute; width: 1px; height: 1px;
                       opacity: 0; overflow: hidden; pointer-events: none; }
.kab-qr { display: flex; flex-direction: column; align-items: center;
          gap: 8px; }
.kab-qr-kartinka { width: 100%; max-width: 280px; height: auto;
                   border-radius: 12px; background: #FFFFFF; }
.kab-okno-vybor { display: flex; flex-wrap: wrap; gap: 8px; }
.kab-okno-vybor .kab-knopka { margin-top: 0; flex: 1 1 40%; }
/* ПАКЕТ 13 (п.7): «Всё» под полем суммы, банки — в два ряда. */
.kab-okno-vsyo { align-self: flex-start; margin-top: 0; }
.kab-okno .kab-knopka[aria-pressed="true"] {
  box-shadow: inset 0 0 0 2px var(--atlas-akcent);
}
.kab-okno-knopki { display: flex; flex-direction: column; gap: 8px;
                   margin-top: 4px; }
.kab-okno-knopki .kab-knopka-tihaya { margin-top: 0; }
.kab-knopka-krasnaya { background: var(--atlas-opasno); }
.kab-knopka-krasnaya:active { background: var(--atlas-opasno); opacity: .85; }
.kab-poz-knopka[hidden] { display: none; }


/* ── ПАКЕТ 16, PR2: «Витрина» — те же карточки, что «Мои заказы» ──
   Полоска: зелёная — в наличии, жёлтая — забронирован. Под шапкой цена
   крупно («за 1 шт» / «за комплект» мелко), внизу — кнопка в бота. */
#vitrina-karta { background: transparent; padding: 0; }
#vitrina-karta > h2, #vitrina-karta > p { padding: 0 4px; }
/* ПАКЕТ 22, PR4: «Витрина · N» и верхние кнопки страниц — одной строкой,
   по базовой линии; не влезают — кнопки строкой ниже, вправо. Строка
   «Страница 1 из 4 · товары 1–30» — под кнопками. */
.kab-vt-shapka { display: flex; flex-wrap: wrap; align-items: baseline;
                 justify-content: space-between; column-gap: 8px;
                 row-gap: 6px; padding: 0 4px; margin: 0 0 8px; }
.kab-vt-shapka > h2 { margin: 0; }
#vitrina-eshche[hidden] { display: none; }
/* ПАКЕТ 20, PR1a: разделы и поиск. Кнопки разделов переносятся на
   вторую строку, а не уезжают вбок: прокрутку ряда видно не всем. */
.kab-vt-filtr { display: flex; flex-direction: column; gap: 10px;
                margin: 4px 4px 12px; }
.kab-vt-filtr[hidden] { display: none; }
.kab-vt-razdely { display: flex; flex-wrap: wrap; gap: 8px; }
.kab-vt-razdel { flex: 0 0 auto; min-height: 40px; padding: 0 14px;
                 border: 1.5px solid var(--atlas-liniya-2);
                 border-radius: 20px; background: var(--atlas-karta);
                 color: var(--atlas-tekst-2);
                 font: 600 14px/1.2 var(--atlas-shrift); cursor: pointer;
                 font-variant-numeric: tabular-nums; white-space: nowrap; }
.kab-vt-razdel[aria-pressed="true"] { border-color: var(--atlas-akcent);
                                       color: var(--atlas-akcent); }
.kab-vt-poisk { width: 100%; box-sizing: border-box; }
/* ПАКЕТ 20, PR1b: окно «Забронировать» — товар, цена, блок мотора,
   количество кнопками (те же «пилюли», что разделы витрины), итог. */
.kab-zakaz-tovar { font-weight: 700; }
.kab-zakaz-agregat { white-space: pre-line; }
.kab-zakaz-kolichestvo { display: flex; flex-wrap: wrap; gap: 8px;
                         margin: 4px 0 8px; }
.kab-zakaz-summa { font-weight: 800; font-variant-numeric: tabular-nums; }
.kab-vt-cena { margin: 10px 0 0; font-size: 18px; font-weight: 800;
               color: var(--atlas-tekst); font-variant-numeric: tabular-nums; }
.kab-vt-za { margin-left: 6px; font-size: 13px; font-weight: 600;
             color: var(--atlas-tekst-2); }

/* ── ПАКЕТ 21, PR2: витрина сеткой «B» (макет владельца) ─────────────
   Три колонки; карточка — одна кнопка: фото квадратом из миниатюры,
   сверху тёмная плашка с машиной, в углу точка статуса; под фото —
   короткое имя детали в две строки; внизу цена и «’05 · #12». Цвета —
   токены «Атлас» (--atlas-metka-*), своей палитры нет. */
.kab-vt-papki { flex-wrap: nowrap; overflow-x: auto; margin: 0 -4px;
                padding: 0 4px 2px; scrollbar-width: none;
                -webkit-overflow-scrolling: touch; }
.kab-vt-papki::-webkit-scrollbar { display: none; }
.kab-vt-papki .kab-vt-razdel { min-height: 36px; padding: 0 12px;
                               font-size: 13px; font-weight: 700;
                               color: var(--atlas-tekst); }
.kab-vt-papki .kab-vt-razdel[aria-pressed="true"] {
  background: var(--atlas-tekst); border-color: var(--atlas-tekst);
  color: var(--atlas-karta); }
.kab-vt-chislo { margin-left: 5px; opacity: .55; font-weight: 600; }
.kab-vt-papka-slova { margin: 0; font-size: 12px; line-height: 1.35; }
.kab-vt-papka-slova[hidden] { display: none; }
.kab-setka { list-style: none; margin: 0; padding: 0; display: grid;
             grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.kab-setka[hidden] { display: none; }
/* ПАКЕТ 22, PR3: вид витрины — 2 колонки (макет «V2») и 1 колонка (макет
   «V1»: крупное фото на всю ширину, деталь, цена, «Забронировать» прямо
   в карточке). Плашка номера, точка, плашка брони и «сом» — те же. */
.kab-vt-poisk-ryad { position: relative; display: flex; align-items: center;
                     gap: 8px; min-width: 0; }
.kab-vt-poisk-ryad .kab-vt-poisk { flex: 1 1 auto; min-width: 0; }
/* Макет «W_A»: тёмная квадратная кнопка 42×42, иконка текущего вида. */
.kab-vt-vid-knopka { flex: none; display: flex; align-items: center;
                     justify-content: center; width: 42px; height: 42px;
                     padding: 0; border: 0; border-radius: 12px;
                     background: var(--atlas-tekst);
                     color: var(--atlas-karta); cursor: pointer; }
.kab-vt-vid-knopka:focus-visible { outline: 2px solid var(--atlas-akcent);
                                   outline-offset: 2px; }
.kab-vt-ikonka { display: grid; gap: 2px; width: 18px; height: 18px; }
.kab-vt-ikonka[data-kolonok="1"] { grid-template-columns: 1fr; }
.kab-vt-ikonka[data-kolonok="2"] { grid-template-columns: repeat(2, 1fr); }
.kab-vt-ikonka[data-kolonok="3"] { grid-template-columns: repeat(3, 1fr);
                                   gap: 1.5px; }
.kab-vt-kvadrat { display: block; border-radius: 2px;
                  background: currentColor; }
/* Всплывающее меню «Вид витрины» — под кнопкой, справа. */
.kab-vt-vidy { position: absolute; right: 0; top: calc(100% + 6px);
               z-index: 20; display: flex; flex-direction: column; gap: 2px;
               min-width: 232px; padding: 6px; border-radius: 14px;
               background: var(--atlas-karta);
               box-shadow: 0 10px 28px rgba(17, 19, 24, .18),
                           0 1px 3px rgba(17, 19, 24, .12); }
.kab-vt-vidy[hidden] { display: none; }
.kab-vt-vidy-h { margin: 4px 10px 4px; font-size: 12px; font-weight: 700;
                 color: var(--atlas-tekst-2); }
.kab-vt-vid { display: flex; align-items: center; gap: 12px; width: 100%;
              min-height: 44px; margin: 0; padding: 0 10px; border: 0;
              border-radius: 10px; background: transparent;
              color: var(--atlas-tekst); font: 600 15px/1.2 var(--atlas-shrift);
              text-align: left; cursor: pointer; }
.kab-vt-vid .kab-vt-ikonka { color: var(--atlas-tekst-2); }
.kab-vt-vid[data-tekushchiy="da"] { background: var(--atlas-metka-srochno-fon);
                                    color: var(--atlas-akcent); }
.kab-vt-vid[data-tekushchiy="da"] .kab-vt-ikonka { color: var(--atlas-akcent); }
.kab-vt-vid-galka { margin-left: auto; font-weight: 800; }
/* ПАКЕТ 22, PR3b: страницы витрины — кнопки над сеткой (под папками) и
   под ней. Текущая — тёмная, остальные — белые с рамкой. */
.kab-vt-stranicy { display: flex; flex-direction: column; gap: 6px;
                   margin: 2px 0 10px; }
.kab-vt-stranicy[hidden] { display: none; }
.kab-vt-stranicy-niz { margin: 12px 0 0; }
/* ПАКЕТ 23, PR4: верхний ряд — в строке «Витрина · N» при любом виде.
   Строка «Страница 1 из 6 · товары 1–20» — под кнопками справа и ширину
   ряда не задаёт (иначе на 360 она одна выталкивала бы кнопки вниз).
   Ширины кнопки, «…» и зазора — те же, что STR_*_PX в kabinet.js. */
.kab-vt-stranicy-verh { margin: 0 0 0 auto; align-items: flex-end;
                        position: relative; padding-bottom: 20px; }
.kab-vt-stranicy-verh .kab-vt-str-ryad { justify-content: flex-end; }
.kab-vt-stranicy-verh .kab-vt-str-info { position: absolute; right: 0;
                                         bottom: 0; white-space: nowrap;
                                         text-align: right; }
.kab-vt-str-ryad { display: flex; flex-wrap: nowrap; align-items: center;
                   gap: 3px; }
.kab-vt-str { flex: 0 0 auto; min-width: 28px; height: 34px; margin: 0;
              padding: 0 4px;
              border: 1px solid var(--atlas-liniya-2); border-radius: 10px;
              background: var(--atlas-karta); color: var(--atlas-tekst);
              font: 600 14px/1 var(--atlas-shrift);
              font-variant-numeric: tabular-nums; cursor: pointer; }
.kab-vt-str[data-tekushchaya="da"] { background: var(--atlas-tekst);
                                      border-color: var(--atlas-tekst);
                                      color: var(--atlas-karta); }
.kab-vt-str:disabled { opacity: .35; cursor: default; }
.kab-vt-str:focus-visible { outline: 2px solid var(--atlas-akcent);
                            outline-offset: 2px; }
.kab-vt-str-propusk { flex: 0 0 10px; min-width: 10px; text-align: center;
                      color: var(--atlas-tekst-2); }
.kab-vt-str-info, .kab-vt-str-dalshe { margin: 0; font-size: 13px;
                                       color: var(--atlas-tekst-2);
                                       font-variant-numeric: tabular-nums; }
/* ПАКЕТ 22, PR4: «Правила», «Вопросы», «Новости» — окнами кабинета. */
.kab-pravila { margin: 0; padding-left: 1.5em; display: flex;
               flex-direction: column; gap: 10px; }
.kab-pravilo { white-space: pre-wrap; overflow-wrap: anywhere;
               font-size: 14.5px; line-height: 1.45; }
.kab-v-zadat { width: 100%; }
.kab-voprosy, .kab-novosti { display: flex; flex-direction: column; }
.kab-vopros, .kab-novost { display: flex; flex-direction: column; gap: 6px;
                           padding: 12px 0;
                           border-top: 1px solid var(--atlas-liniya); }
.kab-vopros:first-child, .kab-novost:first-child { border-top: 0;
                                                   padding-top: 2px; }
.kab-vopros-meta, .kab-novost-meta { margin: 0; font-size: 12.5px;
                                     color: var(--atlas-tekst-2); }
.kab-vopros-tekst, .kab-novost-tekst { margin: 0; white-space: pre-wrap;
                                       overflow-wrap: anywhere;
                                       font-size: 15px; line-height: 1.45; }
.kab-vopros-zhdyom { margin: 0; font-size: 13px;
                     color: var(--atlas-tekst-2); }
.kab-vopros-otvet { display: flex; flex-direction: column; gap: 4px;
                    padding: 10px 12px; border-radius: 12px;
                    background: var(--atlas-fon); }
.kab-vopros-otvet-h { font-size: 12.5px; font-weight: 700;
                      color: var(--atlas-tekst-2); }
.kab-vopros-otvet-tekst { white-space: pre-wrap; overflow-wrap: anywhere;
                          font-size: 15px; line-height: 1.45; }
.kab-v-tovar { margin: 0; font-weight: 700; }
.kab-v-tekst { min-height: 112px; resize: vertical; font: inherit; }
.kab-v-snimok { align-self: flex-start; }
.kab-novost-kartinka { display: block; width: 100%; max-height: 420px;
                   object-fit: contain; border-radius: 12px;
                   background: var(--atlas-fon); }
.kab-setka[data-kolonok="2"] { grid-template-columns: repeat(2, minmax(0, 1fr));
                               gap: 10px; }
.kab-setka[data-kolonok="2"] .kab-kb { contain-intrinsic-size: auto 260px; }
.kab-setka[data-kolonok="2"] .kab-kb-detal { height: 36px; font-size: 14px; }
.kab-setka[data-kolonok="2"] .kab-kb-cena { font-size: 16px; }
.kab-setka[data-kolonok="2"] .kab-kb-som { font-size: 12px; }
.kab-setka[data-kolonok="2"] .kab-kb-plashka { font-size: 12px; }
.kab-setka[data-kolonok="1"] { grid-template-columns: minmax(0, 1fr);
                               gap: 12px; }
.kab-setka[data-kolonok="1"] .kab-kb { contain-intrinsic-size: auto 420px;
                                       display: flex; flex-direction: column;
                                       gap: 8px; padding: 8px 8px 10px;
                                       border-radius: 14px;
                                       background: var(--atlas-karta); }
.kab-setka[data-kolonok="1"] .kab-kb-knopka { padding: 0; height: auto;
                                              gap: 6px; }
.kab-setka[data-kolonok="1"] .kab-kb-kadr { aspect-ratio: 4 / 3;
                                            border-radius: 10px; }
.kab-setka[data-kolonok="1"] .kab-kb-plashka { font-size: 14px;
                                               padding: 8px 10px 14px; }
.kab-setka[data-kolonok="1"] .kab-kb-detal { height: auto; font-size: 17px;
                                             line-height: 1.3; }
.kab-setka[data-kolonok="1"] .kab-kb-cena { font-size: 20px; }
.kab-setka[data-kolonok="1"] .kab-kb-som { font-size: 14px; }
.kab-setka[data-kolonok="1"] .kab-kb-nomer { font-size: 12px; }
.kab-setka[data-kolonok="1"] .kab-kb-bron { font-size: 12px; }
.kab-kb-bron-knopka { width: 100%; margin: 0; }
.kab-kb-podpis { margin: 0; text-align: center; }
.kab-kb { min-width: 0; content-visibility: auto;
          contain-intrinsic-size: auto 190px; }
.kab-kb-knopka { display: flex; flex-direction: column; gap: 3px;
                 width: 100%; min-width: 0; height: 100%; margin: 0;
                 padding: 6px 6px 8px; border: 0; border-radius: 12px;
                 background: var(--atlas-karta); color: var(--atlas-tekst);
                 font: inherit; text-align: left; cursor: pointer; }
.kab-kb-knopka:focus-visible { outline: 2px solid var(--atlas-akcent);
                               outline-offset: 2px; }
.kab-kb-kadr { position: relative; display: block; width: 100%;
               aspect-ratio: 1 / 1; border-radius: 8px; overflow: hidden;
               background: var(--atlas-liniya); }
.kab-kb-img { display: block; width: 100%; height: 100%;
              object-fit: cover; }
.kab-kb-pusto { display: flex; align-items: center; justify-content: center;
                width: 100%; height: 100%; color: var(--atlas-tekst-2);
                font-size: 28px; font-weight: 800; }
.kab-kb-plashka { position: absolute; left: 0; right: 0; top: 0;
                  padding: 5px 6px 10px; font-size: 11px; font-weight: 800;
                  line-height: 1.2; color: var(--atlas-karta);
                  background: linear-gradient(rgba(17, 19, 24, .75),
                                              rgba(17, 19, 24, 0));
                  white-space: nowrap; overflow: hidden;
                  text-overflow: ellipsis; }
/* ПАКЕТ 21, PR4: точка 16 px с белой обводкой (10 px на фото не видно);
   у брони вместо точки — жёлтая плашка «Бронь до 14:20», янтарная. */
.kab-kb-tochka { position: absolute; right: 6px; bottom: 6px; width: 16px;
                 height: 16px; box-sizing: border-box; border-radius: 50%;
                 border: 2px solid var(--atlas-karta);
                 background: var(--atlas-metka-sery); }
.kab-kb-tochka[data-tochka="zelyon"] { background: var(--atlas-metka-pribyl); }
/* ПАКЕТ 22, PR1 (макет «N_A»): внизу слева на снимке — номер тёмной
   плашкой, у брони под ним жёлтая «Бронь до …». */
.kab-kb-levo { position: absolute; left: 4px; right: 4px; bottom: 6px;
               display: flex; flex-direction: column; align-items: flex-start;
               gap: 3px; pointer-events: none; }
.kab-kb-nomer { padding: 1px 5px; border-radius: 7px;
                background: var(--atlas-na-foto-fon);
                color: var(--atlas-na-foto-tekst);
                font-family: var(--atlas-shrift-nomera); font-size: 11px;
                font-weight: 600; line-height: 14px; white-space: nowrap; }
/* Время брони не обрезаем: на узком телефоне плашка — в две строки. */
.kab-kb-bron { max-width: 100%;
               box-sizing: border-box; padding: 2px 4px; border-radius: 7px;
               border: 1px solid var(--atlas-yantar);
               background: var(--atlas-metka-bron-fon);
               color: var(--atlas-metka-bron); font-size: 10px;
               font-weight: 800; line-height: 1.25; }
.kab-kb-detal { display: -webkit-box; -webkit-line-clamp: 2;
                -webkit-box-orient: vertical; overflow: hidden;
                height: 30px; margin-top: 2px; font-size: 12px;
                font-weight: 700; line-height: 1.25; overflow-wrap: anywhere; }
.kab-kb-niz { display: flex; align-items: baseline; min-width: 0; }
.kab-kb-cena { flex: none; font-size: 13px; font-weight: 800;
               white-space: nowrap; font-variant-numeric: tabular-nums; }
/* «сом» — мелко серым, как в карточке товара и окне брони. */
.kab-kb-som { font-size: 10px; font-weight: 600;
              color: var(--atlas-tekst-2); }
.kab-kb-metka { font-size: 10px; font-weight: 700;
                color: var(--atlas-tekst-2); white-space: nowrap;
                overflow: hidden; text-overflow: ellipsis; }
/* Ушедшие: серые, цена зачёркнута — смотреть можно, бронировать нельзя. */
.kab-kb[data-sostoyanie="prodano"] .kab-kb-knopka,
.kab-kb[data-sostoyanie="nedostupno"] .kab-kb-knopka { opacity: .92; }
.kab-kb[data-sostoyanie="prodano"] .kab-kb-img,
.kab-kb[data-sostoyanie="nedostupno"] .kab-kb-img { filter: grayscale(1);
                                                    opacity: .6; }
.kab-kb[data-sostoyanie="prodano"] .kab-kb-cena,
.kab-kb[data-sostoyanie="nedostupno"] .kab-kb-cena {
  color: var(--atlas-tekst-2); text-decoration: line-through; }
.kab-kb[data-sostoyanie="nedostupno"] .kab-kb-metka {
  color: var(--atlas-metka-ploho); }

/* Экран товара (PR2 — одно фото; галерея с листанием — PR3). */
.kab-tovar { display: flex; flex-direction: column; gap: 6px;
             padding: 0 4px; }
.kab-tovar[hidden] { display: none; }
/* ПАКЕТ 22, PR0: шапка карточки с «← Назад» — закреплена сверху, при
   прокрутке не уезжает (фон страницы под ней, чтобы снимок не просвечивал). */
.kab-tv-shapka { position: sticky; top: env(safe-area-inset-top, 0px);
                 z-index: 5; display: flex; align-items: center;
                 margin: 0 -4px; padding: 0 4px;
                 background: var(--atlas-fon); }
.kab-tv-nazad { min-height: 44px; padding: 0 4px;
                border: 0; background: transparent;
                color: var(--atlas-akcent);
                font: 700 15px/1.2 var(--atlas-shrift); cursor: pointer; }
/* ПАКЕТ 21, PR3: галерея — листать пальцем (кадры прилипают), точки и
   «2 / 6», щипок и двойной тап — увеличение (скрипт), под галереей ряд
   миниатюр, текущая обведена оранжевым. Видео — постер с «▶ видео 0:42»,
   играет здесь же. */
.kab-galereya { position: relative; width: 100%; border-radius: 14px;
                overflow: hidden; background: var(--atlas-karta); }
.kab-gl-lenta { display: flex; overflow-x: auto; overflow-y: hidden;
                scroll-snap-type: x mandatory; scrollbar-width: none;
                -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
.kab-gl-lenta::-webkit-scrollbar { display: none; }
.kab-galereya[data-zum="da"] .kab-gl-lenta { overflow-x: hidden;
                                             touch-action: none; }
.kab-gl-slayd { position: relative; flex: 0 0 100%; aspect-ratio: 1 / 1;
                overflow: hidden; scroll-snap-align: start;
                scroll-snap-stop: always; touch-action: pan-x pan-y;
                background: var(--atlas-liniya); }
.kab-gl-img { position: relative; display: block; width: 100%;
              height: 100%; object-fit: contain; background: transparent;
              transform-origin: center center; will-change: transform; }
/* ПАКЕТ 22, PR0: поля вертикального снимка — размытая копия его же. */
.kab-gl-fon { position: absolute; inset: 0; width: 100%; height: 100%;
              object-fit: cover; filter: blur(18px) saturate(1.1);
              transform: scale(1.15); pointer-events: none; }
.kab-gl-fon[hidden] { display: none; }
.kab-gl-slayd .kab-kb-pusto { font-size: 56px; }
.kab-galereya[data-sostoyanie="prodano"] .kab-gl-img,
.kab-galereya[data-sostoyanie="nedostupno"] .kab-gl-img,
.kab-galereya[data-sostoyanie="prodano"] .kab-gl-fon,
.kab-galereya[data-sostoyanie="nedostupno"] .kab-gl-fon {
  filter: grayscale(1); opacity: .7; }
.kab-gl-video { position: relative; display: block; width: 100%;
                height: 100%; margin: 0; padding: 0; border: 0;
                background: var(--atlas-tekst); cursor: pointer; }
.kab-gl-video-metka { position: absolute; left: 10px; bottom: 10px;
                      padding: 6px 10px; border-radius: 999px;
                      background: rgba(17, 19, 24, .72);
                      color: var(--atlas-karta);
                      font: 700 13px/1.2 var(--atlas-shrift); }
.kab-gl-pleer { display: block; width: 100%; height: 100%;
                background: var(--atlas-tekst); object-fit: contain; }
.kab-galereya[data-pleer="da"] .kab-gl-niz { display: none; }
.kab-gl-niz { position: absolute; left: 0; right: 0; bottom: 8px;
              display: flex; justify-content: center; align-items: center;
              pointer-events: none; }
.kab-gl-tochki { display: flex; gap: 5px; padding: 4px 8px;
                 border-radius: 999px; background: rgba(17, 19, 24, .35); }
.kab-gl-tochka { width: 6px; height: 6px; border-radius: 50%;
                 background: rgba(255, 255, 255, .55); }
.kab-gl-tochka[data-tekushchiy="da"] { background: var(--atlas-karta); }
.kab-gl-schet { position: absolute; right: 10px; padding: 3px 8px;
                border-radius: 999px; background: rgba(17, 19, 24, .55);
                color: var(--atlas-karta); font: 700 12px/1.2 var(--atlas-shrift);
                font-variant-numeric: tabular-nums; }
.kab-gl-minis { display: flex; gap: 6px; overflow-x: auto;
                padding: 2px 0 4px; scrollbar-width: none; }
.kab-gl-minis::-webkit-scrollbar { display: none; }
.kab-gl-mini { position: relative; flex: none; width: 56px; height: 56px;
               padding: 0; border: 2px solid transparent; border-radius: 10px;
               overflow: hidden; background: var(--atlas-liniya);
               cursor: pointer; }
.kab-gl-mini[aria-current="true"] { border-color: var(--atlas-akcent); }
.kab-gl-mini-img { display: block; width: 100%; height: 100%;
                   object-fit: cover; }
.kab-gl-mini .kab-kb-pusto { font-size: 18px; }
.kab-gl-mini-play { position: absolute; inset: 0; display: flex;
                    align-items: center; justify-content: center;
                    color: var(--atlas-karta); font-size: 18px;
                    background: rgba(17, 19, 24, .35); }
/* ПАКЕТ 21, PR4: условие покупки штучного — серой строкой под ценой. */
.kab-tv-uslovie { margin: 0; font-size: 13px; color: var(--atlas-tekst-2); }
/* ПАКЕТ 22: строки поста под ценой (SET, «💡 Цена без доставки…»). */
.kab-tv-uslovie-posta { margin: 0; font-size: 13px; line-height: 1.4;
                        color: var(--atlas-tekst-2); }
.kab-tv-agregat { margin: 6px 0 0; white-space: pre-line; font-size: 14px;
                  line-height: 1.45; }
.kab-tv-vopros { margin-top: 8px; }
.kab-tv-nomer { margin: 8px 0 0; font-size: 13px;
                color: var(--atlas-tekst-2); }
.kab-tv-mashina { margin: 0; font-size: 15px; font-weight: 700; }
.kab-tv-detal { margin: 0; font-size: 18px; font-weight: 800;
                line-height: 1.25; text-wrap: balance; }
.kab-tv-status { margin: 2px 0 0; font-size: 14px; font-weight: 700;
                 color: var(--atlas-metka-pribyl); }
.kab-tv-status[data-sostoyanie="bron"] { color: var(--atlas-metka-bron); }
.kab-tv-status[data-sostoyanie="prodano"],
.kab-tv-status[data-sostoyanie="nedostupno"] {
  color: var(--atlas-tekst-2); }
.kab-tv-knopka { margin-top: 8px; }
.kab-tv-nelzya { margin: 8px 0 0; }

/* «👁 Как видит клиент» — предпросмотр витрины для сотрудников. */
.kab-prevyu-polosa { display: flex; flex-wrap: wrap; align-items: center;
                     justify-content: space-between; gap: 6px 12px;
                     margin: 0 0 12px; padding: 10px 12px;
                     border-radius: 12px; background: var(--atlas-put-fon);
                     color: var(--atlas-tekst); font-size: 13px;
                     font-weight: 600; line-height: 1.35; }
.kab-prevyu-v-panel { color: var(--atlas-akcent); font-weight: 700;
                      text-decoration: none; white-space: nowrap; }
.kab[data-prevyu="da"] .kab-vkladki { display: none; }
.kab-prevyu-podpis { margin: 10px 0 0; padding: 12px;
                     border-radius: 12px; background: var(--atlas-liniya);
                     color: var(--atlas-tekst-2); text-align: center;
                     font-size: 14px; font-weight: 700; }

/* GOST_ZAMOK_001: гостевой просмотр. Вкладки — видны (у гостя «Витрина» и
   «Я»: «Я» открывает окно входа), «Заказов» и «Денег» нет. */
#kab-pole[data-gost="da"] #t-ekrany { display: flex; }
#kab-pole[data-gost="da"] #ekran-zakazy,
#kab-pole[data-gost="da"] #ekran-dengi { display: none; }
.kab-gost { display: flex; flex-wrap: wrap; align-items: center;
            justify-content: space-between; gap: 8px 12px; }
.kab-gost[hidden], .kab-gost-skoro[hidden], .kab-gost-punkt[hidden] {
  display: none; }
.kab-gost-p { margin: 0; flex: 1 1 220px; font-size: 15px;
              line-height: 1.4; }
.kab-gost .kab-knopka { margin: 0; flex: 0 0 auto; }
.kab-gost-skoro h2 { margin: 0 0 6px; }
.kab-gost-skoro p { margin: 0 0 12px; }
.kab-gost-punkt h3 { margin: 0 0 6px; }
.kab-gost-punkt p { margin: 0 0 6px; }