/* Explorar → reel: zoom do card para o player (estilo RedNote) */
.rf-explore-reels-zoom-layer {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  pointer-events: none;
  visibility: hidden;
}
.rf-explore-reels-zoom-layer.is-on {
  visibility: visible;
  pointer-events: auto;
}
.rf-explore-reels-zoom-shade {
  position: absolute;
  inset: 0;
  background: #000;
  opacity: 0;
  transition: opacity 0.34s cubic-bezier(0.32, 0.72, 0, 1);
}
.rf-explore-reels-zoom-layer.is-shaded .rf-explore-reels-zoom-shade {
  opacity: 0.58;
}
body.rf-explore-reel-zoom-overlay .rf-explore-reels-zoom-layer.is-shaded .rf-explore-reels-zoom-shade {
  opacity: 0.72;
}
.rf-explore-reels-zoom-layer.is-fading .rf-explore-reels-zoom-shade {
  opacity: 0;
  transition-duration: 0.14s;
}
.rf-explore-reels-zoom-ghost {
  position: fixed;
  overflow: hidden;
  background: #111 center / contain no-repeat;
  transform-origin: top left;
  will-change: transform, opacity;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.rf-explore-reels-zoom-ghost video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  background: #000;
}
.rf-explore-post-card.rf-explore-zoom-source-dim {
  opacity: 0.2;
}
.rf-feed-reels-viewer.on.rf-explore-reel-zoom-pending {
  background: transparent !important;
}
.rf-feed-reels-viewer.on.rf-explore-reel-zoom-pending .rf-feed-reels-track {
  visibility: hidden !important;
}
.rf-feed-reels-viewer.on.rf-explore-reel-zoom-pending .rf-feed-reels-header-bar,
.rf-feed-reels-viewer.on.rf-explore-reel-zoom-pending .rf-feed-reels-actions,
.rf-feed-reels-viewer.on.rf-explore-reel-zoom-pending .rf-feed-reels-lower,
.rf-feed-reels-viewer.on.rf-explore-reel-zoom-pending .rf-feed-reels-bottom,
.rf-feed-reels-viewer.on.rf-explore-reel-zoom-pending > .rf-feed-reels-sound-btn {
  opacity: 0;
  pointer-events: none;
}

/* Durante o zoom: some chrome do Explorar (volta ao terminar) */
body.rf-explore-reel-zoom-active .rf-shell > .rf-header,
body.rf-explore-reel-zoom-active header.rf-header,
body.rf-explore-reel-zoom-active .rf-bottom-nav,
body.rf-explore-reel-zoom-active .rf-explore-topbar,
body.rf-explore-reel-zoom-active .rf-desktop-rail {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.22s ease;
}
body.rf-explore-reel-zoom-active .rf-explore {
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .rf-explore-reels-zoom-shade,
  .rf-explore-reels-zoom-ghost {
    transition-duration: 0.01ms !important;
  }
}