jaygawujdkuaw

▷ 显示代码 ◁

@import url(https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700&display=swap);
 
/* Centered Header Sigma
 * [2021 Wikidot Component]
 * By Lt Flops (CC BY-SA 3.0)
 * Forked from:
   * Penumbra Theme by EstrellaYoshte
 * Also based on:
   * Centered Header BHL by Woedenaz
**/
 
/* ---- VARS ---- */
 :root{
     --titleColor: hsl(0, 0%, 95%);
     --subtitleColor: hsl(60, 62%, 85%);
     --lgurl: url(https://scp-wiki.wdfiles.com/local--files/component%3Acentered-header-sigma-9/logo.svg);
}
 
/* ---- SITE BANNER ---- */
 #header,
 div#header{
     background-image: none;
}
 
 #header::before{
     position: absolute;
     width: 100%;
     height: 100%;
     content: "";
 
     background-image: var(--lgurl);
     background-position: center top;
     background-repeat: no-repeat;
     background-size: auto 9em;
     opacity: .33;
}
 
 #header h1,
 #header h2{
     float: none;
     margin-left: 0;
 
     text-align: center;
}
 
 #header h1 span,
 #header h2 span{
   /* Hide the Existing Text */
     display: none;
}
 
 #header h1 a::before,
 #header h2::before{
   /* Style the New Text */
     font-family: "Montserrat", "Arial", sans-serif;
     text-shadow: none;
}
 
 #header h1 a::before{
     position: relative;
     bottom: .15em;
 
     color: var(--titleColor);
 
     font-size: 115%;
     font-weight: 700;
}
 
 #header h2::before{
     position: relative;
     top: .1em;
 
     color: var(--subtitleColor);
 
     font-size: 130%;
     font-weight: 600;
}
 
 #header h1 a::before{
   /* Set the New Text's Content From Variable */
     content: var(--header-title, "SCP基金会");
}
 
 #header h2::before{
     content: var(--header-subtitle, "控制 - 收容 - 保护");
}
 
/* ---- SEARCH ---- */
 #search-top-box{
     top: 1em;
     right: 0;
}
 
 #search-top-box-form input.button{
     margin-right: 0;
}
 
 #search-top-box-input,
 #search-top-box-input:hover,
 #search-top-box-input:focus,
 #search-top-box-form input[type=submit],
 #search-top-box-form input[type=submit]:hover,
 #search-top-box-form input[type=submit]:focus{
     border-radius: 0;
     box-shadow: none;
 
     font-size: 100%;
}
 
/* ---- TOP BAR ---- */
 #top-bar{
     right: 0;
     display: flex;
     justify-content: center;
}
 
 #top-bar ul li ul{
     border-bottom: 1px solid hsl(0, 0%, 40%);
     box-shadow: none;
}
 
/* ---- LOGIN ---- */
 #login-status{
     top: 1.1em;
     right: initial;
 
     color: hsl(0, 0%, 87%);
}
 
 #account-topbutton{
     border-color: hsl(0, 0%, 87%);
 
     font-size: 100%;
}
 
/* ---- PAGE TITLE ---- */
 .meta-title,
 #page-title{
     text-align: center;
}
 
/* ---- BREADCRUMBS ---- */
 .pseudocrumbs,
 #breadcrumbs{
     text-align: center;
}
 
/* ---- MOBILE DISPLAY ---- */
 @media (max-width: 767px){
     #search-top-box{
          top: 1.85em;
          width: unset;
    }
 
     .mobile-top-bar{
          position: relative;
          left: 0;
          display: flex;
          justify-content: center;
    }
 
     #login-status{
          top: 0;
          right: 0;
    }
 
     #header .printuser{
          font-size: 0;
    }
 
     #header .printuser img.small{
          margin: 0;
 
          transform: translate(6px, 4px);
    }
 
     #my-account{
          display: none;
    }
 
     #account-topbutton{
          margin-left: 2px;
    }
}

≡

Included page "theme:berry" does not exist (create it now)

+ 版式代码

@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("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
@import url('https://fonts.googleapis.com/css2?family=Gemunu+Libre:wght@800&display=swap');
:root {
    --logo-image: url("http://tartar0s.wikidot.com/local--files/theme:rhodes-island/%E8%9A%80%E6%B5%AA.png");
    --header-title: "REDEAVE BABEL";
    --header-subtitle: "逐光蚀浪，与天争壤";
   /* 字体 */
   --body-font: punctuation-marks,proxima-nova, sans-serif;
   --header-font: 'Noto Serif SC', 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: 14,14,14;
    /* 次强调色（登录时） */
    --gray-monochrome: 14,14,14;
    /* 蓝灰色 */
    --black-monochrome: 0, 0, 0;
    /* 黑色 */
    --medium-accent: 14,14,14;
    /* 蓝色*/
    --dark-accent: 14,14,14;
    /* 蓝棕色 */
 
    /* 背景与网站标题色 */
    --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);
 
/* 评分模块颜色 */
   --swatch-topmenu-border-color: var(--link-color);
   --rating-module-button-plus-color: var(--medium-accent);
   --rating-module-button-negative-color: var(--medium-accent);
   --rating-module-button-cancel-color: var(--medium-accent);
   --rating-module-button-credit-color: var(--medium-accent);
 
    --link-color: 242,116,5;
    --visited-link-color: 121,137,143;
    --hover-link-color: 242,116,5;
    --newpage-color: 180,100,20;
 
    --gradient-header: repeating-linear-gradient(
      -0deg,
      rgba(238,238,238, 1),rgba(220,220,220, 1),rgba(199,199,199, 0.8),rgba(175,167,152, 0.8),rgba(166,152,141, 0.8),rgba(166,152,141, 0.8),rgba(166,152,141, 0.8) 100%
    );
   --swatch-topmenu-border-color: var(--medium-accent);
    --swatch-topmenu-bg-color: var(--medium-accent);
    --swatch-border-color: var(--bright-accent);
 
    --swatch-menubg-color: 255,255,255;
}
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > a {
    background-color: rgb(var(--medium-accent));
    transition: background 0.2s linear;
   border-bottom: solid 2px #F27405;
}
 
#top-bar div.top-bar > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li:hover > a {
    background-color: rgb(225, 225, 225);
    color: black;
    transition: background 0.2s linear;
   border-bottom: solid 2px #F27405;
}
 
#top-bar div.top-bar > ul > li > ul > li:hover > a,
#top-bar div.mobile-top-bar > ul > li > ul > li:hover > a {
    background-color: rgb(17, 17, 17);
    color: white;
    transition: background 0.2s linear;
   border-bottom: solid 2px #F27405;
}
 
#top-bar div.top-bar > ul > li > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > ul > li > a {
    background-color: rgb(225, 225, 225);
    color: black;
    transition: background 0.2s linear;
   border-bottom: solid 2px #F27405;
}
 
#toc-list a{
color:black;
}
 
.open-menu p{
   border-bottom: solid 2px #F27405;
}
 
::selection {
    background:rgba(var(--medium-accent),0.3);
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: -0.8rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: none;
}
#header h2 span::before {
    text-shadow: .063rem 0.1rem 0.1rem #000000;
}
body::after {
    content: "";
    background: linear-gradient(to top,
      rgba(235,235,235) 0%,
      rgba(210,210,210, 0.90) 100%
   );
    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;
}
#search-top-box {
        left: 3%;
        top: 0.5rem;
}
 
#search-top-box-form > #search-top-box-input {
        width: 7rem;
}
@media only screen and (max-width: 768px) {
:root{
    --swatch-menubg-color: 255,255,255;
}
 
#search-top-box {
        left: unset;
        top: unset;
}
 
