[html]<style>
section.lore-block {
position: relative;
background: url(https://forumstatic.ru/files/001c/b4/c9/19943.jpg) no-repeat right, rgba(205, 205, 205, 1);
width: 600px;
height: 656px;
margin: auto;
box-sizing: border-box;
padding: 13px 7px;
}

section.lore-block *{
box-sizing: border-box;
scrollbar-gutter: stable;
}

section.lore-block div.lore-info {
background: var(--alaska-white-gray, rgba(231, 231, 231, 1));
width: 390px;
height: 150px;
border-top: 1px solid rgba(50, 50, 52, 1);
padding: 9px 3px 9px 9px;
}

section.lore-block div.lore-info div {
overflow: auto;
padding-right: 6px;
height: 100%;
font-size: 10px;
}

section.lore-block  .vtab-content {
  display: none;
  padding: 10px;
  border: none;
  overflow: auto;
}

section.lore-block .vtab-content.active {
    display: block;
    background-color: rgba(231, 231, 231, 1);
    height: 100%;
    border-top: 5px solid rgba(50, 50, 52, 1);
}
section.lore-block .vtabs-cont,
section.lore-block .vtabs-wrapper {
width: 390px;
height: 448px;
margin-top: 10px;
}

section.lore-block .vtab-buttons {
display: flex;
}

section.lore-block .vtab-btn {
    padding: 7px 10px 4px;
    cursor: pointer;
    background: transparent;
    border: none;
    transition: 0.3s;
    flex-grow: 1;
    color: rgb(var(--accent));
    font-family: Bewlay;
    font-weight: 400;
    font-size: 14px;
    line-height: 7.2px;
    letter-spacing: 8%;
    text-align: center;
    text-transform: lowercase;
}

section.lore-block .vtab-btn.active {
  background: rgba(231, 231, 231, 1);
  color: rgba(47, 47, 47, 1);
 
}

section.lore-block details {
    background: rgba(206, 206, 206, 0.5);
    border: 1px solid rgba(175, 175, 175, 1);
    border-radius: 2px;
    padding: 16px 15px 17px 15px;
    display: block;
    font-size: 11px;
    cursor: pointer;
   margin: 5px 0;
}

section.lore-block details summary {
    list-style: none;
    position: relative;
    padding-left: 30px;
    cursor: pointer;
    font-family: bewlay;
    color: rgb(var(--accent));
    font-size: 16px;
    transition: color 0.3s ease, text-shadow 0.3s ease;
    outline: none;
}
section.lore-block details[open] summary {
    margin-bottom: 10px;
}

section.lore-block details summary::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    background: url(https://forumstatic.ru/files/001c/b4/c9/37122.png) no-repeat center / contain;
    opacity: 1;
    width: 20px;
    height: 20px;
    color: rgba(212, 82, 81, 1);
    transition: transform 0.5s ease;
}

section.lore-block details[open] summary::before {
    left: 0;
    top: 50%;
    transform: translateY(-50%) rotate(450deg);
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.6);
}

section.lore-block quote {
    background: white;
    border: 1px solid rgba(175, 175, 175, 1);
    border-radius: 2px;
    padding: 16px 15px 17px 15px;
    display: block;
    font-size: 11px;
    cursor: pointer;
   margin: 5px 0;
   position: relative;
}

section.lore-block quote::before {
content:'';
background: url(https://forumstatic.ru/files/001c/ac/d1/17413.png) no-repeat center / contain;
position: absolute;
width: 25px;
height: 25px;
top: -3px;
left: -8px;
filter: hue-rotate(174deg);
}

</style>

<section class='lore-block'>

<div class='lore-info'> <div>

красивая прелюдия. типа бла бла бла товарищ, ты попал в рай - тут можно кататься на машинах, участвовать в гонках или просто чесать письку на диване. не ссы в трусы, если не шариш, - мы подготовили для тебя краткий экскурс о Формуле-1, его ты найдешь в вкладке “теория” (канеш для чайников). Так же, ты можешь ознакомиться со списком тачек и кто кого спонсирует (типа ред булл вот такие), узнаешь о механике квестов, а так же тут можно посмотреть хронологию и сюжет. Если тебе не интересны гонки, мож дальше мять сиськи на диване, мы ни к чему не обязываем. Ваши админы <3

</div></div>

<div class="vtabs-wrapper">
  <div class="vtabs-cont">
    <div class="vtab-buttons">
      <button class="vtab-btn">теория</button>
      <button class="vtab-btn">машинки</button>
      <button class="vtab-btn">хронология</button>
      <button class="vtab-btn">как водить</button>
      <button class="vtab-btn">сюжет</button>
    </div>

<!--------------- первая вкладка ----------------------------------------------------------->
    <div class="vtab-content">

Содержимое 1

<details>
  <summary>Заголовок спойлера</summary>
  А здесь лежит скрытый контент. Любой длины, будет расталкивать контент.
</details>
<details>
  <summary>Заголовок спойлера</summary>
  А здесь лежит скрытый контент. Любой длины, будет расталкивать контент.
</details>

<quote>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s
</quote>
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s

</div>

<!--------------- вторая вкладка ----------------------------------------------------------->
    <div class="vtab-content">Содержимое 2</div>
    <div class="vtab-content">Содержимое 3</div>
    <div class="vtab-content">Содержимое4</div>
    <div class="vtab-content">Содержимое4</div>
  </div>
</div>

</section>[/html]