基金會月刊 第088期

您正在查詢的標題為:關注組織
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:機動特遣隊
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:基金會設施
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:人物檔案
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:世界線中心頁
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:系列檔案室
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:競賽資料庫
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:異常物品紀錄
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:超常事件紀錄
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:未解明地點列表
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部

您正在查詢的標題為:基金會故事
在多個資料庫中發現符合該標題的文件
請選擇欲查詢的資料來源,或按此取消

scp-logo-zh.svg
繁中原創
scp-logo-en-400.png
主站翻譯

scp-logo-ru.svg
俄文分部
scp-logo-ko-400.png
韓文分部
scp-logo-cn-400.png
中國分部
scp-logo-fr-400.png
法文分部
scp-logo-pl.svg
波蘭分部
scp-logo-es.svg
西語分部
scp-logo-th.svg
泰文分部
scp-logo-dach-400.png
德文分部
scp-logo-it.svg
義語分部
scp-logo-ua.svg
烏克蘭分部
scp-logo-pt-400.png
葡語分部
scp-logo-cs.svg
捷克分部
scp-logo-vn-400.png
越南分部
評分: +1+x

這是什麼

這是些被我,CroquemboucheCroquembouche,使用在許多頁面上的各種「改進用」CSS代碼,因為我認為它能讓我更輕易地去處理問題。

這個組件做出了一些小小的調整,使得人們能得到更為舒適的書寫體驗,並且在編篡組件/外觀主題時也能更加輕鬆一點(我很常這麼覺得)。對於讀者來說,這沒有對任何可看的部分做出任何的變化 —— 真正有感的是寫的人。

我並不期望有使用該組件的文章在被翻譯過後也跟著使用這個組件,除非譯者喜歡這個組件並無論如何都想要使用它。

這個組件基本上不會與其它的組件或外觀主題相互衝突,而若即便發生了,那可能也不會造成顯著的影響。

使用方法

在任何頁面上加入以下的代碼:

[[include :scp-zh-tr:component:croqstyle]]

這個組件是設計給其它的組件所使用的。如果你在其它組件裡使用到的話,請確保將其添加在那個組件的[[iftags]]區塊裡面,這樣你組件的使用者就不會被迫跟著使用Croqstyle了。

相關組件

其它的個人設計組件(也是做出了一些改動):

個人設計主題(對整體外觀做了大幅調整):

CSS修改

合理化大小的腳註

讓有比較多內容的腳註不再會有十萬八千里那麼長,讓你可以真正意義上地去讀它們了。

.hovertip { max-width: 400px; }

等寬字體式編輯/編碼

讓你的編輯文字視窗套用等寬字體,並同時將Fira Code作為所有等寬字體使用的字型,那顯然比原本的還要更加優越。

@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@400;700&display=swap');
 
:root { --mono-font: "Fira Code", Cousine, monospace; }
#edit-page-textarea, .code pre, .code p, .code, tt, .page-source { font-family: var(--mono-font); }
.code pre * { white-space: pre; }
.code *, .pre * { font-feature-settings: unset; }

打字機體的背景顏色

為<tt>元素({{text}})添加了淡灰色的背景,讓代碼片段能在文中較為突顯出來。

tt {
  background-color: var(--swatch-something-bhl-idk-will-fix-later, #f4f4f4);
  font-size: 85%;
  padding: 0.2em 0.4em;
  margin: 0;
  border-radius: 6px;
}

大臉照退散

停用了當你把游標懸浮於某人的頭像上時會顯示放大版圖片的功能,因為那很蠢而且相當煩人,如果真的想要看較大的圖片只需要點一下就好了。

.avatar-hover { display: none !important; }

斷斷續續

所有被包覆在nobreak這個class的div裡面的文字,將會以每個英文字母為標準來做換行。

.nobreak { word-break: break-all; }

代碼著色

我把我終端上的代碼顏色作為變數加了上來。也許在未來的某一天,我會把它換成其他更為廣泛使用的終端主題配色,像是Monokai或者其他的,但現在就是我所使用的個人主題配色,沿襲自Tomorrow Night Eighties。

與此同時,我也添加了.terminal這個class來呈現出一個假的代碼區塊,當你使用[[div class="code terminal"]]並搭背著深色背景時,它看起來就會有點偽終端的樣子。這不會在[[code]]上起作用,因為Wikidot插入了一大堆凸顯用的語法,所以如果你想修改的話也得用上大量的CSS。僅供非[[code]]的代碼片段使用。

一個能能用上述變數對『標準』的Wikidot組件用例作顏色變換的快速工具:連結

:root {
  --c-bg: #393939;
  --c-syntax: #e0e0e0;
  --c-comment: #999999;
  --c-error: #f2777a;
  --c-value: #f99157;
  --c-symbol: #ffcc66;
  --c-string: #99cc99;
  --c-operator: #66cccc;
  --c-builtin: #70a7df;
  --c-keyword: #cc99cc;
}
 
.terminal, .terminal > .code {
  color: var(--c-syntax);
  background: var(--c-bg);
  border: 0.4rem solid var(--c-comment);
  border-radius: 1rem;
}

除錯模式

.debug-mode裡面的所有東西都會被框線所包圍。線條的顏色是紅色,但實際上將取決於--debug-colour這個CSS變數。

你也可以在一個元素之中加入div.debug-info.overdiv.debug-info.under來標註出除錯區塊 —— 不過你要確保有偽這些標註預留足夠的垂直空間,以避免與上方或下方的東西相互重疊到。

……就像這個!

.debug-mode, .debug-mode *, .debug-mode *::before, .debug-mode *::after {
  outline: 1px solid var(--debug-colour, red);
  position: relative;
}
.debug-info {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  font-family: 'Fira Code', monospace;
  font-size: 1rem;
  white-space: nowrap;
}
.debug-info.over { top: -2.5rem; }
.debug-info.under { bottom: -2.5rem; }
.debug-info p { margin: 0; }
/*
    Newspaper Theme Vietnam
    [2021 Wikidot Theme]
    By StupifPotato
    Based on:
       Newspaper Theme by MalyceGraves and EstrellaYoshte
*/
 
@import url('https://fonts.googleapis.com/css2?family=Montserrat&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@700&display=swap');
 
:root {
    --accentColor: #014f8a;
    --lgurl: url("http://scp-wiki.wdfiles.com/local--files/theme%3Anewspaper/newslogo.png");
    --bgurl: url("http://scp-wiki.wdfiles.com/local--files/theme%3Anewspaper/newshead.png");
    --primaryBackgroundColor: #f3f3f3;
    --textColor: #090B0C;
    --headerColor: #161B33;
    --selectionColor: #a5ecfa;
 
    --header-font: 'Merriweather', serif;
    --link-timing: 0.125s ease-out;
}
 
#content-wrap {
    margin: 0.65em auto 0;
    box-sizing: border-box;
}
#page-content { font-size: 1rem; }
 
