/* =============================================================================
   mobile.css — ОБЩИЙ МОБИЛЬНЫЙ ФУНДАМЕНТ WEWO.

   Подключается ПОСЛЕДНИМ, поэтому перекрывает по-экранные стили, не переписывая
   их. Здесь только базовый каркас: viewport/safe-area, запрет горизонтального
   скролла и единый брейкпоинт ≤600px (многоколоночное → одна колонка).
   Палитра и шрифт — из theme.css (Onest), тут цвета не вводим.

   Дальше по одному экрану адаптируются в своих файлах; тут — фундамент + Super
   Business (он сложнее всех, три колонки).
   ============================================================================= */

/* ---------- 1. Безопасные зоны и высота окна ---------------------------------
   tg.js внутри Telegram кладёт --tg-top/--tg-bottom/--tg-height. Вне Telegram
   берём системные env(safe-area-inset-*). Экраны используют эти переменные. */
:root {
  --safe-top:    env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left:   env(safe-area-inset-left, 0px);
  --safe-right:  env(safe-area-inset-right, 0px);
  /* Реальная высота вьюпорта: dvh корректно учитывает адресную строку/панели. */
  --app-h: 100dvh;
}

/* ---------- 2. Никакого горизонтального скролла — нигде -----------------------
   Частые причины «расползания»: фикс-ширины, min-width у flex/grid-детей,
   широкие медиа. Ставим страховку глобально. */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
