:root { font-family: "Segoe UI", "Microsoft YaHei", system-ui, sans-serif; color: #24272e; background: #fff; font-synthesis: none; }
* { box-sizing: border-box; letter-spacing: 0; }
body { margin: 0; }
[hidden] { display: none !important; }
a { color: #2459c4; text-decoration: none; }
a:hover { text-decoration: underline; }
.account-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 32px; border-bottom: 1px solid #e6e9ee; }
.brand { display: flex; align-items: center; gap: 12px; font-size: 15px; font-weight: 600; color: #24272e; }
.brand img { width: 54px; height: auto; }
.account-header > a:last-child { font-size: 13px; }
.account-main { max-width: 440px; margin: 64px auto; padding: 0 24px; }
h1 { font-size: 28px; line-height: 1.3; margin: 0 0 12px; font-weight: 650; }
h2 { font-size: 17px; margin: 0 0 20px; }
.muted { color: #697383; line-height: 1.7; }
.small { font-size: 12px; }
.auth-tabs { display: flex; gap: 28px; margin: 28px 0; border-bottom: 1px solid #e6e9ee; }
.auth-tabs a { padding: 12px 0; color: #697383; font-size: 14px; border-bottom: 2px solid transparent; }
.auth-tabs a.active { color: #2459c4; border-bottom-color: #2459c4; }
form { display: grid; gap: 18px; }
label { display: grid; gap: 8px; font-size: 13px; font-weight: 500; }
input { width: 100%; min-width: 0; height: 44px; padding: 10px 12px; border: 1px solid #dce2e9; border-radius: 6px; color: #24272e; background: #fff; font: inherit; }
input:focus { border-color: #2459c4; }
button { min-height: 42px; padding: 10px 16px; border: 1px solid #dce2e9; border-radius: 6px; background: #fff; color: #24272e; font: 500 13px/1.5 "Segoe UI","Microsoft YaHei",system-ui,sans-serif; cursor: pointer; }
button:hover { background: #f3f5f8; }
button.primary { color: #fff; background: #24272e; border-color: #24272e; }
button.primary:hover { background: #3a414c; }
button:disabled { opacity: .6; cursor: wait; }
:is(a,button,input):focus-visible { outline: 2px solid #2459c4; outline-offset: 3px; }
.password-field { position: relative; }
.password-field input { padding-right: 50px; }
.icon-button { position: absolute; right: 2px; top: 2px; width: 40px; height: 40px; min-height: 40px; padding: 10px; border: 0; display: grid; place-items: center; }
.icon-button svg { width: 18px; height: 18px; }
.message { margin: 0; min-height: 20px; font-size: 13px; line-height: 1.6; color: #9b3c36; overflow-wrap: anywhere; }
.message.success { color: #277054; }
.legal { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 32px; font-size: 12px; }
.account-status { display: flex; justify-content: space-between; gap: 16px; padding: 16px 0; border-bottom: 1px solid #e6e9ee; font-size: 13px; }
.account-status span { color: #697383; }
#profileView form,.session-actions { margin-top: 32px; padding-bottom: 24px; border-bottom: 1px solid #e6e9ee; }
.actions { display: flex; gap: 12px; flex-wrap: wrap; }
.wechat-button { display:flex;align-items:center;justify-content:center;gap:10px;width:100%;color:#187345;border-color:#b5d8c4;background:#f4faf6; }
.wechat-button svg,.account-links svg { width:18px;height:18px;flex-shrink:0; }
.auth-divider { display:flex;align-items:center;gap:14px;color:#8b93a0;font-size:12px;margin:24px 0; }
.auth-divider::before,.auth-divider::after { content:"";height:1px;flex:1;background:#e6e9ee; }
.uid-line { display:flex;align-items:center;gap:8px;min-width:0; }
.uid-line code { font-size:11px;overflow-wrap:anywhere; }
.compact-icon { width:30px;min-height:30px;padding:6px;display:grid;place-items:center;flex-shrink:0; }
.compact-icon svg { width:14px;height:14px; }
.account-links { display:flex;gap:12px;flex-wrap:wrap;margin:22px 0 12px; }
.account-links button,.account-button { display:inline-flex;gap:8px;align-items:center;min-height:42px;padding:10px 14px;border:1px solid #dce2e9;border-radius:6px;font-size:13px;color:#24272e; }
.user-menu { display: flex; gap: 14px; align-items: center; min-width: 0; font: 500 12px/1.5 "Segoe UI","Microsoft YaHei",system-ui,sans-serif; }
.user-menu a { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #596270; }
.user-menu button { display: grid; place-items: center; min-height: 32px; width: 32px; padding: 7px; background: transparent; }
.user-menu svg { width: 16px; height: 16px; }
.auth-page { min-height:100svh;background:#f6f7f8; }
.auth-page .account-header { height:76px;border:0;padding:20px 36px;background:transparent; }
.auth-page .account-header > #backLink { display:none; }
.auth-page .brand { min-height:44px; }
.auth-page .account-main { width:100%;max-width:488px;margin:40px auto 48px;padding:0 24px; }
.auth-panel { position:relative;padding:44px 38px 26px;background:#fff;border:1px solid #e8eaed;border-radius:8px;box-shadow:0 12px 48px #20242b06; }
.auth-close { position:absolute;top:10px;right:10px;width:36px;height:36px;display:grid;place-items:center;color:#93989f;border-radius:6px; }
.auth-close:hover { color:#24272e;background:#f5f6f7;text-decoration:none; }
.auth-close svg { width:18px;height:18px; }
.wechat-heading { display:flex;align-items:center;justify-content:center;gap:10px;font-size:22px;line-height:32px;margin:0;font-weight:650; }
.wechat-heading img { flex:none; }
.auth-caption { margin:10px 0 20px;color:#90959d;font-size:12px;text-align:center; }
.qr-stage { position:relative;width:300px;max-width:100%;height:260px;margin:0 auto;overflow:hidden;background:#fff; }
.qr-stage iframe { position:absolute;left:0;top:0;display:block;width:200px;height:174px;max-width:none;border:0;margin:0;transform:scale(1.5);transform-origin:top left; }
.qr-feedback { position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:#fff;color:#7c848e;font-size:13px;text-align:center;padding:20px; }
.qr-stage[data-state="expired"] .qr-feedback { background:#fffffff5; }
.qr-spinner { width:26px;height:26px;border:2px solid #e8ecea;border-top-color:#07a452;border-radius:50%;animation:qr-spin .8s linear infinite; }
.qr-retry { display:inline-flex;gap:7px;align-items:center;justify-content:center;min-height:40px;font-size:12px; }
.qr-retry svg { width:14px;height:14px; }
.scan-caption { margin:10px 0 0;font-size:13px;text-align:center;color:#5c646e;line-height:22px; }
.qr-message { min-height:20px;margin:8px 0 0;text-align:center;font-size:12px; }
.auth-methods { display:flex;justify-content:center;align-items:center;gap:12px;margin:24px 0 20px; }
.method-switch { display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:44px;padding:8px 12px;border:0;background:transparent;color:#676f79;font-size:13px; }
.method-switch:hover { color:#24272e;background:#f7f8f9; }
.method-switch svg { width:16px;height:16px; }
#qrRefresh { border:0;background:transparent;color:#8e959e;min-height:36px;width:36px; }
#qrRefresh:hover { background:#f7f8f9;color:#24272e; }
.auth-agreement { margin:0;text-align:center;font-size:11px;color:#999fa6;line-height:1.9; }
.auth-agreement a { display:inline-flex;align-items:center;min-height:44px;padding:0 4px;color:#69717c; }
.auth-agreement span { margin:0 6px; }
.auth-panel #authTitle { font-size:24px; }
.auth-panel #authSubtitle { font-size:13px;margin:8px 0 0; }
.auth-panel .auth-tabs { margin:20px 0 24px; }
.auth-panel form { gap:16px; }
.auth-panel label { color:#4f5864;font-size:12px; }
.auth-panel input { height:46px;background:#fcfcfd; }
.auth-panel .primary { min-height:46px;font-size:14px; }
.auth-panel .message:empty { display:none; }
.email-help { margin:14px 0 0;font-size:11px; }
.back-wechat { display:flex;margin:18px auto 20px; }
.auth-panel #emailView[hidden] + .auth-agreement { margin-top:0; }
@keyframes qr-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .qr-spinner { animation:none; } }
@media(max-width:560px) {
  .account-header { padding: 16px 20px; }
  .account-main { margin-top: 36px; }
  input { font-size: 16px; }
  .user-menu { gap: 8px; }
  .user-menu a { max-width: 90px; }
  .auth-page .account-header { height:64px;padding:18px 22px; }
  .auth-page .account-main { max-width:440px;margin:20px auto 28px;padding:0 16px; }
  .auth-panel { padding:44px 22px 24px; }
  .auth-close { width:44px;height:44px;top:3px;right:3px; }
  #qrRefresh { min-height:44px;width:44px; }
  .auth-methods { margin:20px 0 16px; }
  .auth-panel input { font-size:16px; }
}
@media(max-width:359px) {
  .auth-page .account-main { padding:0 8px; }
  .auth-panel { padding:44px 8px 24px; }
  .qr-stage { width:280px; }
  .qr-stage iframe { width:187px; }
}