body {
    font-family: 'Montserrat', sans-serif;
    color: var(--textColor);
    background-color: #e9f8ff;
    background-image: none;
    background-repeat: no-repeat;
}
tt {
    background-color: var(--primaryBackgroundColor);
}
code {
    font-family: var(--mono-font);
}
#edit-page-textarea, .code pre, .code p, .code, tt, .page-source {
    font-size: 90%;
}
 
a:not(.rate-box-with-credit-button a, .page-rate-widget-box a, yui-nav a) {
    color: var(--accentColor);
}
 
#page-content div {
    clear: unset;
}
 
/* Selection */
::selection {
    background: var(--selectionColor);
    color: var(--textColor);
}
 
/* ---- HEADER ---- */
 
div#container-wrap {
     background-image: none;
}
div#header {
    background-image: none;
    height: 240px;
}
 
div#header-extra-div-1 {
    height: 164px;
    width: 100%;
    top: 0;
    position: absolute;
    background: none;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    opacity: 1;
    z-index: -1;
}
div#extra-div-1 {
    height: 164px;
    width: 100%;
    top: 0;
    position: absolute;
    background: none;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center 0;
    z-index: -2;
    -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 20%, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 20%, rgba(0,0,0,0.3) 70%, rgba(0,0,0,0) 100%);
}
 
#header h1, #header h2 { margin-left: 0; float: none; text-align: center; }
#header h1 a {
    width: -moz-fit-content;
    width: fit-content;
    margin: 0 auto;
 
}
#header h2 {
    margin-top: 0.5rem;
    font-size: 0.75rem;
    font-style: italic;
}
/* Hide the existing text */
#header h1 span, #header h2 span { font-size: 0; display: none; }
/* Style the new text */
#header h1 a::before, #header h2::before {
  color: var(--headerColor);
  font-family: var(--header-font);
  text-shadow: none;
}
#header h2::before { color: var(--textColor); }
/* Set the new text's content from variable */
#header h1 a::before {
  content: var(--header-title, "SCP基金會月刊");
  font-weight: 300;
  font-size: 1em;
}
#header h2::before {
  content: var(--header-subtitle, "SCP Foundation Monthly");
  font-weight: 600;
  font-size: 0.75em;
}
 
#login-status {
    color: var(--textColor);
    background-color: #FEFBF8;
    padding: 0.3rem 0.25rem 0.4rem 0.5rem;
    border-radius: 0 0 0.5rem 0.5rem;
    box-shadow: 0 0 3px 1px rgba(0,0,0,0.2);
    top: 0;
}
#login-status a {
    color: var(--accentColor);
}
#account-topbutton {
    border: none;
    margin-left: -0.1rem;
}
 
div#account-options {
    background-color: var(--primaryBackgroundColor);
    border: none;
    border-radius: 0.35rem;
    box-shadow: 0 0 4px 1px rgba(0,0,0,0.25);
    top: 1.85rem;
 
    display: block!important;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s;
}
#account-topbutton:focus + #account-options,
#account-topbutton:active + #account-options,
#account-options:focus-within {
    opacity: 1;
    pointer-events: all;
}
/* Without this, touchscreen doesn't work */
@media (pointer: coarse) {
    #account-topbutton:hover + #account-options,
    #account-options:hover {
        opacity: 1;
        pointer-events: all;
    }
}
#account-options li a,
#account-options li a:hover {
    color: var(--accentColor);
}
 
/* ---- SEARCH ---- */
div#search-top-box {
    top: 2.25rem;
    right: 0.5rem;
    width: 1.6rem;
}
 
div#search-top-box::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0; right: 0.05rem;
    background-color: var(--accentColor);
    pointer-events: none;
    z-index: 2;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E");
            mask-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E");
    -webkit-mask-size: 1rem;
            mask-size: 1rem;
    -webkit-mask-position: center;
            mask-position: center;
    -webkit-mask-repeat: no-repeat;
            mask-repeat: no-repeat;
    opacity: 1;
    transition: opacity 0.25s ease;
}
div#search-top-box:focus-within::before { opacity: 0; }
 
div#search-top-box form {
    display: flex;
    justify-content: flex-end;
}
 
div#search-top-box form input[type="text"]:not(:focus),
div#search-top-box form input[type="text"]:not(:focus):not(:hover) {
    position: relative;
    color: transparent;
    cursor: pointer;
    display: inline-block;
    font-family: var(--body-font);
    width: 1.6rem;
    height: 1.6rem;
    padding: 0.1em 0.5em;
    box-sizing: border-box;
    border-radius: 0.35rem;
    border: none;
    box-shadow: 0 0 2px 1.5px var(--shadow);
}
 
div#search-top-box form input[type="text"],
div#search-top-box form input[type="text"]:hover,
div#search-top-box form input[type="text"]:focus {
    background-color: var(--primaryBackgroundColor)!important;
    color: var(--textColor);
    display: inline-block;
    border: none;
    height: 1.6rem;
    width: 9rem;
    transition: width .25s;
    outline: none;
}
 
div#search-top-box form input[type="submit"] {
    display: none;
}
 
/* ---- TOP BAR ---- */
 
#top-bar {
     top: 8.5rem;
     display: flex;
     justify-content: center;
     right: 0;
}
@media (max-width: 768px) {
    .mobile-top-bar {
         display: flex;
         justify-content: center;
         max-width: 100%;
         width: 100%;
         left: 0;
    }
}
 
/* div[class*=top-bar] is to select both regular and mobile top bar that exist in #top-bar */
 
#top-bar div[class*=top-bar] > ul > li > a {
    color: var(--textColor);
}
 
#top-bar div[class*=top-bar] ul li ul li a {
    color: var(--accentColor);
}
 
#top-bar div[class*=top-bar] > ul > li > a:hover,
#top-bar div[class*=top-bar] > ul > li.sfhover > a {
    background-color: transparent;
    background: none;
}
 
