/* Keep printable answer cards independent of the timeline's dark .card styling. */
.print-cards .cards-grid > .card {
  background: #fff;
  color: #000;
  display: block;
  box-shadow: none;
}
.print-cards .card .card-content,
.print-cards .card .card-field,
.print-cards .card label,
.print-cards .card .card-number,
.print-cards .card .card-label,
.print-cards .card .card-year,
.print-cards .card .card-team {
  color: #000;
}
.print-cards .card .write-box { background: #fff; border-color: #333; }
@media print {
  .print-cards .cards-grid > .card { background: #fff !important; color: #000 !important; box-shadow: none !important; }
  .print-cards .card * { color: #000 !important; }
}

/* Restore the answer-card dimensions; bingo's global .card rule must not resize these. */
.print-cards .cards-grid > .card {
  box-sizing: border-box;
  width: 80mm;
  height: 95mm;
  min-width: 0;
  margin: 0;
  padding: 0;
  grid-template-rows: none;
  break-inside: avoid;
  page-break-inside: avoid;
}
.print-cards .card > .card-content { box-sizing: border-box; width: 100%; height: 100%; }
@media print {
  @page remotion-answer-cards { size: A4 portrait; margin: 10mm; }
  .print-cards { page: remotion-answer-cards; width: 190mm; max-width: 190mm; }
  body:has(.print-cards), html:has(.print-cards) { width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important; }
  .print-cards .cards-grid { grid-template-columns: repeat(2, 80mm); gap: 8mm; }
}