When you create new style declarations add !important after each css property:

.custom {
font-size: 12px !important;
}

Then in in your ext component add 'custom' to your 'cls' config property.

then the .custom class will be appended to the rest of the component css classes.. !important is needed because the css property font-size is most likely defined in the other css declaration (x-button in your example) and this tells the browser that this is what you want to take over any other declarations. In other words it increases the weight of your declaration.