/* ============ 基元律动测试论坛 · linux.do/Discourse 风格 ============ */
:root {
  --bg: #f2f3f5;
  --card: #ffffff;
  --card-2: #f7f8f9;
  --text: #1d2129;
  --muted: #86909c;
  --line: #e5e8eb;
  --link: #0b6fb4;
  --primary: #16181d;
  --primary-hover: #2b2e35;
  --primary-text: #ffffff;
  --danger: #e5534b;
  --warm: #e5534b;
  --ok: #2da44e;
  --shadow: 0 1px 2px rgba(0, 0, 0, .04);
  --radius: 10px;
  /* 蛋黄主题色：与登录页同款，供顶栏选中标签等元素复用（.au-wrap 内另有同名局部变量） */
  --yolk: #FF9E1B;
  --yolk-deep: #FF7A00;
  /* 声明配色方案：让浏览器原生控件（滚动条、输入框等）跟随主题渲染 */
  color-scheme: light;
}
[data-theme="dark"] {
  --bg: #0f1114;
  --card: #171a1f;
  --card-2: #1d2127;
  --text: #d6d9dd;
  --muted: #7c838c;
  --line: #272b31;
  --link: #4aa3e0;
  --primary: #e8eaed;
  --primary-hover: #f5f6f7;
  --primary-text: #15171a;
  --danger: #f0655d;
  --shadow: 0 1px 2px rgba(0, 0, 0, .3);
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  /* 字体栈统一到 fonts.css 的 token（旧壳的 head 也会引入那个文件）：
     原来这里自带一份不带 Geist 的系统栈，是站内「两套字体」的来源 */
  font-family: var(--ob-font);
  background: var(--bg);
  color: var(--text);
  font-size: 15px;
  line-height: 1.65;
}
a { color: var(--link); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { line-height: 1.4; }
button { font-family: inherit; cursor: pointer; }
input, select, textarea { font-family: inherit; font-size: 14px; color: var(--text); }
/* 防 iOS 双击缩放：香/臭投票、表情、点赞这类要快速连点的按钮，双击会触发页面缩放。
   manipulation 保留平移/捏合、只禁掉双击缩放，桌面端无影响 */
a, button, select { touch-action: manipulation; }
.muted { color: var(--muted); font-size: 13px; }
.container { max-width: 1180px; margin: 0 auto; padding: 16px 16px 40px; }
.single-col { max-width: 860px; margin: 0 auto; }
.empty { background: var(--card); border: 1px dashed var(--line); border-radius: var(--radius); padding: 40px 20px; text-align: center; color: var(--muted); }

/* 客户端导航（nav.js）：切换页签时顶部细进度条，避免整页刷新的空白感 */
body::before {
  content: ""; position: fixed; top: 0; left: 0; z-index: 300; height: 2.5px; width: 0;
  background: linear-gradient(90deg, #FF9E1B, #FF7A00); /* 与登录页主题色一致 */
  opacity: 0; pointer-events: none;
  transition: width .22s ease, opacity .18s ease;
}
body.nav-loading::before { width: 78%; opacity: 1; }
body.nav-loading main.container { opacity: .6; }
main.container { transition: opacity .15s ease; }

/* ============ 顶栏 ============ */
.topbar {
  position: sticky; top: 0; z-index: 100;
  background: color-mix(in srgb, var(--card) 92%, transparent);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--line);
  /* 刘海屏安全区：普通浏览器 env() 取值为 0、无影响；iOS「添加到主屏幕」的 standalone
     模式配合 black-translucent 状态栏（meta 由模板负责）时，给状态栏/挖孔留出空间，
     内容不再顶到它们下面 */
  padding-top: env(safe-area-inset-top);
}
.topbar-inner {
  max-width: 1180px; margin: 0 auto; padding: 0 16px;
  height: 56px; display: flex; align-items: center; gap: 18px;
}
.brand { display: flex; align-items: center; gap: 9px; min-width: 0; }
.brand-name { font-size: 18px; font-weight: 700; color: var(--text); white-space: nowrap; }
.brand:hover { text-decoration: none; }
.brand-sub {
  font-size: 11px; color: var(--muted); border: 1px solid var(--line);
  padding: 1px 6px; border-radius: 999px; white-space: nowrap;
}
.main-nav { display: flex; gap: 4px; }
.main-nav a {
  color: var(--text); padding: 6px 12px; border-radius: 8px;
  font-size: 14.5px; font-weight: 500; opacity: .82; white-space: nowrap;
}
.main-nav a:hover { background: var(--card-2); opacity: 1; text-decoration: none; }
/* 选中的标签沿用登录页的蛋黄渐变主题（与登录页「进入鸡场」按钮同款） */
.main-nav a.active {
  background: linear-gradient(135deg, var(--yolk), var(--yolk-deep));
  color: #fff; opacity: 1; font-weight: 700;
  box-shadow: 0 2px 10px color-mix(in srgb, var(--yolk) 35%, transparent);
}
.main-nav a.active:hover { background: linear-gradient(135deg, var(--yolk), var(--yolk-deep)); }
.topbar-right { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.searchbox input {
  width: 200px; height: 34px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--card-2); padding: 0 12px; outline: none; transition: width .2s, border-color .2s;
}
.searchbox input:focus { width: 250px; border-color: var(--link); background: var(--card); }
.icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border: none; border-radius: 8px;
  background: transparent; color: var(--text); font-size: 16px; position: relative;
}
.icon-btn:hover { background: var(--card-2); text-decoration: none; }
.bell-badge {
  position: absolute; top: 1px; right: 0;
  background: var(--danger); color: #fff; font-size: 10px; line-height: 1;
  padding: 2px 4px; border-radius: 999px; font-weight: 600;
}

/* 用户菜单 */
.user-menu { position: relative; }
.avatar-btn { border: none; background: none; padding: 2px; border-radius: 50%; display: flex; }
.avatar {
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%; color: #fff; font-weight: 600; flex: none; user-select: none;
}
.avatar-s { width: 30px; height: 30px; font-size: 13px; }
.avatar-m { width: 40px; height: 40px; font-size: 17px; }
.avatar-xl { width: 84px; height: 84px; font-size: 34px; }
.dropdown {
  display: none; position: absolute; right: 0; top: calc(100% + 8px);
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12); min-width: 180px; padding: 6px; z-index: 110;
}
.user-menu.open .dropdown { display: block; }
.dropdown-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 10px; border-bottom: 1px solid var(--line); margin-bottom: 4px;
}
.dropdown a, .dropdown button {
  display: block; width: 100%; text-align: left; padding: 8px 10px;
  border: none; background: none; color: var(--text); border-radius: 7px; font-size: 14px;
}
.dropdown a:hover, .dropdown button:hover { background: var(--card-2); text-decoration: none; }

/* ============ 按钮与徽标 ============ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  border: none; border-radius: 8px; padding: 8px 18px; font-size: 14px; font-weight: 500;
  transition: background .15s;
}
.btn:hover { text-decoration: none; }
.btn-primary { background: var(--primary); color: var(--primary-text); }
.btn-primary:hover { background: var(--primary-hover); }
.btn-ghost { background: transparent; color: var(--text); border: 1px solid var(--line); }
.btn-ghost:hover { background: var(--card-2); }
.btn-sm { padding: 5px 12px; font-size: 13px; }
.btn-lg { padding: 12px 34px; font-size: 16px; }
.btn-block { width: 100%; }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.mini-btn {
  border: 1px solid var(--line); background: var(--card); color: var(--muted);
  border-radius: 7px; padding: 3px 10px; font-size: 12.5px; white-space: nowrap; flex: none;
}
.mini-btn:hover { color: var(--text); background: var(--card-2); }
.mini-btn.danger:hover { color: var(--danger); border-color: var(--danger); }
.mini-link { font-size: 13px; white-space: nowrap; }
.dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; flex: none; }
.dot.big { width: 12px; height: 12px; }
.cat-chip, .tag-chip {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; color: var(--muted); background: var(--card-2);
  border: 1px solid var(--line); border-radius: 999px; padding: 1px 9px; white-space: nowrap;
}
.cat-chip:hover, .tag-chip:hover { color: var(--text); text-decoration: none; }
.pin-chip, .lock-chip {
  font-size: 11.5px; font-weight: 600; color: var(--warm);
  border: 1px solid color-mix(in srgb, var(--warm) 45%, transparent);
  background: color-mix(in srgb, var(--warm) 10%, transparent);
  border-radius: 5px; padding: 0 6px; white-space: nowrap;
}
.lock-chip { color: var(--muted); border-color: var(--line); background: var(--card-2); }
.admin-chip {
  font-size: 11.5px; font-weight: 600; color: var(--danger);
  border: 1px solid color-mix(in srgb, var(--danger) 45%, transparent);
  background: color-mix(in srgb, var(--danger) 10%, transparent);
  border-radius: 5px; padding: 0 6px;
}
.lv-chip {
  display: inline-block; font-size: 11.5px; font-weight: 600;
  border-radius: 5px; padding: 0 6px; white-space: nowrap;
}
.lv-chip[data-lv="0"] { color: #8b949e; background: rgba(139, 148, 158, .14); }
.lv-chip[data-lv="1"] { color: #0b6fb4; background: rgba(11, 111, 180, .13); }
.lv-chip[data-lv="2"] { color: #2da44e; background: rgba(45, 164, 78, .13); }
.lv-chip[data-lv="3"] { color: #d4a72c; background: rgba(212, 167, 44, .15); }
.lv-chip[data-lv="4"] { color: #e5534b; background: rgba(229, 83, 75, .13); }
.title-chip {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 11.5px; font-weight: 600; border: 1px solid;
  border-radius: 5px; padding: 0 6px; white-space: nowrap;
}
.title-chip.big { font-size: 13px; padding: 2px 10px; border-radius: 7px; }

/* ============ 称号中心 ============ */
.equipped-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.eq-now { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.titles-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 14px; }
.title-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 16px 18px; opacity: .78;
}
.title-card.earned { opacity: 1; border-color: color-mix(in srgb, var(--ok) 35%, var(--line)); }
.tc-head { display: flex; align-items: flex-start; gap: 10px; }
.tc-name { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.tc-name strong { font-size: 15px; }
.tc-desc { font-size: 12.5px; }
.tc-progress { margin-top: 10px; }
.tc-progress .muted { font-size: 12px; }
.tc-equip { margin-top: 10px; }
.tc-wearing { display: inline-block; margin-top: 10px; font-size: 12.5px; color: var(--ok); }
@media (max-width: 720px) { .titles-grid { grid-template-columns: 1fr; } }

/* ============ 布局与卡片 ============ */
.page-layout { display: grid; grid-template-columns: 1fr 264px; gap: 16px; align-items: start; }
.home-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr) 268px; gap: 16px; align-items: start; }
.home-left { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 72px; }
.online-card h3 { display: flex; align-items: center; gap: 8px; }
.online-count {
  font-size: 12px; font-weight: 600; color: var(--ok);
  background: color-mix(in srgb, var(--ok) 12%, transparent);
  border-radius: 999px; padding: 1px 8px;
}
.online-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px 4px; }
.online-more { margin: 8px 0 0; font-size: 12px; }
.online-user {
  display: flex; flex-direction: column; align-items: center; gap: 5px; min-width: 0;
  color: var(--text); font-size: 12px; padding: 6px 2px; border-radius: 8px;
}
.online-user:hover { background: var(--card-2); text-decoration: none; }
.online-name { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.side-col { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 72px; }
.side-card, .section-card, .topic-card, .tabs-card, .post-card, .topic-head-card, .notice-card,
.checkin-card, .profile-head-card, .feedback-intro-card, .form-page-card, .reply-form-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow);
}
.side-card, .section-card { padding: 16px 18px; }
.side-card h3, .section-card h3, .section-card .section-h1 { margin: 0 0 12px; font-size: 15px; }
/* 视觉隐藏但保留给读屏 / 大纲的页面标题 */
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.section-card { margin-bottom: 14px; }
.tabs-card {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 10px; margin-bottom: 12px;
}
.tabs { display: flex; gap: 2px; }
.tabs a, .tabs span {
  padding: 6px 16px; border-radius: 8px; color: var(--muted); font-size: 14.5px; font-weight: 500;
}
.tabs a:hover, .tabs span:hover { color: var(--text); text-decoration: none; }
.tabs .active { color: var(--text); background: var(--card-2); font-weight: 600; }
.cat-head { display: flex; align-items: center; gap: 8px; margin: 0 2px 10px; }

