/*
    Lampeter Theme (Warm)
    [2025 Wikidot Theme]
    By HaydenSaintPascal
    Based on:
       Generic Space Theme by EstrellaYoshte
*/

@import url('https://fonts.googleapis.com/css2?family=Special+Elite&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Crimson+Text:ital,wght@0,400;0,600;0,700;1,400;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Martian+Mono:wght@300;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=ZCOOL+XiaoWei&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@100;300;400;500;700;900&display=swap');

:root {
    --header-title: "兰彼得";
    --header-subtitle: "跨维度后勤部";

    --sp_area-max-width: 67.25rem;
    --sp_side-bar-width: 14.675rem;

    --sp_header-logo: url(https://scp-wiki.wikidot.com/local--files/theme:lampeter-warm/lampeterlogo);
    --sp_header-height: calc(22.5rem + 14.5vw);
    --sp_header-title-scale: 1.375;
    --sp_header-subtitle-scale: 1.75;

    --sp_top-bar-height: 2.25rem;
    --sp_top-bar-link-color: rgb(var(--lampeter-harshneon));
    --sp_top-bar-link-hover-color: rgb(var(--lampeter-sicklyneon));
    --sp_top-bar-link-hover-background: rgb(var(--lampeter-gentleneon) / 0.175);
    --sp_dropdown-background: rgb(var(--lampeter-night) / 0.625);
    --sp_dropdown-link-hover-color: rgb(var(--lampeter-night));
    --sp_dropdown-link-hover-background: rgb(var(--lampeter-harshneon));
    --sp_dropdown-link-border: none;
    --sp_dropdown-link-color: var(--sp_top-bar-link-color);

    --sp_rate-module-background: rgb(var(--lampeter-night));
    --sp_rate-module-text-color: rgb(var(--lampeter-sicklyneon));
    --sp_rate-module-sub-color: rgb(var(--lampeter-gentleneon));
    --sp_rate-module-active-color: rgb(var(--lampeter-harshneon));
    --sp_rate-module-button-color: rgb(var(--lampeter-sicklyneon));
    --sp_rate-module-button-background: transparent;
    --sp_rate-module-button-hover-color: rgb(var(--lampeter-night));
    --sp_rate-module-button-hover-background: rgb(var(--lampeter-harshneon));

    --sp_tab-text-color: rgb(var(--lampeter-foglight));
    --sp_tab-background: rgb(var(--lampeter-night));
    --sp_tab-hover-text-color: rgb(var(--lampeter-harshneon));
    --sp_tab-hover-background: var(--sp_tab-background);
    --sp_tab-selected-text-color: rgb(var(--lampeter-night));
    --sp_tab-selected-background: rgb(var(--lampeter-harshneon));

    --lampeter-header-layer-0: url(https://scp-wiki.wikidot.com/local--files/theme:lampeter-warm/Lampeterlayer0.png);
    --lampeter-header-layer-1: url(https://scp-wiki.wikidot.com/local--files/theme:lampeter-warm/lampeterlayer1.png);
    --lampeter-footer-bg: url(https://scp-wiki.wikidot.com/local--files/theme:lampeter-warm/lampeterfooter.png);
    --lampeter-tunnel: 37 21 28;
    --lampeter-night: 51 35 46;
    --lampeter-foglight: 255 255 255;
    --lampeter-harshneon: 236 148 19;
    --lampeter-neon: 234 181 47;
    --lampeter-sicklyneon: 255 191 165;
    --lampeter-gentleneon: 229 214 157;
    --lampeter-velvet: 44 20 28;

    --lampeter-trainengine-mask:  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800' class='si-glyph si-glyph-train' viewBox='0 -0.5 17 17'%3E%3Cpath d='M5.979 12.484a1.48 1.48 0 0 0-2.956 0l-.003.02a1.48 1.48 0 1 0 2.96 0l-.001-.02ZM10.998 12.454a1.484 1.484 0 0 0-1.494-1.433c-.814 0-1.473.64-1.492 1.433a.197.197 0 0 0-.004.034c0 .81.67 1.467 1.496 1.467.828 0 1.498-.657 1.498-1.467 0-.01-.004-.023-.004-.034ZM14.998 12.454a1.484 1.484 0 0 0-1.494-1.433c-.814 0-1.473.64-1.492 1.433a.197.197 0 0 0-.004.034c0 .81.67 1.467 1.496 1.467.828 0 1.498-.657 1.498-1.467 0-.01-.004-.023-.004-.034Z' class='si-glyph-fill'/%3E%3Cpath d='M16.938 12.98c0-.965-.922-1.971-.922-1.971h-.047V8.015h-.984v-3l-1.962.024v3l-1.054-.024V6.036h-.953v1.979H7.969V4.953h1V3H1.016v1.938h1v5.125H1.03v2.922h.979a2.621 2.621 0 0 1-.048-.48c0-.012.005-.033.005-.033a2.54 2.54 0 0 1 2.535-2.513 2.54 2.54 0 0 1 2.537 2.513c0 .01.006.021.006.033 0 .164-.02.324-.049.48h8.975v-.004h.968v-.001ZM6 8.041H3.992V4.969H6v3.072Z' class='si-glyph-fill'/%3E%3C/svg%3E");

    --lampeter-traincar-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' width='256' height='256' viewBox='-4.57 -4.57 54.81 54.81'%3E%3Cpath d='M44.167 24.798c-.829 0-1.5.67-1.5 1.5v.076H42V14.497a3 3 0 0 0-3-3H6.667a3 3 0 0 0-3 3v11.877H3v-.076c0-.83-.671-1.5-1.5-1.5s-1.5.67-1.5 1.5v1.576c0 .83.671 1.5 1.5 1.5h2.583A3 3 0 0 0 6.1 30.813a4.268 4.268 0 0 0 4.165 3.357 4.211 4.211 0 0 0 2.784-1.062 4.236 4.236 0 0 0 2.785 1.062 4.263 4.263 0 0 0 4.144-3.299h5.711a4.262 4.262 0 0 0 4.145 3.299 4.218 4.218 0 0 0 2.785-1.062 4.234 4.234 0 0 0 2.785 1.062 4.267 4.267 0 0 0 4.164-3.357 3.01 3.01 0 0 0 2.017-1.439h2.583c.829 0 1.5-.67 1.5-1.5v-1.576a1.501 1.501 0 0 0-1.501-1.5zm-33.902 6.377a1.265 1.265 0 1 1-.002-2.53 1.265 1.265 0 0 1 .002 2.53zm5.569 0a1.265 1.265 0 1 1-.002-2.53 1.265 1.265 0 0 1 .002 2.53zm9.284-11.271H7.992a1 1 0 0 1 0-2h17.126a1 1 0 0 1 0 2zm0-3.196H7.992a1 1 0 0 1 0-2h17.126a1 1 0 0 1 0 2zm4.716 14.467a1.265 1.265 0 1 1-.002-2.53 1.265 1.265 0 0 1 .002 2.53zm5.57 0a1.266 1.266 0 1 1-.002-2.532 1.266 1.266 0 0 1 .002 2.532zm.56-4.877H29.57c-.554 0-1-.447-1-1s.446-1 1-1h6.394a1 1 0 1 1 0 2zm0-3.196H29.57a1 1 0 1 1 0-2h6.394a1 1 0 0 1 0 2zm0-3.198H29.57a1 1 0 1 1 0-2h6.394a1 1 0 0 1 0 2zm0-3.196H29.57a1 1 0 1 1 0-2h6.394a1 1 0 0 1 0 2z'/%3E%3C/svg%3E");

    --lampeter-railsign-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='800' fill='none' viewBox='0 0 24 24'%3E%3Cg stroke='%23292929' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.5' clip-path='url(%23a)'%3E%3Ccircle cx='12' cy='11.999' r='9'/%3E%3Cpath d='m15 9-6 6M9 9l6 6'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h24v24H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");

    --lampeter-letter-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 48 48'%3E%3Cpath fill='none' d='M0 0h48v48H0z'/%3E%3Cpath d='M42.371 8.8A3.955 3.955 0 0 0 40 8H8c-.89 0-1.705.304-2.371.8L24 27.172 42.371 8.8z'/%3E%3Cpath d='M4 12.828V36c0 2.2 1.8 4 4 4h32c2.2 0 4-1.8 4-4V12.828l-20 20-20-20z'/%3E%3C/svg%3E");

    --header-font: "ZCOOL XiaoWei", "Crimson Text", serif;
    --body-font: "Noto Serif SC", "Playfair Display", serif;
    --mono-font: 'Martian Mono', monospace;
}

body {
    font-family: var(--body-font);
    font-size: 0.925rem;
    font-weight: 475;
    color: rgb(var(--lampeter-foglight));
    background-color: rgb(var(--lampeter-night));
    background-size: calc(50rem + 20%);
    background-attachment: fixed;
}
body, li, p { line-height: 1.5; }

tt, .page-source, .code, pre {
    font-family: var(--mono-font);
}
tt, .page-source, .code {
    font-size: 0.85em;
}

::selection {
    background-color: rgb(var(--lampeter-neon) / 0.925);
    color: rgb(var(--lampeter-foglight));
}

/*---------- SCROLLBAR ----------*/

::-webkit-scrollbar {
  width: 0.5rem;
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgb(var(--lampeter-harshneon));
  border: none;
}
::-webkit-scrollbar-track {
  background: rgb(var(--lampeter-tunnel));
}

:root {
    scrollbar-color: rgb(var(--lampeter-harshneon)) rgb(var(--lampeter-tunnel));
    scrollbar-width: thin;
}

/*--------- HEADER ----------*/

#extrac-div-1 {
    pointer-events: none;
    z-index: -2;
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: var(--sp_final-header-height);
    background-image: var(--lampeter-header-layer-0);
    background-size: cover;
    background-position: top +200rev;
    background-attachment: fixed;
}
#extrac-div-1::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    height: 100%; width: 100%;
    background-color: rgb(var(--lampeter-harshneon) / 10%);
}
#extrac-div-1 > span {
    display: block;
    position: absolute; top: 0; left: 0;
    width: 100%;  height: 100%;
    background-image: var(--lampeter-header-layer-1);
    background-position: center bottom;
    background-size: cover;
    background-repeat: no-repeat;
}
#extrac-div-1::after {
    content: "";
    position: absolute;
    top: 100%; left: 0;
    height: 42rem; width: 100%;
    background: linear-gradient(to bottom, rgb(var(--lampeter-tunnel)) 5%, rgb(var(--lampeter-tunnel) / 0));
}
/* fuck u safari */
@supports (-webkit-hyphens:none) {
#extrac-div-1 {
     background-attachment: scroll;
}
}

