:root{--lfm-teaser-toxic:#c7ff15;--lfm-teaser-purple:#9229d8}
.lfm-zc-teaser{position:fixed;z-index:999980;top:42%;width:210px;pointer-events:none;opacity:0;transition:opacity .22s ease,transform .5s cubic-bezier(.2,.85,.2,1)}
.lfm-zc-teaser[hidden]{display:none!important}
.lfm-zc-teaser.is-right{right:-12px;transform:translate3d(108%,0,0)}
.lfm-zc-teaser.is-left{left:-12px;transform:translate3d(-108%,0,0)}
.lfm-zc-teaser.is-visible{opacity:1;transform:translate3d(0,0,0);pointer-events:auto}
.lfm-zc-teaser__trigger{position:relative;display:block;width:100%;padding:0;border:0;background:transparent;cursor:pointer;filter:drop-shadow(0 13px 18px rgba(0,0,0,.65));transition:transform .18s ease,filter .18s ease}
.lfm-zc-teaser__trigger:hover{transform:scale(1.035);filter:drop-shadow(0 16px 23px rgba(0,0,0,.72)) drop-shadow(0 0 12px rgba(199,255,21,.22))}
.lfm-zc-teaser__trigger:focus-visible{outline:3px solid var(--lfm-teaser-toxic);outline-offset:3px;border-radius:18px}
.lfm-zc-teaser__trigger img{display:block;width:100%;height:auto;border-radius:18px 0 0 18px;box-shadow:0 0 0 1px rgba(199,255,21,.24),0 0 28px rgba(100,255,0,.12);user-select:none;-webkit-user-drag:none}
.lfm-zc-teaser.is-left .lfm-zc-teaser__trigger img{border-radius:0 18px 18px 0}
.lfm-zc-teaser__pulse{position:absolute;right:15%;top:25%;width:18px;height:18px;border-radius:50%;background:var(--lfm-teaser-toxic);box-shadow:0 0 0 0 rgba(199,255,21,.55);animation:lfmTeaserPulse 1.4s ease-out infinite;pointer-events:none}
.lfm-zc-teaser.is-left .lfm-zc-teaser__pulse{right:auto;left:15%}
@keyframes lfmTeaserPulse{0%{transform:scale(.7);box-shadow:0 0 0 0 rgba(199,255,21,.55)}70%{transform:scale(1);box-shadow:0 0 0 18px rgba(199,255,21,0)}100%{transform:scale(.7);box-shadow:0 0 0 0 rgba(199,255,21,0)}}

.lfm-zc-teaser-modal{position:fixed;z-index:999990;inset:0;display:grid;place-items:center;padding:24px}
.lfm-zc-teaser-modal[hidden]{display:none!important}
.lfm-zc-teaser-modal__backdrop{position:absolute;inset:0;background:rgba(3,4,3,.86);backdrop-filter:blur(8px)}
.lfm-zc-teaser-modal__dialog{position:relative;z-index:2;width:min(1240px,96vw);height:min(840px,92vh);border:1px solid rgba(199,255,21,.48);border-radius:22px;background:#030503;overflow:hidden;box-shadow:0 32px 110px rgba(0,0,0,.8),0 0 48px rgba(120,255,0,.14),inset 0 0 0 1px rgba(145,41,216,.2);animation:lfmTeaserModalIn .28s ease-out}
.lfm-zc-teaser-modal__dialog:before{content:"";position:absolute;z-index:3;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--lfm-teaser-toxic),var(--lfm-teaser-purple),var(--lfm-teaser-toxic));pointer-events:none}
.lfm-zc-teaser-modal__close{position:absolute;z-index:5;right:12px;top:12px;width:48px;height:48px;border-radius:50%;border:2px solid #10130b;background:var(--lfm-teaser-toxic);color:#0a0d06;font-size:32px;line-height:1;font-weight:1000;cursor:pointer;box-shadow:0 0 22px rgba(199,255,21,.22)}
.lfm-zc-teaser-modal__close:hover{transform:scale(1.04)}
.lfm-zc-teaser-modal__close:focus-visible{outline:3px solid #fff;outline-offset:2px}
.lfm-zc-teaser-modal iframe{display:block;width:100%;height:100%;border:0;background:#020403}
body.lfm-zc-teaser-open{overflow:hidden!important}
@keyframes lfmTeaserModalIn{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:none}}

@media(max-width:760px){
  .lfm-zc-teaser{top:auto;bottom:14%;width:145px}
  .lfm-zc-teaser.is-right{right:-7px}.lfm-zc-teaser.is-left{left:-7px}
  .lfm-zc-teaser-modal{padding:8px}
  .lfm-zc-teaser-modal__dialog{width:100%;height:91vh;border-radius:16px}
  .lfm-zc-teaser-modal__close{right:8px;top:8px;width:44px;height:44px;font-size:28px}
}
@media(prefers-reduced-motion:reduce){.lfm-zc-teaser,.lfm-zc-teaser__trigger,.lfm-zc-teaser-modal__dialog{transition:none!important;animation:none!important}.lfm-zc-teaser__pulse{animation:none!important}}

/* v0.2.3 — popup usa todo el viewport disponible y nunca necesita scroll externo */
.lfm-zc-teaser-modal{
  padding:8px!important;
  overflow:hidden!important;
}
.lfm-zc-teaser-modal__dialog{
  width:min(1280px,calc(100vw - 16px))!important;
  height:min(900px,calc(100dvh - 16px))!important;
  max-width:none!important;
  max-height:none!important;
  overflow:hidden!important;
  border-radius:18px!important;
}
.lfm-zc-teaser-modal iframe{
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
}
@media(max-width:640px){
  .lfm-zc-teaser-modal{padding:3px!important}
  .lfm-zc-teaser-modal__dialog{
    width:calc(100vw - 6px)!important;
    height:calc(100dvh - 6px)!important;
    border-radius:12px!important;
  }
  .lfm-zc-teaser-modal__close{
    right:7px!important;
    top:7px!important;
    width:42px!important;
    height:42px!important;
    font-size:27px!important;
  }
}


/* v0.2.6 — mobile popup: close button outside HUD + no internal scroll */
@media(max-width:640px){
  .lfm-zc-teaser-modal{
    padding:24px 3px 3px!important;
    overflow:hidden!important;
  }
  .lfm-zc-teaser-modal__dialog{
    width:calc(100vw - 6px)!important;
    height:calc(100dvh - 27px)!important;
    overflow:visible!important;
    border-radius:12px!important;
  }
  .lfm-zc-teaser-modal iframe{
    display:block!important;
    width:100%!important;
    height:100%!important;
    border-radius:12px!important;
    overflow:hidden!important;
    background:#020403!important;
  }
  .lfm-zc-teaser-modal__close{
    top:-21px!important;
    right:7px!important;
    width:40px!important;
    height:40px!important;
    font-size:25px!important;
    line-height:36px!important;
    border-width:2px!important;
    box-shadow:0 4px 16px rgba(0,0,0,.55),0 0 18px rgba(199,255,21,.24)!important;
  }
}

/* v0.2.7 — configurable Toasty image + center positions */
.lfm-zc-teaser.is-bottom-center{
  left:50%;
  top:auto;
  bottom:-8px;
  width:210px;
  transform:translate3d(-50%,115%,0);
}
.lfm-zc-teaser.is-bottom-center.is-visible{transform:translate3d(-50%,0,0)}
.lfm-zc-teaser.is-top-center{
  left:50%;
  top:-8px;
  bottom:auto;
  width:210px;
  transform:translate3d(-50%,-115%,0);
}
.lfm-zc-teaser.is-top-center.is-visible{transform:translate3d(-50%,0,0)}
.lfm-zc-teaser.is-bottom-center .lfm-zc-teaser__trigger img,
.lfm-zc-teaser.is-top-center .lfm-zc-teaser__trigger img{
  border-radius:0;
}
.lfm-zc-teaser__trigger img{
  object-fit:contain;
  box-shadow:none;
  background:transparent;
}
.lfm-zc-teaser.is-bottom-center .lfm-zc-teaser__pulse,
.lfm-zc-teaser.is-top-center .lfm-zc-teaser__pulse{
  right:18%;left:auto;top:24%;
}
@media(max-width:760px){
  .lfm-zc-teaser.is-bottom-center,
  .lfm-zc-teaser.is-top-center{width:132px}
  .lfm-zc-teaser.is-bottom-center{left:50%;right:auto;bottom:-5px;top:auto;transform:translate3d(-50%,115%,0)}
  .lfm-zc-teaser.is-bottom-center.is-visible{transform:translate3d(-50%,0,0)}
  .lfm-zc-teaser.is-top-center{left:50%;right:auto;top:-5px;bottom:auto;transform:translate3d(-50%,-115%,0)}
  .lfm-zc-teaser.is-top-center.is-visible{transform:translate3d(-50%,0,0)}
}


/* v0.2.8 — posiciones aleatorias + orientación y pulsación anclada al borde */
.lfm-zc-teaser{
  --lfm-teaser-axis:50%;
  top:auto;
  right:auto;
  bottom:auto;
  left:auto;
  width:210px;
  overflow:visible;
  will-change:transform,opacity;
}
.lfm-zc-teaser.is-edge-bottom{
  left:var(--lfm-teaser-axis);
  bottom:-4px;
  transform:translate3d(-50%,115%,0);
}
.lfm-zc-teaser.is-edge-bottom.is-visible{transform:translate3d(-50%,0,0)}
.lfm-zc-teaser.is-edge-top{
  left:var(--lfm-teaser-axis);
  top:-4px;
  transform:translate3d(-50%,-115%,0);
}
.lfm-zc-teaser.is-edge-top.is-visible{transform:translate3d(-50%,0,0)}
.lfm-zc-teaser.is-edge-right{
  right:-4px;
  top:var(--lfm-teaser-axis);
  transform:translate3d(115%,-50%,0);
}
.lfm-zc-teaser.is-edge-right.is-visible{transform:translate3d(0,-50%,0)}
.lfm-zc-teaser.is-edge-left{
  left:-4px;
  top:var(--lfm-teaser-axis);
  transform:translate3d(-115%,-50%,0);
}
.lfm-zc-teaser.is-edge-left.is-visible{transform:translate3d(0,-50%,0)}

/* La rotación hace que la base de la mano siempre nazca desde el borde. */
.lfm-zc-teaser.is-edge-bottom .lfm-zc-teaser__trigger img{transform:rotate(0deg)}
.lfm-zc-teaser.is-edge-top .lfm-zc-teaser__trigger img{transform:rotate(180deg)}
.lfm-zc-teaser.is-edge-right .lfm-zc-teaser__trigger img{transform:rotate(-90deg)}
.lfm-zc-teaser.is-edge-left .lfm-zc-teaser__trigger img{transform:rotate(90deg)}

/* Pulsación del conjunto completo. El origen queda pegado al borde para que
   la imagen crezca únicamente hacia el interior y nunca se vea desprendida. */
.lfm-zc-teaser.is-edge-bottom .lfm-zc-teaser__trigger{transform-origin:50% 100%}
.lfm-zc-teaser.is-edge-top .lfm-zc-teaser__trigger{transform-origin:50% 0%}
.lfm-zc-teaser.is-edge-right .lfm-zc-teaser__trigger{transform-origin:100% 50%}
.lfm-zc-teaser.is-edge-left .lfm-zc-teaser__trigger{transform-origin:0% 50%}
.lfm-zc-teaser.is-visible .lfm-zc-teaser__trigger{
  animation:lfmTeaserAnchoredBeat 1.18s ease-in-out infinite;
}
@keyframes lfmTeaserAnchoredBeat{
  0%,100%{transform:scale(1)}
  45%{transform:scale(1.055)}
  68%{transform:scale(1.018)}
}
.lfm-zc-teaser__trigger:hover{
  filter:drop-shadow(0 16px 23px rgba(0,0,0,.72)) drop-shadow(0 0 12px rgba(199,255,21,.22));
}
/* La pequeña onda circular sigue la zona interior según el borde. */
.lfm-zc-teaser.is-edge-bottom .lfm-zc-teaser__pulse{right:16%;left:auto;top:24%}
.lfm-zc-teaser.is-edge-top .lfm-zc-teaser__pulse{right:auto;left:16%;top:58%}
.lfm-zc-teaser.is-edge-right .lfm-zc-teaser__pulse{right:auto;left:24%;top:18%}
.lfm-zc-teaser.is-edge-left .lfm-zc-teaser__pulse{right:24%;left:auto;top:18%}

@media(max-width:760px){
  .lfm-zc-teaser{width:132px}
  .lfm-zc-teaser.is-edge-bottom{bottom:-3px}
  .lfm-zc-teaser.is-edge-top{top:-3px}
  .lfm-zc-teaser.is-edge-right{right:-3px}
  .lfm-zc-teaser.is-edge-left{left:-3px}
}
@media(prefers-reduced-motion:reduce){
  .lfm-zc-teaser.is-visible .lfm-zc-teaser__trigger{animation:none!important}
}


/* v0.3.2 — desktop más compacto: menos recorrido visual y mejor proporción de juego. */
@media(min-width:761px){
  .lfm-zc-teaser-modal{padding:18px!important}
  .lfm-zc-teaser-modal__dialog{
    width:min(1120px,90vw)!important;
    height:min(720px,86vh)!important;
    max-width:1120px!important;
    max-height:720px!important;
  }
}
