/* TheatreAI — mobile polish layer (progressive, не ломает desktop) */

@media (max-width: 768px) {
  .gm-settings summary { min-height: 46px !important; }
  .gm-settings summary > small { max-width: 60% !important; }
  .gm-settings-body .gm-opt { align-items: flex-start !important; flex-direction: column !important; }
  .gm-settings-body .gm-seg { width: 100% !important; overflow-x: auto !important; scrollbar-width: none; }
  .gm-settings-body .gm-seg button { flex: 1 0 auto !important; min-height: 40px !important; }
  .gm-drop-compact { min-height: 70px !important; }
  .gm-drop-t small { font-size: 11px !important; }
  .side-help-links { grid-template-columns: 1fr !important; }
  /* The guide launcher duplicated both Ideas and global search and occupied
     the same scarce edge rail as the search button/composer. Guides remain
     one tap away in Ideas and in search, so the mobile surface stays calm. */
  .dock-launcher { display:none !important; }

  /* Производительность ленты: инерция + меньше reflow/repaint на карточках. */
  #mobileFeed {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    contain: layout paint style;
    scroll-behavior: auto !important;
  }
  .mfeed-slide {
    content-visibility: auto;
    contain-intrinsic-size: 320px 420px;
    contain: layout paint style;
    will-change: auto;
  }
  .mfeed-slide img {
    transform: translateZ(0);
    backface-visibility: hidden;
  }

  :root {
    --mob-ease: cubic-bezier(0.22, 0.8, 0.2, 1);
    --mob-nav-h: calc(62px + env(safe-area-inset-bottom, 0px));
  }

  /* —— нижняя навигация: 5 пунктов, тёмное стекло без тяжёлого blur —— */
  .mobile-nav {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    z-index: var(--ta-layer-mobile-nav, 1000);
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 4px;
    padding: 6px;
    border-radius: 20px;
    border: 1px solid rgba(46, 230, 168, 0.28);
    background: rgba(4, 14, 10, 0.94);
    box-shadow: 0 16px 40px -18px rgba(0, 0, 0, 0.9);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .mobile-nav button {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    min-height: 52px;
    padding: 6px 2px !important;
    border-radius: 14px !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    color: rgba(207, 251, 233, 0.78) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.02em;
    box-shadow: none !important;
    line-height: 1.1;
  }

  .mobile-nav button .mn-ico {
    font-size: 20px;
    line-height: 1;
    filter: drop-shadow(0 2px 6px rgba(46, 230, 168, 0.25));
  }

  .mobile-nav button .mn-lbl {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .mobile-nav button.on,
  .mobile-nav button:active {
    background: linear-gradient(145deg, rgba(46, 230, 168, 0.95), rgba(15, 174, 122, 0.9)) !important;
    color: #04140d !important;
    border-color: transparent !important;
    box-shadow: 0 8px 22px -10px rgba(46, 230, 168, 0.85) !important;
  }

  .mobile-nav-pill {
    background: linear-gradient(145deg, rgba(46, 230, 168, 0.55), rgba(15, 174, 122, 0.45));
    border: 1px solid rgba(120, 255, 203, 0.35);
    box-shadow: 0 8px 24px -14px rgba(46, 230, 168, 0.9);
  }

  /* FAB ассистента — компактнее, не перекрывает nav */
  .omni-fab {
    width: 54px !important;
    height: 54px !important;
    right: 14px !important;
    bottom: calc(78px + env(safe-area-inset-bottom, 0px)) !important;
  }

  .omni-assistant[data-omni-state="open"] .omni-fab {
    opacity: 0.35;
    pointer-events: none;
  }

  /* —— переходы экранов —— */
  .screen.on.screen-mobile-enter {
    animation: mobScreenIn 0.42s var(--mob-ease) both;
  }

  @keyframes mobScreenIn {
    from {
      opacity: 0;
      transform: translateY(14px) scale(0.988);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }

  .mobile-nav-pill {
    position: absolute;
    left: 0;
    top: 8px;
    height: calc(100% - 16px);
    border-radius: 14px;
    pointer-events: none;
    z-index: 0;
    transition:
      transform 0.38s var(--mob-ease),
      width 0.38s var(--mob-ease),
      opacity 0.2s ease;
    opacity: 0;
  }

  .mobile-nav-pill.is-visible {
    opacity: 1;
  }

  .mobile-nav a,
  .mobile-nav button {
    position: relative;
    z-index: 1;
    transition: transform 0.18s var(--mob-ease), color 0.2s ease;
  }

  .mobile-nav a:active,
  .mobile-nav button:active {
    transform: scale(0.94);
  }

  .mobile-nav a.on,
  .mobile-nav button.on {
    background: transparent !important;
    border-color: transparent !important;
    color: #04140d !important;
    box-shadow: none !important;
  }

  .tabs {
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    gap: 8px;
    padding-bottom: 4px;
  }

  .tabs::-webkit-scrollbar {
    display: none;
  }

  .tabs .tab {
    flex: 0 0 auto;
    scroll-snap-align: start;
    white-space: nowrap;
    transition: transform 0.2s var(--mob-ease), background 0.2s ease, border-color 0.2s ease;
  }

  .tabs .tab.active {
    transform: translateY(-1px);
  }

  .tabs .tab:active {
    transform: scale(0.97);
  }

  .mfeed-slide .feed-img-ph {
    position: absolute;
    inset: 0;
    z-index: 0;
  }

  .mfeed-slide .mfeed-cap {
    z-index: 3;
  }

  .feed-mob-bar .feed-refresh,
  .feed-mob-bar .feed-wow-mob {
    flex: 1;
    justify-content: center;
    min-height: 42px;
    font-size: 13px;
  }

  body.mfeed-fs {
    overflow: hidden;
  }

  #mobileFeed::after {
    content: "";
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    height: 0;
    display: block;
    pointer-events: none;
    box-shadow: 0 0 0 0 rgba(46, 230, 168, 0);
    transition: box-shadow 0.2s ease;
  }

  #mobileFeed[style*="--pull"]::before {
    content: "Отпустите — обновить";
    position: sticky;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    font-size: 12px;
    color: rgba(234, 255, 245, 0.85);
    text-align: center;
    padding: 6px 12px;
    border-radius: 999px;
    background: rgba(8, 32, 22, 0.72);
    border: 1px solid rgba(46, 230, 168, 0.35);
    width: fit-content;
    margin: 0 auto 8px;
    display: block;
  }

  .gal-card.skel,
  .mfeed-skel {
    background: linear-gradient(
      105deg,
      rgba(255, 255, 255, 0.04) 0%,
      rgba(46, 230, 168, 0.14) 45%,
      rgba(255, 255, 255, 0.04) 90%
    );
    background-size: 220% 100%;
    animation: mobSkelShimmer 1.15s ease-in-out infinite;
    border-radius: 14px;
    min-height: 120px;
  }

  .mfeed-skel {
    display: block;
    height: min(72dvh, calc(100dvh - 148px - env(safe-area-inset-bottom)));
    margin-bottom: 2px;
  }

  #mobileFeed.mfeed-loading .mfeed-skel {
    display: block;
  }

  #mobileFeed.mfeed-ready .mfeed-skel {
    display: none;
  }

  @keyframes mobSkelShimmer {
    0% {
      background-position: 100% 0;
    }
    100% {
      background-position: -100% 0;
    }
  }

  .mfeed-slide {
    transition: opacity 0.35s ease, transform 0.35s var(--mob-ease);
  }

  .mfeed-slide.mfeed-visible {
    animation: mobFeedSlideIn 0.45s var(--mob-ease) both;
  }

  @keyframes mobFeedSlideIn {
    from {
      opacity: 0.55;
      transform: scale(0.985);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }

  .mfeed-slide img {
    transition: transform 0.5s var(--mob-ease);
  }

  .mfeed-slide.mfeed-visible img {
    transform: scale(1.02);
  }

  #mobileFeed {
    scroll-behavior: smooth;
  }

  .theatre-reveal:not(.is-visible) {
    opacity: 0;
    transform: translateY(16px) scale(0.985);
  }

  .theatre-reveal.is-visible {
    opacity: 1;
    transform: none;
    transition:
      opacity 0.5s var(--mob-ease),
      transform 0.5s var(--mob-ease);
  }

  .theatre-stage-transition.is-active::after {
    animation: mobStageSweep 0.42s var(--mob-ease) both;
  }

  @keyframes mobStageSweep {
    0% {
      opacity: 0;
      transform: scaleX(0.3);
    }
    40% {
      opacity: 1;
    }
    100% {
      opacity: 0;
      transform: scaleX(1);
    }
  }

  .omni-panel,
  .img-mixer.open {
    transition: transform 0.35s var(--mob-ease), opacity 0.3s ease;
  }

  body.mob-sheet-open {
    overflow: hidden;
  }
}

