.login-cat{display:flex;align-items:center;justify-content:center;min-width:0;pointer-events:none;user-select:none}
.login-cat[hidden],.login-view.mfa-active .login-cat{display:none!important}
.login-cat-canvas{display:block;width:240px;max-width:100%;height:auto;filter:drop-shadow(0 12px 10px #27354a15)}
.login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-layout{width:min(1380px,100%);max-width:1380px;grid-template-columns:minmax(0,1fr) 240px 410px;gap:30px}
.login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero{display:block;min-width:0;max-width:none}
.login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero h1{font-size:clamp(36px,3.4vw,50px)}
.login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-brand{left:32px}
@media(min-width:901px) and (max-width:1199px){
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-layout{grid-template-columns:minmax(0,1fr) 410px;column-gap:38px;row-gap:12px;align-content:center}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero{grid-column:1;grid-row:1}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-card{grid-column:2;grid-row:1/span 2}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero h1{font-size:36px}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero p{font-size:14px}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-highlights{margin-top:18px}
  .login-cat{grid-column:1;grid-row:2}.login-cat-canvas{width:150px}
}
@media(max-width:900px){
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-layout{grid-template-columns:minmax(0,1fr);max-width:520px;gap:14px;padding-top:105px;padding-bottom:32px}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-card{grid-column:1;grid-row:2;width:100%;margin:0 auto}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero{grid-column:1;grid-row:3;margin:18px 0 0}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero h1{font-size:30px}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-hero p{font-size:14px}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-highlights{display:grid;margin-top:20px}
  .login-view:not(.mfa-active):has(.login-cat:not([hidden])) .login-brand{top:18px;left:18px}
  .login-cat{grid-column:1;grid-row:1}.login-cat-canvas{width:96px}
}
