ГОСТЕВАЯ

Поделиться1Вчера 21:49:09

Автор: Sehrin
Администратор
Сообщений: 17
Уважение: +0
Зарегистрирован: 2026-08-25
ты мой яд но я пью до дна

[html]
<style>
/* =========================================================
DOKKAEBI — ГОСТЕВАЯ
Всё оформление ограничено классом .dk-guest
========================================================= */

.dk-guest,
.dk-guest * {
box-sizing: border-box;
}

.dk-guest {
--dk-gold: #c39a5a;
--dk-gold-light: #e2c188;
--dk-gold-dark: #76502d;
--dk-brown: #24150e;
--dk-dark: #100c0a;
--dk-panel: rgba(17, 13, 11, 0.92);
--dk-line: rgba(195, 154, 90, 0.35);
--dk-text: #c8b9a5;
--dk-muted: #8e7d6a;

position: relative;
isolation: isolate;
width: 100%;
max-width: 1000px;
min-height: 680px;
margin: 15px auto;
overflow: hidden;

color: var(--dk-text);
background-color: var(--dk-dark);
background-image:
linear-gradient(
to bottom,
rgba(8, 5, 4, 0.12) 0%,
rgba(8, 5, 4, 0.08) 32%,
rgba(12, 8, 6, 0.55) 65%,
rgba(12, 8, 6, 0.95) 100%
),
var(--dk-bg);
background-position: center top;
background-size: cover;
background-repeat: no-repeat;

border: 1px solid var(--dk-gold-dark);
border-radius: 20px;

box-shadow:
0 12px 35px rgba(0, 0, 0, 0.45),
inset 0 0 50px rgba(0, 0, 0, 0.35);

font-family: Arial, Helvetica, sans-serif;
}

/* Мягкая виньетка */

.dk-guest::before {
content: "";
position: absolute;
z-index: -1;
inset: 0;
pointer-events: none;

background:
linear-gradient(
90deg,
rgba(9, 5, 3, 0.48) 0%,
transparent 27%,
transparent 73%,
rgba(9, 5, 3, 0.48) 100%
),
radial-gradient(
circle at center 28%,
transparent 0%,
transparent 27%,
rgba(8, 5, 3, 0.18) 65%,
rgba(8, 5, 3, 0.62) 100%
);
}

/* Внутренняя золотая линия */

.dk-guest::after {
content: "";
position: absolute;
z-index: 10;
inset: 7px;
border: 1px solid rgba(195, 154, 90, 0.12);
border-radius: 14px;
pointer-events: none;
}

/* =========================================================
ВЕРХНЯЯ ЧАСТЬ
========================================================= */

.dk-guest__hero {
position: relative;
min-height: 330px;
padding: 25px 28px 15px;
}

.dk-guest__top {
display: grid;
grid-template-columns: 180px 1fr 180px;
align-items: start;
gap: 18px;
}

.dk-guest__facts {
display: flex;
flex-direction: column;
gap: 12px;
}

.dk-guest__facts--right {
text-align: right;
}

.dk-guest__fact {
display: block;
padding: 10px 14px;

color: var(--dk-gold-light);
background:
linear-gradient(
90deg,
rgba(29, 18, 12, 0.92),
rgba(42, 25, 15, 0.72),
rgba(29, 18, 12, 0.92)
);

border: 1px solid rgba(195, 154, 90, 0.18);
border-radius: 3px;

font-family: Georgia, "Times New Roman", serif;
font-size: 13px;
line-height: 1.25;
letter-spacing: 1px;
text-transform: uppercase;
text-shadow: 0 1px 3px #000;

box-shadow: 0 4px 12px rgba(0, 0, 0, 0.24);
}

/* Заголовок */

.dk-guest__logo {
padding-top: 25px;
text-align: center;
}

.dk-guest__korean {
margin-bottom: 5px;
color: var(--dk-gold);
font-family: Georgia, "Times New Roman", serif;
font-size: 12px;
letter-spacing: 7px;
text-transform: uppercase;
text-shadow: 0 0 9px rgba(195, 154, 90, 0.4);
}

