/* WpLanding — Video Frames (5 marcos modernos)
 * Cargado en: builder canvas + landing pública.
 * Cada marco mantiene aspect-ratio 16:9 y es 100% responsive.
 */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@600;700;800&display=swap');

/* ============================================================
   BASE — todos los marcos comparten esta estructura
   ============================================================ */
.wpl-vf{display:block;width:100%;max-width:100%;margin:24px auto;position:relative;box-sizing:border-box}

/* ── Tamaños uniformes (controlables desde el panel del editor) ── */
.wpl-vf[data-wpl-vf-size="sm"]{max-width:380px}
.wpl-vf[data-wpl-vf-size="md"]{max-width:600px}
.wpl-vf[data-wpl-vf-size="lg"]{max-width:880px}
.wpl-vf[data-wpl-vf-size="xl"]{max-width:1100px}
.wpl-vf[data-wpl-vf-size="full"]{max-width:100%}
@media (max-width:768px){
  /* En móvil cualquier tamaño se reduce a 100% del padre */
  .wpl-vf[data-wpl-vf-size]{max-width:100%}
}
.wpl-vf *{box-sizing:border-box}
.wpl-vf-screen{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;background:#000;border-radius:8px}
/* ============================================================
   PAUSE OVERLAY — destellos y brillo encima de la miniatura
   ============================================================ */
.wpl-pause-overlay{cursor:default}

/* Brillo en estrella (4 puntas) que late */
@keyframes wplSpark{
  0%,100%{opacity:0;transform:translate(-50%,-50%) scale(0) rotate(0deg)}
  50%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(45deg)}
}
.wpl-pause-overlay .wpl-spark{
  position:absolute;
  width:18px;height:18px;
  pointer-events:none;
  background:
    radial-gradient(ellipse 50% 8% at 50% 50%, rgba(255,255,255,.95) 0%, rgba(255,255,255,.5) 40%, transparent 70%),
    radial-gradient(ellipse 8% 50% at 50% 50%, rgba(255,255,255,.95) 0%, rgba(255,255,255,.5) 40%, transparent 70%);
  filter:drop-shadow(0 0 6px rgba(255,255,255,.95)) drop-shadow(0 0 14px rgba(255,200,80,.6));
  opacity:0;
  animation:wplSpark 2.4s ease-in-out infinite;
  transform-origin:center;
}
.wpl-pause-overlay .wpl-spark-1{top:18%;left:22%;animation-delay:0s}
.wpl-pause-overlay .wpl-spark-2{top:32%;left:74%;animation-delay:.35s;width:24px;height:24px}
.wpl-pause-overlay .wpl-spark-3{top:62%;left:14%;animation-delay:.8s;width:14px;height:14px}
.wpl-pause-overlay .wpl-spark-4{top:78%;left:62%;animation-delay:1.2s;width:20px;height:20px}
.wpl-pause-overlay .wpl-spark-5{top:25%;left:48%;animation-delay:.55s;width:16px;height:16px}
.wpl-pause-overlay .wpl-spark-6{top:55%;left:86%;animation-delay:1.6s;width:22px;height:22px}
.wpl-pause-overlay .wpl-spark-7{top:86%;left:32%;animation-delay:.2s;width:14px;height:14px}
.wpl-pause-overlay .wpl-spark-8{top:12%;left:88%;animation-delay:1.4s;width:18px;height:18px}

/* Banda de brillo que recorre la imagen diagonalmente */
@keyframes wplShine{
  0%{transform:translateX(-130%) skewX(-18deg)}
  100%{transform:translateX(260%) skewX(-18deg)}
}
.wpl-pause-overlay .wpl-shine{
  position:absolute;
  top:-10%;left:0;
  width:55%;height:120%;
  background:linear-gradient(105deg,
    transparent 25%,
    rgba(255,255,255,.18) 42%,
    rgba(255,255,255,.45) 50%,
    rgba(255,255,255,.18) 58%,
    transparent 75%);
  pointer-events:none;
  animation:wplShine 3.6s ease-in-out infinite;
  mix-blend-mode:screen;
}

