/* ── SLOVO: оформление только для айфона ──────────────────────────────────
 *
 * Отдельный слой поверх guestro, включаемый признаком `data-skin="slovo"`.
 * Признак ставит клиент и только на нативном айфоне — веб и настольная
 * программа этого файла не видят вовсе. Так новый вид не может сломать то,
 * что работает у остальных: у них просто нет этих правил.
 *
 * Палитра не переопределяется: ночные цвета Slovo совпали с нашими до знака —
 * 0D0D12, 1A1A21, 24242E, 3A5EFF. Здесь только устройство экранов, ради
 * которого всё и затевалось.
 *
 * Числа взяты не с глаза, а из исходников их приложения
 * (`mobile/ios-native/Slovo/…`, ветка ios-slovo-simulator): Metric, шрифты
 * SwiftUI и отступы там записаны прямо. Пересчёт очевидный — точка в точку,
 * потому что вебвью у нас идёт один к одному: 402×874 при dpr 3, ровно
 * столько же, сколько SwiftUI считает точек на том же телефоне. Проверено
 * замером, а не предположением.
 *
 * Наши правила стоят после guestro и потому перебивают его при равном весе.
 * `!important` здесь не украшение: слой guestro сам написан с ним, а часть
 * размеров задана прямо в разметке — иначе не достать.
 */

/* ── Стекло ───────────────────────────────────────────────────────────────
 * Владелец просил glassEffect. Системного из вебвью не достать ни при каком
 * пороге, поэтому материя своя: сильное размытие с подъёмом насыщенности,
 * светлая кромка сверху и тонкое кольцо по краю. От нашего стекла отличается
 * тем, что светлее и холоднее — у них поверхность пропускает фон, а не
 * закрывает его.
 */
/* Тема guestro отменяет стекло целиком — `backdrop-filter: none` на всех
 * стеклянных классах, блик и кант спрятаны, ореолы обнулены. Она задумана
 * плоской, и это её право. Оформление SLOVO стекло возвращает — но не всему
 * подряд.
 *
 * Правило откуда брать взято у них дословно: «Скло — шар керування, який
 * лежить над вмістом. Тому воно тільки там, де людина натискає, і ніде
 * більше». Стекло получают панель, плашки, чипы, кнопки и листы. Не получают
 * пузыри, строки списка и карточки: это содержимое, под ним ничего не
 * просвечивает, а полупрозрачность стоила бы контраста.
 *
 * Одного размытия мало. На плоском почти чёрном фоне размывать нечего, и
 * поверхность остаётся такой же плоской, только мутной. Материю делают четыре
 * вещи вместе: размытие с подъёмом насыщенности и яркости, светлая плёнка,
 * тонкая кромка по краю и блик сверху. Убери любую — стекла снова нет.
 */
[data-skin="slovo"] {
  /* Размытие маленькое, а подъём яркости большой. Наоборот было главной
     ошибкой: 22–30 пикселей по редкому тексту на почти чёрном фоне усредняют
     всё в чёрное, и поверхность становится непрозрачной плитой. Проверено
     полосами прямо над списком — при 22 за стеклом пусто, при 9 строка
     читается, как в макете. */
  --скло: blur(5px) saturate(190%) brightness(1.48);
  /* Плёнка почти сходит на нет: у них сквозь панель читается текст строки,
     которая под ней проходит. Плотная плёнка это и убивала — поверхность
     становилась серой плашкой, только мутной. */
  --плівка-верх: rgba(255, 255, 255, 0.05);
  --плівка-низ: rgba(255, 255, 255, 0.05);
  /* Кромка — не обводка одной толщины по кругу, а фаска: вверху слева она
     ловит свет, внизу справа почти гаснет. Объём делает именно она.
     Рисуем её тенями, а не градиентом на border-box: тот заливает всю
     поверхность, а не край, и стекло становится молочной плашкой. На этом я
     и попался — сквозь неё уже ничего не читалось. */
  /* В покое — только волосяная обводка и еле заметная светлая линия сверху.
     Толстая фаска была ошибкой: погнавшись за объёмом, я получил хромированную
     кнопку из нулевых. Сравнение их чипа с нашим на одном телефоне не оставило
     сомнений — у них поверхность в покое почти невидима. Объём живёт в
     нажатии, и там ему и место. */
  --кант: rgba(255, 255, 255, 0.10);
  --фаска: inset 0 1px 0 rgba(255, 255, 255, 0.11);
  --скло-тінь: 0 6px 20px rgba(0, 0, 0, 0.34);
}
[data-skin="slovo"][data-mode="light"] {
  --скло: blur(5px) saturate(170%) brightness(1.03);
  --плівка-верх: rgba(255, 255, 255, 0.58);
  --плівка-низ: rgba(255, 255, 255, 0.58);
  --кант: rgba(13, 13, 18, 0.09);
  --фаска: inset 0 1px 0 rgba(255, 255, 255, 0.60);
  --скло-тінь: 0 6px 20px rgba(13, 13, 18, 0.12);
}
[data-skin="slovo"][data-mode="mono"] {
  --плівка-верх: rgba(255, 255, 255, 0.055);
  --плівка-низ: rgba(255, 255, 255, 0.055);
}

