Apt install（留言 | 贡献）2026年8月6日 (四) 16:32的版本
/* ============================================================
中文后联网 · 页面主题 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. 移除 {{Template:纯黑.css}} 调用（body 已强制纯黑，无意义）
3. 补齐原稿未定义的变量 (--accent-color / --border-glow)
4. 新增 MediaWiki 元素黑化：wikitable / toc / catlinks /
references / blockquote / thumbinner / editsection 等
5. 头部、导航、侧栏、页脚、搜索框一并黑化，保证整页观感统一
部署: 将本文件内容粘贴到
「用户:<你的用户名>/styles/中文后联网.css」
然后在目标页面写入:
{{CSS|用户:<你的用户名>/styles/中文后联网.css}}
============================================================ */
/* ---- 基础科技主题变量 ---- */
: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;
}
}