/* Page intro and submit feedback in the portal's purple/cyan palette. */
.login-loader[hidden]{display:none}
html.login-intro .login-shell{visibility:hidden}
.login-loader.is-leaving{opacity:0;visibility:hidden;pointer-events:none}
body.login-is-loading{overflow:hidden}
.login-loader{
    padding:24px;overflow-y:auto;
    background-color:#070b16;
    background-image:linear-gradient(rgba(108,121,164,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(108,121,164,.055) 1px,transparent 1px),radial-gradient(ellipse at 85% 12%,rgba(196,74,255,.2),transparent 55%),radial-gradient(ellipse at 10% 90%,rgba(0,197,236,.14),transparent 55%);
    background-size:64px 64px,64px 64px,auto,auto;
}
.login-loader-content{
    position:relative;width:min(420px,100%);min-height:0;padding:36px 34px 28px;
    border:1px solid rgba(174,118,255,.25);border-radius:24px;
    background:linear-gradient(145deg,rgba(21,26,44,.97),rgba(10,14,26,.98));
    box-shadow:0 28px 80px rgba(0,0,0,.4),0 0 70px rgba(174,75,249,.07);
}
.login-loader-eyebrow{color:#a9b7ce;font-size:10px;font-weight:700;letter-spacing:3px}
.login-loader .validation-scanner{width:124px;height:124px;margin:28px 0 25px;flex-shrink:0}
.login-loader .scanner-ring-one{border:1px solid rgba(158,113,255,.2)}
.login-loader .scanner-ring-two{inset:10px;border:1px dashed rgba(104,225,255,.3)}
.login-loader .scanner-sweep{inset:0;border-width:2px;border-top-color:#d16bff;border-right-color:transparent;filter:drop-shadow(0 0 5px rgba(209,107,255,.7));animation-duration:1.5s}
.login-loader-key{position:absolute;inset:27px;display:grid;place-items:center;border-radius:22px;color:#f5e7ff;background:linear-gradient(145deg,#c460f6,#793fce);border:1px solid rgba(239,203,255,.3);box-shadow:0 0 34px rgba(185,81,247,.26),inset 0 1px rgba(255,255,255,.15)}
.login-loader-key svg{width:34px;height:34px}
.login-loader-content h2{max-width:100%;overflow-wrap:anywhere;margin:0 0 18px;color:#f3edff;font-size:28px;font-weight:700;letter-spacing:-.8px;line-height:1.2}
.login-loader-content .login-loader-title{margin:0 0 8px;color:#e3d4fa;font:600 15px/1.4 "DM Sans",system-ui,sans-serif;letter-spacing:0}
.login-loader-content .login-loader-description{max-width:290px;min-height:40px;margin:0 0 24px;color:#94a2bb;font:400 12px/1.65 "DM Sans",system-ui,sans-serif;letter-spacing:0}
.login-loader .login-loader-track{height:3px;background:rgba(167,134,222,.13)}
.login-loader .login-loader-track span{width:42%;background:linear-gradient(90deg,transparent,#c769ff,#77e2ff,transparent);animation:login-loading-travel 1.65s ease-in-out infinite}
.login-loader-footer{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:22px;color:#8b9ab2;font-size:10px;line-height:1.5}
.login-loader-footer>span{width:5px;height:5px;flex-shrink:0;border-radius:50%;background:#77e2ff;box-shadow:0 0 8px rgba(119,226,255,.4)}
@keyframes login-loading-travel{from{transform:translateX(-110%)}to{transform:translateX(350%)}}
@media(prefers-reduced-motion:no-preference){
    .login-is-ready .login-shell{animation:login-form-reveal .5s cubic-bezier(.22,1,.36,1) both}
    .login-loader-content{animation:login-loading-appear .25s ease-out both}
    .login-loader-key{animation:login-loading-glow 2.4s ease-in-out infinite}
}
@keyframes login-form-reveal{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes login-loading-appear{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes login-loading-glow{50%{box-shadow:0 0 44px rgba(185,81,247,.44),inset 0 1px rgba(255,255,255,.15)}}
@media(max-width:575.98px){.login-loader{padding:20px}.login-loader-content{padding:30px 24px 25px}.login-loader-content h2{font-size:25px}}
@media(prefers-reduced-motion:reduce){.login-loader .scanner-sweep,.login-loader .login-loader-track span{animation:none}.login-loader .login-loader-track span{width:100%;transform:none}}

.login-page .login-button.is-authenticating{
    opacity:1;color:#f6eaff;cursor:wait;transform:none;filter:none;
    outline:1px solid rgba(244,225,255,.95);outline-offset:2px;
    background:linear-gradient(110deg,#c467ed,#a64bd0,#c467ed);background-size:200% 100%;
    box-shadow:0 10px 26px rgba(191,75,249,.3);gap:12px;
}
.login-page .login-button.is-authenticating::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.2) 50%,transparent 65%);
    transform:translateX(-100%);
}
.login-auth-hourglass{display:inline-flex;align-items:center;justify-content:center;flex:0 0 20px}
.login-page .login-button .login-auth-hourglass svg{width:20px;height:20px;transform:none}
@media(prefers-reduced-motion:no-preference){
    .login-page .login-button.is-authenticating{animation:login-auth-glow 2s ease-in-out infinite}
    .login-page .login-button.is-authenticating::before{animation:login-auth-shine 2.2s ease-in-out infinite}
    .login-auth-hourglass{animation:login-auth-turn 1s linear infinite}
}
@keyframes login-auth-turn{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes login-auth-shine{0%,15%{transform:translateX(-100%)}80%,100%{transform:translateX(100%)}}
@keyframes login-auth-glow{50%{background-position:100% 0;box-shadow:0 10px 32px rgba(191,75,249,.5)}}
