@webref/css 6.25.11 → 6.25.13

package/css-animations-2.json

@@ -36,6 +36,67 @@
         "animationDuration"
       ]
     },
+    {
+      "name": "animation-delay-start",
+      "href": "https://drafts.csswg.org/css-animations-2/#propdef-animation-delay-start",
+      "value": "<time>#",
+      "initial": "0s",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "N/A",
+      "computedValue": "list, each item a duration",
+      "canonicalOrder": "per grammar",
+      "animationType": "not animatable",
+      "values": [
+        {
+          "name": "<time>",
+          "prose": "The <time> defines how long of a delay there is between the start of the animation (when the animation is applied to the element via these properties) and when it begins executing. A delay of 0s (the initial value) means that the animation will execute as soon as it is applied. A negative delay is valid. Similar to a delay of 0s, it means that the animation executes immediately, but is automatically progressed by the absolute value of the delay, as if the animation had started the specified time in the past, and so it appears to start partway through its active duration. If an animation’s keyframes have an implied starting value, the values are taken from the time the animation starts, not some time in the past.",
+          "href": "https://drafts.csswg.org/css-animations-2/#valdef-animation-delay-start-time",
+          "type": "value",
+          "value": "<time>"
+        }
+      ],
+      "styleDeclaration": [
+        "animation-delay-start",
+        "animationDelayStart"
+      ]
+    },
+    {
+      "name": "animation-delay-end",
+      "href": "https://drafts.csswg.org/css-animations-2/#propdef-animation-delay-end",
+      "value": "<time [0s,∞]>#",
+      "initial": "0s",
+      "appliesTo": "all elements",
+      "inherited": "no",
+      "percentages": "N/A",
+      "computedValue": "list, each item a duration",
+      "canonicalOrder": "per grammar",
+      "animationType": "not animatable",
+      "styleDeclaration": [
+        "animation-delay-end",
+        "animationDelayEnd"
+      ]
+    },
+    {
+      "name": "animation-delay",
+      "href": "https://drafts.csswg.org/css-animations-2/#propdef-animation-delay",
+      "value": "[ <'animation-delay-start'> <'animation-delay-end'>? ]#",
+      "initial": "see individual properties",
+      "appliesTo": "see individual properties",
+      "inherited": "see individual properties",
+      "percentages": "see individual properties",
+      "computedValue": "see individual properties",
+      "animationType": "see individual properties",
+      "canonicalOrder": "per grammar",
+      "styleDeclaration": [
+        "animation-delay",
+        "animationDelay"
+      ],
+      "longhands": [
+        "animation-delay-start",
+        "animation-delay-end"
+      ]
+    },
     {
       "name": "animation-composition",
       "href": "https://drafts.csswg.org/css-animations-2/#propdef-animation-composition",
@@ -123,7 +184,7 @@
     },
     {
       "name": "<single-animation>",
-      "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>",
+      "value": "<'animation-duration'> || <easing-function> || <'animation-delay-start'> || <single-animation-iteration-count> || <single-animation-direction> || <single-animation-fill-mode> || <single-animation-play-state> || [ none | <keyframes-name> ] || <single-animation-timeline>",
       "href": "https://drafts.csswg.org/css-animations-2/#typedef-single-animation",
       "type": "type"
     }

package/css-backgrounds-4.json

@@ -682,13 +682,13 @@
       "name": "<bg-layer>",
       "href": "https://drafts.csswg.org/css-backgrounds-4/#typedef-bg-layer",
       "type": "type",
-      "value": "<bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <bg-clip> || <visual-box>"
+      "value": "<bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <visual-box> || <bg-clip>"
     },
     {
       "name": "<final-bg-layer>",
       "href": "https://drafts.csswg.org/css-backgrounds-4/#typedef-final-bg-layer",
       "type": "type",
-      "value": "<bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <bg-clip> || <visual-box> || <'background-color'>"
+      "value": "<bg-image> || <bg-position> [ / <bg-size> ]? || <repeat-style> || <attachment> || <visual-box> || <bg-clip> || <'background-color'>"
     }
   ]
 }

package/css-box.json