#top-bar div[class*=top-bar] > ul > li,
#top-bar div[class*=top-bar] > ul > li.sfhover {
    background-color: transparent;
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-size: 0 100%;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size var(--link-timing);
}
#top-bar div[class*=top-bar] > ul > li:hover,
#top-bar div[class*=top-bar] > ul > li:focus-within {
    background-color: transparent;
    background-size: 100% 100%;
}
 
#top-bar div[class*=top-bar] ul li ul {
    background-color: var(--primaryBackgroundColor);
    border: none;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    border-radius: 0.5rem;
}
#top-bar div[class*=top-bar] ul li ul li:first-of-type a {
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}
#top-bar div[class*=top-bar] ul li ul li:last-of-type a {
    border-bottom-left-radius: 0.5rem;
    border-bottom-right-radius: 0.5rem;
}
 
#top-bar div[class*=top-bar] ul li ul li,
#top-bar div[class*=top-bar] ul li ul li a {
    background: transparent;
    border: none;
}
#top-bar div[class*=top-bar] ul li ul li a:hover,
#top-bar div[class*=top-bar] ul li ul li a:focus {
    background-color: #FEFBF8;
}
 
/* keyboard navigation compatibility */
#top-bar div[class*=top-bar] ul > li > ul > li > a {
    height: auto;
    max-height: none;
    line-height: 1.5!important;
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
}
#top-bar div[class*=top-bar] > ul > li > ul {
    visibility: visible;
    opacity: 0;
    pointer-events: none;
}
#top-bar div[class*=top-bar] > ul > li:hover > ul,
#top-bar div[class*=top-bar] > ul > li > ul:hover,
#top-bar div[class*=top-bar] > ul > li:focus-within > ul,
#top-bar div[class*=top-bar] > ul > li > ul:focus-within {
    opacity: 1;
    pointer-events: all;
}
 
/* ---- SIDE BAR ---- */
 
div#side-bar{
    background: #FEFBF8;
    clear: both;
    padding: .8em;
    border: none;
    border-radius: 0;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    overflow-x: hidden;
}
 
#side-bar .heading{
    color: var(--headerColor);
    font-family: var(--header-font);
    font-size: 0.94rem;
    border-bottom: solid 1px var(--headerColor);
    border-top: solid 1px var(--headerColor);
    margin-top: 1.35rem;
    padding-left: 0;
    text-align: center;
}
#side-bar .side-block {
    border: transparent;
    border-radius: 0;
    box-shadow: none;
    background-color: #FEFBF8;
}
#side-bar .side-block.media {
    background-color:#FEFBF8;
}
#side-bar .side-block.media > * {
    display: flex;
    justify-content: space-evenly;
}
#side-bar .side-block.resources {
    background-color:#FEFBF8;
}
.side-block .menu-item > .image {
    display: none;
}
 
#side-bar div.menu-item a {
    color: var(--accentColor);
}
 
#top-bar div.open-menu a {
    border-radius: 0.35rem;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    color: var(--accentColor);
    background-color: #FEFBF8;
    border: none;
    padding: 0.15rem;
    user-select: none;
}
 
/* ---- MAIN CONTENT ---- */
#main-content {
    background-color: #FEFBF8;
    padding: 0.5em 2em 0.75em;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    width: 100%;
    max-width: 880px;
    margin: -0.4rem auto 0;
    border-radius: 0;
    box-sizing: border-box;
}
 
/* ---- PAGE TITLE ---- */
#page-title, .meta-title {
    color: var(--headerColor);
    font-family: var(--header-font);
    font-size: 3em;
    text-align: center;
    display: flex;
    align-items: center;
    text-align: center;
    border-bottom: none;
    margin: 0.25rem 0;
    padding-bottom: 0;
}
#page-title::before,
#page-title::after,
.meta-title::before,
.meta-title::after {
    content: "";
    flex-grow: 1;
    height: 0.25rem;
    margin: auto auto auto 0.65rem;
    background-color: transparent;
    border-top: solid 0.125rem var(--headerColor);
    border-bottom: solid 0.125rem var(--headerColor);
}
#page-title::before,
.meta-title::before {
    margin: auto 0.65rem auto auto;
}
 
/* ---- BREADCRUMBS ---- */
 
#breadcrumbs, #page-content .pseudocrumbs {
    font-size: 0.85rem;
    font-family: var(--header-font);
    margin-top: -1.05em;
}
#page-content .pseudocrumbs * { text-decoration-color: var(--accentColor)!important; }
 
/* ---- TABS ---- */
 
/* ---- YUI TAB BASE ---- */
.yui-navset .yui-nav a,.yui-navset .yui-navset-top .yui-nav a{background-color:inherit;background-image:inherit}.yui-navset .yui-nav a:hover,.yui-navset .yui-nav a:focus{background:inherit;text-decoration:inherit}.yui-navset .yui-nav .selected a,.yui-navset .yui-nav .selected a:focus,.yui-navset .yui-nav .selected a:hover{color:inherit;background:inherit}.yui-navset .yui-nav,.yui-navset .yui-navset-top .yui-nav{border-color:inherit}.yui-navset li{line-height:inherit}
 