/* ============ 话题列表 ============ */
.topic-card { overflow: hidden; }
.topic-row {
  display: flex; flex-direction: column; gap: 8px; padding: 14px 18px;
  border-bottom: 1px solid var(--line);
  transition: background-color .15s ease;
}
.topic-row:last-child { border-bottom: none; }
.topic-row:hover { background: var(--card-2); }
.tr-main { display: flex; align-items: center; justify-content: space-between; gap: 14px; width: 100%; }
.tr-content { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }

/* 1. 左上角作者信息行 (图三) */
.tr-author-line {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  font-size: 12.5px; color: var(--muted);
}
.tr-avatar-link { display: inline-flex; align-items: center; flex: none; }
.tr-avatar-link .avatar { width: 22px; height: 22px; font-size: 11px; }
.tr-author { font-weight: 500; color: var(--text); }
.tr-author:hover { color: var(--link); }
.tr-time { color: var(--muted); font-size: 12px; }
.dot-sep { color: var(--line); margin: 0 1px; }

/* 2. 中间标题行 */
.tr-title-line { display: flex; align-items: baseline; gap: 7px; flex-wrap: wrap; margin: 1px 0; }
.tr-title { color: var(--text); font-size: 15.5px; font-weight: 600; line-height: 1.45; }
.tr-title:hover { color: var(--link); text-decoration: none; }
.tr-title:visited { opacity: .78; }

/* 3. 右侧缩略图 */
.tr-thumb { flex: none; align-self: center; }
.tr-thumb img {
  display: block; width: 76px; height: 76px; object-fit: cover;
  border-radius: 8px; border: 1px solid var(--line); background: var(--card-2);
}

/* 4. 底部单独占一行：左侧分类/标签 + 右侧指标小图标，无论有无图片都在固定最底部两端！ */
.tr-footer-line {
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  width: 100%; margin-top: 2px;
}
.tr-tags-area { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.tr-stats-icons {
  display: inline-flex; align-items: center; gap: 14px; flex: none; margin-left: auto;
}
.stat-icon {
  display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted);
  font-variant-numeric: tabular-nums;
}
.stat-icon svg { opacity: .7; }
.stat-icon em { font-style: normal; font-weight: 500; }
.stat-icon:hover { color: var(--text); }
.stat-icon:hover svg { opacity: 1; }
.stat-icon.stat-sweet { color: color-mix(in srgb, var(--ok) 80%, var(--muted)); }
.stat-icon.stat-sweet svg { color: var(--ok); opacity: .85; }
.pager { display: flex; align-items: center; gap: 14px; justify-content: center; margin: 18px 0 4px; }

