:root{color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#001824;color:#edf7fc;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0;min-height:100svh;background:linear-gradient(180deg,rgba(0,17,27,.03),rgba(0,17,27,.08)),url("branding/login-background.png") center center/cover no-repeat fixed}
.brand-header{width:calc(100% - clamp(40px,9.6vw,152px));max-width:1600px;height:110px;margin:0 auto;display:flex;align-items:center;border-bottom:1px solid #4295a6;gap:30px}
.brand-logo{width:164px;height:82px;object-fit:contain;display:block}
.brand-divider{height:54px;width:1px;background:#22adc5}
.brand-context{font-size:20px;font-weight:600;letter-spacing:.1px;color:#d0e5ef}
main{padding:70px 24px 80px;display:flex;justify-content:center}
.login-panel{width:600px;padding:44px 46px 52px;border:1.5px solid #00c9d5;border-radius:32px;background:linear-gradient(135deg,rgba(0,80,83,.57),rgba(0,27,40,.89));box-shadow:inset 0 0 38px rgba(0,190,184,.035),0 12px 70px rgba(0,10,20,.22);backdrop-filter:blur(8px)}
.panel-heading{text-align:center}
.shield-icon{width:66px;height:70px;color:#00dfc1;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;display:block;margin:0 auto 18px}
h1{margin:0;font-size:44px;line-height:1.2;letter-spacing:-1px;font-weight:750;color:#edf8ff}
.panel-heading p{margin:10px 0 30px;font-size:21px;line-height:1.5;color:#b7d5e3;letter-spacing:-.35px}
.field+.field{margin-top:24px}
.field label{display:block;font-size:18px;font-weight:500;line-height:24px;margin-bottom:8px;color:#edf7fc}
.input-shell{height:56px;display:flex;align-items:center;gap:18px;padding:0 18px;border:1px solid #5b9fb4;border-radius:16px;background:rgba(0,21,32,.68);transition:border-color .15s,box-shadow .15s}
.input-shell:focus-within{border-color:#00e4cc;box-shadow:0 0 0 3px rgba(0,228,204,.15)}
.input-shell>svg{width:24px;height:24px;flex-shrink:0;stroke:#c0e4ef;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
input{font:inherit;font-size:18px;background:transparent;color:#f4fbff;border:0;outline:0;min-width:0;width:100%;height:100%;padding:0}
input::placeholder{color:#9cbbc9;opacity:1}
input:-webkit-autofill{-webkit-text-fill-color:#f4fbff;box-shadow:0 0 0 1000px #032b39 inset;caret-color:#f4fbff}
button{font:inherit;cursor:pointer;touch-action:manipulation}
.password-toggle{height:44px;width:44px;margin-right:-12px;border:0;padding:10px;background:transparent;color:#d5edf7;border-radius:10px;flex-shrink:0}
.password-toggle[hidden]{display:none}
.password-toggle svg{display:block;width:24px;height:24px;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.eye-slash{display:none}.password-toggle[aria-pressed=true] .eye-slash{display:block}
.password-toggle:hover{background:rgba(0,220,210,.1)}
button:focus-visible{outline:3px solid #b4fff0;outline-offset:4px}
.sign-in-button{display:block;width:100%;margin-top:32px;min-height:64px;padding:12px 20px;border:0;border-radius:16px;background:linear-gradient(100deg,#64f347,#60f548);color:#001b26;font-size:22px;line-height:1.3;font-weight:750;box-shadow:0 3px 24px rgba(62,240,75,.08);transition:filter .15s,transform .15s}
.sign-in-button:hover{filter:brightness(1.08)}.sign-in-button:active{transform:translateY(1px)}
.form-alert,.form-status{margin:0 0 22px;padding:12px 16px;border:1px solid #df9d8e;background:rgba(72,30,28,.7);border-radius:12px;font-size:14px;line-height:1.5;color:#ffe0da}.form-alert p{margin:0}.form-alert p+p{margin-top:6px}.form-status{border-color:#15bdb1;background:#063d3e;color:#c2fff1}.input-shell.invalid{border-color:#f2a191}
@media(min-width:1800px){main{padding-top:clamp(70px,9vh,140px)}}
@media(max-width:640px){body{background-position:64% center}.brand-header{width:calc(100% - 36px);height:88px;gap:18px}.brand-logo{width:128px;height:64px}.brand-divider{height:38px}.brand-context{font-size:15px}main{padding:38px 18px 48px}.login-panel{padding:30px 24px 34px;border-radius:24px}.shield-icon{width:52px;height:56px;margin-bottom:16px}h1{font-size:32px;letter-spacing:-.7px}.panel-heading p{font-size:16px;margin:10px 0 28px;letter-spacing:0}.field label{font-size:16px}input{font-size:16px}.input-shell{gap:12px;padding:0 14px}.sign-in-button{font-size:18px;min-height:56px;margin-top:28px}.password-toggle{margin-right:-8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}