Сменить дизайн

Мы в TELEGRAM Telegram

Поддавшись секундному сомнению в том, что может быть реальным, а что нет, он всё же обернулся. Кажется, впервые в жизни ему показалось, что сердце сейчас по-настоящему выпрыгнет из груди. Перед ним действительно стояла Эллана, та, которая всегда была единственной подругой, семьей, союзницей и отрадой в клане. Единственная, кем он умел дорожить в своей прежней жизни.

лучший эпизод

Город воспоминаний
Up
Down

ams search: dragon age

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

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » ams search: dragon age » admin » Перенести ЛС 2.0


Перенести ЛС 2.0

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

1

Шаблоны для ЛС для наших игроков

0

2

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Assan</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/700015.png" />
          </div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <!-- Новые подарки вставлять здесь -->

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <!-- Новые достижения вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
          <!-- Новые коллекции вставлять здесь -->
        </div>
      </div>
    </label>
  </div>
</div>

0

3

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Einarel Tabris</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/598138.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/154101.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/772321.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/824667.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/52344.gif" /></div>
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/614328.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/759708.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/899026.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/93477.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/11859.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/427855.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/601530.png" />
            <div>
              <p>like a shadow</p>I am and I am not
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/347730.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/108590.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/448605.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/754539.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/403412.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/148594.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/700015.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/585024.png" /></div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=51#p722">
            <div class="pp-episode-date">9:30</div>
            <div class="pp-episode-title">dance macabre</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=77#p2841">
            <div class="pp-episode-date">9:30</div>
            <div class="pp-episode-title">a crow claimed</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=106#p4992">
            <div class="pp-episode-date">9:30</div>
            <div class="pp-episode-title">the antivan sharpening</div>
          </a>

          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/330347.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">И тепло, и можно одной варежкой поменяться с Зевраном. Почти соединяющие нити</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/622545.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Два бокала влюбленным за тем столиком</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/622545.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">В новый год — с новыми силами!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>

          <!-- Новые подарки вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <a href="https://obscura.rusff.me/viewtopic.php?id=51#p916" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории</div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/38777.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Подающий надежды автор</div>
              <div class="pp-achievement-description">5 постов</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=51#p722" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/64361.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Конец одной истории</div>
              <div class="pp-achievement-description">закрыть первый эпизод</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/40193.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Всеобщий любимчик</div>
              <div class="pp-achievement-description">поставить 100 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/59436.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Spooky Halloween 2025</div>
              <div class="pp-achievement-description">за участие в хэллоуинском флэшмобе</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/701915.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Happy New Year 2026</div>
              <div class="pp-achievement-description">встретил новый год на обскуре</div>
            </div>
          </div>

          <!-- Новые достижения вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
   

        </div>
      </div>
    </label>
  </div>
</div>

0

4

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Ellana Lavellan</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/52702.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/40913.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/154101.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/34520.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/772321.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/190151.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/824667.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/884677.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/88017.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/85348.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/28692.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/776113.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/579732.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/863066.gif" /></div>
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/587758.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/889009.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/536596.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/399559.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/310417.png" />
            <div>
              <p>hope is born</p>when all is forlorn
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/614328.png" />
            <div>
              <p>hope is born</p>when all is forlorn
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/262269.png" />
            <div>
              <p>hope is born</p>when all is forlorn
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/347730.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/324324.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/99315.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/98219.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/953054.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/812564.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/210801.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/700015.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/t37791.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/841833.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/277566.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/593075.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/615266.png" /></div>
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=162">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">faded evergreen</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=167">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Mala suledin nadas</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=165">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">after a few flying daggers</div>
          </a>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/330347.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Если уж любишь ходить босиком, то хотя бы ладошки держи в тепле!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/330347.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Чтобы не мерзнуть в Скайхолде</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <a href="https://obscura.rusff.me/viewtopic.php?id=162#p10901" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории</div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/38777.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Подающий надежды автор</div>
              <div class="pp-achievement-description">5 постов</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=167#p11781" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/64361.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Конец одной истории</div>
              <div class="pp-achievement-description">закрыть первый эпизод</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/40193.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Всеобщий любимчик</div>
              <div class="pp-achievement-description">поставить 100 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/93781.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Завсегдатай таверны</div>
              <div class="pp-achievement-description">100 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/18246.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Искатель приключений</div>
              <div class="pp-achievement-description">принять участие в 5 конкурсах</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/701915.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Happy New Year 2026</div>
              <div class="pp-achievement-description">встретил новый год на обскуре</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/124757.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Вор с чёрным языком</div>
              <div class="pp-achievement-description">за участие в книжном клубе</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/212411.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Адвент-календарь '26</div>
              <div class="pp-achievement-description">за открытие новогоднего адвент-календаря</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
        </div>

      </div>
    </label>
  </div>
