[hideprofile]

[html]
<div class="ams-wrap">
  <div class="ams-top">
    <div class="ams-side">
      <div class="ams-side-btn-h ams-side-btn-big">добро пожаловать в мир дерьмодемонов </div>
      <div class="ams-side-note">
        #рисованные_внешности #городская мистика #способности #демоны #хоррор<br>
      </div>

      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=2" class="ams-side-btn">правила и фак</a>
      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=9" class="ams-side-btn">сюжет</a>
      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=13" class="ams-side-btn">о мире</a>
      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=12" class="ams-side-btn">о городе</a>   
      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=10" class="ams-side-btn">группировки</a>
      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=11" class="ams-side-btn">организации</a>
      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=4" class="ams-side-btn">внешности</a>
      <a href="https://fatumiunget.rusff.me/viewtopic.php?id=5" class="ams-side-btn">роли</a>

      <div class="ams-side-note">
        <span>однажды по всему миру появились разломы... и человечеству пришлось учиться давать отпор полчищам демонов</span>
      </div>
    </div>

    <div class="ams-main">
      <div class="ams-hero">
        <div class="ams-logo">fatum</div>
      </div>

      <div class="ams-bottom">
        <!-- Левая колонка: внешности -->
        <div class="ams-col">
          <div class="ams-title">ЗАНЯТЫЕ ВНЕШНОСТИ</div>
          <div class="ams-box">
            <div class="ams-scroll">

<div class="ams-item">bleach // jushiro ukitake  за <a href="https://fatumiunget.rusff.me/profile.php?id=122">aid</a> до 13.09</div>
<div class="ams-item">bleach // shunsui kyoraku за <a href="https://fatumiunget.rusff.me/profile.php?id=134">cao yunli</a>  до 13.09</div>
<div class="ams-item">hand jumper // sayeon lee за <a href="https://fatumiunget.rusff.me/profile.php?id=74"> judith bell</a> до 13.09</div>
<div class="ams-item">Team Fortress 2 // Medic за <a href="https://fatumiunget.rusff.me/profile.php?id=162"> toto muller</a> до 15.09</div>
<div class="ams-item">overwatch //  Mercy за <a href="ссылка на профиль"> сhristy horner</a> до 15.09</div>
<div class="ams-item">genshin impact // tsaritsa за <a href="https://fatumiunget.rusff.me/profile.php?id=15"> gabriela kern</a>  до 18.09</div>
<div class="ams-item">kaijuu 8-gou // hoshina soshiro за <a href="https://fatumiunget.rusff.me/profile.php?id=132"> puppy</a> до 14.10</div>

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

        <!-- Правая колонка: акции и роли -->
        <div class="ams-col">
          <div class="ams-title">ЗАНЯТЫЕ АКЦИИ / РОЛИ</div>
          <div class="ams-box">
            <div class="ams-scroll">

<div class="ams-item"><b>нииэд - эксперт по демонам S-класса</b> за <a href="https://fatumiunget.rusff.me/profile.php?id=122">aid</a> до  13.09</div> 
<div class="ams-item"><b>нииэд - руководитель полевиков</b> за <a href="https://fatumiunget.rusff.me/profile.php?id=134">cao yunli</a>  до  13.09</div>   
<div class="ams-item"><b>руководитель сектора оракулов</b> за <a href="https://fatumiunget.rusff.me/profile.php?id=74">judith bell</a>  до 13.09</div>
<div class="ams-item"><a href="https://fatumiunget.rusff.me/viewtopic.php?id=36#p67">casper</a> за <a href="https://fatumiunget.rusff.me/profile.php?id=153">casper</a> до 13.09</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="ams-lower">
    <div class="ams-leg">
      <div class="ams-admins-title">сильнейшие мира сего</div>
      <div class="ams-admin-row">
        <div class="ams-admin">
          <div class="ams-admin-tip">главный фембой</div>
          <div class="ams-admin-avatar"><img src="https://upforme.ru/uploads/001c/b4/bc/5/979884.gif"></div>
          <div class="ams-admin-name">пикси</div>
          <div class="ams-admin-user">@succubus0212</div>
        </div>
        <div class="ams-admin">
          <div class="ams-admin-tip">дурка логистикс</div>
          <div class="ams-admin-avatar"><img src="https://upforme.ru/uploads/001c/b4/bc/5/612486.gif"></div>
          <div class="ams-admin-name">валера</div>
          <div class="ams-admin-user">@grotesk32</div>
        </div>
        <div class="ams-admin">
          <div class="ams-admin-tip">дипсих</div>
          <div class="ams-admin-avatar"><img src="https://upforme.ru/uploads/001c/b4/bc/5/934327.gif"></div>
          <div class="ams-admin-name">джет</div>
          <div class="ams-admin-user">@renzoshi</div>
        </div>
        <div class="ams-admin">
          <div class="ams-admin-tip">наш писхиатр</div>
          <div class="ams-admin-avatar"><img src="https://upforme.ru/uploads/001c/b4/bc/5/736770.gif"></div>
          <div class="ams-admin-name">вивитт</div>
          <div class="ams-admin-user">@Chertolox</div>
        </div>
      </div>
    </div>
    <div class="ams-lower-right">
      <div class="ams-rules-bottom">
        <div class="ams-rule">держим всё на 3 денёчка для гостей, 5 для зарегистрированных.</div>
        <div class="ams-rule">если через 3 дня занявший не проявляет признаков жизни — бронь снимается раньше срока.</div>
        <div class="ams-rule">тут же можно обкашлять любые вопросики.</div>
      </div>
    </div>
  </div>