#search-top-box-form > #search-top-box-input {
        width: 2rem;
}
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0;
   top: 0.2rem;
   background-image: var(--logo-image);
   background-size: auto 10rem;
   background-position: center;
   background-repeat: no-repeat;
   opacity: 1;
}
}
#login-status a,#login-status span{
   color: white;
}
#login-status a#my-account {
   color:white;
   background-color: rgb(var(--medium-accent));
   padding: 0.3em 0.25em 0.2em 0.25em;
}
#side-bar:hover,
#side-bar:active,
#side-bar:focus-within {
   background-color: rgb(255,255,255);
}
 
#side-bar .menu-item a{
   color: rgb(var(--medium-accent))!important;
}
hr {
   background-color: rgb(var(--medium-accent));
}
.scp-image-block {
    border: none;
}
 
#page-title{
   text-align: center;
   color: rgb(var(--medium-accent));
   border-bottom: 5px solid rgb(var(--medium-accent));
}
 
.scp-image-block .scp-image-caption {
    color: white;
    background-color: rgb(17,17,17);
    border: none;
    margin-top: 0.3rem;
   border-bottom: solid 2px #F27405;
}
 
.owindow {
   border: 0.2rem solid rgba(var(--medium-accent));
}
 
.footnotes-footer a{
   color: black;
}
 
.page-tags span a{
   color: black;
}
 
.page-watch-options a{
   color: black;
}
 
/*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));
}
 
.code {
   box-shadow: none;
    background-color:rgba(var(--light-gray-monochrome),.13);
   border: none;
   border-left: solid 2px rgb(var(--medium-accent));
}
 
blockquote {
   box-shadow: none;
color: white;
    background-color:rgba(var(--light-gray-monochrome),.6);
  background-image:
    radial-gradient(circle, rgb(70,70,70) 50%, transparent 0);
   border: solid 2px rgb(var(--medium-accent));
   background-size: 0.25em 0.25em;
}
 
#page-content .page-rate-widget-box a{
   background: white;
}
#page-content .page-rate-widget-box a:hover{
   background: rgb(17,17,17);
   border: none;
   box-shadow: none;
}
 
#action-area .page-rate-widget-box a{
   background: white;
}
#action-area .page-rate-widget-box a:hover{
   background: rgb(17,17,17);
   border: none;
   box-shadow: none;
}
 
.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:white;
     border: none;
    }
 
.logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://tartar0s.wikidot.com/local--files/theme:rhodes-island/%E8%9A%80%E6%B5%AA.png) center/18% no-repeat;
   filter: brightness(0%) invert(0%);
    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;
color: white;
    position: relative;
    background-color:rgba(var(--light-gray-monochrome),.6);
  background-image:
    radial-gradient(circle, rgb(70,70,70) 50%, transparent 0);
   border: solid 2px rgb(var(--medium-accent));
   background-size: 0.25em 0.25em;
    }
 
.border-logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://tartar0s.wikidot.com/local--files/theme:rhodes-island/%E8%9A%80%E6%B5%AA.png) center/18% no-repeat;
   filter: brightness(0%) invert(100%);
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
 
.bblock:hover{
color: rgb(121,137,143);
}
#page-info{
color: rgb(var(--medium-accent));
}
 
#license-area{
color: black;
}
 
.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(17,17,17); 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;
}
 
@media only screen and (max-width: 510px) {
.logoblock::after{
    content: "";
    float: center;
    border: solid 2px #0000;
    background: url(http://tartar0s.wikidot.com/local--files/theme:rhodes-island/%E8%9A%80%E6%B5%AA.png) center/30% no-repeat;
   filter: brightness(0%) invert(0%);
    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(http://tartar0s.wikidot.com/local--files/theme:rhodes-island/%E8%9A%80%E6%B5%AA.png) center/30% no-repeat;
   filter: brightness(0%) invert(100%);
    opacity: 0.35;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    z-index: 1;
}
}
 
#footer{
   color: white;
}
 
@keyframes tab-disappear {
  0% { max-height: 9999rem; }
  1% { max-height: 100vh; }
  100% { max-height: 0; }
}
@keyframes tab-appear {
  0% { max-height: 0; }
  99% { max-height: 100vh; }
  100% { max-height: 9999rem; }
}
 
/*未选择的tab*/
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
     transform-origin: 0 0;
}
 
.yui-navset .yui-content > div {
  display: block;
  top: 0;
  overflow: hidden;
  transform-origin: 0 0;
}
 
#page-content .yui-navset .yui-content > div > * {
  transform-origin: 0 0;
}
 
#page-content .yui-navset .yui-content > div[style*="none"] {
  display: block !important;
  flex: 0;
  max-height: 0;
  transition: padding 0s linear 0.5s,
        border-width 0s linear 0.5s,
        flex 0.5s cubic-bezier(.0,1.27,.0,.89) 0s;
  animation: tab-disappear 0.5s ease-in-out 0s 1 both;
}
 
#page-content .yui-navset .yui-content > div[style*="block"] {
  display: block !important;
  flex: 1;
  max-height: 9999rem;
  transition: padding 0s linear 0.5s,
        border-width 0s linear 0.5s,
        flex 0.5s cubic-bezier(.99,.0,.99,.0) 0.5s;
  animation: tab-appear 0.5s ease-in-out 0.5s 1 both;
}
 
div#extrac-div-1 {
       content: "";
   position: absolute;
    top:var(--final-header-height-on-desktop);
    width:100%;
    height:calc(100% - var(--final-header-height-on-desktop));
    background-color: rgb(238,238,238);
    background-size: 5%;
    background-repeat: repeat;
    opacity: 1;
    z-index: -3;
}
@media (max-width: 767px) {
 div#extrac-div-1 {
       content: "";
   position: absolute;
    top:var(--final-header-height-on-desktop);
    width:100%;
    height:calc(100% - var(--final-header-height-on-desktop));
    background-color: rgb(238,238,238);
    background-size: 25%;
    background-repeat: repeat;
    opacity: 1;
    z-index: -3;
 }
 
}
 
blockquote a,.dark-titleblock a,.dark-styled-quote a,.dark-styled-quote-d a,.darkblock a,.border-logoblock a{
color:silver !important;
}
blockquote a:hover,.dark-titleblock a:hover,.dark-styled-quote a:hover,.dark-styled-quote-d a:hover,.darkblock a:hover,.border-logoblock a:hover{
color:silver !important;
}
blockquote a:visited,.dark-titleblock a:visited,.dark-styled-quote a:visited,.dark-styled-quote-d a:visited,.darkblock a:visited,.border-logoblock a:visited{
color:silver !important;
}
 
:root{
  --base-color: rgb(17,17,17);
  --hover-color: rgb(50,50,50);
  --click-color: rgb(50,50,50);
}
 