</div>

0

5

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Feynriel</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/656069.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/56312.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/154101.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/190151.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/824667.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/34520.gif" /></div>
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/33360.png" />
            <div>
              <p>Nine, ten</p>never sleep again...
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/262269.png" />
            <div>
              <p>Nine, ten</p>never sleep again...
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/347730.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/324324.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/977365.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/192692.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/700015.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/t37791.png" /></div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=223#p17924">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Город воспоминаний</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=45#p377">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Затерянное в Тени и Времени</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=64#p1772">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Позолота и ржавчина</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=126#p6986">
            <div class="pp-episode-date">9:44</div>
            <div class="pp-episode-title">штормовое предупреждение</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=102#p4835">
            <div class="pp-episode-date">9:44</div>
            <div class="pp-episode-title">Сокрытое сокровище</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=228#p19205">
            <div class="pp-episode-date">9:45</div>
            <div class="pp-episode-title">Whispers of the Deep</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=67#p2178">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Игра в пепел</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=138#p8452">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Песок и сталь</div>
          </a>

          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://i.imgur.com/s8D0dLA.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Птичка нашептала, что ты любишь любовные романы ;3</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/10332.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Надеюсь, тебе понравится этот гребешок. На память от твоего дорогого Рена ;3</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/948564.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Много, много тепла тебе!!!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/78521.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Отпугивает злых демонов, но привлекает древних магов</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/441161.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Пей вкусный чай и больше не болей!</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <a href="https://obscura.rusff.me/viewtopic.php?id=45#p389" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории</div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/38777.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Подающий надежды автор</div>
              <div class="pp-achievement-description">5 постов</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=45#p377" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/64361.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Конец одной истории</div>
              <div class="pp-achievement-description">закрыть первый эпизод</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/40193.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Всеобщий любимчик</div>
              <div class="pp-achievement-description">поставить 100 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/59436.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Spooky Halloween 2025</div>
              <div class="pp-achievement-description">за участие в хэллоуинском флэшмобе</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/701915.png" />
            </div>
            <div

0

6

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Kiara Laidir</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/49281.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/358588.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/824667.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001a/e6/ed/2/826222.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001a/e6/ed/2/254605.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001a/e6/ed/2/721643.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/776113.gif" /></div>
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div><p>come what may</p>i'm here at the end</div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/51127.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/587758.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/417754.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/399559.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/889009.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/902356.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/536596.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/13831.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/35978.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/262269.png" />
            <div><p>fake it</p>till you make it</div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/347730.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/324324.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/332003.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/908037.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/67709.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/700015.png" /></div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=81#p3096">
            <div class="pp-episode-date">9:44</div>
            <div class="pp-episode-title">а сгубил вас всех лодочник</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=126#p6986">
            <div class="pp-episode-date">9:44</div>
            <div class="pp-episode-title">штормовое предупреждение</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=95#p4348">
            <div class="pp-episode-date">9:44</div>
            <div class="pp-episode-title">Girls get it done</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=67#p2178">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Игра в пепел</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=86#p3561">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">should I stay or should I go?</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=138#p8452">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Песок и сталь</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=154#p10553">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">одной из летящих птиц</div>
          </a>

          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/2/171718.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Бочонок лучшего антиванского вина самой очаровательной эльфийке во всем Тедасе ;3</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/2/557108.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Чудесной Рук от не очень тайного поклонника</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/37624.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Увидел - и не смог пройти мимо. Надеюсь, тебе понравится ;3</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/220518.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Пусть этот потешный тыквенный котик радует тебя осенними вечерами</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/492109.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Представим, что котик рыжий, и это ты!)</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/330347.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">РУКавички</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/2/633765.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Буст на удачу</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://i.ibb.co/vCjFQd0c/animal.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Потешный крабик для самой храброй!</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <a href="https://obscura.rusff.me/viewtopic.php?id=81#p3184" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории</div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/38777.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Подающий надежды автор</div>
              <div class="pp-achievement-description">5 постов</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=67#p3490" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/14648.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Герой Тедаса</div>
              <div class="pp-achievement-description">написать пост в квест</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=86" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/64361.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Конец одной истории</div>
              <div class="pp-achievement-description">закрыть первый эпизод</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/40193.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Всеобщий любимчик</div>
              <div class="pp-achievement-description">поставить 100 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/92169.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Звезда вечеринки</div>
              <div class="pp-achievement-description">поставить 500 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/93781.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Завсегдатай таверны</div>
              <div class="pp-achievement-description">100 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/77078.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Ветеран Обскуры</div>
              <div class="pp-achievement-description">3 месяца на форуме</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=67#p6276" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/891357.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">До первой крови</div>
              <div class="pp-achievement-description">отыграть сражение</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=86#p6379" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/448248.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Береги воду, пей вино</div>
              <div class="pp-achievement-description">напиться в эпизоде</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=67#p6276" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/56245.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Тысяча чертей!</div>
              <div class="pp-achievement-description">отыграть морское путешествие</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=86#p6960" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/452629.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Комедиант</div>
              <div class="pp-achievement-description">рассмешить кого-то в эпизоде</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/59436.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Spooky Halloween 2025</div>
              <div class="pp-achievement-description">за участие в хэллоуинском флэшмобе</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/701915.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Happy New Year 2026</div>
              <div class="pp-achievement-description">встретил новый год на обскуре</div>
            </div>
          </div>

          <!-- Новые достижения вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
        </div>

      </div>
    </label>
  </div>
