/* ========================================
   米哈游游戏Wiki - 自定义样式
   设计参考：三栏布局 + 青绿主调 + 卡片流
   ======================================== */

/* ============================================================
   动效设计基线（Design Tokens）
   ------------------------------------------------------------
   为什么要有这一层：动效是**框架的地基**，必须一开始就定下来 ——
   事后往各处塞 `transition: all .3s` 的结果是：时长不一、缓动各异、
   无障碍处理遗漏、改一处要全站找。定成 token 后，全站只管引用变量。

   ⚠️ 三条纪律：
   1) **禁用 `transition: all`** —— 会连 width/height 一起过渡，触发不必要的
      重排（layout），在长列表上肉眼可见地卡。永远显式列出属性。
   2) **只动 compositor 友好属性**：opacity / transform / color /
      background-color / border-color / box-shadow / clip-path。
      动 width/height/top/left 会触发 layout，代价高一个数量级。
   3) **每个动效都必须能被 prefers-reduced-motion 关掉**（见下方全局熔断）。
   ============================================================ */
:root {
  /* --- 时长阶梯（对标 GitHub Primer 的 --base-duration-*）--- */
  --dur-instant: 80ms;   /* 开关、打勾这类"瞬时"反馈 */
  --dur-fast:    150ms;  /* 按钮按下、图标变色 */
  --dur-base:    200ms;  /* 卡片 hover（最常用） */
  --dur-slow:    300ms;  /* 面板展开、页面进场 */
  --dur-slower:  500ms;  /* 大区块淡入（与位移配合时用更长值） */

  /* --- 缓动曲线 --- */
  --ease-out:    cubic-bezier(0.33, 1, 0.68, 1);    /* 通用出场：快起慢收，最自然 */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);    /* 对称进退 */
  --ease-spring: cubic-bezier(0.2, 0, 0.13, 1.5);   /* 轻微回弹（y 控制点 >1），徽章/图标弹出 */
  --ease-swift:  cubic-bezier(0.08, 0.52, 0.52, 1); /* 文档站常用，位移感干净 */

  /* --- 位移距离 --- */
  --shift-sm: 4px;   /* 卡片 hover 抬起 */
  --shift-md: 8px;   /* 进场淡入的初始下移（**别用 100%**，那是横幅用的量级） */
  --shift-lg: 16px;  /* 抽屉/面板滑入 */

  /* --- 常用组合（一处改、全站生效）--- */
  --t-hover: border-color var(--dur-base) var(--ease-out),
             box-shadow   var(--dur-base) var(--ease-out),
             transform    var(--dur-base) var(--ease-out);
  --t-press: transform var(--dur-instant) var(--ease-out);
  --t-fade:  opacity var(--dur-slow) var(--ease-out);

  /* --- 布局尺寸（供锚点偏移等 calc 引用，改一处全站跟随）--- */
  --header-height: 60px;   /* 与 .top-header-inner 的 height 保持一致 */

  /* ========== 颜色令牌（2026-09-28 立，主题系统的基础）==========
     立这里的理由：此前主色 `#00BFA5` 在本文件里**硬编码了 54 处**，
     想换个主题色得全文替换（还容易漏），于是"换主题"这件事根本做不了。
     抽成变量后，主题只要覆盖 `:root` 里这几个值即可换肤 ——
     加载顺序上主题 CSS 在 style.css **之后**（见 app.js 的 applyTheme），所以主题必胜。

     ⚠️ 新增颜色时**一律用变量**，不要再写 hex 字面量 ——
        写死一个就等于给未来的主题埋一个"这块换不掉"的坑。 */
  --color-primary:      #00BFA5;   /* 主品牌青绿 */
  --color-primary-dark: #0D9488;   /* 主色的深一档（按钮 hover、激活态） */
  --color-primary-soft: #E6F7F5;   /* 主色的极浅底（选中背景、标签底） */
  --color-accent:       #00BCD4;   /* 渐变里的辅助青 */
  --color-text:         #1F2937;   /* 主文字 */
  --color-text-muted:   #6B7280;   /* 次要文字 */
  --color-text-faint:   #9CA3AF;   /* 极次要（时间戳等） */
  --color-border:       #E5E7EB;   /* 常规边框 */
  --color-surface:      #FFFFFF;   /* 卡片/面板底 */
  --color-bg:           #F5F7FA;   /* 页面底色 */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
}

/* ============================================================
   动效无障碍：全局熔断
   ------------------------------------------------------------
   用 **1ms 而不是 none** —— 关键区别：
     `animation: none` 会让依赖 `animationend` 事件的 JS 永远收不到回调（回调挂死）；
     `1ms` 仍会派发动画事件，只是视觉上瞬间完成。
   同理 `animation-iteration-count: 1` 杀掉无限循环（spinner 等）。
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 1ms !important;
    animation-iteration-count: 1 !important;
    animation-delay: -1ms !important;
    transition-duration: 1ms !important;
    transition-delay: 0ms !important;
    scroll-behavior: auto !important;   /* 前庭功能障碍用户对平滑滚动敏感 */
  }
}

/* ============================================================
   通用动效工具类
   ============================================================ */

/* 注：进场淡入由下方「页面切换过渡」那套 pageEnter 体系负责（含 stagger 错峰），
   不要在别处再造一套 —— 实测两套 animation 会打架：
   animation 的优先级高于普通声明，后者的 opacity 会被前者的 fill-mode 压住。 */

/* 按下反馈：点击时轻微下沉（transform 不影响布局）
   ⚠️ 踩过的三个坑（顺序递进，最后一个是正解）：
     ① `button { transition: var(--t-press) }` —— 覆盖掉各组件自己的 transition，把悬停效果弄没；
     ② `transition-property: ...` 单独写 —— 会把 duration/timing 重置成默认 0s，更糟；
     ③ `button { transition: 原有属性..., transform }` 想"合并" —— 但各按钮类
        （.top-admin / .mp-btn …）在**更靠后**的位置又各写了一遍自己的 transition，
        同特异度下后者胜出，这条通用规则被**静默吃掉**
        （测试实测：计算出的 transition-property 里根本没有 transform）。
   正解：按下反馈改用 **animation** —— animation 与 transition 是两套独立机制，
        不会互相覆盖，也不需要先声明 transition 就能生效。 */
button:not(:disabled):active,
.top-admin:active {
  animation: pressFeedback var(--dur-instant) var(--ease-out);
}
@keyframes pressFeedback {
  from { transform: scale(1); }
  to   { transform: scale(0.97); }
}

/* 需要单独特化时用这个工具类（走 transition，适合自己完全可控的组件） */
.pressable { transition: var(--t-press); }
.pressable:active { transform: scale(0.97); }

/* 内联加载指示（供按钮/异步区用） */
.spinner {
  display: inline-block; width: 14px; height: 14px;
  border: 2px solid currentColor; border-top-color: transparent;
  border-radius: 50%; vertical-align: -2px;
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(1turn); } }

/* 按钮"处理中"反馈（2026-10-13）：点击后由 Delegator 统一给后台按钮加 .btn-busy。
   目的：点下去**立刻**有反馈（转圈 + 变暗 + 禁点），不必等异步请求回来才"像是有反应"。
   ⚠️ 用 ::after 伪元素做转圈，不占布局、不改按钮文字（各按钮文案/图标保持不变）。
   pointer-events:none 顺带防连点（视觉上配合 opacity 变暗）。 */
button.btn-busy {
  position: relative;
  opacity: 0.7;
  pointer-events: none;
  cursor: default;
}
button.btn-busy::after {
  content: '';
  display: inline-block;
  width: 12px; height: 12px;
  margin-left: 6px;
  vertical-align: -1px;
  border: 2px solid currentColor;
  border-top-color: transparent;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}

/* 锚点偏移：站内锚点跳转不被吸顶导航遮住（词条标题跳转必需） */
:target { scroll-margin-top: calc(var(--header-height, 60px) + 1rem); }

/* 全局重置 */
* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  background: #F5F7FA;
  color: #1F2937;
  min-height: 100vh;
  font-size: 14px;
  line-height: 1.6;
}

/* 背景层 */
.bg-layer {
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 15% 15%, rgba(0,191,165,0.04) 0%, transparent 50%),
    radial-gradient(ellipse at 85% 85%, rgba(0,188,212,0.03) 0%, transparent 50%),
    #F5F7FA;
  background-size: cover, cover, auto;
  background-position: center;
}
/* v0.14：站点背景图（后台可配）。--site-bg 由 app.js 注入；叠加白色蒙层保证内容可读 */
.bg-layer.has-image {
  background-image:
    linear-gradient(rgba(248,250,252,0.66), rgba(248,250,252,0.93) 45%, rgba(248,250,252,0.96)),
    var(--site-bg, none);
  background-size: cover, cover;
  background-position: center top, center top;
  background-repeat: no-repeat, no-repeat;
  animation: bgFadeIn 0.9s ease-out both;
}
@keyframes bgFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
/* 首页 Hero 轻微上浮入场 */
@keyframes heroRise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero-inner > * { animation: heroRise 0.5s ease-out both; }
.hero-inner > *:nth-child(2) { animation-delay: 0.06s; }
.hero-inner > *:nth-child(3) { animation-delay: 0.12s; }
.hero-inner > *:nth-child(4) { animation-delay: 0.18s; }
.hero-inner > *:nth-child(5) { animation-delay: 0.24s; }
/* 卡片悬停抬升 */
/* 卡片 hover：统一的过渡与位移
   ⚠️ 用 `@media (hover: hover)` 包住 —— 触屏设备上 hover 会"粘住"（点完仍保持悬停态），
      移动端流量大的站点必须处理。桌面端才启用抬升效果。
   ⚠️ 位移量统一走 --shift-* token：此前同一种卡片在不同段落里写了 -3px / -2px 两个值，
      后者覆盖前者，改起来要全站找 —— 现在只有一处定义。 */
.game-card, .wiki-card, .timeline-card {
  transition: transform var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out),
              border-color var(--dur-base) var(--ease-out);
}
@media (hover: hover) {
  .game-card:hover, .wiki-card:hover, .timeline-card:hover {
    transform: translateY(calc(-1 * var(--shift-sm)));
  }
}

/* 后台/登录背景层（admin.html 的 .bg-gradient）——加站点背景图，蒙层比前台更重保证编辑可读 */
.bg-gradient {
  position: fixed; top: 0; left: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none; background: #F8FAFC;
}
.bg-gradient.has-image {
  background-image:
    linear-gradient(rgba(248,250,252,0.90), rgba(248,250,252,0.96)),
    var(--site-bg, none);
  background-size: cover, cover; background-position: center top, center top;
  background-repeat: no-repeat, no-repeat;
  animation: bgFadeIn 0.9s ease-out both;
}