/* ---- YUI TAB CUSTOMIZATION ----*/
 
 .yui-navset .yui-nav,
 .yui-navset .yui-navset-top .yui-nav{
     display: flex;
     flex-wrap: wrap;
     width: calc(100% - .125rem);
     margin: 0 auto;
     border-width: 0;
     box-shadow: none;
}
 .yui-navset .yui-nav a, /* ---- Link Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav a{
     color: var(--textColor);
     font-weight: bold;
    /* ---- Tab Background Colour | [UNSELECTED] ---- */
     background-color: transparent;
     border: unset;
     box-shadow: none;
 
     background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
     background-size: 0 100% ;
     background-position: 0 100%;
     background-repeat: no-repeat;
     transition: background-size var(--link-timing);
}
 .yui-navset .yui-nav a:hover,
 .yui-navset .yui-nav a:focus{
    /* ---- Tab Background Colour | [HOVER] ---- */
     background-color: transparent;
     background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
     background-size: 100% 100% ;
     background-position: 0 100%;
     background-repeat: no-repeat;
     transition: background-size var(--link-timing);
}
 .yui-navset .yui-nav li, /* ---- Listitem Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav li{
     position: relative;
     display: flex;
     flex-grow: 2;
     max-width: 100%;
     margin: 0.25rem;
     padding: 0;
     color: #d6d6d6;
     background-color: var(--primaryBackgroundColor);
     border-color: transparent;
     border-radius: 0.35rem;
     box-shadow: none;
}
 .yui-navset .yui-nav li a,
 .yui-navset-top .yui-nav li a,
 .yui-navset-bottom .yui-nav li a{
     display: flex;
     align-items: center;
     justify-content: center;
     width: 100%;
     border-radius: 0.35rem;
}
 .yui-navset .yui-nav li em{
     border: unset;
}
 .yui-navset .yui-nav a em,
 .yui-navset .yui-navset-top .yui-nav a em{
     padding: .35em .75em;
 
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
}
 .yui-navset .yui-nav .selected, /* ---- Selection Modifier ---- */
 .yui-navset .yui-navset-top .yui-nav .selected{
     flex-grow: 2;
     margin: 0;
     padding: 0;
     border-radius: 0.35rem;
    /* ---- Tab Background Colour | [SELECTED] ---- */
     background-color: var(--accentColor);
     color: var(--primaryBackgroundColor);
}
 .yui-navset .yui-nav .selected a,
 .yui-navset .yui-nav .selected a em{
     border: none;
}
 .yui-navset .yui-nav .selected a{
     width: 100%;
     color: #ffffff;
     font-weight: bold;
}
 .yui-navset .yui-nav .selected a:focus,
 .yui-navset .yui-nav .selected a:active{
     color: #ffffff;
     background-color: var(--accentColor);
}
 .yui-navset .yui-content {
    border: none;
    background-color: transparent;
    box-shadow: none;
    margin-top: 0.25rem;
    box-sizing: border-box;
    border-radius: 1rem;
    padding: 0.35rem 0;
    border-top: solid 0.2rem var(--accentColor);
    border-bottom: solid 0.2rem var(--accentColor);
}
 
/* ---- INFO PANE ---- */
 
:root {
    --linkColor: var(--selectionColor);
    --radius-adjust: 0.325rem;
    --shadow: rgba(0,0,0,0.2);
}
 
#page-content .creditRate{
    margin: unset;
    margin-bottom: 1rem;
}
#page-content .rate-box-with-credit-button {
    background-color: var(--primaryBackgroundColor);
    border: none;
    box-shadow: 0 0 3px 1px var(--shadow);
    border-radius: var(--radius-adjust);
    padding: 0.275rem;
}
#page-content .rate-box-with-credit-button .page-rate-widget-box { border: none; }
 
#page-content a.fa {
    transform: none;
}
#page-content .rate-box-with-credit-button .fa-info {
    border: none;
    color: var(--textColor);
 
    padding-top: 0.25rem;
    padding-bottom: 0.0725rem;
    width: 0.9rem;
    margin-left: -0.1rem;
    margin-right: 0.1rem;
 
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-size: 0 100% ;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size var(--link-timing);
}
 
#page-content .rate-box-with-credit-button .fa-info:hover,
#page-content .rate-box-with-credit-button .fa-info:focus {
    background-size: 100% 100%;
}
 
.rate-box-with-credit-button .cancel {
    border: solid 1px var(--primaryBackgroundColor);
}
 
#page-content .creditButtonStandalone {
    margin: 0.125rem 0;
}
#page-content .creditButtonStandalone p a {
    border-radius: 1rem;
    color: var(--textColor);
    text-align: center;
    background: initial;
    box-shadow: 0 0 2px 1px var(--shadow);
    padding: 0.24rem;
 
    background: none;
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 0 100%;
    transition: background-size var(--link-timing);
}
#page-content .creditButtonStandalone p a:hover,
#page-content .creditButtonStandalone p a:focus {
    text-decoration: none;
    background: none;
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-position: 0 100%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
}
 
/* ---- PAGE RATING ---- */
 
.page-rate-widget-box {
    box-shadow: none;
    margin: unset;
    margin-bottom: 1rem;
    background-color: var(--primaryBackgroundColor);
    border-radius: var(--radius-adjust);
    box-shadow: 0 0 3px 1px var(--shadow);
    padding: 0.275rem;
}
 
.page-rate-widget-box .rateup a:hover, .page-rate-widget-box .rateup a:focus,
.page-rate-widget-box .ratedown a:hover, .page-rate-widget-box .ratedown a:focus,
.page-rate-widget-box .cancel a:hover, .page-rate-widget-box .cancel a:focus {
    color: var(--textColor);
    background: unset;
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-size: 100% 100%;
    background-position: 0 100%;
    background-repeat: no-repeat;
    border-radius: 0;
}
 
.page-rate-widget-box .rate-points {
    background-color: var(--primaryBackgroundColor) !important;
    color: var(--textColor) !important;
    border: solid 1px var(--primaryBackgroundColor);
    border-radius: 0;
}
.page-rate-widget-box .rateup,
.page-rate-widget-box .ratedown {
    background-color: var(--primaryBackgroundColor);
    border-top: solid 1px var(--primaryBackgroundColor);
    border-bottom: solid 1px var(--primaryBackgroundColor);
}
 
.page-rate-widget-box .rateup a,
.page-rate-widget-box .ratedown a {
    color: var(--textColor);
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-size: 0 100%;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size var(--link-timing);
}
 
.page-rate-widget-box .cancel {
    background-color: var(--primaryBackgroundColor);
    border: solid 1px var(--primaryBackgroundColor);
    border-radius: 0;
}
 
.page-rate-widget-box .cancel a {
    color: var(--textColor);
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-size: 0 100%;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size var(--link-timing);
}
 
/* ---- PAGE ELEMENTS ---- */
 
h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--headerColor);
    font-family: var(--header-font);
    font-weight: normal;
    margin: 0.45em 0;
}
h1 { font-size: 2em; }
h2 { font-size: 1.7em; }
h3 { font-size: 1.45em; }
h4 { font-size: 1.25em; }
h5 { font-size: 1.1em; }
h6 { font-size: 1em; }
 
hr {
    height: 0.25rem;
    margin: 1.75rem 0;
    background-color: transparent;
    border-top: solid 0.125rem var(--headerColor);
    border-bottom: solid 0.125rem var(--headerColor);
    clear: both;
}
 
