/* Novelas Shots: banner + carruseles. Primero móvil. Los colores y tamaños los cambia el panel (variables --nsh-*). */
.nsh,.nsh *{box-sizing:border-box}
.nsh{--nsh-gold:#e8c46c;--nsh-bg:#050403;--nsh-sf:#100d09;--nsh-tx:#f3eadb;--nsh-mut:#b2a690;--nsh-line:#2b2217;--nsh-r:16px;--nsh-rb:24px;--nsh-bh:260px;--nsh-v:3;--nsh-gap:14px;
  --nsh-fu:Inter,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;--nsh-fh:'Cormorant Garamond','Playfair Display',Georgia,serif;
  color:var(--nsh-tx);font-family:var(--nsh-fu);line-height:1.4;-webkit-text-size-adjust:100%}
.nsh a{text-decoration:none}
.nsh svg{display:block}
.nsh :focus-visible{outline:2px solid var(--nsh-gold);outline-offset:3px;border-radius:10px}
.nsh-home{background:var(--nsh-bg);padding:18px 0 44px}
.nsh-in{width:100%;max-width:1240px;margin:0 auto;padding:0 16px}
.nsh-vacio{margin:16px 0;padding:12px 14px;border:1px dashed var(--nsh-line);border-radius:12px;color:var(--nsh-mut);font-size:14px}

/* ---------- Banner: solo imagen ---------- */
.nsh-banner{position:relative;margin:0}
.nsh-bn-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;border-radius:var(--nsh-rb);background:var(--nsh-sf);box-shadow:0 14px 36px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06)}
.nsh-bn-track::-webkit-scrollbar{display:none}
.nsh-bn-slide{position:relative;display:block;flex:0 0 100%;min-width:0;height:var(--nsh-bh);scroll-snap-align:start;scroll-snap-stop:always;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent}
.nsh-bn-slide img,.nsh-bn-slide svg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;user-select:none;transition:transform .6s ease}
.nsh-bn-slide::after{content:"";position:absolute;inset:auto 0 0 0;height:38%;background:linear-gradient(0deg,rgba(0,0,0,.55),transparent);pointer-events:none}
@media (hover:hover){.nsh-bn-slide:hover img{transform:scale(1.03)}}
.nsh-dots{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);z-index:2;display:flex;align-items:center;gap:8px;padding:7px 11px;border-radius:99px;background:rgba(0,0,0,.52)}
.nsh-dot{position:relative;width:8px;height:8px;padding:0;border:0;border-radius:99px;background:rgba(255,255,255,.55);cursor:pointer;transition:width .25s,background .25s}
.nsh-dot::after{content:"";position:absolute;inset:-9px -4px}
.nsh-dot[aria-current="true"]{width:22px;background:var(--nsh-gold)}

