Short answer, this should probably do the trick:

div.bg-main.slideup-panel__header { background: #ababab !important; } 

Just replace the #ababab with the hex code color of your choice. 

Long answer:

You’ll probably also need to adjust the text color and maybe do some additional custom tinkering if the above doesn’t quite work. The hardest part about writing your own CSS I think is learning the grammar, and identifying the right element to apply it to. For the former, there are a couple websites that I recommend. For the latter, there’s a handy trick for identifying interface elements in order to write CSS for them if you’re using Chrome:

First, go to your playlist with the bar at the bottom at the screen, then press F12 to open the DevTools window. Click again in your playlist window somewhere, press Ctrl-Shift-C, hover over the playlist bar, and click. This will highlight the HTML for the playlist in your DevTools window. Right-click the playlist HTML and select Copy > Copy Selector. While you’re there, you can also look under the Styles panel in your DevTools to see how the background color gets applied.

The thing about selectors is that CSS rules for more specific selectors override rules for less specific selectors (ie, “apply to elements with this id and these classes when underneath these parent elements” overrides “apply to all elements of this type”), but super long and specific selectors that include a lot of parent elements (“div > div > div > span > div > form > div...”) are more likely to break whenever the platform gets updated.

Anyway, hope this helps.

Thanks so much, @thaldane ! So incredibly helpful. That ended up working great. I really appreciate the resources, too!