Entity XL-2

版式 CSS 代码

@import url('https://fonts.googleapis.com/css2?family=Nixie+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap');
 
:root {
    --body-bg: 225, 225, 225;
    --content-bg: var(--global-white-color);
    --bg-opacity: 0.9;
 
    --extra-bg-1: url(https://imagebed.pro/images/liurd/skyline.svg);
    --extra-bg-2: url(https://imagebed.pro/images/liurd/skyline.svg);
    --extra-bg-3: url(https://imagebed.pro/images/liurd/skyline.svg);
    --extra-opacity-1: 0.15;
    --extra-opacity-2: 0.05;
    --extra-opacity-3: 0.05;
 
    --topbar-hover-bg: var(--dark-ui-bg), 0.2;
    --topbar-hover-txt: var(--light-ui-txt);
 
    --user-drop-txt: var(--dark-ui-txt);
 
    --bottombar-bg: var(--dark-ui-bg);
    --bottombar-txt: var(--dark-ui-txt);
 
    --header-title: "Backrooms";
 
    --banner-title: "BACKROOMS";
    --banner-subtitle: "当色彩褪去的时候";
 
    --header-height: 3rem;
    --topbar-height: 2.5rem;
    --dropdown-height: var(--topbar-height);
    --banner-height: 25rem;
 
    --header-ui-size: 3rem;
 
    --header-title-size: 1.8rem;
    --topbar-size: clamp(0.8rem, calc(0.4rem + 0.8vw), 1.2rem);
    --banner-title-size: clamp(2rem, calc(2rem + 3.5vw), 6rem);
    --banner-subtitle-size: 1rem;
 
    --banner-font: "Nixie One", "Noto Serif SC", Franklin Gothic Medium, Franklin Gothic, ITC Franklin Gothic, Arial, serif;
    --header-font: var(--banner-font);
    --title-font: "Outfit", "Noto Sans SC", "Noto Sans TC", Franklin Gothic Medium, Franklin Gothic, ITC Franklin Gothic, Arial, sans-serif;
    --body-font: "Atkinson Hyperlegible", "Noto Sans SC", "Noto Sans TC", Arimo, Verdana, Geneva, sans-serif;
    --ui-font: "Outfit", "Noto Sans SC", "Noto Sans TC", Arimo, Verdana, Geneva, sans-serif;
}
 
#extra-div-1 {
    position: fixed;
    width: 100%;
    height: 25vh;
    bottom: 0;
    left: 0;
    z-index: -1;
    background-image: var(--extra-bg-1);
    background-size: 20rem;
    background-repeat: repeat-x;
    background-position: center;
    opacity: var(--extra-opacity-1);
}
 
#extra-div-2 {
    position: fixed;
    width: 100%;
    height: 50vh;
    bottom: 0;
    left: 0;
    z-index: -2;
    background-image: var(--extra-bg-2);
    background-size: 40rem;
    background-repeat: repeat-x;
    background-position: center;
    opacity: var(--extra-opacity-2);
}
 
#extra-div-3 {
    position: fixed;
    width: 100%;
    height: 100vh;
    bottom: 0;
    left: 0;
    z-index: -3;
    background-image: var(--extra-bg-3);
    background-size: contain;
    background-repeat: repeat-x;
    background-position: bottom;
    opacity: var(--extra-opacity-3);
}
 
#container {
    display: grid;
    grid-template-columns: minmax(var(--sidebar-width), 1fr)auto 1fr;
    grid-template-rows: auto auto auto auto;
}
 
#extrac-div-1 {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-family: var(--banner-font);
    font-weight: 200;
    width: 100%;
    height: var(--banner-height);
    color: rgb(var(--header-txt));
    order: -1;
}
 
#extrac-div-1::before {
    content: var(--banner-title);
    font-size: var(--banner-title-size);
}
 
#extrac-div-1::after {
    content: var(--banner-subtitle);
    font-size: var(--banner-subtitle-size);
}
 
#header {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    min-width: var(--sidebar-width);
    width: 100%;
    height: fit-content;
    grid-template-columns: var(--header-ui-size) 1fr auto auto;
    grid-template-rows: var(--header-ui-size) calc(var(--banner-height) - var(--header-ui-size)) auto;
    top: calc(0px - var(--banner-height));
    order: -2;
}
 
#search-top-box {
    grid-column: 3 / 4;
    position: fixed;
    right: var(--header-ui-size);
    backdrop-filter: blur(1rem);
}
 
#login-status {
    grid-column: 4 / 5;
    position: fixed;
    right: 0;
    backdrop-filter: blur(1rem);
}
 
