/**
 * Mobile perf — ลื่นเหมือนร้านเบา: ลดเอฟเฟกต์หนัก, หยุดตอนสกอลล์
 */

@media (max-width: 1023px) {
  html {
    scroll-behavior: auto !important;
  }

  /* CSS snow เบา — ใช้ compositor */
  .css-snow {
    display: block !important;
    position: fixed !important;
    inset: 0 !important;
    pointer-events: none !important;
    z-index: 1 !important;
    overflow: hidden !important;
    contain: strict;
    transform: translateZ(0);
  }
  .css-snow i {
    position: absolute;
    top: -8px;
    width: var(--s, 2px);
    height: var(--s, 2px);
    border-radius: 50%;
    background: var(--c, #fff);
    opacity: var(--o, 0.45);
    animation: rxSnowFall var(--d, 10s) linear var(--dl, 0s) infinite;
    will-change: transform;
    backface-visibility: hidden;
  }
  /* หยุดหิมะเฉพาะมือถือ — โน้ตบุ๊กขยับตลอด */
  @media (max-width: 767px) {
    html.is-scrolling .css-snow,
    html.particles-paused .css-snow,
    html.is-scrolling .css-snow i,
    html.particles-paused .css-snow i {
      animation-play-state: paused !important;
    }
  }

  /* ปิด canvas บนมือถือ */
  #storeSnowCanvas {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .purchase-feed-track-wrap {
    mask-image: none !important;
    -webkit-mask-image: none !important;
    overflow: hidden;
    contain: layout style;
  }

  .purchase-feed-panel {
    contain: layout style;
    overflow: hidden;
  }

  .purchase-feed-card {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(var(--accent-rgb), 0.14) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.14) !important;
    transform: none !important;
  }

  .purchase-feed-card--new {
    animation: none !important;
  }

  .purchase-feed-marquee.is-css-run {
    animation: pfMarqueeScroll var(--pf-marquee-dur, 45s) linear infinite;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }

  .purchase-feed-marquee.is-paused.is-css-run {
    animation-play-state: paused !important;
  }
  @media (max-width: 767px) {
    html.is-scrolling .purchase-feed-marquee.is-css-run {
      animation-play-state: paused !important;
    }
  }

  /* ลด blur / filter ที่กิน GPU */
  .orb,
  body::before,
  .store-main::before,
  .store-main::after {
    filter: none !important;
    animation: none !important;
  }
  .orb {
    opacity: 0.35 !important;
  }

  /* ปิดเคอร์เซอร์คัสตอม */
  #cx-dot, #cx-ring {
    display: none !important;
  }

  .faq-section,
  .testi-section,
  .discord-section,
  .store-extra,
  .about-section {
    content-visibility: auto;
    contain-intrinsic-size: auto 360px;
  }

  @media (max-width: 767px) {
    html.is-scrolling * {
      transition-duration: 0.01ms !important;
    }
  }
}

@keyframes rxSnowFall {
  0% { transform: translate3d(0, -10px, 0); }
  100% { transform: translate3d(12px, 110vh, 0); }
}

@keyframes pfMarqueeScroll {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(calc(-1 * var(--pf-marquee-shift, 0px)), 0, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .purchase-feed-marquee.is-css-run,
  .css-snow i {
    animation: none !important;
  }
}
