SCP Foundation

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300&display=swap');

body {
—apcs-border-color: #ccc;
—apcs-bg-color: white;
—apcs-fg-color: black;
—apcs-info-bg-color: #ccc;
—apcs-info-fg-color: black;
—apcs-info-shadow-color: rgba(0,0,0,0.7);
—apcs-vedist-bg-color: #505052;
—apcs-vedist-fg-color: white;
—apcs-hazard-icon-filter: none;
—apcs-hazard-icon-color: none;
apcs-hazard-icon1-color: var(apcs-hazard-icon-color);
apcs-hazard-icon2-color: var(apcs-hazard-icon-color);
apcs-hazard-icon3-color: var(apcs-hazard-icon-color);
apcs-hazard-icon4-color: var(apcs-hazard-icon-color);
apcs-hazard-icon5-color: var(apcs-hazard-icon-color);
apcs-hazard-icon6-color: var(apcs-hazard-icon-color);
apcs-info-line1-color: var(apcs-fg-color);
apcs-info-line2-color: var(apcs-fg-color);
apcs-info-line3-color: var(apcs-fg-color);
}

.apcs-wrapper {
container: apcs / inline-size;
}

.apcs-container {
border: 1px solid var(—apcs-border-color);
background: var(—apcs-bg-color);
color: var(—apcs-fg-color);
padding-bottom: 30px;
font-family: Oswald, sans-serif;
position: relative;
}
.apcs-container * {
margin: 0;
padding: 0;
box-sizing: border-box;
}
.apcs-container br {
display: none;
}
.apcs-container .apcs-main-content {
padding: 0 28px;
justify-content: space-between;
align-items: center;
display: flex;
}
.apcs-container .apcs-confidential {
font-size: 36px;
line-height: 36px;
}
.apcs-container .apcs-confidential, .apcs-container .apcs-confidential:visited {
color: var(—apcs-fg-color);
}
.apcs-header {
width: 256px;
padding-top: 14px;
}
.apcs-container .apcs-text-lines {
font-size: 15px;
line-height: 21px;
margin-top: 26px;
min-height: 64px;
max-width: none !important; /* BHL compatibility */
}
.apcs-container .apcs-text-lines *[data-content^="{$"]::before {
content: '';
display: inline !important;
}
.apcs-container .apcs-text-lines *[data-content^="{$"] * {
display: none;
}
.apcs-container .apcs-text-lines div:nth-child(1) {
color: var(—apcs-info-line1-color);
}
.apcs-container .apcs-text-lines div:nth-child(2) {
color: var(—apcs-info-line2-color);
}
.apcs-container .apcs-text-lines div:nth-child(3) {
color: var(—apcs-info-line3-color);
}
.apcs-hazards {
display: flex;
align-items: center;
margin-right: 32px;
height: 90px;
justify-content: center;
}
.apcs-hazards > div {
position: relative;
}
.apcs-hazards .apcs-hazard {
width: 75px;
height: 75px;
background-size: contain !important;
background-position: center !important;
flex-shrink: 0;
margin: 2px;
position: relative;
filter: var(—apcs-hazard-icon-filter);
background-blend-mode: soft-light;
}
.apcs-hazards div:hover .apcs-tooltip {
display: block;
}
/* this implements optional arguments */
.apcs-hazards div[data-hazard-type^="{$"],
.apcs-hazards div[data-hazard-type="none"] {
display: none;
}
.apcs-class {
width: 100px;
height: 90px;
display: flex;
align-items: center;
justify-content: center;
font-size: 64px;
line-height: 0;
background: var(—custom-color);
flex-shrink: 0;
—letter: attr(data-non-standard);
—name: attr(data-non-standard-tooltip);
color: white;
position: relative;
}
.apcs-class[data-non-standard^="{$"] {
—letter: '?';
}
.apcs-class::before {
content: var(—letter);
}
.apcs-class .apcs-class-name::before {
content: var(—name);
}
.apcs-class[style^="—custom-color: {$"] {
background: #31869b;
}
.apcs-class.keter {
background: #b80000;
—letter: 'K';
—name: 'Кетер';
}
.apcs-class.euclid {
background: #ffc000;
—letter: 'E';
—name: 'Евклид';
}
.apcs-class.safe {
background: #4e6c77;
—letter: 'S';
—name: 'Безопасный';
}
.apcs-class.thaumiel {
background: #7c35b1;
—letter: 'T';
—name: 'Таумиэль';
}
.apcs-class.neutralized {
background: #dddddd;
—letter: 'N';
—name: 'Нейтрализованный';
color: black;
}
.apcs-class.uncontained {
background: black;
—letter: 'Ȼ';
—name: 'Не содержится';
color: white;
}
.apcs-class.uncontained::before {
position: relative;
top: -6px;
}
.apcs-class:hover .apcs-tooltip {
display: block;
}
.apcs-class span[data-non-standard-tooltip^="{$"] {
—name: 'Нестандартный';
}
.apcs-info {
position: absolute;
right: 0;
bottom: 0;
height: 30px;
display: flex;
align-items: stretch;
background: var(—apcs-info-bg-color);
color: var(—apcs-info-fg-color);
clip-path: polygon(30px 0, 100% 0, 100% 100%, 0 100%);
font-size: 18px;
line-height: 18px;
pointer-events: none;
max-width: 100%;
white-space: nowrap;
}
/* this is a special duplicate div that handles mouse events and contains tooltips that are not clipped */
.apcs-info-tooltips {
pointer-events: all;
background: none;
clip-path: none;
}
.apcs-info-tooltips::after {
display: none;
}
.apcs-info-tooltips > * {
clip-path: none !important;
background: transparent !important;
color: transparent !important;
}
.apcs-info::after {
box-shadow: inset 5px 5px 4px -4px var(—apcs-info-shadow-color);
z-index: 0;
position: absolute;
content: ' ';
left: 0; right: 0; top: 0; bottom: 0;
pointer-events: none;
transform: skew(-45deg) translate(16px, 0);
}
.apcs-info-activation {
width: 328px;
padding: 0 30px;
display: flex;
align-items: center;
justify-content: center;
}
.apcs-info-number {
width: 162px;
padding-left: 15px;
margin-left: -30px;
display: flex;
align-items: center;
justify-content: center;
}
.apcs-info-vedist {
background: var(—apcs-vedist-bg-color);
clip-path: polygon(30px 0, 100% 0, calc(100% - 30px) 100%, 0 100%);
padding: 0 30px;
display: flex;
align-items: center;
justify-content: center;
color: var(—apcs-vedist-fg-color);
width: 128px;
margin-left: -31px;
—title: '?';
—tooltip: '';
position: relative;
}
.apcs-info-vedist.vedist-1:hover .apcs-tooltip,
.apcs-info-vedist.vedist-2:hover .apcs-tooltip,
.apcs-info-vedist.vedist-3:hover .apcs-tooltip,
.apcs-info-vedist.vedist-4:hover .apcs-tooltip,
.apcs-info-vedist.vedist-5:hover .apcs-tooltip,
.apcs-info-vedist.vedist-6:hover .apcs-tooltip {
display: block;
}
.apcs-info-vedist .apcs-tooltip::after {
content: var(—tooltip);
}
.apcs-info-vedist::before {
content: var(—title);
}
.apcs-info-vedist.vedist-1 {
—title: 'Vedist I';
—tooltip: 'Уровень угрозы секретности: Сорванный маскарад';
}
.apcs-info-vedist.vedist-2 {
—title: 'Vedist II';
—tooltip: 'Уровень угрозы секретности: Далёкая гроза';
}
.apcs-info-vedist.vedist-3 {
—title: 'Vedist III';
—tooltip: 'Уровень угрозы секретности: Падший ангел';
}
.apcs-info-vedist.vedist-4 {
—title: 'Vedist IV';
—tooltip: 'Уровень угрозы секретности: Перст указующий';
}
.apcs-info-vedist.vedist-5 {
—title: 'Vedist V';
—tooltip: 'Уровень угрозы секретности: Острая бритва';
}
.apcs-info-vedist.vedist-6 {
—title: 'Vedist VI';
—tooltip: 'Уровень угрозы секретности: Вакуум';
}
.apcs-info-risk {
background: var(—apcs-info-bg-color);
clip-path: polygon(30px 0, 100% 0, calc(100% - 30px) 100%, 0 100%);
padding: 0 30px;
margin-left: -30px;
display: flex;
align-items: center;
justify-content: center;
color: white;
width: 128px;
position: relative;
—risk-letter: attr(data-containment-risk);
—tooltip: '';
}
.apcs-info-risk::after {
content: var(—risk-letter);
}
.apcs-info-risk .apcs-tooltip::after {
content: var(—tooltip);
}
.apcs-info-risk.risk-Q, .apcs-info-risk[data-containment-risk^="{$"] {
—risk-letter: '?';
—tooltip: 'Недостаточно данных для расчета';
color: black;
}
.apcs-info-risk.risk-TS {
—risk-letter: 'Ȼ';
—tooltip: 'Содержание невозможно';
background: #848484;
}
.apcs-info-risk.risk-TS::before {
position: relative;
top: -1px;
}
.apcs-info-risk.risk-AAA {
—tooltip: 'Нарушение ОУС является неизбежным при любых возможных мерах сдерживания';
background: black;
}
.apcs-info-risk.risk-EEE {
—tooltip: 'Вероятность нарушения ОУС исключена';
background: white;
color: black;
}
.apcs-info-risk.risk-T {
—tooltip: 'Не представляет угрозы';
background: #7c35b1;
}
.apcs-info-risk.risk-A5,
.apcs-info-risk.risk-B5,
.apcs-info-risk.risk-C5,
.apcs-info-risk.risk-D5,
.apcs-info-risk.risk-E5,
.apcs-info-risk.risk-C4,
.apcs-info-risk.risk-D4,
.apcs-info-risk.risk-E4 {
background: #4e6c77;
}
.apcs-info-risk.risk-A4,
.apcs-info-risk.risk-B4,
.apcs-info-risk.risk-B3,
.apcs-info-risk.risk-C3,
.apcs-info-risk.risk-D3,
.apcs-info-risk.risk-E3,
.apcs-info-risk.risk-D2,
.apcs-info-risk.risk-E2 {
background: #ffa500;
}
.apcs-info-risk.risk-A3,
.apcs-info-risk.risk-A2,
.apcs-info-risk.risk-B2,
.apcs-info-risk.risk-C2,
.apcs-info-risk.risk-KC,
.apcs-info-risk.risk-KETER {
background: #fd0000;
}
.apcs-info-risk.risk-KC {
—risk-letter: attr(data-k-class);
—tooltip: 'Тип конца света, к которому может привести нарушение ОУС';
}
.apcs-info-risk.risk-AAA:hover .apcs-tooltip,
.apcs-info-risk.risk-EEE:hover .apcs-tooltip,
.apcs-info-risk.risk-T:hover .apcs-tooltip,
.apcs-info-risk.risk-KC:hover .apcs-tooltip,
.apcs-info-risk.risk-TS:hover .apcs-tooltip,
.apcs-info-risk.risk-Q:hover .apcs-tooltip {
display: block;
}
.apcs-tooltip {
font-family: "Inter", sans-serif;
padding: 4px 8px;
font-size: 11px;
line-height: 16px;
border: 1px solid #333;
background: rgba(255,255,230,0.9);
position: absolute;
top: calc(100% - 8px);
left: 20px;
display: none;
z-index: 9999;
white-space: nowrap;
color: black;
filter: none;
}
/* версия для маленьких десктопов */
@container apcs (max-width: 840px) {
.apcs-container .apcs-main-content {
padding: 14px;
}
.apcs-header {
padding-top: 0;
}
.apcs-header .apcs-confidential {
font-size: 29px;
line-height: 29px;
}
.apcs-container .apcs-text-lines {
font-size: 12px;
line-height: 18px;
}
.apcs-hazards {
margin-right: 16px;
height: 80px;
}
.apcs-hazards .apcs-hazard {
width: 60px;
height: 60px;
}
.apcs-class {
width: 80px;
height: 80px;
}
}
/* мобильная версия для не до конца всратых экранов */
@container apcs (max-width: 670px) {
.apcs-container {
display: flex;
flex-direction: column;
padding-bottom: 0;
}
.apcs-container .apcs-main-content {
flex-direction: column;
align-items: flex-start;
padding: 14px;
}
.apcs-container .apcs-header {
max-width: calc(100% - 90px - 16px) !important;
}
.apcs-class {
position: absolute;
right: 14px;
top: 14px;
width: 90px;
height: 90px;
}
.apcs-info {
position: relative;
flex-wrap: wrap;
clip-path: none;
height: auto;
left: 0;
}
.apcs-info > * {
min-height: 30px;
flex-grow: 1;
border-top: 1px solid var(—apcs-vedist-bg-color);
}
.apcs-info::after {
transform: none;
clip-path: none;
}
.apcs-info-tooltips {
position: absolute;
}
.apcs-info-activation {
width: 100%;
}
.apcs-info-risk {
margin-left: 0;
padding-left: 15px;
clip-path: polygon(0 0, 100% 0, calc(100% - 30px) 100%, 0 100%);
width: 48px;
}
.apcs-info-vedist {
width: 80px;
}
.apcs-info-number {
padding-right: 7px;
padding-left: 30px;
width: 72px;
}
.apcs-hazards {
margin: 24px 0;
justify-content: space-around;
width: 100%;
height: auto;
}
.apcs-hazards .apcs-hazard {
width: 50px;
height: 50px;
}
.apcs-tooltip {
white-space: normal;
text-align: center;
width: auto;
left: 50%;
transform: translateX(-50%);
min-width: 100%;
top: 100%;
}
}
/* мобильная версия для всратых экранов */
@container apcs (max-width: 372px) {
.apcs-hazards {
margin-top: 0;
margin-bottom: 32px;
justify-content: center;
}
.apcs-hazards div {
position: relative;
margin-left: -16px;
}
.apcs-hazards div:first-of-type {
margin-left: 0;
}
.apcs-hazards div:nth-child(even) {
top: -16px;
}
.apcs-hazards div:nth-child(odd) {
top: 16px;
}
.apcs-hazards div:first-child:last-child {
top: 0;
}
}
[[/module]]

