* {box-sizing:border-box;}
:root {font-family:'Segoe UI',Arial,sans-serif;color:#192b46;background:#f0f4f9;}
body {margin:0;min-height:100vh;display:flex;flex-direction:column;padding:0 32px;background:radial-gradient(ellipse at 80% 15%,#dce8fb66,transparent 45%),#f0f4f9;}
.login-header {width:100%;max-width:1110px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:32px 0;}
.brand {display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:#192b46;font-size:19px;font-weight:750;letter-spacing:-.5px;}
.brand-icon {display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#2563eb;color:white;box-shadow:0 4px 10px #2563eb25;}
.brand-icon svg {width:25px;height:25px;}
.brand-light {font-weight:500;}
.header-caption {font-size:12px;color:#8491a5;letter-spacing:.2px;}
.login-shell {display:grid;grid-template-columns:1.08fr 1fr;width:100%;max-width:1110px;margin:auto;min-height:580px;background:white;border:1px solid #dfe6f0;border-radius:22px;overflow:hidden;box-shadow:0 20px 70px #1834550d;}
.login-visual {position:relative;isolation:isolate;min-width:0;overflow:hidden;background:radial-gradient(ellipse at 70% 80%,#204573 0%,transparent 65%),linear-gradient(145deg,#11213b,#142e50);color:white;padding:52px 48px;}
.visual-grid {position:absolute;inset:0;z-index:-1;background-image:linear-gradient(#adc9ed05 1px,transparent 1px),linear-gradient(90deg,#adc9ed05 1px,transparent 1px);background-size:36px 36px;mask-image:linear-gradient(180deg,transparent,black);}
.eyebrow {display:block;font-size:10px;font-weight:650;letter-spacing:2px;line-height:1.5;color:#8da9cb;}
.visual-copy h2 {margin:22px 0 20px;font-size:43px;font-weight:650;letter-spacing:-1.3px;line-height:1.22;}
.visual-copy h2 span {color:#60a5fa;}
.visual-copy p {color:#9bb3d0;font-size:14px;line-height:1.85;margin:0;}
.route-art {position:absolute;left:-15px;bottom:36px;width:110%;height:auto;z-index:-1;}
.visual-footer {position:absolute;bottom:30px;left:48px;right:24px;display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:1.5px;color:#88a3c5;}
.footer-line {width:22px;height:1px;background:#6085b4;}
.login-container {padding:52px 62px 34px;align-self:center;min-width:0;}
.welcome-icon {display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:#eff5ff;color:#2563eb;margin-bottom:24px;}
.welcome-icon svg {width:24px;height:24px;}
.form-eyebrow {color:#94a3b8;letter-spacing:1.7px;margin-bottom:9px;}
h1 {margin:0;font-size:31px;font-weight:650;letter-spacing:-.9px;line-height:1.25;}
.login-subtitle {color:#8693a7;font-size:13px;margin:9px 0 30px;}
.login-container label {display:block;margin:0 0 9px;font-size:12px;font-weight:600;color:#475569;}
.input-wrap {position:relative;margin-bottom:20px;}
.login-container input {display:block;width:100%;height:48px;padding:0 45px;border:1px solid #dce3ec;border-radius:9px;background:#fbfcfe;color:#172b4d;font:16px 'Segoe UI',Arial,sans-serif;outline:none;transition:border-color .15s,box-shadow .15s,background .15s;}
.login-container input:focus {border-color:#6392f3;box-shadow:0 0 0 3px #2563eb0c;background:white;}
.login-container input::placeholder {color:#a4afbf;}
.field-icon {position:absolute;left:15px;top:15px;width:18px;height:18px;color:#9baac0;pointer-events:none;}
.password-toggle {position:absolute;right:6px;top:6px;width:36px;height:36px;padding:9px;border:0;border-radius:6px;background:transparent;color:#94a3b8;cursor:pointer;}
.password-toggle:hover {color:#2563eb;background:#edf3ff;}
.password-toggle svg {display:block;width:18px;height:18px;}
.eye-slash {display:none;}
.password-toggle[aria-pressed='true'] .eye-slash {display:block;}
.login-submit {display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:48px;margin-top:28px;padding:0 18px;border:1px solid #2865dc;border-radius:9px;background:linear-gradient(135deg,#2563eb,#2f70ed);color:white;font:600 14px 'Segoe UI',Arial,sans-serif;cursor:pointer;box-shadow:0 5px 13px #2563eb20;transition:background .15s,box-shadow .15s;}
.login-submit svg {width:17px;height:17px;}
.login-submit:hover {background:#1d4ed8;box-shadow:0 7px 20px #2563eb30;}
button:focus-visible,a:focus-visible {outline:3px solid #93b4fa;outline-offset:3px;}
.login-error {margin-bottom:20px;padding:12px;border:1px solid #fecaca;border-radius:8px;color:#b42318;background:#fff1f0;font-size:13px;line-height:1.5;}
.login-card-footer {display:flex;justify-content:center;align-items:center;gap:7px;padding-top:26px;margin-top:30px;border-top:1px solid #edf1f6;font-size:10px;color:#9ba7b8;}
.footer-dot {width:4px;height:4px;border-radius:50%;background:#8ba4c8;}
.page-footer {padding:26px 0;text-align:center;font-size:10px;color:#98a4b5;letter-spacing:.2px;}
.page-footer span {padding:0 7px;color:#b8c4d4;}
@media(max-width:1000px) {.login-shell {min-height:550px;}.login-visual {padding:45px 32px;}.visual-copy h2 {font-size:37px;}.visual-footer {left:32px;}.login-container {padding:45px 38px 30px;}}
@media(max-width:760px) {body {padding:0 20px;}.login-header {max-width:450px;padding:26px 0;}.header-caption {display:none;}.login-shell {display:block;max-width:450px;min-height:0;border-radius:18px;}.login-visual {display:none;}.login-container {padding:32px;}.welcome-icon {margin-bottom:22px;}.page-footer {padding:24px 0;}h1 {font-size:29px;}}
@media(max-width:380px) {body {padding:0 14px;}.login-container {padding:28px 24px;}.brand {font-size:17px;}}
@media(prefers-reduced-motion:reduce) {input,button {transition:none!important;}}

/* The decorative panel contains artwork only. */
body {padding-bottom:32px;}
.route-art {bottom:auto;top:50%;transform:translateY(-50%);width:120%;left:-10%;}