#header h1 {
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    height: var(--header-height);
    position: static;
}
 
#header h1 a {
    justify-content: flex-start;
    padding: 0;
    padding-left: 0.5rem;
    transition: padding var(--global-duration);
}
 
#header h1 a:is(:hover, :focus) {
    padding-left: 1rem;
    transition: padding var(--global-hover-duration);
}
 
#header h2 {
    display: none;
}
 
#header-extra-div-1 {
    display: none;
}
 
#top-bar {
    grid-column: 1 / 5;
    grid-row: 3 / 4;
    height: auto;
}
 
#top-bar > div > ul {
    flex-direction: column;
    height: auto;
    margin-right: 0;
}
 
#top-bar > div > ul > li {
    flex-basis: unset;
    height: var(--topbar-height);
}
 
#top-bar > div > ul > li > a {
    justify-content: flex-end;
    padding: 0 1rem;
}
 
#top-bar > div > ul > :is(li, li:last-of-type) > ul {
    top: 0;
    left: 100%;
    width: 24em;
    max-width: max-content;
    min-width: auto;
    flex-direction: row;
    flex-wrap: wrap;
}
 
#top-bar > div > ul > li > ul > li {
    width: 10em;
    flex-grow: 1;
}
 
#top-bar > div > ul > :is(li, li:hover, li:focus, li.sfhover, li:focus-within) > ul > li > a {
    box-sizing: border-box;
}
 
#content-wrap {
    display: contents;
}
 
#side-bar {
    max-height: unset;
    overflow-y: auto;
    border: unset;
    box-shadow: 0 0 1.5rem -1rem rgb(var(--global-dark-color));
}
 
#side-bar::after {
    backdrop-filter: blur(1rem);
}
 
#main-content {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    min-height: 100vh;
    box-sizing: border-box;
    margin: 0 auto 15vh;
    padding: 1.5rem;
    box-shadow: 0 0 2.5rem -1rem rgb(var(--global-dark-color));
    position: relative;
    background: rgba(var(--content-bg), var(--bg-opacity));
}
 
#main-content::after {
    content: "你曾经来过这里.";
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 10vh;
    color: rgb(var(--header-txt));
    font-family: var(--banner-font);
    font-weight: 200;
}
 
#page-title {
    padding: 0;
}
 
:is(blockquote, .blockquote, div.blockquote, [class*=blockquote]) {
    padding: 0.5rem 1rem;
    border-width: 0 0 0 0.3rem;
    background: rgba(var(--light-block-bg), 0.4);
}
 
#page-options-container {
    font-family: var(--ui-font);
}
 
#footer {
    grid-column: 1 / 4;
    grid-row: 3 / 4;
    box-sizing: border-box;
    justify-content: flex-end;
    margin-top: 0.5rem;
    border: unset;
}
 
#license-area {
    grid-column: 1 / 4;
    grid-row: 4 / 5;
    padding: 0.5rem;
    justify-content: flex-end;
}
 
#license-area a {
    color: rgb(var(--global-pale-color));
}
 
@media only screen and (max-width: 1024px) {
  #container-wrap {
    perspective-origin: 49.5% 5rem;
  }
 
  #container {
    display: flex;
  }
 
  #header {
    min-width: var(--sidebar-width);
    grid-template-columns: var(--header-ui-size) 1fr auto auto;
    grid-template-rows: var(--header-ui-size) auto auto;
    top: 0;
    width: initial;
    position: static;
  }
 
  #content-wrap {
    display: block;
    margin: 0;
  }
 
  #login-status {
    position: relative;
    backdrop-filter: unset;
  }
 
  #search-top-box {
    position: static;
    backdrop-filter: unset;
  }
 
  #login-status #account-options {
    left: initial;
    right: 0;
  }
 
  #top-bar > div > ul {
    flex-direction: row;
    margin-right: auto;
  }
 
  #top-bar > div > ul > li {
    flex-basis: min-content;
  }
 
  #top-bar > div > ul > li > a {
    justify-content: center;
    padding: 0;
  }
 
  #top-bar > div > ul > :is(li, li:last-of-type) > ul {
    top: 100%;
    left: 0;
    width: auto;
    flex-direction: column;
  }
 
  #top-bar > div > ul > li:last-of-type > ul {
    left: initial;
    right: 0;
  }
 
  #top-bar > div > ul > li > ul > li {
    width: 100%;
    flex-grow: 1;
  }
}
 