/* ========== 顶部导航栏 ========== */
.top-header {
  position: sticky;
  top: 0;
  z-index: 60;
  background: #FFFFFF;
  border-bottom: 1px solid #E5E7EB;
  box-shadow: 0 1px 6px rgba(0,0,0,0.04);
}
.top-header-inner {
  width: 100%;
  padding: 0 20px;
  height: 60px;
  display: flex;
  align-items: center;
  gap: 20px;
}
.top-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  flex-shrink: 0;
}
.top-brand-text { display: flex; flex-direction: column; }
.top-brand-name { font-size: 16px; font-weight: 700; color: #1F2937; line-height: 1.2; }
.top-brand-slogan { font-size: 11px; color: #9CA3AF; }
.top-nav { display: flex; align-items: center; gap: 4px; overflow-x: auto; flex-shrink: 0; max-width: 55vw; }
.top-nav-link {
  white-space: nowrap; padding: 5px 11px; border-radius: 8px;
  font-size: 13px; color: #4B5563; cursor: pointer; text-decoration: none;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); user-select: none;
}
.top-nav-link:hover { background: #EEF2FF; color: #1D4ED8; }
.top-nav-link.active { background: #E0E7FF; color: #1D4ED8; font-weight: 600; }
@media (max-width: 900px) { .top-nav { display: none; } } /* 窄屏收起，避免挤占搜索 */
.top-search {
  position: relative;
  flex: 1;
  max-width: 420px;
  margin-left: auto;
}
.top-admin {
  flex-shrink: 0;
  font-size: 13px;
  color: #6B7280;
  text-decoration: none;
  padding: 6px 10px;
  border-radius: 8px;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
  white-space: nowrap;
  background: none;
  border: none;
  cursor: pointer;
  font-family: inherit;
}
.top-admin:hover { background: #F3F4F6; color: var(--color-primary); }
/* v0.10 用户区 */
.top-user {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
  margin-left: 8px;
}

/* 移动端头部（搜索自动隐藏，放宽品牌区） */
@media (max-width: 768px) {
  .top-header-inner { padding: 0 12px; gap: 12px; height: 52px; }
  .top-games { display: none; }
  .top-search { display: none; }
  .top-admin { margin-left: auto; }
}

/* ========== 三栏布局 ========== */
.app-container {
  display: flex;
  position: relative;
  z-index: 1;
  min-height: calc(100vh - 60px);
  width: 100%;
  align-items: stretch;
}

@media (max-width: 768px) {
  .app-container { min-height: calc(100vh - 52px); }
}

/* ========== 左侧导航栏 ========== */
.sidebar {
  width: 260px;
  flex-shrink: 0;
  background: #FFFFFF;
  border-right: 1px solid #E5E7EB;
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 60px;
  height: calc(100vh - 60px);
  overflow-y: auto;
}

/* 品牌区 */
.sidebar-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  border-bottom: 1px solid #F0F2F5;
}
.brand-icon {
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: linear-gradient(135deg, #00BCD4, var(--color-primary));
  color: white;
  font-weight: 700;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.brand-name {
  font-size: 16px;
  font-weight: 700;
  color: #1F2937;
}
.brand-slogan {
  font-size: 11px;
  color: #9CA3AF;
  margin-top: 1px;
}

/* 导航菜单 */
.sidebar-nav {
  flex: 1;
  padding: 8px 0;
  overflow-y: auto;
}
.nav-group {
  margin-bottom: 8px;
}
.nav-group-title {
  font-size: 11px;
  font-weight: 600;
  color: #9CA3AF;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 20px 4px;
}
.nav-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 20px;
  font-size: 14px;
  color: #4B5563;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
  border-left: 3px solid transparent;
}
.nav-item:hover {
  background: #F3F4F6;
  color: #1F2937;
}
.nav-item.active {
  background: #E0F7F5;
  color: var(--color-primary);
  border-left-color: var(--color-primary);
  font-weight: 500;
}
.nav-item-icon {
  font-size: 16px;
  width: 20px;
  text-align: center;
  flex-shrink: 0;
}
.nav-item-arrow {
  margin-left: auto;
  font-size: 10px;
  color: #D1D5DB;
  transition: transform var(--dur-base) var(--ease-out);
}
.nav-item.expanded .nav-item-arrow {
  transform: rotate(90deg);
}
/* 折叠菜单展开动画
   说明：`.nav-subitems` 的直接子元素是**多个并排的 .nav-subitem**（不是单个包裹块），
   所以不能用 `grid-template-rows: 0fr→1fr`（那要求只有一个子元素，否则每项各自 overflow 会坏布局）。
   这里仍用 max-height，但：
     · 上限取一个**明显大于实际内容**的值（各分类项最多十来条，320px 足够），
       避免"内容一多就被硬截断"；
     · 配合 opacity 收尾 —— max-height 到顶后高度不再变，但透明度还在过渡，
       视觉上不会出现"突然停住"的僵硬感。 */
.nav-subitems {
  overflow: hidden;
  max-height: 0;
  opacity: 0;
  transition: max-height var(--dur-slow) var(--ease-out),
              opacity var(--dur-base) var(--ease-out);
}
.nav-item.expanded + .nav-subitems {
  max-height: 320px;
  opacity: 1;
}
.nav-subitem {
  display: block;
  padding: 6px 20px 6px 48px;
  font-size: 13px;
  color: #6B7280;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.nav-subitem:hover {
  background: #F3F4F6;
  color: #1F2937;
}
.nav-subitem.active {
  color: var(--color-primary);
  font-weight: 500;
}

/* 底部 */
.sidebar-footer {
  margin-top: auto;
  padding: 12px 20px;
  border-top: 1px solid #F0F2F5;
}
.sidebar-copyright p {
  font-size: 11px;
  color: #9CA3AF;
  line-height: 1.6;
}

/* ========== 中间内容区 ========== */
.main-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.top-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 24px;
  background: #FFFFFF;
  border-bottom: 1px solid #E5E7EB;
  position: sticky;
  top: 0;
  z-index: 30;
}
.sidebar-toggle {
  display: none;
  font-size: 20px;
  background: none;
  border: none;
  cursor: pointer;
  color: #6B7280;
}

/* 搜索框 */
.search-box {
  position: relative;
  flex: 1;
  max-width: 480px;
}
.search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9CA3AF;
}
#search-input {
  width: 100%;
  padding: 8px 12px 8px 40px;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  font-size: 14px;
  background: #F9FAFB;
  color: #1F2937;
  /* ⚠️ transition 里必须带上 box-shadow：focus 光晕若不过渡，会"啪"地突然出现 */
  transition: background-color var(--dur-base) var(--ease-out),
              color var(--dur-fast) var(--ease-out),
              border-color var(--dur-base) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-out);
}
#search-input:focus {
  outline: none;
  border-color: var(--color-primary);
  background: #FFFFFF;
  box-shadow: 0 0 0 3px rgba(0,191,165,0.1);
}