</div>

0

7

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Lorenzo Arainai</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio"></input>
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/978251.gif"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/566925.gif"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/192785.gif"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/712156.gif"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/460960.gif"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/587591.gif"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/154101.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/201784.webp"></img></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/34520.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/772321.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/358588.gif"></img></div>

          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/916982.gif"></img></div>

          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/587591.gif"></img></div>

          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/919580.gif"></img></div>

          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/727007.gif"></img></div>

          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/629324.gif"></img></div>

          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7a/01/7/535797.gif"></img></div>
          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7d/10/4/190151.gif" />
          </div>
          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/824667.gif">
          </div>

          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/930618.gif">
          </div>
          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/471118.gif" />
          </div>

          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7d/10/12/513117.webp" />
          </div>

          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001a/e6/ed/2/826222.gif" />
          </div>
          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7d/10/4/776113.gif" />
          </div>
          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7d/10/4/579732.gif" />
          </div>
          <div class="pp-icon">
            <img src="https://upforme.ru/uploads/001c/7d/10/4/863066.gif" />
          </div>

        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/16696.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/125094.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/262269.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/17843.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/13831.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/743550.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/885462.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/427855.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/601530.png" />
            <div>
              <p>we're dying to live</p>and we're living to die
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/347730.png">
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/62994.png">
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/2/324324.png">
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/585024.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/277566.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/305835.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/700015.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/69569.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/t37791.png"></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/993248.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/610465.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/148774.png" /></div>
          <div class="pp-background"><img src="https://i.pinimg.com/736x/40/93/0f/40930f79fba0f23f4f0e6d7d309091be.jpg" /></div>
          <div class="pp-background"><img src="https://i.pinimg.com/736x/4c/dd/b1/4cddb18ac8d990357b319d6aad340ed3.jpg" /></div>
          <div class="pp-background"><img src="https://i.pinimg.com/736x/b9/73/8c/b9738ccbfa206c080f2b989a9879509a.jpg" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/760230.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/963022.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/841833.png"></div>
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=196#p14941">
            <div class="pp-episode-date">9:38</div>
            <div class="pp-episode-title"> two of crows</div>
            <div class="pp-episode-type">личный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=186#p14425">
            <div class="pp-episode-date">9:39</div>
            <div class="pp-episode-title"> в бликах темноты</div>
            <div class="pp-episode-type">личный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=66#p2103">
            <div class="pp-episode-date">9:39</div>
            <div class="pp-episode-title">the ghost of you</div>
            <div class="pp-episode-type">личный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=82#p3188">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">pick your poison</div>
            <div class="pp-episode-type">личный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=54#p1206">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">running in circles</div>
            <div class="pp-episode-type">личный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=165#p11199">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">after a few flying daggers</div>
            <div class="pp-episode-type">личный</div>
            <div class="pp-episode-status"><img src="https://forumstatic.ru/files/001c/7a/01/61466.svg"></div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=83#p3331">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Красный гимн</div>
            <div class="pp-episode-type">личный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=64#p1772">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Позолота и ржавчина</div>
            <div class="pp-episode-type">личный</div>
            <div class="pp-episode-status"><img src="https://forumstatic.ru/files/001c/7a/01/61466.svg"></div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=67#p2178">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Игра в пепел</div>
            <div class="pp-episode-type">сюжетный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=86#p3561">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Should I stay or should I go?</div>
            <div class="pp-episode-type">личный</div>
            <div class="pp-episode-status"><img src="https://forumstatic.ru/files/001c/7a/01/61466.svg"></div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=181#p13644">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">just like old times</div>
            <div class="pp-episode-type">личный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=138#p8452">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Песок и сталь</div>
            <div class="pp-episode-type">сюжетный</div>
          </a>
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=154#p10553">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">одной из летящих птиц</div>
            <div class="pp-episode-type">личный</div>
          </a>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/2/171718.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Мой любимый бывший вороненок и НАДЕЖНЫЙ агент Инквизиции, целую твои золотые кодерские ручки</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/622545.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Рано или поздно мы с тобой бухнем!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/804589.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Это дерево чтобы птаха на нем сидел и далеко глядел</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/242985.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Значок для ощущения дома</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">

          <a href="https://obscura.rusff.me/viewtopic.php?id=54#p1236" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории

              </div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/38777.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Подающий надежды автор</div>
              <div class="pp-achievement-description">5 постов</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/48913.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Покоритель букв</div>
              <div class="pp-achievement-description">30 постов</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=67#p3412" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/14648.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Герой Тедаса</div>
              <div class="pp-achievement-description">написать пост в квест</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=64#p1772" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/64361.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Конец одной истории</div>
              <div class="pp-achievement-description">закрыть первый эпизод</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/45486.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Значимая фигура</div>
              <div class="pp-achievement-description">закрыть 3 эпизода</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/40193.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Всеобщий любимчик</div>
              <div class="pp-achievement-description">поставить 100 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/92169.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Звезда вечеринки</div>
              <div class="pp-achievement-description">поставить 500 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/46626.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Гений, плейбой, филантроп</div>
              <div class="pp-achievement-description">поставить 1000 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/92169.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Звезда вечеринки</div>
              <div class="pp-achievement-description">поставить 500 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/93781.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Завсегдатай таверны</div>
              <div class="pp-achievement-description">100 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/43610.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Душа компании</div>
              <div class="pp-achievement-description">250 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/44527.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Искусный рассказчик</div>
              <div class="pp-achievement-description">600 сообщений</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=64#p5332" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/151432.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Прилив дофамина</div>
              <div class="pp-achievement-description">отыграть поцелуй</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/67536.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Разумные траты</div>
              <div class="pp-achievement-description">потратить 500 золотых</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/18246.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Искатель приключений</div>
              <div class="pp-achievement-description">принять участие в 5 конкурсах</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/21963.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Ценитель прекрасного</div>
              <div class="pp-achievement-description">оставить рекомендацию в специальной теме</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=83#p5189" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/891357.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">До первой крови</div>
              <div class="pp-achievement-description">отыграть сражение</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=82#p4623" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/448248.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Береги воду, пей вино</div>
              <div class="pp-achievement-description">напиться в эпизоде</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=83#p4720" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/126494.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Без сучка, без задоринки</div>
              <div class="pp-achievement-description">отыграть остановку в лесу</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=66#p4934" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/889265.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Memento mori</div>
              <div class="pp-achievement-description">стать свидетелем чьей-то смерти в эпизоде</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=67#p3634" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/56245.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Тысяча чертей!</div>
              <div class="pp-achievement-description">отыграть морское путешествие </div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=83#p5189" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/786129.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">А потом мне прострелили колено</div>
              <div class="pp-achievement-description">получить ранение в эпизоде</div>
            </div>
          </a>

          <a href="https://obscura.rusff.me/viewtopic.php?id=82#p3330" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/22281.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Oh, Grey Warden...</div>
              <div class="pp-achievement-description">послушать в эпизоде песню барда</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/77078.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Ветеран Обскуры</div>
              <div class="pp-achievement-description">3 месяца на форуме</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/59436.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Spooky Halloween 2025</div>
              <div class="pp-achievement-description">за участие в хэллоуинском флэшмобе</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/701915.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Happy New Year 2026</div>
              <div class="pp-achievement-description">встретил новый год на обскуре</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/212411.png">
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Адвент-календарь '26</div>
              <div class="pp-achievement-description">за открытие новогоднего адвент-календаря</div>
            </div>
          </div>

        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">

          <div class="pp-collection">
            <div class="pp-collection-image">
              <img src="https://forumstatic.ru/files/001c/7a/01/98274.webp?v=1" width="150" height="150">
            </div>
            <div class="pp-collection-description">
              <div class="pp-collection-title">Голубое яйцо</div>
              <ul class="pp-collection-tasks">
                <li class="pp-collection-task">— Закрыть 3 эпизода за месяц;</li>
                <li class="pp-collection-task">— Оставить 10 мемов в специальной теме;</li>
                <li class="pp-collection-task">— Поставить плюсы всем на странице флуда;</li>
                <li class="pp-collection-task">— Написать 3 заявки в нужные;</li>
                <li class="pp-collection-task">— Подарить 20 подарков;</li>
                <li class="pp-collection-task">— Сделать мем про Обскуру.</li>
              </ul>
            </div>
          </div>

          <div class="pp-collection">
            <div class="pp-collection-image">
              <img src="https://forumstatic.ru/files/001c/7a/01/23370.webp?v=1" width="150" height="150">
            </div>
            <div class="pp-collection-description">
              <div class="pp-collection-title">Изумрудное яйцо</div>
              <ul class="pp-collection-tasks">
                <li class="pp-collection-task">— Оставить 30 сообщений во флуде за день;</li>
                <li class="pp-collection-task">— Отыграть NPC под маской;</li>
                <li class="pp-collection-task">— Сменить лз;</li>
                <li class="pp-collection-task">— Собрать 15 достижений;</li>
                <li class="pp-collection-task">— Оставить 50 реклам;</li>
                <li class="pp-collection-task">— Попасть в новостные итоги.</li>
              </ul>
            </div>
          </div>

          <div class="pp-collection">
            <div class="pp-collection-image">
              <img src="https://forumstatic.ru/files/001c/7a/01/40645.webp?v=1" width="150" height="150">
            </div>
            <div class="pp-collection-description">
              <div class="pp-collection-title">Черное яйцо</div>
              <ul class="pp-collection-tasks">
                <li class="pp-collection-task">— Подарить 10 подарков за раз;</li>
                <li class="pp-collection-task">— Оставить 10 артов в специальной теме;</li>
                <li class="pp-collection-task">— Принять участие в книжном клубе;</li>
                <li class="pp-collection-task">— Предложить квест;</li>
                <li class="pp-collection-task">— Закрыть 5 эпизодов;</li>
                <li class="pp-collection-task">— Открыть эпизод в AU.</li>
              </ul>
            </div>
          </div>

          <div class="pp-collection">
            <div class="pp-collection-image">
              <img src="https://forumstatic.ru/files/001c/7a/01/59403.webp?v=1" width="150" height="150">
            </div>
            <div class="pp-collection-description">
              <div class="pp-collection-title">Золотое яйцо</div>
              <ul class="pp-collection-tasks">
                <li class="pp-collection-task">— Провести онлайн 3 часа подряд;</li>
                <li class="pp-collection-task">— Собрать 5 игровых достижений;</li>
                <li class="pp-collection-task">— Записаться в квест;</li>
                <li class="pp-collection-task">— Собрать 10 пазлов;</li>
                <li class="pp-collection-task">— Написать 3 поста за неделю;</li>
                <li class="pp-collection-task">— Оставить 10 заявок в хочу видеть.</li>
              </ul>
            </div>
          </div>

          <div class="pp-collection">
            <div class="pp-collection-image">
              <img src="https://forumstatic.ru/files/001c/7a/01/69263.webp?v=1" width="150" height="150">
            </div>
            <div class="pp-collection-description">
              <div class="pp-collection-title">Волшебное яйцо</div>
              <ul class="pp-collection-tasks">
                <li class="pp-collection-task">— Написать 7 постов за неделю;</li>
                <li class="pp-collection-task">— Открыть эпизод на троих;</li>
                <li class="pp-collection-task">— Оставить 10 сообщений в личном дневнике;</li>
                <li class="pp-collection-task">— Заполнить хронологию 3 раза;</li>
                <li class="pp-collection-task">— Поучаствовать во всех открытых конкурсах;</li>
                <li class="pp-collection-task">— Потратить 5000 золотых в банке.</li>
              </ul>
            </div>
          </div>

          <div class="pp-collection">
            <div class="pp-collection-image">
              <img src="https://forumstatic.ru/files/001c/7a/01/59309.webp?v=1" width="150" height="150">
            </div>
            <div class="pp-collection-description">
              <div class="pp-collection-title">Зеленое яйцо</div>
              <ul class="pp-collection-tasks">
                <li class="pp-collection-task">— Поставить 50 плюсов в репутацию за день;</li>
                <li class="pp-collection-task">— Оставить 3 рекомендации в специальной теме;</li>
                <li class="pp-collection-task">— Написать 50 постов;</li>
                <li class="pp-collection-task">— Открыть соло-эпизод;</li>
                <li class="pp-collection-task">— Указать свой день рождения;</li>
                <li class="pp-collection-task">— Взять вторую роль.</li>
              </ul>
            </div>
          </div>

        </div>
      </div>
    </label>
  </div>
