/* Fondo tipo papel */
body{
  padding:24px;
  background:
    radial-gradient(100% 100% at 0% 0%, rgba(0,0,0,.05) 0, rgba(0,0,0,0) 60%),
    radial-gradient(100% 100% at 100% 0%, rgba(0,0,0,.05) 0, rgba(0,0,0,0) 60%),
    radial-gradient(100% 100% at 0% 100%, rgba(0,0,0,.05) 0, rgba(0,0,0,0) 60%),
    radial-gradient(100% 100% at 100% 100%, rgba(0,0,0,.05) 0, rgba(0,0,0,0) 60%),
    linear-gradient(180deg, var(--paper1) 0%, var(--paper2) 100%);
  background-blend-mode:multiply;
}
.paper{
  position:relative; max-width:980px; width:100%;
  background:linear-gradient(180deg, var(--paper1) 0%, var(--paper2) 100%);
  border:1px solid var(--rule-soft); box-shadow:0 20px 40px rgba(20,20,10,.15);
  padding:36px 44px; margin:0 auto; overflow:visible;
}
.paper::before{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.28; mix-blend-mode:multiply;
  background-image:
    radial-gradient(1px 1px at 9% 11%, rgba(0,0,0,.05) 0, rgba(0,0,0,0) 100%),
    radial-gradient(1px 1px at 33% 79%, rgba(0,0,0,.04) 0, rgba(0,0,0,0) 100%),
    radial-gradient(1px 1px at 61% 21%, rgba(0,0,0,.035) 0, rgba(0,0,0,0) 100%),
    radial-gradient(1px 1px at 86% 67%, rgba(0,0,0,.035) 0, rgba(0,0,0,0) 100%);
  background-size:3px 3px, 3px 3px, 3px 3px, 3px 3px;
}

/* Cabecera portada integrada */
.masthead.principal{ text-align:center; margin-bottom:14px }
.masthead.principal .title{
  font-size:56px; letter-spacing:2px; text-transform:uppercase; margin:0; color:var(--ink);
  text-shadow:0 .5px 0 rgba(0,0,0,.22); font-variant-caps:small-caps;
}
.masthead.principal .subtitle{ margin-top:4px; font-size:15px; letter-spacing:.8px; color:#3d3a35 }

/* Imagen principal en blanco y negro (como portada original) */
.hero{
  width:100%; max-width:980px; margin:12px auto 0; display:block;
  border:6px solid #efe9da; box-shadow:0 6px 14px rgba(20,20,10,.08);
  filter:grayscale(100%) contrast(.92) sepia(.08) brightness(.95)
}

/* Metadatos */
.issue-meta{
  display:flex; justify-content:space-between; gap:12px; font-size:12.5px; color:#5b534a; margin:6px 0 12px;
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule); padding:6px 0; letter-spacing:.5px
}

