:root{--login-muted:#555c74}
*{box-sizing:border-box}
html{min-height:100%;color:var(--text);font-family:var(--hub-font);-webkit-text-size-adjust:100%}
body{min-height:100vh;min-height:100dvh;margin:0;background:#f2f0ff;font-weight:700;-webkit-font-smoothing:antialiased}
button,input{font:inherit}
button{cursor:pointer}
button:focus-visible{outline:3px solid var(--a2);outline-offset:4px}
.aurora{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 0% 0%,rgba(37,99,235,.20),transparent 52%),radial-gradient(ellipse at 100% 5%,rgba(124,58,237,.18),transparent 55%),radial-gradient(ellipse at 75% 100%,rgba(16,217,160,.17),transparent 55%),linear-gradient(160deg,#f2f0ff 0%,#eef4ff 42%,#eefaf6 100%)}
.login-layout{width:min(1080px,100%);min-height:100vh;min-height:100dvh;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:70px;align-items:center;margin:0 auto;padding:60px 40px;padding-top:max(60px,env(safe-area-inset-top));padding-bottom:max(60px,env(safe-area-inset-bottom))}
.brand-panel{padding:20px 0}
.brand-mark{width:166px;height:166px;display:grid;place-items:center;margin-bottom:35px;border-radius:var(--r-xl);border:1px solid white;background:linear-gradient(135deg,rgba(255,255,255,.76),rgba(255,255,255,.26));box-shadow:var(--shadow-float)}
.brand-mark img{width:132px;height:132px;object-fit:contain;border-radius:22px}
.brand-kicker{font-size:12px;letter-spacing:.18em;font-weight:900;color:var(--a1)}
.brand-panel h1{font-size:clamp(34px,4vw,46px);line-height:1.35;letter-spacing:-.035em;font-weight:950;margin:14px 0 20px}
.brand-panel h1 span{background:linear-gradient(100deg,var(--a2),var(--a3) 42%,var(--a1));-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-description{font-size:14px;line-height:1.9;color:var(--login-muted);margin:0;font-weight:750}
.glass{border:1px solid rgba(255,255,255,.8);border-top-color:var(--stroke-strong);background:linear-gradient(135deg,var(--glass-hi),var(--glass-lo));box-shadow:var(--shadow-float);backdrop-filter:blur(24px) saturate(1.8);-webkit-backdrop-filter:blur(24px) saturate(1.8)}
.login-card{border-radius:var(--r-xl);padding:36px 34px 28px}
.login-heading{margin-bottom:30px}
.login-emblem{display:grid;place-items:center;width:58px;height:58px;margin-bottom:22px;border-radius:19px;background:linear-gradient(135deg,var(--a2),var(--a3));color:#fff;border:1px solid rgba(255,255,255,.45);box-shadow:0 12px 25px rgba(35,55,125,.22),inset 0 1px 0 rgba(255,255,255,.38)}
.login-emblem svg{width:28px;height:28px}
.login-kicker{color:var(--a2);font-size:12px;font-weight:900;letter-spacing:.06em}
.login-heading h2{font-size:27px;line-height:1.3;margin:9px 0 11px;font-weight:950;letter-spacing:-.025em}
.login-heading p{font-size:14px;line-height:1.7;margin:0;color:var(--login-muted);font-weight:750}
#loginForm label{display:block;margin-bottom:10px;font-size:15px;font-weight:900}
.password-field{position:relative;display:flex;align-items:center;border:1px solid rgba(255,255,255,.96);border-radius:var(--r-m);background:rgba(255,255,255,.74);box-shadow:inset 0 1px 0 #fff;transition:box-shadow .15s,border-color .15s}
.password-field:focus-within{border-color:rgba(37,99,235,.58);box-shadow:var(--shadow-focus)}
.password-field:has(input[aria-invalid=true]){border-color:#d73652}
#password{width:100%;min-width:0;min-height:58px;border:0;outline:none;background:transparent;padding:15px 62px 15px 18px;border-radius:inherit;color:var(--text);font-size:17px;font-weight:750}
#password::placeholder{font-size:15px;color:#747b91;font-weight:650}
.password-toggle{position:absolute;right:7px;width:46px;height:46px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--login-muted)}
.password-toggle:hover{color:var(--a2);background:rgba(37,99,235,.07)}
.password-toggle svg{width:23px;height:23px}
.eye-closed{display:none}
.password-toggle[aria-pressed=true] .eye-open{display:none}
.password-toggle[aria-pressed=true] .eye-closed{display:block}
.field-hint{font-size:12px;color:var(--login-muted);line-height:1.6;margin:10px 4px 0;font-weight:700}
.login-status{min-height:45px;font-size:13px;line-height:1.65;margin:16px 4px 14px;color:var(--login-muted);overflow-wrap:anywhere;font-weight:750}
.login-status[data-tone=error]{color:#a81e3a}
.login-status[data-tone=success]{color:#067251}
.login-submit{width:100%;min-height:56px;display:flex;align-items:center;justify-content:center;gap:10px;border:1px solid transparent;border-radius:var(--r-pill);background:linear-gradient(135deg,var(--a2),var(--a1));color:white;font-size:16px;font-weight:900;box-shadow:0 10px 24px rgba(37,99,235,.28),inset 0 1px 0 rgba(255,255,255,.3);transition:filter .15s}
.login-submit:hover:not(:disabled){filter:brightness(1.07)}
.login-submit:disabled{cursor:wait;opacity:.72}
.submit-arrow{width:20px;height:20px}
.spinner{display:none;width:19px;height:19px;border:2px solid rgba(255,255,255,.4);border-top-color:#fff;border-radius:50%;animation:login-spin .8s linear infinite}
#loginForm[aria-busy=true] .spinner{display:block}
#loginForm[aria-busy=true] .submit-arrow{display:none}
.login-footer{border-top:1px solid rgba(124,136,169,.18);padding-top:20px;margin:27px 0 0;text-align:center;color:var(--login-muted);font-size:12px;line-height:1.7;font-weight:800}
.noscript-notice{font-size:13px;color:#a81e3a;line-height:1.7}
html[data-appearance=light] .glass{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(135deg,rgba(255,255,255,.90),rgba(255,255,255,.66))}
@keyframes login-spin{to{transform:rotate(360deg)}}
@media(max-width:900px){.login-layout{gap:36px;padding-left:28px;padding-right:28px;grid-template-columns:minmax(0,1fr) minmax(0,400px)}.brand-panel h1{font-size:34px}.brand-description{font-size:13px}.brand-mark{width:146px;height:146px}.brand-mark img{width:116px;height:116px}.login-card{padding:32px 28px 26px}}
@media(max-width:700px){.login-layout{max-width:500px;grid-template-columns:1fr;gap:26px;align-content:center;padding:32px 24px;padding-top:max(32px,env(safe-area-inset-top));padding-bottom:max(32px,env(safe-area-inset-bottom))}.brand-panel{text-align:center;padding:0}.brand-mark{width:88px;height:88px;border-radius:24px;margin:0 auto 18px}.brand-mark img{width:68px;height:68px;border-radius:12px}.brand-kicker{font-size:10px}.brand-panel h1{font-size:27px;margin:10px 0 8px}.brand-panel h1 br{display:none}.brand-panel h1 span{margin-left:.15em}.brand-description{font-size:11px}.login-heading{margin-bottom:24px}.login-emblem{display:none}.login-card{border-radius:var(--r-l);padding:28px}.login-heading h2{font-size:25px}.login-status{min-height:42px}}
@media(max-width:380px){.login-layout{padding-left:16px;padding-right:16px}.brand-panel h1{font-size:24px}.login-card{padding:26px 22px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.spinner{border-top-color:#fff;border-right-color:#fff}}
