/* ══════════ CINE Y SERIES — sala oscura + tira de película ══════════ */
.cine{
  background:linear-gradient(180deg, #1B1424, #120D18 60%);
  border-radius:var(--radio); padding:18px 14px 18px; margin:0 -4px; color:#F4EDE3;
  position:relative; overflow:hidden; box-shadow:inset 0 2px 10px rgba(0,0,0,.4);
}
.cine::before, .cine::after{
  content:""; position:absolute; left:0; right:0; height:16px;
  background-image:repeating-linear-gradient(90deg, #F2CB4E 0 10px, #1B1424 10px 20px);
  opacity:.9;
}
.cine::before{top:0} .cine::after{bottom:0}
.cine-body{position:relative; z-index:1; margin-top:6px}
.cine-kpis{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-bottom:12px}
.cine-kpi{background:rgba(255,255,255,.06); border:1px solid rgba(242,203,78,.35); border-radius:10px; padding:10px 6px; text-align:center}
.cine-kpi b{display:block; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:1.1rem; color:#F2CB4E}
.cine-kpi span{font-family:'IBM Plex Mono',monospace; font-size:.5rem; text-transform:uppercase; letter-spacing:.03em; color:#C9BFD6; display:block; margin-top:2px}
/* `wrap` no es decorativo: con cuatro pestañas cabían en una línea, y al entrar
   «Recomendaciones» pasaron a medir 376px en los 319 que deja un móvil. Sin
   envolver —y con overflow visible— «+ Añadir» y «Editar» se quedaban fuera de
   la pantalla y sin forma de llegar a ellas. Dos secciones inalcanzables por no
   poner una palabra. */
.cine-subnav{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px}

/* ── La página de la película ── */
.peli-cab{display:flex; gap:14px; align-items:flex-start; margin-bottom:12px}
.peli-poster{
  flex-shrink:0; width:120px; aspect-ratio:2/3; border-radius:12px;
  background:#3A2F3E center/cover no-repeat; border:1px solid #5A4668;
}
.peli-datos{flex:1; min-width:0}
.peli-datos h2{font-family:'Bricolage Grotesque',sans-serif; font-size:1.25rem; line-height:1.2; color:#F6E9D2; margin-bottom:4px}
.peli-sub{font-family:'IBM Plex Mono',monospace; font-size:.62rem; letter-spacing:.06em; text-transform:uppercase; color:#C9BFD6}
.peli-notas-fila{display:flex; gap:10px; align-items:flex-end; margin:8px 0 4px}
.peli-nota, .peli-nota-tmdb{font-family:'Bricolage Grotesque',sans-serif; font-size:1.5rem; display:flex; flex-direction:column; align-items:flex-start; line-height:1.1}
.peli-nota{color:#F2CB4E}
.peli-nota-tmdb{color:#90CEA1}
.peli-nota small, .peli-nota-tmdb small{font-family:'IBM Plex Mono',monospace; font-size:.5rem; text-transform:uppercase; letter-spacing:.04em; color:#C9BFD6; font-weight:400; margin-top:1px}
.peli-linea{font-size:.78rem; color:#EDE4F4; margin-top:4px}
.peli-linea b{color:#C9BFD6; font-weight:600}
.peli-sinopsis{font-size:.8rem; line-height:1.55; color:#EDE4F4; margin-top:6px}
.peli-plataformas{display:flex; flex-wrap:wrap; gap:10px; margin-top:8px}
.peli-plataforma{display:flex; flex-direction:column; align-items:center; gap:4px; width:64px}
.peli-plataforma img{width:44px; height:44px; border-radius:10px; display:block}
.peli-plataforma i{font-style:normal; font-family:'IBM Plex Mono',monospace; font-size:.52rem; color:#C9BFD6; text-align:center; line-height:1.3}
/* Cabecera de las tarjetas con carrusel: título y pestañas en la misma fila. */
.cine-sw-cab{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap; margin-bottom:8px}
.cine-sw-cab h4{margin:0}
.cine-poster[data-peli]{cursor:pointer}
.cine-subnav button{
  flex:1; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:.7rem;
  padding:8px 6px; border-radius:10px; border:1.5px solid rgba(242,203,78,.35);
  background:rgba(0,0,0,.25); color:#F4EDE3; cursor:pointer; text-align:center;
}
.cine-subnav button.on{background:#F2CB4E; color:#1B1424; border-color:#F2CB4E}
.cine-stat-card{background:rgba(255,255,255,.05); border-radius:10px; padding:12px; margin-bottom:10px; border-left:4px solid #F2CB4E}
.cine-stat-card h4{font-family:'Bricolage Grotesque',sans-serif; font-size:.84rem; margin:0 0 10px; color:#F4EDE3}
.cine-bar-row{display:flex; align-items:center; gap:8px; font-size:.72rem; padding:3px 0}
.cine-bar-row .et{width:34px; flex-shrink:0; font-family:'IBM Plex Mono',monospace; color:#C9BFD6}
.cine-bar-row .barra{flex:1; height:10px; background:rgba(255,255,255,.08); border-radius:5px; overflow:hidden}
.cine-bar-row .barra i{display:block; height:100%; background:linear-gradient(90deg,#A4243B,#F2CB4E)}
.cine-bar-row .val{width:26px; text-align:right; font-family:'IBM Plex Mono',monospace; color:#F4EDE3; flex-shrink:0}
.cine-form{background:rgba(255,255,255,.05); border-radius:12px; padding:14px}
.cine-form label{display:block; font-family:'IBM Plex Mono',monospace; font-size:.6rem; text-transform:uppercase; letter-spacing:.05em; color:#C9BFD6; margin:12px 0 5px}
.cine-form label:first-child{margin-top:0}
#cine-sugerencias{position:relative}
.cine-sugerencia{
  display:flex; align-items:center; gap:8px; padding:7px 6px; border-radius:6px; cursor:pointer;
  background:rgba(255,255,255,.04);
}
.cine-sugerencia:hover, .cine-sugerencia:active{background:rgba(242,203,78,.15)}
.cine-sugerencia + .cine-sugerencia{margin-top:3px}
.cine-sugerencia .miniatura{width:28px; height:42px; border-radius:3px; background-size:cover; background-position:center; background-color:rgba(255,255,255,.08); flex-shrink:0}
.cine-sugerencia .info{flex:1; min-width:0}
.cine-sugerencia .info b{display:block; font-size:.8rem; color:#F4EDE3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cine-sugerencia .info span{display:block; font-family:'IBM Plex Mono',monospace; font-size:.6rem; color:#C9BFD6}
.cine-sugerencia .ya-existe{font-family:'IBM Plex Mono',monospace; font-size:.54rem; text-transform:uppercase; background:#F2CB4E; color:#1B1424; padding:2px 5px; border-radius:4px; flex-shrink:0}
.cine-form input,.cine-form select{
  width:100%; box-sizing:border-box; font-family:'Instrument Sans',sans-serif; font-size:.88rem;
  padding:9px 10px; border-radius:8px; border:1.5px solid rgba(242,203,78,.35); background:#F4EDE3; color:#1B1424;
}
.cine-btn{
  font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:.76rem; padding:9px 14px;
  border-radius:9px; border:1.5px solid rgba(242,203,78,.4); background:rgba(0,0,0,.25); color:#F4EDE3; cursor:pointer;
}
.cine-btn.primario{background:#F2CB4E; color:#1B1424; border-color:#F2CB4E}
.cine-btn-row{display:flex; gap:8px; flex-wrap:wrap; margin:12px 0}
.cine-pendiente{background:rgba(164,36,59,.18); border:1.5px dashed #A4243B; border-radius:10px; padding:10px 12px; font-size:.78rem; line-height:1.6; margin-bottom:12px}
.cine-pendiente-toca{display:block; width:100%; text-align:left; cursor:pointer; font-family:inherit; color:inherit}
.cine-pendiente-toca:hover{border-color:#F2CB4E}
.cine-progreso{background:rgba(255,255,255,.08); border-radius:6px; height:8px; overflow:hidden; margin-top:8px}
.cine-progreso i{display:block; height:100%; background:#F2CB4E; transition:width .2s}
.cine-vacio{background:rgba(255,255,255,.05); border:1.5px dashed rgba(242,203,78,.3); border-radius:12px; padding:20px 14px; text-align:center; color:#C9BFD6; font-family:'IBM Plex Mono',monospace; font-size:.72rem; line-height:1.6}
.cine-bar-row{cursor:pointer}
.cine-anio-top{display:flex; align-items:center; gap:10px; margin-bottom:14px}
.cine-anio-top h3{font-family:'Bricolage Grotesque',sans-serif; font-size:1.15rem; margin:0; color:#F2CB4E}
.cine-galeria{display:grid; grid-template-columns:repeat(3,1fr); gap:10px}
.cine-poster{position:relative; border-radius:9px; overflow:hidden; box-shadow:0 6px 14px rgba(0,0,0,.5); border:1.5px solid rgba(242,203,78,.25)}
.cine-poster-img{aspect-ratio:2/3; width:100%; background-size:cover; background-position:center; background-color:#2A2032}
.cine-poster-info{position:absolute; left:0; right:0; bottom:0; padding:16px 6px 6px; background:linear-gradient(0deg, rgba(0,0,0,.92), transparent)}
.cine-poster-info b{display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:.66rem; line-height:1.2; color:#fff; margin-bottom:3px}
.cine-nota-badge{display:inline-block; font-family:'IBM Plex Mono',monospace; font-weight:700; font-size:.62rem; background:rgba(0,0,0,.5); color:#F2CB4E; padding:1px 5px; border-radius:5px}
.cine-poster.oro{border-color:#FFD700; box-shadow:0 0 16px rgba(255,215,0,.5), 0 6px 14px rgba(0,0,0,.5)}
.cine-poster.oro .cine-nota-badge{background:#FFD700; color:#1B1424}
.cine-poster.plata{border-color:#D7DEE3; box-shadow:0 0 10px rgba(215,222,227,.35), 0 6px 14px rgba(0,0,0,.5)}
.cine-poster.plata .cine-nota-badge{background:#D7DEE3; color:#1B1424}
.cine-poster.bronce{border-color:#CD7F32; box-shadow:0 0 10px rgba(205,127,50,.35), 0 6px 14px rgba(0,0,0,.5)}
.cine-poster.bronce .cine-nota-badge{background:#CD7F32; color:#1B1424}
.cine-actor-row{display:flex; align-items:center; gap:8px; padding:6px 0; font-size:.78rem; border-bottom:1px dashed rgba(255,255,255,.08)}
.cine-actor-row:last-child{border-bottom:0}
.cine-actor-row .n{width:18px; font-family:'IBM Plex Mono',monospace; color:#C9BFD6; font-size:.68rem; flex-shrink:0}
.cine-actor-row .nombre{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600}
.cine-actor-row .val{font-family:'IBM Plex Mono',monospace; font-weight:700; color:#F2CB4E; font-size:.74rem; flex-shrink:0}


/* ── Los tops: título en amarillo, puntos y flecha ──
   Con seis paneles los rótulos de pestaña no caben, así que manda el título del
   top actual; los puntitos dicen cuántos hay y por dónde vas, y la flecha (o un
   toque en un punto) lleva al siguiente. */
.cine-sw-cab .sw-titulo{
  color:#F2CB4E; font-family:'Bricolage Grotesque',sans-serif; font-weight:800;
  font-size:.92rem; margin:0; flex:1; min-width:0; line-height:1.2;
  /* Antes se recortaba con "…" ("Directores mejor valorados" no cabía en una
     línea junto a los puntitos). Sin nowrap se parte en dos en vez de cortarse. */
  overflow:visible; white-space:normal;
}
.cine-top-anio{
  flex-shrink:0; width:auto; font-size:.7rem; padding:5px 7px; border-radius:8px;
  border:1.5px solid #4A3D5C; background:#241B31; color:#F4EDE3;
  font-family:'IBM Plex Mono',monospace;
}
.sw-puntos{ display:flex; align-items:center; gap:5px; padding:2px 0 8px }
.sw-puntos i{
  width:7px; height:7px; border-radius:50%; background:#4A3D5C; cursor:pointer;
  transition:background .15s, transform .15s;
}
.sw-puntos i.on{ background:#F2CB4E; transform:scale(1.25) }
.sw-flecha{
  margin-left:auto; color:#F2CB4E; font-size:1.1rem; line-height:1; cursor:pointer;
  padding:0 4px; user-select:none;
}

/* Las filas de los tops se abren: llevan a la persona o a la ficha del título. */
.cine-actor-row.toca{ cursor:pointer; border-radius:7px }
.cine-actor-row.toca:hover{ background:rgba(242,203,78,.12) }
.cine-actor-row .nombre small{ color:#C9BFD6; font-weight:400 }

/* La página de un actor o director. */
.cine-persona-sub{
  font-family:'IBM Plex Mono',monospace; font-size:.68rem; color:#C9BFD6;
  margin:2px 0 12px; line-height:1.5;
}

/* ── Los años del filtro, como chips que se combinan ──
   Un desplegable solo dejaba elegir uno; en chips se pueden marcar 2025 y 2026
   a la vez, que es de lo que se trata. La fila se desplaza si no caben. */
.cine-anios{
  display:flex; gap:5px; overflow-x:auto; padding:2px 0 8px;
  scrollbar-width:none;
}
.cine-anios::-webkit-scrollbar{ display:none }
.cine-anio-chip{
  flex:0 0 auto; font-family:'IBM Plex Mono',monospace; font-size:.62rem;
  padding:4px 9px; border-radius:999px; cursor:pointer;
  border:1.5px solid #4A3D5C; background:#241B31; color:#C9BFD6;
}
.cine-anio-chip.on{ background:#F2CB4E; border-color:#F2CB4E; color:#1B1424; font-weight:700 }

/* ── El listado de una persona ──
   Filas en vez de rejilla de carteles: aquí se lee el título y la nota, y una
   rejilla de pósters de proporciones distintas quedaba descuadrada. */
.cine-lista{ display:grid; gap:7px }
.cine-lista-fila{
  display:flex; align-items:center; gap:11px; cursor:pointer;
  background:#241B31; border:1.5px solid #3A2E4A; border-radius:11px;
  padding:8px 11px 8px 8px;
}
.cine-lista-fila:hover{ border-color:#F2CB4E }
.cine-lista-fila .mini{
  flex:0 0 auto; width:42px; height:60px; border-radius:6px;
  background-size:cover; background-position:center;
  display:flex; align-items:center; justify-content:center;
  font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:.9rem;
  color:#F4EDE3;
}
.cine-lista-fila .txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:3px }
.cine-lista-fila .txt b{
  font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:.92rem;
  color:#F4EDE3; line-height:1.25;
}
.cine-lista-fila .txt small{
  font-family:'IBM Plex Mono',monospace; font-size:.62rem; color:#C9BFD6;
}
/* La nota, en chapa dorada: es lo que se busca al recorrer la lista. */
.cine-lista-fila .chapa{
  flex:0 0 auto; min-width:38px; text-align:center;
  background:#F2CB4E; color:#1B1424; border-radius:999px; padding:5px 9px;
  font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:.86rem;
}
.cine-lista-fila .chapa.vacia{ background:#3A2E4A; color:#C9BFD6 }

/* ══════════ RECOMENDACIONES ══════════ */
.reco-h{
  display:flex; align-items:center; gap:10px;
  font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:1rem;
  color:#F4EDE3; margin:18px 0 10px;
}
.reco-h:first-child{margin-top:0}
.reco-h span{
  font-family:'IBM Plex Mono',monospace; font-size:.6rem; font-weight:700;
  background:#F2CB4E; color:#1B1424; border-radius:999px; padding:2px 7px;
}
/* El botón de la cabecera se va a la derecha sin necesidad de un hueco vacío. */
.reco-h .cine-btn{margin-left:auto}

/* Tarjetas de un ancho MÍNIMO y tantas como quepan, no un número por tamaño de
   pantalla: es la misma decisión que en los sellos del pasaporte, y por el mismo
   motivo — el CSS ya sabe cuánto sitio hay, y repetir esa cuenta en cada corte de
   pantalla es tener la misma regla escrita en varios sitios. */
.reco-rejilla{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:10px; margin-bottom:6px;
}
.reco-tarjeta{
  display:flex; flex-direction:column;
  background:rgba(255,255,255,.06); border:1px solid rgba(242,203,78,.28);
  border-radius:12px; overflow:hidden;
}
/* 2:3 es la proporción de un cartel de cine, así que las imágenes de TMDB entran
   sin recortarse y todas las tarjetas de una fila empiezan a la misma altura. */
.reco-cartel{
  width:100%; aspect-ratio:2/3; background-size:cover; background-position:center;
  background-color:rgba(255,255,255,.08);
}
.reco-cartel.sin-cartel{
  display:grid; place-items:center; font-size:1.6rem; opacity:.5;
}
.reco-cuerpo{padding:8px 9px 10px; display:flex; flex-direction:column; gap:6px; flex:1 1 auto}
.reco-titulo{
  font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:.82rem;
  line-height:1.2; color:#F4EDE3;
}
.reco-chips{display:flex; flex-wrap:wrap; gap:3px}
.reco-chip{
  font-family:'IBM Plex Mono',monospace; font-size:.52rem; font-weight:700;
  padding:2px 5px; border-radius:4px; white-space:nowrap;
  background:rgba(255,255,255,.1); color:#C9BFD6;
}
.reco-chip.nota{background:#F2CB4E; color:#1B1424}
.reco-chip.gen{background:rgba(242,203,78,.18); color:#F2CB4E}
.reco-chip.tipo{background:rgba(255,255,255,.14); color:#F4EDE3}
.reco-quien{font-family:'IBM Plex Mono',monospace; font-size:.56rem; color:#F2CB4E; margin:0}
.reco-notas{font-size:.7rem; color:#C9BFD6; margin:0; line-height:1.3}
/* Los botones, al fondo de la tarjeta: así quedan alineados entre tarjetas aunque
   una tenga notas y otra no. */
.reco-acciones{display:flex; flex-wrap:wrap; gap:5px; margin-top:auto}
.reco-acciones .cine-btn{font-size:.56rem; padding:4px 7px}
.reco-vacio{
  background:rgba(255,255,255,.05); border:1px dashed rgba(242,203,78,.3);
  border-radius:10px; padding:14px; font-size:.78rem; color:#C9BFD6; text-align:center;
}
.reco-alta{margin:12px 0}
.reco-alta summary{
  cursor:pointer; font-family:'IBM Plex Mono',monospace; font-size:.62rem;
  text-transform:uppercase; letter-spacing:.05em; color:#F2CB4E; padding:8px 0;
}
.reco-alta[open] summary{margin-bottom:6px}
.reco-pie{font-family:'IBM Plex Mono',monospace; font-size:.58rem; color:#C9BFD6; margin:10px 0 0}
.reco-pie .cine-btn{font-size:.54rem; padding:3px 6px; margin-left:4px}

/* ══════════ TODAS: el catálogo entero ══════════ */
.cine-todas-barra{
  display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-bottom:12px;
}
.cine-chips{display:flex; gap:5px; flex-wrap:wrap}
.cine-chip{
  font-family:'IBM Plex Mono',monospace; font-size:.6rem; font-weight:700;
  text-transform:uppercase; letter-spacing:.04em;
  background:rgba(0,0,0,.25); color:#F4EDE3;
  border:1.5px solid rgba(242,203,78,.35); border-radius:999px;
  padding:5px 10px; cursor:pointer; display:inline-flex; align-items:center; gap:5px;
}
.cine-chip i{font-style:normal; opacity:.65; font-size:.55rem}
.cine-chip.on{background:#F2CB4E; color:#1B1424; border-color:#F2CB4E}
.cine-chip.on i{opacity:.7}
/* El buscador de la pestaña, en el mismo idioma oscuro que el resto de la barra. */
.cine-todas-busca{
  flex:1 1 140px; min-width:0; font-size:.78rem; padding:6px 9px;
  background:rgba(0,0,0,.3); color:#F4EDE3;
  border:1.5px solid rgba(242,203,78,.35); border-radius:9px;
}
.cine-todas-busca::placeholder{color:#C9BFD6}
/* El selector de orden se va a la derecha cuando hay sitio, y baja solo cuando no. */
.cine-todas-orden{display:flex; align-items:center; gap:6px; margin-left:auto}
.cine-todas-orden span{
  font-family:'IBM Plex Mono',monospace; font-size:.58rem; text-transform:uppercase;
  letter-spacing:.05em; color:#C9BFD6; white-space:nowrap;
}
.cine-todas-orden select{
  font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:.7rem;
  background:rgba(0,0,0,.3); color:#F4EDE3;
  border:1.5px solid rgba(242,203,78,.35); border-radius:9px; padding:6px 8px;
}
.cine-todas-cuenta{
  font-family:'IBM Plex Mono',monospace; font-size:.58rem; text-transform:uppercase;
  letter-spacing:.05em; color:#C9BFD6; margin:0 0 10px;
}
.cine-todas-cuenta b{color:#F2CB4E}

/* Carátulas de un ancho mínimo y tantas como quepan. La galería de «lo mejor del
   año» sigue con sus tres columnas fijas —son diez títulos con medalla y ahí el
   tamaño es parte del premio—; esto es un catálogo de mil quinientas, y aquí lo
   que se quiere es ver muchas de un vistazo: 3 en móvil, 8 en escritorio. */
.cine-todas-galeria{grid-template-columns:repeat(auto-fill,minmax(96px,1fr))}

/* ── La nota, en chapa dorada sobre la carátula ── */
/* Antes era una etiqueta pequeña abajo, encima del título y compitiendo con él.
   Ahora es una moneda en la esquina, en el dorado de la sección: se lee de un
   vistazo recorriendo la rejilla, que es para lo que sirve. */
.cine-poster-nota{
  position:absolute; top:5px; right:5px; z-index:2;
  min-width:30px; height:30px; padding:0 5px;
  display:grid; place-items:center;
  font-family:'Bricolage Grotesque',sans-serif; font-weight:800; font-size:.9rem;
  line-height:1; color:#1B1424; border-radius:999px;
  background:linear-gradient(155deg,#FFE58A,#F2CB4E 55%,#D2A121);
  border:1.5px solid rgba(27,20,36,.4);
  /* La sombra interior clara imita el brillo de una chapa; la exterior la
     despega del cartel, que puede ser de cualquier color. */
  box-shadow:0 2px 7px rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.55);
}
/* Sin nota no se deja el hueco vacío: se dice que falta. Apagada, para que no
   compita con las que sí tienen nota. */
.cine-poster-nota.vacia{
  background:rgba(27,20,36,.72); color:#8C8299;
  border-color:rgba(255,255,255,.18); box-shadow:0 2px 6px rgba(0,0,0,.5);
  font-size:.8rem;
}
.cine-poster-todas .cine-poster-info{padding:20px 5px 5px}
.cine-poster-todas .cine-poster-info b{font-size:.6rem}
.cine-poster-pie{
  display:block; font-family:'IBM Plex Mono',monospace; font-size:.5rem;
  letter-spacing:.03em; color:#C9BFD6; margin-top:2px;
}
/* El testigo del final: además de disparar la carga, dice que hay más. */
.cine-todas-mas{
  text-align:center; padding:16px 8px; margin-top:10px;
  font-family:'IBM Plex Mono',monospace; font-size:.6rem; text-transform:uppercase;
  letter-spacing:.06em; color:#C9BFD6;
}
.cine-todas-mas span{display:block; color:#F2CB4E; margin-top:3px; font-size:.55rem}

@media (min-width:900px){
  /* En escritorio caben más y más grandes a la vez: la columna es mucho más
     ancha que la de un móvil. */
  .cine-todas-galeria{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
  .cine-poster-nota{min-width:34px; height:34px; font-size:1rem}
  .cine-poster-todas .cine-poster-info b{font-size:.66rem}
}