@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .screen.on.screen-mobile-enter,
  .mfeed-slide.mfeed-visible,
  .theatre-reveal:not(.is-visible),
  .theatre-reveal.is-visible,
  .mobile-nav-pill,
  .tabs .tab,
  .mfeed-slide img {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }

  #mobileFeed {
    scroll-behavior: auto;
  }
}

/* ============================================================
   TheatreAI — мобильный «лак» v2
   Типографика, вау-навигация, Gemini-ореол, аврора ленты.
   Всё на transform/opacity (GPU), отключается при reduced-motion.
   ============================================================ */
@media (max-width: 768px) {

  /* — Заголовки: жирный гротеск Onest 800, полный контраст — */
  .hero-title-wow,
  #homeBaShowcase .home-ba-head h2,
  .screen .screen-h,
  .screen h1, .screen h2, .screen h3,
  .feed-h b, .packs-h, .side-head b, .wallet-head b, .mfeed-cap b {
    font-family: var(--font) !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em;
    color: #eafff5 !important;
  }
  /* акцент-слово оставляем ярким градиентом */
  .hero-title-wow .htw-accent {
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
  }
  /* подзаголовки — контрастнее, не серые */
  #homeBaShowcase .home-ba-head p,
  .screen > .sub, .screen .sub {
    color: #c6ecda !important;
  }

  /* — Нижняя панель: вау-стекло — */
  .mobile-nav {
    background: linear-gradient(150deg, rgba(7,26,18,.96), rgba(3,12,9,.985)) !important;
    border: 1px solid rgba(46,230,168,.30) !important;
    box-shadow: 0 18px 46px -20px rgba(0,0,0,.95), inset 0 1px 0 rgba(255,255,255,.06) !important;
  }
  .mobile-nav button .mn-ico { transition: transform .25s var(--mob-ease); }
  .mobile-nav button.on .mn-ico { transform: translateY(-2px) scale(1.1); }
  .mobile-nav-pill {
    background: linear-gradient(145deg, rgba(46,230,168,.96), rgba(15,174,122,.92)) !important;
    box-shadow: 0 10px 26px -10px rgba(46,230,168,.9), inset 0 1px 0 rgba(255,255,255,.35) !important;
  }

  /* — Кнопка ИИ (TA): свечение в стиле Gemini через box-shadow —
     box-shadow не обрезается overflow:hidden кнопки, поэтому halo реально виден. */
  .omni-fab {
    animation: omniPulse 2.8s ease-in-out infinite, taGlow 3.8s ease-in-out infinite !important;
  }
  @keyframes taGlow {
    0%, 100% {
      box-shadow:
        0 18px 48px -18px rgba(3,10,22,.62),
        0 0 20px rgba(46,230,168,.55),
        0 0 42px rgba(90,209,255,.32),
        inset 0 1px 0 rgba(255,255,255,.58);
    }
    50% {
      box-shadow:
        0 18px 48px -18px rgba(3,10,22,.62),
        0 0 30px rgba(155,140,255,.6),
        0 0 60px rgba(46,230,168,.4),
        inset 0 1px 0 rgba(255,255,255,.58);
    }
  }

  /* — Кнопки/активные окна: тонкий перелив-блик — */
  .wow-btn, .gen-mixer-btn { position: relative; overflow: hidden; }
  .wow-btn::after, .gen-mixer-btn::after {
    content: ""; position: absolute; top: 0; left: -60%; width: 45%; height: 100%;
    background: linear-gradient(100deg, transparent, rgba(255,255,255,.28), transparent);
    transform: skewX(-18deg); animation: btnSheen 5s ease-in-out infinite; pointer-events: none;
  }
  @keyframes btnSheen { 0%, 62% { left: -60%; } 88%, 100% { left: 135%; } }

  /* — Кнопка миксера внутри «Создать» — */
  .gen-mixer-btn {
    display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
    margin: 2px 0 14px; padding: 13px; border-radius: 14px; font-size: 14px; font-weight: 800;
    color: #eafff5; cursor: pointer;
    border: 1px solid rgba(46,230,168,.35);
    background: linear-gradient(145deg, rgba(46,230,168,.15), rgba(15,174,122,.10));
    transition: transform .16s var(--mob-ease);
  }
  .gen-mixer-btn:active { transform: scale(.98); }

  /* — Лента: анимированная аврора-подложка (GPU transform) — */
  #mobileFeed { position: relative; isolation: isolate; background: transparent !important; }
  #mobileFeed::before {
    content: ""; position: absolute; inset: -22%; z-index: -1; pointer-events: none;
    background:
      radial-gradient(40% 30% at 25% 20%, rgba(46,230,168,.18), transparent 60%),
      radial-gradient(35% 30% at 82% 34%, rgba(90,209,255,.12), transparent 60%),
      radial-gradient(45% 35% at 55% 92%, rgba(15,174,122,.16), transparent 60%),
      #05140d;
    animation: feedAurora 22s ease-in-out infinite alternate;
    will-change: transform;
  }
  @keyframes feedAurora {
    0%   { transform: translate3d(-3%, -2%, 0) scale(1.06); }
    100% { transform: translate3d(3%, 2%, 0) scale(1.14); }
  }
}

@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .omni-fab,
  .wow-btn::after,
  .gen-mixer-btn::after,
  #mobileFeed::before,
  .hero-title-wow .htw-accent {
    animation: none !important;
  }
}

/* ultra-fast: слабые устройства / save-data — без анимаций, меньше декора */
@media (max-width: 768px) {
  body.feed-ultra-fast .screen.on.screen-mobile-enter,
  body.feed-ultra-fast .mfeed-slide.mfeed-visible,
  body.feed-ultra-fast .theatre-reveal:not(.is-visible),
  body.feed-ultra-fast .theatre-reveal.is-visible,
  body.feed-ultra-fast .mobile-nav-pill,
  body.feed-ultra-fast .tabs .tab,
  body.feed-ultra-fast .mfeed-slide img,
  body.feed-ultra-fast .mfeed-skel,
  body.feed-ultra-fast .omni-fab,
  body.feed-ultra-fast .wow-btn::after,
  body.feed-ultra-fast .gen-mixer-btn::after,
  body.feed-ultra-fast .hero-title-wow .htw-accent {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
  }
  body.feed-ultra-fast #mobileFeed::before {
    animation: none !important;
    transform: none !important;
    opacity: 0.55;
  }
  body.feed-ultra-fast #mobileFeed {
    scroll-behavior: auto;
    content-visibility: auto;
    contain: layout paint style;
  }
  body.feed-ultra-fast .mfeed-slide {
    transition: none !important;
  }
}

