body.auth-locked { overflow: hidden; }
body.auth-locked #appShell { visibility: hidden; }
#authGate {
  padding: 40px 24px;
  overflow-y: auto;
  background: radial-gradient(ellipse at 12% 12%, #d6eae7 0, transparent 52%), #f1f5f4;
}
#authGate .login-layout {
  display: grid;
  grid-template-columns: .95fr 1fr;
  width: min(960px, 100%);
  min-width: 0;
  border: 1px solid #dce6e5;
  border-radius: 24px;
  overflow: hidden;
  background: white;
  box-shadow: 0 24px 80px #12304412;
}
#authGate .login-intro {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 44px 40px 32px;
  overflow: hidden;
  background: #123044;
  color: #fff;
}
#authGate .platform-brand-logo { width: 152px; margin-left: -5px; }
#authGate .login-intro-copy { margin-top: 50px; }
#authGate .login-kicker { margin: 0; font-size: 10px; font-weight: 700; line-height: 1.6; letter-spacing: .14em; }
#authGate .login-intro .login-kicker { color: #84c7c4; }
#authGate h1 { margin: 14px 0 18px; font-size: 34px; font-weight: 600; line-height: 1.5; letter-spacing: .02em; }
#authGate .login-intro-copy > p:last-child { color: #b8ced5; font-size: 13px; line-height: 1.9; }
#authGate .login-platform-name { margin-top: auto; padding-top: 110px; color: #b8ced5; font-size: 11px; letter-spacing: .08em; }
#authGate .login-signal { position: absolute; right: -84px; bottom: -70px; z-index: -1; width: 330px; height: 330px; border: 1px solid #54d7c724; border-radius: 50%; }
#authGate .login-signal::before, #authGate .login-signal::after, #authGate .login-signal span { content: ''; position: absolute; inset: 45px; border: 1px solid #54d7c72c; border-radius: 50%; }
#authGate .login-signal::after { inset: 90px; background: #54d7c70a; }
#authGate .login-signal span { inset: 135px; background: #54d7c718; }
#authGate .login-signal i { position: absolute; top: 157px; left: 157px; width: 14px; height: 14px; border-radius: 50%; background: #54d7c7; }
#authGate .login-card { width: 100%; padding: 60px 52px 32px; border: 0; border-radius: 0; background: white; box-shadow: none; }
#authGate .login-form-heading { margin-bottom: 32px; }
#authGate .login-form-heading .login-kicker { color: #64818a; }
#authGate h2 { margin: 10px 0 10px; color: #123044; font-size: 28px; letter-spacing: .02em; }
#authGate .login-form-heading .muted { margin: 0; color: #687f89; font-size: 13px; line-height: 1.8; }
#authGate label { margin: 22px 0 9px; color: #344f5c; font-size: 13px; font-weight: 600; }
#authGate .text-input { height: 48px; padding: 0 14px; border-color: #cedcde; border-radius: 10px; color: #123044; font-size: 15px; }
#authGate .text-input::placeholder { color: #8a9ba3; font-size: 13px; }
#authGate .text-input:focus { border-color: #0b8d81; box-shadow: 0 0 0 3px #12afa118; }
#authGate .login-password-field { position: relative; }
#authGate .login-password-field input { padding-right: 68px; }
#authGate .login-password-toggle { position: absolute; top: 2px; right: 3px; min-width: 56px; min-height: 44px; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; color: #32726e; font-size: 12px; font-weight: 600; }
#authGate .login-password-toggle:hover { background: #f0f7f6; }
#authGate button:focus-visible { outline: 3px solid #12afa160; outline-offset: 3px; }
#authGate .login-caps-lock { margin: 8px 0 0; color: #855b22; font-size: 12px; line-height: 1.6; }
#authGate .login-error { margin: 14px 0 0; color: #a23434; font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
#authGate .login-submit { min-height: 48px; margin-top: 28px; border-radius: 10px; background: #0b8178; border-color: #0b8178; font-size: 15px; letter-spacing: .08em; }
#authGate .login-submit:hover { background: #086c65; }
#authGate .login-submit:disabled { background: #658d88; border-color: #658d88; cursor: wait; }
#authGate .login-help { margin: 22px 0 0; color: #687f89; font-size: 12px; line-height: 1.9; }
#authGate .login-access-note { margin-top: 30px; padding-top: 18px; border-top: 1px solid #edf1f1; color: #7c8f97; font-size: 11px; }
@media (max-width: 720px) {
  #authGate { padding: 24px 16px; }
  #authGate .login-layout { width: min(460px, 100%); grid-template-columns: minmax(0, 1fr); border-radius: 20px; }
  #authGate .login-intro { padding: 22px 28px; }
  #authGate .platform-brand-logo { width: 110px; }
  #authGate .login-intro-copy, #authGate .login-signal { display: none; }
  #authGate .login-platform-name { margin: 4px 0 0; padding: 0; font-size: 11px; }
  #authGate .login-card { padding: 30px 28px 24px; }
  #authGate .login-form-heading { margin-bottom: 24px; }
  #authGate h2 { font-size: 25px; }
  #authGate label { margin-top: 18px; }
  #authGate .login-access-note { margin-top: 24px; }
}
@media (max-height: 740px) and (min-width: 721px) {
  #authGate { padding: 24px; }
  #authGate .login-intro-copy { margin-top: 28px; }
  #authGate .login-platform-name { padding-top: 60px; }
  #authGate .login-card { padding-top: 36px; }
}
@media (max-height: 660px) {
  #authGate { align-items: start; }
}