/* tv/tv.css — solo lo que style.css no trae para la app de una sola página.
   Sin gap, inset, aspect-ratio, clamp ni :has (TVs viejas). */

.tv-app{min-height:60vh;}
.tv-cargando{padding:140px 2.2rem;color:var(--muted);font-size:1.1rem;}
a.gs-btn{text-decoration:none;}

/* ----- listado: grilla con float (7 columnas) ----- */
.tv-listado{padding:118px 2.2rem 60px;}
.gs-listado-title{
  font-family:var(--display);font-weight:900;font-size:1.8rem;margin:0 0 26px;
  display:flex;align-items:center;
}
.tv-grid:after{content:"";display:block;clear:both;}
.tv-grid .gs-card{float:left;width:12.4%;margin:0 1.1% 1.4em 0;font-size:1rem;}
.tv-grid .gs-card img{width:100%;height:17.5vw;object-fit:cover;}   /* alto fijo ~2:3, sin aspect-ratio */
.tv-grid .gs-card-title{height:2.6em;}                              /* alto fijo: las filas del float no se enganchan */

/* ----- paginación ----- */
.gs-paginacion{clear:both;text-align:center;margin-top:44px;font-family:var(--mono);font-size:.9rem;}
.gs-pagina{
  display:inline-block;min-width:40px;height:40px;line-height:38px;padding:0 12px;margin:0 4px 8px;
  border-radius:8px;background:var(--surface);border:1px solid var(--surface-2);
  color:var(--bone);font-weight:700;text-align:center;text-decoration:none;
}
.gs-pagina.activa{background:var(--slime);color:#0A0D0B;border-color:var(--slime);}

/* ----- pantallas angostas (celular): 3 columnas ----- */
@media (max-width:720px){
  .tv-listado{padding:100px 16px 40px;}
  .tv-grid .gs-card{width:31.5%;margin-right:2.5%;}
  .tv-grid .gs-card img{height:46vw;}
}