[css-backgrounds] Add formula for continuous shift from sharp to rounded spread corners based on experimenting at TPAC with Bert, dbaron, plinss, and leaverou.

This not only results in continuous behavior, but gives better-looking results when the border radius is smaller than the spread radius.
Special thanks to dbaron for suggesting we create such a formula, to leaverou for creating an experimentation framework and doggedly searching for better formulas, and to plinss for the suggestion to try the cubic.
See spread-radius.html

Author: fantasai

css-backgrounds/Overview.src.html

@@ -2941,13 +2941,13 @@ <h3 id="the-box-shadow">Drop Shadows: the 'box-shadow' property</h3>
 
 <p>If a spread distance is defined,
 the shadow perimenter is expanded outward (for normal shadows) or contracted inward (for ''inset'' shadows)
-by the spread distance in the direction normal to the original shadow perimeter.
-Alternatively, the UA may approximate the transformed shadow perimeter shape by
-outsetting (insetting, for inner shadows) the shadow's straight edges by the spread distance
+by outsetting (insetting, for inner shadows) the shadow's straight edges by the spread distance
 and increasing (decreasing, for inner shadows) and flooring at zero
 the corner radii by the same amount.
-For corners with a zero border-radius, however, the corner must remain
-sharp&#8212;the operation is equivalent to scaling the shadow shape.
+In order to create a sharper corner when the border radius is small,
+when the ratio <var>r</var> of the border-radius to the spread distance is less than one,
+the spread distance is multiplied by the proportion 1 + (<var>r</var>-1)<sup>3</sup>
+when calculating the corner radii of the spread shadow shape.
 In any case, the effective width and height of the shadowed shape
 is floored at zero.
 (A zero-sized shadowed shape would cause an outer shadow to disappear,
@@ -3302,12 +3302,16 @@ <h3 id="changes-2012-07">
 <a href="http://www.w3.org/TR/2012/CR-css3-background-20120724/">24 July 2012 Candidate Recommendation</a>:
 
 <ul>
-  <li>Allow <var>&lt;color></var> and ''inset'' to be interleaved in any order in 'box-shadow',
-    since they are not ambiguous and CSS generally allows variant ordering where not ambiguous.
   <li>Allow <var>&lt;'background-clip'></var> and <var>&lt;'background-origin'></var>
     to be separated by other component values in the 'background' shorthand,
     since this is what is implemented.
-  <li>Clarify the definition of the spread for 'box-shadow'.
+  <li>Allow <var>&lt;color></var> and ''inset'' to be interleaved in any order in 'box-shadow',
+    since they are not ambiguous and CSS generally allows variant ordering where not ambiguous.
+  <li>Define gradually increasing corner radius formula for 'box-shadow' spread curvature
+    to create continuity between sharp corners ('border-radius' = 0)
+    and curved corners ('border-radius' > <var>spread distance</var>).
+    This also gives better results for all intermediate states.
+  <li>Tighten up the definition of spread for 'box-shadow'.
   <li>Clarify that a 'border-style' of ''none'' also implies an initial 'border-image-width' of zero
     (since 'border-image-width' is initially set to the computed 'border-width', which in this case is zero).
 </ul>