.dk-guest__title {
margin: 0;
color: #dcc08c;

font-family: Georgia, "Times New Roman", serif;
font-size: clamp(42px, 8vw, 88px);
font-weight: 400;
line-height: 0.9;
letter-spacing: 5px;
text-transform: uppercase;

text-shadow:
0 2px 2px #080503,
0 0 1px #000,
0 0 20px rgba(182, 128, 62, 0.35);
}

.dk-guest__subtitle {
display: flex;
align-items: center;
justify-content: center;
gap: 12px;

margin: 17px auto 0;

color: #9d805b;
font-family: Georgia, "Times New Roman", serif;
font-size: 11px;
letter-spacing: 3px;
text-transform: uppercase;
}

.dk-guest__subtitle::before,
.dk-guest__subtitle::after {
content: "";
width: 45px;
height: 1px;
background:
linear-gradient(
90deg,
transparent,
var(--dk-gold-dark)
);
}

.dk-guest__subtitle::after {
background:
linear-gradient(
90deg,
var(--dk-gold-dark),
transparent
);
}

/* =========================================================
НИЖНИЕ ПАНЕЛИ
========================================================= */

.dk-guest__columns {
position: relative;
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
align-items: stretch;
gap: 24px;

padding: 0 25px 25px;
}

.dk-guest__panel {
position: relative;
min-width: 0;
min-height: 335px;
padding: 25px 25px 22px;

background:
linear-gradient(
155deg,
rgba(31, 20, 15, 0.95),
rgba(14, 11, 9, 0.95)
);

border: 1px solid var(--dk-line);
border-radius: 15px;

box-shadow:
0 12px 26px rgba(0, 0, 0, 0.4),
inset 0 0 28px rgba(100, 57, 26, 0.08);
}

.dk-guest__panel::before {
content: "";
position: absolute;
top: 7px;
right: 7px;
bottom: 7px;
left: 7px;

border: 1px solid rgba(195, 154, 90, 0.08);
border-radius: 10px;
pointer-events: none;
}

.dk-guest__panel-title {
position: relative;
display: flex;
align-items: center;
justify-content: center;
gap: 12px;

margin: 0 0 22px;
color: var(--dk-gold-light);

font-family: Georgia, "Times New Roman", serif;
font-size: 22px;
font-weight: 400;
line-height: 1;
letter-spacing: 3px;
text-align: center;
text-transform: uppercase;
text-shadow: 0 1px 3px #000;
}

.dk-guest__panel-title::before,
.dk-guest__panel-title::after {
content: "◆";
color: var(--dk-gold-dark);
font-size: 7px;
}

/* Текст информации */

.dk-guest__section {
position: relative;
margin-bottom: 19px;
}

.dk-guest__section:last-child {
margin-bottom: 0;
}

.dk-guest__section-title {
margin-bottom: 8px;
color: var(--dk-gold);
font-family: Georgia, "Times New Roman", serif;
font-size: 11px;
font-weight: 700;
letter-spacing: 1.5px;
text-transform: uppercase;
}

.dk-guest__text {
color: var(--dk-text);
font-size: 11px;
line-height: 1.65;
}

.dk-guest__text p {
margin: 0 0 8px;
}

.dk-guest__text p:last-child {
margin-bottom: 0;
}

.dk-guest__list {
margin: 0;
padding: 0;
list-style: none;
}

.dk-guest__list li {
position: relative;
margin: 0 0 5px;
padding-left: 15px;
}

.dk-guest__list li::before {
content: "✦";
position: absolute;
top: 0;
left: 0;
color: var(--dk-gold-dark);
font-size: 8px;
}

/* =========================================================
КЛИКАБЕЛЬНЫЕ ССЫЛКИ
========================================================= */

.dk-guest a {
color: var(--dk-gold-light);
text-decoration: none;
transition:
color 0.2s ease,
border-color 0.2s ease,
background-color 0.2s ease,
transform 0.2s ease;
}

.dk-guest a:hover {
color: #f2d9aa;
}

.dk-guest__links {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 8px;
margin-top: 17px;
}