#header {
    background: none;
    grid-template-areas:
        ". login login ."
        ". . search ."
        ". h1 h1 ."
        ". h2 h2 ."
        "… ."
        "top-bar top-bar top-bar top-bar";
    grid-template-rows: auto 1fr auto auto 1.25fr auto;
}
#header::before {
    background-size: contain;
    align-self: end;
    grid-column: 2/4; grid-row: 2/3;
    height: calc(100% - 0.5rem);
    width: 100%;
    mix-blend-mode: hard-light;
}

#header h1, #header h2 {
    padding-inline-start: 0;
    padding-top: 10px;
    text-align: center;
}
#header h1 a {
    font-family: var(--header-font);
    font-weight: 400;
    text-shadow: none;
}
#header h2  span {
    color: rgb(var(--lampeter-sicklyneon));
    text-shadow: none;
}

/*--------- LOGIN ----------*/

#login-status { color: inherit; }
#login-status a {
    color: rgb(var(--lampeter-harshneon));
}

a#account-topbutton {
    margin: 0;
    border: none;
    position: relative;
    display: inline-block;
    padding: 0.175rem;
    width: 0.95rem;
    color: transparent;
    background-color: rgb(var(--lampeter-neon) / 0.25);
}
a#account-topbutton::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    box-sizing: border-box;
    width: 100%; height: 100%;
    background-color: rgb(var(--lampeter-harshneon));
    -webkit-mask-image: var(--lampeter-trainengine-mask);
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-image: var(--lampeter-trainengine-mask);
    mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    transform: scale(0.875);
}