</div>

0

8

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Mahanon Lavellan</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/833770.gif" /></div>
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div>
              <p>i'll make your body a habit</p>you know there's some kind of magic
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/509035.png" />
            <div>
              <p>i'll make your body a habit</p>you know there's some kind of magic
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/587758.png" />
            <div>
              <p>Spit your horror in my face</p>you can't touch my soul
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/417754.png" />
            <div>
              <p>Spit your horror in my face</p>you can't touch my soul
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/399559.png" />
            <div>
              <p>Spit your horror in my face</p>you can't touch my soul
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/536596.png" />
            <div>
              <p>Spit your horror in my face</p>you can't touch my soul
            </div>
          </div>

          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/852166.png" /></div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=137#p8448">
            <div class="pp-episode-date">9:41</div>
            <div class="pp-episode-title">ash and thunder</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=54#p1206">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">running in circles</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=67#p2178">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Игра в пепел</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=125#p6337">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">just like old times</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=138#p8452">
            <div class="pp-episode-date">9:46</div>
            <div class="pp-episode-title">Песок и сталь</div>
          </a>

          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://i.imgur.com/pltNUrz.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Пусть голова не беспокоит, Маханон. Я раздобыл для тебя обезболивающее у самого первоклассного лекаря. Дай знать, если не поможет - и я навещу лекаря еще раз и найду более... действенный способ напомнить ему, что мне нужен самый лучший товар для моего дорогого друга.</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/31553.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Самый лучший Инквизитор, люблю и обожаю всем сердцем. Держи запасную руку на всякий случай!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/441161.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Немного уюта и тепла для любимого брата!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://i.imgur.com/pltNUrz.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Это антидепрессанты от Санты</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/780329.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Чтоб каждый поход по любому поводу приводил к сладким результатам</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>

          <!-- Новые подарки вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <a href="https://obscura.rusff.me/viewtopic.php?id=67#p3325" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории</div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/14648.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Герой Тедаса</div>
              <div class="pp-achievement-description">написать пост в квест</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/93781.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Завсегдатай таверны</div>
              <div class="pp-achievement-description">100 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/43610.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Душа компании</div>
              <div class="pp-achievement-description">250 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/44527.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Искусный рассказчик</div>
              <div class="pp-achievement-description">600 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/40193.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Всеобщий любимчик</div>
              <div class="pp-achievement-description">поставить 100 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/92169.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Звезда вечеринки</div>
              <div class="pp-achievement-description">поставить 500 плюсов в репутацию</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/59436.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Spooky Halloween 2025</div>
              <div class="pp-achievement-description">за участие в хэллоуинском флэшмобе</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/701915.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Happy New Year 2026</div>
              <div class="pp-achievement-description">встретил новый год на обскуре</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
        </div>

      </div>
    </label>
  </div>
