.qr-scanner{flex-direction:column;gap:12px;width:min(480px,100%);display:flex}.qr-scanner h2{justify-content:center;align-items:center;gap:10px;margin-bottom:0;display:flex}.qr-scanner-frame{aspect-ratio:1;background:var(--color-ink);border:4px solid var(--color-primary);border-radius:var(--radius-medium);width:100%;position:relative;overflow:hidden}.qr-scanner-video{object-fit:cover;width:100%;height:100%;display:block}.qr-scanner-target{border:4px dashed var(--color-on-strong);border-radius:var(--radius-medium);position:absolute;inset:18%;box-shadow:0 0 0 999px #00000059}.qr-scanner-result{flex-direction:column;align-items:center;gap:10px;padding:12px 0;display:flex}.qr-scanner-username{font-family:var(--display);color:var(--color-heading);margin:0;font-size:2.2rem}.qr-scanner .modal-actions{flex-wrap:wrap}.qr-scanner .btn{min-width:0;padding:10px 16px;font-size:1.3rem}