/* ============ 鸡蛋投票 / 溏心蛋 / 测评 ============ */
.vote-btn {
  display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; flex: none;
  border: 1px solid var(--line); background: transparent; color: var(--muted);
  border-radius: 999px; padding: 3px 12px; font-size: 13px;
}
.vote-btn:hover { color: var(--text); border-color: var(--muted); }
.vote-btn.sweet.active { color: #fff; background: #2da44e; border-color: #2da44e; }
.vote-btn.sweet.active .egg-ic { background: #fff; }
.vote-btn.rotten.active { color: #fff; background: #e5534b; border-color: #e5534b; }
.vote-btn.rotten.active .egg-ic { background: #fff; }
.egg-ic {
  width: 10px; height: 12px; display: inline-block; background: currentColor;
  border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
}
.kind-chip {
  font-size: 11.5px; font-weight: 600; color: #d4a72c;
  border: 1px solid rgba(212, 167, 44, .45); background: rgba(212, 167, 44, .12);
  border-radius: 5px; padding: 0 6px; white-space: nowrap;
}
.check-line { display: flex; align-items: center; gap: 8px; font-size: 13.5px; cursor: pointer; }
.check-line input { width: auto; }
.rv-overall { font-size: 22px; color: #2da44e; }
.review-grid { display: grid; grid-template-columns: 300px 1fr; gap: 14px; align-items: start; margin-bottom: 14px; }
.review-grid .section-card { margin-bottom: 0; }
.radar-wrap { display: flex; justify-content: center; }
.radar { color: var(--text); max-width: 100%; }
.rate-row { display: flex; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.rate-item { flex: 1; min-width: 90px; }
.rate-item label { display: block; font-size: 12.5px; font-weight: 600; margin-bottom: 5px; }
.rate-item select { width: 100%; }
.rv-comment { max-width: 220px; white-space: normal; }
.rank-table td, .rank-table th { padding: 8px 10px; }

/* 侧栏 */
.cat-list { list-style: none; margin: 0; padding: 0; }
.cat-list li {
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 0; border-bottom: 1px dashed var(--line);
}
.cat-list li:last-child { border-bottom: none; }
.cat-list a { display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 14px; }
.cat-list a:hover { color: var(--link); text-decoration: none; }
.stat-list { list-style: none; margin: 0; padding: 0; }
.stat-list li { display: flex; justify-content: space-between; padding: 5px 0; font-size: 14px; }
.stat-list strong { font-size: 15px; }
.tag-cloud { display: flex; flex-wrap: wrap; gap: 7px; }
.rule-list { margin: 0; padding-left: 18px; color: var(--muted); font-size: 13px; }
.rule-list li { margin: 5px 0; }
.result-count { margin: 0 2px 10px; }

/* ============ 话题页 ============ */
.topic-head-card { padding: 18px 22px; margin-bottom: 12px; }
.th-title { margin: 0; font-size: 22px; }
.th-title-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.th-meta { display: flex; align-items: center; gap: 7px; margin-top: 9px; flex-wrap: wrap; font-size: 13px; color: var(--muted); }
.th-author { color: var(--muted); font-weight: 500; }
.post-card { padding: 16px 20px 12px; margin-bottom: 10px; display: flex; gap: 12px; }
.post-card.op { display: block; padding: 20px 22px; }
.post-side { flex: none; }
.post-body { flex: 1; min-width: 0; }
.post-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.post-author { color: var(--text); font-weight: 600; font-size: 14.5px; }
.floor { margin-left: auto; }
.post-time { font-size: 12.5px; }
.replies-head { font-size: 15px; font-weight: 600; margin: 16px 2px 10px; }
.post-foot { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding-top: 8px; border-top: 1px dashed var(--line); flex-wrap: wrap; }
.inline-form { display: inline-flex; flex: none; }
.like-btn {
  display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; flex: none;
  border: 1px solid var(--line); background: transparent; color: var(--muted);
  border-radius: 999px; padding: 3px 12px; font-size: 13px;
}
.like-btn:hover { color: var(--warm); border-color: var(--warm); }
.like-btn.active { color: #fff; background: var(--warm); border-color: var(--warm); }
.admin-actions { margin-left: auto; display: flex; gap: 6px; flex-wrap: wrap; }
/* 话题页管理操作折叠菜单：避免编辑/置顶/锁定/删除与投票挤在一行被误点 */
.adm-menu { margin-left: auto; position: relative; }
.adm-menu > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; }
.adm-menu > summary::-webkit-details-marker { display: none; }
.adm-menu > summary::after { content: "▾"; margin-left: 4px; font-size: 10px; }
.adm-menu-list {
  position: absolute; right: 0; top: calc(100% + 6px); z-index: 20;
  display: flex; flex-direction: column; gap: 4px; padding: 6px; min-width: 110px;
  background: var(--card); border: 1px solid var(--line); border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}
.adm-menu-list form { display: block; }
.adm-menu-list .mini-btn { width: 100%; text-align: left; display: block; }
/* 跳到回复框 */
.jump-reply { display: inline-flex; align-items: center; }
.jump-reply:hover { text-decoration: none; }
/* 话题页返回分区的面包屑 */
.topic-crumb { display: flex; align-items: center; gap: 6px; margin: 0 0 10px; font-size: 13px; }
.topic-crumb a { color: var(--muted); }
.topic-crumb a:hover { color: var(--text); }
.notice-card { padding: 14px 18px; margin-bottom: 12px; color: var(--muted); }
.notice-card a { font-weight: 500; }

/* Markdown 正文 */
.post-content { overflow-wrap: break-word; font-size: 15px; }
.post-content p { margin: 8px 0; }
/* md.js 把正文标题整体降一级（# → h2），这里尺寸同步后移，渲染效果与降级前一致 */
.post-content h1, .post-content h2, .post-content h3 { font-size: 19px; margin: 18px 0 8px; }
.post-content h4, .post-content h5 { font-size: 16.5px; margin: 14px 0 6px; }
.post-content h6 { font-size: 15px; margin: 12px 0 6px; }
.post-content ul, .post-content ol { margin: 8px 0; padding-left: 24px; }
.post-content li { margin: 3px 0; }
.post-content hr { border: none; border-top: 1px solid var(--line); margin: 14px 0; }
.md-quote {
  margin: 10px 0; padding: 8px 14px; color: var(--muted);
  border-left: 3px solid var(--line); background: var(--card-2); border-radius: 0 8px 8px 0;
}
.md-code {
  background: var(--card-2); border: 1px solid var(--line); border-radius: 8px;
  padding: 12px 14px; overflow-x: auto; font-size: 13px; line-height: 1.55;
}
.md-code code { font-family: var(--ob-mono); }
.md-inline {
  font-family: var(--ob-mono);
  background: var(--card-2); border: 1px solid var(--line);
  border-radius: 5px; padding: 0 5px; font-size: 13px;
}
.md-img { max-width: 100%; border-radius: 8px; }
.mention { font-weight: 600; background: rgba(11, 111, 180, .1); border-radius: 4px; padding: 0 3px; }
.reply-form-card { padding: 18px 20px; }
.reply-form-card h3 { margin: 0 0 10px; font-size: 15.5px; }
textarea, input[type="text"], input[type="password"], input[type="search"], select {
  width: 100%; border: 1px solid var(--line); border-radius: 8px;
  background: var(--card-2); padding: 9px 12px; outline: none; resize: vertical;
}
textarea:focus, input:focus, select:focus { border-color: var(--link); background: var(--card); }
.form-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; gap: 10px; }

/* ============ 表单页 ============ */
.auth-wrap { display: flex; justify-content: center; padding: 40px 0 20px; }
.auth-card {
  width: 400px; max-width: 100%; background: var(--card);
  border: 1px solid var(--line); border-radius: 14px; padding: 30px 30px 22px; box-shadow: var(--shadow);
}
.auth-brand { margin-bottom: 20px; }
.auth-brand h1 { margin: 0; font-size: 20px; }
.auth-alt { text-align: center; margin: 16px 0 0; }
.msg-card { text-align: center; }
.msg-card .btn { margin-top: 12px; }
.form-row { margin-bottom: 14px; }
.form-row label { display: block; font-size: 13.5px; font-weight: 600; margin-bottom: 6px; }
.form-row-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.field-hint { display: block; margin-top: 4px; font-size: 12px; }
.form-page-card, .settings-card { width: 100%; }
/* 设置页「邮箱」区块：与上方资料表单用分隔线隔开 */
.settings-email { margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--line); scroll-margin-top: 76px; }
.settings-email h2 { margin: 0 0 6px; font-size: 15px; display: flex; align-items: center; gap: 8px; }
/* 未绑定邮箱的提醒条（点击跳到页内邮箱区块） */
.settings-tip {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  margin: 0 0 18px; padding: 11px 14px;
  border: 1px solid color-mix(in srgb, var(--yolk) 45%, var(--line));
  background: color-mix(in srgb, var(--yolk) 10%, transparent);
  border-radius: 10px; color: var(--text); font-size: 13.5px; line-height: 1.5;
}
.settings-tip:hover { text-decoration: none; border-color: var(--yolk); }
.settings-tip strong { color: var(--yolk-deep); white-space: nowrap; flex: none; }
.profile-tip { margin: 12px 0 0; }
.bind-code-row { display: flex; gap: 8px; align-items: center; }
.bind-code-row input { flex: 1; min-width: 0; }
.bind-code-row .btn { flex: none; width: auto; }
#bindHint { word-break: break-word; }
/* 设置页借用 auth-card 外壳：标题与其它表单页统一为 20px，顶部留白收紧 */
.auth-wrap:has(.settings-card) { padding-top: 0; }
.settings-card { max-width: 860px; padding: 24px 26px; }
.settings-card h1 { margin: 0 0 18px; font-size: 20px; }
.settings-current { margin: 0 0 6px; }
.settings-section {
  font-size: 15px; margin: 22px 0 12px; padding-top: 16px; border-top: 1px dashed var(--line);
}
.settings-section .muted { font-size: 12.5px; font-weight: 400; }
.form-page-card { max-width: 860px; padding: 24px 26px; }
.form-page-card h1 { margin: 0 0 18px; font-size: 20px; }

/* ============ 个人页 (现代 Zibll 风格) ============ */
.profile-card {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  overflow: hidden; box-shadow: var(--shadow); margin-bottom: 14px;
}
.profile-cover {
  height: 180px; position: relative; overflow: hidden;
  background: linear-gradient(135deg, hsl(var(--cover-h, 210), 65%, 32%), hsl(calc(var(--cover-h, 210) + 45), 75%, 18%));
  background-position: center; background-size: cover;
}
.profile-cover-mesh {
  position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(circle at 80% 20%, rgba(255,255,255,0.18), transparent 50%),
              radial-gradient(circle at 20% 80%, rgba(0,0,0,0.25), transparent 60%);
}
.cover-edit-wrap {
  position: absolute; right: 14px; top: 14px; z-index: 10;
}
.cover-edit-btn {
  background: rgba(0, 0, 0, 0.45); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  color: #fff; border: 1px solid rgba(255, 255, 255, 0.28); border-radius: 999px;
  padding: 4px 12px; font-size: 12px; font-weight: 500;
  display: inline-flex; align-items: center; gap: 5px; cursor: pointer;
  transition: all .15s ease;
}
.cover-edit-btn:hover {
  background: rgba(0, 0, 0, 0.7); border-color: rgba(255, 255, 255, 0.55);
}
.cover-editor {
  display: flex; gap: 14px; align-items: center; flex-wrap: wrap;
}
.settings-cover-preview {
  width: 180px; height: 70px; border-radius: 8px; border: 1px solid var(--line);
  background: var(--card-2) center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
}
/* 后台默认背景设置块（原为 admin.ejs 内联样式，收敛至此） */
.admin-cover-head {
  display: flex; justify-content: space-between; align-items: center;
  margin-bottom: 12px; flex-wrap: wrap; gap: 8px;
}
.admin-cover-head h3 { margin: 0; }
.admin-cover-head .muted { font-size: 13px; }
.admin-cover-box { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.admin-cover-preview {
  width: 240px; height: 90px; border-radius: 8px; border: 1px solid var(--line);
  background: var(--card-2) center/cover no-repeat;
  display: flex; align-items: center; justify-content: center;
}
.admin-cover-preview .muted { font-size: 12.5px; }
.admin-cover-actions { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.admin-cover-actions .btn { cursor: pointer; margin: 0; }
.admin-cover-form { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.cover-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.profile-user-bar {
  padding: 0 24px 20px; display: flex; align-items: flex-start; justify-content: space-between;
  gap: 18px; position: relative;
}
.profile-avatar-wrap {
  margin-top: -46px; position: relative; flex: none;
}
.profile-avatar-wrap .avatar {
  width: 90px; height: 90px; border-radius: 50%;
  border: 4px solid var(--card); box-shadow: 0 6px 16px rgba(0,0,0,0.18);
  font-size: 32px; font-weight: 700; display: block;
}
.ph-info { flex: 1; min-width: 0; padding-top: 10px; }
.ph-name { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ph-name h1 { margin: 0; font-size: 22px; font-weight: 700; }
.profile-chips-row {
  display: flex; align-items: center; gap: 8px; margin-top: 8px; flex-wrap: wrap;
}
.profile-chip {
  display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted);
  background: var(--card-2); border: 1px solid var(--line); border-radius: 999px;
  padding: 2px 10px; text-decoration: none;
}
a.profile-chip:hover { color: var(--text); border-color: var(--muted); }
.chip-ic { font-size: 11px; }
.ph-bio { margin: 8px 0 0; color: var(--text); font-size: 13.5px; font-style: italic; }
.profile-actions { display: flex; align-items: center; gap: 8px; padding-top: 14px; flex: none; }
.btn-checkin-done {
  background: rgba(45, 164, 78, .12); color: var(--ok); border: 1px solid rgba(45, 164, 78, .3);
  font-weight: 600; cursor: default; display: inline-flex; align-items: center; gap: 4px;
}
.lv-progress { margin-top: 12px; max-width: 420px; }
.lv-bar { height: 7px; border-radius: 999px; background: var(--card-2); border: 1px solid var(--line); overflow: hidden; }
.lv-bar span { display: block; height: 100%; background: var(--link); border-radius: 999px; }
.lv-progress .muted { display: block; margin-top: 5px; font-size: 12px; }

/* 统计卡片网格 (个人页 6 项卡片均分一整行) */
.stats-row.profile-stats-grid {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px;
}
.stats-row { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-bottom: 14px; }
.stat-box {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 14px 10px; text-align: center; box-shadow: var(--shadow);
}
.stat-box strong { display: block; font-size: 20px; }
.stat-box span { font-size: 12.5px; color: var(--muted); }
.profile-layout { display: grid; grid-template-columns: 1fr 264px; gap: 14px; align-items: start; }
.mini-topic {
  display: flex; align-items: baseline; gap: 10px; padding: 8px 0;
  border-bottom: 1px dashed var(--line); font-size: 14px;
}
.mini-topic:last-child { border-bottom: none; }
.mini-topic a { color: var(--text); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mini-topic a:hover { color: var(--link); }
.re-excerpt { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: none; }
.lv-list { list-style: none; margin: 0; padding: 0; }
.lv-list li { display: flex; align-items: center; justify-content: space-between; padding: 5px 0; }

/* ============ 签到页 ============ */
.checkin-card {
  display: flex; gap: 20px; padding: 24px 26px; margin-bottom: 14px; align-items: center;
}
.ck-left { flex: 1; }
.ck-left h1 { margin: 0 0 8px; font-size: 22px; }
.ck-stat { margin: 0 0 16px; color: var(--muted); }
.ck-stat strong { color: var(--text); font-size: 17px; }
.ck-right { flex: none; }
.calendar { background: var(--card-2); border: 1px solid var(--line); border-radius: 10px; padding: 14px; }
.cal-title { font-weight: 600; font-size: 14px; margin-bottom: 10px; text-align: center; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 34px); gap: 3px; }
.cal-dow { text-align: center; font-size: 11.5px; color: var(--muted); padding: 2px 0; }
.cal-cell {
  display: flex; align-items: center; justify-content: center;
  height: 30px; border-radius: 7px; font-size: 12.5px; color: var(--muted); background: var(--card);
}
/* 与全局 .empty（空状态卡片，带 40px 内边距和虚线框）同名，这里显式重置，否则首行被撑高 */
.cal-cell.empty { background: transparent; border: none; padding: 0; }
.cal-cell.on { background: var(--ok); color: #fff; font-weight: 600; }
.cal-cell.today { outline: 2px solid var(--link); outline-offset: -2px; }
.data-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.data-table th {
  text-align: left; font-size: 12.5px; color: var(--muted); font-weight: 500;
  padding: 7px 10px; border-bottom: 1px solid var(--line);
}
.data-table td { padding: 8px 10px; border-bottom: 1px dashed var(--line); }
.data-table tr:last-child td { border-bottom: none; }
.rank { font-weight: 700; }
.rank-1 { color: #d4a72c; }
.rank-2 { color: #8b949e; }
.rank-3 { color: #b07a3f; }

/* ============ 反馈页 ============ */
.feedback-intro-card { padding: 20px 24px; margin-bottom: 14px; }
.feedback-intro-card h1 { margin: 0 0 6px; font-size: 21px; }
.feedback-intro-card p { margin: 0; }
.feedback-form select { max-width: 260px; }
.feedback-item { padding: 12px 0 14px; border-bottom: 1px dashed var(--line); }
.feedback-item:last-child { border-bottom: none; }
.fi-head { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.fb-type { font-weight: 600; font-size: 14px; }
.status-chip {
  font-size: 11.5px; font-weight: 600; border-radius: 999px; padding: 1px 9px;
}
.status-open { color: #d4a72c; background: rgba(212, 167, 44, .14); }
.status-processing { color: #0b6fb4; background: rgba(11, 111, 180, .12); }
.status-resolved { color: #2da44e; background: rgba(45, 164, 78, .13); }
.fi-content { margin: 8px 0; }
.fi-content > :first-child { margin-top: 0; }
.fi-content > :last-child { margin-bottom: 0; }
.fi-reply {
  background: var(--card-2); border: 1px solid var(--line); border-radius: 8px;
  padding: 9px 13px; font-size: 13.5px; margin: 8px 0;
}
/* 管理员回复：首段与标签同行，多段回复后续段落正常换行 */
.fi-reply > p:first-of-type { display: inline; margin: 0; }
.fi-reply > :first-child { margin-top: 0; }
.fi-reply > :last-child { margin-bottom: 0; }
.fi-admin { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.fi-admin select { max-width: 130px; width: auto; }
.fi-admin input { flex: 1; min-width: 180px; }

/* ============ 通知 ============ */
.notif-item {
  display: flex; align-items: center; gap: 12px; padding: 12px 4px;
  border-bottom: 1px dashed var(--line);
}
.notif-item:last-child { border-bottom: none; }
.notif-item.unread { background: color-mix(in srgb, var(--link) 5%, transparent); border-radius: 8px; }
.notif-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.notif-line { font-size: 14px; }
.notif-excerpt { font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 420px; }
.notif-time { font-size: 12px; white-space: nowrap; }

/* ============ 后台 ============ */
.adm-title { max-width: 300px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.adm-actions { display: flex; gap: 5px; }
.admin-stats { grid-template-columns: repeat(5, 1fr); }
.bot-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.bot-head h3 { margin: 0; }
.bot-ai-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px dashed var(--line); }
.bot-ai { font-size: 12.5px; font-weight: 600; border-radius: 999px; padding: 1px 10px; }
.bot-ai.on { color: #2da44e; background: rgba(45, 164, 78, .13); }
.bot-ai.off { color: var(--muted); background: var(--card-2); }
.bot-status { font-size: 12.5px; color: var(--muted); }
.bot-status strong { color: var(--warm); }
.mod-reasons { font-size: 12.5px; color: var(--muted); max-width: 240px; white-space: normal; }

/* ============ 页脚 / 提示 ============ */
/* 粘底页脚：内容不足一屏时页脚仍贴在视口底部（仅作用于带公共页头页脚的页面，登录页不受影响） */
body.site { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
/* flex 列中 margin:auto 会让元素收缩到内容宽度，需显式 width:100% 保持居中定宽 */
body.site > main.container { flex: 1 0 auto; width: 100%; }
.footer { border-top: 1px solid var(--line); background: var(--card); }
.footer-inner {
  display: flex; justify-content: space-between; gap: 10px; padding: 16px; font-size: 13px; color: var(--muted);
}
.toast {
  position: fixed; top: 68px; left: 50%; transform: translate(-50%, -12px);
  background: var(--primary); color: var(--primary-text);
  padding: 10px 22px; border-radius: 999px; font-size: 14px; z-index: 200;
  opacity: 0; transition: all .3s; box-shadow: 0 6px 20px rgba(0, 0, 0, .18); max-width: 86vw;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }
.toast-err { background: var(--danger); color: #fff; }

/* ============ 悬停资料卡 ============ */
.usercard {
  position: fixed; z-index: 300; width: 300px; max-width: calc(100vw - 16px);
  background: var(--card); border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .16); padding: 16px;
  opacity: 0; pointer-events: none; transform: translateY(4px);
  transition: opacity .15s ease, transform .15s ease;
}
.usercard.show { opacity: 1; pointer-events: auto; transform: translateY(0); }
.uc-head { display: flex; align-items: center; gap: 12px; }
.uc-id { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.uc-name { font-size: 16px; font-weight: 700; color: var(--text); }
.uc-name:hover { color: var(--link); text-decoration: none; }
.uc-chips { display: flex; gap: 5px; flex-wrap: wrap; }
.uc-bio { margin: 10px 0 0; font-size: 13.5px; }
.uc-stats {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 4px; text-align: center;
  margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--line);
}
.uc-stats span { display: flex; flex-direction: column; }
.uc-stats strong { font-size: 14px; }
.uc-stats em { font-style: normal; font-size: 11px; color: var(--muted); }
.uc-foot { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px; }
.uc-loading { padding: 8px 0; }
.js-usercard { cursor: pointer; }

/* ============ 首页右栏（用户卡片 / 站点数据 / 在线方格 / 聊天室入口） ============ */
.home-rail {
  display: flex; flex-direction: column; gap: 14px; min-width: 0;
  position: sticky; top: 72px; max-height: calc(100vh - 88px); overflow-y: auto;
  scrollbar-width: thin; scrollbar-color: color-mix(in srgb, var(--muted) 55%, transparent) transparent;
  padding-right: 2px;
}
/* 用户卡片：顶部背景条 + 压边圆形头像 + 等级/经验条 + 快捷入口 */
.huc-card { padding: 0; overflow: hidden; }
.huc-cover {
  height: 88px; background-size: cover; background-position: center;
  background-image: linear-gradient(135deg,
    hsl(var(--cover-h, 210), 70%, 62%),
    hsl(calc(var(--cover-h, 210) + 40), 65%, 45%));
}
.huc-body { padding: 0 14px 18px; text-align: center; }
.huc-avatar { margin-top: -34px; display: flex; justify-content: center; }
.huc-avatar .avatar {
  width: 68px; height: 68px; border-radius: 50%;
  border: 3px solid var(--card); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.14);
}
.huc-name { margin-top: 8px; font-size: 15.5px; font-weight: 700; display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; }
.huc-name a { color: var(--text); }
.huc-name a:hover { color: var(--link); text-decoration: none; }
.huc-lv { margin-top: 6px; min-height: 20px; display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; }
.huc-exp { margin-top: 12px; text-align: left; }
.huc-exp .muted { display: block; margin-top: 5px; font-size: 12px; }
.huc-exp-max { margin-top: 8px; font-size: 12px; }
.huc-actions { margin-top: 14px; display: flex; gap: 8px; }
.huc-actions .btn { flex: 1; justify-content: center; }
.huc-guest-hint { margin-top: 8px; font-size: 12.5px; line-height: 1.5; }
.huc-guest-avatar { background: var(--card-2); color: var(--muted); }
/* 站点数据：右栏宽度内 4 项小号并排 */
.rail-stats .hp-hero-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.rail-stats .hp-stat { min-width: 0; padding: 6px 2px; }
.rail-stats .hp-stat-num { font-size: 15px; }
.rail-stats .hp-stat-label { font-size: 10.5px; margin-top: 1px; }

/* ============ 响应式 ============ */
@media (max-width: 1100px) {
  .home-layout { grid-template-columns: 200px minmax(0, 1fr); }
  /* 右栏不再挤第三列：降为话题列表下方的整行小部件网格，平板/手机同样可用 */
  .home-rail {
    position: static; top: auto; max-height: none; overflow: visible;
    grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; align-items: start;
  }
  .home-rail .huc-card { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .page-layout, .profile-layout { grid-template-columns: 1fr; }
  .home-layout { grid-template-columns: 1fr; }
  .home-left { order: 3; position: static; }
  .home-rail { order: 2; }
  .online-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .side-col { position: static; }
  /* 窄屏保留回复与香蛋（社区核心数据），隐藏浏览数 */
  .tr-stats-icons .stat-icon:nth-child(3) { display: none; }
  .stats-row { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  /* 移动端首页只做话题浏览：隐藏 Hero 标题卡与帖子下方的全部模块 */
  .home-layout .hp-hero, .home-layout .home-rail, .home-layout .home-left, .home-layout .pager { display: none; }
  .searchbox { display: none; }
  .main-nav { gap: 0; }
  .main-nav a { padding: 6px 8px; font-size: 13.5px; }
  .nav-more-btn { padding: 6px 8px; font-size: 13.5px; }
  .brand-name { font-size: 16px; }
  .brand-sub { display: none; }
  .topic-row { padding: 12px 14px; gap: 10px; align-items: stretch; }
  .tr-thumb img { width: 64px; height: 64px; }
  .tr-title { font-size: 15px; }
  .tr-footer-line { gap: 6px; }
  .tr-stats-icons { gap: 10px; }
  /* 回复卡保持横排，头像缩小，避免头像独占一行浪费首屏 */
  .post-card { padding: 14px; gap: 10px; }
  .post-side .avatar-m { width: 32px; height: 32px; font-size: 14px; }
  .checkin-card { flex-direction: column; }
  .cal-grid { grid-template-columns: repeat(7, minmax(28px, 38px)); }
  .profile-cover { height: 120px; }
  .profile-user-bar { padding: 0 14px 16px; flex-direction: column; align-items: flex-start; gap: 10px; }
  .profile-avatar-wrap { margin-top: -36px; }
  .profile-avatar-wrap .avatar { width: 72px; height: 72px; font-size: 26px; border-width: 3px; }
  .ph-info { padding-top: 0; width: 100%; }
  .stats-row.profile-stats-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
  }
  .stats-row.profile-stats-grid .stat-box {
    padding: 10px 4px;
  }
  .stats-row.profile-stats-grid .stat-box span {
    font-size: 11.5px;
  }
  /* 5 项统计：两列会剩一个孤儿格且很占高度，改三列紧凑排布 */
  .stats-row, .stats-row.admin-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .stat-box { padding: 10px 6px; }
  .stat-box strong { font-size: 18px; }
  .form-row-grid { grid-template-columns: 1fr; }
  .fi-admin input { min-width: 130px; }
  .review-grid { grid-template-columns: 1fr; gap: 12px; }
  .radar-wrap { display: flex; justify-content: center; overflow: hidden; }
  .review-grid .data-table { display: table; width: 100%; white-space: normal; }
}

/* ============ 用户货币条（userbar 已移除，间距工具类仍被 studio 使用） ============ */
.ub-spacer { flex: 1; }

/* ============ 顶栏「更多」下拉 ============ */
/* flex + 居中 + line-height 继承，让按钮与 .main-nav a 的盒模型完全一致（对齐） */
.nav-more { position: relative; display: flex; align-items: center; }
.nav-more-btn {
  display: block; border: none; background: none; color: var(--text); opacity: .82;
  font-size: 14.5px; font-weight: 500; line-height: inherit;
  padding: 6px 12px; border-radius: 8px; white-space: nowrap;
}
.nav-more:hover .nav-more-btn, .nav-more.open .nav-more-btn { background: var(--card-2); opacity: 1; }
.nav-more-menu {
  display: none; position: absolute; left: 0; top: calc(100% + 6px); z-index: 120;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .12); min-width: 210px; padding: 6px;
}
/* 透明桥接层盖住按钮与菜单间的 6px 空隙，鼠标从按钮移向菜单时不丢 :hover */
.nav-more-menu::before { content: ""; position: absolute; top: -8px; left: 0; right: 0; height: 8px; }
.nav-more:hover .nav-more-menu,
.nav-more:focus-within .nav-more-menu,
.nav-more.open .nav-more-menu { display: block; }
.nav-more-menu a { display: block; padding: 8px 10px; border-radius: 7px; color: var(--text); font-size: 14px; }
.nav-more-menu a:hover { background: var(--card-2); text-decoration: none; }
/* 当前页在「更多」里：按钮沿用页签选中态；用 :has() 纯 CSS 判断，
   客户端导航只切换链接的 .active 时按钮也会自动跟着更新 */
.nav-more:has(.nav-more-menu a.active) .nav-more-btn {
  background: linear-gradient(135deg, var(--yolk), var(--yolk-deep));
  color: #fff; opacity: 1; font-weight: 700;
  box-shadow: 0 2px 10px color-mix(in srgb, var(--yolk) 35%, transparent);
}
/* 下拉菜单内的选中项用浅底加粗，不用渐变胶囊，避免在菜单里过于突兀 */
.main-nav .nav-more-menu a.active,
.main-nav .nav-more-menu a.active:hover {
  background: var(--card-2); color: var(--yolk-deep); font-weight: 700; box-shadow: none;
}

/* ============ 左栏分区列表 ============ */
.board-list { list-style: none; margin: 0; padding: 0; }
.board-list li { display: flex; align-items: center; justify-content: space-between; padding: 4px 0; }
.board-list li.board-sub { justify-content: flex-start; padding: 0 0 6px 17px; font-size: 11.5px; line-height: 1.3; }
.board-list a { display: flex; align-items: center; gap: 8px; color: var(--text); font-size: 14px; font-weight: 500; }
.board-list a:hover { color: var(--link); text-decoration: none; }

/* ============ 聊天室入口卡（跳转全屏页 /chat） ============ */
.chat-card { display: flex; flex-direction: column; }
.chat-enter {
  display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%;
  padding: 9px 12px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--card-2); color: var(--text); font-size: 13.5px; font-weight: 600; cursor: pointer;
  text-decoration: none;
}
.chat-enter:hover { color: var(--link); border-color: var(--link); text-decoration: none; }
.chat-live-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 18%, transparent); }
/* 表情面板：挂在 body 下（fixed），由 chat-room.js 在 /chat 页构建 */
.chat-emoji-panel {
  display: none; position: fixed; z-index: 130; width: 268px; max-height: 300px; overflow-y: auto;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .14); padding: 8px 10px 10px;
  scrollbar-width: thin;
}
.chat-emoji-panel.open { display: block; }
.chat-emoji-panel::-webkit-scrollbar { width: 8px; }
.chat-emoji-panel::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--muted) 55%, transparent); border-radius: 4px; }
.cep-group { font-size: 11.5px; color: var(--muted); margin: 6px 0 2px; }
.cep-group:first-child { margin-top: 0; }
.cep-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 2px; }
.cep-item {
  border: none; background: none; border-radius: 6px; padding: 0;
  height: 30px; font-size: 19px; line-height: 1; cursor: pointer;
  /* emoji 字体栈（fonts.css 的 --ob-emoji）：避免在部分 Windows 环境下回退成黑白字形 */
  font-family: var(--ob-emoji);
}
.cep-item:hover { background: var(--card-2); }

/* ============ 投票警示 ============ */
.topic-row.rotten-warn { border-left: 3px solid var(--danger); }

/* ============ 头像图片形态（上传头像后由 img 渲染） ============ */
img.avatar { object-fit: cover; background: var(--card-2); border: none; }
.avatar-l { width: 64px; height: 64px; font-size: 26px; }

/* ============ 主题切换图标 ============ */
#themeToggle .ic-sun { display: none; }
[data-theme="dark"] #themeToggle .ic-sun { display: block; }
[data-theme="dark"] #themeToggle .ic-moon { display: none; }
.brand-mark { color: var(--text); flex: none; }

/* ============ 设置页头像编辑 ============ */
.avatar-row .avatar-editor { display: flex; align-items: center; gap: 16px; }
.avatar-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.avatar-actions .field-hint { width: 100%; margin-top: 0; }

/* ============ 无障碍：键盘焦点可见 ============ */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible {
  outline: 2px solid var(--link); outline-offset: 1px; border-radius: 6px;
}

/* ============ 打磨：话题列表 hover 过渡 / 顶栏细节 ============ */
.topic-row { transition: background .12s ease; }
.main-nav a, .tabs a, .icon-btn, .nav-more-btn { transition: background .12s ease, opacity .12s ease; }
.btn { transition: background .15s ease, border-color .15s ease, opacity .15s ease; }


/* ============ 登录/注册 · 分屏品牌页（au- 前缀，与旧 auth-* 互不影响） ============ */
.au-wrap{
  --yolk:#FF9E1B; --yolk-deep:#FF7A00;
  --au-ink:#2C1E12; --au-ink2:#7A6550; --au-line:#F1E3CB; --au-soft:#FFEFD8; --au-card:#FFFDF8;
  min-height:100vh; display:grid; grid-template-columns:1.05fr 1fr;
  background:var(--au-card);
}
[data-theme="dark"] .au-wrap{
  --au-ink:#F6EBDB; --au-ink2:#B3A189; --au-line:#3A2F20; --au-soft:#241D14; --au-card:#1A1510;
}
.au-brand{
  position:relative; overflow:hidden; color:#3A2400;
  display:flex; flex-direction:column; justify-content:center; padding:64px;
  background:
    radial-gradient(500px 300px at 80% 10%, rgba(255,255,255,.35), transparent 60%),
    linear-gradient(160deg, #FFC53D, var(--yolk) 45%, var(--yolk-deep));
}
[data-theme="dark"] .au-brand{
  color:#FFF3DC;
  background:
    radial-gradient(500px 300px at 80% 10%, rgba(255,255,255,.14), transparent 60%),
    linear-gradient(160deg, #8A5A00, var(--yolk-deep) 60%, #4E3200);
}
.au-brand h1{font-size:clamp(30px,3.4vw,42px);font-weight:900;line-height:1.25;margin:0}
.au-slogan{margin:18px 0 34px;font-size:15.5px;font-weight:600;opacity:.82;line-height:1.7}
.au-stats{display:flex;gap:34px;flex-wrap:wrap}
.au-stats b{font-size:26px;font-weight:900;display:block}
.au-stats span{font-size:13px;font-weight:600;opacity:.75}
.au-egg-big{position:absolute;right:-70px;bottom:-90px;width:260px;height:260px;opacity:.28;transform:rotate(-14deg);pointer-events:none}
.au-float{position:absolute;opacity:.55;animation:au-float 5.5s ease-in-out infinite;pointer-events:none}
.au-float.f1{top:14%;right:16%}
.au-float.f2{top:44%;right:7%;animation-delay:1.4s}
@keyframes au-float{0%,100%{transform:translateY(0) rotate(-6deg)}50%{transform:translateY(-14px) rotate(5deg)}}

.au-panel{display:flex;align-items:center;justify-content:center;padding:48px 24px}
.au-card{width:100%;max-width:430px}
.au-logo{display:flex;align-items:center;justify-content:center;gap:10px;font-weight:800;font-size:19px;color:var(--text);margin-bottom:24px}
.au-logo:hover{text-decoration:none}
.au-logo-text{display:flex;flex-direction:column;line-height:1.15}
.au-logo-text small{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:3px}
.au-tabs{display:grid;grid-template-columns:1fr 1fr;background:var(--au-soft);border-radius:14px;padding:5px;margin-bottom:22px}
.au-tabs a{text-align:center;padding:11px;border-radius:10px;font-size:15px;font-weight:700;color:var(--muted)}
.au-tabs a:hover{text-decoration:none;color:var(--text)}
.au-tabs a.active{background:var(--card);color:var(--text);box-shadow:var(--shadow)}
.au-alert{
  background:color-mix(in srgb, var(--danger) 9%, transparent);
  border:1px solid color-mix(in srgb, var(--danger) 35%, transparent);
  color:var(--danger);border-radius:10px;padding:10px 14px;font-size:13.5px;margin-bottom:16px;
}
.au-field{margin-bottom:15px}
.au-field label{display:block;font-size:13px;font-weight:700;color:var(--muted);margin-bottom:7px}
.au-field input{
  width:100%;padding:12px 15px;border-radius:12px;border:1.5px solid var(--line);
  background:var(--card);color:var(--text);font-size:15px;font-family:inherit;outline:none;
  transition:border-color .15s, box-shadow .15s;
}
.au-field input:focus{border-color:var(--yolk);box-shadow:0 0 0 4px rgba(255,158,27,.16)}
.au-hint{display:block;margin-top:5px;font-size:12px;color:var(--muted)}
/* 用户名可用性即时提示：可用为绿、被占用为红 */
.au-hint.hint-ok{color:var(--ok)}
.au-hint.hint-err{color:var(--danger)}
.au-form .btn{
  width:100%;margin-top:8px;padding:13px;border:none;border-radius:12px;
  background:linear-gradient(135deg, var(--yolk), var(--yolk-deep));
  color:#fff;font-size:15px;font-weight:800;letter-spacing:.02em;
  transition:filter .15s, transform .1s;
}
.au-form .btn:hover{filter:brightness(1.06)}
.au-form .btn:active{transform:translateY(1px)}
.au-tip{text-align:center;font-size:12.5px;color:var(--muted);margin-top:16px}
/* 密码框下方的次级入口：邮箱验证码登录 / 忘记密码 */
.au-alt{display:flex;align-items:center;justify-content:flex-start;gap:10px;margin:2px 0 4px}
.au-alt-back{justify-content:center;margin-top:14px}
.au-link{
  border:none;background:none;padding:0;color:var(--muted);
  font-size:12.5px;font-family:inherit;cursor:pointer;
}
.au-link:hover{color:var(--yolk-deep);text-decoration:underline}
.au-alt-sep{width:1px;height:11px;background:var(--line)}
.au-sub{margin:0 0 14px;font-size:15px;color:var(--text)}
/* 登录方式切换（密码 / 邮箱验证码）：比顶层 au-tabs 更轻的分段控件 */
.au-modes{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:var(--au-soft);border-radius:12px;padding:4px;margin-bottom:18px}
.au-mode{
  border:none;background:none;padding:9px;border-radius:9px;cursor:pointer;
  font-size:13.5px;font-weight:700;color:var(--muted);font-family:inherit;
  transition:background .15s, color .15s;
}
.au-mode:hover{color:var(--text)}
.au-mode.active{background:var(--card);color:var(--text);box-shadow:var(--shadow)}
/* 验证码输入 + 获取按钮同一行；输入框自适应，按钮不收缩 */
.au-code-row{display:flex;gap:8px}
.au-code-row input{flex:1;min-width:0}
.au-code-row .btn{
  flex:none;width:auto;margin:0;padding:0 16px;border-radius:12px;
  background:var(--card);border:1.5px solid var(--line);color:var(--text);
  font-size:13.5px;font-weight:700;
}
.au-code-row .btn:hover:not(:disabled){border-color:var(--yolk);color:var(--yolk-deep)}
.au-code-row .btn:disabled{opacity:.6;cursor:not-allowed}
/* 游客登录：虚线描边的次级入口，视觉上弱于主登录按钮 */
.au-guest{margin-top:14px}
.au-guest .btn{
  width:100%;padding:12px;border-radius:12px;
  background:transparent;border:1.5px dashed var(--au-line);
  color:var(--au-ink2);font-size:14px;font-weight:700;
  transition:border-color .15s, color .15s;
}
.au-guest .btn:hover{border-color:var(--yolk);color:var(--au-ink)}
.au-guest-tip{text-align:center;font-size:12px;color:var(--au-ink2);margin:8px 0 0}
.au-perks{
  margin-top:20px;display:flex;flex-direction:column;gap:9px;
  background:var(--au-soft);border-radius:14px;padding:15px 18px;font-size:13px;color:var(--text);
}
.au-perks div{display:flex;gap:9px;align-items:center}
.au-perks svg{flex:none;color:var(--yolk-deep)}
.au-perks b{color:var(--yolk-deep)}
@media (max-width:900px){
  .au-wrap{grid-template-columns:1fr}
  .au-brand{display:none}
  .au-panel{padding:32px 18px;align-items:flex-start}
}

/* ============ 用户举报（feat-report）============ */
/* 折叠式举报入口：收起时是一行灰色小字，点开原地展开表单；post-foot/卡片底部通用 */
.rpt { margin-left: auto; }
.rpt > summary {
  list-style: none; cursor: pointer; color: var(--muted);
  font-size: 12px; white-space: nowrap; user-select: none;
}
.rpt > summary::-webkit-details-marker { display: none; }
.rpt > summary:hover { color: var(--text); }
.rpt[open] > summary { margin-bottom: 6px; }
.rpt form { display: flex; gap: 6px; align-items: center; }
.rpt input[name="reason"] { flex: 1; min-width: 160px; }

/* ============ 后台用户操作列（封禁 / 重置密码）============ */
.adm-actions { flex-wrap: wrap; }
.adm-reset { display: flex; gap: 5px; align-items: center; }
.adm-reset input { width: 132px; }
/* ============ 首页改版：Hero / 今日香蛋 TOP3 / 限时彩蛋 / 滚动线报（hp- 前缀） ============ */
.hp-blocks{ --hp-yolk:#FF9E1B; --hp-yolk-deep:#FF7A00; }
.hp-blocks > section, .hp-blocks > .hp-ticker { margin-bottom:12px; }

/* Hero：左文案右真实统计 */
.hp-hero{display:flex;align-items:center;justify-content:space-between;gap:18px}
.hp-hero-title{margin:0;font-size:21px;font-weight:800;line-height:1.4}
.hp-hero-sub{margin:6px 0 14px}
.hp-hero-actions{display:flex;gap:8px}
.hp-hero-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;flex:none}
.hp-stat{
  min-width:76px;padding:10px 12px;text-align:center;
  background:var(--card-2);border:1px solid var(--line);border-radius:10px;
}
.hp-stat-num{display:block;font-size:20px;font-weight:800;color:var(--hp-yolk-deep);line-height:1.3}
.hp-stat-label{display:block;margin-top:2px;font-size:12px;color:var(--muted);white-space:nowrap}

/* 今日香蛋 TOP3 */
.hp-top3-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.hp-top3-item{
  display:flex;align-items:center;gap:10px;padding:10px 12px;color:var(--text);
  background:var(--card-2);border:1px solid var(--line);border-radius:10px;
}
.hp-top3-item:hover{text-decoration:none;border-color:var(--hp-yolk)}
.hp-rank{
  flex:none;width:22px;height:22px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;color:#fff;background:var(--muted);
}
.hp-rank-1{background:linear-gradient(135deg,var(--hp-yolk),var(--hp-yolk-deep))}
.hp-top3-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.hp-top3-name{font-size:14px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hp-top3-meta{display:flex;align-items:baseline;gap:8px;font-size:11.5px;min-width:0}
.hp-top3-provider{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 香/臭计数：都靠最右侧对齐展示 */
.hp-top3-votes{flex:none;display:flex;align-items:baseline;gap:8px}
.hp-v-good,.hp-v-bad{font-size:12px;font-weight:700;font-variant-numeric:tabular-nums}
.hp-v-good{color:var(--ok)}
.hp-v-bad{color:var(--danger)}
/* 香臭比横条：绿色填充 = 香占比，底轨是臭的淡红 */
.hp-ratio-bar{display:block;height:4px;border-radius:999px;overflow:hidden;margin-top:3px;
  background:color-mix(in srgb,var(--danger) 32%,transparent)}
.hp-ratio-bar > i{display:block;height:100%;border-radius:999px;background:var(--ok);transition:width .3s ease}

/* 限时彩蛋 */
.hp-flash-hint{font-size:12px;font-weight:400}
.hp-flash-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 18px}
.hp-flash-list li{display:flex;align-items:baseline;gap:8px;min-width:0}
.hp-flash-title{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hp-flash-title:hover{color:var(--link);text-decoration:none}
.hp-flash-stock{flex:none;font-size:12px;font-weight:700;color:var(--hp-yolk-deep)}
/* 未到开抢时间的彩蛋：角标改用信息色，不暗示"现在就能抢" */
.hp-flash-timed{color:var(--link);font-weight:600;border:1px solid color-mix(in srgb,var(--link) 40%,transparent);border-radius:999px;padding:0 8px}
.hp-flash-exp{flex:none;font-size:12px}

/* 首页福利中心入口卡 */
.hp-more{float:right;font-size:12px;font-weight:400}
.hp-fulu-hint{margin:0 0 8px;font-size:12.5px}
.hp-fulu-hint strong{color:var(--hp-yolk-deep);font-size:14px}
.hp-fulu-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.hp-fulu-list li{display:flex;align-items:baseline;gap:8px;min-width:0}
.hp-fulu-icon{flex:none;font-size:15px}
.hp-fulu-title{flex:1;min-width:0;font-size:14px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hp-fulu-title:hover{color:var(--link);text-decoration:none}
.hp-fulu-price{flex:none;font-size:12px;font-weight:700;color:var(--hp-yolk-deep)}
.hp-fulu-coming{flex:none;font-size:11px;padding:1px 7px;border-radius:999px;background:var(--card-2);border:1px solid var(--line);color:var(--muted)}

/* 滚动线报：内容复制两份，translateX(-50%) 无缝循环，hover 暂停 */
.hp-ticker{
  display:flex;align-items:center;gap:10px;height:38px;padding:0 14px;overflow:hidden;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
}
.hp-ticker-label{
  flex:none;font-size:12px;font-weight:700;color:#fff;padding:2px 10px;border-radius:999px;
  background:linear-gradient(135deg,var(--hp-yolk),var(--hp-yolk-deep));
}
.hp-ticker-view{flex:1;min-width:0;overflow:hidden}
.hp-ticker-track{display:flex;width:max-content;animation:hp-marquee 30s linear infinite}
.hp-ticker-view:hover .hp-ticker-track{animation-play-state:paused}
.hp-ticker-seq{display:flex;align-items:center;gap:28px;padding-right:28px;white-space:nowrap}
.hp-ticker-item{font-size:13px;color:var(--text)}
.hp-ticker-item:hover{color:var(--link);text-decoration:none}
@keyframes hp-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.hp-ticker-track{animation:none}}

/* 搜索结果扩展区块 */
.hp-search-block{margin-top:14px}
.hp-search-list{list-style:none;margin:0;padding:0}
.hp-search-list li{display:flex;align-items:baseline;gap:10px;padding:7px 0;border-bottom:1px dashed var(--line)}
.hp-search-list li:last-child{border-bottom:none;padding-bottom:0}
.hp-search-name{font-weight:600;color:var(--text);min-width:0}
.hp-search-name:hover{color:var(--link);text-decoration:none}
.hp-search-meta{flex:none;font-size:12px}

@media (max-width:900px){
  .hp-hero{flex-direction:column;align-items:flex-start}
  .hp-hero-stats{width:100%}
  .hp-top3-grid{grid-template-columns:1fr}
  .hp-flash-list{grid-template-columns:1fr}
}

/* ============ 锚点跳转的滚动偏移 ============ */
/* 投票 / 回复 / 点评等表单提交后带 #reply-N / #item-N / #reward-N / #rate / #comments
   跳回时，预留吸顶栏高度，避免目标内容被顶栏遮住 */
[id^="reply-"], [id^="item-"], [id^="reward-"], #rate, #comments { scroll-margin-top: 84px; }

/* ============ 艺术字称号（image 形式） ============ */
/* 称号图自带深蓝底板（明暗主题下都清晰），不再叠一层深色框 */
.title-art {
  display: inline-flex; align-items: center;
  vertical-align: -0.4em;
}
.title-art img { height: 1.5em; display: block; }
.title-art-lg { vertical-align: middle; }
.title-art-lg img { height: 56px; }

/* ============ 站务公告弹窗 ============ */
/* 服务端决定是否渲染（关过当前版本就不输出），渲染即展示：
   无 JS 用户靠原生表单提交关闭（服务端记账 + cookie），有 JS 时 main.js 拦截为 AJAX 关窗 */
.ann-overlay {
  position: fixed; inset: 0; z-index: 1200;
  background: rgba(0, 0, 0, .5);
  display: flex; align-items: center; justify-content: center;
  padding: 20px; animation: ann-fade .18s ease;
}
@keyframes ann-fade { from { opacity: 0; } to { opacity: 1; } }
.ann-box {
  background: var(--card); border: 1px solid var(--line); border-radius: var(--radius);
  width: 100%; max-width: 560px; max-height: 78vh; overflow: auto;
  padding: 20px 22px 18px; box-shadow: 0 16px 48px rgba(0, 0, 0, .24);
}
.ann-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.ann-head h3 { margin: 0; font-size: 17px; min-width: 0; }
.ann-tag {
  flex: none; font-size: 12px; font-weight: 700; color: #fff;
  background: linear-gradient(135deg, var(--yolk), var(--yolk-deep));
  border-radius: 999px; padding: 2px 10px;
}
.ann-body { font-size: 14px; line-height: 1.7; color: var(--text); }
.ann-body p:first-child { margin-top: 0; }
.ann-body p:last-child { margin-bottom: 0; }
.ann-foot { display: flex; justify-content: flex-end; margin-top: 16px; }
body.ann-open { overflow: hidden; }

/* 管理端·公告管理：当前公告预览 */
.ann-preview { border: 1px dashed var(--line); border-radius: var(--radius); padding: 14px 16px; margin-bottom: 6px; }
.ann-preview-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.ann-preview-body { font-size: 14px; }

/* ============ 用户邀请中心 ============ */
.ic-code-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 12px; }
.ic-code-card {
  border: 1px solid var(--line); border-radius: var(--radius); background: var(--card-2);
  padding: 14px 12px; text-align: center; display: flex; flex-direction: column; gap: 10px; align-items: center;
}
.ic-code-card.used { opacity: .55; }
.ic-code { font-size: 14px; font-weight: 700; letter-spacing: .5px; user-select: all; word-break: break-all; }
.ic-code-meta { min-height: 22px; }
.ic-code-meta a { font-weight: 600; }
@media (max-width: 640px) { .ic-code-grid { grid-template-columns: 1fr; } }
/* ============ 移动端适配打磨 ============ */
/* Grid 的 1fr 默认最小值是 min-content：列里有 nowrap 长标题 / 滚动线报时会把整列撑出屏幕。
   统一改成 minmax(0,1fr)，并让列容器允许收缩。 */
.page-layout, .profile-layout { grid-template-columns: minmax(0, 1fr) 264px; }
.main-col, .profile-main, .profile-side, .side-col, .home-left, .home-rail { min-width: 0; }
@media (max-width: 1100px) {
  .home-layout { grid-template-columns: 200px minmax(0, 1fr); }
}
@media (max-width: 900px) {
  .page-layout, .profile-layout, .home-layout { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 720px) {
  /* 顶栏拆成两行：第一行 品牌 + 操作按钮，第二行 导航（窄屏可横向滑动） */
  .topbar-inner {
    position: relative; height: auto; flex-wrap: wrap;
    gap: 0 8px; padding: 8px 12px 0;
  }
  .brand { order: 1; min-height: 36px; }
  .topbar-right { order: 2; gap: 4px; }
  .topbar-right .btn { white-space: nowrap; }
  .main-nav {
    order: 3; flex: 1 0 100%; margin: 0 -12px; padding: 4px 8px 8px;
    overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .main-nav::-webkit-scrollbar { display: none; }
  .main-nav a, .nav-more-btn { flex: none; padding: 6px 10px; }
  /* 导航可滚动后，「更多」菜单改为相对整条顶栏定位，避免被滚动容器裁掉 */
  .nav-more { position: static; }
  .nav-more-menu { left: auto; right: 12px; top: 100%; }
  .nav-more-menu::before { display: none; }

  /* iOS Safari 对 <16px 的输入框聚焦时会自动放大页面，统一起 16px。
     除文本/密码/搜索/下拉外，再补齐 email/number/tel/url：设置页绑邮箱、
     登录页邮箱验证码、彩蛋分享的份额/天数、邀请码数量都是这些类型 */
  textarea, input[type="text"], input[type="password"], input[type="search"],
  input[type="email"], input[type="number"], input[type="tel"], input[type="url"], select { font-size: 16px; }

  /* 宽表格（后台、榜单、签到排行）在卡片内横向滚动，而不是撑破页面 */
  .data-table { display: block; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
  .rv-comment, .mod-reasons { white-space: normal; min-width: 160px; }

  /* 举报表单展开后换行 */
  .rpt form { flex-wrap: wrap; }
  .rpt input[name="reason"] { min-width: 0; flex-basis: 100%; }

  /* 触控目标：投票、小按钮、举报在窄屏至少 36px 高，减少误触 */
  .vote-btn, .mini-btn, .rpt > summary, .adm-menu > summary { min-height: 36px; }
  .vote-btn { padding: 6px 14px; }
  .mini-btn { padding: 6px 12px; display: inline-flex; align-items: center; }
  .rpt > summary { display: inline-flex; align-items: center; padding: 0 8px; }
  /* 投票按钮基础态只有 3px 12px（约 25px 高），低于 44px 触摸目标建议，手机端加大
     padding 与字号；放在上方 .vote-btn 覆盖规则之后，确保这里的 padding 生效。桌面不变 */
  .vote-btn { padding: 7px 14px; font-size: 14px; }

  /* 个人页回复摘要让位给标题 */
  .re-excerpt { max-width: 40%; }

  .container { padding: 12px 12px 32px; }
  .topic-head-card { padding: 14px 16px; }
  .th-title { font-size: 19px; }
  .post-card.op { padding: 16px; }
  .footer-inner { padding: 14px 12px; }

  /* 首页 Hero 统计：去掉 76px 最小宽度，窄屏收紧间距 */
  .hp-hero-stats { gap: 6px; }
  .hp-stat { min-width: 0; padding: 8px 4px; }
  .hp-stat-num { font-size: 18px; }
}

/* ============ 搜索入口 ============ */
/* 顶栏搜索图标：仅在搜索框被隐藏的窄屏显示 */
.search-btn { display: none; }
@media (max-width: 720px) {
  .search-btn { display: inline-flex; }
}
/* 搜索页内的搜索表单 */
.search-page-form { display: flex; gap: 8px; margin-bottom: 14px; }
.search-page-form input {
  flex: 1; min-width: 0; padding: 9px 12px;
  border: 1px solid var(--line); border-radius: 8px; background: var(--card);
}

/* ============ 窄屏首页 ============ */
/* 分区快捷条：宽屏有左栏分区列表，不显示 */
.board-strip { display: none; }
@media (max-width: 900px) {
  .board-strip {
    display: flex; gap: 6px; margin-bottom: 12px; overflow-x: auto;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .board-strip::-webkit-scrollbar { display: none; }
  .board-strip a {
    flex: none; display: inline-flex; align-items: center; gap: 6px;
    padding: 6px 12px; border: 1px solid var(--line); border-radius: 999px;
    background: var(--card); color: var(--text); font-size: 13.5px; white-space: nowrap;
  }
  .board-strip a:hover { text-decoration: none; background: var(--card-2); }
  .board-strip a.active { font-weight: 700; border-color: var(--text); }
  .board-strip .dot { width: 7px; height: 7px; border-radius: 50%; }
}
@media (max-width: 900px) {
  /* 单列时右栏（用户卡片/站点数据/在线/聊天室入口）排在话题列表之后、左栏分区之前 */
  .home-rail { grid-column: auto; order: 2; }
  .home-left { order: 3; }
}
/* Hero 标题避免最后一两个字单独成行 */
.hp-hero-title { text-wrap: balance; }

/* ============ 手机端底部标签栏（新的移动导航） ============ */
/* 宽屏不渲染：电脑端继续用顶栏的 .main-nav。仅在 ≤720px 由底部标签栏接管导航，
   顶栏只保留品牌 + 搜索/主题/通知/头像等图标操作，窄屏不再挤一行横向滑动的页签。 */
.mtab, .mtab-overlay, .mtab-sheet { display: none; }

@media (max-width: 720px) {
  .main-nav { display: none; }
  /* 顶栏收成单行（导航已下移到底部） */
  .topbar-inner { padding: 8px 12px; }

  .mtab {
    display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 150;
    padding-bottom: env(safe-area-inset-bottom);
    background: color-mix(in srgb, var(--card) 94%, transparent);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border-top: 1px solid var(--line);
  }
  .mtab-item {
    flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
    gap: 3px; padding: 7px 2px 6px; border: none; background: none;
    color: var(--muted); font-size: 10.5px; font-weight: 500; line-height: 1;
    -webkit-tap-highlight-color: transparent;
  }
  .mtab-item svg { width: 22px; height: 22px; }
  .mtab-item span { white-space: nowrap; }
  .mtab-item.active { color: var(--yolk-deep); font-weight: 700; }
  .mtab-item:active { background: var(--card-2); }

  .mtab-overlay {
    display: block; position: fixed; inset: 0; z-index: 160;
    background: rgba(0, 0, 0, .42); opacity: 0; pointer-events: none; transition: opacity .2s ease;
  }
  .mtab-overlay.open { opacity: 1; pointer-events: auto; }

  .mtab-sheet {
    display: flex; flex-direction: column; position: fixed; left: 0; right: 0; bottom: 0; z-index: 161;
    background: var(--card); border-radius: 18px 18px 0 0;
    box-shadow: 0 -8px 30px rgba(0, 0, 0, .18);
    padding: 6px 14px calc(18px + env(safe-area-inset-bottom));
    max-height: 78vh; overflow-y: auto;
    transform: translateY(102%); transition: transform .24s ease;
  }
  .mtab-sheet.open { transform: translateY(0); }
  .mtab-sheet-grip { width: 40px; height: 4px; border-radius: 999px; background: var(--line); margin: 4px auto 10px; flex: none; }
  .mtab-sheet-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
  .mtab-sheet-head strong { font-size: 15px; }
  .mtab-sheet-close {
    width: 32px; height: 32px; border: none; border-radius: 50%; background: var(--card-2);
    color: var(--muted); font-size: 14px; line-height: 1;
  }
  .mtab-sheet-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .mtab-sheet-grid a {
    display: flex; align-items: center; justify-content: center; min-height: 44px; text-align: center;
    border: 1px solid var(--line); border-radius: 10px; background: var(--card-2);
    color: var(--text); font-size: 13.5px; padding: 6px 8px;
  }
  .mtab-sheet-grid a.active {
    border-color: var(--yolk); color: var(--yolk-deep); font-weight: 700;
    background: color-mix(in srgb, var(--yolk) 12%, transparent);
  }
  .mtab-sheet-sep { height: 1px; background: var(--line); margin: 12px 0; }
  .mtab-sheet-logout { margin-top: 12px; }
  .mtab-sheet-logout button {
    width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 10px;
    background: var(--card); color: var(--danger); font-size: 14px; font-weight: 600;
  }
  .mtab-sheet-auth { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
  .mtab-sheet-auth .btn { min-height: 44px; }
  body.mtab-locked { overflow: hidden; }

  /* 固定底栏不遮住正文/页脚：给带底栏的页面（body.site）留出底栏高度 + 安全区。
     登录/注册页是独立模板、没有底栏，不加这段留白。 */
  body.site { padding-bottom: calc(62px + env(safe-area-inset-bottom)); }
}

/* ============ PWA（手机端 App）与聊天室入口 ============ */
/* 桌面「更多」下拉里的「安装 App」按钮：外观对齐菜单项 <a> */
.nav-more-menu button {
  display: block; width: 100%; text-align: left; padding: 8px 10px; border: none; border-radius: 7px;
  background: none; color: var(--text); font-size: 14px; font-family: inherit; cursor: pointer;
}
.nav-more-menu button:hover { background: var(--card-2); }

/* 手机端「更多」面板里的「安装 App」：样式对齐格子里的 <a>（.mtab-sheet-grid a）。
   该元素只存在于手机端「更多」面板，故直接写进基础规则：作为 3 列网格
   .mtab-sheet-grid 的子元素，1 / -1 让它通栏横跨整行，主推入口更醒目也更好点 */
.mtab-install {
  display: flex; align-items: center; justify-content: center; min-height: 44px; text-align: center;
  border: 1px dashed var(--yolk); border-radius: 10px; background: color-mix(in srgb, var(--yolk) 10%, transparent);
  color: var(--yolk-deep); font-size: 13.5px; font-weight: 600; padding: 6px 8px; cursor: pointer;
  grid-column: 1 / -1;
}

/* 已在 App（standalone）模式下不再展示安装入口 */
@media (display-mode: standalone) {
  [data-pwa-install] { display: none; }
}

/* PWA 轻提示（更新就绪 / 安装指引）：底部居中的深色胶囊，独立于业务 toast */
#jyPwaToast {
  position: fixed; left: 50%; bottom: calc(74px + env(safe-area-inset-bottom)); z-index: 400;
  transform: translate(-50%, 16px);
  display: flex; align-items: center; gap: 10px;
  max-width: min(92vw, 420px);
  padding: 10px 16px; border-radius: 999px;
  background: rgba(28, 30, 34, .94); color: #fff;
  font-size: 13.5px; line-height: 1.4; box-shadow: 0 6px 24px rgba(0, 0, 0, .28);
  opacity: 0; pointer-events: none; transition: opacity .22s ease, transform .22s ease;
}
#jyPwaToast.open { opacity: 1; pointer-events: auto; transform: translate(-50%, 0); }
#jyPwaToast .jpt-action {
  flex: none; border: none; border-radius: 999px; padding: 4px 12px;
  background: var(--yolk); color: #fff; font-size: 12.5px; font-weight: 700; cursor: pointer;
}
@media (min-width: 721px) { #jyPwaToast { bottom: 28px; } }