:root{color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-height:100dvh;display:grid;place-items:center;background:#090e17;color:#e9f0fa;font:15px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;padding:24px}body:before{content:"";position:fixed;inset:-12px;z-index:-1;background:linear-gradient(#000b,#000c),url('/assets/admin-auth-wallpaper.png') center/cover;filter:blur(6px)}.account-card{width:min(100%,380px);padding:28px 24px;background:linear-gradient(180deg,#141821df,#0f141bf0);border:1px solid #ffffff1f;border-radius:16px;box-shadow:0 12px 34px #0006;text-align:center;backdrop-filter:blur(6px)}h1{margin:0 0 20px;font-size:22px;letter-spacing:-.02em}h2{font-size:16px;margin:24px 0 12px;text-align:left}p{font-size:13px;line-height:1.5;color:#aeb8c6;margin:12px 0 18px}label{display:block;text-align:left;margin:14px 0 6px;font-size:13px}input{display:block;width:100%;margin-top:7px;padding:12px;border:1px solid #ffffff24;border-radius:9px;background:#0d1117;color:#fff;font:inherit}input:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid #67afff;outline-offset:3px}button,.button{display:block;width:100%;padding:12px;margin-top:14px;border:1px solid #4c77b7;border-radius:9px;background:#235da7;color:white;font:inherit;font-weight:600;text-align:center;text-decoration:none;cursor:pointer}button:disabled{opacity:.55;cursor:wait}.secondary{background:#ffffff09;border-color:#ffffff24}.discord{background:#5865f2;border-color:#5865f2;display:flex;align-items:center;justify-content:center;gap:10px}.discord img{width:22px;height:22px;object-fit:contain}.text-link{display:block;margin-top:18px;font-size:13px;color:#9ec6ff;text-decoration:none}.divider{display:flex;align-items:center;gap:12px;margin:20px 0;color:#8190a2;font-size:12px}.divider:before,.divider:after{content:"";height:1px;background:#ffffff1a;flex:1}.auth-logo{height:64px;width:64px;object-fit:contain;margin:0 auto 18px}.auth-avatar{display:grid;place-items:center;width:76px;height:76px;margin:0 auto 16px;border-radius:50%;background:#182231;border:2px solid #ffffff2e;font-size:26px;font-weight:700}.mfa-code{text-align:center;font-size:22px;letter-spacing:.32em}.error{color:#ff9ca6}.passkey-name{text-align:left;font-size:13px;color:#aeb8c6;margin:12px 0}summary{cursor:pointer}ul{padding:0;list-style:none}li{display:flex;align-items:center;justify-content:space-between;gap:12px;text-align:left;overflow-wrap:anywhere;padding:12px 0;border-bottom:1px solid #ffffff16}li button{width:auto;flex:none;font-size:12px;padding:6px 10px;margin:0;background:transparent;border-color:#ffffff24}[data-passkey-status]:empty{display:none}[hidden]{display:none!important}.account-card svg{max-width:100%;height:auto}
.passkey-icon{display:inline-block;width:21px;height:21px;vertical-align:middle;margin-right:8px}
/* Keep the backdrop steady and ease the card between authentication steps. */
@view-transition{navigation:auto}
.security-card{width:min(100%,520px)}.security-tabs{display:flex;gap:8px;margin:0 0 24px}.security-tabs button{margin:0;background:transparent;border-color:#ffffff24;font-size:14px}.security-tabs button[aria-pressed="true"]{background:#235da7;border-color:#4c77b7}.security-card select{width:100%;display:block;margin-top:7px;padding:12px;border:1px solid #ffffff24;border-radius:9px;background:#0d1117;color:white;font:inherit}.security-card small{color:#8d9aaa;font-size:11px}
.account-card{view-transition-name:auth-card;animation:auth-arrive 180ms ease-out both}
@keyframes auth-arrive{from{opacity:.65}to{opacity:1}}
@keyframes auth-leave{to{opacity:0}}
::view-transition-group(auth-card){animation-duration:240ms;animation-timing-function:cubic-bezier(.22,.68,.2,1)}
::view-transition-old(auth-card){animation:auth-leave 130ms ease-out both;mix-blend-mode:normal}
::view-transition-new(auth-card){animation:auth-arrive 220ms ease-out both;mix-blend-mode:normal}
::view-transition-old(root){display:none}
::view-transition-new(root){animation:none}
html:active-view-transition .account-card{animation:none}
/* Reserve the final setup layout while the browser checks passkey availability. */
[data-passkey-offer-content][hidden]{display:block!important;visibility:hidden}
[data-passkey-offer-content]:not([hidden]){animation:auth-arrive 180ms ease-out both}
[data-passkey-offer] [data-passkey-status]{display:block!important;min-height:20px;margin:12px 0}
@media(prefers-reduced-motion:reduce){
 @view-transition{navigation:none}
 .account-card,[data-passkey-offer-content]:not([hidden]){animation:none}
 ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none}
}
.admins-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.admins-heading h1{margin:0}.admins-heading button{width:auto;margin:0;padding:8px 16px}.admin-identity{display:flex;align-items:center;flex-wrap:wrap;gap:4px;min-width:0}.security-card .admin-role{display:inline-block;width:auto;margin:0;padding:4px 22px 4px 5px;background:transparent;font-size:13px;border-color:transparent;cursor:pointer}.security-card .admin-role:hover{border-color:#ffffff40}.security-card dialog{width:min(420px,calc(100vw - 32px));padding:24px;border:1px solid #ffffff24;border-radius:14px;background:#111923;color:#e9f0fa;text-align:left}.security-card dialog::backdrop{background:#0009;backdrop-filter:blur(3px)}.security-card dialog h2{margin-top:0}.admin-dialog-actions{display:flex;gap:10px}

.security-card select option{color:#000;background:#fff}
.admin-identity{flex:1;flex-wrap:nowrap;gap:10px}.admin-details{display:flex;align-items:center;flex-wrap:wrap;gap:4px;min-width:0}.admin-avatar{width:36px;height:36px;display:grid;place-items:center;flex:0 0 36px;border-radius:9px;background:linear-gradient(145deg,#2e68b5,#183d70);color:#fff;font-size:12px;font-weight:900;box-shadow:0 6px 16px rgba(21,65,123,.3);overflow:hidden}.admin-avatar img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
