/* VYSHKA · mobile 390 gate (2026-07-31)
 * Load AFTER vyshka-ecosystem-one.css.
 * Goals @≤420: no document overflow-X · interactive chrome ≥44×44 · clip decorative bleed.
 */
html {
  overflow-x: clip;
}
@supports not (overflow: clip) {
  html { overflow-x: hidden; }
}
body {
  max-width: 100%;
  overflow-x: clip;
}
@supports not (overflow: clip) {
  body { overflow-x: hidden; }
}

/* Decorative atmosphere may paint past the stage — never scroll the page */
.hero-aurora,
.halo,
.halo.outer,
.halo.middle,
.halo.inner,
.ld-orb,
.constellation,
.scene,
[aria-hidden="true"].hero-aurora {
  max-width: none;
}

@media (max-width: 420px) {
  /* Document + stage */
  html, body, .shell, .app, .scene, main, .hero, .vv-shell, .ld-shell, .remote-shell {
    max-width: 100% !important;
  }

  /* Clip decorative bleed without killing intentional carousels */
  .constellation,
  .hero,
  .ld-hero-visual,
  .vv-home,
  .remote-hero,
  .scene,
  body[data-page="account"] .scene,
  body[data-page="auth"] .scene,
  body[data-page="voice"] .stage,
  .app > .stage {
    overflow-x: clip;
  }
  @supports not (overflow: clip) {
    .constellation,
    .hero,
    .ld-hero-visual,
    .vv-home,
    .remote-hero,
    .scene,
    body[data-page="account"] .scene,
    body[data-page="auth"] .scene,
    body[data-page="voice"] .stage,
    .app > .stage { overflow-x: hidden; }
  }

  /* Account halo must not widen document scrollWidth */
  body[data-page="account"] .halo,
  body[data-page="account"] .halo.outer,
  body[data-page="account"] .halo.middle,
  body[data-page="account"] .halo.inner,
  body[data-page="auth"] .halo {
    max-width: 100% !important;
    contain: paint;
  }
  body[data-page="account"] .scene::before,
  body[data-page="account"] .scene::after {
    width: min(48vw, 280px) !important;
    height: min(48vw, 280px) !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  /* Messenger filters: fit «Избранное» @390 — tighten chips, contain OX */
  body[data-page="messenger"] .app > .chatlist {
    min-width: 0 !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  .tg-filters {
    max-width: 100% !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    gap: 4px !important;
    padding: 8px 10px 6px !important;
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .tg-filters::-webkit-scrollbar { display: none; }
  .tg-filter {
    flex: 0 0 auto !important;
    min-height: 44px !important;
    padding: 0 12px !important;
    font-size: 13px !important;
  }

  /* Voice stage width clamp @390 */
  body[data-page="voice"] .stage,
  body[data-page="voice"] .app > .stage {
    max-width: 100vw !important;
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  /* Account constellation — fit ≤390 content width */
  body[data-page="account"] .constellation {
    margin: 0 !important;
    transform: none !important;
    min-height: 300px !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    position: relative;
  }
  body[data-page="account"] .halo.outer {
    width: min(300px, 78vw) !important;
    height: min(300px, 78vw) !important;
  }
  body[data-page="account"] .halo.middle {
    width: min(220px, 58vw) !important;
    height: min(220px, 58vw) !important;
  }
  body[data-page="account"] .halo.inner {
    width: min(150px, 40vw) !important;
    height: min(150px, 40vw) !important;
  }
  body[data-page="account"] .product {
    width: min(118px, 30vw) !important;
    min-height: 72px !important;
  }
  body[data-page="account"] .p1,
  body[data-page="account"] .p3 { left: 4px !important; right: auto !important; }
  body[data-page="account"] .p2,
  body[data-page="account"] .p4 { right: 4px !important; left: auto !important; }

  /* Brand / theme / common chrome ≥44 */
  a.brand,
  .brand,
  .vv-brand,
  .nav .brand,
  header .brand {
    min-height: 44px !important;
    align-items: center !important;
  }
  .btn.theme,
  button.theme,
  #theme {
    min-width: 44px !important;
    width: 44px !important;
    min-height: 44px !important;
    height: 44px !important;
    padding: 0 !important;
  }

  /* Auth password toggle — kill 36px !important regression */
  .pw-toggle,
  .auth-card .pw-toggle,
  button.pw-toggle {
    min-width: 44px !important;
    min-height: 44px !important;
    width: 44px !important;
    height: 44px !important;
  }

  /* Find modes + QR actions */
  body[data-page="find"] .mode,
  .modes .mode {
    min-height: 44px !important;
    padding: 0 14px !important;
  }
  body[data-page="find"] .primary,
  body[data-page="find"] label.file,
  #btnMyQr {
    min-height: 44px !important;
  }

  /* Video chrome — beat later inline ≤42 overrides */
  .vv-btn,
  .vv-btn.primary,
  .vv-search button,
  .vv-chip,
  .vv-story-actions .vv-btn,
  .vv-guest-actions .vv-btn,
  .vv-actions .vv-btn,
  .vv-watch-bridges .vv-btn,
  .vv-top-actions .vv-btn {
    min-height: 44px !important;
  }
  .vv-search-mode {
    min-height: 44px !important;
    padding: 0 12px !important;
  }
  .vv-brand {
    min-height: 44px !important;
  }

  /* Account auth tabs / text buttons */
  .tabs button,
  #tab-sms, #tab-password, #tab-qr,
  .text-button {
    min-height: 44px !important;
  }

  /* Voice / index prose ecosystem links in first screens */
  a[href="https://vyshka.cloud/"],
  a[href="https://vyshka.cloud"] {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding-inline: 4px;
  }
  .vv-stories {
    overflow-x: auto !important;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
  }

  /* Leads */
  .ld-chip,
  .ld-chip.primary,
  a.ld-chip {
    min-height: 44px !important;
  }
  .ld-orb {
    inset: auto !important;
    max-width: 70vw !important;
    pointer-events: none;
  }
  .ld-hero-visual {
    overflow: hidden !important;
  }

  /* Files view toggle / filter chips */
  .view-toggle button {
    min-width: 44px !important;
    min-height: 44px !important;
    width: 44px !important;
    height: 44px !important;
  }
  .file-filter button,
  .fm-filters button,
  .filters button {
    min-height: 44px !important;
  }

  /* AI composer / chips */
  body[data-page="ai"] .link,
  body[data-page="ai"] .icon,
  body[data-page="ai"] .send,
  body[data-page="ai"] .chip,
  body[data-page="ai"] .state-action {
    min-height: 44px !important;
  }
  body[data-page="ai"] .send {
    min-width: 44px !important;
    width: 44px !important;
  }
  body[data-page="ai"] .icon {
    min-width: 44px !important;
    width: 44px !important;
  }

  /* Remote */
  .remote-btn,
  .remote-nav a,
  .remote-pill {
    min-height: 44px !important;
  }

  /* Eco-assist suggestion chips — keep inside panel, don't bleed page */
  .vy-eco-assist__chips {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-x: contain;
  }
  .vy-eco-assist__chip {
    min-height: 44px !important;
    flex: 0 0 auto;
  }

  /* Store / voice / messenger shared shell buttons */
  .topbar .btn,
  .tb-right .btn,
  .st-cats .tab,
  .reply-bar .rb-close,
  .th-head .actions button {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* Remote brand row */
  .remote-brand {
    min-height: 44px !important;
  }

  /* Account authorize / rights holder */
  .rightsholder a,
  .corp-link {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 44px !important;
  }

  /* Find demo chips */
  .demo-link {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* Remote / shared vshell chrome visible on product pages */
  .vshell-burger,
  button.vshell-burger,
  .mic,
  button.mic,
  .vchan,
  a.vchan,
  .chsw button {
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* Uslugi secondary nav chips in horizontal rail */
  .nav-secondary,
  a.nav-secondary {
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  /* QA_MATRIX_390_2030 · clear ONE switcher FAB corner (bottom-right).
   * Assist parks left of 52×52 switcher; analytics settings → bottom-left. */
  html body .vy-eco-assist,
  html body .vy-eco-assist[data-open="false"],
  html body .vy-eco-assist[data-open="true"] {
    position: fixed !important;
    inset: unset !important;
    top: unset !important;
    right: max(78px, calc(66px + env(safe-area-inset-right, 0px))) !important;
    left: auto !important;
    bottom: max(18px, calc(18px + env(safe-area-inset-bottom, 0px))) !important;
    z-index: 1450 !important;
    width: fit-content !important;
    max-width: min(100vw - 24px, 420px) !important;
    margin: 0 !important;
    transform: none !important;
  }
  html body .vy-eco-assist:not([data-open="true"]) .vy-eco-assist__panel {
    display: none !important;
  }
  html body:has(.vm-tabbar) .vy-eco-assist {
    bottom: max(86px, calc(72px + env(safe-area-inset-bottom, 0px))) !important;
  }
  html body .vy-analytics-settings {
    right: auto !important;
    left: max(12px, env(safe-area-inset-left, 0px)) !important;
    bottom: max(18px, calc(18px + env(safe-area-inset-bottom, 0px))) !important;
    z-index: 1400 !important;
    min-width: 44px !important;
    min-height: 44px !important;
  }

  /* Voice landing footer legal / mailto links */
  footer.foot a,
  .foot a,
  footer a[href="/privacy"],
  footer a[href="/rules"],
  footer a[href^="mailto:"] {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 44px !important;
  }

  /* Voice landing header / CTA chrome */
  .top a,
  .top .btn,
  header .btn,
  .nav a,
  a.logo,
  .brand a,
  .cta-secondary,
  button.cta-secondary,
  .hero button,
  .hero a.btn {
    min-width: 44px !important;
    min-height: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* VOC_SWARM_07_MOBILE390 · Voice landing taps that were <44 */
  a.nav-login,
  .nav a.nav-login,
  a[data-nav-key="login"] {
    min-width: 44px !important;
    min-height: 44px !important;
    padding: 0 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  .foot-col a,
  .foot-col button,
  .foot button[data-order],
  button[data-order="free"],
  .audience-cta .btn,
  .audience-cta button,
  .audience-cta a {
    min-height: 44px !important;
    min-width: 44px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    padding: 0 12px !important;
    margin: 0 0 8px !important;
  }

  /* Inline prose links in Voice sections (Messenger / Accounт) */
  .sec-head p a,
  .vv-join__hint a,
  .vv-join__lede a,
  .vv-stream__cta,
  a.vv-stream__cta,
  .vv-personal a,
  main p a[href*="messenger"],
  main p a[href*="account"] {
    display: inline-flex !important;
    align-items: center !important;
    min-height: 44px !important;
    padding-inline: 4px !important;
    box-sizing: border-box !important;
  }

  /* Voice app chrome @390 — head/ctl/burger ≥44 */
  body[data-page="voice"] .stage-head .vm-headbtn,
  body[data-page="voice"] .vm-headbtn,
  body[data-page="voice"] .vshell-burger,
  body[data-page="voice"] button.vshell-burger,
  body[data-page="voice"] .ctl,
  body[data-page="voice"] .controls .ctl,
  body[data-page="voice"] .pc-btns .ctl,
  body[data-page="voice"] .m-burger,
  body[data-page="voice"] .m-back {
    min-width: 44px !important;
    min-height: 44px !important;
    width: auto !important;
    height: auto !important;
    box-sizing: border-box !important;
  }
  body[data-page="voice"] .stage-head .vm-headbtn,
  body[data-page="voice"] .vm-headbtn,
  body[data-page="voice"] .vshell-burger,
  body[data-page="voice"] .ctl:not(.leave) {
    width: 44px !important;
    height: 44px !important;
  }

  /* Absolute kill bottom junk dock on Voice surfaces @390 */
  body[data-page="voice"] .vm-tabbar,
  body[data-page="voice"] .mtabbar,
  body[data-page="voice"] nav.mtabbar,
  body[data-page="voice"] .dsnav,
  html body[data-page="voice"] .vm-tabbar,
  html body[data-page="voice"] .mtabbar {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    height: 0 !important;
    max-height: 0 !important;
    opacity: 0 !important;
  }
}