.passkey-dialog,.passkey-panel,.passkey-login { font-family: Arial,Helvetica,sans-serif; }
.passkey-dialog,.passkey-dialog *,.passkey-panel *,.passkey-login * { box-sizing:border-box; }
.passkey-dialog [hidden],.passkey-panel [hidden],.passkey-login [hidden] { display:none!important; }
.passkey-dialog { width:min(520px,calc(100% - 32px)); max-height:calc(100dvh - 32px); overflow:auto; overscroll-behavior:contain; margin:auto; padding:36px; border:1px solid #bfa66a80; border-radius:26px; background:radial-gradient(ellipse at top right,#a2864628,transparent 65%),linear-gradient(140deg,#31362b,#1b231f); color:#f4efdf; box-shadow:0 28px 100px #0009; }
.passkey-dialog[open] { animation:passkey-appear .22s ease-out; }
.passkey-dialog::backdrop { background:#0b100dce; backdrop-filter:blur(7px); }
.passkey-dialog h2 { margin:14px 0; font-size:clamp(27px,4vw,35px); line-height:1.12; font-weight:500; letter-spacing:-.04em; color:#f4efdf; }
.passkey-dialog h2:focus { outline:none; }
.passkey-dialog p,.passkey-panel p { color:#c3c7b7; line-height:1.65; }
.passkey-close { position:absolute; top:16px; right:16px; width:44px; height:44px; border:1px solid #c6ac6e50; border-radius:50%; background:#ffffff08; color:#e4ce9b; font-size:25px; cursor:pointer; }
.passkey-emblem { display:grid; place-items:center; width:80px; height:80px; margin-bottom:24px; border-radius:23px; border:1px solid #dec58b50; background:#c8a65315; color:#e5ca8b; box-shadow:inset 0 1px #f4db9722,0 10px 30px #0002; }
.passkey-eyebrow { color:#dfc483; font-size:10px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
.passkey-benefits { display:grid; gap:10px; margin:22px 0; color:#e3d4af; font-size:13px; }
.passkey-form { display:grid; gap:10px; margin-top:22px; }
.passkey-form label { display:block; margin-bottom:5px; font-size:13px; color:#e6dbbe; }
.passkey-form input { box-sizing:border-box; min-width:0; width:100%; min-height:46px; padding:12px 14px; border:1px solid #c3ab6e55; border-radius:10px; background:#101a1670; color:#f4efdf; font:inherit; }
.passkey-form input:focus-visible { outline:2px solid #e2c482; outline-offset:2px; }
.passkey-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
.passkey-button { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:12px 18px; border:1px solid #c8ae7360; border-radius:12px; background:#dac18810; color:#f0dfb4; font:600 14px/1.4 Arial,Helvetica,sans-serif; cursor:pointer; transition:background .2s,box-shadow .2s; white-space:normal; }
.passkey-button-primary { border-color:#dfc184; background:linear-gradient(135deg,#e3c98f,#bfa064); color:#23261e; box-shadow:0 8px 24px #0002; }
.passkey-button:hover { background:#dac18825; }.passkey-button-primary:hover { background:linear-gradient(135deg,#eed9aa,#d0b276); }
.passkey-button:disabled { opacity:.6; cursor:wait; }
.passkey-button:focus-visible,.passkey-close:focus-visible { outline:2px solid #f2d88e; outline-offset:4px; }
.passkey-status { margin:4px 0!important; font-size:13px!important; line-height:1.6; overflow-wrap:anywhere; }
.passkey-status:empty { display:none; }
.passkey-row { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:18px 0; border-bottom:1px solid #c5af7430; }
.passkey-row>div { min-width:0; overflow-wrap:anywhere; }.passkey-row small { display:block; margin-top:6px; color:#bfc4b6; line-height:1.5; }
.passkey-panel { margin-top:24px; }.passkey-note { font-size:12px; }.passkey-login { margin:12px 0 18px; }.passkey-login>.passkey-button { width:100%; }
.passkey-divider { display:flex; align-items:center; gap:14px; margin:14px 0; font-size:12px; color:#bbbda9; }.passkey-divider::before,.passkey-divider::after { content:''; height:1px; background:#c5af7430; flex:1; }
.passkey-offer.is-complete .passkey-form>label,.passkey-offer.is-complete .passkey-form>input,.passkey-offer.is-complete [data-passkey-password] { display:none; }
.passkey-offer [data-passkey-done] { margin-top:16px; width:100%; }
@keyframes passkey-appear { from { opacity:0; transform:translateY(12px); } to { opacity:1; transform:none; } }
@media(max-width:540px) { .passkey-dialog { padding:26px 22px; }.passkey-actions { flex-direction:column; }.passkey-row { align-items:flex-start; flex-direction:column; }.passkey-row>.passkey-button { width:100%; }.passkey-form input { font-size:16px; } }
@media(prefers-reduced-motion:reduce) { .passkey-dialog[open] { animation:none; }.passkey-button { transition:none; } }
