In case it can help somebody, I ended up turning the "Like" link into a "button" of sorts, since it's impossible to change the styles from an external iframe:

.jetpack-comment-likes-widget-wrapper{
    width: 100px !important;
    font-size: 14px !important;
    line-height: 18px !important;
    padding: 3px 10px !important;
    border: 1px solid #ccc;
    background: #eee;
    -moz-border-radius: 15px !important;
    -webkit-border-radius: 15px !important;
    border-radius: 15px !important;
    margin-bottom: 20px;
}

The only bad side is that it won't resize for each language, and it will have some padding to the right in English.

I see, I'll let the Jetpack team know about it then.

Thank you, this can be closed.

That doesn't seem to work, see attached screenshot.

It's to the right of the blue star, here: http://www.retrolel.com/es/se-busca-pack-heroes-collection-pc/#comments

I've added the custom CSS:

.post-title-box .post-box-title{
color:#aaaaaa;
}

.comment-likes-widget-placeholder .loading{
color:#aaaaaa;
}

a.comment-like-link{
color:#aaaaaa;
}

But the "Like" text is still dark, any ideas?

Ok, thank you.

I can add new CSS rules, but I was just wondering if there was a "proper" way of customizing those colors.

If there's no other way, perhaps the template could be fixed so that the provided defaults don't make that text unreadable, since that's what your clients get to see without adding custom CSS.

You can see that the "Related Posts" text is also invisible in the demo: http://pennews.pencidesign.com/pennews-game-news/uncharted-lost-legacy-review/

It also doesn't fix the "Like" link, which stays dark.

That also changes every header and even the quoted text's color, I need a better solution.

The highlighted elements in the attached screenshots look too dark in "Game News" and I can't find where I can change their colors. Where's the option for it?