phenomenon-c-0

+ 版式代码

@import url(https://tartar0s.wikidot.com/local--files/theme:grass-block/VonwaonBitmap%2012px.css);
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "White Database";
   --theme-name: "White Database Theme";
 
   --base-font-size: 0.9rem;
 
   --logo-image: url("http://tartar0s.wikidot.com/local--files/theme:dark-database/logo.png");
   --header-title: "The Backrooms";
   --header-subtitle: "你曾经来过这里";
 
   --body-font: "VonwaonBitmap 12px";
   --header-font: "VonwaonBitmap 12px";
   --title-font: "VonwaonBitmap 12px";
   --mono-font: "VonwaonBitmap 12px";
 
    --text: 0,0,0;
    --link: 50,50,50;
    --back: 235, 235, 235;
 
    --white-monochrome: var(--back);
    --pale-gray-monochrome: var(--back);
    --light-gray-monochrome: var(--text);
    --gray-monochrome: var(--back);
    --dark-gray-monochrome: var(--text);
    --black-monochrome: var(--text);
    --pale-accent: var(--link);
    --bright-accent: var(--link);
    --medium-accent: var(--back);
    --dark-accent: var(--back);
 
    --link-color: var(--link);
    --visited-link-color: var(--link);
    --hover-link-color: var(--link);
    --newpage-color: var(--link);
    /* --alt-accent: 255, 0, 255; */
 
   --swatch-text-light: var(--text);
   --rating-module-button-plus-color: var(--text);
   --rating-module-button-negative-color: var(--text);
   --rating-module-button-cancel-color: var(--text);
   --rating-module-button-credit-color: var(--text);
 
   --border-styling: solid 0.15rem rgb(var(--swatch-border-color));
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
 
   --gradient-topmenu: linear-gradient(
      to bottom,
      hsla(0, 0%, 100%, 0) 0%,
      hsla(0, 0%, 100%, 0) var(--header-height-on-desktop),
      rgba(var(--swatch-topmenu-border-color), 1) var(--header-height-on-desktop),
      rgba(var(--swatch-topmenu-border-color), 1) calc(var(--header-height-on-desktop) + 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--header-height-on-desktop) + 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 0.95) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-border-color), 1) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-border-color), 1) 100%
   );
}
 
html {
   line-height: 1.175;
}
 
body {
   font-size: 1.1em;
}
 
#page-content,#page-title{
   letter-spacing: 0.15rem;
}
 
#page-content a{
   background-color:rgb(0,0,0);
   color: rgb(255,255,255);
}
 
#page-content a:hover{
   background-color:rgb(235,235,235);
   color: rgb(0,0,0);
}
 
#page-content .page-rate-widget-box a{
   background: rgb(235,235,235);
   color: rgb(0,0,0);
}
 
#page-content .page-rate-widget-box a:hover{
   background: rgb(0,0,0);
   color: rgb(0,0,0);
   border: none;
   box-shadow: none;
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
   transition: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -0.3rem;
   background-image: var(--logo-image);
   filter: brightness(0%) invert(0%);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: none;
}
 
#header h1:before, #header h2:before {
   content: "";
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
#account-topbutton {
   border: var(--border-styling);
}
 
#search-top-box-form input[type="submit"]:hover {
    background: rgb(var(--text));
    color: rgb(var(--back));
}
 
#account-options {
   background-color: rgb(var(--back));
   border: var(--border-styling);
}
 
#account-options>ul>li a:hover {
   color: rgb(var(--text));
}
 
#search-top-box input.empty:hover {
     color: rgb(var(--back));
}
 
#top-bar>ul>li a {
   color: rgb(var(--text));
}
 
#page-title {
   color: rgb(var(--link));
}
 
#page-title:before {
   content: "> ";
}
 
#top-bar div.mobile-top-bar>ul>li a,
#top-bar div.top-bar>ul>li a{
   color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li a:hover,
#top-bar div.top-bar>ul>li a:hover{
   color: rgb(var(--back));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li,
#top-bar div.top-bar>ul>li>ul>li {
    background-color: rgb(var(--back));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li a,
#top-bar div.top-bar>ul>li>ul>li a {
    color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li:hover,
#top-bar div.top-bar>ul>li>ul>li:hover {
    background-color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li a:hover,
#top-bar div.top-bar>ul>li>ul>li a:hover {
    color: rgb(var(--back));
}
 
h1, h2, h3, h4, h5, h6 {
   color: rgb(var(--link));
}
 
h1:before, h2:before, h3:before, h4:before, h5:before, h6:before {
    content: "> "
}
 
.styled-quote {
   background-color:rgb(235,235,235);
   border: var(--border-styling);
   border-left: 0.5rem solid rgba(0,0,0);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: none;
}
 
#page-title, .meta-title {
    border-bottom: var(--border-styling);
}
 
.page-rate-widget-box {
   border: var(--border-styling);
   background: rgb(var(--back));
}
 
.scp-image-block .scp-image-caption {
   border: var(--border-styling);
}
 
.scp-image-block {
   border: var(--border-styling);
}
 
hr {
   color: transparent;
   background-color: transparent;
   border: 0;
   border-bottom: var(--border-styling);
}
 
blockquote,.blockquote {
   border: var(--border-styling);
   box-shadow: none;
}
 
.collapsible-block-link:before {
   content: "> "
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
   border: var(--border-styling)!important;
   background-color: rgb(235,235,235)!important;
   color: rgb(0,0,0)!important;
}
 
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
   background-color: rgb(var(--text))!important;
   color: rgb(var(--back))!important;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
   background-color: rgb(var(--text))!important;
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    border: var(--border-styling)!important;
}
 
table.wiki-content-table th,
table.wiki-content-table td {
   border: var(--border-styling) !important;
}
 
.footnotes-footer {
color: black !important;
background-color: rgb(235,235,235) !important;
padding: 3ch;
border: 0;
margin: 1rem 0;
position: relative;
display: block;
box-shadow:inset 0 0 0 1ch rgb(235,235,235),inset 0 0 0 1.5ch #000000;
line-height: 20px;
}
 
.footnotes-footer .title{
    display: none !important;
}
 
.footnotes-footer:before {
content: "FOOTNOTES";
letter-spacing: 0!important;
position: absolute;
left: 15%;
-webkit-transform: translateX(-50%) translateY(-3ch);
transform: translateX(-50%) translateY(-3ch);
background-color: #000;
color: #FFFFFF;
padding: 0 0.75rem;
}
 
.document-block{
color: black !important;
background-color: rgb(235,235,235) !important;
padding: 3ch;
border: 0;
margin: 1rem 0;
position: relative;
display: block;
box-shadow:inset 0 0 0 1ch rgb(235,235,235),inset 0 0 0 1.5ch #000000;
line-height: 16px;
}
.document-block:before {
content: "DOCUMENT";
letter-spacing: 0!important;
position: absolute;
left: 15%;
-webkit-transform: translateX(-50%) translateY(-3ch);
transform: translateX(-50%) translateY(-3ch);
background-color: #000;
color: #FFFFFF;
padding: 0 0.75rem;
}
.code {
color: black !important;
background-color: rgb(235,235,235) !important;
padding: 3ch;
border: 0;
margin: 1rem 0;
position: relative;
display: block;
box-shadow:inset 0 0 0 1ch rgb(235,235,235),inset 0 0 0 1.5ch #000000;
line-height: 16px;
}
.code:before {
content: "CODE";
letter-spacing: 0!important;
position: absolute;
left: 15%;
-webkit-transform: translateX(-50%) translateY(-3ch);
transform: translateX(-50%) translateY(-3ch);
background-color: #000;
color: #FFFFFF;
padding: 0 0.75rem;
}
 
@media only screen and (max-width: 510px) {
.footnotes-footer {
color: black !important;
background-color: rgb(235,235,235) !important;
padding: 3ch;
border: 0;
margin: 1rem 0;
position: relative;
display: block;
box-shadow:inset 0 0 0 1ch rgb(235,235,235),inset 0 0 0 1.5ch #000000;
line-height: 16px;
}
 
.footnotes-footer .title{
    display: none !important;
}
 
.footnotes-footer:before {
content: "FOOTNOTES";
letter-spacing: 0!important;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-3ch);
transform: translateX(-50%) translateY(-3ch);
background-color: #000;
color: #FFFFFF;
padding: 0 0.75rem;
}
 
.document-block {
color: black !important;
background-color: rgb(235,235,235) !important;
padding: 3ch;
border: 0;
margin: 1rem 0;
position: relative;
display: block;
box-shadow:inset 0 0 0 1ch rgb(235,235,235),inset 0 0 0 1.5ch #000000;
line-height: 16px;
}
.document-block:before {
content: "DOCUMENT";
letter-spacing: 0!important;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-3ch);
transform: translateX(-50%) translateY(-3ch);
background-color: #000;
color: #FFFFFF;
padding: 0 0.75rem;
}
 
.code {
color: black !important;
background-color: rgb(235,235,235) !important;
padding: 3ch;
border: 0;
margin: 1rem 0;
position: relative;
display: block;
box-shadow:inset 0 0 0 1ch rgb(235,235,235),inset 0 0 0 1.5ch #000000;
line-height: 16px;
}
.code:before {
content: "CODE";
letter-spacing: 0!important;
position: absolute;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-3ch);
transform: translateX(-50%) translateY(-3ch);
background-color: #000;
color: #FFFFFF;
padding: 0 0.75rem;
}
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   filter: brightness(0%) invert(0%);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border: var(--border-styling) !important;
   background-color: rgb(var(--back));
   color: rgb(var(--text));
   margin: 0;
   border-collapse: collapse;
   box-sizing: content-box;
}
 
#side-bar .heading p {
   color: rgb(var(--text));
}
 
#side-bar:hover {
   border: var(--border-styling);
}
 
div.menu-item a:hover {
   background-color: rgb(var(--text)) !important;
   color: rgb(var(--back)) !important;
}
 
#side-bar div.menu-item a:before,
#side-bar div.menu-item a:hover:before {
   background-color: transparent;
}
 
#side-bar .side-block>.collapsible-block .collapsible-block-link {
   color: rgb(var(--text));
}
 
#side-bar .side-block>.collapsible-block .collapsible-block-link:hover {
   color: rgb(var(--back));
   background-color: rgb(var(--taxt)) !important;
}
 
.owindow .button-bar a, a.button, button, div.buttons input, file, input.button {
   color: rgb(var(--text));
}
 
.printuser img.small {
    display: none;
}
 
::-webkit-scrollbar-thumb,
#side-bar:hover::-webkit-scrollbar-thumb {
   background-color: rgb(var(--text)) !important;
}
 
::-webkit-scrollbar-track,
#side-bar:hover::-webkit-scrollbar-track {
   background: rgb(var(--back)) !important;
}
 
.owindow .button-bar a, a.button, button, div.buttons input, file, input.button {
   transition: none;
}
 
#top-bar div.mobile-top-bar>ul>li,
#top-bar div.top-bar>ul>li {
   transition: none;
}
 
#top-bar div.mobile-top-bar>ul>li>a:after,
#top-bar div.mobile-top-bar>ul>li>a:before,
#top-bar div.top-bar>ul>li>a:after,
#top-bar div.top-bar>ul>li>a:before,
#top-bar>ul>li {
   transition: none;
}
 
#top-bar>ul>li>:after,
#top-bar>ul>li>:before {
   display: none;
}
 
#top-bar li ul {
   transition: none;
}
 
.yui-navset * {
   transition: none;
}
 
#side-bar {
   background-color: rgb(var(--back));
}
 
#main-content::before {
   display: none;
}
 
.top-box .header-diamond .diamond-image {
   filter: brightness(0%) invert(0%);
}
 
.top-box .bottom-text p, .top-box .bottom-text:after, .top-box .top-text p {
   color: rgb(var(--text)) !important;
}
 
.top-box, .diamond-color {
    background: rgb(var(--back)) !important;
}
 
.top-box {
   border: var(--border-styling) !important;
}
 
.top-box .top-text p {
    font: 2.3rem "VonwaonBitmap 12px" !important;
}
 
.top-box .bottom-text p, .top-box .bottom-text:after {
   font: 1.9rem "VonwaonBitmap 12px" !important;
}
 
.top-box .gradient-box, .top-box:before {
    background: none !important;
}
 
.header-diamond {
    background-image: none !important;
}
 
.header-diamond .diamond-pattern, .diamond-color {
   background: rgb(var(--back)) !important;
   border: var(--border-styling) !important;
     mask: none !important;
     -webkit-mask: none !important;
     transform: rotate(45deg) translate(4.1rem, -0.46rem);
   width: 10rem !important;
    height: 10rem !important;
}
 
.bottom-box ul li {
    font: 1.9rem "VonwaonBitmap 12px" !important;
    color: rgb(var(--text)) !important;
    line-height: 1rem !important;
}
 
.bottom-box ul li:before {
    background: rgb(var(--back)) !important;
    height: 0.75rem !important;
    width: 0.75rem !important;
    border: var(--border-styling);
}
 
.top-box.class-unknown .header-diamond {
   filter: none !important;
}
 
.top-box.class-0 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-0.png") center/70% no-repeat !important;
}
 
.top-box.class-1 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-1.png") center/70% no-repeat !important;
}
 
.top-box.class-2 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-2.png") center/70% no-repeat !important;
}
 
.top-box.class-3 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-3.png") center/70% no-repeat !important;
}
 
.top-box.class-4 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-4.png") center/70% no-repeat !important;
}
 
.top-box.class-5 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-5.png") center/70% no-repeat !important;
}
 
.top-box.class-unknown .header-diamond .diamond-image,
.top-box.class-pending .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-unknown.png") center/70% no-repeat !important;
}
 
@media only screen and (max-width: 440px) {
    .top-box .top-text p {
        font: 2.3rem "VonwaonBitmap 12px" !important;
    }
 
    .bottom-box ul li {
        line-height: 1.5rem !important;
    }
}
 
.top-box .bg {
   display: none;
}
 
.top-box .header-diamond .diamond-image {
   -webkit-mask: none !important;
   mask: none !important;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
 
/* ----- I LOVE BLACK HIGHLIGHTER ----- */
:root {
    --theme-base: "black-highlighter";
    --theme-id: "iceberg";
    --theme-name: "Iceberg Theme";
 
    --theme-base: "black-highlighter";
    --logo-image: url("https://s2.loli.net/2022/05/25/3YWRG1NotOylr5X.png");
    --header-title: "冰山";
    --header-subtitle: "冰冻三尺";
 
    --body-font: 'Noto Sans SC', sans-serif;
    --header-font: 'ZCOOL XiaoWei', sans-serif;
    --title-font:  'Noto Serif SC', sans-serif;
    --mono-font: 'Noto Serif SC', sans-serif;
 
    --accent-white: 230, 242, 255;
    --accent-color-light: 174, 214, 241;
    --accent-color-medium: 41, 128, 185;
    --accent-color-dark: 31, 97, 141;
 
    --white-monochrome: var(--accent-color-light);
    --pale-gray-monochrome: var(--accent-color-medium);
    --light-gray-monochrome: var(--accent-color-dark);
    --gray-monochrome: var(--accent-color-dark);
    --dark-gray-monochrome: var(--accent-color-dark);
    --black-monochrome: 12, 12, 12;
 
    --pale-accent: var(--accent-color-dark);
    --bright-accent: var(--accent-color-medium);
    --medium-accent: var(--accent-color-dark);
    --dark-accent: var(--accent-color-medium);
    --alt-accent: 221, 102, 17;
 
    --link-color: var(--accent-color-dark);
    --visited-link-color: var(--link-color);
    --hover-link-color: var(--link-color);
 
    --swatch-headerh1-color: var( --accent-white);
    --swatch-headerh2-color: var( --accent-white);
    --swatch-border-color: var(--accent-color-medium);
    --gradient-header:linear-gradient(to top, #9890e3 0%, #7FB3D5 100%);
 
    --box-color-0:  211, 224, 233 !important;
    --box-color-1:  166, 192, 210 !important;
    --box-color-2:  121, 160, 187 !important;
    --box-color-3:  76, 129, 164 !important;
    --box-color-4:  76, 129, 164 !important;
    --box-color-5:  var(--accent-color-dark) !important;
}
 
/* ----- SELECTION ----- */
::selection {
    background: rgb(var(--accent-color-dark));
    color: rgb(var(--accent-white));
}
 
::-moz-selection {
    background: rgb(var(--accent-color-dark));
    color: rgb(var(--accent-white));
}
 
/* ----- HEADER & TOP BAR ----- */
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0rem;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 9rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.85;
}
 
#top-bar div.mobile-top-bar>ul>li:hover, #top-bar div.top-bar>ul>li:hover {
    background-color: rgb(var(--accent-color-light));
}
 
#top-bar div.mobile-top-bar>ul>li:hover>a, #top-bar div.top-bar>ul>li:hover >a{
    color: rgb(var(--accent-color-dark));
}
 
#top-bar div.mobile-top-bar>ul>li>a:after, #top-bar div.mobile-top-bar>ul>li>a:before, #top-bar div.top-bar>ul>li>a:after, #top-bar div.top-bar>ul>li>a:before {
    background-color: rgba(var(--accent-color-dark), .5);
}
 
#login-status a {
    color: rgb(var(--accent-color-dark));
}
 
#account-topbutton {
    border: 0.1rem solid transparent;
}
 
#account-topbutton:hover {
    border: 0.1rem solid rgb(var(--accent-color-dark));
}
 
#top-bar div.top-bar>ul>li>ul>li>a:before, #top-bar div.top-bar>ul>li>ul>li>a:hover:before, #top-bar div.top-bar>ul>li>ul>li>ul>li>a:before, #top-bar div.mobile-top-bar>ul>li>ul>li>a:hover {
    background-color: rgb(var(--accent-color-light));
}
 
#top-bar ul li.sfhover a:hover, #top-bar ul li:hover a:hover {
    color: rgb(var(--accent-color-dark));
}
 
/* ----- NO THESE THINGS ----- */
#skrollr-body {
    background-image: none;
}
 
#container {
    background-image: none;
}
 
.avatar-hover {
    display: none !important;
}
 
/* ----- COOL THINGS----- */
.inline-diff ins {
    background-color: #66CC66;
}
 
.inline-diff del {
    background-color: #CC9966;
}
 
hr {
    background: transparent;
    border-top: solid 2px rgba(var(--accent-color-dark));
}
 
.scp-image-block .scp-image-caption {
    color: rgb(var( --accent-white));
    background-color: rgb(var( --accent-color-dark));
}
 
.pager a {
    border-color: rgb(var( --accent-color-dark));
}
 
.pager .current {
    color: rgb(var( --accent-white));
    background-color: rgb(var( --accent-color-dark));
    border-color: rgb(var( --accent-color-medium));
}
 
table.page-history td.optionstd a {
    border-color: rgb(var( --accent-color-dark));
}
 
table.page-history td.optionstd a:hover {
    color: rgb(var( --accent-white));
    background-color: rgb(var( --accent-color-dark));
    border-color: rgb(var( --accent-color-dark));
}
 
.change-textarea-size a {
    color: rgb(var( --accent-white));
}
 
.page-source,
.code {
    color: rgb(var(--black-monochrome));
    background: rgb(var( --accent-color-light));
    border: solid 0.15rem rgb(var( --accent-color-dark));
}
 
table.wiki-content-table th, table.wiki-content-table tr, table.wiki-content-table td {
    border: .0625rem solid rgb(var(--accent-color-dark)) !important;
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--accent-color-medium));
    color: rgb(var(--accent-white));
    transition: background-color 300ms;
}
 
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
    background-color: rgb(var(--accent-color-light));
    color: rgb(var(--accent-color-dark));
}
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
    background-color: rgb(var(--accent-color-dark));
    color: rgb(var(--accent-color-light));
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
    background-color: rgb(var(--accent-color-dark));
    color: rgb(var(--accent-color-light));
}
 
.page-tags span {
    border-top: 2px solid rgb(var(--accent-color-dark));
}
 
.page-tags:before {
    color: rgb(var(--accent-white));
    content: "TAGS";
    font-weight: bold;
    font-size: 85%;
    background: rgb(var(--accent-color-dark));
    padding: 1px 1px 0 1px;
    margin: 0 0 -2px 0;
    display: block;
    width: fit-content;
}
 
/* ----- SIDE BAR ----- */
#side-bar::-webkit-scrollbar {
    display: none;
}
 
#side-bar {
    border-right: 0.15rem solid rgb(var(--accent-color-dark));
}
 
@media only screen and (max-width: 768px) {
    #side-bar {
        border-right: none;
    }
}
 
#side-bar > div:nth-child(1) {
    margin-top: 0;
}
 
#side-bar div.side-block,
#side-bar div.side-block .heading {
    border: none;
}
 
/* ----- FOOTER ----- */
#footer {
    background-color: rgb(var(--accent-color-dark));
    color: rgb(var(--accent-white));
}
 
#footer a {
    color: rgb(var(--accent-white));
}
 
/* ----- DIVS ----- */
blockquote,
div.blockquote {
    --link-color: var(--accent-color-light);
    --visited-link-color: var(--accent-color-light);
    --hover-link-color: var(--accent-color-light);
    border: 2px solid rgb(var(--accent-color-dark));
    background-color: rgb(var(--accent-color-medium));
    color: rgb(var(--accent-white));
}
 
.styled-quote {
    --link-color: var(--accent-color-light);
    --visited-link-color: var(--accent-color-light);
    --hover-link-color: var(--accent-color-light);
    color: rgb(var(--accent-white));
    margin-left: 0px;
}
 
.dark-styled-quote a {
    color: rgb(var(--link-color));
}
 
.darkblock a {
    color: rgb(var(--link-color));
}
 
.dark-styled-quote ,
.darkblock,
.lightblock  {
    margin-left: 0px;
}
 
.dark-styled-quote,
.darkblock {
    --link-color: var(--accent-white);
    --visited-link-color: var(--accent-white);
    --hover-link-color: var(--accent-white);
    color: 
}
 
.dark-styled-quote hr,
.darkblock hr {
    border-color: rgb(var(--accent-color-light));
}
 
/* ----- IETS ----- */
.box {
    background: rgb(var(--accent-white)) !important;
}
 
.box.class-0 {
    --box-border: var(--box-color-0);
    --box-shadow: var(--box-color-0);
}
.box.class-1 {
    --box-border: var(--box-color-1);
    --box-shadow: var(--box-color-1);
}
.box.class-2 {
    --box-border: var(--box-color-2);
    --box-shadow: var(--box-color-2);
}
.box.class-3 {
    --box-border: var(--box-color-3);
    --box-shadow: var(--box-color-3);
}
.box.class-4 {
    --box-border: var(--box-color-4);
    --box-shadow: var(--box-color-4);
}
.box.class-5 {
    --box-border: var(--box-color-5);
    --box-shadow: var(--box-color-5);
}
 
/* ----- CUSTOM DIV ----- */
.bd1 {
    border: rgb(var(--accent-white)) 2px solid;
}
 
.bd2 {
    border: rgb(var(--accent-color-light)) 2px solid;
}
 
.bd3 {
    border: rgb(var(--accent-color-medium)) 2px solid;
}
 
.bd4 {
    border: rgb(var(--accent-color-dark)) 2px solid;
}
 
.bg1 {
    background: rgb(var(--accent-white));
}
 
.bg2 {
    background: rgb(var(--accent-color-light));
}
 
.bg3 {
    background: rgb(var(--accent-color-medium));
}
 
.bg4 {
    background: rgb(var(--accent-color-dark));
}
 
.tx0 {
    color: rgb(var(--black-monochrome));
    --hr-color:var(--black-monochrome);
}
 
.tx1 {
    color: rgb(var(--accent-white));
    --hr-color:var(--accent-white);
}
 
.tx2 {
    color: rgb(var(--accent-color-light));
    --hr-color:var(--accent-color-light);
}
 
.tx3 {
    color: rgb(var(--accent-color-medium));
    --hr-color:var(--accent-color-medium);
}
 
.tx4 {
    color: rgb(var(--accent-color-dark));
    --hr-color:var(--accent-color-dark);
}
 
.a1 {
    --custom-link: var(--accent-white);
}
 
.a2 {
    --custom-link: var(--accent-color-light);
}
 
.a3 {
    --custom-link: var(--accent-color-medium);
}
 
.a4 {
    --custom-link: var(--accent-color-dark);
}
 
.custom {
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0;
}
 
.custom hr {
    border-color: rgb(var(--hr-color));
}
 
.custom a {
    color: rgb(var(--custom-link));
}

+ 版式代码

:root {
   --theme-base: "black-highlighter";
   --theme-id: "grayish-cyan";
   --theme-name: "Grayish-cyan Theme";
 
logo-image: url("http://backrooms-wiki.wikidot.com/local--files/component:theme/logo.svg");
   --header-title: "The Backrooms";
   --header-subtitle: "你曾经来过这里";
 
    --header-font:  'CKTKingKong' , 'Staatliches';
    --title-font:  'CKTKingKong' , 'Staatliches';
   --body-font: 'Noto Serif SC' , 'Noto Serif SC', PT Serif;
   --mono-font: 'Fantasque Sans Mono','等线', monospace;
 
   --white-monochrome: 237, 245, 243;
   --pale-gray-monochrome: 253, 255, 255;
   --light-gray-monochrome: 160, 186, 199;
   --gray-monochrome: 24, 46, 47;
   --black-monochrome: 13, 26, 40;
   --bright-accent: 27, 161, 225;
   --medium-accent: 19, 124, 175;
   --dark-accent: 21, 75, 163;
   --pale-accent: 120, 146, 159;
   --alt-accent: 38, 74, 196;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent),1) 0%,
      rgba(var(--dark-accent), 1) 100%
   );
 
   --swatch-headerh1-color: var(--pale-gray-monochrome);
   --swatch-headerh2-color: var(--pale-gray-monochrome);
   --swatch-topmenu-border-color: var(--black-monochrome);
   --swatch-topmenu-bg-color: var(--black-monochrome);
 
   --link-color: 27, 161, 225;
   --visited-link-color: 19, 124, 175;
   --new-page-color: 21, 75, 163;
   --hover-link-color: 24, 46, 47;
 
   --rating-module-button-color: 21, 75, 187;
   --rating-module-text-color: 21, 75, 187;
 
   --background-gradient-distance: 6rem;
 
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#skrollr-body {
    background-image: none;
}
 
#container {
   background-image: none;
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #215d6c;
}
 
#footer{
   color: rgb(var(--medium-accent));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
#search-top-box-input:hover,
#search-top-box-input:focus {
    background: rgba(var(--medium-accent), .85);
}
 
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > a {
   color: rgb(var(--white-monochrome));
}
 
#top-bar div.top-bar > ul > li > a:hover,
#top-bar div.mobile-top-bar > ul > li > a:hover {
    color: rgb(--pale-gray-monochrome));
}
 
#top-bar div.top-bar > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li:hover > a {
    color: rgb(var(--pale-gray-monochrome));
}
 
#login-status {
    color: rgb(var(--black-monochrome));
}
 
#login-status a {
    color: rgb(var(--black-monochrome));
}
 
#login-status ul a {
    color: rgb(var(--pale-gray-monochrome));
}
 
#account-topbutton {
    color: rgb(var(--black-monochrome));
}
 
table.wiki-content-table th {
background-color: rgb(var(--pale-gray-monochrome)) !important;
color: rgb(var(--black-monochrome));
border-color: rgb(var(--black-monochrome));
}
 
.scp-image-block {
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
blockquote,
div.blockquote {
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.4rem solid rgba(var(--bright-accent),1);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.4rem solid rgba(var(--dark-accent),1);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
.dark-styled-quote hr{
color: rgb(var(--dark-accent));
}
 
.shadeblock {
   background-color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: rgb(var(--black-monochrome));
}
 
.darkerblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,35,76,.25);
}
.darkblock hr {
color: rgb(var(--pale-gray-monochrome));
}
 
.lightblock {
   background-color:rgb(var(--pale-gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,35,76,.25);
   color: rgb(var(--black-monochrome));
}
 
.float-darkerblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.4rem 0.4rem rgba(27,161,225,1);
}
.float-darkblock hr {
color: rgb(var(--pale-gray-monochrome));
}
 
.float-lightblock {
   background-color:rgb(var(--pale-gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.3rem 0.3rem rgba(0,11,12,1);
}
 
.bd-lightblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(var(--black-monochrome));
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--pale-gray-monochrome));
    border: solid 0.3rem rgb(var(--bright-accent));
}
.bd-lightblock hr {
   background-color:rgb(var(--bright-accent))
}
 
.bd-darkerblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(var(--white-monochrome));
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--gray-monochrome));
    border: solid 0.3rem rgb(var(--dark-accent));
}
.bd-darkerblock hr {
   background-color:rgb(var(--dark-accent))
}

+ 展开样式代码

/* BHL Style Search Top Box And User Account */
/* By Mercuresphere */
/* Based on BHL Theme */
 
:root, :root:lang(cn) {
    --merc-light-color: var(--swatch-menutxt-light-color);
    --merc-dark-color: var(--swatch-menubg-dark-color);
 
    --user-account-mask: url("https://fastly.jsdelivr.net/gh/Crimone/crimson-anemone@main/files/user-circle.svg");
    --search-top-box-mask: url("https://fastly.jsdelivr.net/gh/Crimone/crimson-anemone@main/files/search-top-box-mask.svg");
}
 
/* ===用户和搜索栏=== */
@media only screen and (max-width: 768px) {
    #login-status {
        right: unset;
        font-size: unset;
    }
 
    #navi-bar, #navi-bar-shadow, #search-top-box-input {
        display: unset;
    }
 
    #search-top-box-input {
        min-width: unset;
    }
 
    #search-top-box {
        top: unset;
        right: unset;
        height: unset;
    }
 
    #search-top-box:focus-within {
        box-shadow: unset;
        background: unset;
        padding: unset;
    }
 
    #search-top-box:not(:focus-within):before {
        -webkit-mask-size: calc(calc(0.9375rem * 1.8) / 2) calc(calc(0.9375rem * 1.8) / 2);
        -webkit-mask-position: center center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-image: var(--search-top-box-mask);
        z-index: 14;
        background-color: rgb(var(--merc-light-color));
        color: rgb(var(--merc-dark-color));
        text-align: center;
        cursor: pointer;
        mask-image: var(--search-top-box-mask);
        mask-position: center center;
        mask-repeat: no-repeat;
        mask-size: calc(calc(0.9375rem * 1.8) / 2) calc(calc(0.9375rem * 1.8) / 2);
        pointer-events: none;
        position: absolute;
        top: 0;
        right: 0;
        width: calc(0.9375rem * 1.8);
        height: 100%;
        content: " ";
    }
 
    #search-top-box form[id=search-top-box-form] {
        visibility: unset;
        height: unset;
    }
 
    #search-top-box form[id=search-top-box-form]:focus-within {
        visibility: unset;
    }
 
    #search-top-box form[id=search-top-box-form] input {
        -webkit-appearance: unset;
        -moz-appearance: unset;
        position: unset;
        top: unset;
        transform: unset;
        appearance: unset;
        height: unset;
    }
 
    #search-top-box form[id=search-top-box-form] input[type=text] {
        visibility: unset;
        transition: box-shadow .2s cubic-bezier(.4, 0, .2, 1), font-variation-settings .2s cubic-bezier(.4, 0, .2, 1), font-weight .2s cubic-bezier(.4, 0, .2, 1), background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1), right .2s cubic-bezier(.4, 0, .2, 1), width .6s cubic-bezier(.4, 0, .2, 1), padding .6s cubic-bezier(.4, 0, .2, 1), max-width .6s cubic-bezier(.4, 0, .2, 1);
    }
 
    #search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=text] {
        position: unset;
        right: unset;
        transform: unset;
        cursor: unset;
        border-width: unset;
        width: unset;
        height: unset;
        color: unset;
    }
 
    #search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=text]:hover {
        background-color: unset;
    }
 
    #search-top-box form[id=search-top-box-form] input[type=submit] {
        background: none;
        transition: unset;
    }
 
    #search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=submit] {
        opacity: unset;
        margin: unset;
        padding: unset;
        width: unset;
    }
 
    #header h1 a {
        z-index: unset;
    }
}
 
@media only screen and (max-width: 56.25rem) {
    #search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
        background-color: rgba(0, 0, 0, 0);
    }
}
 
@media (min-width: 36rem) {
    #login-status {
        flex-grow: unset;
        left: unset;
        right: unset;
    }
 
    #login-status:not(:hover):not(:focus-within) {
        visibility: hidden;
    }
 
    #login-status::before {
        visibility: visible;
    }
}
 
#search-top-box-input {
    min-width: unset;
    display: inline-block;
}
 
#search-top-box-form input[type=submit], #search-top-box-form input[type=submit]:focus, #search-top-box-form input[type=submit]:hover {
    color: transparent;
}
 
#search-top-box-form input[type=submit]:focus, #search-top-box-form input[type=submit]:hover {
    border: none;
    text-shadow: none;
}
 
#search-top-box-form input[type=submit], #search-top-box-input:focus, #search-top-box-input:hover {
    border: none;
}
 
#search-top-box {
    display: flex;
    z-index: 12;
    position: absolute;
    top: 1.5em;
    right: calc(3% - .25em);
    align-items: center;
    justify-content: center;
    width: auto;
    height: calc(0.9375rem * 1.8);
    transform: translateY(-50%);
    font-size: calc(0.9375rem * .86667);
}
 
#search-top-box, #search-top-box * {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border: none;
    transition: box-shadow .2s cubic-bezier(.4, 0, .2, 1), font-variation-settings .2s cubic-bezier(.4, 0, .2, 1), font-weight .2s cubic-bezier(.4, 0, .2, 1), background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1), right .2s cubic-bezier(.4, 0, .2, 1), width .6s cubic-bezier(.4, 0, .2, 1), padding .6s cubic-bezier(.4, 0, .2, 1), max-width .6s cubic-bezier(.4, 0, .2, 1);
    will-change: box-shadow, font-variation-settings, font-weight, background-color, color, right, width, padding, max-width;
}
 
#search-top-box:focus-within, #search-top-box:focus-within *, #search-top-box:focus-within :after, #search-top-box:focus-within :before {
    margin: 0;
    padding: 0;
    transition: box-shadow .2s cubic-bezier(.4, 0, .2, 1), font-variation-settings .2s cubic-bezier(.4, 0, .2, 1), font-weight .2s cubic-bezier(.4, 0, .2, 1), background-color .15s cubic-bezier(.4, 0, .2, 1), color .15s cubic-bezier(.4, 0, .2, 1), right .2s cubic-bezier(.4, 0, .2, 1), width .3s cubic-bezier(.4, 0, .2, 1), padding .3s cubic-bezier(.4, 0, .2, 1), max-width .3s cubic-bezier(.4, 0, .2, 1);
    will-change: box-shadow, font-variation-settings, font-weight, background-color, color, right, width, padding, max-width;
}
 
#search-top-box:focus-within {
    background: rgba(var(--merc-dark-color), .7);
    box-shadow: calc(calc(0.9375rem * 1.8) / 2 * -1) 0 calc(calc(0.9375rem * 1.8) / 2) rgba(var(--merc-dark-color));
}
 
#search-top-box:after, #search-top-box:before {
    position: absolute;
    top: 0;
    right: 0;
    width: calc(0.9375rem * 1.8);
    height: 100%;
    content: " ";
}
 
#search-top-box:before {
    -webkit-mask-size: calc(calc(0.9375rem * 1.8) / 2) calc(calc(0.9375rem * 1.8) / 2);
    -webkit-mask-position: center center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-image: var(--search-top-box-mask);
    z-index: 14;
    background-color: rgb(var(--merc-light-color));
    color: rgb(var(--merc-dark-color));
    text-align: center;
    cursor: pointer;
    mask-image: var(--search-top-box-mask);
    mask-position: center center;
    mask-repeat: no-repeat;
    mask-size: calc(calc(0.9375rem * 1.8) / 2) calc(calc(0.9375rem * 1.8) / 2);
    pointer-events: none;
}
 
#search-top-box:not(:focus-within):hover:before {
    background-color: rgb(var(--merc-light-color));
}
 
#search-top-box:after {
    --clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path: var(--clip-path);
    z-index: 13;
    clip-path: var(--clip-path);
    pointer-events: none;
    background-color: transparent;
}
 
#search-top-box:not(:focus-within):after {
    --clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    background-color: rgb(var(--merc-light-color), 0);
}
 
#search-top-box form[id=search-top-box-form] {
    display: flex;
    visibility: visible;
    position: relative;
    right: 0;
    max-width: 100%;
    height: calc(0.9375rem * 1.8);
}
 
#search-top-box form[id=search-top-box-form]:not(:focus-within) {
    max-width: calc(0.9375rem * 15);
}
 
#search-top-box form[id=search-top-box-form] input {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    position: relative;
    top: 0;
}
 
#search-top-box form[id=search-top-box-form] input[type=text] {
    z-index: 13;
    position: absolute;
    right: 0;
    width: calc(0.9375rem * 15);
    max-width: calc(0.9375rem * 15);
    height: 100%;
    padding: 0 calc(0.9375rem * 1.8) 0 1em;
    outline: 0 solid rgb(var(--merc-light-color));
    background-color: rgb(var(--merc-dark-color), .7);
    box-shadow: 0 0 0 .125rem rgb(var(--merc-light-color));
    color: rgba(var(--merc-light-color));
}
 
#search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=text] {
    max-width: calc(0.9375rem * 1.8);
    padding: 0;
    outline-width: 0;
    background-color: rgba(var(--merc-dark-color), 0);
    box-shadow: 0 0 0 0 rgb(var(--merc-light-color));
    color: rgba(0, 0, 0, 0);
    cursor: pointer;
}
 
#search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=text]:hover {
    background-color: rgba(var(--merc-dark-color), 1);
}
 
#search-top-box form[id=search-top-box-form] input[type=submit] {
    visibility: visible;
    z-index: 14;
    position: absolute;
    right: 0;
    width: calc(0.9375rem * 1.8);
    height: calc(0.9375rem * 1.8);
    outline: 0 solid rgb(var(--merc-light-color));
    background-color: transparent;
    box-shadow: 0 0 0 .125rem rgb(var(--merc-light-color));
    color: t;
    font-size: calc(0.9375rem * .86667);
    cursor: pointer;
    pointer-events: all;
}
 
#search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=submit] {
    box-shadow: 0 0 0 0 rgb(var(--merc-light-color));
    pointer-events: none;
}
 
#login-status {
    --wght: var(--ui-wght);
    display: flex;
    z-index: 11;
    position: absolute;
    top: 1.5em;
    right: calc(3% + calc(0.9375rem * 1.8) - .25em);
    align-items: center;
    justify-content: center;
    height: 2em;
    margin: 0 0 0 .5em;
    transform: translateY(-50%);
    color: rgb(var(--merc-light-color));
    font-weight: var(--wght);
    font-size: 1em;
    font-family: var(--UI-font);
    white-space: nowrap;
    transition: opacity .2s cubic-bezier(.4, 0, .2, 1);
}
 
#search-top-box:focus-within ~ #login-status {
    opacity: 0;
}
 
#login-status span.printuser a:first-of-type {
    width: 1.75em;
}
 
#login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-create-account, #login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-sign-in {
    margin: 0 1em;
    background-color: rgb(var(--pale-gray-monochrome));
    color: rgb(var(--merc-dark-color));
    padding: 0.1em 1em;
    text-decoration: none;
}
 
#login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-create-account:active, #login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-create-account:hover, #login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-sign-in:active, #login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-sign-in:hover, #login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-create-account:focus-within, #login-status:not(.page-rate-widget-box):not(#search-top-box-form) > a.login-status-sign-in:focus-within {
    background-color: rgba(var(--merc-light-color), 1);
    color: rgb(var(--merc-dark-color));
    text-decoration: none;
}
 
#login-status span.printuser {
    --wght: var(--ui-wght);
    margin-right: .5em;
    color: rgb(var(--merc-light-color));
    font-weight: var(--wght);
}
 
#login-status a#my-account, #login-status a[href*="account/messages"] {
    color: rgb(var(--merc-light-color));
}
 
#login-status a#my-account {
    --wght: var(--ui-wght);
    -webkit-text-decoration: underline rgb(var(--merc-dark-color)) .125em;
    display: flex;
    align-items: center;
    padding: 0 .5em;
    background-color: initial;
    box-shadow: inset 0 0 0 0 rgb(var(--merc-dark-color));
    font-weight: var(--wght);
    text-decoration: underline rgb(var(--merc-dark-color)) .125em;
    transition: box-shadow .2s cubic-bezier(.4, 0, .2, 1), text-decoration .2s cubic-bezier(.4, 0, .2, 1), -webkit-text-decoration .2s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status a#my-account:active, #login-status a#my-account:hover {
    --wght: var(--ui-hvr-wght);
    -webkit-text-decoration: underline rgb(var(--merc-dark-color)) 0;
    box-shadow: inset 0 -2em 0 0 rgb(var(--merc-dark-color));
    color: rgb(var(--merc-light-color));
    font-weight: var(--wght);
    text-decoration: underline rgb(var(--merc-dark-color)) 0;
}
 
#login-status a#my-account:focus-within {
    --wght: var(--ui-hvr-wght);
    -webkit-text-decoration: underline rgb(var(--merc-dark-color)) 0;
    box-shadow: inset 0 -2em 0 0 rgb(var(--merc-dark-color));
    color: rgb(var(--merc-light-color));
    font-weight: var(--wght);
    text-decoration: underline rgb(var(--merc-dark-color)) 0;
}
 
#login-status #account-topbutton {
    --clip-path: polygon(30% 35%, 70% 35%, 50% 60%, 50% 60%);
    -webkit-clip-path: var(--clip-path);
    position: relative;
    width: var(--account-height);
    height: var(--account-height);
    margin: 0;
    padding: 0;
    background-color: rgb(var(--merc-light-color));
    color: transparent;
    clip-path: var(--clip-path);
    transition: -webkit-clip-path .1s cubic-bezier(.4, 0, .2, 1);
    transition: clip-path .1s cubic-bezier(.4, 0, .2, 1), -webkit-clip-path .1s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status #account-options {
    display: block !important;
    z-index: 12;
    position: absolute;
    top: 1.5rem;
    right: 0;
    width: 10em;
    margin: .25em 0 0;
    padding: 0;
    overflow: hidden;
    background-image: var(--gradient-header);
    background-color: rgb(var(--merc-dark-color));
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status #account-options:focus-within, #login-status #account-topbutton:active + #account-options, #login-status #account-topbutton:focus + #account-options {
    opacity: 1;
    pointer-events: all;
}
 
@media (pointer: coarse) {
    #login-status #account-options:hover, #login-status #account-topbutton:hover + #account-options {
        opacity: 1;
        pointer-events: all;
    }
}
 
#login-status #account-options * {
    margin: 0;
    padding: 0;
}
 
#login-status #account-options ul {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 2em;
    flex-grow: 1;
    align-items: center;
    justify-content: center;
    font-size: .85em;
}
 
#login-status #account-options ul li {
    position: relative;
}
 
#login-status #account-options ul li, #login-status #account-options ul li a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
 
#login-status #account-options a {
    --box-shadow: rgba(var(--merc-dark-color));
    --wght: var(--ui-wght);
    position: relative;
    flex-grow: 1;
    height: 100%;
    max-height: 2em;
    padding: 0 .25em;
    box-shadow: inset 0 0 0 .0625rem var(--merc-dark-color);
    font-weight: var(--wght);
    transition: color .15s cubic-bezier(.4, 0, .2, 1), font-weight .15s cubic-bezier(.4, 0, .2, 1), font-variation-settings .15s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status #account-options li > a, #login-status #account-options li > a:visited {
    color: rgb(var(--merc-light-color));
}
 
#login-status #account-options li > a:active, #login-status #account-options li > a:hover {
    --wght: var(--ui-hvr-wght);
    color: rgb(var(--merc-dark-color));
    font-weight: var(--wght);
    text-decoration: none;
}
 
#login-status #account-options li > a:focus-within {
    --wght: var(--ui-hvr-wght);
    color: rgb(var(--merc-dark-color));
    font-weight: var(--wght);
    text-decoration: none;
}
 
#login-status #account-options li > a[href*="/messages"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    min-height: 100%;
    font-size: 0;
}
 
#login-status #account-options li > a[href*="/messages"]:after {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    content: "信息";
    font-size: calc(0.9375rem * .765);
    pointer-events: none;
}
 
#login-status #account-options li > a:before {
    --clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);
    -webkit-clip-path: var(--clip-path);
    z-index: -1;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgb(var(--merc-light-color));
    content: " ";
    clip-path: var(--clip-path);
    pointer-events: none;
    transition: -webkit-clip-path .2s cubic-bezier(.4, 0, .2, 1);
    transition: clip-path .2s cubic-bezier(.4, 0, .2, 1), -webkit-clip-path .2s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status #account-options li > a:active:before, #login-status #account-options li > a:hover:before {
    --clip-path: polygon(-15% 0, 115% 0, 100% 100%, 0 100%);
}
 
#login-status #account-options li > a:focus-within:before {
    --clip-path: polygon(-15% 0, 115% 0, 100% 100%, 0 100%);
}
 
/* ===默认收起用户信息栏和搜索栏=== */
#search-top-box {
    top: 23px;
    right: calc(3%);
}
 
#login-status {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    top: 24px;
    right: calc(3% + calc(0.9375rem * 1.8) + .25em);
    color: transparent;
    pointer-events: none;
    transition: color .2s cubic-bezier(.4, 0, .2, 1);
    user-select: none;
}
 
@media only screen and (min-width: 980px) {
    #search-top-box {
        right: calc(3% + (-100vw + var(--header-width-on-desktop, 61.25rem)) / 2);
    }
 
    #login-status {
        right: calc(3% + calc(0.9375rem * 1.8) + .25em + (-100vw + var(--header-width-on-desktop, 61.25rem)) / 2);
    }
}
 
#login-status:active, #login-status:hover {
    -webkit-user-select: initial;
    -moz-user-select: initial;
    -ms-user-select: initial;
    color: rgb(var(--merc-light-color));
    pointer-events: all;
    user-select: auto;
}
 
#login-status:focus-within {
    -webkit-user-select: initial;
    -moz-user-select: initial;
    -ms-user-select: initial;
    color: rgb(var(--merc-light-color));
    pointer-events: all;
    user-select: auto;
}
 
#login-status:active #account-options, #login-status:hover #account-options {
    pointer-events: all;
}
 
#login-status:focus-within #account-options {
    pointer-events: all;
}
 
#login-status > :not(#account-topbutton):not([href*="account/messages"]) {
    --clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    -webkit-clip-path: var(--clip-path);
    clip-path: var(--clip-path);
    opacity: 0;
    transition: box-shadow .2s cubic-bezier(.4, 0, .2, 1), text-decoration .2s cubic-bezier(.4, 0, .2, 1), color .2s cubic-bezier(.4, 0, .2, 1), clip-path .2s cubic-bezier(.4, 0, .2, 1), opacity .2s cubic-bezier(.4, 0, .2, 1), -webkit-text-decoration .2s cubic-bezier(.4, 0, .2, 1), -webkit-clip-path .2s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status:active > :not(#account-topbutton):not([href*="account/messages"]), #login-status:hover > :not(#account-topbutton):not([href*="account/messages"]) {
    --clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path: var(--clip-path);
    clip-path: var(--clip-path);
    opacity: 1;
}
 
#login-status:focus-within > :not(#account-topbutton):not([href*="account/messages"]) {
    --clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path: var(--clip-path);
    clip-path: var(--clip-path);
    opacity: 1;
}
 
#login-status #account-topbutton {
    margin-left: 0;
    background-color: initial;
    pointer-events: all;
    transition: clip-path .15s cubic-bezier(.4, 0, .2, 1), background-color .15s cubic-bezier(.4, 0, .2, 1), -webkit-clip-path .15s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status:hover #account-topbutton {
    background-color: rgb(var(--merc-light-color));
}
 
#login-status:before {
    -webkit-mask-image: var(--user-account-mask);
    -webkit-mask-size: calc(calc(0.9375rem * 1.8) - .5em);
    -webkit-mask-position: center right;
    -webkit-mask-repeat: no-repeat;
    z-index: 2;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(var(--merc-light-color), 1);
    content: "";
    cursor: pointer;
    mask-image: var(--user-account-mask);
    mask-position: center right;
    mask-repeat: no-repeat;
    mask-size: calc(calc(0.9375rem * 1.8) - .5em);
    pointer-events: all;
    transition: background-color .15s cubic-bezier(.4, 0, .2, 1);
}
 
#login-status:hover:before {
    background-color: rgba(var(--search-icon-hover-color), 1);
}
 
#login-status:active:after, #login-status:active:before, #login-status:hover:after, #login-status:hover:before {
    background-color: rgba(var(--search-icon-hover-bg-color), 0);
    cursor: auto;
    pointer-events: none;
}
 
#login-status:focus-within:after, #login-status:focus-within:before {
    background-color: rgba(var(--search-icon-hover-bg-color), 0);
    cursor: auto;
    pointer-events: none;
}
 
#login-status #account-topbutton {
    --clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    -webkit-clip-path: var(--clip-path);
    background-color: rgba(var(--merc-light-color), 0);
    clip-path: var(--clip-path);
}
 
#login-status:active #account-topbutton, #login-status:hover #account-topbutton {
    --clip-path: polygon(30% 35%, 70% 35%, 50% 60%, 50% 60%);
    -webkit-clip-path: var(--clip-path);
    background-color: rgb(var(--merc-light-color));
    clip-path: var(--clip-path);
}
 
#login-status:focus-within #account-topbutton {
    --clip-path: polygon(30% 35%, 70% 35%, 50% 60%, 50% 60%);
    -webkit-clip-path: var(--clip-path);
    background-color: rgb(var(--merc-light-color));
    clip-path: var(--clip-path);
}
 
#login-status #account-options {
    margin: 0;
}
 
#login-status a[href*="account/messages"] {
    color: rgb(var(--merc-light-color));
    pointer-events: all;
}
 
#account-topbutton {
    border: none;
}
 
#account-options {
    border: none;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@900&display=swap');
@import url('https://backrooms-wiki-cn.wikidot.com/local--files/theme:golden-age/back.css');
:root {
--logo-image: url("");
--header-title: "The Backrooms";
--header-subtitle: "你曾经来过这里";
--body-font: 'Noto Sans', sans-serif;
--header-font: 'Noto Sans SC';
--title-font: 'Noto Sans SC';
--mono-font: 'Noto Serif SC';
--white-monochrome:  0,0,0;
--pale-gray-monochrome: 0,0,0;
--light-gray-monochrome: 252,232,2;
--gray-monochrome:252,232,2;
--black-monochrome:255,255,255;
--bright-accent: 252,232,2;
--medium-accent: 214,206,2;
--dark-accent: 252,232,2;
--pale-accent: 252,232,2;
--link-color: 252,232,2;
--visited-link-color: 252,232,2;
--hover-link-color: 252,232,2;
--newpage-color: 214,206,2;
--background-gradient-distance: 30rem;
--background-gradient-color: 200,200,200;
 
--sd-border: 252,232,2;
--sd-fill: 20, 22, 24;
}
 
#header, #top-bar {
   color:#ffffff;
}
 
hr {
width: auto;
margin: auto;
position: relative;
height: 2.5px;
background-color: none;
pointer-events: none;
overflow: hidden;
border: initial;
-webkit-clip-path: polygon(50% 10%, 100% 50%, 50% 90%, 0% 50%);
clip-path: polygon(50% 10%, 100% 50%, 50% 90%, 0% 50%);
}
 
hr:before {
content: " ";
width: 100%;
height: 100%;
position: absolute;
background-attachment: fixed;
background-color: #fce703;
background-repeat: repeat;
background-position: center;
background-size: auto;
}
 
#header h1 a::before {
color: #ffffff;
}
 
#header h2 span:before {
color: #ffffff;
background-clip: text;
-webkit-background-clip: text;
width: 100%;
height: 100%;
background-attachment: fixed;
}
 
#header h2 span {
font-size: 1.5em;
top: 1em;
font-family: "Noto Sans SC";
}
 
#container {
   background: none;
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    color:rgb(255,255,255);
}
 
th {
background-color: rgb(var(--medium-accent)) !important;
}
 
.top-box:before {
    background: url("") !important;
}
 
.header-diamond .diamond-pattern {
    background: url("") !important;
}
 
.scp-image-block {
    border: 0.2rem solid rgba(var(--pale-accent));
}
 
.scp-image-block .scp-image-caption {
    color: rgb(255,255,255);
    background-color: rgb(0,0,0);
    border-top: 0.2rem solid rgba(var(--pale-accent));
    margin-top: 0.3rem;
}
 
.page-rate-widget-box {
    background: none;
    border: 0.2rem solid rgba(var(--pale-accent));
    background-color: rgb(0,0,0);
}
 
table.wiki-content-table th,
table.wiki-content-table td {
   border: solid 1px rgb(var(--pale-accent));
}
 
.code{
   background-color: white;
   border: solid 2px rgb(var(--pale-accent));
}
 
.lightblock {
background-color:rgb(0,0,0);
   border: solid 2px rgb(var(--pale-accent));
}
 
.styled-quote {
background-color:rgb(0,0,0);
   border: solid 2px rgb(var(--pale-accent));
border-left: 0.5rem solid rgba(var(--pale-accent));
}
 
.dark-styled-quote {
border-left: 0.5rem solid rgba(40,40,40);
}
 
.titleblock {
background-color: rgb(var(--pale-gray-monochrome));
padding: 0.5rem 1rem 0.10rem;
margin: 1.5rem 0rem 0.5rem 0rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
border: solid rgb(var(--medium-accent)) 0.1rem;
}
 
.titlebox {
color: rgb(var(--white-monochrome));
position: relative;
top: -1.6rem;
background-color: rgb(var(--medium-accent));
padding: 0.25rem 1rem;
line-height: 0.1rem;
}
 
.dark-titleblock {
background-color: rgb(var(--gray-monochrome));
color:rgb(var(--white-monochrome));
padding: 0.5rem 1rem 0.10rem;
margin: 1.5rem 0rem 0.5rem 0rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
border: solid rgb(var(--medium-accent)) 0.1rem;
}
 
.dark-titlebox {
color: rgb(0,0,0);
position: relative;
top: -1.6rem;
background-color: rgb(var(--medium-accent));
padding: 0.25rem 1rem;
line-height: 0.1rem;
}
 
blockquote{
color: white !important;
}
 
.blockquote{
color: white !important;
}
 
.dark-styled-quote a, .dark-titleblock a, .darkblock a, .titlebox a, .dark-titlebox a{
color: rgb(70,70,70);
}
 
.top-box {
   border-color: rgb(var(--sd-border)) !important;
}
 
.bottom-box ul li {
   color: rgb(var(--sd-border)) !important;
}
 
.bottom-box ul li:before {
   background: rgb(var(--sd-border)) !important;
}
 
.top-box .gradient-box {
  background: linear-gradient(90deg, rgba(var(--sd-border),1) 0%, rgba(var(--sd-border),0) 36%) !important;
}
 
.header-diamond {
   background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 300.9 284.5' style='enable-background:new 0 0 300.9 284.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23fce802;%7D .st1%7Bfill:%23fce802;%7D%0A%3C/style%3E%3Cg%3E%3Cpolygon class='st1' points='73.4,32.6 0,105.4 13.6,105.4 86.4,32.6 '/%3E%3Cpolygon class='st1' points='26.5,105.4 40.1,105.4 112.9,32.6 99.3,32.6 '/%3E%3C/g%3E%3Cpolyline class='st1' points='287.3,105.4 214.5,32.6 227.5,32.6 287.3,91.9 '/%3E%3Cpolygon class='st1' points='274.4,105.4 260.8,105.4 188,32.6 201.6,32.6 '/%3E%3C/svg%3E") !important;
}
 
.top-box.class-unknown .header-diamond { filter: none !important; }
.top-box.class-unknown:before, .top-box.class-unknown .header-diamond .diamond-pattern{ opacity: 0.15 !important; }
 
.top-box .header-diamond .diamond-image {
   filter: brightness(0%) invert(100%);
}
 
.top-box.class-0 {
   background: rgb(var(--sd-fill)) !important;
}
 
.header-diamond .diamond-color.class-0 {
   background: rgb(var(--sd-fill)) !important;
}
 
.top-box.class-1, .top-box.class-2 {
   background: rgb(var(--sd-fill)) !important;
}
 
.header-diamond .diamond-color.class-1,
.header-diamond .diamond-color.class-2 {
   background: rgb(var(--sd-fill)) !important;
}
 
.top-box.class-3, .top-box.class-4 {
   background: rgb(var(--sd-fill)) !important;
}
 
.header-diamond .diamond-color.class-3,
.header-diamond .diamond-color.class-4 {
   background: rgb(var(--sd-fill)) !important;
}
 
.top-box.class-5, .top-box.class-unknown {
   background: rgb(var(--sd-fill)) !important;
}
 
.header-diamond .diamond-color.class-5,
.header-diamond .diamond-color.class-unknown {
   background: rgb(var(--sd-fill)) !important;
}
 
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > a {
    color: rgb(225, 225, 225);
}
 
#top-bar div.top-bar > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li:hover > a {
    color: rgb(225, 225, 225);
}
 
#top-bar div.top-bar > ul > li > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li > ul > li:hover > a {
    color: black;
}
 
#top-bar div.top-bar > ul > li > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a {
    color: rgb(225, 225, 225);
}
 
#account-options > ul > li > a {
color: black;
}
@media only screen and (max-width: 510px) {
 
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > a {
    color: black;
}
 
#top-bar div.top-bar > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li:hover > a {
    color: white;
}
 
#top-bar div.top-bar > ul > li > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li > ul > li:hover > a {
    color: white;
}
 
#top-bar div.top-bar > ul > li > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a {
    color: rgb(225, 225, 225);
}
 
}
 
@media only screen and (max-width: 768px) {
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > a {
   color: #000;
}
 
#top-bar div.top-bar > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li:hover > a {
    color: #000;
}
 
#top-bar div.top-bar > ul > li > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li > ul > li:hover > a {
   color: #000;
}
}
 
.license-area{
color: #fff!important;
}
 
.license-area a{
color: #fff;
}
 
.license-area a:hover{
color: rgb(252,232,2);
}

+ 版式代码

:root {
 --theme-base: "black-highlighter";
    --theme-id: "speednoclippers";
    --theme-name: "SpeedNoclippers Theme";
 
    /* Header */
    --logo-image: url("http://backroomssandboxcn.wikidot.com/local--files/collab:theme:speednoclippers/speednoclippers.svg");
       --header-title: "速切玩家";
       --header-subtitle: "只为更快，只为通关";
 
  /* 标准色 */
    --white-monochrome: 248, 248, 255;
    /* 白色 */
    --very-light-gray-monochrome: 56, 116, 248;
    /* 次强调色（应用于杂项） */
    --light-gray-monochrome: 135, 170, 230;
    --pale-gray-monochrome: 255, 255, 255;
    /* 次强调色（登录时） */
    --gray-monochrome: 84, 144, 248;
    --bright-accent: 84, 144, 248;
    /* 灰色 */
    --black-monochrome: 0, 53, 145;
    /* 黑色 */
    --medium-accent: 31, 111, 247;
    /* 蓝色*/
    --dark-accent: 0, 53, 145;
    /* 深蓝色 */
    --dark-gray-monochrome: 70,130,180;
 
/* 评分模块颜色 */
   --rating-module-button-plus-color: var(--black-monochrome);
   --rating-module-button-negative-color: var(--dark-accent);
   --rating-module-button-cancel-color: var(--black-monochrome);
   --rating-module-button-credit-color: var(--black-monochrome);
 
/* 链接颜色 */
   --link-color: 0, 81, 255;
   --hover-link-color: 46, 172, 254;
   --visited-link-color: 70,130,180;
   --newpage-color: 156,56,156;
 
    /* 背景与网站标题色 */
    --background-gradient-color: var(--light-gray-monochrome);
    --header-gradient-color-bottom: var(--medium-accent);
    --header-gradient-color-middle: var(--black-monochrome);
    --header-gradient-color-top: var(--black-monochrome);
 
    /* 主要主题色 */
    --swatch-background: var(--light-gray-blacmonochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--dark-accent);
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   background-image: var(--logo-image);
   opacity: 1;
}
 
body{
    background-color: rgb(237,237,255);
}
 
#skrollr-body {
  background-image: none;
}
 
/* 图片块 */
.scp-image-block {
    border: none;
}
 
.scp-image-block .scp-image-caption {
    color: rgb(var(--white-monochrome));
    background-color: rgb(var(--dark-accent));
}
 
/*评分块*/
 
.page-rate-widget-box {
    background-color:rgb(var(--white-monochrome));
    border: 0.2rem solid rgba(var(--black-monochrome));
}
 
/* TABVIEW */
 
.yui-navset .yui-content {
   background-color:rgba(var( --light-gray-monochrome), .25);
     border-color: rgba(var(--dark-accent), 1);
}
 
.yui-nav {
     border-color: rgba(var(--dark-accent), 1);
}
 
/*未选择的tab*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
     background-color: rgba(var(--light-gray-monochrome), .25);
    color:rgb(var(--black-monochrome));
}
 
/*鼠标移上去的tab*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
     background-color: rgba(var(--gray-monochrome));
}
 
/*选了的tab*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
     background-color: rgba(var(--dark-accent), 1);
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
     background-color: rgba(var(--dark-accent), 1);
}
 
/* 标准引用块 */
blockquote, div.blockquote {
    border: 1px dashed;
    background-color: rgba(135,170,230,.25);
    background-opacity: 0.4
}
 
/* 代码块 */
.code {
    border: 1px solid;
    background-color: rgba(135,170,230,.25);
}
 
/*标题块/暗色标题块(block是标题，box是正文)*/
.titleblock {
   background-color: rgb(var(--white-monochrome));;
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--dark-accent)) 2px;
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--dark-accent));
  color: rgb(255,255,255);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.dark-titleblock {
   background-color: rgb(var(--dark-accent));
   color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(255,255,255) 2px;
}
 
.dark-titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--white-monochrome));
  color: rgb(0,0,0);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
/*各种装饰块*/
 
.darkblock a{
   color: #bbbbbb;
}
 
.styled-quote {
   background-color:rgb(var(--white-monochrome));;
   border-left: 0.5rem solid rgba(var(--dark-accent));
}
 
.darkblock {
   background-color:rgb(var(--dark-accent));
}
 
.dark-styled-quote {
   background-color:rgb(var(--dark-accent));
   border-left: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
}
 
.dark-styled-quote a{
   color: #bbbbbb;
}
 
.styled-quote-d {
   background-color:rgb(var(--white-monochrome));
   border-left: 0.5rem solid rgba(var(--dark-accent));
   border-right: 0.5rem solid rgba(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote-d {
   background-color:rgb(var(--dark-accent));
   border-left: 0.5rem solid rgb(var(--white-monochrome));
   border-right: 0.5rem solid rgb(var(--white-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote-d a{
   color: #bbbbbb;
}
 
.borderblock{
    background-color:rgb(var(--white-monochrome));
    border: 0.25rem solid rgba(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-borderblock{
   background-color:rgb(var(--dark-accent));
   border: 0.25rem solid rgb(var(--white-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-borderblock a{
   color: #bbbbbb;
}
 
/*有logo或者别的什么图片的块*/
 
.logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
    }
 
.logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backroomssandboxcn.wikidot.com/local--files/collab:theme:speednoclippers/speednoclippers.svg) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
.border-logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
     border: solid 0.3rem rgb(var(--dark-accent));
    }
 
.border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backroomssandboxcn.wikidot.com/local--files/collab:theme:speednoclippers/speednoclippers.svg) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
.noclipblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
    }
 
.noclipblock::after{
    content: "";
    border: solid 2px #0000;
    background: url(http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipb) left no-repeat;
background-position: left;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
.noclipblock-r{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
    }
 
.noclipblock-r::after{
    content: "";
    float: left;
    border: solid 2px #0000;
    background: url(http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipb) right no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
.dark-noclipblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--black-monochrome));
    color:rgb(var(--white-monochrome));
    }
 
.dark-noclipblock::after{
    content: "";
    float: left;
    border: solid 2px #0000;
    background: url(http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipw) left no-repeat;
    opacity: 0.5;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
.dark-noclipblock-r{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--black-monochrome));
    color:rgb(var(--white-monochrome));
    }
 
.dark-noclipblock-r::after{
    content: "";
    float: left;
    border: solid 2px #0000;
    background: url(http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipw) right no-repeat;
    opacity: 0.5;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    pointer-events: none;
}
 
/*奇奇怪怪的阴影块*/
.shadowblock{
        padding: 0.01rem 1rem;
    box-shadow: 0.5rem 0.5rem rgb(0,53,145);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgba(135,170,230,.4);
    }
 
.inset-shadowblock{
        padding: 0.01rem 1rem;
    box-shadow: inset 5em 1em rgba(31,111,247,.25), inset 8em 2em rgba(84,144,248,.25), 0.1rem 0.2rem 0.2rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
     border: solid 0.3rem rgb(var(--dark-accent));
    }
 
/*sd模块*/
.top-box.class-unknown .header-diamond { filter: none !important; }
 
.top-box.class-unknown:before, .top-box.class-unknown .header-diamond .diamond-pattern{ opacity: 0.15 !important; }
 
.bottom-box ul li {
   color: rgb(var(--black-monochrome)) !important;
}
 
.bottom-box ul li:before {
   background: rgb(var(--black-monochrome)) !important;
}
 
.top-box .header-diamond .diamond-image {
   filter: brightness(0%) invert(100%);
}
 
.top-box {
   border-color: rgb(0,53,145) !important;
}
 
.top-box .gradient-box {
  background: linear-gradient(90deg, rgba(0,53,145,1) 0%, rgba(0,53,145,0) 36%) !important;
}
 
.top-box .header-diamond .diamond-image {
  -webkit-mask: none !important;
  mask: none !important;
}
 
.header-diamond,
.header-diamond::after {
   background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 300.9 284.5' style='enable-background:new 0 0 300.9 284.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23003591;%7D .st1%7Bfill:%23003591;%7D%0A%3C/style%3E%3Cg%3E%3Cpolygon class='st1' points='73.4,32.6 0,105.4 13.6,105.4 86.4,32.6 '/%3E%3Cpolygon class='st1' points='26.5,105.4 40.1,105.4 112.9,32.6 99.3,32.6 '/%3E%3C/g%3E%3Cpolyline class='st1' points='287.3,105.4 214.5,32.6 227.5,32.6 287.3,91.9 '/%3E%3Cpolygon class='st1' points='274.4,105.4 260.8,105.4 188,32.6 201.6,32.6 '/%3E%3C/svg%3E") !important;
}
 
.top-box:before {
    background: url("") !important;
}
 
.header-diamond .diamond-pattern {
    background: url("") !important;
}
 
.top-box.class-0 {
   background: #3874f8 !important;
}
 
.top-box.class-0 .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sd0") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-0 {
   background: #3874f8 !important;
}
 
.top-box.class-1, .top-box.class-2 {
   background: #3874f8 !important;
}
 
.top-box.class-1 .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sd1") center/78% no-repeat !important;
}
 
.top-box.class-2 .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sd2") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-1,
.header-diamond .diamond-color.class-2 {
   background: #3874f8 !important;
}
 
.top-box.class-3, .header-diamond .diamond-color.class-3 {
   background: rgb(70,130,180) !important;
}
 
.top-box.class-3 .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sd3") center/78% no-repeat !important;
}
 
.top-box.class-4 .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sd4") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-3, {
   background: rgb(70,130,180) !important;
}
 
.top-box.class-4, .top-box.class-5, .header-diamond .diamond-color.class-4,
.header-diamond .diamond-color.class-5 {
   background: #0047c3 !important;
}
 
.top-box.class-5 .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sd5") center/78% no-repeat !important;
}
 
.top-box.class-unknown {
   background: #bbbbbb !important;
}
 
.header-diamond .diamond-color.class-unknown {
   background: #bbbbbb !important;
}
 
.top-box.class-unknown .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sd%3F") center/78% no-repeat !important;
}
 
.top-box.class-n\/a .header-diamond:after {
   filter: none !important;
}
 
.top-box.class-n\/a {
   background: #bbbbbb !important;
}
 
.header-diamond .diamond-color.class-n\/a {
   background: #bbbbbb !important;
}
 
.top-box.class-n\/a .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sdna") center/78% no-repeat !important;
}
 
.top-box.class-habitable {
   background: #33ff55 !important;
}
 
.header-diamond .diamond-color.class-habitable {
   background: #33ff55 !important;
}
 
.top-box.class-habitable .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sdh") center/78% no-repeat !important;
}
 
.top-box.class-deadzone {
   background: #ff3433 !important;
}
 
.header-diamond .diamond-color.class-deadzone {
   background: #ff3433 !important;
}
 
.top-box.class-deadzone .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sddz") center/78% no-repeat !important;
}
 
.top-box.class-pending {
   background: #bbbbbb !important;
}
 
.header-diamond .diamond-color.class-pending {
   background: #bbbbbb !important;
}
 
.top-box.class-pending .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sdpd") center/78% no-repeat !important;
}
 
.top-box.class-amended .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sdam") center/78% no-repeat !important;
}
 
.top-box.class-omega .header-diamond .diamond-image {
    background: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/sdom") center/105% no-repeat !important;
}

+ 版式代码

/*
@import url(https://cdn.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-DottedSongtiSquare.css);
@import url(https://cdn.jsdelivr.net/gh/hoah2333/Fonts@main/Typeface-zcoolwenyiti.css);
*/
 
@import url('https://fonts.googleapis.com/css2?family=Play&display=swap');
 
@font-face {
    font-family: 'Dotted Songti Square';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/DottedSongtiSquareRegular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
@font-face {
    font-family: '仓耳渔阳体W03';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/仓耳渔阳体W03.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
@font-face {
    font-family: '仓耳渔阳体W04';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/仓耳渔阳体W03.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
:root {
   --fade-in-delay: 0.1s;
 
   --theme-base: "black-highlighter";
   --theme-id: "e-p-b-dark";
   --theme-name: "EPBDark";
 
   --logo-image: url("http://zampona.wikidot.com/local--files/main/E.P.B.NEW%28SVG%29.svg");
   --header-title: "E.P.B.™️";
   --header-subtitle: "见微知著。";
 
   --body-font: 'Play', '仓耳渔阳体W03', 'Noto Sans SC', sans-serif;
   --header-font: 'Dotted Songti Square', 'Noto Sans SC', sans-serif;
   --title-font: 'Dotted Songti Square', 'Noto Sans SC', sans-serif;
   --mono-font: 'Play', '仓耳渔阳体W03', 'Noto Sans SC', sans-serif;
 
   --white-monochrome: 255, 255, 255;
   --pale-gray-monochrome: 190, 190, 190;
   --light-gray-monochrome: 160, 160, 160;
   --gray-monochrome: 72, 69, 60;
   --black-monochrome: 10, 10, 10;
   --bright-accent: 0, 192, 255;
   --medium-accent: 0, 128, 255;
   --dark-accent: 140, 136, 126;
   --pale-accent: 140, 136, 126;
   --custom-text: 0, 128, 255;
 
     /* Primary Theme Colors */
    --swatch-background: var(--black-monochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--black-monochrome);
 
    /* Primary Text Colors */
    --swatch-text-dark: var(--custom-text);
    --swatch-text-light: var(--bright-accent);
    --swatch-important-text: var(--bright-accent);
    --barColour: var(--very-light-gray-monochrome);
    --linkColour: var(--pale-accent);
 
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--black-monochrome);
    --swatch-menubg-light-color: var(--dark-gray-monochrome);
    --swatch-menubg-medium-color: var(--medium-accent);
    --swatch-menubg-medium-dark-color: var(--gray-monochrome);
    --swatch-menubg-dark-color: var(--dark-gray-monochrome);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--black-monochrome);
    --swatch-menutxt-dark-color: var(--white-monochrome);
    --swatch-menutxt-light-color: var(--white-monochrome);
    --swatch-border-color: var(--bright-accent);
 
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
    --swatch-topmenu-border-color: var(--bright-accent);
    --swatch-topmenu-bg-color: var(--black-monochrome);
 
    /* Link Colors */
    --link-color: var(--bright-accent);
    --visited-link-color: 195, 115, 240;
    --hover-link-color: var(--bright-accent);
    --sidebar-links-text: var(--swatch-menutxt-dark-color);
    --link-color-bright: var(--medium-accent);
 
/* Rating Module Colors */
    --rating-module-button-color: var(--bright-accent);
    --rating-module-text-color: var(--white-monochrome);
    --rating-module-text-hover-color: var(--swatch-menutxt-light-color);
 
/* Header Gradients */
--gradient-header: none;
--diagonal-stripes: none;
}
 
#extrac-div-1 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background: repeating-linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.15) 50%,rgba(0,0,0,0));
    background-size: auto 8px;
    opacity: 0.7;
}
 
#extrac-div-2 {
    position: fixed;
    width: 100vw;
    height : 1rem;
    top: 0;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(0,128,255,0) 0%,rgba(0,128,255,1) 50%,rgba(0,128,255,0.98) 51%,rgba(0,128,255,0) 100%);
    opacity : .1;
    animation: scanm 6s linear infinite;
}
@keyframes scanm {
  0%   { top: -1rem; opacity : .05;}
  25% { top: 50%; opacity: .03;}
  37.5% { top: 75%; opacity: 0.06;}
  50% { top: 100%; opacity: .03;}
  100% { top: 100%;}
}
 
#extrac-div-3 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background-image: radial-gradient(circle, rgb(0,0,0) 0%, rgb(0,64,128) 60%, rgb(0,128,255) 100%);
    opacity: 0.25;
    mix-blend-mode: color-dodge;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 30;
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--black-monochrome)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.lightstyled-quote {
   background-color:rgb(var(--bright-accent));
color:rgb(0, 0, 0);
   border-left: 0.5rem solid rgba(var(--dark-gray-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.darkstyled-quote {
   background-color:rgb(var(--dark-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--bright-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.darkstyled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--bright-accent));
color:rgb(0, 0, 0);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--dark-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-borderblock {
    background-color:rgb(var(--dark-gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
 .light-borderblock {
    background-color:rgb(var(--bright-accent));
    color:rgb(0, 0, 0);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--dark-gray-monochrome));
 }
 .border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-gray-monochrome));
     border: solid 0.3rem rgb(var(--bright-accent));
    }
 
    .border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://zampona.wikidot.com/local--files/main/E.P.B.NEW%28SVG%29.svg) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
 
    pointer-events: none;
    }
 
    .logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-gray-monochrome));
    }
 
    .logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://zampona.wikidot.com/local--files/main/E.P.B.NEW%28SVG%29.svg) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
 
    pointer-events: none;
    }
 
.titleblock {
        background-color: rgb(var(--dark-gray-monochrome));
        color:rgb(var(--white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--dark-gray-monochrome));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.borderblock {
    background-color:rgb(var(--dark-gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.violet-borderblock {
    background-color:rgb(var(--dark-gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(195, 115, 240);
 }
 
.violet-styled-quote {
   background-color:rgb(var(--dark-gray-monochrome));
   border-left: 0.5rem solid rgba(195, 115, 240);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.violetblock {
   background-color:rgb(195, 115, 240);
color:rgb(0, 0, 0);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
 .violet-border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-gray-monochrome));
     border: solid 0.3rem rgb(195, 115, 240);
    }
 
    .violet-border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://zampona.wikidot.com/local--files/main/E.P.B.NEW%28SVG%29.svg) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
 
    pointer-events: none;
    }
 
.green-borderblock {
    background-color:rgb(var(--dark-gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(0, 255, 100);
 }
 
.green-styled-quote {
   background-color:rgb(var(--dark-gray-monochrome));
   border-left: 0.5rem solid rgba(0, 255, 100);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.greenblock {
   background-color:rgb(0, 255, 100);
color:rgb(0, 0, 0);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
 .green-border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-gray-monochrome));
     border: solid 0.3rem rgb(0, 255, 100);
    }
 
    .green-border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://zampona.wikidot.com/local--files/main/E.P.B.NEW%28SVG%29.svg) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
 
    pointer-events: none;
    }
 
}

+ 版式代码

@import url(https://backrooms-wiki-cn.wdfiles.com/local--code/theme%3Aliminal/1);
@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
:root {
    --logo-image: url("https://img1.imgtp.com/2022/07/25/5zGqTnsW.svg");
    --header-title: "B.Q.I.";
    --header-subtitle: "为品质精准至针头线脑";
   /* 字体 */
   --body-font: punctuation-marks, Huiwen-mincho, sans-serif;
   --header-font: 'CKTKingKong', sans-serif;
   --title-font: 'CKTKingKong', sans-serif;
   --mono-font: 'Fantasque Sans Mono', monospace;
    /* 标准色 */
    --white-monochrome: 255, 255, 255;
    /* 白色 */
    --very-light-gray-monochrome: 255, 255, 255;
    /* 次强调色（应用于杂项） */
    --light-gray-monochrome: 81, 107, 252;
    /* 次强调色（登录时） */
    --gray-monochrome: 81, 107, 221;
    /* 蓝灰色 */
    --black-monochrome: 0, 0, 0;
    /* 黑色 */
    --medium-accent: 81, 107, 252;
    /* 蓝色*/
    --dark-accent: 81, 107, 252;
    /* 蓝棕色 */
 
    /* 背景与网站标题色 */
    --background-gradient-color: var(--very-light-gray-monochrome);
    --header-gradient-color-bottom: var(--medium-accent);
    --header-gradient-color-middle: var(--black-monochrome);
    --header-gradient-color-top: var(--black-monochrome);
 
    /* 主要主题色 */
    --swatch-background: var(--light-gray-blacmonochrome);
    --swatch-primary: var(--white-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--dark-accent);
 
    --link-color: var(--medium-accent);
    --visited-link-color: var(--medium-accent);
    --hover-link-color: var(--medium-accent);
    --newpage-color: var(--medium-accent);
 
    --gradient-header: repeating-linear-gradient(
      -30deg,
      rgba(var(--medium-accent), 0.8),
      rgba(var(--gray-monochrome), 1) 50px
    );
}
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
body::after {
    content: "";
    background-image: url("https://img1.imgtp.com/2022/07/25/BmUdsXUz.svg");
    background-size: 100% 100%;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.1;
    z-index: -1;
}
#skrollr-body {
    background-image:
     var(--gradient-header),
     var(--gradient-topmenu),
     var(--gradient-background)!important;
    background-size:
     var(--header-background-image-size),
     100% var(--final-header-height-on-desktop),
     100% var(--background-gradient-distance);
}
 
#container{
    background-image: none;
}
#login-status span {
color: #ffffff;
}
hr {
   background-color: rgb(var(--medium-accent));
}
.scp-image-block {
    border: none;
}
 
.scp-image-block .scp-image-caption {
    color: rgb(var(--medium-accent));
    background-color: rgb(255,255,255);
    border: none;
    margin-top: 0.3rem;
    border-left: 0.2rem solid rgba(var(--medium-accent));
    border-right: 0.2rem solid rgba(var(--medium-accent));
}
 
.owindow {
   border: 0.2rem solid rgba(var(--medium-accent));
    box-shadow: 0.5rem 0.5rem rgb(var(--gray-monochrome));
}
 
.page-rate-widget-box {
    background: none;
    border: none;
    background-color: rgb(255,255,255);
    border-left: solid 2px rgb(var(--medium-accent));
}
 
/*unselected tab color*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(255,255,255);
    color:rgb(var(--medium-accent));
}
 
.yui-navset .yui-content {
     background-color: rgba(255,255,255, 0.25);
     border-color: rgb(var(--medium-accent));
}
 
table.wiki-content-table th,
table.wiki-content-table td {
     border-color: rgb(var(--medium-accent));
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color: rgb(255,255,255);
   border: none;
   border-left: solid 2px rgb(var(--medium-accent));
}
.titleblock {
   background-color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--medium-accent)) 2px;
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--medium-accent));
  color: rgb(255,255,255);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.dark-titleblock {
   background-color: rgb(var(--medium-accent));
   color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(255,255,255) 2px;
}
 
.dark-titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(255,255,255);
  color: rgb(0,0,0);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.styled-quote {
   background-color:rgb(255,255,255);
   border-left: 0.5rem solid rgba(var(--medium-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.styled-quote-d {
   background-color:rgb(255,255,255);
   border-left: 0.5rem solid rgba(var(--medium-accent));
   border-right: 0.5rem solid rgba(var(--medium-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--medium-accent));
   border-left: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote-d {
   background-color:rgb(var(--medium-accent));
   border-left: 0.5rem solid rgba(255,255,255);
   border-right: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.lightblock {
   background-color:rgb(255,255,255);
   color:rgb(0,0,0);
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--medium-accent));
   color:rgb(var(--white-monochrome));
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(0,0,0);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color:rgb(255,255,255);
     border: none;
    }
 
.logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(https://img1.imgtp.com/2022/07/25/BmUdsXUz.svg) center/18% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.border-logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(0,0,0);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color:rgb(255,255,255);
   border: solid rgb(var(--medium-accent)) 2px;
    }
 
.border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(https://img1.imgtp.com/2022/07/25/BmUdsXUz.svg) center/18% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.code {
   background-color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--medium-accent)) 2px;
}
 
.filetabs .yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li {
   display: inline-block;
}
 
.filetabs .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
   display: block;
}
 
.filetabs .yui-navset .yui-content {
   border-top-width: 15px;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a,
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' preserveAspectRatio='none' viewBox='0 0 150 45' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 4.6.0%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='matrix(1 0 0 1 74.95 22.39)' id='bC-LIzxo7Tu37zCdkDrqS' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(81, 107, 252); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -74.94856 22.50703 L -60.0064 -12.520110000000003 C -60.0064 -12.520110000000003 -55.89385 -21.849030000000003 -47.235839999999996 -22.281930000000003 C -38.57782999999999 -22.714830000000003 46.87608 -22.39016 46.87608 -22.39016 C 46.87608 -22.39016 56.05659 -23.219710000000003 61.40639 -12.520120000000002 C 66.75618 -1.8205300000000015 74.94856 22.506959999999996 74.94856 22.506959999999996 z' stroke-linecap='round' /%3E%3C/g%3E%3Cg transform='matrix(1 0 0 1 75.18 17.97)' id='E8ePkHu_UUyvFWDAIzFyP' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -46.15385 12.0108 L -46.15385 -12.01079 L 46.153839999999995 -12.01079 L 46.153839999999995 12.0108 z' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
    background-size: 100% 2.7rem;
    background-repeat: no-repeat;
    border-width: 0px;
    border-top: none;
    background-position: top;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a {
   padding: 4px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav .selected a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected a:hover {
    padding: 8px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
   padding: 6px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav,
.filetabs .yui-navset .yui-navset-top .yui-nav {
    border-color: transparent;
}
 
.filetabs .yui-navset .yui-nav .selected,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected,
.filetabs .yui-navset .yui-nav .selected a:active,
.filetabs .yui-navset .yui-nav .selected a:focus,
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   background-color: transparent;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   box-shadow: none;
}
 
.filetabs .yui-navset .yui-nav li {
   margin-right: 36px;
}
 
.filetabs .yui-navset .yui-nav .selected a {
   color: rgb(var(--swatch-text-general)) !important;
}
 
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover {
   color: rgb(var(--swatch-text-general));
}
 
.filetabs .yui-navset .yui-nav .selected a em,
.filetabs .yui-navset .yui-nav .selected a:hover em {
   position: relative;
   top: -4px;
}
 
.filetabs .yui-navset .yui-nav a:hover em {
   position: relative;
   top: -2px;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   border-bottom: solid 1px rgb(var(--white-monochrome));
}
 
.filetabs .yui-navset .yui-nav li.selected,
.filetabs .yui-navset .yui-navset-top .yui-nav li.selected {
   border-bottom: none;
   z-index: 1;
}
 
.footerbox{
    padding:0.1rem 1rem;
    margin-top:1rem;
    background: rgb(81, 107, 252);
    border-radius:0 1rem 0 0;
    color:#ffffff;
    border: 3px solid rgb(81, 107, 221);
    box-sizing:border-box;
}
.footerflavor h1{
    color: #000000;
}
.footerflavor h2{
    color: #000000;
}
.footerflavor h3{
    color: #000000;
}
.footerflavor h4{
    color: #000000;
}
.footerflavor h5{
    color: #000000;
}
.footerflavor h6{
    color: #000000;
}
.footerbox h1{
    color:  rgb(81, 107, 252);
}
.footerbox h2{
    color:  rgb(81, 107, 252);
}
.footerbox h3{
    color:  rgb(81, 107, 252);
}
.footerbox h4{
    color:  rgb(81, 107, 252);
}
.footerbox h5{
    color:  rgb(81, 107, 252);
}
.footerbox h6{
    color:  rgb(81, 107, 252);
}
.footerspan{
    margin-top:0.2rem;
    font-size:80%;
}
.footerflavor{
    padding:0.5px 1rem;
    margin-bottom:1rem;
    background:#ffffff;
    border-radius:0 0 0 1rem;
    color:#000000;
    box-sizing:border-box;
    border: 3px solid rgb(81, 107, 221);
    height: auto;
}
 
.profilepic{
    border-radius:0.6rem;
    float:left;
    max-height:13rem;
    height:17vw;
    margin-right:1rem;
    box-shadow: 0px 0px 3px;
    box-sizing:border-box;
}
 
@media only screen and (max-width: 510px) {
    .logoblock::after{
        content: "";
        float: center;
        border: solid 2px #0000;
        background:
    url(https://img1.imgtp.com/2022/07/25/BmUdsXUz.svg) center/25% no-repeat;
        opacity: 0.25;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        position: absolute;
        z-index: 1;
    }
    .border-logoblock::after{
        content: "";
        float: center;
        border: solid 2px #0000;
        background:
    url(https://img1.imgtp.com/2022/07/25/BmUdsXUz.svg) center/25% no-repeat;
        opacity: 0.25;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        position: absolute;
        z-index: 1;
    }
}

+ 版式代码

@import url('https://scpsandboxcn.wikidot.com/local--files/typeface/Typeface-BWCKKT.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
@import url("https://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
:root {
    --logo-image: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/bha.png");
    --header-title: "B.H.S.";
    --header-subtitle: "为您打理后花园";
   /* 字体 */
   --body-font: 'Noto Serif SC', sans-serif;
   --header-font: 'ZCOOL XiaoWei', sans-serif;
   --title-font: 'ZCOOL XiaoWei', sans-serif;
   --mono-font: 'BWCKKT', sans-serif;
    /* 标准色 */
    --white-monochrome: 255, 255, 255;
    /* 白色 */
    --very-light-gray-monochrome: 255, 255, 255;
    /* 次强调色（应用于杂项） */
    --light-gray-monochrome: 44, 209, 100;
    /* 次强调色（登录时） */
    --gray-monochrome: 45,183,99;
    /* 绿灰色 */
    --black-monochrome: 0, 0, 0;
    /* 黑色 */
    --medium-accent: 44, 209, 100;
    /* 绿色*/
    --dark-accent: 44, 209, 100;
    /* 绿色 */
 
    /* 背景与网站标题色 */
    --background-gradient-color: var(--very-light-gray-monochrome);
    --header-gradient-color-bottom: var(--medium-accent);
    --header-gradient-color-middle: var(--black-monochrome);
    --header-gradient-color-top: var(--black-monochrome);
 
    /* 主要主题色 */
    --swatch-background: var(--light-gray-blacmonochrome);
    --swatch-primary: var(--white-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--dark-accent);
 
    --link-color: 43,170,99;
    --visited-link-color: 43,170,99;
    --hover-link-color: 43,170,99;
    --newpage-color: 43,170,99;
 
    /* SD 图标适配 */
    --img-0: "" !important;
    --img-1: "" !important;
    --img-2: "" !important;
    --img-3: "" !important;
    --img-4: "" !important;
    --img-5: "" !important;
    --img-0: "" !important;
    --img-unknown: "" !important;
    --img-n-a: "" !important;
    --img-habitable: "" !important;
    --img-deadzone: "" !important;
    --img-pending: "" !important;
}
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -1rem;
   background-image: var(--logo-image);
   filter: brightness(0%) invert(100%);
   background-size: auto 10rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.7;
}
@media only screen and (max-width: 510px) {
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   filter: brightness(0%) invert(100%);
   background-size: auto 10rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.7;
}
}
body::after {
    content: "";
    background-image: url("https://s1.ax1x.com/2022/07/17/jIKWo6.png");
    background-size: cover;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.5;
    z-index: -2;
}
#skrollr-body {
background: none;
background-color: #509d59;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 40' width='80' height='40'%3E%3Cpath fill='%2360df54' fill-opacity='0.38' d='M0 40a19.96 19.96 0 0 1 5.9-14.11 20.17 20.17 0 0 1 19.44-5.2A20 20 0 0 1 20.2 40H0zM65.32.75A20.02 20.02 0 0 1 40.8 25.26 20.02 20.02 0 0 1 65.32.76zM.07 0h20.1l-.08.07A20.02 20.02 0 0 1 .75 5.25 20.08 20.08 0 0 1 .07 0zm1.94 40h2.53l4.26-4.24v-9.78A17.96 17.96 0 0 0 2 40zm5.38 0h9.8a17.98 17.98 0 0 0 6.67-16.42L7.4 40zm3.43-15.42v9.17l11.62-11.59c-3.97-.5-8.08.3-11.62 2.42zm32.86-.78A18 18 0 0 0 63.85 3.63L43.68 23.8zm7.2-19.17v9.15L62.43 2.22c-3.96-.5-8.05.3-11.57 2.4zm-3.49 2.72c-4.1 4.1-5.81 9.69-5.13 15.03l6.61-6.6V6.02c-.51.41-1 .85-1.48 1.33zM17.18 0H7.42L3.64 3.78A18 18 0 0 0 17.18 0zM2.08 0c-.01.8.04 1.58.14 2.37L4.59 0H2.07z'%3E%3C/path%3E%3C/svg%3E");
}
 
#container{
    background-image: none;
}
 
#login-status span {
color: #ffffff;
}
 
hr {
   background-color: rgb(var(--medium-accent));
}
 
table.wiki-content-table th,
table.wiki-content-table td {
     border-color: rgb(var(--medium-accent));
}
.scp-image-block {
    border: none;
}
 
.scp-image-block .scp-image-caption {
    color: rgb(0,0,0);
    background-color: rgb(255,255,255);
    border: 0.2rem solid rgba(var(--medium-accent));
    margin-top: 0.3rem;
}
 
.page-rate-widget-box {
    background-image: none !important;
    background-color: rgb(255,255,255);
    border: 0.2rem solid rgba(var(--medium-accent));
}
 
/*unselected tab color*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(255,255,255);
    color:rgb(var(--medium-accent));
}
 
.yui-navset .yui-content {
     background-color: rgba(255,255,255, 0.25);
     border-color: rgb(var(--medium-accent));
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color: rgb(255,255,255);
   border: 0.2rem solid rgba(var(--medium-accent));
}
.titleblock {
   background-color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: 0.2rem solid rgba(var(--medium-accent));
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--medium-accent));
  color: rgb(255,255,255);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.dark-titleblock {
   background-color: rgb(var(--medium-accent));
   color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: 0.2rem solid rgba(255,255,255);
}
 
.dark-titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(255,255,255);
  color: rgb(0,0,0);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.styled-quote {
   background-color:rgb(255,255,255);
   border-left: 0.5rem solid rgba(var(--medium-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.styled-quote-d {
   background-color:rgb(255,255,255);
   border-left: 0.5rem solid rgba(var(--medium-accent));
   border-right: 0.5rem solid rgba(var(--medium-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--medium-accent));
   border-left: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote-d {
   background-color:rgb(var(--medium-accent));
   border-left: 0.5rem solid rgba(255,255,255);
   border-right: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.lightblock {
   background-color:rgb(255,255,255);
   color:rgb(0,0,0);
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--medium-accent));
   color:rgb(var(--white-monochrome));
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(0,0,0);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color:rgb(255,255,255);
     border: none;
    }
 
.logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://tartar0s.wdfiles.com/local--files/theme:bhs/bha.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.borderblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(0,0,0);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color:rgb(255,255,255);
     border: solid 0.3rem rgb(var(--medium-accent));
    }
 
.border-logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(0,0,0);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color:rgb(255,255,255);
     border: solid 0.3rem rgb(var(--medium-accent));
    }
 
.border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://tartar0s.wdfiles.com/local--files/theme:bhs/bha.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.shadowblock{
    color: rgb(255,255,255);
        padding: 0.01rem 1rem;
    box-shadow: 0.5rem 0.5rem rgb(var(--gray-monochrome));
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--medium-accent));
    }
 
.inset-shadowblock{
        padding: 0.01rem 1rem;
    box-shadow: inset 5em 1em rgba(var(--medium-accent),.25), inset 8em 2em rgba(44, 195, 100,.25), 0.1rem 0.2rem 0.2rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(255,255,255);
     border: solid 0.3rem rgb(var(--gray-monochrome));
    }
 
.leafblock{
        padding: 0.01rem 1rem;
color: rgb(255,255,255);  
background-color: #509d59;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 40' width='80' height='40'%3E%3Cpath fill='%2360df54' fill-opacity='0.38' d='M0 40a19.96 19.96 0 0 1 5.9-14.11 20.17 20.17 0 0 1 19.44-5.2A20 20 0 0 1 20.2 40H0zM65.32.75A20.02 20.02 0 0 1 40.8 25.26 20.02 20.02 0 0 1 65.32.76zM.07 0h20.1l-.08.07A20.02 20.02 0 0 1 .75 5.25 20.08 20.08 0 0 1 .07 0zm1.94 40h2.53l4.26-4.24v-9.78A17.96 17.96 0 0 0 2 40zm5.38 0h9.8a17.98 17.98 0 0 0 6.67-16.42L7.4 40zm3.43-15.42v9.17l11.62-11.59c-3.97-.5-8.08.3-11.62 2.42zm32.86-.78A18 18 0 0 0 63.85 3.63L43.68 23.8zm7.2-19.17v9.15L62.43 2.22c-3.96-.5-8.05.3-11.57 2.4zm-3.49 2.72c-4.1 4.1-5.81 9.69-5.13 15.03l6.61-6.6V6.02c-.51.41-1 .85-1.48 1.33zM17.18 0H7.42L3.64 3.78A18 18 0 0 0 17.18 0zM2.08 0c-.01.8.04 1.58.14 2.37L4.59 0H2.07z'%3E%3C/path%3E%3C/svg%3E");
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
     border: solid 0.3rem rgb(var(--gray-monochrome));
    }
 
.code {
   background-color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: 0.2rem solid rgba(var(--medium-accent));
}
 
.filetabs .yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li {
   display: inline-block;
}
 
.filetabs .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
   display: block;
}
 
.filetabs .yui-navset .yui-content {
   border-top-width: 15px;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a,
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' preserveAspectRatio='none' viewBox='0 0 150 45' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 4.6.0%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='matrix(1 0 0 1 74.95 22.39)' id='bC-LIzxo7Tu37zCdkDrqS' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(56, 221, 112); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -74.94856 22.50703 L -60.0064 -12.520110000000003 C -60.0064 -12.520110000000003 -55.89385 -21.849030000000003 -47.235839999999996 -22.281930000000003 C -38.57782999999999 -22.714830000000003 46.87608 -22.39016 46.87608 -22.39016 C 46.87608 -22.39016 56.05659 -23.219710000000003 61.40639 -12.520120000000002 C 66.75618 -1.8205300000000015 74.94856 22.506959999999996 74.94856 22.506959999999996 z' stroke-linecap='round' /%3E%3C/g%3E%3Cg transform='matrix(1 0 0 1 75.18 17.97)' id='E8ePkHu_UUyvFWDAIzFyP' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -46.15385 12.0108 L -46.15385 -12.01079 L 46.153839999999995 -12.01079 L 46.153839999999995 12.0108 z' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
    background-size: 100% 2.7rem;
    background-repeat: no-repeat;
    border-width: 0px;
    border-top: none;
    background-position: top;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a {
   padding: 4px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav .selected a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected a:hover {
    padding: 8px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
   padding: 6px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav,
.filetabs .yui-navset .yui-navset-top .yui-nav {
    border-color: transparent;
}
 
.filetabs .yui-navset .yui-nav .selected,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected,
.filetabs .yui-navset .yui-nav .selected a:active,
.filetabs .yui-navset .yui-nav .selected a:focus,
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   background-color: transparent;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   box-shadow: none;
}
 
.filetabs .yui-navset .yui-nav li {
   margin-right: 36px;
}
 
.filetabs .yui-navset .yui-nav .selected a {
   color: rgb(var(--swatch-text-general)) !important;
}
 
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover {
   color: rgb(var(--swatch-text-general));
}
 
.filetabs .yui-navset .yui-nav .selected a em,
.filetabs .yui-navset .yui-nav .selected a:hover em {
   position: relative;
   top: -4px;
}
 
.filetabs .yui-navset .yui-nav a:hover em {
   position: relative;
   top: -2px;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   border-bottom: solid 1px rgb(var(--white-monochrome));
}
 
.filetabs .yui-navset .yui-nav li.selected,
.filetabs .yui-navset .yui-navset-top .yui-nav li.selected {
   border-bottom: none;
   z-index: 1;
}
 
.top-box {
   border-color: rgb(43,119,45) !important;
}
 
.bottom-box ul li {
   color: rgb(43,119,45) !important;
}
 
.bottom-box ul li:before {
   background: rgb(43,119,45) !important;
}
 
.top-box .gradient-box {
  background: linear-gradient(90deg, rgba(43,119,45,1) 0%, rgba(43,119,45,0) 36%) !important;
}
 
.top-box:before {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 40' width='80' height='40'%3E%3Cpath fill='%23222222' fill-opacity='0.38' d='M0 40a19.96 19.96 0 0 1 5.9-14.11 20.17 20.17 0 0 1 19.44-5.2A20 20 0 0 1 20.2 40H0zM65.32.75A20.02 20.02 0 0 1 40.8 25.26 20.02 20.02 0 0 1 65.32.76zM.07 0h20.1l-.08.07A20.02 20.02 0 0 1 .75 5.25 20.08 20.08 0 0 1 .07 0zm1.94 40h2.53l4.26-4.24v-9.78A17.96 17.96 0 0 0 2 40zm5.38 0h9.8a17.98 17.98 0 0 0 6.67-16.42L7.4 40zm3.43-15.42v9.17l11.62-11.59c-3.97-.5-8.08.3-11.62 2.42zm32.86-.78A18 18 0 0 0 63.85 3.63L43.68 23.8zm7.2-19.17v9.15L62.43 2.22c-3.96-.5-8.05.3-11.57 2.4zm-3.49 2.72c-4.1 4.1-5.81 9.69-5.13 15.03l6.61-6.6V6.02c-.51.41-1 .85-1.48 1.33zM17.18 0H7.42L3.64 3.78A18 18 0 0 0 17.18 0zM2.08 0c-.01.8.04 1.58.14 2.37L4.59 0H2.07z'%3E%3C/path%3E%3C/svg%3E") !important;
}
 
.header-diamond .diamond-pattern {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 40' width='80' height='40'%3E%3Cpath fill='%23222222' fill-opacity='0.38' d='M0 40a19.96 19.96 0 0 1 5.9-14.11 20.17 20.17 0 0 1 19.44-5.2A20 20 0 0 1 20.2 40H0zM65.32.75A20.02 20.02 0 0 1 40.8 25.26 20.02 20.02 0 0 1 65.32.76zM.07 0h20.1l-.08.07A20.02 20.02 0 0 1 .75 5.25 20.08 20.08 0 0 1 .07 0zm1.94 40h2.53l4.26-4.24v-9.78A17.96 17.96 0 0 0 2 40zm5.38 0h9.8a17.98 17.98 0 0 0 6.67-16.42L7.4 40zm3.43-15.42v9.17l11.62-11.59c-3.97-.5-8.08.3-11.62 2.42zm32.86-.78A18 18 0 0 0 63.85 3.63L43.68 23.8zm7.2-19.17v9.15L62.43 2.22c-3.96-.5-8.05.3-11.57 2.4zm-3.49 2.72c-4.1 4.1-5.81 9.69-5.13 15.03l6.61-6.6V6.02c-.51.41-1 .85-1.48 1.33zM17.18 0H7.42L3.64 3.78A18 18 0 0 0 17.18 0zM2.08 0c-.01.8.04 1.58.14 2.37L4.59 0H2.07z'%3E%3C/path%3E%3C/svg%3E")  !important;
}
 
.header-diamond {
   background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 300.9 284.5' style='enable-background:new 0 0 300.9 284.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%232b772d;%7D .st1%7Bfill:%232b772d;%7D%0A%3C/style%3E%3Cg%3E%3Cpolygon class='st1' points='73.4,32.6 0,105.4 13.6,105.4 86.4,32.6 '/%3E%3Cpolygon class='st1' points='26.5,105.4 40.1,105.4 112.9,32.6 99.3,32.6 '/%3E%3C/g%3E%3Cpolyline class='st1' points='287.3,105.4 214.5,32.6 227.5,32.6 287.3,91.9 '/%3E%3Cpolygon class='st1' points='274.4,105.4 260.8,105.4 188,32.6 201.6,32.6 '/%3E%3C/svg%3E") !important;
}
 
.top-box.class-n\/a .header-diamond:after,
.top-box.class-不适用 .header-diamond:after,
.top-box.class-不適用 .header-diamond:after {
    content: "";
    position: absolute;
   background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 300.9 284.5' style='enable-background:new 0 0 300.9 284.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%232b772d;%7D .st1%7Bfill:%232b772d;%7D%0A%3C/style%3E%3Cg%3E%3Cpolygon class='st1' points='73.4,32.6 0,105.4 13.6,105.4 86.4,32.6 '/%3E%3Cpolygon class='st1' points='26.5,105.4 40.1,105.4 112.9,32.6 99.3,32.6 '/%3E%3C/g%3E%3Cpolyline class='st1' points='287.3,105.4 214.5,32.6 227.5,32.6 287.3,91.9 '/%3E%3Cpolygon class='st1' points='274.4,105.4 260.8,105.4 188,32.6 201.6,32.6 '/%3E%3C/svg%3E") !important;
    height: calc(284.5px / 1.13);
    width: calc(300.9px / 1.13);
    filter: none !important;
}
 
.top-box.class-unknown .header-diamond { filter: none !important; }
.top-box.class-unknown:before, .top-box.class-unknown .header-diamond .diamond-pattern{ opacity: 0.15 !important; }
 
.top-box.class-0 {
   background: rgb(var(--medium-accent)) !important;
}
 
.header-diamond .diamond-color.class-0 {
   background: rgb(var(--medium-accent)) !important;
}
 
.top-box.class-1, .top-box.class-2 {
   background: rgb(var(--medium-accent)) !important;
}
 
.header-diamond .diamond-color.class-1,
.header-diamond .diamond-color.class-2 {
   background: rgb(var(--medium-accent)) !important;
}
 
.top-box.class-3, .top-box.class-4 {
   background: rgb(43,170,99) !important;
}
 
.top-box.class-0 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/0.JPG") center/78% no-repeat !important;
}
 
.top-box.class-1 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/1.JPG") center/78% no-repeat !important;
}
 
.top-box.class-2 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/2.JPG") center/78% no-repeat !important;
}
 
.top-box.class-3 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/3.JPG") center/78% no-repeat !important;
}
 
.top-box.class-4 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/4.JPG") center/78% no-repeat !important;
}
 
.top-box.class-5 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/5.JPG") center/78% no-repeat !important;
}
 
.top-box.class-unknown .header-diamond .diamond-image,
.top-box.class-未知 .header-diamond .diamond-image,
.top-box.class-未知 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/smhy.JPG") center/78% no-repeat !important;
}
 
.top-box.class-n\/a .header-diamond .diamond-image,
.top-box.class-不适用 .header-diamond .diamond-image,
.top-box.class-不適用 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme%3Abhs/bsy.JPG") center/78% no-repeat !important;
}
 
.top-box.class-habitable .header-diamond .diamond-image,
.top-box.class-宜居 .header-diamond .diamond-image,
.top-box.class-宜居 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/mghy.JPG") center/78% no-repeat !important;
}
 
.top-box.class-deadzone .header-diamond .diamond-image,
.top-box.class-死区 .header-diamond .diamond-image,
.top-box.class-死區 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/pbhy.JPG") center/78% no-repeat !important;
}
 
.top-box.class-pending .header-diamond .diamond-image,
.top-box.class-等待分级 .header-diamond .diamond-image,
.top-box.class-等待分級 .header-diamond .diamond-image {
    background: url("http://tartar0s.wdfiles.com/local--files/theme:bhs/ccbq.JPG") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-3,
.header-diamond .diamond-color.class-4 {
   background: rgb(43,170,99) !important;
}
 
.top-box.class-5{
   background: rgb(43,140,84) !important;
}
 
.top-box.class-unknown, .top-box.class-未知{
   background: #bbbbbb !important;
}
 
.top-box.class-habitable, .top-box.class-宜居{
   background: rgb(22 ,255 ,86) !important;
}
 
.header-diamond .diamond-color.class-5 {
   background: rgb(43,140,84) !important;
}
 
.header-diamond .diamond-color.class-unknown,
.header-diamond .diamond-color.class-未知 {
   background: #bbbbbb !important;
}
 
.header-diamond .diamond-color.class-habitable,
.header-diamond .diamond-color.class-宜居 {
   background: rgb(22 ,255 ,86) !important;
}
 
.top-box.class-deadzone {
   background: #ff3433 !important;
}
 
.header-diamond .diamond-color.class-deadzone {
   background: #ff3433 !important;
}
 
.lang-cn .bottom-box.class-0 ul li:nth-child(1)>.default:after {
    content: "私家园林" !important;
}
.lang-tr .bottom-box.class-0 ul li:nth-child(1)>.default:after {
    content: "私家園林" !important;
}
.lang-cn .bottom-box.class-0 ul li:nth-child(2)>.default:after {
    content: "枝条整洁" !important;
}
.lang-tr .bottom-box.class-0 ul li:nth-child(2)>.default:after {
    content: "枝條整潔" !important;
}
.lang-cn .bottom-box.class-0 ul li:nth-child(3)>.default:after {
    content: "无寄生虫" !important;
}
.lang-tr .bottom-box.class-0 ul li:nth-child(3)>.default:after {
    content: "無寄生蟲" !important;
}
 
.lang-cn .bottom-box.class-1 ul li:nth-child(1)>.default:after {
    content: "私家园林" !important;
}
.lang-tr .bottom-box.class-1 ul li:nth-child(1)>.default:after {
    content: "私家園林" !important;
}
.lang-cn .bottom-box.class-1 ul li:nth-child(2)>.default:after {
    content: "枝条整洁" !important;
}
.lang-tr .bottom-box.class-1 ul li:nth-child(2)>.default:after {
    content: "枝條整潔" !important;
}
.lang-cn .bottom-box.class-1 ul li:nth-child(3)>.default:after {
    content: "极少寄生虫" !important;
}
.lang-tr .bottom-box.class-1 ul li:nth-child(3)>.default:after {
    content: "極少寄生蟲" !important;
}
 
.lang-cn .bottom-box.class-2 ul li:nth-child(1)>.default:after {
    content: "公共园林" !important;
}
.lang-tr .bottom-box.class-2 ul li:nth-child(1)>.default:after {
    content: "公共園林" !important;
}
.lang-cn .bottom-box.class-2 ul li:nth-child(2)>.default:after {
    content: "枝条整洁" !important;
}
.lang-tr .bottom-box.class-2 ul li:nth-child(2)>.default:after {
    content: "枝條整潔" !important;
}
.lang-cn .bottom-box.class-2 ul li:nth-child(3)>.default:after {
    content: "少量寄生虫" !important;
}
.lang-tr .bottom-box.class-2 ul li:nth-child(3)>.default:after {
    content: "少量寄生蟲" !important;
}
 
.lang-cn .bottom-box.class-3 ul li:nth-child(1)>.default:after {
    content: "公共园林" !important;
}
.lang-tr .bottom-box.class-3 ul li:nth-child(1)>.default:after {
    content: "公共園林" !important;
}
.lang-cn .bottom-box.class-3 ul li:nth-child(2)>.default:after {
    content: "枝节横生" !important;
}
.lang-tr .bottom-box.class-3 ul li:nth-child(2)>.default:after {
    content: "枝節橫生" !important;
}
.lang-cn .bottom-box.class-3 ul li:nth-child(3)>.default:after {
    content: "少量寄生虫" !important;
}
.lang-tr .bottom-box.class-3 ul li:nth-child(3)>.default:after {
    content: "少量寄生蟲" !important;
}
 
.lang-cn .bottom-box.class-4 ul li:nth-child(1)>.default:after {
    content: "公共园林" !important;
}
.lang-tr .bottom-box.class-4 ul li:nth-child(1)>.default:after {
    content: "公共園林" !important;
}
.lang-cn .bottom-box.class-4 ul li:nth-child(2)>.default:after {
    content: "枝节横生" !important;
}
.lang-tr .bottom-box.class-4 ul li:nth-child(2)>.default:after {
    content: "枝節橫生" !important;
}
.lang-cn .bottom-box.class-4 ul li:nth-child(3)>.default:after {
    content: "中量寄生虫" !important;
}
.lang-tr .bottom-box.class-4 ul li:nth-child(3)>.default:after {
    content: "中量寄生蟲" !important;
}
 
.lang-cn .bottom-box.class-5 ul li:nth-child(1)>.default:after {
    content: "公共园林" !important;
}
.lang-tr .bottom-box.class-5 ul li:nth-child(1)>.default:after {
    content: "公共園林" !important;
}
.lang-cn .bottom-box.class-5 ul li:nth-child(2)>.default:after {
    content: "枝节横生" !important;
}
.lang-tr .bottom-box.class-5 ul li:nth-child(2)>.default:after {
    content: "枝節橫生" !important;
}
.lang-cn .bottom-box.class-5 ul li:nth-child(3)>.default:after {
    content: "大量寄生虫" !important;
}
.lang-tr .bottom-box.class-5 ul li:nth-child(3)>.default:after {
    content: "大量寄生蟲" !important;
}
 
.lang-cn .bottom-box.class-unknown ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-未知 ul li:nth-child(1)>.default:after {
    content: "未知属性" !important;
}
.lang-tr .bottom-box.class-unknown ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-未知 ul li:nth-child(1)>.default:after {
    content: "未知屬性" !important;
}
.lang-cn .bottom-box.class-unknown ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-未知 ul li:nth-child(2)>.default:after {
    content: "未知" !important;
}
.lang-tr .bottom-box.class-unknown ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-未知 ul li:nth-child(2)>.default:after {
    content: "未知" !important;
}
.lang-cn .bottom-box.class-unknown ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-未知 ul li:nth-child(3)>.default:after {
    content: "未知生物" !important;
}
.lang-tr .bottom-box.class-unknown ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-未知 ul li:nth-child(3)>.default:after {
    content: "未知生物" !important;
}
 
.lang-cn .bottom-box.class-habitable ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-宜居 ul li:nth-child(1)>.default:after {
    content: "私家园林" !important;
}
.lang-tr .bottom-box.class-habitable ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-宜居 ul li:nth-child(1)>.default:after {
    content: "私家園林" !important;
}
.lang-cn .bottom-box.class-habitable ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-宜居 ul li:nth-child(2)>.default:after {
    content: "宜居聚居地" !important;
}
.lang-tr .bottom-box.class-habitable ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-宜居 ul li:nth-child(2)>.default:after {
    content: "宜居聚居地" !important;
}
.lang-cn .bottom-box.class-habitable ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-宜居 ul li:nth-child(3)>.default:after {
    content: "无有害生物" !important;
}
.lang-tr .bottom-box.class-habitable ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-宜居 ul li:nth-child(3)>.default:after {
    content: "無有害生物" !important;
}
 
.lang-cn .top-box.class-pending .bottom-text:after,
.lang-cn .top-box.class-等待分级 .bottom-text:after,
.lang-cn .top-box.class-等待分級 .bottom-text:after {
    content: "参差不齐"!important;
}
.lang-tr .top-box.class-pending .bottom-text:after,
.lang-tr .top-box.class-等待分级 .bottom-text:after,
.lang-tr .top-box.class-等待分級 .bottom-text:after {
    content: "參差不齊" !important;
}
 
.lang-cn .bottom-box.class-pending ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-等待分级 ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-等待分級 ul li:nth-child(1)>.default:after {
    content: "私家园林"!important;
}
.lang-tr .bottom-box.class-pending ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-等待分级 ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-等待分級 ul li:nth-child(1)>.default:after {
    content: "私家園林"!important;
}
.lang-cn .bottom-box.class-pending ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-等待分级 ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-等待分級 ul li:nth-child(2)>.default:after {
    content: "树木生长不均匀"!important;
}
.lang-tr .bottom-box.class-pending ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-等待分级 ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-等待分級 ul li:nth-child(2)>.default:after {
    content: "樹木生長不均勻"!important;
}
.lang-cn .bottom-box.class-pending ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-等待分级 ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-等待分級 ul li:nth-child(3)>.default:after {
    content: "寄生虫分布不均匀"!important;
}
.lang-tr .bottom-box.class-pending ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-等待分级 ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-等待分級 ul li:nth-child(3)>.default:after {
    content: "寄生蟲分佈不均勻"!important;
}
 
.lang-cn .top-box.class-deadzone .bottom-text:after,
.lang-cn .top-box.class-死区 .bottom-text:after,
.lang-cn .top-box.class-死區 .bottom-text:after {
    content: "破败花园"!important
}
.lang-tr .top-box.class-deadzone .bottom-text:after,
.lang-tr .top-box.class-死区 .bottom-text:after,
.lang-tr .top-box.class-死區 .bottom-text:after {
    content: "破敗花園"!important;
}
.lang-cn .bottom-box.class-deadzone ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-死区 ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-死區 ul li:nth-child(1)>.default:after {
    content: "公共园林"!important
}
.lang-tr .bottom-box.class-deadzone ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-死区 ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-死區 ul li:nth-child(1)>.default:after {
    content: "公共園林"!important;
}
.lang-cn .bottom-box.class-deadzone ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-死区 ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-死區 ul li:nth-child(2)>.default:after {
    content: "杂草丛生"!important;
}
.lang-tr .bottom-box.class-deadzone ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-死区 ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-死區 ul li:nth-child(2)>.default:after {
    content: "雜草叢生"!important;
}
.lang-cn .bottom-box.class-deadzone ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-死区 ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-死區 ul li:nth-child(3)>.default:after {
    content: "危险寄生生物"!important;
}
.lang-tr .bottom-box.class-deadzone ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-死区 ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-死區 ul li:nth-child(3)>.default:after {
    content: "危險寄生生物"!important;
}
 
.lang-cn .top-box.class-0 .bottom-text:after {
    content: "荒草丛生"!important;
}
.lang-tr .top-box.class-0 .bottom-text:after {
    content: "荒草叢生"!important;
}
 
.lang-cn .top-box.class-1 .bottom-text:after {
    content: "空旷花园"!important;
}
.lang-tr .top-box.class-1 .bottom-text:after {
    content: "空曠花園"!important;
}
 
.lang-cn .top-box.class-2 .bottom-text:after {
    content: "普通花园"!important;
}
.lang-tr .top-box.class-2 .bottom-text:after {
    content: "普通花園"!important;
}
 
.lang-cn .top-box.class-3 .bottom-text:after {
    content: "茂密花园"!important;
}
.lang-tr .top-box.class-3 .bottom-text:after {
    content: "茂密花園"!important;
}
 
.lang-cn .top-box.class-4 .bottom-text:after {
    content: "繁盛花园"!important;
}
.lang-tr .top-box.class-4 .bottom-text:after {
    content: "繁盛花園"!important;
}
 
.lang-cn .top-box.class-5 .bottom-text:after {
    content: "修剪过度"!important;
}
.lang-tr .top-box.class-5 .bottom-text:after {
    content: "修建過度"!important;
}
 
.lang-cn .top-box.class-unknown .bottom-text:after,
.lang-cn .top-box.class-未知 .bottom-text:after {
    content: "神秘花园"!important;
}
.lang-tr .top-box.class-unknown .bottom-text:after,
.lang-tr .top-box.class-未知 .bottom-text:after {
    content: "神秘花園"!important;
}
 
.lang-cn .top-box.class-habitable .bottom-text:after,
.lang-cn .top-box.class-宜居 .bottom-text:after {
    content: "美观花园"!important;
}
.lang-tr .top-box.class-habitable .bottom-text:after,
.lang-tr .top-box.class-宜居 .bottom-text:after {
    content: "美觀花園"!important;
}
 
.lang-cn .bottom-box.class-n\/a ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-不适用 ul li:nth-child(2)>.default:after {
    content: "不存在树木" !important;
}
.lang-tr .bottom-box.class-n\/a ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-不适用 ul li:nth-child(2)>.default:after {
    content: "不存在樹木" !important;
}
.lang-cn .bottom-box.class-n\/a ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-不适用 ul li:nth-child(3)>.default:after {
    content: "不存在生物" !important;
}
.lang-tr .bottom-box.class-n\/a ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-不适用 ul li:nth-child(3)>.default:after {
    content: "不存在生物" !important;
}
 
.top-box.class-0 .bottom-text p {
    display: none !important;
}
.top-box.class-1 .bottom-text p {
    display: none !important;
}
.top-box.class-2 .bottom-text p {
    display: none !important;
}
.top-box.class-3 .bottom-text p {
    display: none !important;
}
.top-box.class-4 .bottom-text p {
    display: none !important;
}
.top-box.class-5 .bottom-text p {
    display: none !important;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Gemunu+Libre:wght@800&display=swap');
@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
:root {
   --theme-base: "black-highlighter";
   --theme-id: "advanced-splinter";
   --theme-name: "Advanced Splinter Theme";
 
   --logo-image: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:b-f-p-f-database/bfpf-data.png");
   --header-title: "B.F.P.F.数据库";
   --header-subtitle: "保障您的生活，我们义不容辞";
 
   --body-font: punctuation-marks, Huiwen-mincho, sans-serif;
   --header-font: 'CKTKingKong', sans-serif;
   --title-font: 'CKTKingKong', sans-serif;
   --mono-font: 'Fantasque Sans Mono', monospace;
 
   --mainAccent: 69, 226, 50;
   --secondAccent: 69, 226, 50;
   --white-monochrome: 237, 233, 223;
   --pale-gray-monochrome: var(--dark-gray-monochrome);
   --very-light-gray-monochrome: 69, 226, 50;
   --light-gray-monochrome: 69, 226, 50;
   --gray-monochrome: 72, 69, 60;
   --black-monochrome: 0, 0, 0;
   --bright-accent: var(--mainAccent);
   --medium-accent: 0, 0, 0;
   --dark-accent: var(--mainAccent);
   --pale-accent: var(--mainAccent);
   --dark-gray-monochrome: 20, 22, 24;
 
   --swatch-topmenu-border-color: var(--mainAccent);
   --swatch-topmenu-bg-color: var(--medium-accent);
   --swatch-menubg-color: var(--medium-accent);
   --swatch-border-color: var(--bright-accent);
 
   --swatch-text-dark: var(--white-monochrome);
   --swatch-text-light: var(--white-monochrome);
   --swatch-background: var(--medium-accent);
   --swatch-menutxt-dark-color: var(--white-monochrome);
   --swatch-primary-darker: var(--pale-accent);
 
   --link-color: 69, 226, 50;
   --hover-link-color: 20, 230, 0;
   --visited-link-color: 69, 226, 50;
 
   --background-gradient-distance: 0rem;
   --gradient-topmenu: none;
   --diagonal-stripes: linear-gradient(transparent 0);
   --gradient-header: none;
 
    --header-height-on-desktop: 9rem;
 
}
#extrac-div-1 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background: repeating-linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.15) 50%,rgba(0,0,0,0));
    background-size: auto 8px;
    opacity: 0.7;
}
 
#extrac-div-2 {
    position: fixed;
    width: 100vw;
    height : 1rem;
    top: 0;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(69, 226, 50) 0%,rgba(69, 226, 50,1) 50%,rgba(69, 226, 50,0.98) 51%,rgba(69, 226, 50) 100%);
    opacity : .1;
    animation: scanm 6s linear infinite;
}
@keyframes scanm {
  0%   { top: -1rem; opacity : .05;}
  25% { top: 50%; opacity: .03;}
  37.5% { top: 75%; opacity: 0.06;}
  50% { top: 100%; opacity: .03;}
  100% { top: 100%;}
}
 
#extrac-div-3 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background-image: radial-gradient(circle, rgb(0,0,0) 0%, rgb(69, 226, 50) 60%, rgb(69, 226, 50) 100%);
    opacity: 0.25;
    mix-blend-mode: color-dodge;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 30;
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
 
/*login stuff*/
#login-status{
   color: rgb(var(--white-monochrome));
}
 
#login-status a#my-account {
   background-color: rgb(var(--pale-accent));
   padding: 0.3em 0.25em 0.2em 0.25em;
}
 
#account-options>ul>li a:hover {
   color: rgb(var(--pale-accent));
}
 
#account-options {
  background: rgb(var(--medium-accent));
  border-color: rgb(var(--pale-accent));
  color: rgb(var(--white-monochrome));
}
 
#login-status ul a {
  color: rgb(var(--white-monochrome));
}
 
/*table stuff*/
table.wiki-content-table th {
background-color: rgb(var(--dark-gray-monochrome));
border: 2px solid rgb(var(--pale-accent)) !important;
}
 
table.wiki-content-table td {
border: 2px solid rgb(var(--pale-accent)) !important;
}
 
/*misc*/
#page-title{
   text-align: center;
   color: rgb(var(--pale-accent));
}
 
#side-bar div.menu-item {
   border-color: rgb(var(--bright-accent));
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#footer{
   color: rgb(var(--black-monochrome));
}
 
.footnotes-footer{
    background-color: rgb(var(--dark-gray-monochrome));
}
.footnotes-footer .footnote-footer a{
    background-color: rgb(var(--dark-gray-monochrome));
}
 
.scp-image-block {
    border: none;
}
 
.scp-image-block .scp-image-caption {
    color: rgb(var(--white-monochrome));
    background-color: rgb(var(--dark-gray-monochrome));
    border: none;
    margin-top: 0.3rem;
    border-left: 0.2rem solid rgba(var(--pale-accent));
    border-right: 0.2rem solid rgba(var(--pale-accent));
}
 
.page-rate-widget-box {
    background: none;
    border: none;
    background-color: rgb(var(--dark-gray-monochrome));
    border-left: 0.2rem solid rgba(var(--pale-accent));
}
 
/*hexagon header gradient*/
#skrollr-body {
  background: none;
  height: 11rem;
}
 
/*blend gradient*/
#container {
   background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgb(var(--medium-accent)) 93%);
   background-size: 37rem 11rem;
   background-attachment: scroll;
   background-repeat: repeat-x;
}
/*misc 2*/
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
/*header stuff*/
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -0.3rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   left: 4.8rem;
   top: 0.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   left: 3.3rem;
   top: 1.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   letter-spacing: 0.1rem;
}
 
/*#header h1 a::before{
   letter-spacing: 1rem;
}*/
 
/*links*/
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
/*line + block*/
hr {
   background-color: #000000;
   border-top: solid 2px rgb(var(--pale-accent));
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color: rgb(var(--dark-gray-monochrome));
   border: none;
   border-left: solid 2px rgb(var(--pale-accent));
}
 
/*search*/
/*#search-top-box {
        left: 3%;
        top: 0.5rem;
}
 
#search-top-box-form > #search-top-box-input {
        width: 7rem;
}*/
 
/* TABVIEW - Abandon All Hope Ye Who Enter Here */
 
/*content bg*/
.yui-navset .yui-content {
     background-color: rgba(var(--pale-accent), 0.25);
     border-color: rgb(var(--pale-accent));
}
 
/*unselected tab color*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--dark-gray-monochrome));
    color:rgb(var(--white-monochrome));
}
 
/*hover tab bg*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
     background-color: rgba(var(--pale-accent), .25);
}
 
/*backer background*/
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    background: rgb(var(--dark-gray-monochrome));
}
 
/*selected tab bg*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
    background-color: rgb(var(--pale-accent));
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
    background-color: rgb(var(--pale-accent));
}
 
@media only screen and (max-width: 768px) {
:root{
   --swatch-menubg-color: var(--medium-accent);
}
 
#header::before {
background-image: none;
}
 
    #header {
     height: var(--header-height-on-mobile);
     background-image: url("https://nu-scptheme.github.io/Black-Highlighter/images/logo.svg");
     background-image: var(--logo-image);
     --size: calc(var(--final-header-height-on-mobile) + 1rem);
     --y-offset: 1.5rem;
     background-position: center;
     background-size: var(--size), 100% var(--header-height-on-mobile);
     background-repeat: no-repeat, repeat;
     width: 100vw;
     margin: 0;
     position: sticky;
     top: calc(var(--header-height-on-mobile) * -1);
    }
 
#header h1, #header h1 a {
   left: 1rem;
   top: 0.8rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
   left: 0.8rem;
   top: 1.8rem;
}
 
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"]:hover {
    background: rgb(0, 0, 0);
    border-color: rgb(var(--pale-accent));
}
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"]{
    background: rgb(0, 0, 0);
    border-color: rgb(var(--pale-accent));
}
}
 
.styled-quote {
   background-color:rgb(var(--dark-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--black-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--dark-gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.titleblock {
   background-color: rgb(var(--dark-gray-monochrome));
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--pale-accent)) 2px;
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--pale-accent));
  color: rgb(var(--white-monochrome));
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.styled-quote-d{
   background-color:rgb(var(--dark-gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border-left: 0.5rem solid rgba(var(--mainAccent));
   border-right: 0.5rem solid rgba(var(--secondAccent));
}
.logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-gray-monochrome));
     border: solid 0.3rem rgb(var(--mainAccent));
    }
 
.logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backrooms-wiki-cn.wikidot.com/local--files/theme:b-f-p-f-database/bfpf-data.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.top-box {
   border-color: rgb(var(--mainAccent)) !important;
}
 
.bottom-box ul li {
   color: rgb(var(--mainAccent)) !important;
}
 
.bottom-box ul li:before {
   background: rgb(var(--mainAccent)) !important;
}
 
.top-box .gradient-box {
  background: linear-gradient(90deg, rgba(var(--mainAccent),1) 0%, rgba(var(--mainAccent),0) 36%) !important;
}
 
.top-box:before {
    background: url("") !important;
}
 
.header-diamond .diamond-pattern {
    background: url("") !important;
}
 
.header-diamond {
   background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 300.9 284.5' style='enable-background:new 0 0 300.9 284.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%2345E232;%7D .st1%7Bfill:%2345E232;%7D%0A%3C/style%3E%3Cg%3E%3Cpolygon class='st1' points='73.4,32.6 0,105.4 13.6,105.4 86.4,32.6 '/%3E%3Cpolygon class='st1' points='26.5,105.4 40.1,105.4 112.9,32.6 99.3,32.6 '/%3E%3C/g%3E%3Cpolyline class='st1' points='287.3,105.4 214.5,32.6 227.5,32.6 287.3,91.9 '/%3E%3Cpolygon class='st1' points='274.4,105.4 260.8,105.4 188,32.6 201.6,32.6 '/%3E%3C/svg%3E") !important;
}
 
.top-box.class-unknown .header-diamond { filter: none !important; }
.top-box.class-unknown:before, .top-box.class-unknown .header-diamond .diamond-pattern{ opacity: 0.15 !important; }
 
.top-box .header-diamond .diamond-image {
   filter: brightness(0%) invert(100%);
}
 
.top-box.class-0 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.top-box.class-0 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/tar-sd/0.png") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-0 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.top-box.class-1, .top-box.class-2 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.top-box.class-1 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/tar-sd/1.png") center/78% no-repeat !important;
}
 
.top-box.class-2 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/tar-sd/2.png") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-1,
.header-diamond .diamond-color.class-2 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.top-box.class-3, .top-box.class-4 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.top-box.class-3 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/tar-sd/3.png") center/78% no-repeat !important;
}
 
.top-box.class-4 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/tar-sd/4.png") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-3,
.header-diamond .diamond-color.class-4 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.top-box.class-5, .top-box.class-unknown, .top-box.class-未知, .top-box.class-habitable, .top-box.class-宜居{
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.top-box.class-5 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/tar-sd/5.png") center/78% no-repeat !important;
}
 
.top-box.class-unknown .header-diamond .diamond-image,
.top-box.class-未知 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/tar-sd/five.png") center/78% no-repeat !important;
}
 
.top-box.class-habitable .header-diamond .diamond-image,
.top-box.class-宜居 .header-diamond .diamond-image {
    background: url("http://backroomssandboxcn.wikidot.com/local--files/ttt/habitable") center/78% no-repeat !important;
}
 
.header-diamond .diamond-color.class-5,
.header-diamond .diamond-color.class-unknown,
.header-diamond .diamond-color.class-未知 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.header-diamond .diamond-color.class-habitable,
.header-diamond .diamond-color.class-宜居 {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.lang-cn .bottom-box.class-0 ul li:nth-child(1)>.default:after {
    content: "环境适宜" !important;
}
.lang-tr .bottom-box.class-0 ul li:nth-child(1)>.default:after {
    content: "環境適宜" !important;
}
.lang-cn .bottom-box.class-0 ul li:nth-child(2)>.default:after {
    content: "适合居住" !important;
}
.lang-tr .bottom-box.class-0 ul li:nth-child(2)>.default:after {
    content: "適合居住" !important;
}
.lang-cn .bottom-box.class-0 ul li:nth-child(3)>.default:after {
    content: "无实体" !important;
}
.lang-tr .bottom-box.class-0 ul li:nth-child(3)>.default:after {
    content: "無實體" !important;
}
 
.lang-cn .bottom-box.class-1 ul li:nth-child(1)>.default:after {
    content: "环境适宜" !important;
}
.lang-tr .bottom-box.class-1 ul li:nth-child(1)>.default:after {
    content: "環境適宜" !important;
}
.lang-cn .bottom-box.class-1 ul li:nth-child(2)>.default:after {
    content: "可居住" !important;
}
.lang-tr .bottom-box.class-1 ul li:nth-child(2)>.default:after {
    content: "可居住" !important;
}
.lang-cn .bottom-box.class-1 ul li:nth-child(3)>.default:after {
    content: "实体可驱逐" !important;
}
.lang-tr .bottom-box.class-1 ul li:nth-child(3)>.default:after {
    content: "實體可驅逐" !important;
}
 
.lang-cn .bottom-box.class-2 ul li:nth-child(1)>.default:after {
    content: "环境不适宜" !important;
}
.lang-tr .bottom-box.class-2 ul li:nth-child(1)>.default:after {
    content: "環境不適宜" !important;
}
.lang-cn .bottom-box.class-2 ul li:nth-child(2)>.default:after {
    content: "可居住" !important;
}
.lang-tr .bottom-box.class-2 ul li:nth-child(2)>.default:after {
    content: "可居住" !important;
}
.lang-cn .bottom-box.class-2 ul li:nth-child(3)>.default:after {
    content: "实体稀疏" !important;
}
.lang-tr .bottom-box.class-2 ul li:nth-child(3)>.default:after {
    content: "實體稀疏" !important;
}
 
.lang-cn .bottom-box.class-3 ul li:nth-child(1)>.default:after {
    content: "环境不适宜" !important;
}
.lang-tr .bottom-box.class-3 ul li:nth-child(1)>.default:after {
    content: "環境不適宜" !important;
}
.lang-cn .bottom-box.class-3 ul li:nth-child(2)>.default:after {
    content: "较难居住" !important;
}
.lang-tr .bottom-box.class-3 ul li:nth-child(2)>.default:after {
    content: "較難居住" !important;
}
.lang-cn .bottom-box.class-3 ul li:nth-child(3)>.default:after {
    content: "实体较少" !important;
}
.lang-tr .bottom-box.class-3 ul li:nth-child(3)>.default:after {
    content: "實體較少" !important;
}
 
.lang-cn .bottom-box.class-4 ul li:nth-child(1)>.default:after {
    content: "环境不适宜" !important;
}
.lang-tr .bottom-box.class-4 ul li:nth-child(1)>.default:after {
    content: "環境不適宜" !important;
}
.lang-cn .bottom-box.class-4 ul li:nth-child(2)>.default:after {
    content: "较难居住" !important;
}
.lang-tr .bottom-box.class-4 ul li:nth-child(2)>.default:after {
    content: "較難居住" !important;
}
.lang-cn .bottom-box.class-4 ul li:nth-child(3)>.default:after {
    content: "实体较多" !important;
}
.lang-tr .bottom-box.class-4 ul li:nth-child(3)>.default:after {
    content: "實體較多" !important;
}
 
.lang-cn .bottom-box.class-5 ul li:nth-child(1)>.default:after {
    content: "环境不适宜" !important;
}
.lang-tr .bottom-box.class-5 ul li:nth-child(1)>.default:after {
    content: "環境不適宜" !important;
}
.lang-cn .bottom-box.class-5 ul li:nth-child(2)>.default:after {
    content: "难以居住" !important;
}
.lang-tr .bottom-box.class-5 ul li:nth-child(2)>.default:after {
    content: "難以居住" !important;
}
.lang-cn .bottom-box.class-5 ul li:nth-child(3)>.default:after {
    content: "实体密集" !important;
}
.lang-tr .bottom-box.class-5 ul li:nth-child(3)>.default:after {
    content: "實體密集" !important;
}
 
.lang-cn .bottom-box.class-unknown ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-未知 ul li:nth-child(1)>.default:after {
    content: "属性未知" !important;
}
.lang-tr .bottom-box.class-unknown ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-未知 ul li:nth-child(1)>.default:after {
    content: "屬性未知" !important;
}
.lang-cn .bottom-box.class-unknown ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-未知 ul li:nth-child(2)>.default:after {
    content: "缺少数据" !important;
}
.lang-tr .bottom-box.class-unknown ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-未知 ul li:nth-child(2)>.default:after {
    content: "缺少數據" !important;
}
.lang-cn .bottom-box.class-unknown ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-未知 ul li:nth-child(3)>.default:after {
    content: "实体未知" !important;
}
.lang-tr .bottom-box.class-unknown ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-未知 ul li:nth-child(3)>.default:after {
    content: "實體未知" !important;
}
 
.lang-cn .bottom-box.class-habitable ul li:nth-child(1)>.default:after,
.lang-cn .bottom-box.class-宜居 ul li:nth-child(1)>.default:after {
    content: "安全可保障" !important;
}
.lang-tr .bottom-box.class-habitable ul li:nth-child(1)>.default:after,
.lang-tr .bottom-box.class-宜居 ul li:nth-child(1)>.default:after {
    content: "安全可保障" !important;
}
.lang-cn .bottom-box.class-habitable ul li:nth-child(2)>.default:after,
.lang-cn .bottom-box.class-宜居 ul li:nth-child(2)>.default:after {
    content: "环境可改造" !important;
}
.lang-tr .bottom-box.class-habitable ul li:nth-child(2)>.default:after,
.lang-tr .bottom-box.class-宜居 ul li:nth-child(2)>.default:after {
    content: "環境可改造" !important;
}
.lang-cn .bottom-box.class-habitable ul li:nth-child(3)>.default:after,
.lang-cn .bottom-box.class-宜居 ul li:nth-child(3)>.default:after {
    content: "实体可驱逐" !important;
}
.lang-tr .bottom-box.class-habitable ul li:nth-child(3)>.default:after,
.lang-tr .bottom-box.class-宜居 ul li:nth-child(3)>.default:after {
    content: "實體可驅逐" !important;
}

+ 版式代码

/*
   Beer Theme
   [Beer Theme]
   by TaRtaR0S.
*/
 
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
 
@import url('https://fonts.googleapis.com/css?family=Lato:400,900|PT+Mono|Poppins:600,800');
@import url('https://fonts.googleapis.com/css?family=Exo:400,800');
@import url('https://fonts.googleapis.com/css?family=Russo+One&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "Beer";
   --theme-name: "Beer";
 
   --logo-image: url("https://s1.ax1x.com/2022/07/17/j5zBoq.png");
   --header-title: "啤酒馆";
   --header-subtitle: "向每一个为生活奔波的人致敬";
 
    --body-font: 'Lato', sans-serif;
    --header-font: 'Russo One', 'ZCOOL XiaoWei', sans-serif;
    --title-font: 'CKTKingKong', sans-serif;
    --mono-font: "PT Mono", "Andale Mono", '仿宋', "Courier New", Courier, monospace;
 
   --white-monochrome: var(--bright-accent);
   --text-white-monochrome: 222, 222, 222;
   --pale-gray-monochrome: 255, 185, 97;
   --light-gray-monochrome: 90, 20, 20;
   --gray-monochrome: 90, 20, 20;
   --black-monochrome: 12, 12, 12;
   --bright-accent: 255, 185, 97;
   --medium-accent: 86, 23, 23;
   --dark-accent: 164, 107, 0;
   --pale-accent:  203,0, 183;
   --alt-accent: 234,88,255;
   --legacy-accent:  34,80, 121;
   --darker-legacy-accent: 45,53,67;
   --backrooms-yellow: 215,200,0;
 
   --swatch-topmenu-border-color: var(--medium-accent);
  --swatch-headerh1-color: 255, 255, 255;
  --swatch-headerh2-color: 255, 255, 255;
  --swatch-background: 255, 185, 97;
 
   --link-color: 198, 35,61;
   --hover-link-color: 198, 35,61;
   --visited-link-color: 198, 35,61;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 0%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
.scp-image-block .scp-image-caption {
    color: rgb(0,0,0);
    background-color: rgb(237, 127, 61);
    border:  0.2rem solid rgba(214, 76, 73);
    margin-top: 0.3rem;
}
 
.page-rate-widget-box {
    background: none;
    border:  0.2rem solid rgba(214, 76, 73);
    background-color: rgb(237, 127, 61);
}
 
#page-content .page-rate-widget-box a{
    background-color: rgb(237, 127, 61);
   color: rgb(0,0,0);
}
#page-content .page-rate-widget-box a:hover{
   background-color: rgb(86, 23, 23);
   color: rgb(255, 185, 97);
}
 
/*hexagon header gradient*/
#skrollr-body {
  background-image: none;
  background-color: rgb(86, 23, 23);
  height: 11rem;
}
 
/*blend gradient*/
#container {
   background-image: none;
   background: linear-gradient(180deg, rgba(255, 185, 97,0) 35%, rgb(255, 185, 97) 93%);
   background-size: 37rem 11rem;
   background-attachment: scroll;
   background-repeat: repeat-x;
}
 
#top-bar div.mobile-top-bar > ul > li > a,
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a,
#top-bar div.top-bar > ul > li > ul > li > a {
   color: rgb(255, 255, 255);
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -0.3rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
.yui-navset .yui-nav .selected a {
   color: rgb(var(--bright-accent)) !important;
}
 
table.wiki-content-table th {
   color: rgb(var(--text-white-monochrome));
}
 
#login-status {
   color: rgb(var(--bright-accent));
}
 
#login-status a {
   color: rgb(var(--bright-accent));
}
 
#search-top-box input.empty {
   color: rgb(var(--bright-accent));
}
 
/* fix sidebar scrollbar color */
#side-bar:hover, #side-bar:active, #side-bar:focus-within {
    scrollbar-color: unset !important;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(198, 35,61)
}
 
hr {
   background-color: #ffba60;
   border-top: solid 2px rgb(var(--gray-monochrome));
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(90, 20, 20,.25);
   border: solid 2px rgb(var(--gray-monochrome));
}
 
.code {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(90, 20, 20,.25);
   border: solid 2px rgb(var(--gray-monochrome));
}
 
.styled-quote {
   background-color:rgb(var(--bright-accent));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.styled-quote-d {
   background-color:rgb(var(--bright-accent));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   border-right: 0.5rem solid rgba(var(--gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.5rem solid rgba(var(--bright-accent));
   color: rgb(255,255,255);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote-d {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.5rem solid rgba(var(--bright-accent));
   border-right: 0.5rem solid rgba(var(--bright-accent));
   color: rgb(255,255,255);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(255, 185, 97);
}
 
.lightblock {
   background-color:rgb(var(--bright-accent));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.block {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--text-white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: rgb(255,255,255);
}
 
.darkblock a {
color: rgb(255, 185, 97);
}
 
.titleblock {
        background-color: rgb(var(--bright-accent));
        color:rgb(0,0,0);
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--gray-monochrome)) 2px;
     }
 
     .titlebox{
       color: rgb(255,255,255);
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--gray-monochrome));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.dark-titleblock {
        background-color: rgb(var(--gray-monochrome));
        color:rgb(255,255,255);
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
.dark-titleblock a {
color: rgb(255, 185, 97);
}
 
     .dark-titlebox{
       color: rgb(var(--gray-monochrome));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
/*
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
:root {
   --fade-in-delay: 0.1s; /* Change the speed here. */
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
*/

+ 版式代码

:root {
 --theme-base: "black-highlighter";
    --theme-id: "backcore-magezine";
    --theme-name: "Backrooms Core Journal Theme";
 
    /* Header */
       --logo-image: url("https://s1.ax1x.com/2022/08/11/vGgOzQ.png");
       --header-title: "后室核心期刊";
       --header-subtitle: "核心，科技。";
 
  /* 标准色 */
    --white-monochrome: 255, 255, 255;
    /* 白色 */
    --very-light-gray-monochrome: 56, 116, 248;
    /* 次强调色（应用于杂项） */
    --light-gray-monochrome: 135, 170, 230;
    /* 次强调色（登录时） */
    --gray-monochrome: 0, 0, 0;
    /* 灰色 */
    --black-monochrome: 0, 0, 0;
    /* 黑色 */
    --medium-accent: 0, 0, 136;
    /* 蓝色*/
    --dark-accent: 0, 0, 136;
    /* 深蓝色 */
    --dark-gray-monochrome: 0, 0, 136;
 
/* 评分模块颜色 */
   --rating-module-button-plus-color: var(--dark-accent);
   --rating-module-button-negative-color: var(--dark-accent);
   --rating-module-button-cancel-color: var(--dark-accent);
   --rating-module-button-credit-color: var(--black-monochrome);
 
/* 链接颜色 */
   --link-color: 0, 0, 136;
   --hover-link-color: 0, 0, 136;
   --visited-link-color: 0,0,0;
   --newpage-color: 68,0,136;
 
    /* 背景与网站标题色 */
    --background-gradient-color: var(--light-gray-monochrome);
    --header-gradient-color-bottom: var(--white-monochrome);
    --header-gradient-color-middle: var(--white-monochrome);
    --header-gradient-color-top: var(--white-monochrome);
 
    /* 主要主题色 */
    --swatch-background: var(--light-gray-blacmonochrome);
    --swatch-primary: var(--white-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--dark-accent);
}
 
/* 版头 */
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   background-image: var(--logo-image);
   opacity: 0.25;
}
 
#header h1 a::before, #header h2 span::before {
   color: #000088;
   text-shadow: none;
}
 
body::after {
    content: "";
    background-image: none;
    background-size: cover;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.5;
    z-index: -1;
}
 
#skrollr-body {
  background-image: none;
  background-color: white;
}
 
::-webkit-scrollbar {
   width: 10px;
   height: 10px;
   background-color: rgb(var(--white-monochrome)) !important;
   box-sizing: border-box;
}
 
::-webkit-scrollbar-thumb {
background-color: #000088;
}
 
#container {
  background-image: none;
}
 
#login-status a {
color: black
}
 
#login-status {
color: black
}
 
#login-status span {
color: black
}
 
#search-top-box {
 background-color: #00008825;
}
 
#main-content {
    border: 2px solid #000088;
    box-shadow: 1px 1px 3px 2px #00008840;
    padding: 2px 8px;
    margin-top: 16px;
}
 
#main-content p {
    text-indent: 16px;
}
 
hr + p,
blockquote > p:first-child,
div > p:first-child,
sup p {
    text-indent: 0 !important;
}
 
div.buttons input:hover{
   background-color: #ffffff;
   color: #000088;
}
 
div.buttons input:focus,
div.buttons input:focus-within{
   background-color: #ffffff;
   color: #000088;
}
 
#footer{
 margin: 16px 0 0 0;
}
 
hr {
    background: rgb(var(--dark-accent));
    border: 4px soild rgb(var(--dark-accent));
    margin: 0 2px;
}
 
/* 表格 */
table.wiki-content-table th {
 background-color: rgb(var(--dark-accent));
}
 
/* 图片块 */
.scp-image-block {
    border: 0.5rem soild #000088;
}
 
.scp-image-block .scp-image-caption {
    color: rgb(var(--white-monochrome));
    background-color: rgb(var(--gray-monochrome));
}
 
/*评分块*/
 
.page-rate-widget-box {
    background-color:rgba(var(--dark-accent),.5);
    border-left: 0.2rem solid rgba(var(--dark-accent));
}
 
/* TABVIEW */
 
.yui-navset .yui-content {
   background-color:rgba(var( --light-gray-monochrome), .25);
     border-color: rgba(var(--medium-accent), 1);
}
 
/*未选择的tab*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
     background-color: rgba(var(--light-gray-monochrome), .25);
    color:rgb(var(--black-monochrome));
}
 
/*鼠标移上去的tab*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
     background-color: rgba(var(--medium-accent), .8);
}
 
/*选了的tab*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
     background-color: rgba(var(--medium-accent), 1);
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
     background-color: rgba(var(--dark-accent), 1);
     color: #ffffff;
}
 
/* 标准引用块 */
blockquote, div.blockquote {
    border: none;
    background-color: #bbbbbb;
    background-opacity: 0.4
}
 
/* 代码块 */
.code {
    border: 1px solid;
    background-color: #bbbbbb;
}
 
/*标题块/暗色标题块(block是正文，box是标题)*/
.titleblock {
   background-color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--dark-accent)) 2px;
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--dark-accent));
  color: rgb(255,255,255);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.dark-titleblock {
   background-color: rgb(var(--dark-accent));
   color: rgb(255,255,255);
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(255,255,255) 2px;
}
 
.dark-titleblock a {
   color: white;
}
 
.dark-titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(255,255,255);
  color: rgb(0,0,136);
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
/*各种装饰块*/
 
.darkblock {
  background-color: rgb(0,0,136);
}
 
.darkblock a{
   color: #bbbbbb;
}
 
.styled-quote {
   background-color:rgb(255,255,255);
   border-left: 0.5rem solid rgba(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--dark-accent));
   border-left: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
   color: #bbbbbb;
}
 
.styled-quote-d {
   background-color:rgb(255,255,255);
   border-left: 0.5rem solid rgba(var(--dark-accent));
   border-right: 0.5rem solid rgba(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote-d {
   background-color:rgba(var(--dark-accent));
   border-left: 0.5rem solid rgba(255,255,255);
   border-right: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote-d a{
   color: #bbbbbb;
}
 
.borderblock{
    background-color:rgb(255,255,255);
    border: 0.5rem solid rgba(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-borderblock{
   background-color:rgb(var(--dark-accent));
   border: 0.5rem solid rgba(255,255,255);
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-borderblock a{
   color: #bbbbbb;
}
 
/*有logo或者别的什么图片的块*/
 
.logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
    }
 
.logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: var(--logo-image) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.border-logoblock{
        padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
     border: solid 0.3rem rgb(var(--dark-accent));
    }
 
.border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: var(--logo-image) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
/*奇奇怪怪的阴影块*/
.shadowblock{
        padding: 0.01rem 1rem;
    box-shadow: 0.4rem 0.4rem rgba(0,0,136,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: white;
    border: solid 0.3rem rgb(var(--dark-accent));
    }
 
.inset-shadowblock{
        padding: 0.01rem 1rem;
    box-shadow: inset 5em 1em rgba(128,128,128,.25), inset 8em 2em rgba(0,0,0,.25), 0.1rem 0.2rem 0.2rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--white-monochrome));
    border: solid 0.3rem rgb(var(--dark-accent));
    }
 
/* 特殊块 */
.letterquote {
   background-color: none;
   border: 0.2rem solid rgba(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   text-indent: none;
}
 
.letterquote::first-letter {
    font-size:xx-large;
}
 
.newspaper
{
    -moz-column-count:4; /* Firefox */
    -webkit-column-count:4; /* Safari and Chrome */
    column-count:4;
 
    -moz-column-gap:40px; /* Firefox */
    -webkit-column-gap:40px; /* Safari and Chrome */
    column-gap:40px;
 
    -moz-column-rule:0.2rem solid rgba(var(--dark-accent)); /* Firefox */
    -webkit-column-rule:0.2rem solid rgba(var(--dark-accent)); /* Safari and Chrome */
    column-rule:0.2rem solid rgba(var(--dark-accent));
 
/*我也不知道这是什么总之gp叠说这玩意防止溢出*/
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
    word-warp: break-word;
}
 
.scroll-box {
   background-color: none;
   border: 0.2rem solid rgba(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   max-height: 400px;
   overflow-y: auto;
}
 
.container-box{
  display:flex;
  width:100%;
}
 
.thinbox{
  width:20%;
  margin:auto;
  padding:10px;
}
 
.thinbox h2{
    color: white;
    background-color:#000088;
    font-size:30px;
    margin-left:-8px;
    margin-right:-8px;
    margin-top:-8px;
    padding:5px 10px;
}
 
.widebox{
  width:80%;
  margin:auto;
}
 
/* 单页迭代 */
 
.page,
.top:target ~ .start {
   display: none;
}
.top:target + .page {
   display: block;
}
.top {
   position: absolute;
   top: 0;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Architects+Daughter&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Yeseva+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
 
@font-face {
    font-family: 'XiaolaiSC';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/XiaolaiSC-Regular.woff') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
:root {
 
   --theme-base: "black-highlighter";
   --theme-id: "梦境";
   --theme-name: "许愿梦境";
 
   --logo-image: url(https://backrooms-sandbox-2.wdfiles.com/local--files/mc-crafter-24-7/DreamLogo.png);
   --header-title: "The Backrooms";
   --header-subtitle: "活在梦境中";
 
   --body-font: 'Architects Daughter', 'XiaolaiSC', 'Noto Serif SC', cursive;
   --header-font: 'Architects Daughter', 'XiaolaiSC', 'Noto Serif SC', cursive;
   --title-font: 'Architects Daughter', 'XiaolaiSC', 'Noto Serif SC', cursive;
   --white-monochrome: 239, 211, 241;
   --pale-gray-monochrome: 255, 215, 245;
   --gray-monochrome: 200, 200, 200;
   --dark-gray-monochrome: 99, 91, 99;
   --black-monochrome: 30, 30, 30;
   --bright-accent: 120, 120, 120;
   --medium-accent: 100, 100, 100;
   --dark-accent: 130, 120, 130;
   --pale-accent: 255, 255, 255;
   --swatch-text-light: 255, 255, 255;
   --swatch-menutxt-light-color: 255, 255, 255;
   --rating-module-button-plus-color: 150, 150, 150;
   --rating-module-button-negative-color: 150, 150, 150;
   --rating-module-button-cancel-color: 150, 150, 150;
   --rating-module-button-credit-color: 150, 150, 150;
}
 
#skrollr-body {
    background-image: url("http://backrooms-wiki.wikidot.com/local--files/theme:to-wish-upon-a-dream/CloudsTilable.jpg");
    background-size: auto 12rem;
}
 
@media only screen and (max-width: 425px) {
    #skrollr-body {
        background-image: url("http://backrooms-wiki.wikidot.com/local--files/theme:to-wish-upon-a-dream/CloudTexture08.jpg");
        background-size: inherit
    }
}
 
#header::before {
    opacity: 1;
}
 
#login-status {
   color: rgb(var(--swatch-text-light));
}
 
#account-topbutton {
   border-color: rgb(var(--swatch-text-light));
}
 
.lightblock {
   background-color:rgb(235,235,235);
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(235,235,235);
   border-left: 0.5rem solid rgb(130,130,130);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(59,59,59);
   color:rgb(235,235,235);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
   font-family: 'Yeseva One', 'Noto Serif SC', cursive;
   --title-font: 'Yeseva One', 'Noto Serif SC', cursive;
}
 
.dark-styled-quote {
   background-color:rgb(59,59,59);
   color:rgb(235,235,235);
   border-left: 0.5rem solid rgb(70,70,70);
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
   font-family: 'Yeseva One', 'Noto Serif SC', cursive;
   --title-font: 'Yeseva One', 'Noto Serif SC', cursive;
}
 
blockquote {
     background-color:rgb(255, 255, 255);
     font-family: 'Architects Daughter', 'XiaolaiSC', cursive;
}
 
.wiki-content-table th {
    color: #F5F5F5 !important;
    background-color: #646464 !important;
}
 
.darkblock h1,
.darkblock h2,
.darkblock h3,
.darkblock h4,
.darkblock h5,
.darkblock h6 {
   color: rgb(235, 235, 235);
}
 
.dark-styled-quote h1,
.dark-styled-quote h2,
.dark-styled-quote h3,
.dark-styled-quote h4,
.dark-styled-quote h5,
.dark-styled-quote h6 {
   color: rgb(235, 235, 235);
}
 
.top-box {
   border-color: rgb(59, 54, 59) !important;
}
 
.bottom-box ul li {
   color: rgb(59, 54, 59) !important;
}
 
.bottom-box ul li:before {
   background: rgb(59, 54, 59) !important;
}
 
.top-box .gradient-box {
  background: linear-gradient(90deg, rgba(59, 54, 59, 1) 0%, rgba(59, 54, 59, 0) 36%) !important;
}
 
.header-diamond {
   background-image: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 300.9 284.5' style='enable-background:new 0 0 300.9 284.5;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%233b363b;%7D .st1%7Bfill:%233b363b;%7D%0A%3C/style%3E%3Cg%3E%3Cpolygon class='st1' points='73.4,32.6 0,105.4 13.6,105.4 86.4,32.6 '/%3E%3Cpolygon class='st1' points='26.5,105.4 40.1,105.4 112.9,32.6 99.3,32.6 '/%3E%3C/g%3E%3Cpolyline class='st1' points='287.3,105.4 214.5,32.6 227.5,32.6 287.3,91.9 '/%3E%3Cpolygon class='st1' points='274.4,105.4 260.8,105.4 188,32.6 201.6,32.6 '/%3E%3C/svg%3E") !important;
}
 
.top-box.class-unknown .header-diamond { filter: none !important; }
.top-box.class-unknown:before, .top-box.class-unknown .header-diamond .diamond-pattern{ opacity: 0.15 !important; }
 
.top-box .header-diamond .diamond-image {
   filter: brightness(0%) invert(100%);
}
 
.top-box.class-0,
.header-diamond .diamond-color.class-0 {
   background: rgb(251, 182, 203) !important;
}
 
.top-box.class-1,
.header-diamond .diamond-color.class-1 {
   background: rgb(249, 134, 168) !important;
}
 
.top-box.class-2,
.header-diamond .diamond-color.class-2 {
   background: rgb(247, 85, 133) !important;
}
 
.top-box.class-3,
.header-diamond .diamond-color.class-3 {
   background: rgb(245, 36, 98) !important;
}
 
.top-box.class-4,
.header-diamond .diamond-color.class-4 {
   background: rgb(219, 10, 73) !important;
}
 
.top-box.class-5,
.header-diamond .diamond-color.class-5 {
   background: rgb(170, 8, 57) !important;
}
 
.top-box.class-unknown,
.header-diamond .diamond-color.class-unknown {
   background: rgb(59, 54, 59) !important;
}
 
.top-box.class-habitable,
.header-diamond .diamond-color.class-habitable {
   background: rgb(247, 85, 133) !important;
}

+ 版式代码

/*fonts*/
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');
@import url('https://fonts.googleapis.com/css?family=Basic|IBM+Plex+Mono:400,700');
@font-face {
    font-family: 'ChillGSans';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/ChillGSans.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
:root {
    --theme-base: "black-highlighter";
    --theme-id: "stardust";
    --theme-name: "Stardust Theme";
 
    /* Header */
    --logo-image: url("http://backrooms-wiki.wikidot.com/local--files/component:theme/logo.svg");
    --header-title: "The Backrooms";
    --header-subtitle: "触及群星";
 
    /* Typefaces */
   --body-font: proxima-nova, 'Noto Sans SC', sans-serif;
   --header-font: 'Fantasque Sans Mono', 'ChillGSans', sans-serif;
   --title-font: 'Fantasque Sans Mono', 'ChillGSans', sans-serif;
   --mono-font: 'Fantasque Sans Mono', 'Noto Serif SC', serif;
 
    /* Standard Colors */
    --white-monochrome: 250, 250, 250;
     /* white*/
    --black-monochrome: 0, 0, 0;
    /* black */
    --bright-accent: 71, 213, 240;
    /* the bright blue */
    --medium-accent: 167, 27, 59;
     /* the bright blue animated */
    --dark-accent: 24, 36, 56;
    /* dark blue for background*/
 
    /* Primary Theme Colors */
    --swatch-background: var(--black-monochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--black-monochrome);
 
    /* Primary Text Colors */
    --swatch-text-dark: var(--white-monochrome);
    --swatch-text-light: var(--white-monochrome);
    --swatch-important-text: var(--bright-accent);
    --barColour: var(--very-light-gray-monochrome);
    --linkColour: var(--pale-accent);
 
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--black-monochrome);
    --swatch-menubg-light-color: var(--pale-gray-monochrome);
    --swatch-menubg-medium-color: var(--light-gray-monochrome);
    --swatch-menubg-medium-dark-color: var(--gray-monochrome);
    --swatch-menubg-dark-color: var(--dark-gray-monochrome);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--black-monochrome);
    --swatch-menutxt-dark-color: var(--white-monochrome);
    --swatch-menutxt-light-color: var(--white-monochrome);
    --swatch-border-color: var(--bright-accent);
 
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
    --swatch-topmenu-border-color: var(--bright-accent);
    --swatch-topmenu-bg-color: var(--black-monochrome);
 
    /* Link Colors */
    --link-color: var(--bright-accent);
    --visited-link-color: var(--medium-accent);
    --hover-link-color: var(--bright-accent);
    --sidebar-links-text: var(--swatch-menutxt-dark-color);
    --link-color-bright: var(--medium-accent);
 
/* Rating Module Colors */
    --rating-module-button-color: var(--black-monochrome);
    --rating-module-text-color: var(--swatch-menutxt-dark-color);
    --rating-module-text-hover-color: var(--swatch-menutxt-light-color);
 
/* Header Gradients */
--gradient-header: none;
--diagonal-stripes: none;
 
}
 
/*weird stuff*/
 
#login-status {
    color: rgb(var(--bright-accent));
}
 
hr {
  background-color: rgb(var(--bright-accent));
  border-color: rgb(var(--bright-accent));
}
 
#page-title {
    border-color: rgb(var(--bright-accent));
    color: rgb(var(--bright-accent))!important;
}
 
#skrollr-body {
   background-image: none;
}
 
div#container-wrap{
    background: url(http://vivarium.wdfiles.com/local--files/backrooms%3Astarstheme/coolbgfr.jpg) top center repeat-x;
    background-size: 100%;
}
 
#container {
   background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 37%);
   background-size: 37rem 37rem;
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
/* Header Colours */
h1, h2, h3, h4, h5, h6 {
    color: rgb(var(--bright-accent));
}
 
/*image block*/
.scp-image-block .scp-image-caption {
    color: rgb(var(--bright-accent));
    background-color: rgba(var(--bright-accent), .25);
    border-color: rgba(var(--bright-accent), .25);
}
 
/*rate module*/
.page-rate-widget-box {
    background: rgba(var(--bright-accent), .5);
    border-color: rgba(var(--black-monochrome));
    border-width: 0px;
}
 
/*table*/
table.wiki-content-table th {
border: 1px solid rgb(var(--medium-accent)) !important;
background-color: rgba(var(--medium-accent), .25);
color: rgb(var(--medium-accent));
}
 
table.wiki-content-table td {
border: 1px solid rgb(var(--medium-accent)) !important;
}
 
/*search box*/
#search-top-box-input {
    background-color: rgba(var(--bright-accent), .25);
}
#search-top-box-input:hover,
#search-top-box-input:focus {
    background: rgba(var(--medium-accent), .25);
}
 
/*buttons*/
div#page-options-bottom > a:hover,
div#page-options-bottom > a:active,
div#page-options-bottom-2 > a:hover,
div#page-options-bottom-2 > a:active {
    background-color: rgba(var(--bright-accent), .25);
}
 
/*top bar*/
#top-bar div.top-bar > ul > li > ul,
#top-bar div.mobile-top-bar > ul > li > ul {
    background-color: rgba(var(--bright-accent), 0.5);
}
 
#top-bar div.top-bar > ul > li > a:hover,
#top-bar div.mobile-top-bar > ul > li > a:hover {
    background-color: rgba(var(--bright-accent), 0.5);
}
 
#top-bar div.top-bar > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li:hover > a {
    background-color: rgba(var(--bright-accent), 0.5);
}
 
/* TABVIEW - Abandon All Hope Ye Who Enter Here */
 
.yui-navset .yui-content {
   background-color:rgba(var(--medium-accent), .25);
     border-color: rgba(var(--medium-accent), 1);
}
 
/*unselected tab color*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
     background-color: rgba(var(--medium-accent), .25);
    color:rgb(var(--white-monochrome));
}
 
/*hover tab bg*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
     background-color: rgba(var(--bright-accent), .25);
}
 
/*selected tab bg*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
     background-color: rgba(var(--medium-accent), 1);
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
     background-color: rgba(var(--medium-accent), 1);
}
 
/*backer background*/
 
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    background: rgb(var(--black-monochrome));
}
 
/*mobile stuff*/
@media only screen and (max-width:768px){
 
:root{
   --header-height-on-mobile: 7.5rem;
}
 
#main-content {
max-width: 90vw;
padding: 0;
margin: 9.2em auto 0;
}
 
#header {
position: absolute;
top: 0rem;
height: var(--header-height-on-mobile);
}
 
div#container-wrap{
    background: url(http://vivarium.wdfiles.com/local--files/backrooms%3Astarstheme/coolbgfr.jpg) top center repeat-x;
    background-size: 220%;
}
 
#container {
   background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 37%);
   background-size: 20rem 20rem;
   background-attachment: scroll;
}
}
 
@media only screen and (max-width:1366px){
#container {
   background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 37%);
   background-size: 25rem 25rem;
   background-attachment: scroll;
}
div#container-wrap{
    background: url(http://vivarium.wdfiles.com/local--files/backrooms%3Astarstheme/coolbgfr.jpg) top center repeat-x;
    background-size: 160%;
}
}
 
/*funny blocks*/
blockquote, .blockquote, div.blockquote, [class*="blockquote"] {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color:rgba(var(--bright-accent), .25);
   border-color: rgb(var(--bright-accent));
}
 
.styled-quote {
   background-color:rgba(var(--bright-accent), .25);
   border-left: 0.5rem solid rgb(var(--bright-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgba(var(--medium-accent), .25);
   border-left: 0.5rem solid rgb(var(--medium-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgba(var(--bright-accent), .25);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgba(var(--medium-accent), .25);
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
#header h1 a::before,
#header h2 span::before {
    --text-shadow: 0px 2px 3px rgba(0,0,0,0.8);
}
 
.modalbox {
    color: rgb(0,0,0);
}

看看CSS

@import url('https://fonts.googleapis.com/css2?family=ZCOOL+KuaiLe&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
 
@import url("https://fonts.googleapis.com/css2?family=Lemon&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Lobster&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Urbanist:wght@600&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Urbanist:wght@800&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Monoton&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Grand+Hotel&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Fugaz+One&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Atomic+Age&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Poiret+One&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Life+Savers&display=swap");
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "Retro";
   --theme-name: "Retro Theme";
 
   --logo-image: url("");
   --header-title: "The Backrooms";
   --header-subtitle: "24/7 营业";
 
    --body-font: 'Urbanist', sans-serif;
    --header-font: 'Lemon', 'ZCOOL KuaiLe';
    --title-font: 'Lobster', 'ZCOOL KuaiLe';
    --mono-font: 'Life Savers', 'Noto Serif SC';
    --top-font: 'Grand Hotel', 'ShouShuti';
    --additional-font: 'Monoton', monospace;
    --diner-font: 'Fugaz One', CKTKingKong;
    --item-font: 'Atomic Age', 'ZCOOL KuaiLe';
    --price-font: 'Poiret One', sans-serif;
    --food-font: CKTKingKong, sans-serif;
 
   --white-monochrome:  230, 189, 171;
   --text-white-monochrome: 193,121,63;
   --pale-gray-monochrome: 76, 184, 180;
   --light-gray-monochrome: 220, 116, 86;
   --gray-monochrome: 234, 96, 37;
   --black-monochrome: 158, 81, 37;
   --bright-accent: 108, 33, 11;
   --medium-accent: 21, 109, 130;
   --dark-accent: 232, 131, 87;
   --pale-accent: 215,160,210;
   --alt-accent: 235, 129, 69;
   --vibrant-orange: 237,121,70;
   --retro-blue: 25,77,114;
   --muted-yellow: 253,172,59;
   --muted-orange: 229,120,30;
   --retro-white: 255,250,245;
 
   --swatch-topmenu-border-color: 159, 44, 9;
   --swatch-headerh1-color: 246, 164, 182;
   --swatch-headerh2-color: 246, 164, 182;
 
   --rating-module-button-plus-color: var(--retro-blue);
   --rating-module-button-negative-color: var(--retro-blue);
 
   --rating-module-text-color: var(--retro-blue);
   --rating-module-text-hover-color: var(--retro-blue);
 
   --link-color: 253, 109, 76;
   --hover-link-color: 240, 144, 122;
   --visited-link-color: 213,131,83;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 0%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://backrooms-wiki.wikidot.com/local--files/theme:retro/header");
    background-repeat: repeat-1;
    background-size:  inherit;
    background-blend-mode: soft-light;
    background-color: rgba(218, 88, 33, 0.5);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--dark-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
#top-bar div.mobile-top-bar > ul > li > a,
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a,
#top-bar div.top-bar > ul > li > ul > li > a {
   color: white;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 0.19em;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
   font-size: 2em;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 1.65rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   font-size: 1.25em;
}
 
.yui-navset .yui-nav a {
   color: rgb(var(--retro-blue)) !important;
}
 
.yui-navset .yui-nav .selected a {
   color: rgb(var(--retro-white)) !important;
}
 
.yui-navset .yui-content {
    color: rgb(var(--retro-blue));
    border-color: rgb(var(--retro-blue));
}
 
table.wiki-content-table th {
   background-color: rgb(var(--pale-gray-monochrome));
   color: rgb(var(--retro-blue));
}
 
#login-status {
   color: rgb(var(--bright-accent));
}
 
#login-status a {
   color: rgb(var(--bright-accent));
}
 
#search-top-box input.empty {
   color: rgb(var(--bright-accent));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--alt-accent))
}
 
blockquote {
   background-color: rgb(var(--muted-yellow));
   border: 3px solid rgb(var(--muted-orange));
   box-shadow: rgb(var(--muted-orange)) 1px 1px 0px 0px, rgb(var(--muted-orange)) 2px 2px 0px 0px, rgb(var(--muted-orange)) 3px 3px 0px 0px, rgb(var(--muted-orange)) 4px 4px 0px 0px, rgb(var(--muted-orange)) 5px 5px 0px 0px;
}
 
.border-block {
   background-color: rgb(250, 250, 234);
   color: #e5554c;
   border: 0.35rem solid #e5554c;
   border-radius: 10px;
   padding: 0.01rem 1rem;
}
 
code,
.code {
   background-color: rgb(var(--muted-yellow));
}
 
:root{
  --base-color: rgb(var(--muted-yellow));
  --hover-color: rgb(240,177,87);
  --click-color: rgb(214,140,38);
}
 
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    border-radius: 15px 15px 0px 0px;
    border: 2px solid rgb(var(--muted-orange));
    box-shadow: rgb(var(--muted-orange)) 0px 0px 3px 0px;
    transition: background 0.1s linear;
    background: var(--base-color);
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
 
#page-content .collapsible-block-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
}
 
#page-content .collapsible-block-link:hover {
    text-decoration: none
}
 
#page-content .collapsible-block-content {
    transition: border-top-color 0.2s linear, border-bottom-color 0.2s linear;
    border-top: solid rgb(var(--muted-orange)) 5px;
    border-top-right-radius: 15px;
    border-bottom: solid rgb(var(--muted-orange)) 3px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}
 
#page-content .collapsible-block-folded {
    max-width: 100%;
}
#page-content .collapsible-block-unfolded-link{
    width: min-content;
}
 
#page-content .collapsible-block-folded .collapsible-block-link::before {
    content: "▷";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
#page-content .collapsible-block-unfolded .collapsible-block-link::before {
    content: "▽";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
 
#page-content .collapsible-block-folded:hover, #page-content .collapsible-block-unfolded-link:hover {
    background: var(--hover-color);
    max-width: 100%;
}
 
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content{
    border-top-color: var(--hover-color);
    border-bottom-color: var(--hover-color);
}
 
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content::after {
    background: var(--hover-color);
}
 
#page-content .collapsible-block-folded:active, #page-content .collapsible-block-unfolded-link:active, #page-content .collapsible-block-unfolded-link:active + .collapsible-block-content::after {
    transition: background 0s, max-width 0s;
    background: var(--click-color);
    max-width: 100%;
}
 
#page-content .collapsible-block-unfolded-link:active + .collapsible-block-content {
    transition: border-top-color 0s, border-bottom-color 0s;
    border-top-color: var(--click-color);
    border-bottom-color: var(--click-color);
}
 
#page-content .unfolded-collapse {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px;
    background: var(--base-color);
    color: white;
    font-weight: bold;
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
 
#page-content .unfolded-collapse::before {
    content: "▽";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
 
#page-content .unfolded-collapse-border {
    display: block;
    width: 700px;
    border-top: solid var(--base-color) 5px;
}
 
#page-content .center-collapse .collapsible-block-folded, #page-content .center-collapse .collapsible-block-unfolded-link, #page-content .center-collapse .unfolded-collapse{
    margin:auto;
    margin-top: 10px;
}
 
#page-content .addendumfooter{
    display: block;
    border-bottom: solid 3px var(--base-color);
    margin: auto;
    text-align: center;
}
 
#page-content .info-container .collapsible-block {
    counter-increment: none;
}
 
#page-title{
    font-family: var(--top-font);
    border-bottom: 2px double rgb(var(--vibrant-orange));
    text-align: center;
    font-size: 45px;
    text-shadow: .063rem 0.1rem 0.1rem #612f05;
    color: rgb(var(--vibrant-orange));
}
 
#page-content .info-container .collapsible-block-folded, #page-content .info-container .collapsible-block-unfolded-link  {
    transition: none;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    box-shadow: none;
    background: var(--barColour);
}
 
#page-content .info-container .collapsible-block-folded::before, #page-content .info-container .collapsible-block-unfolded-link::before  {
    content: "";
    display: none;
}
 
#page-content .info-container .collapsible-block-content {
    border-bottom: none;
    transition: none;
    border-top: none;
}
 
#page-content .info-container .collapsible-block-content::after {
    display: none;
}
 
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded, #page-content .unfolded-collapse{
    line-height: 1.4;
}
 
#page-content .collapsible-block-folded .collapsible-block-link::before, #page-content .collapsible-block-unfolded .collapsible-block-link::before, #page-content .unfolded-collapse::before {
    font-size: 130%;
    margin-left: -0.4em
}
 
.menu-top {
    font-family: var(--diner-font);
    text-align: center;
    font-size: 2.5em;
    transform:rotate(-5deg);
    -ms-transform:rotate(-5deg);
    -webkit-transform:rotate(-5deg);
    text-shadow: 1px 2px 0px #c62927;
}
 
.border-block hr{
    border-color: #e5554c;
}
 
table.menu td.category {
    width: 100%;
    font-family: var(--item-font);
    font-size: 1.75em;
    font-weight: bold;
    padding: 0.3em 1em 0em 1em;
    border-bottom: 0.25rem solid #e5554c;
}
 
table.menu td.food {
    font-family: var(--food-font);
    padding: 0.1em 0 0.1em 0.4em;
}
 
table.menu td.price {
    font-family: var(--price-font);
    font-weight: bold;
    padding: 0.1em 0 0.1em 0;
}
 
h1, h2, h3, h4, h5, h6 {
    font-family: var(--title-font);
color: #f6869e;
}
 
h1, #header h1 a::before {
text-shadow: -1px 1px #7e0303, 1px -1px #7e0303,
    -1px -1px #7e0303, 1px 1px #7e0303, 2px 2px #7e0303,
    3px 3px #7e0303, 4px 4px #7e0303, 5px 5px #7e0303;
}
 
h2, #header h2 span::before {
text-shadow: -1px 1px #7e0303, 1px -1px #7e0303,
    -1px -1px #7e0303, 1px 1px #7e0303, 2px 2px #7e0303,
    3px 3px #7e0303, 4px 4px #7e0303;
}
 
h3, h4 {
text-shadow: -1px 1px #7e0303, 1px -1px #7e0303,
    -1px -1px #7e0303, 1px 1px #7e0303, 2px 2px #7e0303,
    3px 3px #7e0303;
}
 
h5, h6 {
text-shadow: -1px 1px #7e0303, 1px -1px #7e0303,
    -1px -1px #7e0303, 1px 1px #7e0303, 2px 2px #7e0303;
}
 
hr{
    border-top: 4px double rgb(var(--medium-accent));
    text-align: center;
    background-color: rgba(0, 0, 0, 0);
}
.retro-hr hr:after {
        font-family: var(--additional-font);
    content: '—*O*—';
    display: inline-block;
    position: relative;
    top: -19.5px;
    padding: 0 10px;
    font-size: 24px;
    background: #e6bcaa;
    color: rgb(var(--medium-accent));
}
 
.scp-image-block.block-right {
   border: 2px solid #33929b;
   box-shadow: rgb(var(--medium-accent)) 1px 1px 0px 0px, rgb(var(--medium-accent)) 2px 2px 0px 0px, rgb(var(--medium-accent)) 3px 3px 0px 0px, rgb(var(--medium-accent)) 4px 4px 0px 0px, rgb(var(--medium-accent)) 5px 5px 0px 0px;
}
 
.scp-image-caption {
   color: rgb(var(--retro-blue));
}
 
.page-rate-widget-box {
    background: rgb(var(--pale-gray-monochrome));
    border: 2px solid rgb(var(--medium-accent));
    box-shadow: rgb(var(--medium-accent)) 1px 1px 0px 0px, rgb(var(--medium-accent)) 2px 2px 0px 0px, rgb(var(--medium-accent)) 3px 3px 0px 0px, rgb(var(--medium-accent)) 4px 4px 0px 0px, rgb(var(--medium-accent)) 5px 5px 0px 0px;
}
 
.page-rate-widget-box .rate-points,
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown,
.page-rate-widget-box .cancel,
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a,
.page-rate-widget-box .cancel a {
    color: rgb(var(--retro-blue));
}
 
.yquote, .pquote, .bquote {
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
}
 
.yblock, .pblock, .bblock {
   padding: 0.01rem 1rem;
}
 
.yblock, .yquote {
   background-color: rgb(var(--muted-yellow));
   border: 3px solid rgb(var(--muted-orange));
   box-shadow: rgb(var(--muted-orange)) 1px 1px 0px 0px, rgb(var(--muted-orange)) 2px 2px 0px 0px, rgb(var(--muted-orange)) 3px 3px 0px 0px, rgb(var(--muted-orange)) 4px 4px 0px 0px, rgb(var(--muted-orange)) 5px 5px 0px 0px;
}
 
.pblock, .pquote {
   background-color: rgb(var(--swatch-headerh1-color));
   border: 3px solid #f6869e;
   box-shadow: #f6869e 1px 1px 0px 0px, #f6869e 2px 2px 0px 0px, #f6869e 3px 3px 0px 0px, #f6869e 4px 4px 0px 0px, #f6869e 5px 5px 0px 0px;
   color: #7e0303;
}
 
.bblock, .bquote {
   background-color: rgb(var(--pale-gray-monochrome));
   border: 3px solid rgb(var(--medium-accent));
   box-shadow: rgb(var(--medium-accent)) 1px 1px 0px 0px, rgb(var(--medium-accent)) 2px 2px 0px 0px, rgb(var(--medium-accent)) 3px 3px 0px 0px, rgb(var(--medium-accent)) 4px 4px 0px 0px, rgb(var(--medium-accent)) 5px 5px 0px 0px;
   color: rgb(var(--retro-blue));
}
 
.yquote {
   border-left: 0.85rem solid rgb(var(--muted-orange));
}
 
.pquote {
   border-left: 0.85rem solid #f6869e;
}
 
.bquote {
   border-left: 0.85rem solid rgb(var(--medium-accent));
}
 
.footnotes-footer {
    border: 3px solid #db3920;
    border-left: 0.85rem solid #db3920;
    box-shadow: #db3920 1px 1px 0px 0px, #db3920 2px 2px 0px 0px, #db3920 3px 3px 0px 0px, #db3920 4px 4px 0px 0px, #db3920 5px 5px 0px 0px;
}
 
#account-options{
    background-color: rgb(var(--pale-gray-monochrome));
    border: 3px solid rgb(var(--medium-accent));
    box-shadow: rgb(var(--medium-accent)) 1px 1px 0px 0px, rgb(var(--medium-accent)) 2px 2px 0px 0px, rgb(var(--medium-accent)) 3px 3px 0px 0px;
}
 
#account-options a {
    color: rgb(var(--retro-blue));
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Sarabun:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fugaz+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap');
 
@font-face {
    font-family: 'ZihunBiantaoti';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/ZihunBiantaoti.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
 
@font-face {
    font-family: 'GlowSansSC-Normal';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Normal-Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
:root {
 
   --logo-image: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/Refractifa_Logo.png);
   --header-title: "刻面折射";
   --header-subtitle: "绚丽的色彩是一个奇迹";
 
   --body-font: 'Sarabun', 'Noto Sans SC', sans-serif;
   --header-font: 'Fugaz One', 'ZihunBiantaoti', sans-serif, cursive;
   --title-font: 'Fugaz One', 'ZihunBiantaoti', sans-serif, cursive;
   --mono-font: 'Montserrat', 'GlowSansSC-Normal', sans-serif;
 
   --white-monochrome: 29, 26, 74;
   --pale-gray-monochrome: 116, 191, 214;
   --light-gray-monochrome: 116, 191, 214;
   --dark-gray-monochrome: 77, 144, 196;
   --gray-monochrome: 71, 83, 173;
   --black-monochrome: 255, 255, 255;
   --bright-accent: 48, 59, 255;
   --medium-accent: 64, 227, 213;
   --dark-accent: 201, 255, 223;
   --pale-accent: 140, 136, 126;
 
   --link-color: 0, 255, 204;
   --hover-link-color: 190, 59, 255;
   --swatch-topmenu-border-color: 201, 255, 223;
 
   --rating-module-button-plus-color: 0, 255, 195;
   --rating-module-button-negative-color: 3, 0, 161;
   --rating-module-button-cancel-color: 132, 0, 255;
 
/*SPECIAL THEME VARIABLES*/
 
   --chrys-l: 184, 255, 255;
   --chrys-d: 0, 255, 221;
   --amethyst-l: 119, 65, 176;
   --amethyst-d: 83, 0, 171;
   --ruby-l: 255, 25, 25;
   --ruby-d: 176, 9, 9;
   --onyx-l: 23, 16, 31;
   --onyx-d: 15, 0, 31;
   --topaz-l: 230, 127, 76;
   --topaz-d: 189, 63, 0;
   --citrine-l: 255, 225, 105;
   --citrine-d: 222, 177, 0;
   --jade-d: 30, 105, 9;
   --jade-l: 123, 232, 93;
   --sapphire-l: 82, 109, 247;
   --sapphire-d: 17, 43, 173;
   --tourm-l: 245, 81, 157;
   --tourm-d: 191, 17, 98;
   --dia-l: 255, 255, 255;
   --dia-d: 135, 135, 135;
 
  --rock-color: 200, 200, 200;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 80%;
   width: 80%;
   background-image: var(--logo-image);
   background-size: auto 7rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 0.6;
   left: 8rem;
   top: 0rem;
}
 
#header h1 a::before {
   position: absolute;
   top: 1rem;
   left: 14rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
#header h2 span::before {
   position: absolute;
   top: 1.3rem;
   left: 14rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
#header h1 a::before, #header h2 span::before {
   color: #FFFFFF
}
 
/*Mobile Header Image Alignment*/
 
@media (max-width: 878px) {
 
#header::before {
 
   position: absolute;
 
   left: 0;
 
   top: 10px;
 
}
 
#header h1, #header h1 a::before {
 
   position: absolute;
 
   top: 1rem;
 
   left: 3rem;
 
   margin: 0;
 
   width: 100%;
 
   display: flex;
 
   justify-content: left;
 
   z-index: 0;
 
}
 
#header h2, #header h2 span, #header h2 span::before {
 
   position: absolute;
 
   top: 1.5rem;
 
   left: 2rem;
 
   margin: 0;
 
   width: 100%;
 
   display: flex;
 
   justify-content: left;
 
   z-index: 0;
 
}
 
.footnotes-footer {
 
   overflow-x: hidden;
 
}
 
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/meghan-hessler-Uc6_kr4_Baw-unsplash.jpg");
    background-size: inherit;
}
 
#search-top-box-input {
   background: #d1fffd;
   color: #30c2bb;
   border-color: #30c2bb;
}
 
#search-top-box-input:hover,
#search-top-box-input:focus {
    background: #30c2bb;
    color: #15304d;
}
 
#search-top-box-form input[type="submit"] {
    background: #264c9e;
    color: white;
}
 
#search-top-box-form input[type="submit"]:hover {
    background: #723da8;
    color: white;
}
 
#search-top-box input.empty {
     color: #30c2bb;
}
 
#side-bar .heading p, #side-bar .side-block>.collapsible-block .collapsible-block-link {
   color: white;
    --text-shadow: grey;
}
 
.scp-image-block .scp-image-caption {
   background-color: rgb(var(--rock-color));
   color: black;
}
 
#account-options {
   background-color: rgb(var(--sapphire-l));
}
 
#login-status ul a:hover {
   color: rgb(var(--chrys-d));
}
 
#login-status a {
    color: rgb(var(--rock-color));
}
 
/*STANDARD BLOCKS*/
 
blockquote {
    color: black;
    background-color: rgba(var(--rock-color), 0.5);
}
 
div.blockquote {
    color: black;
    background-color: rgba(var(--rock-color), 0.5);
}
 
.styled-quote {
   background-color:rgb(237, 255, 251);
   color: black;
   border-left: 0.5rem solid rgb(179, 255, 236);
}
 
.lightblock {
   background-color:rgba(200, 255, 245, 0.6);
   color: black;
   box-shadow: 0 0.2rem 0.6rem rgba(200, 255, 245, 1);
   border: 2px solid rgb(200, 255, 245);
}
 
.dark-styled-quote {
   color: white;
   border-left: 0.5rem solid rgb(26, 42, 150);
}
 
.darkblock {
   color: white;
   background-color:rgba(0, 6, 92, 0.3);
}
 
.code {
    border: 2px dashed rgb(var(--sapphire-d));
    background-color: rgb(var(--rock-color));
}
 
/*SPECIAL DIVS FOR THIS THEME*/
 
.chrys-lightblock {
   background-color:rgb(var(--chrys-l));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: black;
   position: relative;
}
 
.chrys-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.chrys-quote {
   background-color:rgb(var(--chrys-l));
   border-left: 0.5rem solid rgba(var(--chrys-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   color: black;
   position: relative;
}
 
.chrys-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.amethyst-lightblock {
   background-color:rgb(var(--amethyst-l));
   color: white;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.amethyst-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.amethyst-quote {
   background-color:rgb(var(--amethyst-l));
   color: white;
   border-left: 0.5rem solid rgba(var(--amethyst-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.amethyst-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.ruby-lightblock {
   background-color:rgb(var(--ruby-l));
   color: black;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.ruby-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.ruby-quote {
   background-color:rgb(var(--ruby-l));
   color: black;
   border-left: 0.5rem solid rgba(var(--ruby-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.ruby-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.onyx-lightblock {
   background-color:rgb(var(--onyx-l));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.onyx-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.onyx-quote {
   background-color:rgb(var(--onyx-l));
   border-left: 0.5rem solid rgba(var(--onyx-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.onyx-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.topaz-lightblock {
   background-color:rgb(var(--topaz-l));
   color: black;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.topaz-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.topaz-quote {
   background-color:rgb(var(--topaz-l));
   color: black;
   border-left: 0.5rem solid rgba(var(--topaz-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.topaz-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.citrine-lightblock {
   background-color:rgb(var(--citrine-l));
   color: black;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.citrine-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.citrine-quote {
   background-color:rgb(var(--citrine-l));
   color: black;
   border-left: 0.5rem solid rgba(var(--citrine-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.citrine-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.jade-lightblock {
   background-color:rgb(var(--jade-l));
   color: black;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.jade-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.jade-quote {
   background-color:rgb(var(--jade-l));
   color: black;
   border-left: 0.5rem solid rgba(var(--jade-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.jade-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.sapphire-lightblock {
   background-color:rgb(var(--sapphire-l));
   color: black;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.sapphire-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.sapphire-quote {
   background-color:rgb(var(--sapphire-l));
   color: black;
   border-left: 0.5rem solid rgba(var(--sapphire-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.sapphire-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.tourm-lightblock {
   background-color:rgb(var(--tourm-l));
   color: black;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.tourm-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.tourm-quote {
   background-color:rgb(var(--tourm-l));
   color: black;
   border-left: 0.5rem solid rgba(var(--tourm-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.tourm-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.dia-lightblock {
   background-color:rgb(var(--dia-l));
   color: black;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.dia-lightblock::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.dia-quote {
   background-color:rgb(var(--dia-l));
   color: black;
   border-left: 0.5rem solid rgba(var(--dia-d));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   position: relative;
}
 
.dia-quote::after{
   content: "";
   float: center;
   background: url(http://backrooms-wiki.wikidot.com/local--files/theme:refractifa/gem-bg.png)center/100% repeat;
   opacity: 0.3;
   top: 0;
   left: 0;
   bottom: 0;
   right: 0;
   position: absolute;
   z-index: 0;
}
 
.lightblock h1,
.lightblock h2,
.lightblock h3,
.lightblock h4,
.lightblock h5,
.lightblock h6,
.chrys-lightblock h1,
.chrys-lightblock h2,
.chrys-lightblock h3,
.chrys-lightblock h4,
.chrys-lightblock h5,
.chrys-lightblock h6,
.chrys-quote h1,
.chrys-quote h2,
.chrys-quote h3,
.chrys-quote h4,
.chrys-quote h5,
.chrys-quote h6,
.dia-lightblock h1,
.dia-lightblock h2,
.dia-lightblock h3,
.dia-lightblock h4,
.dia-lightblock h5,
.dia-lightblock h6,
.dia-quote h1,
.dia-quote h2,
.dia-quote h3,
.dia-quote h4,
.dia-quote h5,
.dia-quote h6,
.styled-quote h1,
.styled-quote h2,
.styled-quote h3,
.styled-quote h4,
.styled-quote h5,
.styled-quote h6 {
   color: black;
}

版式代码

@import url('https://fonts.googleapis.com/css2?family=Cousine:ital,wght@0,400;0,700;1,400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Tinos:ital,wght@0,400;0,700;1,400;1,700&display=swap');
 
/* NEW nostalgiaOS theme */
/* original by zask, rewritten by scutoid */
/* most code taken from the original so don't kill me */
 
:root {
    --theme-base: "black-highlighter";
    --theme-id: "nostalgia-os";
    --theme-name: "nostalgiaOS";
    --logo-image: url("https://backrooms-wiki.wdfiles.com/local--files/theme%3Anostalgia-os/nOSwindow.png");
    --header-title: "the backrooms";
    --header-subtitle: "正 在 开 机 . . .";
 
    --header-text-shadow: 2px 2px 0 black;
    --header-text-shadow-hover: 2px 5px 0 black;
    --quote-shadow: 3px 3px 0 rgba(var(--black-monochrome),0.25);
    --footer-message: "关机…？";
 
/* Typefaces */
    --body-font: 'Microsoft Sans Serif', inter, 'Noto Sans SC', sans-serif;
    --header-font: 'Tinos', 'Noto Serif SC', serif;
    --title-font: 'Tinos', 'Noto Serif SC', serif;
    --UI-font: 'Tinos', 'Noto Serif SC', serif;
    --mono-font: 'Cousine', "Courier New", 'Noto Serif SC', monospace;
 
   --pale-gray-monochrome: 230, 230, 230;
   --white-monochrome: 255, 255, 255;
   --light-gray-monochrome: 160, 160, 160;
   --gray-monochrome: 70, 70, 70;
   --dark-gray-monochrome: 50, 50, 50;
   --black-monochrome: 20, 20, 20;
   --bright-accent: 53, 165, 225;
   --medium-accent: 53, 165, 225;
   --dark-accent: 165, 165, 165;
   --pale-accent: 165, 165, 165;
 
   --link-color: 53, 165, 225;
   --hover-link-color: 53, 165, 225;
 
   --ui-button-bg: 200, 200, 200;
 
   --taskbar-gradient: linear-gradient(180deg, rgb(var(--gray-monochrome)) 0, rgb(var(--gray-monochrome)) 1px, rgb(var(--white-monochrome)) 1px, rgb(var(--white-monochrome)) 3px, rgb(var(--light-gray-monochrome)) 3px, rgb(var(--light-gray-monochrome)) 100%);
 
    /* Box-Shadow 1px Borders */
    --box-border-bottom: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-top: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-left: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-right: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-all: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
}
 
body {
    color: #000000;
    font-size: 14px;
    image-rendering: pixelated;
    word-break: unset;
    --themeColor: #35A5E1;
    --accentColor: #35A5E1;
    text-align: justify;
}
 
#skrollr-body {
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("https://backrooms-wiki.wdfiles.com/local--files/theme%3Anostalgia-os/nOSwallpaper.gif");
    background-repeat: repeat-x;
    background-size:  inherit;
}
 
#container-wrap-wrap {
    position: static;
}
 
#header h1 a {
    font-family: sans-serif;
}
 
.scp-image-block {
    box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    border-radius: 0;
    margin: 0 2em 1em;
    background: #ffffff;
}
 
.scp-image-block .scp-image-caption {
background-color: var(--bright-accent);
color: black;
}
 
#page-title, h1, h2, h3, h4, h5, h6 {
    color: rgb(var(--bright-accent));
    text-shadow: 2px 2px 0 rgba(var(--black-monochrome),0.25);
}
 
:is(blockquote, .blockquote, div.blockquote, [class*="blockquote"]) {
    border: #EEE outset 2px;
    background-color: #C0C0C0;
    color: black;
    box-shadow: var(--quote-shadow);
}
 
#page-title::after, .meta-title::after {
    display: none;
}
 
#page-title, .meta-title {
    margin-bottom: 0.5em;
    justify-content: center;
    border-bottom: solid 1px rgb(var(--light-gray-monochrome));
    padding-bottom: 5px;
}
 
:not(.page-rate-widget-box):not(#search-top-box-form) > .btn, :not(.page-rate-widget-box):not(#search-top-box-form) > .button, :not(.page-rate-widget-box):not(#search-top-box-form) > .owindow .button-bar a, :not(.page-rate-widget-box):not(#search-top-box-form) > button, :not(.page-rate-widget-box):not(#search-top-box-form) > div.buttons input, :not(.page-rate-widget-box):not(#search-top-box-form) > input.button, .page-rate-widget-box {
    border: #eee outset 2px;
    box-shadow: var(--quote-shadow) !important;
}
 
.page-rate-widget-box { background: rgb(var(--ui-button-bg)); }
 
#footer {
    border: #eee outset 2px;
}
 
.yui-navset {
    box-shadow: var(--quote-shadow);
}

+ 版式代码

/*
   Dark Liminal Legacy Theme
   [Dark Legacy Theme]
   by Lynch & Etoile. Remixed by Stretchster.
*/
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url("http://scpsandboxcn.wikidot.com/local--files/typeface/Typeface-zcoolwenyiti.css");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap");
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "dark-liminal-legacy";
   --theme-name: "Dark Liminal Legacy Theme";
 
   --logo-image: url("http://sensenca-picture.wikidot.com/local--files/main/EagleWhiteSD.png");
   --header-title: "后室的传承";
   --header-subtitle: "注意你的背后...";
 
    --body-font: 'Noto Sans SC', sans-serif;
    --header-font: 'zcoolwenyiti', sans-serif;
    --title-font: 'Noto Sans SC', sans-serif;
 
   --white-monochrome: 17, 38, 57;
   --pale-gray-monochrome:  34,80, 121;
   --light-gray-monochrome: 45,53,67;
   --gray-monochrome: 57, 10, 10;
   --grey-monochrome: 45,53,67;
   --black-monochrome: 222, 222, 222;
   --bright-accent: 34,80, 121;
   --medium-accent: 86, 23, 23;
   --dark-accent: 164, 107, 0;
   --pale-accent:  203,0, 183;
   --newpage-color 145,185,220;
   --alt-accent: 145,185,220;
   --legacy-accent:  255, 185, 97;
   --darker-legacy-accent:  57, 10, 10;
   --backrooms-yellow: 215,200,0;
 
   --swatch-topmenu-border-color: var(--darker-legacy-accent);
  --swatch-topmenu-bg-color: var(--darker-legacy-accent);
  --swatch-headerh1-color: 222, 222, 222;
  --swatch-headerh2-color: 255, 185, 97;
 
  --link-color: 255, 185, 97;
  --hover-link-color: 255, 185, 97;
  --visited-link-color: 142, 39, 39;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgb(var(--legacy-accent)) 0%,
      rgb(var(--darker-legacy-accent)) 0%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#side-bar .heading p {
   color: rgb(var(--legacy-accent));
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
h1, h2, h3, h4, h5, h6 {
   color: rgb(var(--legacy-accent));
}
 
.yui-navset .yui-nav .selected a {
   color: rgb(var(--legacy-accent)) !important;
}
 
table.wiki-content-table th {
   color: rgb(var(--black-monochrome));
}
 
#login-status {
   color: rgb(var(--legacy-accent));
}
 
#login-status a {
   color: rgb(var(--legacy-accent));
}
 
#search-top-box input.empty {
   color: rgb(var(--legacy-accent));
}
 
#search-top-box input.text {
   color: rgb(var(--legacy-accent));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--alt-accent));
}
 
#page-title {
   color: rgb(var(--legacy-accent));
}
 
#top-bar div.mobile-top-bar > ul > li > a,
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a,
#top-bar div.top-bar > ul > li > ul > li > a {
   color: rgb(var(--legacy-accent));
}
 
a:hover::before {
   content: "> ";
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(90, 20, 20,.25);
}
 
.styled-quote {
   background-color:rgb(var(--bright-accent));
   border-left: 0.5rem solid rgba(var(--grey-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.light-styled-quote {
   background-color:rgb(var(--darker-legacy-accent));
   border-left: 0.5rem solid rgba(var(--legacy-accent));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.light-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.darkblock {
   background-color:rgb(var(--white-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.block {
   background-color:rgb(var(--grey-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.lightblock {
   background-color:rgb(var(--darker-legacy-accent));
   color:rgb(255, 255, 255);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: rgb(var(--black-monochrome));
}
 
.lightblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.borderblock {
    background-color:rgb(var( --grey-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
 .alt-borderblock {
    background-color:rgb(var(--bright-accent));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--grey-monochrome));
 }
 
.light-borderblock {
    background-color:rgb(var( --darker-legacy-accent));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--legacy-accent));
 }
 
 .border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--grey-monochrome));
     border: solid 0.3rem rgb(var(--bright-accent));
    }
 
    .border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(https://7bye.com/hoah/i/2024/01/19/ikmc4p.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .light-border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--darker-legacy-accent));
     border: solid 0.3rem rgb(var(--legacy-accent));
    }
 
    .light-border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(https://7bye.com/hoah/i/2024/01/19/ikmc4p.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--grey-monochrome));
    }
 
    .logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(https://7bye.com/hoah/i/2024/01/19/ikmc4p.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .light-logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--darker-legacy-accent));
    }
 
    .light-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(https://7bye.com/hoah/i/2024/01/19/ikmc4p.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
.titleblock {
        background-color: rgb(var(--grey-monochrome));
        color:rgb(var(--black-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--grey-monochrome));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.light-titleblock {
        background-color: rgb(var(--darker-legacy-accent));
        color:rgb(var(--black-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--legacy-accent)) 2px;
     }
 
     .light-titlebox{
       color: rgb(var(--darker-legacy-accent));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--legacy-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.border-block {
    background-color:rgb(var(--grey-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
 }
 
.featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#B6AF7E;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #d6ce92;
    box-sizing:border-box;
}
 
.featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#B7B073;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #c7c089;
    box-sizing:border-box;
    transition:0.2s;
}
.newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(199,192,137,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.light-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#5A1414;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #FFB961;
    box-sizing:border-box;
}
 
.light-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#FFB961;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #6B1E1E;;
    box-sizing:border-box;
    transition:0.2s;
}
.light-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(75,16,16,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.dark-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#2D3543;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
}
 
.dark-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#225079;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #202732;
    box-sizing:border-box;
    transition:0.2s;
}
.dark-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(32,39,50,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.yellow-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#CDAB00;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
}
 
.yellow-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#CDAB00;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
    transition:0.2s;
}
.yellow-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(205,171,0,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
:root {
   --fade-in-delay: 0.1s; /* Change the speed here. */
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }

+ 版式代码

/*
   Liminal Legacy Theme
   [Legacy Theme]
   by Lynch & Etoile. Remixed by Stretchster.
*/
 
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal-legacy";
   --theme-name: "Liminal Legacy Theme";
 
   --logo-image: url("http://backroomssandboxcn.wikidot.com/local--files/img/LOGO_MEG.png");
   --header-title: "后室的传承";
   --header-subtitle: "注意看你背后...";
 
    --body-font: 'Lato', "Noto Sans SC", sans-serif;
    --header-font: 'Russo One', 'ZCOOL XiaoWei', sans-serif;
    --title-font: 'Exo', '幼圆', "Noto Sans SC", sans-serif;
    --mono-font: "PT Mono", "Andale Mono", "Noto Serif SC", '仿宋', "Courier New", Courier, monospace;
 
   --white-monochrome: 215, 207, 137;
   --text-white-monochrome: 222, 222, 222;
   --pale-gray-monochrome: 255, 185, 97;
   --light-gray-monochrome: 90, 20, 20;
   --gray-monochrome: 90, 20, 20;
   --black-monochrome: 12, 12, 12;
   --bright-accent: 255, 185, 97;
   --medium-accent: 86, 23, 23;
   --dark-accent: 164, 107, 0;
   --pale-accent:  203,0, 183;
   --alt-accent: 234,88,255;
   --legacy-accent:  34,80, 121;
   --darker-legacy-accent: 45,53,67;
   --backrooms-yellow: 215,200,0;
 
   --swatch-topmenu-border-color: var(--medium-accent);
  --swatch-headerh1-color: 222, 222, 222;
  --swatch-headerh2-color: 255, 185, 97;
 
   --link-color: 90, 20, 20;
   --hover-link-color: 255, 185, 97;
   --visited-link-color: 215, 150, 64;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 0%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
#top-bar div.mobile-top-bar > ul > li > a,
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a,
#top-bar div.top-bar > ul > li > ul > li > a {
   color: rgb(var(--bright-accent));
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
.yui-navset .yui-nav .selected a {
   color: rgb(var(--bright-accent)) !important;
}
 
table.wiki-content-table th {
   color: rgb(var(--text-white-monochrome));
}
 
#login-status {
   color: rgb(var(--bright-accent));
}
 
#login-status a {
   color: rgb(var(--bright-accent));
}
 
#search-top-box input.empty {
   color: rgb(var(--bright-accent));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--alt-accent))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(90, 20, 20,.25);
}
 
.styled-quote {
   background-color:rgb(var(--bright-accent));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--darker-legacy-accent));
   border-left: 0.5rem solid rgba(var(--legacy-accent));
   color:rgb(var(--text-white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.block {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--text-white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--darker-legacy-accent));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: rgb(var(--text-white-monochrome));
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.borderblock {
    background-color:rgb(var( --gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
 .alt-borderblock {
    background-color:rgb(var(--bright-accent));
    color:rgb(var(--black-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
 }
 
.dark-borderblock {
    background-color:rgb(var( --darker-legacy-accent));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--legacy-accent));
 }
 
 .border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--gray-monochrome));
     border: solid 0.3rem rgb(var(--bright-accent));
    }
 
    .border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backroomssandboxcn.wikidot.com/local--files/img/LOGO_MEG.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .dark-border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--darker-legacy-accent));
     border: solid 0.3rem rgb(var(--legacy-accent));
    }
 
    .dark-border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backroomssandboxcn.wikidot.com/local--files/img/LOGO_MEG.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--gray-monochrome));
    }
 
    .logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backroomssandboxcn.wikidot.com/local--files/img/LOGO_MEG.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .dark-logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--darker-legacy-accent));
    }
 
    .dark-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backroomssandboxcn.wikidot.com/local--files/img/LOGO_MEG.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
.titleblock {
        background-color: rgb(var(--gray-monochrome));
        color:rgb(var(--text-white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--gray-monochrome));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.dark-titleblock {
        background-color: rgb(var(--darker-legacy-accent));
        color:rgb(var(--text-white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--legacy-accent)) 2px;
     }
 
     .dark-titlebox{
       color: rgb(var(--darker-legacy-accent));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--legacy-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.border-block {
    background-color:rgb(var(--gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
 }
 
.featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#c7c089;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #d6ce92;
    box-sizing:border-box;
}
 
.featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#D7CF89;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #c7c089;
    box-sizing:border-box;
    transition:0.2s;
}
.newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(199,192,137,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.light-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#5A1414;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #FFB961;
    box-sizing:border-box;
}
 
.light-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#FFB961;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #6B1E1E;;
    box-sizing:border-box;
    transition:0.2s;
}
.light-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(75,16,16,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.dark-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#2D3543;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
}
 
.dark-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#225079;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #202732;
    box-sizing:border-box;
    transition:0.2s;
}
.dark-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(32,39,50,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.yellow-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#EBC400;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
}
 
.yellow-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#EBC400;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
    transition:0.2s;
}
.yellow-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(205,171,0,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
:root {
   --fade-in-delay: 0.1s; /* Change the speed here. */
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }

+ 版式代码

@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url("http://backrooms-wiki.wdfiles.com/local--files/component%3Atheme/normalize-archived.css");
@import url("http://backrooms-wiki.wdfiles.com/local--files/component%3Atheme/bhl-archived.css");
@import url("http://backrooms-wiki.wikidot.com/local--files/component:theme/sidebar.css");
@import url('https://fonts.googleapis.com/css2?family=Audiowide&family=Graduate&family=JetBrains+Mono:wght@200&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@300&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal-fandom";
   --theme-name: "Liminal Fandom Theme";
 
   --logo-image: url("http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/fandom_logo_small1.png");
   --header-title: "Backrooms Fandom";
   --header-subtitle: "这里似曾相识……";
 
   --body-font: 'Rubik', sans-serif;
   --header-font: 'Rubik', sans-serif;
   --title-font: 'Rubik', sans-serif;
   --mono-font: 'Fantasque Sans Mono', monospace;
 
   --white-monochrome: 251, 231, 181;
   --pale-gray-monochrome: 254, 126, 3;
   --light-gray-monochrome: 254, 126, 3;
   --gray-monochrome: 254, 126, 3;
   --grey-monochrome: 254, 126, 3;
   --dark-gray-monochrome: 195, 109, 47;
   --black-monochrome: 12, 12, 12;
   --bright-accent: 195, 109, 47;
   --medium-accent: 195, 109, 47;
   --dark-accent: 195, 109, 47;
   --pale-accent: 195, 109, 47;
   --alt-accent: 175, 66, 0;
   --legacy-accent: 254, 126, 3;
   --darker-legacy-accent: 254, 126, 3;
   --backrooms-yellow: 255, 197, 1;
   --kauer-white: 255, 255, 255;
   --kauer-blue: 20, 90, 245;
   --meg-mint: 250, 250, 210;
   --meg-green: 111, 117, 78;
   --pioneer-orange: 255, 210, 26;
   --commercium-grey: 91, 89, 81;
   --mountain-purple: 121, 82, 132;
   --brute-blue: 39, 16, 84;
   --brute-yellow: 211, 242, 24;
   --aea-midnight: 3, 8, 26;
   --aea-hunted: 234, 52, 52;
   --raven-shadow: 0, 0, 0;
   --raven-gold: 219, 200, 124;
   --k4-frogskin: 59, 91, 66;
   --k4-mudskipper: 90, 56, 37;
 
   --swatch-topmenu-border-color: var(--darker-legacy-accent);
  --swatch-topmenu-bg-color: var(--darker-legacy-accent);
  --swatch-headerh1-color: 12, 12, 12;
  --swatch-headerh2-color: 12, 12, 12;
 
    --rating-module-button-plus-color: 195, 109, 47;
    --rating-module-button-negative-color: 195, 109, 47;
    --rating-module-button-cancel-color: 195, 109, 47;
    --rating-module-button-credit-color: 195, 109, 47;
 
  --link-color: 195, 109, 47;
  --hover-link-color: 195, 109, 47;
  --visited-link-color: 195, 109, 47;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgb(var(--legacy-accent)) 0%,
      rgb(var(--darker-legacy-accent)) 0%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/Fandom_Banner2.png");
 background-repeat: repeat-x;
background-size: inherit;
}
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#side-bar .heading p {
   color: rgb(var(--black-monochrome));
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1 a {
   left: -8.5rem;
}
 
#header h2 a {
   left: -24rem;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
#header::before {
   left: calc(-27.5% + -7rem);
   background-size: auto 11rem;
   opacity: 1;
}
 
#header h2 span::before {
   left: -12.5rem
}
 
@media only screen and (max-width:768px){
   #header::before {
      left: 0;
      background-size: auto 8rem;
   }
 
   #header h1 a {
      left: 1rem;
   }
 
   #header h2 span::before {
      left: calc(1rem + 1.5ch);
   }
}
 
h1, h2, h3, h4, h5, h6 {
   color: rgb(var(--black-monochrome));
}
 
hr {
   background-color: rgb(var(--dark-grey-monochrome));
}
 
.yui-navset .yui-nav .selected a {
   color: rgb(var(--black monochrome)) !important;
}
 
table.wiki-content-table th {
   color: rgb(var(--black-monochrome));
}
 
#login-status {
   color: rgb(var(--grey-monochrome));
}
 
#login-status a {
   color: rgb(var(--grey-monochrome));
}
 
#search-top-box input.empty {
   color: rgb(var(--black-monochrome));
}
 
.scp-image-caption,
.yui-navset .yui-nav a,
blockquote,
.blockquote,
table.wiki-content-table th {
   color: rgb(255, 255, 255);
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--alt-accent));
}
 
#page-title {
   color: rgb(var(--black-monochrome));
}
 
#top-bar > ul > li a, #top-bar > ul > li a:hover {
   color: rgb(var(--black-monochrome));
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(90, 20, 20,.25);
}
 
.styled-quote {
   background-color:rgb(var(--grey-monochrome));
   color:rgb(var(--kauer-white));
   border-left: 0.5rem solid rgba(var(--bright-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.yellow-styled-quote {
   background-color:rgb(var(--backrooms-yellow));
   border-left: 0.5rem solid rgba(var(--black-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.yellow-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.darkblock a {
   color: rgb(255, 255, 255);
}
 
.darkblock {
   background-color:rgb(var(--grey-monochrome));
   color:rgb(var(--kauer-white));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.block {
   background-color:rgb(var(--white-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.lightblock {
   background-color:rgb(var(--kauer-white));
   color:rgb(255, 255, 255);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: rgb(var(--black-monochrome));
}
 
.lightblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.borderblock {
    background-color:rgb(var( --grey-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
 .yellow-borderblock {
    background-color:rgb(var(--backrooms-yellow));
    color:rgb(12, 12, 12);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--black-monochrome));
 }
 
.light-borderblock {
    background-color:rgb(var( --kauer-white));
    color:rgb(12, 12, 12);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--black-monochrome));
 }
 
.kauer-block {
    background-color:rgb(var( --kauer-white));
    color:rgb(12, 12, 12);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--kauer-blue));
 }
 
.meg-fandom-block {
    background-color:rgb(var( --meg-mint));
    color:rgb(12, 12, 12);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--meg-green));
 }
 
.backrooms-pioneers-block {
    background-color:rgb(var( --kauer-white));
    color:rgb(12, 12, 12);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--pioneer-orange));
 }
 
.commercium-block {
    background-color:rgb(var( --commercium-grey));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--pioneer-orange));
 }
 
.mountain-coalition-block {
    background-color:rgb(var( --mountain-purple));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--black-monochrome));
 }
 
.k4-block {
    background-color:rgb(var( --k4-mudskipper));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--k4-frogskin));
 }
 
.beo-block {
    background-color:rgb(var( --brute-blue));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--brute-yellow));
 }
 
.aea-block a,
.aea-logoblock {
   color: rgb(12, 12, 12)
}
 
.aea-block {
    background-color:rgb(var( --aea-hunted));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--aea-midnight));
 }
 
.raven-shield-block {
    background-color:rgb(var( --raven-shadow));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--raven-gold));
 }
 
 .border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--grey-monochrome));
     border: solid 0.3rem rgb(var(--bright-accent));
    }
 
    .border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/BackroomsFandomLogo.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .light-border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(12, 12, 12);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--kauer-white));
     border: solid 0.3rem rgb(var(--black-monochrome));
    }
 
    .light-border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/BackroomsFandomLogo.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .kauer-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(12, 12, 12);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--kauer-white));
     border: solid 0.3rem rgb(var(--kauer-blue));
    }
 
    .kauer-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/Capture.PNG) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .meg-fandom-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(12, 12, 12);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--meg-mint));
     border: solid 0.3rem rgb(var(--meg-green));
    }
 
    .meg-fandom-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/MEG_Fandom.png) center/35% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .backrooms-pioneers-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(12, 12, 12);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--kauer-white));
     border: solid 0.3rem rgb(var(--pioneer-orange));
    }
 
    .backrooms-pioneers-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/Backrooms_Pioneers_Logo_Big.png) center/200% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .commercium-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--commercium-grey));
     border: solid 0.3rem rgb(var(--pioneer-orange));
    }
 
    .commercium-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/Commercium_Logo.png) center/35% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .mountain-coalition-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--mountain-purple));
     border: solid 0.3rem rgb(var(--black-monochrome));
    }
 
    .mountain-coalition-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/Mountainmancoalitionsymbol.png) center/35% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .k4-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--k4-mudskipper));
     border: solid 0.3rem rgb(var(--k4-frogskin));
    }
 
    .k4-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/K4Simple.png) center/50% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .beo-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--brute-blue));
     border: solid 0.3rem rgb(var(--brute-yellow));
    }
 
    .beo-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/beo.png) center/50% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .aea-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--aea-hunted));
     border: solid 0.3rem rgb(var(--aea-midnight));
    }
 
    .aea-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/Capture_2.png) center/35% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .raven-shield-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--raven-shadow));
     border: solid 0.3rem rgb(var(--raven-gold));
    }
 
    .raven-shield-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/unknown.png) center/35% no-repeat;
    opacity: 0.50;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--grey-monochrome));
    }
 
    .logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/BackroomsFandomLogo.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .light-logoblock{
    padding: 0.01rem 1rem;
    color:rgb(12, 12, 12);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--kauer-white));
    }
 
    .light-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://gaplouelpew.wdfiles.com/local--files/theme%3Aliminal-fandom/BackroomsFandomLogo.png) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
.titleblock {
        background-color: rgb(239, 219, 166);
        color:rgb(12, 12, 12);
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(206, 187, 135) 2px;
     }
 
     .titlebox{
       color: rgb(12, 12, 12);
       position: relative;
       top: -1.6rem;
       background-color: rgb(222, 203, 150);
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.dark-titleblock {
        background-color: rgb(var(--grey-monochrome));
        color:rgb(255, 255, 255);
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
     .dark-titlebox{
       color: rgb(255, 255, 255);
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.border-block {
    background-color:rgb(var(--grey-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
 }
 
.featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#EFDBA6;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #d6ce92;
    box-sizing:border-box;
}
 
.featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#DECB96;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #c7c089;
    box-sizing:border-box;
    transition:0.2s;
}
.newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(206,187,135,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
:root {
   --fade-in-delay: 0.1s; /* Change the speed here. */
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }

展示版式代码。

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Mono&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "sunstone";
   --theme-name: "Sunstone Theme";
 
   --logo-image:url("http://backrooms-wiki.wdfiles.com/local--files/theme%3Asunstone/red-sun.png");
   --header-title: "The Backrooms";
   --header-subtitle: "光芒永旭，光辉永存";
 
   --body-font: 'PT Sans', 'Noto Sans SC';
   --header-font: 'Space Grotesk', 'Noto Sans SC';
   --title-font: 'PT Mono', 'Noto Serif SC';
   --mono-font: 'Ubuntu Mono',  'Noto Serif SC';
 
   --white-monochrome: 28, 6, 0;
   --pale-gray-monochrome: 90, 18, 3;
   --light-gray-monochrome: 157, 61, 6;
   --gray-monochrome: 134, 49, 5;
   --black-monochrome: 217, 132, 39;
   --bright-accent: 227, 76, 31;
   --medium-accent: 227, 76, 31;
   --dark-accent: 236, 155, 50;
   --pale-accent: 236, 155, 50;
   --reddd: 193, 62, 24;
   --swatch-menubg-dark-color: var(--pale-accent);
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 227, 76, 31;
   --hover-link-color: 227, 76, 31;
   --visited-link-color: 227, 76, 31;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
 
   --rating-module-button-plus-color: 217, 132, 38;
   --rating-module-button-negative-color: 217, 132, 38;
   --rating-module-button-cancel-color: 217, 132, 38;
   --rating-module-button-credit-color: 217, 132, 38;
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://backrooms-wiki.wdfiles.com/local--files/theme%3Asunstone/red-sun-bg.jpg");
    background-repeat: repeat-x;
    background-size: inherit;
}
 
#side-bar .side-block div a img {
   filter: grayscale(0%);
}
 
#container {
   background-image: none
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   top: -1.1rem;
   left: 0rem;
   background-image: var(--logo-image);
   background-size: auto 8.6rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   left: 0rem;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #EC9B32;
}
 
.lightblock h1,
.lightblock h2,
.lightblock h3,
.lightblock h4,
.lightblock h5,
.lightblock h6,
.light-borderblock h1,
.light-borderblock h2,
.light-borderblock h3,
.light-borderblock h4,
.light-borderblock h5,
.light-borderblock h6 {
   color: rgb(var(--white-monochrome));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
table.page-history td.optionstd a,
.pager a,
.pager .current {
   border-color: rgb(var(--black-monochrome));
}
 
table.wiki-content-table td {
   border-color: rgb(var(--swatch-tertiary-color))
}
 
.pager .current {
   background-color: rgb(var(--black-monochrome));
   color: rgb(var(--white-monochrome));
}
 
div#page-options-bottom-2 > a:active,
div#page-options-bottom-2 > a:hover,
div#page-options-bottom > a:active,
div#page-options-bottom > a:hover,
.owindow .button-bar a:hover,
a.button:hover, button:hover,
div.buttons input:hover,
file:hover,
input.button:hover {
   background-color: rgb(var(--swatch-primary-darker));
}
 
#account-topbutton {
   border-color: rgb(var(--pale-gray-monochrome));
}
 
#account-options {
   border-color: rgb(var(--black-monochrome));
   background-color: rgb(var(--pale-gray-monochrome));
}
 
#account-options li a:hover {
    color: rgb(var(--black-monochrome));
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color:rgba(var(--bright-accent), .25);
   border: 5px solid rgb(var(--light-accent));
}
 
div.blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgb(0 0 0 / 25%);
   background-color: rgba(var(--bright-accent), .25);
   border: 5px solid rgb(var(--light-accent));
}
 
hr {
    background: 1px rgb(var(--reddd));
}
 
.code {
    border: 3px outset rgb(var(--black-monochrome));
}
 
.titleblock {
  background-color: rgb(var(--pale-gray-monochrome));
  color:rgb(var(--black-monochrome));
  padding: 0.5rem 1rem 0.10rem;
  margin: 1.5rem 0rem 0.5rem 0rem;
  box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
  border: solid rgb(var(--black-monochrome)) 2px;
}
 
.titlebox{
  color: rgb(var(--white-monochrome));
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--black-monochrome));
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.light-borderblock {
    background-color:rgb(var(--black-monochrome));
    color:rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--pale-gray-monochrome));
}
 
.dark-borderblock {
    background-color:rgb(var(--pale-gray-monochrome));
    color:rgb(var(--black-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--black-monochrome));
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--reddd));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--black-monochrome));
}
 
.lightblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--pale-gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a,
.dark-styled-quote a {
   color: rgb(var(--link-color));
}
 
.darkblock a {
color: rgb(var(--black-monochrome));
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Mono&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "lazuli";
   --theme-name: "Lazuli Theme";
 
   --logo-image: url("http://deer-box.wdfiles.com/local--files/theme-testing/banner2.png");
   --header-title: "The Backrooms";
   --header-subtitle: "湛蓝如海";
 
   --body-font: 'PT Sans', 'Noto Sans SC', sans-serif;
   --header-font: 'Space Grotesk', 'Noto Sans SC', sans-serif;
   --title-font: 'PT Mono', 'Noto Sans SC',  sans-serif, monospace;
   --mono-font: 'Ubuntu Mono', '幼圆', serif, monospace;
 
   --white-monochrome: 0, 6, 28;
   --pale-gray-monochrome: 3, 18, 90;
   --light-gray-monochrome: 6, 61, 157;
   --gray-monochrome: 5, 49, 134;
   --black-monochrome: 39, 132, 217;
   --bright-accent: 31, 76, 227;
   --medium-accent: 31, 76, 227;
   --dark-accent: 50, 155, 236;
   --pale-accent: 50, 155, 236;
   --blurple: 24, 62, 193;
   --swatch-menubg-dark-color: var(--pale-accent);
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 31, 76, 227;
   --hover-link-color: 31, 76, 227;
   --visited-link-color: 31, 76, 227;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
 
   --rating-module-button-plus-color: 38, 132, 217;
   --rating-module-button-negative-color: 38, 132, 217;
   --rating-module-button-cancel-color: 38, 132, 217;
   --rating-module-button-credit-color: 38, 132, 217;
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://deer-box.wdfiles.com/local--files/theme-testing/gradient.png");
 background-repeat: repeat-x;
background-size: inherit;
}
 
#side-bar .side-block div a img {
   filter: grayscale(0%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   top: -1.1rem;
   left: 0rem;
   background-image: var(--logo-image);
   background-size: auto 6.8rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   left: 0rem;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #329bec;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color:rgba(var(--bright-accent), .25);
   border: 5px solid rgb(var(--light-accent));
}
 
.code {
    border: 3px outset rgb(var(--black-monochrome));
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--blurple));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--black-monochrome));
}
 
.lightblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--pale-gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--black-monochrome));
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Mea+Culpa&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rochester&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Charm&display=swap');
 
@font-face {
    font-family: 'LiyuShoushu-R';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/LiyuShoushu-R.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
@font-face {
    font-family: 'SyaoranThenKhung-Regular';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/SyaoranThenKhung-Regular.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "mm-theme";
   --theme-name: "Forevermore";
 
   --logo-image: url("https://i.ibb.co/q1MdL2q/output-onlinepngtools-5.png");
   --header-title: "永远";
   --header-subtitle: "真心于你，直到时间的尽头。";
 
   --body-font: 'Rochester', 'LiyuShoushu-R', 'Noto Serif SC', cursive;
    letter-spacing: .normal;
     font-size: .05rem;
   --header-font: 'Mea Culpa', 'SyaoranThenKhung-Regular', 'Noto Serif SC', cursive;
    letter-spacing: .1rem;
    font-size: 200%;
   --title-font: 'Mea Culpa', 'SyaoranThenKhung-Regular', 'Noto Serif SC', cursive;
    letter-spacing: .1rem;
    font-size: large;
   --mono-font: 'Charm', 'Noto Serif SC', monospace;
 
--reddish-pink-monochrome: 219, 57, 84;
   --blue-monochrome: 110, 39, 59;
   --pale-blue-monochrome: 222, 144, 162;
   --pale-purple-monochrome: 122, 77, 98;
   --red-purple-monochrome: 105, 49, 58;
   --redder-purple-monochrome: 102, 31, 42;
   --pale-red-monochrome: 255, 189, 189;
   --pale-pink-monochrome: 255, 204, 204;
--dark-red: 64, 4, 4;
--even-darker-red: 33, 1, 1;
   --bright-accent: 219, 31, 46;
   --medium-accent: 168, 34, 52;
   --dark-accent: 110, 8, 8;
   --pale-accent: 143, 59, 64;
--light-grey-monochrome: 168, 168, 168;
--green-monochrome: 0, 200, 0;
--white-monochrome: 255, 255, 255;
--dark-purple-monochrome: 48, 21, 22;
--purple-monochrome: 71, 43, 47;
--red-pink-monochrome: 161, 47, 57;
--just-pink: 255, 201, 215;
--redder-pink-monochrome: 222, 164, 169;
--even-paler-blue: 194, 136, 176;
--another-pink-shade: 240, 129, 144;
--penk:
 
--background-gradient-color: rgb(240, 187, 187);
 
 --swatch-background: var(--pale-pink-monochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--reddish-pink-monochrome);
    --swatch-primary-darkest: var(--dark-accent);
 
    --swatch-text-dark: var(--dark-accent);
    --swatch-text-light: var(--pale-pink-monochrome);
    --swatch-important-text: var(--pale-red-monochrome);
    --barColour: var(--blue-monochrome);
    --linkColour: var(--pale-blue-accent);
 
   --swatch-topmenu-border-color:  219, 101, 121;
 --swatch-menubg-dark-color: 140, 27, 46;
 --barColour: 198, 33, 33
--swatch-topmenu-bg-color: 245, 118, 139;
 
 --swatch-headerh1-color: var(--pale-pink-monochrome);
    --swatch-headerh2-color: var(--pale-red-monochrome);
    --swatch-topmenu-border-color: var(--red-purple-monochrome);
    --swatch-topmenu-bg-color: var(--dark-purple-monochrome);
 
   --link-color: 173, 26, 85;
  --visited-link-color: 143, 3, 59;
   --hover-link-color: 143, 3, 68;
   --new-page-color: 196, 29, 57;
   --sidebar-links-text: 84, 22, 40;
   --link-color-bright: 184, 38, 40;
 
   --background-gradient-distance: 0rem;
 
 --rating-module-button-color: var(--pale-pink-monochrome);
    --rating-module-button-plus-color: 0, 200, 0;
    --rating-module-button-negative-color: 198, 33, 33;
    --rating-module-button-cancel-color: 180, 180, 180;
    --rating-module-button-credit-color: 128, 56, 70;
    --rating-module-text-color: var(--swatch-menutxt-dark-color);
    --rating-module-text-hover-color: var(--swatch-menutxt-dark-accent));
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--dark-accent)) 0%,
      rgba(var(--pale-red-monochrome)) 20%,
      rgba(var(--redder-pink-monochrome)) 40%,
      rgba(var(-red-pink-monochrome-)) 50%,
      rgba(var(--just-pink)) 60%,
      rgba(var(--pale-pink-monochrome), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#main-content {
   background-color: 251, 237, 242;
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgba(var(--red-purple-monochrome)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   background-color: rbga(var(--pale-pink-monochrome));
}
 
#container {
   background-image: radial-gradient(star, rgb(var(--pale-blue-monochrome), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
.footnotes-footer {
 background-color: rgb(var(--reddish-pink-monochrome)) !important;
  border-left: 0.4rem solid rgb(var(--dark-accent)) !important;
  color: rgb(var(--pale-pink-monochrome));
 
}
 
a.footnote-footer {
    color: rgb(var(--pale-red-monochrome)) !important;
}
.footnote-footer>a:first-of-type {
    color: rgb(var(--pale-red-monochrome)) !important;
}
 
#page-title {
    border-color: rgb(var(--pale-purple-monochrome));
    color: rgb(var(--dark-accent))!important;
    font-size: 2rem;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.5;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #803846;
}
 
.page-rate-widget-box {
     box-shadow: 0px 0px 0px 2px rgb(var(--dark-accent));
    background: rgb(var(--dark-accent));
     padding: .1em;
     border-radius: 0px 10px 0px 10px;
}
 
.page-rate-widget-box .rate-points {
    background-color: none;
    border: none;
    color: rgb(var(--pale-pink-monochrome));
}
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: rgb(var(--dark-accent));
    border-top: none;
    border-bottom: none;
}
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    background: transparent;
    color: rgb(var(--pale-blue-monochrome));
}
.page-rate-widget-box .cancel {
    background: transparent;
    background-color: rgb(var(--dark-accent));
    border: none;
}
 
.page-rate-widget-box .cancel a {
    color: rgb(var(--dark-accent));
}
 
span.printuser {
    color: rgb(var(--dark-accent));
}
 
.code {
    border: 2px dashed rgb(var(--pale-red-monochrome));
}
 
blockquote {
   padding: 0.4rem 0.4rem;
   margin: 1rem 0;
   background: rgb(var(--another-pink-shade));
   box-shadow: 0px 0px 3px;
   border: 1.75px solid rgb(var(--redder-pink-monochrome));
   box-sizing: border-box;
}
 
.block-quote {
   padding: 0.4rem 0.4rem;
   margin: 1rem 0;
   background: rgb(var(--another-pink-shade));
   border-radius: 0.1rem;
   box-shadow: 0px 0px 3px;
   border: 1.75px solid rgb(var(--just-pink));
   box-sizing:border-box;
}
 
.styled-quote {
   background-color: rgb(var(--just-pink));
   border-left: 0.5rem solid rgb(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color: rgba(217, 91, 125);
   border-left: 0.5rem solid rgb(var(--blue-monochrome));
   color: rgb(var( --pale-pink-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color:rgb(var(--swatch-menubg-dark-color)) ;
}
 
.lightblock {
   background-color: rgb(var(--just-pink));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color: rgba(217, 91, 125);
   color: rgb(var( --pale-pink-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.borderblock {
   background-color: rgb(var(--just-pink));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid 0.3rem rgb(var(--dark-accent));
}
 
.logoblock{
padding: 0.01rem 1rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
margin: 0.5rem 0 0.5rem 0.25rem;
display: block;
position: relative;
background-color: rgb(var(--just-pink));
}
 
.logoblock::after{
content: "";
float: center;
border: solid 2px rgb(var(--dark-accent));
background: url(https://i.ibb.co/q1MdL2q/output-onlinepngtools-5.png)center/50% no-repeat;
opacity: 0.4726;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 1;
}
 
#account-topbutton {
    color: rgb(var(--pale-pink-monochrome));
}
 
table.wiki-content-table td {
   background-color: rgb(var(--love-pink-smh));
   color: rgb(var(--dark-accent));
}
 
table.wiki-content-table th {
   background-color: rgb(var(--dark-accent));
   color: rgb(var(--pale-pink-monochrome));
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--pale-pink-monochrome));
}
 
.yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a:focus, .yui-navset .yui-nav .selected a:hover {
    background-color: #c75454;
    color: rgb(var(--pale-pink-monochrome));
}
 
.yui-navset .yui-nav .selected a em {
    color: rgb(var(--pale-pink-monochrome));
}
 
.yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav   {
    border-color: #9e1616;
    border-width:0 0 2px
}
 
hr{
   height: 1px;
   background-color: rgba(var(--red-pink-monochrome));
   border: none;
}
 
.yui-navset .yui-content, .yui-navset .yui-navset-top .yui-content {
   border-color: rgb(var(--red-pink-monochrome));
}

+ 版式代码

/*fonty fonts*/
body p{
   font-size: 105%
}
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";
 
   --logo-image: url("http://backrooms-wiki.wikidot.com/local--files/component:theme/logo.svg");
   --header-title: "The Backrooms";
   --header-subtitle: "辑录不应存世之文";
 
   --body-font:  punctuation-marks, Huiwen-mincho, '华文中宋', 'Noto Serif SC', 宋体, lisu, 'New Tegomin', sans-serif;
   --header-font: punctuation-marks, Huiwen-mincho, '华文中宋', 'Noto Serif SC', 宋体,  dejima, 'Liu ti', kaiti, 'IM Fell English SC', monospace;
   --title-font: punctuation-marks, Huiwen-mincho, '华文中宋', 'Noto Serif SC', 宋体,  dejima, 'Liu ti',  kaiti, 'IM Fell English SC', monospace;
   --mono-font: monospace;
 
   --white-monochrome: 231, 211, 156;
    /*body background color*/
   --pale-gray-monochrome: 127, 91, 40;
    /*brown accent color*/
   --light-gray-monochrome:  76, 70, 55;
   --gray-monochrome: 76, 70, 55;
   /*dark greyish brown*/
   --black-monochrome: 25, 20, 16;
   /*black*/
   --bright-accent: 138, 125, 81;
   --medium-accent: 138, 125, 81;
   --dark-accent:  138, 125, 81;
   --pale-accent:  138, 125, 81;
   /*darker body color*/
 
    /*top bar*/
   --swatch-topmenu-border-color: var(--medium-accent);
   --swatch-topmenu-bg-color: none;
 
    /*side bar*/
   --swatch-menubg-dark-color: var(--light-gray-monochrome);
   --swatch-menubg-color: var(--white-monochrome);
 
    /*link*/
   --link-color: 250,0,0;
   --visited-link-color: 153, 11, 11;
   --hover-link-color: 250,0,0;
   --newpage-color: var(--alt-accent);
 
    /*tab*/
   --tab-border-color: rgb(var(--gray-monochrome));
   --background-gradient-distance: 0rem;
 
   --gradient-header: none;
   --diagonal-stripes: none;
 
}
 
/* 中文修复 */
 .hovertip, .hovertip .content{
background-color:rgb(231, 211, 156) !important;
}
 
/**/
#skrollr-body {
   background-image:none;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
/*paper header image*/
div#container-wrap{
    background: url(http://vivarium.wdfiles.com/local--files/private%3Aasjasjas/aaa.jpg) top left repeat-x;
    background-size: 100%;
}
 
/*gradient to blend the image with the bg*/
#container {
   background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(231,211,156,1) 37%);
   background-size: 16rem 37rem;
   background-attachment: scroll;
   background-repeat: repeat-x;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
   color: rgb(var(--dark-accent));
   font-size: 3rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   font-size: 1.2rem;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   color: rgb(var(--dark-accent));
}
 
/*change user colors*/
#login-status {
    color: rgb(var(--light-gray-monochrome));
}
 
/*self-explanatory*/
hr {
  background-color: rgb(var(--pale-gray-monochrome));
  border-color: rgb(var(--pale-gray-monochrome));
}
 
/* sd banner colours */
.sd-container {
   --sd-border:var(--pale-gray-monochrome);
   --sd-bullets:var(--sd-border);
   --sd-symbol:var(--sd-border);
}
 
#login-status a {
    color: rgb(var(--white-monochrome));
}
 
/*top bar options colors*/
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > a {
    color: rgb(var(--gray-monochrome)) !important;
}
 
#top-bar div.top-bar > ul > li > a:hover,
#top-bar div.mobile-top-bar > ul > li > a:hover {
    color: rgb(var(--white-monochrome)) !important;
}
 
#top-bar div.top-bar > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li:hover > a {
    color: rgb(var(--white-monochrome)) !important;
}
 
/*searchbox text color*/
#search-top-box input.empty{
    color: rgb(var(--white-monochrome));
}
 
/*move searchbox*/
#search-top-box {
    left: 3%;
    top: 0.5rem;
}
 
#search-top-box-form > #search-top-box-input {
    width: 7rem;
}
 
/*3bar thing on mobile*/
#top-bar>div.mobile-top-bar>div.open-menu>p>a{
color:rgb(var(--gray-monochrome))!important;
}
 
/*image block text*/
.scp-image-block .scp-image-caption {
    color: rgb(var(--white-monochrome));
}
 
/* TABVIEW - Abandon All Hope Ye Who Enter Here */
/*content bg*/
.yui-navset .yui-content {
     background-color: rgba(var(--pale-gray-monochrome), 0.25);
}
 
/*unselected tab color*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--gray-monochrome));
    color:rgb(var(--white-monochrome));
}
 
/*hover tab bg*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
    background-color: rgb(var(--pale-accent));
}
 
/*selected tab bg*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
/*idrk just testing some stuff*/
.code{
color: rgb(var(--white-monochrome));
}
 
h1{
line-height: 1.113rem;
}
 
/*table border color*/
table.wiki-content-table th {
border: 1px solid rgb(var(--pale-gray-monochrome)) !important;
}
 
table.wiki-content-table td {
border: 1px solid rgb(var(--pale-gray-monochrome)) !important;
}
/*mobile stuff*/
@media only screen and (max-width:768px){
 
:root{
   --header-height-on-mobile: 7.5rem;
}
 
#main-content {
max-width: 90vw;
padding: 0;
margin: 9.2em auto 0;
}
 
#header {
position: absolute;
top: 0rem;
height: var(--header-height-on-mobile);
}
 
div#container-wrap{
    background: url(http://vivarium.wdfiles.com/local--files/private%3Aasjasjas/aaa.jpg) top center repeat-x;
    background-size: 220%;
}
 
#container {
   background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(231,211,156,1) 37%);
   background-size: 20rem 20rem;
   background-attachment: scroll;
}
 
#search-top-box {
    left: unset;
    top: unset;
}
 
#search-top-box-form > #search-top-box-input {
    width: 2rem;
}
}
 
@media only screen and (max-width:1366px){
#container {
   background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(231,211,156,1) 37%);
   background-size: 25rem 25rem;
   background-attachment: scroll;
}
div#container-wrap{
    background: url(http://vivarium.wdfiles.com/local--files/private%3Aasjasjas/aaa.jpg) top center repeat-x;
    background-size: 180%;
}
}
 
/*block____*/
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color:rgb(var(--white-monochrome));
   border-color: rgb(var(--pale-gray-monochrome));
}
 
.styled-quote {
   background-color:rgb(var(--white-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--pale-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.paperblock{
width: auto;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
background: url(http://vivarium.wdfiles.com/local--files/backrooms%3Aoldpapertheme/thefinalone.jpg) repeat center;
text-shadow: 1px 1px 1px rgba(0,0,0,.25);
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.paperblock2{
width: auto;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
background: linear-gradient(180deg, rgba(235, 196, 63,.3), rgba(235, 196, 63,.3)), url(http://vivarium.wdfiles.com/local--files/backrooms%3Aoldpapertheme/thefinalone.jpg) repeat center;
text-shadow: 1px 1px 1px rgba(0,0,0,.25);
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}

+ 版式代码

@import css('https://fontlibrary.org//face/fira-sans-condensed');
@import css('https://fontlibrary.org//face/rursus-compact-mono');
@import css('https://fontlibrary.org//face/brush-lettering-one');
 
@font-face {
    font-family: 'GlowSansSC-Extended';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Extended-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
@font-face {
    font-family: 'GlowSansSC-Extended';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Extended-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
:root {
   --fade-in-delay: 0.1s;
 
   --theme-base: "black-highlighter";
   --theme-id: "ember";
   --theme-name: "Dying Embers";
 
   --logo-image: url("http://backrooms-wiki.wikidot.com/local--files/component:theme/logo.svg");
   --header-title: "地狱守卫";
   --header-subtitle: "穿过火与焰，我们将继续服务";
 
   --body-font: 'Fira Sans Condensed', 'GlowSansSC-Extended', sans-serif;
   --header-font: 'Rursus Compact Mono', 'GlowSansSC-Extended', sans-serif;
   --title-font: 'Rursus Compact Mono', 'GlowSansSC-Extended', sans-serif;
   --mono-font: 'Brush Lettering One', 'Noto Serif SC', serif;
 
   --white-monochrome: 89, 42, 42;
   --pale-gray-monochrome: 46, 22, 22;
   --light-gray-monochrome: 150, 84, 42;
   --gray-monochrome: 184, 88, 4;
   --dark-gray-monochrome: 150, 58, 15;
   --black-monochrome: 230, 154, 108;
   --bright-accent: 211, 135, 67;
   --medium-accent: 163, 75, 34;
   --dark-accent: 184, 88, 4;
   --pale-accent: 184, 88, 4;
   --header-gradient: 235, 173, 51;
   --light-block-text: 178, 190, 181;
   --visited-link-color: 184, 88, 4;
   --rating-module-button-plus-color: 184, 88, 4;
   --rating-module-button-negative-color: 184, 88, 4;
   --rating-module-button-cancel-color: 184, 88, 4;
   --link-color: 201, 35, 20;
   --hover-link-color: 201, 35, 20;
   --anim-position: fixed;
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 230, 23, 68;
   --hover-link-color: 230, 23, 68;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--header-gradient)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--black-monochrome)) 0.5%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
/* sd banner colours */
.sd-container {
   --sd-text:var(--white-monochrome);
   --sd-border:255,165,0;
   --sd-bullets:255,165,0;
   --sd-symbol:var(--white-monochrome);
}
 
#login-status {
   color: rgb(var(--swatch-text-light));
}
 
#search-top-box input.empty {
   color: rgb(var(--swatch-text-light));
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: 0rem 0rem 0rem #592a2a;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
   color:rgb(var(--light-block-text));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.lightblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--light-block-text));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--pale-gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.lightblock a, .styled-quote a {
   color: rgb(128, 41, 41);
}
 
hr {
   background-color: rgb(var(--swatch-menubg-medium-dark-color));
}
 
@media (prefers-reduced-motion: no-preference) {
  #container-wrap-wrap:before,
  #container-wrap-wrap:after {
    animation: animStar 25s linear infinite;
    background: transparent;
    box-shadow: 805px 413px #FFA500, 724px 1326px #FFA500, 1175px 606px #FFA500,
      661px 1274px #FFA500, 1206px 1967px #FFA500, 1278px 1086px #FFA500,
      551px 1817px #FFA500, 1861px 1653px #FFA500, 5px 1525px #FFA500, 1414px 255px #FFA500,
      1892px 739px #FFA500, 894px 1633px #FFA500, 1615px 521px #FFA500, 1374px 651px #FFA500,
      250px 1473px #FFA500, 1984px 1096px #FFA500, 202px 5px #FFA500, 1694px 1095px #FFA500,
      1656px 433px #FFA500, 1274px 413px #FFA500, 1568px 1581px #FFA500,
      184px 1296px #FFA500, 1820px 532px #FFA500, 1791px 956px #FFA500,
      1522px 1638px #FFA500, 1056px 1907px #FFA500, 745px 493px #FFA500,
      576px 1246px #FFA500, 849px 1625px #FFA500, 1484px 91px #FFA500, 1818px 1294px #FFA500,
      1073px 1048px #FFA500, 24px 818px #FFA500, 1605px 1164px #FFA500, 903px 1546px #FFA500,
      7px 1147px #FFA500, 48px 485px #FFA500, 130px 1026px #FFA500, 306px 735px #FFA500,
      1280px 1057px #FFA500, 1944px 481px #FFA500, 142px 238px #FFA500, 1195px 732px #FFA500,
      535px 1985px #FFA500, 851px 962px #FFA500, 1406px 1056px #FFA500,
      1869px 1171px #FFA500, 968px 1272px #FFA500, 278px 461px #FFA500,
      1655px 1910px #FFA500, 1650px 940px #FFA500, 186px 1554px #FFA500,
      1401px 1811px #FFA500, 805px 450px #FFA500, 749px 831px #FFA500, 270px 1913px #FFA500,
      1254px 1571px #FFA500, 1655px 733px #FFA500, 1159px 340px #FFA500, 40px 941px #FFA500,
      911px 846px #FFA500, 568px 347px #FFA500, 849px 1892px #FFA500, 768px 1503px #FFA500,
      1501px 40px #FFA500, 480px 384px #FFA500, 1930px 1940px #FFA500, 1952px 201px #FFA500,
      1665px 494px #FFA500, 1264px 1252px #FFA500, 1046px 835px #FFA500,
      320px 1600px #FFA500, 1802px 1465px #FFA500, 1659px 1176px #FFA500,
      647px 1928px #FFA500, 1969px 403px #FFA500, 246px 1490px #FFA500,
      1823px 1326px #FFA500, 120px 1420px #FFA500, 1974px 396px #FFA500, 307px 231px #FFA500,
      338px 43px #FFA500, 1129px 343px #FFA500, 1261px 1927px #FFA500, 1830px 728px #FFA500,
      249px 701px #FFA500, 710px 714px #FFA500, 1453px 1998px #FFA500, 889px 879px #FFA500,
      218px 275px #FFA500, 128px 314px #FFA500, 1906px 1191px #FFA500, 1686px 791px #FFA500,
      903px 1248px #FFA500, 1157px 1869px #FFA500, 732px 94px #FFA500, 150px 1387px #FFA500,
      428px 1485px #FFA500, 1605px 192px #FFA500, 963px 67px #FFA500, 545px 495px #FFA500,
      1458px 1548px #FFA500, 1478px 803px #FFA500, 1319px 1843px #FFA500,
      367px 1029px #FFA500, 1976px 716px #FFA500, 1099px 1624px #FFA500,
      1308px 1228px #FFA500, 459px 1640px #FFA500, 652px 1290px #FFA500,
      1660px 772px #FFA500, 658px 1342px #FFA500, 534px 180px #FFA500, 196px 238px #FFA500,
      1052px 1552px #FFA500, 1192px 49px #FFA500, 546px 1743px #FFA500, 677px 420px #FFA500,
      495px 1695px #FFA500, 692px 1161px #FFA500, 1306px 1817px #FFA500,
      1323px 666px #FFA500, 1904px 1838px #FFA500, 1117px 275px #FFA500, 644px 520px #FFA500,
      1138px 1681px #FFA500, 1326px 74px #FFA500, 907px 1946px #FFA500, 666px 1159px #FFA500,
      822px 894px #FFA500, 1505px 1208px #FFA500, 1809px 987px #FFA500, 954px 373px #FFA500,
      1328px 391px #FFA500, 535px 350px #FFA500, 1047px 784px #FFA500, 1252px 1380px #FFA500,
      618px 270px #FFA500, 531px 1723px #FFA500, 1588px 845px #FFA500, 1170px 1020px #FFA500,
      973px 1587px #FFA500, 593px 692px #FFA500, 283px 1482px #FFA500, 959px 1392px #FFA500,
      39px 1335px #FFA500, 1457px 815px #FFA500, 21px 1727px #FFA500, 1998px 1064px #FFA500,
      1380px 1216px #FFA500, 827px 1538px #FFA500, 108px 1390px #FFA500,
      1612px 1389px #FFA500, 1516px 1392px #FFA500, 1584px 1044px #FFA500,
      1261px 1859px #FFA500, 1841px 646px #FFA500, 1652px 988px #FFA500,
      1848px 1407px #FFA500, 661px 344px #FFA500, 1805px 1758px #FFA500,
      1784px 247px #FFA500, 780px 123px #FFA500, 117px 332px #FFA500, 430px 354px #FFA500,
      522px 826px #FFA500, 1311px 1343px #FFA500, 1590px 1863px #FFA500,
      1155px 1803px #FFA500, 368px 168px #FFA500, 1965px 140px #FFA500, 210px 830px #FFA500,
      1954px 772px #FFA500, 1316px 1990px #FFA500, 1783px 692px #FFA500,
      669px 1323px #FFA500, 1188px 949px #FFA500, 833px 1030px #FFA500, 1467px 988px #FFA500,
      633px 1926px #FFA500, 1490px 320px #FFA500, 1619px 1516px #FFA500, 1370px 85px #FFA500,
      678px 1409px #FFA500, 152px 650px #FFA500, 321px 1771px #FFA500, 1443px 1821px #FFA500,
      1440px 391px #FFA500, 1501px 1296px #FFA500, 979px 133px #FFA500, 1911px 598px #FFA500,
      1719px 97px #FFA500, 893px 735px #FFA500, 310px 473px #FFA500, 1595px 1047px #FFA500,
      437px 293px #FFA500, 145px 343px #FFA500, 1246px 416px #FFA500, 1011px 1235px #FFA500,
      1462px 987px #FFA500, 167px 1525px #FFA500, 1688px 1415px #FFA500,
      574px 1801px #FFA500, 347px 1741px #FFA500, 880px 1109px #FFA500, 93px 1692px #FFA500,
      94px 1987px #FFA500, 1695px 951px #FFA500, 153px 601px #FFA500, 1013px 969px #FFA500,
      356px 434px #FFA500, 1228px 1942px #FFA500, 1083px 1445px #FFA500,
      1317px 438px #FFA500, 439px 1242px #FFA500, 1031px 356px #FFA500, 615px 666px #FFA500,
      1019px 1826px #FFA500, 1526px 1025px #FFA500, 538px 210px #FFA500, 78px 1954px #FFA500,
      1344px 965px #FFA500, 1280px 143px #FFA500, 211px 430px #FFA500, 282px 1279px #FFA500,
      1355px 1639px #FFA500, 1142px 1512px #FFA500, 141px 822px #FFA500, 60px 1923px #FFA500,
      1322px 1117px #FFA500, 523px 1165px #FFA500, 1289px 1438px #FFA500,
      974px 1937px #FFA500, 1915px 1955px #FFA500, 1793px 308px #FFA500,
      1712px 1273px #FFA500, 201px 1179px #FFA500, 1186px 12px #FFA500, 1635px 877px #FFA500,
      361px 256px #FFA500, 795px 1283px #FFA500, 305px 1072px #FFA500, 1099px 1995px #FFA500,
      1643px 906px #FFA500, 835px 1411px #FFA500, 142px 1950px #FFA500,
      1161px 1635px #FFA500, 5px 819px #FFA500, 977px 1049px #FFA500, 86px 417px #FFA500,
      731px 1015px #FFA500, 1746px 1059px #FFA500, 1904px 484px #FFA500,
      1367px 434px #FFA500, 982px 1646px #FFA500, 685px 1582px #FFA500, 1754px 496px #FFA500,
      1706px 292px #FFA500, 1962px 1932px #FFA500, 987px 806px #FFA500, 76px 1275px #FFA500,
      746px 430px #FFA500, 1337px 122px #FFA500, 653px 942px #FFA500, 487px 1433px #FFA500,
      1270px 1287px #FFA500, 1418px 574px #FFA500, 1640px 1046px #FFA500,
      950px 1608px #FFA500, 1660px 432px #FFA500, 1134px 153px #FFA500,
      1567px 1087px #FFA500, 1582px 1957px #FFA500, 474px 238px #FFA500,
      1514px 525px #FFA500, 1421px 1984px #FFA500, 16px 1994px #FFA500,
      1935px 1508px #FFA500, 438px 775px #FFA500, 1612px 630px #FFA500, 203px 879px #FFA500,
      496px 1057px #FFA500, 1607px 1518px #FFA500, 1588px 574px #FFA500,
      1451px 1062px #FFA500, 1590px 1593px #FFA500, 592px 351px #FFA500, 361px 437px #FFA500,
      456px 1221px #FFA500, 411px 1628px #FFA500, 1103px 44px #FFA500, 1890px 749px #FFA500,
      1368px 1990px #FFA500, 872px 18px #FFA500, 1528px 907px #FFA500, 1199px 235px #FFA500,
      395px 570px #FFA500, 1120px 127px #FFA500, 125px 711px #FFA500, 1825px 1327px #FFA500,
      64px 1870px #FFA500, 838px 1810px #FFA500, 663px 1427px #FFA500, 1819px 736px #FFA500,
      566px 1851px #FFA500, 1080px 656px #FFA500, 1134px 1861px #FFA500, 568px 64px #FFA500,
      1530px 1096px #FFA500, 981px 1711px #FFA500, 1783px 999px #FFA500,
      135px 1975px #FFA500, 1772px 1553px #FFA500, 1967px 1442px #FFA500,
      542px 372px #FFA500, 1684px 1445px #FFA500, 1041px 1106px #FFA500, 60px 1460px #FFA500,
      1083px 1677px #FFA500, 143px 204px #FFA500, 912px 350px #FFA500, 1000px 1586px #FFA500,
      1068px 908px #FFA500, 241px 794px #FFA500, 426px 409px #FFA500, 961px 1141px #FFA500,
      1551px 327px #FFA500, 1575px 1532px #FFA500, 929px 1507px #FFA500, 242px 364px #FFA500,
      1271px 731px #FFA500, 1660px 468px #FFA500, 1494px 589px #FFA500, 988px 1371px #FFA500,
      431px 539px #FFA500, 1974px 239px #FFA500, 68px 645px #FFA500, 781px 1716px #FFA500,
      1238px 65px #FFA500, 26px 1158px #FFA500, 525px 899px #FFA500, 1494px 1043px #FFA500,
      176px 1932px #FFA500, 372px 1933px #FFA500, 196px 883px #FFA500, 615px 614px #FFA500,
      1298px 288px #FFA500, 1690px 1284px #FFA500, 414px 5px #FFA500, 1050px 453px #FFA500,
      271px 1805px #FFA500, 1024px 1996px #FFA500, 458px 1817px #FFA500,
      831px 1155px #FFA500, 229px 1406px #FFA500, 1140px 1918px #FFA500,
      390px 1353px #FFA500, 1509px 1025px #FFA500, 893px 574px #FFA500, 461px 499px #FFA500,
      568px 1725px #FFA500, 791px 1565px #FFA500, 1494px 365px #FFA500,
      1423px 1289px #FFA500, 1239px 1356px #FFA500, 1367px 776px #FFA500,
      1596px 965px #FFA500, 1162px 798px #FFA500, 452px 1158px #FFA500, 191px 1111px #FFA500,
      1194px 1708px #FFA500, 694px 804px #FFA500, 999px 1711px #FFA500, 114px 1175px #FFA500,
      1950px 809px #FFA500, 1991px 889px #FFA500, 1948px 1999px #FFA500,
      1367px 1389px #FFA500, 1809px 1878px #FFA500, 1613px 607px #FFA500,
      1143px 842px #FFA500, 1746px 324px #FFA500, 102px 355px #FFA500, 852px 1729px #FFA500,
      633px 755px #FFA500, 723px 1465px #FFA500, 1081px 301px #FFA500, 1231px 699px #FFA500,
      1751px 616px #FFA500, 1387px 999px #FFA500, 500px 940px #FFA500, 545px 1387px #FFA500,
      1777px 223px #FFA500, 1058px 1381px #FFA500, 1014px 867px #FFA500, 403px 712px #FFA500,
      673px 958px #FFA500, 89px 652px #FFA500, 234px 1894px #FFA500, 603px 1674px #FFA500,
      111px 1930px #FFA500, 28px 1161px #FFA500, 1052px 962px #FFA500, 134px 1007px #FFA500,
      290px 1721px #FFA500, 1713px 439px #FFA500, 443px 1291px #FFA500, 1443px 528px #FFA500,
      465px 1761px #FFA500, 491px 82px #FFA500, 592px 938px #FFA500, 1409px 1274px #FFA500,
      633px 1201px #FFA500, 740px 33px #FFA500, 1214px 777px #FFA500, 1589px 1106px #FFA500,
      748px 371px #FFA500, 1422px 1726px #FFA500, 1607px 225px #FFA500, 1520px 280px #FFA500,
      873px 547px #FFA500, 765px 1174px #FFA500, 165px 97px #FFA500, 126px 422px #FFA500,
      301px 1356px #FFA500, 702px 1837px #FFA500, 866px 256px #FFA500, 1974px 849px #FFA500,
      805px 852px #FFA500, 1659px 1966px #FFA500, 1529px 265px #FFA500, 1007px 956px #FFA500,
      1245px 359px #FFA500, 1505px 752px #FFA500, 902px 201px #FFA500, 219px 1594px #FFA500,
      1134px 816px #FFA500, 1269px 1624px #FFA500, 33px 1155px #FFA500, 1374px 768px #FFA500,
      567px 1240px #FFA500, 1774px 187px #FFA500, 1445px 254px #FFA500, 1544px 399px #FFA500,
      228px 1003px #FFA500, 1132px 632px #FFA500, 1242px 10px #FFA500, 894px 1826px #FFA500,
      1325px 706px #FFA500, 1260px 471px #FFA500, 1769px 1115px #FFA500, 370px 482px #FFA500,
      774px 889px #FFA500, 1688px 777px #FFA500, 124px 1812px #FFA500, 364px 1573px #FFA500,
      1257px 722px #FFA500, 1219px 1214px #FFA500, 866px 1202px #FFA500, 683px 976px #FFA500,
      245px 562px #FFA500, 1958px 1456px #FFA500, 940px 331px #FFA500, 604px 1006px #FFA500,
      1871px 56px #FFA500, 1671px 1668px #FFA500, 114px 1835px #FFA500,
      1284px 1144px #FFA500, 1183px 223px #FFA500, 290px 969px #FFA500, 55px 92px #FFA500,
      3px 1067px #FFA500, 653px 599px #FFA500, 341px 1106px #FFA500, 351px 617px #FFA500,
      1245px 210px #FFA500, 1007px 1354px #FFA500, 1785px 1298px #FFA500,
      624px 1677px #FFA500, 1382px 1089px #FFA500, 204px 244px #FFA500,
      1572px 1534px #FFA500, 211px 1723px #FFA500, 1873px 558px #FFA500,
      1870px 415px #FFA500, 1267px 772px #FFA500, 2000px 1057px #FFA500,
      608px 1723px #FFA500, 722px 1493px #FFA500, 856px 207px #FFA500, 21px 434px #FFA500,
      451px 1696px #FFA500, 1712px 1156px #FFA500, 1316px 740px #FFA500, 606px 772px #FFA500,
      176px 1359px #FFA500, 487px 1748px #FFA500, 1240px 118px #FFA500, 231px 876px #FFA500,
      1149px 468px #FFA500, 591px 315px #FFA500, 739px 843px #FFA500, 1932px 464px #FFA500,
      61px 1995px #FFA500, 1884px 756px #FFA500, 1714px 547px #FFA500, 1764px 1477px #FFA500,
      1524px 258px #FFA500, 831px 1423px #FFA500, 858px 1524px #FFA500, 1759px 475px #FFA500,
      1140px 1721px #FFA500, 474px 1016px #FFA500, 1312px 1967px #FFA500,
      503px 1878px #FFA500, 53px 423px #FFA500, 281px 1378px #FFA500, 817px 152px #FFA500,
      1724px 1605px #FFA500, 356px 1030px #FFA500, 372px 1122px #FFA500,
      1477px 125px #FFA500, 195px 1014px #FFA500, 1155px 1432px #FFA500,
      633px 1810px #FFA500, 444px 477px #FFA500, 1311px 1863px #FFA500, 1081px 865px #FFA500,
      185px 1222px #FFA500, 1290px 1438px #FFA500, 630px 1709px #FFA500, 372px 117px #FFA500,
      1987px 1797px #FFA500, 801px 109px #FFA500, 1230px 1903px #FFA500,
      1502px 1630px #FFA500, 680px 1190px #FFA500, 1756px 908px #FFA500,
      930px 1899px #FFA500, 1505px 1734px #FFA500, 653px 1026px #FFA500,
      1486px 1566px #FFA500, 46px 109px #FFA500, 1526px 1040px #FFA500, 840px 519px #FFA500,
      1912px 1341px #FFA500, 1382px 471px #FFA500, 638px 1021px #FFA500, 38px 347px #FFA500,
      1290px 781px #FFA500, 1485px 847px #FFA500, 1496px 1245px #FFA500,
      1267px 1307px #FFA500, 449px 741px #FFA500, 636px 1550px #FFA500, 1524px 884px #FFA500,
      137px 604px #FFA500, 1864px 180px #FFA500, 1373px 323px #FFA500, 307px 985px #FFA500,
      1603px 1012px #FFA500, 642px 1490px #FFA500, 1889px 1992px #FFA500,
      1405px 762px #FFA500, 7px 582px #FFA500, 1586px 236px #FFA500, 538px 501px #FFA500,
      322px 917px #FFA500, 176px 430px #FFA500, 350px 785px #FFA500, 562px 1838px #FFA500,
      699px 1647px #FFA500, 67px 1144px #FFA500, 1656px 523px #FFA500, 64px 1469px #FFA500,
      770px 268px #FFA500, 1752px 501px #FFA500, 641px 179px #FFA500, 685px 220px #FFA500,
      1214px 380px #FFA500, 1579px 1438px #FFA500, 310px 1300px #FFA500,
      514px 1492px #FFA500, 625px 557px #FFA500, 634px 1043px #FFA500, 707px 1262px #FFA500,
      979px 304px #FFA500, 283px 29px #FFA500, 1541px 1335px #FFA500, 1255px 705px #FFA500,
      1118px 325px #FFA500, 1121px 723px #FFA500, 1510px 465px #FFA500,
      1609px 1975px #FFA500, 584px 1678px #FFA500, 1617px 1270px #FFA500,
      372px 1033px #FFA500, 976px 1024px #FFA500, 362px 715px #FFA500, 146px 1240px #FFA500,
      1458px 1770px #FFA500, 748px 1118px #FFA500, 139px 760px #FFA500, 1846px 839px #FFA500,
      1763px 716px #FFA500, 274px 1841px #FFA500, 1085px 74px #FFA500, 415px 1714px #FFA500,
      692px 374px #FFA500, 1005px 1084px #FFA500, 312px 562px #FFA500, 1476px 1325px #FFA500,
      1335px 458px #FFA500, 755px 584px #FFA500, 329px 1882px #FFA500, 73px 1102px #FFA500,
      1077px 272px #FFA500, 1790px 555px #FFA500, 936px 1429px #FFA500,
      1280px 1939px #FFA500, 243px 1187px #FFA500, 1323px 1294px #FFA500,
      1921px 281px #FFA500, 1163px 1764px #FFA500, 598px 100px #FFA500, 802px 745px #FFA500,
      1814px 1371px #FFA500, 1532px 1805px #FFA500, 1391px 1704px #FFA500,
      945px 321px #FFA500, 361px 1787px #FFA500, 985px 1903px #FFA500, 652px 1376px #FFA500,
      425px 1538px #FFA500, 1936px 1043px #FFA500, 158px 325px #FFA500, 89px 1559px #FFA500,
      1477px 1535px #FFA500, 595px 727px #FFA500, 956px 683px #FFA500, 1765px 1840px #FFA500,
      696px 1546px #FFA500, 1165px 112px #FFA500, 1777px 796px #FFA500, 894px 1331px #FFA500,
      531px 1025px #FFA500, 296px 1867px #FFA500, 1265px 693px #FFA500, 29px 1036px #FFA500,
      1204px 364px #FFA500, 605px 1px #FFA500, 687px 1940px #FFA500, 371px 68px #FFA500,
      602px 796px #FFA500, 1340px 470px #FFA500, 1460px 1570px #FFA500, 247px 1579px #FFA500,
      1118px 829px #FFA500, 1698px 386px #FFA500, 684px 1245px #FFA500, 463px 1516px #FFA500,
      1266px 1461px #FFA500, 898px 1751px #FFA500, 6px 1281px #FFA500, 1957px 166px #FFA500,
      999px 426px #FFA500, 1821px 245px #FFA500, 830px 1367px #FFA500, 1237px 1106px #FFA500,
      1412px 645px #FFA500, 7px 93px #FFA500, 550px 1194px #FFA500, 1950px 1403px #FFA500,
      639px 1787px #FFA500, 1293px 1807px #FFA500, 462px 1713px #FFA500,
      378px 1189px #FFA500, 1177px 1376px #FFA500, 308px 1471px #FFA500, 976px 221px #FFA500,
      1766px 200px #FFA500, 1577px 356px #FFA500, 1542px 890px #FFA500, 567px 1998px #FFA500,
      96px 1389px #FFA500, 1334px 698px #FFA500, 1752px 1068px #FFA500, 269px 257px #FFA500,
      950px 1864px #FFA500, 1640px 817px #FFA500, 1340px 1064px #FFA500,
      1507px 389px #FFA500, 30px 1855px #FFA500, 766px 1645px #FFA500, 1280px 1975px #FFA500,
      967px 1469px #FFA500, 1560px 1499px #FFA500, 52px 664px #FFA500, 1319px 995px #FFA500,
      483px 1952px #FFA500;
    content: " ";
    display: circle;
    height: 1px;
    position: var(--anim-position);
    width: 1px;
    z-index: 1;
    transparent: 0;
  }
  #container-wrap:before,
  #container-wrap:after {
    animation: animStar 37.5s linear infinite;
    background: transparent;
    box-shadow: 97px 253px #FFA500, 76px 278px #FFA500, 1958px 1952px #FFA500,
      117px 481px #FFA500, 1326px 1250px #FFA500, 835px 149px #FFA500, 61px 182px #FFA500,
      788px 1960px #FFA500, 1256px 652px #FFA500, 1233px 1544px #FFA500,
      970px 1685px #FFA500, 1697px 1583px #FFA500, 680px 1847px #FFA500,
      1282px 749px #FFA500, 220px 724px #FFA500, 673px 44px #FFA500, 1919px 1555px #FFA500,
      737px 1319px #FFA500, 491px 195px #FFA500, 1507px 171px #FFA500, 771px 1497px #FFA500,
      602px 419px #FFA500, 1908px 621px #FFA500, 1993px 1864px #FFA500, 345px 1915px #FFA500,
      1216px 387px #FFA500, 1663px 887px #FFA500, 1036px 746px #FFA500, 831px 12px #FFA500,
      1675px 1029px #FFA500, 1734px 1133px #FFA500, 888px 1255px #FFA500,
      195px 1336px #FFA500, 760px 1484px #FFA500, 88px 1319px #FFA500, 577px 1665px #FFA500,
      500px 889px #FFA500, 337px 1736px #FFA500, 1593px 1935px #FFA500, 1444px 803px #FFA500,
      1477px 703px #FFA500, 1380px 1137px #FFA500, 694px 1375px #FFA500,
      412px 1132px #FFA500, 223px 61px #FFA500, 1310px 225px #FFA500, 1640px 1415px #FFA500,
      1222px 955px #FFA500, 913px 791px #FFA500, 1987px 709px #FFA500, 162px 336px #FFA500,
      855px 1655px #FFA500, 738px 726px #FFA500, 1981px 1519px #FFA500,
      1798px 1921px #FFA500, 1723px 1314px #FFA500, 1313px 1711px #FFA500,
      1926px 1218px #FFA500, 1052px 1868px #FFA500, 1622px 912px #FFA500,
      1974px 901px #FFA500, 1195px 82px #FFA500, 1446px 757px #FFA500, 355px 1425px #FFA500,
      749px 1479px #FFA500, 1779px 963px #FFA500, 243px 656px #FFA500, 671px 1835px #FFA500,
      205px 780px #FFA500, 811px 1186px #FFA500, 14px 1319px #FFA500, 436px 64px #FFA500,
      686px 509px #FFA500, 129px 884px #FFA500, 683px 80px #FFA500, 1931px 1965px #FFA500,
      867px 373px #FFA500, 1215px 244px #FFA500, 814px 1658px #FFA500, 1600px 841px #FFA500,
      418px 443px #FFA500, 59px 516px #FFA500, 988px 1390px #FFA500, 164px 1317px #FFA500,
      1490px 1276px #FFA500, 940px 404px #FFA500, 721px 1457px #FFA500, 1678px 286px #FFA500,
      640px 385px #FFA500, 152px 1160px #FFA500, 1235px 1839px #FFA500, 1038px 444px #FFA500,
      1439px 300px #FFA500, 1025px 27px #FFA500, 1968px 577px #FFA500, 835px 1533px #FFA500,
      1445px 364px #FFA500, 1102px 1879px #FFA500, 1114px 1631px #FFA500, 636px 15px #FFA500,
      745px 200px #FFA500, 1489px 1114px #FFA500, 146px 1566px #FFA500, 613px 146px #FFA500,
      190px 1672px #FFA500, 1967px 578px #FFA500, 1414px 179px #FFA500,
      1750px 1833px #FFA500, 37px 922px #FFA500, 1833px 708px #FFA500, 413px 1989px #FFA500,
      1269px 1291px #FFA500, 971px 580px #FFA500, 503px 533px #FFA500, 641px 175px #FFA500,
      863px 1831px #FFA500, 1174px 1250px #FFA500, 1612px 1022px #FFA500,
      1136px 1170px #FFA500, 706px 1101px #FFA500, 887px 1795px #FFA500, 849px 444px #FFA500,
      1015px 1058px #FFA500, 322px 90px #FFA500, 1577px 266px #FFA500, 176px 878px #FFA500,
      710px 474px #FFA500, 769px 523px #FFA500, 418px 1298px #FFA500, 654px 1049px #FFA500,
      327px 743px #FFA500, 343px 192px #FFA500, 930px 125px #FFA500, 835px 1193px #FFA500,
      473px 1709px #FFA500, 1857px 319px #FFA500, 675px 278px #FFA500, 1546px 613px #FFA500,
      811px 764px #FFA500, 303px 1360px #FFA500, 447px 930px #FFA500, 1475px 1935px #FFA500,
      1101px 738px #FFA500, 1577px 1373px #FFA500, 1634px 628px #FFA500,
      1231px 663px #FFA500, 275px 1076px #FFA500, 1746px 668px #FFA500,
      1714px 1167px #FFA500, 847px 34px #FFA500, 1413px 450px #FFA500, 1037px 1738px #FFA500,
      794px 634px #FFA500, 1800px 1946px #FFA500, 1346px 1826px #FFA500,
      718px 1732px #FFA500, 151px 1276px #FFA500, 428px 976px #FFA500, 485px 938px #FFA500,
      98px 344px #FFA500, 1936px 1462px #FFA500, 142px 349px #FFA500, 1659px 324px #FFA500,
      1074px 1878px #FFA500, 345px 75px #FFA500, 508px 1532px #FFA500, 1117px 611px #FFA500,
      33px 350px #FFA500, 1002px 565px #FFA500, 986px 885px #FFA500, 1086px 1066px #FFA500,
      1102px 211px #FFA500, 590px 1021px #FFA500, 719px 145px #FFA500, 964px 980px #FFA500,
      259px 1554px #FFA500, 1942px 748px #FFA500, 1569px 601px #FFA500, 417px 609px #FFA500,
      1143px 1210px #FFA500, 1182px 552px #FFA500, 1224px 1804px #FFA500,
      898px 1516px #FFA500, 736px 624px #FFA500, 213px 754px #FFA500, 408px 496px #FFA500,
      1820px 1548px #FFA500, 1807px 1514px #FFA500, 739px 189px #FFA500,
      1304px 1249px #FFA500, 1437px 122px #FFA500, 1702px 821px #FFA500,
      370px 1554px #FFA500, 10px 1505px #FFA500, 501px 593px #FFA500, 1482px 23px #FFA500,
      1774px 1032px #FFA500, 828px 262px #FFA500, 1530px 1354px #FFA500,
      1698px 886px #FFA500;
    content: " ";
    display: circle;
    height: 2px;
    position: var(--anim-position);
    width: 2px;
    z-index: 1;
    transparent: 0;
  }
  #container:before,
  #container:after {
    animation: animStar 50s linear infinite;
    background: transparent;
    box-shadow: 46px 995px #FFA500, 1287px 1821px #FFA500, 1954px 1267px #FFA500,
      1880px 1659px #FFA500, 381px 829px #FFA500, 314px 1471px #FFA500,
      1631px 1262px #FFA500, 889px 506px #FFA500, 1836px 1779px #FFA500, 823px 42px #FFA500,
      343px 943px #FFA500, 1334px 1179px #FFA500, 285px 287px #FFA500, 1820px 1967px #FFA500,
      872px 663px #FFA500, 541px 1759px #FFA500, 253px 1099px #FFA500, 1383px 794px #FFA500,
      433px 716px #FFA500, 69px 1603px #FFA500, 1738px 1239px #FFA500, 1540px 1633px #FFA500,
      1829px 288px #FFA500, 1778px 1640px #FFA500, 1336px 1188px #FFA500,
      1001px 1419px #FFA500, 198px 334px #FFA500, 953px 840px #FFA500, 1115px 773px #FFA500,
      85px 844px #FFA500, 1974px 644px #FFA500, 1720px 429px #FFA500, 1088px 831px #FFA500,
      919px 390px #FFA500, 866px 346px #FFA500, 617px 5px #FFA500, 665px 1023px #FFA500,
      231px 118px #FFA500, 1715px 78px #FFA500, 901px 1788px #FFA500, 1516px 1203px #FFA500,
      541px 1364px #FFA500, 404px 562px #FFA500, 244px 155px #FFA500, 278px 72px #FFA500,
      1156px 889px #FFA500, 204px 1622px #FFA500, 313px 484px #FFA500, 760px 1478px #FFA500,
      1416px 1365px #FFA500, 257px 190px #FFA500, 632px 769px #FFA500, 1334px 1685px #FFA500,
      1769px 555px #FFA500, 643px 514px #FFA500, 1948px 376px #FFA500, 572px 579px #FFA500,
      643px 1787px #FFA500, 1194px 137px #FFA500, 1099px 1136px #FFA500, 987px 35px #FFA500,
      207px 1617px #FFA500, 756px 174px #FFA500, 346px 1054px #FFA500, 1338px 1897px #FFA500,
      1024px 1995px #FFA500, 1747px 382px #FFA500, 45px 7px #FFA500, 1764px 1556px #FFA500,
      944px 251px #FFA500, 1121px 113px #FFA500, 1660px 1388px #FFA500, 762px 1022px #FFA500,
      515px 287px #FFA500, 1115px 1817px #FFA500, 1306px 1942px #FFA500,
      1572px 1410px #FFA500, 1675px 48px #FFA500, 48px 1845px #FFA500, 1393px 174px #FFA500,
      1927px 1094px #FFA500, 114px 412px #FFA500, 1897px 1349px #FFA500,
      151px 1800px #FFA500, 3px 433px #FFA500, 1837px 173px #FFA500, 1844px 1357px #FFA500,
      957px 743px #FFA500, 672px 719px #FFA500, 433px 1476px #FFA500, 1314px 690px #FFA500,
      1764px 1888px #FFA500, 1287px 868px #FFA500, 1282px 1989px #FFA500,
      1258px 94px #FFA500, 1335px 1311px #FFA500, 957px 1204px #FFA500, 208px 1065px #FFA500,
      688px 678px #FFA500, 1835px 1130px #FFA500;
    content: " ";
    display: circle;
    height: 3px;
    position: var(--anim-position);
    width: 3px;
    z-index: 1;
    transparent: 0;
  }
  @keyframes animStar {
    from {
      transform: translateY(0px);
    }
    to {
      transform: translateY(-2000px);
    }
  }
}
.bottom-box ul li {
     color: #FFA500 !important;
}
.top-box {
     background: #FFA500;
}
.bottom-box ui li:before {
     background: #FFA500 !important;
}
.header-diamond .diamond-color {
     background: #FFA500;
}

版式代码

@import url("https://fonts.googleapis.com/css2?family=Aldrich&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Kdam+Thmor+Pro&display=swap");
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "corporate";
   --theme-name: "Corporate Theme";
 
   --logo-image: url("http://backrooms-sandbox-2.wdfiles.com/local--files/sky3theme/corporate-logo");
   --header-title: "The Backrooms";
   --header-subtitle: "未来空间，近在眼前";
 
    --body-font: 'Aldrich', zcoolwenyiti;
    --header-font: 'Kdam Thmor Pro', zcoolwenyiti;
    --title-font: 'Kdam Thmor Pro', zcoolwenyiti;
    --mono-font: 'Noto Serif SC', sans-serif;
    --terminal-font: 'VonwaonBitmap 12px', sans-serif;
    --additional-font: 'Noto Sans SC', sans-serif;
 
   --white-monochrome: 47, 63, 76;
   --text-white-monochrome: 231,254,255;
   --swatch-text-secondary-color: 231,254,255;
   --pale-gray-monochrome: 0,115,207;
   --light-gray-monochrome: 207,236,255;
   --gray-monochrome: 174,198,207;
   --black-monochrome: 240, 255, 255;
   --bright-accent: 240, 248, 255;
   --medium-accent: 30, 181, 232;
   --dark-accent: 125, 196, 235;
   --pale-accent: 69,177,232;
   --alt-accent: 0, 114, 187;
   --midnight-blue:  0,2,64;
   --baby-blue: 161,202,241;
   --medium-blue: 65,105,225;
   --darker-blue: 0,3,132;
 
   --swatch-topmenu-border-color: var(--medium-accent);
  --swatch-headerh1-color: 222, 222, 222;
  --swatch-headerh2-color: 176,196,222;
 
   --link-color: 70,150,200;
   --hover-link-color: 90, 180, 220;
   --visited-link-color: 162,162,208;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 0%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
#top-bar div.mobile-top-bar > ul > li > a,
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a,
#top-bar div.top-bar > ul > li > ul > li > a {
   color: rgb(var(--bright-accent));
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
   font-size: 1.5em;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   font-size: 1em;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
.yui-navset .yui-nav .selected a {
   color: rgb(var(--bright-accent)) !important;
}
 
table.wiki-content-table th {
   color: rgb(var(--white-monochrome));
}
 
#login-status {
   color: rgb(var(--bright-accent));
}
 
#login-status a {
   color: rgb(var(--bright-accent));
}
 
#search-top-box input.empty {
   color: rgb(var(--bright-accent));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--alt-accent))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(90, 20, 20,.25);
}
blockquote a {
    color: rgb(var(--light-gray-monochrome));
}
 
.styled-quote {
   background-color:rgb(var(--black-monochrome));
   border-left: 0.5rem solid rgba(var(--midnight-blue));
   color:rgb(var(--darker-blue));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--midnight-blue));
   border-left: 0.5rem solid rgba(var(--black-monochrome));
   color:rgb(var(--text-white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.lightblock {
   background-color: rgb(var(--black-monochrome));
   color: rgb(var(--darker-blue));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.block {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--midnight-blue));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--midnight-blue));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: rgb(var(--text-white-monochrome));
}
 
.titleblock {
        background-color: rgb(var(--black-monochrome));
        color:rgb(var(--midnight-blue));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--baby-blue)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--midnight-blue));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--baby-blue));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.dark-titleblock {
        background-color: rgb(var(--midnight-blue));
        color:rgb(var(--text-white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--baby-blue)) 2px;
     }
 
     .dark-titlebox{
       color: rgb(var(--midnight-blue));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--baby-blue));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.border-block {
    background-color:rgb(var(--gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
 }
 
.filetabs .yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li {
   display: inline-block;
}
 
.filetabs .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
   display: block;
}
 
.filetabs .yui-navset .yui-content {
   border-top-width: 15px;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a,
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' preserveAspectRatio='none' viewBox='0 0 150 45' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 4.6.0%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='matrix(1 0 0 1 74.95 22.39)' id='bC-LIzxo7Tu37zCdkDrqS' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(125, 196, 235); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -74.94856 22.50703 L -60.0064 -12.520110000000003 C -60.0064 -12.520110000000003 -55.89385 -21.849030000000003 -47.235839999999996 -22.281930000000003 C -38.57782999999999 -22.714830000000003 46.87608 -22.39016 46.87608 -22.39016 C 46.87608 -22.39016 56.05659 -23.219710000000003 61.40639 -12.520120000000002 C 66.75618 -1.8205300000000015 74.94856 22.506959999999996 74.94856 22.506959999999996 z' stroke-linecap='round' /%3E%3C/g%3E%3Cg transform='matrix(1 0 0 1 75.18 17.97)' id='E8ePkHu_UUyvFWDAIzFyP' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(125, 196, 235); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -46.15385 12.0108 L -46.15385 -12.01079 L 46.153839999999995 -12.01079 L 46.153839999999995 12.0108 z' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
    background-size: 100% 2.7rem;
    background-repeat: no-repeat;
    border-width: 0px;
    border-top: none;
    background-position: top;
}
 
.filetabs .yui-navset .yui-nav a,
.filetabs .yui-navset .yui-navset-top .yui-nav a {
   padding: 4px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav .selected a,
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
.filetabs .yui-navset .yui-nav .selected a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected a:hover {
    padding: 8px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav a:hover,
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
   padding: 6px 20px 0px 20px;
}
 
.filetabs .yui-navset .yui-nav,
.filetabs .yui-navset .yui-navset-top .yui-nav {
    border-color: transparent;
}
 
.filetabs .yui-navset .yui-nav .selected,
.filetabs .yui-navset .yui-navset-top .yui-nav .selected,
.filetabs .yui-navset .yui-nav .selected a:active,
.filetabs .yui-navset .yui-nav .selected a:focus,
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   background-color: transparent;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   box-shadow: none;
}
 
.filetabs .yui-navset .yui-nav li {
   margin-right: 36px;
}
 
.filetabs .yui-navset .yui-nav .selected a {
   color: rgb(var(--pale-gray-minochrome)) !important;
}
 
.filetabs .yui-navset .yui-nav a:focus,
.filetabs .yui-navset .yui-nav a:hover {
   color: rgb(var(--white-monochrome));
}
 
.filetabs .yui-navset .yui-nav .selected a em,
.filetabs .yui-navset .yui-nav .selected a:hover em {
   position: relative;
   top: -4px;
}
 
.filetabs .yui-navset .yui-nav a:hover em {
   position: relative;
   top: -2px;
}
 
.filetabs .yui-navset .yui-nav li,
.filetabs .yui-navset .yui-navset-top .yui-nav li {
   border-bottom: solid 1px rgb(var(--black-monochrome));
}
 
.filetabs .yui-navset .yui-nav li.selected,
.filetabs .yui-navset .yui-navset-top .yui-nav li.selected {
   border-bottom: none;
   z-index: 1;
}
 
code,
.code {
   background-color: rgb(var(--darker-blue));
}
 
:root{
  --base-color: rgb(34,191,250);
  --hover-color: rgb(173,216,230);
  --click-color: rgb(164,221,237);
}
 
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px;
    transition: background 0.1s linear;
    background: var(--base-color);
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
 
#page-content .collapsible-block-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
}
 
#page-content .collapsible-block-link:hover {
    text-decoration: none
}
 
#page-content .collapsible-block-content {
    transition: border-top-color 0.2s linear, border-bottom-color 0.2s linear;
    border-top: solid var(--base-color) 5px;
    border-bottom: solid var(--base-color) 3px;
}
 
#page-content .collapsible-block-folded {
    max-width: 100%;
}
#page-content .collapsible-block-unfolded-link{
    width: min-content;
}
 
#page-content .collapsible-block-folded .collapsible-block-link::before {
    content: "▷";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
#page-content .collapsible-block-unfolded .collapsible-block-link::before {
    content: "▽";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
 
#page-content .collapsible-block-folded:hover, #page-content .collapsible-block-unfolded-link:hover {
    background: var(--hover-color);
    max-width: 100%;
}
 
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content{
    border-top-color: var(--hover-color);
    border-bottom-color: var(--hover-color);
}
 
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content::after {
    background: var(--hover-color);
}
 
#page-content .collapsible-block-folded:active, #page-content .collapsible-block-unfolded-link:active, #page-content .collapsible-block-unfolded-link:active + .collapsible-block-content::after {
    transition: background 0s, max-width 0s;
    background: var(--click-color);
    max-width: 100%;
}
 
#page-content .collapsible-block-unfolded-link:active + .collapsible-block-content {
    transition: border-top-color 0s, border-bottom-color 0s;
    border-top-color: var(--click-color);
    border-bottom-color: var(--click-color);
}
 
#page-content .unfolded-collapse {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px;
    background: var(--base-color);
    color: white;
    font-weight: bold;
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
 
#page-content .unfolded-collapse::before {
    content: "▽";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
 
#page-content .unfolded-collapse-border {
    display: block;
    width: 700px;
    border-top: solid var(--base-color) 5px;
}
 
#page-content .center-collapse .collapsible-block-folded, #page-content .center-collapse .collapsible-block-unfolded-link, #page-content .center-collapse .unfolded-collapse{
    margin:auto;
    margin-top: 10px;
}
 
#page-content .addendumfooter{
    display: block;
    border-bottom: solid 3px var(--base-color);
    margin: auto;
    text-align: center;
}
 
#page-content .info-container .collapsible-block {
    counter-increment: none;
}
 
#page-title{
    font-family: var(--header-font);
    border-bottom: 2px solid rgb(var(--pale-accent));
    text-align: center;
    color: rgb(var(--pale-accent));
}
 
#page-content .info-container .collapsible-block-folded, #page-content .info-container .collapsible-block-unfolded-link  {
    transition: none;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    box-shadow: none;
    background: var(--barColour);
}
 
#page-content .info-container .collapsible-block-folded::before, #page-content .info-container .collapsible-block-unfolded-link::before  {
    content: "";
    display: none;
}
 
#page-content .info-container .collapsible-block-content {
    border-bottom: none;
    transition: none;
    border-top: none;
}
 
#page-content .info-container .collapsible-block-content::after {
    display: none;
}
 
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded, #page-content .unfolded-collapse{
    line-height: 1.4;
}
 
#page-content .collapsible-block-folded .collapsible-block-link::before, #page-content .collapsible-block-unfolded .collapsible-block-link::before, #page-content .unfolded-collapse::before {
    font-size: 130%;
    margin-left: -0.4em
}
 
.log-top {
    font-family: var(--header-font);
    text-align: center;
    font-size: 2em;
    color: rgb(var(--medium-blue));
}
 
.presum {
    font-family: var(--title-font);
    color: rgb(var(--medium-blue));
}
 
.presumtext {
    font-family: var(--additional-font);
    color: rgb(var(--medium-blue));
}
 
table.speak th {
    font-size: 1.05em;
    font-weight: bold;
    border-right: 1px solid #c6d6dd;
    color: rgb(var(--medium-blue));
    padding:  1.1em 1em 0em 1em;
}
 
table.speak td {
    padding: 1.1em 0em 0em 0.9em;
}
 
table.speak td.act {
    font-family: var(--mono-font);
    color: rgb(var(--darker-blue));
}
 
table.speak td.speech {
    color: rgb(var(--medium-blue));
}
 
.terminal-top {
    font-family: var(--header-font);
    text-align: center;
    font-size: 2em;
    color: rgb(var(--bright-accent));
}
 
table.digital {
    font-family: var(--terminal-font);
}
 
table.digital th {
    font-weight: bold;
    border: none;
    padding: 0, 0, 0, 0;
    vertical-align: top;
}
 
table.digital td {
    padding: 0em 0 0 1em;
}
 
table.digital td.response {
    color: rgb(var(--baby-blue));
}
 
#account-options{
    color: rgb(var(--midnight-blue));
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "crystal-kaiju";
   --theme-name: "Crystal Kaiju Theme";
 
   --logo-image: url("http://backrooms-sandbox-2.wdfiles.com/local--files/collab%3Afrrixy/3");
   --header-title: "The Backrooms";
   --header-subtitle: "水晶将守序闪耀。 ";
 
   --body-font: 'Noto Sans SC', sans-serif;
   --header-font: 'Raleway', sans-serif;
   --title-font:  'Noto Sans SC', sans-serif;
   --mono-font: 'Noto Serif SC', serif;
 
   --white-monochrome: 19,28,50;
   --pale-gray-monochrome: 135,50,46;
   --light-gray-monochrome: 77,39,48;
   --gray-monochrome: 211,207,205;
   --black-monochrome: 217,203,158;
   --bright-accent: 6, 60, 105;
   --medium-accent: 115, 38, 58;
   --dark-accent: 6, 60, 105;
   --dark-gray-monochrome: 115, 38, 58;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--pale-gray-monochrome)) 0%,
      rgba(var(--pale-gray-monochrome), 0.20) 100%
   );
 
   --swatch-headerh1-color: var(--black-monochrome);
   --swatch-headerh2-color: var(--black-monochrome);
   --swatch-topmenu-border-color: var(--pale-gray-monochrome);
   --swatch-topmenu-bg-color: var(--pale-gray-monochrome);
 
   --link-color: 230, 23, 68;
   --hover-link-color: 230, 23, 68;
 
   --background-gradient-distance: 0rem;
 
   --diagonal-stripes: linear-gradient(transparent 0);
   background-image:
    radial-gradient(circle, rgb(var(--pale-gray-monochrome)) 100%, transparent 20);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 10rem;
#login-status,
#login-status a {
   color: rgb(var(--swatch-text-general));
}
#search-top-box-form input[type=submit] {
   color: rgb(var(--swatch-text-general));
}
#search-top-box-form input[type=submit]:focus,
#search-top-box-form input[type=submit]:hover {
   --text-shadow: none;
   background-color: rgb(var(--swatch-menubg-dark-color));
   color: rgb(var(--swatch-text-general));
}
#search-top-box-input:focus, #search-top-box-input:hover {
   color: rgb(var(--swatch-text-general));
}
#side-bar .heading p,
#side-bar .side-block > .collapsible-block .collapsible-block-link {
   --text-shadow: none;
   color: rgb(var(--swatch-text-general));
}
.yui-navset .yui-nav a:focus,
.yui-navset .yui-nav a:hover {
   background-color: rgb(var(--swatch-primary-darker));
}
table.wiki-content-table th {
   background: rgb(var(--swatch-secondary-color));
   color: rgb(var(--swatch-text-general));
}
   --rating-module-button-plus-color: var(--swatch-menubg-dark-color);
   --rating-module-button-negative-color: var(--swatch-menubg-dark-color);
   --rating-module-button-cancel-color: var(--swatch-menubg-dark-color);
   --rating-module-button-credit-color: var(--swatch-menubg-dark-color);
.owindow .button-bar a,
a.button,
button,
div.buttons input,
file,
input.button {
   border-color: rgb(var(--swatch-primary-darkest));
}
.dark-styled-quote h1,
.dark-styled-quote h2,
.dark-styled-quote h3,
.dark-styled-quote h4,
.dark-styled-quote h5,
.dark-styled-quote h6,
.darkblock h1,
.darkblock h2,
.darkblock h3,
.darkblock h4,
.darkblock h5,
.darkblock h6 {
   color: rgb(var(--white-monochrome));
}

版式代码

@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "Database";
   --theme-name: "Database Theme";
 
   --base-font-size: 0.9rem;
 
   --logo-image: none;
   --header-title: "数据库";
   --header-subtitle: "";
 
   --body-font: "VonwaonBitmap 16px", VT323,monospace;
   --header-font: "VonwaonBitmap 16px", VT323, monospace;
   --title-font: "VonwaonBitmap 16px", VT323, monospace;
   --mono-font: "VonwaonBitmap 16px", VT323, monospace;
 
    --text: 229, 140, 36;
    --link: 184, 86, 24;
    --back: 29, 18, 7;
 
    --white-monochrome: var(--back);
    --pale-gray-monochrome: var(--back);
    --light-gray-monochrome: var(--text);
    --gray-monochrome: var(--back);
    --dark-gray-monochrome: var(--text);
    --black-monochrome: var(--text);
    --pale-accent: var(--link);
    --bright-accent: var(--link);
    --medium-accent: var(--back);
    --dark-accent: var(--back);
    /* --alt-accent: 255, 0, 255; */
 
   --swatch-text-light: var(--text);
   --rating-module-button-plus-color: var(--text);
   --rating-module-button-negative-color: var(--text);
   --rating-module-button-cancel-color: var(--text);
   --rating-module-button-credit-color: var(--text);
 
   --border-styling: solid 0.15rem rgb(var(--swatch-border-color));
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
 
   --gradient-topmenu: linear-gradient(
      to bottom,
      hsla(0, 0%, 100%, 0) 0%,
      hsla(0, 0%, 100%, 0) var(--header-height-on-desktop),
      rgba(var(--swatch-topmenu-border-color), 1) var(--header-height-on-desktop),
      rgba(var(--swatch-topmenu-border-color), 1) calc(var(--header-height-on-desktop) + 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--header-height-on-desktop) + 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 0.95) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-border-color), 1) calc(100% - 0.15rem),
      rgba(var(--swatch-topmenu-border-color), 1) 100%
   );
}
 
html {
   line-height: 1.175;
}
 
body {
   font-size: 1.1em;
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
   transition: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
#header h1:before, #header h2:before {
   content: "";
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
#account-topbutton {
   border: var(--border-styling);
}
 
#search-top-box-form input[type="submit"]:hover {
    background: rgb(var(--text));
    color: rgb(var(--back));
}
 
#account-options {
   background-color: rgb(var(--back));
   border: var(--border-styling);
}
 
#account-options>ul>li a:hover {
   color: rgb(var(--text));
}
 
#search-top-box input.empty:hover {
     color: rgb(var(--back));
}
 
#top-bar>ul>li a {
   color: rgb(var(--text));
}
 
#page-title {
   color: rgb(var(--link));
}
 
#page-title:before {
   content: "> ";
}
 
#top-bar div.mobile-top-bar>ul>li a,
#top-bar div.top-bar>ul>li a{
   color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li a:hover,
#top-bar div.top-bar>ul>li a:hover{
   color: rgb(var(--back));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li,
#top-bar div.top-bar>ul>li>ul>li {
    background-color: rgb(var(--back));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li a,
#top-bar div.top-bar>ul>li>ul>li a {
    color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li:hover,
#top-bar div.top-bar>ul>li>ul>li:hover {
    background-color: rgb(var(--text));
}
 
#top-bar div.mobile-top-bar>ul>li>ul>li a:hover,
#top-bar div.top-bar>ul>li>ul>li a:hover {
    color: rgb(var(--back));
}
 
h1, h2, h3, h4, h5, h6 {
   color: rgb(var(--link));
}
 
h1:before, h2:before, h3:before, h4:before, h5:before, h6:before {
    content: "> "
}
 
blockquote, .blockquote, .darkblock, .dark-styled-quote {
   padding: 0.1rem 0.7rem;
   margin: 1rem 0;
   color: rgb(var(--text));
   border: var(--border-styling);
}
 
.styled-quote, .light-block {
   background-color: rgb(var(--text));
   padding: 0.1rem 0.7rem;
   margin: 1rem 0;
   color: rgb(var(--back));
   border: var(--border-styling);
}
 
#page-title, .meta-title {
    border-bottom: var(--border-styling);
}
 
.page-rate-widget-box {
   border: var(--border-styling);
   background: rgb(var(--back));
}
 
.code {
   border: var(--border-styling);
}
 
.scp-image-block .scp-image-caption {
   border-top: var(--border-styling);
}
 
.scp-image-block {
   border: var(--border-styling);
}
 
hr {
   color: transparent;
   background-color: transparent;
   border: 0;
   border-bottom: var(--border-styling);
}
 
.collapsible-block-link:before {
   content: "> "
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
   border: var(--border-styling);
}
 
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
   background-color: rgb(var(--text));
   color: rgb(var(--back));
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
   background-color: rgb(var(--text));
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    border: var(--border-styling);
}
 
table.wiki-content-table th,
table.wiki-content-table td {
   border: var(--border-styling) !important;
}
 
.footnotes-footer {
   border: var(--border-styling);
   background-color: rgb(var(--back));
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border: var(--border-styling) !important;
   background-color: rgb(var(--back));
   color: rgb(var(--text));
   margin: 0;
   border-collapse: collapse;
   box-sizing: content-box;
}
 
#side-bar .heading p {
   color: rgb(var(--text));
}
 
#side-bar:hover {
   border: var(--border-styling);
}
 
div.menu-item a:hover {
   background-color: rgb(var(--text)) !important;
   color: rgb(var(--back)) !important;
}
 
#side-bar div.menu-item a:before,
#side-bar div.menu-item a:hover:before {
   background-color: transparent;
}
 
#side-bar .side-block>.collapsible-block .collapsible-block-link {
   color: rgb(var(--text));
}
 
#side-bar .side-block>.collapsible-block .collapsible-block-link:hover {
   color: rgb(var(--back));
   background-color: rgb(var(--taxt)) !important;
}
 
.owindow .button-bar a, a.button, button, div.buttons input, file, input.button {
   color: rgb(var(--text));
}
 
.printuser img.small {
    display: none;
}
 
::-webkit-scrollbar-thumb,
#side-bar:hover::-webkit-scrollbar-thumb {
   background-color: rgb(var(--text)) !important;
}
 
::-webkit-scrollbar-track,
#side-bar:hover::-webkit-scrollbar-track {
   background: rgb(var(--back)) !important;
}
 
.owindow .button-bar a, a.button, button, div.buttons input, file, input.button {
   transition: none;
}
 
#top-bar div.mobile-top-bar>ul>li,
#top-bar div.top-bar>ul>li {
   transition: none;
}
 
#top-bar div.mobile-top-bar>ul>li>a:after,
#top-bar div.mobile-top-bar>ul>li>a:before,
#top-bar div.top-bar>ul>li>a:after,
#top-bar div.top-bar>ul>li>a:before,
#top-bar>ul>li {
   transition: none;
}
 
#top-bar>ul>li>:after,
#top-bar>ul>li>:before {
   display: none;
}
 
#top-bar li ul {
   transition: none;
}
 
.yui-navset * {
   transition: none;
}
 
#side-bar {
   background-color: rgb(var(--back));
}
 
#main-content::before {
   display: none;
}
 
.top-box .bottom-text p, .top-box .bottom-text:after, .top-box .top-text p {
   color: rgb(var(--text)) !important;
}
 
.top-box, .diamond-color {
    background: rgb(var(--back)) !important;
}
 
.top-box {
   border: var(--border-styling) !important;
}
 
.top-box .top-text p {
    font: 2.0rem "VonwaonBitmap 16px" !important;
}
 
.top-box .bottom-text p, .top-box .bottom-text:after {
   font: 1.5rem "VonwaonBitmap 16px" !important;
}
 
.top-box .gradient-box, .top-box:before {
    background: none !important;
    margin-top: 7px;
}
 
.header-diamond {
    background-image: none !important;
}
 
.header-diamond .bg {
    display: none;
}
 
.header-diamond .diamond-pattern, .diamond-color {
   background: rgb(var(--back)) !important;
   border: var(--border-styling) !important;
     mask: none !important;
     -webkit-mask: none !important;
     transform: rotate(45deg) translate(4.1rem, -0.46rem);
   width: 10rem !important;
    height: 10rem !important;
}
 
.bottom-box ul li {
    font: 1.9rem "VonwaonBitmap 16px" !important;
    color: rgb(var(--text)) !important;
    line-height: 1rem !important;
}
 
.bottom-box ul li:before {
    background: rgb(var(--back)) !important;
    height: 0.75rem !important;
    width: 0.75rem !important;
    border: var(--border-styling);
}
 
.top-box.class-unknown .header-diamond {
   filter: none !important;
}
 
.top-box.class-0 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-0.png") center/67% no-repeat !important;
}
 
.top-box.class-1 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-1.png") center/67% no-repeat !important;
}
 
.top-box.class-2 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-2.png") center/67% no-repeat !important;
}
 
.top-box.class-3 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-3.png") center/67% no-repeat !important;
}
 
.top-box.class-4 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-4.png") center/67% no-repeat !important;
}
 
.top-box.class-5 .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-5.png") center/67% no-repeat !important;
}
 
.top-box.class-unknown .header-diamond .diamond-image,
.top-box.class-pending .header-diamond .diamond-image {
   background: url("http://backrooms-sandbox-2.wdfiles.com/local--files/theme%3Adatabase/class-unknown.png") center/67% no-repeat !important;
}
 
.top-box .header-diamond .diamond-image {
   -webkit-mask: none !important;
   mask: none !important;
}
 
@media only screen and (max-width: 440px) {
    .top-box .top-text p {
        font: 2.0rem "VonwaonBitmap 16px" !important;
    }
 
    .bottom-box ul li {
        line-height: 1.5rem !important;
    }
}
 
.top-box.class-0{
   top:25px;
}
.top-box.class-1{
   top:25px;
}
.top-box.class-2{
   top:25px;
}
.top-box.class-3{
   top:25px;
}
.top-box.class-4{
   top:25px;
}
.top-box.class-5{
   top:25px;
}
.top-box.class-unknown{
   top:25px;
}
 
/*
.top-text p:nth-child(1){
   position: relative;
   left: 9px;
   margin:9px 0 5px 0;
}
*/
.top-text p{
   position: absolute;
   top:30%;
   left:7px;
}
 
.bottom-text p{
   position: absolute;
   top:50%;
   left:7px;
   margin-top: 7px;
}
 
:is(.sd-container[class*="{"], .lang-cn) :is(.class-unknown, .class-未知).top-box .bottom-text::after {
   margin-left: 7px;
}

+ 版式代码

body {
    color: #000000;
    font-family: "MS Sans Serif";
    font-size: 14px;
    image-rendering: pixelated;
    word-break: unset;
    --themeColor: #008484;
    --accentColor: #008484;
}
 
:root {
    --logo-image: url("https://backrooms-sandbox.wikidot.com/local--files/etoisle/logo.png");
    --header-title: "the backrooms";
    --header-subtitle: "一个在你心灵深处的层级";
 
/* Typefaces */
    --body-font: "MS Sans Serif", "Microsoft YaHei", 微软雅黑, sans-serif;
    --header-font: "MS Sans Serif", "Microsoft YaHei", 微软雅黑, sans-serif;
    --title-font: "MS Sans Serif", "Microsoft YaHei", 微软雅黑, sans-serif;
    --mono-font: "Noto Serif SC", monospace;
 
    /* Standard Colors */
    --white-monochrome: 250, 250, 250;
    /* white */
    --pale-accent: 220, 220, 220;
    /* visited links */
    --bright-accent: 192, 192, 192;
    /* bright teal */
    --medium-accent: 132, 132, 132;
    /* medium teal - the "default" accent color */
    --dark-accent: 128, 128, 128;
    /* dark teal */
    --alt-accent: 128, 0, 0;
    /* for newpage links */
    --swatch-background: 255, 255, 255;
    --swatch-topmenu-border-color: var(--pale-accent);
    --swatch-topmenu-bg-color: var(--bright-accent);
--swatch-border-color: var(--medium-accent);
    --border-styling: outset 2px rgb(var(--swatch-border-color));
 --darker-accent: 0, 132, 132;
--link-color : 128, 0, 128;
    --link-color-bright: 0, 0, 132;
    --rating-module-button-color: var(--bright-accent);
    --rating-module-text-color: 0, 0, 132;
--newpage-color: 128, 0, 0;
--swatch-menubg-color: 192, 192, 192;
 
    /* Box-Shadow 1px Borders */
    --box-border-bottom: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-top: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-left: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-right: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    --box-border-all: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("https://backrooms-sandbox.wikidot.com/local--files/etoisle/header.png");
    background-repeat: repeat-x;
    background-size:  inherit;
}
 
.scp-image-block {
box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
    border-radius: 0;
    margin: 0 2em 1em;
}
.scp-image-block.block-right {
    background: #ffffff;
background-color: #ffffff;
 
}
.scp-image-block .scp-image-caption {
background-color: var(--bright-accent);
color: black;
}
 
a:visited {
  color: #800080 !important;
}
 
.scp-image-block img {
padding-bottom: 0px !important;
    margin-bottom: 1em;
    border: #DFDFDF inset 2px;
}
 
#page-title, h1 {
    color: #000084;
    font-family: "Microsoft Sans Serif";
}
.page-rate-widget-box {
     background-color: #C0C0C0!important;
    border: #DFDFDF outset 2px !important;
box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
}
 
.page-rate-widget-box .rate-points {
     background-color: #C0C0C0!important;
    border: none;
    color: #000084 !important;
}
 
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: #C0C0C0;
    border-top: none;
    border-bottom: none;
color: #000000;
}
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    background: transparent;
background-color:  #000084;
    color: #000000;
}
.page-rate-widget-box .cancel {
    background: transparent;
    background-color: #000084;
    border: none;
}
 
.page-rate-widget-box .cancel a {
    color: #000000;
}
 
h2,
h3,
h4,
h5,
h6 {
    font-family: "Microsoft Sans Serif";
color: #000084;
}
 
#header {
filter: drop-shadow(.01rem .01rem .01rem rgb(var(--black-monochrome)))
}
 
#side-bar {
background-size: 0%
}
 
a:hover {
background-color:#ffffff;
}
 
div.blockquote, blockquote {
    border: #DFDFDF outset 2px;
    background-color: #C0C0C0;
        color: black;
    border-radius: 0px;
}
 
hr {
    margin: 1em 2em;
    padding: 0;
    height: 0;
    border-top: #F0F0F0 groove 2px;
}
 
div.yui-navset div.yui-content {
    color: #000000;
    background: #C0C0C0;
    border-left: #DFDFDF outset 2px;
    border-right: #DFDFDF outset 2px;
    border-bottom: #DFDFDF outset 2px;
}
 
.yui-navset .yui-nav a,
div.yui-navset div.yui-navset-top .yui-nav a {
    /* protect nested tabviews from other orientations */
    border: #DFDFDF outset 2px;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a em,
.yui-navset .yui-nav a em,
.yui-navset .yui-navset-top .yui-nav a em {
    border-color: transparent;
}
 
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    border-color: #008484;
box-shadow: 0 0 0 0 hsla(0,0%,100%,0);
}
 
div.yui-navset ul.yui-nav a,
div.yui-navset div.yui-navset-top ul.yui-nav a {
    background: #C0C0C0;
    border-left: #DFDFDF outset 2px;
    border-right: #DFDFDF outset 2px;
    border-top: #DFDFDF outset 2px;
box-shadow: 0 0 0 0 hsla(0,0%,100%,0)!important;
}
 
div.yui-navset ul.yui-nav a:hover,
div.yui-navset ul.yui-nav a:focus {
    background: #C0C0C0;
    border-left: #DFDFDF inset 2px;
    border-right: #DFDFDF inset 2px;
    border-top: #DFDFDF inset 2px;
}
 
div.yui-navset ul.yui-nav .selected a,
div.yui-navset ul.yui-nav .selected a:focus,
div.yui-navset ul.yui-nav .selected a:hover {
    background: #008484;
    border-left: #DFDFDF outset 2px;
    border-right: #DFDFDF outset 2px;
    border-top: #DFDFDF outset 2px;
}
 
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
box-shadow: 0 0 0 0 hsla(0,0%,100%,0)!important;
}
 
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    border-color: #000000;
    border: 0;
    -webkit-box-shadow: box-shadow: 0 0 0 0 hsla(0,0%,100%,0)!important;
    box-shadow: 0 0 0 0 #008484!important;
margin: 0 0 0 0 !important;
width: 100%;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a em {
    color: #000000;
}
 
.yui-navset .yui-content {
    background-color: #008484;
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    border-color: #008484;
    /* content border */
}
 
table.wiki-content-table td {
    border: 1px solid #000;
    background-color: #FFFFFF;
}
 
table.wiki-content-table tr {
    border: 1px solid #000;
    background-color: #FFFFFF;
}
 
table.wiki-content-table th {
    border: 1px solid #000;
    background-color: #DFDFDF;
}
 
.wiki-content-table tr th {
     background:  #DFDFDF;
     color: #000000;
     border: 1px solid #000 !important;
}
 
table.wiki-content-table th, table.wiki-content-table tr {
    border: 1px solid #000 !important;
}
 
#side-bar .heading p,
#side-bar .side-block > .collapsible-block .collapsible-block-link {
color: #000084 !important;
}
 
.footnotes-footer {
    background: #C0C0C0;
    border: #DFDFDF outset 2px;
    border-radius: 0px;
    background-color: #C0C0C0;
box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
color: #000000;
}
 
blockquote > blockquote {
    border: #DFDFDF inset 2px;
}
 
.blockquote > .blockquote {
    border: #DFDFDF inset 2px;
}
.hovertip {
background: #C0C0C0 !important;
    border: #DFDFDF outset 2px !important;
    border-radius: 0px !important;
    background-color: #C0C0C0 !important;
box-shadow: 4px 4px 0 0 rgba(0,0,0,0)!important;
color: #000000 !important;
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    display: flex;
}

+ 版式代码

/*fonts*/
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');
@import url('https://fonts.googleapis.com/css?family=Basic|IBM+Plex+Mono:400,700');
 
:root {
    --theme-base: "black-highlighter";
    --theme-id: "eyes-of-argos";
    --theme-name: "Eyes of Argos Theme";
 
    /* Header */
    --logo-image: url("https://backrooms-sandbox.wdfiles.com/local--files/eyesofargos/image%20%281%29.png");
    --header-title: "阿尔戈斯之眼";
    --header-subtitle: "我们正在注视着……";
 
    /* Typefaces */
    --body-font: 'Roboto Slab', sans-serif;
    --header-font: 'IBM Plex Mono', sans-serif;
    --title-font: 'IBM Plex Mono', sans-serif;
    --mono-font: "IBM Plex Mono", monospace;
 
    /* Standard Colors */
    --white-monochrome: 250, 250, 250;
     /* white*/
    --black-monochrome: 0, 0, 0;
    /* black */
    --bright-accent: 29, 161, 250;
    /* the bright blue */
    --medium-accent: 29, 161, 250;
     /* the bright blue, again*/
    --dark-accent: 24, 36, 56;
    /* dark blue for background*/
 
    /* Primary Theme Colors */
    --swatch-background: var(--dark-accent);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--black-monochrome);
 
    /* Primary Text Colors */
    --swatch-text-dark: var(--white-monochrome);
    --swatch-text-light: var(--white-monochrome);
    --swatch-important-text: var(--bright-accent);
    --barColour: var(--very-light-gray-monochrome);
    --linkColour: var(--pale-accent);
 
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--dark-accent);
    --swatch-menubg-light-color: var(--pale-gray-monochrome);
    --swatch-menubg-medium-color: var(--light-gray-monochrome);
    --swatch-menubg-medium-dark-color: var(--gray-monochrome);
    --swatch-menubg-dark-color: var(--dark-gray-monochrome);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--black-monochrome);
    --swatch-menutxt-dark-color: var(--white-monochrome);
    --swatch-menutxt-light-color: var(--white-monochrome);
    --swatch-border-color: var(--bright-accent);
 
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
    --swatch-topmenu-border-color: var(--bright-accent);
    --swatch-topmenu-bg-color: var(--black-monochrome);
 
    /* Link Colors */
    --link-color: var(--bright-accent);
    --visited-link-color: var(--swatch-primary);
    --hover-link-color: var(--swatch-primary);
    --newpage-color: var(--alt-accent);
    --sidebar-links-text: var(--swatch-menutxt-dark-color);
    --link-color-bright: var(--medium-accent);
 
    /* Rating Module Colors */
    --rating-module-button-color: var(--black-monochrome);
    --rating-module-button-plus-color: 0, 200, 0;
    --rating-module-button-negative-color: 200, 0, 0;
    --rating-module-button-cancel-color: 200, 200, 200;
    --rating-module-button-credit-color: 50, 50, 50;
    --rating-module-text-color: var(--swatch-menutxt-dark-color);
    --rating-module-text-hover-color: var(--swatch-menutxt-light-color);
 
     /*making the header larger*/
     --header-height-on-desktop: 10rem;
 
/* Header Gradients */
     --gradient-header: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(24,36,56,1) 79%);
     --diagonal-stripes: repeating-linear-gradient(-45deg, rgba(var(--bright-accent), 0.3), rgba(var(--bright-accent), 0.3) 1px, transparent 2px, transparent 30px),
repeating-linear-gradient(45deg, rgba(var(--bright-accent), 0.3), rgba(var(--bright-accent), 0.3) 1px, transparent 2px, transparent 30px);
 
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-text:var(--white-monochrome);
 
   --sd-border:var(--medium-accent);
 
   --sd-bullets:var(--medium-accent);
 
   --sd-symbol:var(--dark-accent);
 
}
 
/*weird stuff*/
hr {
  background-color: rgb(var(--bright-accent));
  border-color: rgb(var(--bright-accent));
}
 
#page-title {
    border-color: rgb(var(--bright-accent));
    color: rgb(var(--bright-accent))!important;
}
 
#skrollr-body {
   background-image: none;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: none;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#login-status {
    color: rgb(var(--bright-accent));
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 8.1rem;
   top: -1rem;
   background-image: var(--logo-image);
   background-size: auto 8rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 0.6;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   left: 2rem;
   width: 100%;
   display: flex;
   justify-content: left;
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-text:var(--white-monochrome);
 
   --sd-border:var(--medium-accent);
 
   --sd-bullets:var(--medium-accent);
 
   --sd-symbol:var(--white-monochrome);
 
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
/*mobile*/
@media only screen and (max-width: 768px) {
#header::before {
   left: unset;
   top: unset;
   background-position: none;
}
 
#header h1, #header h1 a {
   justify-content: none;
}
}
 
/* Header Colours */
h1 {
    color: rgb(var(--bright-accent));
}
h2, h3, h4, h5, h6 {
    color: rgb(var(--white-monochrome));
}
/*image block*/
.scp-image-block .scp-image-caption {
    color: rgb(var(--bright-accent));
    background-color: rgb(var(--black-monochrome));
}
 
/*rate module*/
.page-rate-widget-box {
    background: rgb(var(--bright-accent));
    border-color: rgb(var(--black-monochrome));
    border-width: 3px;
}
 
/*table*/
table.wiki-content-table th {
border: 1px solid rgb(var(--bright-accent)) !important;
background-color: rgb(var(--black-monochrome));
color: rgb(var(--bright-accent));
}
 
table.wiki-content-table td {
border: 1px solid rgb(var(--bright-accent)) !important;
}
 
/*the tabs*/ /*dies*/
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    border-color: rgb(var(--dark-accent));
    -webkit-box-shadow: 0 -webkit-calc(0.0625rem * 5) 0 0 rgb(var(--dark-accent));
    box-shadow: 0 calc(0.0625rem * 5) 0 0 rgb(var(--light-pale-gray-monochrome));
}
 
/* Unselected Tab Values */
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--black-monochrome)); /*here*/
    color: rgb(var(--bright-accent));
}
 
/* Tab Hover Values */
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
    background: rgba(var(--black-monochrome), 0.7);
    color: rgb(var(--bright-accent)) !important;
}
 
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    background: rgb(var(--bright-accent));
    -webkit-box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
    box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
    margin: 0.25em 0.25em 0.5em;
}
 
/* Selected Tab */
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected,
.yui-navset .yui-nav .selected:hover,
.yui-navset .yui-navset-top .yui-nav .selected:hover {
    color: rgb(var(--dark-accent));
    margin-bottom: 0.25rem;
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a em {
    color: rgb(var(--dark-accent));
}
 
.yui-navset .yui-nav .selected a {
    /* Undoes a color set by wikidot's default layout */
    color: rgb(252, 252, 252) !important;
}
 
.yui-navset .yui-content {
    background-color: rgb(var(--dark-accent)); /*edit*/
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    border-color: rgb(var(--dark-accent));
}
 
.yui-navset-left .yui-content {
    border-left-color: rgb(var(--dark-accent));
}
/* Selected tab top colour */
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
        background-color: rgb(var(--bright-accent));
        color: #000000;
}
 
/*funny blocks*/
blockquote, .blockquote, div.blockquote, [class*="blockquote"] {
   background-color:rgb(var(--black-monochrome));
   border-color: rgb(var(--bright-accent));
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(var(--black-monochrome));
   border-left: 0.5rem solid rgba(var(--bright-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.darkblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.borderblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid 0.3rem rgb(var(--bright-accent));
}
 
.logoblock{
padding: 0.01rem 1rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
margin: 0.5rem 0 0.5rem 0.25rem;
display: block;
position: relative;
background-color: black;
}
 
.logoblock::after{
content: "";
float: center;
border: solid 2px #000;
background: url(https://backrooms-sandbox.wdfiles.com/local--files/eyesofargos/image%20%281%29.png) center/50% no-repeat;
opacity: 0.5;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 1;
}

+ 版式代码

@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "eternal-repository";
   --theme-name: "Eternal Repository Theme";
 
   --logo-image: url("http://navyeod-24.wikidot.com/local--files/start/blank%20image.png");
   --header-title: "永恒资料库";
   --header-subtitle: "寻觅遗忘之物，弥补现世所存";
   --mainAccent: 20, 36, 255;
   --link-color: 20, 36, 255;
   --hover-link-color: 20, 36, 255;
   --visited-link-color: 157, 0, 0;
 
   --body-font:  'Noto Sans SC', sans-serif;
   --header-font: 'Noto Sans SC', sans-serif;
   --title-font: 'Noto Sans SC', sans-serif;
   --mono-font: 'Fantasque Sans Mono', monospace;
 
   --white-monochrome: 237, 233, 223;
   --pale-gray-monochrome: 255, 251, 240;
   --light-gray-monochrome: 160, 160, 160;
   --gray-monochrome: 72, 69, 60;
   --black-monochrome: 0, 0, 0;
   --bright-accent: var(--mainAccent);
   --medium-accent: 0, 0, 0;
   --dark-accent: var(--mainAccent);
   --pale-accent: var(--mainAccent);
   --dark-gray-monochrome: 20, 22, 24;
 
   --swatch-topmenu-border-color: var(--mainAccent);
   --swatch-topmenu-bg-color: var(--medium-accent);
   --swatch-menubg-color: var(--medium-accent);
   --swatch-border-color: var(--bright-accent);
 
   --swatch-text-dark: var(--white-monochrome);
   --swatch-text-light: var(--white-monochrome);
   --swatch-background: var(--medium-accent);
   --swatch-menutxt-dark-color: var(--white-monochrome);
   --swatch-primary-darker: var(--pale-accent);
 
   --background-gradient-distance: 0rem;
   --gradient-topmenu: none;
   --diagonal-stripes: linear-gradient(transparent 0);
   --gradient-header: none;
 
    --header-height-on-desktop: 9rem;
 
}
 
/*login stuff*/
#login-status{
   color: rgb(var(--white-monochrome));
}
 
#login-status a#my-account {
   background-color: rgb(var(--pale-accent));
   padding: 0.3em 0.25em 0.2em 0.25em;
}
 
#account-options>ul>li a:hover {
   color: rgb(var(--pale-accent));
}
 
#account-options {
  background: rgb(var(--medium-accent));
  border-color: rgb(var(--pale-accent));
  color: rgb(var(--white-monochrome));
}
 
#login-status ul a {
  color: rgb(var(--white-monochrome));
}
 
/*table stuff*/
table.wiki-content-table th {
background-color: rgb(var(--dark-gray-monochrome));
border: 2px solid rgb(var(--pale-accent)) !important;
}
 
table.wiki-content-table td {
border: 2px solid rgb(var(--pale-accent)) !important;
}
 
/*misc*/
#page-title{
   border-bottom: 2px solid rgb(var(--pale-accent));
   text-align: center;
   color: rgb(var(--pale-accent));
}
 
#side-bar div.menu-item {
   border-color: rgb(var(--bright-accent));
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#footer{
   color: rgb(var(--black-monochrome));
}
 
.scp-image-block {
    border: none;
}
 
.scp-image-block .scp-image-caption {
    color: rgb(var(--white-monochrome));
    background-color: rgb(var(--dark-gray-monochrome));
    border: none;
    margin-top: 0.3rem;
    border-left: 0.2rem solid rgba(var(--pale-accent));
    border-right: 0.2rem solid rgba(var(--pale-accent));
}
 
.page-rate-widget-box {
    background: none;
    border: none;
    background-color: rgb(var(--dark-gray-monochrome));
    border-left: 0.2rem solid rgba(var(--pale-accent));
}
 
/*hexagon header gradient*/
#skrollr-body {
   background: repeating-linear-gradient(-45deg, #000000, #000000 4px, #000000 5px, #000000 5px);
   height: 11rem;
}
 
/*blend gradient*/
#container {
   background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgb(var(--medium-accent)) 93%);
   background-size: 37rem 11rem;
   background-attachment: scroll;
   background-repeat: repeat-x;
}
 
/*misc 2*/
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
/*header stuff*/
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -0.3rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   left: 4.8rem;
   top: 0.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   left: 3.3rem;
   top: 1.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   letter-spacing: 0.1rem;
}
 
#header h1 a::before{
   letter-spacing: 1rem;
}
 
/*links*/
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
/*line + block*/
hr {
   background-color: #000000;
   border-top: solid 2px rgb(var(--pale-accent));
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color: rgb(var(--dark-gray-monochrome));
   border: none;
   border-left: solid 2px rgb(var(--pale-accent));
}
 
/*search*/
/*#search-top-box {
        left: 3%;
        top: 0.5rem;
}
 
#search-top-box-form > #search-top-box-input {
        width: 7rem;
}*/
 
/* TABVIEW - Abandon All Hope Ye Who Enter Here */
 
/*content bg*/
.yui-navset .yui-content {
     background-color: rgba(var(--pale-accent), 0.25);
     border-color: rgb(var(--pale-accent));
}
 
/*unselected tab color*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--dark-gray-monochrome));
    color:rgb(var(--white-monochrome));
}
 
/*hover tab bg*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
     background-color: rgba(var(--pale-accent), .25);
}
 
/*backer background*/
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    background: rgb(var(--dark-gray-monochrome));
}
 
/*selected tab bg*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
    background-color: rgb(var(--pale-accent));
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
    background-color: rgb(var(--pale-accent));
}
 
@media only screen and (max-width: 768px) {
:root{
   --swatch-menubg-color: var(--medium-accent);
}
 
#header::before {
background-image: none;
}
 
    #header {
     height: var(--header-height-on-mobile);
     background-image: url("https://nu-scptheme.github.io/Black-Highlighter/images/logo.svg");
     background-image: var(--logo-image);
     --size: calc(var(--final-header-height-on-mobile) + 1rem);
     --y-offset: 1.5rem;
     background-position:
     calc((var(--header-height-on-mobile) - 0.75rem) - var(--size)) calc(((var(--size) * -1) + var(--header-height-on-mobile) + var(--y-offset)) / 2);
     background-size: var(--size), 100% var(--header-height-on-mobile);
     background-repeat: no-repeat, repeat;
     width: 100vw;
     margin: 0;
     position: sticky;
     top: calc(var(--header-height-on-mobile) * -1);
    }
 
#header h1, #header h1 a {
   left: 1rem;
   top: 0.8rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
   left: 0.8rem;
   top: 1.8rem;
}
 
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"]:hover {
    background: rgb(0, 0, 0);
    border-color: rgb(var(--pale-accent));
}
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"]{
    background: rgb(0, 0, 0);
    border-color: rgb(var(--pale-accent));
}
}
 
.styled-quote {
   background-color:rgb(var(--dark-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--black-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--dark-gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.titleblock {
   background-color: rgb(var(--dark-gray-monochrome));
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--pale-accent)) 2px;
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--pale-accent));
  color: rgb(var(--white-monochrome));
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.stripeblock{
   background: repeating-linear-gradient(-45deg, #070536, #070536 4px, #2525e6 5px, #2525e6 5px);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border-left: 0.5rem solid rgba(var(--dark-gray-monochrome));
   border-right: 0.5rem solid rgba(var(--dark-gray-monochrome));
}
 
#skrollr-body {
   background: repeating-linear-gradient(-45deg, #000000, #000000 4px, #000000 5px, #000000 5px);
   height: 11rem;
}
 
#search-top-box .button {
    visibility: hidden;
}
 
#search-top-box-form {
    visibility: hidden;
}
 
#header::before {
   top: -1.5rem;
}
 
#header h1 a::before {
   letter-spacing: 0.2rem;
}
 
.featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#000000;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #2525e6;
    box-sizing:border-box;
}
 
.featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#0B1727;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #2525e6;
    box-sizing:border-box;
    transition:0.2s;
}
 
//If you don't want a span, don't include anything down here
 
.featurespan{
    float:right;
    font-size:75%;
}
 
@media only screen and (max-width: 520px) {
    .featurespan{
        display:none;
    }
}
 
div#container-wrap{
    background: url(http://backrooms-wiki-cn.wikidot.com/local--files/theme:eternal-repository-theme/long.png) top center repeat-x;
    background-size: auto var(--header-height-on-desktop);
}
 
@media only screen and (max-width: 768px) {
    div#container-wrap{
       background: url(http://backrooms-wiki-cn.wikidot.com/local--files/theme:eternal-repository-theme/long.png) top center repeat-x;
       background-size: auto var(--header-height-on-mobile);
    }
}

+ 版式代码

:root {
    /* S-CSS-P Integration */
    /* If you're making a new CSS theme, please include the following three variables at minimum. */
    --theme-base: "black-highlighter";
    /* must be either "black-highlighter" or "sigma9" */
    --theme-id: "foj-theme";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "FOJ Theme";
    /* set this to your theme's full name */
 
    /* Header */
    /* -logo-image: url("https://nu-scptheme.github.io/Black-Highlighter/img/logo.svg"); */
    --header-title: "杰瑞的信众";
    --header-subtitle: "鹉主杰瑞即是一切。祝颂鹉主万福。";
 
    /* Standard Colors */
    --white-monochrome: 223, 223, 223;
    /* white */
    --pale-gray-monochrome: 244, 244, 244;
    /* v light gray for blockquotes and stuff */
    --light-pale-gray-monochrome: 240, 225, 26;
    /* accent color */
    --very-light-gray-monochrome: 215, 215, 215;
    /* very light accent gray for misc. use */
    --light-gray-monochrome: 160, 160, 160;
    /* light accent gray for login status */
    --gray-monochrome: 66, 66, 72;
    /* gray */
    --dark-gray-monochrome: 48, 48, 52;
    /* dark accent gray for sidebar background */
    --black-monochrome: 0, 0, 0;
    /* black */
    --pale-accent: 171, 221, 235;
    /* light blue, for visited links */
    --bright-accent: 0, 113, 201;
    /* bright blue */
    --medium-accent: 51, 165, 255;
    /* medium blue - the "default" accent color */
    --dark-accent: 39, 34, 120;
    /* dark blue */
    --alt-accent: 58, 201, 190;
    /* greenish, for newpage links */
 
    /* Background and Header Colors */
    --background-gradient-color: var(--very-light-gray-monochrome);
    --header-gradient-color-bottom: var(--medium-accent);
    --header-gradient-color-middle: var(--black-monochrome);
    --header-gradient-color-top: var(--black-monochrome);
 
    /* Primary Theme Colors */
    --swatch-background: var(--white-monochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--dark-accent);
    /* Primary Text Colors */
    --swatch-text-dark: var(--dark-accent);
    --swatch-text-light: var(--white-monochrome);
    --swatch-important-text: var(--bright-accent);
    --barColour: var(--dark-accent);
    --linkColour: var(--pale-accent);
 
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--pale-gray-monochrome);
    --swatch-menubg-light-color: var(--pale-gray-monochrome);
    --swatch-menubg-medium-color: var(--light-gray-monochrome);
    --swatch-menubg-medium-dark-color: var(--gray-monochrome);
    --swatch-menubg-dark-color: var(--dark-gray-monochrome);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--black-monochrome);
    --swatch-menutxt-dark-color: var(--black-monochrome);
    --swatch-menutxt-light-color: var(--white-monochrome);
    --swatch-border-color: var(--black-monochrome);
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
    --swatch-topmenu-border-color: var(--black-monochrome);
    --swatch-topmenu-bg-color: var(--black-monochrome);
 
    /* Link Colors */
    --link-color: var(--bright-accent);
    --visited-link-color: var(--swatch-primary);
    --hover-link-color: var(--swatch-primary);
    --newpage-color: var(--alt-accent);
    --sidebar-links-text: var(--swatch-menutxt-dark-color);
    --link-color-bright: var(--medium-accent);
 
/* Rating Module Colors */
    --rating-module-button-color: var(--black-monochrome);
    --rating-module-button-plus-color: 0, 200, 0;
    --rating-module-button-negative-color: 200, 0, 0;
    --rating-module-button-cancel-color: 200, 200, 200;
    --rating-module-button-credit-color: 50, 50, 50;
    --rating-module-text-color: var(--swatch-menutxt-dark-color);
    --rating-module-text-hover-color: var(--swatch-menutxt-light-color);
 
/* Header Gradients */
 
    --gradient-header: linear-gradient(
     to top,
     rgb(var(--header-gradient-color-bottom)) 0%,
     rgb(var(--header-gradient-color-middle)) 90%,
     rgb(var(--header-gradient-color-top)) 100%
    );
    --gradient-topmenu: linear-gradient(
     to bottom,
     rgba(255, 255, 255, 0) 0%,
     rgba(255, 255, 255, 0) var(--header-height-on-desktop),
     rgba(var(--swatch-topmenu-border-color),1) var(--header-height-on-desktop),
     rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--header-height-on-desktop) + 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 0.95) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-border-color), 1) 100%);
    --gradient-topmenu-mobile: linear-gradient(
     to bottom,
     rgba(var(--swatch-topmenu-border-color),1) 0,
     rgba(var(--swatch-topmenu-bg-color), 1) 0.125rem,
     rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--topbar-height-on-mobile) - 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 1) calc(var(--topbar-height-on-mobile) - 0.125rem),
     rgba(var(--swatch-topmenu-border-color),1) var(--topbar-height-on-mobile));
    --diagonal-stripes: repeating-linear-gradient(
     45deg,
     hsla(0, 0%, 100%, 0),
     hsla(0, 0%, 100%, 0) 0.25vh,
     rgba(88, 88, 88, 0.1) 0.35vh,
     rgba(88, 88, 88, 0.2) 0.5vh
    );
    --gradient-sidemenu-header: linear-gradient(10deg,
     rgba(var(--medium-accent), 0.45) 0%,
     rgba(var(--medium-accent), 0.55) 100%
    );
    --background-gradient-distance: 40rem;
    --gradient-background: linear-gradient(
     to bottom,
     rgba(var(--background-gradient-color),1) 0,
     rgba(var(--background-gradient-color),0.987) calc(0.008 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.951) calc(0.029 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.896) calc(0.064 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.825) calc(0.110 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.741) calc(0.166 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.648) calc(0.231 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.550) calc(0.304 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.450) calc(0.383 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.352) calc(0.467 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.259) calc(0.554 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.175) calc(0.644 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.104) calc(0.735 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.049) calc(0.825 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0.013) calc(0.914 * var(--background-gradient-distance)),
     rgba(var(--background-gradient-color),0) var(--background-gradient-distance));
}
 
#page-title {
    border-color: rgb(var(--bright-accent));
    color: rgb(var(--dark-accent))!important;
}
body, #skrollr-body {
    background-image:
     var(--gradient-header),
     var(--gradient-topmenu),
     var(--gradient-background)!important;
    background-size:
     100% 7.5rem,
     100% 9.375rem,
     100% 40rem;
    background-size:
     var(--header-background-image-size),
     100% var(--final-header-height-on-desktop),
     100% var(--background-gradient-distance);
    /* 120px, 150px */
    background-repeat: repeat-x;
}
 
/* RATING AND INFO MODULES */
.page-rate-widget-box {
     box-shadow: 0px 0px 0px 2px rgb(var(--light-pale-gray-monochrome));
    background: rgb(var(--bright-accent));
     padding: .1em;
     border-radius: 0px 10px 0px 10px;
}
 
.page-rate-widget-box .rate-points {
    background-color: rgb(var(--bright-accent)) !important;
    border: none;
    color: rgb(var(--black-monochrome)) !important;
}
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: rgb(var(--bright-accent));
    border-top: none;
    border-bottom: none;
}
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    background: transparent;
    color: rgb(var(--black-monochrome));
}
.page-rate-widget-box .cancel {
    background: transparent;
    background-color: rgb(var(--bright-accent));
    border: none;
}
 
.page-rate-widget-box .cancel a {
    color: rgb(var(--black-monochrome));
}
span.printuser {
    color: rgb(var(--light-pale-gray-monochrome))
}
#side-bar {
background-size: 0%
}
a:hover {
    color: rgb(var(--light-pale-gray-monochrome)) !important;
    text-decoration: underline;
    background-color: rgb(var(--bright-accent));
    padding: 1px;
}
.scp-image-block .scp-image-caption {
    color: rgb(var(--pale-accent));
}
/* Header Colours */
h1, h2, h3, h4, h5, h6 {
    color: rgb(var(--bright-accent));
}
 
/* TABVIEW - Abandon All Hope Ye Who Enter Here */
 
.yui-navset .yui-nav,
.yui-navset .yui-navset-top .yui-nav {
    border-color: rgb(var(--dark-accent));
    -webkit-box-shadow: 0 -webkit-calc(0.0625rem * 5) 0 0 rgb(var(--dark-accent));
    box-shadow: 0 calc(0.0625rem * 5) 0 0 rgb(var(--light-pale-gray-monochrome));
}
 
/* Unselected Tab Values */
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--pale-accent));
    color: rgb(var(--light-pale-gray-monochrome));
}
 
/* Tab Hover Values */
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
    background: rgb(var(--medium-accent));
    color: rgb(var(--light-pale-gray-monochrome)) !important;
}
 
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    background: rgb(var(--medium-accent));
    -webkit-box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
    box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
}
 
/* Selected Tab */
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected,
.yui-navset .yui-nav .selected:hover,
.yui-navset .yui-navset-top .yui-nav .selected:hover {
    color: rgb(var(--dark-accent));
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a em {
    color: rgb(var(--dark-accent));
}
 
.yui-navset .yui-nav .selected a {
    /* Undoes a color set by wikidot's default layout */
    color: rgb(252, 252, 252) !important;
}
 
.yui-navset .yui-content {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    border-color: rgb(var(--dark-accent));
}
 
.yui-navset-left .yui-content {
    border-left-color: rgb(var(--dark-accent));
}
/* Selected tab top colour */
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
        background-color: rgb(var(--medium-accent));
        color: #000000;
}
 
div.blockquote, blockquote {
    background-color: rgb(var(--pale-accent));
border-color:     rgb(var(--dark-accent));
color: rgb(var(--black-monochrome));
}
 
table.wiki-content-table th {
        background-color: rgb(var(--dark-accent));
color: rgb(var(--pale-gray-monochrome));
}
.footnotes-footer {
    border-color:  rgb(var(--dark-accent));
    color: rgb(var(--black-monochrome));
    background-color: rgb(var(--bright-accent)) !important;
background-image: radial-gradient(ellipse 100% 100% at 100% 100%, transparent, rgb(var(--medium-accent)));
}
 
a.footnote-footer {
    color: rgb(var(--light-pale-gray-monochrome)) !important;
}
.footnote-footer>a:first-of-type {
    color: rgb(var(--light-pale-gray-monochrome)) !important;
}
 
#side-bar .side-block {
    background: rgb(0,0,0,0) !important;
    color: rgb(var(--pale-gray-monochrome));
}
#side-bar:hover {
background:  rgb(var(--dark-gray-monochrome));
}

+ 版式 CSS 代码

@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab&display=swap');
@import url('https://fonts.googleapis.com/css2family=Roboto+Slab:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
 
:root {
    /* S-CSS-P Integration */
    /* If you're making a new CSS theme, please include the following three variables at minimum. */
    --theme-base: "black-highlighter";
    /* must be either "black-highlighter" or "sigma9" */
    --theme-id: "kalag-theme";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "Kalag Institute Theme";
    /* set this to your theme's full name */
 
   --logo-image: url("http://backrooms-wiki.wdfiles.com/local--files/theme%3Akalag/kalaglogo.png");
   --header-title: "卡拉格灵协会";
   --header-subtitle: "永世存续之档案馆";
 
   --body-font: 'Open Sans';
   --header-font: 'ZCOOL XiaoWei';
   --title-font: 'ZCOOL XiaoWei';
   --mono-font: 'Courier', monospace;
 
   --white-monochrome: 215, 219, 204;
   --pale-gray-monochrome: 190, 196, 167;
   --light-gray-monochrome: 63, 66, 50;
   --gray-monochrome: 92, 97, 74;
   --black-monochrome: 63, 66, 50;
   --bright-accent: 92, 97, 74;
   --medium-accent: 63, 66, 50;
   --dark-accent: 92, 97, 74;
   --pale-accent: 63, 66, 50;
 
   --swatch-topmenu-border-color: var(--medium-accent);
   --swatch-menubg-dark-color: var(--light-gray-monochrome);
 
   --link-color: 92, 97, 74;
   --hover-link-color: 92, 97, 74;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
   background-image: none
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: none
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0.1rem;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 19rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
span.printuser {
    color: rgb(var(--pale-gray-monochrome))
}
 
.code {
    border: 2px dashed rgb(var(--pale-gray-monochrome));
}
 
blockquote {
   padding:0.1rem 0.7rem;
   margin:1rem 0;
   background:rgb(var(--pale-gray-monochrome));
   border-radius:0.6rem;
   box-shadow: 0px 0px 3px;
   border: 1.75px solid rgb(var(--white-monochrome));
   box-sizing:border-box;
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-symbol:var(--sd-text);
 
}
 
.block-quote {
   padding:0.1rem 0.7rem;
   margin:1rem 0;
   background:rgb(var(--pale-gray-monochrome));
   border-radius:0.6rem;
   box-shadow: 0px 0px 3px;
   border: 1.75px solid rgb(var(--white-monochrome));
   box-sizing:border-box;
}
 
.styled-quote {
   font-family:Times New Roman;
   padding:0.1rem 0.7rem;
   margin:1rem 0;
   background:rgb(var(--pale-gray-monochrome));
   box-shadow: 0px 0px 3px;
   border: 1.75px solid rgb(var(--white-monochrome));
   box-sizing:border-box;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Syne+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Kavivanar&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merienda&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mate+SC&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
 
@font-face {
    font-family: 'LXGW WenKai GB';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/LxgwWenKaiGB-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
:root {
    /* S-CSS-P Integration */
    /* If you're making a new CSS theme, please include the following three variables at minimum. */
    --theme-base: "black-highlighter";
    /* must be either "black-highlighter" or "sigma9" */
    --theme-id: "lost-theme";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "lost-theme";
    /* set this to your theme's full name */
 
   --logo-image: url("http://backrooms-sandbox-2.wikidot.com/local--files/collab:lost-theme/deertest.png");
   --header-title: "失落一族";
   --header-subtitle: "千年积淀之智识。";
 
   --body-font: 'Kavivanar', 'LXGW WenKai GB', 'Noto Serif SC', serif;
   --header-font: 'Mate SC', 'ZCOOL XiaoWei', 'Noto Serif SC', serif;
   --title-font: 'Merienda', 'LXGW WenKai GB', 'Noto Serif SC', serif;
   --mono-font: 'Syne Mono', 'Noto Sans SC', sans-serif, monospace;
 
   --white-monochrome: 255, 252, 231;
   --pale-gray-monochrome:  229, 168, 107;
   --light-gray-monochrome: 155, 101, 62;
   --gray-monochrome: 67, 102, 49;
   --black-monochrome: 63, 66, 50;
   --bright-accent: 150, 198, 209;
   --medium-accent: 32, 18, 4;
   --dark-accent: 89, 58, 42;
   --pale-accent: 67, 42, 23;
   --black-mono: 20, 20, 20;
   --table-color: 215, 240, 240;
   --funky-tab-color: 215, 240, 240;
 
   --swatch-topmenu-border-color: var(--medium-accent);
   --swatch-menubg-dark-color: var(--dark-accent);
 
   --link-color: 67, 102, 49;
   --hover-link-color: 67, 102, 49;
 
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://backrooms-sandbox-2.wikidot.com/local--files/collab:lost-theme/lostbanner3");
 background-repeat: repeat-x;
background-size: inherit;
}
 
.yui-navset .yui-content {
   background-color:rgba(var(--table-color), .5);
   border-color: rgba(var(--dark-accent));
}
 
.page-rate-widget-box {
    background: rgba(var(--bright-accent), .49);
    border-color: rgba(var(--dark-accent));
    border-width: 1px;
}
 
.scp-image-block .scp-image-caption {
    background-color: rgba(var(--gray-monochrome), .5);
}
 
#search-top-box-input {
    background-color: rgba(var(--bright-accent), .25);
}
#search-top-box-input:hover,
#search-top-box-input:focus {
    background: rgba(var(--bright-accent), .25);
}
 
#side-bar .side-block div a img {
   filter: grayscale(0%);
}
 
#container {
   background-image: none
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-symbol:var(--sd-text);
 
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0.1rem;
   top: -1rem;
   background-image: var(--logo-image);
   background-size: auto 7.25rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.6;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
span.printuser {
    color: rgb(var(--dark-accent))
}
 
.code {
    border: 2px dotted rgb(var(--dark-accent));
}
 
blockquote {
   padding:0.4rem 0.4rem;
   margin:1rem 0;
   background:rgb(var(--pale-gray-monochrome), .55);
   border-radius:0.8rem;
   box-shadow: 0px 0px 3px;
   border: 3px double rgb(var(--dark-accent));
   box-sizing:border-box;
}
 
.block-quote {
   padding:0.4rem 0.4rem;
   margin:1rem 0;
   background:rgb(var(--pale-gray-monochrome));
   border-radius:0.8rem;
   box-shadow: 0px 0px 3px;
   border: 3px double rgb(var(--dark-accent));
   box-sizing:border-box;
}
 
.borderblock {
   background-color:rgb(var(--funky-tab-color));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid 0.3rem rgb(var(--medium-accent));
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--medium-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--medium-accent));
   border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--medium-accent));
}
 
.lightblock {
   background-color:rgb(var(--funky-tab-color));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--medium-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.paperblock{
width: auto;
padding: 0.01rem 1rem;
margin: 0.5rem 0 0.5rem 0.25rem;
background: url(http://vivarium.wdfiles.com/local--files/backrooms%3Aoldpapertheme/thefinalone.jpg) repeat center;
text-shadow: 1px 1px 1px rgba(0,0,0,.25);
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
table.wiki-content-table td {
background-color: rgb(var(--gray-monochrome), .25);
}

+ 版式代码

/*
   M.E.G. Theme
   [M.E.G. Theme]
   by TrailmixNCocoa.
*/
@import url('https://fonts.googleapis.com/css2?family=PT+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Overpass+Mono:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oxygen+Mono&display=swap');
@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
 
@font-face {
    font-family: 'GlowSansSC';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Compressed-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
@font-face {
    font-family: 'GlowSansSC';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Compressed-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "meg-records";
   --theme-name: "M.E.G. Records Theme";
 
   --logo-image: url("http://backrooms-sandbox-2.wikidot.com/local--files/trailmixncocoa-meg-theme/IMG_3129.PNG");
   --header-title: "M.E.G. 记录中心";
   --header-subtitle: "M.E.G. 记录保存设施";
 
    --body-font: 'PT Mono', 'Noto Sans SC', sans-serif;
    --header-font: 'Oxygen Mono', 'GlowSansSC', sans-serif;
    --title-font: 'Overpass Mono', 'GlowSansSC', sans-serif;
    --mono-font: 'Courier Prime', 'Noto Serif SC', monospace;
 
   --white-monochrome: 210, 212, 176;
   --text-white-monochrome: 222, 221, 204;
   --pale-gray-monochrome: 250, 242, 170;
   --light-gray-monochrome: 94, 91, 35;
   --gray-monochrome: 54, 52, 21;
   --black-monochrome: 12, 12, 12;
   --bright-accent: 255, 245, 166;
   --medium-accent: 168, 162, 79;
   --dark-accent: 128, 111, 17;
   --pale-accent:  203,0, 183;
   --alt-accent: 163, 132, 31;
   --meg-accent:  143, 138, 76;
   --darker-meg-accent: 69, 67, 46;
   --backrooms-yellow: 215,200,0;
 
   --swatch-topmenu-border-color: var(--medium-accent);
  --swatch-headerh1-color: 222, 222, 222;
  --swatch-headerh2-color: 237, 230, 123;
 
   --link-color: 87, 77, 1;
   --hover-link-color: 112, 111, 79;
   --visited-link-color: 168, 162, 49;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 0%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--medium-accent)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
.sd-container {
   --sd-symbol:var(--sd-text);
}
 
#top-bar div.mobile-top-bar > ul > li > a,
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a,
#top-bar div.top-bar > ul > li > ul > li > a {
   color: rgb(var(--bright-accent));
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
.yui-navset .yui-nav .selected a {
   color: rgb(var(--bright-accent)) !important;
}
 
table.wiki-content-table th {
   color: rgb(var(--text-white-monochrome));
}
 
#login-status {
   color: rgb(var(--bright-accent));
}
 
#login-status a {
   color: rgb(var(--bright-accent));
}
 
#search-top-box input.empty {
   color: rgb(var(--bright-accent));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--alt-accent))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(90, 20, 20,.25);
}
 
.styled-quote {
   background-color:rgb(var(--bright-accent));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--darker-meg-accent));
   border-left: 0.5rem solid rgba(var(--meg-accent));
   color:rgb(var(--text-white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:#f7e481;
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.block {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--text-white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--darker-meg-accent));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   color: rgb(var(--text-white-monochrome));
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.borderblock {
    background-color:rgb(var( --gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
 .alt-borderblock {
    background-color:rgb(var(--bright-accent));
    color:rgb(var(--black-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
 }
 
.dark-borderblock {
    background-color:rgb(var( --darker-meg-accent));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--meg-accent));
 }
 
 .border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--gray-monochrome));
     border: solid 0.3rem rgb(var(--bright-accent));
    }
 
    .border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backrooms-sandbox-2.wikidot.com/local--files/trailmixncocoa-meg-theme/IMG_3130.PNG) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
 .dark-border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--darker-meg-accent));
     border: solid 0.3rem rgb(var(--meg-accent));
    }
 
    .dark-border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backrooms-sandbox-2.wikidot.com/local--files/trailmixncocoa-meg-theme/IMG_3130.PNG) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--gray-monochrome));
    }
 
    .logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backrooms-sandbox-2.wikidot.com/local--files/trailmixncocoa-meg-theme/IMG_3130.PNG) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .dark-logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--darker-meg-accent));
    }
 
    .dark-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://backrooms-sandbox-2.wikidot.com/local--files/trailmixncocoa-meg-theme/IMG_3130.PNG) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
.titleblock {
        background-color: rgb(var(--gray-monochrome));
        color:rgb(var(--text-white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--gray-monochrome));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.dark-titleblock {
        background-color: rgb(var(--darker-meg-accent));
        color:rgb(var(--text-white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--meg-accent)) 2px;
     }
 
     .dark-titlebox{
       color: rgb(var(--darker-meg-accent));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--meg-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.border-block {
    background-color:rgb(var(--gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
 }
 
.megbox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#b3ac78;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #d6ce92;
    box-sizing:border-box;
}
 
.megflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#f5eeb5;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #c7c089;
    box-sizing:border-box;
    transition:0.2s;
}
.newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(198,191,140,1) 0%, rgba(221,213,154,0) 100%);
    border-radius:0.8rem;
}
 
.light-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#574713;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #dbc46e;
    box-sizing:border-box;
}
 
.light-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#e3d06f;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #6b5d1e;;
    box-sizing:border-box;
    transition:0.2s;
}
.light-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(75,67,16,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.dark-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#4a422e;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
}
 
.dark-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#796522;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #322c20;
    box-sizing:border-box;
    transition:0.2s;
}
.dark-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(50,46,32,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.yellow-featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#d1b65c;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
}
 
.yellow-featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#deca64;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #F4F4F4;
    box-sizing:border-box;
    transition:0.2s;
}
.yellow-newsbox{
    padding:1px 1rem;
    margin:1rem 0;
    background: linear-gradient(90deg, rgba(244,231,139,1) 0%, rgba(214,206,146,0) 100%);
    border-radius:0.8rem;
}
 
.featurebox{
    padding:0 0.5rem;
    margin:1rem 0;
    background:#f4e78b;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #d6ce92;
    box-sizing:border-box;
}
.featureflavor{
    padding:0 0.5rem;
    margin:0.5rem 0;
    background:#f4e78b;
    border-radius:0.6rem;
    box-shadow: 0px 0px 3px;
    border: 1.75px solid #c7c089;
    box-sizing:border-box;
    transition:0.2s;
    height: auto;
}
.footerbox{
    padding:0.1rem 1rem;
    margin-top:1rem;
    background:#222200;
    border-radius:0 1rem 0 0;
    color:#FFB961;
    border: 3px solid #FFEB7D;
    box-sizing:border-box;
}
.footerflavor h1{
    color: #222200;
}
.footerflavor h2{
    color: #222200;
}
.footerflavor h3{
    color: #222200;
}
.footerflavor h4{
    color: #222200;
}
.footerflavor h5{
    color: #222200;
}
.footerflavor h6{
    color: #222200;
}
.footerbox h1{
    color: #f4e78b;
}
.footerbox h2{
    color: #f4e78b;
}
.footerbox h3{
    color: #f4e78b;
}
.footerbox h4{
    color: #f4e78b;
}
.footerbox h5{
    color: #f4e78b;
}
.footerbox h6{
    color: #f4e78b;
}
.footerspan{
    margin-top:0.2rem;
    font-size:80%;
}
.footerflavor{
    padding:0.5px 1rem;
    margin-bottom:1rem;
    background:#f4e78b;
    border-radius:0 0 0 1rem;
    color:#222200;
    box-sizing:border-box;
    height: auto;
}
.profilepic{
    border-radius:0.6rem;
    float:left;
    max-height:13rem;
    height:17vw;
    margin-right:1rem;
    box-shadow: 0px 0px 3px;
    box-sizing:border-box;
}
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
:root {
   --fade-in-delay: 0.1s; /* Change the speed here. */
}
 
.filetabs .yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li {
 
   display: inline-block;
 
}
 
.filetabs .yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav {
 
   display: block;
 
}
 
.filetabs .yui-navset .yui-content {
 
   border-top-width: 15px;
 
}
 
.filetabs .yui-navset .yui-nav a,
 
.filetabs .yui-navset .yui-navset-top .yui-nav a,
 
.filetabs .yui-navset .yui-nav .selected a,
 
.filetabs .yui-navset .yui-nav a:focus,
 
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
 
.filetabs .yui-navset .yui-nav a:hover,
 
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
 
    background-color: transparent;
 
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8' standalone='no' %3F%3E%3C!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' preserveAspectRatio='none' viewBox='0 0 150 45' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 4.6.0%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='matrix(1 0 0 1 74.95 22.39)' id='bC-LIzxo7Tu37zCdkDrqS' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(84, 84, 65fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -74.94856 22.50703 L -60.0064 -12.520110000000003 C -60.0064 -12.520110000000003 -55.89385 -21.849030000000003 -47.235839999999996 -22.281930000000003 C -38.57782999999999 -22.714830000000003 46.87608 -22.39016 46.87608 -22.39016 C 46.87608 -22.39016 56.05659 -23.219710000000003 61.40639 -12.520120000000002 C 66.75618 -1.8205300000000015 74.94856 22.506959999999996 74.94856 22.506959999999996 z' stroke-linecap='round' /%3E%3C/g%3E%3Cg transform='matrix(1 0 0 1 75.18 17.97)' id='E8ePkHu_UUyvFWDAIzFyP' %3E%3Cpath style='stroke: rgb(0,0,0); stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-dashoffset: 0; stroke-linejoin: miter; stroke-miterlimit: 4; fill: rgb(232,231,213); fill-rule: nonzero; opacity: 1;' vector-effect='non-scaling-stroke' transform=' translate(0, 0)' d='M -46.15385 12.0108 L -46.15385 -12.01079 L 46.153839999999995 -12.01079 L 46.153839999999995 12.0108 z' stroke-linecap='round' /%3E%3C/g%3E%3C/svg%3E");
 
    background-size: 100% 2.7rem;
 
    background-repeat: no-repeat;
 
    border-width: 0px;
 
    border-top: none;
 
    background-position: top;
 
}
 
.filetabs .yui-navset .yui-nav a,
 
.filetabs .yui-navset .yui-navset-top .yui-nav a {
 
   padding: 4px 20px 0px 20px;
 
}
 
.filetabs .yui-navset .yui-nav .selected a,
 
.filetabs .yui-navset .yui-nav a:focus,
 
.filetabs .yui-navset .yui-navset-top .yui-nav a:focus,
 
.filetabs .yui-navset .yui-nav .selected a:hover,
 
.filetabs .yui-navset .yui-navset-top .yui-nav .selected a:hover {
 
    padding: 8px 20px 0px 20px;
 
}
 
.filetabs .yui-navset .yui-nav a:hover,
 
.filetabs .yui-navset .yui-navset-top .yui-nav a:hover {
 
   padding: 6px 20px 0px 20px;
 
}
 
.filetabs .yui-navset .yui-nav,
 
.filetabs .yui-navset .yui-navset-top .yui-nav {
 
    border-color: transparent;
 
}
 
.filetabs .yui-navset .yui-nav .selected,
 
.filetabs .yui-navset .yui-navset-top .yui-nav .selected,
 
.filetabs .yui-navset .yui-nav .selected a:active,
 
.filetabs .yui-navset .yui-nav .selected a:focus,
 
.filetabs .yui-navset .yui-nav li,
 
.filetabs .yui-navset .yui-navset-top .yui-nav li {
 
   background-color: transparent;
 
}
 
.filetabs .yui-navset .yui-nav li,
 
.filetabs .yui-navset .yui-navset-top .yui-nav li {
 
   box-shadow: none;
 
}
 
.filetabs .yui-navset .yui-nav li {
 
   margin-right: 36px;
 
}
 
.filetabs .yui-navset .yui-nav .selected a {
 
   color: rgb(var(--swatch-menubg-medium-color)) !important;
 
}
 
.filetabs .yui-navset .yui-nav a:focus,
 
.filetabs .yui-navset .yui-nav a:hover {
 
   color: rgb(var(--swatch-menubg-medium-color));
 
}
 
.filetabs .yui-navset .yui-nav .selected a em,
 
.filetabs .yui-navset .yui-nav .selected a:hover em {
 
   position: relative;
 
   top: -4px;
 
}
 
.filetabs .yui-navset .yui-nav a:hover em {
 
   position: relative;
 
   top: -2px;
 
}
 
.filetabs .yui-navset .yui-nav li,
 
.filetabs .yui-navset .yui-navset-top .yui-nav li {
 
   border-bottom: solid 1px rgb(var(--white-monochrome));
 
}
 
.filetabs .yui-navset .yui-nav li.selected,
 
.filetabs .yui-navset .yui-navset-top .yui-nav li.selected {
 
   border-bottom: none;
 
   z-index: 1;
 
}
 
code,
 
.code {
 
   background-color: rgb(var(--pale-accent));
 
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay));}
 
:root{
  --base-color: rgb(54, 54, 45);
  --hover-color: rgb(84, 76, 44);
  --click-color: rgb(82, 73, 39);
}
 
/* #page-content is shoved everywhere to make sure it's the most specific thingy */
/* Styling! */
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px;
    /* Animated things */
    transition: background 0.2s linear;
    background: var(--base-color);
    /* Technical bits */
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
/* The Clicky Text */
#page-content .collapsible-block-link {
    color: white;
    font-weight: bold;
    text-decoration: none;
}
/* Gets rid of the underline when hovering over the collapsible */
#page-content .collapsible-block-link:hover {
    text-decoration: none
}
/* Collapsible content */
#page-content .collapsible-block-content {
    /* Animated things */
    transition: border-top-color 0.2s linear, border-bottom-color 0.2s linear;
    border-top: solid var(--base-color) 5px;
    border-bottom: solid var(--base-color) 3px;
}
 
/* Folded blocks are animated, unfolded ones are not */
#page-content .collapsible-block-folded {
    max-width: 100%;
}
#page-content .collapsible-block-unfolded-link{
    width: min-content;
}
/* Addendum counter */
 
/* Addendum prefixes */
#page-content .collapsible-block-folded .collapsible-block-link::before {
    content: "▷";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
#page-content .collapsible-block-unfolded .collapsible-block-link::before {
    content: "▽";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
/* Hovering effects */
#page-content .collapsible-block-folded:hover, #page-content .collapsible-block-unfolded-link:hover {
    background: var(--hover-color);
    max-width: 100%;
}
/* Collapsible borders - because it looks prettier this way */
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content{
    border-top-color: var(--hover-color);
    border-bottom-color: var(--hover-color);
}
/* When hovering over link, change addendum tag to hover-color */
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content::after {
    background: var(--hover-color);
}
/* Click flash when clicking, also forces the collapsible to expand */
#page-content .collapsible-block-folded:active, #page-content .collapsible-block-unfolded-link:active, #page-content .collapsible-block-unfolded-link:active + .collapsible-block-content::after {
    transition: background 0s, max-width 0s;
    background: var(--click-color);
    max-width: 100%;
}
/* On click, change borders to click-color */
#page-content .collapsible-block-unfolded-link:active + .collapsible-block-content {
    transition: border-top-color 0s, border-bottom-color 0s;
    border-top-color: var(--click-color);
    border-bottom-color: var(--click-color);
}
/* Done with normal collapsibles, now we do all the variations */
/* Unfolded collapsible */
#page-content .unfolded-collapse {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px;
    background: var(--base-color);
    /* Text */
    color: white;
    font-weight: bold;
    /* Technical bits */
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
/* Addendum prefix */
#page-content .unfolded-collapse::before {
    content: "▽";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
/* Bottom border */
#page-content .unfolded-collapse-border {
    display: block;
    width: 700px;
    border-top: solid var(--base-color) 5px;
}
/* Centering, very simple */
#page-content .center-collapse .collapsible-block-folded, #page-content .center-collapse .collapsible-block-unfolded-link, #page-content .center-collapse .unfolded-collapse{
    margin:auto;
    margin-top: 10px;
}
 
/* Fittingly, we finish with the footer object */
/* The footer is actually the giant bottom border object because larger -> smaller works better */
#page-content .addendumfooter{
    display: block;
    border-bottom: solid 3px var(--base-color);
    margin: auto;
    text-align: center;
}
 
/* Ayer's info-bar patch */
#page-content .info-container .collapsible-block {
    counter-increment: none;
}
#page-content .info-container .collapsible-block-folded, #page-content .info-container .collapsible-block-unfolded-link  {
    transition: none;
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
    padding: 0;
    box-shadow: none;
    background: var(--barColour);
}
#page-content .info-container .collapsible-block-folded::before, #page-content .info-container .collapsible-block-unfolded-link::before  {
    content: "";
    display: none;
}
#page-content .info-container .collapsible-block-content {
    border-bottom: none;
    transition: none;
    border-top: none;
}
#page-content .info-container .collapsible-block-content::after {
    display: none;
}
 
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded, #page-content .unfolded-collapse{
    line-height: 1.4;
}
 
#page-content .collapsible-block-folded .collapsible-block-link::before, #page-content .collapsible-block-unfolded .collapsible-block-link::before, #page-content .unfolded-collapse::before {
    font-size: 130%;
    margin-left: -0.4em
}
 
/* License box patch */
 
#page-content .licensebox .collapsible-block div {
   background: none;
   box-shadow: none;
}

+ 版式代码

/* Fonts */
 
@import url('https://fonts.googleapis.com/css?family=Lato:400,900|PT+Mono|Poppins:600,800|Share+Tech+Mono|Anonymous+Pro');
 
@import url('https://fonts.googleapis.com/css2?family=Baumans&family=Graduate&family=Kelly+Slab&family=Kumar+One&family=Tulpen+One&family=ZCOOL+QingKe+HuangYou&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=Oxygen+Mono&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=Overpass+Mono:wght@300&display=swap');
 
@font-face {
    font-family: 'GlowSansSC';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Compressed-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
@font-face {
    font-family: 'GlowSansSC';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/GlowSansSC-Compressed-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
 
/* All Vars Used */
 
:root {
    /* S-CSS-P Integration */
    /* If you're making a new CSS theme, please include the following three variables at minimum. */
    --theme-base: "nuscp";
    /* mua be either "nuscp" or "sigma9" */
    --theme-id: "meg-edgy";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "MEG EDGY";
    /* set this to your theme's full name */
 
    /* Header */
   --logo-image: url("http://backrooms-sandbox-2.wikidot.com/local--files/trailmixncocoa-meg-theme/IMG_3129.PNG");
    --header-title: "M.E.G.记录中心";
    --header-subtitle: "The M.E.G.机密数据库";
 
    /* Typefaces */
    --body-font: 'Share Tech Mono', 'GlowSansSC', sans-serif;
    --header-font: 'Oxygen Mono', 'GlowSansSC', sans-serif;
    --title-font: 'Kelly Slab', 'GlowSansSC', sans-serif;
    --mono-font: "PT Mono", 'Noto Serif SC', "Andale Mono", "Courier New", Courier, monospace;
 
    /* Standard Colors */
    --white-monochrome: 252, 252, 252;
    /* white */
    --pale-gray-monochrome: 185, 185, 185;
    /* v light gray for blockquotes and stuff */
    --light-gray-monochrome: 170, 170, 170;
    /* light accent gray for login status */
    --gray-monochrome: 66, 66, 72;
    /* gray */
    --grayer-monochrome: 130, 130, 135;
    --dark-gray-monochrome: 48, 48, 52;
    /* dark accent gray for sidebar background */
    --black-monochrome: 30, 20, 20;
    /* black */
    --bright-accent: 125, 25, 25;
    /* Some sidebar text, edit button text etc */
    --medium-accent: 74, 0, 0;
    /* the annoying header thing */
    --dark-accent: 12, 12, 12;
    /* search bar and edit button */
    --newpage-color: 230, 10, 10;
    /* text highlight colour, url link */
    --terminal-medium: 74, 0, 0;
    /* edit button borders */
    --pale-accent: 0, 221, 221;
    /* dark yellow-brown */
 
    --tester-blue: 0, 0, 221;
    /* blue for testing */
    --tester-green: 0, 221, 0;
    /*green for testing */
    --tester-purple: 221, 0, 221;
    /*purple for testing */
    --tester-yellow: 221, 221, 0;
    /*yellow for testing */
 
    --dark-accent-red: 74, 0, 0;
    --mid-accent-red: 140, 25, 30;
    --bright-red: 170, 15, 15;
    --shadow-red: 30, 20, 20;
    --darkish-red: 95, 10, 10;
    --blinding-red: 230, 10, 10;
    --contrast-salmon: 250, 160, 160;
 
    /* Primary Theme Colors */
    --swatch-background: var(--grayer-monochrome);
    --swatch-primary: var(--newpage-color);
    --swatch-primary-darker: var(--mid-accent-red);
    --swatch-primary-darkest: var(--shadow-red);
 
    /* Primary Text Colors */
    --swatch-text-dark: var(--darkish-red);
    --swatch-text-light: var(--light-gray-monochrome);
    --swatch-important-text: var(--tester-purple);
 
      /* Primary Menu Colors */
    --swatch-menubg-color: var(--shadow-red);
    --swatch-menubg-light-color: var(--dark-accent);
    --swatch-menubg-medium-color: var(--mid-accent-red);
    --swatch-menubg-medium-dark-color: var(--bright-red);
    --swatch-menubg-dark-color: var(--mid-accent-red);
    --swatch-menubg-black-color: var(--mid-accent-red);
    --swatch-menubg-hover-color: var(--mid-accent-red);
    --swatch-menutxt-dark-color: var(--bright-red);
    --swatch-menutxt-light-color: var(--light-gray-monochrome);
    --swatch-border-color: var(--dark-gray-monochrome);
 
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--light-gray-monochrome);
    --swatch-headerh2-color: var(--blinding-red);
    --swatch-topmenu-border-color: var(--dark-accent-red);
    --swatch-topmenu-bg-color: var(--dark-accent-red);
 
    /* Header Gradients*/
    --gradient-header: linear-gradient(to bottom,
     rgba(var(--dark-accent-red),0.97) 10%,
     rgba(var(--dark-accent-red),0.97) 40%,
     rgb(var(--black-monochrome)) 100%);
 
    --gradient-topmenu: linear-gradient(to bottom,
     white 0%,
     white 7.5rem,
     rgba(var(--swatch-topmenu-border-color), 1) 7.5rem,
     rgba(var(--swatch-topmenu-bg-color), 1) 7.625rem,
     rgba(var(--swatch-topmenu-bg-color), 0.95) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-border-color), 1) 100%);
 
    --gradient-topmenu-mobile: linear-gradient(to bottom,
     rgba(var(--swatch-topmenu-border-color), 1) 0,
     rgba(var(--swatch-topmenu-bg-color), 1) 0.125rem,
     rgba(var(--swatch-topmenu-bg-color), 1) calc(3rem - 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 1) calc(3rem - 0.125rem),
     rgba(var(--swatch-topmenu-border-color), 1) 3rem);
 
   --diagonal-stripes: linear-gradient(transparent 0);
 
    --gradient-sidemenu-header: linear-gradient(10deg,
     rgba(var(--mid-accent-red), 0.45) 0%,
     rgba(var(--mid-accent-red), 0.55) 100%);
    --header-background-image-size: 100% 7.5rem;
 
    /* Sidebar */
    --sidebar-transition-timing: 0.5s ease-in-out 0.1s;
    --sidebar-internal-border-thickness: 0.16rem;
 
    --background-gradient-color: var(--grayer-monochrome);
    --background-gradient-distance: 50rem;
 
}
 
/* REMOVING HOVER OF THE PAGE OPTIONS ICONS HERE*/
div[id*="page-options-bottom"] {
--swatch-tertiary-color: none;
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--light-gray-monochrome), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
   text-align: justify;
   text-justify: inter-word;
   font-size: 1.1em;
 
}
 
html,
body,
#side-bar:hover {
    scrollbar-color: rgb(var(--tester-blue)) rgb(var(--tester-green));
    }
 
 ::-webkit-scrollbar,
 #side-bar:hover::-webkit-scrollbar {
    background-color: rgb(var(--shadow-red));
    }
 
 ::-webkit-scrollbar-thumb,
 #side-bar:hover::-webkit-scrollbar-thumb {
    background-color: rgb(var(--mid-accent-red));
    }
 
.scp-image-block .scp-image-caption {
    font-size: .8em;
    background-color:rgb(var(--dark-accent));
    color: rgb(var(--bright-red));
}
 
#header h1 {
    color: rgb(var(--tester-green));
}
 
#page-title {
    font-family: 'Kelly Slab', 'GlowSansSC';
    border-color: rgba(var(--mid-accent-red))!important;
 
    background: linear-gradient(to bottom,
     rgba(var(--shadow-red),0.97) 0%,
     rgba(var(--dark-accent-red),0.97) 35%,
     rgb(var(--bright-red)) 80%);
 
    background-clip: text;
  -webkit-background-clip: text;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
}
 
#side-bar div.menu-item .sub-text {
    color: rgb(var(--pale-gray-monochrome));
}
#login-status {
    color: rgb(var(--medium-accent));
}
.code {
    padding: 5px 5px 5px 15px;
    margin-bottom:10px;
    width: 100%;
    font-family: var(--header-font);
    font-size: 1.1em;
    background-color:rgb(var(--shadow-red));
    border: 2px dashed rgb(var(--mid-accent-red));
    color: rgb(var(--bright-red));
}
 
.hl-main {
    filter: invert(1) hue-rotate(180deg);
}
 
.page-options-bottom a {
    background-color:rgb(var(--shadow-red)) !important;
    color: rgb(var(--blinding-red)) !important;
    font-family: var(--header-font);
}
 
table.wiki-content-table th {
    text-align: left !important;
    font-family: var(--title-font) !important;
    color: rgb(var(--pale-gray-monochrome));
    background-color: rgb(var(--dark-accent-red)) !important;
    border: 1px solid rgb(var(--mid-accent-red)) !important;
}
 
table.wiki-content-table tr {
    background-color:rgba(var(--gray-monochrome), 0.15) !important;
    border: 1px solid rgb(var(--mid-accent-red)) !important;
    color: rgb(var(--tester-purple));
}
 
table.wiki-content-table td {
    background-color: rgba(var(--gray-monochrome), 0.15)!important;
    border: 1px solid rgb(var(--mid-accent-red)) !important;
    color: rgb(var(--dark-accent-red));
}
 
.footnotes-footer {
    margin-bottom:10px;
    width: 100%;
    font-family: var(--body-font);
    font-size: 1.1em;
    --footnotes-footer-bg-color: 133,110,115;
    color: rgb(var(--dark-accent-red));
}
 
span.printuser {
    color: rgb(var(--light-gray-monochrome)) !important;
}
 
table.wiki-content-table {
    border: 2px solid rgb(var(--mid-accent-red));
}
 
hr {
    background-color: rgb(var(--bright-accent)) !important;
 
/* TABS */
}
.yui-navset .yui-nav li a em, .yui-navset-top .yui-nav li a em, .yui-navset-bottom .yui-nav li a em {
    color: rgb(var(--bright-red));
}
.yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em {
color: rgb(var(--light-gray-monochrome));
}
 
/* RATING MODULE */
.page-rate-widget-box {
    background: -webkit-gradient(linear,
     left bottom, left top,
     from(rgba(var(--dark-accent),1)),
     to(rgba(var(--dark-accent), 1)));
    background: -webkit-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: -o-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: linear-gradient(to top,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    border: 2px solid rgb(var(--mid-accent-red));
}
#page-content .rate-box-with-credit-button {
    background: -webkit-gradient(linear,
     left bottom, left top,
     from(rgba(var(--dark-accent),1)),
     to(rgba(var(--dark-accent), 1)));
    background: -webkit-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: -o-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: linear-gradient(to top,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    border-color: rgb(var(--mid-accent-red));
}
 
.page-rate-widget-box .rate-points {
    color: rgb(var(--bright-red)) !important;
}
.page-rate-widget-box .rateup, .page-rate-widget-box .ratedown, .page-rate-widget-box .cancel, .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a, .page-rate-widget-box .cancel a {
    background-color: rgb(var(--dark-accent-red)) !important;
}
#page-content .rate-box-with-credit-button > .creditButton > p > a::before {
    background-color: rgb(var(--dark-accent-red));
}
 
#page-content .rate-box-with-credit-button > .creditButton:hover {
    background: rgba(var(--tester-green), 0.8);
}
 
.page-rate-widget-box .ratedown a:hover, .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .cancel a:hover {
    background-color: rgb(var(--bright-red)) !important;
}
.scp-image-block {
    border: solid .1625rem rgb(var(--mid-accent-red));
}
 
.blockquote, [class*=blockquote], blockquote, div.blockquote {
    padding: 5px 15px 5px 15px;
    margin-bottom: 10px;
    background-color:rgb(var(--shadow-red)) !important;
    border: 3px solid rgb(var(--mid-accent-red)) !important;
    color: rgb(var(--light-gray-monochrome)) !important;
    margin: 10px auto 0;
}
 
blockquote blockquote, .blockquote blockquote {
    padding: 5px 15px 5px 15px;
    border: 3px solid rgb(var(--mid-accent-red));
    color: rgb(var(--bright-red)) !important;
    font-size: 1rem;
    margin: 10px auto 0;
}
 
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
    background-color: rgb(var(--dark-accent));
}
#search-top-box:not(:focus-within)::before {  
    color: rgb(var(--dark-accent));
}
 
#top-bar div.mobile-top-bar > ul > li > a, #top-bar div.top-bar > ul > li > a {
    color: rgb(var(--pale-gray-monochrome));
}
#top-bar div.mobile-top-bar > ul > li > a:hover, #top-bar div.top-bar > ul > li > a:hover, #top-bar div.mobile-top-bar > ul > li:hover > a, #top-bar div.top-bar > ul > li:hover > a {
    color: rgb(var(--white-monochrome));
}
.open-menu a {
    color: rgb(var(--tester-purple)) !important;
}
 
@-webkit-keyframes marquee {
         0% { -webkit-transform: translateX(100%); transform: translateX(100%) }
    100% { -webkit-transform: translateX(-100%); transform: translateX(-100%) }
}
 
@keyframes marquee {
         0% { -webkit-transform: translateX(100%); transform: translateX(100%) }
    100% { -webkit-transform: translateX(-100%); transform: translateX(-100%) }
}
@media only screen and (max-width: 768px) {
    #header h2 {
        overflow: hidden;
    height: 100%;
    pointer-events: none;
    }
    #header h2 span {
        -webkit-animation: marquee linear 10s infinite;
                animation: marquee linear 10s infinite;
        width: 150% !important;
        margin-left: 0;
        margin-right: 0;
        padding: 0;
    }
    #header h1 span {
    font-size: 75%;
    }
    #top-bar {
        font-size: calc(var(--base-font-size)*0.70);
    }
 
}
 
.hovertip{
background-color:rgb(var(--shadow-red)) !important;
background-image:radial-gradient(ellipse 1000% 100% at 50% 90%, transparent,rgb(var(--shadow-red))) !important;
}
 
#side-bar {
background-size: 0%;
}
 
.blockquote h1,
.blockquote h2,
.blockquote h3,
.blockquote h4,
.blockquote h5,
blockquote h1,
blockquote h2,
blockquote h3,
blockquote h4,
blockquote h5 {
    color: rgb(var(--bright-red));
}
 
.styled-quote {
  text-align: justify;
  text-justify: inter-word;
    color: rgb(var(--dark-accent-red));
    background-color:rgb(var(--pale-gray-monochrome));
    border-left: 0.5rem solid rgba(var(--dark-accent-red));
}
 
.styled-quote2 {
    color: rgb(var(--dark-accent-red));
    background-color:rgb(var(--pale-gray-monochrome));
    border-left: 0.5rem solid rgba(var(--mid-accent-red));
    padding: 5px 15px 5px 15px;
    margin-right: 5px;
}
 
.dark-styled-quote {
   color:rgb(var(--blinding-red));
   background-color:rgb(var(--dark-accent-red));
   border-left: 0.5rem solid rgba(var(--bright-red));
}
 
.lightblock {
   background-color:rgb(var(--pale-gray-monochrome));
}
 
.darkblock {
   background-color:rgb(var(--dark-accent-red));
   color:rgb(var(--blinding-red));
}
 
.darkblock2 {
   background-color:rgb(var(--dark-accent-red));
   color:rgb(var(--blinding-red));
   display: grid;
   text-align: justify;
   word-wrap: normal;
   font-size: 85%;
   padding: 5px 10px 5px 15px;
   margin-right: 5px;
}
 
.testingblock{
   color: rgb(var(--mid-accent-red));
   border: solid 2px rgb(var(--mid-accent-red));
   padding: 0.01rem 1rem 1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.20rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
 
    background: url(http://backrooms-wiki.wdfiles.com/local--files/theme%3Ameg-edgy/F59005DF-954F-4EB8-8116-2E7F06FB4211.png) center/20% no-repeat;
    background-color: rgb(var(--pale-gray-monochrome));;
    background-position: right 50% bottom 25px;
    padding-bottom: 65px;
    position: relative;
    /* clear: both; */
    display: table;
}
 
.testingblock::after{
    content: "M.E.G. - Bettering Humanity";
    display: flex !important;
    justify-content: center !important;
    font-family: 'Kelly Slab', 'GlowSansSC';
    font-weight: bold;
    font-size: 80%;
    color: black;
    background-color: rgb(var(--pale-gray-monochrome));
    position: relative;
    transform: translateY(325%);
}
 
.logoblock{
    padding: 5px 15px 5px 15px; /* adds space - up right down left */
    font-size: 1rem;
    font-family: var(--body-font);
    background: url(http://backrooms-wiki.wdfiles.com/local--files/theme%3Ameg-edgy/F59005DF-954F-4EB8-8116-2E7F06FB4211.png) center/20% no-repeat;
    background-color: rgb(var(--pale-gray-monochrome));
    background-position: right 50% bottom 25px;
    border: 3px solid rgb(var(--mid-accent-red));
    border-radius: 15px;
    color: rgb(var(--black-monochrome));
    margin: 10px auto 0; /* Adds a space above the box */
    padding-bottom: 65px;
    position: relative;
    /*clear: both; */
    display: table;
}
 
.logoblock::after{
    content: "M.E.G. - Bettering Humanity";
    display: flex !important;
    justify-content: center !important;
    font-family: 'Kelly Slab', 'GlowSansSC';
    font-weight: bold;
    font-size: 80%;
    color: black;
    background-color: rgb(var(--pale-gray-monochrome));
    position: relative;
    transform: translateY(325%);
}
 
.logoblock h2{
    color: rgb(var(--dark-accent-red));
}
 
#toc.floatright {
   background-color: rgb(var(--dark-accent-red)) !important;
   color:rgb(var(--black-monochrome));
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: 3px solid rgb(var(--dark-accent-red)) !important;
   padding: 0rem;
   margin: 1rem !important;
}
 
#toc-action-bar {
   background-color:rgb(var(--dark-accent-red)) !important;
 
}
 
#toc .title {
   background-color:rgb(var(--dark-accent-red)) !important;
   padding: 0.25em 2em 0.25em 0;
}
 
#toc a {
   text-align: left !important;
   color: rgb(var(--mid-accent-red)) !important;
}
 
#toc #toc-action-bar a::after {
     content: "Table of Contents";
                border-color:rgb(var(--tester-yellow)) !important;
     position: absolute;
     left: 104%;
     transition: font-weight 0.15s var(--ease-in-out), font-variation-settings 0.15s var(--ease-in-out);
     white-space: nowrap;
     }
 
#toc #toc-action-bar a::before {
     content: "";
     display: inline-block;
     position: relative;
     width: 1em;
     height: 1em;
     background-color: rgb(var(--blinding-red));
     -webkit-mask: var(--mask-image) center center / 100% no-repeat;
             mask: var(--mask-image) center center / 100% no-repeat;
     }
 
#toc #toc-action-bar a:first-of-type::before {
     --mask-image: var(--down-arrow-mask);
 
     left: -0.85em;
     -webkit-mask-size: 2em 0.3625em;
             mask-size: 2em 0.3625em;
 
     background-color: green !important;
 
     }
 
#toc #toc-action-bar a:last-of-type::before {
     --mask-image: var(--right-arrow-mask);
 
     left: 0em;
     bottom: 0.2em
     -webkit-mask-size: 0.3625em 2em;
             mask-size: 0.3625em 2em;
 
     background-color: rgb(var(--blinding-red)) !important;
 
     }
 
#toc #toc-action-bar a,
     #toc #toc-action-bar a:visited {
     color: rgb(var(--pale-gray-monochrome)) !important;
     }
 
#toc #toc-action-bar a:is(:hover, :active, :focus, :focus-within) {
     color: rgb(var(--blinding-red))  !important;
     }
 
#toc #toc-action-bar a:is(:hover, :active, :focus, :focus-within)::before {
     color: rgb(var(--tester-yellow)) !important;
     }
#toc #toc-list div[style*="margin-left"] {
     margin-left: 1em !important;
     }
 
#toc #toc-list div[style*="2em"] {
     padding-left: 0.75em !important;
     }
 
#toc #toc-list div[style*="2em"]::before {
     content: "╶";
     }
 
#toc #toc-list div[style*="3em"] {
     padding-left: 1.75em !important;
     }
 
#toc #toc-list div[style*="3em"]::before {
     content: "╶─";
     }
 
#toc #toc-list div[style*="4em"] {
     padding-left: 2.75em !important;
     }
 
#toc #toc-list div[style*="4em"]::before {
     content: "╶───";
     }
 
#toc #toc-list div[style*="5em"] {
     padding-left: 3.75em !important;
     }
 
#toc #toc-list div[style*="5em"]::before {
     content: "╶────";
     }
 
#toc #toc-list {
     position: relative;
     border-color: rgb(var(--tester-yellow)) !important; /*I don't know how this works but it sort of does */
     }
 
/* Collapsible code from Trailmix */
 
:root{
  --base-color: rgb(var(--dark-accent-red));
  --hover-color: rgb(var(--blinding-red));
  --click-color: green;
}
 
/* #page-content is shoved everywhere to make sure it's the most specific thingy */
/* Styling! */
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px;
    /* Animated things */
    transition: background 0.2s linear;
    background: var(--base-color);
    /* Technical bits */
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
/* The Clicky Text */
#page-content .collapsible-block-link {
    color: rgb(var(--pale-gray-monochrome));
    font-weight: bold;
    text-decoration: none;
}
/* Gets rid of the underline when hovering over the collapsible */
#page-content .collapsible-block-link:hover {
    text-decoration: none
}
/* Collapsible content */
#page-content .collapsible-block-content {
    /* Animated things */
    transition: border-top-color 0.2s linear, border-bottom-color 0.2s linear;
    border-top: solid var(--base-color) 5px;
    border-bottom: solid var(--base-color) 3px;
}
 
/* Folded blocks are animated, unfolded ones are not */
#page-content .collapsible-block-folded {
    max-width: 100%;
}
#page-content .collapsible-block-unfolded-link{
    width: min-content;
}
/* Addendum counter */
 
/* Addendum prefixes */
#page-content .collapsible-block-folded .collapsible-block-link::before {
    content: "▷";
    color: rgb(var(--blinding-red));
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
#page-content .collapsible-block-unfolded .collapsible-block-link::before {
    content: "▽";
    color: rgb(0,128,0);
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
/* Hovering effects */
#page-content .collapsible-block-folded:hover {
    background: var(--hover-color);
    max-width: 100%;
}
 
#page-content .collapsible-block-unfolded-link:hover {
    background: var(--click-color);
    max-width: 100%;
}
 
/* Collapsible borders - because it looks prettier this way */
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content{
    border-top-color: green;
    border-bottom-color: green;
}
/* When hovering over link, change addendum tag to hover-color */
#page-content .collapsible-block-unfolded-link:hover + .collapsible-block-content::after {
    background: green;
}
/* Click flash when clicking, also forces the collapsible to expand */
#page-content .collapsible-block-folded:active {
    transition: background 0s, max-width 0s;
    background: var(--click-color);
    max-width: 100%;
}
 
#page-content .collapsible-block-unfolded-link:active, #page-content .collapsible-block-unfolded-link:active + .collapsible-block-content::after {
    transition: background 0s, max-width 0s;
    background: var(--hover-color);
    max-width: 100%;
}
/* On click, change borders to click-color */
#page-content .collapsible-block-unfolded-link:active + .collapsible-block-content {
    transition: border-top-color 0s, border-bottom-color 0s;
    border-top-color: var(--hover-color);
    border-bottom-color: var(--hover-color);
}
/* Done with normal collapsibles, now we do all the variations */
/* Unfolded collapsible */
#page-content .unfolded-collapse {
    margin-top: 10px;
    padding-left: 1rem;
    padding-right: 1rem;
    box-shadow: rgb(128, 128, 128) 0px 0px 3px 0px;
    background: var(--base-color);
    /* Text */
    color: white;
    font-weight: bold;
    /* Technical bits */
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
}
/* Addendum prefix */
#page-content .unfolded-collapse::before {
    content: "▽";
    color: green !important;
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
    font-family: var(--mono-font);
}
/* Bottom border */
#page-content .unfolded-collapse-border {
    display: block;
    width: 700px;
    border-top: solid var(--base-color) 5px;
}
/* Centering, very simple */
#page-content .center-collapse .collapsible-block-folded, #page-content .center-collapse .collapsible-block-unfolded-link, #page-content .center-collapse .unfolded-collapse{
    margin:auto;
    margin-top: 10px;
}
 
/* SD Classes */
 
/* sd banner colours */
 
.sd-container {
 
/* font */
--sd-font:'PT Mono';
 
/* borders */
--sd-border:var(--dark-accent-red); /* for most classes */
--sd-border-secondary:0,0,0; /* for n/a */
--sd-border-deadzone:20,0,0; /* for deadzone */
 
/* symbols */
--sd-symbol:var(--sd-border) !important; /* for most symbols */
--sd-symbol-secondary: 255,255,255; /* white for class 4 and higher */
 
/* text */
--sd-bullets:var(--sd-border) !important; /* the colour of the bullet point text */
--sd-text:var(--white-monochrome); /* the colour of the text in the top box */
 
/* class colours */
--class-0:217, 197, 97;
--class-1:247,227,117;
--class-1:255,201,14;
--class-2:245,156,0;
--class-3:249,90,0;
--class-4:254,23,1;
--class-5:175,6,6;
--class-unknown:38,38,38;
--class-habitable:26,128,111;
--class-deadzone:44,13,12;
--class-pending:182,182,182;
--class-n-a:38,38,38;
--class-amended:185,135,212;
--class-omega:45,55,255;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Enriqueta:wght@400;500;600;700&family=Oldenburg&family=Vast+Shadow&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
 
/*
╔══════════════════════════════════════════════════╗
║        莫甘娜理事会版式 -- 2024 设定竞赛更新版        ║
║ ------------------------------------------------ ║ 
║                                                  ║
║      最初作者是 ETOISLE, YELLOWISLOL 参与了编辑     ║
║      2024 更新版作者: SCUTOID + BUBBLINGBEACH     ║
║ ------------------------------------------------ ║
║  使用了 SCP 维基的黑色标记笔版式作为 CSS 基底，作者为   ║
║  Woedenaz 与 Croquembouche。引入 CSS 代码或者使用   ║
║  [[include]] 来还原完整的版式。                     ║
╚══════════════════════════════════════════════════╣
 │                黑色标记笔版式 链接：               ║
→│https://scpwiki.com/theme:black-highlighter-theme║
 └─────────────────────────────────────────────────╜
*/
 
:root {
     --logo-image: url("http://scutoidbox.wikidot.com/local--files/theme:morgana-council/the_morgan.png");
     --header-title: "莫甘娜理事会";
     --header-subtitle: "始于 1984";
     --header-shine-gradient: linear-gradient(to right, transparent 0, rgba(255,210,71) 5%, rgba(250,185,92,1) 16%, rgba(255,255,255,1) 17%, rgba(255,255,255,1) 33%, rgba(250,185,92,1) 42%, rgba(220,103,91,1) 65%, rgba(220,103,91,1) 76%, rgba(255,160,234,1) 93%, transparent 100%);
 
    /* Fonts */
    --title-font: 'Enriqueta', 'ZCOOL XiaoWei', 'Noto Sans SC', sans-serif;
    --header-font: 'Enriqueta', 'ZCOOL XiaoWei', 'Noto Sans SC', sans-serif;
    --UI-font: 'Poppins', 'Noto Sans SC', sans-serif;
    /* --body-font: 'Poppins', 'Noto Sans SC', sans-serif; */
 
    /* Colors */
     --white-monochrome: 209, 198, 190; /* changed */
     --pale-gray-monochrome: 229, 205, 223; /* changed */
     --light-pale-gray-monochrome: 229, 205, 223; /* changed */
     --very-light-gray-monochrome: 196, 135, 181; /* changed */
     --light-gray-monochrome: 140, 69, 131; /* changed */
     --gray-monochrome: 56, 28, 84; /* changed */
     --dark-gray-monochrome: 29, 16, 61; /* changed */
     --black-monochrome: 7, 4, 24; /* changed */
     --pale-accent: 186, 87, 219; /* changed */
     --bright-accent: 228, 162, 43; /* changed */
     --medium-accent: 200, 99, 28; /* changed */
     --dark-accent: 196, 72, 17; /* changed */
     --alt-accent: 221, 102, 17;
 
     --visited-link-color: 131, 87, 219;
 
     --swatch-prinary-darkest: var(--swatch-primary);
 
     --swatch-tertiary-color: var(--light-gray-monochrome);
 
     --footer-message: "赌一把么？";
 
     --wallpaper-mask: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22windows-1252%22%20standalone%3D%22no%22%3F%3E%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xml%3Aspace%3D%22preserve%22%20width%3D%22106.667%22%20height%3D%22154.667%22%3E%3Cpath%20d%3D%22M72.547%201158.57H5.074V-6.465h67.473V1158.57M119.027%20710.25v-58.977l126.95%20154.438L363.43%20654.77v61.476L246.477%20865.688%20119.027%20710.25%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M119.027%20951.652V790.715l125.45%20153.441L363.43%20792.715v166.933L247.477%201108.09l-128.45-156.438M763.27%201158.57h-63.473l63.473-80.97ZM472.387%201158.57h-67.473V-6.465h67.473V1158.57M518.867%20995.133v-58.977L645.816%201090.6%20763.27%20939.656v61.474l-116.954%20149.44-127.449-155.437M763.27%20657.27%20647.316%20805.711%20518.867%20649.273V488.336l125.449%20153.441L763.27%20490.336V657.27M518.867%201158.57v-82.97l67.973%2082.97z%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M763.27%20413.867%20646.316%20563.309%20518.867%20407.867v-58.972l126.949%20154.437L763.27%20352.391v61.476M363.43%20128.98%20246.477%20278.422l-127.45-155.438V64.008l126.95%20154.437L363.43%2067.504v61.476%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3Cpath%20d%3D%22M363.43%20205.449v166.934L247.477%20520.824l-128.45-156.437V203.449l125.45%20153.442L363.43%20205.449M518.867%2071.504V-6.465h67.973l57.476%2070.473%2055.481-70.473h63.473V79.5L647.316%20227.941%20518.867%2071.504%22%20style%3D%22fill%3A%23333%3Bfill-opacity%3A1%3Bfill-rule%3Anonzero%3Bstroke%3Anone%22%20transform%3D%22matrix%28.13305%200%200%20-.13255%20-.633%20153.92%29%22%2F%3E%3C%2Fsvg%3E);
     --wallpaper-mask-size: 2.3rem;
 
     /* ui buttons */
     --ui-button-bg: var(--bright-accent);
     --ui-button-txt: var(--black-monochrome);
     --ui-button-hover-bg: var(--medium-accent);
     --ui-button-hover-outline: var(--dark-accent);
 
     /* sidebar buttons */
     --toggle-button-bg: rgb(var(--bright-accent));
     --toggle-border-color: rgb(var(--medium-accent));
     --toggle-border-width: 0.15rem;
     --toggle-icon-color: rgb(var(--black-monochrome));
}
}
 
/* Header */
#container-wrap #header::before {
    background-size: auto 8rem;
    opacity: 0.3;
    mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0.5));
    -webkit-mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0.5));
}
 
/* Header Wallpaper */
#skrollr-body {
    height: var(--header-height-on-desktop);
    background: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)), transparent), linear-gradient(to bottom, rgb(var(--black-monochrome), 0.7), transparent);
}
/* Rounded Corners */
body {
  background: rgb(var(--swatch-topmenu-bg-color))
}
 
#content-wrap {
  background: rgb(var(--swatch-background));
  border-radius: 0.5rem 0.5rem 0 0;
  box-shadow: 0 0.5rem 0 rgb(var(--light-gray-monochrome)) inset, 0 0.6rem 5px rgb(var(--white-monochrome), 0.8) inset, 0 0.9rem 0 rgb(var(--medium-accent)) inset;
}
 
/* Border */
 
#header::before {
     background-size: auto 9rem;
}
 
#header {
    width: calc(100vw - 2rem);
    max-width: unset;
    --login-dropdown-bg-image: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)), rgb(var(--gray-monochrome)));
}
 
#header #top-bar {
    max-width: unset;
    width: 100%;
 
    --topmenu-category-color: var(--swatch-text-secondary-color), 0.8;
    --topmenu-hover-border-color: var(--bright-accent);
 
    --mobile-topmenu-sidebar-button-color: var(--bright-accent);
 
    --dropdown-border-color: var(--bright-accent), 0.2;
}
 
.top-bar {
    margin: 0 auto;
}
 
#header div.mobile-top-bar {
    width: 100vw;
    max-width: unset;
    margin-right: -2rem;
}
 
@media only screen and (max-width: 56.25rem) {
    #header div[class*="top-bar"] > ul:first-of-type > li:last-of-type > ul {
     width: 100vw;
     margin-left: 1rem;
    }
 
    #header div[class*="top-bar"] > ul > li > ul {
     margin-top: var(--topbar-height-on-mobile);
     grid-template-columns: repeat(2,50%);
     max-height: calc(100vh - 8rem);
     display: grid;
     left: 50%;
     translate: -50%;
     margin-left: 1rem;
     width: 100vw;
    }
}
 
#main-content {
  background-image: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)) 5rem, transparent 100%);
  margin-top: 0.5rem;
  background-size: 0.5rem 100vh;
  background-repeat: no-repeat;
  padding: 2rem 2rem;
  /* ui icons */
  --ui-icon-color: var(--bright-accent);
  --ui-icon-bg: var(--medium-accent);
  --ui-icon-hover-bg: var(--dark-accent);
  /* tabs content */
  --tabs-content-border-color: var(--swatch-tertiary-color), 0.3
  /* toc */
    --toc-body-bg-color: var(--swatch-background);
    --toc-directory-lines-color: var(--swatch-tertiary-color);
  /* tags */
    --pagetags-title-bg: var(--swatch-primary);
    --pagetags-text-color: var(--swatch-primary);
    --pagetags-text-hover-color: var(--swatch-background);
    --pagetags-text-hover-bg-color: var(--bright-accent);
}
 
#header::after {
    content: "";
    width: 100%;
    height: 0.4rem;
    position: absolute;
    left: 0;
    top: calc(100% + 0.5rem);
    display: block;
    background-image: var(--header-shine-gradient);
    background-size: 95% 0.4rem;
    background-repeat: no-repeat;
    background-position: center;
    mask-image: linear-gradient(to bottom, black, rgba(0, 0, 0, 0.3));
    transform: skew(-15deg, 0);
}
 
/* Title */
 
#page-title, .meta-title {
  margin-left: -1.5rem;
  width: fit-content;
  background: rgb(var(--light-gray-monochrome));
  padding: 1rem 2rem;
  color: rgb(var(--swatch-background));
  border-radius: 0 0.5rem 0.5rem 0;
  margin-bottom: 0.25;
  position: relative;
}
 
#page-title::after, .meta-title::after {
  display: none;
}
 
#page-title::before, .meta-title::before {
  content: "";
  display: block;
  background: linear-gradient(to bottom, rgb(var(--light-gray-monochrome)) 70%, transparent 100%);
  width: 0.5rem;
  height: calc(100% + 10rem);
  position: absolute;
  top: -2rem;
  right: 100%;
  mask-image: linear-gradient(to bottom, transparent, black 2rem)
}
 
.borderblock {
  color: rgb(var(--white-monochrome));
  background: rgb(var(--dark-gray-monochrome));
  border: 2px solid rgb(var(--bright-accent));
  padding: 0.01rem 1rem;
  margin: 0.5rem 0;
}
 
.dark-borderblock {
  color: rgb(var(--white-monochrome));
  background: rgb(var(--black-monochrome));
  border: 2px solid rgb(var(--bright-accent));
  padding: 0.01rem 1rem;
  margin: 0.5rem 0;
}
 
.meta-title {
  margin-left: -2.5rem; /* changed because it's in the #page-content which has padding */
}
 
/* Content */
#page-content {
   background: rgb(var(--gray-monochrome), 0.3);
   border-radius: 0.5rem;
   padding: 0.5rem 1rem;
   margin-top: 0.5rem;
}
 
/* Footer */
#footer {
    --footer-bg-color: var(--swatch-primary-darkest), 0.7;
    --footer-text-color: var(--swatch-text-secondary-color), 0.8;
    --footer-link-hover-color: var(--swatch-background);
    --footer-link-hover-bg-color: var(--bright-accent);
}
 
/* Lincense Area */
#license-area {
    --license-bg-color: var(--swatch-primary-darkest);
    --license-link-hover-color: var(--swatch-text-secondary-color);
    --license-link-hover-bg-color: var(--swatch-primary);
}
 
/* 搬运调整 */
:root{
    --toggle-roundness: 0%;
}
 
#main-content {
    --tabs-bg: var(--swatch-secondary-color);
    --tabs-txt: var(--swatch-text-tertiary-color);
    --tabs-hover-bg: var(--swatch-primary-darker);
    --tabs-hover-txt: var(--swatch-text-secondary-color);
    --tabs-selected-bg: var(--swatch-primary);
    --tabs-selected-txt: var(--swatch-text-secondary-color);
    --tabs-selected-outline: var(--swatch-primary);
    --tabs-bottom-border-color: var(--swatch-primary-darker);
    --tabs-content-bg-color: var(--swatch-secondary-color),.25;
}
 
.lightblock {
    color: rgb(var(--black-monochrome));
    background: rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0;
    box-shadow: var(--quote-shadow);
}
 
.styled-quote {
    color: rgb(var(--black-monochrome));
    background: rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0;
    box-shadow: var(--quote-shadow);
    border-left: solid 6px rgb(var(--dark-gray-monochrome));
}
 
a.bibcite:before, a.footnoteref:before {
    content: "[";
}
 
a.bibcite:after, a.footnoteref:after {
    content: "]";
}
 
#side-bar {
    --sideblock-heading-text-color: inherit;
    z-index: 55 !important;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Courier+Prime&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans+Condensed:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dosis:wght@200;300;400&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Orbitron&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+KuaiLe&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+QingKe+HuangYou&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";
 
   --logo-image: url("https://backrooms-wiki.wdfiles.com/local--files/theme%3Aneon/NS_LOGO.png");
   --header-title: "霓虹曳舞";
   --header-subtitle: "";
 
  --body-font: 'Montserrat', 'Noto Sans SC', cursive;
   --header-font: 'Orbitron', 'ZCOOL KuaiLe', cursive;
   --title-font: 'Courier Prime', 'Noto Sans SC', cursive;
   --mono-font: 'Open Sans Condensed', 'ZCOOL QingKe HuangYou', cursive;
 
   --white-monochrome: 0, 0, 0;
   --pale-gray-monochrome: 0, 0, 0;
   --light-gray-monochrome: 230, 60, 188;
   --gray-monochrome: 0, 255, 255;
   --black-monochrome: 39, 232, 232;
   --bright-accent: 230, 60, 188;
   --medium-accent: 230, 60, 188;
   --dark-accent: 230, 60, 188;
   --pale-accent: 255, 217, 112;
   --swatch-menubg-dark-color: var(--white-monochrome);
   --thing: 255, 140, 227;
 
   --swatch-topmenu-border-color: var(--link-color);
 
  --rating-module-button-plus-color: var(--light-gray-monochrome);
   --rating-module-button-negative-color: var(--light-gray-monochrome);
   --rating-module-button-cancel-color: var(--light-gray-monochrome);
   --rating-module-button-credit-color: var(--light-gray-monochrome);
 
   --link-color: 230, 60, 188;
   --hover-link-color: 48, 217, 197;
   --visited-link-color: 0, 201, 0;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("https://backrooms-wiki.wdfiles.com/local--files/theme%3Aneon/NS_BANNER_1.png");
 background-repeat: repeat-x;
background-size: inherit;
}
}
 
#container {
   background-image: url("https://backrooms-wiki.wdfiles.com/local--files/theme%3Aneon/OS_BG_4.png");
   background-size: auto 100rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
   margin:1.5rem 0;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
    color: rgb(var(--dark-accent));
}
 
#page-title {
    border-color: rgb(var(--light-gray-monochrome));
    color: rgb(var(--dark-accent))!important;
    font-size: 2.5rem;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 90%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 8.5rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.8;
}
 
#header h1, #header h1 a {
   font-size: 2.5rem;
   position: absolute;
   top: 0.05rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   font-size: 1.3rem;
   position: absolute;
   top: 1.9rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   color: white;
   line-height: 1
}
 
h1 {
    font-size: 2rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h2 {
    font-size: 1.8rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h3 {
    font-size: 1.6rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h4 {
    font-size: 1.4rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h5 {
    font-size: 1.2rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h6 {
    font-size: 1rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
div#page-options-bottom-2>a:active,
div#page-options-bottom-2>a:hover,
div#page-options-bottom>a:active,
div#page-options-bottom>a:hover
.owindow .button-bar a:hover,
a.button:hover,
button:hover,
div.buttons input:hover,
file:hover,
input.button:hover {
   color: rgb(var(--swatch-tertiary-color));
}
 
#side-bar .heading p,
#side-bar .side-block>.collapsible-block .collapsible-block-link {
   color: rgb(var(--gray-monochrome));
   text-shadow: none;
}
 
#top-bar>ul>li a:hover {
   color: rgb(var(--gray-monochrome));
}
 
#top-bar div.mobile-top-bar>ul>li:hover a,
#top-bar div.top-bar>ul>li:hover a {
   color: rgb(var(--gray-monochrome));
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   ));
   border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--pale-gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
    background-color: rgb(var(--thing));
}
 
#login-status a {
   color: rgb(var(--swatch-tertiary-color));
}
 
#login-status ul a {
    color: rgb(var(--white-monochrome));
}
 
#login-status {
   font-weight: bold;
}
 
#search-top-box input.empty:hover {
     color: rgb(var(--swatch-text-secondary-color))
}
 
.customFont {
    font-family: 'Courier Prime', 'Noto Sans SC', cursive;
}
.main-font{
    font-family: 'Orbitron', 'ZCOOL KuaiLe', cursive;
}

+ 版式代码

/* Myrand */
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
:root {
   --fade-in-delay: 0.1s;
 
   --theme-base: "black-highlighter";
   --theme-id: "neophyxen";
   --theme-name: "Neophyxen";
 
   --logo-image: url("http://myrandfox.wikidot.com/local--files/theme:neophyxen/logo");
   --header-title: "Neophyxen Technocracy";
   --header-subtitle: "将要走的新路线";
 
   --body-font: 'Source Code Pro',  'zcoolwenyiti', '等线' , monospace;
   --header-font: 'Source Code Pro', 'zcoolwenyiti', '等线' , monospace;
   --title-font: 'Source Code Pro', 'zcoolwenyiti', '等线' ,monospace;
   --mono-font: 'Source Code Pro', 'zcoolwenyiti', '等线' ,monospace;
 
   --white-monochrome: 255, 255, 255;
   --pale-gray-monochrome: 190, 190, 190;
   --light-gray-monochrome: 160, 160, 160;
   --gray-monochrome: 72, 69, 60;
   --black-monochrome: 10, 10, 10;
   --bright-accent: 0, 255, 0;
   --medium-accent: 0, 255, 0;
   --dark-accent: 140, 136, 126;
   --pale-accent: 140, 136, 126;
   --custom-text: 0, 160, 0;
 
     /* Primary Theme Colors */
    --swatch-background: var(--black-monochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--medium-accent);
    --swatch-primary-darkest: var(--black-monochrome);
 
    /* Primary Text Colors */
    --swatch-text-dark: var(--custom-text);
    --swatch-text-light: var(--bright-accent);
    --swatch-important-text: var(--bright-accent);
    --barColour: var(--very-light-gray-monochrome);
    --linkColour: var(--pale-accent);
 
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--black-monochrome);
    --swatch-menubg-light-color: var(--dark-gray-monochrome);
    --swatch-menubg-medium-color: var(--medium-accent);
    --swatch-menubg-medium-dark-color: var(--gray-monochrome);
    --swatch-menubg-dark-color: var(--dark-gray-monochrome);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--black-monochrome);
    --swatch-menutxt-dark-color: var(--white-monochrome);
    --swatch-menutxt-light-color: var(--white-monochrome);
    --swatch-border-color: var(--bright-accent);
 
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
    --swatch-topmenu-border-color: var(--bright-accent);
    --swatch-topmenu-bg-color: var(--black-monochrome);
 
    /* Link Colors */
    --link-color: var(--bright-accent);
    --visited-link-color: var(--medium-accent);
    --hover-link-color: var(--bright-accent);
    --sidebar-links-text: var(--swatch-menutxt-dark-color);
    --link-color-bright: var(--medium-accent);
 
/* Rating Module Colors */
    --rating-module-button-color: var(--bright-accent);
    --rating-module-text-color: var(--white-monochrome);
    --rating-module-text-hover-color: var(--swatch-menutxt-light-color);
 
/* Header Gradients */
--gradient-header: none;
--diagonal-stripes: none;
}
 
#extrac-div-1 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background: repeating-linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.15) 50%,rgba(0,0,0,0));
    background-size: auto 8px;
    opacity: 0.7;
}
 
#extrac-div-2 {
    position: fixed;
    width: 100vw;
    height : 1rem;
    top: 0;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(0,255,0,0) 0%,rgba(0,255,0,1) 50%,rgba(0,255,0,0.98) 51%,rgba(0,255,0,0) 100%);
    opacity : .1;
    animation: scanm 6s linear infinite;
}
@keyframes scanm {
  0%   { top: -1rem; opacity : .05;}
  25% { top: 50%; opacity: .03;}
  37.5% { top: 75%; opacity: 0.06;}
  50% { top: 100%; opacity: .03;}
  100% { top: 100%;}
}
 
#extrac-div-3 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background-image: radial-gradient(circle, rgb(0,0,0) 0%, rgb(0,155,0) 60%, rgb(0,255,0) 100%);
    opacity: 0.25;
    mix-blend-mode: color-dodge;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 30;
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--black-monochrome)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.lightstyled-quote {
   background-color:rgb(var(--bright-accent));
color:rgb(0, 0, 0);
   border-left: 0.5rem solid rgba(var(--dark-gray-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.darkstyled-quote {
   background-color:rgb(var(--dark-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--bright-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.darkstyled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--bright-accent));
color:rgb(0, 0, 0);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--dark-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-borderblock {
    background-color:rgb(var(--dark-gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
 .light-borderblock {
    background-color:rgb(var(--bright-accent));
    color:rgb(0, 0, 0);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--dark-gray-monochrome));
 }
 .border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-gray-monochrome));
     border: solid 0.3rem rgb(var(--bright-accent));
    }
 
    .border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://myrandfox.wikidot.com/local--files/theme:neophyxen/logo) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-gray-monochrome));
    }
 
    .logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://myrandfox.wikidot.com/local--files/theme:neophyxen/logo) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
.titleblock {
        background-color: rgb(var(--dark-gray-monochrome));
        color:rgb(var(--white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--dark-gray-monochrome));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.borderblock {
    background-color:rgb(var(--dark-gray-monochrome));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--bright-accent));
 }
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}

+ 版式代码

@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
/* Fonts */
 
@import url('https://fonts.googleapis.com/css?family=Lato:400,900|PT+Mono|Poppins:600,800|Share+Tech+Mono|Anonymous+Pro');
 
/* All Vars Used */
 
:root {
--fade-in-delay: 0.15s;
    /* S-CSS-P Integration */
    /* If you're making a new CSS theme, please include the following three variables at minimum. */
    --theme-base: "nuscp";
    /* mua be either "nuscp" or "sigma9" */
    --theme-id: "the-overwatch";
    /* set this to the URL of your theme's page - eg for "component:ar-theme", set it to "ar-theme" */
    --theme-name: "The Overwatch Theme";
    /* set this to your theme's full name */
 
    /* Header */
    --logo-image: url("http://myrandfox.wikidot.com/local--files/theme:the-overwatch/logo");
    --header-title: "守望者";
    --header-subtitle: "联合使我们生存";
 
    /* Typefaces */
    --body-font: 'Share Tech Mono', monospace;
    --header-font: 'Share Tech Mono', monospace;
    --title-font: 'Anonymous Pro', monospace;
    --mono-font: "PT Mono", "Andale Mono", "Courier New", Courier, monospace;
    /* Standard Colors */
    --white-monochrome: 255, 255, 255;
    /* white */
    --pale-gray-monochrome: 244, 244, 244;
    /* v light gray for blockquotes and stuff */
    --light-gray-monochrome: 170, 170, 170;
    /* light accent gray for login status */
    --gray-monochrome: 66, 66, 72;
    /* gray */
    --dark-gray-monochrome: 0, 100, 255;
    /* dark accent gray for sidebar background */
    --black-monochrome: 12, 12, 12;
    /* black */
    --bright-accent: 255, 255, 255;
    /* bright blue for header */
    --medium-accent: 0, 40, 75;
    /* medium blue for header */
    --dark-accent: 0, 40, 75;
    /* dark blue */
    --newpage-color: 99, 190, 255;
    /* bright blue */
    --terminal-medium: 255, 255, 255;
    /* faded blue for terminal borders*/
    --pale-accent: 0, 40, 96;
    /* dark blue */
    --ow-white-monochrome: 255, 255, 255;
    --ow-black-monochrome: 0, 0, 0;
    --ow-dark-blue-monochrome: 0, 40, 75;
    --ow-low-monochrome: 0, 85, 165;
    --visited-link-color: 0, 148, 255;
 
    /* Primary Theme Colors */
    --swatch-background: var(--white-monochrome);
    --swatch-primary: var(--medium-accent);
    --swatch-primary-darker: var(--bright-accent);
    --swatch-primary-darkest: var(--medium-accent);
    /* Primary Text Colors */
    --swatch-text-dark: var(--black-monochrome);
    --swatch-text-light: var(--white-monochrome);
    --swatch-important-text: var(--bright-accent);
 
    /* Primary Menu Colors */
    --swatch-menubg-color: var(--dark-accent);
    --swatch-menubg-light-color: var(--dark-accent);
    --swatch-menubg-medium-color: var(--dark-accent);
    --swatch-menubg-medium-dark-color: var(--black-monochrome);
    --swatch-menubg-dark-color: var(--bright-accent);
    --swatch-menubg-black-color: var(--black-monochrome);
    --swatch-menubg-hover-color: var(--ow-dark-blue-monochrome);
    --swatch-menutxt-dark-color: var(--bright-accent);
    --swatch-menutxt-light-color: var(--black-monochrome);
    --swatch-border-color: var(--terminal-medium);
    /* Primary Header Colors */
    --swatch-headerh1-color: var(--white-monochrome);
    --swatch-headerh2-color: var(--white-monochrome);
    --swatch-topmenu-border-color: var(--dark-accent);
    --swatch-topmenu-bg-color: var(--dark-accent);
 
    /* Header Gradients */
 
    --gradient-header: linear-gradient(to bottom,
     rgba(var(--medium-accent),0.97) 10%,
     rgba(var(--medium-accent),0.97) 40%,
     rgb(var(--ow-low-monochrome)) 100%);
    --gradient-topmenu: linear-gradient(to bottom,
     white 0%,
     white 7.5rem,
     rgba(var(--swatch-topmenu-border-color), 1) 7.5rem,
     rgba(var(--swatch-topmenu-bg-color), 1) 7.625rem,
     rgba(var(--swatch-topmenu-bg-color), 0.95) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 1) calc(100% - 0.125rem),
     rgba(var(--swatch-topmenu-border-color), 1) 100%);
    --gradient-topmenu-mobile: linear-gradient(to bottom,
     rgba(var(--swatch-topmenu-border-color), 1) 0,
     rgba(var(--swatch-topmenu-bg-color), 1) 0.125rem,
     rgba(var(--swatch-topmenu-bg-color), 1) calc(3rem - 0.125rem),
     rgba(var(--swatch-topmenu-bg-color), 1) calc(3rem - 0.125rem),
     rgba(var(--swatch-topmenu-border-color), 1) 3rem);
    --diagonal-stripes: repeating-linear-gradient(180deg,
     hsla(0, 0%, 100%, 0),
     hsla(0, 0%, 100%, 0) 0.25vh,
     rgba(88, 88, 88, 0.1) 0.35vh,
     rgba(88, 88, 88, 0.2) 0.5vh);
    --gradient-sidemenu-header: linear-gradient(10deg,
     rgba(var(--medium-accent), 0.45) 0%,
     rgba(var(--medium-accent), 0.55) 100%);
    --header-background-image-size: 100% 7.5rem;
 
    /* Sidebar */
    --sidebar-transition-timing: 0.5s ease-in-out 0.1s;
    --sidebar-internal-border-thickness: 0.16rem;
 
    --background-gradient-color: 193, 222, 255;
    --background-gradient-distance: 50rem;
}
 #page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
 
#search-top-box input.empty {
   color: #ffffff;
   color: rgba(var(--white-monochrome));
   text-align: center
}
 
html,
body,
#side-bar:hover {
    scrollbar-color: rgb(var(--terminal-medium)) rgb(var(--ow-white-monochrome));
    }
 
 ::-webkit-scrollbar,
#side-bar:hover::-webkit-scrollbar {
    background-color: rgb(var(--ow-white-monochrome));
    }
 
 ::-webkit-scrollbar-thumb,
 #side-bar:hover::-webkit-scrollbar-thumb {
    background-color: rgb(var(--terminal-medium));
    }
 
.scp-image-block .scp-image-caption {
    font-size: .8em;
    background-color:rgb(var(--ow-white-monochrome));
    color: rgb(var(--ow-black-monochrome));
}
 
#header h1 {
    color: rgb(var(--dark-accent));
}
#side-bar div.menu-item .sub-text {
    color: rgb(var(--white-monochrome));
}
#login-status {
    color: rgb(var(--medium-accent));
}
.code {
    padding: 5px 5px 5px 15px;
    margin-bottom:10px;
    width: 100%;
    font-family: var(--header-font);
    font-size: 1.1em;
    background-color:rgb(var(--dark-accent));
    border: 2px dashed rgb(var(--terminal-medium));
    color: rgb(var(--bright-accent));
}
 
.hl-main {
    filter: invert(1) hue-rotate(180deg);
}
 
.page-options-bottom a {
    background-color:rgb(var(--ow-white-monochrome)) !important;
    border: 3px solid rgb(var(--ow-dark-blue-monochrome)) !important;
    color: rgb(var(--ow-dark-blue-monochrome)) !important;
    font-family: var(--header-font);
}
 
table.wiki-content-table th, table.wiki-content-table tr, table.wiki-content-table td {
    background-color:rgb(var(--dark-accent)) !important;
    border: 2px solid rgb(var(--terminal-medium)) !important;
    color: rgb(var(--bright-accent));
}
 
.footnotes-footer {
    padding: 15px 15px 15px 15px;
    margin-bottom:10px;
    width: 100%;
    font-family: var(--header-font);
    font-size: 1.1em;
    background-color:rgb(var(--dark-accent));
    border: 3px solid rgb(var(--terminal-medium));
    color: rgb(var(--bright-accent));
}
 
span.printuser {
    color: white !important;
}
 
/* sd banner colours */
 
.sd-container {
   --sd-text:222,222,222;
   --sd-symbol:var(--sd-text);
}
 
table.wiki-content-table {
    border: 2px solid rgb(var(--terminal-medium));
}
 
hr {
    background-color: rgb(var(--bright-accent)) !important;
}
.yui-navset .yui-nav li a em, .yui-navset-top .yui-nav li a em, .yui-navset-bottom .yui-nav li a em {
    color: white;
}
/* RATING MODULE */
.page-rate-widget-box {
    background: -webkit-gradient(linear,
     left bottom, left top,
     from(rgba(var(--dark-accent),1)),
     to(rgba(var(--dark-accent), 1)));
    background: -webkit-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: -o-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: linear-gradient(to top,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    border: 2px solid rgb(var(--terminal-medium));
}
#page-content .rate-box-with-credit-button {
    background: -webkit-gradient(linear,
     left bottom, left top,
     from(rgba(var(--dark-accent),1)),
     to(rgba(var(--dark-accent), 1)));
    background: -webkit-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: -o-linear-gradient(bottom,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    background: linear-gradient(to top,
     rgba(var(--dark-accent),1) 0%,
     rgba(var(--dark-accent), 1) 100%);
    border-color: rgb(var(--terminal-medium));
}
 
.page-rate-widget-box .rate-points {
    color: rgb(var(--ow-white-monochrome)) !important;
}
.page-rate-widget-box .rateup, .page-rate-widget-box .ratedown, .page-rate-widget-box .cancel, .page-rate-widget-box .rateup a, .page-rate-widget-box .ratedown a, .page-rate-widget-box .cancel a {
    background-color: rgb(var(--ow-dark-blue-monochrome)) !important;
}
#page-content .rate-box-with-credit-button > .creditButton > p > a::before {
    background-color: rgb(var(--pale-gray-monochrome));
}
 
#page-content .rate-box-with-credit-button > .creditButton:hover {
    background: rgba(var(--bright-accent), 0.8);
}
 
.page-rate-widget-box .ratedown a:hover, .page-rate-widget-box .rateup a:hover, .page-rate-widget-box .cancel a:hover {
    background-color: rgb(var(--ow-white-monochrome)) !important;
}
.yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em {
    color: rgb(var(--dark-accent));
}
.scp-image-block {
    border: solid .1625rem rgb(var(--ow-black-monochrome));
}
 
blockquote, .blockquote {
    padding: 5px 5px 5px 15px;
    margin-bottom:10px;
    font-size: 1rem;
    background-color:rgb(var(--dark-accent));
    border: 3px solid rgb(var(--terminal-medium));
    color: rgb(var(--bright-accent));
    margin: 10px auto 0;
}
 
blockquote blockquote, .blockquote blockquote {
    padding: 5px 5px 5px 15px;
    border: 3px solid rgb(var(--terminal-medium));
    border-bottom: 3px solid rgb(var(--terminal-medium));
    color: rgb(var(--bright-accent));
    margin: 0 auto 10px;
    font-size: 1rem;
}
 
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"] {
    background-color: rgb(var(--dark-accent));
}
#search-top-box:not(:focus-within)::before {  
    color: rgb(var(--terminal-medium));
}
 
#top-bar div.mobile-top-bar > ul > li > a, #top-bar div.top-bar > ul > li > a {
    color: rgb(var(--terminal-medium));
}
#top-bar div.mobile-top-bar > ul > li > a:hover, #top-bar div.top-bar > ul > li > a:hover, #top-bar div.mobile-top-bar > ul > li:hover > a, #top-bar div.top-bar > ul > li:hover > a {
    color: rgb(var(--dark-accent));
}
.open-menu a {
    color: rgb(var(--terminal-medium)) !important;
}
 
@-webkit-keyframes marquee {
         0% { -webkit-transform: translateX(100%); transform: translateX(100%) }
    100% { -webkit-transform: translateX(-100%); transform: translateX(-100%) }
}
 
@keyframes marquee {
         0% { -webkit-transform: translateX(100%); transform: translateX(100%) }
    100% { -webkit-transform: translateX(-100%); transform: translateX(-100%) }
}
@media only screen and (max-width: 768px) {
    #header h2 {
        overflow: hidden;
    height: 100%;
    pointer-events: none;
    }
    #header h2 span {
        -webkit-animation: marquee linear 10s infinite;
                animation: marquee linear 10s infinite;
        width: 150% !important;
        margin-left: 0;
        margin-right: 0;
        padding: 0;
    }
    #header h1 span {
    font-size: 75%;
    }
    #top-bar {
        font-size: calc(var(--base-font-size)*0.70);
    }
 
}
 
.hovertip{
background-color:#00284B !important;
background-image:radial-gradient(ellipse 1000% 100% at 50% 90%, transparent,#00284B) !important;
}
 
#side-bar {
background-size: 0%;
}
 
a:visited {
        color: #0094FF;
        color: rgb(var(--visited-link-color))
    }
 
.footnote-footer>a:first-of-type {
    margin-left: 0;
}
 
.blockquote h1,
.blockquote h2,
.blockquote h3,
.blockquote h4,
.blockquote h5,
blockquote h1,
blockquote h2,
blockquote h3,
blockquote h4,
blockquote h5 {
    color: var(--bright-accent);
}
 
 .lightblock {
    background-color:rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
 }
 
 .darkblock {
    background-color:rgb(var(--dark-accent));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
 }
 
.dark-borderblock {
    background-color:rgb(var(--dark-accent));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--white-monochrome));
 }
 
 .light-borderblock {
    background-color:rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--dark-accent));
 }
 .border-logoblock{
    padding: 0.01rem 1rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    color:rgb(255, 255, 255);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-accent));
     border: solid 0.3rem rgb(var(--white-monochrome));
    }
 
    .border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://myrandfox.wikidot.com/local--files/theme:the-overwatch/logo) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
    .logoblock{
    padding: 0.01rem 1rem;
    color:rgb(255, 255, 255);
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    margin: 0.5rem 0 0.5rem 0.25rem;
    display: block;
    position: relative;
    background-color: rgb(var(--dark-accent));
    }
 
    .logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://myrandfox.wikidot.com/local--files/theme:the-overwatch/logo) center/25% no-repeat;
    opacity: 0.25;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
    }
 
.titleblock {
        background-color: rgb(var(--dark-accent));
        color:rgb(var(--white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--white-monochrome)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--dark-accent));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--white-monochrome));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.borderblock {
    background-color:rgb(var(--dark-accent));
    color:rgb(255, 255, 255);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--white-monochrome));
 }
 
.lightstyled-quote {
    background-color:rgb(var(--white-monochrome));
    border-left: 0.5rem solid rgba(var(--dark-accent));
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.5);
 }
 
 .darkstyled-quote {
    background-color:rgb(var(--dark-accent));
    color:rgb(255, 255, 255);
    border-left: 0.5rem solid rgba(var(--white-monochrome));
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.5);
 }
 
.low-risk {
    background-color:rgb(var(--dark-accent));
    color:rgb(255, 255, 255);
    border-left: 0.5rem solid rgb(0, 255, 0);
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.5);
 }
.medium-risk {
    background-color:rgb(var(--dark-accent));
    color:rgb(255, 255, 255);
    border-left: 0.5rem solid rgb(255, 216, 0);
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.5);
 }
.high-risk {
    background-color:rgb(var(--dark-accent));
    color:rgb(255, 255, 255);
    border-left: 0.5rem solid rgb(255, 0, 0);
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.5);
 }

+ 版式代码

/* 调整 */
#content-wrap #side-bar .side-block {
  background: transparent;
  color: rgb(var(--red-purple-monochrome));
}
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "mm-theme";
   --theme-name: "Masked Maidens Theme";
 
   --logo-image: url("https://i.ibb.co/ZccffPw/logo-for-pr.png");
   --header-title: "蒙面女郎";
   --header-subtitle: "善加伪饰，即为披露";
 
   --body-font: 'Noto Sans SC', sans-serif;
   --header-font: '仓耳渔阳体W02', cursive;
   --title-font: '仓耳渔阳体W02', cursive;
   --mono-font: 'Courier'; monospace;
 
--reddish-pink-monochrome: 200, 102, 110;
   --blue-monochrome: 57, 79, 107;
   --pale-blue-monochrome: 71, 74, 100;
   --pale-purple-monochrome: 85, 70, 92;
   --red-purple-monochrome: 99, 65, 85;
   --redder-purple-monochrome: 113, 61, 77;
   --pale-red-monochrome: 255, 204, 203;
   --pale-pink-monochrome: 251, 237, 242;
--dark-red: 94, 10, 10;
--even-darker-red: 64, 0, 0;
   --bright-accent: 198, 33, 33;
   --medium-accent: 184, 38, 40;
   --dark-accent: 128, 56, 70;
   --pale-accent: 142, 51, 63;
--light-grey-monochrome: 180, 180, 180;
--green-monochrome: 0, 200, 0;
--white-monochrome: 255, 255, 255;
--dark-purple-monochrome: 48, 21, 40;
--purple-monochrome: 71, 43, 62;
--red-pink-monochrome: 171, 76, 85;
--just-pink: 255, 217, 229;
--redder-pink-monochrome: 240, 187, 196;
--even-paler-blue: 178, 182, 217;
--another-pink-shade: 245, 149, 162;
 
--background-gradient-color: var(--pale-pink-monochrome);
 
 --swatch-background: var(--pale-pink-monochrome);
    --swatch-primary: var(--bright-accent);
    --swatch-primary-darker: var(--reddish-pink-monochrome);
    --swatch-primary-darkest: var(--dark-accent);
 
    --swatch-text-dark: var(--dark-accent);
    --swatch-text-light: var(--pale-pink-monochrome);
    --swatch-important-text: var(--pale-red-monochrome);
    --barColour: var(--blue-monochrome);
    --linkColour: var(--pale-blue-accent);
 
   --swatch-topmenu-border-color: 64, 0, 0;
 --swatch-menubg-dark-color: 95, 65, 85;
 --barColour: 198, 33, 33
--swatch-topmenu-bg-color: 94, 10, 10;
 
 --swatch-headerh1-color: var(--pale-pink-monochrome);
    --swatch-headerh2-color: var(--pale-red-monochrome);
    --swatch-topmenu-border-color: var(--red-purple-monochrome);
    --swatch-topmenu-bg-color: var(--dark-purple-monochrome);
 
   --link-color: 57, 79, 107;
  --visited-link-color: 71, 74, 100;
   --hover-link-color: 113, 61, 77;
   --new-page-color: 198, 33, 33;
   --sidebar-links-text: 128, 56, 70;
   --link-color-bright: 184, 38, 40;
 
   --background-gradient-distance: 0rem;
 
 --rating-module-button-color: var(--pale-pink-monochrome);
    --rating-module-button-plus-color: 0, 200, 0;
    --rating-module-button-negative-color: 198, 33, 33;
    --rating-module-button-cancel-color: 180, 180, 180;
    --rating-module-button-credit-color: 128, 56, 70;
    --rating-module-text-color: var(--swatch-menutxt-dark-color);
    --rating-module-text-hover-color: var(--swatch-menutxt-dark-accent));
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--dark-accent)) 0%, rgba(var(--redder-purple-monochrome)) 20%, rgba(var(--red-purple-monochrome)) 40%, rgba(var(--pale-purple-monochrome)) 50%,
rgba(var(--pale-blue-monochrome)) 60%,
      rgba(var(--blue-monochrome), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#main-content {
   background-color: 251, 237, 242;
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgba(var(--red-purple-monochrome)) 50%, transparent 0);
   background-repeat: repeat;
   background-size: 0.25em 0.25em;
   width: 100%;
   height: 7.5rem;
}
 
#side-bar .side-block div a img {
   background-color: rbga(var(--pale-pink-monochrome));
}
 
#container {
   background-image: radial-gradient(star, rgb(var(--pale-blue-monochrome), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
.footnotes-footer {
 background-color: rgb(var(--reddish-pink-monochrome)) !important;
  border-left: 0.4rem solid rgb(var(--dark-accent)) !important;
  color: rgb(var(--pale-pink-monochrome));
 
}
 
a.footnote-footer {
    color: rgb(var(--pale-red-monochrome)) !important;
}
.footnote-footer>a:first-of-type {
    color: rgb(var(--pale-red-monochrome)) !important;
}
 
#page-title {
    border-color: rgb(var(--pale-purple-monochrome));
    color: rgb(var(--dark-accent))!important;
    font-size: 2rem;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 16rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.5;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #803846;
}
 
.page-rate-widget-box {
     box-shadow: 0px 0px 0px 2px rgb(var(--dark-accent));
    background: rgb(var(--dark-accent));
     padding: .1em;
     border-radius: 0px 10px 0px 10px;
}
 
.page-rate-widget-box .rate-points {
    background-color: none;
    border: none;
    color: rgb(var(--pale-pink-monochrome));
}
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: rgb(var(--dark-accent));
    border-top: none;
    border-bottom: none;
}
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    background: transparent;
    color: rgb(var(--pale-blue-monochrome));
}
.page-rate-widget-box .cancel {
    background: transparent;
    background-color: rgb(var(--dark-accent));
    border: none;
}
 
.page-rate-widget-box .cancel a {
    color: rgb(var(--dark-accent));
}
 
span.printuser {
    color: rgb(var(--dark-accent));
}
 
.code {
    border: 2px dashed rgb(var(--pale-red-monochrome));
}
 
blockquote {
   padding: 0.4rem 0.4rem;
   margin: 1rem 0;
   background: rgb(var(--another-pink-shade));
   box-shadow: 0px 0px 3px;
   border: 1.75px solid rgb(var(--redder-pink-monochrome));
   box-sizing: border-box;
}
 
.block-quote {
   padding: 0.4rem 0.4rem;
   margin: 1rem 0;
   background: rgb(var(--another-pink-shade));
   border-radius: 0.1rem;
   box-shadow: 0px 0px 3px;
   border: 1.75px solid rgb(var(--just-pink));
   box-sizing:border-box;
}
 
.styled-quote {
   background-color: rgb(var(--just-pink));
   border-left: 0.5rem solid rgb(var(--dark-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color: rgb(var(--even-paler-blue));
   border-left: 0.5rem solid rgb(var(--blue-monochrome));
   color: rgb(var( --pale-pink-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color:rgb(var(--swatch-menubg-dark-color)) ;
}
 
.lightblock {
   background-color: rgb(var(--just-pink));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color: rgb(var(--pale-blue-monochrome));
   color: rgb(var( --pale-pink-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.borderblock {
   background-color: rgb(var(--just-pink));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid 0.3rem rgb(var(--dark-accent));
}
 
.logoblock{
padding: 0.01rem 1rem;
box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
margin: 0.5rem 0 0.5rem 0.25rem;
display: block;
position: relative;
background-color: rgb(var(--just-pink));
}
 
.logoblock::after{
content: "";
float: center;
border: solid 2px rgb(var(--dark-accent));
background: url(https://i.ibb.co/ZccffPw/logo-for-pr.png)center/50% no-repeat;
opacity: 0.6;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
z-index: 1;
pointer-events: none;
}
 
table.wiki-content-table td {
   background-color: rgb(var(--love-pink-smh));
   color: rgb(var(--dark-accent));
}
 
table.wiki-content-table th {
   background-color: rgb(var(--dark-accent));
   color: rgb(var(--pale-pink-monochrome));
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--pale-pink-monochrome));
}
 
.yui-navset .yui-nav .selected a, .yui-navset .yui-nav .selected a em {
    background-color: #C8666E;
    color: rgb(var(--pale-pink-monochrome));
}
 
.yui-navset .yui-nav, .yui-navset .yui-navset-top .yui-nav   {
    border-color: #5E0A0A;
    border-width:0 0 2px
}
 
#side-bar .side-block {
    background: rgb(var(--redder-purple-monochrome));
    color: rgb(var(--red-purple-monochrome));
}
 
#side-bar:hover {
background:  rgb(var(--pale-pink-monochrome));
}
 
 #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 2s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 1s; }
 
:root {
—anim-position: absolute;
}
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,-60px);
    }
    50% {
      opacity: 1;
      transform: translate(0,14px);
    }
 
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }

康康我的代码

@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1+Code&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cutive+Mono&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Trispace:wght@500&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "unveiled-initiative";
   --theme-name: "Unveiled Initiative";
 
   --logo-image: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:unveiled-initiative/unveiled-initiative.png");
   --header-title: "揭幕倡议";
   --header-subtitle: "吾等乃无界之慧眼";
 
   --body-font: 'M PLUS 1 Code', sans-serif;
   --mono-font: 'Cutive Mono', monospace;
   --header-font: 'Trispace', sans-serif;
   --title-font: 'Trispace', sans-serif;
 
   --mainAccent: 50, 70, 155;
 
   --white-monochrome: 10, 15, 31;
   --pale-gray-monochrome: var(--gray-monochrome);
   --light-gray-monochrome: var(--gray-monochrome);
   --gray-monochrome: 9, 22, 70;
   --black-monochrome: 113, 129, 206;
   --bright-accent: var(--mainAccent);
   --medium-accent: var(--black-monochrome);
   --dark-accent: var(--gray-monochrome);
   --pale-accent: var(--mainAccent);
   --dark-gray-monochrome: 49, 63, 124;
 
   --link-color: 80, 104, 206;
   --hover-link-color: 80, 104, 206;
   --visited-link-color: 63, 81, 162;
 
   --swatch-headerh1-color: var(--white-monochrome);
   --swatch-headerh2-color: var(--white-monochrome);
 
   --swatch-topmenu-border-color: var(--gray-monochrome);
   --swatch-topmenu-bg-color: var(--gray-monochrome);
   --swatch-menutxt-light-color: var(--black-monochrome);
 
   --rating-module-button-plus-color: var(--black-monochrome);
   --rating-module-button-negative-color: var(--black-monochrome);
   --rating-module-button-cancel-color: var(--black-monochrome);
   --rating-module-button-credit-color: var(--black-monochrome);
}
 
/*Image position.*/
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: -1.1rem;
   top: -0.2rem;
   background-image: var(--logo-image);
   background-size: auto 7.3rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 1;
}
 
/*Upper header.*/
#header h1, #header h1 a {
   position: absolute;
   left: 3.2rem;
   top: 0.7rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
/*Lower header.*/
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   left: 2.3rem;
   top: 1.7rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
}
 
/*Login.*/
#login-status{
   color: rgb(var(--white-monochrome));
}
 
#login-status ul a {
  color: rgb(var(--white-monochrome));
}
 
/*Account*/
#account-topbutton {
   border-color: rgb(var(--swatch-text-light));
}
 
#account-options {
   border-color: rgb(var(--swatch-text-light));
   background-color: rgb(var(--swatch-text-general));
}
 
#account-options li a:hover {
    color: rgb(var(--swatch-text-light));
}
 
/*Search.*/
#search-top-box-input{
background: rgb(var(--black-monochrome));
border-color: rgb(var(--white-monochrome));
}
 
#search-top-box-form input[type=submit],
#search-top-box-form input[type=submit]:hover {
   color: rgb(var(--swatch-text-general));
}
 
/*Tabview.*/
 
/*Content BG.*/
.yui-navset .yui-content {
     background-color: rgba(var(--black-monochrome), 0.25);
     border-color: rgb(var(--black-monochrome));
}
 
/*Hover Tab BG.*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
     background-color: rgba(var(--black-monochrome), .25);
}
 
/*Selected Tab BG.*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
    background-color: rgb(var(--dark-gray-monochrome));
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
    background-color: rgb(var(--dark-gray-monochrome));
}
 
/*Titles.*/
.lightblock h1,
.styled-quote h1,
.light-borderblock h1 {
   color: rgb(var(--white-monochrome));
}
 
/*Div Blocks.*/
.styled-quote {
   background-color:rgb(var(--black-monochrome));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.5rem solid rgba(var(--black-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a {
   color: rgb(var(--link-color));
}
 
.dark-styled-quote a:visited {
   color: rgb(var(--visited-link-color));
}
 
.light-borderblock {
    background-color:rgb(var(--black-monochrome));
    color:rgb(var(--white-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--gray-monochrome));
}
 
.dark-borderblock {
    background-color:rgb(var(--gray-monochrome));
    color:rgb(var(--black-monochrome));
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
    border: solid 0.3rem rgb(var(--black-monochrome));
}
 
.lightblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--black-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
   color: rgb(var(--link-color));
}
 
.darkblock a:visited {
   color: rgb(var(--visited-link-color));
}
 
.titleblock {
  background-color: rgb(var(--gray-monochrome));
  color:rgb(var(--black-monochrome));
  padding: 0.5rem 1rem 0.10rem;
  margin: 1.5rem 0rem 0.5rem 0rem;
  box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
  border: solid rgb(var(--black-monochrome)) 2px;
}
 
.titlebox{
  color: rgb(var(--white-monochrome));
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--black-monochrome));
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}

+ 版式代码

@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "advanced-splinter";
   --theme-name: "Advanced Splinter Theme";
 
   --logo-image: url("http://backrooms-wiki.wikidot.com/local--files/theme:uec/EUC%20%282%29.png");
   --header-title: "无羁";
   --header-subtitle: "无羁于恐，团结于勇。";
 
   --body-font: punctuation-marks, Huiwen-mincho, sans-serif;
   --header-font: 'CKTKingKong', sans-serif;
   --title-font: 'CKTKingKong', sans-serif;
   --mono-font: 'Fantasque Sans Mono', monospace;
 
   --mainAccent: 255, 20, 40;
 
   --white-monochrome: 237, 233, 223;
   --pale-gray-monochrome: 255, 251, 240;
   --light-gray-monochrome: 160, 160, 160;
   --gray-monochrome: 72, 69, 60;
   --black-monochrome: 0, 0, 0;
   --bright-accent: var(--mainAccent);
   --medium-accent: 0, 0, 0;
   --dark-accent: var(--mainAccent);
   --pale-accent: var(--mainAccent);
   --dark-gray-monochrome: 20, 22, 24;
 
   --swatch-topmenu-border-color: var(--mainAccent);
   --swatch-topmenu-bg-color: var(--medium-accent);
   --swatch-menubg-color: var(--medium-accent);
   --swatch-border-color: var(--bright-accent);
 
   --swatch-text-dark: var(--white-monochrome);
   --swatch-text-light: var(--white-monochrome);
   --swatch-background: var(--medium-accent);
   --swatch-menutxt-dark-color: var(--white-monochrome);
   --swatch-primary-darker: var(--pale-accent);
 
   --swatch-secondary-color: var(--black-monochrome);
 
   --link-color: 230, 23, 68;
   --hover-link-color: 230, 23, 68;
   --visited-link-color: 156, 17, 47;
 
   --background-gradient-distance: 0rem;
   --gradient-topmenu: none;
   --diagonal-stripes: linear-gradient(transparent 0);
   --gradient-header: none;
 
    --header-height-on-desktop: 9rem;
 
}
 
/*login stuff*/
#login-status{
   color: rgb(var(--white-monochrome));
}
 
#login-status a#my-account {
   background-color: rgb(var(--pale-accent));
   padding: 0.3em 0.25em 0.2em 0.25em;
}
 
#account-options>ul>li a:hover {
   color: rgb(var(--pale-accent));
}
 
#account-options {
  background: rgb(var(--medium-accent));
  border-color: rgb(var(--pale-accent));
  color: rgb(var(--white-monochrome));
}
 
#login-status ul a {
  color: rgb(var(--white-monochrome));
}
 
/*table stuff*/
table.wiki-content-table th {
background-color: rgb(var(--dark-gray-monochrome));
border: 2px solid rgb(var(--pale-accent)) !important;
}
 
table.wiki-content-table td {
border: 2px solid rgb(var(--pale-accent)) !important;
}
 
/*misc*/
#page-title{
   border-bottom: 2px solid rgb(var(--pale-accent));
   text-align: center;
   color: rgb(var(--pale-accent));
}
 
#side-bar div.menu-item {
   border-color: rgb(var(--bright-accent));
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#footer{
   color: rgb(var(--black-monochrome));
}
 
.scp-image-block {
    border: none;
}
 
.scp-image-block .scp-image-caption {
    color: rgb(var(--white-monochrome));
    background-color: rgb(var(--dark-gray-monochrome));
    border: none;
    margin-top: 0.3rem;
    border-left: 0.2rem solid rgba(var(--pale-accent));
    border-right: 0.2rem solid rgba(var(--pale-accent));
}
 
.page-rate-widget-box {
    background: none;
    border: none;
    background-color: rgb(var(--dark-gray-monochrome));
    border-left: 0.2rem solid rgba(var(--pale-accent));
}
 
/*hexagon header gradient*/
#skrollr-body {
  background: repeating-linear-gradient(-45deg, #360509, #360509 4px, #ff1428 5px, #ff1428 5px);
  height: 11rem;
}
 
/*blend gradient*/
#container {
   background: linear-gradient(180deg, rgba(0,0,0,0) 35%, rgb(var(--medium-accent)) 93%);
   background-size: 37rem 11rem;
   background-attachment: scroll;
   background-repeat: repeat-x;
}
 
/*misc 2*/
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
/*header stuff*/
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
   overflow-x: clip;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -0.3rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   left: 4.8rem;
   top: 0.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   left: 3.3rem;
   top: 1.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: left;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   letter-spacing: 0.1rem;
}
 
#header h1 a::before{
   letter-spacing: 1rem;
}
 
/*links*/
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
/*line + block*/
hr {
   background-color: #000000;
   border-top: solid 2px rgb(var(--pale-accent));
}
 
blockquote,
div.blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
   background-color: rgb(var(--dark-gray-monochrome));
   border: none;
   border-left: solid 2px rgb(var(--pale-accent));
}
 
/*search*/
/*#search-top-box {
        left: 3%;
        top: 0.5rem;
}
 
#search-top-box-form > #search-top-box-input {
        width: 7rem;
}*/
 
/* TABVIEW - Abandon All Hope Ye Who Enter Here */
 
/*content bg*/
.yui-navset .yui-content {
     background-color: rgba(var(--pale-accent), 0.25);
     border-color: rgb(var(--pale-accent));
}
 
/*unselected tab color*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--dark-gray-monochrome));
    color:rgb(var(--white-monochrome));
}
 
/*hover tab bg*/
.yui-navset .yui-nav a:hover,
.yui-navset .yui-nav a:focus {
     background-color: rgba(var(--pale-accent), .25);
}
 
/*backer background*/
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    background: rgb(var(--dark-gray-monochrome));
}
 
/*selected tab bg*/
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected {
    background-color: rgb(var(--pale-accent));
}
 
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:active {
    background-color: rgb(var(--pale-accent));
}
 
@media only screen and (max-width: 768px) {
:root{
   --swatch-menubg-color: var(--medium-accent);
}
 
#header::before {
background-image: none;
}
 
    #header {
     height: var(--header-height-on-mobile);
     background-image: url("https://nu-scptheme.github.io/Black-Highlighter/images/logo.svg");
     background-image: var(--logo-image);
     --size: calc(var(--final-header-height-on-mobile) + 1rem);
     --y-offset: 1.5rem;
     background-position:
     calc((var(--header-height-on-mobile) - 0.75rem) - var(--size)) calc(((var(--size) * -1) + var(--header-height-on-mobile) + var(--y-offset)) / 2);
     background-size: var(--size), 100% var(--header-height-on-mobile);
     background-repeat: no-repeat, repeat;
     width: 100vw;
     margin: 0;
     position: sticky;
     top: calc(var(--header-height-on-mobile) * -1);
    }
 
#header h1, #header h1 a {
   left: 1rem;
   top: 0.8rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
   left: 0.8rem;
   top: 1.8rem;
}
 
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"]:hover {
    background: rgb(0, 0, 0);
    border-color: rgb(var(--pale-accent));
}
#search-top-box form[id="search-top-box-form"]:not(:focus-within) input[type="text"]{
    background: rgb(0, 0, 0);
    border-color: rgb(var(--pale-accent));
}
}
 
.styled-quote {
   background-color:rgb(var(--dark-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--black-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--dark-gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--black-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.titleblock {
   background-color: rgb(var(--dark-gray-monochrome));
   padding: 0.5rem 1rem 0.10rem;
   margin: 1.5rem 0rem 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border: solid rgb(var(--pale-accent)) 2px;
}
 
.titlebox{
  position: relative;
  top: -1.6rem;
  background-color: rgb(var(--pale-accent));
  color: rgb(var(--white-monochrome));
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.stripeblock{
   background: repeating-linear-gradient(-45deg, #360509, #360509 4px, #ff1428 5px, #ff1428 5px);
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
   border-left: 0.5rem solid rgba(var(--dark-gray-monochrome));
   border-right: 0.5rem solid rgba(var(--dark-gray-monochrome));
}

长得吓人的源代码

@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=Nunito&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito:ital@1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anek+Kannada:wght@500&display=swap');
@font-face {
    font-family: 'ARKai_C';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/ARKai_C.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'ChillGSans';
    src: url('https://cdn.jsdelivr.net/gh/LupusCaeruleus/Fonts@main/ChillGSans.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 
:root {
  --theme-base: "black-highlighter";
  --theme-id: "poolrooms-theme";
  --theme-name: "Poolrooms Theme";
 
  --logo-image: url("http://backrooms-sandbox-2.wdfiles.com/local--files/collab%3Apoolrooms-theme/blank.png");
  --header-title: "泳池房";
  --header-subtitle: "水声环绕";
 
  /* Typefaces */
  --body-font: 'Nunito', 'ARKai_C', sans-serif;
  --header-font: 'Anek Kannada', 'ChillGSans', sans-serif;
  --title-font: 'Anek Kannada', 'ChillGSans', sans-serif;
  --mono-font: 'IBM Plex Mono', 'Noto Serif SC';
 
  /* Standard Colors */
  --white-monochrome: 250, 250, 250;
  /* white */
  --pale-accent: 11, 70, 170;
  /* visited links */
  --bright-accent: 109, 125, 153;
  /* bright teal */
  --medium-accent: 108, 150, 224;
  /* medium teal - the "default" accent color */
  --dark-accent: 113, 129, 157;
  /* dark teal */
  --alt-accent: 11, 70, 170;
  /* darkblocks */
  --gray-monochrome: 108, 150, 224;
  /* blockquotes */
  --pale-gray-monochrome: 250, 253, 253;
  /* tables */
  --light-gray-monochrome: 67, 131, 241;
  /* some buttons */
  --dark-gray-monochrome: var(--gray-monochrome);
  /* blue */
  --dark-blue: 23, 70, 150;
  --swatch-topmenu-border-color: var(--medium-accent);
  --swatch-topmenu-bg-color: var(--bright-accent);
  --swatch-border-color: var(--medium-accent);
  --border-styling: outset 2px rgb(var(--swatch-border-color));
   --darker-accent: 155, 80, 226;
 
  --link-color: var(--dark-blue);
  --link-color-bright: var(--dark-blue);
  --hover-link-color: 69, 129, 208;
  --newpage-color: 129, 81, 206;
  --swatch-menubg-color: 169, 183, 214;
 
  /* Box-Shadow 1px Borders */
  --box-border-bottom: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
  --box-border-top: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
  --box-border-left: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
  --box-border-right: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
  --box-border-all: 4px 4px 0 0 rgba(0, 0, 0, 0.2);
 
  /* Rating box */
  --rating-module-button-plus-color: var(--light-gray-monochrome);
  --rating-module-button-negative-color: var(--light-gray-monochrome);
  --rating-module-button-cancel-color: var(--light-gray-monochrome);
  --rating-module-button-credit-color: var(--light-gray-monochrome);
}
 
#account-topbutton {
  border-color: rgb(var(--swatch-text-light));
}
 
#header h1, #header h1 a {
  top: 0.5rem;
  font-size: 200%;
}
 
#header h2, #header h2 span, #header h2 span::before {
  top: 1.7rem;
  font-size: 110%;
}
 
#login-status {
  color: rgb(var(--dark-blue));
}
 
#search-top-box {
  display: none;
}
 
#skrollr-body {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-image: url("http://backrooms-sandbox-2.wdfiles.com/local--files/collab%3Apool-of-magic-zask-juice/banner_tiles.png");
  background-repeat: repeat;
  background-size: 60%;
}
 
#page-title, h1, h2 {
  color: rgb(var(--dark-blue));
}
 
h3,h4,h5,h6 {
  color: rgb(var(--medium-accent));
}
 
.styled-quote {
   border-left: 0.5rem solid rgb(var(--dark-blue));
}
 
.dark-styled-quote {
   border-left: 0.5rem solid rgb(var(--dark-blue));
}
 
.darkblock h1,
.darkblock h2,
.dark-styled-quote h1,
.dark-styled-quote h2 {
  color: rgb(var(--medium-accent));
}
 
@media screen and (max-width: 600px) {
  #header h1, #header h1 a {
    font-size: 150%;
  }
}

[+] 版式代码

import url('https://fonts.googleapis.com/css2?family=Trispace:wght@300&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Staatliches&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Josefin+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Sans+Narrow&display=swap');
 
@media screen and (prefers-reduced-motion: no-preference) {
    #page-title, #breadcrumbs, #page-content > * {
      animation-name: fadeIn;
      animation-duration: 1s;
      animation-iteration-count: 1;
      animation-timing-function: ease-out;
      animation-fill-mode: backwards;
    }
  }
  #page-title { animation-delay: 0s; }
 
  @keyframes fadeIn {
    from {
      opacity: 0;
      transform: translate(0,30px);
    }
    to {
      opacity: 1;
      transform: translate(0,0);
    }
  }
 
#login-status {
   color: rgb(var(--white-monochrome));
}
 
#account-options {
   background-color: rgb(var(--dark-accent));
   border-color: rgb(var(--black-monochrome));
}
 
#account-options li a:hover {
   color: rgb(var(--bright-accent));
}
 
#side-bar:hover,
#side-bar:active {
   background-color: rgb(var(--swatch-background));
}
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";
 
   --logo-image: url("http://backrooms-sandbox-2.wdfiles.com/local--files/collab%3Awhoyoucallinapinhead-and-snowy-biofell-theme/biofelllogo.png");
   --header-title: "BIOFELL项目";
   --header-subtitle: "永恒滋长";
 
   --body-font: 'Josefin Sans';
   --header-font: Staatliches';
   --title-font: 'Trispace', serif;
   --mono-font: 'PT Sans Narrow', monospace;
 
   --white-monochrome: 255, 255, 255;
   --pale-gray-monochrome: 34, 34, 34;
   --light-gray-monochrome: 255, 255, 255;
   --gray-monochrome: 34, 34, 34;
   --black-monochrome: 255, 0, 0;
   --bright-accent: 140, 136, 126;
   --medium-accent: 0, 0, 0;
   --dark-accent: 32, 32, 32;
   --pale-accent: 140, 136, 126;
 
   --swatch-headerh1-color: 255, 255, 255;
   --swatch-headerh2-color: 255, 255, 255;
   --swatch-menutxt-light-color: 255, 255, 255;
   --swatch-menubg-medium-color: 34, 34, 34;
   --swatch-tertiary-color; 255, 255, 255
   --swatch-border-color: 255, 255, 255;
   --swatch-text-general: 255, 255, 255;
   --swatch-text-light: 255, 146, 146;
   --swatch-background: 20, 20, 20;
   --header-gradient-color-bottom: 191, 191, 191;
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 230, 23, 68;
   --hover-link-color: 230, 23, 68;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
}
 
#extrac-div-1 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background: repeating-linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.15) 50%,rgba(0,0,0,0));
    background-size: auto 8px;
    opacity: 0.7;
}
 
#extrac-div-2 {
    position: fixed;
    width: 100vw;
    height : 1rem;
    top: 0;
    pointer-events: none;
    background: linear-gradient(to bottom, rgba(229, 34, 80) 0%,rgba(229, 140, 36,1) 50%,rgba(229, 140, 36,0.98) 51%,rgba(229, 140, 36) 100%);
    opacity : .1;
    animation: scanm 6s linear infinite;
}
 
@keyframes scanm {
  0%   { top: -1rem; opacity : .05;}
  25% { top: 50%; opacity: .03;}
  37.5% { top: 75%; opacity: 0.06;}
  50% { top: 100%; opacity: .03;}
  100% { top: 100%;}
}
 
#extrac-div-3 {
    position: fixed;
    width: 100vw;
    height: 100vh;
    pointer-events: none;
    background-image: radial-gradient(circle, rgb(229, 140, 36) 4%, rgb(0,0,0) 45%, rgb(229, 140, 36) 95%);
    opacity: 0.25;
    mix-blend-mode: color-dodge;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 30;
}
 
#page-content > :nth-child(1) { animation-delay: calc(1 * var(--fade-in-delay)); }
#page-content > :nth-child(2) { animation-delay: calc(2 * var(--fade-in-delay)); }
#page-content > :nth-child(3) { animation-delay: calc(3 * var(--fade-in-delay)); }
#page-content > :nth-child(4) { animation-delay: calc(4 * var(--fade-in-delay)); }
#page-content > :nth-child(5) { animation-delay: calc(5 * var(--fade-in-delay)); }
#page-content > :nth-child(6) { animation-delay: calc(6 * var(--fade-in-delay)); }
#page-content > :nth-child(7) { animation-delay: calc(7 * var(--fade-in-delay)); }
#page-content > :nth-child(8) { animation-delay: calc(8 * var(--fade-in-delay)); }
#page-content > :nth-child(9) { animation-delay: calc(9 * var(--fade-in-delay)); }
#page-content > :nth-child(10) { animation-delay: calc(10 * var(--fade-in-delay)); }
#page-content > :nth-child(11) { animation-delay: calc(11 * var(--fade-in-delay)); }
#page-content > :nth-child(12) { animation-delay: calc(12 * var(--fade-in-delay)); }
#page-content > :nth-child(13) { animation-delay: calc(13 * var(--fade-in-delay)); }
#page-content > :nth-child(14) { animation-delay: calc(14 * var(--fade-in-delay)); }
#page-content > :nth-child(15) { animation-delay: calc(15 * var(--fade-in-delay)); }
#page-content > :nth-child(n+15) { animation-delay: calc(16 * var(--fade-in-delay)); }
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://backrooms-sandbox-2.wdfiles.com/local--files/collab%3Awhoyoucallinapinhead-and-snowy-biofell-theme/gh.png");
 background-repeat: repeat-x;
background-size: inherit;
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 50%, transparent 0);
   background-size: 0.25em 0.25em;
   background-repeat: repeat;
   background-attachment: fixed;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 11rem;
   top: -1rem;
   background-image: var(--logo-image);
   background-size: auto 8.5rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .7rem .7rem .9rem #000000;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
div.block-center {
   min-width: 30%
}
 
@media only screen and (max-width:768px) {
   div.block-center {
      min-width: 40%
   }
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.5rem solid rgba(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.titleblock {
        background-color: rgb(var(--dark-gray-monochrome));
        color:rgb(var(--white-monochrome));
        padding: 0.5rem 1rem 0.10rem;
        margin: 1.5rem 0rem 0.5rem 0rem;
        box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.5);
        border: solid rgb(var(--bright-accent)) 2px;
     }
 
     .titlebox{
       color: rgb(var(--dark-gray-monochrome));
       position: relative;
       top: -1.6rem;
       background-color: rgb(var(--bright-accent));
       padding: 0.25rem 1rem;
       line-height: 0.1rem;
     }
 
.dark-styled-quote {
   background-color:rgb(var(--red-monochrome));
   border-left: 0.5rem solid rgba(var(--swatch-headerh1-color));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--red-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
/* sd banner colours */
.sd-container {
   --sd-bullets:167,12,10;
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}

+ 版式代码

/*fonts*/
/*
   Reverence Theme
 
   by Evfist (and Viv!)
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
 
@import url('https://fonts.googleapis.com/css2?family=Mukta:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Major+Mono+Display&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Reverence Theme";
 
   --logo-image: url("http://backrooms-sandbox.wdfiles.com/local--files/reverencetheme/Reverence4.png");
   --header-title: "R.O.U.G.E.项目";
   --header-subtitle: "记录未知的组织与实体";
 
   --body-font: 'Roboto', 'Noto Serif SC';
   --header-font: 'Roboto', 'Noto Serif SC';
   --title-font: 'Mukta', 'Noto Sans SC';
   --mono-font:  'Mukta', 'Noto Sans SC';
 
   --white-monochrome: 250, 249, 247;
   --pale-gray-monochrome: 240, 237, 228;
   --light-gray-monochrome: 240, 237, 228;
   --gray-monochrome: 0, 0, 0;
   --black-monochrome: 25, 20, 16;
   --bright-accent: 115, 115, 112;
   --medium-accent: 0, 0, 0;
   --dark-accent: 0, 0, 0;
   --pale-accent: 0, 0, 0;
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 37, 116, 244;
   --visited-link-color: 0, 82, 163;
   --hover-link-color: 37, 116, 244;
   --newpage-color: 186, 0, 0;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--pale-accent)) 0%,
      rgba(var(--pale-accent)) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
 
   /*header shadow*/
   --background-gradient-distance: 10rem;
   --background-gradient-color: var(--pale-accent);
   --gradient-background: linear-gradient(to bottom, rgba(var(--background-gradient-color), 1) 95%,  rgba(var(--background-gradient-color), 0) 100%);
 
   /*side bar*/
   --swatch-menubg-color: none;
 
    --rating-module-button-plus-color: 0, 0, 0;
   --rating-module-button-negative-color: 0, 0, 0;
   --rating-module-button-cancel-color: 0, 0, 0;
   --rating-module-button-credit-color: 0, 0, 0;
}
 
/*removing dots*/
#skrollr-body {
   background-image:none;
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
/*removing dots 2*/
#container {
   background-image: none;
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 8rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.4;
}
 
#header h1, #header h1 a {
   position: absolute;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
/*footnote fix*/
.hovertip {
    background-color: rgb(var(--white-monochrome)) !important;
}
 
/*tab border color*/
.yui-navset .yui-content {
     border-color: rgb(var(--pale-accent));
}
 
/*tables*/
table.wiki-content-table th {
border: 1px solid rgb(var(--bright-accent)) !important;
background-color: rgb(var(--pale-accent));
color: rgb(var(--white-monochrome));
}
 
table.wiki-content-table td {
border: 1px solid rgb(var(--pale-accent)) !important;
}
 
/*searchbox border color*/
#search-top-box-input {
    border-color: rgb(var(--white-monochrome));
}
 
#search-top-box-form input[type="submit"] {
    border-color: rgb(var(--white-monochrome));
}
 
#search-top-box-form input[type="submit"]:hover {
    border-color: rgb(var(--white-monochrome));
}
 
#search-top-box-input:hover,
#search-top-box-input:focus {
    color: rgb(var(--gray-monochrome));
}
 
/*fix scrollbar thingy*/
body::-webkit-scrollbar-thumb {
  background-color: rgb(var(--pale-accent));
  opacity: 1;
}
 
/*new fancy blockquote*/
blockquote,
.blockquote,
div.blockquote,
[class*="blockquote"] {
    border: 4px double white;
    outline: 6px solid black;
    background-color: black;
    color: white;
    margin: 1em 46px;
    padding: 0 1em;
}
 
@media only screen and (max-width: 768px) {
:root{
   --swatch-menubg-color: var(--white-monochrome);
}
 
blockquote,
.blockquote,
div.blockquote,
[class*="blockquote"] {
    margin-left: 0;
    margin-right: 0;
    }
}
 
.styled-quote {
   background-color:rgb(var(--light-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-accent));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--white-monochrome));
   border-left: 0.5rem solid rgba(var(--bright-accent));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.2rem 0.3rem rgba(0,0,0,.25);
}

+ 版式代码

@import url(https://fonts.googleapis.com/css?family=Long+Cang&display=swap);
@import url(http://scpsandboxcn.wikidot.com/local--files/typeface/Typeface-Ziticqtezhanti.css);
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";
 
   --logo-image: url("http://sensenca-picture.wikidot.com/local--files/main/Scrapyard1.png");
 
   --header-title: "垃 圾 场";
   --header-subtitle: "准备摇摆";
 
   --body-font: 'ziticqtezhanti', cursive;
   --header-font: 'Long Cang', cursive;
   --title-font: 'Long Cang', cursive;
   --mono-font: 'zcoolwenyiti', cursive;
 
   --white-monochrome: 31, 31, 31;
   --pale-gray-monochrome: 156, 16, 16;
   --light-gray-monochrome: 201, 20, 20;
   --gray-monochrome: 230, 230, 230;
   --black-monochrome: 255, 255, 255;
   --bright-accent: 255, 255, 255;
   --medium-accent: 18, 18, 18;
   --dark-accent: 217, 0, 0;
   --pale-accent: 201, 20, 20;
   --swatch-menubg-dark-color: var(--pale-gray-monochrome);
   --thing: 255, 255, 255;
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 171, 171, 171;
   --hover-link-color: 237, 130, 97;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 0%,
      rgba(var(--medium-accent), 0.90) 100%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://backrooms-wiki.wikidot.com/local--files/theme:scrapyard/Theme.png");
    background-repeat: repeat-x;
    background-size:  inherit;
}
 
#container {
   background-image: none
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
    color: rgb(var(--dark-accent));
}
 
#page-title {
    border-color: rgb(var(--light-gray-monochrome));
    color: rgb(var(--dark-accent))!important;
    font-size: 2.5rem;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 90%;
   width: 100%;
   left: 0;
   top: 0;
   background-image: var(--logo-image);
   background-size: auto 8.5rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 0.8;
}
 
#header h1, #header h1 a {
   font-size: 2.5rem;
   position: absolute;
   top: 0.05rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   font-size: 1.3rem;
   position: absolute;
   top: 1.9rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   color: white;
   line-height: 1
}
 
h1 {
    font-size: 2rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h2 {
    font-size: 1.8rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h3 {
    font-size: 1.6rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h4 {
    font-size: 1.4rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h5 {
    font-size: 1.2rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h6 {
    font-size: 1rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   ));
   border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--pale-gray-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
.yui-navset .yui-nav .selected a,
.yui-navset .yui-nav .selected a:focus,
.yui-navset .yui-nav .selected a:hover {
    background-color: rgb(var(--thing));
}
 
#login-status a {
    color: rgb(var(--gray-monochrome));
}
 
#login-status ul a {
    color: rgb(var(--white-monochrome));
}
 
.customFont {
    font-family: 'zcoolwenyiti', cursive;
}
.main-font{
    font-family: 'Long Cang', cursive;
}

+ 版式代码

@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
 
@import url('https://fonts.googleapis.com/css2?family=Righteous&display=swap');
.main-font {
    font-family: 'Righteous', cursive;
}
 
@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display&display=swap');
.customFont {
    font-family: font-family: 'Red Hat Display', sans-serif;
}
 
@import url('https://fonts.googleapis.com/css2?family=Trispace:wght@300&display=swap');
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url("http://backrooms-wiki.wdfiles.com/local--files/component%3Atheme/normalize-archived.css");
@import url("http://backrooms-wiki.wdfiles.com/local--files/component%3Atheme/bhl-archived.css");
@import url("http://backrooms-wiki.wikidot.com/local--files/component:theme/sidebar.css");
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";
 
   --logo-image: url("http://backrooms-wiki.wdfiles.com/local--files/spoofyboofy-s-loft/backroom_logo_transparent_final.png");
   --header-title: "房间旅行社";
   --header-subtitle: "期待您的到来！";
 
   --body-font: 'Red Hat Display', sans-serif;
   --header-font: 'CKTKingKong','Righteous';
   --title-font: 'CKTKingKong','Trispace';
   --mono-font: 'Fantasque Sans Mono','Red Hat Display', sans-serif;
 
   --white-monochrome: 234, 212, 255;
   --pale-gray-monochrome: 204, 142, 222;
   --light-gray-monochrome: 139, 120, 207;
   --gray-monochrome: 80, 25, 97;
   --black-monochrome: 121, 59, 148;
   --bright-accent: 196, 69, 190;
   --medium-accent: 110, 36, 133;
   --dark-accent: 80, 25, 97;
   --pale-accent: 127, 51, 150;
   --swatch-menubg-dark-color: var(--pale-accent);
   --thing: 255, 255, 255;
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 113, 48, 242;
   --hover-link-color: 69, 2, 201;
 
   --background-gradient-distance: 0rem;
 
   --gradient-header: linear-gradient(to top,
      rgba(var(--medium-accent)) 50%,
      rgba(var(--medium-accent), 0.90) 50%
   );
   --diagonal-stripes: linear-gradient(transparent 0);
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("http://backrooms-sandbox-2.wikidot.com/local--files/tra-theme/final%20banner%20upload%20god%20please");
    background-repeat: repeat-x;
    background-size:  cover;
}
 
#container {
   background-image: none
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   border-radius: 0em;
   -moz-border-radius: 0em;
   border: none;
}
 
div#page-options-bottom-2 > a:active, div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:active, div#page-options-bottom > a:hover {
   border: none;
}
 
#header, #top-bar {
   background-attachment: scroll;
}
 
#header {
   background-image: none;
}
 
#page-title {
    border-color: rgb(var(--light-gray-monochrome));
    color: rgb(var(--dark-accent))!important;
    font-size: 3rem;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 80%;
   width: 100%;
   left: -18.5rem;
   top: 0;
   background-image: var(--logo-image);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   font-size: 3rem;
   position: absolute;
   top: 0.05rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   font-size: 1.5rem;
   position: absolute;
   top: 1.9rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   color: white;
   line-height: 0.7
}
 
h1 {
    font-size: 2.7rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h2 {
    font-size: 2.4rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h3 {
    font-size: 2.2rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h4 {
    font-size: 2.0rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h5 {
    font-size: 1.8rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
h6 {
    font-size: 1.6rem;
    color:rgb(var(--dark-accent));
    line-height: 1
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote {
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.styled-quote {
   background-color:rgb(var(--pale-gray-monochrome));
   border-left: 0.5rem solid rgba(var(--gray-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote {
   background-color:rgb(var(--gray-monochrome));
   border-left: 0.5rem solid rgba(var(--pale-gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.1rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0.2rem 0.4rem 1.2rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.lightblock {
   background-color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--white-monochrome));
   padding: 0.01rem 1rem;
   margin: 0.5rem 0 0.5rem 0.25rem;
   box-shadow: 0 0.8rem 1.2rem rgba(0,0,0,.25);
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}

+ 版式源代码

@import url(http://scpsandboxcn.wikidot.com/local--files/typeface/Typeface-BWCKKT.css);
:root {
    --logo-image: url("http://backrooms-wiki.wdfiles.com/local--files/theme%3Arepository/nexus.svg");
    --header-title: "资料库";
    --header-subtitle: "科学之潜力";
    --header-height-on-desktop: 11rem;
    --swatch-text-general: 245, 245, 245;
    --swatch-secondary-color: 0, 0, 0;
    --swatch-background: 0, 0, 0;
    --swatch-primary-darker: 0, 50, 175;
    --rating-module-text-color: 0, 125, 250;
    --rating-module-button-color: 0, 125, 250;
    --swatch-menubg-color: 0, 10, 20;
    --swatch-menubg-hover-color: 0, 125, 250;
    --sidebar-links-text: 237, 233, 239;
    --body-font: 'Noto Sans SC', sans-serif;
    --header-font: 'BWCKKT', 'Noto Sans SC', sans-serif;
    --title-font: 'BWCKKT', 'Noto Sans SC', sans-serif;
    --mono-font: 'BWCKKT', 'Noto Sans SC', sans-serif;
}
#side-bar:hover::-webkit-scrollbar-thumb, #side-bar:focus::-webkit-scrollbar-thumb {
    background: rgb(0, 125, 250);
}
#side-bar:hover::-webkit-scrollbar-track, #side-bar:focus::-webkit-scrollbar-track {
    background: rgb(0, 20, 50);
}
hr {
    border-top: .063rem solid #007dfa;
    box-shadow: 0px 0px 5px 1px #007dfa;
    background-color: #007dfa;
}
.scp-image-caption {
    box-shadow: 0px 0px 5px 3px #007dfa;
}
.yui-content {
    border-color: var(--swatch-primary-darker);
    box-shadow: 0px 0px 5px 1px #007dfa;
}
.yui-navset .yui-nav li, .yui-navset .yui-navset-top .yui-nav li {
    box-shadow: 0px 0px 5px 1px #007dfa;
}
.yui-navset .yui-nav a:focus, .yui-navset .yui-nav a:hover {
    background-color: rgba(0, 125, 250, 0.3);
}
.yui-navset .yui-nav .selected a {
    background-color: rgba(0,125,250, 0.3);
}
body::-webkit-scrollbar-thumb, html::-webkit-scrollbar-thumb {
    background: rgba(0, 125, 250);
}
.page-rate-widget-box {
   box-shadow: 0px 0px 5px 1px #007dfa;
}
.scp-image-block.block-right {
   box-shadow: 0px 0px 5px 3px #007dfa;
}
#search-top-box-form>input {
   box-shadow: 0px 0px 5px 1px #007dfa;
}
#top-bar div.mobile-top-bar>ul>li:hover, #top-bar div.top-bar>ul>li:hover {
    background-color: black;
}
table.wiki-content-table th {
    background: rgb(0, 50, 125);
}
table.wiki-content-table th, table.wiki-content-table tr {
    box-shadow: 0px 0px 5px 1px #007dfa;
}
blockquote {
    box-shadow: 0px 0px 5px 4px #007DFA;
}
#header::before {
    background-size: auto 9rem;
    opacity: 1;
}
#search-top-box {
    margin-top: -1.50rem;
}
div#container-wrap {
    background: url("http://backrooms-wiki.wdfiles.com/local--files/theme%3Arepository/background.gif"), rgb(0, 0, 0);
    background-repeat: repeat-x;
    background-size: auto 11.25rem, 100vw calc(100vh - 150px);
}
#header h1 a::before, #header h2 span::before {
    text-shadow: none;
    font-family: 'BWCKKT', 'Noto Sans SC', sans-serif;
}
@media only screen and (min-width: 769px) {
#main-content::after {
    background-image: url("http://backrooms-wiki.wdfiles.com/local--files/theme%3Arepository/sidebar-tab.svg");
    background-size: 0.95rem 12.875rem;
}
#main-content::before {
    border-right: 2px solid rgb(0, 125, 250);
}
}
#edit-page-textarea, #lock-info, #edit-page-comments {
    background-color: rgb(0, 0, 0);
}
a, a:hover {
    color: rgb(0, 125, 250);
}
a:visited {
    color: rgb(125, 125, 125);
}
#search-top-box-form input[type=submit], #search-top-box-form input[type=submit]:focus, #search-top-box-form input[type=submit]:hover {
    background-color: black;
    box-shadow: 0px 0px 5px 1px #007dfa;
}
#search-top-box-form input[type=submit], #search-top-box-input:focus, #search-top-box-input:hover {
    background-color: rgb(0, 0, 50);
}
#search-top-box-form>input, #search-top-box-form>input[type=submit] {
    background-color: rgb(0, 0, 25);
}
#footer {
    background-color: rgb(0, 50, 100);
}
#top-bar div.mobile-top-bar>ul>li.sfhover>a:after, #top-bar div.mobile-top-bar>ul>li.sfhover>a:before, #top-bar div.mobile-top-bar>ul>li:hover>a:after, #top-bar div.mobile-top-bar>ul>li:hover>a:before, #top-bar div.top-bar>ul>li.sfhover>a:after, #top-bar div.top-bar>ul>li.sfhover>a:before, #top-bar div.top-bar>ul>li:hover>a:after, #top-bar div.top-bar>ul>li:hover>a:before {
    background-color: rgb(0, 125, 250);
}
#top-bar div.mobile-top-bar>ul>li:hover>a, #top-bar div.top-bar>ul>li:hover>a {
    background-color: rgba(0, 0, 0, 0.4);
}
div#page-options-bottom-2>a, div#page-options-bottom>a {   
    background-color: rgba(0, 125, 250, 0.3);
}
div#page-options-bottom-2>a:active, div#page-options-bottom-2>a:hover, div#page-options-bottom>a:active, div#page-options-bottom>a:hover {
    background-color: rgba(0, 125, 250, 0.2);
}
.styled-quote {
    background-color: rgba(0,125,250,0.1);
    border-left: 0.5rem solid rgba(0, 125, 250, 1);
    padding: 0.1rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0px 0px 5px 1px #007dfa;
}
.lightblock {
    background-color: rgba(0, 125, 250, 0.4);
    padding: 0.01rem 1rem;
    margin: 0.5rem 0 0.5rem 0.25rem;
    box-shadow: 0px 0px