.auth-shell,
.session-gate,
.service-gate {
  --text: #1d1d1f;
  --muted: #6e6e73;
  --line: #d2d2d7;
  --line-strong: #d2d2d7;
  --green: #0968df;
  --green-dark: #005bc6;
  --blue: #0066cc;
  color: var(--text);
  background: #fff;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-synthesis: none;
}

#auth-root { position: relative; display: block; isolation: isolate; padding: 0; }
.auth-cover-header { height: 92px; padding: 0 64px; display: flex; align-items: center; }
.auth-wordmark { color: #1d1d1f; font-size: 23px; font-weight: 600; line-height: 1; text-decoration: none; }
.auth-cover-layout { display: flex; flex-direction: column; align-items: center; min-height: calc(100dvh - 92px); padding: 39px 24px 36px; }
#auth-root .auth-brand { display: flex; flex-direction: column; align-items: center; width: min(620px, 100%); margin: 0; padding: 0; }
#auth-root .auth-brand h1 { margin: 0; font-size: 52px; font-weight: 600; line-height: 1.22; text-align: center; }
.auth-cover-art { display: block; width: 244px; height: 244px; max-width: 100%; aspect-ratio: 1; object-fit: contain; margin-top: 10px; transform: scale(.3333333); mix-blend-mode: multiply; }
.auth-cover-map { position: absolute; z-index: -1; top: var(--light-map-top, 105px); left: 50%; transform: translateX(-50%); width: min(1280px, calc(100% - 48px)); height: auto; opacity: .75; filter: blur(2.2px); mask-image: linear-gradient(to bottom, transparent, #000 10%, #000 76%, transparent); pointer-events: none; }
#auth-root .auth-panel { width: 320px; max-width: 100%; margin: 10px 0 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; }
#auth-root .auth-sr-only { position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#auth-root .field { margin: 0 0 18px; }
#auth-root .field > span:first-child { margin-bottom: 8px; color: #515156; font-size: 12px; font-weight: 400; }
#auth-root .field em { color: var(--muted); font-size: 11px; margin-left: 5px; }
#auth-root .field input,
#auth-root .field select,
#auth-root .field textarea { height: 48px; min-height: 48px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--text); font-size: 16px; padding: 11px 13px; }
#auth-root .field textarea { height: 80px; min-height: 80px; }
#auth-root .field input:focus,
#auth-root .field select:focus,
#auth-root .field textarea:focus { border-color: var(--green); box-shadow: 0 0 0 3px #dbeaff; }
#auth-root .field small { font-size: 12px; line-height: 1.5; }
#auth-root .field small:empty { display: none; }
#auth-root .password-field { display: block; position: relative; border: 0; overflow: visible; box-shadow: none; }
#auth-root .password-field input { padding-right: 48px; }
#auth-root .password-field button { position: absolute; top: 2px; right: 2px; display: grid; place-items: center; width: 44px; min-width: 44px; height: 44px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: #6e6e73; }
#auth-root .password-field button:hover { color: var(--text); }
#auth-root .password-field svg { width: 17px; height: 17px; stroke-width: 1.7; }
#auth-root .field-error input,
#auth-root .field-error select,
#auth-root .field-error textarea { border-color: #b42318; }
#auth-root .primary-button { height: 46px; margin: 0; border: 0; border-radius: 7px; font-size: 14px; font-weight: 400; }
#auth-root .primary-button:disabled { background: #537fe0; opacity: 1; cursor: wait; }
#auth-root .link-button { display: flex; align-items: center; justify-content: center; min-height: 44px; margin: 11px 0 0; font-size: 13px; }
#auth-root .link-button:hover { text-decoration: underline; }
#auth-root .auth-form header:not(.auth-sr-only) { margin-bottom: 24px; }
#auth-root .auth-form header span { color: var(--muted); font-size: 12px; font-weight: 400; margin-bottom: 7px; }
#auth-root .auth-form h2 { margin: 0; font-size: 23px; line-height: 1.4; font-weight: 600; }
#auth-root .field-note { font-size: 12px; line-height: 1.65; margin: -3px 0 20px; }
#auth-root .auth-notice,
#auth-root .form-error { margin: 0 0 18px; padding: 10px 12px; border: 0; border-radius: 6px; font-size: 13px; line-height: 1.65; overflow-wrap: anywhere; }
#auth-root .auth-notice { color: #225798; background: #edf4ff; }
#auth-root .form-error { color: #b42318; background: #fff1ef; }
.auth-shell :focus-visible { outline: 3px solid #8cbfff; outline-offset: 4px; }
.auth-shell:has(#login-form[hidden]) .auth-cover-art { width: 165px; height: 165px; }
.auth-shell:has(#login-form[hidden]) .auth-cover-layout { padding-top: 12px; }
.session-gate,
.service-gate { position: relative; overflow-y: auto; }
.auth-gate-wordmark,
.session-gate .auth-gate-wordmark { position: absolute; top: 34px; left: 64px; margin: 0; color: #1d1d1f; font-size: 23px; line-height: 1; font-weight: 600; }
.session-gate .loading-line { font-size: 14px; }
.service-gate h1 { font-size: 19px; }

@media (min-width: 761px) and (max-height: 780px) {
  .auth-cover-header { height: 70px; padding: 0 48px; }
  .auth-cover-layout { min-height: calc(100dvh - 70px); padding-top: 20px; padding-bottom: 24px; }
  #auth-root .auth-brand h1 { font-size: 48px; }
  .auth-cover-art { width: 212px; height: 212px; margin-top: 4px; }
  .auth-cover-map { width: min(1160px, calc(100% - 32px)); }
  .auth-gate-wordmark,
  .session-gate .auth-gate-wordmark { top: 23px; left: 48px; }
}
@media (max-width: 760px) {
  .auth-cover-header { height: 78px; padding: 0 28px; }
  .auth-wordmark { font-size: 22px; }
  .auth-cover-layout { min-height: calc(100dvh - 78px); padding: 49px 28px 32px; }
  #auth-root .auth-brand h1 { font-size: 38px; }
  .auth-cover-art { width: 216px; height: 216px; margin-top: 12px; }
  .auth-cover-map { width: calc(100% - 8px); filter: blur(1.1px); }
  #auth-root .auth-panel { width: 304px; margin-top: 12px; }
  .auth-shell:has(#login-form[hidden]) .auth-cover-art { width: 138px; height: 138px; }
  .auth-gate-wordmark,
  .session-gate .auth-gate-wordmark { top: 28px; left: 28px; font-size: 22px; }
}
@media (max-width: 760px) and (max-height: 680px) {
  .auth-cover-header { height: 60px; padding: 0 24px; }
  .auth-wordmark { font-size: 20px; }
  .auth-cover-layout { min-height: calc(100dvh - 60px); padding: 19px 24px 20px; }
  #auth-root .auth-brand h1 { font-size: 34px; }
  .auth-cover-art { width: 164px; height: 164px; margin-top: 3px; }
  #auth-root .auth-panel { margin-top: 4px; }
  #auth-root .field { margin-bottom: 14px; }
  #auth-root .field > span:first-child { margin-bottom: 6px; }
  #auth-root .field input,
  #auth-root .field select { height: 44px; min-height: 44px; }
  #auth-root .password-field button { top: 0; right: 0; }
  #auth-root .primary-button { height: 44px; }
  #auth-root .link-button { margin-top: 5px; }
  .auth-gate-wordmark,
  .session-gate .auth-gate-wordmark { top: 20px; left: 24px; font-size: 20px; }
}
