Separate stylesheets depending on their media attribute?

[kungpoo]

Say I had this -

{% compress css %}

link rel="stylesheet" href="{{ MEDIA_URL }}css/screen.css" media="sceen">
link rel="stylesheet" href="{{ MEDIA_URL }}css/menu.css" media="sceen">
link rel="stylesheet" href="{{ MEDIA_URL }}css/iphone.css" media="only screen and (max-device-width: 480px)">

{% endcompress %}

Is there currently a way to output two seperate stylesheets grouped by the media attribute e.g.

link rel="stylesheet" href="CACHE/123.css" type="text/css" media="sceen">
link rel="stylesheet" href="CACHE/456.css" type="text/css" media="only screen and (max-device-width: 480px)">

so that the iphone one does not overwrite any previous rules?

Thanks