/* One login surface for desktop and web. Only palette values vary by theme. */
:root {
  --lb-auth-canvas:#f4f5f9; --lb-auth-surface:#fff; --lb-auth-field:#fafbfe;
  --lb-auth-text:#20273a; --lb-auth-muted:#687187; --lb-auth-line:#e1e5ee;
  --lb-auth-brand:#6856b8; --lb-auth-brand-hover:#59479f; --lb-auth-primary-fill:var(--lb-auth-brand); --lb-auth-on-brand:#fff;
  --lb-auth-soft:#f2effa; --lb-auth-danger:#b13d48; --lb-auth-wechat:#198b59;
  --lb-auth-shadow:0 18px 54px rgba(35,43,77,.075); --lb-auth-mask:rgba(38,45,66,.45);
}
:root:is([data-lb-effective-theme="dark"],[data-theme="dark"]) {
  --lb-auth-canvas:#141821; --lb-auth-surface:#202631; --lb-auth-field:#1b222e;
  --lb-auth-text:#eef0f8; --lb-auth-muted:#a8b1c5; --lb-auth-line:#384150;
  --lb-auth-brand:#ab9ce8; --lb-auth-brand-hover:#7965c9; --lb-auth-primary-fill:#7461c5; --lb-auth-on-brand:#fff;
  --lb-auth-soft:#302b43; --lb-auth-danger:#ff9da9; --lb-auth-wechat:#70d4a0;
  --lb-auth-shadow:0 20px 62px rgba(0,0,0,.2); --lb-auth-mask:rgba(5,10,20,.64);
}
@media (prefers-color-scheme:dark) {
  :root:not([data-lb-effective-theme="light"]):not([data-theme="light"]) {
    --lb-auth-canvas:#141821; --lb-auth-surface:#202631; --lb-auth-field:#1b222e;
    --lb-auth-text:#eef0f8; --lb-auth-muted:#a8b1c5; --lb-auth-line:#384150;
    --lb-auth-brand:#ab9ce8; --lb-auth-brand-hover:#7965c9; --lb-auth-primary-fill:#7461c5; --lb-auth-on-brand:#fff;
    --lb-auth-soft:#302b43; --lb-auth-danger:#ff9da9; --lb-auth-wechat:#70d4a0;
    --lb-auth-shadow:0 20px 62px rgba(0,0,0,.2); --lb-auth-mask:rgba(5,10,20,.64);
  }
}
.lb-auth-shell { box-sizing:border-box; display:grid; place-items:center; width:100%; padding:36px 24px; background:radial-gradient(ellipse at 52% 18%,color-mix(in srgb,var(--lb-auth-brand) 6%,transparent),transparent 64%),var(--lb-auth-canvas); color:var(--lb-auth-text); user-select:none; }
#authView.lb-auth-shell { min-height:100vh; min-height:100dvh; }
.lb-auth-shell.lb-auth-shell--overlay { background:var(--lb-auth-mask); backdrop-filter:blur(16px); overflow:auto; }
.lb-auth-card { box-sizing:border-box; width:min(100%,440px); min-width:0; padding:34px 36px 36px; border:1px solid color-mix(in srgb,var(--lb-auth-line) 72%,transparent); border-radius:24px; background:var(--lb-auth-surface); box-shadow:var(--lb-auth-shadow); }
/* The desktop window grows for the added Google flow. Keep the card intrinsic
   at normal sizes, with a single internal scroll area on short/zoomed screens;
   scrolling the whole centred overlay can otherwise hide its top or actions. */