/* Glow pulsante en el borde interno del overlay */
@keyframes wplGlowPulse{
  0%,100%{box-shadow:inset 0 0 30px rgba(255,255,255,.18),inset 0 0 60px rgba(255,200,80,.1)}
  50%{box-shadow:inset 0 0 50px rgba(255,255,255,.32),inset 0 0 90px rgba(255,200,80,.18)}
}
.wpl-pause-overlay::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  animation:wplGlowPulse 2.8s ease-in-out infinite;
}

/* Botón play centrado sobre la miniatura */
@keyframes wplPlayBtnPulse{
  0%,100%{transform:translate(-50%,-50%) scale(1);box-shadow:0 8px 30px rgba(0,0,0,.6),0 0 0 0 rgba(255,255,255,.4)}
  50%{transform:translate(-50%,-50%) scale(1.06);box-shadow:0 12px 40px rgba(0,0,0,.7),0 0 0 18px rgba(255,255,255,0)}
}
.wpl-pause-overlay .wpl-play-btn{
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:84px;height:84px;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.78) 100%);
  border-radius:50%;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  color:#0f172a;
  pointer-events:none;
  z-index:2;
  animation:wplPlayBtnPulse 2.2s ease-in-out infinite;
  border:2px solid rgba(255,255,255,.8);
}
.wpl-pause-overlay .wpl-play-btn svg{width:36px;height:36px;margin-left:5px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.3))}
@media (max-width:640px){
  .wpl-pause-overlay .wpl-play-btn{width:64px;height:64px}
  .wpl-pause-overlay .wpl-play-btn svg{width:28px;height:28px}
}

/* Defensa: cancelar rastros de selección del editor en la landing pública */
.gjs-selected,.gjs-hovered,.gjs-comp-selected,.gjs-comp-hovered,
.gjs-frozen,.gjs-toolbar,.gjs-highlighter,.gjs-dashed,.gjs-locked{
  outline:none !important;box-shadow:none !important;
}

/* Wistia: ocultar overlay de transcript que captura los clicks */
.wpl-vf .wpl-vf-screen .wistia_preload_transcript_outer_wrapper,
.wpl-vf .wpl-vf-screen .wistia_preload_transcript_inner_wrapper,
.wpl-vf .wpl-vf-screen .wistia_preload_transcript_text{
  display:none !important;
  pointer-events:none !important;
}

.wpl-vf .wpl-vf-screen{position:relative !important;display:block !important;overflow:hidden !important}
.wpl-vf .wpl-vf-screen > iframe,
.wpl-vf .wpl-vf-screen iframe,
.wpl-vf .wpl-vf-screen video,
.wpl-vf .wpl-vf-screen wistia-player,
.wpl-vf .wpl-vf-screen .wistia_embed,
.wpl-vf .wpl-vf-screen .wistia_responsive_padding,
.wpl-vf .wpl-vf-screen .wistia_responsive_wrapper{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100% !important;
  height:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:100% !important;
  max-height:100% !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  display:block !important;
  box-sizing:border-box !important;
  pointer-events:auto !important;  /* asegurar que clicks lleguen al video */
  z-index:1 !important;            /* iframe ENCIMA de cualquier cosa decorativa */
}

