@webref/css 6.20.10 → 6.21.1

package/css-anchor-position.json

@@ -57,14 +57,14 @@
         },
         {
           "name": "all",
-          "prose": "Specifies that all anchor names defined by this element or its descendants—​whose scope is not already limited by a descendant using anchor-scope—​to be in scope only for this element’s descendants; and limits descendants to only match anchor names to anchor elements within this subtree.",
+          "prose": "Specifies that all anchor names defined by this element or its descendants—​whose scope is not already limited by a descendant using anchor-scope—​to be in scope only for this element’s descendants; and limits descendants to only match anchor names to anchor elements within this subtree. This value only affects anchor names in the same tree scope, as if it were a tree-scoped name. (That is, anchor-scope: all acts identically to anchor-scope: --foo, --bar, ..., listing all relevant anchor names.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-anchor-scope-all",
           "type": "value",
           "value": "all"
         },
         {
           "name": "<dashed-ident>",
-          "prose": "Specifies that a matching anchor name defined by this element or its descendants—​whose scope is not already limited by a descendant using anchor-scope—​to be in scope only for this element’s descendants; and limits descendants to only match these anchor names to anchor elements within this subtree.",
+          "prose": "Specifies that a matching anchor name defined by this element or its descendants—​whose scope is not already limited by a descendant using anchor-scope—​to be in scope only for this element’s descendants; and limits descendants to only match these anchor names to anchor elements within this subtree. The <dashed-ident> is a tree-scoped name.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-anchor-scope-dashed-ident",
           "type": "value",
           "value": "<dashed-ident>"
@@ -115,7 +115,7 @@
       "appliesTo": "positioned boxes with a default anchor box",
       "inherited": "no",
       "percentages": "n/a",
-      "computedValue": "as specified",
+      "computedValue": "the keyword none or a pair of keywords, see § 3.1.3 Computed Value and Serialization of <position-area>",
       "canonicalOrder": "per grammar",
       "animationType": "TBD",
       "values": [
@@ -128,7 +128,7 @@
         },
         {
           "name": "<position-area>",
-          "prose": "If the box does not have a default anchor box, or is not an absolutely positioned box, this value has no effect. Otherwise, it has the following effects: The property selects a region of the position-area grid, and makes that the box’s containing block. See § 3.1.1 Resolving <position-area>s for details. Note: This means that the inset properties specify offsets from the position-area, and some property values, like max-height: 100%, will be relative to the position-area as well. The normal value for the self-alignment properties behaves as either start, end, or anchor-center, depending on the positioning of the region, to give a good default alignment for the positioned box. Again, see § 3.1.1 Resolving <position-area>s for details. Any auto inset properties resolve to 0. The box is not considered to be in a legacy alignment mode in either axis.",
+          "prose": "If the box does not have a default anchor box, or is not an absolutely positioned box, this value has no effect. Otherwise, selects a region of the position-area grid, and makes that the box’s containing block.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-position-area",
           "type": "value",
           "value": "<position-area>"
@@ -139,34 +139,6 @@
         "positionArea"
       ]
     },
-    {
-      "name": "top",
-      "newValues": "<anchor()> | <anchor-size()>",
-      "styleDeclaration": [
-        "top"
-      ]
-    },
-    {
-      "name": "left",
-      "newValues": "<anchor()> | <anchor-size()>",
-      "styleDeclaration": [
-        "left"
-      ]
-    },
-    {
-      "name": "right",
-      "newValues": "<anchor()> | <anchor-size()>",
-      "styleDeclaration": [
-        "right"
-      ]
-    },
-    {
-      "name": "bottom",
-      "newValues": "<anchor()> | <anchor-size()>",
-      "styleDeclaration": [
-        "bottom"
-      ]
-    },
     {
       "name": "justify-self",
       "newValues": "anchor-center",
@@ -235,6 +207,34 @@
         "alignItems"
       ]
     },
