/* ==========================================================================
   NZEP 资料库 · 样式表
   --------------------------------------------------------------------------
   字体与配色参照维基百科（MediaWiki Vector 皮肤 / SCP 维基）：
     · 正文 Sans-serif（"Helvetica Neue", Arial），标题用衬线 Noto Serif
     · 正文色 #202122，次要文字 #54595d，三级 #5f6469
     · 分隔线 #a2a9b1，浅色块 #f8f9fa，表格头 #eaecf0
     · 链接深红 #b01（SCP 维基的 keeplink），悬停加深并显示下划线
     · 卡片式信息框：左侧彩色细条 + 浅灰底（维基的 ambox/tmbox 风格）
   版式参照 SCP 维基：深色顶栏 + 左侧栏 + 单栏正文 + 页脚授权块。
   ========================================================================== */

/* ------------------------------------------------------------- 设计令牌 */
:root {
  /* 基础色（维基百科灰阶） */
  --bg:            #ffffff;
  --bg-page:       #f6f6f6;   /* 页面外侧底色 */
  --bg-subtle:     #f8f9fa;   /* 信息框 / 折叠块底 */
  --bg-alt:        #eaecf0;   /* 表头 / 次级底 */
  --bg-code:       #f8f9fa;

  --text:          #202122;   /* 正文 */
  --text-2:        #54595d;   /* 次要 */
  --text-3:        #5f6469;   /* 三级 / 说明（2026-10-03 从 #72777d 加深：#72777d 在 #f6f6f6 底上只有 4.18:1，低于 AA 的 4.5 —— 页脚与提示会发虚看不见） */
  --text-strong:   #000000;   /* 标题 */

  --border:        #a2a9b1;   /* 主分隔线 */
  --border-soft:   #c8ccd1;   /* 次级分隔线 */
  --border-faint:  #eaecf0;   /* 极浅分隔线 */

  --link:          #b01;      /* 链接：SCP 维基的深红 */
  --link-hover:    #7d0009;
  --link-visited:  #6b4ba1;
  --link-new:      #d33;      /* 未建条目红链 */

  /* 顶栏（深色） */
  --bar:           #191919;
  --bar-2:         #2a2a2a;
  --bar-text:      #f2f2ef;

  /* 状态色 */
  --ok:            #14866d;
  --warn:          #ac6600;
  --bad:           #b32424;
  --ok-bg:         #f1f8f5;
  --warn-bg:       #fdf7ec;
  --bad-bg:        #fdf3f3;

  /* 强调色（供富文本使用的预设色板，取自维基常用标注色） */
  --c-red:         #b32424;
  --c-orange:      #ac6600;
  --c-green:       #14866d;
  --c-blue:        #3366cc;
  --c-purple:      #6b4ba1;
  --c-gray:        #54595d;

  --hl-yellow:     #fef6a8;
  --hl-green:      #d5fdf4;
  --hl-blue:       #eaf3ff;
  --hl-pink:       #fee7e6;

  /* 字体：参照维基百科的字体栈 */
  --sans: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB",
          "Microsoft YaHei", "微软雅黑", sans-serif;
  --serif: Georgia, "Songti SC", "SimSun", "Source Han Serif SC", "Noto Serif CJK SC",
           "Times New Roman", serif;
  --mono: "Cascadia Mono", Consolas, "Courier New", monospace;

  --header-h: 2.7rem;
  --side-w: 11.5rem;
  --content-w: 50rem;

  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --t-fast: .14s;
  --t: .24s;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: var(--bg); }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.6;
  overflow-x: hidden;
}

/* ------------------------------------------------------------ 网站背景 */
/* 管理员设置了背景图时：图片 + 一层白色遮罩都画在 body::before 上
   （z-index:-1，位于正文之下、html 底色之上），
   遮罩强度由 --bg-dim 控制，越大背景越淡、正文越好读。 */
body.has-bg { background: transparent; }
body.has-bg::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255, var(--bg-dim, .85)), rgba(255,255,255, var(--bg-dim, .85))),
    var(--bg-image, none);
  background-size: cover, var(--bg-size, cover);
  background-position: center center, center center;
  background-repeat: no-repeat, var(--bg-repeat, no-repeat);
  background-attachment: fixed, fixed;
}
/* 顶栏、提示条这类固定/黏性元素本来就有自己的层级，正文容器抬一层即可 */
body.has-bg .w-layout, body.has-bg .w-footer { position: relative; z-index: 1; }
@media (min-width: 900px) { body { font-size: 14.5px; } }

p { margin: 0 0 .85rem; }
h1, h2, h3, h4, h5 { margin: 0 0 .45rem; font-family: var(--serif); color: var(--text-strong); line-height: 1.3; }
h1 { font-size: 1.8rem; font-weight: 400; }
h2 { font-size: 1.35rem; font-weight: 400; padding-bottom: .2rem; border-bottom: 1px solid var(--border-soft); }
h3 { font-size: 1.1rem; font-weight: 700; }
h4 { font-size: .95rem; font-weight: 700; }
hr { border: 0; border-top: 1px solid var(--border-soft); margin: 1rem 0; }

/* 链接：默认无下划线，悬停加下划线（维基行为） */
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); text-decoration: underline; }
a:visited { color: var(--link-visited); }
.link { color: var(--link); cursor: pointer; }
.link:hover { text-decoration: underline; }

/* 首段提示：维基会用略大的字号突出导语 */
.lead { font-size: .95rem; color: var(--text-2); }

