Using polymer.dart, how can I ensure that styles referenced in the consuming page are still available in the template?

I have a consuming, or main, page, thus:

```dart
<html>
<head>
    <link rel="stylesheet" href="aplaceontheinterweb" />
    <link rel="import" href="ponies.html" />
</head>
<body>    
    <div class="defined_in_the_included_file">
        ...
    </div>    
    <div is="a-pony"></div>
    <script src="packages/polymer/boot.js"></script>
</body>

</html>

```

and a template, thus:

```html
<polymer-element name="a-pony" extends="div">
    <template>
        <div class="defined_in_the_css_file_referenced_in_main_html">
            ....
        </div>
    </template>
</polymer-element>

```

and the `<div>` in the `a-pony` element is not styled appropriately when the page is rendered. 

I've seen the demo stuff and read [this](https://stackoverflow.com/questions/16351110/how-do-i-style-elements-in-dart-web-ui-templates?rq=1), but these are specific to styles that are declared inside the template, and don't cover the case where the styles are external.