+    {
+      "name": "top",
+      "newValues": "<anchor()> | <anchor-size()>",
+      "styleDeclaration": [
+        "top"
+      ]
+    },
+    {
+      "name": "left",
+      "newValues": "<anchor()> | <anchor-size()>",
+      "styleDeclaration": [
+        "left"
+      ]
+    },
+    {
+      "name": "right",
+      "newValues": "<anchor()> | <anchor-size()>",
+      "styleDeclaration": [
+        "right"
+      ]
+    },
+    {
+      "name": "bottom",
+      "newValues": "<anchor()> | <anchor-size()>",
+      "styleDeclaration": [
+        "bottom"
+      ]
+    },
     {
       "name": "position-visibility",
       "href": "https://drafts.csswg.org/css-anchor-position-1/#propdef-position-visibility",
@@ -256,21 +256,21 @@
         },
         {
           "name": "anchors-valid",
-          "prose": "If any of the box’s required anchor references do not resolve to a target anchor element, the box is strongly hidden. What is a required anchor reference? anchor() functions that don’t have a fallback value; the default anchor *sometimes*? Need more detail here. Any anchors are missing, or all anchors are missing? I can see use-cases for either, potentially. Do we want to make a decision here, or make it controllable somehow?",
+          "prose": "If any of the box’s required anchor references do not resolve to a target anchor element, the box’s visibility property computes to force-hidden. What is a required anchor reference? anchor() functions that don’t have a fallback value; the default anchor *sometimes*? Need more detail here. Any anchors are missing, or all anchors are missing? I can see use-cases for either, potentially. Do we want to make a decision here, or make it controllable somehow?",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-visibility-anchors-valid",
           "type": "value",
           "value": "anchors-valid"
         },
         {
           "name": "anchors-visible",
-          "prose": "If the box has a default anchor box but that anchor box is clipped by intervening boxes, this box is also strongly hidden.",
+          "prose": "If the box has a default anchor box but that anchor box is invisible or clipped by intervening boxes, the box’s visibility property computes to force-hidden.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-visibility-anchors-visible",
           "type": "value",
           "value": "anchors-visible"
         },
         {
           "name": "no-overflow",
-          "prose": "If the box overflows its inset-modified containing block even after applying position-try, then the box is strongly hidden.",
+          "prose": "If the box overflows its inset-modified containing block even after applying position-try, the box’s visibility property computes to force-hidden.",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-visibility-no-overflow",
           "type": "value",
           "value": "no-overflow"
@@ -652,18 +652,18 @@
           "value": "block-end"
         },
         {
-          "name": "block-self-start",
+          "name": "self-block-start",
           "prose": "The single corresponding row or column, depending on which axis this keyword is specifying. Like in anchor(), the plain logical keywords (start, end, etc) refer to the writing mode of the box’s containing block. The x-start/etc determine their direction in the same way, but in the specified physical axis. The self-* logical keywords (self-start, x-self-end, etc) are identical, but refer to the box’s own writing mode.",
-          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-block-self-start",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-self-block-start",
           "type": "value",
-          "value": "block-self-start"
+          "value": "self-block-start"
         },
         {
-          "name": "block-self-end",
+          "name": "self-block-end",
           "prose": "The single corresponding row or column, depending on which axis this keyword is specifying. Like in anchor(), the plain logical keywords (start, end, etc) refer to the writing mode of the box’s containing block. The x-start/etc determine their direction in the same way, but in the specified physical axis. The self-* logical keywords (self-start, x-self-end, etc) are identical, but refer to the box’s own writing mode.",
-          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-block-self-end",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-self-block-end",
           "type": "value",
-          "value": "block-self-end"
+          "value": "self-block-end"
         },
         {
           "name": "inline-start",
@@ -680,18 +680,18 @@
           "value": "inline-end"
         },
         {
-          "name": "inline-self-start",
+          "name": "self-inline-start",
           "prose": "The single corresponding row or column, depending on which axis this keyword is specifying. Like in anchor(), the plain logical keywords (start, end, etc) refer to the writing mode of the box’s containing block. The x-start/etc determine their direction in the same way, but in the specified physical axis. The self-* logical keywords (self-start, x-self-end, etc) are identical, but refer to the box’s own writing mode.",
-          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-inline-self-start",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-self-inline-start",
           "type": "value",
-          "value": "inline-self-start"
+          "value": "self-inline-start"
         },
         {
-          "name": "inline-self-end",
+          "name": "self-inline-end",
           "prose": "The single corresponding row or column, depending on which axis this keyword is specifying. Like in anchor(), the plain logical keywords (start, end, etc) refer to the writing mode of the box’s containing block. The x-start/etc determine their direction in the same way, but in the specified physical axis. The self-* logical keywords (self-start, x-self-end, etc) are identical, but refer to the box’s own writing mode.",
-          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-inline-self-end",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-self-inline-end",
           "type": "value",
-          "value": "inline-self-end"
+          "value": "self-inline-end"
         },
         {
           "name": "center",
@@ -702,88 +702,158 @@
         },
         {
           "name": "span-start",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-start",
           "type": "value",
           "value": "span-start"
         },
         {
           "name": "span-end",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-end",
           "type": "value",
           "value": "span-end"
         },