/* Esquinas y decoración SIEMPRE detrás del video y sin capturar clicks */
.wpl-vf .wpl-vf-corners,
.wpl-vf .wpl-vf-corners *,
.wpl-vf-badge,
.wpl-vf-strip{
  pointer-events:none !important;
}
.wpl-vf-badge{pointer-events:auto !important}  /* el badge sí debe ser editable */
.wpl-vf .wpl-vf-corners{z-index:0 !important}
.wpl-vf-corners{position:absolute;inset:0;pointer-events:none}
.wpl-vf-corners > i{position:absolute;width:36px;height:36px;display:block}
.wpl-vf-corners > i.tl{top:0;left:0;border-top:2px solid currentColor;border-left:2px solid currentColor}
.wpl-vf-corners > i.tr{top:0;right:0;border-top:2px solid currentColor;border-right:2px solid currentColor}
.wpl-vf-corners > i.bl{bottom:0;left:0;border-bottom:2px solid currentColor;border-left:2px solid currentColor}
.wpl-vf-corners > i.br{bottom:0;right:0;border-bottom:2px solid currentColor;border-right:2px solid currentColor}
.wpl-vf-badge{display:inline-flex;align-items:center;gap:8px;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-weight:800;letter-spacing:.18em;text-transform:uppercase;font-size:.78rem;line-height:1;padding:9px 16px;border-radius:4px;white-space:nowrap;user-select:none}
.wpl-vf-badge .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
@keyframes wplVfDot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.8)}}
@keyframes wplVfDotPulse{0%{box-shadow:0 0 0 0 currentColor}70%{box-shadow:0 0 0 10px transparent}100%{box-shadow:0 0 0 0 transparent}}

/* ============================================================
   1) LIVE GOLD — réplica fiel a la imagen referencia
   ============================================================ */
