第一个一级居民区（异化世界观）

+ 版式代码

:root {
    --firstAccent: 69, 226, 50;
    --secondAccent: 15, 53, 15;
 
    --white-monochrome: 32, 32, 32;
    --pale-gray-monochrome: 39, 39, 39;
    --light-gray-monochrome: var(--firstAccent);
    --gray-monochrome: var(--secondAccent);
    --black-monochrome: var(--firstAccent);
    --bright-accent: 148, 136, 126;
    --medium-accent: 39, 39, 39;
    --dark-accent: 140, 136, 126;
    --pale-accent: 140, 136, 126;
    --swatch-topmenu-border-color: var(--medium-accent);
    --link-color: 230, 23, 68;
    --hover-link-color: 230, 23, 68;
    --background-gradient-distance: 0rem;
    --gradient-header: linear-gradient(to bottom, rgba(0,0,0) 0%, rgba(var(--black-monochrome), 0.90) 100% );
    --swatch-text-secondary-color: 255, 255, 255;
    --swatch-text-primary-color: 255, 255, 255;
    --swatch-headerh1-color: 255, 255, 255;
    --swatch-headerh2-color: 255, 255, 255;
}
#footer {
    background: rgb(var(--pale-gray-monochrome,100,3,15));
}
#login-status a {
    color: rgb(var(--black-monochrome));
}
#login-status {
    border-radius: 5px;
    background-color: rgb(var(--medium-accent));
    padding: 5px;
    border: 2px solid rgb(var(--black-monochrome));
}
#skrollr-body {
    background-image: none;
}
#top-bar>ul>li>:after, #top-bar>ul>li>:before {
    position: absolute;
    transition: width .3s cubic-bezier(.4,0,.2,1);
    background-color: rgba(var(--black-monochrome),.5);
    width: 0;
    height: .1875rem;
    pointer-events: none;
    content: " ";
}
#search-top-box-form input[type=submit], #search-top-box-form input[type=submit]:focus, #search-top-box-form input[type=submit]:hover {
    box-shadow: none;
    background: #64030f;
    background: rgb(var(--medium-accent));
    color: #fcfcfc;
    color: rgb(var(--black-monochrome));
}
#account-options {
    background-color: rgb(var(--white-monochrome));
    display: none;
}
#account-options li a:hover {
    color: rgb(255, 255, 255);
    text-decoration: none;
}
#header::before {
    content: "";
    margin-top: -13px;
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    background-image: var(--logo-image);
    background-size: auto 16rem;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0.5;
}
div#page-options-bottom-2 > a, div#page-options-bottom > a {
    border: 2px solid rgb(var(--black-monochrome));
    background-color: rgb(var(--pale-gray-monochrome));
}
div#page-options-bottom-2 > a:hover, div#page-options-bottom > a:hover {
    border: 2px solid rgb(var(--black-monochrome));
    background-color: rgb(var(--white-monochrome));
}
.owindow .button-bar a, a.button, button, div.buttons input, file, input.button {
    border: .125rem solid rgba(var(--black-monochrome,48,48,52),1);
    background-color: rgba(var(--pale-gray-monochrome,100,3,15),1);
}
.owindow .button-bar a:hover, a.button:hover, button:hover, div.buttons input:hover, file:hover, input.button:hover {
    border: .125rem solid rgba(var(--black-monochrome,48,48,52),1);
    background-color: rgba(var(--white-monochrome,100,3,15),1);
}
.top-box {
   filter: grayscale(100%);
}
.bottom-box {
   filter: grayscale(100%) brightness(2);
}
.scp-image-block.block-right {
    border-radius: 5px;
    background-color: rgb(var(--medium-accent));
    padding: 5px;
    border: 2px solid rgb(var(--black-monochrome));
    width: 300px;
}
@media only screen and (max-width: 768px) {
     #header::before {
          margin-top: 0;
     }
     #login-status {
          border-radius: 0px;
          background-color: transparent;
          padding: 0px;
          border: none;
    }
}
.yui-navset .yui-nav .selected a {
    border: 2px solid rgb(var(--black-monochrome));
}
.yui-navset-bottom .yui-nav li a, .yui-navset-top .yui-nav li a, .yui-navset .yui-nav li a {
    border: 2px solid rgb(var(--black-monochrome));
}
hr {
    height: 0;
}
.yui-navset .yui-nav a:focus, .yui-navset .yui-nav a:hover {
    background-color: rgb(var(--white-monochrome));
    color: rgb(var(--black-monochrome));
}
#top-bar div.mobile-top-bar>ul>li>a:after, #top-bar div.mobile-top-bar>ul>li>a:before, #top-bar div.top-bar>ul>li>a:after, #top-bar div.top-bar>ul>li>a:before {
    background-color: rgba(var(--black-monochrome),.5);
}

等待编辑，以上代码勿删