modify CSS of twitter-widget (iframe)

Question

So I configured the Twitter timeline widget and now I'm trying to properly style it with CSS. I try to modify the CSS via jQuery like so:

$("iframe").ready(function() {
    $($("iframe").contents()).find("#twitter-widget-0").css({ background: "transparent" });
});

While the ready() listener waits for the iframe to be fully loaded, the code is still executed too early, namely before the widget's original CSS is loaded. Result: code gets executed, but the widget's original CSS overrides my changes. I read here that ready() does not guarantee the element it is listening on is indeed ready for CSS.

My current workaround is to execute the CSS modifications within a setTimeout like so:

$("iframe").ready(function() {
    setTimeout(function() {
        $($("iframe").contents()).find("#twitter-widget-0").css({ background: "transparent" });
    }, 3000);
});

This leaves enough time for the iframe's contents to be fully loaded and that way I can override the widget's CSS. However, this obviously is far from a good and clean solution...

So, is there a better way to know when it is safe to modify an iframe's CSS?