From cabe10576c6deea23c4223f41fe966099a011905 Mon Sep 17 00:00:00 2001
From: Ricardo Monla <rmonla@frlr.utn.edu.ar>
Date: Sun, 3 May 2026 02:49:10 -0300
Subject: [PATCH] feat: placeholders animados para videos pendientes + barra de
 progreso de descarga

---
 .../descargas/LIBRO_DE_ESTUDIO.html           | 164 +++++++++++++-----
 descargar-curso/generar_dashboard.mjs         |  91 +++++++++-
 2 files changed, 207 insertions(+), 48 deletions(-)

diff --git a/descargar-curso/descargas/LIBRO_DE_ESTUDIO.html b/descargar-curso/descargas/LIBRO_DE_ESTUDIO.html
index 01dc63f..4928550 100644
--- a/descargar-curso/descargas/LIBRO_DE_ESTUDIO.html
+++ b/descargar-curso/descargas/LIBRO_DE_ESTUDIO.html
@@ -319,6 +319,72 @@ body {
   font-size: 0.88rem;
   color: #7d6608;
 }
+.video-placeholder {
+  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
+  border-radius: 8px;
+  padding: 2rem;
+  margin: 1rem 0;
+  text-align: center;
+  color: #e0e0e0;
+  position: relative;
+  overflow: hidden;
+}
+.video-placeholder::before {
+  content: '';
+  position: absolute;
+  top: 0; left: -100%; width: 200%; height: 100%;
+  background: linear-gradient(90deg, transparent 25%, rgba(255,255,255,0.03) 50%, transparent 75%);
+  animation: shimmer 3s infinite;
+}
+@keyframes shimmer {
+  0% { transform: translateX(-50%); }
+  100% { transform: translateX(50%); }
+}
+.video-placeholder .play-icon {
+  font-size: 2.5rem;
+  margin-bottom: 0.5rem;
+  opacity: 0.5;
+}
+.video-placeholder .placeholder-text {
+  font-size: 0.85rem;
+  opacity: 0.6;
+}
+.video-placeholder .placeholder-label {
+  font-size: 0.75rem;
+  opacity: 0.35;
+  margin-top: 0.4rem;
+}
+/* ── BARRA DE PROGRESO ── */
+.progress-section {
+  padding: 0.8rem 1.2rem;
+  border-top: 1px solid rgba(255,255,255,0.08);
+}
+.progress-section .progress-label {
+  font-size: 0.7rem;
+  color: rgba(255,255,255,0.5);
+  margin-bottom: 0.4rem;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+.progress-bar-bg {
+  background: rgba(255,255,255,0.1);
+  border-radius: 6px;
+  height: 8px;
+  overflow: hidden;
+}
+.progress-bar-fill {
+  height: 100%;
+  border-radius: 6px;
+  background: linear-gradient(90deg, #2980b9, #27ae60);
+  transition: width 0.5s ease;
+}
+.progress-stats {
+  display: flex;
+  justify-content: space-between;
+  font-size: 0.7rem;
+  color: rgba(255,255,255,0.4);
+  margin-top: 0.3rem;
+}
 .nota-recurso {
   background: #eaf2f8;
   border: 1px solid #aed6f1;
@@ -385,6 +451,7 @@ body {
         <div class="stat">📚 2 mód.</div>
         <div class="stat">📂 11 secc.</div>
         <div class="stat">📖 115 temas</div>
+        <div class="stat">🎬 0/46 videos</div>
       </div>
       <div class="sidebar-nav">
         <div class="nav-modulo">Planificación</div>
@@ -402,6 +469,11 @@ body {
 <a href="#sec-explicacion-del-trabajo-practico" data-section="sec-explicacion-del-trabajo-practico">Explicación del Trabajo Práctico<span class="nav-count">1</span></a>
 
       </div>
+      <div class="progress-section">
+        <div class="progress-label">Descarga de videos</div>
+        <div class="progress-bar-bg"><div class="progress-bar-fill" style="width: 0%"></div></div>
+        <div class="progress-stats"><span>0 de 46</span><span>0%</span></div>
+      </div>
     </nav>
 
     <main class="main-content">
@@ -417,7 +489,7 @@ body {
         <h1 class="modulo-titulo">Módulo 1 — Planificación</h1>
 <h2 class="seccion-titulo" id="sec-planificacion">Planificación</h2>
 <h3 class="tema-titulo" id="tema-planificacion-0">1. PLANIFICACIÓN</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1170245111</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">PLANIFICACIÓN</div></div>
 <h4>Resumen de la Clase: Planificación y Periodización Ágil (Voleibol)</h4><p>Esta clase correspondiente al <b>Curso de Entrenador Nacional II de Vóleibol (Edición 2026)</b> aborda la planificación de la preparación física bajo un enfoque moderno de <b>periodización ágil</b>. El objetivo central es que el deportista llegue en su mejor versión a la competencia, priorizando la salud y la individualidad sobre planes rígidos.</p><hr><h4>1. Concepto de Carga e Individualidad</h4><ul><br>
     <li><b>Carga Integral:</b> No se limita solo al entrenamiento de cancha; incluye el estrés físico, psicológico y el impacto diario en cada jugador.</li><br>
     <li><b>Principio de Individualidad:</b> Es el factor determinante. Un plan exitoso debe ser flexible y ajustarse según el feedback (carga interna) de cada deportista.</li><br>
@@ -486,7 +558,7 @@ body {
 <p>Material de lectura complementaria</p><div class="nota-recurso">🔗 <strong>Enlace:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/34868/study-resources/50144/show?me=140226" target="_blank">¿Cómo Desarrollar Deportistas Robustos y Sólidos para los Requerimientos del Voleibol en el Largo Plazo?</a></div>
 <h2 class="seccion-titulo" id="sec-preparacion-atletica">Preparación Atlética</h2>
 <h3 class="tema-titulo" id="tema-preparacion-atletica-0">1. PREPARACIÓN ATLÉTICA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1173231315</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">PREPARACIÓN ATLÉTICA</div></div>
 <h4>Resumen de Clase: Preparación Atlética en el Voleibol</h4><p><strong>Profesor:</strong> Alejandro Bertorello</p><p>En este segundo encuentro del curso para Entrenadores Nacionales Nivel 2, se abordó la implementación práctica de la preparación física, enfocándose en la sesión de entrenamiento como la unidad estructural básica y el rol del entrenador/preparador en el campo.</p><hr><h4>1. Filosofía y Rol del Preparador Físico</h4><ul><br>
         <li><strong>Observación Pedagógica:</strong> El preparador debe estar presente y activo, corrigiendo técnicas y dando feedback constante. No se puede dirigir una sesión de pesas de forma pasiva.</li><br>
         <li><strong>Individualidad:</strong> Es fundamental diferenciar los planes según el tiempo de juego, historial de lesiones y fatiga acumulada del deportista.</li><br>
@@ -546,10 +618,10 @@ body {
 <p>Modelos de sesiones de preparación física: preventiva, carga, choque y activación</p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/34869/study-resources/46719/show?me=140229" target="_blank">Modelo de sesiones de preparación física en el vóleibol</a></div>
 <div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-modelo-de-ejercicios-preventivos-de-lesiones-en-el-voleibol-6">7. Modelo de ejercicios preventivos de lesiones en el vóleibol</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1063655414</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">Modelo de ejercicios preventivos de lesiones en el vóleibol</div></div>
 <p>Sesión preventiva general </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-sesion-preventiva-post-viaje-7">8. Sesión Preventiva (Post viaje)</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1063657248</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">Sesión Preventiva (Post viaje)</div></div>
 <p>Sesión preventiva</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-modelo-de-sesion-de-carga-choque-8">9. Modelo de Sesión de carga - choque</h3>
 <p>Modelo de sesión para deportistas expertos y avanzados</p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/34869/study-resources/50329/show?me=140232" target="_blank">Modelo de Sesión de carga - choque</a></div>
@@ -573,7 +645,7 @@ body {
 <p>Material de lectura complementaria</p><div class="nota-recurso">🔗 <strong>Enlace:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/34869/study-resources/50141/show?me=140238" target="_blank">Características Físicas y Fisiológicas de las Jugadoras de Voleibol. Un Trabajo de Revisión</a></div>
 <h2 class="seccion-titulo" id="sec-explicacion-del-trabajo-practico">Explicación del Trabajo Práctico</h2>
 <h3 class="tema-titulo" id="tema-explicacion-del-trabajo-practico-a-presentar-0">1. EXPLICACIÓN DEL TRABAJO PRÁCTICO A PRESENTAR</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1173576229</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">EXPLICACIÓN DEL TRABAJO PRÁCTICO A PRESENTAR</div></div>
 <div><br>
     <h4>Consignas: Trabajo Práctico Integrador (TPI)</h4><br>
     <p><strong>Profesor:</strong> Alejandro Bertorello</p><br>
@@ -615,7 +687,7 @@ body {
 <p>Hola a todos!</p><ul><li>Este es el archivo con las <strong>consignas del trabajo práctico integrador de las 2 asignaturas: planificación de la preparación física y preparación atlética en el vóleibol</strong></li><li>Para poder realizar el trabajo deben descargar desde <strong>Evaluaciones</strong> el archivo en formato Excel <strong>"Trabajo práctico preparación física entrenador nacional 2"</strong></li></ul><div><b><strong>Los saludo y quedo a disposición ante cualquier tipo de consultas!</strong><br></b><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/34870/study-resources/53173/show?me=142686" target="_blank">Consignas del Trabajo práctico</a></div>
 <h2 class="seccion-titulo" id="sec-seguimientos-de-equipos">Seguimientos de Equipos</h2>
 <h3 class="tema-titulo" id="tema-seguimiento-de-equipos-0">1. SEGUIMIENTO DE EQUIPOS</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1175436659</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">SEGUIMIENTO DE EQUIPOS</div></div>
 <p>Clase en vivo<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-modulo-1-1">2. . MODULO 1</h3>
@@ -665,13 +737,13 @@ body {
 <p><br></p><p>Copyright y proporcionado por: Asociación Estadounidense de Entrenadores de Voleibol</p><p>En este artículo, queríamos probar el paradigma que sirve en el juego femenino para llegar a los pasadores tan rápido que es virtualmente imposible ponerse detrás del balón para pasarlo de manera efectiva.</p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/35523/study-resources/53199/show?me=142715" target="_blank">​Por: Jim Miret, voleibol de primera línea</a></div>
 <h2 class="seccion-titulo" id="sec-analisis-de-equipos-de-voleibol-1">Análisis de Equipos de Voleibol 1</h2>
 <h3 class="tema-titulo" id="tema-analisis-de-equipo-1-0">1. ANÁLISIS DE EQUIPO 1</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1073484590</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">ANÁLISIS DE EQUIPO 1</div></div>
 <p>Clase en vivo</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-analisis-y-seguimiento-2-1">2. ANALISIS Y SEGUIMIENTO 2</h3>
 <p>Análisis del Scout <br> Gestión del Entrenador<br> Dirección Estratégica</p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/35524/study-resources/53294/show?me=142938" target="_blank">ANALISIS Y SEGUIMIENTO 2</a></div>
 <div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-armado-k1-de-checco-2">3. Armado K1 .De Checco</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 876705933</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">Armado K1 .De Checco</div></div>
 <p>VIDEO</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-analisis-del-opuesto-3">4. Análisis del Opuesto</h3>
 <p>Video</p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/35524/study-resources/50262/show?me=142080" target="_blank">Análisis del Opuesto</a></div>
@@ -755,7 +827,7 @@ body {
 <p><b>¿Es necesario dar feedback o reforzar en el entrenamiento?</b></p><p>By <a href="http://sextoanillo.com/index.php/author/cristhianpsico/">Cristhian Fernandez Otero</a>access </p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/35525/study-resources/53201/show?me=142717" target="_blank">Análisis Psicología Deportiva. materialde lectura</a></div>
 <h2 class="seccion-titulo" id="sec-trabajo-practico-final-de-la-unidad">Trabajo Práctico Final de la Unidad</h2>
 <h3 class="tema-titulo" id="tema-analisis-y-seguimiento-3-explicacion-del-tp-0">1. ANÁLISIS Y SEGUIMIENTO 3 - EXPLICACIÓN DEL TP</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1176900332</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">ANÁLISIS Y SEGUIMIENTO 3 - EXPLICACIÓN DEL TP</div></div>
 <p>clase en vivo</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-trabajo-practico-analisis-y-seguimiento-1">2. TRABAJO PRACTICO ANALISIS Y SEGUIMIENTO</h3>
 <p><u>PLANIFICACIÓNDEL PARTIDO: </u>SISTEMA BLOQUEO-DEFENSA </p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19096/s/35526/study-resources/53296/show?me=142940" target="_blank">TRABAJO PRACTICO ANALISIS Y SEGUIMIENTO</a></div>
@@ -772,127 +844,127 @@ body {
 <p>EL DESARROLLO DE LAS CENTRALES EN ATAQUE Y BLOQUEO</p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19097/s/35519/study-resources/46805/show?me=142961" target="_blank">DESARROLLO DE LOS CENTRALES</a></div>
 <div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-prioridad-en-el-bloqueo-2">3. PRIORIDAD EN EL BLOQUEO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919369433</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">PRIORIDAD EN EL BLOQUEO</div></div>
 <p>PRIORIDAD EN EL BLOQUEO<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-entrenamiento-de-los-centrales-y-opuestos-3">4. ENTRENAMIENTO DE LOS CENTRALES Y OPUESTOS</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1179197191</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">ENTRENAMIENTO DE LOS CENTRALES Y OPUESTOS</div></div>
 <p>clase en vivo</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-ataque-b-4">5. ATAQUE B</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919341704</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">ATAQUE B</div></div>
 <p>ATAQUE B</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-b-con-recepcion-admiracion-5">6. B CON RECEPCION ADMIRACION</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919342668</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">B CON RECEPCION ADMIRACION</div></div>
 <p>B CON RECEPCION ADMIRACION<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-la-b-mantiene-la-distancia-6">7. LA B MANTIENE LA DISTANCIA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919346562</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">LA B MANTIENE LA DISTANCIA</div></div>
 <p>LA B MANTIENE LA DISTANCIA</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hatu-recepcion-perfecta-7">8. HATU RECEPCION PERFECTA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919347866</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HATU RECEPCION PERFECTA</div></div>
 <p>HATU RECEPCION PERFECTA<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hatu-con-pelota-separada-8">9. HATU CON PELOTA SEPARADA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919348493</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HATU CON PELOTA SEPARADA</div></div>
 <p>HATU CON PELOTA SEPARADA</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hatu-marcada-9">10. HATU MARCADA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919351892</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HATU MARCADA</div></div>
 <p>HATU MARCADA</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hatumarcada-bien-atacada-10">11. HATUMARCADA BIEN ATACADA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919352848</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HATUMARCADA BIEN ATACADA</div></div>
 <p>HATU MARCADA BIEN ATACADA</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hatu-bien-hecha-11">12. HATU BIEN HECHA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919353448</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HATU BIEN HECHA</div></div>
 <p>HATU BIEN HECHA</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hana-positiva-12">13. HANA POSITIVA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919354134</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HANA POSITIVA</div></div>
 <p>HANA POSITIVA</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hanati-con-recepcion-separada-13">14. HANATI CON RECEPCION SEPARADA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919355668</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HANATI CON RECEPCION SEPARADA</div></div>
 <p>HANATI CON RECEPCION SEPARADA<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hana-recepcion-a-2-14">15. HANA RECEPCION A 2</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919356423</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HANA RECEPCION A 2</div></div>
 <p>HANA RECEPCION A 2</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-beti-a-un-pie-atras-15">16. BETI A UN PIE ATRAS</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919357109</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">BETI A UN PIE ATRAS</div></div>
 <p>BETI A UN PIE ATRAS</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-beti-en-juego-16">17. BETI EN JUEGO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919358607</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">BETI EN JUEGO</div></div>
 <p>BETI EN JUEGO<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-central-al-medio-con-recepcion-a-2-17">18. CENTRAL AL MEDIO CON RECEPCION A 2</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919359386</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">CENTRAL AL MEDIO CON RECEPCION A 2</div></div>
 <p>CENTRAL AL MEDIO CON RECEPCION A 2</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hanati-volada-con-recepcion-a-4-18">19. HANATI VOLADA CON RECEPCION A 4</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919359855</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HANATI VOLADA CON RECEPCION A 4</div></div>
 <p>HANATI VOLADA CON RECEPCION A 4</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-hana-con-recepcion-a-2-separada-19">20. HANA CON RECEPCION A 2 SEPARADA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919360318</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">HANA CON RECEPCION A 2 SEPARADA</div></div>
 <p>HANA CON RECEPCION A 2 SEPARADA</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-apoyo-0-20">21. APOYO 0</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919363158</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">APOYO 0</div></div>
 <p>APOYO 0</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-central-ataca-de-segunda-entrenamiento-del-tiempo-21">22. CENTRAL ATACA DE SEGUNDA ENTRENAMIENTO DEL TIEMPO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919363728</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">CENTRAL ATACA DE SEGUNDA ENTRENAMIENTO DEL TIEMPO</div></div>
 <p>CENTRAL ATACA DE SEGUNDA ENTRENAMIENTO DEL TIEMPO</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-skipped-step-22">23. SKIPPED STEP</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919364522</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">SKIPPED STEP</div></div>
 <p>PASO SALTADO PARA CAER DEL BLOQUEO Y SALIR A ATACAR</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-global-tecnico-con-el-central-23">24. GLOBAL TECNICO CON EL CENTRAL</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919365485</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">GLOBAL TECNICO CON EL CENTRAL</div></div>
 <p>EJERCICIO GLOBAL TECNICO CON EL CENTRAL<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-visualizacion-del-central-en-bloqueo-24">25. VISUALIZACION DEL CENTRAL EN BLOQUEO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 919366263</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">VISUALIZACION DEL CENTRAL EN BLOQUEO</div></div>
 <p>VISUALIZACION DEL CENTRAL EN BLOQUEO</p><h2 class="seccion-titulo" id="sec-puntas-y-liberos-as">Puntas y Liberos/as</h2>
 <h3 class="tema-titulo" id="tema-puntas-y-liberos-as-0">1. PUNTAS Y LÍBEROS/AS</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1179888270</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">PUNTAS Y LÍBEROS/AS</div></div>
 <p>clase en vivo</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-split-step-1">2. SPLIT STEP</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921876274</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">SPLIT STEP</div></div>
 <p>SPLIT STEP</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-los-puntas-receptores-y-el-libero-2">3. LOS PUNTAS RECEPTORES Y EL LIBERO</h3>
 <p>PUNTAS RECEPTORES Y LIBEROS</p><div class="nota-recurso">📄 <strong>Archivo:</strong> <a href="/es/campus/student/training/e/14197/m/19097/s/35520/study-resources/46926/show?me=143177" target="_blank">LOS PUNTAS RECEPTORES Y EL LIBERO</a></div>
 <div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-carrera-de-ataque-desde-6-a-4-3">4. CARRERA DE ATAQUE DESDE 6 A 4</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921873304</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">CARRERA DE ATAQUE DESDE 6 A 4</div></div>
 <p>CARRERA DE ATAQUE DE 6 A 4</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-contrataque-despues-de-caer-de-bloqueo-4">5. CONTRATAQUE DESPUES DE CAER DE BLOQUEO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921873724</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">CONTRATAQUE DESPUES DE CAER DE BLOQUEO</div></div>
 <p>CONTRATAQUE DESPUES DE CAER DE BLOQUEO</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-contrataque-por-4-despues-de-caer-de-bloqueo-5">6. CONTRATAQUE POR 4 DESPUES DE CAER DE BLOQUEO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921873953</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">CONTRATAQUE POR 4 DESPUES DE CAER DE BLOQUEO</div></div>
 <p>ATAQUE DESPUES DE BLOQUEAR</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-evaluacion-posicional-6">7. EVALUACION POSICIONAL</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921874753</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">EVALUACION POSICIONAL</div></div>
 <p>EVALUACION POSICIONAL</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-global-tecnico-de-la-pipe-7">8. GLOBAL TECNICO DE LA PIPE</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921875020</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">GLOBAL TECNICO DE LA PIPE</div></div>
 <p>GLOBAL TECNICO DE LA PIPE</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-recepcion-de-massimino-con-saque-de-la-maquina-8">9. RECEPCION DE MASSIMINO CON SAQUE DE LA MAQUINA</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921875302</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">RECEPCION DE MASSIMINO CON SAQUE DE LA MAQUINA</div></div>
 <p>RECEPCION DE MASSIMINO CON SAQUE DE LA MAQUINA<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-recepcion-sobre-la-linea-saliendo-de-adentro-9">10. RECEPCION SOBRE LA LINEA SALIENDO DE ADENTRO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921875519</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">RECEPCION SOBRE LA LINEA SALIENDO DE ADENTRO</div></div>
 <p>RECEPCION SOBRE LA LINEA SALIENDO DE ADENTRO</p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-recepcion-y-ataque-por-4-saliendo-de-adentro-10">11. RECEPCION Y ATAQUE POR 4 SALIENDO DE ADENTRO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921875778</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">RECEPCION Y ATAQUE POR 4 SALIENDO DE ADENTRO</div></div>
 <p>RECEPCION Y ATAQUE POR 4 SALIENDO DE ADENTRO<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-tipo-de-combinaciones-que-juegan-los-puntas-11">12. TIPO DE COMBINACIONES QUE JUEGAN LOS PUNTAS</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921879520</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">TIPO DE COMBINACIONES QUE JUEGAN LOS PUNTAS</div></div>
 <p>COMBINACIONES DE LOS PUNTAS<br>
 </p><div class="tema-separador"></div>
 <h3 class="tema-titulo" id="tema-ataque-de-la-pipe-por-distancia-o-tiempo-12">13. ATAQUE DE LA PIPE POR DISTANCIA O TIEMPO</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 921879925</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">ATAQUE DE LA PIPE POR DISTANCIA O TIEMPO</div></div>
 <p>ATAQUE DE LA PIPE POR DISTANCIA O TIEMPO</p><h2 class="seccion-titulo" id="sec-entrenamiento-de-armadoras">Entrenamiento de Armadoras</h2>
 <h3 class="tema-titulo" id="tema-entrenamiento-de-los-y-las-armadoras-0">1. ENTRENAMIENTO DE LOS Y LAS ARMADORAS</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1181188693</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">ENTRENAMIENTO DE LOS Y LAS ARMADORAS</div></div>
 <p>clase en vivo</p><h2 class="seccion-titulo" id="sec-explicacion-del-trabajo-practico">Explicación del Trabajo Práctico</h2>
 <h3 class="tema-titulo" id="tema-explicacion-del-trabajo-practico-a-presentar-0">1. EXPLICACIÓN DEL TRABAJO PRÁCTICO A PRESENTAR</h3>
-<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: 1181892359</div>
+<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">EXPLICACIÓN DEL TRABAJO PRÁCTICO A PRESENTAR</div></div>
 <p>clase en vivo</p>
       </div>
 
diff --git a/descargar-curso/generar_dashboard.mjs b/descargar-curso/generar_dashboard.mjs
index d365a80..bf517be 100644
--- a/descargar-curso/generar_dashboard.mjs
+++ b/descargar-curso/generar_dashboard.mjs
@@ -616,9 +616,13 @@ function generarHTML(datos) {
   let totalModulos = datos.length;
   let totalSecciones = 0;
   let totalTemas = 0;
+  let totalVideos = 0;
   for (const m of datos) {
     totalSecciones += m.secciones.length;
-    for (const s of m.secciones) totalTemas += s.temas.length;
+    for (const s of m.secciones) {
+      totalTemas += s.temas.length;
+      for (const t of s.temas) if (t.vimeoID) totalVideos++;
+    }
   }
 
   // Leer mapa de videos descargados si existe
@@ -630,6 +634,17 @@ function generarHTML(datos) {
     }
   } catch { /* sin mapa */ }
 
+  // Contar cuántos videos están descargados
+  let videosDescargados = 0;
+  for (const m of datos) {
+    for (const s of m.secciones) {
+      for (const t of s.temas) {
+        if (t.vimeoID && videosMap[t.vimeoID]) videosDescargados++;
+      }
+    }
+  }
+  const videoPct = totalVideos > 0 ? Math.round((videosDescargados / totalVideos) * 100) : 0;
+
   const css = `
 * { margin: 0; padding: 0; box-sizing: border-box; }
 
@@ -941,6 +956,72 @@ body {
   font-size: 0.88rem;
   color: #7d6608;
 }
+.video-placeholder {
+  background: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
+  border-radius: 8px;
+  padding: 2rem;
+  margin: 1rem 0;
+  text-align: center;
+  color: #e0e0e0;
+  position: relative;
+  overflow: hidden;
+}
+.video-placeholder::before {
+  content: '';
+  position: absolute;
+  top: 0; left: -100%; width: 200%; height: 100%;
+  background: linear-gradient(90deg, transparent 25%, rgba(255,255,255,0.03) 50%, transparent 75%);
+  animation: shimmer 3s infinite;
+}
+@keyframes shimmer {
+  0% { transform: translateX(-50%); }
+  100% { transform: translateX(50%); }
+}
+.video-placeholder .play-icon {
+  font-size: 2.5rem;
+  margin-bottom: 0.5rem;
+  opacity: 0.5;
+}
+.video-placeholder .placeholder-text {
+  font-size: 0.85rem;
+  opacity: 0.6;
+}
+.video-placeholder .placeholder-label {
+  font-size: 0.75rem;
+  opacity: 0.35;
+  margin-top: 0.4rem;
+}
+/* ── BARRA DE PROGRESO ── */
+.progress-section {
+  padding: 0.8rem 1.2rem;
+  border-top: 1px solid rgba(255,255,255,0.08);
+}
+.progress-section .progress-label {
+  font-size: 0.7rem;
+  color: rgba(255,255,255,0.5);
+  margin-bottom: 0.4rem;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+.progress-bar-bg {
+  background: rgba(255,255,255,0.1);
+  border-radius: 6px;
+  height: 8px;
+  overflow: hidden;
+}
+.progress-bar-fill {
+  height: 100%;
+  border-radius: 6px;
+  background: linear-gradient(90deg, #2980b9, #27ae60);
+  transition: width 0.5s ease;
+}
+.progress-stats {
+  display: flex;
+  justify-content: space-between;
+  font-size: 0.7rem;
+  color: rgba(255,255,255,0.4);
+  margin-top: 0.3rem;
+}
 .nota-recurso {
   background: #eaf2f8;
   border: 1px solid #aed6f1;
@@ -1022,7 +1103,7 @@ body {
           if (videoFile) {
             bodyHTML += `<div class="video-container"><video controls preload="metadata"><source src="videos_offline/${videoFile}" type="video/mp4">Tu navegador no soporta video HTML5.</video></div>\n`;
           } else {
-            bodyHTML += `<div class="nota-video">📹 <strong>Video disponible</strong> — Vimeo ID: ${tema.vimeoID}</div>\n`;
+            bodyHTML += `<div class="video-placeholder"><div class="play-icon">▶</div><div class="placeholder-text">Video en proceso de descarga</div><div class="placeholder-label">${tema.titulo}</div></div>\n`;
           }
         }
 
@@ -1123,10 +1204,16 @@ body {
         <div class="stat">📚 ${totalModulos} mód.</div>
         <div class="stat">📂 ${totalSecciones} secc.</div>
         <div class="stat">📖 ${totalTemas} temas</div>
+        <div class="stat">🎬 ${videosDescargados}/${totalVideos} videos</div>
       </div>
       <div class="sidebar-nav">
         ${sidebarNav}
       </div>
+      <div class="progress-section">
+        <div class="progress-label">Descarga de videos</div>
+        <div class="progress-bar-bg"><div class="progress-bar-fill" style="width: ${videoPct}%"></div></div>
+        <div class="progress-stats"><span>${videosDescargados} de ${totalVideos}</span><span>${videoPct}%</span></div>
+      </div>
     </nav>
 
     <main class="main-content">