frontend/src/styles/_print.css

/* ============================================================================ */
/* Print styles                                                                  */
/* ============================================================================ */

/*
 * The .pdf-toc node is injected at print time by the PDF generator. It is
 * hidden in the browser (web view of the published article) and shown only
 * when emulating print media during PDF generation.
 */
.pdf-toc {
  display: none;
}

@media print {

  html,
  body {
    background: #fff;
  }

  /* Margins are handled by Playwright; avoid extra global margins */
  body {
    margin: 0;
  }

  /* Paragraphs: balanced break behaviour for long-form reading */
  p,
  li,
  blockquote {
    orphans: 3;
    widows: 3;
  }

  p {
    hyphens: auto;
    -webkit-hyphens: auto;
  }

  /* Hide non-essential UI */
  #theme-toggle,
  .toc-mobile-toggle,
  .toc-mobile-backdrop,
  .toc-mobile-sidebar,
  .right-aside,
  .sync-indicator,
  .top-bar {
    display: none !important;
  }

  /* Sidebar TOC is replaced by .pdf-toc in print */
  .table-of-contents {
    display: none !important;
  }

  main > nav:first-of-type {
    display: none !important;
  }

  /* Force single column to reduce widows/orphans and awkward breaks */
  .content-grid {
    grid-template-columns: 1fr !important;
  }

  /* Links: remove underline and background */
  .content-grid main a {
    text-decoration: none;
    background: none;
    border-bottom: 1px solid rgba(0, 0, 0, .2);
  }

  /* Soft page breaks around main headings */
  .content-grid main h2 {
    page-break-before: auto;
    page-break-after: avoid;
    break-after: avoid-page;
  }

  .content-grid main h3,
  .content-grid main h4 {
    break-after: avoid-page;
    page-break-after: avoid;
  }

  /* Small icon labels not needed when printing */
  .code-lang-chip {
    display: none !important;
  }

  /* More contrasty colors for print */
  :root {
    --surface-bg: #fff;
    --border-color: rgba(0, 0, 0, .2);
    --link-underline: rgba(0, 0, 0, .3);
    --link-underline-hover: rgba(0, 0, 0, .4);
  }

  /* Avoid breaks inside complex visual blocks */
  .hero,
  .hero-banner,
  .html-embed,
  .html-embed__card,
  .html-embed-container,
  .js-plotly-plot,
  figure,
  pre,
  table,
  blockquote,
  .wide,
  .full-width,
  .stack > *,
  .card,
  .palettes,
  .palette-card,
  .color-picker,
  .note {
    break-inside: avoid;
    page-break-inside: avoid;
  }

  /* Keep hero + meta together at the top of page 1 */
  .hero {
    page-break-after: avoid;
    break-after: avoid;
  }

  /* Constrain hero banner after rasterization */
  .hero-banner {
    width: 100% !important;
    max-width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    overflow: hidden;
  }

  .hero-banner > *,
  .hero-banner svg,
  .hero-banner canvas,
  .hero-banner img,
  .hero-banner video,
  .html-embed-container > img {
    max-width: 100% !important;
    width: 100% !important;
    height: auto !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block;
  }

  /* References / bibliography: start on a new page and stay together */
  .references-block,
  .bibliography-content {
    break-before: page;
    page-break-before: always;
  }

  .bibliography-title {
    break-after: avoid;
    page-break-after: avoid;
  }

  /* Footer: the web view uses a 3-column grid (~1160px wide) that does
     not fit the ~673px printable width. Drop the grid so each block
     flows naturally, headings stacked above their content. */
  .footer-inner { display: block; }
  .citation-block,
  .references-block,
  .reuse-block,
  .doi-block,
  .template-credit { display: block; }
  .footer-heading {
    text-align: left !important;
    padding-right: 0 !important;
  }

  /* PDF TOC: visible only in print */
  .pdf-toc {
    display: block;
    break-after: page;
    page-break-after: always;
    max-width: 780px;
    margin: 0 auto 12mm;
    padding: 0 16px;
  }

  .pdf-toc__title {
    font-size: 1.3rem;
    margin: 0 0 12px;
    border-bottom: 1px solid rgba(0, 0, 0, .2);
    padding-bottom: 8px;
  }

  .pdf-toc__list {
    list-style: none;
    margin: 0;
    padding: 0;
  }

  .pdf-toc__item {
    margin: 4px 0;
    font-size: 0.95rem;
    line-height: 1.4;
  }

  .pdf-toc__item--sub {
    margin-left: 20px;
    font-size: 0.88rem;
    color: rgba(0, 0, 0, .7);
  }

  .pdf-toc__item a {
    color: inherit;
    text-decoration: none;
    border-bottom: none;
  }

  /* Meta container (authors, affiliations, PDF link): keep tight under hero */
  .meta-container,
  .hero-meta {
    break-after: avoid;
    page-break-after: avoid;
  }

  /* Hide the PDF download cell in the generated PDF itself (self-referential) */
  .meta-container-cell--pdf {
    display: none !important;
  }

  /* Hide published-side tooltips in print */
  .pub-tooltip {
    display: none !important;
  }
}