.login-card{width:min(480px,100%)}
.login-card>p{margin-bottom:27px}
.institution-brand{display:flex;align-items:center;gap:12px}
.institution-logo-shell{display:flex;align-items:center;justify-content:center;width:176px;height:57px;padding:7px 10px;border:1px solid #dfe9e7;border-radius:12px;background:#fff;box-shadow:0 9px 24px rgba(12,63,57,.1)}
.institution-logo-shell img{display:block;width:100%;height:100%;object-fit:contain}
.institution-logo-initial{display:grid;width:52px;height:52px;place-items:center;border:1px solid rgba(15,118,110,.12);border-radius:15px;background:linear-gradient(145deg,#159588,#0b7169);box-shadow:0 8px 20px rgba(15,118,110,.2);color:#fff;font-size:21px;font-weight:850}
.institution-brand-copy{display:grid;gap:2px}
.institution-brand-copy strong{font-size:14px;line-height:1.15}
.institution-brand-copy small{margin-top:2px;color:#71817f;font-size:10px;font-weight:700;letter-spacing:.3px}
.institution-brand-light{position:relative;z-index:2;color:#fff}
.institution-brand-light .institution-logo-shell{border-color:rgba(255,255,255,.38);box-shadow:0 10px 30px rgba(1,45,40,.2)}
.institution-brand-light .institution-brand-copy small{color:#b9e0db}
.institution-logo-shell:has(.institution-logo-initial){width:52px;height:52px;padding:0;border:0;background:transparent;box-shadow:none}
.institution-brand-light .institution-logo-initial{border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.12);box-shadow:0 10px 28px rgba(1,45,40,.22);backdrop-filter:blur(8px)}
.login-form-brand{display:flex;margin-bottom:30px}
.login-form-brand .institution-logo-shell:not(:has(.institution-logo-initial)){width:142px;height:52px}
.login-input{position:relative}
.login-input>i{position:absolute;left:13px;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:20px;height:20px;border-radius:6px;color:#0f766e;background:#e8f5f2;font-size:9px;font-style:normal;font-weight:900;z-index:1}
.login-card .login-input input,.auth-simple-card .login-input input{width:100%;padding-left:43px;padding-right:42px}
.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;border-radius:8px;color:#71817f;background:transparent;cursor:pointer}
.password-toggle:hover{color:#0f766e;background:#edf6f4}
.field-error{color:#ae4339!important;font-size:10px!important;font-weight:600}
.caps-lock-hint{color:#a46b12!important;font-size:9px!important}
.login-options{display:flex;align-items:center;justify-content:space-between;margin:8px 0 15px}
.login-options .check{margin:0}
.login-options>a{color:#0f766e;font-size:10px;font-weight:750}
.login-submit{height:48px;border-radius:12px;box-shadow:0 10px 22px rgba(15,118,110,.16)}
.registration-choice{display:grid;grid-template-columns:1fr;gap:9px;margin-top:18px}
.registration-choice>a{display:grid;grid-template-columns:36px 1fr auto;align-items:center;gap:11px;min-width:0;padding:13px 14px;border:1px solid #dfe9e7;border-radius:13px;background:#fbfdfc}
.registration-choice>a:hover{border-color:#a9d4cc;background:#f2faf8}
.registration-choice>a>span{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;color:#0f766e;background:#e5f5f1;font-size:18px;font-weight:700}
.registration-choice strong,.registration-choice small{display:block}
.registration-choice strong{font-size:11px}
.registration-choice small{margin-top:3px;color:#7a8987;font-size:9px;line-height:1.35}
.registration-choice b{color:#0f766e;font-size:12px}
.login-footer{margin-top:27px;padding-top:18px;border-top:1px solid #e6eeec;text-align:center}
.login-footer nav{display:flex;justify-content:center;gap:15px;color:#627471;font-size:9px}
.login-footer>small{display:block;margin-top:9px;color:#9aa6a4;font-size:8px}
.login-visual{padding:38px 5.6%;background:linear-gradient(145deg,#09665f 0%,#0f766e 48%,#178a7e 100%)}
.login-visual .institution-brand{position:relative;z-index:2}
.login-visual .visual-copy{max-width:610px}
.login-visual .visual-copy h1{font-size:clamp(42px,4.5vw,66px);line-height:1.02;letter-spacing:-2.7px}
.login-visual .visual-copy p{max-width:560px;font-size:15px;line-height:1.75}
.login-visual .pill{padding:7px 11px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.13)}
.login-form-wrap{position:relative;padding:42px;background:radial-gradient(circle at 100% 0,#edf8f5 0,transparent 34%),#fff}
.login-form-wrap:before{content:"";position:absolute;top:0;right:0;left:0;height:4px;background:linear-gradient(90deg,#0f766e,#4bc1ad)}
.login-card h2{margin-top:8px;font-size:34px;letter-spacing:-.7px}
.login-card form>label{gap:8px;color:#29413d;font-size:11px}
.login-card .login-input input{height:48px;border-color:#d7e4e1;border-radius:11px;background:#fff}
.login-card .login-input input:focus{border-color:#159588;box-shadow:0 0 0 3px rgba(21,149,136,.11)}
.login-card input:-webkit-autofill{-webkit-text-fill-color:#16302d;box-shadow:0 0 0 1000px #fff inset;transition:background-color 9999s ease-out}

.demo-account{display:grid;grid-template-columns:1fr 1fr;align-items:stretch;gap:9px;padding:14px}
.demo-heading,.demo-password{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px}
.demo-heading b{font-size:12px;color:var(--ink)}
.demo-heading span,.demo-password{color:var(--muted);font-size:10px}
.demo-account code{color:var(--green);font-weight:800}
.demo-login{display:grid;gap:3px;padding:10px;border:1px solid #dce9e6;border-radius:9px;background:#f5faf8;color:var(--ink);text-align:left;cursor:pointer}
.demo-login:hover,.demo-login:focus-visible{border-color:var(--green);background:#e9f6f3;outline:none}
.demo-login span{color:var(--green);font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.5px}
.demo-login strong{font-size:10px}.demo-login small{color:var(--muted);font-size:8px}.demo-password{justify-content:flex-start;padding-top:2px}

.auth-simple-page,.legal-page{min-height:100vh;display:grid;place-items:center;padding:28px;background:linear-gradient(145deg,#eaf6f3,#f8faf9)}
.auth-simple-card,.legal-card{width:min(440px,100%);padding:32px;border:1px solid #dfe9e7;border-radius:22px;background:#fff;box-shadow:0 20px 60px rgba(20,67,60,.11)}
.auth-simple-card>.brand,.legal-card>.brand,.auth-simple-card>.institution-brand,.legal-card>.institution-brand{margin-bottom:42px}
.register-shell>.institution-brand{width:max-content;margin-bottom:24px}
.auth-simple-icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:18px;border-radius:15px;color:#0f766e;background:#e3f5f1;font-size:22px;font-weight:800}
.auth-simple-card h1,.legal-card h1{margin:7px 0 8px;font-size:27px}
.auth-simple-card>p,.legal-card p{color:#687a77;font-size:12px;line-height:1.65}
.auth-simple-card form{display:grid;gap:15px;margin-top:22px}
.auth-simple-card label{display:grid;gap:7px;font-size:11px;font-weight:750}
.auth-simple-card .login-input input{height:43px;border:1px solid #dce5e3;border-radius:10px;outline:none}
.auth-simple-card .login-input input:focus{border-color:#0f766e;box-shadow:0 0 0 3px #e2f4f1}
.auth-back-link{display:block;margin-top:22px;color:#0f766e;font-size:10px;font-weight:750;text-align:center}
.legal-card{width:min(720px,100%)}
.legal-card h2{margin:25px 0 7px;font-size:16px}

@media(max-width:1100px){.login-card{width:min(450px,100%)}.login-form-wrap{padding:34px}.login-visual{padding-right:5%;padding-left:5%}}
@media(max-width:900px){.login-card{width:min(480px,100%)}.login-form-wrap{min-height:100vh;padding:34px 24px}.login-card h2{font-size:31px}}
@media(max-width:480px){
    .registration-choice{grid-template-columns:1fr}
    .demo-account{grid-template-columns:1fr}.demo-heading,.demo-password{grid-column:1}
    .auth-simple-card,.legal-card{padding:24px}
    .login-form-wrap{padding:28px 18px}
    .login-form-brand{align-items:center;margin-bottom:25px}
    .login-form-brand .institution-logo-shell:not(:has(.institution-logo-initial)){width:132px;height:48px;padding:6px 8px}
    .login-form-brand .institution-brand-copy strong{font-size:12px}
    .login-form-brand .institution-brand-copy small{font-size:9px}
    .institution-logo-shell:has(.institution-logo-initial),.institution-logo-initial{width:48px;height:48px}
}