Pantallas TV: caja cuadrada para el video, que es cuadrado

El material del reel es cuadrado, pero la caja ocupaba todo el alto de una
columna angosta. Con object-fit:cover eso significa recortar: del cuadrado
solo quedaba visible una franja vertical del centro, y se perdían los bordes
—que es justo donde suele ir el logo o el texto de una pieza publicitaria.

Ahora la caja es cuadrada (aspect-ratio 1/1) y se centra en su columna, así
que la pieza entra completa. cover se conserva: sobre una caja cuadrada con
material cuadrado no recorta nada, y si algún día suben algo de otra
proporción, lo encuadra en vez de deformarlo.

Mismo arreglo en display.php, que tiene su propio panel de video por ?video=
con el mismo defecto.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

modules/turnero/views/display.php

@@ -271,9 +271,13 @@ $_labColor  = preg_match('/^#[0-9a-fA-F]{3,8}$/', $_dispCfg['doc_color'] ?? '')
         </div>
 
         <!-- Panel publicitario (se activa con ?video=URL) -->
-        <div id="video-panel" style="display:none;overflow:hidden;background:#000;position:relative">
+        <!-- El material es cuadrado: la caja también, y centrada. Estirada a
+             toda la altura de una columna angosta, cover recortaba los bordes
+             del video y solo se veía la franja central. -->
+        <div id="video-panel" style="display:none;overflow:hidden;background:#000;position:relative;
+                                     align-items:center;justify-content:center">
             <video id="video-pub" autoplay muted loop playsinline
-                   style="width:100%;height:100%;object-fit:cover">
+                   style="width:100%;height:auto;aspect-ratio:1/1;max-height:100%;object-fit:cover">
                 <source id="video-src" src="">
             </video>
         </div>
@@ -338,7 +342,7 @@ document.getElementById('lbl-area').textContent =
     const body   = document.getElementById('display-body');
     src.src = videoUrl;
     vid.load();
-    panel.style.display = 'block';
+    panel.style.display = 'flex';   // flex, para poder centrar el cuadro
     // 3 columnas: turno | video | cola
     body.style.gridTemplateColumns = '1fr 320px 280px';
 })();