/* Кнопка миксера — только на мобиле */
@media (min-width: 769px) {
  .gen-mixer-btn { display: none !important; }
}

/* ============================================================
   TheatreAI — единый мобильный вау/UX-слой v3
   Лёгкое liquid glass (без backdrop-filter), микро-отклики,
   Telegram-плавность, крупные тапы, читаемость. Только CSS.
   ============================================================ */
@media (max-width: 768px) {

  /* убрать серый тап-хайлайт + убрать задержку тапа (300ms) — отклик как в приложении */
  a, button, .tab, .chip, .card, .ai, [data-jump], [role="button"], summary, label {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  /* — Стеклянные карточки (лёгкое liquid glass) — */
  .card, .model-card, .vote-card, .plan-card, .radar-card, .os-card {
    border-radius: 18px !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    background:
      linear-gradient(158deg, rgba(255,255,255,.055), rgba(255,255,255,.015) 42%, rgba(46,230,168,.045)),
      rgba(7,20,15,.74) !important;
    box-shadow: 0 14px 34px -22px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.12) !important;
    transition: transform .2s var(--mob-ease), box-shadow .25s var(--mob-ease), border-color .25s;
  }
  .card:active, .model-card:active, .vote-card:active, .plan-card:active, .radar-card:active {
    transform: scale(.985);
  }

  /* — Первичные кнопки — */
  .wow-btn, .wow-btn-primary {
    border-radius: 14px !important;
    box-shadow: 0 12px 26px -12px rgba(46,230,168,.85), inset 0 1px 0 rgba(255,255,255,.3) !important;
    transition: transform .16s var(--mob-ease), box-shadow .2s ease;
  }
  .wow-btn:active { transform: translateY(1px) scale(.985); }

  /* — Вторичные кнопки .ai: стекло — */
  .ai {
    border-radius: 12px !important;
    border: 1px solid rgba(46,230,168,.24) !important;
    background: linear-gradient(150deg, rgba(255,255,255,.06), rgba(46,230,168,.05)), rgba(7,20,15,.6) !important;
    color: #eafff5 !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
    transition: transform .15s var(--mob-ease), border-color .2s, background .2s;
  }
  .ai:active { transform: scale(.96); border-color: rgba(46,230,168,.5) !important; }

  /* — Табы: сегмент в стиле Telegram — */
  .tabs { gap: 6px; }
  .tabs .tab {
    border-radius: 12px !important;
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    color: rgba(207,251,233,.82) !important;
    transition: transform .18s var(--mob-ease), background .22s ease, color .2s, box-shadow .22s;
  }
  .tabs .tab.active {
    background: linear-gradient(135deg, #2ee6a8, #0fae7a) !important;
    color: #04140d !important; border-color: transparent !important;
    box-shadow: 0 8px 20px -10px rgba(46,230,168,.8), inset 0 1px 0 rgba(255,255,255,.35) !important;
  }

  /* — Чипы — */
  .chip {
    border-radius: 999px !important;
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    color: rgba(207,251,233,.85) !important;
    transition: transform .15s var(--mob-ease), background .2s, border-color .2s, color .2s;
  }
  .chip.on { background: rgba(46,230,168,.16) !important; border-color: rgba(46,230,168,.55) !important; color: #eafff5 !important; }
  .chip:active { transform: scale(.95); }

  /* — Поля ввода: стекло + мятный фокус-ринг, крупные тапы, без iOS-зума — */
  input, select, textarea {
    border-radius: 13px !important;
    min-height: 46px;
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    color: #eafff5 !important;
    font-size: 16px !important;
    transition: border-color .2s ease, box-shadow .2s ease, background .2s;
  }
  textarea { min-height: 96px; line-height: 1.5; }
  input:focus, select:focus, textarea:focus {
    border-color: #2ee6a8 !important;
    box-shadow: 0 0 0 3px rgba(46,230,168,.18), inset 0 1px 0 rgba(255,255,255,.08) !important;
    background: rgba(46,230,168,.05) !important;
    outline: none !important;
  }
  input[type=range] { accent-color: #2ee6a8; height: 30px; }

  /* — Заголовок секции: sticky-стекло для читаемости при скролле — */
  .screen .screen-h {
    position: sticky; top: 0; z-index: 20;
    padding: 10px 2px 10px; margin-bottom: 8px;
    background: linear-gradient(180deg, rgba(4,15,10,.94), rgba(4,15,10,.55) 78%, transparent);
  }

  /* — Переходы вкладок: быстро и мягко (Telegram-стиль) — */
  .pane.on { animation: paneIn .26s var(--mob-ease) both; }
  @keyframes paneIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

  /* — Ассистент/шторка: стеклянная поверхность — */
  .omni-panel {
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 -10px 50px -20px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.1) !important;
  }
}

@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .pane.on { animation: none !important; }
}

/* — Нижняя панель: самодостаточная активная кнопка (без хрупкой «пилюли») —
   раньше активная кнопка становилась тёмной, а пилюля под ней не всегда вставала,
   из-за чего кнопка сливалась с фоном и панель выглядела «сбитой». */
@media (max-width: 768px) {
  .mobile-nav-pill { display: none !important; }
  .mobile-nav button.on, .mobile-nav a.on {
    background: linear-gradient(145deg, #2ee6a8, #15ae7a) !important;
    color: #04140d !important;
    border-color: transparent !important;
    box-shadow: 0 8px 20px -10px rgba(46,230,168,.85), inset 0 1px 0 rgba(255,255,255,.35) !important;
  }
  .mobile-nav button.on .mn-ico { filter: none !important; }
  .mobile-nav button.on .mn-lbl { color: #04140d !important; }
}

/* — Футер на мобиле: максимум компакта (юр-простыню убираем) — */
@media (max-width: 768px) {
  .site-footer {
    padding: 16px 14px calc(86px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .site-footer .ft-grid { display: block !important; }
  /* прячем объёмное: описание бренда, большой список «Платформа», часы — реквизиты оставляем */
  .site-footer .ft-brand .ft-desc,
  .site-footer .ft-col:nth-child(2),
  .site-footer .ft-hours { display: none !important; }
  .site-footer .ft-fiscal-text {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.4 !important;
    opacity: 0.88;
    max-height: none !important;
  }
  /* заголовки компактнее */
  .site-footer .ft-col h4 { font-size: 14px !important; margin: 14px 0 6px !important; }
  .site-footer .ft-brand .ft-logo { font-size: 18px !important; }
  .site-footer .ft-cr { font-size: 12.5px !important; opacity: .8; }
  /* правовые ссылки — компактным рядом чипов, а не колонкой */
  .site-footer .ft-col:nth-child(3) ul {
    display: flex; flex-wrap: wrap; gap: 8px 10px; margin: 0; padding: 0;
  }
  .site-footer .ft-col:nth-child(3) li { list-style: none; }
  .site-footer .ft-col:nth-child(3) a {
    display: inline-block; font-size: 13px !important;
    padding: 7px 12px; border-radius: 999px;
    background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.10);
    color: #bfe9d6 !important;
  }
  .site-footer .ft-col:nth-child(4) p { font-size: 13.5px !important; margin: 6px 0; }
  .site-footer .ft-hr { margin: 14px 0 !important; opacity: .4; }
  .site-footer .ft-fiscal { display: block !important; }
  .site-footer .ft-pay { justify-content: center; gap: 8px; flex-wrap: wrap; }
  .site-footer .ft-partner--desktop { display: none !important; }
  .site-footer .ft-social { display: flex !important; margin-top: 8px; }
}

/* — Никакого мелкого шрифта на мобиле: разумные минимумы, читаемость — */
@media (max-width: 768px) {
  .screen p, .screen li, .screen label,
  .sub, .hint, .perm,
  .home-ba-head p, .card p, .card span, .model-card p, .model-card span,
  .vote-body, .omni-result, #omniHistory,
  .radar-card p, .os-card p {
    font-size: 14.5px !important;
    line-height: 1.5 !important;
  }
  .chip, .tab, .badge, .mc-badge,
  .home-ba-tabs button, .tabs .tab {
    font-size: 13.5px !important;
  }
  .site-footer .ft-col:nth-child(3) a { font-size: 13px !important; }
  small, .tiny, .mut, .muted, .ft-cr { font-size: 13px !important; }
  .mobile-nav .mn-lbl { font-size: 11px !important; }
  input, select, textarea, .omni-compose textarea { font-size: 16px !important; }
}

/* — Заливные SVG-иконки нижней панели — */
@media (max-width: 768px) {
  .mobile-nav .mn-ico { display: inline-flex; align-items: center; justify-content: center; }
  .mobile-nav .mn-ico svg {
    width: 25px; height: 25px; display: block;
    fill: #2ee6a8;
    transition: transform .2s var(--mob-ease);
    /* §6: убран бесконечный navHue (постоянный фон движения) — статичная тень для глубины */
    filter: drop-shadow(0 2px 6px rgba(46,230,168,.4));
  }
  @keyframes navHue {
    from { filter: drop-shadow(0 2px 6px rgba(46,230,168,.42)) hue-rotate(0deg) saturate(1); }
    to   { filter: drop-shadow(0 2px 7px rgba(90,209,255,.42)) hue-rotate(38deg) saturate(1.25); }
  }
  .mobile-nav button:active .mn-ico svg { transform: scale(.9); }
  .mobile-nav button.on .mn-ico svg { fill: #04140d !important; filter: none !important; animation: none !important; }
}
@media (max-width: 768px) and (prefers-reduced-motion: reduce) {
  .mobile-nav .mn-ico svg { animation: none !important; filter: drop-shadow(0 2px 6px rgba(46,230,168,.4)); }
}

/* — Плавный скролл ленты в обычном режиме: без scale-репейнта слайдов — */
@media (max-width: 768px) {
  #mobileFeed { scroll-snap-type: y proximity; }
  .mfeed-slide { transition: opacity .35s ease !important; transform: none !important; }
  .mfeed-slide img { transform: none !important; transition: opacity .4s ease !important; }
  .mfeed-slide.mfeed-visible img { transform: none !important; }
  /* полноэкранный режим — оставляем «мягкий», но чёткий свайп */
  body.mfeed-fs #mobileFeed { scroll-snap-type: y mandatory; }
}

/* — C4: окно генерации — убрать пустоту (история не раздувает пространство) — */
@media (max-width: 768px) {
  .gm-card { max-height: 90dvh !important; }
  .gm-scroll { flex: 0 1 auto !important; }        /* размер по контенту, но всё ещё скроллится когда длинно */
  .gm-foot { margin-top: auto; }                   /* низ прижат вниз, без большой дыры */
  .gm-drop { padding: 12px !important; }
}

/* — C3: карточки Вдохновения/Радара как на десктопе (тач: показываем «Открыть →») — */
@media (max-width: 768px) {
  .kinetic-menu { grid-template-columns: 1fr 1fr !important; gap: 10px !important; }
  .km-tile { min-height: 120px; padding: 14px !important; }
  .km-tile b { font-size: 15.5px !important; }
  .km-tile small { font-size: 12.5px !important; color: rgba(207,251,233,.8) !important; }
  .km-go { opacity: 1 !important; transform: none !important; }
}

/* — Лента: быстрый сочный инерционный скролл (без снапа в обычном режиме) — */
@media (max-width: 768px) {
  #mobileFeed { scroll-snap-type: none !important; overscroll-behavior-y: contain; }
  .mfeed-slide { scroll-snap-align: none !important; }
  body.mfeed-fs #mobileFeed { scroll-snap-type: y mandatory !important; }
  body.mfeed-fs .mfeed-slide { scroll-snap-align: start !important; }
}

/* — Акцентная кнопка ИИ в нижней панели — */
@media (max-width: 768px) {
  .mobile-nav button[data-open-omni]:not(.on) {
    background: linear-gradient(150deg, rgba(46,230,168,.18), rgba(90,209,255,.10)) !important;
    border: 1px solid rgba(46,230,168,.5) !important;
    box-shadow: 0 6px 18px -8px rgba(46,230,168,.6), inset 0 1px 0 rgba(255,255,255,.14) !important;
  }
  .mobile-nav button[data-open-omni] .mn-lbl { color: #7CFFCB !important; font-weight: 800 !important; }
}

/* Нижняя панель v26: фактические четыре действия занимают четыре равные
   колонки. Раньше поздний style.css оставлял пятую пустую колонку справа. */
@media (max-width: 768px) {
  .mobile-nav,
  .mobile-nav.mobile-nav--live,
  .mobile-nav[data-nav-mode="project"] {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    max-width: 520px !important;
    margin-inline: auto !important;
  }
  .mobile-nav .mn-ico {
    width: 32px !important;
    height: 29px !important;
    border-radius: 10px;
    background: linear-gradient(145deg, rgba(46,230,168,.15), rgba(90,209,255,.07));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 5px 14px -8px rgba(46,230,168,.9);
  }
  .mobile-nav .mn-ico svg {
    width: 26px !important;
    height: 26px !important;
    fill: #78ffd0 !important;
    filter: drop-shadow(0 2px 7px rgba(46,230,168,.52)) !important;
  }
  .mobile-nav button.on .mn-ico {
    background: rgba(4,20,13,.1);
    box-shadow: none;
  }
  .mobile-nav button.on .mn-ico svg {
    fill: #04140d !important;
    filter: none !important;
  }
}

/* — Окно генерации: высота по контенту, без пустоты — */
@media (max-width: 768px) {
  .gm-card { height: auto !important; max-height: 88dvh !important; }
  .gm-scroll { flex: 0 1 auto !important; min-height: 0 !important; }
}

/* — СКОРОСТЬ ОЩУЩЕНИЯ: мгновенный сочный отклик на тап (чистый CSS) — */
@media (max-width: 768px) {
  button, .ai, .chip, .tab, [data-jump], [role="button"],
  .km-tile, .mod-tile, .gm-type, .home-ba-tabs button, .wow-btn, .gen-mixer-btn {
    transition: transform .09s ease, filter .12s ease, box-shadow .15s ease !important;
  }
  button:active, .ai:active, .chip:active, .tab:active, [data-jump]:active, [role="button"]:active,
  .km-tile:active, .mod-tile:active, .gm-type:active, .wow-btn:active, .gen-mixer-btn:active {
    transform: scale(.955) !important;
    filter: brightness(1.09);
  }
  /* Скругления мягче и «дороже» */
  .card, .model-card, .vote-card, .plan-card, .radar-card,
  .gm-card, .km-tile, .mod-tile, .omni-panel, .gm-drop,
  .home-ba-stage, .home-ba-compare { border-radius: 22px !important; }
  button, .ai, .tab, .gm-type, .wow-btn, .gen-mixer-btn,
  input, select, textarea { border-radius: 14px !important; }
  .chip { border-radius: 999px !important; }
}

/* — Меню ИИ-помощника: удобная мобильная шторка — */
@media (max-width: 768px) {
  .omni-assistant[data-omni-state="open"] .omni-panel {
    left: 8px !important; right: 8px !important;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    max-height: 76dvh !important;
    border-radius: 22px !important;
    padding-bottom: 8px;
  }
  /* примеры — горизонтальный скролл чипов, не занимают три строки */
  .omni-examples {
    display: flex !important; flex-wrap: nowrap !important;
    gap: 8px; overflow-x: auto; scrollbar-width: none; padding-bottom: 4px;
  }
  .omni-examples::-webkit-scrollbar { display: none; }
  .omni-examples button {
    flex: 0 0 auto; font-size: 13.5px !important;
    padding: 9px 13px !important; border-radius: 999px !important;
  }
  /* композитор и шапка — крупные удобные тапы */
  .omni-compose textarea { min-height: 48px !important; font-size: 16px !important; }
  #omniAnalyze, .omni-primary.omni-send { min-width: 50px; min-height: 50px; }
  .omni-attach-btn { min-width: 46px; min-height: 46px; }
  .omni-head button { min-width: 42px; min-height: 42px; }
}

/* — Тап-таргеты ≥44px (рекомендация Apple/Google, из Playwright-аудита) — */
@media (max-width: 768px) {
  /* чипы переключения кейсов было→стало (Сценография/Чертёж/Видео/Костюм/3D) */
  #homeBaShowcase .home-ba-tabs button,
  .home-ba-tabs button {
    min-height: 44px !important;
    padding: 11px 16px !important;
    display: inline-flex; align-items: center;
  }
  /* текстовые ссылки в футере — комфортная область тапа */
  .site-footer .ft-col:nth-child(3) a {
    min-height: 44px; display: inline-flex; align-items: center;
    padding: 10px 14px !important;
  }
  .site-footer .ft-col:nth-child(4) a { display: inline-flex; align-items: center; min-height: 40px; }
  /* прочие чипы/табы — не ниже 40px */
  .chip, .tabs .tab { min-height: 40px; display: inline-flex; align-items: center; }
}

/* ============================================================
   DESIGN B — глубокое стекло + hi-tech AI (мобилка)
   Faux-glassmorphism (без backdrop-filter), свечение, градиентная
   глубина. GPU-дёшево. Всё в мобильном слое — откат через git.
   ============================================================ */
@media (max-width: 768px) {

  /* — Амбиентная градиентная глубина за всем приложением — */
  body {
    background:
      radial-gradient(70% 42% at 10% 0%, rgba(46,230,168,.16), transparent 55%),
      radial-gradient(62% 44% at 94% 16%, rgba(90,209,255,.13), transparent 55%),
      radial-gradient(85% 55% at 50% 110%, rgba(155,140,255,.12), transparent 60%),
      #050d10 !important;
    background-attachment: fixed !important;
  }
  /* даём мешу просвечивать сквозь основные обёртки */
  .theatre-cockpit, .studio-shell, main, .screen { background: transparent !important; }

  /* — Стеклянные поверхности: усиленная глубина + мягкое свечение края —
     (контейнеры картинок шоукеза .home-ba-stage/.home-ba-compare и .omni-panel
     СПЕЦИАЛЬНО исключены — им непрозрачное стекло ломает вид) */
  .card, .model-card, .vote-card, .plan-card, .radar-card, .os-card,
  .gm-card, .km-tile {
    border: 1px solid rgba(255,255,255,.13) !important;
    background:
      linear-gradient(155deg, rgba(255,255,255,.085), rgba(255,255,255,.02) 45%, rgba(46,230,168,.05)),
      rgba(8,20,16,.62) !important;
    box-shadow:
      0 18px 42px -24px rgba(0,0,0,.9),
      inset 0 1px 0 rgba(255,255,255,.18),
      0 0 0 1px rgba(46,230,168,.05) !important;
  }

  /* — Плитки модальностей (герой): стекло + свечение по акцент-цвету — */
  .mod-tile {
    position: relative; overflow: hidden;
    border: 1px solid rgba(255,255,255,.14) !important;
    background:
      radial-gradient(120% 100% at 0% 0%, rgba(var(--mc,46,230,168),.14), transparent 60%),
      linear-gradient(155deg, rgba(255,255,255,.07), rgba(255,255,255,.015)),
      rgba(7,18,14,.66) !important;
    box-shadow: 0 16px 36px -22px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.16) !important;
    transition: transform .12s ease, box-shadow .2s ease !important;
  }
  .mod-tile:active {
    transform: scale(.97) !important;
    box-shadow: 0 0 0 1px rgba(var(--mc,46,230,168),.5), 0 14px 30px -14px rgba(var(--mc,46,230,168),.6) !important;
  }

  /* — Акцент-градиент у ключевых заголовков (глубина/свечение) — */
  .hero-title-wow .htw-accent { text-shadow: 0 0 22px rgba(46,230,168,.35); }

  /* — Разделители — тонкая светящаяся линия вместо глухой — */
  hr, .divider, .ft-hr {
    border: none !important; height: 1px !important;
    background: linear-gradient(90deg, transparent, rgba(46,230,168,.35), transparent) !important;
  }
}

/* До первого обращения главная держит только лёгкий вход в помощника.
   Полная строка и история появляются после тапа, поэтому закрытая панель
   не раздувает DOM и не попадает в tab-порядок. Этот override намеренно
   стоит последним после legacy Gemini-style composer. */
@media (max-width: 768px) {
  #omniAssistant .omni-panel[hidden] {
    display: none !important;
  }
  #omniAssistant[data-omni-state="closed"] .omni-fab {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 136px !important;
    height: 50px !important;
    margin-left: auto !important;
    padding: 0 16px 0 10px !important;
    border-radius: 18px !important;
    pointer-events: auto !important;
  }
  #omniAssistant[data-omni-state="closed"] .omni-fab__mark {
    width: 34px !important;
    height: 34px !important;
    flex: 0 0 34px !important;
    font-size: 14px !important;
  }
  #omniAssistant[data-omni-state="closed"] .omni-fab__label {
    position: relative;
    z-index: 1;
    display: inline !important;
    white-space: nowrap;
    color: #06120e;
    font-size: 13px;
    font-weight: 850;
    letter-spacing: -.01em;
  }
  #omniAssistant[data-omni-state="open"] .omni-fab {
    display: none !important;
  }
}

