/* ------------------------------------------------------------------
   open-research — prose styles for the rendered reports.
   Loaded after the main site's css/site.css, which supplies the tokens (--ink, --mute, --faint, --rule, --well,
   --amber, --font …), the page shell, the top bar, the footer and the dark scheme. Everything here is scoped to
   .report so none of site.css's own rules are touched. Monochrome like the site: headings by weight and size,
   no colour.
   ------------------------------------------------------------------ */

.report { max-width: 46rem; margin: 4rem 0 0; }
.report.index { max-width: 52rem; }

.report h1 { font-size: 1.75rem; font-weight: 500; letter-spacing: -0.01em; line-height: 1.2; margin: 0 0 1.25rem; }
.report h1 + p { color: var(--mute); font-size: .9rem; }           /* the date / byline line under the title */
.report h2 { font-size: .8rem; font-weight: 500; letter-spacing: .08em; text-transform: uppercase; color: var(--mute); margin: 3rem 0 1rem; }
.report h3 { font-size: 1rem; font-weight: 500; margin: 2rem 0 .75rem; }
.report h4 { font-size: .95rem; font-weight: 500; color: var(--mute); margin: 1.5rem 0 .5rem; }

.report p, .report ul, .report ol, .report dl { margin: 0 0 1em; }
.report ul, .report ol { padding-left: 1.25rem; }
.report li { margin: 0 0 .35em; }
.report li > p { margin-bottom: .5em; }
.report strong { font-weight: 500; }
.report hr { border: 0; border-top: 1px solid var(--rule); margin: 2.5rem 0; }
.report blockquote { margin: 0 0 1em; padding-left: 1rem; border-left: 2px solid var(--rule); color: var(--mute); }
.report blockquote p:last-child { margin-bottom: 0; }

/* code: the site's monospace stack, on the well */
.report code, .report pre, .report kbd { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.report code { font-size: .85em; background: var(--well); padding: .1em .35em; border-radius: 3px; }
.report pre { font-size: .8rem; line-height: 1.5; background: var(--well); padding: 1rem 1.25rem; margin: 0 0 1.25em; overflow-x: auto; }
.report pre code { font-size: 1em; background: none; padding: 0; border-radius: 0; }
.report .highlight { margin: 0 0 1.25em; }
.report .highlight pre { margin: 0; }

/* tables: hairlines only, numbers aligned; a wide table scrolls rather than breaking the column */
.report table { border-collapse: collapse; width: 100%; margin: 0 0 1.5em; font-size: .9rem; font-variant-numeric: tabular-nums; display: block; overflow-x: auto; }
.report th, .report td { text-align: left; vertical-align: top; padding: .45rem 1rem .45rem 0; border-bottom: 1px solid var(--rule); }
.report th { font-weight: 500; font-size: .75rem; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); border-bottom-color: var(--ink); }
.report tr:last-child td { border-bottom-color: var(--ink); }

/* figures: images at column width; a caption is the italic paragraph the markdown puts after one */
.report img { display: block; max-width: 100%; height: auto; margin: 1.5rem 0; }
.report figure { margin: 1.5rem 0; }
.report figcaption, .report img + em { display: block; font-size: .8rem; color: var(--mute); margin-top: -.9rem; margin-bottom: 1.5rem; }
.report sup { line-height: 0; }
.report .footnotes { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--rule); font-size: .85rem; color: var(--mute); }

/* the article viewer (index page, _includes/catalogue.html): one row per report, newest first, under the page's
   heading. Date in a narrow left column like the Publications list, title and summary beside it. The whole row is
   the link to the report — the title's anchor is stretched over the row with ::after — and the Markdown / PDF
   download links sit above it. The title is an h2, so its rules are written as .report .article-title to outrank
   the prose h2 style above. */
.catalogue { margin-top: 2rem; }
.catalogue-empty { color: var(--mute); padding: 1.25rem 0; border-top: 1px solid var(--rule); }
.articles { list-style: none; margin: 0; padding: 0; }
.article { position: relative; display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); gap: .25rem 1.5rem; padding: 1.25rem 0; margin: 0; border-top: 1px solid var(--rule); }
.article:last-child { border-bottom: 1px solid var(--rule); }
.article-date { font-size: .85rem; color: var(--faint); font-variant-numeric: tabular-nums; line-height: 1.75; }
.article-body { min-width: 0; }
.report .article-title { font-size: 1.05rem; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--ink); line-height: 1.35; margin: 0; }
.article-title a { text-decoration: none; }
.article-title a::after { content: ""; position: absolute; inset: 0; }   /* the whole row opens the report */
.article:hover .article-title a { text-decoration: underline; text-underline-offset: .15em; }
.article-summary { color: var(--mute); margin: .35rem 0 0; }
.article-links { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; margin: .6rem 0 0; font-size: .85rem; color: var(--mute); }
.article-links a { color: inherit; text-decoration: underline; text-underline-offset: .15em; text-decoration-color: var(--faint); }
.article-links a:hover { color: var(--ink); text-decoration-color: var(--ink); }

/* end matter under a report: the index and the downloads */
.report-end { max-width: 46rem; margin: 3.5rem 0 0; padding-top: 1rem; border-top: 1px solid var(--rule); display: flex; flex-wrap: wrap; gap: .25rem 1.5rem; font-size: .85rem; color: var(--mute); }
.report-end a { color: inherit; text-decoration: underline; text-underline-offset: .15em; text-decoration-color: var(--faint); }
.report-end a:hover { color: var(--ink); text-decoration-color: var(--ink); }

@media (max-width: 560px) {
  .report { margin-top: 2.5rem; }
  .report h1 { font-size: 1.5rem; }
  .article { grid-template-columns: 1fr; gap: 0; padding: 1rem 0; }
  .article-date { line-height: 1.5; margin-bottom: .15rem; }
}