Оракул Теней Лили-Дейла

[html]<!DOCTYPE html>
<html lang="ru">
<head>

<title>Lily Dale — Oracle of Shadows</title>

<style>

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600;700&family=Montserrat:wght@400;500;600&display=swap');

/* =========================================================
ОСНОВНЫЕ ЦВЕТА
========================================================= */

:root {

--bg: #1d241f;
--bg2: #111612;

--panel: #2c352d;
--panel2: #39443a;

--gold: #b69a63;
--gold-light: #e2d2ad;

--text: #e7dfcf;
--muted: #b5aa99;

--light: #c6a36a;
--shadow: #7d6878;

--border: #536052;
}

/* =========================================================
RESET
========================================================= */

* {
box-sizing: border-box;
}

/* =========================================================
BODY
========================================================= */

body {

margin: 0;

background:

radial-gradient(
circle at 50% 0%,
rgba(116,75,52,.28),
transparent 45%
),

linear-gradient(
180deg,
#263128 0%,
#111612 100%
);

color: var(--text);

font-family:
'Montserrat',
sans-serif;
}

/* =========================================================
ОСНОВНОЙ КОНТЕЙНЕР
========================================================= */

.oracle {

width:
min(1150px, 94%);

margin:
0 auto;

padding:
55px 0 80px;
}

/* =========================================================
ГЛАВНАЯ ШАПКА
========================================================= */

.header {

text-align: center;

margin-bottom: 25px;

padding: 30px 25px;

background:
linear-gradient(
145deg,
#344239,
#1b241e
);

border:
1px solid #65705c;

position: relative;
}

.header::before {

content: "";

position: absolute;

left: 0;
top: 0;

width: 3px;
height: 100%;

background:
linear-gradient(
180deg,
transparent,
var(--gold),
transparent
);

opacity: .65;
}

.header h1 {

margin: 0;

font-family:
'Cormorant Garamond',
serif;

font-size:
clamp(40px, 7vw, 68px);

font-weight: 500;

letter-spacing: 5px;

text-transform: uppercase;

color: var(--gold-light);
}

.subtitle {

margin-top: 5px;

font-family:
'Cormorant Garamond',
serif;

font-size: 24px;

font-style: italic;

color: var(--muted);
}

.ornament {

margin-top: 12px;

color: var(--gold);

letter-spacing: 12px;
}

/* =========================================================
КНОПКИ РАЗДЕЛОВ
========================================================= */

.sections {

display: flex;

justify-content: center;

flex-wrap: wrap;

gap: 9px;

margin-bottom: 20px;
}

.section-button {

border:
1px solid #596557;

background:
linear-gradient(
145deg,
#344239,
#222c25
);

color: #b1aba2;

padding:
13px 18px;

cursor: pointer;

font-family:
'Montserrat',
sans-serif;

font-size: 10px;

letter-spacing: 1.4px;

text-transform: uppercase;

transition:
all .25s ease;

box-shadow:
0 3px 10px rgba(0,0,0,.18);
}

.section-button:hover {

border-color:
var(--gold);

color:
var(--gold-light);

background:
linear-gradient(
145deg,
#4c382b,
#2b211c
);
}

.section-button.active {

background:
linear-gradient(
145deg,
#5a402c,
#30231c
);

border-color:
var(--gold);

color:
var(--gold-light);

box-shadow:
0 0 15px rgba(184,135,74,.09);
}

/* =========================================================
ОПИСАНИЕ КОЛОДЫ
========================================================= */

.deck-description {

margin:
0 auto 25px;

max-width:
900px;

padding:
22px 30px;

background:
linear-gradient(
145deg,
#344239,
#1b241e
);

border:
1px solid #65705c;

position:
relative;

text-align:
center;

box-shadow:
0 5px 18px rgba(0,0,0,.12);
}

.deck-description::before {

content: "";

position: absolute;

left: 0;
top: 0;

width: 3px;
height: 100%;

background:
linear-gradient(
180deg,
transparent,
var(--gold),
transparent
);

opacity: .6;
}

.deck-description-title {

margin-bottom: 12px;

font-family:
'Cormorant Garamond',
serif;

font-size: 22px;

letter-spacing: 2.5px;

color: var(--gold-light);
}

.deck-description p {

max-width:
820px;

margin:
9px auto;

color:
#b0a395;

font-size:
13px;

line-height:
1.75;
}

.deck-description strong {

color:
#d5c8b6;

font-weight:
500;
}

.deck-description em {

color:
#c9bcab;
}

.light-word {

color:
var(--light);
}

.shadow-word {

color:
var(--shadow);
}

