/* editorial.css — skin "Cartografía Soberana" para los interactivos del piloto.
   Hace que los demos hereden la tipografía editorial del sitio BioVoxel:
   Source Serif 4 (cuerpo+titulares) + JetBrains Mono (etiquetas/datos), sobre la misma paleta.
   Se carga DESPUÉS del <style> inline de cada demo; usa !important para sobrescribir la sans. */

/* Cuerpo y titulares → serif editorial */
body, h1, h2, h3 {
  font-family: "Source Serif 4", Georgia, "Times New Roman", serif !important;
}
h1, h2 { letter-spacing: -0.02em; }

/* Micro-etiquetas, eyebrows, números y datos → mono (JetBrains) */
.brand, .capt, .colhd, .lab, .bdg, .stnum, .nnum, .anum, .eid, .tag, .artref,
.zonahdr, .covsub, .miss, .stat, .pn, .est, .ofmt, .ofmt code,
.vtog .reu, .chip .reu, .reu, .seltype, .arts h3, .sectit, .lenslab {
  font-family: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace !important;
}

/* Isotipo real (voxel) en lugar del logo provisional de degradado */
.logo, .brand .logo {
  background: url("/_demo/piloto/assets/isotipo.svg") center / contain no-repeat !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  width: 24px !important;
  height: 24px !important;
}

/* Pulido responsive (los layouts ya colapsan; esto afina móvil) */
@media (max-width: 1080px) {
  /* muro: cuando la columna lateral se apila, el borde lateral pasa a superior */
  .panel { border-left: none !important; border-top: 1px solid var(--border, #1E293B) !important; }
}
@media (max-width: 640px) {
  h1 { font-size: 23px !important; line-height: 1.15 !important; }
  header, .cap, .detail, .tree, .pitch, .picker, .chain, .ribbon, .stats,
  .qbox, .legend, .presets, .zonahdr, .scenedesc {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  /* rejillas a una sola columna en móvil */
  .grid { grid-template-columns: 1fr !important; }
  /* el panel lateral fijo (380px) se vuelve fluido */
  .panel { min-height: auto !important; }
}