/* NarraSpace Performance V1 | 2026-09-25
   Scope: public mobile/PWA GPU cost only. No layout redesign, no admin changes. */

/* Later legacy rules reintroduced large backdrop blurs after Stability Mode.
   On coarse/touch and compact screens, prefer opaque/translucent surfaces over
   live background sampling. This is particularly important in iOS Safari. */
@media (max-width: 64rem), (pointer: coarse) {
  body:not(.admin-mode) #nav-links,
  body:not(.admin-mode) .small-device-nav-scrim,
  body:not(.admin-mode) #music-player-modal.music-player-modal,
  body:not(.admin-mode) #music-player-modal .music-player-copy,
  body:not(.admin-mode) .story-reading-toolbar button,
  body:not(.admin-mode) #chat-panel,
  body:not(.admin-mode) #poopo-guide,
  body:not(.admin-mode) .audience-gate-backdrop,
  body:not(.admin-mode) #creator-qr-modal.ns-creator-qr-overlay,
  body:not(.admin-mode) .creator-profile-overlay {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* Keep the Listening Room atmosphere while lowering simultaneous compositor
     work on phones/tablets. The first eight particles remain visible. */
  body:not(.admin-mode) #music-player-modal .music-room-firefly:nth-child(n+9) {
    display: none !important;
  }

  /* Large fixed surfaces should not be promoted indefinitely when idle. */
  body:not(.admin-mode) #chat-panel,
  body:not(.admin-mode) #poopo-guide,
  body:not(.admin-mode) #music-player-modal,
  body:not(.admin-mode) #story-modal {
    will-change: auto !important;
  }
}

/* Hidden media rooms should never keep decorative particle work alive. */
#music-player-modal[hidden] .music-room-firefly,
#music-player-modal:not(.show) .music-room-firefly {
  animation-play-state: paused !important;
}

/* Preserve user accessibility preference globally without changing normal motion. */
@media (prefers-reduced-motion: reduce) {
  body:not(.admin-mode) .narra-firefly,
  body:not(.admin-mode) .music-room-firefly {
    animation: none !important;
  }
}