Multi KPI Styles CSS seems a little too powerful

[deec]

Playing with this little box is both amazing and very confusing. It seems like anytime the multi KPI object loads on a sheet, you're able to throw in CSS that affects anything. Since it apparently allows you to choose a class/id to edit, rather than confining you to editing only the element in question.

I'm concerned that this is not the way they meant to implement this. While I'm thankful for the power this brings, I don't see how one option in one object type should give someone the ability to mess with the CSS affecting any other parts of the page.
In addition, without an html id or class specific to the element you're working on (this Multi KPI), it doesn't seem possible to add CSS that will directly affect ONLY the object you're adding the CSS to.

as a quick example... something like this would affect the text at the top of the default qlik sense navigation bar:
.lui-tab__text{
color:red !important;}

my best guess is that the idea was to take whatever css you put in the styles box and apply that to the current object's id. Not allow you to declare any class/id to alter. But I couldn't find a unique ID inspecting the page on developer mode.

Any thoughts on how this nifty little feature should be used?

[deec]

Update:
I was able to find a unique ID moving up the element hierarchy in the page HTML using developer mode on chrome. 
With this, I could then edit pieces of this Multi KPI without affecting other objects.

In the example pictured, I was able to expand the gap between the first and second row of KPI objects. By default, the values were all evenly spaced, giving it a "smashed together" look.

#css-MwpZNn .statistic-4, #css-MwpZNn .statistic-5, #css-MwpZNn .statistic-6 {
margin-bottom:20px;
}