/* #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;
}
#page-content .collapsible-block-unfolded .collapsible-block-link::before {
    content: "▽";
    border-right: none;
    padding-right: 0rem;
    margin-right: 1rem;
    font-weight: normal;
}
/* 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
}
 
div#page-options-bottom-2 > a, div#page-options-bottom > a {
   color: white;
   border-bottom: solid 2px #F27405;
   background-color: rgb(17,17,17);
}
 
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: rgb(225, 225, 225);
    color: black;
   border-bottom: solid 2px #F27405;
}
 
.opr-text {
color:black;
background: linear-gradient(to top, #CCCCCC, #CCCCCC 85%, rgba(0,0,0,0) 100%);z-index: 5;padding: 2rem 0 0 0;
}
 
.opr-title {
background:#616161;
}
 
.opr-title h1 {
color: white !important;
}

+ 版式代码

@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=Crimson+Text&display=swap');
@import url('https://fonts.googleapis.com/css2?family=STIX+Two+Math&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Zhi+Mang+Xing&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Xanh+Mono:ital@1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mr+Dafoe&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Allura&display=swap');
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url('https://fonts.googleapis.com/css?family=Basic|IBM+Plex+Mono:400,700');
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "captains-crew";
   --theme-name: "Captain's Crew Theme";
 
   --logo-image: url("http://backrooms-sandbox-2.wikidot.com/local--files/captaiin-part-4-diamond-is-unbreakable/crap.png");
   --header-title: "船长帮";
   --header-subtitle: "于黄毯色粼粼之海上航行。";
 
   --body-font: 'STIX Two Math', 'Noto Serif SC', serif;
   --header-font: 'Zhi Mang Xing', 'Mr Dafoe', cursive;
   --title-font: 'Zhi Mang Xing', 'Allura', cursive;
   --mono-font: 'Xanh Mono', monospace;
 
   --dark-brown: 83, 49, 19;
   --darker-brown: 54, 28, 7;
   --light-brown: 186, 161, 123;
   --lighter-brown: 222, 212, 192;
   --green: 90, 107, 58;
   --alt-green: 181, 187, 145;
 
   --white-monochrome: var(--lighter-brown);
   --pale-gray-monochrome: var(--light-brown);
   --light-gray-monochrome: var(--alt-green);
   --gray-monochrome: var(--dark-brown);
   --black-monochrome: var(--darker-brown);
   --bright-accent: var(--darker-brown);
   --medium-accent: var(--dark-brown);
   --dark-accent: var(--green);
   --pale-accent: var(--green);
 
   --swatch-topmenu-border-color: var(--medium-accent);
   --swatch-menubg-dark-color: var(--medium-accent);
 
   --link-color: var(--dark-brown);
   --hover-link-color: var(--dark-brown);
   --visited-link-color: var(--dark-brown);
 
   --rating-module-button-plus-color: var(--darker-brown);
   --rating-module-button-negative-color: var(--darker-brown);
   --rating-module-button-cancel-color: var(--darker-brown);
   --rating-module-button-credit-color: var(--darker-brown);
 
   --sd-border: var(--darker-brown);
   --sd-fill: var(--alt-green);
 
   --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);
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-border:54,28,7;
 
   --sd-symbol:255,255,255;
 
   --sd-text:255,255,255;
 
}
 
#skrollr-body {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url("");
    background-repeat: repeat-1;
    background-size:  inherit;
    background-blend-mode: luminosity;
    background-color: rgba(var(--darker-brown), 0.75);
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#container {
   background-image: radial-gradient(circle, rgb(var(--medium-accent), 0.05) 30%, 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;
}
 
div.yui-navset div.yui-content {
    background: rgb(var(--light-brown));
}
 
div.yui-navset ul.yui-nav a,
div.yui-navset div.yui-navset-top ul.yui-nav a {
    background: rgb(var(--light-brown));
    color: rgb(var(--dark-brown));
}
 
div.yui-navset ul.yui-nav a:hover,
div.yui-navset ul.yui-nav a:focus {
    background: rgb(var(--alt-green));
    color: rgb(var(--green));
}
 
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: rgb(var(--dark-brown));
    color: rgb(var(--light-brown));
}
 
#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.8;
}
 
#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: 1.8rem;
   margin: 0;
   width: 100%;
   display: flex;
   justify-content: center;
   font-size: 25px;
}
 
#header h1 a::before, #header h2 span::before {
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
h1 {
   font-size: 40px;
}
 
h2 {
   font-size: 35px;
}
 
h3 {
   font-size: 30px;
}
 
h4 {
   font-size: 25px;
}
 
h5 {
   font-size: 20px;
}
 
h6 {
   font-size: 15px;
}
 
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
blockquote, div.blockquote {
    border: 2px double rgba(var(--dark-brown));
    background: rgba(var(--light-brown));
    box-shadow: 0.05rem 0.1rem 0.3rem 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.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);
}
 
.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);
}
 
.darkblock, .dark-styled-quote {
      --link-color: var(--light-brown);
   --hover-link-color: var(--light-brown);
   --visited-link-color: var(--light-brown);
}
 
hr {
   background-color: rgba(var(--darker-brown), 0.6);
}
 
.footnotes-footer {
   background-color: rgb(var(--light-brown));
}
 
#search-top-box input.empty:hover {
     color: rgb(var(--alt-green))
}
 
blockquote, .blockquote, .styled-quote, .footnotes-footer {
   --link-color: var(--darker-brown);
   --hover-link-color: var(--darker-brown);
   --visited-link-color: var(--darker-brown);
}
 
code, .code {
   background-color: rgb(var(--alt-green));
}
 
#login-status {
   color: rgb(var(--lighter-brown));
}
 
.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:%23FFC90E;%7D .st1%7Bfill:%23361c07;%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(--alt-green)) !important;
}
 
.header-diamond .diamond-color.class-0 {
   background: rgb(var(--alt-green)) !important;
}
 
.top-box.class-1, .top-box.class-2 {
   background: rgb(var(--light-brown)) !important;
}
 
.header-diamond .diamond-color.class-1,
.header-diamond .diamond-color.class-2 {
   background: rgb(var(--light-brown)) !important;
}
 
.top-box.class-3, .top-box.class-4 {
   background: rgb(var(--dark-brown)) !important;
}
 
.header-diamond .diamond-color.class-3,
.header-diamond .diamond-color.class-4 {
   background: rgb(var(--dark-brown)) !important;
}
 
.top-box.class-5, .top-box.class-unknown {
   background: rgb(var(--darker-brown)) !important;
}
 
.header-diamond .diamond-color.class-5,
.header-diamond .diamond-color.class-unknown {
   background: rgb(var(--darker-brown)) !important;
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Staatliches&display=swap');
@import url('https://fonts.googleapis.com/css2?family=PT+Serif&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');
@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;
}
@import url("http://vivarium.wdfiles.com/local--files/backrooms%3Avivtheme/stylesheet.css");
 
:root {
    --theme-base: "black-highlighter";
    --theme-id: "bntg";
    --theme-name: "B.N.T.G. Theme";
 
    --logo-image: none;
    --header-title: "B.N.T.G.";
    --header-subtitle: "得贸易者得天下。";
 
    --header-font:  'ChillGSans' , 'Staatliches', sans-serif;
    --title-font:  'ChillGSans' , 'Staatliches', sans-serif;
   --body-font: 'Noto Serif SC', PT Serif, serif;
 
    --white-monochrome: 220, 221, 215;
    --pale-gray-monochrome: var(--white-monochrome);
    --light-pale-gray-monochrome: var(--pale-gray-monochrome);
    --light-gray-monochrome: var(--pale-gray-monochrome);
    --gray-monochrome: var(--dark-accent);
    --dark-gray-monochrome: 64, 61, 60;
    --black-monochrome: var(--medium-accent);
    --pale-accent: 232, 231, 213;
    --bright-accent: 86, 108, 90;
    --medium-accent: 102, 102, 102;
    --dark-accent: var(--bright-accent);
 
    --sd-border: var(--dark-gray-monochrome);
    --cecs-accent: var(--medium-accent) !important;
 
    --header-gradient-color-bottom: var(--dark-gray-monochrome);
    --header-gradient-color-middle: var(--dark-gray-monochrome);
    --header-gradient-color-top: var(--dark-gray-monochrome);
    --swatch-menubg-color: var(--pale-gray-monochrome);
    --swatch-topmenu-border-color: var(--dark-accent);
    --link-color: 68, 117, 77;
    --hover-link-color: var(--link-color);
    --visited-link-color: var(--link-color);
 
    --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(--dark-accent);
 
    --gradient-header: repeating-linear-gradient(
      -30deg,
      rgba(var(--dark-gray-monochrome), 0.8),
      rgba(var(--dark-gray-monochrome), 1) 50px
    );
}
 
#container {
   background-image: none;
}
 
#header::before {
   left: -16.5rem;
   background-size: auto 14rem;
}
 
#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);
}
 
.page-rate-widget-box,
.page-rate-widget-box .rate-points,
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown,
.page-rate-widget-box .cancel {
   background: rgb(var(--pale-accent)) !important;
}
 
.yui-navset .yui-nav li,
.yui-navset .yui-navset-top .yui-nav li {
    -webkit-box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
    box-shadow: 0 0 0 0.0625rem rgb(var(--dark-accent));
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
    background-color: rgb(var(--pale-accent));
}
 
.yui-navset .yui-content {
    background-color: rgb(var(--pale-accent));
}
 
.yui-navset .yui-content,
.yui-navset .yui-navset-top .yui-content {
    border-color: rgb(var(--dark-accent));
}
 
div.blockquote, blockquote {
    background-color: rgb(var(--pale-accent));
    border-color: rgb(var(--dark-accent));
    border-style: solid;
}
 
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));
}
 
#side-bar .side-block {
    color: rgb(var(--swatch-text-general));
}
 
#side-bar:hover {
    background:  rgb(var(--pale-accent));
}
 
.scp-image-block {
   border: none;
}
 
.yui-navset .yui-nav .selected,
.yui-navset .yui-navset-top .yui-nav .selected,
.yui-navset .yui-nav .selected a:active,
.yui-navset .yui-nav .selected a:focus {
    background-color: rgb(var(--dark-accent));
}
 
.styled-quote,
.lightblock {
    background-color: rgb(var(--pale-accent));
}
 
.titleblock {
   background-color: rgb(var(--pale-accent));
   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(var(--pale-gray-monochrome));
  padding: 0.25rem 1rem;
  line-height: 0.1rem;
}
 
.footnotes-footer {
    background-color: rgb(var(--pale-accent));
}
 
table.wiki-content-table td,
table.wiki-content-table th {
   border-color: rgb(var(--dark-accent)) !important;
}
 
#account-topbutton {
   border-color: rgb(var(--pale-gray-monochrome));
}
 
#login-status a {
   color: rgb(var(--pale-gray-monochrome));
}
 
hr {
    border-color: rgb(var(--dark-accent));
    background-color: rgb(var(--dark-accent));
}
 
html,
#lock-info,
div.note,
input.checkbox,
input.text,
textarea {
    scrollbar-color: rgba(var(--medium-accent), 0.7) rgba(var(--swatch-tertiary-color), .1);
}
 
body::-webkit-scrollbar-thumb,
html::-webkit-scrollbar-thumb,
input.text::-webkit-scrollbar-thumb,
textarea::-webkit-scrollbar-thumb,
::-webkit-scrollbar-thumb {
    background: rgba(var(--medium-accent), 0.7)
}
 
.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:%23403d3c;%7D .st1%7Bfill:%23403d3c;%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,
.top-box.class-1 {
   background: rgb(var(--pale-accent)) !important;
}
 
.header-diamond .diamond-color.class-0,
.header-diamond .diamond-color.class-1 {
   background: rgb(var(--pale-accent)) !important;
}
 
.top-box.class-2,
 .top-box.class-3 {
   background: rgb(var(--medium-accent)) !important;
}
 
.header-diamond .diamond-color.class-2,
.header-diamond .diamond-color.class-3 {
   background: rgb(var(--medium-accent)) !important;
}
 
.top-box.class-4,
 .top-box.class-5 {
   background: rgb(var(--bright-accent)) !important;
}
 
.header-diamond .diamond-color.class-4,
.header-diamond .diamond-color.class-5 {
   background: rgb(var(--bright-accent)) !important;
}
 
.top-box.class-unknown {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.header-diamond .diamond-color.class-unknown {
   background: rgb(var(--dark-gray-monochrome)) !important;
}
 
.darkblock a,
.dark-styled-quote a {
    color: rgb(var(--pale-accent));
}
 
::selection {
    background: rgba(var(--dark-gray-monochrome), .25);
}
 
.darkblock h1,
.dark-styled-quote h1,
.darkblock h2,
.dark-styled-quote h2,
.darkblock h3,
.dark-styled-quote h3,
.darkblock h4,
.dark-styled-quote h4,
.darkblock h5,
.dark-styled-quote h5 {
    color: rgb(var(--white-monochrome));
}
 
.darkblock hr,
.dark-styled-quote hr {
   border-color: rgb(var(--pale-gray-monochrome));
   background-color: rgb(var(--pale-gray-monochrome));
}
 
.darkblock a.newpage,
.dark-styled-quote a.newpage {
    color: rgb(var(--newpage-color));
}
 
.dark-styled-quote {
    border-color: rgb(var(--pale-accent));
}
 
#header h1, #header h1 a {
   top: 0.5rem;
}
 
#header h2, #header h2 span, #header h2 span::before {
   top: 1.75rem;
}
 
.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(86,108,90); 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(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-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;
}
 
code,
.code {
   background-color: rgb(var(--pale-accent));
}
 
#search-top-box-input,
#search-top-box-form input[type=submit],
#search-top-box-input:focus, #search-top-box-input:hover {
   border-color: rgb(var(--dark-gray-monochrome));
}
 
.scp-image-block .scp-image-caption {
   background-color: rgb(var(--pale-accent));
}
 
#search-top-box-input:focus,
#search-top-box-input:hover {
   color: rgb(var(--swatch-text-general));
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-border:64,61,60;
 
   --sd-symbol:255,255,255;
 
   --sd-text:255,255,255;
 
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=Gemunu+Libre:wght@800&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: "backrooms-robotics";
   --theme-name: "Backrooms Robotics Theme";
 
   --main-accent: 173, 51, 255;
   --text-color: 231, 222, 237;
   --background-color: 67, 60, 72;
   --box-color: 23, 21, 25;
 
   --white-monochrome: var(--text-color);
   --light-gray-monochrome: var(--text-color);
   --gray-monochrome: var(--background-color);
   --black-monochrome: var(--box-color);
   --medium-accent: var(--background-color);
   --dark-gray-monochrome: var(--box-color);
   --bright-accent: var(--main-accent);
   --dark-accent: var(--main-accent);
   --pale-accent: var(--main-accent);
 
   --swatch-topmenu-border-color: var(--main-accent);
   --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);
 
   --sd-border: var(--main-accent);
   --sd-fill: var(--dark-gray-monochrome);
 
   --link-color: var(--main-accent);
   --hover-link-color: var(--main-accent);
   --visited-link-color: var(--main-accent);
 
   --rating-module-button-plus-color: var(--medium-accent);
   --rating-module-button-negative-color: var(--medium-accent);
   --rating-module-button-cancel-color: var(--medium-accent);
   --rating-module-button-credit-color: var(--medium-accent);
 
   --cecs-accent: var(--main-accent) !important;
   --cecs-dark: var(--text-color) !important;
   --cecs-light: var(--box-color) !important;
 
   --logo-image: none;
   --header-title: "后室机器人科技";
   --header-subtitle: "当今的人们，欢迎来到明日的世界。";
 
   --body-font: proxima-nova, 'Noto Sans SC', sans-serif;
   --header-font: 'Gemunu Libre', 'ChillGSans', 'Noto Sans SC', sans-serif;
   --title-font: 'Gemunu Libre', 'ChillGSans', 'Noto Sans SC', sans-serif;
   --mono-font: 'Fantasque Sans Mono', monospace;
 
   --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 {
   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));
   color: rgb(var(--pale-accent));
}
 
h1, #page-title {
   font-size: 225%;
   padding: 0;
}
 
#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));
}
 
.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;
    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));
}
 
/* sd banner colours */
 
