:root {
  --owner: var(--accent-primary);
  --admin: #ff0000;
  --dev: #c259fb;
  --srmod: #a600ff;
  --mod: #7e43a6;
  --tmod: #7e43a6;
  --helper: #70c004;
  --builder: #7055a8;
}

    
    .role-section {
      margin-bottom: 60px;
    }

.role-title {
  font-size: 2rem;
  margin-bottom: 25px;
  /* padding: 10px 20px; */
  background: var(--bg-secondary);
  border-radius: 3px;
  color: var(--text-color);
  text-transform: uppercase;
  font-weight: 800;

}
.role-title.owner { border-left-color: var(--owner); color: var(--owner);}
.role-title.admin { border-left-color: var(--admin); color: var(--admin);}
.role-title.dev { border-left-color: var(--dev); color: var(--dev);}
.role-title.srmod { border-left-color: var(--srmod); color: var(--srmod);}
.role-title.mod { border-left-color: var(--mod); color: var(--mod);}
.role-title.tmod { border-left-color: var(--tmod); color: var(--tmod);}
.role-title.helper { border-left-color: var(--helper); color: var(--helper);}
.role-title.builder { border-left-color: var(--builder); color: var(--builder);}


    .team-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr 1fr;
      gap: 30px;
    }

    .team-card {
    background-color: var(--div-bg);
  border: 2px solid var(--tab-bg);
      border-radius: 12px;
      overflow: hidden;
      transition: transform 0.3s;
    
    }


    .skin {
      width: 100%;
      max-width: 148px;
      display: block;
      margin: auto;
      border-radius: 8px;
    }

    .info {
      background-color: var(--tab-bg);
      padding: 15px;
      width: 100%;
      box-sizing: border-box;
    }

    .username {
      font-size: 1.3rem;
      font-weight: bold;
    }

    .rank {
      font-weight: 900;
      margin: 8px 0;
      text-transform: uppercase;
    }

    .rank.owner { color: var(--owner); }
    /* .rank.manager { color: var(--manager); } */
    .rank.admin { color: var(--admin); }
    .rank.dev { color: var(--dev); }
    .rank.srmod { color: var(--srmod); }
    .rank.mod { color: var(--mod); }
    .rank.tmod { color: var(--tmod); }
    .rank.helper { color: var(--helper); }
    .rank.builder { color: var(--builder); }

    .description {
      font-size: 0.9rem;
      color: #ccc;
    }