.UserPic {
    position: relative;

    display: inline-block;

    width: var(--user-pic-size-m-size);
    height: var(--user-pic-size-m-size);
}

.UserPic_hasPlus::after {
    position: absolute;
    z-index: 0;
    top: 50%;
    left: 50%;

    width: var(--user-pic-size-m-size-plus);
    height: var(--user-pic-size-m-size-plus);
    margin: calc(var(--user-pic-size-m-size-plus) / -2) 0 0 calc(var(--user-pic-size-m-size-plus) / -2);

    content: '';

    background: url('./user-pic.assets/plus-circle.svg') center center no-repeat;
    background-size: contain;
}

.UserPic-Image {
    width: 100%;
    height: 100%;

    border-radius: 100px;
    background-color: #fff;
    object-fit: cover;
}
