:root{--login-navy:#0a2239;--login-blue:#126bea;--login-text:#0d1728;--login-muted:#6d7786;--login-line:#d7dee8}
*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;color:var(--login-text);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;background:#f5f8fc}
.login-shell{min-height:100vh;display:grid;grid-template-columns:35% 65%}
.login-introduction{position:relative;overflow:hidden;display:flex;align-items:center;padding:70px 54px;color:#fff;background:linear-gradient(150deg,#0c2945 0%,#071b2f 100%)}
.login-introduction::before{content:"";position:absolute;inset:35% -12% -9% -18%;opacity:.23;background:linear-gradient(160deg,transparent 0 17%,#2f4a5e 17% 19%,transparent 19% 30%,#284155 30% 32%,transparent 32%),repeating-linear-gradient(90deg,transparent 0 64px,#8fa1af20 64px 68px),linear-gradient(180deg,transparent 0 20%,#18354a 20% 23%,transparent 23% 68%,#19364b 68% 71%,transparent 71%);transform:perspective(650px) rotateX(12deg) skewY(-5deg)}
.login-introduction::after{content:"";position:absolute;inset:auto 0 0;height:50%;background:linear-gradient(180deg,transparent,#071a2ddb)}
.login-introduction-content{position:relative;z-index:1;width:100%;max-width:360px;margin:auto}
.login-brand{display:flex;align-items:center;gap:18px;padding-bottom:38px;border-bottom:1px solid #ffffff30}
.login-brand>i{font-size:64px;line-height:1}
.login-brand>img{width:76px;height:66px;padding:4px;border-radius:9px;background:#fff;object-fit:contain}
.login-brand strong,.login-brand small{display:block}
.login-brand strong{font-size:31px;line-height:1.05}
.login-brand small{margin-top:7px;color:#d5e0e9;font-size:16px}
.login-introduction-copy{padding-top:38px}
.login-introduction-copy h2{margin:0 0 28px;font-size:18px;font-weight:700}
.login-introduction-copy ul{display:grid;gap:25px;margin:0;padding:0;list-style:none}
.login-introduction-copy li{display:flex;align-items:center;gap:18px;font-size:16px}
.login-introduction-copy li i{width:30px;color:#2c82fa;font-size:27px;text-align:center}
.login-workspace{display:grid;place-items:center;min-width:0;padding:54px;background:radial-gradient(circle at 50% 28%,#fff 0,#f6f8fc 47%,#eef3f9 100%)}
.login-card{width:min(100%,626px);min-height:780px;padding:55px 44px 34px;border:1px solid #e2e7ee;border-radius:15px;background:#fff;box-shadow:0 14px 42px #26445f18}
.login-card>header{text-align:center}
.login-card-logo{width:90px;height:90px;display:grid;place-items:center;margin:0 auto 17px;border-radius:50%;background:var(--login-navy);color:#fff}
.login-card-logo i{font-size:47px}
.login-card-logo img{width:70px;height:70px;border-radius:50%;background:#fff;object-fit:contain}
.login-card h1{margin:0;font-size:35px;font-weight:750;letter-spacing:-.6px}
.login-card header p{margin:10px 0 30px;color:var(--login-muted);font-size:16px}
.login-alert{display:flex;align-items:center;gap:9px;margin:0 0 18px;padding:11px 13px;font-size:13px}
.login-form{display:grid;gap:25px}
.login-storage-form{gap:18px}
.login-account-summary{display:flex;align-items:center;gap:12px;padding:13px 15px;border:1px solid #e0e6ed;border-radius:7px;background:#f8fafc}.login-account-summary>i{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:#e6f0ff;color:#0872ef;font-size:18px}.login-account-summary b,.login-account-summary small{display:block}.login-account-summary b{font-size:14px}.login-account-summary small{margin-top:2px;color:var(--login-muted);font-size:12px}.login-select-field select{width:100%;height:50px;padding:0 38px 0 46px;border:0;outline:0;background:transparent;color:#182334;font-size:15px;appearance:none}.login-select-field>i:last-child{right:16px;left:auto;pointer-events:none}.login-secondary-action{margin-top:14px;text-align:center}.login-secondary-action button{padding:5px;border:0;background:transparent;color:#0b63ce;font-size:13px}
.login-form>label>span{display:block;margin-bottom:9px;font-size:15px;font-weight:650}
.login-field{height:52px;display:flex;align-items:center;gap:13px;padding:0 14px;border:1px solid var(--login-line);border-radius:6px;background:#fff;transition:border-color .16s,box-shadow .16s}
.login-field:focus-within{border-color:#6aa9f8;box-shadow:0 0 0 3px #1474ed16}
.login-field>i{color:#7b8796;font-size:20px}
.login-field input{min-width:0;flex:1;border:0;outline:0;color:var(--login-text);font:inherit;font-size:15px}
.login-field input::placeholder{color:#9aa3af}
.login-password-toggle{width:34px;height:34px;padding:0;border:0;background:transparent;color:#718092;font-size:19px}
.login-options{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:-3px;font-size:14px}
.login-options label{display:flex;align-items:center;gap:8px}
.login-options .form-check-input{width:18px;height:18px;margin:0;border-color:#abb6c4}
.login-options a{color:#075ec9;text-decoration:none}
.login-submit{height:53px;display:flex;align-items:center;justify-content:center;gap:11px;border:0;border-radius:6px;background:linear-gradient(100deg,#1668e8,#226de9);color:#fff;font-size:16px;font-weight:700;box-shadow:0 7px 16px #176ce526}
.login-submit:hover{background:linear-gradient(100deg,#0f5fdc,#1764de)}
.login-card footer{margin-top:44px;padding-top:20px;border-top:1px solid #e7ebf0;color:#667386;text-align:center}
.login-card footer p{margin:0;font-size:12px}
.login-card footer p+p{margin-top:9px}
@media(max-width:900px){.login-shell{grid-template-columns:1fr}.login-introduction{display:none}.login-workspace{padding:28px}.login-card{min-height:0;padding:38px 30px 28px}}
@media(max-width:520px){.login-workspace{padding:14px}.login-card{padding:30px 20px 24px}.login-card-logo{width:72px;height:72px}.login-card-logo i{font-size:38px}.login-card h1{font-size:28px}.login-options{align-items:flex-start;flex-direction:column}.login-card footer{margin-top:32px}}