/* v32: keyboard-safe sheets. visualViewport updates --ta-vvh, so the
   generator and assistant resize with the on-screen keyboard instead of
   putting their primary action underneath it. */
@media (max-width: 768px) {
  .gen-modal.open {
    min-height: var(--ta-vvh, 100dvh) !important;
    height: var(--ta-vvh, 100dvh) !important;
  }
  .gen-modal.open .gm-card,
  .gen-modal.gen-fullscreen .gm-card {
    width: 100% !important;
    height: auto !important;
    max-height: calc(var(--ta-vvh, 100dvh) - 6px) !important;
    padding: 12px 14px max(10px, env(safe-area-inset-bottom)) !important;
    border-radius: 22px 22px 0 0 !important;
  }
  .gm-head { margin-bottom: 8px !important; }
  .gm-types {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    max-height: none !important;
    padding-bottom: 3px;
    scrollbar-width: none;
  }
  .gm-types::-webkit-scrollbar { display: none; }
  .gm-type { flex: 0 0 auto; min-height: 42px; padding: 9px 13px; touch-action: manipulation; }
  .gm-scroll { min-height: 0 !important; flex: 1 1 auto !important; }
  .gm-foot { position: sticky !important; bottom: 0; padding-bottom: max(8px, env(safe-area-inset-bottom)) !important; }
  .gm-go.ai { position: relative; min-height: 50px; touch-action: manipulation; }
  #omniAssistant[data-omni-state="open"] .omni-panel {
    max-height: min(76dvh, calc(var(--ta-vvh, 100dvh) - 92px)) !important;
  }
  #omniAssistant.omni-fullscreen .omni-panel {
    height: var(--ta-vvh, 100dvh) !important;
    max-height: var(--ta-vvh, 100dvh) !important;
  }
}

