/* Preview-pane styles applied to plan HTML rendered in the app. */
.preview-pane h1 { font-size: 1.6rem; font-weight: 700; margin: 0 0 0.5em; }
.preview-pane h2 {
  font-size: 1.2rem; font-weight: 600; margin: 1.2em 0 0.4em;
  border-bottom: 1px solid rgb(203 213 225 / 0.5); padding-bottom: 0.2em;
}
.dark .preview-pane h2 { border-bottom-color: rgb(51 65 85 / 0.7); }
.preview-pane p { margin: 0 0 0.5em; }
.preview-pane .muted { color: rgb(100 116 139); font-style: italic; font-size: 0.9rem; }
.preview-pane dl.fields dt { font-weight: 600; margin-top: 0.4em; }
.preview-pane dl.fields dd { margin-left: 0; }
.preview-pane table { width: 100%; border-collapse: collapse; margin: 0.5em 0; font-size: 0.9rem; }
.preview-pane th, .preview-pane td {
  border: 1px solid rgb(203 213 225); padding: 4px 8px; text-align: left;
  vertical-align: top;
}
.dark .preview-pane th, .dark .preview-pane td { border-color: rgb(51 65 85); }
.preview-pane th { background: rgb(241 245 249); }
.dark .preview-pane th { background: rgb(30 41 59); }
.preview-pane ul.checklist { list-style: none; padding-left: 0; }
.preview-pane ul.checklist li { padding: 2px 0; }
.preview-pane .qty { color: rgb(100 116 139); font-size: 0.85rem; margin-left: 0.4em; }
.preview-pane section.preview-cover h1 { border-bottom: 2px solid rgb(37 99 235); padding-bottom: 0.2em; }

/* Reduce motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

/* Print: pretend the preview is the document. */
@media print {
  header, footer, .no-print { display: none !important; }
  main { max-width: none; padding: 0; }
}