.lb-auth-shell.lb-auth-shell--overlay { --lb-auth-overlay-gap:24px; padding-block:var(--lb-auth-overlay-gap); overflow:hidden; align-items:safe center; }
.lb-auth-shell--overlay > .lb-auth-card { max-height:calc(100dvh - 2 * var(--lb-auth-overlay-gap)); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-gutter:stable; }
.lb-auth-header { margin-bottom:26px; }
.lb-auth-brand { display:flex; align-items:center; gap:10px; min-width:0; color:var(--lb-auth-text); text-decoration:none; font-size:18px; font-weight:650; line-height:1.4; }
.lb-auth-logo { display:block; flex:none; width:32px; height:32px; object-fit:contain; }
.lb-auth-logo img { display:block; width:100%; height:100%; object-fit:contain; }
.lb-auth-platform { margin-left:auto; color:var(--lb-auth-muted); font-size:13px; font-weight:400; }
.lb-auth-title { margin:28px 0 0; color:var(--lb-auth-text); font-size:28px; font-weight:650; line-height:1.35; letter-spacing:-.025em; }
.lb-auth-methods { display:flex; gap:24px; margin:0 0 24px; border-bottom:1px solid var(--lb-auth-line); }
.lb-auth-card .lb-auth-tab { appearance:none; position:relative; flex:none; min-width:0; min-height:44px; margin:0; padding:8px 0 13px; border:0; border-radius:0; background:transparent; color:var(--lb-auth-muted); font:inherit; font-size:15px; font-weight:500; line-height:1.5; cursor:pointer; box-shadow:none; }
.lb-auth-card .lb-auth-tab[aria-selected="true"] { color:var(--lb-auth-brand); font-weight:650; }
.lb-auth-tab[aria-selected="true"]::after { position:absolute; content:""; height:3px; inset-inline:0; bottom:-1px; border-radius:3px; background:var(--lb-auth-brand); }
.lb-auth-card .lb-auth-tab:hover:not(:disabled) { color:var(--lb-auth-brand); background:transparent; }
.lb-auth-card .lb-auth-tab:active:not(:disabled) { color:var(--lb-auth-text); }
.lb-auth-card .lb-auth-tab:disabled { opacity:.5; cursor:not-allowed; }
.lb-auth-panel { min-width:0; }
.lb-auth-panel[hidden],.lb-auth-binding[hidden] { display:none!important; }
.lb-auth-fields { display:grid; gap:20px; margin:0; }
.lb-auth-field { display:grid; gap:9px; min-width:0; }
.lb-auth-field > span:first-child { color:var(--lb-auth-muted); font-size:14px; font-weight:500; line-height:1.45; }
.lb-auth-code-row { display:grid; grid-template-columns:minmax(0,1fr) 116px; gap:10px; min-width:0; }
.lb-auth-card .lb-auth-input { appearance:none; display:block; box-sizing:border-box; width:100%; min-width:0; height:52px; margin:0; padding:0 15px; border:1px solid var(--lb-auth-line); border-radius:12px; outline:0; background:var(--lb-auth-field); color:var(--lb-auth-text); font:inherit; font-size:15px; line-height:1.5; box-shadow:none; user-select:text; transition:border-color .14s,box-shadow .14s; }
.lb-auth-card .lb-auth-input::placeholder { color:var(--lb-auth-muted); opacity:.8; }
.lb-auth-card .lb-auth-input:hover { border-color:color-mix(in srgb,var(--lb-auth-brand) 35%,var(--lb-auth-line)); background:var(--lb-auth-field); }
.lb-auth-card .lb-auth-input:focus,.lb-auth-card .lb-auth-input:focus-visible,.lb-auth-card .lb-auth-input:focus-within { border-color:var(--lb-auth-brand); outline:0; background:var(--lb-auth-field); box-shadow:0 0 0 3px color-mix(in srgb,var(--lb-auth-brand) 12%,transparent); }
.lb-auth-shell .lb-auth-card .lb-auth-input :is(input,textarea),.lb-auth-shell .lb-auth-card .lb-auth-input :is(input,textarea):is(:hover,:active,:focus,:focus-visible) { min-width:0; width:100%; padding:0; margin:0; border:0!important; outline:0!important; box-shadow:none!important; background:transparent!important; color:inherit; font:inherit; user-select:text; }
/* The phone control is inside a compound field. Keep the space after +86 in
   every interaction state, after the shared inner-control reset above. */