+        {
+          "name": "span-self-start",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-self-start",
+          "type": "value",
+          "value": "span-self-start"
+        },
+        {
+          "name": "span-self-end",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-self-end",
+          "type": "value",
+          "value": "span-self-end"
+        },
         {
           "name": "span-top",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-top",
           "type": "value",
           "value": "span-top"
         },
         {
           "name": "span-bottom",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-bottom",
           "type": "value",
           "value": "span-bottom"
         },
         {
           "name": "span-y-start",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-y-start",
           "type": "value",
           "value": "span-y-start"
         },
         {
           "name": "span-y-end",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-y-end",
           "type": "value",
           "value": "span-y-end"
         },
+        {
+          "name": "span-y-self-start",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-y-self-start",
+          "type": "value",
+          "value": "span-y-self-start"
+        },
+        {
+          "name": "span-y-self-end",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-y-self-end",
+          "type": "value",
+          "value": "span-y-self-end"
+        },
         {
           "name": "span-x-start",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-x-start",
           "type": "value",
           "value": "span-x-start"
         },
         {
           "name": "span-x-end",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-x-end",
           "type": "value",
           "value": "span-x-end"
         },
+        {
+          "name": "span-x-self-start",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-x-self-start",
+          "type": "value",
+          "value": "span-x-self-start"
+        },
+        {
+          "name": "span-x-self-end",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-x-self-end",
+          "type": "value",
+          "value": "span-x-self-end"
+        },
         {
           "name": "span-block-start",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-block-start",
           "type": "value",
           "value": "span-block-start"
         },
         {
           "name": "span-block-end",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-block-end",
           "type": "value",
           "value": "span-block-end"
         },
+        {
+          "name": "span-self-block-start",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-self-block-start",
+          "type": "value",
+          "value": "span-self-block-start"
+        },
+        {
+          "name": "span-self-block-end",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-self-block-end",
+          "type": "value",
+          "value": "span-self-block-end"
+        },
         {
           "name": "span-inline-start",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-inline-start",
           "type": "value",
           "value": "span-inline-start"
         },
         {
           "name": "span-inline-end",
-          "prose": "Two rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
           "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-inline-end",
           "type": "value",
           "value": "span-inline-end"
         },