</div>

0

9

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Marian Hawke</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/978251.gif" /></div>
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div>
              <p>Do I look like the leader</p>of this merry band of misfits?
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/626964.png" />
            <div>
              <p>Do I look like the leader</p>of this merry band of misfits?
            </div>
          </div>

          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/812564.png" /></div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=103#p4840">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">о принцах и/в/на помойках</div>
          </a>

          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/492109.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Теплых котов и вкусных напитков</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <!-- Новые достижения вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
        </div>

      </div>
    </label>
  </div>
</div>

0

10

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Solas</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/46192.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/89939.gif" /></div>
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/4/154101.gif" /></div>
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div>
              <p>come what may</p>i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://forumstatic.ru/files/001c/7a/01/17737.png" />
            <div>
              <p>i suspect</p>you have questions
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/587758.png" />
            <div>
              <p>i suspect</p>you have questions
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/889009.png" />
            <div>
              <p>i suspect</p>you have questions
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/417754.png" />
            <div>
              <p>i suspect</p>you have questions
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/621153.png" />
            <div>
              <p>i suspect</p>you have questions
            </div>
          </div>

          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/2/790575.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7a/01/7/484092.png" /></div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=83#p3331">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Красный гимн</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=65#p1864">
            <div class="pp-episode-date">9:42</div>
            <div class="pp-episode-title">Блеф</div>
          </a>

          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/21542.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Самый мудрый и замечательный Волчара, которого я встречал. Сам знаешь, последовал бы за тобой хоть на край света и снял бы все Завесы, но... Надеюсь, что мы с тобой скоро встретимся. Жаль, что по разные стороны...</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/56376.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Волче, расчёска для тебя. Если не получится снять *, то можешь ее хотя бы почесать. Люблю всё, что ты делаешь, спасибо, что ты есть, солнце!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/406522.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Шампунь тебе, для блестящей шевелюры &lt;3</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/780329.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Вместо чая — какао с зефирками! Вдруг понравится</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/8/103647.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Сувенир для личной радости и сохранения мира, от сердца отрываю!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <a href="https://obscura.rusff.me/viewtopic.php?id=65#p2225" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории</div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/59436.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Spooky Halloween 2025</div>
              <div class="pp-achievement-description">за участие в хэллоуинском флэшмобе</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/701915.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Happy New Year 2026</div>
              <div class="pp-achievement-description">встретил новый год на обскуре</div>
            </div>
          </div>

          <!-- Новые достижения вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
        </div>

      </div>
    </label>
  </div>
