/* The canvas draws the entire landscape over a pale blue base. */
html:has(#enterpriseAuth.auth-landing:not([hidden])),
body:has(> #enterpriseAuth.auth-landing:not([hidden])) {
  height: 100dvh;
  min-height: 0;
  max-height: 100dvh;
  overflow: hidden;
  scrollbar-gutter: auto;
  overscroll-behavior: none;
}
body:has(> #enterpriseAuth.auth-landing:not([hidden])) { position: fixed; inset: 0; width: 100%; }
#enterpriseAuth.auth-landing {
  --auth-panel-right: clamp(42px, 8vw, 164px);
  --en-ink: #163e64;
  --en-muted: #58768f;
  --en-line: #639dca33;
  --en-highlight: #ffffffb8;
  --en-danger: #b54155;
  --en-success: #237556;
  --en-warning: #966011;
  --blue-100: #d9edfc;
  --blue-300: #9ad1fa;
  --blue-500: #218fe3;
  --blue-600: #0878d7;
  --blue-700: #0a61b8;
  --blue-800: #315d83;
  --blue-900: #163e64;
  --focus-ring: #167fdc52;
  --glass-line: #ffffffc7;
  --glass-edge: #639dca33;
  --ice-strong: #f4fbffcf;
  --surface-control: #edf9ff80;
  --surface-primary: #e6f5ffcc;
  --surface-tint: #b6def83d;
  --accent-color: #0a71c8;
  --accent-ink: #fff;
  --accent-shadow: #005ab126;
  display: block;
  padding: 0;
  overflow: hidden;
  isolation: isolate;
  color: var(--en-ink);
  background: #e5f3fd;
  color-scheme: light;
  -webkit-tap-highlight-color: transparent;
}
#enterpriseAuth.auth-landing *, #enterpriseAuth.auth-landing *::before, #enterpriseAuth.auth-landing *::after { box-sizing: border-box; }
#authParticleCanvas { position: absolute; z-index: 1; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
#authLeavesCanvas { position: fixed; inset: 0; display: block; width: 100%; height: 100%; pointer-events: none; }
#authLeavesCanvas { z-index: 5; }
.auth-landing-header { position: absolute; z-index: 7; inset: max(28px, env(safe-area-inset-top)) 42px auto; display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.auth-landing-brand { display: flex; align-items: center; gap: 13px; color: #315f85; user-select: none; }
#enterpriseAuth .auth-landing-brand > svg { width: 31px; height: 38px; }
.auth-landing-brand strong { display: block; font-family: "Songti SC", "STSong", "SimSun", serif; font-size: 17px; font-weight: 400; letter-spacing: .21em; }
.auth-landing-brand small { display: block; margin-top: 4px; color: #63829a; font-size: 8px; letter-spacing: .27em; }
.auth-landing-tools { display: flex; align-items: center; gap: 15px; }
#enterpriseAuth .auth-landing-icon { display: grid; place-items: center; width: 40px; min-width: 40px; height: 40px; padding: 0; border: 1px solid #ffffffa6; border-radius: 50%; color: #487297; background: #f4fbff73; cursor: var(--site-cursor-pointer, pointer); transition: color 180ms ease, border-color 180ms ease, background 180ms ease; }
#enterpriseAuth .auth-landing-icon svg { width: 17px; height: 17px; }
#enterpriseAuth .auth-landing-icon:hover:not(:disabled) { color: #0a61b8; border-color: #80b9df80; background: #f4fbffb3; }
#enterpriseAuth .auth-landing-icon:disabled { opacity: .4; cursor: wait; }
#authLandingOpen { display: flex; align-items: center; justify-content: center; gap: 19px; min-height: 42px; min-width: 107px; padding: 10px 18px; border: 1px solid #ffffffbf; border-radius: 24px; color: #145f9d; background: #edf8ffc2; font: inherit; font-size: 12px; letter-spacing: .14em; cursor: var(--site-cursor-pointer, pointer); box-shadow: 0 4px 15px #367cb015, inset 0 1px 0 #fff; backdrop-filter: blur(12px); transition: border-color 180ms ease, background 180ms ease; }
#authLandingOpen:hover { border-color: #86bee6; background: #f5fbffeb; }
#enterpriseAuth :is(.auth-landing-icon, #authLandingOpen):focus-visible { outline: 2px solid #218fe3; outline-offset: 4px; }
#enterpriseAuth #authLandingOpen svg { width: 17px; height: 17px; }
/* These bounds describe the final composition and never follow panel transforms. */
#authTreeRegion { position: absolute; inset: 102px calc(var(--auth-panel-right) + 448px) 104px 36px; pointer-events: none; }
.auth-landing-copy { position: absolute; z-index: 2; left: 46px; bottom: 112px; max-width: calc(100% - 90px); pointer-events: none; transition: opacity 500ms ease, transform 650ms cubic-bezier(.22, 1, .36, 1); }
.auth-landing-copy > span { display: block; margin-bottom: 15px; color: #5c86a0; font-size: 10px; letter-spacing: .26em; }
.auth-landing-copy > span::before { display: inline-block; width: 22px; height: 1px; margin-right: 12px; background: #82aebe; vertical-align: middle; content: ""; }
#enterpriseAuth .auth-landing-copy h1 { margin-bottom: 16px; color: #315a78; font-family: "Songti SC", "STSong", "SimSun", serif; font-size: clamp(36px, 4.3vw, 62px); font-weight: 400; line-height: 1.3; letter-spacing: .17em; text-shadow: 0 2px 22px #ffffffb8; }
.auth-landing-copy p { color: #587b8c; font-size: 12px; line-height: 1.9; letter-spacing: .16em; }
#enterpriseAuth[data-auth-expanded="true"] .auth-landing-copy { opacity: 0; transform: translateY(15px); }
.auth-landing-footer { position: absolute; z-index: 2; left: 44px; right: 44px; bottom: max(28px, env(safe-area-inset-bottom)); display: flex; gap: 16px; align-items: center; color: #547963; font-size: 10px; letter-spacing: .12em; pointer-events: none; }
.auth-landing-footer > i { height: 1px; flex: 1; background: linear-gradient(90deg, #7ba7994d, #7ba79908); }
#authLandingPanel { position: absolute; z-index: 3; right: var(--auth-panel-right); top: 100px; bottom: auto; width: 420px; max-height: calc(100dvh - 175px); padding: 0; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #639dca47 transparent; border: 1px solid #ffffffc7; border-radius: 28px; background: linear-gradient(135deg, #f4fbffe6, #e8f5ffb8); box-shadow: 0 25px 65px #306b9a1c, inset 0 1px 0 #ffffffed; backdrop-filter: blur(26px); -webkit-backdrop-filter: blur(26px); opacity: 0; visibility: hidden; pointer-events: none; transform: translateX(38px); transition: transform 650ms cubic-bezier(.22, 1, .36, 1), opacity 450ms ease, visibility 650ms; }
#enterpriseAuth[data-auth-expanded="true"] #authLandingPanel { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(0); }
#enterpriseAuth #authLandingClose { position: sticky; z-index: 3; top: 12px; margin: 12px 12px -40px auto; width: 40px; min-width: 40px; height: 40px; border-color: transparent; background: #e9f5fc; }
#enterpriseAuth #authLandingFormSlot { min-width: 0; }
#enterpriseAuth #authLandingSessionStatus { position: relative; margin: 60px 30px -40px; color: #527b9a; font-size: 12px; }
#enterpriseAuth[data-session-pending="true"] #authLandingFormSlot { opacity: .45; }
#enterpriseAuth.auth-landing .en-auth-card { padding: 64px 30px 28px; border: 0; border-radius: 0; background: none; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
#enterpriseAuth.auth-landing .en-auth-card::before { display: none; }
#enterpriseAuth.auth-landing .en-auth-tabs { margin-bottom: 25px; padding: 4px; border-radius: 14px; }
#enterpriseAuth.auth-landing .en-auth-tabs button { font-weight: 500; }
#enterpriseAuth.auth-landing .en-auth-tabs button.active { background: #f7fcff; color: #0a61b8; border-color: #ffffffd9; }
#enterpriseAuth.auth-landing .en-auth-card h2 { font-size: 25px; font-weight: 560; letter-spacing: .015em; }
#enterpriseAuth.auth-landing .en-auth-card .en-form { gap: 16px; margin-top: 27px; }
#enterpriseAuth.auth-landing .en-field > span { color: #315d83; font-weight: 500; }
#enterpriseAuth.auth-landing .en-input { min-height: 48px; border-color: #639dca33; background: #f9fdffb3; box-shadow: inset 0 1px 2px #4a83a608; }
#enterpriseAuth.auth-landing .en-input::placeholder { color: #62809a; opacity: .8; }
#enterpriseAuth.auth-landing .en-input:focus { border-color: #218fe38c; box-shadow: 0 0 0 3px #218fe312; }
#enterpriseAuth.auth-landing .en-input[aria-invalid="true"] { border-color: var(--en-danger); }
#enterpriseAuth.auth-landing .en-input:-webkit-autofill { -webkit-text-fill-color: #163e64; box-shadow: inset 0 0 0 1000px #edf8ff; caret-color: #163e64; }
#enterpriseAuth.auth-landing .en-button { font-weight: 550; }
#enterpriseAuth.auth-landing .en-button.primary { color: #fff; border-color: #187ec9; background: linear-gradient(110deg, #268edb, #0a6ec4); box-shadow: 0 7px 24px #167dcc26, inset 0 1px 0 #fff4; }
#enterpriseAuth.auth-landing .en-button.primary:hover:not(:disabled) { background: linear-gradient(110deg, #2184d0, #0864b4); }
#enterpriseAuth.auth-landing .en-password-control > .en-password-toggle { color: #426f96; }
#enterpriseAuth.auth-landing .en-password-control > .en-password-toggle:hover:not(:disabled) { background: #d9edfc; }
#enterpriseAuth.auth-landing .en-password-control > .en-password-toggle:focus-visible { outline-color: #218fe3; background: #d9edfc; }
#enterpriseAuth.auth-landing .en-auth-foot { color: #628199; }
@media (min-width: 1000px) and (min-height: 820px) {
  #authLandingPanel { top: 50%; bottom: auto; max-height: calc(100dvh - 190px); transform: translate(38px, -50%); }
  #enterpriseAuth[data-auth-expanded="true"] #authLandingPanel { transform: translate(0, -50%); }
}
@media (min-width: 761px) and (max-width: 999px) {
  .auth-landing-header { left: 28px; right: 28px; }
  #authLandingPanel { right: 24px; width: 390px; }
  #authTreeRegion { left: 10px; right: 428px; bottom: 95px; }
  .auth-landing-copy { left: 32px; }
}
@media (max-width: 760px) {
  .auth-landing-header { inset: max(18px, env(safe-area-inset-top)) 20px auto; gap: 10px; }
  .auth-landing-brand { gap: 9px; }
  #enterpriseAuth .auth-landing-brand > svg { width: 27px; height: 34px; }
  .auth-landing-brand strong { font-size: 15px; }
  .auth-landing-brand small { font-size: 7px; }
  .auth-landing-tools { gap: 9px; }
  #authLandingOpen { min-width: 84px; min-height: 44px; padding: 9px 14px; gap: 10px; }
  #enterpriseAuth .auth-landing-tools .auth-landing-icon { width: 40px; min-width: 40px; height: 40px; }
  #authTreeRegion { inset: 72px 24px auto; height: clamp(110px, 24dvh, 225px); }
  #authLandingPanel { top: calc(72px + clamp(110px, 24dvh, 225px)); bottom: auto; max-height: calc(100dvh - 72px - clamp(110px, 24dvh, 225px) - max(16px, env(safe-area-inset-bottom))); right: max(14px, calc((100% - 440px) / 2)); left: max(14px, calc((100% - 440px) / 2)); width: auto; border-radius: 24px; transform: translateY(28px); }
  #enterpriseAuth[data-auth-expanded="true"] #authLandingPanel { transform: translateY(0); }
  #enterpriseAuth.auth-landing .en-auth-card { padding: 56px 24px 23px; }
  #enterpriseAuth.auth-landing .en-auth-card h2 { font-size: 23px; }
  #enterpriseAuth.auth-landing .en-auth-tabs { margin-bottom: 20px; }
  #enterpriseAuth.auth-landing .en-auth-card .en-form { margin-top: 22px; }
  #enterpriseAuth #authLandingClose { top: 9px; margin: 9px 9px -40px auto; }
  .auth-landing-copy { left: 26px; bottom: 108px; max-width: calc(100% - 52px); }
  #enterpriseAuth .auth-landing-copy h1 { font-size: 42px; }
  .auth-landing-copy p { font-size: 11px; }
  .auth-landing-footer { left: 24px; right: 24px; bottom: max(27px, env(safe-area-inset-bottom)); gap: 12px; font-size: 9px; transition: opacity 250ms; }
  #enterpriseAuth[data-auth-expanded="true"] .auth-landing-footer { opacity: 0; }
}
@media (max-width: 380px) {
  .auth-landing-header { left: 16px; right: 16px; }
  .auth-landing-brand strong { font-size: 13px; }
  .auth-landing-tools { gap: 6px; }
  #authLandingOpen { min-width: 76px; gap: 7px; }
  #enterpriseAuth.auth-landing .en-auth-card { padding-inline: 19px; }
  #enterpriseAuth.auth-landing .en-registration-code { grid-template-columns: minmax(0, 1fr) 72px; gap: 6px; }
  #enterpriseAuth.auth-landing .en-otp { gap: 3px; }
}
@media (max-height: 540px) {
  .auth-landing-header { top: max(12px, env(safe-area-inset-top)); }
  #authTreeRegion { top: 70px; bottom: 55px; }
  #authLandingPanel { top: 68px; max-height: calc(100dvh - 82px); }
  .auth-landing-footer { bottom: 18px; }
  .auth-landing-copy { bottom: 78px; }
}
@media (max-width: 760px) and (max-height: 540px) {
  #authTreeRegion { top: 65px; height: 70px; bottom: auto; }
  #authLandingPanel { top: 135px; max-height: calc(100dvh - 149px); }
}
@media (prefers-reduced-motion: reduce) {
  #authLandingPanel, .auth-landing-copy, .auth-landing-footer { transition: none; }
}

/* Registration follows the same panel width and tree bounds as login. */
#enterpriseAuth.auth-landing .en-auth-registration { padding: 18px 24px 12px; }
#enterpriseAuth.auth-landing .en-auth-registration > h2 { padding-right: 38px; }
#enterpriseAuth.auth-landing .en-auth-registration .en-auth-tabs { margin: 8px 0 0; }
#enterpriseAuth.auth-landing .en-auth-registration .en-form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 12px; margin-top: 8px; }
#enterpriseAuth.auth-landing .en-auth-registration .en-form > * { min-width: 0; grid-column: 1 / -1; margin: 0; }
#enterpriseAuth.auth-landing .en-auth-registration .en-field { gap: 3px; }
#enterpriseAuth.auth-landing .en-auth-registration #authPasswordFeedback { margin: 0; }
#enterpriseAuth.auth-landing .en-auth-registration #authCodeDelivery { padding: 5px 10px; }
#enterpriseAuth.auth-landing .en-auth-registration #authFeedback { min-height: 20px; }
#enterpriseAuth.auth-landing .en-auth-registration .en-form > .en-button { grid-column: auto; min-height: 40px; margin: 0; padding-block: 8px; }
#enterpriseAuth.auth-landing .en-auth-registration .en-input { min-height: 40px; padding-block: 9px; }
#enterpriseAuth.auth-landing .en-auth-registration .en-registration-code :is(.en-otp, .en-otp-digit, .en-otp-result),
#enterpriseAuth.auth-landing .en-auth-registration .en-registration-code > .en-button { height: 44px; min-height: 44px; }
#enterpriseAuth.auth-landing .en-auth-registration .en-otp-digit { padding: 0; }
#enterpriseAuth.auth-landing .en-auth-registration .en-auth-foot { margin-top: 7px !important; padding-top: 5px; }
@media (min-width: 761px) {
  #enterpriseAuth.auth-landing .en-auth-registration { padding-bottom: 6px; }
  #enterpriseAuth.auth-landing:has(.en-auth-registration) #authLandingPanel {
    top: max(76px, calc((100dvh - 700px) / 2)); bottom: auto; max-height: min(700px, calc(100dvh - max(76px, calc((100dvh - 700px) / 2)) - 16px)); transform: translateX(38px);
  }
  #enterpriseAuth.auth-landing[data-auth-expanded="true"]:has(.en-auth-registration) #authLandingPanel { transform: translateX(0); }
}
@media (max-width: 760px) {
  #enterpriseAuth.auth-landing .en-auth-registration { padding: 18px 24px 14px; }
  #enterpriseAuth.auth-landing .en-auth-registration .en-form { gap: 8px 10px; }
  #enterpriseAuth.auth-landing .en-auth-registration .en-input { min-height: 44px; }
  #enterpriseAuth.auth-landing .en-auth-registration .en-form > .en-button { min-height: 44px; }
}
@media (max-width: 380px) {
  #enterpriseAuth.auth-landing .en-auth-registration { padding-inline: 19px; }
}