/* Стекло собирается из четырёх слоёв разом, и убери любой — объём пропадает:
   размытие с подъёмом насыщенности и яркости; плёнка градиентом сверху вниз;
   фаска по краю — светлая вверху слева, гаснущая внизу справа; тень внутри у
   нижнего края и подъём над фоном снаружи.
   Кромка нарисована двумя фонами, а не масками: маски с исключением умеет
   не всякий WebKit, и там, где не умеет, кольцо превращается в заливку. */
[data-skin="slovo"] .nav-cap,
[data-skin="slovo"] .glass-pill,
[data-skin="slovo"] .glass-menu,
[data-skin="slovo"] .glass-deep,
[data-skin="slovo"] .chat-head-act,
[data-skin="slovo"] .edit-act,
[data-skin="slovo"] .call-bar,
[data-skin="slovo"] .call-pip,
[data-skin="slovo"] .push-banner,
[data-skin="slovo"] .toast-bar,
[data-skin="slovo"] .composer-shell,
[data-skin="slovo"] .call-btn:not([style*="--c-red"]),
[data-skin="slovo"] .filter-chip.glass-pill {
  background: var(--плівка-верх) !important;
  border: 1px solid var(--кант) !important;
  backdrop-filter: var(--скло) !important;
  -webkit-backdrop-filter: var(--скло) !important;
  box-shadow: var(--фаска), var(--скло-тінь) !important;
}

/* Выбранная вкладка — своё стёклышко внутри стекла, со своей фаской: у них
   она отдельной каплей и краем от панели отличается. */
[data-skin="slovo"] .nav-cap [data-tab].nav-on {
  background: rgba(var(--c-accentRgb), 0.18) !important;
  border: 1px solid rgba(var(--c-accentRgb), 0.24) !important;
  box-shadow: 0 0 22px rgba(var(--c-accentRgb), 0.30) !important;
}

/* Блик и кант прежнего оформления держим спрятанными. Они рисовались поверх
   всей поверхности и работали как белая заливка: капсула становилась серой
   плашкой, сквозь которую уже ничего не читалось. Край теперь рисует фаска,
   и вторая подсветка поверх неё только гасит прозрачность. */
[data-skin="slovo"] .sheen::after,
[data-skin="slovo"] .rim::before { display: none !important; }

/* Акцентные круги — то же стекло, подкрашенное акцентом. Заливка сплошная
   съедает всё, что под ней, и кнопка перестаёт лежать НАД содержимым. */
[data-skin="slovo"] .fab,
[data-skin="slovo"] .send-btn {
  background: color-mix(in srgb, var(--c-accent) 92%, transparent) !important;
  backdrop-filter: var(--скло) !important;
  -webkit-backdrop-filter: var(--скло) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), var(--скло-тінь) !important;
}

/* ── Крупный заголовок ────────────────────────────────────────────────────
 * 32 против наших 28. Через переменную, а не числом с !important: иначе
 * вместе с размером умерло бы и сжатие заголовка при прокрутке.
 */
