:root {
  color-scheme: light;
  color: #27253f;
  background: #fffaf0;
  font: 1rem/1.55 system-ui, sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; }
a { color: #4d367e; }
button, select { font: inherit; }
img { max-width: 100%; }
[hidden] { display: none !important; }
:focus-visible { outline: 3px solid #6446a6; outline-offset: 3px; }

.catalogue-header, .catalogue-footer {
  padding: 1rem max(1rem, calc((100vw - 70rem) / 2));
  background: #fffefa;
}
.catalogue-header, .catalogue-header nav, .catalogue-footer nav, .coloring-pagination, .picture-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem 1rem;
}
.catalogue-header { border-block-end: 1px solid #e5ddeb; }
.brand { font-size: 1.45rem; font-weight: 900; text-decoration: none; }
.locale { margin-inline-start: auto; }
.locale select { border-radius: .6rem; background: #fff; color: inherit; padding: .3rem; }
main { max-width: 72rem; margin: 1.5rem auto 3rem; padding-inline: 1rem; min-height: 60vh; }
h1 { line-height: 1.15; margin-block: 0 1rem; }
h2 { margin-block: 1.5rem .4rem; }
.catalogue-footer { border-block-start: 1px solid #e5ddeb; font-size: .875rem; }
.catalogue-footer nav { justify-content: center; }
.catalogue-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(8rem,43%),1fr)); gap: .75rem; margin-block: 1rem; }
.catalogue-card { min-width: 0; padding: .5rem; border: 1px solid #d5e3ea; border-radius: .8rem; background: #fff; text-align: center; }
.catalogue-card img { display: block; width: 100%; aspect-ratio: 1; object-fit: contain; }
.catalogue-card a { display: block; overflow-wrap: anywhere; }
.color-card-grid { grid-template-columns: repeat(auto-fill,minmax(min(10rem,43%),1fr)); }
.color-card-grid img { aspect-ratio: 3 / 4; }
.color-card-grid .print-link { margin-block-start: .4rem; }
.color-card-grid .print-link, .coloring-pagination a, .coloring-pagination strong, .picture-actions a, .picture-actions button {
  display: inline-block;
  padding: .3rem .6rem;
  border: 1px solid #ded5e5;
  border-radius: .55rem;
  background: #fff;
}
.color-card-grid .print-link, .picture-actions a, .picture-actions button { min-height: 2.5rem; }
.picture-actions button { background: #55409b; color: #fff; cursor: pointer; }
.picture-actions button:disabled { opacity: .55; }
.picture-frame { display: block; width: auto; height: auto; max-height: 70vh; margin: 1rem auto; }
.copy { max-width: 45rem; }
@page { margin: 10mm; }
@media print {
  body:has([data-print-image]) { background: #fff; }
  body:has([data-print-image]) :is(.catalogue-header,.catalogue-footer,h1,.picture-actions,progress) { display: none; }
  body:has([data-print-image]) main { margin: 0; padding: 0; min-height: 0; }
  [data-print-image] { max-height: 235mm; break-inside: avoid; }
}