img, canvas, video, svg, iframe, table, pre {
  max-width: 100%;
}
/* Широкий контент (таблицы, код, диаграммы) — прокрутка ВНУТРИ своего блока. */
.scroll-x { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ---------- 3. Единый мобильный брейкпоинт: ≤600px — одна колонка ------------
   Сворачиваем известные многоколоночные контейнеры проекта. Правила действуют
   только на узких экранах, десктоп не затрагивается. mobile.css идёт последним,
   поэтому !important не нужен — выигрывает по порядку каскада. */
@media (max-width: 600px) {

  /* Все сетки в одну колонку. */
  .sb-cols, .sb-tools, .sb-sum, .sb-quick, .sb-sims,
  .loy-stats, .loy-list, .sh-sum, .sh-row2,
  .of-tiles, .cab-grid, .cab-team, .cab-side,
  .cl-tiles, .cl-niches {
    grid-template-columns: 1fr;
  }

  /* Флекс-строки, которые на узком экране должны переноситься. */
  .cab-grid, .cab-in, .sb, .sb-room, .of-app { min-width: 0; }

  /* Дети флекса/грида не должны распирать контейнер длинным словом/числом. */
  .sb-room *, .of-main-in *, .cab-in * { min-width: 0; }

  /* Базовый кегль на телефоне — не мельчить. */
  body { font-size: 16px; }

  /* Удобные тап-цели: минимум 44px по высоте для основных кнопок. */
  button, .btn, a.btn { min-height: 44px; }
}

/* ---------- 4. Super Business на телефоне (фундаментальная адаптация) --------
   Layout по ШИРИНЕ (≤600px), чтобы одинаково работало и в браузере, и в
   Telegram (там ширина webview ≈ ширине телефона). Боковая панель — выезжающий
   бургер; контент в одну колонку; крупные карточки. Базовый паттерн бургера уже
   есть в sb.css (@860) и telegram.css — здесь доводим до ≤600 и на новые блоки. */
@media (max-width: 600px) {

  /* Одна колонка: контент во всю ширину, панель поверх (drawer). */
  .sb { grid-template-columns: 1fr; }
  .sb-side {
    position: absolute; inset: 0 auto 0 0;
    width: min(300px, 86vw); z-index: 30;
    transform: translateX(-100%);
    transition: transform .28s cubic-bezier(.2,0,0,1);
    padding-top: var(--safe-top);
  }
  .sb.side-open .sb-side { transform: none; box-shadow: 0 0 60px rgba(0,0,0,.7); }
  .sb-scrim {
    display: block; position: absolute; inset: 0; z-index: 25;
    background: rgba(0,0,0,.55);
    opacity: 0; pointer-events: none; transition: opacity .28s;
  }
  .sb.side-open .sb-scrim { opacity: 1; pointer-events: auto; }
  .sb-burger { display: flex; }

  /* Рабочая область и её колонки — вертикально, во всю ширину. */
  .sb-room { min-width: 0; }
  .sb-sup { max-width: 100%; }
  .sb-cols { gap: 12px; }

  /* Крупные тап-цели и кегль в SB. */
  .sb-add, .sb-sup-go, .sh-add, .loy-op-go, .sh-save, .loy-op-reward {
    min-height: 52px; font-size: 17px;
  }
  .sb-tool-card, .sb-q, .sb-sim, .loy-row, .sh-item, .of-tile { min-height: 56px; }
  .sh-mini, .loy-op-sec, .sh-chip { min-height: 44px; }

  /* Заголовок раздела покрупнее, но без переполнения. */
  .sb-sup-t { font-size: 30px; }
  .sb-head-t { font-size: 17px; }

  /* Безопасные зоны: контент SB не под системные панели. */
  .sb-home, .sh, .loy { padding-bottom: calc(var(--safe-bottom) + 20px); }
}

/* ---------- 5. Совсем узкие экраны (≤380px) — чуть плотнее ------------------- */
@media (max-width: 380px) {
  .sb-sup-t { font-size: 26px; }
  .sb-home, .sh, .loy { padding-left: 14px; padding-right: 14px; }
}

/* ---------- 6. Нижний таб-бар (только мобайл / Telegram) --------------------
   На десктопе скрыт (там остаётся верхняя навигация). Показывается при ширине
   ≤600px ИЛИ внутри Telegram (класс in-telegram, даже если webview шире). */
:root { --tabbar-h: 58px; }

.tabbar {
  display: none;   /* десктоп: таб-бара нет */
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 120;
  /* высота панели ≥ 56px + системная полоса снизу */
  min-height: var(--tabbar-h);
  padding-bottom: env(safe-area-inset-bottom, 0px);
  background: rgba(10, 11, 20, .92);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  border-top: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 0 -8px 30px rgba(0, 0, 0, .45);
}
.tabbar-defs { position: absolute; width: 0; height: 0; }

.tab {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 3px; padding: 7px 4px; min-height: var(--tabbar-h);
  background: none; border: 0; cursor: pointer;
  color: #8B90A8;                    /* неактивная вкладка */
  font-family: "Onest", system-ui, sans-serif;
  -webkit-tap-highlight-color: transparent;
  transition: color .15s var(--wv-e, cubic-bezier(.2,0,0,1));
}
.tab-ic { display: block; }
.tab-ic svg { width: 26px; height: 26px; display: block; stroke: currentColor; fill: none; }
.tab-lbl { font-size: 11px; font-weight: 600; letter-spacing: -.01em; line-height: 1;
  white-space: nowrap; color: currentColor; }

/* Активная вкладка — акцентный градиент #4DA6FF → #A855F7 (иконка и подпись). */
.tab.active .tab-ic svg { stroke: url(#tabGrad); filter: drop-shadow(0 0 6px rgba(77,166,255,.4)); }
.tab.active .tab-lbl {
  background: linear-gradient(135deg, #4DA6FF, #A855F7);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* Показ таб-бара: узкий экран или Telegram. */
@media (max-width: 600px) { .tabbar { display: flex; } }
body.in-telegram .tabbar { display: flex; }

/* Контенту разделов — нижний отступ, чтобы таб-бар не перекрывал последнее.
   Действует только там, где таб-бар виден. */
@media (max-width: 600px) {
  #homeView, #officeView, #moreView, #supportView {
    padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + 8px);
  }
  /* Super Business — свои прокручиваемые области и нижняя панель ввода. */
  .sb-home, .sh, .loy, .sb-floor {
    padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + 16px);
  }
  .sb-bar {
    margin-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px));
  }
  /* Боковая панель SB (drawer) заканчивается над таб-баром. */
  .sb-side { padding-bottom: var(--tabbar-h); }
}
body.in-telegram #homeView,
body.in-telegram #officeView,
body.in-telegram #moreView,
body.in-telegram #supportView {
  padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + 8px);
}
body.in-telegram .sb-home,
body.in-telegram .sh,
body.in-telegram .loy,
body.in-telegram .sb-floor {
  padding-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + 16px);
}
body.in-telegram .sb-bar {
  margin-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px));
}

