@webref/css 6.5.7 → 6.5.9

package/css-anchor-position.json

@@ -4,41 +4,6 @@
     "url": "https://drafts.csswg.org/css-anchor-position-1/"
   },
   "properties": [
-    {
-      "name": "anchor-scroll",
-      "value": "none | default | <anchor-element>",
-      "initial": "default",
-      "appliesTo": "absolutely-positioned elements",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "as specified",
-      "canonicalOrder": "per grammar",
-      "animationType": "discrete",
-      "values": [
-        {
-          "name": "none",
-          "prose": "No effect.",
-          "type": "value",
-          "value": "none"
-        },
-        {
-          "name": "default",
-          "prose": "Behaves identically to <anchor-element>, but draws its value from anchor-default on the element.",
-          "type": "value",
-          "value": "default"
-        },
-        {
-          "name": "<anchor-element>",
-          "prose": "Selects a target anchor element the same as anchor(), which will be compensated for in positioning and fallback.",
-          "type": "value",
-          "value": "<anchor-element>"
-        }
-      ],
-      "styleDeclaration": [
-        "anchor-scroll",
-        "anchorScroll"
-      ]
-    },
     {
       "name": "anchor-name",
       "value": "none | <dashed-ident>",
@@ -83,6 +48,41 @@
         "anchorDefault"
       ]
     },
+    {
+      "name": "anchor-scroll",
+      "value": "none | default | <anchor-element>",
+      "initial": "default",
+      "appliesTo": "absolutely-positioned elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "as specified",
+      "canonicalOrder": "per grammar",
+      "animationType": "discrete",
+      "values": [
+        {
+          "name": "none",
+          "prose": "No effect.",
+          "type": "value",
+          "value": "none"
+        },
+        {
+          "name": "default",
+          "prose": "Behaves identically to <anchor-element>, but draws its value from anchor-default on the element.",
+          "type": "value",
+          "value": "default"
+        },
+        {
+          "name": "<anchor-element>",
+          "prose": "Selects a target anchor element the same as anchor(), which will be compensated for in positioning and fallback.",
+          "type": "value",
+          "value": "<anchor-element>"
+        }
+      ],
+      "styleDeclaration": [
+        "anchor-scroll",
+        "anchorScroll"
+      ]
+    },
     {
       "name": "position-fallback",
       "value": "none | <dashed-ident>",
@@ -111,6 +111,29 @@
         "position-fallback",
         "positionFallback"
       ]