blockquote,
div.blockquote {
    background-color: var(--primaryBackgroundColor);
    border: none;
    border-left: solid 0.2rem var(--headerColor);
    padding: 0.1rem 1rem;
    box-shadow: 0 0 3px rgba(0,0,0,0.25);
    position: relative;
}
blockquote::before, blockquote::after,
div.blockquote::before, div.blockquote::after {
    content: "";
    display: block;
    height: 0.5rem; width: 0.5rem;
    position: absolute;
    left: 0;
    background-color: var(--headerColor);
}
blockquote::before, div.blockquote::before {
    top: 0;
    transform: translate(calc(-50% - 0.1rem),-50%) rotate(45deg);
}
blockquote::after, div.blockquote::after {
    bottom: 0;
    transform: translate(calc(-50% - 0.1rem),50%) rotate(45deg);
}
 
#toc {
    display: block;
    background-color: #FEFBF8;
    border: none;
    padding: 0.1rem 1rem;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    border-right: solid 0.2rem var(--headerColor);
    padding: 0.75em;
    position: relative;
}
#toc::before, #toc::after {
    content: "";
    display: block;
    height: 0.5rem; width: 0.5rem;
    position: absolute;
    right: 0;
    background-color: var(--headerColor);
}
#toc::before {
    top: 0;
    transform: translate(calc(0.1rem + 50%),-50%) rotate(45deg);
}
#toc::after {
    bottom: 0;
    transform: translate(calc(0.1rem + 50%),50%) rotate(45deg);
}
#toc-list {
    font-family: var(--header-font);
}
#toc-list > div[style*="margin-left: 1em;"] { margin-left: 0.5em!important; }
#toc-list > div:not([style*="margin-left: 1em;"]) { display: none; }
 
.scp-image-block {
    border: solid 8px var(--primaryBackgroundColor);
    box-shadow: 0px 0px 4px rgba(0,0,0,0.3);
    box-sizing: border-box;
    position: relative;
    z-index: 0;
}
.scp-image-block::before, .scp-image-block::after {
    content:'';
    position: absolute;
    pointer-events: none;
    border: solid 0.25rem var(--headerColor);
    transform: rotate(25deg);
}
.scp-image-block::before {
    right: -0.135rem;
    height: 36px;
    width: 9px;
    top: -14.25px;
    border-radius: 0 0 2rem 2rem;
    border-top: none;
}
.scp-image-block::after {
    top: -25px;
    right: -0.94rem;
    height: 16px;
    width: 14px;
    border-radius: 2rem 2rem 0 0;
    border-bottom: solid 0.55rem transparent;
    z-index: -1;
}
 
.scp-image-block .scp-image-caption {
    background-color: var(--primaryBackgroundColor);
    border-top: solid 4px var(--primaryBackgroundColor);
    color: var(--textColor);
}
.scp-image-block.block-left,
.scp-image-block.block-right {
    margin: 0.25rem 2rem 0.625rem;
}
.scp-image-block.block-left { margin-left: 0.5rem; }
.scp-image-block.block-right { margin-right: 0.5rem; }
@media (max-width: 640px) {
  .scp-image-block.block-left, .scp-image-block.block-right {
    float: none; clear: both; margin-left: auto; margin-right: auto;
  }
}
 
#page-content .wiki-content-table tr th {
    border: solid 1px var(--headerColor);
    color: var(--headerColor);
    background-color: var(--primaryBackgroundColor);
    /* set border for table title */
}
#page-content .wiki-content-table tr td {
    border: solid 1px var(--headerColor);
    /* set border for table content */
}
 
/* fancy collapsible */
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
    background-color: var(--primaryBackgroundColor);
    border-radius: 0.35rem;
    width: min-content;
    white-space: nowrap;
    overflow: hidden;
    margin: auto;
}
 
#page-content .collapsible-block-folded {
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-size: 0 100% ;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size var(--link-timing);
}
#page-content .collapsible-block-folded:hover,
#page-content .collapsible-block-folded:focus-within {
    background-size: 100% 100% ;
    transition: background-size var(--link-timing);
}
#page-content .collapsible-block-unfolded-link {
    background-color: var(--accentColor);
    box-shadow: 0 0 0 0.2rem var(--accentColor);
}
#page-content .collapsible-block-folded, #page-content .collapsible-block-unfolded-link {
    margin-top: 10px;
    margin-bottom: 10px;
}
#page-content .collapsible-block-link {
    display: inline-flex;
    padding: 0.5rem 1rem;
    text-decoration: none;
    color: var(--textColor);
    font-weight: bold;
}
#page-content .collapsible-block-unfolded-link .collapsible-block-link {
    color: var(--primaryBackgroundColor);
}
 
/* Footnotes */
a.footnoteref {
    padding: 0 0.25em 1px;
    margin-left: -0.15em;
}
 
.hovertip {
    font-size: 1.25em;
    background-color: #FEFBF8 !important;
    border: none !important;
    border-left: solid 0.2rem var(--accentColor)!important;
    color: var(--textColor) !important;
    border-radius: 0 1rem;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    padding: 0.35rem;
    box-sizing: border-box;
    width: min(24rem, 60vw)!important;
 
    top: initial!important;
    left: initial!important;
    position: fixed! important;
 
    display: block!important;
    bottom: 2rem;
    right: -25rem;
 
    transition: right 0.45s cubic-bezier(.6,.18,.27,.88);
    transition-delay: 0.455s;
    z-index: 29;
}
.hovertip::before {
    content: "";
    display: block;
    height: 0.5rem;
    width: 0.5rem;
    position: absolute;
    left: 0;
    top: 0;
    background-color: var(--accentColor);
    transform: translate(calc(-50% - 0.1rem),-50%) rotate(45deg);
}
div[id$="button-hovertip"] { transition-delay: 0s; }
 
.hovertip[style*="display: block"],
.hovertip:hover {
    z-index: 30;
    right: 1rem;
    transition-delay: 0s;
}
 
.footnote .f-heading {
    font-family: var(--header-font);
}
.footnote .f-footer, .equation .e-footer, .reference .r-footer {
    display: none;
}
 
.footnotes-footer {
    border: none;
    border-left: solid 0.2rem var(--accentColor);
    padding: 0.1rem 1rem 1rem 1.25rem;
    position: relative;
    border-radius: 0 1.25rem;
}
.footnotes-footer::before {
    content: "";
    display: block;
    height: 0.5rem; width: 0.5rem;
    position: absolute;
    left: 0; top: 0;
    background-color: var(--accentColor);
    transform: translate(calc(-50% - 0.1rem),-50%) rotate(45deg);
}
 