@@ -96,12 +96,12 @@
     {
       "name": "margin-trim",
       "href": "https://drafts.csswg.org/css-box-4/#propdef-margin-trim",
-      "value": "none | [ block || inline ] | [ block-start || inline-start || block-end || inline-end ]",
+      "value": "none | block | [ block-start || block-end ]",
       "initial": "none",
-      "appliesTo": "block containers, multi-column containers, flex containers, grid containers",
+      "appliesTo": "block containers, multi-column containers",
       "inherited": "no",
       "percentages": "N/A",
-      "computedValue": "a set of zero to four keywords indicating which sides to trim",
+      "computedValue": "a set of zero to two keywords indicating which sides to trim",
       "canonicalOrder": "per grammar",
       "animationType": "discrete",
       "values": [
@@ -126,33 +126,12 @@
           "type": "value",
           "value": "block-end"
         },
-        {
-          "name": "inline-start",
-          "prose": "Computes to block-start block-end.",
-          "href": "https://drafts.csswg.org/css-box-4/#valdef-margin-trim-inline-start",
-          "type": "value",
-          "value": "inline-start"
-        },
-        {
-          "name": "inline-end",
-          "prose": "Computes to block-start block-end.",
-          "href": "https://drafts.csswg.org/css-box-4/#valdef-margin-trim-inline-end",
-          "type": "value",
-          "value": "inline-end"
-        },
         {
           "name": "block",
           "prose": "Computes to block-start block-end.",
           "href": "https://drafts.csswg.org/css-box-4/#valdef-margin-trim-block",
           "type": "value",
           "value": "block"
-        },
-        {
-          "name": "inline",
-          "prose": "Computes to inline-start inline-end.",
-          "href": "https://drafts.csswg.org/css-box-4/#valdef-margin-trim-inline",
-          "type": "value",
-          "value": "inline"
         }
       ],
       "styleDeclaration": [

package/css-color.json

@@ -83,161 +83,161 @@
         },
         {
           "name": "ActiveBorder",
-          "prose": "Active window border. Same as ButtonBorder.",
+          "prose": "Active window border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-activeborder",
           "type": "value",
           "value": "ActiveBorder"
         },
         {
           "name": "ActiveCaption",
-          "prose": "Active window caption. Same as Canvas.",
+          "prose": "Active window caption. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-activecaption",
           "type": "value",
           "value": "ActiveCaption"
         },
         {
           "name": "AppWorkspace",
-          "prose": "Background color of multiple document interface. Same as Canvas.",
+          "prose": "Background color of multiple document interface. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-appworkspace",
           "type": "value",
           "value": "AppWorkspace"
         },
         {
           "name": "Background",
-          "prose": "Desktop background. Same as Canvas.",
+          "prose": "Desktop background. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-background",
           "type": "value",
           "value": "Background"
         },
         {
           "name": "ButtonHighlight",
-          "prose": "The color of the border facing the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Same as ButtonFace.",
+          "prose": "The color of the border facing the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Computes to the color of ButtonFace.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-buttonhighlight",
           "type": "value",
           "value": "ButtonHighlight"
         },
         {
           "name": "ButtonShadow",
-          "prose": "The color of the border away from the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Same as ButtonFace.",
+          "prose": "The color of the border away from the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Computes to the color of ButtonFace.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-buttonshadow",
           "type": "value",
           "value": "ButtonShadow"
         },
         {
           "name": "CaptionText",
-          "prose": "Text in caption, size box, and scrollbar arrow box. Same as CanvasText.",
+          "prose": "Text in caption, size box, and scrollbar arrow box. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-captiontext",
           "type": "value",
           "value": "CaptionText"
         },
         {
           "name": "InactiveBorder",
-          "prose": "Inactive window border. Same as ButtonBorder.",
+          "prose": "Inactive window border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-inactiveborder",
           "type": "value",
           "value": "InactiveBorder"
         },
         {
           "name": "InactiveCaption",
-          "prose": "Inactive window caption. Same as Canvas.",
+          "prose": "Inactive window caption. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-inactivecaption",
           "type": "value",
           "value": "InactiveCaption"
         },
         {
           "name": "InactiveCaptionText",
-          "prose": "Color of text in an inactive caption. Same as GrayText.",
+          "prose": "Color of text in an inactive caption. Computes to the color of GrayText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-inactivecaptiontext",
           "type": "value",
           "value": "InactiveCaptionText"
         },
         {
           "name": "InfoBackground",
-          "prose": "Background color for tooltip controls. Same as Canvas.",
+          "prose": "Background color for tooltip controls. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-infobackground",
           "type": "value",
           "value": "InfoBackground"
         },
         {
           "name": "InfoText",
-          "prose": "Text color for tooltip controls. Same as CanvasText.",
+          "prose": "Text color for tooltip controls. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-infotext",
           "type": "value",
           "value": "InfoText"
         },
         {
           "name": "Menu",
-          "prose": "Menu background. Same as Canvas.",
+          "prose": "Menu background. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-menu",
           "type": "value",
           "value": "Menu"
         },
         {
           "name": "MenuText",
-          "prose": "Text in menus. Same as CanvasText.",
+          "prose": "Text in menus. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-menutext",
           "type": "value",
           "value": "MenuText"
         },
         {
           "name": "Scrollbar",
-          "prose": "Scroll bar gray area. Same as Canvas.",
+          "prose": "Scroll bar gray area. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-scrollbar",
           "type": "value",
           "value": "Scrollbar"
         },
         {
           "name": "ThreeDDarkShadow",
-          "prose": "The color of the darker (generally outer) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the darker (generally outer) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threeddarkshadow",
           "type": "value",
           "value": "ThreeDDarkShadow"
         },
         {
           "name": "ThreeDFace",
-          "prose": "The face background color for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonFace.",
+          "prose": "The face background color for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonFace.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedface",
           "type": "value",
           "value": "ThreeDFace"
         },
         {
           "name": "ThreeDHighlight",
-          "prose": "The color of the lighter (generally outer) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the lighter (generally outer) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedhighlight",
           "type": "value",
           "value": "ThreeDHighlight"
         },
         {
           "name": "ThreeDLightShadow",
-          "prose": "The color of the darker (generally inner) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the darker (generally inner) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedlightshadow",
           "type": "value",
           "value": "ThreeDLightShadow"
         },
         {
           "name": "ThreeDShadow",
-          "prose": "The color of the lighter (generally inner) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the lighter (generally inner) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedshadow",
           "type": "value",
           "value": "ThreeDShadow"
         },
         {
           "name": "Window",
-          "prose": "Window background. Same as Canvas.",
+          "prose": "Window background. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-window",
           "type": "value",
           "value": "Window"
         },
         {
           "name": "WindowFrame",
-          "prose": "Window frame. Same as ButtonBorder.",
+          "prose": "Window frame. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-windowframe",
           "type": "value",
           "value": "WindowFrame"
         },
         {
           "name": "WindowText",
-          "prose": "Text in windows. Same as CanvasText.",
+          "prose": "Text in windows. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-windowtext",
           "type": "value",
           "value": "WindowText"
@@ -1465,7 +1465,7 @@
       "values": [
         {
           "name": "srgb",
-          "prose": "The srgb [SRGB] color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. The whitepoint is D65. [SRGB] specifies two viewing conditions, encoding and typical. The [ICC] recommends using the encoding conditions for color conversion and for optimal viewing, which are the values in the table below. sRGB is the default color space for CSS, used for all the legacy color functions. It has the following characteristics: x y Red chromaticity 0.640 0.330 Green chromaticity 0.300 0.600 Blue chromaticity 0.150 0.060 White chromaticity D65 Transfer function see below White luminance 80.0 cd/m Black luminance 0.20 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 let sign = c < 0? -1 : 1; let abs = Math.abs(c); if (abs <= 0.04045) { cl = c / 12.92; } else { cl = sign * (Math.pow((abs + 0.055) / 1.055, 2.4)); } c is the gamma-encoded red, green or blue component. cl is the corresponding linear-light component. Visualization of the sRGB color space in LCH. The primaries and secondaries are shown.",
+          "prose": "The srgb [SRGB] color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. The whitepoint is D65. [SRGB] specifies two viewing conditions, encoding and typical. The [ICC] recommends using the encoding conditions for color conversion and for optimal viewing, which are the values in the table below. sRGB is the default color space for CSS, used for all the legacy color functions. It has the following characteristics: x y Red chromaticity 0.640 0.330 Green chromaticity 0.300 0.600 Blue chromaticity 0.150 0.060 White chromaticity D65 Transfer function see below White luminance 80.0 cd/m Black luminance 0.20 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 let sign = c < 0? -1 : 1; let abs = Math.abs(c); if (abs <= 0.04045) { cl = c / 12.92; } else { cl = sign * (Math.pow((abs + 0.055) / 1.055, 2.4)); } c is the gamma-encoded red, green or blue component. cl is the corresponding linear-light component. Visualization of the sRGB color space in Oklch. The primaries and secondaries are shown.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-srgb",
           "type": "value",
           "value": "srgb"
@@ -1479,7 +1479,7 @@
         },
         {
           "name": "display-p3",
-          "prose": "The display-p3 [Display-P3] color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. It uses the same primary chromaticities as [DCI-P3], but with a D65 whitepoint, and the same transfer curve as sRGB. Modern displays, TVs, laptop screens and phone screens are able to display all, or nearly all, of the display-p3 gamut. It has the following characteristics: x y Red chromaticity 0.680 0.320 Green chromaticity 0.265 0.690 Blue chromaticity 0.150 0.060 White chromaticity D65 Transfer function same as srgb White luminance 80.0 cd/m Black luminance 0.80 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 Visualization of the P3 color space in LCH. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. P3 primaries have higher Chroma.",
+          "prose": "The display-p3 [Display-P3] color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. It uses the same primary chromaticities as [DCI-P3], but with a D65 whitepoint, and the same transfer curve as sRGB. Modern displays, TVs, laptop screens and phone screens are able to display all, or nearly all, of the display-p3 gamut. It has the following characteristics: x y Red chromaticity 0.680 0.320 Green chromaticity 0.265 0.690 Blue chromaticity 0.150 0.060 White chromaticity D65 Transfer function same as srgb White luminance 80.0 cd/m Black luminance 0.80 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 Visualization of the P3 color space in Oklch. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. P3 primaries have higher Chroma.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-display-p3",
           "type": "value",
           "value": "display-p3"
@@ -1493,21 +1493,21 @@
         },
         {
           "name": "a98-rgb",
-          "prose": "The a98-rgb color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. The transfer curve is a gamma function, close to but not exactly 1/2.2. It has the following characteristics: x y Red chromaticity 0.6400 0.3300 Green chromaticity 0.2100 0.7100 Blue chromaticity 0.1500 0.0600 White chromaticity D65 Transfer function 256/563 White luminance 160.0 cd/m Black luminance 0.5557 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 Visualization of the A98 color space in LCH. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. a98 primaries have higher Chroma, especially the yellow, green and cyan.",
+          "prose": "The a98-rgb color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. The transfer curve is a gamma function, close to but not exactly 1/2.2. It has the following characteristics: x y Red chromaticity 0.6400 0.3300 Green chromaticity 0.2100 0.7100 Blue chromaticity 0.1500 0.0600 White chromaticity D65 Transfer function 256/563 White luminance 160.0 cd/m Black luminance 0.5557 cd/m Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 Visualization of the A98 color space in Oklch. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. a98 primaries have higher Chroma, especially the yellow, green and cyan.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-a98-rgb",
           "type": "value",
           "value": "a98-rgb"
         },
         {
           "name": "prophoto-rgb",
-          "prose": "The prophoto-rgb color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. The transfer curve is a gamma function with a value of 1/1.8, and a small linear portion near black. The white point is D50, the same as is used by CIE Lab. Thus, conversion to CIE Lab does not require the chromatic adaptation step. The ProPhoto RGB space uses hyper-saturated, non physically realizable primaries. These were chosen to allow a wide color gamut and in particular, to minimize hue shifts under tonal manipulation. It is often used in digital photography as a wide gamut color space for the archival version of photographic images. The prophoto-rgb color space allows CSS to specify colors that will match colors in such images having the same RGB values. The ProPhoto RGB space was originally developed by Kodak and is described in [Wolfe]. It was standardized by ISO as [ROMM],[ROMM-RGB]. The white luminance is given as a range, and the viewing flare (and thus, the black luminance) is 0.5% to 1.0% of this. It has the following characteristics: x y Red chromaticity 0.734699 0.265301 Green chromaticity 0.159597 0.840403 Blue chromaticity 0.036598 0.000105 White chromaticity D50 Transfer function see below White luminance 160.0 to 640.0 cd/m Black luminance See text Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 const E = 16/512; let sign = c < 0? -1 : 1; let abs = Math.abs(c); if (abs <= E) { cl = c / 16; } else { cl = sign * Math.pow(c, 1.8); } c is the gamma-encoded red, green or blue component. cl is the corresponding linear-light component. Visualization of the prophoto-rgb color space in LCH. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. prophoto-rgb primaries and secondaries have much higher Chroma, but much of this ultrawide gamut does not correspond to physically realizable colors.",
+          "prose": "The prophoto-rgb color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1]. The transfer curve is a gamma function with a value of 1/1.8, and a small linear portion near black. The white point is D50, the same as is used by CIE Lab. Thus, conversion to CIE Lab does not require the chromatic adaptation step. The ProPhoto RGB space uses hyper-saturated, non physically realizable primaries. These were chosen to allow a wide color gamut and in particular, to minimize hue shifts under tonal manipulation. It is often used in digital photography as a wide gamut color space for the archival version of photographic images. The prophoto-rgb color space allows CSS to specify colors that will match colors in such images having the same RGB values. The ProPhoto RGB space was originally developed by Kodak and is described in [Wolfe]. It was standardized by ISO as [ROMM],[ROMM-RGB]. The white luminance is given as a range, and the viewing flare (and thus, the black luminance) is 0.5% to 1.0% of this. It has the following characteristics: x y Red chromaticity 0.734699 0.265301 Green chromaticity 0.159597 0.840403 Blue chromaticity 0.036598 0.000105 White chromaticity D50 Transfer function see below White luminance 160.0 to 640.0 cd/m Black luminance See text Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 const E = 16/512; let sign = c < 0? -1 : 1; let abs = Math.abs(c); if (abs <= E) { cl = c / 16; } else { cl = sign * Math.pow(c, 1.8); } c is the gamma-encoded red, green or blue component. cl is the corresponding linear-light component. Visualization of the prophoto-rgb color space in Oklch. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. prophoto-rgb primaries and secondaries have much higher Chroma, but much of this ultrawide gamut does not correspond to physically realizable colors.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-prophoto-rgb",
           "type": "value",
           "value": "prophoto-rgb"
         },
         {
           "name": "rec2020",
-          "prose": "The rec2020 [Rec.2020] color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1], (\"full-range\", in video terminology). ITU Reference 2020 is used for Ultra High Definition, 4k and 8k television. The primaries are physically realizable, but with difficulty as they lie very close to the spectral locus. Current displays are unable to reproduce the full gamut of rec2020. Coverage is expected to increase over time as displays improve. It has the following characteristics: x y Red chromaticity 0.708 0.292 Green chromaticity 0.170 0.797 Blue chromaticity 0.131 0.046 White chromaticity D65 Transfer function gamma 2.40, from [REC_BT.1886] Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 Visualization of the rec2020 color space in LCH. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. rec2020 primaries have much higher Chroma.",
+          "prose": "The rec2020 [Rec.2020] color space accepts three numeric parameters, representing the red, green, and blue components of the color. In-gamut colors have all three components in the range [0, 1], (\"full-range\", in video terminology). ITU Reference 2020 is used for Ultra High Definition, 4k and 8k television. The primaries are physically realizable, but with difficulty as they lie very close to the spectral locus. Current displays are unable to reproduce the full gamut of rec2020. Coverage is expected to increase over time as displays improve. It has the following characteristics: x y Red chromaticity 0.708 0.292 Green chromaticity 0.170 0.797 Blue chromaticity 0.131 0.046 White chromaticity D65 Transfer function gamma 2.40, from [REC_BT.1886] Image state display-referred Percentages Allowed for R, G and B Percent reference range for R,G,B: 0% = 0.0, 100% = 1.0 Visualization of the rec2020 color space in Oklch. The primaries and secondaries are shown (but in sRGB, not in the correct colors). For comparison, the sRGB primaries and secondaries are also shown, as dashed circles. rec2020 primaries have much higher Chroma.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-rec2020",
           "type": "value",
           "value": "rec2020"
@@ -1597,161 +1597,161 @@
       "values": [
         {
           "name": "ActiveBorder",
-          "prose": "Active window border. Same as ButtonBorder.",
+          "prose": "Active window border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-activeborder",
           "type": "value",
           "value": "ActiveBorder"
         },
         {
           "name": "ActiveCaption",
-          "prose": "Active window caption. Same as Canvas.",
+          "prose": "Active window caption. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-activecaption",
           "type": "value",
           "value": "ActiveCaption"
         },
         {
           "name": "AppWorkspace",
-          "prose": "Background color of multiple document interface. Same as Canvas.",
+          "prose": "Background color of multiple document interface. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-appworkspace",
           "type": "value",
           "value": "AppWorkspace"
         },
         {
           "name": "Background",
-          "prose": "Desktop background. Same as Canvas.",
+          "prose": "Desktop background. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-background",
           "type": "value",
           "value": "Background"
         },
         {
           "name": "ButtonHighlight",
-          "prose": "The color of the border facing the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Same as ButtonFace.",
+          "prose": "The color of the border facing the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Computes to the color of ButtonFace.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-buttonhighlight",
           "type": "value",
           "value": "ButtonHighlight"
         },
         {
           "name": "ButtonShadow",
-          "prose": "The color of the border away from the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Same as ButtonFace.",
+          "prose": "The color of the border away from the light source for 3-D elements that appear 3-D due to one layer of surrounding border. Computes to the color of ButtonFace.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-buttonshadow",
           "type": "value",
           "value": "ButtonShadow"
         },
         {
           "name": "CaptionText",
-          "prose": "Text in caption, size box, and scrollbar arrow box. Same as CanvasText.",
+          "prose": "Text in caption, size box, and scrollbar arrow box. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-captiontext",
           "type": "value",
           "value": "CaptionText"
         },
         {
           "name": "InactiveBorder",
-          "prose": "Inactive window border. Same as ButtonBorder.",
+          "prose": "Inactive window border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-inactiveborder",
           "type": "value",
           "value": "InactiveBorder"
         },
         {
           "name": "InactiveCaption",
-          "prose": "Inactive window caption. Same as Canvas.",
+          "prose": "Inactive window caption. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-inactivecaption",
           "type": "value",
           "value": "InactiveCaption"
         },
         {
           "name": "InactiveCaptionText",
-          "prose": "Color of text in an inactive caption. Same as GrayText.",
+          "prose": "Color of text in an inactive caption. Computes to the color of GrayText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-inactivecaptiontext",
           "type": "value",
           "value": "InactiveCaptionText"
         },
         {
           "name": "InfoBackground",
-          "prose": "Background color for tooltip controls. Same as Canvas.",
+          "prose": "Background color for tooltip controls. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-infobackground",
           "type": "value",
           "value": "InfoBackground"
         },
         {
           "name": "InfoText",
-          "prose": "Text color for tooltip controls. Same as CanvasText.",
+          "prose": "Text color for tooltip controls. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-infotext",
           "type": "value",
           "value": "InfoText"
         },
         {
           "name": "Menu",
-          "prose": "Menu background. Same as Canvas.",
+          "prose": "Menu background. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-menu",
           "type": "value",
           "value": "Menu"
         },
         {
           "name": "MenuText",
-          "prose": "Text in menus. Same as CanvasText.",
+          "prose": "Text in menus. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-menutext",
           "type": "value",
           "value": "MenuText"
         },
         {
           "name": "Scrollbar",
-          "prose": "Scroll bar gray area. Same as Canvas.",
+          "prose": "Scroll bar gray area. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-scrollbar",
           "type": "value",
           "value": "Scrollbar"
         },
         {
           "name": "ThreeDDarkShadow",
-          "prose": "The color of the darker (generally outer) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the darker (generally outer) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threeddarkshadow",
           "type": "value",
           "value": "ThreeDDarkShadow"
         },
         {
           "name": "ThreeDFace",
-          "prose": "The face background color for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonFace.",
+          "prose": "The face background color for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonFace.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedface",
           "type": "value",
           "value": "ThreeDFace"
         },
         {
           "name": "ThreeDHighlight",
-          "prose": "The color of the lighter (generally outer) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the lighter (generally outer) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedhighlight",
           "type": "value",
           "value": "ThreeDHighlight"
         },
         {
           "name": "ThreeDLightShadow",
-          "prose": "The color of the darker (generally inner) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the darker (generally inner) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedlightshadow",
           "type": "value",
           "value": "ThreeDLightShadow"
         },
         {
           "name": "ThreeDShadow",
-          "prose": "The color of the lighter (generally inner) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Same as ButtonBorder.",
+          "prose": "The color of the lighter (generally inner) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-threedshadow",
           "type": "value",
           "value": "ThreeDShadow"
         },
         {
           "name": "Window",
-          "prose": "Window background. Same as Canvas.",
+          "prose": "Window background. Computes to the color of Canvas.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-window",
           "type": "value",
           "value": "Window"
         },
         {
           "name": "WindowFrame",
-          "prose": "Window frame. Same as ButtonBorder.",
+          "prose": "Window frame. Computes to the color of ButtonBorder.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-windowframe",
           "type": "value",
           "value": "WindowFrame"
         },
         {
           "name": "WindowText",
-          "prose": "Text in windows. Same as CanvasText.",
+          "prose": "Text in windows. Computes to the color of CanvasText.",
           "href": "https://drafts.csswg.org/css-color-4/#valdef-color-windowtext",
           "type": "value",
           "value": "WindowText"

package/css-inline.json

@@ -183,7 +183,7 @@
       "href": "https://drafts.csswg.org/css-inline-3/#propdef-baseline-source",
       "value": "auto | first | last",
       "initial": "auto",
-      "appliesTo": "inline-level boxes",
+      "appliesTo": "inline-level boxes that establish an independent formatting context",
       "inherited": "no",
       "percentages": "N/A",
       "computedValue": "specified keyword",

package/css-mixins.json

@@ -31,7 +31,7 @@
       "name": "@mixin",
       "href": "https://drafts.csswg.org/css-mixins-1/#at-ruledef-mixin",
       "descriptors": [],
-      "value": "@mixin <function-token> <function-parameter>#? ) { <declaration-rule-list> }"
+      "value": "@mixin [<function-token> <function-parameter>#? ) | <ident-token> ] { <declaration-rule-list> }"
     },
     {
       "name": "@result",

package/css-navigation.json

@@ -1,16 +1,16 @@
 {
   "spec": {
-    "title": "CSS Route Matching",
+    "title": "CSS Navigation Matching",
     "url": "https://drafts.csswg.org/css-navigation-1/"
   },
   "properties": [],
   "atrules": [
     {
-      "name": "@route",
-      "prose": "The @route rule is an at-rule that associates an author-defined name with a URL pattern. This name can be referenced in @navigation rules and in :link-to() pseudo-classes.",
-      "href": "https://drafts.csswg.org/css-navigation-1/#at-ruledef-route",
+      "name": "@location",
+      "prose": "The @location rule is an at-rule that associates an author-defined name with a URL pattern. This name can be referenced in @navigation rules and in :link-to() pseudo-classes.",
+      "href": "https://drafts.csswg.org/css-navigation-1/#at-ruledef-location",
       "descriptors": [],
-      "value": "<route-rule>"
+      "value": "<location-rule>"
     },
     {
       "name": "@navigation",
@@ -35,26 +35,26 @@
   ],
   "values": [
     {
-      "name": "<route-location>",
-      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-route-location",
+      "name": "<navigation-location>",
+      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-navigation-location",
       "type": "type",
-      "value": "<url> | [ <route-name> | <url-pattern()> ]"
+      "value": "<url> | [ <location-name> | <url-pattern()> ]"
     },
     {
-      "name": "<route-name>",
-      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-route-name",
+      "name": "<location-name>",
+      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-location-name",
       "type": "type",
       "value": "<dashed-ident>"
     },
     {
-      "name": "<route-rule>",
-      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-route-rule",
+      "name": "<location-rule>",
+      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-location-rule",
       "type": "type",
-      "value": "@route <dashed-ident> { <declaration-list> }"
+      "value": "@location <dashed-ident> { <declaration-list> }"
     },
     {
-      "name": "<route-descriptor>",
-      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-route-descriptor",
+      "name": "<location-descriptor>",
+      "href": "https://drafts.csswg.org/css-navigation-1/#typedef-location-descriptor",
       "type": "type",
       "value": "<pattern-descriptor> | <init-descriptor> | <base-descriptor>"
     },
@@ -111,19 +111,19 @@
       "name": "<navigation-location-test>",
       "href": "https://drafts.csswg.org/css-navigation-1/#typedef-navigation-location-test",
       "type": "type",
-      "value": "<navigation-relation> : <route-location>"
+      "value": "<navigation-relation> : <navigation-location>"
     },
     {
       "name": "<navigation-relation>",
       "href": "https://drafts.csswg.org/css-navigation-1/#typedef-navigation-relation",
       "type": "type",
-      "value": "at | with | from | to"
+      "value": "at | from | to"
     },
     {
       "name": "<navigation-location-between-test>",
       "href": "https://drafts.csswg.org/css-navigation-1/#typedef-navigation-location-between-test",
       "type": "type",
-      "value": "between : <route-location> and <route-location>"
+      "value": "between : <navigation-location> and <navigation-location>"
     },
     {
       "name": "<navigation-type-test>",

package/css-overflow-5.json

@@ -89,6 +89,38 @@
         "scrollMarkerGroup"
       ]
     },
+    {
+      "name": "scroll-axis-lock",
+      "href": "https://drafts.csswg.org/css-overflow-5/#propdef-scroll-axis-lock",
+      "value": "auto | none",
+      "initial": "auto",
+      "appliesTo": "scroll container elements",
+      "inherited": "no",
+      "percentages": "n/a",
+      "computedValue": "specified value",
+      "canonicalOrder": "per grammar",
+      "animationType": "discrete",
+      "values": [
+        {
+          "name": "none",
+          "prose": "The user agent must not lock scrolls on the element to one axis.",
+          "href": "https://drafts.csswg.org/css-overflow-5/#valdef-scroll-axis-lock-none",
+          "type": "value",
+          "value": "none"
+        },
+        {
+          "name": "auto",
+          "prose": "The user agent may lock scrolls on the element to one axis.",
+          "href": "https://drafts.csswg.org/css-overflow-5/#valdef-scroll-axis-lock-auto",
+          "type": "value",
+          "value": "auto"
+        }
+      ],
+      "styleDeclaration": [
+        "scroll-axis-lock",
+        "scrollAxisLock"
+      ]
+    },
     {
       "name": "continue",
       "newValues": "overflow | paginate | fragments",

package/css-properties-values-api.json

@@ -14,24 +14,24 @@
           "href": "https://drafts.css-houdini.org/css-properties-values-api-1/#descdef-property-syntax",
           "for": "@property",
           "value": "<string>",
-          "initial": "n/a (see prose)"
+          "initial": "\"*\""
         },
         {
           "name": "inherits",
           "href": "https://drafts.css-houdini.org/css-properties-values-api-1/#descdef-property-inherits",
           "for": "@property",
           "value": "true | false",
-          "initial": "n/a (see prose)"
+          "initial": "true"
         },
         {
           "name": "initial-value",
           "href": "https://drafts.css-houdini.org/css-properties-values-api-1/#descdef-property-initial-value",
           "for": "@property",
           "value": "<declaration-value>?",
-          "initial": "the guaranteed-invalid value (but see prose)"
+          "initial": "the guaranteed-invalid value"
         }
       ],
-      "value": "@property <custom-property-name> { <declaration-list> }"
+      "value": "@property <custom-property-name># { <declaration-list> }"
     }
   ],
   "selectors": [],

package/css-text-4.json

@@ -465,7 +465,7 @@
     {
       "name": "text-wrap-style",
       "href": "https://drafts.csswg.org/css-text-4/#propdef-text-wrap-style",
-      "value": "auto | balance | stable | pretty | avoid-orphans",
+      "value": "auto | balance | stable | pretty | avoid-short-last-line",
       "initial": "auto",
       "appliesTo": "block containers hat establish an inline formatting context",
       "inherited": "yes",
@@ -497,17 +497,17 @@
         },
         {
           "name": "pretty",
-          "prose": "Specifies the UA should bias for better layout over speed, and is expected to consider multiple lines when making break decisions. Otherwise equivalent to auto. The user agent may among other things attempt to avoid excessively short last lines, similarly to avoid-orphans, but it should also improve the layout in additional ways. The precise set of improvements is user agent dependent, and may include things such as: reducing the variation in length between lines; avoiding typographic rivers; prioritizing different classes of soft wrap opportunities, hyphenation opportunities, or justification opportunities; avoiding hyphenation on too many consecutive lines… The necessary computations may be expensive, especially when applied to large amounts of text. Authors are encouraged to assess the impact on performance when using text-wrap-style: pretty, and possibly use it selectively where it matters most.",
+          "prose": "Specifies the UA should bias for better layout over speed, and is expected to consider multiple lines when making break decisions. Otherwise equivalent to auto. The user agent may among other things attempt to avoid excessively short last lines, similarly to avoid-short-last-line, but it should also improve the layout in additional ways. The precise set of improvements is user agent dependent, and may include things such as: reducing the variation in length between lines; avoiding typographic rivers; prioritizing different classes of soft wrap opportunities, hyphenation opportunities, or justification opportunities; avoiding hyphenation on too many consecutive lines… The necessary computations may be expensive, especially when applied to large amounts of text. Authors are encouraged to assess the impact on performance when using text-wrap-style: pretty, and possibly use it selectively where it matters most.",
           "href": "https://drafts.csswg.org/css-text-4/#valdef-text-wrap-style-pretty",
           "type": "value",
           "value": "pretty"
         },
         {
-          "name": "avoid-orphans",
-          "prose": "Specifies the UA should avoid excessively short last lines, and is expected to consider more than one line when making break decisions (for example, to avoid \"fixing\" an orphan by making the previous line too short). The user agent may decide against improving the last line when it would make some prior line(s) substantially unbalanced. The user agent should not attempt to improve other aspects of the layout beyond what auto if those improvements come at a significant performance cost. For instance, with the given line length, the following test would be wrapped with a single word on the last line, which could be judged too short. ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν. Applying text-wrap-style: avoid-orphans could yield something like this instead, which is arguably more pleasing: ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν. However, the following fragment is more vexing: Circumnavigating the Mississippi river An attempt to make the last line less short by wrapping the previous line earlier would result in the following: Circumnavigating the Mississippi river While the last line would indeed no longer be short, the penultimate line would be unsightly. In such cases, user agents are expected to prefer the first rendering despite text-wrap-style: avoid-orphans being set.",
-          "href": "https://drafts.csswg.org/css-text-4/#valdef-text-wrap-style-avoid-orphans",
+          "name": "avoid-short-last-line",
+          "prose": "Specifies the UA should avoid excessively short last lines, and is expected to consider more than one line when making break decisions (for example, to avoid \"fixing\" an orphan by making the previous line too short). The user agent may decide against improving the last line when it would make some prior line(s) substantially unbalanced. The user agent should not attempt to improve other aspects of the layout beyond what auto if those improvements come at a significant performance cost. For instance, with the given line length, the following test would be wrapped with a single word on the last line, which could be judged too short. ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν. Applying text-wrap-style: avoid-short-last-line could yield something like this instead, which is arguably more pleasing: ἄνδρα μοι ἔννεπε, μοῦσα, πολύτροπον, ὃς μάλα πολλὰ πλάγχθη, ἐπεὶ Τροίης ἱερὸν πτολίεθρον ἔπερσεν. However, the following fragment is more vexing: Circumnavigating the Mississippi river An attempt to make the last line less short by wrapping the previous line earlier would result in the following: Circumnavigating the Mississippi river While the last line would indeed no longer be short, the penultimate line would be unsightly. In such cases, user agents are expected to prefer the first rendering despite text-wrap-style: avoid-short-last-line being set.",
+          "href": "https://drafts.csswg.org/css-text-4/#valdef-text-wrap-style-avoid-short-last-line",
           "type": "value",
-          "value": "avoid-orphans"
+          "value": "avoid-short-last-line"
         }
       ],
       "styleDeclaration": [
@@ -737,7 +737,7 @@
     {
       "name": "hyphenate-limit-chars",
       "href": "https://drafts.csswg.org/css-text-4/#propdef-hyphenate-limit-chars",
-      "value": "[ auto | <integer> ]{1,3}",
+      "value": "[ auto | <integer [0,∞]> ]{1,3}",
       "initial": "auto",
       "appliesTo": "text",
       "inherited": "yes",
@@ -762,7 +762,7 @@
     {
       "name": "hyphenate-limit-lines",
       "href": "https://drafts.csswg.org/css-text-4/#propdef-hyphenate-limit-lines",
-      "value": "no-limit | <integer>",
+      "value": "no-limit | <integer [0,∞]>",
       "initial": "no-limit",
       "appliesTo": "block containers",
       "inherited": "yes",
@@ -1232,20 +1232,6 @@
           "type": "value",
           "value": "no-autospace"
         },
-        {
-          "name": "insert",
-          "prose": "The specified spacing is automatically inserted if there are no space characters of any kind (Unicode general category Z) already there. If neither insert nor replace are specified, the behavior is the same as insert.",
-          "href": "https://drafts.csswg.org/css-text-4/#valdef-text-autospace-insert",
-          "type": "value",
-          "value": "insert"
-        },
-        {
-          "name": "replace",
-          "prose": "The specified spacing is automatically inserted even if there is already a space (U+0020) at that point; additionally, the space (U+0020) is removed. Other types of space characters (Unicode general category Z) suppress automatic spacing, as for insert.",
-          "href": "https://drafts.csswg.org/css-text-4/#valdef-text-autospace-replace",
-          "type": "value",
-          "value": "replace"
-        },
         {
           "name": "ideograph-alpha",
           "prose": "Creates extra spacing between runs of ideographs and non-ideographic letters, see § 8.4.1 Inter-script Spacing.",
@@ -1267,6 +1253,20 @@
           "type": "value",
           "value": "punctuation"
         },
+        {
+          "name": "insert",
+          "prose": "The specified spacing is automatically inserted if there are no space characters of any kind (Unicode general category Z) already there. This is the default behavior: if neither insert nor replace are specified, insert is assumed.",
+          "href": "https://drafts.csswg.org/css-text-4/#valdef-text-autospace-insert",
+          "type": "value",
+          "value": "insert"
+        },
+        {
+          "name": "replace",
+          "prose": "The specified spacing is automatically inserted even if there is already a space (U+0020) at that point; additionally, the space (U+0020) is removed. Other types of space characters (Unicode general category Z) suppress automatic spacing, as for insert.",
+          "href": "https://drafts.csswg.org/css-text-4/#valdef-text-autospace-replace",
+          "type": "value",
+          "value": "replace"
+        },
         {
           "name": "auto",
           "prose": "The user agent chooses a set of typographically high quality spacing values. Different user agents running on different platforms may pick different values.",

package/css-text-decor-4.json

@@ -268,21 +268,21 @@
     {
       "name": "text-decoration-inset",
       "href": "https://drafts.csswg.org/css-text-decor-4/#propdef-text-decoration-inset",
-      "value": "<length>{1,2} | auto",
+      "value": "<length-percentage>{1,2} | auto",
       "initial": "0",
       "appliesTo": "all elements",
       "inherited": "no",
-      "percentages": "N/A",
+      "percentages": "Depending on the value of box-decoration-break, either refer to the inline size of the decorating box or of each individual box fragment",
       "computedValue": "specified keyword or absolute length",
       "canonicalOrder": "per grammar",
       "animationType": "by computed value",
       "values": [
         {
-          "name": "<length>",
-          "prose": "Adjusts the start or end endpoint of the affected line decorations. Positive values move the endpoint inward (trimming), negative values move it outward (extending). The following example offsets an extra thick underline 1em endwards with respect to the text h1 { text-decoration: underline 0.3em rgba(36,148,187,0.25); text-decoration-inset: 1em -1em; }",
-          "href": "https://drafts.csswg.org/css-text-decor-4/#valdef-text-decoration-inset-length",
+          "name": "<length-percentage>",
+          "prose": "Adjusts the start or end endpoint of the affected line decorations. Positive values move the endpoint inward (trimming), negative values move it outward (extending). Percentage values either refer to the total inline size of the decorating box, if box-decoration-break is set to slice, or to the inline size of each individual box fragment, if it is set to clone. The following example offsets an extra thick underline 1em endwards with respect to the text h1 { text-decoration: underline 0.3em rgb(36 148 187 / 0.25); text-decoration-inset: 1em -1em; } In this example, the underline is inset 10% of the inline size of the decorating box from the start and end of it. h1 { text-decoration: underline 0.2em rgb(216 148 23); text-decoration-inset: 10%; } This results in the orange underline being inset by 10 percent from the start and end of the headline. In this example, the underline is inset 10% of the inline size of each box fragment from the end of that fragment. h1 { text-decoration: underline 0.2em rgb(216 148 23); text-decoration-inset: 0 10%; box-decoration-break: clone; } This results in the orange underline of each line being inset by 10 percent from the end.",
+          "href": "https://drafts.csswg.org/css-text-decor-4/#valdef-text-decoration-inset-length-percentage",
           "type": "value",
-          "value": "<length>"
+          "value": "<length-percentage>"
         },
         {
           "name": "auto",

package/css-values-5.json

@@ -18,14 +18,14 @@
       "values": [
         {
           "name": "numeric-only",
-          "prose": "An <intrinsic-size-keyword> cannot be interpolated.",
+          "prose": "A <size-keyword> can only be combined with a compatible <calc-size()>.",
           "href": "https://drafts.csswg.org/css-values-5/#valdef-interpolate-size-numeric-only",
           "type": "value",
           "value": "numeric-only"
         },
         {
           "name": "allow-keywords",
-          "prose": "Two values can also be interpolated if one of them is an <intrinsic-size-keyword> and the other is a <length-percentage>. This is done by treating the <intrinsic-size-keyword> keyword as though it is calc-size(keyword, size) and applying the rules in § 11.3 Interpolating calc-size(). In other cases, an <intrinsic-size-keyword> still cannot be interpolated.",
+          "prose": "Sizing values can also be combined if one of them is an <size-keyword> and the other is a <length-percentage>. This is done by treating the <size-keyword> keyword as though it is calc-size(keyword, size) and applying the rules in § 11.2 Interpolating calc-size(). In other cases, a <size-keyword> still cannot be interpolated.",
           "href": "https://drafts.csswg.org/css-values-5/#valdef-interpolate-size-allow-keywords",
           "type": "value",
           "value": "allow-keywords"
@@ -721,7 +721,7 @@
         },
         {
           "name": "<random-cache-key>",
-          "prose": "The <random-cache-key> specifies the random cache name, allowing it to be explicitly shared (or not) with other uses of random functions. Every random function using the same random cache name will get the same random value; every one using a different random cache name will get unrelated random values. The <dashed-ident> gives the value an explicit name. If omitted, this part of the name is null. element-scoped adds an element-specific identifier to the random cache name, so different elements will get different random values. property-scoped adds the property name the random function is being used on to the random cache name, so different properties will get different random values. Note that shorthand declarations will apply the shorthand property’s name. property-index-scoped adds the property name and the index of the random function among all the random functions used in the same property value to the random cache name, so multiple instances of a random function in the same declaration will each get different random cache names. Note this index is assigned before shorthand expansion. See § 9.4.1 Simplification of <random-key> for how these values resolve. The <random-ua-ident> value, like fixed below, isn’t intended to be specified by authors, but can show up in computed values. It is a <custom-ident> that must start with the prefix ua-, or else it is invalid. When generated automatically by the user agent, it follows certain specific patterns; see § 9.4.1 Simplification of <random-key> for details.",
+          "prose": "The <random-cache-key> specifies the random cache name, allowing it to be explicitly shared (or not) with other uses of random functions. Every random function using the same random cache name will get the same random value; every one using a different random cache name will get unrelated random values. The <dashed-ident> gives the value an explicit name. If omitted, this part of the name is null. element-scoped adds an element-specific identifier to the random cache name, so different elements will get different random values. If the random function is being evaluated inside of a custom function, the element-specific identifier is for the \"hypothetical element\" that the function’s styles are evaluated on, so element-scoped will give you different random values on every function invocation. property-scoped adds the property name the random function is being used on to the random cache name, so different properties will get different random values. Note that shorthand declarations will apply the shorthand property’s name. property-index-scoped adds the property name and the index of the random function among all the random functions used in the same property value to the random cache name, so multiple instances of a random function in the same declaration will each get different random cache names. Note this index is assigned before shorthand expansion. See § 9.4.1 Simplification of <random-key> for how these values resolve. The <random-ua-ident> value, like fixed below, isn’t intended to be specified by authors, but can show up in computed values. It is a <custom-ident> that must start with the prefix ua-, or else it is invalid. When generated automatically by the user agent, it follows certain specific patterns; see § 9.4.1 Simplification of <random-key> for details.",
           "href": "https://drafts.csswg.org/css-values-5/#valdef-random-random-cache-key",
           "type": "value",
           "value": "<random-cache-key>"
@@ -788,23 +788,44 @@
     },
     {
       "name": "calc-size()",
+      "prose": "The calc-size() function allows math and transition/animation to be performed on these sizes in a safe, well-defined way. Its syntax is as follows:",
       "href": "https://drafts.csswg.org/css-values-5/#funcdef-calc-size",
       "type": "function",
       "value": "calc-size( <calc-size-basis>, <calc-sum> )",
       "values": [
         {
-          "name": "size",
-          "prose": "Within the calc-size calculation, if the calc-size basis is not any, the keyword size is allowed. This keyword is a <length>, and resolves at used value time.",
-          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-size",
+          "name": "<size-keyword>",
+          "prose": "Indicates that the calc-size() is basing its size off of the specified keyword. Represents any sizing keywords allowed in the context where the function is used. For example, in width, it matches auto, min-content, stretch, etc. Also allows any related sizing functions, like the fit-content() function in width/etc., which is a variation of the fit-content keyword. For all purposes other than actually resolving the size, the calc-size() acts like this keyword. The calc-size calculation will use the corresponding size as the value of its size keyword.",
+          "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-size-size-keyword",
+          "type": "type"
+        },
+        {
+          "name": "<calc-sum>",
+          "prose": "Indicates that the calc-size() is basing its size off of the specified calculation. For all purposes other than actually resolving the size, the calc-size() acts like this calculation wrapped in a calc() (including, for example, whether it represents a definite or indefinite size). The calc-size calculation will use the corresponding size as the value of its size keyword.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-calc-sum",
           "type": "value",
-          "value": "size"
+          "value": "<calc-sum>"
+        },
+        {
+          "name": "<calc-size()>",
+          "prose": "Indicates that the outer calc-size() is basing its size off of this inner calc-size(), and will share the same behavior as it. The calc-size calculation will use the size of the inner calc-size() as its size keyword. The size keyword is allowed, in this case, even if the inner calc-size() uses any. For example, in calc-size(calc-size(min-content, size / 2), size + 10%), the outer calc-size() acts as if its calc-size basis was min-content, and will calculate its own size using the result of the inner calc-size(), equivalent to calc-size(min-content, size / 2 + 10%).",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-calc-size",
+          "type": "value",
+          "value": "<calc-size()>"
         },
         {
           "name": "any",
-          "prose": "(If the calc-size basis is any, the calc-size() is a definite length, equal to its calc-size calculation.)",
+          "prose": "Indicates that the calc-size() does not depend on any additional information, and thus can be interpolated with any other size. The calc-size() function represents a definite size. The calc-size calculation cannot use the size keyword; it is a syntax error for size to appear in the calc-size calculation.",
           "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-any",
           "type": "value",
           "value": "any"
+        },
+        {
+          "name": "size",
+          "prose": "Within the calc-size calculation, the size is a <calc-keyword> which is a <length>, and resolves at used value time to the size specified above.",
+          "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-size",
+          "type": "value",
+          "value": "size"
         }
       ]
     },
@@ -812,13 +833,7 @@
       "name": "<calc-size-basis>",
       "href": "https://drafts.csswg.org/css-values-5/#typedef-calc-size-basis",
       "type": "type",
-      "value": "[ <size-keyword> | <calc-size()> | any | <calc-sum> ]"
-    },
-    {
-      "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"
+      "value": "[ <size-keyword> | <calc-sum> | <calc-size()> | any ]"
     }
   ],
   "warnings": [
@@ -841,6 +856,15 @@
       "msg": "Missing definition",
       "name": "interpolate-function()",
       "value": "interpolate-function( [ <progress-source> && [ by <easing-function> ]? && <easing-function>? && <segment-options>? ] , <input-position>{1,2} : <output-value> , [ [ <easing-function> || <segment-options> ]? , <input-position>{1,2} : <output-value> ]#? )"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "size",
+      "prose": "Within the calc-size calculation, the size is a <calc-keyword> which is a <length>, and resolves at used value time to the size specified above.",
+      "href": "https://drafts.csswg.org/css-values-5/#valdef-calc-size-size",
+      "type": "value",
+      "value": "size",
+      "for": "calc()"
     }
   ]
 }

package/css-view-transitions.json

@@ -189,7 +189,7 @@
   "selectors": [
     {
       "name": "::view-transition",
-      "prose": "The ::view-transition pseudo-element is a tree-abiding pseudo-element that is also a pseudo-element root. If its originating element is the document’s document element, its containing block is the snapshot containing block.",
+      "prose": "The ::view-transition pseudo-element is a fully styleable pseudo-element that is also a pseudo-element root. If its originating element is the document’s document element, its containing block is the snapshot containing block.",
       "href": "https://drafts.csswg.org/css-view-transitions-2/#selectordef-view-transition",
       "value": "::view-transition"
     },
@@ -241,7 +241,8 @@
       "name": "<view-transition-type>",
       "prose": "where <view-transition-type> is any <custom-ident> other than none, and not starting with the string \"-ua-\".",
       "href": "https://drafts.csswg.org/css-view-transitions-2/#typedef-view-transition-type",
-      "type": "type"
+      "type": "type",
+      "value": "<custom-ident>"
     },
     {
       "name": "<pt-name-and-class-selector>",

package/package.json

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

package/selectors.json

@@ -39,7 +39,7 @@
     },
     {
       "name": ":dir()",
-      "prose": "The :dir() pseudo-class allows the author to write selectors that represent an element based on its directionality as determined by the document language. For example, [HTML5] defines how to determine the directionality of an element, based on a combination of the dir attribute, the surrounding text, and other factors. As another example, the its:dir and dirRule element of the Internationalization Tag Set [ITS20] are able to define the directionality of an element in [XML10].",
+      "prose": "The :dir() pseudo-class allows the author to write selectors that represent an element based on its directionality as determined by the document language. For example, [HTML] defines how to determine the directionality of an element, based on a combination of the dir attribute, the surrounding text, and other factors. As another example, the its:dir and dirRule element of the Internationalization Tag Set [ITS20] are able to define the directionality of an element in [XML10].",
       "href": "https://drafts.csswg.org/selectors-4/#dir-pseudo"
     },
     {
@@ -49,7 +49,7 @@
     },
     {
       "name": ":any-link",
-      "prose": "The :any-link pseudo-class represents an element that acts as the source anchor of a hyperlink. For example, in [HTML5], any a or area elements with an href attribute are hyperlinks, and thus match :any-link. It matches an element if the element would match either :link or :visited, and is equivalent to :is(:link, :visited).",
+      "prose": "The :any-link pseudo-class represents an element that acts as the source anchor of a hyperlink. For example, in [HTML], any a or area elements with an href attribute are hyperlinks, and thus match :any-link. It matches an element if the element would match either :link or :visited, and is equivalent to :is(:link, :visited).",
       "href": "https://drafts.csswg.org/selectors-4/#any-link-pseudo",
       "value": ":any-link"
     },
@@ -205,7 +205,7 @@
     },
     {
       "name": ":placeholder-shown",
-      "prose": "Input elements can sometimes show placeholder text as a hint to the user on what to type in. See, for example, the placeholder attribute in [HTML5]. The :placeholder-shown pseudo-class matches an input element that is showing such placeholder text, whether that text is given by an attribute or a real element, or is otherwise implied by the UA.",
+      "prose": "Input elements can sometimes show placeholder text as a hint to the user on what to type in. See, for example, the placeholder attribute in [HTML]. The :placeholder-shown pseudo-class matches an input element that is showing such placeholder text, whether that text is given by an attribute or a real element, or is otherwise implied by the UA.",
       "href": "https://drafts.csswg.org/selectors-4/#placeholder-shown-pseudo",
       "value": ":placeholder-shown"
     },
@@ -223,13 +223,13 @@
     },
     {
       "name": ":checked",
-      "prose": "When such elements are toggled “on” the :checked pseudo-class applies. For example, [HTML5] defines that checked checkboxes, radio buttons, and selected <option> elements match :checked. Similarly, when such elements are toggled “off”, the :unchecked pseudo-class applies.",
+      "prose": "When such elements are toggled “on” the :checked pseudo-class applies. For example, [HTML] defines that checked checkboxes, radio buttons, and selected <option> elements match :checked. Similarly, when such elements are toggled “off”, the :unchecked pseudo-class applies.",
       "href": "https://drafts.csswg.org/selectors-4/#checked-pseudo",
       "value": ":checked"
     },
     {
       "name": ":unchecked",
-      "prose": "When such elements are toggled “on” the :checked pseudo-class applies. For example, [HTML5] defines that checked checkboxes, radio buttons, and selected <option> elements match :checked. Similarly, when such elements are toggled “off”, the :unchecked pseudo-class applies.",
+      "prose": "When such elements are toggled “on” the :checked pseudo-class applies. For example, [HTML] defines that checked checkboxes, radio buttons, and selected <option> elements match :checked. Similarly, when such elements are toggled “off”, the :unchecked pseudo-class applies.",
       "href": "https://drafts.csswg.org/selectors-4/#unchecked-pseudo",
       "value": ":unchecked"
     },
@@ -241,13 +241,13 @@
     },
     {
       "name": ":valid",
-      "prose": "An element is :valid or :invalid when its contents or value is, respectively, valid or invalid with respect to data validity semantics defined by the document language (e.g. [XFORMS11] or [HTML5]). An element which lacks data validity semantics is neither :valid nor :invalid.",
+      "prose": "An element is :valid or :invalid when its contents or value is, respectively, valid or invalid with respect to data validity semantics defined by the document language (e.g. [XFORMS11] or [HTML]). An element which lacks data validity semantics is neither :valid nor :invalid.",
       "href": "https://drafts.csswg.org/selectors-4/#valid-pseudo",
       "value": ":valid"
     },
     {
       "name": ":invalid",
-      "prose": "An element is :valid or :invalid when its contents or value is, respectively, valid or invalid with respect to data validity semantics defined by the document language (e.g. [XFORMS11] or [HTML5]). An element which lacks data validity semantics is neither :valid nor :invalid.",
+      "prose": "An element is :valid or :invalid when its contents or value is, respectively, valid or invalid with respect to data validity semantics defined by the document language (e.g. [XFORMS11] or [HTML]). An element which lacks data validity semantics is neither :valid nor :invalid.",
       "href": "https://drafts.csswg.org/selectors-4/#invalid-pseudo",
       "value": ":invalid"
     },
@@ -549,5 +549,25 @@
       "href": "https://drafts.csswg.org/selectors-4/#typedef-forgiving-selector-list",
       "type": "type"
     }
+  ],
+  "warnings": [
+    {
+      "msg": "Dangling value",
+      "name": "i",
+      "prose": "To match attribute values ASCII case-insensitively regardless of document language rules, the attribute selector may include the identifier i before the closing bracket (]). When this flag is present, UAs must match the attribute’s value ASCII case-insensitively (i.e. [a-z] and [A-Z] are considered equivalent).",
+      "href": "https://drafts.csswg.org/selectors-4/#valdef-attribute-selector-i",
+      "type": "value",
+      "value": "i",
+      "for": "attribute selector"
+    },
+    {
+      "msg": "Dangling value",
+      "name": "s",
+      "prose": "Alternately, the attribute selector may include the identifier s before the closing bracket (]); in this case the UA must match the value case-sensitively, with “identical to” semantics [INFRA], regardless of document language rules.",
+      "href": "https://drafts.csswg.org/selectors-4/#valdef-attribute-selector-s",
+      "type": "value",
+      "value": "s",
+      "for": "attribute selector"
+    }
   ]
 }