/* HentaiFre — player.css · estilos del reproductor (se carga después de vendor/plyr.css) */
.player-wrap { background:#000; position:relative }
.player-box { max-width:1320px; margin:0 auto; position:relative }
.player-box video { width:100%; aspect-ratio:16/9; background:#000; display:block }
.plyr { --plyr-color-main:#00c2e0; --plyr-video-background:#000; --plyr-menu-background:rgba(8,14,25,.96);
        --plyr-menu-color:#e8f4f8; --plyr-tooltip-background:rgba(8,14,25,.95); --plyr-tooltip-color:#e8f4f8;
        --plyr-control-radius:10px; --plyr-font-family:'Inter',sans-serif; font-family:'Inter',sans-serif }
.plyr--video { max-height:76vh }
.plyr__control--overlaid { background:rgba(0,194,224,.92); padding:22px }
.plyr__control--overlaid svg { width:22px; height:22px }
.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before { background:#00c2e0 }

/* Subtítulos: solo letra blanca (sin caja negra). El borde fino oscuro es lo mínimo
   para que se lean sobre escenas claras; no se ve como sombra. */
.plyr__captions { padding:8px 6% 10px; }
.plyr__caption { background:none !important; padding:0; color:#fff; font-weight:600; line-height:1.3;
                 -webkit-box-decoration-break:clone; box-decoration-break:clone;
                 text-shadow:-1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 0 0 3px rgba(0,0,0,.6) }
/* Celular (por defecto) */
.plyr.cap-s .plyr__captions { font-size:12px }
.plyr.cap-m .plyr__captions { font-size:14px }
.plyr.cap-l .plyr__captions { font-size:17px }
/* Tablet / PC */
@media (min-width:700px) {
  .plyr.cap-s .plyr__captions { font-size:16px }
  .plyr.cap-m .plyr__captions { font-size:20px }
  .plyr.cap-l .plyr__captions { font-size:26px }
}
/* Pantalla completa: el video ocupa TODA la pantalla (antes lo frenaba el max-height de la página)
   y los subtítulos crecen con el ancho, con tope para no tapar la escena.
   Van en reglas separadas: si un navegador no entiende un selector, no daña los otros. */
.plyr:fullscreen.cap-s .plyr__captions { font-size:clamp(14px,1.7vw,26px) }
.plyr:fullscreen.cap-m .plyr__captions { font-size:clamp(16px,2.1vw,32px) }
.plyr:fullscreen.cap-l .plyr__captions { font-size:clamp(19px,2.6vw,40px) }
.plyr:fullscreen { max-height:none !important; height:100% !important; width:100% !important }
.plyr:fullscreen .plyr__video-wrapper { height:100% !important; padding-bottom:0 !important }
.plyr:fullscreen video { width:100% !important; height:100% !important; max-height:none !important; aspect-ratio:auto !important; object-fit:contain }
.plyr:-webkit-full-screen.cap-s .plyr__captions { font-size:clamp(14px,1.7vw,26px) }
.plyr:-webkit-full-screen.cap-m .plyr__captions { font-size:clamp(16px,2.1vw,32px) }
.plyr:-webkit-full-screen.cap-l .plyr__captions { font-size:clamp(19px,2.6vw,40px) }
.plyr:-webkit-full-screen { max-height:none !important; height:100% !important; width:100% !important }
.plyr:-webkit-full-screen .plyr__video-wrapper { height:100% !important; padding-bottom:0 !important }
.plyr:-webkit-full-screen video { width:100% !important; height:100% !important; max-height:none !important; aspect-ratio:auto !important; object-fit:contain }
.plyr--fullscreen-fallback.cap-s .plyr__captions { font-size:clamp(14px,1.7vw,26px) }
.plyr--fullscreen-fallback.cap-m .plyr__captions { font-size:clamp(16px,2.1vw,32px) }
.plyr--fullscreen-fallback.cap-l .plyr__captions { font-size:clamp(19px,2.6vw,40px) }
.plyr--fullscreen-fallback { max-height:none !important; height:100% !important; width:100% !important }
.plyr--fullscreen-fallback .plyr__video-wrapper { height:100% !important; padding-bottom:0 !important }
.plyr--fullscreen-fallback video { width:100% !important; height:100% !important; max-height:none !important; aspect-ratio:auto !important; object-fit:contain }

/* Zonas de doble toque (celular) — no tapan la barra de controles NI el menú de la tuerca */
.plyr .plyr__controls { z-index:5 }
.hf-tap { position:absolute; top:0; bottom:60px; width:30%; z-index:2; -webkit-tap-highlight-color:transparent;
          user-select:none; -webkit-user-select:none; touch-action:manipulation }
.hf-tap.izq { left:0 } .hf-tap.der { right:0 }

/* Aviso flotante */
.hf-toast { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); z-index:6; pointer-events:none;
            background:rgba(4,8,15,.45); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
            color:#fff; font-size:13px; font-weight:600; padding:8px 16px; border-radius:999px;
            border:1px solid rgba(0,194,224,.25); opacity:0; transition:opacity .25s }
.hf-toast.on { opacity:1 }
/* ±10 s: onda transparente en el lado tocado (color del reproductor), sin caja oscura */
.hf-toast.izq, .hf-toast.der { top:0; bottom:0; width:36%; transform:none; padding:0; border:0; border-radius:0;
  background:none; -webkit-backdrop-filter:none; backdrop-filter:none;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px }
.hf-toast.izq { left:0; background:radial-gradient(ellipse 100% 70% at 0% 50%, rgba(0,194,224,.24), rgba(0,194,224,0) 72%) }
.hf-toast.der { left:auto; right:0; background:radial-gradient(ellipse 100% 70% at 100% 50%, rgba(0,194,224,.24), rgba(0,194,224,0) 72%) }
.hf-fl { font-size:13px; letter-spacing:-2px; color:#fff; opacity:.95; text-shadow:0 1px 6px rgba(0,0,0,.55) }
.hf-sg { font-size:13px; font-weight:700; color:#fff; text-shadow:0 1px 6px rgba(0,0,0,.6) }

/* Imagen congelada mientras salta (evita cuadros deformados) */
.hf-freeze { position:absolute; inset:0; width:100%; height:100%; z-index:1; pointer-events:none; opacity:0 }
.hf-freeze.on { opacity:1 }

/* Menú de la tuerca (calidad/velocidad): compacto y que no se salga del video en el celular */
.plyr__menu__container { --plyr-control-spacing:7px; --plyr-font-size-menu:13.5px;
  background:rgba(8,14,25,.86); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.08); border-radius:12px; min-width:150px;
  overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none }
.plyr__menu__container::-webkit-scrollbar { display:none }
.plyr__menu__container .plyr__control { padding:7px 12px; font-size:13.5px }
.plyr__menu__container .plyr__control--back { padding-top:6px; padding-bottom:9px; font-size:12.5px }
.plyr__menu__container [role=menuitemradio]::before { width:14px; height:14px; margin-right:9px }
@media (max-width:899px) {
  .plyr:not(.plyr--fullscreen-active):not(.plyr--fullscreen-fallback) .plyr__menu__container {
    max-height:calc(56.25vw - 58px) }
}
.plyr--fullscreen-active .plyr__menu__container, .plyr--fullscreen-fallback .plyr__menu__container { max-height:calc(100vh - 90px) }

/* Siguiente episodio */
.hf-next { position:absolute; inset:0; z-index:8; background:rgba(4,8,15,.9); display:flex; align-items:center; justify-content:center; padding:16px }
.hf-next[hidden] { display:none }
.hf-next-in { display:flex; flex-direction:column; align-items:center; gap:10px; text-align:center; max-width:320px }
.hf-next-k { font-size:11px; font-weight:800; letter-spacing:1.6px; color:#6b8fa0; text-transform:uppercase }
.hf-next-in img { width:240px; max-width:70vw; aspect-ratio:16/9; object-fit:cover; border-radius:12px; border:1px solid rgba(0,194,224,.18) }
.hf-next-t { font-size:14px; font-weight:700; color:#e8f4f8 }
.hf-next-b { display:flex; gap:10px; align-items:center }
.hf-next-go { font-size:13px; font-weight:800; background:#00c2e0; color:#04080f; padding:10px 20px; border-radius:999px }
.hf-next-x { font-size:12px; font-weight:700; color:#6b8fa0; padding:10px 14px }

/* Barra de idioma de subtítulos bajo el video */
#sub-bar { display:flex; align-items:center; gap:7px; flex-wrap:wrap; padding:10px 16px 0; max-width:1320px; margin:0 auto }
#sub-bar:empty { display:none }
.sub-label { font-size:10px; color:var(--text3); font-weight:800; letter-spacing:1.2px; text-transform:uppercase; margin-right:2px }
.sub-btn { font-size:11px; font-weight:700; padding:5px 12px; border-radius:999px; border:1px solid var(--border2); color:var(--text2); background:var(--bg2) }
.sub-btn.active { background:var(--acc-dim); border-color:var(--acc); color:var(--acc) }
.sub-size { margin-left:auto }
@media (min-width:900px) { #sub-bar { padding-left:36px; padding-right:36px } }

/* Celular: menos botones (el doble toque ya adelanta y retrocede) */
@media (max-width:600px) {
  .plyr__controls [data-plyr="rewind"], .plyr__controls [data-plyr="fast-forward"],
  .plyr__controls [data-plyr="pip"], .plyr__controls .plyr__time--duration,
  .plyr__controls .plyr__time + .plyr__time { display:none }
  .plyr__controls .plyr__volume { width:auto; min-width:0; max-width:none }
  .plyr__controls .plyr__volume input[type=range] { display:none }
  .plyr--video .plyr__controls { padding:6px 8px 8px }
  .plyr__progress__container { margin-left:6px }
}

/* Episodio sin video todavía */
.hf-novideo { position:absolute; inset:0; z-index:9; display:flex; flex-direction:column; align-items:center; justify-content:center;
              gap:6px; background:rgba(4,8,15,.82); text-align:center; padding:16px }
.hf-novideo b { font-family:'Syne',sans-serif; font-size:18px; color:#e8f4f8 }
.hf-novideo span { font-size:12px; color:#6b8fa0 }

/* sin el recuadro azul al tocar botones del reproductor en el celular */
.plyr, .plyr * { -webkit-tap-highlight-color:transparent }
.plyr button:focus:not(:focus-visible), .plyr input:focus:not(:focus-visible) { outline:none; box-shadow:none }