Особые условия содержания: На настоящий момент SCP-1376 содержится в стандартной ячейке хранилища Зоны 7 под кодовым замком. Опыты с участием SCP-1376 должны проводиться с одобрения одного сотрудника с уровнем допуска 3.

Описание: SCP-1376 представляет собой устройство дополненной реальности; производитель неизвестен. Конструкция объекта чем-то напоминает телефонную будку размерами 2,5x2,5x3 м с вмонтированными плазменными экранами. Как выяснилось, экраны обладают таким свойством, как динамичная плотность пикселей, следствием этого стало то, что разрешение каждого экрана измерить не представляется возможным. На данный момент не удалось установить максимальное значение PPI¹, так как плотность пикселей напрямую зависит от измерительного оборудования или от наблюдателя. Такими же признаками обладает и показатель частоты обновления каждого из экранов. Устройство запрограммировано на полное погружение пользователя, попавшего внутрь, в запущенное программное обеспечение, будь то видеоигра, средство для просмотра фотографий и т.д. Свойства объекта проявляются тогда, когда запущена любая из видеоигр, совместимая с операционной системой, разработанной и установленной производителем на SCP-1376. Известно, что примерно 80% видеоигр, совместимых с операционной системой (далее ОС) Windows, могут быть успешно установлены и запущены на устройстве. Экспериментальным путём было выявлено, что при получении персонажем запущенной видеоигры каких-либо повреждений, они отражаются на субъекте, помещённом в SCP-1376.