/* 搜索结果 */
.search-overlay {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.15);
  z-index: 29;
}
.search-overlay.show { display: block; }
.search-results {
  display: none;
  position: absolute;
  top: 100%;
  left: 0; right: 0;
  margin-top: 4px;
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.1);
  max-height: 400px;
  overflow-y: auto;
  z-index: 40;
}
.search-results.show { display: block; }
.search-result-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  cursor: pointer;
  border-bottom: 1px solid #F3F4F6;
  transition: background-color var(--dur-fast) var(--ease-out);
}
.search-result-item:last-child { border-bottom: none; }
.search-result-item:hover { background: #F0F7F5; }
.search-result-icon { font-size: 18px; }
.search-result-info { flex: 1; min-width: 0; }
.search-result-title { font-size: 14px; font-weight: 500; color: #1F2937; }
.search-result-desc { font-size: 12px; color: #9CA3AF; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.search-result-badge { font-size: 11px; color: var(--color-primary); }

/* 内容区 */
.content-area {
  padding: 20px 28px;
  flex: 1;
  display: flex;
  flex-direction: column;
  max-width: 1440px; /* 官方资料站更宽的阅读区，减少「AI 窄条居中」感 */
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

/* 深链接刷新时先藏静态首页快照（2026-10-08 修"关于本站刷新闪回主页一次"）。
   html[data-deeplink] 由 js/route-preflight.js 在 <head> 同步打上（地址带非空 hash 时）。
   不显示首页快照 → 首帧就不闪；app.js 渲染出真实内容 / 回到首页后会移除该属性。 */
html[data-deeplink] #home-static { display: none !important; }

/* 主内容容器 */
.content-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* 首页内容撑满 */
.home-section {
  margin-bottom: 24px;
}
.home-section-title {
  font-size: 16px;
  font-weight: 700;
  color: #1F2937;
  margin-bottom: 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.home-section-title::before {
  content: '';
  width: 3px;
  height: 16px;
  background: var(--color-primary);
  border-radius: 2px;
}

/* 页脚 */
.main-footer {
  margin-top: auto;
  padding: 16px 24px;
  border-top: 1px solid #E5E7EB;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 12px;
  color: #9CA3AF;
}
.main-footer-links {
  display: flex;
  gap: 16px;
}
.main-footer-links a {
  color: #6B7280;
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
.main-footer-links a:hover { color: var(--color-primary); }

/* 面包屑 */
.breadcrumb {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #9CA3AF;
  margin-bottom: 16px;
}
.breadcrumb a {
  color: #6B7280;
  cursor: pointer;
  transition: color var(--dur-fast) var(--ease-out);
}
.breadcrumb a:hover { color: var(--color-primary); }
.breadcrumb span { color: #1F2937; font-weight: 500; }

/* 页面标题 */
.page-title {
  font-size: 20px;
  font-weight: 700;
  color: #1F2937;
  margin-bottom: 4px;
}
.page-subtitle {
  font-size: 14px;
  color: #6B7280;
  margin-bottom: 20px;
}

/* ========== 首页 Hero 区 ========== */
.hero-section {
  border-radius: 16px;
  overflow: hidden;
  position: relative;
  margin-bottom: 28px;
  background:
    radial-gradient(ellipse at 18% 20%, rgba(0,188,212,0.35) 0%, transparent 55%),
    radial-gradient(ellipse at 82% 75%, rgba(0,191,165,0.30) 0%, transparent 55%),
    linear-gradient(135deg, #0F172A 0%, #134E4A 55%, var(--color-primary) 130%);
  color: #FFFFFF;
}
.hero-inner {
  padding: 44px 40px 38px;
  position: relative;
}
.hero-badge {
  display: inline-block;
  padding: 4px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  backdrop-filter: blur(4px);
  border: 1px solid rgba(255,255,255,0.22);
  font-size: 12px;
  letter-spacing: 0.5px;
  margin-bottom: 14px;
}
.hero-title {
  font-size: 32px;
  font-weight: 800;
  line-height: 1.2;
  margin-bottom: 10px;
  letter-spacing: 0.5px;
}
.hero-subtitle {
  font-size: 15px;
  color: rgba(255,255,255,0.85);
  max-width: 560px;
  line-height: 1.7;
  margin-bottom: 22px;
}
.hero-search {
  display: flex;
  gap: 8px;
  max-width: 520px;
  margin-bottom: 24px;
}
.hero-search input {
  flex: 1;
  padding: 12px 18px;
  border-radius: 10px;
  border: none;
  font-size: 15px;
  background: rgba(255,255,255,0.95);
  color: #0F172A;
  outline: none;
  box-shadow: 0 4px 18px rgba(0,0,0,0.18);
}
.hero-search input::placeholder { color: #94A3B8; }
.hero-search button {
  padding: 12px 22px;
  border-radius: 10px;
  border: none;
  background: var(--color-primary);
  color: #FFFFFF;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(0,191,165,0.35);
  white-space: nowrap;
}
.hero-search button:hover { background: #00A896; }

/* 词条贡献榜（首页） */
.contributors-grid {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

/* 首页两栏：主列 + 右侧信息栏（官方资料站风；贡献榜在 Hero 下方右侧） */
.home-layout { display: grid; grid-template-columns: 1fr 360px; gap: 28px; align-items: start; }
.home-main { min-width: 0; }
.home-aside {
  position: static; /* 不固定跟随，随页面正常滚动（右侧栏完整可见、不遮挡） */
  background: #FFFFFF; border: 1px solid #E5E7EB; border-radius: 8px; padding: 18px;
}
.home-aside .home-section-title { margin-bottom: 12px; }
@media (max-width: 1024px) {
  .home-layout { grid-template-columns: 1fr; }
  .home-aside { position: static; }
}
.contributors-grid .contrib-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 8px;
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
}
.contributors-grid .contrib-item:hover { background: #F8FAFC; }
.hero-stats {
  display: flex;
  gap: 24px;
  flex-wrap: wrap;
}
.hero-stats span {
  font-size: 13px;
  color: rgba(255,255,255,0.75);
  display: flex;
  align-items: baseline;
  gap: 5px;
}
.hero-stats strong {
  font-size: 20px;
  font-weight: 800;
  color: #FFFFFF;
}
@media (max-width: 768px) {
  .hero-inner { padding: 30px 20px 26px; }
  .hero-title { font-size: 24px; }
  .hero-subtitle { font-size: 13px; }
  .right-sidebar { display: none; }
}

/* 正文锚点偏移（兼容 sticky 顶栏） */
.wiki-content h2,
.wiki-content h3 {
  scroll-margin-top: 76px;
}

/* ========== 详情页目录（TOC） ========== */
.toc-card { border: 1px solid #E0F2F1; background: #F6FCFB; }
.entry-toc {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 320px;
  overflow-y: auto;
}
.toc-item {
  display: block;
  padding: 5px 8px;
  border-radius: 6px;
  font-size: 13px;
  color: #4B5563;
  text-decoration: none;
  border-left: 2px solid transparent;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.toc-item:hover { background: #E0F7F5; color: var(--color-primary); }
.toc-item.active {
  background: #E0F7F5;
  color: var(--color-primary);
  border-left-color: var(--color-primary);
  font-weight: 600;
}
.toc-item-sub {
  padding-left: 18px;
  font-size: 12px;
  color: #6B7280;
}

/* ========== 卡片网格 ========== */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 16px;
}

/* 卡片 */
.wiki-card {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 16px;
  cursor: pointer;
  transition: background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
/* 位移与 transition 统一在文件顶部（搜「卡片 hover」）；这里只保留本卡片特有的配色变化 */
.wiki-card:hover {
  border-color: var(--color-primary);
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}

/* 词条卡片缩略图（分类页：有图时左侧方块头像 + 右侧信息，无图纯文字卡片） */
.wiki-card.has-thumb {
  display: flex;
  flex-direction: row;
  gap: 14px;
  align-items: center;
  padding: 14px;
  overflow: hidden;
}
.wiki-card.has-thumb .card-body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 0;
}
.card-thumb {
  flex: 0 0 120px;
  width: 120px;
  height: 120px;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(180deg, #F1F5F9 0%, #E2E8F0 100%);
}
.card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
}
@media (max-width: 640px) {
  .card-thumb { flex-basis: 96px; width: 96px; height: 96px; }
}

/* 缩略图尺寸档（后台展示布局·超管可调）：方块边长 sm 90 / md 120 / lg 160 */
.wiki-card.has-thumb.thumb-sm .card-thumb { flex-basis: 90px; width: 90px; height: 90px; }
.wiki-card.has-thumb.thumb-lg .card-thumb { flex-basis: 160px; width: 160px; height: 160px; }
@media (max-width: 640px) {
  .wiki-card.has-thumb.thumb-sm .card-thumb { flex-basis: 72px; width: 72px; height: 72px; }
  .wiki-card.has-thumb.thumb-lg .card-thumb { flex-basis: 130px; width: 130px; height: 130px; }
}

/* ===== 游戏主页分类入口：圆形图标瓷贴网格（对标 B站wiki「常用内容」+ 首页 icon-cell 风格） ===== */
.cat-tile-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 14px;
}
.cat-tile {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 8px; padding: 20px 10px 16px;
  background: #FFFFFF; border: 1px solid #E7EAEE; border-radius: 10px;
  cursor: pointer; text-align: center;
  transition: var(--t-hover);
}
.cat-tile:hover {
  border-color: var(--game-color, var(--color-primary));
  box-shadow: 0 4px 14px rgba(15,23,42,0.08);
  transform: translateY(-2px);
}
.cat-tile-icon {
  width: 64px; height: 64px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  overflow: hidden; background: rgba(0,191,165,0.08);
}
/* 立绘/主图：裁圆铺满；图标：居中不裁 */
.cat-tile-icon > img:not(.cat-tile-icon-img) {
  width: 100%; height: 100%; object-fit: cover; object-position: center 18%; display: block;
}
.cat-tile-icon .cat-tile-icon-img { width: 30px; height: 30px; object-fit: contain; }
/* emoji 图标：iconHtml 传入 cls 时 span 只带该类，统一按槽位字号渲染 */
.cat-tile-icon > span { font-size: 30px; line-height: 1; width: auto; height: auto; }
.cat-tile-name { font-size: 14px; font-weight: 600; color: #1F2937; }
.cat-tile-count { font-size: 12px; color: #9CA3AF; }
@media (max-width: 640px) {
  .cat-tile-grid { grid-template-columns: repeat(auto-fill, minmax(108px, 1fr)); gap: 10px; }
  .cat-tile { padding: 14px 6px 12px; gap: 6px; }
  .cat-tile-icon { width: 52px; height: 52px; }
  .cat-tile-name { font-size: 13px; }
}

/* 卡片头部 */
.card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}
.card-title-area { flex: 1; min-width: 0; }
.card-title {
  font-size: 16px;
  font-weight: 600;
  color: #1F2937;
  margin-bottom: 2px;
}
.card-desc {
  font-size: 13px;
  color: #6B7280;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.card-badge {
  font-size: 14px;
  flex-shrink: 0;
}
/* 游戏主页分类卡：右上角词条数徽章（v0.15.1 起，替代重复图标） */
.wiki-card .card-badge.badge-count {
  background: #F1F5F9;
  color: #64748B;
  font-size: 12px;
  font-weight: 600;
  border-radius: 999px;
  padding: 2px 10px;
  align-self: flex-start;
}

/* 卡片标签 */
.card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}
.card-tag {
  display: inline-block;
  padding: 2px 8px;
  font-size: 11px;
  border-radius: 4px;
  background: #F0F7F5;
  color: var(--color-primary);
  font-weight: 500;
}
.card-tag.rarity-5 { background: #FFF7E6; color: #D48806; }
.card-tag.rarity-4 { background: #F0F5FF; color: #3B5998; }
.card-tag.rarity-3 { background: #F6F0FA; color: #8B5CF6; }

/* 卡片底栏 */
.card-footer {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: #9CA3AF;
  border-top: 1px solid #F3F4F6;
  padding-top: 8px;
}
.card-footer-item {
  display: flex;
  align-items: center;
  gap: 3px;
}

/* 游戏卡片（首页） */
.game-card {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 20px;
  cursor: pointer;
  transition: background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
  position: relative;
  overflow: hidden;
}
.game-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: var(--game-color, var(--color-primary));
}
/* 位移与 transition 统一在文件顶部（搜「卡片 hover」） */
.game-card:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
}
.game-card-icon { font-size: 28px; margin-bottom: 8px; }
.game-card-name { font-size: 18px; font-weight: 700; color: #1F2937; margin-bottom: 4px; }
.game-card-desc { font-size: 13px; color: #6B7280; margin-bottom: 12px; }
.game-card-cats { display: flex; flex-wrap: wrap; gap: 6px; }
.game-card-cat {
  font-size: 12px;
  color: #6B7280;
  background: #F3F4F6;
  padding: 2px 8px;
  border-radius: 4px;
}

/* ========== 图标化图鉴网格（对标 B站wiki 首页大网格） ========== */
.board-grid { display: flex; flex-direction: column; gap: 16px; }
.icon-board {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 14px;
  padding: 16px 18px 18px;
  transition: background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.icon-board:hover { border-color: var(--game-color, var(--color-primary)); box-shadow: 0 4px 16px rgba(0,0,0,0.06); }
.board-title-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  cursor: pointer;
}
.board-title-icon {
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 10px;
  font-size: 20px;
  background: rgba(0, 191, 165, 0.10);
  flex-shrink: 0;
}
.board-title-name { font-size: 16px; font-weight: 700; color: #1F2937; }
.board-title-desc { font-size: 12px; color: #6B7280; margin-left: auto; white-space: nowrap; }
.icon-cell-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
  gap: 10px;
}
.icon-cell {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 6px;
  padding: 14px 6px;
  background: #F8FAFC;
  border: 1px solid #EEF1F5;
  border-radius: 12px;
  cursor: pointer;
  transition: background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
  text-align: center;
}
.icon-cell:hover {
  border-color: var(--game-color, var(--color-primary));
  box-shadow: 0 4px 12px rgba(0,0,0,0.07);
  transform: translateY(-2px);
  background: #FFFFFF;
}
.icon-cell-icon {
  width: 44px; height: 44px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  font-size: 21px;
  background: rgba(0, 191, 165, 0.10);
}
.icon-cell-name { font-size: 13px; font-weight: 600; color: #1F2937; }
.icon-cell-count { font-size: 11px; color: #9CA3AF; }
@media (max-width: 640px) {
  .icon-cell-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .board-title-desc { display: none; }
}

/* ========== 分类页筛选条（对标 B站wiki 元素筛选条） ========== */
.filter-bar {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 12px 16px;
  margin-bottom: 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.filter-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.filter-row-label { font-size: 12px; color: #6B7280; font-weight: 600; width: 44px; flex-shrink: 0; }
.filter-chip {
  font-size: 12px;
  color: #475569;
  background: #F1F5F9;
  border: 1px solid #E2E8F0;
  padding: 3px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
  user-select: none;
}
.filter-chip:hover { border-color: var(--color-primary); color: #0F766E; }
.filter-chip.active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #FFFFFF;
}

/* ========== 卡池时间线倒计时徽章 ========== */
.timeline-countdown {
  font-size: 12px;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: 999px;
  display: inline-block;
  white-space: nowrap;
}
.timeline-countdown.live { background: rgba(0, 191, 165, 0.12); color: #0F766E; }
.timeline-countdown.ended { background: #F1F5F9; color: #94A3B8; font-weight: 500; }

/* ========== 贡献榜 tabs ========== */
.contrib-tabs { display: flex; gap: 6px; margin-bottom: 10px; }
.contrib-tab {
  font-size: 12px;
  color: #64748B;
  background: #F1F5F9;
  border: 1px solid #E2E8F0;
  padding: 3px 12px;
  border-radius: 999px;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.contrib-tab:hover { border-color: var(--color-primary); color: #0F766E; }
.contrib-tab.active { background: var(--color-primary); border-color: var(--color-primary); color: #FFFFFF; }

/* ========== 贡献指南卡片（模块化） ========== */
.home-guide { display: flex; gap: 14px; flex-wrap: wrap; }
.guide-card {
  flex: 1 1 200px;
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 16px;
  text-align: left;
  transition: background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.guide-card:hover { border-color: var(--color-primary); box-shadow: 0 4px 14px rgba(0,0,0,0.07); transform: translateY(-2px); }
.guide-card-icon { font-size: 26px; margin-bottom: 8px; }
.guide-card-title { font-size: 15px; font-weight: 700; color: #1F2937; margin-bottom: 4px; }
.guide-card-desc { font-size: 12px; color: #6B7280; line-height: 1.6; }

/* ========== 词条详情页 ========== */
.entry-detail {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 24px;
}
.entry-detail-mainimg { margin-bottom: 18px; }
.entry-detail-mainimg img {
  width: 100%; max-height: 320px; object-fit: cover;
  border-radius: 12px; display: block; background: #F1F5F9;
}
.entry-detail-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #F0F2F5;
}
.entry-detail-title { font-size: 22px; font-weight: 700; color: #1F2937; }
.entry-detail-desc { font-size: 14px; color: #6B7280; margin-top: 4px; }
.entry-detail-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.entry-badge {
  display: inline-block;
  padding: 2px 8px;
  font-size: 12px;
  border-radius: 4px;
  font-weight: 500;
}
.entry-badge.element { background: #F0F7F5; color: var(--color-primary); }
.entry-badge.path { background: #FFF7E6; color: #D48806; }
.entry-badge.faction { background: #F0F5FF; color: #3B5998; }
.entry-badge.rarity-5 { background: linear-gradient(135deg, #FFF7E6, #FFE7BA); color: #D48806; }
.entry-badge.rarity-4 { background: #F0F5FF; color: #3B5998; }
/* 攻略专属徽章（kind='guide'，2026-10-16） */
.entry-badge.guide-diff { background: #ECFDF5; color: #059669; }
.entry-badge.guide-ver { background: #EFF6FF; color: #2563EB; }

/* ===== 攻略布局（kind='guide'，2026-10-16） ===== */
.guide-section-title { font-size: 17px; font-weight: 700; color: #1e293b; margin: 22px 0 12px; }
.guide-steps .guide-step-list { list-style: none; counter-reset: gdstep; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 12px; }
.guide-step {
  counter-increment: gdstep;
  position: relative;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-left: 4px solid var(--color-primary, #00BFA5);
  border-radius: 10px;
  padding: 12px 14px 12px 44px;
}
.guide-step::before {
  content: counter(gdstep);
  position: absolute;
  left: 12px; top: 12px;
  width: 22px; height: 22px;
  background: var(--color-primary, #00BFA5); color: #fff;
  border-radius: 50%;
  font-size: 12px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.guide-step-title { font-size: 15px; font-weight: 700; color: #1e293b; }
.guide-step-detail { font-size: 13px; color: #475569; margin-top: 4px; line-height: 1.7; white-space: pre-wrap; }
.guide-tip-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.guide-tip {
  position: relative;
  background: #FFFBEB;
  border: 1px solid #FDE68A;
  border-radius: 10px;
  padding: 10px 12px 10px 38px;
  font-size: 13px; color: #92400E; line-height: 1.7;
  white-space: pre-wrap;
}
.guide-tip::before {
  content: "💡";
  position: absolute; left: 12px; top: 10px;
  font-size: 14px;
}

.entry-detail-body { display: flex; gap: 24px; }
.entry-detail-content { flex: 1; min-width: 0; }
.entry-detail-sidebar {
  width: 240px;
  flex-shrink: 0;
}
.entry-info-card {
  background: #F9FAFB;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  padding: 14px;
  margin-bottom: 12px;
}
.entry-info-row { padding: 4px 0; }
.entry-info-label { font-size: 11px; color: #9CA3AF; }
.entry-info-value { font-size: 13px; font-weight: 500; color: #1F2937; margin-top: 1px; }

/* 角色页左侧竖幅立绘卡（v2：参考主流 wiki 范式；独立类，勿加 entry-info-card 以免移动端 flex 扰乱） */
.entry-detail-char { width: 260px; flex-shrink: 0; align-self: flex-start; }
.entry-char-portrait {
  background: #F1F5F9;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  overflow: hidden;
}
.entry-char-portrait img {
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  object-position: top;
  display: block;
}
.entry-char-meta { margin-top: 12px; }
.entry-info-table {
  background: #F9FAFB;
  border: 1px solid #E5E7EB;
  border-radius: 8px;
  padding: 10px 12px;
}
.entry-info-table .entry-info-row { border-bottom: 1px dashed #E5E7EB; }
.entry-info-table .entry-info-row:last-child { border-bottom: none; }

/* 词条内容样式 */
.wiki-content img { max-width: 100%; height: auto; border-radius: 8px; display: block; margin: 8px auto; }
.wiki-content iframe {
  width: 100%;
  max-width: 720px;
  aspect-ratio: 16 / 9;
  border: 0;
  display: block;
  margin: 12px auto;
  border-radius: 12px;
  background: #0F172A;
}
.wiki-content a { color: #2563eb; text-decoration: underline; }
.wiki-content a:hover { color: #1d4ed8; }
.wiki-content p { margin-bottom: 1em; line-height: 1.8; }
.wiki-content strong { color: #0F172A; font-weight: 600; }
.wiki-content h2 {
  font-size: 18px;
  font-weight: 700;
  margin-top: 1.8em;
  margin-bottom: 0.6em;
  color: #1F2937;
  border-bottom: 2px solid #E5E7EB;
  padding-bottom: 0.3em;
}
.wiki-content h2:first-child { margin-top: 0; }
.wiki-content h3 {
  font-size: 15px;
  font-weight: 600;
  margin-top: 1.4em;
  margin-bottom: 0.5em;
  color: #334155;
}
.wiki-content ul, .wiki-content ol { margin-left: 1.5em; margin-bottom: 1em; }
.wiki-content li { margin-bottom: 0.4em; line-height: 1.7; }
.wiki-content code {
  background: #F3F4F6;
  padding: 0.1em 0.4em;
  border-radius: 3px;
  font-size: 0.9em;
  color: #334155;
}
.wiki-content ul li::marker { color: var(--color-primary); }

/* ========== 右侧栏 ========== */
.right-sidebar {
  display: none;
}
/* 右栏底部 */
.right-footer {
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid #E5E7EB;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 11px;
  color: #9CA3AF;
}

/* 最新角色 */
.recent-char {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out);
}
.recent-char:hover { background: #F0F2F5; }
.recent-char-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
}
.recent-char-name {
  font-size: 13px;
  color: #374151;
  flex: 1;
}
.recent-char-tag {
  font-size: 11px;
  color: #6B7280;
  background: #F0F2F5;
  padding: 1px 6px;
  border-radius: 3px;
}

/* 标签云 */
.tag-cloud {
  display: inline-block;
  font-size: 12px;
  color: #4B5563;
  background: #F0F2F5;
  padding: 2px 8px;
  border-radius: 10px;
  margin: 2px;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.tag-cloud:hover {
  background: var(--color-primary);
  color: #fff;
}
.tag-cloud sup {
  font-size: 10px;
  color: #9CA3AF;
  margin-left: 2px;
}
.tag-cloud:hover sup { color: #E0F7FA; }

/* 统计行 */
.stat-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 4px 8px;
}
.stat-label { font-size: 12px; color: #6B7280; }
.stat-value { font-size: 14px; font-weight: 600; color: var(--color-primary); }

/* 推荐横幅 */
.right-banner {
  background: linear-gradient(135deg, #00BCD4 0%, var(--color-primary) 50%, #4CAF50 100%);
  border-radius: 10px;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
}
.banner-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: white;
  font-weight: 700;
}

/* 右侧模块 */
.right-section {
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 10px;
  overflow: hidden;
}
.right-section-header {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 12px 14px;
  border-bottom: 1px solid #F0F2F5;
}
.section-icon { font-size: 14px; }
.section-title { font-size: 14px; font-weight: 600; color: #1F2937; }
.right-section-body { padding: 8px; }

/* 热门词条列表 */
.hot-entry {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out);
}
.hot-entry:hover { background: #F0F7F5; }
.hot-rank {
  width: 20px;
  height: 20px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  flex-shrink: 0;
}
.hot-rank.r1 { background: #FF5722; color: white; }
.hot-rank.r2 { background: #FF9800; color: white; }
.hot-rank.r3 { background: #FFC107; color: white; }
.hot-rank.r4, .hot-rank.r5, .hot-rank.r6 { background: #E5E7EB; color: #6B7280; }
.hot-entry-info { flex: 1; min-width: 0; }
.hot-entry-name { font-size: 13px; font-weight: 500; color: #1F2937; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hot-entry-meta { font-size: 11px; color: #9CA3AF; }

/* 快速入口 */
.quick-link {
  display: block;
  padding: 8px 10px;
  font-size: 13px;
  color: #4B5563;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.quick-link:hover {
  background: #F0F7F5;
  color: var(--color-primary);
}

/* 空状态 */
.empty-state {
  text-align: center;
  padding: 48px 16px;
  color: #9CA3AF;
}
.empty-state-icon { font-size: 40px; margin-bottom: 8px; }
.empty-state-text { font-size: 14px; }

/* ========== 响应式 ========== */
@media (max-width: 1024px) {
  .right-sidebar { display: none; }
  .main-content { max-width: 100%; }
}
@media (max-width: 768px) {
  .sidebar-toggle { display: block; }
  .sidebar {
    position: fixed;
    left: 0;                                  /* 用 transform 位移，不再动 left */
    top: 52px;
    height: calc(100vh - 52px);
    z-index: 50;
    /* ⚠️ 用 transform 而不是 left：left 每帧触发 layout（重排），
       transform 只走合成层 —— 移动端滑动流畅度差一个数量级。 */
    transform: translateX(-100%);
    /* 位移快、透明度慢 → 滑到位时还没完全显现，观感更"棉花"（VitePress 同款做法） */
    transition: transform var(--dur-slow) var(--ease-out),
                opacity var(--dur-slower) var(--ease-out);
    will-change: transform;
    box-shadow: 2px 0 12px rgba(0,0,0,0.1);
  }
  .sidebar.open { transform: translateX(0); }
  .content-area { padding: 16px; }
  .card-grid { grid-template-columns: 1fr; }
  .entry-detail-body { flex-direction: column; }
  .entry-detail-sidebar { width: 100%; }
  .entry-detail-sidebar { display: flex; flex-wrap: wrap; gap: 8px; }
  .entry-info-card { flex: 1; min-width: 140px; margin-bottom: 0; }
  .toc-card { flex: 0 0 100% !important; }
  .entry-detail-char { width: 100%; }
  .entry-char-portrait img { max-height: 360px; aspect-ratio: auto; object-fit: cover; }
}

/* ========== 顶部公告条 ========== */
.announcement-bar {
  background: linear-gradient(90deg, #00BCD4, var(--color-primary));
  color: #FFFFFF;
  border-radius: 10px;
  margin-bottom: 16px;
  overflow: hidden;
}
.announcement-inner {
  padding: 8px 16px;
  font-size: 13px;
  font-weight: 500;
  text-align: center;
}

/* ========== 友情链接 ========== */
.friend-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.friend-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: #FFFFFF;
  border: 1px solid #E5E7EB;
  border-radius: 10px;
  text-decoration: none;
  transition: background-color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
  min-width: 120px;
}
.friend-link:hover {
  border-color: var(--color-primary);
  box-shadow: 0 3px 12px rgba(0,0,0,0.06);
  transform: translateY(-1px);
}
.friend-link-name {
  font-size: 14px;
  font-weight: 600;
  color: #1F2937;
}
.friend-link-desc {
  font-size: 12px;
  color: #9CA3AF;
  background: #F3F4F6;
  padding: 2px 8px;
  border-radius: 10px;
}

/* ========== 全站全局 footer ========== */
.global-footer {
  margin-top: auto;
  padding: 20px 24px;
  border-top: 1px solid #E5E7EB;
  background: #FFFFFF;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 12px;
  color: #6B7280;
}
.global-footer a {
  color: var(--color-primary);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
.global-footer a:hover { color: var(--color-primary-dark); text-decoration: underline; }
.global-footer-about {
  max-width: 720px;
  margin: 0 auto 4px;
  text-align: center;
  font-size: 12px;
  color: #6B7280;
  line-height: 1.6;
}
.global-footer-about p { margin: 0; }
.global-footer-disclaimer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  text-align: center;
}
.global-footer-links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}
.global-footer-links .beian-link {
  color: #9CA3AF;
  text-decoration: none;
}
.global-footer-links .beian-link:hover {
  color: var(--color-primary);
  text-decoration: underline;
}

@media (max-width: 768px) {
  .global-footer { padding: 16px 16px; }
  .global-footer-links { gap: 10px; }
}

/* ========== 卡池时间线（游戏主板块顶部） ========== */
.timeline {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 4px 0;
}
.timeline-item {
  display: flex;
  gap: 12px;
}
.timeline-rail {
  position: relative;
  flex-shrink: 0;
  width: 14px;
  display: flex;
  justify-content: center;
}
.timeline-rail::before {
  content: '';
  position: absolute;
  top: 16px;
  bottom: -14px;
  width: 2px;
  background: #E2E8F0;
}
.timeline-item:last-child .timeline-rail::before { display: none; }
.timeline-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid #fff;
  box-shadow: 0 0 0 2px #E2E8F0;
  margin-top: 4px;
  flex-shrink: 0;
  z-index: 1;
}
.timeline-card {
  flex: 1;
  min-width: 0;
  background: #fff;
  border: 1px solid #E5E7EB;
  border-radius: 12px;
  padding: 12px 16px;
  transition: box-shadow var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
}
.timeline-card:hover {
  border-color: var(--color-primary);
  box-shadow: 0 4px 14px rgba(0, 191, 165, 0.08);
}
.timeline-card-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}
.timeline-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  background: var(--color-primary);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}
.timeline-phase {
  font-size: 12px;
  color: #64748B;
  background: #F1F5F9;
  padding: 2px 8px;
  border-radius: 6px;
}
.timeline-type {
  font-size: 12px;
  color: #475569;
}
.timeline-title {
  font-size: 15px;
  font-weight: 600;
  color: #1E293B;
  margin-bottom: 6px;
}
.timeline-meta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 6px;
  font-size: 12px;
  color: #94A3B8;
}
.timeline-period {
  color: #64748B;
}
.timeline-note {
  color: #94A3B8;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 60%;
}
.timeline-header-time {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.timeline-time-chip {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 999px;
  background: #F1F5F9;
  color: #64748B;
  font-size: 12px;
  font-weight: 500;
}
/* 卡池卡片角色头像行 */
/* 卡池角色：圆形头像瓷贴（对标 B站wiki UP 展示） */
.timeline-character-list { display: flex; flex-wrap: wrap; gap: 14px 16px; margin: 10px 0 8px; }
.timeline-character-card { display: flex; flex-direction: column; align-items: center; width: 68px; }
.tl-char-avatar {
  width: 56px; height: 56px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #E8F8F6 0%, #E4F0FB 100%);
  border: 2px solid #FFFFFF;
  box-shadow: 0 1px 5px rgba(15,23,42,0.12);
}
.tl-char-avatar img {
  width: 100%; height: 100%; object-fit: cover; object-position: center 18%; display: block;
  background: #F1F5F9;
}
/* 词条立绘（常为大幅立绘 + 大片留白）→ 放大聚焦到角色，否则缩成头像会是一块白 */
.tl-char-avatar img.tl-char-zoom { transform: scale(2.2); transform-origin: 32% 30%; }
/* 首字兜底：缺图或图片加载失败时显示（不再出现破图/虚线空框） */
.tl-char-fb {
  width: 100%; height: 100%; display: none;
  align-items: center; justify-content: center;
  font-size: 22px; font-weight: 700; color: #0EA5A0; line-height: 1;
}
.timeline-character-name {
  font-size: 11px; color: #64748B; margin-top: 5px; text-align: center;
  max-width: 68px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
@media (max-width: 640px) {
  .timeline-character-list { gap: 10px 12px; }
  .timeline-character-card { width: 56px; }
  .tl-char-avatar { width: 46px; height: 46px; }
  .tl-char-fb { font-size: 18px; }
  .timeline-character-name { max-width: 56px; }
}

/* 滚动条 */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #D1D5DB; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #9CA3AF; }

/* 动画 */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes pageEnter {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* 页面切换过渡：内容整体淡入上移（资料站风格，克制顺畅） */
.content-area > * { animation: pageEnter var(--dur-slow) var(--ease-out) both; }

/* 页面内元素错落浮现：面包屑 → 标题 → 副标题 → 正文/卡片，逐级入场 */
.content-wrapper > .breadcrumb { animation: pageEnter var(--dur-slow) var(--ease-out) both; animation-delay: 0s; }
.content-wrapper > .page-title,
.content-wrapper > .page-subtitle { animation: pageEnter var(--dur-slow) var(--ease-out) both; animation-delay: 0.04s; }
.content-wrapper > .timeline,
.content-wrapper > .filter-bar,
.content-wrapper > .card-grid,
.content-wrapper > .home-section,
.content-wrapper > .entry-detail,
.content-wrapper > div[style*="flex"] { animation: pageEnter var(--dur-slow) var(--ease-out) both; animation-delay: 0.08s; }
/* 卡片网格内卡片二次错落（小间距渐入，避免整体一坨出现） */
.card-grid > .wiki-card { animation: pageEnter var(--dur-slow) var(--ease-out) both; }
.card-grid > .wiki-card:nth-child(1) { animation-delay: 0.08s; }
.card-grid > .wiki-card:nth-child(2) { animation-delay: 0.1s; }
.card-grid > .wiki-card:nth-child(3) { animation-delay: 0.12s; }
.card-grid > .wiki-card:nth-child(4) { animation-delay: 0.14s; }
.card-grid > .wiki-card:nth-child(5) { animation-delay: 0.16s; }
.card-grid > .wiki-card:nth-child(6) { animation-delay: 0.18s; }
.card-grid > .wiki-card:nth-child(n+7) { animation-delay: 0.2s; }
/* 用户偏好减弱动效
   ⚠️ 这里原本写的是 `animation: none !important`，已改为**文件顶部的全局熔断**统一处理。
   原因：`animation: none` 会让依赖 `animationend` 事件的 JS **永远收不到回调**（回调挂死）；
        改用 `animation-duration: 1ms` 既视觉上瞬间完成，又仍会派发动画事件。
   另外全局熔断用 `*, *::before, *::after` 覆盖，不会像元素枚举那样"新加元素忘了写"。 */

/* ========== 板块/分类图标支持图片 URL（v1.7.0+） ========== */
/* 通用：1em 跟随容器 font-size，图片填满对应尺寸；emoji 走原文本类 */
.board-icon-text { display: inline-block; }
/* 关键：必须显式 inline-block —— Tailwind preflight 把 img 设为 display:block，
   否则图片会脱离文字行、独占一行显示在文字上方（v1.7.1 修复） */
.board-icon-img {
  display: inline-block;
  width: 1em;
  height: 1em;
  object-fit: contain;
  vertical-align: -0.12em;
  border-radius: 3px;
  flex-shrink: 0;
}
/* 侧栏游戏图标：固定 20px 槽位内展示图片 */
.nav-item-icon-img { width: 20px; height: 20px; vertical-align: middle; }
/* 首页游戏卡大图标：28px 字号的 1em → 图片 28px 填充 */
.game-card-icon-img { width: 28px; height: 28px; }
/* 首页 iconGrid 板标题图标（40px 圆角槽位，图片 26px 居中） */
.board-title-icon-img { width: 26px; height: 26px; vertical-align: middle; }
/* 分类图标格（icon-cell，44px 圆槽）内图标：图片 26px 居中 */
.icon-cell-icon-img { width: 26px; height: 26px; vertical-align: middle; }
/* 空状态大图标：40px */
.empty-state-icon-img { width: 40px; height: 40px; }
/* 内联小图标（面包屑/标题/卡片标题/列表项）：给 img 加个基准，防撑高行高 */
.content-wrapper img.board-icon-img { vertical-align: -0.15em; }
.top-nav-link .board-icon-img { vertical-align: -0.15em; }
/* 标题/面包屑内的图片图标：跟随字号略放大，与文字基线对齐 */
.page-title .board-icon-img,
.breadcrumb .board-icon-img { width: 1.05em; height: 1.05em; vertical-align: -0.18em; }
/* 后台板块管理：图标槽位（图片预览与 emoji 同槽） */
.admin-board-icon {
  width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 8px; background: #F8FAFC; flex-shrink: 0; overflow: hidden;
}
.admin-board-icon img { width: 24px; height: 24px; object-fit: contain; display: block; }
.admin-board-icon .board-icon-text { font-size: 20px; line-height: 1; }
/* 后台小图标槽（分类行） */
.admin-cat-icon {
  width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0; overflow: hidden;
}
.admin-cat-icon img { width: 18px; height: 18px; object-fit: contain; display: block; }
.admin-cat-icon .board-icon-text { font-size: 15px; line-height: 1; }
/* ===== 词条详情：信源引用块（参考资料） ===== */
.entry-sources {
  margin-top: 20px; padding: 14px 16px;
  background: #F8FAFC; border: 1px solid #EEF1F5; border-radius: 8px;
}
.entry-sources-tier { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.es-tier-label { font-size: 13px; font-weight: 700; color: #334155; }
/* 逐条信源的等级徽章：与 li 文字基线对齐，不撑行距 */
.entry-sources-list .es-tier-badge { vertical-align: middle; margin-right: 2px; }

/* ===== 信息块 · 分层可信度（2026-09-29）=====
   设计目标（莫问）："用户进来一眼知道这页哪些是铁的、哪些是水份"。
   ★ 为什么是"块"不是"行"：逐行挂徽章会让页面像贴纸墙（莫问原话"容易显得杂乱"）。
     所以这里是**一段一个徽章**，整块用网格排列 —— 一页只有几个，扫一眼就懂。

   ★ 视觉语言借用游戏内品质色阶（一级金 → 往下灰阶 → 五级警示红），
     配色本身来自 source-tier.js（单一来源），这里只管**布局**。 */
.entry-blocks {
  margin-top: 20px; padding: 14px 16px;
  background: #F8FAFC; border: 1px solid #EEF1F5; border-radius: 8px;
}
.entry-blocks-title { font-size: 13px; font-weight: 700; color: #334155; margin-bottom: 10px; }
.entry-block {
  display: flex; flex-direction: column; gap: 4px;
  padding: 10px 12px; margin-bottom: 8px;
  background: #fff; border: 1px solid #EEF1F5; border-radius: 8px;
}
.entry-block:last-child { margin-bottom: 0; }
.eb-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.eb-title { font-size: 14px; font-weight: 600; color: #1e293b; }
/* 「依据」行：说清这块的等级是谁支撑的 —— 读者能追责到具体来源 */
.eb-basis { font-size: 12px; color: #94A3B8; }
.eb-basis-none { font-style: italic; opacity: .8; }

/* ===== 可信度提示横幅（详情页正文顶部）=====
   ⚠️ 只在**真有** 4/5 级内容时出现。若见谁都弹，用户会训练成无视横幅
      （本项目在"天天报警用户就无视了"上有过同类判断）。 */
.entry-weak-banner {
  display: flex; align-items: flex-start; gap: 10px;
  margin-bottom: 16px; padding: 12px 14px;
  background: #FFFBEB; border: 1px solid #FDE68A; border-left: 4px solid #F59E0B;
  border-radius: 8px;
}
.ewb-icon { font-size: 18px; line-height: 1.2; flex-shrink: 0; }
.ewb-text { display: flex; flex-direction: column; gap: 2px; }
.ewb-text b { font-size: 14px; color: #92400E; }
.ewb-text span { font-size: 12.5px; color: #A16207; line-height: 1.5; }
@media (max-width: 640px) {
  .entry-blocks { padding: 12px; }
  .entry-block { padding: 9px 10px; }
}

/* ===== 社区可信度评分块（详情页正文末尾）===== */
.entry-rating {
  margin-top: 20px; padding: 14px 16px;
  background: #F8FAFC; border: 1px solid #EEF1F5; border-radius: 8px;
}
.entry-rating-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.entry-rating-label { font-size: 13px; font-weight: 700; color: #334155; }
.entry-rating-score { font-size: 22px; font-weight: 800; line-height: 1; }
.entry-rating-max { font-size: 12px; color: #94A3B8; }
.entry-rating-count { font-size: 12px; color: #64748B; margin-left: 4px; }
.entry-rating-bar {
  margin-top: 8px; height: 8px; border-radius: 4px; background: #E2E8F0; overflow: hidden;
}
.entry-rating-bar > i { display: block; height: 100%; border-radius: 4px; transition: width .25s ease, background .25s ease; }
.entry-rating-mine { margin-top: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.entry-rating-mine-label { font-size: 12px; color: #475569; font-weight: 600; }
.entry-rating-tip { font-size: 11.5px; color: #94A3B8; }
/* 打分器：1-10 数字按钮（比星星更适合 10 分制，且每个数字都可点） */
.entry-rating-stars { display: inline-flex; gap: 4px; flex-wrap: wrap; }
.entry-rating-stars .rs-btn {
  width: 26px; height: 26px; border-radius: 6px; border: 1px solid #E2E8F0; background: #fff;
  color: #64748B; font-size: 12px; font-weight: 600; cursor: pointer; padding: 0; line-height: 1;
  transition: all .15s ease;
}
.entry-rating-stars .rs-btn:hover:not(:disabled) { border-color: var(--color-primary-dark); color: var(--color-primary-dark); background: #F0FDFA; }
.entry-rating-stars .rs-btn.active { background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: #fff; }
.entry-rating-stars .rs-btn:disabled { opacity: .5; cursor: default; }
.entry-sources-title { font-size: 13px; font-weight: 700; color: #334155; margin-bottom: 8px; }
.entry-sources-list { margin: 0; padding-left: 20px; }
.entry-sources-list li { font-size: 12.5px; color: #475569; line-height: 1.8; word-break: break-all; }
.entry-sources-list a { color: #0EA5A0; text-decoration: none; }
.entry-sources-list a:hover { text-decoration: underline; }

/* 后台概览页「各游戏词条统计」图标：图片缩略图 / emoji 放大，防 URL 文本外露 */
.dash-icon-wrap {
  width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 10px; background: #F8FAFC; flex-shrink: 0; overflow: hidden;
}
.dash-board-icon { width: 28px; height: 28px; object-fit: contain; display: block; }
.dash-board-icon.dash-emoji { font-size: 22px; line-height: 1; width: auto; height: auto; }

/* ========== 资料站风格强化 v0.15（B/C：去AI模板感） ========== */
/* B. 卡片收敛：小圆角 + 细边框 + 淡阴影，去掉大圆角浮起模板感 */
.wiki-card, .game-card, .timeline-card, .entry-detail,
.game-card {
  border-radius: 6px !important;
  box-shadow: 0 1px 2px rgba(15,23,42,0.04);
  border-color: #E7EAEE;
}
.wiki-card:hover, .game-card:hover, .timeline-card:hover {
  box-shadow: 0 2px 8px rgba(15,23,42,0.06);
}
/* C. 标题层次更资料站：字号收紧、字距微调 */
.home-section-title {
  font-size: 15px;
  letter-spacing: 0.2px;
}
.home-section-title::before {
  height: 14px;
}
/* 右侧信息栏多个区块用分隔线区隔（不是一整张大卡片） */
.home-aside .aside-block + .aside-block {
  border-top: 1px solid #EEF1F5;
  padding-top: 14px;
  margin-top: 14px;
}
.home-aside .aside-block-title {
  font-size: 13px; font-weight: 700; color: #1F2937;
  display: flex; align-items: center; gap: 6px; margin-bottom: 8px;
}
.home-aside .aside-block-title::before {
  content: ''; width: 3px; height: 13px; background: var(--color-primary); border-radius: 2px;
}
.aside-list { display: flex; flex-direction: column; gap: 7px; }
.aside-list a, .aside-list-item {
  font-size: 13px; color: #475569; text-decoration: none;
  line-height: 1.5; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.aside-list a:hover { color: var(--color-primary); }

/* 特色词条列表 + 参与指南（资料站区块） */
.featured-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.featured-item {
  display: flex; flex-direction: column; gap: 3px; padding: 12px 14px;
  background: #FFFFFF; border: 1px solid #E7EAEE; border-radius: 6px;
  text-decoration: none; transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.featured-item:hover { border-color: var(--color-primary); box-shadow: 0 2px 6px rgba(0,191,165,.08); }
.featured-name { font-size: 14px; font-weight: 600; color: #1F2937; }
.featured-desc { font-size: 12px; color: #94A3B8; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-guide { background: #F8FAFC; border: 1px solid #E7EAEE; border-radius: 6px; padding: 14px 18px; font-size: 13px; color: #475569; line-height: 1.7; }
.home-guide ul { margin: 8px 0 0; padding-left: 18px; }
.home-guide li { margin-bottom: 3px; }
@media (max-width: 720px) { .featured-list { grid-template-columns: 1fr; } }

/* 右侧信息栏可拖动（长按 300ms 后拖拽移动） */
.home-aside { cursor: grab; user-select: none; }
/* 拖拽跟手：用最短时长 + linear（跟手延迟必须最小；用缓动反而会有"黏滞感"） */
.home-aside.dragging { z-index: 80; cursor: grabbing; box-shadow: 0 10px 28px rgba(15,23,42,.16); transition: transform 60ms linear; }
.home-aside.dragging .aside-block-title { color: var(--color-primary); }

/* 站点图标（顶部品牌区）：图片版替换原字母 M */
.brand-icon-img {
  width: 36px; height: 36px; border-radius: 8px; object-fit: cover;
  flex-shrink: 0; display: block; background: #0B1B3A;
}

/* ========== 关于本站页（介绍/更新日志/管理组/发展历程） ========== */
.about-sec { margin-bottom: 28px; }
.about-sec-title {
  font-size: 18px; font-weight: 700; color: #1F2937;
  margin: 0 0 12px; padding-bottom: 8px; border-bottom: 2px solid #E7EAEE;
}
.about-cl { display: flex; flex-direction: column; gap: 14px;
  /* 2026-10-12（莫问）：更新日志折叠 = 固定高度 + 内部滚动条（不是逐条折叠）。
     高度取 ~3.5 条卡片（≈ 62vh 会让常见桌面只露两条），够看历史又不至于把页面撑太长。 */
  max-height: 560px; overflow-y: auto; overscroll-behavior: contain;
  /* 右侧留出滚动条的位置，避免它压住卡片圆角 */
  padding-right: 10px; scrollbar-width: thin; }
.about-cl::-webkit-scrollbar { width: 8px; }
.about-cl::-webkit-scrollbar-thumb { background: #CBD5E1; border-radius: 4px; }
.about-cl::-webkit-scrollbar-thumb:hover { background: #94A3B8; }
.about-cl::-webkit-scrollbar-track { background: transparent; }
.about-cl-item {
  background: #FFFFFF; border: 1px solid #E7EAEE; border-radius: 8px;
  padding: 12px 16px;
}
.about-cl-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.about-cl-ver {
  font-size: 13px; font-weight: 700; color: #fff;
  background: var(--color-primary); border-radius: 4px; padding: 2px 8px;
}
.about-cl-date { font-size: 12px; color: #94A3B8; }
.about-cl-title { font-size: 14px; font-weight: 600; color: #1F2937; }
.about-cl-list { margin: 8px 0 0; padding-left: 18px; }
.about-cl-list li { font-size: 13px; color: #475569; line-height: 1.7; }

.about-team { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 12px; }
.about-t-card {
  display: flex; align-items: center; gap: 12px;
  background: #FFFFFF; border: 1px solid #E7EAEE; border-radius: 10px;
  padding: 12px 14px;
}
.about-t-avatar {
  width: 40px; height: 40px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, var(--color-primary), #00BCD4);
  color: #fff; font-size: 17px; font-weight: 700;
}
.about-t-name { font-size: 14px; font-weight: 600; color: #1F2937; }
.about-t-role { font-size: 12px; color: #6B7280; margin-top: 2px; }
.about-t-empty { font-size: 13px; color: #94A3B8; }

.about-h { display: flex; flex-direction: column; }
.about-h-item { display: flex; gap: 14px; position: relative; padding-bottom: 20px; }
.about-h-item:last-child { padding-bottom: 0; }
.about-h-item::before {
  content: ''; position: absolute; left: 5px; top: 14px; bottom: -2px;
  width: 2px; background: #E7EAEE;
}
.about-h-item:last-child::before { display: none; }
.about-h-dot {
  width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
  background: var(--color-primary); border: 2px solid #fff;
  box-shadow: 0 0 0 2px var(--color-primary); margin-top: 4px; position: relative; z-index: 1;
}
.about-h-body { flex: 1; min-width: 0; }
.about-h-date { font-size: 12px; color: #94A3B8; }
.about-h-title { font-size: 15px; font-weight: 600; color: #1F2937; margin-top: 2px; }
.about-h-desc { font-size: 13px; color: #475569; line-height: 1.7; margin-top: 4px; }
@media (max-width: 720px) { .about-team { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); } }

/* ========== 稀有度星级显示（前台） ========== */
/* 全实心星 + 按稀有度分色：1-3 蓝、4 紫、5 金（米哈游官方图鉴配色） */
.star-rarity { display: inline-flex; align-items: center; gap: 2px; letter-spacing: 1px; }
.star-rarity .star { font-style: normal; display: inline-block; }
.star-rarity[data-rarity="1"] .star { color: #6BA3D6; }
.star-rarity[data-rarity="2"] .star { color: #6BA3D6; }
.star-rarity[data-rarity="3"] .star { color: #6BA3D6; }
.star-rarity[data-rarity="4"] .star { color: #B078E0; }
.star-rarity[data-rarity="5"] .star { color: #E8B93A; }
/* 尺寸档位（卡片小 / 详情中 / 信息表大） */
.star-rarity.sm { font-size: 13px; }
.star-rarity.md { font-size: 18px; }
.star-rarity.lg { font-size: 22px; }
/* 星级发光感（5★金色带辉光） */
.star-rarity[data-rarity="5"] .star { text-shadow: 0 0 8px rgba(232,185,58,0.45); }

/* 后台稀有度选级星星（可点击） */
.rarity-picker { display: inline-flex; align-items: center; gap: 6px; }
.rarity-picker .rp-star {
  font-size: 26px; line-height: 1; cursor: pointer; user-select: none;
  color: #CBD5E1; transition: transform var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out); padding: 2px;
}
.rarity-picker .rp-star:hover { transform: scale(1.18); }
.rarity-picker[data-rarity="0"] .rp-star { color: #CBD5E1; }
.rarity-picker[data-rarity="1"] .rp-star:nth-child(-n+1) { color: #6BA3D6; }
.rarity-picker[data-rarity="2"] .rp-star:nth-child(-n+2) { color: #6BA3D6; }
.rarity-picker[data-rarity="3"] .rp-star:nth-child(-n+3) { color: #6BA3D6; }
.rarity-picker[data-rarity="4"] .rp-star:nth-child(-n+4) { color: #B078E0; }
.rarity-picker[data-rarity="5"] .rp-star:nth-child(-n+5) { color: #E8B93A; }
.rarity-picker[data-rarity="5"] .rp-star { text-shadow: 0 0 8px rgba(232,185,58,0.4); }
.rarity-picker-label { font-size: 12px; color: #94A3B8; margin-left: 4px; }
@media (max-width: 720px) { .star-rarity.md { font-size: 16px; } .star-rarity.lg { font-size: 19px; } }


/* ========================================
   v0.14 全站音乐播放器（右下角悬浮球 + 展开面板）
   DOM 挂在 body 末尾，独立于 SPA 内容区 → 路由切换播放不中断
   ======================================== */
.music-player { position: fixed; right: 20px; bottom: 20px; z-index: 120; }

/* 悬浮球 */
.mp-orb {
  width: 52px; height: 52px; border-radius: 50%;
  border: none; cursor: pointer;
  background: linear-gradient(135deg, var(--color-primary) 0%, #00A38C 100%);
  color: #fff; font-size: 22px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 20px rgba(0,191,165,0.38);
  transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out);
}
.mp-orb:hover { transform: translateY(-2px) scale(1.04); box-shadow: 0 10px 26px rgba(0,191,165,0.46); }
.mp-orb:active { transform: scale(.96); }
.mp-orb.is-error { background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%); box-shadow: 0 6px 20px rgba(217,119,6,0.38); }
.mp-orb-icon { display: block; transform: translateY(-1px); }
.music-player.is-open .mp-orb { opacity: 0; pointer-events: none; transform: scale(.8); }

/* 面板 */
/* ⚠️ 2026-10-22 修：`.mp-panel` 上的 `display:flex` 会**压过 HTML 的 `hidden` 属性** ——
   `[hidden]{display:none}` 是浏览器默认样式（优先级最低），作者写的 `display:flex`
   直接赢，于是「hidden」的面板照样铺满 440px 把右下角悬浮球整个盖住：
   点是点得到球的（pointer-events 是 auto），但 elementFromPoint 命中的是面板里的
   `.mp-note` 文本 → 单击被面板吃掉 → **球永远点不开**（test-music-init B1b/B2b/B3 全红）。
   解法：把 hidden 的语义在本组件内显式钉死，且用 `!important` 保证任何后续
   display 声明都不会再把它顶掉（这类"属性 vs 样式"打架必须由组件自己兜住）。 */
.mp-panel[hidden] { display: none !important; }

.mp-panel {
  position: absolute; right: 0; bottom: 0;
  /* ⚠️ 宽度 336px 时，网易云外链播放器的两列歌单（歌名|歌手）挤不下 → 文字重叠。
     加宽到 440px 给它足够横向空间（移动端由下面的 media query 兜成全宽）。 */
  width: 440px; max-width: calc(100vw - 32px);
  max-height: min(74vh, 620px);
  display: flex; flex-direction: column;
  background: #FFFFFF; border-radius: 14px;
  border: 1px solid #E7EAEE;
  box-shadow: 0 18px 48px rgba(15,23,42,0.18);
  overflow: hidden;
  animation: mp-in var(--dur-fast) var(--ease-out);
}
@keyframes mp-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

.mp-head {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; border-bottom: 1px solid #F0F2F5;
  background: #FAFBFC;
}
.mp-head-title { font-size: 13px; font-weight: 700; color: #1F2937; }
.mp-head-src { font-size: 11px; color: #00A38C; background: rgba(0,191,165,0.10); padding: 2px 7px; border-radius: 999px; }
.mp-head-spacer { flex: 1; }
.mp-icon-btn {
  width: 26px; height: 26px; border-radius: 7px; border: none;
  background: transparent; color: #94A3B8; cursor: pointer;
  font-size: 13px; line-height: 1; display: flex; align-items: center; justify-content: center;
}
.mp-icon-btn:hover { background: #F1F5F9; color: #1F2937; }

.mp-body { padding: 12px; overflow-y: auto; flex: 1; display: flex; flex-direction: column; gap: 10px; }

.mp-frame { width: 100%; border: 0; border-radius: 10px; background: #F8FAFC; }

.mp-note { font-size: 11.5px; color: #94A3B8; line-height: 1.65; margin: 0; }

/* 正在播放 */
.mp-now { min-height: 34px; }
.mp-now-name { font-size: 13.5px; font-weight: 600; color: #1F2937; word-break: break-all; }
.mp-now-artist { font-size: 11.5px; color: #94A3B8; margin-top: 2px; }

/* 进度 / 音量 */
.mp-progress { display: flex; align-items: center; gap: 8px; }
.mp-time { font-size: 11px; color: #94A3B8; font-variant-numeric: tabular-nums; white-space: nowrap; }
.mp-range { -webkit-appearance: none; appearance: none; height: 4px; border-radius: 999px; background: #E5E7EB; cursor: pointer; flex: 1; }
.mp-range::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 12px; height: 12px; border-radius: 50%;
  background: var(--color-primary); border: 2px solid #fff; box-shadow: 0 1px 4px rgba(0,0,0,.2); cursor: pointer;
}
.mp-range::-moz-range-thumb { width: 12px; height: 12px; border-radius: 50%; background: var(--color-primary); border: 2px solid #fff; cursor: pointer; }
.mp-range-vol { flex: 0 0 96px; }

/* 控制键 */
.mp-ctrl { display: flex; align-items: center; justify-content: center; gap: 8px; }
.mp-btn {
  border: none; background: #F1F5F9; color: #1F2937; cursor: pointer;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.mp-btn:hover { background: #E2E8F0; }
.mp-btn-sm { width: 34px; height: 34px; font-size: 14px; }
.mp-btn-main { width: 44px; height: 44px; font-size: 17px; background: var(--color-primary); color: #fff; }
.mp-btn-main:hover { background: #00A38C; }
.mp-btn.is-on { background: rgba(0,191,165,0.16); color: #00A38C; }

.mp-volrow { display: flex; align-items: center; gap: 8px; }
.mp-vol-icon { font-size: 12px; }

/* 曲目列表 */
.mp-songlist { display: flex; flex-direction: column; gap: 4px; }
.mp-songitem {
  text-align: left; border: none; background: transparent; cursor: pointer;
  padding: 7px 9px; border-radius: 8px; font-size: 12.5px; color: #475569;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mp-songitem:hover { background: #F1F5F9; }
.mp-songitem.is-active { background: rgba(0,191,165,0.12); color: #00A38C; font-weight: 600; }

/* 设置弹窗 */
.mp-modal-back {
  position: fixed; inset: 0; z-index: 260;
  background: rgba(15,23,42,0.5);
  display: flex; align-items: center; justify-content: center; padding: 16px;
}
.mp-modal {
  background: #fff; border-radius: 14px; padding: 18px;
  width: 100%; max-width: 460px; max-height: 88vh; overflow-y: auto;
  box-shadow: 0 20px 60px rgba(0,0,0,0.25);
}
.mp-modal-title { font-size: 16px; font-weight: 700; color: #1F2937; margin: 0 0 8px; }
.mp-field { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; }
.mp-field > span { font-size: 12px; color: #6B7280; }
.mp-field-inline { flex-direction: row; align-items: center; gap: 8px; }
.mp-field-inline > span { font-size: 12.5px; color: #1F2937; }
.mp-input {
  width: 100%; padding: 8px 10px; font-size: 13px; color: #1F2937;
  border: 1px solid #E5E7EB; border-radius: 8px; background: #fff; font-family: inherit;
}
.mp-input:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(0,191,165,0.12); }
.mp-textarea { resize: vertical; line-height: 1.7; }
.mp-modal-acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 18px; }
.mp-btn-plain, .mp-btn-primary {
  padding: 8px 18px; border-radius: 8px; font-size: 13px; cursor: pointer; border: none;
}
.mp-btn-plain { background: #F1F5F9; color: #475569; }
.mp-btn-plain:hover { background: #E2E8F0; }
.mp-btn-primary { background: var(--color-primary); color: #fff; font-weight: 600; }
.mp-btn-primary:hover { background: #00A38C; }
.mp-btn-primary:disabled { opacity: .6; cursor: default; }

/* 移动端：面板占满宽度，避开 iOS 底部安全区 */
@media (max-width: 560px) {
  .music-player { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); }
  .mp-orb { width: 46px; height: 46px; font-size: 19px; }
  .mp-panel { width: calc(100vw - 28px); max-height: 70vh; }
}
/* 打印时不出现播放器 */
@media print { .music-player { display: none !important; } }

/* ========================================
   音乐播放器 v0.15 视觉升级（2026-10-11）
   —— 时长/缓动全部引用全局 token（:root 的 --dur-* / --ease-*），不硬编码
   ======================================== */

/* 面板毛玻璃化（覆盖 v0.14 的纯白底） */
.mp-panel {
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(14px) saturate(1.35);
  -webkit-backdrop-filter: blur(14px) saturate(1.35);
  border: 1px solid rgba(226, 232, 240, 0.9);
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.16), 0 2px 8px rgba(15, 23, 42, 0.06);
}

/* 悬浮球「播放中」脉冲波纹（仅 direct 自绘源知道播放态；iframe 源拿不到跨域状态） */
.mp-orb { position: relative; }
.mp-orb.is-playing::after {
  content: ''; position: absolute; inset: -4px; border-radius: 50%;
  border: 2px solid rgba(0, 191, 165, 0.55);
  animation: mpPulse 1.8s var(--ease-out) infinite;
  pointer-events: none;
}
@keyframes mpPulse {
  0%   { transform: scale(1);    opacity: 0.8; }
  70%  { transform: scale(1.35); opacity: 0; }
  100% { transform: scale(1.35); opacity: 0; }
}

/* —— netease 自绘：歌单头（封面 + 名称 + 数量）—— */
.mp-pl-head {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 10px;
  background: rgba(0, 191, 165, 0.06);
  border: 1px solid rgba(0, 191, 165, 0.14);
}
.mp-pl-cover {
  width: 52px; height: 52px; border-radius: 8px; object-fit: cover;
  flex: none; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}
.mp-pl-info { min-width: 0; }
.mp-pl-name {
  font-size: 13.5px; font-weight: 700; color: #1F2937;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mp-pl-count { font-size: 11.5px; color: #6B7280; margin-top: 2px; }

/* —— 卡片式曲目行（netease 自绘列表 / direct 列表共用）—— */
.mp-songlist-rich { max-height: 300px; overflow-y: auto; padding-right: 2px; }
.mp-songitem-card {
  display: flex; align-items: center; gap: 8px;
  white-space: normal; overflow: visible; text-overflow: clip;  /* 覆盖 v0.14 的单行省略：卡片是两行结构 */
}
.mp-songitem-cover {
  width: 36px; height: 36px; border-radius: 6px; object-fit: cover;
  flex: none; background: #F1F5F9; box-shadow: 0 1px 4px rgba(15, 23, 42, 0.10);
}
.mp-songitem-num {
  flex: none; width: 18px; text-align: center;
  font-size: 11px; color: #94A3B8; font-variant-numeric: tabular-nums;
}
.mp-songitem-text { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.mp-songitem-name {
  font-size: 12.5px; color: inherit; font-weight: inherit;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mp-songitem-artist {
  font-size: 11px; color: #94A3B8; font-weight: 400;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.mp-songitem-card.is-active .mp-songitem-num { color: #00A38C; }

/* —— direct 源：当前播放区封面 —— */
.mp-now { display: flex; align-items: center; gap: 10px; }
.mp-now-pic {
  width: 48px; height: 48px; border-radius: 8px; object-fit: cover;
  flex: none; background: #F1F5F9; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}
.mp-now-text { min-width: 0; flex: 1; }

/* ===== 不可信来源清单（板块页底部，2026-09-29）=====
   莫问定的公开口径：**域名 + 理由**（最透明那档）—— 读者要知道"为什么不信"。
   配色沿用信源等级的"警示"语义（红系），与词条里的五级徽章一致，扫一眼就知道是同一件事。*/
.untrusted-section {
  margin-top: 28px; padding: 16px 18px;
  background: #FEF2F2; border: 1px solid #FEE2E2; border-left: 4px solid #F87171;
  border-radius: 8px;
}
.untrusted-title { font-size: 15px; font-weight: 700; color: #991B1B; margin: 0 0 8px; }
.untrusted-desc { font-size: 12.5px; color: #B91C1C; line-height: 1.6; margin: 0 0 12px; }
.untrusted-desc b { color: #991B1B; }
.untrusted-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.untrusted-item {
  display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap;
  padding: 8px 10px; background: #FFFFFF; border: 1px solid #FECACA; border-radius: 6px;
}
/* 域名用等宽字：域名里的点、连字符在比例字体里容易看错（l/I、rn/m 之类） */
.untrusted-domain {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12.5px; font-weight: 700; color: #991B1B;
  word-break: break-all;   /* 超长域名（含子域）不许撑破容器 */
}
.untrusted-reason { font-size: 12.5px; color: #475569; line-height: 1.55; flex: 1; min-width: 200px; }
@media (max-width: 640px) {
  .untrusted-section { padding: 12px 14px; margin-top: 20px; }
  .untrusted-item { flex-direction: column; gap: 4px; }
  .untrusted-reason { min-width: 0; }
}

/* ===== 考据记录（词条详情，P5，2026-09-29）=====
   莫问：「"升级"这个动作本身就该是**荣誉事件**」——所以这块要**看起来像荣誉**：
   用温暖的金色系（与一级信源的金色同源），与旁边冷灰的"修改痕迹"区分开。*/
.entry-rises {
  margin-top: 20px; padding: 14px 16px;
  background: #FFFBEB; border: 1px solid #FDE68A; border-radius: 8px;
}
.er-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.er-title { font-size: 13px; font-weight: 700; color: #92400E; }
.er-sub { font-size: 12px; color: #A16207; }
.er-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.er-item {
  display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap;
  font-size: 12.5px; color: #475569; line-height: 1.6;
}
.er-who { font-weight: 700; color: #92400E; }
.er-from { color: #A16207; }
.er-arrow { color: #D97706; font-weight: 700; }
.er-to { font-weight: 700; color: #047857; }   /* 变可信 = 绿，与"降级=红"形成方向对立 */
.er-note { margin: 10px 0 0; font-size: 12px; color: #A16207; line-height: 1.6; }
@media (max-width: 640px) {
  .entry-rises { padding: 12px; }
  .er-item { font-size: 12px; }
}
/* 考据榜 tab 用金色，与词条贡献榜（灰蓝）在视觉上就分得开 —— 两个维度不该长得一样 */
.contrib-tab-dig { color: #92400E !important; }
.contrib-tab-dig.active { background: #FEF3C7 !important; color: #92400E !important; }

/* 搜索结果里的弱来源标记（P3c，2026-09-29）——
   降权必须可被看见：不标的话用户只看到"排序怪怪的"却没有解释。 */
.search-result-weak {
  flex-shrink: 0; font-size: 11px; font-weight: 600; padding: 1px 6px;
  border-radius: 4px; color: #991B1B; background: #FEF2F2; border: 1px solid #FCA5A5;
  align-self: center;
}

/* 来源质量报表（后台概览，P3c，2026-09-29）*/
.sq-weak-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.sq-weak-item { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; }
.sq-weak-item a { color: #92400E; font-weight: 600; text-decoration: none; }
.sq-weak-item a:hover { text-decoration: underline; }
.sq-weak-loc { color: #A16207; font-size: 12px; }

/* ============================================================
   图墙（kind='gallery'，2026-09-30 第 5 步）
   —— 密集网格 + 悬停浮起，与词条卡片刻意不同：图墙的"格子"要比卡片更小更密，
      让一屏能扫到更多图（"墙"的意义就在这里）。
   —— 用 CSS 变量 --game-color 承接板块主色（与 .cat-tile-grid 同口径）。
   ============================================================ */
.gallery-grid {
  display: grid;
  /* auto-fill + minmax：窄屏 2 列、宽屏自然铺满，不需要写断点 */
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 14px;
  margin-top: 16px;
}
.gallery-tile {
  margin: 0;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  border: 1px solid #E2E8F0;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  display: flex;
  flex-direction: column;
}
.gallery-tile:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px -10px rgba(15, 23, 42, .28);
  border-color: var(--game-color, #64748B);
}
.gallery-tile img {
  width: 100%;
  /* 方图：图墙要的是整齐的格子，高度不随图比例乱跳 */
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
  display: block;
  background: linear-gradient(180deg, #F1F5F9 0%, #E2E8F0 100%);
}
/* 无图占位：显示"未设图片"而不是静默丢弃（否则作者以为传上去了却没显示） */
.gallery-tile-ph {
  aspect-ratio: 1 / 1;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 6px;
  background: linear-gradient(180deg, #F8FAFC 0%, #EEF2F6 100%);
  color: #94A3B8; font-size: 26px;
}
.gallery-tile-ph-text { font-size: 12px; letter-spacing: .02em; }
.gallery-cap { padding: 9px 11px 11px; display: flex; flex-direction: column; gap: 4px; }
.gallery-cap-title {
  font-size: 14px; font-weight: 600; color: #1E293B;
  /* 长标题截两行（图墙格子小，不截会把墙撑得参差不齐） */
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.gallery-cap-desc {
  font-size: 12.5px; color: #64748B; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.gallery-cap-tags { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.gallery-tag {
  font-size: 11px; padding: 1px 6px; border-radius: 4px;
  color: #475569; background: #F1F5F9; border: 1px solid #E2E8F0;
}

/* 移动端：格子再小一档，一屏 2 列 */
@media (max-width: 640px) {
  .gallery-grid { grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 10px; }
  .gallery-cap { padding: 7px 9px 9px; }
  .gallery-cap-title { font-size: 13px; }
}
.gallery-cap-artist { font-size: 12px; color: #64748B; }
.gallery-cap-src {
  font-size: 12px; color: #0E7490; text-decoration: none; align-self: flex-start;
  padding: 1px 6px; border-radius: 4px; background: #ECFEFF; border: 1px solid #A5F3FC;
}
.gallery-cap-src:hover { background: #CFFAFE; }

/* ===== 词条内自动链接（wiki 双链，2026-10-11 莫问需求）=====
   正文里第一次完整出现其他词条名 → 高亮成站内链接；hover 预取目标首图。
   亮色主题：主色系浅底描边（与 .gallery-cap-src 同族风格），与普通正文链接区分。 */
.wiki-content .entry-wikilink {
  color: #0E7490;
  font-weight: 600;
  text-decoration: none;
  padding: 0 4px 1px;
  border-radius: 4px;
  background: #ECFEFF;
  border-bottom: 1px dashed #22D3EE;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.wiki-content .entry-wikilink:hover {
  background: #CFFAFE;
  border-bottom-color: #0E7490;
  text-decoration: none;
}