<pre><span><style>
  button[aria-label="Profile"] svg {
    display: none;
  }
  button[aria-label="Profile"] div div[size] {
    border-radius: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(AVATAR);
  }
</style>

<aside> 💡 Replace aria-label with the Tab's name, and AVATAR to the profile picture.

</aside>

Please note that you will have to put this on every single details tab on your bottom bar to make it consistent.

Simple Notification Badge

<pre><span><style>
 button[aria-label="Profile"]::before {
content: "";
position: absolute;
top: 13px;
right: 20px;
z-index: 1;
  height: 11px;
  width: 11px;
  background-color: red;
  border-radius: 50%;
  border: 2px solid #040506;
}

Counting # Notifications Badge

<pre><span><style>
 button[aria-label="Profile"]::before {
content: "3";
position: absolute;
font-size: 11px;
font-weight: 800;
color: white;
 padding: 3px;
  top: 6px;
  right: 13px;
z-index: 1;
  height: 20px;
  width: 20px;
  background-color: red;
  border-radius: 50%;
}