</div>

0

11

Код:
<div class="character">
  <div class="pp-header">
    <div class="pp-name">Zevran Arainai</div>
    <div class="pp-info">раса, фракция, name surname - name of the song</div>
  </div>

  <div class="pp-navigation">
    <label class="pp-label pp-label1">
      <input id="option1" checked="checked" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title1">Профиль и хронология</span>
      <div class="pp-section pp-section1">

        <div class="pp-icons">
          <div class="pp-icon"><img src="https://upforme.ru/uploads/001c/7d/10/2/619952.gif" /></div>
          <div class="pp-icon"><img src="https://forumstatic.ru/files/001c/7a/01/85348.gif" /></div>
          <!-- Новые иконки вставлять здесь -->
        </div>

        <div class="pp-plates">
          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7d/10/2/116861.png" />
            <div>
              <p>come what may</p>
              i'm here at the end
            </div>
          </div>

          <div class="pp-plate">
            <img src="https://upforme.ru/uploads/001c/7a/01/7/211955.png" />
            <div>
              <p>one, two, baby I want you</p>
              three, four, right on the floor
            </div>
          </div>

          <!-- Новые плашки вставлять здесь -->
        </div>

        <div class="pp-backgrounds">
          <div class="pp-background"><img src="https://forumstatic.ru/files/001c/7a/01/25927.png" /></div>
          <div class="pp-background"><img src="https://upforme.ru/uploads/001c/7d/10/2/469318.png" /></div>
          <!-- Новые фоны вставлять здесь -->
        </div>

        <div class="pp-episodes">
          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=51#p722">
            <div class="pp-episode-date">9:30</div>
            <div class="pp-episode-title">dance macabre</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=77#p2841">
            <div class="pp-episode-date">9:30</div>
            <div class="pp-episode-title">a crow claimed</div>
          </a>

          <a class="pp-episode" href="https://obscura.rusff.me/viewtopic.php?id=66#p2103">
            <div class="pp-episode-date">9:39</div>
            <div class="pp-episode-title">the ghost of you</div>
          </a>

          <!-- Новые эпизоды вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label2">
      <input id="option2" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title2">Подарки</span>
      <div class="pp-section pp-section2">

        <div class="pp-gifts">
          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/48535.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Пусть этот чудесный аромат напоминает тебе о нашей встрече. Целую, Лори ;3</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/330347.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Это долийские варежки из оленьей кожи!</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/622545.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Два бокала влюбленным за тем столиком</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7a/01/7/622545.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С новым годом и с новой встречей</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/848093.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">С Новым годом! Пусть Обскура принесет тебе много позитивных эмоций в 2026.</div>
            </div>
          </div>

          <div class="pp-gift">
            <div class="pp-gift-image">
              <img src="https://i.ibb.co/9kzdy7cW/wine.png" />
            </div>
            <div class="pp-gift-wrapper">
              <div class="pp-gift-title">Подарок</div>
              <div class="pp-gift-description">Бутылка лучшего вина для грандмастера Зеврана ;)</div>
            </div>
          </div>

          <!-- Новые подарки вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label3">
      <input id="option3" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title3">Достижения</span>
      <div class="pp-section pp-section3">

        <div class="pp-achievements">
          <a href="https://obscura.rusff.me/viewtopic.php?id=51#p745" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/88152.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Начало большой истории</div>
              <div class="pp-achievement-description">первый пост</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/38777.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Подающий надежды автор</div>
              <div class="pp-achievement-description">5 постов</div>
            </div>
          </div>

          <a href="https://obscura.rusff.me/viewtopic.php?id=51#p722" class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/64361.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Конец одной истории</div>
              <div class="pp-achievement-description">закрыть первый эпизод</div>
            </div>
          </a>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://forumstatic.ru/files/001c/7d/10/93781.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Завсегдатай таверны</div>
              <div class="pp-achievement-description">100 сообщений</div>
            </div>
          </div>

          <div class="pp-achievement pp-achievement-achieved">
            <div class="pp-achievement-image">
              <img src="https://upforme.ru/uploads/001c/7d/10/4/59436.png" />
            </div>
            <div class="pp-achievement-wrapper">
              <div class="pp-achievement-title">Spooky Halloween 2025</div>
              <div class="pp-achievement-description">за участие в хэллоуинском флэшмобе</div>
            </div>
          </div>

          <!-- Новые достижения вставлять здесь -->
        </div>
      </div>
    </label>

    <label class="pp-label pp-label4">
      <input id="option4" name="toggle" type="radio" />
      <span class="pp-section-title pp-section-title4">Коллекционирование</span>
      <div class="pp-section pp-section4">

        <div class="pp-collections">
        </div>

      </div>
    </label>
  </div>