#account-options {
    border: none;
    text-align: center;
    width: 10.5em;
    background: rgb(var(--lampeter-night));
}
#account-options li a {
    color: rgb(var(--lampeter-harshneon));
    padding: 0.375rem 0.5rem;
}
#account-options li a:is(:hover,:focus) {
    color: rgb(var(--lampeter-foglight));
    background-color: rgb(var(--lampeter-neon) / 0.325);
    text-decoration: none;
}

/*--------- SEARCH ----------*/

#search-top-box {
    grid-area: search;
    align-self: self-start;
    margin-block-start: 0.625rem;
}

#search-top-box-form input[type='submit'].btn {
    border-radius: 0;
    box-shadow: none;
    background: rgb(var(--lampeter-night));
    color: rgb(var(--lampeter-gentleneon));
    border: solid 0.05rem currentColor;
}
#search-top-box-form input[type='submit'].btn:is(:hover,:focus) {
    color: rgb(var(--lampeter-sicklyneon));
}

/*--------- TOP BAR ----------*/

#top-bar {
    background: none;
}
#top-bar div[class*="top-bar"] > ul {
    justify-content: center;
}
#top-bar div[class*="top-bar"] > ul > li { flex-grow: 1; }
#top-bar div[class*="top-bar"] > ul > li >a  {
    text-transform: uppercase;
}