/* ---------- Secciones y carruseles ---------- */
.nsh-sec,.nsh-gen{margin:30px 0 0}
.nsh-sec{padding-top:2px}
.nsh-banner+.nsh-sec{margin-top:30px}
.nsh-sec-h{display:flex;align-items:center;gap:12px;margin:0 0 16px}
.nsh-sec-i{flex:none;width:26px;height:26px;color:var(--nsh-gold)}
.nsh-sec-i svg{width:100%;height:100%}
.nsh-i-fire{color:#f08a3c}
.nsh-sec-t{flex:1;min-width:0;margin:0;font:700 clamp(20px,5.2vw,26px)/1.2 var(--nsh-fu);letter-spacing:-.01em;color:var(--nsh-tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nsh-all{flex:none;display:inline-flex;align-items:center;gap:2px;padding:7px 8px 7px 14px;border-radius:99px;color:var(--nsh-gold);font:600 clamp(14px,3.8vw,16px)/1 var(--nsh-fu);transition:background .2s}
.nsh-all:hover{background:rgba(255,255,255,.07)}
.nsh-all svg{width:20px;height:20px}
.nsh-rw{position:relative}
.nsh-row{display:flex;gap:var(--nsh-gap);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 0 6px}
.nsh-row::-webkit-scrollbar{display:none}
.nsh-card{flex:0 0 calc((100% - var(--nsh-gap) * (var(--nsh-v) - 1)) / var(--nsh-v));min-width:0;scroll-snap-align:start;color:var(--nsh-tx)}
.nsh-cov{position:relative;display:block;aspect-ratio:2/3;border-radius:var(--nsh-r);overflow:hidden;border:1px solid var(--nsh-line);background:var(--nsh-sf);box-shadow:0 10px 24px rgba(0,0,0,.42);transition:border-color .25s}
.nsh-cov>img,.nsh-cov>svg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
@media (hover:hover){.nsh-card:hover .nsh-cov{border-color:var(--nsh-gold)}}
.nsh-card,.nsh-cov{-webkit-tap-highlight-color:transparent}
.nsh-cov::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,.28));pointer-events:none}
.nsh-ct{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:12px;font:600 clamp(14.5px,3.9vw,17px)/1.3 var(--nsh-fu);overflow-wrap:break-word;word-break:normal}
.nsh-cg{display:block;margin-top:3px;color:var(--nsh-mut);font:400 13px/1.3 var(--nsh-fu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nsh-cs{display:block;margin-top:3px;color:var(--nsh-gold);font:500 12.5px/1.3 var(--nsh-fu);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Carruseles personales sin sesión / sin lista: aviso con botones */
.nsh-msg{padding:20px 18px;border:1px solid var(--nsh-line);border-radius:var(--nsh-r);background:var(--nsh-sf);text-align:center}
.nsh-msg p{margin:0 0 14px;color:var(--nsh-mut);font:400 15px/1.5 var(--nsh-fu)}
.nsh-msg-b{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.nsh-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border:1px solid var(--nsh-gold);border-radius:99px;background:var(--nsh-gold);color:#17120a;font:700 14.5px/1 var(--nsh-fu);transition:filter .2s}
.nsh-btn:hover{filter:brightness(1.08)}
.nsh-btn-sec{background:transparent;color:var(--nsh-gold)}
.nsh-btn-sec:hover{background:rgba(255,255,255,.07);filter:none}
.nsh-rt{position:absolute;z-index:2;left:5px;bottom:5px;padding:4px 9px;border:1px solid rgba(255,255,255,.22);border-radius:99px;background:rgba(0,0,0,.82);color:#fff;font:700 12px/1.3 var(--nsh-fu);box-shadow:0 2px 8px rgba(0,0,0,.28)}
.nsh-pop{position:absolute;z-index:2;top:8px;left:8px;display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border:1px solid rgba(255,255,255,.22);border-radius:7px;background:rgba(12,12,12,.94);color:#fff;font:800 11px/1.2 var(--nsh-fu);letter-spacing:.03em;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.24)}
.nsh-pop-plain{top:39px;background:rgba(38,28,18,.96)}
.nsh-pop .nsh-pop-icon{display:block;width:18px;height:18px;min-width:18px;flex:0 0 18px;margin:0 4px 0 0;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.nsh .nsh-pop .nsh-pop-label{position:relative;display:inline-block;flex:0 0 auto;margin:0 0 0 2px;padding-left:2px;line-height:1.2}
.nsh .nsh-pop{gap:5px;overflow:visible}
.nsh .nsh-pop .nsh-pop-icon{overflow:visible}
.nsh-pop .nsh-pop-eye circle{fill:currentColor;stroke:none}
.nsh-pop .nsh-pop-heart{fill:currentColor;stroke:none}
.nsh-pop .nsh-pop-label{display:block;flex:0 0 auto;line-height:1.2;margin-left:1px}
.nsh-arr{display:none;position:absolute;top:40%;z-index:3;width:46px;height:46px;margin-top:-23px;padding:0;place-items:center;border:1px solid var(--nsh-gold);border-radius:50%;background:rgba(5,4,3,.88);color:var(--nsh-gold);cursor:pointer}
.nsh-arr svg{width:22px;height:22px}
.nsh-arr-p{left:-14px}.nsh-arr-n{right:-14px}
.nsh-arr:disabled{opacity:0;pointer-events:none}
.nsh-noscroll .nsh-arr{display:none!important}

/* ---------- Géneros ---------- */
.nsh-gen-t{margin-bottom:14px;white-space:normal}
.nsh-chips{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:2px 0 4px;-webkit-overflow-scrolling:touch}
.nsh-chips::-webkit-scrollbar{display:none}
.nsh-chip{flex:none;display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border:1px solid var(--nsh-line);border-radius:99px;background:var(--nsh-sf);color:var(--nsh-tx);font:500 15px/1 var(--nsh-fu);transition:border-color .2s}
.nsh-chip i{width:9px;height:9px;border-radius:50%;background:var(--c,var(--nsh-gold))}
@media (hover:hover){.nsh-chip:hover{border-color:var(--c,var(--nsh-gold))}}
.nsh-chip-e{font-size:17px;line-height:1}

/* ---------- Página "Ver todo" ---------- */
.nsh-h1{margin:6px 0 18px;font:600 clamp(26px,6vw,36px)/1.15 var(--nsh-fu);color:var(--nsh-tx)}
.nsh-lista .nsh-gen{margin:0 0 22px}
.nsh-grid{display:grid;grid-template-columns:repeat(var(--nsh-v),minmax(0,1fr));gap:22px var(--nsh-gap)}
.nsh-grid .nsh-card{flex:none}
.nsh-pag{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:32px 0 0}
.nsh-pag a,.nsh-pag span{display:inline-grid;place-items:center;min-width:42px;height:42px;padding:0 12px;border:1px solid var(--nsh-line);border-radius:12px;color:var(--nsh-tx);font:500 15px/1 var(--nsh-fu)}
.nsh-pag .is-on{border-color:var(--nsh-gold);color:var(--nsh-gold)}

@media (min-width:700px){
  .nsh{--nsh-gap:18px}
  .nsh-in{padding:0 28px}
  .nsh-bn-slide{height:calc(var(--nsh-bh) + 110px)}
}
@media (min-width:900px){
  .nsh-arr{display:grid}
}
@media (prefers-reduced-motion:reduce){.nsh *{transition:none!important}}

/* ---------- Estilo compacto en teléfono (tipo Webtoon): todo más pequeño ---------- */
@media (max-width:699px){
  .nsh{--nsh-gap:8px}
  .nsh-home{padding:10px 0 24px}
  .nsh-in{padding:0 14px}
  /* banner */
  .nsh-bn-track{border-radius:min(var(--nsh-rb),12px);box-shadow:none}
  .nsh-bn-slide{height:min(var(--nsh-bh),170px)}
  .nsh-dots{bottom:8px;gap:5px;padding:4px 7px}
  .nsh-dot{width:6px;height:6px}
  .nsh-dot[aria-current="true"]{width:15px}
  .nsh-dot::after{inset:-10px -4px}
  /* secciones */
  .nsh-sec,.nsh-gen{margin-top:20px}
  .nsh-banner+.nsh-sec{margin-top:20px}
  .nsh-sec-h{gap:7px;margin-bottom:9px}
  .nsh-sec-i{width:17px;height:17px}
  .nsh-sec-t{font-size:17px;font-weight:700}
  .nsh-all{padding:5px 2px 5px 8px;font-size:12.5px}
  .nsh-all svg{width:15px;height:15px}
  /* tarjetas: 3 y un poquito de la siguiente */
  .nsh-card{flex-basis:calc((100% - var(--nsh-gap) * (var(--nsh-v) - 1)) / (var(--nsh-v) + .25))}
  .nsh-cov{border-radius:min(var(--nsh-r),6px);box-shadow:none}
  .nsh-ct{margin-top:6px;font-size:12.5px;font-weight:500;line-height:1.3}
  .nsh-cg{margin-top:2px;font-size:11px}
  .nsh-cs{margin-top:2px;font-size:11px}
  .nsh-msg{padding:16px 12px}
  .nsh-msg p{font-size:13.5px}
  .nsh-btn{min-height:38px;padding:0 16px;font-size:13.5px}
  .nsh-rt{left:3px;bottom:3px;padding:2px 6px;font-size:10.5px}.nsh-pop{top:5px;left:5px;gap:5px;padding:3px 7px;font-size:10px}.nsh-pop .nsh-pop-icon{width:17px;height:17px;min-width:17px;flex-basis:17px;margin-right:4px}.nsh-pop .nsh-pop-label{margin-left:2px;padding-left:2px}.nsh-pop-plain{top:32px}
  .nsh-row{padding:0 0 2px}
  /* géneros */
  .nsh-gen-t{margin-bottom:9px}
  .nsh-chips{gap:6px}
  .nsh-chip{padding:7px 12px;gap:6px;font-size:12.5px}
  .nsh-chip i{width:7px;height:7px}
  .nsh-chip-e{font-size:14px}
  /* página "Ver todo" */
  .nsh-h1{margin:2px 0 12px;font-size:21px}
  .nsh-grid{gap:14px 8px}
  .nsh-pag{gap:6px;margin-top:22px}
  .nsh-pag a,.nsh-pag span{min-width:34px;height:34px;padding:0 9px;border-radius:8px;font-size:13px}
}

/* ---------- La imagen se adapta al cuadro, no al revés ----------
   El cuadro tiene su tamaño fijo y la imagen lo llena por completo (se centra y recorta lo que sobre). */
.nsh-cov>img,.nsh-bn-slide img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover!important;object-position:center;display:block}
.nsh-cov::after,.nsh-bn-slide::after{z-index:2}

.nsh-cov>img,.nsh-bn-slide img{image-rendering:auto;-ms-interpolation-mode:bicubic;backface-visibility:hidden}

/* ---------- Botón «Ver todos» y chip activo (géneros) ---------- */
.nsh-chip svg{width:15px;height:15px;flex:none}
.nsh-chip.is-on{border-color:var(--c,var(--nsh-gold));color:var(--nsh-gold)}
.nsh-chip-all{font-weight:600}
.nsh-chip-all.is-on{border-color:var(--nsh-gold);background:var(--nsh-gold);color:#1a1208}

/* ---------- Filtro de «Todas las novelas» ---------- */
.nsh-fil{max-width:780px;margin:0 0 20px;display:flex;flex-direction:column;gap:10px}
.nsh-fil-s{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.nsh-fil-s.nsh-fil-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.nsh-fil-s label{display:flex;flex-direction:column;gap:4px;min-width:0;margin:0}
.nsh-fil-s span{font-size:11.5px;color:var(--nsh-mut)}
.nsh-fil-s select{width:100%;height:42px;margin:0;padding:0 28px 0 12px;border:1px solid var(--nsh-line);border-radius:12px;background-color:var(--nsh-sf);color:var(--nsh-tx);font:400 16px var(--nsh-fu);text-overflow:ellipsis;box-shadow:none}
.nsh-fil-s select option{background:var(--nsh-sf);color:var(--nsh-tx)}
.nsh-fil-pie{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;font-size:13px;color:var(--nsh-mut)}
.nsh-fil-pie a{color:var(--nsh-gold);font-weight:600}
@media (max-width:699px){
  .nsh-fil{gap:8px;margin-bottom:14px}
  .nsh-fil-s{gap:6px}.nsh-fil-s span{font-size:10.5px}
  .nsh-fil-s select{height:38px;padding:0 22px 0 9px}
}

/* ---------- Página «Todas las novelas»: sin el título del tema ---------- */
.nsh-pag-lista .entry-title:empty,.nsh-pag-lista .page-title:empty,.nsh-pag-lista .post-title:empty,.nsh-pag-lista .entry-header:empty{display:none}
/* Título de la lista: no se ve, pero queda en el código para lectores de pantalla y buscadores */
.nsh-sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Banner con dos imágenes (celular / computadora): el <picture> no pinta nada, solo elige cuál se ve */
.nsh-bn-slide picture{display:contents}

/* ---------- Géneros + Tags en «Todas las novelas» (v1.4.0): dos filas con el mismo diseño ---------- */
.nsh-lbl{margin:0 0 8px;color:var(--nsh-mut);font:600 12px/1.2 var(--nsh-fu);letter-spacing:.12em;text-transform:uppercase}
.nsh-lista .nsh-gen:has(+ .nsh-tags){margin-bottom:14px}
@media (min-width:900px){
  .nsh-tags .nsh-chips{flex-wrap:wrap;overflow-x:visible}   /* en computadora los tags se ven todos, sin deslizar */
}
@media (max-width:699px){
  .nsh-lbl{margin-bottom:6px;font-size:10.5px}
  .nsh-lista .nsh-gen:has(+ .nsh-tags){margin-bottom:10px}
}

/* Insignia de popularidad (ojo/corazón + número): un solo espacio entre icono y texto, sin márgenes que se sumen */
.nsh .nsh-pop{gap:5px}
.nsh .nsh-pop .nsh-pop-icon{position:static;inset:auto;margin:0;width:16px;height:16px;min-width:16px;flex:0 0 16px}
.nsh .nsh-pop .nsh-pop-label{margin:0;padding:0}

/* Sellos de la portada. Todo se escala según el ancho de la tarjeta (cqw), así se ve proporcionado con 2, 3, 4 o más tarjetas por fila:
   --nsh-c = diámetro de los dos círculos (popularidad arriba a la derecha y «Nuevo» arriba a la izquierda; siempre del mismo tamaño);
   --nsh-o = distancia al borde, igual para los círculos, los sellos alargados y la valoración. */
.nsh-cov{container-type:inline-size}
.nsh-sellos,.nsh .nsh-pop{--nsh-c:clamp(28px,24cqw,40px);--nsh-o:clamp(3px,3.2cqw,6px)}
.nsh-sellos{position:absolute;z-index:3;top:var(--nsh-o);left:var(--nsh-o);right:auto;display:flex;flex-direction:column;align-items:flex-start;gap:clamp(3px,2.6cqw,5px);max-width:calc(100% - var(--nsh-c) - var(--nsh-o) * 2 - 2px);pointer-events:none}
.nsh-sellos .nsh-sello{display:inline-block;max-width:100%;overflow:hidden;text-overflow:ellipsis;padding:calc(var(--nsh-c) * .13) calc(var(--nsh-c) * .25);border:1px solid rgba(255,255,255,.22);border-radius:calc(var(--nsh-c) * .2);background:rgba(12,12,12,.94);color:#fff;font:800 clamp(9px,8.4cqw,11px)/1.2 var(--nsh-fu);letter-spacing:.02em;white-space:nowrap;box-shadow:0 2px 6px rgba(0,0,0,.24)}
.nsh-sellos .nsh-sello-pausa{color:rgba(255,255,255,.72)}
.nsh .nsh-pop,.nsh-sellos .nsh-sello-nuevo{box-sizing:border-box;width:var(--nsh-c);height:var(--nsh-c);min-width:var(--nsh-c);max-width:none;padding:0;display:flex;align-items:center;justify-content:center;border-radius:50%;overflow:visible;font:800 calc(var(--nsh-c) * .29)/1 var(--nsh-fu);letter-spacing:-.03em;text-align:center}
.nsh .nsh-pop{top:var(--nsh-o);right:var(--nsh-o);left:auto}
.nsh .nsh-pop-plain{top:calc(var(--nsh-o) + var(--nsh-c) + 4px)}
.nsh .nsh-rt{left:clamp(3px,3.2cqw,6px);bottom:clamp(3px,3.2cqw,6px)}

/* Color dorado: círculo de vistas, círculo «Nuevo» y estrella de valoración */
.nsh .nsh-pop,.nsh-sellos .nsh-sello-nuevo,.nsh .nsh-rt{color:var(--nsh-gold);border-color:rgba(232,196,108,.55)}
