@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@700;800&family=Lato:wght@300;400;700&display=swap');
#ii-login *{box-sizing:border-box;}
#ii-login{font-family:'Lato','Helvetica Neue',Arial,sans-serif;font-weight:400;font-size:15px;line-height:1.55;color:#404041;-webkit-font-smoothing:antialiased;background:#F6F5F7;min-height:100vh;display:flex;flex-direction:column;}
#ii-login a{color:#664787;text-decoration:none;}
#ii-login a:hover{color:#4E3568;text-decoration:underline;}
#ii-login h1,#ii-login h3{font-family:'Montserrat','Helvetica Neue',Arial,sans-serif;color:#404041;margin:0;}
#ii-login h1{font-weight:700;font-size:30px;line-height:1.2;letter-spacing:-0.01em;}
#ii-login h3{font-weight:700;font-size:16px;line-height:1.3;}
#ii-login p{margin:0;}
#ii-login .ii-shell{display:flex;flex-grow:1;flex-wrap:wrap;}
#ii-login .ii-brand{flex:1 1 480px;background:#FCF3EE;border-right:1px solid #F7DFD2;padding:56px;display:flex;flex-direction:column;}
#ii-login .ii-formwrap{flex:1 1 480px;display:flex;align-items:center;justify-content:center;padding:56px;}
#ii-login .ii-form{width:100%;max-width:420px;display:flex;flex-direction:column;gap:22px;}
#ii-login .ii-logo{height:52px;width:auto;display:block;}
#ii-login .ii-by{padding-left:52px;font-weight:400;font-size:9.5px;letter-spacing:0.17em;text-transform:uppercase;color:#1C1411;line-height:1;margin-top:5px;}
#ii-login .ii-brand h1{margin-top:64px;font-size:38px;font-weight:800;max-width:450px;}
#ii-login .ii-lead{margin-top:20px;font-size:17px;color:#1C1411;max-width:420px;}
#ii-login .ii-feats{display:flex;flex-direction:column;gap:26px;margin-top:52px;max-width:430px;}
#ii-login .ii-feat{display:flex;gap:16px;align-items:flex-start;}
#ii-login .ii-feat svg{width:24px;height:24px;flex:0 0 auto;}
#ii-login .ii-feat p{color:#1C1411;font-size:14.5px;}
#ii-login .ii-brand-foot{margin-top:auto;padding-top:40px;font-size:13px;color:#1C1411;}
#ii-login .label{display:block;font-weight:700;font-size:13px;letter-spacing:0.06em;text-transform:uppercase;color:#404041;margin-bottom:7px;}
#ii-login input[type=text],#ii-login input[type=email],#ii-login input[type=password]{height:48px;width:100%;border:1px solid #CDC8D1;border-radius:5px;background:#FFFFFF;padding:0 14px;font-size:15px;color:#404041;font-family:inherit;}
#ii-login input:focus{outline:none;border-color:#664787;box-shadow:0 0 0 2px rgba(102,71,135,.15);}
#ii-login .ii-row{display:flex;align-items:center;}
#ii-login .ii-between{justify-content:space-between;align-items:baseline;}
#ii-login .ii-remember{gap:10px;font-size:14px;}
#ii-login .ii-btn{height:50px;width:100%;border:none;border-radius:5px;background:#664787;color:#FFFFFF;font-family:'Montserrat',Arial,sans-serif;font-weight:700;font-size:15px;cursor:pointer;}
#ii-login .ii-btn:hover{background:#573a76;}
#ii-login .note{background:#FCF3EE;border:1px solid #F7DFD2;border-radius:6px;padding:16px 18px;font-size:14px;margin-top:6px;}
#ii-login .note .ii-row{gap:10px;align-items:flex-start;}
#ii-login .note svg{width:18px;height:18px;flex-shrink:0;}
#ii-login footer{background:#FFFFFF;border-top:1px solid #CDC8D1;flex-shrink:0;}
#ii-login .pillar-bar{display:flex;height:6px;}
#ii-login .pillar-bar div{flex-grow:1;}
#ii-login .footer-inner{display:flex;align-items:center;justify-content:space-between;padding:20px 56px;font-size:13px;color:#1C1411;flex-wrap:wrap;gap:12px;}
#ii-login .footer-links{display:flex;gap:20px;flex-wrap:wrap;}
@media(max-width:820px){#ii-login .ii-brand{border-right:none;border-bottom:1px solid #F7DFD2;}}

/* ============================================================================
   DARK MODE — #ii-login uses hardcoded hex; its id isn't in the foundation's
   flip list. Real <input> fields are handled by the foundation; override the
   rest of the light surfaces here.
   ============================================================================ */
.ii-dark #ii-login{ background:#14100D; color:#E9E3DB; }
.ii-dark #ii-login a{ color:#A488CC; }
.ii-dark #ii-login a:hover{ color:#C3B0E0; }
.ii-dark #ii-login h1,
.ii-dark #ii-login h3,
.ii-dark #ii-login .label{ color:#E9E3DB; }
.ii-dark #ii-login .ii-brand{ background:#211B15; border-color:#332D26; }
.ii-dark #ii-login .ii-lead,
.ii-dark #ii-login .ii-by,
.ii-dark #ii-login .ii-feat p,
.ii-dark #ii-login .ii-brand-foot,
.ii-dark #ii-login .footer-inner{ color:#A69D93; }
.ii-dark #ii-login .note{ background:#2A211A; border-color:#33261A; }
.ii-dark #ii-login footer{ background:#211B15; border-color:#332D26; }

/* ---- mobile ---- */
@media (max-width:820px){
  #ii-login .ii-brand,#ii-login .ii-formwrap{ padding:36px 24px; }
  #ii-login .ii-brand h1{ font-size:30px; margin-top:32px; }
}
@media (max-width:520px){
  #ii-login .ii-brand,#ii-login .ii-formwrap{ padding:26px 18px; }
  #ii-login .footer-inner{ padding:16px 20px; }
}