</div>

<style>
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Dela+Gothic+One&display=swap');

.ams-wrap{
  width:900px;
  margin:0 auto;
  font-family:'Manrope', sans-serif;
  color:#111;
  overflow:hidden;
}
.ams-top{
  display:flex;
  align-items:stretch;
}
.ams-side{
  width:230px;
  flex:0 0 230px;
  min-height:355px;
  background:
    linear-gradient(rgba(55,55,55,.78), rgba(55,55,55,.78)),
    linear-gradient(rgba(215,215,215,.18), rgba(215,215,215,.18)),
    url('https://i.pinimg.com/1200x/88/f8/7e/88f87ea498e2699cc83f137290d3c426.jpg') center center / cover no-repeat;
  padding:14px 0 12px;
  box-sizing:border-box;
  text-align:left;
}
.ams-main{
  width:670px;
  flex:0 0 670px;
  padding:10px 10px 0 18px;
  box-sizing:border-box;
}
.ams-side-btn, .ams-admins-title{
  display:block;
  width:192px;
  margin-left:0;
  background:#111111;
  color:#9bcb01;
  text-decoration:none;
  text-align:left;
  font-family:'Dela Gothic One', sans-serif;
  line-height:1.1;
  box-sizing:border-box;
  text-transform:lowercase;
  letter-spacing:.1px;
  padding:7px 8px;
}
.ams-side-btn-h{
  display:block;
  width:192px;
  background:#111111;
  color:#9bcb01;
  text-decoration:none;
  text-align:left;
  font-family:'Dela Gothic One', sans-serif;
  line-height:1.1;
  box-sizing:border-box;
  text-transform:lowercase;
  letter-spacing:.1px;
  padding:7px 8px;
}
.ams-side-btn{
  margin:0 0 6px 0;
  font-size:8px;
  color:#9bcb01;
  box-shadow:inset 3px 0 0 #9bcb01;
  font-weight:400;
}
.ams-side-btn-big{
  font-size:15px;
  padding:8px 8px;
  color:#ffffff;
  margin-bottom:6px;
}
.ams-side-btn:hover{
  color:#646464;
}
.ams-side-note{
  width:192px;
  margin:0 0 10px 10px;
  color:#fff;
  font-size:9px;
  line-height:1.25;
  font-weight:700;
  text-align:left;
  font-family:'Manrope', sans-serif;
}
.ams-side-note span{
  color:#fff;
}
.ams-hero{
  min-height:145px;
  padding:0 0 0 8px;
  box-sizing:border-box;
  position:relative;
  left:-7px;
  overflow:hidden;
  display:flex;
  align-items:flex-end;
}
.ams-logo{
  font-family:'Dela Gothic One', sans-serif;
  font-size:110px;
  line-height:.82;
  color:#2f2f2f;
  letter-spacing:2px;
  text-transform:uppercase;
  transform:translateY(6px);
  white-space:nowrap;
  user-select:none;
  opacity:.9;
}
.ams-bottom{
  display:flex;
  gap:10px;
  margin-top:8px;
  margin-bottom:18px;
  padding-left:6px;
}
.ams-col{
  width:309px;
  flex:0 0 309px;
}
.ams-title{
  width:192px;
  background:#090909;
  color:#9bcb01;
  text-align:left;
  text-transform:uppercase;
  font-family:'Dela Gothic One', sans-serif;
  font-size:10px;
  line-height:1.15;
  font-weight:400;
  padding:8px 8px 9px;
  margin:0 0 8px 0;
  letter-spacing:.2px;
  box-sizing:border-box;
}
.ams-box{
  height:195px;
  background:rgba(239,239,239,.94);
  border:1px solid #2a2a2a;
  padding:8px 7px;
  box-sizing:border-box;
}
.ams-scroll{
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  padding-right:4px;
  box-sizing:border-box;
  scrollbar-width:thin;
  scrollbar-color:#4a4a4a transparent;
}
.ams-scroll::-webkit-scrollbar{
  width:4px;
}
.ams-scroll::-webkit-scrollbar-track{
  background:transparent;
}
.ams-scroll::-webkit-scrollbar-thumb{
  background:#4a4a4a;
  border:none;
  border-radius:0;
}
.ams-scroll::-webkit-scrollbar-button{
  display:none;
  width:0;
  height:0;
}
.ams-item{
  font-size:11px;
  line-height:1.35;
  margin-bottom:6px;
  color:#111;
  word-break:break-word;
  font-family:'Manrope', sans-serif;
}
.ams-red{
  color:#b11515;
}
.ams-lower{
  display:flex;
  align-items:flex-start;
}
.ams-leg{
  width:430px;
  flex:0 0 430px;
  background:
    linear-gradient(rgba(55,55,55,.78), rgba(55,55,55,.78)),
    linear-gradient(rgba(215,215,215,.18), rgba(215,215,215,.18)),
    url('https://i.pinimg.com/1200x/88/f8/7e/88f87ea498e2699cc83f137290d3c426.jpg') center center / cover no-repeat;
  padding:8px 10px 10px 0;
  box-sizing:border-box;
}
.ams-admins-title{
  font-size:8px;
  font-weight:400;
  margin-top:-20px !important;
  margin:0 0 8px 0;
}
.ams-admin-row{
  display:flex;
  gap:14px;
  align-items:flex-start;
  flex-wrap:nowrap;
  padding-left:10px;
}
.ams-admin{
  width:88px;
  flex:0 0 88px;
  position:relative;
}
.ams-admin-avatar{
  width:70px;
  height:22px;
  background:#222 center center/cover no-repeat;
  border:1px solid #2e2e2e;
  margin-bottom:4px;
}
.ams-admin-avatar img{
  width:70px;
  height:22px;
  object-fit:cover;
  display:block;
}
.ams-admin-name{
  font-family:'Dela Gothic One', sans-serif;
  font-size:11px;
  line-height:1.1;
  color:#f0f0f0;
  margin-bottom:3px;
  letter-spacing:.1px;
  text-transform:lowercase;
}
.ams-admin-user{
  font-size:8px;
  line-height:1.15;
  color:#d8d8d8;
  font-family:'Manrope', sans-serif;
}
.ams-admin-tip{
  position:absolute;
  left:0;
  bottom:100%;
  margin-bottom:6px;
  min-width:90px;
  max-width:120px;
  background:#111;
  color:#dedede;
  border:1px solid #2a2a2a;
  padding:5px 6px;
  box-sizing:border-box;
  font-size:8px;
  line-height:1.2;
  font-family:'Manrope', sans-serif;
  opacity:0;
  pointer-events:none;
  transform:translateY(4px);
  transition:.18s ease;
  z-index:5;
}
.ams-admin:hover .ams-admin-tip{
  opacity:1;
  transform:translateY(0);
}
.ams-lower-right{
  width:470px;
  flex:0 0 470px;
  padding:1px 10px 10px 18px;
  box-sizing:border-box;
}
.ams-rules-bottom{
  max-width:430px;
}
.ams-rule{
  position:relative;
  padding-left:16px;
  margin:0 0 12px;
  font-size:11px;
  line-height:1.4;
  color:#4a4a4a;
  font-family:'Manrope', sans-serif;
}
.ams-rule:before{
  content:"✶";
  position:absolute;
  left:0;
  top:0;
  color:#4f4f4f;
  font-size:11px;
}
</style>
[/html]

фандом // внешность за <a href="ссылка на профиль"> никнейм</a> 

<a href="ссылка на акцию">кто</a> за <a href="ссылка на профиль">никнейм</a>  

<b>роль/демон</b> за <a href="ссылка на профиль">никнейм</a>