[data-skin="slovo"] { --title-size: 32px; }

/* ── Поиск ────────────────────────────────────────────────────────────────
 * Высота у нас уже их — 38. Разошлась только форма: у них капсула.
 */
[data-skin="slovo"] .search-pill { border-radius: 19px !important; }

/* ── Чипы отбора ──────────────────────────────────────────────────────────
 * Капсула 34 точки, подпись 15. Число рядом с подписью — просто текст, а не
 * второй значок: у нас оно лежало в своей заливке и читалось как отдельная
 * метка. Активный чип — плоский акцент без ореола: у них на экране одно
 * действие одного цвета, и свечение вокруг чипа спорило бы с кнопкой внизу.
 */
[data-skin="slovo"] .filter-chip {
  height: 34px; padding: 0 14px !important;
  border-radius: 17px !important;
  font-size: 15px !important; gap: 6px !important;
}
[data-skin="slovo"] .filter-chip[data-on="true"] {
  background: var(--c-accent) !important;
  box-shadow: none !important;
}
[data-skin="slovo"] .chip-count {
  background: none !important;
  min-width: 0 !important; height: auto !important; padding: 0 !important;
  border-radius: 0 !important;
  font-family: var(--font-sans) !important;
  font-size: 12px !important; font-weight: 500 !important;
  color: var(--c-sub) !important;
}
[data-skin="slovo"] .filter-chip[data-on="true"] .chip-count {
  color: rgba(255, 255, 255, 0.75) !important;
}

/* ── Подпись раздела ──────────────────────────────────────────────────────
 * У них это тихая серая строчка, и всё. Наша акцентная полоска слева —
 * находка прошлого оформления; здесь она лишняя, потому что рядом стоит
 * акцентный чип, и два синих пятна в одном углу спорят друг с другом.
 */
[data-skin="slovo"] .sec-label { padding: 14px 16px 4px !important; gap: 0 !important; }
[data-skin="slovo"] .sec-bar { display: none !important; }
[data-skin="slovo"] .sec-text { font-size: 13px !important; color: var(--c-sub) !important; }

/* ── Строка беседы ────────────────────────────────────────────────────────
 * Их строка просторнее нашей: лицо 48 против 44, отбивка сверху и снизу по 9
 * против 5. Имя 16 против 15, строчка под ним 15 против 13.5 — и она у них
 * серая, а не почти белая: в списке из десяти бесед второй строкой читают
 * редко, и белым она перетягивает взгляд с имён.
 */
[data-skin="slovo"] .chat-row { padding: 9px 0 !important; gap: 11px !important; }
[data-skin="slovo"] .chat-row .avatar-box,
[data-skin="slovo"] .chat-row .avatar-mono { width: 48px !important; height: 48px !important; }
[data-skin="slovo"] .chat-row .avatar-ini { font-size: 20px !important; }
[data-skin="slovo"] .row-name { font-size: 16px !important; }
[data-skin="slovo"] .row-prev { font-size: 15px !important; color: var(--c-sub) !important; }
[data-skin="slovo"] .row-time { font-size: 12px !important; color: var(--c-ph) !important; }

/* Значок непрочитанного — круг, а не квадратик со скруглением. */
[data-skin="slovo"] .row-badge { border-radius: 10px !important; }

/* «Чернетка:» у них — обычное слово в строке, красное и чуть плотнее
   соседнего текста. Наши заглавные моноширинные кричат громче самого
   черновика. */
[data-skin="slovo"] .row-draft {
  font-family: var(--font-sans) !important;
  text-transform: none !important; letter-spacing: 0 !important;
  font-size: 15px !important; font-weight: 500 !important;
}

/* ── Круглая кнопка внизу ─────────────────────────────────────────────────
 * 58 против наших 48, и без синего ореола: у них под кнопкой обычная тень.
 */
[data-skin="slovo"] .fab {
  width: 58px !important; height: 58px !important;
  right: 18px !important;
  bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
}

/* Кто написал в группу — тем же серым, что и сама строка. Белое имя внутри
   серой строчки у них не выделено вовсе, а у нас перетягивало на себя взгляд
   с настоящего имени беседы строкой выше. */
