@media print {
  @page {
    size: A4;
    margin: 0;
  }

  body {
    background: white !important;
    display: block !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #editor-sidebar,
  #status-bar {
    display: none !important;
  }

  #preview-container {
    width: 100% !important;
    height: auto !important;
    overflow: visible !important;
    background: none !important;
    display: block !important;
    padding: 0 !important;
  }

  #preview-pane {
    display: block !important;
    gap: 0 !important;
    width: 100% !important;
  }

  .page-sheet {
    width: 210mm !important;
    height: 297mm !important;
    overflow: hidden !important;
    box-shadow: none !important;
    page-break-after: always;
    break-after: page;
    background: white !important;
    position: relative;
    padding: 20mm;                     /* fallback, overridden by inline JS */
  }

  .page-sheet:last-child {
    page-break-after: auto;
    break-after: auto;
  }

  .page-sheet.overflow-warning::after {
    content: none;
  }

  /* Match preview typography exactly */
  table {
    font-size: 15px;                 /* same as preview */
  }

  p, li {
    font-size: var(--font-size-page); /* 16px, identical to preview */
    line-height: 1.6;                /* matches preview */
    color: #111111 !important;
  }

  /* Headings already inherit their sizes from the page-sheet rules (which are not overridden in print),
     so they remain the same as on screen. */

  .page-sheet img {
    max-width: 100% !important;
    max-height: 100% !important;
    box-shadow: none !important;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  td img {
    max-height: 80mm !important;
  }
}