/* ============================================================
中文后联网 · 页面主题 CSS（FBC镜像站适配版）
------------------------------------------------------------
原稿: Fandom 后室中文 User:APT_INSTALL/styles/中文后联网.css
适配: fandombackroomscn.icu（MediaWiki 1.46 / Cosmos 皮肤）
改动:
1. 选择器映射 Fandom Oasis -> Cosmos：
.page / .side-nav -> .mw-body / .cosmos-rail-inner
.wikiabar -> .cosmos-rail-inner
.wds-tabs__tab -> 保留（Cosmos 内置 WDS 组件）
2. 移除 模板:纯黑.css 调用（body 已强制纯黑，无意义）
3. 补齐原稿未定义的变量 (--accent-color / --border-glow)
4. 新增 MediaWiki 元素黑化：wikitable / toc / catlinks /
references / blockquote / thumbinner / editsection 等
5. 头部、导航、侧栏、页脚、搜索框一并黑化，保证整页观感统一
部署: 将本文件内容粘贴到
「用户:<你的用户名>/styles/中文后联网.css」
然后在目标页面写入:
<span class="import-css" data-from="用户:<你的用户名>/styles/中文后联网.css" data-trigger="none">
============================================================ */
/* 字体导入（Orbitron/Rajdhani 为拉丁字母字体，中文自动回退；
国内网络如无法访问 Google Fonts，删除本行不影响布局） */
@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;700&family=Rajdhani:wght@400;700&display=swap');
/* ---- 基础科技主题变量 ---- */
- root {
--neon-blue: #0ff; --cyber-purple: #bc13fe; --matrix-green: #0f0; --dark-bg: #000000; --accent-color: #0ff; /* 原稿引用了但未定义，补齐 */ --border-glow: rgba(0, 255, 255, 0.3); /* 同上 */
}
/* ---- 页面主体（整页黑化） ---- */ body {
background: var(--dark-bg) !important; color: #fff; font-family: 'Orbitron', 'Rajdhani', 'Noto Sans SC', 'Microsoft YaHei', Arial, sans-serif; line-height: 1.6;
}
/* ---- 头部 / 导航黑化（Cosmos 皮肤） ---- */ .cosmos-header {
background: #000 !important; border-bottom: 1px solid rgba(0, 255, 255, 0.25); box-shadow: 0 2px 12px rgba(0, 255, 255, 0.12);
} .cosmos-header__sitename {
color: #fff; text-shadow: 0 0 10px var(--neon-blue);
} .cosmos-header__counter {
color: rgba(0, 255, 255, 0.8);
} .cosmos-header__local-navigation {
border-top-color: rgba(0, 255, 255, 0.2);
} .cosmos-header__local-navigation .wds-dropdown__content, .cosmos-tools-list, .cosmos-personalTools-list {
background: #000 !important; border: 1px solid rgba(0, 255, 255, 0.3);
} .cosmos-header__local-navigation .wds-dropdown__content a, .cosmos-tools-list a {
color: var(--neon-blue) !important;
}
/* 导航标签科技化（Cosmos 内置 WDS 组件，类名可直接复用） */ .wds-tabs__tab {
border: 1px solid var(--neon-blue) !important; background: rgba(0, 255, 255, 0.1) !important; margin: 0 5px; transition: all 0.3s ease;
} .wds-tabs__tab:hover {
box-shadow: 0 0 15px var(--neon-blue); background: rgba(0, 255, 255, 0.3) !important;
} .wds-tabs__tab a {
color: var(--neon-blue) !important;
} .wds-tabs__tab:hover a {
color: #fff !important;
}
/* 搜索框 */ .cosmos-search-box input {
background: #00161f !important; color: var(--neon-blue) !important; border: 1px solid rgba(0, 255, 255, 0.4) !important; box-shadow: inset 0 0 8px #002233;
} .cosmos-search-box input::placeholder {
color: rgba(0, 255, 255, 0.5);
}
/* ---- 内容区 / 侧栏容器 ---- */ .mw-body, .cosmos-rail-inner {
background: rgba(0, 0, 0, 0.9); border: 1px solid rgba(0, 255, 255, 0.3); box-shadow: 0 0 20px rgba(0, 255, 255, 0.2);
}
/* 右侧栏星云效果（原 .wikiabar 映射） */ .cosmos-rail-inner {
background: rgba(16, 45, 68, 0.9) !important; border-left: 1px solid var(--accent-color); box-shadow: -3px 0 10px var(--border-glow);
} .railModule, .recentchanges-module, .cosmos-rail-inner .module {
background: rgba(0, 0, 0, 0.75) !important; border: 1px solid rgba(0, 255, 255, 0.25) !important; color: #fff;
} .railModule h2, .railModule h3, .recentchanges-module h3 {
color: var(--neon-blue); text-shadow: 0 0 8px var(--neon-blue);
} .railModule a, .recentchanges-module a {
color: var(--neon-blue);
}
/* 页脚 */
- cosmos-footer {
background: #000 !important; border-top: 1px solid rgba(0, 255, 255, 0.2); color: #9fb3b3;
}
- cosmos-footer a {
color: var(--neon-blue);
}
/* 移动端导航 */ .cosmos-mobile-navigation {
background: #000 !important; border-bottom: 1px solid rgba(0, 255, 255, 0.2);
} .cosmos-mobile-navigation a {
color: var(--neon-blue) !important;
}
/* ---- 标题特效 ---- */ .mw-body h1, .mw-body h2, .mw-body h3 {
color: #fff; text-shadow: 0 0 10px var(--neon-blue); position: relative; padding-left: 25px;
} .mw-body h1::before, .mw-body h2::before, .mw-body h3::before {
content: ">"; color: var(--neon-blue); position: absolute; left: 0; text-shadow: 0 0 8px var(--neon-blue); transition: transform 0.3s ease, opacity 0.3s ease;
} .mw-body h1:hover::before, .mw-body h2:hover::before, .mw-body h3:hover::before {
transform: translateX(0.2em); opacity: 1; text-shadow: 0 0 12px var(--neon-blue);
} .page-header {
border-bottom: 1px solid rgba(0, 255, 255, 0.2);
}
/* ---- 链接特效 ---- */ a {
color: var(--neon-blue); text-decoration: none; position: relative; transition: color 0.3s ease;
} a:hover {
color: #fff;
} a::after {
content: ""; position: absolute; width: 100%; height: 2px; background: var(--neon-blue); bottom: -2px; left: 0; transform: scaleX(0); transition: transform 0.3s ease;
} a:hover::after {
transform: scaleX(1);
}
/* ---- 未来感表格（含 MediaWiki 标准 .wikitable） ---- */ table, .wikitable {
border: 2px solid var(--neon-blue); background: rgba(0, 0, 0, 0.7); margin: 20px 0; color: #fff;
} th, .wikitable > tr > th, .wikitable > * > tr > th {
background: rgba(0, 255, 255, 0.1); color: #fff; text-transform: uppercase; letter-spacing: 2px; border-color: rgba(0, 255, 255, 0.3);
} td, .wikitable > tr > td, .wikitable > * > tr > td {
border-bottom: 1px solid rgba(0, 255, 255, 0.1); border-color: rgba(0, 255, 255, 0.15); padding: 12px; color: #e6f5f5;
}
/* ---- 代码块终端效果（MediaWiki: pre / .mw-code） ---- */ pre, .mw-code {
background: #00161f !important; border: 1px solid #004455; box-shadow: inset 0 0 10px #002233; color: #6cffeb !important; font-family: 'Space Mono', Consolas, 'Courier New', monospace; padding: 20px 15px 15px; position: relative; overflow-x: auto;
} pre::before {
content: "CODE TERMINAL"; position: absolute; top: 0; left: 0; background: #004455; color: var(--neon-blue); font-size: 0.75em; letter-spacing: 2px; padding: 2px 10px;
} code {
color: #6cffeb; background: rgba(0, 255, 255, 0.08); padding: 1px 5px; font-family: 'Space Mono', Consolas, monospace;
}
/* ---- MediaWiki 元素黑化补充 ---- */ .toc, .tocbox {
background: rgba(0, 0, 0, 0.8); border: 1px solid rgba(0, 255, 255, 0.3); color: #fff;
} .toc a, .tocbox a, .tocnumber {
color: var(--neon-blue);
} .catlinks {
background: rgba(0, 0, 0, 0.8); border: 1px solid rgba(0, 255, 255, 0.3); color: #fff;
} .catlinks a {
color: var(--neon-blue);
} .mw-editsection a, .mw-editsection-bracket {
color: var(--neon-blue) !important; opacity: 0.7;
} .references {
background: rgba(0, 0, 0, 0.6); border-top: 1px solid rgba(0, 255, 255, 0.2); color: #cfe9e9;
} blockquote {
background: rgba(0, 255, 255, 0.05); border-left: 3px solid var(--neon-blue); padding: 10px 15px; color: #cfe9e9;
} .thumbinner {
background: #000 !important; border: 1px solid rgba(0, 255, 255, 0.3) !important;
} .thumbcaption {
color: #9fd8d8 !important;
} .hatnote, .dablink {
background: rgba(0, 255, 255, 0.06); border-left: 3px solid var(--neon-blue); color: #cfe9e9;
} .infobox {
background: #000; color: #fff; border: 2px solid var(--neon-blue);
}
/* ---- 未来感按钮（页面内使用 class="button" 时生效） ---- */ .button {
background: linear-gradient(45deg, #000, var(--neon-blue)); border: 1px solid var(--neon-blue); padding: 8px 20px; color: #fff; text-transform: uppercase; transition: all 0.3s ease; cursor: pointer;
} .button:hover {
box-shadow: 0 0 15px var(--neon-blue); transform: translateY(-2px);
}
/* ---- 动态扫描线效果 ---- */ @keyframes scanline {
0% {
transform: translateY(-100%);
opacity: 0.8;
}
80% {
opacity: 0.5;
}
100% {
transform: translateY(100vh);
opacity: 0.2;
}
} body::after {
content: "";
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
background: linear-gradient(
to bottom,
transparent 49%,
rgba(0, 255, 255, 0.15) 50%,
transparent 51%
);
background-size: 100% 5px;
pointer-events: none;
animation: scanline 3s linear infinite;
z-index: 9990; /* 低于 wds-dialog 等弹层；pointer-events:none 不挡交互 */
}
/* ---- 选中文字与滚动条（可选彩蛋） ---- */
- selection {
background: var(--neon-blue); color: #000;
}
- -webkit-scrollbar {
width: 10px; height: 10px;
}
- -webkit-scrollbar-track {
background: #000;
}
- -webkit-scrollbar-thumb {
background: #004455; border: 1px solid var(--neon-blue);
}
/* ---- 窄屏适配 ---- */ @media (max-width: 720px) {
.mw-body h1,
.mw-body h2,
.mw-body h3 {
padding-left: 18px;
}
.wds-tabs__tab {
margin: 0 2px;
}
}