.footnotes-footer .title {
    color: var(--textColor);
    font-family: var(--header-font);
    margin: 0 0 0.625rem 0;
}
 
/*-- tags --*/
 
#main-content .page-tags a {
    height: 0.8125rem;
    font-size: 0.6875rem;
    background-color: var(--primaryBackgroundColor);
    color: var(--textColor);
    border-radius: 0.35rem;
    margin: .25rem .2rem;
    padding: 0.21rem 0.35rem 0.22rem 0.3rem;
    box-shadow: 0 0 3px rgba(0,0,0,0.25);
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
 
    background-image: linear-gradient(to bottom, var(--linkColor) 0%, var(--linkColor) 100%);
    background-size: 0 100%;
    background-position: 0 100%;
    background-repeat: no-repeat;
    transition: background-size var(--link-timing);
}
 
#main-content .page-tags a:hover,
#main-content .page-tags a:focus {
    background-size: 100% 100%;
    text-decoration: none;
}
#main-content .page-tags a:before {
    content: "⬤";
    font-size: 4px;
    padding-right: 0.2rem;
    display: inline-block;
}
 
.page-tags span {
    border-top: solid 0.125rem var(--primaryBackgroundColor);
}
 
/* Pop-Up Windows */
.owindow {
    background-color: var(--primaryBackgroundColor);
    border: none;
}
 
.owindow .modal-header {
    background-color: transparent;
}
 
.owindow .modal-body img {
    background-color: transparent !important;
}
 
.owindow .title {
    background-color: transparent;
    color: var(--headerColor);
    border-bottom: 1px solid var(--headerColor);
}
 
.owindow .button-bar a {
    background-color: var(--primaryBackgroundColor);
    border-color: var(--accentColor);
    color: var(--accentColor);
}
.owindow .button-bar a:hover {
    background-color: var(--accentColor);
    color: var(--primaryBackgroundColor);
}
 
#page-content .modalbox {
    background: #FEFBF8;
    border: none;
    border-radius: 0;
    box-shadow: 0 0 10px rgba(0,0,0,0.35);
}
#page-content .modalbox hr { margin: 0.75rem 1rem; }
 
/* Edit Buttons */
.buttons .btn {
    background-color: var(--primaryBackgroundColor);
    border-color: var(--accentColor);
    color: var(--accentColor);
    padding: 3px 5px;
}
.buttons .btn:hover {
    background-color: var(--accentColor);
    color: var(--primaryBackgroundColor);
}
 
/* Close Button for Page Source, Rating, Etc */
a.action-area-close:hover {
    background-color: var(--accentColor);
    color: var(--primaryBackgroundColor);
}
 
/* Page-History Current */
.pager .current {
    background-color: var(--accentColor);
    border-color: var(--primaryBackgroundColor);
}
 
/* ---- CUSTOM SYNTAX ----*/
 
#page-content .section-header {
    display: flex;
    align-items: center;
    text-align: center;
    margin-top: 3.5rem;
    margin-bottom: 0.75rem;
    clear: both;
}
#page-content .breaker + .section-header {
    margin-top: 1.5rem;
}
.section-header::before, .section-header::after {
    content: "";
    flex-grow: 1;
    height: 0.175rem;
    margin: auto -0.625rem auto auto;
    background-color: var(--primaryBackgroundColor);
}
.section-header::after {
    margin: auto auto auto -0.625rem;
}
 
.section-header h1 {
    width: max-content;
    margin: 0 auto;
    text-align: center;
    padding: 0.05rem 1.5rem;
    border-radius: 0rem 0.875rem;
    border-bottom: solid 0.2rem var(--accentColor);
    border-top: solid 0.2rem var(--accentColor);
    position: relative;
}
.section-header h1::before {
    content: "";
    background-color: var(--accentColor);
    display: block;
    width: 0.6rem; height: 0.6rem;
    position: absolute;
    top: 0;
    left: 0;
    transform: translate(-0.3rem, -0.4rem) rotate(45deg);
}
.section-header h1::after {
    content: "";
    background-color: var(--accentColor);
    display: block;
    width: 0.6rem; height: 0.6rem;
    position: absolute;
    bottom: 0;
    right: 0;
    transform: translate(0.3rem, 0.4rem) rotate(45deg) ;
}
.section-header h1 span {
    width: max-content;
    margin: auto;
}
 
/*-----------------*/
 
.s-title {
    font-size: 110%;
    font-weight: bold;
    display: inline;
    padding: 0 0.15em;
    padding-bottom: 0.1em;
    border-bottom: solid 0.1rem currentColor;
    border-top: solid 0.1rem currentColor;
}
 
.gallery-frame {
    box-sizing: border-box;
    background-color: #e9faff;
    padding: 0.75rem;
    border: inset 0.325rem var(--headerColor);
    box-shadow: inset 0 0 5px rgba(0,0,0,0.4);
    margin: auto;
}
.gallery-frame > img { box-shadow: 0 0 3px 1px rgba(0,0,0,0.3); }
 
.hover:hover {
    text-decoration: none;
}
.hover span { display: none; }
.hover:hover span {
    position: absolute;
    display: inline;
    height: auto;
    max-width: 25%;
    background-color: var(--headerColor);
    color: #FEFBF8;
    font-weight: bold;
    padding: 0.5em 1.5em;
    border-bottom-right-radius: 1rem;
}
 
.f-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}
.f-flex > div {
    flex-basis: 18rem;
    flex-grow: 1;
}
.f-flex.three > div {
    flex-basis: 13rem;
    flex-grow: 1;
}
.f-flex.data > div {
    padding: 0.65rem 0.375rem;
}
.f-flex.data > div:hover {
    z-index: 9;
}
 
.f-con {
    border: none;
    padding: 0.15rem 0.75rem 1.5rem;
    margin: 0.85rem;
    position: relative;
    border-radius: 0 1.25rem;
    background-color: #e9faff;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
}
#page-content .f-flex .f-con { max-width: 25rem; }
.f-con h4 {
    background-color: #b8eeff;
    color: #242424;
    padding: 0.1rem 0;
    border-radius: 0 0.625rem;
}
 
