Need help adding social icon

I’ve been using the Hueman theme on my page at http://www.noodohs.com and I would like to add a new social icon to the social menu that gets displayed on the right side and in the footer. I followed these instructions, but it doesn’t seem to be working for me. My end goal is to have an icon/link to my page on Beam, which is currently being handled by the Twitch icon (not ideal, obviously). To that end, here is my functions.php based on that tutorial:

<?php
/* Write your awesome functions below */

add_filter('tc_default_socials', 'add_new_socials', 20);
function add_new_socials($socials){
    $new_socials = array(
        //tc_yoursocial => array
        'tc_beam' => array(
            'link_title'    => __( 'Follow me on Beam'), //title displayed on mouse hover
            'option_label'  => __('Beam profile url'),
            'default'       => "https://beam.pro" //your social link here
        ),
    );
 
    return array_merge( $socials, $new_socials );
}

And then here is what is in my style.css:

/*
Theme Name: Noodohs - Hueman child
Version: 1.0
Description: A child theme of Hueman
Template: hueman
Author: Nick Glover
*/
/* Your awesome customization starts here */

/* Beam */ 
.icon-beam:before {
    content: "";
    width: 18px;
    height: 18px;
    display: inline-block;
    background: url("https://www.noodohs.com/wp-content/uploads/2016/12/beam_ball_white.png") no-repeat;
    background-size: 18px 18px
}
 
/* change beam icon size in sidebars*/
.social-block.widget_social .icon-beam:before {
    width: 14px;
    height: 14px;
    background-size: 14px 14px;
}
 
/* change beam icon size in footer */
#footer.footer .colophon .icon-beam:before {
    width: 16px;
    height: 16px;
    background-size: 16px 16px;
}

What am I doing wrong? I am not super knowledgeable about these things, so maybe someone can enlighten me.