.passkey-invitation{position:fixed;right:22px;bottom:22px;z-index:150;max-width:390px;width:calc(100% - 32px);padding:24px;border:1px solid #d8bd7b;border-radius:23px;background:linear-gradient(140deg,#fff,#f1f4f8);color:#123457;box-shadow:0 15px 45px #102d5033}.passkey-invitation[hidden]{display:none}.passkey-invitation strong{font-size:17px;line-height:1.4;display:block}.passkey-invitation p{font-size:13px;line-height:1.65;margin:12px 0 18px}.passkey-invitation-actions{display:flex;gap:10px;flex-wrap:wrap}.passkey-invitation .button{justify-content:center;flex:1;white-space:nowrap}.passkey-never{display:block;padding:12px 0 0;background:none;border:0;color:#53677c;text-decoration:underline;font-size:11px;cursor:pointer}.passkey-invitation [role=status]:empty{display:none}.passkey-panel{scroll-margin-top:100px}.passkey-panel h2{max-width:680px;font-size:25px}.passkey-panel>p{line-height:1.75;font-size:14px}.passkey-add-form{max-width:600px;margin:24px 0}.passkey-add-form>.button{display:flex;align-items:center;gap:10px}.passkey-add-form>.button svg{width:23px;height:23px}.passkey-name summary{cursor:pointer;font-size:12px;color:#325a85}.passkey-name label{margin-top:14px}.passkey-confirm{display:grid;gap:15px;background:#edf2f7;padding:18px;border-radius:15px}.passkey-confirm p{font-size:13px;margin:0}.passkey-list{border-top:1px solid #abb9ca55;padding-top:20px}.passkey-list h3{font-size:17px}.passkey-item{border:1px solid #b9c5d555;border-radius:14px;padding:16px;margin:12px 0}.passkey-item>summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}.passkey-item small,.passkey-item>p{font-size:12px;color:#5b6d80}.passkey-item>form{padding-top:12px;max-width:500px}.passkey-recovery{padding-top:18px;border-top:1px solid #abb9ca55;color:#5b6d80}.passkey-recovery a{color:#205a94}.passkey-panel [role=status]:empty{display:none}
@media(max-width:540px){.passkey-invitation{right:16px;bottom:16px;padding:20px}.passkey-panel h2{font-size:22px}}
@media(prefers-color-scheme:dark){:where(:root:not([data-theme=light])) .passkey-invitation{background:linear-gradient(140deg,#21364e,#15273b);color:#f1f5fc;border-color:#ad8d4b}:where(:root:not([data-theme=light])) .passkey-never{color:#becbdd}:where(:root:not([data-theme=light])) .passkey-invitation .button-outline{color:#e6edf7;border-color:#8196af}:where(:root:not([data-theme=light])) .passkey-panel .passkey-confirm{background:#10253d;color:#edf4ff}}
@media(prefers-color-scheme:dark){:where(:root:not([data-theme=light])) .passkey-panel{background:#182b42;color:#e8eff8;border-color:#63799555}:where(:root:not([data-theme=light])) .passkey-panel .passkey-name summary,:where(:root:not([data-theme=light])) .passkey-panel .passkey-item small,:where(:root:not([data-theme=light])) .passkey-panel .passkey-item>p,:where(:root:not([data-theme=light])) .passkey-panel .passkey-recovery,:where(:root:not([data-theme=light])) .passkey-panel .muted{color:#bbcadc}:where(:root:not([data-theme=light])) .passkey-panel label{color:#dce7f5}:where(:root:not([data-theme=light])) .passkey-panel input,:where(:root:not([data-theme=light])) .passkey-panel select{background:#12243a;color:#edf4ff;border-color:#607791}:where(:root:not([data-theme=light])) .passkey-panel .button-outline{color:#e4edf9;border-color:#94a6bf}:where(:root:not([data-theme=light])) .passkey-panel .passkey-recovery a{color:#a6cbff}}

/* Explicit theme choice uses the existing dark palette. */
:where(:root[data-theme=dark]) .passkey-invitation{background:linear-gradient(140deg,#21364e,#15273b);color:#f1f5fc;border-color:#ad8d4b}:where(:root[data-theme=dark]) .passkey-never{color:#becbdd}:where(:root[data-theme=dark]) .passkey-invitation .button-outline{color:#e6edf7;border-color:#8196af}:where(:root[data-theme=dark]) .passkey-panel .passkey-confirm{background:#10253d;color:#edf4ff}:where(:root[data-theme=dark]) .passkey-panel{background:#182b42;color:#e8eff8;border-color:#63799555}:where(:root[data-theme=dark]) .passkey-panel .passkey-name summary,:where(:root[data-theme=dark]) .passkey-panel .passkey-item small,:where(:root[data-theme=dark]) .passkey-panel .passkey-item>p,:where(:root[data-theme=dark]) .passkey-panel .passkey-recovery,:where(:root[data-theme=dark]) .passkey-panel .muted{color:#bbcadc}:where(:root[data-theme=dark]) .passkey-panel label{color:#dce7f5}:where(:root[data-theme=dark]) .passkey-panel input,:where(:root[data-theme=dark]) .passkey-panel select{background:#12243a;color:#edf4ff;border-color:#607791}:where(:root[data-theme=dark]) .passkey-panel .button-outline{color:#e4edf9;border-color:#94a6bf}:where(:root[data-theme=dark]) .passkey-panel .passkey-recovery a{color:#a6cbff}