#top-bar :is(.top-bar, .mobile-top-bar) ul li ul {
    border: none;
    box-shadow: none;
    -webkit-backdrop-filter: blur(0.125rem);
    backdrop-filter: blur(0.125rem);
}

#top-bar :is(.top-bar, .mobile-top-bar) ul li ul li a {
    padding: 0.5em 0.675em;
    text-align: center;
    font-weight: bold;
}

/*--------- SIDE BAR ----------*/

div#side-bar {
    align-self: flex-start;
    background-color: rgb(var(--lampeter-night));
    padding: 0;
}

:is(#side-bar, #interwiki) .side-block {
    background-color: transparent !important;
    box-shadow: none;
    border: none;
    border-radius: 0;
    margin: 0;
    padding: .5rem 0.675rem;
}
#side-bar .side-block.media {
    background-color: rgb(var(--lampeter-gentleneon) / 0.375);
}
#side-bar .side-block.resources {
    background-color: rgb(var(--lampeter-harshneon) / 0.175);
}

:is(#side-bar, #interwiki) .heading {
    color: rgb(var(--lampeter-gentleneon));
    font-family: var(--header-font);
    border-bottom: solid 0.05rem currentColor;
    padding-left: 0;
    margin-top: 0;
    margin-bottom: 0.25rem;
    text-align: center;
    font-size: 0.875em;
    font-weight: normal;
}

#side-bar a, #interwiki a { color: rgb(var(--lampeter-harshneon)); }

#side-bar a:visited { color: rgb(var(--lampeter-harshneon)); }

/*----------------------------------------*/

