[css3-ui] image cursors and high-dpi displays

There are lots of different discussions of how images should be handled on
high-DPI displays, but as far as I can find there hasn't been any
discussion about what to do with image cursors (
http://www.w3.org/TR/css3-ui/#cursor).

For compatibility, both Safari and Chrome will scale up any cursor image,
so for example on the retina macbook (2 dppx) every cursor image is pixel
doubled.  This is necessary to prevent tiny mouse cursors, but looks ugly.
 Sites need some way to opt-into supplying high-DPI cursor images, and as
far as I can tell no such way exists today or has been discussed publicly
(please point me at anything I've missed).

Here are some options (not all of which necessarily require a change to the
spec, but included here for discussion anyway).  For chromium, we're
considering implementing at least #1 and possibly #2 (see
http://crbug.com/136034), since they seem legitimate without any additions
to the CSS3 standard.

   1. *Extend image-set support to image cursors*
   For browsers that already support the image-set function (
   http://lists.w3.org/Archives/Public/www-style/2012Feb/1103.html) it
   makes sense to also support it in cursor declarations.  eg.:
     cursor: image-set( url('hand.cur') 1x, url('hand2x.cur') 2x),
                             url(hand.cur),
                             pointer);
   In this case, if the user-agent supports image-set, it would choose the
   image whose scale factor most closely matches the device scale factor, and
   (if none match exactly) scale the image so that it's combined scale factor
   matches that of the device.

   2. *Support multi-resolution ico and cur files*
   The ico and cur file formats already in common use for cursors support
   multiple images of different resolutions in the same file.  In the case of
   ico files, this is already used to support high-dpi favicons.  Unlike for
   favicons though, a user agent doesn't necessarily have any preferred
   physical size for a mouse cursor - websites are free to choose cursors that
   they want to appear smaller or larger than normal to the user.  One
   approach here could be to use the smallest image in an ico/cur file (or
   perhaps the last one for maximum compatibility) as an indication of the
   logical size requested by the website.  Then the user-agent can select any
   other image from the file whose physical size most closely matches the
   device scale factor, and scale it appropriately to fill the logical size.

   3. *Extend the cursor declaration to take a <resolution>*
   The fundamental problem here is that the site doesn't communicate
   anything about the intended resolution of the cursor image (i.e. so the UA
   can tell when it's designed to be used on a high-dpi display without
   scaling).  image-resolution (
   http://dev.w3.org/csswg/css4-images/#the-image-resolution) is almost
   exactly what we want, except as far as I can tell there's no way to apply
   it to an image cursor (except perhaps using the element syntax which seems
   too complex for the common case).  Perhaps we can just add an optional
   <resolution> to the cursor declaration (perhaps requiring the hotspot
   co-ordinates to be specified).  Or perhaps there should be a different
   property to specify the resolution for a cursor, eg. cursor-resolution.  eg.
     cursor: url(hand2x.png) 5 5 2dppx

*Questions*

   - Should any of this be in terms of CSS pixels, or strictly in an
   abstract concept of logical pixels?
   Eg. should operations such as browser zoom that impact the size of the
   CSS px impact how mouse cursors are drawn?  I think I'd prefer mouse cursor
   size to be fixed across browser zoom, and so we should not be using the CSS
   px unit in this discussion.
   - How should hotspot values be applied when multiple images are
   provided?
   For both #1 and #2 the UA may need to map a single hotspot co-ordinate
   onto images of different sizes.  The only reasonable solutions seems to be
   to treat the hotspot co-ordinates as being in the logical pixel co-ordinate
   space and scale them appropriately with the image scale factor.  Of course
   a cur file can always be used to specify a distinct hotspot per image in
   the image co-ordinate system.

Thanks,
   Rick