XF 2.3 Animated Online indicator after 2.3.4 upgrade

[vape.to]

Good day folks, wondering if anyone has a solution for this small but annoying issue:

I have been using this line in extra.less for about 2 years without any issues, but when added it to the same theme after 2.3.4 upgrade only lights up top 20% of the avatar, instead of the full avatar, playing with "width" option only fixed desktop but screws up mobile.

.avatar.avatar--default.avatar--default--dynamic,
.avatar.avatar--default.avatar--default--text {
    border: 3px solid rgba(0,0,0,0.25);
    font-weight: 900;
}

.avatar.avatar--xxs.avatar--default.avatar--default--dynamic,
.avatar.avatar--xxs.avatar--default.avatar--default--text {
    border: 2px solid rgba(0,0,0,0.25);
    font-weight: 900;
}

.avatar.avatar--l.avatar--default.avatar--default--dynamic,
.avatar.avatar--l.avatar--default.avatar--default--text {
    border: 12px solid rgba(0,0,0,0.25);
    font-weight: 900;
}

.avatar.avatar--m.avatar--default.avatar--default--dynamic,
.avatar.avatar--m.avatar--default.avatar--default--text {
    border: 6px solid rgba(0,0,0,0.25);
    font-weight: 900;
}

.avatar.avatar--o.js-avatar.js-avatarCropper.avatar--default.avatar--default--dynamic {
    border: 6px solid rgba(0,0,0,0.25);
    font-weight: 900;
}

.node-subNodesFlat{
    display: block;
}


.message-avatar-wrapper
{
    position: relative;
    display: inline-block;
    vertical-align: bottom;

    .message-avatar-online
    {
        position: absolute;
        top: -1px;
        left: 6px;
        bottom: -1px;
        right: -1px;
        box-shadow: 0 0 15px rgb(70, 177, 37), inset 0 0 20px white; 
        border: 2px solid transparent;
        border-top-color: rgb(70, 177, 37);
        border-left-color: rgb(70, 177, 37);
        border-bottom-color: rgb(70, 177, 37);
        border-right-color: rgb(70, 177, 37); 
        border-radius: (5%);
    -webkit-transform: scale(1);
    -webkit-animation: online 2.5s ease-in-out infinite;
    animation: online 2.5s ease-in-out infinite
}
@-webkit-keyframes online
{
      0% {opacity: 1;-webkit-transform: scale(1)}
     50% {opacity: .9}
    100% {opacity: 1;-webkit-transform: scale(1)}
}

@keyframes online
{
      0% {opacity: 9;transform: scale(1)}
     50% {opacity: .1}
    100% {opacity: 9;transform: scale(1)}
}
}

.message-avatar-wrapper .message-avatar-online::before {
  display: none;
}

.message-avatar-wrapper .message-avatar-online{
  left: 6px !important;
  right: -1px !important;
}