#top-bar .open-menu a {
    border: 0.1rem solid rgb(var(--lampeter-gentleneon));
    color: transparent;
    border-radius: 0;
    background-color: rgb(var(--lampeter-velvet));
    padding: 0.175rem;
}
:where(#top-bar .open-menu a)::before {
    content: "";
    position: absolute;
   top: 50%; left: 50%;
    box-sizing: border-box;
    width: 2rem; height: 2rem;
    background-color: rgb(var(--lampeter-gentleneon));
    -webkit-mask-image: var(--lampeter-trainengine-mask);
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-image: var(--lampeter-trainengine-mask);
    mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    transform: translate(-50%, -42.5%);
}

div.scpnet-interwiki-wrapper {
    margin: 0;
}

/*--------- OWINDOW ----------*/

.owindow {
    border: none;
    background-color: rgb(var(--lampeter-night));
}
.owindow .title {
    cursor: initial;
    padding: 0.375rem 0.675rem;
    background-color: rgb(var(--lampeter-neon) / 0.125);
    height: auto;
}

/*--------- RATE ----------*/

:not(.rate-box-with-credit-button) > div.page-rate-widget-box,
div.rate-box-with-credit-button {
    border-radius: 0;
    padding: 0;
    box-shadow: none;
    border-bottom: solid 0.05em rgb(var(--lampeter-sicklyneon));
}

.page-rate-widget-box :is(.rateup, .ratedown, .cancel) a {
    display: block;
    height: 100%;
    width: 0.95em;
    text-align: center;
}

div.creditButton p a {
    border: none;
    padding: 0;
    --sp_rate-module-text-color: rgb(var(--lampeter-gentleneon));
    --sp_rate-module-button-hover-color:  rgb(var(--lampeter-harshneon));
}

div.creditRate:has(div.creditButtonStandalone) {
    display: flex;
    align-items: center;
    justify-content: end;
}

div.creditButtonStandalone p a{
    background-color: var(--sp_rate-module-background);
    border: none;
    padding: 0.075em;
    margin-right: 0;
    align-items: center; /* centered the elements for CN rating module */
    border-radius: 0;
    padding: 0;
    box-shadow: none;
    border-bottom: solid 0.05em rgb(var(--lampeter-sicklyneon));
    color: rgb(var(--lampeter-gentleneon));
    font-size: 0.925rem;
}

div.creditButtonStandalone p a:is(:hover, :focus) {
  background-color: #33232e;
  color: rgb(var(--lampeter-harshneon))
}

.fader {
    background-color: rgb(var(--lampeter-tunnel) / 0.625);
}
div.modalbox {
    background: rgb(var(--lampeter-night));
    padding: 0.25rem 0.75rem;
    border: none;
    border-radius: 0;
    box-shadow: none;
    display: flex;
    flex-direction: column;
}
.modalbox hr {
    margin: 0;
    --hr-icon-size: 2.5rem;
}
.modalbox > .credit {
    margin: 0.5rem;
}

/*--------- TABS----------*/

.yui-navset .yui-nav {
    border-bottom: solid 0.125rem rgb(var(--lampeter-harshneon));
    font-family: var(--header-font);
}

.yui-navset .yui-content {
    border: none;
    position: relative;
    padding: 0.375rem 0.75rem;
    background-color: rgb(var(--lampeter-tunnel) / 0.325);
    box-shadow: 0 0 .675rem .125rem rgb(var(--lampeter-harshneon) / 0.05);
}

.yui-navset.yui-navset-top .yui-nav li { flex-grow: 1; }
.yui-navset.yui-navset-top .yui-nav li a {
    border: none;
    padding: 0.575rem;
}

/*--------- CODE ----------*/

.code {
    background: rgb(var(--lampeter-night));
    border: none;
}
.hl-code,
.hl-default,
.hl-brackets,
.hl-quotes,
.hl-string,
.hl-identifier {
    color: rgb(var(--lampeter-foglight));
}
.hl-special {
    color: rgb(var(--lampeter-neon));
}
.hl-number {
    color: rgb(var(--lampeter-sicklyneon));
}
.hl-reserved {
    color: rgb(var(--lampeter-harshneon));
}

/*--------- LINK ----------*/

