/*
 * НАШИ СТИЛИ, КОТОРЫХ НЕТ В ДИЗАЙНЕ.
 *
 * Отдельный файл, а не дописка в design.css: тот обязан оставаться побайтовой
 * копией блока <style> из прототипа, и это стережёт тест
 * (tests/visual/tokens.spec.ts, «design.css отдаётся браузеру дословно»).
 * Дописка туда делала гейт паритета красным, а следующий перенос из дизайна —
 * тот самый единственный легальный путь правки — молча стёр бы её.
 *
 * Правило файла: сюда попадает только то, чего в прототипе нет вовсе, и
 * только настоящим CSS — то, что утилитами не задаётся (псевдоэлементы).
 * Переменные `--*` здесь не объявляются: их источник истины — дизайн.
 * ИСКЛЮЧЕНИЯ — только решением founder'а и только списком ниже (решение
 * 25.09.2026: правимые зоны больше не сверяются с прототипом).
 */

/* ИСКЛЮЧЕНИЕ 1 — `--faint` (тёмная тема), founder 26.09.2026. Цвет третичного
   текста #6B6D6A давал контраст 3,3 на фоне и 3,1 на карточке при норме 4,5
   (~80 подписей, счётчиков, времени). #8A8C88: 5,22 на --bg (#18181A), 4,79 на
   --card (#202022) — норма выполнена (пересчёт под лаву 05.10.2026; на --card2
   4,28 — там мелкий текст --muted), и цвет всё ещё тише --muted (#A0A0A2), иерархия «основной /
   вторичный / третичный» сохраняется. Светлая тема задаёт свой --faint
   правилом с большей специфичностью и не затрагивается. */
.tg{--faint:#8A8C88}

/* Ползунок параметра в рабочей строке («Медиа», каталог моделей 21.09.2026).
   Нативный input[type=range] не красится утилитами: дорожка и бегунок живут в
   псевдоэлементах, поэтому правила настоящие. Пройденная часть заливается
   ТРИ ЦВЕТА, И КАЖДЫЙ СВОЮ РАБОТУ. Пройденная часть — светлая (--text, в
   тёмной теме почти белый): именно она показывает выбранное значение длиной.
   Остаток — графитовый, чтобы дорожка читалась как шкала, а не как пустота.
   Бегунок — фирменный акцент, единственная точка цвета. Системный синий
   accent-color выпадал из палитры, а заливка акцентом спорила бы с бегунком
   того же цвета. Долю заливки считает компонент и отдаёт в --fill. Тень короткая: --sh2 это
   дроп-тень слоя на 20px вниз, под кружком 14px она даёт размазанное пятно,
   а не обводку. */
.tgs-slider{appearance:none;-webkit-appearance:none;width:100%;height:20px;background:transparent;cursor:pointer}
.tgs-slider::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(var(--text),var(--text)) 0 / var(--fill,0%) 100% no-repeat,rgba(128,128,128,.34)}
.tgs-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent);margin-top:-5px;box-shadow:0 1px 4px rgba(0,0,0,.45);transition:transform .15s cubic-bezier(.2,0,0,1)}
.tgs-slider::-webkit-slider-thumb:hover{transform:scale(1.15)}
.tgs-slider::-moz-range-track{height:4px;border-radius:4px;background:rgba(128,128,128,.34)}
.tgs-slider::-moz-range-progress{height:4px;border-radius:4px;background:var(--text)}
.tgs-slider::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:var(--accent);box-shadow:0 1px 4px rgba(0,0,0,.45)}
.tgs-slider:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

/* Появление плитки результата (Ш-3). Задержку считает компонент и отдаёт
   инлайном: она зависит от места плитки в сетке, а CSS этого не знает.
   Смысл задержки — пачка должна проявляться волной, а не мигать целиком;
   потолок задержки держит компонент, иначе двадцатая плитка ждала бы секунду. */
@keyframes tgs-tile-in{from{opacity:0;transform:translateY(6px) scale(.985)}to{opacity:1;transform:none}}
.tgs-tile{animation:tgs-tile-in .34s cubic-bezier(.2,0,0,1) both}

/* Бегущий блик на скелете: показывает, что ожидание живое, а не подвисло.
   Псевдоэлемент — утилитами не задаётся, поэтому правило настоящее. */
.tgs-skeleton{position:relative;overflow:hidden}
.tgs-skeleton::after{content:'';position:absolute;inset:0;background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.07) 45%,rgba(255,255,255,.12) 50%,rgba(255,255,255,.07) 55%,transparent 80%);animation:shim 2.1s ease-in-out infinite}

/* Сетка результатов: четыре колонки на широком экране, ниже — меньше.
   Одна величина зазора на обе оси (14px, как у донора). */
.tgs-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(min-width:640px){.tgs-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:980px){.tgs-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}

/* Подложка липкого ряда вкладок «Медиа». Ряд прибит к верху окна, и без
   собственного фона прокрученная витрина читается прямо сквозь подписи.
   Градиент, а не сплошная заливка: жёсткая нижняя граница у полосы без
   рамки выглядит обрезком, а растворение показывает, что под ней продолжение
   страницы. Маска снизу — чтобы буквы не упирались в край заливки. */
.tgs-tabs{background:linear-gradient(var(--bg) 62%,rgba(0,0,0,0));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
/* Скрытая полоса прокрутки: на узком экране ряд листается пальцем, а системная
   полоса на macOS всё равно не видна — и её появление дёргало бы высоту. */
.tgs-tabs-row{scrollbar-width:none}
.tgs-tabs-row::-webkit-scrollbar{display:none}

/* Пункт ряда разделов «Медиа» — ровно пункт левого меню (23.09.2026).
   В покое — просто слово: вес 500, приглушённый цвет, без подложки.
   Наведение — лёгкая капсула `--pane2` и светлый текст. Выбранный раздел —
   капсула `--card2`, вес 600 и акцентная черта слева. Те же величины, что
   у `.tg-sbitem` в SidebarNav (замерены в браузере, а не списаны из кода).
   Черта — псевдоэлемент: места не занимает.
   Цвет и вес — здесь, а не инлайном: инлайн перебил бы :hover. */
.tgs-tab{position:relative;background:transparent;color:var(--muted);font-weight:500;transition:background .15s cubic-bezier(.2,0,0,1),color .15s cubic-bezier(.2,0,0,1)}
.tgs-tab:hover,.tgs-tab[data-open]{background:var(--pane2);color:var(--text)}
.tgs-tab[aria-current]{background:var(--card2);color:var(--text);font-weight:600}
.tgs-tab[aria-current]::before{content:'';position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:9px;background:var(--accent)}
/* Выбранный жирнее остальных — и без резерва он раздвигал бы ряд: каждое
   переключение раздела сдвигало бы все слова справа. Невидимый жирный
   двойник подписи нулевой высоты держит ширину пункта по жирному начертанию. */
.tgs-tab::after{content:attr(data-label);display:block;height:0;overflow:hidden;visibility:hidden;font-weight:600}
.tgs-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Пункт выпадающего меню раздела. */
.tgs-menu-item{transition:background .12s cubic-bezier(.2,0,0,1)}
.tgs-menu-item:hover,.tgs-menu-item:focus-visible{background:rgba(128,128,128,.1);outline:none}

/* Лента «Все» (23.09.2026): сетка вертикальных карточек 9:16. Четыре в ряд
   на широком экране, ниже — меньше; зазор тот же, что у сетки результатов. */
.tgs-feed-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(min-width:640px){.tgs-feed-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(min-width:980px){.tgs-feed-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
/* Наведение на карточку: кадр чуть приближается. Медленно и мягко — это
   приглашение, а не реакция на ошибку; с уважением к «меньше движения». */
.tgs-feed-card img{transition:transform .5s cubic-bezier(.2,0,0,1)}
.tgs-feed-card:hover img{transform:scale(1.035)}
.tgs-feed-card:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.tgs-feed-card img{transition:none}.tgs-feed-card:hover img{transform:none}}
/* Раздел, который сейчас на экране ленты «Все», — лёгкая капсула, как при
   наведении. Выбранный пункт («Все») при этом держит свою подложку и черту. */
.tgs-tab[data-inview]{background:var(--pane2);color:var(--text)}

/* «Комьюнити» (23.09.2026). Кладка работ колонками: каждая работа своей
   формы, как у Higgsfield Community. */
.tgs-masonry{columns:2;column-gap:14px}
@media(min-width:640px){.tgs-masonry{columns:3}}
@media(min-width:980px){.tgs-masonry{columns:4}}
.tgs-masonry>*{break-inside:avoid;margin-bottom:14px}
.tgs-work img{transition:transform .5s cubic-bezier(.2,0,0,1)}
.tgs-work:hover img{transform:scale(1.03)}
.tgs-work .tgs-work-meta{opacity:0;transition:opacity .2s cubic-bezier(.2,0,0,1)}
.tgs-work:hover .tgs-work-meta,.tgs-work:focus-visible .tgs-work-meta{opacity:1}
.tgs-work:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (hover:none){.tgs-work .tgs-work-meta{opacity:1}}
@media (prefers-reduced-motion:reduce){.tgs-work img{transition:none}.tgs-work:hover img{transform:none}}
/* Пилюли фильтра по типу — тот же язык, что пункты ряда разделов. */
.tgs-chip{background:transparent;color:var(--muted);font-weight:500;transition:background .15s cubic-bezier(.2,0,0,1),color .15s cubic-bezier(.2,0,0,1)}
.tgs-chip:hover:not(:disabled){background:var(--pane2);color:var(--text)}
.tgs-chip[aria-pressed="true"]{background:var(--card2);color:var(--text);font-weight:600}
.tgs-chip:disabled{opacity:.38;cursor:default}
.tgs-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Узкая боковая панель на «Медиа» (решение founder'а 23.09.2026).
   ПРАВИЛА — ДОСЛОВНО те, что эталон дизайна (design.css) держит в блоке
   `@media (max-width:1060px)`: тот же вид «только значки», уже проверенный
   тестом collapsed.spec.ts. Здесь они включаются не шириной экрана, а
   отметкой `data-rail="mini"` на корне, которую Root ставит на «Медиа».
   Меняя одно, сверяй другое. */
/* Широкая полоса: 256 (сайдбар) + 16 (свой отступ .barwrap), по той же
   формуле, что у mini (70 + 16). В прототипе стояло 252 — строка агента
   была сдвинута на 10 px влево от центра рабочей области. Только шире 1060:
   уже сайдбар узкий (70) и действует правило дизайна design.css (86). */
@media (min-width:1061px){.tg .barwrap.lane-ws{padding-left:272px}}
.tg[data-rail="mini"] .barwrap.lane-ws{padding-left:86px}
.tg[data-rail="mini"] .tg-sb{width:70px!important;padding:16px 10px!important}
.tg[data-rail="mini"] .sb-label{display:none}
.tg[data-rail="mini"] .sb-hide{display:none!important}
.tg[data-rail="mini"] .sb-dot{display:flex!important}
.tg[data-rail="mini"] .tg-sbitem{justify-content:center!important;padding:10px 0!important}
.tg[data-rail="mini"] .tg-sblogo{justify-content:center!important;padding-left:0!important;padding-right:0!important}
/* Сворачивание плавное: панель и строка ввода едут вместе, коротко. */
.tg .tg-sb{transition:width .24s cubic-bezier(.2,0,0,1),padding .24s cubic-bezier(.2,0,0,1)}
.tg .barwrap.lane-ws{transition:padding-left .24s cubic-bezier(.2,0,0,1)}
@media (prefers-reduced-motion:reduce){.tg .tg-sb,.tg .barwrap.lane-ws{transition:none}}

/* Компактный ряд разделов (решение founder'а 23.09.2026, по образцу
   Higgsfield): выбран раздел — ряд мельчает, капсул нет ни в покое, ни при
   наведении. Выбранный — светлый текст и акцентная черта слева; прочие
   серые, при наведении светлеют. Линия ряда та же (центр на знаке). */
.tgs-tabs[data-compact] .tgs-tab{font-size:var(--fs-ui);padding:4px 10px 4px 12px!important;background:transparent!important}
.tgs-tabs[data-compact] .tgs-tab:hover,.tgs-tabs[data-compact] .tgs-tab[data-open]{color:var(--text)}
.tgs-tabs[data-compact] .tgs-tab[aria-current]::before{top:5px;bottom:5px}
.tgs-tabs[data-compact] nav{gap:2px}

/* Значок сворачивания боковой панели (решение founder'а 23.09.2026, по
   образцу Higgsfield). Круг на правом краю панели, на линии знака (центр
   ~32 px). Едет вместе с краем панели. На экранах уже 1060 px панель и так
   узкая по правилам эталона дизайна — значок там не нужен и не показывается. */
.tgs-rail-toggle{position:fixed;top:19px;left:243px;z-index:25;width:26px;height:26px;border-radius:999px;display:grid;place-items:center;
  background:var(--card);border:1px solid var(--line);color:var(--muted);cursor:pointer;padding:0;
  box-shadow:0 2px 8px rgba(0,0,0,.35);transition:left .24s cubic-bezier(.2,0,0,1),color .15s,background .15s}
.tgs-rail-toggle:hover{color:var(--text);background:var(--card2)}
.tgs-rail-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tg[data-rail="mini"] .tgs-rail-toggle{left:57px}
@media (max-width:1060px){.tgs-rail-toggle{display:none}}
@media (prefers-reduced-motion:reduce){.tgs-rail-toggle{transition:none}}
/* Список «Идей» у значка свёрнутой панели (founder 12.10.2026, DESIGN-side-rail.md §3).
   Стекло панели, без отсвета акцента. */
.tgs-rail-pop{position:fixed;z-index:70;min-width:200px;display:flex;flex-direction:column;gap:1px;padding:6px;border-radius:14px;box-shadow:0 18px 40px rgba(0,0,0,.45)}
.tgs-rail-pop-item{display:flex;align-items:center;gap:8px;width:100%;border:0;cursor:pointer;text-align:left;border-radius:9px;padding:7px 11px;font-size:var(--fs-ui)}
.tgs-rail-pop-item:hover,.tgs-rail-pop-item:focus-visible{background:var(--pane2)!important;color:var(--text)!important;outline:none}
.tgs-rail-pop-sep{display:block;height:1px;background:var(--line);margin:6px 10px 6px 2px}
.tgs-rail-dot{position:absolute;top:7px;right:12px;width:7px;height:7px;border-radius:50%;background:var(--accent)}

/* «Папка» автора (решение founder'а 23.09.2026). Ушки вкладок сидят на
   теле папки; активное ушко — того же цвета, что тело, и уходит в него без
   шва: вся шапка папки (значок «назад» + ряд ушек) заходит на 1 px на
   верхнюю границу тела и лежит над ним (z-index). Нахлёст у шапки, а не у
   ушка: ряд ушек прокручивается вбок и обрезает всё за своим краем —
   нахлёст ушка срезался бы, и шов оставался (замер пикселей 23.09.2026).
   Все четыре угла тела скруглены (просьба founder'а 23.09.2026: острый
   левый верхний угол выбивался из остального). Первое ушко начинается
   за значком «назад» (34 + 10 px) — далеко за скруглением 20 px, на изгиб
   угла ничего не садится.
   КОНТРАСТ (23.09.2026): тело и активное ушко — `--card2`, заметно светлее
   фона страницы; задние ушки — `--card`, темнее тела. При прежнем `--card`
   тело отличалось от фона на 7 единиц яркости, и папка читалась обычной
   карточкой. Плашки внутри тела (соцсети, счётчики) — `--card`, вдавлены. Неактивные — темнее и ниже,
   как задние разделители в настоящей папке. Акцентная черта сверху у
   активного ушка — та же, что у выбранного пункта меню. */
.tgs-folder-head{position:relative;z-index:2;display:flex;align-items:flex-end;gap:10px;margin-bottom:-1px}
.tgs-folder-head>button{margin-bottom:4px}
.tgs-folder-tabs{position:relative;flex:1;min-width:0;display:flex;align-items:flex-end;gap:4px;padding-left:0;overflow-x:auto;scrollbar-width:none}
.tgs-folder-tabs::-webkit-scrollbar{display:none}
.tgs-folder-tab{position:relative;flex:none;cursor:pointer;border:1px solid var(--line);border-bottom:0;border-radius:14px 14px 0 0;
  background:var(--card);color:var(--muted);font-size:var(--fs-ui);font-weight:500;padding:9px 18px 10px;
  transition:background .15s cubic-bezier(.2,0,0,1),color .15s cubic-bezier(.2,0,0,1),padding .15s cubic-bezier(.2,0,0,1)}
.tgs-folder-tab:hover{color:var(--text);background:#262628}
.tgs-folder-tab[aria-selected="true"]{background:var(--card2);color:var(--text);font-weight:600;padding-top:12px;z-index:1}
.tgs-folder-tab[aria-selected="true"]::before{content:'';position:absolute;left:14px;right:14px;top:0;height:2px;border-radius:2px;background:var(--accent)}
.tgs-folder-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tgs-folder-body{position:relative;background:var(--card2);border:1px solid var(--line);border-radius:20px;padding:24px;
  box-shadow:0 24px 60px rgba(0,0,0,.28)}
@media (prefers-reduced-motion:reduce){.tgs-folder-tab{transition:none}}

/* ── «Идеи»: карточка ролика (спека docs/specs/2026-09-25-ideas-redesign-spec.md,
   §5 P1 «Значения из макета»). Значения макета cards.html переписаны в §5,
   здесь они один к одному; кегли — по шкале P3 (12.5 → 13, 11.5 → 12).
   Отдельные классы .ic-*, а не утилиты: псевдоэлементы (затемнение, зона
   нажатия 44×44), состояния [aria-pressed]/[data-open] и медиазапросы
   ≤760 утилитами Tailwind 4 не выразить без расхождения (max-[760px] = <760). */
/* Не больше 4 карточек в ряд даже на самом широком экране (founder 26.09.2026):
   минимальная ширина колонки — четверть ряда за вычетом трёх зазоров по 14. */
.ic-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(max(200px,calc((100% - 42px) / 4)),1fr));gap:18px 14px;align-items:start}
.ic-card{display:flex;flex-direction:column;background:var(--pane);border:1px solid var(--line);border-radius:16px}
/* Порт на код разработчика: карточка НЕ обрезает содержимое (overflow виден) —
   выпадашка папок разработчика (FolderPicker) живёт внутри карточки под ♡ и
   шире её. Скругление верха держит сама обложка (15 = 16 − рамка 1). */
.ic-cw{position:relative}
.ic-cover{position:relative;display:block;width:100%;aspect-ratio:9/16;border:0;border-radius:15px 15px 0 0;padding:0;margin:0;overflow:hidden;cursor:pointer;background-size:cover;background-position:center;transition:transform .12s ease}
.ic-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:filter .15s ease}
/* Обложка записи «Истории» — поверх градиента миниатюры (design.css, .hist-thumb), под значками. */
.hist-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ic-cover::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(to top,rgba(9,9,10,.9) 0,rgba(9,9,10,.86) 20px,rgba(9,9,10,.76) 40px,rgba(9,9,10,.6) 60px,rgba(9,9,10,.42) 80px,rgba(9,9,10,.26) 100px,rgba(9,9,10,.13) 120px,rgba(9,9,10,.05) 140px,rgba(9,9,10,0) 160px);pointer-events:none;z-index:1}
/* Наведение светлит ТОЛЬКО картинку, не затемнение и не метрики: фильтр на
   всей кнопке ронял контраст метрик на белой обложке до 4.381 (фикс-раунд 1). */
@media (hover:hover){.ic-cover:hover img{filter:brightness(1.06)}}
.ic-cover:active{transform:scale(.99)}
.ic-cover:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
/* Автопроигрывание разработчика при наведении: ролик — под затемнением, как
   картинка; лоадер — над ним. */
