[html]<style>
.main-content-new-g {
    width: 526px;
    height: 310px;
    margin: auto;
    margin-top: 20px;
    text-align: justify;
    padding: 22px;
    background: var(--background-primary);
    border-radius: 10px;
overflow-y: scroll;

}

details[open] > summary {
    color: black;
    background: #d3d3d3;
    border: 1px solid black !important;
}

.taken-roles-new-g p {
    background: rgba(255, 255, 255, 0.4);
    border-radius: 4px;
    font-family: 'Inter';
    font-style: normal;
    font-weight: 400;
    font-size: 10px !important;
    line-height: 140% !important;
    color: #202020;
    padding: 5px !important;
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}

.taken-roles-new-g details div {
    width: 554px;
    padding: 8px;
    padding-top: 29px;
    background: #D3D3D3;
    border-radius: 10px;
    max-height: 100px !important;
    overflow-y: scroll;
}

.taken-roles-new-g summary {
    box-sizing: border-box;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 2px 16px;
    gap: 4px;
    position: absolute;
    width: 570px;
    height: 21px;
    background: #343D47;
    border-radius: 4px;
    font-family: playfair display;
    font-size: 12px;
    color: white;
    text-transform: uppercase;
    letter-spacing: 0.04em;
cursor: pointer;
}

.taken-roles-new-g {
    position: absolute;
    width: 570px;
    margin: 440px auto 0;
z-index: 20;
}

::marker {
    color: transparent !important;
    font-size: 0px;
}

.main-content-new-g img {
    margin-top: -4px !important;
}

.admin-names a {
    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 140%;
    color: #FFFFFF;
}
.admin-names {
    font-family: 'Playfair Display';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 140%;
    color: #FFFFFF;
    padding-top: 35px;
    margin-left: -340px;
}

.guestroom-new {
    background: url(https://forumstatic.ru/files/001c/7b/1c/66763.png) no-repeat;
    background-size: contain !important;
    width: 600px;
    height: 469px;
    display: flex;
    flex-direction: column;
    align-items: center;
border-radius: 10px;
}

.guestroom-new .links a {
    font-family: 'Playfair Display';
    box-sizing: border-box;
    display: flex
;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 2px 16px;
    gap: 4px;
    width: 30%;
    max-width: 157px;
    height: 19px;
    background: #343D47;
    box-shadow: 0px 0.815028px 0.815028px rgba(40, 44, 41, 0.5);
    border-radius: 4px;
    flex: none;
    order: 0;
    flex-grow: 1;
    text-transform: uppercase;
    color: #E6E6E6;
    font-weight: 600;
    letter-spacing: 0.04em;
    margin-top: -3px;
  transition: 0.25s;

}

.guestroom-new .links a:hover {
color:white;
  transition: 0.25s;

}

.links {
    position: absolute;
    z-index: 10;
    width: 485px;
    display: flex;
    align-items: center;
    justify-content: space-around;
    margin: 70px auto 0 !important;
}

</style>

<div style="justify-items: center;">

<div class="guestroom-new">

<div class="admin-names">
<a href="https://obscura.rusff.me/profile.php?id=5" title="Ответственный за лор">Solas</a> — <a href="https://obscura.rusff.me/profile.php?id=4" title="Ответственный за движ">Inquisitor</a> — <a href="https://obscura.rusff.me/profile.php?id=12" title="Ответственный за Инквизитора и коды">Lorenzo</a>
</div>

<div class="main-new-g">

<div class="main-content-new-g"><p class="guestroom-lines"> <span style="font-family: Playfair Display; font-weight: 700; font-size: 24px; font-style: italic;">Р</span><span style="font-family:inter; font-size:12px; line-height:140%;">оль придерживается на сутки для гостей, на трое суток с зарегистрированным профилем. Придержание можно продлить еще на трое суток, но только один раз.</span></p>
<p class="guestroom-lines"><span style="font-family:inter; font-size:12px; line-height:140%;">Страницы длинной истории приглашают вас в год 9:46 Века Дракона — в мир, разорванный древней магией, существами и теми, кто его населяет после того, как распалась Инквизиция.</span></p>
<p class="guestroom-lines"><span style="font-family:inter; font-size:12px; line-height:140%;">Там, где следующие главы написаны нашими руками, стоит только взять перо, а загадки, ждущие решения, подстерегают на каждом углу,</span></p>
<p class="guestroom-lines"><span style="font-family:inter; font-size:12px; line-height:140%;">Там, где песни богов звучат знакомыми голосами, а таинственная тень приоткрывает свой покров для каждого гостя,</span></p>
<p class="guestroom-lines"><span style="font-family:inter; font-size:12px; line-height:140%;">Там, где тёплый очаг Ферелдена греет уютом, а в таверне напротив можно выболтать очередную байку, потешиться чужими, спеть новую бардовскую песню или же и вовсе внезапно поучаствовать в спасении мира за очередной пинтой,</span></p>
<p class="guestroom-lines"><span style="font-family:inter; font-size:12px; line-height:140%;">Здесь мы ждём вас в свою семью, чтобы писать историю вновь!</span></p>
<p class="guestroom-lines"><span style="font-family: Playfair Display; font-weight: 700; font-size: 14px; font-style: italic;">Андаран атиш’ан!</span></p></div>

</div>

<div class="links"><a href="https://obscura.rusff.me/viewtopic.php?id=9#p29">сюжет</a> <a href="https://obscura.rusff.me/viewtopic.php?id=8#p28">правила</a> <a href="https://obscura.rusff.me/viewtopic.php?id=14">занятые роли</a></div>

<div class="taken-roles-new-g"><details>
  <summary>придержанные роли</summary>
  <div>Место для вашей рекламы 
</div>
</details> </div>

</div>

</div>

[/html]

<p>name surname - <a href="link">name surname</a> до 00.00</p>