/* NOXER V31: the music hotbar is not a permanent part of the page.
   It slides in ONLY when NOXER audio is playing, or while the user
   deliberately opens the queue / edits timed lyrics. */
#nx30Hotbar {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
  transition:
    opacity 360ms ease,
    transform 460ms cubic-bezier(.18,.82,.18,1),
    visibility 0s,
    width 440ms cubic-bezier(.2,.75,.2,1);
}
/* V30 already toggles .nx30-playing on the actual HTMLAudioElement
   play and pause events, so no unreliable polling is necessary. */
#nx30Hotbar:not(.nx30-playing):not(.nx30-list-open):not(.nx31-editor-open) {
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translate(-50%, -130%) !important;
  pointer-events: none !important;
  transition:
    opacity 300ms ease,
    transform 430ms cubic-bezier(.45,.0,.72,.18),
    visibility 0s linear 430ms,
    width 440ms cubic-bezier(.2,.75,.2,1);
}
/* Keep lyrics visible while actively editing them, but not otherwise. */
#nx30Hotbar.nx31-editor-open { opacity: 1; visibility: visible; transform: translate(-50%,0); }
@media (prefers-reduced-motion: reduce) {
  #nx30Hotbar, #nx30Hotbar:not(.nx30-playing):not(.nx30-list-open):not(.nx31-editor-open) {
    transition: none !important;
  }
}