Shrink the Hamburger icon on phones

I have spent DAYS on this.
The hamburger, along with the word “Menu” are huge ugly honkers when viewed on a smart phone. They are the same size as the (rather large) title and look terrible.
People say, oh just go into CSS and specify a smaller font size for the menu button.
NOPE. I have done this in the CSS file, in Custom CSS, put !important everywhere. It doesn’t work!
Possibly I need to modify the Header.php file, because it specifies that the FA bars icon is being used. This is where it all starts to go over my head.
Also, the hamburger appears on my horizontal tablet. I want the “real” menu here. Can’t seem to change it. Though the icon is much smaller on my tablet. In fact, it’s so small I can hardly see it.
I didn’t think I was such a CSS newbie, but sizeable chunks of my life are now gone. Help!