.staff-qr {
  max-width: 900px;
  margin: 28px auto;
  padding: 24px;
  border: 1px solid #d8dee1;
  border-radius: 12px;
  background: white;
}

.staff-qr__content { display: flex; align-items: center; gap: 28px; }
.staff-qr__preview svg { width: 180px; height: 180px; }
.staff-qr__actions { display: flex; flex-direction: column; gap: 12px; }
.staff-qr-links { display: flex; gap: 12px; margin: 0 0 18px; }

@media (max-width: 768px) {
  .staff-qr {
    padding: 20px;
  }

  .staff-qr__content {
    flex-direction: column;
    align-items: stretch;
  }

  .staff-qr__preview {
    align-self: center;
  }

  .staff-qr__actions,
  .staff-qr__actions form,
  .staff-qr__actions .staff-page__btn {
    width: 100%;
  }
}

.qr-print-page { padding: 24px; }
.qr-print-toolbar { display: flex; gap: 18px; margin-bottom: 24px; }
.qr-print-title { text-align: center; }
.qr-card-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10mm; }
.qr-print-sheet + .qr-print-sheet { margin-top: 10mm; }

.qr-card {
  box-sizing: border-box;
  width: 85mm;
  min-height: 55mm;
  margin: 0 auto;
  padding: 6mm;
  border: 1px dashed #777;
  text-align: center;
}

.qr-card__code svg { width: 40mm; height: 40mm; }
.qr-card__name { font-size: 20px; font-weight: 700; }
.qr-card__number { color: #555; font-size: 14px; }
.qr-card--rescue { width: 120mm; min-height: 150mm; border: 4px solid #b42318; }
.qr-card__rescue-title { color: #b42318; font-size: 34px; }
.qr-card__unset { margin-top: 45mm; color: #b42318; font-size: 22px; font-weight: 700; }
.staff-time-record__source-badge { margin-left: 8px; padding: 2px 7px; border-radius: 10px; background: #f9dca7; color: #744b00; font-size: 12px; }

@page qrcards {
  size: A4 portrait;
  margin: 10mm;
}

@media print {
  html, body {
    height: auto;
    overflow: visible;
  }

  .main-navigation, .flash-messages, .qr-print-toolbar, .qr-print-title { display: none !important; }

  .main-content {
    display: block;
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .main-content, .qr-print-page { margin: 0; padding: 0; }

  .qr-print-page { page: qrcards; }

  .qr-print-sheet {
    width: auto;
    margin: 0;
    break-after: page;
  }

  .qr-print-sheet + .qr-print-sheet { margin-top: 0; }
  .qr-print-sheet:last-child { break-after: auto; }

  .qr-print-sheet .qr-card-grid {
    grid-template-columns: repeat(2, 91mm);
    grid-template-rows: repeat(4, 65mm);
    column-gap: 5mm;
    row-gap: 4mm;
  }

  .qr-print-sheet .qr-card {
    width: 91mm;
    height: 65mm;
    min-height: 0;
    margin: 0;
    padding: 3mm 6mm;
  }
}