@keyframes wplVfGoldGlow{
  0%,100%{box-shadow:0 0 28px rgba(251,191,36,.35),0 0 70px rgba(251,191,36,.22)}
  50%{box-shadow:0 0 50px rgba(251,191,36,.6),0 0 110px rgba(251,191,36,.4)}
}
.wpl-vf.wpl-vf-gold{
  padding:14px;
  margin:48px auto 32px;
  background:radial-gradient(ellipse at 30% 25%,#1a1100 0%,#0a0500 60%,#000 100%);
  border:4px solid;
  border-image:linear-gradient(135deg,#b45309 0%,#fde68a 25%,#fbbf24 50%,#fde68a 75%,#92400e 100%) 1;
  border-radius:0;
  animation:wplVfGoldGlow 3.2s ease-in-out infinite;
  filter:drop-shadow(0 0 6px rgba(251,191,36,.55));
}
.wpl-vf.wpl-vf-gold .wpl-vf-corners{color:#fde68a}
.wpl-vf.wpl-vf-gold .wpl-vf-corners > i{
  width:30px;height:30px;
  border-width:2px !important;
  filter:drop-shadow(0 0 5px rgba(251,191,36,.9));
}
.wpl-vf.wpl-vf-gold .wpl-vf-corners > i.tl{top:-1px;left:-1px}
.wpl-vf.wpl-vf-gold .wpl-vf-corners > i.tr{top:-1px;right:-1px}
.wpl-vf.wpl-vf-gold .wpl-vf-corners > i.bl{bottom:-1px;left:-1px}
.wpl-vf.wpl-vf-gold .wpl-vf-corners > i.br{bottom:-1px;right:-1px}
.wpl-vf.wpl-vf-gold .wpl-vf-screen{
  background:radial-gradient(ellipse at 30% 20%,rgba(251,191,36,.06) 0%,#000 65%);
  border-radius:0;
  border:1px solid rgba(251,191,36,.18);
}

/* ── Badge EN VIVO AHORA (top centro) ─────────────────── */
.wpl-vf.wpl-vf-gold .wpl-vf-badge.live{
  position:absolute;
  top:-15px;left:50%;transform:translateX(-50%);
  background:#000;
  border:1.5px solid #fbbf24;
  color:#fbbf24;
  padding:8px 22px;
  font-family:'Cinzel','Trajan Pro','Georgia',serif;
  font-weight:700;
  font-size:.74rem;
  letter-spacing:.28em;
  text-transform:uppercase;
  box-shadow:0 0 18px rgba(251,191,36,.55),inset 0 0 8px rgba(251,191,36,.08);
  white-space:nowrap;z-index:5;
}
.wpl-vf.wpl-vf-gold .wpl-vf-badge.live .dot{
  width:7px;height:7px;background:#ef4444;
  box-shadow:0 0 6px #ef4444,0 0 12px rgba(239,68,68,.6);
  animation:wplVfDot 1.2s ease-in-out infinite;
}

/* ── Badge VIEWERS (top derecha, sólo número) ───────── */
.wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers{
  position:absolute;
  top:-15px;right:38px;left:auto;transform:none;
  background:#000;
  border:1.5px solid #fbbf24;
  color:#fbbf24;
  padding:8px 16px;
  font-family:'Cinzel','Trajan Pro','Georgia',serif;
  font-weight:700;
  font-size:.78rem;
  letter-spacing:.16em;
  box-shadow:0 0 18px rgba(251,191,36,.55),inset 0 0 8px rgba(251,191,36,.08);
  white-space:nowrap;z-index:5;
}
.wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers .dot{
  width:6px;height:6px;background:#fbbf24;
  box-shadow:0 0 6px #fbbf24;
  animation:wplVfDot 1.6s ease-in-out infinite;
}
.wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers strong{
  color:#fbbf24;letter-spacing:.08em;font-size:.85rem;font-weight:700;
}
/* En la imagen no hay texto extra — ocultar cualquier texto plano del badge */
.wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers > :not(.dot):not(strong){display:none}

/* ============================================================
   2) NEON CYBERPUNK — pink/cyan
   ============================================================ */
@keyframes wplVfNeonGlow{
  0%,100%{box-shadow:0 0 20px rgba(236,72,153,.55),0 0 40px rgba(34,211,238,.35),inset 0 0 12px rgba(236,72,153,.3)}
  50%{box-shadow:0 0 40px rgba(236,72,153,.85),0 0 70px rgba(34,211,238,.55),inset 0 0 18px rgba(236,72,153,.45)}
}
@keyframes wplVfGlitch{
  0%,90%,100%{transform:translate(0,0);opacity:0}
  91%{transform:translate(-3px,1px);opacity:.6}
  93%{transform:translate(2px,-1px);opacity:.4}
  95%{transform:translate(-1px,2px);opacity:.7}
  97%{transform:translate(0,0);opacity:0}
}
.wpl-vf.wpl-vf-neon{padding:14px;background:#0a0014;border:2px solid transparent;background-image:linear-gradient(#0a0014,#0a0014),linear-gradient(135deg,#ec4899 0%,#a855f7 50%,#22d3ee 100%);background-origin:border-box;background-clip:padding-box,border-box;border-radius:14px;animation:wplVfNeonGlow 2.4s ease-in-out infinite}
.wpl-vf.wpl-vf-neon .wpl-vf-screen{border-radius:8px;border:1px solid rgba(236,72,153,.4);overflow:hidden}
.wpl-vf.wpl-vf-neon .wpl-vf-screen::before,.wpl-vf.wpl-vf-neon .wpl-vf-screen::after{content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;z-index:2}
.wpl-vf.wpl-vf-neon .wpl-vf-screen::before{background:linear-gradient(90deg,transparent 0,rgba(236,72,153,.4) 2%,transparent 5%);animation:wplVfGlitch 6s steps(1) infinite}
.wpl-vf.wpl-vf-neon .wpl-vf-screen::after{background:linear-gradient(90deg,transparent 0,rgba(34,211,238,.4) 2%,transparent 5%);animation:wplVfGlitch 7.3s steps(1) infinite reverse}
.wpl-vf.wpl-vf-neon .wpl-vf-corners{color:#22d3ee}
.wpl-vf.wpl-vf-neon .wpl-vf-corners > i{width:30px;height:30px;border-width:2px !important;filter:drop-shadow(0 0 6px #22d3ee)}
.wpl-vf.wpl-vf-neon .wpl-vf-corners > i.tl,.wpl-vf.wpl-vf-neon .wpl-vf-corners > i.br{color:#ec4899;filter:drop-shadow(0 0 6px #ec4899)}
.wpl-vf.wpl-vf-neon .wpl-vf-badge.streaming{position:absolute;top:-16px;left:24px;background:#0a0014;border:1.5px solid #ec4899;color:#ec4899;box-shadow:0 0 14px rgba(236,72,153,.7);text-shadow:0 0 6px rgba(236,72,153,.8);z-index:3}
.wpl-vf.wpl-vf-neon .wpl-vf-badge.streaming .dot{background:#ec4899;box-shadow:0 0 8px #ec4899;animation:wplVfDot 1s ease-in-out infinite}

/* ============================================================
   3) CINEMA / FILM — negro y dorado vintage
   ============================================================ */
@keyframes wplVfFilmStrip{from{background-position:0 0}to{background-position:0 -28px}}
.wpl-vf.wpl-vf-cinema{padding:0 38px;background:transparent}
.wpl-vf.wpl-vf-cinema .wpl-vf-strip{position:absolute;top:0;bottom:0;width:30px;background:#0a0a0a;background-image:repeating-linear-gradient(180deg,#0a0a0a 0,#0a0a0a 6px,#1a1a1a 6px,#1a1a1a 8px,#0a0a0a 8px,#0a0a0a 22px,transparent 22px,transparent 28px),repeating-linear-gradient(180deg,transparent 0,transparent 8px,#fff 8px,#fff 18px,transparent 18px,transparent 28px);border:1px solid #1a1a1a;animation:wplVfFilmStrip 1.4s linear infinite;z-index:1}
.wpl-vf.wpl-vf-cinema .wpl-vf-strip::before{content:"";position:absolute;inset:6px;background:repeating-linear-gradient(180deg,transparent 0,transparent 4px,rgba(0,0,0,.95) 4px,rgba(0,0,0,.95) 16px,transparent 16px,transparent 22px);border-radius:2px}
.wpl-vf.wpl-vf-cinema .wpl-vf-strip.left{left:0}
.wpl-vf.wpl-vf-cinema .wpl-vf-strip.right{right:0}
.wpl-vf.wpl-vf-cinema .wpl-vf-screen{border:6px solid #0a0a0a;border-radius:4px;box-shadow:0 30px 80px rgba(0,0,0,.7),0 0 0 1px #fbbf24}
.wpl-vf.wpl-vf-cinema .wpl-vf-badge.cinema{position:absolute;top:-18px;left:50%;transform:translateX(-50%);background:#fbbf24;color:#0a0a0a;border:2px solid #0a0a0a;font-weight:900;letter-spacing:.22em;box-shadow:0 4px 12px rgba(0,0,0,.5);z-index:3;font-size:.78rem;padding:10px 18px;border-radius:3px}
.wpl-vf.wpl-vf-cinema .wpl-vf-badge.cinema svg{width:14px;height:14px}

/* ============================================================
   4) GLASSMORPHISM FLOATING
   ============================================================ */
@keyframes wplVfGlassFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.wpl-vf.wpl-vf-glass{padding:18px;background:linear-gradient(155deg,rgba(255,255,255,.18) 0%,rgba(255,255,255,.06) 100%);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);border:1.5px solid rgba(255,255,255,.35);border-radius:28px;box-shadow:0 30px 60px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.4);animation:wplVfGlassFloat 6s ease-in-out infinite;transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.wpl-vf.wpl-vf-glass:hover{transform:translateY(-10px) scale(1.01)}
.wpl-vf.wpl-vf-glass .wpl-vf-screen{border-radius:18px;border:1px solid rgba(255,255,255,.2);box-shadow:0 18px 40px rgba(0,0,0,.45)}
.wpl-vf.wpl-vf-glass .wpl-vf-badge.glass{position:absolute;top:-12px;left:24px;background:rgba(255,255,255,.7);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.6);color:#0f172a;box-shadow:0 8px 22px rgba(0,0,0,.18);z-index:3;font-size:.74rem}
.wpl-vf.wpl-vf-glass .wpl-vf-badge.glass .dot{background:#22c55e;box-shadow:0 0 8px #22c55e;animation:wplVfDot 1.4s ease-in-out infinite}
.wpl-vf.wpl-vf-glass .wpl-vf-badge.featured{position:absolute;top:-12px;right:24px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#0a0a0a;font-weight:900;box-shadow:0 8px 22px rgba(245,158,11,.45);z-index:3;font-size:.74rem}

/* ============================================================
   5) HOLOGRAPHIC 3D — gradient rotando + perspectiva
   ============================================================ */
@keyframes wplVfHoloHue{0%{filter:hue-rotate(0deg)}100%{filter:hue-rotate(360deg)}}
@keyframes wplVfHoloShimmer{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.wpl-vf.wpl-vf-holo{padding:6px;background:linear-gradient(135deg,#ec4899 0%,#a855f7 25%,#22d3ee 50%,#10b981 75%,#fbbf24 100%);background-size:300% 300%;border-radius:18px;animation:wplVfHoloShimmer 6s ease infinite;box-shadow:0 0 60px rgba(168,85,247,.4),0 30px 80px rgba(0,0,0,.4)}
.wpl-vf.wpl-vf-holo > .wpl-vf-inner{background:#0a0a14;border-radius:14px;padding:14px;position:relative}
.wpl-vf.wpl-vf-holo .wpl-vf-screen{border-radius:8px;border:1px solid rgba(255,255,255,.1)}
.wpl-vf.wpl-vf-holo .wpl-vf-corners{color:#fff;animation:wplVfHoloHue 8s linear infinite}
.wpl-vf.wpl-vf-holo .wpl-vf-corners > i{width:26px;height:26px;border-width:2px !important}
.wpl-vf.wpl-vf-holo .wpl-vf-badge.holo{position:absolute;top:-14px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#ec4899,#a855f7,#22d3ee);background-size:200% 200%;animation:wplVfHoloShimmer 4s ease infinite;color:#fff;border:1px solid rgba(255,255,255,.4);box-shadow:0 6px 20px rgba(168,85,247,.6);z-index:3;font-size:.74rem;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.wpl-vf.wpl-vf-holo .wpl-vf-badge.holo svg{width:14px;height:14px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.4))}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:768px){
  .wpl-vf{margin:18px auto}
  .wpl-vf-corners > i{width:24px !important;height:24px !important}
  .wpl-vf-badge{font-size:.68rem;padding:7px 12px;letter-spacing:.14em}

  .wpl-vf.wpl-vf-gold{padding:10px}
  .wpl-vf.wpl-vf-gold::before{inset:5px}
  .wpl-vf.wpl-vf-gold .wpl-vf-badge.live{font-size:.6rem;padding:6px 14px;letter-spacing:.18em;top:-13px}
  .wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers{font-size:.66rem;padding:6px 12px;right:14px;top:-13px}
  .wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers strong{font-size:.7rem}

  .wpl-vf.wpl-vf-neon{padding:8px;border-radius:10px}
  .wpl-vf.wpl-vf-neon .wpl-vf-badge.streaming{left:14px;font-size:.6rem;padding:6px 10px}

  .wpl-vf.wpl-vf-cinema{padding:0 22px}
  .wpl-vf.wpl-vf-cinema .wpl-vf-strip{width:18px}
  .wpl-vf.wpl-vf-cinema .wpl-vf-screen{border-width:4px}
  .wpl-vf.wpl-vf-cinema .wpl-vf-badge.cinema{font-size:.65rem;padding:7px 12px;letter-spacing:.14em;top:-14px}

  .wpl-vf.wpl-vf-glass{padding:10px;border-radius:18px}
  .wpl-vf.wpl-vf-glass .wpl-vf-screen{border-radius:12px}
  .wpl-vf.wpl-vf-glass .wpl-vf-badge.glass,.wpl-vf.wpl-vf-glass .wpl-vf-badge.featured{font-size:.6rem;padding:6px 10px;top:-10px;left:14px}
  .wpl-vf.wpl-vf-glass .wpl-vf-badge.featured{left:auto;right:14px}

  .wpl-vf.wpl-vf-holo{padding:4px;border-radius:14px}
  .wpl-vf.wpl-vf-holo > .wpl-vf-inner{padding:8px;border-radius:10px}
  .wpl-vf.wpl-vf-holo .wpl-vf-badge.holo{font-size:.6rem;padding:6px 10px;top:-12px}
}

@media (max-width:420px){
  .wpl-vf-badge{font-size:.6rem;padding:6px 9px;letter-spacing:.1em}
  .wpl-vf-corners > i{width:18px !important;height:18px !important}
  .wpl-vf.wpl-vf-gold .wpl-vf-badge.live{font-size:.52rem;padding:5px 10px;letter-spacing:.14em}
  .wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers{font-size:.58rem;padding:5px 9px;right:8px}
  .wpl-vf.wpl-vf-gold .wpl-vf-badge.viewers strong{font-size:.62rem}
}

/* ─── BOTGIA — Marco verde dark con header/footer BotGia branding ─── */
.wpl-vf.wpl-vf-botgia{padding:3px;border-radius:24px;background:linear-gradient(135deg,#00e676,#1de9b6,#ffd600,#00e676);font-family:'DM Sans','Plus Jakarta Sans',-apple-system,sans-serif;position:relative}
.wpl-vf.wpl-vf-botgia::before{content:'';position:absolute;inset:-8px;border-radius:30px;background:linear-gradient(135deg,#00e676,#1de9b6,#ffd600);filter:blur(20px);opacity:.35;z-index:-1;pointer-events:none}
.wpl-vf-botgia-inner{background:#050f06;border-radius:22px;overflow:hidden}
.wpl-vf-botgia-header{background:linear-gradient(90deg,#071a09,#0c2a10);padding:14px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(0,230,118,.15);flex-wrap:wrap;gap:8px}
.wpl-vf-botgia-header-left{display:flex;align-items:center;gap:10px}
.wpl-vf-botgia-logo{font-family:'Plus Jakarta Sans',sans-serif;font-weight:900;font-size:1.1rem;color:#00e676}
.wpl-vf-botgia-sep{color:rgba(255,255,255,.3)}
.wpl-vf-botgia-title{font-size:.88rem;color:#a5d6a7;font-weight:500}
.wpl-vf-botgia-live{background:#ff1744;color:#fff;font-size:.68rem;font-weight:900;padding:4px 12px;border-radius:20px;text-transform:uppercase;display:flex;align-items:center;gap:5px;letter-spacing:.5px;white-space:nowrap}
.wpl-vf-botgia-live::before{content:'';width:6px;height:6px;background:#fff;border-radius:50%;animation:wpl_vfbg_blink .8s infinite}
@keyframes wpl_vfbg_blink{0%,100%{opacity:1}50%{opacity:0}}
.wpl-vf.wpl-vf-botgia .wpl-vf-screen{border-radius:0;background:#030d04}
.wpl-vf-botgia-footer{background:linear-gradient(90deg,#071a09,#0c2a10);padding:12px 20px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid rgba(0,230,118,.1);flex-wrap:wrap;gap:8px;font-size:.8rem;color:#66bb6a}
.wpl-vf-botgia-tags{display:flex;gap:8px;flex-wrap:wrap}
.wpl-vf-botgia-tag{background:rgba(0,230,118,.1);border:1px solid rgba(0,230,118,.2);border-radius:20px;padding:3px 12px;font-size:.75rem;color:#00e676;font-weight:500}
.wpl-vf-botgia-locknote{font-size:.78rem;color:rgba(255,255,255,.4)}
@media(max-width:640px){
  .wpl-vf.wpl-vf-botgia{padding:2px;border-radius:18px}
  .wpl-vf-botgia-inner{border-radius:17px}
  .wpl-vf-botgia-header{flex-direction:column;align-items:flex-start;padding:10px 14px}
  .wpl-vf-botgia-footer{flex-direction:column;padding:10px 14px}
  .wpl-vf-botgia-title{display:none}
}