/* — Лента под Design B: карточки со скруглением, стеклом, отступами — */
@media (max-width: 768px) {
  #mobileFeed { padding: 4px 8px calc(156px + env(safe-area-inset-bottom, 0px)); }
  .mfeed-slide {
    border-radius: 20px !important;
    margin-bottom: 10px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 16px 40px -22px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.12);
  }
  .mfeed-slide .mfeed-cap {
    background: linear-gradient(transparent, rgba(4,15,10,.5) 38%, rgba(4,15,10,.92)) !important;
    padding: 22px 16px calc(16px + env(safe-area-inset-bottom, 0px)) !important;
  }
  .mfeed-cap b { color: #eafff5 !important; }
  .mfeed-cap span { color: rgba(220,246,234,.85) !important; }
  /* ОБЫЧНЫЙ режим — ПЛИТКИ (сетка 2 колонки, стекло Design B). min-height, чтобы
     фид не схлопывался при загрузке (из-за этого «лента исчезала»). */
  body:not(.mfeed-fs) #mobileFeed {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
    height: auto !important; max-height: none !important;
    min-height: 42vh;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }
  body:not(.mfeed-fs) #mobileFeed .mfeed-slide {
    height: auto !important; aspect-ratio: 3 / 4 !important;
    margin-bottom: 0 !important; scroll-snap-align: none !important;
  }
  body:not(.mfeed-fs) #mobileFeed .mfeed-skel {
    display: block !important; height: auto !important;
    aspect-ratio: 3 / 4 !important; min-height: 0 !important;
  }
  /* «⛶ Развернуть» → body.mfeed-fs — полноэкранный TikTok-свайп В РАМОЧКАХ */
  body.mfeed-fs #mobileFeed {
    display: block !important;
    height: 100dvh !important; max-height: 100dvh !important;
    overflow-y: auto !important; scroll-snap-type: y mandatory !important;
    padding: 8px !important;
  }
  body.mfeed-fs .mfeed-slide {
    height: calc(100dvh - 16px) !important; aspect-ratio: auto !important;
    margin: 0 0 8px !important;
    border-radius: 22px !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    scroll-snap-align: center !important;
  }
  /* панель ленты (Обновить/Развернуть) — всегда видима, sticky сверху, стекло Design B */
  .feed-mob-bar {
    display: flex !important;
    position: sticky; top: 6px; z-index: 15;
    gap: 8px; padding: 7px !important; margin: 0 2px 10px !important;
    background: linear-gradient(150deg, rgba(255,255,255,.07), rgba(46,230,168,.06)), rgba(8,20,16,.82) !important;
    border: 1px solid rgba(46,230,168,.3) !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 26px -14px rgba(0,0,0,.85) !important;
  }
  .feed-mob-bar .feed-refresh, .feed-mob-bar .feed-wow-mob {
    flex: 1; min-height: 44px; justify-content: center; font-size: 13.5px !important;
    background: rgba(255,255,255,.06) !important;
    border: 1px solid rgba(46,230,168,.22) !important;
    color: #eafff5 !important;
  }
}