.lb-auth-shell .lb-auth-card .lb-auth-input.lb-auth-input--phone > input,
.lb-auth-shell .lb-auth-card .lb-auth-input.lb-auth-input--phone > input:is(:hover,:active,:focus,:focus-visible,:disabled) { padding-block:0; padding-inline:10px; }
.lb-auth-card .lb-auth-input:-webkit-autofill { -webkit-text-fill-color:var(--lb-auth-text); -webkit-box-shadow:0 0 0 1000px var(--lb-auth-field) inset!important; caret-color:var(--lb-auth-text); }
.lb-auth-card .lb-auth-primary,.lb-auth-card .lb-auth-tool,.lb-auth-card .lb-auth-text-button { appearance:none; display:inline-flex; align-items:center; justify-content:center; gap:10px; box-sizing:border-box; margin:0; font:inherit; font-size:15px; font-weight:600; line-height:1.5; cursor:pointer; transition:background .14s,color .14s,border-color .14s; }
.lb-auth-card .lb-auth-primary { width:100%; min-height:52px; padding:12px 16px; border:1px solid transparent; border-radius:12px; background:var(--lb-auth-primary-fill); color:var(--lb-auth-on-brand); box-shadow:none; }
/* The shared light-theme button fallback has higher specificity in interaction
   states. Filled login/WeChat actions keep their foreground instead of inheriting
   canvas text; dark-mode accent text keeps its separate, lighter palette. */
.lb-auth-shell .lb-auth-card .lb-auth-primary,
.lb-auth-shell .lb-auth-card .lb-auth-primary:is(:hover,:active,:focus,:focus-visible,:disabled) { color:var(--lb-auth-on-brand); -webkit-text-fill-color:var(--lb-auth-on-brand); }
.lb-auth-card .lb-auth-primary:hover:not(:disabled) { background:var(--lb-auth-brand-hover); }
.lb-auth-card .lb-auth-primary:active:not(:disabled) { background:var(--lb-auth-primary-fill); }
.lb-auth-shell .lb-auth-card .lb-auth-primary:disabled { background:var(--lb-auth-primary-fill); }
.lb-auth-card .lb-auth-tool { min-height:52px; padding:10px 12px; border:1px solid var(--lb-auth-line); border-radius:12px; background:transparent; color:var(--lb-auth-brand); font-size:14px; font-weight:500; }
.lb-auth-card .lb-auth-tool:hover:not(:disabled) { border-color:color-mix(in srgb,var(--lb-auth-brand) 36%,var(--lb-auth-line)); background:var(--lb-auth-soft); }
.lb-auth-card .lb-auth-tool:active:not(:disabled) { background:var(--lb-auth-field); }
.lb-auth-card .lb-auth-text-button { min-height:36px; padding:6px 4px; border:0; border-radius:7px; background:transparent; color:var(--lb-auth-muted); font-size:14px; font-weight:400; }
.lb-auth-card .lb-auth-text-button:hover:not(:disabled) { color:var(--lb-auth-text); background:var(--lb-auth-field); }
.lb-auth-card .lb-auth-text-button:active:not(:disabled) { background:var(--lb-auth-soft); }
.lb-auth-card :is(.lb-auth-primary,.lb-auth-tool,.lb-auth-text-button):disabled { opacity:.5; cursor:not-allowed; }
.lb-auth-card :is(.lb-auth-tab,.lb-auth-primary,.lb-auth-tool,.lb-auth-text-button):focus-visible { outline:2px solid var(--lb-auth-brand); outline-offset:3px; }
.lb-auth-note,.lb-auth-status,.lb-auth-error { margin:14px 0 0; color:var(--lb-auth-muted); font-size:14px; line-height:1.6; overflow-wrap:anywhere; }
.lb-auth-status { color:var(--lb-auth-text); }
.lb-auth-error { color:var(--lb-auth-danger); }
.lb-auth-binding { margin-top:18px; padding-top:16px; border-top:1px solid var(--lb-auth-line); }
.lb-auth-binding p { margin:0; color:var(--lb-auth-text); font-size:14px; line-height:1.6; }
.lb-auth-binding .lb-auth-text-button { margin-top:8px; }
@media(max-width:560px) { .lb-auth-shell { padding:24px 18px; } .lb-auth-card { padding:28px 24px 30px; border-radius:22px; } .lb-auth-platform { font-size:12px; } }
@media(max-width:360px) { .lb-auth-shell { padding-inline:14px; } .lb-auth-card { padding-inline:20px; } .lb-auth-code-row { grid-template-columns:minmax(0,1fr); } }
@media(max-height:480px) { .lb-auth-shell.lb-auth-shell--overlay { --lb-auth-overlay-gap:12px; } }
@media(prefers-reduced-motion:reduce) { .lb-auth-card .lb-auth-input,.lb-auth-card .lb-auth-primary,.lb-auth-card .lb-auth-tool,.lb-auth-card .lb-auth-text-button { transition:none; } }