@page {
  size: letter landscape;
  margin: 0.35in;
}

@media print {
  body.callio-printing-report .callio-control-bar,
  body.callio-printing-report #workspace,
  body.callio-printing-report .project-report-toolbar,
  body.callio-printing-report .card-spreadsheet-workspace { display: none !important; }

  /* Print an isolated clone, not the live AppShell tree. This prevents the
     sidebar and viewport-sized flex ancestors from entering the print flow. */
  body.callio-printing-report #appRoot { display: none !important; }
  #callioReportPrintRoot { display: none; }
  body.callio-printing-report #callioReportPrintRoot {
    display: block !important;
    width: auto !important;
    height: auto !important;
    overflow: visible !important;
    background: #fff;
  }

  body.callio-printing-report .sheet,
  body.callio-printing-report .project-report-workspace {
    display: block !important;
    width: auto;
    height: auto;
    min-height: 0;
    overflow: visible;
    background: #fff;
  }

  /* The interactive AppShell is a viewport-sized flex tree with deliberate
     clipping. A report is a paginated document instead: let every ancestor
     expand so Chromium can lay out pages after the first viewport. */
  body.callio-printing-report #appShell,
  body.callio-printing-report #appWorkspace,
  body.callio-printing-report .main-workspace,
  body.callio-printing-report .sheet,
  body.callio-printing-report .project-report-workspace {
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
  }

  body.callio-printing-report .project-report-document {
    display: block;
    max-width: none;
    margin: 0;
    padding: 0;
  }

  body.callio-printing-report #callioReportPrintRoot .project-report-document {
    display: block;
    max-width: none;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none !important;
  }

  /* The interactive report deliberately uses a card-sized sheet and section
     separators. In print those rules create one page per card (and preserve
     the sheet shadow as a vertical ghost rule). Keep only the meaningful
     document breaks and let card text flow between pages. */
  body.callio-printing-report .project-report-section {
    break-before: auto;
    margin: 0 0 18pt;
  }
  body.callio-printing-report .project-report-toc { break-after: page; }
  body.callio-printing-report .project-report-diagram-section {
    break-before: page;
    break-after: page;
  }
  body.callio-printing-report .project-report-group { break-before: auto; }
  body.callio-printing-report .project-report-card-section {
    padding-top: 10pt;
    border-top: 0;
  }
  body.callio-printing-report .project-report-images {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12pt;
    margin-top: 12pt;
  }
  body.callio-printing-report .project-report-image-figure {
    width: 100%;
    margin: 0;
    break-inside: avoid;
  }
  body.callio-printing-report .project-report-image {
    width: 100%;
    height: 2.25in;
    max-height: 2.25in;
    object-fit: contain;
  }

  html,
  body {
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    overflow: visible;
    background: #ffffff;
  }

  /* Preview modes constrain body width to 820px/390px with a more specific
     selector. That screen-only frame must never become a print clipping box. */
  html[data-preview-size] body {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
  }

  body {
    display: block;
    color: #0c2e4f;
  }

  .topbar,
  .status-live-region,
  .edit-mode-indicator,
  .group-filter-controls,
  [data-settings-panel],
  [data-settings-backdrop],
  .stopped-state,
  .image-viewer {
    display: none !important;
  }

  .sheet {
    display: block;
    width: var(--print-page-width, 10.3in);
    height: var(--print-page-height, 7.8in);
    min-height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    break-inside: avoid;
  }

  .workspace {
    position: relative;
    width: var(--print-page-width, 10.3in);
    height: var(--print-page-height, 7.8in);
    min-height: 0;
    overflow: hidden;
    border: 0;
    border-radius: 0;
    background-color: #d9edf6;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .workspace > .workspace-composition {
    display: none !important;
  }

  .print-scene-host {
    display: block;
    position: absolute;
    inset: 0;
    overflow: hidden;
  }

  .print-scene-frame {
    position: absolute;
    left: 0;
    top: 0;
    width: var(--print-source-width);
    height: var(--print-source-height);
    transform: translate(var(--print-translate-x), var(--print-translate-y)) scale(var(--print-scale));
    transform-origin: 0 0;
  }

  .print-scene {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }

  .print-scene .workspace-svg,
  .print-scene .card-layer {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }

  .print-scene .workspace-svg {
    overflow: visible;
  }

  .annotation-card button,
  .annotation-card input,
  .annotation-card textarea,
  .annotation-card form,
  .card-group-control,
  .image-nav-group,
  .image-indicators,
  .image-trash-button,
  .add-image-button,
  .image-source-chooser,
  .image-count,
  .card-actions {
    display: none !important;
  }

  #cardDeck {
    display: none !important;
  }

  .annotation-card,
  .annotation-card.selected,
  .annotation-card.drag-over {
    border: 1px solid rgba(12, 46, 79, 0.28);
    outline: 0 !important;
    background: #ffffff;
    box-shadow: none !important;
    break-inside: avoid;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }

  .annotation-card.editing .card-title,
  .annotation-card.editing .card-description,
  .card-title,
  .card-description {
    display: block !important;
  }

  .annotation-card.editing .card-description,
  .card-description {
    display: -webkit-box !important;
    max-height: calc(4 * 1.15em);
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
  }

  /* Print clones retain the live semantic-zoom attribute. Restore real text
     for compact cards and suppress the screen-only description cue. */
  .workspace-composition[data-card-presentation="compact"] .annotation-card[data-has-description="true"] .description-row {
    display: grid !important;
  }
  .workspace-composition[data-card-presentation="compact"] .annotation-card[data-has-description="true"] .description-row::before {
    display: none !important;
    content: none !important;
  }

  .anchor-point.selected {
    filter: none;
  }
}