/* — Шторка ИИ (Design B): уплотняем «жидковатые» внутренние поверхности — */
@media (max-width: 768px) {
  /* чипы-примеры (Сценография/Пьеса/Референсы) + строки-подсказки .omni-example — плотное стекло */
  .omni-examples button, .omni-example {
    background: linear-gradient(150deg, rgba(255,255,255,.10), rgba(46,230,168,.07)), rgba(8,20,16,.78) !important;
    border: 1px solid rgba(46,230,168,.30) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.14) !important;
    color: #eafff5 !important;
  }
  /* контейнер списка подсказок — плотная подложка, чтобы гео не просвечивал полосой */
  .omni-examples {
    background: rgba(6,15,11,.6) !important;
    border-radius: 14px;
    padding: 8px !important;
  }
  /* приветствие / список подсказок — фростед-панель, а не голый текст */
  .omni-welcome, .omni-suggest, .omni-tips {
    background: linear-gradient(155deg, rgba(255,255,255,.06), rgba(46,230,168,.05)), rgba(8,20,16,.58) !important;
    border: 1px solid rgba(255,255,255,.11) !important;
    border-radius: 16px !important;
    padding: 13px 14px !important;
    color: #dff6ea !important;
  }
  /* реф-карточки в выдаче — плотнее */
  .omni-ref-card {
    background: rgba(6,16,12,.66) !important;
    border-color: rgba(46,230,168,.3) !important;
  }
  /* сама панель — чуть плотнее фон, чтобы гео не «просвечивал» слишком сильно */
  .omni-panel {
    background:
      linear-gradient(160deg, rgba(255,255,255,.06), rgba(255,255,255,.015) 45%, rgba(46,230,168,.05)),
      rgba(6,15,11,.9) !important;
  }
}

/* — Никакого реального backdrop-filter на мобиле (Samsung Internet джанит на blur).
   Design B — faux-стекло на градиентах/тенях, blur ему не нужен. Гарантированный
   ноль blur из любого источника (style.css, инлайн-<style>, JS-инжект). Десктоп не трогаем. — */
