body.login-design-page { background:linear-gradient(120deg,#f5faff,#eaf4ff);color:#102b63;--ink:#102b63;--muted:#7185a6;--line:#dde8f6;font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif; }
body.login-design-page>.topbar,body.login-design-page>.footer { display:none; }
.login-design-page * { box-sizing:border-box; }
.login-desktop-header svg,.login-desktop-footer svg { display:block;width:100%;height:auto; }
.login-mobile-header,.login-mobile-footer { display:none; }
.login-design-main { max-width:1200px;margin:0 auto;padding:72px 28px 48px;display:grid;grid-template-columns:minmax(0,1fr) 460px;gap:90px;align-items:center;min-height:750px; }
.login-presentation .login-kicker { color:#1677ff;font-size:16px;font-weight:600;margin:0 0 24px; }
.login-presentation h2 { color:#102b63;font-size:42px;line-height:1.4;letter-spacing:0;margin:0 0 22px; }
.login-presentation p { color:#7185a6;font-size:16px;line-height:1.8;margin:0; }
.login-book-art { width:100%;max-width:500px;height:auto;display:block;margin:20px 0 4px; }
.login-presentation .login-directions { color:#1677ff;font-size:14px;font-weight:500; }
.login-panel { background:#fff;border-radius:24px;box-shadow:0 10px 36px #1e5cc412;min-width:0; }
.login-card { padding:36px 44px 0; }
.login-badge { display:inline-block;background:#eaf3ff;color:#1677ff;border-radius:7px;padding:5px 9px;font-size:12px;font-weight:600;line-height:18px; }
.login-card h1 { margin:22px 0 10px;color:#102b63;font-size:28px;line-height:1.4;letter-spacing:0; }
.login-subtitle { margin:0 0 32px;color:#7185a6;font-size:14px;line-height:1.7; }
.login-form { display:grid;gap:20px; }
.login-design-page .login-field { display:grid;gap:10px;font-size:14px;line-height:1.5;font-weight:600;color:#102b63; }
.login-input-shell { position:relative;display:flex;align-items:center; }
.login-design-page .login-field input,.login-design-page .login-field textarea { display:block;width:100%;min-width:0;min-height:52px;padding:13px 14px;border:1px solid #dde8f6;border-radius:12px;background:#f9fbff;color:#102b63;font:400 16px/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC",sans-serif;box-shadow:none; }
.login-design-page .login-input-shell input { padding-left:48px; }
.login-design-page .login-input-shell input[name=password] { padding-right:48px; }
.login-design-page .login-field input::placeholder,.login-design-page .login-field textarea::placeholder { color:#8395ae; }
.login-design-page .login-field input:focus,.login-design-page .login-field textarea:focus { outline:2px solid #1677ff;outline-offset:2px; }
.login-input-shell>svg { position:absolute;left:14px;width:22px;height:22px;color:#7185a6;pointer-events:none; }
.login-field-hint { color:#7185a6;font-size:12px;line-height:1.6;margin:-8px 0 2px; }
.login-design-page .login-primary { display:flex;position:relative;align-items:center;justify-content:center;width:100%;min-height:48px;padding:12px 42px;border:1px solid #1677ff;border-radius:12px;background:#1677ff;color:#fff;font-size:16px;font-weight:600;line-height:1.4;cursor:pointer;text-decoration:none;box-shadow:none; }
.login-design-page .login-primary:hover { background:#0966e8;border-color:#0966e8; }
.login-primary svg { position:absolute;right:22px;width:20px;height:20px; }
.login-design-page .login-primary:disabled { opacity:.65;cursor:wait; }
.login-design-page [hidden] { display:none!important; }
.login-reassurance { display:flex;align-items:start;gap:8px;margin:24px 0 0;font-size:12px;line-height:1.7;color:#7185a6; }
.login-reassurance svg { flex:0 0 16px;width:16px;height:16px;margin-top:2px; }
.login-support { padding:24px 44px 34px;text-align:center; }
.login-help { text-align:left;border-top:1px solid #e7eff9;padding-top:12px; }
.login-help summary { display:flex;gap:12px;align-items:center;cursor:pointer;min-height:44px;list-style:none;font-size:14px;font-weight:600;color:#102b63; }
.login-help summary::-webkit-details-marker { display:none; }
.login-help summary svg { width:20px;height:20px;color:#1677ff; }
.login-help .login-chevron { margin-left:auto;color:#7185a6; }
.login-help[open] .login-chevron { transform:rotate(180deg); }
.login-help ul { margin:12px 0;padding-left:20px;font-size:13px;color:#7185a6;line-height:1.8; }
.login-help a { font-size:13px;color:#1677ff; }
.login-support>p { font-size:13px;line-height:1.8;color:#7185a6;margin:22px 0 8px; }
.login-design-page .login-contact { display:inline-block;min-height:32px;margin:0;padding:0;border:0;background:transparent;box-shadow:none;color:#1677ff;font:inherit;font-size:14px;font-weight:600;text-decoration:none;cursor:pointer; }
.login-design-page .login-contact:hover { color:#0966e8; }
.login-back { color:#1677ff;font-size:13px;text-decoration:none;display:inline-block;line-height:26px; }
.login-back-bottom { display:block;text-align:center;margin-top:18px; }
.login-options { display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px; }
.login-options label { display:flex;align-items:center;gap:8px;color:#7185a6; }
.login-options input[type=checkbox] { width:16px;min-height:16px;height:16px;margin:0;accent-color:#1677ff; }
.login-design-page .login-recovery { background:transparent;border:0;padding:8px 0;color:#1677ff;font-size:12px;min-height:32px;box-shadow:none;font-weight:400; }
.login-design-page .login-eye { display:grid;place-items:center;position:absolute;right:4px;top:4px;width:44px;height:44px;padding:12px;border:0;background:transparent;color:#7185a6;box-shadow:none; }
.login-eye svg { width:20px;height:20px; }
.login-eye[aria-pressed=true] { color:#1677ff; }
.login-message { font-size:13px;line-height:1.8;border:1px solid #ffd6c6;background:#fff5ee;color:#a33b1b;padding:12px 14px;border-radius:10px;margin:0 0 22px;overflow-wrap:anywhere; }
.login-submitted { color:#1677ff;background:#f0f6ff;padding:14px;border-radius:10px;font-size:14px;line-height:1.8; }
.login-account { font-size:13px;color:#7185a6;line-height:1.8;margin:0 0 16px; }
.login-account strong { color:#102b63;font-weight:500; }
.login-temp-box { padding:20px;background:#f0f6ff;border-radius:14px;margin-bottom:20px; }
.login-temp-box span { color:#7185a6;font-size:12px;display:block; }
.login-temp-box code { display:block;font:600 28px/1.6 ui-monospace,monospace;letter-spacing:1px;overflow-wrap:anywhere;margin-top:12px;color:#102b63;user-select:all; }
.login-temp-box~.login-primary { margin-top:24px; }
.login-copy-status { color:#7185a6;font-size:12px;line-height:1.7; }
.login-copy-status:empty { display:none; }
.login-design-page a:focus-visible,.login-design-page button:focus-visible,.login-help summary:focus-visible { outline:2px solid #1677ff;outline-offset:3px; }
@media(max-width:1100px) and (min-width:769px) {
  .login-design-main { grid-template-columns:minmax(0,1fr) 420px;gap:30px;padding:48px 30px;min-height:660px; }
  .login-presentation h2 { font-size:30px; }
  .login-card { padding:30px 30px 0; }.login-support { padding:24px 30px; }
}
@media(max-width:768px) {
  .login-desktop-header,.login-desktop-footer,.login-presentation { display:none; }
  .login-mobile-header { display:flex;height:64px;padding:0 20px;align-items:center;justify-content:space-between;background:#fff; }
  .login-mobile-header a { color:#1677ff;font-size:13px;text-decoration:none; }
  .login-mobile-header .site-brand-logo { width:102px;height:34px; }
  .login-design-main { display:block;min-height:0;padding:24px 16px 28px;max-width:500px; }
  .login-panel { background:transparent;border-radius:0;box-shadow:none; }
  .login-card { border-radius:20px;background:#fff;padding:26px 20px 30px;box-shadow:0 10px 36px #1e5cc412; }
  .login-card h1 { font-size:28px;margin-top:20px; }
  .login-subtitle { margin-bottom:28px; }
  .login-support { padding:24px 0 0; }
  .login-help { background:#fff;border:1px solid #dde8f6;border-radius:12px;padding:0 16px; }
  .login-help summary { min-height:50px; }
  .login-help a { display:block;margin-bottom:14px; }
  .login-support>p { margin-top:24px;font-size:12px; }
  .login-mobile-footer { display:block;color:#91a4bf;text-align:center;font-size:11px;padding:12px 20px 28px; }
}
/* Login is the only submit action; recovery is an explicit navigation. */
.login-submit-actions { display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px; }
.login-submit-actions .login-primary { margin:0; }
.login-recovery-button { display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:10px 18px;border:1px solid #bcd2f2;border-radius:10px;background:#f4f8ff;color:#185bb3;font-size:15px;font-weight:600;text-decoration:none; }
.login-recovery-button:hover { background:#e8f1ff; }
.login-first-entry { margin:18px 0 0;color:#536d8d;font-size:14px;line-height:1.7; }
.login-first-entry a { color:#1665d8;font-weight:600; }
.login-recovery-confirm { display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.6;color:#365579; }
.login-recovery-confirm input { flex:0 0 18px;width:18px;height:18px;margin:2px 0 0;accent-color:#1665d8; }
.login-state-notice { padding:12px 14px; border:1px solid #c9ddfa; border-radius:10px; background:#edf5ff; color:#244b7d; font-size:14px; line-height:1.6; }
.login-state-notice p { margin:0; }
.login-state-notice a { display:inline-flex; margin-top:8px; padding:7px 12px; border-radius:7px; background:#155dcc; color:#fff; font-weight:700; text-decoration:none; }
.login-state-notice a[hidden] { display:none; }
.login-state-notice[data-mode="password"] { background:#f4f8fc; border-color:#d9e4ef; }
.login-state-notice[data-mode="needs-help"], .login-state-notice[data-mode="unavailable"] { background:#fff8ec; border-color:#edd2a3; color:#754e15; }
.login-temp-dialog { box-sizing:border-box; width:min(460px,calc(100vw - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:24px; border:1px solid #d6e4f7; border-radius:20px; background:#fff; color:#173a70; overflow:auto; box-shadow:0 24px 80px #102b6340; }
.login-temp-dialog::backdrop { background:rgba(16,32,60,.5); backdrop-filter:blur(3px); }
.login-temp-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.login-temp-heading h2 { margin:0; font-size:22px; color:#102b63; }
.login-temp-heading button { width:40px; height:40px; flex:none; padding:0; border:1px solid #d6e4f7; border-radius:10px; background:#f4f8ff; color:#244b7d; font-size:26px; cursor:pointer; }
.login-temp-description,.login-temp-dialog [role="status"] { margin:12px 0; font-size:14px; line-height:1.6; }
.login-temp-phone { margin:12px 0; font-size:15px; font-weight:600; }
.login-temp-dialog .login-temp-box { margin:14px 0; }
.login-temp-actions { display:flex; gap:10px; flex-wrap:wrap; }
.login-temp-actions .login-primary { flex:1; width:auto; margin:0; font-size:15px; padding:12px; min-height:48px; }
.login-temp-dialog .login-field-hint { margin:12px 0 0; font-size:13px; }
body:has(.login-temp-dialog[open]) { overflow:hidden; }