/* Mobile scroll/compositor hardening for the Marketing Engine.
   Keep the Lumonorra visual identity without forcing Android/iOS WebViews to
   continuously recomposite animated fixed layers through backdrop filters. */

html {
  scroll-behavior: auto;
}

/* Promote only the two controls that actually need to remain attached to the
   viewport. Avoid blanket will-change, which can consume extra GPU memory. */
.brandbar,
.bottom-nav {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}

@media (max-width: 820px), (hover: none) and (pointer: coarse) {
  /* Full-screen fixed decorative layers are expensive while scrolling in a
     WebView. Keep one static star field in document space and remove the
     second blurred/animated layer on touch-first devices. */
  body::before {
    display: none;
  }

  .stars {
    position: absolute;
    animation: none !important;
    filter: none !important;
    transform: none !important;
    opacity: .48;
    contain: strict;
  }

  .stars-b {
    display: none;
  }

  /* Backdrop blur over moving content is the main repaint hotspot. The cards
     retain their existing gradients, borders and shadows, so removing the
     live blur does not flatten the interface. */
  .card,
  .brandbar,
  .bottom-nav {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .brandbar {
    background: linear-gradient(180deg, rgba(2, 6, 17, .995) 72%, rgba(2, 6, 17, .94) 100%);
  }

  .bottom-nav {
    background: rgba(5, 14, 31, .985);
  }

  /* Avoid accidental smooth-scroll animations while switching dashboard
     sections. Native touch momentum remains untouched. */
  html,
  body {
    scroll-behavior: auto !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .stars,
  .stars::before,
  .stars::after {
    animation: none !important;
    transform: none !important;
  }

  .stars-b {
    display: none;
  }

  html,
  body {
    scroll-behavior: auto !important;
  }
}