@media only screen and (max-width: 768px) {
    #top-bar > div > ul > :is(li, li:last-of-type) > ul {
        flex-direction: row;
    }
    #top-bar > div > ul > li > ul > li {
        width: 50%;
    }
}

IETS：4D

IETS

威胁脅：4

智能：D

实体编号：XL-2
栖息地：开阔室外层级

描述

Entity XL-2或称“雾影扑朔”是一种极其罕见且仅在开阔室外层级雾天出现的实体，外形呈现为由雾组成的类人状生物，其周围通常伴随着以“雾影扑朔”为圆心半径100米¹的“雾气”。“雾气”内的温度相较于室温通常降低了10°C左右，但流浪者并不会感到寒冷。

同时，长时间吸入“雾气”将导致感官丧失，这一顺序通常是人体器官由下至上进行的，在这一过程中，时常有流浪者报告称自己丧失了方向感，常围绕着一个地方转圈的情况发生。

值得注意的是，在迷雾天气消失后，“雾影扑朔”也会一同消失，同时“雾气”范围内的一切有机生物²都会消失，目前尚未有人目睹“雾影扑朔”离开的全过程，所以也无从知晓其物品转移的方法。

行为

“雾影扑朔”会在开阔³且有迷雾的地方徘徊。一般这一行为是无目的的，但据目前研究表明，“雾影扑朔”更倾向于前往那些雾气更加浓的地方，尚不清楚这一行为的目的。

生物学特征

因“雾影扑朔”其特殊的生物学特征，故无法具体了解，据推测，“雾影扑朔”与其周围的雾气是由65%的水，15%的沼气，15%的未知物质与5%的无机物所构成。因此，不推荐流浪者在其周围使用明火或爆炸类物品，这通常会引起雾气的爆炸⁴。

同时，“雾影扑朔”再触碰到杏仁水时会与其雾气中的未知物质进行结合，使得“雾影扑朔”进入虚弱状态，在此状态下，雾气范围通常会缩小至75m²左右，同时温度回升。

---

行为准则

应当：

• 使用杏仁水泼向“雾影扑朔”。
• 尽快离开迷雾区域。
• 在迷雾天气尽量待在室内。

不应：

• 在其附近使用明火。
• 在感官被剥夺后停下休息。

来自M.E.G.的紧急公告

近期，部分流浪者报告称自己遇到“雾影扑朔”时见到了自己的“家人或亲人”，且时常可以发现其使用流浪者所熟悉的语气与方言劝说流浪者停下，目前M.E.G.正在进一步调查中。

据目前的研究表明，这些实体由“雾气”构成，且会在一定程度上加快流浪者的感官丧失进程。

因其特殊性质，现将该实体命名为“雾人”，编号为XL-2-01

安全主管：Chrieier

查看 Entity XL-2-01信息

IETS：2C+

IETS

威胁脅：2

智能：C+

描述

Entity XL-2-01或称“雾人”是“雾影扑朔”的衍生实体，仅存在于“雾影扑朔”的迷雾范围内。“雾人”的外表并不固定，通常表现为流浪者最熟悉或最亲近的人，同时还原其一切生物学特征。“雾人”在通常情况下数量最多不会超过三只。

据部分流浪者称，有时自己在见到“雾人”时会产生异样的怀旧感，这一情绪已被证实会加快感官丧失的过程，此时使用杏仁水可以一定程度上缓解这种状态。

行为

“雾人”拥有一定的智力，其会引导流浪者停留在雾气范围内，若流浪者执意离开，则会以必要的手段阻止流浪者⁵。“雾人”会使用一些简易工具来阻止流浪者离开，同时，“雾人”会劝导流浪者留在雾气内。

生物学特征

“雾人”的生理学特征与“雾影扑朔”极其相似，据推测，“雾人”的构成成分与“雾影扑朔”一致，为一种易燃易爆气体。

若流浪者击杀“雾人”会导致雾气面积减小，但温度将会继续下降。“雾人”也可与杏仁水发生特殊反应，且也会作用于“雾影扑朔”身上。

---

行为准则

应当：

• 不要将其当做亲人。
• 击杀后降低自己的负罪感。

不应：

• 听从其话语。
• 因负罪敢而不敢击杀。

---

浓雾弥漫

作者：hjonhii333666

Footnotes

1. 面积大约200㎡左右

2. 不包含植物与无法被分解的衣物等。

3. 这一地区面积通常需要大于1000m²。

4. 爆炸通常会释放出每m³雾气×15克TNT炸药左右的能量。

5. 力量与未经过训练的成年健壮男子相当。