/* Standalone WeChat welcome page, sharing the storefront's colors and type. */
.wechat-login *, .wechat-login *::before, .wechat-login *::after { box-sizing: border-box; }
.wechat-login { margin: 0; font-family: "PingFang SC", "Microsoft YaHei", sans-serif; -webkit-font-smoothing: antialiased; }
.auth-shell { min-height: 100vh; min-height: 100svh; max-width: 1040px; margin: auto; padding: 26px 22px max(22px,env(safe-area-inset-bottom)); display: flex; flex-direction: column; }
.auth-brand { display: flex; align-items: center; gap: 12px; }
.auth-brand img { border-radius: 50%; background: white; padding: 3px; object-fit: contain; }
.auth-brand strong { display: block; font-size: 16px; font-weight: 600; letter-spacing: .04em; }
.auth-brand span { display: block; margin-top: 5px; font-size: 11px; color: var(--store-muted); letter-spacing: .12em; }
.auth-card { margin: auto 0; background: var(--store-surface); border: 1px solid var(--store-line); border-radius: 8px 26px 8px 26px; overflow: hidden; box-shadow: 0 18px 56px rgba(32,52,39,.045); animation: auth-arrive 550ms var(--store-ease) both; }
.auth-story { position: relative; overflow: hidden; background: #e8ecdf; color: #286342; padding: 22px 26px; min-height: 152px; }
.auth-eyebrow { display: block; font-size: 11px; letter-spacing: .15em; color: var(--store-muted); }
.auth-story .auth-eyebrow { color: #52664b; }
.auth-story h2 { position: relative; z-index: 1; margin: 13px 0 0; font-family: var(--store-display); font-size: 25px; line-height: 1.45; font-weight: 500; letter-spacing: .12em; }
.auth-landscape { position: absolute; bottom: -28px; right: -12px; width: 250px; height: 170px; }
.auth-story-note { display: none; }
.auth-content { padding: 26px; }
.auth-content h1 { margin: 11px 0 14px; font-family: var(--store-display); font-size: 28px; font-weight: 600; line-height: 1.5; letter-spacing: .02em; }
.auth-content h1 span { font-size: 25px; }
.auth-intro { margin: 0; color: var(--store-muted); font-size: 16px; line-height: 1.8; }
.auth-profile { display: flex; align-items: center; gap: 12px; margin: 24px 0; padding-top: 20px; border-top: 1px solid var(--store-line); }
.auth-profile-icon { display: grid; place-items: center; flex: 0 0 40px; height: 40px; border-radius: 50%; background: var(--store-paper); font-size: 21px; color: var(--store-primary); }
.auth-profile strong { display: block; font-size: 14px; font-weight: 500; }
.auth-profile p { margin: 5px 0 0; font-size: 12px; color: var(--store-muted); }
.auth-button { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 54px; padding: 13px 12px; border: 0; border-radius: 5px; background: var(--store-primary); color: white; font-family: inherit; font-size: 16px; cursor: pointer; transition: background 200ms,transform 200ms; }
.auth-button .bi-wechat { font-size: 22px; }
.auth-button .bi-arrow-right { font-size: 17px; margin-left: auto; }
.auth-button:hover { background: var(--store-primary-dark); }
.auth-button:active { transform: scale(.985); }
.auth-button:disabled { cursor: wait; opacity: .75; }
.auth-consent { margin: 17px 0 0; font-size: 12px; line-height: 1.9; color: var(--store-muted); }
.auth-desktop-break { display: none; }
.auth-footer { display: flex; align-items: center; justify-content: center; gap: 7px; padding-top: 24px; font-size: 11px; color: var(--store-muted); letter-spacing: .035em; }
.auth-error { background: var(--store-paper); border-left: 2px solid var(--store-berry); color: var(--store-berry); font-size: 14px; line-height: 1.8; padding: 10px 12px; margin: 0 0 16px; }
@keyframes auth-arrive { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (min-width: 768px) {
    .auth-shell { padding: 38px 40px; }
    .auth-card { display: grid; grid-template-columns: .9fr 1.1fr; }
    .auth-story { padding: 44px 36px; }
    .auth-story h2 { font-size: 37px; line-height: 1.55; margin-top: 30px; }
    .auth-landscape { width: 420px; height: 280px; bottom: 12px; right: -60px; }
    .auth-story-note { position: absolute; bottom: 30px; left: 36px; display: block; font-size: 12px; letter-spacing: .1em; }
    .auth-content { padding: 48px 40px; }
    .auth-content h1 { font-size: 32px; }
    .auth-content h1 span { font-size: 29px; }
    .auth-desktop-break { display: inline; }
    .auth-footer { padding-top: 32px; }
}
@media (prefers-color-scheme: dark) {
    .auth-profile-icon { color: #acd4a4; }
    .auth-card { box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
    .auth-card { animation: none; }
    .auth-button { transition: none; }
}