+    },
+    {
+      "name": "position-fallback-bounds",
+      "value": "normal | <dashed-ident>",
+      "initial": "normal",
+      "appliesTo": "absolutely positioned elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "as specified",
+      "canonicalOrder": "per grammar",
+      "animationType": "discrete",
+      "values": [
+        {
+          "name": "normal",
+          "prose": "The element uses its normal (scroll-adjusted, inset-modified) containing block to determine if it’s overflowing for the purpose of selecting a position fallback list entry.",
+          "type": "value",
+          "value": "normal"
+        }
+      ],
+      "styleDeclaration": [
+        "position-fallback-bounds",
+        "positionFallbackBounds"
+      ]
     }
   ],
   "atrules": [
@@ -130,7 +153,7 @@
   "values": [
     {
       "name": "anchor()",
-      "prose": "An absolutely-positioned element can use the anchor() function as a value in its inset properties to refer to the position of one or more anchor elements. The anchor() function resolves to a <length>.",
+      "prose": "An absolutely-positioned element can use the anchor() function in its inset properties to refer to the position of one or more anchor elements. The anchor() function resolves to a <length>, exactly what is needed to position the given inset edge to the specified position on the anchor element.",
       "type": "function",
       "value": "anchor( <anchor-element>? <anchor-side>, <length-percentage>? )",
       "values": [
@@ -148,67 +171,73 @@
         },
         {
           "name": "auto",
-          "prose": "The auto and auto-same keywords indicate automatic anchor positioning. See § 2.1.1 Automatic Anchor Positioning for details.",
+          "prose": "Resolves to one of the anchor element’s sides, depending on which inset property it’s used in. Also triggers automatic fallback behavior. See § 3.1.1 Automatic Anchor Positioning for more details.",
           "type": "value",
           "value": "auto"
         },
         {
           "name": "auto-same",
-          "prose": "The auto and auto-same keywords indicate automatic anchor positioning. See § 2.1.1 Automatic Anchor Positioning for details.",
+          "prose": "Resolves to one of the anchor element’s sides, depending on which inset property it’s used in. Also triggers automatic fallback behavior. See § 3.1.1 Automatic Anchor Positioning for more details.",
           "type": "value",
           "value": "auto-same"
         },
         {
-          "name": "left",
-          "prose": "The physical <anchor-side> keywords (left, right, top, and bottom) are only useful in inset properties corresponding to their corresponding axis: for example, using top and bottom in left or right (or in inset-inline-start if the inline axis is horizontal, etc) results in an invalid anchor query.",
+          "name": "top",
+          "prose": "Refers to the specified side of the anchor element.",
           "type": "value",
-          "value": "left"
+          "value": "top"
         },
         {
           "name": "right",
-          "prose": "The physical <anchor-side> keywords (left, right, top, and bottom) are only useful in inset properties corresponding to their corresponding axis: for example, using top and bottom in left or right (or in inset-inline-start if the inline axis is horizontal, etc) results in an invalid anchor query.",
+          "prose": "Refers to the specified side of the anchor element.",
           "type": "value",
           "value": "right"
         },
         {
-          "name": "top",
-          "prose": "The physical <anchor-side> keywords (left, right, top, and bottom) are only useful in inset properties corresponding to their corresponding axis: for example, using top and bottom in left or right (or in inset-inline-start if the inline axis is horizontal, etc) results in an invalid anchor query.",
+          "name": "bottom",
+          "prose": "Refers to the specified side of the anchor element.",
           "type": "value",
-          "value": "top"
+          "value": "bottom"
         },
         {
-          "name": "bottom",
-          "prose": "The physical <anchor-side> keywords (left, right, top, and bottom) are only useful in inset properties corresponding to their corresponding axis: for example, using top and bottom in left or right (or in inset-inline-start if the inline axis is horizontal, etc) results in an invalid anchor query.",
+          "name": "left",
+          "prose": "Refers to the specified side of the anchor element.",
           "type": "value",
-          "value": "bottom"
+          "value": "left"
         },
         {
           "name": "start",
-          "prose": "The logical <anchor-side> keywords (start, end, self-start, and self-end) map to one of the physical keywords depending on the property the function is being used in (top or bottom in the top or bottom properties, etc) and the writing mode of either the element (for self-start and self-end) or the writing mode of the element’s containing block (for start and end).",
+          "prose": "Refers to one of the sides of the anchor element in the same axis as the inset property it’s used in, by resolving the keyword against the writing mode of either the positioned element (for self-start and self-end) or the positioned element’s containing block (for start and end).",
           "type": "value",
           "value": "start"
         },
         {
           "name": "end",
-          "prose": "The logical <anchor-side> keywords (start, end, self-start, and self-end) map to one of the physical keywords depending on the property the function is being used in (top or bottom in the top or bottom properties, etc) and the writing mode of either the element (for self-start and self-end) or the writing mode of the element’s containing block (for start and end).",
+          "prose": "Refers to one of the sides of the anchor element in the same axis as the inset property it’s used in, by resolving the keyword against the writing mode of either the positioned element (for self-start and self-end) or the positioned element’s containing block (for start and end).",
           "type": "value",
           "value": "end"
         },
         {
           "name": "self-start",
-          "prose": "The logical <anchor-side> keywords (start, end, self-start, and self-end) map to one of the physical keywords depending on the property the function is being used in (top or bottom in the top or bottom properties, etc) and the writing mode of either the element (for self-start and self-end) or the writing mode of the element’s containing block (for start and end).",
+          "prose": "Refers to one of the sides of the anchor element in the same axis as the inset property it’s used in, by resolving the keyword against the writing mode of either the positioned element (for self-start and self-end) or the positioned element’s containing block (for start and end).",
           "type": "value",
           "value": "self-start"
         },
         {
           "name": "self-end",
-          "prose": "The logical <anchor-side> keywords (start, end, self-start, and self-end) map to one of the physical keywords depending on the property the function is being used in (top or bottom in the top or bottom properties, etc) and the writing mode of either the element (for self-start and self-end) or the writing mode of the element’s containing block (for start and end).",
+          "prose": "Refers to one of the sides of the anchor element in the same axis as the inset property it’s used in, by resolving the keyword against the writing mode of either the positioned element (for self-start and self-end) or the positioned element’s containing block (for start and end).",
           "type": "value",
           "value": "self-end"
         },
+        {
+          "name": "<percentage>",
+          "prose": "Refers to a position a corresponding percentage between the start and end sides, with 0% being equivalent to start and 100% being equivalent to end. center is equivalent to 50%.",
+          "type": "value",
+          "value": "<percentage>"
+        },
         {
           "name": "center",
-          "prose": "A <percentage> value refers to a position a corresponding percentage between the start and end sides, with 0% being equivalent to start and 100% being equivalent to end. The center keyword is equivalent to 50%.",
+          "prose": "Refers to a position a corresponding percentage between the start and end sides, with 0% being equivalent to start and 100% being equivalent to end. center is equivalent to 50%.",
           "type": "value",
           "value": "center"
         }

package/css-animations-2.json

@@ -55,7 +55,7 @@
       "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "N/A",
-      "computedValue": "list, each item either a case-sensitive css identifier or the keywords none, auto.",
+      "computedValue": "list, each item either the keyword none, the keyword auto, a case-sensitive css identifier, a computed scroll() function, or a computed view() function",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
       "styleDeclaration": [
@@ -75,7 +75,7 @@
     {
       "name": "<single-animation-timeline>",
       "type": "type",
-      "value": "auto | none | <custom-ident> | <scroll()> | <view()>",
+      "value": "auto | none | <dashed-ident> | <scroll()> | <view()>",
       "values": [
         {
           "name": "auto",
@@ -91,7 +91,7 @@
         },
         {
           "name": "<custom-ident>",
-          "prose": "If a named scroll progress timeline or view progress timeline is in scope on this element, use the referenced timeline as defined in Scroll-driven Animations § 4.2 Named Timeline Scoping and Lookup. Otherwise the animation is not associated with a timeline.",
+          "prose": "If a named scroll progress timeline or view progress timeline is in scope on this element, use the referenced timeline as defined in Scroll-driven Animations § Declaring a Named Timeline’s Scope: the timeline-scope property. Otherwise the animation is not associated with a timeline.",
           "type": "value",
           "value": "<custom-ident>"
         },
@@ -111,7 +111,7 @@
     },
     {
       "name": "<single-animation>",
-      "value": "<time [0s,∞]> || <easing-function> || <time> || <single-animation-iteration-count> || <single-animation-direction> || <single-animation-fill-mode> || <single-animation-play-state> || [ none | <keyframes-name> ] || <single-animation-timeline>",
+      "value": "<'animation-duration'> || <easing-function> || <'animation-delay'> || <single-animation-iteration-count> || <single-animation-direction> || <single-animation-fill-mode> || <single-animation-play-state> || [ none | <keyframes-name> ] || <single-animation-timeline>",
       "type": "type"
     }
   ]

package/css-color.json

@@ -1024,7 +1024,7 @@
     {
       "name": "hwb()",
       "type": "function",
-      "value": "hwb( [<hue> | none] [<percentage> | none] [<percentage> | none] [ / [<alpha-value> | none] ]? )",
+      "value": "hwb( [<hue> | none] [<percentage> | <number> | none] [<percentage> | <number> | none] [ / [<alpha-value> | none] ]? )",
       "values": [
         {
           "name": "HWB",
@@ -1041,7 +1041,7 @@
       "values": [
         {
           "name": "Lab",
-          "prose": "Lab is a rectangular coordinate system with a central Lightness (L) axis. This value is usually written as a unitless number; for compatibility with the rest of CSS, it may also be written as a percentage. 100% means an L value of 100, not 1.0. L=0% or 0 is deep black (no light at all) while L=100% or 100 is a diffuse white.",
+          "prose": "In Lab, the first argument specifies the CIE Lightness, L. This is a number between 0% or 0 (representing black) and 100% or 100 (representing white), Values less than 0% or 0 must be clamped to 0% at parsed-value time; values greater than 100% or 100 are clamped to 100% at parsed-value time.",
           "type": "value",
           "value": "Lab"
         }
@@ -1054,7 +1054,7 @@
       "values": [
         {
           "name": "LCH",
-          "prose": "CIE LCH has the same L axis as Lab, but uses polar coordinates C (chroma) and H (hue), making it a polar, cylindrical coordinate system. C is the geometric distance from the L axis and H is the angle from the positive a axis, towards the positive b axis.",
+          "prose": "In CIE LCH the first argument specifies the CIE Lightness L, interpreted identically to the Lightness argument of lab().",
           "type": "value",
           "value": "LCH"
         }
@@ -1067,7 +1067,7 @@
       "values": [
         {
           "name": "Oklab",
-          "prose": "Recently, Oklab, an improved Lab-like space has been developed [Oklab]. The corresponding polar form is called Oklch. It was produced by numerical optimisation of a large dataset of visually similar colors, and has improved hue linearity, hue uniformity, and chroma uniformity compared to CIE LCH.",
+          "prose": "In Oklab the first argument specifies the Oklab Lightness. This is a number between 0% or 0 (representing black) and 100% or 1.0 (representing white).",
           "type": "value",
           "value": "Oklab"
         }
@@ -1080,7 +1080,7 @@
       "values": [
         {
           "name": "Oklch",
-          "prose": "Recently, Oklab, an improved Lab-like space has been developed [Oklab]. The corresponding polar form is called Oklch. It was produced by numerical optimisation of a large dataset of visually similar colors, and has improved hue linearity, hue uniformity, and chroma uniformity compared to CIE LCH.",
+          "prose": "In Oklch the first argument specifies the Oklch Lightness L, interpreted identically to the Lightness argument of oklab().",
           "type": "value",
           "value": "Oklch"
         }

package/css-counter-styles.json

@@ -63,19 +63,19 @@
           "name": "negative",
           "for": "@counter-style",
           "value": "<symbol> <symbol>?",
-          "initial": "\"\\2D\" (\"-\" hyphen-minus)"
+          "initial": "\"-\""
         },
         {
           "name": "prefix",
           "for": "@counter-style",
           "value": "<symbol>",
-          "initial": "\"\" (the empty string)"
+          "initial": "\"\""
         },
         {
           "name": "suffix",
           "for": "@counter-style",
           "value": "<symbol>",
-          "initial": "\"\\2E\\20\" (\".\" full stop followed by a space)"
+          "initial": "\". \""
         },
         {
           "name": "range",
@@ -167,7 +167,7 @@
   "values": [
     {
       "name": "<counter-style-name>",
-      "prose": "<counter-style-name> is a <custom-ident> that is not an ASCII case-insensitive match for none. The <counter-style-name> is a tree-scoped name.",
+      "prose": "<counter-style-name> is a <custom-ident> that is not an ASCII case-insensitive match for none. When used here, to define a counter style, it also cannot be any of the non-overrideable counter-style names (in other uses that merely reference a counter style, such as the extend system, these are allowed). The <counter-style-name> is a tree-scoped name.",
       "type": "type",
       "values": [
         {

package/css-scroll-snap-2.json

@@ -90,6 +90,7 @@
       "computedValue": "the keyword auto or a computed <length-percentage> value",
       "canonicalOrder": "per grammar",
       "animationType": "by computed value type",
+      "logicalPropertyGroup": "scroll-start",
       "values": [
         {
           "name": "auto",
@@ -137,6 +138,7 @@
       "computedValue": "the keyword auto or a computed <length-percentage> value",
       "canonicalOrder": "per grammar",
       "animationType": "by computed value type",
+      "logicalPropertyGroup": "scroll-start",
       "values": [
         {
           "name": "auto",
@@ -184,6 +186,7 @@
       "computedValue": "the keyword auto or a computed <length-percentage> value",
       "canonicalOrder": "per grammar",
       "animationType": "by computed value type",
+      "logicalPropertyGroup": "scroll-start",
       "values": [
         {
           "name": "auto",
@@ -231,6 +234,7 @@
       "computedValue": "the keyword auto or a computed <length-percentage> value",
       "canonicalOrder": "per grammar",
       "animationType": "by computed value type",
+      "logicalPropertyGroup": "scroll-start",
       "values": [
         {
           "name": "auto",
@@ -278,6 +282,7 @@
       "computedValue": "either of the keywords \"none\" or \"auto\"",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
+      "logicalPropertyGroup": "scroll-start-target",
       "values": [
         {
           "name": "none",
@@ -307,6 +312,7 @@
       "computedValue": "either of the keywords \"none\" or \"auto\"",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
+      "logicalPropertyGroup": "scroll-start-target",
       "values": [
         {
           "name": "none",
@@ -336,6 +342,7 @@
       "computedValue": "either of the keywords \"none\" or \"auto\"",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
+      "logicalPropertyGroup": "scroll-start-target",
       "values": [
         {
           "name": "none",
@@ -365,6 +372,7 @@
       "computedValue": "either of the keywords \"none\" or \"auto\"",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
+      "logicalPropertyGroup": "scroll-start-target",
       "values": [
         {
           "name": "none",

package/css-scrollbars.json

@@ -42,7 +42,7 @@
       "percentages": "n/a",
       "computedValue": "specified keyword",
       "canonicalOrder": "per grammar",
-      "animationType": "by computed value",
+      "animationType": "discrete",
       "values": [
         {
           "name": "auto",

package/css-ui.json

@@ -554,7 +554,7 @@
         },
         {
           "name": "<compat-auto>",
-          "value": "searchfield | textarea | push-button | slider-horizontal | checkbox | radio | square-button | menulist | listbox | meter | progress-bar | button",
+          "value": "searchfield | textarea | checkbox | radio | menulist | listbox | meter | progress-bar | button",
           "type": "type"
         },
         {
@@ -567,16 +567,6 @@
           "type": "value",
           "value": "textarea"
         },
-        {
-          "name": "push-button",
-          "type": "value",
-          "value": "push-button"
-        },
-        {
-          "name": "slider-horizontal",
-          "type": "value",
-          "value": "slider-horizontal"
-        },
         {
           "name": "checkbox",
           "type": "value",
@@ -587,11 +577,6 @@
           "type": "value",
           "value": "radio"
         },
-        {
-          "name": "square-button",
-          "type": "value",
-          "value": "square-button"
-        },
         {
           "name": "menulist",
           "type": "value",

package/css-view-transitions.json

@@ -17,13 +17,13 @@
       "values": [
         {
           "name": "none",
-          "prose": "The element will not participate in a view transition.",
+          "prose": "The element will not participate independently in a view transition.",
           "type": "value",
           "value": "none"
         },
         {
           "name": "<custom-ident>",
-          "prose": "The element can participate in a view transition, as either an old or new element, with a view transition name equal to the <custom-ident>'s value.",
+          "prose": "The element participates independently in a view transition—as either an old or new element—with the specified view transition name. The value none is excluded from <custom-ident> here.",
           "type": "value",
           "value": "<custom-ident>"
         }
@@ -37,23 +37,24 @@
   "atrules": [],
   "selectors": [
     {
-      "name": "::view-transition"
+      "name": "::view-transition",
+      "prose": "The ::view-transition pseudo-element is a tree-abiding pseudo-element that is also a pseudo-element root. Its originating element is the document’s document element, and its containing block is the snapshot containing block."
     },
     {
       "name": "::view-transition-group()",
-      "value": "::view-transition-group( <pt-name-selector> )"
+      "prose": "The ::view-transition-group() pseudo-element is a named view transition pseudo-element that represents a matching named view transition capture. A ::view-transition-group() pseudo-element is generated for each view transition name as a child of the ::view-transition pseudo-element, and contains a corresponding ::view-transition-image-pair()."
     },
     {
       "name": "::view-transition-image-pair()",
-      "value": "::view-transition-image-pair( <pt-name-selector> )"
+      "prose": "The ::view-transition-image-pair() pseudo-element is a named view transition pseudo-element that represents a pair of corresponding old/new view transition captures. This pseudo-element is a child of the corresponding ::view-transition-group() pseudo-element and contains a corresponding ::view-transition-old() pseudo-element and/or a corresponding ::view-transition-new() pseudo-element (in that order)."
     },
     {
       "name": "::view-transition-old()",
-      "value": "::view-transition-old( <pt-name-selector> )"
+      "prose": "The ::view-transition-old() pseudo-element is an empty named view transition pseudo-element that represents a visual snapshot of the “old” state as a replaced element; it is omitted if there’s no “old” state to represent. Each ::view-transition-old() pseudo-element is a child of the corresponding ::view-transition-image-pair() pseudo-element."
     },
     {
       "name": "::view-transition-new()",
-      "value": "::view-transition-new( <pt-name-selector> )"
+      "prose": "The ::view-transition-new() pseudo-element (like the analogous ::view-transition-old() pseudo-element) is an empty named view transition pseudo-element that represents a visual snapshot of the “new” state as a replaced element; it is omitted if there’s no “new” state to represent. Each ::view-transition-new() pseudo-element is a child of the corresponding ::view-transition-image-pair() pseudo-element."
     }
   ],
   "values": [

package/html.json

@@ -15,12 +15,12 @@
     {
       "name": "<source-size>",
       "type": "type",
-      "value": "<media-condition> <source-size-value>"
+      "value": "<media-condition> <source-size-value> | auto"
     },
     {
       "name": "<source-size-value>",
       "type": "type",
-      "value": "<length>"
+      "value": "<length> | auto"
     }
   ]
 }

package/motion.json

@@ -30,7 +30,7 @@
         },
         {
           "name": "<ray()>",
-          "prose": "The offset path is a line extending from the offset starting position at some angle. See § 2.1.1 The ray() Function for details. The <coord-box> provides the reference box for the ray.",
+          "prose": "The offset path is a line extending from the origin at some angle. See § 2.1.1 The ray() Function for details. The <coord-box> provides the reference box for the ray.",
           "type": "value",
           "value": "<ray()>"
         },
@@ -42,7 +42,7 @@
         },
         {
           "name": "<basic-shape>",
-          "prose": "The offset path is the equivalent path of the <basic-shape> function. If circle() or ellipse() is used, and an explicit center position is not given, they default to using the offset starting position, rather than their standard default. The <coord-box> provides the [=/reference box=] for the <basic-shape>.",
+          "prose": "The offset path is the equivalent path of the <basic-shape> function. For all <basic-shape>s, if they accept an ''at <position>'' argument but that argument is omitted, and the element defines an offset starting position via offset-position, it uses the specified offset starting position for that argument. Otherwise it defaults as specified for each function. The <coord-box> provides the [=/reference box=] for the <basic-shape>.",
           "type": "value",
           "value": "<basic-shape>"
         },
@@ -76,16 +76,22 @@
     },
     {
       "name": "offset-position",
-      "value": "auto | <position>",
+      "value": "normal | auto | <position>",
       "initial": "auto",
       "appliesTo": "transformable elements",
       "inherited": "no",
       "percentages": "Refer to the size of containing block",
-      "computedValue": "The auto keyword or a computed <position>",
+      "computedValue": "The normal or auto keywords, or a computed <position>",
       "canonicalOrder": "per grammar",
       "animationType": "by computed value",
       "media": "visual",
       "values": [
+        {
+          "name": "normal",
+          "prose": "The element does not have an offset starting position.",
+          "type": "value",
+          "value": "normal"
+        },
         {
           "name": "auto",
           "prose": "The offset starting position is the top-left corner of the box.",
@@ -196,7 +202,7 @@
     {
       "name": "ray()",
       "type": "function",
-      "value": "ray( <angle> && <ray-size>? && contain? )",
+      "value": "ray( <angle> && <ray-size>? && contain? && [at <position>]? )",
       "values": [
         {
           "name": "<angle>",
@@ -215,6 +221,12 @@
           "prose": "The length of the offset path is reduced so that the element stays within the containing block even at offset-distance: 100%. Specifically, the path’s length is reduced by half the width or half the height of the element’s border box, whichever is larger, and floored at zero.",
           "type": "value",
           "value": "contain"
+        },
+        {
+          "name": "at <position>",
+          "prose": "Specifies the origin of the ray, where the ray’s line begins (the 0% position). It’s resolved by using the <position> to position a 0x0 object area within the box’s containing block. If omitted, it uses the offset starting position of the element, given by offset-position. If the element doesn’t have an offset starting position either, it behaves as at center.",
+          "type": "value",
+          "value": "at <position>"
         }
       ]
     },

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@webref/css",
   "description": "CSS definitions of the web platform",
-  "version": "6.5.7",
+  "version": "6.5.9",
   "repository": {
     "type": "git",
     "url": "https://github.com/w3c/webref.git"

package/scroll-animations.json

@@ -6,12 +6,12 @@
   "properties": [
     {
       "name": "scroll-timeline-name",
-      "value": "none | <custom-ident>#",
+      "value": "[ none | <dashed-ident> ]#",
       "initial": "none",
       "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "n/a",
-      "computedValue": "the keyword none or a list of <custom-ident>s",
+      "computedValue": "the keyword none or a list of CSS identifiers",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
       "styleDeclaration": [
@@ -21,7 +21,7 @@
     },
     {
       "name": "scroll-timeline-axis",
-      "value": "[ block | inline | vertical | horizontal ]#",
+      "value": "[ block | inline | x | y ]#",
       "initial": "block",
       "appliesTo": "all elements",
       "inherited": "no",
@@ -43,16 +43,16 @@
           "value": "inline"
         },
         {
-          "name": "vertical",
-          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
+          "name": "x",
+          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
           "type": "value",
-          "value": "vertical"
+          "value": "x"
         },
         {
-          "name": "horizontal",
-          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
+          "name": "y",
+          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
           "type": "value",
-          "value": "horizontal"
+          "value": "y"
         },
         {
           "name": "nearest",
@@ -78,44 +78,9 @@
         "scrollTimelineAxis"
       ]
     },
-    {
-      "name": "scroll-timeline-attachment",
-      "value": "[ local | defer | ancestor ]#",
-      "initial": "local",
-      "appliesTo": "all elements",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "a list of the keywords specified",
-      "canonicalOrder": "per grammar",
-      "animationType": "not animatable",
-      "values": [
-        {
-          "name": "local",
-          "prose": "This scroll progress timeline name attaches to the corresponding scroll progress timeline defined on this box.",
-          "type": "value",
-          "value": "local"
-        },
-        {
-          "name": "defer",
-          "prose": "This scroll progress timeline name’s attachment is deferred to its descendants. In other words, this element declares a scroll progress timeline’s name and defines its scope (see § 4.2 Named Timeline Scoping and Lookup), but defers the timeline’s definition (scroll container source and axis) to its descendants. If more than one matching descendant scroll progress timeline exists, or if no such timeline exists, then the timeline name has no attachment, and represents an inactive timeline. Should it instead be ignored (be invisible to lookup)? (This might make it harder to implement.) If multiple, should it attach instead to the last declared timeline (in tree order) rather than invalidating the attachment?",
-          "type": "value",
-          "value": "defer"
-        },
-        {
-          "name": "ancestor",
-          "prose": "This scroll progress timeline definition, attaches to the closest matching scroll progress timeline name that was deferred (defer) by an ancestor (if any). If no such ancestor exists, the attachment is treated as local.",
-          "type": "value",
-          "value": "ancestor"
-        }
-      ],
-      "styleDeclaration": [
-        "scroll-timeline-attachment",
-        "scrollTimelineAttachment"
-      ]
-    },
     {
       "name": "scroll-timeline",
-      "value": "[ <'scroll-timeline-name'> [ <'scroll-timeline-axis'> || <'scroll-timeline-attachment'> ]? ]#",
+      "value": "[ <'scroll-timeline-name'> <'scroll-timeline-axis'>? ]#",
       "initial": "see individual properties",
       "appliesTo": "all elements",
       "inherited": "no",
@@ -130,12 +95,12 @@
     },
     {
       "name": "view-timeline-name",
-      "value": "none | <custom-ident>#",
+      "value": "[ none | <dashed-ident> ]#",
       "initial": "none",
       "appliesTo": "all elements",
       "inherited": "no",
       "percentages": "n/a",
-      "computedValue": "the keyword none or a list of <custom-ident>s",
+      "computedValue": "the keyword none or a list of CSS identifiers",
       "canonicalOrder": "per grammar",
       "animationType": "not animatable",
       "styleDeclaration": [
@@ -145,7 +110,7 @@
     },
     {
       "name": "view-timeline-axis",
-      "value": "[ block | inline | vertical | horizontal ]#",
+      "value": "[ block | inline | x | y ]#",
       "initial": "block",
       "appliesTo": "all elements",
       "inherited": "no",
@@ -167,16 +132,16 @@
           "value": "inline"
         },
         {
-          "name": "vertical",
-          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
+          "name": "x",
+          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
           "type": "value",
-          "value": "vertical"
+          "value": "x"
         },
         {
-          "name": "horizontal",
-          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
+          "name": "y",
+          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
           "type": "value",
-          "value": "horizontal"
+          "value": "y"
         },
         {
           "name": "nearest",
@@ -231,44 +196,9 @@
         "viewTimelineInset"
       ]
     },
-    {
-      "name": "view-timeline-attachment",
-      "value": "[ local | defer | ancestor ]#",
-      "initial": "local",
-      "appliesTo": "all elements",
-      "inherited": "no",
-      "percentages": "n/a",
-      "computedValue": "a list of the keywords specified",
-      "canonicalOrder": "per grammar",
-      "animationType": "not animatable",
-      "values": [
-        {
-          "name": "local",
-          "prose": "This view progress timeline name attaches to the corresponding view progress timeline defined on this box.",
-          "type": "value",
-          "value": "local"
-        },
-        {
-          "name": "defer",
-          "prose": "This view progress timeline name’s attachment is deferred to its descendants. In other words, this element declares a view progress timeline’s name and defines its scope (see § 4.2 Named Timeline Scoping and Lookup), but defers the timeline’s definition (subject, scroll container source, axis, and visibility range) to its descendants. If more than one matching descendant view progress timeline exists, or if no such timeline exists, then this timeline name has no attachment, and represents an inactive timeline.",
-          "type": "value",
-          "value": "defer"
-        },
-        {
-          "name": "ancestor",
-          "prose": "This view progress timeline definition attaches to the closest matching view progress timeline name that was deferred (defer) by an ancestor (if any). If no such ancestor exists, the attachment is treated as local.",
-          "type": "value",
-          "value": "ancestor"
-        }
-      ],
-      "styleDeclaration": [
-        "view-timeline-attachment",
-        "viewTimelineAttachment"
-      ]
-    },
     {
       "name": "view-timeline",
-      "value": "[ <'view-timeline-name'> [ <'view-timeline-axis'> || <'view-timeline-attachment'> ]? ]#",
+      "value": "[ <'view-timeline-name'> <'view-timeline-axis'>? ]#",
       "initial": "see individual properties",
       "appliesTo": "all elements",
       "inherited": "see individual properties",
@@ -365,6 +295,35 @@
         "animation-range-end",
         "animationRangeEnd"
       ]
+    },
+    {
+      "name": "timeline-scope",
+      "value": "none | <dashed-ident>#",
+      "initial": "none",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "the keyword none or a list of CSS identifiers",
+      "canonicalOrder": "per grammar",
+      "animationType": "not animatable",
+      "values": [
+        {
+          "name": "none",
+          "prose": "No changes in timeline name scope.",
+          "type": "value",
+          "value": "none"
+        },
+        {
+          "name": "<dashed-ident>",
+          "prose": "Declares the name of a matching named timeline defined by a descendant—whose scope is not already explicitly declared by a descendant using timeline-scope—to be in scope for this element and its descendants. If no such timeline exists, or if more than one such timeline exists, instead declares an inactive timeline with the specified name.",
+          "type": "value",
+          "value": "<dashed-ident>"
+        }
+      ],
+      "styleDeclaration": [
+        "timeline-scope",
+        "timelineScope"
+      ]
     }
   ],
   "atrules": [],
@@ -389,16 +348,16 @@
           "value": "inline"
         },
         {
-          "name": "vertical",
-          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
+          "name": "x",
+          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
           "type": "value",
-          "value": "vertical"
+          "value": "x"
         },
         {
-          "name": "horizontal",
-          "prose": "Specifies to use the measure of progress along the horizontal axis of the scroll container.",
+          "name": "y",
+          "prose": "Specifies to use the measure of progress along the vertical axis of the scroll container.",
           "type": "value",
-          "value": "horizontal"
+          "value": "y"
         },
         {
           "name": "nearest",
@@ -423,7 +382,7 @@
     {
       "name": "<axis>",
       "type": "type",
-      "value": "block | inline | vertical | horizontal"
+      "value": "block | inline | x | y"
     },
     {
       "name": "<scroller>",