::selection { background: #d5e3ff; }

* { scrollbar-width: thin; scrollbar-color: #c8ccd1 transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-thumb { background: #c8ccd1; }
*::-webkit-scrollbar-thumb:hover { background: #a2a9b1; }

:focus-visible { outline: 2px solid var(--link); outline-offset: 1px; }

/* 输入有误时的标红（邮箱格式不对等） */
.w-input-bad, .w-input-bad:focus {
  border-color: var(--bad) !important;
  box-shadow: 0 0 0 2px rgba(179,36,36,.14) !important;
}

/* ==========================================================================
   顶部导航条
   ========================================================================== */
.w-progress-top {
  position: fixed; top: 0; left: 0; height: 2px; width: 100%;
  transform: scaleX(0); transform-origin: 0 50%;
  background: linear-gradient(90deg, var(--link), #e08a8a);
  z-index: 90; pointer-events: none;
  transition: transform .08s linear;
}
.w-topbar {
  position: sticky; top: 0; z-index: 80;
  background: var(--bar); color: var(--bar-text);
  height: var(--header-h);
  display: flex; align-items: center; gap: .05rem;
  padding: 0 .5rem;
  box-shadow: 0 1px 3px rgba(0,0,0,.28);
}
.w-topbar a, .w-topbar button {
  color: var(--bar-text); font-family: var(--sans); font-size: .78rem;
  background: none; border: 0; cursor: pointer; text-decoration: none;
  padding: 0 .65rem; height: var(--header-h);
  display: inline-flex; align-items: center; gap: .35rem;
  transition: background var(--t-fast) var(--ease);
  white-space: nowrap;
}
.w-topbar a:hover, .w-topbar button:hover { background: var(--bar-2); text-decoration: none; color: #fff; }
.w-topbar .brand { font-weight: 700; letter-spacing: .03em; padding-left: .2rem; }
.w-topbar .brand .scp-mark { width: 1.15rem; height: 1.15rem; flex: 0 0 auto; }
.w-topbar .grow { flex: 1 1 auto; }
/* ================= 顶栏折叠组（2026-10-16 用户要求：电脑端动态展开折叠） =================
   结构：.w-group > .w-group-btn（按钮）+ .w-group-panel（面板）。
   展开状态 = .w-group.open（脚本加，同时把 aria-expanded 置 true）。
   窄屏（<768px）整组隐藏（它带着 .hide-sm），手机走抽屉，链接一个不少。 */
.w-topbar .w-group { position: relative; display: inline-flex; align-items: center; height: var(--header-h); }
.w-topbar .w-group-btn { gap: .25rem; }
.w-topbar .w-group-btn svg { opacity: .75; transition: transform var(--t-fast) var(--ease); }
.w-topbar .w-group.open .w-group-btn { background: var(--bar-2); color: #fff; }
.w-topbar .w-group.open .w-group-btn svg { transform: rotate(180deg); }
.w-topbar .w-group-panel {
  position: absolute; top: 100%; left: 0; z-index: 90; min-width: 11rem;
  display: none; flex-direction: column; padding: .3rem;
  background: #fff; color: var(--text); border-radius: 10px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .22); border: 1px solid var(--border, #e3e6ea);
}
.w-topbar .w-group.open .w-group-panel { display: flex; }
.w-topbar .w-group-panel .w-gitem {
  display: block; height: auto; padding: .5rem .6rem; border-radius: 7px;
  color: var(--text); font-size: .82rem; text-align: left; white-space: nowrap;
}
.w-topbar .w-group-panel .w-gitem:hover { background: var(--bg-subtle, #f2f5fb); color: var(--link, #2a54a8); }
@media (max-width: 767.98px) { .w-topbar .w-group { display: none; } }
/* 768–1024 这一档：折叠组还在，但栏宽不够 —— 实测 960px 时整栏超出 6px（会出现横向滚动条）。
   收三处就够：品牌文字、状态文字（保留那个圆点）、各项左右内边距。 */
@media (max-width: 1024px) {
  .w-topbar .brand-text { display: none; }
  .w-topbar .w-status span:last-child { display: none; }
  .w-topbar a, .w-topbar button { padding: 0 .45rem; }
  .w-topbar .w-group-btn { padding: 0 .5rem; }
}
/* 未登录时顶栏右上角的「登录」：网页版不强制登录，但要让人一眼知道怎么登 */
.w-topbar .top-login {
  border: 1px solid rgba(255,255,255,.45); border-radius: 3px;
  height: 1.65rem; padding: 0 .55rem; margin-right: .35rem;
  font-weight: 700; letter-spacing: .04em;
}
.w-topbar .top-login:hover { background: #fff; color: var(--bar); }
/* ================= 邮箱角标与三条杠红点（2026-10-16 用户批次 ⑧） =================
   .w-badge  邮箱那一项后面的数字角标（未读为 0 时脚本会加 .hide）
   #wMenu.has-dot  三条杠右上角一个 8px 小红点（**不带数字**，用户明确这么要的） */
.w-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.05rem; height: 1.05rem; padding: 0 .28rem; margin-left: .3rem;
  border-radius: 999px; background: #b32424; color: #fff;
  font-size: .66rem; font-weight: 700; line-height: 1;
}
.w-badge.hide { display: none; }
.w-side a .w-badge { margin-left: auto; }
.w-topbar .menu-btn { position: relative; }
.w-topbar .menu-btn.has-dot::after {
  content: ""; position: absolute; top: .55rem; right: .45rem;
  width: 8px; height: 8px; border-radius: 50%; background: #b32424;
  box-shadow: 0 0 0 2px var(--bar, #191919);
}
.w-topbar .menu-btn { display: none; }
@media (max-width: 767px) {
  .w-topbar .menu-btn { display: inline-flex; }
  .w-topbar .hide-sm { display: none; }
  .w-topbar .brand-text { display: none; }
  /* 手机顶栏最左边这两块都是手指要点的：三条杠（开抽屉）与品牌（回首页）。
     实测 390 宽时三条杠只有 34×43、品牌只有 31×43（品牌里的文字在窄屏被隐藏，
     只剩一张小图），两块又紧挨着 —— 点偏一点就落到隔壁那个上，于是
     "点 NZ 图标 / 资料库"变成了"开抽屉 + 整屏蒙版"（用户报的"一大坨黑色背景"）。
     这里按手机的 44×44 最小点击区把它们撑开；顶栏高度在下面 --header-h 那里一起给到 44px。 */
  .w-topbar .menu-btn { min-width: 44px; justify-content: center; }
  .w-topbar .brand { min-width: 44px; min-height: 44px; }
}
.w-topbar .top-search { display: flex; align-items: center; gap: .3rem; padding-right: .4rem; }
.w-topbar .top-search input {
  width: 9rem; height: 1.65rem; padding: 0 .5rem; font-size: .75rem;
  border: 1px solid #555; background: #2b2b2b; color: #fff; outline: none;
  transition: width var(--t) var(--ease), border-color var(--t) var(--ease);
}
.w-topbar .top-search input:focus { width: 12rem; border-color: #999; }
@media (max-width: 480px) { .w-topbar .top-search { display: none; } }

/* 顶栏品牌图（管理员上传的图片） */
.w-topbar .brand-logo {
  display: block; width: auto; object-fit: contain;
  background: transparent; border-radius: 2px;
}

/* 全站公告条 */
.w-announce {
  background: #eaf3ff; border-bottom: 1px solid #c8d8f0; color: #202122;
  font-size: .8rem; animation: w-slide-down var(--t) var(--ease-out) both;
}
.w-announce.warn { background: var(--warn-bg); border-bottom-color: #e8d9a8; }
.w-announce.bad { background: var(--bad-bg); border-bottom-color: #e8bcbc; }
.w-announce .in {
  max-width: 78rem; margin: 0 auto; padding: .4rem 1rem;
  display: flex; align-items: flex-start; gap: .5rem;
}
.w-announce .k {
  flex: 0 0 auto; font-weight: 700; font-size: .7rem; letter-spacing: .1em;
  border: 1px solid currentColor; padding: 0 .3rem; opacity: .8;
  margin-top: .1rem;
}
.w-announce .t { flex: 1 1 auto; line-height: 1.55; }
.w-announce .when { flex: 0 0 auto; font-size: .7rem; color: var(--text-3); padding-top: .15rem; }
.w-announce .close {
  flex: 0 0 auto; background: none; border: 0; cursor: pointer;
  color: var(--text-3); font-size: 1rem; line-height: 1; padding: 0 .2rem;
}
.w-announce .close:hover { color: var(--text); }
@keyframes w-slide-down { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }

/* 顶栏状态点 */
.w-status {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .7rem; color: #bbb; padding: 0 .5rem;
}
.w-status .dot { width: .45rem; height: .45rem; border-radius: 50%; background: #888; position: relative; }
.w-status[data-state="ok"] .dot { background: #5fd08a; }
.w-status[data-state="ok"] .dot::after {
  content: ""; position: absolute; inset: -3px; border-radius: 50%;
  border: 1px solid #5fd08a; animation: w-pulse 2.6s var(--ease) infinite;
}
.w-status[data-state="offline"] .dot,
.w-status[data-state="down"] .dot { background: #ff6b60; }
.w-status[data-state="offline"] .dot::after,
.w-status[data-state="down"] .dot::after {
  content: ""; position: absolute; inset: -3px; border-radius: 50%;
  border: 1px solid #ff6b60; animation: w-pulse 1.4s var(--ease) infinite;
}
.w-status[data-state="checking"] .dot { animation: w-blink 1s steps(2) infinite; }
@keyframes w-pulse { 0% { opacity: .6; transform: scale(.7); } 70%,100% { opacity: 0; transform: scale(1.9); } }
@keyframes w-blink { 50% { opacity: .25; } }

/* ==========================================================================
   主布局
   ========================================================================== */
.w-layout { display: flex; align-items: flex-start; max-width: 78rem; margin: 0 auto; }

.w-side {
  width: var(--side-w); flex: 0 0 var(--side-w);
  padding: .8rem .45rem 3rem;
  font-size: .78rem;
}
.w-side .side-title {
  font-family: var(--serif); font-size: .95rem; font-weight: 700;
  padding: .2rem .45rem .5rem; border-bottom: 1px solid var(--border-soft);
  margin-bottom: .4rem; color: var(--text-strong);
}
.w-side section { margin-bottom: .1rem; }
.w-side .sec-head {
  display: flex; align-items: center; gap: .3rem;
  padding: .33rem .45rem; cursor: pointer; user-select: none;
  color: var(--text-2); font-weight: 700; font-size: .74rem;
  text-transform: uppercase; letter-spacing: .04em;
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.w-side .sec-head:hover { background: var(--bg-subtle); color: var(--text); }
.w-side .sec-head .caret {
  width: .5rem; height: .5rem; flex: 0 0 auto;
  border-right: 1.5px solid var(--text-3); border-bottom: 1.5px solid var(--text-3);
  transform: rotate(45deg); transition: transform var(--t) var(--ease);
  margin-left: auto;
}
.w-side section.collapsed .sec-head .caret { transform: rotate(-45deg); }
/* 折叠动画的 max-height 是**上界**，不是裁剪线：它必须比抽屉里最高的一段还高。
   原来写 40rem（640px）—— 触屏上每个链接 ≥2.1rem，导航那一栏（当时 16 项）加起来约 41.5rem，
   于是最后一项「标签一览」被 overflow:hidden 从底部切掉一截，文字看着就是"花屏"；
   相邻项都在裁剪线以内，所以只有它坏了。抬到 60rem（≈23 行）留出余量。 */
.w-side .sec-body { overflow: hidden; max-height: 60rem; transition: max-height var(--t) var(--ease), opacity var(--t) var(--ease); }
.w-side section.collapsed .sec-body { max-height: 0; opacity: 0; }
.w-side .sec-body ul { list-style: none; margin: 0 0 .3rem; padding: 0 0 0 .45rem; }
.w-side .sec-body li { border-left: 2px solid var(--border-faint); }
.w-side .sec-body a {
  display: block; padding: .22rem .5rem; color: var(--link); font-size: .78rem;
  transition: background var(--t-fast) var(--ease), padding-left var(--t-fast) var(--ease);
}
.w-side .sec-body a:hover { background: var(--bg-subtle); text-decoration: none; padding-left: .68rem; }
.w-side .sec-body a.active { background: var(--bg-alt); font-weight: 700; color: var(--text); }
.w-side .side-note { padding: .3rem .45rem; color: var(--text-3); font-size: .72rem; line-height: 1.5; }

/* 页面操作条 */
.w-pageops {
  display: flex; flex-wrap: wrap; align-items: center;
  border-bottom: 1px solid var(--border-soft); margin-bottom: .9rem; font-size: .76rem;
}
.w-pageops a, .w-pageops button {
  padding: .3rem .6rem; background: none; border: 0; cursor: pointer;
  color: var(--link); font-family: var(--sans); font-size: .76rem;
  border-bottom: 2px solid transparent; text-decoration: none;
  transition: background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.w-pageops a:hover, .w-pageops button:hover { background: var(--bg-subtle); text-decoration: none; }
.w-pageops .on { border-bottom-color: var(--link); font-weight: 700; }
.w-pageops .sep { color: var(--border); padding: 0 .1rem; }

.w-main { flex: 1 1 auto; min-width: 0; padding: .9rem 1rem 2rem; max-width: var(--content-w); }
.w-main.wide { max-width: none; }
@media (min-width: 1200px) { .w-main { max-width: 54rem; } }

.w-crumbs { font-size: .76rem; color: var(--text-3); margin-bottom: .5rem; }
.w-crumbs a { color: var(--link); }
.w-crumbs .sep { color: var(--text-3); padding: 0 .3rem; }

.w-title {
  font-family: var(--serif); font-size: 1.8rem; font-weight: 400;
  color: var(--text-strong); line-height: 1.25;
  margin: 0 0 .35rem; padding-bottom: .3rem;
  border-bottom: 1px solid var(--border);
}
.w-subtitle { font-size: .84rem; color: var(--text-2); margin-bottom: .9rem; }

/* ==========================================================================
   正文里的搜索栏（资料总览页与搜索结果页顶部）
   手机上顶栏的搜索框是收起来的，这里是手机端唯一的搜索入口，所以做得大一点、
   输入框字号 16px（小于 16px 时 iOS/部分安卓会在聚焦时把页面放大）。
   ========================================================================== */
.w-searchbar {
  display: flex; align-items: center; gap: .4rem;
  margin: 0 0 1.2rem; padding: .55rem .6rem;
  background: var(--bg-alt); border: 1px solid var(--border-soft);
}
.w-searchbar input {
  flex: 1 1 auto; min-width: 0; height: 2.3rem;
  font-family: var(--sans); font-size: 16px;
  padding: 0 .7rem; border: 1px solid var(--border);
  background: #fff; color: var(--text); outline: none;
  transition: border-color var(--t-fast) var(--ease);
}
.w-searchbar input:focus { border-color: var(--link); }
.w-searchbar .w-btn { height: 2.3rem; flex: 0 0 auto; }
@media (max-width: 480px) {
  .w-searchbar { padding: .5rem; gap: .35rem; }
  .w-searchbar input { height: 2.5rem; }
  .w-searchbar .w-btn { height: 2.5rem; padding: 0 .7rem; font-size: .8rem; }
}

/* 移动端：侧栏变抽屉 */
@media (max-width: 767px) {
  .w-side {
    /* 起点按顶栏实际下沿算（登录页顶栏上方还有机构横幅） */
    position: fixed; top: var(--bar-bottom, var(--header-h)); bottom: 0; left: 0; z-index: 75;
    width: 15rem; flex: none; background: #fff;
    border-right: 1px solid var(--border);
    box-shadow: 2px 0 12px rgba(0,0,0,.15);
    transform: translateX(-102%);
    transition: transform var(--t) var(--ease-out);
    overflow-y: auto; padding-top: .6rem;
  }
  body.side-open .w-side { transform: none; }
  /* 蒙版：**永远只有一层、正好铺满一屏**的半透明压暗。
     起点不再跟着 --bar-bottom（那是 JS 量出来的顶栏下沿：顶层横幅、安全区、
     量的时机都会让它变，量成 0 或量成很大时蒙版就不是"顶栏以下的一层灰"了）。
     顶栏 z-index 80 > 74，蒙版铺满整屏也压不住、挡不住它，所以这里直接用 0。
     2026-10 用户报（软件里）：点三条杠 / NZ 图标 / 资料库"都会出现很大一坨黑色背景"——
     实测就是这一层蒙版（390×801 = 95% 视口，rgba(0,0,0,.35)），所以颜色也钉在这里，
     不许出现不透明的黑块。 */
  .w-scrim {
    position: fixed; inset: 0; z-index: 74;
    background: rgba(0,0,0,.35); opacity: 0; pointer-events: none;
    transition: opacity var(--t) var(--ease);
  }
  body.side-open .w-scrim { opacity: 1; pointer-events: auto; }
  .w-main { padding: .7rem .8rem 2rem; }
}
.w-scrim { display: none; }
@media (max-width: 767px) { .w-scrim { display: block; } }

/* 登录页 / 离线页这类不放侧栏的页面（body.no-side）：
   桌面端整列隐藏，手机端仍然是可拉出的抽屉——否则手机上的菜单按钮点了没反应 */
body.no-side .w-side { display: none; }
@media (max-width: 767px) {
  body.no-side .w-side { display: block; }
}

/* ==========================================================================
   评分模块
   ========================================================================== */
.w-rate {
  float: right; width: 5.2rem; margin: 0 0 .8rem 1rem;
  border: 1px solid var(--border-soft); background: var(--bg-subtle);
  text-align: center; font-size: .78rem;
}
.w-rate .box {
  border-bottom: 1px solid var(--border-soft); padding: .3rem 0;
  color: var(--link); cursor: pointer; user-select: none;
  transition: background var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.w-rate .box:hover { background: #fff; }
.w-rate .box.on-up { color: var(--ok); font-weight: 700; background: var(--ok-bg); }
.w-rate .box.on-down { color: var(--bad); font-weight: 700; background: var(--bad-bg); }
.w-rate .score { padding: .25rem 0; font-size: 1.25rem; font-weight: 700; color: var(--text-strong); }
.w-rate .score .delta { display: block; font-size: .66rem; font-weight: 400; color: var(--text-3); }
@media (max-width: 520px) {
  .w-rate { float: none; width: 100%; margin: 0 0 .8rem; display: flex; align-items: stretch; }
  .w-rate .box { flex: 1; border-bottom: 0; border-right: 1px solid var(--border-soft); }
  .w-rate .score { flex: 1.4; }
  .w-rate .box:last-child { border-right: 0; }
}
.w-votes { font-size: .78rem; }
.w-votes .bar { display: flex; height: .9rem; border: 1px solid var(--border-soft); margin: .3rem 0 .5rem; }
.w-votes .bar i { display: block; height: 100%; }
.w-votes .bar .up { background: #7bc47f; }
.w-votes .bar .down { background: #e08a8a; }

/* ==========================================================================
   维基版式组件
   ========================================================================== */
/* 引用框 */
.w-quote {
  border: 1px dashed var(--border-soft); background: var(--bg-subtle);
  padding: .6rem .9rem; margin: .9rem 0; font-size: .84rem; color: var(--text-2);
}
.w-quote .k { display: block; font-weight: 700; margin-bottom: .2rem; color: var(--text); }

/* 信息框（左侧彩色细条 + 浅灰底） */
.w-infobox {
  border: 1px solid var(--border-soft); border-left: 4px solid var(--link);
  background: var(--bg-subtle); padding: .7rem .9rem; margin: .9rem 0; font-size: .84rem;
}
.w-infobox .head {
  font-family: var(--serif); font-weight: 700; font-size: 1rem;
  border-bottom: 1px solid var(--border-faint); padding-bottom: .3rem; margin-bottom: .55rem;
  color: var(--text-strong);
}
.w-infobox dl { display: grid; grid-template-columns: auto 1fr; gap: .25rem .8rem; margin: 0; }
.w-infobox dt { color: var(--text-3); font-weight: 700; }
.w-infobox dd { margin: 0; }

/* 折叠块 */
.w-fold { border: 1px solid var(--border-soft); margin: .9rem 0; background: #fff; }
.w-fold > summary {
  cursor: pointer; padding: .45rem .7rem; background: var(--bg-subtle);
  font-weight: 700; font-size: .84rem; list-style: none;
  display: flex; align-items: center; gap: .4rem; color: var(--text);
  transition: background var(--t-fast) var(--ease);
}
.w-fold > summary::-webkit-details-marker { display: none; }
.w-fold > summary::before { content: "▸"; color: var(--text-3); transition: transform var(--t) var(--ease); }
.w-fold[open] > summary::before { transform: rotate(90deg); }
.w-fold > summary:hover { background: var(--bg-alt); }
.w-fold .body { padding: .7rem .8rem; font-size: .84rem; animation: w-unfold var(--t) var(--ease-out) both; }
@keyframes w-unfold { from { opacity: 0; transform: translateY(-3px); } to { opacity: 1; transform: none; } }

/* 提示条（维基的 ambox 风格：左侧色条 + 浅底） */
.w-note {
  border: 1px solid var(--border-soft); border-left: 4px solid var(--text-3);
  background: var(--bg-subtle); padding: .55rem .8rem; margin: .9rem 0; font-size: .82rem;
}
.w-note.warn { border-left-color: var(--warn); background: var(--warn-bg); }
.w-note.bad { border-left-color: var(--bad); background: var(--bad-bg); }
.w-note.ok { border-left-color: var(--ok); background: var(--ok-bg); }
.w-note .k { display: block; font-weight: 700; margin-bottom: .15rem; }

/* 系列导航条 */
.w-seriesbar {
  display: flex; justify-content: space-between; gap: .6rem;
  border: 1px solid var(--border-soft); background: var(--bg-subtle);
  padding: .45rem .7rem; margin: 1.2rem 0; font-size: .78rem;
}

/* ACS 分级条 */
.w-acs { border: 1px solid var(--border); margin: .9rem 0; font-size: .78rem; display: flex; flex-wrap: wrap; }
.w-acs .cell {
  flex: 1 1 6rem; padding: .4rem .6rem; border-right: 1px solid var(--border-faint);
  display: flex; flex-direction: column; gap: .1rem;
}
.w-acs .cell:last-child { border-right: 0; }
.w-acs .cell .lbl { color: var(--text-3); font-size: .66rem; text-transform: uppercase; letter-spacing: .06em; }
.w-acs .cell .val { font-weight: 700; color: var(--text-strong); }
.w-acs .cell .val.esoteric { color: #6b4ba1; }
.w-acs .cell .val.safe { color: var(--ok); }
.w-acs .cell .val.keter { color: var(--warn); }

/* 标签 */
.w-tags { margin: 1.1rem 0 .6rem; font-size: .74rem; }
.w-tags .lbl { color: var(--text-3); margin-right: .4rem; }
.w-tag {
  display: inline-block; padding: .1rem .45rem; margin: 0 .25rem .25rem 0;
  border: 1px solid var(--border-soft); background: var(--bg-subtle); color: var(--link);
  cursor: pointer; font-size: .74rem;
  transition: background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.w-tag:hover { background: #fff; border-color: var(--link); text-decoration: none; }
.w-tag.on { background: var(--link); border-color: var(--link); color: #fff; }

/* 页脚授权区 */
.w-license {
  border: 1px solid var(--border-soft); background: var(--bg-subtle);
  padding: .6rem .8rem; margin: 1.5rem 0 0; font-size: .74rem; color: var(--text-2);
  line-height: 1.7; white-space: pre-wrap;
}
.w-license a { color: var(--link); }
.w-license .k { display: block; font-weight: 700; color: var(--text); margin-bottom: .15rem; }
.w-license .note { display: block; margin-top: .35rem; color: var(--text-3); }
/* ==========================================================================
   更新提示条（assets/core.js 的 CORE.update）
   为什么是"条"而不是对话框：需要刷新的时候，用户十有八九正在填表单
   （登录密码、发布正文…）。弹窗会被当成"出问题了"，直接刷新会丢内容；
   所以用工信部式的一条细提示贴在底部，不遮表单、不拦点击，用户自己挑时机。
   ========================================================================== */
.w-update {
  position: fixed; left: 50%; bottom: calc(.9rem + env(safe-area-inset-bottom, 0px));
  transform: translate(-50%, 140%); z-index: 70;
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  max-width: min(46rem, calc(100vw - 2rem));
  padding: .55rem .7rem; border: 1px solid var(--border, #a2a9b1);
  background: #fff; box-shadow: 0 .5rem 1.6rem rgba(0, 0, 0, .16);
  font-size: .82rem; opacity: 0; pointer-events: none;
  transition: transform .28s cubic-bezier(.22, .8, .3, 1), opacity .28s ease;
}
.w-update.on { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
.w-update .txt { flex: 1 1 12rem; color: var(--text-2); line-height: 1.6; }
.w-update .w-btn { min-height: 2.2rem; padding: .25rem .8rem; font-size: .82rem; }
@media (max-width: 560px) {
  .w-update { left: .6rem; right: .6rem; bottom: calc(.6rem + env(safe-area-inset-bottom, 0px)); transform: translateY(140%); max-width: none; }
  .w-update.on { transform: translateY(0); }
  .w-update .txt { flex: 1 1 100%; }
}

/* ==========================================================================
   页脚
   结构（由 assets/scpwiki.js 渲染）：
     品牌块（logo + 站点名 + 一句介绍 + 登录状态）
     分组链接（分组来自站点设置 footerLinks 里的「## 分组名」行，不写分组就平铺一行）
     法律条（版权 + 构建号 + 隐私政策 + 存储偏好，永远在最下面）
   为什么要改：以前所有链接用「·」串成一行、登录状态挤在右边，手机上换行乱、
   手指还容易点错。现在是"左品牌 / 右分组"，窄屏自动竖排。
   ========================================================================== */
.w-footer {
  max-width: 78rem; margin: 0 auto; padding: 1.5rem 1rem 2.4rem;
  font-size: .78rem; color: var(--text-3);
  border-top: 1px solid var(--border-faint);
  display: grid; gap: 1.2rem 1.8rem; align-items: start;
}
.w-footer .grow { flex: 1 1 auto; }
.w-footer .f-brand { display: flex; flex-direction: column; gap: .4rem; align-items: flex-start; min-width: 0; }
.w-footer .f-lock { display: inline-flex; align-items: center; gap: .5rem; font-size: 1rem; color: var(--text); }
.w-footer .f-lock img { height: 22px; width: auto; max-width: 9rem; object-fit: contain; }
.w-footer .f-lock .f-dot { width: .55rem; height: .55rem; border-radius: 50%; background: var(--link); flex: 0 0 auto; }
.w-footer .f-tag { color: var(--text-3); line-height: 1.75; max-width: 24rem; }
.w-footer .f-who {
  font-size: .72rem; color: var(--text-3); border: 1px solid var(--border-faint);
  padding: .1rem .5rem; line-height: 1.7;
}
.w-footer .f-who.on { color: var(--text-2); border-color: var(--border-soft); }
.w-footer .f-nav { display: grid; gap: 1rem 1.6rem; grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr)); min-width: 0; }
.w-footer .f-group { display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.w-footer .f-group-title { color: var(--text-2); font-weight: 700; font-size: .82rem; }
.w-footer .links { display: flex; flex-direction: column; gap: .05rem; }
.w-footer .links a { color: var(--link); width: fit-content; max-width: 100%; }
.w-footer .links a:hover { text-decoration: underline; }
@media (min-width: 880px) {
  /* 宽屏：左边品牌、右边分组；法律条横跨整行 */
  .w-footer { grid-template-columns: minmax(11rem, 14rem) minmax(0, 1fr); }
  .w-footer .w-legal { grid-column: 1 / -1; }
}

/* ==========================================================================
   列表
   ========================================================================== */
.w-list { list-style: none; margin: 0 0 1rem; padding: 0; }
.w-item {
  display: flex; align-items: flex-start; gap: .6rem;
  padding: .5rem .5rem .5rem .3rem;
  border-bottom: 1px solid var(--border-faint);
  cursor: pointer;
  transition: background var(--t-fast) var(--ease), padding-left var(--t-fast) var(--ease);
}
.w-item:hover { background: var(--bg-subtle); padding-left: .55rem; }
.w-item.static { cursor: default; }
.w-item.static:hover { background: transparent; padding-left: .3rem; }
.w-item .idx { flex: 0 0 auto; min-width: 2.4rem; color: var(--text-3); font-size: .72rem; padding-top: .12rem; }
.w-item .body { flex: 1 1 auto; min-width: 0; }
.w-item .t {
  display: block; color: var(--link); font-size: .88rem;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.w-item:hover .t { text-decoration: underline; }
.w-item .t.serif { font-family: var(--serif); font-size: .98rem; font-weight: 700; }
.w-item .m { font-size: .72rem; color: var(--text-3); margin-top: .1rem; }
.w-item .m b { color: var(--text-2); font-weight: 600; }
.w-item .chev { flex: 0 0 auto; color: var(--text-3); font-size: .74rem; padding-top: .1rem; transition: transform var(--t) var(--ease); }
.w-item:hover .chev { transform: translateX(2px); }

.w-sub { border-left: 2px solid var(--border-faint); margin-left: .9rem; padding-left: .4rem; animation: w-unfold var(--t) var(--ease-out) both; }

/* ==========================================================================
   正文与富文本渲染
   ========================================================================== */
.w-doc {
  font-family: var(--sans);
  font-size: .95rem; line-height: 1.75; color: var(--text);
  overflow-wrap: break-word;
}
.w-doc p { margin: 0 0 .85rem; }
.w-doc ul, .w-doc ol { margin: .35rem 0 .9rem; padding-left: 1.45rem; }
.w-doc li { margin: .15rem 0; }
.w-doc img { max-width: 100%; display: block; margin: .9rem 0; border: 1px solid var(--border-soft); }
.w-doc a { color: var(--link); }
.w-doc a:hover { text-decoration: underline; }
.w-doc b, .w-doc strong { font-weight: 700; color: var(--text-strong); }
.w-doc i, .w-doc em { font-style: italic; }
.w-doc u { text-decoration: underline; }
.w-doc s, .w-doc del { text-decoration: line-through; color: var(--text-2); }
.w-doc h2, .w-doc h3 { font-family: var(--serif); margin: 1.2rem 0 .5rem; }
.w-doc h2 { font-size: 1.3rem; font-weight: 400; border-bottom: 1px solid var(--border-soft); }
.w-doc h3 { font-size: 1.08rem; font-weight: 700; }
.w-doc blockquote {
  border-left: 3px solid var(--border-soft); background: var(--bg-subtle);
  margin: .9rem 0; padding: .55rem .9rem; color: var(--text-2); font-size: .9rem;
}
.w-doc hr { border-top: 1px solid var(--border-soft); margin: 1.1rem 0; }
.w-doc code {
  font-family: var(--mono); font-size: .82rem; background: var(--bg-code);
  border: 1px solid var(--border-faint); padding: .05rem .3rem;
}
.w-doc pre {
  font-family: var(--mono); font-size: .8rem; background: var(--bg-code);
  border: 1px solid var(--border-soft); padding: .6rem .8rem; overflow-x: auto;
  margin: .9rem 0; line-height: 1.6;
}
.w-doc .center { text-align: center; }
.w-doc .right { text-align: right; }
/* 黑码（涂黑）：仿 SCP 维基的 ████ 打码效果，悬停显示 */
.w-doc .blackbox {
  background: #202122; color: #202122; padding: 0 .12em; cursor: pointer;
  transition: background var(--t) var(--ease), color var(--t) var(--ease);
  user-select: none;
}
.w-doc .blackbox:hover,
.w-doc .blackbox.show { background: transparent; color: var(--text); user-select: text; }

/* 富文本表格 */
.w-doc table.w-table2 {
  border-collapse: collapse; margin: .9rem 0; font-size: .84rem; width: 100%;
}
.w-doc table.w-table2 th, .w-doc table.w-table2 td {
  border: 1px solid var(--border-soft); padding: .35rem .55rem; text-align: left;
}
.w-doc table.w-table2 th { background: var(--bg-alt); font-weight: 700; }
.w-doc table.w-table2 tr:nth-child(even) td { background: #fcfcfc; }

/* ==========================================================================
   元信息 / 评论
   ========================================================================== */
.w-meta {
  border-top: 1px solid var(--border-faint); border-bottom: 1px solid var(--border-faint);
  padding: .4rem 0; margin: .6rem 0 1.1rem;
  font-size: .74rem; color: var(--text-3);
  display: flex; flex-wrap: wrap; gap: .2rem .9rem;
}
.w-meta a { color: var(--link); }
.w-meta .strong { color: var(--text); font-weight: 700; }

.w-comment { display: flex; gap: .6rem; padding: .6rem 0; border-bottom: 1px solid var(--border-faint); }
.w-comment .av {
  width: 2rem; height: 2rem; flex: 0 0 auto;
  border: 1px solid var(--border-soft); object-fit: cover; cursor: pointer; background: var(--bg-alt);
  transition: border-color var(--t-fast) var(--ease);
}
.w-comment .av:hover { border-color: var(--link); }
.w-comment .cbody { flex: 1 1 auto; min-width: 0; }
.w-comment .who { font-weight: 700; font-size: .82rem; cursor: pointer; color: var(--link); }
.w-comment .when { color: var(--text-3); font-size: .72rem; margin-left: .45rem; }
.w-comment .txt { font-size: .84rem; margin-top: .15rem; overflow-wrap: break-word; }
.w-comment .ops { margin-top: .15rem; font-size: .72rem; }
/* 评论操作（回复 / 删除）：两个入口之间留间距，删除用警示色。
   2026-10 补上删除功能时加的 —— 之前 .ops 里只有一个「回复」。 */
.w-comment .ops a { margin-right: .7rem; }
.w-comment .ops a:last-child { margin-right: 0; }
.w-comment .ops a.del { color: var(--text-3); }
.w-comment .ops a.del:hover { color: #e5534b; }
.w-comment.reply { margin-left: 1.6rem; border-left: 2px solid var(--border-faint); padding-left: .6rem; }
.w-comment .floor { flex: 0 0 auto; width: 2.4rem; text-align: right; color: var(--text-3); font-size: .72rem; padding-top: .25rem; }

/* ==========================================================================
   表单 / 按钮
   ========================================================================== */
.w-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .35rem;
  font-family: var(--sans); font-size: .8rem; cursor: pointer;
  padding: .32rem .75rem; border: 1px solid var(--border-soft); background: var(--bg-subtle);
  color: var(--text); transition: background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease),
              transform var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.w-btn:hover { background: #fff; border-color: var(--border); text-decoration: none; }
.w-btn:active { transform: translateY(1px); }
.w-btn.primary { background: #3366cc; border-color: #2a54a8; color: #fff; }
.w-btn.primary:hover { background: #2a54a8; border-color: #21448b; box-shadow: 0 2px 8px -3px rgba(51,102,204,.5); }
.w-btn.solid { background: #202122; border-color: #202122; color: #fff; }
.w-btn.solid:hover { background: #000; border-color: #000; }
.w-btn.ghost { background: none; border-color: transparent; color: var(--link); padding: .28rem .4rem; }
.w-btn.ghost:hover { background: var(--bg-subtle); border-color: transparent; }
.w-btn.danger { color: var(--bad); border-color: #e0b3b3; background: #fff; }
.w-btn.danger:hover { background: var(--bad-bg); border-color: var(--bad); }
.w-btn.mini { padding: .18rem .48rem; font-size: .74rem; }
.w-btn.wide { width: 100%; }
.w-btn[disabled] { opacity: .5; cursor: not-allowed; transform: none !important; box-shadow: none !important; }
.w-btn .spin { width: .75rem; height: .75rem; border: 1.5px solid currentColor; border-top-color: transparent; border-radius: 50%; animation: w-spin .7s linear infinite; }
@keyframes w-spin { to { transform: rotate(360deg); } }

.w-actions { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.w-actions.end { justify-content: flex-end; }

.w-field { margin-bottom: .8rem; }
.w-field > label { display: block; font-size: .74rem; font-weight: 700; color: var(--text-2); margin-bottom: .2rem; }
.w-input, .w-area, select.w-input {
  width: 100%; font-family: var(--sans); font-size: .84rem; color: var(--text);
  background: #fff; border: 1px solid var(--border-soft); padding: .32rem .5rem; outline: none;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.w-input:focus, .w-area:focus { border-color: #3366cc; box-shadow: 0 0 0 2px rgba(51,102,204,.15); }
.w-area { font-size: .88rem; line-height: 1.75; resize: vertical; }
.w-input-row { display: flex; gap: .4rem; }
.w-input-row .w-input { flex: 1 1 auto; min-width: 0; }

.w-switch { display: flex; align-items: center; gap: .7rem; padding: .55rem 0; border-bottom: 1px solid var(--border-faint); }
.w-switch:last-child { border-bottom: 0; }
.w-switch .txt { flex: 1 1 auto; min-width: 0; }
.w-switch .txt b { display: block; font-size: .82rem; }
.w-switch .txt span { font-size: .72rem; color: var(--text-3); }
.w-toggle { position: relative; width: 2.3rem; height: 1.2rem; flex: 0 0 auto; }
.w-toggle input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 2; }
.w-toggle i { position: absolute; inset: 0; background: #c8ccd1; border: 1px solid var(--border-soft); transition: background var(--t) var(--ease); }
.w-toggle i::after {
  content: ""; position: absolute; top: 1px; left: 1px; width: .95rem; height: .95rem;
  background: #fff; border: 1px solid var(--border-soft); transition: transform var(--t) var(--ease-spring);
}
.w-toggle input:checked ~ i { background: #3366cc; border-color: #2a54a8; }
.w-toggle input:checked ~ i::after { transform: translateX(1.05rem); }

.w-table { width: 100%; border-collapse: collapse; font-size: .78rem; margin: .8rem 0; }
.w-table th, .w-table td { border: 1px solid var(--border-soft); padding: .35rem .5rem; text-align: left; }
.w-table th { background: var(--bg-alt); font-weight: 700; }
.w-table tr:hover td { background: var(--bg-subtle); }

/* ==========================================================================
   编辑器工具栏
   ========================================================================== */
.w-toolbar {
  display: flex; flex-wrap: wrap; gap: .15rem; align-items: center;
  border: 1px solid var(--border-soft); border-bottom: 0; background: var(--bg-subtle);
  padding: .25rem;
}
.w-toolbar button {
  min-width: 1.9rem; height: 1.7rem; padding: 0 .35rem;
  font-size: .76rem; font-family: var(--sans); cursor: pointer;
  border: 1px solid transparent; background: none; color: var(--text);
  display: inline-flex; align-items: center; justify-content: center;
  transition: background var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);
}
.w-toolbar button:hover { background: #fff; border-color: var(--border-soft); }
.w-toolbar button.on { background: #d5e3ff; border-color: #3366cc; }
.w-toolbar .sep { width: 1px; height: 1.2rem; background: var(--border-soft); margin: 0 .2rem; }
.w-toolbar .swatch { width: 1.1rem; height: 1.1rem; border: 1px solid var(--border-soft); display: inline-block; }
.w-toolbar select { font-size: .74rem; height: 1.7rem; border: 1px solid var(--border-soft); background: #fff; }

/* 编辑器预览 */
.w-preview {
  border: 1px solid var(--border-soft); border-top: 0; background: #fff;
  padding: .7rem .9rem; max-height: 22rem; overflow: auto;
}

/* ==========================================================================
   进度条
   ========================================================================== */
.w-bar { height: .5rem; border: 1px solid var(--border-soft); background: #fff; overflow: hidden; }
.w-bar > i { display: block; height: 100%; width: 0; background: #3366cc; transition: width var(--t) var(--ease); }
.w-bar.ok > i { background: var(--ok); }
.w-bar.bad > i { background: var(--bad); }
.w-bar.warn > i { background: var(--warn); }
.w-bar-label { font-size: .72rem; color: var(--text-3); margin-top: .2rem; min-height: .9rem; }

/* ==========================================================================
   弹窗
   ========================================================================== */
.w-mask {
  position: fixed; inset: 0; z-index: 200; display: none;
  align-items: center; justify-content: center; padding: 1rem;
  background: rgba(0,0,0,.45);
}
.w-mask.open { display: flex; animation: w-fade var(--t) var(--ease) both; }
@keyframes w-fade { from { opacity: 0; } to { opacity: 1; } }
.w-dialog {
  width: 100%; max-width: 24rem; max-height: 86vh; overflow: auto;
  background: #fff; border: 1px solid var(--border);
  box-shadow: 0 12px 40px -12px rgba(0,0,0,.5);
  animation: w-dialog-in var(--t) var(--ease-spring) both;
}
@keyframes w-dialog-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }
.w-mask.closing .w-dialog { animation: w-dialog-out var(--t-fast) var(--ease) both; }
@keyframes w-dialog-out { to { opacity: 0; transform: translateY(3px); } }
.w-dialog .dhead { background: var(--bar); color: #fff; padding: .35rem .7rem; font-weight: 700; font-size: .82rem; }
.w-dialog .dbody { padding: .8rem .9rem; font-size: .84rem; }
.w-dialog .dacts { display: flex; gap: .4rem; justify-content: flex-end; padding: .6rem .9rem; border-top: 1px solid var(--border-faint); }
.w-dialog.wide { max-width: 36rem; }

.w-toast {
  position: fixed; left: 50%; bottom: 1.2rem; transform: translate(-50%, 8px);
  background: #202122; color: #fff; font-size: .8rem;
  padding: .45rem 1rem; border-left: 3px solid var(--link);
  max-width: 86vw; text-align: center; z-index: 300;
  opacity: 0; pointer-events: none;
  box-shadow: 0 8px 24px -10px rgba(0,0,0,.6);
  transition: opacity var(--t) var(--ease), transform var(--t) var(--ease-spring);
}
.w-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ==========================================================================
   动效与工具类
   ========================================================================== */
.w-in > * { animation: w-rise .4s var(--ease-out) both; }
.w-in > *:nth-child(1) { animation-delay: .02s; }
.w-in > *:nth-child(2) { animation-delay: .05s; }
.w-in > *:nth-child(3) { animation-delay: .08s; }
.w-in > *:nth-child(4) { animation-delay: .11s; }
.w-in > *:nth-child(5) { animation-delay: .14s; }
.w-in > *:nth-child(n+6) { animation-delay: .17s; }
@keyframes w-rise { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }

.w-fade-in { animation: w-fade-in .4s var(--ease-out) both; }
@keyframes w-fade-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.w-skel > span {
  display: block; height: .7rem; margin: .7rem 0;
  background: linear-gradient(90deg, #efefef 0%, #e2e2e2 40%, #efefef 80%);
  background-size: 240% 100%; animation: w-shimmer 1.4s linear infinite;
}
.w-skel > span:nth-child(1) { width: 60%; }
.w-skel > span:nth-child(2) { width: 86%; }
.w-skel > span:nth-child(3) { width: 72%; }
.w-skel > span:nth-child(4) { width: 90%; }
@keyframes w-shimmer { from { background-position: 120% 0; } to { background-position: -120% 0; } }

.w-empty { color: var(--text-3); font-size: .82rem; padding: 1rem .4rem; text-align: center; border: 1px dashed var(--border-soft); }
.w-num { font-variant-numeric: tabular-nums; }
.hide { display: none !important; }
.mono { font-family: var(--mono); }
.serif { font-family: var(--serif); }
.muted { color: var(--text-3); }
.small { font-size: .78rem; }
.tiny { font-size: .72rem; color: var(--text-3); }
.center { text-align: center; }
.right { text-align: right; }
.nowrap { white-space: nowrap; }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
@media (max-width: 560px) { .grid-2 { grid-template-columns: 1fr; } }
.clear { clear: both; }

/* 管理员头衔：黄底白字（需求指定） */
.w-title-tag {
  display: inline-block; font-size: .7rem; font-weight: 700;
  background: #e0b012; color: #fff; padding: 0 .35rem;
  text-shadow: 0 1px 1px rgba(0,0,0,.25); vertical-align: middle;
}
.w-tag.solid { background: var(--bar); border-color: var(--bar); color: #fff; }
.w-tag.ok { border-color: var(--ok); color: var(--ok); }

/* ==========================================================================
   蓝标认证：超级管理员给指定账号加的"官方认证"标记 + 认证详情
   ========================================================================== */
.w-vf {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.05em; height: 1.05em; margin: 0 .18em; vertical-align: -0.14em;
  flex: 0 0 auto; line-height: 0;
}
.w-vf svg { width: 100%; height: 100%; display: block; }
.w-vf svg path:first-child { fill: #1d9bf0; }
.w-vf svg .tick { fill: #fff; }
.w-vf:hover { filter: brightness(1.08); }
/* 认证详情行：徽标 + 「官方认证」+ 说明 */
.w-vf-line {
  display: inline-flex; align-items: center; flex-wrap: wrap; gap: .3rem;
  font-size: .8125rem; color: var(--c-gray);
  background: rgba(29, 155, 240, .1);
  border: 1px solid rgba(29, 155, 240, .35);
  padding: .22rem .55rem; border-radius: 999px;
}
.w-vf-line b { color: #1d9bf0; font-weight: 600; }
.w-vf-line .nt { color: var(--c-gray); }
.w-vf-line .w-vf { width: 1em; height: 1em; margin: 0; }
html[data-theme="dark"] .w-vf-line { background: rgba(29, 155, 240, .16); }

/* 文章 / 层级页作者名前面的小头像 */
.w-meta .w-av-link { display: inline-flex; align-items: center; gap: .3rem; }
.w-meta img.w-av-mini {
  width: 1.15rem; height: 1.15rem; flex: 0 0 auto;
  border: 1px solid var(--border-soft); background: var(--bg-alt);
  object-fit: cover; vertical-align: -0.2em;
}

/* ==========================================================================
   作者主页（用户主页）的头像卡
   ========================================================================== */
.w-author { display: flex; gap: .9rem; align-items: flex-start; margin: .2rem 0 .1rem; }
.w-author .av-link { flex: 0 0 auto; display: block; line-height: 0; }
.w-author .av {
  width: 4.5rem; height: 4.5rem; flex: 0 0 auto; display: block;
  border: 1px solid var(--border); background: var(--bg-alt); object-fit: cover;
  transition: border-color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease);
}
.w-author .av:hover { border-color: var(--link); box-shadow: 0 0 0 2px rgba(187,0,17,.12); }
.w-author .info { flex: 1 1 auto; min-width: 0; }
.w-author .info .w-title { margin-bottom: .1rem; overflow-wrap: anywhere; }
.w-author .info .w-meta { margin: .3rem 0 0; border-top: 0; }

/* ==========================================================================
   条目直链的复制按钮
   ========================================================================== */
.row-copy {
  flex: 0 0 auto; align-self: center;
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.7rem; height: 1.7rem; padding: 0; margin-left: .3rem;
  background: none; border: 1px solid transparent; color: var(--text-3);
  cursor: pointer; border-radius: 0;
  transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease),
              background var(--t-fast) var(--ease);
}
.row-copy:hover { color: var(--link); border-color: var(--border-soft); background: #fff; }
.row-copy:active { background: var(--bg-alt); }
.row-copy svg { display: block; }

/* ==========================================================================
   开场动画（方案 A · 字母入场）
   --------------------------------------------------------------------------
   参数由试验页 /intro-test.html 选定，写在 assets/opening.js 里，通过
   --intro-* 变量传进来：
     错开 95ms · 单个入场 840ms · 首个延迟 130ms · 停留 300ms
     飞行 800ms · 收尾 420ms · 字母 131px · 位移 46px · 模糊 16px
   N Z E P 依次入场（模糊→清晰、上浮），整排上移收缩落进顶栏品牌位，
   看起来就是"字母变成了导航栏"。
   ========================================================================== */
html.intro-on body { visibility: hidden; }
html.intro-reveal .w-topbar { animation: nzep-bar-in var(--intro-reveal-dur, .62s) var(--ease-out) both; }
html.intro-reveal .w-topbar > a,
html.intro-reveal .w-topbar > button,
html.intro-reveal .w-topbar .brand { animation: nzep-item-in .42s var(--ease-out) both; }
html.intro-reveal .w-topbar > *:nth-child(1) { animation-delay: .04s; }
html.intro-reveal .w-topbar > *:nth-child(2) { animation-delay: .09s; }
html.intro-reveal .w-topbar > *:nth-child(3) { animation-delay: .14s; }
html.intro-reveal .w-topbar > *:nth-child(4) { animation-delay: .19s; }
html.intro-reveal .w-topbar > *:nth-child(5) { animation-delay: .24s; }
html.intro-reveal .w-topbar > *:nth-child(6) { animation-delay: .29s; }
html.intro-reveal .w-topbar > *:nth-child(n+7) { animation-delay: .34s; }
@keyframes nzep-bar-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes nzep-item-in { from { opacity: 0; transform: translateY(-5px); } to { opacity: 1; transform: none; } }

#nzepIntro {
  position: fixed; inset: 0; z-index: 9999; overflow: hidden;
  display: flex; align-items: center; justify-content: center;
  visibility: visible;
}
#nzepIntro.gone { display: none; }
#nzepIntro.morph { pointer-events: none; }

/* 背景单做一层：字母起飞时它淡出并轻微放大，像镜头往后拉 */
.nzep-intro-bg {
  position: absolute; inset: 0;
  background: radial-gradient(125% 125% at 50% 44%, #242424 0%, #191919 56%, #0c0c0c 100%);
  transition: opacity var(--intro-fly-dur, .8s) var(--ease), transform var(--intro-fly-dur, .8s) var(--ease-out);
}
.nzep-intro-bg::after {
  content: ""; position: absolute; inset: 0; opacity: .5;
  background: repeating-linear-gradient(180deg, rgba(255,255,255,.03) 0 1px, transparent 1px 3px);
}
#nzepIntro.morph .nzep-intro-bg { opacity: 0; transform: scale(1.05); }

.nzep-intro-inner { position: relative; z-index: 1; text-align: center; padding: 0 1rem; }
.nzep-intro-word {
  display: flex; justify-content: center; align-items: baseline;
  gap: clamp(.08rem, 1.1vw, .5rem);
  font-family: var(--serif);
  transform-origin: 50% 50%; will-change: transform, opacity;
  transition: transform var(--intro-fly-dur, .8s) var(--ease-out),
              opacity var(--intro-fade-dur, .23s) var(--ease) var(--intro-fade-delay, .46s);
}
.nzep-intro-word i {
  display: inline-block; font-style: normal; font-weight: 400;
  font-size: var(--intro-letter-size, 131px); line-height: 1;
  color: #f7f7f4; text-shadow: 0 0 28px rgba(255,255,255,.14);
  animation: nzep-letter var(--intro-letter-dur, .84s) var(--ease-out) both;
  animation-delay: calc(var(--i) * var(--intro-stagger, 95ms) + var(--intro-lead, 130ms));
}
@keyframes nzep-letter {
  0%   { opacity: 0; transform: translateY(var(--intro-enter-y, 46px)) scale(.8); filter: blur(var(--intro-enter-blur, 16px)); }
  58%  { filter: blur(0); }
  100% { opacity: 1; transform: none; filter: blur(0); }
}
#nzepIntro.morph .nzep-intro-word { opacity: 0; }
/* 起飞时副标题与进度线让位：只留字母飞向顶栏 */
.nzep-intro-foot { transition: opacity .3s var(--ease); }
#nzepIntro.morph .nzep-intro-foot { opacity: 0; }

.nzep-intro-sub {
  margin-top: .85rem; font-size: .72rem; color: #8d8d88;
  letter-spacing: .36em; text-indent: .36em;
  animation: nzep-sub-in .58s var(--ease-out) .7s both;
}
@keyframes nzep-sub-in {
  from { opacity: 0; transform: translateY(7px); letter-spacing: .78em; }
  to   { opacity: 1; transform: none; }
}
.nzep-intro-bar {
  width: clamp(9rem, 30vw, 19rem); height: 1px; margin: 1.1rem auto 0;
  background: rgba(255,255,255,.13); overflow: hidden;
}
.nzep-intro-bar > i {
  display: block; height: 100%; width: 100%; background: var(--link);
  transform: scaleX(0); transform-origin: 0 50%;
  animation: nzep-grow 1.05s var(--ease-out) .18s both;
}
@keyframes nzep-grow { to { transform: scaleX(1); } }

.nzep-intro-skip {
  position: absolute; z-index: 2; cursor: pointer;
  right: max(1rem, env(safe-area-inset-right, 0px));
  bottom: calc(1.1rem + env(safe-area-inset-bottom, 0px));
  padding: .3rem .7rem; font-family: var(--sans); font-size: .72rem; letter-spacing: .12em;
  background: none; color: #96968f; border: 1px solid #3a3a3a;
  animation: nzep-sub-in .5s var(--ease) 1.1s both;
}
.nzep-intro-skip:hover { color: #fff; border-color: #767676; }
#nzepIntro.morph .nzep-intro-skip { opacity: 0; transition: opacity .3s var(--ease); }

@media (prefers-reduced-motion: reduce) {
  .nzep-intro-word i, .nzep-intro-sub, .nzep-intro-bar > i, .nzep-intro-skip { animation-duration: .001ms !important; }
}

/* ==========================================================================
   Cookie 与本地存储的选择面板
   欢迎页（/welcome.html）与个人中心都用这一套，样式保持一致
   ========================================================================== */
.cc-panel {
  background: #fff; border: 1px solid var(--border); border-top: 3px solid var(--link);
  padding: .8rem .95rem; margin: .9rem 0;
  box-shadow: 0 6px 22px -14px rgba(0,0,0,.35);
}
.cc-panel .cc-head {
  display: flex; align-items: center; gap: .5rem;
  font-family: var(--serif); font-weight: 700; font-size: 1rem; color: var(--text-strong);
}
.cc-panel .cc-head .scp-mark { width: 1.2rem; height: 1.2rem; flex: 0 0 auto; }
.cc-panel .cc-text {
  font-size: .8rem; color: var(--text-2); line-height: 1.75; margin: .35rem 0 .6rem;
}
.cc-panel .cc-text a { color: var(--link); }
.cc-panel .cc-acts { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; }
.cc-panel .cc-acts .spacer { flex: 1 1 auto; }
.cc-panel .cc-acts > * { animation: cc-pop .5s var(--ease-out) both; }
.cc-panel .cc-acts > *:nth-child(1) { animation-delay: .12s; }
.cc-panel .cc-acts > *:nth-child(2) { animation-delay: .2s; }
.cc-panel .cc-acts > *:nth-child(3) { animation-delay: .28s; }
.cc-panel .cc-acts > *:nth-child(4) { animation-delay: .36s; }
@keyframes cc-pop { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }

/* 偏好明细：默认收起，点「自定义设置」后展开（已选过的会直接摊开） */
.cc-panel .cc-pref { display: none; margin: 0 0 .55rem; padding-top: .45rem; }
.cc-panel .cc-pref.on { display: block; animation: w-unfold .28s var(--ease-out) both; }
.cc-panel .cc-item {
  display: flex; align-items: flex-start; gap: .6rem;
  padding: .4rem 0; border-bottom: 1px solid var(--border-faint);
}
.cc-panel .cc-item:last-child { border-bottom: 0; }
.cc-panel .cc-item .txt { flex: 1 1 auto; min-width: 0; }
.cc-panel .cc-item b { display: block; font-size: .8rem; }
.cc-panel .cc-item span.d { font-size: .72rem; color: var(--text-3); }
.cc-panel .cc-locked {
  flex: 0 0 auto; font-size: .68rem; color: var(--ok);
  border: 1px solid currentColor; padding: 0 .3rem;
}
.cc-panel-lg { padding: 1rem 1.1rem; }

/* 欢迎页：品牌标记 + 居中标题 */
.w-welcome { padding: .6rem 0 1rem; }
.w-welcome-mark { display: flex; justify-content: center; margin-bottom: .8rem; }
.w-welcome-mark .scp-mark { width: 3.4rem; height: 3.4rem; }
.w-welcome-mark .brand-logo { height: 3rem; width: auto; }
.w-welcome .w-title { margin-bottom: .35rem; }
.w-welcome .w-subtitle { margin-bottom: .3rem; }

/* ==========================================================================
   页脚法律条（隐私政策 / Cookie 说明）
   ========================================================================== */
/* 正文区里不允许出现页脚介绍容器：真正的那个在 #view 之外。
   万一浏览器里跑的还是旧脚本（旧版阅读页会在正文里再渲染一个），
   这里直接隐藏，页面上就不会同时出现两个相同的介绍块。 */
#view [id="siteFooter"] { display: none !important; }
.w-legal {
  flex: 1 1 100%; display: flex; flex-wrap: wrap; align-items: center;
  gap: .3rem .6rem; margin-top: .55rem; padding-top: .5rem;
  border-top: 1px dashed var(--border-faint); font-size: .7rem;
}
.w-legal .sep { color: var(--border-soft); }
.w-legal .copy { color: var(--text-3); }
.w-legal a, .w-legal button {
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  font: inherit; color: var(--link);
}
.w-legal a:hover, .w-legal button:hover { text-decoration: underline; }
.w-legal .on { color: var(--text-2); font-weight: 700; }

/* ==========================================================================
   隐私政策页
   ========================================================================== */
.pv-stamp { font-size: .74rem; color: var(--text-3); border-left: 3px solid var(--border-soft); padding-left: .6rem; margin: .6rem 0 1.1rem; }
.pv-toc {
  border: 1px solid var(--border-soft); background: var(--bg-subtle);
  padding: .6rem .85rem; margin: 1rem 0; font-size: .8rem;
}
.pv-toc .k { display: block; font-family: var(--serif); font-weight: 700; margin-bottom: .25rem; }
.pv-toc ol { margin: 0; padding-left: 1.5rem; }
.pv-toc li { margin: .12rem 0; }
.pv-doc h2 { scroll-margin-top: calc(var(--header-h) + 1.2rem); }
.pv-doc h3 { margin-top: 1rem; }
.pv-doc .w-table { font-size: .78rem; }

/* ==========================================================================
   无障碍
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .w-side { transition: none !important; }
}

/* ==========================================================================
   打印 / 另存为 PDF
   --------------------------------------------------------------------------
   条目底部有「打印本文」按钮（层级页是「打印本页」）。
   打印时只留正文：导航、侧栏、页脚、评分、评论、操作条、背景图全部去掉，
   并在开头补一行"站点名 · 条目编号 · 作者 · 原文直链"，方便纸面归档。
   ========================================================================== */
.w-print-only { display: none; }

@media print {
  .w-topbar, .w-side, .w-footer, .w-pageops, .w-rate, .w-tools, .w-toast,
  .w-announce, .w-crumbs, .w-seriesbar, .w-audio, .w-print-bar, .w-legal, .w-scrim,
  #wProgress, #siteFooter, .w-skeleton, .w-skel,
  #comments, .w-comment { display: none !important; }   /* 评论区不印（原来写成了 .w-comments，实际类名是单数） */

  .w-layout { display: block; }
  .w-main { max-width: none; padding: 0; margin: 0; }
  body { background: #fff !important; }
  /* 不印背景图与遮罩 */
  body.has-bg { background: #fff !important; }
  body.has-bg::before { display: none !important; }

  .w-print-only { display: block; }
  .w-print-head {
    font-family: var(--sans); font-size: 9pt; color: #444;
    border-bottom: 1px solid #999; padding-bottom: .3rem; margin-bottom: .9rem;
  }
  .w-print-head .u { word-break: break-all; color: #555; }

  .w-title, .w-doc-head h1 { font-size: 17pt; page-break-after: avoid; }
  .w-doc { font-size: 11pt; line-height: 1.75; color: #000; }
  .w-doc h2, .w-doc h3 { page-break-after: avoid; }
  .w-doc img { max-width: 100% !important; page-break-inside: avoid; }
  .w-doc table, .w-doc pre, .w-doc blockquote { page-break-inside: avoid; }
  .w-meta { font-size: 9pt; color: #444; }
  /* 黑码在纸上也要保持"打码"效果 */
  .w-doc .blackbox { background: #202122 !important; color: #202122 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  /* 正文里的外链把地址一并印出来，纸上也能追溯 */
  .w-doc a[href^="http"]::after { content: " (" attr(href) ")"; font-size: .8em; color: #555; word-break: break-all; }
  a { color: #000; text-decoration: none; }

  @page { margin: 16mm 14mm; }
}

/* ==========================================================================
   手机版适配
   ========================================================================== */
@media (max-width: 900px) {
  /* 真机上滚动更顺滑，输入框不会触发放大 */
  body { -webkit-overflow-scrolling: touch; }
  .w-input, .w-area, select.w-input, .w-toolbar select { font-size: 1rem; }  /* ≥16px，避免 iOS 自动缩放 */
  /* 长标题不要撑破布局 */
  .w-title, .w-doc h1, .w-doc h2, .w-doc h3, .w-doc-head h1 { overflow-wrap: anywhere; }
  .w-item .t { white-space: normal; }
}

@media (max-width: 767px) {
  /* 顶栏高度：手机上给到 44px（= 最小触控尺寸），三条杠与品牌才点得准 */
  :root { --header-h: 2.75rem; }
  /* 顶部安全区（刘海屏 / 状态栏） */
  .w-topbar {
    height: calc(var(--header-h) + env(safe-area-inset-top, 0px));
    padding-top: env(safe-area-inset-top, 0px);
    padding-left: max(.35rem, env(safe-area-inset-left, 0px));
    padding-right: max(.35rem, env(safe-area-inset-right, 0px));
  }
  .w-topbar a, .w-topbar button { height: calc(var(--header-h) + env(safe-area-inset-top, 0px)); padding: 0 .5rem; }
  /* 软件模式（Capacitor 外壳，Android 15+ edge-to-edge）：网页铺到状态栏底下，
     顶栏的 padding-top 就是那块安全区，而顶栏是深色的（--bar）—— 于是软件里
     屏幕最上面多出约 44px 的黑，加上顶栏本身约 90px，看上去就是"一大坨黑框"
     （用户 2026-10 报"侧边栏的大黑框"）。浏览器里 safe-area 是 0，没这个问题。
     appmode.js 让原生把状态栏图标切成深色、并给 <html> 挂 is-lightbar 之后，
     这里才把安全区涂成页面白底；接口不可用就不涂（白底白图标更糟）。 */
  html.nzep-app.is-lightbar .w-topbar {
    background: linear-gradient(to bottom,
      #fff 0, #fff env(safe-area-inset-top, 0px),
      var(--bar) env(safe-area-inset-top, 0px), var(--bar) 100%);
  }
  .w-side {
    top: var(--bar-bottom, calc(var(--header-h) + env(safe-area-inset-top, 0px)));
    padding-left: max(.45rem, env(safe-area-inset-left, 0px));
  }
  /* 蒙版不受安全区/顶栏高度影响：始终是一层正好铺满视口的半透明压暗
     （顶栏 80 > 74，压在它上面，不会被蒙版挡住） */
  .w-scrim { inset: 0; }
  .w-announce .in { padding: .4rem .7rem; }

  /* 抽屉里的导航项更高，手指更好点 */
  .w-side .sec-head { padding: .6rem .5rem; font-size: .8rem; }
  .w-side .sec-body a { padding: .6rem .6rem; font-size: .86rem; }
  .w-side .side-note { padding: .4rem .6rem; }

  /* 页面操作条变成可横向滑动的整行，避免换行挤压 */
  .w-pageops {
    display: flex; flex-wrap: nowrap; overflow-x: auto;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    border-bottom: 1px solid var(--border-soft);
  }
  .w-pageops::-webkit-scrollbar { display: none; }
  .w-pageops a, .w-pageops button { flex: 0 0 auto; padding: .55rem .7rem; font-size: .8rem; }

  /* 触控尺寸：主要按钮与列表行都放大到好点的尺寸 */
  .w-btn { padding: .5rem .9rem; font-size: .84rem; }
  .w-btn.mini { padding: .38rem .7rem; font-size: .78rem; }
  .w-item { padding: .7rem .5rem .7rem .35rem; }
  .w-item .t { font-size: .92rem; }
  .w-item .m { font-size: .74rem; }
  .w-toggle { width: 2.8rem; height: 1.5rem; }
  .w-toggle i::after { width: 1.15rem; height: 1.15rem; }
  .w-toggle input:checked ~ i::after { transform: translateX(1.3rem); }

  /* 正文行距与字号更适合手机阅读 */
  .w-doc { font-size: 1rem; line-height: 1.9; }
  .w-doc img { margin: .8rem -.6rem; max-width: calc(100% + 1.2rem); }
  .w-main { padding: .7rem .85rem 2rem; }
  .w-title { font-size: 1.5rem; }
  .w-doc-head h1 { font-size: 1.35rem; }

  /* 评分模块改为整行三格，手指点得准 */
  .w-rate { display: flex; align-items: stretch; width: 100%; float: none; margin: 0 0 .8rem; }
  .w-rate .box { flex: 1.2; border-bottom: 0; border-right: 1px solid var(--border-soft); padding: .6rem 0; font-size: .9rem; }
  .w-rate .score { flex: 1.4; padding: .35rem 0; }
  .w-rate .box:last-child { border-right: 0; }

  /* 表格可以横向滑动，不再挤出屏幕 */
  .w-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .w-table, .w-doc table.w-table2 { font-size: .78rem; }
  .w-table th, .w-table td, .w-doc table.w-table2 th, .w-doc table.w-table2 td { padding: .4rem .5rem; white-space: nowrap; }

  /* 信息框与页脚在窄屏少一点内边距 */
  .w-infobox, .w-note, .w-quote, .w-license { padding: .6rem .7rem; }
  .w-footer { padding: 1.1rem .85rem 2rem; gap: 1rem; }
  /* 窄屏：品牌块在最上，分组竖排；链接排成一行一个，手指点得准 */
  .w-footer .f-nav { grid-template-columns: 1fr; gap: .9rem; }
  .w-actions { gap: .45rem; }
  .w-dialog { max-height: 88vh; padding: 0; }
  .w-dialog .dbody { padding: .75rem .85rem; }
  .w-dialog .dacts { padding: .6rem .85rem; }
  .w-toast { bottom: calc(1rem + env(safe-area-inset-bottom, 0px)); }
  .w-fold > summary { padding: .6rem .7rem; }
  .w-fold .body { padding: .6rem .7rem; }
  .w-toolbar button { min-width: 2.2rem; height: 2rem; font-size: .82rem; }

  /* ---- 双端排查补丁（第 4 批）----
     iOS 在字号小于 16px 的输入框上会自动把整页放大，正文区的输入统一 16px */
  .w-main input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
  .w-main textarea, .w-main select { font-size: 16px; }
  .w-topbar .top-search input { font-size: 16px; width: 7.5rem; }
  .w-topbar .top-search input:focus { width: 9.5rem; }

  /* 页脚 / 面包屑里的小链接原来只有 14px 高，手指点不准 */
  .w-footer { line-height: 2; }
  .w-footer a, .w-crumbs a, .w-legal a { display: inline-flex; align-items: center; min-height: 2.1rem; padding: .15rem .1rem; }
  /* 页脚就是手机上的"底部菜单栏"：每一项都要够大 —— ≥44px 高（iOS 建议值）、整列宽度都可点。
     「小游戏」只有三个字，原来 53×32 的点击区手指很难点中（2026-10 用户报"点不开"）。 */
  .w-footer .links a { min-height: 44px; min-width: 44px; width: 100%; padding: .15rem .2rem; }

  /* 开关整体放大一点（原来是 2.3×1.2rem，只有 24px 高） */
  .w-toggle { width: 3.1rem; height: 1.75rem; margin: .2rem 0; }
  .w-toggle i::after { width: 1.4rem; height: 1.4rem; }
  .w-toggle input:checked ~ i::after { transform: translateX(1.35rem); }
  .w-switch { padding: .6rem 0; }

  /* 列表里的多选框（批量选择）手指也要点得准：
     这些勾选框是行内样式写死的 1rem，所以这里要 !important 才盖得住；
     同时 profile.js 里点了整行也能选中，热区比勾选框本身大得多 */
  .w-item input.pick { width: 1.45rem !important; height: 1.45rem !important; }
  /* 隐私政策目录、Cookie 说明里的"更多"这类按钮式链接 */
  .pv-toc a, a.cc-more { display: inline-flex; align-items: center; min-height: 2.1rem; }
  .pv-toc li { margin: .1rem 0; }
}

/* 超窄屏（小屏手机）：进一步压缩 */
@media (max-width: 420px) {
  .w-title { font-size: 1.35rem; }
  .w-doc { font-size: .96rem; }
  .w-brand-text { font-size: .95rem; }
  .w-announce .when { display: none; }
  .w-comment .floor { display: none; }
  .w-comment.reply { margin-left: .8rem; padding-left: .5rem; }
  .grid-2 { grid-template-columns: 1fr; }
  .w-meta { gap: .15rem .6rem; font-size: .7rem; }
}

/* 横屏手机：侧栏常驻，避免遮挡内容 */
@media (max-width: 900px) and (orientation: landscape) and (min-width: 700px) {
  .w-side { position: static; transform: none; width: 11rem; flex: 0 0 11rem; box-shadow: none; }
  .w-topbar .menu-btn { display: none; }
}

/* 触屏设备：去掉悬停效果带来的"点一下就一直高亮"问题，并扩大可点区域 */
@media (hover: none) {
  .w-side .sec-body a:hover { background: transparent; padding-left: .5rem; }
  .w-side .sec-body a:active { background: var(--bg-alt); }
  .w-item:hover { background: transparent; padding-left: .3rem; }
  .w-item:active { background: var(--bg-subtle); }
  .w-item:hover .t { text-decoration: none; }
  .w-item:hover .chev { transform: none; }
  .w-btn:hover { background: var(--bg-subtle); border-color: var(--border-soft); }
  .w-btn:active { background: var(--bg-alt); }
  .w-doc .blackbox:hover { background: #202122; color: #202122; }
  .w-doc .blackbox.show { background: transparent; color: var(--text); }
  /* 触屏上给可点元素一个更大的隐形热区 */
  .w-topbar a, .w-topbar button { min-height: 2.4rem; }
  .w-pageops a, .w-pageops button { min-height: 2.6rem; display: inline-flex; align-items: center; }
  .w-comment .av { width: 2.4rem; height: 2.4rem; }
  /* 平板也适用：iOS 在字号 <16px 的输入框上会自动放大整页 */
  .w-main input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
  .w-main textarea, .w-main select { font-size: 16px; }
  .w-topbar .top-search input { font-size: 16px; }
  /* 平板/横屏上侧栏是常驻列，链接也要按得住 */
  .w-side .sec-body a { display: flex; align-items: center; min-height: 2.1rem; }
  .w-side .sec-head { min-height: 2.4rem; }
  .w-footer a { display: inline-flex; align-items: center; min-height: 2rem; }
  .pv-toc a, a.cc-more { display: inline-flex; align-items: center; min-height: 2.1rem; }
  .w-item input.pick { width: 1.45rem !important; height: 1.45rem !important; }
  /* 列表行里的"复制直链"小按钮、mini 按钮、开关：触屏上一律放大热区 */
  .row-copy { min-width: 2.3rem; min-height: 2.3rem; }
  .w-btn.mini, a.w-btn.mini { min-height: 2.2rem; padding: .35rem .7rem; display: inline-flex; align-items: center; }
  .w-toggle { width: 3.1rem; height: 1.75rem; }
  .w-toggle i::after { width: 1.4rem; height: 1.4rem; }
  .w-toggle input:checked ~ i::after { transform: translateX(1.35rem); }
  .w-switch { padding: .5rem 0; }
  .w-crumbs { line-height: 1.9; }
  .w-crumbs a { display: inline-flex; align-items: center; min-height: 1.9rem; }
}

/* 抽屉式侧栏的开合过渡在触屏上不要拖沓 */
@media (max-width: 767px) and (hover: none) {
  .w-side { transition-duration: .18s; }
}

/* 手机刘海屏 / 底部手势条：给正文留出安全区 */
@supports (padding: env(safe-area-inset-bottom)) {
  body { padding-bottom: env(safe-area-inset-bottom, 0px); }
  .w-footer { padding-bottom: calc(2rem + env(safe-area-inset-bottom, 0px)); }
  .w-main { padding-left: max(.85rem, env(safe-area-inset-left, 0px)); padding-right: max(.85rem, env(safe-area-inset-right, 0px)); }
}

/* 支持"减少数据"设置时，不做非必要的动画 */
@media (prefers-reduced-data: reduce) {
  .w-in > *, .w-fade-in { animation: none !important; }
}

/* ==========================================================================
   Cookie 条 / 开场动画的手机版
   ========================================================================== */
@media (max-width: 767px) {
  .nzep-intro-word i { font-size: min(var(--intro-letter-size, 131px), 20vw); }
  .nzep-intro-sub { font-size: .64rem; letter-spacing: .26em; text-indent: .26em; }
  .nzep-intro-bar { width: min(64vw, 14rem); }
  .nzep-intro-skip { left: 50%; right: auto; transform: translateX(-50%); padding: .45rem 1rem; }
  .cc-panel { padding: .75rem .8rem; }
  .cc-panel .cc-acts .w-btn { flex: 1 1 auto; }
  .w-welcome-mark .scp-mark { width: 2.8rem; height: 2.8rem; }
  .w-legal { font-size: .68rem; }
  /* 复制按钮在手机上要有够大的点按区域 */
  .row-copy { width: 2.3rem; height: 2.3rem; margin-left: .1rem; }
  .row-copy svg { width: 16px; height: 16px; }
  /* 作者主页头像在窄屏上小一点，给昵称与统计留出宽度 */
  .w-author { gap: .7rem; }
  .w-author .av { width: 3.6rem; height: 3.6rem; }
  .w-author .info .w-title { font-size: 1.3rem; }
}
@media (max-width: 420px) {
  .cc-panel .cc-acts .spacer { display: none; }
  .cc-panel .cc-acts { flex-wrap: wrap; }
}

/* 2026-10-18 用户要求：英文切换按钮先隐藏（代码与词表保留，以后再做）。
   2026- 补充口径：**登录页与授权登录页要显示**（网站登录页默认英文，
   页面上得能切回中文）—— 那两页各自在自己的样式里放开这一个按钮，
   全站其它页面仍然按这条隐藏，一个字都没改。 */
[data-nzep-lang-toggle],.w-lang,[data-nzep-lang-slot],[data-nzep-lang-toggle] *{display:none!important}


/* 更新条的关闭按钮（用户反馈关不掉） */
.w-update-x{background:none;border:0;color:inherit;font-size:1.1rem;line-height:1;padding:.35rem .6rem;min-width:2.2rem;min-height:2.2rem;cursor:pointer;opacity:.75}
.w-update-x:hover{opacity:1}


/* 更新条被关掉时彻底移出布局（双保险） */
#wUpdateBar.off,#wUpdateBar[style*="display: none"]{display:none!important}


/* 文字颜色/高亮的「内联色板」（2026-11）：点主按钮在工具栏里展开一排色块，
   点色块立刻给当前选区上色 —— 不弹窗、不丢选区。 */
.w-colwrap{position:relative;display:inline-flex}
.w-colors{
  position:absolute;top:calc(100% + 4px);left:0;z-index:40;display:flex;flex-wrap:wrap;
  gap:4px;padding:6px;background:#fff;border:1px solid #d9dde3;border-radius:8px;
  box-shadow:0 8px 24px rgba(15,18,22,.16);width:auto;max-width:15rem;
}
.w-colors[hidden]{display:none!important}
.w-colors .w-col{
  width:22px;height:22px;border-radius:5px;border:1px solid rgba(0,0,0,.18);
  cursor:pointer;padding:0;flex:0 0 auto;
}
.w-colors .w-col:hover{transform:scale(1.12);outline:2px solid #3366cc;outline-offset:1px}
@media (max-width:720px){
  .w-colors .w-col{width:28px;height:28px}
}

/* 标题下方的语言条（中文 / EN）：当前语言高亮，另一种语言可点切换 */
.w-langbar{display:flex;align-items:center;gap:6px;margin:.2rem 0 .75rem;flex-wrap:wrap}
.w-langchip{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;min-height:28px;padding:2px 10px;border-radius:999px;
  border:1px solid var(--border-soft,#d9dde3);background:#fff;color:var(--text-2,#54595d);
  font-size:.76rem;line-height:1;text-decoration:none;
}
.w-langchip.on{background:#202122;border-color:#202122;color:#fff;font-weight:700}
.w-langchip.off{opacity:.5;cursor:not-allowed}
a.w-langchip:hover{border-color:#202122;color:#202122}
.w-langbar-tip{font-size:.72rem;color:var(--text-3,#72777d)}
@media (max-width:720px){.w-langchip{min-height:32px}}