@media (max-width: 768px) {
  * {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
}

/* ============================================================
   Ассистент как ПОСТОЯННАЯ нижняя строка (Gemini-style) — mobile.
   FAB убран, панель всегда видима строкой: 📎 · 🎛 · поле · ⛶ · ➤.
   Тап по полю разворачивает диалог вверх. Идёт последним — выигрывает каскад.
   ============================================================ */
@media (max-width: 768px) {
  /* FAB больше не нужен — ассистент всегда внизу строкой */
  .omni-fab { display: none !important; }
  .omni-hint-bubble { display: none !important; }

  /* контейнер ассистента — фикс над нав-баром, во всю ширину */
  #omniAssistant {
    position: fixed !important;
    left: 10px !important; right: 10px !important;
    bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important;
    top: auto !important;
    z-index: var(--ta-layer-assistant-mobile-base, 950) !important;
    width: auto !important; max-width: none !important;
    height: auto !important;
    transform: none !important;
    pointer-events: none !important; /* прокликивается мимо строки */
  }

  /* панель = видимая строка (всегда), статично внутри контейнера */
  #omniAssistant .omni-panel {
    position: static !important;
    display: flex !important; flex-direction: column !important;
    width: auto !important; max-width: none !important;
    left: auto !important; right: auto !important; bottom: auto !important; top: auto !important;
    margin: 0 !important;
    padding: 7px !important;
    border-radius: 22px !important;
    background:
      linear-gradient(150deg, rgba(255,255,255,.07), rgba(46,230,168,.05)),
      #081410 !important;
    border: 1px solid rgba(46,230,168,.42) !important;
    box-shadow:
      0 0 0 1px rgba(46,230,168,.14),
      0 16px 38px -18px rgba(46,230,168,.5),
      inset 0 1px 0 rgba(255,255,255,.12) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: none !important;
    max-height: none !important;
    overflow: visible !important;
  }

  /* свёрнуто: показываем только строку-композитор */
  #omniAssistant[data-omni-state="closed"] .omni-head,
  #omniAssistant[data-omni-state="closed"] .omni-histbar,
  #omniAssistant[data-omni-state="closed"] .omni-examples,
  #omniAssistant[data-omni-state="closed"] #omniHistory,
  #omniAssistant[data-omni-state="closed"] .omni-result { display: none !important; }

  /* строка-композитор: одна линия, порядок 📎 🎛 поле ⛶ ➤ */
  #omniAssistant .omni-compose {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 0 !important;
    order: 99;
  }
  #omniAssistant .omni-compose textarea {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    /* авто-рост: от одной строки (44px) до ~5 строк (120px), дальше внутренний скролл (autosize.js) */
    min-height: 44px !important; max-height: 120px !important;
    resize: none !important;
    padding: 11px 14px !important;
    border-radius: 14px !important;
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    color: #eafff5 !important;
  }
  /* круглые второстепенные кнопки строки */
  #omniAssistant .omni-attach-btn,
  #omniAssistant .omni-mixer-btn,
  #omniAssistant .omni-bar-fs {
    display: inline-flex !important; align-items: center; justify-content: center;
    flex: 0 0 auto !important;
    width: 44px !important; height: 44px !important;
    min-width: 44px !important; min-height: 44px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    font-size: 18px !important;
    background: rgba(255,255,255,.05) !important;
    border: 1px solid rgba(255,255,255,.13) !important;
    color: #cffbe9 !important;
  }
  /* отправка — акцент, глиф ➤ (десктоп-⚡ прячем, не меняя разметку) */
  #omniAssistant .omni-send, #omniAssistant #omniAnalyze {
    display: inline-flex !important; align-items: center; justify-content: center;
    flex: 0 0 auto !important;
    width: 46px !important; height: 46px !important;
    min-width: 46px !important; min-height: 46px !important;
    padding: 0 !important;
    border-radius: 50% !important;
    font-size: 0 !important;
    background: linear-gradient(145deg, #2ee6a8, #15ae7a) !important;
    color: #04140d !important;
    border: none !important;
    box-shadow: 0 8px 20px -8px rgba(46,230,168,.9) !important;
  }
  #omniAssistant .omni-send::after, #omniAssistant #omniAnalyze::after {
    content: "➤"; font-size: 20px; line-height: 1;
  }
  /* вторичная кнопка «Открыть инструмент» в строке лишняя */
  #omniAssistant .omni-secondary { display: none !important; }

  /* открыто: диалог растёт ВВЕРХ над строкой (контейнер прибит снизу) */
  #omniAssistant[data-omni-state="open"] .omni-panel {
    max-height: 74dvh !important;
    overflow: hidden !important;
  }
  #omniAssistant[data-omni-state="open"] .omni-histbar { display: flex !important; order: 1; }
  #omniAssistant[data-omni-state="open"] .omni-examples { display: none !important; }
  #omniAssistant[data-omni-state="open"] #omniHistory { order: 2; max-height: 40dvh; overflow-y: auto; }
  #omniAssistant[data-omni-state="open"] .omni-result {
    order: 3;
    flex: 1 1 auto !important;
    overflow-y: auto !important;
    min-height: 0 !important;
    margin-top: 6px;
    pointer-events: auto !important;
  }
  /* голоса Кандинский/… и варианты ответа — обязаны ловить тап поверх pointer-events:none контейнера */
  #omniAssistant .omni-tuner,
  #omniAssistant .omni-tuner-row,
  #omniAssistant .omni-tuner-row button,
  #omniAssistant .omni-option,
  #omniAssistant .omni-close,
  #omniAssistant .omni-attach-chip {
    pointer-events: auto !important;
    position: relative;
    z-index: 3;
  }
  #omniAssistant[data-omni-state="open"] .omni-tuner {
    display: block !important;
    order: 0;
    max-height: none !important;
    overflow: visible !important;
    margin: 0 0 6px !important;
  }
  #omniAssistant .omni-tuner-row {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  #omniAssistant .omni-tuner-row button {
    min-height: 40px !important;
    touch-action: manipulation;
  }
  /* открыто: тонкая шапка только с закрытием (× ), остальные кнопки прячем */
  #omniAssistant[data-omni-state="open"] .omni-head {
    display: flex !important; order: 0;
    justify-content: flex-end !important; padding: 0 2px 4px !important;
  }
  #omniAssistant[data-omni-state="open"] .omni-head .omni-export-btn,
  #omniAssistant[data-omni-state="open"] .omni-head .omni-chat-toggle,
  #omniAssistant[data-omni-state="open"] .omni-head .omni-fs-btn,
  #omniAssistant[data-omni-state="open"] .omni-head .omni-drag-dots { display: none !important; }
  #omniAssistant[data-omni-state="open"] .omni-close {
    display: inline-flex !important; min-width: 38px; min-height: 38px;
  }

  /* ⛶ на весь экран: контейнер разворачивается на весь вьюпорт.
     z выше нижней навигации (у неё z-index 2147482500 из style.css), иначе навбар
     перекрывал бы полноэкранный чат. */
  #omniAssistant.omni-fullscreen {
    left: 0 !important; right: 0 !important; top: 0 !important;
    bottom: 0 !important; z-index: var(--ta-layer-assistant-fullscreen, 2147483000) !important;
  }
  /* в полноэкранном ассистенте прячем навбар — он не должен «плавать» поверх чата */
  body:has(#omniAssistant.omni-fullscreen) #mobileNav,
  body.omni-fullscreen-open #mobileNav,
  #mobileNav.omni-fullscreen-hidden { display: none !important; }
  #omniAssistant.omni-fullscreen .omni-panel {
    height: 100dvh !important; max-height: 100dvh !important;
    border-radius: 0 !important;
    padding: calc(8px + env(safe-area-inset-top, 0px)) 10px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* в полноэкранной ленте (tiktok-свайп) строка-ассистент и гайд-кнопка не нужны — прячем */
  body.mfeed-fs #omniAssistant,
  body.mfeed-fs .dock-launcher { display: none !important; }

  /* гайд-кнопка 📚 не должна лезть под строку */
  .dock-launcher { bottom: calc(154px + env(safe-area-inset-bottom, 0px)) !important; }

  /* контент не прячется под строкой+навбаром */
  .screen.on { padding-bottom: calc(150px + env(safe-area-inset-bottom, 0px)) !important; }
}

/* — Плитки ленты: финальный лоск Design B (акцент-рамка + отклик тапа) — */
@media (max-width: 768px) {
  body:not(.mfeed-fs) #mobileFeed .mfeed-slide {
    border: 1px solid rgba(46,230,168,.22) !important;
    box-shadow:
      0 12px 30px -18px rgba(0,0,0,.85),
      0 0 0 1px rgba(46,230,168,.05),
      inset 0 1px 0 rgba(255,255,255,.10) !important;
    transition: transform .12s var(--mob-ease), box-shadow .2s ease !important;
  }
  body:not(.mfeed-fs) #mobileFeed .mfeed-slide:active {
    transform: scale(.975) !important;
    box-shadow:
      0 10px 24px -16px rgba(0,0,0,.9),
      0 0 0 1px rgba(46,230,168,.35),
      inset 0 1px 0 rgba(255,255,255,.12) !important;
  }
  /* подпись плитки в сетке — компактнее, читаемо */
  body:not(.mfeed-fs) #mobileFeed .mfeed-cap {
    padding: 16px 12px 12px !important;
  }
  body:not(.mfeed-fs) #mobileFeed .mfeed-cap b { font-size: 13px !important; }
  body:not(.mfeed-fs) #mobileFeed .mfeed-cap span { font-size: 11px !important; }
}

/* ============================================================
   Проект-центричный режим — Этап 0: переключатель в кабинете.
   ============================================================ */
