/* =========================================================
   La hoja imprimible. Se ve en pantalla (la pagina rankea)
   y sale en UNA sola hoja en papel (@media print).
   ========================================================= */

.sheet-hold { padding-bottom: clamp(30px, 5vw, 54px); }

.sheet {
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: 0 6px 26px rgba(18,35,58,.13);
  padding: clamp(18px, 3vw, 34px) clamp(14px, 3vw, 40px);
  max-width: 820px;
  margin-inline: auto;
  color: #111;
}

.sheet-title {
  text-align: center; font-size: clamp(1.3rem, 1rem + 1.5vw, 1.8rem);
  font-weight: 900; letter-spacing: -.01em;
}
.sheet-sub {
  text-align: center; font-weight: 700; color: #444;
  margin: .35em 0 clamp(12px, 2vw, 18px);
  font-size: clamp(.95rem, .9rem + .3vw, 1.08rem);
}

.sheet-name {
  display: flex; gap: 26px; justify-content: space-between;
  font-weight: 700; color: #444; font-size: .92rem;
  border-bottom: 2px solid #ccc; padding-bottom: 6px;
  margin-bottom: clamp(14px, 2.5vw, 24px);
}
.sheet-name span { flex: 1 1 auto; }
.sheet-name span:last-child { flex: 0 0 30%; }

.sheet-grid {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(20px, 6vw, 90px);
}
.sheet-grid .col { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(10px, 1.8vw, 20px); }

.sheet-grid li {
  display: flex; align-items: center; gap: 10px;
  min-height: clamp(64px, 9vw, 96px);
}

.sheet-grid img {
  height: clamp(58px, 8.5vw, 92px); width: auto; max-width: 78%;
  object-fit: contain; flex: 1 1 auto;
}
.sheet-grid .left img  { object-position: right center; }
.sheet-grid .right img { object-position: left center; }
.sheet-grid .sil { filter: brightness(0); }

/* el puntito donde el chico arranca o termina la linea */
.sheet-grid .dot {
  width: 13px; height: 13px; border-radius: 50%;
  border: 2px solid #111; background: #fff; flex: none;
}

.sheet-foot {
  margin-top: clamp(16px, 3vw, 28px); text-align: center;
  font-size: .8rem; color: #666; font-weight: 700;
}

/* ---------------- impresion ---------------- */
@media print {
  @page { size: auto; margin: 11mm; }

  /* fuera todo lo que no es la hoja */
  .no-print, .site-header, .site-footer, .crumb, .skip { display: none !important; }

  html, body { background: #fff !important; }
  body { font-size: 12pt; }

  .sheet-hold { padding: 0; }
  .wrap { padding: 0; max-width: none; }

  .sheet {
    border: 0; box-shadow: none; border-radius: 0;
    padding: 0; max-width: none;
  }

  .sheet-title { font-size: 19pt; }
  .sheet-sub   { font-size: 10.5pt; margin: 2mm 0 4mm; }
  .sheet-name  { font-size: 10pt; margin-bottom: 5mm; padding-bottom: 3mm; }

  /* medidas pensadas para que 6 filas + encabezado + pie entren en UNA A4:
     6 x 25mm + 5 x 6mm de separacion = 180mm, mas ~40mm de cromo = 220mm < 275mm utiles */
  .sheet-grid { gap: 30mm; }
  .sheet-grid .col { gap: 6mm; }
  .sheet-grid li { min-height: 25mm; }
  .sheet-grid img { height: 23mm; max-width: 80%; }

  /* las siluetas tienen que salir negras si o si */
  .sheet-grid .sil {
    filter: brightness(0);
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }

  .sheet-foot { margin-top: 6mm; font-size: 8pt; }
}

/* variante "big": pocas parejas, figuras enormes (hoja de nursery) */
.sheet.big .sheet-grid img { height: clamp(78px, 12vw, 130px); }
.sheet.big .sheet-grid li  { min-height: clamp(90px, 13vw, 145px); }
@media print {
  .sheet.big .sheet-grid img { height: 42mm; }
  .sheet.big .sheet-grid li  { min-height: 46mm; }
  .sheet.big .sheet-grid .col { gap: 12mm; }
}