/* Reader mode: hide all editor chrome unless edit-mode is active */
html:not(.edit-mode) .bar,
html:not(.edit-mode) .ep,
html:not(.edit-mode) #ep,
html:not(.edit-mode) .sp,
html:not(.edit-mode) #sp,
html:not(.edit-mode) #prog-bar,
html:not(.edit-mode) .hint {
  display: none !important;
}

/* Disable click-to-edit on zones in reader mode */
html:not(.edit-mode) .zone {
  cursor: default !important;
  pointer-events: none !important;
  outline: none !important;
}

/* Allow real links/buttons inside zones to still work for readers */
html:not(.edit-mode) .zone a,
html:not(.edit-mode) .zone button {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* ── Mobile reader polish ─────────────────────────────────────────────────
   The newspaper is a fixed print-style page, so on phones tighten the worst
   offenders: the overlapping dateline slogan and the cramped 2-column body. */
@media (max-width: 700px) {
  /* Dateline: drop the slogan to its own line instead of overlapping the
     price / weather, and shrink the side text so it fits. */
  .dateline { flex-wrap: wrap !important; padding: 7px 10px !important; row-gap: 1px !important; }
  .dl-side { min-width: 0 !important; font-size: 8.5px !important; letter-spacing: .3px !important; }
  .dl-center { flex-basis: 100% !important; order: 3 !important; font-size: 11px !important; }

  /* Body copy: one wider column reads better than two cramped ones (and, since
     the same text fills fewer lines, it also clips less inside the fixed page). */
  .rc-body.c2 { column-count: 1 !important; }
}