/* Strictly auth-route scoped. The ERP application theme is not changed. */
html[data-vy-auth] {
  --va-page: #ffffff; --va-card: #ffffff; --va-input: #ffffff;
  --va-border: #d9dbe3; --va-text: #20222b; --va-muted: #656979;
  --va-primary: #7042c7; --va-hover: #6034b2; --va-soft: #f2edfa;
  --va-error: #c32e40; --va-success: #168149; --va-ring: #7042c72e;
  --va-shadow: 0 10px 32px #20223808; color-scheme: light;
}
html[data-vy-auth][data-vy-theme="dark"] {
  --va-page: #0b0f19; --va-card: #181a20; --va-input: #14161c;
  --va-border: #343746; --va-text: #f5f6fa; --va-muted: #a4a7b4;
  --va-primary: #8854e8; --va-hover: #9869ef; --va-soft: #252032;
  --va-error: #fb8390; --va-success: #4ade80; --va-ring: #a680ef38;
  --va-shadow: 0 14px 48px #00000020; color-scheme: dark;
}
html[data-vy-auth] body {
  height: auto !important; min-height: 100svh; background: var(--va-page) !important;
  color: var(--va-text) !important; -webkit-font-smoothing: antialiased;
}
html[data-vy-auth] body:has(> .card) { display: flex; align-items: center; justify-content: center; padding: 112px 20px 48px; box-sizing: border-box; }
/* 2026-10-19：Floating Paths 深色适配（scoped CSS 的 :global 会被编译丢弃，统一放全局） */
html.dark .auth-fallback,
html[data-vy-theme="dark"] .auth-fallback { background: #0b0f19 !important; }
html.dark .vy-floating-paths,
html[data-vy-theme="dark"] .vy-floating-paths { color: #ffffff !important; }
/* 2026-10-19：BundUI Floating Paths 背景层（登录/注册） */
html[data-vy-auth] .vooyyy-login-layout .auth-paths,
html[data-vy-auth] .auth-fallback .auth-paths { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
html[data-vy-auth] .vooyyy-login-layout .login-panel { position: relative; z-index: 1; }
html[data-vy-auth] .vooyyy-login-layout,
html[data-vy-auth] .auth-shell {
  display: flex !important; flex-direction: column !important; align-items: center !important;
  justify-content: center !important; width: 100%; min-height: 100svh; height: auto !important;
  padding: 112px 20px 48px !important; background: var(--va-page) !important;
  color: var(--va-text) !important; overflow: visible !important; box-sizing: border-box;
}
html[data-vy-auth] .brand-panel,
html[data-vy-auth] .corner-brand,
html[data-vy-auth] .auth-brand,
html[data-vy-auth] .login-background,
html[data-vy-auth] .login-logo,
html[data-vy-auth] .card .brand,
html[data-vy-auth] .vy-lgn2-l,
html[data-vy-auth] .vy-lgn2-copy,
html[data-vy-auth] #themeBtn,
html[data-vy-auth] .theme-toggle { display: none !important; }
html[data-vy-auth] .login-panel { display: block !important; padding: 0 !important; width: 440px !important; max-width: 100%; min-height: 0 !important; background: none !important; }
html[data-vy-auth] :is(.card,.login-card,.vy-reg,.vy-lgn2) {
  position: relative !important; width: 100% !important; max-width: 440px !important;
  margin: 64px auto 0 !important; padding: 32px !important; box-sizing: border-box;
  border: 1px solid var(--va-border) !important; border-radius: 12px !important;
  background: var(--va-card) !important; color: var(--va-text) !important;
  box-shadow: var(--va-shadow) !important; backdrop-filter: none !important;
  overflow: visible !important; animation: none !important; transform: none !important;
}
html[data-vy-auth] body > .card { width: 440px !important; max-width: 100% !important; }
html[data-vy-auth] .vy-auth-logo {
  display: block !important; position: absolute; top: -84px; left: 50%; transform: translateX(-50%);
  width: 192px !important; height: 64px !important; margin: 0 !important; object-fit: contain;
}
html[data-vy-auth] :is(.card h1,.login-content h1,.vy-h1,.vy-lgn2-r h3) {
  margin: 0 0 8px !important; font-size: 26px !important; font-weight: 650 !important;
  letter-spacing: -.6px; line-height: 1.4 !important; text-align: center; color: var(--va-text) !important;
}
html[data-vy-auth] :is(.sub,.login-description,.vy-subtitle,.vy-lgn2-rsub) {
  font-size: 14px !important; line-height: 1.7 !important; color: var(--va-muted) !important;
  text-align: center; margin: 0 0 28px !important;
}
html[data-vy-auth] :is(.field,.vy-field,.vy-f) { margin: 0 0 18px !important; min-width: 0; }
html[data-vy-auth] :is(.field > label,.vy-field > label,.vy-f > label,.vy-auth-label) {
  display: block; font-size: 14px !important; font-weight: 500 !important; line-height: 20px;
  color: var(--va-text) !important; margin-bottom: 8px !important;
}
html[data-vy-auth] :is(.field,.vy-reg) input:not([type="checkbox"]):not(.vy-otp-real):not(.vy-auth-code-input) {
  width: 100%; min-width: 0; height: 48px !important; padding: 0 13px !important;
  font-family: inherit; font-size: 14px; border: 1px solid var(--va-border) !important;
  border-radius: 8px !important; background: var(--va-input) !important; color: var(--va-text) !important;
  -webkit-text-fill-color: var(--va-text) !important; outline: none; box-shadow: none !important; box-sizing: border-box;
}
html[data-vy-auth] :is(.field,.vy-reg) input:not([type="checkbox"]):not(.vy-otp-real):not(.vy-auth-code-input):focus {
  border-color: var(--va-primary) !important; box-shadow: 0 0 0 3px var(--va-ring) !important;
}
html[data-vy-auth] :is(input::placeholder) { color: var(--va-muted) !important; opacity: .8; }
html[data-vy-auth] .login-form { display: flex; flex-direction: column; gap: 18px !important; }
html[data-vy-auth] .login-field {
  display: flex !important; position: relative; align-items: center; height: 48px !important;
  margin: 28px 0 0 !important; padding: 0 12px !important; min-width: 0; box-sizing: border-box;
  background: var(--va-input) !important; border: 1px solid var(--va-border) !important;
  border-radius: 8px !important; box-shadow: none !important;
}
html[data-vy-auth] .login-field > svg { display: none; }
html[data-vy-auth] .login-field .vy-auth-label { position: absolute; bottom: 100%; left: 0; white-space: nowrap; }
html[data-vy-auth] .login-field input {
  flex: 1; min-width: 0; width: 100%; height: 44px; background: transparent !important;
  color: var(--va-text) !important; -webkit-text-fill-color: var(--va-text) !important;
  outline: none !important; border: 0 !important; box-shadow: none !important; font-size: 14px;
}
html[data-vy-auth] .login-field:focus-within { border-color: var(--va-primary) !important; box-shadow: 0 0 0 3px var(--va-ring) !important; }
html[data-vy-auth] :is(.row2,.vy-row,.captcha-row) { display: flex; gap: 8px !important; align-items: flex-end; min-width: 0; }
html[data-vy-auth] .row2 .field:first-child { flex: 1; min-width: 0; }
html[data-vy-auth] .row2 .field:last-child { flex: 0 0 auto; }
html[data-vy-auth] :is(.captcha-img,.captcha-image) { width: 144px !important; height: 48px !important; flex: 0 0 144px; border: 1px solid var(--va-border) !important; border-radius: 8px !important; background: var(--va-soft) !important; object-fit: contain; box-sizing: border-box; }
html[data-vy-auth] .captcha-image img { width: 100%; height: 100%; object-fit: contain; }
html[data-vy-auth] .captcha-refresh { width: 36px; height: 48px !important; flex: 0 0 36px; color: var(--va-muted) !important; border-radius: 8px; }
html[data-vy-auth] :is(.field-action,.vy-eye) { color: var(--va-muted) !important; font-size: 12px !important; }
html[data-vy-auth] :is(.go,.login-submit,.vy-submit2,.vy-reg > .vy-btn,.vy-lgn2-go) {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; height: 48px !important;
  border-radius: 8px !important; background: var(--va-primary) !important; color: #fff !important;
  box-shadow: none !important; border: 1px solid transparent !important; font-size: 15px !important;
  font-weight: 600 !important; cursor: pointer; margin-top: 8px;
}
html[data-vy-auth] :is(.go,.login-submit,.vy-submit2,.vy-reg > .vy-btn,.vy-lgn2-go):hover:not(:disabled) { background: var(--va-hover) !important; filter: none !important; }
html[data-vy-auth] :is(button,input):disabled { opacity: .55; cursor: not-allowed !important; }
html[data-vy-auth] :is(button,a,input[role="button"]):focus-visible { outline: 2px solid var(--va-primary) !important; outline-offset: 3px; }
html[data-vy-auth] input[type="checkbox"] { width: 16px !important; height: 16px !important; flex: 0 0 16px; accent-color: var(--va-primary) !important; }
html[data-vy-auth] :is(.opts,.opts label,.login-options,.remember-option,.vy-agree,.vy-agree2) { color: var(--va-muted) !important; font-size: 13px !important; line-height: 1.6; }
html[data-vy-auth] :is(.opts a,.foot a,.register-link a,.login-options a,.vy-gologin button,.vy-agree2 b,.linklike,.vy-lgn2-change,.vy-lgn2-resend2,.email-chip,.vy-lgn2-rsub b) { color: var(--va-primary) !important; }
html[data-vy-auth][data-vy-theme="dark"] :is(.opts a,.foot a,.register-link a,.login-options a,.vy-gologin button,.vy-agree2 b,.linklike,.vy-lgn2-change,.vy-lgn2-resend2,.email-chip,.vy-lgn2-rsub b) { color: #b89af4 !important; }
html[data-vy-auth] :is(.foot,.register-link,.vy-gologin) { display: flex; justify-content: center; align-items: center; gap: 6px; flex-wrap: wrap; border-top: 1px solid var(--va-border) !important; padding-top: 20px !important; margin-top: 22px !important; font-size: 13px; color: var(--va-muted) !important; }
html[data-vy-auth] .foot > span:first-child,
html[data-vy-auth] .login-security { display: none !important; }
html[data-vy-auth] :is(.msg,.vy-msg,.login-error) { font-size: 13px; line-height: 1.6; color: var(--va-error) !important; }
html[data-vy-auth] :is(.msg,.vy-msg):empty { display: none; }
html[data-vy-auth] .vy-msg.ok { color: var(--va-success) !important; }
html[data-vy-auth] .login-error { border-color: var(--va-error) !important; background: var(--va-soft) !important; }
html[data-vy-auth] #vy-auth-home { position: absolute; top: 24px; left: 28px; z-index: 90; padding: 8px 0; font-size: 14px; color: var(--va-muted); text-decoration: none; }
html[data-vy-auth] #vy-auth-theme { position: absolute; top: 22px; right: 28px; z-index: 90; height: 36px; padding: 0 12px; border: 1px solid var(--va-border); border-radius: 8px; background: var(--va-card); color: var(--va-text); font-family: inherit; font-size: 13px; cursor: pointer; }
html[data-vy-auth] :is(.corner-actions,.login-toolbar,.vy-auth-toolbar) { position: absolute !important; top: 22px !important; right: 132px !important; height: 36px; min-height: 36px; padding: 0 8px !important; background: transparent !important; box-shadow: none !important; border: 0 !important; border-radius: 8px; color: var(--va-muted) !important; z-index: 90 !important; backdrop-filter: none; }
html[data-vy-auth] .corner-btn { height: 36px !important; background: transparent !important; border: 0 !important; color: var(--va-muted) !important; }
html[data-vy-auth] .vy-auth-toolbar > .hidden { display: none !important; }
html[data-vy-auth] .vy-auth-password-box { position: relative; }
html[data-vy-auth] .vy-auth-password-box #p { padding-right: 56px !important; }
html[data-vy-auth] .vy-auth-password-button { position: absolute; right: 9px; top: 0; height: 48px; border: 0; background: transparent; color: var(--va-muted); font: inherit; font-size: 12px; cursor: pointer; }
/* Registration: preserve the mounted form and all handlers, change only its shell. */
html[data-vy-auth="register"] .auth-shell { justify-content: flex-start !important; }
html[data-vy-auth="register"] .auth-shell > :not(.vy-auth-branch):not(.vy-auth-toolbar) { display: none !important; }
html[data-vy-auth="register"] :is(.vy-auth-branch,.vy-auth-form-host,.vy-reg-wide) { display: block !important; width: 520px !important; max-width: 100% !important; height: auto !important; min-height: 0 !important; margin: 0 auto !important; padding: 0 !important; background: transparent !important; box-shadow: none !important; border: 0 !important; overflow: visible !important; }
html[data-vy-auth="register"] .vy-auth-form-host > .absolute { display: none !important; }
html[data-vy-auth="register"] .vy-reg { max-width: 520px !important; }
html[data-vy-auth="register"] .vy-reg-anchor { width: 100% !important; }
html[data-vy-auth="register"] .vy-otp { padding: 0 !important; background: none !important; border: 0 !important; }
html[data-vy-auth="register"] .vy-otp-title { display: none; }
html[data-vy-auth="register"] :is(.vy-hint,.vy-strength-label,.vy-otp-status) { color: var(--va-muted) !important; font-size: 12px; line-height: 1.6; text-align: left; }
html[data-vy-auth="register"] .vy-otp-status { margin-top: 8px; }
html[data-vy-auth="register"] .vy-row > input { flex: 1; min-width: 0; width: 0; }
html[data-vy-auth="register"] :is(.vy-btn-ghost,.vy-otp-send) { flex: 0 0 auto; height: 48px !important; margin: 0 !important; padding: 0 14px !important; border: 1px solid var(--va-border) !important; border-radius: 8px !important; background: var(--va-soft) !important; color: var(--va-primary) !important; box-shadow: none !important; font-size: 13px !important; font-weight: 500; }
html[data-vy-auth="register"][data-vy-theme="dark"] :is(.vy-btn-ghost,.vy-otp-send) { color: #b89af4 !important; }
html[data-vy-auth] .vy-auth-password-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
html[data-vy-auth] .vy-pwd-box input { padding-right: 48px !important; }
html[data-vy-auth] .vy-eye { min-height: 32px; right: 8px !important; }
html[data-vy-auth] :is(.vy-agree2,.vy-agree) { align-items: flex-start; gap: 8px; }
html[data-vy-auth] :is(.vy-agree2,.vy-agree) input { margin-top: 3px; }
/* Both email-verification surfaces share this single-card geometry. */
html[data-vy-auth][data-vy-step="verify"] .login-panel { display: none !important; }
html[data-vy-auth] main.vooyyy-login-layout > .vy-lgn2-anchor { position: static !important; transform: none !important; width: 440px !important; max-width: 100%; max-height: none !important; overflow: visible !important; margin: 0 !important; padding: 0 !important; }
html[data-vy-auth] .vy-lgn2 { display: block !important; }
html[data-vy-auth] .vy-lgn2-r { padding: 0 !important; display: flex; flex-direction: column; }
html[data-vy-auth] :is(.step-tag,.otp-tag) { display: none !important; }
html[data-vy-auth] :is(.otp,.otp-inputs,.vy-otp-boxes,.vy-auth-otp-boxes) { display: grid !important; grid-template-columns: repeat(6,minmax(0,1fr)) !important; gap: 8px !important; margin: 0 0 16px; }
html[data-vy-auth] :is(.otp input,.otp-input,.vy-otp-box,.vy-auth-otp-box) { display: flex; align-items: center; justify-content: center; width: 100% !important; min-width: 0 !important; height: 56px !important; padding: 0 !important; border: 1px solid var(--va-border) !important; border-radius: 8px !important; background: var(--va-input) !important; color: var(--va-text) !important; text-align: center; font-size: 24px !important; font-weight: 600; box-sizing: border-box; box-shadow: none !important; outline: none; }
html[data-vy-auth] :is(.otp input:focus,.otp-input:focus,.vy-otp-box.selected,.vy-auth-otp-box.selected) { border-color: var(--va-primary) !important; box-shadow: 0 0 0 3px var(--va-ring) !important; }
html[data-vy-auth] :is(.vy-otp-wrap,.vy-auth-otp) { position: relative; width: 100%; max-width: none; margin: 0; }
html[data-vy-auth] :is(.vy-otp-wrap,.vy-auth-otp) > :is(.vy-otp-boxes,.vy-auth-otp-boxes) { margin-bottom: 0 !important; }
html[data-vy-auth] .vy-auth-code-input { position: absolute !important; inset: 0 !important; height: 100% !important; width: 100% !important; opacity: 0 !important; cursor: text; font-size: 16px; }
html[data-vy-auth] :is(.note,.vy-lgn2-note,.otp-note) { padding: 10px 12px !important; margin: 16px 0 !important; border: 0; border-radius: 8px; background: var(--va-soft) !important; color: var(--va-muted) !important; font-size: 12px; line-height: 1.6; }
html[data-vy-auth] :is(.vy-lgn2-foot,.vy-lgn2-cd,#step2 .opts) { display: flex; flex-wrap: wrap; gap: 8px; line-height: 1.6; font-size: 12px; color: var(--va-muted) !important; }
html[data-vy-auth] .vy-lgn2-foot { margin-top: 16px; }
html[data-vy-auth] #step2 .change { margin-left: 0; }
html[data-vy-auth][data-vy-step="verify"] .card .foot { display: none; }
html[data-vy-auth] :is(input,button) { transition: border-color .15s,background-color .15s,box-shadow .15s; }
@media (max-width: 560px) {
  html[data-vy-auth] body:has(> .card),
  html[data-vy-auth] :is(.vooyyy-login-layout,.auth-shell) { padding: 88px 16px 32px !important; justify-content: flex-start !important; }
  html[data-vy-auth] :is(.card,.login-card,.vy-reg,.vy-lgn2) { padding: 24px 20px !important; margin-top: 60px !important; }
  html[data-vy-auth] .vy-auth-logo { width: 168px !important; top: -78px; }
  html[data-vy-auth] #vy-auth-home { top: 16px; left: 16px; font-size: 12px; }
  html[data-vy-auth] #vy-auth-theme { top: 16px; right: 16px; font-size: 12px; padding: 0 9px; }
  html[data-vy-auth] :is(.corner-actions,.login-toolbar,.vy-auth-toolbar) { top: 16px !important; right: 108px !important; padding: 0 2px !important; }
  html[data-vy-auth] .login-toolbar > svg { display: none; }
  html[data-vy-auth] .login-toolbar select { max-width: 88px; }
  html[data-vy-auth] .vy-auth-password-grid { grid-template-columns: 1fr; gap: 0; }
  html[data-vy-auth] :is(.field,.vy-reg) input:not([type="checkbox"]),
  html[data-vy-auth] .login-field input { font-size: 16px !important; }
  html[data-vy-auth] :is(.otp,.otp-inputs,.vy-otp-boxes,.vy-auth-otp-boxes) { gap: 6px !important; }
  html[data-vy-auth] :is(.otp input,.otp-input,.vy-otp-box,.vy-auth-otp-box) { height: 48px !important; }
  html[data-vy-auth] :is(.captcha-img,.captcha-image) { width: 112px !important; flex-basis: 112px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-vy-auth] :is(input,button) { transition: none !important; }
}

/* auth3b: remove only the legacy corner branding, retain central brand. */
html[data-vy-auth] .vy-brandmark { display: none !important; }
html[data-vy-auth] { --va-placeholder: #707583; }
html[data-vy-auth][data-vy-theme="dark"] { --va-placeholder: #9398a6; }
html[data-vy-auth] input::placeholder {
  color: var(--va-placeholder) !important;
  -webkit-text-fill-color: var(--va-placeholder) !important;
  opacity: 1 !important;
  font-weight: 400 !important;
  text-shadow: none !important;
}