.sd-container {
   --sd-border:173, 51, 255;
   --sd-symbol:255,255,255;
   --sd-text:255,255,255;
}
 
.code {
    background-color: rgb(var(--dark-gray-monochrome));
}
 
/*hexagon header gradient*/
#skrollr-body {
     background-size: 12.5rem;
   background-color: rgb(var(--main-accent));
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 304 304' width='304' height='304'%3E%3Cpath fill='%23171519' fill-opacity='1' d='M44.1 224a5 5 0 1 1 0 2H0v-2h44.1zm160 48a5 5 0 1 1 0 2H82v-2h122.1zm57.8-46a5 5 0 1 1 0-2H304v2h-42.1zm0 16a5 5 0 1 1 0-2H304v2h-42.1zm6.2-114a5 5 0 1 1 0 2h-86.2a5 5 0 1 1 0-2h86.2zm-256-48a5 5 0 1 1 0 2H0v-2h12.1zm185.8 34a5 5 0 1 1 0-2h86.2a5 5 0 1 1 0 2h-86.2zM258 12.1a5 5 0 1 1-2 0V0h2v12.1zm-64 208a5 5 0 1 1-2 0v-54.2a5 5 0 1 1 2 0v54.2zm48-198.2V80h62v2h-64V21.9a5 5 0 1 1 2 0zm16 16V64h46v2h-48V37.9a5 5 0 1 1 2 0zm-128 96V208h16v12.1a5 5 0 1 1-2 0V210h-16v-76.1a5 5 0 1 1 2 0zm-5.9-21.9a5 5 0 1 1 0 2H114v48H85.9a5 5 0 1 1 0-2H112v-48h12.1zm-6.2 130a5 5 0 1 1 0-2H176v-74.1a5 5 0 1 1 2 0V242h-60.1zm-16-64a5 5 0 1 1 0-2H114v48h10.1a5 5 0 1 1 0 2H112v-48h-10.1zM66 284.1a5 5 0 1 1-2 0V274H50v30h-2v-32h18v12.1zM236.1 176a5 5 0 1 1 0 2H226v94h48v32h-2v-30h-48v-98h12.1zm25.8-30a5 5 0 1 1 0-2H274v44.1a5 5 0 1 1-2 0V146h-10.1zm-64 96a5 5 0 1 1 0-2H208v-80h16v-14h-42.1a5 5 0 1 1 0-2H226v18h-16v80h-12.1zm86.2-210a5 5 0 1 1 0 2H272V0h2v32h10.1zM98 101.9V146H53.9a5 5 0 1 1 0-2H96v-42.1a5 5 0 1 1 2 0zM53.9 34a5 5 0 1 1 0-2H80V0h2v34H53.9zm60.1 3.9V66H82v64H69.9a5 5 0 1 1 0-2H80V64h32V37.9a5 5 0 1 1 2 0zM101.9 82a5 5 0 1 1 0-2H128V37.9a5 5 0 1 1 2 0V82h-28.1zm16-64a5 5 0 1 1 0-2H146v44.1a5 5 0 1 1-2 0V18h-26.1zm102.2 270a5 5 0 1 1 0 2H98v14h-2v-16h124.1zM242 149.9V160h16v34h-16v62h48v48h-2v-46h-48v-66h16v-30h-16v-12.1a5 5 0 1 1 2 0zM53.9 18a5 5 0 1 1 0-2H64V2H48V0h18v18H53.9zm112 32a5 5 0 1 1 0-2H192V0h50v2h-48v48h-28.1zm-48-48a5 5 0 0 1-9.8-2h2.07a3 3 0 1 0 5.66 0H178v34h-18V21.9a5 5 0 1 1 2 0V32h14V2h-58.1zm0 96a5 5 0 1 1 0-2H137l32-32h39V21.9a5 5 0 1 1 2 0V66h-40.17l-32 32H117.9zm28.1 90.1a5 5 0 1 1-2 0v-76.51L175.59 80H224V21.9a5 5 0 1 1 2 0V82h-49.59L146 112.41v75.69zm16 32a5 5 0 1 1-2 0v-99.51L184.59 96H300.1a5 5 0 0 1 3.9-3.9v2.07a3 3 0 0 0 0 5.66v2.07a5 5 0 0 1-3.9-3.9H185.41L162 121.41v98.69zm-144-64a5 5 0 1 1-2 0v-3.51l48-48V48h32V0h2v50H66v55.41l-48 48v2.69zM50 53.9v43.51l-48 48V208h26.1a5 5 0 1 1 0 2H0v-65.41l48-48V53.9a5 5 0 1 1 2 0zm-16 16V89.41l-34 34v-2.82l32-32V69.9a5 5 0 1 1 2 0zM12.1 32a5 5 0 1 1 0 2H9.41L0 43.41V40.6L8.59 32h3.51zm265.8 18a5 5 0 1 1 0-2h18.69l7.41-7.41v2.82L297.41 50H277.9zm-16 160a5 5 0 1 1 0-2H288v-71.41l16-16v2.82l-14 14V210h-28.1zm-208 32a5 5 0 1 1 0-2H64v-22.59L40.59 194H21.9a5 5 0 1 1 0-2H41.41L66 216.59V242H53.9zm150.2 14a5 5 0 1 1 0 2H96v-56.6L56.6 162H37.9a5 5 0 1 1 0-2h19.5L98 200.6V256h106.1zm-150.2 2a5 5 0 1 1 0-2H80v-46.59L48.59 178H21.9a5 5 0 1 1 0-2H49.41L82 208.59V258H53.9zM34 39.8v1.61L9.41 66H0v-2h8.59L32 40.59V0h2v39.8zM2 300.1a5 5 0 0 1 3.9 3.9H3.83A3 3 0 0 0 0 302.17V256h18v48h-2v-46H2v42.1zM34 241v63h-2v-62H0v-2h34v1zM17 18H0v-2h16V0h2v18h-1zm273-2h14v2h-16V0h2v16zm-32 273v15h-2v-14h-14v14h-2v-16h18v1zM0 92.1A5.02 5.02 0 0 1 6 97a5 5 0 0 1-6 4.9v-2.07a3 3 0 1 0 0-5.66V92.1zM80 272h2v32h-2v-32zm37.9 32h-2.07a3 3 0 0 0-5.66 0h-2.07a5 5 0 0 1 9.8 0zM5.9 0A5.02 5.02 0 0 1 0 5.9V3.83A3 3 0 0 0 3.83 0H5.9zm294.2 0h2.07A3 3 0 0 0 304 3.83V5.9a5 5 0 0 1-3.9-5.9zm3.9 300.1v2.07a3 3 0 0 0-1.83 1.83h-2.07a5 5 0 0 1 3.9-3.9zM97 100a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-48 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 96a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-144a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM49 36a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM33 68a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 240a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm80-176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm112 176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 180a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 84a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'%3E%3C/path%3E%3C/svg%3E");
  height: 11rem;
}
 
