.marker-controls {
  max-width: 960px;
  margin: 0 auto;
  padding: 24px 20px 12px;
}

.marker-controls h1 { margin: 0 0 10px; font-size: 24px; }
.marker-controls p { line-height: 1.7; }
.marker-controls ol { padding-left: 1.5em; line-height: 1.8; }
.marker-controls li + li { margin-top: 6px; }
.marker-controls .auto-pattern-actions { margin-top: 18px; }
.marker-button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:7px 12px; border:1px solid #957e63; border-radius:8px; color:#5c4736; background:#fffdf8; box-shadow:0 2px 0 #5e483733; font-weight:700; text-decoration:none; }
.marker-status { min-height: 1.5em; color: #705846; }
.marker-preview { padding: 12px 20px 36px; overflow: auto; }
.marker-sheet {
  width: 210mm;
  max-width: 100%;
  margin: 0 auto;
  background: #fff;
  box-shadow: 0 2px 14px #5e48372b;
}
.marker-sheet > svg { display: block; width: 100%; height: auto; }

@page { size: A4 portrait; margin: 0; }

@media print {
  html, body { width: 210mm; height: 297mm; min-height: 0; margin: 0 !important; padding: 0 !important; background: #fff !important; }
  main { margin: 0; padding: 0; }
  .marker-controls, noscript { display: none !important; }
  .marker-preview { width: 210mm; height: 297mm; margin: 0; padding: 0; overflow: visible; }
  .marker-sheet { width: 210mm; height: 297mm; max-width: none; margin: 0; padding: 0; box-shadow: none; break-inside: avoid; }
  .marker-sheet > svg { display: block; width: 210mm; height: 297mm; max-width: none; margin: 0; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
}
