How to reference a core-style producer from its consumer?

[Andrew Brogdon]

I recently posted about this on stack overflow, where Eric Bidelman was nice enough to respond.  I thought I'd bring it up here as well, however, since I had some additional questions, and SO doesn't like being used as a conversation medium.

I have an html import file that looks roughly like this: 

<core-style id="my-style">
  .main {
    background-image: url({{ imageUrl }});
  }
</core-style>

<polymer-element name="my-element">
  <template>
    <core-style ref="my-style"></core-style>
    <div class="main">
      Some content.
    </div>
  </template>
  <script>
    Polymer('my-element', {
      ready: function() {
        someAsyncFunctionWithACallback(this.callback);
      },
      callback: function(url) {
        // I'd like stick the value of "url" into the my-style producer element's "imageUrl" property,
        // so it updates the consumer core-style for "my-element"
      }
    });
  </script>
</polymer-element>

My original issue was that I didn't know how to get a reference to that first core-style element that serves as the my-style producer.  From inside my-element's callback, both document.getElementById and document._currentScript.ownerDocument.getElementById returned a null when given "my-style."  

Eric pointed out that the document._currentScript.ownerDocument.getElementById call needed to take place in a separate script tag, outside the my-element definition.  If that's done, it does return a reference to the correct object.  At that point, though, I'm outside the scope of my element and would need to do some weirdness to retrieve the value from it and place it in the correct spot.

At this point, I feel like I have a few options:

1) Add the additional script tag, define a global function in it to getElementById the instance of my-element and the my-style producer and move the value from one to the other.  This would then be called inside the my-element callback.

2) Inside the callback, put the url value into a well-named property of the CoreStyle.g global object and then reference it in the producer.

3) Inside the callback, grab a reference to the producer from the static CoreStyle.list array of producers (CoreStyle.list['my-style']) and assign the property to it that way.

I tested option #3, and it works, though I'm not sure if this is hackery that could fall victim to a race if my-style and my-element are one day moved into different files and loaded separately.

I've only been messing around with Polymer for a few weeks, and I'm still in the "I don't know if this is right, but it works" phase of learning, so it's quite possible I've missed an obvious way to do this. All I'm really looking for is a way to correctly maintain a reactive css rule for my-element, so any suggestions are welcome.

-Andrew