.credential-dialog { width:min(740px,calc(100% - 32px)); max-height:90dvh; overflow:auto; border:1px solid #dce3ed; border-radius:16px; padding:24px; color:#17243d; background:white; }
.credential-dialog::backdrop { background:rgb(15 23 42 / .55); }
.credential-card { font-family:system-ui,sans-serif; padding:28px; border:1px solid #aab6c8; border-radius:12px; max-width:680px; margin:auto; background:white; color:#17243d; break-inside:avoid; }
.credential-brand { font-size:18px; font-weight:800; letter-spacing:.08em; margin:0 0 20px; }
.credential-card h2 { margin:0 0 8px; font-size:26px; }
.credential-card p { font-size:13px; line-height:1.6; }
.credential-grid { display:grid; grid-template-columns:minmax(0,1fr) 170px; gap:24px; align-items:center; margin:24px 0; }
.credential-card dl { margin:0; }
.credential-card dt { font-size:11px; text-transform:uppercase; letter-spacing:.05em; margin:16px 0 5px; }
.credential-card dd { font-family:ui-monospace,monospace; font-size:17px; font-weight:700; margin:0; overflow-wrap:anywhere; }
.credential-qr svg { display:block; width:170px; height:170px; }
.credential-qr p { font-size:11px; text-align:center; }
.credential-url { overflow-wrap:anywhere; font-weight:600; }
.credential-note { border-top:1px solid #dce3ed; padding-top:16px; }
.credential-controls { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; align-items:center; }
.credential-controls label { flex-basis:100%; font-size:13px; line-height:1.6; }
@media(max-width:500px){.credential-dialog{padding:12px}.credential-card{padding:18px}.credential-grid{grid-template-columns:1fr}.credential-qr{justify-self:center}}
@media print{.credential-dialog{display:none!important}.credential-card{max-width:170mm;padding:8mm;color:#000;border:1px solid #444}.credential-grid{grid-template-columns:minmax(0,1fr) 40mm}.credential-qr svg{width:40mm;height:40mm}}
dialog.credential-dialog{position:fixed;inset:0;margin:auto;box-sizing:border-box;height:fit-content;max-height:calc(100dvh - 32px)}