[data-skin="slovo"] .row-prev-who { color: inherit !important; }
[data-skin="slovo"] .row-draft-text { color: var(--c-sub) !important; }

/* ── Нижняя панель ────────────────────────────────────────────────────────
 * Капсула у них того же роста, а вот выбранная вкладка сидит в тихой серой
 * пилюле, а не в синей с кольцом: синим у них помечены значок и подпись, и
 * третье синее пятно вокруг них лишнее.
 */
[data-skin="slovo"] .nav-cap [data-tab] {
  box-shadow: none !important;
}
[data-skin="slovo"] .nav-cap [data-tab].nav-on {
  background: rgba(var(--fg-rgb), 0.09) !important;
}

/* Метка группы перед именем — у них она есть, и по ней групповая беседа
   видна раньше, чем прочитано имя. */
[data-skin="slovo"] .row-group-mark { display: inline-flex; }

/* ══ Розмова ══════════════════════════════════════════════════════════════ */

/* ── Пузыри ───────────────────────────────────────────────────────────────
 * Главное расхождение всего оформления. У нас исходящий пузырь залит синим и
 * написан белым; у них — тусклая тёмно-синяя подкладка с акцентной обводкой,
 * и текст в нём такой же, как во входящем. Их довод записан прямо в исходнике:
 * залитая цветом строка кричит там, где её надо просто читать. Метка времени
 * у них серая в обе стороны, а не белая на синем.
 *
 * Заодно снимаем стекло и зерно: пузырь у них — плотная краска, а не материя.
 * Размытие под каждым пузырём вдобавок стоит дорого при прокрутке.
 */
/* Цвета пузыря висят на палитре, а не на признаке оформления. Сперва они
 * стояли прямо на `[data-skin]`, и светлая тема получала ночной пузырь:
 * тёмно-синяя подкладка со светлым текстом на белом листе. Замечено на
 * стенде, а не на телефоне, — и только потому, что снимок делается в каждой
 * теме, а не в одной.
 *
 * Бурштин и контур своих строк здесь не имеют: их пузыри заданы вместе с
 * остальной палитрой в styles.css и уже совпадают с их темой.
 */
[data-skin="slovo"] {
  /* Ширина пузыря у них 268, а не 290: строка длиннее плохо возвращает глаз
     к началу следующей. */
  --bubble-max: 268px;
}
[data-skin="slovo"][data-mode="dark"] {
  --c-bIn: #171821;
  --c-bOut: #1B2340;
  --c-bOutBorder: #2E4794;
  --c-bOutText: #EEEEEE;
  --c-bOutMeta: #808898;
  --c-bInMeta: #808898;
  --c-bOutTick: #5F8EFC;
}
[data-skin="slovo"][data-mode="light"] {
  --c-bIn: #FFFFFF;
  --c-bOut: #E7EDFF;
  --c-bOutBorder: #B9CBFF;
  --c-bOutText: #131720;
  --c-bOutMeta: #55606E;
  --c-bInMeta: #55606E;
  --c-bOutTick: #3A5EFF;
}
[data-skin="slovo"] .bubble-in,
[data-skin="slovo"] .bubble-out {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  padding: 9px 12px 7px !important;
}
[data-skin="slovo"] .bubble-in::before,
[data-skin="slovo"] .bubble-out::before { display: none !important; }
[data-skin="slovo"] .bubble-in {
  background: var(--c-bIn) !important;
  border: none !important;
  color: var(--c-bInText) !important;
}
[data-skin="slovo"] .bubble-out {
  background: var(--c-bOut) !important;
  border: 1px solid var(--c-bOutBorder) !important;
  color: var(--c-bOutText) !important;
}
/* Галочки в исходящем пузыре тоже из токена: белым по светло-голубому их
   не видно. */
[data-skin="slovo"] .bubble-out .msg-meta svg { stroke: var(--c-bOutTick) !important; }
[data-skin="slovo"] .msg-text { line-height: 1.27 !important; }

/* Время в пузыре — обычным начертанием с ровными цифрами, а не моноширинным.
   Моноширинный у нас означает телеметрию; здесь это просто время. */