.placard {
    display: inline-block;
    position: relative;
    padding: 0.45rem 0.65rem;
    margin: -1.05rem -0.5rem -1.3rem;
    border: solid 1em transparent;
    background: var(--primaryBackgroundColor) padding-box;
    clip-path: polygon(0 3em, 3em 0, 100%  0, 100% calc(100% - 3em), calc(100% - 3em) 100%, 0 100%);
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.25));
}
.placard::before, .placard::after {
    position: absolute;
    width: 3em;
    height: .35em;
    background: radial-gradient(at 50% 0, rgba(0,0,0,0.17), rgba(0,0,0,0) 65%);
    content: "";
}
.placard::before {
    top: 0.45em;
    left: -0.95em;
    transform: rotate(-45deg);
}
.placard::after {
    bottom: 0.45em;
    right: -0.95em;
    transform: rotate(135deg);
}
 
/*---- Side ToC setup ----*/
 
.anchor {
    position: sticky;
    height:0;
    top: 0.5rem;
    z-index: 4;
}
.tocbox {
    margin-top: 0;
    position: absolute;
    top: 0;
    right: max(-18.75rem, -17vw);
    z-index: 4;
    box-sizing: border-box;
    width: max-content;
    pointer-events: none;
}
 
#page-content .tocbox .toc-u {
    padding: 0.5rem;
    background-color: #FEFBF8;
    box-shadow: 0 0 4px rgba(0,0,0,0.3);
    border-right: solid 0.2rem var(--headerColor);
    position: relative;
    width: 15rem;
    max-height: calc(98vh - 2rem);
    max-width: calc((30vw - 50% - 6rem)/1.2);
    margin-right: 0; margin-left: auto;
    pointer-events: all;
}
.toc-u #toc::before, .toc-u #toc::after { display: none; }
.toc-u::before, .toc-u::after {
    content: "";
    display: block;
    height: 0.5rem; width: 0.5rem;
    position: absolute;
    right: 0;
    background-color: var(--headerColor);
}
.toc-u::before {
    top: 0;
    transform: translate(calc(0.1rem + 50%),-50%) rotate(45deg);
}
.toc-u::after {
    bottom: 0;
    transform: translate(calc(0.1rem + 50%),50%) rotate(45deg);
}
 
#page-content .tocbox .toc-u #toc-list {
    overflow-y: auto;
    overflow-x: hidden;
    max-height: 84vh;
    padding: 0 0.5em 1em;
    scrollbar-width: thin;
}
#page-content .tocbox .toc-u #toc-list::-webkit-scrollbar {
    width: 6px;
}
 
.tocbox table,
.tocbox tbody,
.tocbox tr,
.tocbox td,
.tocbox #toc {
    display: contents;
}
 
#toc-list > div { position: relative; }
#toc-list > div[style*="1em"]::before {
    content: "•";
    display: inline-block;
    position: absolute;
    left: -0.75em;
    color: var(--accentColor);
}
 
@media (max-width: 1340px) {
    .anchor {
        filter: none;
        transition: filter 0.2s ease-out;
     }
    .tocbox {
        right: -1rem;
        width: unset;
    }
    .tocbox::before {
        content: "";
        display: block;
        position: absolute;
        background-color: transparent;
        width: 1.5rem; height: 100%;
        top: 0; right: -0.25rem;
        pointer-events: all;
}
    .tocbox::after {
        content: "";
        display: block;
        position: absolute;
        background-color: transparent;
 
        width: 0; height: 0;
        border: solid 1rem transparent;
        border-left-width: 0.5rem;
        border-right-color: var(--headerColor);
 
        top: calc(50% - 1rem); right: 0;
        pointer-events: all;
        transition: border-right-width 0.15s ease-out;
    }
    #page-content .tocbox .toc-u {
        width: -moz-fit-content;
        width: fit-content;
        max-width: 60vw;
        box-shadow: none;
        clip-path: inset(-0.5rem -0.5rem -0.5rem calc(100% - 0.65rem));
        transition: clip-path 0.2s ease-out;
        pointer-events: none;
    }
 
    .anchor:hover { filter: drop-shadow(0px 0px 3px rgba(0,0,0,0.2)); }
    .tocbox:hover {
        pointer-events: all;
    }
    .tocbox:hover::after {
        border-right-width: 0;
    }
    #page-content .tocbox:hover .toc-u {
        pointer-events: all;
        clip-path: inset(-0.5rem -0.5rem -0.5rem -0.35rem);
    }
}
 
/* ---- FOOTER & LICENSE AREA ---- */
 
#footer, #license-area {
    background-color: #e9faff;
    color: var(--textColor);
}
#footer a { color: var(--accentColor); }
 
#footer {
    padding-top: 1rem;
}
#license-area {
    padding-top: 0;
}
 
/* ---- INTERWIKI ---- */
 
.scpnet-interwiki-frame{
    filter: invert(100%) grayscale(100%) contrast(75%);
}
 
/* ---- MOBiLE QUERY ---- */
@media (max-width: 767px) {
 
    div#header, div#top-bar {
        width: 100%;
        max-width: 100%;
    }
 
    #login-status {
        padding-top: 0rem;
        padding-left: 0.3rem;
    }
    #login-status span.printuser  {
        font-size: 0;
    }
    #login-status span.printuser img {
        font-size: 0;
        transform: translate(6px, 5px);
    }
    #login-status a#my-account {
        display: none;
    }
 
    #main-content {
        padding: 0.5em 1.75em 0.75em;
    }
    #side-bar .close-menu {
        opacity: 0;
        margin-left: 18.75em;
    }
    #side-bar:target .close-menu:hover {
        background: unset;
    }
 
    :root {
        --header-title: "SCP基金會月刊";
    }
 
    #page-title, .meta-title { font-size: 2.4em; }
    h1 { font-size: 1.8em; }
    h2 { font-size: 1.5em; }
    h3 { font-size: 1.25em; }
    h4 { font-size: 1.05em; }
    h5 { font-size: 0.9em; }
    h6 { font-size: 0.8em; }
}

 

Table of Contents

 近期新聞 


  基金會翻譯活動 - 「GOI考察」
翻譯號寒假冬令營結束後,這次將以「關注組織」為主題繼續翻譯活動!
相關內容可以到討論區查看。


  ES分部10周年慶祝活動