.deck-note {

margin-top:
15px;

padding-top:
13px;

border-top:
1px solid #493a30;

color:
var(--gold);

font-family:
'Cormorant Garamond',
serif;

font-size:
16px;

font-style:
italic;
}

.draw-card-link {
margin-top: 18px;
display: flex;
justify-content: center;
}

.draw-card-link a {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 250px;
padding: 12px 24px;
border: 1px solid var(--gold);
background:
linear-gradient(
145deg,
#5a402c,
#30231c
);
color: var(--gold-light);
text-decoration: none;
font-family: 'Montserrat', sans-serif;
font-size: 10px;
font-weight: 500;
letter-spacing: 1.5px;
text-transform: uppercase;
box-shadow:
0 3px 12px rgba(0,0,0,.20);
transition:
all .25s ease;
}

.draw-card-link a::before {
content: "✦";
margin-right: 9px;
color: var(--gold);
}

.draw-card-link a:hover {
color: #ffffff;
border-color: var(--gold-light);
background:
linear-gradient(
145deg,
#6a4930,
#3a2a20
);
box-shadow:
0 0 18px rgba(182,154,99,.16);
transform: translateY(-2px);
}

.draw-card-link a:active {
transform: translateY(0);
}

/* =========================================================
ПОЯВЛЕНИЕ РАЗДЕЛА
========================================================= */

.section-wrapper {

animation:
sectionAppear .35s ease;
}

@keyframes sectionAppear {

from {

opacity: 0;

transform:
translateY(-8px);
}

to {

opacity: 1;

transform:
translateY(0);
}
}

/* =========================================================
ЗАГОЛОВОК РАЗДЕЛА
========================================================= */

.section-intro {

background:
linear-gradient(
145deg,
#344239,
#1b241e
);

border:
1px solid #65705c;

padding:
28px 35px;

margin-bottom:
20px;

text-align:
center;

position:
relative;
}

.section-intro::before {

content: "";

position: absolute;

left: 0;
top: 0;

width: 3px;
height: 100%;

background:
linear-gradient(
180deg,
transparent,
var(--gold),
transparent
);

opacity: .55;
}

.section-intro h2 {

margin:
0 0 9px;

font-family:
'Cormorant Garamond',
serif;

font-size:
36px;

font-weight:
500;

color:
var(--gold-light);
}

.section-intro p {

max-width:
780px;

margin:
0 auto;

color:
#b0a395;

font-size:
12px;

line-height:
1.8;
}

/* =========================================================
СЕТКА КАРТ
========================================================= */

.cards {

display:
grid;

grid-template-columns:
repeat(2, minmax(0, 1fr));

gap:
18px;
}

/* =========================================================
КАРТА
========================================================= */

.card {

background:
linear-gradient(
145deg,
#344239,
#1b241e
);

border:
1px solid #65705c;

padding:
28px;

position:
relative;

overflow:
hidden;

transition:
border-color .25s ease,
transform .25s ease;
}

.card:hover {

transform:
translateY(-3px);

border-color:
#765a43;
}

.card::before {

content: "";

position: absolute;

left: 0;
top: 0;

width: 3px;
height: 100%;

background:
linear-gradient(
180deg,
transparent,
var(--gold),
transparent
);

opacity: .55;
}

/* =========================================================
ЗАГОЛОВОК КАРТЫ
========================================================= */

.card-header {

display:
flex;

align-items:
flex-start;

gap:
18px;

margin-bottom:
20px;
}

.card-symbol {

min-width:
55px;

height:
55px;

display:
flex;

align-items:
center;

justify-content:
center;

border:
1px solid #66503e;

color:
var(--gold-light);

font-size:
27px;

background:
rgba(13,10,8,.28);
}

.card-number {

color:
var(--muted);

font-size:
9px;

letter-spacing:
2px;

margin-bottom:
4px;
}

.card-name {

margin:
0;

font-family:
'Cormorant Garamond',
serif;

font-size:
29px;

font-weight:
500;

color:
var(--gold-light);

text-transform:
uppercase;

line-height:
1;
}

/* =========================================================
ЧТО ОТРАЖАЕТ
========================================================= */

.reflection {

margin-bottom:
20px;

padding:
16px 18px;

background:
rgba(255,255,255,.025);

border-left:
1px solid #655745;
}

.label {

display:
block;

margin-bottom:
7px;

color:
var(--gold);

font-size:
9px;

letter-spacing:
2px;

text-transform:
uppercase;
}

.reflection p {

margin:
0;

color:
#c8bdb0;

font-size:
12px;

line-height:
1.7;
}

/* =========================================================
СВЕТ / ТЕНЬ
========================================================= */

.meanings {

display:
grid;

grid-template-columns:
1fr 1fr;

gap:
12px;
}