/* Layout columnas de periódico */
.columns{ column-count:2; column-gap:32px; column-rule:1px solid var(--rule); column-fill:balance }
article{ break-inside:avoid-column; padding-bottom:16px; border-bottom:1px dashed var(--rule-soft); margin-bottom:16px }
h2.section-title{ font-size:22px; margin:6px 0 6px; text-transform:uppercase; letter-spacing:1px; font-variant-caps:small-caps }
.kicker{ letter-spacing:.6px; font-size:12px; color:#6a6258; text-transform:uppercase }
.lead{ font-weight:700; font-size:15px; color:#2b2a25; margin-bottom:6px }
.columns p{ text-align:justify; hyphens:auto; -webkit-hyphens:auto }
.columns article:first-of-type p:first-of-type::first-letter{
  float:left; font-size:54px; line-height:.8; margin:.05em .28em .1em 0; font-weight:700; color:#201d19
}

/* Noticias */
.news{ display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-top:8px }
.news-item{ border-top:1px solid var(--rule-soft); padding-top:8px }
.news-item h4{ margin:0 0 6px; font-size:17px; text-transform:none; letter-spacing:.2px }

.thumb-left{
  float:left; width:220px; margin:2px 12px 8px 0; border:6px solid #efe9da;
  filter:grayscale(100%) contrast(.92) sepia(.08) brightness(.95); box-shadow:0 6px 14px rgba(20,20,10,.08)
}
.news-item::after{ content:""; display:block; clear:both }

/* Galería */
/* --- Galería (más pequeña y uniforme) --- */
.gallery{
  /* 3 columnas en desktop, con separación */
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:12px;
  /* si quieres que no se hagan gigantes, limita el ancho total: */
  max-width:820px;    /* <-- ajusta si quieres más/grande */
  margin:0 auto;      /* centra la galería */
}

.gallery-img{
  width:100%;
  /* Mantén proporción y recorta lo que sobre para que no se disparen de alto */
  aspect-ratio:4/3;   /* 4:3 queda muy de “periódico”; prueba 3/2 o 1/1 si prefieres */
  object-fit:cover;   /* recorta sin deformar */
  height:auto;        /* el alto lo define el aspect-ratio */
  /* (tus estilos originales siguen aquí) */
  border:6px solid #efe9da;
  box-shadow:0 6px 14px rgba(20,20,10,.08);
  filter:grayscale(100%) contrast(.92) sepia(.08) brightness(.95);
}

/* Responsive: más pequeñas aún en pantallas estrechas */
@media (max-width:880px){
  .gallery{ grid-template-columns:repeat(2, 1fr); max-width:640px; }
}
@media (max-width:520px){
  .gallery{ grid-template-columns:1fr; max-width:420px; }
}
/* --- Sopa de letras (limpia, sin fondo) --- */
.ws-wrap{
  margin-top:8px;
  overflow:auto;            /* evita que se corte en móviles; permite scroll si hace falta */
  background:transparent;   /* sin fondo */
  padding:0;                /* sin relleno adicional */
}

.ws-grid{
  display:grid;
  grid-template-columns:repeat(15, 1.6em); /* tamaño más contenido */
  gap:1px;                                   /* separación fina entre celdas */
  justify-content:start;
  user-select:none;
  -webkit-user-select:none;
  background:transparent;    /* <-- quitamos el fondo blanco */
  border:1px solid var(--rule);          /* borde sutil acorde al resto del periódico */
  box-shadow:none;                       /* sin sombra interior */
}

.ws-cell{
  width:1.6em; height:1.6em;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(0,0,0,.28);      /* líneas más finas */
  background:transparent;                /* sin fondo */
  font-weight:700; letter-spacing:.4px;
  font-size:14px; line-height:1;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
}

.ws-cell.ws-hover{ background:rgba(0,0,0,.06) }     /* hover discreto */
.ws-cell.ws-found{
  background:#111; color:#fff; border-color:#111;   /* palabra encontrada, alto contraste */
}

.ws-legend{
  margin-top:10px;
  columns:2; column-gap:24px;
  list-style:none; padding:0;
}
.ws-legend li{
  break-inside:avoid; margin-bottom:4px; position:relative; padding-left:1.2em;
}
.ws-legend li::before{ content:"•"; position:absolute; left:0; color:rgba(0,0,0,.55) }
.ws-legend li.found{ color:#6a6258; text-decoration:line-through }
.ws-legend li.found::before{ content:"✓"; font-weight:700; left:0; color:#111 }

/* Responsive: que no se vea enorme ni se rompa en móviles */
@media (max-width:880px){
  .ws-grid{
    grid-template-columns:repeat(15, 1.8em); /* un pelín más grande para tacto */
  }
  .ws-cell{ width:1.8em; height:1.8em; font-size:15px }
}
@media (max-width:520px){
  .ws-grid{
    grid-template-columns:repeat(15, 2em);
  }
  .ws-cell{ width:2em; height:2em; font-size:16px }
}

/* Contador */
.countdown{
  display:flex; gap:10px; margin:10px 0 8px; flex-wrap:wrap;
}
.countdown .tile{
  min-width:84px; display:flex; flex-direction:column; align-items:center; justify-content:center;
  border:1px solid var(--rule); padding:8px 10px; border-radius:8px;
  background:rgba(255,255,255,.55); box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);
}
.countdown .num{ font-size:26px; font-weight:700; line-height:1 }
.countdown .lab{ font-size:12px; letter-spacing:.6px; text-transform:uppercase; color:#6a6258 }

/* Footer */
.page-footer{ margin-top:16px; padding-top:10px; border-top:1px solid var(--rule); text-align:center; font-size:12px; color:#6a6258; letter-spacing:.4px }

/* Índice interno */
.toc{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0 6px 0}
.toc a{display:inline-block;padding:6px 10px;border:1px solid var(--rule);text-decoration:none;color:inherit;font-size:14px;letter-spacing:.4px;background:transparent}
.toc a:hover{background:#111;color:#fff}

/* Responsive */
@media(max-width:880px){
  .columns{ column-count:1; column-rule:none; column-gap:0 }
  .news{ grid-template-columns:1fr }
  .horos{ columns:1 }
}