[css-borders-4] Added slash syntax for 'border-*-*-radius' longhands w3c#12861 (w3c#13111)

* [css-borders-4] Added slash syntax for 'border-*-*-radius' longhands

Author: SebastianZ

css-borders-4/Overview.bs

@@ -841,7 +841,7 @@ Corner Sizing: the 'border-*-*-radius' properties</h3>
 
 	<pre class="propdef">
 	Name: border-top-left-radius, border-top-right-radius, border-bottom-right-radius, border-bottom-left-radius, border-start-start-radius, border-start-end-radius, border-end-start-radius, border-end-end-radius
-	Value: <<length-percentage [0,&infin;]>>{1,2}
+	Value: <<border-radius>>
 	Initial: 0
 	Applies to: all elements (but see prose)
 	Inherited: no
@@ -851,6 +851,14 @@ Corner Sizing: the 'border-*-*-radius' properties</h3>
 	Animation Type: by computed value
 	</pre>
 
+	The radius is specified as a <<border-radius>> value, where
+
+	<pre class="prod">
+	<dfn><<border-radius>></dfn> = <<slash-separated-border-radius-syntax>> | <<legacy-border-radius-syntax>>
+	<dfn><<slash-separated-border-radius-syntax>></dfn> = <<length-percentage [0,&infin;]>> [ / <<length-percentage [0,&infin;]>> ]?
+	<dfn><<legacy-border-radius-syntax>></dfn> = <<length-percentage [0,&infin;]>>{1,2}
+	</pre>
+
 	The two <<length-percentage>> values of the 'border-*-radius' properties
 	define the <dfn id="border-radii" lt="border radius">radii</dfn> of
 	a quarter ellipse that defines the shape of the corner
@@ -863,6 +871,10 @@ Corner Sizing: the 'border-*-*-radius' properties</h3>
 	whereas percentages for the vertical radius refer to the height of the [=border box=].
 	Negative values are invalid.
 
+	Note: Authors <em>should</em> use the slash syntax, which is preferred for new content,
+	but the legacy syntax (two values separated by whitespace)
+	is supported for backwards compatibility.
+
 	<figure>
 		<img src="images/corner.png" width="289" height="179"
 		     alt="Diagram of the inscribed ellipse"
@@ -3190,6 +3202,7 @@ First Public Working Draft</a> of 22 July 2025
 	* Added Web Platform Tests coverage
 	* incorporated full text of [[CSS3BG]] related to borders and shadows
 	* Renamed 'border-clip-*' properties to 'border-*-clip' and added logical longhands
+	* Added new syntax for 'border-*-*-radius' longhands using a slash to separate horizontal and vertical radii
 
 <h3 class=no-num id="level-changes">
 Additions since [[CSS3BG]]</h3>