.ic-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.ic-loader{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;pointer-events:none}
.ic-loader-ring{width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid rgba(238,238,238,.22);background:rgba(12,12,13,.52);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ic-stats{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;flex-wrap:wrap;justify-content:space-between;padding:0 10px 10px;color:#EEEEEE;text-align:left}
.ic-row{flex-basis:100%;display:flex;flex-wrap:nowrap;justify-content:space-between;gap:2px;min-width:0}
.ic-cell{min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;font-weight:600;font-size:var(--fs-micro);line-height:1;white-space:nowrap;font-variant-numeric:tabular-nums}
.ic-when{flex-basis:100%;display:flex;align-items:center;justify-content:flex-start;gap:5px;margin-top:8px;font-size:var(--fs-micro);font-weight:500;line-height:1;color:rgba(238,238,238,.82)}
/* Контраст метрик на светлой обложке (founder 26.09.2026): сплошной градиент
   БЕЗ ореолов у цифр и значков. Затемнён только низ, где метрики и дата:
   плавная кривая (скрим): .9 у края, .6 на уровне верха значков (~60 px),
   дальше мягко гаснет к 160 px — без ступеньки, которую давал линейный спад
   .62→0 за 46 px (founder: «граница как по центру картинки»). Белый текст на
   белой обложке: на .6 контраст ≈ 6 (норма 4.5). Прежний ореол снят. */
.ic-mult{position:absolute;left:10px;top:10px;z-index:3;display:inline-flex;align-items:baseline;border:0;cursor:pointer;background:var(--pearl);color:var(--pearl-ink);box-shadow:var(--pearl-sh);border-radius:999px;padding:3px 9px 3px 8px;font:600 var(--fs-ui)/1.2 'Golos Text',system-ui,sans-serif;letter-spacing:.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-variant-numeric:tabular-nums;box-shadow:0 0 0 1.5px rgba(0,0,0,.55),0 2px 10px rgba(0,0,0,.35)}
.ic-mult-x{font-size:var(--fs-lead);font-weight:600;line-height:1;margin-right:2px}
.ic-mult::before,.ic-fav::before{content:"";position:absolute;left:50%;top:50%;width:max(100%,44px);height:max(100%,44px);transform:translate(-50%,-50%)}
.ic-mult-skel{position:absolute;left:10px;top:10px;z-index:3;width:44px;height:22px;border-radius:999px;background:rgba(128,128,128,.25);animation:puls 1.5s ease-in-out infinite}
/* Без z-index НАМЕРЕННО: иначе обёртка стала бы контекстом наложения, и
   выпадашка папок (z 27, лист снизу z 80 на телефоне) легла бы ПОД ×N соседних
   карточек и под строку агента. Над картинкой обложки её и так держит порядок. */
.ic-favbox{position:absolute;right:10px;top:10px}
/* У МЫШИ зона сердца — ровно видимый кружок: расширение до 44 px (::before, для
   пальца) ловило наведение раньше, чем курсор доходил до сердца, и меню папок
   выпадало заранее (founder 26.09.2026). На сенсорных экранах зона остаётся. */
@media (hover:hover) and (pointer:fine){.ic-fav::before{display:none}}
.ic-fav{position:relative;width:34px;height:34px;padding:0;border-radius:999px;border:1px solid rgba(238,238,238,.22);background:rgba(12,12,13,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#EEEEEE;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .12s ease;touch-action:manipulation;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
.ic-fav:active{transform:scale(.92)}
/* Сохранено — акцент только у самого сердца (красная заливка); кружок
   остаётся тёмным стеклом с нейтральной рамкой (основатель 2026-09-26). */
.ic-fav[aria-pressed="true"]{color:#FF4D5E}
.ic-fav[aria-pressed="true"] path{fill:currentColor}
.ic-mult:focus-visible,.ic-fav:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Модалка ролика (основатель 2026-09-26, ClipPreview): видео чистое — внизу
   только полоса и звук на плавном затемнении; ×N и метрики — в правой колонке
   (ClipInfo). Действия под видео — плоские плитки на ширину видео (.cm-acts);
   у ♡ по `aria-pressed` красное только сердце. Меню папок — над плитками во всю
   колонку видео (.cm-panel .cm-favbox>[role=menu]). */
.cm-cover::after{content:"";position:absolute;left:0;right:0;bottom:0;height:160px;background:linear-gradient(to top,rgba(9,9,10,.9) 0,rgba(9,9,10,.86) 20px,rgba(9,9,10,.76) 40px,rgba(9,9,10,.6) 60px,rgba(9,9,10,.42) 80px,rgba(9,9,10,.26) 100px,rgba(9,9,10,.13) 120px,rgba(9,9,10,.05) 140px,rgba(9,9,10,0) 160px);pointer-events:none;z-index:1}
.cm-bottom{position:absolute;left:10px;right:10px;bottom:10px;z-index:2;display:flex;flex-direction:column;gap:10px}
.cm-act{position:relative;width:34px;height:34px;flex:none;padding:0;display:flex;align-items:center;justify-content:center;border-radius:999px;cursor:pointer;color:var(--muted)}
.cm-act:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cm-fav{transition:transform .12s ease;touch-action:manipulation;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none}
.cm-fav:active{transform:scale(.92)}
.cm-fav[aria-pressed="true"]{color:#FF4D5E}
.cm-fav[aria-pressed="true"] path{fill:currentColor}
/* Меню папок в окне ролика — во всю ширину колонки видео, над рядом кнопок:
   не заходит на правую колонку и не вылезает за окно на телефоне
   (основатель 2026-09-26). Держатель ♡ не позиционирован — меню
   позиционируется от колонки (.cm-left). */
.cm-panel .cm-favbox{position:static}
.cm-panel .cm-favbox>[role="menu"]{left:0;right:0;width:auto;top:auto;bottom:50px}
/* Выпадашка открыта по ролику, поэтому при открытом окне её рисует и карточка
   того же ролика в ленте; на телефоне та всплывала шторкой поверх окна.
   Пока окно открыто, меню карточки не показывается. */
:root:has(.cm-panel) .ic-favbox>[role="menu"]{display:none}
.ic-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
.ic-who{display:flex;align-items:center;gap:9px;padding:9px 8px 9px 10px}
/* Разделитель между ником и раскрытой частью убран — карточка читается единой (основатель 2026-09-26). */
.ic-ava{width:22px;height:22px;border-radius:999px;flex:none}
.ic-handle{flex:1;min-width:0;border:0;background:none;padding:0;margin:0;text-align:left;cursor:pointer;color:var(--text);font-weight:600;font-size:var(--fs-ui);line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ic-handle:hover{text-decoration:underline}
.ic-handle:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ic-exp{position:relative;width:30px;height:30px;flex:none;padding:0;border-radius:999px;border:1px solid var(--line);background:var(--pane2);color:var(--text);display:flex;align-items:center;justify-content:center;cursor:pointer}
.ic-exp::before{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
.ic-exp svg{transition:transform .2s cubic-bezier(.2,.8,.2,1)}
.ic-card[data-open] .ic-exp svg{transform:rotate(180deg)}
.ic-exp:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ic-more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .22s cubic-bezier(.2,.8,.2,1)}
.ic-card[data-open] .ic-more{grid-template-rows:1fr}
.ic-more>div{overflow:hidden;min-height:0}
/* Свёрнутое содержимое только ОБРЕЗАНО (0fr + overflow:hidden + inert):
   для Playwright и для чтения с экрана оно остаётся «видимым» (замер: count 1,
   visible true, высота 21). visibility снимает его честно (AC-1.6). */
.ic-card:not([data-open]) .ic-more>div{visibility:hidden}
.ic-card[data-open] .ic-more>div{visibility:visible}
.ic-in{display:flex;flex-direction:column;gap:9px;padding:2px 10px 10px}
/* «Идеи» на телефоне (≤760): две колонки, узкие поля экрана 12 (спека P1 «Сетка»). */
@media (max-width:760px){
  .ic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 8px}
  /* Выпадашка папок под ♡ на телефоне — лист снизу: привязанная к сердцу,
     она уходила бы за край экрана у левой колонки. */
  /* Подтверждение удаления папки (ряд папок «Избранного») — тоже лист снизу. */
  .ic-folderdel{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;box-sizing:border-box;border-radius:18px 18px 0 0;padding-bottom:calc(12px + env(safe-area-inset-bottom));z-index:80}
  .ic-favbox>[role="menu"]{position:fixed;left:0;right:0;bottom:0;top:auto;width:auto;max-height:70vh;overflow-y:auto;box-sizing:border-box;border-radius:18px 18px 0 0;padding:12px 12px calc(12px + env(safe-area-inset-bottom));z-index:80}
  .ic-screen{padding-left:12px;padding-right:12px}
  .ic-who{gap:7px;padding:8px 6px 8px 8px}
  .ic-ava{width:20px;height:20px}
  .ic-exp{width:26px;height:26px}
  .ic-in{padding:0 8px 8px}
  .ic-stats{padding:0 8px 9px}
  .ic-cell{font-size:var(--fs-micro);gap:2px}
  .ic-cell svg{width:13px;height:13px}
}
.ic-cap{margin:0;font-size:var(--fs-ui);line-height:1.4;color:var(--text);opacity:.88}
.ic-meta{font-size:var(--fs-meta);color:var(--muted)}
.ic-meta .ic-n{color:var(--text);font-weight:600}
/* Действия раскрытой карточки (founder 26.09.2026) — плитки на всю ширину сразу
   под ником, плоские, как плитки метрик окна ролика (.cm-metric): фон --pane,
   рамка --line, без стекла и свечения (founder: «сдержаннее, как Медиа»). Наведение
   подсвечивает плитку и значок; «Отслеживается» — лавовая кромка. */
.ic-acts{display:flex;gap:6px;margin-top:2px}
.ic-acts button{flex:1;height:36px;padding:0;border-radius:12px;background:var(--pane);border:1px solid var(--line);color:var(--muted);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease,transform .12s ease}
.ic-acts button:hover{color:var(--text);background:var(--pane2);border-color:rgba(255,255,255,.14)}
.ic-acts button:active{transform:scale(.96)}
.ic-acts button[aria-pressed="true"]{color:var(--accent-tx);border-color:color-mix(in oklab,var(--accent) 40%,transparent)}
.ic-acts button[aria-disabled="true"]{opacity:.45;cursor:not-allowed}
.ic-acts button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Ник и под ним подписчики (только в раскрытой карточке). */
.ic-whocol{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ic-whocol .ic-handle{flex:none;max-width:100%}
.ic-whocol .ic-meta{line-height:1.2}
/* «Разобрать» карточки — главная: заливка акцентом (.gb-solid), тёмные текст
   и искры; отделена от описания отступом. */
.ic-in .ic-go{height:44px;margin-top:4px;color:var(--accent-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
.ic-in .ic-go .ic-spark{color:var(--accent-ink)}
.ic-in .ic-go:active{background:var(--accent);filter:brightness(.95)}
.ic-go{height:38px;border-radius:999px;display:flex;align-items:center;justify-content:center;gap:7px;padding:0 14px;font-weight:600;font-size:var(--fs-ui);color:var(--text);cursor:pointer;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.ic-go:active{background:var(--gb-a);transform:scale(.97)}
.ic-go em{font-style:normal;font-weight:500;font-size:var(--fs-meta);color:var(--muted)}
.ic-go:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.ic-spark{display:inline-flex;color:var(--accent)}
/* Слой «Идей» (×N, выбор папок P2): привязанный на десктопе, лист снизу ≤760.
   Хит-тест (AC-1.2a: угол в 2px от края) — на НЕскруглённом внешнем блоке
   (`.ic-pop`/`.ic-sheet`, на него же ссылается JS-позиционирование): у
   Chromium border-radius вырезает угловой пиксель из elementFromPoint
   собственного элемента, а скруглённый блок ≥ ~7px радиуса на 2px-инсете
   всегда мимо себя. Скругление и фон — на внутреннем `-in`. */
.ic-pop{position:fixed;left:0;top:0;z-index:80;width:min(262px,84vw);box-sizing:border-box}
.ic-pop-in{border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:7px}
.ic-sheet-dim{position:fixed;inset:0;z-index:79}
.ic-sheet{position:fixed;left:0;right:0;bottom:0;z-index:80;box-sizing:border-box}
.ic-sheet-in{border-radius:18px 18px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px;max-height:70vh;overflow-y:auto}

/* «Идеи»: шапка (спека P1 п.7–9). Пилюля поиска 44 = круг 36 + отступы
   3+3 + рамка .glass 1+1 (content-box: preflight выключен, box-sizing не
   border-box; при padding 4 пилюля выходит 46 — замер аудита плана); поле с
   левым отступом 14. Зона нажатия круга расширена до 44 (inset:-4px). */
.ic-search{padding:3px 3px 3px 14px}
.ic-search-go{position:relative;width:36px;height:36px;flex:none;padding:0;border-radius:999px;display:grid;place-items:center;cursor:pointer}
.ic-search-go::before{content:"";position:absolute;inset:-4px}
@media (max-width:760px){
  .ic-search{flex-basis:100%;width:100%}
}

/* «Идеи»: фильтры на телефоне (спека P1 п.10). Строка чипов не переносится
   и листается пальцем; затухание справа — псевдоэлементом обёртки, а не
   mask-image: маска на предке срезала бы и лист выпадашки (он её потомок).
   Выпадашка — лист снизу (fixed): абсолютную обрезал бы overflow строки. */
@media (max-width:760px){
  .ic-chipwrap{position:relative}
  .ic-chipwrap::after{content:"";position:absolute;right:0;top:0;bottom:0;width:28px;pointer-events:none;background:linear-gradient(to right,rgba(0,0,0,0),var(--bg))}
  .ic-chiprow{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-right:28px}
  .ic-chiprow::-webkit-scrollbar{display:none}
  .ic-chiprow>*{flex:none}
  .ic-dd{position:fixed;left:0;right:0;bottom:0;top:auto;width:100%;min-width:0;max-height:60vh;box-sizing:border-box;border-radius:18px 18px 0 0;z-index:71}
  .ic-dd-dim{background:var(--dim);z-index:70}
}

/* ── Оболочка: шторка меню при ≤760 (спека 2026-09-25, P1 п.13–16) ──
   Правила эталона для ≤1060 (design.css:127) стоят с !important, поэтому
   здесь — большая специфичность и !important. Слои: строка агента .barwrap
   на z 40, затемнение 60, шторка 61. */
.tg[data-shell="drawer"] .tg-sb{position:fixed;left:0;top:0;bottom:0;height:100dvh;z-index:61;width:min(300px,86vw)!important;padding:16px 14px!important;transform:translateX(-100%);visibility:hidden;transition:transform .22s cubic-bezier(.2,.8,.2,1),visibility 0s linear .22s}
.tg[data-shell="drawer"][data-drawer="open"] .tg-sb{transform:none;visibility:visible;transition:transform .22s cubic-bezier(.2,.8,.2,1),visibility 0s}
.tg[data-shell="drawer"] .sb-label{display:block}
.tg[data-shell="drawer"] .sb-hide{display:flex!important}
.tg[data-shell="drawer"] .sb-dot{display:none!important}
.tg[data-shell="drawer"] .tg-sbitem{justify-content:flex-start!important;padding:9px 12px!important}
.tg[data-shell="drawer"] .tg-sblogo{justify-content:flex-start!important;padding-left:6px!important;padding-right:6px!important}
.tg[data-shell="drawer"] .barwrap.lane-ws{padding-left:16px}
.tgs-drawer-dim{position:fixed;inset:0;z-index:60}
.tgs-burger{width:44px;height:44px;flex:none;padding:0;border-radius:999px;display:grid;place-items:center;cursor:pointer;color:var(--text)}
.tgs-burger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tgs-burger-float{position:fixed;top:10px;left:10px;z-index:45}
.tg[data-burger="float"] main{padding-top:56px}
@media (prefers-reduced-motion:reduce){.tg[data-shell="drawer"] .tg-sb{transition:none}}

/* «Идеи» на узком телефоне (AC-1.3a, 320): вкладки списка не двигают
   страницу вбок. Правила — по отметкам вкладок без правки разметки:
   «Тренды» — сетка карточек minmax(320px,1fr) (AnalyticsFormats) при
   ширине main < 320 сжимается до одной колонки во всю ширину;
   «Отслеживание» — пилюля трёх вкладок (AnalyticsWatch, .glass p-[5px])
   листается пальцем, как ряды вкладок Воронок/Библиотеки/Монтажа. */
@media (max-width:760px){
  .ic-screen [class*="minmax(320px,1fr)"]{grid-template-columns:repeat(auto-fill,minmax(min(320px,100%),1fr))}
  .ic-screen .glass[class~="p-[5px]"]{max-width:100%;box-sizing:border-box;overflow-x:auto;scrollbar-width:none}
  .ic-screen .glass[class~="p-[5px]"]::-webkit-scrollbar{display:none}
  .ic-screen .glass[class~="p-[5px]"]>*{flex:none}
}

/* Шапка «Идей» на телефоне (AC-1.3a, фикс-раунд 1): заголовок не вылезает.
   Блок заголовков остаётся в строке бургера (max-width = строка − бургер 44
   − зазор 14: перенос flex-строки считается по ограниченному размеру), сам
   переносит подзаголовок на следующую строку, а длинный хендл одним словом
   переносится по знакам — виден целиком, не обрезан молча. */
@media (max-width:760px){
  .ic-titles{flex:1 1 auto;max-width:calc(100% - 58px);flex-wrap:wrap;row-gap:2px}
  .ic-titles h1{min-width:0;overflow-wrap:anywhere}
}
/* Окно ролика: двойной тап по видео — «в избранное», вспышка сердца (основатель 2026-09-26). */
.cm-cover{touch-action:manipulation;-webkit-user-select:none;user-select:none}
.cm-burst{position:absolute;left:50%;top:45%;z-index:4;width:84px;height:84px;margin:-42px 0 0 -42px;color:#FF4D5E;pointer-events:none;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45));animation:cm-burst .75s cubic-bezier(.2,.8,.2,1) forwards}
.cm-burst svg{width:100%;height:100%}
.cm-burst svg path{fill:currentColor;stroke:currentColor}
@keyframes cm-burst{0%{opacity:0;transform:scale(.4)}25%{opacity:1;transform:scale(1.1)}45%{transform:scale(.95)}70%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
@media (prefers-reduced-motion:reduce){.cm-burst{animation:cm-burst-fade .6s ease forwards}@keyframes cm-burst-fade{0%,60%{opacity:1}100%{opacity:0}}}
/* Окно ролика: метрики справа (основатель 2026-09-26). */
.cm-panel{position:relative;isolation:isolate}
.cm-panel>*{position:relative;z-index:1}
/* Колонка видео — слоем выше правой: её меню папок ничто не перекрывает. */
.cm-panel>.cm-left{z-index:2}
/* Окно без прокрутки вбок: свечение шире окна обрезается его краем. */
.cm-panel{overflow-x:hidden}
.cm-metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.cm-metric{display:flex;align-items:center;gap:7px;min-width:0;padding:8px 11px;border-radius:10px;background:var(--pane);border:1px solid var(--line);font-variant-numeric:tabular-nums}
.cm-ico{flex:none;display:flex;align-items:center;justify-content:center;color:var(--muted)}
.cm-ico svg{width:13px;height:13px}
.cm-metric strong{font:600 var(--fs-title)/1.2 'Golos Text',system-ui,sans-serif;color:var(--text)}
.cm-block{display:flex;flex-direction:column;gap:8px;margin:0}
.cm-block + .cm-block{margin-top:8px}
.cm-label{margin:0;font-size:var(--fs-micro);font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.cm-viral{display:flex;align-items:center;gap:11px;padding:7px 12px 7px 7px;border-radius:12px;background:var(--pane);border:1px solid var(--line)}
.cm-viral-tile{flex:none;display:flex;align-items:baseline;justify-content:center;min-width:48px;height:34px;padding:0 9px;box-sizing:border-box;border-radius:9px;background:var(--accent);color:var(--accent-ink);font:700 var(--fs-title)/34px 'Golos Text',system-ui,sans-serif;font-variant-numeric:tabular-nums}
.cm-viral-tile span{font-size:var(--fs-ui);font-weight:600;margin-right:1px}
.cm-viral-body{flex:1;min-width:0}
.cm-viral p{margin:0;font-size:var(--fs-ui);line-height:1.45;color:var(--muted);text-wrap:pretty}
.cm-viral p strong{color:var(--text);font-weight:600}
/* «Разобрать · 36 кр» окна ролика — акцентом, как на карточке (founder 26.09.2026). */
.cm-panel .ic-go{height:44px;color:var(--accent-ink);-webkit-backdrop-filter:none;backdrop-filter:none}
.cm-panel .ic-go .ic-spark{color:var(--accent-ink)}
.cm-panel .ic-go em{color:var(--accent-ink);opacity:.8}
.cm-panel .ic-go:active{background:var(--accent);filter:brightness(.95)}
.cm-desc{max-height:min(30vh,220px);overflow-y:auto;overscroll-behavior:contain;padding-right:6px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
.cm-viral-body{display:flex;flex-direction:column;gap:3px}
.cm-viral p.cm-median{font-size:var(--fs-meta)}

/* Окно ролика на телефоне (колонки встали друг под другом, основатель
   2026-09-26): видео по центру, крестик — в правом верхнем углу окна, а не
   под ником; метрики — сеткой 2×2, чтобы числа не обрезались. */
@media (max-width:625px){
  .cm-panel>.cm-left{margin-inline:auto}
  .cm-panel>.cm-info{position:static}
  .cm-panel .cm-close{position:absolute;top:12px;right:12px;z-index:3}
  .cm-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Действия под видео в окне ролика — те же стеклянные плитки, что в раскрытой
   карточке (.ic-acts), на всю ширину видео (основатель 2026-09-26). */
.cm-acts{display:flex;gap:8px;width:100%}
.cm-acts>.cm-act,.cm-acts>.cm-favbox{flex:1;min-width:0}
.cm-acts .cm-act{-webkit-backdrop-filter:none;backdrop-filter:none;width:100%;height:42px;border-radius:12px;background:var(--pane);border:1px solid var(--line);color:var(--muted);transition:background .15s ease,border-color .15s ease,color .15s ease,transform .12s ease}
.cm-acts .cm-act:hover{color:var(--text);background:var(--pane2);border-color:rgba(255,255,255,.14)}
.cm-acts .cm-act:active{transform:scale(.96)}
.cm-acts .cm-fav[aria-pressed="true"]{color:#FF4D5E}

/* Поля ввода на телефоне — не мельче 16 px: иначе iOS Safari приближает страницу
   при фокусе (шкала шрифтов, роль fs-lead). На десктопе вид полей прежний.
   !important — чтобы перебить и инлайн `font: inherit` (экран входа), и
   `[font:inherit]` в разметке. Автоматической проверки нет (typography-scale.test.ts удалён) — code review. */
@media (max-width:760px){
  .tg input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),.tg textarea,.tg select{font-size:var(--fs-lead)!important}
}
/* Самые узкие телефоны (320–360): пять метрик карточки иначе слипаются
   («9,8M69K1,3K») — меньше боковой отступ и плотнее цифры, размер прежний. */
@media (max-width:360px){
  .ic-stats{padding:0 6px 8px}
  .ic-cell{letter-spacing:-.02em}
}

/* Фильтры поиска «Идей» — в стиле вкладок разделов «Медиа» (.tgs-tab), а не
   капсулы-пилюли (founder 26.09.2026): скругление 10, без рамки, приглушённый
   текст 500; наведение и открытая выпадашка — плашка --pane2; выбранный фильтр —
   --card2, светлый текст 600 и лавовая черта слева, как выбранный раздел. */
.ic-chip{position:relative;display:flex;align-items:center;gap:7px;border:0;border-radius:10px;padding:9px 12px;margin:0;background:transparent;color:var(--muted);font-family:inherit;font-weight:500;line-height:1.2;cursor:pointer;white-space:nowrap;transition:background .15s cubic-bezier(.2,0,0,1),color .15s cubic-bezier(.2,0,0,1)}
.ic-chip:hover,.ic-chip[aria-expanded="true"]{background:var(--pane2);color:var(--text)}
.ic-chip[data-set]{background:var(--card2);color:var(--text);font-weight:600}
.ic-chip[data-set]::before{content:'';position:absolute;left:0;top:9px;bottom:9px;width:2px;border-radius:9px;background:var(--accent)}
.ic-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Перенос ряда фильтров (founder 26.09.2026): вторая строка начинается со
   сдвигом на значок сортировки (12 px + зазор 7), чтобы текст «Метрик» стоял
   ровно под текстом «Сортировки». Первый чип втягивается обратно на тот же сдвиг.
   Только десктоп: на телефоне ряд — одна строка с прокруткой. */
@media (min-width:761px){
  .ic-chiprow{padding-left:19px}
  .ic-chiprow>:first-child{margin-left:-19px}
}
/* Крестик «снять фильтр» на выбранном чипе — вместо стрелки, внутри плашки. */
.ic-chip[data-clearable]{padding-right:32px}
.ic-chip-x{position:absolute;right:6px;top:50%;transform:translateY(-50%);width:22px;height:22px;display:flex;align-items:center;justify-content:center;border:0;border-radius:7px;padding:0;margin:0;background:transparent;color:var(--muted);cursor:pointer;transition:background .15s ease,color .15s ease}
.ic-chip-x:hover{background:rgba(255,255,255,.1);color:var(--text)}
.ic-chip-x:focus-visible{outline:2px solid var(--accent);outline-offset:1px}

/* Кнопки на пластине `.glass` (выбор проекта, «Период», «+ Виджет» в «Дашборде»)
   в дизайне не отвечали ни на наведение, ни на нажатие — в отличие от `.gb`.
   Реакция — рамкой и яркостью, без transform: у части кнопок положение уже
   задано через transform (founder 26.09.2026, единый отклик кнопок). */
.tg button.glass{cursor:pointer;transition:border-color .18s ease,filter .18s ease}
.tg button.glass:hover{border-color:var(--gb-lh);filter:brightness(1.15)}
.tg button.glass:active{filter:brightness(.95)}
.tg button.glass:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* Своё кольцо у кнопок-стекла при фокусе с клавиатуры — лавовое вместо синего
   браузерного. Подсветку рамки ПОЛЕЙ при вводе founder снял 26.09.2026 («не
   нравится, когда загорается») — у полей только курсор. */
.tg .gb:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* ==========================================================================
   НОВАЯ ФОРМА «МЕДИА → ИЗОБРАЖЕНИЯ» (спека 2026-10-01 §3, флаг сборки
   NEXT_PUBLIC_MEDIA_FORMS_V2). Блочный вид: зоны-карточки с подписью, плитки
   «название + значение», круглая «↑» цвета акцента 44×44; капсул россыпью нет (Р3).
   «Стекло» (решение founder'а 02.10, референс — мобильный OpenArt): карточки —
   светлый градиент поверх --card и тонкая кромка, крупный заголовок зоны;
   размытие фона — только у прилипшей карточки запуска (одна поверхность: слабые
   телефоны). Цвета — только токены design.css; шрифты — только роли fs-*; листы —
   сплошные --card (§14); анимации — transform/opacity ≤ 250 мс.
   ========================================================================== */
.tgs-mf{box-sizing:border-box;width:100%;max-width:1248px;margin:0 auto;padding:0 16px;min-height:100dvh;display:flex;flex-direction:column;gap:8px;color:var(--text);--mf-glass:linear-gradient(180deg,var(--pane2),var(--pane));--mf-tint:rgba(255,188,0,.12);--mf-tint:color-mix(in srgb,var(--accent) 12%,transparent)}
@media (min-width:761px){.tgs-mf{padding:0 24px}}
.tgs-mf *,.tgs-mf *::before,.tgs-mf *::after{box-sizing:border-box}
/* Сброс кнопок и полей формы — в слое base (порядок слоёв объявлен в app/globals.css): без слоя он
   перебивал собственные классы (`.tgs-mf-run` — стрелка «↑» была белой на лайме, `.tgs-tab` — ряд
   разделов на форме выглядел не так, как в других разделах) и роли `fs-*` (они в слое utilities).
   Поля ввода шрифт не наследуют — без этого описание рисовалось системным шрифтом с засечками. */
@layer base{.tgs-mf button{font:inherit;color:inherit}.tgs-mf textarea,.tgs-mf input{font-family:inherit;color:inherit}}
/* Пока сессия «Монтажа» не поправила Root.tsx:475 (просьба — docs/design/
   requests-2026-10-01-media-images.md), строку агента на новой форме прячет это
   правило: запуск здесь — только круглая «↑» формы. Снять вместе с той правкой. */
.tg:has([data-tgs="tgs-media-forms-v2"]) .barwrap{display:none}
/* «Монтаж» (founder 17.10, AUDIT Д7/Д11): у вкладки свои поля — «Пожелания» и «Изменить словами»; общая строка агента
   лежала поверх шторок и таймлайна и перехватывала нажатия. Прячем её так же, как на новой форме «Медиа». */
.tg:has([data-tgs="tgs-montage"]) .barwrap{display:none}

/* Шапка телефона — карточка функции: обложка, имя («Функция ▾», когда функций больше одной), что получится; без отсвета (лава Р5). */
.tgs-mf-head{display:flex;align-items:center;gap:14px;margin-top:8px;padding:12px;border:1px solid var(--gb-line);border-radius:20px;background:var(--mf-glass),var(--card);box-shadow:var(--plate-sh)}
.tgs-mf-hero-cover{flex:none;width:56px;height:56px;border-radius:14px;overflow:hidden;background:var(--card2);box-shadow:0 0 0 1px var(--gb-line)}
.tgs-mf-hero-cover img{display:block;width:100%;height:100%;object-fit:cover}
.tgs-mf-hero-text{display:flex;flex-direction:column;gap:2px;min-width:0}
/* ☰ шторки — стеклянный круг 44. */
.tgs-mf-burger{flex:none;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--gb-line);border-radius:50%;background:var(--gb);color:var(--text);cursor:pointer}
.tgs-mf-burger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Телефон: ☰ в начале ряда разделов «Медиа» (решение founder'а 02.10); ряд прокручивается вбок рядом с ним. */
.tgs-tabs[data-burger]{display:flex;align-items:center;gap:4px}
.tgs-tabs[data-burger]>.tgs-tabs-row{flex:1;min-width:0}
/* На телефоне ряд — главная навигация «Медиа»: зона касания вкладки 44 (К3). Высота полосы ряда задана
   инлайном (`railBand`), а прокрутка вбок обрезает и по вертикали — на телефоне полоса по содержимому,
   иначе нажималось бы 32–36 px из 44 (аудит плана, круг 12). */
.tgs-mf[data-layout="phone"] .tgs-tab,.tgs-tabs[data-burger] .tgs-tab{min-height:44px}
.tgs-mf[data-layout="phone"] .tgs-tabs-row,.tgs-tabs[data-burger]>.tgs-tabs-row{height:auto!important;overflow-y:hidden}
/* Планшет 761–1024 (iPad в портрете 768/820 — сенсорный, раскладка «desk»): ряд на форме — тоже под палец,
   зона касания 44 (аудит р.1, NOFLAG-UI-6). Шире — компьютер с мышью, ряд как в остальных разделах. */
@media (min-width:761px) and (max-width:1024px){.tgs-mf[data-layout="desk"] .tgs-tab{min-height:44px}.tgs-mf[data-layout="desk"] .tgs-tabs-row{height:auto!important;overflow-y:hidden}}
/* Размытие фона на форме — только у карточки запуска (слабые телефоны): у ряда разделов его нет,
   поэтому подложка сплошная — прокрученная форма не просвечивает сквозь подписи. */
.tgs-mf .tgs-tabs{backdrop-filter:none;-webkit-backdrop-filter:none;background:var(--bg)}
.tgs-mf-fn{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 4px;border:0;background:transparent;cursor:pointer}
.tgs-mf-head .tgs-mf-fn{padding:0}
.tgs-mf-head .tgs-mf-fn-static{min-height:0}
.tgs-mf-fn-static{margin:0;cursor:default}
.tgs-mf-fn:focus-visible,.tgs-mf-tile:focus-visible,.tgs-mf-opt:focus-visible,.tgs-mf-row:focus-visible,.tgs-mf-model:focus-visible,.tgs-mf-seg button:focus-visible,.tgs-mf-run:focus-visible,.tgs-mf-x:focus-visible,.tgs-mf-drop:focus-within{outline:2px solid var(--accent);outline-offset:2px}

/* Зона — стеклянная карточка с крупным заголовком; приглушённое — подписи рядом. */
.tgs-mf-zone{background:var(--mf-glass),var(--card);border:1px solid var(--gb-line);border-radius:20px;padding:16px;box-shadow:var(--plate-sh)}
.tgs-mf-cap{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px;margin-bottom:12px;color:var(--text)}

/* Сегмент режимов на всю ширину. */
.tgs-mf-seg{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:4px;padding:4px;background:var(--gb);border:1px solid var(--gb-line);border-radius:16px}
.tgs-mf-seg button{min-height:44px;border:0;border-radius:12px;background:transparent;color:var(--muted);cursor:pointer}
/* Выбранный пункт — приподнятая плашка. */
.tgs-mf-seg button[aria-checked="true"]{background:var(--btn);color:var(--btn-ink);font-weight:600;box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 2px 8px rgba(0,0,0,.22)}

/* Плитки настроек 2×N и варианты 3 в ряд. */
.tgs-mf-tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tgs-mf-tile{position:relative;min-height:68px;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:10px 32px 10px 14px;text-align:left;background:var(--pane);border:1px solid var(--gb-line);border-radius:16px;cursor:pointer;transition:border-color .18s,background .18s}
/* Шеврон плитки — открывает лист вариантов. */
.tgs-mf-tile>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Совсем узкий телефон (320, с колонкой меню до правки Root.tsx): плитки в одну колонку — подписи читаются целиком. */
@media (max-width:360px){.tgs-mf-tiles{grid-template-columns:minmax(0,1fr)}}
.tgs-mf-tile::after{content:'';position:absolute;right:14px;top:50%;width:7px;height:7px;margin-top:-4px;border-right:1.8px solid var(--muted);border-bottom:1.8px solid var(--muted);transform:rotate(-45deg)}
.tgs-mf-opts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tgs-mf-opt{min-height:72px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:8px;background:var(--card2);border:1px solid var(--line);border-radius:12px;cursor:pointer}
.tgs-mf-opt[aria-checked="true"]{border-color:var(--accent)}
.tgs-mf-ratio{display:block;border:1.5px solid currentColor;border-radius:3px;opacity:.7}

/* Модель: строка выбора (значок бренда в квадрате, шеврон), строка-сведение, лист. */
.tgs-mf-model,.tgs-mf-row{width:100%;min-height:56px;display:flex;align-items:center;gap:12px;padding:8px 12px;text-align:left;background:var(--card2);border:1px solid var(--line);border-radius:12px;cursor:pointer}
.tgs-mf-model{min-height:72px;gap:12px;padding:10px 12px 10px 10px;background:var(--pane);border-color:var(--gb-line);border-radius:16px;transition:border-color .18s,background .18s}
/* Имя и описание модели в карточке — до двух строк, а не обрезка: на 375 с колонкой меню ширины мало. */
.tgs-mf-model .tgs-mf-model-text>span{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.tgs-mf-chev{flex:none;display:grid;place-items:center;color:var(--muted)}
.tgs-mf-model:hover,.tgs-mf-tile:hover{border-color:var(--gb-lh);background:var(--pane2)}
.tgs-mf-row{padding:8px 12px 8px 8px;background:transparent;border-color:transparent;border-radius:14px}
.tgs-mf-row[aria-pressed="true"]{background:var(--mf-tint);border-color:var(--accent)}
.tgs-mf-logo-disc{flex:none;width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:var(--btn);color:var(--btn-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.10)}
.tgs-mf-logo-disc .tgs-mf-logo{width:24px;height:24px}
.tgs-mf-logo-disc-sm{width:40px;height:40px}
.tgs-mf-logo-disc-sm .tgs-mf-logo{width:22px;height:22px}
.tgs-mf-model-text{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.tgs-mf-model-text>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgs-mf-logo{flex:none;width:24px;height:24px;background:currentColor}
.tgs-mf-logo-letter{display:grid;place-items:center;background:var(--card);border-radius:6px}
.tgs-mf-check{color:var(--accent-tx)}
.tgs-mf-summary{margin:0;padding:4px 0}
.tgs-mf-search{width:100%;min-height:44px;padding:8px 12px 8px 40px;background:var(--pane);color:var(--text);border:1px solid var(--gb-line);border-radius:14px}
/* Значок поиска — маской, цветом токена (не литералом в картинке). */
.tgs-mf-search-wrap{position:relative}
.tgs-mf-search-wrap::before{content:'';position:absolute;left:13px;top:50%;width:18px;height:18px;margin-top:-9px;background:var(--muted);pointer-events:none;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='5.5'/%3E%3Cpath d='M12.2 12.2L16 16'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='5.5'/%3E%3Cpath d='M12.2 12.2L16 16'/%3E%3C/svg%3E") center/contain no-repeat}

/* Загрузка: высокая пунктирная зона, значок в круге с «+»; миниатюры 56 px с ✕ (зона касания 44). */
.tgs-mf-drop{position:relative;min-height:148px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:20px 12px;border:1.5px dashed var(--gb-lh);border-radius:16px;background:var(--pane);cursor:pointer;transition:border-color .18s,background .18s}
.tgs-mf-drop:hover{border-color:var(--accent);background:var(--pane2)}
.tgs-mf-drop-icon{position:relative;width:56px;height:56px;margin-bottom:6px;display:grid;place-items:center;border-radius:50%;background:var(--btn);color:var(--btn-ink);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 6px 16px rgba(0,0,0,.25)}
.tgs-mf-drop-plus{position:absolute;right:-4px;bottom:-2px;width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:var(--accent-ink);font-weight:700;line-height:1;box-shadow:0 0 0 3px var(--card)}
.tgs-mf-file{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.tgs-mf-thumbs{display:flex;flex-wrap:wrap;gap:16px;margin:0 0 12px;padding:12px 12px 0 0;list-style:none}
.tgs-mf-thumb{position:relative;width:56px;height:56px;border-radius:10px;background:var(--card2)}
.tgs-mf-thumb img,.tgs-mf-thumb-blank{display:block;width:56px;height:56px;border-radius:10px;object-fit:cover}
.tgs-mf-thumb[data-status="failed"]{outline:2px solid var(--err);outline-offset:-2px}
.tgs-mf-ring{position:absolute;inset:16px;border:2px solid var(--muted);border-top-color:transparent;border-radius:50%;animation:tg-spin .9s linear infinite}
.tgs-mf-x{position:absolute;top:-14px;right:-14px;z-index:1;width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;cursor:pointer}
.tgs-mf-x::before{content:'';position:absolute;inset:12px;border-radius:50%;background:var(--card);border:1px solid var(--line);z-index:-1}
.tgs-mf-retry{position:absolute;inset:0;width:56px;min-height:56px;border:0;border-radius:10px;background:var(--dim);cursor:pointer}

/* Описание: на телефоне — своё поле внутри карточки. */
/* Ручки изменения размера нет нигде: на компьютере она растила карточку ввода поверх работ (аудит р.1, NOFLAG-UI-7). */
.tgs-mf-prompt textarea{display:block;width:100%;min-height:88px;resize:none;padding:0;border:0;outline:0;background:transparent;color:var(--text)}
.tgs-mf-prompt textarea::placeholder{color:var(--faint)}
.tgs-mf-zone .tgs-mf-prompt{padding:12px 14px;border:1px solid var(--gb-line);border-radius:16px;background:var(--pane)}
.tgs-mf-zone .tgs-mf-prompt:focus-within{border-color:var(--accent)}
.tgs-mf-zone .tgs-mf-prompt textarea{min-height:96px}

/* Запуск: круглая «↑», карточка запуска (телефон), «В работе». */
.tgs-mf-run{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:var(--pearl);color:var(--pearl-ink);box-shadow:var(--pearl-sh);cursor:pointer;transition:transform .15s cubic-bezier(.2,0,0,1)}
.tgs-mf-run:active{transform:scale(.94)}
.tgs-mf-run:not(:disabled):hover{box-shadow:var(--pearl-sh-h)}
/* Неактивная — нейтральная (лава Р10): графит и рамка, без прозрачности; кнопка-иконка — --faint. */
.tgs-mf-run:disabled{background:var(--card2);box-shadow:none;border:1px solid var(--gb-line);color:var(--faint);cursor:default}
.tgs-mf-run[aria-busy="true"] svg{animation:tg-spin .9s linear infinite}
.tgs-mf-runtext{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.tgs-mf-runrow{display:flex;align-items:center;gap:12px}
/* Единственная поверхность с размытием фона (слабые телефоны). */
.tgs-mf-runcard{position:sticky;bottom:0;z-index:20;margin:8px -16px 0;padding:8px 16px calc(8px + env(safe-area-inset-bottom));background:var(--plate2);border-top:1px solid var(--gb-line);border-radius:22px 22px 0 0;box-shadow:0 -10px 30px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%)}
.tgs-mf-inwork{width:100%;min-height:44px;display:flex;align-items:center;gap:4px;padding:0;border:0;background:transparent;cursor:pointer;text-align:left}
.tgs-mf-link{min-height:44px;padding:0 0 0 4px;border:0;background:transparent;color:var(--accent-tx);cursor:pointer}

/* Листы снизу (телефон) и панели над карточкой ввода (компьютер). */
.tgs-mf-backdrop{position:fixed;inset:0;z-index:70;border:0;padding:0;background:var(--dim);cursor:default}
.tgs-mf-sheet{position:fixed;left:0;right:0;bottom:0;z-index:71;max-height:90dvh;display:flex;flex-direction:column;background:var(--card);border-radius:20px 20px 0 0;padding:0 16px calc(16px + env(safe-area-inset-bottom));animation:tgs-mf-up .22s cubic-bezier(.2,.8,.2,1) both}
.tgs-mf-panel{position:absolute;left:0;bottom:calc(100% + 8px);z-index:71;width:min(560px,100%);max-height:min(70dvh,640px);display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:0 16px 16px;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.tgs-mf-sheet:focus,.tgs-mf-panel:focus{outline:none}
.tgs-mf-sheet-head{position:relative;display:flex;align-items:center;justify-content:center;min-height:52px;padding-top:8px;touch-action:none}
.tgs-mf-handle{position:absolute;top:8px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:2px;background:var(--gb-lh)}
.tgs-mf-sheet-body{overflow-y:auto;overscroll-behavior:contain;padding-bottom:8px}
@keyframes tgs-mf-up{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}

/* Лист функций: группы функций (появится, когда функций станет больше одной). */
.tgs-mf-fnitem{width:100%;min-height:56px;display:flex;flex-direction:column;justify-content:center;gap:2px;padding:8px 12px;text-align:left;border:1px solid transparent;border-radius:12px;background:transparent;cursor:pointer}
.tgs-mf-fnitem[aria-current="true"]{background:var(--card2);border-color:var(--accent)}

/* Мои работы: по 2 на телефоне и на 900 (§3.3), по 4 на широком. Список без своего отступа. */
.tgs-mf-works{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;scroll-margin-top:16px}
@media (min-width:1200px){.tgs-mf-works{grid-template-columns:repeat(4,minmax(0,1fr))}}
.tgs-mf-work{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:12px;background:var(--card2)}
.tgs-mf-work img{display:block;width:100%;height:100%;object-fit:cover}
.tgs-mf-work-info{position:absolute;left:8px;right:8px;bottom:8px;display:flex;flex-direction:column;gap:2px}
.tgs-mf-empty{margin:0;padding:28px 16px;border:1px dashed var(--gb-line);border-radius:20px;background:var(--pane);color:var(--muted);text-align:center}
.tgs-mf-mine{margin-top:16px}
.tgs-mf-mine-title{margin:0 0 10px}

/* Компьютер и планшет: карточка ввода внизу по центру, до 1200 (§3.3). */
.tgs-mf[data-layout="desk"]{padding-top:16px}
.tgs-mf-desk{flex:1;display:flex;flex-direction:column;gap:16px;padding-bottom:16px}
.tgs-mf-composer{position:sticky;bottom:16px;z-index:20;width:100%;max-width:1200px;margin:auto auto 0;display:flex;flex-direction:column;gap:8px;padding:12px;background:var(--card);border:1px solid var(--line);border-radius:20px;box-shadow:0 12px 40px rgba(0,0,0,.28)}
.tgs-mf-composer-top{display:flex;align-items:flex-start;gap:12px}
.tgs-mf-composer-top .tgs-mf-prompt{flex:1;min-width:0}
.tgs-mf-composer-row{display:flex;flex-wrap:wrap;align-items:center;gap:4px}
.tgs-mf-chip{position:relative;min-height:44px;min-width:44px;display:inline-flex;align-items:center;gap:6px;padding:0 12px;border:0;border-radius:12px;background:transparent;cursor:pointer}
.tgs-mf-chip>.tgs-mf-chip-face{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:var(--card2);border:1px solid var(--line)}
.tgs-mf-chip:hover>.tgs-mf-chip-face{border-color:var(--gb-lh)}
.tgs-mf-chip:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.tgs-mf-composer-end{margin-left:auto;display:flex;align-items:center;gap:12px}
.tgs-mf-composer .tgs-mf-runtext{flex:none;align-items:flex-end;text-align:right;white-space:nowrap}
.tgs-mf-composer .tgs-mf-why{white-space:normal;max-width:28ch}
.tgs-mf-reopened{margin:8px 0 0;color:var(--muted)}
/* Старая витрина раздела над формой (показ 06.10, F7): свои поля у неё внутри (как на экране без флага), здесь —
   отступы: сверху 8, как у шапки формы (на телефоне ряд разделов выше своей полосы и иначе накрыл бы верх
   карусели), снизу 16 до формы. Поле описания на телефоне докручивается над карточкой запуска (она прилипает к низу). */
.tgs-mf-showcase{margin:8px 0 16px}
.tgs-mf[data-layout="phone"] .tgs-mf-prompt textarea{scroll-margin:16px 0 136px}
/* Заметка «Фото из строки не перенесены» у поля входов (аудит р.2, R2-WIRE-2); «✕» — зона касания 44. */
.tgs-mf-photos-note{display:flex;align-items:center;gap:4px;margin:0;color:var(--muted)}
.tgs-mf-photos-note-x{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;color:var(--muted);cursor:pointer}
.tgs-mf-photos-note-x:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Шапка листа моделей (поиск и лента) закреплена над прокручиваемым списком. */
.tgs-mf-pick-head{position:sticky;top:0;z-index:1;background:var(--card);padding-bottom:4px}
/* С лентой брендов лист моделей — постоянной высоты (как окно выбора модели на компьютере): выбор бренда не сжимает лист и не двигает его верх. */
.tgs-mf-sheet:has(.tgs-mf-pick[data-brands]){height:90dvh}
.tgs-mf-panel:has(.tgs-mf-pick[data-brands]){height:min(70dvh,640px)}
.tgs-mf-sheet:has(.tgs-mf-pick[data-brands]) .tgs-mf-sheet-body,.tgs-mf-panel:has(.tgs-mf-pick[data-brands]) .tgs-mf-sheet-body{flex:1;min-height:0}
/* Лента брендов листа моделей: прокрутка вбок без полосы, коробка кнопки 44 (К3), «пилюля» — внутренний span. */
.tgs-mf-brands{display:flex;gap:6px;overflow-x:auto;margin:8px 0 0;scrollbar-width:none}
.tgs-mf-brands::-webkit-scrollbar{display:none}
.tgs-mf-brand{flex:none;min-width:44px;min-height:44px;padding:0;border:0;background:transparent;color:var(--text);cursor:pointer;display:inline-flex;align-items:center}
.tgs-mf-brand span{display:inline-flex;align-items:center;height:32px;padding:0 13px;border-radius:999px;border:1px solid var(--gb-line);background:var(--gb);white-space:nowrap;font-weight:500}
.tgs-mf-brand[aria-pressed="true"] span{background:var(--accent);color:var(--accent-ink);border-color:transparent}
.tgs-mf-brand:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* Якорь панелей — верхний край карточки ввода: панель встаёт над ней с зазором 8. */
.tgs-mf-anchor{position:absolute;top:0;left:12px;right:12px;height:0}
/* Список настройки на компьютере (показ 06.10, А) — размеры поповера настроек строки агента
   (CommandBar): ширина по значениям 172–240, радиус 14, пункты колонкой, прокрутка после 232.
   Выбранный — галочка и подложка --card2, без ореола (лава Р6/Р8). Левый край ставит компонент. */
.tgs-mf-menu{position:absolute;left:0;bottom:8px;z-index:71;width:max-content;min-width:172px;max-width:240px;display:flex;flex-direction:column;gap:6px;padding:8px;border-radius:14px;box-shadow:var(--sh2)}
.tgs-mf-menu-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 6px 0;color:var(--text)}
.tgs-mf-menu-list{display:flex;flex-direction:column;max-height:232px;overflow-y:auto;overscroll-behavior:contain}
.tgs-mf-menu-list [role="group"]{display:flex;flex-direction:column}
.tgs-mf-menu-sep{margin:6px 0 2px;padding:6px 7px 0;border-top:1px solid var(--line);color:var(--faint)}
.tgs-mf-menu-opt{display:flex;align-items:center;gap:9px;padding:7px;border-radius:9px;color:var(--text);cursor:pointer;white-space:nowrap}
.tgs-mf-menu-opt:hover{background:var(--line)}
.tgs-mf-menu-opt[aria-selected="true"]{background:var(--card2)}
.tgs-mf-menu-opt:focus{outline:none}
.tgs-mf-menu-opt:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}
.tgs-mf-menu-ico{flex:none;width:16px;height:16px;display:flex;align-items:center;justify-content:center}
.tgs-mf-menu-box{display:block;border-radius:2px;border:1px solid var(--muted)}
.tgs-mf-menu-label{flex:1;min-width:0}
.tgs-mf-menu-check{flex:none;width:14px;height:14px;display:flex;color:var(--accent-tx)}

/* НЕАКТИВНАЯ КНОПКА НА ЛАВЕ — founder 05.10.2026 (спека лавы Р10, И9).
   Прозрачная лава на графите даёт бурый круг (#773F2C). Неактивная —
   нейтральная: графит и рамка; лава — только у готовой к нажатию.
   Текст — --muted (5,56 на --card2); у кнопки-иконки — --faint (4,28 ≥ 3). */
.tg .gb-solid:disabled,.tg .gb-solid[aria-disabled="true"]{background:var(--card2);box-shadow:none;border:1px solid var(--gb-line);color:var(--muted);filter:none;cursor:not-allowed}
.tg .gb-solid[aria-disabled="true"]:has(> svg:only-child){color:var(--faint)}

/* «Демо продукта» — предпоказ сценария (спека screen §7.2, вид B). Лента снимков листается внутри своей области:
   страница на 360 px не прокручивается вбок. Акцент — жёлтый #FFBC00 (выделенный снимок, отметки), кнопки — жемчуг. */
.tgs-ds{display:flex;flex-direction:column;gap:16px;min-width:0}
.tgs-ds h2{margin:0;font-family:'Manrope',system-ui,sans-serif;font-weight:800;text-wrap:balance}
.tgs-ds-cards{display:flex;flex-direction:column;gap:12px;min-width:0}
.tgs-ds-card{display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--pane)}
.tgs-ds-card p{margin:0}
.tgs-ds-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px}
.tgs-ds-headtx{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
.tgs-ds-headtx p{overflow-wrap:anywhere}
.tgs-ds-chip{padding:2px 8px;border-radius:999px;background:rgba(255,188,0,.10);color:var(--accent-tx);font-weight:600}
.tgs-ds-seg{display:inline-flex;padding:2px;border:1px solid var(--gb-line);border-radius:10px;background:var(--gb)}
.tgs-ds-seg button{min-height:32px;padding:0 10px;border:0;border-radius:8px;background:none;color:var(--muted);font-weight:500}
.tgs-ds-seg button[aria-pressed=true]{background:var(--pane);color:var(--text)}
.tgs-ds-seg button:disabled{cursor:default}
.tgs-ds-fail{flex-direction:column;align-items:flex-start}
.tgs-ds-exits{display:flex;flex-wrap:wrap;gap:8px}
.tgs-ds-ribbon{display:flex;gap:8px;max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding-bottom:4px}
.tgs-ds-ribbon>div{flex:none;scroll-snap-align:start}
.tgs-ds-shot{position:relative;display:block;padding:0;border:2px solid transparent;border-radius:12px;background:var(--gb);overflow:hidden;transition:border-color .12s ease}
.tgs-ds-shot[aria-pressed=true]{border-color:var(--accent)}
.tgs-ds-shot:active{transform:scale(.98)}
.tgs-ds-pair{display:flex;gap:2px}
.tgs-ds-pair img{display:block;width:56px;height:116px;object-fit:cover;object-position:top}
.tgs-ds-ph{display:block;width:114px;height:116px;background:var(--gb)}
.tgs-ds-num{position:absolute;top:4px;left:4px;display:grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:rgba(0,0,0,.62);color:#fff;font-weight:600}
.tgs-ds-marks{position:absolute;right:4px;bottom:4px;display:flex;gap:2px;padding:2px 4px;border-radius:8px;background:rgba(0,0,0,.62);color:var(--accent)}
.tgs-ds-steps{margin:0;padding:4px;list-style:none;border-radius:12px;background:var(--gb)}
.tgs-ds-steps.all{max-height:280px;overflow-y:auto;overscroll-behavior:contain}
.tgs-ds-row{display:flex;align-items:baseline;gap:8px;width:100%;padding:8px;border:0;border-radius:8px;background:none;color:var(--text);text-align:left}
.tgs-ds-row[aria-pressed=true]{background:rgba(255,188,0,.08)}
.tgs-ds-n{flex:none;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--pane);color:var(--muted)}
.tgs-ds-warn{margin-left:auto;padding-left:8px;color:var(--mi-warn);white-space:nowrap}
.tgs-ds-words{display:flex;flex-direction:column;gap:8px}
.tgs-ds-words textarea{box-sizing:border-box;width:100%;min-height:88px;padding:12px;border:1px solid var(--gb-line);border-radius:12px;background:var(--gb);color:var(--text);resize:vertical}
.tgs-ds-wordsacts{display:flex;align-items:center;justify-content:flex-end;gap:12px}
.tgs-ds-acts{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.tgs-ds-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}
.tgs-ds-editor{display:flex;flex-direction:column;gap:12px;padding:12px;border:1px solid var(--gb-line);border-radius:14px;background:var(--card2)}
.tgs-ds-edtop{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 8px}
.tgs-ds-edbody{display:grid;grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:16px;align-items:start}
.tgs-ds-big{position:relative;overflow:hidden;border-radius:12px;touch-action:none;cursor:crosshair;user-select:none}
.tgs-ds-big.drag{cursor:ns-resize}
.tgs-ds-big img{display:block;width:100%;height:auto;pointer-events:none}
.tgs-ds-dot{position:absolute;width:22px;height:22px;margin:-11px 0 0 -11px;border:2px solid var(--accent);border-radius:50%;box-shadow:0 0 0 4px rgba(255,188,0,.25);pointer-events:none}
.tgs-ds-ctrls{display:flex;flex-direction:column;gap:10px;min-width:0}
.tgs-ds-ctrl{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tgs-ds-val{min-width:48px;text-align:center;font-variant-numeric:tabular-nums}
@media (max-width:600px){.tgs-ds-card{padding:12px}.tgs-ds-edbody{grid-template-columns:minmax(0,1fr)}.tgs-ds-big{max-width:220px}}
@media (prefers-reduced-motion:reduce){.tgs-ds-shot{transition:none}.tgs-ds-shot:active{transform:none}}

/* ЭКРАН ВВОДА «МОНТАЖА» ред. 2.0 (план ЕФ3, за флагом NEXT_PUBLIC_MONTAGE_INPUT=1). Перенос из макета ред. 3
   (design/montage-input/montage-r3.html, `.composer` и соседи), приставка `tgs-mi-`. Жемчужная кнопка и подсветка
   1,2 с — переменные `--mi-*` на корне экрана (как `--mf-glass` у «Медиа»): глобальных `--*` файл не объявляет.
   Телефон — контейнерный запрос по ширине экрана, а не окна: экран живёт внутри оболочки с боковой панелью. */
.tgs-mi{container-type:inline-size;box-sizing:border-box;width:100%;color:var(--mi-ink);
  --mi-glass:linear-gradient(180deg,var(--pane2),var(--pane));
  --mi-pearl:radial-gradient(ellipse 105% 150% at 50% 50%,#F3F3F3 0%,#EEEEEE 42%,#E2ECF0 72%,#CCDDE3 100%);
  --mi-pearl-sh:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.55),inset 0 0 10px 1px rgba(160,198,212,.45),0 0 16px 1px rgba(225,238,243,.16);
  --mi-pearl-ink:#141516;--mi-warn:#FF9F43;--mi-err:#FF6B9E;
  /* Вид «Итог» (спека UX §4, сверено с холстом 17.10). Выделение и фокус — жемчужно-белые: жёлтый только у
     точки баланса и выделенного слова субтитров (К-15), поэтому --mi-hi больше не жёлтый. */
  --mi-hi:#F2F1EE;--mi-hi-tx:#F2F1EE;--mi-sel:rgba(242,241,238,.08);
  --mi-bg:#18181A;--mi-halo:radial-gradient(60% 50% at 50% 40%,#26272B,transparent);
  --mi-plate:rgba(40,40,43,.6);--mi-plate-solid:#232326;--mi-plate-blur:blur(28px) saturate(140%);
  --mi-plate-edge:rgba(255,255,255,.07);--mi-plate-sh:inset 0 1px 0 rgba(255,255,255,.10),0 40px 90px rgba(0,0,0,.55);
  --mi-scrim:rgba(24,24,26,.8);
  --mi-r-out:32px;--mi-r-in:18px;
  --mi-lac:linear-gradient(180deg,#151517,#0E0E10);--mi-lac-hover:linear-gradient(180deg,#19191C,#111113);
  --mi-lac-edge:linear-gradient(125deg,rgba(226,236,240,.32),rgba(255,255,255,.05) 38%,rgba(255,255,255,.035) 62%,rgba(160,198,212,.18));
  --mi-lac-edge-hover:linear-gradient(125deg,rgba(226,236,240,.45),rgba(255,255,255,.07) 38%,rgba(255,255,255,.05) 62%,rgba(160,198,212,.26));
  --mi-lac-on:linear-gradient(180deg,#1D1E21,#141517);
  --mi-lac-edge-on:linear-gradient(125deg,rgba(243,246,247,.55),rgba(204,221,227,.16) 45%,rgba(204,221,227,.40));
  --mi-lac-sh:0 12px 30px -14px rgba(0,0,0,.75);
  --mi-ink:#F2F1EE;--mi-ink-2:rgba(242,241,238,.68);--mi-ink-3:rgba(242,241,238,.46);
  --mi-track:#0D0D0F;--mi-track-edge:rgba(255,255,255,.07);
  --mi-accent:#FFBC00;
  --mi-ease:cubic-bezier(.2,.8,.2,1)}
/* Меньше прозрачности или нет backdrop-filter (§4, К-13): пластина сплошная, кромка 18 %. */
.tgs-mi.is-solid{--mi-plate:var(--mi-plate-solid);--mi-plate-blur:none;--mi-plate-edge:rgba(255,255,255,.18)}
/* Меньше движения: без блика процесса и веера, переходы — только прозрачность 150 мс. */
.tgs-mi.is-still *,.tgs-mi.is-still *::before,.tgs-mi.is-still *::after{animation:none!important;transition-property:opacity!important;transition-duration:.15s!important}
.tgs-mi-balance-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--mi-accent)}
.tgs-mi-cap-hi{color:var(--mi-accent)}
/* Детали вида «Итог» (план Ф3): пластина, капсула лака, дорожка, ползунок, шторка. */
.tgs-mi-plate{background:var(--mi-plate);backdrop-filter:var(--mi-plate-blur);-webkit-backdrop-filter:var(--mi-plate-blur);border:1px solid var(--mi-plate-edge);box-shadow:var(--mi-plate-sh);border-radius:var(--mi-r-out);padding:16px;color:var(--mi-ink)}
.tgs-mi-lac{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid transparent;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;box-shadow:var(--mi-lac-sh);color:var(--mi-ink);font-weight:500;white-space:nowrap;transition:background .18s,transform .12s}
.tgs-mi-lac:hover{background:var(--mi-lac-hover) padding-box,var(--mi-lac-edge-hover) border-box}
.tgs-mi-lac.is-pressed{transform:scale(.97)}
.tgs-mi-lac[aria-pressed="true"]{background:var(--mi-lac-on) padding-box,var(--mi-lac-edge-on) border-box;font-weight:600;color:#fff}
.tgs-mi-lac:disabled{opacity:.45}
.tgs-mi-track{display:grid;padding:4px;border-radius:999px;background:var(--mi-track);border:1px solid var(--mi-track-edge)}
.tgs-mi-track-i{height:40px;border:1px solid transparent;border-radius:999px;background:none;color:var(--mi-ink-2);font-weight:500;transition:background .2s,color .2s}
.tgs-mi-track-i[aria-selected="true"]{color:#fff;font-weight:600;background:var(--mi-lac-on) padding-box,var(--mi-lac-edge-on) border-box;box-shadow:var(--mi-lac-sh)}
/* Компактный переключатель внутри строки (тема/текст, длина сценария) */
.tgs-mi-track.sm{align-self:flex-start;padding:3px}
.tgs-mi-track.sm .tgs-mi-track-i{height:32px;padding:0 12px}
.tgs-mi-pearl{min-height:52px;padding:0 24px;border-radius:999px;font-size:var(--fs-lead)}
.tgs-mi-pearl:disabled{opacity:.5}
.tgs-mi-pearl[data-size="bar"]{height:50px;min-height:0;padding:0 24px;font-size:var(--fs-lead)}
.tgs-mi-pearl[data-size="compact"]{position:relative;display:inline-flex;align-items:center;gap:8px;height:36px;min-height:0;padding:0 16px;font-size:var(--fs-ui)}
.tgs-mi-pearl[data-size="compact"]::after{content:"";position:absolute;inset:min(0px, (100% - 44px) / 2)}
/* Причина «нельзя» — на самой кнопке (Р26 §3.2): читается без прозрачности, --muted на --card2 ≥ 4.5:1 в обеих темах. */
.tgs-mi-pearl:disabled[data-reason]{opacity:1;background:var(--card2);color:var(--muted);font-weight:500}
.tgs-mi-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tgs-mi-slider{display:flex;align-items:center;gap:12px;width:100%}
.tgs-mi-slider input{flex:1;-webkit-appearance:none;appearance:none;height:6px;border-radius:999px;background:linear-gradient(90deg,var(--mi-ink) var(--mi-fill,50%),rgba(255,255,255,.12) var(--mi-fill,50%));outline-offset:6px}
.tgs-mi-slider input::-webkit-slider-thumb{-webkit-appearance:none;width:24px;height:24px;border-radius:50%;background:radial-gradient(circle at 50% 35%,#fff,#DDE7EB);box-shadow:0 2px 10px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.6)}
.tgs-mi-slider input::-moz-range-thumb{width:24px;height:24px;border:0;border-radius:50%;background:#EEF2F4}
.tgs-mi-slider-v{min-width:44px;text-align:right;font-variant-numeric:tabular-nums;color:var(--mi-ink)}
.tgs-mi-drawer-grip{width:36px;height:5px;border-radius:3px;background:rgba(255,255,255,.22);margin:0 auto 2px}
.tgs-mi-drawer-body{max-height:60dvh;overflow-y:auto}
/* Главная «Итог» (план Ф5, спека UX §3.1): фон-кадр стиля, пластина ввода 440px с веером, ряд «Стили». */
/* Без z-index и isolation у .tgs-mi и .tgs-mi-wrap: иначе fixed-окна вкладки (z 30–70) оказываются под боковой панелью
   и строкой ассистента платформы. Фон-кадр идёт первым ребёнком, шапка и сетка — позиционированы и рисуются поверх. */
.tgs-mi{position:relative;background:var(--mi-bg)}
.tgs-mi-wrap{position:relative}
.tgs-mi-head{position:relative;justify-content:space-between}
.tgs-mi-balance{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid transparent;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;box-shadow:var(--mi-lac-sh);color:var(--mi-ink);font-variant-numeric:tabular-nums}
/* Ореол гаснет к бокам и вниз маской: он шириной контента, а не экрана, — без маски на широком экране виден прямоугольник. */
.tgs-mi-backdrop{position:absolute;inset:0 0 auto 0;height:640px;z-index:0;overflow:hidden;pointer-events:none;background:var(--mi-halo);-webkit-mask-image:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent),linear-gradient(to bottom,#000 55%,transparent);mask-image:linear-gradient(to right,transparent,#000 14%,#000 86%,transparent),linear-gradient(to bottom,#000 55%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}
.tgs-mi-backdrop img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block;animation:tgs-mi-fade .3s ease;filter:blur(24px);transform:scale(1.08)}
.tgs-mi-backdrop::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),linear-gradient(0deg,var(--mi-bg) 0%,rgba(24,24,26,0) 40%)}
@keyframes tgs-mi-fade{from{opacity:0}to{opacity:1}}
.tgs-mi-homegrid{position:relative;display:flex;flex-direction:column;gap:12px;padding-top:24px}
.tgs-mi-input{width:min(440px,100%);display:flex;flex-direction:column;gap:12px}
.tgs-mi-fanzone{position:relative;display:flex;flex-direction:column;gap:8px}
.tgs-mi-fanrow{display:flex;align-items:center;gap:16px;min-height:112px;padding:16px 16px;border-radius:var(--mi-r-in);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.tgs-mi-fan{position:relative;width:118px;height:84px;flex:none}
.tgs-mi-fan-card{position:absolute;top:4px;width:52px;height:80px;border-radius:10px;overflow:hidden;background:linear-gradient(160deg,#2A2C31,#16171A);box-shadow:0 10px 24px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.12);transition:transform .3s var(--mi-ease)}
.tgs-mi-fan-card[data-i="0"]{left:4px;transform:rotate(-8deg)}
.tgs-mi-fan-card[data-i="1"]{left:34px;top:0;transform:rotate(0deg);z-index:1}
.tgs-mi-fan-card[data-i="2"]{left:64px;transform:rotate(8deg);z-index:2}
.tgs-mi-fan-card img{width:100%;height:100%;object-fit:cover;display:block}
/* Р22: у нижних карточек пустого веера видна полоса 30 px (шаг веера) — значок в ней, а не под соседней карточкой */
.tgs-mi-fan-card[data-fan="placeholder"]:not([data-i="2"]) .tgs-mi-fan-ic{right:auto;width:30px}
.tgs-mi-fan-card[data-fan-state="failed"]{box-shadow:0 0 0 1.5px var(--mi-err)}
.tgs-mi-fan-ic,.tgs-mi-fan-pct,.tgs-mi-fan-bad{position:absolute;inset:0;display:grid;place-items:center;color:var(--mi-ink-2);font-variant-numeric:tabular-nums}
.tgs-mi-fan-pct{background:rgba(0,0,0,.5);color:var(--mi-ink)}
.tgs-mi-fan-bad{color:var(--mi-err);font-weight:700}
.tgs-mi-fan-card .tgs-mi-rm{opacity:0;transition:opacity .15s}
.tgs-mi-fan:hover .tgs-mi-rm,.tgs-mi-fan-card:focus-within .tgs-mi-rm{opacity:1}
.tgs-mi-fanbtn{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:8px;border:0;background:none;padding:0;text-align:left;color:var(--mi-ink)}
.tgs-mi-fan-t{font-size:var(--fs-lead);font-weight:600;letter-spacing:-.01em}
.tgs-mi-fan-s{color:var(--mi-ink-2)}
.tgs-mi-fanline{display:flex;align-items:center;gap:12px;margin:0;padding:0 8px;color:var(--mi-ink-2)}
.tgs-mi-fanline.e{color:var(--mi-err)}
.tgs-mi-fanline .tgs-mi-bar{flex:1}
.tgs-mi-wish{display:block;padding:8px 16px 2px}
.tgs-mi-wish-l{display:block;margin-bottom:8px;color:var(--mi-ink-3)}
.tgs-mi-wish textarea{width:100%;resize:none;border:0;outline:0;background:none;color:var(--mi-ink);font:400 var(--fs-lead)/1.45 'Manrope',system-ui,sans-serif;max-height:calc(4 * 1.45em);overflow-y:auto}
.tgs-mi-wish textarea::placeholder{color:var(--mi-ink-3)}
.tgs-mi-choice{display:flex;align-items:center;gap:12px;width:100%;min-height:60px;padding:12px 16px;border-radius:var(--mi-r-in);border:1px solid transparent;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;box-shadow:var(--mi-lac-sh);color:var(--mi-ink);text-align:left}
.tgs-mi-choice[aria-pressed="true"]{background:var(--mi-lac-on) padding-box,var(--mi-lac-edge-on) border-box}
.tgs-mi-choice:hover{background:var(--mi-lac-hover) padding-box,var(--mi-lac-edge-hover) border-box}
.tgs-mi-choice>svg{opacity:.45;flex:none}
.tgs-mi-choice-thumb{width:30px;height:42px;border-radius:8px;object-fit:cover;flex:none;background:#212124}
.tgs-mi-choice-ic{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);flex:none}
.tgs-mi-galh{display:flex;align-items:baseline;gap:32px;flex-wrap:wrap}
.tgs-mi-galt{margin:0 8px 0 0;font-weight:700;letter-spacing:-.01em;color:var(--mi-ink)}
.tgs-mi-row-cards{display:flex;gap:16px;overflow-x:auto;padding:4px 2px 8px;scroll-snap-type:x proximity;scrollbar-width:none}
.tgs-mi-row-cards>[data-card]{flex:none;width:188px;scroll-snap-align:start}
.tgs-mi-row-cards .tgs-mi-pv{position:relative;display:block;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:#212124;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.tgs-mi-row-cards .tgs-mi-sc.on .tgs-mi-pv{outline:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07),0 0 0 2px var(--mi-bg),0 0 0 3px rgba(242,241,238,.85)}
.tgs-mi-sc-cap{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:2px;padding:40px 16px 16px;background:linear-gradient(0deg,rgba(0,0,0,.82),rgba(0,0,0,0));text-align:left;pointer-events:none}
.tgs-mi-scpick{position:relative;display:block;width:100%}
.tgs-mi-sc-name{color:#fff}
.tgs-mi-sc-sub{color:var(--mi-ink-2)}
/* Превью 9:16 (план Ф6, спека UX §5): плеер или запасное видео, строка состояния под кадром. */
.tgs-mi-preview{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.tgs-mi-preview-frame{position:relative;height:min(calc(100vh - 180px),720px);aspect-ratio:9/16;max-width:100%;border-radius:30px;overflow:hidden;background:#0E0E10;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 50px 120px rgba(0,0,0,.7);transition:opacity .3s ease}
.tgs-mi-preview.is-swap .tgs-mi-preview-frame{animation:tgs-mi-fade .3s ease}
.tgs-mi-preview-video,.tgs-mi-preview-frame>div{width:100%;height:100%;object-fit:cover;display:block}
.tgs-mi-preview-status{color:var(--mi-ink-2);text-align:center}
.tgs-mi[data-layout="phone"] .tgs-mi-input{width:100%}.tgs-mi[data-layout="phone"] .tgs-mi-backdrop{height:420px}
.tgs-mi *,.tgs-mi *::before,.tgs-mi *::after{box-sizing:border-box}
:where(.tgs-mi) button{font:inherit;color:inherit;cursor:pointer}
:where(.tgs-mi) :is(input,textarea,select){font-family:inherit}
:where(.tgs-mi) button:disabled{cursor:default}
.tgs-mi button:focus-visible,.tgs-mi input:focus-visible{outline:2px solid var(--mi-hi);outline-offset:2px}
.tgs-mi-composer:has(textarea:focus-visible){border-color:var(--gb-lh)}
.tgs-mi-wrap{box-sizing:content-box;max-width:1060px;margin:0 auto;padding:16px 24px 120px;display:flex;flex-direction:column;gap:12px}
.tgs-mi-head{display:flex;align-items:center;gap:12px;min-height:44px}
.tgs-mi-title{margin:0;font-family:'Manrope',system-ui,sans-serif;font-weight:600;font-size:var(--fs-num);letter-spacing:-.02em;color:var(--mi-ink)}
@keyframes tgs-mi-flash{0%{outline:2px solid var(--mi-hi)}100%{outline:2px solid transparent}}
.tgs-mi .flash{animation:tgs-mi-flash 1.2s ease-out 2}
@keyframes tgs-mi-spin{to{transform:rotate(360deg)}}
.tgs-mi-spin{display:inline-block;width:14px;height:14px;border-radius:50%;border:2px solid var(--gb-lh);border-top-color:var(--mi-hi);animation:tgs-mi-spin .9s linear infinite;flex:none}
.tgs-mi-composer{position:relative;display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--mi-glass),var(--card);border:1px solid var(--gb-line);border-radius:22px;box-shadow:var(--plate-sh)}
.tgs-mi-mediabox{position:relative;display:flex;flex-direction:column;gap:8px}
.tgs-mi-media{display:flex;gap:8px;align-items:center;overflow-x:auto;scrollbar-width:none}
.tgs-mi-addm{display:inline-flex;align-items:center;gap:12px;min-height:52px;max-width:100%;padding:0 16px 0 8px;border:1.5px dashed var(--gb-lh);border-radius:14px;background:var(--pane);font-weight:600;text-align:left}
.tgs-mi-pl{flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:var(--card2)}
.tgs-mi-src{font-weight:400;color:var(--muted)}
.tgs-mi-thumb{position:relative;flex:none;width:52px;height:68px;border-radius:10px;overflow:hidden;background:linear-gradient(160deg,#4a5260,#23262c);box-shadow:0 0 0 1px var(--gb-line)}
.tgs-mi-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.tgs-mi-thumb-ic{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted)}
.tgs-mi-dur{position:absolute;left:3px;bottom:3px;padding:0 4px;border-radius:5px;background:rgba(0,0,0,.6);font-variant-numeric:tabular-nums}
.tgs-mi-ring{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.5);font-variant-numeric:tabular-nums}
.tgs-mi-rm{position:absolute;top:2px;right:2px;width:24px;height:24px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(0,0,0,.55)}
.tgs-mi-voice{display:inline-flex;align-items:center;gap:8px}
.tgs-mi-mic{flex:none;width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--gb-line);border-radius:50%;background:var(--gb)}
.tgs-mi-mic.on{background:var(--mi-pearl);box-shadow:var(--mi-pearl-sh);color:var(--mi-pearl-ink);border-color:transparent}
.tgs-mi-rec{display:inline-flex;align-items:center;gap:8px;font-variant-numeric:tabular-nums;color:var(--muted)}
.tgs-mi-dot{width:8px;height:8px;border-radius:50%;background:var(--mi-err)}
.tgs-mi-understood{margin:0;padding:12px 12px;list-style:none;display:flex;flex-direction:column;gap:4px;border-radius:12px;background:var(--pane)}
.tgs-mi-understood .h{font-weight:600;color:var(--text)}
.tgs-mi-understood .y::before{content:"✓ ";color:#5FBF86;font-weight:700}
.tgs-mi-understood .n{color:var(--mi-warn)}
.tgs-mi-understood .n::before{content:"– ";font-weight:700}
.tgs-mi-suggest{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;color:var(--muted)}
.tgs-mi-status{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0;color:var(--muted)}
.tgs-mi-status.warn{color:var(--mi-warn)}
.tgs-mi-bar{position:relative;flex:1 1 auto;min-width:80px;height:4px;border-radius:4px;background:var(--pane2);overflow:hidden}
.tgs-mi-bar>span{position:absolute;inset:0 auto 0 0;background:var(--mi-hi);border-radius:4px;transition:width .2s ease}
.tgs-mi-banner{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0;padding:12px 12px;border-radius:12px}
.tgs-mi-banner.w{background:rgba(255,159,67,.10);color:var(--mi-warn)}
.tgs-mi-banner.i{background:var(--pane);color:var(--muted)}
.tgs-mi-banner.e{background:rgba(255,107,158,.10);color:var(--mi-err)}
.tgs-mi-banner b{color:var(--text);font-weight:600}
.tgs-mi-notes{display:flex;flex-direction:column;gap:4px;width:100%;margin:0;padding-left:16px}
.tgs-mi-tprev{display:flex;align-items:center;min-height:52px;padding:8px 16px;border-radius:10px;background:var(--pane);overflow:hidden}
.tgs-mi-tprev b{display:inline-block;white-space:nowrap}
.tgs-mi-link{min-height:32px;padding:0;border:0;background:none;color:var(--mi-hi-tx);font-weight:600}
.tgs-mi-sep{height:1px;background:var(--line);margin:0 -14px}
.tgs-mi-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tgs-mi-ibtn{flex:none;width:40px;height:40px;display:grid;place-items:center;border:1px solid transparent;border-radius:50%;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;box-shadow:var(--mi-lac-sh);color:var(--mi-ink-2)}
.tgs-mi-runend{display:flex;align-items:center;gap:12px;margin-left:auto}
.tgs-mi-price{color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.tgs-mi-run,.tgs-mi-pearl{display:inline-grid;place-items:center;border:0;background:var(--mi-pearl);box-shadow:var(--mi-pearl-sh);color:var(--mi-pearl-ink);font-weight:600}
.tgs-mi-run{flex:none;width:44px;height:44px;border-radius:50%}
.tgs-mi-pearl{min-height:44px;padding:0 16px;border-radius:999px}
.tgs-mi-run:disabled,.tgs-mi-pearl:disabled{background:var(--card2);box-shadow:none;border:1px solid var(--gb-line);color:var(--faint)}
.tgs-mi-anchor{position:relative;display:inline-flex}
.tgs-mi-h4{margin:0;font-weight:700;color:var(--mi-ink)}
.tgs-mi-optrow{display:flex;flex-wrap:wrap;gap:8px}
.tgs-mi-optrow .tgs-mi-lac{font-variant-numeric:tabular-nums}
.tgs-mi-optrow.cols4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.tgs-mi-optrow.cols4 .tgs-mi-lac{padding:0 8px;gap:8px}
.tgs-mi-lac .r{display:inline-block;border:1.5px solid currentColor;border-radius:2px;opacity:.7}
.tgs-mi-own{display:flex;flex-wrap:wrap;align-items:center;gap:8px;color:var(--muted)}
.tgs-mi-own input{width:96px;min-height:44px;padding:0 12px;border:1px solid var(--mi-track-edge);border-radius:12px;background:var(--mi-track);color:var(--text);font:inherit;font-variant-numeric:tabular-nums}
.tgs-mi-own input[aria-invalid="true"]{border-color:var(--mi-err)}
.tgs-mi-err{color:var(--mi-err)}
.tgs-mi-note{margin:0;color:var(--muted)}
.tgs-mi-sw{display:flex;align-items:center;gap:12px;min-height:44px}
/* Плитка-превью эффекта (founder 17.10, Ш2; ui/FxPreview.tsx): мини-кадр 9:16 с силуэтом и анимацией эффекта. */
.tgs-mi-fxrow{display:flex;align-items:center;gap:12px}
.tgs-mi-fxrow .tgs-mi-sw{flex:1;min-width:0}
.tgs-mi-fx{position:relative;flex:none;width:48px;height:64px;border-radius:12px;overflow:hidden;background:linear-gradient(180deg,#2B2C31,#141517);box-shadow:inset 0 0 0 1px var(--mi-plate-edge);opacity:.55;transition:opacity .2s}
.tgs-mi-fx.on{opacity:1}
.tgs-mi-fx-scene{position:absolute;inset:0;transform-origin:50% 40%}
.tgs-mi-fx-scene .head{position:absolute;left:50%;top:22%;width:16px;height:18px;margin-left:-8px;border-radius:50%;background:#8E8A86}
.tgs-mi-fx-scene .body{position:absolute;left:50%;top:50%;width:36px;height:40px;margin-left:-18px;border-radius:16px 16px 4px 4px;background:#4A5A7A}
.tgs-mi-fx b{position:absolute;font-weight:800;color:var(--mi-ink)}
.tgs-mi-fx-hook{left:4px;right:4px;top:6px;font-family:'Manrope',system-ui,sans-serif;font-size:var(--fs-micro);letter-spacing:.04em;text-align:center;line-height:1;z-index:0}
.fx-hook .tgs-mi-fx-scene{z-index:1}
.tgs-mi-fx-plate{left:5px;right:5px;bottom:8px;height:9px;border-radius:3px;background:var(--mi-ink)}
.tgs-mi-fx-emoji{right:3px;top:4px;font-size:var(--fs-body);line-height:1}
.tgs-mi-fx-wave{left:0;right:0;bottom:6px;display:flex;justify-content:center;align-items:flex-end;gap:2px;height:14px}
.tgs-mi-fx-wave i{width:3px;height:100%;border-radius:2px;background:var(--mi-ink);transform-origin:bottom}
.tgs-mi-fx-cover{left:3px;right:3px;top:40%;padding:3px 0;border-radius:4px;background:rgba(0,0,0,.55);font-family:'Manrope',system-ui,sans-serif;font-size:var(--fs-micro);letter-spacing:-.02em;text-align:center}
.tgs-mi-fx-card{left:6px;right:6px;top:8px;height:28px;border-radius:6px;display:grid;place-items:center;color:var(--mi-pearl-ink);font-size:var(--fs-meta)}
.tgs-mi-fx-card.own{background:linear-gradient(135deg,#C9D6DC,#7D8F99)}
.tgs-mi-fx-card.ai{background:var(--mi-pearl)}
@media (prefers-reduced-motion:no-preference){
  .tgs-mi-fx.on.fx-camera .tgs-mi-fx-scene{animation:mi-fx-push 2.4s var(--mi-ease) infinite alternate}
  .tgs-mi-fx.on.fx-introZoom .tgs-mi-fx-scene{animation:mi-fx-intro 2.4s var(--mi-ease) infinite}
  .tgs-mi-fx.on.fx-hook .tgs-mi-fx-hook{animation:mi-fx-in 2.4s var(--mi-ease) infinite}
  .tgs-mi-fx.on.fx-plates .tgs-mi-fx-plate{animation:mi-fx-slide 2.4s var(--mi-ease) infinite}
  .tgs-mi-fx.on.fx-emoji .tgs-mi-fx-emoji{animation:mi-fx-pop 2.4s var(--mi-ease) infinite}
  .tgs-mi-fx.on.fx-sfx .tgs-mi-fx-wave i{animation:mi-fx-bar .9s ease-in-out infinite alternate}
  .tgs-mi-fx.on.fx-sfx .tgs-mi-fx-wave i:nth-child(2){animation-delay:-.3s}
  .tgs-mi-fx.on.fx-sfx .tgs-mi-fx-wave i:nth-child(3){animation-delay:-.6s}
  .tgs-mi-fx.on.fx-sfx .tgs-mi-fx-wave i:nth-child(4){animation-delay:-.15s}
  .tgs-mi-fx.on.fx-cover .tgs-mi-fx-cover{animation:mi-fx-in 2.4s var(--mi-ease) infinite}
  .tgs-mi-fx.on.fx-own .tgs-mi-fx-card,.tgs-mi-fx.on.fx-inserts .tgs-mi-fx-card{animation:mi-fx-card 2.4s var(--mi-ease) infinite}
}
@keyframes mi-fx-push{from{transform:scale(1)}to{transform:scale(1.22)}}
@keyframes mi-fx-intro{0%{transform:scale(1.35)}45%,100%{transform:scale(1)}}
@keyframes mi-fx-in{0%,10%{opacity:0;transform:translateY(-6px)}30%,85%{opacity:1;transform:none}100%{opacity:0}}
@keyframes mi-fx-slide{0%,10%{transform:translateX(-110%)}35%,85%{transform:none}100%{transform:translateX(-110%)}}
@keyframes mi-fx-pop{0%,15%{opacity:0;transform:scale(.3)}35%{opacity:1;transform:scale(1.2)}45%,85%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1)}}
@keyframes mi-fx-bar{from{transform:scaleY(.25)}to{transform:scaleY(1)}}
@keyframes mi-fx-card{0%,15%{opacity:0;transform:translateY(10px) scale(.9)}35%,80%{opacity:1;transform:none}100%{opacity:0}}

.tgs-mi-sw .t{flex:1;display:flex;flex-direction:column}
.tgs-mi-sw .t span{color:var(--muted)}
.tgs-mi-tog{position:relative;width:44px;height:26px;flex:none;border:0;border-radius:999px;background:var(--card2);box-shadow:inset 0 0 0 1px var(--gb-line)}
.tgs-mi-tog::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:var(--muted);transition:transform .18s}
/* Зона нажатия 44 по высоте при виде 26 (минимум 28, стандарт 01.10) */
.tgs-mi-tog::before{content:"";position:absolute;inset:-9px 0}
.tgs-mi-tog[aria-checked="true"]{background:var(--mi-hi);box-shadow:none}
.tgs-mi-tog[aria-checked="true"]::after{transform:translateX(18px);background:var(--mi-pearl-ink)}
.tgs-mi-credits{color:var(--text);font-weight:600}
/* Галерея стилей (ЕФ5, макет ред. 3 `.gal`, `.sc`) */
.tgs-mi-gal{display:flex;flex-direction:column;gap:12px;margin-top:32px}
.tgs-mi-galh{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px}
.tgs-mi-galt{margin:0;font-family:'Manrope',system-ui,sans-serif;font-weight:700}
.tgs-mi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:16px 12px}
.tgs-mi-grid.phone{grid-template-columns:1fr 1fr;gap:16px 12px}
.tgs-mi-grid>.tgs-mi-status,.tgs-mi-empty{grid-column:1/-1}
.tgs-mi-empty{margin:0;padding:32px 16px;border-radius:14px;border:1px dashed var(--gb-line);text-align:center;color:var(--muted)}
.tgs-mi-more{grid-column:1/-1;min-height:24px;display:grid;place-items:center}
.tgs-mi-sc{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0}
.tgs-mi-pvw{position:relative}
.tgs-mi-scpick{display:block;width:100%;padding:0;border:0;background:none;text-align:left;border-radius:14px}
.tgs-mi-pv{position:relative;display:block;aspect-ratio:9/16;border-radius:14px;overflow:hidden;background:var(--card2);box-shadow:0 0 0 1px var(--gb-line);transition:box-shadow .18s}
.tgs-mi-pvimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgs-mi-sc.on .tgs-mi-pv{outline:2px solid var(--mi-hi);box-shadow:var(--sel-glow)}
.tgs-mi-star{position:absolute;left:6px;top:6px;z-index:2;width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(0,0,0,.42);color:#fff}
.tgs-mi-star.on{color:var(--mi-hi)}
.tgs-mi-star.on svg{fill:currentColor}
.tgs-mi-scmeta{display:flex;flex-direction:column;gap:1px;min-width:0}
.tgs-mi-scmeta b{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-scmeta span{color:var(--muted)}
.tgs-mi-scmeta em{font-style:normal;color:var(--mi-hi-tx)}
.tgs-mi-tune{position:absolute;right:6px;top:6px;z-index:3;width:32px;height:32px;display:grid;place-items:center;padding:0;border:1px solid rgba(255,255,255,.28);border-radius:50%;background:rgba(12,12,13,.62);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;cursor:pointer;transition:background .15s}
.tgs-mi-tune:hover{background:rgba(12,12,13,.82)}
.tgs-mi-sc.on .tgs-mi-more-wrap{right:44px}
.tgs-mi-pv.add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:var(--mi-track);box-shadow:none;border:1.5px dashed rgba(255,255,255,.16);color:var(--text);text-align:center;padding:12px}
.tgs-mi-pv.add .big{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:var(--mi-hi);color:var(--mi-pearl-ink)}
.tgs-mi-pv.add b{font-weight:600}
.tgs-mi-pv.add span:not(.big){color:var(--muted)}
.tgs-mi-back{margin-left:0!important;transform:rotate(90deg)}
.tgs-mi-field{display:flex;flex-direction:column;gap:8px}
.tgs-mi-phrase{margin:0;padding:16px 16px;border-radius:var(--mi-r-in);background:var(--mi-track);border:1px solid var(--mi-track-edge);line-height:1.5}
.tgs-mi-inline-f{padding:12px 0 0;justify-content:space-between}
.tgs-mi-handle{display:none;width:40px;height:4px;margin:8px auto 0;border-radius:4px;background:var(--gb-lh)}
.tgs-mi-tabs{display:flex;gap:16px;padding:0 16px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.tgs-mi-tabs button{position:relative;min-height:44px;padding:0;border:0;background:none;color:var(--muted);font-weight:500;white-space:nowrap}
.tgs-mi-tabs button[aria-selected="true"]{color:var(--text)}
.tgs-mi-tabs button[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;border-radius:2px;background:var(--mi-hi)}
.tgs-mi-quota{display:flex;align-items:center;gap:12px;flex:1 1 220px;color:var(--muted)}
.tgs-mi-check{display:flex;align-items:center;gap:8px;min-height:44px;cursor:pointer}
.tgs-mi-check input{appearance:none;-webkit-appearance:none;flex:none;width:20px;height:20px;margin:0;display:grid;place-items:center;border-radius:6px;background:var(--card2);box-shadow:inset 0 0 0 1px var(--gb-lh);cursor:pointer}
.tgs-mi-check input::after{content:"";width:10px;height:6px;margin-top:-2px;border:2px solid var(--mi-pearl-ink);border-top:0;border-right:0;transform:rotate(-45deg);opacity:0}
.tgs-mi-check input:checked{background:var(--mi-hi);box-shadow:none}
.tgs-mi-check input:checked::after{opacity:1}
.tgs-mi-count{align-self:flex-end;color:var(--faint)}
.tgs-mi-lib{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}
.tgs-mi-libitem{display:flex;flex-direction:column;gap:2px;min-width:0}
.tgs-mi-libpick{position:relative;display:flex;flex-direction:column;gap:4px;padding:0;border:0;background:none;text-align:left;min-width:0}
.tgs-mi-libpick img,.tgs-mi-libpick .tgs-mi-thumb-ic{position:relative;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;background:var(--card2);box-shadow:0 0 0 1px var(--gb-line)}
.tgs-mi-libpick[aria-pressed="true"] img{outline:2px solid var(--mi-hi)}
.tgs-mi-libname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgs-mi-libmeta{color:var(--faint)}
.tgs-mi-libcheck{position:absolute;top:6px;right:6px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:var(--mi-hi);color:var(--mi-pearl-ink)}
.tgs-mi-libitem .tgs-mi-link{align-self:flex-start;color:var(--muted);font-weight:500}
/* Конструктор одним экраном (спека UX §3.2, план Ф7): на весь экран — пластина 440 px слева (вкладки, «словами»,
   «Как в этом ролике», низ с одной жемчужной), справа превью на тёмном фоне. */
.tgs-mi-ctor-body{display:flex;flex-direction:column;gap:16px}
.tgs-mi-style-tabs{display:contents}
.tgs-mi-ctor{position:fixed;inset:0;z-index:45;overflow:auto;padding:12px 16px 0;background:var(--mi-bg,#0B0B0D);color:var(--mi-ink);outline:0}
.tgs-mi-ctor-stage{display:flex;justify-content:center;height:100%;min-height:0}
.tgs-mi-ctor-stage .tgs-mi-preview-frame{background:#0E0E10}
.tgs-mi[data-layout="wide"] .tgs-mi-ctor .tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-preview-frame{height:min(calc(100dvh - 120px),720px)}
.tgs-mi-preview-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgs-mi-tab{display:flex;flex-direction:column;gap:16px}
.tgs-mi-tile,.tgs-mi-grade{border-radius:var(--mi-r-in)}
.tgs-mi-tile{flex-direction:column;gap:8px;padding:12px 4px}
.tgs-mi-tile-aa{font-size:var(--fs-num);font-weight:700;line-height:1}
.tgs-mi-tile-aa.box{padding:2px 8px;border-radius:6px;background:var(--mi-ink);color:var(--mi-pearl-ink)}
.tgs-mi-tile-aa.color{color:var(--mi-ink);text-decoration:underline 3px var(--mi-ink-2)}
.tgs-mi-tile-aa.outline{color:transparent;-webkit-text-stroke:1.2px var(--mi-ink)}
.tgs-mi-grades{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.tgs-mi-grade{flex-direction:column;gap:8px;padding:8px}
.tgs-mi-grade img,.tgs-mi-grade i{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:10px;background:linear-gradient(160deg,#5a4b3c,#1f2a33)}
.tgs-mi-words,.tgs-mi-example{display:flex;flex-direction:column;gap:8px}
.tgs-mi-wordsbox{display:flex;align-items:center;gap:8px;padding:0 8px 0 12px;border-radius:var(--mi-r-in);background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-track-edge)}
.tgs-mi-wordsbox input{flex:1;min-width:0;min-height:44px;border:0;background:none;color:var(--mi-ink);outline:0}
.tgs-mi-wordsbox input::placeholder{color:var(--mi-ink-3)}
.tgs-mi-wordsans{display:flex;flex-direction:column;gap:8px;color:var(--mi-ink-2)}
.tgs-mi-example-l{color:var(--mi-ink-3)}
.tgs-mi-example-row{display:flex;gap:8px;flex-wrap:wrap}
.tgs-mi-filelac{position:relative;cursor:pointer}
.tgs-mi-filelac input{position:absolute;inset:0;opacity:0;cursor:pointer}
.tgs-mi-forks{display:flex;flex-direction:column;gap:12px}
.tgs-mi-fork{display:flex;flex-direction:column;gap:4px;padding:16px 16px;border:1px solid var(--gb-line);border-radius:16px;background:var(--mi-glass),var(--card);text-align:left}
.tgs-mi-fork span{color:var(--muted)}
.tgs-mi-fork:hover{border-color:var(--gb-lh)}
.tgs-mi-live{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:start}
.tgs-mi-livepv{position:relative;display:block;aspect-ratio:9/16;border-radius:12px;overflow:hidden;background:var(--card2);box-shadow:0 0 0 1px var(--gb-line)}
.tgs-mi-livepv .tgs-mi-pvimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgs-mi-about{display:flex;flex-direction:column;gap:4px;min-width:0}
/* Поля браузера по умолчанию (у p ≈ 1em) складывались с gap контейнера: между строками выходило 40 вместо 16.
   Отступы «Монтажа» — только gap и явные значения по шкале; :where — нулевая специфичность, явные отступы сильнее. */
.tgs-mi :where(p,h1,h2,h3,h4,figure,ul,ol){margin:0}
.tgs-mi-muted{color:var(--muted)}
.tgs-mi-lock{margin:8px 0 0;padding:8px 12px;border-radius:10px;background:var(--pane);color:var(--muted)}
.tgs-mi-lock b{color:var(--text);font-weight:600}
.tgs-mi-chatrow{display:flex;align-items:center;gap:12px;width:100%;min-height:48px;padding:0 16px;border:1px solid var(--gb-line);border-radius:999px;background:var(--bg);color:var(--faint);text-align:left}
/* «Описать» (ЕФ7, макет ред. 3 `.chat`) */
.tgs-mi-chat{display:flex;flex-direction:column;gap:12px}
.tgs-mi-msgs{display:flex;flex-direction:column;gap:12px}
.tgs-mi-msg{max-width:88%;padding:12px 12px;border-radius:16px;line-height:1.45}
.tgs-mi-msg.me{align-self:flex-end;background:var(--pane2);border-bottom-right-radius:6px}
.tgs-mi-msg.ai{align-self:flex-start;background:var(--bg);border:1px solid var(--line);border-bottom-left-radius:6px}
.tgs-mi-msg.ai ul{margin:8px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:4px}
.tgs-mi-msg.ai li::before{content:"✓ ";color:var(--ok);font-weight:700}
.tgs-mi-msg.ai.cant{border-color:rgba(255,159,67,.35)}
.tgs-mi-cant{margin:8px 0 0}
.tgs-mi-offer{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.tgs-mi-offeracts{display:flex;flex-wrap:wrap;gap:8px}
.tgs-mi-chatbox{display:flex;align-items:flex-end;gap:8px;padding:8px 8px 8px 16px;border:1px solid var(--gb-line);border-radius:22px;background:var(--bg)}
.tgs-mi-chatbox textarea{flex:1;min-width:0;min-height:40px;max-height:120px;padding:8px 0;border:0;background:transparent;color:var(--text);font:inherit;resize:none;outline:none}
.tgs-mi-chatbox .tgs-mi-run{width:44px;height:44px;border-radius:50%}
.tgs-mi-chatbox .tgs-mi-run:disabled{opacity:.45}
.tgs-mi-kdetails summary{cursor:pointer;color:var(--muted);min-height:32px}
/* «По примеру» (ЕФ8, макет ред. 3 `.mini-seg`, `.found`) */
.tgs-mi-drop{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:32px 16px;border:1px dashed var(--gb-line);border-radius:16px;color:var(--muted);text-align:center;cursor:pointer}
.tgs-mi-drop input{position:absolute;inset:0;opacity:0;cursor:pointer}
.tgs-mi-myjobs{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:12px}
.tgs-mi-myjob{display:flex;flex-direction:column;gap:8px;padding:0;border:0;background:none;color:var(--muted);text-align:left}
.tgs-mi-myjob img,.tgs-mi-myjob .tgs-mi-thumb-ic{position:relative;display:grid;width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:10px;background:var(--card2);box-shadow:0 0 0 1px var(--gb-line)}
.tgs-mi-myjob:hover img,.tgs-mi-myjob:hover .tgs-mi-thumb-ic{outline:2px solid var(--mi-hi)}
.tgs-mi-refrun{display:flex;flex-direction:column;gap:8px}
.tgs-mi-refrun .tgs-mi-bar{flex:none}
.tgs-mi-banner.tgs-mi-own{flex-direction:column;align-items:flex-start;gap:12px}
.tgs-mi-found{display:flex;flex-direction:column;gap:8px}
.tgs-mi-found p{margin:0;color:var(--muted)}
.tgs-mi-axes{margin:0 0 4px;padding:0;list-style:none;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.tgs-mi-axes li{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 12px;border-top:1px solid var(--line)}
.tgs-mi-axes li:first-child{border-top:0}
.tgs-mi-axes .s{color:var(--ok)}
.tgs-mi-axes .replaced .s,.tgs-mi-axes .curve .s{color:var(--mi-warn)}
.tgs-mi-axes .pending .s{color:var(--faint)}
.tgs-mi-els{margin:0 0 4px;padding:0;list-style:none;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.tgs-mi-els li{display:grid;grid-template-columns:40px minmax(0,1fr) auto;align-items:center;gap:12px;padding:8px 12px;border-top:1px solid var(--line)}
.tgs-mi-els li:first-child{border-top:0}
.tgs-mi-els img,.tgs-mi-el-ph{width:40px;height:56px;border-radius:8px;object-fit:cover;background:var(--line)}
.tgs-mi-els .k{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgs-mi-els .s{color:var(--ok);white-space:nowrap}
.tgs-mi-els .generate .s{color:var(--mi-ink)}
.tgs-mi-els .replaced .s{color:var(--mi-warn)}
.tgs-mi-refsteps{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 16px}
.tgs-mi-refsteps li{display:flex;align-items:center;gap:8px;color:var(--muted)}
.tgs-mi-refsteps li::before{content:'';flex:none;width:8px;height:8px;border-radius:50%;background:var(--line)}
.tgs-mi-refsteps li[data-state="done"]{color:var(--mi-ink)}
.tgs-mi-refsteps li[data-state="done"]::before{background:var(--ok)}
.tgs-mi-refsteps li[data-state="run"]{color:var(--mi-ink)}
.tgs-mi-refsteps li[data-state="run"]::before{background:var(--mi-ink);box-shadow:0 0 0 4px rgba(255,255,255,.14)}
/* Свои стили (ЕФ9): ⋯, меню, недоступные карточки */
.tgs-mi-more-wrap{position:absolute;top:6px;right:6px;z-index:3}
.tgs-mi-scmore{width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:50%;background:rgba(12,12,13,.62);color:#fff;font-size:var(--fs-num);line-height:1}
.tgs-mi-sc.off .tgs-mi-pv{opacity:.45}
.tgs-mi-sc.off .tgs-mi-scpick{cursor:not-allowed}
.tgs-mi-kdetails[open] summary{margin-bottom:12px}
.tgs-mi-knobs{display:flex;flex-direction:column;gap:16px}
.tgs-mi-kgrp{display:flex;flex-direction:column;gap:12px;padding-top:16px;border-top:1px solid var(--line)}
.tgs-mi-kgrp .gh{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px}
.tgs-mi-kgrp h4{margin:0;font-weight:700;white-space:nowrap}
.tgs-mi-kgrp .gh span{color:var(--faint)}
.tgs-mi-kfield{display:flex;flex-direction:column;gap:8px}
.tgs-mi-kfield .l{color:var(--muted)}
.tgs-mi-fontcur{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border-radius:10px;background:var(--pane)}
.tgs-mi-range{display:flex;align-items:center;gap:12px}
.tgs-mi-range input{flex:1;accent-color:var(--mi-hi)}
.tgs-mi-range span{min-width:52px;text-align:right;font-variant-numeric:tabular-nums}
.tgs-mi-role{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:10px;background:var(--pane);color:var(--muted)}
.tgs-mi-role[aria-pressed="true"]{border-color:var(--mi-hi);color:var(--text)}
.tgs-mi-role i{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.tgs-mi-swatches{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tgs-mi-swatch{width:32px;height:32px;border:0;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.25)}
.tgs-mi-swatch[aria-pressed="true"]{outline:2px solid var(--mi-hi);outline-offset:2px}
.tgs-mi-owncolor{display:inline-flex;align-items:center;gap:8px;min-height:36px;color:var(--muted);cursor:pointer}
.tgs-mi-owncolor input{width:32px;height:32px;padding:0;border:0;border-radius:50%;background:none}
.tgs-mi-looks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.tgs-mi-look{display:flex;flex-direction:column;gap:4px;padding:0;border:0;background:none;color:var(--muted);text-align:left}
.tgs-mi-look i{display:block;aspect-ratio:16/10;border-radius:8px;box-shadow:0 0 0 1px var(--gb-line)}
.tgs-mi-look[aria-pressed="true"]{color:var(--text)}
.tgs-mi-look[aria-pressed="true"] i{outline:2px solid var(--mi-hi)}
.tgs-mi-fx{display:flex;flex-wrap:wrap;gap:8px}
.tgs-mi-fxc{display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 4px 0 12px;border:1px solid var(--line);border-radius:999px}
.tgs-mi-fxc .tgs-mi-ibtn{width:28px;height:28px;border:0;background:none}
.tgs-mi-fontpick{display:flex;flex-direction:column;gap:12px;padding:12px;border-radius:var(--mi-r-in);background:var(--mi-track);border:1px solid var(--mi-track-edge)}
.tgs-mi-inp{width:100%;min-height:44px;padding:0 16px;border:1px solid var(--mi-track-edge);border-radius:12px;background:var(--mi-plate-solid);color:var(--mi-ink);font-family:inherit}
textarea.tgs-mi-inp{padding:12px 16px;line-height:1.45;resize:vertical}
.tgs-mi-inp::placeholder{color:var(--mi-ink-3)}
.tgs-mi-fonts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:300px;overflow-y:auto;overscroll-behavior:contain}
.tgs-mi-fonttile{display:grid;place-items:center;min-height:52px;padding:0 4px;border:1px solid transparent;border-radius:12px;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;color:var(--mi-ink);overflow:hidden}
.tgs-mi-fonttile:hover{background:var(--mi-lac-hover) padding-box,var(--mi-lac-edge-hover) border-box}
.tgs-mi-fonttile[aria-pressed="true"]{background:var(--mi-lac-on) padding-box,linear-gradient(var(--mi-ink),var(--mi-ink)) border-box;box-shadow:0 0 0 1px var(--mi-ink)}
.tgs-mi-fonttile .fs-ui{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.tgs-mi-fontimg{display:block;width:min(120px,100%);aspect-ratio:120/32;background:url(/montage/fonts-preview.webp) 0 0/100% auto no-repeat}
.tgs-mi-fontown{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px}
.tgs-mi-pearl:disabled{opacity:.45;cursor:not-allowed}
.tgs-mi-counter{align-self:flex-end;color:var(--faint);font-variant-numeric:tabular-nums}
.tgs-mi-pearl.wide{display:inline-flex;align-items:center;gap:8px}
.tgs-mi-confirmrow{display:flex;align-items:center;gap:12px}
@container (max-width:700px){
  .tgs-mi-wrap{padding:12px 16px 120px}
  .tgs-mi-composer{padding:12px;border-radius:20px}
  .tgs-mi-sep{margin:0 -12px}
  .tgs-mi-runend{width:100%;justify-content:space-between;margin-left:0}
  .tgs-mi-runend .tgs-mi-run{margin-left:auto}
  .tgs-mi-runend:not(:has(.tgs-mi-price:not(:empty))){width:auto;margin-left:auto}
}
  .tgs-mi[data-layout="phone"] .tgs-mi-looks{grid-template-columns:repeat(4,minmax(0,1fr))}
  .tgs-mi[data-layout="phone"] .tgs-mi-handle{display:block}
  .tgs-mi[data-layout="phone"] .tgs-mi-tabs{padding-inline:16px}
  .tgs-mi[data-layout="phone"] .tgs-mi-lib{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (prefers-reduced-motion:reduce){.tgs-mi .flash{animation:none;outline:2px solid var(--mi-hi)}.tgs-mi-spin{animation-duration:2s}.tgs-mi-tog::after{transition:none}.tgs-mi-pv{transition:none}}
/* Один экран задачи (спека §3): «панель · центр · низ». Узел центра [data-stage-preview] живёт в состояниях 3–5;
   «Монтируем» — кадр и шаги, «Ролик готов» — ролик по центру и кнопки под ним (§5.1), редактор — панель слева,
   превью по центру, таймлайн внизу. */
/* Каркас экрана задачи (Р26 §4.1): узлы всегда в одном порядке, колонки — по [data-layout] и состоянию. */
.tgs-mi-stage{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "rail" "center" "info" "side" "bottom";gap:16px;color:var(--mi-ink)}
.tgs-mi-stage-top{grid-area:top;min-width:0}
.tgs-mi-stage-rail{grid-area:rail;min-width:0}
.tgs-mi-stage-center{grid-area:center;min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.tgs-mi-stage-info{grid-area:info;min-width:0}
.tgs-mi-stage-side{grid-area:side;min-width:0}
.tgs-mi-stage-bottom{grid-area:bottom;display:flex;flex-direction:column;gap:16px;min-width:0}
.tgs-mi-stage>:empty{display:none}
.tgs-mi[data-layout="tablet"] .tgs-mi-stage:not(.edit){width:100%;max-width:560px;margin-inline:auto}
/* Телефон и планшет (правка founder'а «отступы ровные», задача 42): промежуток сетки шёл и вокруг пустых зон каркаса
   (rail, info, side) — между блоками выходило 32 и 48. Отступ 16 — только между непустыми зонами (порядок в DOM = порядок
   в сетке). */
.tgs-mi[data-layout="phone"] .tgs-mi-stage:not(.edit),.tgs-mi[data-layout="tablet"] .tgs-mi-stage:not(.edit){row-gap:0}
.tgs-mi[data-layout="phone"] .tgs-mi-stage:not(.edit)>:not(:empty)~:not(:empty),.tgs-mi[data-layout="tablet"] .tgs-mi-stage:not(.edit)>:not(:empty)~:not(:empty){margin-top:16px}
.tgs-mi[data-layout="wide"] .tgs-mi-stage:not(.edit){grid-template-columns:minmax(0,1fr) 400px;grid-template-areas:"top top" "center info" "center bottom" "center side";grid-template-rows:auto auto 1fr auto;align-items:start}
.tgs-mi[data-layout="wide"] .tgs-mi-stage.edit{grid-template-columns:auto minmax(0,1fr) 360px;grid-template-areas:"top top top" "rail center side" "bottom bottom bottom";align-items:start;transition:grid-template-columns 240ms cubic-bezier(.2,.8,.2,1)}
.tgs-mi[data-layout="wide"] .tgs-mi-stage.edit[data-side="closed"]{grid-template-columns:auto minmax(0,1fr) 0}
.tgs-mi[data-layout="wide"] .tgs-mi-stage[data-side="closed"] .tgs-mi-stage-side{overflow:hidden;visibility:hidden}
.tgs-mi-stage.ready .tgs-mi-player,.tgs-mi-stage.failed .tgs-mi-player{width:min(300px,100%)}
/* «Ролик готов» (founder 20.10: «полупустой экран»): ролик по высоте окна, ширина — из формата (--mi-ar от плеера).
   Компьютер: окно минус шапка и «‹» (160). iPad стоя: под роликом заголовок, ряд, подпись поста и «Экспорт» (480). */
.tgs-mi[data-layout="wide"] .tgs-mi-stage.ready .tgs-mi-stage-center>.tgs-mi-player{width:min(100%,calc((100dvh - 160px) * var(--mi-ar)))}
.tgs-mi[data-layout="tablet"] .tgs-mi-stage.ready .tgs-mi-stage-center>.tgs-mi-player{width:min(100%,calc((100dvh - 480px) * var(--mi-ar)))}
.tgs-mi-stage.ready .tgs-mi-stage-bottom,.tgs-mi-stage.failed .tgs-mi-stage-bottom{display:flex;justify-content:center}
.tgs-mi-stage.ready .tgs-mi-pstate,.tgs-mi-stage.failed .tgs-mi-pstate{align-items:center;text-align:center}
.tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-preview-frame{height:min(calc(100dvh - 520px),560px);min-height:300px}
@container (max-width:700px){.tgs-mi-player{width:min(260px,100%);margin:0 auto}}
/* «Ролик готов» (спека §5.1): ролик по центру, своя полоса плеера; кнопки, подпись и оценка — под ним. */
.tgs-mi-vp{display:flex;flex-direction:column}
.tgs-mi-vp video{flex:1;min-height:0;cursor:pointer}
.tgs-mi-vp-bar{position:absolute;left:0;right:0;bottom:0;container:vp/inline-size;display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:8px 12px;background:linear-gradient(to top,rgba(0,0,0,.55),transparent);color:#fff}
.tgs-mi-vp-seek{flex:1;min-width:0;accent-color:#fff}
.tgs-mi-vp-time{font-variant-numeric:tabular-nums;white-space:nowrap}
/* Узкий плеер (редактор, телефон): ползунок — своей строкой сверху, под ним кнопки и время; кнопки 32 px.
   Контейнер — полоса кнопок: её ширину задают края плеера; сам плеер на «Ролик готов» берёт размер от видео */
@container vp (max-width:340px){.tgs-mi-vp-seek{order:-1;flex:1 1 100%}.tgs-mi-vp-bar .tgs-mi-ibtn{width:32px;height:32px}.tgs-mi-vp-time{margin-right:auto}}
.tgs-mi-ready{display:flex;flex-direction:column;align-items:center;gap:12px;width:min(520px,100%)}
.tgs-mi-ready h2{margin:0;font-family:'Manrope',system-ui,sans-serif;font-weight:800}
.tgs-mi-ready p{margin:0}
.tgs-mi-rating{display:inline-flex;gap:4px}
.tgs-mi-rate{font-size:var(--fs-lead);opacity:.6}
.tgs-mi-rate[aria-pressed=true]{opacity:1;background:var(--card2)}
/* Подпись поста — текст для копирования: читается слева, как и её кнопки (центр экрана «Ролик готов» не наследует). */
/* Подпись к посту — стекло строки агента (founder 20.10: серая плашка смотрелась дёшево): фон, размытие, тень и
   кромку даёт общий класс .vsheet (design.css) — здесь только раскладка и скругление 24 (прямоугольник, не капсула). */
.tgs-mi-post{display:flex;flex-direction:column;align-items:stretch;gap:8px;width:100%;padding:16px;border-radius:24px;text-align:left}
.tgs-mi-post>.tgs-mi-link{align-self:flex-start}
.tgs-mi-post-head{display:flex;flex-direction:column;gap:4px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.tgs-mi-post-h{margin:0;font-weight:700;color:var(--mi-ink)}
.tgs-mi-post-note{margin:0;color:var(--muted)}
.tgs-mi-post-body{white-space:pre-line;margin:0}
.tgs-mi-post-tags{margin:0;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgs-mi-post-btns{display:flex;gap:8px;flex-wrap:wrap}
.tgs-mi-post-skel{display:block;height:12px;border-radius:6px;background:var(--line);animation:tgs-mi-skel 1.2s ease-in-out infinite alternate}
.tgs-mi-post-skel:nth-of-type(2){width:86%}.tgs-mi-post-skel:nth-of-type(3){width:60%}
@keyframes tgs-mi-skel{from{opacity:.45}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.tgs-mi-post-skel{animation:none}}
.tgs-mi-ready-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%}
/* Свернуть панель (спека §3): панель уезжает за 240 мс, центр сжимается плавно; кнопка остаётся — ею и разворачивают.
   Обёртка не режет (overflow:hidden обрезал тень пластины прямоугольником — квадратные углы под ней): при сворачивании
   пластина сама сдвигается и гаснет, потом скрывается. «Меньше движения» — без анимации. */
.tgs-mi-panel-tog{flex:none;align-self:flex-start}
/* Полный экран редактора и конструктора (Р26 §4.1): панель разделов, её переключатель, плавающий ☰ и шапка «Монтажа» скрыты. */
.tg[data-focus="1"] .tg-sb,.tg[data-focus="1"] .tgs-rail-toggle,.tg[data-focus="1"] .tgs-burger-float,.tg[data-focus="1"] .tgs-mi-head{display:none}
@media (prefers-reduced-motion:reduce){.tgs-mi-stage{transition:none}}
/* Результат = конструктор + таймлайн (спека UX §3.4, план Ф11): сверху пластина и превью, внизу таймлайн 220–320 px. */
.tgs-mi-editor{display:flex;flex-direction:column;gap:16px;color:var(--mi-ink)}
.tgs-mi-editor-top{display:flex;gap:32px;align-items:flex-start}
.tgs-mi-editor-stage{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px}
/* Над панелью (§9.2): сводка ролика и «Весь ролик» / «Выбрано: …» с ✕. */
.tgs-mi-plate-h{display:flex;flex-direction:column;gap:8px}
.tgs-mi-props-sec{display:flex;flex-direction:column;gap:12px}
/* «Текст» в шапке — подпись, а не значок; нажата — как выбранная лаковая. */
.tgs-mi-ibtn.tgs-mi-ibtn-t{width:auto;padding:0 16px;border-radius:999px}
.tgs-mi-ibtn-t[aria-pressed="true"]{background:var(--mi-lac-on) padding-box,var(--mi-lac-edge) border-box;color:var(--mi-ink)}
/* «Текст речи» (§9.5): вырезанное зачёркнуто и бледное, слово под линией подчёркнуто, выделение — подложкой. */
.tgs-mi-speech{display:flex;flex-direction:column;gap:12px}
.tgs-mi-speech-bar{position:sticky;top:0;z-index:1;display:flex;gap:8px}
.tgs-mi-speech-t{display:flex;flex-direction:column;gap:12px;line-height:1.7;user-select:none;-webkit-user-select:none}
.tgs-mi-speech-t p{margin:0}
/* Кнопка очистки с числом и секундами длиннее узкого экрана — переносится, а не режется. */
.tgs-mi-speech>.tgs-mi-row .tgs-mi-lac{max-width:100%;white-space:normal;text-align:left;padding-block:8px}
/* Слово «Текста речи» — в строке абзаца (своё имя: .tgs-mi-sw — ряд-переключатель, .tgs-mi-word — поле слова). */
.tgs-mi-spw{cursor:pointer;border-radius:4px;color:var(--mi-ink)}
.tgs-mi-spw[data-cut="true"]{color:var(--mi-ink-3);text-decoration:line-through}
.tgs-mi-spw[data-trimmed]{text-decoration:underline dotted}
.tgs-mi-spw[aria-current="true"]{text-decoration:underline;text-underline-offset:4px}
.tgs-mi-spw[data-sel]{background:var(--mi-sel);box-shadow:0 0 0 1px var(--mi-track-edge)}
.tgs-mi-gap{display:inline-block;margin:0 4px;padding:0 8px;min-height:24px;border:1px solid var(--mi-track-edge);border-radius:999px;background:var(--mi-track);color:var(--mi-ink-2)}
.tgs-mi-gap[aria-pressed="true"]{color:var(--mi-ink-3);text-decoration:line-through}
/* Дубли (спека дублей §6.1): метка вида перед группой — мелко, вторичным цветом; подсказка — слова пунктиром. */
.tgs-mi-rt{position:relative;display:inline-block;margin:0 4px 0 0;padding:0 8px;min-height:24px;border:0;border-radius:4px;background:transparent;color:var(--mi-ink-2);cursor:pointer}
.tgs-mi-rt[aria-expanded="true"]{background:var(--mi-sel)}
.tgs-mi-spw[data-hint]{text-decoration:underline dashed;text-underline-offset:4px;text-decoration-color:var(--mi-ink-2)}
/* Рамки элементов в кадре (§9.7): фразы тянутся, при протяжке подсвечены все; поле правки — поверх рамки. */
.tgs-mi-preview-frame{position:relative}
.tgs-mi-box{position:absolute;border-radius:6px;cursor:text;touch-action:none}
.tgs-mi-box[data-kind="captions"]{cursor:grab}
.tgs-mi-box:hover,.tgs-mi-box[data-hl]{box-shadow:0 0 0 1px var(--mi-ink-2)}
.tgs-mi-box[data-hl]{cursor:grabbing}
.tgs-mi-inframe{position:absolute;z-index:2;padding:8px 12px;border:1px solid var(--mi-ink-2);border-radius:8px;background:var(--mi-plate-solid);color:var(--mi-ink)}
.tgs-mi-editor-stage .tgs-mi-preview-frame{height:min(calc(100dvh - 520px),560px);min-height:300px}
.tgs-mi-fs{margin:0;padding:0;border:0;min-width:0;display:flex;flex-direction:column;gap:16px}
.tgs-mi-fs:disabled{opacity:.55}
.tgs-mi-props{display:flex;flex-direction:column;gap:16px}
.tgs-mi-words-edit{display:flex;flex-wrap:wrap;gap:8px}
/* Вставки из редактора (founder 17.10, В2/В4): источники, «+» на дорожке, окна стока и эмодзи, свой трек. */
.tgs-mi-insrc{display:flex;flex-wrap:wrap;gap:8px}
.tgs-mi-lane-add{flex:none;width:28px;height:28px;margin-left:-2px;display:grid;place-items:center;border:1px solid transparent;border-radius:50%;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;color:var(--mi-ink);font-size:var(--fs-title);line-height:1}
.tgs-mi-lane-add{position:relative}
.tgs-mi-lane-add:disabled{opacity:.4}
.tgs-mi-stock,.tgs-mi-emoji{display:flex;flex-direction:column;gap:12px}
.tgs-mi-credit{color:var(--mi-ink-3);text-decoration:underline;text-underline-offset:2px}
.tgs-mi-stock-q{display:flex;gap:8px;align-items:center}
.tgs-mi-stock-q .tgs-mi-inp{flex:1}
.tgs-mi-stock-grid{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:12px 12px}
.tgs-mi-stock-grid li{display:flex;flex-direction:column;gap:4px;min-width:0}
.tgs-mi-stock-card{position:relative;display:block;width:100%;aspect-ratio:9/16;padding:0;border:0;border-radius:12px;overflow:hidden;background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-plate-edge)}
.tgs-mi-stock-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgs-mi-stock-card:hover{box-shadow:inset 0 0 0 2px var(--mi-ink-2)}
.tgs-mi-stock-d{position:absolute;right:6px;bottom:6px;padding:1px 8px;border-radius:999px;background:rgba(0,0,0,.55);color:#fff}
.tgs-mi-stock-busy{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.45)}
.tgs-mi-stock-grid .tgs-mi-stock-a,.tgs-mi-stock .tgs-mi-credit{color:var(--mi-ink-3)}
.tgs-mi-stock-a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none}
.tgs-mi-inp::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.tgs-mi-emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px}
.tgs-mi-emoji-b{aspect-ratio:1;display:grid;place-items:center;border:1px solid transparent;border-radius:14px;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;font-size:var(--fs-num);line-height:1}
.tgs-mi-emoji-b:hover{background:var(--mi-lac-hover) padding-box,var(--mi-lac-edge-hover) border-box}
.tgs-mi-hl,.tgs-mi-hl-tune,.tgs-mi-hl-pick{display:flex;flex-direction:column;gap:12px}
/* Сетка анимаций (спека заголовков CapCut §3.3): видео-лист и есть сетка 4 × 8 — кнопки плиток прозрачные поверх своих
   клеток, промежутки и скругления — маской на видео (клетка 0,92 с отступом 0,04, скругление 0,1 клетки). */
.tgs-mi-hl-pick{position:relative;gap:16px}
.tgs-mi-hl-board{position:relative;width:100%}
.tgs-mi-hl-sheet{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:fill;pointer-events:none;background:#111}
.tgs-mi-hl-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
.tgs-mi-hl-cell{position:relative;min-width:0;min-height:0}
.tgs-mi-hl-none{position:absolute;inset:0;display:grid;place-items:center;color:var(--mi-ink-2)}
.tgs-mi-hl-set{position:absolute;top:0;right:0;z-index:1;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;color:#fff;cursor:pointer}
.tgs-mi-hl-set svg{box-sizing:content-box;padding:4px;border-radius:50%;background:rgba(0,0,0,.6)}
.tgs-mi-hl-set:focus-visible{outline:2px solid var(--mi-sel);outline-offset:-2px;border-radius:50%}
.tgs-mi-hl-tile{position:absolute;inset:4%;display:block;padding:0;border:0;border-radius:11%;background:none;color:var(--mi-ink);cursor:pointer;box-shadow:inset 0 0 0 1px var(--mi-track-edge);transition:box-shadow .16s var(--mi-ease)}
.tgs-mi-hl-tile:hover{box-shadow:inset 0 0 0 1px var(--mi-lac-edge-hover)}
.tgs-mi-hl-tile[aria-pressed="true"]{box-shadow:inset 0 0 0 2px var(--mi-ink)}
.tgs-mi-hl-tile:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--mi-sel)}
.tgs-mi-hl-name{position:absolute;left:0;right:0;bottom:0;padding:12px 4px 4px;border-radius:0 0 11% 11% / 0 0 22% 22%;background:linear-gradient(transparent,rgba(0,0,0,.72));color:var(--mi-ink-2);line-height:1.2;text-align:center;overflow-wrap:anywhere;hyphens:auto}
.tgs-mi-hl-tile[aria-pressed="true"] .tgs-mi-hl-name{color:var(--mi-ink);font-weight:600}
.tgs-mi-hl>[data-hint]{color:var(--mi-warn)}
.tgs-mi-hl-hint{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.tgs-mi-hl-tile[data-limited]::after{content:'';position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:var(--mi-warn);box-shadow:0 0 0 2px #111}
.tgs-mi-hl-colors{display:grid;grid-template-columns:1fr 1fr;gap:12px}
/* Настройки анимации ⚙ (спека заголовков CapCut §3.4): на месте панели справа; на телефоне — лист снизу на половину
   высоты (видео над ним видно). ↺ — у строки, где значение не родное. */
.tgs-mi-hl-settings{display:flex;flex-direction:column}
.tgs-mi-hl-settings-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 0 8px;border-bottom:1px solid var(--mi-track-edge)}
.tgs-mi-hl-settings-b{display:flex;flex-direction:column;gap:16px;padding:12px 0 0}
.tgs-mi[data-layout="phone"] .tgs-mi-hl-settings{position:fixed;left:0;right:0;bottom:0;z-index:40;height:50vh;height:50dvh;border-radius:16px 16px 0 0;background:var(--card);box-shadow:0 -8px 24px rgba(0,0,0,.35)}
.tgs-mi[data-layout="phone"] .tgs-mi-hl-settings-h{padding:4px 4px 4px 16px}
.tgs-mi[data-layout="phone"] .tgs-mi-hl-settings-b{padding:12px 16px 24px;overflow:auto;overscroll-behavior:contain}
.tgs-mi-hl-srow{display:flex;flex-direction:column;gap:8px}
/* Шапка панели текста (§3.2): режим «Изменить» / «Анимация» и ✓ — назад к нижнему ряду. */
.tgs-mi-hl-modeh{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:-4px 0 0}
.tgs-mi-hl-shead{display:flex;align-items:center;justify-content:space-between;min-height:24px}
.tgs-mi-hl-undo{display:grid;place-items:center;width:44px;height:44px;margin:-10px -12px -10px 0;padding:0;border:0;background:none;color:var(--mi-ink-2);cursor:pointer}
.tgs-mi-hl-undo:hover{color:var(--mi-ink)}
.tgs-mi-hl-color{display:flex;flex-direction:column;gap:8px}
.tgs-mi-hl-color input[type="color"]{width:100%;min-height:44px;padding:4px;border-radius:var(--mi-r-in);border:0;background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-track-edge)}
.tgs-mi-hl .tgs-mi-select{min-height:44px;padding:0 12px;border-radius:var(--mi-r-in);border:0;background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-track-edge);color:var(--mi-ink)}
@media (prefers-reduced-motion:reduce){.tgs-mi-hl-tile{transition:none}}
/* Каталог эффектов банка (спека банка §3.1–§3.2): поиск, вкладки лентой, сетка плиток 9:16; галочка и звёздочка — по углам петли. */
.tgs-mi-fx-cat{display:flex;flex-direction:column;gap:12px}
.tgs-mi-fx-search{min-height:44px;padding:0 16px;border:0;border-radius:var(--mi-r-in);background:var(--mi-track);color:var(--mi-ink);box-shadow:inset 0 0 0 1px var(--mi-track-edge)}
.tgs-mi-fx-search:focus-visible{outline:none;box-shadow:inset 0 0 0 2px var(--mi-sel)}
.tgs-mi-fx-tabs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -4px;padding:0 4px}
.tgs-mi-fx-tabs::-webkit-scrollbar{display:none}
.tgs-mi-fx-tab{flex:none;min-height:36px;padding:0 12px;border:0;border-radius:999px;background:var(--mi-track);color:var(--mi-ink-2);white-space:nowrap;cursor:pointer;transition:background .16s var(--mi-ease),color .16s var(--mi-ease)}
.tgs-mi-fx-tab[aria-selected="true"]{background:var(--mi-ink);color:var(--mi-bg,#000)}
.tgs-mi-fx-tab:focus-visible{outline:none;box-shadow:0 0 0 2px var(--mi-sel)}
.tgs-mi-fx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px 8px}
.tgs-mi-fx-tile{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0}
.tgs-mi-fx-try{display:flex;flex-direction:column;gap:8px;padding:0;border:0;background:none;color:var(--mi-ink);text-align:center;cursor:pointer}
.tgs-mi-fx-media{position:relative;display:block;aspect-ratio:9/16;overflow:hidden;border-radius:14px;background:#111;box-shadow:inset 0 0 0 1px var(--mi-track-edge);transition:box-shadow .16s var(--mi-ease),transform .16s var(--mi-ease)}
.tgs-mi-fx-media img,.tgs-mi-fx-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tgs-mi-fx-try:hover .tgs-mi-fx-media{box-shadow:inset 0 0 0 1px var(--mi-lac-edge-hover)}
.tgs-mi-fx-try:active .tgs-mi-fx-media{transform:scale(.97)}
.tgs-mi-fx-try[aria-pressed="true"] .tgs-mi-fx-media{box-shadow:inset 0 0 0 2px var(--mi-ink),0 0 0 1px var(--mi-ink)}
.tgs-mi-fx-try:focus-visible{outline:none}
.tgs-mi-fx-try:focus-visible .tgs-mi-fx-media{box-shadow:inset 0 0 0 2px var(--mi-sel)}
.tgs-mi-fx-name{min-width:0;color:var(--mi-ink-2);line-height:1.2;overflow-wrap:anywhere;hyphens:auto}
.tgs-mi-fx-try[aria-pressed="true"] .tgs-mi-fx-name{color:var(--mi-ink);font-weight:600}
.tgs-mi-fx-new{position:absolute;bottom:6px;left:6px;padding:4px 8px;border-radius:999px;background:var(--mi-ink);color:#111;line-height:1.3}
/* галочка и звёздочка: видимый круг 32 px, зона нажатия 44 px */
.tgs-mi-fx-add,.tgs-mi-fx-fav{position:absolute;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;color:#fff;cursor:pointer}
.tgs-mi-fx-add::before,.tgs-mi-fx-fav::before{content:'';position:absolute;inset:6px;border-radius:50%;background:rgba(0,0,0,.55);backdrop-filter:blur(8px);transition:background .16s var(--mi-ease)}
.tgs-mi-fx-add svg,.tgs-mi-fx-fav svg{position:relative}
.tgs-mi-fx-add{right:-2px;top:-2px}
.tgs-mi-fx-fav{left:-2px;top:-2px;opacity:.85}
.tgs-mi-fx-fav[aria-pressed="true"]{color:var(--mi-warn,#FFD43B);opacity:1}
.tgs-mi-fx-fav[aria-pressed="true"] svg{fill:currentColor}
.tgs-mi-fx-add:hover::before{background:var(--mi-ink)}
.tgs-mi-fx-add:hover{color:#111}
.tgs-mi-fx-add:disabled{cursor:default;color:rgba(255,255,255,.4)}
.tgs-mi-fx-add:disabled::before{background:rgba(0,0,0,.4)}
.tgs-mi-fx-add:focus-visible,.tgs-mi-fx-fav:focus-visible{outline:none}
.tgs-mi-fx-add:focus-visible::before,.tgs-mi-fx-fav:focus-visible::before{box-shadow:0 0 0 2px var(--mi-sel)}
.tgs-mi-fx-hint{color:var(--mi-warn);line-height:1.25}
/* Свойства клипа эффекта (спека банка §3.4): поля слотов, пункт списка в строку, подписи источника цифры и ошибок. */
.tgs-mi-fx-props{display:flex;flex-direction:column;gap:16px}
.tgs-mi-fx-item{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tgs-mi-fx-item input{flex:1 1 120px;min-height:44px;padding:0 12px;border:0;border-radius:var(--mi-r-in);background:var(--mi-track);color:var(--mi-ink);box-shadow:inset 0 0 0 1px var(--mi-track-edge)}
.tgs-mi-fx-link{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.tgs-mi-fx-link input{min-height:44px;padding:0 12px;border:0;border-radius:var(--mi-r-in);background:var(--mi-track);color:var(--mi-ink);box-shadow:inset 0 0 0 1px var(--mi-track-edge)}
.tgs-mi-fx-assets{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:8px;margin:8px 0 0;padding:0;list-style:none}
.tgs-mi-fx-assets li{position:relative;aspect-ratio:9/16;border-radius:12px;overflow:hidden;background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-track-edge);display:grid;place-items:center;cursor:grab}
.tgs-mi-fx-assets li img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgs-mi-fx-assets li .tgs-mi-panel-ic{position:absolute;top:0;right:0;width:32px;height:32px;background:rgba(0,0,0,.45);color:#fff;border-radius:0 0 0 10px}
.tgs-mi-fx-item input[aria-invalid="true"],.tgs-mi-fx-props input[aria-invalid="true"]{box-shadow:inset 0 0 0 2px var(--mi-err,#FF453A)}
.tgs-mi-fx-err{flex-basis:100%;color:var(--mi-err,#FF453A)}
.tgs-mi-fx-src{color:var(--mi-ink-2)}
.tgs-mi-fx-warn{color:var(--mi-warn)}
.tgs-mi-fx-switch{display:flex;align-items:center;gap:8px;min-height:44px}
@media (prefers-reduced-motion:reduce){.tgs-mi-fx-media,.tgs-mi-fx-tab{transition:none}.tgs-mi-fx-try:active .tgs-mi-fx-media{transform:none}}
.tgs-mi-track-own{display:flex;flex-direction:column;gap:8px}
.tgs-mi-track-own .tgs-mi-note{display:flex;align-items:center;gap:8px}
.tgs-mi-word{field-sizing:content;min-width:2ch;max-width:100%;min-height:44px;padding:0 12px;border:1px solid var(--mi-track-edge);border-radius:10px;background:var(--mi-track);color:var(--mi-ink);font-family:inherit;text-align:center}
.tgs-mi-word:focus{outline:none;border-color:var(--mi-ink-2)}
.tgs-mi-phrase{margin:0;padding:12px 12px;border-radius:var(--mi-r-in);background:var(--mi-track)}
.tgs-mi-textf{display:flex;flex-direction:column;gap:8px}
.tgs-mi-textf input{min-height:44px;padding:0 12px;border-radius:var(--mi-r-in);border:0;background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-track-edge);color:var(--mi-ink)}
.tgs-mi-counter{align-self:flex-end;color:var(--mi-ink-3);font-variant-numeric:tabular-nums}
.tgs-mi-row{display:flex;flex-wrap:wrap;gap:8px}
/* Панель над таймлайном: «↶ ↷ Разделить» в одну строку (AUDIT Д7 — без правил стояли столбиком). */
.tgs-mi-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.tgs-mi-ibtn.is-redo svg{transform:scaleX(-1)}
.tgs-mi-ibtn:disabled{opacity:.4}
.tgs-mi-split{display:inline-flex;align-items:center;gap:12px}
.tgs-mi-tl{container:tl/inline-size;min-height:220px;max-height:320px;display:flex;flex-direction:column;border-radius:var(--mi-r-out);background:var(--mi-plate-solid);box-shadow:0 0 0 1px var(--mi-plate-edge);overflow:hidden}
/* Открыт инструмент (телефон, планшет): дорожки скрыты — остаётся строка «время · Вписать», без высоты пустого таймлайна. */
.tgs-mi-tl:has(>.tgs-mi-tl-body[hidden]){min-height:0}
.tgs-mi-tl.is-off{filter:grayscale(1);opacity:.6}
.tgs-mi-tl-h{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 16px;color:var(--mi-ink-3)}
.tgs-mi-tl-clock{color:var(--mi-ink);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
.tgs-mi-tl-zoom{display:inline-flex;align-items:center;gap:8px;min-width:0}
.tgs-mi-tl-zoom input[type=range]{width:96px}
.tgs-mi-tl-body{flex:1;overflow:auto;overscroll-behavior:contain}
.tgs-mi-tl-scroll{--mi-lane-h:72px;position:relative;min-width:100%;touch-action:pan-y}
/* Дорожки ниже (правка founder'а, задача 42): на мыши плитка 24 (WCAG 2.5.8) с отступом 2, «Видео» — 32 под кадры.
   Сенсор — 44 (правило pointer:coarse ниже и телефон). */
.tgs-mi-lane{display:grid;grid-template-columns:var(--mi-lane-h) 1fr;min-height:29px;border-top:1px solid var(--mi-plate-edge)}
.tgs-mi-lane[data-lane=video]{min-height:37px}
.tgs-mi-lane-h{position:sticky;left:0;z-index:2;display:flex;align-items:center;gap:8px;padding:0 8px;background:var(--mi-plate-solid);color:var(--mi-ink-2)}
/* Значок инструмента дорожки вместо названия (правка founder'а, задача 42): колонка 72 — значок 18 и «+» 28. */
.tgs-mi-lane-ic{flex:none;display:grid;place-items:center;width:18px;height:18px;color:var(--mi-ink-2)}
.tgs-mi-lane-h input[type=range]{width:56px}
.tgs-mi-lane-h .tgs-mi-tog{transform:scale(.8)}
.tgs-mi-lane-t{position:relative;min-height:28px}
.tgs-mi-el{position:absolute;top:2px;bottom:2px;display:flex;align-items:center;gap:4px;padding:0 8px;overflow:hidden;border:0;border-radius:8px;background:var(--mi-lac);box-shadow:inset 0 0 0 1px var(--mi-lac-edge);color:var(--mi-ink);font-size:var(--fs-meta);white-space:nowrap;text-align:left}
/* Цель нажатия мышью — не меньше 24 (WCAG 2.5.8): короткая плитка шире своей длительности, звук в два ряда — по 24 на ряд. */
.tgs-mi-el{min-width:min(24px,var(--el-room,24px))}
.tgs-mi-lane:has(.tgs-mi-el[data-row=sfx]){min-height:53px}
.tgs-mi-el[aria-selected="true"]{box-shadow:inset 0 0 0 2px var(--mi-ink)}
/* У выделенной плитки ручки обрезки по краям — подпись отступает от них, первая буква не под ручкой. */
.tgs-mi-el[aria-selected="true"]:has(>[data-handle]){padding-inline:16px}
.tgs-mi-el.is-skipped{opacity:.45;background:repeating-linear-gradient(135deg,transparent 0 4px,rgba(255,255,255,.08) 4px 8px)}
/* закреплён правкой человека (план 4а В3): значок в правом верхнем углу; нарушение правил кадра — красная рамка и текст */
.tgs-mi-pin{position:absolute;top:2px;right:2px;display:inline-flex;color:var(--tx-2,rgba(255,255,255,.72));pointer-events:none}
.tgs-mi-el[data-violation]{box-shadow:inset 0 0 0 2px #FF453A}
.tgs-mi-violation{position:absolute;left:4px;right:4px;bottom:1px;color:#FF6961;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;pointer-events:none}
/* Содержимое плашки — одна строка 28 с переносом: миниатюра, подпись (сжимается с многоточием), значок источника.
   Значок не помещается целиком — переносится на вторую строку и скрыт обрезкой, а не режется посреди слова (планка 5). */
.tgs-mi-el-c{position:relative;display:flex;flex-wrap:wrap;align-items:center;align-content:flex-start;column-gap:4px;row-gap:32px;flex:1 1 auto;min-width:0;height:28px;overflow:hidden}
.tgs-mi-el-l{flex:1 1 0;min-width:0;line-height:28px;overflow:hidden;text-overflow:ellipsis;color:var(--mi-ink-2)}
/* Плитки (пересборка §9.4): кадры видео из спрайта, волна звука, миниатюра и значок источника вставки. */
.tgs-mi-frames{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
/* Кадры 44 (высота плитки на сенсоре) по центру плитки: на мыши (32) срезаются поровну сверху и снизу, лицо в кадре. */
.tgs-mi-frames>span{position:absolute;top:50%;height:44px;margin-top:-22px;background-repeat:no-repeat}
.tgs-mi-wave{position:absolute;left:0;right:0;bottom:2px;width:100%;height:24px;pointer-events:none}
.tgs-mi-wave path{stroke:var(--mi-ink-3);stroke-width:1.5;fill:none}
.tgs-mi-el-thumb{width:20px;height:20px;flex:0 1 20px;min-width:0;border-radius:6px;object-fit:cover}
.tgs-mi-badge{flex:none;padding:1px 4px;border-radius:6px;background:var(--card);color:var(--mi-ink)}
/* Края и перетаскивание (§9.6): ручки у выбранной плитки, тень при протяжке, метка прилипания к границе слова. */
/* Ручки обрезки — только [data-handle]: класс общий с ручкой шторки телефона, голое правило уводило её к левому краю. */
.tgs-mi-handle[data-handle]{display:block;position:absolute;top:0;bottom:0;width:10px;height:auto;margin:0;background:var(--mi-ink);cursor:ew-resize;touch-action:none}
.tgs-mi-handle[data-handle=a]{left:0;border-radius:8px 0 0 8px}
.tgs-mi-handle[data-handle=b]{right:0;border-radius:0 8px 8px 0}
.tgs-mi-el[data-dragging]{z-index:3;opacity:.85;box-shadow:0 6px 18px rgba(0,0,0,.25)}
.tgs-mi-snap{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;z-index:4;background:var(--mi-ink);pointer-events:none}
@media (pointer:coarse){.tgs-mi-handle[data-handle]{width:22px}}
/* Сенсорный экран любой ширины (iPad тоже): дорожка и плитка таймлайна — высота касания 44, как на телефоне. */
/* Сенсор (founder 20.10: «как для слепых»): дорожки компактные, как в CapCut и Captions на телефоне — плитка 28
   (WCAG 2.5.8 ≥ 24), «Видео» 44 под кадры, звук в два ряда по 28. Остальные цели касания — 44. */
@media (pointer:coarse){.tgs-mi-lane{min-height:33px}.tgs-mi-lane[data-lane=video]{min-height:45px}.tgs-mi-lane:has(.tgs-mi-el[data-row=sfx]){min-height:61px}.tgs-mi-el{min-width:min(28px,var(--el-room,28px))}}
.tgs-mi-toolbar .tgs-mi-ibtn[aria-disabled=true]{opacity:.35;cursor:default}
.tgs-mi-ctxmenu{z-index:50;min-width:180px}
.tgs-mi-el[data-row=sfx]{bottom:50%;z-index:1}
/* Музыка при звуках — нижний ряд (как дорожки A1/A2 в монтажных программах); без звуков — во всю высоту. */
.tgs-mi-lane:has(.tgs-mi-el[data-row=sfx]) .tgs-mi-el[data-row=music]{top:50%}
/* Перекрытые клипы-заголовки (спека заголовков CapCut §3.2) — рядами, как дорожки T1/T2/T3; зоны входа и выхода — светлее. */
.tgs-mi-el[data-level]{top:calc(2px + var(--lv,0) * 100% / var(--rows,1));bottom:auto;height:calc(100% / var(--rows,1) - 4px)}
.tgs-mi-zone{position:absolute;top:0;bottom:0;pointer-events:none;background:rgba(255,255,255,.22)}
.tgs-mi-zone[data-zone=in]{left:0;border-radius:8px 0 0 8px}
.tgs-mi-zone[data-zone=out]{right:0;border-radius:0 8px 8px 0}
/* Стык кусков (пересборка §9.4): значок-ромб на «Видео», нажатие — свойства перехода. */
.tgs-mi-join{position:absolute;top:50%;z-index:2;width:14px;height:14px;margin:-7px 0 0 -7px;padding:0;border:0;border-radius:3px;transform:rotate(45deg);background:var(--mi-ink);box-shadow:0 0 0 2px var(--card)}
.tgs-mi-join[aria-selected=true]{outline:2px solid var(--mi-ink);outline-offset:2px}
.tgs-mi-cut{position:absolute;top:2px;bottom:2px;width:2px;margin-left:-1px;background:var(--mi-ink-3)}
.tgs-mi-cut[data-cut="hatch"]{width:10px;margin-left:-5px;background:repeating-linear-gradient(135deg,var(--mi-ink-3) 0 2px,transparent 2px 5px)}
.tgs-mi-tl-ruler{display:grid;grid-template-columns:var(--mi-lane-h) 1fr;height:24px;cursor:pointer}
.tgs-mi-tl-ruler .tgs-mi-lane-h{cursor:default}
.tgs-mi-tl-ruler-t{position:relative;background:repeating-linear-gradient(90deg,var(--mi-plate-edge) 0 1px,transparent 1px 10%) bottom/100% 8px no-repeat}
.tgs-mi-tl-mark{position:absolute;top:2px;transform:translateX(3px);font-style:normal;color:var(--mi-ink-3);font-variant-numeric:tabular-nums;pointer-events:none;white-space:nowrap}
/* Линия сквозь дорожки нажатий не берёт (плашка под ней выбирается); тянут её за головку на шкале — как в монтажных программах. */
.tgs-mi-playhead::before{content:"";position:absolute;top:2px;left:-6px;width:14px;height:14px;border-radius:50%;background:var(--mi-ink);pointer-events:auto}
.tgs-mi-playhead::after{content:"";position:absolute;top:0;left:-11px;right:-11px;height:24px;cursor:ew-resize;pointer-events:auto}
.tgs-mi-playhead{position:absolute;top:0;bottom:0;z-index:3;width:2px;margin-left:-1px;touch-action:none;pointer-events:none;background:var(--mi-ink);box-shadow:0 0 8px rgba(242,241,238,.6);outline:0}
.tgs-mi-playhead:focus-visible{box-shadow:0 0 0 3px var(--mi-ink-3)}
@container (max-width:900px){.tgs-mi-editor-top{flex-direction:column}}
/* Экран процесса (спека UX §3.3, план Ф9): рамка 9:16 с размытым кадром, затемнение 30 %, блик по диагонали
   за 2,4 с (при is-still — без блика); шаги: горит — сделан, пульсирует — идёт, тусклый — впереди. */
.tgs-mi-pframe{position:relative;aspect-ratio:9/16;border-radius:var(--mi-r-out);overflow:hidden;background:#0E0E10;box-shadow:0 0 0 1px var(--mi-plate-edge),var(--mi-plate-sh)}
.tgs-mi-pdim{position:absolute;inset:0;background:rgba(0,0,0,.3)}
.tgs-mi-pframe.is-glint::after{content:'';position:absolute;inset:-50%;background:linear-gradient(120deg,transparent 40%,rgba(255,255,255,.14) 50%,transparent 60%);animation:tgs-mi-glint 2.4s var(--mi-ease) infinite}
@keyframes tgs-mi-glint{from{transform:translate(-30%,-30%)}to{transform:translate(30%,30%)}}
@keyframes tgs-mi-pulse{50%{opacity:.35;transform:scale(.8)}}
.tgs-mi-player{--mi-ar:.5625;position:relative;aspect-ratio:9/16;max-width:100%;border-radius:18px;overflow:hidden;background:linear-gradient(170deg,#2c3542,#12161b);box-shadow:0 0 0 1px var(--gb-line)}
.tgs-mi-player.run{outline:2px solid var(--mi-hi)}
.tgs-mi-player video{display:block;width:100%;height:100%;object-fit:cover;background:#000}
.tgs-mi-pstate{display:flex;flex-direction:column;gap:16px;min-width:0}
.tgs-mi-pstate h2{margin:0;font-family:'Manrope',system-ui,sans-serif;font-weight:800;text-wrap:balance}
.tgs-mi-pstate p{margin:0}
.tgs-mi-pct{font-family:'Manrope',system-ui,sans-serif;font-weight:800;font-size:var(--fs-section,28px);color:var(--mi-hi-tx);font-variant-numeric:tabular-nums}
.tgs-mi-bar{height:6px;border-radius:6px;background:var(--card2);overflow:hidden}
.tgs-mi-bar i{display:block;height:100%;background:var(--mi-hi);transition:width .4s ease}
.tgs-mi-steps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.tgs-mi-steps li{display:flex;align-items:center;gap:12px}
.tgs-mi-steps li .dot{width:20px;height:20px;flex:none;display:grid;place-items:center;border-radius:50%;background:var(--card2);color:var(--faint);font-size:var(--fs-meta)}
.tgs-mi-steps li .tgs-mi-spin{width:20px;height:20px}
.tgs-mi-steps li.done .dot{background:rgba(95,191,134,.16);color:#5FBF86}
.tgs-mi-steps li.now{color:var(--text);font-weight:600}
.tgs-mi-steps li.wait{color:var(--faint)}
.tgs-mi-anchor{position:relative}
.tgs-mi-myvideos{display:flex;flex-direction:column;gap:8px;margin-top:24px}
.tgs-mi-myvideos h3{margin:0;font-weight:700}
/* Р26 §4.6.1: строка 56 — кадр 32×56 · стиль 13 и статус 12 · «›»; при сборке — полоса 2 px под строкой. */
.tgs-mi-vjob{position:relative;display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:8px 4px;border:0;border-bottom:.5px solid var(--line);background:none;color:var(--mi-ink);text-align:left}
.tgs-mi-rows>.tgs-mi-vjob:last-child{border-bottom:0}
.tgs-mi-vjob>.tgs-mi-srcframe{flex:none;width:32px;height:56px;border-radius:6px;overflow:hidden}
.tgs-mi-vjob-txt{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.tgs-mi-vjob-t{font-size:var(--fs-ui);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-vjob-s{font-size:var(--fs-meta);color:var(--muted)}
.tgs-mi-vjob-bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.08)}
.tgs-mi-vjob-bar>span{display:block;height:100%;background:var(--accent)}
@media (prefers-reduced-motion:reduce){.tgs-mi-bar i{transition:none}}
.tgs-mi-fld{display:flex;flex-direction:column;gap:8px;color:var(--muted)}
.tgs-mi-fld input,.tgs-mi-fld textarea{min-height:44px;padding:12px 12px;border:1px solid var(--gb-line);border-radius:12px;background:var(--gb);color:var(--text);resize:vertical}
.tgs-mi-fld input:focus-visible,.tgs-mi-fld textarea:focus-visible{outline:2px solid var(--mi-hi);outline-offset:1px}
.tgs-mi-pubst{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--gb-line);border-radius:14px;background:var(--pane)}
.tgs-mi-pubst p{display:flex;align-items:center;gap:8px;margin:0}
.tgs-mi-linkrow{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.tgs-mi-linkrow code{min-width:0;overflow-wrap:anywhere;padding:8px 12px;border-radius:10px;background:var(--card2)}
.tgs-mi-astats{display:flex;flex-direction:column;gap:4px}
/* Страница стиля по ссылке и из ленты, жалоба, панель ленты «Стили монтажа» (ЕФ15) */
.tgs-mi-spage{box-sizing:border-box;width:100%;max-width:960px;min-height:100dvh;margin:0 auto;padding:32px 16px;color:var(--text);background:var(--bg-home)}
.tgs-mi-spbody{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:24px;align-items:start}
.tgs-mi-spvid{width:100%;aspect-ratio:9/16;border-radius:18px;background:var(--pane);object-fit:cover}
.tgs-mi-spmeta{display:flex;flex-direction:column;gap:12px;min-width:0}
.tgs-mi-spmeta h1{margin:0;font-weight:700;overflow-wrap:anywhere}
.tgs-mi-spmeta p{margin:0}
.tgs-mi-spwhat{display:flex;flex-direction:column;gap:8px;margin:0;padding-left:16px;color:var(--muted)}
.tgs-mi-spacts{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.tgs-mi-spacts .tgs-mi-link{margin-left:auto}
.tgs-mi-spdead{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:48px 0}
.tgs-mi-spdead p{margin:0}
.tgs-mi-spdead a{text-decoration:none}
.tgs-mi-sppop .tgs-mi-spbody{grid-template-columns:minmax(0,240px) minmax(0,1fr)}
.tgs-mi-feedbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:0 0 12px}
.tgs-mi[data-layout="phone"] .tgs-mi-spbody,.tgs-mi[data-layout="phone"] .tgs-mi-sppop .tgs-mi-spbody{grid-template-columns:minmax(0,1fr)}.tgs-mi[data-layout="phone"] .tgs-mi-spvid{max-height:70dvh}.tgs-mi[data-layout="phone"].tgs-mi-spage,.tgs-mi[data-layout="phone"] .tgs-mi-spage{padding:16px}
/* Телефон и планшет (спека UX §3.5, план Ф17). Телефон < 768 px: конструктор — превью сверху (ширина экрана − 32 px,
   высота ≤ 58 %), пластина — шторка снизу; результат — шапка с «Скачать», видео ≤ 45 %, таймлайн (4 полосы видно),
   полоса инструментов, свойства — в шторке; плашки таймлайна — зона нажатия ≥ 44 px. Планшет 768–1023 px —
   раскладка компьютера, пластина 360 px поверх левого края превью. */
  /* Сбой: пустая рамка-заглушка на телефоне схлопывалась в точку обводки и только толкала бы карточку вниз. */
  .tgs-mi[data-layout="phone"] .tgs-mi-stage-center>.tgs-mi-player:empty{display:none}
  /* «Ролик готов» (задача 42): по ширине 300 ролик выталкивал ряд значков под «Экспорт». Высота — экран минус шапка, «‹»,
     заголовок, ряд и кнопка (380), но не ниже 280; ширина — из 9:16. */
  .tgs-mi[data-layout="phone"] .tgs-mi-stage.ready .tgs-mi-stage-center>.tgs-mi-player{width:min(100%,calc(max(280px,100dvh - 380px) * var(--mi-ar)))}
  /* Шапка — у верха (≤700 у конструктора justify-content:flex-end для column-reverse — здесь направление column);
     превью — до свёрнутой шторки: экран минус шапка (64) и шторка (~190). */
  /* Стили на телефоне — сетка по 3 в ряд, прокрутка вниз вместе со страницей (как Captions, founder 20.10);
     полки (★ · Мои · Все…) прилипают к верху, пока листаешь. Подгрузка следующей страницы — та же метка data-more. */
  .tgs-mi[data-layout="phone"] .tgs-mi-row-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 8px;overflow:visible;scroll-snap-type:none;padding:0}
  .tgs-mi[data-layout="phone"] .tgs-mi-row-cards>[data-card]{width:auto}
  .tgs-mi[data-layout="phone"] .tgs-mi-row-cards>:not([data-card]){grid-column:1/-1}
  .tgs-mi[data-layout="phone"] .tgs-mi-row-cards .tgs-mi-pv{border-radius:14px}
  .tgs-mi[data-layout="phone"] .tgs-mi-gal>.tgs-mi-tabs2{position:sticky;top:0;z-index:3;margin-inline:-16px;padding:4px 16px;background:var(--mi-bg)}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone{gap:12px}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-preview-frame{height:45dvh}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-tl{min-height:0;max-height:calc(5 * 33px + 45px + 28px + 80px)}
  /* Панель свойств (38 %) + таймлайн в 4 дорожки оставляли ролику 29 % на 360: при ней — 3 дорожки, остальные прокруткой. */
  .tgs-mi[data-layout="phone"] .tgs-mi-stage.edit:has(.tgs-mi-panel[data-size="props"]) .tgs-mi-tl{max-height:calc(2 * 33px + 45px + 80px)}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-lane{min-height:33px}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-lane[data-lane=video]{min-height:45px}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-lane-t{min-height:28px}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-lane-h input[type=range],.tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-lane-h .tgs-mi-tog{display:none}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-el{min-width:min(28px,var(--el-room,28px))}
  /* «Звук» со звуками — два ряда по 44: звуки сверху, музыка снизу (общее правило плитки сводило их в одну строку). */
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-lane:has(.tgs-mi-el[data-row=sfx]){min-height:61px}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-el[data-row=sfx]{bottom:50%}
  .tgs-mi[data-layout="phone"] .tgs-mi-editor.phone .tgs-mi-lane:has(.tgs-mi-el[data-row=sfx]) .tgs-mi-el[data-row=music]{top:50%}
  .tgs-mi[data-layout="tablet"] .tgs-mi-editor-top{position:relative;display:block}
  .tgs-mi[data-layout="tablet"] .tgs-mi-editor-top .tgs-mi-editor-stage{padding-left:200px}
/* «Поделиться» и ошибка сборки в новом виде (спека UX §3.6, план Ф18): пластина по центру. */
.tgs-mi-plate.tgs-mi-publish{position:relative;margin:auto;width:min(560px,calc(100% - 32px));max-height:calc(100% - 48px);display:flex;flex-direction:column;overflow:auto}
/* Окно «Опубликовать» (пересборка §8.3–8.6): компьютер — 880px, слева превью и обложка, справа настройки; телефон — лист */
.tgs-mi-pub-b{display:grid;grid-template-columns:260px 1fr;gap:24px;max-height:calc(100dvh - 120px);overflow:auto}
/* Окно публикации (Р24, Р23): тело с полями; «Куда» — строка на сеть: значок и название, у подключённой — чипы
   аккаунтов, у неподключённой — приглушена, справа «Подключить»; «Доп. опция» — подпись под кнопкой. */
.tgs-mi-pub-b{padding:12px 16px 16px}
.tgs-mi-pub-where{display:flex;flex-direction:column;gap:8px}
.tgs-mi-pub-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;min-height:56px;padding:8px 12px 8px 16px;border-radius:var(--mi-r-in);background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-track-edge)}
.tgs-mi-pub-row-h{display:flex;align-items:center;gap:12px;min-width:120px}
.tgs-mi-pub-row-h svg{width:24px;height:24px;flex:none}
.tgs-mi-pub-row-name{color:var(--mi-ink)}
.tgs-mi-pub-row[data-state=off] .tgs-mi-pub-row-h{opacity:.55}
.tgs-mi-pub-row-accs{display:flex;flex-wrap:wrap;gap:8px;flex:1;min-width:0}
.tgs-mi-pub-row-accs:empty{display:none}
.tgs-mi-pub-acc{display:inline-flex;flex-wrap:wrap;align-items:center;gap:2px;min-width:0}
.tgs-mi-pub-chip{display:inline-flex;align-items:center;gap:8px;min-height:40px;max-width:100%;padding:4px 16px 4px 4px;border-radius:999px;border:1px solid transparent;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;color:var(--mi-ink);font:inherit}
.tgs-mi-pub-chip>.fs-ui{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgs-mi-pub-chip img{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;background:var(--mi-track)}
.tgs-mi-pub-chip[aria-pressed=true]{background:var(--mi-lac-on) padding-box,var(--mi-lac-edge-on) border-box}
.tgs-mi-pub-chip:disabled{opacity:.45}
.tgs-mi-pub-why{flex-basis:100%;color:var(--mi-ink-3)}
.tgs-mi-pub-add{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;min-height:40px;margin-left:auto;padding:4px 16px;border-radius:999px;border:1px solid transparent;background:var(--mi-lac) padding-box,var(--mi-lac-edge) border-box;color:var(--mi-ink);font:inherit;line-height:1.2}
.tgs-mi-pub-when,.tgs-mi-pub-cover{display:flex;flex-direction:column;gap:12px}
.tgs-mi-pub-cover-t{display:grid;place-items:center;height:100%;font-size:var(--fs-meta);color:var(--muted);font-variant-numeric:tabular-nums}
.tgs-mi-panel[data-panel="publish"] .tgs-mi-pub-b{display:flex;flex-direction:column;gap:16px;max-height:none;overflow:visible;padding:0}
/* Превью поста в листе — миниатюра: во всю ширину оно (9:16) выталкивало обложку и «Куда» за экран (обход планок). */
.tgs-mi-panel[data-panel="publish"] .tgs-mi-pub-post{width:160px;align-self:center}
/* Панель музыки (§9.6; Р23 — жила без стилей): карточка трека, полоса трека с рамкой длины ролика, «Мои треки». */
.tgs-mi-music{display:flex;flex-direction:column;gap:16px}
.tgs-mi-mcard{display:flex;align-items:center;gap:12px;padding:12px 12px;border-radius:var(--mi-r-in);background:var(--mi-track);box-shadow:inset 0 0 0 1px var(--mi-track-edge)}
.tgs-mi-mcard-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.tgs-mi-mcard-t b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgs-mi-mwave{position:relative;height:40px;border-radius:10px;overflow:hidden;background:repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 2px,transparent 2px 5px)}
.tgs-mi-mframe{position:absolute;top:0;bottom:0;border-radius:10px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 2px var(--mi-ink)}
.tgs-mi-mytracks{display:flex;flex-direction:column;gap:8px;margin:0;padding:0;list-style:none}
.tgs-mi-mytracks.is-empty{gap:12px}
.tgs-mi-mytracks button{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:0 12px;border:0;border-radius:var(--mi-r-in);background:var(--mi-track);color:var(--mi-ink);font:inherit;text-align:left}
.tgs-mi-mytracks button[aria-selected=true]{box-shadow:inset 0 0 0 1.5px var(--mi-ink)}
.tgs-mi-mt-n{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Выбор вида генерации, заблокированный тарифом эффект, «не помещается» поверх превью (Р23 — жили без стилей) */
.tgs-mi-gencaps{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:8px}
.tgs-mi-gencaps .tgs-mi-lac{min-width:0;padding-inline:8px;justify-content:center}
/* Окно генерации: форма «Медиа» по содержимому окна (у страницы «Медиа» — min-height:100dvh), прокрутка внутри окна,
   поле ввода прилипает к низу окна. */
.tgs-mi-genwin{overflow-y:auto}
.tgs-mi-genwin .tgs-mf{min-height:0}
.tgs-mi-locked{opacity:.5}
.tgs-mi-overflow{position:absolute;left:10px;right:10px;top:10px;z-index:2;padding:8px 12px;border-radius:12px;background:rgba(0,0,0,.72);color:#fff;text-align:center}
/* Телефон: превью поста не во весь экран — «Куда» видно без долгой прокрутки */
.tgs-mi-pub-l,.tgs-mi-pub-r,.tgs-mi-pub-net,.tgs-mi-pub-flags{display:flex;flex-direction:column;gap:12px}
.tgs-mi-pub-post{position:relative;aspect-ratio:9/16;border-radius:16px;overflow:hidden;background:var(--card2)}
.tgs-mi-pub-post video{width:100%;height:100%;object-fit:cover}
.tgs-mi-pub-post b,.tgs-mi-pub-post span{position:absolute;left:12px;right:12px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.6)}
.tgs-mi-pub-post b{bottom:44px}
.tgs-mi-pub-post span{bottom:12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tgs-mi-pub-net{padding:12px;border-radius:14px;box-shadow:inset 0 0 0 1px var(--gb-line)}
.tgs-mi-pub-net select,.tgs-mi-pub-net input:not([type=checkbox]){min-height:44px;padding:12px 12px;border:1px solid var(--gb-line);border-radius:12px;background:var(--gb);color:var(--text)}
.tgs-mi-pub-net .tgs-mi-tog:disabled{opacity:.4;cursor:not-allowed}
/* Кнопка — справа, причина «нельзя» — прямо под ней справа, как у «Смонтировать» и «Создать» (Р23). */
.tgs-mi-pub-r>.tgs-mi-pearl{align-self:flex-end}
.tgs-mi-pub-why{color:var(--muted)}
/* Главная (пересборка §4): трек с галочкой прав в зоне загрузки */
.tgs-mi-fantrack{display:flex;flex-direction:column;gap:8px;margin-top:8px}
.tgs-mi-post-go{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.tgs-mi-tl.compact .tgs-mi-lane-h{width:auto;min-width:0}
.tgs-mi-pbtn-l{color:var(--muted)}
.tgs-mi[data-layout="phone"] .tgs-mi-handle[data-handle]{width:24px}
.tgs-mi[data-layout="phone"] .tgs-mi-handle[data-handle]::before{content:"";position:absolute;top:0;bottom:0;left:-10px;right:-10px}
.tgs-mi-speechfull-pv{height:28vh;display:flex;justify-content:center}
.tgs-mi-speechfull-pv .tgs-mi-preview{height:100%}
.tgs-mi-selh{display:inline-block;width:4px;height:1.2em;margin:0 2px;vertical-align:middle;border-radius:2px;background:var(--mi-hi);position:relative;touch-action:none}
.tgs-mi-selh::before{content:"";position:absolute;inset:-12px -20px}
/* Меню у кнопки и окно-вопрос (Р26 §3.7). */
.tgs-mi-menu3{position:fixed;z-index:60;width:240px;max-width:calc(100vw - 16px);padding:8px;border-radius:14px;background:var(--mi-plate-solid);border:1px solid var(--mi-plate-edge);box-shadow:var(--sh2)}
.tgs-mi-menu3 [role="menuitem"]{display:flex;align-items:center;width:100%;min-height:44px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--mi-ink);font-size:var(--fs-body);text-align:left}
.tgs-mi-menu3 [role="menuitem"]:hover,.tgs-mi-menu3 [role="menuitem"]:focus-visible{background:rgba(255,255,255,.08);outline:none}
.tgs-mi-menu3 [role="menuitem"]:disabled{color:var(--faint)}
.tgs-mi-menu3 [role="menuitem"].is-danger{color:var(--err)}
.tgs-mi-menu3-sep{height:.5px;margin:8px 4px;background:var(--line)}
.tgs-mi-ask-scrim{position:fixed;inset:0;z-index:70;display:grid;place-items:center;padding:16px;background:rgba(0,0,0,.5)}
.tgs-mi-ask{width:300px;max-width:100%;padding:24px 24px 12px;border-radius:16px;background:var(--mi-plate-solid);border:1px solid var(--mi-plate-edge);box-shadow:var(--sh2);text-align:center}
.tgs-mi-ask-h{margin:0;font-size:var(--fs-lead);font-weight:600;color:var(--mi-ink)}
.tgs-mi-ask-t{margin:8px 0 0;font-size:var(--fs-ui);color:var(--muted)}
.tgs-mi-ask-f{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.tgs-mi-ask-f button{min-height:44px;border:0;border-radius:12px;background:rgba(255,255,255,.06);color:var(--mi-ink);font-size:var(--fs-body);font-weight:600}
.tgs-mi-ask-f button.is-danger{color:var(--err)}
.tgs-mi-ask-f button:disabled{opacity:.5}
/* Шапка, полоса главной кнопки, ряд действий (Р26 §3.1, §3.3, §3.4). */
.tgs-mi-topbar{display:flex;align-items:center;gap:4px;min-height:52px;padding:4px 8px}
.tgs-mi-topbar-back{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:12px;background:none;color:var(--mi-ink)}
.tgs-mi-topbar-t{flex:1 1 auto;min-width:0;margin:0;font-size:var(--fs-title);font-weight:600;color:var(--mi-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-topbar-r{display:flex;align-items:center;gap:4px;flex:none}
.tgs-mi-mainbar{position:sticky;bottom:0;z-index:5;display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:12px 16px 12px;padding-bottom:calc(12px + env(safe-area-inset-bottom));background:linear-gradient(to top,var(--bg) 70%,transparent)}
.tgs-mi[data-layout="wide"] .tgs-mi-mainbar{position:static;padding:12px 0;background:none}
.tgs-mi-mainbar-note{margin:0;text-align:center;font-size:var(--fs-meta);color:var(--muted)}
/* Причина неактивной главной кнопки — мелко под ней, как подпись полосы (founder 20.10). */
.tgs-mi-pearl-why{display:block;text-align:center;font-size:var(--fs-meta);color:var(--muted)}
/* Колонка — по ширине подписи, до 84: пять ячеек на 390 («Экспорт · Редактировать · Опубликовать · Другой стиль · Ещё») без обрезки подписей. */
.tgs-mi-iconrow{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(max-content,84px);justify-content:center;gap:4px}
.tgs-mi-iconrow-b{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:44px;min-height:44px;padding:0;border:0;background:none;color:var(--mi-ink)}
.tgs-mi-iconrow-i{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(255,255,255,.06)}
.tgs-mi-iconrow-l{max-width:100%;font-size:var(--fs-micro);color:var(--muted);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-iconrow-b[aria-disabled="true"]{color:var(--faint)}
.tgs-mi-iconrow-b[aria-disabled="true"] .tgs-mi-iconrow-i{background:rgba(255,255,255,.03)}
/* Главная в ряду (founder 20.10): жемчужный квадрат, подпись — ярче остальных; занята — жемчуг приглушён, не серый. */
.tgs-mi-iconrow-b.is-main .tgs-mi-iconrow-i{background:var(--mi-pearl);box-shadow:var(--mi-pearl-sh);color:var(--mi-pearl-ink)}
.tgs-mi-iconrow-b.is-main .tgs-mi-iconrow-l{color:var(--mi-ink);font-weight:600}
.tgs-mi-iconrow-b.is-main[aria-disabled="true"] .tgs-mi-iconrow-i{opacity:.6}
.tgs-mi-iconrow.is-small{grid-auto-columns:44px;justify-content:start}
.tgs-mi-iconrow.is-small .tgs-mi-iconrow-i{width:44px;height:44px;border-radius:12px}
/* Панель — один вид выбора (Р26 §3.5): dock — в потоке на месте ряда инструментов, over — лист снизу поверх экрана,
   slot — правая колонка широкого экрана. Высота — по содержимому, не выше доли окна; тело прокручивается само. */
.tgs-mi-panel{position:relative;display:flex;flex-direction:column;min-height:0;border-radius:20px 20px 0 0;overflow:hidden;transition:transform 280ms cubic-bezier(.32,.72,0,1),height 280ms cubic-bezier(.32,.72,0,1)}
/* Панель со стеклом .vsheet (окно пожеланий подписи) берёт фон и кромку у него — сплошную подложку не кладём. */
.tgs-mi-panel:not(.vsheet){background:var(--mi-plate-solid);border:1px solid var(--mi-plate-edge);border-bottom:0}
.tgs-mi-panel[data-size="tool"]{max-height:45dvh}
.tgs-mi-panel[data-size="props"]{max-height:38dvh}
.tgs-mi-panel[data-size="tall"]{max-height:85dvh}
.tgs-mi-panel[data-place="dock"]{position:static}
.tgs-mi-panel[data-mode="over"]{position:fixed;left:0;right:0;bottom:0;z-index:50;padding-bottom:env(safe-area-inset-bottom);transform:translateY(100%)}
.tgs-mi-panel[data-mode="over"].is-shown{transform:none}
.tgs-mi[data-layout="tablet"] .tgs-mi-panel[data-mode="over"]{left:50%;right:auto;width:min(640px,100%);margin-left:max(-320px,-50%)}
.tgs-mi[data-layout="wide"] .tgs-mi-panel[data-mode="over"]{top:0;left:auto;width:360px;max-height:none;border-radius:0;border-bottom:1px solid var(--mi-plate-edge);transform:translateX(100%)}
.tgs-mi[data-layout="wide"] .tgs-mi-panel[data-mode="over"].is-shown{transform:none}
.tgs-mi-panel[data-mode="slot"]{position:relative;height:100%;max-height:none;border:0;border-radius:0;background:none}
.tgs-mi-panel-scrim{position:fixed;inset:0;z-index:49;background:rgba(0,0,0,.32)}
.tgs-mi[data-layout="wide"] .tgs-mi-panel-scrim{background:rgba(0,0,0,.16)}
.tgs-mi-panel-h{display:grid;grid-template-columns:minmax(44px,auto) minmax(0,1fr) minmax(44px,auto);align-items:center;min-height:48px;padding:2px 4px;flex:none;touch-action:none}
.tgs-mi-panel-l{justify-self:start;display:flex}
.tgs-mi-panel-r{justify-self:end;display:flex;align-items:center}
.tgs-mi-panel-t{margin:0;text-align:center;font-size:var(--fs-title);font-weight:600;color:var(--mi-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;outline:none}
.tgs-mi-panel-ic{display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:12px;background:none;color:var(--mi-ink)}
.tgs-mi-panel-txt{min-height:44px;padding:0 12px;border:0;background:none;color:var(--muted);font-size:var(--fs-body)}
.tgs-mi-panel-sw{position:relative;width:44px;height:44px;border:0;background:none;padding:0}
.tgs-mi-panel-sw>span{position:absolute;left:4px;top:13px;width:36px;height:18px;border-radius:999px;background:rgba(255,255,255,.16);transition:background .2s ease}
.tgs-mi-panel-sw>span::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--mi-ink);transition:transform .2s ease}
.tgs-mi-panel-sw[aria-checked="true"]>span{background:var(--accent)}
.tgs-mi-panel-sw[aria-checked="true"]>span::after{transform:translateX(18px);background:var(--accent-ink)}
.tgs-mi-panel-b{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;container-type:inline-size}
.tgs-mi-panel-c{padding:4px 16px 16px}
@container (min-width:700px){.tgs-mi[data-layout="tablet"] .tgs-mi-panel.is-split .tgs-mi-panel-c{display:grid;grid-template-columns:1fr 1fr;gap:16px}}
@media (prefers-reduced-motion:reduce){.tgs-mi-panel,.tgs-mi-panel-sw>span,.tgs-mi-panel-sw>span::after{transition:none}}
/* Вкладки-слова (Р26 §3.6). */
.tgs-mi-tabs2{display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.tgs-mi-tabs2::-webkit-scrollbar{display:none}
.tgs-mi-tabs2 [role="tab"]{flex:none;min-height:44px;padding:0 12px;border:0;border-radius:10px;background:none;color:var(--muted);font-size:var(--fs-ui);font-weight:500;white-space:nowrap}
.tgs-mi-tabs2 [role="tab"][aria-selected="true"]{background:rgba(255,255,255,.08);color:var(--mi-ink)}
.tgs-mi-tabs2.is-inline{overflow-x:visible;flex-wrap:nowrap}
.tgs-mi-tabs2.is-inline [role="tab"]{flex:1 1 0;min-width:0;padding:0 8px}
/* Лента миниатюр и строки 44 (Р26 §3.7). */
.tgs-mi-strip{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:16px;scrollbar-width:none;overscroll-behavior-x:contain;margin-inline:-16px;padding:2px 16px}
.tgs-mi-strip::-webkit-scrollbar{display:none}
.tgs-mi-strip-card{position:relative;flex:none;scroll-snap-align:start}
.tgs-mi-strip-card:last-child{margin-right:24px}
.tgs-mi-strip-pick{display:flex;flex-direction:column;align-items:stretch;gap:8px;padding:0;border:0;background:none;color:var(--mi-ink);text-align:center}
.tgs-mi-strip-thumb{position:relative;display:block;overflow:hidden;border-radius:14px;background:var(--card2);box-shadow:0 0 0 1px var(--line)}
.tgs-mi-strip-thumb>img{width:100%;height:100%;object-fit:cover;display:block}
.tgs-mi-strip-pick[aria-pressed="true"] .tgs-mi-strip-thumb{box-shadow:0 0 0 1.5px #fff}
.tgs-mi-strip-pick:disabled{opacity:.5}
.tgs-mi-strip-l{display:block;font-size:var(--fs-meta);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-strip-pick[aria-pressed="true"] .tgs-mi-strip-l{color:var(--mi-ink)}
.tgs-mi-strip[data-size="card"] .tgs-mi-strip-pick{width:96px}
.tgs-mi-strip[data-size="card"] .tgs-mi-strip-thumb{width:96px;height:170px}
.tgs-mi-strip[data-size="preset"] .tgs-mi-strip-pick{width:68px}
.tgs-mi-strip[data-size="preset"] .tgs-mi-strip-thumb{width:68px;height:88px;border-radius:12px}
.tgs-mi-strip-extra{position:absolute;top:0;right:0;width:44px;height:44px;display:grid;place-items:center}
.tgs-mi-strip-extra>button{width:44px;height:44px;border:0;background:none;color:#fff;display:grid;place-items:center;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.tgs-mi-rows{display:flex;flex-direction:column}
.tgs-mi-rows[aria-disabled="true"]{pointer-events:none;opacity:.45}
.tgs-mi-row{display:flex;align-items:center;gap:12px;width:100%;min-height:44px;padding:8px 0;border:0;border-bottom:.5px solid var(--line);background:none;color:var(--mi-ink);text-align:left;font-size:var(--fs-body)}
.tgs-mi-rows>.tgs-mi-row:last-child{border-bottom:0}
.tgs-mi-row-txt{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}
.tgs-mi-row-t{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-row-s{font-size:var(--fs-meta);color:var(--muted)}
.tgs-mi-row-v{flex:none;max-width:55%;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-row-chev{flex:none;color:var(--faint);font-size:var(--fs-num);line-height:1}
.tgs-mi-row-ctl{flex:0 1 auto;min-width:0;display:flex;justify-content:flex-end}
.tgs-mi-row-sw{position:relative;flex:none;width:36px;height:18px;border-radius:999px;background:rgba(255,255,255,.16)}
.tgs-mi-row-sw::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--mi-ink);transition:transform .2s ease}
.tgs-mi-row[aria-checked="true"] .tgs-mi-row-sw{background:var(--accent)}
.tgs-mi-row[aria-checked="true"] .tgs-mi-row-sw::after{transform:translateX(18px);background:var(--accent-ink)}
@media (prefers-reduced-motion:reduce){.tgs-mi-row-sw::after{transition:none}}
/* Ряд инструментов (Р26 §3.8). */
.tgs-mi-toolrail{display:flex;gap:2px}
.tgs-mi-toolrail button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:44px;min-height:44px;padding:4px 2px;border:0;border-radius:12px;background:none;color:var(--muted)}
.tgs-mi-toolrail button>span{font-size:var(--fs-micro);white-space:nowrap}
.tgs-mi-toolrail button[aria-pressed="true"]{color:#fff}
.tgs-mi-toolrail button[aria-pressed="true"] svg{color:var(--accent)}
.tgs-mi-toolrail[data-orient="row"]{min-height:64px;align-items:stretch;justify-content:space-around;padding:4px 8px;padding-bottom:calc(4px + env(safe-area-inset-bottom))}
.tgs-mi-toolrail[data-orient="row"] button{flex:1 1 0;min-width:0}
.tgs-mi-toolrail[data-orient="col"]{flex-direction:column;width:84px;padding:8px 4px}
.tgs-mi-toolrail[data-orient="col"] button{min-height:64px}
.tgs-mi-toolrail[data-orient="col"] button[aria-pressed="true"]{background:rgba(255,255,255,.08)}
/* Редактор одной разметкой (Р26 §4.2): на телефоне и iPad — шапка · ролик · строка времени с таймлайном · ряд или панель. */
.tgs-mi[data-layout="phone"] .tgs-mi-stage.edit,.tgs-mi[data-layout="tablet"] .tgs-mi-stage.edit{grid-template-rows:auto minmax(0,1fr) auto auto;grid-template-areas:"top" "center" "bottom" "rail" "side" "info";gap:0;height:100dvh}
.tgs-mi[data-layout="phone"] .tgs-mi-stage.edit .tgs-mi-stage-center,.tgs-mi[data-layout="tablet"] .tgs-mi-stage.edit .tgs-mi-stage-center{min-height:0}
.tgs-mi[data-layout="phone"] .tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-editor-stage,.tgs-mi[data-layout="tablet"] .tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-editor-stage{height:100%;min-height:0}
.tgs-mi[data-layout="phone"] .tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-preview-frame,.tgs-mi[data-layout="tablet"] .tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-preview-frame{height:100%;min-height:120px}
/* Сцена редактора — на весь экран (100dvh): отступы главной вокруг неё сдвигали низ за край окна. Кадр 9:16 вписан
   по высоте своего места: figure получает высоту от колонки, иначе height:100% рамки не работал и кадр рос по ширине. */
.tgs-mi[data-layout="phone"] .tgs-mi-wrap:has(>.tgs-mi-stage.edit),.tgs-mi[data-layout="tablet"] .tgs-mi-wrap:has(>.tgs-mi-stage.edit){padding:0}
.tgs-mi[data-layout="phone"] .tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-editor-stage>.tgs-mi-preview,.tgs-mi[data-layout="tablet"] .tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-editor-stage>.tgs-mi-preview{flex:1 1 0;min-height:0}
.tgs-mi[data-layout="phone"] .tgs-mi-stage.edit .tgs-mi-stage-rail,.tgs-mi[data-layout="tablet"] .tgs-mi-stage.edit .tgs-mi-stage-rail{background:var(--mi-bg)}
.tgs-mi[data-layout="wide"] .tgs-mi-stage.edit .tgs-mi-stage-side .tgs-mi-panel{max-height:min(640px,calc(100dvh - 420px))}
/* Wide: редактор помещается в окно (как DaVinci, Premiere, CapCut в браузере) — страница не прокручивается, шапка
   и «Скачать» на месте; средний ряд — остаток окна: кадр 9:16 вписан в него, панель и ряд инструментов
   прокручиваются внутри. Конструктор — свой слой со своей высотой, правило его не трогает (только сцена в обёртке). */
.tgs-mi[data-layout="wide"] .tgs-mi-wrap:has(>.tgs-mi-stage.edit){padding:16px 24px}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit{height:calc(100dvh - 32px);grid-template-rows:auto minmax(0,1fr) auto;align-items:stretch}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-top,.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-bottom{align-self:start}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-center{min-height:0}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-side{min-height:0}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-rail{min-height:0;overflow-y:auto;overscroll-behavior:contain}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-side .tgs-mi-panel{max-height:100%}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-editor-stage{height:100%;min-height:0}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-editor-stage>.tgs-mi-preview{flex:1 1 0;min-height:0}
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-stage-center .tgs-mi-preview-frame{height:100%;min-height:0}
/* Низкое окно: место под ряд инструментов (6 × 66 + отступы ≈ 414) берётся у таймлайна, он прокручивается сам.
   590 = поля 32 + шапка 52 + промежутки 28 + панель действий 54 + ряд 410 + запас; на 910 и выше таймлайн — прежние 320. */
.tgs-mi[data-layout="wide"] .tgs-mi-wrap>.tgs-mi-stage.edit .tgs-mi-tl{height:clamp(200px,calc(100dvh - 590px),320px);min-height:0}
.tgs-mi-topbar-ed{display:flex;align-items:center;gap:4px}
.tgs-mi-topbar-ic{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:12px;background:none;color:var(--mi-ink)}
.tgs-mi-topbar-ic:disabled{opacity:.35}
.tgs-mi-tl-body[hidden]{display:none}
/* Ошибка сборки файла над таймлайном (Р26 §4.2): строка 44 — ⚠, текст 13, справа текстовая «Ещё раз»; без плашки. */
.tgs-mi-errrow{display:flex;align-items:center;gap:12px;min-height:44px;padding-left:4px;color:var(--mi-ink);font-size:var(--fs-ui)}
.tgs-mi-errrow>svg{flex:none;color:var(--mi-warn)}
.tgs-mi-errrow-t{flex:1 1 auto;min-width:0}
.tgs-mi-errrow-b{flex:none;min-height:44px;padding:0 12px;border:0;background:none;color:var(--accent);font:inherit;font-weight:600}
/* Панель «Субтитры» (Р26 §4.2.1): «Aa» поверх кадра ролика на карточке вида; шрифты — строками 44. */
.tgs-mi-capthumb{display:grid;place-items:center;width:100%;height:100%;background:var(--card2) center/cover no-repeat}
.tgs-mi-capthumb .tgs-mi-tile-aa{text-shadow:0 1px 3px rgba(0,0,0,.5)}
.tgs-mi-panel .tgs-mi-fonts{grid-template-columns:minmax(0,1fr);gap:0;max-height:none}
.tgs-mi-panel .tgs-mi-fonttile{place-items:center start;min-height:44px;padding:0 12px;border:0;border-radius:0;background:none;box-shadow:inset 0 -0.5px 0 var(--line)}
.tgs-mi-panel .tgs-mi-fonttile[aria-pressed="true"]{background:rgba(255,255,255,.08);box-shadow:inset 0 -0.5px 0 var(--line)}
/* Кадр исходника (Р26 §6.1). */
.tgs-mi-srcframe{position:relative;overflow:hidden;border-radius:24px;background:var(--card2);aspect-ratio:9/16;width:100%}
.tgs-mi-srcframe-img,.tgs-mi-srcframe-fb{position:absolute;inset:0;width:100%;height:100%}
.tgs-mi-srcframe-img{object-fit:cover;display:block}
.tgs-mi-srcframe-fb{background:linear-gradient(180deg,var(--card2),var(--bg))}
.tgs-mi-srcframe-fb>img{width:100%;height:100%;object-fit:cover;opacity:.25}
.tgs-mi-srcframe[data-look="blur"] .tgs-mi-srcframe-img{filter:blur(24px) brightness(.55);transform:scale(1.15)}
.tgs-mi-srcframe[data-look="gray"] .tgs-mi-srcframe-img{filter:grayscale(1) brightness(.6)}
.tgs-mi-srcframe[data-look="thumb"]{flex:none;width:32px;height:56px;border-radius:6px}
/* Экран сборки (Р26 §4.4): процент по центру рамки, полоса хода 4 px, шаги с точками 8. */
.tgs-mi-pframe{width:min(300px,100%);margin-inline:auto}
.tgs-mi-pframe .tgs-mi-srcframe{border-radius:var(--mi-r-out)}
.tgs-mi[data-layout="phone"] .tgs-mi-pframe{width:min(240px,100%)}
.tgs-mi-ppct{position:absolute;inset:0;display:grid;place-items:center;font-family:'Manrope',system-ui,sans-serif;font-size:var(--fs-section);font-weight:800;color:#fff;font-variant-numeric:tabular-nums}
.tgs-mi-pside{display:flex;flex-direction:column;gap:16px;min-width:0}
.tgs-mi-pbar{height:4px;border-radius:2px;background:var(--line);overflow:hidden}
.tgs-mi-pbar>i{display:block;height:100%;background:var(--accent);transition:width .4s ease}
.tgs-mi-psteps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.tgs-mi-psteps li{display:flex;align-items:center;gap:12px;font-size:var(--fs-ui);color:var(--muted)}
.tgs-mi-psteps li::before{content:'';flex:none;width:8px;height:8px;border-radius:50%;background:var(--line)}
.tgs-mi-psteps li[data-state="done"]{color:var(--mi-ink)}
.tgs-mi-psteps li[data-state="done"]::before{background:var(--ok)}
.tgs-mi-psteps li[data-state="run"]{color:var(--mi-ink)}
.tgs-mi-psteps li[data-state="run"]::before{background:var(--mi-ink);box-shadow:0 0 0 4px rgba(255,255,255,.14);animation:tgs-mi-pulse 1.2s ease-in-out infinite}
.is-still .tgs-mi-psteps li[data-state="run"]::before{animation:none}
.tgs-mi-pnote{margin:0;font-size:var(--fs-meta);color:var(--muted)}
/* «Не получилось» (Р26 §4.5): серый кадр, ⚠ по центру, заголовок 20/700, строка 13. */
.tgs-mi-stage.failed .tgs-mi-stage-center>.tgs-mi-srcframe{width:min(300px,100%)}
.tgs-mi[data-layout="phone"] .tgs-mi-stage.failed .tgs-mi-stage-center>.tgs-mi-srcframe{width:min(220px,100%)}
.tgs-mi-failed-ic{position:absolute;inset:0;display:grid;place-items:center;color:#fff}
.tgs-mi-failed{display:flex;flex-direction:column;gap:16px;width:100%;max-width:520px;text-align:center}
.tgs-mi-failed-h{margin:0;font-size:var(--fs-num);font-weight:700;color:var(--mi-ink)}
.tgs-mi-failed-t{margin:0;font-size:var(--fs-ui);color:var(--muted)}
/* «Ролик готов» (Р26 §4.3): заголовок 20/700, мета 12; «Скачать» со значком внизу. */
.tgs-mi-ready-info{display:flex;flex-direction:column;gap:4px}
.tgs-mi-ready-h{margin:0;font-size:var(--fs-num);font-weight:700;color:var(--mi-ink)}
.tgs-mi-ready-meta{margin:0;font-size:var(--fs-meta);color:var(--muted)}
.tgs-mi-mainbar .tgs-mi-pearl{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%}

/* Р26 §4.6 — главная: колонка (iPad — по центру, ≤ 640), «Файлы · Аватар» над зоной, строки «Пожелания · Стиль ·
   Формат» одной карточкой, «Стили» 20/700 без капса, вкладки полок одной строкой, «Смонтировать» внизу. */
.tgs-mi-home{display:flex;flex-direction:column;gap:24px}
.tgs-mi[data-layout="tablet"] .tgs-mi-home{width:100%;max-width:640px;margin-inline:auto}
.tgs-mi[data-layout="phone"] .tgs-mi-input,.tgs-mi[data-layout="tablet"] .tgs-mi-input{width:100%}
.tgs-mi-input .tgs-mi-rows{border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.03)}
.tgs-mi-input .tgs-mi-rows>.tgs-mi-row,.tgs-mi-input .tgs-mi-rows>.tgs-mi-anchor>.tgs-mi-row{min-height:52px;padding:8px 16px}
.tgs-mi-input .tgs-mi-rows>.tgs-mi-anchor{display:block;position:relative}
.tgs-mi-input .tgs-mi-rows>.tgs-mi-anchor>.tgs-mi-row{border-bottom:0}
.tgs-mi-input .tgs-mi-rows>.tgs-mi-wish{padding:12px 16px 12px;border-bottom:.5px solid var(--line)}
.tgs-mi-input .tgs-mi-wish-l{margin-bottom:2px}
.tgs-mi-input .tgs-mi-wish textarea{font-size:var(--fs-lead)}
.tgs-mi-gal>.tgs-mi-galh{justify-content:space-between}
.tgs-mi-gal>.tgs-mi-tabs2{margin:4px -12px;padding-inline:0}
.tgs-mi-head>.tgs-mi-title{flex:1 1 auto;min-width:0}
.tgs-mi[data-layout="phone"] .tgs-mi-title,.tgs-mi[data-layout="tablet"] .tgs-mi-title{font-size:var(--fs-num);font-weight:700;letter-spacing:-.01em}
.tgs-mi[data-layout="phone"] .tgs-mi-row-cards{scroll-padding-inline:16px}
.tgs-mi[data-layout="tablet"] .tgs-mi-head{width:100%;max-width:640px;margin-inline:auto}
/* Р26 §4.6 — панели главной: «Стили» (полки, «Популярные · Новые» у сообщества, сетка карточек), «Формат», «Библиотека». */
.tgs-mi-panel .tgs-mi-tabs2{margin:0 -12px 8px}
.tgs-mi-catalog{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px 12px;padding-bottom:16px}
.tgs-mi-catalog>[data-card]{width:auto}
.tgs-mi-catalog .tgs-mi-pv{position:relative;aspect-ratio:9/16;border-radius:18px;overflow:hidden}
.tgs-mi-catalog .tgs-mi-pv:not(.add){display:block;background:#212124}
.tgs-mi-catalog .tgs-mi-sc.on .tgs-mi-pv{box-shadow:0 0 0 2px var(--mi-bg),0 0 0 3px rgba(242,241,238,.85)}
.tgs-mi-params{display:flex;flex-direction:column;gap:12px;padding-bottom:16px}
.tgs-mi-params .tgs-mi-rows{margin-top:8px}
.tgs-mi-libpanel{display:flex;flex-direction:column;gap:12px;padding-bottom:16px}
.tgs-mi-libbody{display:flex;flex-direction:column;gap:16px}
.tgs-mi-libfoot{display:flex;flex-wrap:wrap;align-items:center;gap:12px 16px;padding-top:12px;border-top:1px solid var(--mi-plate-edge)}
.tgs-mi-panel-r>.tgs-mi-pearl{margin-inline-end:8px}
/* Р26 §4.6 — главная на широком экране: форма 460 слева, пример стиля 9:16 справа; колонка — место панелей. */
.tgs-mi[data-layout="wide"] .tgs-mi-home{width:100%;max-width:1280px;margin-inline:auto}
/* Обёртка (1060 — ширина экранов ролика) не режет главную: сетка формы и примера — до 1280 (планка 6). */
.tgs-mi[data-layout="wide"] .tgs-mi-wrap:has(>.tgs-mi-home){max-width:1280px}
.tgs-mi[data-layout="wide"] .tgs-mi-homegrid{display:grid;grid-template-columns:460px 1fr;gap:32px;align-items:start}
.tgs-mi[data-layout="wide"] .tgs-mi-input{width:460px}
.tgs-mi-homeside{min-width:0;display:flex;flex-direction:column;align-items:center}
.tgs-mi-homeslot{width:100%}
.tgs-mi-homeslot:empty{display:none}
.tgs-mi-homeslot:not(:empty)+.tgs-mi-example{display:none}
.tgs-mi-example{margin:0;display:flex;flex-direction:column;align-items:center;gap:12px}
.tgs-mi-example-v{height:min(70vh,640px);aspect-ratio:9/16;border-radius:20px;overflow:hidden;background:#141416;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.tgs-mi-example-v>video,.tgs-mi-example-v>img{width:100%;height:100%;object-fit:cover;display:block}
.tgs-mi-example figcaption{color:var(--muted)}
.tgs-mi-galh>.tgs-mi-link{color:var(--muted);text-decoration:none}
/* Р26 §3.9 — окно генерации: единственное окно по центру, кроме окна-вопроса; свой класс вместо листа. */
.tgs-mi-modal-scrim{position:fixed;inset:0;z-index:70;display:flex;background:var(--mi-scrim)}
.tgs-mi-modal-scrim[hidden]{display:none}
.tgs-mi-modal{position:relative;margin:auto;width:min(720px,calc(100% - 32px));max-height:calc(100% - 48px);display:flex;flex-direction:column;background:var(--mi-plate-solid);border:1px solid var(--mi-plate-edge);border-radius:var(--mi-r-out);box-shadow:var(--mi-plate-sh);color:var(--mi-ink);outline:none}
.tgs-mi-modal-h{display:flex;align-items:center;gap:12px;padding:16px 16px 8px}
.tgs-mi-modal-h .tgs-mi-ibtn{margin-left:auto}
/* «Проверить текст» до сборки (спека дублей §6.2.3): широкий — превью слева, текст справа; телефон — только текст. */
.tgs-mi-review{width:min(960px,calc(100% - 32px))}
.tgs-mi-review-b{display:flex;gap:16px;min-height:0;overflow:hidden;padding:0 16px}
.tgs-mi-review-pv{flex:0 0 280px}
.tgs-mi-review-t{flex:1;min-width:0;overflow-y:auto;display:flex;flex-direction:column;gap:12px}
.tgs-mi-review-f{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding:12px 16px 16px;flex-wrap:wrap}
.tgs-mi-review-f>span{margin-right:auto;color:var(--mi-ink-2)}
[data-layout="phone"] .tgs-mi-review-pv{display:none}
/* Р26 §4.9 — низ панели «Поделиться стилем» и жалобы: действие справа, вторичное слева. */
.tgs-mi-panel-foot{position:sticky;bottom:0;display:flex;align-items:center;gap:12px;padding:12px 0 calc(12px + env(safe-area-inset-bottom));background:var(--mi-plate-solid)}
.tgs-mi-panel-foot>:last-child{margin-left:auto}
/* Зона касания 44 у мелких кнопок «Монтажа» (Р26 §7): видимый размер прежний, касание расширяет прозрачный ::after.
   :where — без веса: кнопка со своим position (absolute у значков на карточке) его сохраняет. Ручки таймлайна,
   ромб стыка и ползунок не здесь: у них свои зоны pointer:coarse. */
:where(.tgs-mi-ibtn,.tgs-mi-play,.tgs-mi-track-i,.tgs-mi-link,.tgs-mi-rm,.tgs-mi-star,.tgs-mi-snd,.tgs-mi-scmore,.tgs-mi-tune,.tgs-mi-wishes,.tgs-mi-chipx button,.tgs-mi-ref,.tgs-mi-kdetails,.tgs-mi-fontcur,.tgs-mi-role,.tgs-mi-owncolor,.tgs-mi-swatch,.tgs-mi-fxc,.tgs-mi-lane-add,.tgs-mi-pub-chip,.tgs-mi-pub-add,.tgs-mi-more,.tgs-mi-gap,.tgs-mi-pwish-hint,.tgs-mi-pwish-chip){position:relative}
.tgs-mi-ibtn::after,.tgs-mi-play::after,.tgs-mi-track-i::after,.tgs-mi-link::after,.tgs-mi-rm::after,.tgs-mi-star::after,.tgs-mi-snd::after,.tgs-mi-scmore::after,.tgs-mi-tune::after,.tgs-mi-wishes::after,.tgs-mi-chipx button::after,.tgs-mi-ref::after,.tgs-mi-kdetails::after,.tgs-mi-fontcur::after,.tgs-mi-role::after,.tgs-mi-owncolor::after,.tgs-mi-swatch::after,.tgs-mi-fxc::after,.tgs-mi-lane-add::after,.tgs-mi-pub-chip::after,.tgs-mi-pub-add::after,.tgs-mi-more::after,.tgs-mi-gap::after,.tgs-mi-pwish-hint::after,.tgs-mi-pwish-chip::after,.tgs-mi-rt::after{content:"";position:absolute;inset:min(0px, (100% - 44px) / 2)}
/* Окно пожеланий к «Другому варианту» подписи (SPEC-montage-post-rewrite §2): стекло — общий .vsheet (как у карточки
   подписи и строки агента), здесь только раскладка. На wide — окно по центру шириной карточки подписи (≤ 640). */
.tgs-mi[data-layout="wide"] .tgs-mi-panel[data-panel="post-wish"]{top:50%;left:50%;right:auto;bottom:auto;border:0;width:min(520px,calc(100% - 32px));max-height:min(560px,calc(100dvh - 64px));border-radius:24px;transform:translate(-50%,-46%);opacity:0;transition:transform 240ms cubic-bezier(.32,.72,0,1),opacity 200ms ease,height 280ms cubic-bezier(.32,.72,0,1)}
.tgs-mi[data-layout="wide"] .tgs-mi-panel[data-panel="post-wish"].is-shown{transform:translate(-50%,-50%);opacity:1}
.tgs-mi-pwish{display:flex;flex-direction:column;gap:12px}
.tgs-mi-pwish-box{position:relative;display:flex;flex-direction:column;gap:4px}
.tgs-mi-pwish-field{width:100%;min-height:44px;max-height:calc(4 * 1.45em + 24px);padding:12px;border:1px solid var(--line);border-radius:14px;background:transparent;color:var(--mi-ink);line-height:1.45;resize:none;overflow-y:auto}
.tgs-mi-pwish-field:focus{outline:none;border-color:var(--mi-plate-edge)}
.tgs-mi-pwish-count{align-self:flex-end;color:var(--muted)}
.tgs-mi-pwish-hints{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px;margin-block:-4px;padding-block:4px;scroll-padding-inline:16px}
.tgs-mi-pwish-hints::-webkit-scrollbar{display:none}
.tgs-mi-pwish-hint{flex:none;min-height:36px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:none;color:var(--mi-ink);white-space:nowrap}
.tgs-mi-pwish-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.tgs-mi-pwish-tools{display:flex;align-items:center;gap:4px;min-width:0}
.tgs-mi-pearl.tgs-mi-pwish-send:not([data-reason]){min-width:36px;padding:0 8px;border-radius:999px;justify-content:center}
.tgs-mi-pwish-send:not([data-reason]) svg[data-icon="arrow"]{transform:rotate(-90deg)}
@media (prefers-reduced-motion:reduce){.tgs-mi[data-layout="wide"] .tgs-mi-panel[data-panel="post-wish"]{transition:none}}
.tgs-mi-pwish-chip{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:none;color:var(--mi-ink);white-space:nowrap;max-width:100%}
.tgs-mi-pwish-name{min-width:0;overflow:hidden;text-overflow:ellipsis}
.tgs-mi-pwish-chip[aria-expanded="true"] svg[data-icon="chev"]{transform:rotate(180deg)}
.tgs-mi-pwish-models{display:flex;flex-direction:column;gap:2px}
.tgs-mi-pwish-model{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;padding:8px 12px;border:0;border-radius:12px;background:none;color:var(--mi-ink);text-align:left}
.tgs-mi-pwish-model[aria-selected="true"]{background:rgba(255,255,255,.08)}
.tgs-mi-pwish-model-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.tgs-mi-pwish-model-t>.fs-meta,.tgs-mi-pwish-model-p{color:var(--muted)}
.tgs-mi-pwish-model-p{flex:none}
.tgs-mi-pwish-why{margin:0;text-align:right}
/* «Оформление» (спека «Оформление» §6.1): превью ≥ 40 % высоты листа, лента наборов, круги цвета, размер, тонкие настройки */
.tgs-mi-row-note{margin:0;padding:12px 16px;color:var(--mi-ink-3)}
.tgs-mi-oform{display:flex;flex-direction:column;gap:16px;padding-bottom:12px}
.tgs-mi-oform-preview{min-height:40vh;border-radius:var(--mi-r-in);background:#101012;overflow:hidden;position:relative}
.tgs-mi-oform-pv{position:absolute;inset:0;container-type:inline-size;display:flex;align-items:flex-end;justify-content:center;padding:0 0 16%}
.tgs-mi-oform-pv>img,.tgs-mi-oform-pv>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tgs-mi-oform-pv-text{position:relative;margin:0;color:#fff;text-align:center;line-height:1.1;text-wrap:balance}
.tgs-mi-oform-pv-skel{position:relative;width:70%;height:2.4em;border-radius:10px;background:rgba(255,255,255,.18)}
@media (prefers-reduced-motion:no-preference){.tgs-mi-oform-pv-skel{animation:tgs-mi-oform-pulse 1.2s ease-in-out infinite alternate}}
@keyframes tgs-mi-oform-pulse{from{opacity:.55}to{opacity:1}}
.tgs-mi-oform-pv-fail{position:relative;margin:0;padding:8px 16px;border-radius:12px;background:rgba(0,0,0,.6);color:#fff}
.tgs-mi-oform-pv-fail>button{min-height:44px;background:none;border:0;padding:0 4px;color:inherit;font:inherit;text-decoration:underline;cursor:pointer}
.tgs-mi-oform-sec{display:flex;flex-direction:column;gap:12px}
.tgs-mi-oform-head{display:flex;align-items:center;gap:12px}
.tgs-mi-oform-h{margin:0;flex:1;color:var(--mi-ink-2);font-weight:600}
.tgs-mi-oform-link{min-height:44px;padding:0 4px;background:none;border:0;color:var(--mi-ink);font:inherit;cursor:pointer}
.tgs-mi-oform-card{position:relative;flex:none;scroll-snap-align:start;width:132px;min-height:112px;display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:12px;border-radius:14px;background:var(--mi-lac);border:1.5px solid var(--mi-plate-edge);color:var(--mi-ink);text-align:left;cursor:pointer}
.tgs-mi-oform-card[aria-pressed="true"]{border-color:var(--mi-hi)}
.tgs-mi-oform-sample{display:flex;flex-direction:column;gap:2px;line-height:1.05}
.tgs-mi-oform-sample>span:first-child{font-size:var(--fs-num)}
.tgs-mi-oform-sample>span:nth-child(2){font-size:var(--fs-num)}
.tgs-mi-oform-sample>span:last-child{font-size:var(--fs-body)}
.tgs-mi-oform-name{color:var(--mi-ink-2);margin-top:auto}
.tgs-mi-oform-check{position:absolute;top:8px;right:8px;width:20px;height:20px;border-radius:50%;background:var(--mi-hi);color:var(--mi-pearl-ink);display:grid;place-items:center}
.tgs-mi-oform-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.tgs-mi-oform-grid .tgs-mi-oform-card{width:auto}
.tgs-mi-oform-dots{display:flex;flex-wrap:wrap;gap:8px}
.tgs-mi-oform-dot{width:44px;height:44px;border-radius:50%;border:2px solid transparent;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);cursor:pointer;padding:0}
.tgs-mi-oform-dot[aria-pressed="true"]{border-color:var(--mi-hi);box-shadow:inset 0 0 0 3px var(--mi-bg)}
.tgs-mi-oform-dot.add{background:var(--mi-lac);color:var(--mi-ink);font-size:var(--fs-num)}
.tgs-mi-oform-own{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tgs-mi-oform-swatch{width:44px;height:44px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
.tgs-mi-oform-slider{display:flex;align-items:center;gap:8px;flex:1 1 100%;color:var(--mi-ink-2)}
.tgs-mi-oform-slider input{flex:1;min-height:44px;accent-color:var(--mi-hi)}
.tgs-mi-oform-bad{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;color:var(--mi-ink-2)}
.tgs-mi-oform-own input{flex:1;min-height:44px;border-radius:12px;border:1px solid var(--mi-plate-edge);background:var(--mi-track);color:var(--mi-ink);padding:0 12px;font:inherit}
.tgs-mi-oform-seg{display:flex;gap:8px;flex-wrap:wrap}
.tgs-mi-oform-seg>button{flex:1;min-height:44px;border-radius:12px;border:1px solid var(--mi-plate-edge);background:var(--mi-lac);color:var(--mi-ink-2);font:inherit;cursor:pointer}
.tgs-mi-oform-seg>button[aria-pressed="true"]{background:var(--mi-sel);color:var(--mi-ink);border-color:var(--mi-hi)}
.tgs-mi-oform-seg>button:disabled{opacity:.4;cursor:not-allowed}
.tgs-mi-oform-fine{min-height:44px;text-align:left;background:none;border:0;color:var(--mi-ink);font:inherit;cursor:pointer;padding:0}
.tgs-mi-oform-fine::after{content:" ›";color:var(--mi-ink-3)}
.tgs-mi-oform-fine[aria-expanded="true"]::after{content:" ⌄"}
.tgs-mi-oform-font{display:flex;align-items:center;gap:12px;min-height:44px}
.tgs-mi-oform-font>span{width:84px;color:var(--mi-ink-2)}
.tgs-mi-oform-font select{flex:1;min-height:44px;border-radius:12px;border:1px solid var(--mi-plate-edge);background:var(--mi-track);color:var(--mi-ink);padding:0 12px}
.tgs-mi-oform-done{min-height:52px;border-radius:16px;border:0;background:var(--mi-pearl);box-shadow:var(--mi-pearl-sh);color:var(--mi-pearl-ink);font:inherit;font-weight:600;cursor:pointer}
@media (prefers-reduced-motion:reduce){.tgs-mi-oform-card,.tgs-mi-oform-dot{transition:none}}
/* живой плеер заголовков и рамки текста на кадре (заголовки CapCut §3.5–3.6) */
.tgs-mi-liveplayer{position:absolute;inset:0}
.tgs-mi-tlayer{position:absolute;inset:0;z-index:1;pointer-events:none}
.tgs-mi-tf{position:absolute;box-sizing:border-box;pointer-events:auto;touch-action:none;cursor:move;border-radius:4px}
.tgs-mi-tf:hover{box-shadow:0 0 0 1px rgba(255,255,255,.5)}
.tgs-mi-tf[aria-selected="true"]{box-shadow:0 0 0 1.5px #fff,0 0 0 2.5px rgba(0,0,0,.35)}
.tgs-mi-tf-h{position:absolute;display:grid;place-items:center;width:44px;height:44px;margin:-22px;padding:0;border:0;background:none;color:#111;cursor:pointer;touch-action:none}
.tgs-mi-tf-h span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.4);line-height:1}
/* ручки — снаружи углов (как в CapCut): зона 44 заходит на текст только на 12 px, середина маленькой рамки свободна */
.tgs-mi-tf-h[data-h="del"]{left:0;top:0;transform:translate(-10px,-10px)}
.tgs-mi-tf-h[data-h="edit"]{right:0;top:0;transform:translate(10px,-10px)}
.tgs-mi-tf-h[data-h="dup"]{left:0;bottom:0;transform:translate(-10px,10px)}
.tgs-mi-tf-h[data-h="rot"]{right:0;bottom:0;transform:translate(10px,10px);cursor:grab}
/* мелкий текст: зона нажатия рамки не меньше 44 × 44 */
.tgs-mi-tf::after{content:"";position:absolute;inset:min(0px, (100% - 44px) / 2)}
.tgs-mi-tf-h:focus-visible span{outline:2px solid var(--mi-sel);outline-offset:1px}
.tgs-mi-tf-in{position:absolute;inset:0;box-sizing:border-box;width:100%;min-height:100%;padding:8px;border:0;border-radius:4px;background:rgba(0,0,0,.55);color:#fff;text-align:center;resize:none;outline:2px solid #fff;touch-action:auto}
.tgs-mi-tf[data-unsafe]{box-shadow:0 0 0 1.5px #FFB020}
.tgs-mi-tlayer-safe{position:absolute;border:1px dashed rgba(255,255,255,.45);border-radius:4px;pointer-events:none}
.tgs-mi-tlayer-guide{position:absolute;pointer-events:none;background:#FF3DA8}
.tgs-mi-tlayer-guide[data-dir="v"]{top:0;bottom:0;width:1px}
.tgs-mi-tlayer-guide[data-dir="h"]{left:0;right:0;height:1px}
/* панель «Текст» конструктора и редактора (заголовки во всех путях §3.2): заголовки стиля, хук, свои тексты */
.tgs-mi-tt{display:flex;flex-direction:column;gap:12px}
.tgs-mi-tt-hook{display:flex;flex-direction:column;gap:8px;padding-bottom:12px;border-bottom:.5px solid var(--line)}
.tgs-mi-tt-h{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--mi-ink-2)}
.tgs-mi-tt-reset,.tgs-mi-tt-back{min-height:44px;padding:0;border:0;background:none;color:var(--mi-hi-tx);font:inherit;font-weight:600;cursor:pointer}
.tgs-mi-tt-back{align-self:flex-start}
.tgs-mi-tt-style[data-step]{display:flex;flex-direction:column;gap:12px}
.tgs-mi-tt-add{flex-direction:column;align-items:flex-start;gap:4px}
.tgs-mi-tt-own{display:flex;flex-direction:column;margin:0;padding:0;list-style:none}
.tgs-mi-tt-own li{display:flex;align-items:center;gap:8px;border-bottom:.5px solid var(--line)}
.tgs-mi-tt-own-t{flex:1;min-width:0;min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0;border:0;background:none;color:var(--mi-ink);font:inherit;text-align:left;cursor:pointer}
.tgs-mi-tt-own-t .fs-meta{flex:none;color:var(--mi-ink-3);font-variant-numeric:tabular-nums}
.tgs-mi-tt-own-x{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tgs-mi-tt-own-del{display:grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border:0;border-radius:12px;background:none;color:var(--mi-ink-2);cursor:pointer}
.tgs-mi-tt-own-del:hover{background:var(--mi-sel);color:var(--mi-ink)}
/* «Придумать хук»: три карточки вариантов, серые полосы на время ответа, поле своего хука */
.tgs-mi-hooks{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.tgs-mi-hooks-list{display:flex;flex-direction:column;gap:8px;align-self:stretch}
.tgs-mi-hooks-card{min-height:52px;padding:12px 16px;border:1px solid var(--mi-track-edge);border-radius:12px;background:var(--mi-track);color:var(--mi-ink);font-family:inherit;line-height:1.35;text-align:left;cursor:pointer;transition:border-color .15s,background .15s}
.tgs-mi-hooks-card:hover{border-color:rgba(255,255,255,.18)}
.tgs-mi-hooks-card[aria-pressed="true"]{border-color:var(--mi-hi);background:var(--mi-sel)}
.tgs-mi-hooks-sk{height:52px;border-radius:12px;background:linear-gradient(90deg,var(--mi-track) 0%,rgba(255,255,255,.06) 50%,var(--mi-track) 100%);background-size:200% 100%;animation:tgs-mi-hooks-sk 1.2s linear infinite}
@keyframes tgs-mi-hooks-sk{from{background-position:100% 0}to{background-position:-100% 0}}
.tgs-mi-hooks .tgs-mi-inp{align-self:stretch}
@media (prefers-reduced-motion:reduce){.tgs-mi-hooks-sk{animation:none}.tgs-mi-hooks-card{transition:none}}
/* «Сохранить стиль» в шапке конструктора — вторая кнопка рядом с «Готово»: та же высота, что у компактной главной (36), узкие поля, чтобы имя стиля помещалось на телефоне. Зона касания 44 — как у компактной главной. */
.tgs-mi-lac.tgs-mi-savemine{position:relative;min-height:0;height:36px;padding:0 12px}
.tgs-mi-lac.tgs-mi-savemine::after{content:"";position:absolute;inset:-4px 0}
/* Окно-предупреждение (ui/Notice): флажок «Больше не показывать» и одна кнопка «Понятно» на всю ширину. */
.tgs-mi-notice-never{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;margin-top:8px;color:var(--muted);cursor:pointer}
.tgs-mi-notice-never input{width:18px;height:18px;margin:0;accent-color:var(--mi-ink)}
.tgs-mi-ask-f.tgs-mi-notice-f{grid-template-columns:1fr;margin-top:8px}
.tgs-mi-ask-inp{display:block;margin-top:16px;text-align:left}
/* Стекло «Монтажа» — одно на всю вкладку, как строка агента на главной (founder 28.10): пластина --plate, кромка
   --plate-line, тень --plate-sh, размытие 20 px. Токены --mi-plate* переведены на него же, поэтому .tgs-mi-plate и
   всё, что их берёт, — то же стекло. Список поверхностей — ниже, одним правилом: окна, меню «⋯», выезжающие панели
   (колонка на широком экране, data-mode="slot", фона не имеет), блок «Стиль · Формат», плашки-подсказки, строки
   «словами» и чата, таймлайн, окно текста на превью. Поля ввода — стеклянные, как кнопки .gb. Мелкие элементы
   управления (переключатели, полоски, миниатюры, кадр видео) — не поверхности, их не трогаем. Меньше прозрачности
   (.is-solid) — всё сплошное. */
.tgs-mi{--mi-plate:var(--plate);--mi-plate-blur:blur(20px) saturate(180%);--mi-plate-edge:var(--plate-line);--mi-glass-sh:var(--plate-sh),0 40px 90px rgba(0,0,0,.45)}
.tgs-mi-ask-scrim{background:rgba(0,0,0,.36)}
.tgs-mi .tgs-mi-ask,.tgs-mi .tgs-mi-modal,.tgs-mi .tgs-mi-menu3,.tgs-mi .tgs-mi-panel:not(.vsheet):not([data-mode="slot"]),
.tgs-mi .tgs-mi-input .tgs-mi-rows,.tgs-mi .tgs-mi-banner,.tgs-mi .tgs-mi-understood,.tgs-mi .tgs-mi-tprev,.tgs-mi .tgs-mi-lock,.tgs-mi .tgs-mi-pubst,
.tgs-mi .tgs-mi-wordsbox,.tgs-mi .tgs-mi-chatbox,.tgs-mi .tgs-mi-chatrow,.tgs-mi .tgs-mi-msg.ai,.tgs-mi .tgs-mi-tl,.tgs-mi .tgs-mi-inframe,
.tgs-mi[data-layout="phone"] .tgs-mi-hl-settings{background-color:var(--plate);border:1px solid var(--plate-line);backdrop-filter:var(--mi-plate-blur);-webkit-backdrop-filter:var(--mi-plate-blur)}
.tgs-mi .tgs-mi-ask,.tgs-mi .tgs-mi-modal,.tgs-mi .tgs-mi-menu3,.tgs-mi .tgs-mi-panel:not(.vsheet):not([data-mode="slot"]),.tgs-mi[data-layout="phone"] .tgs-mi-hl-settings{box-shadow:var(--mi-glass-sh)}
.tgs-mi .tgs-mi-wordsbox,.tgs-mi .tgs-mi-chatbox,.tgs-mi .tgs-mi-chatrow,.tgs-mi .tgs-mi-tl,.tgs-mi .tgs-mi-input .tgs-mi-rows{box-shadow:var(--plate-sh)}
.tgs-mi .tgs-mi-panel:not(.vsheet):not([data-mode="slot"]),.tgs-mi[data-layout="phone"] .tgs-mi-hl-settings{border-bottom:0}
/* Общее стекло платформы (.vsheet: карточка поста, окно пожеланий) внутри «Монтажа» — с тем же размытием. */
.tgs-mi .vsheet{backdrop-filter:var(--mi-plate-blur);-webkit-backdrop-filter:var(--mi-plate-blur)}
/* Плашки-подсказки: стекло + оттенок смысла (предупреждение, ошибка) поверх него. */
.tgs-mi .tgs-mi-banner.i{background-image:none}
.tgs-mi .tgs-mi-banner.w{background-image:linear-gradient(rgba(255,159,67,.10),rgba(255,159,67,.10))}
.tgs-mi .tgs-mi-banner.e{background-image:linear-gradient(rgba(255,107,158,.10),rgba(255,107,158,.10))}
/* Липкие части внутри стекла (низ панели с кнопками, заголовки дорожек) — то же стекло, чтобы под ними не читалось содержимое. */
.tgs-mi .tgs-mi-panel:not([data-mode="slot"]) .tgs-mi-panel-foot,.tgs-mi .tgs-mi-lane-h{background:var(--plate);backdrop-filter:var(--mi-plate-blur);-webkit-backdrop-filter:var(--mi-plate-blur)}
/* Поля ввода — стеклянные, как кнопки .gb; фокус — светлая кромка. */
.tgs-mi .tgs-mi-inp{background:var(--gb);border:1px solid var(--gb-line);backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%)}
.tgs-mi .tgs-mi-inp:focus{border-color:var(--gb-lh)}
.tgs-mi .tgs-mi-ask-f button{background:var(--gb);border:1px solid var(--gb-line);transition:background .18s ease,border-color .18s ease}
.tgs-mi .tgs-mi-ask-f button:hover{background:var(--gb-h);border-color:var(--gb-lh)}
.tgs-mi.is-solid .tgs-mi-ask,.tgs-mi.is-solid .tgs-mi-modal,.tgs-mi.is-solid .tgs-mi-menu3,.tgs-mi.is-solid .tgs-mi-panel:not(.vsheet):not([data-mode="slot"]),
.tgs-mi.is-solid .tgs-mi-input .tgs-mi-rows,.tgs-mi.is-solid .tgs-mi-banner,.tgs-mi.is-solid .tgs-mi-understood,.tgs-mi.is-solid .tgs-mi-tprev,.tgs-mi.is-solid .tgs-mi-lock,.tgs-mi.is-solid .tgs-mi-pubst,
.tgs-mi.is-solid .tgs-mi-wordsbox,.tgs-mi.is-solid .tgs-mi-chatbox,.tgs-mi.is-solid .tgs-mi-chatrow,.tgs-mi.is-solid .tgs-mi-msg.ai,.tgs-mi.is-solid .tgs-mi-tl,.tgs-mi.is-solid .tgs-mi-inframe,
.tgs-mi.is-solid[data-layout="phone"] .tgs-mi-hl-settings,.tgs-mi.is-solid .tgs-mi-panel:not([data-mode="slot"]) .tgs-mi-panel-foot,.tgs-mi.is-solid .tgs-mi-lane-h,.tgs-mi.is-solid .tgs-mi-inp{background-color:var(--mi-plate-solid);backdrop-filter:none;-webkit-backdrop-filter:none}
/* Цвет дорожки по типу клипа (founder 28.10: как у CapCut, Captions, Final Cut — по цвету видно, где что):
   звук — зелёный (у всех редакторов), текст — оранжевый (CapCut), субтитры — фиолетовый (Captions), эффекты —
   малиновый (CapCut: эффекты в фиолетово-розовой гамме, отличаем от субтитров), вставки — бирюзовый (наш SPEC-ux-premium).
   Видео — миниатюры кадров без заливки. Клип — заливка цвета дорожки 30 % по тёмному + кромка 55 %, подпись белая;
   значки дорожек слева однотонные, как у CapCut и Premiere (founder 28.10). Жёлтый акцент (#FFBC00) и белая рамка выбора остаются за выбором. */
.tgs-mi-lane[data-lane=texts]{--lane:#FF8A3D}
.tgs-mi-lane[data-lane=captions]{--lane:#9B8CFF}
.tgs-mi-lane[data-lane=effects]{--lane:#E35BC8}
.tgs-mi-lane[data-lane=inserts]{--lane:#2EC4B6}
.tgs-mi-lane[data-lane=sound]{--lane:#3DBE7A}
.tgs-mi-lane[data-lane]:not([data-lane=video]) .tgs-mi-el{background:color-mix(in srgb,var(--lane,#888) 30%,#141416);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--lane,#888) 55%,transparent)}
.tgs-mi-lane[data-lane]:not([data-lane=video]) .tgs-mi-el .tgs-mi-el-l{color:var(--mi-ink)}
.tgs-mi-lane[data-lane]:not([data-lane=video]) .tgs-mi-el[aria-selected="true"]{box-shadow:inset 0 0 0 2px var(--mi-ink)}
.tgs-mi.is-solid .tgs-mi-lane[data-lane]:not([data-lane=video]) .tgs-mi-el{background:color-mix(in srgb,var(--lane,#888) 34%,#141416)}
.tgs-mi-lane[data-lane]:not([data-lane=video]) .tgs-mi-el.is-skipped{background:repeating-linear-gradient(135deg,transparent 0 4px,rgba(255,255,255,.08) 4px 8px),color-mix(in srgb,var(--lane,#888) 18%,#141416)}
/* Чат правок (спека чата §10.1, план 4а В8а): история над полем, поле с 🎤, «Пометить» и стрелкой; очередь — серым. */
.tgs-mi-chat{display:flex;flex-direction:column;gap:12px;min-width:0;text-align:left}
.tgs-mi-chat-hist{display:flex;flex-direction:column;gap:8px;min-width:0}
.tgs-mi-chat-turns,.tgs-mi-chat-queue,.tgs-mi-chat-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.tgs-mi-chat-steps{gap:2px;color:var(--mi-ink-2)}
.tgs-mi-chat-turn{display:flex;flex-direction:column;gap:8px}
.tgs-mi-chat-me{align-self:flex-end;max-width:85%;padding:8px 12px;border-radius:14px 14px 4px 14px;background:var(--gb);border:1px solid var(--gb-line);overflow-wrap:anywhere}
.tgs-mi-chat-me p,.tgs-mi-chat-ai p{margin:0}
.tgs-mi-chat-ai{display:flex;flex-direction:column;gap:8px;max-width:92%;overflow-wrap:anywhere}
.tgs-mi-chat-row{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.tgs-mi-chat-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tgs-mi-chat-chip{display:inline-flex;align-items:center;gap:4px;min-height:28px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:none;color:var(--mi-ink);white-space:nowrap}
.tgs-mi-chat-chip.change{cursor:pointer}
.tgs-mi-chat-chip.change:disabled{opacity:.5;cursor:default}
.tgs-mi-chat-btn{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:none;color:var(--mi-ink)}
.tgs-mi-chat-tool,.tgs-mi-chat-x{flex:none;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:none;color:var(--mi-ink-2)}
.tgs-mi-chat-x{width:24px;height:24px;margin-right:-6px;position:relative}
.tgs-mi-chat-x::after{content:"";position:absolute;inset:-10px}
.tgs-mi-chat-tool.on{background:var(--mi-sel);color:var(--mi-ink)}
.tgs-mi-chat-ask{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.tgs-mi-chat-opt{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:4px 16px;border:1px solid var(--line);border-radius:12px;background:none;color:var(--mi-ink)}
.tgs-mi-chat-opt img{border-radius:6px;object-fit:cover}
.tgs-mi-chat-plan{display:flex;flex-direction:column;gap:8px}
.tgs-mi-chat-note{display:flex;gap:8px;align-items:center}
.tgs-mi-chat-queued{display:flex;align-items:center;justify-content:space-between;gap:8px;align-self:flex-end;max-width:85%;padding:4px 4px 4px 12px;border:1px dashed var(--line);border-radius:14px;color:var(--mi-ink-2)}
.tgs-mi-chat-field{display:flex;flex-direction:column;gap:8px}
.tgs-mi-chat-box{display:flex;align-items:flex-end;gap:4px;padding:4px 4px 4px 12px;border:1px solid var(--line);border-radius:22px}
.tgs-mi-chat-box:focus-within{border-color:var(--mi-plate-edge)}
.tgs-mi-chat-input{flex:1;min-width:0;min-height:44px;max-height:calc(4 * 1.45em + 24px);padding:12px 0;border:0;background:transparent;color:var(--mi-ink);line-height:1.45;resize:none;overflow-y:auto}
.tgs-mi-chat-note .tgs-mi-chat-input,.tgs-mi-chat-queued .tgs-mi-chat-input{padding:0 12px;border:1px solid var(--line);border-radius:12px}
.tgs-mi-chat-input:focus{outline:none}
.tgs-mi-chat-tools{display:flex;align-items:center;gap:2px}
.tgs-mi-chat-send{flex:none;display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--mi-pearl);box-shadow:var(--mi-pearl-sh);color:var(--mi-pearl-ink)}
.tgs-mi-chat-send[data-empty]{background:var(--gb);box-shadow:none;color:var(--mi-ink-2)}
.tgs-mi-chat-vers{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.tgs-mi-chat-vlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;align-self:stretch}
.tgs-mi-chat-ver{display:flex;align-items:center;gap:8px;justify-content:space-between}
.tgs-mi-chat-ver img{border-radius:6px;object-fit:cover}
.tgs-mi-chat-ver>span{flex:1;min-width:0}
/* Телефон: вся история чата — лист снизу ≤ 50 % высоты экрана, плеер над ним виден (спека чата §10.1). */
.tgs-mi-chat-sheet{position:fixed;left:0;right:0;bottom:0;z-index:40;max-height:50dvh;overflow-y:auto;overscroll-behavior:contain;
  padding:12px 16px calc(16px + env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:var(--mi-plate-solid);border:1px solid var(--mi-plate-edge);border-bottom:0;
  display:flex;flex-direction:column;gap:12px}
.tgs-mi-chat-sheet-h{position:sticky;top:-12px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 0;background:var(--mi-plate-solid)}
.tgs-mi-chat-chip.change{position:relative}
.tgs-mi-chat-chip.change::after{content:"";position:absolute;inset:min(0px, (100% - 44px) / 2)}
.tgs-mi-chat-hist>.tgs-mi-link{align-self:flex-start}
.tgs-mi-newfx{display:flex;flex-direction:column;gap:8px;padding:12px;border:1px solid var(--line);border-radius:14px}
.tgs-mi-newfx-h{margin:0;color:var(--mi-ink)}
.tgs-mi-newfx-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tgs-mi-newfx-fix{display:flex;flex-direction:column;gap:8px}
.tgs-mi-newfx-fix textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:56px;padding:12px;border:1px solid var(--line);border-radius:12px;background:transparent;color:var(--mi-ink)}