/*blend gradient*/
#container {
   background: linear-gradient(180deg, rgba(0,0,0,0) 8.95rem, rgb(var(--main-accent)) 8.95rem, rgb(var(--box-color)) 9.05rem, rgb(var(--box-color)) 10.8rem,  rgb(var(--main-accent)) 10.9rem, rgb(var(--main-accent)) 11rem, rgb(var(--medium-accent)) 11.1rem);
   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;
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-border:173, 51, 255;
 
   --sd-symbol:255,255,255;
 
   --sd-text:255,255,255;
 
}
 
#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;
   top: 1rem;
   margin: 0;
   width: 100%;
   display: flex;
   z-index: 0;
}
 
#header h2, #header h2 span, #header h2 span::before {
   position: absolute;
   top: 2rem;
   margin: 0;
   width: 100%;
   display: flex;
}
 
#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: 0.1rem;
}
 
/*links*/
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
/*line + block*/
hr {
   background: none;
   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));
   }
 
   #container {
      background: linear-gradient(180deg, rgba(0,0,0,0) 7.45rem, rgb(var(--main-accent)) 7.45rem, rgb(var(--box-color)) 7.55rem, rgb(var(--box-color)) 10.45rem,  rgb(var(--main-accent)) 10.55rem, rgb(var(--main-accent)) 10.65rem, rgb(var(--medium-accent)) 10.75rem);
   }
}
 
