If you change the style as follows, it *seems* to fix the cutoffs, at least on Stack Apps.

Haven't tested it hardly any yet, though.

    // ==UserScript==
    // @name        StackExchange, replace badge icons
    // @match       *://*.askubuntu.com/*
    // @match       *://*.mathoverflow.net/*
    // @match       *://*.serverfault.com/*
    // @match       *://*.stackapps.com/*
    // @match       *://*.stackexchange.com/*
    // @match       *://*.stackoverflow.com/*
    // @match       *://*.superuser.com/*
    // @exclude     *://api.stackexchange.com/*
    // @exclude     *://blog.*.com/*
    // @exclude     *://chat.*.com/*
    // @exclude     *://data.stackexchange.com/*
    // @exclude     *://elections.stackexchange.com/*
    // @exclude     *://openid.stackexchange.com/*
    // @exclude     *://stackexchange.com/*
    // @exclude     *://*/review
    // @grant       GM_addStyle
    // @run-at      document-start
    // ==/UserScript==

    GM_addStyle ( `
        /* change icons of badges */
        .badge1, .badge2, .badge3 {
            background-image: url("https://svgshare.com/i/9LE.svg") !important;
            margin: 0 !important;
            width: 14px !important;
            height: 14px !important;
        }
        .badge1 { background-position: -99px -398px !important; }
        .badge2 { background-position: -79px -398px !important; }
        .badge3 { background-position: -59px -398px !important; }
    ` );