FANZINE活動將持續到4月2日,這期間可以投稿繪圖、短篇故事、影片,各種題材!
也可以看看他們製作的活動宣傳圖

 本月展出作品 

項目展出

SCP-ZH-429 - 青春永駐的柔卡斯塔

作者:vomiter


他們死亡時都是大約二十歲後半到三十歲前半的男性,在被推出 SCP-ZH-429 時才剛失去生命跡象,並且身上沾染著相當強烈的奶臭味。

翻譯展出

SCP-7795 - Ð是「一三」

作者:Dr Trintavon does not match any existing user name
譯者:Frederica Bernkastel


一旦注意到任何異常,或SCP-7795監護人員按下手動警報,ATF Zen-13應立即抵達SCP-7795所在位置,並全力阻止SCP-7795-A的發生。如果行動失敗,職員應轉為執行補救措施,使得SCP-7795能夠盡可能無痛的死亡。

故事展出

身心逐漸剝離的感覺如何呢?

作者:Reverberate_a


隨著隊伍前行,我不禁想,在所有生命發生之前,路的概念並不存在,而路,是生物在地表尋找方向留下的痕跡,造路者是奔跑的野獸,行走的人們,又或者想要從未知的彼岸帶回一方風景的探勘者。

我想我們應該是最後者。

綜合展出

命運與頑抗:序

作者:k1s10r0db00ne


而我的契斯勒羅德先生……你此刻一反志願,要活在幻夢之中。如同維度的泡沫一般,順著你原始的腦神經元作不現實的再一次生命的奇跡。你要被自己的雙手矇騙到什麽時候?你腐朽的靈魂反而在黃沙大地中尋覓到了救贖的銀光。

 本月原創作品 

早已置身事外,但有些傷口永不癒合

自然我是最後一個過橋的人,而在過橋的同時,一陣冷風從下方吹起,幾隻飛鳥由下往上竄,飛往天際,失足般的恐懼襲來,我嚇得壓低身體,真要說,魂都飛了一半。

作者/Reverberate_a

SCP-ZH-727 - 哈哈,俗投

倘若SCP-ZH-727屬於上古咒術造就的人造物件,那麼,這類上古文明的咒術孑遺無疑是令人興奮的主題,並且很可能打破Judith Low教授的「文明起源於大河,而異常文明起源於大荒」的說法。

作者/SamScript

編輯:人事資料庫〔已鎖定〕

烏然眨眨眼,按下葉博士的密碼解除鎖定,準備將系統關機。
螢幕上是好幾個視窗,包括兩個新進人員的面試紀錄、一份員工檔案,還有一份郵件。
他決定看一看。

出借於您

「這樣啊。」某個人若有所思的看向投影幕。「你覺得平行宇宙會有大家的存在嗎?」
我想無論是哪個宇宙都會有愛喝汽水的大叔還有近視很重的加班狂的。
「不過這個宇宙已經沒有了啊。」

作者/AbyssDream

命運與頑抗:序章

煙枝的迷霧滲透到電話亭的每一個角落,卻掩飾成人呼吸中吐氣的濕潤。她看向窗外是朦朧的,尾冬陽光並不剛烈。淡橘色的陽光照在她的眼瞳裏,眸中原來的棕色染成琥珀的耀光。眨了眨眼,她看向自己,恍惚之中尤如見到二十載前自己年輕的模樣。

作者/k1s10r0db00ne

舊雨新愁

「會。華語也有進步了。不過我不管理SCP的事情,你可能得問……」
「我知道。」Metha的笑容依舊甜美得無懈可擊,但Ain感覺得到周邊氣壓的變化,「他人呢?」
「你是說922還是Surge?」

作者/SamScript

 本月翻譯作品 

SCP-285 - 草率了事

在事故處特工能夠干預之前,他們竊走了倉庫內約30%的藏品。事故處幹員與蛇之手特工進入戰鬥,隨後遭到蛇之手特工壓制。事故處幹員被鎖進倉庫內,而嫌犯則開始對倉庫縱火。事故處幹員無一存活。

作者/Zer0Ne0phyte
譯者/EmptyName723

SCP-7303 - H是「健康」(Health)

懷特菲爾德:好,好喔。
達克里:但對於你得的癌症,我們沒辦法這樣做。由於無病徵也就代表著沒有腫瘤產生。所以我們需要另尋方法。
[懷特菲爾德逐漸由吸鼻子轉為無聲的啜泣。]

作者/Dysadron
譯者/gary14242

SCP-7113 - C是「封鎖」(Closers)

POI-4:從髒水跟靈質儀的反應來看,果然是水妖吧。
POI-3:剛剛那趟不也是水妖嗎?
POI-2:我同意。就是水妖了,大家回車上吧。
POI-3:等等,你們確定?我們還是找找看靈液球吧。

作者/Doctor Cimmerian
譯者/Jetttttt

SCP-7470 - M是「月光」(Moonlight)

她告訴我,月亮趕跑了所有怪物。它看守著整個夜晚,無論是參天的大樹,抑或是小小的老鼠,都逃不過它的法眼,甚至連所有茫茫大海中,甚至藏匿於海底最深處的魚,它都能看見。

作者/Its a Bad Idea
譯者/helloahuman does not match any existing user name

SCP-7972 - Y是「青年」(Youth)

烤土司機的加熱片被強行焊上了八股銅線,銅線與加熱片的縫隙間卡著兩到三根人體手骨。當加熱時,手骨會因熱漲冷縮而在土司機的鋁背板上抓饒,聲音清楚可見。

作者/minmin
譯者/ZH_mercury

SCP-7725 - S是「聖潔」(Saintly)

SCP-7725-B-1:我不是來評判你的,孩子。那是唯有主自己才能做的事。
D-1221:是的。我想您是對的。我想娶您的女兒,擁有一個美好幸福的家庭。就像您在這裡做的一樣。
SCP-7725-B-1:很好。那麼告訴我,你相信上帝嗎? 你真的相信祂嗎?

 本月藝術作品 

 編輯部資訊 

連結

加入編輯部

這份月刊才剛起步,非常歡迎任何人加入一起編輯。讓我們共同記錄繁中基金會的路程。
漫畫與專欄作品熱烈徵求中,歡迎前來#月刊編輯部投稿!
加入#月刊編輯部

« 第87期 | 第89期 »

除非特別註明,本頁內容採用以下授權方式: Creative Commons Attribution-ShareAlike 3.0 License