</div>

0

12

Код:
<div class="pp-collection">
  <div class="pp-collection-image">
    <img src="https://forumstatic.ru/files/001c/7a/01/98274.webp?v=1" width="150" height="150">
  </div>
  <div class="pp-collection-description">
    <div class="pp-collection-title">Голубое яйцо</div>
    <ul class="pp-collection-tasks">
      <li class="pp-collection-task">— Закрыть 3 эпизода за месяц;</li>
      <li class="pp-collection-task">— Оставить 10 мемов в специальной теме;</li>
      <li class="pp-collection-task">— Поставить плюсы всем на странице флуда;</li>
      <li class="pp-collection-task">— Написать 3 заявки в нужные;</li>
      <li class="pp-collection-task">— Подарить 20 подарков;</li>
      <li class="pp-collection-task">— Сделать мем про Обскуру.</li>
    </ul>
  </div>
</div>

<div class="pp-collection">
  <div class="pp-collection-image">
    <img src="https://forumstatic.ru/files/001c/7a/01/23370.webp?v=1" width="150" height="150">
  </div>
  <div class="pp-collection-description">
    <div class="pp-collection-title">Изумрудное яйцо</div>
    <ul class="pp-collection-tasks">
      <li class="pp-collection-task">— Оставить 30 сообщений во флуде за день;</li>
      <li class="pp-collection-task">— Отыграть NPC под маской;</li>
      <li class="pp-collection-task">— Сменить лз;</li>
      <li class="pp-collection-task">— Собрать 15 достижений;</li>
      <li class="pp-collection-task">— Оставить 50 реклам;</li>
      <li class="pp-collection-task">— Попасть в новостные итоги.</li>
    </ul>
  </div>