[data-skin="slovo"] .msg-meta > span {
  font-family: var(--font-sans) !important;
  font-size: 10px !important;
}

/* ── Полотно разговора ────────────────────────────────────────────────────
 * Ни сетки, ни виньетки: у них под сообщениями ровный фон. Сетку тема
 * guestro уже снимала, но правило ниже по файлу возвращало её обратно.
 */
[data-skin="slovo"] .chat-grid-bg,
[data-skin="slovo"] .chat-canvas { background-image: none !important; }
[data-skin="slovo"].phone > .screen::after { display: none !important; }

/* ── Шапка разговора ──────────────────────────────────────────────────────
 * У них шапки как плашки нет вовсе: над разговором висят стеклянные кружки,
 * а содержимое проходит под ними. Наша полоса со скруглённым низом режет
 * экран поперёк ровно там, где у них ничего не нарисовано.
 *
 * Кружков теперь три, как у них: таймер ушёл строкой в карточку чата, а
 * видеозвонок — в выбор под трубкой. Оттого и размер их: 40.
 */
[data-skin="slovo"] .chat-head {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 0 !important;
  padding: 8px 12px 10px !important;
  gap: 5px !important;
}
[data-skin="slovo"] .chat-head::before,
[data-skin="slovo"] .chat-head::after { display: none !important; }

[data-skin="slovo"] .chat-head-act {
  width: 40px !important; height: 40px !important;
  background: rgba(var(--fg-rgb), 0.07) !important;
  border: 1px solid rgba(var(--fg-rgb), 0.11) !important;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}
/* Значки действий у них синие, и только стрелка назад остаётся белой:
   цветом помечено то, что делает что-то с разговором, а не выход из него. */
[data-skin="slovo"] .chat-head-act + .chat-head-who ~ .chat-head-act svg {
  stroke: var(--c-blue) !important;
}
[data-skin="slovo"] .chat-head-who { gap: 9px !important; padding-left: 3px !important; }

/* Выбор вида звонка вытекает из кружка трубки — стекло то же, что у чипов. */
[data-skin="slovo"] .call-choice { box-shadow: 0 10px 28px rgba(0, 0, 0, 0.45) !important; }

/* ── Журнал звонков ───────────────────────────────────────────────────────
 * Черты между строками у них нет: список держит отбивка, а не линейка.
 * Лицо 44, как в их строке звонка — чуть меньше, чем в списке бесед: там
 * лицо ведёт в разговор, здесь оно только подпись к записи.
 */
[data-skin="slovo"] .call-row { border-bottom: none !important; padding: 9px 0 !important; }
[data-skin="slovo"] .call-row .avatar-box,
[data-skin="slovo"] .call-row .avatar-mono { width: 44px !important; height: 44px !important; }
[data-skin="slovo"] .call-row .avatar-ini { font-size: 18.5px !important; }

/* ══ Профиль ══════════════════════════════════════════════════════════════ */

/* Правка профиля — круглая стеклянная кнопка с карандашом, без подписи:
   в их шапке действие всегда кружок, и подпись рядом с ним лишняя. */
[data-skin="slovo"] .edit-act {
  width: 40px !important; height: 40px !important;
  border-radius: 50%; padding: 0 !important;
  justify-content: center;
  background: rgba(var(--fg-rgb), 0.07) !important;
  border: 1px solid rgba(var(--fg-rgb), 0.11) !important;
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
}
[data-skin="slovo"] .edit-act .edit-label { display: none; }
[data-skin="slovo"] .edit-act svg { width: 17px; height: 17px; }

/* Карточка человека лежачая: лицо слева, подписи справа, всё в плашке.
   Столбиком по центру карточка занимает треть экрана и отодвигает настройки
   за нижний край — а на этот экран приходят именно за ними. */
[data-skin="slovo"] .me-card {
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 4px 16px 22px;
  padding: 14px !important;
  border-radius: 20px;
  background: var(--c-surface);
}
[data-skin="slovo"] .me-card .avatar-box,
[data-skin="slovo"] .me-card .avatar-mono { width: 64px !important; height: 64px !important; }
[data-skin="slovo"] .me-card .avatar-ini { font-size: 25px !important; }
[data-skin="slovo"] .me-text { text-align: left !important; min-width: 0; }
[data-skin="slovo"] .me-name { font-size: 20px !important; }

