/* 1) Глобально убираем горизонтальный скролл */
html, body { overflow-x: hidden; }
* { box-sizing: border-box; }
img, video { max-width: 100%; height: auto; display: block; }

/* 2) Фикс нижней мобильной панели (табар) — не 100vw, а по краям экрана */
@media (max-width: 768px){
  /* подхватит типичные названия; если у тебя свой класс — добавь его сюда */
  .mobile-tabbar,
  .bottom-nav,
  .tabbar,
  .fixed-bottom,
  .app-bottom,
  .mobile-bottom {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    width: auto !important;      /* критично: НЕ 100vw */
    max-width: 100% !important;
    overflow-x: clip;            /* на случай тени/внутренних вылетов */
    box-sizing: border-box;
    padding-bottom: env(safe-area-inset-bottom);
    transform: translateZ(0);    /* убирает субпиксельные сдвиги на iOS */
  }

  /* если где-то в коде есть элементы с явным width:100vw — срежем на мобиле */
  [style*="100vw"] { width: 100% !important; }
}