Cross posted to http://lists.osgeo.org/pipermail/openlayers-dev/2011-July/007776.html and worth posting Christopher Schmidt's answer here too:
The OpenLayers.Control.PanZoom is an old-style control, which can't be
controlled via CSS. It is maintained only for backwards compatibility
with older applications (Which is why it continues to be the default).
Instead, you should use the OpenLayers.Control.PanPanel and
OpenLayers.Control.ZoomPanel; these are new style 'panels' in
OpenLayers, which use CSS for all of their styling. (You can see an
example of changing the look + feel entirely with CSS at
http://openlayers.org/dev/examples/mobile.html , for example.)
So, the answer is: "There is no good reason, other than history, and
that's why we wrote something better" :)
The OpenLayers.Control.PanZoom.draw function is called when the control is added to the map (through the map's addControl function).
// Add the passed over control to the map.
// Optionally position the control at the given pixel.
addControl: function (control, px)
You can pass in an OpenLayers.Pixel to locate the control exactly where you want.
The PanZoom constants are both set to 4 by default and are used for the offset of the images in the DIV that contains the PanZoom controls.
Filenames are hardcoded, but you can change their location (and the files themselves if you want different sizes).
There is a good introduction to the files needed to OpenLayer themes at http://support.mapbox.com/kb/mapping-101/openlayers-themes
Files in GitHub at https://github.com/developmentseed/openlayers_themes