.meaning {

padding:
17px;

border:
1px solid #4b3a30;
}

.meaning.light {

background:
linear-gradient(
145deg,
rgba(213,168,93,.10),
rgba(213,168,93,.025)
);
}

.meaning.shadow {

background:
linear-gradient(
145deg,
rgba(128,104,120,.10),
rgba(128,104,120,.025)
);
}

.meaning-title {

margin-bottom:
10px;

font-size:
10px;

letter-spacing:
1.7px;

text-transform:
uppercase;
}

.light .meaning-title {

color:
var(--light);
}

.shadow .meaning-title {

color:
var(--shadow);
}

.meaning p {

margin:
0;

color:
#b0a395;

font-size:
11px;

line-height:
1.65;
}

/* =========================================================
ШЁПОТ КАРТЫ
========================================================= */

.whisper {

margin-top:
20px;

padding-top:
17px;

border-top:
1px solid #493a30;

text-align:
center;

font-family:
'Cormorant Garamond',
serif;

font-size:
18px;

font-style:
italic;

color:
#c8bdb0;
}

.whisper::before {

content:
"✦ ";

color:
var(--gold);
}

.whisper::after {

content:
" ✦";

color:
var(--gold);
}

/* =========================================================
АДАПТИВ
========================================================= */

@media(max-width: 760px) {

.cards {

grid-template-columns:
1fr;
}

}

@media(max-width: 520px) {

.oracle {

width:
92%;

padding-top:
30px;
}

.header {

padding:
25px 18px;
}

.header h1 {

font-size:
40px;

letter-spacing:
3px;
}

.subtitle {

font-size:
21px;
}

.section-button {

width:
100%;
}

.section-intro {

padding:
24px 20px;
}

.section-intro h2 {

font-size:
30px;
}

.deck-description {

padding:
20px 18px;
}

.meanings {

grid-template-columns:
1fr;
}

.card {

padding:
22px;
}

}

</style>

</head>

<body>

<div class="subtitle">
Oracle of Shadows
</div>

</header>

<button
class="section-button"
data-section="boundary">
I · Граница
</button>

<button
class="section-button"
data-section="memory">
IV · Память
</button>

<button
class="section-button"
data-section="ritual">
V · Ритуал
</button>

<button
class="section-button"
data-section="places">
VI · Места силы
</button>

<button
class="section-button"
data-section="shadow">
VII · Тень города
</button>

</nav>

<div class="deck-description-title">
✦ ОРАКУЛ ЛИЛИ-ДЕЙЛА ✦
</div>

<p>
<strong>Oracle of Shadows</strong> — мистическая колода из
47 карт, вдохновлённая викканской традицией, спиритуализмом
Лили-Дейла и атмосферой мистического сериала.
</p>

<p>
Каждая карта имеет две стороны —
<span class="light-word">Свет</span> и
<span class="shadow-word">Тень</span>.
Одна и та же карта может показать как возможность, подсказку
и внутренний ресурс, так и скрытую проблему, опасность или
то, что пока остаётся за завесой.
</p>

<p>
В колоде переплетаются
<em>
места силы, духи, ведьминские ритуалы,
городские легенды, тайны прошлого
и тёмная сторона Лили-Дейла
</em>.
Поэтому карты могут говорить не только о будущем,
но и о событиях, персонажах, отношениях и случайностях,
которые способны произойти.
</p>

✦ Выберите раздел выше, чтобы открыть карты
и познакомиться с их значениями.

<div class="draw-card-link">
<a href="https://lilymists.rusff.me/viewtopic.php?id=173" id="drawCardLink" target="_blank" rel="noopener noreferrer">
Вытянуть карту можно здесь
</a>
</div>

</div>

</section>

</div>

/* =========================================================
КОЛОДА
========================================================= */

