/* =====================================================================
 *  VibeDial — Mobile layout fixes  (vibedial-mobile-fix.css)  2026-07
 * ---------------------------------------------------------------------
 *  Additive overrides, loaded LAST so they win. Fixes two confirmed
 *  mobile collisions where bottom-anchored floating chrome landed on the
 *  player's transport controls (.transport occupies the lower third of
 *  the handheld player view):
 *
 *   1. #toast (z-200) was anchored bottom-center and overlapped the
 *      transport row + volume slider — e.g. "Reconnecting…" printed right
 *      across the play/skip buttons. Moved to the top on mobile, where it
 *      never touches the controls, dock, or FAB and stays tappable.
 *
 *   2. .vdp-fab (the ⌘ command button, z-9997) sat bottom-right on top of
 *      the transport controls in the player view. Relocated to the clear
 *      top-right corner on the player view only; list/discover views keep
 *      it above the dock (standard FAB placement over a scrolling list).
 *
 *  Nothing here touches the record-player aesthetic — it only moves two
 *  floating overlays out of the controls' way.
 * ===================================================================== */

@media (max-width: 820px) {

  /* --- 1. Toast to the top on mobile --- */
  .toast {
    bottom: auto !important;
    top: calc(env(safe-area-inset-top, 0px) + 14px);
    transform: translateX(-50%) translateY(-16px);
  }
  .toast.show,
  .toast.is-visible,
  .toast[data-show="true"] {
    transform: translateX(-50%) translateY(0);
  }

  /* --- 2. Command FAB removed on mobile --- unnecessary and gets in the way;
     the search box + Quick Vibes cover its function. (Desktop uses the ⌘K chip
     in the sidebar header, which is unaffected.) --- */
  .vdp-fab { display: none !important; }
}
