[css-viewport] Add the segments property (w3c#9237).

This property exposes in JavaScript what is already exposed to
CSS via env() variables.

TAG review w3ctag/design-reviews#689.

CSSWG Approval: w3c#9237#issuecomment-2160730855

Fixes w3c#9237.

css-viewport/Overview.bs

@@ -377,6 +377,7 @@ partial interface Window {
 <pre class=idl>
 [Exposed=Window]
 interface Viewport : EventTarget {
+  readonly attribute FrozenArray&lt;DOMRect> segments;
   readonly attribute double zoom;
 };
 </pre>
@@ -545,6 +546,20 @@ The <dfn export>unscaled</dfn> value of a CSS length relative to an element is t
 	The {{Window/devicePixelRatio}} of a frame is multiplied by the [=effective zoom=] inherited by its parent frame.
 </h3>
 
+<h2 id='segments'>
+	The <dfn attribute for=Viewport>segments</dfn> property
+</h2>
+
+The segments property is an array of DOMRects that represent the dimensions of each existing viewport segment. Additonal details about the definition of a viewport segment can be found here : [[css-env-1#viewport-segments]].
+
+The {{segments}} property represent an immutable snapshot of the device {{segments}} when the value was queried.
+If the device state changes (rotation, window resize, <a spec="DEVICE-POSTURE">posture</a> change), the value previously retrieved will be invalid. Developers can listen to {{ScreenOrientation/onchange|Screen Orientation}}, {{Window/resize|Window Resize}}, or {{DevicePosture/onchange|Posture}} changes events to detect device state changes.
+
+The {{segments}} attribute must run these steps:
+1. If the {{Viewport}}'s associated {{Document}} is not <a>fully active</a>, return 0.
+2. Returns null if there is only a single viewport segment and abort these steps.
+3. Otherwise, return the {{Viewport}}'s segments array.
+
 <h2 class="no-num" id="changes">Appendix A. Changes</h2>
 
 This appendix is <em>informative</em>.