[css-values] Alternative, weighted mean syntax for calc-mix()

[Crissov]

This started out as a comment to #9343 and is obviously a revival of my suggestion in #4700.

With their shared use of a single <progress> parameter, the mix functions are currently all limited to two values, start and end. While some individual alternative syntaxes support specifying a weight per entry, calc-mix() does not.

The alternative syntax of the image mix function cross-fade() even supports mixing an arbitrary number of (weighted) images – this includes colors, while the color blending function color-mix() is restricted to two values.

1. If this is useful for images, I would expect that authors would sometimes find a need to mix together multiple values of other types as well.
2. If the WG agreed with this assumption, calc-mix() in particular would need an alternative syntax. Alas, this could not use the established notation for the weights of values, because ”20% 80%“ would be ambiguous.
   (Note that the optional weight, <percentage [0,100]>?, precedes the value in the grammar for cross-fade() and follows it for color-mix(), but && means ‘any order’.)
   For linear interpolation of percentages, the order might be irrelevant, but authors may want different ones.
3. If this was the case indeed, the best way to allow more interpolation methods would probably be to support the various kinds of weighted means (arithmetic, geometric, harmonic, …) – or a generalized mean. [css-values] Function(s) for Standard Means #4700
4. If syntax for means was to be introduced, ”calc-mix“ may not the best choice of a name.

Compilation of current grammar

<calc-mix()> = 
  calc-mix( <progress>, <calc-sum>, <calc-sum> )

<color-mix()> =
  color-mix( <progress> && <color-interpolation-method>?, <color>, <color> ) 
  |
  color-mix( <color-interpolation-method>, [<color> && <percentage [0,100]>?]#{2} )

<cross-fade()> =
  cross-fade( <progress>, [ <image> | <color> ], [ <image> | <color> ] ) 
  |
  cross-fade( <cf-image># )
<cf-image> = <percentage [0,100]>? && [ <image> | <color> ]

<transform-mix()> = 
  transform-mix( <progress>, <transform-list>, <transform-list> )

<mix()> =
  mix( <progress> ';' <whole-value> ';' <whole-value> ) 
  |
  mix( <progress> && of <'animation-name'> )