/* Значки строк — синие сами по себе, без серой подложки: подложка под каждой
   строкой превращает список в решётку из квадратов. */
[data-skin="slovo"] .set-mark {
  background: none !important;
  width: 26px !important; height: 26px !important;
}

/* ══ Контакты ═════════════════════════════════════════════════════════════
 * Черты между строками нет — список держит отбивка. Буква раздела обычным
 * начертанием, а не моноширинным вразрядку: моноширинный у нас значит
 * телеметрию, а это просто «А».
 */
[data-skin="slovo"] .contact-row { border-bottom: none !important; padding: 9px 0 !important; }
[data-skin="slovo"] .contact-row .avatar-box,
[data-skin="slovo"] .contact-row .avatar-mono { width: 44px !important; height: 44px !important; }
[data-skin="slovo"] .contact-row .avatar-ini { font-size: 18.5px !important; }
[data-skin="slovo"] .contact-letter {
  font-family: var(--font-sans) !important;
  font-size: 13px !important; font-weight: 600 !important;
  letter-spacing: 0 !important; padding: 14px 0 4px !important;
}

/* ══ Розмова голосом ══════════════════════════════════════════════════════
 * Мягкий ореол вокруг лица вместо сканера и уголков: у них лицо не «цель»,
 * а человек, и вокруг него только свет.
 */
[data-skin="slovo"] .call-face {
  position: relative;
  box-shadow: 0 0 0 1px rgba(var(--c-accentRgb), 0.16),
              0 0 60px 20px rgba(var(--c-accentRgb), 0.10);
  border-radius: 50%;
}
/* Полотно разговора ровное — сетка сюда тоже не переехала. */
[data-skin="slovo"] .call-window { background-image: none !important; }

/* ══ Меню повідомлення ════════════════════════════════════════════════════
 * Устройство у нас с ними и так одно: строка реакций, само сообщение, карточка
 * действий с подписью слева и значком справа. Расходятся мелочи.
 */
/* Акцентного кольца вокруг сообщения у них нет: поднятое сообщение и так
   единственное, что не притушено, — обводка вокруг него ничего не добавляет. */
[data-skin="slovo"] .msg-preview { box-shadow: none !important; }
/* Черта под последней строкой рисовала карточке лишнее дно. */
[data-skin="slovo"] .msg-menu-item:last-child { border-bottom: none !important; }
[data-skin="slovo"] .msg-menu-item { padding: 15px 16px !important; }

/* ══ Строка ввода ═════════════════════════════════════════════════════════
 * Капсула у них 46 в высоту, и кнопка записи ровно такая же: кнопка выше поля
 * читается как отдельный орган, а не как пара к нему.
 */
[data-skin="slovo"] .composer-shell { height: 46px; padding: 0 6px 0 6px !important; }
[data-skin="slovo"] .composer-shell input { height: 44px !important; }
[data-skin="slovo"] .send-btn {
  width: 46px !important; height: 46px !important;
  box-shadow: none !important;
}

/* ══ Карточки настроек ════════════════════════════════════════════════════
 * У них карточка — залитая плашка без обводки; рамка вокруг заливки рисует
 * второй край там, где край уже есть.
 */
[data-skin="slovo"] .set-card { border: none !important; }

/* ══ «Печатает» ═══════════════════════════════════════════════════════════
 * Точки у них светло-синие, как и подпись рядом: акцент здесь означал бы
 * действие, а это не действие, а состояние собеседника.
 */
[data-skin="slovo"] .tdots span { background: var(--c-blue); }
[data-skin="slovo"] .tdots { margin-right: 2px; }

