:root{--navy:#142e46;--navy2:#234968;--accent:#2f8495;--ink:#1d3347;--muted:#718397;--border:#dbe4eb;--bg:#f3f6fa}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:'Segoe UI',Inter,Arial,sans-serif;font-size:13px;color:var(--ink)}
.login-page{min-height:100vh;background:var(--bg);display:grid;place-items:center;padding:25px}
.login-shell{width:min(940px,100%);min-height:515px;display:grid;grid-template-columns:1fr 0.96fr;overflow:hidden;background:#fff;border:1px solid #e4e9ef;border-radius:14px;box-shadow:0 18px 65px rgba(25,49,77,.10)}
.login-brand{padding:38px 43px;display:flex;flex-direction:column;justify-content:space-between;color:white;background:linear-gradient(148deg,#112b44,#204862 70%,#236578)}
.brand-lockup{display:flex;align-items:center;gap:12px;letter-spacing:1.4px}
.brand-symbol{width:44px;height:44px;display:grid;place-items:center;color:#b7e6ed;border:1px solid #6e9aad;border-radius:10px}
.brand-lockup strong{font-size:16px;font-weight:750;display:block}
.brand-lockup span{display:block;font-size:9px;letter-spacing:2px;color:#b7d0dc;margin-top:4px}
.eyebrow,.heading-eyebrow{font-size:10px;letter-spacing:2px;font-weight:750}
.eyebrow{color:#b1d2df}
.brand-copy h1{font-size:29px;line-height:1.25;letter-spacing:-.75px;font-weight:650;margin:14px 0 16px}
.brand-copy>p:last-child{color:#bfd1dd;line-height:1.9;max-width:345px;font-size:13px}
.brand-footer{font-size:10px;color:#b4cedd;letter-spacing:1px}
.login-panel{padding:30px 54px;display:flex;flex-direction:column;justify-content:center;position:relative}
.form-container{width:100%;max-width:340px;margin:auto}
.mobile-brand{display:none}
.heading{margin-bottom:28px}.heading-eyebrow{color:#2a8192;margin:0 0 10px}
.heading h2{margin:0;font-size:25px;font-weight:650;letter-spacing:-.6px}
.heading p{margin:9px 0 0;color:var(--muted)}
.field{margin-bottom:18px}.field label{display:block;font-size:12px;font-weight:650;margin-bottom:7px}
.field>input,.password-field>input{height:39px;width:100%;border:1px solid #d5dfe7;background:#fff;border-radius:6px;padding:0 12px;color:var(--ink);font:inherit;outline:0}
.field input:focus{border-color:#2f8495;box-shadow:0 0 0 3px rgba(47,132,149,.10)}
.password-field{position:relative}.password-field>input{padding-right:71px}
.toggle-password{position:absolute;right:8px;top:6px;background:none;border:0;color:#396e86;font:inherit;font-size:11px;font-weight:650;padding:6px;cursor:pointer}
.submit-button{margin-top:5px;width:100%;height:41px;background:#193d59;color:#fff;border:0;border-radius:6px;font:inherit;font-weight:650;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px}
.submit-button:hover{background:#255876}.submit-button:disabled{opacity:.78;cursor:wait}
.alert-error{color:#a32936;font-size:12px;line-height:1.55;margin:0 0 15px}.alert-error:empty,.alert-error:has(ul:empty){display:none}
.alert-error ul{padding-left:17px;margin:0}.field-error{display:block;margin-top:5px;color:#a32936;font-size:11px}.field-error:empty{display:none}
.security-note{text-align:center;color:#798a9a;font-size:11px;margin:20px 0 0}
.login-copyright{position:absolute;bottom:23px;left:20px;right:20px;text-align:center;font-size:10px;color:#9cabb6}
.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.35);border-top-color:white;border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:720px){.login-page{padding:15px}.login-shell{grid-template-columns:1fr;min-height:550px}.login-brand{display:none}.login-panel{padding:45px 25px 70px}.mobile-brand{display:block;color:#204862;font-size:15px;font-weight:800;letter-spacing:1px;margin-bottom:50px}.mobile-brand small{display:block;color:#438292;font-size:9px;letter-spacing:2px;margin-top:4px}.login-copyright{bottom:20px}}