MediaWiki:Common.css
注意：在发布之后，您可能需要清除浏览器缓存才能看到所作出的更改的影响。
- Firefox或Safari：按住Shift的同时单击刷新，或按Ctrl-F5或Ctrl-R（Mac为⌘-R）
- Google Chrome：按Ctrl-Shift-R（Mac为⌘-Shift-R）
- Edge：按住Ctrl的同时单击刷新，或按Ctrl-F5。
/**
* =================================================================
* 文亚宇宙世界观 Wiki - 桌面端全局样式表
* 适配平台：Fandom Desktop / MediaWiki
* 版本：3.0.0
*
* 待发布变更（墨蓝 + 黄铜 + 羊皮纸配色迁移）：
* - 全套设计令牌改用《编辑配色手册》的档案馆配色
* - 新增深色模式暗色档案馆变体（墨蓝底 + 羊皮纸字）
* - 新增语义令牌 --wy-warn（氧化红）/ --wy-ok（苔绿）
* - 新增 .wy-tag-restricted / .wy-tag-verified 标签类
* - .wy-maintenance 硬编码色值改用令牌（清掉 v2.1.0 的 TODO）
* - 标题改用衬线字体，呼应配色卡的档案馆调性
*
* v2.1.0 变更：
* - 新增维护提示框样式（.wy-maintenance*），收编线上已部署的样式
*
* v2.0.0 重构内容：
* - 统一浅色与深色设计令牌
* - 修复一级标题、章节标题和链接在深色模式下不可见
* - 修复目录标题“目录”颜色过暗
* - 修复目录白色闪光问题
* - 修复信息框和表格中的写死浅色背景
* - 减少重复覆盖和 !important 堆叠
* =================================================================
*/
/* ==========================================
1. 基础设计令牌：默认浅色主题
配色来源：MediaWiki 页面《编辑配色手册》
括号内为实测 WCAG 对比度（相对纸白 #F7F1E4）
========================================== */
:root {
--wy-css-version: "3.0.0";
/* 品牌色：墨蓝 */
--wy-primary: #1b2a41; /* 墨蓝 12.83 AAA */
--wy-primary-hover: #101a29; /* 墨蓝加深 */
/*
* 强调色：黄铜。
* 注意：黄铜 #B08D57 实测仅 2.75:1，不合格作文字色，
* 因此只用于分割线、边框、装饰竖条等非文字元素。
*/
--wy-accent: #b08d57; /* 黄铜 —— 装饰专用 */
--wy-accent-bright: #8c6d3f; /* 深黄铜 4.27 —— 小装饰件 */
/* 页面文字 */
--wy-heading-1: #1b2a41; /* 墨蓝 12.83 AAA */
--wy-heading-2: #1b2a41; /* 墨蓝 12.83 AAA */
--wy-heading-3: #8c6d3f; /* 深黄铜 —— 三级标题降一档 */
--wy-text-main: #2b2621; /* 墨迹黑 13.31 AAA */
--wy-text-muted: #6b5f4f; /* 褪色棕 5.53 AA */
/*
* 链接：黄铜压深到 #7A5F35 才过 AA。
* 纸白 5.31 AA / 羊皮纸 4.73 AA，且与正文墨迹黑有足够色相差可辨认。
*/
--wy-link: #7a5f35;
--wy-link-hover: #6b2737; /* 氧化红 9.47 AAA */
--wy-link-new: #6b2737; /* 氧化红 —— 红链 */
/* 背景：浅色主题改为纯白 / 近白（淡黄羊皮纸已去除） */
--wy-bg-card: #ffffff; /* 纯白 —— 卡片 / 信息框 */
--wy-bg-soft: #f7f7f7; /* 近白 —— 表头 / 目录 */
--wy-bg-subtle: #f0f0f0; /* 更浅灰 —— 图片区 */
--wy-bg-hover: #f5f5f5; /* 悬停 */
/* 边框 */
--wy-border-color: #dcdcdc; /* 中性浅灰 */
--wy-border-strong: #b08d57; /* 黄铜 */
/* 语义色 */
--wy-warn: #6b2737; /* 氧化红 9.47 AAA —— 警告 / 限制访问 */
--wy-ok: #4a5d45; /* 苔绿 6.34 AA —— 已验证 / 正常 */
/* 装饰 */
--wy-radius-sm: 4px;
--wy-radius-md: 8px;
--wy-radius-lg: 12px;
--wy-shadow-sm: 0 1px 3px rgba(27, 42, 65, 0.08);
--wy-shadow-md: 0 4px 14px rgba(27, 42, 65, 0.12);
/* 标题衬线字族 —— 呼应配色卡的档案馆调性 */
--wy-font-serif: Georgia, "Songti SC", "STSong", "Noto Serif SC", serif;
}
html.skin-theme-clientpref-day {
--wy-css-version: "3.0.0";
/* 品牌色：墨蓝 */
--wy-primary: #1b2a41; /* 墨蓝 12.83 AAA */
--wy-primary-hover: #101a29; /* 墨蓝加深 */
/*
* 强调色：黄铜。
* 注意：黄铜 #B08D57 实测仅 2.75:1，不合格作文字色，
* 因此只用于分割线、边框、装饰竖条等非文字元素。
*/
--wy-accent: #b08d57; /* 黄铜 —— 装饰专用 */
--wy-accent-bright: #8c6d3f; /* 深黄铜 4.27 —— 小装饰件 */
/* 页面文字 */
--wy-heading-1: #1b2a41; /* 墨蓝 12.83 AAA */
--wy-heading-2: #1b2a41; /* 墨蓝 12.83 AAA */
--wy-heading-3: #8c6d3f; /* 深黄铜 —— 三级标题降一档 */
--wy-text-main: #2b2621; /* 墨迹黑 13.31 AAA */
--wy-text-muted: #6b5f4f; /* 褪色棕 5.53 AA */
/*
* 链接：黄铜压深到 #7A5F35 才过 AA。
* 纸白 5.31 AA / 羊皮纸 4.73 AA，且与正文墨迹黑有足够色相差可辨认。
*/
--wy-link: #7a5f35;
--wy-link-hover: #6b2737; /* 氧化红 9.47 AAA */
--wy-link-new: #6b2737; /* 氧化红 —— 红链 */
/* 背景：浅色主题改为纯白 / 近白（淡黄羊皮纸已去除） */
--wy-bg-card: #ffffff; /* 纯白 —— 卡片 / 信息框 */
--wy-bg-soft: #f7f7f7; /* 近白 —— 表头 / 目录 */
--wy-bg-subtle: #f0f0f0; /* 更浅灰 —— 图片区 */
--wy-bg-hover: #f5f5f5; /* 悬停 */
/* 边框 */
--wy-border-color: #dcdcdc; /* 中性浅灰 */
--wy-border-strong: #b08d57; /* 黄铜 */
/* 语义色 */
--wy-warn: #6b2737; /* 氧化红 9.47 AAA —— 警告 / 限制访问 */
--wy-ok: #4a5d45; /* 苔绿 6.34 AA —— 已验证 / 正常 */
/* 装饰 */
--wy-radius-sm: 4px;
--wy-radius-md: 8px;
--wy-radius-lg: 12px;
--wy-shadow-sm: 0 1px 3px rgba(27, 42, 65, 0.08);
--wy-shadow-md: 0 4px 14px rgba(27, 42, 65, 0.12);
/* 标题衬线字族 —— 呼应配色卡的档案馆调性 */
--wy-font-serif: Georgia, "Songti SC", "STSong", "Noto Serif SC", serif;
}
/* ==========================================
2. Fandom 深色主题设计令牌
暗色档案馆风：墨蓝底 + 羊皮纸字
括号内对比度相对深色卡片底 #1B2A41
========================================== */
body[data-theme="dark"],
html.skin-theme-clientpref-night,
.theme-fandomdesktop-dark,
.theme-fandommobile-dark {
--wy-primary: #c9a66b; /* 黄铜提亮 6.29 AA */
--wy-primary-hover: #e0c48f;
--wy-accent: #b08d57; /* 黄铜 4.67 —— 装饰 */
--wy-accent-bright: #c9a66b; /* 黄铜提亮 */
--wy-heading-1: #f7f1e4; /* 纸白 12.83 AAA */
--wy-heading-2: #ede4d3; /* 羊皮纸 11.44 AAA */
--wy-heading-3: #c9a66b; /* 黄铜提亮 6.29 AA */
--wy-text-main: #ede4d3; /* 羊皮纸 11.44 AAA */
--wy-text-muted: #c9bba0; /* 褪色棕 7.63 AAA */
--wy-link: #c9a66b; /* 黄铜提亮 6.29 AA */
--wy-link-hover: #e0c48f;
--wy-link-new: #d98f9c; /* 氧化红提亮 6.96 AA / card 5.75 AA */
--wy-bg-card: #101418;
--wy-bg-soft: #202122;
--wy-bg-subtle: #2a3d59;
--wy-bg-hover: #334866;
--wy-border-color: #3a4a63;
--wy-border-strong: #b08d57; /* 黄铜在深色下依然是强边框 */
--wy-warn: #d98f9c; /* 氧化红提亮 6.96 AA / card 5.75 AA */
--wy-ok: #96ac8f; /* 苔绿提亮 7.15 AAA / card 5.91 AA */
--wy-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.28);
--wy-shadow-md: 0 5px 16px rgba(0, 0, 0, 0.36);
}
/* 深色模式：标准 MediaWiki（系统深色偏好）也应用暗色令牌 */
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os,
:root {
--wy-primary: #c9a66b;
--wy-primary-hover: #e0c48f;
--wy-accent: #b08d57;
--wy-accent-bright: #c9a66b;
--wy-heading-1: #f7f1e4;
--wy-heading-2: #ede4d3;
--wy-heading-3: #c9a66b;
--wy-text-main: #ede4d3;
--wy-text-muted: #c9bba0;
--wy-link: #c9a66b;
--wy-link-hover: #e0c48f;
--wy-link-new: #d98f9c;
--wy-bg-card: #202122;
--wy-bg-soft: #22334c;
--wy-bg-subtle: #2a3d59;
--wy-bg-hover: #334866;
--wy-border-color: #3a4a63;
--wy-border-strong: #b08d57;
--wy-warn: #d98f9c;
--wy-ok: #96ac8f;
--wy-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.28);
--wy-shadow-md: 0 5px 16px rgba(0, 0, 0, 0.36);
}
}
/* ==========================================
3. 正文与基础排版
正文保持无衬线（长文可读性），标题用衬线
========================================== */
/* 页面底色跟随主题（浅色纯白 / 深色墨蓝） */
body {
background-color: var(--wy-bg-card) !important;
}
.mw-body,
.mw-body-content {
color: var(--wy-text-main);
}
.mw-parser-output {
color: var(--wy-text-main);
font-family:
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
Roboto,
"Noto Sans SC",
"Microsoft YaHei",
"PingFang SC",
"Helvetica Neue",
Arial,
sans-serif;
font-size: 15px;
line-height: 1.75;
}
/* ==========================================
4. 页面一级标题
一级标题通常不在 .mw-parser-output 内
========================================== */
.page-header__title,
.page-header__title-wrapper,
.page-header__title-wrapper h1,
.firstHeading,
#firstHeading {
color: var(--wy-heading-1) !important;
font-family: var(--wy-font-serif);
text-shadow: none !important;
}
.page-header__title a,
.page-header__title-wrapper a,
.firstHeading a,
#firstHeading a {
color: inherit !important;
}
/* 页面标题区域分隔线 —— 黄铜 */
.page-header {
border-bottom-color: var(--wy-border-strong) !important;
}
/* ==========================================
5. 正文章节标题
========================================== */
.mw-parser-output h2 {
position: relative;
margin-top: 1.8em;
margin-bottom: 0.8em;
padding-bottom: 6px;
color: var(--wy-heading-2) !important;
border-bottom: 2px solid var(--wy-border-strong);
font-family: var(--wy-font-serif);
font-weight: 700;
}
/*
* 标题前的装饰竖条。
* 配色手册里的装饰线是黄铜横线，这里沿用黄铜。
*/
.mw-parser-output h2::before {
content: "";
display: inline-block;
width: 4px;
height: 18px;
margin-right: 10px;
background-color: var(--wy-accent);
border-radius: 2px;
vertical-align: -2px;
}
.mw-parser-output h3 {
margin-top: 1.4em;
margin-bottom: 0.6em;
color: var(--wy-heading-3) !important;
font-family: var(--wy-font-serif);
font-weight: 650;
}
.mw-parser-output h4,
.mw-parser-output h5,
.mw-parser-output h6 {
color: var(--wy-heading-2) !important;
font-family: var(--wy-font-serif);
}
/* ==========================================
6. 链接
========================================== */
.mw-parser-output a:not(.new) {
color: var(--wy-link) !important;
text-decoration: none;
border-bottom: 1px solid transparent;
transition:
color 0.18s ease,
border-bottom-color 0.18s ease;
}
.mw-parser-output a:not(.new):hover {
color: var(--wy-link-hover) !important;
border-bottom-color: currentColor;
}
.mw-parser-output a.new {
color: var(--wy-link-new) !important;
}
.mw-parser-output a.new:hover {
filter: brightness(1.15);
}
/* ==========================================
7. 章节编辑按钮与铅笔图标
========================================== */
.mw-editsection,
.mw-editsection a,
.mw-editsection-bracket,
.page-header__actions a,
.page-header__actions button {
color: var(--wy-link) !important;
}
.mw-editsection a:hover,
.page-header__actions a:hover,
.page-header__actions button:hover {
color: var(--wy-link-hover) !important;
}
/* ==========================================
8. Portable Infobox 信息框
========================================== */
.portable-infobox {
float: right;
width: 300px !important;
margin: 0 0 20px 20px !important;
overflow: hidden;
color: var(--wy-text-main) !important;
background-color: var(--wy-bg-card) !important;
border: 1px solid var(--wy-border-color) !important;
border-radius: var(--wy-radius-lg) !important;
box-shadow: var(--wy-shadow-md) !important;
}
/*
* 信息框主标题：墨蓝渐变 + 纸白字。
* 纸白 on 墨蓝实测 12.83 AAA，深浅两个主题下都成立，
* 所以这里刻意写死不跟随主题。
*/
.portable-infobox .pi-title {
padding: 12px 8px !important;
color: #f7f1e4 !important;
background:
linear-gradient(
135deg,
#101a29,
#1b2a41
) !important;
border-bottom: 2px solid var(--wy-accent) !important;
font-family: var(--wy-font-serif);
font-size: 18px !important;
font-weight: 700 !important;
letter-spacing: 0.5px;
text-align: center !important;
}
/* 信息框分组标题 */
.portable-infobox .pi-header {
padding: 7px 12px !important;
color: var(--wy-heading-3) !important;
background-color: var(--wy-bg-soft) !important;
border-top: 1px solid var(--wy-border-color);
border-bottom: 1px solid var(--wy-border-color);
font-family: var(--wy-font-serif);
font-size: 12px !important;
font-weight: 700 !important;
letter-spacing: 0.8px;
}
/* 信息框图片区域 */
.portable-infobox .pi-image-collection,
.portable-infobox .pi-image {
padding: 8px;
background-color: var(--wy-bg-subtle) !important;
text-align: center;
}
.portable-infobox img {
max-width: 100%;
height: auto;
border-radius: var(--wy-radius-sm);
}
/* 信息框数据行 */
.portable-infobox .pi-data {
display: flex;
justify-content: space-between;
gap: 10px;
padding: 8px 14px !important;
color: var(--wy-text-main) !important;
background-color: var(--wy-bg-card) !important;
border-bottom: 1px solid var(--wy-border-color) !important;
font-size: 13px !important;
}
.portable-infobox .pi-data-label {
width: 40%;
color: var(--wy-text-muted) !important;
font-weight: 600 !important;
}
.portable-infobox .pi-data-value {
width: 60%;
color: var(--wy-text-main) !important;
text-align: right;
}
/* ==========================================
9. Wikitable 表格
========================================== */
.mw-parser-output table.wikitable {
width: 100%;
margin: 20px 0;
overflow: hidden;
border: 1px solid var(--wy-border-color);
border-collapse: separate;
border-spacing: 0;
border-radius: var(--wy-radius-md);
box-shadow: var(--wy-shadow-sm);
}
/* 表头 —— 底边用黄铜强调 */
.mw-parser-output table.wikitable > tr > th,
.mw-parser-output table.wikitable > * > tr > th {
padding: 10px 14px;
color: var(--wy-heading-2) !important;
background-color: var(--wy-bg-soft) !important;
border-right: 1px solid var(--wy-border-color);
border-bottom: 2px solid var(--wy-border-strong);
font-family: var(--wy-font-serif);
font-weight: 700;
text-align: left;
}
/* 表格数据 */
.mw-parser-output table.wikitable > tr > td,
.mw-parser-output table.wikitable > * > tr > td {
padding: 10px 14px;
color: var(--wy-text-main) !important;
background-color: var(--wy-bg-card) !important;
border-right: 1px solid var(--wy-border-color);
border-bottom: 1px solid var(--wy-border-color);
}
/* 隔行背景 */
.mw-parser-output table.wikitable > * > tr:nth-child(even) > td {
background-color: var(--wy-bg-soft) !important;
}
/* 悬停背景 */
.mw-parser-output table.wikitable > * > tr:hover > td {
background-color: var(--wy-bg-hover) !important;
}
/* ==========================================
10. 目录 TOC
========================================== */
#toc,
.toc {
display: inline-block;
margin: 20px 0;
padding: 16px 26px 18px !important;
color: var(--wy-text-main) !important;
background-color: var(--wy-bg-soft) !important;
border: 1px solid var(--wy-border-color) !important;
border-radius: var(--wy-radius-lg) !important;
box-shadow: var(--wy-shadow-sm) !important;
}
/* 目录顶部标题行 */
#toc .toctitle,
.toc .toctitle {
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 10px;
border-bottom: 1px solid var(--wy-border-strong);
}
/*
* “目录”两个字。
* 原版隐身的主要原因就是这里继承了深色的 --wy-secondary。
*/
#toc .toctitle h2,
.toc .toctitle h2 {
margin: 0 !important;
padding: 0 !important;
color: var(--wy-heading-1) !important;
border: 0 !important;
font-family: var(--wy-font-serif);
font-size: 17px !important;
font-weight: 750 !important;
line-height: 1.4;
}
/* 禁止正文 h2 的黄铜竖条出现在目录标题前面 */
#toc .toctitle h2::before,
.toc .toctitle h2::before {
display: none !important;
content: none !important;
}
/* “隐藏 / 显示”按钮 */
#toc .toctoggle,
#toc .toctogglelabel,
#toc .toctogglecheckbox + .toctitle .toctogglelabel,
.toc .toctoggle,
.toc .toctogglelabel {
color: var(--wy-link) !important;
}
#toc .toctoggle:hover,
#toc .toctogglelabel:hover,
.toc .toctoggle:hover,
.toc .toctogglelabel:hover {
color: var(--wy-link-hover) !important;
}
/* 目录列表 */
#toc ul,
.toc ul {
margin-top: 10px;
}
#toc li,
.toc li {
color: var(--wy-text-main) !important;
}
/* 目录编号 */
#toc .tocnumber,
.toc .tocnumber {
color: var(--wy-text-muted) !important;
}
/* 目录链接 */
#toc a,
.toc a {
color: var(--wy-text-main) !important;
border-bottom: 0 !important;
}
#toc a:hover,
.toc a:hover {
color: var(--wy-link-hover) !important;
}
/* ==========================================
11. 深色模式额外保险
========================================== */
body[data-theme="dark"] .page-header__title,
body[data-theme="dark"] .page-header__title-wrapper,
body[data-theme="dark"] #firstHeading,
body[data-theme="dark"] .firstHeading {
color: #f7f1e4 !important;
}
body[data-theme="dark"] #toc .toctitle h2,
body[data-theme="dark"] .toc .toctitle h2 {
color: #f7f1e4 !important;
}
body[data-theme="dark"] .mw-parser-output h2 {
color: #ede4d3 !important;
}
body[data-theme="dark"] .mw-parser-output h3 {
color: #c9a66b !important;
}
/* ==========================================
12. 较窄桌面窗口兼容
========================================== */
@media screen and (max-width: 800px) {
.portable-infobox {
float: none;
width: 100% !important;
max-width: 420px;
margin: 0 auto 20px !important;
}
#toc,
.toc {
box-sizing: border-box;
max-width: 100%;
}
}
/* ==========================================
13. 维护提示框
用法：{{维护提示|title=…|text=…|icon=⚠️}}
原 v2.1.0 的硬编码琥珀色已改用令牌
========================================== */
.wy-maintenance {
display: flex;
align-items: flex-start;
gap: 14px;
margin: 18px 0;
padding: 16px;
color: var(--wy-text-main);
background: var(--wy-bg-card);
border: 1px solid var(--wy-border-color);
border-left: 8px solid var(--wy-accent);
border-radius: var(--wy-radius-md);
box-shadow: var(--wy-shadow-sm);
}
.wy-maintenance-icon {
font-size: 30px;
line-height: 1;
}
.wy-maintenance-content {
flex: 1;
}
.wy-maintenance-title {
margin-bottom: 6px;
color: var(--wy-warn);
font-family: var(--wy-font-serif);
font-size: 18px;
font-weight: 700;
}
.wy-maintenance-text {
line-height: 1.7;
}
/* ==========================================
14. 语义标签
配色手册把氧化红定为「限制访问」、苔绿定为「已验证」，
这里提供 class，编辑者不必再写内联 style。
用法：<span class="wy-tag wy-tag-verified">已验证</span>
========================================== */
.wy-tag {
display: inline-block;
padding: 2px 10px;
border-radius: 999px;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.5px;
white-space: nowrap;
}
.wy-tag-restricted {
color: #f7f1e4;
background: var(--wy-warn);
}
.wy-tag-verified {
color: #f7f1e4;
background: var(--wy-ok);
}
/*
* 描边变体：用于正文内联，避免大色块太抢眼。
* 文字色直接用语义色，浅色下氧化红 9.47 / 苔绿 6.34，均达标。
*/
/* ==========================================
浏览卡图标深色模式适配
用于：
{{浏览卡|图标=Professor.svg|标题=教授列表}}
SVG 外部图片无法直接继承 color，
深色模式下转换为羊皮纸白。
========================================== */
/* 默认状态 */
.wy-browse-card img {
transition: filter 0.2s ease;
}
/* Fandom 手动深色模式 */
body[data-theme="dark"] .wy-browse-card img,
html.skin-theme-clientpref-night .wy-browse-card img,
.theme-fandomdesktop-dark .wy-browse-card img,
.theme-fandommobile-dark .wy-browse-card img {
filter: brightness(0) invert(1);
}
/* Fandom 跟随系统深色模式 */
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .wy-browse-card img {
filter: brightness(0) invert(1);
}
}
.wy-tag-restricted-outline {
color: var(--wy-warn);
background: transparent;
border: 1px solid currentColor;
}
.wy-tag-verified-outline {
color: var(--wy-ok);
background: transparent;
border: 1px solid currentColor;
}
/* ==========================================
15. 引言块
配色手册的「黄铜左边框 + 羊皮纸底」提示框，收编为 class
用法：<div class="wy-callout">…</div>
========================================== */
.wy-callout {
margin: 18px 0;
padding: 10px 16px;
color: var(--wy-text-main);
background: var(--wy-bg-card);
border-left: 3px solid var(--wy-accent);
font-size: 13px;
}
/* 黄铜装饰横线 —— 配色手册里每个标题下方那条 */
.wy-rule {
width: 64px;
height: 3px;
margin: 2px 0 20px;
background: var(--wy-accent);
border: 0;
}
/* ========== 组件类（模板化，主题变量自适应深浅色） ========== */
.wy-page { background:var(--wy-bg-card); padding:30px; margin:-20px; min-height:100vh; box-sizing:border-box; }
.wy-hero { border-radius:16px; overflow:hidden; margin:0 0 20px; box-shadow:var(--wy-shadow-md); }
.wy-grid { display:grid; gap:14px; margin:24px 0 8px; }
.wy-cols-4 { grid-template-columns:repeat(4,1fr); }
.wy-cols-2 {
grid-template-columns: repeat(2, 1fr);
}
.wy-gap-16 { gap:16px; margin:20px 0; }
.wy-stat-card { background:var(--wy-bg-soft); border:1px solid var(--wy-border-color); border-radius:10px; padding:16px 8px; text-align:center; }
.wy-stat-num { font-size:22px; font-weight:bold; color:var(--wy-heading-1); }
.wy-stat-label { font-size:11px; letter-spacing:1px; color:var(--wy-heading-3); margin-top:4px; }
.wy-browse-card { background:var(--wy-bg-soft); border:1px solid var(--wy-border-color); border-radius:14px; padding:22px; text-align:center; box-shadow:var(--wy-shadow-sm); }
.wy-browse-title { color:var(--wy-heading-1); }
.wy-letter-nav { background:var(--wy-bg-soft); border:1px solid var(--wy-border-color); border-radius:10px; padding:12px 18px; margin-bottom:24px; display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13px; }
.wy-nav-disabled { color:var(--wy-text-muted); }
.wy-letter-heading { color:var(--wy-heading-1); font-size:20px; font-weight:bold; margin:26px 0 4px; }
.wy-letter-bar { height:2px; width:36px; background:var(--wy-accent); margin-bottom:10px; }
.wy-letter-card { background:var(--wy-bg-soft); border:1px solid var(--wy-border-color); border-radius:10px; padding:16px 22px; margin-bottom:18px; line-height:2; }
.wy-columns { column-width:180px; column-gap:24px; line-height:2; }
.wy-card-muted { color:var(--wy-text-muted); font-style:italic; font-size:13px; }
/* 首页组件 */
.wy-kicker { color:var(--wy-heading-3); font-size:12px; letter-spacing:3px; text-transform:uppercase; margin-bottom:6px; }
.wy-banner { background:var(--wy-heading-1); border-left:4px solid var(--wy-accent); border-radius:6px; padding:16px 22px; margin:18px 0 22px; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; }
.wy-banner-text { color:var(--wy-bg-soft); }
.wy-banner-text span { font-size:90%; color:var(--wy-border-color); }
.wy-btn { display:inline-block; background:var(--wy-accent); color:var(--wy-heading-1); font-weight:bold; padding:8px 18px; border-radius:20px; white-space:nowrap; }
.wy-callout-warn { border-left:4px solid var(--wy-warn); }
.wy-section-box { background:var(--wy-bg-soft); border:1px solid var(--wy-border-color); border-radius:16px; overflow:hidden; margin:20px 0; box-shadow:var(--wy-shadow-md); }
.wy-section-box .wy-section-head { background:var(--wy-heading-1); padding:18px 28px; font-size:26px; font-weight:bold; color:var(--wy-bg-soft); border-bottom:3px solid var(--wy-accent); }
.wy-section-box .wy-section-body { padding:25px 35px; font-size:105%; line-height:2; color:var(--wy-text-main); }
/* 主页布局组件 */
.wy-intro { width:100%; }
.wy-intro-main { width:68%; vertical-align:top; }
.wy-intro-side { width:32%; text-align:center; vertical-align:middle; }
.wy-lead { margin-top:20px; }
.wy-qq { font-size:120%; color:var(--wy-heading-1); }
/* ===== 标准 infobox 右浮动（内容页内联表格用 class="wikitable infobox"） ===== */
/* 标准 infobox 右浮动（内容页内联表格用 class="infobox"） */
.infobox {
float: right;
clear: right;
width: 300px;
margin: 0 0 20px 20px;
border: 1px solid var(--wy-border-color);
border-collapse: collapse;
background: var(--wy-bg-card);
}
.infobox th, .infobox td {
border: 1px solid var(--wy-border-color);
padding: 4px 8px;
}
.infobox th {
text-align: center;
}
[ERR]
[ERR]
/* 移动端：infobox 全宽居中堆叠（仿 portable-infobox） */
@media screen and (max-width: 800px) {
.infobox {
float: none;
width: 100% !important;
max-width: 420px;
margin: 0 auto 20px !important;
}
}
/* 深色模式：内容容器明确深色背景，避免浅色透出 */
@media (prefers-color-scheme: dark) {
.mw-body, .mw-body-content, #content, .wy-page {
background-color: var(--wy-bg-card) !important;
}
}
/* 浏览卡图标：深色模式转为白色 */
body[data-theme="dark"] .wy-browse-card img,
html.skin-theme-clientpref-night .wy-browse-card img,
.theme-fandomdesktop-dark .wy-browse-card img,
.theme-fandommobile-dark .wy-browse-card img {
filter: brightness(0) invert(1);
}
@media (prefers-color-scheme: dark) {
html.skin-theme-clientpref-os .wy-browse-card img {
filter: brightness(0) invert(1);
}
}
html.skin-theme-clientpref-night .mw-body,
html.skin-theme-clientpref-night .mw-body-content,
html.skin-theme-clientpref-night #content,
html.skin-theme-clientpref-night .wy-page {
background-color: var(--wy-bg-card) !important;
}