/* Basic Mode */
:root {
/* Basic Colors */
--background-color: 237, 237, 255;
--text-color: 20, 20, 33;
/* Deco Colors */
--light-color-1: var(--background-color);
--light-color-2: 255, 255, 255;
--dark-color-1: 135, 170, 230;
--dark-color-2: 0, 53, 145;
--dark-color-3: 70, 100, 180;
--dark-color-4: 48, 48, 79;
/* Link Colors */
--link-color: var(--dark-color-2);
--hover-link-color: var(--dark-color-1);
--visited-link-color: var(--dark-color-3);
--newpage-color: 160, 100, 180;
/* Select Colors */
--selected-background-color: var(--dark-color-1), .5;
/* Scrollbar Colors */
--scrollbar-color: var(--dark-color-3), 0.75;
/* Note Colors */
--note-background-color: var(--light-color-1), .75;
--note-text-color: var(--text-color);
--note-border-color: var(--dark-color-2);
/* General Colors */
--general-dark-border-color: var(--dark-color-2);
/* Topbar Colors */
--topbar-hover-border-color: var(--dark-color-1), 0.5;
/* User Account Colors */
--header-username-color: var(--dark-color-1);
--account-button-text-color: var(--general-dark-text-color);
--account-button-hover-text-color: var(--general-medium-text-color);
--account-button-background-color: var(--general-medium-background-color);
--account-button-hover-background-color: var(--general-dark-background-color);
--account-drop-text-color: var(--general-dark-text-color);
--account-drop-background-color: var(--general-medium-background-color);
--account-drop-hover-background-color: var(--general-dark-background-color);
--account-drop-border-color: var(--general-medium-border-color);
/* Page Tag Colors */
--page-tag-hover-background-color: var(--general-medium-background-color);
/* Footer Colors */
--license-background-color: var(--general-medium-background-color);
--license-text-color: var(--general-medium-text-color);
/* Sidebar Colors */
--sidebar-handle-background-color: var(--general-medium-background-color);
--sidebar-media-background-color: var(--text-color), 0;
--sidebar-media-icon-color: var(--dark-color-2);
--sidebar-title-background-color: var(--general-medium-background-color);
/* Image Block Colors */
--imageblock-caption-background-color: var(--general-medium-background-color);
--imageblock-caption-text-color: var(--general-dark-text-color);
--imageblock-border-color: var(--general-dark-border-color);
/* Header & Horizon Colors */
--hr-color: var(--dark-color-2);
/* Tabview Colors */
--tabview-hover-button-background-color: var(--general-dark-background-color);
--tabview-selected-button-background-color: var(--general-medium-background-color);
/* Tabel Colors */
--table-border-color: var(--general-dark-border-color);
--table-background-color: var(--light-color-2);
/* Blockquote Colors */
--blockquote-background-color: var(--light-color-1), .75;
--blockquote-border-color: var(--general-dark-border-color);
/* Rating Module Colors */
--rating-background-color: var(--light-color-1);
--rating-cancel-color: var(--dark-color-2);
/* Popups Colors */
--popup-title-background-color: var(--general-medium-background-color);
/* Thread Colors */
--thread-accent-color: var(--light-color-1);
/* The 4 */
--darkblock-background-color: var(--general-medium-background-color);
--dark-styled-quote-background-color: var(--general-medium-background-color);
/* Header Vs */
--main-header-height-on-mobile: 10rem;
--logo-image: url(https://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipb);
--header-title: "速切玩家";
--header-subtitle: "只为更快，只为通关";
--header-title-font-size-on-mobile: 1.8rem;
--header-subtitle-font-size-on-mobile: 0.8rem;
/* Content Vs */
--body-width: 54rem;
--body-margin: max(calc((100% - var(--body-width)) / 2), 0rem);
/* Popup Vs */
--popup-loading-content: "速切玩家祈祷中……";
}
html {
background: unset;
}
body {
background-image: repeating-linear-gradient(135deg, rgb(var(--light-color-1)) 0, rgb(var(--light-color-1)) 2rem, rgba(var(--light-color-2), .2) 2rem,rgba(var(--light-color-2), .4) 4rem);
background-attachment: fixed;
}
#header {
background: unset;
}
#header::before {
background-image: none;
}
#extra-div-1 {
display: block;
width: 100%;
position: absolute;
height: 17.5rem;
left: 0;
top: 0;
background-color: rgb(var(--dark-color-4));
clip-path: polygon(0 0, 100% 0, 100% calc(100% - 6.5rem), 0 100%);
z-index: -3;
}
#extra-div-2 {
display: block;
width: 100%;
position: absolute;
height: 15.5rem;
left: 0;
top: 0;
background: linear-gradient(to bottom right, rgb(var(--dark-color-4)), rgb(var(--dark-color-2)));
clip-path: polygon(0 0, 100% 0, 100% calc(100% - 5rem), 0 100%);
z-index: -2;
}
#extra-div-3 {
display: block;
width: 100%;
position: absolute;
height: 5rem;
left: 0;
top: 0;
background: linear-gradient(to bottom, rgb(var(--dark-color-3)), rgb(var(--dark-color-2)));
position: absolute;
clip-path: polygon(0 0, 100% 0, 100% calc(100% - 2.5rem), 0 100%);
z-index: -1;
}
#extra-div-4 {
display: block;
width: 100%;
position: absolute;
height: 10.5rem;
left: 0;
bottom: 0;
background-color: rgb(var(--dark-color-2));
clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 5rem);
z-index: -1;
}
#extra-div-5 {
display: block;
width: 100%;
position: absolute;
height: 12.5rem;
left: 0;
bottom: 0;
background-color: rgb(var(--dark-color-4));
clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 6rem);
z-index: -2;
}
a#account-topbutton, #search-top-box-form .button {
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
#header h1 a {
perspective: 50rem;
}
#header h1 a span {
width: fit-content;
margin: auto;
justify-content: flex-start;
transform: rotateY(10deg) translate3d(3.5rem, 2rem, 15rem);
padding: 0;
}
#header h2 span {
perspective: 10rem;
filter: drop-shadow(-0.5rem 0 0 rgba(var(--dark-color-3), .9)) drop-shadow(-0.5rem 0 0 rgba(var(--dark-color-1), .9));
}
#header h2 span::before {
background-size: 100% auto;
background-position: center -2.5rem;
opacity: 1;
width: 15rem;
height: 9.5rem;
margin: auto;
display: block;
transform: rotateY(10deg) translate3d(-6rem, 0rem, 2rem);
pointer-events: none;
clip-path: polygon(0 0, 100% 0, 100% 95%,60% 85%, 60% 83%, 0 100%);
}
@media only screen and (max-width: 1024px) {
#header h1 a span {
justify-content: center;
transform: rotateY(10deg) translate3d(2rem, 0.5rem, 12.5rem);
padding: 0;
}
#header h2 span::before {
width: 12.5rem;
clip-path: unset;
transform: rotateY(10deg) translate3d(-5rem, 1rem, 2rem);
}
}
#top-bar {
background: linear-gradient(150deg, rgb(var(--dark-color-4)), rgb(var(--dark-color-2)));
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
#main-content {
margin-top: 1rem;
padding: 1rem;
background: rgb(var(--general-light-background-color));
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
@media only screen and (max-width: 1024px) {
#main-content {
margin-top: 0;
}
}
div.rate-box-with-credit-button, div.page-rate-widget-box, div.creditButtonStandalone, .yui-navset, table.wiki-content-table, .scp-image-block, blockquote, .blockquote, .lightblock, .darkblock, .styled-quote, .dark-styled-quote, div.wiki-note, div[id*=page-options-bottom] > a, #wd-editor-toolbar-panel a, .edit-help-34 a, .change-textarea-size a, #lock-info, div.buttons input, input.button, button, file, a.button, a.action-area-close, #view-diff-div > p > a {
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
div.rate-box-with-credit-button, div.page-rate-widget-box, div.creditButtonStandalone {
border: rgba(var(--rating-border-color)) solid 0.15rem;
}
div.creditBottomRate div.page-rate-widget-box {
border-bottom: rgba(var(--rating-border-color)) solid 0.15rem;
}
.darkblock {
--link-color: var(--dark-color-1);
}
.styled-quote-d {
background: rgba(var(--styled-quote-background-color));
color: rgba(var(--styled-quote-text-color));
border-left: rgba(var(--styled-quote-border-color)) solid 0.6rem;
border-right: rgba(var(--styled-quote-border-color)) solid 0.6rem;
margin: 1rem 0;
padding: 0.5rem 1rem;
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
.dark-styled-quote-d {
--h1-color: var(--dark-styled-quote-text-color);
--h2-color: var(--dark-styled-quote-text-color);
--h3-color: var(--dark-styled-quote-text-color);
--h4-color: var(--dark-styled-quote-text-color);
--h5-color: var(--dark-styled-quote-text-color);
--h6-color: var(--dark-styled-quote-text-color);
--link-color: var(--dark-color-1);
background: rgba(var(--dark-styled-quote-background-color));
color: rgba(var(--dark-styled-quote-text-color));
border-left: rgba(var(--dark-styled-quote-border-color)) solid 0.6rem;
border-right: rgba(var(--dark-styled-quote-border-color)) solid 0.6rem;
margin: 1rem 0;
padding: 0.5rem 1rem;
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
.borderblock {
background: rgba(var(--styled-quote-background-color));
color: rgba(var(--styled-quote-text-color));
border: rgba(var(--styled-quote-border-color)) solid 0.3rem;
margin: 1rem 0;
padding: 0.5rem 1rem;
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
.dark-borderblock {
--h1-color: var(--dark-styled-quote-text-color);
--h2-color: var(--dark-styled-quote-text-color);
--h3-color: var(--dark-styled-quote-text-color);
--h4-color: var(--dark-styled-quote-text-color);
--h5-color: var(--dark-styled-quote-text-color);
--h6-color: var(--dark-styled-quote-text-color);
--link-color: var(--dark-color-1);
background: rgba(var(--dark-styled-quote-background-color));
color: rgba(var(--dark-styled-quote-text-color));
border: rgba(var(--dark-styled-quote-border-color)) solid 0.3rem;
margin: 1rem 0;
padding: 0.5rem 1rem;
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
.logoblock {
position: relative;
}
.logoblock::after {
content: "";
background-image: url(https://backroomssandboxcn.wikidot.com/local--files/collab:theme:speednoclippers/speednoclippers.svg);
background-position: center;
background-size: auto 100%;
background-repeat: no-repeat;
opacity: 0.25;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
pointer-events: none;
}
.noclipblock {
position: relative;
}
.noclipblock::after {
content: "";
background-image: url(https://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipb);
background-position: -7.5vh center;
background-size: auto 250%;
background-repeat: no-repeat;
opacity: 0.25;
top: 0;
left: 0;
bottom: 0;
right: 0;
position: absolute;
pointer-events: none;
}
.darkblock.noclipblock::after {
background-image: url(https://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipw);
}
.noclipblock.r::after {
background-position: calc(100% + 7.5vh) center;
}
.shadowblock {
background: rgba(var(--light-color-1));
color: rgba(var(--styled-quote-text-color));
margin: 1rem 0;
padding: 0.5rem 1rem;
box-shadow: 0.5rem 0.5rem rgb(var(--dark-color-2));
}
.inset-shadowblock {
background: rgba(var(--styled-quote-background-color));
color: rgba(var(--styled-quote-text-color));
margin: 1rem 0;
padding: 0.5rem 1rem;
box-shadow: inset 4.5rem 1rem rgba(var(--dark-color-1),.5), inset 8rem 2rem rgba(var(--dark-color-1),.5), 0 0 0.5rem rgba(var(--text-color), .4);
}
.nchr {
height: 2rem;
background-image: url("http://backrooms-wiki-cn.wikidot.com/local--files/theme:speednoclippers/noclipb");
background-size: 2rem;
background-position: center;
margin: 1.5rem;
background-repeat: no-repeat;
}
.pager {
border-bottom: rgba(var(--general-button-background-color)) solid 0.2rem;
}
.pager a:is(:hover, :active, :focus, :focus-within) {
background: rgba(var(--general-hover-button-background-color));
}
.pager .current {
background: rgba(var(--general-button-background-color));
}
#new-post-form {
background-color: rgba(var(--edit-area-background-color));
color: rgba(var(--edit-area-text-color));
padding: 1rem;
}
#new-post-form .form {
margin: 0 !important;
width: 100%;
}
#new-post-form .form td:first-child {
display: none;
}
#new-post-form .form td:last-child {
padding: 0;
}
#new-post-div input.text {
border: none;
color: rgba(var(--edit-area-textarea-text-color));
background: rgba(var(--edit-area-textarea-background-color));
margin: 0;
padding: 0.2em 0.5em;
width: 100%;
box-sizing: border-box;
outline: none;
transition: box-shadow var(--general-transition-time-slow);
font-weight: 900;
}
#new-post-div textarea#np-text {
width: 100% !important;
color: rgba(var(--edit-area-textarea-text-color));
background: rgba(var(--edit-area-textarea-background-color));
font-size: 0.95rem;
outline: none;
box-sizing: border-box;
border: none;
transition: box-shadow var(--general-transition-time-slow);
}
#new-post-div input.text:focus-visible,
#new-post-div textarea#np-text:focus-visible {
box-shadow: 2px 2px 0 rgba(var(--edit-area-textarea-border-color)), -2px 2px 0 rgba(var(--edit-area-textarea-border-color)), -2px -2px 0 rgba(var(--edit-area-textarea-border-color)), 2px -2px 0 rgba(var(--edit-area-textarea-border-color));
}
.wd-editor-toolbar-panel {
margin: 1rem 0;
display: flex;
flex-direction: column;
grid-gap: 0.5rem;
}
.wd-editor-toolbar-panel div {
display: flex;
flex-wrap: wrap;
grid-gap: 0.5rem;
width: 100%;
justify-content: center;
height: auto;
}
.wd-editor-toolbar-panel div > ul {
display: contents;
}
.wd-editor-toolbar-panel div > ul li {
display: block;
width: 2rem;
height: 2rem;
}
.wd-editor-toolbar-panel div > ul > li.hseparator {
display: none;
}
.wd-editor-toolbar-panel ul li:hover ul {
border: 2px solid rgba(var(--edit-area-hover-button-background-color));
}
.wd-editor-toolbar-panel ul li a {
width: 100%;
height: 100%;
background: rgba(var(--edit-area-button-background-color));
transition: background var(--general-transition-time-fast);
box-shadow: 0 0 0.5rem rgba(var(--text-color), .4);
}
.wd-editor-toolbar-panel ul li a:is(:hover, :active, :focus, :focus-within) {
background: rgba(var(--edit-area-hover-button-background-color));
}
.wd-editor-toolbar-panel ul li a::before {
content: "";
display: block;
width: 100%;
height: 100%;
-webkit-mask-image: var(--edit-area-toolbar-icon-mask);
mask-image: var(--edit-area-toolbar-icon-mask);
background: rgba(var(--edit-area-button-text-color));
-webkit-mask-position: center;
mask-position: center;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: 75%;
mask-size: 75%;
}
.wd-editor-toolbar-panel ul li a:is(:hover, :active, :focus, :focus-within)::before {
background: rgba(var(--edit-area-hover-button-text-color));
}
::-moz-selection {
color: inherit;
}
::selection {
color: inherit;
}
#edit-page-textarea {
padding: 0;
}
.owindow.owait .content {
transform: skewX(15deg);
}