.styled-quote, .dark-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);
}
 
.lightblock, .darkblock {
   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);
}
 
.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;
}
 
#search-top-box-input:hover,
#search-top-box-input:focus {
    background: rgb(var(--medium-accent));
}
 
.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:%239417e8;%7D .st1%7Bfill:%239417e8;%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;
}

+ 版式代码

:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";
 
   --logo-image: url("http://backrooms-sandbox-2.wikidot.com/local--files/pintheme/hyujh");
   --header-title: "The Backrooms";
   --header-subtitle: " 被血脉而锁死，由知识而放生 ";
 
   --body-font: 'proxima-nova', sans-serif;
   --header-font: 'Gemunu Libre', monospace;
   --title-font: 'hubbali', monospace;
   --mono-font: 'Fantasque Sans Mono', monospace;
 
   --white-monochrome: 77, 66, 66;
   --pale-gray-monochrome: 35, 35, 35;
   --light-gray-monochrome: 195, 155, 155;
   --gray-monochrome: 255, 211, 211;
   --black-monochrome: 255, 200, 200;
   --bright-accent: 255, 177, 177;
   --medium-accent: 117, 91, 91;
   --dark-accent: 217, 169, 169;
   --pale-accent: 255, 255, 255;
   --swatch-headerh1-color: var(--gray-monochrome);
   --swatch-headerh2-color: var(--black-monochrome);
   --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(--dark-accent);
 
   --swatch-topmenu-border-color: var(--white-monochrome);
   --dark-gray-monochrome: var(--swatch-primary-darker);
 
   --link-color: 222, 120, 120;
   --hover-link-color: 222, 120, 120;
 
   --background-gradient-distance: 0rem;
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
hr {
   background-color: rgb(var(--swatch-tertiary-color));
}
 
.styled-quote {
   background-color:rgb(var(--dark-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.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(--light-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);
}
 
/* sd banner colours */
 
.sd-container {
 
--sd-border: var(--dark-gray-monochrome);
 
--sd-bullets: var(--pale-pink-monochrome);
 
--sd-symbol: var(--dark-gray-monochrome);
 
--sd-text: var(--dark-gray-monochrome);
 
}
 
.lightblock {
   background-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);
}
 
.darkblock {
   background-color:rgb(var(--gray-monochrome));
   color:rgb(var(--light-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 a:visited, .dark-styled-quote a:visited {
    color: rgb(255, 179, 179);
}
 
.darkblock a:visited:hover, .dark-styled-quote a:visited:hover {
color: rgb(255, 179, 179);
}
 
.dark-styled-quote a, .darkblock a {
    color: rgb(var(--link-color));
}
 
.code{
   font-family: 'Arvo', serif !important;
}
 
#header::before {
   opacity: 0.6;
}
 
.dark-styled-quote h1, .darkblock h1,
.dark-styled-quote h2, .darkblock h2,
.dark-styled-quote h3, .darkblock h3,
.dark-styled-quote h4, .darkblock h4,
.dark-styled-quote h5, .darkblock h5,
.dark-styled-quote h6, .darkblock h6 {
    color: rgb(var(--light-gray-monochrome));
}
 
#login-status a {
   color: rgb(var(--pale-gray-monochrome));
}

+ 版式代码

/*
   黑骑士主题
   由Hylius创作
 
   基于阈限空间版式
   由Lynch和Etoile创作
   [2020 Wikidot Theme]
 
*/
 
@import url('https://fontlibrary.org/face/fantasque-sans-mono');
@import url("https://scpdsandbox.wikidot.com/local--files/lynchtest/stylesheet.css");
@import url("https://backrooms-sandbox.wikidot.com/local--files/wktest/stylesheet.css");
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "bk";
   --theme-name: "Black Knights Theme";
 
   --logo-image: url("http://backrooms-sandbox.wdfiles.com/local--files/theme%3Abk/BKLOGO.png");
   --header-title: "wbZu ⠀⠀⠀ xNeh";
   --header-subtitle: "与正直同行。";
 
   --body-font: Droid Sans, "Noto Sans SC", sans-serif;
   --header-font: 'runic_lossregular', "Noto Sans SC", monospace;
   --title-font: 'Droid Sans', "Noto Sans SC",monospace;
   --mono-font: 'Droid Sans Mono', "Noto Serif SC",  monospace;
 
   --white-monochrome: 5, 5, 5;
   --pale-gray-monochrome: 0, 150, 150;
   --light-gray-monochrome: 0, 100, 100;
   --gray-monochrome: 0, 69, 60;
   --black-monochrome: 200, 200, 200;
   --bright-accent: 0, 255, 255;
   --medium-accent: 0, 200, 200;
   --dark-accent: 0, 200, 200;
   --pale-accent: 0, 200, 200;
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 0, 255, 255;
   --hover-link-color: 0, 255, 255;
 
   --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:
    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;
}
 
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;
}
 
blockquote {
   box-shadow: 0.05rem 0.1rem 0.3rem 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.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);
}
 
 /* sd banner colours */
 
.sd-container {
 
   --sd-text:222,222,222;
 
   --sd-border:var(--gray-monochrome);
 
   --sd-bullets:var(--gray-monochrome);
 
   --sd-symbol:var(--gray-monochrome);
 
}
 
.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(--swatch-menubg-medium-color));
}
 
.loss {
  font-family: 'runic_lossregular';
  font-size: 2em;
}
 
.gain {
  font-family: 'wkrunesregular';
  font-size: 2em;
}

+ 版式代码

@import url('http://scpsandboxcn.wikidot.com/local--files/typeface/Typeface-LXGW-WenKai.css');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+SC&display=swap');
@import url('http://scpsandboxcn.wikidot.com/local--files/typeface/Typeface-Huiwen-Mincho.css');
:root {
   --theme-base: "black-highlighter";
   --theme-id: "liminal";
   --theme-name: "Liminal Theme";
 
   --logo-image: url("http://backrooms-sandbox-2.wdfiles.com/local--files/papasnowy/s-l300.png");
   --header-title: "";
   --header-subtitle: "欢迎，人类";
 
   --body-font: 'LXGW WenKai', serif;
   --header-font: 'Huiwen-mincho', serif;
   --title-font: 'Huiwen-mincho', serif;
   --mono-font: 'Noto Sans SC', serif;
 
   --white-monochrome: 89, 89, 89;
   --pale-gray-monochrome: 64, 64, 64;
   --light-gray-monochrome: 128, 128, 128;
   --gray-monochrome: 32, 32, 32;
   --black-monochrome: 179, 179, 179;
   --bright-accent: 140, 136, 126;
   --medium-accent: 26, 26, 26;
   --dark-accent: 255, 255, 255;
   --pale-accent: 150, 136, 126;
   --swatch-headerh1-color: var(--dark-accent);
   --swatch-headerh2-color: var(--dark-accent);
 
   --swatch-topmenu-border-color: var(--medium-accent);
 
   --link-color: 66, 0, 33;
   --hover-link-color: 205, 0, 101;
 
   --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:
    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;
}
 
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;
}
 
#page-title {
   font-family: 'Huiwen-mincho', serif;
}
 
#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;
}
 
/* sd banner colours */
 
.sd-container {
   --sd-text:255,255,255;
   --sd-symbol:var(--sd-text);
   --sd-bullets:var(--sd-text);
}
#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 {
   font-family: 'Huiwen-mincho', cursive;
   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 #660000;
}
 
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);
}
 
