/* ============================================================
   DMS 认证页沉浸式设计系统 (auth.css)
   适用：login.html / forgot_password.html
   取代旧的 login.css（login.css 保留为回滚兜底，不再被引用）
   依赖：variables.css 的 token（颜色/圆角/阴影/字体/缓动）
   形状一致性锁：玻璃卡 20px · 输入/按钮 12px · 品牌/功能徽章 12-18px · 信息条 12px
   ============================================================ */

/* ---------- 认证页语义变量：浅色沉浸（默认） ----------
   v4.16.2 R2：品牌调 --auth-* 全部改引 variables.css 令牌（原为硬编码 emerald，
   导致任意色板下登录页都残留医疗绿）。emerald 下逐值等值/近等值，零回归；
   中性玻璃层（卡片/占位符/深色 text-soft 等）保持中性值，跨色板通用。 */
:root {
  --auth-bg-1: var(--color-primary-50, #ECFDF5);
  --auth-bg-2: var(--color-primary-100, #D1FAE5);
  --auth-bg-3: var(--color-primary-200, #A7F3D0);
  --auth-glow: rgba(var(--primary-rgb), 0.28);

  --auth-shelf: rgba(var(--primary-rgb), 0.06);
  --auth-dots: rgba(var(--primary-rgb), 0.10);

  --auth-card-bg: rgba(255, 255, 255, 0.55);
  --auth-card-border: rgba(255, 255, 255, 0.7);
  --auth-card-hi: rgba(255, 255, 255, 0.8);
  --auth-card-shadow: 0 24px 60px -16px rgba(var(--primary-rgb), 0.38), 0 8px 24px -8px rgba(15, 23, 42, 0.18);

  --auth-text: var(--color-primary-900, #064E3B);
  --auth-text-soft: var(--color-gray-700, #334155);
  --auth-text-mut: var(--color-gray-500, #64748B);

  --auth-input-bg: rgba(255, 255, 255, 0.72);
  --auth-input-border: rgba(var(--primary-rgb), 0.2);
  --auth-input-text: var(--color-gray-900, #0F172A);
  --auth-placeholder: rgba(71, 85, 105, 0.7);

  --auth-chip-border: rgba(var(--primary-rgb), 0.26);
  --auth-chip-text: var(--color-primary-dark, #065F46);
  --auth-chip-hover: rgba(var(--primary-rgb), 0.08);

  /* 多类 flash 变体（浅色） */
  --auth-alert-danger-bg: rgba(254, 226, 226, 0.88);
  --auth-alert-danger-fg: #991B1B;
  --auth-alert-danger-bd: rgba(220, 38, 38, 0.28);
  --auth-alert-success-bg: rgba(209, 250, 229, 0.88);
  --auth-alert-success-fg: #065F46;
  --auth-alert-success-bd: rgba(5, 150, 105, 0.32);
  --auth-alert-info-bg: rgba(219, 234, 254, 0.88);
  --auth-alert-info-fg: #1E40AF;
  --auth-alert-info-bd: rgba(59, 130, 246, 0.28);
  --auth-alert-warning-bg: rgba(254, 243, 199, 0.92);
  --auth-alert-warning-fg: #92400E;
  --auth-alert-warning-bd: rgba(245, 158, 11, 0.32);
}

/* ---------- 认证页语义变量：深色沉浸 ---------- */
[data-theme="dark"] {
  --auth-bg-1: var(--color-primary-950, #022C22);
  --auth-bg-2: var(--color-primary-100, #064E3B);
  --auth-bg-3: var(--color-gray-900, #0F172A);
  --auth-glow: color-mix(in srgb, var(--color-primary-400, #34D399) 20%, transparent);

  --auth-shelf: rgba(255, 255, 255, 0.045);
  --auth-dots: rgba(255, 255, 255, 0.05);

  --auth-card-bg: rgba(15, 23, 42, 0.5);
  --auth-card-border: rgba(255, 255, 255, 0.14);
  --auth-card-hi: rgba(255, 255, 255, 0.18);
  --auth-card-shadow: 0 28px 64px -18px rgba(0, 0, 0, 0.62), 0 8px 24px -8px rgba(0, 0, 0, 0.45);

  --auth-text: #F1F5F9;
  --auth-text-soft: #CBD5E1;
  --auth-text-mut: #94A3B8;

  --auth-input-bg: rgba(255, 255, 255, 0.07);
  --auth-input-border: rgba(255, 255, 255, 0.16);
  --auth-input-text: #F1F5F9;
  --auth-placeholder: rgba(241, 245, 249, 0.5);

  --auth-chip-border: rgba(255, 255, 255, 0.2);
  --auth-chip-text: #E2E8F0;
  --auth-chip-hover: rgba(255, 255, 255, 0.08);

  /* 多类 flash 变体（深色） */
  --auth-alert-danger-bg: rgba(127, 29, 29, 0.55);
  --auth-alert-danger-fg: #FCA5A5;
  --auth-alert-danger-bd: rgba(239, 68, 68, 0.4);
  --auth-alert-success-bg: rgba(6, 78, 59, 0.55);
  --auth-alert-success-fg: #6EE7B7;
  --auth-alert-success-bd: rgba(16, 185, 129, 0.4);
  --auth-alert-info-bg: rgba(30, 58, 95, 0.55);
  --auth-alert-info-fg: #93C5FD;
  --auth-alert-info-bd: rgba(59, 130, 246, 0.4);
  --auth-alert-warning-bg: rgba(120, 53, 15, 0.5);
  --auth-alert-warning-fg: #FCD34D;
  --auth-alert-warning-bd: rgba(245, 158, 11, 0.4);
}

/* ============================================================
   场景容器 + 沉浸式背景层
   ============================================================ */
.auth-scene {
  position: relative;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: clamp(1rem, 4vh, 3rem) 1rem;
  font-family: var(--font-sans);
  color: var(--auth-text);
  overflow: hidden;
}

/* 背景层：单一容器 + 双伪元素（实景图 + 纱 / 暗角 / 辉光） */
.auth-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  /* v2.88.0 背景替换为图书馆实景（惠州学院官网公开宣传图，已本地化 webp，
     src 替换/下线：改本 url 即回滚为纯渐变底）。
     分层（上→下）：主题色 glow ×2（氛围）→ 中性纱（保文字/玻璃卡对比，
     浅色白纱 / 深色黑纱见 [data-theme="dark"] 段）→ 实景图。
     原「auth-bg-1/2/3 实底渐变」由「纱 + 实景」替代；主题识别由 glow /
     玻璃卡 / 按钮承担，实景作为恒定品牌底在全部主题下统一。 */
  background:
    radial-gradient(90% 70% at 12% 8%, var(--auth-glow), transparent 60%),
    radial-gradient(70% 60% at 92% 96%, var(--auth-glow), transparent 55%),
    linear-gradient(160deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.58) 46%, rgba(255, 255, 255, 0.42) 100%),
    url("../images/auth-library-bg.webp") center / cover no-repeat;
}

/* 照片边缘暗角（替代原档案架纹/点阵：纹理叠实景会显脏；
   暗角压住四缘，辅助小屏单列态的边缘留白与文字对比） */
.auth-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(120% 90% at 50% 42%, transparent 55%, rgba(15, 23, 42, 0.18) 100%);
}

/* 顶部柔光斑（呼吸动效见下方 motion 区） */
.auth-bg::after {
  content: "";
  position: absolute;
  top: -18%;
  left: -10%;
  width: 60vw;
  height: 60vw;
  max-width: 720px;
  max-height: 720px;
  background: radial-gradient(circle, var(--auth-glow), transparent 62%);
  filter: blur(8px);
  opacity: 0.85;
}

/* 实景背景上的文字可读性（v2.88.0）：浅色白影 / 深色黑影 */
[data-theme="dark"] .auth-subtitle,
[data-theme="dark"] .auth-feat__title,
[data-theme="dark"] .auth-feat__desc,
[data-theme="dark"] .auth-foot {
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.78);
}

/* 深色模式：纱换成黑纱压暗照片（glow 亮色光晕在其上仍提供主题氛围） */
[data-theme="dark"] .auth-bg {
  background:
    radial-gradient(90% 70% at 12% 8%, var(--auth-glow), transparent 60%),
    radial-gradient(70% 60% at 92% 96%, var(--auth-glow), transparent 55%),
    linear-gradient(160deg, rgba(10, 10, 14, 0.78) 0%, rgba(10, 10, 14, 0.55) 46%, rgba(10, 10, 14, 0.38) 100%),
    url("../images/auth-library-bg.webp") center / cover no-repeat;
}

/* 移动端：单列布局玻璃卡近满屏，换 768w 小图省流量 */
@media (max-width: 768px) {
  .auth-bg {
    background-image:
      radial-gradient(90% 70% at 12% 8%, var(--auth-glow), transparent 60%),
      radial-gradient(70% 60% at 92% 96%, var(--auth-glow), transparent 55%),
      linear-gradient(160deg, rgba(255, 255, 255, 0.82) 0%, rgba(255, 255, 255, 0.58) 46%, rgba(255, 255, 255, 0.42) 100%),
      url("../images/auth-library-bg-768.webp");
    background-size: auto, auto, auto, cover;
    background-position: center;
    background-repeat: no-repeat;
  }
  [data-theme="dark"] .auth-bg {
    background-image:
      radial-gradient(90% 70% at 12% 8%, var(--auth-glow), transparent 60%),
      radial-gradient(70% 60% at 92% 96%, var(--auth-glow), transparent 55%),
      linear-gradient(160deg, rgba(10, 10, 14, 0.78) 0%, rgba(10, 10, 14, 0.55) 46%, rgba(10, 10, 14, 0.38) 100%),
      url("../images/auth-library-bg-768.webp");
    background-size: auto, auto, auto, cover;
    background-position: center;
    background-repeat: no-repeat;
  }
}

/* ============================================================
   主题切换按钮（右上角玻璃小钮）
   ============================================================ */
.auth-theme-toggle {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  padding: 0;
  background: var(--auth-card-bg);
  border: 1px solid var(--auth-card-border);
  border-radius: var(--border-radius-full);
  color: var(--auth-text-soft);
  cursor: pointer;
  -webkit-backdrop-filter: blur(12px) saturate(150%);
  backdrop-filter: blur(12px) saturate(150%);
  transition: transform var(--transition), color var(--transition), border-color var(--transition);
}

.auth-theme-toggle:hover {
  color: var(--color-primary);
  transform: rotate(18deg);
}

.auth-theme-toggle:focus-visible {
  outline: none;
  box-shadow: var(--shadow-ring);
}

/* ============================================================
   毛玻璃登录卡（两页共用）
   ============================================================ */
.auth-card {
  position: relative;
  z-index: 1;
  width: min(420px, 92vw);
  padding: clamp(1.75rem, 4vw, 2.5rem);
  background: var(--auth-card-bg);
  border: 1px solid var(--auth-card-border);
  border-radius: var(--border-radius-2xl); /* 20px */
  box-shadow: var(--auth-card-shadow), inset 0 1px 0 var(--auth-card-hi);
  -webkit-backdrop-filter: blur(20px) saturate(160%);
  backdrop-filter: blur(20px) saturate(160%);
}

/* 头部：Logo 徽章 + 标题 + 副标题 */
.auth-head {
  text-align: center;
  margin-bottom: 1.5rem;
}

.auth-brand {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-bottom: 1rem;
  /* 白色毛玻璃「logo 铭牌」：灯笼以完整馆绿+朱砂红品牌色呈现（与 favicon 同源），
     不再压在色板渐变上——馆绿描边在 amber/violet/zcode 底上撞色（v4.16.2 R2 优化）。
     发丝描边与投影保留色板关联。 */
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(var(--primary-rgb), 0.18);
  border-radius: var(--border-radius-xl); /* 18px 视觉 */
  box-shadow: var(--shadow-primary);
  color: var(--on-primary);
}

[data-theme="dark"] .auth-brand {
  background: rgba(255, 255, 255, 0.95);
  border-color: rgba(var(--primary-rgb), 0.28);
}

.auth-brand svg {
  width: 32px;
  height: 32px;
}

.auth-title {
  margin: 0 0 0.35rem;
  font-size: 1.45rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.25;
  color: var(--auth-text);
}

.auth-subtitle {
  margin: 0;
  font-size: 0.85rem;
  color: var(--auth-text-mut);
  /* v2.88.0 实景背景上的文字可读性 */
  text-shadow: 0 1px 12px rgba(255, 255, 255, 0.65);
}

/* ============================================================
   两栏布局（桌面）：左品牌+功能面板 ｜ 右登录卡
   ============================================================ */
.auth-split {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1.08fr 0.92fr;
  align-items: center;
  gap: clamp(2rem, 5vw, 4rem);
  width: min(1000px, 94vw);
}

.auth-split .auth-card {
  justify-self: center;
}

.auth-brandcol {
  min-width: 0;
}

/* 左栏品牌块左对齐（桌面） */
.auth-brandcol .auth-head {
  text-align: left;
  margin-bottom: 1.75rem;
}

.auth-title--lg {
  font-size: clamp(1.6rem, 2.4vw, 2.05rem);
  line-height: 1.2;
  margin-bottom: 0.5rem;
}

/* v5.1 品牌统一：登录页大标题与印章 logo 同款衬线（官网 Noto Serif SC 家族），加宽字距
   v4.85.0 G4：字面栈收敛为全局 token（@font-face 由 fonts-noto-serif-sc.css 全局供给，
   消灭"写了 serif 栈但无资产供给"的隐性坏账） */
.auth-title--brand {
  font-family: var(--font-serif-sc);
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #123D2E;
}

/* 右栏卡片小标题（左栏已承载大品牌头，去除冗余） */
.auth-cardtitle {
  margin: 0 0 1.25rem;
  font-size: 1.1rem;
  font-weight: 600;
  text-align: center;
  color: var(--auth-text);
}

/* 两栏 → 单列（平板/移动） */
@media (max-width: 899px) {
  .auth-split {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
    gap: 1.5rem;
  }
  .auth-brandcol .auth-head {
    text-align: center;
  }
}

/* ============================================================
   表单
   ============================================================ */
.auth-form {
  display: flex;
  flex-direction: column;
  gap: 1.05rem;
}

.auth-field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.auth-label {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--auth-text-soft);
}

.auth-label.required::after {
  content: " *";
  color: var(--color-danger);
}

.auth-input {
  width: 100%;
  height: 48px;
  padding: 0 0.95rem;
  font-size: 0.95rem;
  font-family: inherit;
  color: var(--auth-input-text);
  background: var(--auth-input-bg);
  border: 1px solid var(--auth-input-border);
  border-radius: var(--border-radius-lg); /* 12px */
  transition: border-color var(--transition), box-shadow var(--transition), background-color var(--transition);
}

.auth-input::placeholder {
  color: var(--auth-placeholder);
}

.auth-input:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: var(--shadow-ring);
}

/* 规避浏览器 autofill 强制不透明底色（成熟实践：内阴影盖底 + 文字填色） */
.auth-input:-webkit-autofill,
.auth-input:-webkit-autofill:hover,
.auth-input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--auth-input-text);
  -webkit-box-shadow: 0 0 0 1000px var(--auth-input-bg) inset;
  caret-color: var(--auth-input-text);
  transition: background-color 9999s ease-in-out 0s;
}

/* ============================================================
   按钮
   ============================================================ */
.auth-btn {
  width: 100%;
  height: 48px;
  font-size: 0.98rem;
  font-weight: 600;
  font-family: inherit;
  border: 1px solid transparent;
  border-radius: var(--border-radius-lg); /* 12px */
  cursor: pointer;
  transition: transform var(--transition-fast), background-color var(--transition), box-shadow var(--transition), border-color var(--transition);
}

.auth-btn--primary {
  background: linear-gradient(140deg, var(--color-primary), var(--color-primary-hover));
  color: var(--on-primary);
  box-shadow: var(--shadow-primary);
}

.auth-btn--primary:hover {
  transform: translateY(-1px);
  box-shadow: 0 8px 22px rgba(var(--primary-rgb), 0.32);
}

.auth-btn--outline {
  background: transparent;
  color: var(--auth-text-soft);
  border-color: var(--auth-input-border);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.auth-btn--outline:hover {
  color: var(--color-primary);
  border-color: var(--color-primary);
  background: var(--auth-chip-hover);
}

.auth-btn:active {
  transform: scale(0.985);
}

.auth-btn:focus-visible {
  outline: none;
  box-shadow: var(--shadow-ring);
}

/* 两按钮并排（忘记密码页 返回登录 + 提交请求） */
.auth-actions {
  display: flex;
  gap: 0.75rem;
  margin-top: 0.25rem;
}

.auth-actions .auth-btn {
  flex: 1;
}

/* ============================================================
   多类 flash 警示条（卡内）
   ============================================================ */
.auth-alert {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  padding: 0.75rem 0.85rem;
  border-radius: var(--border-radius-lg);
  border: 1px solid transparent;
  font-size: 0.84rem;
  line-height: 1.5;
  margin-bottom: 1.05rem;
}

.auth-alert svg {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: 1px;
}

.auth-alert--danger  { background: var(--auth-alert-danger-bg);  color: var(--auth-alert-danger-fg);  border-color: var(--auth-alert-danger-bd); }
.auth-alert--success { background: var(--auth-alert-success-bg); color: var(--auth-alert-success-fg); border-color: var(--auth-alert-success-bd); }
.auth-alert--info    { background: var(--auth-alert-info-bg);    color: var(--auth-alert-info-fg);    border-color: var(--auth-alert-info-bd); }
.auth-alert--warning { background: var(--auth-alert-warning-bg); color: var(--auth-alert-warning-fg); border-color: var(--auth-alert-warning-bd); }

/* 兼容旧模板里残留的 .alert / .alert-danger（forgot_password 多类） */
.auth-card .alert { border-radius: var(--border-radius-lg); }

/* ============================================================
   说明框（忘记密码页）
   ============================================================ */
.auth-info-note {
  display: flex;
  gap: 0.5rem;
  padding: 0.7rem 0.85rem;
  font-size: 0.8rem;
  line-height: 1.55;
  color: var(--auth-text-soft);
  background: var(--auth-chip-hover);
  border: 1px solid var(--auth-input-border);
  border-radius: var(--border-radius-lg);
}

.auth-info-note strong {
  color: var(--auth-text);
}

/* ============================================================
   辅助链接（忘记密码 / 返回登录）
   ============================================================ */
.auth-link {
  display: inline-block;
  margin-top: 0.25rem;
  font-size: 0.84rem;
  color: var(--color-primary);
  text-decoration: none;
  transition: color var(--transition);
}

.auth-link:hover {
  color: var(--color-primary-hover);
  text-decoration: underline;
}

.auth-link-sep { margin: 0 6px; opacity: 0.5; }

.auth-foot-hint {
  margin-top: 1.1rem;
  text-align: center;
  font-size: 0.82rem;
  color: var(--auth-text-mut);
}

/* ============================================================
   特色功能项（左栏品牌列，取代旧芯片条）
   ============================================================ */
.auth-feat {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  max-width: 420px;
}

.auth-feat__item {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.auth-feat__icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: var(--border-radius-lg); /* 12px */
  background: linear-gradient(140deg, var(--color-primary), var(--color-primary-dark));
  color: var(--on-primary);
  box-shadow: var(--shadow-primary);
  transition: box-shadow var(--transition), transform var(--transition);
}

.auth-feat__icon svg {
  width: 22px;
  height: 22px;
}

/* 仅图标徽章做悬停反馈（避免与入场动画 fill 的 transform 冲突） */
.auth-feat__item:hover .auth-feat__icon {
  transform: scale(1.06);
  box-shadow: 0 10px 24px rgba(var(--primary-rgb), 0.42);
}

.auth-feat__body {
  min-width: 0;
}

.auth-feat__title {
  margin: 0 0 0.15rem;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.3;
  color: var(--auth-text);
  text-shadow: 0 1px 10px rgba(255, 255, 255, 0.6);
}

.auth-feat__desc {
  margin: 0;
  font-size: 0.82rem;
  line-height: 1.45;
  color: var(--auth-text-mut);
  text-shadow: 0 1px 10px rgba(255, 255, 255, 0.55);
}

/* ============================================================
   页脚（极淡）
   ============================================================ */
.auth-foot {
  position: relative;
  z-index: 1;
  margin-top: 1.5rem;
  text-align: center;
  font-size: 0.72rem;
  letter-spacing: 0.02em;
  color: var(--auth-text); /* v2.88.0：mut 灰在实景台阶上不可读，改主文字色 */
  opacity: 0.92;
  text-shadow: 0 1px 12px rgba(255, 255, 255, 0.75);
}

.auth-foot code {
  font-family: var(--font-mono);
  font-size: 0.7rem;
  opacity: 0.85;
}

/* ============================================================
   动效（仅在允许动效时启用；reduced-motion 下元素保持可见静态）
   ============================================================ */
@keyframes auth-rise {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes auth-glow {
  from { opacity: 0.6; transform: translate3d(0, 0, 0); }
  to   { opacity: 0.95; transform: translate3d(2%, 2%, 0); }
}

@media (prefers-reduced-motion: no-preference) {
  .auth-card { animation: auth-rise 0.6s var(--ease-out) both; }
  .auth-bg::after { animation: auth-glow 7s ease-in-out infinite alternate; }
  .auth-brandcol { animation: auth-rise 0.6s var(--ease-out) both; animation-delay: 0.05s; }
  .auth-feat__item { animation: auth-rise 0.5s var(--ease-out) both; }
  .auth-feat__item:nth-child(1) { animation-delay: 0.20s; }
  .auth-feat__item:nth-child(2) { animation-delay: 0.30s; }
  .auth-feat__item:nth-child(3) { animation-delay: 0.40s; }
}

/* ============================================================
   降级 1：无 backdrop-filter 支持 → 不透明实心面板
   ============================================================ */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root { --auth-card-bg: rgba(255, 255, 255, 0.94); }
  [data-theme="dark"] { --auth-card-bg: rgba(30, 41, 59, 0.94); }
  .auth-card,
  .auth-theme-toggle { -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* ============================================================
   降级 2：用户偏好减少透明 → 实心面板，关闭模糊
   ============================================================ */
@media (prefers-reduced-transparency: reduce) {
  :root {
    --auth-card-bg: #FFFFFF;
    --auth-card-border: rgba(6, 95, 70, 0.18);
    --auth-input-bg: #FFFFFF;
  }
  [data-theme="dark"] {
    --auth-card-bg: #1E293B;
    --auth-card-border: #334155;
    --auth-input-bg: #334155;
  }
  .auth-card,
  .auth-theme-toggle { -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* ============================================================
   响应式：移动端收窄
   ============================================================ */
@media (max-width: 480px) {
  .auth-card { padding: 1.5rem 1.25rem; }
  .auth-title { font-size: 1.3rem; }
  .auth-brand { width: 54px; height: 54px; }
  .auth-brand svg { width: 28px; height: 28px; }
  .auth-title--lg { font-size: 1.4rem; }
  .auth-feat { gap: 0.7rem; }
  .auth-feat__icon { width: 38px; height: 38px; }
  .auth-feat__icon svg { width: 19px; height: 19px; }
  .auth-feat__title { font-size: 0.92rem; }
  .auth-actions { flex-direction: column-reverse; }
  .auth-actions .auth-btn { width: 100%; }
  /* 移动端精简纹理，省 GPU */
  .auth-bg::before { background-size: 100% 100%, 28px 28px; opacity: 0.6; }
}

/* ============================================================
   色彩主题：ZCode 蓝（v2.84.0）— 认证页覆写
   配色来源：zcode.z.ai 官网。浅色 Apple 风 #0071E3 + #F5F5F7；
   深色炭黑 #0D0D0F/#161616 + 强调青 #00A5EF。
   品牌绿 rgba 已 token 化为 var(--primary-rgb)，随主题自动切换；
   此处仅覆写剩余十六进制品牌 token，success 语义保留绿色。
   ============================================================ */

/* ---------- ZCode 蓝 · 浅色 ---------- */
[data-palette="zcode"] {
  --auth-bg-1: #F5F5F7;
  --auth-bg-2: #E8E8ED;
  --auth-bg-3: #D6EAFF;
  --auth-glow: rgba(var(--primary-rgb), 0.22);

  --auth-shelf: rgba(29, 29, 31, 0.05);
  --auth-dots: rgba(0, 113, 227, 0.08);

  --auth-card-bg: rgba(255, 255, 255, 0.62);
  --auth-card-border: rgba(255, 255, 255, 0.75);
  --auth-card-hi: rgba(255, 255, 255, 0.85);
  --auth-card-shadow: 0 24px 60px -16px rgba(0, 88, 176, 0.28), 0 8px 24px -8px rgba(15, 23, 42, 0.16);

  --auth-text: #1D1D1F;
  --auth-text-soft: #3A3A3C;
  --auth-text-mut: #6E6E73;

  --auth-input-bg: rgba(255, 255, 255, 0.78);
  --auth-input-border: rgba(29, 29, 31, 0.18);
  --auth-input-text: #1D1D1F;
  --auth-placeholder: rgba(110, 110, 115, 0.7);

  --auth-chip-border: rgba(0, 113, 227, 0.24);
  --auth-chip-text: #0058B0;
  --auth-chip-hover: rgba(var(--primary-rgb), 0.08);
}

/* ---------- ZCode 蓝 · 深色（炭黑 + 青蓝） ---------- */
[data-palette="zcode"][data-theme="dark"] {
  --auth-bg-1: #0D0D0F;
  --auth-bg-2: #161616;
  --auth-bg-3: #04202F;
  --auth-glow: rgba(0, 165, 239, 0.18);

  --auth-card-bg: rgba(22, 22, 22, 0.55);
  --auth-card-border: rgba(255, 255, 255, 0.12);
  --auth-card-hi: rgba(255, 255, 255, 0.16);
  --auth-card-shadow: 0 28px 64px -18px rgba(0, 0, 0, 0.66), 0 8px 24px -8px rgba(0, 0, 0, 0.5);

  --auth-text: #F5F5F7;
  --auth-text-soft: #D2D2D7;
  --auth-text-mut: #86868B;

  --auth-input-bg: rgba(255, 255, 255, 0.06);
  --auth-input-border: rgba(255, 255, 255, 0.14);
  --auth-input-text: #F5F5F7;
  --auth-placeholder: rgba(245, 245, 247, 0.45);

  --auth-chip-border: rgba(0, 165, 239, 0.3);
  --auth-chip-text: #7FCBEE;
  --auth-chip-hover: rgba(0, 165, 239, 0.1);
}

/* ============================================================
   色彩主题：琥珀档案 / 黛紫 / 石墨（v2.86.0）
   覆写范围对齐上方 zcode 段：仅覆写十六进制品牌 token，
   基于 var(--primary-rgb) 派生的 glow/dots/chip-hover 自动随主题；
   alert 语义色跨主题保留，不覆写。
   ============================================================ */

/* ---------- 琥珀档案 · 浅色（暖纸 + 琥珀棕） ---------- */
[data-palette="archive"] {
  --auth-bg-1: #FFFBEB;
  --auth-bg-2: #FEF3C7;
  --auth-bg-3: #FDE68A;
  --auth-glow: rgba(var(--primary-rgb), 0.22);

  --auth-shelf: rgba(68, 64, 60, 0.05);
  --auth-dots: rgba(180, 83, 9, 0.08);

  --auth-card-bg: rgba(255, 255, 255, 0.62);
  --auth-card-border: rgba(255, 255, 255, 0.75);
  --auth-card-hi: rgba(255, 255, 255, 0.85);
  --auth-card-shadow: 0 24px 60px -16px rgba(120, 53, 15, 0.28), 0 8px 24px -8px rgba(28, 25, 23, 0.16);

  --auth-text: #78350F;
  --auth-text-soft: #44403C;
  --auth-text-mut: #78716C;

  --auth-input-bg: rgba(255, 255, 255, 0.78);
  --auth-input-border: rgba(68, 64, 60, 0.18);
  --auth-input-text: #292524;
  --auth-placeholder: rgba(120, 113, 108, 0.7);

  --auth-chip-border: rgba(180, 83, 9, 0.24);
  --auth-chip-text: #92400E;
  --auth-chip-hover: rgba(var(--primary-rgb), 0.08);
}

/* ---------- 琥珀档案 · 深色（深咖 + 琥珀金） ---------- */
[data-palette="archive"][data-theme="dark"] {
  --auth-bg-1: #1C1917;
  --auth-bg-2: #292524;
  --auth-bg-3: #451A03;
  --auth-glow: rgba(245, 158, 11, 0.16);

  --auth-card-bg: rgba(41, 37, 36, 0.55);
  --auth-card-border: rgba(255, 255, 255, 0.12);
  --auth-card-hi: rgba(255, 255, 255, 0.16);
  --auth-card-shadow: 0 28px 64px -18px rgba(0, 0, 0, 0.66), 0 8px 24px -8px rgba(0, 0, 0, 0.5);

  --auth-text: #FEF3C7;
  --auth-text-soft: #E7E5E4;
  --auth-text-mut: #A8A29E;

  --auth-input-bg: rgba(255, 255, 255, 0.06);
  --auth-input-border: rgba(255, 255, 255, 0.14);
  --auth-input-text: #FAFAF9;
  --auth-placeholder: rgba(250, 250, 249, 0.45);

  --auth-chip-border: rgba(245, 158, 11, 0.3);
  --auth-chip-text: #FCD34D;
  --auth-chip-hover: rgba(245, 158, 11, 0.1);
}

/* ---------- 黛紫 · 浅色（紫罗兰 + zinc） ---------- */
[data-palette="violet"] {
  --auth-bg-1: #F5F3FF;
  --auth-bg-2: #EDE9FE;
  --auth-bg-3: #DDD6FE;
  --auth-glow: rgba(var(--primary-rgb), 0.22);

  --auth-shelf: rgba(39, 39, 42, 0.05);
  --auth-dots: rgba(124, 58, 237, 0.08);

  --auth-card-bg: rgba(255, 255, 255, 0.62);
  --auth-card-border: rgba(255, 255, 255, 0.75);
  --auth-card-hi: rgba(255, 255, 255, 0.85);
  --auth-card-shadow: 0 24px 60px -16px rgba(76, 29, 149, 0.28), 0 8px 24px -8px rgba(24, 24, 27, 0.16);

  --auth-text: #4C1D95;
  --auth-text-soft: #3F3F46;
  --auth-text-mut: #71717A;

  --auth-input-bg: rgba(255, 255, 255, 0.78);
  --auth-input-border: rgba(63, 63, 70, 0.18);
  --auth-input-text: #27272A;
  --auth-placeholder: rgba(113, 113, 122, 0.7);

  --auth-chip-border: rgba(124, 58, 237, 0.24);
  --auth-chip-text: #6D28D9;
  --auth-chip-hover: rgba(var(--primary-rgb), 0.08);
}

/* ---------- 黛紫 · 深色（紫黑 + 提亮紫） ---------- */
[data-palette="violet"][data-theme="dark"] {
  --auth-bg-1: #131019;
  --auth-bg-2: #1D1926;
  --auth-bg-3: #2E1065;
  --auth-glow: rgba(167, 139, 250, 0.16);

  --auth-card-bg: rgba(29, 25, 38, 0.55);
  --auth-card-border: rgba(255, 255, 255, 0.12);
  --auth-card-hi: rgba(255, 255, 255, 0.16);
  --auth-card-shadow: 0 28px 64px -18px rgba(0, 0, 0, 0.66), 0 8px 24px -8px rgba(0, 0, 0, 0.5);

  --auth-text: #EDE9FE;
  --auth-text-soft: #D4D4D8;
  --auth-text-mut: #A1A1AA;

  --auth-input-bg: rgba(255, 255, 255, 0.06);
  --auth-input-border: rgba(255, 255, 255, 0.14);
  --auth-input-text: #F4F4F5;
  --auth-placeholder: rgba(244, 244, 245, 0.45);

  --auth-chip-border: rgba(167, 139, 250, 0.3);
  --auth-chip-text: #C4B5FD;
  --auth-chip-hover: rgba(167, 139, 250, 0.1);
}

/* ---------- 石墨 · 浅色（无彩 + 石墨黑） ---------- */
[data-palette="graphite"] {
  --auth-bg-1: #FAFAFA;
  --auth-bg-2: #F4F4F5;
  --auth-bg-3: #E4E4E7;
  --auth-glow: rgba(var(--primary-rgb), 0.08);

  --auth-shelf: rgba(24, 24, 27, 0.04);
  --auth-dots: rgba(24, 24, 27, 0.07);

  --auth-card-bg: rgba(255, 255, 255, 0.68);
  --auth-card-border: rgba(255, 255, 255, 0.8);
  --auth-card-hi: rgba(255, 255, 255, 0.9);
  --auth-card-shadow: 0 24px 60px -16px rgba(24, 24, 27, 0.18), 0 8px 24px -8px rgba(24, 24, 27, 0.1);

  --auth-text: #18181B;
  --auth-text-soft: #3F3F46;
  --auth-text-mut: #71717A;

  --auth-input-bg: rgba(255, 255, 255, 0.82);
  --auth-input-border: rgba(24, 24, 27, 0.16);
  --auth-input-text: #18181B;
  --auth-placeholder: rgba(113, 113, 122, 0.7);

  --auth-chip-border: rgba(24, 24, 27, 0.2);
  --auth-chip-text: #27272A;
  --auth-chip-hover: rgba(var(--primary-rgb), 0.06);
}

/* ---------- 石墨 · 深色（纯深灰 + 近白反转） ---------- */
[data-palette="graphite"][data-theme="dark"] {
  --auth-bg-1: #0A0A0A;
  --auth-bg-2: #171717;
  --auth-bg-3: #262626;
  --auth-glow: rgba(250, 250, 250, 0.07);

  --auth-card-bg: rgba(23, 23, 23, 0.6);
  --auth-card-border: rgba(255, 255, 255, 0.12);
  --auth-card-hi: rgba(255, 255, 255, 0.16);
  --auth-card-shadow: 0 28px 64px -18px rgba(0, 0, 0, 0.7), 0 8px 24px -8px rgba(0, 0, 0, 0.55);

  --auth-text: #FAFAFA;
  --auth-text-soft: #D4D4D8;
  --auth-text-mut: #A1A1AA;

  --auth-input-bg: rgba(255, 255, 255, 0.06);
  --auth-input-border: rgba(255, 255, 255, 0.14);
  --auth-input-text: #FAFAFA;
  --auth-placeholder: rgba(250, 250, 250, 0.45);

  --auth-chip-border: rgba(255, 255, 255, 0.22);
  --auth-chip-text: #E4E4E7;
  --auth-chip-hover: rgba(255, 255, 255, 0.08);
}

/* ============================================================
   色彩主题：清华紫 / 北大红（v2.87.0）
   覆写范围对齐上方各 palette 段：仅覆写十六进制品牌 token，
   基于 var(--primary-rgb) 派生项自动随主题；alert 语义色不覆写。
   ============================================================ */

/* ---------- 清华紫 · 浅色（官方紫 + 微紫冷灰） ---------- */
[data-palette="tsinghua"] {
  --auth-bg-1: #F9F3FB;
  --auth-bg-2: #F1E3F6;
  --auth-bg-3: #E0C6EC;
  --auth-glow: rgba(var(--primary-rgb), 0.22);

  --auth-shelf: rgba(30, 41, 59, 0.05);
  --auth-dots: rgba(102, 8, 116, 0.08);

  --auth-card-bg: rgba(255, 255, 255, 0.62);
  --auth-card-border: rgba(255, 255, 255, 0.75);
  --auth-card-hi: rgba(255, 255, 255, 0.85);
  --auth-card-shadow: 0 24px 60px -16px rgba(68, 6, 77, 0.28), 0 8px 24px -8px rgba(15, 23, 42, 0.16);

  --auth-text: #44064D;
  --auth-text-soft: #334155;
  --auth-text-mut: #64748B;

  --auth-input-bg: rgba(255, 255, 255, 0.78);
  --auth-input-border: rgba(51, 65, 85, 0.18);
  --auth-input-text: #1E293B;
  --auth-placeholder: rgba(100, 116, 139, 0.7);

  --auth-chip-border: rgba(102, 8, 116, 0.24);
  --auth-chip-text: #56075F;
  --auth-chip-hover: rgba(var(--primary-rgb), 0.08);
}

/* ---------- 清华紫 · 深色（紫黑 + 提亮官紫） ---------- */
[data-palette="tsinghua"][data-theme="dark"] {
  --auth-bg-1: #140B1B;
  --auth-bg-2: #1F1329;
  --auth-bg-3: #3A1145;
  --auth-glow: rgba(176, 108, 200, 0.16);

  --auth-card-bg: rgba(31, 19, 41, 0.55);
  --auth-card-border: rgba(255, 255, 255, 0.12);
  --auth-card-hi: rgba(255, 255, 255, 0.16);
  --auth-card-shadow: 0 28px 64px -18px rgba(0, 0, 0, 0.66), 0 8px 24px -8px rgba(0, 0, 0, 0.5);

  --auth-text: #F1E3F6;
  --auth-text-soft: #E2E8F0;
  --auth-text-mut: #94A3B8;

  --auth-input-bg: rgba(255, 255, 255, 0.06);
  --auth-input-border: rgba(255, 255, 255, 0.14);
  --auth-input-text: #F1F5F9;
  --auth-placeholder: rgba(241, 245, 249, 0.45);

  --auth-chip-border: rgba(176, 108, 200, 0.3);
  --auth-chip-text: #D9B4E6;
  --auth-chip-hover: rgba(176, 108, 200, 0.1);
}

/* ---------- 北大红 · 浅色（官方红 + 微暖灰） ---------- */
[data-palette="pku"] {
  --auth-bg-1: #FDF3F3;
  --auth-bg-2: #FBE4E4;
  --auth-bg-3: #F6C7C7;
  --auth-glow: rgba(var(--primary-rgb), 0.2);

  --auth-shelf: rgba(23, 23, 23, 0.05);
  --auth-dots: rgba(148, 7, 10, 0.08);

  --auth-card-bg: rgba(255, 255, 255, 0.62);
  --auth-card-border: rgba(255, 255, 255, 0.75);
  --auth-card-hi: rgba(255, 255, 255, 0.85);
  --auth-card-shadow: 0 24px 60px -16px rgba(99, 5, 7, 0.28), 0 8px 24px -8px rgba(23, 23, 23, 0.16);

  --auth-text: #630507;
  --auth-text-soft: #404040;
  --auth-text-mut: #737373;

  --auth-input-bg: rgba(255, 255, 255, 0.78);
  --auth-input-border: rgba(64, 64, 64, 0.18);
  --auth-input-text: #262626;
  --auth-placeholder: rgba(115, 115, 115, 0.7);

  --auth-chip-border: rgba(148, 7, 10, 0.24);
  --auth-chip-text: #7B0609;
  --auth-chip-hover: rgba(var(--primary-rgb), 0.08);
}

/* ---------- 北大红 · 深色（红黑 + 暖砖红） ---------- */
[data-palette="pku"][data-theme="dark"] {
  --auth-bg-1: #170C0C;
  --auth-bg-2: #221212;
  --auth-bg-3: #451212;
  --auth-glow: rgba(224, 106, 106, 0.16);

  --auth-card-bg: rgba(34, 18, 18, 0.55);
  --auth-card-border: rgba(255, 255, 255, 0.12);
  --auth-card-hi: rgba(255, 255, 255, 0.16);
  --auth-card-shadow: 0 28px 64px -18px rgba(0, 0, 0, 0.66), 0 8px 24px -8px rgba(0, 0, 0, 0.5);

  --auth-text: #FBE4E4;
  --auth-text-soft: #E5E5E5;
  --auth-text-mut: #A3A3A3;

  --auth-input-bg: rgba(255, 255, 255, 0.06);
  --auth-input-border: rgba(255, 255, 255, 0.14);
  --auth-input-text: #F5F5F5;
  --auth-placeholder: rgba(245, 245, 245, 0.45);

  --auth-chip-border: rgba(224, 106, 106, 0.3);
  --auth-chip-text: #F0B4B4;
  --auth-chip-hover: rgba(224, 106, 106, 0.1);
}