/* ===== RssUnion 会员入口 ===== */
.ru-auth-nav-item{display:flex;align-items:center;gap:8px;margin:0;padding:0;list-style:none;}
/* 按钮自己的容器也要 flex，否则两个 inline-flex 会贴在一起（li 的 gap 管不到孙子） */
.ru-nav-item{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;}
.ru-auth-btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;
  height:30px;padding:0 12px;margin:0;border-radius:999px;border:1px solid var(--pico-muted-border-color,#d8dbe0);
  background:transparent;color:inherit;font-size:13px;line-height:1;
  font-family:inherit;font-weight:500;cursor:pointer;white-space:nowrap;box-shadow:none;
  text-decoration:none;transition:background .15s ease,border-color .15s ease,color .15s ease;}
.ru-auth-btn:hover{background:var(--pico-secondary-background,rgba(0,0,0,.05));color:inherit;}
.ru-auth-btn--primary{background:var(--pico-primary,#0172ad);border-color:var(--pico-primary,#0172ad);
  color:var(--pico-primary-inverse,#fff);}
.ru-auth-btn--primary:hover{background:var(--pico-primary-hover,#015d8e);border-color:var(--pico-primary-hover,#015d8e);
  color:var(--pico-primary-inverse,#fff);}
/* 账户区（1.9.229 回退）
   1.9.228 试过「昵称去框 + 退出退成纯文字按钮 + 一条竖线分隔」，
   实际排下来比导航按钮更碎，读起来像缺了边框的残片。
   现在回到原样：昵称、退出都是描边胶囊，高度 30px、圆角 999px、1px 边框
   跟「申请入驻 / 审核结果」完全一致；竖线一并去掉（两个胶囊自带边框，再加线是重复的）。
   边框色优先取主题的 --ui-border（和 .nav-act 同源，深浅色主题各自对），
   取不到才退回 pico 变量 / 硬编码灰。 */
.ru-auth-user{display:inline-flex;align-items:center;gap:6px;max-width:160px;height:30px;padding:0 12px;
  margin:0;flex:0 0 auto;
  border-radius:999px;border:1px solid var(--ui-border,var(--pico-muted-border-color,#d8dbe0));text-decoration:none;
  color:inherit;font-size:13px;font-weight:500;line-height:1;}
.ru-auth-user:hover{background:var(--pico-secondary-background,rgba(0,0,0,.05));color:inherit;}
.ru-auth-user__dot{width:6px;height:6px;border-radius:50%;background:#22c55e;flex:0 0 auto;}
.ru-auth-user__name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
/* 用户名后面的「退出」小按钮：与导航胶囊同款（30px 高 / 999px 圆角 / 1px 描边） */
.ru-auth-out{display:inline-flex;align-items:center;justify-content:center;height:30px;width:auto;
  padding:0 10px;margin:0;flex:0 0 auto;border-radius:999px;
  border:1px solid var(--ui-border,var(--pico-muted-border-color,#d8dbe0));
  background:transparent;background-color:transparent;color:var(--pico-secondary,#6b7280);
  font-family:inherit;font-size:12.5px;font-weight:500;line-height:1;white-space:nowrap;
  cursor:pointer;box-shadow:none;transition:background .15s ease,border-color .15s ease,color .15s ease;}
.ru-auth-out:hover{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.35);color:#dc2626;}
.ru-auth-out:disabled{opacity:.55;cursor:not-allowed;}
[data-theme="dark"] .ru-auth-out:hover{background:rgba(248,113,113,.14);border-color:rgba(248,113,113,.4);color:#fca5a5;}
/* 窄屏收进汉堡面板：面板是竖排的，昵称放开宽度、退出压小一档 */
@media (max-width:1023px){
  .ru-auth-user{max-width:none;}
  .ru-auth-out{padding:0 8px;font-size:12px;}
}

/* 轻提示（退出成功 / 失败） */
.ru-toast{position:fixed;left:50%;bottom:36px;transform:translateX(-50%);z-index:100000;
  max-width:calc(100vw - 40px);padding:9px 16px;border-radius:999px;
  background:rgba(17,24,39,.92);color:#fff;font-family:inherit;font-size:13px;line-height:1.5;
  box-shadow:0 8px 24px rgba(0,0,0,.25);pointer-events:none;
  transition:opacity .3s ease,transform .3s ease;}
.ru-toast.is-err{background:rgba(185,28,28,.95);}
.ru-toast.is-out{opacity:0;transform:translateX(-50%) translateY(6px);}

/* 浮动兜底（没找到导航栏时） */
.ru-auth-float{position:fixed;top:14px;right:14px;z-index:9000;display:flex;gap:8px;}

/* ===== 弹窗 ===== */
.ru-modal{position:fixed;inset:0;z-index:99999;display:flex;align-items:center;justify-content:center;
  padding:16px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",sans-serif;}
.ru-modal[hidden]{display:none;}
.ru-modal__mask{position:absolute;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(2px);}
.ru-modal__dialog{position:relative;width:100%;max-width:400px;max-height:calc(100vh - 32px);overflow:auto;
  background:var(--pico-background-color,#fff);color:inherit;
  border:1px solid var(--pico-muted-border-color,#e5e7eb);border-radius:14px;
  box-shadow:0 24px 60px rgba(15,23,42,.22);padding:22px 22px 18px;
  animation:ru-auth-in .18s ease-out;}
@keyframes ru-auth-in{from{opacity:0;transform:translateY(10px) scale(.985);}to{opacity:1;transform:none;}}
.ru-modal__close{position:absolute;top:10px;right:10px;width:30px;height:30px;padding:0;margin:0;
  display:flex;align-items:center;justify-content:center;border:0;border-radius:8px;background:transparent;
  color:var(--pico-secondary,#6b7280);font-size:20px;line-height:1;cursor:pointer;box-shadow:none;}
.ru-modal__close:hover{background:var(--pico-secondary-background,rgba(0,0,0,.06));}
.ru-modal__title{margin:0 0 2px;padding:0;font-size:18px;font-weight:700;line-height:1.4;color:inherit;}
.ru-modal__sub{margin:0 0 16px;font-size:12.5px;color:var(--pico-secondary,#6b7280);line-height:1.6;}

.ru-modal .ru-auth-tabs{display:flex;gap:6px;padding:3px;margin:0 0 16px;border-radius:10px;
  background:rgba(0,0,0,.055);}
.ru-modal .ru-auth-tabs .ru-auth-tab{flex:1 1 0;height:32px;margin:0;padding:0;border:0;border-radius:8px;
  background:transparent;background-color:transparent;color:#6b7280;
  font-family:inherit;font-size:13.5px;font-weight:600;line-height:1.4;cursor:pointer;box-shadow:none;}
.ru-modal .ru-auth-tabs .ru-auth-tab:hover{background-color:rgba(0,0,0,.06);}
/* 注意：Pico 会在 button 内部把 --pico-background-color 重定义成主色，
   所以选中态这里不能用那个变量，直接写死浅色/深色两套 */
.ru-modal .ru-auth-tabs .ru-auth-tab.is-active{background:#ffffff;background-color:#ffffff;color:#1f2937;
  box-shadow:0 1px 3px rgba(15,23,42,.12);}
[data-theme="dark"] .ru-modal .ru-auth-tabs{background:rgba(255,255,255,.07);}
[data-theme="dark"] .ru-modal .ru-auth-tabs .ru-auth-tab{color:#9aa4b2;}
[data-theme="dark"] .ru-modal .ru-auth-tabs .ru-auth-tab:hover{background-color:rgba(255,255,255,.06);}
[data-theme="dark"] .ru-modal .ru-auth-tabs .ru-auth-tab.is-active{background:#2b323c;background-color:#2b323c;
  color:#e8eaed;box-shadow:0 1px 3px rgba(0,0,0,.35);}

.ru-auth-field{margin:0 0 13px;}
.ru-auth-field>label{display:block;margin:0 0 5px;font-size:12.5px;font-weight:600;
  color:inherit;line-height:1.5;}
.ru-modal .ru-auth-input{display:block;width:100%;height:38px;margin:0;padding:0 11px;
  border:1px solid var(--pico-muted-border-color,#d8dbe0);border-radius:9px;
  background:var(--pico-form-element-background-color,transparent);color:inherit;
  font-family:inherit;font-size:14px;line-height:36px;box-shadow:none;outline:none;
  transition:border-color .15s ease,box-shadow .15s ease;}
.ru-modal .ru-auth-input:focus{border-color:var(--pico-primary,#0172ad);box-shadow:0 0 0 3px rgba(1,114,173,.14);}
.ru-modal .ru-auth-input::placeholder{color:var(--pico-secondary,#9ca3af);font-size:13px;}
.ru-modal .ru-auth-input[type=search]{background-image:none;}

.ru-auth-row{display:flex;align-items:center;gap:8px;}
.ru-auth-row .ru-auth-input{flex:1 1 auto;min-width:0;}
.ru-modal .ru-auth-code-btn{flex:0 0 auto;height:38px;margin:0;padding:0 12px;border-radius:9px;
  border:1px solid var(--pico-primary,#0172ad);background:transparent;background-color:transparent;
  color:var(--pico-primary,#0172ad);font-family:inherit;font-size:13px;font-weight:600;
  line-height:1.4;white-space:nowrap;cursor:pointer;box-shadow:none;}
.ru-modal .ru-auth-code-btn:hover{background-color:rgba(1,114,173,.08);}
.ru-modal .ru-auth-code-btn:disabled{opacity:.55;cursor:not-allowed;border-color:var(--pico-muted-border-color,#d8dbe0);
  color:var(--pico-secondary,#6b7280);background-color:transparent;}

.ru-modal .ru-auth-remember{display:flex;align-items:center;gap:7px;margin:-2px 0 14px;font-size:12.5px;
  color:var(--pico-secondary,#6b7280);line-height:1.6;cursor:pointer;}
.ru-modal .ru-auth-remember input[type=checkbox]{margin:0;padding:0;width:15px;height:15px;flex:0 0 auto;
  accent-color:var(--pico-primary,#0172ad);box-shadow:none;}
.ru-auth-remember span{margin:0;}

/* 注册协议勾选行（1.9.87）：继承 remember 的排版，链接强调色可点开新窗口 */
.ru-modal .ru-auth-agree{margin:2px 0 12px;align-items:flex-start;}
.ru-modal .ru-auth-agree input[type=checkbox]{margin-top:3px;}
.ru-modal .ru-auth-agree a{color:var(--pico-primary,#0172ad);font-weight:600;text-decoration:none;}
.ru-modal .ru-auth-agree a:hover{text-decoration:underline;}

.ru-modal .ru-auth-submit{display:block;width:100%;height:40px;margin:6px 0 0;padding:0 14px;border:0;
  border-radius:10px;background:var(--pico-primary,#0172ad);background-color:var(--pico-primary,#0172ad);
  color:var(--pico-primary-inverse,#fff);font-family:inherit;font-size:14.5px;font-weight:600;
  line-height:1.4;cursor:pointer;box-shadow:none;transition:filter .15s ease;}
.ru-modal .ru-auth-submit:hover{filter:brightness(1.06);}
.ru-modal .ru-auth-submit:disabled{opacity:.6;cursor:not-allowed;filter:none;}

.ru-auth-msg{display:none;margin:0 0 12px;padding:9px 11px;border-radius:9px;font-size:12.5px;line-height:1.6;}
.ru-auth-msg.is-show{display:block;}
.ru-auth-msg.is-err{background:rgba(220,38,38,.09);color:#dc2626;border:1px solid rgba(220,38,38,.18);}
.ru-auth-msg.is-ok{background:rgba(22,163,74,.09);color:#16a34a;border:1px solid rgba(22,163,74,.18);}

.ru-auth-foot{margin:14px 0 0;padding:0;display:flex;align-items:center;justify-content:space-between;
  gap:10px;font-size:12.5px;color:var(--pico-secondary,#6b7280);}
.ru-modal .ru-auth-link{margin:0;padding:0;border:0;background:none;color:var(--pico-primary,#0172ad);
  font-family:inherit;font-size:12.5px;cursor:pointer;text-decoration:none;box-shadow:none;}
.ru-modal .ru-auth-link:hover{text-decoration:underline;}
.ru-auth-tip{margin:10px 0 0;font-size:11.5px;color:var(--pico-secondary,#9ca3af);line-height:1.6;}

@media (max-width:520px){
  .ru-modal{align-items:flex-end;padding:0;}
  .ru-modal__dialog{max-width:none;border-radius:16px 16px 0 0;padding:20px 18px 16px;}
  .ru-auth-user{max-width:120px;}
  .ru-auth-out{padding:0 8px;font-size:12px;}
}
@media (prefers-color-scheme:dark){
  .ru-modal__dialog{box-shadow:0 24px 60px rgba(0,0,0,.5);}
  .ru-auth-msg.is-err{background:rgba(248,113,113,.13);color:#fca5a5;border-color:rgba(248,113,113,.25);}
  .ru-auth-msg.is-ok{background:rgba(74,222,128,.12);color:#86efac;border-color:rgba(74,222,128,.25);}
}
/* ===== 视觉对齐（2026-10）：与主题 static/css/ui.css 同一套设计语言 =====
   这里所有取值都写成 var(--ui-*, 兜底值)：ui.css 在时跟随全站 token，
   不在时（换了别的主题）仍退回原来的观感，不会变成一坨没定义的颜色。 */
.ru-auth-btn,
.ru-auth-out {
  height: 30px;
  padding: 0 12px;
  border: 1px solid var(--ui-border, rgba(0, 0, 0, .12));
  border-radius: 999px;
  background: transparent;
  color: var(--ui-text-2, inherit);
  font-size: 12.5px;
  font-weight: 500;
}
.ru-auth-btn:hover,
.ru-auth-out:hover {
  background: var(--ui-surface-3, rgba(0, 0, 0, .05));
  border-color: var(--ui-border, rgba(0, 0, 0, .12));
  color: var(--ui-text, inherit);
}
.ru-auth-btn--primary,
.ru-auth-btn--primary:hover {
  background: var(--ui-accent, #0172ad);
  border-color: transparent;
  color: #fff;
  font-weight: 600;
}
.ru-auth-btn--primary:hover { filter: brightness(1.06); }
.ru-auth-user {
  height: 30px;
  padding: 0 10px;
  border-radius: 999px;
  color: var(--ui-text, inherit);
  font-size: 13px;
  font-weight: 600;
}
.ru-auth-user:hover { background: var(--ui-surface-3, rgba(0, 0, 0, .05)); }
.ru-auth-user__dot { background: var(--ui-green, #22c55e); }

/* ---- 弹窗 ---- */
.ru-modal__mask { background: rgba(9, 12, 18, .48); backdrop-filter: blur(5px); }
.ru-modal__dialog {
  max-width: 404px;
  padding: 26px 26px 22px;
  border: 1px solid var(--ui-border, #e5e8ee);
  border-radius: var(--ui-r-lg, 14px);
  background: var(--ui-surface, #fff);
  box-shadow: 0 28px 64px -24px rgba(9, 14, 22, .42);
  color: var(--ui-text, inherit);
}
.ru-modal__title { font-size: 17px; font-weight: 650; letter-spacing: -.01em; }
.ru-modal__sub { font-size: 12.5px; color: var(--ui-text-3, #858d99); }
.ru-modal__close { width: 28px; height: 28px; border-radius: var(--ui-r-sm, 6px); color: var(--ui-text-3, #858d99); }
.ru-modal__close:hover { background: var(--ui-surface-3, rgba(0, 0, 0, .06)); color: var(--ui-text, inherit); }

/* ---- 登录 / 注册 视图切换 ---- */
.ru-modal .ru-auth-tabs {
  padding: 3px;
  border-radius: var(--ui-r, 10px);
  background: var(--ui-surface-2, rgba(0, 0, 0, .05));
}
.ru-modal .ru-auth-tabs .ru-auth-tab {
  height: 30px;
  border-radius: 7px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--ui-text-3, #858d99);
}
.ru-modal .ru-auth-tabs .ru-auth-tab:hover { background-color: transparent; color: var(--ui-text, inherit); }
.ru-modal .ru-auth-tabs .ru-auth-tab.is-active {
  background: var(--ui-surface, #fff);
  background-color: var(--ui-surface, #fff);
  color: var(--ui-text, #14171c);
  font-weight: 600;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .10);
}
[data-theme="dark"] .ru-modal .ru-auth-tabs .ru-auth-tab.is-active {
  background: #232a34;
  background-color: #232a34;
  color: #eef1f5;
}

/* ---- 表单 ---- */
.ru-auth-field > label { font-size: 12px; font-weight: 600; color: var(--ui-text-2, #4a515c); }
.ru-modal .ru-auth-input {
  height: 40px;
  border: 1px solid var(--ui-border, #e5e8ee);
  border-radius: var(--ui-r, 10px);
  background: var(--ui-surface-2, #f7f8fa);
  color: var(--ui-text, inherit);
  font-size: 13px;
}
.ru-modal .ru-auth-input:focus {
  border-color: var(--ui-accent, #0172ad);
  background: var(--ui-surface, #fff);
  box-shadow: 0 0 0 3px var(--ui-accent-soft, rgba(1, 114, 173, .12));
  outline: none;
}
.ru-modal .ru-auth-submit {
  height: 40px;
  border-radius: var(--ui-r, 10px);
  background: var(--ui-accent, #0172ad);
  color: #fff;
  font-size: 13.5px;
  font-weight: 600;
}
.ru-auth-code-btn {
  height: 40px;
  border: 1px solid var(--ui-border, #e5e8ee);
  border-radius: var(--ui-r, 10px);
  background: var(--ui-surface, #fff);
  color: var(--ui-text-2, #4a515c);
  font-size: 12.5px;
}
.ru-auth-foot { font-size: 12.5px; }
.ru-auth-link { color: var(--ui-accent, #0172ad); }
.ru-auth-tip { color: var(--ui-text-3, #858d99); }