.styled-quote {
   background-color:rgb(var(--dark-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.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(--light-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);
}
 
.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(--light-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 a:visited, .dark-styled-quote a:visited {
    color: rgb(var(184, 0, 92));
}
 
.darkblock a:visited:hover, .dark-styled-quote a:visited:hover {
color: rgb(var(255, 102, 179));
}
 
.code{
   font-family: 'Noto Sans SC', serif !important;
}
 
 /* sd banner colours */
.sd-container {
   --sd-text:255,255,255;
   --sd-symbol:var(--sd-text);
   --sd-bullets:var(--sd-text);
}

+ 版式代码

:root {
   --theme-base: "black-highlighter";
   --theme-id: "dark-liminal";
   --theme-name: "Dark Liminal Theme";
 
   --logo-image: url("http://backrooms-wiki.wikidot.com/local--files/component:theme/logo.svg");
   --header-title: "The Backrooms";
   --header-subtitle: "你曾经来过这里";
 
    --body-font: Inter, Noto Sans SC, Arimo, Verdana, Geneva, sans-serif;
    --header-font: Inter, Noto Sans SC, Franklin Gothic Medium, Franklin Gothic, ITC Franklin Gothic, Arial, sans-serif;
    --title-font: var(--header-font);
    --mono-font: Recursive, 幼圆, Noto Serif SC, Consolas, monaco, monospace;
 
   --white-monochrome: 18, 22, 32;
   --pale-gray-monochrome: 0, 4, 15;
   --light-gray-monochrome: 95, 95, 95;
   --gray-monochrome: 183, 186, 195;
   --black-monochrome: 230, 235, 239;
   --bright-accent: 115, 119, 129;
   --medium-accent: 183, 186, 195;
   --dark-accent: 115, 119, 129;
   --pale-accent: 115, 119, 129;
   --dark-gray-monochrome: 207, 207, 203;
   --light-pale-gray-monochrome: 11, 11, 11;
   --very-light-gray-monochrome: 40, 40, 40;
 
   --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);
}
 
#skrollr-body {
   background-image:
    radial-gradient(circle, rgb(var(--pale-gray-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(--pale-gray-monochrome), 0.40) 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;
}
 
#footer{
   color: rgb(var(--pale-gray-monochrome));
}
 
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), .25);
}
 
#top-bar div.top-bar > ul > li > a,
#top-bar div.mobile-top-bar > ul > li > a {
   color: rgb(var(--black-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.5rem solid rgba(var(--gray-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 {
   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 0.2rem 0.3rem rgba(0,0,0,.25);
}
 
.dark-styled-quote a{
color: rgb(var(--swatch-menubg-medium-color));
}
 
.darkblock {
   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));
}
 
.lightblock {
   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);
}
 
.darkerblock {
   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,0,0,.25);
   color: rgb(var(--black-monochrome));
}
 
.darkblock a {
color: rgb(var(--swatch-menubg-medium-color));
}
 
/* sd banner colours */
 
.sd-container {
 
   --sd-border:var(--white-monochrome);
 
   --sd-text:222,222,222;
 
   --sd-symbol:var(--sd-text);
 
   --sd-bullets:var(--sd-text);
 
    --sd-symbol: var(--sd-border) !important;
    --sd-symbol-secondary: 255, 255, 255;
 
}
 
#side-bar .side-block div a img {
    filter: invert(calc(230/255));
}

+ 版式代码

:root {
   --theme-base: "black-highlighter";
   --theme-id: "archway-os";
   --theme-name: "Archway OS Theme";
 
   --logo-image: url("https://scpsandboxcn.wikidot.com/local--files/lupus-caeruleus/archway_new.png");
   --header-title: "||拱廊系统||";
   --header-subtitle: "万物皆虚。";
 
   --body-font: proxima-nova, 'Noto Sans SC', sans-serif;
   --header-font: 'Noto Serif SC', serif;
   --title-font: 'Noto Serif SC', serif;
   --mono-font: 'Fantasque Sans Mono', 'Noto Serif SC', monospace;
 
   --mainAccent: 0,99,255;
 
   --white-monochrome: 237, 233, 223;
   --pale-gray-monochrome: 255, 251, 240;
   --light-gray-monochrome: 160, 160, 160;
   --dark-gray-monochrome: 160, 160, 160;
   --gray-monochrome: 72, 69, 60;
   --black-monochrome: 0, 0, 0;
   --bright-accent: var(--mainAccent);
   --medium-accent: 1, 0, 102;
   --dark-accent: var(--mainAccent);
   --pale-accent: var(--mainAccent);
   --alt-accent: 255, 215, 0;
 
    --swatch-topmenu-border-color: var(--mainAccent);
    --swatch-topmenu-bg-color: var(--dark-gray-monochrome);
    --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-headerh1-color: var(--alt-accent);
  --swatch-headerh2-color: var(--alt-accent);
 
   --link-color: 255, 215, 0;
   --hover-link-color: 255, 215, 0;
   --visited-link-color: 255, 215, 0;
   --newpage-color: 255, 215, 0;
 
   --background-gradient-distance: 0rem;
   /*--gradient-topmenu: none;*/
   --diagonal-stripes: ;
   /*--gradient-header: repeating-linear-gradient(0deg, #010066, #010066 0.1rem, #1435a5 0.15rem, #1435a5 0.25rem);*/
 
}
 
#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, 140, 36) 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("https://scpsandboxcn.wdfiles.com/local--files/lupus-caeruleus/archway-os-backrooms.png");
 background-repeat: repeat-x;
background-size: inherit;
}
 
#container {
   background-image: none;
}
 
/*option buttons hover textbox border color*/
#odialog-hovertips{
    border-color: rgb(var(--pale-accent));
}
 
/*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: double 4px white;
   color: rgb(var(--alt-accent));
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
#side-bar div.menu-item {
   border-color: rgba(var(--bright-accent), 0.4);
}
 
#side-bar div.menu-item > :not(:nth-child(2)):not(.collapsible-block) {
   border-color: rgba(var(--bright-accent), 0.4);
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 
#footer{
   color: rgb(var(--black-monochrome));
}
 
/*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;
}
 
/*image block*/
 
.scp-image-block {
    border: 4px double rgb(255, 255, 255);
    outline: 6px solid rgb(var(--dark-gray-monochrome));
    background-color: rgb(var(--dark-gray-monochrome));
    margin: 6px 6px calc(1em + 6px) calc(2em + 6px) !important;
}
 
.scp-image-block .scp-image-caption {
    background-color: rgb(var(--dark-gray-monochrome));
    color: black;
    border-top: 4px double rgb(255, 255, 255);
}
 
/*module rate*/
.page-rate-widget-box {
    border: 4px double rgb(255, 255, 255);
    outline: 6px solid rgb(var(--dark-gray-monochrome));
    background-color: rgb(var(--dark-gray-monochrome));
    margin: 6px;
}
 
/*header stuff*/
 
h1, h2, h3, h4, h5, h6 {
   color: rgb(var(--alt-accent));
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
}
 
#header {
  background-image: none;
}
 
#header::before {
   content: "";
   position: absolute;
   height: 100%;
   width: 100%;
   left: 0rem;
   top: -1rem;
   background-image: var(--logo-image);
   background-size: auto 7.8rem;
   background-position: left;
   background-repeat: no-repeat;
   opacity: 1;
}
 
#header h1, #header h1 a {
   position: absolute;
   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;
   top: 1.8rem;
   width: 100%;
   display: flex;
   justify-content: left;
}
 
#header h1 a::before, #header h2 span::before {
   margin-left: 8.2rem;
   text-shadow: .063rem 0.1rem 0.1rem #0c0c0c;
   letter-spacing: 0.3rem;
}
 
#header h1 a::before{
   letter-spacing: 0.5rem;
   margin: 0;
   margin-left: 8.2rem;
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a {
   color: rgb(0, 0, 0);
}
 