:any-link { color: rgb(var(--lampeter-harshneon)); }
a:visited { color: rgb(var(--lampeter-neon)); }

/*--------- PAGE ELEMENT ----------*/

#page-title, .meta-title {
    color: rgb(var(--lampeter-sicklyneon));
    font-weight: bold;
    font-family: var(--header-font);
    border-color: currentColor;
}

h1,h2,h3,h4,h5,h6 {
    color: rgb(var(--lampeter-gentleneon));
    font-weight: bold;
    font-family: var(--header-font);
}

blockquote, div.blockquote, #toc {
    background-color: rgb(var(--lampeter-velvet));
    border: none;
    padding: 0.25rem 1.325rem;
    margin: 1em calc(1em + 1vw);
}

blockquote, div.blockquote {
    position: relative;
    min-height: 2rem;
}

blockquote strong, div.blockquote strong {
    color: #e5d69d;
}

:where(blockquote, div.blockquote)::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    box-sizing: border-box;
    width: 100%; height: 100%;
    border: solid 0.1rem rgb(var(--lampeter-gentleneon));
    clip-path: polygon(100% 0, 100% 100%, 0 100%, 0 1.425rem, 1.425rem 0);
    pointer-events: none;
}
:where(blockquote, div.blockquote)::after {
    content: "";
    position: absolute;
    top: 0; left: 0;
    box-sizing: border-box;
    width: 2rem; height: 2rem;
    background-color: rgb(var(--lampeter-gentleneon));
    -webkit-mask-image: var(--lampeter-letter-mask);
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-image: var(--lampeter-letter-mask);
    mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    transform: translate(-50%, -42.5%);
}

table.wiki-content-table :is(th,td) {
    border-color: rgb(var(--lampeter-neon));
}
table.wiki-content-table th {
    background-color: rgb(var(--lampeter-neon));
    color: rgb(var(--lampeter-night));
}

div.letterless {
    background-color: rgb(var(--lampeter-velvet));
    border: solid 1px rgb(var(--lampeter-gentleneon));
    padding: 0.25rem 1.325rem;
    position: relative;
    min-height: 2rem;
}

/*--------- HR ----------*/

hr {
    --hr-icon-mask: var(--lampeter-traincar-mask);
    --hr-icon-size: 3.75rem;
    margin: .5rem 0;
    background: transparent;
    height: var(--hr-icon-size);
    display: grid;
    place-items: center;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr;
}
hr::before, hr::after {
    content: "";
    display: grid;
    grid-column: 1/2;
    grid-row: 1/2;
    background-color: rgb(var(--lampeter-sicklyneon));
}
hr::before {
    height: 0.05rem;
    width: 100%;
    -webkit-mask-image: linear-gradient(90deg, black calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% + var(--hr-icon-size)/2 + 0.125rem), black calc(50% + var(--hr-icon-size)/2 + 0.125rem));
    mask-image: linear-gradient(90deg, black calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% - var(--hr-icon-size)/2 - 0.125rem), transparent calc(50% + var(--hr-icon-size)/2 + 0.125rem), black calc(50% + var(--hr-icon-size)/2 + 0.125rem));
}

hr::after {
    width: var(--hr-icon-size);
    height: var(--hr-icon-size);
    -webkit-mask-image: var(--hr-icon-mask);
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    mask-image: var(--hr-icon-mask);
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

/*--------- IMAGE BLOCK ----------*/

.scp-image-block {
    border: none;
    box-shadow: none;
    position: relative;
    padding: 0.5rem;
    box-sizing: border-box;
    background: rgb(var(--lampeter-velvet));
    -webkit-backdrop-filter: blur(0.125rem);
    backdrop-filter: blur(0.125rem);
}
.scp-image-block.block-left { margin-left: 0; }
.scp-image-block.block-right { margin-right: 0; }

.scp-image-block::before {
    content: "";
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    border: solid 0.1rem rgb(var(--lampeter-gentleneon));
    box-sizing: border-box;
    pointer-events: none;
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 1.325rem), calc(100% - 1.325rem) 100%, 0 100%);
}
.scp-image-block::after {
    content: "";
    position: absolute;
    bottom: 0; right: 0;
    width: 2rem; height: 2rem;
    background-color: rgb(var(--lampeter-gentleneon));
    -webkit-mask-image: var(--lampeter-railsign-mask);
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-image: var(--lampeter-railsign-mask);
    mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    transform: translate(46.5%, 46.5%);
}

