.tip-standard-styles {
    font-size: 1.4rem !important;
    max-width: min(400px, calc(100vw - 20px)) !important;
    min-width: 50px !important;
    line-height: 150% !important;
}

/* width rather than min-width so the card keeps its 380px size where there is room but can shrink to the viewport; a min-width cannot be overridden by max-width and pinned the tooltip wider than the screen */
.tip-profile-styles {
    width: 380px !important;
    max-width: min(380px, calc(100vw - 20px)) !important;
}

.tip-profile-styles .qtip-title {
    font-size: 1.4rem !important;
    line-height: 150% !important;
    overflow-wrap: anywhere;
}

.tip-profile-styles .profileimage {
    float: left;
    width: 85px;
    height: 85px;
    margin-right: 15px;
    padding: 5px;
}

.tip-profile-styles .userprofile {
    border: 1px solid #DDDDDD;
    width: 100%;
    /* fixed layout so a long unbroken email address or username can't grow the table past the tooltip; auto layout sizes columns from cell content, which overflow-wrap on the cell does not reliably reduce */
    table-layout: fixed;
    font-size: 1.4rem;
    line-height: 120%;
}

/* profile image cell: 64px image plus the cell padding, so fixed layout gives the remaining width to the details */
.tip-profile-styles .userprofile td:first-child {
    box-sizing: border-box;
    width: 84px;
}

.tip-profile-styles .userprofile td {
    padding: 10px;
    border: 0;
    overflow-wrap: anywhere;
}

.tip-profile-styles .userprofile img {
    max-width: 64px;
    max-height: 64px;
}