MediaWiki:Citizen.css

注意：在发布之后，您可能需要清除浏览器缓存才能看到所作出的更改的影响。

• Firefox或Safari：按住Shift的同时单击刷新，或按Ctrl-F5或Ctrl-R（Mac为⌘-R）
• Google Chrome：按Ctrl-Shift-R（Mac为⌘-Shift-R）
• Edge：按住Ctrl的同时单击刷新，或按Ctrl-F5。

/* 压缩 Citizen 底部分类和版权之间的留白区域 */
body.skin-citizen .mw-footer {
  margin-top: 0 !important;
  padding-top: 0.5em !important;
}

/* Citizen 页脚底部压缩 */
body.skin-citizen .mw-footer {
  margin-bottom: 0 !important;
  padding-bottom: 0.5em !important;
  text-align: start !important;
}
/* 统一感谢按钮样式 */
.mw-thanks-thank-link {
  color: #36c;
  text-decoration: none;
}
.mw-thanks-thank-link:hover {
  color: #0645ad;
  text-decoration: underline;
}
/* IPE增高 */
body.skin-citizen #ipe-edit-toolbox {
    bottom: 7.3rem !important;
}

/* 黑幕相关 */
/* 黑幕背景 */
.heimu,
.heimu rt {
    background-color: #252525;
}

/* 通用默认：浅色模式下用深灰色隐藏文字 */
.heimu,
.heimu a,
a .heimu,
a.new .heimu,
span.heimu a.new,
span.heimu a.external,
span.heimu a.external:visited,
span.heimu a.extiw,
span.heimu a.extiw:visited,
span.heimu a.mw-disambig,
span.heimu a.mw-redirect {
    transition: color 0.13s linear;
    color: #252525;
    text-shadow: none;
}

/* 深色模式（night 或 os+dark）下默认隐藏文字 */
.skin-theme-clientpref-night .heimu,
.skin-theme-clientpref-night .heimu a,
.skin-theme-clientpref-night a .heimu,
.skin-theme-clientpref-night a.new .heimu,
.skin-theme-clientpref-night span.heimu a.new,
.skin-theme-clientpref-night span.heimu a.external,
.skin-theme-clientpref-night span.heimu a.external:visited,
.skin-theme-clientpref-night span.heimu a.extiw,
.skin-theme-clientpref-night span.heimu a.extiw:visited,
.skin-theme-clientpref-night span.heimu a.mw-disambig,
.skin-theme-clientpref-night span.heimu a.mw-redirect {
    color: #252525;
}

/* 悬停显示：默认浅色下使用白色 */
span.heimu:hover,
span.heimu:active {
    color: #EEF2F9;
}
span.heimu:hover a,
a:hover span.heimu {
    color: lightblue;
}
span.heimu:hover a:visited,
a:visited:hover span.heimu {
    color: #C5CAE9;
}
span.heimu:hover a.new,
a.new:hover span.heimu {
    color: #FCC;
}
span.heimu a.new:hover:visited,
a.new:hover:visited span.heimu {
    color: #EF9A9A;
}
span.heimu:hover a.extiw:visited,
a.extiw:visited:hover span.heimu {
    color: #D1C4E9;
}

/* 深色（手动 night）下：悬停时继承正文颜色 */
.skin-theme-clientpref-night span.heimu:hover,
.skin-theme-clientpref-night span.heimu:active,
.skin-theme-clientpref-night span.heimu:hover a,
.skin-theme-clientpref-night a:hover span.heimu,
.skin-theme-clientpref-night span.heimu:hover a:visited,
.skin-theme-clientpref-night a:visited:hover span.heimu,
.skin-theme-clientpref-night span.heimu:hover a.new,
.skin-theme-clientpref-night a.new:hover span.heimu,
.skin-theme-clientpref-night span.heimu a.new:hover:visited,
.skin-theme-clientpref-night a.new:hover:visited span.heimu,
.skin-theme-clientpref-night span.heimu:hover a.extiw:visited,
.skin-theme-clientpref-night a.extiw:visited:hover span.heimu {
    color: inherit !important;
}

/* 深色（自动 OS + 浏览器深色）下：悬停时继承正文颜色 */
@media (prefers-color-scheme: dark) {
    .skin-theme-clientpref-os .heimu:hover,
    .skin-theme-clientpref-os .heimu:active,
    .skin-theme-clientpref-os a:hover .heimu,
    .skin-theme-clientpref-os .heimu:hover a,
    .skin-theme-clientpref-os .heimu:hover a:visited,
    .skin-theme-clientpref-os .heimu:hover a.new,
    .skin-theme-clientpref-os .heimu a.new:hover:visited,
    .skin-theme-clientpref-os .heimu:hover a.extiw:visited {
        color: inherit !important;
    }
}
/* CodeMirror 编辑器选中文本样式：浅蓝底 + 深蓝字 */
.CodeMirror ::selection {
    background-color: #cce4ff !important;
    color: #4449cf !important;
}

.CodeMirror ::-moz-selection {
    background-color: #cce4ff !important;
    color: #4449cf !important;
}

/* 顶部头图区域（固定在顶部） */
.header-image {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 30vh; /* 占视口 30% 高度 */
    background-image: url('/resources/assets/header.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: -4; /* 比背景图更底层 */
    pointer-events: none;
}

/* 渐变遮罩：头图到底部背景过渡 */
.header-gradient {
    position: fixed;
    top: 30vh;
    left: 0;
    width: 100%;
    height: 10vh;
    background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0));
    z-index: -3;
    pointer-events: none;
}

/* 背景图片，设置在 body 上，随页面滚动 */
body {
    background-image: url('/resources/assets/Th20_eff_switchbg.webp');
    background-repeat: repeat;
    background-size: auto;
    background-position: top center;
    background-attachment: scroll;
    margin: 0;
}

/* 遮罩层一：surface-0 */
body::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -2;
    background-color: var(--color-surface-0);
    opacity: 0.3;
    pointer-events: none;
}

/* 遮罩层二：surface-1 */
main::after {
    content: '';
    position: fixed;
    inset: 0;
    z-index: -1;
    background-color: var(--color-surface-1);
    opacity: 0.4;
    pointer-events: none;
}

/* 遮罩层三：surface-2 */
main::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    background-color: var(--color-surface-2);
    opacity: 0.6;
    pointer-events: none;
}

/* 页面主要内容从头图下方开始 */
main {
    position: relative;
    z-index: 1;
    margin-top: 40vh; /* 头图 + 渐变高度 */
    padding: 1rem;
}