.scp-image-block .scp-image-caption {
    background-color: transparent;
    border: none;
    padding: 0;
    padding-top: 0.25rem;
    color: rgb(var(--lampeter-gentleneon));
    font-weight: normal;
    font-size: .95em;
}

:is(.footnotes-footer, .bibitems) .title {
    color: rgb(var(--lampeter-gentleneon));
    font-family: var(--header-font);
    font-size: 1.5em;
}

.hovertip {
    padding: 0.375rem;
    --sp_hovertip-background: rgb(var(--lampeter-night) / 0.5);
    --sp_hovertip-border: none;
    -webkit-backdrop-filter: blur(0.25rem);
    backdrop-filter: blur(0.25rem);
}

/*--------- MISC ----------*/

textarea, input.text {
    background-color: rgb(var(--lampeter-night));
    color: inherit;
}

#lock-info {
    font-family: var(--mono-font);
    font-size: 0.825em;
    border: none;
    background-color: rgb(var(--lampeter-night));   
}

div.buttons input, input.button, button, a.button, .owindow .button-bar a {
    font-family: var(--mono-font);
    font-size: 0.925em;
    margin: 0.125rem;
    padding: 0.25rem 0.675rem;
    text-decoration: none;
    background-color: rgb(var(--lampeter-night) / 0.375);
    border: solid 0.05rem currentColor;
    color: rgb(var(--lampeter-gentleneon));
    cursor: pointer;
}
:is(div.buttons input, input.button, button, a.button, .owindow .button-bar a):is(:hover,:focus) {
    color: rgb(var(--lampeter-sicklyneon));
    background-color: rgb(var(--lampeter-sicklyneon) / 0.175);
    font-weight: bold;
}

#main-content .page-tags span {
    border-color: rgb(var(--lampeter-sicklyneon));
}

.page-source {
    border: none;
    background: rgb(Var(--lampeter-night) / 0.575);
}

.inline-diff :is(del,ins) {
    color: rgb(var(--lampeter-tunnel));
}

table.page-files .highlight { background: transparent; }

#action-area a.action-area-close {
    color: rgb(var(--lampeter-sicklyneon));
    background-color: transparent;
}

#who-rated-page-area span:not(.printuser) {
    color: inherit!important;
}

/*--------- BOTTOM AREA ----------*/

#footer {
    position: relative;
    background-color: transparent;
    color: rgb(var(--lampeter-foglight));
    margin-top: 56.25vw;
    overflow: unset;
    isolation: isolate;
}
#footer .options a {
    color: rgb(var(--lampeter-gentleneon));
}

#footer::before {
    content: "";
    position: absolute;
    bottom: 0; left: 0;
    height: 56.25vw; width: 100%;
    background-image: var(--lampeter-footer-bg);
    background-size: cover;
    background-position: center top;
    z-index: -1;
    pointer-events: none;
}

#license-area, #footer-bar {
    color: inherit;
    background-color: rgb(var(--lampeter-tunnel));
    padding-block: 0.95rem;
}

/*--------- MOBILE QUERY ----------*/

@media screen and (max-width: 767px) {
    #header {
        grid-template-rows: auto 1.5fr auto auto 1fr auto;
    }

    #top-bar div[class*="top-bar"] > ul > li {
        position: static;
    }
    #top-bar :is(.top-bar, .mobile-top-bar) ul li ul li a {
        padding: 0.75em 0.675em;
    }
}