+        {
+          "name": "span-self-inline-start",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-self-inline-start",
+          "type": "value",
+          "value": "span-self-inline-start"
+        },
+        {
+          "name": "span-self-inline-end",
+          "prose": "Two adjacent rows or columns, depending on which axis this keyword is specifying: the center row/column, and the row/column corresponding to the other half of the keyword as per the single-track keywords. (For example, span-top spans the first two rows—​the center row and the top row.)",
+          "href": "https://drafts.csswg.org/css-anchor-position-1/#valdef-position-area-span-self-inline-end",
+          "type": "value",
+          "value": "span-self-inline-end"
+        },
         {
           "name": "span-all",
           "prose": "All three rows or columns, depending on which axis this keyword is specifying.",
@@ -795,7 +865,7 @@
     },
     {
       "name": "anchor()",
-      "prose": "An absolutely positioned box can use the anchor() function as a value in its inset properties to refer to the position of one or more anchor boxes. The anchor() function resolves to a <length>. It is only valid to be used in the inset properties.",
+      "prose": "An absolutely positioned box can use the anchor() function as a value in its inset properties to refer to the position of one or more anchor boxes. The anchor() function resolves to a <length>. It is only allowed in the inset properties (and is otherwise invalid).",
       "href": "https://drafts.csswg.org/css-anchor-position-1/#funcdef-anchor",
       "type": "function",
       "value": "anchor( <anchor-name>? && <anchor-side>, <length-percentage>? )",
@@ -907,7 +977,7 @@
     },
     {
       "name": "anchor-size()",
-      "prose": "An absolutely positioned box can use the anchor-size() function in its sizing properties to refer to the size of one or more anchor boxes. The anchor-size() function resolves to a <length>. It is only valid to be used in the accepted @position-try properties.",
+      "prose": "An absolutely positioned box can use the anchor-size() function in its sizing properties to refer to the size of one or more anchor boxes. The anchor-size() function resolves to a <length>. It is only allowed in the accepted @position-try properties (and is otherwise invalid).",
       "href": "https://drafts.csswg.org/css-anchor-position-1/#funcdef-anchor-size",
       "type": "function",
       "value": "anchor-size( [ <anchor-name> || <anchor-size> ]? , <length-percentage>? )",

package/css-color-5.json

@@ -90,7 +90,7 @@
       "name": "color-mix()",
       "href": "https://drafts.csswg.org/css-color-5/#funcdef-color-mix",
       "type": "function",
-      "value": "color-mix( <color-interpolation-method> , [ <color> && <percentage [0,100]>? ]#{2})"
+      "value": "color-mix( <color-interpolation-method> , [ <color> && <percentage [0,100]>? ]#)"
     },
     {
       "name": "<modern-rgb-syntax>",
@@ -268,21 +268,21 @@
       "values": [
         {
           "name": "l",
-          "prose": "l is a <number> that corresponds to the origin color’s Oklab Lightness after conversion, if required, to OKLCh. 1.0 is equivalent to 100%.",
+          "prose": "l is a <number> that corresponds to the origin color’s Oklab Lightness after conversion, if required, to OkLCh. 1.0 is equivalent to 100%.",
           "href": "https://drafts.csswg.org/css-color-5/#valdef-oklch-l",
           "type": "value",
           "value": "l"
         },
         {
           "name": "c",
-          "prose": "c is a <number> that corresponds to the origin color’s OKLCh chroma after conversion, if required, to OKLCh. 0.4 is equivalent to 100%.",
+          "prose": "c is a <number> that corresponds to the origin color’s OkLCh chroma after conversion, if required, to OkLCh. 0.4 is equivalent to 100%.",
           "href": "https://drafts.csswg.org/css-color-5/#valdef-oklch-c",
           "type": "value",
           "value": "c"
         },
         {
           "name": "h",
-          "prose": "h is a <number> that corresponds to the origin color’s OKLCh hue, in degrees, after conversion, if required, to OKLCh, normalized to a [0, 360] range. 90 is equivalent to 90deg.",
+          "prose": "h is a <number> that corresponds to the origin color’s OkLCh hue, in degrees, after conversion, if required, to OkLCh, normalized to a [0, 360] range. 90 is equivalent to 90deg.",
           "href": "https://drafts.csswg.org/css-color-5/#valdef-oklch-h",
           "type": "value",
           "value": "h"

package/css-color.json

@@ -1447,11 +1447,11 @@
       "value": "oklch( [ <percentage> | <number> | none] [ <percentage> | <number> | none] [ <hue> | none] [ / [<alpha-value> | none] ]? )",
       "values": [
         {
-          "name": "OKLCh",
-          "prose": "In OKLCh the first argument specifies the OKLCh Lightness L, interpreted identically to the Lightness argument of oklab().",
+          "name": "OkLCh",
+          "prose": "In OkLCh the first argument specifies the OkLCh Lightness L, interpreted identically to the Lightness argument of oklab().",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-oklch-oklch",
           "type": "value",
-          "value": "OKLCh"
+          "value": "OkLCh"
         }
       ]
     },

package/css-display.json

@@ -147,7 +147,7 @@
     {
       "name": "visibility",
       "href": "https://drafts.csswg.org/css-display-4/#propdef-visibility",
-      "value": "visible | hidden | collapse",
+      "value": "visible | hidden | force-hidden | collapse",
       "initial": "visible",
       "appliesTo": "all elements",
       "inherited": "yes",
@@ -171,6 +171,13 @@
           "type": "value",
           "value": "hidden"
         },
+        {
+          "name": "force-hidden",
+          "prose": "Any boxes generated by the element and its descendants are invisible (regardless of their visibility value).",
+          "href": "https://drafts.csswg.org/css-display-4/#valdef-visibility-force-hidden",
+          "type": "value",
+          "value": "force-hidden"
+        },
         {
           "name": "collapse",
           "prose": "Indicates that the box is collapsed, which can cause it to take up less space than otherwise in a formatting-context–specific way. See dynamic row and column effects in tables [CSS2] and collapsed flex items in flex layout [CSS-FLEXBOX-1]. In all other cases, however, (i.e. unless otherwise specified) this simply makes the box invisible, just like hidden.",

package/css-overflow-5.json

@@ -25,14 +25,14 @@
         },
         {
           "name": "before",
-          "prose": "The scroll container generates a ::scroll-marker-group pseudo-element whose box is an immediate preceding sibling to its originating element.",
+          "prose": "The scroll container generates a ::scroll-marker-group pseudo-element. When originating from the root element, the generated pseudo-element’s box is the first child of the originating element. Otherwise, its box is an immediate preceding sibling to its originating element.",
           "href": "https://drafts.csswg.org/css-overflow-5/#valdef-scroll-marker-group-before",
           "type": "value",
           "value": "before"
         },
         {
           "name": "after",
-          "prose": "The scroll container generates a ::scroll-marker-group pseudo-element whose box is an immediate following sibling to its originating element.",
+          "prose": "The scroll container generates a ::scroll-marker-group pseudo-element. When originating from the root element, the generated pseudo-element’s box is the last child of the originating element. Otherwise, its box is an immediate following sibling to its originating element.",
           "href": "https://drafts.csswg.org/css-overflow-5/#valdef-scroll-marker-group-after",
           "type": "value",
           "value": "after"

package/css-values-5.json

@@ -330,40 +330,11 @@
     },
     {
       "name": "progress()",
-      "prose": "The progress() functional notation returns a <number> value representing the position of one calculation (the progress value) between two other calculations (the progress start value and progress end value). progress() is a math function.",
+      "prose": "The progress() functional notation represents the proportional distance of a given value (the progress value) from one value (the progress start value) to another value (the progress end value), each represented as a calculation. It is a math function, and can be input into other calculations such as a math function or a mix notation.",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-progress",
-      "type": "function"
-    },
-    {
-      "name": "<progress()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-progress-fn",
-      "type": "type",
+      "type": "function",
       "value": "progress(<calc-sum>, <calc-sum>, <calc-sum>)"
     },
-    {
-      "name": "media-progress()",
-      "prose": "Similar to the progress() notation, the media-progress() functional notation returns a <number> value representing current value of the specified media query [MEDIAQUERIES-4] as a progress value between two explicit values of the media query (as the progress start value and progress end value).",
-      "href": "https://drafts.csswg.org/css-values-5/#funcdef-media-progress",
-      "type": "function"
-    },
-    {
-      "name": "<media-progress()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-media-progress",
-      "type": "type",
-      "value": "media-progress(<mf-name>, <calc-sum>, <calc-sum>)"
-    },
-    {
-      "name": "container-progress()",
-      "prose": "The container-progress() functional notation is identical to the media-progress() functional notation, except that it accepts container features [CSS-CONTAIN-3] in place of media features.",
-      "href": "https://drafts.csswg.org/css-values-5/#funcdef-container-progress",
-      "type": "function"
-    },
-    {
-      "name": "<container-progress()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-container-progress",
-      "type": "type",
-      "value": "container-progress(<mf-name> [ of <container-name> ]?, <calc-sum>, <calc-sum>)"
-    },
     {
       "name": "<progress>",
       "prose": "The <progress> value type represents the mix progress value in a mix notation, and ultimately resolves to a percentage. It can, however, draw that percentage value from sources such as media queries and animation timelines, and can also convert it through an easing function before using it for interpolation.",
@@ -405,48 +376,28 @@
       "name": "calc-mix()",
       "prose": "The calc-mix() mix notation represents an interpolated numeric or dimensional value. Like calc(), it is a math function, with the following syntactic form:",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-mix",
-      "type": "function"
-    },
-    {
-      "name": "<calc-mix()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-mix",
-      "type": "type",
+      "type": "function",
       "value": "calc-mix( <progress>, <calc-sum>, <calc-sum> )"
     },
     {
       "name": "transform-mix()",
       "prose": "The transform-mix() mix notation represents an interpolated <transform-list>, with the following syntactic form:",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-transform-mix",
-      "type": "function"
-    },
-    {
-      "name": "<transform-mix()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-transform-mix",
-      "type": "type",
+      "type": "function",
       "value": "transform-mix( <progress>, <transform-list>, <transform-list> )"
     },
     {
       "name": "mix()",
       "prose": "Interpolation of any two property values can be represented by the mix() mix notation, which supports two alternative syntax patterns:",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-mix",
-      "type": "function"
-    },
-    {
-      "name": "<mix()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-mix",
-      "type": "type",
+      "type": "function",
       "value": "mix( <progress> , <whole-value> , <whole-value> ) | mix( <progress> && of <keyframes-name> )"
     },
     {
       "name": "first-valid()",
       "prose": "The first-valid() functional notation inlines the fallback behavior intrinsic to parsing declarations. Unlike most notations, it can accept any valid or invalid syntax in its arguments, and represents the first value among its arguments that is supported (parsed as valid) by the UA as the whole value of the property it’s used in.",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-first-valid",
-      "type": "function"
-    },
-    {
-      "name": "<first-valid()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-first-valid",
-      "type": "type",
+      "type": "function",
       "value": "first-valid( <declaration-value># )"
     },
     {
@@ -454,6 +405,7 @@
       "prose": "The if() function is an arbitrary substitution function that represents conditional values. Its argument consists of an ordered semi-colon–separated list of statements, each consisting of a condition followed by a colon followed by a value. An if() function represents the value corresponding to the first condition in its argument list to be true; if no condition matches, then the if() function represents an empty token stream.",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-if",
       "type": "function",
+      "value": "if( [ <if-branch> ; ]* <if-branch> ;? )",
       "values": [
         {
           "name": "else",
@@ -464,12 +416,6 @@
         }
       ]
     },
-    {
-      "name": "<if()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-if",
-      "type": "type",
-      "value": "if( [ <if-branch> ; ]* <if-branch> ;? )"
-    },
     {
       "name": "<if-branch>",
       "href": "https://drafts.csswg.org/css-values-5/#typedef-if-branch",
@@ -504,24 +450,14 @@
       "name": "toggle()",
       "prose": "The toggle() expression allows descendant elements to cycle over a list of values instead of inheriting the same value.",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-toggle",
-      "type": "function"
-    },
-    {
-      "name": "<toggle()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-toggle",
-      "type": "type",
+      "type": "function",
       "value": "toggle( <whole-value># )"
     },
     {
       "name": "inherit()",
       "prose": "Like the inherit keyword, the inherit() functional notation resolves to the computed value of a property on the parent. Rather than resolving to the value of the same property, however, it resolves to a sequence of component values representing the computed value of the property specified as its first argument. Its second argument, if present, is used as a fallback in case the first argument resolves to the guaranteed-invalid value.",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-inherit",
-      "type": "function"
-    },
-    {
-      "name": "<inherit()>",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-inherit",
-      "type": "type",
+      "type": "function",
       "value": "inherit( <custom-property-name>, <declaration-value>? )"
     },
     {
@@ -676,12 +612,12 @@
       "name": "<calc-size-basis>",
       "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-size-basis",
       "type": "type",
-      "value": "[ <intrinsic-size-keyword> | <calc-size()> | any | <calc-sum> ]"
+      "value": "[ <size-keyword> | <calc-size()> | any | <calc-sum> ]"
     },
     {
-      "name": "<intrinsic-size-keyword>",
-      "prose": "The <intrinsic-size-keyword> production matches any intrinsic size keywords allowed in the context. For example, in width, it matches auto, min-content, stretch, etc.",
-      "href": "https://drafts.csswg.org/css-values-5/#typedef-intrinsic-size-keyword",
+      "name": "<size-keyword>",
+      "prose": "The <size-keyword> production matches any sizing keywords allowed in the context. For example, in width, it matches auto, min-content, stretch, etc.",
+      "href": "https://drafts.csswg.org/css-values-5/#typedef-size-keyword",
       "type": "type"
     }
   ],
@@ -696,11 +632,6 @@
       "name": "<boolean-expr-group>",
       "value": "<test> | ( <boolean-expr[ <test> ]> ) | <general-enclosed>"
     },
-    {
-      "msg": "Missing definition",
-      "name": "progress-function()",
-      "value": "progress-function( progress value, start value, end value )"
-    },
     {
       "msg": "Missing definition",
       "name": "mix-function()",

package/package.json

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