</div>

<div class="pp-collection">
  <div class="pp-collection-image">
    <img src="https://forumstatic.ru/files/001c/7a/01/40645.webp?v=1" width="150" height="150">
  </div>
  <div class="pp-collection-description">
    <div class="pp-collection-title">Черное яйцо</div>
    <ul class="pp-collection-tasks">
      <li class="pp-collection-task">— Подарить 10 подарков за раз;</li>
      <li class="pp-collection-task">— Оставить 10 артов в специальной теме;</li>
      <li class="pp-collection-task">— Принять участие в книжном клубе;</li>
      <li class="pp-collection-task">— Предложить квест;</li>
      <li class="pp-collection-task">— Закрыть 5 эпизодов;</li>
      <li class="pp-collection-task">— Открыть эпизод в AU.</li>
    </ul>
  </div>
</div>

<div class="pp-collection">
  <div class="pp-collection-image">
    <img src="https://forumstatic.ru/files/001c/7a/01/59403.webp?v=1" width="150" height="150">
  </div>
  <div class="pp-collection-description">
    <div class="pp-collection-title">Золотое яйцо</div>
    <ul class="pp-collection-tasks">
      <li class="pp-collection-task">— Провести онлайн 3 часа подряд;</li>
      <li class="pp-collection-task">— Собрать 5 игровых достижений;</li>
      <li class="pp-collection-task">— Записаться в квест;</li>
      <li class="pp-collection-task">— Собрать 10 пазлов;</li>
      <li class="pp-collection-task">— Написать 3 поста за неделю;</li>
      <li class="pp-collection-task">— Оставить 10 заявок в хочу видеть.</li>
    </ul>
  </div>
</div>

<div class="pp-collection">
  <div class="pp-collection-image">
    <img src="https://forumstatic.ru/files/001c/7a/01/69263.webp?v=1" width="150" height="150">
  </div>
  <div class="pp-collection-description">
    <div class="pp-collection-title">Волшебное яйцо</div>
    <ul class="pp-collection-tasks">
      <li class="pp-collection-task">— Написать 7 постов за неделю;</li>
      <li class="pp-collection-task">— Открыть эпизод на троих;</li>
      <li class="pp-collection-task">— Оставить 10 сообщений в личном дневнике;</li>
      <li class="pp-collection-task">— Заполнить хронологию 3 раза;</li>
      <li class="pp-collection-task">— Поучаствовать во всех открытых конкурсах;</li>
      <li class="pp-collection-task">— Потратить 5000 золотых в банке.</li>
    </ul>
  </div>
</div>

<div class="pp-collection">
  <div class="pp-collection-image">
    <img src="https://forumstatic.ru/files/001c/7a/01/59309.webp?v=1" width="150" height="150">
  </div>
  <div class="pp-collection-description">
    <div class="pp-collection-title">Зеленое яйцо</div>
    <ul class="pp-collection-tasks">
      <li class="pp-collection-task">— Поставить 50 плюсов в репутацию за день;</li>
      <li class="pp-collection-task">— Оставить 3 рекомендации в специальной теме;</li>
      <li class="pp-collection-task">— Написать 50 постов;</li>
      <li class="pp-collection-task">— Открыть соло-эпизод;</li>
      <li class="pp-collection-task">— Указать свой день рождения;</li>
      <li class="pp-collection-task">— Взять вторую роль.</li>
    </ul>
  </div>
</div>

0

Быстрый ответ

Напишите ваше сообщение и нажмите «Отправить»



Вы здесь » ams search: dragon age » admin » Перенести ЛС 2.0


Рейтинг форумов | Создать форум бесплатно