/* Uses the existing pixel layout, typography and palette. */
#motif-pack .sechead .hp-mini svg { width: 60px; height: 168px; }
#motif-pack .mp-sheet { margin-top: 32px; }
#motif-pack .chartbox svg { max-height: 600px; max-width: 100%; width: auto; }
#motif-pack .hp-key { width: 100%; }
@media print {
  body[data-print="motif-pack"] main > section#motif-pack { display: block; padding: 0; }
  body[data-print="motif-pack"] #motif-pack .sechead { display: none; }
  body[data-print="motif-pack"] #mp-print, body[data-print="motif-pack"] #mp-form { display: none !important; }
  body[data-print="motif-pack"] .mp-sheet { break-before: page; }
  body[data-print="motif-pack"] .mp-checks { break-before: page; }
  body[data-print="motif-pack"] #motif-pack .chartbox { border: 0; padding: 0; overflow: visible; break-inside: avoid; }
  body[data-print="motif-pack"] #motif-pack .chartbox svg { max-height: 160mm; max-width: 100%; width: auto; }
  body[data-print="motif-pack"] .mp-bead-screen { display: none; }
  body[data-print="motif-pack"] .mp-bead-print { display: block; break-inside: avoid; }
  body[data-print="motif-pack"] .mp-bead-print svg { max-width: none; max-height: none; }
  body[data-print="motif-pack"] svg { print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}