@media (max-width: 768px) {
  .ta-mode-switch {
    margin: 4px 0 12px; padding: 12px;
    border-radius: var(--ta-radius, 14px);
    background: rgba(7,20,15,.6);
    border: 1px solid rgba(255,255,255,.1);
  }
  .ta-mode-t {
    font-size: 11px; letter-spacing: .06em; text-transform: uppercase;
    color: var(--ta-ink-3, #8fbfa8); font-weight: 700; margin-bottom: 8px;
  }
  .ta-mode-seg { display: flex; gap: 6px; }
  .ta-mode-seg button {
    flex: 1; min-height: 44px; border-radius: 12px; cursor: pointer;
    font-size: 13.5px; font-weight: 700;
    color: rgba(207,251,233,.82);
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.1);
    transition: transform .12s var(--mob-ease, ease), background .2s, color .2s, border-color .2s;
  }
  .ta-mode-seg button:active { transform: scale(.97); }
  .ta-mode-seg button.on {
    color: #04140d;
    background: linear-gradient(145deg, var(--ta-accent, #2ee6a8), var(--ta-accent-2, #15ae7a));
    border-color: transparent;
    box-shadow: 0 8px 20px -10px rgba(46,230,168,.85);
  }
}

/* ============================================================
   Проект-центричная главная — Этап 2 (только mode-project + мобилка).
   Классические секции главной прячутся; показывается проект-блок. Обратимо.
   ============================================================ */
@media (max-width: 768px) {
  body.mode-project #scr-home > :not(.project-home) { display: none !important; }
  body.mode-project #scr-home { padding-top: 8px !important; }

  .project-home { display: flex; flex-direction: column; padding: 4px 2px 0; }
  .ph-head { display: flex; align-items: center; gap: 10px; padding: 4px 2px 12px; }
  .ph-ic { width: 34px; height: 34px; border-radius: 10px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-size: 17px; background: rgba(255,255,255,.06); border: 1px solid var(--ta-line, rgba(255,255,255,.12)); }
  .ph-title b { font-size: 16px; font-weight: 800; letter-spacing: -.02em; display: block; line-height: 1.15; color: var(--ta-ink, #eafff5); }
  .ph-title span { font-size: 12px; color: var(--ta-ink-3, #8fbfa8); }
  .ph-more { margin-left: auto; color: var(--ta-ink-3, #8fbfa8); font-size: 20px; background: none; border: none; padding: 6px 8px; cursor: pointer; line-height: 1; }

  .ph-card { border-radius: var(--ta-radius-lg, 16px); padding: 14px; margin-bottom: 12px;
    background: linear-gradient(155deg, rgba(255,255,255,.06), rgba(46,230,168,.05)), var(--ta-surface-2, #081410);
    border: 1px solid rgba(46,230,168,.28); box-shadow: 0 14px 34px -20px rgba(0,0,0,.8), inset 0 1px 0 rgba(255,255,255,.1); }
  .ph-kick, .ph-spine-t, .ph-mat-t { font-size: 11px; letter-spacing: .07em; text-transform: uppercase; color: var(--ta-ink-3, #8fbfa8); font-weight: 700; display: block; }
  .ph-step { font-size: 16.5px; font-weight: 700; margin: 6px 0 12px; line-height: 1.3; color: var(--ta-ink, #eafff5); }
  .ph-cta { display: block; width: 100%; text-align: center; padding: 14px; border-radius: 13px; font-size: 15px; font-weight: 800; color: #04140d; border: none; cursor: pointer;
    background: linear-gradient(145deg, var(--ta-accent, #2ee6a8), var(--ta-accent-2, #15ae7a)); box-shadow: 0 10px 22px -10px rgba(46,230,168,.85); }
  .ph-cta:active { transform: scale(.985); }

  .ph-spine { border-radius: var(--ta-radius-lg, 16px); padding: 13px 12px; margin-bottom: 12px; background: rgba(7,20,15,.66); border: 1px solid var(--ta-line, rgba(255,255,255,.1)); }
  .ph-steps { display: flex; align-items: center; margin-top: 10px; }
  .ph-dot { flex: 0 0 auto; width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,.14); border: 2px solid rgba(255,255,255,.2); }
  .ph-dot.done { background: var(--ta-accent, #2ee6a8); border-color: var(--ta-accent, #2ee6a8); }
  .ph-dot.cur { background: #0a1712; border-color: var(--ta-accent, #2ee6a8); box-shadow: 0 0 0 4px rgba(46,230,168,.25); }
  .ph-seg { flex: 1; height: 2px; background: rgba(255,255,255,.12); }
  .ph-seg.done { background: var(--ta-accent, #2ee6a8); }
  .ph-labels { display: flex; justify-content: space-between; margin-top: 8px; font-size: 9.5px; color: var(--ta-ink-3, #8fbfa8); }
  .ph-labels .cur { color: var(--ta-ink, #eafff5); font-weight: 700; }
  .ph-stagebtns { display: flex; gap: 8px; margin-top: 12px; }
  .ph-stagebtns button { flex: 1; min-height: 40px; border-radius: 10px; font-size: 12.5px; font-weight: 700; cursor: pointer;
    color: rgba(207,251,233,.82); background: rgba(255,255,255,.05); border: 1px solid var(--ta-line, rgba(255,255,255,.1)); }
  .ph-stagebtns button:active { transform: scale(.97); }

  .ph-mats { display: flex; gap: 8px; margin-top: 8px; margin-bottom: 4px; }
  .ph-mat { position: relative; flex: 1; min-width: 0; aspect-ratio: 1; border-radius: 12px; display: flex; align-items: flex-end; padding: 0; overflow: hidden; font: 800 10px/1.2 inherit; color: #dff6ea; cursor: pointer;
    background: linear-gradient(160deg, rgba(46,230,168,.14), rgba(90,209,255,.08)), #08150f; border: 1px solid var(--ta-line, rgba(255,255,255,.1)); }
  .ph-mat img,.ph-mat video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .ph-mat span { position:relative; z-index:1; display:block; width:100%; padding:20px 7px 7px; text-align:left; background:linear-gradient(transparent,rgba(1,10,7,.86)); }
  .ph-mat-empty { flex-basis:100%; aspect-ratio:auto; min-height:76px; align-items:center; justify-content:center; padding:12px; text-align:center; color:var(--ta-ink-3,#8fbfa8); }
}

/* ============================================================
   Аудит «первый мобильный визит» (390px): гаситель горизонтального
   overflow. Декор не должен раздвигать документ (docW=459 при 390):
   клип на герое и его контейнере, аврора не шире героя, кнопкам
   кейсов «Костюм»/«3D» — перенос вместо выпирающего ряда.
   ============================================================ */
@media (max-width: 768px) {
  /* герой: страховочный клип (декор .wow-hero-aurora, декоративные <i>
     и transform-анимации не выходят за рамку и не растят scrollWidth) */
  #scr-home .hero.theatre-cockpit,
  .wow-hero.theatre-cockpit,
  .wow-hero { overflow: clip !important; }
  #scr-home { overflow-x: clip; }

  /* аврора: не шире героя (inset:-20% давал +40% ширины) и своя пейнт-зона */
  .wow-hero-aurora {
    left: 0 !important;
    right: 0 !important;
    max-width: 100% !important;
    contain: paint;
  }

  /* декоративные <i> (боке/звёзды) — всегда в клип-контейнерах */
  .wow-ambient, .hdr-stars { overflow: clip !important; }

  /* кнопки кейсов до/после («Сценография»…«Костюм», «3D»): перенос строк,
     ничего не выпирает за экран и не требует скрытого скролла */
  .home-ba-tabs {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
  }
  .home-ba-tabs button {
    min-width: 0 !important;
    flex: 0 1 auto !important;
    white-space: nowrap;
  }
}