:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#f1f8ff;background:#07121c;color-scheme:dark}*{box-sizing:border-box}body{margin:0;min-height:100svh;background:#07121c;display:grid;place-items:center;padding:20px}.login-shell{width:min(1100px,100%);aspect-ratio:670/609;position:relative;isolation:isolate;background:url('/assets/images/login-realista.png') center/100% 100% no-repeat;border-radius:18px;box-shadow:0 20px 75px #0008;overflow:hidden}.login-brand{position:absolute;top:4%;left:4%;display:flex;gap:10px;align-items:center;background:#071b2bc9;padding:12px 16px;border:1px solid #c7e5ff22;border-radius:14px}.login-mark{height:36px;width:36px;border-radius:11px;background:#2b6aef;display:grid;place-items:center}.login-mark svg{width:22px;height:22px;fill:white}.login-brand strong{font-size:22px;letter-spacing:.1em}.login-brand small{display:block;color:#9dd8ff;font-size:7px;letter-spacing:.16em;margin-top:4px}.login-scene{display:none}
/* El panel ocupa el monitor original de la fotografía, respetando sus esquinas. */
.login-card{position:absolute;left:50.35%;top:17.7%;width:43.8%;height:36%;margin:0;background:linear-gradient(115deg,#143751,#0b2944);clip-path:polygon(0 20%,100% 0,100% 100%,0 92%);padding:10% 4% 3%;display:flex;flex-direction:column;justify-content:center;border:0;box-shadow:inset 0 0 28px #5fc7ff28}.login-card>*{position:relative}.login-card h1{font-size:clamp(18px,2.1vw,25px);margin:0 0 9px;letter-spacing:-.025em}.login-eyebrow{font-size:8px;letter-spacing:.14em;color:#90d6ff;margin:0 0 5px;text-transform:uppercase;font-weight:700}.login-intro,.login-help{display:none}.mb-3{margin-bottom:10px}.form-label{font-size:11px;display:block;font-weight:650;margin-bottom:5px;color:#d7ecfc}.form-control{width:100%;height:35px;border:1px solid #8ab6d955;border-radius:6px;padding:7px 10px;background:#061c2dcc;color:white;font:inherit;font-size:14px;outline:none}.form-control:focus{border-color:#83d9ff;box-shadow:0 0 0 2px #77cbff33}.login-button{width:100%;height:35px;border:1px solid #79bcff77;border-radius:6px;background:linear-gradient(100deg,#2589f3,#2859e8);color:white;font:inherit;font-size:12px;font-weight:750;cursor:pointer;margin-top:2px}.login-button:hover{filter:brightness(1.15)}.login-button:focus-visible{outline:2px solid white;outline-offset:2px}.login-footer{position:absolute;bottom:3%;left:4%;margin:0;color:#e2edf4;font-size:12px;text-shadow:0 2px 8px #000}.alert{padding:6px 9px;background:#702939;border:1px solid #d9929e;color:#fff;font-size:10px;border-radius:6px;margin-bottom:7px}.login-card form{margin:0}
@media(min-width:1000px){.login-card{padding-top:9%;padding-bottom:2.5%}.form-control{height:39px}.login-button{height:39px}.mb-3{margin-bottom:12px}}
@media(min-width:701px) and (max-width:850px){.login-card{padding-top:8%;padding-bottom:2%}.login-eyebrow{display:none}.login-card h1{font-size:18px;margin-bottom:5px}.mb-3{margin-bottom:6px}.form-control{height:29px;font-size:12px}.form-label{font-size:10px;margin-bottom:3px}.login-button{height:28px;font-size:11px}}
@media(max-width:700px){body{padding:12px}.login-shell{aspect-ratio:auto;padding-top:87%;background-size:100% auto;background-position:top center;background-color:#0b2032;border-radius:16px}.login-brand{top:18px;left:18px;padding:9px 12px}.login-brand strong{font-size:18px}.login-mark{height:30px;width:30px}.login-card{position:relative;left:auto;top:auto;width:auto;height:auto;margin:-5% 18px 22px;clip-path:none;border:1px solid #9cc8ee44;border-radius:16px;padding:25px;background:#0d2940;display:block}.login-card h1{font-size:26px;margin-bottom:20px}.login-eyebrow{font-size:9px;margin-bottom:9px}.form-control{height:47px;font-size:16px}.form-label{font-size:12px;margin-bottom:8px}.mb-3{margin-bottom:17px}.login-button{height:47px;font-size:14px}.login-help{display:block;color:#b3c6d7;font-size:11px;line-height:1.7;margin:18px 0 0}.login-footer{position:static;text-align:center;font-size:10px;margin:0 15px 22px}.alert{font-size:12px;padding:12px}}
@media(min-width:701px){.login-shell{container-type:inline-size}.login-card{padding:8% 3.4% 2%}.login-card h1{font-size:2.2cqw;margin-bottom:.8cqw}.login-eyebrow{font-size:.75cqw;margin-bottom:.5cqw}.form-label{font-size:1.05cqw;margin-bottom:.4cqw}.form-control{height:3.5cqw;font-size:1.3cqw;padding:.6cqw .9cqw}.mb-3{margin-bottom:.9cqw}.login-button{height:3.5cqw;font-size:1.15cqw}.alert{font-size:.9cqw}}

@media(min-width:701px){.login-card{height:37.7%;clip-path:polygon(0 18%,100% 0,100% 100%,0 94%)}}

.login-card .login-chart{position:absolute;inset:15% 0 0;width:100%;height:80%;opacity:.09;pointer-events:none}.login-card form{position:relative;z-index:1}.login-card{background:linear-gradient(115deg,#143751f5,#0b2944f5)}
/* Ajuste al alto disponible sin ocultar contenido ni bloquear el desplazamiento. */
@media(min-width:701px){
 body{padding:12px}
 .login-shell{width:min(1100px,calc(100vw - 24px),calc((100svh - 24px)*670/609));border-radius:14px}
 .login-brand{padding:8px 11px;gap:8px}.login-brand strong{font-size:18px}.login-mark{width:30px;height:30px}.login-brand small{font-size:6px}
 .login-card{padding:6.5% 3.4% 1.5%}
 .login-card h1{font-size:2.3cqw;margin-bottom:.7cqw}.login-eyebrow{font-size:1cqw}
 .form-label{font-size:1.25cqw}.form-control{height:3.9cqw;font-size:1.6cqw;padding:.4cqw .8cqw}
 .login-button{height:3.9cqw;font-size:1.5cqw}.mb-3{margin-bottom:.7cqw}.login-footer{font-size:1.3cqw}
}
@media(max-width:700px) and (min-height:600px){
 body{padding:10px}
 .login-shell{padding-top:min(44vw,24svh);background-size:100% auto}
 .login-brand{top:12px;left:12px;padding:7px 10px}
 .login-card{margin:0 14px 12px;padding:20px}
 .login-card h1{font-size:24px;margin-bottom:14px}.login-eyebrow{margin-bottom:6px}
 .mb-3{margin-bottom:12px}.form-control,.login-button{height:44px}
 .login-help{margin-top:12px;line-height:1.5}.login-footer{margin-bottom:14px}
}

@media(min-width:701px){
 .login-card.screen-fit{left:0;top:0;width:440px;height:310px;padding:28px 35px 24px;clip-path:none;transform-origin:0 0;justify-content:center;background:transparent;border-radius:0;box-shadow:none}
 .screen-fit .login-eyebrow{display:block;font-size:9px;margin:0 0 8px;letter-spacing:1.5px}
 .screen-fit h1{font-size:27px;margin:0 0 17px}
 .screen-fit .form-label{font-size:12px;margin-bottom:6px}
 .screen-fit .form-control{height:40px;font-size:16px;padding:8px 11px;background:#03192b88;border-color:#94c8ed60;border-radius:7px}
 .screen-fit .mb-3{margin-bottom:14px}
 .screen-fit .login-button{height:40px;font-size:14px;margin-top:2px;border-radius:7px}
 .screen-fit .login-chart{inset:0;width:100%;height:100%;opacity:.055}
 .screen-fit .alert{font-size:11px;padding:5px 8px;margin-bottom:6px}
}.password-field{position:relative}.password-field .form-control{padding-right:48px!important}.password-toggle{position:absolute;right:1px;top:1px;bottom:1px;width:44px;background:transparent;border:0;color:#d4efff;display:grid;place-items:center;cursor:pointer;border-radius:6px;padding:8px}.password-toggle[hidden]{display:none}.password-toggle svg{width:24px;height:24px}.password-toggle:hover{background:#8ecbff22}.password-toggle:focus-visible{outline:2px solid #a9ddff;outline-offset:-3px}.password-toggle .eye-slash{display:none}.password-toggle[aria-pressed="true"] .eye-slash{display:block}
@media(min-width:701px){.screen-fit .form-control{font-size:24px;height:43px;letter-spacing:.01em;padding:6px 10px}.screen-fit .form-label{font-size:14px}.screen-fit .mb-3{margin-bottom:12px}.screen-fit h1{margin-bottom:12px}}
@media(max-width:700px){.login-card .form-control{font-size:18px}}