html.mobile-perf body::before {
  opacity: 0.08 !important;
}

html.mobile-perf nav {
  backdrop-filter: none !important;
}

html.mobile-perf #cur,
html.mobile-perf .p-blob,
html.mobile-perf .hero-scroll::after,
html.mobile-perf .mq-track,
html.mobile-perf .play-indicator.flash,
html.mobile-perf .holo-showcase::before,
html.mobile-perf .holo-showcase::after,
html.mobile-perf .holo-beam {
  animation: none !important;
}

html.mobile-perf .p-blob,
html.mobile-perf .holo-showcase::before,
html.mobile-perf .holo-showcase::after,
html.mobile-perf .holo-beam {
  display: none !important;
}

html.mobile-perf .rev,
html.mobile-perf .pi,
html.mobile-perf .chess-item,
html.mobile-perf .carousel-track,
html.mobile-perf .pi img,
html.mobile-perf .carousel-item img,
html.mobile-perf .vid-item video,
html.mobile-perf .toggle-btn,
html.mobile-perf .service-chip,
html.mobile-perf .outline-btn,
html.mobile-perf .see-btn {
  transition-duration: 0.18s !important;
}

html.mobile-perf .mq-track {
  animation-play-state: paused !important;
}

html.mobile-perf .mq-track.mobile-running {
  animation-play-state: running !important;
}

@media (max-width: 900px) {
  html.mobile-perf .hero-curve-shell {
    clip-path: none !important;
    transform: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  html.mobile-perf .hero-curve-shell::before,
  html.mobile-perf .hero-curve-shell::after,
  html.mobile-perf .hero-curve-glass {
    display: none !important;
  }

  html.mobile-perf #heroCurveTrack,
  html.mobile-perf #carouselTrack {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    touch-action: pan-x !important;
    will-change: auto !important;
    transform: none !important;
    scroll-snap-type: x proximity;
  }

  html.mobile-perf #heroCurveTrack::-webkit-scrollbar,
  html.mobile-perf #carouselTrack::-webkit-scrollbar {
    display: none;
  }

  html.mobile-perf #heroCurveTrack {
    gap: 8px !important;
    padding: 0 18px !important;
  }

  html.mobile-perf #carouselTrack {
    gap: 8px !important;
    padding: 0 18px 4px !important;
  }

  html.mobile-perf .hero-curve-item,
  html.mobile-perf .carousel-item {
    scroll-snap-align: start;
  }

  html.mobile-perf .hero-curve-item {
    flex: 0 0 58vw !important;
  }

  html.mobile-perf .carousel-item {
    flex: 0 0 72vw !important;
  }

  html.mobile-perf .carousel-outer {
    overflow: visible !important;
  }

  html.mobile-perf .play-indicator {
    backdrop-filter: none !important;
    background: rgba(240, 237, 232, 0.18) !important;
  }
}