const sections = {

/* =========================================================
I. ГРАНИЦА
========================================================= */

boundary: {

title:
"I. ГРАНИЦА",

description:
"Карты перехода. Они появляются тогда, когда привычный мир начинает соприкасаться с неизвестным — когда открывается дверь, возникает выбор или становится тонкой граница между реальностью и Потусторонним.",

cards: [

{
number:"01",
name:"Ворота",
symbol:"⟐",

reflection:
"Начало пути, пересечение границы, момент, когда прежнее состояние заканчивается, а новое ещё не определилось.",

light:
"Новая возможность, приглашение, перемены, начало нового пути. Карта говорит, что перед вами открывается пространство для выбора и движения вперёд.",

shadow:
"Необратимое решение, опасный переход или последствия, которые уже невозможно отменить. Иногда ворота открываются только один раз.",

whisper:
"Ты уже переступил порог."
},

{
number:"02",
name:"Зеркало",
symbol:"◈",

reflection:
"Отражение собственной природы. Карта заставляет увидеть то, что человек обычно предпочитает не замечать.",

light:
"Самопознание, честность с собой, понимание собственных желаний и истинных мотивов.",

shadow:
"Самообман, иллюзия и встреча со скрытой стороной личности. Отражение может показать не правду, а то, чего вы боитесь.",

whisper:
"Отражение тоже умеет лгать."
},

{
number:"03",
name:"Завеса",
symbol:"☾",

reflection:
"Тонкая граница между видимым и невидимым. То, что существует рядом, но пока не может быть полностью понято.",

light:
"Интуиция, тайное знание, ощущение присутствия, способность почувствовать то, что ещё не получило объяснения.",

shadow:
"Неизвестность, тайна и опасное соприкосновение с Потусторонним. За завесой может находиться нечто, что лучше было не будить.",

whisper:
"По ту сторону кто-то ждёт."
},

{
number:"04",
name:"Ключ",
symbol:"⚿",

reflection:
"Знание или возможность, которые позволяют открыть закрытое. Символ доступа к тайне.",

light:
"Разгадка, решение, возможность открыть дверь или понять то, что раньше оставалось непонятным.",

shadow:
"Опасное знание, чрезмерное любопытство и последствия открытия того, что должно было оставаться закрытым.",

whisper:
"Не каждая дверь должна быть открыта."
},

{
number:"05",
name:"Перекрёсток",
symbol:"✣",

reflection:
"Момент выбора, когда дальнейший путь зависит не от обстоятельств, а от собственного решения.",

light:
"Возможность изменить будущее, выбрать новое направление и выйти из привычного сценария.",

shadow:
"Сомнения, сложный выбор и необходимость заплатить определённую цену за принятое решение.",

whisper:
"Любой путь что-нибудь отнимет."
},

{
number:"06",
name:"Лунная дорога",
symbol:"☽",

reflection:
"Путь, который виден лишь частично. Дорога интуиции, ночных решений и неизвестного будущего.",

light:
"Интуитивный путь, путешествие, открытие нового и способность довериться внутреннему ориентиру.",

shadow:
"Иллюзия, заблуждение или неверный ориентир. Лунный свет показывает дорогу, но не обязательно приводит туда, куда вы ожидали.",

whisper:
"Луна показывает не всю дорогу."
},

{
number:"07",
name:"Дверь",
symbol:"▢",

reflection:
"Конкретная возможность войти в новую ситуацию. В отличие от Ворот, Дверь всегда предполагает неизвестное пространство по ту сторону.",

light:
"Приглашение, новый этап, возможность или шанс изменить привычный ход событий.",

shadow:
"Риск, неизвестность и последствия решения войти туда, откуда может не быть простого выхода.",

whisper:
"Ты не знаешь, что находится за ней."
}

]

/* =========================================================
II. ЛЕС
========================================================= */

forest: {

title:
"II. ЛЕС",

description:
"Лес Лили-Дейла — территория инстинктов, древней памяти и существ, которые не обязаны следовать человеческим правилам.",

cards: [

{
number:"08",
name:"Leolyn Woods",
symbol:"🌲",

reflection:
"Древний лес как живое пространство памяти. Место, где человеческий голос становится тише, а интуиция — громче.",

light:
"Природа, древнее знание, интуиция и способность услышать собственные ощущения.",

shadow:
"Тайна, потеря ориентира и скрытое присутствие. Лес может хранить то, что не хочет быть найденным.",

whisper:
"Лес помнит."
},

{
number:"09",
name:"Fairy Trail",
symbol:"✧",

reflection:
"Территория чудес, маленьких дверей и существ, которые существуют рядом с человеческим миром.",

light:
"Магия, неожиданная помощь, чудо и удачная случайность.",

shadow:
"Искушение, сделка или обещание. Полученный дар может потребовать платы.",

whisper:
"У каждого дара есть цена."
},

{
number:"10",
name:"Старый дуб",
symbol:"♧",

reflection:
"Символ корней, рода, долголетия и памяти, которая переживает поколения.",

light:
"Стабильность, наследие, семейная сила и возможность опереться на прошлое.",

shadow:
"Семейные обязательства и прошлое, от которого невозможно легко избавиться.",

whisper:
"Слишком глубокие корни трудно вырвать."
},

{
number:"11",
name:"Ворон",
symbol:"♠",

reflection:
"Проводник между мирами и носитель сообщений. Ворон замечает то, что человек пропускает.",

light:
"Послание, знание, предупреждение или помощь в поиске пути.",

shadow:
"Дурное предчувствие, тревожная новость или знак приближающихся перемен.",

whisper:
"Он знает дорогу между мирами."
},

{
number:"12",
name:"Олень",
symbol:"♢",

reflection:
"Чуткость и способность чувствовать опасность раньше, чем она становится очевидной.",

light:
"Осторожность, интуиция, доверие собственным ощущениям и мягкая сила.",

shadow:
"Страх, бегство и нерешительность, которые заставляют свернуть с правильного пути.",

whisper:
"Следуй тихо."
},

{
number:"13",
name:"Круг камней",
symbol:"◯",

reflection:
"Защищённое пространство, где энергия замыкается внутри круга.",

light:
"Защита, равновесие, единство и сила сообщества.",

shadow:
"Замкнутый цикл, повторение событий и невозможность выбраться из привычного сценария.",

whisper:
"Круг можно замкнуть."
},

{
number:"14",
name:"Дикая роза",
symbol:"❀",

reflection:
"Красота, в которой одновременно заключены нежность и опасность.",

light:
"Любовь, привлекательность, страсть и способность защищать то, что дорого.",

shadow:
"Ревность, боль, опасное притяжение и отношения, в которых нежность соседствует с раной.",

whisper:
"У каждой розы есть шипы."
}

]

/* =========================================================
III. ДУХИ
========================================================= */

spirits: {

title:
"III. ДУХИ",

description:
"Сердце спиритуалистического Лили-Дейла. Эти карты говорят о контакте с умершими, посланиях, медиумах, памяти и вопросе: действительно ли тот, кто отвечает, тот, кого вы звали?",

cards: [

{
number:"15",
name:"Inspiration Stump",
symbol:"♨",

reflection:
"Место встречи живого и невидимого. Символ вопроса, который задаётся миру в надежде получить ответ.",

light:
"Послание, ответ, контакт с прошлым или возможность услышать важную информацию.",

shadow:
"Ложный голос, опасный контакт или ответ, которому слишком сильно хочется поверить.",

whisper:
"Ты уверен, что хочешь знать, кто говорит?"
},

{
number:"16",
name:"Медиум",
symbol:"☿",

reflection:
"Посредник между мирами. Человек или сущность, через которых информация становится доступной.",

light:
"Совет, помощь, связь, возможность увидеть ситуацию с другой стороны.",

shadow:
"Манипуляция, ложное предсказание или человек, который использует чужую веру.",

whisper:
"Он говорит то, что хочет услышать сам."
},

{
number:"17",
name:"Шёпот",
symbol:"〰",

reflection:
"Едва различимый знак, который можно услышать только если остановиться и прислушаться.",

light:
"Интуиция, скрытое сообщение, внутреннее знание.",

shadow:
"Слухи, сомнения и информация, которая может оказаться ложной.",

whisper:
"Ты услышал это не случайно."
},

{
number:"18",
name:"Призрак",
symbol:"☠",

reflection:
"Прошлое, которое продолжает существовать в настоящем.",

light:
"Память, наследие, незавершённая история и возможность получить помощь от прошлого.",

shadow:
"Событие или человек, которые не хотят уходить и продолжают влиять на настоящую жизнь.",

whisper:
"Он не собирается уходить."
},

{
number:"19",
name:"Послание",
symbol:"✉",

reflection:
"Информация, которая должна попасть к адресату — независимо от того, готов ли он её получить.",

light:
"Новость, письмо, важная информация или долгожданный ответ.",

shadow:
"Плохая новость, тайна или сообщение, которое лучше было бы не открывать.",

whisper:
"Ответ уже отправлен."
},

{
number:"20",
name:"Сеанс",
symbol:"◌",

reflection:
"Попытка установить контакт с тем, кто находится по ту сторону.",

light:
"Встреча, откровение, контакт и возможность получить ответ.",

shadow:
"Нежелательное присутствие, потеря контроля или приглашение того, кого не собирались звать.",

whisper:
"Кто именно ответит — неизвестно."
},

{
number:"21",
name:"Возвращение",
symbol:"↻",

reflection:
"То, что считалось законченным, снова появляется в настоящем.",

light:
"Возвращение человека, возможности, чувства или давно потерянного шанса.",

shadow:
"Возвращение старой проблемы или повторение прошлого сценария.",

whisper:
"Некоторые вещи возвращаются не зря."
}

]

/* =========================================================
IV. ПАМЯТЬ
========================================================= */

memory: {

title:
"IV. ПАМЯТЬ",

description:
"Карты прошлого Лили-Дейла: старые дома, фотографии, письма, архивы, семейные истории и вещи, которые знают больше своих владельцев.",

cards: [

{
number:"22",
name:"Fox Cottage",
symbol:"⌂",

reflection:
"Дом как вместилище памяти. История семьи, места или человека продолжает существовать даже после их исчезновения.",

light:
"Наследие, происхождение, семейная память и понимание собственных корней.",

shadow:
"Семейный секрет, старый скандал или история, которую поколения предпочитали скрывать.",

whisper:
"Не каждая семейная история предназначена для рассказа."
},

{
number:"23",
name:"Старая фотография",
symbol:"▧",

reflection:
"Мгновение, которое застыло во времени и сохранило то, что люди хотели забыть.",

light:
"Ностальгия, воспоминания, старые чувства и возвращение к важному моменту.",

shadow:
"Тревожная память или деталь, которой на фотографии быть не должно.",

whisper:
"На фотографии может оказаться тот, кого там быть не должно."
},

{
number:"24",
name:"Архив",
symbol:"▤",

reflection:
"Слой официальной и скрытой истории. Всё, что было записано — и всё, что оказалось вычеркнуто.",

light:
"Исследование, документы, поиск истины и возможность найти доказательство.",

shadow:
"Скрытая информация, цензура, пропавшие страницы и намеренно забытая история.",

whisper:
"Некоторые страницы были вырваны."
},

{
number:"25",
name:"Museum",
symbol:"▥",

reflection:
"Прошлое, превращённое в экспонат, которое неожиданно продолжает говорить с настоящим.",

light:
"Знание, историческое открытие и понимание того, что происходило раньше.",

shadow:
"Забытые истории, странные артефакты и вещи, которые лучше не трогать.",

whisper:
"Экспонаты иногда смотрят в ответ."
},

{
number:"26",
name:"Старое письмо",
symbol:"✉",

reflection:
"Личное признание, которое пережило своего автора и неожиданно попало в чужие руки.",

light:
"Откровение, признание в чувствах или тайное послание.",

shadow:
"Чужая тайна и опасное знание, которое не предназначалось адресату.",

whisper:
"Ты не должен был это находить."
},

{
number:"27",
name:"Потерянное имя",
symbol:"?",

reflection:
"Потеря связи с собственной личностью, прошлым или частью собственной истории.",

light:
"Самопознание, возвращение памяти и понимание того, кем человек был на самом деле.",

shadow:
"Стирание личности, чужая жизнь, потеря памяти или ощущение, что кто-то занял твоё место.",

whisper:
"Если забыл имя — возможно, тебя забыли первым."
},

{
number:"28",
name:"Наследие",
symbol:"♜",

reflection:
"То, что передаётся человеку независимо от того, просил он об этом или нет.",

light:
"Дар, знания, семейная сила и возможность продолжить чей-то путь.",

shadow:
"Долг, семейная тайна, обязательство или наследство, от которого нельзя отказаться.",

whisper:
"Наследство бывает и проклятием."
}

]

/* =========================================================
V. РИТУАЛ
========================================================= */

ritual: {

title:
"V. РИТУАЛ",

description:
"Викканский слой колоды. Ритуал здесь — не обязательно заклинание. Это намерение, трансформация, цена, которую человек готов заплатить, и последствия собственного выбора.",

cards: [

{
number:"29",
name:"Круг",
symbol:"○",

reflection:
"Пространство, где люди объединяют намерение и создают общую силу.",

light:
"Сообщество, союз, защита и совместное действие.",

shadow:
"Давление группы, зависимость от чужого мнения и изгнание из круга.",

whisper:
"Из круга тоже можно оказаться изгнанным."
},

{
number:"30",
name:"Свеча",
symbol:"🕯",

reflection:
"Маленький источник света в темноте. Символ надежды, намерения и направления.",

light:
"Надежда, вдохновение, ориентир и возможность увидеть следующий шаг.",

shadow:
"Свет привлекает внимание. Иногда — того, кого не хотелось бы видеть.",

whisper:
"Огонь может привлечь того, кто его ищет."
},

{
number:"31",
name:"Котёл",
symbol:"♨",

reflection:
"Место превращения одного состояния в другое. Всё смешивается прежде, чем стать новым.",

light:
"Трансформация, творчество, перемены и создание чего-то нового.",

shadow:
"Необратимый процесс и последствия, которые уже невозможно отменить.",

whisper:
"Ты уже запустил процесс."
},

{
number:"32",
name:"Травы",
symbol:"❧",

reflection:
"Знание природы и способность использовать её силу для восстановления.",

light:
"Исцеление, восстановление, помощь и естественный путь.",

shadow:
"Ошибка, неправильное применение или лекарство, которое оказывается опаснее болезни.",

whisper:
"Не всякое лекарство безопасно."
},

{
number:"33",
name:"Луна",
symbol:"☾",

reflection:
"Символ подсознания, циклов, интуиции и того, что становится видимым только ночью.",

light:
"Интуиция, тайна, чувствительность и способность услышать подсознание.",

shadow:
"Иллюзия, страх, самообман и неверное толкование происходящего.",

whisper:
"Луна показывает слишком много теней."
},

{
number:"34",
name:"Кровь",
symbol:"♦",

reflection:
"Связь, которую невозможно полностью разорвать: семья, происхождение и сила рода.",

light:
"Родство, жизнь, энергия и сильная эмоциональная связь.",

shadow:
"Семейный долг, наследственное проклятие или обязательство перед родом.",

whisper:
"Кровь требует своей цены."
},

{
number:"35",
name:"Жертва",
symbol:"△",

reflection:
"Необходимость отказаться от одного, чтобы получить или сохранить другое.",

light:
"Освобождение, завершение и добровольный отказ от того, что больше не нужно.",

shadow:
"Потеря, цена желания и ситуация, в которой кто-то должен заплатить.",

whisper:
"Кто-то должен заплатить."
}

]

/* =========================================================
VI. МЕСТА СИЛЫ
========================================================= */

places: {

title:
"VI. МЕСТА СИЛЫ",

description:
"Реальные пространства Лили-Дейла, превращённые в архетипы. Здесь место само становится участником истории.",

cards: [

{
number:"36",
name:"Healing Temple",
symbol:"✚",

reflection:
"Пространство восстановления и внутреннего покоя. Карта напоминает, что исцеление не всегда означает возвращение к прежнему состоянию.",

light:
"Исцеление, принятие, восстановление и возможность отпустить старую боль.",

shadow:
"Скрытая причина раны, старые травмы и повторение болезненного сценария.",

whisper:
"Не всё, что болит, нужно исправлять."
},

{
number:"37",
name:"Forest Temple",
symbol:"🌲",

reflection:
"Священное пространство среди деревьев, где человеческий мир становится тише.",

light:
"Природа, интуиция, древнее знание и возможность услышать себя.",

shadow:
"Потеря ориентира, скрытая опасность и ощущение, что лес не хочет отпускать.",

whisper:
"Лес не обязан тебя выпускать."
},

{
number:"38",
name:"The Labyrinth",
symbol:"◎",

reflection:
"Путь, который кажется повторяющимся, но каждый круг постепенно меняет того, кто его проходит.",

light:
"Поиск ответа, внутренний путь, самопознание и постепенное приближение к цели.",

shadow:
"Замкнутый сценарий, повторение одних и тех же ошибок и невозможность выбраться.",

whisper:
"Некоторые дороги возвращают туда же."
},

{
number:"39",
name:"The Octagon",
symbol:"◇",

reflection:
"Пространство коллективного внимания. Здесь один голос может быть услышан множеством людей.",

light:
"Собрание, обмен знаниями, общая энергия и сила сообщества.",

shadow:
"Давление большинства, чужое мнение и коллективная ошибка.",

whisper:
"Толпа тоже умеет ошибаться."
},

{
number:"40",
name:"The Auditorium",
symbol:"◫",

reflection:
"Место публичной истории. То, что происходило в тени, может внезапно выйти на сцену.",

light:
"Признание, публичность, выступление и возможность быть услышанным.",

shadow:
"Разоблачение, слухи, внимание и потеря контроля над собственной историей.",

whisper:
"Не каждая история рассказывается добровольно."
},

{
number:"41",
name:"Lily Dale Beach",
symbol:"≈",

reflection:
"Граница воды и земли — пространство эмоционального очищения, воспоминаний и прощаний.",

light:
"Освобождение, очищение, новый этап и возможность оставить прошлое позади.",

shadow:
"Потеря, эмоциональное потрясение и ощущение, что вода забрала больше, чем хотелось.",

whisper:
"Вода умеет забирать больше, чем ты хотел."
}

]

/* =========================================================
VII. ТЕНЬ ГОРОДА
========================================================= */

shadow: {

title:
"VII. ТЕНЬ ГОРОДА",

description:
"Тёмная сюжетная сторона Лили-Дейла. Эти карты появляются там, где город перестаёт быть просто местом мистики и становится полноценным персонажем — со своими тайнами, ложью, исчезновениями и долгой памятью.",

cards: [

{
number:"42",
name:"Секрет",
symbol:"✦",

reflection:
"Информация, которая существует, но ещё не была произнесена вслух.",

light:
"Тайное знание, раскрытие и возможность узнать то, что раньше было скрыто.",

shadow:
"Заговор, намеренно скрытая информация и понимание того, что окружающие знают гораздо больше.",

whisper:
"В этом городе все что-то знают."
},

{
number:"43",
name:"Лжец",
symbol:"◐",

reflection:
"Фигура, которая намеренно искажает реальность — или скрывает только часть правды.",

light:
"Проверка информации, разоблачение и способность увидеть несоответствие.",

shadow:
"Обман, манипуляция и человек, который говорит правду ровно настолько, чтобы ему поверили.",

whisper:
"Он сказал правду. Только не всю."
},

{
number:"44",
name:"Охотник",
symbol:"⌁",

reflection:
"Тот, кто ищет. Вопрос только в том, кто является охотником, а кто — добычей.",

light:
"Расследование, настойчивость, поиск ответа и способность докопаться до истины.",

shadow:
"Преследование, опасность и ощущение, что кто-то уже идёт по вашему следу.",

whisper:
"Кто-то ищет тебя."
},

{
number:"45",
name:"Исчезновение",
symbol:"∅",

reflection:
"Исчезновение человека, предмета, воспоминания или части прошлого без понятного объяснения.",

light:
"Освобождение, переход и возможность оставить старую жизнь.",

shadow:
"Пропажа, потеря, необъяснимое событие и вопрос: куда делось то, что ещё вчера было здесь?",

whisper:
"Вчера он был здесь."
},

{
number:"46",
name:"Мёртвая звезда",
symbol:"✶",

reflection:
"Свет, который уже погас, но продолжает идти через пространство и достигать нас.",

light:
"Опыт, завершение, память и урок, который остаётся после конца.",

shadow:
"Ложная надежда, потеря ориентира и движение за светом, которого уже не существует.",

whisper:
"Не всякий свет ведёт домой."
},

{
number:"47",
name:"Лилия",
symbol:"❁",

reflection:
"Символ самого Лили-Дейла. Не просто место, а чувство принадлежности к истории, которая началась задолго до тебя.",

light:
"Предназначение, возвращение, принятие и ощущение, что город тебя узнал.",

shadow:
"Неизбежная связь с прошлым, судьба и понимание того, что город помнит больше, чем ты.",

whisper:
"Город тебя узнал."
}

]

}

};

/* =========================================================
РЕНДЕР РАЗДЕЛА
========================================================= */

function renderSection(sectionName) {

const section =
sections[sectionName];

const content =
document.getElementById("content");

let html = `

<h2>
${section.title}
</h2>

<p>
${section.description}
</p>

</div>

<div class="cards">
`;

section.cards.forEach(card => {

html += `

<div class="card-symbol">
${card.symbol}
</div>

<div>

<div class="card-number">
КАРТА ${card.number}
</div>

</div>

<span class="label">
Что отражает карта
</span>

<p>
${card.reflection}
</p>

</div>

<p>
${card.light}
</p>

</div>

<p>
${card.shadow}
</p>

</div>

${card.whisper}

</div>

</article>

});

html += `

</div>

content.innerHTML =
html;

}

/* =========================================================
ПЕРЕКЛЮЧЕНИЕ РАЗДЕЛОВ
========================================================= */

document
.querySelectorAll(".section-button")
.forEach(button => {

button.addEventListener(
"click",
function() {

const isActive =
this.classList.contains("active");

/* ---------------------------------------------
ЕСЛИ РАЗДЕЛ УЖЕ ОТКРЫТ —
ЗАКРЫВАЕМ ЕГО
--------------------------------------------- */

if (isActive) {

this.classList.remove(
"active"
);

document
.getElementById("content")
.innerHTML = "";

return;
}

/* ---------------------------------------------
ЗАКРЫВАЕМ ДРУГИЕ КНОПКИ
--------------------------------------------- */

document
.querySelectorAll(".section-button")
.forEach(btn => {

btn.classList.remove(
"active"
);

});

/* ---------------------------------------------
АКТИВИРУЕМ ВЫБРАННУЮ КНОПКУ
--------------------------------------------- */

this.classList.add(
"active"
);

/* ---------------------------------------------
ОТКРЫВАЕМ РАЗДЕЛ
--------------------------------------------- */

renderSection(
this.dataset.section
);

/* ---------------------------------------------
ПЛАВНЫЙ СКРОЛЛ
--------------------------------------------- */

setTimeout(() => {

document
.getElementById("content")
.scrollIntoView({
behavior: "smooth",
block: "start"
});

}, 80);

}
);

});

/* =========================================================
ПРИ ЗАГРУЗКЕ ВСЁ ЗАКРЫТО
========================================================= */

document
.getElementById("content")
.innerHTML = "";

</script>

</body>
</html>[/html]
[hideprofile]

Lily-Dale: Beyond the Veil

Меню навигации

Пользовательские ссылки

Объявление

Информация о пользователе

Оракул Теней Лили-Дейла

Сообщений 1 страница 1 из 1

Поделиться12026-08-10 14:21:44