/* Login artwork and proportions from WB店铺中心_可编辑-2-02.psd (7809 × 3985). */
@font-face { font-family: "Daie Login Light"; src: local("Microsoft YaHei Light"), local("MicrosoftYaHeiLight"); font-weight: 300; font-display: swap; }
/* An earlier named layer owns important typography in this application. */
@layer compactTypography {
  html body #loginView, html body #loginView * { font-family: "Daie Login Light", "Microsoft YaHei", "PingFang SC", "Source Han Sans SC", sans-serif !important; }
  html body #loginView .auth-brand p,
  html body #loginPanel label,
  html body #loginPanel .auth-switch a { font-size: 19px !important; font-weight: 300 !important; letter-spacing: .32em !important; }
  html body #loginPanel input { font-size: 18px !important; letter-spacing: normal !important; }
  html body #loginPanel .auth-primary { font-size: 30px !important; font-weight: 300 !important; letter-spacing: .35em !important; }
  html body #loginPanel .auth-footer, html body #loginPanel .auth-footer * { font-size: 14px !important; font-weight: 300 !important; letter-spacing: .25em !important; }
}
html body.auth-pending { display: block !important; margin: 0; background: #fff !important; }
html body #loginView { --login-logo-width: clamp(230px, 21vw, 393px); --login-control-height: clamp(48px, 3.26vw, 61px); display: block; min-height: 100dvh !important; padding: clamp(32px, 6.1vh, 58px) 24px 24px !important; background: #fff !important; }
html body.app-ready #loginView { display: none !important; }
html body #loginView .auth-shell { width: min(clamp(420px, 36vw, 674px), 100%); min-height: calc(100dvh - clamp(32px, 6.1vh, 58px) - 24px); margin: 0 auto; display: flex; flex-direction: column; }
html body #loginView .auth-brand { display: flex; flex-direction: column; align-items: center; gap: clamp(18px, 1.34vw, 25px); margin: 0 0 clamp(26px, 1.6vw, 30px) !important; flex-shrink: 0; }
html body #loginView .brand-logo-login { display: block; width: var(--login-logo-width) !important; max-width: 82%; height: auto !important; margin: 0 !important; }
html body #loginView .auth-brand p { line-height: 1.5; color: #686767; text-align: center; white-space: nowrap; }
html body #loginView .login-card { padding: 0 !important; margin: 0; border: 0 !important; box-shadow: none !important; border-radius: 0 !important; background: #fff !important; }
html body #loginPanel { display: flex; flex-direction: column; flex: 1; gap: 8px !important; }
html body #loginPanel .login-form { display: flex; flex-direction: column; gap: 10px !important; padding: 0 !important; }
html body #loginPanel label { display: block; line-height: 1.5; color: #686767 !important; text-indent: 14px; }
html body #loginPanel input { display: block; width: 100%; height: var(--login-control-height); min-height: var(--login-control-height) !important; margin: 4px 0 0 !important; padding: 0 18px !important; border: 1px solid #999 !important; border-radius: clamp(12px, .86vw, 16px) !important; background: #fff !important; color: #242424; box-shadow: none; text-indent: 0; }
html body #loginPanel input:focus-visible { outline: 2px solid #e0641e; outline-offset: 3px; }
html body #loginPanel .auth-primary { align-self: center; width: clamp(190px, 14.52vw, 272px); max-width: 100%; height: var(--login-control-height); min-height: var(--login-control-height) !important; padding: 0 0 0 .35em !important; margin: 20px 0 0 !important; border: 1px solid #ca6a34 !important; border-radius: clamp(12px, .86vw, 16px) !important; background: #e0641e !important; color: #fff !important; box-shadow: none !important; line-height: 1; transition: background-color 140ms ease; }
html body #loginPanel .auth-primary:hover { background: #cd5919 !important; }
html body #loginPanel .auth-primary:disabled { opacity: .65; cursor: wait; }
html body #loginPanel .auth-switch { text-align: center; line-height: 1.6; }
html body #loginPanel .auth-switch a { color: #e0641e !important; text-decoration: none; }
html body #loginPanel .auth-switch a:hover { text-decoration: underline; text-underline-offset: 5px; }
html body #loginPanel .auth-footer { display: flex; justify-content: flex-end; align-items: center; gap: 2px; margin-top: auto; padding: 48px 0 0; color: #686767; }
html body #loginPanel .auth-footer a { color: #686767; text-decoration: none; }
html body #loginPanel .sync-error { text-indent: 0; }
html body #loginView .auth-sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip-path: inset(50%); white-space: nowrap; }
html body #loginView:has(#registerPanel:not([hidden])) .brand-logo-login { width: 190px !important; }
html body #loginView:has(#registerPanel:not([hidden])) .auth-shell { max-width: 590px; }
@media (max-height: 800px) and (min-width: 701px) {
  html body #loginView { padding-top: 28px !important; }
  html body #loginView .auth-shell { min-height: calc(100dvh - 52px); }
  html body #loginView .brand-logo-login { width: min(var(--login-logo-width), 270px) !important; }
  html body #loginView .auth-brand { gap: 18px; margin-bottom: 22px !important; }
}
@media (min-width: 701px) {
  @layer compactTypography {
    html body #loginView .auth-brand p, html body #loginPanel label, html body #loginPanel .auth-switch a { font-size: clamp(16px, 1.02vw, 19px) !important; letter-spacing: .25em !important; }
    html body #loginPanel .auth-primary { font-size: clamp(22px, 1.6vw, 30px) !important; }
  }
}
@media (max-width: 700px) {
  html body #loginView { padding: 42px 24px 24px !important; }
  html body #loginView .auth-shell { min-height: calc(100dvh - 66px); }
  html body #loginView .brand-logo-login { width: 220px !important; }
  html body #loginView .auth-brand { gap: 20px; margin-bottom: 30px !important; }
  html body #loginPanel input { height: 54px; min-height: 54px !important; border-radius: 12px !important; }
  html body #loginPanel .auth-primary { width: 220px; height: 54px; min-height: 54px !important; border-radius: 12px !important; }
  html body #loginPanel .auth-footer { justify-content: center; margin-top: auto; }
  @layer compactTypography {
    html body #loginView .auth-brand p, html body #loginPanel label, html body #loginPanel .auth-switch a { font-size: 16px !important; letter-spacing: .2em !important; }
    html body #loginPanel .auth-primary { font-size: 25px !important; }
    html body #loginPanel .auth-footer, html body #loginPanel .auth-footer * { font-size: 12px !important; }
  }
}