.yui-navset .yui-nav a,
.yui-navset .yui-navset-top .yui-nav a,
.yui-navset .yui-nav a:focus,
.yui-navset .yui-nav a:hover {
   color: rgb(255, 255, 255);
}
 
.scp-image-caption,
.yui-navset .yui-nav a,
blockquote,
.blockquote,
table.wiki-content-table th {
   color: rgb(0, 0, 0);
}
 
/*links*/
a.newpage {
   background: transparent;
   text-decoration: none
}
 
a.newpage {
   color: rgb(var(--newpage-color))
}
 
a{
text-decoration: underline;
}
 
/*line + block*/
hr {
background: transparent;
border-top: double 4px white;
}
 
blockquote,
.blockquote,
div.blockquote,
[class*="blockquote"] {
    border: 4px double rgb(255, 255, 255);
    outline: 6px solid rgb(var(--dark-gray-monochrome));
   background-color: rgb(var(--dark-gray-monochrome));
    color: black;
    margin: 1em 46px;
    padding: 0 1em;
}
 
/*search*/
#search-top-box-input{
background: rgb(var(--medium-accent));
}
 
/* 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(0, 0, 0);
}
 
/*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 h1 a::before{
   letter-spacing: 0.2rem;
}
 
blockquote,
.blockquote,
div.blockquote,
[class*="blockquote"] {
    margin-left: 0;
    margin-right: 0;
    }
 
#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 a::before, #header h2 span::before {
   margin-left: 5.8rem;
 
}
 
#header h1 a::before{
   margin-left: 5.8rem;
}
}
 
.borderblock{
   background-color: rgb(var(--dark-gray-monochrome));
   color: rgb(var(--black-monochrome));
   border: 0.5rem solid 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);
}
 
.borderblock hr{
   border-color: rgb(255, 255, 255);
}
 
.red, .red .blockquote, .red blockquote{
border-color: rgb(173, 0, 0);
}
 
.red hr{
border-color: rgb(173, 0, 0);
}
 
.teal, .teal .blockquote, .teal blockquote{
border-color: rgb(0,128,129);
}
 
.teal hr{
border-color: rgb(0,128,129);
}
 
.purple, .purple .blockquote, .purple blockquote{
border-color: rgb(177,0,177);
}
 
.purple hr{
border-color: rgb(177,0,177);
}
 
.green, .green .blockquote, .green blockquote{
border-color: rgb(0,176,0);
}
 
.green hr{
border-color: rgb(0,176,0);
}
 
.yellow, .yellow .blockquote, .yellow blockquote{
border-color: rgb(176, 158, 0);
}
 
.yellow hr{
border-color: rgb(176, 158, 0);
}
}
 
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);
}

+ 版式代码

@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
@import url(https://fonts.googleapis.com/css?family=Long+Cang&display=swap);
 
:root {
   --theme-base: "black-highlighter";
   --theme-id: "amor-incrementum";
   --theme-name: "Amor Incrementum Theme";
 
   --logo-image: url("");
   --header-title: "神爱之繁生";
   --header-subtitle: "与我们一同享受自然的爱抚";
 
   --body-font: 'Noto Serif SC', serif;
   --header-font: 'ZCOOL XiaoWei', sans-serif;
   --title-font: 'Long Cang', sans-serif;
   --mono-font: 'Noto Serif SC', serif;
 
   --dark-green: 100, 138, 88;
   --darker-green: 81, 110, 72;
   --light-green: 163, 190, 134;
   --lighter-green: 231, 249, 207;
   --brown: 77, 69, 59;
   --alt-green: 181, 203, 158;
 
   --white-monochrome: var(--lighter-green);
   --pale-gray-monochrome: var(--light-green);
   --light-gray-monochrome: var(--brown);
   --gray-monochrome: var(--dark-green);
   --black-monochrome: var(--brown);
   --bright-accent: var(--brown);
   --medium-accent: var(--dark-green);
   --dark-accent: var(--brown);
   --pale-accent: var(--brown);
 
   --swatch-topmenu-border-color: var(--medium-accent);
   --swatch-menubg-dark-color: var(--medium-accent);
 
   --link-color: var(--dark-green);
   --hover-link-color: var(--dark-green);
   --visited-link-color: var(--dark-green);
 
   --rating-module-button-plus-color: var(--darker-green);
   --rating-module-button-negative-color: var(--darker-green);
   --rating-module-button-cancel-color: var(--darker-green);
   --rating-module-button-credit-color: var(--darker-green);
 
   --sd-border: var(--brown);
   --sd-fill: var(--dark-green);
 
   --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-sandbox-2.wikidot.com/local--files/captaiin-part-4-diamond-is-unbreakable/amor%20incrementum");
    background-repeat: repeat-1;
    background-size:  inherit;
    background-blend-mode: luminosity;
    background-color: rgba(var(--light-green), 0.75);
}
 
#side-bar .side-block div a img {
   filter: grayscale(100%);
}
 /* sd banner colours */
.sd-container {
   --sd-border:69,61,51;
   --sd-symbol:255,255,255;
   --sd-text:255,255,255;
}
#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;
}
 
div.yui-navset div.yui-content {
    background: rgb(var(--alt-green));
}
 
div.yui-navset ul.yui-nav a,
div.yui-navset div.yui-navset-top ul.yui-nav a {
    background: rgb(var(--light-green));
    color: rgb(var(--brown));
}
 
div.yui-navset ul.yui-nav a:hover,
div.yui-navset ul.yui-nav a:focus {
    background: rgb(var(--alt-green));
    color: rgb(var(--brown));
}
 
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: rgb(var(--dark-green));
    color: rgb(var(--light-green));
}
 
#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, div.blockquote {
    border: 2px double rgba(var(--dark-green));
    background: rgba(var(--light-green));
    box-shadow: 0.05rem 0.1rem 0.3rem rgba(0,0,0,.25);
}
 
/* sd横幅颜色 */
 
.sd-container {
 
   --sd-border:69,61,51;
 
   --sd-symbol:255,255,255;
 
   --sd-text:255,255,255;
 
}
 
.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.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);
}
 
.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);
}
 
.darkblock, .dark-styled-quote {
      --link-color: var(--light-green);
   --hover-link-color: var(--light-green);
   --visited-link-color: var(--light-green);
}
 
hr {
   background-color: rgba(var(--brown), 0.6);
}
 
.footnotes-footer {
   background-color: rgb(var(--light-green));
}
 
#search-top-box input.empty:hover {
     color: rgb(var(--alt-green))
}
 
blockquote, .blockquote, .styled-quote, .footnotes-footer {
   --link-color: var(--darker-green);
   --hover-link-color: var(--darker-green);
   --visited-link-color: var(--darker-green);
}
 
code, .code {
   background-color: rgb(var(--alt-green));
}
 
#login-status {
   color: rgb(var(--lighter-green));
}
 
.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:%23FFC90E;%7D .st1%7Bfill:%234D453B;%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(--alt-green)) !important;
}
 
.header-diamond .diamond-color.class-0 {
   background: rgb(var(--alt-green)) !important;
}
 
.top-box.class-1, .top-box.class-2 {
   background: rgb(var(--light-green)) !important;
}
 
.header-diamond .diamond-color.class-1,
.header-diamond .diamond-color.class-2 {
   background: rgb(var(--light-green)) !important;
}
 
.top-box.class-3, .top-box.class-4 {
   background: rgb(var(--dark-green)) !important;
}
 
.header-diamond .diamond-color.class-3,
.header-diamond .diamond-color.class-4 {
   background: rgb(var(--dark-green)) !important;
}
 
.top-box.class-5, .top-box.class-unknown {
   background: rgb(var(--darker-green)) !important;
}
 
.header-diamond .diamond-color.class-5,
.header-diamond .diamond-color.class-unknown {
   background: rgb(var(--darker-green)) !important;
}