/* Заглушка «Ещё». */
.more-wrap { padding: 40px 20px; max-width: 640px; margin: 0 auto;
  min-height: 60vh; display: flex; flex-direction: column; justify-content: center; }
.more-title { font-size: 30px; font-weight: 800; letter-spacing: -.03em;
  color: var(--wv-text, #EAECF5); margin: 0 0 8px; }
.more-sub { font-size: 15px; line-height: 22px; color: var(--wv-mute, #8B90A8); margin: 0; }

/* ---------- 7. Главная на телефоне: короткий «дышащий» экран -----------------
   Порядок сверху вниз: приветствие → планета (акцент, кликабельна) → компактная
   карточка бизнеса → строка ввода → мелкий дисклеймер. Повторы (Мой офис,
   Супербизнес, статус) убраны — они есть в нижнем таб-баре. Логику не трогаем,
   только раскладку. Действует ≤600px; десктоп не затрагивается. */
@media (max-width: 600px) {
  #homeView .cab { padding: 16px 16px 20px; overflow: visible; }
  #homeView .cab-in { display: flex; flex-direction: column; }

  /* Приветствие — компактно, по центру. */
  #homeView .cab-head { text-align: center; margin-bottom: 4px; }
  #homeView .cab-hi { font-size: 23px; line-height: 29px; }
  #homeView .cab-sub { font-size: 13px; line-height: 18px; margin-top: 2px; }

  /* Сетка в столбик; порядок orb→biz задаёт grid-template-areas из home.css. */
  #homeView .cab-grid { gap: 10px; }

  /* Планета — главный акцент, умеренный размер, кликабельна. */
  #homeView #cabOrb { max-width: 196px; margin: 2px auto; cursor: pointer; }
  #homeView .cab-orb-mark { font-size: 18px; }

  /* Повторы убираем (доступны из таб-бара) — экран короче. */
  #homeView #cabOffice, #homeView .cab-side { display: none; }

  /* Компактная карточка «Ваш бизнес» с честными пустыми состояниями. */
  #homeView #cabBiz { padding: 14px 16px; border-radius: 18px; }
  #homeView .cab-biz-name { font-size: 16px; line-height: 21px; }
  #homeView .cab-metric, #homeView .cab-noticed { margin-top: 10px; }
  #homeView .cab-metric-t, #homeView .cab-noticed-t { font-size: 11px; letter-spacing: .02em; }
  #homeView .cab-metric-v, #homeView .cab-noticed-v { font-size: 12.5px; line-height: 17px; }

  /* Строка ввода — крупное первичное действие. */
  #homeView .cab-ask { margin-top: 14px; }
  #homeView .cab-ask-i { font-size: 16px; padding: 13px 0; }

  /* Дисклеймер — мелкий, не занимает место. */
  #homeView .cab-fine { margin-top: 10px; font-size: 11px; line-height: 15px; }
}

/* ---------- 8. «Мой офис» на телефоне: компактно, без простыни -------------
   Сетка исполнителей — только мобайл (на десктопе скрыта). Плитки 2-в-ряд,
   задачи — горизонтальной лентой, ввод компактно над таб-баром. Десктоп не
   затрагивается: базовое #ofCrew{display:none}, раскладка меняется только ≤600. */
#ofCrew { display: none; }   /* десктоп: сетки исполнителей нет */

@media (max-width: 600px) {
  #officeHome .of-greet { font-size: 21px; line-height: 1.25; margin-bottom: 14px; }

  /* «Что сейчас важно» — компактно на телефоне. */
  #officeHome .of-next { margin-bottom: 16px; gap: 8px; }
  #officeHome .of-next-item { padding: 12px 14px; gap: 10px; }
  #officeHome .of-next-t { font-size: 14px; }
  #officeHome .of-next-h { font-size: 12px; }

  /* Исполнители — компактная сетка 2 в ряд, тап ≥44px. */
  #ofCrew { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 14px; }
  #ofCrew .of-hex-sm { --hs: 34px; }
  #ofCrew .of-crew-c {
    display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 9px 11px;
    text-align: left; border: 1px solid var(--wv-line); border-radius: 14px;
    background: rgba(255, 255, 255, .02); color: var(--wv-text); font: inherit; cursor: pointer;
    transition: border-color .16s var(--wv-e), transform .12s var(--wv-e);
  }
  #ofCrew .of-crew-c:hover { border-color: var(--wv-line-2); }
  #ofCrew .of-crew-c:active { transform: scale(.98); }
  #ofCrew .of-crew-b { display: flex; flex-direction: column; min-width: 0; }
  #ofCrew .of-crew-t { font-size: 14px; font-weight: 600; letter-spacing: -.01em;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  #ofCrew .of-crew-r { font-size: 11px; color: var(--wv-mute);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

  /* Adaptive quick actions: длинные подписи («Проанализировать») переносим. */
  #officeHome .of-tile.of-qa .of-tile-t {
    font-size: 14.5px; line-height: 1.18; white-space: normal; overflow-wrap: break-word;
  }

  /* Плитки задач — 2 в ряд, компактные вертикальные карточки, короткий текст. */
  #officeHome .of-tiles { grid-template-columns: 1fr 1fr; gap: 10px; }
  #officeHome .of-tile { flex-direction: column; align-items: flex-start; gap: 8px;
    padding: 12px; min-height: 56px; }
  #officeHome .of-hex-lg { --hs: 40px; }
  #officeHome .of-tile-txt { gap: 3px; }
  #officeHome .of-tile-t { font-size: 14px; line-height: 1.2; }
  #officeHome .of-tile-d { font-size: 11px; line-height: 1.35;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

  /* Список задач — горизонтальная лента, не растягивает экран вниз. */
  #officeHome .of-tasks { flex-direction: row; overflow-x: auto; overflow-y: hidden;
    gap: 8px; padding-bottom: 4px; }
  #officeHome .of-task { flex: 0 0 auto; width: auto; min-width: 172px; }
  #officeHome .of-newtask { min-height: 46px; }

  /* Ввод + селектор специалиста — компактно (над таб-баром). */
  #officeHome .of-bar { gap: 8px; padding-top: 12px; }
  #officeHome .of-input { font-size: 15px; }

  /* Чат «Мой офис»: карточка подстраивается под экран, композер над таб-баром. */
  #officeView .chat-section {
    max-width: 100%; padding: 8px 10px 0;
  }
  #officeView .chat-card {
    height: auto; min-height: calc(100dvh - 150px); border-radius: 14px;
    margin-bottom: calc(var(--tabbar-h) + env(safe-area-inset-bottom, 0px) + 8px);
  }
}

