Vertical scrollin bot card

<style>
/*💚 vertical scrolling bot card of idk u name it 🌸*/

.pp-cc-list-container{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;

  gap:25px;
  padding:10px;

  overflow:visible;
}

.pp-cc-wrapper:hover{
  box-shadow:none;
}

div:has(> .profile-character-card-stack),
div:has(~ .profile-character-card-stack){
  flex:1 1 370px;
  max-width:370px;

  background:transparent !important;
  box-shadow:none;
}

@media (max-width:800px){

  div:has(> .profile-character-card-stack),
  div:has(~ .profile-character-card-stack){
    flex:1 1 100%;
    max-width:100%;
  }

}

.css-1henxb,
.css-effh3d{
  display:none;
  box-shadow:none;
}

.profile-character-card-stack a{
  display:contents;
}

.profile-character-card-stack{
  width:100%;
  height:400px;

  display:grid;

  grid-template-columns:35px 170px 1fr;
  grid-template-rows:40px 1fr auto;

  grid-template-areas:
    "name pfp chats"
    "name pfp ."
    "name pfp desc"
    "name tags tags";

  gap:8px;
  padding:8px;

  position:relative;
  overflow:hidden;

  border-radius:12px;
  background:transparent;
}

.profile-character-card-stack-link-component-box{
  grid-area:name;

  position:relative;

  writing-mode:vertical-rl;
  text-orientation:mixed;

  transform:rotate(180deg);

  display:flex;
  justify-content:center;
  align-items:center;

  width:35px;
  height:100%;

  border:1px solid #8eb698;
  background:#697c7050;
  border-radius:8px;

  overflow:hidden;
}

.pp-cc-name{
  transition:opacity .35s ease;
  color:#8eb698;
  font:1rem cinzel decorative;

  display:flex;
  justify-content:center;
  align-items:center;

  width:100%;
  height:100%;
}

.profile-character-card-stack-link-component-box::after{
  content:"Non Series";

  position:absolute;
  inset:0;

  display:flex;
  justify-content:center;
  align-items:center;

  padding:4px;

  color:#8eb698;
  font:1rem cinzel decorative;
  text-align:center;

  opacity:0;
  transition:opacity .4s ease;
}

.pp-cc-wrapper:has(.pp-tag-urbanhearts)
.profile-character-card-stack-link-component-box::after{
  content:"Urban Hearts";
}

.pp-cc-wrapper:has(.pp-tag-kanjanawatfamily)
.profile-character-card-stack-link-component-box::after{
  content:"Kanjanawat Family";
}

.pp-cc-wrapper:hover .profile-character-card-stack-link-component-box::after{
  opacity:1;
}

.pp-cc-wrapper:hover .pp-cc-name{
  opacity:0;
}

.profile-character-card-avatar-aspect-ratio{
  grid-area:pfp;

  width:170px;
  height:100%;

  border:1px solid #8eb698;
  border-radius:10px;

  overflow:hidden;
}

.pp-cc-avatar{
  width:100%;
  height:100%;

  object-fit:cover;

  transform:scale(1.1);
  transition:all .5s ease;
}

.pp-cc-wrapper:hover .pp-cc-avatar{
  transform:scale(1);
}

.profile-character-card-stats-box{
  grid-area:chats;
  position:relative;
}

.pp-cc-ribbon-wrap{
  clip-path:unset;
  box-shadow:none;
  background:none;
}

.pp-cc-ribbon{
  position:absolute;
  left:-8px;

  border-bottom:2px solid transparent;
  border-image:linear-gradient(to right, transparent, #8eb698, transparent) 1;
}

.pp-cc-chats{
  color:#f2efe2;
  justify-content:center;
  align-items:center;
  font:13px share tech;
}

.pp-cc-chats:before{
  content:"Chats:";
  color:#8eb698;
  font:1rem cinzel decorative;
}

.profile-character-card-description-box{
  grid-area:desc;

  height:170px;

  padding:10px;

  overflow-y:auto;

  border:1px solid #8eb698;
  border-radius:10px;

  background:#697c7050;
  backdrop-filter:blur(10px);
}

.profile-character-card-description-box::-webkit-scrollbar{
  display:none;
}

.pp-cc-description p{
  color:#8eb698;
  font:12px share tech;
  text-align:center;
  line-height:1.5;
}

.pp-cc-description p::selection{
  background:transparent !important;
}

.pp-cc-description p:first-letter{
  color:#f2efe2;
  font:1.5rem cinzel decorative;
}

.pp-cc-tags{
  grid-area:tags;

  display:flex;

  max-height:60px;
  overflow-y:auto;

  border:1px solid #f2efe2;
  border-radius:10px;
}

.pp-cc-tags::-webkit-scrollbar{
  display:none;
}

.pp-cc-tags-item,
.pp-tag-limitless{
  background:none;
  border:none;

  color:#f2efe2;
  font:13px share tech;

  transition:all .3s ease;
}

.pp-cc-tags-item:hover,
.pp-tag-limitless:hover{
  background:none;
  border:none;

  color:#8eb698;
  letter-spacing:1px;
}

.pp-cc-tags *{
  display:inline-block;
}

.profile-character-card-box,
.pp-cc-star-line,
.pp-cc-star,
.profile-character-card-creator-name-link,
.pp-cc-chats svg{
  display:none !important;
}

</style>