.dk-guest__button {
display: flex;
align-items: center;
justify-content: center;

min-height: 31px;
padding: 7px 10px;

color: #c9ac7a !important;
background:
linear-gradient(
to bottom,
rgba(57, 37, 24, 0.85),
rgba(26, 18, 14, 0.92)
);

border: 1px solid rgba(195, 154, 90, 0.35);
border-radius: 15px;

font-size: 9px;
font-weight: 700;
line-height: 1.25;
letter-spacing: 1px;
text-align: center;
text-transform: uppercase;

box-shadow:
inset 0 1px rgba(255, 255, 255, 0.04),
0 3px 10px rgba(0, 0, 0, 0.25);
}

.dk-guest__button:hover {
color: #f0d39f !important;
background:
linear-gradient(
to bottom,
rgba(85, 55, 31, 0.92),
rgba(36, 24, 17, 0.96)
);
border-color: rgba(224, 183, 113, 0.65);
transform: translateY(-1px);
}

/* =========================================================
ВНЕШНОСТИ
========================================================= */

.dk-guest__reservation-note {
margin: -8px 0 16px;
color: var(--dk-muted);
font-size: 10px;
line-height: 1.5;
text-align: center;
}

.dk-guest__reservation-time {
display: table;
margin: 0 auto 18px;
padding: 6px 22px;

color: var(--dk-gold-light);
background: rgba(11, 9, 8, 0.75);

border: 1px solid rgba(195, 154, 90, 0.35);
border-radius: 20px;

font-family: Georgia, "Times New Roman", serif;
font-size: 10px;
letter-spacing: 1px;
}

.dk-guest__faces {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 7px 16px;
}

.dk-guest__face {
display: block;
min-width: 0;
padding: 4px 2px;

overflow: hidden;
color: #aa967d !important;

border-bottom: 1px solid rgba(195, 154, 90, 0.13);

font-size: 10px;
line-height: 1.35;
text-overflow: ellipsis;
white-space: nowrap;
}

.dk-guest__face::before {
content: "◇";
margin-right: 6px;
color: var(--dk-gold-dark);
font-size: 7px;
}

.dk-guest__face:hover {
color: var(--dk-gold-light) !important;
border-bottom-color: rgba(195, 154, 90, 0.5);
}

/* =========================================================
НИЖНЯЯ ПОДПИСЬ
========================================================= */

.dk-guest__footer {
position: relative;
margin: 2px 25px 24px;
padding-top: 13px;

color: #6e5b48;
border-top: 1px solid rgba(195, 154, 90, 0.16);

font-family: Georgia, "Times New Roman", serif;
font-size: 9px;
letter-spacing: 3px;
text-align: center;
text-transform: uppercase;
}

/* =========================================================
АДАПТАЦИЯ ДЛЯ ТЕЛЕФОНОВ
========================================================= */

@media screen and (max-width: 720px) {
.dk-guest {
min-height: 0;
background-position: center top;
border-radius: 13px;
}

.dk-guest__hero {
min-height: 320px;
padding: 20px 15px;
}

.dk-guest__top {
grid-template-columns: 1fr 1fr;
gap: 12px;
}

.dk-guest__logo {
grid-column: 1 / -1;
grid-row: 1;
padding: 18px 0 15px;
}

.dk-guest__facts {
grid-row: 2;
}

.dk-guest__facts--right {
text-align: right;
}

.dk-guest__fact {
padding: 8px;
font-size: 10px;
}

.dk-guest__title {
font-size: clamp(38px, 15vw, 66px);
letter-spacing: 2px;
}

.dk-guest__columns {
grid-template-columns: 1fr;
gap: 15px;
padding: 0 12px 15px;
}

.dk-guest__panel {
min-height: 0;
padding: 22px 18px;
}

.dk-guest__faces {
grid-template-columns: 1fr;
}

.dk-guest__footer {
margin: 2px 15px 18px;
}
}

@media screen and (max-width: 430px) {
.dk-guest__top {
grid-template-columns: 1fr;
}

.dk-guest__logo {
grid-column: 1;
}

.dk-guest__facts,
.dk-guest__facts--right {
grid-row: auto;
text-align: center;
}

.dk-guest__links {
grid-template-columns: 1fr;
}
}
</style>

