.auth-page .auth-main { padding-top: var(--header-h); min-height: 100dvh; display: flex; flex-direction: column; }
.auth-page .auth-split { flex: 1; display: grid; grid-template-columns: 42% 58%; min-height: calc(100dvh - var(--header-h)); }
.auth-brand { background: var(--sanctuary); display: flex; align-items: flex-start; justify-content: flex-end; padding-top: 72px; padding-right: 56px; padding-bottom: 72px; padding-left: max(40px, calc((100vw - var(--max-width)) / 2)); position: relative; overflow: hidden; border-right: 0.5px solid rgba(200,188,168,0.12); }
.auth-wm { position: absolute; font-family: var(--font-display-zh); font-size: 320px; line-height: 1; color: rgba(245,240,232,0.04); pointer-events: none; user-select: none; right: -24px; bottom: 40px; letter-spacing: 0; }
.auth-brand-inner { display: flex; flex-direction: column; align-items: flex-end; position: relative; z-index: 1; text-align: right; }
.auth-brand-rule { display: block; width: 40px; height: 0.5px; background: var(--gold); margin: 0 0 28px; }
.auth-brand-zh { font-family: var(--font-display-zh); font-size: 18px; letter-spacing: 0.22em; color: var(--moonstone); margin: 0 0 12px; font-weight: 400; }
.auth-brand-en { font-family: var(--font-label); font-size: 10px; font-weight: 300; letter-spacing: 0.30em; color: var(--stone); text-transform: uppercase; margin: 0; }
.auth-brand-secondary { margin-top: 56px; padding-top: 32px; border-top: 0.5px solid rgba(200,188,168,0.12); text-align: right; width: 100%; }
.auth-brand-quote { font-family: var(--font-body-en); font-style: italic; font-size: 14px; line-height: 1.75; color: rgba(200,188,168,0.5); margin: 0; max-width: 280px; }
.auth-form-panel { background: var(--parchment); display: flex; align-items: flex-start; justify-content: flex-start; padding: 72px 60px 72px 56px; }
.auth-form-box { width: 100%; max-width: 400px; }
.auth-form-head { margin-bottom: 48px; }
.auth-eyebrow-rule { display: block; width: 40px; height: 0.5px; background: var(--gold); margin-bottom: 28px; }
.auth-title-zh { font-family: var(--font-display-zh); font-size: 36px; letter-spacing: 0.06em; color: var(--ink); line-height: 1.2; margin: 0 0 10px; font-weight: 400; }
.auth-title-en { font-family: var(--font-label); font-size: 10px; font-weight: 300; letter-spacing: 0.28em; text-transform: uppercase; color: var(--stone); margin: 0; }
.auth-form { display: flex; flex-direction: column; gap: 28px; }
.auth-field { display: flex; flex-direction: column; gap: 8px; }
.auth-field label { font-family: var(--font-label); font-size: 10px; font-weight: 300; letter-spacing: 0.14em; text-transform: uppercase; color: var(--charcoal); }
.auth-field input { font-family: var(--font-body-en); font-size: 16px; line-height: 1.5; color: var(--ink); background: transparent; border: none; border-bottom: 1px solid var(--stone); padding: 10px 0 10px; outline: none; width: 100%; -webkit-appearance: none; appearance: none; transition: border-color 0.3s ease; }
.auth-field input::placeholder { color: transparent; }
.auth-field input:focus { border-bottom-color: var(--gold); }
.auth-field input[aria-invalid="true"] { border-bottom-color: #7A2020; }
.pw-wrap { position: relative; display: flex; align-items: center; }
.pw-wrap input { flex: 1; padding-right: 56px; }
.pw-toggle { position: absolute; right: 0; top: 50%; transform: translateY(-50%); font-family: var(--font-label); font-size: 10px; font-weight: 300; letter-spacing: 0.10em; text-transform: uppercase; color: var(--charcoal); background: none; border: none; cursor: pointer; padding: 8px 0 8px 8px; transition: color 0.3s ease; white-space: nowrap; }
.pw-toggle:hover { color: var(--gold); }
.field-error { font-family: var(--font-ui-zh); font-size: 12px; color: #7A2020; display: block; }
.auth-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.auth-form-foot { display: flex; justify-content: flex-end; margin-top: -12px; }
.auth-link { font-family: var(--font-label); font-size: 11px; font-weight: 300; letter-spacing: 0.08em; color: var(--charcoal); position: relative; padding-bottom: 2px; transition: color 0.3s ease; }
.auth-link::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0.5px; background: var(--gold); transform: scaleX(0); transform-origin: left; transition: transform 0.3s ease; }
.auth-link:hover { color: var(--ink); }
.auth-link:hover::after { transform: scaleX(1); }
.auth-submit { font-family: var(--font-display-zh); font-size: 15px; letter-spacing: 0.16em; color: var(--moonstone); background: var(--sanctuary); border: 1px solid var(--sanctuary); padding: 17px 32px; width: 100%; cursor: pointer; transition: background 0.3s ease, border-color 0.3s ease; margin-top: 4px; }
.auth-submit:hover { background: var(--charcoal); border-color: var(--charcoal); }
.auth-submit:active { transform: scale(0.98); }
.auth-submit:disabled { opacity: 0.5; cursor: not-allowed; transform: none; }
.auth-error { font-family: var(--font-ui-zh); font-size: 13px; color: #7A2020; text-align: center; min-height: 0; transition: all 0.3s ease; }
.auth-switch { margin-top: 32px; padding-top: 24px; border-top: 0.5px solid var(--vellum); text-align: center; }
.auth-switch p { font-family: var(--font-ui-zh); font-size: 14px; color: var(--charcoal); margin: 0; }
.req-mark { color: var(--gold); font-style: normal; }
.field-hint { font-family: var(--font-label); font-size: 10px; font-weight: 300; letter-spacing: 0.08em; color: var(--charcoal); display: block; }
.auth-terms { font-family: var(--font-ui-zh); font-size: 11px; color: var(--charcoal); line-height: 1.7; text-align: center; margin-top: -8px; }
.auth-terms a { color: var(--charcoal); position: relative; padding-bottom: 1px; }
.auth-terms a::after { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; height: 0.5px; background: rgba(200,188,168,0.5); }
.auth-hint { font-family: var(--font-ui-zh); font-size: 14px; color: var(--charcoal); line-height: 1.85; margin: 0 0 40px; }
.auth-notice { font-family: var(--font-ui-zh); font-size: 13px; color: var(--charcoal); line-height: 1.7; background: var(--gold-wash); border-left: 2px solid var(--gold); padding: 12px 16px; margin-bottom: 24px; display: none; }
.auth-notice.is-visible { display: block; }
.auth-token-error { text-align: center; padding: 20px 0 40px; }
.auth-token-error p { font-family: var(--font-ui-zh); font-size: 14px; color: var(--charcoal); line-height: 1.8; margin: 0 0 28px; }
.auth-success { display: none; text-align: center; padding: 40px 0; }
.auth-success.is-visible { display: block; }
.auth-success-rule { display: block; width: 40px; height: 0.5px; background: var(--gold); margin: 0 auto 28px; }
.auth-success-zh { font-family: var(--font-display-zh); font-size: 22px; letter-spacing: 0.08em; color: var(--ink); margin: 0 0 16px; font-weight: 400; }
.auth-success-en { font-family: var(--font-body-en); font-size: 15px; font-style: italic; color: var(--charcoal); line-height: 1.7; margin: 0 0 32px; }
@media (max-width: 1024px) { .auth-form-panel { padding: 64px 48px 64px 48px; } }
@media (max-width: 900px) {
  .auth-page .auth-split { grid-template-columns: 1fr; min-height: auto; }
  .auth-brand { display: none; }
  .auth-form-panel { padding: 56px 40px; min-height: calc(100dvh - var(--header-h)); border-top: 0.5px solid var(--vellum); justify-content: flex-start; }
  .auth-form-box { max-width: 100%; }
}
@media (max-width: 600px) {
  .auth-form-panel { padding: 48px 24px 56px; }
  .auth-title-zh { font-size: 28px; }
  .auth-field-row { grid-template-columns: 1fr; }
}