/* Repo-local overrides (do not touch the shared theme extension).
   The theme forces main.content to full width and instead caps each content child at
   --wrap (1180px). Narrow that to give the article real side margins. The `body` prefix
   raises specificity above the theme rule so this wins regardless of stylesheet order. */
body main#quarto-document-content.content > :not(:first-child),
body main#quarto-document-content.content > section:first-of-type {
  max-width: 780px !important;
}

/* ...but the interactive tool needs room, so let its section span the full width. This keeps
   the app's two panels side by side (and lets the pinched viewer height fit one screen). */
body main#quarto-document-content.content > section:has(.shinylive-r) {
  max-width: 1180px !important;
}

/* Keep generated figures modest in size, like the study-site map. */
body main#quarto-document-content .cell-output-display img,
body main#quarto-document-content figure.quarto-figure img,
body main#quarto-document-content p > img {
  max-width: 80% !important;
  height: auto !important;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Tables: sit within the text column (never stretch full width), inside a scroll box no taller
   than 500px, with the header row frozen while scrolling. */
body main#quarto-document-content table.table {
  display: block;
  width: fit-content;
  max-width: 100% !important;
  max-height: 500px;
  overflow: auto;
  margin-left: 0;
  margin-right: auto;
  border-collapse: separate;
  border-spacing: 0;
}
body main#quarto-document-content table.table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #efe9dc;   /* opaque so scrolled rows do not show through */
}