<div class="dk-guest__facts">
<div class="dk-guest__fact">
Сеул, Южная Корея
</div>

<h1 class="dk-guest__title">
Dokkaebi
</h1>

<div class="dk-guest__subtitle">
между миром людей и духов
</div>
</div>

<div class="dk-guest__facts dk-guest__facts--right">
<div class="dk-guest__fact">
мистический реализм
</div>

</div>

<h2 class="dk-guest__panel-title">
Информация
</h2>

<div class="dk-guest__section-title">
Внешности держим
</div>

<div class="dk-guest__text">
<ul class="dk-guest__list">
<li>за гостями — 24 часа;</li>
<li>за зарегистрированными — 3 дня;</li>
<li>по акции — согласно условиям акции.</li>
</ul>
</div>

</div>

<div class="dk-guest__section-title">
Перед регистрацией
</div>

<div class="dk-guest__text">
<p>
Ознакомьтесь с правилами и проверьте списки
занятых ролей и внешностей.
</p>

<p>
Если у вас появились вопросы, оставьте сообщение
в этой теме — администрация обязательно поможет.
</p>
</div>

</div>

<a class="dk-guest__button"
href="ССЫЛКА_НА_ПРАВИЛА">
Правила
</a>

<a class="dk-guest__button"
href="ССЫЛКА_НА_СЮЖЕТ">
Сюжет
</a>

<a class="dk-guest__button"
href="ССЫЛКА_НА_СПИСОК_РОЛЕЙ">
Список ролей
</a>

<a class="dk-guest__button"
href="ССЫЛКА_НА_АКЦИИ">
Акции
</a>

</div>

</section>

<h2 class="dk-guest__panel-title">
Внешности
</h2>

<div class="dk-guest__reservation-note">
Кликните по имени, чтобы перейти к профилю
или сообщению игрока.
</div>

<div class="dk-guest__reservation-time">
бронь до 00.00
</div>

<!--
ВНЕШНОСТИ

href — ссылка на профиль или сообщение.
Между тегами — имя внешности.
-->

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_1">
Имя внешности №1
</a>

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_2">
Имя внешности №2
</a>

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_3">
Имя внешности №3
</a>

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_4">
Имя внешности №4
</a>

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_5">
Имя внешности №5
</a>

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_6">
Имя внешности №6
</a>

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_7">
Имя внешности №7
</a>

<a class="dk-guest__face"
href="ССЫЛКА_НА_ПРОФИЛЬ_8">
Имя внешности №8
</a>

</div>

<a class="dk-guest__button"
href="ССЫЛКА_НА_ПОЛНЫЙ_СПИСОК">
Полный список
</a>

<a class="dk-guest__button"
href="ССЫЛКА_НА_ОТВЕТ_В_ГОСТЕВОЙ">
Забронировать
</a>

</div>

</section>

</div>

<div class="dk-guest__footer">
Seoul · spirits · humans · dokkaebi
</div>

</div>

[/html]

0

Цитировать Сообщение 1

Поделиться2Вчера 22:41:37

Автор: Sasha
Администратор
Сообщений: 2
Уважение: +0
Зарегистрирован: Вчера

Рекламу отключите
Фланги почистите
Чо когда уже Багета запускать?)

0

Цитировать Сообщение 2

Поделиться3Вчера 22:43:14

Автор: Sehrin
Администратор
Сообщений: 17
Уважение: +0
Зарегистрирован: 2026-08-25
ты мой яд но я пью до дна

Sasha

пусть пока сидит, отдыхает х))

0

Цитировать Сообщение 3

Поделиться4Вчера 22:52:45

Автор: Sky
Администратор
Имя: Скай
Возраст: 18
Род деятельности:студент
Характер: сучий
О персонаже: Много чего

Сашенька Моро.

Хакер и стример онлайн игр
Сообщений: 3
Уважение: +0
Зарегистрирован: 2026-08-25
мы находим себя среди звёзд