[hideprofile][html]<style>
.rusff-tabs-wrapper {
  position: relative;
  width: 750px;
  margin: 30px auto;
  font-family: Georgia, serif;
  display: flex;
}

.rusff-tabs {
  display: flex;
  flex-direction: column;
  width: 85px;
}

.rusff-tab {
  flex: 1;
  background: #1f1f1f;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  cursor: pointer;
  transition: 0.3s ease;
  border-right: 2px solid #444;
  font-family: SpecialElite;
  padding: 20px 0;
}

.rusff-tab:hover {
  background: #353535;
}

.rusff-tab.active {
  background: #444;
  transform: rotate(180deg) translateX(-5px);
}

.tab-title {
  font-size: 14px;
  letter-spacing: 4px;
}

.tab-sub {
  font-size: 8px;
  letter-spacing: 2px;
  margin-top: 12px;
  opacity: 0.6;
  text-transform: lowercase;
}

.rusff-content {
  flex: 1;
  background: #f4f4f4;
  padding: 40px;
  min-height: 420px;
  box-shadow: 0 0 25px rgba(0,0,0,0.08);
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: 1.2px;
  text-align: justify;
}

.rusff-content r {
  font-size: 19px;
  color: #baa174 !important;
  font-family: SpecialElite;
}

.rusff-page {
  display: none;
}

.rusff-page.active {
  display: block;
}

.rusff-quote {
  font-size: 9px;
  font-family: cuprum;
  background: #e8e8e8;
  padding: 14px 20px;
  border-left: 4px solid #1f1f1f;
  margin-bottom: 30px;
  color: #555;
  line-height: 1.4;
  letter-spacing: 1.1px;
}

.rusff-quote d {
  font-size: 19px;
  font-family: SpecialElite;
  display: block;
  margin-bottom: 6px;
}
</style>

<div class="rusff-tabs-wrapper">

  <div class="rusff-tabs">
    <div class="rusff-tab active" onclick="openTab(0)">
      <span class="tab-title">ENTRY</span>
      <span class="tab-sub">старт</span>
    </div>

    <div class="rusff-tab" onclick="openTab(1)">
      <span class="tab-title">CAST</span>
      <span class="tab-sub">персонажи</span>
    </div>

    <div class="rusff-tab" onclick="openTab(2)">
      <span class="tab-title">FLOW</span>
      <span class="tab-sub">игра</span>
    </div>

    <div class="rusff-tab" onclick="openTab(3)">
      <span class="tab-title">NOISE</span>
      <span class="tab-sub">прочее</span>
    </div>
  </div>

  <div class="rusff-content">

    <!-- ENTRY -->
    <div class="rusff-page active">
      <div class="rusff-quote">
        <d>ENTRY //</d>
        сюда не приходят «правильно» — сюда просто заходят и остаются, если зацепило.
      </div>

      <r>#</r> привет. это место про игру, атмосферу и людей.<br><br>

      <r>#</r> регистрация = тебе есть 18 и ты принимаешь местные правила игры.<br><br>

      <r>#</r> make posty not war, администрация не ведёт воспитательные беседы. если человек системно приносит дискомфорт — с ним прощаются.<br><br>

      <r>#</r> здесь есть мат, стекло, напряжённые сцены и всё, что обычно идёт с рейтингом <b>18+</b>. учитывай это на входе.
    </div>

    <!-- CAST -->
    <div class="rusff-page">
      <div class="rusff-quote">
        <d>CAST //</d>
        ты не обязан быть каноном, чтобы быть интересным.
      </div>

      <r>#</r> ники — латиница, формат имя/фамилия. если у персонажа одно имя — ок, живём.<br><br>

      <r>#</r> бронь — 3 дня + можно продлить дважды. заявочные роли — через контакт с автором.<br><br>

      <r>#</r> стартовый набор — <b>до 5 персонажей</b>. дальше — сперва покажи игру за предыдущих.<br><br>

      <r>#</r> оригинальные персонажи — да. неканон — обсуждаемо. общее правило простое: не запрещено — значит можно.<br><br>

      <r>#</r> если не уверен — лучше спросить, чем потом переделывать.
    </div>

    <!-- FLOW -->
    <div class="rusff-page">
      <div class="rusff-quote">
        <d>FLOW //</d>
        игра живёт, пока в неё играют. всё остальное — фон.
      </div>

      <r>#</r> базовая активность: одно сообщение в неделю + один пост раз в два месяца.<br><br>

      <r>#</r> три неактива подряд — и роль освобождается.<br><br>

      <r>#</r> на реакцию даётся 3 дня, на пост — до 10, если процесс затянулся.<br><br>

      <r>#</r> маски используем только там, где им место — в альтернативных эпизодах.
    </div>

    <!-- NOISE -->
    <div class="rusff-page">
      <div class="rusff-quote">
        <d>NOISE //</d>
        лишний шум всегда мешает услышать главное.
      </div>

      <r>#</r> реклама — только в специально отведённой теме.<br><br>

      <r>#</r> в личные сообщения, посты и любые другие места её приносить не нужно.
    </div>

  </div>
</div>

<script>
function openTab(index) {
  var pages = document.querySelectorAll('.rusff-page');
  var tabs = document.querySelectorAll('.rusff-tab');

  pages.forEach(function(page) {
    page.classList.remove('active');
  });

  tabs.forEach(function(tab) {
    tab.classList.remove('active');
  });

  pages[index].classList.add('active');
  tabs[index].classList.add('active');
}
</script>[/html]