/* ---------- 9. Супербизнес на телефоне: секции-вкладки вместо простыни -------
   Вверху: кнопка «Назначить заседание» + ниша со «сменить». Ниже — сегмент-
   контрол (Инструменты · Темы · Расчёты · Документы); показывается контент
   только активной секции. Десктоп не трогаем: сегмент скрыт, видно всё. */
.sb-seg { display: none; }   /* десктоп: вкладок нет, показывается всё */

@media (max-width: 600px) {
  /* Компактная шапка: большой заголовок/подзаголовок/планету убираем. */
  .sb-sup .sb-sup-glow,
  .sb-sup .sb-sup-t,
  .sb-sup .sb-sup-s { display: none; }
  .sb-sup .sb-sup-head { margin-top: 4px; margin-bottom: 4px; }
  .sb-sup .sb-niche-line { margin-top: 2px; }
  .sb-sup .sb-sup-go { margin-top: 10px; min-height: 56px; }

  /* Сегмент-контрол. */
  .sb-seg {
    display: flex; gap: 4px; margin: 12px 0 14px; padding: 4px;
    background: rgba(255, 255, 255, .04); border: 1px solid var(--line, rgba(255,255,255,.08));
    border-radius: 14px;
    overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
  }
  .sb-seg::-webkit-scrollbar { display: none; height: 0; }
  .sb-seg-b {
    flex: 0 0 auto; min-height: 42px; padding: 0 16px;
    border: 0; border-radius: 10px; background: none;
    color: #8B90A8; font-family: "Onest", system-ui, sans-serif;
    font-size: 13.5px; font-weight: 600; letter-spacing: -.01em; cursor: pointer;
    white-space: nowrap;
    transition: color .15s var(--wv-e, cubic-bezier(.2,0,0,1));
  }
  .sb-seg-b.is-on {
    background: linear-gradient(135deg, #4DA6FF, #A855F7); color: #fff;
    box-shadow: 0 6px 18px rgba(77,166,255,.28);
  }

  /* По умолчанию прячем все секции; показываем только активную. */
  .sb-sup .sb-tools-h, .sb-sup .sb-tools,
  .sb-sup .sb-drop,
  .sb-sup .sb-col-topics, .sb-sup .sb-col-calc { display: none; }
  .sb-sup .sb-cols { display: block; margin-top: 0; gap: 0; }
  .sb-sup .sb-tools-h { margin-top: 0; }

  .sb-sup.sec-tools  .sb-tools-h { display: flex; }
  .sb-sup.sec-tools  .sb-tools   { display: grid; grid-template-columns: 1fr; }
  .sb-sup.sec-topics .sb-col-topics { display: block; }
  .sb-sup.sec-calc   .sb-col-calc   { display: block; }
  .sb-sup.sec-docs   .sb-drop       { display: flex; }
}

/* ---------- 10. Вкладка «Ещё»: список пунктов ------------------------------- */
.more-wrap { padding: 18px 16px; max-width: 640px; margin: 0 auto; }
.more-title { font-size: 26px; font-weight: 800; letter-spacing: -.03em;
  color: var(--wv-text, #EAECF5); margin: 4px 0 16px; }

.more-profile {
  display: flex; align-items: center; gap: 14px; padding: 16px;
  border: 1px solid var(--wv-line, rgba(255,255,255,.08)); border-radius: 18px;
  background: linear-gradient(180deg, rgba(25,26,40,.6), rgba(18,19,31,.4)); margin-bottom: 14px;
}
.more-av {
  width: 48px; height: 48px; flex: none; display: grid; place-items: center;
  border-radius: 50%; background: linear-gradient(135deg, #4DA6FF, #A855F7);
  color: #fff; font-size: 20px; font-weight: 800;
  box-shadow: 0 4px 14px rgba(77,166,255,.3);
}
.more-pf { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.more-pf-n { font-size: 17px; font-weight: 700; letter-spacing: -.01em; color: var(--wv-text, #EAECF5);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.more-pf-p { font-size: 13px; color: var(--wv-mute, #8B90A8); }

.more-list { display: flex; flex-direction: column; gap: 10px; }
.more-item {
  display: flex; align-items: center; gap: 14px; width: 100%; text-align: left;
  min-height: 60px; padding: 12px 14px;
  border: 1px solid var(--wv-line, rgba(255,255,255,.08)); border-radius: 16px;
  background: rgba(255,255,255,.02); color: var(--wv-text, #EAECF5); font: inherit; cursor: pointer;
  transition: border-color .16s var(--wv-e, cubic-bezier(.2,0,0,1)), background .16s var(--wv-e, cubic-bezier(.2,0,0,1));
}
.more-item:hover { border-color: var(--wv-line-2, rgba(255,255,255,.18)); background: rgba(255,255,255,.04); }
.more-item.more-static { cursor: default; }
.more-item.more-static:hover { border-color: var(--wv-line, rgba(255,255,255,.08)); background: rgba(255,255,255,.02); }
.more-ic {
  width: 42px; height: 42px; flex: none; display: grid; place-items: center;
  color: #E6ECFF;
  background: linear-gradient(135deg, rgba(77,166,255,.18), rgba(168,85,247,.18));
  clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  filter: drop-shadow(0 0 8px rgba(77,166,255,.3));
}
.more-ic svg { width: 22px; height: 22px; display: block; }
.more-b { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.more-t { font-size: 15.5px; font-weight: 600; letter-spacing: -.01em; }
.more-s { font-size: 12.5px; line-height: 17px; color: var(--wv-mute, #8B90A8); }
.more-chev { width: 18px; height: 18px; flex: none; color: var(--wv-mute, #8B90A8); }
.more-danger .more-t { color: #FF8A8A; }

.more-meetings { display: flex; flex-direction: column; gap: 6px; padding: 2px 2px 4px; }
.more-meet {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  min-height: 48px; padding: 10px 14px; width: 100%; text-align: left;
  border: 1px solid var(--wv-line, rgba(255,255,255,.08)); border-radius: 12px;
  background: rgba(255,255,255,.02); color: var(--wv-text, #EAECF5); font: inherit; cursor: pointer;
}
.more-meet:hover { border-color: var(--wv-line-2, rgba(255,255,255,.18)); }
.more-meet-t { font-size: 14.5px; font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.more-meet-d { font-size: 12px; color: var(--wv-mute, #8B90A8); flex: none; }
.more-empty { font-size: 13.5px; line-height: 20px; color: var(--wv-mute, #8B90A8); padding: 10px 6px; }

/* ---------- 11. Убираем дубли профиля/статуса из разделов (они в «Ещё») ------
   Только мобайл; данные не удаляются — прячется отображение. */
@media (max-width: 600px) {
  /* «Мой офис»: плашка пользователя (профиль) — теперь в «Ещё». */
  #officeHome .of-user { display: none; }
  /* Супербизнес (боковой drawer): профиль и состояние — теперь в «Ещё». */
  .sb-side .sb-user, .sb-side .sb-state { display: none; }
}

/* ---------- 12. Telegram Mini App — чистка и интеграция ----------------------
   Только внутри Telegram (класс in-telegram от tg.js). Ни десктоп, ни мобильный
   веб не затрагиваются. Задача: убрать дубли и «простыню», сделать каждый экран
   с одной ясной ролью. Логику не трогаем — только отображение.
   Правила идут после telegram.css (mobile.css подключается последним) и потому
   перекрывают его при равной специфичности. */

/* Новые элементы по умолчанию скрыты — показываются только в Mini App. */
.home-cta { display: none; }

/* --- Главная: только обзор, без поля чата (чат живёт в «Мой офис») --- */
body.in-telegram #homeView .cab-ask  { display: none; }
body.in-telegram #homeView .cab-fine { margin-top: 12px; }
body.in-telegram .home-cta {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; margin-top: 16px; min-height: 54px; padding: 0 18px;
  border: 0; border-radius: 16px; cursor: pointer;
  background: linear-gradient(135deg, #4DA6FF, #A855F7); color: #fff;
  font-family: "Onest", system-ui, sans-serif;
  font-size: 16px; font-weight: 700; letter-spacing: -.01em;
  box-shadow: 0 10px 26px rgba(77,166,255,.30);
  transition: transform .12s var(--wv-e, cubic-bezier(.2,0,0,1));
}
body.in-telegram .home-cta:active { transform: scale(.98); }
body.in-telegram .home-cta svg { width: 20px; height: 20px; flex: none; }

/* --- Мой офис: имена исполнителей не обрезаем — даём перенестись на две строки. */
body.in-telegram #ofCrew .of-crew-c { align-items: flex-start; }
body.in-telegram #ofCrew .of-crew-t {
  white-space: normal; overflow: visible; text-overflow: clip; line-height: 1.15;
}

/* --- Супербизнес: лишний гамбургер/боковой drawer не нужен ---
   Навигация — в нижнем таб-баре, профиль/состояние/заседания — во вкладке «Ещё». */
body.in-telegram .sb-burger { display: none; }

/* Уважаем системную настройку «меньше движения». */
@media (prefers-reduced-motion: reduce) {
  .sb-side, .sb-scrim, .tab { transition: none; }
}