/* ══ Нажатие ══════════════════════════════════════════════════════════════
 * Под пальцем стекло не тускнеет, а становится **толще**: фаска глубже,
 * подсветка сверху ярче, тень внутри у нижнего края плотнее. Так ведёт себя
 * настоящая линза, на которую нажали, и так это сделано у них — своих правил
 * нажатия в их коде нет вовсе, весь отклик даёт `.interactive()` у стекла.
 *
 * Прежнее оформление отвечало на нажатие прозрачностью и запрещало масштаб.
 * Здесь наоборот: гасить стекло — значит на миг его терять, а нужно ровно
 * обратное — показать, что оно есть и его продавили.
 */
[data-skin="slovo"] {
  --плівка-натиск-верх: rgba(255, 255, 255, 0.13);
  --плівка-натиск-низ: rgba(255, 255, 255, 0.03);
  --фаска-натиск: inset 2px 2px 0 -0.5px rgba(255, 255, 255, 0.62),
                  inset -2px -2px 0 -0.5px rgba(255, 255, 255, 0.18),
                  inset 0 14px 14px -12px rgba(255, 255, 255, 0.42),
                  inset 0 -16px 20px -12px rgba(0, 0, 0, 0.66);
}
[data-skin="slovo"][data-mode="light"] {
  --плівка-натиск-верх: rgba(255, 255, 255, 0.92);
  --плівка-натиск-низ: rgba(255, 255, 255, 0.60);
  --фаска-натиск: inset 2px 2px 0 -0.5px rgba(255, 255, 255, 1),
                  inset -2px -2px 0 -0.5px rgba(13, 13, 18, 0.08),
                  inset 0 14px 14px -12px rgba(255, 255, 255, 0.80),
                  inset 0 -16px 20px -12px rgba(13, 13, 18, 0.20);
}

[data-skin="slovo"] .nav-cap,
[data-skin="slovo"] .glass-pill,
[data-skin="slovo"] .glass-menu,
[data-skin="slovo"] .chat-head-act,
[data-skin="slovo"] .edit-act,
[data-skin="slovo"] .call-pip,
[data-skin="slovo"] .composer-shell,
[data-skin="slovo"] .call-btn,
[data-skin="slovo"] .filter-chip,
[data-skin="slovo"] .fab,
[data-skin="slovo"] .send-btn {
  /* Отпускание пружинит: возврат без пружины читается как залипание. */
  transition: transform .16s cubic-bezier(.34, 1.56, .64, 1),
              box-shadow .14s ease, background .14s ease;
}

[data-skin="slovo"] .glass-pill.натиснуто,
[data-skin="slovo"] .chat-head-act.натиснуто,
[data-skin="slovo"] .edit-act.натиснуто,
[data-skin="slovo"] .call-btn:not([style*="--c-red"]).натиснуто,
[data-skin="slovo"] .filter-chip.glass-pill.натиснуто,
[data-skin="slovo"] .nav-cap [data-tab].натиснуто {
  transform: scale(.955);
  opacity: 1;
  background: linear-gradient(180deg, var(--плівка-натиск-верх), var(--плівка-натиск-низ)) !important;
  box-shadow: var(--фаска-натиск), 0 4px 12px rgba(0, 0, 0, 0.34) !important;
}

/* Акцентные круги продавливаются так же, только светлеют не плёнкой, а самим
   акцентом: у них под пальцем цвет становится плотнее, а не тусклее. */
[data-skin="slovo"] .fab.натиснуто,
[data-skin="slovo"] .send-btn.натиснуто,
[data-skin="slovo"] .filter-chip[data-on="true"].натиснуто,
[data-skin="slovo"] .call-btn[style*="--c-accent"].натиснуто {
  transform: scale(.94);
  opacity: 1;
  background: var(--c-accent) !important;
  box-shadow: inset 2px 2px 0 -0.5px rgba(255, 255, 255, 0.42),
              inset 0 -14px 18px -12px rgba(0, 0, 0, 0.34),
              0 4px 12px rgba(0, 0, 0, 0.34) !important;
}

/* Строку списка и рядовые кнопки нажатие по-прежнему только притушивает:
   продавливать то, что не стекло, не за что. */
[data-skin="slovo"] .chat-row.натиснуто,
[data-skin="slovo"] .contact-row.натиснуто,
[data-skin="slovo"] .call-row.натиснуто { opacity: .66; }