h1 { font-size: 26px; margin: 8px 0 8px; }
.petunjuk { margin: 0 0 8px; color: var(--ink-2); max-width: 40em; }

.kartu-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; padding: 16px 0 48px; }
.kartu { background: #FFFFFF; color: #1B2430; border: 1px solid #DDE3D0; border-radius: 14px; padding: 16px; text-align: center; break-inside: avoid; }
.kartu__brand { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 12px; font-weight: 700; color: #52680F; margin-bottom: 10px; }
.kartu__brand img { width: 18px; height: 18px; }
.kartu__qr { display: flex; justify-content: center; }
.kartu__qr img, .kartu__qr canvas { width: 180px; height: 180px; }
.kartu__nama { margin: 12px 0 2px; font-size: 17px; font-weight: 700; }
.kartu__divisi { margin: 0; font-size: 13px; color: #4A5563; }

@media print {
  @page { size: A4; margin: 10mm; }
  .no-print { display: none !important; }
  body { background: #FFFFFF; }
  .wrap { max-width: none; padding: 0; }
  .kartu-grid { grid-template-columns: repeat(2, 1fr); gap: 8mm; padding: 0; }
  .kartu { height: 66mm; padding: 4mm; }
  .kartu__qr img, .kartu__qr canvas { width: 40mm; height: 40mm; }
}
