/* Printable sheets (pairs with /print-sheet.js). Sheet + card geometry is driven by CSS variables the
   script sets per sheet, so the on-screen preview and the printed page use identical rules.
   Card colours come from --c-bg / --c-fg / --c-accent / --c-font set by the tool. */

.ps-frame { position: relative; margin: 0 auto 14px; overflow: hidden; }
.ps-sheet {
  box-sizing: border-box; padding: var(--ps-m); width: var(--ps-pw); height: var(--ps-ph);
  background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .18), 0 6px 18px rgba(0, 0, 0, .08);
  transform-origin: top left;
  display: grid; justify-content: center; align-content: start;
  grid-template-columns: repeat(var(--ps-cols), var(--ps-cw)); grid-auto-rows: var(--ps-ch);
}
.ps-label { margin: 2px 0 6px; text-align: center; font-size: var(--ds-fs-xs, .8rem); color: var(--ds-ink-3, #666); }

/* Optional header block, first page of a section only (the engine reserves its height with headerMm). */
.ps-header { grid-column: 1 / -1; min-width: 0; overflow: hidden; }

.ps-card {
  box-sizing: border-box; position: relative; overflow: hidden;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 4mm; text-align: center; cursor: pointer;
  background: var(--c-bg); color: var(--c-fg); border: 0.5mm solid var(--c-accent); font-family: var(--c-font);
}
.ps-card.is-top { justify-content: flex-start; padding-top: 7mm; }
.ps-card.is-guides { outline: 0.25mm dashed #8f959e; outline-offset: -0.125mm; }
.ps-card .mark { flex: none; width: 8mm; height: 0.7mm; margin-bottom: 3mm; border-radius: 1mm; background: var(--c-accent); }
.ps-card .t { max-width: 100%; font-weight: 500; line-height: 1.3; overflow-wrap: anywhere; }
.ps-card.is-sel { box-shadow: inset 0 0 0 1.1mm var(--ds-accent, #2c58c9); }

/* Print: show only the sheets. Everything that neither contains nor sits inside the print host is hidden,
   and the host's ancestors lose their padding/background so each sheet lands flush on its own page. */
@media print {
  html, body { background: #fff !important; }
  body *:not(.ps-print-host):not(:has(.ps-print-host)):not(.ps-print-host *) { display: none !important; }
  :has(> .ps-print-host), :has(.ps-print-host) {
    display: block !important; margin: 0 !important; padding: 0 !important; max-width: none !important; width: auto !important;
    background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  }
  .ps-print-host { background: none !important; padding: 0 !important; }
  .ps-label, .ps-skip-print { display: none !important; }
  .ps-frame { width: var(--ps-pw) !important; height: auto !important; margin: 0; overflow: visible; }
  .ps-sheet { transform: none !important; box-shadow: none; height: var(--ps-ph-print); break-after: page; page-break-after: always; }
  .ps-frame:last-child .ps-sheet { break-after: auto; page-break-after: auto; }
  .ps-sheet, .ps-card { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .ps-card { cursor: auto; }
  .ps-card.is-sel { box-shadow: none; }
}