/* Barra superior (#topbar) y pestaña Máster del panel (#pane-master) en el móvil — 2026-10-10.
   Solo RECOLOCA con media queries: ningún control cambia de id ni de comportamiento y tablet y
   ordenador no cambian (≥ 768 px, el mismo corte que css/ctrl-view-movil.css; a 768 la barra de
   una línea aún cabe entera, medido en Chromium).
   Criterio de la APK (native/src/shells/TopBar.tsx, commit 56a060bf): en teléfono vertical la barra
   pasa a DOS líneas en vez de salirse por la derecha — arriba el logo y lo imprescindible (idioma,
   ⛶, Play/Detener, cuenta: Play SIEMPRE visible), debajo los chips de show (audio, loops, LIVE,
   plan), que envuelven si hace falta. La barra crece de alto (es fija sobre el máster; el panel
   ancla abajo) y lo que hoy flota justo debajo de ella con `top` fijo —el chip de las apps
   (#cs-chip), los botones Cast / Dual screen del overlay (#vo-cast, #vo-newwin) y los
   toasts— baja con ella: con `anchor()` donde el navegador lo tiene (Chrome 125+; #cs-chip va
   DETRÁS de #topbar en el DOM por eso) y, si no, con el alto de las dos líneas medido en Chromium
   (--ld-topbar-h). Los desplazamientos respecto al borde inferior de la barra son los de siempre
   (6 / 38 / 8 px); Cast, cuando está, se intercala y Dual screen baja debajo de él. */
@media (max-width:767px){
  :root{--ld-topbar-h:70px;}
  #topbar{height:auto;min-height:50px;flex-wrap:wrap;row-gap:4px;padding:6px 10px;anchor-name:--ld-topbar;}
  /* Línea 1: logo (se corta antes que empujar el Play) + acciones (nunca encogen). */
  .t-logo{order:1;flex:1 1 0;min-width:0;}
  .t-wm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  .t-right{order:2;flex:none;}
  /* Línea 2: los chips de show a todo el ancho; envuelven si no caben. */
  .t-mid{order:3;flex:0 0 100%;flex-wrap:wrap;gap:4px 5px;}
  #cs-chip{top:calc(var(--ld-topbar-h) + 6px);top:calc(anchor(--ld-topbar bottom) + 6px);}
  /* Los botones del overlay son hijos absolutos de #vis-overlay (fijo a toda la pantalla): para que
     `anchor()` los acepte su bloque contenedor debe ser el viewport, como el de la barra → fijos
     (#vis-overlay delante: gana a `#vis-overlay .vo-btn{position:absolute}`). */
  #vis-overlay #vo-cast,#vis-overlay #vo-newwin{position:fixed;top:calc(var(--ld-topbar-h) + 38px);top:calc(anchor(--ld-topbar bottom) + 38px);}
  #vis-overlay #vo-cast:not([hidden])~#vo-newwin{top:calc(var(--ld-topbar-h) + 82px);top:calc(anchor(--ld-topbar bottom) + 82px);}
  .toast{top:calc(var(--ld-topbar-h) + 8px);top:calc(anchor(--ld-topbar bottom) + 8px);}

  /* Pestaña Máster: velocidad + audio + BPM (.m-speed-audio-row) no cabe en una línea (392 px):
     cada bloque baja de línea en vez de salirse (el panel ya no desplaza en horizontal). */
  .m-speed-audio-row,.m-audio-toggle{flex-wrap:wrap;row-gap:4px;}
  /* Auto · Tinte · Tono cabe también en español (a 360 px «Tinte» sacaba el valor 5 px del panel):
     el deslizador no impone su ancho intrínseco (misma trampa que #cv-sl-hue en ctrl-view-movil.css). */
  #sl-hue,#pane-master .ctrl:has(>#sl-hue){min-width:0;}
  /* Vídeos + mini: COLUMNA, como el máster extendido en el móvil (ctrl-view-movil.css) y la APK
     (native/src/features/output/mediaMonitorLayout.ts «stacked»): los pads usan el ancho entero a
     4 columnas visibles y el mini va DEBAJO a todo el ancho con la proporción del programa
     (--ld-program-aspect, js/render/miniMonitorBox.js), dentro de un sobre cuadrado del ancho del
     contenido con el tope de media pantalla y el del visor del panel (--ld-panel-visor, APK
     `panelStackedMiniEnvelope`): un 9:16 cabe de una pieza sin desplazarse. El sobre .m-mm-wrap deja
     de reservar la caja 16:9 (aquí los pads no están al lado: nada se mueve al cambiar de formato). */
  .vp-row{flex-direction:column;}
  .vp-row .vid-pads{flex:none;width:100%;grid-auto-columns:calc((100% - 15px) / 4);}
  .m-mm-wrap{align-self:center;width:100%;aspect-ratio:auto;max-height:none;}
  #m-preview{width:min(100%,calc(100% * var(--ld-program-aspect)),calc(50vh * var(--ld-program-aspect)),calc(var(--ld-panel-visor) * var(--ld-program-aspect)));}
}